ui-ingredients 0.17.1 → 0.18.1

package/dist/portal/index.d.ts

@@ -1 +1,2 @@
+export { default as PortalProvider, type PortalProviderProps, } from './portal-provider.svelte';
 export { default as Portal, type PortalProps } from './portal.svelte';

package/dist/portal/index.js

@@ -1 +1,2 @@
+export { default as PortalProvider, } from './portal-provider.svelte';
 export { default as Portal } from './portal.svelte';

package/dist/portal/portal-context.svelte.d.ts

@@ -0,0 +1,5 @@
+interface PortalProviderProps {
+    container?: HTMLElement | null;
+}
+export declare const getPortalProviderPropsContext: () => PortalProviderProps | undefined, setPortalProviderPropsContext: (context: PortalProviderProps | (() => PortalProviderProps)) => void;
+export {};

package/dist/portal/portal-context.svelte.js

@@ -0,0 +1,2 @@
+import { createContext } from '../create-context.svelte.js';
+export const [getPortalProviderPropsContext, setPortalProviderPropsContext] = createContext('PortalProvider [PROPS]', false);

package/dist/portal/portal-provider.svelte

@@ -0,0 +1,21 @@
+<script lang="ts" module>
+  import type {Snippet} from 'svelte';
+  import {setPortalProviderPropsContext} from './portal-context.svelte.js';
+
+  export interface PortalProviderProps {
+    container?: HTMLElement | null;
+    children?: Snippet;
+  }
+</script>
+
+<script lang="ts">
+  let {container, children}: PortalProviderProps = $props();
+
+  setPortalProviderPropsContext({
+    get container() {
+      return container;
+    },
+  });
+</script>
+
+{@render children?.()}

package/dist/portal/portal-provider.svelte.d.ts

@@ -0,0 +1,23 @@
+import type { Snippet } from 'svelte';
+export interface PortalProviderProps {
+    container?: HTMLElement | null;
+    children?: Snippet;
+}
+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> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const PortalProvider: $$__sveltets_2_IsomorphicComponent<PortalProviderProps, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, "">;
+type PortalProvider = InstanceType<typeof PortalProvider>;
+export default PortalProvider;

package/dist/portal/portal.svelte

@@ -1,32 +1,43 @@
-<script lang="ts" module>
-  import {type Snippet} from 'svelte';
-
-  export interface PortalProps {
-    container?: HTMLElement;
-    disabled?: boolean;
-    children: Snippet;
-    [x: `data-${string}`]: string | number | boolean | null | undefined;
-  }
-</script>
-
-<script lang="ts">
-  import {getEnvironmentContext} from '../environment-provider/index.js';
-  import {portal} from '@zag-js/svelte';
-
-  let {container, disabled, children, ...props}: PortalProps = $props();
-
-  let environment = getEnvironmentContext();
-</script>
-
-<div
-  use:portal={{
-    disabled,
-    container,
-    getRootNode: environment?.getRootNode,
-  }}
-  data-scope="portal"
-  data-part="root"
-  {...props}
->
-  {@render children?.()}
-</div>
+<script lang="ts" module>
+  import type {Assign} from '../types.js';
+  import type {SvelteHTMLElements} from 'svelte/elements';
+
+  interface PortalActionProps {
+    disabled?: boolean;
+    container?: HTMLElement | null;
+  }
+
+  export interface PortalProps
+    extends Assign<SvelteHTMLElements['div'], PortalActionProps> {}
+</script>
+
+<script lang="ts">
+  import {getEnvironmentContext} from '../environment-provider/index.js';
+  import {portal} from '@zag-js/svelte';
+  import {createSplitProps} from '@zag-js/utils';
+  import {getPortalProviderPropsContext} from './portal-context.svelte.js';
+
+  let {children, ...props}: PortalProps = $props();
+
+  let [portalActionProps, localProps] = createSplitProps<PortalActionProps>([
+    'container',
+    'disabled',
+  ])(props);
+
+  let portalProviderProps = getPortalProviderPropsContext();
+  let environment = getEnvironmentContext();
+</script>
+
+<div
+  use:portal={{
+    container:
+      portalActionProps.container ??
+      portalProviderProps?.container ??
+      undefined,
+    disabled: portalActionProps.disabled ?? false,
+    getRootNode: environment?.getRootNode,
+  }}
+  {...localProps}
+>
+  {@render children?.()}
+</div>

package/dist/portal/portal.svelte.d.ts

@@ -1,9 +1,10 @@
-import { type Snippet } from 'svelte';
-export interface PortalProps {
-    container?: HTMLElement;
+import type { Assign } from '../types.js';
+import type { SvelteHTMLElements } from 'svelte/elements';
+interface PortalActionProps {
     disabled?: boolean;
-    children: Snippet;
-    [x: `data-${string}`]: string | number | boolean | null | undefined;
+    container?: HTMLElement | null;
+}
+export interface PortalProps extends Assign<SvelteHTMLElements['div'], PortalActionProps> {
 }
 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> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {

package/package.json

@@ -2,8 +2,8 @@
   "name": "ui-ingredients",
   "type": "module",
   "license": "MIT",
-  "version": "0.17.1",
-  "packageManager": "pnpm@9.14.2",
+  "version": "0.18.1",
+  "packageManager": "pnpm@9.14.4",
   "svelte": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "exports": {
@@ -303,84 +303,84 @@
     "release": "release-it"
   },
   "dependencies": {
-    "@zag-js/accordion": "^0.78.0",
-    "@zag-js/anatomy": "^0.78.0",
-    "@zag-js/angle-slider": "^0.78.0",
-    "@zag-js/auto-resize": "^0.78.0",
-    "@zag-js/avatar": "^0.78.0",
-    "@zag-js/carousel": "^0.78.0",
-    "@zag-js/checkbox": "^0.78.0",
-    "@zag-js/clipboard": "^0.78.0",
-    "@zag-js/collapsible": "^0.78.0",
-    "@zag-js/color-picker": "^0.78.0",
-    "@zag-js/combobox": "^0.78.0",
-    "@zag-js/core": "^0.78.0",
-    "@zag-js/date-picker": "^0.78.0",
-    "@zag-js/dialog": "^0.78.0",
-    "@zag-js/dom-query": "^0.78.0",
-    "@zag-js/editable": "^0.78.0",
-    "@zag-js/file-upload": "^0.78.0",
-    "@zag-js/floating-panel": "^0.78.0",
-    "@zag-js/highlight-word": "^0.78.0",
-    "@zag-js/hover-card": "^0.78.0",
-    "@zag-js/i18n-utils": "^0.78.0",
-    "@zag-js/menu": "^0.78.0",
-    "@zag-js/number-input": "^0.78.0",
-    "@zag-js/pagination": "^0.78.0",
-    "@zag-js/pin-input": "^0.78.0",
-    "@zag-js/popover": "^0.78.0",
-    "@zag-js/presence": "^0.78.0",
-    "@zag-js/progress": "^0.78.0",
-    "@zag-js/qr-code": "^0.78.0",
-    "@zag-js/radio-group": "^0.78.0",
-    "@zag-js/rating-group": "^0.78.0",
-    "@zag-js/select": "^0.78.0",
-    "@zag-js/signature-pad": "^0.78.0",
-    "@zag-js/slider": "^0.78.0",
-    "@zag-js/splitter": "^0.78.0",
-    "@zag-js/steps": "^0.78.0",
-    "@zag-js/svelte": "^0.78.0",
-    "@zag-js/switch": "^0.78.0",
-    "@zag-js/tabs": "^0.78.0",
-    "@zag-js/tags-input": "^0.78.0",
-    "@zag-js/time-picker": "^0.78.0",
-    "@zag-js/timer": "^0.78.0",
-    "@zag-js/toast": "^0.78.0",
-    "@zag-js/toggle-group": "^0.78.0",
-    "@zag-js/tooltip": "^0.78.0",
-    "@zag-js/tour": "^0.78.0",
-    "@zag-js/tree-view": "^0.78.0",
-    "@zag-js/utils": "^0.78.0"
+    "@zag-js/accordion": "^0.78.1",
+    "@zag-js/anatomy": "^0.78.1",
+    "@zag-js/angle-slider": "^0.78.1",
+    "@zag-js/auto-resize": "^0.78.1",
+    "@zag-js/avatar": "^0.78.1",
+    "@zag-js/carousel": "^0.78.1",
+    "@zag-js/checkbox": "^0.78.1",
+    "@zag-js/clipboard": "^0.78.1",
+    "@zag-js/collapsible": "^0.78.1",
+    "@zag-js/color-picker": "^0.78.1",
+    "@zag-js/combobox": "^0.78.1",
+    "@zag-js/core": "^0.78.1",
+    "@zag-js/date-picker": "^0.78.1",
+    "@zag-js/dialog": "^0.78.1",
+    "@zag-js/dom-query": "^0.78.1",
+    "@zag-js/editable": "^0.78.1",
+    "@zag-js/file-upload": "^0.78.1",
+    "@zag-js/floating-panel": "^0.78.1",
+    "@zag-js/highlight-word": "^0.78.1",
+    "@zag-js/hover-card": "^0.78.1",
+    "@zag-js/i18n-utils": "^0.78.1",
+    "@zag-js/menu": "^0.78.1",
+    "@zag-js/number-input": "^0.78.1",
+    "@zag-js/pagination": "^0.78.1",
+    "@zag-js/pin-input": "^0.78.1",
+    "@zag-js/popover": "^0.78.1",
+    "@zag-js/presence": "^0.78.1",
+    "@zag-js/progress": "^0.78.1",
+    "@zag-js/qr-code": "^0.78.1",
+    "@zag-js/radio-group": "^0.78.1",
+    "@zag-js/rating-group": "^0.78.1",
+    "@zag-js/select": "^0.78.1",
+    "@zag-js/signature-pad": "^0.78.1",
+    "@zag-js/slider": "^0.78.1",
+    "@zag-js/splitter": "^0.78.1",
+    "@zag-js/steps": "^0.78.1",
+    "@zag-js/svelte": "^0.78.1",
+    "@zag-js/switch": "^0.78.1",
+    "@zag-js/tabs": "^0.78.1",
+    "@zag-js/tags-input": "^0.78.1",
+    "@zag-js/time-picker": "^0.78.1",
+    "@zag-js/timer": "^0.78.1",
+    "@zag-js/toast": "^0.78.1",
+    "@zag-js/toggle-group": "^0.78.1",
+    "@zag-js/tooltip": "^0.78.1",
+    "@zag-js/tour": "^0.78.1",
+    "@zag-js/tree-view": "^0.78.1",
+    "@zag-js/utils": "^0.78.1"
   },
   "peerDependencies": {
     "svelte": ">=5.0.0"
   },
   "devDependencies": {
-    "@faker-js/faker": "^9.2.0",
-    "@sveltejs/adapter-vercel": "^5.4.8",
-    "@sveltejs/kit": "^2.8.2",
+    "@faker-js/faker": "^9.3.0",
+    "@sveltejs/adapter-vercel": "^5.5.0",
+    "@sveltejs/kit": "^2.9.0",
     "@sveltejs/package": "^2.3.7",
-    "@sveltejs/vite-plugin-svelte": "^4.0.1",
+    "@sveltejs/vite-plugin-svelte": "^5.0.1",
     "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/svelte": "^5.2.6",
     "@testing-library/user-event": "^14.5.2",
     "@types/jsdom": "^21.1.7",
     "@untitled-theme/icons-svelte": "^0.12.0",
     "autoprefixer": "^10.4.20",
-    "globals": "^15.12.0",
+    "globals": "^15.13.0",
     "jsdom": "^25.0.1",
     "postcss": "^8.4.49",
     "publint": "^0.2.12",
     "release-it": "^17.10.0",
     "resize-observer-polyfill": "^1.5.1",
-    "svelte": "^5.2.7",
-    "svelte-check": "^4.1.0",
-    "tailwind-merge": "^2.5.4",
+    "svelte": "^5.5.3",
+    "svelte-check": "^4.1.1",
+    "tailwind-merge": "^2.5.5",
     "tailwind-variants": "^0.3.0",
-    "tailwindcss": "^3.4.15",
+    "tailwindcss": "^3.4.16",
     "typescript": "^5.7.2",
-    "vite": "^5.4.11",
-    "vitest": "^2.1.5",
+    "vite": "^6.0.2",
+    "vitest": "^2.1.8",
     "vitest-axe": "^1.0.0-pre.3",
     "vitest-canvas-mock": "^0.3.3"
   },