From 056df5b5e77b8c75ef71afe1eebd09f4dce22561 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Christian=20Schr=C3=B6ter?= Date: Wed, 27 Nov 2024 20:00:17 +0100 Subject: [PATCH] feat(svelte): add avatar (#3084) --- .prettierrc | 2 + bun.lockb | Bin 887860 -> 908148 bytes .../avatar/examples/root-provider.tsx | 6 +- packages/svelte/.gitignore | 11 -- packages/svelte/.npmrc | 1 - packages/svelte/.storybook/main.css | 36 +++++ packages/svelte/.storybook/main.ts | 21 +++ packages/svelte/.storybook/preview.ts | 15 ++ .../svelte/.storybook/styles/accordion.css | 53 +++++++ packages/svelte/.storybook/styles/avatar.css | 28 ++++ .../svelte/.storybook/styles/carousel.css | 5 + .../svelte/.storybook/styles/checkbox.css | 36 +++++ .../svelte/.storybook/styles/collapsible.css | 38 ++++++ .../svelte/.storybook/styles/color-picker.css | 81 +++++++++++ .../svelte/.storybook/styles/combobox.css | 47 +++++++ .../svelte/.storybook/styles/date-picker.css | 78 +++++++++++ packages/svelte/.storybook/styles/dialog.css | 102 ++++++++++++++ packages/svelte/.storybook/styles/field.css | 7 + .../svelte/.storybook/styles/file-upload.css | 60 ++++++++ .../svelte/.storybook/styles/hover-card.css | 45 ++++++ packages/svelte/.storybook/styles/menu.css | 57 ++++++++ .../svelte/.storybook/styles/number-input.css | 5 + .../svelte/.storybook/styles/pagination.css | 9 ++ .../svelte/.storybook/styles/pin-input.css | 18 +++ packages/svelte/.storybook/styles/popover.css | 56 ++++++++ .../svelte/.storybook/styles/presence.css | 32 +++++ .../svelte/.storybook/styles/progress.css | 105 ++++++++++++++ packages/svelte/.storybook/styles/qr-code.css | 26 ++++ .../svelte/.storybook/styles/radio-group.css | 73 ++++++++++ .../.storybook/styles/segment-group.css | 82 +++++++++++ packages/svelte/.storybook/styles/select.css | 59 ++++++++ .../.storybook/styles/signature-pad.css | 36 +++++ packages/svelte/.storybook/styles/slider.css | 129 ++++++++++++++++++ .../svelte/.storybook/styles/splitter.css | 27 ++++ packages/svelte/.storybook/styles/steps.css | 119 ++++++++++++++++ packages/svelte/.storybook/styles/switch.css | 84 ++++++++++++ packages/svelte/.storybook/styles/tabs.css | 123 +++++++++++++++++ .../svelte/.storybook/styles/tags-input.css | 14 ++ .../svelte/.storybook/styles/time-picker.css | 61 +++++++++ packages/svelte/.storybook/styles/timer.css | 26 ++++ packages/svelte/.storybook/styles/toast.css | 122 +++++++++++++++++ .../svelte/.storybook/styles/toggle-group.css | 3 + packages/svelte/.storybook/styles/tooltip.css | 38 ++++++ .../svelte/.storybook/styles/tree-view.css | 98 +++++++++++++ packages/svelte/CHANGELOG.md | 11 ++ packages/svelte/package.json | 78 ++++++++--- packages/svelte/src/index.test.ts | 7 - .../components/avatar/avatar-context.svelte | 17 +++ .../components/avatar/avatar-fallback.svelte | 26 ++-- .../lib/components/avatar/avatar-image.svelte | 24 ++-- .../avatar/avatar-root-provider.svelte | 26 ++++ .../lib/components/avatar/avatar-root.svelte | 35 +++-- .../lib/components/avatar/avatar.anatomy.ts | 1 + .../lib/components/avatar/avatar.stories.ts | 28 ++++ .../src/lib/components/avatar/avatar.test.ts | 10 ++ .../src/lib/components/avatar/avatar.ts | 25 ++++ .../components/avatar/examples/basic.svelte | 8 ++ .../components/avatar/examples/context.svelte | 18 +++ .../avatar/examples/root-provider.svelte | 18 +++ .../svelte/src/lib/components/avatar/index.ts | 24 +++- .../components/avatar/use-avatar-context.ts | 2 +- .../components/avatar/use-avatar.svelte.ts | 22 +-- packages/svelte/src/lib/types.ts | 9 ++ packages/svelte/src/lib/utils/create-id.ts | 4 + .../src/lib/utils/create-split-props.ts | 25 ++++ packages/svelte/src/lib/utils/index.ts | 1 - packages/svelte/src/routes/+page.svelte | 14 +- packages/svelte/src/test-setup.ts | 1 + packages/svelte/src/typts.d.ts | 3 - packages/svelte/src/typts.ts | 4 - packages/svelte/static/favicon.png | Bin 1571 -> 0 bytes packages/svelte/vite.config.ts | 5 +- scripts/package.json | 2 + 73 files changed, 2408 insertions(+), 114 deletions(-) delete mode 100644 packages/svelte/.gitignore delete mode 100644 packages/svelte/.npmrc create mode 100644 packages/svelte/.storybook/main.css create mode 100644 packages/svelte/.storybook/main.ts create mode 100644 packages/svelte/.storybook/preview.ts create mode 100644 packages/svelte/.storybook/styles/accordion.css create mode 100644 packages/svelte/.storybook/styles/avatar.css create mode 100644 packages/svelte/.storybook/styles/carousel.css create mode 100644 packages/svelte/.storybook/styles/checkbox.css create mode 100644 packages/svelte/.storybook/styles/collapsible.css create mode 100644 packages/svelte/.storybook/styles/color-picker.css create mode 100644 packages/svelte/.storybook/styles/combobox.css create mode 100644 packages/svelte/.storybook/styles/date-picker.css create mode 100644 packages/svelte/.storybook/styles/dialog.css create mode 100644 packages/svelte/.storybook/styles/field.css create mode 100644 packages/svelte/.storybook/styles/file-upload.css create mode 100644 packages/svelte/.storybook/styles/hover-card.css create mode 100644 packages/svelte/.storybook/styles/menu.css create mode 100644 packages/svelte/.storybook/styles/number-input.css create mode 100644 packages/svelte/.storybook/styles/pagination.css create mode 100644 packages/svelte/.storybook/styles/pin-input.css create mode 100644 packages/svelte/.storybook/styles/popover.css create mode 100644 packages/svelte/.storybook/styles/presence.css create mode 100644 packages/svelte/.storybook/styles/progress.css create mode 100644 packages/svelte/.storybook/styles/qr-code.css create mode 100644 packages/svelte/.storybook/styles/radio-group.css create mode 100644 packages/svelte/.storybook/styles/segment-group.css create mode 100644 packages/svelte/.storybook/styles/select.css create mode 100644 packages/svelte/.storybook/styles/signature-pad.css create mode 100644 packages/svelte/.storybook/styles/slider.css create mode 100644 packages/svelte/.storybook/styles/splitter.css create mode 100644 packages/svelte/.storybook/styles/steps.css create mode 100644 packages/svelte/.storybook/styles/switch.css create mode 100644 packages/svelte/.storybook/styles/tabs.css create mode 100644 packages/svelte/.storybook/styles/tags-input.css create mode 100644 packages/svelte/.storybook/styles/time-picker.css create mode 100644 packages/svelte/.storybook/styles/timer.css create mode 100644 packages/svelte/.storybook/styles/toast.css create mode 100644 packages/svelte/.storybook/styles/toggle-group.css create mode 100644 packages/svelte/.storybook/styles/tooltip.css create mode 100644 packages/svelte/.storybook/styles/tree-view.css create mode 100644 packages/svelte/CHANGELOG.md delete mode 100644 packages/svelte/src/index.test.ts create mode 100644 packages/svelte/src/lib/components/avatar/avatar-context.svelte create mode 100644 packages/svelte/src/lib/components/avatar/avatar-root-provider.svelte create mode 100644 packages/svelte/src/lib/components/avatar/avatar.anatomy.ts create mode 100644 packages/svelte/src/lib/components/avatar/avatar.stories.ts create mode 100644 packages/svelte/src/lib/components/avatar/avatar.test.ts create mode 100644 packages/svelte/src/lib/components/avatar/avatar.ts create mode 100644 packages/svelte/src/lib/components/avatar/examples/basic.svelte create mode 100644 packages/svelte/src/lib/components/avatar/examples/context.svelte create mode 100644 packages/svelte/src/lib/components/avatar/examples/root-provider.svelte create mode 100644 packages/svelte/src/lib/types.ts create mode 100644 packages/svelte/src/lib/utils/create-id.ts create mode 100644 packages/svelte/src/lib/utils/create-split-props.ts delete mode 100644 packages/svelte/src/lib/utils/index.ts create mode 100644 packages/svelte/src/test-setup.ts delete mode 100644 packages/svelte/src/typts.d.ts delete mode 100644 packages/svelte/src/typts.ts delete mode 100644 packages/svelte/static/favicon.png diff --git a/.prettierrc b/.prettierrc index e69b455b3c..ad50d4c953 100644 --- a/.prettierrc +++ b/.prettierrc @@ -5,7 +5,9 @@ "arrowParens": "always", "semi": false, "htmlWhitespaceSensitivity": "ignore", + "plugins": ["prettier-plugin-svelte"], "overrides": [ + { "files": "*.svelte", "options": { "parser": "svelte" } }, { "files": "*.md", "options": { diff --git a/bun.lockb b/bun.lockb index 931716e907f255be85a03c7189aeb75bcadf58f9..5ea8f7a74059c1d8af1f62ac5d26faf66d1be06b 100755 GIT binary patch delta 38040 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 MEdPNKEG^K*zgv_Nxc~qF delta 26520 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 { return ( <> - + PA - + ) diff --git a/packages/svelte/.gitignore b/packages/svelte/.gitignore deleted file mode 100644 index ac7211b403..0000000000 --- a/packages/svelte/.gitignore +++ /dev/null @@ -1,11 +0,0 @@ -.DS_Store -node_modules -/build -/dist -/.svelte-kit -/package -.env -.env.* -!.env.example -vite.config.js.timestamp-* -vite.config.ts.timestamp-* diff --git a/packages/svelte/.npmrc b/packages/svelte/.npmrc deleted file mode 100644 index b6f27f1359..0000000000 --- a/packages/svelte/.npmrc +++ /dev/null @@ -1 +0,0 @@ -engine-strict=true diff --git a/packages/svelte/.storybook/main.css b/packages/svelte/.storybook/main.css new file mode 100644 index 0000000000..63365cacef --- /dev/null +++ b/packages/svelte/.storybook/main.css @@ -0,0 +1,36 @@ +@import url("./styles/accordion.css"); +@import url("./styles/avatar.css"); +@import url("./styles/carousel.css"); +@import url("./styles/checkbox.css"); +@import url("./styles/collapsible.css"); +@import url("./styles/color-picker.css"); +@import url("./styles/combobox.css"); +@import url("./styles/date-picker.css"); +@import url("./styles/dialog.css"); +@import url("./styles/field.css"); +@import url("./styles/file-upload.css"); +@import url("./styles/hover-card.css"); +@import url("./styles/menu.css"); +@import url("./styles/number-input.css"); +@import url("./styles/pagination.css"); +@import url("./styles/pin-input.css"); +@import url("./styles/popover.css"); +@import url("./styles/presence.css"); +@import url("./styles/progress.css"); +@import url("./styles/qr-code.css"); +@import url("./styles/radio-group.css"); +@import url("./styles/segment-group.css"); +@import url("./styles/select.css"); +@import url("./styles/signature-pad.css"); +@import url("./styles/slider.css"); +@import url("./styles/splitter.css"); +@import url("./styles/steps.css"); +@import url("./styles/switch.css"); +@import url("./styles/tabs.css"); +@import url("./styles/tags-input.css"); +@import url("./styles/time-picker.css"); +@import url("./styles/timer.css"); +@import url("./styles/toast.css"); +@import url("./styles/toggle-group.css"); +@import url("./styles/tooltip.css"); +@import url("./styles/tree-view.css"); diff --git a/packages/svelte/.storybook/main.ts b/packages/svelte/.storybook/main.ts new file mode 100644 index 0000000000..e9e60a9005 --- /dev/null +++ b/packages/svelte/.storybook/main.ts @@ -0,0 +1,21 @@ +import type { StorybookConfig } from '@storybook/sveltekit' + +const config: StorybookConfig = { + stories: ['../src/**/*.stories.@(js|jsx|ts|tsx|svelte)'], + framework: '@storybook/sveltekit', + addons: [ + { + name: '@storybook/addon-essentials', + options: { backgrounds: false, controls: false, actions: false }, + }, + '@storybook/addon-a11y', + ], + core: { + disableTelemetry: true, + }, + docs: { + autodocs: false, + }, +} + +export default config diff --git a/packages/svelte/.storybook/preview.ts b/packages/svelte/.storybook/preview.ts new file mode 100644 index 0000000000..e13704db3a --- /dev/null +++ b/packages/svelte/.storybook/preview.ts @@ -0,0 +1,15 @@ +import type { Preview } from '@storybook/react' +import './main.css' + +const preview: Preview = { + parameters: { + options: { + storySort: { + method: 'alphabetical', + }, + }, + layout: 'padded', + }, +} + +export default preview diff --git a/packages/svelte/.storybook/styles/accordion.css b/packages/svelte/.storybook/styles/accordion.css new file mode 100644 index 0000000000..e83b9d5680 --- /dev/null +++ b/packages/svelte/.storybook/styles/accordion.css @@ -0,0 +1,53 @@ +@keyframes slideDown { + from { + opacity: 0.01; + height: 0; + } + to { + opacity: 1; + height: var(--height); + } +} + +@keyframes slideUp { + from { + opacity: 1; + height: var(--height); + } + to { + opacity: 0.01; + height: 0; + } +} + + +[data-scope='accordion'][data-part='item-indicator'][data-state='open'] { + rotate: 90deg; +} + +[data-scope='accordion'][data-part='item-trigger'] { + display: inline-flex; + align-items: center; + gap: 8px; +} + +[data-scope='accordion'][data-part='item-trigger'] svg { + width: 1em; + height: 1em; +} + + +[data-scope="accordion"][data-part="item-content"] { + overflow: hidden; + max-width: 400px; + background-color: cadetblue; + color:white; +} + +[data-scope="accordion"][data-part="item-content"][data-state="open"] { + animation: slideDown 250ms cubic-bezier(0, 0, 0.38, 0.9); +} + +[data-scope="accordion"][data-part="item-content"][data-state="closed"] { + animation: slideUp 200ms cubic-bezier(0, 0, 0.38, 0.9); +} diff --git a/packages/svelte/.storybook/styles/avatar.css b/packages/svelte/.storybook/styles/avatar.css new file mode 100644 index 0000000000..6d2c3c4713 --- /dev/null +++ b/packages/svelte/.storybook/styles/avatar.css @@ -0,0 +1,28 @@ +[data-scope='avatar'][data-part='root'] { + width: 80px; + height: 80px; + border-radius: 9999px; +} + +[data-scope='avatar'][data-part='image'] { + width: 80px; + height: 80px; + object-fit: cover; + border-radius: inherit; +} + +[data-scope='avatar'][data-part='fallback'] { + width: 80px; + height: 80px; + font-size: 14px; + line-height: 1; + font-weight: 600; + color: white; + background-color: #777; +} + +[data-scope='avatar'][data-part='fallback']:not([hidden]) { + display: flex; + align-items: center; + justify-content: center; +} diff --git a/packages/svelte/.storybook/styles/carousel.css b/packages/svelte/.storybook/styles/carousel.css new file mode 100644 index 0000000000..20baa44a9d --- /dev/null +++ b/packages/svelte/.storybook/styles/carousel.css @@ -0,0 +1,5 @@ +[data-scope='carousel'][data-part='viewport'] { + max-width: 600px; + margin-top: 40px; + overflow-x: hidden; +} diff --git a/packages/svelte/.storybook/styles/checkbox.css b/packages/svelte/.storybook/styles/checkbox.css new file mode 100644 index 0000000000..e2dba355a5 --- /dev/null +++ b/packages/svelte/.storybook/styles/checkbox.css @@ -0,0 +1,36 @@ +[data-scope='checkbox'][data-part='root'] { + cursor: pointer; + display: flex; + flex-direction: column; + gap: 8px; +} + +[data-scope='checkbox'][data-part='group'] { + display: flex; + gap: 24px; +} + +[data-scope='checkbox'][data-part='control'] { + border: 2px solid; + border-radius: 4px; + display: flex; + align-items: center; + justify-content: center; + width: 24px; + height: 24px; + + &[data-invalid] { + border-color: red; + } + + &[data-disabled] { + opacity: 0.5; + } +} + + +[data-scope='checkbox'][data-part='indicator']:not([hidden]) { + display: flex; + align-items: center; + justify-content: center; +} diff --git a/packages/svelte/.storybook/styles/collapsible.css b/packages/svelte/.storybook/styles/collapsible.css new file mode 100644 index 0000000000..0a6bb5ba14 --- /dev/null +++ b/packages/svelte/.storybook/styles/collapsible.css @@ -0,0 +1,38 @@ + +@keyframes slideDown { + from { + opacity: 0.01; + height: 0; + } + to { + opacity: 1; + height: var(--height); + } + } + + @keyframes slideUp { + from { + opacity: 1; + height: var(--height); + } + to { + opacity: 0.01; + height: 0; + } + } + + [data-scope="collapsible"][data-part="content"] { + overflow: hidden; + max-width: 400px; + background-color: cadetblue; + color:white; + } + + [data-scope="collapsible"][data-part="content"][data-state="open"] { + animation: slideDown 250ms cubic-bezier(0, 0, 0.38, 0.9); + } + + [data-scope="collapsible"][data-part="content"][data-state="closed"] { + animation: slideUp 200ms cubic-bezier(0, 0, 0.38, 0.9); + } + \ No newline at end of file diff --git a/packages/svelte/.storybook/styles/color-picker.css b/packages/svelte/.storybook/styles/color-picker.css new file mode 100644 index 0000000000..4808910fee --- /dev/null +++ b/packages/svelte/.storybook/styles/color-picker.css @@ -0,0 +1,81 @@ +[data-scope='color-picker'][data-part='root'] { + display: flex; + flex-direction: column; + gap: 10px; + margin-bottom: 10px; + max-width: 400px; +} + +[data-scope='color-picker'][data-part='control'] { + display: flex; + gap: 4px; +} + +[data-scope='color-picker'][data-part='content'] { + width: 260px; + box-sizing: border-box; + padding: 24px; + border: 1px solid #d5d5d5; + background: white; +} + +[data-scope='color-picker'][data-part='value-text'] { + min-width: fit-content; +} + +[data-scope='color-picker'][data-part='content']:not(:is([hidden])) { + display: flex; + flex-direction: column; + gap: 16px; +} + +[data-scope='color-picker'][data-part='area'] { + height: 200px; + border-radius: 4px; + border: 1px solid #ebebeb; +} + +[data-scope='color-picker'][data-part='area-background'] { + background: rgb(142, 142, 142); + border-radius: 4px; + height: 200px; +} + +[data-scope='color-picker'][data-part='area-thumb'], +[data-scope='color-picker'][data-part='channel-slider-thumb'] { + border: 2px solid white; + border-radius: 9999px; + box-sizing: border-box; + transform: translate(-50%, -50%); + box-shadow: + black 0px 0px 0px 1px, + black 0px 0px 0px 1px inset; + width: 16px; + height: 16px; +} + +[data-scope='color-picker'][data-part='channel-slider-track'] { + height: 20px; + border-radius: 4px; +} + +[data-scope='color-picker'][data-part='channel-input'] { + border-radius: 4px; + width: 100%; + border: 1px solid #c2c2c2; +} + +[data-scope='color-picker'][data-part='swatch-group'] { + display: flex; + gap: 8px; +} + +[data-scope='color-picker'][data-part='swatch'] { + width: 20px; + height: 20px; + flex-shrink: 0; +} + +[data-scope='color-picker'][data-part='transparency-grid'] { + border-radius: 4px; +} diff --git a/packages/svelte/.storybook/styles/combobox.css b/packages/svelte/.storybook/styles/combobox.css new file mode 100644 index 0000000000..d4e7696125 --- /dev/null +++ b/packages/svelte/.storybook/styles/combobox.css @@ -0,0 +1,47 @@ +[data-scope='combobox'][data-part='content'][data-state='open'] { + animation: fadeIn 0.25s ease-out; +} + +[data-scope='combobox'][data-part='content'][data-state='closed'] { + animation: fadeOut 0.2s ease-in; +} + +[data-scope='combobox'][data-part='content'] { + border: 1px solid gainsboro; + padding: 12px; +} + +[data-scope='combobox'][data-part='item'] { + display: flex; + justify-content: space-between; +} +[data-scope='combobox'][data-part='item'][data-highlighted] { + background-color: lightblue; +} + + +[data-scope='combobox'][data-part='item'][data-disabled] { + color: silver; +} + +@keyframes fadeIn { + from { + opacity: 0; + transform: translateY(-10px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes fadeOut { + from { + opacity: 1; + transform: translateY(0); + } + to { + opacity: 0; + transform: translateY(-10px); + } +} diff --git a/packages/svelte/.storybook/styles/date-picker.css b/packages/svelte/.storybook/styles/date-picker.css new file mode 100644 index 0000000000..a29214278b --- /dev/null +++ b/packages/svelte/.storybook/styles/date-picker.css @@ -0,0 +1,78 @@ +[data-scope='date-picker'][data-part='table-cell-trigger'] { + padding: 4px; + min-width: 30px; + min-height: 30px; + border-radius: 4px; + text-align: center; + user-select: none; + -webkit-tap-highlight-color: transparent; +} + +[data-scope='date-picker'][data-part='table-cell-trigger']:hover { + background: rgba(126, 126, 126, 0.171); +} + +[data-scope='date-picker'][data-part='table-cell-trigger'][data-focus] { + background: rgba(165, 151, 165, 0.085); + color: rgba(128, 0, 128, 0.959); +} + +[data-scope='date-picker'][data-part='table-cell-trigger'][data-outside-range] { + visibility: hidden; +} + +[data-scope='date-picker'][data-part='table-cell-trigger'][data-selected] { + background: purple !important; + color: white !important ; +} + +[data-scope='date-picker'][data-part='table-cell-trigger'][data-in-range]:not([data-selected]) { + background: rgb(240, 219, 240); +} + +[data-scope='date-picker'][data-part='control'] { + display: flex; + gap: 10px; + margin-top: 20px; + margin-bottom: 16px; +} + +[data-scope='date-picker'][data-part='table-cell-trigger'][data-today] { + color: purple; +} + +[data-scope='date-picker'][data-part='table-cell-trigger'][data-unavailable] { + text-decoration: line-through; + opacity: 0.4; +} + +[data-scope='date-picker'][data-part='table-cell-trigger'][data-disabled] { + opacity: 0.4; +} + +[data-scope='date-picker'][data-part='content'] { + border: 1px solid gray; + padding: 1.5rem; + min-width: 320px; + background: white; + border-radius: 8px; +} + +[data-scope='date-picker'][data-part='table'] { + min-width: 240px; + width: 100%; + border-collapse: collapse; +} + +[data-scope='date-picker'][data-part='view-trigger'] { + border: 0; + padding: 4px 20px; + border-radius: 4px; +} + +[data-scope='date-picker'][data-part='view-control'] { + display: flex; + justify-content: space-between; + align-items: center; + margin-block: 10px; +} diff --git a/packages/svelte/.storybook/styles/dialog.css b/packages/svelte/.storybook/styles/dialog.css new file mode 100644 index 0000000000..816f5b91e3 --- /dev/null +++ b/packages/svelte/.storybook/styles/dialog.css @@ -0,0 +1,102 @@ +[data-scope='dialog'][data-part='backdrop'] { + background-color: rgba(0, 0, 0, 0.8); + position: fixed; + inset: 0px; +} + +[data-scope='dialog'][data-part='backdrop'][data-state='open'] { + animation: fadeIn 0.25s ease-out; +} + +[data-scope='dialog'][data-part='backdrop'][data-state='closed'] { + animation: fadeOut 0.2s ease-in; +} + +[data-scope='dialog'][data-part='container'] { + height: 100vh; + width: 100vw; + position: fixed; + inset: 0px; + display: flex; + align-items: center; + justify-content: center; +} + +[data-scope='dialog'][data-part='title'] { + margin: 0px; + font-weight: 500; + color: rgb(26, 21, 35); + font-size: 17px; +} + +[data-scope='dialog'][data-part='description'] { + margin: 10px 0px 20px; + color: rgb(111, 110, 119); + font-size: 15px; + line-height: 1.5; +} + +[data-scope='dialog'][data-part='content'] { + background-color: white; + border-radius: 6px; + box-shadow: + rgb(14 18 22 / 35%) 0px 10px 38px -10px, + rgb(14 18 22 / 20%) 0px 10px 20px -15px; + width: 100%; + max-width: 450px; + max-height: 85vh; + padding: 24px; + position: relative; +} + +[data-scope='dialog'][data-part='content'][data-state='open'] { + animation: scaleIn 0.5s ease-out; +} + +[data-scope='dialog'][data-part='content'][data-state='closed'] { + animation: scaleOut 0.5s ease-in; +} + +[data-scope='dialog'][data-part='close-trigger'] { + position: absolute; + top: 10px; + right: 10px; +} + +[data-scope='dialog'][data-part='close-trigger']:focus { + outline: 2px blue solid; + outline-offset: 2px; +} + +@keyframes fadeIn { + from { + opacity: 0; + } + to { + opacity: 1; + } +} + +@keyframes fadeOut { + from { + opacity: 1; + } + to { + opacity: 0; + } +} + +@keyframes scaleIn { + from { + scale: 0.8; + } + to { + scale: 1; + } +} + +@keyframes scaleOut { + to { + scale: 0.8; + } +} diff --git a/packages/svelte/.storybook/styles/field.css b/packages/svelte/.storybook/styles/field.css new file mode 100644 index 0000000000..313c827ce2 --- /dev/null +++ b/packages/svelte/.storybook/styles/field.css @@ -0,0 +1,7 @@ +[data-scope='field'][data-part='root'] { + display: flex; + flex-direction: column; + gap: 6px; + align-items: start; + } + \ No newline at end of file diff --git a/packages/svelte/.storybook/styles/file-upload.css b/packages/svelte/.storybook/styles/file-upload.css new file mode 100644 index 0000000000..fae6da9e70 --- /dev/null +++ b/packages/svelte/.storybook/styles/file-upload.css @@ -0,0 +1,60 @@ +[data-scope='file-upload'][data-part='root'] { + display: flex; + flex-direction: column; + gap: 0.5rem; + width: 80%; +} + +[data-scope='file-upload'][data-part='dropzone'] { + display: flex; + align-items: center; + flex-direction: column; + gap: 0.5rem; + border-width: 2px; + border-style: dashed; + padding-top: var(--space-8); + padding-bottom: var(--space-8); + padding-inline-start: var(--space-2); + padding-inline-end: var(--space-2); +} + +[data-scope='file-upload'][data-part='trigger'] { + display: inline-flex; + align-items: center; + justify-content: center; + text-align: start; + cursor: pointer; + font-weight: var(--fontWeights-medium); + padding-inline-start: var(--space-4); + padding-inline-end: var(--space-4); + padding-top: var(--space-1); + padding-bottom: var(--space-1); + background: var(--colors-bg-primary-subtle); + color: var(--colors-white); +} + +[data-scope='file-upload'][data-part='item-group'] { + display: flex; + flex-direction: column; + gap: 0.5rem; +} + +[data-scope='file-upload'][data-part='item'] { + display: flex; + align-items: center; + flex-direction: row; + gap: 0.5rem; + padding-inline-start: var(--space-3); + padding-inline-end: var(--space-3); + padding-top: var(--space-2); + padding-bottom: var(--space-2); + background: var(--colors-bg-subtle); + border-width: 1px; +} + +[data-scope='file-upload'][data-part='item-preview-image'] { + aspect-ratio: 1; + object-fit: cover; + width: 40px; + height: 40px; +} diff --git a/packages/svelte/.storybook/styles/hover-card.css b/packages/svelte/.storybook/styles/hover-card.css new file mode 100644 index 0000000000..1eea396239 --- /dev/null +++ b/packages/svelte/.storybook/styles/hover-card.css @@ -0,0 +1,45 @@ +[data-scope='hover-card'][data-part='trigger'] { + text-decoration: none; +} + +[data-scope='hover-card'][data-part='content'] { + padding: 0.5rem; + border: 1px solid lightgray; + background: white; + filter: drop-shadow(0px 4px 6px rgba(0, 0, 0, 0.15)); +} + +[data-scope='hover-card'][data-part='arrow'] { + --arrow-background: white; + --arrow-size: 8px; +} + +[data-scope='hover-card'][data-part='content'][data-state='open'] { + animation: fadeIn 0.25s ease-out; +} + +[data-scope='hover-card'][data-part='content'][data-state='closed'] { + animation: fadeOut 0.2s ease-in; +} + +@keyframes fadeIn { + from { + opacity: 0; + transform: translateY(-10px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes fadeOut { + from { + opacity: 1; + transform: translateY(0); + } + to { + opacity: 0; + transform: translateY(-10px); + } +} diff --git a/packages/svelte/.storybook/styles/menu.css b/packages/svelte/.storybook/styles/menu.css new file mode 100644 index 0000000000..7cd5cf2db6 --- /dev/null +++ b/packages/svelte/.storybook/styles/menu.css @@ -0,0 +1,57 @@ +[data-scope="menu"][data-part="content"] { + margin: 0; + width: 160px; + background-color: white; + border-radius: 6px; + padding: 5px; + border: 1px solid lightgray; + list-style-type: none; +} +[data-scope="menu"][data-part="trigger"] { + display: flex; + gap: 4px; +} + +[data-scope='menu'][data-part='indicator'][data-state='open'] { + rotate: 90deg; +} + +[data-scope="menu"][data-part="item"], +[data-scope="menu"][data-part="trigger-item"], +[data-scope="menu"][data-part="option-item"] { + all: unset; + font-size: 14px; + line-height: 1; + color: rgb(87, 70, 175); + display: flex; + align-items: center; + gap: 4px; + height: 25px; + position: relative; + user-select: none; + border-radius: 3px; + padding: 0px 5px; +} + +[data-scope="menu"][data-part="item"][data-highlighted], +[data-scope="menu"][data-part="trigger-item"][data-highlighted], +[data-scope="menu"][data-part="option-item"][data-highlighted] { + outline: none; + background-color: rgb(110, 86, 207); + color: rgb(253, 252, 254); +} + +[data-scope="menu"][data-part="item"][data-disabled], +[data-scope="menu"][data-part="trigger-item"][data-disabled], +[data-scope="menu"][data-part="option-item"][data-disabled] { + opacity: 0.4; +} + +[data-scope="menu"][data-part="context-trigger"] { + border: 2px dashed blue; + border-radius: 4px; + font-size: 15px; + padding-block: 40px; + width: 300px; + text-align: center; +} diff --git a/packages/svelte/.storybook/styles/number-input.css b/packages/svelte/.storybook/styles/number-input.css new file mode 100644 index 0000000000..5310b958fd --- /dev/null +++ b/packages/svelte/.storybook/styles/number-input.css @@ -0,0 +1,5 @@ +[data-scope='number-input'][data-part='scrubber'] { + width: 16px; + height: 16px; + background-color: red; +} diff --git a/packages/svelte/.storybook/styles/pagination.css b/packages/svelte/.storybook/styles/pagination.css new file mode 100644 index 0000000000..d9b66bda37 --- /dev/null +++ b/packages/svelte/.storybook/styles/pagination.css @@ -0,0 +1,9 @@ +[data-scope='pagination'][data-part='item'][data-selected] { + background-color: aqua; +} + +[data-scope='pagination'][data-part='prev-item'][data-disabled], +[data-scope='pagination'][data-part='next-item'][data-disabled] { + cursor: not-allowed; + opacity: 0.4; +} diff --git a/packages/svelte/.storybook/styles/pin-input.css b/packages/svelte/.storybook/styles/pin-input.css new file mode 100644 index 0000000000..8577a8445c --- /dev/null +++ b/packages/svelte/.storybook/styles/pin-input.css @@ -0,0 +1,18 @@ +[data-scope='pin-input'][data-part='control'] { + width: 300px; + display: flex; + margin-bottom: 12px; + gap: 12px; +} + +[data-scope='pin-input'][data-part='label'] { + display: block; + margin-bottom: 8px; +} + +[data-scope='pin-input'][data-part='input'] { + width: 48px; + height: 48px; + text-align: center; + font-size: 24px; +} diff --git a/packages/svelte/.storybook/styles/popover.css b/packages/svelte/.storybook/styles/popover.css new file mode 100644 index 0000000000..c2f0cce285 --- /dev/null +++ b/packages/svelte/.storybook/styles/popover.css @@ -0,0 +1,56 @@ +[data-scope='popover'][data-part='content'] { + background: white; + padding: 16px; + border-radius: 4px; + position: relative; + filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.2)); + min-width: 240px; +} +[data-scope='popover'][data-part='content'][data-state='open'] { + animation: fadeIn 0.25s ease-out; +} + +[data-scope='popover'][data-part='content'][data-state='closed'] { + animation: fadeOut 0.2s ease-in; +} + +[data-scope='popover'][data-part='title'] { + font-weight: bold; +} + +[data-scope='popover'][data-part='close-trigger'] { + position: absolute; + right: 4px; + top: 4px; +} + +[data-scope='popover'][data-part='anchor'] { + display: inline; + margin-left: 200px; +} + +[data-scope='popover'][data-part='indicator'][data-state='open'] { + rotate: 90deg; +} + +@keyframes fadeIn { + from { + opacity: 0; + transform: translateY(-10px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes fadeOut { + from { + opacity: 1; + transform: translateY(0); + } + to { + opacity: 0; + transform: translateY(-10px); + } +} diff --git a/packages/svelte/.storybook/styles/presence.css b/packages/svelte/.storybook/styles/presence.css new file mode 100644 index 0000000000..800edd8ba9 --- /dev/null +++ b/packages/svelte/.storybook/styles/presence.css @@ -0,0 +1,32 @@ +[data-scope='presence'][data-part='root'] { + background-color: brown; + color: white; + padding: 24px; + max-width: fit-content; +} + +[data-scope='presence'][data-part='root'][data-state='open'] { + animation: fadeIn 0.25s ease-out; +} + +[data-scope='presence'][data-part='root'][data-state='closed'] { + animation: fadeOut 0.5s ease-in; +} + +@keyframes fadeIn { + from { + opacity: 0; + scale: 0.8; + } + to { + opacity: 1; + scale: 1; + } +} + +@keyframes fadeOut { + to { + opacity: 0; + scale: 0.8; + } +} diff --git a/packages/svelte/.storybook/styles/progress.css b/packages/svelte/.storybook/styles/progress.css new file mode 100644 index 0000000000..04c753851b --- /dev/null +++ b/packages/svelte/.storybook/styles/progress.css @@ -0,0 +1,105 @@ +[data-scope='progress'][data-part='root'] { + display: flex; + flex-direction: column; + gap: 8px; +} + +/* We should consider adding some div grouping track and range for vertical prop like in slider */ +[data-scope='progress'][data-part='control'] { + position: relative; + align-items: center; + display: flex; +} + +[data-scope='progress'][data-part='control'][data-orientation='vertical'] { + height: 20rem; + width: 8px; + flex-direction: column; +} + +[data-scope='progress'][data-part='track'] { + background: silver; + height: 8px; + flex: 1; +} + +[data-scope='progress'][data-part='track'][data-orientation='horizontal'] { + height: 8px; +} + +[data-scope='progress'][data-part='track'][data-orientation='vertical'] { + width: 8px; +} + +[data-scope='progress'][data-part='range'] { + background: orange; +} + +[data-scope='progress'][data-part='range'][data-orientation='horizontal'] { + height: inherit; +} + +[data-scope='progress'][data-part='range'][data-orientation='vertical'] { + width: inherit; +} + +[data-scope='progress'][data-part='range'][data-state='indeterminate'] { + width: 210%; + background: orange; + animation: 1s cubic-bezier(0.694, 0.0482, 0.335, 1) 0s infinite normal none running + linearAnimation; +} + +@keyframes linearAnimation { + from { + transform: scaleX(1) translateX(var(--translate-x)); + } + to { + transform: scaleX(0) translateX(var(--translate-x)); + } +} + +[data-scope='progress'][data-part='circle'] { + --size: 100px; + --thickness: 10px; +} + +[data-scope='progress'][data-part='circle'][data-state='indeterminate'] { + width: 210%; + background: orange; + animation: spin 2s linear infinite; +} + +[data-scope='progress'][data-part='circle-track'] { + stroke: silver; +} + +[data-scope='progress'][data-part='circle-range'] { + stroke: orange; +} + +[data-scope='progress'][data-part='circle-range'][data-state='indeterminate'] { + width: 210%; + background: orange; + animation: circleAnimation 1.5s ease-in-out infinite; +} + +@keyframes spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} + +@keyframes circleAnimation { + from { + stroke-dasharray: 1, 400; + stroke-dashoffset: 0; + } + to { + stroke-dasharray: 400, 400; + stroke-dashoffset: -260; + } +} diff --git a/packages/svelte/.storybook/styles/qr-code.css b/packages/svelte/.storybook/styles/qr-code.css new file mode 100644 index 0000000000..a368b18545 --- /dev/null +++ b/packages/svelte/.storybook/styles/qr-code.css @@ -0,0 +1,26 @@ +[data-scope="qr-code"][data-part="root"] { + width: fit-content; +} + +[data-scope="qr-code"][data-part="frame"] { + width: 120px; + height: 120px; + background-color: white; + } + + [data-scope="qr-code"][data-part="pattern"] { + fill: black; + } + + [data-scope="qr-code"][data-part="overlay"] { + width: 32px; + height: 32px; + outline: 1px solid white; + background-color: white; + + & img { + width: 100%; + height: 100%; + } + } + \ No newline at end of file diff --git a/packages/svelte/.storybook/styles/radio-group.css b/packages/svelte/.storybook/styles/radio-group.css new file mode 100644 index 0000000000..117762e3c2 --- /dev/null +++ b/packages/svelte/.storybook/styles/radio-group.css @@ -0,0 +1,73 @@ +[data-scope='radio-group'][data-part='root'] { + position: relative; + display: flex; + align-items: center; + gap: 16px; +} + +[data-scope='radio-group'][data-part='item'] { + display: inline-flex; + align-items: center; + gap: 8px; + position: relative; + z-index: 2; +} + +[data-scope='radio-group'][data-part='item'][data-disabled] { + cursor: not-allowed; +} + +[data-scope='radio-group'][data-part='item-label'][data-disabled] { + opacity: 0.4; +} + +[data-scope='radio-group'][data-part='item-control'] { + height: 20px; + width: 20px; + background-color: #eee; + border: solid 2px grey; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; +} + +[data-scope='radio-group'][data-part='item-control'][data-focus] { + outline: 2px solid royalblue; +} + +[data-scope='radio-group'][data-part='item-control'][data-hover] { + background-color: #ccc; +} + +[data-scope='radio-group'][data-part='item-control'][data-state='checked'] { + background-color: #2196f3; + border-color: #2196f3; +} + +[data-scope='radio-group'][data-part='item-control'][data-state='checked']::after { + display: initial; +} + +[data-scope='radio-group'][data-part='item-control']::after { + content: ''; + display: none; + width: 4px; + height: 9px; + border: solid white; + border-width: 0 2px 2px 0; + transform: rotate(45deg); + position: relative; + top: -1px; +} + +[data-scope='radio-group'][data-part='indicator'] { + height: 4px; + background-color: red; + z-index: 1; + border-radius: 0.25rem; + box-shadow: + rgba(0, 0, 0, 0.05) 0px 0.0625rem 0.1875rem, + rgba(0, 0, 0, 0.1) 0px 0.0625rem 0.125rem; + background-color: rgb(255, 255, 255); +} diff --git a/packages/svelte/.storybook/styles/segment-group.css b/packages/svelte/.storybook/styles/segment-group.css new file mode 100644 index 0000000000..98a93c2008 --- /dev/null +++ b/packages/svelte/.storybook/styles/segment-group.css @@ -0,0 +1,82 @@ +[data-scope='segment-group'][data-part='root'] { + position: relative; + display: flex; + align-items: center; + gap: 16px; + width: fit-content; + padding: 4px; + background-color: #f1f3f5; + border-radius: 4px; + gap: 8px; +} + +[data-scope='segment-group'][data-part='item'] { + display: inline-flex; + align-items: center; + gap: 8px; + position: relative; + z-index: 2; + padding-left: 0; + padding: 8px; + width: 100%; + text-align: center; +} + +[data-scope='segment-group'][data-part='item'][data-disabled] { + cursor: not-allowed; +} + +[data-scope='segment-group'][data-part='item-text'][data-disabled] { + opacity: 0.4; +} + +[data-scope='segment-group'][data-part='item-control'] { + height: 20px; + width: 20px; + background-color: #eee; + border: solid 2px grey; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; +} + +[data-scope='segment-group'][data-part='item-control'][data-focus] { + outline: 2px solid royalblue; +} + +[data-scope='segment-group'][data-part='item-control'][data-hover] { + background-color: #ccc; +} + +[data-scope='segment-group'][data-part='item-control'][data-state='checked'] { + background-color: #2196f3; + border-color: #2196f3; +} + +[data-scope='segment-group'][data-part='item-control'][data-state='checked']::after { + display: initial; +} + +[data-scope='segment-group'][data-part='item-control']::after { + content: ''; + display: none; + width: 4px; + height: 9px; + border: solid white; + border-width: 0 2px 2px 0; + transform: rotate(45deg); + position: relative; + top: -1px; +} + +[data-scope='segment-group'][data-part='indicator'] { + height: 4px; + background-color: red; + z-index: 1; + border-radius: 0.25rem; + box-shadow: + rgba(0, 0, 0, 0.05) 0px 0.0625rem 0.1875rem, + rgba(0, 0, 0, 0.1) 0px 0.0625rem 0.125rem; + background-color: rgb(255, 255, 255); +} diff --git a/packages/svelte/.storybook/styles/select.css b/packages/svelte/.storybook/styles/select.css new file mode 100644 index 0000000000..c17e2940a7 --- /dev/null +++ b/packages/svelte/.storybook/styles/select.css @@ -0,0 +1,59 @@ +[data-scope='select'][data-part='content'][data-state='open'] { + animation: fadeIn 0.25s ease-out; +} + +[data-scope='select'][data-part='content'][data-state='closed'] { + animation: fadeOut 0.2s ease-in; +} + +[data-scope='select'][data-part='content'] { + border: 1px solid gainsboro; + background: white; + z-index: 1; + padding: 12px; +} + +[data-scope='select'][data-part='item-group-label'] { + font-weight: bold; +} + +[data-scope='select'][data-part='item'] { + display: flex; + justify-content: space-between; +} + +[data-scope='select'][data-part='item'][data-disabled] { + color: silver; +} + +[data-scope='select'][data-part='trigger'] { + display: inline-flex; + gap: 8px; +} + +[data-scope='select'][data-part='trigger'] svg { + width: 1em; + height: 1em; +} + +@keyframes fadeIn { + from { + opacity: 0; + transform: translateY(-10px); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +@keyframes fadeOut { + from { + opacity: 1; + transform: translateY(0); + } + to { + opacity: 0; + transform: translateY(-10px); + } +} diff --git a/packages/svelte/.storybook/styles/signature-pad.css b/packages/svelte/.storybook/styles/signature-pad.css new file mode 100644 index 0000000000..51d70e6d74 --- /dev/null +++ b/packages/svelte/.storybook/styles/signature-pad.css @@ -0,0 +1,36 @@ +[data-scope=signature-pad][data-part=root] { + position: relative; + display: flex; + flex-direction: column; + max-width: 400px; + width:100%; +} + +[data-scope=signature-pad][data-part=label] { + display: inline-block; + margin-block-end: 8px; +} + +[data-scope="signature-pad"][data-part="control"] { + height: 120px; + background-color: #efefef; + border-radius: 8px; +} + +[data-scope=signature-pad][data-part=guide] { + position: absolute; + bottom: 12%; + left: 8px; + right: 8px; + border-bottom: 1px dashed #2f2f2f; +} + +[data-scope=signature-pad][data-part=clear-trigger] { + position: absolute; + top: 8px; + right: 8px; + display: inline-flex; + align-items: center; + justify-content: center; + font-size: 1rem; +} \ No newline at end of file diff --git a/packages/svelte/.storybook/styles/slider.css b/packages/svelte/.storybook/styles/slider.css new file mode 100644 index 0000000000..dd9c1a9c83 --- /dev/null +++ b/packages/svelte/.storybook/styles/slider.css @@ -0,0 +1,129 @@ +.slider > * { + width: 100%; +} + +[data-scope="slider"][data-part="root"] { + max-width: 320px; + width: 100%; + display: flex; + flex-direction: column; +} + +[data-scope="slider"][data-part="root"][data-orientation="vertical"] { + height: 240px; +} + +[data-scope="slider"][data-part="control"] { + --slider-thumb-size: 20px; + --slider-track-height: 4px; + display: flex; + align-items: center; + justify-content: center; + position: relative; +} + +[data-scope="slider"][data-part="control"][data-orientation="horizontal"] { + height: var(--slider-thumb-size); +} + +[data-scope="slider"][data-part="control"][data-orientation="vertical"] { + width: var(--slider-thumb-size); +} + +[data-scope="slider"][data-part="thumb"] { + all: unset; + width: var(--slider-thumb-size); + height: var(--slider-thumb-size); + border-radius: 999px; + background: white; + box-shadow: rgba(0, 0, 0, 0.14) 0px 2px 10px; +} + +[data-scope="slider"][data-part="thumb"]:focus-visible { + box-shadow: rgb(0 0 0 / 22%) 0px 0px 0px 5px; +} + +[data-scope="slider"][data-part="thumb"]:hover:not([data-disabled]) { + background-color: rgb(245, 242, 255); +} + +[data-scope="slider"][data-part="thumb"][data-disabled] { + background-color: lightgray; +} + +[data-scope="slider"] .control-area { + margin-top: 12px; + display: flex; +} + +.slider [data-orientation="horizontal"] .control-area { + flex-direction: column; + width: 100%; +} + +.slider [data-orientation="vertical"] .control-area { + flex-direction: row; + height: 100%; +} + +[data-scope="slider"][data-part="track"] { + background: rgba(0, 0, 0, 0.2); + border-radius: 9999px; +} + +[data-scope="slider"][data-part="track"][data-orientation="horizontal"] { + height: var(--slider-track-height); + width: 100%; +} + +[data-scope="slider"][data-part="track"][data-orientation="vertical"] { + height: 100%; + width: var(--slider-track-height); +} + +[data-scope="slider"][data-part="range"] { + background: magenta; + border-radius: inherit; +} + +[data-scope="slider"][data-part="range"][data-disabled] { + background: rgba(0, 0, 0, 0.4); +} + +[data-scope="slider"][data-part="range"][data-orientation="horizontal"] { + height: 100%; +} + +[data-scope="slider"][data-part="range"][data-orientation="vertical"] { + width: 100%; +} + +[data-scope="slider"][data-part="value-text"] { + margin-inline-start: 12px; +} + +[data-scope="slider"][data-part="marker-group"][data-orientation="vertical"] { + height: 100%; +} + +[data-scope="slider"][data-part="marker"] { + color: lightgray; +} + +[data-scope="slider"][data-part="marker"]:is([data-state="under-value"], [data-state="at-value"]) { + color: red; +} + +[data-scope="slider"][data-part="dragging-indicator"] { + background: magenta; + border-radius: 4px; + padding: 2px 4px; + color: white; + &[data-orientation="horizontal"] { + top: calc(var(--slider-thumb-size) + 8px); + } + + &[data-orientation="vertical"] { + left: calc(var(--slider-thumb-size) + 8px); + } +} diff --git a/packages/svelte/.storybook/styles/splitter.css b/packages/svelte/.storybook/styles/splitter.css new file mode 100644 index 0000000000..0246a07d8c --- /dev/null +++ b/packages/svelte/.storybook/styles/splitter.css @@ -0,0 +1,27 @@ +[data-scope='splitter'][data-part='root'] { + gap: 4px; +} + +[data-scope='splitter'][data-part='root'][data-orientation='horizontal'] { + min-height: 300px; +} + +[data-scope='splitter'][data-part='root'][data-orientation='vertical'] { + min-height: 300px; +} + +[data-scope='splitter'][data-part='panel'] { + display: flex; + align-items: center; + justify-content: center; + border: 1px solid lightgray; + overflow: auto; +} + +[data-scope='splitter'][data-part='panel']:has([data-scope='splitter'][data-part='panel']) { + border: none; +} + +[data-scope='splitter'][data-part='resize-trigger'][data-orientation='vertical'] { + min-height: 12px; +} diff --git a/packages/svelte/.storybook/styles/steps.css b/packages/svelte/.storybook/styles/steps.css new file mode 100644 index 0000000000..9db55611b7 --- /dev/null +++ b/packages/svelte/.storybook/styles/steps.css @@ -0,0 +1,119 @@ +[data-scope="steps"][data-part="root"] { + width: 100%; + max-width: 400px; + display: flex; + gap: 16px; + + &[data-orientation="vertical"] { + flex-direction: row; + } + &[data-orientation="horizontal"] { + flex-direction: column; + } + } + + [data-scope="steps"][data-part="list"] { + display: flex; + justify-content: space-between; + --steps-gutter: 12px; + --steps-size: 24px; + --steps-icon-size: 20px; + + &[data-orientation="vertical"] { + flex-direction: column; + align-items: flex-start; + } + + &[data-orientation="horizontal"] { + flex-direction: row; + align-items: center; + } + } + + [data-scope="steps"][data-part="separator"] { + flex: 1; + background-color: gray; + + &[data-orientation="vertical"] { + position: absolute; + width: 2px; + height: 100%; + max-height: calc(100% - var(--steps-size) - var(--steps-gutter) * 2); + top: calc(var(--steps-size) + var(--steps-gutter)); + inset-inline-start: calc(var(--steps-size) / 2 - 1px); + } + + &[data-orientation="horizontal"] { + width: 100%; + height: 2px; + margin-inline: var(--steps-gutter); + } + + &[data-complete] { + background-color: blue; + } + } + + [data-scope="steps"][data-part="indicator"] { + display: flex; + justify-content: center; + align-items: center; + flex-shrink: 0; + border-radius: 9999px; + font-weight: 600; + width: var(--steps-size); + height: var(--steps-size); + + & svg { + flex-shrink: 0; + width: var(--steps-icon-size); + height: var(--steps-icon-size); + } + + &[data-incomplete] { + border-width: 2px; + } + + &[data-current] { + background-color: lightgray; + border-width: 2px; + border-color: blue; + color: darkblue; + } + + &[data-complete] { + background-color: blue; + color: white; + } + } + + [data-scope="steps"][data-part="item"] { + position: relative; + display: flex; + flex: 1 0 0; + + &:last-of-type { + flex: initial; + + & [data-part="separator"] { + display: none; + } + } + + &[data-orientation="vertical"] { + align-items: flex-start; + } + + &[data-orientation="horizontal"] { + align-items: center; + } + } + + [data-scope="steps"][data-part="trigger"] { + display: flex; + align-items: center; + gap: 12px; + text-align: start; + border-radius: 5px; + } + \ No newline at end of file diff --git a/packages/svelte/.storybook/styles/switch.css b/packages/svelte/.storybook/styles/switch.css new file mode 100644 index 0000000000..10204f389b --- /dev/null +++ b/packages/svelte/.storybook/styles/switch.css @@ -0,0 +1,84 @@ +[data-scope='switch'][data-part='root'] { + display: flex; + align-items: center; + position: relative; + width: fit-content; + + --switch-track-diff: calc(var(--switch-track-width) - var(--switch-track-height)); + --switch-thumb-x: var(--switch-track-diff); + --switch-track-width: 1.875rem; + --switch-track-height: 1rem; +} + +[data-scope='switch'][data-part='control'] { + display: inline-flex; + flex-shrink: 0; + -webkit-box-pack: start; + justify-content: flex-start; + box-sizing: content-box; + cursor: pointer; + border-radius: 9999px; + padding: 0.125rem; + width: var(--switch-track-width); + height: var(--switch-track-height); + transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, + transform; + transition-duration: 150ms; + + --switch-bg: #cbd5e0; + background: var(--switch-bg); +} + +[data-scope='switch'][data-part='control'][data-state='checked'] { + --switch-bg: #3182ce; +} + +[data-scope='switch'][data-part='control'][data-focus] { + box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.6); +} + +[data-scope='switch'][data-part='control'][data-disabled] { + opacity: 0.4; + cursor: not-allowed; +} + +[data-scope='switch'][data-part='thumb'] { + background: white; + transition-property: transform; + transition-duration: 200ms; + border-radius: inherit; + width: var(--switch-track-height); + height: var(--switch-track-height); + position: relative; +} + +[data-scope='switch'][data-part='thumb']:before { + transition: background-color 0.2s ease-in-out; + position: absolute; + --thumb-size: calc(var(--switch-track-height) + 0.7rem); + height: var(--thumb-size); + width: var(--thumb-size); + background-color: transparent; + content: ''; + z-index: 1; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + border-radius: inherit; +} + +[data-scope='switch'][data-part='thumb'][data-hover]:before { + background-color: rgba(0, 0, 0, 0.048); +} +[data-scope='switch'][data-part='thumb'][data-hover][data-state='checked']:before { + background-color: rgba(144, 202, 249, 0.295); +} + +[data-scope='switch'][data-part='thumb'][data-state='checked'] { + transform: translateX(var(--switch-thumb-x)); +} + +[data-scope='switch'][data-part='label'] { + user-select: none; + margin-inline-start: 0.5rem; +} diff --git a/packages/svelte/.storybook/styles/tabs.css b/packages/svelte/.storybook/styles/tabs.css new file mode 100644 index 0000000000..c8be01fd32 --- /dev/null +++ b/packages/svelte/.storybook/styles/tabs.css @@ -0,0 +1,123 @@ +[data-scope='tabs'][data-part='root'] { + max-width: 20em; +} + +[data-scope='tabs'][data-part='root'][data-orientation='vertical'] { + display: flex; +} + +[data-scope='tabs'][data-part='list'] { + margin: 0 0 -0.1em; + overflow: visible; +} + +[data-scope='tabs'][data-part='list'][data-orientation='vertical'] { + display: flex; + flex-direction: column; +} + +[data-scope='tabs'][data-part='trigger'] { + position: relative; + margin: 0; + padding: 0.3em 0.5em 0.4em; + border: 1px solid hsl(219, 1%, 72%); + border-radius: 0.2em 0.2em 0 0; + box-shadow: 0 0 0.2em hsl(219, 1%, 72%); + overflow: visible; + font-size: inherit; + background: hsl(220, 20%, 94%); +} + +[data-scope='tabs'][data-part='trigger']:hover, +[data-scope='tabs'][data-part='trigger']:focus, +[data-scope='tabs'][data-part='trigger']:active { + outline: 0; + border-radius: 0; + color: inherit; +} + +[data-scope='tabs'][data-part='trigger'][data-state='active'] { + border-radius: 0; + background: hsl(220, 43%, 99%); + outline: 0; +} + +[data-scope='tabs'][data-part='trigger'][data-state='active']:not(:focus):not(:hover)::before { + border-top: 5px solid hsl(218, 96%, 48%); +} + +[data-scope='tabs'][data-part='trigger'][data-state='active']::after { + position: absolute; + z-index: 3; + bottom: -1px; + right: 0; + left: 0; + height: 0.3em; + background: hsl(220, 43%, 99%); + box-shadow: none; + content: ''; +} + +[data-scope='tabs'][data-part='trigger']:hover::before, +[data-scope='tabs'][data-part='trigger']:focus::before { + border-color: hsl(20, 96%, 48%); +} + +[data-scope='tabs'][data-part='trigger']:hover::before, +[data-scope='tabs'][data-part='trigger']:focus::before, +[data-scope='tabs'][data-part='trigger'][data-state='active']::before { + position: absolute; + bottom: 100%; + right: -1px; + left: -1px; + border-radius: 0.2em 0.2em 0 0; + border-top: 3px solid hsl(20, 96%, 48%); + content: ''; +} + +[data-scope='tabs'][data-part='content'] { + position: relative; + z-index: 2; + padding: 0.5em 0.5em 0.7em; + border: 1px solid hsl(219, 1%, 72%); + border-radius: 0 0.2em 0.2em 0.2em; + box-shadow: 0 0 0.2em hsl(219, 1%, 72%); + background: hsl(220, 43%, 99%); +} + +[data-scope='tabs'][data-part='content'] p { + margin: 0; +} + +[data-scope='tabs'][data-part='content'] * + p { + margin-top: 1em; +} + +[data-scope='tabs'][data-part='content']:focus { + border-color: hsl(20, 96%, 48%); + box-shadow: 0 0 0.2em hsl(20, 96%, 48%); + outline: 0; +} + +[data-scope='tabs'][data-part='content']:focus::after { + position: absolute; + bottom: 0; + right: -1px; + left: -1px; + border-bottom: 3px solid hsl(20, 96%, 48%); + border-radius: 0 0 0.2em 0.2em; + content: ''; +} + +[data-scope='tabs'][data-part='indicator'] { + background-color: red; + z-index: 10; +} + +[data-scope='tabs'][data-part='indicator'][data-orientation='horizontal'] { + height: 4px; +} + +[data-scope='tabs'][data-part='indicator'][data-orientation='vertical'] { + width: 4px; +} diff --git a/packages/svelte/.storybook/styles/tags-input.css b/packages/svelte/.storybook/styles/tags-input.css new file mode 100644 index 0000000000..aab9433792 --- /dev/null +++ b/packages/svelte/.storybook/styles/tags-input.css @@ -0,0 +1,14 @@ +[data-scope='tags-input'][data-part='item-preview'] { + border-radius: 4px; + padding: 0 8px; + margin-right: 8px; +} + +[data-scope='tags-input'][data-part='control'] { + display: flex; + gap: 2px; +} + +[data-scope='tags-input'][data-part='item-preview'][data-highlighted] { + background-color: aqua; +} diff --git a/packages/svelte/.storybook/styles/time-picker.css b/packages/svelte/.storybook/styles/time-picker.css new file mode 100644 index 0000000000..e542980db9 --- /dev/null +++ b/packages/svelte/.storybook/styles/time-picker.css @@ -0,0 +1,61 @@ +[hidden] { + display: none !important; +} + +[data-scope="time-picker"][data-part="content"] { + border: 1px solid gray; + background: white; + border-radius: 8px; + overflow: hidden; + display: flex; + max-height: 200px; +} + +[data-scope="time-picker"][data-part="column"] { + display: flex; + gap: 4px; + flex-direction: column; + overflow-y: scroll; + padding: 4px; + + &[data-focus] { + background: rgb(247, 247, 247); + } + + /* hide scroll bar */ + scrollbar-width: none; + -ms-overflow-style: none; + &::-webkit-scrollbar { + display: none; + } + & + & { + border-inline-start: 1px solid rgb(209, 209, 209); + } +} + +[data-scope="time-picker"][data-part="spacer"] { + display: block; + flex-shrink: 0; + height: calc(100% - 36px); +} + +[data-scope="time-picker"][data-part="cell"] { + background: none; + border: none; + padding: 8px; + border-radius: 4px; + + &[data-now] { + background: lightblue; + } + + &[data-selected] { + background: purple; + color: white; + } + + &[data-disabled] { + opacity: 0.25; + cursor: not-allowed; + } +} diff --git a/packages/svelte/.storybook/styles/timer.css b/packages/svelte/.storybook/styles/timer.css new file mode 100644 index 0000000000..9998eb13fe --- /dev/null +++ b/packages/svelte/.storybook/styles/timer.css @@ -0,0 +1,26 @@ +[data-scope="timer"][data-part="root"] { + display: flex; + flex-direction: column; + gap: 1rem; +} + +[data-scope="timer"][data-part="area"] { + display: flex; + align-items: center; +} + +[data-scope="timer"][data-part="item"] { + font-size: 2rem; + font-weight: 500; +} + +[data-scope="timer"][data-part="separator"] { + font-size: 1rem; + font-weight: 500; + margin-inline: 0.5rem; +} + +[data-scope="timer"][data-part="control"] { + display: flex; + gap: 4px; +} diff --git a/packages/svelte/.storybook/styles/toast.css b/packages/svelte/.storybook/styles/toast.css new file mode 100644 index 0000000000..cd406fdf77 --- /dev/null +++ b/packages/svelte/.storybook/styles/toast.css @@ -0,0 +1,122 @@ +@keyframes spin { + from { + transform: rotate(0deg); + } + to { + transform: rotate(360deg); + } +} + +@keyframes shrink { + from { + transform: scaleX(1); + } + to { + transform: scaleX(0); + } +} + +[data-scope="toast"][data-part="root"] { + background: white; + padding: 8px 12px; + box-shadow: + 0 3px 10px rgba(0, 0, 0, 0.1), + 0 3px 3px rgba(0, 0, 0, 0.05); + width: 360px; + overflow-wrap: anywhere; + translate: var(--x) var(--y); + scale: var(--scale); + z-index: var(--z-index); + height: var(--height); + opacity: var(--opacity); + + will-change: translate, opacity, scale; + transition: + translate 400ms, + scale 400ms, + opacity 400ms, + height 400ms, + box-shadow 200ms; + transition-timing-function: cubic-bezier(0.21, 1.02, 0.73, 1); + + &[data-state="closed"] { + transition: + translate 400ms, + scale 400ms, + opacity 200ms; + transition-timing-function: cubic-bezier(0.06, 0.71, 0.55, 1); + } +} + +[data-scope="toast"][data-part="close-trigger"] { + position: absolute; + right: 8px; + top: 8px; + display: flex; + align-items: center; + justify-content: center; + width: 24px; + height: 24px; + font-size: 18px; + padding: 0; + + & svg { + width: 1em; + height: 1em; + } +} + +[data-scope="toast"][data-part="title"] { + display: flex; + align-items: center; + gap: 12px; +} + +[data-scope="toast"][data-part="root"][data-type="error"] { + background: red; + color: white; +} + +[data-scope="toast"][data-part="root"][data-type="info"] { + background: blue; + color: white; +} + +[data-scope="toast"][data-part="root"][data-type="warning"] { + background: orange; +} + +[data-scope="toast"][data-part="root"][data-type="success"] { + background: green; + color: white; +} + +[data-scope="toast"] .spinner { + animation: spin 1s linear infinite; +} + +[data-scope="toast"][data-part="progressbar"] { + height: 4px; + background: rgb(116, 116, 116); + width: 100%; + position: absolute; + bottom: 0; + inset-inline: 0; + animation-name: shrink; + animation-fill-mode: forwards; +} + +[data-scope="toast"][data-part="progressbar"][data-type="loading"] { + animation-name: none; +} + +@media (max-width: 640px) { + [data-scope="toast"][data-part="group"] { + width: 100%; + } + + [data-scope="toast"][data-part="root"] { + inset-inline: 0; + width: calc(100% - var(--gap) * 2); + } +} diff --git a/packages/svelte/.storybook/styles/toggle-group.css b/packages/svelte/.storybook/styles/toggle-group.css new file mode 100644 index 0000000000..e90bf37b44 --- /dev/null +++ b/packages/svelte/.storybook/styles/toggle-group.css @@ -0,0 +1,3 @@ +[data-state='on'] { + border-color: blue; +} diff --git a/packages/svelte/.storybook/styles/tooltip.css b/packages/svelte/.storybook/styles/tooltip.css new file mode 100644 index 0000000000..4b862ffc5e --- /dev/null +++ b/packages/svelte/.storybook/styles/tooltip.css @@ -0,0 +1,38 @@ +[data-scope='tooltip'][data-part='content'] { + background: black; + color: white; + padding: 6px 8px; + border-radius: 4px; + font-size: 14px; +} + +[data-scope='tooltip'][data-part='content'][data-state='open'] { + animation: fadeIn 0.5s ease-out; +} + +[data-scope='tooltip'][data-part='content'][data-state='closed'] { + animation: fadeOut 0.5s ease-in; +} + +[data-scope='tooltip'][data-part='arrow'] { + --arrow-size: 8px; + --arrow-background: black; +} + +@keyframes fadeIn { + from { + opacity: 0; + } + to { + opacity: 1; + } +} + +@keyframes fadeOut { + from { + opacity: 1; + } + to { + opacity: 0; + } +} diff --git a/packages/svelte/.storybook/styles/tree-view.css b/packages/svelte/.storybook/styles/tree-view.css new file mode 100644 index 0000000000..2e695815c0 --- /dev/null +++ b/packages/svelte/.storybook/styles/tree-view.css @@ -0,0 +1,98 @@ +[data-scope="tree-view"][data-part="tree"] { + margin-top: 20px; + width: 240px; +} + +[data-scope="tree-view"][data-part="item"], +[data-scope="tree-view"][data-part="branch-control"] { + user-select: none; + --padding-inline: 16px; + padding-inline-start: calc(var(--depth) * var(--padding-inline)); + padding-inline-end: var(--padding-inline); + display: flex; + align-items: center; + gap: 8px; + border-radius: 2px; + min-height: 32px; + + & svg { + width: 16px; + height: 16px; + opacity: 0.5; + } + + &:hover { + background: rgb(243, 243, 243); + } + + &[data-selected] { + background: rgb(226, 226, 226); + } + + &:focus { + outline: 1px solid rgb(148, 148, 148); + outline-offset: -1px; + } +} + +[data-scope="tree-view"][data-part="item-text"], +[data-scope="tree-view"][data-part="branch-text"] { + flex: 1; +} + +[data-scope="tree-view"][data-part="branch-content"] { + position: relative; + isolation: isolate; +} + +[data-scope="tree-view"][data-part="branch-indent-guide"] { + position: absolute; + content: ""; + border-left: 1px solid rgb(226, 226, 226); + height: 100%; + translate: calc(var(--depth) * 1.25rem); + z-index: 0; +} + +[data-scope="tree-view"][data-part="branch-indicator"] { + display: flex; + align-items: center; + &[data-state="open"] svg { + transform: rotate(90deg); + } +} + +@keyframes slideDown { + from { + opacity: 0.01; + height: 0; + } + to { + opacity: 1; + height: var(--height); + } +} + +@keyframes slideUp { + from { + opacity: 1; + height: var(--height); + } + to { + opacity: 0.01; + height: 0; + } +} + +[data-scope="tree-view"][data-part="branch-content"] { + overflow: hidden; + max-width: 400px; +} + +[data-scope="tree-view"][data-part="branch-content"][data-state="open"] { + animation: slideDown 250ms cubic-bezier(0, 0, 0.38, 0.9); +} + +[data-scope="tree-view"][data-part="branch-content"][data-state="closed"] { + animation: slideUp 200ms cubic-bezier(0, 0, 0.38, 0.9); +} diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md new file mode 100644 index 0000000000..fd338bec53 --- /dev/null +++ b/packages/svelte/CHANGELOG.md @@ -0,0 +1,11 @@ +--- +id: changelog +title: Changelog +description: All notable changes will be documented in this file. +--- + +## [Unreleased] + +### Added + +- Added `Avatar` component. diff --git a/packages/svelte/package.json b/packages/svelte/package.json index 759c0d8d1a..0174aca797 100644 --- a/packages/svelte/package.json +++ b/packages/svelte/package.json @@ -1,44 +1,84 @@ { "name": "@ark-ui/svelte", "version": "0.0.1", - "scripts": { - "dev": "vite dev", - "preview": "vite preview", - "package": "svelte-kit sync && svelte-package && publint", - "prepublishOnly": "npm run package", - "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json", - "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch", - "test": "vitest" + "description": "A collection of unstyled, accessible UI components for Svelte", + "keywords": ["avatar", "svelte"], + "license": "MIT", + "homepage": "https://ark-ui.com", + "repository": { + "type": "git", + "url": "git+https://github.com/chakra-ui/ark.git", + "directory": "packages/svelte" }, + "bugs": { + "url": "https://github.com/chakra-ui/ark/issues" + }, + "type": "module", + "svelte": "./dist/index.js", + "types": "./dist/index.d.ts", + "files": ["dist", "!dist/**/*.stories.*", "!dist/**/examples/**", "!dist/**/*.test.*"], "exports": { ".": { - "types": "./dist/index.d.ts", - "svelte": "./dist/index.js" + "types": "./src/lib/index.ts", + "svelte": "./src/lib/index.ts" + }, + "./*": { + "types": "./src/lib/components/*/index.ts", + "svelte": "./src/lib/components/*/index.ts" } }, - "files": ["dist", "!dist/**/*.test.*", "!dist/**/*.spec.*"], - "peerDependencies": { - "svelte": "5.1.3" + "scripts": { + "build": "svelte-kit sync && svelte-package", + "dev": "vite dev", + "storybook": "storybook dev -p 6006", + "test": "vitest", + "test:ci": "vitest --run", + "typecheck": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json", + "release-it": "release-it --config ../../release-it.json", + "prepack": "clean-package", + "postpack": "clean-package restore" + }, + "clean-package": { + "replace": { + "exports.\\..svelte": "./dist/index.js", + "exports.\\..types": "./dist/index.d.ts", + "exports.\\./*.svelte": "./dist/components/*/index.js", + "exports.\\./*.types": "./dist/components/*/index.d.ts" + } + }, + "publishConfig": { + "access": "public" }, + "sideEffects": false, "dependencies": { "@zag-js/avatar": "0.77.1", "@zag-js/core": "0.77.1", - "@zag-js/svelte": "0.77.1" + "@zag-js/svelte": "0.77.1", + "nanoid": "5.0.9" }, "devDependencies": { + "@release-it/keep-a-changelog": "5.0.0", + "@storybook/addon-a11y": "8.4.5", + "@storybook/addon-essentials": "8.4.5", + "@storybook/sveltekit": "8.4.5", "@sveltejs/adapter-auto": "3.3.1", "@sveltejs/kit": "2.8.4", "@sveltejs/package": "2.3.7", "@sveltejs/vite-plugin-svelte": "4.0.2", - "publint": "0.2.12", - "svelte": "5.2.3", + "@testing-library/jest-dom": "6.6.3", + "@testing-library/svelte": "5.2.6", + "@testing-library/user-event": "14.5.2", + "clean-package": "2.2.0", + "release-it": "17.10.0", + "storybook": "8.4.5", + "svelte": "5.2.8", "svelte-check": "4.1.0", "tslib": "2.8.1", "typescript": "5.6.3", "vite": "5.4.11", "vitest": "2.1.5" }, - "svelte": "./dist/index.js", - "types": "./dist/index.d.ts", - "type": "module" + "peerDependencies": { + "svelte": ">=5.0.0" + } } diff --git a/packages/svelte/src/index.test.ts b/packages/svelte/src/index.test.ts deleted file mode 100644 index 31ae142976..0000000000 --- a/packages/svelte/src/index.test.ts +++ /dev/null @@ -1,7 +0,0 @@ -import { describe, expect, it } from 'vitest' - -describe('sum test', () => { - it('adds 1 + 2 to equal 3', () => { - expect(1 + 2).toBe(3) - }) -}) diff --git a/packages/svelte/src/lib/components/avatar/avatar-context.svelte b/packages/svelte/src/lib/components/avatar/avatar-context.svelte new file mode 100644 index 0000000000..a16494ee51 --- /dev/null +++ b/packages/svelte/src/lib/components/avatar/avatar-context.svelte @@ -0,0 +1,17 @@ + + + + +{@render api?.(avatar)} diff --git a/packages/svelte/src/lib/components/avatar/avatar-fallback.svelte b/packages/svelte/src/lib/components/avatar/avatar-fallback.svelte index a398b0c811..f731263ec7 100644 --- a/packages/svelte/src/lib/components/avatar/avatar-fallback.svelte +++ b/packages/svelte/src/lib/components/avatar/avatar-fallback.svelte @@ -1,20 +1,18 @@ - - + - -
-{@render children()} +
+ {@render props.children?.()}
- - \ No newline at end of file diff --git a/packages/svelte/src/lib/components/avatar/avatar-image.svelte b/packages/svelte/src/lib/components/avatar/avatar-image.svelte index 76cba371ac..d588f29b7c 100644 --- a/packages/svelte/src/lib/components/avatar/avatar-image.svelte +++ b/packages/svelte/src/lib/components/avatar/avatar-image.svelte @@ -1,18 +1,16 @@ - - + - - - - \ No newline at end of file + diff --git a/packages/svelte/src/lib/components/avatar/avatar-root-provider.svelte b/packages/svelte/src/lib/components/avatar/avatar-root-provider.svelte new file mode 100644 index 0000000000..d91940c2b8 --- /dev/null +++ b/packages/svelte/src/lib/components/avatar/avatar-root-provider.svelte @@ -0,0 +1,26 @@ + + + + +
+ {@render props.children?.()} +
diff --git a/packages/svelte/src/lib/components/avatar/avatar-root.svelte b/packages/svelte/src/lib/components/avatar/avatar-root.svelte index b279ce328d..6971cfda60 100644 --- a/packages/svelte/src/lib/components/avatar/avatar-root.svelte +++ b/packages/svelte/src/lib/components/avatar/avatar-root.svelte @@ -1,21 +1,28 @@ - - -
- {@render children()} + +
+ {@render props.children?.()}
diff --git a/packages/svelte/src/lib/components/avatar/avatar.anatomy.ts b/packages/svelte/src/lib/components/avatar/avatar.anatomy.ts new file mode 100644 index 0000000000..c738affd3f --- /dev/null +++ b/packages/svelte/src/lib/components/avatar/avatar.anatomy.ts @@ -0,0 +1 @@ +export { anatomy as avatarAnatomy } from '@zag-js/avatar' diff --git a/packages/svelte/src/lib/components/avatar/avatar.stories.ts b/packages/svelte/src/lib/components/avatar/avatar.stories.ts new file mode 100644 index 0000000000..198153c88e --- /dev/null +++ b/packages/svelte/src/lib/components/avatar/avatar.stories.ts @@ -0,0 +1,28 @@ +import type { Meta } from '@storybook/svelte' +import BasicExample from './examples/basic.svelte' +import ContextExample from './examples/context.svelte' +import RootProviderExample from './examples/root-provider.svelte' + +const meta = { + title: 'Components / Avatar', +} as Meta + +export default meta + +export const Basic = { + render: () => ({ + Component: BasicExample, + }), +} + +export const RootProvider = { + render: () => ({ + Component: RootProviderExample, + }), +} + +export const Context = { + render: () => ({ + Component: ContextExample, + }), +} diff --git a/packages/svelte/src/lib/components/avatar/avatar.test.ts b/packages/svelte/src/lib/components/avatar/avatar.test.ts new file mode 100644 index 0000000000..af64016475 --- /dev/null +++ b/packages/svelte/src/lib/components/avatar/avatar.test.ts @@ -0,0 +1,10 @@ +import { render, screen } from '@testing-library/svelte' +import { describe, expect, it } from 'vitest' +import ComponentUnderTest from './examples/basic.svelte' + +describe('Avatar', async () => { + it("should render the user's initials", async () => { + render(ComponentUnderTest) + expect(screen.getByText('PA')).toBeInTheDocument() + }) +}) diff --git a/packages/svelte/src/lib/components/avatar/avatar.ts b/packages/svelte/src/lib/components/avatar/avatar.ts new file mode 100644 index 0000000000..61b5ca7714 --- /dev/null +++ b/packages/svelte/src/lib/components/avatar/avatar.ts @@ -0,0 +1,25 @@ +export type { StatusChangeDetails } from '@zag-js/avatar' +export { + default as Context, + type AvatarContextProps as ContextProps, +} from './avatar-context.svelte' +export { + default as Fallback, + type AvatarFallbackProps as FallbackProps, + type AvatarFallbackBaseProps as FallbackBaseProps, +} from './avatar-fallback.svelte' +export { + default as Image, + type AvatarImageProps as ImageProps, + type AvatarImageBaseProps as ImageBaseProps, +} from './avatar-image.svelte' +export { + default as RootProvider, + type AvatarRootProviderProps as RootProviderProps, + type AvatarRootProviderBaseProps as RootProviderBaseProps, +} from './avatar-root-provider.svelte' +export { + default as Root, + type AvatarRootBaseProps as RootBaseProps, + type AvatarRootProps as RootProps, +} from './avatar-root.svelte' diff --git a/packages/svelte/src/lib/components/avatar/examples/basic.svelte b/packages/svelte/src/lib/components/avatar/examples/basic.svelte new file mode 100644 index 0000000000..b4b5c32a6b --- /dev/null +++ b/packages/svelte/src/lib/components/avatar/examples/basic.svelte @@ -0,0 +1,8 @@ + + + + PA + + diff --git a/packages/svelte/src/lib/components/avatar/examples/context.svelte b/packages/svelte/src/lib/components/avatar/examples/context.svelte new file mode 100644 index 0000000000..2c00d54bf1 --- /dev/null +++ b/packages/svelte/src/lib/components/avatar/examples/context.svelte @@ -0,0 +1,18 @@ + + + + + {#snippet api(avatar)} + + {#if avatar().loaded} +

PA

+ {:else} +

Loading

+ {/if} + + {/snippet} + + + diff --git a/packages/svelte/src/lib/components/avatar/examples/root-provider.svelte b/packages/svelte/src/lib/components/avatar/examples/root-provider.svelte new file mode 100644 index 0000000000..ee8899ff27 --- /dev/null +++ b/packages/svelte/src/lib/components/avatar/examples/root-provider.svelte @@ -0,0 +1,18 @@ + + + + + + PA + + diff --git a/packages/svelte/src/lib/components/avatar/index.ts b/packages/svelte/src/lib/components/avatar/index.ts index 8360879d4f..018bba0cf3 100644 --- a/packages/svelte/src/lib/components/avatar/index.ts +++ b/packages/svelte/src/lib/components/avatar/index.ts @@ -1,11 +1,27 @@ export type { StatusChangeDetails as AvatarStatusChangeDetails } from '@zag-js/avatar' -// export { default as AvatarContext, type AvatarContextProps } from './avatar-context.svelte' -export { default as AvatarFallback, type AvatarFallbackProps } from './avatar-fallback.svelte' -export { default as AvatarImage, type AvatarImageProps } from './avatar-image.svelte' +export { default as AvatarContext } from './avatar-context.svelte' +export { + default as AvatarFallback, + type AvatarFallbackProps, + type AvatarFallbackBaseProps, +} from './avatar-fallback.svelte' +export { + default as AvatarImage, + type AvatarImageProps, + type AvatarImageBaseProps, +} from './avatar-image.svelte' export { default as AvatarRoot, + type AvatarRootBaseProps, type AvatarRootProps, } from './avatar-root.svelte' export { useAvatarContext, type UseAvatarContext } from './use-avatar-context' +export { useAvatar, type UseAvatarProps, type UseAvatarReturn } from './use-avatar.svelte' +export { + default as AvatarRootProvider, + type AvatarRootProviderProps, + type AvatarRootProviderBaseProps, +} from './avatar-root-provider.svelte' +export { avatarAnatomy } from './avatar.anatomy' -// export * as Avatar from './avatar' +export * as Avatar from './avatar' diff --git a/packages/svelte/src/lib/components/avatar/use-avatar-context.ts b/packages/svelte/src/lib/components/avatar/use-avatar-context.ts index a2dc8cf55c..aebd6fd0e1 100644 --- a/packages/svelte/src/lib/components/avatar/use-avatar-context.ts +++ b/packages/svelte/src/lib/components/avatar/use-avatar-context.ts @@ -1,4 +1,4 @@ -import { createContext } from '../../utils' +import { createContext } from '$lib/utils/create-context' import type { UseAvatarReturn } from './use-avatar.svelte' export interface UseAvatarContext extends UseAvatarReturn {} diff --git a/packages/svelte/src/lib/components/avatar/use-avatar.svelte.ts b/packages/svelte/src/lib/components/avatar/use-avatar.svelte.ts index 7907ffb732..45fa66f7ca 100644 --- a/packages/svelte/src/lib/components/avatar/use-avatar.svelte.ts +++ b/packages/svelte/src/lib/components/avatar/use-avatar.svelte.ts @@ -1,19 +1,19 @@ +import type { Accessor, Optional } from '$lib/types' +import { createId } from '$lib/utils/create-id' import * as avatar from '@zag-js/avatar' import { type PropTypes, normalizeProps, useMachine } from '@zag-js/svelte' -import type { Optional } from '../../../typts' export interface UseAvatarProps extends Optional, 'id'> {} -export interface UseAvatarReturn extends avatar.Api {} +export interface UseAvatarReturn extends Accessor> {} -export const useAvatar = (props: UseAvatarProps) => { - const [snapshot, send] = useMachine(avatar.machine({ id: '1' })) - const _api = avatar.connect(snapshot, send, normalizeProps) - const api = $derived(_api) - - return new Proxy(api, { - get(_, key: keyof typeof api) { - return api[key] - }, +export const useAvatar = (props: UseAvatarProps = {}) => { + const context = $derived({ + id: createId(), + ...props, }) + + const [state, send] = useMachine(avatar.machine(context), { context }) + const api = $derived(() => avatar.connect(state, send, normalizeProps)) + return api } diff --git a/packages/svelte/src/lib/types.ts b/packages/svelte/src/lib/types.ts new file mode 100644 index 0000000000..bf034f9fe9 --- /dev/null +++ b/packages/svelte/src/lib/types.ts @@ -0,0 +1,9 @@ +import type { SvelteHTMLElements } from 'svelte/elements' + +export type Assign = Omit & U +export type Optional = Pick, K> & Omit + +export type CollectionItem = string | object + +export type HTMLProps = SvelteHTMLElements[T] +export type Accessor = () => T diff --git a/packages/svelte/src/lib/utils/create-id.ts b/packages/svelte/src/lib/utils/create-id.ts new file mode 100644 index 0000000000..e7c2bbb68a --- /dev/null +++ b/packages/svelte/src/lib/utils/create-id.ts @@ -0,0 +1,4 @@ +import { nanoid } from 'nanoid/non-secure' + +// TODO https://github.com/sveltejs/svelte/issues/7517 +export const createId = () => nanoid(10) diff --git a/packages/svelte/src/lib/utils/create-split-props.ts b/packages/svelte/src/lib/utils/create-split-props.ts new file mode 100644 index 0000000000..d5b6d221ea --- /dev/null +++ b/packages/svelte/src/lib/utils/create-split-props.ts @@ -0,0 +1,25 @@ +type EnsureKeys< + ExpectedKeys extends (keyof Target)[], + Target, +> = keyof Target extends ExpectedKeys[number] + ? unknown + : `Missing required keys: ${Exclude & string}` + +export const createSplitProps = + () => + ( + props: Props, + keys: Keys & EnsureKeys, + ) => + (keys as string[]).reduce<[Target, Omit>]>( + (previousValue, currentValue) => { + const [target, source] = previousValue + const key = currentValue as keyof Target & keyof typeof source + if (source[key] !== undefined) { + target[key] = source[key] + } + delete source[key] + return [target, source] + }, + [{} as Target, { ...props }], + ) diff --git a/packages/svelte/src/lib/utils/index.ts b/packages/svelte/src/lib/utils/index.ts deleted file mode 100644 index 365408a04a..0000000000 --- a/packages/svelte/src/lib/utils/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { createContext } from './create-context' diff --git a/packages/svelte/src/routes/+page.svelte b/packages/svelte/src/routes/+page.svelte index a660466dac..fb3ee53272 100644 --- a/packages/svelte/src/routes/+page.svelte +++ b/packages/svelte/src/routes/+page.svelte @@ -1,10 +1,8 @@ - -

Welcome to your library project

- - CS - - - \ No newline at end of file + + + CS + + diff --git a/packages/svelte/src/test-setup.ts b/packages/svelte/src/test-setup.ts new file mode 100644 index 0000000000..a9d0dd31aa --- /dev/null +++ b/packages/svelte/src/test-setup.ts @@ -0,0 +1 @@ +import '@testing-library/jest-dom/vitest' diff --git a/packages/svelte/src/typts.d.ts b/packages/svelte/src/typts.d.ts deleted file mode 100644 index dd849ceb51..0000000000 --- a/packages/svelte/src/typts.d.ts +++ /dev/null @@ -1,3 +0,0 @@ -export type Assign = Omit & U -export type Optional = Pick, K> & Omit -export type CollectionItem = string | object diff --git a/packages/svelte/src/typts.ts b/packages/svelte/src/typts.ts deleted file mode 100644 index 182c69dd66..0000000000 --- a/packages/svelte/src/typts.ts +++ /dev/null @@ -1,4 +0,0 @@ -export type Assign = Omit & U -export type Optional = Pick, K> & Omit - -export type CollectionItem = string | object diff --git a/packages/svelte/static/favicon.png b/packages/svelte/static/favicon.png deleted file mode 100644 index 825b9e65af7c104cfb07089bb28659393b4f2097..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1571 zcmV+;2Hg3HP)Px)-AP12RCwC$UE6KzI1p6{F2N z1VK2vi|pOpn{~#djwYcWXTI_im_u^TJgMZ4JMOsSj!0ma>B?-(Hr@X&W@|R-$}W@Z zgj#$x=!~7LGqHW?IO8+*oE1MyDp!G=L0#^lUx?;!fXv@l^6SvTnf^ac{5OurzC#ZMYc20lI%HhX816AYVs1T3heS1*WaWH z%;x>)-J}YB5#CLzU@GBR6sXYrD>Vw(Fmt#|JP;+}<#6b63Ike{Fuo!?M{yEffez;| zp!PfsuaC)>h>-AdbnwN13g*1LowNjT5?+lFVd#9$!8Z9HA|$*6dQ8EHLu}U|obW6f z2%uGv?vr=KNq7YYa2Roj;|zooo<)lf=&2yxM@e`kM$CmCR#x>gI>I|*Ubr({5Y^rb zghxQU22N}F51}^yfDSt786oMTc!W&V;d?76)9KXX1 z+6Okem(d}YXmmOiZq$!IPk5t8nnS{%?+vDFz3BevmFNgpIod~R{>@#@5x9zJKEHLHv!gHeK~n)Ld!M8DB|Kfe%~123&Hz1Z(86nU7*G5chmyDe ziV7$pB7pJ=96hpxHv9rCR29%bLOXlKU<_13_M8x)6;P8E1Kz6G<&P?$P^%c!M5`2` zfY2zg;VK5~^>TJGQzc+33-n~gKt{{of8GzUkWmU110IgI0DLxRIM>0US|TsM=L|@F z0Bun8U!cRB7-2apz=y-7*UxOxz@Z0)@QM)9wSGki1AZ38ceG7Q72z5`i;i=J`ILzL z@iUO?SBBG-0cQuo+an4TsLy-g-x;8P4UVwk|D8{W@U1Zi z!M)+jqy@nQ$p?5tsHp-6J304Q={v-B>66$P0IDx&YT(`IcZ~bZfmn11#rXd7<5s}y zBi9eim&zQc0Dk|2>$bs0PnLmDfMP5lcXRY&cvJ=zKxI^f0%-d$tD!`LBf9^jMSYUA zI8U?CWdY@}cRq6{5~y+)#h1!*-HcGW@+gZ4B};0OnC~`xQOyH19z*TA!!BJ%9s0V3F?CAJ{hTd#*tf+ur-W9MOURF-@B77_-OshsY}6 zOXRY=5%C^*26z?l)1=$bz30!so5tfABdSYzO+H=CpV~aaUefmjvfZ3Ttu9W&W3Iu6 zROlh0MFA5h;my}8lB0tAV-Rvc2Zs_CCSJnx@d`**$idgy-iMob4dJWWw|21b4NB=LfsYp0Aeh{Ov)yztQi;eL4y5 zMi>8^SzKqk8~k?UiQK^^-5d8c%bV?$F8%X~czyiaKCI2=UH