@ark-ui/react 1.0.0-beta.4 → 1.0.0

package/splitter/splitter.d.ts

@@ -2,8 +2,8 @@ import { ForwardRefExoticComponent, RefAttributes, ReactNode } from 'react';
 import { type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
 import { type UseSplitterProps, type UseSplitterReturn } from './use-splitter';
-export interface SplitterProps extends Assign<HTMLArkProps<'div'>, UseSplitterProps & {
-    children?: ReactNode | ((state: UseSplitterReturn) => ReactNode);
-}> {
+export interface SplitterProps extends Assign<Assign<HTMLArkProps<'div'>, {
+    children?: ReactNode | ((api: UseSplitterReturn) => ReactNode);
+}>, UseSplitterProps> {
 }
 export declare const Splitter: ForwardRefExoticComponent<SplitterProps & RefAttributes<HTMLDivElement>>;

package/switch/switch.d.ts

@@ -2,8 +2,8 @@ import { ForwardRefExoticComponent, RefAttributes, ReactNode } from 'react';
 import { type HTMLArkProps } from '../factory';
 import type { Assign } from '../types';
 import { type UseSwitchProps, type UseSwitchReturn } from './use-switch';
-export interface SwitchProps extends Assign<Assign<HTMLArkProps<'label'>, UseSwitchProps>, {
-    children?: ReactNode | ((pages: UseSwitchReturn) => ReactNode);
-}> {
+export interface SwitchProps extends Assign<Assign<HTMLArkProps<'label'>, {
+    children?: ReactNode | ((api: UseSwitchReturn) => ReactNode);
+}>, UseSwitchProps> {
 }
 export declare const Switch: ForwardRefExoticComponent<SwitchProps & RefAttributes<HTMLLabelElement>>;

package/switch/switch.stories.d.ts

@@ -5,6 +5,7 @@ type SwitchType = typeof Switch;
 declare const meta: Meta<SwitchType>;
 export default meta;
 export declare const Basic: () => JSX.Element;
+export declare const InitialValue: () => JSX.Element;
 export declare const Controlled: () => JSX.Element;
 export declare const Disabled: () => JSX.Element;
 export declare const RenderProp: () => JSX.Element;

package/tabs/tab-content.cjs

@@ -10,22 +10,23 @@ const react = require('react');
 const createSplitProps = require('../create-split-props.cjs');
 const factory = require('../factory.cjs');
 require('../presence/index.cjs');
-const tabPresence = require('./tab-presence.cjs');
 const tabsContext = require('./tabs-context.cjs');
-const splitPresenceProps = require('../presence/split-presence-props.cjs');
+const presencePropsContext = require('../presence/presence-props-context.cjs');
+const usePresence = require('../presence/use-presence.cjs');
+const presenceContext = require('../presence/presence-context.cjs');
 
 const TabContent = react.forwardRef((props, ref) => {
-  const [presenceProps, tabContentProps] = splitPresenceProps.splitPresenceProps(props);
-  const [contentProps, localProps] = createSplitProps.createSplitProps()(tabContentProps, ["value"]);
-  return /* @__PURE__ */ jsxRuntime.jsx(tabPresence.TabPresence, { ...presenceProps, ...contentProps, children: /* @__PURE__ */ jsxRuntime.jsx(InnerTabContent, { ref, ...contentProps, ...localProps }) });
-});
-TabContent.displayName = "TabContent";
-const InnerTabContent = react.forwardRef((props, ref) => {
-  const [tabContentProps, divProps] = createSplitProps.createSplitProps()(props, ["value"]);
+  const [contentProps, localProps] = createSplitProps.createSplitProps()(props, ["value"]);
   const api = tabsContext.useTabsContext();
-  const mergedProps = react$1.mergeProps(api.getContentProps(tabContentProps), divProps);
-  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+  const presenceProps = presencePropsContext.usePresencePropsContext();
+  const presenceApi = usePresence.usePresence({ ...presenceProps, present: api.value === props.value });
+  const mergedProps = react$1.mergeProps(
+    api.getContentProps(contentProps),
+    presenceApi.getPresenceProps(ref),
+    localProps
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(presenceContext.PresenceProvider, { value: presenceApi, children: presenceApi.isUnmounted ? null : /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps }) });
 });
-InnerTabContent.displayName = "InnerTabContent";
+TabContent.displayName = "TabContent";
 
 exports.TabContent = TabContent;

package/tabs/tab-content.d.ts

@@ -2,9 +2,7 @@ import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
 import { type ContentProps } from '@zag-js/tabs';
 import { type HTMLArkProps } from '../factory';
-import { type TabPresenceProps } from './tab-presence';
-export interface TabContentProps extends InnerTabContentProps, Omit<TabPresenceProps, 'children' | 'fallback'> {
+import type { Assign } from '../types';
+export interface TabContentProps extends Assign<HTMLArkProps<'div'>, ContentProps> {
 }
 export declare const TabContent: ForwardRefExoticComponent<TabContentProps & RefAttributes<HTMLDivElement>>;
-type InnerTabContentProps = HTMLArkProps<'div'> & ContentProps;
-export {};

package/tabs/tab-content.mjs

@@ -6,22 +6,23 @@ import { forwardRef } from 'react';
 import { createSplitProps } from '../create-split-props.mjs';
 import { ark } from '../factory.mjs';
 import '../presence/index.mjs';
-import { TabPresence } from './tab-presence.mjs';
 import { useTabsContext } from './tabs-context.mjs';
-import { splitPresenceProps } from '../presence/split-presence-props.mjs';
+import { usePresencePropsContext } from '../presence/presence-props-context.mjs';
+import { usePresence } from '../presence/use-presence.mjs';
+import { PresenceProvider } from '../presence/presence-context.mjs';
 
 const TabContent = forwardRef((props, ref) => {
-  const [presenceProps, tabContentProps] = splitPresenceProps(props);
-  const [contentProps, localProps] = createSplitProps()(tabContentProps, ["value"]);
-  return /* @__PURE__ */ jsx(TabPresence, { ...presenceProps, ...contentProps, children: /* @__PURE__ */ jsx(InnerTabContent, { ref, ...contentProps, ...localProps }) });
-});
-TabContent.displayName = "TabContent";
-const InnerTabContent = forwardRef((props, ref) => {
-  const [tabContentProps, divProps] = createSplitProps()(props, ["value"]);
+  const [contentProps, localProps] = createSplitProps()(props, ["value"]);
   const api = useTabsContext();
-  const mergedProps = mergeProps(api.getContentProps(tabContentProps), divProps);
-  return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
+  const presenceProps = usePresencePropsContext();
+  const presenceApi = usePresence({ ...presenceProps, present: api.value === props.value });
+  const mergedProps = mergeProps(
+    api.getContentProps(contentProps),
+    presenceApi.getPresenceProps(ref),
+    localProps
+  );
+  return /* @__PURE__ */ jsx(PresenceProvider, { value: presenceApi, children: presenceApi.isUnmounted ? null : /* @__PURE__ */ jsx(ark.div, { ...mergedProps }) });
 });
-InnerTabContent.displayName = "InnerTabContent";
+TabContent.displayName = "TabContent";
 
 export { TabContent };

package/tabs/tabs.cjs

@@ -8,11 +8,15 @@ const react$1 = require('@zag-js/react');
 const react = require('react');
 const createSplitProps = require('../create-split-props.cjs');
 const factory = require('../factory.cjs');
+require('../presence/index.cjs');
 const tabsContext = require('./tabs-context.cjs');
 const useTabs = require('./use-tabs.cjs');
+const splitPresenceProps = require('../presence/split-presence-props.cjs');
+const presencePropsContext = require('../presence/presence-props-context.cjs');
 
 const Tabs = react.forwardRef((props, ref) => {
-  const [useTabsProps, divProps] = createSplitProps.createSplitProps()(props, [
+  const [presenceProps, tabsProps] = splitPresenceProps.splitPresenceProps(props);
+  const [useTabsProps, localprops] = createSplitProps.createSplitProps()(tabsProps, [
     "activationMode",
     "defaultValue",
     "dir",
@@ -27,8 +31,8 @@ const Tabs = react.forwardRef((props, ref) => {
     "value"
   ]);
   const api = useTabs.useTabs(useTabsProps);
-  const mergedProps = react$1.mergeProps(api.rootProps, divProps);
-  return /* @__PURE__ */ jsxRuntime.jsx(tabsContext.TabsProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
+  const mergedProps = react$1.mergeProps(api.rootProps, localprops);
+  return /* @__PURE__ */ jsxRuntime.jsx(tabsContext.TabsProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(presencePropsContext.PresencePropsProvider, { value: presenceProps, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) }) });
 });
 Tabs.displayName = "Tabs";
 

package/tabs/tabs.d.ts

@@ -1,8 +1,9 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
 import { type HTMLArkProps } from '../factory';
+import { type UsePresenceProps } from '../presence';
 import { type Assign } from '../types';
 import { type UseTabsProps } from './use-tabs';
-export interface TabsProps extends Assign<HTMLArkProps<'div'>, UseTabsProps> {
+export interface TabsProps extends Assign<HTMLArkProps<'div'>, UseTabsProps>, UsePresenceProps {
 }
 export declare const Tabs: ForwardRefExoticComponent<TabsProps & RefAttributes<HTMLDivElement>>;

package/tabs/tabs.mjs

@@ -4,11 +4,15 @@ import { mergeProps } from '@zag-js/react';
 import { forwardRef } from 'react';
 import { createSplitProps } from '../create-split-props.mjs';
 import { ark } from '../factory.mjs';
+import '../presence/index.mjs';
 import { TabsProvider } from './tabs-context.mjs';
 import { useTabs } from './use-tabs.mjs';
+import { splitPresenceProps } from '../presence/split-presence-props.mjs';
+import { PresencePropsProvider } from '../presence/presence-props-context.mjs';
 
 const Tabs = forwardRef((props, ref) => {
-  const [useTabsProps, divProps] = createSplitProps()(props, [
+  const [presenceProps, tabsProps] = splitPresenceProps(props);
+  const [useTabsProps, localprops] = createSplitProps()(tabsProps, [
     "activationMode",
     "defaultValue",
     "dir",
@@ -23,8 +27,8 @@ const Tabs = forwardRef((props, ref) => {
     "value"
   ]);
   const api = useTabs(useTabsProps);
-  const mergedProps = mergeProps(api.rootProps, divProps);
-  return /* @__PURE__ */ jsx(TabsProvider, { value: api, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
+  const mergedProps = mergeProps(api.rootProps, localprops);
+  return /* @__PURE__ */ jsx(TabsProvider, { value: api, children: /* @__PURE__ */ jsx(PresencePropsProvider, { value: presenceProps, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) }) });
 });
 Tabs.displayName = "Tabs";
 

package/tags-input/tags-input-item.d.ts

@@ -1,10 +1,9 @@
-import { ForwardRefExoticComponent, RefAttributes } from 'react';
-/// <reference types="react" />
 import type { ItemProps, ItemState } from '@zag-js/tags-input';
+import { ForwardRefExoticComponent, RefAttributes, type ReactNode } from 'react';
 import { type HTMLArkProps } from '../factory';
 import { type Assign } from '../types';
-export interface TagsInputItemProps extends ItemProps, Assign<HTMLArkProps<'div'>, {
-    children?: React.ReactNode | ((props: ItemState) => React.ReactNode);
-}> {
+export interface TagsInputItemProps extends Assign<HTMLArkProps<'div'>, {
+    children?: ReactNode | ((state: ItemState) => ReactNode);
+}>, ItemProps {
 }
 export declare const TagsInputItem: ForwardRefExoticComponent<TagsInputItemProps & RefAttributes<HTMLDivElement>>;

package/tags-input/tags-input.d.ts

@@ -2,8 +2,8 @@ import { ForwardRefExoticComponent, RefAttributes, type ReactNode } from 'react'
 import { type HTMLArkProps } from '../factory';
 import { type Assign } from '../types';
 import { type UseTagsInputProps, type UseTagsInputReturn } from './use-tags-input';
-export interface TagsInputProps extends Assign<Assign<HTMLArkProps<'input'>, UseTagsInputProps>, {
-    children?: ReactNode | ((pages: UseTagsInputReturn) => ReactNode);
-}> {
+export interface TagsInputProps extends Assign<Assign<HTMLArkProps<'div'>, {
+    children?: ReactNode | ((api: UseTagsInputReturn) => ReactNode);
+}>, UseTagsInputProps> {
 }
 export declare const TagsInput: ForwardRefExoticComponent<TagsInputProps & RefAttributes<HTMLInputElement>>;

package/toast/toast.stories.d.ts

@@ -1,6 +1,8 @@
 import { JSX } from 'react/jsx-runtime';
 import type { Meta } from '@storybook/react';
-declare const meta: Meta;
+import { Toast } from './';
+type ToastType = typeof Toast;
+declare const meta: Meta<ToastType>;
 export default meta;
 export declare const Basic: () => JSX.Element;
 export declare const Customized: () => JSX.Element;

package/tooltip/tooltip-content.cjs

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

package/tooltip/tooltip-content.d.ts

@@ -1,8 +1,6 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
 import { type HTMLArkProps } from '../factory';
-import { type PresenceProps } from '../presence';
-import type { Assign } from '../types';
-export interface TooltipContentProps extends Assign<HTMLArkProps<'div'>, Omit<PresenceProps, 'children' | 'fallback'>> {
+export interface TooltipContentProps extends HTMLArkProps<'div'> {
 }
 export declare const TooltipContent: ForwardRefExoticComponent<TooltipContentProps & RefAttributes<HTMLDivElement>>;

package/tooltip/tooltip-content.mjs

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

package/tooltip/tooltip-positioner.cjs

@@ -7,12 +7,18 @@ 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 tooltipContext = require('./tooltip-context.cjs');
+const presenceContext = require('../presence/presence-context.cjs');
 
 const TooltipPositioner = react.forwardRef(
   (props, ref) => {
     const api = tooltipContext.useTooltipContext();
     const mergedProps = react$1.mergeProps(api.positionerProps, props);
+    const presenceApi = presenceContext.usePresenceContext();
+    if (presenceApi.isUnmounted) {
+      return null;
+    }
     return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
   }
 );

package/tooltip/tooltip-positioner.mjs

@@ -3,12 +3,18 @@ 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 { useTooltipContext } from './tooltip-context.mjs';
+import { usePresenceContext } from '../presence/presence-context.mjs';
 
 const TooltipPositioner = forwardRef(
   (props, ref) => {
     const api = useTooltipContext();
     const mergedProps = mergeProps(api.positionerProps, props);
+    const presenceApi = usePresenceContext();
+    if (presenceApi.isUnmounted) {
+      return null;
+    }
     return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
   }
 );

package/tooltip/tooltip.cjs

@@ -5,15 +5,20 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
 require('react');
+require('../presence/index.cjs');
+const splitPresenceProps = require('../presence/split-presence-props.cjs');
 const runIfFn = require('../run-if-fn.cjs');
 const tooltipContext = require('./tooltip-context.cjs');
 const useTooltip = require('./use-tooltip.cjs');
+const usePresence = require('../presence/use-presence.cjs');
+const presenceContext = require('../presence/presence-context.cjs');
 
 const Tooltip = (props) => {
-  const { children, ...useTooltipProps } = props;
-  const api = useTooltip.useTooltip(useTooltipProps);
+  const [presenceProps, { children, ...localProps }] = splitPresenceProps.splitPresenceProps(props);
+  const api = useTooltip.useTooltip(localProps);
+  const presenceApi = usePresence.usePresence({ ...presenceProps, present: api.isOpen });
   const view = runIfFn.runIfFn(children, api);
-  return /* @__PURE__ */ jsxRuntime.jsx(tooltipContext.TooltipProvider, { value: api, children: view });
+  return /* @__PURE__ */ jsxRuntime.jsx(tooltipContext.TooltipProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(presenceContext.PresenceProvider, { value: presenceApi, children: view }) });
 };
 
 exports.Tooltip = Tooltip;

package/tooltip/tooltip.d.ts

@@ -1,8 +1,8 @@
 import { JSX } from 'react/jsx-runtime';
 import { type ReactNode } from 'react';
-import { type TooltipContext } from './tooltip-context';
-import { type UseTooltipProps } from './use-tooltip';
-export interface TooltipProps extends UseTooltipProps {
-    children?: ReactNode | ((props: TooltipContext) => ReactNode);
+import type { UsePresenceProps } from '../presence';
+import { type UseTooltipProps, type UseTooltipReturn } from './use-tooltip';
+export interface TooltipProps extends UseTooltipProps, UsePresenceProps {
+    children?: ReactNode | ((api: UseTooltipReturn) => ReactNode);
 }
 export declare const Tooltip: (props: TooltipProps) => JSX.Element;

package/tooltip/tooltip.mjs

@@ -1,15 +1,20 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
 import 'react';
+import '../presence/index.mjs';
+import { splitPresenceProps } from '../presence/split-presence-props.mjs';
 import { runIfFn } from '../run-if-fn.mjs';
 import { TooltipProvider } from './tooltip-context.mjs';
 import { useTooltip } from './use-tooltip.mjs';
+import { usePresence } from '../presence/use-presence.mjs';
+import { PresenceProvider } from '../presence/presence-context.mjs';
 
 const Tooltip = (props) => {
-  const { children, ...useTooltipProps } = props;
-  const api = useTooltip(useTooltipProps);
+  const [presenceProps, { children, ...localProps }] = splitPresenceProps(props);
+  const api = useTooltip(localProps);
+  const presenceApi = usePresence({ ...presenceProps, present: api.isOpen });
   const view = runIfFn(children, api);
-  return /* @__PURE__ */ jsx(TooltipProvider, { value: api, children: view });
+  return /* @__PURE__ */ jsx(TooltipProvider, { value: api, children: /* @__PURE__ */ jsx(PresenceProvider, { value: presenceApi, children: view }) });
 };
 
 export { Tooltip };

package/types.d.ts

@@ -1,5 +1,3 @@
-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 Assign<T, U> = Omit<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

@@ -4,11 +4,10 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const react = require('react');
-const useLatestRef = require('./use-latest-ref.cjs');
 
 function useEvent(callback, opts = {}) {
   const { sync = false } = opts;
-  const callbackRef = useLatestRef.useLatestRef(callback);
+  const callbackRef = useLatestRef(callback);
   return react.useCallback(
     (...args) => {
       if (sync)
@@ -18,5 +17,10 @@ function useEvent(callback, opts = {}) {
     [sync, callbackRef]
   );
 }
+function useLatestRef(value) {
+  const ref = react.useRef(value);
+  ref.current = value;
+  return ref;
+}
 
 exports.useEvent = useEvent;

package/use-event.mjs

@@ -1,6 +1,5 @@
 'use client';
-import { useCallback } from 'react';
-import { useLatestRef } from './use-latest-ref.mjs';
+import { useCallback, useRef } from 'react';
 
 function useEvent(callback, opts = {}) {
   const { sync = false } = opts;
@@ -14,5 +13,10 @@ function useEvent(callback, opts = {}) {
     [sync, callbackRef]
   );
 }
+function useLatestRef(value) {
+  const ref = useRef(value);
+  ref.current = value;
+  return ref;
+}
 
 export { useEvent };

package/tabs/tab-presence.cjs

@@ -1,17 +0,0 @@
-'use client';
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const jsxRuntime = require('react/jsx-runtime');
-require('@zag-js/tabs');
-const index = require('../presence/index.cjs');
-const tabsContext = require('./tabs-context.cjs');
-
-const TabPresence = (props) => {
-  const { present, ...rest } = props;
-  const api = tabsContext.useTabsContext();
-  return /* @__PURE__ */ jsxRuntime.jsx(index.Presence, { present: present !== void 0 ? present : api.value === props.value, ...rest });
-};
-
-exports.TabPresence = TabPresence;

package/tabs/tab-presence.d.ts

@@ -1,6 +0,0 @@
-import { JSX } from 'react/jsx-runtime';
-import { type ContentProps } from '@zag-js/tabs';
-import { type PresenceProps } from '../presence';
-export interface TabPresenceProps extends PresenceProps, ContentProps {
-}
-export declare const TabPresence: (props: TabPresenceProps) => JSX.Element;

package/tabs/tab-presence.mjs

@@ -1,13 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import '@zag-js/tabs';
-import { Presence } from '../presence/index.mjs';
-import { useTabsContext } from './tabs-context.mjs';
-
-const TabPresence = (props) => {
-  const { present, ...rest } = props;
-  const api = useTabsContext();
-  return /* @__PURE__ */ jsx(Presence, { present: present !== void 0 ? present : api.value === props.value, ...rest });
-};
-
-export { TabPresence };

package/use-latest-ref.cjs

@@ -1,14 +0,0 @@
-'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.d.ts

@@ -1,3 +0,0 @@
-import { MutableRefObject } from 'react';
-/// <reference types="react" />
-export declare function useLatestRef<T>(value: T): MutableRefObject<T>;

package/use-latest-ref.mjs

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