separate ui utils into @repo/utils

thinc-org · Dec 24, 2024 · 3b40a1b · 3b40a1b
1 parent 8373526
commit 3b40a1b
Show file tree

Hide file tree

Showing 34 changed files with 192 additions and 34 deletions.
diff --git a/apps/web/src/routes/dbdemo/+page.server.ts b/apps/web/src/routes/dbdemo/+page.server.ts
@@ -1,9 +1,9 @@
 import { eq } from 'drizzle-orm'
 
-import { course } from '@repo/database'
-
 import { db } from '$lib/db'
 
+import { course } from '@repo/database'
+
 import type { PageServerLoad } from './$types.js'
 
 export const load: PageServerLoad = async () => {

diff --git a/packages/config/eslint/base.js b/packages/config/eslint/base.js
@@ -44,6 +44,8 @@ export default tseslint.config(
             ['^node:'],
             // Packages. Things that start with a letter (or digit or underscore), or `@` followed by a letter.
             ['^@?\\w'],
+            // Absolute imports within same package.
+            ['^\\$?\\w'],
             // Internal Packages. Things that start with a letter (or digit or underscore), or `@repo` followed by a letter.
             ['^@repo?\\w'],
             // Absolute imports and other imports such as Vue-style `@/foo`.  Anything not matched in another group.

diff --git a/packages/config/eslint/svelte.js b/packages/config/eslint/svelte.js
@@ -6,6 +6,7 @@ import svelteParser from 'svelte-eslint-parser'
 import tseslint from 'typescript-eslint'
 
 import base from './base.js'
+
 export default tseslint.config(
   ...base,
   ...eslintPluginSvelte.configs['flat/recommended'],

diff --git a/packages/ui/package.json b/packages/ui/package.json
@@ -28,6 +28,7 @@
     "vitest": "^2.1.8"
   },
   "dependencies": {
+    "@repo/utils": "workspace:^",
     "bits-ui": "^0.22.0",
     "clsx": "^2.1.1",
     "lucide-svelte": "^0.469.0",

diff --git a/packages/ui/src/components/atom/accordion/accordion-content.svelte b/packages/ui/src/components/atom/accordion/accordion-content.svelte
@@ -3,7 +3,7 @@
   import type { Snippet } from 'svelte'
   import { slide } from 'svelte/transition'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = AccordionPrimitive.ContentProps
 

diff --git a/packages/ui/src/components/atom/accordion/accordion-item.svelte b/packages/ui/src/components/atom/accordion/accordion-item.svelte
@@ -2,7 +2,7 @@
   import { Accordion as AccordionPrimitive } from 'bits-ui'
   import type { Snippet } from 'svelte'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = AccordionPrimitive.ItemProps
 

diff --git a/packages/ui/src/components/atom/accordion/accordion-trigger.svelte b/packages/ui/src/components/atom/accordion/accordion-trigger.svelte
@@ -3,7 +3,7 @@
   import { ChevronDown } from 'lucide-svelte'
   import type { Snippet } from 'svelte'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = AccordionPrimitive.TriggerProps
   type $$Events = AccordionPrimitive.TriggerEvents

diff --git a/packages/ui/src/components/atom/button/button.svelte b/packages/ui/src/components/atom/button/button.svelte
@@ -2,7 +2,8 @@
   import { Button as ButtonPrimitive } from 'bits-ui'
   import type { Snippet } from 'svelte'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
+
   import { buttonVariants, type Events, type Props } from './index.js'
 
   type $$Props = Props

diff --git a/packages/ui/src/components/atom/checkbox/checkbox.svelte b/packages/ui/src/components/atom/checkbox/checkbox.svelte
@@ -2,7 +2,7 @@
   import { Checkbox as CheckboxPrimitive, Label } from 'bits-ui'
   import { Check } from 'lucide-svelte'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = CheckboxPrimitive.Props & {
     label?: string | undefined | null

diff --git a/packages/ui/src/components/atom/chip/chip.svelte b/packages/ui/src/components/atom/chip/chip.svelte
@@ -2,7 +2,8 @@
   import { X } from 'lucide-svelte'
   import type { Snippet } from 'svelte'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
+
   import { chipVariants } from './index.js'
 
   interface Props {

diff --git a/packages/ui/src/components/atom/day-chip/day-chip.svelte b/packages/ui/src/components/atom/day-chip/day-chip.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
+
   import { Chip } from '../chip/index.js'
   import { chipVariants, type Day } from './index.js'
 

diff --git a/packages/ui/src/components/atom/gened-chip/gened-chip.svelte b/packages/ui/src/components/atom/gened-chip/gened-chip.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
+
   import { Chip } from '../chip/index.js'
   import { chipVariants, type Type } from './index.js'
 

diff --git a/packages/ui/src/components/atom/icon-button/icon-button.svelte b/packages/ui/src/components/atom/icon-button/icon-button.svelte
@@ -2,7 +2,8 @@
   import { Button as ButtonPrimitive } from 'bits-ui'
   import type { Snippet } from 'svelte'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
+
   import { buttonVariants, type Events, type Props } from './index.js'
   type $$Props = Props
   type $$Events = Events

diff --git a/packages/ui/src/components/atom/input/input.svelte b/packages/ui/src/components/atom/input/input.svelte
@@ -4,7 +4,8 @@
   const bubble = createBubbler()
   import type { HTMLInputAttributes } from 'svelte/elements'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
+
   import type { InputEvents } from './index.js'
 
   type $$Props = HTMLInputAttributes

diff --git a/packages/ui/src/components/atom/radio-group/radio-group-item.svelte b/packages/ui/src/components/atom/radio-group/radio-group-item.svelte
@@ -2,7 +2,7 @@
   import { Label, RadioGroup as RadioGroupPrimitive } from 'bits-ui'
   import { Circle } from 'lucide-svelte'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = RadioGroupPrimitive.ItemProps & {
     id: string

diff --git a/packages/ui/src/components/atom/radio-group/radio-group.svelte b/packages/ui/src/components/atom/radio-group/radio-group.svelte
@@ -2,7 +2,7 @@
   import { RadioGroup as RadioGroupPrimitive } from 'bits-ui'
   import type { Snippet } from 'svelte'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = RadioGroupPrimitive.Props
 

diff --git a/packages/ui/src/components/atom/recommended-tag/recommended-tag.svelte b/packages/ui/src/components/atom/recommended-tag/recommended-tag.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
   import { Sparkles } from 'lucide-svelte'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   interface Props {
     class?: string | undefined | null

diff --git a/packages/ui/src/components/atom/switch/switch.svelte b/packages/ui/src/components/atom/switch/switch.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
   import { Label, Switch as SwitchPrimitive } from 'bits-ui'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = SwitchPrimitive.Props & {
     label?: string | undefined | null

diff --git a/packages/ui/src/components/atom/table/table-body.svelte b/packages/ui/src/components/atom/table/table-body.svelte
@@ -2,7 +2,7 @@
   import type { Snippet } from 'svelte'
   import type { HTMLAttributes } from 'svelte/elements'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = HTMLAttributes<HTMLTableSectionElement>
 

diff --git a/packages/ui/src/components/atom/table/table-caption.svelte b/packages/ui/src/components/atom/table/table-caption.svelte
@@ -2,7 +2,7 @@
   import type { Snippet } from 'svelte'
   import type { HTMLAttributes } from 'svelte/elements'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = HTMLAttributes<HTMLTableCaptionElement>
 

diff --git a/packages/ui/src/components/atom/table/table-cell.svelte b/packages/ui/src/components/atom/table/table-cell.svelte
@@ -5,7 +5,7 @@
   const bubble = createBubbler()
   import type { HTMLTdAttributes } from 'svelte/elements'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = HTMLTdAttributes
 

diff --git a/packages/ui/src/components/atom/table/table-footer.svelte b/packages/ui/src/components/atom/table/table-footer.svelte
@@ -2,7 +2,7 @@
   import type { Snippet } from 'svelte'
   import type { HTMLAttributes } from 'svelte/elements'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = HTMLAttributes<HTMLTableSectionElement>
 

diff --git a/packages/ui/src/components/atom/table/table-head.svelte b/packages/ui/src/components/atom/table/table-head.svelte
@@ -2,7 +2,7 @@
   import type { Snippet } from 'svelte'
   import type { HTMLThAttributes } from 'svelte/elements'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = HTMLThAttributes
 

diff --git a/packages/ui/src/components/atom/table/table-header.svelte b/packages/ui/src/components/atom/table/table-header.svelte
@@ -5,7 +5,7 @@
   const bubble = createBubbler()
   import type { HTMLAttributes } from 'svelte/elements'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = HTMLAttributes<HTMLTableSectionElement>
 

diff --git a/packages/ui/src/components/atom/table/table-row.svelte b/packages/ui/src/components/atom/table/table-row.svelte
@@ -5,7 +5,7 @@
   const bubble = createBubbler()
   import type { HTMLAttributes } from 'svelte/elements'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = HTMLAttributes<HTMLTableRowElement> & {
     'data-state'?: unknown

diff --git a/packages/ui/src/components/atom/table/table.svelte b/packages/ui/src/components/atom/table/table.svelte
@@ -2,7 +2,7 @@
   import type { Snippet } from 'svelte'
   import type { HTMLTableAttributes } from 'svelte/elements'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
 
   type $$Props = HTMLTableAttributes
 

diff --git a/packages/ui/src/components/molecule/course-card/course-card.svelte b/packages/ui/src/components/molecule/course-card/course-card.svelte
@@ -1,7 +1,8 @@
 <script lang="ts">
   import { Check, Dot, Plus } from 'lucide-svelte'
 
-  import { cn } from '../../../utils.js'
+  import { cn } from '@repo/utils'
+
   import { Button } from '../../atom/button/index.js'
   import { DayChip } from '../../atom/day-chip/index.js'
   import { GenedChip } from '../../atom/gened-chip/index.js'

diff --git a/packages/ui/src/components/organism/footer/footer.svelte b/packages/ui/src/components/organism/footer/footer.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
-  import { CUGetRegWhiteFull } from '../../logo/cugetreg'
-  import { ThincOnDark } from '../../logo/thinc'
-  import { GitHubMark } from '../../logo/vendor'
+  import { CUGetRegWhiteFull } from '../../logo/cugetreg/index.js'
+  import { ThincOnDark } from '../../logo/thinc/index.js'
+  import { GitHubMark } from '../../logo/vendor/index.js'
 </script>
 
 <footer

diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
@@ -11,10 +11,4 @@ export default defineConfig({
       include: [/@repo-ui/, /node_modules/],
     },
   },
-  server: {
-    port: 5173,
-    fs: {
-      allow: ['../../packages/ui/src'],
-    },
-  },
 })
diff --git a/packages/utils/package.json b/packages/utils/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "@repo/utils",
+  "version": "2.0.0",
+  "private": true,
+  "type": "module",
+  "main": "src/index.ts",
+  "scripts": {
+    "lint": "eslint .",
+    "format": "eslint . --fix"
+  },
+  "devDependencies": {
+    "typescript": "^5.7.2"
+  },
+  "dependencies": {
+    "clsx": "^2.1.1",
+    "svelte": "^5.15.0",
+    "tailwind-merge": "^2.6.0",
+    "tailwind-variants": "^0.3.0"
+  }
+}
diff --git a/packages/utils/src/index.ts b/packages/utils/src/index.ts
@@ -0,0 +1 @@
+export * from './ui.js'
diff --git a/packages/ui/src/utils.ts → packages/utils/src/ui.ts b/packages/ui/src/utils.ts → packages/utils/src/ui.ts