From 9a918a5b4902f43729f4d023257772710af3a12b Mon Sep 17 00:00:00 2001 From: HiDeoo Date: Fri, 1 Mar 2024 18:26:33 +0100 Subject: Add `` component (#1308) * feat: add basic file tree rehype processor * feat: add basic file tree component * feat: add basic file icon support * feat: folder icon * feat: file icon * feat: port old icons and add new ones * refactor: simplify partial definitions * chore: add demo page * feat: add localized directory label * feat: validation * test: add file tree tests * docs: update demo * refactor: tweak error messsages * docs: add file tree component documentation * docs: update i18n ui strings * docs: replace file tree component * refactor: component name * chore: add changesets * feat: add file icons generator package * docs: revert docs file tree component replacements * chore: update icons changeset * chore: clean file icons generator `package.json` file * chore: ignore file icons generator in changeset configuration * fix: add `fileTree.directory` ui string for `zh-TW` * feat: prefix all Seti icons with `seti:` * feat: make Seti repo branch configurable * fix: improve file tree component errors wording * fix: udpate astro icon * docs: move components icon section to the bottom of the page * fix: add any point wrapping to icons list in the docs An icon name like `seti:crystal_embedded` would overflow. * chore: update changesets * fix: add prefix support to aliases * chore: slim down changeset Co-authored-by: Chris Swithinbank <357379+delucis@users.noreply.github.com> * docs: apply suggested improvements Co-authored-by: Chris Swithinbank <357379+delucis@users.noreply.github.com> * fix: update error snapshots * feat: add `mdx` icon and mapping * feat: add Markdown backticks in error messages Co-authored-by: Chris Swithinbank <357379+delucis@users.noreply.github.com> * fix: update file tree validation error documentation anchor * chore: remove file tree demo page * refactor: use rehype in fragment mode Co-authored-by: Chris Swithinbank <357379+delucis@users.noreply.github.com> --------- Co-authored-by: Chris Swithinbank <357379+delucis@users.noreply.github.com> Co-authored-by: Chris Swithinbank --- .changeset/config.json | 2 +- .changeset/hot-paws-work.md | 5 + .changeset/mighty-adults-help.md | 5 + .changeset/smart-planets-flow.md | 5 + docs/src/components/icons-list.astro | 1 + docs/src/content/docs/guides/components.mdx | 103 ++- docs/src/content/docs/guides/i18n.mdx | 3 +- packages/file-icons-generator/config.ts | 93 +++ packages/file-icons-generator/index.ts | 24 + packages/file-icons-generator/package.json | 18 + packages/file-icons-generator/utils/file.ts | 81 +++ packages/file-icons-generator/utils/font.ts | 131 ++++ packages/file-icons-generator/utils/seti.ts | 92 +++ .../remark-rehype/rehype-file-tree.test.ts | 177 +++++ .../remark-rehype/snapshots/file-tree-basic.html | 7 + .../snapshots/file-tree-comment-nodes.html | 1 + .../snapshots/file-tree-comment-text.html | 1 + packages/starlight/components.ts | 1 + packages/starlight/components/Icons.ts | 16 +- packages/starlight/package.json | 2 + packages/starlight/schemas/i18n.ts | 4 + packages/starlight/translations/ar.json | 3 +- packages/starlight/translations/cs.json | 3 +- packages/starlight/translations/da.json | 3 +- packages/starlight/translations/de.json | 3 +- packages/starlight/translations/en.json | 3 +- packages/starlight/translations/es.json | 3 +- packages/starlight/translations/fa.json | 3 +- packages/starlight/translations/fr.json | 3 +- packages/starlight/translations/gl.json | 3 +- packages/starlight/translations/he.json | 3 +- packages/starlight/translations/hi.json | 3 +- packages/starlight/translations/id.json | 3 +- packages/starlight/translations/it.json | 3 +- packages/starlight/translations/ja.json | 3 +- packages/starlight/translations/ko.json | 3 +- packages/starlight/translations/nb.json | 3 +- packages/starlight/translations/nl.json | 3 +- packages/starlight/translations/pt.json | 3 +- packages/starlight/translations/ro.json | 3 +- packages/starlight/translations/ru.json | 3 +- packages/starlight/translations/sv.json | 3 +- packages/starlight/translations/tr.json | 3 +- packages/starlight/translations/uk.json | 3 +- packages/starlight/translations/vi.json | 3 +- packages/starlight/translations/zh-CN.json | 3 +- packages/starlight/translations/zh-TW.json | 3 +- packages/starlight/user-components/FileTree.astro | 139 ++++ .../starlight/user-components/file-tree-icons.ts | 755 +++++++++++++++++++++ .../starlight/user-components/rehype-file-tree.ts | 251 +++++++ pnpm-lock.yaml | 299 ++++++++ 51 files changed, 2238 insertions(+), 56 deletions(-) create mode 100644 .changeset/hot-paws-work.md create mode 100644 .changeset/mighty-adults-help.md create mode 100644 .changeset/smart-planets-flow.md create mode 100644 packages/file-icons-generator/config.ts create mode 100644 packages/file-icons-generator/index.ts create mode 100644 packages/file-icons-generator/package.json create mode 100644 packages/file-icons-generator/utils/file.ts create mode 100644 packages/file-icons-generator/utils/font.ts create mode 100644 packages/file-icons-generator/utils/seti.ts create mode 100644 packages/starlight/__tests__/remark-rehype/rehype-file-tree.test.ts create mode 100644 packages/starlight/__tests__/remark-rehype/snapshots/file-tree-basic.html create mode 100644 packages/starlight/__tests__/remark-rehype/snapshots/file-tree-comment-nodes.html create mode 100644 packages/starlight/__tests__/remark-rehype/snapshots/file-tree-comment-text.html create mode 100644 packages/starlight/user-components/FileTree.astro create mode 100644 packages/starlight/user-components/file-tree-icons.ts create mode 100644 packages/starlight/user-components/rehype-file-tree.ts diff --git a/.changeset/config.json b/.changeset/config.json index a79c64d5..1a3e4d0d 100644 --- a/.changeset/config.json +++ b/.changeset/config.json @@ -9,7 +9,7 @@ "access": "public", "baseBranch": "main", "updateInternalDependencies": "patch", - "ignore": ["starlight-docs", "@example/*"], + "ignore": ["starlight-docs", "@example/*", "starlight-file-icons-generator"], "___experimentalUnsafeOptions_WILL_CHANGE_IN_PATCH": { "onlyUpdatePeerDependentsWhenOutOfRange": true } diff --git a/.changeset/hot-paws-work.md b/.changeset/hot-paws-work.md new file mode 100644 index 00000000..23405d18 --- /dev/null +++ b/.changeset/hot-paws-work.md @@ -0,0 +1,5 @@ +--- +'@astrojs/starlight': minor +--- + +Adds `` component to display the structure of a directory. diff --git a/.changeset/mighty-adults-help.md b/.changeset/mighty-adults-help.md new file mode 100644 index 00000000..728d542f --- /dev/null +++ b/.changeset/mighty-adults-help.md @@ -0,0 +1,5 @@ +--- +'@astrojs/starlight': minor +--- + +Adds 144 new file-type icons from the [Seti UI icon set](https://github.com/jesseweed/seti-ui#current-icons), available with the `seti:` prefix, e.g. `seti:javascript`. diff --git a/.changeset/smart-planets-flow.md b/.changeset/smart-planets-flow.md new file mode 100644 index 00000000..de3fc70d --- /dev/null +++ b/.changeset/smart-planets-flow.md @@ -0,0 +1,5 @@ +--- +'@astrojs/starlight': minor +--- + +Adds 5 new icons: `astro`, `biome`, `bun`, `mdx`, and `pnpm`. diff --git a/docs/src/components/icons-list.astro b/docs/src/components/icons-list.astro index ee1146c0..09b0a699 100644 --- a/docs/src/components/icons-list.astro +++ b/docs/src/components/icons-list.astro @@ -54,6 +54,7 @@ const icons = Object.keys(Icons) as (keyof typeof Icons)[]; font-size: var(--sl-text-sm); gap: 0.25rem; margin: 0; + overflow-wrap: anywhere; padding: 0.75rem; background: none; } diff --git a/docs/src/content/docs/guides/components.mdx b/docs/src/content/docs/guides/components.mdx index 8db1a553..dff8be68 100644 --- a/docs/src/content/docs/guides/components.mdx +++ b/docs/src/content/docs/guides/components.mdx @@ -233,33 +233,6 @@ Other content is also supported in asides. Starlight also provides a custom syntax for rendering asides in Markdown and MDX as an alternative to the `