svelte-ux
svelte-ux copied to clipboard
Improve docs
- [x] Move ToC to right side (and sticky) instead of top
- See content quicker, especially on long pages
- Always see ToC to allow jumping easier
- [x] Show active toc item
- [x] Handle links to headers (Examples, APIs). Add missing links
- [x] Simplify building ToC (no svelte preprocessor)
- [x] Simplify getting name and source/doc urls, and description (no svelte preprocessor)
- Use
page.js
load?
- Use
- [x] Handle Preview as svelte preprocessor instead of remark plugin
- Enable usage on non-markdown pages (further goal)
- Should fix passing props to Preview (class, etc)
- Should fix showing in some layout use cases (ex. Badge placement)
- [ ] Parse docs/function signatures for actions and stores
- https://github.com/microsoft/TypeScript/wiki/Using-the-Compiler-API#using-the-type-checker
- https://github.com/buehler/node-typescript-parser#readme
- https://stackoverflow.com/questions/39588436/how-to-parse-typescript-definition-to-json
- https://medium.com/leopards-lab/parsing-d-ts-files-using-typescript-compiler-week-1-gsoc21-8f9e794b9c63
- https://github.com/mattjennings/vite-plugin-sveld/blob/main/index.js
- https://github.com/asakusuma/json-typescript-docs
- tsdoc
- https://microsoft.github.io/tsdoc/
- https://github.com/microsoft/tsdoc/blob/main/api-demo/src/simpleDemo.ts
- https://github.com/TyrealHu/acorn-typescript
-
typedoc
- typedoc-json-parser
- https://github.com/grail-ui/grail-ui/tree/master/apps/docs/src/lib/api-documenter
- [x] Consider removing markdown
- Pros
- Type checking
- Better prettier formatting
- Better errors
- Allow for quickfix (imports, etc) and highlighting unused imports
- Allow blank lines in Preview examples
- Cons
- Headers (
# Something
, lists (`- Something), and code blocks (```js) would be less ergonomic- Adding components could get close (but would require imports and still less ergonomic)
- Code examples (```js) not as ergonomic as
<Code>
- https://www.skeleton.dev/utilities/codeblocks
- https://github.com/ScriptRaccoon/codeblocks/
- https://rodneylab.com/sveltekit-shiki-syntax-highlighting/
- Explicit paragraphs
- Headers (
- Pros
- [x] Add search / quick jump
- https://vitejs.dev/guide/features.html#glob-import
- [ ] Improve design
- https://tailwindcss.com/blog/2022-12-15-protocol-api-documentation-template
- https://observablehq.com/plot/
- https://kitdocs.vercel.app/docs/getting-started/introduction
- https://www.radix-ui.com/
- https://ui.shadcn.com/docs/components/accordion
- https://atlassian.design/components
- https://www.tremor.so/components
- https://vaniersel.com/
- https://lunarui.dev/
- [ ] Update front page (considering listing all components with previews)
- https://www.radix-svelte.com/
- https://ui.mantine.dev/
- https://nextui.org/
- https://ant.design/components/overview
- https://chakra-ui.com/docs/components
- https://lunarui.dev/components
- https://mantine.dev/
- https://typehero.dev/
- [ ] Add component to edit enabled Logger (
localStorage.logger = 'MyComponent:INFO,OtherComponent'
) - [ ] Allow headers to be clickable links
- If switching away from markdown, using
<Header id="...">...</Header>
would be easy - If not, doing it as a remark/etc plugin
- If switching away from markdown, using
- [ ] For each component, add
- [ ] Description
- [ ] Features list
- [ ] Related (actions, components)
- [ ] Consider switching from PrismJS to Shiki to code highlighting
- [ ] Add jsdoc comments to all props to improve sveld api docs
- classes:
/** @type {{root?: string, icon?: string, loading?: string}} */
- classes: