@ark-ui/react 1.3.0 → 2.0.1

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-root.cjs

@@ -0,0 +1,24 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react = require('@zag-js/react');
+require('react');
+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 TooltipRoot = (props) => {
+  const [presenceProps, { children, ...localProps }] = splitPresenceProps.splitPresenceProps(props);
+  const api = useTooltip.useTooltip(localProps);
+  const presenceApi = usePresence.usePresence(react.mergeProps({ present: api.isOpen }, presenceProps));
+  const view = runIfFn.runIfFn(children, api);
+  return /* @__PURE__ */ jsxRuntime.jsx(tooltipContext.TooltipProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(presenceContext.PresenceProvider, { value: presenceApi, children: view }) });
+};
+
+exports.TooltipRoot = TooltipRoot;

package/tooltip/tooltip-root.d.ts

@@ -0,0 +1,8 @@
+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 TooltipRootProps extends UseTooltipProps, UsePresenceProps {
+    children?: ReactNode | ((api: UseTooltipReturn) => ReactNode);
+}
+export declare const TooltipRoot: (props: TooltipRootProps) => JSX.Element;

package/tooltip/tooltip-root.mjs

@@ -0,0 +1,20 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { mergeProps } from '@zag-js/react';
+import 'react';
+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';
+
+const TooltipRoot = (props) => {
+  const [presenceProps, { children, ...localProps }] = splitPresenceProps(props);
+  const api = useTooltip(localProps);
+  const presenceApi = usePresence(mergeProps({ present: api.isOpen }, presenceProps));
+  const view = runIfFn(children, api);
+  return /* @__PURE__ */ jsx(TooltipProvider, { value: api, children: /* @__PURE__ */ jsx(PresenceProvider, { value: presenceApi, children: view }) });
+};
+
+export { TooltipRoot };

package/tooltip/tooltip.cjs

@@ -1,25 +1,19 @@
-'use client';
 'use strict';
 
 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 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 tooltipArrow = require('./tooltip-arrow.cjs');
+const tooltipArrowTip = require('./tooltip-arrow-tip.cjs');
+const tooltipContent = require('./tooltip-content.cjs');
+const tooltipPositioner = require('./tooltip-positioner.cjs');
+const tooltipRoot = require('./tooltip-root.cjs');
+const tooltipTrigger = require('./tooltip-trigger.cjs');
 
-const Tooltip = (props) => {
-  const [presenceProps, { children, ...localProps }] = splitPresenceProps.splitPresenceProps(props);
-  const api = useTooltip.useTooltip(localProps);
-  const presenceApi = usePresence.usePresence(react.mergeProps({ present: api.isOpen }, presenceProps));
-  const view = runIfFn.runIfFn(children, api);
-  return /* @__PURE__ */ jsxRuntime.jsx(tooltipContext.TooltipProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(presenceContext.PresenceProvider, { value: presenceApi, children: view }) });
-};
 
-exports.Tooltip = Tooltip;
+
+exports.Arrow = tooltipArrow.TooltipArrow;
+exports.ArrowTip = tooltipArrowTip.TooltipArrowTip;
+exports.Content = tooltipContent.TooltipContent;
+exports.Positioner = tooltipPositioner.TooltipPositioner;
+exports.Root = tooltipRoot.TooltipRoot;
+exports.Trigger = tooltipTrigger.TooltipTrigger;

package/tooltip/tooltip.d.ts

@@ -1,8 +1,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 {
-    children?: ReactNode | ((api: UseTooltipReturn) => ReactNode);
-}
-export declare const Tooltip: (props: TooltipProps) => JSX.Element;
+import { TooltipArrow as Arrow } from './tooltip-arrow';
+import { TooltipArrowTip as ArrowTip } from './tooltip-arrow-tip';
+import { TooltipContent as Content } from './tooltip-content';
+import { TooltipPositioner as Positioner } from './tooltip-positioner';
+import { TooltipRoot as Root } from './tooltip-root';
+import { TooltipTrigger as Trigger } from './tooltip-trigger';
+export { Arrow, ArrowTip, Content, Positioner, Root, Trigger };

package/tooltip/tooltip.mjs

@@ -1,21 +1,6 @@
-'use client';
-import { jsx } from 'react/jsx-runtime';
-import { mergeProps } from '@zag-js/react';
-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 [presenceProps, { children, ...localProps }] = splitPresenceProps(props);
-  const api = useTooltip(localProps);
-  const presenceApi = usePresence(mergeProps({ present: api.isOpen }, presenceProps));
-  const view = runIfFn(children, api);
-  return /* @__PURE__ */ jsx(TooltipProvider, { value: api, children: /* @__PURE__ */ jsx(PresenceProvider, { value: presenceApi, children: view }) });
-};
-
-export { Tooltip };
+export { TooltipArrow as Arrow } from './tooltip-arrow.mjs';
+export { TooltipArrowTip as ArrowTip } from './tooltip-arrow-tip.mjs';
+export { TooltipContent as Content } from './tooltip-content.mjs';
+export { TooltipPositioner as Positioner } from './tooltip-positioner.mjs';
+export { TooltipRoot as Root } from './tooltip-root.mjs';
+export { TooltipTrigger as Trigger } from './tooltip-trigger.mjs';

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,33 @@
+'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 = require('./tree-view.cjs');
+
+
+
+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,16 @@
+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 * as TreeView from './tree-view';
+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,14 @@
+export { TreeViewBranch } from './tree-view-branch.mjs';
+export { TreeViewBranchContent } from './tree-view-branch-content.mjs';
+export { TreeViewBranchControl } from './tree-view-branch-control.mjs';
+export { TreeViewBranchIndicator } from './tree-view-branch-indicator.mjs';
+export { TreeViewBranchText } from './tree-view-branch-text.mjs';
+export { TreeViewBranchTrigger } from './tree-view-branch-trigger.mjs';
+export { useTreeViewContext } from './tree-view-context.mjs';
+export { TreeViewItem } from './tree-view-item.mjs';
+export { TreeViewItemText } from './tree-view-item-text.mjs';
+export { TreeViewLabel } from './tree-view-label.mjs';
+export { TreeViewRoot } from './tree-view-root.mjs';
+export { TreeViewTree } from './tree-view-tree.mjs';
+import * as treeView from './tree-view.mjs';
+export { treeView as TreeView };

package/tree-view/tree-view-branch-content.cjs

@@ -0,0 +1,27 @@
+'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 treeViewContext = require('./tree-view-context.cjs');
+
+const TreeViewBranchContent = react.forwardRef(
+  (props, ref) => {
+    const [branchProps, { ...localProps }] = createSplitProps.createSplitProps()(props, [
+      "depth",
+      "id",
+      "disabled"
+    ]);
+    const api = treeViewContext.useTreeViewContext();
+    const mergedProps = react$1.mergeProps(api.getBranchContentProps(branchProps), localProps);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.ul, { ...mergedProps, ref });
+  }
+);
+TreeViewBranchContent.displayName = "TreeViewBranchContent";
+
+exports.TreeViewBranchContent = TreeViewBranchContent;

package/tree-view/tree-view-branch-content.d.ts

@@ -0,0 +1,8 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { type BranchProps } from './tree-view-context';
+export interface TreeViewBranchContentProps extends Assign<HTMLArkProps<'ul'>, BranchProps> {
+}
+export declare const TreeViewBranchContent: ForwardRefExoticComponent<TreeViewBranchContentProps & RefAttributes<HTMLUListElement>>;

package/tree-view/tree-view-branch-content.mjs

@@ -0,0 +1,23 @@
+'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 { useTreeViewContext } from './tree-view-context.mjs';
+
+const TreeViewBranchContent = forwardRef(
+  (props, ref) => {
+    const [branchProps, { ...localProps }] = createSplitProps()(props, [
+      "depth",
+      "id",
+      "disabled"
+    ]);
+    const api = useTreeViewContext();
+    const mergedProps = mergeProps(api.getBranchContentProps(branchProps), localProps);
+    return /* @__PURE__ */ jsx(ark.ul, { ...mergedProps, ref });
+  }
+);
+TreeViewBranchContent.displayName = "TreeViewBranchContent";
+
+export { TreeViewBranchContent };

package/tree-view/tree-view-branch-control.cjs

@@ -0,0 +1,27 @@
+'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 treeViewContext = require('./tree-view-context.cjs');
+
+const TreeViewBranchControl = react.forwardRef(
+  (props, ref) => {
+    const [branchProps, { ...localProps }] = createSplitProps.createSplitProps()(props, [
+      "depth",
+      "id",
+      "disabled"
+    ]);
+    const api = treeViewContext.useTreeViewContext();
+    const mergedProps = react$1.mergeProps(api.getBranchControlProps(branchProps), localProps);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+  }
+);
+TreeViewBranchControl.displayName = "TreeViewBranchControl";
+
+exports.TreeViewBranchControl = TreeViewBranchControl;

package/tree-view/tree-view-branch-control.d.ts

@@ -0,0 +1,8 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { type BranchProps } from './tree-view-context';
+export interface TreeViewBranchControlProps extends Assign<HTMLArkProps<'div'>, BranchProps> {
+}
+export declare const TreeViewBranchControl: ForwardRefExoticComponent<TreeViewBranchControlProps & RefAttributes<HTMLDivElement>>;

package/tree-view/tree-view-branch-control.mjs

@@ -0,0 +1,23 @@
+'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 { useTreeViewContext } from './tree-view-context.mjs';
+
+const TreeViewBranchControl = forwardRef(
+  (props, ref) => {
+    const [branchProps, { ...localProps }] = createSplitProps()(props, [
+      "depth",
+      "id",
+      "disabled"
+    ]);
+    const api = useTreeViewContext();
+    const mergedProps = mergeProps(api.getBranchControlProps(branchProps), localProps);
+    return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
+  }
+);
+TreeViewBranchControl.displayName = "TreeViewBranchControl";
+
+export { TreeViewBranchControl };

package/tree-view/tree-view-branch-indicator.cjs

@@ -0,0 +1,32 @@
+'use client';
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const anatomy = require('@ark-ui/anatomy');
+const react$1 = require('@zag-js/react');
+const react = require('react');
+const createSplitProps = require('../create-split-props.cjs');
+const factory = require('../factory.cjs');
+const treeViewContext = require('./tree-view-context.cjs');
+
+const TreeViewBranchIndicator = react.forwardRef(
+  (props, ref) => {
+    const [branchProps, { ...localProps }] = createSplitProps.createSplitProps()(props, [
+      "depth",
+      "id",
+      "disabled"
+    ]);
+    const api = treeViewContext.useTreeViewContext();
+    const mergedProps = react$1.mergeProps(
+      api.getBranchProps(branchProps),
+      anatomy.treeViewAnatomy.build().branchIndicator.attrs,
+      localProps
+    );
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
+  }
+);
+TreeViewBranchIndicator.displayName = "TreeViewBranchIndicator";
+
+exports.TreeViewBranchIndicator = TreeViewBranchIndicator;

package/tree-view/tree-view-branch-indicator.d.ts

@@ -0,0 +1,8 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { type BranchProps } from './tree-view-context';
+export interface TreeViewBranchIndicatorProps extends Assign<HTMLArkProps<'div'>, BranchProps> {
+}
+export declare const TreeViewBranchIndicator: ForwardRefExoticComponent<TreeViewBranchIndicatorProps & RefAttributes<HTMLDivElement>>;

package/tree-view/tree-view-branch-indicator.mjs

@@ -0,0 +1,28 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { treeViewAnatomy } from '@ark-ui/anatomy';
+import { mergeProps } from '@zag-js/react';
+import { forwardRef } from 'react';
+import { createSplitProps } from '../create-split-props.mjs';
+import { ark } from '../factory.mjs';
+import { useTreeViewContext } from './tree-view-context.mjs';
+
+const TreeViewBranchIndicator = forwardRef(
+  (props, ref) => {
+    const [branchProps, { ...localProps }] = createSplitProps()(props, [
+      "depth",
+      "id",
+      "disabled"
+    ]);
+    const api = useTreeViewContext();
+    const mergedProps = mergeProps(
+      api.getBranchProps(branchProps),
+      treeViewAnatomy.build().branchIndicator.attrs,
+      localProps
+    );
+    return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
+  }
+);
+TreeViewBranchIndicator.displayName = "TreeViewBranchIndicator";
+
+export { TreeViewBranchIndicator };

package/tree-view/tree-view-branch-text.cjs

@@ -0,0 +1,27 @@
+'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 treeViewContext = require('./tree-view-context.cjs');
+
+const TreeViewBranchText = react.forwardRef(
+  (props, ref) => {
+    const [branchProps, { ...localProps }] = createSplitProps.createSplitProps()(props, [
+      "depth",
+      "id",
+      "disabled"
+    ]);
+    const api = treeViewContext.useTreeViewContext();
+    const mergedProps = react$1.mergeProps(api.getBranchTextProps(branchProps), localProps);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.span, { ...mergedProps, ref });
+  }
+);
+TreeViewBranchText.displayName = "TreeViewBranchText";
+
+exports.TreeViewBranchText = TreeViewBranchText;

package/tree-view/tree-view-branch-text.d.ts

@@ -0,0 +1,8 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { type BranchProps } from './tree-view-context';
+export interface TreeViewBranchTextProps extends Assign<HTMLArkProps<'span'>, BranchProps> {
+}
+export declare const TreeViewBranchText: ForwardRefExoticComponent<TreeViewBranchTextProps & RefAttributes<HTMLSpanElement>>;

package/tree-view/tree-view-branch-text.mjs

@@ -0,0 +1,23 @@
+'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 { useTreeViewContext } from './tree-view-context.mjs';
+
+const TreeViewBranchText = forwardRef(
+  (props, ref) => {
+    const [branchProps, { ...localProps }] = createSplitProps()(props, [
+      "depth",
+      "id",
+      "disabled"
+    ]);
+    const api = useTreeViewContext();
+    const mergedProps = mergeProps(api.getBranchTextProps(branchProps), localProps);
+    return /* @__PURE__ */ jsx(ark.span, { ...mergedProps, ref });
+  }
+);
+TreeViewBranchText.displayName = "TreeViewBranchText";
+
+export { TreeViewBranchText };

package/tree-view/tree-view-branch-trigger.cjs

@@ -0,0 +1,27 @@
+'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 treeViewContext = require('./tree-view-context.cjs');
+
+const TreeViewBranchTrigger = react.forwardRef(
+  (props, ref) => {
+    const [branchProps, { ...localProps }] = createSplitProps.createSplitProps()(props, [
+      "depth",
+      "id",
+      "disabled"
+    ]);
+    const api = treeViewContext.useTreeViewContext();
+    const mergedProps = react$1.mergeProps(api.getBranchTriggerProps(branchProps), localProps);
+    return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
+  }
+);
+TreeViewBranchTrigger.displayName = "TreeViewBranchTrigger";
+
+exports.TreeViewBranchTrigger = TreeViewBranchTrigger;

package/tree-view/tree-view-branch-trigger.d.ts

@@ -0,0 +1,8 @@
+import { ForwardRefExoticComponent, RefAttributes } from 'react';
+/// <reference types="react" />
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { type BranchProps } from './tree-view-context';
+export interface TreeViewBranchTriggerProps extends Assign<HTMLArkProps<'button'>, BranchProps> {
+}
+export declare const TreeViewBranchTrigger: ForwardRefExoticComponent<TreeViewBranchTriggerProps & RefAttributes<HTMLButtonElement>>;

package/tree-view/tree-view-branch-trigger.mjs

@@ -0,0 +1,23 @@
+'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 { useTreeViewContext } from './tree-view-context.mjs';
+
+const TreeViewBranchTrigger = forwardRef(
+  (props, ref) => {
+    const [branchProps, { ...localProps }] = createSplitProps()(props, [
+      "depth",
+      "id",
+      "disabled"
+    ]);
+    const api = useTreeViewContext();
+    const mergedProps = mergeProps(api.getBranchTriggerProps(branchProps), localProps);
+    return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
+  }
+);
+TreeViewBranchTrigger.displayName = "TreeViewBranchTrigger";
+
+export { TreeViewBranchTrigger };

package/tree-view/tree-view-branch.cjs

@@ -0,0 +1,28 @@
+'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 runIfFn = require('../run-if-fn.cjs');
+const treeViewContext = require('./tree-view-context.cjs');
+
+const TreeViewBranch = react.forwardRef((props, ref) => {
+  const [branchProps, { children, ...localProps }] = createSplitProps.createSplitProps()(props, [
+    "depth",
+    "id",
+    "disabled"
+  ]);
+  const api = treeViewContext.useTreeViewContext();
+  const mergedProps = react$1.mergeProps(api.getBranchProps(branchProps), localProps);
+  const branchState = api.getBranchState(branchProps);
+  const view = runIfFn.runIfFn(children, branchState);
+  return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.li, { ...mergedProps, ref, children: view });
+});
+TreeViewBranch.displayName = "TreeViewBranch";
+
+exports.TreeViewBranch = TreeViewBranch;

package/tree-view/tree-view-branch.d.ts

@@ -0,0 +1,9 @@
+import { ForwardRefExoticComponent, RefAttributes, type ReactNode } from 'react';
+import { type HTMLArkProps } from '../factory';
+import type { Assign } from '../types';
+import { type BranchProps, type BranchState } from './tree-view-context';
+export interface TreeViewBranchProps extends Assign<Assign<HTMLArkProps<'li'>, {
+    children?: ReactNode | ((state: BranchState) => ReactNode);
+}>, BranchProps> {
+}
+export declare const TreeViewBranch: ForwardRefExoticComponent<TreeViewBranchProps & RefAttributes<HTMLLIElement>>;

package/tree-view/tree-view-branch.mjs

@@ -0,0 +1,24 @@
+'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 { runIfFn } from '../run-if-fn.mjs';
+import { useTreeViewContext } from './tree-view-context.mjs';
+
+const TreeViewBranch = forwardRef((props, ref) => {
+  const [branchProps, { children, ...localProps }] = createSplitProps()(props, [
+    "depth",
+    "id",
+    "disabled"
+  ]);
+  const api = useTreeViewContext();
+  const mergedProps = mergeProps(api.getBranchProps(branchProps), localProps);
+  const branchState = api.getBranchState(branchProps);
+  const view = runIfFn(children, branchState);
+  return /* @__PURE__ */ jsx(ark.li, { ...mergedProps, ref, children: view });
+});
+TreeViewBranch.displayName = "TreeViewBranch";
+
+export { TreeViewBranch };