How can I directly use streamlit to create sidebars similar to those in pictures?
One option is to use this library GitHub - arnaudmiribel/stoc to create a table-of-contents section in the sidebar.
Is that what youāre looking for?
Yes, itās great! In fact, I want to read Word documentsļ¼Such as a xxx.doc or xxx.docx documentļ¼ with images and text directly through Streamlit. Whatās a good solution?
@Bruce_Yin In my experience, .docx tend to be easier to work with, because they use a more open standard than .doc files. I havenāt used this particular library, but this looks like it would be a good library to use: python-docx ā python-docx 0.8.11 documentation
Yes, the files I intend to display using streamlit are all in .docx format. As far as you know, is there a better way or demo to render .docx files directly through streamlit? thanksļ¼
Hereās one way, using the mammoth library, which can convert docx into either markdown or html
import mammoth
import streamlit as st
import streamlit.components.v1 as components
uploaded = st.file_uploader("Upload docx", type="docx")
if uploaded is not None:
md, html = st.tabs(["Markdown", "HTML"])
with md:
result = mammoth.convert_to_markdown(uploaded).value
st.markdown(result)
with html:
result = mammoth.convert_to_html(uploaded).value
components.html(result, height=500, scrolling=True)
Great! My DOCX document can be displayed. May I ask how to display the directory structure in DOCX in the sidebar through variable result and stoc()? (how do I loop out from variable result?)
Iterating on the stoc library I referenced before, this is one way you could accomplish it ā just get the markdown from mammoth, and pass it to stoc.from_markdown
streamlit_app.py
import streamlit as st
from stoc2 import stoc
text = """
# Testing
Some stuff
## More stuff
### Even more stuff
More stuff?
_italics_
List:
* A
* B
* C
# New H1
"""
stoc.from_markdown(text)
stoc2.py
import streamlit as st
import unidecode
DISABLE_LINK_CSS = """
<style>
a.toc {
color: inherit;
text-decoration: none; /* no underline */
}
</style>"""
class stoc:
def __init__(self):
self.toc_items = list()
def _h1(self, text):
self.toc_items.append(("h1", text))
def _h2(self, text):
self.toc_items.append(("h2", text))
def _h3(self, text):
self.toc_items.append(("h3", text))
def toc(self):
st.write(DISABLE_LINK_CSS, unsafe_allow_html=True)
st.sidebar.caption("Table of contents")
markdown_toc = ""
for title_size, title in self.toc_items:
h = int(title_size.replace("h", ""))
markdown_toc += (
" " * 2 * h
+ "- "
+ f'<a href="#{normalize(title)}" class="toc"> {title}</a> \n'
)
st.sidebar.write(markdown_toc, unsafe_allow_html=True)
@classmethod
def from_markdown(cls, text: str):
self = cls()
for line in text.splitlines():
if line.startswith("###"):
self._h3(line[3:])
elif line.startswith("##"):
self._h2(line[2:])
elif line.startswith("#"):
self._h1(line[1:])
st.write(text)
self.toc()
def normalize(s):
"""
Normalize titles as valid HTML ids for anchors
>>> normalize("it's a test to spot how Things happ3n hƩhƩ")
"it-s-a-test-to-spot-how-things-happ3n-h-h"
"""
# Replace accents with "-"
s_wo_accents = unidecode.unidecode(s)
accents = [s for s in s if s not in s_wo_accents]
for accent in accents:
s = s.replace(accent, "-")
# Lowercase
s = s.lower()
# Keep only alphanum and remove "-" suffix if existing
normalized = (
"".join([char if char.isalnum() else "-" for char in s]).strip("-").lower()
)
return
Whereās the pull request @blackary??? Pull requests Ā· arnaudmiribel/stoc Ā· GitHub 
