@ark-ui/react 4.2.0 → 4.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/components/anatomy.d.cts +1 -0
- package/dist/components/anatomy.d.ts +1 -0
- package/dist/components/collection.cjs +2 -0
- package/dist/components/collection.d.cts +4 -1
- package/dist/components/collection.d.ts +4 -1
- package/dist/components/collection.js +3 -2
- package/dist/components/combobox/combobox-root.cjs +0 -1
- package/dist/components/combobox/combobox-root.js +0 -1
- package/dist/components/combobox/use-combobox.cjs +1 -1
- package/dist/components/combobox/use-combobox.js +1 -1
- package/dist/components/field/field-textarea.cjs +14 -2
- package/dist/components/field/field-textarea.d.cts +5 -0
- package/dist/components/field/field-textarea.d.ts +5 -0
- package/dist/components/field/field-textarea.js +15 -3
- package/dist/components/index.cjs +14 -10
- package/dist/components/index.js +5 -5
- package/dist/components/time-picker/index.cjs +7 -2
- package/dist/components/time-picker/index.d.cts +1 -0
- package/dist/components/time-picker/index.d.ts +1 -0
- package/dist/components/time-picker/index.js +1 -0
- package/dist/components/time-picker/time-picker.anatomy.d.cts +1 -0
- package/dist/components/time-picker/time-picker.anatomy.d.ts +1 -0
- package/dist/components/toast/create-toaster.d.cts +1 -1
- package/dist/components/toast/create-toaster.d.ts +1 -1
- package/dist/components/tree-view/index.cjs +8 -8
- package/dist/components/tree-view/index.d.cts +4 -4
- package/dist/components/tree-view/index.d.ts +4 -4
- package/dist/components/tree-view/index.js +4 -4
- package/dist/components/tree-view/tree-view-branch-content.cjs +9 -5
- package/dist/components/tree-view/tree-view-branch-content.d.cts +2 -2
- package/dist/components/tree-view/tree-view-branch-content.d.ts +2 -2
- package/dist/components/tree-view/tree-view-branch-content.js +9 -5
- package/dist/components/tree-view/tree-view-branch-control.cjs +3 -3
- package/dist/components/tree-view/tree-view-branch-control.js +3 -3
- package/dist/components/tree-view/tree-view-branch-indent-guide.cjs +23 -0
- package/dist/components/tree-view/tree-view-branch-indent-guide.d.cts +7 -0
- package/dist/components/tree-view/tree-view-branch-indent-guide.d.ts +7 -0
- package/dist/components/tree-view/tree-view-branch-indent-guide.js +19 -0
- package/dist/components/tree-view/tree-view-branch-indicator.cjs +3 -3
- package/dist/components/tree-view/tree-view-branch-indicator.js +3 -3
- package/dist/components/tree-view/tree-view-branch-text.cjs +3 -3
- package/dist/components/tree-view/tree-view-branch-text.js +3 -3
- package/dist/components/tree-view/tree-view-branch-trigger.cjs +3 -3
- package/dist/components/tree-view/tree-view-branch-trigger.js +3 -3
- package/dist/components/tree-view/tree-view-branch.cjs +18 -9
- package/dist/components/tree-view/tree-view-branch.d.cts +3 -4
- package/dist/components/tree-view/tree-view-branch.d.ts +3 -4
- package/dist/components/tree-view/tree-view-branch.js +18 -9
- package/dist/components/tree-view/tree-view-context.d.cts +5 -4
- package/dist/components/tree-view/tree-view-context.d.ts +5 -4
- package/dist/components/tree-view/tree-view-item-indicator.cjs +3 -3
- package/dist/components/tree-view/tree-view-item-indicator.js +3 -3
- package/dist/components/tree-view/tree-view-item-text.cjs +3 -3
- package/dist/components/tree-view/tree-view-item-text.js +3 -3
- package/dist/components/tree-view/tree-view-item.cjs +4 -13
- package/dist/components/tree-view/tree-view-item.d.cts +3 -4
- package/dist/components/tree-view/tree-view-item.d.ts +3 -4
- package/dist/components/tree-view/tree-view-item.js +4 -13
- package/dist/components/tree-view/tree-view-node-context.cjs +10 -0
- package/dist/components/tree-view/tree-view-node-context.d.cts +6 -0
- package/dist/components/tree-view/tree-view-node-context.d.ts +6 -0
- package/dist/components/tree-view/tree-view-node-context.js +6 -0
- package/dist/components/tree-view/tree-view-node-provider.cjs +15 -0
- package/dist/components/tree-view/tree-view-node-provider.d.cts +8 -0
- package/dist/components/tree-view/tree-view-node-provider.d.ts +8 -0
- package/dist/components/tree-view/tree-view-node-provider.js +11 -0
- package/dist/components/tree-view/tree-view-root-provider.cjs +11 -10
- package/dist/components/tree-view/tree-view-root-provider.d.cts +8 -6
- package/dist/components/tree-view/tree-view-root-provider.d.ts +8 -6
- package/dist/components/tree-view/tree-view-root-provider.js +11 -10
- package/dist/components/tree-view/tree-view-root.cjs +8 -5
- package/dist/components/tree-view/tree-view-root.d.cts +6 -4
- package/dist/components/tree-view/tree-view-root.d.ts +6 -4
- package/dist/components/tree-view/tree-view-root.js +8 -5
- package/dist/components/tree-view/tree-view-tree.cjs +1 -2
- package/dist/components/tree-view/tree-view-tree.d.cts +2 -2
- package/dist/components/tree-view/tree-view-tree.d.ts +2 -2
- package/dist/components/tree-view/tree-view-tree.js +1 -2
- package/dist/components/tree-view/tree-view.cjs +6 -2
- package/dist/components/tree-view/tree-view.d.cts +16 -14
- package/dist/components/tree-view/tree-view.d.ts +16 -14
- package/dist/components/tree-view/tree-view.js +3 -1
- package/dist/components/tree-view/use-tree-view-context.d.cts +3 -2
- package/dist/components/tree-view/use-tree-view-context.d.ts +3 -2
- package/dist/components/tree-view/use-tree-view-node-context.cjs +17 -0
- package/dist/components/tree-view/use-tree-view-node-context.d.cts +5 -0
- package/dist/components/tree-view/use-tree-view-node-context.d.ts +5 -0
- package/dist/components/tree-view/use-tree-view-node-context.js +12 -0
- package/dist/components/tree-view/use-tree-view-node-props-context.cjs +15 -0
- package/dist/components/tree-view/use-tree-view-node-props-context.d.cts +5 -0
- package/dist/components/tree-view/use-tree-view-node-props-context.d.ts +5 -0
- package/dist/components/tree-view/use-tree-view-node-props-context.js +10 -0
- package/dist/components/tree-view/use-tree-view.cjs +25 -15
- package/dist/components/tree-view/use-tree-view.d.cts +8 -3
- package/dist/components/tree-view/use-tree-view.d.ts +8 -3
- package/dist/components/tree-view/use-tree-view.js +26 -16
- package/dist/index.cjs +14 -10
- package/dist/index.js +5 -5
- package/package.json +69 -59
- package/dist/components/tree-view/tree-view-item-context.cjs +0 -10
- package/dist/components/tree-view/tree-view-item-context.d.cts +0 -6
- package/dist/components/tree-view/tree-view-item-context.d.ts +0 -6
- package/dist/components/tree-view/tree-view-item-context.js +0 -6
- package/dist/components/tree-view/use-tree-view-branch-context.cjs +0 -15
- package/dist/components/tree-view/use-tree-view-branch-context.d.cts +0 -7
- package/dist/components/tree-view/use-tree-view-branch-context.d.ts +0 -7
- package/dist/components/tree-view/use-tree-view-branch-context.js +0 -10
- package/dist/components/tree-view/use-tree-view-depth-context.cjs +0 -15
- package/dist/components/tree-view/use-tree-view-depth-context.d.cts +0 -3
- package/dist/components/tree-view/use-tree-view-depth-context.d.ts +0 -3
- package/dist/components/tree-view/use-tree-view-depth-context.js +0 -10
- package/dist/components/tree-view/use-tree-view-item-context.cjs +0 -17
- package/dist/components/tree-view/use-tree-view-item-context.d.cts +0 -5
- package/dist/components/tree-view/use-tree-view-item-context.d.ts +0 -5
- package/dist/components/tree-view/use-tree-view-item-context.js +0 -12
- package/dist/components/tree-view/use-tree-view-item-props-context.cjs +0 -15
- package/dist/components/tree-view/use-tree-view-item-props-context.d.cts +0 -5
- package/dist/components/tree-view/use-tree-view-item-props-context.d.ts +0 -5
- package/dist/components/tree-view/use-tree-view-item-props-context.js +0 -10
|
@@ -1,31 +1,41 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { useMachine, normalizeProps } from '@zag-js/react';
|
|
3
3
|
import * as treeView from '@zag-js/tree-view';
|
|
4
|
-
import { useId } from 'react';
|
|
4
|
+
import { useId, useEffect } from 'react';
|
|
5
5
|
import { useEnvironmentContext } from '../../providers/environment/use-environment-context.js';
|
|
6
6
|
import { useLocaleContext } from '../../providers/locale/use-locale-context.js';
|
|
7
7
|
import { useEvent } from '../../utils/use-event.js';
|
|
8
8
|
|
|
9
|
-
const useTreeView = (props
|
|
10
|
-
const {
|
|
11
|
-
const
|
|
9
|
+
const useTreeView = (props) => {
|
|
10
|
+
const { collection, ...treeViewProps } = props;
|
|
11
|
+
const locale = useLocaleContext();
|
|
12
|
+
const environment = useEnvironmentContext();
|
|
12
13
|
const initialContext = {
|
|
13
14
|
id: useId(),
|
|
14
|
-
dir,
|
|
15
|
-
getRootNode,
|
|
15
|
+
dir: locale.dir,
|
|
16
|
+
getRootNode: environment.getRootNode,
|
|
16
17
|
selectedValue: props.defaultSelectedValue,
|
|
17
18
|
expandedValue: props.defaultExpandedValue,
|
|
18
|
-
|
|
19
|
+
collection,
|
|
20
|
+
...treeViewProps
|
|
19
21
|
};
|
|
20
|
-
const context = {
|
|
21
|
-
...initialContext
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
22
|
+
const context = (() => {
|
|
23
|
+
const { collection: _, ...restProps } = initialContext;
|
|
24
|
+
return {
|
|
25
|
+
...restProps,
|
|
26
|
+
selectedValue: props.selectedValue,
|
|
27
|
+
expandedValue: props.expandedValue,
|
|
28
|
+
onFocusChange: useEvent(props.onFocusChange),
|
|
29
|
+
onExpandedChange: useEvent(props.onExpandedChange, { sync: true }),
|
|
30
|
+
onSelectionChange: useEvent(props.onSelectionChange, { sync: true })
|
|
31
|
+
};
|
|
32
|
+
})();
|
|
33
|
+
const [state, send, service] = useMachine(treeView.machine(initialContext), {
|
|
34
|
+
context
|
|
35
|
+
});
|
|
36
|
+
useEffect(() => {
|
|
37
|
+
service.setContext({ collection });
|
|
38
|
+
}, [collection]);
|
|
29
39
|
return treeView.connect(state, send, normalizeProps);
|
|
30
40
|
};
|
|
31
41
|
|
package/dist/index.cjs
CHANGED
|
@@ -517,7 +517,7 @@ const timePickerSpacer = require('./components/time-picker/time-picker-spacer.cj
|
|
|
517
517
|
const timePickerTrigger = require('./components/time-picker/time-picker-trigger.cjs');
|
|
518
518
|
const useTimePicker = require('./components/time-picker/use-time-picker.cjs');
|
|
519
519
|
const useTimePickerContext = require('./components/time-picker/use-time-picker-context.cjs');
|
|
520
|
-
const timePicker = require('./components/time-picker/time-picker.cjs');
|
|
520
|
+
const timePicker$1 = require('./components/time-picker/time-picker.cjs');
|
|
521
521
|
const timerActionTrigger = require('./components/timer/timer-action-trigger.cjs');
|
|
522
522
|
const timerContext = require('./components/timer/timer-context.cjs');
|
|
523
523
|
const timerItem = require('./components/timer/timer-item.cjs');
|
|
@@ -567,21 +567,20 @@ const tooltip$1 = require('./components/tooltip/tooltip.cjs');
|
|
|
567
567
|
const treeViewBranch = require('./components/tree-view/tree-view-branch.cjs');
|
|
568
568
|
const treeViewBranchContent = require('./components/tree-view/tree-view-branch-content.cjs');
|
|
569
569
|
const treeViewBranchControl = require('./components/tree-view/tree-view-branch-control.cjs');
|
|
570
|
+
const treeViewBranchIndentGuide = require('./components/tree-view/tree-view-branch-indent-guide.cjs');
|
|
570
571
|
const treeViewBranchIndicator = require('./components/tree-view/tree-view-branch-indicator.cjs');
|
|
571
572
|
const treeViewBranchText = require('./components/tree-view/tree-view-branch-text.cjs');
|
|
572
573
|
const treeViewBranchTrigger = require('./components/tree-view/tree-view-branch-trigger.cjs');
|
|
573
|
-
const treeViewContext = require('./components/tree-view/tree-view-context.cjs');
|
|
574
574
|
const treeViewItem = require('./components/tree-view/tree-view-item.cjs');
|
|
575
|
-
const treeViewItemContext = require('./components/tree-view/tree-view-item-context.cjs');
|
|
576
575
|
const treeViewItemIndicator = require('./components/tree-view/tree-view-item-indicator.cjs');
|
|
577
576
|
const treeViewItemText = require('./components/tree-view/tree-view-item-text.cjs');
|
|
578
577
|
const treeViewLabel = require('./components/tree-view/tree-view-label.cjs');
|
|
578
|
+
const treeViewNodeContext = require('./components/tree-view/tree-view-node-context.cjs');
|
|
579
|
+
const treeViewNodeProvider = require('./components/tree-view/tree-view-node-provider.cjs');
|
|
579
580
|
const treeViewRoot = require('./components/tree-view/tree-view-root.cjs');
|
|
580
581
|
const treeViewRootProvider = require('./components/tree-view/tree-view-root-provider.cjs');
|
|
581
582
|
const treeViewTree = require('./components/tree-view/tree-view-tree.cjs');
|
|
582
583
|
const useTreeView = require('./components/tree-view/use-tree-view.cjs');
|
|
583
|
-
const useTreeViewContext = require('./components/tree-view/use-tree-view-context.cjs');
|
|
584
|
-
const useTreeViewItemContext = require('./components/tree-view/use-tree-view-item-context.cjs');
|
|
585
584
|
const treeView$1 = require('./components/tree-view/tree-view.cjs');
|
|
586
585
|
const environmentProvider = require('./providers/environment/environment-provider.cjs');
|
|
587
586
|
const useEnvironmentContext = require('./providers/environment/use-environment-context.cjs');
|
|
@@ -613,6 +612,7 @@ const steps = require('@zag-js/steps');
|
|
|
613
612
|
const zagSwitch = require('@zag-js/switch');
|
|
614
613
|
const tabs = require('@zag-js/tabs');
|
|
615
614
|
const tagsInput = require('@zag-js/tags-input');
|
|
615
|
+
const timePicker = require('@zag-js/time-picker');
|
|
616
616
|
const timer = require('@zag-js/timer');
|
|
617
617
|
const toast = require('@zag-js/toast');
|
|
618
618
|
const toggleGroup = require('@zag-js/toggle-group');
|
|
@@ -728,6 +728,7 @@ exports.useColorPicker = useColorPicker.useColorPicker;
|
|
|
728
728
|
exports.useColorPickerContext = useColorPickerContext.useColorPickerContext;
|
|
729
729
|
exports.ColorPicker = colorPicker$1;
|
|
730
730
|
exports.createListCollection = collection.createListCollection;
|
|
731
|
+
exports.createTreeCollection = collection.createTreeCollection;
|
|
731
732
|
exports.ComboboxClearTrigger = comboboxClearTrigger.ComboboxClearTrigger;
|
|
732
733
|
exports.ComboboxContent = comboboxContent.ComboboxContent;
|
|
733
734
|
exports.ComboboxContext = comboboxContext.ComboboxContext;
|
|
@@ -1147,7 +1148,7 @@ exports.TimePickerSpacer = timePickerSpacer.TimePickerSpacer;
|
|
|
1147
1148
|
exports.TimePickerTrigger = timePickerTrigger.TimePickerTrigger;
|
|
1148
1149
|
exports.useTimePicker = useTimePicker.useTimePicker;
|
|
1149
1150
|
exports.useTimePickerContext = useTimePickerContext.useTimePickerContext;
|
|
1150
|
-
exports.TimePicker = timePicker;
|
|
1151
|
+
exports.TimePicker = timePicker$1;
|
|
1151
1152
|
exports.TimerActionTrigger = timerActionTrigger.TimerActionTrigger;
|
|
1152
1153
|
exports.TimerContext = timerContext.TimerContext;
|
|
1153
1154
|
exports.TimerItem = timerItem.TimerItem;
|
|
@@ -1197,21 +1198,20 @@ exports.Tooltip = tooltip$1;
|
|
|
1197
1198
|
exports.TreeViewBranch = treeViewBranch.TreeViewBranch;
|
|
1198
1199
|
exports.TreeViewBranchContent = treeViewBranchContent.TreeViewBranchContent;
|
|
1199
1200
|
exports.TreeViewBranchControl = treeViewBranchControl.TreeViewBranchControl;
|
|
1201
|
+
exports.TreeViewBranchIndentGuide = treeViewBranchIndentGuide.TreeViewBranchIndentGuide;
|
|
1200
1202
|
exports.TreeViewBranchIndicator = treeViewBranchIndicator.TreeViewBranchIndicator;
|
|
1201
1203
|
exports.TreeViewBranchText = treeViewBranchText.TreeViewBranchText;
|
|
1202
1204
|
exports.TreeViewBranchTrigger = treeViewBranchTrigger.TreeViewBranchTrigger;
|
|
1203
|
-
exports.TreeViewContext = treeViewContext.TreeViewContext;
|
|
1204
1205
|
exports.TreeViewItem = treeViewItem.TreeViewItem;
|
|
1205
|
-
exports.TreeViewItemContext = treeViewItemContext.TreeViewItemContext;
|
|
1206
1206
|
exports.TreeViewItemIndicator = treeViewItemIndicator.TreeViewItemIndicator;
|
|
1207
1207
|
exports.TreeViewItemText = treeViewItemText.TreeViewItemText;
|
|
1208
1208
|
exports.TreeViewLabel = treeViewLabel.TreeViewLabel;
|
|
1209
|
+
exports.TreeViewNodeContext = treeViewNodeContext.TreeViewNodeContext;
|
|
1210
|
+
exports.TreeViewNodeProvider = treeViewNodeProvider.TreeViewNodeProvider;
|
|
1209
1211
|
exports.TreeViewRoot = treeViewRoot.TreeViewRoot;
|
|
1210
1212
|
exports.TreeViewRootProvider = treeViewRootProvider.TreeViewRootProvider;
|
|
1211
1213
|
exports.TreeViewTree = treeViewTree.TreeViewTree;
|
|
1212
1214
|
exports.useTreeView = useTreeView.useTreeView;
|
|
1213
|
-
exports.useTreeViewContext = useTreeViewContext.useTreeViewContext;
|
|
1214
|
-
exports.useTreeViewItemContext = useTreeViewItemContext.useTreeViewItemContext;
|
|
1215
1215
|
exports.TreeView = treeView$1;
|
|
1216
1216
|
exports.EnvironmentProvider = environmentProvider.EnvironmentProvider;
|
|
1217
1217
|
exports.useEnvironmentContext = useEnvironmentContext.useEnvironmentContext;
|
|
@@ -1321,6 +1321,10 @@ Object.defineProperty(exports, "tagsInputAnatomy", {
|
|
|
1321
1321
|
enumerable: true,
|
|
1322
1322
|
get: () => tagsInput.anatomy
|
|
1323
1323
|
});
|
|
1324
|
+
Object.defineProperty(exports, "timePickerAnatomy", {
|
|
1325
|
+
enumerable: true,
|
|
1326
|
+
get: () => timePicker.anatomy
|
|
1327
|
+
});
|
|
1324
1328
|
Object.defineProperty(exports, "timerAnatomy", {
|
|
1325
1329
|
enumerable: true,
|
|
1326
1330
|
get: () => timer.anatomy
|
package/dist/index.js
CHANGED
|
@@ -108,7 +108,7 @@ export { useColorPicker } from './components/color-picker/use-color-picker.js';
|
|
|
108
108
|
export { useColorPickerContext } from './components/color-picker/use-color-picker-context.js';
|
|
109
109
|
import * as colorPicker from './components/color-picker/color-picker.js';
|
|
110
110
|
export { colorPicker as ColorPicker };
|
|
111
|
-
export { createListCollection } from './components/collection.js';
|
|
111
|
+
export { createListCollection, createTreeCollection } from './components/collection.js';
|
|
112
112
|
export { ComboboxClearTrigger } from './components/combobox/combobox-clear-trigger.js';
|
|
113
113
|
export { ComboboxContent } from './components/combobox/combobox-content.js';
|
|
114
114
|
export { ComboboxContext } from './components/combobox/combobox-context.js';
|
|
@@ -603,21 +603,20 @@ export { tooltip as Tooltip };
|
|
|
603
603
|
export { TreeViewBranch } from './components/tree-view/tree-view-branch.js';
|
|
604
604
|
export { TreeViewBranchContent } from './components/tree-view/tree-view-branch-content.js';
|
|
605
605
|
export { TreeViewBranchControl } from './components/tree-view/tree-view-branch-control.js';
|
|
606
|
+
export { TreeViewBranchIndentGuide } from './components/tree-view/tree-view-branch-indent-guide.js';
|
|
606
607
|
export { TreeViewBranchIndicator } from './components/tree-view/tree-view-branch-indicator.js';
|
|
607
608
|
export { TreeViewBranchText } from './components/tree-view/tree-view-branch-text.js';
|
|
608
609
|
export { TreeViewBranchTrigger } from './components/tree-view/tree-view-branch-trigger.js';
|
|
609
|
-
export { TreeViewContext } from './components/tree-view/tree-view-context.js';
|
|
610
610
|
export { TreeViewItem } from './components/tree-view/tree-view-item.js';
|
|
611
|
-
export { TreeViewItemContext } from './components/tree-view/tree-view-item-context.js';
|
|
612
611
|
export { TreeViewItemIndicator } from './components/tree-view/tree-view-item-indicator.js';
|
|
613
612
|
export { TreeViewItemText } from './components/tree-view/tree-view-item-text.js';
|
|
614
613
|
export { TreeViewLabel } from './components/tree-view/tree-view-label.js';
|
|
614
|
+
export { TreeViewNodeContext } from './components/tree-view/tree-view-node-context.js';
|
|
615
|
+
export { TreeViewNodeProvider } from './components/tree-view/tree-view-node-provider.js';
|
|
615
616
|
export { TreeViewRoot } from './components/tree-view/tree-view-root.js';
|
|
616
617
|
export { TreeViewRootProvider } from './components/tree-view/tree-view-root-provider.js';
|
|
617
618
|
export { TreeViewTree } from './components/tree-view/tree-view-tree.js';
|
|
618
619
|
export { useTreeView } from './components/tree-view/use-tree-view.js';
|
|
619
|
-
export { useTreeViewContext } from './components/tree-view/use-tree-view-context.js';
|
|
620
|
-
export { useTreeViewItemContext } from './components/tree-view/use-tree-view-item-context.js';
|
|
621
620
|
import * as treeView from './components/tree-view/tree-view.js';
|
|
622
621
|
export { treeView as TreeView };
|
|
623
622
|
export { EnvironmentProvider } from './providers/environment/environment-provider.js';
|
|
@@ -650,6 +649,7 @@ export { anatomy as stepsAnatomy } from '@zag-js/steps';
|
|
|
650
649
|
export { anatomy as switchAnatomy } from '@zag-js/switch';
|
|
651
650
|
export { anatomy as tabsAnatomy } from '@zag-js/tabs';
|
|
652
651
|
export { anatomy as tagsInputAnatomy } from '@zag-js/tags-input';
|
|
652
|
+
export { anatomy as timePickerAnatomy } from '@zag-js/time-picker';
|
|
653
653
|
export { anatomy as timerAnatomy } from '@zag-js/timer';
|
|
654
654
|
export { anatomy as toastAnatomy } from '@zag-js/toast';
|
|
655
655
|
export { anatomy as toggleGroupAnatomy } from '@zag-js/toggle-group';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ark-ui/react",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.4.0",
|
|
4
4
|
"description": "A collection of unstyled, accessible UI components for React, utilizing state machines for seamless interaction.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"accordion",
|
|
@@ -71,6 +71,14 @@
|
|
|
71
71
|
"default": "./dist/index.cjs"
|
|
72
72
|
}
|
|
73
73
|
},
|
|
74
|
+
"./anatomy": {
|
|
75
|
+
"import": {
|
|
76
|
+
"types": "./dist/components/anatomy.d.ts"
|
|
77
|
+
},
|
|
78
|
+
"require": {
|
|
79
|
+
"types": "./dist/components/anatomy.d.cts"
|
|
80
|
+
}
|
|
81
|
+
},
|
|
74
82
|
"./collection": {
|
|
75
83
|
"import": {
|
|
76
84
|
"types": "./dist/components/collection.d.ts",
|
|
@@ -136,6 +144,7 @@
|
|
|
136
144
|
"clean-package": {
|
|
137
145
|
"remove": [
|
|
138
146
|
"exports.\\..source",
|
|
147
|
+
"exports.\\./anatomy.source",
|
|
139
148
|
"exports.\\./collection.source",
|
|
140
149
|
"exports.\\./factory.source",
|
|
141
150
|
"exports.\\./environment.source",
|
|
@@ -149,62 +158,63 @@
|
|
|
149
158
|
"sideEffects": false,
|
|
150
159
|
"dependencies": {
|
|
151
160
|
"@internationalized/date": "3.5.6",
|
|
152
|
-
"@zag-js/accordion": "0.
|
|
153
|
-
"@zag-js/anatomy": "0.
|
|
154
|
-
"@zag-js/
|
|
155
|
-
"@zag-js/
|
|
156
|
-
"@zag-js/
|
|
157
|
-
"@zag-js/
|
|
158
|
-
"@zag-js/
|
|
159
|
-
"@zag-js/
|
|
160
|
-
"@zag-js/
|
|
161
|
-
"@zag-js/color-
|
|
162
|
-
"@zag-js/
|
|
163
|
-
"@zag-js/
|
|
164
|
-
"@zag-js/
|
|
165
|
-
"@zag-js/date-
|
|
166
|
-
"@zag-js/
|
|
167
|
-
"@zag-js/
|
|
168
|
-
"@zag-js/
|
|
169
|
-
"@zag-js/
|
|
170
|
-
"@zag-js/file-
|
|
171
|
-
"@zag-js/
|
|
172
|
-
"@zag-js/
|
|
173
|
-
"@zag-js/
|
|
174
|
-
"@zag-js/
|
|
175
|
-
"@zag-js/
|
|
176
|
-
"@zag-js/
|
|
177
|
-
"@zag-js/
|
|
178
|
-
"@zag-js/
|
|
179
|
-
"@zag-js/
|
|
180
|
-
"@zag-js/
|
|
181
|
-
"@zag-js/
|
|
182
|
-
"@zag-js/
|
|
183
|
-
"@zag-js/
|
|
184
|
-
"@zag-js/
|
|
185
|
-
"@zag-js/
|
|
186
|
-
"@zag-js/
|
|
187
|
-
"@zag-js/
|
|
188
|
-
"@zag-js/
|
|
189
|
-
"@zag-js/
|
|
190
|
-
"@zag-js/
|
|
191
|
-
"@zag-js/
|
|
192
|
-
"@zag-js/
|
|
193
|
-
"@zag-js/
|
|
194
|
-
"@zag-js/
|
|
195
|
-
"@zag-js/
|
|
196
|
-
"@zag-js/
|
|
197
|
-
"@zag-js/
|
|
198
|
-
"@zag-js/
|
|
199
|
-
"@zag-js/
|
|
161
|
+
"@zag-js/accordion": "0.77.1",
|
|
162
|
+
"@zag-js/anatomy": "0.77.1",
|
|
163
|
+
"@zag-js/auto-resize": "0.77.1",
|
|
164
|
+
"@zag-js/avatar": "0.77.1",
|
|
165
|
+
"@zag-js/carousel": "0.77.1",
|
|
166
|
+
"@zag-js/checkbox": "0.77.1",
|
|
167
|
+
"@zag-js/clipboard": "0.77.1",
|
|
168
|
+
"@zag-js/collapsible": "0.77.1",
|
|
169
|
+
"@zag-js/collection": "0.77.1",
|
|
170
|
+
"@zag-js/color-picker": "0.77.1",
|
|
171
|
+
"@zag-js/color-utils": "0.77.1",
|
|
172
|
+
"@zag-js/combobox": "0.77.1",
|
|
173
|
+
"@zag-js/core": "0.77.1",
|
|
174
|
+
"@zag-js/date-picker": "0.77.1",
|
|
175
|
+
"@zag-js/date-utils": "0.77.1",
|
|
176
|
+
"@zag-js/dialog": "0.77.1",
|
|
177
|
+
"@zag-js/dom-query": "0.77.1",
|
|
178
|
+
"@zag-js/editable": "0.77.1",
|
|
179
|
+
"@zag-js/file-upload": "0.77.1",
|
|
180
|
+
"@zag-js/file-utils": "0.77.1",
|
|
181
|
+
"@zag-js/highlight-word": "0.77.1",
|
|
182
|
+
"@zag-js/hover-card": "0.77.1",
|
|
183
|
+
"@zag-js/i18n-utils": "0.77.1",
|
|
184
|
+
"@zag-js/menu": "0.77.1",
|
|
185
|
+
"@zag-js/number-input": "0.77.1",
|
|
186
|
+
"@zag-js/pagination": "0.77.1",
|
|
187
|
+
"@zag-js/pin-input": "0.77.1",
|
|
188
|
+
"@zag-js/popover": "0.77.1",
|
|
189
|
+
"@zag-js/presence": "0.77.1",
|
|
190
|
+
"@zag-js/progress": "0.77.1",
|
|
191
|
+
"@zag-js/qr-code": "0.77.1",
|
|
192
|
+
"@zag-js/radio-group": "0.77.1",
|
|
193
|
+
"@zag-js/rating-group": "0.77.1",
|
|
194
|
+
"@zag-js/react": "0.77.1",
|
|
195
|
+
"@zag-js/select": "0.77.1",
|
|
196
|
+
"@zag-js/signature-pad": "0.77.1",
|
|
197
|
+
"@zag-js/slider": "0.77.1",
|
|
198
|
+
"@zag-js/splitter": "0.77.1",
|
|
199
|
+
"@zag-js/steps": "0.77.1",
|
|
200
|
+
"@zag-js/switch": "0.77.1",
|
|
201
|
+
"@zag-js/tabs": "0.77.1",
|
|
202
|
+
"@zag-js/tags-input": "0.77.1",
|
|
203
|
+
"@zag-js/time-picker": "0.77.1",
|
|
204
|
+
"@zag-js/timer": "0.77.1",
|
|
205
|
+
"@zag-js/toast": "0.77.1",
|
|
206
|
+
"@zag-js/toggle-group": "0.77.1",
|
|
207
|
+
"@zag-js/tooltip": "0.77.1",
|
|
208
|
+
"@zag-js/tree-view": "0.77.1",
|
|
209
|
+
"@zag-js/types": "0.77.1"
|
|
200
210
|
},
|
|
201
211
|
"devDependencies": {
|
|
202
212
|
"@biomejs/biome": "1.9.4",
|
|
203
213
|
"@release-it/keep-a-changelog": "5.0.0",
|
|
204
|
-
"@storybook/addon-a11y": "8.
|
|
205
|
-
"@storybook/addon-essentials": "8.
|
|
206
|
-
"@storybook/react-vite": "8.
|
|
207
|
-
"@storybook/react": "8.
|
|
214
|
+
"@storybook/addon-a11y": "8.4.2",
|
|
215
|
+
"@storybook/addon-essentials": "8.4.2",
|
|
216
|
+
"@storybook/react-vite": "8.4.2",
|
|
217
|
+
"@storybook/react": "8.4.2",
|
|
208
218
|
"@testing-library/dom": "10.4.0",
|
|
209
219
|
"@testing-library/jest-dom": "6.6.1",
|
|
210
220
|
"@testing-library/react": "16.0.1",
|
|
@@ -213,22 +223,22 @@
|
|
|
213
223
|
"@types/react": "18.3.12",
|
|
214
224
|
"@types/react-dom": "18.3.1",
|
|
215
225
|
"@vitejs/plugin-react": "4.3.3",
|
|
216
|
-
"@zag-js/stringify-state": "0.
|
|
226
|
+
"@zag-js/stringify-state": "0.77.1",
|
|
217
227
|
"clean-package": "2.2.0",
|
|
218
228
|
"globby": "14.0.2",
|
|
219
229
|
"jsdom": "25.0.1",
|
|
220
|
-
"lucide-react": "0.
|
|
230
|
+
"lucide-react": "0.456.0",
|
|
221
231
|
"react": "18.3.1",
|
|
222
232
|
"react-dom": "18.3.1",
|
|
223
233
|
"react-frame-component": "5.2.7",
|
|
224
|
-
"react-hook-form": "7.53.
|
|
234
|
+
"react-hook-form": "7.53.2",
|
|
225
235
|
"release-it": "17.10.0",
|
|
226
236
|
"resize-observer-polyfill": "1.5.1",
|
|
227
|
-
"storybook": "8.
|
|
237
|
+
"storybook": "8.4.2",
|
|
228
238
|
"typescript": "5.6.3",
|
|
229
|
-
"vite": "5.4.
|
|
239
|
+
"vite": "5.4.11",
|
|
230
240
|
"vite-plugin-dts": "4.3.0",
|
|
231
|
-
"vitest": "2.1.
|
|
241
|
+
"vitest": "2.1.4",
|
|
232
242
|
"vitest-axe": "1.0.0-pre.3"
|
|
233
243
|
},
|
|
234
244
|
"peerDependencies": {
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
'use strict';
|
|
3
|
-
|
|
4
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
-
|
|
6
|
-
const useTreeViewItemContext = require('./use-tree-view-item-context.cjs');
|
|
7
|
-
|
|
8
|
-
const TreeViewItemContext = (props) => props.children(useTreeViewItemContext.useTreeViewItemContext());
|
|
9
|
-
|
|
10
|
-
exports.TreeViewItemContext = TreeViewItemContext;
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
import { UseTreeViewItemContext } from './use-tree-view-item-context';
|
|
3
|
-
export interface TreeViewItemContextProps {
|
|
4
|
-
children: (context: UseTreeViewItemContext) => ReactNode;
|
|
5
|
-
}
|
|
6
|
-
export declare const TreeViewItemContext: (props: TreeViewItemContextProps) => ReactNode;
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
import { UseTreeViewItemContext } from './use-tree-view-item-context';
|
|
3
|
-
export interface TreeViewItemContextProps {
|
|
4
|
-
children: (context: UseTreeViewItemContext) => ReactNode;
|
|
5
|
-
}
|
|
6
|
-
export declare const TreeViewItemContext: (props: TreeViewItemContextProps) => ReactNode;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
'use strict';
|
|
3
|
-
|
|
4
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
-
|
|
6
|
-
const createContext = require('../../utils/create-context.cjs');
|
|
7
|
-
|
|
8
|
-
const [TreeViewBranchProvider, useTreeViewBranchContext] = createContext.createContext({
|
|
9
|
-
name: "TreeViewBranchContext",
|
|
10
|
-
hookName: "useTreeViewBranchContext",
|
|
11
|
-
providerName: "<TreeViewBranchProvider />"
|
|
12
|
-
});
|
|
13
|
-
|
|
14
|
-
exports.TreeViewBranchProvider = TreeViewBranchProvider;
|
|
15
|
-
exports.useTreeViewBranchContext = useTreeViewBranchContext;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { ItemProps as ZagItemProps } from '@zag-js/tree-view';
|
|
2
|
-
import { Provider } from 'react';
|
|
3
|
-
export interface ItemProps extends Omit<ZagItemProps, 'depth'> {
|
|
4
|
-
}
|
|
5
|
-
export interface UseTreeViewBranchContext extends ZagItemProps {
|
|
6
|
-
}
|
|
7
|
-
export declare const TreeViewBranchProvider: Provider<UseTreeViewBranchContext>, useTreeViewBranchContext: () => UseTreeViewBranchContext;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { ItemProps as ZagItemProps } from '@zag-js/tree-view';
|
|
2
|
-
import { Provider } from 'react';
|
|
3
|
-
export interface ItemProps extends Omit<ZagItemProps, 'depth'> {
|
|
4
|
-
}
|
|
5
|
-
export interface UseTreeViewBranchContext extends ZagItemProps {
|
|
6
|
-
}
|
|
7
|
-
export declare const TreeViewBranchProvider: Provider<UseTreeViewBranchContext>, useTreeViewBranchContext: () => UseTreeViewBranchContext;
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { createContext } from '../../utils/create-context.js';
|
|
3
|
-
|
|
4
|
-
const [TreeViewBranchProvider, useTreeViewBranchContext] = createContext({
|
|
5
|
-
name: "TreeViewBranchContext",
|
|
6
|
-
hookName: "useTreeViewBranchContext",
|
|
7
|
-
providerName: "<TreeViewBranchProvider />"
|
|
8
|
-
});
|
|
9
|
-
|
|
10
|
-
export { TreeViewBranchProvider, useTreeViewBranchContext };
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
'use strict';
|
|
3
|
-
|
|
4
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
-
|
|
6
|
-
const createContext = require('../../utils/create-context.cjs');
|
|
7
|
-
|
|
8
|
-
const [TreeViewDepthProvider, useTreeViewDepthContext] = createContext.createContext({
|
|
9
|
-
name: "TreeViewDepthContext",
|
|
10
|
-
hookName: "useTreeViewDepthContext",
|
|
11
|
-
providerName: "<TreeViewDepthProvider />"
|
|
12
|
-
});
|
|
13
|
-
|
|
14
|
-
exports.TreeViewDepthProvider = TreeViewDepthProvider;
|
|
15
|
-
exports.useTreeViewDepthContext = useTreeViewDepthContext;
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { createContext } from '../../utils/create-context.js';
|
|
3
|
-
|
|
4
|
-
const [TreeViewDepthProvider, useTreeViewDepthContext] = createContext({
|
|
5
|
-
name: "TreeViewDepthContext",
|
|
6
|
-
hookName: "useTreeViewDepthContext",
|
|
7
|
-
providerName: "<TreeViewDepthProvider />"
|
|
8
|
-
});
|
|
9
|
-
|
|
10
|
-
export { TreeViewDepthProvider, useTreeViewDepthContext };
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
'use strict';
|
|
3
|
-
|
|
4
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
-
|
|
6
|
-
const createContext = require('../../utils/create-context.cjs');
|
|
7
|
-
|
|
8
|
-
const [TreeViewItemProvider, useTreeViewItemContext] = createContext.createContext(
|
|
9
|
-
{
|
|
10
|
-
name: "TreeViewItemContext",
|
|
11
|
-
hookName: "useTreeViewItemContext",
|
|
12
|
-
providerName: "<TreeViewItemProvider />"
|
|
13
|
-
}
|
|
14
|
-
);
|
|
15
|
-
|
|
16
|
-
exports.TreeViewItemProvider = TreeViewItemProvider;
|
|
17
|
-
exports.useTreeViewItemContext = useTreeViewItemContext;
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import { ItemState } from '@zag-js/tree-view';
|
|
2
|
-
import { Provider } from 'react';
|
|
3
|
-
export interface UseTreeViewItemContext extends ItemState {
|
|
4
|
-
}
|
|
5
|
-
export declare const TreeViewItemProvider: Provider<UseTreeViewItemContext>, useTreeViewItemContext: () => UseTreeViewItemContext;
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import { ItemState } from '@zag-js/tree-view';
|
|
2
|
-
import { Provider } from 'react';
|
|
3
|
-
export interface UseTreeViewItemContext extends ItemState {
|
|
4
|
-
}
|
|
5
|
-
export declare const TreeViewItemProvider: Provider<UseTreeViewItemContext>, useTreeViewItemContext: () => UseTreeViewItemContext;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { createContext } from '../../utils/create-context.js';
|
|
3
|
-
|
|
4
|
-
const [TreeViewItemProvider, useTreeViewItemContext] = createContext(
|
|
5
|
-
{
|
|
6
|
-
name: "TreeViewItemContext",
|
|
7
|
-
hookName: "useTreeViewItemContext",
|
|
8
|
-
providerName: "<TreeViewItemProvider />"
|
|
9
|
-
}
|
|
10
|
-
);
|
|
11
|
-
|
|
12
|
-
export { TreeViewItemProvider, useTreeViewItemContext };
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
'use strict';
|
|
3
|
-
|
|
4
|
-
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
-
|
|
6
|
-
const createContext = require('../../utils/create-context.cjs');
|
|
7
|
-
|
|
8
|
-
const [TreeViewItemPropsProvider, useTreeViewItemPropsContext] = createContext.createContext({
|
|
9
|
-
name: "TreeViewItemPropsContext",
|
|
10
|
-
hookName: "useTreeViewItemPropsContext",
|
|
11
|
-
providerName: "<TreeViewItemProvider />"
|
|
12
|
-
});
|
|
13
|
-
|
|
14
|
-
exports.TreeViewItemPropsProvider = TreeViewItemPropsProvider;
|
|
15
|
-
exports.useTreeViewItemPropsContext = useTreeViewItemPropsContext;
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import { ItemProps } from '@zag-js/tree-view';
|
|
2
|
-
import { Provider } from 'react';
|
|
3
|
-
export interface UseTreeViewItemPropsContext extends Omit<ItemProps, 'depth'> {
|
|
4
|
-
}
|
|
5
|
-
export declare const TreeViewItemPropsProvider: Provider<ItemProps>, useTreeViewItemPropsContext: () => ItemProps;
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import { ItemProps } from '@zag-js/tree-view';
|
|
2
|
-
import { Provider } from 'react';
|
|
3
|
-
export interface UseTreeViewItemPropsContext extends Omit<ItemProps, 'depth'> {
|
|
4
|
-
}
|
|
5
|
-
export declare const TreeViewItemPropsProvider: Provider<ItemProps>, useTreeViewItemPropsContext: () => ItemProps;
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { createContext } from '../../utils/create-context.js';
|
|
3
|
-
|
|
4
|
-
const [TreeViewItemPropsProvider, useTreeViewItemPropsContext] = createContext({
|
|
5
|
-
name: "TreeViewItemPropsContext",
|
|
6
|
-
hookName: "useTreeViewItemPropsContext",
|
|
7
|
-
providerName: "<TreeViewItemProvider />"
|
|
8
|
-
});
|
|
9
|
-
|
|
10
|
-
export { TreeViewItemPropsProvider, useTreeViewItemPropsContext };
|