├── .gitignore ├── .npmrc ├── .vscode └── settings.json ├── LICENSE ├── README.md ├── biome.json ├── examples ├── accordion │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── checkbox │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── combobox │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── MultipleExample.tsx │ │ ├── SingleExample.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ ├── utils.tsx │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── command │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── MultiSelect.tsx │ │ ├── SingleSelect.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ ├── utils.tsx │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── commandbar │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── context-menu │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── dialog │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── disclosure │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── dropdown-menu │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── feed │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── listbox │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── MultipleExample.tsx │ │ ├── SingleExample.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ ├── utils.tsx │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── menu │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── popover │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── radiogroup │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── select │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── MultiSelect.tsx │ │ ├── SingleSelect.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ ├── utils.tsx │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── tabs │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── toaster │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── toolbar │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ │ ├── App.tsx │ │ ├── main.tsx │ │ ├── style.css │ │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js └── transitions │ ├── .gitignore │ ├── favicon.svg │ ├── index.html │ ├── package.json │ ├── postcss.config.js │ ├── src │ ├── App.tsx │ ├── main.tsx │ ├── style.css │ └── vite-env.d.ts │ ├── tailwind.config.js │ ├── tsconfig.json │ └── vite.config.js ├── images ├── banner.png └── opengraph.png ├── lerna.json ├── package.json ├── packages └── terracotta │ ├── .gitignore │ ├── README.md │ ├── package.json │ ├── pridepack.json │ ├── src │ ├── components │ │ ├── accordion │ │ │ ├── Accordion.ts │ │ │ ├── AccordionButton.ts │ │ │ ├── AccordionContext.ts │ │ │ ├── AccordionHeader.ts │ │ │ ├── AccordionItem.ts │ │ │ ├── AccordionItemContext.ts │ │ │ ├── AccordionPanel.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── alert-dialog │ │ │ ├── AlertDialog.ts │ │ │ ├── AlertDialogContext.ts │ │ │ ├── AlertDialogDescription.ts │ │ │ ├── AlertDialogOverlay.ts │ │ │ ├── AlertDialogPanel.ts │ │ │ ├── AlertDialogTitle.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── alert │ │ │ └── index.ts │ │ ├── button │ │ │ └── index.ts │ │ ├── checkbox │ │ │ ├── Checkbox.ts │ │ │ ├── CheckboxContext.ts │ │ │ ├── CheckboxDescription.ts │ │ │ ├── CheckboxIndicator.ts │ │ │ ├── CheckboxLabel.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── color-scheme │ │ │ └── index.ts │ │ ├── combobox │ │ │ ├── Combobox.ts │ │ │ ├── ComboboxContext.ts │ │ │ ├── ComboboxInput.ts │ │ │ ├── ComboboxLabel.ts │ │ │ ├── ComboboxOption.ts │ │ │ ├── ComboboxOptions.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── command-bar │ │ │ ├── CommandBar.ts │ │ │ ├── CommandBarContext.ts │ │ │ ├── CommandBarDescription.ts │ │ │ ├── CommandBarOverlay.ts │ │ │ ├── CommandBarPanel.ts │ │ │ ├── CommandBarTitle.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── command │ │ │ ├── Command.ts │ │ │ ├── CommandContext.ts │ │ │ ├── CommandInput.ts │ │ │ ├── CommandLabel.ts │ │ │ ├── CommandOption.ts │ │ │ ├── CommandOptions.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── context-menu │ │ │ ├── ContextMenu.ts │ │ │ ├── ContextMenuBoundary.ts │ │ │ ├── ContextMenuContext.ts │ │ │ ├── ContextMenuOverlay.ts │ │ │ ├── ContextMenuPanel.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── dialog │ │ │ ├── Dialog.ts │ │ │ ├── DialogContext.ts │ │ │ ├── DialogDescription.ts │ │ │ ├── DialogOverlay.ts │ │ │ ├── DialogPanel.ts │ │ │ ├── DialogTitle.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── disclosure │ │ │ ├── Disclosure.ts │ │ │ ├── DisclosureButton.ts │ │ │ ├── DisclosureContext.ts │ │ │ ├── DisclosurePanel.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── feed │ │ │ ├── Feed.ts │ │ │ ├── FeedArticle.ts │ │ │ ├── FeedArticleContext.ts │ │ │ ├── FeedArticleDescription.ts │ │ │ ├── FeedArticleLabel.ts │ │ │ ├── FeedContent.ts │ │ │ ├── FeedContentContext.ts │ │ │ ├── FeedContext.ts │ │ │ ├── FeedLabel.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── listbox │ │ │ ├── Listbox.ts │ │ │ ├── ListboxButton.ts │ │ │ ├── ListboxContext.ts │ │ │ ├── ListboxLabel.ts │ │ │ ├── ListboxOption.ts │ │ │ ├── ListboxOptions.ts │ │ │ ├── ListboxOptionsContext.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── menu │ │ │ ├── Menu.ts │ │ │ ├── MenuChild.ts │ │ │ ├── MenuContext.ts │ │ │ ├── MenuItem.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── popover │ │ │ ├── Popover.ts │ │ │ ├── PopoverButton.ts │ │ │ ├── PopoverContext.ts │ │ │ ├── PopoverOverlay.ts │ │ │ ├── PopoverPanel.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── radio-group │ │ │ ├── RadioGroup.ts │ │ │ ├── RadioGroupContext.ts │ │ │ ├── RadioGroupDescription.ts │ │ │ ├── RadioGroupLabel.ts │ │ │ ├── RadioGroupOption.ts │ │ │ ├── RadioGroupRootContext.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── select │ │ │ ├── Select.ts │ │ │ ├── SelectContext.ts │ │ │ ├── SelectOption.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── tabs │ │ │ ├── Tab.ts │ │ │ ├── TabGroup.ts │ │ │ ├── TabGroupContext.ts │ │ │ ├── TabList.ts │ │ │ ├── TabListContext.ts │ │ │ ├── TabPanel.ts │ │ │ ├── index.ts │ │ │ └── tags.ts │ │ ├── toast │ │ │ └── index.ts │ │ ├── toggle │ │ │ └── index.ts │ │ ├── toolbar │ │ │ └── index.ts │ │ └── transition │ │ │ └── index.ts │ ├── index.ts │ ├── states │ │ ├── create-autocomplete-option-state.ts │ │ ├── create-autocomplete-state.ts │ │ ├── create-check-state.ts │ │ ├── create-disclosure-state.ts │ │ ├── create-input-state.ts │ │ ├── create-select-option-state.ts │ │ ├── create-select-state.ts │ │ └── create-toggle-state.ts │ └── utils │ │ ├── Fragment.ts │ │ ├── assert.ts │ │ ├── create-dynamic.ts │ │ ├── create-input-reader.ts │ │ ├── create-show.ts │ │ ├── create-type-ahead.ts │ │ ├── create-unmountable.ts │ │ ├── dynamic-prop.ts │ │ ├── focus-navigation.ts │ │ ├── focus-navigator.ts │ │ ├── focus-query.ts │ │ ├── focus-start-point.ts │ │ ├── is-equal.ts │ │ ├── namespace.ts │ │ ├── state-props.ts │ │ ├── types.ts │ │ ├── use-event-listener.ts │ │ ├── use-focus-start-point.ts │ │ └── virtual-focus.ts │ └── tsconfig.json ├── pnpm-lock.yaml └── pnpm-workspace.yaml /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | 8 | # Runtime data 9 | pids 10 | *.pid 11 | *.seed 12 | *.pid.lock 13 | 14 | # Directory for instrumented libs generated by jscoverage/JSCover 15 | lib-cov 16 | 17 | # Coverage directory used by tools like istanbul 18 | coverage 19 | 20 | # nyc test coverage 21 | .nyc_output 22 | 23 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) 24 | .grunt 25 | 26 | # Bower dependency directory (https://bower.io/) 27 | bower_components 28 | 29 | # node-waf configuration 30 | .lock-wscript 31 | 32 | # Compiled binary addons (https://nodejs.org/api/addons.html) 33 | build/Release 34 | 35 | # Dependency directories 36 | node_modules/ 37 | jspm_packages/ 38 | 39 | # TypeScript v1 declaration files 40 | typings/ 41 | 42 | # Optional npm cache directory 43 | .npm 44 | 45 | # Optional eslint cache 46 | .eslintcache 47 | 48 | # Optional REPL history 49 | .node_repl_history 50 | 51 | # Output of 'npm pack' 52 | *.tgz 53 | 54 | # Yarn Integrity file 55 | .yarn-integrity 56 | 57 | # dotenv environment variables file 58 | .env 59 | 60 | # parcel-bundler cache (https://parceljs.org/) 61 | .cache 62 | 63 | # next.js build output 64 | .next 65 | 66 | # nuxt.js build output 67 | .nuxt 68 | 69 | # vuepress build output 70 | .vuepress/dist 71 | 72 | # Serverless directories 73 | .serverless 74 | 75 | # FuseBox cache 76 | .fusebox/ 77 | 78 | dist 79 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | strict-peer-dependencies=false 2 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "editor.defaultFormatter": "biomejs.biome", 3 | "[typescript]": { 4 | "editor.defaultFormatter": "biomejs.biome" 5 | }, 6 | "[typescriptreact]": { 7 | "editor.defaultFormatter": "biomejs.biome" 8 | }, 9 | "[javascript]": { 10 | "editor.defaultFormatter": "biomejs.biome" 11 | }, 12 | "[json]": { 13 | "editor.defaultFormatter": "biomejs.biome" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2025 Alexis Munsayac 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 | -------------------------------------------------------------------------------- /examples/accordion/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | dist 4 | dist-ssr 5 | *.local -------------------------------------------------------------------------------- /examples/accordion/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/accordion/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Vite App 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/accordion/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "accordion-example", 3 | "type": "module", 4 | "version": "1.0.6", 5 | "scripts": { 6 | "dev": "vite", 7 | "build": "vite build", 8 | "serve": "vite preview" 9 | }, 10 | "devDependencies": { 11 | "@tailwindcss/postcss": "^4.0.14", 12 | "postcss": "^8.5.3", 13 | "typescript": "^5.8.2", 14 | "vite": "^6.2.1", 15 | "vite-plugin-solid": "^2.11.6" 16 | }, 17 | "dependencies": { 18 | "solid-js": "^1.9.5", 19 | "tailwindcss": "^4.0.14", 20 | "terracotta": "1.0.6" 21 | }, 22 | "private": true, 23 | "publishConfig": { 24 | "access": "restricted" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /examples/accordion/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | '@tailwindcss/postcss': {}, 4 | }, 5 | }; 6 | -------------------------------------------------------------------------------- /examples/accordion/src/main.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | import { render } from 'solid-js/web'; 3 | import App from './App'; 4 | 5 | import './style.css'; 6 | 7 | function Root(): JSX.Element { 8 | return ( 9 |
10 |
11 | 12 |
13 |
14 | ); 15 | } 16 | 17 | const app = document.getElementById('app'); 18 | 19 | if (app) { 20 | render(() => , app); 21 | } 22 | -------------------------------------------------------------------------------- /examples/accordion/src/style.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; -------------------------------------------------------------------------------- /examples/accordion/src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /examples/accordion/tailwind.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | mode: 'jit', 3 | content: ['./src/**/*.tsx'], 4 | darkMode: 'class', // or 'media' or 'class' 5 | variants: {}, 6 | plugins: [], 7 | }; 8 | -------------------------------------------------------------------------------- /examples/accordion/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "exclude": ["node_modules"], 3 | "include": ["src", "types"], 4 | "compilerOptions": { 5 | "module": "ESNext", 6 | "lib": ["ESNext", "DOM"], 7 | "importHelpers": true, 8 | "declaration": true, 9 | "sourceMap": true, 10 | "rootDir": "./src", 11 | "strict": true, 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "noImplicitReturns": true, 15 | "noFallthroughCasesInSwitch": true, 16 | "moduleResolution": "Bundler", 17 | "jsx": "preserve", 18 | "jsxImportSource": "solid-js", 19 | "esModuleInterop": true, 20 | "target": "ES2017" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /examples/accordion/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite'; 2 | import solidPlugin from 'vite-plugin-solid'; 3 | 4 | export default defineConfig({ 5 | plugins: [solidPlugin()], 6 | }); 7 | -------------------------------------------------------------------------------- /examples/checkbox/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | dist 4 | dist-ssr 5 | *.local -------------------------------------------------------------------------------- /examples/checkbox/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/checkbox/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Vite App 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/checkbox/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "checkbox-example", 3 | "type": "module", 4 | "version": "1.0.6", 5 | "scripts": { 6 | "dev": "vite", 7 | "build": "vite build", 8 | "serve": "vite preview" 9 | }, 10 | "devDependencies": { 11 | "@tailwindcss/postcss": "^4.0.14", 12 | "postcss": "^8.5.3", 13 | "typescript": "^5.8.2", 14 | "vite": "^6.2.1", 15 | "vite-plugin-solid": "^2.11.6" 16 | }, 17 | "dependencies": { 18 | "solid-js": "^1.9.5", 19 | "tailwindcss": "^4.0.14", 20 | "terracotta": "1.0.6" 21 | }, 22 | "private": true, 23 | "publishConfig": { 24 | "access": "restricted" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /examples/checkbox/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | '@tailwindcss/postcss': {}, 4 | }, 5 | }; 6 | -------------------------------------------------------------------------------- /examples/checkbox/src/main.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | import { render } from 'solid-js/web'; 3 | import App from './App'; 4 | 5 | import './style.css'; 6 | 7 | function Root(): JSX.Element { 8 | return ( 9 |
10 |
11 | 12 |
13 |
14 | ); 15 | } 16 | 17 | const app = document.getElementById('app'); 18 | 19 | if (app) { 20 | render(() => , app); 21 | } 22 | -------------------------------------------------------------------------------- /examples/checkbox/src/style.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; -------------------------------------------------------------------------------- /examples/checkbox/src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /examples/checkbox/tailwind.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | mode: 'jit', 3 | content: ['./src/**/*.tsx'], 4 | darkMode: 'class', // or 'media' or 'class' 5 | variants: {}, 6 | plugins: [], 7 | }; 8 | -------------------------------------------------------------------------------- /examples/checkbox/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "exclude": ["node_modules"], 3 | "include": ["src", "types"], 4 | "compilerOptions": { 5 | "module": "ESNext", 6 | "lib": ["ESNext", "DOM"], 7 | "importHelpers": true, 8 | "declaration": true, 9 | "sourceMap": true, 10 | "rootDir": "./src", 11 | "strict": true, 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "noImplicitReturns": true, 15 | "noFallthroughCasesInSwitch": true, 16 | "moduleResolution": "Bundler", 17 | "jsx": "preserve", 18 | "jsxImportSource": "solid-js", 19 | "esModuleInterop": true, 20 | "target": "ES2017" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /examples/checkbox/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite'; 2 | import solidPlugin from 'vite-plugin-solid'; 3 | 4 | export default defineConfig({ 5 | plugins: [solidPlugin()], 6 | }); 7 | -------------------------------------------------------------------------------- /examples/combobox/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | dist 4 | dist-ssr 5 | *.local -------------------------------------------------------------------------------- /examples/combobox/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/combobox/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Vite App 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/combobox/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "combobox-example", 3 | "type": "module", 4 | "version": "1.0.6", 5 | "scripts": { 6 | "dev": "vite", 7 | "build": "vite build", 8 | "serve": "vite preview" 9 | }, 10 | "devDependencies": { 11 | "@tailwindcss/postcss": "^4.0.14", 12 | "postcss": "^8.5.3", 13 | "typescript": "^5.8.2", 14 | "vite": "^6.2.1", 15 | "vite-plugin-solid": "^2.11.6" 16 | }, 17 | "dependencies": { 18 | "solid-js": "^1.9.5", 19 | "tailwindcss": "^4.0.14", 20 | "terracotta": "1.0.6" 21 | }, 22 | "private": true, 23 | "publishConfig": { 24 | "access": "restricted" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /examples/combobox/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | '@tailwindcss/postcss': {}, 4 | }, 5 | }; 6 | -------------------------------------------------------------------------------- /examples/combobox/src/main.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | import { render } from 'solid-js/web'; 3 | import MultipleExample from './MultipleExample'; 4 | import SingleExample from './SingleExample'; 5 | import './style.css'; 6 | 7 | function Root(): JSX.Element { 8 | return ( 9 |
10 |
11 | 12 | 13 |
14 |
15 | ); 16 | } 17 | 18 | const app = document.getElementById('app'); 19 | 20 | if (app) { 21 | render(() => , app); 22 | } 23 | -------------------------------------------------------------------------------- /examples/combobox/src/style.css: -------------------------------------------------------------------------------- 1 | @import "tailwindcss"; 2 | -------------------------------------------------------------------------------- /examples/combobox/src/utils.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | 3 | export function CheckIcon( 4 | props: JSX.IntrinsicElements['svg'] & { title: string }, 5 | ): JSX.Element { 6 | return ( 7 | 14 | {props.title} 15 | 21 | 22 | ); 23 | } 24 | 25 | export function classNames( 26 | ...classes: (string | boolean | undefined)[] 27 | ): string { 28 | return classes.filter(Boolean).join(' '); 29 | } 30 | -------------------------------------------------------------------------------- /examples/combobox/src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /examples/combobox/tailwind.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | mode: 'jit', 3 | content: ['./src/**/*.tsx'], 4 | darkMode: 'class', // or 'media' or 'class' 5 | variants: {}, 6 | plugins: [], 7 | }; 8 | -------------------------------------------------------------------------------- /examples/combobox/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "exclude": ["node_modules"], 3 | "include": ["src", "types"], 4 | "compilerOptions": { 5 | "module": "ESNext", 6 | "lib": ["ESNext", "DOM"], 7 | "importHelpers": true, 8 | "declaration": true, 9 | "sourceMap": true, 10 | "rootDir": "./src", 11 | "strict": true, 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "noImplicitReturns": true, 15 | "noFallthroughCasesInSwitch": true, 16 | "moduleResolution": "Bundler", 17 | "jsx": "preserve", 18 | "jsxImportSource": "solid-js", 19 | "esModuleInterop": true, 20 | "target": "ES2017" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /examples/combobox/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite'; 2 | import solidPlugin from 'vite-plugin-solid'; 3 | 4 | export default defineConfig({ 5 | plugins: [solidPlugin()], 6 | }); 7 | -------------------------------------------------------------------------------- /examples/command/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | dist 4 | dist-ssr 5 | *.local -------------------------------------------------------------------------------- /examples/command/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/command/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Vite App 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/command/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "command-example", 3 | "type": "module", 4 | "version": "1.0.6", 5 | "scripts": { 6 | "dev": "vite", 7 | "build": "vite build", 8 | "serve": "vite preview" 9 | }, 10 | "devDependencies": { 11 | "@tailwindcss/postcss": "^4.0.14", 12 | "postcss": "^8.5.3", 13 | "typescript": "^5.8.2", 14 | "vite": "^6.2.1", 15 | "vite-plugin-solid": "^2.11.6" 16 | }, 17 | "dependencies": { 18 | "solid-js": "^1.9.5", 19 | "tailwindcss": "^4.0.14", 20 | "terracotta": "1.0.6" 21 | }, 22 | "private": true, 23 | "publishConfig": { 24 | "access": "restricted" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /examples/command/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | '@tailwindcss/postcss': {}, 4 | }, 5 | }; 6 | -------------------------------------------------------------------------------- /examples/command/src/main.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | import { render } from 'solid-js/web'; 3 | import MultiSelect from './MultiSelect'; 4 | import SingleSelect from './SingleSelect'; 5 | import './style.css'; 6 | 7 | function Root(): JSX.Element { 8 | return ( 9 |
10 |
11 | 12 | 13 |
14 |
15 | ); 16 | } 17 | 18 | const app = document.getElementById('app'); 19 | 20 | if (app) { 21 | render(() => , app); 22 | } 23 | -------------------------------------------------------------------------------- /examples/command/src/style.css: -------------------------------------------------------------------------------- 1 | @import "tailwindcss"; 2 | -------------------------------------------------------------------------------- /examples/command/src/utils.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | 3 | export function CheckIcon( 4 | props: JSX.IntrinsicElements['svg'] & { title: string }, 5 | ): JSX.Element { 6 | return ( 7 | 14 | {props.title} 15 | 21 | 22 | ); 23 | } 24 | 25 | export function classNames( 26 | ...classes: (string | boolean | undefined)[] 27 | ): string { 28 | return classes.filter(Boolean).join(' '); 29 | } 30 | -------------------------------------------------------------------------------- /examples/command/src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /examples/command/tailwind.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | mode: 'jit', 3 | content: ['./src/**/*.tsx'], 4 | darkMode: 'class', // or 'media' or 'class' 5 | variants: {}, 6 | plugins: [], 7 | }; 8 | -------------------------------------------------------------------------------- /examples/command/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "exclude": ["node_modules"], 3 | "include": ["src", "types"], 4 | "compilerOptions": { 5 | "module": "ESNext", 6 | "lib": ["ESNext", "DOM"], 7 | "importHelpers": true, 8 | "declaration": true, 9 | "sourceMap": true, 10 | "rootDir": "./src", 11 | "strict": true, 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "noImplicitReturns": true, 15 | "noFallthroughCasesInSwitch": true, 16 | "moduleResolution": "Bundler", 17 | "jsx": "preserve", 18 | "jsxImportSource": "solid-js", 19 | "esModuleInterop": true, 20 | "target": "ES2017" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /examples/command/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite'; 2 | import solidPlugin from 'vite-plugin-solid'; 3 | 4 | export default defineConfig({ 5 | plugins: [solidPlugin()], 6 | }); 7 | -------------------------------------------------------------------------------- /examples/commandbar/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | dist 4 | dist-ssr 5 | *.local -------------------------------------------------------------------------------- /examples/commandbar/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/commandbar/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Vite App 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/commandbar/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "commandbar-example", 3 | "type": "module", 4 | "version": "1.0.6", 5 | "scripts": { 6 | "dev": "vite", 7 | "build": "vite build", 8 | "serve": "vite preview" 9 | }, 10 | "devDependencies": { 11 | "@tailwindcss/postcss": "^4.0.14", 12 | "postcss": "^8.5.3", 13 | "typescript": "^5.8.2", 14 | "vite": "^6.2.1", 15 | "vite-plugin-solid": "^2.11.6" 16 | }, 17 | "dependencies": { 18 | "solid-js": "^1.9.5", 19 | "tailwindcss": "^4.0.14", 20 | "terracotta": "1.0.6" 21 | }, 22 | "private": true, 23 | "publishConfig": { 24 | "access": "restricted" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /examples/commandbar/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | '@tailwindcss/postcss': {}, 4 | }, 5 | }; 6 | -------------------------------------------------------------------------------- /examples/commandbar/src/main.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | import { render } from 'solid-js/web'; 3 | import App from './App'; 4 | 5 | import './style.css'; 6 | 7 | function Root(): JSX.Element { 8 | return ( 9 |
10 |
11 | 12 |
13 |
14 | ); 15 | } 16 | 17 | const app = document.getElementById('app'); 18 | 19 | if (app) { 20 | render(() => , app); 21 | } 22 | -------------------------------------------------------------------------------- /examples/commandbar/src/style.css: -------------------------------------------------------------------------------- 1 | @import "tailwindcss"; 2 | -------------------------------------------------------------------------------- /examples/commandbar/src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /examples/commandbar/tailwind.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | mode: 'jit', 3 | content: ['./src/**/*.tsx'], 4 | darkMode: 'class', // or 'media' or 'class' 5 | variants: {}, 6 | plugins: [], 7 | }; 8 | -------------------------------------------------------------------------------- /examples/commandbar/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "exclude": ["node_modules"], 3 | "include": ["src", "types"], 4 | "compilerOptions": { 5 | "module": "ESNext", 6 | "lib": ["ESNext", "DOM"], 7 | "importHelpers": true, 8 | "declaration": true, 9 | "sourceMap": true, 10 | "rootDir": "./src", 11 | "strict": true, 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "noImplicitReturns": true, 15 | "noFallthroughCasesInSwitch": true, 16 | "moduleResolution": "Bundler", 17 | "jsx": "preserve", 18 | "jsxImportSource": "solid-js", 19 | "esModuleInterop": true, 20 | "target": "ES2017" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /examples/commandbar/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite'; 2 | import solidPlugin from 'vite-plugin-solid'; 3 | 4 | export default defineConfig({ 5 | plugins: [solidPlugin()], 6 | }); 7 | -------------------------------------------------------------------------------- /examples/context-menu/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | dist 4 | dist-ssr 5 | *.local -------------------------------------------------------------------------------- /examples/context-menu/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/context-menu/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Vite App 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/context-menu/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "context-menu-example", 3 | "type": "module", 4 | "version": "1.0.6", 5 | "scripts": { 6 | "dev": "vite", 7 | "build": "vite build", 8 | "serve": "vite preview" 9 | }, 10 | "devDependencies": { 11 | "@tailwindcss/postcss": "^4.0.14", 12 | "postcss": "^8.5.3", 13 | "typescript": "^5.8.2", 14 | "vite": "^6.2.1", 15 | "vite-plugin-solid": "^2.11.6" 16 | }, 17 | "dependencies": { 18 | "solid-js": "^1.9.5", 19 | "tailwindcss": "^4.0.14", 20 | "terracotta": "1.0.6" 21 | }, 22 | "private": true, 23 | "publishConfig": { 24 | "access": "restricted" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /examples/context-menu/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | '@tailwindcss/postcss': {}, 4 | }, 5 | }; 6 | -------------------------------------------------------------------------------- /examples/context-menu/src/main.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | import { render } from 'solid-js/web'; 3 | import App from './App'; 4 | 5 | import './style.css'; 6 | 7 | function Root(): JSX.Element { 8 | return ( 9 |
10 |
11 | 12 |
13 |
14 | ); 15 | } 16 | 17 | const app = document.getElementById('app'); 18 | 19 | if (app) { 20 | render(() => , app); 21 | } 22 | -------------------------------------------------------------------------------- /examples/context-menu/src/style.css: -------------------------------------------------------------------------------- 1 | @import "tailwindcss"; 2 | -------------------------------------------------------------------------------- /examples/context-menu/src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /examples/context-menu/tailwind.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | mode: 'jit', 3 | content: ['./src/**/*.tsx'], 4 | darkMode: 'class', // or 'media' or 'class' 5 | variants: {}, 6 | plugins: [], 7 | }; 8 | -------------------------------------------------------------------------------- /examples/context-menu/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "exclude": ["node_modules"], 3 | "include": ["src", "types"], 4 | "compilerOptions": { 5 | "module": "ESNext", 6 | "lib": ["ESNext", "DOM"], 7 | "importHelpers": true, 8 | "declaration": true, 9 | "sourceMap": true, 10 | "rootDir": "./src", 11 | "strict": true, 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "noImplicitReturns": true, 15 | "noFallthroughCasesInSwitch": true, 16 | "moduleResolution": "Bundler", 17 | "jsx": "preserve", 18 | "jsxImportSource": "solid-js", 19 | "esModuleInterop": true, 20 | "target": "ES2017" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /examples/context-menu/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite'; 2 | import solidPlugin from 'vite-plugin-solid'; 3 | 4 | export default defineConfig({ 5 | plugins: [solidPlugin()], 6 | }); 7 | -------------------------------------------------------------------------------- /examples/dialog/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | dist 4 | dist-ssr 5 | *.local -------------------------------------------------------------------------------- /examples/dialog/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/dialog/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Vite App 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/dialog/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "dialog-example", 3 | "type": "module", 4 | "version": "1.0.6", 5 | "scripts": { 6 | "dev": "vite", 7 | "build": "vite build", 8 | "serve": "vite preview" 9 | }, 10 | "devDependencies": { 11 | "@tailwindcss/postcss": "^4.0.14", 12 | "postcss": "^8.5.3", 13 | "typescript": "^5.8.2", 14 | "vite": "^6.2.1", 15 | "vite-plugin-solid": "^2.11.6" 16 | }, 17 | "dependencies": { 18 | "solid-js": "^1.9.5", 19 | "tailwindcss": "^4.0.14", 20 | "terracotta": "1.0.6" 21 | }, 22 | "private": true, 23 | "publishConfig": { 24 | "access": "restricted" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /examples/dialog/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | '@tailwindcss/postcss': {}, 4 | }, 5 | }; 6 | -------------------------------------------------------------------------------- /examples/dialog/src/main.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | import { render } from 'solid-js/web'; 3 | import App from './App'; 4 | 5 | import './style.css'; 6 | 7 | function Root(): JSX.Element { 8 | return ( 9 |
10 |
11 | 12 |
13 |
14 | ); 15 | } 16 | 17 | const app = document.getElementById('app'); 18 | 19 | if (app) { 20 | render(() => , app); 21 | } 22 | -------------------------------------------------------------------------------- /examples/dialog/src/style.css: -------------------------------------------------------------------------------- 1 | @import "tailwindcss"; 2 | -------------------------------------------------------------------------------- /examples/dialog/src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /examples/dialog/tailwind.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | mode: 'jit', 3 | content: ['./src/**/*.tsx'], 4 | darkMode: 'class', // or 'media' or 'class' 5 | variants: {}, 6 | plugins: [], 7 | }; 8 | -------------------------------------------------------------------------------- /examples/dialog/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "exclude": ["node_modules"], 3 | "include": ["src", "types"], 4 | "compilerOptions": { 5 | "module": "ESNext", 6 | "lib": ["ESNext", "DOM"], 7 | "importHelpers": true, 8 | "declaration": true, 9 | "sourceMap": true, 10 | "rootDir": "./src", 11 | "strict": true, 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "noImplicitReturns": true, 15 | "noFallthroughCasesInSwitch": true, 16 | "moduleResolution": "Bundler", 17 | "jsx": "preserve", 18 | "jsxImportSource": "solid-js", 19 | "esModuleInterop": true, 20 | "target": "ES2017" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /examples/dialog/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite'; 2 | import solidPlugin from 'vite-plugin-solid'; 3 | 4 | export default defineConfig({ 5 | plugins: [solidPlugin()], 6 | }); 7 | -------------------------------------------------------------------------------- /examples/disclosure/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | dist 4 | dist-ssr 5 | *.local -------------------------------------------------------------------------------- /examples/disclosure/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/disclosure/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Vite App 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/disclosure/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "disclosure-example", 3 | "type": "module", 4 | "version": "1.0.6", 5 | "scripts": { 6 | "dev": "vite", 7 | "build": "vite build", 8 | "serve": "vite preview" 9 | }, 10 | "devDependencies": { 11 | "@tailwindcss/postcss": "^4.0.14", 12 | "postcss": "^8.5.3", 13 | "typescript": "^5.8.2", 14 | "vite": "^6.2.1", 15 | "vite-plugin-solid": "^2.11.6" 16 | }, 17 | "dependencies": { 18 | "solid-js": "^1.9.5", 19 | "tailwindcss": "^4.0.14", 20 | "terracotta": "1.0.6" 21 | }, 22 | "private": true, 23 | "publishConfig": { 24 | "access": "restricted" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /examples/disclosure/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | '@tailwindcss/postcss': {}, 4 | }, 5 | }; 6 | -------------------------------------------------------------------------------- /examples/disclosure/src/main.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | import { render } from 'solid-js/web'; 3 | import App from './App'; 4 | 5 | import './style.css'; 6 | 7 | function Root(): JSX.Element { 8 | return ( 9 |
10 |
11 | 12 |
13 |
14 | ); 15 | } 16 | 17 | const app = document.getElementById('app'); 18 | 19 | if (app) { 20 | render(() => , app); 21 | } 22 | -------------------------------------------------------------------------------- /examples/disclosure/src/style.css: -------------------------------------------------------------------------------- 1 | @import "tailwindcss"; 2 | -------------------------------------------------------------------------------- /examples/disclosure/src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /examples/disclosure/tailwind.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | mode: 'jit', 3 | content: ['./src/**/*.tsx'], 4 | darkMode: 'class', // or 'media' or 'class' 5 | variants: {}, 6 | plugins: [], 7 | }; 8 | -------------------------------------------------------------------------------- /examples/disclosure/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "exclude": ["node_modules"], 3 | "include": ["src", "types"], 4 | "compilerOptions": { 5 | "module": "ESNext", 6 | "lib": ["ESNext", "DOM"], 7 | "importHelpers": true, 8 | "declaration": true, 9 | "sourceMap": true, 10 | "rootDir": "./src", 11 | "strict": true, 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "noImplicitReturns": true, 15 | "noFallthroughCasesInSwitch": true, 16 | "moduleResolution": "Bundler", 17 | "jsx": "preserve", 18 | "jsxImportSource": "solid-js", 19 | "esModuleInterop": true, 20 | "target": "ES2017" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /examples/disclosure/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite'; 2 | import solidPlugin from 'vite-plugin-solid'; 3 | 4 | export default defineConfig({ 5 | plugins: [solidPlugin()], 6 | }); 7 | -------------------------------------------------------------------------------- /examples/dropdown-menu/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | dist 4 | dist-ssr 5 | *.local -------------------------------------------------------------------------------- /examples/dropdown-menu/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/dropdown-menu/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Vite App 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/dropdown-menu/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "dropdown-menu-example", 3 | "type": "module", 4 | "version": "1.0.6", 5 | "scripts": { 6 | "dev": "vite", 7 | "build": "vite build", 8 | "serve": "vite preview" 9 | }, 10 | "devDependencies": { 11 | "@tailwindcss/postcss": "^4.0.14", 12 | "postcss": "^8.5.3", 13 | "typescript": "^5.8.2", 14 | "vite": "^6.2.1", 15 | "vite-plugin-solid": "^2.11.6" 16 | }, 17 | "dependencies": { 18 | "solid-js": "^1.9.5", 19 | "tailwindcss": "^4.0.14", 20 | "terracotta": "1.0.6" 21 | }, 22 | "private": true, 23 | "publishConfig": { 24 | "access": "restricted" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /examples/dropdown-menu/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | '@tailwindcss/postcss': {}, 4 | }, 5 | }; 6 | -------------------------------------------------------------------------------- /examples/dropdown-menu/src/main.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | import { render } from 'solid-js/web'; 3 | import App from './App'; 4 | 5 | import './style.css'; 6 | 7 | function Root(): JSX.Element { 8 | return ( 9 |
10 |
11 | 12 |
13 |
14 | ); 15 | } 16 | 17 | const app = document.getElementById('app'); 18 | 19 | if (app) { 20 | render(() => , app); 21 | } 22 | -------------------------------------------------------------------------------- /examples/dropdown-menu/src/style.css: -------------------------------------------------------------------------------- 1 | @import "tailwindcss"; 2 | -------------------------------------------------------------------------------- /examples/dropdown-menu/src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /examples/dropdown-menu/tailwind.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | mode: 'jit', 3 | content: ['./src/**/*.tsx'], 4 | darkMode: 'class', // or 'media' or 'class' 5 | variants: {}, 6 | plugins: [], 7 | }; 8 | -------------------------------------------------------------------------------- /examples/dropdown-menu/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "exclude": ["node_modules"], 3 | "include": ["src", "types"], 4 | "compilerOptions": { 5 | "module": "ESNext", 6 | "lib": ["ESNext", "DOM"], 7 | "importHelpers": true, 8 | "declaration": true, 9 | "sourceMap": true, 10 | "rootDir": "./src", 11 | "strict": true, 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "noImplicitReturns": true, 15 | "noFallthroughCasesInSwitch": true, 16 | "moduleResolution": "Bundler", 17 | "jsx": "preserve", 18 | "jsxImportSource": "solid-js", 19 | "esModuleInterop": true, 20 | "target": "ES2017" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /examples/dropdown-menu/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite'; 2 | import solidPlugin from 'vite-plugin-solid'; 3 | 4 | export default defineConfig({ 5 | plugins: [solidPlugin()], 6 | }); 7 | -------------------------------------------------------------------------------- /examples/feed/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | dist 4 | dist-ssr 5 | *.local -------------------------------------------------------------------------------- /examples/feed/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/feed/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Vite App 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/feed/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "feed-example", 3 | "type": "module", 4 | "version": "1.0.6", 5 | "scripts": { 6 | "dev": "vite", 7 | "build": "vite build", 8 | "serve": "vite preview" 9 | }, 10 | "devDependencies": { 11 | "@tailwindcss/postcss": "^4.0.14", 12 | "postcss": "^8.5.3", 13 | "typescript": "^5.8.2", 14 | "vite": "^6.2.1", 15 | "vite-plugin-solid": "^2.11.6" 16 | }, 17 | "dependencies": { 18 | "solid-js": "^1.9.5", 19 | "tailwindcss": "^4.0.14", 20 | "terracotta": "1.0.6" 21 | }, 22 | "private": true, 23 | "publishConfig": { 24 | "access": "restricted" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /examples/feed/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | '@tailwindcss/postcss': {}, 4 | }, 5 | }; 6 | -------------------------------------------------------------------------------- /examples/feed/src/main.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | import { render } from 'solid-js/web'; 3 | import App from './App'; 4 | 5 | import './style.css'; 6 | 7 | function Root(): JSX.Element { 8 | return ( 9 |
10 |
11 | 12 |
13 |
14 | ); 15 | } 16 | 17 | const app = document.getElementById('app'); 18 | 19 | if (app) { 20 | render(() => , app); 21 | } 22 | -------------------------------------------------------------------------------- /examples/feed/src/style.css: -------------------------------------------------------------------------------- 1 | @import "tailwindcss"; 2 | -------------------------------------------------------------------------------- /examples/feed/src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /examples/feed/tailwind.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | mode: 'jit', 3 | content: ['./src/**/*.tsx'], 4 | darkMode: 'class', // or 'media' or 'class' 5 | variants: {}, 6 | plugins: [], 7 | }; 8 | -------------------------------------------------------------------------------- /examples/feed/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "exclude": ["node_modules"], 3 | "include": ["src", "types"], 4 | "compilerOptions": { 5 | "module": "ESNext", 6 | "lib": ["ESNext", "DOM"], 7 | "importHelpers": true, 8 | "declaration": true, 9 | "sourceMap": true, 10 | "rootDir": "./src", 11 | "strict": true, 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "noImplicitReturns": true, 15 | "noFallthroughCasesInSwitch": true, 16 | "moduleResolution": "Bundler", 17 | "jsx": "preserve", 18 | "jsxImportSource": "solid-js", 19 | "esModuleInterop": true, 20 | "target": "ES2017" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /examples/feed/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite'; 2 | import solidPlugin from 'vite-plugin-solid'; 3 | 4 | export default defineConfig({ 5 | plugins: [solidPlugin()], 6 | }); 7 | -------------------------------------------------------------------------------- /examples/listbox/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | dist 4 | dist-ssr 5 | *.local -------------------------------------------------------------------------------- /examples/listbox/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/listbox/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Vite App 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/listbox/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "listbox-example", 3 | "type": "module", 4 | "version": "1.0.6", 5 | "scripts": { 6 | "dev": "vite", 7 | "build": "vite build", 8 | "serve": "vite preview" 9 | }, 10 | "devDependencies": { 11 | "@tailwindcss/postcss": "^4.0.14", 12 | "postcss": "^8.5.3", 13 | "typescript": "^5.8.2", 14 | "vite": "^6.2.1", 15 | "vite-plugin-solid": "^2.11.6" 16 | }, 17 | "dependencies": { 18 | "solid-js": "^1.9.5", 19 | "tailwindcss": "^4.0.14", 20 | "terracotta": "1.0.6" 21 | }, 22 | "private": true, 23 | "publishConfig": { 24 | "access": "restricted" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /examples/listbox/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | '@tailwindcss/postcss': {}, 4 | }, 5 | }; 6 | -------------------------------------------------------------------------------- /examples/listbox/src/main.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | import { render } from 'solid-js/web'; 3 | import MultipleExample from './MultipleExample'; 4 | import SingleExample from './SingleExample'; 5 | import './style.css'; 6 | 7 | function Root(): JSX.Element { 8 | return ( 9 |
10 |
11 | 12 | 13 |
14 |
15 | ); 16 | } 17 | 18 | const app = document.getElementById('app'); 19 | 20 | if (app) { 21 | render(() => , app); 22 | } 23 | -------------------------------------------------------------------------------- /examples/listbox/src/style.css: -------------------------------------------------------------------------------- 1 | @import "tailwindcss"; 2 | -------------------------------------------------------------------------------- /examples/listbox/src/utils.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | 3 | export function CheckIcon( 4 | props: JSX.IntrinsicElements['svg'] & { title: string }, 5 | ): JSX.Element { 6 | return ( 7 | 14 | {props.title} 15 | 21 | 22 | ); 23 | } 24 | 25 | export function SelectorIcon( 26 | props: JSX.IntrinsicElements['svg'] & { title: string }, 27 | ): JSX.Element { 28 | return ( 29 | 36 | {props.title} 37 | 43 | 44 | ); 45 | } 46 | 47 | export function classNames( 48 | ...classes: (string | boolean | undefined)[] 49 | ): string { 50 | return classes.filter(Boolean).join(' '); 51 | } 52 | -------------------------------------------------------------------------------- /examples/listbox/src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | -------------------------------------------------------------------------------- /examples/listbox/tailwind.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | mode: 'jit', 3 | content: ['./src/**/*.tsx'], 4 | darkMode: 'class', // or 'media' or 'class' 5 | variants: {}, 6 | plugins: [], 7 | }; 8 | -------------------------------------------------------------------------------- /examples/listbox/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "exclude": ["node_modules"], 3 | "include": ["src", "types"], 4 | "compilerOptions": { 5 | "module": "ESNext", 6 | "lib": ["ESNext", "DOM"], 7 | "importHelpers": true, 8 | "declaration": true, 9 | "sourceMap": true, 10 | "rootDir": "./src", 11 | "strict": true, 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "noImplicitReturns": true, 15 | "noFallthroughCasesInSwitch": true, 16 | "moduleResolution": "Bundler", 17 | "jsx": "preserve", 18 | "jsxImportSource": "solid-js", 19 | "esModuleInterop": true, 20 | "target": "ES2017" 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /examples/listbox/vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite'; 2 | import solidPlugin from 'vite-plugin-solid'; 3 | 4 | export default defineConfig({ 5 | plugins: [solidPlugin()], 6 | }); 7 | -------------------------------------------------------------------------------- /examples/menu/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .DS_Store 3 | dist 4 | dist-ssr 5 | *.local -------------------------------------------------------------------------------- /examples/menu/favicon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/menu/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Vite App 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /examples/menu/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "menu-example", 3 | "type": "module", 4 | "version": "1.0.6", 5 | "scripts": { 6 | "dev": "vite", 7 | "build": "vite build", 8 | "serve": "vite preview" 9 | }, 10 | "devDependencies": { 11 | "@tailwindcss/postcss": "^4.0.14", 12 | "postcss": "^8.5.3", 13 | "typescript": "^5.8.2", 14 | "vite": "^6.2.1", 15 | "vite-plugin-solid": "^2.11.6" 16 | }, 17 | "dependencies": { 18 | "solid-js": "^1.9.5", 19 | "tailwindcss": "^4.0.14", 20 | "terracotta": "1.0.6" 21 | }, 22 | "private": true, 23 | "publishConfig": { 24 | "access": "restricted" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /examples/menu/postcss.config.js: -------------------------------------------------------------------------------- 1 | export default { 2 | plugins: { 3 | '@tailwindcss/postcss': {}, 4 | }, 5 | }; 6 | -------------------------------------------------------------------------------- /examples/menu/src/App.tsx: -------------------------------------------------------------------------------- 1 | import type { JSX } from 'solid-js'; 2 | import { Menu, MenuItem } from 'terracotta'; 3 | 4 | function Separator(): JSX.Element { 5 | return ( 6 |