svelte-ag 1.2.2 → 1.2.4

package/dist/components/search/combinations/SearchPassthroughHarness.svelte

@@ -0,0 +1,41 @@
+<script lang="ts">
+  import { Search } from '../index.js';
+
+  let {
+    items,
+    value = $bindable(),
+    rootClass,
+    rootTestId,
+    inputClass,
+    inputLabel,
+    inputTestId,
+    listClass,
+    listTestId,
+    paginationClass,
+    paginationTestId,
+    perPage = $bindable(1)
+  }: {
+    items: Search.RootProps['items'];
+    value: Search.RootProps['value'];
+    rootClass?: string;
+    rootTestId?: string;
+    inputClass?: string;
+    inputLabel?: string;
+    inputTestId?: string;
+    listClass?: string;
+    listTestId?: string;
+    paginationClass?: string;
+    paginationTestId?: string;
+    perPage?: Search.PagnationProps['perPage'];
+  } = $props();
+</script>
+
+{#snippet itemSnippet(item: NonNullable<Search.RootProps['items']>[number])}
+  <span>{item.label}</span>
+{/snippet}
+
+<Search.Root {items} bind:value class={rootClass} data-testid={rootTestId}>
+  <Search.Input class={inputClass} aria-label={inputLabel} data-testid={inputTestId} />
+  <Search.List item={itemSnippet} class={listClass} data-testid={listTestId} />
+  <Search.Pagnation bind:perPage class={paginationClass} data-testid={paginationTestId} />
+</Search.Root>

package/dist/components/search/combinations/SearchPassthroughHarness.svelte.d.ts

@@ -0,0 +1,19 @@
+import { Search } from '../index.js';
+type $$ComponentProps = {
+    items: Search.RootProps['items'];
+    value: Search.RootProps['value'];
+    rootClass?: string;
+    rootTestId?: string;
+    inputClass?: string;
+    inputLabel?: string;
+    inputTestId?: string;
+    listClass?: string;
+    listTestId?: string;
+    paginationClass?: string;
+    paginationTestId?: string;
+    perPage?: Search.PagnationProps['perPage'];
+};
+declare const SearchPassthroughHarness: import("svelte").Component<$$ComponentProps, {}, "value" | "perPage">;
+type SearchPassthroughHarness = ReturnType<typeof SearchPassthroughHarness>;
+export default SearchPassthroughHarness;
+//# sourceMappingURL=SearchPassthroughHarness.svelte.d.ts.map

package/dist/components/search/combinations/SearchPassthroughHarness.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchPassthroughHarness.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/search/combinations/SearchPassthroughHarness.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAEpC,KAAK,gBAAgB,GAAI;IACtB,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;IACjC,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC;CAC5C,CAAC;AAgCJ,QAAA,MAAM,wBAAwB,uEAAwC,CAAC;AACvE,KAAK,wBAAwB,GAAG,UAAU,CAAC,OAAO,wBAAwB,CAAC,CAAC;AAC5E,eAAe,wBAAwB,CAAC"}

package/dist/components/search/combinations/searchPassthrough.comp.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=searchPassthrough.comp.test.d.ts.map

package/dist/components/search/combinations/searchPassthrough.comp.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"searchPassthrough.comp.test.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/search/combinations/searchPassthrough.comp.test.ts"],"names":[],"mappings":""}

package/dist/components/search/combinations/searchPassthrough.comp.test.js

@@ -0,0 +1,65 @@
+import { render, screen } from '@testing-library/svelte';
+import { describe, expect, it } from 'vitest';
+import SearchPassthroughHarness from './SearchPassthroughHarness.svelte';
+const items = [
+    { label: 'Alpha', value: 'alpha' },
+    { label: 'Beta', value: 'beta' }
+];
+describe('Search passthrough props', () => {
+    it('forwards root class and data attributes', () => {
+        render(SearchPassthroughHarness, {
+            props: {
+                items,
+                value: items[0],
+                rootClass: 'root-class',
+                rootTestId: 'search-root'
+            }
+        });
+        const root = screen.getByTestId('search-root');
+        expect(root.className).toContain('root-class');
+        expect(root.getAttribute('data-search-root')).toBe('');
+    });
+    it('forwards input class and aria attributes', () => {
+        render(SearchPassthroughHarness, {
+            props: {
+                items,
+                value: items[0],
+                inputClass: 'input-class',
+                inputLabel: 'Filter items',
+                inputTestId: 'search-input'
+            }
+        });
+        const input = screen.getByTestId('search-input');
+        expect(input.className).toContain('input-class');
+        expect(input.getAttribute('aria-label')).toBe('Filter items');
+        expect(input.getAttribute('data-search-input')).toBe('');
+    });
+    it('forwards list class and data attributes to the list container', () => {
+        render(SearchPassthroughHarness, {
+            props: {
+                items,
+                value: items[0],
+                listClass: 'list-class',
+                listTestId: 'search-list'
+            }
+        });
+        const list = screen.getByTestId('search-list');
+        const itemButton = screen.getByRole('button', { name: 'Alpha' });
+        expect(list.className).toContain('list-class');
+        expect(list.getAttribute('data-search-list')).toBe('');
+        expect(itemButton.className).not.toContain('list-class');
+    });
+    it('forwards pagination class and data attributes to the pagination root', () => {
+        render(SearchPassthroughHarness, {
+            props: {
+                items,
+                value: items[0],
+                paginationClass: 'pagination-class',
+                paginationTestId: 'search-pagination'
+            }
+        });
+        const pagination = screen.getByTestId('search-pagination');
+        expect(pagination.className).toContain('pagination-class');
+        expect(pagination.getAttribute('data-search-item')).toBe('');
+    });
+});

package/dist/components/search/combinations/searchPopover.comp.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=searchPopover.comp.test.d.ts.map

package/dist/components/search/combinations/searchPopover.comp.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"searchPopover.comp.test.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/search/combinations/searchPopover.comp.test.ts"],"names":[],"mappings":""}

package/dist/components/search/combinations/searchPopover.comp.test.js

@@ -0,0 +1,36 @@
+import { render, screen } from '@testing-library/svelte';
+import { createRawSnippet } from 'svelte';
+import { describe, expect, it } from 'vitest';
+import SearchPopover from './searchPopover.svelte';
+const selectedItem = {
+    label: 'Alpha',
+    value: 'alpha'
+};
+const itemSnippet = createRawSnippet((getItem) => ({
+    render: () => `<span>${getItem().label}</span>`
+}));
+describe('SearchPopover', () => {
+    it('applies the consumer class to the real popover trigger button', () => {
+        render(SearchPopover, {
+            props: {
+                class: 'consumer-class',
+                item: itemSnippet,
+                items: [selectedItem],
+                value: selectedItem
+            }
+        });
+        const trigger = screen.getByRole('combobox');
+        expect(trigger.className).toContain('consumer-class');
+    });
+    it('forwards non-class trigger props to the real popover trigger button', () => {
+        render(SearchPopover, {
+            props: {
+                disabled: true,
+                item: itemSnippet,
+                items: [selectedItem],
+                value: selectedItem
+            }
+        });
+        expect(screen.getByRole('combobox')).toHaveProperty('disabled', true);
+    });
+});

package/dist/components/search/combinations/searchPopover.svelte

@@ -47,10 +47,10 @@
   <Popover.Trigger {...restProps}>
     {#snippet child({ props })}
       <Button
+        {...props}
         bind:ref={trigger}
         variant="outline"
-        class={cn('focus-ring h-fit w-full justify-between overflow-hidden', className)}
-        {...props}
+        class={cn(props.class as string, 'focus-ring h-fit w-full justify-between overflow-hidden', className)}
         role="combobox"
       >
         {#if value}

package/dist/components/search/components/search-list.svelte

@@ -8,7 +8,15 @@
   import { useSearchList } from '../search.svelte';
   import type { SearchListProps } from '../types';
 
-  let { children, child, id = useId(), ref = $bindable(null), item, ...restProps }: SearchListProps = $props();
+  let {
+    children,
+    child,
+    class: className,
+    id = useId(),
+    ref = $bindable(null),
+    item,
+    ...restProps
+  }: SearchListProps = $props();
 
   const listState = useSearchList({
     id: box.with(() => id),
@@ -24,7 +32,7 @@
 {#if child}
   {@render child({ props: mergedProps })}
 {:else}
-  <div {...mergedProps} class="grid w-full auto-rows-fr px-2">
+  <div {...mergedProps} class={cn('grid w-full auto-rows-fr px-2', className)}>
     {#each listState.suggestions as listItem (listItem.value)}
       <Button
         variant="ghost"
@@ -34,8 +42,7 @@
             hover:bg-muted
           `,
           listState.selected(listItem) && 'bg-muted',
-          listState.visible(listItem) ? '' : 'hidden!',
-          mergedProps.class
+          listState.visible(listItem) ? '' : 'hidden!'
         )}
         onclick={() => listState.select(listItem)}
       >

package/dist/components/search/components/search-list.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"search-list.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/search/components/search-list.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAiDhD,QAAA,MAAM,UAAU,wDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
+{"version":3,"file":"search-list.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/search/components/search-list.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAwDhD,QAAA,MAAM,UAAU,wDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}

package/dist/components/search/components/search-pagnation.svelte

@@ -3,12 +3,14 @@
   import { box, mergeProps } from 'svelte-toolbelt';
 
   import * as Pagination from '$shadcn/pagination/index.js';
+  import { cn } from '../../../utils/index.js';
 
   import { useSearchPagnation } from '../search.svelte';
   import type { SearchPagnationProps } from '../types';
 
   let {
     child,
+    class: className,
     id = useId(),
     ref = $bindable(null),
     page = $bindable(1),
@@ -40,7 +42,13 @@
 {#if child}
   {@render child({ props: mergedProps })}
 {:else}
-  <Pagination.Root class="pb-2" count={pagnationState.length} perPage={pagnationState.perPage} bind:page>
+  <Pagination.Root
+    {...mergedProps}
+    class={cn('pb-2', className)}
+    count={pagnationState.length}
+    perPage={pagnationState.perPage}
+    bind:page
+  >
     {#snippet children({ pages, currentPage })}
       <Pagination.Content>
         <Pagination.Item>

package/dist/components/search/components/search-pagnation.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"search-pagnation.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/search/components/search-pagnation.svelte.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAyErD,QAAA,MAAM,eAAe;;;;8BAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}
+{"version":3,"file":"search-pagnation.svelte.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/search/components/search-pagnation.svelte.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AA2ErD,QAAA,MAAM,eAAe;;;;8BAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/vite/vite-plugin-component-source-collector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vite-plugin-component-source-collector.d.ts","sourceRoot":"","sources":["../../src/lib/vite/vite-plugin-component-source-collector.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,MAAM,EAAkB,MAAM,MAAM,CAAC;AAWnD,UAAU,OAAO;IACf;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,YAAY,EAAE,MAAM,EAAE,CAAC;CACxB;AAkID,wBAA8B,wBAAwB,CAAC,IAAI,GAAE,OAA8B,GAAG,OAAO,CAAC,MAAM,CAAC,CAsY5G"}
+{"version":3,"file":"vite-plugin-component-source-collector.d.ts","sourceRoot":"","sources":["../../src/lib/vite/vite-plugin-component-source-collector.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,MAAM,EAAkB,MAAM,MAAM,CAAC;AAWnD,UAAU,OAAO;IACf;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,YAAY,EAAE,MAAM,EAAE,CAAC;CACxB;AAkID,wBAA8B,wBAAwB,CAAC,IAAI,GAAE,OAA8B,GAAG,OAAO,CAAC,MAAM,CAAC,CAyY5G"}

package/dist/vite/vite-plugin-component-source-collector.js

@@ -128,6 +128,8 @@ export default async function componentSourceCollector(opts = { safePackages: []
         // style modules that Tailwind should never parse directly.
         if (id.includes('?svelte&type=style'))
             return false;
+        // TODO what about functions named eg transitionIconClass(t: number)...
+        // they dont get picked up cause no : or = after class
         return classAttributeRegex.test(code);
     }
     async function normalizeCollectedSourceFilePath(file) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "svelte-ag",
-  "version": "1.2.2",
+  "version": "1.2.4",
   "description": "Useful svelte components",
   "bugs": "https://github.com/ageorgeh/svelte-ag/issues",
   "author": "Alexander Hornung",
@@ -82,12 +82,14 @@
     "@sveltejs/vite-plugin-svelte": "^7.1.1",
     "@tailwindcss/typography": "^0.5.19",
     "@tailwindcss/vite": "^4.2.4",
+    "@testing-library/svelte": "^5.3.1",
     "@types/node": "^24.12.2",
     "@typescript/native-preview": "7.0.0-dev.20260506.1",
     "eslint": "^10.3.0",
     "eslint-plugin-better-tailwindcss": "^4.5.0",
     "eslint-plugin-svelte": "^3.17.1",
     "globals": "^17.6.0",
+    "happy-dom": "^20.9.0",
     "husky": "^9.1.7",
     "lint-staged": "^17.0.2",
     "oxfmt": "^0.51.0",

package/src/lib/components/search/combinations/SearchPassthroughHarness.svelte

@@ -0,0 +1,41 @@
+<script lang="ts">
+  import { Search } from '../index.js';
+
+  let {
+    items,
+    value = $bindable(),
+    rootClass,
+    rootTestId,
+    inputClass,
+    inputLabel,
+    inputTestId,
+    listClass,
+    listTestId,
+    paginationClass,
+    paginationTestId,
+    perPage = $bindable(1)
+  }: {
+    items: Search.RootProps['items'];
+    value: Search.RootProps['value'];
+    rootClass?: string;
+    rootTestId?: string;
+    inputClass?: string;
+    inputLabel?: string;
+    inputTestId?: string;
+    listClass?: string;
+    listTestId?: string;
+    paginationClass?: string;
+    paginationTestId?: string;
+    perPage?: Search.PagnationProps['perPage'];
+  } = $props();
+</script>
+
+{#snippet itemSnippet(item: NonNullable<Search.RootProps['items']>[number])}
+  <span>{item.label}</span>
+{/snippet}
+
+<Search.Root {items} bind:value class={rootClass} data-testid={rootTestId}>
+  <Search.Input class={inputClass} aria-label={inputLabel} data-testid={inputTestId} />
+  <Search.List item={itemSnippet} class={listClass} data-testid={listTestId} />
+  <Search.Pagnation bind:perPage class={paginationClass} data-testid={paginationTestId} />
+</Search.Root>

package/src/lib/components/search/combinations/searchPassthrough.comp.test.ts

@@ -0,0 +1,79 @@
+import { render, screen } from '@testing-library/svelte';
+import { describe, expect, it } from 'vitest';
+
+import SearchPassthroughHarness from './SearchPassthroughHarness.svelte';
+
+const items = [
+  { label: 'Alpha', value: 'alpha' },
+  { label: 'Beta', value: 'beta' }
+];
+
+describe('Search passthrough props', () => {
+  it('forwards root class and data attributes', () => {
+    render(SearchPassthroughHarness, {
+      props: {
+        items,
+        value: items[0],
+        rootClass: 'root-class',
+        rootTestId: 'search-root'
+      }
+    });
+
+    const root = screen.getByTestId('search-root');
+
+    expect(root.className).toContain('root-class');
+    expect(root.getAttribute('data-search-root')).toBe('');
+  });
+
+  it('forwards input class and aria attributes', () => {
+    render(SearchPassthroughHarness, {
+      props: {
+        items,
+        value: items[0],
+        inputClass: 'input-class',
+        inputLabel: 'Filter items',
+        inputTestId: 'search-input'
+      }
+    });
+
+    const input = screen.getByTestId('search-input');
+
+    expect(input.className).toContain('input-class');
+    expect(input.getAttribute('aria-label')).toBe('Filter items');
+    expect(input.getAttribute('data-search-input')).toBe('');
+  });
+
+  it('forwards list class and data attributes to the list container', () => {
+    render(SearchPassthroughHarness, {
+      props: {
+        items,
+        value: items[0],
+        listClass: 'list-class',
+        listTestId: 'search-list'
+      }
+    });
+
+    const list = screen.getByTestId('search-list');
+    const itemButton = screen.getByRole('button', { name: 'Alpha' });
+
+    expect(list.className).toContain('list-class');
+    expect(list.getAttribute('data-search-list')).toBe('');
+    expect(itemButton.className).not.toContain('list-class');
+  });
+
+  it('forwards pagination class and data attributes to the pagination root', () => {
+    render(SearchPassthroughHarness, {
+      props: {
+        items,
+        value: items[0],
+        paginationClass: 'pagination-class',
+        paginationTestId: 'search-pagination'
+      }
+    });
+
+    const pagination = screen.getByTestId('search-pagination');
+
+    expect(pagination.className).toContain('pagination-class');
+    expect(pagination.getAttribute('data-search-item')).toBe('');
+  });
+});

package/src/lib/components/search/combinations/searchPopover.comp.test.ts

@@ -0,0 +1,44 @@
+import { render, screen } from '@testing-library/svelte';
+import { createRawSnippet } from 'svelte';
+import { describe, expect, it } from 'vitest';
+
+import SearchPopover from './searchPopover.svelte';
+
+const selectedItem = {
+  label: 'Alpha',
+  value: 'alpha'
+};
+
+const itemSnippet = createRawSnippet<[typeof selectedItem]>((getItem) => ({
+  render: () => `<span>${getItem().label}</span>`
+}));
+
+describe('SearchPopover', () => {
+  it('applies the consumer class to the real popover trigger button', () => {
+    render(SearchPopover, {
+      props: {
+        class: 'consumer-class',
+        item: itemSnippet,
+        items: [selectedItem],
+        value: selectedItem
+      }
+    });
+
+    const trigger = screen.getByRole('combobox');
+
+    expect(trigger.className).toContain('consumer-class');
+  });
+
+  it('forwards non-class trigger props to the real popover trigger button', () => {
+    render(SearchPopover, {
+      props: {
+        disabled: true,
+        item: itemSnippet,
+        items: [selectedItem],
+        value: selectedItem
+      }
+    });
+
+    expect(screen.getByRole('combobox')).toHaveProperty('disabled', true);
+  });
+});

package/src/lib/components/search/combinations/searchPopover.svelte

@@ -47,10 +47,10 @@
   <Popover.Trigger {...restProps}>
     {#snippet child({ props })}
       <Button
+        {...props}
         bind:ref={trigger}
         variant="outline"
-        class={cn('focus-ring h-fit w-full justify-between overflow-hidden', className)}
-        {...props}
+        class={cn(props.class as string, 'focus-ring h-fit w-full justify-between overflow-hidden', className)}
         role="combobox"
       >
         {#if value}

package/src/lib/components/search/components/search-list.svelte

@@ -8,7 +8,15 @@
   import { useSearchList } from '../search.svelte';
   import type { SearchListProps } from '../types';
 
-  let { children, child, id = useId(), ref = $bindable(null), item, ...restProps }: SearchListProps = $props();
+  let {
+    children,
+    child,
+    class: className,
+    id = useId(),
+    ref = $bindable(null),
+    item,
+    ...restProps
+  }: SearchListProps = $props();
 
   const listState = useSearchList({
     id: box.with(() => id),
@@ -24,7 +32,7 @@
 {#if child}
   {@render child({ props: mergedProps })}
 {:else}
-  <div {...mergedProps} class="grid w-full auto-rows-fr px-2">
+  <div {...mergedProps} class={cn('grid w-full auto-rows-fr px-2', className)}>
     {#each listState.suggestions as listItem (listItem.value)}
       <Button
         variant="ghost"
@@ -34,8 +42,7 @@
             hover:bg-muted
           `,
           listState.selected(listItem) && 'bg-muted',
-          listState.visible(listItem) ? '' : 'hidden!',
-          mergedProps.class
+          listState.visible(listItem) ? '' : 'hidden!'
         )}
         onclick={() => listState.select(listItem)}
       >

package/src/lib/components/search/components/search-pagnation.svelte

@@ -3,12 +3,14 @@
   import { box, mergeProps } from 'svelte-toolbelt';
 
   import * as Pagination from '$shadcn/pagination/index.js';
+  import { cn } from '$utils/index.js';
 
   import { useSearchPagnation } from '../search.svelte';
   import type { SearchPagnationProps } from '../types';
 
   let {
     child,
+    class: className,
     id = useId(),
     ref = $bindable(null),
     page = $bindable(1),
@@ -40,7 +42,13 @@
 {#if child}
   {@render child({ props: mergedProps })}
 {:else}
-  <Pagination.Root class="pb-2" count={pagnationState.length} perPage={pagnationState.perPage} bind:page>
+  <Pagination.Root
+    {...mergedProps}
+    class={cn('pb-2', className)}
+    count={pagnationState.length}
+    perPage={pagnationState.perPage}
+    bind:page
+  >
     {#snippet children({ pages, currentPage })}
       <Pagination.Content>
         <Pagination.Item>

package/src/lib/vite/vite-plugin-component-source-collector.ts

@@ -180,6 +180,9 @@ export default async function componentSourceCollector(opts: Options = { safePac
     // a Tailwind source signal. Including those files can pull in component-local
     // style modules that Tailwind should never parse directly.
     if (id.includes('?svelte&type=style')) return false;
+
+    // TODO what about functions named eg transitionIconClass(t: number)...
+    // they dont get picked up cause no : or = after class
     return classAttributeRegex.test(code);
   }