@ark-ui/react 0.14.0 → 0.15.0

package/toggle-group/index.mjs

@@ -0,0 +1,12 @@
+'use client';
+import { Toggle } from './toggle.mjs';
+import { ToggleGroup as ToggleGroup$1 } from './toggle-group.mjs';
+export { useToggleGroupContext } from './toggle-group-context.mjs';
+export { toggleGroupAnatomy } from './toggle-group.anatomy.mjs';
+
+const ToggleGroup = Object.assign(ToggleGroup$1, {
+  Root: ToggleGroup$1,
+  Toggle
+});
+
+export { Toggle, ToggleGroup };

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

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

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

@@ -0,0 +1,5 @@
+import { Provider } from 'react';
+/// <reference types="react" />
+import { type UseToggleGroupReturn } from './use-toggle-group';
+export type ToggleGroupContext = UseToggleGroupReturn;
+export declare const ToggleGroupProvider: Provider<UseToggleGroupReturn>, useToggleGroupContext: () => UseToggleGroupReturn;

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

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

package/toggle-group/toggle-group.anatomy.cjs

@@ -0,0 +1,10 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const anatomy = require('@zag-js/anatomy');
+
+const toggleGroupAnatomy = anatomy.createAnatomy("toggle-group").parts("root", "toggle");
+
+exports.toggleGroupAnatomy = toggleGroupAnatomy;

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

@@ -0,0 +1,2 @@
+import { AnatomyInstance } from '@zag-js/anatomy';
+export declare const toggleGroupAnatomy: AnatomyInstance<"root" | "toggle">;

package/toggle-group/toggle-group.anatomy.mjs

@@ -0,0 +1,6 @@
+'use client';
+import { createAnatomy } from '@zag-js/anatomy';
+
+const toggleGroupAnatomy = createAnatomy("toggle-group").parts("root", "toggle");
+
+export { toggleGroupAnatomy };

package/toggle-group/toggle-group.cjs

@@ -0,0 +1,35 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react$1 = require('@zag-js/react');
+const react = require('react');
+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 = react.forwardRef((props, ref) => {
+  const [toggleGroup, localProps] = createSplitProps.createSplitProps()(props, [
+    "defaultValue",
+    "dir",
+    "disabled",
+    "getRootNode",
+    "id",
+    "ids",
+    "loop",
+    "multiple",
+    "onChange",
+    "orientation",
+    "rovingFocus",
+    "value"
+  ]);
+  const api = useToggleGroup.useToggleGroup(toggleGroup);
+  const mergedProps = react$1.mergeProps(api.rootProps, localProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(toggleGroupContext.ToggleGroupProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
+});
+ToggleGroup.displayName = "ToggleGroup";
+
+exports.ToggleGroup = ToggleGroup;

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

@@ -0,0 +1,7 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+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: ForwardRefExoticComponent<Omit<HTMLArkProps<"div">, keyof UseToggleGroupProps> & UseToggleGroupProps & RefAttributes<HTMLDivElement>>;

package/toggle-group/toggle-group.mjs

@@ -0,0 +1,31 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+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 = forwardRef((props, ref) => {
+  const [toggleGroup, localProps] = createSplitProps()(props, [
+    "defaultValue",
+    "dir",
+    "disabled",
+    "getRootNode",
+    "id",
+    "ids",
+    "loop",
+    "multiple",
+    "onChange",
+    "orientation",
+    "rovingFocus",
+    "value"
+  ]);
+  const api = useToggleGroup(toggleGroup);
+  const mergedProps = mergeProps(api.rootProps, localProps);
+  return /* @__PURE__ */ jsx(ToggleGroupProvider, { value: api, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
+});
+ToggleGroup.displayName = "ToggleGroup";
+
+export { ToggleGroup };

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

@@ -0,0 +1,9 @@
+import { JSX } from 'react/jsx-runtime';
+import type { Meta } from '@storybook/react';
+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/toggle-group/toggle.cjs

@@ -0,0 +1,21 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react$1 = require('@zag-js/react');
+const react = require('react');
+const createSplitProps = require('../create-split-props.cjs');
+const factory = require('../factory.cjs');
+const toggleGroupContext = require('./toggle-group-context.cjs');
+
+const Toggle = react.forwardRef((props, ref) => {
+  const [toggleProps, localProps] = createSplitProps.createSplitProps()(props, ["value", "disabled"]);
+  const api = toggleGroupContext.useToggleGroupContext();
+  const mergedProps = react$1.mergeProps(api.getToggleProps(toggleProps), localProps);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
+});
+Toggle.displayName = "Toggle";
+
+exports.Toggle = Toggle;

package/toggle-group/toggle.d.ts

@@ -0,0 +1,11 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+import { type Assign } from '../types';
+type _ToggleProps = {
+    value: string;
+    disabled?: boolean;
+};
+export type ToggleProps = Assign<HTMLArkProps<'button'>, _ToggleProps>;
+export declare const Toggle: ForwardRefExoticComponent<Omit<HTMLArkProps<"button">, keyof _ToggleProps> & _ToggleProps & RefAttributes<HTMLButtonElement>>;
+export {};

package/toggle-group/toggle.mjs

@@ -0,0 +1,17 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { createSplitProps } from '../create-split-props.mjs';
+import { ark } from '../factory.mjs';
+import { useToggleGroupContext } from './toggle-group-context.mjs';
+
+const Toggle = forwardRef((props, ref) => {
+  const [toggleProps, localProps] = createSplitProps()(props, ["value", "disabled"]);
+  const api = useToggleGroupContext();
+  const mergedProps = mergeProps(api.getToggleProps(toggleProps), localProps);
+  return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
+});
+Toggle.displayName = "Toggle";
+
+export { Toggle };

package/toggle-group/use-toggle-group.cjs

@@ -0,0 +1,49 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const react$1 = require('@zag-js/react');
+const toggleGroup = require('@zag-js/toggle-group');
+const react = require('react');
+require('../environment/index.cjs');
+const environmentContext = require('../environment/environment-context.cjs');
+
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
+  if (e) {
+    for (const k in e) {
+      if (k !== 'default') {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+const toggleGroup__namespace = /*#__PURE__*/_interopNamespaceDefault(toggleGroup);
+
+const useToggleGroup = (props) => {
+  const getRootNode = environmentContext.useEnvironmentContext();
+  const initialContext = {
+    id: react.useId(),
+    getRootNode,
+    ...props,
+    value: props.defaultValue
+  };
+  const context = {
+    ...initialContext,
+    value: props.value
+  };
+  const [state, send] = react$1.useMachine(toggleGroup__namespace.machine(initialContext), {
+    context
+  });
+  return toggleGroup__namespace.connect(state, send, react$1.normalizeProps);
+};
+
+exports.useToggleGroup = useToggleGroup;

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

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

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

@@ -0,0 +1,26 @@
+'use client';
+import { useMachine, normalizeProps } from '@zag-js/react';
+import * as toggleGroup from '@zag-js/toggle-group';
+import { useId } from 'react';
+import '../environment/index.mjs';
+import { useEnvironmentContext } from '../environment/environment-context.mjs';
+
+const useToggleGroup = (props) => {
+  const getRootNode = useEnvironmentContext();
+  const initialContext = {
+    id: useId(),
+    getRootNode,
+    ...props,
+    value: props.defaultValue
+  };
+  const context = {
+    ...initialContext,
+    value: props.value
+  };
+  const [state, send] = useMachine(toggleGroup.machine(initialContext), {
+    context
+  });
+  return toggleGroup.connect(state, send, normalizeProps);
+};
+
+export { useToggleGroup };

package/tooltip/index.d.ts

@@ -1,5 +1,5 @@
-import { PresenceProps } from '..';
-import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, ButtonHTMLAttributes } from 'react';
+import { HTMLArkProps, PresenceProps } from '..';
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefAttributes, ButtonHTMLAttributes } from 'react';
 import { JSX } from 'react/jsx-runtime';
 /// <reference types="react" />
 import { type TooltipProps } from './tooltip';
@@ -12,31 +12,19 @@ import { TooltipTrigger, type TooltipTriggerProps } from './tooltip-trigger';
 import { tooltipAnatomy } from './tooltip.anatomy';
 declare const Tooltip: ((props: TooltipProps) => JSX.Element) & {
     Root: (props: TooltipProps) => JSX.Element;
-    Arrow: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
-    } & {
+    Arrow: ForwardRefExoticComponent<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
         asChild?: boolean | undefined;
-    }, "ref"> & RefAttributes<HTMLDivElement>>;
-    ArrowTip: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
-    } & {
+    } & RefAttributes<HTMLDivElement>>;
+    ArrowTip: ForwardRefExoticComponent<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
         asChild?: boolean | undefined;
-    }, "ref"> & RefAttributes<HTMLDivElement>>;
-    Content: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
-    } & {
+    } & RefAttributes<HTMLDivElement>>;
+    Content: ForwardRefExoticComponent<Omit<HTMLArkProps<"div">, "present" | "onExitComplete" | "lazyMount" | "unmountOnExit"> & Omit<PresenceProps, "children"> & RefAttributes<HTMLDivElement>>;
+    Positioner: ForwardRefExoticComponent<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
         asChild?: boolean | undefined;
-    }, "ref"> & Omit<PresenceProps, "children"> & RefAttributes<HTMLDivElement>>;
-    Positioner: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-        ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
-    } & {
+    } & RefAttributes<HTMLDivElement>>;
+    Trigger: ForwardRefExoticComponent<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
         asChild?: boolean | undefined;
-    }, "ref"> & RefAttributes<HTMLDivElement>>;
-    Trigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-        ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
-    } & {
-        asChild?: boolean | undefined;
-    }, "ref"> & RefAttributes<HTMLButtonElement>>;
+    } & RefAttributes<HTMLButtonElement>>;
 };
 export { Tooltip, TooltipArrow, TooltipArrowTip, TooltipContent, TooltipPositioner, TooltipTrigger, tooltipAnatomy, useTooltipContext, };
 export type { TooltipArrowProps, TooltipArrowTipProps, TooltipContentProps, TooltipPositionerProps, TooltipProps, TooltipTriggerProps, };

package/tooltip/tooltip-arrow-tip.d.ts

@@ -1,8 +1,7 @@
-import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
-import { ark } from '../factory';
-export type TooltipArrowTipProps = ComponentPropsWithoutRef<typeof ark.div>;
-export declare const TooltipArrowTip: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
-} & {
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+export type TooltipArrowTipProps = HTMLArkProps<'div'>;
+export declare const TooltipArrowTip: ForwardRefExoticComponent<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     asChild?: boolean | undefined;
-}, "ref"> & RefAttributes<HTMLDivElement>>;
+} & RefAttributes<HTMLDivElement>>;

package/tooltip/tooltip-arrow.d.ts

@@ -1,8 +1,7 @@
-import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
-import { ark } from '../factory';
-export type TooltipArrowProps = ComponentPropsWithoutRef<typeof ark.div>;
-export declare const TooltipArrow: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
-} & {
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+export type TooltipArrowProps = HTMLArkProps<'div'>;
+export declare const TooltipArrow: ForwardRefExoticComponent<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     asChild?: boolean | undefined;
-}, "ref"> & RefAttributes<HTMLDivElement>>;
+} & RefAttributes<HTMLDivElement>>;

package/tooltip/tooltip-content.cjs

@@ -7,23 +7,22 @@ const jsxRuntime = require('react/jsx-runtime');
 const react$1 = require('@zag-js/react');
 const react = require('react');
 const factory = require('../factory.cjs');
-require('../presence/index.cjs');
+const index = require('../presence/index.cjs');
 const tooltipContext = require('./tooltip-context.cjs');
-const tooltipPresence = require('./tooltip-presence.cjs');
 const splitPresenceProps = require('../presence/split-presence-props.cjs');
 
 const TooltipContent = react.forwardRef((props, ref) => {
   const [presenceProps, tooltipContentProps] = splitPresenceProps.splitPresenceProps(props);
-  return /* @__PURE__ */ jsxRuntime.jsx(tooltipPresence.TooltipPresence, { ...presenceProps, children: /* @__PURE__ */ jsxRuntime.jsx(InnerTooltipContent, { ref, ...tooltipContentProps }) });
+  const api = tooltipContext.useTooltipContext();
+  return /* @__PURE__ */ jsxRuntime.jsx(index.Presence, { present: api.isOpen, ...presenceProps, children: /* @__PURE__ */ jsxRuntime.jsx(TooltipInnerContent, { ref, ...tooltipContentProps }) });
 });
 TooltipContent.displayName = "TooltipContent";
-const InnerTooltipContent = react.forwardRef(
-  (props, ref) => {
+const TooltipInnerContent = react.forwardRef(
+  function TooltipInnerContent2(props, ref) {
     const { contentProps } = tooltipContext.useTooltipContext();
     const mergedProps = react$1.mergeProps(contentProps, props);
     return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
   }
 );
-InnerTooltipContent.displayName = "InnerTooltipContent";
 
 exports.TooltipContent = TooltipContent;

package/tooltip/tooltip-content.d.ts

@@ -1,10 +1,7 @@
-import { PresenceProps } from '../presence';
-import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
-import { ark } from '../factory';
-import { type TooltipPresenceProps } from './tooltip-presence';
-export type TooltipContentProps = ComponentPropsWithoutRef<typeof ark.div> & Omit<TooltipPresenceProps, 'children'>;
-export declare const TooltipContent: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
-} & {
-    asChild?: boolean | undefined;
-}, "ref"> & Omit<PresenceProps, "children"> & RefAttributes<HTMLDivElement>>;
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+import { type PresenceProps } from '../presence';
+import type { Assign } from '../types';
+export type TooltipContentProps = Assign<HTMLArkProps<'div'>, Omit<PresenceProps, 'children'>>;
+export declare const TooltipContent: ForwardRefExoticComponent<Omit<HTMLArkProps<"div">, "present" | "onExitComplete" | "lazyMount" | "unmountOnExit"> & Omit<PresenceProps, "children"> & RefAttributes<HTMLDivElement>>;

package/tooltip/tooltip-content.mjs

@@ -3,23 +3,22 @@ import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
 import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
-import '../presence/index.mjs';
+import { Presence } from '../presence/index.mjs';
 import { useTooltipContext } from './tooltip-context.mjs';
-import { TooltipPresence } from './tooltip-presence.mjs';
 import { splitPresenceProps } from '../presence/split-presence-props.mjs';
 
 const TooltipContent = forwardRef((props, ref) => {
   const [presenceProps, tooltipContentProps] = splitPresenceProps(props);
-  return /* @__PURE__ */ jsx(TooltipPresence, { ...presenceProps, children: /* @__PURE__ */ jsx(InnerTooltipContent, { ref, ...tooltipContentProps }) });
+  const api = useTooltipContext();
+  return /* @__PURE__ */ jsx(Presence, { present: api.isOpen, ...presenceProps, children: /* @__PURE__ */ jsx(TooltipInnerContent, { ref, ...tooltipContentProps }) });
 });
 TooltipContent.displayName = "TooltipContent";
-const InnerTooltipContent = forwardRef(
-  (props, ref) => {
+const TooltipInnerContent = forwardRef(
+  function TooltipInnerContent2(props, ref) {
     const { contentProps } = useTooltipContext();
     const mergedProps = mergeProps(contentProps, props);
     return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
   }
 );
-InnerTooltipContent.displayName = "InnerTooltipContent";
 
 export { TooltipContent };

package/tooltip/tooltip-positioner.d.ts

@@ -1,8 +1,7 @@
-import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
-import { ark } from '../factory';
-export type TooltipPositionerProps = ComponentPropsWithoutRef<typeof ark.div>;
-export declare const TooltipPositioner: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | RefObject<HTMLDivElement> | null | undefined;
-} & {
+import { ForwardRefExoticComponent, DetailedHTMLProps, HTMLAttributes, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+export type TooltipPositionerProps = HTMLArkProps<'div'>;
+export declare const TooltipPositioner: ForwardRefExoticComponent<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     asChild?: boolean | undefined;
-}, "ref"> & RefAttributes<HTMLDivElement>>;
+} & RefAttributes<HTMLDivElement>>;

package/tooltip/tooltip-trigger.d.ts

@@ -1,8 +1,7 @@
-import { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefObject, RefAttributes, type ComponentPropsWithoutRef } from 'react';
-import { ark } from '../factory';
-export type TooltipTriggerProps = ComponentPropsWithoutRef<typeof ark.button>;
-export declare const TooltipTrigger: ForwardRefExoticComponent<Omit<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-    ref?: ((instance: HTMLButtonElement | null) => void) | RefObject<HTMLButtonElement> | null | undefined;
-} & {
+import { ForwardRefExoticComponent, DetailedHTMLProps, ButtonHTMLAttributes, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+export type TooltipTriggerProps = HTMLArkProps<'button'>;
+export declare const TooltipTrigger: ForwardRefExoticComponent<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
     asChild?: boolean | undefined;
-}, "ref"> & RefAttributes<HTMLButtonElement>>;
+} & RefAttributes<HTMLButtonElement>>;

package/tooltip/use-tooltip.d.ts

@@ -1,5 +1,6 @@
 import * as tooltip from '@zag-js/tooltip';
 import { type Optional } from '../types';
-export type UseTooltipProps = Optional<tooltip.Context, 'id'>;
+export interface UseTooltipProps extends Optional<tooltip.Context, 'id'> {
+}
 export type UseTooltipReturn = tooltip.Api;
 export declare const useTooltip: (props: UseTooltipProps) => UseTooltipReturn;

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/use-event.cjs

@@ -0,0 +1,23 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const react = require('react');
+const reactDom = require('react-dom');
+const useLatestRef = require('./use-latest-ref.cjs');
+
+function useEvent(callback, opts = {}) {
+  const { sync = false } = opts;
+  const callbackRef = useLatestRef.useLatestRef(callback);
+  return react.useCallback(
+    (...args) => {
+      if (sync)
+        return reactDom.flushSync(() => callbackRef.current?.(...args));
+      return callbackRef.current?.(...args);
+    },
+    [sync, callbackRef]
+  );
+}
+
+exports.useEvent = useEvent;

package/use-event.d.ts

@@ -0,0 +1,12 @@
+type AnyFunction = (...args: any[]) => any;
+type Options = {
+    /**
+     * Whether to use flushSync or not
+     */
+    sync?: boolean;
+};
+/**
+ * Returns a memoized callback that will flushSync the callback if sync is true
+ */
+export declare function useEvent<T extends AnyFunction>(callback: T | undefined, opts?: Options): T;
+export {};

package/use-event.mjs

@@ -0,0 +1,19 @@
+'use client';
+import { useCallback } from 'react';
+import { flushSync } from 'react-dom';
+import { useLatestRef } from './use-latest-ref.mjs';
+
+function useEvent(callback, opts = {}) {
+  const { sync = false } = opts;
+  const callbackRef = useLatestRef(callback);
+  return useCallback(
+    (...args) => {
+      if (sync)
+        return flushSync(() => callbackRef.current?.(...args));
+      return callbackRef.current?.(...args);
+    },
+    [sync, callbackRef]
+  );
+}
+
+export { useEvent };

package/use-latest-ref.cjs

@@ -0,0 +1,14 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const react = require('react');
+
+function useLatestRef(value) {
+  const ref = react.useRef(value);
+  ref.current = value;
+  return ref;
+}
+
+exports.useLatestRef = useLatestRef;

package/use-latest-ref.mjs

@@ -0,0 +1,10 @@
+'use client';
+import { useRef } from 'react';
+
+function useLatestRef(value) {
+  const ref = useRef(value);
+  ref.current = value;
+  return ref;
+}
+
+export { useLatestRef };

package/accordion/accordion-item-presence.cjs

@@ -1,16 +0,0 @@
-'use client';
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-const index = require('../presence/index.cjs');
-const accordionItemContext = require('./accordion-item-context.cjs');
-
-const AccordionItemPresence = (props) => {
-  const { present, ...rest } = props;
-  const { isOpen } = accordionItemContext.useAccordionItemContext();
-  return /* @__PURE__ */ jsxRuntime.jsx(index.Presence, { present: present !== void 0 ? present : isOpen, ...rest });
-};
-
-exports.AccordionItemPresence = AccordionItemPresence;

package/accordion/accordion-item-presence.d.ts

@@ -1,4 +0,0 @@
-import { JSX } from 'react/jsx-runtime';
-import { type PresenceProps } from '../presence';
-export type AccordionItemPresenceProps = PresenceProps;
-export declare const AccordionItemPresence: (props: AccordionItemPresenceProps) => JSX.Element;