@ark-ui/solid 0.1.0 → 0.3.0

package/dist/pin-input/pin-input-field.cjs

@@ -3,18 +3,16 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
+const solidJs = require('solid-js');
 const factory = require('../factory.cjs');
 const pinInputContext = require('./pin-input-context.cjs');
 
 const PinInputField = props => {
-  const {
-    index,
-    ...htmlProps
-  } = props;
-  const pinInput = pinInputContext.usePinInputContext();
-  return web.createComponent(factory.ark.input, web.mergeProps(() => pinInput().getInputProps({
-    index
-  }), htmlProps));
+  const [inputParams, localProps] = solidJs.splitProps(props, ['index']);
+  const api = pinInputContext.usePinInputContext();
+  const inputProps = solid.mergeProps(() => api().getInputProps(inputParams), localProps);
+  return web.createComponent(factory.ark.input, inputProps);
 };
 
 exports.PinInputField = PinInputField;

package/dist/pin-input/pin-input-field.d.ts

@@ -1,6 +1,6 @@
 import type { JSX } from 'solid-js';
-import { type Assign } from '@polymorphic-factory/solid';
 import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
 export type PinInputFieldProps = Assign<HTMLArkProps<'input'>, {
     index: number;
 }>;

package/dist/pin-input/pin-input-field.mjs

@@ -1,16 +1,14 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { splitProps } from 'solid-js';
 import { ark } from '../factory.mjs';
 import { usePinInputContext } from './pin-input-context.mjs';
 
 const PinInputField = props => {
-  const {
-    index,
-    ...htmlProps
-  } = props;
-  const pinInput = usePinInputContext();
-  return createComponent(ark.input, mergeProps(() => pinInput().getInputProps({
-    index
-  }), htmlProps));
+  const [inputParams, localProps] = splitProps(props, ['index']);
+  const api = usePinInputContext();
+  const inputProps = mergeProps(() => api().getInputProps(inputParams), localProps);
+  return createComponent(ark.input, inputProps);
 };
 
 export { PinInputField };

package/dist/pin-input/pin-input-label.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const pinInputContext = require('./pin-input-context.cjs');
 
 const PinInputLabel = props => {
-  const pinInput = pinInputContext.usePinInputContext();
-  return web.createComponent(factory.ark.label, web.mergeProps(() => pinInput().labelProps, props));
+  const api = pinInputContext.usePinInputContext();
+  const labelProps = solid.mergeProps(() => api().labelProps, props);
+  return web.createComponent(factory.ark.label, labelProps);
 };
 
 exports.PinInputLabel = PinInputLabel;

package/dist/pin-input/pin-input-label.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { usePinInputContext } from './pin-input-context.mjs';
 
 const PinInputLabel = props => {
-  const pinInput = usePinInputContext();
-  return createComponent(ark.label, mergeProps(() => pinInput().labelProps, props));
+  const api = usePinInputContext();
+  const labelProps = mergeProps(() => api().labelProps, props);
+  return createComponent(ark.label, labelProps);
 };
 
 export { PinInputLabel };

package/dist/pin-input/pin-input.cjs

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const createSplitProps = require('../create-split-props.cjs');
 const factory = require('../factory.cjs');
 const pinInputContext = require('./pin-input-context.cjs');
@@ -10,11 +11,12 @@ const usePinInput = require('./use-pin-input.cjs');
 
 const PinInput = props => {
   const [pinInputProps, htmlProps] = createSplitProps.createSplitProps()(props, ['autoFocus', 'blurOnComplete', 'dir', 'disabled', 'form', 'getRootNode', 'id', 'ids', 'invalid', 'mask', 'name', 'onChange', 'onComplete', 'onInvalid', 'otp', 'pattern', 'placeholder', 'selectOnFocus', 'translations', 'type', 'value']);
-  const pinInput = usePinInput.usePinInput(pinInputProps);
+  const api = usePinInput.usePinInput(pinInputProps);
+  const rootProps = solid.mergeProps(() => api().rootProps, htmlProps);
   return web.createComponent(pinInputContext.PinInputProvider, {
-    value: pinInput,
+    value: api,
     get children() {
-      return web.createComponent(factory.ark.div, web.mergeProps(() => pinInput().rootProps, htmlProps));
+      return web.createComponent(factory.ark.div, rootProps);
     }
   });
 };

package/dist/pin-input/pin-input.d.ts

@@ -1,6 +1,6 @@
 import type { JSX } from 'solid-js';
-import { type Assign } from '@polymorphic-factory/solid';
 import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
 import { type UsePinInputProps } from './use-pin-input';
 export type PinInputProps = Assign<HTMLArkProps<'div'>, UsePinInputProps>;
 export declare const PinInput: (props: PinInputProps) => JSX.Element;

package/dist/pin-input/pin-input.mjs

@@ -1,4 +1,5 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { createSplitProps } from '../create-split-props.mjs';
 import { ark } from '../factory.mjs';
 import { PinInputProvider } from './pin-input-context.mjs';
@@ -6,11 +7,12 @@ import { usePinInput } from './use-pin-input.mjs';
 
 const PinInput = props => {
   const [pinInputProps, htmlProps] = createSplitProps()(props, ['autoFocus', 'blurOnComplete', 'dir', 'disabled', 'form', 'getRootNode', 'id', 'ids', 'invalid', 'mask', 'name', 'onChange', 'onComplete', 'onInvalid', 'otp', 'pattern', 'placeholder', 'selectOnFocus', 'translations', 'type', 'value']);
-  const pinInput = usePinInput(pinInputProps);
+  const api = usePinInput(pinInputProps);
+  const rootProps = mergeProps(() => api().rootProps, htmlProps);
   return createComponent(PinInputProvider, {
-    value: pinInput,
+    value: api,
     get children() {
-      return createComponent(ark.div, mergeProps(() => pinInput().rootProps, htmlProps));
+      return createComponent(ark.div, rootProps);
     }
   });
 };

package/dist/popover/popover-anchor.cjs

@@ -2,22 +2,15 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const solidJs = require('solid-js');
-const spread = require('../spread.cjs');
-const ssrSpread = require('../ssr-spread.cjs');
+const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
+const factory = require('../factory.cjs');
 const popoverContext = require('./popover-context.cjs');
 
 const PopoverAnchor = props => {
-  const popover = popoverContext.usePopoverContext();
-  const anchorProps = popover().anchorProps;
-  const getChildren = solidJs.children(() => ssrSpread.ssrSpread(props.children, anchorProps));
-  solidJs.createEffect(() => {
-    const children = getChildren();
-    if (children instanceof HTMLElement) {
-      spread.spread(children, anchorProps);
-    }
-  });
-  return getChildren;
+  const api = popoverContext.usePopoverContext();
+  const anchorProps = solid.mergeProps(() => api().anchorProps, props);
+  return web.createComponent(factory.ark.div, anchorProps);
 };
 
 exports.PopoverAnchor = PopoverAnchor;

package/dist/popover/popover-anchor.d.ts

@@ -1,5 +1,4 @@
-import type { ChildrenReturn, type JSX } from 'solid-js';
-export type PopoverAnchorProps = {
-    children: JSX.Element;
-};
-export declare const PopoverAnchor: (props: PopoverAnchorProps) => ChildrenReturn;
+import type { JSX } from 'solid-js';
+import { type HTMLArkProps } from '../factory';
+export type PopoverAnchorProps = HTMLArkProps<'div'>;
+export declare const PopoverAnchor: (props: PopoverAnchorProps) => JSX.Element;

package/dist/popover/popover-anchor.mjs

@@ -1,19 +1,12 @@
-import { children, createEffect } from 'solid-js';
-import { spread } from '../spread.mjs';
-import { ssrSpread } from '../ssr-spread.mjs';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory.mjs';
 import { usePopoverContext } from './popover-context.mjs';
 
 const PopoverAnchor = props => {
-  const popover = usePopoverContext();
-  const anchorProps = popover().anchorProps;
-  const getChildren = children(() => ssrSpread(props.children, anchorProps));
-  createEffect(() => {
-    const children = getChildren();
-    if (children instanceof HTMLElement) {
-      spread(children, anchorProps);
-    }
-  });
-  return getChildren;
+  const api = usePopoverContext();
+  const anchorProps = mergeProps(() => api().anchorProps, props);
+  return createComponent(ark.div, anchorProps);
 };
 
 export { PopoverAnchor };

package/dist/popover/popover-arrow-tip.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const popoverContext = require('./popover-context.cjs');
 
 const PopoverArrowTip = props => {
   const popover = popoverContext.usePopoverContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => popover().arrowTipProps, props));
+  const arrowTipProps = solid.mergeProps(() => popover().arrowTipProps, props);
+  return web.createComponent(factory.ark.div, arrowTipProps);
 };
 
 exports.PopoverArrowTip = PopoverArrowTip;

package/dist/popover/popover-arrow-tip.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { usePopoverContext } from './popover-context.mjs';
 
 const PopoverArrowTip = props => {
   const popover = usePopoverContext();
-  return createComponent(ark.div, mergeProps(() => popover().arrowTipProps, props));
+  const arrowTipProps = mergeProps(() => popover().arrowTipProps, props);
+  return createComponent(ark.div, arrowTipProps);
 };
 
 export { PopoverArrowTip };

package/dist/popover/popover-arrow.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const popoverContext = require('./popover-context.cjs');
 
 const PopoverArrow = props => {
   const popover = popoverContext.usePopoverContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => popover().arrowProps, props));
+  const arrowProps = solid.mergeProps(() => popover().arrowProps, props);
+  return web.createComponent(factory.ark.div, arrowProps);
 };
 
 exports.PopoverArrow = PopoverArrow;

package/dist/popover/popover-arrow.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { usePopoverContext } from './popover-context.mjs';
 
 const PopoverArrow = props => {
   const popover = usePopoverContext();
-  return createComponent(ark.div, mergeProps(() => popover().arrowProps, props));
+  const arrowProps = mergeProps(() => popover().arrowProps, props);
+  return createComponent(ark.div, arrowProps);
 };
 
 export { PopoverArrow };

package/dist/popover/popover-close-trigger.cjs

@@ -2,22 +2,15 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const solidJs = require('solid-js');
 const web = require('solid-js/web');
-const ssrSpread = require('../ssr-spread.cjs');
+const solid = require('@zag-js/solid');
+const factory = require('../factory.cjs');
 const popoverContext = require('./popover-context.cjs');
 
 const PopoverCloseTrigger = props => {
-  const popover = popoverContext.usePopoverContext();
-  const triggerProps = popover().closeTriggerProps;
-  const getChildren = solidJs.children(() => ssrSpread.ssrSpread(props.children, triggerProps));
-  solidJs.createEffect(() => {
-    const children = getChildren();
-    if (children instanceof HTMLElement) {
-      web.spread(children, triggerProps);
-    }
-  });
-  return getChildren;
+  const api = popoverContext.usePopoverContext();
+  const triggerProps = solid.mergeProps(() => api().closeTriggerProps, props);
+  return web.createComponent(factory.ark.button, triggerProps);
 };
 
 exports.PopoverCloseTrigger = PopoverCloseTrigger;

package/dist/popover/popover-close-trigger.d.ts

@@ -1,5 +1,4 @@
-import type { ChildrenReturn, type JSX } from 'solid-js';
-export type PopoverCloseTriggerProps = {
-    children: JSX.Element;
-};
-export declare const PopoverCloseTrigger: (props: PopoverCloseTriggerProps) => ChildrenReturn;
+import type { JSX } from 'solid-js';
+import { type HTMLArkProps } from '../factory';
+export type PopoverCloseTriggerProps = HTMLArkProps<'button'>;
+export declare const PopoverCloseTrigger: (props: PopoverCloseTriggerProps) => JSX.Element;

package/dist/popover/popover-close-trigger.mjs

@@ -1,19 +1,12 @@
-import { children, createEffect } from 'solid-js';
-import { spread } from 'solid-js/web';
-import { ssrSpread } from '../ssr-spread.mjs';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory.mjs';
 import { usePopoverContext } from './popover-context.mjs';
 
 const PopoverCloseTrigger = props => {
-  const popover = usePopoverContext();
-  const triggerProps = popover().closeTriggerProps;
-  const getChildren = children(() => ssrSpread(props.children, triggerProps));
-  createEffect(() => {
-    const children = getChildren();
-    if (children instanceof HTMLElement) {
-      spread(children, triggerProps);
-    }
-  });
-  return getChildren;
+  const api = usePopoverContext();
+  const triggerProps = mergeProps(() => api().closeTriggerProps, props);
+  return createComponent(ark.button, triggerProps);
 };
 
 export { PopoverCloseTrigger };

package/dist/popover/popover-content.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const popoverContext = require('./popover-context.cjs');
 
 const PopoverContent = props => {
-  const popover = popoverContext.usePopoverContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => popover().contentProps, props));
+  const api = popoverContext.usePopoverContext();
+  const contentProps = solid.mergeProps(() => api().contentProps, props);
+  return web.createComponent(factory.ark.div, contentProps);
 };
 
 exports.PopoverContent = PopoverContent;

package/dist/popover/popover-content.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { usePopoverContext } from './popover-context.mjs';
 
 const PopoverContent = props => {
-  const popover = usePopoverContext();
-  return createComponent(ark.div, mergeProps(() => popover().contentProps, props));
+  const api = usePopoverContext();
+  const contentProps = mergeProps(() => api().contentProps, props);
+  return createComponent(ark.div, contentProps);
 };
 
 export { PopoverContent };

package/dist/popover/popover-description.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const popoverContext = require('./popover-context.cjs');
 
 const PopoverDescription = props => {
-  const popover = popoverContext.usePopoverContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => popover().descriptionProps, props));
+  const api = popoverContext.usePopoverContext();
+  const descriptionProps = solid.mergeProps(() => api().descriptionProps, props);
+  return web.createComponent(factory.ark.div, descriptionProps);
 };
 
 exports.PopoverDescription = PopoverDescription;

package/dist/popover/popover-description.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { usePopoverContext } from './popover-context.mjs';
 
 const PopoverDescription = props => {
-  const popover = usePopoverContext();
-  return createComponent(ark.div, mergeProps(() => popover().descriptionProps, props));
+  const api = usePopoverContext();
+  const descriptionProps = mergeProps(() => api().descriptionProps, props);
+  return createComponent(ark.div, descriptionProps);
 };
 
 export { PopoverDescription };

package/dist/popover/popover-positioner.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const popoverContext = require('./popover-context.cjs');
 
 const PopoverPositioner = props => {
-  const popover = popoverContext.usePopoverContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => popover().positionerProps, props));
+  const api = popoverContext.usePopoverContext();
+  const positionerProps = solid.mergeProps(() => api().positionerProps, props);
+  return web.createComponent(factory.ark.div, positionerProps);
 };
 
 exports.PopoverPositioner = PopoverPositioner;

package/dist/popover/popover-positioner.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { usePopoverContext } from './popover-context.mjs';
 
 const PopoverPositioner = props => {
-  const popover = usePopoverContext();
-  return createComponent(ark.div, mergeProps(() => popover().positionerProps, props));
+  const api = usePopoverContext();
+  const positionerProps = mergeProps(() => api().positionerProps, props);
+  return createComponent(ark.div, positionerProps);
 };
 
 export { PopoverPositioner };

package/dist/popover/popover-title.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const popoverContext = require('./popover-context.cjs');
 
 const PopoverTitle = props => {
-  const popover = popoverContext.usePopoverContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => popover().titleProps, props));
+  const api = popoverContext.usePopoverContext();
+  const titleProps = solid.mergeProps(() => api().titleProps, props);
+  return web.createComponent(factory.ark.div, titleProps);
 };
 
 exports.PopoverTitle = PopoverTitle;

package/dist/popover/popover-title.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { usePopoverContext } from './popover-context.mjs';
 
 const PopoverTitle = props => {
-  const popover = usePopoverContext();
-  return createComponent(ark.div, mergeProps(() => popover().titleProps, props));
+  const api = usePopoverContext();
+  const titleProps = mergeProps(() => api().titleProps, props);
+  return createComponent(ark.div, titleProps);
 };
 
 export { PopoverTitle };

package/dist/popover/popover-trigger.cjs

@@ -2,22 +2,15 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const solidJs = require('solid-js');
-const spread = require('../spread.cjs');
-const ssrSpread = require('../ssr-spread.cjs');
+const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
+const factory = require('../factory.cjs');
 const popoverContext = require('./popover-context.cjs');
 
 const PopoverTrigger = props => {
-  const popover = popoverContext.usePopoverContext();
-  const triggerProps = popover().triggerProps;
-  const getChildren = solidJs.children(() => ssrSpread.ssrSpread(props.children, triggerProps));
-  solidJs.createEffect(() => {
-    const children = getChildren();
-    if (children instanceof HTMLElement) {
-      spread.spread(children, triggerProps);
-    }
-  });
-  return getChildren;
+  const api = popoverContext.usePopoverContext();
+  const triggerProps = solid.mergeProps(() => api().triggerProps, props);
+  return web.createComponent(factory.ark.button, triggerProps);
 };
 
 exports.PopoverTrigger = PopoverTrigger;

package/dist/popover/popover-trigger.d.ts

@@ -1,5 +1,4 @@
-import type { ChildrenReturn, type JSX } from 'solid-js';
-export type PopoverTriggerProps = {
-    children: JSX.Element;
-};
-export declare const PopoverTrigger: (props: PopoverTriggerProps) => ChildrenReturn;
+import type { JSX } from 'solid-js';
+import { type HTMLArkProps } from '../factory';
+export type PopoverTriggerProps = HTMLArkProps<'button'>;
+export declare const PopoverTrigger: (props: PopoverTriggerProps) => JSX.Element;

package/dist/popover/popover-trigger.mjs

@@ -1,19 +1,12 @@
-import { children, createEffect } from 'solid-js';
-import { spread } from '../spread.mjs';
-import { ssrSpread } from '../ssr-spread.mjs';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory.mjs';
 import { usePopoverContext } from './popover-context.mjs';
 
 const PopoverTrigger = props => {
-  const popover = usePopoverContext();
-  const triggerProps = popover().triggerProps;
-  const getChildren = children(() => ssrSpread(props.children, triggerProps));
-  createEffect(() => {
-    const children = getChildren();
-    if (children instanceof HTMLElement) {
-      spread(children, triggerProps);
-    }
-  });
-  return getChildren;
+  const api = usePopoverContext();
+  const triggerProps = mergeProps(() => api().triggerProps, props);
+  return createComponent(ark.button, triggerProps);
 };
 
 export { PopoverTrigger };

package/dist/popover/popover.cjs

@@ -9,9 +9,9 @@ const usePopover = require('./use-popover.cjs');
 
 const Popover = props => {
   const [usePopoverProps, restProps] = createSplitProps.createSplitProps()(props, ['autoFocus', 'closeOnEsc', 'closeOnInteractOutside', 'getRootNode', 'id', 'ids', 'initialFocusEl', 'modal', 'onClose', 'onEscapeKeyDown', 'onFocusOutside', 'onInteractOutside', 'onOpen', 'onPointerDownOutside', 'open', 'portalled', 'positioning']);
-  const popover = usePopover.usePopover(usePopoverProps);
+  const api = usePopover.usePopover(usePopoverProps);
   return web.createComponent(popoverContext.PopoverProvider, {
-    value: popover,
+    value: api,
     get children() {
       return restProps.children;
     }

package/dist/popover/popover.mjs

@@ -5,9 +5,9 @@ import { usePopover } from './use-popover.mjs';
 
 const Popover = props => {
   const [usePopoverProps, restProps] = createSplitProps()(props, ['autoFocus', 'closeOnEsc', 'closeOnInteractOutside', 'getRootNode', 'id', 'ids', 'initialFocusEl', 'modal', 'onClose', 'onEscapeKeyDown', 'onFocusOutside', 'onInteractOutside', 'onOpen', 'onPointerDownOutside', 'open', 'portalled', 'positioning']);
-  const popover = usePopover(usePopoverProps);
+  const api = usePopover(usePopoverProps);
   return createComponent(PopoverProvider, {
-    value: popover,
+    value: api,
     get children() {
       return restProps.children;
     }

package/dist/pressable/pressable.cjs

@@ -3,16 +3,16 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const createSplitProps = require('../create-split-props.cjs');
 const factory = require('../factory.cjs');
 const usePressable = require('./use-pressable.cjs');
 
 const Pressable = props => {
-  const [usePressableProps, buttonProps] = createSplitProps.createSplitProps()(props, ['allowTextSelectionOnPress', 'cancelOnPointerExit', 'dir', 'disabled', 'getRootNode', 'id', 'onLongPress', 'onPress', 'onPressEnd', 'onPressStart', 'onPressUp', 'preventFocusOnPress']);
-  const {
-    pressableProps
-  } = usePressable.usePressable(usePressableProps);
-  return web.createComponent(factory.ark.button, web.mergeProps(pressableProps, buttonProps));
+  const [pressableParams, restProps] = createSplitProps.createSplitProps()(props, ['allowTextSelectionOnPress', 'cancelOnPointerExit', 'dir', 'disabled', 'getRootNode', 'id', 'onLongPress', 'onPress', 'onPressEnd', 'onPressStart', 'onPressUp', 'preventFocusOnPress']);
+  const api = usePressable.usePressable(pressableParams);
+  const buttonProps = solid.mergeProps(() => api().pressableProps, restProps);
+  return web.createComponent(factory.ark.button, buttonProps);
 };
 
 exports.Pressable = Pressable;

package/dist/pressable/pressable.d.ts

@@ -1,6 +1,6 @@
 import type { JSX } from 'solid-js';
-import { type Assign } from '@polymorphic-factory/solid';
 import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
 import { type UsePressableProps } from './use-pressable';
 export type PressableProps = Assign<HTMLArkProps<'button'>, UsePressableProps>;
 export declare const Pressable: (props: PressableProps) => JSX.Element;