@ark-ui/solid 4.3.0 → 4.5.0

package/README.md

@@ -6,7 +6,7 @@
 
 # Welcome to Ark UI
 
-Ark UI is a headless, open-source UI library with over 30+ components designed for building
+Ark UI is a headless, open-source UI library with over 45+ components designed for building
 reusable, scalable Design Systems. It supports a wide range of JavaScript frameworks, offering
 dedciated packages for each supported framework.
 

package/dist/chunk/{CYRK6TAN.js → 34OZO53S.js}

@@ -1,9 +1,9 @@
-import { collapsible_exports, useCollapsibleContext } from './KQLVMRLF.js';
+import { collapsible_exports, useCollapsibleContext } from './3HMZSTYX.js';
 import { useRenderStrategyContext, splitRenderStrategyProps, RenderStrategyProvider } from './L7OSYHVR.js';
 import { createSplitProps } from './ZMHI4GDJ.js';
 import { ark } from './EPLBB4QN.js';
-import { useLocaleContext } from './HPDOBQ3V.js';
 import { useEnvironmentContext } from './QODB3C3M.js';
+import { useLocaleContext } from './HPDOBQ3V.js';
 import { createContext } from './I5UG2QUO.js';
 import { __export } from './ESLJRKWD.js';
 import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
@@ -71,7 +71,7 @@ var AccordionItemContent = (props) => {
     const [, ownProps] = splitVisibilityProps(contentProps, ["hidden", "data-state"]);
     return ownProps;
   });
-  const mergedProps = mergeProps(itemContentProps, props);
+  const mergedProps = mergeProps(() => itemContentProps(), props);
   return createComponent(collapsible_exports.Content, mergedProps);
 };
 

package/dist/chunk/{KJ3FKIIK.js → AHNBDCEA.js}

@@ -1,8 +1,8 @@
-import { useFieldContext } from './Q5KLHHE3.js';
+import { useFieldContext } from './PBJ7MGGS.js';
 import { createSplitProps } from './ZMHI4GDJ.js';
 import { ark } from './EPLBB4QN.js';
-import { useLocaleContext } from './HPDOBQ3V.js';
 import { useEnvironmentContext } from './QODB3C3M.js';
+import { useLocaleContext } from './HPDOBQ3V.js';
 import { createContext } from './I5UG2QUO.js';
 import { __export } from './ESLJRKWD.js';
 import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';

package/dist/chunk/{OEWX5CKM.jsx → AZBVL3C5.jsx}

@@ -1,6 +1,6 @@
 import {
   useFieldContext
-} from "./LS7TV3SH.jsx";
+} from "./TY6NCPFG.jsx";
 import {
   createSplitProps
 } from "./6WEDGJKQ.jsx";

package/dist/chunk/{E4USRLNU.jsx → CLZWNSRO.jsx}

@@ -1,12 +1,12 @@
+import {
+  useFieldContext
+} from "./TY6NCPFG.jsx";
 import {
   PresenceProvider,
   splitPresenceProps,
   usePresence,
   usePresenceContext
 } from "./E72NMPSK.jsx";
-import {
-  useFieldContext
-} from "./LS7TV3SH.jsx";
 import {
   createSplitProps
 } from "./6WEDGJKQ.jsx";

package/dist/chunk/{QUGFFYRX.jsx → CRUV7XPV.jsx}

@@ -222,6 +222,9 @@ var TimePickerTrigger = (props) => {
   return <ark.button {...mergedProps} />;
 };
 
+// src/components/time-picker/time-picker.anatomy.ts
+import { anatomy } from "@zag-js/time-picker";
+
 // src/components/time-picker/time-picker.ts
 var time_picker_exports = {};
 __export(time_picker_exports, {
@@ -256,6 +259,7 @@ export {
   TimePickerRootProvider,
   TimePickerSpacer,
   TimePickerTrigger,
+  anatomy,
   time_picker_exports,
   parseTime
 };

package/dist/chunk/{AOG74HPY.jsx → CUHGQRR2.jsx}

@@ -1,12 +1,12 @@
+import {
+  useFieldContext
+} from "./TY6NCPFG.jsx";
 import {
   PresenceProvider,
   splitPresenceProps,
   usePresence,
   usePresenceContext
 } from "./E72NMPSK.jsx";
-import {
-  useFieldContext
-} from "./LS7TV3SH.jsx";
 import {
   createSplitProps
 } from "./6WEDGJKQ.jsx";
@@ -247,7 +247,6 @@ var ComboboxRoot = (props) => {
     "disabled",
     "disableLayer",
     "form",
-    "getSelectionValue",
     "highlightedValue",
     "id",
     "ids",

package/dist/chunk/DFMOPRAE.jsx

@@ -0,0 +1,299 @@
+import {
+  collapsible_exports
+} from "./PQ3UNZE4.jsx";
+import {
+  RenderStrategyProvider,
+  splitRenderStrategyProps,
+  useRenderStrategyContext
+} from "./5ONYCKM3.jsx";
+import {
+  createSplitProps
+} from "./6WEDGJKQ.jsx";
+import {
+  ark
+} from "./UFYZ7HLU.jsx";
+import {
+  useLocaleContext
+} from "./3QQZKR3F.jsx";
+import {
+  useEnvironmentContext
+} from "./5O4RWSWO.jsx";
+import {
+  createContext
+} from "./NMGUCD2L.jsx";
+import {
+  __export
+} from "./7IUG3E2V.jsx";
+
+// src/components/tree-view/tree-view-branch.tsx
+import { mergeProps } from "@zag-js/solid";
+import { createMemo } from "solid-js";
+
+// src/components/tree-view/use-tree-view-context.ts
+var [TreeViewProvider, useTreeViewContext] = createContext({
+  hookName: "useTreeViewContext",
+  providerName: "<TreeViewProvider />"
+});
+
+// src/components/tree-view/use-tree-view-node-props-context.ts
+var [TreeViewNodePropsProvider, useTreeViewNodePropsContext] = createContext({
+  hookName: "useTreeViewNodePropsContext",
+  providerName: "<TreeViewNodeProvider />"
+});
+
+// src/components/tree-view/tree-view-branch.tsx
+var TreeViewBranch = (props) => {
+  const treeView2 = useTreeViewContext();
+  const nodeProps = useTreeViewNodePropsContext();
+  const renderStrategyProps = useRenderStrategyContext();
+  const nodeState = createMemo(() => treeView2().getNodeState(nodeProps));
+  const branchContentProps = treeView2().getBranchContentProps(nodeProps);
+  const mergedProps = mergeProps(() => treeView2().getBranchProps(nodeProps), props);
+  return <collapsible_exports.Root
+    open={nodeState().expanded}
+    ids={{ content: branchContentProps.id }}
+    {...renderStrategyProps}
+    {...mergedProps}
+  />;
+};
+
+// src/components/tree-view/tree-view-branch-content.tsx
+import { mergeProps as mergeProps2 } from "@zag-js/solid";
+import { createMemo as createMemo2 } from "solid-js";
+var splitVisibilityProps = createSplitProps();
+var TreeViewBranchContent = (props) => {
+  const treeView2 = useTreeViewContext();
+  const nodeProps = useTreeViewNodePropsContext();
+  const branchContentProps = createMemo2(() => {
+    const contentProps = treeView2().getBranchContentProps(nodeProps);
+    const [, ownProps] = splitVisibilityProps(contentProps, [
+      "hidden",
+      "data-state"
+    ]);
+    return ownProps;
+  });
+  const mergedProps = mergeProps2(() => branchContentProps(), props);
+  return <collapsible_exports.Content {...mergedProps} />;
+};
+
+// src/components/tree-view/tree-view-branch-control.tsx
+import { mergeProps as mergeProps3 } from "@zag-js/solid";
+var TreeViewBranchControl = (props) => {
+  const treeView2 = useTreeViewContext();
+  const nodeProps = useTreeViewNodePropsContext();
+  const mergedProps = mergeProps3(() => treeView2().getBranchControlProps(nodeProps), props);
+  return <ark.div {...mergedProps} />;
+};
+
+// src/components/tree-view/tree-view-branch-indent-guide.tsx
+import { mergeProps as mergeProps4 } from "@zag-js/solid";
+var TreeViewBranchIndentGuide = (props) => {
+  const treeView2 = useTreeViewContext();
+  const nodeProps = useTreeViewNodePropsContext();
+  const mergedProps = mergeProps4(() => treeView2().getBranchIndentGuideProps(nodeProps), props);
+  return <ark.div {...mergedProps} />;
+};
+
+// src/components/tree-view/tree-view-branch-indicator.tsx
+import { mergeProps as mergeProps5 } from "@zag-js/solid";
+var TreeViewBranchIndicator = (props) => {
+  const treeView2 = useTreeViewContext();
+  const nodeProps = useTreeViewNodePropsContext();
+  const mergedProps = mergeProps5(() => treeView2().getBranchIndicatorProps(nodeProps), props);
+  return <ark.div {...mergedProps} />;
+};
+
+// src/components/tree-view/tree-view-branch-text.tsx
+import { mergeProps as mergeProps6 } from "@zag-js/solid";
+var TreeViewBranchText = (props) => {
+  const treeView2 = useTreeViewContext();
+  const nodeProps = useTreeViewNodePropsContext();
+  const mergedProps = mergeProps6(() => treeView2().getBranchTextProps(nodeProps), props);
+  return <ark.span {...mergedProps} />;
+};
+
+// src/components/tree-view/tree-view-branch-trigger.tsx
+import { mergeProps as mergeProps7 } from "@zag-js/solid";
+var TreeViewBranchTrigger = (props) => {
+  const treeView2 = useTreeViewContext();
+  const nodeProps = useTreeViewNodePropsContext();
+  const mergedProps = mergeProps7(() => treeView2().getBranchTriggerProps(nodeProps), props);
+  return <ark.div {...mergedProps} />;
+};
+
+// src/components/tree-view/tree-view-item.tsx
+import { mergeProps as mergeProps8 } from "@zag-js/solid";
+var TreeViewItem = (props) => {
+  const treeView2 = useTreeViewContext();
+  const nodeProps = useTreeViewNodePropsContext();
+  const mergedProps = mergeProps8(() => treeView2().getItemProps(nodeProps), props);
+  return <ark.div {...mergedProps} />;
+};
+
+// src/components/tree-view/tree-view-item-indicator.tsx
+import { mergeProps as mergeProps9 } from "@zag-js/solid";
+var TreeViewItemIndicator = (props) => {
+  const treeView2 = useTreeViewContext();
+  const nodeProps = useTreeViewNodePropsContext();
+  const mergedProps = mergeProps9(() => treeView2().getItemIndicatorProps(nodeProps), props);
+  return <ark.div {...mergedProps} />;
+};
+
+// src/components/tree-view/tree-view-item-text.tsx
+import { mergeProps as mergeProps10 } from "@zag-js/solid";
+var TreeViewItemText = (props) => {
+  const treeView2 = useTreeViewContext();
+  const nodeProps = useTreeViewNodePropsContext();
+  const mergedProps = mergeProps10(() => treeView2().getItemTextProps(nodeProps), props);
+  return <ark.span {...mergedProps} />;
+};
+
+// src/components/tree-view/tree-view-label.tsx
+import { mergeProps as mergeProps11 } from "@zag-js/solid";
+var TreeViewLabel = (props) => {
+  const treeView2 = useTreeViewContext();
+  const mergedProps = mergeProps11(() => treeView2().getLabelProps(), props);
+  return <ark.label {...mergedProps} />;
+};
+
+// src/components/tree-view/use-tree-view-node-context.ts
+var [TreeViewNodeProvider, useTreeViewNodeContext] = createContext(
+  {
+    hookName: "useTreeViewNodeContext",
+    providerName: "<TreeViewNodeProvider />"
+  }
+);
+
+// src/components/tree-view/tree-view-node-context.ts
+var TreeViewNodeContext = (props) => props.children(useTreeViewNodeContext());
+
+// src/components/tree-view/tree-view-node-provider.tsx
+function TreeViewNodeProvider2(props) {
+  const [nodeProps, localProps] = createSplitProps()(props, ["indexPath", "node"]);
+  return <TreeViewNodePropsProvider value={nodeProps}>{localProps.children}</TreeViewNodePropsProvider>;
+}
+
+// src/components/tree-view/tree-view-root.tsx
+import { mergeProps as mergeProps12 } from "@zag-js/solid";
+
+// src/components/tree-view/use-tree-view.ts
+import { normalizeProps, useMachine } from "@zag-js/solid";
+import * as treeView from "@zag-js/tree-view";
+import { createMemo as createMemo3, createUniqueId } from "solid-js";
+var useTreeView = (props) => {
+  const locale = useLocaleContext();
+  const environment = useEnvironmentContext();
+  const id = createUniqueId();
+  const context = createMemo3(() => ({
+    id,
+    dir: locale().dir,
+    getRootNode: environment().getRootNode,
+    selectedValue: props.defaultSelectedValue,
+    expandedValue: props.defaultExpandedValue,
+    ...props
+  }));
+  const [state, send] = useMachine(treeView.machine(context()), { context });
+  return createMemo3(() => treeView.connect(state, send, normalizeProps));
+};
+
+// src/components/tree-view/tree-view-root.tsx
+var TreeViewRoot = (props) => {
+  const [renderStrategyProps, treeViewProps] = splitRenderStrategyProps(props);
+  const [useTreeViewProps, localProps] = createSplitProps()(treeViewProps, [
+    "collection",
+    "defaultExpandedValue",
+    "defaultSelectedValue",
+    "expandedValue",
+    "expandOnClick",
+    "focusedValue",
+    "id",
+    "ids",
+    "onExpandedChange",
+    "onFocusChange",
+    "onSelectionChange",
+    "selectedValue",
+    "selectionMode",
+    "typeahead"
+  ]);
+  const treeView2 = useTreeView(useTreeViewProps);
+  const mergedProps = mergeProps12(() => treeView2().getRootProps(), localProps);
+  return <TreeViewProvider value={treeView2}>
+      <RenderStrategyProvider value={renderStrategyProps}>
+        <ark.div {...mergedProps} />
+      </RenderStrategyProvider>
+    </TreeViewProvider>;
+};
+
+// src/components/tree-view/tree-view-root-provider.tsx
+import { mergeProps as mergeProps13 } from "@zag-js/solid";
+var TreeViewRootProvider = (props) => {
+  const [renderStrategyProps, treeViewProps] = splitRenderStrategyProps(props);
+  const [{ value: treeView2 }, localProps] = createSplitProps()(
+    treeViewProps,
+    ["value"]
+  );
+  const mergedProps = mergeProps13(() => treeView2().getRootProps(), localProps);
+  return <TreeViewProvider value={treeView2}>
+      <RenderStrategyProvider value={renderStrategyProps}>
+        <ark.div {...mergedProps} />
+      </RenderStrategyProvider>
+    </TreeViewProvider>;
+};
+
+// src/components/tree-view/tree-view-tree.tsx
+import { mergeProps as mergeProps14 } from "@zag-js/solid";
+var TreeViewTree = (props) => {
+  const treeView2 = useTreeViewContext();
+  const mergedProps = mergeProps14(() => treeView2().getTreeProps(), props);
+  return <ark.div {...mergedProps} />;
+};
+
+// src/components/tree-view/tree-view.anatomy.ts
+import { anatomy } from "@zag-js/tree-view";
+
+// src/components/tree-view/tree-view.ts
+var tree_view_exports = {};
+__export(tree_view_exports, {
+  Branch: () => TreeViewBranch,
+  BranchContent: () => TreeViewBranchContent,
+  BranchControl: () => TreeViewBranchControl,
+  BranchIndentGuide: () => TreeViewBranchIndentGuide,
+  BranchIndicator: () => TreeViewBranchIndicator,
+  BranchText: () => TreeViewBranchText,
+  BranchTrigger: () => TreeViewBranchTrigger,
+  Context: () => TreeViewContext,
+  Item: () => TreeViewItem,
+  ItemIndicator: () => TreeViewItemIndicator,
+  ItemText: () => TreeViewItemText,
+  Label: () => TreeViewLabel,
+  NodeContext: () => TreeViewNodeContext,
+  NodeProvider: () => TreeViewNodeProvider2,
+  Root: () => TreeViewRoot,
+  RootProvider: () => TreeViewRootProvider,
+  Tree: () => TreeViewTree
+});
+
+// src/components/tree-view/tree-view-context.tsx
+var TreeViewContext = (props) => props.children(useTreeViewContext());
+
+export {
+  TreeViewBranch,
+  TreeViewBranchContent,
+  TreeViewBranchControl,
+  TreeViewBranchIndentGuide,
+  TreeViewBranchIndicator,
+  TreeViewBranchText,
+  TreeViewBranchTrigger,
+  TreeViewItem,
+  TreeViewItemIndicator,
+  TreeViewItemText,
+  TreeViewLabel,
+  TreeViewNodeContext,
+  TreeViewNodeProvider2 as TreeViewNodeProvider,
+  useTreeView,
+  TreeViewRoot,
+  TreeViewRootProvider,
+  TreeViewTree,
+  anatomy,
+  tree_view_exports
+};

package/dist/chunk/{PIUV7KP7.js → DLHPAHCZ.js}

@@ -1,4 +1,4 @@
-import { ListCollection } from '@zag-js/collection';
+import { ListCollection, TreeCollection, filePathToTree } from '@zag-js/collection';
 
 // src/components/collection.ts
 
@@ -24,5 +24,7 @@ function ref(obj) {
 
 // src/components/collection.ts
 var createListCollection = (options) => ref(new ListCollection(options));
+var createTreeCollection = (options) => ref(new TreeCollection(options));
+var createFileTreeCollection = (paths) => ref(filePathToTree(paths));
 
-export { createListCollection };
+export { createFileTreeCollection, createListCollection, createTreeCollection };

package/dist/chunk/{UPYUPAKW.jsx → DV2ZLINV.jsx}

@@ -3,7 +3,7 @@ import {
 } from "./52WUF3CY.jsx";
 import {
   useFieldContext
-} from "./LS7TV3SH.jsx";
+} from "./TY6NCPFG.jsx";
 import {
   createSplitProps
 } from "./6WEDGJKQ.jsx";

package/dist/chunk/{KBVWLUJ7.jsx → EDCPFD3E.jsx}

@@ -1,5 +1,9 @@
 // src/components/collection.ts
-import { ListCollection } from "@zag-js/collection";
+import {
+  ListCollection,
+  TreeCollection,
+  filePathToTree
+} from "@zag-js/collection";
 
 // ../../node_modules/proxy-compare/dist/index.js
 var TRACK_MEMO_SYMBOL = Symbol();
@@ -242,7 +246,11 @@ function ref(obj) {
 
 // src/components/collection.ts
 var createListCollection = (options) => ref(new ListCollection(options));
+var createTreeCollection = (options) => ref(new TreeCollection(options));
+var createFileTreeCollection = (paths) => ref(filePathToTree(paths));
 
 export {
-  createListCollection
+  createListCollection,
+  createTreeCollection,
+  createFileTreeCollection
 };

package/dist/chunk/{F66KWWUN.js → FC5DK746.js}

@@ -1,9 +1,9 @@
+import { useFieldContext } from './PBJ7MGGS.js';
 import { usePresenceContext, splitPresenceProps, usePresence, PresenceProvider } from './LCESUDZB.js';
-import { useFieldContext } from './Q5KLHHE3.js';
 import { createSplitProps } from './ZMHI4GDJ.js';
 import { ark } from './EPLBB4QN.js';
-import { useLocaleContext } from './HPDOBQ3V.js';
 import { useEnvironmentContext } from './QODB3C3M.js';
+import { useLocaleContext } from './HPDOBQ3V.js';
 import { createContext } from './I5UG2QUO.js';
 import { __export } from './ESLJRKWD.js';
 import * as colorPicker from '@zag-js/color-picker';

package/dist/chunk/{POMWY2MG.jsx → FNDB3E7F.jsx}

@@ -1,6 +1,6 @@
 import {
   useFieldContext
-} from "./LS7TV3SH.jsx";
+} from "./TY6NCPFG.jsx";
 import {
   createSplitProps
 } from "./6WEDGJKQ.jsx";

package/dist/chunk/{SYODOK2B.js → G7GWGK6F.js}

@@ -1,8 +1,8 @@
-import { useFieldContext } from './Q5KLHHE3.js';
+import { useFieldContext } from './PBJ7MGGS.js';
 import { createSplitProps } from './ZMHI4GDJ.js';
 import { ark } from './EPLBB4QN.js';
-import { useLocaleContext } from './HPDOBQ3V.js';
 import { useEnvironmentContext } from './QODB3C3M.js';
+import { useLocaleContext } from './HPDOBQ3V.js';
 import { createContext } from './I5UG2QUO.js';
 import { __export } from './ESLJRKWD.js';
 import { createComponent, mergeProps as mergeProps$1, spread, template } from 'solid-js/web';