@ark-ui/react 1.0.0-beta.3 → 1.0.0-beta.5

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/slider/slider-output.d.ts

@@ -1,9 +0,0 @@
-import { ForwardRefExoticComponent, RefAttributes, type ReactNode } from 'react';
-import { type HTMLArkProps } from '../factory';
-import { type Assign } from '../types';
-import { type UseSliderReturn } from './use-slider';
-export interface SliderOutputProps extends Assign<HTMLArkProps<'output'>, {
-    children?: ((api: UseSliderReturn) => ReactNode) | ReactNode;
-}> {
-}
-export declare const SliderOutput: ForwardRefExoticComponent<SliderOutputProps & RefAttributes<HTMLOutputElement>>;

package/slider/slider-output.mjs

@@ -1,18 +0,0 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { mergeProps } from '@zag-js/react';
-import { forwardRef } from 'react';
-import { ark } from '../factory.mjs';
-import { runIfFn } from '../run-if-fn.mjs';
-import { useSliderContext } from './slider-context.mjs';
-
-const SliderOutput = forwardRef((props, ref) => {
-  const { children, ...rest } = props;
-  const api = useSliderContext();
-  const mergedProps = mergeProps(api.outputProps, rest);
-  const view = runIfFn(children, api);
-  return /* @__PURE__ */ jsx(ark.output, { ...mergedProps, ref, children: view });
-});
-SliderOutput.displayName = "SliderOutput";
-
-export { SliderOutput };

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 };