@ark-ui/solid 0.10.1 → 1.0.0-beta.0

package/toast/toast.cjs

@@ -4,26 +4,13 @@ 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 toastItemContext = require('./toast-item-context.cjs');
-const useToastItem = require('./use-toast-item.cjs');
+const toastContext = require('./toast-context.cjs');
 
 const Toast = props => {
-  const [toastParams, localProps] = createSplitProps.createSplitProps()(props, ['toast']);
-  const api = useToastItem.useToastItem(toastParams);
-  const rootProps = solid.mergeProps(() => api().rootProps, localProps);
-  const customToast = api().render();
-  return web.createComponent(toastItemContext.ToastItemProvider, {
-    value: api,
-    get children() {
-      return web.createComponent(factory.ark.div, web.mergeProps(rootProps, {
-        get children() {
-          return customToast || props.children;
-        }
-      }));
-    }
-  });
+  const api = toastContext.useToastContext();
+  const mergedProps = solid.mergeProps(() => api().rootProps, props);
+  return web.createComponent(factory.ark.li, mergedProps);
 };
 
 exports.Toast = Toast;

package/toast/toast.d.ts

@@ -1,6 +1,4 @@
 import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
-import type { Assign } from '../types';
-import { type UseToastItemProps } from './use-toast-item';
-export type ToastProps = Assign<HTMLArkProps<'div'>, UseToastItemProps>;
+export type ToastProps = HTMLArkProps<'li'>;
 export declare const Toast: (props: ToastProps) => JSX.Element;

package/toast/toast.mjs

@@ -1,25 +1,12 @@
-import { createComponent, mergeProps as mergeProps$1 } 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 { ToastItemProvider } from './toast-item-context.mjs';
-import { useToastItem } from './use-toast-item.mjs';
+import { useToastContext } from './toast-context.mjs';
 
 const Toast = props => {
-  const [toastParams, localProps] = createSplitProps()(props, ['toast']);
-  const api = useToastItem(toastParams);
-  const rootProps = mergeProps(() => api().rootProps, localProps);
-  const customToast = api().render();
-  return createComponent(ToastItemProvider, {
-    value: api,
-    get children() {
-      return createComponent(ark.div, mergeProps$1(rootProps, {
-        get children() {
-          return customToast || props.children;
-        }
-      }));
-    }
-  });
+  const api = useToastContext();
+  const mergedProps = mergeProps(() => api().rootProps, props);
+  return createComponent(ark.li, mergedProps);
 };
 
 export { Toast };

package/toast/toast.stories.d.ts

@@ -1,12 +1,7 @@
 import { JSX } from 'solid-js';
 import type { Meta } from 'storybook-solidjs';
-import { Toast, type ToastProviderProps } from '.';
+import { Toast } from './';
 type ToastType = typeof Toast;
 declare const meta: Meta<ToastType>;
 export default meta;
-export declare const AppToastProvider: (props: ToastProviderProps) => JSX.Element;
-export declare const App: () => JSX.Element;
-export declare const SimpleToast: () => JSX.Element;
-export declare const ConfigureToast: () => JSX.Element;
-export declare const CustomRenderToast: () => JSX.Element;
-export declare const DefaultOptions: () => JSX.Element;
+export declare const Basic: () => JSX.Element;

package/toast/toast.test.d.ts

@@ -0,0 +1,2 @@
+import { JSX } from 'solid-js';
+export declare const ComponentUnderTest: () => JSX.Element;

package/toggle-group/index.cjs

@@ -0,0 +1,16 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const toggleGroup = require('./toggle-group.cjs');
+const toggleGroupContext = require('./toggle-group-context.cjs');
+const toggleGroupItem = require('./toggle-group-item.cjs');
+
+const ToggleGroup = Object.assign(toggleGroup.ToggleGroup, {
+  Root: toggleGroup.ToggleGroup,
+  Item: toggleGroupItem.ToggleGroupItem
+});
+
+exports.useToggleGroupContext = toggleGroupContext.useToggleGroupContext;
+exports.ToggleGroupItem = toggleGroupItem.ToggleGroupItem;
+exports.ToggleGroup = ToggleGroup;

package/toggle-group/index.d.ts

@@ -0,0 +1,10 @@
+import { JSX } from 'solid-js';
+import { type ToggleGroupProps } from './toggle-group';
+import { useToggleGroupContext, type ToggleGroupContext } from './toggle-group-context';
+import { ToggleGroupItem, type ToggleGroupItemProps } from './toggle-group-item';
+declare const ToggleGroup: ((props: ToggleGroupProps) => JSX.Element) & {
+    Root: (props: ToggleGroupProps) => JSX.Element;
+    Item: (props: ToggleGroupItemProps) => JSX.Element;
+};
+export { ToggleGroup, ToggleGroupItem, useToggleGroupContext };
+export type { ToggleGroupContext, ToggleGroupItemProps, ToggleGroupProps };

package/toggle-group/index.mjs

@@ -0,0 +1,10 @@
+import { ToggleGroup as ToggleGroup$1 } from './toggle-group.mjs';
+export { useToggleGroupContext } from './toggle-group-context.mjs';
+import { ToggleGroupItem } from './toggle-group-item.mjs';
+
+const ToggleGroup = Object.assign(ToggleGroup$1, {
+  Root: ToggleGroup$1,
+  Item: ToggleGroupItem
+});
+
+export { ToggleGroup, ToggleGroupItem };

package/toggle-group/toggle-group-context.cjs

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const createContext = require('../create-context.cjs');
+
+const [ToggleGroupProvider, useToggleGroupContext] = createContext.createContext({
+  hookName: "useToggleGroupContext",
+  providerName: "<ToggleGroupProvider />"
+});
+
+exports.ToggleGroupProvider = ToggleGroupProvider;
+exports.useToggleGroupContext = useToggleGroupContext;

package/toggle-group/toggle-group-context.d.ts

@@ -0,0 +1,4 @@
+import { ContextProviderComponent } from 'solid-js';
+import { type UseToggleGroupReturn } from './use-toggle-group';
+export type ToggleGroupContext = UseToggleGroupReturn;
+export declare const ToggleGroupProvider: ContextProviderComponent<UseToggleGroupReturn>, useToggleGroupContext: () => UseToggleGroupReturn;

package/toggle-group/toggle-group-context.mjs

@@ -0,0 +1,8 @@
+import { createContext } from '../create-context.mjs';
+
+const [ToggleGroupProvider, useToggleGroupContext] = createContext({
+  hookName: "useToggleGroupContext",
+  providerName: "<ToggleGroupProvider />"
+});
+
+export { ToggleGroupProvider, useToggleGroupContext };

package/toggle-group/toggle-group-item.cjs

@@ -0,0 +1,18 @@
+'use strict';
+
+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 toggleGroupContext = require('./toggle-group-context.cjs');
+
+const ToggleGroupItem = props => {
+  const [toggleProps, restProps] = createSplitProps.createSplitProps()(props, ['value', 'disabled']);
+  const api = toggleGroupContext.useToggleGroupContext();
+  const mergedProps = solid.mergeProps(() => api().getItemProps(toggleProps), restProps);
+  return web.createComponent(factory.ark.button, mergedProps);
+};
+
+exports.ToggleGroupItem = ToggleGroupItem;

package/toggle-group/toggle-group-item.d.ts

@@ -0,0 +1,7 @@
+import { JSX } from 'solid-js';
+import type { ItemProps } from '@zag-js/toggle-group';
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+export interface ToggleGroupItemProps extends Assign<HTMLArkProps<'button'>, ItemProps> {
+}
+export declare const ToggleGroupItem: (props: ToggleGroupItemProps) => JSX.Element;

package/toggle-group/toggle-group-item.mjs

@@ -0,0 +1,14 @@
+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 { useToggleGroupContext } from './toggle-group-context.mjs';
+
+const ToggleGroupItem = props => {
+  const [toggleProps, restProps] = createSplitProps()(props, ['value', 'disabled']);
+  const api = useToggleGroupContext();
+  const mergedProps = mergeProps(() => api().getItemProps(toggleProps), restProps);
+  return createComponent(ark.button, mergedProps);
+};
+
+export { ToggleGroupItem };

package/toggle-group/toggle-group.cjs

@@ -0,0 +1,24 @@
+'use strict';
+
+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 toggleGroupContext = require('./toggle-group-context.cjs');
+const useToggleGroup = require('./use-toggle-group.cjs');
+
+const ToggleGroup = props => {
+  const [groupParams, restProps] = createSplitProps.createSplitProps()(props, ['dir', 'disabled', 'getRootNode', 'id', 'ids', 'loop', 'multiple', 'onValueChange', 'orientation', 'rovingFocus', 'value']);
+  const api = useToggleGroup.useToggleGroup(groupParams);
+  const rootProps = solid.mergeProps(() => api().rootProps, restProps);
+  return web.createComponent(toggleGroupContext.ToggleGroupProvider, {
+    value: api,
+    get children() {
+      return web.createComponent(factory.ark.div, rootProps);
+    }
+  });
+};
+
+exports.ToggleGroup = ToggleGroup;

package/toggle-group/toggle-group.d.ts

@@ -0,0 +1,6 @@
+import { JSX } from 'solid-js';
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { type UseToggleGroupProps } from './use-toggle-group';
+export type ToggleGroupProps = Assign<HTMLArkProps<'div'>, UseToggleGroupProps>;
+export declare const ToggleGroup: (props: ToggleGroupProps) => JSX.Element;

package/toggle-group/toggle-group.mjs

@@ -0,0 +1,20 @@
+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 { ToggleGroupProvider } from './toggle-group-context.mjs';
+import { useToggleGroup } from './use-toggle-group.mjs';
+
+const ToggleGroup = props => {
+  const [groupParams, restProps] = createSplitProps()(props, ['dir', 'disabled', 'getRootNode', 'id', 'ids', 'loop', 'multiple', 'onValueChange', 'orientation', 'rovingFocus', 'value']);
+  const api = useToggleGroup(groupParams);
+  const rootProps = mergeProps(() => api().rootProps, restProps);
+  return createComponent(ToggleGroupProvider, {
+    value: api,
+    get children() {
+      return createComponent(ark.div, rootProps);
+    }
+  });
+};
+
+export { ToggleGroup };

package/toggle-group/toggle-group.stories.d.ts

@@ -0,0 +1,9 @@
+import { JSX } from 'solid-js';
+import type { Meta } from 'storybook-solidjs';
+import { ToggleGroup } from './';
+type ToggleGroupType = typeof ToggleGroup;
+declare const meta: Meta<ToggleGroupType>;
+export default meta;
+export declare const Basic: () => JSX.Element;
+export declare const Initialvalue: () => JSX.Element;
+export declare const Multiple: () => JSX.Element;

package/toggle-group/toggle-group.test.d.ts

@@ -0,0 +1 @@
+export {};

package/{range-slider/use-range-slider.cjs → toggle-group/use-toggle-group.cjs}

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const rangeSlider = require('@zag-js/range-slider');
 const solid = require('@zag-js/solid');
+const toggleGroup = require('@zag-js/toggle-group');
 const solidJs = require('solid-js');
 require('../environment/index.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
@@ -25,15 +25,15 @@ function _interopNamespaceDefault(e) {
   return Object.freeze(n);
 }
 
-const rangeSlider__namespace = /*#__PURE__*/_interopNamespaceDefault(rangeSlider);
+const toggleGroup__namespace = /*#__PURE__*/_interopNamespaceDefault(toggleGroup);
 
-const useRangeSlider = (props) => {
+const useToggleGroup = (props) => {
   const getRootNode = environmentContext.useEnvironmentContext();
-  const context = solid.mergeProps({ id: solidJs.createUniqueId(), values: props.value, getRootNode }, props);
-  const [state, send] = solid.useMachine(rangeSlider__namespace.machine(context), {
+  const context = solid.mergeProps({ id: solidJs.createUniqueId(), getRootNode }, props);
+  const [state, send] = solid.useMachine(toggleGroup__namespace.machine(context), {
     context
   });
-  return solidJs.createMemo(() => rangeSlider__namespace.connect(state, send, solid.normalizeProps));
+  return solidJs.createMemo(() => toggleGroup__namespace.connect(state, send, solid.normalizeProps));
 };
 
-exports.useRangeSlider = useRangeSlider;
+exports.useToggleGroup = useToggleGroup;

package/toggle-group/use-toggle-group.d.ts

@@ -0,0 +1,7 @@
+import { type PropTypes } from '@zag-js/solid';
+import * as toggleGroup from '@zag-js/toggle-group';
+import { type Accessor } from 'solid-js';
+import { type Optional } from '../types';
+export type UseToggleGroupProps = Optional<toggleGroup.Context, 'id'>;
+export type UseToggleGroupReturn = Accessor<toggleGroup.Api<PropTypes>>;
+export declare const useToggleGroup: (props: UseToggleGroupProps) => UseToggleGroupReturn;

package/toggle-group/use-toggle-group.mjs

@@ -0,0 +1,16 @@
+import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
+import * as toggleGroup from '@zag-js/toggle-group';
+import { createUniqueId, createMemo } from 'solid-js';
+import '../environment/index.mjs';
+import { useEnvironmentContext } from '../environment/environment-context.mjs';
+
+const useToggleGroup = (props) => {
+  const getRootNode = useEnvironmentContext();
+  const context = mergeProps({ id: createUniqueId(), getRootNode }, props);
+  const [state, send] = useMachine(toggleGroup.machine(context), {
+    context
+  });
+  return createMemo(() => toggleGroup.connect(state, send, normalizeProps));
+};
+
+export { useToggleGroup };

package/tooltip/index.cjs

@@ -2,17 +2,16 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const tooltip$1 = require('./tooltip.cjs');
+const tooltip = require('./tooltip.cjs');
 const tooltipArrow = require('./tooltip-arrow.cjs');
 const tooltipArrowTip = require('./tooltip-arrow-tip.cjs');
 const tooltipContent = require('./tooltip-content.cjs');
 const tooltipContext = require('./tooltip-context.cjs');
 const tooltipPositioner = require('./tooltip-positioner.cjs');
 const tooltipTrigger = require('./tooltip-trigger.cjs');
-const tooltip = require('@zag-js/tooltip');
 
-const Tooltip = Object.assign(tooltip$1.Tooltip, {
-  Root: tooltip$1.Tooltip,
+const Tooltip = Object.assign(tooltip.Tooltip, {
+  Root: tooltip.Tooltip,
   Arrow: tooltipArrow.TooltipArrow,
   ArrowTip: tooltipArrowTip.TooltipArrowTip,
   Content: tooltipContent.TooltipContent,
@@ -26,8 +25,4 @@ exports.TooltipContent = tooltipContent.TooltipContent;
 exports.useTooltipContext = tooltipContext.useTooltipContext;
 exports.TooltipPositioner = tooltipPositioner.TooltipPositioner;
 exports.TooltipTrigger = tooltipTrigger.TooltipTrigger;
-Object.defineProperty(exports, 'tooltipAnatomy', {
-  enumerable: true,
-  get: () => tooltip.anatomy
-});
 exports.Tooltip = Tooltip;

package/tooltip/index.d.ts

@@ -1,10 +1,9 @@
 import { JSX } from 'solid-js';
 import { type TooltipProps } from './tooltip';
-import { tooltipAnatomy } from './tooltip-anatomy';
 import { TooltipArrow, type TooltipArrowProps } from './tooltip-arrow';
 import { TooltipArrowTip, type TooltipArrowTipProps } from './tooltip-arrow-tip';
 import { TooltipContent, type TooltipContentProps } from './tooltip-content';
-import { useTooltipContext } from './tooltip-context';
+import { useTooltipContext, type TooltipContext } from './tooltip-context';
 import { TooltipPositioner, type TooltipPositionerProps } from './tooltip-positioner';
 import { TooltipTrigger, type TooltipTriggerProps } from './tooltip-trigger';
 declare const Tooltip: ((props: TooltipProps) => JSX.Element) & {
@@ -15,5 +14,5 @@ declare const Tooltip: ((props: TooltipProps) => JSX.Element) & {
     Positioner: (props: TooltipPositionerProps) => JSX.Element;
     Trigger: (props: TooltipTriggerProps) => JSX.Element;
 };
-export { Tooltip, TooltipArrow, TooltipArrowTip, TooltipContent, TooltipPositioner, TooltipTrigger, tooltipAnatomy, useTooltipContext, };
-export type { TooltipArrowProps, TooltipArrowTipProps, TooltipContentProps, TooltipPositionerProps, TooltipProps, TooltipTriggerProps, };
+export { Tooltip, TooltipArrow, TooltipArrowTip, TooltipContent, TooltipPositioner, TooltipTrigger, useTooltipContext, };
+export type { TooltipArrowProps, TooltipArrowTipProps, TooltipContentProps, TooltipContext, TooltipPositionerProps, TooltipProps, TooltipTriggerProps, };

package/tooltip/index.mjs

@@ -5,7 +5,6 @@ import { TooltipContent } from './tooltip-content.mjs';
 export { useTooltipContext } from './tooltip-context.mjs';
 import { TooltipPositioner } from './tooltip-positioner.mjs';
 import { TooltipTrigger } from './tooltip-trigger.mjs';
-export { anatomy as tooltipAnatomy } from '@zag-js/tooltip';
 
 const Tooltip = Object.assign(Tooltip$1, {
   Root: Tooltip$1,

package/tooltip/tooltip-content.cjs

@@ -5,12 +5,23 @@ 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 index = require('../presence/index.cjs');
 const tooltipContext = require('./tooltip-context.cjs');
+const splitPresenceProps = require('../presence/split-presence-props.cjs');
 
 const TooltipContent = props => {
+  const [presenceProps, localProps] = splitPresenceProps.splitPresenceProps(props);
   const api = tooltipContext.useTooltipContext();
-  const contentProps = solid.mergeProps(() => api().contentProps, props);
-  return web.createComponent(factory.ark.div, contentProps);
+  const contentProps = solid.mergeProps(() => api().contentProps, localProps);
+  return web.createComponent(index.Presence, web.mergeProps({
+    get present() {
+      return api().isOpen;
+    }
+  }, presenceProps, {
+    get children() {
+      return web.createComponent(factory.ark.div, contentProps);
+    }
+  }));
 };
 
 exports.TooltipContent = TooltipContent;

package/tooltip/tooltip-content.d.ts

@@ -1,4 +1,5 @@
 import { JSX } from 'solid-js';
 import { type HTMLArkProps } from '../factory';
-export type TooltipContentProps = HTMLArkProps<'div'>;
+import { type PresenceProps } from '../presence';
+export type TooltipContentProps = HTMLArkProps<'div'> & PresenceProps;
 export declare const TooltipContent: (props: TooltipContentProps) => JSX.Element;

package/tooltip/tooltip-content.mjs

@@ -1,12 +1,23 @@
-import { createComponent } from 'solid-js/web';
+import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
 import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
+import { Presence } from '../presence/index.mjs';
 import { useTooltipContext } from './tooltip-context.mjs';
+import { splitPresenceProps } from '../presence/split-presence-props.mjs';
 
 const TooltipContent = props => {
+  const [presenceProps, localProps] = splitPresenceProps(props);
   const api = useTooltipContext();
-  const contentProps = mergeProps(() => api().contentProps, props);
-  return createComponent(ark.div, contentProps);
+  const contentProps = mergeProps(() => api().contentProps, localProps);
+  return createComponent(Presence, mergeProps$1({
+    get present() {
+      return api().isOpen;
+    }
+  }, presenceProps, {
+    get children() {
+      return createComponent(ark.div, contentProps);
+    }
+  }));
 };
 
 export { TooltipContent };

package/tooltip/tooltip-positioner.cjs

@@ -4,21 +4,13 @@ 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 tooltipContext = require('./tooltip-context.cjs');
 
 const TooltipPositioner = props => {
   const api = tooltipContext.useTooltipContext();
   const positionerProps = solid.mergeProps(() => api().positionerProps, props);
-  return web.createComponent(solidJs.Show, {
-    get when() {
-      return api().isOpen;
-    },
-    get children() {
-      return web.createComponent(factory.ark.div, positionerProps);
-    }
-  });
+  return web.createComponent(factory.ark.div, positionerProps);
 };
 
 exports.TooltipPositioner = TooltipPositioner;

package/tooltip/tooltip-positioner.mjs

@@ -1,20 +1,12 @@
 import { createComponent } from 'solid-js/web';
 import { mergeProps } from '@zag-js/solid';
-import { Show } from 'solid-js';
 import { ark } from '../factory.mjs';
 import { useTooltipContext } from './tooltip-context.mjs';
 
 const TooltipPositioner = props => {
   const api = useTooltipContext();
   const positionerProps = mergeProps(() => api().positionerProps, props);
-  return createComponent(Show, {
-    get when() {
-      return api().isOpen;
-    },
-    get children() {
-      return createComponent(ark.div, positionerProps);
-    }
-  });
+  return createComponent(ark.div, positionerProps);
 };
 
 export { TooltipPositioner };

package/tooltip/tooltip.cjs

@@ -8,7 +8,7 @@ const tooltipContext = require('./tooltip-context.cjs');
 const useTooltip = require('./use-tooltip.cjs');
 
 const Tooltip = props => {
-  const [useTooltipProps, restProps] = createSplitProps.createSplitProps()(props, ['aria-label', 'closeDelay', 'closeOnEsc', 'closeOnPointerDown', 'disabled', 'getRootNode', 'id', 'ids', 'interactive', 'onClose', 'onOpen', 'open', 'openDelay', 'positioning']);
+  const [useTooltipProps, restProps] = createSplitProps.createSplitProps()(props, ['aria-label', 'closeDelay', 'closeOnEsc', 'closeOnPointerDown', 'dir', 'disabled', 'getRootNode', 'id', 'ids', 'interactive', 'onOpenChange', 'open', 'openDelay', 'positioning']);
   const api = useTooltip.useTooltip(useTooltipProps);
   return web.createComponent(tooltipContext.TooltipProvider, web.mergeProps({
     value: api

package/tooltip/tooltip.mjs

@@ -4,7 +4,7 @@ import { TooltipProvider } from './tooltip-context.mjs';
 import { useTooltip } from './use-tooltip.mjs';
 
 const Tooltip = props => {
-  const [useTooltipProps, restProps] = createSplitProps()(props, ['aria-label', 'closeDelay', 'closeOnEsc', 'closeOnPointerDown', 'disabled', 'getRootNode', 'id', 'ids', 'interactive', 'onClose', 'onOpen', 'open', 'openDelay', 'positioning']);
+  const [useTooltipProps, restProps] = createSplitProps()(props, ['aria-label', 'closeDelay', 'closeOnEsc', 'closeOnPointerDown', 'dir', 'disabled', 'getRootNode', 'id', 'ids', 'interactive', 'onOpenChange', 'open', 'openDelay', 'positioning']);
   const api = useTooltip(useTooltipProps);
   return createComponent(TooltipProvider, mergeProps({
     value: api

package/types.d.ts

@@ -1,4 +1,5 @@
 type DistributiveOmit<T, K extends keyof any> = T extends any ? Omit<T, K> : never;
 export type Assign<T, U> = DistributiveOmit<T, keyof U> & U;
 export type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
+export type CollectionItem = string | object;
 export {};

package/accordion/accordion-content.d.ts

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

package/accordion/accordion-trigger.d.ts

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

package/accordion/accordion.anatomy.d.ts

@@ -1 +0,0 @@
-export { anatomy as accordionAnatomy } from '@zag-js/accordion';

package/avatar/avatar.anatomy.d.ts

@@ -1 +0,0 @@
-export { anatomy as avatarAnatomy } from '@zag-js/avatar';

package/carousel/carousel-next-slide-trigger.d.ts

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

package/carousel/carousel-prev-slide-trigger.d.ts

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

package/carousel/carousel.anatomy.cjs

@@ -1,10 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const carousel = require('@zag-js/carousel');
-
-const carouselAnatomy = carousel.anatomy.extendWith("control");
-carouselAnatomy.build();
-
-exports.carouselAnatomy = carouselAnatomy;

package/carousel/carousel.anatomy.d.ts

@@ -1,3 +0,0 @@
-import { AnatomyInstance, AnatomyPart } from '@zag-js/anatomy';
-export declare const carouselAnatomy: AnatomyInstance<"root" | "viewport" | "slideGroup" | "slide" | "nextSlideTrigger" | "prevSlideTrigger" | "indicatorGroup" | "indicator" | "control">;
-export declare const parts: Record<"root" | "viewport" | "slideGroup" | "slide" | "nextSlideTrigger" | "prevSlideTrigger" | "indicatorGroup" | "indicator" | "control", AnatomyPart>;

package/carousel/carousel.anatomy.mjs

@@ -1,6 +0,0 @@
-import { anatomy } from '@zag-js/carousel';
-
-const carouselAnatomy = anatomy.extendWith("control");
-carouselAnatomy.build();
-
-export { carouselAnatomy };

package/checkbox/checkbox.anatomy.d.ts

@@ -1 +0,0 @@
-export { anatomy as checkboxAnatomy } from '@zag-js/checkbox';

package/color-picker/color-picker-area-gradient.cjs

@@ -1,18 +0,0 @@
-'use strict';
-
-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 colorPickerAreaContext = require('./color-picker-area-context.cjs');
-const colorPickerContext = require('./color-picker-context.cjs');
-
-const ColorPickerAreaGradient = props => {
-  const colorPicker = colorPickerContext.useColorPickerContext();
-  const area = colorPickerAreaContext.useColorPickerAreaContext();
-  const areaGradientProps = solid.mergeProps(() => colorPicker().getAreaGradientProps(area), props);
-  return web.createComponent(factory.ark.div, areaGradientProps);
-};
-
-exports.ColorPickerAreaGradient = ColorPickerAreaGradient;

package/color-picker/color-picker-area-gradient.d.ts

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