From 3259b35d60dfb6f81ad63a4a499f0b22d8a01f92 Mon Sep 17 00:00:00 2001 From: Claire Olmstead Date: Thu, 10 Oct 2024 11:59:45 -0700 Subject: [PATCH 1/3] add accordion, accorfion list, and icon stories --- components.json | 26 +++++++++---------- package-lock.json | 17 +++++++++--- package.json | 3 ++- src/assets/Check.svelte | 10 ------- src/assets/Chevron.svelte | 3 --- src/icons/Check.svelte | 20 ++++++++++++++ src/icons/Chevron.svelte | 9 +++++++ src/{assets => icons}/Error.svelte | 0 src/icons/Icons.stories.svelte | 25 ++++++++++++++++++ src/lib/features/Accordion.stories.svelte | 12 +++++++++ src/lib/features/Accordion.svelte | 13 ++++++++++ src/lib/features/AccordionList.stories.svelte | 18 +++++++++++++ src/lib/features/AccordionList.svelte | 7 +++++ .../ui/accordion/accordion-content.svelte | 25 ++++++++++++++++++ .../ui/accordion/accordion-item.svelte | 14 ++++++++++ .../ui/accordion/accordion-trigger.svelte | 26 +++++++++++++++++++ .../shadcnComponents/ui/accordion/index.ts | 17 ++++++++++++ .../ui/select/select-trigger.svelte | 6 ++--- 18 files changed, 217 insertions(+), 34 deletions(-) delete mode 100644 src/assets/Check.svelte delete mode 100644 src/assets/Chevron.svelte create mode 100644 src/icons/Check.svelte create mode 100644 src/icons/Chevron.svelte rename src/{assets => icons}/Error.svelte (100%) create mode 100644 src/icons/Icons.stories.svelte create mode 100644 src/lib/features/Accordion.stories.svelte create mode 100644 src/lib/features/Accordion.svelte create mode 100644 src/lib/features/AccordionList.stories.svelte create mode 100644 src/lib/features/AccordionList.svelte create mode 100644 src/lib/shadcnComponents/ui/accordion/accordion-content.svelte create mode 100644 src/lib/shadcnComponents/ui/accordion/accordion-item.svelte create mode 100644 src/lib/shadcnComponents/ui/accordion/accordion-trigger.svelte create mode 100644 src/lib/shadcnComponents/ui/accordion/index.ts diff --git a/components.json b/components.json index f0a7d4e..8de717f 100644 --- a/components.json +++ b/components.json @@ -1,14 +1,14 @@ { - "$schema": "https://shadcn-svelte.com/schema.json", - "style": "default", - "tailwind": { - "config": "tailwind.config.js", - "css": "src/index.css", - "baseColor": "slate" - }, - "aliases": { - "components": "src/lib/shadcnComponents", - "utils": "src/utils" - }, - "typescript": true -} \ No newline at end of file + "$schema": "https://shadcn-svelte.com/schema.json", + "style": "default", + "tailwind": { + "config": "tailwind.config.js", + "css": "src/index.css", + "baseColor": "slate" + }, + "aliases": { + "components": "$src/lib/shadcnComponents", + "utils": "$src/utils" + }, + "typescript": true +} diff --git a/package-lock.json b/package-lock.json index 176c8be..7233a9a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,8 +10,9 @@ "license": "Apache-2.0", "dependencies": { "@storybook/addons": "^7.6.17", - "bits-ui": "^0.21.15", + "bits-ui": "^0.21.16", "clsx": "^2.1.1", + "lucide-svelte": "^0.451.0", "svelte": "^4.2.19", "tailwind-merge": "^2.5.2" }, @@ -2860,9 +2861,9 @@ } }, "node_modules/bits-ui": { - "version": "0.21.15", - "resolved": "https://registry.npmjs.org/bits-ui/-/bits-ui-0.21.15.tgz", - "integrity": "sha512-+m5WSpJnFdCcNdXSTIVC1WYBozipO03qRh03GFWgrdxoHiolCfwW71EYG4LPCWYPG6KcTZV0Cj6iHSiZ7cdKdg==", + "version": "0.21.16", + "resolved": "https://registry.npmjs.org/bits-ui/-/bits-ui-0.21.16.tgz", + "integrity": "sha512-XFZ7/bK7j/K+5iktxX/ZpmoFHjYjpPzP5EOO/4bWiaFg5TG1iMcfjDhlBTQnJxD6BoVoHuqeZPHZvaTgF4Iv3Q==", "dependencies": { "@internationalized/date": "^3.5.1", "@melt-ui/svelte": "0.76.2", @@ -5532,6 +5533,14 @@ "node": ">=10" } }, + "node_modules/lucide-svelte": { + "version": "0.451.0", + "resolved": "https://registry.npmjs.org/lucide-svelte/-/lucide-svelte-0.451.0.tgz", + "integrity": "sha512-aia5ytiruEtdaisEJR/4eF5HFPj+LzyHa412pygern87f2CoOO/6gYqKpmy8UD1rH9VaL2RnEkgWPWxxTVMcKw==", + "peerDependencies": { + "svelte": "^3 || ^4 || ^5.0.0-next.42" + } + }, "node_modules/lz-string": { "version": "1.5.0", "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz", diff --git a/package.json b/package.json index 544a072..3b93d50 100644 --- a/package.json +++ b/package.json @@ -59,8 +59,9 @@ }, "dependencies": { "@storybook/addons": "^7.6.17", - "bits-ui": "^0.21.15", + "bits-ui": "^0.21.16", "clsx": "^2.1.1", + "lucide-svelte": "^0.451.0", "svelte": "^4.2.19", "tailwind-merge": "^2.5.2" } diff --git a/src/assets/Check.svelte b/src/assets/Check.svelte deleted file mode 100644 index 0b643fc..0000000 --- a/src/assets/Check.svelte +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - - - - diff --git a/src/assets/Chevron.svelte b/src/assets/Chevron.svelte deleted file mode 100644 index 9f16e7f..0000000 --- a/src/assets/Chevron.svelte +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/src/icons/Check.svelte b/src/icons/Check.svelte new file mode 100644 index 0000000..f8bbd09 --- /dev/null +++ b/src/icons/Check.svelte @@ -0,0 +1,20 @@ + + + + + + + + + + diff --git a/src/icons/Chevron.svelte b/src/icons/Chevron.svelte new file mode 100644 index 0000000..454a960 --- /dev/null +++ b/src/icons/Chevron.svelte @@ -0,0 +1,9 @@ + + + + + diff --git a/src/assets/Error.svelte b/src/icons/Error.svelte similarity index 100% rename from src/assets/Error.svelte rename to src/icons/Error.svelte diff --git a/src/icons/Icons.stories.svelte b/src/icons/Icons.stories.svelte new file mode 100644 index 0000000..2ec7db7 --- /dev/null +++ b/src/icons/Icons.stories.svelte @@ -0,0 +1,25 @@ + + + + + +
+ {#each Object.entries(icons) as [name, Icon]} +
+

{name}

+ +
+ {/each} +
+
diff --git a/src/lib/features/Accordion.stories.svelte b/src/lib/features/Accordion.stories.svelte new file mode 100644 index 0000000..09bae4f --- /dev/null +++ b/src/lib/features/Accordion.stories.svelte @@ -0,0 +1,12 @@ + + + + + + + + diff --git a/src/lib/features/Accordion.svelte b/src/lib/features/Accordion.svelte new file mode 100644 index 0000000..3f8303b --- /dev/null +++ b/src/lib/features/Accordion.svelte @@ -0,0 +1,13 @@ + + + + + {trigger} + {content} + + diff --git a/src/lib/features/AccordionList.stories.svelte b/src/lib/features/AccordionList.stories.svelte new file mode 100644 index 0000000..0c41506 --- /dev/null +++ b/src/lib/features/AccordionList.stories.svelte @@ -0,0 +1,18 @@ + + + + + + + + + + + + + diff --git a/src/lib/features/AccordionList.svelte b/src/lib/features/AccordionList.svelte new file mode 100644 index 0000000..5eddfd9 --- /dev/null +++ b/src/lib/features/AccordionList.svelte @@ -0,0 +1,7 @@ + + + + + diff --git a/src/lib/shadcnComponents/ui/accordion/accordion-content.svelte b/src/lib/shadcnComponents/ui/accordion/accordion-content.svelte new file mode 100644 index 0000000..3d065d3 --- /dev/null +++ b/src/lib/shadcnComponents/ui/accordion/accordion-content.svelte @@ -0,0 +1,25 @@ + + + +
+ +
+
diff --git a/src/lib/shadcnComponents/ui/accordion/accordion-item.svelte b/src/lib/shadcnComponents/ui/accordion/accordion-item.svelte new file mode 100644 index 0000000..dc14460 --- /dev/null +++ b/src/lib/shadcnComponents/ui/accordion/accordion-item.svelte @@ -0,0 +1,14 @@ + + + + + diff --git a/src/lib/shadcnComponents/ui/accordion/accordion-trigger.svelte b/src/lib/shadcnComponents/ui/accordion/accordion-trigger.svelte new file mode 100644 index 0000000..caca9e6 --- /dev/null +++ b/src/lib/shadcnComponents/ui/accordion/accordion-trigger.svelte @@ -0,0 +1,26 @@ + + + + svg]:rotate-180', + className + )} + {...$$restProps} + on:click + > + + + + diff --git a/src/lib/shadcnComponents/ui/accordion/index.ts b/src/lib/shadcnComponents/ui/accordion/index.ts new file mode 100644 index 0000000..ed49213 --- /dev/null +++ b/src/lib/shadcnComponents/ui/accordion/index.ts @@ -0,0 +1,17 @@ +import { Accordion as AccordionPrimitive } from "bits-ui"; +import Content from "./accordion-content.svelte"; +import Item from "./accordion-item.svelte"; +import Trigger from "./accordion-trigger.svelte"; +const Root = AccordionPrimitive.Root; + +export { + Root, + Content, + Item, + Trigger, + // + Root as Accordion, + Content as AccordionContent, + Item as AccordionItem, + Trigger as AccordionTrigger, +}; diff --git a/src/lib/shadcnComponents/ui/select/select-trigger.svelte b/src/lib/shadcnComponents/ui/select/select-trigger.svelte index a1cb8d3..83d89cc 100644 --- a/src/lib/shadcnComponents/ui/select/select-trigger.svelte +++ b/src/lib/shadcnComponents/ui/select/select-trigger.svelte @@ -1,7 +1,7 @@ - ; + }; + slots: {}; + exports?: undefined; + bindings?: undefined; +}; +export type ChevronProps = typeof __propDef.props; +export type ChevronEvents = typeof __propDef.events; +export type ChevronSlots = typeof __propDef.slots; +export default class Chevron extends SvelteComponent { +} +export {}; diff --git a/src/lib/shadcnComponents/ui/select/select-item.svelte b/src/lib/shadcnComponents/ui/select/select-item.svelte index 5bf52e6..5cab81e 100644 --- a/src/lib/shadcnComponents/ui/select/select-item.svelte +++ b/src/lib/shadcnComponents/ui/select/select-item.svelte @@ -1,5 +1,5 @@