aeon-ui-engine 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.changeset/README.md +23 -0
- package/.changeset/combobox-and-changesets.md +9 -0
- package/.changeset/config.json +30 -0
- package/.changeset/framework-adapters.md +12 -0
- package/.changeset/scene-3d.md +6 -0
- package/.changeset/scene-plane.md +8 -0
- package/.changeset/site-og.md +5 -0
- package/.cursor/rules/aeon-ui.mdc +22 -0
- package/ACCESSIBILITY.md +32 -0
- package/AGENTS.md +226 -0
- package/COMPONENTS.md +36 -0
- package/FRAMEWORKS.md +57 -0
- package/INTEGRATION.md +89 -0
- package/LICENSE +21 -0
- package/PHILOSOPHY.md +71 -0
- package/PUBLISHING.md +85 -0
- package/README.md +154 -0
- package/SCENE.md +113 -0
- package/STATES.md +243 -0
- package/apps/demo/index.html +31 -0
- package/apps/demo/og.config.mjs +15 -0
- package/apps/demo/package.json +41 -0
- package/apps/demo/public/favicon.svg +16 -0
- package/apps/demo/public/og.png +0 -0
- package/apps/demo/public/og.svg +35 -0
- package/apps/demo/scripts/generate-og-png.mjs +60 -0
- package/apps/demo/src/App.tsx +31 -0
- package/apps/demo/src/aeonDiagrams.ts +100 -0
- package/apps/demo/src/app.css +16 -0
- package/apps/demo/src/components/ActionCluster.tsx +20 -0
- package/apps/demo/src/components/AsyncMachineDemo.tsx +97 -0
- package/apps/demo/src/components/ButtonLifecycleDemo.tsx +63 -0
- package/apps/demo/src/components/CodeExample.tsx +7 -0
- package/apps/demo/src/components/ComboboxDemo.tsx +30 -0
- package/apps/demo/src/components/DiagramsSection.tsx +38 -0
- package/apps/demo/src/components/FieldStateDemo.tsx +51 -0
- package/apps/demo/src/components/GridMesh.tsx +8 -0
- package/apps/demo/src/components/HeroInstall.tsx +10 -0
- package/apps/demo/src/components/LandingFaq.tsx +29 -0
- package/apps/demo/src/components/LandingFooter.tsx +22 -0
- package/apps/demo/src/components/LandingHeader.tsx +60 -0
- package/apps/demo/src/components/LandingHero.tsx +55 -0
- package/apps/demo/src/components/LayersSection.tsx +51 -0
- package/apps/demo/src/components/MermaidDiagram.tsx +84 -0
- package/apps/demo/src/components/PhilosophySection.tsx +33 -0
- package/apps/demo/src/components/PlaygroundBlock.tsx +23 -0
- package/apps/demo/src/components/PlaygroundSection.tsx +204 -0
- package/apps/demo/src/components/SceneSection.tsx +157 -0
- package/apps/demo/src/components/ScrollRegionDemo.tsx +74 -0
- package/apps/demo/src/components/ThemeSwitcher.tsx +76 -0
- package/apps/demo/src/demo-layout.css +264 -0
- package/apps/demo/src/landing.css +1094 -0
- package/apps/demo/src/main.tsx +14 -0
- package/apps/demo/src/nav.ts +9 -0
- package/apps/demo/src/site.ts +347 -0
- package/apps/demo/tsconfig.json +17 -0
- package/apps/demo/vite-plugins/og-meta.ts +30 -0
- package/apps/demo/vite.config.ts +69 -0
- package/docs/API_PATTERNS.md +234 -0
- package/docs/ARCHITECTURE.md +125 -0
- package/docs/COMPONENT_CHECKLIST.md +103 -0
- package/docs/FILE_MAP.md +122 -0
- package/docs/GLOSSARY.md +125 -0
- package/docs/INDEX.md +53 -0
- package/docs/LAYOUT_COORDINATES.md +178 -0
- package/docs/MACHINES.md +166 -0
- package/docs/MIGRATION_FROM_ARK.md +295 -0
- package/docs/VITE_CONSUMER.md +114 -0
- package/package.json +25 -0
- package/packages/core/README.md +69 -0
- package/packages/core/package.json +37 -0
- package/packages/core/src/anatomy.ts +144 -0
- package/packages/core/src/attrs.ts +47 -0
- package/packages/core/src/index.ts +8 -0
- package/packages/core/src/layout.ts +176 -0
- package/packages/core/src/machine.test.ts +18 -0
- package/packages/core/src/machine.ts +15 -0
- package/packages/core/src/philosophy.ts +10 -0
- package/packages/core/src/scroll.ts +72 -0
- package/packages/core/src/theme.test.ts +14 -0
- package/packages/core/src/theme.ts +53 -0
- package/packages/core/src/types.ts +25 -0
- package/packages/core/theme-transition.css +58 -0
- package/packages/core/tsconfig.json +8 -0
- package/packages/core/vitest.config.ts +8 -0
- package/packages/geometry/README.md +7 -0
- package/packages/geometry/package.json +35 -0
- package/packages/geometry/src/index.ts +3 -0
- package/packages/geometry/src/patterns.ts +55 -0
- package/packages/geometry/src/scene-attrs.ts +11 -0
- package/packages/geometry/src/svg.ts +60 -0
- package/packages/geometry/tsconfig.json +8 -0
- package/packages/panda/README.md +66 -0
- package/packages/panda/package.json +40 -0
- package/packages/panda/panda.config.ts +229 -0
- package/packages/panda/scripts/emit-theme-runtime.ts +37 -0
- package/packages/panda/src/recipes/accordion.ts +95 -0
- package/packages/panda/src/recipes/async.ts +76 -0
- package/packages/panda/src/recipes/badge.ts +44 -0
- package/packages/panda/src/recipes/button-group.ts +33 -0
- package/packages/panda/src/recipes/button.ts +91 -0
- package/packages/panda/src/recipes/checkbox.ts +41 -0
- package/packages/panda/src/recipes/combobox.ts +121 -0
- package/packages/panda/src/recipes/dialog.ts +96 -0
- package/packages/panda/src/recipes/field-shared.ts +29 -0
- package/packages/panda/src/recipes/field.ts +72 -0
- package/packages/panda/src/recipes/floating.ts +170 -0
- package/packages/panda/src/recipes/index.ts +14 -0
- package/packages/panda/src/recipes/scroll-region.ts +55 -0
- package/packages/panda/src/recipes/select.ts +111 -0
- package/packages/panda/src/recipes/switch.ts +51 -0
- package/packages/panda/src/recipes/tabs.ts +50 -0
- package/packages/panda/src/theme/catalog-types.ts +24 -0
- package/packages/panda/src/theme/catalog.ts +73 -0
- package/packages/panda/src/theme/chrome.css +75 -0
- package/packages/panda/src/theme/global-theme-css.ts +42 -0
- package/packages/panda/src/theme/index.ts +5 -0
- package/packages/panda/src/theme/palette.ts +65 -0
- package/packages/panda/src/theme/scrollbars.css +96 -0
- package/packages/panda/src/theme/semantic-tokens.ts +17 -0
- package/packages/panda/src/theme/themes.config.ts +516 -0
- package/packages/panda/src/theme/tokens.ts +51 -0
- package/packages/panda/styled-system/css/conditions.mjs +36 -0
- package/packages/panda/styled-system/css/css.d.ts +22 -0
- package/packages/panda/styled-system/css/css.mjs +45 -0
- package/packages/panda/styled-system/css/cva.d.ts +6 -0
- package/packages/panda/styled-system/css/cva.mjs +87 -0
- package/packages/panda/styled-system/css/cx.d.ts +5 -0
- package/packages/panda/styled-system/css/cx.mjs +15 -0
- package/packages/panda/styled-system/css/index.d.ts +5 -0
- package/packages/panda/styled-system/css/index.mjs +4 -0
- package/packages/panda/styled-system/css/sva.d.ts +4 -0
- package/packages/panda/styled-system/css/sva.mjs +41 -0
- package/packages/panda/styled-system/helpers.mjs +339 -0
- package/packages/panda/styled-system/jsx/aspect-ratio.d.ts +10 -0
- package/packages/panda/styled-system/jsx/aspect-ratio.mjs +14 -0
- package/packages/panda/styled-system/jsx/bleed.d.ts +10 -0
- package/packages/panda/styled-system/jsx/bleed.mjs +14 -0
- package/packages/panda/styled-system/jsx/box.d.ts +10 -0
- package/packages/panda/styled-system/jsx/box.mjs +14 -0
- package/packages/panda/styled-system/jsx/center.d.ts +10 -0
- package/packages/panda/styled-system/jsx/center.mjs +14 -0
- package/packages/panda/styled-system/jsx/circle.d.ts +10 -0
- package/packages/panda/styled-system/jsx/circle.mjs +14 -0
- package/packages/panda/styled-system/jsx/container.d.ts +10 -0
- package/packages/panda/styled-system/jsx/container.mjs +14 -0
- package/packages/panda/styled-system/jsx/cq.d.ts +10 -0
- package/packages/panda/styled-system/jsx/cq.mjs +14 -0
- package/packages/panda/styled-system/jsx/divider.d.ts +10 -0
- package/packages/panda/styled-system/jsx/divider.mjs +14 -0
- package/packages/panda/styled-system/jsx/factory-helper.mjs +22 -0
- package/packages/panda/styled-system/jsx/factory.d.ts +3 -0
- package/packages/panda/styled-system/jsx/factory.mjs +80 -0
- package/packages/panda/styled-system/jsx/flex.d.ts +10 -0
- package/packages/panda/styled-system/jsx/flex.mjs +14 -0
- package/packages/panda/styled-system/jsx/float.d.ts +10 -0
- package/packages/panda/styled-system/jsx/float.mjs +14 -0
- package/packages/panda/styled-system/jsx/grid-item.d.ts +10 -0
- package/packages/panda/styled-system/jsx/grid-item.mjs +14 -0
- package/packages/panda/styled-system/jsx/grid.d.ts +10 -0
- package/packages/panda/styled-system/jsx/grid.mjs +14 -0
- package/packages/panda/styled-system/jsx/hstack.d.ts +10 -0
- package/packages/panda/styled-system/jsx/hstack.mjs +14 -0
- package/packages/panda/styled-system/jsx/index.d.ts +24 -0
- package/packages/panda/styled-system/jsx/index.mjs +22 -0
- package/packages/panda/styled-system/jsx/is-valid-prop.d.ts +11 -0
- package/packages/panda/styled-system/jsx/is-valid-prop.mjs +17 -0
- package/packages/panda/styled-system/jsx/link-overlay.d.ts +10 -0
- package/packages/panda/styled-system/jsx/link-overlay.mjs +14 -0
- package/packages/panda/styled-system/jsx/spacer.d.ts +10 -0
- package/packages/panda/styled-system/jsx/spacer.mjs +14 -0
- package/packages/panda/styled-system/jsx/square.d.ts +10 -0
- package/packages/panda/styled-system/jsx/square.mjs +14 -0
- package/packages/panda/styled-system/jsx/stack.d.ts +10 -0
- package/packages/panda/styled-system/jsx/stack.mjs +14 -0
- package/packages/panda/styled-system/jsx/visually-hidden.d.ts +10 -0
- package/packages/panda/styled-system/jsx/visually-hidden.mjs +14 -0
- package/packages/panda/styled-system/jsx/vstack.d.ts +10 -0
- package/packages/panda/styled-system/jsx/vstack.mjs +14 -0
- package/packages/panda/styled-system/jsx/wrap.d.ts +10 -0
- package/packages/panda/styled-system/jsx/wrap.mjs +14 -0
- package/packages/panda/styled-system/patterns/aspect-ratio.d.ts +21 -0
- package/packages/panda/styled-system/patterns/aspect-ratio.mjs +38 -0
- package/packages/panda/styled-system/patterns/bleed.d.ts +22 -0
- package/packages/panda/styled-system/patterns/bleed.mjs +24 -0
- package/packages/panda/styled-system/patterns/box.d.ts +21 -0
- package/packages/panda/styled-system/patterns/box.mjs +15 -0
- package/packages/panda/styled-system/patterns/center.d.ts +21 -0
- package/packages/panda/styled-system/patterns/center.mjs +21 -0
- package/packages/panda/styled-system/patterns/circle.d.ts +21 -0
- package/packages/panda/styled-system/patterns/circle.mjs +25 -0
- package/packages/panda/styled-system/patterns/container.d.ts +21 -0
- package/packages/panda/styled-system/patterns/container.mjs +21 -0
- package/packages/panda/styled-system/patterns/cq.d.ts +22 -0
- package/packages/panda/styled-system/patterns/cq.mjs +21 -0
- package/packages/panda/styled-system/patterns/divider.d.ts +23 -0
- package/packages/panda/styled-system/patterns/divider.mjs +25 -0
- package/packages/panda/styled-system/patterns/flex.d.ts +27 -0
- package/packages/panda/styled-system/patterns/flex.mjs +26 -0
- package/packages/panda/styled-system/patterns/float.d.ts +24 -0
- package/packages/panda/styled-system/patterns/float.mjs +52 -0
- package/packages/panda/styled-system/patterns/grid-item.d.ts +26 -0
- package/packages/panda/styled-system/patterns/grid-item.mjs +25 -0
- package/packages/panda/styled-system/patterns/grid.d.ts +25 -0
- package/packages/panda/styled-system/patterns/grid.mjs +27 -0
- package/packages/panda/styled-system/patterns/hstack.d.ts +22 -0
- package/packages/panda/styled-system/patterns/hstack.mjs +24 -0
- package/packages/panda/styled-system/patterns/index.d.ts +21 -0
- package/packages/panda/styled-system/patterns/index.mjs +20 -0
- package/packages/panda/styled-system/patterns/link-overlay.d.ts +21 -0
- package/packages/panda/styled-system/patterns/link-overlay.mjs +24 -0
- package/packages/panda/styled-system/patterns/spacer.d.ts +21 -0
- package/packages/panda/styled-system/patterns/spacer.mjs +21 -0
- package/packages/panda/styled-system/patterns/square.d.ts +21 -0
- package/packages/panda/styled-system/patterns/square.mjs +24 -0
- package/packages/panda/styled-system/patterns/stack.d.ts +24 -0
- package/packages/panda/styled-system/patterns/stack.mjs +24 -0
- package/packages/panda/styled-system/patterns/visually-hidden.d.ts +21 -0
- package/packages/panda/styled-system/patterns/visually-hidden.mjs +18 -0
- package/packages/panda/styled-system/patterns/vstack.d.ts +22 -0
- package/packages/panda/styled-system/patterns/vstack.mjs +24 -0
- package/packages/panda/styled-system/patterns/wrap.d.ts +25 -0
- package/packages/panda/styled-system/patterns/wrap.mjs +25 -0
- package/packages/panda/styled-system/recipes/aeon-accordion.d.ts +32 -0
- package/packages/panda/styled-system/recipes/aeon-accordion.mjs +48 -0
- package/packages/panda/styled-system/recipes/aeon-async.d.ts +32 -0
- package/packages/panda/styled-system/recipes/aeon-async.mjs +56 -0
- package/packages/panda/styled-system/recipes/aeon-badge.d.ts +31 -0
- package/packages/panda/styled-system/recipes/aeon-badge.mjs +32 -0
- package/packages/panda/styled-system/recipes/aeon-button-group.d.ts +39 -0
- package/packages/panda/styled-system/recipes/aeon-button-group.mjs +37 -0
- package/packages/panda/styled-system/recipes/aeon-button.d.ts +39 -0
- package/packages/panda/styled-system/recipes/aeon-button.mjs +39 -0
- package/packages/panda/styled-system/recipes/aeon-checkbox.d.ts +28 -0
- package/packages/panda/styled-system/recipes/aeon-checkbox.mjs +48 -0
- package/packages/panda/styled-system/recipes/aeon-combobox.d.ts +32 -0
- package/packages/panda/styled-system/recipes/aeon-combobox.mjs +52 -0
- package/packages/panda/styled-system/recipes/aeon-dialog.d.ts +28 -0
- package/packages/panda/styled-system/recipes/aeon-dialog.mjs +60 -0
- package/packages/panda/styled-system/recipes/aeon-field.d.ts +32 -0
- package/packages/panda/styled-system/recipes/aeon-field.mjs +52 -0
- package/packages/panda/styled-system/recipes/aeon-menu.d.ts +28 -0
- package/packages/panda/styled-system/recipes/aeon-menu.mjs +52 -0
- package/packages/panda/styled-system/recipes/aeon-popover.d.ts +28 -0
- package/packages/panda/styled-system/recipes/aeon-popover.mjs +52 -0
- package/packages/panda/styled-system/recipes/aeon-scroll.d.ts +43 -0
- package/packages/panda/styled-system/recipes/aeon-scroll.mjs +63 -0
- package/packages/panda/styled-system/recipes/aeon-select.d.ts +32 -0
- package/packages/panda/styled-system/recipes/aeon-select.mjs +56 -0
- package/packages/panda/styled-system/recipes/aeon-switch.d.ts +28 -0
- package/packages/panda/styled-system/recipes/aeon-switch.mjs +48 -0
- package/packages/panda/styled-system/recipes/aeon-tabs.d.ts +28 -0
- package/packages/panda/styled-system/recipes/aeon-tabs.mjs +48 -0
- package/packages/panda/styled-system/recipes/aeon-toast.d.ts +28 -0
- package/packages/panda/styled-system/recipes/aeon-toast.mjs +48 -0
- package/packages/panda/styled-system/recipes/aeon-tooltip.d.ts +28 -0
- package/packages/panda/styled-system/recipes/aeon-tooltip.mjs +48 -0
- package/packages/panda/styled-system/recipes/create-recipe.mjs +82 -0
- package/packages/panda/styled-system/recipes/index.d.ts +18 -0
- package/packages/panda/styled-system/recipes/index.mjs +17 -0
- package/packages/panda/styled-system/styles.css +2157 -0
- package/packages/panda/styled-system/tokens/index.d.ts +9 -0
- package/packages/panda/styled-system/tokens/index.mjs +2156 -0
- package/packages/panda/styled-system/tokens/tokens.d.ts +60 -0
- package/packages/panda/styled-system/types/composition.d.ts +164 -0
- package/packages/panda/styled-system/types/conditions.d.ts +322 -0
- package/packages/panda/styled-system/types/csstype.d.ts +21298 -0
- package/packages/panda/styled-system/types/global.d.ts +20 -0
- package/packages/panda/styled-system/types/index.d.ts +8 -0
- package/packages/panda/styled-system/types/jsx.d.ts +52 -0
- package/packages/panda/styled-system/types/parts.d.ts +8 -0
- package/packages/panda/styled-system/types/pattern.d.ts +78 -0
- package/packages/panda/styled-system/types/prop-type.d.ts +240 -0
- package/packages/panda/styled-system/types/recipe.d.ts +181 -0
- package/packages/panda/styled-system/types/selectors.d.ts +59 -0
- package/packages/panda/styled-system/types/static-css.d.ts +56 -0
- package/packages/panda/styled-system/types/style-props.d.ts +7491 -0
- package/packages/panda/styled-system/types/system-types.d.ts +193 -0
- package/packages/panda/theme-runtime.css +842 -0
- package/packages/panda/tsconfig.json +8 -0
- package/packages/primitives/README.md +54 -0
- package/packages/primitives/package.json +41 -0
- package/packages/primitives/src/__tests__/floating-surface.test.ts +29 -0
- package/packages/primitives/src/index.ts +9 -0
- package/packages/primitives/src/machines/accordion.ts +56 -0
- package/packages/primitives/src/machines/async.ts +108 -0
- package/packages/primitives/src/machines/button.ts +66 -0
- package/packages/primitives/src/machines/dialog.ts +61 -0
- package/packages/primitives/src/machines/field.ts +85 -0
- package/packages/primitives/src/machines/popover.ts +52 -0
- package/packages/primitives/src/machines/tabs.ts +46 -0
- package/packages/primitives/src/machines/toast.ts +48 -0
- package/packages/primitives/src/machines/toggle.ts +61 -0
- package/packages/primitives/tsconfig.json +8 -0
- package/packages/primitives/vitest.config.ts +8 -0
- package/packages/react/README.md +65 -0
- package/packages/react/package.json +52 -0
- package/packages/react/src/accordion/index.tsx +179 -0
- package/packages/react/src/async/actions.tsx +22 -0
- package/packages/react/src/async/context.tsx +54 -0
- package/packages/react/src/async/index.tsx +21 -0
- package/packages/react/src/async/legacy-region.tsx +38 -0
- package/packages/react/src/async/readout.tsx +34 -0
- package/packages/react/src/async/root.tsx +39 -0
- package/packages/react/src/async/track.tsx +59 -0
- package/packages/react/src/avatar/avatar.test.tsx +27 -0
- package/packages/react/src/avatar/index.tsx +122 -0
- package/packages/react/src/button/index.tsx +70 -0
- package/packages/react/src/checkbox/index.tsx +180 -0
- package/packages/react/src/combobox/index.tsx +430 -0
- package/packages/react/src/dialog/dialog.test.tsx +50 -0
- package/packages/react/src/dialog/index.tsx +275 -0
- package/packages/react/src/field/index.tsx +172 -0
- package/packages/react/src/hooks/use-aeon-machine.ts +10 -0
- package/packages/react/src/hooks/use-anchor-position.ts +33 -0
- package/packages/react/src/hooks/use-focus-trap.ts +51 -0
- package/packages/react/src/hooks/use-layout-mode.ts +22 -0
- package/packages/react/src/hooks/use-outside-click.ts +19 -0
- package/packages/react/src/hooks/use-portalled.ts +16 -0
- package/packages/react/src/hooks/use-scroll-lock.ts +13 -0
- package/packages/react/src/index.ts +18 -0
- package/packages/react/src/menu/index.tsx +195 -0
- package/packages/react/src/popover/index.tsx +191 -0
- package/packages/react/src/scroll/index.tsx +98 -0
- package/packages/react/src/scroll/use-scroll-state.ts +30 -0
- package/packages/react/src/select/index.tsx +372 -0
- package/packages/react/src/select/select.test.tsx +60 -0
- package/packages/react/src/switch/index.tsx +215 -0
- package/packages/react/src/tabs/index.tsx +140 -0
- package/packages/react/src/toast/context.tsx +28 -0
- package/packages/react/src/toast/index.tsx +20 -0
- package/packages/react/src/toast/primitives.tsx +129 -0
- package/packages/react/src/toast/provider.tsx +111 -0
- package/packages/react/src/toast/toast-item.tsx +32 -0
- package/packages/react/src/tooltip/index.tsx +191 -0
- package/packages/react/src/utils/merge-props.ts +24 -0
- package/packages/react/tsconfig.json +8 -0
- package/packages/react/vitest.config.ts +9 -0
- package/packages/react/vitest.setup.ts +5 -0
- package/packages/react-scene/README.md +11 -0
- package/packages/react-scene/package.json +47 -0
- package/packages/react-scene/scene-3d.css +37 -0
- package/packages/react-scene/scene-room.css +95 -0
- package/packages/react-scene/src/index.ts +20 -0
- package/packages/react-scene/src/procedural-grid.tsx +35 -0
- package/packages/react-scene/src/scene-layer.tsx +38 -0
- package/packages/react-scene/src/scene-plane.tsx +69 -0
- package/packages/react-scene/src/scene-room.tsx +81 -0
- package/packages/react-scene/src/scene-root.tsx +49 -0
- package/packages/react-scene/src/scene-slot.tsx +41 -0
- package/packages/react-scene/src/scene-stage.tsx +37 -0
- package/packages/react-scene/src/scene-surface.tsx +20 -0
- package/packages/react-scene/src/signal-bars.tsx +57 -0
- package/packages/react-scene/src/use-signal-visualizer.ts +103 -0
- package/packages/react-scene/tsconfig.json +8 -0
- package/packages/scene/README.md +5 -0
- package/packages/scene/package.json +32 -0
- package/packages/scene/src/index.ts +2 -0
- package/packages/scene/src/room.ts +40 -0
- package/packages/scene/src/transform.ts +60 -0
- package/packages/scene/tsconfig.json +8 -0
- package/packages/signal/README.md +9 -0
- package/packages/signal/package.json +32 -0
- package/packages/signal/src/analyser.ts +113 -0
- package/packages/signal/src/bands.ts +33 -0
- package/packages/signal/src/index.ts +3 -0
- package/packages/signal/src/motion.ts +80 -0
- package/packages/signal/tsconfig.json +8 -0
- package/packages/site/README.md +19 -0
- package/packages/site/package.json +32 -0
- package/packages/site/src/index.ts +8 -0
- package/packages/site/src/open-graph.ts +90 -0
- package/packages/site/tsconfig.json +8 -0
- package/packages/solid/README.md +30 -0
- package/packages/solid/package.json +42 -0
- package/packages/solid/src/hooks/use-aeon-machine.ts +10 -0
- package/packages/solid/src/index.ts +2 -0
- package/packages/solid/src/switch/index.tsx +191 -0
- package/packages/solid/src/utils/merge-props.ts +3 -0
- package/packages/solid/tsconfig.json +10 -0
- package/packages/surface/README.md +10 -0
- package/packages/surface/package.json +33 -0
- package/packages/surface/src/index.ts +1 -0
- package/packages/surface/src/materials.ts +14 -0
- package/packages/surface/surface.css +113 -0
- package/packages/surface/tsconfig.json +8 -0
- package/packages/svelte/README.md +45 -0
- package/packages/svelte/package.json +49 -0
- package/packages/svelte/src/Switch.svelte +86 -0
- package/packages/svelte/src/SwitchControl.svelte +45 -0
- package/packages/svelte/src/SwitchHiddenInput.svelte +12 -0
- package/packages/svelte/src/SwitchLabel.svelte +9 -0
- package/packages/svelte/src/SwitchThumb.svelte +16 -0
- package/packages/svelte/src/hooks/use-aeon-machine.ts +23 -0
- package/packages/svelte/src/index.ts +2 -0
- package/packages/svelte/src/switch-context.ts +13 -0
- package/packages/svelte/tsconfig.json +8 -0
- package/packages/ui/README.md +63 -0
- package/packages/ui/package.json +45 -0
- package/packages/ui/src/accordion.tsx +27 -0
- package/packages/ui/src/async.tsx +43 -0
- package/packages/ui/src/badge.tsx +18 -0
- package/packages/ui/src/button.tsx +38 -0
- package/packages/ui/src/checkbox.tsx +24 -0
- package/packages/ui/src/cn.ts +1 -0
- package/packages/ui/src/combobox.tsx +29 -0
- package/packages/ui/src/dialog.tsx +32 -0
- package/packages/ui/src/field.tsx +33 -0
- package/packages/ui/src/index.ts +17 -0
- package/packages/ui/src/menu.tsx +25 -0
- package/packages/ui/src/popover.tsx +22 -0
- package/packages/ui/src/scroll.tsx +51 -0
- package/packages/ui/src/select.tsx +33 -0
- package/packages/ui/src/styles.css +2 -0
- package/packages/ui/src/switch.tsx +22 -0
- package/packages/ui/src/tabs.tsx +22 -0
- package/packages/ui/src/toast.tsx +36 -0
- package/packages/ui/src/tooltip.tsx +19 -0
- package/packages/ui/tsconfig.json +12 -0
- package/packages/vue/README.md +40 -0
- package/packages/vue/package.json +42 -0
- package/packages/vue/src/hooks/use-aeon-machine.ts +10 -0
- package/packages/vue/src/index.ts +2 -0
- package/packages/vue/src/switch/index.ts +208 -0
- package/packages/vue/src/utils/part-props.ts +8 -0
- package/packages/vue/tsconfig.json +8 -0
- package/pnpm-workspace.yaml +3 -0
- package/scripts/ensure-headless-built.mjs +25 -0
- package/tsconfig.base.json +21 -0
- package/vercel.json +12 -0
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getCqStyle } from '../patterns/cq.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const Cq = /* @__PURE__ */ forwardRef(function Cq(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, ["name","type"])
|
|
9
|
+
|
|
10
|
+
const styleProps = getCqStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.div, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { FunctionComponent } from 'react'
|
|
3
|
+
import type { DividerProperties } from '../patterns/divider';
|
|
4
|
+
import type { HTMLStyledProps } from '../types/jsx';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
|
|
7
|
+
export interface DividerProps extends DividerProperties, DistributiveOmit<HTMLStyledProps<'div'>, keyof DividerProperties > {}
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
export declare const Divider: FunctionComponent<DividerProps>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getDividerStyle } from '../patterns/divider.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const Divider = /* @__PURE__ */ forwardRef(function Divider(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, ["orientation","thickness","color"])
|
|
9
|
+
|
|
10
|
+
const styleProps = getDividerStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.div, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { isCssProperty } from './is-valid-prop.mjs';
|
|
2
|
+
|
|
3
|
+
export const defaultShouldForwardProp = (prop, variantKeys) => !variantKeys.includes(prop) && !isCssProperty(prop)
|
|
4
|
+
|
|
5
|
+
export const composeShouldForwardProps = (tag, shouldForwardProp) =>
|
|
6
|
+
tag.__shouldForwardProps__ && shouldForwardProp
|
|
7
|
+
? (propName) => tag.__shouldForwardProps__(propName) && shouldForwardProp(propName)
|
|
8
|
+
: shouldForwardProp
|
|
9
|
+
|
|
10
|
+
export const composeCvaFn = (cvaA, cvaB) => {
|
|
11
|
+
if (cvaA && !cvaB) return cvaA
|
|
12
|
+
if (!cvaA && cvaB) return cvaB
|
|
13
|
+
if ((cvaA.__cva__ && cvaB.__cva__) || (cvaA.__recipe__ && cvaB.__recipe__)) return cvaA.merge(cvaB)
|
|
14
|
+
const error = new TypeError('Cannot merge cva with recipe. Please use either cva or recipe.')
|
|
15
|
+
TypeError.captureStackTrace?.(error)
|
|
16
|
+
throw error
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
export const getDisplayName = (Component) => {
|
|
20
|
+
if (typeof Component === 'string') return Component
|
|
21
|
+
return Component?.displayName || Component?.name || 'Component'
|
|
22
|
+
}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
import { createElement, forwardRef, useMemo } from 'react'
|
|
2
|
+
import { css, cx, cva } from '../css/index.mjs';
|
|
3
|
+
import { defaultShouldForwardProp, composeShouldForwardProps, composeCvaFn, getDisplayName } from './factory-helper.mjs';
|
|
4
|
+
import { splitProps, normalizeHTMLProps } from '../helpers.mjs';
|
|
5
|
+
import { isCssProperty } from './is-valid-prop.mjs';
|
|
6
|
+
|
|
7
|
+
function styledFn(Dynamic, configOrCva = {}, options = {}) {
|
|
8
|
+
const cvaFn = configOrCva.__cva__ || configOrCva.__recipe__ ? configOrCva : cva(configOrCva)
|
|
9
|
+
|
|
10
|
+
const forwardFn = options.shouldForwardProp || defaultShouldForwardProp
|
|
11
|
+
const shouldForwardProp = (prop) => forwardFn(prop, cvaFn.variantKeys)
|
|
12
|
+
|
|
13
|
+
const defaultProps = Object.assign(
|
|
14
|
+
options.dataAttr && configOrCva.__name__ ? { 'data-recipe': configOrCva.__name__ } : {},
|
|
15
|
+
options.defaultProps,
|
|
16
|
+
)
|
|
17
|
+
|
|
18
|
+
const __cvaFn__ = composeCvaFn(Dynamic.__cva__, cvaFn)
|
|
19
|
+
const __shouldForwardProps__ = composeShouldForwardProps(Dynamic, shouldForwardProp)
|
|
20
|
+
const __base__ = Dynamic.__base__ || Dynamic
|
|
21
|
+
|
|
22
|
+
const StyledComponent = /* @__PURE__ */ forwardRef(function StyledComponent(props, ref) {
|
|
23
|
+
const { as: Element = __base__, children, ...restProps } = props
|
|
24
|
+
|
|
25
|
+
const combinedProps = useMemo(() => Object.assign({}, defaultProps, restProps), [restProps])
|
|
26
|
+
|
|
27
|
+
const [htmlProps, forwardedProps, variantProps, styleProps, elementProps] = useMemo(() => {
|
|
28
|
+
return splitProps(combinedProps, normalizeHTMLProps.keys, __shouldForwardProps__, __cvaFn__.variantKeys, isCssProperty)
|
|
29
|
+
}, [combinedProps])
|
|
30
|
+
|
|
31
|
+
function recipeClass() {
|
|
32
|
+
const { css: cssStyles, ...propStyles } = styleProps
|
|
33
|
+
const compoundVariantStyles = __cvaFn__.__getCompoundVariantCss__?.(variantProps)
|
|
34
|
+
return cx(__cvaFn__(variantProps, false), css(compoundVariantStyles, propStyles, cssStyles), combinedProps.className)
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
function cvaClass() {
|
|
38
|
+
const { css: cssStyles, ...propStyles } = styleProps
|
|
39
|
+
const cvaStyles = __cvaFn__.raw(variantProps)
|
|
40
|
+
return cx(css(cvaStyles, propStyles, cssStyles), combinedProps.className)
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
const classes = configOrCva.__recipe__ ? recipeClass : cvaClass
|
|
44
|
+
|
|
45
|
+
return createElement(Element, {
|
|
46
|
+
ref,
|
|
47
|
+
...forwardedProps,
|
|
48
|
+
...elementProps,
|
|
49
|
+
...normalizeHTMLProps(htmlProps),
|
|
50
|
+
className: classes(),
|
|
51
|
+
}, combinedProps.children ?? children)
|
|
52
|
+
})
|
|
53
|
+
|
|
54
|
+
const name = getDisplayName(__base__)
|
|
55
|
+
|
|
56
|
+
StyledComponent.displayName = `styled.${name}`
|
|
57
|
+
StyledComponent.__cva__ = __cvaFn__
|
|
58
|
+
StyledComponent.__base__ = __base__
|
|
59
|
+
StyledComponent.__shouldForwardProps__ = shouldForwardProp
|
|
60
|
+
|
|
61
|
+
return StyledComponent
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
function createJsxFactory() {
|
|
65
|
+
const cache = new Map()
|
|
66
|
+
|
|
67
|
+
return new Proxy(styledFn, {
|
|
68
|
+
apply(_, __, args) {
|
|
69
|
+
return styledFn(...args)
|
|
70
|
+
},
|
|
71
|
+
get(_, el) {
|
|
72
|
+
if (!cache.has(el)) {
|
|
73
|
+
cache.set(el, styledFn(el))
|
|
74
|
+
}
|
|
75
|
+
return cache.get(el)
|
|
76
|
+
},
|
|
77
|
+
})
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
export const styled = /* @__PURE__ */ createJsxFactory()
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { FunctionComponent } from 'react'
|
|
3
|
+
import type { FlexProperties } from '../patterns/flex';
|
|
4
|
+
import type { HTMLStyledProps } from '../types/jsx';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
|
|
7
|
+
export interface FlexProps extends FlexProperties, DistributiveOmit<HTMLStyledProps<'div'>, keyof FlexProperties > {}
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
export declare const Flex: FunctionComponent<FlexProps>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getFlexStyle } from '../patterns/flex.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const Flex = /* @__PURE__ */ forwardRef(function Flex(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, ["align","justify","direction","wrap","basis","grow","shrink"])
|
|
9
|
+
|
|
10
|
+
const styleProps = getFlexStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.div, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { FunctionComponent } from 'react'
|
|
3
|
+
import type { FloatProperties } from '../patterns/float';
|
|
4
|
+
import type { HTMLStyledProps } from '../types/jsx';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
|
|
7
|
+
export interface FloatProps extends FloatProperties, DistributiveOmit<HTMLStyledProps<'div'>, keyof FloatProperties > {}
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
export declare const Float: FunctionComponent<FloatProps>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getFloatStyle } from '../patterns/float.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const Float = /* @__PURE__ */ forwardRef(function Float(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, ["offsetX","offsetY","offset","placement"])
|
|
9
|
+
|
|
10
|
+
const styleProps = getFloatStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.div, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { FunctionComponent } from 'react'
|
|
3
|
+
import type { GridItemProperties } from '../patterns/grid-item';
|
|
4
|
+
import type { HTMLStyledProps } from '../types/jsx';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
|
|
7
|
+
export interface GridItemProps extends GridItemProperties, DistributiveOmit<HTMLStyledProps<'div'>, keyof GridItemProperties > {}
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
export declare const GridItem: FunctionComponent<GridItemProps>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getGridItemStyle } from '../patterns/grid-item.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const GridItem = /* @__PURE__ */ forwardRef(function GridItem(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, ["colSpan","rowSpan","colStart","rowStart","colEnd","rowEnd"])
|
|
9
|
+
|
|
10
|
+
const styleProps = getGridItemStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.div, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { FunctionComponent } from 'react'
|
|
3
|
+
import type { GridProperties } from '../patterns/grid';
|
|
4
|
+
import type { HTMLStyledProps } from '../types/jsx';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
|
|
7
|
+
export interface GridProps extends GridProperties, DistributiveOmit<HTMLStyledProps<'div'>, keyof GridProperties > {}
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
export declare const Grid: FunctionComponent<GridProps>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getGridStyle } from '../patterns/grid.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const Grid = /* @__PURE__ */ forwardRef(function Grid(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, ["gap","columnGap","rowGap","columns","minChildWidth"])
|
|
9
|
+
|
|
10
|
+
const styleProps = getGridStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.div, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { FunctionComponent } from 'react'
|
|
3
|
+
import type { HstackProperties } from '../patterns/hstack';
|
|
4
|
+
import type { HTMLStyledProps } from '../types/jsx';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
|
|
7
|
+
export interface HstackProps extends HstackProperties, DistributiveOmit<HTMLStyledProps<'div'>, keyof HstackProperties > {}
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
export declare const HStack: FunctionComponent<HstackProps>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getHstackStyle } from '../patterns/hstack.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const HStack = /* @__PURE__ */ forwardRef(function HStack(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, ["justify","gap"])
|
|
9
|
+
|
|
10
|
+
const styleProps = getHstackStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.div, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
export * from './factory';
|
|
3
|
+
export * from './is-valid-prop';
|
|
4
|
+
export * from './box';
|
|
5
|
+
export * from './flex';
|
|
6
|
+
export * from './stack';
|
|
7
|
+
export * from './vstack';
|
|
8
|
+
export * from './hstack';
|
|
9
|
+
export * from './spacer';
|
|
10
|
+
export * from './square';
|
|
11
|
+
export * from './circle';
|
|
12
|
+
export * from './center';
|
|
13
|
+
export * from './link-overlay';
|
|
14
|
+
export * from './aspect-ratio';
|
|
15
|
+
export * from './grid';
|
|
16
|
+
export * from './grid-item';
|
|
17
|
+
export * from './wrap';
|
|
18
|
+
export * from './container';
|
|
19
|
+
export * from './divider';
|
|
20
|
+
export * from './float';
|
|
21
|
+
export * from './bleed';
|
|
22
|
+
export * from './visually-hidden';
|
|
23
|
+
export * from './cq';
|
|
24
|
+
export type { HTMLStyledProps, StyledComponent } from '../types/jsx';
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
export * from './factory.mjs';
|
|
2
|
+
export * from './is-valid-prop.mjs';
|
|
3
|
+
export * from './box.mjs';
|
|
4
|
+
export * from './flex.mjs';
|
|
5
|
+
export * from './stack.mjs';
|
|
6
|
+
export * from './vstack.mjs';
|
|
7
|
+
export * from './hstack.mjs';
|
|
8
|
+
export * from './spacer.mjs';
|
|
9
|
+
export * from './square.mjs';
|
|
10
|
+
export * from './circle.mjs';
|
|
11
|
+
export * from './center.mjs';
|
|
12
|
+
export * from './link-overlay.mjs';
|
|
13
|
+
export * from './aspect-ratio.mjs';
|
|
14
|
+
export * from './grid.mjs';
|
|
15
|
+
export * from './grid-item.mjs';
|
|
16
|
+
export * from './wrap.mjs';
|
|
17
|
+
export * from './container.mjs';
|
|
18
|
+
export * from './divider.mjs';
|
|
19
|
+
export * from './float.mjs';
|
|
20
|
+
export * from './bleed.mjs';
|
|
21
|
+
export * from './visually-hidden.mjs';
|
|
22
|
+
export * from './cq.mjs';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { DistributiveOmit, HTMLPandaProps, JsxStyleProps, Pretty } from '../types';
|
|
3
|
+
|
|
4
|
+
declare const isCssProperty: (value: string) => boolean;
|
|
5
|
+
|
|
6
|
+
type CssPropKey = keyof JsxStyleProps
|
|
7
|
+
type OmittedCssProps<T> = Pretty<DistributiveOmit<T, CssPropKey>>
|
|
8
|
+
|
|
9
|
+
declare const splitCssProps: <T>(props: T) => [JsxStyleProps, OmittedCssProps<T>]
|
|
10
|
+
|
|
11
|
+
export { isCssProperty, splitCssProps };
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { splitProps } from '../helpers.mjs';
|
|
2
|
+
import { memo } from '../helpers.mjs';
|
|
3
|
+
// src/index.ts
|
|
4
|
+
var userGeneratedStr = "css,pos,insetX,insetY,insetEnd,end,insetStart,start,flexDir,p,pl,pr,pt,pb,py,paddingY,paddingX,px,pe,paddingEnd,ps,paddingStart,ml,mr,mt,mb,m,my,marginY,mx,marginX,me,marginEnd,ms,marginStart,ringWidth,ringColor,ring,ringOffset,w,minW,maxW,h,minH,maxH,textShadowColor,bgPosition,bgPositionX,bgPositionY,bgAttachment,bgClip,bg,bgColor,bgOrigin,bgImage,bgRepeat,bgBlendMode,bgSize,bgGradient,rounded,roundedTopLeft,roundedTopRight,roundedBottomRight,roundedBottomLeft,roundedTop,roundedRight,roundedBottom,roundedLeft,roundedStartStart,roundedStartEnd,roundedStart,roundedEndStart,roundedEndEnd,roundedEnd,borderX,borderXWidth,borderXColor,borderY,borderYWidth,borderYColor,borderStart,borderStartWidth,borderStartColor,borderEnd,borderEndWidth,borderEndColor,shadow,shadowColor,x,y,z,scrollMarginY,scrollMarginX,scrollPaddingY,scrollPaddingX,aspectRatio,boxDecorationBreak,zIndex,boxSizing,objectPosition,objectFit,overscrollBehavior,overscrollBehaviorX,overscrollBehaviorY,position,top,left,inset,insetInline,insetBlock,insetBlockEnd,insetBlockStart,insetInlineEnd,insetInlineStart,right,bottom,float,visibility,display,hideFrom,hideBelow,flexBasis,flex,flexDirection,flexGrow,flexShrink,gridTemplateColumns,gridTemplateRows,gridColumn,gridRow,gridColumnStart,gridColumnEnd,gridAutoFlow,gridAutoColumns,gridAutoRows,gap,gridGap,gridRowGap,gridColumnGap,rowGap,columnGap,justifyContent,alignContent,alignItems,alignSelf,padding,paddingLeft,paddingRight,paddingTop,paddingBottom,paddingBlock,paddingBlockEnd,paddingBlockStart,paddingInline,paddingInlineEnd,paddingInlineStart,marginLeft,marginRight,marginTop,marginBottom,margin,marginBlock,marginBlockEnd,marginBlockStart,marginInline,marginInlineEnd,marginInlineStart,spaceX,spaceY,outlineWidth,outlineColor,outline,outlineOffset,divideX,divideY,divideColor,divideStyle,width,inlineSize,minWidth,minInlineSize,maxWidth,maxInlineSize,height,blockSize,minHeight,minBlockSize,maxHeight,maxBlockSize,color,fontFamily,fontSize,fontSizeAdjust,fontPalette,fontKerning,fontFeatureSettings,fontWeight,fontSmoothing,fontVariant,fontVariantAlternates,fontVariantCaps,fontVariationSettings,fontVariantNumeric,letterSpacing,lineHeight,textAlign,textDecoration,textDecorationColor,textEmphasisColor,textDecorationStyle,textDecorationThickness,textUnderlineOffset,textTransform,textIndent,textShadow,textOverflow,verticalAlign,wordBreak,textWrap,truncate,lineClamp,listStyleType,listStylePosition,listStyleImage,listStyle,backgroundPosition,backgroundPositionX,backgroundPositionY,backgroundAttachment,backgroundClip,background,backgroundColor,backgroundOrigin,backgroundImage,backgroundRepeat,backgroundBlendMode,backgroundSize,backgroundGradient,textGradient,gradientFromPosition,gradientToPosition,gradientFrom,gradientTo,gradientVia,gradientViaPosition,borderRadius,borderTopLeftRadius,borderTopRightRadius,borderBottomRightRadius,borderBottomLeftRadius,borderTopRadius,borderRightRadius,borderBottomRadius,borderLeftRadius,borderStartStartRadius,borderStartEndRadius,borderStartRadius,borderEndStartRadius,borderEndEndRadius,borderEndRadius,border,borderWidth,borderTopWidth,borderLeftWidth,borderRightWidth,borderBottomWidth,borderBlockStartWidth,borderBlockEndWidth,borderColor,borderInline,borderInlineWidth,borderInlineColor,borderBlock,borderBlockWidth,borderBlockColor,borderLeft,borderLeftColor,borderInlineStart,borderInlineStartWidth,borderInlineStartColor,borderRight,borderRightColor,borderInlineEnd,borderInlineEndWidth,borderInlineEndColor,borderTop,borderTopColor,borderBottom,borderBottomColor,borderBlockEnd,borderBlockEndColor,borderBlockStart,borderBlockStartColor,opacity,boxShadow,boxShadowColor,mixBlendMode,filter,brightness,contrast,grayscale,hueRotate,invert,saturate,sepia,dropShadow,blur,backdropFilter,backdropBlur,backdropBrightness,backdropContrast,backdropGrayscale,backdropHueRotate,backdropInvert,backdropOpacity,backdropSaturate,backdropSepia,borderCollapse,borderSpacing,borderSpacingX,borderSpacingY,tableLayout,transitionTimingFunction,transitionDelay,transitionDuration,transitionProperty,transition,animation,animationName,animationTimingFunction,animationDuration,animationDelay,animationPlayState,animationComposition,animationFillMode,animationDirection,animationIterationCount,animationRange,animationState,animationRangeStart,animationRangeEnd,animationTimeline,transformOrigin,transformBox,transformStyle,transform,rotate,rotateX,rotateY,rotateZ,scale,scaleX,scaleY,translate,translateX,translateY,translateZ,accentColor,caretColor,scrollBehavior,scrollbar,scrollbarColor,scrollbarGutter,scrollbarWidth,scrollMargin,scrollMarginLeft,scrollMarginRight,scrollMarginTop,scrollMarginBottom,scrollMarginBlock,scrollMarginBlockEnd,scrollMarginBlockStart,scrollMarginInline,scrollMarginInlineEnd,scrollMarginInlineStart,scrollPadding,scrollPaddingBlock,scrollPaddingBlockStart,scrollPaddingBlockEnd,scrollPaddingInline,scrollPaddingInlineEnd,scrollPaddingInlineStart,scrollPaddingLeft,scrollPaddingRight,scrollPaddingTop,scrollPaddingBottom,scrollSnapAlign,scrollSnapStop,scrollSnapType,scrollSnapStrictness,scrollSnapMargin,scrollSnapMarginTop,scrollSnapMarginBottom,scrollSnapMarginLeft,scrollSnapMarginRight,scrollSnapCoordinate,scrollSnapDestination,scrollSnapPointsX,scrollSnapPointsY,scrollSnapTypeX,scrollSnapTypeY,scrollTimeline,scrollTimelineAxis,scrollTimelineName,touchAction,userSelect,overflow,overflowWrap,overflowX,overflowY,overflowAnchor,overflowBlock,overflowInline,overflowClipBox,overflowClipMargin,overscrollBehaviorBlock,overscrollBehaviorInline,fill,stroke,strokeWidth,strokeDasharray,strokeDashoffset,strokeLinecap,strokeLinejoin,strokeMiterlimit,strokeOpacity,srOnly,debug,appearance,backfaceVisibility,clipPath,hyphens,mask,maskImage,maskSize,textSizeAdjust,container,containerName,containerType,cursor,colorPalette,_hover,_focus,_focusWithin,_focusVisible,_disabled,_active,_visited,_target,_readOnly,_readWrite,_empty,_checked,_enabled,_expanded,_highlighted,_complete,_incomplete,_dragging,_before,_after,_firstLetter,_firstLine,_marker,_selection,_file,_backdrop,_first,_last,_only,_even,_odd,_firstOfType,_lastOfType,_onlyOfType,_peerFocus,_peerHover,_peerActive,_peerFocusWithin,_peerFocusVisible,_peerDisabled,_peerChecked,_peerInvalid,_peerExpanded,_peerPlaceholderShown,_groupFocus,_groupHover,_groupActive,_groupFocusWithin,_groupFocusVisible,_groupDisabled,_groupChecked,_groupExpanded,_groupInvalid,_indeterminate,_required,_valid,_invalid,_autofill,_inRange,_outOfRange,_placeholder,_placeholderShown,_pressed,_selected,_grabbed,_underValue,_overValue,_atValue,_default,_optional,_open,_closed,_fullscreen,_loading,_hidden,_current,_currentPage,_currentStep,_today,_unavailable,_rangeStart,_rangeEnd,_now,_topmost,_motionReduce,_motionSafe,_print,_landscape,_portrait,_dark,_light,_osDark,_osLight,_highContrast,_lessContrast,_moreContrast,_ltr,_rtl,_scrollbar,_scrollbarThumb,_scrollbarTrack,_horizontal,_vertical,_icon,_starting,_aeonSelected,_aeonChecked,_aeonOpen,_aeonClosed,_aeonPending,_aeonSuccess,_aeonFailure,_aeonInvalid,sm,smOnly,smDown,md,mdOnly,mdDown,lg,lgOnly,lgDown,xl,xlOnly,xlDown,2xl,2xlOnly,2xlDown,smToMd,smToLg,smToXl,smTo2xl,mdToLg,mdToXl,mdTo2xl,lgToXl,lgTo2xl,xlTo2xl,@/xs,@/sm,@/md,@/lg,@/xl,@/2xl,@/3xl,@/4xl,@/5xl,@/6xl,@/7xl,@/8xl,textStyle"
|
|
5
|
+
var userGenerated = userGeneratedStr.split(",");
|
|
6
|
+
var cssPropertiesStr = "WebkitAppearance,WebkitBorderBefore,WebkitBorderBeforeColor,WebkitBorderBeforeStyle,WebkitBorderBeforeWidth,WebkitBoxReflect,WebkitLineClamp,WebkitMask,WebkitMaskAttachment,WebkitMaskClip,WebkitMaskComposite,WebkitMaskImage,WebkitMaskOrigin,WebkitMaskPosition,WebkitMaskPositionX,WebkitMaskPositionY,WebkitMaskRepeat,WebkitMaskRepeatX,WebkitMaskRepeatY,WebkitMaskSize,WebkitOverflowScrolling,WebkitTapHighlightColor,WebkitTextFillColor,WebkitTextStroke,WebkitTextStrokeColor,WebkitTextStrokeWidth,WebkitTouchCallout,WebkitUserModify,WebkitUserSelect,accentColor,alignContent,alignItems,alignSelf,alignTracks,all,anchorName,anchorScope,animation,animationComposition,animationDelay,animationDirection,animationDuration,animationFillMode,animationIterationCount,animationName,animationPlayState,animationRange,animationRangeEnd,animationRangeStart,animationTimeline,animationTimingFunction,appearance,aspectRatio,backdropFilter,backfaceVisibility,background,backgroundAttachment,backgroundBlendMode,backgroundClip,backgroundColor,backgroundImage,backgroundOrigin,backgroundPosition,backgroundPositionX,backgroundPositionY,backgroundRepeat,backgroundSize,blockSize,border,borderBlock,borderBlockColor,borderBlockEnd,borderBlockEndColor,borderBlockEndStyle,borderBlockEndWidth,borderBlockStart,borderBlockStartColor,borderBlockStartStyle,borderBlockStartWidth,borderBlockStyle,borderBlockWidth,borderBottom,borderBottomColor,borderBottomLeftRadius,borderBottomRightRadius,borderBottomStyle,borderBottomWidth,borderCollapse,borderColor,borderEndEndRadius,borderEndStartRadius,borderImage,borderImageOutset,borderImageRepeat,borderImageSlice,borderImageSource,borderImageWidth,borderInline,borderInlineColor,borderInlineEnd,borderInlineEndColor,borderInlineEndStyle,borderInlineEndWidth,borderInlineStart,borderInlineStartColor,borderInlineStartStyle,borderInlineStartWidth,borderInlineStyle,borderInlineWidth,borderLeft,borderLeftColor,borderLeftStyle,borderLeftWidth,borderRadius,borderRight,borderRightColor,borderRightStyle,borderRightWidth,borderSpacing,borderStartEndRadius,borderStartStartRadius,borderStyle,borderTop,borderTopColor,borderTopLeftRadius,borderTopRightRadius,borderTopStyle,borderTopWidth,borderWidth,bottom,boxAlign,boxDecorationBreak,boxDirection,boxFlex,boxFlexGroup,boxLines,boxOrdinalGroup,boxOrient,boxPack,boxShadow,boxSizing,breakAfter,breakBefore,breakInside,captionSide,caret,caretColor,caretShape,clear,clip,clipPath,clipRule,color,colorInterpolationFilters,colorScheme,columnCount,columnFill,columnGap,columnRule,columnRuleColor,columnRuleStyle,columnRuleWidth,columnSpan,columnWidth,columns,contain,containIntrinsicBlockSize,containIntrinsicHeight,containIntrinsicInlineSize,containIntrinsicSize,containIntrinsicWidth,container,containerName,containerType,content,contentVisibility,counterIncrement,counterReset,counterSet,cursor,cx,cy,d,direction,display,dominantBaseline,emptyCells,fieldSizing,fill,fillOpacity,fillRule,filter,flex,flexBasis,flexDirection,flexFlow,flexGrow,flexShrink,flexWrap,float,floodColor,floodOpacity,font,fontFamily,fontFeatureSettings,fontKerning,fontLanguageOverride,fontOpticalSizing,fontPalette,fontSize,fontSizeAdjust,fontSmooth,fontStretch,fontStyle,fontSynthesis,fontSynthesisPosition,fontSynthesisSmallCaps,fontSynthesisStyle,fontSynthesisWeight,fontVariant,fontVariantAlternates,fontVariantCaps,fontVariantEastAsian,fontVariantEmoji,fontVariantLigatures,fontVariantNumeric,fontVariantPosition,fontVariationSettings,fontWeight,forcedColorAdjust,gap,grid,gridArea,gridAutoColumns,gridAutoFlow,gridAutoRows,gridColumn,gridColumnEnd,gridColumnGap,gridColumnStart,gridGap,gridRow,gridRowEnd,gridRowGap,gridRowStart,gridTemplate,gridTemplateAreas,gridTemplateColumns,gridTemplateRows,hangingPunctuation,height,hyphenateCharacter,hyphenateLimitChars,hyphens,imageOrientation,imageRendering,imageResolution,imeMode,initialLetter,initialLetterAlign,inlineSize,inset,insetBlock,insetBlockEnd,insetBlockStart,insetInline,insetInlineEnd,insetInlineStart,interpolateSize,isolation,justifyContent,justifyItems,justifySelf,justifyTracks,left,letterSpacing,lightingColor,lineBreak,lineClamp,lineHeight,lineHeightStep,listStyle,listStyleImage,listStylePosition,listStyleType,margin,marginBlock,marginBlockEnd,marginBlockStart,marginBottom,marginInline,marginInlineEnd,marginInlineStart,marginLeft,marginRight,marginTop,marginTrim,marker,markerEnd,markerMid,markerStart,mask,maskBorder,maskBorderMode,maskBorderOutset,maskBorderRepeat,maskBorderSlice,maskBorderSource,maskBorderWidth,maskClip,maskComposite,maskImage,maskMode,maskOrigin,maskPosition,maskRepeat,maskSize,maskType,masonryAutoFlow,mathDepth,mathShift,mathStyle,maxBlockSize,maxHeight,maxInlineSize,maxLines,maxWidth,minBlockSize,minHeight,minInlineSize,minWidth,mixBlendMode,objectFit,objectPosition,offset,offsetAnchor,offsetDistance,offsetPath,offsetPosition,offsetRotate,opacity,order,orphans,outline,outlineColor,outlineOffset,outlineStyle,outlineWidth,overflow,overflowAnchor,overflowBlock,overflowClipBox,overflowClipMargin,overflowInline,overflowWrap,overflowX,overflowY,overlay,overscrollBehavior,overscrollBehaviorBlock,overscrollBehaviorInline,overscrollBehaviorX,overscrollBehaviorY,padding,paddingBlock,paddingBlockEnd,paddingBlockStart,paddingBottom,paddingInline,paddingInlineEnd,paddingInlineStart,paddingLeft,paddingRight,paddingTop,page,pageBreakAfter,pageBreakBefore,pageBreakInside,paintOrder,perspective,perspectiveOrigin,placeContent,placeItems,placeSelf,pointerEvents,position,positionAnchor,positionArea,positionTry,positionTryFallbacks,positionTryOrder,positionVisibility,printColorAdjust,quotes,r,resize,right,rotate,rowGap,rubyAlign,rubyMerge,rubyPosition,rx,ry,scale,scrollBehavior,scrollMargin,scrollMarginBlock,scrollMarginBlockEnd,scrollMarginBlockStart,scrollMarginBottom,scrollMarginInline,scrollMarginInlineEnd,scrollMarginInlineStart,scrollMarginLeft,scrollMarginRight,scrollMarginTop,scrollPadding,scrollPaddingBlock,scrollPaddingBlockEnd,scrollPaddingBlockStart,scrollPaddingBottom,scrollPaddingInline,scrollPaddingInlineEnd,scrollPaddingInlineStart,scrollPaddingLeft,scrollPaddingRight,scrollPaddingTop,scrollSnapAlign,scrollSnapCoordinate,scrollSnapDestination,scrollSnapPointsX,scrollSnapPointsY,scrollSnapStop,scrollSnapType,scrollSnapTypeX,scrollSnapTypeY,scrollTimeline,scrollTimelineAxis,scrollTimelineName,scrollbarColor,scrollbarGutter,scrollbarWidth,shapeImageThreshold,shapeMargin,shapeOutside,shapeRendering,stopColor,stopOpacity,stroke,strokeDasharray,strokeDashoffset,strokeLinecap,strokeLinejoin,strokeMiterlimit,strokeOpacity,strokeWidth,tabSize,tableLayout,textAlign,textAlignLast,textAnchor,textBox,textBoxEdge,textBoxTrim,textCombineUpright,textDecoration,textDecorationColor,textDecorationLine,textDecorationSkip,textDecorationSkipInk,textDecorationStyle,textDecorationThickness,textEmphasis,textEmphasisColor,textEmphasisPosition,textEmphasisStyle,textIndent,textJustify,textOrientation,textOverflow,textRendering,textShadow,textSizeAdjust,textSpacingTrim,textTransform,textUnderlineOffset,textUnderlinePosition,textWrap,textWrapMode,textWrapStyle,timelineScope,top,touchAction,transform,transformBox,transformOrigin,transformStyle,transition,transitionBehavior,transitionDelay,transitionDuration,transitionProperty,transitionTimingFunction,translate,unicodeBidi,userSelect,vectorEffect,verticalAlign,viewTimeline,viewTimelineAxis,viewTimelineInset,viewTimelineName,viewTransitionName,visibility,whiteSpace,whiteSpaceCollapse,widows,width,willChange,wordBreak,wordSpacing,wordWrap,writingMode,x,y,zIndex,zoom,alignmentBaseline,baselineShift,colorInterpolation,colorRendering,glyphOrientationVertical";
|
|
7
|
+
var allCssProperties = cssPropertiesStr.split(",").concat(userGenerated);
|
|
8
|
+
var properties = new Map(allCssProperties.map((prop) => [prop, true]));
|
|
9
|
+
var cssPropertySelectorRegex = /&|@/;
|
|
10
|
+
var isCssProperty = /* @__PURE__ */ memo((prop) => {
|
|
11
|
+
return properties.has(prop) || prop.startsWith("--") || cssPropertySelectorRegex.test(prop);
|
|
12
|
+
});
|
|
13
|
+
export {
|
|
14
|
+
allCssProperties,
|
|
15
|
+
isCssProperty
|
|
16
|
+
};
|
|
17
|
+
export const splitCssProps = (props) => splitProps(props, isCssProperty)
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { FunctionComponent } from 'react'
|
|
3
|
+
import type { LinkOverlayProperties } from '../patterns/link-overlay';
|
|
4
|
+
import type { HTMLStyledProps } from '../types/jsx';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
|
|
7
|
+
export interface LinkOverlayProps extends LinkOverlayProperties, DistributiveOmit<HTMLStyledProps<'a'>, keyof LinkOverlayProperties > {}
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
export declare const LinkOverlay: FunctionComponent<LinkOverlayProps>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getLinkOverlayStyle } from '../patterns/link-overlay.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const LinkOverlay = /* @__PURE__ */ forwardRef(function LinkOverlay(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, [])
|
|
9
|
+
|
|
10
|
+
const styleProps = getLinkOverlayStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.a, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { FunctionComponent } from 'react'
|
|
3
|
+
import type { SpacerProperties } from '../patterns/spacer';
|
|
4
|
+
import type { HTMLStyledProps } from '../types/jsx';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
|
|
7
|
+
export interface SpacerProps extends SpacerProperties, DistributiveOmit<HTMLStyledProps<'div'>, keyof SpacerProperties > {}
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
export declare const Spacer: FunctionComponent<SpacerProps>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getSpacerStyle } from '../patterns/spacer.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const Spacer = /* @__PURE__ */ forwardRef(function Spacer(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, ["size"])
|
|
9
|
+
|
|
10
|
+
const styleProps = getSpacerStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.div, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { FunctionComponent } from 'react'
|
|
3
|
+
import type { SquareProperties } from '../patterns/square';
|
|
4
|
+
import type { HTMLStyledProps } from '../types/jsx';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
|
|
7
|
+
export interface SquareProps extends SquareProperties, DistributiveOmit<HTMLStyledProps<'div'>, keyof SquareProperties > {}
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
export declare const Square: FunctionComponent<SquareProps>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getSquareStyle } from '../patterns/square.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const Square = /* @__PURE__ */ forwardRef(function Square(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, ["size"])
|
|
9
|
+
|
|
10
|
+
const styleProps = getSquareStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.div, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { FunctionComponent } from 'react'
|
|
3
|
+
import type { StackProperties } from '../patterns/stack';
|
|
4
|
+
import type { HTMLStyledProps } from '../types/jsx';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
|
|
7
|
+
export interface StackProps extends StackProperties, DistributiveOmit<HTMLStyledProps<'div'>, keyof StackProperties > {}
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
export declare const Stack: FunctionComponent<StackProps>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getStackStyle } from '../patterns/stack.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const Stack = /* @__PURE__ */ forwardRef(function Stack(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, ["align","justify","direction","gap"])
|
|
9
|
+
|
|
10
|
+
const styleProps = getStackStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.div, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { FunctionComponent } from 'react'
|
|
3
|
+
import type { VisuallyHiddenProperties } from '../patterns/visually-hidden';
|
|
4
|
+
import type { HTMLStyledProps } from '../types/jsx';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
|
|
7
|
+
export interface VisuallyHiddenProps extends VisuallyHiddenProperties, DistributiveOmit<HTMLStyledProps<'div'>, keyof VisuallyHiddenProperties > {}
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
export declare const VisuallyHidden: FunctionComponent<VisuallyHiddenProps>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getVisuallyHiddenStyle } from '../patterns/visually-hidden.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const VisuallyHidden = /* @__PURE__ */ forwardRef(function VisuallyHidden(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, [])
|
|
9
|
+
|
|
10
|
+
const styleProps = getVisuallyHiddenStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.div, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { FunctionComponent } from 'react'
|
|
3
|
+
import type { VstackProperties } from '../patterns/vstack';
|
|
4
|
+
import type { HTMLStyledProps } from '../types/jsx';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
|
|
7
|
+
export interface VstackProps extends VstackProperties, DistributiveOmit<HTMLStyledProps<'div'>, keyof VstackProperties > {}
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
export declare const VStack: FunctionComponent<VstackProps>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getVstackStyle } from '../patterns/vstack.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const VStack = /* @__PURE__ */ forwardRef(function VStack(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, ["justify","gap"])
|
|
9
|
+
|
|
10
|
+
const styleProps = getVstackStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.div, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { FunctionComponent } from 'react'
|
|
3
|
+
import type { WrapProperties } from '../patterns/wrap';
|
|
4
|
+
import type { HTMLStyledProps } from '../types/jsx';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
|
|
7
|
+
export interface WrapProps extends WrapProperties, DistributiveOmit<HTMLStyledProps<'div'>, keyof WrapProperties > {}
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
export declare const Wrap: FunctionComponent<WrapProps>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { createElement, forwardRef } from 'react'
|
|
2
|
+
|
|
3
|
+
import { splitProps } from '../helpers.mjs';
|
|
4
|
+
import { getWrapStyle } from '../patterns/wrap.mjs';
|
|
5
|
+
import { styled } from './factory.mjs';
|
|
6
|
+
|
|
7
|
+
export const Wrap = /* @__PURE__ */ forwardRef(function Wrap(props, ref) {
|
|
8
|
+
const [patternProps, restProps] = splitProps(props, ["gap","rowGap","columnGap","align","justify"])
|
|
9
|
+
|
|
10
|
+
const styleProps = getWrapStyle(patternProps)
|
|
11
|
+
const mergedProps = { ref, ...styleProps, ...restProps }
|
|
12
|
+
|
|
13
|
+
return createElement(styled.div, mergedProps)
|
|
14
|
+
})
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { SystemStyleObject, ConditionalValue } from '../types/index';
|
|
3
|
+
import type { Properties } from '../types/csstype';
|
|
4
|
+
import type { SystemProperties } from '../types/style-props';
|
|
5
|
+
import type { DistributiveOmit } from '../types/system-types';
|
|
6
|
+
import type { Tokens } from '../tokens/index';
|
|
7
|
+
|
|
8
|
+
export interface AspectRatioProperties {
|
|
9
|
+
ratio?: ConditionalValue<number>
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
interface AspectRatioStyles extends AspectRatioProperties, DistributiveOmit<SystemStyleObject, keyof AspectRatioProperties | 'aspectRatio'> {}
|
|
14
|
+
|
|
15
|
+
interface AspectRatioPatternFn {
|
|
16
|
+
(styles?: AspectRatioStyles): string
|
|
17
|
+
raw: (styles?: AspectRatioStyles) => SystemStyleObject
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
export declare const aspectRatio: AspectRatioPatternFn;
|