From 5f30dad182bcf60a37bedfe3fbed5fef44cd8335 Mon Sep 17 00:00:00 2001 From: HerozDotExe <66215011+HerozDotExe@users.noreply.github.com> Date: Sun, 8 Dec 2024 20:48:48 +0100 Subject: [PATCH] refactor: moved shadcn components to renderer --- electron.vite.config.ts | 2 +- package.json | 1 + pnpm-lock.yaml | 89 +++++++++++++++++++ src/lib/components/ui/button/button.svelte | 74 --------------- src/lib/components/ui/button/index.ts | 17 ---- src/renderer/src/App.svelte | 12 +++ .../lib/components/ui/button/button.svelte | 25 ++++++ .../src/lib/components/ui/button/index.ts | 49 ++++++++++ src/{ => renderer/src}/lib/utils.ts | 0 tsconfig.json | 4 +- 10 files changed, 179 insertions(+), 94 deletions(-) delete mode 100644 src/lib/components/ui/button/button.svelte delete mode 100644 src/lib/components/ui/button/index.ts create mode 100644 src/renderer/src/lib/components/ui/button/button.svelte create mode 100644 src/renderer/src/lib/components/ui/button/index.ts rename src/{ => renderer/src}/lib/utils.ts (100%) diff --git a/electron.vite.config.ts b/electron.vite.config.ts index 54253b7..d2d9a84 100644 --- a/electron.vite.config.ts +++ b/electron.vite.config.ts @@ -9,7 +9,7 @@ export default { renderer: defineConfig({ resolve: { alias: { - $lib: path.resolve('./src/lib') + $lib: path.resolve('./src/renderer/src/lib') } }, plugins: [svelte()] diff --git a/package.json b/package.json index e1f4eab..8bae5ca 100644 --- a/package.json +++ b/package.json @@ -25,6 +25,7 @@ "@sveltejs/vite-plugin-svelte": "^5.0.0", "@tsconfig/svelte": "^5.0.4", "autoprefixer": "^10.4.20", + "bits-ui": "^0.21.16", "clsx": "^2.1.1", "electron": "^33.2.1", "electron-builder": "^25.1.8", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 3957490..e8b18d1 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -30,6 +30,9 @@ importers: autoprefixer: specifier: ^10.4.20 version: 10.4.20(postcss@8.4.49) + bits-ui: + specifier: ^0.21.16 + version: 0.21.16(svelte@5.7.1) clsx: specifier: ^2.1.1 version: 2.1.1 @@ -522,6 +525,15 @@ packages: resolution: {integrity: sha512-zSkKow6H5Kdm0ZUQUB2kV5JIXqoG0+uH5YADhaEHswm664N9Db8dXSi0nMJpacpMf+MyyglF1vnZohpEg5yUtg==} engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0} + '@floating-ui/core@1.6.8': + resolution: {integrity: sha512-7XJ9cPU+yI2QeLS+FCSlqNFZJq8arvswefkZrYI1yQBbftw6FyrZOxYSh+9S7z7TpeWlRt9zJ5IhM1WIL334jA==} + + '@floating-ui/dom@1.6.12': + resolution: {integrity: sha512-NP83c0HjokcGVEMeoStg317VD9W7eDlGK7457dMBANbKA6GJZdc7rjujdgqzTaz93jkGgc5P/jeWbaCHnMNc+w==} + + '@floating-ui/utils@0.2.8': + resolution: {integrity: sha512-kym7SodPp8/wloecOpcmSnWJsK7M0E5Wg8UcFA+uO4B9s5d0ywXOEro/8HM9x0rW+TljRzul/14UYz3TleT3ig==} + '@gar/promisify@1.1.3': resolution: {integrity: sha512-k2Ty1JcVojjJFwrg/ThKi2ujJ7XNLYaFGNB/bWT9wGR+oSMJHMa5w+CUq6p/pVrKeNNgA7pCqEcjSnHVoqJQFw==} @@ -545,6 +557,9 @@ packages: resolution: {integrity: sha512-c7hNEllBlenFTHBky65mhq8WD2kbN9Q6gk0bTk8lSBvc554jpXSkST1iePudpt7+A/AQvuHs9EMqjHDXMY1lrA==} engines: {node: '>=18.18'} + '@internationalized/date@3.6.0': + resolution: {integrity: sha512-+z6ti+CcJnRlLHok/emGEsWQhe7kfSmEW+/6qCzvKY67YPh7YOBfvc7+/+NXq+zJlbArg30tYpqLjNgcAYv2YQ==} + '@isaacs/cliui@8.0.2': resolution: {integrity: sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==} engines: {node: '>=12'} @@ -575,6 +590,11 @@ packages: resolution: {integrity: sha512-9QOtNffcOF/c1seMCDnjckb3R9WHcG34tky+FHpNKKCW0wc/scYLwMtO+ptyGUfMW0/b/n4qRiALlaFHc9Oj7Q==} engines: {node: '>= 10.0.0'} + '@melt-ui/svelte@0.76.2': + resolution: {integrity: sha512-7SbOa11tXUS95T3fReL+dwDs5FyJtCEqrqG3inRziDws346SYLsxOQ6HmX+4BkIsQh1R8U3XNa+EMmdMt38lMA==} + peerDependencies: + svelte: '>=3 <5' + '@nodelib/fs.scandir@2.1.5': resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==} engines: {node: '>= 8'} @@ -709,6 +729,9 @@ packages: svelte: ^5.0.0 vite: ^6.0.0 + '@swc/helpers@0.5.15': + resolution: {integrity: sha512-JQ5TuMi45Owi4/BIMAJBoSQoOJu12oOk/gADqlcUL9JEdHB8vyjUSsxqeNXnmXHjYKMi2WcYtezGEEhqUI/E2g==} + '@szmarczak/http-timer@4.0.6': resolution: {integrity: sha512-4BAffykYOgO+5nzBWYwE3W90sBgLJoUPRWWcL8wlyiM8IB8ipJz3UMJ9KXQd1RKQXpKp8Tutn80HZtWsu2u76w==} engines: {node: '>=10'} @@ -973,6 +996,11 @@ packages: resolution: {integrity: sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==} engines: {node: '>=8'} + bits-ui@0.21.16: + resolution: {integrity: sha512-XFZ7/bK7j/K+5iktxX/ZpmoFHjYjpPzP5EOO/4bWiaFg5TG1iMcfjDhlBTQnJxD6BoVoHuqeZPHZvaTgF4Iv3Q==} + peerDependencies: + svelte: ^4.0.0 || ^5.0.0-next.118 + bl@4.1.0: resolution: {integrity: sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==} @@ -1214,6 +1242,10 @@ packages: delegates@1.0.0: resolution: {integrity: sha512-bd2L678uiWATM6m5Z1VzNCErI3jiGzt6HGY8OVICs40JQq/HALfbyNJmp0UDakEY4pMMaN0Ly5om/B1VI/+xfQ==} + dequal@2.0.3: + resolution: {integrity: sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==} + engines: {node: '>=6'} + detect-libc@2.0.3: resolution: {integrity: sha512-bwy0MGW55bG41VqxxypOsdSdGqLwXPI/focwgTYCFMbdUiBAxLg9CFzG08sz2aqzknwiX7Hkl0bQENjg8iLByw==} engines: {node: '>=8'} @@ -1442,6 +1474,9 @@ packages: flatted@3.3.2: resolution: {integrity: sha512-AiwGJM8YcNOaobumgtng+6NHuOqC3A7MixFeDafM3X9cIUM+xUXoS5Vfgf+OihAYe20fxqNM9yPBXJzRtZ/4eA==} + focus-trap@7.6.2: + resolution: {integrity: sha512-9FhUxK1hVju2+AiQIDJ5Dd//9R2n2RAfJ0qfhF4IHGHgcoEUTMpbTeG/zbEuwaiYXfuAH6XE0/aCyxDdRM+W5w==} + foreground-child@3.3.0: resolution: {integrity: sha512-Ld2g8rrAyMYFXBhEqMz8ZAHBi4J4uS1i/CxGMDnjyFWddMXLVcDp051DZfu+t7+ab7Wv6SMqpWmyFIj5UbfFvg==} engines: {node: '>=14'} @@ -1961,6 +1996,11 @@ packages: engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} hasBin: true + nanoid@5.0.9: + resolution: {integrity: sha512-Aooyr6MXU6HpvvWXKoVoXwKMs/KyVakWwg7xQfv5/S/RIgJMy0Ifa45H9qqYy7pTCszrHzP21Uk4PZq2HpEM8Q==} + engines: {node: ^18 || >=20} + hasBin: true + natural-compare@1.4.0: resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==} @@ -2422,6 +2462,9 @@ packages: resolution: {integrity: sha512-kUtiiNcN7ssi5X8OQW8IILoI53RUudjn8TD1910i8cg5c5IRZ4IuaDO1vFl+kZcvv1geYBxlFpi/mj09m/CCBg==} engines: {node: '>=18'} + tabbable@6.2.0: + resolution: {integrity: sha512-Cat63mxsVJlzYvN51JmVXIgNoUokrIaT2zLclCXjRd8boZ0004U4KCs/sToJ75C6sdlByWxpYnb5Boif1VSFew==} + tailwind-merge@2.5.5: resolution: {integrity: sha512-0LXunzzAZzo0tEPxV3I297ffKZPlKDrjj7NXphC8V5ak9yHC5zRmxnOe2m/Rd/7ivsOMJe3JZ2JVocoDdQTRBA==} @@ -3043,6 +3086,17 @@ snapshots: dependencies: levn: 0.4.1 + '@floating-ui/core@1.6.8': + dependencies: + '@floating-ui/utils': 0.2.8 + + '@floating-ui/dom@1.6.12': + dependencies: + '@floating-ui/core': 1.6.8 + '@floating-ui/utils': 0.2.8 + + '@floating-ui/utils@0.2.8': {} + '@gar/promisify@1.1.3': {} '@humanfs/core@0.19.1': {} @@ -3058,6 +3112,10 @@ snapshots: '@humanwhocodes/retry@0.4.1': {} + '@internationalized/date@3.6.0': + dependencies: + '@swc/helpers': 0.5.15 + '@isaacs/cliui@8.0.2': dependencies: string-width: 5.1.2 @@ -3097,6 +3155,16 @@ snapshots: transitivePeerDependencies: - supports-color + '@melt-ui/svelte@0.76.2(svelte@5.7.1)': + dependencies: + '@floating-ui/core': 1.6.8 + '@floating-ui/dom': 1.6.12 + '@internationalized/date': 3.6.0 + dequal: 2.0.3 + focus-trap: 7.6.2 + nanoid: 5.0.9 + svelte: 5.7.1 + '@nodelib/fs.scandir@2.1.5': dependencies: '@nodelib/fs.stat': 2.0.5 @@ -3200,6 +3268,10 @@ snapshots: transitivePeerDependencies: - supports-color + '@swc/helpers@0.5.15': + dependencies: + tslib: 2.8.1 + '@szmarczak/http-timer@4.0.6': dependencies: defer-to-connect: 2.0.1 @@ -3525,6 +3597,13 @@ snapshots: binary-extensions@2.3.0: {} + bits-ui@0.21.16(svelte@5.7.1): + dependencies: + '@internationalized/date': 3.6.0 + '@melt-ui/svelte': 0.76.2(svelte@5.7.1) + nanoid: 5.0.9 + svelte: 5.7.1 + bl@4.1.0: dependencies: buffer: 5.7.1 @@ -3801,6 +3880,8 @@ snapshots: delegates@1.0.0: {} + dequal@2.0.3: {} + detect-libc@2.0.3: {} detect-node@2.1.0: @@ -4139,6 +4220,10 @@ snapshots: flatted@3.3.2: {} + focus-trap@7.6.2: + dependencies: + tabbable: 6.2.0 + foreground-child@3.3.0: dependencies: cross-spawn: 7.0.6 @@ -4668,6 +4753,8 @@ snapshots: nanoid@3.3.8: {} + nanoid@5.0.9: {} + natural-compare@1.4.0: {} negotiator@0.6.4: {} @@ -5154,6 +5241,8 @@ snapshots: magic-string: 0.30.14 zimmerframe: 1.1.2 + tabbable@6.2.0: {} + tailwind-merge@2.5.5: {} tailwind-variants@0.3.0(tailwindcss@3.4.16): diff --git a/src/lib/components/ui/button/button.svelte b/src/lib/components/ui/button/button.svelte deleted file mode 100644 index 8f44d5c..0000000 --- a/src/lib/components/ui/button/button.svelte +++ /dev/null @@ -1,74 +0,0 @@ - - - - -{#if href} - - {@render children?.()} - -{:else} - -{/if} diff --git a/src/lib/components/ui/button/index.ts b/src/lib/components/ui/button/index.ts deleted file mode 100644 index fb585d7..0000000 --- a/src/lib/components/ui/button/index.ts +++ /dev/null @@ -1,17 +0,0 @@ -import Root, { - type ButtonProps, - type ButtonSize, - type ButtonVariant, - buttonVariants, -} from "./button.svelte"; - -export { - Root, - type ButtonProps as Props, - // - Root as Button, - buttonVariants, - type ButtonProps, - type ButtonSize, - type ButtonVariant, -}; diff --git a/src/renderer/src/App.svelte b/src/renderer/src/App.svelte index e69de29..62abcc1 100644 --- a/src/renderer/src/App.svelte +++ b/src/renderer/src/App.svelte @@ -0,0 +1,12 @@ + + + + + diff --git a/src/renderer/src/lib/components/ui/button/button.svelte b/src/renderer/src/lib/components/ui/button/button.svelte new file mode 100644 index 0000000..86827f3 --- /dev/null +++ b/src/renderer/src/lib/components/ui/button/button.svelte @@ -0,0 +1,25 @@ + + + + + diff --git a/src/renderer/src/lib/components/ui/button/index.ts b/src/renderer/src/lib/components/ui/button/index.ts new file mode 100644 index 0000000..af1e188 --- /dev/null +++ b/src/renderer/src/lib/components/ui/button/index.ts @@ -0,0 +1,49 @@ +import { type VariantProps, tv } from "tailwind-variants"; +import type { Button as ButtonPrimitive } from "bits-ui"; +import Root from "./button.svelte"; + +const buttonVariants = tv({ + base: "ring-offset-background focus-visible:ring-ring inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50", + variants: { + variant: { + default: "bg-primary text-primary-foreground hover:bg-primary/90", + destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90", + outline: + "border-input bg-background hover:bg-accent hover:text-accent-foreground border", + secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80", + ghost: "hover:bg-accent hover:text-accent-foreground", + link: "text-primary underline-offset-4 hover:underline", + }, + size: { + default: "h-10 px-4 py-2", + sm: "h-9 rounded-md px-3", + lg: "h-11 rounded-md px-8", + icon: "h-10 w-10", + }, + }, + defaultVariants: { + variant: "default", + size: "default", + }, +}); + +type Variant = VariantProps["variant"]; +type Size = VariantProps["size"]; + +type Props = ButtonPrimitive.Props & { + variant?: Variant; + size?: Size; +}; + +type Events = ButtonPrimitive.Events; + +export { + Root, + type Props, + type Events, + // + Root as Button, + type Props as ButtonProps, + type Events as ButtonEvents, + buttonVariants, +}; diff --git a/src/lib/utils.ts b/src/renderer/src/lib/utils.ts similarity index 100% rename from src/lib/utils.ts rename to src/renderer/src/lib/utils.ts diff --git a/tsconfig.json b/tsconfig.json index 75e4c41..03b45ee 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -3,8 +3,8 @@ "compilerOptions": { "baseUrl": ".", "paths": { - "$lib": ["./src/lib"], - "$lib/*": ["./src/lib/*"] + "$lib": ["./src/renderer/src/lib"], + "$lib/*": ["./src/renderer/src/lib/*"] }, "target": "ESNext", "useDefineForClassFields": true,