From ef401c36e07b042a7547269454e71fa36a00e148 Mon Sep 17 00:00:00 2001 From: Sean Lynch Date: Sun, 30 Aug 2026 14:56:19 -0400 Subject: [PATCH 1/2] Migrate Svelte UX components, state, attachments, and docs - Add the Svelte 5 `@layerstack/ui` package and migrated component suite - Add `FormState`, `ThemeState`, and new attachment APIs - Expand component documentation and close Svelte UX parity gaps - Fix theme synchronization, dark variants, and client-only initialization --- .changeset/dark-variant-system.md | 23 + .changeset/docs-parity.md | 18 + .changeset/form-state.md | 13 + .changeset/layerstack-ui.md | 5 + .changeset/real-keys-battle.md | 5 + .changeset/svelte-attachments-overlay.md | 8 + .changeset/theme-desync.md | 29 + .changeset/theme-state.md | 5 + .changeset/ui-code-copybutton.md | 7 + .changeset/ui-form.md | 12 + .changeset/ui-settings-rename.md | 15 + .changeset/ui-wave-1.md | 8 + .changeset/ui-wave-2.md | 13 + .changeset/ui-wave-3.md | 5 + .changeset/ui-wave-4.md | 7 + .changeset/ui-wave-5.md | 8 + .changeset/ui-wave-6.md | 7 + .changeset/ui-wave-7.md | 7 + .changeset/ui-wave-8.md | 7 + .changeset/ui-wave-9.md | 12 + docs/.gitignore | 1 + docs/content-collections.ts | 7 +- docs/package.json | 17 +- docs/src/content/components/AppBar.md | 37 + docs/src/content/components/AppLayout.md | 29 + docs/src/content/components/Avatar.md | 27 + docs/src/content/components/Backdrop.md | 23 + docs/src/content/components/Badge.md | 39 + docs/src/content/components/BarStack.md | 35 + docs/src/content/components/Breadcrumb.md | 33 + docs/src/content/components/Button.md | 79 ++ docs/src/content/components/ButtonGroup.md | 35 + docs/src/content/components/Card.md | 39 + docs/src/content/components/Checkbox.md | 39 + docs/src/content/components/Code.md | 40 + docs/src/content/components/Collapse.md | 35 + docs/src/content/components/CopyButton.md | 31 + docs/src/content/components/DateButton.md | 23 + docs/src/content/components/DateField.md | 35 + .../src/content/components/DatePickerField.md | 31 + docs/src/content/components/DateRange.md | 43 + .../content/components/DateRangeDisplay.md | 23 + docs/src/content/components/DateRangeField.md | 45 + docs/src/content/components/DateSelect.md | 24 + docs/src/content/components/Dialog.md | 59 + docs/src/content/components/DividerDot.md | 19 + docs/src/content/components/Drawer.md | 42 + docs/src/content/components/Duration.md | 26 + docs/src/content/components/EmptyMessage.md | 19 + .../content/components/ErrorNotification.md | 28 + docs/src/content/components/ExpansionPanel.md | 35 + docs/src/content/components/Field.md | 52 + docs/src/content/components/Form.md | 62 + docs/src/content/components/Gooey.md | 35 + docs/src/content/components/Grid.md | 37 + docs/src/content/components/Header.md | 23 + docs/src/content/components/Icon.md | 65 + docs/src/content/components/InfiniteScroll.md | 30 + docs/src/content/components/Input.md | 48 + docs/src/content/components/Kbd.md | 22 + docs/src/content/components/LanguageSelect.md | 23 + docs/src/content/components/Lazy.md | 28 + docs/src/content/components/ListItem.md | 33 + docs/src/content/components/Maybe.md | 24 + docs/src/content/components/Menu.md | 50 + docs/src/content/components/MenuButton.md | 50 + docs/src/content/components/MenuField.md | 58 + docs/src/content/components/MenuItem.md | 35 + docs/src/content/components/Month.md | 42 + docs/src/content/components/MonthList.md | 30 + .../src/content/components/MonthListByYear.md | 25 + docs/src/content/components/MultiSelect.md | 91 ++ .../content/components/MultiSelectField.md | 44 + .../src/content/components/MultiSelectMenu.md | 42 + .../content/components/MultiSelectOption.md | 35 + docs/src/content/components/NavItem.md | 25 + docs/src/content/components/Notification.md | 40 + docs/src/content/components/NumberStepper.md | 37 + docs/src/content/components/Overflow.md | 32 + docs/src/content/components/Overlay.md | 33 + docs/src/content/components/Paginate.md | 27 + docs/src/content/components/Pagination.md | 31 + docs/src/content/components/Popover.md | 52 + docs/src/content/components/Progress.md | 38 + docs/src/content/components/ProgressCircle.md | 42 + docs/src/content/components/QuickSearch.md | 40 + docs/src/content/components/Radio.md | 32 + docs/src/content/components/RangeField.md | 28 + docs/src/content/components/RangeSlider.md | 37 + docs/src/content/components/ResponsiveMenu.md | 35 + .../src/content/components/ScrollContainer.md | 25 + docs/src/content/components/ScrollingValue.md | 31 + docs/src/content/components/SectionDivider.md | 19 + docs/src/content/components/SelectField.md | 81 ++ docs/src/content/components/Selection.md | 37 + docs/src/content/components/Settings.md | 41 + docs/src/content/components/Shine.md | 31 + docs/src/content/components/SpringValue.md | 35 + docs/src/content/components/Stack.md | 36 + docs/src/content/components/Step.md | 20 + docs/src/content/components/Steps.md | 30 + docs/src/content/components/Switch.md | 35 + docs/src/content/components/Tab.md | 20 + docs/src/content/components/Table.md | 66 + .../src/content/components/TableOfContents.md | 34 + docs/src/content/components/TableOrderIcon.md | 19 + docs/src/content/components/Tabs.md | 36 + docs/src/content/components/TextField.md | 87 ++ docs/src/content/components/ThemeInit.md | 21 + docs/src/content/components/ThemeSelect.md | 36 + docs/src/content/components/ThemeSwitch.md | 32 + docs/src/content/components/Tilt.md | 29 + docs/src/content/components/Timeline.md | 37 + docs/src/content/components/TimelineEvent.md | 21 + docs/src/content/components/Toggle.md | 29 + docs/src/content/components/ToggleButton.md | 38 + docs/src/content/components/ToggleGroup.md | 40 + docs/src/content/components/ToggleOption.md | 19 + docs/src/content/components/TogglePanel.md | 24 + docs/src/content/components/Tooltip.md | 36 + docs/src/content/components/TreeList.md | 29 + docs/src/content/components/TweenedValue.md | 29 + docs/src/content/components/ViewportCenter.md | 19 + docs/src/content/components/YearList.md | 23 + docs/src/content/guides/docs/authoring.md | 4 + .../svelte-actions/dataBackground.md | 6 +- .../content/reference/svelte-actions/input.md | 12 +- .../reference/svelte-actions/layout.md | 4 +- .../content/reference/svelte-actions/mouse.md | 10 +- .../content/reference/svelte-actions/multi.md | 2 +- .../reference/svelte-actions/observer.md | 12 +- .../reference/svelte-actions/popover.md | 2 +- .../reference/svelte-actions/portal.md | 12 +- .../reference/svelte-actions/scroll.md | 20 +- .../reference/svelte-actions/spotlight.md | 8 +- .../reference/svelte-actions/sticky.md | 2 +- .../reference/svelte-actions/styles.md | 4 +- .../svelte-attachments/dataBackground.md | 32 + .../reference/svelte-attachments/focus.md | 28 + .../reference/svelte-attachments/input.md | 47 + .../reference/svelte-state/FormState.md | 63 + .../reference/svelte-state/PaginationState.md | 2 +- .../reference/svelte-state/SelectionState.md | 12 +- .../reference/svelte-state/ThemeState.md | 47 + .../reference/svelte-state/TimerState.md | 2 +- .../reference/svelte-stores/dirtyStore.md | 2 +- .../reference/svelte-stores/formStore.md | 2 +- .../reference/svelte-stores/matchMedia.md | 2 +- .../svelte-stores/paginationStore.md | 2 +- .../reference/svelte-stores/selectionStore.md | 10 +- .../reference/svelte-stores/timerStore.md | 4 +- .../reference/svelte-stores/uniqueStore.md | 2 +- .../content/reference/svelte-table/actions.md | 2 +- .../content/reference/svelte-table/stores.md | 2 +- docs/src/content/reference/utils/Duration.md | 2 +- docs/src/content/reference/utils/format.md | 8 +- .../examples/components/AppBar/basic.svelte | 20 + .../components/AppBar/menu-icon.svelte | 24 + .../examples/components/Avatar/basic.svelte | 10 + .../components/Avatar/variations.svelte | 24 + .../examples/components/Backdrop/basic.svelte | 13 + .../examples/components/Badge/anchors.svelte | 57 + .../examples/components/Badge/basic.svelte | 29 + .../components/Badge/placement.svelte | 11 + .../examples/components/BarStack/basic.svelte | 24 + .../components/BarStack/customization.svelte | 46 + .../components/Breadcrumb/basic.svelte | 8 + .../components/Breadcrumb/custom-items.svelte | 28 + .../components/Breadcrumb/dividers.svelte | 27 + .../examples/components/Button/colors.svelte | 21 + .../examples/components/Button/icons.svelte | 13 + .../examples/components/Button/loading.svelte | 19 + .../examples/components/Button/sizes.svelte | 9 + .../examples/components/Button/states.svelte | 10 + .../components/Button/variants.svelte | 11 + .../components/ButtonGroup/basic.svelte | 9 + .../components/ButtonGroup/selection.svelte | 16 + .../components/ButtonGroup/variants.svelte | 15 + .../src/examples/components/Card/basic.svelte | 20 + .../examples/components/Card/headers.svelte | 27 + .../src/examples/components/Card/slots.svelte | 36 + .../examples/components/Checkbox/basic.svelte | 12 + .../examples/components/Checkbox/group.svelte | 14 + .../components/Checkbox/layout.svelte | 21 + .../components/Checkbox/states.svelte | 18 + .../src/examples/components/Code/basic.svelte | 11 + .../examples/components/Code/options.svelte | 13 + .../components/Collapse/accordion.svelte | 16 + .../examples/components/Collapse/basic.svelte | 12 + .../components/Collapse/customization.svelte | 48 + .../components/CopyButton/basic.svelte | 13 + .../components/CopyButton/variations.svelte | 24 + .../components/DateButton/basic.svelte | 23 + .../components/DateField/basic.svelte | 14 + .../components/DateField/variations.svelte | 29 + .../components/DatePickerField/basic.svelte | 14 + .../DatePickerField/variations.svelte | 25 + .../components/DateRange/basic.svelte | 12 + .../DateRange/disabled-dates.svelte | 11 + .../components/DateRange/period-types.svelte | 12 + .../components/DateRangeDisplay/basic.svelte | 20 + .../components/DateRangeField/basic.svelte | 12 + .../DateRangeField/quick-presets.svelte | 20 + .../components/DateRangeField/stepper.svelte | 16 + .../components/DateRangeField/utc.svelte | 19 + .../components/DateSelect/basic.svelte | 21 + .../examples/components/Dialog/basic.svelte | 20 + .../examples/components/Dialog/loading.svelte | 29 + .../components/Dialog/persistent.svelte | 23 + .../components/DividerDot/basic.svelte | 7 + .../examples/components/Drawer/basic.svelte | 28 + .../components/Drawer/persistent.svelte | 22 + .../components/Drawer/placement.svelte | 25 + .../examples/components/Duration/basic.svelte | 16 + .../components/EmptyMessage/basic.svelte | 5 + .../components/ErrorNotification/basic.svelte | 12 + .../components/ExpansionPanel/basic.svelte | 11 + .../ExpansionPanel/composition.svelte | 38 + .../examples/components/Field/basic.svelte | 14 + .../components/Field/clearable.svelte | 10 + .../examples/components/Field/controls.svelte | 35 + .../components/Field/label-placement.svelte | 9 + .../examples/components/Field/snippets.svelte | 23 + .../src/examples/components/Form/basic.svelte | 23 + .../examples/components/Form/own-state.svelte | 21 + .../components/Form/validation.svelte | 25 + .../components/FormState/basic.svelte | 26 + .../examples/components/Gooey/basic.svelte | 12 + .../components/Gooey/variations.svelte | 63 + .../components/Grid/auto-columns.svelte | 10 + .../src/examples/components/Grid/basic.svelte | 9 + .../examples/components/Grid/templates.svelte | 35 + .../examples/components/Header/basic.svelte | 13 + .../components/Icon/accessibility.svelte | 11 + .../src/examples/components/Icon/basic.svelte | 10 + .../examples/components/Icon/classes.svelte | 12 + .../examples/components/Icon/component.svelte | 12 + .../examples/components/Icon/sizing.svelte | 17 + .../components/InfiniteScroll/basic.svelte | 18 + .../components/InfiniteScroll/per-page.svelte | 16 + .../examples/components/Input/basic.svelte | 10 + .../components/Input/mask-types.svelte | 38 + .../src/examples/components/Input/mask.svelte | 14 + docs/src/examples/components/Kbd/basic.svelte | 10 + .../components/LanguageSelect/basic.svelte | 5 + .../src/examples/components/Lazy/basic.svelte | 11 + .../examples/components/ListItem/basic.svelte | 14 + .../components/ListItem/variations.svelte | 34 + .../examples/components/Maybe/basic.svelte | 14 + .../src/examples/components/Menu/basic.svelte | 18 + .../components/Menu/explicit-close.svelte | 29 + .../Menu/icons-and-selection.svelte | 32 + .../components/MenuButton/basic.svelte | 19 + .../components/MenuButton/custom-menu.svelte | 30 + .../MenuButton/icons-and-menu.svelte | 32 + .../components/MenuButton/selection.svelte | 18 + .../components/MenuField/basic.svelte | 18 + .../components/MenuField/grouped.svelte | 16 + .../MenuField/icons-and-menu.svelte | 29 + .../components/MenuField/selection.svelte | 27 + .../components/MenuField/stepper.svelte | 17 + .../examples/components/Month/basic.svelte | 13 + .../Month/disabled-and-outside.svelte | 30 + .../components/Month/selection.svelte | 23 + .../components/MonthList/basic.svelte | 13 + .../components/MonthList/disabled.svelte | 20 + .../MonthList/formats-and-selection.svelte | 28 + .../components/MonthListByYear/basic.svelte | 9 + .../components/MonthListByYear/bounds.svelte | 19 + .../components/MultiSelect/basic.svelte | 18 + .../MultiSelect/custom-options.svelte | 22 + .../components/MultiSelect/max.svelte | 20 + .../components/MultiSelect/modes.svelte | 30 + .../components/MultiSelect/search.svelte | 17 + .../components/MultiSelect/slots.svelte | 29 + .../MultiSelect/variants-and-order.svelte | 28 + .../components/MultiSelectField/basic.svelte | 19 + .../MultiSelectField/format-selected.svelte | 26 + .../MultiSelectField/search-and-max.svelte | 24 + .../components/MultiSelectMenu/basic.svelte | 22 + .../components/MultiSelectMenu/search.svelte | 16 + .../MultiSelectOption/actions.svelte | 16 + .../MultiSelectOption/variants.svelte | 27 + .../examples/components/NavItem/basic.svelte | 24 + .../components/Notification/basic.svelte | 30 + .../components/Notification/colors.svelte | 23 + .../components/Notification/variations.svelte | 28 + .../components/NumberStepper/basic.svelte | 12 + .../components/NumberStepper/options.svelte | 17 + .../NumberStepper/prefix-suffix.svelte | 17 + .../examples/components/Overflow/basic.svelte | 20 + .../Overflow/conditional-tooltip.svelte | 20 + .../examples/components/Overlay/basic.svelte | 19 + .../components/Overlay/variations.svelte | 38 + .../examples/components/Paginate/basic.svelte | 28 + .../components/Pagination/basic.svelte | 15 + .../examples/components/Popover/basic.svelte | 16 + .../components/Popover/placement.svelte | 28 + .../examples/components/Progress/basic.svelte | 11 + .../components/Progress/color-by-value.svelte | 19 + .../components/Progress/colors.svelte | 19 + .../components/ProgressCircle/basic.svelte | 11 + .../components/ProgressCircle/colors.svelte | 11 + .../components/ProgressCircle/label.svelte | 13 + .../components/ProgressCircle/sizing.svelte | 9 + .../ProgressCircle/track-and-rotate.svelte | 26 + .../components/QuickSearch/basic.svelte | 18 + .../QuickSearch/keyboard-shortcut.svelte | 23 + .../examples/components/Radio/basic.svelte | 14 + .../examples/components/Radio/layout.svelte | 29 + .../examples/components/Radio/states.svelte | 19 + .../components/RangeField/basic.svelte | 11 + .../components/RangeField/options.svelte | 23 + .../components/RangeSlider/basic.svelte | 13 + .../components/RangeSlider/options.svelte | 23 + .../components/ResponsiveMenu/basic.svelte | 20 + .../components/ResponsiveMenu/props.svelte | 27 + .../components/ScrollContainer/basic.svelte | 16 + .../components/ScrollingValue/basic.svelte | 14 + .../ScrollingValue/variations.svelte | 41 + .../components/SectionDivider/basic.svelte | 9 + .../SelectField/async-search.svelte | 26 + .../components/SelectField/basic.svelte | 21 + .../SelectField/custom-options.svelte | 28 + .../components/SelectField/grouped.svelte | 16 + .../SelectField/inline-options.svelte | 15 + .../SelectField/option-values.svelte | 40 + .../components/SelectField/states.svelte | 23 + .../components/SelectField/stepper.svelte | 18 + .../components/Selection/basic.svelte | 32 + .../components/Selection/select-all.svelte | 60 + .../examples/components/Settings/basic.svelte | 25 + .../examples/components/Shine/basic.svelte | 10 + .../examples/components/Shine/options.svelte | 32 + .../components/SpringValue/basic.svelte | 16 + .../components/SpringValue/options.svelte | 44 + .../examples/components/Stack/basic.svelte | 30 + .../Stack/justify-and-template.svelte | 33 + .../examples/components/Stack/stacked.svelte | 17 + .../examples/components/Steps/basic.svelte | 15 + .../examples/components/Steps/points.svelte | 23 + .../Steps/vertical-and-colors.svelte | 19 + .../examples/components/Switch/basic.svelte | 25 + .../components/Switch/labels-and-icons.svelte | 17 + .../examples/components/Switch/states.svelte | 31 + .../examples/components/Table/basic.svelte | 26 + .../components/Table/formatting.svelte | 31 + .../examples/components/Table/ordering.svelte | 37 + .../components/TableOfContents/basic.svelte | 13 + .../components/TableOfContents/styling.svelte | 33 + .../src/examples/components/Tabs/basic.svelte | 17 + .../components/Tabs/composition.svelte | 36 + .../examples/components/Tabs/placement.svelte | 23 + .../components/TextField/adornments.svelte | 34 + .../components/TextField/basic.svelte | 10 + .../components/TextField/debounce.svelte | 15 + .../TextField/label-placement.svelte | 11 + .../examples/components/TextField/mask.svelte | 10 + .../components/TextField/multiline.svelte | 15 + .../components/TextField/operators.svelte | 20 + .../components/TextField/states.svelte | 11 + .../components/TextField/types.svelte | 14 + .../components/ThemeSelect/basic.svelte | 5 + .../components/ThemeSelect/options.svelte | 23 + .../components/ThemeState/basic.svelte | 30 + .../components/ThemeSwitch/basic.svelte | 8 + .../ThemeSwitch/customization.svelte | 15 + .../src/examples/components/Tilt/basic.svelte | 11 + .../examples/components/Tilt/options.svelte | 42 + .../examples/components/Timeline/basic.svelte | 15 + .../components/Timeline/layouts.svelte | 40 + .../components/Timeline/vertical.svelte | 31 + .../examples/components/Toggle/basic.svelte | 11 + .../components/ToggleButton/basic.svelte | 15 + .../components/ToggleButton/variations.svelte | 65 + .../components/ToggleGroup/basic.svelte | 13 + .../components/ToggleGroup/panels.svelte | 23 + .../components/ToggleGroup/variants.svelte | 25 + .../examples/components/Tooltip/basic.svelte | 21 + .../examples/components/Tooltip/custom.svelte | 32 + .../components/Tooltip/placement.svelte | 22 + .../examples/components/TreeList/basic.svelte | 19 + .../components/TweenedValue/basic.svelte | 13 + .../components/TweenedValue/options.svelte | 44 + .../components/ViewportCenter/basic.svelte | 13 + .../examples/components/YearList/basic.svelte | 9 + .../components/YearList/bounds.svelte | 34 + .../basic.svelte | 0 .../tailwind-gradient.svelte | 0 .../{input => action-input}/auto-focus.svelte | 0 .../auto-height.svelte | 0 .../blur-on-escape.svelte | 0 .../debounce-event.svelte | 0 .../select-on-focus.svelte | 0 .../{layout => action-layout}/overflow.svelte | 0 .../{mouse => action-mouse}/longpress.svelte | 0 .../movable-step-percent.svelte | 0 .../movable-step.svelte | 0 .../movable-x-axis.svelte | 0 .../{mouse => action-mouse}/movable.svelte | 0 .../adding-class-when-fully-visible.svelte | 0 .../basic.svelte | 0 .../full-coordinates.svelte | 0 .../setting-css-variable.svelte | 0 .../show-header-on-scroll-away.svelte | 0 .../ancestor-portal-target.svelte | 0 .../{portal => action-portal}/basic.svelte | 0 .../custom-target.svelte | 0 .../destroyable.svelte | 0 .../first-sibling-portal-target.svelte | 0 .../{scroll => action-scroll}/basic.svelte | 0 .../only-if-needed.svelte | 0 .../scroll-fade-flip.svelte | 0 .../scroll-fade-horizontal.svelte | 0 .../scroll-fade.svelte | 0 .../scroll-shadow-bottom-surface.svelte | 0 .../scroll-shadow-flip.svelte | 0 .../scroll-shadow-horizontal.svelte | 0 .../scroll-shadow-truncation.svelte | 0 .../scroll-shadow.svelte | 0 .../global-context-and-css-variables.svelte | 0 .../global-context-and-options.svelte | 0 .../line.svelte | 0 .../computed-styles.svelte | 0 .../style-props.svelte | 0 .../attach-dataBackground/basic.svelte | 102 ++ .../tailwind-gradient.svelte | 38 + .../components/attach-focus/focus-move.svelte | 19 + .../attach-focus/restore-focus.svelte | 36 + .../components/attach-input/auto-focus.svelte | 5 + .../attach-input/auto-height.svelte | 5 + .../attach-input/blur-on-escape.svelte | 5 + .../attach-input/debounce-event.svelte | 21 + .../attach-input/select-on-focus.svelte | 5 + docs/src/lib/components/Example.svelte | 2 + docs/src/lib/content.ts | 7 +- docs/src/lib/llms.ts | 59 +- docs/src/lib/searchContent.ts | 7 +- docs/src/routes/_NavMenu.svelte | 58 +- .../docs/svelte-attachments/+page.server.ts | 5 + docs/src/routes/docs/ui/[name]/+page.svelte | 118 ++ docs/src/routes/docs/ui/[name]/+page.ts | 11 + .../routes/docs/ui/[name]/llms.txt/+server.ts | 15 + package.json | 2 +- packages/docs/package.json | 4 +- packages/docs/src/lib/components/Code.svelte | 27 +- packages/docs/src/lib/styles.css | 33 +- packages/svelte-actions/package.json | 6 +- packages/svelte-attachments/.prettierignore | 15 + packages/svelte-attachments/CHANGELOG.md | 1 + packages/svelte-attachments/LICENSE | 21 + packages/svelte-attachments/README.md | 9 + packages/svelte-attachments/package.json | 58 + .../src/lib/dataBackground.svelte.ts | 144 +++ packages/svelte-attachments/src/lib/focus.ts | 48 + packages/svelte-attachments/src/lib/index.ts | 13 + packages/svelte-attachments/src/lib/input.ts | 109 ++ packages/svelte-attachments/src/lib/layout.ts | 97 ++ packages/svelte-attachments/src/lib/mouse.ts | 187 +++ .../svelte-attachments/src/lib/observer.ts | 68 + .../src/lib/placeholder.test.ts | 5 + .../svelte-attachments/src/lib/popover.ts | 132 ++ packages/svelte-attachments/src/lib/portal.ts | 68 + packages/svelte-attachments/src/lib/scroll.ts | 24 + .../svelte-attachments/tsconfig.build.json | 4 + packages/svelte-attachments/tsconfig.json | 17 + packages/svelte-attachments/vite.config.js | 7 + packages/svelte-state/package.json | 7 +- .../svelte-state/src/lib/formState.svelte.ts | 138 ++ .../src/lib/formState.test.svelte.ts | 191 +++ packages/svelte-state/src/lib/index.ts | 9 +- .../src/lib/mediaQueryPresets.svelte.ts | 20 +- .../src/lib/paginationState.svelte.ts | 8 +- .../src/lib/paginationState.test.svelte.ts | 33 + .../src/lib/selectionState.svelte.ts | 3 +- .../src/lib/selectionState.test.svelte.ts | 21 + .../svelte-state/src/lib/themeState.svelte.ts | 119 ++ .../src/lib/themeState.test.svelte.ts | 211 +++ .../svelte-state/src/lib/timerState.svelte.ts | 6 +- .../src/lib/timerState.test.svelte.ts | 106 ++ packages/svelte-state/vite.config.js | 7 + packages/svelte-stores/package.json | 6 +- packages/svelte-stores/src/lib/themeStore.ts | 22 +- packages/svelte-table/package.json | 6 +- packages/svelte-table/src/lib/stores.ts | 9 +- packages/tailwind/package.json | 2 +- packages/tailwind/src/lib/cli/index.ts | 63 +- packages/tailwind/src/lib/css/core.css | 64 +- packages/tailwind/src/lib/theme.ts | 52 +- packages/ui/.prettierignore | 15 + ...480bf7281d8ec0325118817dae57e7d1f16226.png | Bin 0 -> 11800 bytes ...51635e51b69ebd04fc38c06582955c3c91c675.png | Bin 0 -> 4130 bytes ...5a00515b9417e9b1d099c090c8b153f8e855b1.png | Bin 0 -> 3029 bytes ...1cd7f83ba7ac3d5f957eecb73c04e14b35bf33.png | Bin 0 -> 7050 bytes ...1da0ce648ec9a4b94c9e6f771d28cae42baaf7.png | Bin 0 -> 3556 bytes ...fc962fa4bd70f0e84e5860860cc69656649de7.png | Bin 0 -> 4130 bytes ...a522155fe2d10671fb3a151d1f29aa62cd41e7.png | Bin 0 -> 4231 bytes ...2459645ca2652a78aa0005ec222c190daf039e.png | Bin 0 -> 3306 bytes ...df5936283bdf572f7438fa83102fc35ee58a8c.png | Bin 0 -> 6961 bytes ...2672fb222300de68c9b06c8ee91eb03196eb97.png | Bin 0 -> 14799 bytes ...b99457325b2dc39db4f24ed22aef9678a7bd2b.png | Bin 0 -> 2200 bytes ...e99ddc45b365ddbaa6797e5ffb30967c31ac32.png | Bin 0 -> 2082 bytes ...2d4f623832730d5b27d38e60f1e087d6025479.png | Bin 0 -> 2451 bytes ...1bac71b3c6664baa1b2559a03552063ead8b1e.png | Bin 0 -> 4079 bytes ...5983ae41c3c4f0d5a8ba4efffb746f4b0c3887.png | Bin 0 -> 2082 bytes ...8f8a4081600c3d1b8fbea581effc9b876ad3b7.png | Bin 0 -> 2082 bytes ...b3058fd2db96c997dd57a2714d847efd358279.png | Bin 0 -> 4201 bytes ...f6bac8671b2c2899e6108e07c38ad7b67af079.png | Bin 0 -> 3563 bytes ...085ec85f15c6042e0bfd4aec68f21c6b6e387e.png | Bin 0 -> 2390 bytes ...737b7c3b5d1722c457c577dee726a04882f1ea.png | Bin 0 -> 2082 bytes ...50500db391c079ebd30e49060081383e7e9b1d.png | Bin 0 -> 2082 bytes ...d914e504451521bf6b5a5fc5cd3ab28ffa0d2f.png | Bin 0 -> 2082 bytes ...b41bab87c5771fcbae89105b04bd8758141194.png | Bin 0 -> 2200 bytes ...daeaf6ca444fb86ee68219e281cb18301be250.png | Bin 0 -> 2082 bytes ...d643c4fde6eb54ebc25ea0c042e02ada32f29c.png | Bin 0 -> 2082 bytes ...1b56fec87598274c378bbb26582969c391c14d.png | Bin 0 -> 3109 bytes ...dcd11a4bf39c6e60e7086ce5408ddd90dd23bb.png | Bin 0 -> 3556 bytes ...a27ef07f0271d244df3a3620fa518543959f45.png | Bin 0 -> 11658 bytes ...c12767f43dc85eba62a3bfd4c6649018cc6d82.png | Bin 0 -> 2082 bytes ...c3a3a2ef24df4e5a53f769367d5855e6c2eac3.png | Bin 0 -> 3857 bytes ...4ed8c2f568dd058783af9563529a863b1ada67.png | Bin 0 -> 2082 bytes ...c50dad220ef78acb435f50b7da69c2eee8a336.png | Bin 0 -> 5579 bytes ...44f07d4c83a20ca00f4aedd9cf17c70e43b333.png | Bin 0 -> 4277 bytes ...838292e8d0b3abb4970b04e89b9df5ee0f08d7.png | Bin 0 -> 2082 bytes ...e89d794e275fc939be8983209a1e6b726c480e.png | Bin 0 -> 2082 bytes ...4d737c8892209afae4f6e94d16f4015d8eb52c.png | Bin 0 -> 14425 bytes ...358f85395b60bba8b2c583900641222cc5d013.png | Bin 0 -> 11658 bytes ...c69c1046441758e5274837fd0f86512c78e581.png | Bin 0 -> 2200 bytes ...647d0a990a6bd8a0e6a6af29102cf7f0b5f4cc.png | Bin 0 -> 22128 bytes ...34c98121a10958c6e2d2d435c2ae20113f8aa9.png | Bin 0 -> 10404 bytes ...59e42a1654f5b7822e34c5914548f5d675f98a.png | Bin 0 -> 3556 bytes ...a0f707ddfad33ae1ed975a5932abda9b153466.png | Bin 0 -> 3556 bytes ...ad04e19d81df99be1f796b1bcb0d9f920c25ea.png | Bin 0 -> 3556 bytes ...bd35ab8a5755dcffe3d86562956c52a4b9f550.png | Bin 0 -> 2082 bytes ...0e78cdd0dde1438e7be3715eddcfb935ea9f17.png | Bin 0 -> 2082 bytes ...12a974defaaba15e1b5ac077b3e8ee15171938.png | Bin 0 -> 3666 bytes ...3e85c3a10f721ef561ad6f147a55bfceca798e.png | Bin 0 -> 3101 bytes ...b6be0fdf65b70dd8ff349e673d6bf2752886dc.png | Bin 0 -> 4130 bytes ...0a8c662d9e3494cbf0f5ea17731f7f119d33f7.png | Bin 0 -> 2082 bytes ...055d59aff08a041afb8dc45cc7a8e6d84e6bba.png | Bin 0 -> 5213 bytes ...b8eea32bba42914f20b359cb04bfac17707a87.png | Bin 0 -> 2082 bytes ...a6b8c2eea9f08cf7df0f4ce0bfccc5c3e5f98a.png | Bin 0 -> 5176 bytes ...6991133a8d2fe80173365d0c3ba6caccdbeb81.png | Bin 0 -> 3556 bytes ...f64d9aaeb0243d1a924a205893a18520a74941.png | Bin 0 -> 15659 bytes ...e70cd4f13b4f76504d2fdaaa4ca9db234dde4f.png | Bin 0 -> 3696 bytes ...dfc28e446bc8092312c8ad04b00c20646d81a3.png | Bin 0 -> 3883 bytes ...3a7c1559f1aa4c7eaa784f3a659f536f8f6efa.png | Bin 0 -> 7050 bytes ...f400afe33ae2d9b9b49ebe4c03dbfddeb0ce2b.png | Bin 0 -> 2200 bytes ...fa8804b016bebc973832b55e7a989248f89bec.png | Bin 0 -> 4277 bytes packages/ui/CHANGELOG.md | 1 + packages/ui/LICENSE | 21 + packages/ui/MIGRATION.md | 454 +++++++ packages/ui/README.md | 12 + packages/ui/package.json | 89 ++ packages/ui/src/app.d.ts | 13 + packages/ui/src/app.html | 11 + packages/ui/src/lib/components/AppBar.svelte | 103 ++ .../ui/src/lib/components/AppLayout.svelte | 101 ++ packages/ui/src/lib/components/Avatar.svelte | 50 + .../ui/src/lib/components/Backdrop.svelte | 55 + packages/ui/src/lib/components/Badge.svelte | 111 ++ .../ui/src/lib/components/BarStack.svelte | 94 ++ .../ui/src/lib/components/Breadcrumb.svelte | 70 + .../ui/src/lib/components/Button.ssr.test.ts | 58 + packages/ui/src/lib/components/Button.svelte | 518 ++++++++ .../src/lib/components/Button.svelte.test.ts | 311 +++++ .../ui/src/lib/components/ButtonGroup.svelte | 111 ++ packages/ui/src/lib/components/Card.svelte | 100 ++ .../ui/src/lib/components/Checkbox.svelte | 154 +++ packages/ui/src/lib/components/Code.svelte | 179 +++ .../ui/src/lib/components/Code.svelte.test.ts | 137 ++ .../ui/src/lib/components/Collapse.svelte | 154 +++ .../ui/src/lib/components/CopyButton.svelte | 72 ++ .../ui/src/lib/components/DateButton.svelte | 140 ++ .../ui/src/lib/components/DateField.svelte | 157 +++ .../src/lib/components/DatePickerField.svelte | 217 ++++ .../ui/src/lib/components/DateRange.svelte | 320 +++++ .../lib/components/DateRangeDisplay.svelte | 87 ++ .../src/lib/components/DateRangeField.svelte | 283 ++++ .../ui/src/lib/components/DateSelect.svelte | 50 + .../ui/src/lib/components/Dialog.ssr.test.ts | 78 ++ packages/ui/src/lib/components/Dialog.svelte | 209 +++ .../src/lib/components/Dialog.svelte.test.ts | 208 +++ .../ui/src/lib/components/DividerDot.svelte | 17 + packages/ui/src/lib/components/Drawer.svelte | 174 +++ .../ui/src/lib/components/Duration.svelte | 86 ++ .../ui/src/lib/components/EmptyMessage.svelte | 34 + .../lib/components/ErrorNotification.svelte | 103 ++ .../src/lib/components/ExpansionPanel.svelte | 83 ++ packages/ui/src/lib/components/Field.svelte | 288 +++++ .../src/lib/components/Field.svelte.test.ts | 195 +++ packages/ui/src/lib/components/Form.svelte | 93 ++ .../ui/src/lib/components/Form.svelte.test.ts | 183 +++ packages/ui/src/lib/components/Gooey.svelte | 75 ++ packages/ui/src/lib/components/Grid.svelte | 94 ++ packages/ui/src/lib/components/Header.svelte | 80 ++ .../ui/src/lib/components/Icon.ssr.test.ts | 56 + packages/ui/src/lib/components/Icon.svelte | 219 ++++ .../ui/src/lib/components/Icon.svelte.test.ts | 249 ++++ .../src/lib/components/InfiniteScroll.svelte | 46 + packages/ui/src/lib/components/Input.svelte | 195 +++ .../src/lib/components/Input.svelte.test.ts | 167 +++ packages/ui/src/lib/components/Kbd.svelte | 60 + .../src/lib/components/LanguageSelect.svelte | 75 ++ packages/ui/src/lib/components/Lazy.svelte | 61 + .../ui/src/lib/components/ListItem.svelte | 138 ++ packages/ui/src/lib/components/Maybe.svelte | 22 + packages/ui/src/lib/components/Menu.svelte | 126 ++ .../ui/src/lib/components/Menu.svelte.test.ts | 226 ++++ .../ui/src/lib/components/MenuButton.svelte | 125 ++ .../ui/src/lib/components/MenuField.svelte | 209 +++ .../ui/src/lib/components/MenuItem.svelte | 79 ++ packages/ui/src/lib/components/Month.svelte | 159 +++ .../ui/src/lib/components/MonthList.svelte | 79 ++ .../src/lib/components/MonthListByYear.svelte | 63 + .../ui/src/lib/components/MultiSelect.svelte | 401 ++++++ .../lib/components/MultiSelectField.svelte | 229 ++++ .../src/lib/components/MultiSelectMenu.svelte | 166 +++ .../lib/components/MultiSelectOption.svelte | 124 ++ packages/ui/src/lib/components/NavItem.svelte | 98 ++ .../ui/src/lib/components/Notification.svelte | 272 ++++ .../src/lib/components/NumberStepper.svelte | 95 ++ .../ui/src/lib/components/Overflow.svelte | 40 + packages/ui/src/lib/components/Overlay.svelte | 50 + .../ui/src/lib/components/Paginate.svelte | 29 + .../ui/src/lib/components/Pagination.svelte | 160 +++ packages/ui/src/lib/components/Popover.svelte | 97 ++ .../ui/src/lib/components/Progress.svelte | 52 + .../src/lib/components/ProgressCircle.svelte | 170 +++ .../components/ProgressCircle.svelte.test.ts | 71 + .../ui/src/lib/components/QuickSearch.svelte | 110 ++ packages/ui/src/lib/components/Radio.svelte | 137 ++ .../ui/src/lib/components/RangeField.svelte | 79 ++ .../ui/src/lib/components/RangeSlider.svelte | 284 ++++ .../src/lib/components/ResponsiveMenu.svelte | 64 + .../src/lib/components/ScrollContainer.svelte | 27 + .../src/lib/components/ScrollingValue.svelte | 85 ++ .../src/lib/components/SectionDivider.svelte | 30 + .../ui/src/lib/components/SelectField.svelte | 660 ++++++++++ .../ui/src/lib/components/Selection.svelte | 69 + .../ui/src/lib/components/Settings.svelte | 28 + packages/ui/src/lib/components/Shine.svelte | 103 ++ .../ui/src/lib/components/SpringValue.svelte | 39 + packages/ui/src/lib/components/Stack.svelte | 44 + packages/ui/src/lib/components/Step.svelte | 103 ++ packages/ui/src/lib/components/Steps.svelte | 90 ++ packages/ui/src/lib/components/Switch.svelte | 125 ++ packages/ui/src/lib/components/Tab.svelte | 61 + .../ui/src/lib/components/Table.ssr.test.ts | 41 + packages/ui/src/lib/components/Table.svelte | 188 +++ .../src/lib/components/Table.svelte.test.ts | 183 +++ .../src/lib/components/TableOfContents.svelte | 145 +++ .../src/lib/components/TableOrderIcon.svelte | 32 + packages/ui/src/lib/components/Tabs.svelte | 113 ++ .../src/lib/components/TextField.ssr.test.ts | 91 ++ .../ui/src/lib/components/TextField.svelte | 587 +++++++++ .../lib/components/TextField.svelte.test.ts | 266 ++++ .../ui/src/lib/components/ThemeInit.svelte | 28 + .../ui/src/lib/components/ThemeSelect.svelte | 198 +++ .../ui/src/lib/components/ThemeSwitch.svelte | 56 + packages/ui/src/lib/components/Tilt.svelte | 74 ++ .../ui/src/lib/components/Timeline.svelte | 115 ++ .../src/lib/components/TimelineEvent.svelte | 175 +++ packages/ui/src/lib/components/Toggle.svelte | 49 + .../ui/src/lib/components/ToggleButton.svelte | 71 + .../ui/src/lib/components/ToggleGroup.svelte | 318 +++++ .../ui/src/lib/components/ToggleOption.svelte | 109 ++ .../ui/src/lib/components/TogglePanel.svelte | 36 + packages/ui/src/lib/components/Tooltip.svelte | 166 +++ .../ui/src/lib/components/TreeList.svelte | 60 + .../ui/src/lib/components/TweenedValue.svelte | 44 + .../src/lib/components/ViewportCenter.svelte | 23 + .../ui/src/lib/components/YearList.svelte | 107 ++ ...d-shows-errors-when-the-schema-fails-1.png | Bin 0 -> 14799 bytes ...-submit-and-reports-through-onChange-1.png | Bin 0 -> 10404 bytes ...rm-does-not-report-a-change-on-mount-1.png | Bin 0 -> 11658 bytes ...res-the-initial-value-with-revertAll-1.png | Bin 0 -> 11800 bytes .../ui/src/lib/components/date.svelte.test.ts | 400 ++++++ .../lib/components/disclosure.svelte.test.ts | 168 +++ .../src/lib/components/display.svelte.test.ts | 181 +++ .../src/lib/components/effects.svelte.test.ts | 232 ++++ .../lib/components/feedback.svelte.test.ts | 222 ++++ .../components/formControls.svelte.test.ts | 284 ++++ packages/ui/src/lib/components/index.ts | 101 ++ .../src/lib/components/layout.svelte.test.ts | 260 ++++ .../lib/components/primitives.svelte.test.ts | 331 +++++ .../src/lib/components/select.svelte.test.ts | 453 +++++++ .../lib/components/settingsState.svelte.ts | 287 +++++ .../tests/ButtonGroupHarness.svelte | 16 + .../tests/ButtonLabelHarness.svelte | 7 + .../tests/ButtonSettingsHarness.svelte | 12 + .../lib/components/tests/DateHarness.svelte | 35 + .../lib/components/tests/DialogHarness.svelte | 42 + .../components/tests/DisclosureHarness.svelte | 33 + .../components/tests/DisplayHarness.svelte | 53 + .../components/tests/EffectsHarness.svelte | 30 + .../components/tests/FeedbackHarness.svelte | 31 + .../lib/components/tests/FieldHarness.svelte | 42 + .../tests/FieldNoChildrenHarness.svelte | 9 + .../tests/FormControlsHarness.svelte | 42 + .../lib/components/tests/FormHarness.svelte | 45 + .../tests/IconChildrenHarness.svelte | 9 + .../lib/components/tests/InputHarness.svelte | 9 + .../lib/components/tests/LayoutHarness.svelte | 63 + .../lib/components/tests/MenuHarness.svelte | 33 + .../tests/MenuItemSettingsHarness.svelte | 13 + .../components/tests/PopoverHarness.svelte | 18 + .../components/tests/PrimitivesHarness.svelte | 56 + .../lib/components/tests/SelectHarness.svelte | 36 + .../components/tests/TableOrderHarness.svelte | 18 + .../components/tests/TextFieldHarness.svelte | 7 + .../lib/components/tests/ThemeHarness.svelte | 27 + .../tests/ToggleGroupHarness.svelte | 48 + .../src/lib/components/theme.svelte.test.ts | 236 ++++ packages/ui/src/lib/components/theme.ts | 142 ++ .../lib/components/toggleGroup.svelte.test.ts | 128 ++ packages/ui/src/lib/index.ts | 23 + packages/ui/src/lib/types/index.ts | 63 + packages/ui/src/lib/utils/icons.ts | 14 + packages/ui/src/vitest-setup-client.ts | 19 + packages/ui/svelte.config.js | 11 + packages/ui/tsconfig.json | 15 + packages/ui/vite.config.js | 63 + packages/utils/package.json | 7 +- pnpm-lock.yaml | 1143 ++++++++++++----- 725 files changed, 32869 insertions(+), 522 deletions(-) create mode 100644 .changeset/dark-variant-system.md create mode 100644 .changeset/docs-parity.md create mode 100644 .changeset/form-state.md create mode 100644 .changeset/layerstack-ui.md create mode 100644 .changeset/real-keys-battle.md create mode 100644 .changeset/svelte-attachments-overlay.md create mode 100644 .changeset/theme-desync.md create mode 100644 .changeset/theme-state.md create mode 100644 .changeset/ui-code-copybutton.md create mode 100644 .changeset/ui-form.md create mode 100644 .changeset/ui-settings-rename.md create mode 100644 .changeset/ui-wave-1.md create mode 100644 .changeset/ui-wave-2.md create mode 100644 .changeset/ui-wave-3.md create mode 100644 .changeset/ui-wave-4.md create mode 100644 .changeset/ui-wave-5.md create mode 100644 .changeset/ui-wave-6.md create mode 100644 .changeset/ui-wave-7.md create mode 100644 .changeset/ui-wave-8.md create mode 100644 .changeset/ui-wave-9.md create mode 100644 docs/.gitignore create mode 100644 docs/src/content/components/AppBar.md create mode 100644 docs/src/content/components/AppLayout.md create mode 100644 docs/src/content/components/Avatar.md create mode 100644 docs/src/content/components/Backdrop.md create mode 100644 docs/src/content/components/Badge.md create mode 100644 docs/src/content/components/BarStack.md create mode 100644 docs/src/content/components/Breadcrumb.md create mode 100644 docs/src/content/components/Button.md create mode 100644 docs/src/content/components/ButtonGroup.md create mode 100644 docs/src/content/components/Card.md create mode 100644 docs/src/content/components/Checkbox.md create mode 100644 docs/src/content/components/Code.md create mode 100644 docs/src/content/components/Collapse.md create mode 100644 docs/src/content/components/CopyButton.md create mode 100644 docs/src/content/components/DateButton.md create mode 100644 docs/src/content/components/DateField.md create mode 100644 docs/src/content/components/DatePickerField.md create mode 100644 docs/src/content/components/DateRange.md create mode 100644 docs/src/content/components/DateRangeDisplay.md create mode 100644 docs/src/content/components/DateRangeField.md create mode 100644 docs/src/content/components/DateSelect.md create mode 100644 docs/src/content/components/Dialog.md create mode 100644 docs/src/content/components/DividerDot.md create mode 100644 docs/src/content/components/Drawer.md create mode 100644 docs/src/content/components/Duration.md create mode 100644 docs/src/content/components/EmptyMessage.md create mode 100644 docs/src/content/components/ErrorNotification.md create mode 100644 docs/src/content/components/ExpansionPanel.md create mode 100644 docs/src/content/components/Field.md create mode 100644 docs/src/content/components/Form.md create mode 100644 docs/src/content/components/Gooey.md create mode 100644 docs/src/content/components/Grid.md create mode 100644 docs/src/content/components/Header.md create mode 100644 docs/src/content/components/Icon.md create mode 100644 docs/src/content/components/InfiniteScroll.md create mode 100644 docs/src/content/components/Input.md create mode 100644 docs/src/content/components/Kbd.md create mode 100644 docs/src/content/components/LanguageSelect.md create mode 100644 docs/src/content/components/Lazy.md create mode 100644 docs/src/content/components/ListItem.md create mode 100644 docs/src/content/components/Maybe.md create mode 100644 docs/src/content/components/Menu.md create mode 100644 docs/src/content/components/MenuButton.md create mode 100644 docs/src/content/components/MenuField.md create mode 100644 docs/src/content/components/MenuItem.md create mode 100644 docs/src/content/components/Month.md create mode 100644 docs/src/content/components/MonthList.md create mode 100644 docs/src/content/components/MonthListByYear.md create mode 100644 docs/src/content/components/MultiSelect.md create mode 100644 docs/src/content/components/MultiSelectField.md create mode 100644 docs/src/content/components/MultiSelectMenu.md create mode 100644 docs/src/content/components/MultiSelectOption.md create mode 100644 docs/src/content/components/NavItem.md create mode 100644 docs/src/content/components/Notification.md create mode 100644 docs/src/content/components/NumberStepper.md create mode 100644 docs/src/content/components/Overflow.md create mode 100644 docs/src/content/components/Overlay.md create mode 100644 docs/src/content/components/Paginate.md create mode 100644 docs/src/content/components/Pagination.md create mode 100644 docs/src/content/components/Popover.md create mode 100644 docs/src/content/components/Progress.md create mode 100644 docs/src/content/components/ProgressCircle.md create mode 100644 docs/src/content/components/QuickSearch.md create mode 100644 docs/src/content/components/Radio.md create mode 100644 docs/src/content/components/RangeField.md create mode 100644 docs/src/content/components/RangeSlider.md create mode 100644 docs/src/content/components/ResponsiveMenu.md create mode 100644 docs/src/content/components/ScrollContainer.md create mode 100644 docs/src/content/components/ScrollingValue.md create mode 100644 docs/src/content/components/SectionDivider.md create mode 100644 docs/src/content/components/SelectField.md create mode 100644 docs/src/content/components/Selection.md create mode 100644 docs/src/content/components/Settings.md create mode 100644 docs/src/content/components/Shine.md create mode 100644 docs/src/content/components/SpringValue.md create mode 100644 docs/src/content/components/Stack.md create mode 100644 docs/src/content/components/Step.md create mode 100644 docs/src/content/components/Steps.md create mode 100644 docs/src/content/components/Switch.md create mode 100644 docs/src/content/components/Tab.md create mode 100644 docs/src/content/components/Table.md create mode 100644 docs/src/content/components/TableOfContents.md create mode 100644 docs/src/content/components/TableOrderIcon.md create mode 100644 docs/src/content/components/Tabs.md create mode 100644 docs/src/content/components/TextField.md create mode 100644 docs/src/content/components/ThemeInit.md create mode 100644 docs/src/content/components/ThemeSelect.md create mode 100644 docs/src/content/components/ThemeSwitch.md create mode 100644 docs/src/content/components/Tilt.md create mode 100644 docs/src/content/components/Timeline.md create mode 100644 docs/src/content/components/TimelineEvent.md create mode 100644 docs/src/content/components/Toggle.md create mode 100644 docs/src/content/components/ToggleButton.md create mode 100644 docs/src/content/components/ToggleGroup.md create mode 100644 docs/src/content/components/ToggleOption.md create mode 100644 docs/src/content/components/TogglePanel.md create mode 100644 docs/src/content/components/Tooltip.md create mode 100644 docs/src/content/components/TreeList.md create mode 100644 docs/src/content/components/TweenedValue.md create mode 100644 docs/src/content/components/ViewportCenter.md create mode 100644 docs/src/content/components/YearList.md create mode 100644 docs/src/content/reference/svelte-attachments/dataBackground.md create mode 100644 docs/src/content/reference/svelte-attachments/focus.md create mode 100644 docs/src/content/reference/svelte-attachments/input.md create mode 100644 docs/src/content/reference/svelte-state/FormState.md create mode 100644 docs/src/content/reference/svelte-state/ThemeState.md create mode 100644 docs/src/examples/components/AppBar/basic.svelte create mode 100644 docs/src/examples/components/AppBar/menu-icon.svelte create mode 100644 docs/src/examples/components/Avatar/basic.svelte create mode 100644 docs/src/examples/components/Avatar/variations.svelte create mode 100644 docs/src/examples/components/Backdrop/basic.svelte create mode 100644 docs/src/examples/components/Badge/anchors.svelte create mode 100644 docs/src/examples/components/Badge/basic.svelte create mode 100644 docs/src/examples/components/Badge/placement.svelte create mode 100644 docs/src/examples/components/BarStack/basic.svelte create mode 100644 docs/src/examples/components/BarStack/customization.svelte create mode 100644 docs/src/examples/components/Breadcrumb/basic.svelte create mode 100644 docs/src/examples/components/Breadcrumb/custom-items.svelte create mode 100644 docs/src/examples/components/Breadcrumb/dividers.svelte create mode 100644 docs/src/examples/components/Button/colors.svelte create mode 100644 docs/src/examples/components/Button/icons.svelte create mode 100644 docs/src/examples/components/Button/loading.svelte create mode 100644 docs/src/examples/components/Button/sizes.svelte create mode 100644 docs/src/examples/components/Button/states.svelte create mode 100644 docs/src/examples/components/Button/variants.svelte create mode 100644 docs/src/examples/components/ButtonGroup/basic.svelte create mode 100644 docs/src/examples/components/ButtonGroup/selection.svelte create mode 100644 docs/src/examples/components/ButtonGroup/variants.svelte create mode 100644 docs/src/examples/components/Card/basic.svelte create mode 100644 docs/src/examples/components/Card/headers.svelte create mode 100644 docs/src/examples/components/Card/slots.svelte create mode 100644 docs/src/examples/components/Checkbox/basic.svelte create mode 100644 docs/src/examples/components/Checkbox/group.svelte create mode 100644 docs/src/examples/components/Checkbox/layout.svelte create mode 100644 docs/src/examples/components/Checkbox/states.svelte create mode 100644 docs/src/examples/components/Code/basic.svelte create mode 100644 docs/src/examples/components/Code/options.svelte create mode 100644 docs/src/examples/components/Collapse/accordion.svelte create mode 100644 docs/src/examples/components/Collapse/basic.svelte create mode 100644 docs/src/examples/components/Collapse/customization.svelte create mode 100644 docs/src/examples/components/CopyButton/basic.svelte create mode 100644 docs/src/examples/components/CopyButton/variations.svelte create mode 100644 docs/src/examples/components/DateButton/basic.svelte create mode 100644 docs/src/examples/components/DateField/basic.svelte create mode 100644 docs/src/examples/components/DateField/variations.svelte create mode 100644 docs/src/examples/components/DatePickerField/basic.svelte create mode 100644 docs/src/examples/components/DatePickerField/variations.svelte create mode 100644 docs/src/examples/components/DateRange/basic.svelte create mode 100644 docs/src/examples/components/DateRange/disabled-dates.svelte create mode 100644 docs/src/examples/components/DateRange/period-types.svelte create mode 100644 docs/src/examples/components/DateRangeDisplay/basic.svelte create mode 100644 docs/src/examples/components/DateRangeField/basic.svelte create mode 100644 docs/src/examples/components/DateRangeField/quick-presets.svelte create mode 100644 docs/src/examples/components/DateRangeField/stepper.svelte create mode 100644 docs/src/examples/components/DateRangeField/utc.svelte create mode 100644 docs/src/examples/components/DateSelect/basic.svelte create mode 100644 docs/src/examples/components/Dialog/basic.svelte create mode 100644 docs/src/examples/components/Dialog/loading.svelte create mode 100644 docs/src/examples/components/Dialog/persistent.svelte create mode 100644 docs/src/examples/components/DividerDot/basic.svelte create mode 100644 docs/src/examples/components/Drawer/basic.svelte create mode 100644 docs/src/examples/components/Drawer/persistent.svelte create mode 100644 docs/src/examples/components/Drawer/placement.svelte create mode 100644 docs/src/examples/components/Duration/basic.svelte create mode 100644 docs/src/examples/components/EmptyMessage/basic.svelte create mode 100644 docs/src/examples/components/ErrorNotification/basic.svelte create mode 100644 docs/src/examples/components/ExpansionPanel/basic.svelte create mode 100644 docs/src/examples/components/ExpansionPanel/composition.svelte create mode 100644 docs/src/examples/components/Field/basic.svelte create mode 100644 docs/src/examples/components/Field/clearable.svelte create mode 100644 docs/src/examples/components/Field/controls.svelte create mode 100644 docs/src/examples/components/Field/label-placement.svelte create mode 100644 docs/src/examples/components/Field/snippets.svelte create mode 100644 docs/src/examples/components/Form/basic.svelte create mode 100644 docs/src/examples/components/Form/own-state.svelte create mode 100644 docs/src/examples/components/Form/validation.svelte create mode 100644 docs/src/examples/components/FormState/basic.svelte create mode 100644 docs/src/examples/components/Gooey/basic.svelte create mode 100644 docs/src/examples/components/Gooey/variations.svelte create mode 100644 docs/src/examples/components/Grid/auto-columns.svelte create mode 100644 docs/src/examples/components/Grid/basic.svelte create mode 100644 docs/src/examples/components/Grid/templates.svelte create mode 100644 docs/src/examples/components/Header/basic.svelte create mode 100644 docs/src/examples/components/Icon/accessibility.svelte create mode 100644 docs/src/examples/components/Icon/basic.svelte create mode 100644 docs/src/examples/components/Icon/classes.svelte create mode 100644 docs/src/examples/components/Icon/component.svelte create mode 100644 docs/src/examples/components/Icon/sizing.svelte create mode 100644 docs/src/examples/components/InfiniteScroll/basic.svelte create mode 100644 docs/src/examples/components/InfiniteScroll/per-page.svelte create mode 100644 docs/src/examples/components/Input/basic.svelte create mode 100644 docs/src/examples/components/Input/mask-types.svelte create mode 100644 docs/src/examples/components/Input/mask.svelte create mode 100644 docs/src/examples/components/Kbd/basic.svelte create mode 100644 docs/src/examples/components/LanguageSelect/basic.svelte create mode 100644 docs/src/examples/components/Lazy/basic.svelte create mode 100644 docs/src/examples/components/ListItem/basic.svelte create mode 100644 docs/src/examples/components/ListItem/variations.svelte create mode 100644 docs/src/examples/components/Maybe/basic.svelte create mode 100644 docs/src/examples/components/Menu/basic.svelte create mode 100644 docs/src/examples/components/Menu/explicit-close.svelte create mode 100644 docs/src/examples/components/Menu/icons-and-selection.svelte create mode 100644 docs/src/examples/components/MenuButton/basic.svelte create mode 100644 docs/src/examples/components/MenuButton/custom-menu.svelte create mode 100644 docs/src/examples/components/MenuButton/icons-and-menu.svelte create mode 100644 docs/src/examples/components/MenuButton/selection.svelte create mode 100644 docs/src/examples/components/MenuField/basic.svelte create mode 100644 docs/src/examples/components/MenuField/grouped.svelte create mode 100644 docs/src/examples/components/MenuField/icons-and-menu.svelte create mode 100644 docs/src/examples/components/MenuField/selection.svelte create mode 100644 docs/src/examples/components/MenuField/stepper.svelte create mode 100644 docs/src/examples/components/Month/basic.svelte create mode 100644 docs/src/examples/components/Month/disabled-and-outside.svelte create mode 100644 docs/src/examples/components/Month/selection.svelte create mode 100644 docs/src/examples/components/MonthList/basic.svelte create mode 100644 docs/src/examples/components/MonthList/disabled.svelte create mode 100644 docs/src/examples/components/MonthList/formats-and-selection.svelte create mode 100644 docs/src/examples/components/MonthListByYear/basic.svelte create mode 100644 docs/src/examples/components/MonthListByYear/bounds.svelte create mode 100644 docs/src/examples/components/MultiSelect/basic.svelte create mode 100644 docs/src/examples/components/MultiSelect/custom-options.svelte create mode 100644 docs/src/examples/components/MultiSelect/max.svelte create mode 100644 docs/src/examples/components/MultiSelect/modes.svelte create mode 100644 docs/src/examples/components/MultiSelect/search.svelte create mode 100644 docs/src/examples/components/MultiSelect/slots.svelte create mode 100644 docs/src/examples/components/MultiSelect/variants-and-order.svelte create mode 100644 docs/src/examples/components/MultiSelectField/basic.svelte create mode 100644 docs/src/examples/components/MultiSelectField/format-selected.svelte create mode 100644 docs/src/examples/components/MultiSelectField/search-and-max.svelte create mode 100644 docs/src/examples/components/MultiSelectMenu/basic.svelte create mode 100644 docs/src/examples/components/MultiSelectMenu/search.svelte create mode 100644 docs/src/examples/components/MultiSelectOption/actions.svelte create mode 100644 docs/src/examples/components/MultiSelectOption/variants.svelte create mode 100644 docs/src/examples/components/NavItem/basic.svelte create mode 100644 docs/src/examples/components/Notification/basic.svelte create mode 100644 docs/src/examples/components/Notification/colors.svelte create mode 100644 docs/src/examples/components/Notification/variations.svelte create mode 100644 docs/src/examples/components/NumberStepper/basic.svelte create mode 100644 docs/src/examples/components/NumberStepper/options.svelte create mode 100644 docs/src/examples/components/NumberStepper/prefix-suffix.svelte create mode 100644 docs/src/examples/components/Overflow/basic.svelte create mode 100644 docs/src/examples/components/Overflow/conditional-tooltip.svelte create mode 100644 docs/src/examples/components/Overlay/basic.svelte create mode 100644 docs/src/examples/components/Overlay/variations.svelte create mode 100644 docs/src/examples/components/Paginate/basic.svelte create mode 100644 docs/src/examples/components/Pagination/basic.svelte create mode 100644 docs/src/examples/components/Popover/basic.svelte create mode 100644 docs/src/examples/components/Popover/placement.svelte create mode 100644 docs/src/examples/components/Progress/basic.svelte create mode 100644 docs/src/examples/components/Progress/color-by-value.svelte create mode 100644 docs/src/examples/components/Progress/colors.svelte create mode 100644 docs/src/examples/components/ProgressCircle/basic.svelte create mode 100644 docs/src/examples/components/ProgressCircle/colors.svelte create mode 100644 docs/src/examples/components/ProgressCircle/label.svelte create mode 100644 docs/src/examples/components/ProgressCircle/sizing.svelte create mode 100644 docs/src/examples/components/ProgressCircle/track-and-rotate.svelte create mode 100644 docs/src/examples/components/QuickSearch/basic.svelte create mode 100644 docs/src/examples/components/QuickSearch/keyboard-shortcut.svelte create mode 100644 docs/src/examples/components/Radio/basic.svelte create mode 100644 docs/src/examples/components/Radio/layout.svelte create mode 100644 docs/src/examples/components/Radio/states.svelte create mode 100644 docs/src/examples/components/RangeField/basic.svelte create mode 100644 docs/src/examples/components/RangeField/options.svelte create mode 100644 docs/src/examples/components/RangeSlider/basic.svelte create mode 100644 docs/src/examples/components/RangeSlider/options.svelte create mode 100644 docs/src/examples/components/ResponsiveMenu/basic.svelte create mode 100644 docs/src/examples/components/ResponsiveMenu/props.svelte create mode 100644 docs/src/examples/components/ScrollContainer/basic.svelte create mode 100644 docs/src/examples/components/ScrollingValue/basic.svelte create mode 100644 docs/src/examples/components/ScrollingValue/variations.svelte create mode 100644 docs/src/examples/components/SectionDivider/basic.svelte create mode 100644 docs/src/examples/components/SelectField/async-search.svelte create mode 100644 docs/src/examples/components/SelectField/basic.svelte create mode 100644 docs/src/examples/components/SelectField/custom-options.svelte create mode 100644 docs/src/examples/components/SelectField/grouped.svelte create mode 100644 docs/src/examples/components/SelectField/inline-options.svelte create mode 100644 docs/src/examples/components/SelectField/option-values.svelte create mode 100644 docs/src/examples/components/SelectField/states.svelte create mode 100644 docs/src/examples/components/SelectField/stepper.svelte create mode 100644 docs/src/examples/components/Selection/basic.svelte create mode 100644 docs/src/examples/components/Selection/select-all.svelte create mode 100644 docs/src/examples/components/Settings/basic.svelte create mode 100644 docs/src/examples/components/Shine/basic.svelte create mode 100644 docs/src/examples/components/Shine/options.svelte create mode 100644 docs/src/examples/components/SpringValue/basic.svelte create mode 100644 docs/src/examples/components/SpringValue/options.svelte create mode 100644 docs/src/examples/components/Stack/basic.svelte create mode 100644 docs/src/examples/components/Stack/justify-and-template.svelte create mode 100644 docs/src/examples/components/Stack/stacked.svelte create mode 100644 docs/src/examples/components/Steps/basic.svelte create mode 100644 docs/src/examples/components/Steps/points.svelte create mode 100644 docs/src/examples/components/Steps/vertical-and-colors.svelte create mode 100644 docs/src/examples/components/Switch/basic.svelte create mode 100644 docs/src/examples/components/Switch/labels-and-icons.svelte create mode 100644 docs/src/examples/components/Switch/states.svelte create mode 100644 docs/src/examples/components/Table/basic.svelte create mode 100644 docs/src/examples/components/Table/formatting.svelte create mode 100644 docs/src/examples/components/Table/ordering.svelte create mode 100644 docs/src/examples/components/TableOfContents/basic.svelte create mode 100644 docs/src/examples/components/TableOfContents/styling.svelte create mode 100644 docs/src/examples/components/Tabs/basic.svelte create mode 100644 docs/src/examples/components/Tabs/composition.svelte create mode 100644 docs/src/examples/components/Tabs/placement.svelte create mode 100644 docs/src/examples/components/TextField/adornments.svelte create mode 100644 docs/src/examples/components/TextField/basic.svelte create mode 100644 docs/src/examples/components/TextField/debounce.svelte create mode 100644 docs/src/examples/components/TextField/label-placement.svelte create mode 100644 docs/src/examples/components/TextField/mask.svelte create mode 100644 docs/src/examples/components/TextField/multiline.svelte create mode 100644 docs/src/examples/components/TextField/operators.svelte create mode 100644 docs/src/examples/components/TextField/states.svelte create mode 100644 docs/src/examples/components/TextField/types.svelte create mode 100644 docs/src/examples/components/ThemeSelect/basic.svelte create mode 100644 docs/src/examples/components/ThemeSelect/options.svelte create mode 100644 docs/src/examples/components/ThemeState/basic.svelte create mode 100644 docs/src/examples/components/ThemeSwitch/basic.svelte create mode 100644 docs/src/examples/components/ThemeSwitch/customization.svelte create mode 100644 docs/src/examples/components/Tilt/basic.svelte create mode 100644 docs/src/examples/components/Tilt/options.svelte create mode 100644 docs/src/examples/components/Timeline/basic.svelte create mode 100644 docs/src/examples/components/Timeline/layouts.svelte create mode 100644 docs/src/examples/components/Timeline/vertical.svelte create mode 100644 docs/src/examples/components/Toggle/basic.svelte create mode 100644 docs/src/examples/components/ToggleButton/basic.svelte create mode 100644 docs/src/examples/components/ToggleButton/variations.svelte create mode 100644 docs/src/examples/components/ToggleGroup/basic.svelte create mode 100644 docs/src/examples/components/ToggleGroup/panels.svelte create mode 100644 docs/src/examples/components/ToggleGroup/variants.svelte create mode 100644 docs/src/examples/components/Tooltip/basic.svelte create mode 100644 docs/src/examples/components/Tooltip/custom.svelte create mode 100644 docs/src/examples/components/Tooltip/placement.svelte create mode 100644 docs/src/examples/components/TreeList/basic.svelte create mode 100644 docs/src/examples/components/TweenedValue/basic.svelte create mode 100644 docs/src/examples/components/TweenedValue/options.svelte create mode 100644 docs/src/examples/components/ViewportCenter/basic.svelte create mode 100644 docs/src/examples/components/YearList/basic.svelte create mode 100644 docs/src/examples/components/YearList/bounds.svelte rename docs/src/examples/components/{dataBackground => action-dataBackground}/basic.svelte (100%) rename docs/src/examples/components/{dataBackground => action-dataBackground}/tailwind-gradient.svelte (100%) rename docs/src/examples/components/{input => action-input}/auto-focus.svelte (100%) rename docs/src/examples/components/{input => action-input}/auto-height.svelte (100%) rename docs/src/examples/components/{input => action-input}/blur-on-escape.svelte (100%) rename docs/src/examples/components/{input => action-input}/debounce-event.svelte (100%) rename docs/src/examples/components/{input => action-input}/select-on-focus.svelte (100%) rename docs/src/examples/components/{layout => action-layout}/overflow.svelte (100%) rename docs/src/examples/components/{mouse => action-mouse}/longpress.svelte (100%) rename docs/src/examples/components/{mouse => action-mouse}/movable-step-percent.svelte (100%) rename docs/src/examples/components/{mouse => action-mouse}/movable-step.svelte (100%) rename docs/src/examples/components/{mouse => action-mouse}/movable-x-axis.svelte (100%) rename docs/src/examples/components/{mouse => action-mouse}/movable.svelte (100%) rename docs/src/examples/components/{observer => action-observer}/adding-class-when-fully-visible.svelte (100%) rename docs/src/examples/components/{observer => action-observer}/basic.svelte (100%) rename docs/src/examples/components/{observer => action-observer}/full-coordinates.svelte (100%) rename docs/src/examples/components/{observer => action-observer}/setting-css-variable.svelte (100%) rename docs/src/examples/components/{observer => action-observer}/show-header-on-scroll-away.svelte (100%) rename docs/src/examples/components/{portal => action-portal}/ancestor-portal-target.svelte (100%) rename docs/src/examples/components/{portal => action-portal}/basic.svelte (100%) rename docs/src/examples/components/{portal => action-portal}/custom-target.svelte (100%) rename docs/src/examples/components/{portal => action-portal}/destroyable.svelte (100%) rename docs/src/examples/components/{portal => action-portal}/first-sibling-portal-target.svelte (100%) rename docs/src/examples/components/{scroll => action-scroll}/basic.svelte (100%) rename docs/src/examples/components/{scroll => action-scroll}/only-if-needed.svelte (100%) rename docs/src/examples/components/{scroll => action-scroll}/scroll-fade-flip.svelte (100%) rename docs/src/examples/components/{scroll => action-scroll}/scroll-fade-horizontal.svelte (100%) rename docs/src/examples/components/{scroll => action-scroll}/scroll-fade.svelte (100%) rename docs/src/examples/components/{scroll => action-scroll}/scroll-shadow-bottom-surface.svelte (100%) rename docs/src/examples/components/{scroll => action-scroll}/scroll-shadow-flip.svelte (100%) rename docs/src/examples/components/{scroll => action-scroll}/scroll-shadow-horizontal.svelte (100%) rename docs/src/examples/components/{scroll => action-scroll}/scroll-shadow-truncation.svelte (100%) rename docs/src/examples/components/{scroll => action-scroll}/scroll-shadow.svelte (100%) rename docs/src/examples/components/{spotlight => action-spotlight}/global-context-and-css-variables.svelte (100%) rename docs/src/examples/components/{spotlight => action-spotlight}/global-context-and-options.svelte (100%) rename docs/src/examples/components/{spotlight => action-spotlight}/line.svelte (100%) rename docs/src/examples/components/{styles => action-styles}/computed-styles.svelte (100%) rename docs/src/examples/components/{styles => action-styles}/style-props.svelte (100%) create mode 100644 docs/src/examples/components/attach-dataBackground/basic.svelte create mode 100644 docs/src/examples/components/attach-dataBackground/tailwind-gradient.svelte create mode 100644 docs/src/examples/components/attach-focus/focus-move.svelte create mode 100644 docs/src/examples/components/attach-focus/restore-focus.svelte create mode 100644 docs/src/examples/components/attach-input/auto-focus.svelte create mode 100644 docs/src/examples/components/attach-input/auto-height.svelte create mode 100644 docs/src/examples/components/attach-input/blur-on-escape.svelte create mode 100644 docs/src/examples/components/attach-input/debounce-event.svelte create mode 100644 docs/src/examples/components/attach-input/select-on-focus.svelte create mode 100644 docs/src/routes/docs/svelte-attachments/+page.server.ts create mode 100644 docs/src/routes/docs/ui/[name]/+page.svelte create mode 100644 docs/src/routes/docs/ui/[name]/+page.ts create mode 100644 docs/src/routes/docs/ui/[name]/llms.txt/+server.ts create mode 100644 packages/svelte-attachments/.prettierignore create mode 100644 packages/svelte-attachments/CHANGELOG.md create mode 100644 packages/svelte-attachments/LICENSE create mode 100644 packages/svelte-attachments/README.md create mode 100644 packages/svelte-attachments/package.json create mode 100644 packages/svelte-attachments/src/lib/dataBackground.svelte.ts create mode 100644 packages/svelte-attachments/src/lib/focus.ts create mode 100644 packages/svelte-attachments/src/lib/index.ts create mode 100644 packages/svelte-attachments/src/lib/input.ts create mode 100644 packages/svelte-attachments/src/lib/layout.ts create mode 100644 packages/svelte-attachments/src/lib/mouse.ts create mode 100644 packages/svelte-attachments/src/lib/observer.ts create mode 100644 packages/svelte-attachments/src/lib/placeholder.test.ts create mode 100644 packages/svelte-attachments/src/lib/popover.ts create mode 100644 packages/svelte-attachments/src/lib/portal.ts create mode 100644 packages/svelte-attachments/src/lib/scroll.ts create mode 100644 packages/svelte-attachments/tsconfig.build.json create mode 100644 packages/svelte-attachments/tsconfig.json create mode 100644 packages/svelte-attachments/vite.config.js create mode 100644 packages/svelte-state/src/lib/formState.svelte.ts create mode 100644 packages/svelte-state/src/lib/formState.test.svelte.ts create mode 100644 packages/svelte-state/src/lib/themeState.svelte.ts create mode 100644 packages/svelte-state/src/lib/themeState.test.svelte.ts create mode 100644 packages/svelte-state/src/lib/timerState.test.svelte.ts create mode 100644 packages/ui/.prettierignore create mode 100644 packages/ui/.vitest-attachments/00480bf7281d8ec0325118817dae57e7d1f16226.png create mode 100644 packages/ui/.vitest-attachments/0651635e51b69ebd04fc38c06582955c3c91c675.png create mode 100644 packages/ui/.vitest-attachments/0e5a00515b9417e9b1d099c090c8b153f8e855b1.png create mode 100644 packages/ui/.vitest-attachments/111cd7f83ba7ac3d5f957eecb73c04e14b35bf33.png create mode 100644 packages/ui/.vitest-attachments/121da0ce648ec9a4b94c9e6f771d28cae42baaf7.png create mode 100644 packages/ui/.vitest-attachments/1cfc962fa4bd70f0e84e5860860cc69656649de7.png create mode 100644 packages/ui/.vitest-attachments/1ea522155fe2d10671fb3a151d1f29aa62cd41e7.png create mode 100644 packages/ui/.vitest-attachments/1f2459645ca2652a78aa0005ec222c190daf039e.png create mode 100644 packages/ui/.vitest-attachments/20df5936283bdf572f7438fa83102fc35ee58a8c.png create mode 100644 packages/ui/.vitest-attachments/212672fb222300de68c9b06c8ee91eb03196eb97.png create mode 100644 packages/ui/.vitest-attachments/2bb99457325b2dc39db4f24ed22aef9678a7bd2b.png create mode 100644 packages/ui/.vitest-attachments/33e99ddc45b365ddbaa6797e5ffb30967c31ac32.png create mode 100644 packages/ui/.vitest-attachments/392d4f623832730d5b27d38e60f1e087d6025479.png create mode 100644 packages/ui/.vitest-attachments/3f1bac71b3c6664baa1b2559a03552063ead8b1e.png create mode 100644 packages/ui/.vitest-attachments/3f5983ae41c3c4f0d5a8ba4efffb746f4b0c3887.png create mode 100644 packages/ui/.vitest-attachments/448f8a4081600c3d1b8fbea581effc9b876ad3b7.png create mode 100644 packages/ui/.vitest-attachments/44b3058fd2db96c997dd57a2714d847efd358279.png create mode 100644 packages/ui/.vitest-attachments/45f6bac8671b2c2899e6108e07c38ad7b67af079.png create mode 100644 packages/ui/.vitest-attachments/4b085ec85f15c6042e0bfd4aec68f21c6b6e387e.png create mode 100644 packages/ui/.vitest-attachments/56737b7c3b5d1722c457c577dee726a04882f1ea.png create mode 100644 packages/ui/.vitest-attachments/5d50500db391c079ebd30e49060081383e7e9b1d.png create mode 100644 packages/ui/.vitest-attachments/65d914e504451521bf6b5a5fc5cd3ab28ffa0d2f.png create mode 100644 packages/ui/.vitest-attachments/69b41bab87c5771fcbae89105b04bd8758141194.png create mode 100644 packages/ui/.vitest-attachments/6adaeaf6ca444fb86ee68219e281cb18301be250.png create mode 100644 packages/ui/.vitest-attachments/71d643c4fde6eb54ebc25ea0c042e02ada32f29c.png create mode 100644 packages/ui/.vitest-attachments/721b56fec87598274c378bbb26582969c391c14d.png create mode 100644 packages/ui/.vitest-attachments/74dcd11a4bf39c6e60e7086ce5408ddd90dd23bb.png create mode 100644 packages/ui/.vitest-attachments/76a27ef07f0271d244df3a3620fa518543959f45.png create mode 100644 packages/ui/.vitest-attachments/78c12767f43dc85eba62a3bfd4c6649018cc6d82.png create mode 100644 packages/ui/.vitest-attachments/7bc3a3a2ef24df4e5a53f769367d5855e6c2eac3.png create mode 100644 packages/ui/.vitest-attachments/7d4ed8c2f568dd058783af9563529a863b1ada67.png create mode 100644 packages/ui/.vitest-attachments/86c50dad220ef78acb435f50b7da69c2eee8a336.png create mode 100644 packages/ui/.vitest-attachments/8c44f07d4c83a20ca00f4aedd9cf17c70e43b333.png create mode 100644 packages/ui/.vitest-attachments/8f838292e8d0b3abb4970b04e89b9df5ee0f08d7.png create mode 100644 packages/ui/.vitest-attachments/91e89d794e275fc939be8983209a1e6b726c480e.png create mode 100644 packages/ui/.vitest-attachments/954d737c8892209afae4f6e94d16f4015d8eb52c.png create mode 100644 packages/ui/.vitest-attachments/98358f85395b60bba8b2c583900641222cc5d013.png create mode 100644 packages/ui/.vitest-attachments/9fc69c1046441758e5274837fd0f86512c78e581.png create mode 100644 packages/ui/.vitest-attachments/a2647d0a990a6bd8a0e6a6af29102cf7f0b5f4cc.png create mode 100644 packages/ui/.vitest-attachments/ab34c98121a10958c6e2d2d435c2ae20113f8aa9.png create mode 100644 packages/ui/.vitest-attachments/b059e42a1654f5b7822e34c5914548f5d675f98a.png create mode 100644 packages/ui/.vitest-attachments/b8a0f707ddfad33ae1ed975a5932abda9b153466.png create mode 100644 packages/ui/.vitest-attachments/b9ad04e19d81df99be1f796b1bcb0d9f920c25ea.png create mode 100644 packages/ui/.vitest-attachments/babd35ab8a5755dcffe3d86562956c52a4b9f550.png create mode 100644 packages/ui/.vitest-attachments/c00e78cdd0dde1438e7be3715eddcfb935ea9f17.png create mode 100644 packages/ui/.vitest-attachments/c212a974defaaba15e1b5ac077b3e8ee15171938.png create mode 100644 packages/ui/.vitest-attachments/c23e85c3a10f721ef561ad6f147a55bfceca798e.png create mode 100644 packages/ui/.vitest-attachments/cdb6be0fdf65b70dd8ff349e673d6bf2752886dc.png create mode 100644 packages/ui/.vitest-attachments/ce0a8c662d9e3494cbf0f5ea17731f7f119d33f7.png create mode 100644 packages/ui/.vitest-attachments/d1055d59aff08a041afb8dc45cc7a8e6d84e6bba.png create mode 100644 packages/ui/.vitest-attachments/d4b8eea32bba42914f20b359cb04bfac17707a87.png create mode 100644 packages/ui/.vitest-attachments/e3a6b8c2eea9f08cf7df0f4ce0bfccc5c3e5f98a.png create mode 100644 packages/ui/.vitest-attachments/e96991133a8d2fe80173365d0c3ba6caccdbeb81.png create mode 100644 packages/ui/.vitest-attachments/e9f64d9aaeb0243d1a924a205893a18520a74941.png create mode 100644 packages/ui/.vitest-attachments/ebe70cd4f13b4f76504d2fdaaa4ca9db234dde4f.png create mode 100644 packages/ui/.vitest-attachments/eddfc28e446bc8092312c8ad04b00c20646d81a3.png create mode 100644 packages/ui/.vitest-attachments/f03a7c1559f1aa4c7eaa784f3a659f536f8f6efa.png create mode 100644 packages/ui/.vitest-attachments/f2f400afe33ae2d9b9b49ebe4c03dbfddeb0ce2b.png create mode 100644 packages/ui/.vitest-attachments/fdfa8804b016bebc973832b55e7a989248f89bec.png create mode 100644 packages/ui/CHANGELOG.md create mode 100644 packages/ui/LICENSE create mode 100644 packages/ui/MIGRATION.md create mode 100644 packages/ui/README.md create mode 100644 packages/ui/package.json create mode 100644 packages/ui/src/app.d.ts create mode 100644 packages/ui/src/app.html create mode 100644 packages/ui/src/lib/components/AppBar.svelte create mode 100644 packages/ui/src/lib/components/AppLayout.svelte create mode 100644 packages/ui/src/lib/components/Avatar.svelte create mode 100644 packages/ui/src/lib/components/Backdrop.svelte create mode 100644 packages/ui/src/lib/components/Badge.svelte create mode 100644 packages/ui/src/lib/components/BarStack.svelte create mode 100644 packages/ui/src/lib/components/Breadcrumb.svelte create mode 100644 packages/ui/src/lib/components/Button.ssr.test.ts create mode 100644 packages/ui/src/lib/components/Button.svelte create mode 100644 packages/ui/src/lib/components/Button.svelte.test.ts create mode 100644 packages/ui/src/lib/components/ButtonGroup.svelte create mode 100644 packages/ui/src/lib/components/Card.svelte create mode 100644 packages/ui/src/lib/components/Checkbox.svelte create mode 100644 packages/ui/src/lib/components/Code.svelte create mode 100644 packages/ui/src/lib/components/Code.svelte.test.ts create mode 100644 packages/ui/src/lib/components/Collapse.svelte create mode 100644 packages/ui/src/lib/components/CopyButton.svelte create mode 100644 packages/ui/src/lib/components/DateButton.svelte create mode 100644 packages/ui/src/lib/components/DateField.svelte create mode 100644 packages/ui/src/lib/components/DatePickerField.svelte create mode 100644 packages/ui/src/lib/components/DateRange.svelte create mode 100644 packages/ui/src/lib/components/DateRangeDisplay.svelte create mode 100644 packages/ui/src/lib/components/DateRangeField.svelte create mode 100644 packages/ui/src/lib/components/DateSelect.svelte create mode 100644 packages/ui/src/lib/components/Dialog.ssr.test.ts create mode 100644 packages/ui/src/lib/components/Dialog.svelte create mode 100644 packages/ui/src/lib/components/Dialog.svelte.test.ts create mode 100644 packages/ui/src/lib/components/DividerDot.svelte create mode 100644 packages/ui/src/lib/components/Drawer.svelte create mode 100644 packages/ui/src/lib/components/Duration.svelte create mode 100644 packages/ui/src/lib/components/EmptyMessage.svelte create mode 100644 packages/ui/src/lib/components/ErrorNotification.svelte create mode 100644 packages/ui/src/lib/components/ExpansionPanel.svelte create mode 100644 packages/ui/src/lib/components/Field.svelte create mode 100644 packages/ui/src/lib/components/Field.svelte.test.ts create mode 100644 packages/ui/src/lib/components/Form.svelte create mode 100644 packages/ui/src/lib/components/Form.svelte.test.ts create mode 100644 packages/ui/src/lib/components/Gooey.svelte create mode 100644 packages/ui/src/lib/components/Grid.svelte create mode 100644 packages/ui/src/lib/components/Header.svelte create mode 100644 packages/ui/src/lib/components/Icon.ssr.test.ts create mode 100644 packages/ui/src/lib/components/Icon.svelte create mode 100644 packages/ui/src/lib/components/Icon.svelte.test.ts create mode 100644 packages/ui/src/lib/components/InfiniteScroll.svelte create mode 100644 packages/ui/src/lib/components/Input.svelte create mode 100644 packages/ui/src/lib/components/Input.svelte.test.ts create mode 100644 packages/ui/src/lib/components/Kbd.svelte create mode 100644 packages/ui/src/lib/components/LanguageSelect.svelte create mode 100644 packages/ui/src/lib/components/Lazy.svelte create mode 100644 packages/ui/src/lib/components/ListItem.svelte create mode 100644 packages/ui/src/lib/components/Maybe.svelte create mode 100644 packages/ui/src/lib/components/Menu.svelte create mode 100644 packages/ui/src/lib/components/Menu.svelte.test.ts create mode 100644 packages/ui/src/lib/components/MenuButton.svelte create mode 100644 packages/ui/src/lib/components/MenuField.svelte create mode 100644 packages/ui/src/lib/components/MenuItem.svelte create mode 100644 packages/ui/src/lib/components/Month.svelte create mode 100644 packages/ui/src/lib/components/MonthList.svelte create mode 100644 packages/ui/src/lib/components/MonthListByYear.svelte create mode 100644 packages/ui/src/lib/components/MultiSelect.svelte create mode 100644 packages/ui/src/lib/components/MultiSelectField.svelte create mode 100644 packages/ui/src/lib/components/MultiSelectMenu.svelte create mode 100644 packages/ui/src/lib/components/MultiSelectOption.svelte create mode 100644 packages/ui/src/lib/components/NavItem.svelte create mode 100644 packages/ui/src/lib/components/Notification.svelte create mode 100644 packages/ui/src/lib/components/NumberStepper.svelte create mode 100644 packages/ui/src/lib/components/Overflow.svelte create mode 100644 packages/ui/src/lib/components/Overlay.svelte create mode 100644 packages/ui/src/lib/components/Paginate.svelte create mode 100644 packages/ui/src/lib/components/Pagination.svelte create mode 100644 packages/ui/src/lib/components/Popover.svelte create mode 100644 packages/ui/src/lib/components/Progress.svelte create mode 100644 packages/ui/src/lib/components/ProgressCircle.svelte create mode 100644 packages/ui/src/lib/components/ProgressCircle.svelte.test.ts create mode 100644 packages/ui/src/lib/components/QuickSearch.svelte create mode 100644 packages/ui/src/lib/components/Radio.svelte create mode 100644 packages/ui/src/lib/components/RangeField.svelte create mode 100644 packages/ui/src/lib/components/RangeSlider.svelte create mode 100644 packages/ui/src/lib/components/ResponsiveMenu.svelte create mode 100644 packages/ui/src/lib/components/ScrollContainer.svelte create mode 100644 packages/ui/src/lib/components/ScrollingValue.svelte create mode 100644 packages/ui/src/lib/components/SectionDivider.svelte create mode 100644 packages/ui/src/lib/components/SelectField.svelte create mode 100644 packages/ui/src/lib/components/Selection.svelte create mode 100644 packages/ui/src/lib/components/Settings.svelte create mode 100644 packages/ui/src/lib/components/Shine.svelte create mode 100644 packages/ui/src/lib/components/SpringValue.svelte create mode 100644 packages/ui/src/lib/components/Stack.svelte create mode 100644 packages/ui/src/lib/components/Step.svelte create mode 100644 packages/ui/src/lib/components/Steps.svelte create mode 100644 packages/ui/src/lib/components/Switch.svelte create mode 100644 packages/ui/src/lib/components/Tab.svelte create mode 100644 packages/ui/src/lib/components/Table.ssr.test.ts create mode 100644 packages/ui/src/lib/components/Table.svelte create mode 100644 packages/ui/src/lib/components/Table.svelte.test.ts create mode 100644 packages/ui/src/lib/components/TableOfContents.svelte create mode 100644 packages/ui/src/lib/components/TableOrderIcon.svelte create mode 100644 packages/ui/src/lib/components/Tabs.svelte create mode 100644 packages/ui/src/lib/components/TextField.ssr.test.ts create mode 100644 packages/ui/src/lib/components/TextField.svelte create mode 100644 packages/ui/src/lib/components/TextField.svelte.test.ts create mode 100644 packages/ui/src/lib/components/ThemeInit.svelte create mode 100644 packages/ui/src/lib/components/ThemeSelect.svelte create mode 100644 packages/ui/src/lib/components/ThemeSwitch.svelte create mode 100644 packages/ui/src/lib/components/Tilt.svelte create mode 100644 packages/ui/src/lib/components/Timeline.svelte create mode 100644 packages/ui/src/lib/components/TimelineEvent.svelte create mode 100644 packages/ui/src/lib/components/Toggle.svelte create mode 100644 packages/ui/src/lib/components/ToggleButton.svelte create mode 100644 packages/ui/src/lib/components/ToggleGroup.svelte create mode 100644 packages/ui/src/lib/components/ToggleOption.svelte create mode 100644 packages/ui/src/lib/components/TogglePanel.svelte create mode 100644 packages/ui/src/lib/components/Tooltip.svelte create mode 100644 packages/ui/src/lib/components/TreeList.svelte create mode 100644 packages/ui/src/lib/components/TweenedValue.svelte create mode 100644 packages/ui/src/lib/components/ViewportCenter.svelte create mode 100644 packages/ui/src/lib/components/YearList.svelte create mode 100644 packages/ui/src/lib/components/__screenshots__/Form.svelte.test.ts/Form-blocks-the-commit-and-shows-errors-when-the-schema-fails-1.png create mode 100644 packages/ui/src/lib/components/__screenshots__/Form.svelte.test.ts/Form-commits-on-submit-and-reports-through-onChange-1.png create mode 100644 packages/ui/src/lib/components/__screenshots__/Form.svelte.test.ts/Form-does-not-report-a-change-on-mount-1.png create mode 100644 packages/ui/src/lib/components/__screenshots__/Form.svelte.test.ts/Form-restores-the-initial-value-with-revertAll-1.png create mode 100644 packages/ui/src/lib/components/date.svelte.test.ts create mode 100644 packages/ui/src/lib/components/disclosure.svelte.test.ts create mode 100644 packages/ui/src/lib/components/display.svelte.test.ts create mode 100644 packages/ui/src/lib/components/effects.svelte.test.ts create mode 100644 packages/ui/src/lib/components/feedback.svelte.test.ts create mode 100644 packages/ui/src/lib/components/formControls.svelte.test.ts create mode 100644 packages/ui/src/lib/components/index.ts create mode 100644 packages/ui/src/lib/components/layout.svelte.test.ts create mode 100644 packages/ui/src/lib/components/primitives.svelte.test.ts create mode 100644 packages/ui/src/lib/components/select.svelte.test.ts create mode 100644 packages/ui/src/lib/components/settingsState.svelte.ts create mode 100644 packages/ui/src/lib/components/tests/ButtonGroupHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/ButtonLabelHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/ButtonSettingsHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/DateHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/DialogHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/DisclosureHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/DisplayHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/EffectsHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/FeedbackHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/FieldHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/FieldNoChildrenHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/FormControlsHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/FormHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/IconChildrenHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/InputHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/LayoutHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/MenuHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/MenuItemSettingsHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/PopoverHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/PrimitivesHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/SelectHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/TableOrderHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/TextFieldHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/ThemeHarness.svelte create mode 100644 packages/ui/src/lib/components/tests/ToggleGroupHarness.svelte create mode 100644 packages/ui/src/lib/components/theme.svelte.test.ts create mode 100644 packages/ui/src/lib/components/theme.ts create mode 100644 packages/ui/src/lib/components/toggleGroup.svelte.test.ts create mode 100644 packages/ui/src/lib/index.ts create mode 100644 packages/ui/src/lib/types/index.ts create mode 100644 packages/ui/src/lib/utils/icons.ts create mode 100644 packages/ui/src/vitest-setup-client.ts create mode 100644 packages/ui/svelte.config.js create mode 100644 packages/ui/tsconfig.json create mode 100644 packages/ui/vite.config.js diff --git a/.changeset/dark-variant-system.md b/.changeset/dark-variant-system.md new file mode 100644 index 0000000..1d04916 --- /dev/null +++ b/.changeset/dark-variant-system.md @@ -0,0 +1,23 @@ +--- +'@layerstack/tailwind': patch +'@layerstack/ui': patch +'@layerstack/docs': patch +--- + +fix: Follow `prefers-color-scheme` in the `dark:` variant, not just ``. + +There were two disagreeing sources of truth for "is it dark". The theme palettes darken from +`@media (prefers-color-scheme: dark)` on `:root`, which needs no JavaScript, but the `dark:` variant +was keyed on the `dark` class, which is only ever set by JavaScript. Any moment the two disagreed — +before hydration, or permanently when no dark themes are registered — produced dark surfaces with +every `dark:` utility still in its light state. Most visibly, code blocks styled by +`dark:text-(--shiki-dark)` rendered near-black tokens on a dark background. + +The variant now mirrors the palettes: an explicit `[data-theme]` selection wins, and everything else +follows the system setting. `@layerstack/docs`' `Code` component gets the same treatment for its +hand-written `html.dark .shiki` rules. + +Also fixes `ThemeInit` on client-only apps. It injects its pre-paint script through `{@html}`, and +the browser never executes a ` + + +``` + +Pairs with [`AppLayout`](/docs/ui/AppLayout) — the menu button toggles `settings().showDrawer`, +which the layout reads. + +An array `title` renders as a [`Breadcrumb`](/docs/ui/Breadcrumb) and joins with `›` for +`document.title`, which is kept in sync unless `head={false}`. + +## Basic + +`title` accepts a string or an array — an array renders as a [`Breadcrumb`](/docs/ui/Breadcrumb). +The `actions` snippet fills the trailing edge. + +By default the bar also writes `title` to `document.title`; pass `head={false}` to leave the page +title alone. + +:example{name="basic" showCode} + +## Menu icon + +The leading button toggles [`AppLayout`](/docs/ui/AppLayout)'s drawer. + +:example{name="menu-icon"} diff --git a/docs/src/content/components/AppLayout.md b/docs/src/content/components/AppLayout.md new file mode 100644 index 0000000..9bec440 --- /dev/null +++ b/docs/src/content/components/AppLayout.md @@ -0,0 +1,29 @@ +--- +description: App shell with a fixed header and a responsive navigation drawer +category: app +related: [ui/AppBar, ui/NavItem, ui/Drawer] +--- + +## Usage + +```svelte + + + + {#snippet nav()}