ui-ingredients 0.17.1 → 0.18.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1,2 @@
1
+ export { default as PortalProvider, type PortalProviderProps, } from './portal-provider.svelte';
1
2
  export { default as Portal, type PortalProps } from './portal.svelte';
@@ -1 +1,2 @@
1
+ export { default as PortalProvider, } from './portal-provider.svelte';
1
2
  export { default as Portal } from './portal.svelte';
@@ -0,0 +1,7 @@
1
+ export declare const getPortalProviderPropsContext: () => {
2
+ container?: HTMLElement;
3
+ } | undefined, setPortalProviderPropsContext: (context: {
4
+ container?: HTMLElement;
5
+ } | (() => {
6
+ container?: HTMLElement;
7
+ })) => void;
@@ -0,0 +1,2 @@
1
+ import { createContext } from '../create-context.svelte.js';
2
+ export const [getPortalProviderPropsContext, setPortalProviderPropsContext] = createContext('PortalProvider [PROPS]', false);
@@ -0,0 +1,21 @@
1
+ <script lang="ts" module>
2
+ import type {Snippet} from 'svelte';
3
+ import {setPortalProviderPropsContext} from './portal-context.svelte.js';
4
+
5
+ export interface PortalProviderProps {
6
+ container?: HTMLElement;
7
+ children?: Snippet;
8
+ }
9
+ </script>
10
+
11
+ <script lang="ts">
12
+ let {container, children}: PortalProviderProps = $props();
13
+
14
+ setPortalProviderPropsContext({
15
+ get container() {
16
+ return container;
17
+ },
18
+ });
19
+ </script>
20
+
21
+ {@render children?.()}
@@ -0,0 +1,23 @@
1
+ import type { Snippet } from 'svelte';
2
+ export interface PortalProviderProps {
3
+ container?: HTMLElement;
4
+ children?: Snippet;
5
+ }
6
+ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
7
+ new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
8
+ $$bindings?: Bindings;
9
+ } & Exports;
10
+ (internal: unknown, props: Props & {
11
+ $$events?: Events;
12
+ $$slots?: Slots;
13
+ }): Exports & {
14
+ $set?: any;
15
+ $on?: any;
16
+ };
17
+ z_$$bindings?: Bindings;
18
+ }
19
+ declare const PortalProvider: $$__sveltets_2_IsomorphicComponent<PortalProviderProps, {
20
+ [evt: string]: CustomEvent<any>;
21
+ }, {}, {}, "">;
22
+ type PortalProvider = InstanceType<typeof PortalProvider>;
23
+ export default PortalProvider;
@@ -1,32 +1,40 @@
1
- <script lang="ts" module>
2
- import {type Snippet} from 'svelte';
3
-
4
- export interface PortalProps {
5
- container?: HTMLElement;
6
- disabled?: boolean;
7
- children: Snippet;
8
- [x: `data-${string}`]: string | number | boolean | null | undefined;
9
- }
10
- </script>
11
-
12
- <script lang="ts">
13
- import {getEnvironmentContext} from '../environment-provider/index.js';
14
- import {portal} from '@zag-js/svelte';
15
-
16
- let {container, disabled, children, ...props}: PortalProps = $props();
17
-
18
- let environment = getEnvironmentContext();
19
- </script>
20
-
21
- <div
22
- use:portal={{
23
- disabled,
24
- container,
25
- getRootNode: environment?.getRootNode,
26
- }}
27
- data-scope="portal"
28
- data-part="root"
29
- {...props}
30
- >
31
- {@render children?.()}
32
- </div>
1
+ <script lang="ts" module>
2
+ import type {Assign} from '../types.js';
3
+ import type {SvelteHTMLElements} from 'svelte/elements';
4
+
5
+ interface PortalActionProps {
6
+ disabled?: boolean;
7
+ container?: HTMLElement;
8
+ }
9
+
10
+ export interface PortalProps
11
+ extends Assign<SvelteHTMLElements['div'], PortalActionProps> {}
12
+ </script>
13
+
14
+ <script lang="ts">
15
+ import {getEnvironmentContext} from '../environment-provider/index.js';
16
+ import {portal} from '@zag-js/svelte';
17
+ import {createSplitProps} from '@zag-js/utils';
18
+ import {getPortalProviderPropsContext} from './portal-context.svelte.js';
19
+
20
+ let {children, ...props}: PortalProps = $props();
21
+
22
+ let [portalActionProps, localProps] = createSplitProps<PortalActionProps>([
23
+ 'container',
24
+ 'disabled',
25
+ ])(props);
26
+
27
+ let portalProviderProps = getPortalProviderPropsContext();
28
+ let environment = getEnvironmentContext();
29
+ </script>
30
+
31
+ <div
32
+ use:portal={{
33
+ ...portalProviderProps,
34
+ ...portalActionProps,
35
+ getRootNode: environment?.getRootNode,
36
+ }}
37
+ {...localProps}
38
+ >
39
+ {@render children?.()}
40
+ </div>
@@ -1,9 +1,10 @@
1
- import { type Snippet } from 'svelte';
2
- export interface PortalProps {
3
- container?: HTMLElement;
1
+ import type { Assign } from '../types.js';
2
+ import type { SvelteHTMLElements } from 'svelte/elements';
3
+ interface PortalActionProps {
4
4
  disabled?: boolean;
5
- children: Snippet;
6
- [x: `data-${string}`]: string | number | boolean | null | undefined;
5
+ container?: HTMLElement;
6
+ }
7
+ export interface PortalProps extends Assign<SvelteHTMLElements['div'], PortalActionProps> {
7
8
  }
8
9
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
9
10
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
package/package.json CHANGED
@@ -2,8 +2,8 @@
2
2
  "name": "ui-ingredients",
3
3
  "type": "module",
4
4
  "license": "MIT",
5
- "version": "0.17.1",
6
- "packageManager": "pnpm@9.14.2",
5
+ "version": "0.18.0",
6
+ "packageManager": "pnpm@9.14.4",
7
7
  "svelte": "./dist/index.js",
8
8
  "types": "./dist/index.d.ts",
9
9
  "exports": {
@@ -303,84 +303,84 @@
303
303
  "release": "release-it"
304
304
  },
305
305
  "dependencies": {
306
- "@zag-js/accordion": "^0.78.0",
307
- "@zag-js/anatomy": "^0.78.0",
308
- "@zag-js/angle-slider": "^0.78.0",
309
- "@zag-js/auto-resize": "^0.78.0",
310
- "@zag-js/avatar": "^0.78.0",
311
- "@zag-js/carousel": "^0.78.0",
312
- "@zag-js/checkbox": "^0.78.0",
313
- "@zag-js/clipboard": "^0.78.0",
314
- "@zag-js/collapsible": "^0.78.0",
315
- "@zag-js/color-picker": "^0.78.0",
316
- "@zag-js/combobox": "^0.78.0",
317
- "@zag-js/core": "^0.78.0",
318
- "@zag-js/date-picker": "^0.78.0",
319
- "@zag-js/dialog": "^0.78.0",
320
- "@zag-js/dom-query": "^0.78.0",
321
- "@zag-js/editable": "^0.78.0",
322
- "@zag-js/file-upload": "^0.78.0",
323
- "@zag-js/floating-panel": "^0.78.0",
324
- "@zag-js/highlight-word": "^0.78.0",
325
- "@zag-js/hover-card": "^0.78.0",
326
- "@zag-js/i18n-utils": "^0.78.0",
327
- "@zag-js/menu": "^0.78.0",
328
- "@zag-js/number-input": "^0.78.0",
329
- "@zag-js/pagination": "^0.78.0",
330
- "@zag-js/pin-input": "^0.78.0",
331
- "@zag-js/popover": "^0.78.0",
332
- "@zag-js/presence": "^0.78.0",
333
- "@zag-js/progress": "^0.78.0",
334
- "@zag-js/qr-code": "^0.78.0",
335
- "@zag-js/radio-group": "^0.78.0",
336
- "@zag-js/rating-group": "^0.78.0",
337
- "@zag-js/select": "^0.78.0",
338
- "@zag-js/signature-pad": "^0.78.0",
339
- "@zag-js/slider": "^0.78.0",
340
- "@zag-js/splitter": "^0.78.0",
341
- "@zag-js/steps": "^0.78.0",
342
- "@zag-js/svelte": "^0.78.0",
343
- "@zag-js/switch": "^0.78.0",
344
- "@zag-js/tabs": "^0.78.0",
345
- "@zag-js/tags-input": "^0.78.0",
346
- "@zag-js/time-picker": "^0.78.0",
347
- "@zag-js/timer": "^0.78.0",
348
- "@zag-js/toast": "^0.78.0",
349
- "@zag-js/toggle-group": "^0.78.0",
350
- "@zag-js/tooltip": "^0.78.0",
351
- "@zag-js/tour": "^0.78.0",
352
- "@zag-js/tree-view": "^0.78.0",
353
- "@zag-js/utils": "^0.78.0"
306
+ "@zag-js/accordion": "^0.78.1",
307
+ "@zag-js/anatomy": "^0.78.1",
308
+ "@zag-js/angle-slider": "^0.78.1",
309
+ "@zag-js/auto-resize": "^0.78.1",
310
+ "@zag-js/avatar": "^0.78.1",
311
+ "@zag-js/carousel": "^0.78.1",
312
+ "@zag-js/checkbox": "^0.78.1",
313
+ "@zag-js/clipboard": "^0.78.1",
314
+ "@zag-js/collapsible": "^0.78.1",
315
+ "@zag-js/color-picker": "^0.78.1",
316
+ "@zag-js/combobox": "^0.78.1",
317
+ "@zag-js/core": "^0.78.1",
318
+ "@zag-js/date-picker": "^0.78.1",
319
+ "@zag-js/dialog": "^0.78.1",
320
+ "@zag-js/dom-query": "^0.78.1",
321
+ "@zag-js/editable": "^0.78.1",
322
+ "@zag-js/file-upload": "^0.78.1",
323
+ "@zag-js/floating-panel": "^0.78.1",
324
+ "@zag-js/highlight-word": "^0.78.1",
325
+ "@zag-js/hover-card": "^0.78.1",
326
+ "@zag-js/i18n-utils": "^0.78.1",
327
+ "@zag-js/menu": "^0.78.1",
328
+ "@zag-js/number-input": "^0.78.1",
329
+ "@zag-js/pagination": "^0.78.1",
330
+ "@zag-js/pin-input": "^0.78.1",
331
+ "@zag-js/popover": "^0.78.1",
332
+ "@zag-js/presence": "^0.78.1",
333
+ "@zag-js/progress": "^0.78.1",
334
+ "@zag-js/qr-code": "^0.78.1",
335
+ "@zag-js/radio-group": "^0.78.1",
336
+ "@zag-js/rating-group": "^0.78.1",
337
+ "@zag-js/select": "^0.78.1",
338
+ "@zag-js/signature-pad": "^0.78.1",
339
+ "@zag-js/slider": "^0.78.1",
340
+ "@zag-js/splitter": "^0.78.1",
341
+ "@zag-js/steps": "^0.78.1",
342
+ "@zag-js/svelte": "^0.78.1",
343
+ "@zag-js/switch": "^0.78.1",
344
+ "@zag-js/tabs": "^0.78.1",
345
+ "@zag-js/tags-input": "^0.78.1",
346
+ "@zag-js/time-picker": "^0.78.1",
347
+ "@zag-js/timer": "^0.78.1",
348
+ "@zag-js/toast": "^0.78.1",
349
+ "@zag-js/toggle-group": "^0.78.1",
350
+ "@zag-js/tooltip": "^0.78.1",
351
+ "@zag-js/tour": "^0.78.1",
352
+ "@zag-js/tree-view": "^0.78.1",
353
+ "@zag-js/utils": "^0.78.1"
354
354
  },
355
355
  "peerDependencies": {
356
356
  "svelte": ">=5.0.0"
357
357
  },
358
358
  "devDependencies": {
359
- "@faker-js/faker": "^9.2.0",
360
- "@sveltejs/adapter-vercel": "^5.4.8",
361
- "@sveltejs/kit": "^2.8.2",
359
+ "@faker-js/faker": "^9.3.0",
360
+ "@sveltejs/adapter-vercel": "^5.5.0",
361
+ "@sveltejs/kit": "^2.9.0",
362
362
  "@sveltejs/package": "^2.3.7",
363
- "@sveltejs/vite-plugin-svelte": "^4.0.1",
363
+ "@sveltejs/vite-plugin-svelte": "^5.0.1",
364
364
  "@testing-library/jest-dom": "^6.6.3",
365
365
  "@testing-library/svelte": "^5.2.6",
366
366
  "@testing-library/user-event": "^14.5.2",
367
367
  "@types/jsdom": "^21.1.7",
368
368
  "@untitled-theme/icons-svelte": "^0.12.0",
369
369
  "autoprefixer": "^10.4.20",
370
- "globals": "^15.12.0",
370
+ "globals": "^15.13.0",
371
371
  "jsdom": "^25.0.1",
372
372
  "postcss": "^8.4.49",
373
373
  "publint": "^0.2.12",
374
374
  "release-it": "^17.10.0",
375
375
  "resize-observer-polyfill": "^1.5.1",
376
- "svelte": "^5.2.7",
377
- "svelte-check": "^4.1.0",
378
- "tailwind-merge": "^2.5.4",
376
+ "svelte": "^5.5.3",
377
+ "svelte-check": "^4.1.1",
378
+ "tailwind-merge": "^2.5.5",
379
379
  "tailwind-variants": "^0.3.0",
380
- "tailwindcss": "^3.4.15",
380
+ "tailwindcss": "^3.4.16",
381
381
  "typescript": "^5.7.2",
382
- "vite": "^5.4.11",
383
- "vitest": "^2.1.5",
382
+ "vite": "^6.0.2",
383
+ "vitest": "^2.1.8",
384
384
  "vitest-axe": "^1.0.0-pre.3",
385
385
  "vitest-canvas-mock": "^0.3.3"
386
386
  },