@ark-ui/react 1.3.0 → 2.0.0

package/toast/index.cjs

@@ -4,23 +4,24 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const createToaster = require('./create-toaster.cjs');
-const toast = require('./toast.cjs');
 const toastCloseTrigger = require('./toast-close-trigger.cjs');
 const toastDescription = require('./toast-description.cjs');
 const toastGroup = require('./toast-group.cjs');
+const toastRoot = require('./toast-root.cjs');
 const toastTitle = require('./toast-title.cjs');
 
-const Toast = Object.assign(toast.Toast, {
-  Root: toast.Toast,
+const Toast = {
+  Root: toastRoot.ToastRoot,
   CloseTrigger: toastCloseTrigger.ToastCloseTrigger,
   Description: toastDescription.ToastDescription,
   Group: toastGroup.ToastGroup,
   Title: toastTitle.ToastTitle
-});
+};
 
 exports.createToaster = createToaster.createToaster;
 exports.ToastCloseTrigger = toastCloseTrigger.ToastCloseTrigger;
 exports.ToastDescription = toastDescription.ToastDescription;
 exports.ToastGroup = toastGroup.ToastGroup;
+exports.ToastRoot = toastRoot.ToastRoot;
 exports.ToastTitle = toastTitle.ToastTitle;
 exports.Toast = Toast;

package/toast/index.d.ts

@@ -1,17 +1,17 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
 import { createToaster, type CreateToasterProps, type CreateToasterReturn } from './create-toaster';
-import { type ToastProps } from './toast';
 import { ToastCloseTrigger, type ToastCloseTriggerProps } from './toast-close-trigger';
 import { ToastDescription, type ToastDescriptionProps } from './toast-description';
 import { ToastGroup, type ToastGroupProps } from './toast-group';
+import { ToastRoot, type ToastRootProps } from './toast-root';
 import { ToastTitle, type ToastTitleProps } from './toast-title';
-declare const Toast: ForwardRefExoticComponent<ToastProps & RefAttributes<HTMLLIElement>> & {
-    Root: ForwardRefExoticComponent<ToastProps & RefAttributes<HTMLLIElement>>;
+export declare const Toast: {
+    Root: ForwardRefExoticComponent<ToastRootProps & RefAttributes<HTMLLIElement>>;
     CloseTrigger: ForwardRefExoticComponent<ToastCloseTriggerProps & RefAttributes<HTMLButtonElement>>;
     Description: ForwardRefExoticComponent<ToastDescriptionProps & RefAttributes<HTMLDivElement>>;
     Group: ForwardRefExoticComponent<ToastGroupProps & RefAttributes<HTMLOListElement>>;
     Title: ForwardRefExoticComponent<ToastTitleProps & RefAttributes<HTMLDivElement>>;
 };
-export { createToaster, Toast, ToastCloseTrigger, ToastDescription, ToastGroup, ToastTitle };
-export type { CreateToasterProps, CreateToasterReturn, ToastCloseTriggerProps, ToastDescriptionProps, ToastGroupProps, ToastProps, ToastTitleProps, };
+export { createToaster, ToastCloseTrigger, ToastDescription, ToastGroup, ToastRoot, ToastTitle };
+export type { CreateToasterProps, CreateToasterReturn, ToastCloseTriggerProps, ToastDescriptionProps, ToastGroupProps, ToastRootProps, ToastTitleProps, };

package/toast/index.mjs

@@ -1,17 +1,17 @@
 'use client';
 export { createToaster } from './create-toaster.mjs';
-import { Toast as Toast$1 } from './toast.mjs';
 import { ToastCloseTrigger } from './toast-close-trigger.mjs';
 import { ToastDescription } from './toast-description.mjs';
 import { ToastGroup } from './toast-group.mjs';
+import { ToastRoot } from './toast-root.mjs';
 import { ToastTitle } from './toast-title.mjs';
 
-const Toast = Object.assign(Toast$1, {
-  Root: Toast$1,
+const Toast = {
+  Root: ToastRoot,
   CloseTrigger: ToastCloseTrigger,
   Description: ToastDescription,
   Group: ToastGroup,
   Title: ToastTitle
-});
+};
 
-export { Toast, ToastCloseTrigger, ToastDescription, ToastGroup, ToastTitle };
+export { Toast, ToastCloseTrigger, ToastDescription, ToastGroup, ToastRoot, ToastTitle };

package/toast/stories/toast.stories.d.ts

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

package/toast/{toast.cjs → toast-root.cjs}

@@ -9,11 +9,11 @@ const react = require('react');
 const factory = require('../factory.cjs');
 const toastContext = require('./toast-context.cjs');
 
-const Toast = react.forwardRef((props, ref) => {
+const ToastRoot = react.forwardRef((props, ref) => {
   const api = toastContext.useToastContext();
   const mergedProps = react$1.mergeProps(api.rootProps, props);
   return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.li, { ...mergedProps, ref });
 });
-Toast.displayName = "Toast";
+ToastRoot.displayName = "ToastRoot";
 
-exports.Toast = Toast;
+exports.ToastRoot = ToastRoot;

package/toast/toast-root.d.ts

@@ -0,0 +1,6 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+export interface ToastRootProps extends HTMLArkProps<'li'> {
+}
+export declare const ToastRoot: ForwardRefExoticComponent<ToastRootProps & RefAttributes<HTMLLIElement>>;

package/toast/{toast.mjs → toast-root.mjs}

@@ -5,11 +5,11 @@ import { forwardRef } from 'react';
 import { ark } from '../factory.mjs';
 import { useToastContext } from './toast-context.mjs';
 
-const Toast = forwardRef((props, ref) => {
+const ToastRoot = forwardRef((props, ref) => {
   const api = useToastContext();
   const mergedProps = mergeProps(api.rootProps, props);
   return /* @__PURE__ */ jsx(ark.li, { ...mergedProps, ref });
 });
-Toast.displayName = "Toast";
+ToastRoot.displayName = "ToastRoot";
 
-export { Toast };
+export { ToastRoot };

package/toggle-group/index.cjs

@@ -3,15 +3,16 @@
 
 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 toggleGroupRoot = require('./toggle-group-root.cjs');
 
-const ToggleGroup = Object.assign(toggleGroup.ToggleGroup, {
-  Root: toggleGroup.ToggleGroup,
+const ToggleGroup = {
+  Root: toggleGroupRoot.ToggleGroupRoot,
   Item: toggleGroupItem.ToggleGroupItem
-});
+};
 
 exports.useToggleGroupContext = toggleGroupContext.useToggleGroupContext;
 exports.ToggleGroupItem = toggleGroupItem.ToggleGroupItem;
+exports.ToggleGroupRoot = toggleGroupRoot.ToggleGroupRoot;
 exports.ToggleGroup = ToggleGroup;

package/toggle-group/index.d.ts

@@ -1,12 +1,12 @@
 import { ForwardRefExoticComponent, RefAttributes } from 'react';
 /// <reference types="react" />
 import type { ValueChangeDetails as ToggleGroupValueChangeDetails } from '@zag-js/toggle-group';
-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: ForwardRefExoticComponent<ToggleGroupProps & RefAttributes<HTMLDivElement>> & {
-    Root: ForwardRefExoticComponent<ToggleGroupProps & RefAttributes<HTMLDivElement>>;
+import { ToggleGroupRoot, type ToggleGroupRootProps } from './toggle-group-root';
+export declare const ToggleGroup: {
+    Root: ForwardRefExoticComponent<ToggleGroupRootProps & RefAttributes<HTMLDivElement>>;
     Item: ForwardRefExoticComponent<ToggleGroupItemProps & RefAttributes<HTMLButtonElement>>;
 };
-export { ToggleGroup, ToggleGroupItem, useToggleGroupContext };
-export type { ToggleGroupContext, ToggleGroupItemProps, ToggleGroupProps, ToggleGroupValueChangeDetails, };
+export { ToggleGroupItem, ToggleGroupRoot, useToggleGroupContext };
+export type { ToggleGroupContext, ToggleGroupItemProps, ToggleGroupRootProps, ToggleGroupValueChangeDetails, };

package/toggle-group/index.mjs

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

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

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

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

@@ -0,0 +1,3 @@
+import { JSX } from 'react/jsx-runtime';
+import { type ToggleGroupRootProps } from '../';
+export declare const ComponentUnderTest: (props: ToggleGroupRootProps) => JSX.Element;

package/toggle-group/{toggle-group.cjs → toggle-group-root.cjs}

@@ -11,7 +11,7 @@ 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 ToggleGroupRoot = react.forwardRef((props, ref) => {
   const [toggleGroup, localProps] = createSplitProps.createSplitProps()(props, [
     "defaultValue",
     "dir",
@@ -30,6 +30,6 @@ const ToggleGroup = react.forwardRef((props, ref) => {
   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";
+ToggleGroupRoot.displayName = "ToggleGroupRoot";
 
-exports.ToggleGroup = ToggleGroup;
+exports.ToggleGroupRoot = ToggleGroupRoot;

package/toggle-group/{toggle-group.d.ts → toggle-group-root.d.ts}

@@ -3,6 +3,6 @@ import { ForwardRefExoticComponent, RefAttributes } from 'react';
 import { type HTMLArkProps } from '../factory';
 import { type Assign } from '../types';
 import { type UseToggleGroupProps } from './use-toggle-group';
-export interface ToggleGroupProps extends Assign<HTMLArkProps<'div'>, UseToggleGroupProps> {
+export interface ToggleGroupRootProps extends Assign<HTMLArkProps<'div'>, UseToggleGroupProps> {
 }
-export declare const ToggleGroup: ForwardRefExoticComponent<ToggleGroupProps & RefAttributes<HTMLDivElement>>;
+export declare const ToggleGroupRoot: ForwardRefExoticComponent<ToggleGroupRootProps & RefAttributes<HTMLDivElement>>;

package/toggle-group/{toggle-group.mjs → toggle-group-root.mjs}

@@ -7,7 +7,7 @@ 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 ToggleGroupRoot = forwardRef((props, ref) => {
   const [toggleGroup, localProps] = createSplitProps()(props, [
     "defaultValue",
     "dir",
@@ -26,6 +26,6 @@ const ToggleGroup = forwardRef((props, ref) => {
   const mergedProps = mergeProps(api.rootProps, localProps);
   return /* @__PURE__ */ jsx(ToggleGroupProvider, { value: api, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
 });
-ToggleGroup.displayName = "ToggleGroup";
+ToggleGroupRoot.displayName = "ToggleGroupRoot";
 
-export { ToggleGroup };
+export { ToggleGroupRoot };

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

@@ -6,9 +6,8 @@ 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 useEvent = require('../use-event.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
+const useEvent = require('../use-event.cjs');
 
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });

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

@@ -2,9 +2,8 @@
 import { useMachine, normalizeProps } from '@zag-js/react';
 import * as toggleGroup from '@zag-js/toggle-group';
 import { useId } from 'react';
-import '../environment/index.mjs';
-import { useEvent } from '../use-event.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
+import { useEvent } from '../use-event.mjs';
 
 const useToggleGroup = (props) => {
   const initialContext = {

package/tooltip/index.cjs

@@ -3,27 +3,28 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-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 tooltipRoot = require('./tooltip-root.cjs');
 const tooltipTrigger = require('./tooltip-trigger.cjs');
 
-const Tooltip = Object.assign(tooltip.Tooltip, {
-  Root: tooltip.Tooltip,
+const Tooltip = {
+  Root: tooltipRoot.TooltipRoot,
   Arrow: tooltipArrow.TooltipArrow,
   ArrowTip: tooltipArrowTip.TooltipArrowTip,
   Content: tooltipContent.TooltipContent,
   Positioner: tooltipPositioner.TooltipPositioner,
   Trigger: tooltipTrigger.TooltipTrigger
-});
+};
 
 exports.TooltipArrow = tooltipArrow.TooltipArrow;
 exports.TooltipArrowTip = tooltipArrowTip.TooltipArrowTip;
 exports.TooltipContent = tooltipContent.TooltipContent;
 exports.useTooltipContext = tooltipContext.useTooltipContext;
 exports.TooltipPositioner = tooltipPositioner.TooltipPositioner;
+exports.TooltipRoot = tooltipRoot.TooltipRoot;
 exports.TooltipTrigger = tooltipTrigger.TooltipTrigger;
 exports.Tooltip = Tooltip;

package/tooltip/index.d.ts

@@ -2,20 +2,20 @@ import { ForwardRefExoticComponent, RefAttributes } from 'react';
 import { JSX } from 'react/jsx-runtime';
 /// <reference types="react" />
 import type { OpenChangeDetails as TooltipOpenChangeDetails } from '@zag-js/tooltip';
-import { type TooltipProps } from './tooltip';
 import { TooltipArrow, type TooltipArrowProps } from './tooltip-arrow';
 import { TooltipArrowTip, type TooltipArrowTipProps } from './tooltip-arrow-tip';
 import { TooltipContent, type TooltipContentProps } from './tooltip-content';
 import { useTooltipContext, type TooltipContext } from './tooltip-context';
 import { TooltipPositioner, type TooltipPositionerProps } from './tooltip-positioner';
+import { TooltipRoot, type TooltipRootProps } from './tooltip-root';
 import { TooltipTrigger, type TooltipTriggerProps } from './tooltip-trigger';
-declare const Tooltip: ((props: TooltipProps) => JSX.Element) & {
-    Root: (props: TooltipProps) => JSX.Element;
+export declare const Tooltip: {
+    Root: (props: TooltipRootProps) => JSX.Element;
     Arrow: ForwardRefExoticComponent<TooltipArrowProps & RefAttributes<HTMLDivElement>>;
     ArrowTip: ForwardRefExoticComponent<TooltipArrowTipProps & RefAttributes<HTMLDivElement>>;
     Content: ForwardRefExoticComponent<TooltipContentProps & RefAttributes<HTMLDivElement>>;
     Positioner: ForwardRefExoticComponent<TooltipPositionerProps & RefAttributes<HTMLDivElement>>;
     Trigger: ForwardRefExoticComponent<TooltipTriggerProps & RefAttributes<HTMLButtonElement>>;
 };
-export { Tooltip, TooltipArrow, TooltipArrowTip, TooltipContent, TooltipPositioner, TooltipTrigger, useTooltipContext };
-export type { TooltipArrowProps, TooltipArrowTipProps, TooltipContentProps, TooltipContext, TooltipOpenChangeDetails, TooltipPositionerProps, TooltipProps, TooltipTriggerProps };
+export { TooltipArrow, TooltipArrowTip, TooltipContent, TooltipPositioner, TooltipRoot, TooltipTrigger, useTooltipContext, };
+export type { TooltipArrowProps, TooltipArrowTipProps, TooltipContentProps, TooltipContext, TooltipOpenChangeDetails, TooltipPositionerProps, TooltipRootProps, TooltipTriggerProps, };

package/tooltip/index.mjs

@@ -1,19 +1,19 @@
 'use client';
-import { Tooltip as Tooltip$1 } from './tooltip.mjs';
 import { TooltipArrow } from './tooltip-arrow.mjs';
 import { TooltipArrowTip } from './tooltip-arrow-tip.mjs';
 import { TooltipContent } from './tooltip-content.mjs';
 export { useTooltipContext } from './tooltip-context.mjs';
 import { TooltipPositioner } from './tooltip-positioner.mjs';
+import { TooltipRoot } from './tooltip-root.mjs';
 import { TooltipTrigger } from './tooltip-trigger.mjs';
 
-const Tooltip = Object.assign(Tooltip$1, {
-  Root: Tooltip$1,
+const Tooltip = {
+  Root: TooltipRoot,
   Arrow: TooltipArrow,
   ArrowTip: TooltipArrowTip,
   Content: TooltipContent,
   Positioner: TooltipPositioner,
   Trigger: TooltipTrigger
-});
+};
 
-export { Tooltip, TooltipArrow, TooltipArrowTip, TooltipContent, TooltipPositioner, TooltipTrigger };
+export { Tooltip, TooltipArrow, TooltipArrowTip, TooltipContent, TooltipPositioner, TooltipRoot, TooltipTrigger };

package/tooltip/stories/tooltip.stories.d.ts

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

package/tooltip/tests/basic.d.ts

@@ -0,0 +1,3 @@
+import { JSX } from 'react/jsx-runtime';
+import { type TooltipRootProps } from '../';
+export declare const ComponentUnderTest: (props: TooltipRootProps) => JSX.Element;

package/tooltip/tests/tooltip.test.d.ts

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

package/tooltip/tooltip-content.cjs

@@ -7,9 +7,8 @@ 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 tooltipContext = require('./tooltip-context.cjs');
 
 const TooltipContent = react.forwardRef((props, ref) => {
   const api = tooltipContext.useTooltipContext();

package/tooltip/tooltip-content.mjs

@@ -3,9 +3,8 @@ 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';
+import { useTooltipContext } from './tooltip-context.mjs';
 
 const TooltipContent = forwardRef((props, ref) => {
   const api = useTooltipContext();

package/tooltip/tooltip-positioner.cjs

@@ -7,9 +7,8 @@ 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 tooltipContext = require('./tooltip-context.cjs');
 
 const TooltipPositioner = react.forwardRef(
   (props, ref) => {

package/tooltip/tooltip-positioner.mjs

@@ -3,9 +3,8 @@ 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';
+import { useTooltipContext } from './tooltip-context.mjs';
 
 const TooltipPositioner = forwardRef(
   (props, ref) => {

package/tooltip/{tooltip.cjs → tooltip-root.cjs}

@@ -6,15 +6,14 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const jsxRuntime = require('react/jsx-runtime');
 const react = require('@zag-js/react');
 require('react');
-require('../presence/index.cjs');
+const presenceContext = require('../presence/presence-context.cjs');
 const splitPresenceProps = require('../presence/split-presence-props.cjs');
+const usePresence = require('../presence/use-presence.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 TooltipRoot = (props) => {
   const [presenceProps, { children, ...localProps }] = splitPresenceProps.splitPresenceProps(props);
   const api = useTooltip.useTooltip(localProps);
   const presenceApi = usePresence.usePresence(react.mergeProps({ present: api.isOpen }, presenceProps));
@@ -22,4 +21,4 @@ const Tooltip = (props) => {
   return /* @__PURE__ */ jsxRuntime.jsx(tooltipContext.TooltipProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(presenceContext.PresenceProvider, { value: presenceApi, children: view }) });
 };
 
-exports.Tooltip = Tooltip;
+exports.TooltipRoot = TooltipRoot;

package/tooltip/{tooltip.d.ts → tooltip-root.d.ts}

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

package/tooltip/{tooltip.mjs → tooltip-root.mjs}

@@ -2,15 +2,14 @@
 import { jsx } from 'react/jsx-runtime';
 import { mergeProps } from '@zag-js/react';
 import 'react';
-import '../presence/index.mjs';
+import { PresenceProvider } from '../presence/presence-context.mjs';
 import { splitPresenceProps } from '../presence/split-presence-props.mjs';
+import { usePresence } from '../presence/use-presence.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 TooltipRoot = (props) => {
   const [presenceProps, { children, ...localProps }] = splitPresenceProps(props);
   const api = useTooltip(localProps);
   const presenceApi = usePresence(mergeProps({ present: api.isOpen }, presenceProps));
@@ -18,4 +17,4 @@ const Tooltip = (props) => {
   return /* @__PURE__ */ jsx(TooltipProvider, { value: api, children: /* @__PURE__ */ jsx(PresenceProvider, { value: presenceApi, children: view }) });
 };
 
-export { Tooltip };
+export { TooltipRoot };

package/tooltip/use-tooltip.cjs

@@ -6,9 +6,8 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const react$1 = require('@zag-js/react');
 const tooltip = require('@zag-js/tooltip');
 const react = require('react');
-require('../environment/index.cjs');
-const useEvent = require('../use-event.cjs');
 const environmentContext = require('../environment/environment-context.cjs');
+const useEvent = require('../use-event.cjs');
 
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });

package/tooltip/use-tooltip.mjs

@@ -2,9 +2,8 @@
 import { useMachine, normalizeProps } from '@zag-js/react';
 import * as tooltip from '@zag-js/tooltip';
 import { useId } from 'react';
-import '../environment/index.mjs';
-import { useEvent } from '../use-event.mjs';
 import { useEnvironmentContext } from '../environment/environment-context.mjs';
+import { useEvent } from '../use-event.mjs';
 
 const useTooltip = (props) => {
   const initialContext = {

package/tree-view/index.cjs

@@ -0,0 +1,45 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const treeViewBranch = require('./tree-view-branch.cjs');
+const treeViewBranchContent = require('./tree-view-branch-content.cjs');
+const treeViewBranchControl = require('./tree-view-branch-control.cjs');
+const treeViewBranchIndicator = require('./tree-view-branch-indicator.cjs');
+const treeViewBranchText = require('./tree-view-branch-text.cjs');
+const treeViewBranchTrigger = require('./tree-view-branch-trigger.cjs');
+const treeViewContext = require('./tree-view-context.cjs');
+const treeViewItem = require('./tree-view-item.cjs');
+const treeViewItemText = require('./tree-view-item-text.cjs');
+const treeViewLabel = require('./tree-view-label.cjs');
+const treeViewRoot = require('./tree-view-root.cjs');
+const treeViewTree = require('./tree-view-tree.cjs');
+
+const TreeView = {
+  Root: treeViewRoot.TreeViewRoot,
+  Label: treeViewLabel.TreeViewLabel,
+  Tree: treeViewTree.TreeViewTree,
+  Branch: treeViewBranch.TreeViewBranch,
+  Item: treeViewItem.TreeViewItem,
+  ItemText: treeViewItemText.TreeViewItemText,
+  BranchContent: treeViewBranchContent.TreeViewBranchContent,
+  BranchControl: treeViewBranchControl.TreeViewBranchControl,
+  BranchTrigger: treeViewBranchTrigger.TreeViewBranchTrigger,
+  BranchIndicator: treeViewBranchIndicator.TreeViewBranchIndicator,
+  BranchText: treeViewBranchText.TreeViewBranchText
+};
+
+exports.TreeViewBranch = treeViewBranch.TreeViewBranch;
+exports.TreeViewBranchContent = treeViewBranchContent.TreeViewBranchContent;
+exports.TreeViewBranchControl = treeViewBranchControl.TreeViewBranchControl;
+exports.TreeViewBranchIndicator = treeViewBranchIndicator.TreeViewBranchIndicator;
+exports.TreeViewBranchText = treeViewBranchText.TreeViewBranchText;
+exports.TreeViewBranchTrigger = treeViewBranchTrigger.TreeViewBranchTrigger;
+exports.useTreeViewContext = treeViewContext.useTreeViewContext;
+exports.TreeViewItem = treeViewItem.TreeViewItem;
+exports.TreeViewItemText = treeViewItemText.TreeViewItemText;
+exports.TreeViewLabel = treeViewLabel.TreeViewLabel;
+exports.TreeViewRoot = treeViewRoot.TreeViewRoot;
+exports.TreeViewTree = treeViewTree.TreeViewTree;
+exports.TreeView = TreeView;

package/tree-view/index.d.ts

@@ -0,0 +1,30 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import type { ExpandedChangeDetails as TreeViewExpandedChangeDetails, FocusChangeDetails as TreeViewFocusChangeDetails, SelectionChangeDetails as TreeViewSelectionChangeDetails } from '@zag-js/tree-view';
+import { TreeViewBranch, type TreeViewBranchProps } from './tree-view-branch';
+import { TreeViewBranchContent, type TreeViewBranchContentProps } from './tree-view-branch-content';
+import { TreeViewBranchControl, type TreeViewBranchControlProps } from './tree-view-branch-control';
+import { TreeViewBranchIndicator, type TreeViewBranchIndicatorProps } from './tree-view-branch-indicator';
+import { TreeViewBranchText, type TreeViewBranchTextProps } from './tree-view-branch-text';
+import { TreeViewBranchTrigger, type TreeViewBranchTriggerProps } from './tree-view-branch-trigger';
+import { useTreeViewContext, type TreeViewContext } from './tree-view-context';
+import { TreeViewItem, type TreeViewItemProps } from './tree-view-item';
+import { TreeViewItemText, type TreeViewItemTextProps } from './tree-view-item-text';
+import { TreeViewLabel, type TreeViewLabelProps } from './tree-view-label';
+import { TreeViewRoot, type TreeViewRootProps } from './tree-view-root';
+import { TreeViewTree, type TreeViewTreeProps } from './tree-view-tree';
+export declare const TreeView: {
+    Root: ForwardRefExoticComponent<TreeViewRootProps & RefAttributes<HTMLDivElement>>;
+    Label: ForwardRefExoticComponent<TreeViewLabelProps & RefAttributes<HTMLLabelElement>>;
+    Tree: ForwardRefExoticComponent<TreeViewTreeProps & RefAttributes<HTMLUListElement>>;
+    Branch: ForwardRefExoticComponent<TreeViewBranchProps & RefAttributes<HTMLLIElement>>;
+    Item: ForwardRefExoticComponent<TreeViewItemProps & RefAttributes<HTMLLIElement>>;
+    ItemText: ForwardRefExoticComponent<TreeViewItemTextProps & RefAttributes<HTMLSpanElement>>;
+    BranchContent: ForwardRefExoticComponent<TreeViewBranchContentProps & RefAttributes<HTMLUListElement>>;
+    BranchControl: ForwardRefExoticComponent<TreeViewBranchControlProps & RefAttributes<HTMLDivElement>>;
+    BranchTrigger: ForwardRefExoticComponent<TreeViewBranchTriggerProps & RefAttributes<HTMLButtonElement>>;
+    BranchIndicator: ForwardRefExoticComponent<TreeViewBranchIndicatorProps & RefAttributes<HTMLDivElement>>;
+    BranchText: ForwardRefExoticComponent<TreeViewBranchTextProps & RefAttributes<HTMLSpanElement>>;
+};
+export { TreeViewBranch, TreeViewBranchContent, TreeViewBranchControl, TreeViewBranchIndicator, TreeViewBranchText, TreeViewBranchTrigger, TreeViewItem, TreeViewItemText, TreeViewLabel, TreeViewRoot, TreeViewTree, useTreeViewContext, };
+export type { TreeViewBranchContentProps, TreeViewBranchControlProps, TreeViewBranchIndicatorProps, TreeViewBranchProps, TreeViewBranchTextProps, TreeViewBranchTriggerProps, TreeViewContext, TreeViewExpandedChangeDetails, TreeViewFocusChangeDetails, TreeViewItemProps, TreeViewItemTextProps, TreeViewLabelProps, TreeViewRootProps, TreeViewSelectionChangeDetails, TreeViewTreeProps, };

package/tree-view/index.mjs

@@ -0,0 +1,29 @@
+'use client';
+import { TreeViewBranch } from './tree-view-branch.mjs';
+import { TreeViewBranchContent } from './tree-view-branch-content.mjs';
+import { TreeViewBranchControl } from './tree-view-branch-control.mjs';
+import { TreeViewBranchIndicator } from './tree-view-branch-indicator.mjs';
+import { TreeViewBranchText } from './tree-view-branch-text.mjs';
+import { TreeViewBranchTrigger } from './tree-view-branch-trigger.mjs';
+export { useTreeViewContext } from './tree-view-context.mjs';
+import { TreeViewItem } from './tree-view-item.mjs';
+import { TreeViewItemText } from './tree-view-item-text.mjs';
+import { TreeViewLabel } from './tree-view-label.mjs';
+import { TreeViewRoot } from './tree-view-root.mjs';
+import { TreeViewTree } from './tree-view-tree.mjs';
+
+const TreeView = {
+  Root: TreeViewRoot,
+  Label: TreeViewLabel,
+  Tree: TreeViewTree,
+  Branch: TreeViewBranch,
+  Item: TreeViewItem,
+  ItemText: TreeViewItemText,
+  BranchContent: TreeViewBranchContent,
+  BranchControl: TreeViewBranchControl,
+  BranchTrigger: TreeViewBranchTrigger,
+  BranchIndicator: TreeViewBranchIndicator,
+  BranchText: TreeViewBranchText
+};
+
+export { TreeView, TreeViewBranch, TreeViewBranchContent, TreeViewBranchControl, TreeViewBranchIndicator, TreeViewBranchText, TreeViewBranchTrigger, TreeViewItem, TreeViewItemText, TreeViewLabel, TreeViewRoot, TreeViewTree };