├── .gitattributes ├── .gitignore ├── LICENSE ├── README.md ├── packages └── cli │ ├── index.js │ ├── package-lock.json │ └── package.json └── sites └── docs ├── .npmrc ├── .prettierignore ├── .prettierrc ├── Dockerfile ├── README.md ├── components.json ├── eslint.config.js ├── package-lock.json ├── package.json ├── postcss.config.js ├── src ├── app.css ├── app.d.ts ├── app.html ├── lib │ ├── assets │ │ └── img │ │ │ ├── tzezar-logo-black.png │ │ │ └── tzezar-logo-white.png │ ├── components │ │ ├── tzezars-enhancements │ │ │ ├── avatar-group │ │ │ │ ├── avatar-group-member.svelte │ │ │ │ ├── avatar-group-more.svelte │ │ │ │ ├── avatar-group.svelte │ │ │ │ └── index.ts │ │ │ ├── code-block │ │ │ │ ├── code-block.svelte │ │ │ │ ├── index.ts │ │ │ │ └── shiki.ts │ │ │ ├── code-preview │ │ │ │ ├── code-preview.svelte │ │ │ │ └── index.ts │ │ │ ├── code-snippet │ │ │ │ ├── code-snippet.svelte │ │ │ │ └── index.ts │ │ │ ├── copy-button │ │ │ │ ├── copy-button.svelte │ │ │ │ └── index.ts │ │ │ ├── file-dropzone │ │ │ │ ├── file-dropzone.svelte │ │ │ │ ├── index.ts │ │ │ │ └── types.ts │ │ │ ├── link │ │ │ │ ├── index.ts │ │ │ │ └── link.svelte │ │ │ ├── password-input │ │ │ │ ├── index.ts │ │ │ │ └── password-input.svelte │ │ │ ├── scroll-progress-indicator │ │ │ │ ├── index.ts │ │ │ │ ├── scroll-progress-indicator.svelte │ │ │ │ └── types.ts │ │ │ ├── transfer-list │ │ │ │ ├── index.ts │ │ │ │ ├── transfer-list-body.svelte │ │ │ │ ├── transfer-list-container.svelte │ │ │ │ ├── transfer-list-core.svelte.ts │ │ │ │ ├── transfer-list-item.svelte │ │ │ │ ├── transfer-list-title.svelte │ │ │ │ ├── transfer-list-toolbar.svelte │ │ │ │ └── transfer-list.svelte │ │ │ ├── virtual-select │ │ │ │ ├── index.ts │ │ │ │ ├── types.ts │ │ │ │ ├── virtual-select-body.svelte │ │ │ │ ├── virtual-select-content-wrapper.svelte │ │ │ │ ├── virtual-select-content.svelte │ │ │ │ ├── virtual-select-item.svelte │ │ │ │ ├── virtual-select-root.svelte │ │ │ │ └── virtual-select-trigger.svelte │ │ │ └── virtualization │ │ │ │ ├── README.md │ │ │ │ ├── index.ts │ │ │ │ └── virtualization.svelte │ │ └── ui │ │ │ ├── accordion │ │ │ ├── accordion-content.svelte │ │ │ ├── accordion-item.svelte │ │ │ ├── accordion-trigger.svelte │ │ │ └── index.ts │ │ │ ├── alert-dialog │ │ │ ├── alert-dialog-action.svelte │ │ │ ├── alert-dialog-cancel.svelte │ │ │ ├── alert-dialog-content.svelte │ │ │ ├── alert-dialog-description.svelte │ │ │ ├── alert-dialog-footer.svelte │ │ │ ├── alert-dialog-header.svelte │ │ │ ├── alert-dialog-overlay.svelte │ │ │ ├── alert-dialog-title.svelte │ │ │ └── index.ts │ │ │ ├── alert │ │ │ ├── alert-description.svelte │ │ │ ├── alert-title.svelte │ │ │ ├── alert.svelte │ │ │ └── index.ts │ │ │ ├── aspect-ratio │ │ │ └── index.ts │ │ │ ├── avatar │ │ │ ├── avatar-fallback.svelte │ │ │ ├── avatar-image.svelte │ │ │ ├── avatar.svelte │ │ │ └── index.ts │ │ │ ├── badge │ │ │ ├── badge.svelte │ │ │ └── index.ts │ │ │ ├── breadcrumb │ │ │ ├── breadcrumb-ellipsis.svelte │ │ │ ├── breadcrumb-item.svelte │ │ │ ├── breadcrumb-link.svelte │ │ │ ├── breadcrumb-list.svelte │ │ │ ├── breadcrumb-page.svelte │ │ │ ├── breadcrumb-separator.svelte │ │ │ ├── breadcrumb.svelte │ │ │ └── index.ts │ │ │ ├── button │ │ │ ├── button.svelte │ │ │ └── index.ts │ │ │ ├── calendar │ │ │ ├── calendar-cell.svelte │ │ │ ├── calendar-day.svelte │ │ │ ├── calendar-grid-body.svelte │ │ │ ├── calendar-grid-head.svelte │ │ │ ├── calendar-grid-row.svelte │ │ │ ├── calendar-grid.svelte │ │ │ ├── calendar-head-cell.svelte │ │ │ ├── calendar-header.svelte │ │ │ ├── calendar-heading.svelte │ │ │ ├── calendar-months.svelte │ │ │ ├── calendar-next-button.svelte │ │ │ ├── calendar-prev-button.svelte │ │ │ ├── calendar.svelte │ │ │ └── index.ts │ │ │ ├── card │ │ │ ├── card-content.svelte │ │ │ ├── card-description.svelte │ │ │ ├── card-footer.svelte │ │ │ ├── card-header.svelte │ │ │ ├── card-title.svelte │ │ │ ├── card.svelte │ │ │ └── index.ts │ │ │ ├── carousel │ │ │ ├── carousel-content.svelte │ │ │ ├── carousel-item.svelte │ │ │ ├── carousel-next.svelte │ │ │ ├── carousel-previous.svelte │ │ │ ├── carousel.svelte │ │ │ ├── context.ts │ │ │ └── index.ts │ │ │ ├── checkbox │ │ │ ├── checkbox.svelte │ │ │ └── index.ts │ │ │ ├── collapsible │ │ │ └── index.ts │ │ │ ├── command │ │ │ ├── command-dialog.svelte │ │ │ ├── command-empty.svelte │ │ │ ├── command-group.svelte │ │ │ ├── command-input.svelte │ │ │ ├── command-item.svelte │ │ │ ├── command-link-item.svelte │ │ │ ├── command-list.svelte │ │ │ ├── command-separator.svelte │ │ │ ├── command-shortcut.svelte │ │ │ ├── command.svelte │ │ │ └── index.ts │ │ │ ├── context-menu │ │ │ ├── context-menu-checkbox-item.svelte │ │ │ ├── context-menu-content.svelte │ │ │ ├── context-menu-group-heading.svelte │ │ │ ├── context-menu-item.svelte │ │ │ ├── context-menu-radio-item.svelte │ │ │ ├── context-menu-separator.svelte │ │ │ ├── context-menu-shortcut.svelte │ │ │ ├── context-menu-sub-content.svelte │ │ │ ├── context-menu-sub-trigger.svelte │ │ │ └── index.ts │ │ │ ├── data-table │ │ │ ├── data-table.svelte.ts │ │ │ ├── flex-render.svelte │ │ │ ├── index.ts │ │ │ └── render-helpers.ts │ │ │ ├── dialog │ │ │ ├── dialog-content.svelte │ │ │ ├── dialog-description.svelte │ │ │ ├── dialog-footer.svelte │ │ │ ├── dialog-header.svelte │ │ │ ├── dialog-overlay.svelte │ │ │ ├── dialog-title.svelte │ │ │ └── index.ts │ │ │ ├── drawer │ │ │ ├── drawer-content.svelte │ │ │ ├── drawer-description.svelte │ │ │ ├── drawer-footer.svelte │ │ │ ├── drawer-header.svelte │ │ │ ├── drawer-nested.svelte │ │ │ ├── drawer-overlay.svelte │ │ │ ├── drawer-title.svelte │ │ │ ├── drawer.svelte │ │ │ └── index.ts │ │ │ ├── dropdown-menu │ │ │ ├── dropdown-menu-checkbox-item.svelte │ │ │ ├── dropdown-menu-content.svelte │ │ │ ├── dropdown-menu-group-heading.svelte │ │ │ ├── dropdown-menu-item.svelte │ │ │ ├── dropdown-menu-label.svelte │ │ │ ├── dropdown-menu-radio-item.svelte │ │ │ ├── dropdown-menu-separator.svelte │ │ │ ├── dropdown-menu-shortcut.svelte │ │ │ ├── dropdown-menu-sub-content.svelte │ │ │ ├── dropdown-menu-sub-trigger.svelte │ │ │ └── index.ts │ │ │ ├── form │ │ │ ├── form-button.svelte │ │ │ ├── form-description.svelte │ │ │ ├── form-element-field.svelte │ │ │ ├── form-field-errors.svelte │ │ │ ├── form-field.svelte │ │ │ ├── form-fieldset.svelte │ │ │ ├── form-label.svelte │ │ │ ├── form-legend.svelte │ │ │ └── index.ts │ │ │ ├── hover-card │ │ │ ├── hover-card-content.svelte │ │ │ └── index.ts │ │ │ ├── input-otp │ │ │ ├── index.ts │ │ │ ├── input-otp-group.svelte │ │ │ ├── input-otp-separator.svelte │ │ │ ├── input-otp-slot.svelte │ │ │ └── input-otp.svelte │ │ │ ├── input │ │ │ ├── index.ts │ │ │ └── input.svelte │ │ │ ├── label │ │ │ ├── index.ts │ │ │ └── label.svelte │ │ │ ├── menubar │ │ │ ├── index.ts │ │ │ ├── menubar-checkbox-item.svelte │ │ │ ├── menubar-content.svelte │ │ │ ├── menubar-group-heading.svelte │ │ │ ├── menubar-item.svelte │ │ │ ├── menubar-radio-item.svelte │ │ │ ├── menubar-separator.svelte │ │ │ ├── menubar-shortcut.svelte │ │ │ ├── menubar-sub-content.svelte │ │ │ ├── menubar-sub-trigger.svelte │ │ │ ├── menubar-trigger.svelte │ │ │ └── menubar.svelte │ │ │ ├── pagination │ │ │ ├── index.ts │ │ │ ├── pagination-content.svelte │ │ │ ├── pagination-ellipsis.svelte │ │ │ ├── pagination-item.svelte │ │ │ ├── pagination-link.svelte │ │ │ ├── pagination-next-button.svelte │ │ │ ├── pagination-prev-button.svelte │ │ │ └── pagination.svelte │ │ │ ├── popover │ │ │ ├── index.ts │ │ │ └── popover-content.svelte │ │ │ ├── progress │ │ │ ├── index.ts │ │ │ └── progress.svelte │ │ │ ├── radio-group │ │ │ ├── index.ts │ │ │ ├── radio-group-item.svelte │ │ │ └── radio-group.svelte │ │ │ ├── range-calendar │ │ │ ├── index.ts │ │ │ ├── range-calendar-cell.svelte │ │ │ ├── range-calendar-day.svelte │ │ │ ├── range-calendar-grid-row.svelte │ │ │ ├── range-calendar-grid.svelte │ │ │ ├── range-calendar-head-cell.svelte │ │ │ ├── range-calendar-header.svelte │ │ │ ├── range-calendar-heading.svelte │ │ │ ├── range-calendar-months.svelte │ │ │ ├── range-calendar-next-button.svelte │ │ │ ├── range-calendar-prev-button.svelte │ │ │ └── range-calendar.svelte │ │ │ ├── resizable │ │ │ ├── index.ts │ │ │ ├── resizable-handle.svelte │ │ │ └── resizable-pane-group.svelte │ │ │ ├── scroll-area │ │ │ ├── index.ts │ │ │ ├── scroll-area-scrollbar.svelte │ │ │ └── scroll-area.svelte │ │ │ ├── select │ │ │ ├── index.ts │ │ │ ├── select-content.svelte │ │ │ ├── select-group-heading.svelte │ │ │ ├── select-item.svelte │ │ │ ├── select-scroll-down-button.svelte │ │ │ ├── select-scroll-up-button.svelte │ │ │ ├── select-separator.svelte │ │ │ └── select-trigger.svelte │ │ │ ├── separator │ │ │ ├── index.ts │ │ │ └── separator.svelte │ │ │ ├── sheet │ │ │ ├── index.ts │ │ │ ├── sheet-content.svelte │ │ │ ├── sheet-description.svelte │ │ │ ├── sheet-footer.svelte │ │ │ ├── sheet-header.svelte │ │ │ ├── sheet-overlay.svelte │ │ │ └── sheet-title.svelte │ │ │ ├── sidebar │ │ │ ├── constants.ts │ │ │ ├── context.svelte.ts │ │ │ ├── index.ts │ │ │ ├── sidebar-content.svelte │ │ │ ├── sidebar-footer.svelte │ │ │ ├── sidebar-group-action.svelte │ │ │ ├── sidebar-group-content.svelte │ │ │ ├── sidebar-group-label.svelte │ │ │ ├── sidebar-group.svelte │ │ │ ├── sidebar-header.svelte │ │ │ ├── sidebar-input.svelte │ │ │ ├── sidebar-inset.svelte │ │ │ ├── sidebar-menu-action.svelte │ │ │ ├── sidebar-menu-badge.svelte │ │ │ ├── sidebar-menu-button.svelte │ │ │ ├── sidebar-menu-item.svelte │ │ │ ├── sidebar-menu-skeleton.svelte │ │ │ ├── sidebar-menu-sub-button.svelte │ │ │ ├── sidebar-menu-sub-item.svelte │ │ │ ├── sidebar-menu-sub.svelte │ │ │ ├── sidebar-menu.svelte │ │ │ ├── sidebar-provider.svelte │ │ │ ├── sidebar-rail.svelte │ │ │ ├── sidebar-separator.svelte │ │ │ ├── sidebar-trigger.svelte │ │ │ └── sidebar.svelte │ │ │ ├── skeleton │ │ │ ├── index.ts │ │ │ └── skeleton.svelte │ │ │ ├── slider │ │ │ ├── index.ts │ │ │ └── slider.svelte │ │ │ ├── sonner │ │ │ ├── index.ts │ │ │ └── sonner.svelte │ │ │ ├── switch │ │ │ ├── index.ts │ │ │ └── switch.svelte │ │ │ ├── table │ │ │ ├── index.ts │ │ │ ├── table-body.svelte │ │ │ ├── table-caption.svelte │ │ │ ├── table-cell.svelte │ │ │ ├── table-footer.svelte │ │ │ ├── table-head.svelte │ │ │ ├── table-header.svelte │ │ │ ├── table-row.svelte │ │ │ └── table.svelte │ │ │ ├── tabs │ │ │ ├── index.ts │ │ │ ├── tabs-content.svelte │ │ │ ├── tabs-list.svelte │ │ │ └── tabs-trigger.svelte │ │ │ ├── textarea │ │ │ ├── index.ts │ │ │ └── textarea.svelte │ │ │ ├── toggle-group │ │ │ ├── index.ts │ │ │ ├── toggle-group-item.svelte │ │ │ └── toggle-group.svelte │ │ │ ├── toggle │ │ │ ├── index.ts │ │ │ └── toggle.svelte │ │ │ └── tooltip │ │ │ ├── index.ts │ │ │ └── tooltip-content.svelte │ ├── constants.ts │ ├── hooks │ │ ├── is-mobile.svelte.ts │ │ └── use-clipboard.svelte.ts │ ├── index.ts │ └── utils.ts ├── md.d.ts └── routes │ ├── (routes) │ ├── +layout.svelte │ ├── _components │ │ └── light-switch.svelte │ ├── _layout │ │ ├── app-sidebar-file-maybe.svelte │ │ ├── app-sidebar.svelte │ │ ├── nav-main.svelte │ │ ├── nav-projects.svelte │ │ ├── nav-quick-start.svelte │ │ ├── nav-secondary.svelte │ │ ├── nav-user.svelte │ │ ├── navigation-data.ts │ │ ├── sidebar-page.svelte │ │ └── svelte-icon.svelte │ ├── components │ │ ├── +page.svelte │ │ ├── +page.ts │ │ ├── avatar-group │ │ │ ├── +page.svelte │ │ │ ├── content.md │ │ │ ├── data.ts │ │ │ ├── examples.ts │ │ │ ├── horizontal.svelte │ │ │ └── vertical.svelte │ │ ├── code-block │ │ │ ├── +page.svelte │ │ │ ├── content.md │ │ │ ├── example.svelte │ │ │ └── examples.ts │ │ ├── code-snippet │ │ │ ├── +page.svelte │ │ │ ├── content.md │ │ │ ├── example.svelte │ │ │ └── examples.ts │ │ ├── copy-button │ │ │ ├── +page.svelte │ │ │ ├── content.md │ │ │ ├── example.svelte │ │ │ └── examples.ts │ │ ├── file-dropzone │ │ │ ├── +page.svelte │ │ │ ├── content.md │ │ │ ├── example.svelte │ │ │ └── examples.ts │ │ ├── link │ │ │ ├── +page.svelte │ │ │ ├── content.md │ │ │ ├── data.ts │ │ │ ├── examples.ts │ │ │ ├── link-example.svelte │ │ │ └── link-usage.svelte │ │ ├── password-input │ │ │ ├── +page.svelte │ │ │ ├── content.md │ │ │ ├── example.svelte │ │ │ └── examples.ts │ │ ├── scroll-progress-indicator │ │ │ ├── +page.svelte │ │ │ ├── content.md │ │ │ ├── example-bar.svelte │ │ │ ├── example.svelte │ │ │ ├── examples.ts │ │ │ └── interactive-demo.svelte │ │ ├── transfer-list │ │ │ ├── +page.svelte │ │ │ ├── content.md │ │ │ ├── data.ts │ │ │ ├── examples.ts │ │ │ ├── horizontal.svelte │ │ │ └── vertical.svelte │ │ └── virtual-select │ │ │ ├── +page.svelte │ │ │ ├── code-samples │ │ │ └── usage.ts │ │ │ ├── content.md │ │ │ ├── examples.ts │ │ │ ├── select-content.svelte │ │ │ ├── select-group.svelte │ │ │ ├── virtual-multi-select.svelte │ │ │ └── virtual-select.svelte │ └── quick-start │ │ └── installation │ │ ├── +page.svelte │ │ ├── content.md │ │ └── examples.ts │ ├── +layout.svelte │ └── +page.svelte ├── static ├── favicon.png ├── tzezar-logo-black.png └── tzezar-logo-white.png ├── svelte.config.js ├── tailwind.config.ts ├── tsconfig.json └── vite.config.ts /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | 3 | # Output 4 | .output 5 | .vercel 6 | .netlify 7 | .wrangler 8 | /.svelte-kit 9 | /build 10 | 11 | # OS 12 | .DS_Store 13 | Thumbs.db 14 | 15 | # Env 16 | .env 17 | .env.* 18 | !.env.example 19 | !.env.test 20 | 21 | # Vite 22 | vite.config.js.timestamp-* 23 | vite.config.ts.timestamp-* 24 | /cli/tzezars-enhancements 25 | /sites/docs/.svelte-kit 26 | /packages/cli/tzezars-enhancements 27 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2025 Sebastian Drozd 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /packages/cli/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "shadcn-svelte-enhancements", 3 | "version": "0.1.0", 4 | "type": "module", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "keywords": [ 10 | "cli", 11 | "svelte", 12 | "shadcn", 13 | "sveltekit", 14 | "components", 15 | "extras" 16 | ], 17 | "author": "Sebastian Drozd", 18 | "license": "ISC", 19 | "description": "additional components designed specifically for Shadcn-Svelte", 20 | "dependencies": { 21 | "chalk": "^5.4.1", 22 | "commander": "^12.1.0", 23 | "figlet": "^1.8.0", 24 | "fs-extra": "^11.3.0", 25 | "inquirer": "^12.4.2" 26 | }, 27 | "bin": { 28 | "shadcn-svelte-enhancements": "./index.js" 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /sites/docs/.npmrc: -------------------------------------------------------------------------------- 1 | engine-strict=true 2 | -------------------------------------------------------------------------------- /sites/docs/.prettierignore: -------------------------------------------------------------------------------- 1 | # Package Managers 2 | package-lock.json 3 | pnpm-lock.yaml 4 | yarn.lock 5 | -------------------------------------------------------------------------------- /sites/docs/.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "useTabs": true, 3 | "singleQuote": true, 4 | "trailingComma": "none", 5 | "printWidth": 100, 6 | "plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"], 7 | "overrides": [ 8 | { 9 | "files": "*.svelte", 10 | "options": { 11 | "parser": "svelte" 12 | } 13 | } 14 | ] 15 | } 16 | -------------------------------------------------------------------------------- /sites/docs/Dockerfile: -------------------------------------------------------------------------------- 1 | ARG NODE_VERSION=20-alpine 2 | FROM node:${NODE_VERSION} AS builder 3 | 4 | LABEL Developers="Sebastian Drozd" 5 | 6 | WORKDIR /app 7 | 8 | # Copy package.json and package-lock.json (if available) 9 | COPY package*.json ./ 10 | 11 | # Install all dependencies including devDependencies 12 | RUN npm ci 13 | 14 | # Copy all other source files 15 | COPY . . 16 | 17 | # Build the app 18 | RUN npm run build 19 | 20 | # Production stage 21 | FROM node:${NODE_VERSION} 22 | 23 | WORKDIR /app 24 | 25 | # Copy build output and package.json from the builder stage 26 | # Adjusting to copy from the correct location for SvelteKit builds 27 | COPY --from=builder /app/build ./build 28 | COPY --from=builder /app/package*.json ./ 29 | COPY --from=builder /app/node_modules ./node_modules 30 | 31 | # No need to run npm ci again if we copy node_modules 32 | # If you prefer a clean install, uncomment this line: 33 | # RUN npm ci --only=production 34 | 35 | # Expose the port the app runs on 36 | EXPOSE 3013 37 | 38 | # Start the app 39 | CMD ["node", "build"] -------------------------------------------------------------------------------- /sites/docs/README.md: -------------------------------------------------------------------------------- 1 | # sv 2 | 3 | Everything you need to build a Svelte project, powered by [`sv`](https://github.com/sveltejs/cli). 4 | 5 | ## Creating a project 6 | 7 | If you're seeing this, you've probably already done this step. Congrats! 8 | 9 | ```bash 10 | # create a new project in the current directory 11 | npx sv create 12 | 13 | # create a new project in my-app 14 | npx sv create my-app 15 | ``` 16 | 17 | ## Developing 18 | 19 | Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server: 20 | 21 | ```bash 22 | npm run dev 23 | 24 | # or start the server and open the app in a new browser tab 25 | npm run dev -- --open 26 | ``` 27 | 28 | ## Building 29 | 30 | To create a production version of your app: 31 | 32 | ```bash 33 | npm run build 34 | ``` 35 | 36 | You can preview the production build with `npm run preview`. 37 | 38 | > To deploy your app, you may need to install an [adapter](https://svelte.dev/docs/kit/adapters) for your target environment. 39 | -------------------------------------------------------------------------------- /sites/docs/components.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://next.shadcn-svelte.com/schema.json", 3 | "style": "default", 4 | "tailwind": { 5 | "config": "tailwind.config.ts", 6 | "css": "src\\app.css", 7 | "baseColor": "neutral" 8 | }, 9 | "aliases": { 10 | "components": "$lib/components", 11 | "utils": "$lib/utils", 12 | "ui": "$lib/components/ui", 13 | "hooks": "$lib/hooks" 14 | }, 15 | "typescript": true, 16 | "registry": "https://next.shadcn-svelte.com/registry" 17 | } 18 | -------------------------------------------------------------------------------- /sites/docs/eslint.config.js: -------------------------------------------------------------------------------- 1 | import prettier from 'eslint-config-prettier'; 2 | import js from '@eslint/js'; 3 | import { includeIgnoreFile } from '@eslint/compat'; 4 | import svelte from 'eslint-plugin-svelte'; 5 | import globals from 'globals'; 6 | import { fileURLToPath } from 'node:url'; 7 | import ts from 'typescript-eslint'; 8 | const gitignorePath = fileURLToPath(new URL('./.gitignore', import.meta.url)); 9 | 10 | export default ts.config( 11 | includeIgnoreFile(gitignorePath), 12 | js.configs.recommended, 13 | ...ts.configs.recommended, 14 | ...svelte.configs['flat/recommended'], 15 | prettier, 16 | ...svelte.configs['flat/prettier'], 17 | { 18 | languageOptions: { 19 | globals: { 20 | ...globals.browser, 21 | ...globals.node 22 | } 23 | } 24 | }, 25 | { 26 | files: ['**/*.svelte'], 27 | 28 | languageOptions: { 29 | parserOptions: { 30 | parser: ts.parser 31 | } 32 | } 33 | } 34 | ); 35 | -------------------------------------------------------------------------------- /sites/docs/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | tailwindcss: {}, 4 | autoprefixer: {} 5 | } 6 | }; 7 | -------------------------------------------------------------------------------- /sites/docs/src/app.d.ts: -------------------------------------------------------------------------------- 1 | // See https://svelte.dev/docs/kit/types#app.d.ts 2 | // for information about these interfaces 3 | declare global { 4 | namespace App { 5 | // interface Error {} 6 | // interface Locals {} 7 | // interface PageData {} 8 | // interface PageState {} 9 | // interface Platform {} 10 | } 11 | } 12 | 13 | export {}; 14 | -------------------------------------------------------------------------------- /sites/docs/src/app.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 11 | 12 | 13 | 14 | %sveltekit.head% 15 | 16 | 17 |
%sveltekit.body%
18 | 19 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/assets/img/tzezar-logo-black.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tzezar/shadcn-svelte-enhancements/aa7c2cb88d3cb853c75aa767ebd0efe5b25fa94e/sites/docs/src/lib/assets/img/tzezar-logo-black.png -------------------------------------------------------------------------------- /sites/docs/src/lib/assets/img/tzezar-logo-white.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tzezar/shadcn-svelte-enhancements/aa7c2cb88d3cb853c75aa767ebd0efe5b25fa94e/sites/docs/src/lib/assets/img/tzezar-logo-white.png -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/avatar-group/avatar-group-member.svelte: -------------------------------------------------------------------------------- 1 | 8 | 9 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/avatar-group/avatar-group-more.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
20 | {#if children} 21 | {@render children()} 22 | {:else} 23 | +{count} 24 | {/if} 25 |
26 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/avatar-group/avatar-group.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 |
22 | {#if children} 23 | {@render children()} 24 | {/if} 25 |
26 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/avatar-group/index.ts: -------------------------------------------------------------------------------- 1 | import Root from './avatar-group.svelte'; 2 | import Member from './avatar-group-member.svelte'; 3 | import More from './avatar-group-more.svelte'; 4 | 5 | import { Fallback, Image } from '$lib/components/ui/avatar'; 6 | 7 | export { Root, Member, More, Image, Fallback }; -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/code-block/index.ts: -------------------------------------------------------------------------------- 1 | import CodeBlock from './code-block.svelte'; 2 | 3 | export { CodeBlock }; -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/code-preview/index.ts: -------------------------------------------------------------------------------- 1 | import CodePreview from "./code-preview.svelte"; 2 | 3 | export { CodePreview }; -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/code-snippet/index.ts: -------------------------------------------------------------------------------- 1 | import CodeSnippet from "./code-snippet.svelte"; 2 | 3 | export { CodeSnippet }; -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/copy-button/index.ts: -------------------------------------------------------------------------------- 1 | import CopyButton from './copy-button.svelte'; 2 | 3 | export { CopyButton }; -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/file-dropzone/index.ts: -------------------------------------------------------------------------------- 1 | import FileDropzone from './file-dropzone.svelte'; 2 | import type { FileRejectionReason, DropzoneProps } from './types'; 3 | 4 | export const displaySize = (bytes: number): string => { 5 | if (bytes < KILOBYTE) return `${bytes.toFixed(0)} B`; 6 | 7 | if (bytes < MEGABYTE) return `${(bytes / KILOBYTE).toFixed(0)} KB`; 8 | 9 | if (bytes < GIGABYTE) return `${(bytes / MEGABYTE).toFixed(0)} MB`; 10 | 11 | return `${(bytes / GIGABYTE).toFixed(0)} GB`; 12 | }; 13 | 14 | // Helper constants 15 | export const BYTE = 1; 16 | export const KILOBYTE = 1024; 17 | export const MEGABYTE = 1024 * KILOBYTE; 18 | export const GIGABYTE = 1024 * MEGABYTE; 19 | 20 | export const ACCEPT_IMAGE = 'image/*'; 21 | export const ACCEPT_VIDEO = 'video/*'; 22 | export const ACCEPT_AUDIO = 'audio/*'; 23 | 24 | export { FileDropzone, type FileRejectionReason, type DropzoneProps }; -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/file-dropzone/types.ts: -------------------------------------------------------------------------------- 1 | import type { Snippet } from "svelte"; 2 | 3 | export type FileRejectionReason = 4 | | 'size-exceeded' 5 | | 'type-not-allowed' 6 | | 'max-files-reached'; 7 | 8 | export interface FileRejection { 9 | file: File; 10 | reason: FileRejectionReason; 11 | } 12 | 13 | export interface DropzoneProps { 14 | /** Handler for successful file uploads */ 15 | onUpload: (files: File[]) => Promise; 16 | /** Handler for rejected files */ 17 | onFileRejected?: (rejection: FileRejection) => void; 18 | /** Maximum allowed files */ 19 | maxFiles?: number; 20 | /** Current number of uploaded files */ 21 | fileCount?: number; 22 | /** Maximum file size in bytes */ 23 | maxFileSize?: number; 24 | /** Accepted file types (e.g., "image/*,.pdf") */ 25 | accept?: string; 26 | /** Custom class names */ 27 | class?: string; 28 | /** Whether the dropzone is disabled */ 29 | disabled?: boolean; 30 | /** Custom slot content */ 31 | children?: Snippet; 32 | } -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/link/index.ts: -------------------------------------------------------------------------------- 1 | import Link from './link.svelte'; 2 | 3 | export { Link }; -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/link/link.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 15 | {#if children} 16 | {@render children()} 17 | {/if} 18 | 19 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/password-input/index.ts: -------------------------------------------------------------------------------- 1 | import PasswordInput from "./password-input.svelte"; 2 | 3 | export { PasswordInput }; -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/scroll-progress-indicator/index.ts: -------------------------------------------------------------------------------- 1 | import ScrollProgressIndicator from "./scroll-progress-indicator.svelte"; 2 | 3 | export { ScrollProgressIndicator }; -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/scroll-progress-indicator/types.ts: -------------------------------------------------------------------------------- 1 | type BarConfig1 = { 2 | type: 'bar'; 3 | vertical: 'top'; 4 | outside: true; 5 | }; 6 | 7 | type BarConfig2 = { 8 | type: 'bar'; 9 | vertical: 'top'; 10 | outside: false; 11 | }; 12 | 13 | type BarConfig3 = { 14 | type: 'bar'; 15 | vertical: 'bottom'; 16 | }; 17 | 18 | type CircleConfig1 = { 19 | type: 'circle'; 20 | vertical: 'top' | 'bottom'; 21 | horizontal: 'left' | 'right'; 22 | showPercentage: boolean; 23 | }; 24 | 25 | export type ScrollProgressIndicatorConfig = BarConfig1 | BarConfig2 | BarConfig3 | CircleConfig1; -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/transfer-list/index.ts: -------------------------------------------------------------------------------- 1 | import TransferListBody from "./transfer-list-body.svelte"; 2 | import TransferListContainer from "./transfer-list-container.svelte"; 3 | import TransferListToolbar from "./transfer-list-toolbar.svelte"; 4 | import TransferList from "./transfer-list.svelte"; 5 | import TransferListTitle from "./transfer-list-title.svelte"; 6 | import TransferListItem from "./transfer-list-item.svelte"; 7 | import { TransferListCore } from "./transfer-list-core.svelte.ts"; 8 | 9 | export { 10 | TransferList as Root, 11 | TransferListBody as Body, 12 | TransferListContainer as Container, 13 | TransferListToolbar as Toolbar, 14 | TransferListTitle as Title, 15 | TransferListItem as Item, 16 | TransferListCore as Core 17 | } 18 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/transfer-list/transfer-list-body.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 13 | {@render children()} 14 | 15 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/transfer-list/transfer-list-container.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 |
14 | {@render children()} 15 |
16 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/transfer-list/transfer-list-item.svelte: -------------------------------------------------------------------------------- 1 | 24 | 25 | 31 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/transfer-list/transfer-list-title.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | {#if children} 15 | {@render children()} 16 | {:else} 17 |

{title}

18 | {/if} 19 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/transfer-list/transfer-list.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
21 | {@render children()} 22 |
23 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/virtual-select/index.ts: -------------------------------------------------------------------------------- 1 | export let virtualSelectKey = Symbol('virtual-select') 2 | 3 | import VirtualSelectBody from "./virtual-select-body.svelte" 4 | import VirtualSelectContent from "./virtual-select-content.svelte" 5 | import VirtualSelectContentWrapper from "./virtual-select-content-wrapper.svelte" 6 | import VirtualSelectItem from "./virtual-select-item.svelte" 7 | import VirtualSelectRoot from "./virtual-select-root.svelte" 8 | import VirtualSelectTrigger from "./virtual-select-trigger.svelte" 9 | 10 | export { 11 | VirtualSelectBody as Body, 12 | VirtualSelectContent as Content, 13 | VirtualSelectContentWrapper as Wrapper, 14 | VirtualSelectItem as Item, 15 | VirtualSelectRoot as Root, 16 | VirtualSelectTrigger as Trigger 17 | } 18 | 19 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/virtual-select/types.ts: -------------------------------------------------------------------------------- 1 | export type HighlightedItemIndex = { 2 | current: number; 3 | }; 4 | 5 | export type SelectedItemsIndex = { 6 | current: number | string | null; 7 | }; 8 | 9 | export type VSItem = { 10 | value: string; 11 | label: string; 12 | [key: string]: string; 13 | }; 14 | 15 | export type VSSelection = { 16 | current: VSItem | null; 17 | }; 18 | 19 | export type VSMSelection = { 20 | current: VSItem[] | null; 21 | }; 22 | 23 | export type VirtualSelectContext = { 24 | multiple: boolean; 25 | items: VSItem[]; 26 | selection: VSSelection | VSMSelection; 27 | listContainer: HTMLElement | null; 28 | handleKeydown: (event: KeyboardEvent) => void; 29 | highlightedItemIndex: HighlightedItemIndex; 30 | highlightedItemScrollPosition: { current: number }; 31 | handleSelect: (item: VSItem, index: number) => void; 32 | }; 33 | 34 | // This type is only for internal use - do not use it for component props 35 | export type VirtualSelectSelection = VSSelection | VSMSelection; -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/virtual-select/virtual-select-body.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | 16 | {@render children()} 17 | 18 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/virtual-select/virtual-select-content-wrapper.svelte: -------------------------------------------------------------------------------- 1 | 18 | 19 |
26 | {@render header?.()} 27 | {@render children()} 28 | {@render footer?.()} 29 |
30 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/virtual-select/virtual-select-content.svelte: -------------------------------------------------------------------------------- 1 | 20 | 21 | 26 | {#snippet vl_slot({ index, item })} 27 | {@render children(index, item)} 28 | {/snippet} 29 | 30 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/virtual-select/virtual-select-trigger.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | 16 | {@render children()} 17 | 18 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/virtualization/README.md: -------------------------------------------------------------------------------- 1 | Acknowledgments 2 | The original implementation of virtualization was done by https://github.com/orefalo/svelte-virtuallists, the code was modified to meet the needs of my component implementation. 3 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/tzezars-enhancements/virtualization/index.ts: -------------------------------------------------------------------------------- 1 | export type SizingCalculatorFn = (index: number, item: unknown) => number; 2 | export interface VLSlotSignature { 3 | index: number | string; 4 | item: ItemType; 5 | size?: number; 6 | } 7 | export interface VLRangeEvent { 8 | start: number; 9 | end: number; 10 | } 11 | export interface VLScrollEvent { 12 | offset: number | string; 13 | event: Event; 14 | } 15 | export enum SCROLL_BEHAVIOR { 16 | AUTO = "auto", 17 | SMOOTH = "smooth", 18 | INSTANT = "instant" 19 | } 20 | export enum ALIGNMENT { 21 | AUTO = "auto", 22 | START = "start", 23 | CENTER = "center", 24 | END = "end" 25 | } 26 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/accordion/accordion-content.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 21 |
22 | {@render children?.()} 23 |
24 | 25 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/accordion/accordion-item.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/accordion/accordion-trigger.svelte: -------------------------------------------------------------------------------- 1 | 16 | 17 | 18 | svg]:rotate-180", 22 | className 23 | )} 24 | {...restProps} 25 | > 26 | {@render children?.()} 27 | 28 | 29 | 30 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/accordion/index.ts: -------------------------------------------------------------------------------- 1 | import { Accordion as AccordionPrimitive } from "bits-ui"; 2 | import Content from "./accordion-content.svelte"; 3 | import Item from "./accordion-item.svelte"; 4 | import Trigger from "./accordion-trigger.svelte"; 5 | const Root = AccordionPrimitive.Root; 6 | 7 | export { 8 | Root, 9 | Content, 10 | Item, 11 | Trigger, 12 | // 13 | Root as Accordion, 14 | Content as AccordionContent, 15 | Item as AccordionItem, 16 | Trigger as AccordionTrigger, 17 | }; 18 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/alert-dialog/alert-dialog-action.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/alert-dialog/alert-dialog-cancel.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 18 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/alert-dialog/alert-dialog-description.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/alert-dialog/alert-dialog-footer.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
19 | {@render children?.()} 20 |
21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/alert-dialog/alert-dialog-header.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
19 | {@render children?.()} 20 |
21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/alert-dialog/alert-dialog-overlay.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/alert-dialog/alert-dialog-title.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 19 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/alert/alert-description.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
15 | {@render children?.()} 16 |
17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/alert/alert-title.svelte: -------------------------------------------------------------------------------- 1 | 16 | 17 |
24 | {@render children?.()} 25 |
26 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/alert/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./alert.svelte"; 2 | import Description from "./alert-description.svelte"; 3 | import Title from "./alert-title.svelte"; 4 | export { alertVariants, type AlertVariant } from "./alert.svelte"; 5 | 6 | export { 7 | Root, 8 | Description, 9 | Title, 10 | // 11 | Root as Alert, 12 | Description as AlertDescription, 13 | Title as AlertTitle, 14 | }; 15 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/aspect-ratio/index.ts: -------------------------------------------------------------------------------- 1 | import { AspectRatio as AspectRatioPrimitive } from "bits-ui"; 2 | 3 | const Root = AspectRatioPrimitive.Root; 4 | 5 | export { Root, Root as AspectRatio }; 6 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/avatar/avatar-fallback.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/avatar/avatar-image.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/avatar/avatar.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/avatar/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./avatar.svelte"; 2 | import Image from "./avatar-image.svelte"; 3 | import Fallback from "./avatar-fallback.svelte"; 4 | 5 | export { 6 | Root, 7 | Image, 8 | Fallback, 9 | // 10 | Root as Avatar, 11 | Image as AvatarImage, 12 | Fallback as AvatarFallback, 13 | }; 14 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/badge/index.ts: -------------------------------------------------------------------------------- 1 | export { default as Badge } from "./badge.svelte"; 2 | export { badgeVariants, type BadgeVariant } from "./badge.svelte"; 3 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/breadcrumb/breadcrumb-ellipsis.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 24 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/breadcrumb/breadcrumb-item.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
  • 15 | {@render children?.()} 16 |
    • 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/breadcrumb/breadcrumb-link.svelte: -------------------------------------------------------------------------------- 1 | 24 | 25 | {#if child} 26 | {@render child({ props: attrs })} 27 | {:else} 28 | 29 | {@render children?.()} 30 | 31 | {/if} 32 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/breadcrumb/breadcrumb-list.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
      22 | {@render children?.()} 23 |
    24 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/breadcrumb/breadcrumb-page.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 22 | {@render children?.()} 23 | 24 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/breadcrumb/breadcrumb-separator.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | 28 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/breadcrumb/breadcrumb.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 16 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/breadcrumb/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./breadcrumb.svelte"; 2 | import Ellipsis from "./breadcrumb-ellipsis.svelte"; 3 | import Item from "./breadcrumb-item.svelte"; 4 | import Separator from "./breadcrumb-separator.svelte"; 5 | import Link from "./breadcrumb-link.svelte"; 6 | import List from "./breadcrumb-list.svelte"; 7 | import Page from "./breadcrumb-page.svelte"; 8 | 9 | export { 10 | Root, 11 | Ellipsis, 12 | Item, 13 | Separator, 14 | Link, 15 | List, 16 | Page, 17 | // 18 | Root as Breadcrumb, 19 | Ellipsis as BreadcrumbEllipsis, 20 | Item as BreadcrumbItem, 21 | Separator as BreadcrumbSeparator, 22 | Link as BreadcrumbLink, 23 | List as BreadcrumbList, 24 | Page as BreadcrumbPage, 25 | }; 26 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/button/index.ts: -------------------------------------------------------------------------------- 1 | import Root, { 2 | type ButtonProps, 3 | type ButtonSize, 4 | type ButtonVariant, 5 | buttonVariants, 6 | } from "./button.svelte"; 7 | 8 | export { 9 | Root, 10 | type ButtonProps as Props, 11 | // 12 | Root as Button, 13 | buttonVariants, 14 | type ButtonProps, 15 | type ButtonSize, 16 | type ButtonVariant, 17 | }; 18 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/calendar/calendar-cell.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/calendar/calendar-grid-body.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/calendar/calendar-grid-head.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/calendar/calendar-grid-row.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/calendar/calendar-grid.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/calendar/calendar-head-cell.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/calendar/calendar-header.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/calendar/calendar-heading.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/calendar/calendar-months.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    19 | {@render children?.()} 20 |
    21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/calendar/calendar-next-button.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | {#snippet Fallback()} 16 | 17 | {/snippet} 18 | 19 | 29 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/calendar/calendar-prev-button.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | {#snippet Fallback()} 16 | 17 | {/snippet} 18 | 19 | 29 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/calendar/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./calendar.svelte"; 2 | import Cell from "./calendar-cell.svelte"; 3 | import Day from "./calendar-day.svelte"; 4 | import Grid from "./calendar-grid.svelte"; 5 | import Header from "./calendar-header.svelte"; 6 | import Months from "./calendar-months.svelte"; 7 | import GridRow from "./calendar-grid-row.svelte"; 8 | import Heading from "./calendar-heading.svelte"; 9 | import GridBody from "./calendar-grid-body.svelte"; 10 | import GridHead from "./calendar-grid-head.svelte"; 11 | import HeadCell from "./calendar-head-cell.svelte"; 12 | import NextButton from "./calendar-next-button.svelte"; 13 | import PrevButton from "./calendar-prev-button.svelte"; 14 | 15 | export { 16 | Day, 17 | Cell, 18 | Grid, 19 | Header, 20 | Months, 21 | GridRow, 22 | Heading, 23 | GridBody, 24 | GridHead, 25 | HeadCell, 26 | NextButton, 27 | PrevButton, 28 | // 29 | Root as Calendar, 30 | }; 31 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/card/card-content.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    15 | {@render children?.()} 16 |
    17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/card/card-description.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |

    15 | {@render children?.()} 16 |

    17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/card/card-footer.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    15 | {@render children?.()} 16 |
    17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/card/card-header.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    15 | {@render children?.()} 16 |
    17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/card/card-title.svelte: -------------------------------------------------------------------------------- 1 | 16 | 17 |
    24 | {@render children?.()} 25 |
    26 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/card/card.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    19 | {@render children?.()} 20 |
    21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/card/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./card.svelte"; 2 | import Content from "./card-content.svelte"; 3 | import Description from "./card-description.svelte"; 4 | import Footer from "./card-footer.svelte"; 5 | import Header from "./card-header.svelte"; 6 | import Title from "./card-title.svelte"; 7 | 8 | export { 9 | Root, 10 | Content, 11 | Description, 12 | Footer, 13 | Header, 14 | Title, 15 | // 16 | Root as Card, 17 | Content as CardContent, 18 | Description as CardDescription, 19 | Footer as CardFooter, 20 | Header as CardHeader, 21 | Title as CardTitle, 22 | }; 23 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/carousel/carousel-item.svelte: -------------------------------------------------------------------------------- 1 | 16 | 17 |
    29 | {@render children?.()} 30 |
    31 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/carousel/carousel-next.svelte: -------------------------------------------------------------------------------- 1 | 18 | 19 | 38 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/carousel/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./carousel.svelte"; 2 | import Content from "./carousel-content.svelte"; 3 | import Item from "./carousel-item.svelte"; 4 | import Previous from "./carousel-previous.svelte"; 5 | import Next from "./carousel-next.svelte"; 6 | 7 | export { 8 | Root, 9 | Content, 10 | Item, 11 | Previous, 12 | Next, 13 | // 14 | Root as Carousel, 15 | Content as CarouselContent, 16 | Item as CarouselItem, 17 | Previous as CarouselPrevious, 18 | Next as CarouselNext, 19 | }; 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/checkbox/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./checkbox.svelte"; 2 | export { 3 | Root, 4 | // 5 | Root as Checkbox, 6 | }; 7 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/collapsible/index.ts: -------------------------------------------------------------------------------- 1 | import { Collapsible as CollapsiblePrimitive } from "bits-ui"; 2 | 3 | const Root = CollapsiblePrimitive.Root; 4 | const Trigger = CollapsiblePrimitive.Trigger; 5 | const Content = CollapsiblePrimitive.Content; 6 | 7 | export { 8 | Root, 9 | Content, 10 | Trigger, 11 | // 12 | Root as Collapsible, 13 | Content as CollapsibleContent, 14 | Trigger as CollapsibleTrigger, 15 | }; 16 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/command/command-empty.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/command/command-group.svelte: -------------------------------------------------------------------------------- 1 | 15 | 16 | 21 | {#if heading} 22 | 25 | {heading} 26 | 27 | {/if} 28 | 29 | 30 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/command/command-input.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    15 | 16 | 25 |
    26 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/command/command-item.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/command/command-link-item.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/command/command-list.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/command/command-separator.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/command/command-shortcut.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 19 | {@render children?.()} 20 | 21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/command/command.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 22 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/command/index.ts: -------------------------------------------------------------------------------- 1 | import { Command as CommandPrimitive } from "bits-ui"; 2 | 3 | import Root from "./command.svelte"; 4 | import Dialog from "./command-dialog.svelte"; 5 | import Empty from "./command-empty.svelte"; 6 | import Group from "./command-group.svelte"; 7 | import Item from "./command-item.svelte"; 8 | import Input from "./command-input.svelte"; 9 | import List from "./command-list.svelte"; 10 | import Separator from "./command-separator.svelte"; 11 | import Shortcut from "./command-shortcut.svelte"; 12 | import LinkItem from "./command-link-item.svelte"; 13 | 14 | const Loading = CommandPrimitive.Loading; 15 | 16 | export { 17 | Root, 18 | Dialog, 19 | Empty, 20 | Group, 21 | Item, 22 | LinkItem, 23 | Input, 24 | List, 25 | Separator, 26 | Shortcut, 27 | Loading, 28 | // 29 | Root as Command, 30 | Dialog as CommandDialog, 31 | Empty as CommandEmpty, 32 | Group as CommandGroup, 33 | Item as CommandItem, 34 | LinkItem as CommandLinkItem, 35 | Input as CommandInput, 36 | List as CommandList, 37 | Separator as CommandSeparator, 38 | Shortcut as CommandShortcut, 39 | Loading as CommandLoading, 40 | }; 41 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/context-menu/context-menu-content.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | 16 | 24 | 25 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/context-menu/context-menu-group-heading.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/context-menu/context-menu-item.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | 24 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/context-menu/context-menu-radio-item.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 22 | {#snippet children({ checked })} 23 | 24 | {#if checked} 25 | 26 | {/if} 27 | 28 | {@render childrenProp?.({ checked })} 29 | {/snippet} 30 | 31 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/context-menu/context-menu-separator.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/context-menu/context-menu-shortcut.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 19 | {@render children?.()} 20 | 21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/context-menu/context-menu-sub-content.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/context-menu/context-menu-sub-trigger.svelte: -------------------------------------------------------------------------------- 1 | 16 | 17 | 26 | {@render children?.()} 27 | 28 | 29 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/data-table/index.ts: -------------------------------------------------------------------------------- 1 | export { default as FlexRender } from "./flex-render.svelte"; 2 | export { renderComponent, renderSnippet } from "./render-helpers.js"; 3 | export { createSvelteTable } from "./data-table.svelte.js"; 4 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dialog/dialog-description.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dialog/dialog-footer.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    19 | {@render children?.()} 20 |
    21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dialog/dialog-header.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    19 | {@render children?.()} 20 |
    21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dialog/dialog-overlay.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dialog/dialog-title.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dialog/index.ts: -------------------------------------------------------------------------------- 1 | import { Dialog as DialogPrimitive } from "bits-ui"; 2 | 3 | import Title from "./dialog-title.svelte"; 4 | import Footer from "./dialog-footer.svelte"; 5 | import Header from "./dialog-header.svelte"; 6 | import Overlay from "./dialog-overlay.svelte"; 7 | import Content from "./dialog-content.svelte"; 8 | import Description from "./dialog-description.svelte"; 9 | 10 | const Root = DialogPrimitive.Root; 11 | const Trigger = DialogPrimitive.Trigger; 12 | const Close = DialogPrimitive.Close; 13 | const Portal = DialogPrimitive.Portal; 14 | 15 | export { 16 | Root, 17 | Title, 18 | Portal, 19 | Footer, 20 | Header, 21 | Trigger, 22 | Overlay, 23 | Content, 24 | Description, 25 | Close, 26 | // 27 | Root as Dialog, 28 | Title as DialogTitle, 29 | Portal as DialogPortal, 30 | Footer as DialogFooter, 31 | Header as DialogHeader, 32 | Trigger as DialogTrigger, 33 | Overlay as DialogOverlay, 34 | Content as DialogContent, 35 | Description as DialogDescription, 36 | Close as DialogClose, 37 | }; 38 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/drawer/drawer-content.svelte: -------------------------------------------------------------------------------- 1 | 16 | 17 | 18 | 19 | 27 |
    28 | {@render children?.()} 29 |     30 |     31 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/drawer/drawer-description.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/drawer/drawer-footer.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    15 | {@render children?.()} 16 |
    17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/drawer/drawer-header.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    19 | {@render children?.()} 20 |
    21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/drawer/drawer-nested.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/drawer/drawer-overlay.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/drawer/drawer-title.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/drawer/drawer.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dropdown-menu/dropdown-menu-content.svelte: -------------------------------------------------------------------------------- 1 | 15 | 16 | 17 | 26 | 27 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dropdown-menu/dropdown-menu-group-heading.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dropdown-menu/dropdown-menu-item.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | 24 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dropdown-menu/dropdown-menu-label.svelte: -------------------------------------------------------------------------------- 1 | 16 | 17 |
    22 | {@render children?.()} 23 |
    24 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dropdown-menu/dropdown-menu-radio-item.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 22 | {#snippet children({ checked })} 23 | 24 | {#if checked} 25 | 26 | {/if} 27 | 28 | {@render childrenProp?.({ checked })} 29 | {/snippet} 30 | 31 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dropdown-menu/dropdown-menu-separator.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dropdown-menu/dropdown-menu-shortcut.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 19 | {@render children?.()} 20 | 21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dropdown-menu/dropdown-menu-sub-content.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/dropdown-menu/dropdown-menu-sub-trigger.svelte: -------------------------------------------------------------------------------- 1 | 16 | 17 | 26 | {@render children?.()} 27 | 28 | 29 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/form/form-button.svelte: -------------------------------------------------------------------------------- 1 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/form/form-description.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 18 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/form/form-field-errors.svelte: -------------------------------------------------------------------------------- 1 | 16 | 17 | 22 | {#snippet children({ errors, errorProps })} 23 | {#if childrenProp} 24 | {@render childrenProp({ errors, errorProps })} 25 | {:else} 26 | {#each errors as error} 27 |
    {error}
    28 | {/each} 29 | {/if} 30 | {/snippet} 31 |     32 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/form/form-field.svelte: -------------------------------------------------------------------------------- 1 | 6 | 7 | 23 | 24 | 25 | {#snippet children({ constraints, errors, tainted, value })} 26 |
    27 | {@render childrenProp?.({ constraints, errors, tainted, value: value as T[U] })} 28 |
    29 | {/snippet} 30 |     31 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/form/form-fieldset.svelte: -------------------------------------------------------------------------------- 1 | 6 | 7 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/form/form-label.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | 16 | {#snippet child({ props })} 17 | 20 | {/snippet} 21 | 22 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/form/form-legend.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 18 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/form/index.ts: -------------------------------------------------------------------------------- 1 | import * as FormPrimitive from "formsnap"; 2 | import Description from "./form-description.svelte"; 3 | import Label from "./form-label.svelte"; 4 | import FieldErrors from "./form-field-errors.svelte"; 5 | import Field from "./form-field.svelte"; 6 | import Fieldset from "./form-fieldset.svelte"; 7 | import Legend from "./form-legend.svelte"; 8 | import ElementField from "./form-element-field.svelte"; 9 | import Button from "./form-button.svelte"; 10 | 11 | const Control = FormPrimitive.Control; 12 | 13 | export { 14 | Field, 15 | Control, 16 | Label, 17 | Button, 18 | FieldErrors, 19 | Description, 20 | Fieldset, 21 | Legend, 22 | ElementField, 23 | // 24 | Field as FormField, 25 | Control as FormControl, 26 | Description as FormDescription, 27 | Label as FormLabel, 28 | FieldErrors as FormFieldErrors, 29 | Fieldset as FormFieldset, 30 | Legend as FormLegend, 31 | ElementField as FormElementField, 32 | Button as FormButton, 33 | }; 34 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/hover-card/hover-card-content.svelte: -------------------------------------------------------------------------------- 1 | 16 | 17 | 18 | 28 | 29 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/hover-card/index.ts: -------------------------------------------------------------------------------- 1 | import { LinkPreview as HoverCardPrimitive } from "bits-ui"; 2 | 3 | import Content from "./hover-card-content.svelte"; 4 | const Root = HoverCardPrimitive.Root; 5 | const Trigger = HoverCardPrimitive.Trigger; 6 | 7 | export { 8 | Root, 9 | Content, 10 | Trigger, 11 | Root as HoverCard, 12 | Content as HoverCardContent, 13 | Trigger as HoverCardTrigger, 14 | }; 15 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/input-otp/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./input-otp.svelte"; 2 | import Group from "./input-otp-group.svelte"; 3 | import Slot from "./input-otp-slot.svelte"; 4 | import Separator from "./input-otp-separator.svelte"; 5 | 6 | export { 7 | Root, 8 | Group, 9 | Slot, 10 | Separator, 11 | Root as InputOTP, 12 | Group as InputOTPGroup, 13 | Slot as InputOTPSlot, 14 | Separator as InputOTPSeparator, 15 | }; 16 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/input-otp/input-otp-group.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    15 | {@render children?.()} 16 |
    17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/input-otp/input-otp-separator.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 |
    14 | {#if children} 15 | {@render children?.()} 16 | {:else} 17 | 18 | {/if} 19 |
    20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/input-otp/input-otp-slot.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 24 | {cell.char} 25 | {#if cell.hasFakeCaret} 26 |
    27 |
    28 |
    29 | {/if} 30 |     31 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/input-otp/input-otp.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 23 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/input/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./input.svelte"; 2 | 3 | export { 4 | Root, 5 | // 6 | Root as Input, 7 | }; 8 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/label/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./label.svelte"; 2 | 3 | export { 4 | Root, 5 | // 6 | Root as Label, 7 | }; 8 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/label/label.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/menubar/menubar-content.svelte: -------------------------------------------------------------------------------- 1 | 18 | 19 | 20 | 32 | 33 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/menubar/menubar-group-heading.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/menubar/menubar-item.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | 24 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/menubar/menubar-radio-item.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 22 | {#snippet children({ checked })} 23 | 24 | {#if checked} 25 | 26 | {/if} 27 | 28 | {@render childrenProp?.({ checked })} 29 | {/snippet} 30 | 31 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/menubar/menubar-separator.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/menubar/menubar-shortcut.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 19 | {@render children?.()} 20 | 21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/menubar/menubar-sub-content.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/menubar/menubar-sub-trigger.svelte: -------------------------------------------------------------------------------- 1 | 16 | 17 | 26 | {@render children?.()} 27 | 28 | 29 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/menubar/menubar-trigger.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/menubar/menubar.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/pagination/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./pagination.svelte"; 2 | import Content from "./pagination-content.svelte"; 3 | import Item from "./pagination-item.svelte"; 4 | import Link from "./pagination-link.svelte"; 5 | import PrevButton from "./pagination-prev-button.svelte"; 6 | import NextButton from "./pagination-next-button.svelte"; 7 | import Ellipsis from "./pagination-ellipsis.svelte"; 8 | 9 | export { 10 | Root, 11 | Content, 12 | Item, 13 | Link, 14 | PrevButton, 15 | NextButton, 16 | Ellipsis, 17 | // 18 | Root as Pagination, 19 | Content as PaginationContent, 20 | Item as PaginationItem, 21 | Link as PaginationLink, 22 | PrevButton as PaginationPrevButton, 23 | NextButton as PaginationNextButton, 24 | Ellipsis as PaginationEllipsis, 25 | }; 26 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/pagination/pagination-content.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
      15 | {@render children?.()} 16 |
    17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/pagination/pagination-ellipsis.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 23 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/pagination/pagination-item.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 |
  • 13 | {@render children?.()} 14 |
    • 15 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/pagination/pagination-link.svelte: -------------------------------------------------------------------------------- 1 | 19 | 20 | {#snippet Fallback()} 21 | {page.value} 22 | {/snippet} 23 | 24 | 37 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/pagination/pagination-next-button.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | {#snippet Fallback()} 16 | Next 17 | 18 | {/snippet} 19 | 20 | 32 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/pagination/pagination-prev-button.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | {#snippet Fallback()} 16 | 17 | Previous 18 | {/snippet} 19 | 20 | 32 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/pagination/pagination.svelte: -------------------------------------------------------------------------------- 1 | 16 | 17 | 26 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/popover/index.ts: -------------------------------------------------------------------------------- 1 | import { Popover as PopoverPrimitive } from "bits-ui"; 2 | import Content from "./popover-content.svelte"; 3 | const Root = PopoverPrimitive.Root; 4 | const Trigger = PopoverPrimitive.Trigger; 5 | const Close = PopoverPrimitive.Close; 6 | 7 | export { 8 | Root, 9 | Content, 10 | Trigger, 11 | Close, 12 | // 13 | Root as Popover, 14 | Content as PopoverContent, 15 | Trigger as PopoverTrigger, 16 | Close as PopoverClose, 17 | }; 18 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/popover/popover-content.svelte: -------------------------------------------------------------------------------- 1 | 16 | 17 | 18 | 28 | 29 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/progress/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./progress.svelte"; 2 | 3 | export { 4 | Root, 5 | // 6 | Root as Progress, 7 | }; 8 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/progress/progress.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 21 |
    25 |     26 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/radio-group/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./radio-group.svelte"; 2 | import Item from "./radio-group-item.svelte"; 3 | 4 | export { 5 | Root, 6 | Item, 7 | // 8 | Root as RadioGroup, 9 | Item as RadioGroupItem, 10 | }; 11 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/radio-group/radio-group-item.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 21 | {#snippet children({ checked })} 22 |
    23 | {#if checked} 24 | 25 | {/if} 26 |
    27 | {/snippet} 28 |     29 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/radio-group/radio-group.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/range-calendar/index.ts: -------------------------------------------------------------------------------- 1 | import { RangeCalendar as RangeCalendarPrimitive } from "bits-ui"; 2 | import Root from "./range-calendar.svelte"; 3 | import Cell from "./range-calendar-cell.svelte"; 4 | import Day from "./range-calendar-day.svelte"; 5 | import Grid from "./range-calendar-grid.svelte"; 6 | import Header from "./range-calendar-header.svelte"; 7 | import Months from "./range-calendar-months.svelte"; 8 | import GridRow from "./range-calendar-grid-row.svelte"; 9 | import Heading from "./range-calendar-heading.svelte"; 10 | import HeadCell from "./range-calendar-head-cell.svelte"; 11 | import NextButton from "./range-calendar-next-button.svelte"; 12 | import PrevButton from "./range-calendar-prev-button.svelte"; 13 | 14 | const GridHead = RangeCalendarPrimitive.GridHead; 15 | const GridBody = RangeCalendarPrimitive.GridBody; 16 | 17 | export { 18 | Day, 19 | Cell, 20 | Grid, 21 | Header, 22 | Months, 23 | GridRow, 24 | Heading, 25 | GridBody, 26 | GridHead, 27 | HeadCell, 28 | NextButton, 29 | PrevButton, 30 | // 31 | Root as RangeCalendar, 32 | }; 33 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/range-calendar/range-calendar-cell.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/range-calendar/range-calendar-grid-row.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/range-calendar/range-calendar-grid.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/range-calendar/range-calendar-head-cell.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/range-calendar/range-calendar-header.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/range-calendar/range-calendar-heading.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/range-calendar/range-calendar-months.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    19 | {@render children?.()} 20 |
    21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/range-calendar/range-calendar-next-button.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | {#snippet Fallback()} 16 | 17 | {/snippet} 18 | 19 | 29 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/range-calendar/range-calendar-prev-button.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | {#snippet Fallback()} 16 | 17 | {/snippet} 18 | 19 | 29 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/resizable/index.ts: -------------------------------------------------------------------------------- 1 | import { Pane } from "paneforge"; 2 | import Handle from "./resizable-handle.svelte"; 3 | import PaneGroup from "./resizable-pane-group.svelte"; 4 | 5 | export { 6 | PaneGroup, 7 | Pane, 8 | Handle, 9 | // 10 | PaneGroup as ResizablePaneGroup, 11 | Pane as ResizablePane, 12 | Handle as ResizableHandle, 13 | }; 14 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/resizable/resizable-pane-group.svelte: -------------------------------------------------------------------------------- 1 | 14 | 15 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/scroll-area/index.ts: -------------------------------------------------------------------------------- 1 | import Scrollbar from "./scroll-area-scrollbar.svelte"; 2 | import Root from "./scroll-area.svelte"; 3 | 4 | export { 5 | Root, 6 | Scrollbar, 7 | //, 8 | Root as ScrollArea, 9 | Scrollbar as ScrollAreaScrollbar, 10 | }; 11 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/scroll-area/scroll-area-scrollbar.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 25 | {@render children?.()} 26 | 29 | 30 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/select/index.ts: -------------------------------------------------------------------------------- 1 | import { Select as SelectPrimitive } from "bits-ui"; 2 | 3 | import GroupHeading from "./select-group-heading.svelte"; 4 | import Item from "./select-item.svelte"; 5 | import Content from "./select-content.svelte"; 6 | import Trigger from "./select-trigger.svelte"; 7 | import Separator from "./select-separator.svelte"; 8 | import ScrollDownButton from "./select-scroll-down-button.svelte"; 9 | import ScrollUpButton from "./select-scroll-up-button.svelte"; 10 | 11 | const Root = SelectPrimitive.Root; 12 | const Group = SelectPrimitive.Group; 13 | 14 | export { 15 | Root, 16 | Group, 17 | GroupHeading, 18 | Item, 19 | Content, 20 | Trigger, 21 | Separator, 22 | ScrollDownButton, 23 | ScrollUpButton, 24 | // 25 | Root as Select, 26 | Group as SelectGroup, 27 | GroupHeading as SelectGroupHeading, 28 | Item as SelectItem, 29 | Content as SelectContent, 30 | Trigger as SelectTrigger, 31 | Separator as SelectSeparator, 32 | ScrollDownButton as SelectScrollDownButton, 33 | ScrollUpButton as SelectScrollUpButton, 34 | }; 35 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/select/select-group-heading.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/select/select-scroll-down-button.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/select/select-scroll-up-button.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/select/select-separator.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/select/select-trigger.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | span]:line-clamp-1", 18 | className 19 | )} 20 | {...restProps} 21 | > 22 | {@render children?.()} 23 | 24 | 25 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/separator/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./separator.svelte"; 2 | 3 | export { 4 | Root, 5 | // 6 | Root as Separator, 7 | }; 8 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/separator/separator.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 23 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sheet/index.ts: -------------------------------------------------------------------------------- 1 | import { Dialog as SheetPrimitive } from "bits-ui"; 2 | import Overlay from "./sheet-overlay.svelte"; 3 | import Content from "./sheet-content.svelte"; 4 | import Header from "./sheet-header.svelte"; 5 | import Footer from "./sheet-footer.svelte"; 6 | import Title from "./sheet-title.svelte"; 7 | import Description from "./sheet-description.svelte"; 8 | 9 | const Root = SheetPrimitive.Root; 10 | const Close = SheetPrimitive.Close; 11 | const Trigger = SheetPrimitive.Trigger; 12 | const Portal = SheetPrimitive.Portal; 13 | 14 | export { 15 | Root, 16 | Close, 17 | Trigger, 18 | Portal, 19 | Overlay, 20 | Content, 21 | Header, 22 | Footer, 23 | Title, 24 | Description, 25 | // 26 | Root as Sheet, 27 | Close as SheetClose, 28 | Trigger as SheetTrigger, 29 | Portal as SheetPortal, 30 | Overlay as SheetOverlay, 31 | Content as SheetContent, 32 | Header as SheetHeader, 33 | Footer as SheetFooter, 34 | Title as SheetTitle, 35 | Description as SheetDescription, 36 | }; 37 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sheet/sheet-description.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sheet/sheet-footer.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    19 | {@render children?.()} 20 |
    21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sheet/sheet-header.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    19 | {@render children?.()} 20 |
    21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sheet/sheet-overlay.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 22 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sheet/sheet-title.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/constants.ts: -------------------------------------------------------------------------------- 1 | export const SIDEBAR_COOKIE_NAME = "sidebar:state"; 2 | export const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7; 3 | export const SIDEBAR_WIDTH = "16rem"; 4 | export const SIDEBAR_WIDTH_MOBILE = "18rem"; 5 | export const SIDEBAR_WIDTH_ICON = "3rem"; 6 | export const SIDEBAR_KEYBOARD_SHORTCUT = "b"; 7 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-content.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    23 | {@render children?.()} 24 |
    25 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-footer.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    20 | {@render children?.()} 21 |
    22 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-group-content.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    20 | {@render children?.()} 21 |
    22 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-group.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    20 | {@render children?.()} 21 |
    22 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-header.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    20 | {@render children?.()} 21 |
    22 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-input.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 24 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-inset.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 15 |
    25 | {@render children?.()} 26 |
    27 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-menu-badge.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    28 | {@render children?.()} 29 |
    30 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-menu-item.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
  • 20 | {@render children?.()} 21 |
    • 22 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-menu-skeleton.svelte: -------------------------------------------------------------------------------- 1 | 20 | 21 |
    27 | {#if showIcon} 28 | 29 | {/if} 30 | 35 | {@render children?.()} 36 |
    37 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-menu-sub-item.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 |
  • 13 | {@render children?.()} 14 |
    • 15 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-menu-sub.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
      24 | {@render children?.()} 25 |
    26 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-menu.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
      20 | {@render children?.()} 21 |
    22 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-separator.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 19 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sidebar/sidebar-trigger.svelte: -------------------------------------------------------------------------------- 1 | 19 | 20 | 35 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/skeleton/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./skeleton.svelte"; 2 | 3 | export { 4 | Root, 5 | // 6 | Root as Skeleton, 7 | }; 8 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/skeleton/skeleton.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 |
    18 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/slider/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./slider.svelte"; 2 | 3 | export { 4 | Root, 5 | // 6 | Root as Slider, 7 | }; 8 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sonner/index.ts: -------------------------------------------------------------------------------- 1 | export { default as Toaster } from "./sonner.svelte"; 2 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/sonner/sonner.svelte: -------------------------------------------------------------------------------- 1 | 7 | 8 | 21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/switch/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./switch.svelte"; 2 | 3 | export { 4 | Root, 5 | // 6 | Root as Switch, 7 | }; 8 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/table/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./table.svelte"; 2 | import Body from "./table-body.svelte"; 3 | import Caption from "./table-caption.svelte"; 4 | import Cell from "./table-cell.svelte"; 5 | import Footer from "./table-footer.svelte"; 6 | import Head from "./table-head.svelte"; 7 | import Header from "./table-header.svelte"; 8 | import Row from "./table-row.svelte"; 9 | 10 | export { 11 | Root, 12 | Body, 13 | Caption, 14 | Cell, 15 | Footer, 16 | Head, 17 | Header, 18 | Row, 19 | // 20 | Root as Table, 21 | Body as TableBody, 22 | Caption as TableCaption, 23 | Cell as TableCell, 24 | Footer as TableFooter, 25 | Head as TableHead, 26 | Header as TableHeader, 27 | Row as TableRow, 28 | }; 29 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/table/table-body.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 15 | {@render children?.()} 16 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/table/table-caption.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 15 | {@render children?.()} 16 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/table/table-cell.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 19 | {@render children?.()} 20 | 21 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/table/table-footer.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 15 | {@render children?.()} 16 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/table/table-head.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 22 | {@render children?.()} 23 | 24 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/table/table-header.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 15 | {@render children?.()} 16 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/table/table-row.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 22 | {@render children?.()} 23 | 24 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/table/table.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 |
    15 | 16 | {@render children?.()} 17 |
    18 |
    19 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/tabs/index.ts: -------------------------------------------------------------------------------- 1 | import { Tabs as TabsPrimitive } from "bits-ui"; 2 | import Content from "./tabs-content.svelte"; 3 | import List from "./tabs-list.svelte"; 4 | import Trigger from "./tabs-trigger.svelte"; 5 | 6 | const Root = TabsPrimitive.Root; 7 | 8 | export { 9 | Root, 10 | Content, 11 | List, 12 | Trigger, 13 | // 14 | Root as Tabs, 15 | Content as TabsContent, 16 | List as TabsList, 17 | Trigger as TabsTrigger, 18 | }; 19 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/tabs/tabs-content.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/tabs/tabs-list.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/tabs/tabs-trigger.svelte: -------------------------------------------------------------------------------- 1 | 11 | 12 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/textarea/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./textarea.svelte"; 2 | 3 | type FormTextareaEvent = T & { 4 | currentTarget: EventTarget & HTMLTextAreaElement; 5 | }; 6 | 7 | type TextareaEvents = { 8 | blur: FormTextareaEvent; 9 | change: FormTextareaEvent; 10 | click: FormTextareaEvent; 11 | focus: FormTextareaEvent; 12 | keydown: FormTextareaEvent; 13 | keypress: FormTextareaEvent; 14 | keyup: FormTextareaEvent; 15 | mouseover: FormTextareaEvent; 16 | mouseenter: FormTextareaEvent; 17 | mouseleave: FormTextareaEvent; 18 | paste: FormTextareaEvent; 19 | input: FormTextareaEvent; 20 | }; 21 | 22 | export { 23 | Root, 24 | // 25 | Root as Textarea, 26 | type TextareaEvents, 27 | type FormTextareaEvent, 28 | }; 29 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/textarea/textarea.svelte: -------------------------------------------------------------------------------- 1 | 13 | 14 | 23 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/toggle-group/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./toggle-group.svelte"; 2 | import Item from "./toggle-group-item.svelte"; 3 | 4 | export { 5 | Root, 6 | Item, 7 | // 8 | Root as ToggleGroup, 9 | Item as ToggleGroupItem, 10 | }; 11 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/toggle-group/toggle-group-item.svelte: -------------------------------------------------------------------------------- 1 | 18 | 19 | 31 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/toggle/index.ts: -------------------------------------------------------------------------------- 1 | import Root from "./toggle.svelte"; 2 | export { 3 | toggleVariants, 4 | type ToggleSize, 5 | type ToggleVariant, 6 | type ToggleVariants, 7 | } from "./toggle.svelte"; 8 | 9 | export { 10 | Root, 11 | // 12 | Root as Toggle, 13 | }; 14 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/tooltip/index.ts: -------------------------------------------------------------------------------- 1 | import { Tooltip as TooltipPrimitive } from "bits-ui"; 2 | import Content from "./tooltip-content.svelte"; 3 | 4 | const Root = TooltipPrimitive.Root; 5 | const Trigger = TooltipPrimitive.Trigger; 6 | const Provider = TooltipPrimitive.Provider; 7 | 8 | export { 9 | Root, 10 | Trigger, 11 | Content, 12 | Provider, 13 | // 14 | Root as Tooltip, 15 | Content as TooltipContent, 16 | Trigger as TooltipTrigger, 17 | Provider as TooltipProvider, 18 | }; 19 | -------------------------------------------------------------------------------- /sites/docs/src/lib/components/ui/tooltip/tooltip-content.svelte: -------------------------------------------------------------------------------- 1 | 12 | 13 | 22 | -------------------------------------------------------------------------------- /sites/docs/src/lib/constants.ts: -------------------------------------------------------------------------------- 1 | export const BASE_URL_COMPONENTS_GITHUB = 'https://github.com/tzezar/shadcn-svelte-enhancements/tree/main/sites/docs/src/lib/components/tzezars-enhancements'; -------------------------------------------------------------------------------- /sites/docs/src/lib/hooks/is-mobile.svelte.ts: -------------------------------------------------------------------------------- 1 | import { MediaQuery } from "svelte/reactivity"; 2 | 3 | const MOBILE_BREAKPOINT = 768; 4 | 5 | export class IsMobile extends MediaQuery { 6 | constructor() { 7 | super(`max-width: ${MOBILE_BREAKPOINT - 1}px`); 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /sites/docs/src/lib/hooks/use-clipboard.svelte.ts: -------------------------------------------------------------------------------- 1 | type Options = { 2 | resetAfter: number; 3 | }; 4 | 5 | export class UseClipboard { 6 | #copiedStatus = $state<'success' | 'failure'>(); 7 | private resetAfter: number; 8 | private timeout: ReturnType | undefined = undefined; 9 | 10 | constructor({ resetAfter = 500 }: Partial = {}) { 11 | this.resetAfter = resetAfter; 12 | } 13 | 14 | 15 | async copy(text: string) { 16 | if (this.timeout) { 17 | this.#copiedStatus = undefined; 18 | clearTimeout(this.timeout); 19 | } 20 | 21 | try { 22 | await navigator.clipboard.writeText(text); 23 | 24 | this.#copiedStatus = 'success'; 25 | 26 | this.timeout = setTimeout(() => { 27 | this.#copiedStatus = undefined; 28 | }, this.resetAfter); 29 | } catch { 30 | this.#copiedStatus = 'failure'; 31 | 32 | this.timeout = setTimeout(() => { 33 | this.#copiedStatus = undefined; 34 | }, this.resetAfter); 35 | } 36 | 37 | return this.#copiedStatus; 38 | } 39 | 40 | get copied() { 41 | return this.#copiedStatus === 'success'; 42 | } 43 | 44 | get status() { 45 | return this.#copiedStatus; 46 | } 47 | } -------------------------------------------------------------------------------- /sites/docs/src/lib/index.ts: -------------------------------------------------------------------------------- 1 | // place files you want to import through the `$lib` alias in this folder. 2 | -------------------------------------------------------------------------------- /sites/docs/src/lib/utils.ts: -------------------------------------------------------------------------------- 1 | import { type ClassValue, clsx } from "clsx"; 2 | import { twMerge } from "tailwind-merge"; 3 | import { BASE_URL_COMPONENTS_GITHUB } from "./constants"; 4 | 5 | export function cn(...inputs: ClassValue[]) { 6 | return twMerge(clsx(inputs)); 7 | } 8 | 9 | export const createGitHubLink = (slug: string) => { 10 | return BASE_URL_COMPONENTS_GITHUB + "/" + slug 11 | } 12 | 13 | 14 | export const sleep = async (durationMs: number): Promise => 15 | new Promise((res) => setTimeout(res, durationMs)); 16 | 17 | export function formatFileSize(bytes: number): string { 18 | const units = ['B', 'KB', 'MB', 'GB']; 19 | let size = bytes; 20 | let unitIndex = 0; 21 | 22 | while (size >= 1024 && unitIndex < units.length - 1) { 23 | size /= 1024; 24 | unitIndex++; 25 | } 26 | 27 | return `${size.toFixed(1)} ${units[unitIndex]}`; 28 | } -------------------------------------------------------------------------------- /sites/docs/src/md.d.ts: -------------------------------------------------------------------------------- 1 | declare module '*.md' { 2 | import type { SvelteComponent } from 'svelte'; 3 | 4 | export default class Comp extends SvelteComponent {} 5 | 6 | export const metadata: Record; 7 | } 8 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/_components/light-switch.svelte: -------------------------------------------------------------------------------- 1 | 10 | 11 | 20 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/_layout/nav-secondary.svelte: -------------------------------------------------------------------------------- 1 | 19 | 20 | 21 | 22 | 23 | {#each items as item (item.title)} 24 | 25 | 26 | {#snippet child({ props })} 27 | 28 | 29 | {item.title} 30 | 31 | {/snippet} 32 | 33 | 34 | {/each} 35 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/+page.svelte: -------------------------------------------------------------------------------- 1 | 5 | 6 |
    7 | {#each components as item} 8 |

    9 | 10 | {item.title} 11 | 12 |

    13 | {/each} 14 |
    15 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/+page.ts: -------------------------------------------------------------------------------- 1 | // import { redirect } from '@sveltejs/kit'; 2 | 3 | // export function load() { 4 | // throw redirect(303, '/components/avatar-group'); 5 | // } 6 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/avatar-group/+page.svelte: -------------------------------------------------------------------------------- 1 | 4 |
    5 | 6 | 7 |
    -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/avatar-group/content.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Avatar Group 3 | component: avatar-group 4 | --- 5 | 6 | 13 | 14 | # {title} 15 | 16 | Displays a collection of user avatars, often used to show group members or participants. 17 | 18 |
    19 | 20 | Component source 21 | 22 | ## Horizontal 23 | 24 | 25 | 26 | 27 | 28 | ## Vertical 29 | 30 | 31 | 32 | 33 | 34 | ## Usage 35 | 36 | 37 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/avatar-group/data.ts: -------------------------------------------------------------------------------- 1 | 2 | 3 | export const data = [ 4 | { 5 | name: 'Smeagol', 6 | image: "https://tolkienowski.wordpress.com/wp-content/uploads/2013/06/ed407-gollum-smeagol-smeagol-gollum-14076899-960-403.jpg?w=640" 7 | }, 8 | { 9 | name: 'Samwise Gamgee', 10 | image: 'https://www.theonering.net/torwp/wp-content/uploads/2013/05/samwise-gamgee.jpg' 11 | }, 12 | { 13 | name: 'Gandalf the Grey', 14 | image: "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcT2X_t3MManVKOMzSFwNpv5_Ca8opRQQmhh-A&s" 15 | }, 16 | { 17 | name: 'Legolas', 18 | image: "https://fwcdn.pl/fph/10/65/1065/447299_4.12.webp" 19 | }, 20 | { 21 | name: 'Peregrin Took', 22 | image: '' 23 | } 24 | ]; 25 | 26 | 27 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/avatar-group/examples.ts: -------------------------------------------------------------------------------- 1 | 2 | import horizontalRaw from './horizontal.svelte?raw' 3 | import Horizontal from './horizontal.svelte' 4 | 5 | import verticalRaw from './vertical.svelte?raw' 6 | import Vertical from './vertical.svelte' 7 | 8 | const codeExample = ` 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | ` 21 | 22 | 23 | const examples = { 24 | horizontal: { 25 | code: horizontalRaw, 26 | component: Horizontal 27 | }, 28 | vertical: { 29 | code: verticalRaw, 30 | component: Vertical 31 | }, 32 | codeExample: { 33 | code: codeExample 34 | } 35 | } 36 | 37 | export { examples } -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/avatar-group/horizontal.svelte: -------------------------------------------------------------------------------- 1 | 5 | 6 | 7 | {#each data.slice(0, 4) as member} 8 | 9 | 10 | 11 | {member.name} 12 | 13 | 14 | {/each} 15 | 16 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/avatar-group/vertical.svelte: -------------------------------------------------------------------------------- 1 | 5 | 6 | 7 | {#each data.slice(0, 4) as member} 8 | 9 | 10 | 11 | {member.name} 12 | 13 | 14 | {/each} 15 | 16 | 17 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/code-block/+page.svelte: -------------------------------------------------------------------------------- 1 | 4 |
    5 | 6 | 7 |
    -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/code-block/content.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Code Snippet 3 | component: code-snippet 4 | --- 5 | 6 | 13 | 14 | # {title} 15 | 16 | Renders a formatted block of code with syntax highlighting for readability. 17 | 18 |
    19 | 20 | Component source 21 | 22 | 23 | ## Example 24 | 25 | 26 | 27 | 28 | 29 | 30 | ## Usage 31 | 32 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/code-block/example.svelte: -------------------------------------------------------------------------------- 1 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/code-block/examples.ts: -------------------------------------------------------------------------------- 1 | import exampleRaw from './example.svelte?raw' 2 | import example from './example.svelte' 3 | 4 | 5 | const usageCode = ` 8 | 9 | ` 10 | 11 | 12 | const examples = { 13 | example: { 14 | code: exampleRaw, 15 | component: example 16 | }, 17 | usage: { 18 | code: usageCode 19 | } 20 | } 21 | 22 | export { examples } -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/code-snippet/+page.svelte: -------------------------------------------------------------------------------- 1 | 4 |
    5 | 6 | 7 |
    -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/code-snippet/content.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Code Snippet 3 | component: code-snippet 4 | --- 5 | 6 | 13 | 14 | # {title} 15 | 16 | Displays a short piece of code inline or in a small container for quick reference. 17 | 18 |
    19 | 20 | Component source 21 | 22 | ## Example 23 | 24 | 25 | 26 | 27 | 28 | ## Usage 29 | 30 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/code-snippet/example.svelte: -------------------------------------------------------------------------------- 1 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/code-snippet/examples.ts: -------------------------------------------------------------------------------- 1 | import exampleRaw from './example.svelte?raw' 2 | import example from './example.svelte' 3 | 4 | const usageCode = ` 7 | 8 | ` 9 | 10 | const examples = { 11 | example: { 12 | code: exampleRaw, 13 | component: example 14 | }, 15 | usage: { 16 | code: usageCode 17 | } 18 | } 19 | 20 | export { examples } -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/copy-button/+page.svelte: -------------------------------------------------------------------------------- 1 | 4 |
    5 | 6 | 7 |
    -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/copy-button/content.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Copy Button 3 | component: copy-button 4 | 5 | --- 6 | 7 | 14 | 15 | # {title} 16 | 17 | Provides a button to copy text or code to the clipboard with a single click. 18 | 19 |
    20 | 21 | Component source 22 | 23 | ## Example 24 | 25 | 26 | 27 | 28 | 29 | ## Usage 30 | 31 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/copy-button/example.svelte: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/copy-button/examples.ts: -------------------------------------------------------------------------------- 1 | import exampleRaw from './example.svelte?raw' 2 | import example from './example.svelte' 3 | 4 | const usageCode = ` 7 | 8 | ` 9 | 10 | 11 | const examples = { 12 | example: { 13 | code: exampleRaw, 14 | component: example 15 | }, 16 | usage: { 17 | code: usageCode 18 | } 19 | } 20 | 21 | export { examples } -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/file-dropzone/+page.svelte: -------------------------------------------------------------------------------- 1 | 4 |
    5 | 6 | 7 |
    -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/file-dropzone/content.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: File Dropzone 3 | component: file-dropzone 4 | --- 5 | 6 | 13 | 14 | # {title} 15 | 16 | Allows users to drag and drop files for upload, with optional previews and validations. 17 | 18 |
    19 | 20 | Component source 21 | 22 | ## Example 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/file-dropzone/examples.ts: -------------------------------------------------------------------------------- 1 | import exampleRaw from './example.svelte?raw' 2 | import example from './example.svelte' 3 | 4 | const examples = { 5 | example: { 6 | code: exampleRaw, 7 | component: example 8 | } 9 | } 10 | 11 | export { examples } -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/link/+page.svelte: -------------------------------------------------------------------------------- 1 | 4 |
    5 | 6 | 7 |
    -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/link/content.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Link 3 | component: link 4 | --- 5 | 6 | 13 | 14 | 15 | # {title} 16 | 17 | A stylized anchor element for navigating to external or internal pages. 18 | 19 |
    20 | 21 | Component source 22 | 23 | ## Example 24 | 25 | 26 | 27 | 28 | 29 | 30 | ## Usage 31 | 32 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/link/data.ts: -------------------------------------------------------------------------------- 1 | 2 | 3 | export const data = [ 4 | { 5 | name: 'Smeagol', 6 | image: "https://tolkienowski.wordpress.com/wp-content/uploads/2013/06/ed407-gollum-smeagol-smeagol-gollum-14076899-960-403.jpg?w=640" 7 | }, 8 | { 9 | name: 'Samwise Gamgee', 10 | image: 'https://www.theonering.net/torwp/wp-content/uploads/2013/05/samwise-gamgee.jpg' 11 | }, 12 | { 13 | name: 'Gandalf the Grey', 14 | image: "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcT2X_t3MManVKOMzSFwNpv5_Ca8opRQQmhh-A&s" 15 | }, 16 | { 17 | name: 'Legolas', 18 | image: "https://fwcdn.pl/fph/10/65/1065/447299_4.12.webp" 19 | }, 20 | { 21 | name: 'Peregrin Took', 22 | image: '' 23 | } 24 | ]; -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/link/examples.ts: -------------------------------------------------------------------------------- 1 | 2 | import linkExampleRaw from './link-example.svelte?raw' 3 | import linkExample from './link-example.svelte' 4 | 5 | import linkUsage from './link-usage.svelte' 6 | import linkUsageRaw from './link-usage.svelte?raw' 7 | 8 | const examples = { 9 | link: { 10 | code: linkExampleRaw, 11 | component: linkExample 12 | }, 13 | linkUsage: { 14 | code: linkUsageRaw, 15 | component: linkUsage 16 | } 17 | } 18 | 19 | export { examples } -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/link/link-example.svelte: -------------------------------------------------------------------------------- 1 | 4 | 5 |
    6 |

    Check out these amazing Middle-earth experiences:

    7 | 8 |
    9 | 10 | Minecraft Middle Earth 11 | 12 |

    13 | Dive into the breathtaking world of Middle-earth recreated block by block in Minecraft, where 14 | you can explore iconic locations from The Lord of the Rings and The Hobbit. 15 |

    16 |
    17 | 18 |
    19 | 24 | The Lord of the Rings trilogy but it's just the memes 25 | 26 |

    27 | Watch iconic scenes from The Lord of the Rings trilogy that became the foundation for many of 28 | the most popular memes on the internet. 29 |

    30 |
    31 |
    32 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/link/link-usage.svelte: -------------------------------------------------------------------------------- 1 | 4 | 5 | General Kenobi -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/password-input/+page.svelte: -------------------------------------------------------------------------------- 1 | 4 |
    5 | 6 | 7 |
    -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/password-input/content.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Password Input 3 | component: password-input 4 | --- 5 | 6 | 13 | 14 | # {title} 15 | 16 | A secure text input field for passwords with a visibility toggle. 17 | 18 |
    19 | 20 | Component source 21 | 22 | ## Example 23 | 24 | 25 | 26 | 27 | 28 | ## Usage 29 | 30 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/password-input/example.svelte: -------------------------------------------------------------------------------- 1 | 7 | 8 |
    9 | 10 |

    11 | {#if showPassword} 12 | There Is No Secret Ingredient. It's Just You. 13 | {:else} 14 | All Right Then, Keep Your Secrets. 15 | {/if} 16 |

    17 |
    18 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/password-input/examples.ts: -------------------------------------------------------------------------------- 1 | import exampleRaw from './example.svelte?raw' 2 | import example from './example.svelte' 3 | 4 | const usageCode = ` 10 | 11 | 12 | ` 13 | 14 | const examples = { 15 | example: { 16 | code: exampleRaw, 17 | component: example 18 | }, 19 | usage: { 20 | code: usageCode 21 | } 22 | } 23 | 24 | export { examples } -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/scroll-progress-indicator/+page.svelte: -------------------------------------------------------------------------------- 1 | 4 |
    5 | 6 | 7 |
    -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/scroll-progress-indicator/example-bar.svelte: -------------------------------------------------------------------------------- 1 | 4 | 5 | 16 | {#each Array.from({ length: 10 }) as item, i} 17 |
    18 | {i + 1} 19 |
    20 | {/each} 21 |     22 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/scroll-progress-indicator/example.svelte: -------------------------------------------------------------------------------- 1 | 5 | 6 | 20 | {#each Array.from({ length: 10 }) as item, i} 21 |
    22 | {i + 1} 23 |
    24 | {/each} 25 |     26 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/transfer-list/+page.svelte: -------------------------------------------------------------------------------- 1 | 4 |
    5 | 6 | 7 |
    -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/transfer-list/content.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Transfer List 3 | component: transfer-list 4 | --- 5 | 6 | 13 | 14 | 15 | # {title} 16 | 17 | A dual-list component for moving items between two lists, commonly used for selections. 18 | 19 |
    20 | 21 | Component source 22 | 23 | ## Horizontal 24 | 25 | 26 | 27 | 28 | 29 | ## Vertical 30 | 31 | 32 | 33 | 34 | 35 | ## Usage 36 | 37 | 38 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/transfer-list/data.ts: -------------------------------------------------------------------------------- 1 | 2 | 3 | export const data = [ 4 | { 5 | name: 'Smeagol', 6 | image: "https://tolkienowski.wordpress.com/wp-content/uploads/2013/06/ed407-gollum-smeagol-smeagol-gollum-14076899-960-403.jpg?w=640" 7 | }, 8 | { 9 | name: 'Samwise Gamgee', 10 | image: 'https://www.theonering.net/torwp/wp-content/uploads/2013/05/samwise-gamgee.jpg' 11 | }, 12 | { 13 | name: 'Gandalf the Grey', 14 | image: "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcT2X_t3MManVKOMzSFwNpv5_Ca8opRQQmhh-A&s" 15 | }, 16 | { 17 | name: 'Legolas', 18 | image: "https://fwcdn.pl/fph/10/65/1065/447299_4.12.webp" 19 | }, 20 | { 21 | name: 'Peregrin Took', 22 | image: '' 23 | } 24 | ]; -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/virtual-select/+page.svelte: -------------------------------------------------------------------------------- 1 | 4 |
    5 | 6 | 7 |
    -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/virtual-select/code-samples/usage.ts: -------------------------------------------------------------------------------- 1 | export const usageCodeSample = ` 4 | 5 | 6 | 7 | // trigger placeholder 8 | 9 | 10 | 11 | 12 | {#snippet children(index, item)} 13 | 14 | {item.label} 15 | 16 | {/snippet} 17 | 18 | 19 | 20 | ` -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/virtual-select/examples.ts: -------------------------------------------------------------------------------- 1 | import VSMRaw from './virtual-multi-select.svelte?raw' 2 | import VSRaw from './virtual-select.svelte?raw' 3 | import VS from './virtual-select.svelte' 4 | import VSM from './virtual-multi-select.svelte' 5 | import { usageCodeSample } from './code-samples/usage' 6 | 7 | 8 | const examples = { 9 | components: { 10 | vs: VS, 11 | vsm: VSM 12 | }, 13 | code: { 14 | vs: VSRaw, 15 | vsm: VSMRaw, 16 | samples: { 17 | usage: usageCodeSample 18 | } 19 | 20 | } 21 | } 22 | 23 | export { examples } -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/components/virtual-select/select-group.svelte: -------------------------------------------------------------------------------- 1 | 15 | 16 | {@render children?.()} 17 | 18 | 19 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/quick-start/installation/+page.svelte: -------------------------------------------------------------------------------- 1 | 4 | 5 |
    6 | 7 |
    8 | -------------------------------------------------------------------------------- /sites/docs/src/routes/(routes)/quick-start/installation/examples.ts: -------------------------------------------------------------------------------- 1 | 2 | const codeBlock = `✔ Where do you want to place components? ./src/lib/components/tzezars-enhancements 3 | ✔ Select components to install (use space to select multiple): 4 | [x] avatar-group 5 | [x] code-block 6 | [ ] code-snippet 7 | ... ` 8 | 9 | const usageCode = ` 12 | 13 | ` 14 | 15 | 16 | 17 | const examples = { 18 | promt: { 19 | code: codeBlock 20 | }, 21 | usage: { 22 | code: usageCode 23 | } 24 | } 25 | 26 | export { examples } -------------------------------------------------------------------------------- /sites/docs/src/routes/+layout.svelte: -------------------------------------------------------------------------------- 1 | 2 | 11 | 12 | 13 | 14 | {@render children?.()} 15 | -------------------------------------------------------------------------------- /sites/docs/static/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tzezar/shadcn-svelte-enhancements/aa7c2cb88d3cb853c75aa767ebd0efe5b25fa94e/sites/docs/static/favicon.png -------------------------------------------------------------------------------- /sites/docs/static/tzezar-logo-black.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tzezar/shadcn-svelte-enhancements/aa7c2cb88d3cb853c75aa767ebd0efe5b25fa94e/sites/docs/static/tzezar-logo-black.png -------------------------------------------------------------------------------- /sites/docs/static/tzezar-logo-white.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/tzezar/shadcn-svelte-enhancements/aa7c2cb88d3cb853c75aa767ebd0efe5b25fa94e/sites/docs/static/tzezar-logo-white.png -------------------------------------------------------------------------------- /sites/docs/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./.svelte-kit/tsconfig.json", 3 | "compilerOptions": { 4 | "allowJs": true, 5 | "checkJs": true, 6 | "esModuleInterop": true, 7 | "forceConsistentCasingInFileNames": true, 8 | "resolveJsonModule": true, 9 | "skipLibCheck": true, 10 | "sourceMap": true, 11 | "strict": true, 12 | "moduleResolution": "bundler", 13 | "allowImportingTsExtensions": true, 14 | } 15 | // Path aliases are handled by https://svelte.dev/docs/kit/configuration#alias 16 | // except $lib which is handled by https://svelte.dev/docs/kit/configuration#files 17 | // 18 | // If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes 19 | // from the referenced tsconfig.json - TypeScript does not merge them in 20 | } 21 | -------------------------------------------------------------------------------- /sites/docs/vite.config.ts: -------------------------------------------------------------------------------- 1 | import { sveltekit } from '@sveltejs/kit/vite'; 2 | import { defineConfig } from 'vite'; 3 | 4 | export default defineConfig({ 5 | plugins: [sveltekit()] 6 | }); 7 | --------------------------------------------------------------------------------