@ark-ui/react 5.20.0 → 5.22.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/dist/components/collection/examples/async-list/dependencies.d.cts +1 -0
- package/dist/components/collection/examples/async-list/dependencies.d.ts +1 -0
- package/dist/components/collection/examples/async-list/filter.d.cts +1 -0
- package/dist/components/collection/examples/async-list/filter.d.ts +1 -0
- package/dist/components/collection/examples/async-list/infinite-loading.d.cts +1 -0
- package/dist/components/collection/examples/async-list/infinite-loading.d.ts +1 -0
- package/dist/components/collection/examples/async-list/reload.d.cts +1 -0
- package/dist/components/collection/examples/async-list/reload.d.ts +1 -0
- package/dist/components/collection/examples/async-list/sort-client-side.d.cts +1 -0
- package/dist/components/collection/examples/async-list/sort-client-side.d.ts +1 -0
- package/dist/components/collection/examples/async-list/sort-server-side.d.cts +1 -0
- package/dist/components/collection/examples/async-list/sort-server-side.d.ts +1 -0
- package/dist/components/collection/examples/list-selection/basic.d.cts +1 -0
- package/dist/components/collection/examples/list-selection/basic.d.ts +1 -0
- package/dist/components/collection/examples/list-selection/multiple.d.cts +1 -0
- package/dist/components/collection/examples/list-selection/multiple.d.ts +1 -0
- package/dist/components/collection/examples/list-selection/range.d.cts +1 -0
- package/dist/components/collection/examples/list-selection/range.d.ts +1 -0
- package/dist/components/collection/index.cjs +2 -0
- package/dist/components/collection/index.d.cts +1 -0
- package/dist/components/collection/index.d.ts +1 -0
- package/dist/components/collection/index.js +1 -0
- package/dist/components/collection/use-async-list.cjs +33 -0
- package/dist/components/collection/use-async-list.d.cts +6 -0
- package/dist/components/collection/use-async-list.d.ts +6 -0
- package/dist/components/collection/use-async-list.js +10 -0
- package/dist/components/combobox/combobox-empty.cjs +22 -0
- package/dist/components/combobox/combobox-empty.d.cts +7 -0
- package/dist/components/combobox/combobox-empty.d.ts +7 -0
- package/dist/components/combobox/combobox-empty.js +18 -0
- package/dist/components/combobox/combobox.anatomy.cjs +10 -0
- package/dist/components/combobox/combobox.anatomy.d.cts +2 -1
- package/dist/components/combobox/combobox.anatomy.d.ts +2 -1
- package/dist/components/combobox/combobox.anatomy.js +6 -0
- package/dist/components/combobox/combobox.cjs +2 -0
- package/dist/components/combobox/combobox.d.cts +1 -0
- package/dist/components/combobox/combobox.d.ts +1 -0
- package/dist/components/combobox/combobox.js +1 -0
- package/dist/components/combobox/index.cjs +6 -7
- package/dist/components/combobox/index.d.cts +1 -0
- package/dist/components/combobox/index.d.ts +1 -0
- package/dist/components/combobox/index.js +2 -1
- package/dist/components/fieldset/fieldset-legend.cjs +1 -1
- package/dist/components/fieldset/fieldset-legend.d.cts +2 -2
- package/dist/components/fieldset/fieldset-legend.d.ts +2 -2
- package/dist/components/fieldset/fieldset-legend.js +1 -1
- package/dist/components/fieldset/use-fieldset.cjs +5 -2
- package/dist/components/fieldset/use-fieldset.js +5 -2
- package/dist/components/index.cjs +12 -14
- package/dist/components/index.js +4 -2
- package/dist/components/listbox/index.cjs +6 -7
- package/dist/components/listbox/index.d.cts +1 -0
- package/dist/components/listbox/index.d.ts +1 -0
- package/dist/components/listbox/index.js +2 -1
- package/dist/components/listbox/listbox-empty.cjs +22 -0
- package/dist/components/listbox/listbox-empty.d.cts +7 -0
- package/dist/components/listbox/listbox-empty.d.ts +7 -0
- package/dist/components/listbox/listbox-empty.js +18 -0
- package/dist/components/listbox/listbox.anatomy.cjs +10 -0
- package/dist/components/listbox/listbox.anatomy.d.cts +2 -1
- package/dist/components/listbox/listbox.anatomy.d.ts +2 -1
- package/dist/components/listbox/listbox.anatomy.js +6 -0
- package/dist/components/listbox/listbox.cjs +2 -0
- package/dist/components/listbox/listbox.d.cts +1 -0
- package/dist/components/listbox/listbox.d.ts +1 -0
- package/dist/components/listbox/listbox.js +1 -0
- package/dist/components/menu/menu-root.cjs +1 -0
- package/dist/components/menu/menu-root.js +1 -0
- package/dist/components/segment-group/segment-group.anatomy.d.cts +2 -2
- package/dist/components/segment-group/segment-group.anatomy.d.ts +2 -2
- package/dist/components/tabs/tab-content.cjs +1 -2
- package/dist/components/tabs/tab-content.js +1 -2
- package/dist/components/toast/index.d.cts +1 -0
- package/dist/components/toast/index.d.ts +1 -0
- package/dist/index.cjs +14 -14
- package/dist/index.js +5 -2
- package/dist/providers/index.cjs +2 -0
- package/dist/providers/index.js +1 -0
- package/dist/providers/locale/index.cjs +2 -0
- package/dist/providers/locale/index.d.cts +1 -0
- package/dist/providers/locale/index.d.ts +1 -0
- package/dist/providers/locale/index.js +1 -0
- package/dist/providers/locale/use-collator.cjs +19 -0
- package/dist/providers/locale/use-collator.d.cts +4 -0
- package/dist/providers/locale/use-collator.d.ts +4 -0
- package/dist/providers/locale/use-collator.js +15 -0
- package/package.json +70 -69
- package/dist/utils/use-debounce.cjs +0 -21
- package/dist/utils/use-debounce.js +0 -17
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Dependencies: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Dependencies: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Filter: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Filter: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const InfiniteLoading: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const InfiniteLoading: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Reload: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Reload: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const SortClientSide: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const SortClientSide: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const SortServerSide: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const SortServerSide: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Basic: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Basic: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Multiple: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Multiple: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Range: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const Range: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -5,6 +5,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
|
5
5
|
const gridCollection = require('./grid-collection.cjs');
|
|
6
6
|
const listCollection = require('./list-collection.cjs');
|
|
7
7
|
const treeCollection = require('./tree-collection.cjs');
|
|
8
|
+
const useAsyncList = require('./use-async-list.cjs');
|
|
8
9
|
const useListCollection = require('./use-list-collection.cjs');
|
|
9
10
|
const useListSelection = require('./use-list-selection.cjs');
|
|
10
11
|
|
|
@@ -14,5 +15,6 @@ exports.createGridCollection = gridCollection.createGridCollection;
|
|
|
14
15
|
exports.createListCollection = listCollection.createListCollection;
|
|
15
16
|
exports.createFileTreeCollection = treeCollection.createFileTreeCollection;
|
|
16
17
|
exports.createTreeCollection = treeCollection.createTreeCollection;
|
|
18
|
+
exports.useAsyncList = useAsyncList.useAsyncList;
|
|
17
19
|
exports.useListCollection = useListCollection.useListCollection;
|
|
18
20
|
exports.useListSelection = useListSelection.useListSelection;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export { createGridCollection, type GridCollection, type GridCollectionOptions } from './grid-collection';
|
|
2
2
|
export { createListCollection, type CollectionItem, type CollectionOptions, type ListCollection, } from './list-collection';
|
|
3
3
|
export { createFileTreeCollection, createTreeCollection, type FilePathTreeNode, type FlatTreeNode, type TreeCollection, type TreeCollectionOptions, type TreeNode, } from './tree-collection';
|
|
4
|
+
export { useAsyncList, type UseAsyncListProps, type UseAsyncListReturn } from './use-async-list';
|
|
4
5
|
export { useListCollection, type UseListCollectionProps, type UseListCollectionReturn } from './use-list-collection';
|
|
5
6
|
export { useListSelection, type UseListSelectionProps, type UseListSelectionReturn } from './use-list-selection';
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export { createGridCollection, type GridCollection, type GridCollectionOptions } from './grid-collection';
|
|
2
2
|
export { createListCollection, type CollectionItem, type CollectionOptions, type ListCollection, } from './list-collection';
|
|
3
3
|
export { createFileTreeCollection, createTreeCollection, type FilePathTreeNode, type FlatTreeNode, type TreeCollection, type TreeCollectionOptions, type TreeNode, } from './tree-collection';
|
|
4
|
+
export { useAsyncList, type UseAsyncListProps, type UseAsyncListReturn } from './use-async-list';
|
|
4
5
|
export { useListCollection, type UseListCollectionProps, type UseListCollectionReturn } from './use-list-collection';
|
|
5
6
|
export { useListSelection, type UseListSelectionProps, type UseListSelectionReturn } from './use-list-selection';
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export { createGridCollection } from './grid-collection.js';
|
|
2
2
|
export { createListCollection } from './list-collection.js';
|
|
3
3
|
export { createFileTreeCollection, createTreeCollection } from './tree-collection.js';
|
|
4
|
+
export { useAsyncList } from './use-async-list.js';
|
|
4
5
|
export { useListCollection } from './use-list-collection.js';
|
|
5
6
|
export { useListSelection } from './use-list-selection.js';
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
+
|
|
6
|
+
const asyncList = require('@zag-js/async-list');
|
|
7
|
+
const react = require('@zag-js/react');
|
|
8
|
+
|
|
9
|
+
function _interopNamespaceDefault(e) {
|
|
10
|
+
const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
|
|
11
|
+
if (e) {
|
|
12
|
+
for (const k in e) {
|
|
13
|
+
if (k !== 'default') {
|
|
14
|
+
const d = Object.getOwnPropertyDescriptor(e, k);
|
|
15
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
16
|
+
enumerable: true,
|
|
17
|
+
get: () => e[k]
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
n.default = e;
|
|
23
|
+
return Object.freeze(n);
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
const asyncList__namespace = /*#__PURE__*/_interopNamespaceDefault(asyncList);
|
|
27
|
+
|
|
28
|
+
function useAsyncList(props) {
|
|
29
|
+
const service = react.useMachine(asyncList__namespace.machine, props);
|
|
30
|
+
return asyncList__namespace.connect(service);
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
exports.useAsyncList = useAsyncList;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import * as asyncList from '@zag-js/async-list';
|
|
2
|
+
export interface UseAsyncListProps<T, C = string> extends asyncList.Props<T, C> {
|
|
3
|
+
}
|
|
4
|
+
export interface UseAsyncListReturn<T, C = string> extends asyncList.Api<T, C> {
|
|
5
|
+
}
|
|
6
|
+
export declare function useAsyncList<T, C = string>(props: UseAsyncListProps<T, C>): UseAsyncListReturn<T, C>;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import * as asyncList from '@zag-js/async-list';
|
|
2
|
+
export interface UseAsyncListProps<T, C = string> extends asyncList.Props<T, C> {
|
|
3
|
+
}
|
|
4
|
+
export interface UseAsyncListReturn<T, C = string> extends asyncList.Api<T, C> {
|
|
5
|
+
}
|
|
6
|
+
export declare function useAsyncList<T, C = string>(props: UseAsyncListProps<T, C>): UseAsyncListReturn<T, C>;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import * as asyncList from '@zag-js/async-list';
|
|
3
|
+
import { useMachine } from '@zag-js/react';
|
|
4
|
+
|
|
5
|
+
function useAsyncList(props) {
|
|
6
|
+
const service = useMachine(asyncList.machine, props);
|
|
7
|
+
return asyncList.connect(service);
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
export { useAsyncList };
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
+
|
|
6
|
+
const jsxRuntime = require('react/jsx-runtime');
|
|
7
|
+
const react = require('react');
|
|
8
|
+
const factory = require('../factory.cjs');
|
|
9
|
+
const combobox_anatomy = require('./combobox.anatomy.cjs');
|
|
10
|
+
const useComboboxContext = require('./use-combobox-context.cjs');
|
|
11
|
+
|
|
12
|
+
const parts = combobox_anatomy.comboboxAnatomy.build();
|
|
13
|
+
const ComboboxEmpty = react.forwardRef((props, ref) => {
|
|
14
|
+
const combobox = useComboboxContext.useComboboxContext();
|
|
15
|
+
if (combobox.collection.size !== 0) {
|
|
16
|
+
return null;
|
|
17
|
+
}
|
|
18
|
+
return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...parts.empty.attrs, ...props, role: "presentation", ref });
|
|
19
|
+
});
|
|
20
|
+
ComboboxEmpty.displayName = "ComboboxEmpty";
|
|
21
|
+
|
|
22
|
+
exports.ComboboxEmpty = ComboboxEmpty;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { HTMLProps, PolymorphicProps } from '../factory';
|
|
2
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
3
|
+
export interface ComboboxEmptyBaseProps extends PolymorphicProps {
|
|
4
|
+
}
|
|
5
|
+
export interface ComboboxEmptyProps extends HTMLProps<'div'>, ComboboxEmptyBaseProps {
|
|
6
|
+
}
|
|
7
|
+
export declare const ComboboxEmpty: ForwardRefExoticComponent<ComboboxEmptyProps & RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { HTMLProps, PolymorphicProps } from '../factory';
|
|
2
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
3
|
+
export interface ComboboxEmptyBaseProps extends PolymorphicProps {
|
|
4
|
+
}
|
|
5
|
+
export interface ComboboxEmptyProps extends HTMLProps<'div'>, ComboboxEmptyBaseProps {
|
|
6
|
+
}
|
|
7
|
+
export declare const ComboboxEmpty: ForwardRefExoticComponent<ComboboxEmptyProps & RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
import { forwardRef } from 'react';
|
|
4
|
+
import { ark } from '../factory.js';
|
|
5
|
+
import { comboboxAnatomy } from './combobox.anatomy.js';
|
|
6
|
+
import { useComboboxContext } from './use-combobox-context.js';
|
|
7
|
+
|
|
8
|
+
const parts = comboboxAnatomy.build();
|
|
9
|
+
const ComboboxEmpty = forwardRef((props, ref) => {
|
|
10
|
+
const combobox = useComboboxContext();
|
|
11
|
+
if (combobox.collection.size !== 0) {
|
|
12
|
+
return null;
|
|
13
|
+
}
|
|
14
|
+
return /* @__PURE__ */ jsx(ark.div, { ...parts.empty.attrs, ...props, role: "presentation", ref });
|
|
15
|
+
});
|
|
16
|
+
ComboboxEmpty.displayName = "ComboboxEmpty";
|
|
17
|
+
|
|
18
|
+
export { ComboboxEmpty };
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
+
|
|
6
|
+
const combobox = require('@zag-js/combobox');
|
|
7
|
+
|
|
8
|
+
const comboboxAnatomy = combobox.anatomy.extendWith("empty");
|
|
9
|
+
|
|
10
|
+
exports.comboboxAnatomy = comboboxAnatomy;
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
import { AnatomyInstance } from '@zag-js/anatomy';
|
|
2
|
+
export declare const comboboxAnatomy: AnatomyInstance<"input" | "label" | "content" | "list" | "root" | "item" | "trigger" | "control" | "itemGroup" | "positioner" | "clearTrigger" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;
|
|
@@ -1 +1,2 @@
|
|
|
1
|
-
|
|
1
|
+
import { AnatomyInstance } from '@zag-js/anatomy';
|
|
2
|
+
export declare const comboboxAnatomy: AnatomyInstance<"input" | "label" | "content" | "list" | "root" | "item" | "trigger" | "control" | "itemGroup" | "positioner" | "clearTrigger" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;
|
|
@@ -4,6 +4,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
|
4
4
|
|
|
5
5
|
const comboboxClearTrigger = require('./combobox-clear-trigger.cjs');
|
|
6
6
|
const comboboxContent = require('./combobox-content.cjs');
|
|
7
|
+
const comboboxEmpty = require('./combobox-empty.cjs');
|
|
7
8
|
const comboboxContext = require('./combobox-context.cjs');
|
|
8
9
|
const comboboxControl = require('./combobox-control.cjs');
|
|
9
10
|
const comboboxInput = require('./combobox-input.cjs');
|
|
@@ -24,6 +25,7 @@ const comboboxTrigger = require('./combobox-trigger.cjs');
|
|
|
24
25
|
|
|
25
26
|
exports.ClearTrigger = comboboxClearTrigger.ComboboxClearTrigger;
|
|
26
27
|
exports.Content = comboboxContent.ComboboxContent;
|
|
28
|
+
exports.Empty = comboboxEmpty.ComboboxEmpty;
|
|
27
29
|
exports.Context = comboboxContext.ComboboxContext;
|
|
28
30
|
exports.Control = comboboxControl.ComboboxControl;
|
|
29
31
|
exports.Input = comboboxInput.ComboboxInput;
|
|
@@ -2,6 +2,7 @@ export type { HighlightChangeDetails, InputValueChangeDetails, OpenChangeDetails
|
|
|
2
2
|
export type { CollectionItem } from '../collection';
|
|
3
3
|
export { ComboboxClearTrigger as ClearTrigger, type ComboboxClearTriggerBaseProps as ClearTriggerBaseProps, type ComboboxClearTriggerProps as ClearTriggerProps, } from './combobox-clear-trigger';
|
|
4
4
|
export { ComboboxContent as Content, type ComboboxContentBaseProps as ContentBaseProps, type ComboboxContentProps as ContentProps, } from './combobox-content';
|
|
5
|
+
export { ComboboxEmpty as Empty, type ComboboxEmptyBaseProps as EmptyBaseProps, type ComboboxEmptyProps as EmptyProps, } from './combobox-empty';
|
|
5
6
|
export { ComboboxContext as Context, type ComboboxContextProps as ContextProps } from './combobox-context';
|
|
6
7
|
export { ComboboxControl as Control, type ComboboxControlBaseProps as ControlBaseProps, type ComboboxControlProps as ControlProps, } from './combobox-control';
|
|
7
8
|
export { ComboboxInput as Input, type ComboboxInputBaseProps as InputBaseProps, type ComboboxInputProps as InputProps, } from './combobox-input';
|
|
@@ -2,6 +2,7 @@ export type { HighlightChangeDetails, InputValueChangeDetails, OpenChangeDetails
|
|
|
2
2
|
export type { CollectionItem } from '../collection';
|
|
3
3
|
export { ComboboxClearTrigger as ClearTrigger, type ComboboxClearTriggerBaseProps as ClearTriggerBaseProps, type ComboboxClearTriggerProps as ClearTriggerProps, } from './combobox-clear-trigger';
|
|
4
4
|
export { ComboboxContent as Content, type ComboboxContentBaseProps as ContentBaseProps, type ComboboxContentProps as ContentProps, } from './combobox-content';
|
|
5
|
+
export { ComboboxEmpty as Empty, type ComboboxEmptyBaseProps as EmptyBaseProps, type ComboboxEmptyProps as EmptyProps, } from './combobox-empty';
|
|
5
6
|
export { ComboboxContext as Context, type ComboboxContextProps as ContextProps } from './combobox-context';
|
|
6
7
|
export { ComboboxControl as Control, type ComboboxControlBaseProps as ControlBaseProps, type ComboboxControlProps as ControlProps, } from './combobox-control';
|
|
7
8
|
export { ComboboxInput as Input, type ComboboxInputBaseProps as InputBaseProps, type ComboboxInputProps as InputProps, } from './combobox-input';
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export { ComboboxClearTrigger as ClearTrigger } from './combobox-clear-trigger.js';
|
|
2
2
|
export { ComboboxContent as Content } from './combobox-content.js';
|
|
3
|
+
export { ComboboxEmpty as Empty } from './combobox-empty.js';
|
|
3
4
|
export { ComboboxContext as Context } from './combobox-context.js';
|
|
4
5
|
export { ComboboxControl as Control } from './combobox-control.js';
|
|
5
6
|
export { ComboboxInput as Input } from './combobox-input.js';
|
|
@@ -6,6 +6,7 @@ const listCollection = require('../collection/list-collection.cjs');
|
|
|
6
6
|
const useListCollection = require('../collection/use-list-collection.cjs');
|
|
7
7
|
const comboboxClearTrigger = require('./combobox-clear-trigger.cjs');
|
|
8
8
|
const comboboxContent = require('./combobox-content.cjs');
|
|
9
|
+
const comboboxEmpty = require('./combobox-empty.cjs');
|
|
9
10
|
const comboboxContext = require('./combobox-context.cjs');
|
|
10
11
|
const comboboxControl = require('./combobox-control.cjs');
|
|
11
12
|
const comboboxInput = require('./combobox-input.cjs');
|
|
@@ -21,11 +22,11 @@ const comboboxPositioner = require('./combobox-positioner.cjs');
|
|
|
21
22
|
const comboboxRoot = require('./combobox-root.cjs');
|
|
22
23
|
const comboboxRootProvider = require('./combobox-root-provider.cjs');
|
|
23
24
|
const comboboxTrigger = require('./combobox-trigger.cjs');
|
|
25
|
+
const combobox_anatomy = require('./combobox.anatomy.cjs');
|
|
24
26
|
const useCombobox = require('./use-combobox.cjs');
|
|
25
27
|
const useComboboxContext = require('./use-combobox-context.cjs');
|
|
26
28
|
const useComboboxItemContext = require('./use-combobox-item-context.cjs');
|
|
27
|
-
const combobox
|
|
28
|
-
const combobox = require('@zag-js/combobox');
|
|
29
|
+
const combobox = require('./combobox.cjs');
|
|
29
30
|
|
|
30
31
|
|
|
31
32
|
|
|
@@ -33,6 +34,7 @@ exports.createListCollection = listCollection.createListCollection;
|
|
|
33
34
|
exports.useListCollection = useListCollection.useListCollection;
|
|
34
35
|
exports.ComboboxClearTrigger = comboboxClearTrigger.ComboboxClearTrigger;
|
|
35
36
|
exports.ComboboxContent = comboboxContent.ComboboxContent;
|
|
37
|
+
exports.ComboboxEmpty = comboboxEmpty.ComboboxEmpty;
|
|
36
38
|
exports.ComboboxContext = comboboxContext.ComboboxContext;
|
|
37
39
|
exports.ComboboxControl = comboboxControl.ComboboxControl;
|
|
38
40
|
exports.ComboboxInput = comboboxInput.ComboboxInput;
|
|
@@ -48,11 +50,8 @@ exports.ComboboxPositioner = comboboxPositioner.ComboboxPositioner;
|
|
|
48
50
|
exports.ComboboxRoot = comboboxRoot.ComboboxRoot;
|
|
49
51
|
exports.ComboboxRootProvider = comboboxRootProvider.ComboboxRootProvider;
|
|
50
52
|
exports.ComboboxTrigger = comboboxTrigger.ComboboxTrigger;
|
|
53
|
+
exports.comboboxAnatomy = combobox_anatomy.comboboxAnatomy;
|
|
51
54
|
exports.useCombobox = useCombobox.useCombobox;
|
|
52
55
|
exports.useComboboxContext = useComboboxContext.useComboboxContext;
|
|
53
56
|
exports.useComboboxItemContext = useComboboxItemContext.useComboboxItemContext;
|
|
54
|
-
exports.Combobox = combobox
|
|
55
|
-
Object.defineProperty(exports, "comboboxAnatomy", {
|
|
56
|
-
enumerable: true,
|
|
57
|
-
get: () => combobox.anatomy
|
|
58
|
-
});
|
|
57
|
+
exports.Combobox = combobox;
|
|
@@ -2,6 +2,7 @@ export type { HighlightChangeDetails as ComboboxHighlightChangeDetails, InputVal
|
|
|
2
2
|
export { createListCollection, useListCollection, type CollectionItem, type ListCollection, type UseListCollectionProps, } from '../collection';
|
|
3
3
|
export { ComboboxClearTrigger, type ComboboxClearTriggerBaseProps, type ComboboxClearTriggerProps, } from './combobox-clear-trigger';
|
|
4
4
|
export { ComboboxContent, type ComboboxContentBaseProps, type ComboboxContentProps } from './combobox-content';
|
|
5
|
+
export { ComboboxEmpty, type ComboboxEmptyBaseProps, type ComboboxEmptyProps } from './combobox-empty';
|
|
5
6
|
export { ComboboxContext, type ComboboxContextProps } from './combobox-context';
|
|
6
7
|
export { ComboboxControl, type ComboboxControlBaseProps, type ComboboxControlProps } from './combobox-control';
|
|
7
8
|
export { ComboboxInput, type ComboboxInputBaseProps, type ComboboxInputProps } from './combobox-input';
|
|
@@ -2,6 +2,7 @@ export type { HighlightChangeDetails as ComboboxHighlightChangeDetails, InputVal
|
|
|
2
2
|
export { createListCollection, useListCollection, type CollectionItem, type ListCollection, type UseListCollectionProps, } from '../collection';
|
|
3
3
|
export { ComboboxClearTrigger, type ComboboxClearTriggerBaseProps, type ComboboxClearTriggerProps, } from './combobox-clear-trigger';
|
|
4
4
|
export { ComboboxContent, type ComboboxContentBaseProps, type ComboboxContentProps } from './combobox-content';
|
|
5
|
+
export { ComboboxEmpty, type ComboboxEmptyBaseProps, type ComboboxEmptyProps } from './combobox-empty';
|
|
5
6
|
export { ComboboxContext, type ComboboxContextProps } from './combobox-context';
|
|
6
7
|
export { ComboboxControl, type ComboboxControlBaseProps, type ComboboxControlProps } from './combobox-control';
|
|
7
8
|
export { ComboboxInput, type ComboboxInputBaseProps, type ComboboxInputProps } from './combobox-input';
|
|
@@ -2,6 +2,7 @@ export { createListCollection } from '../collection/list-collection.js';
|
|
|
2
2
|
export { useListCollection } from '../collection/use-list-collection.js';
|
|
3
3
|
export { ComboboxClearTrigger } from './combobox-clear-trigger.js';
|
|
4
4
|
export { ComboboxContent } from './combobox-content.js';
|
|
5
|
+
export { ComboboxEmpty } from './combobox-empty.js';
|
|
5
6
|
export { ComboboxContext } from './combobox-context.js';
|
|
6
7
|
export { ComboboxControl } from './combobox-control.js';
|
|
7
8
|
export { ComboboxInput } from './combobox-input.js';
|
|
@@ -17,9 +18,9 @@ export { ComboboxPositioner } from './combobox-positioner.js';
|
|
|
17
18
|
export { ComboboxRoot } from './combobox-root.js';
|
|
18
19
|
export { ComboboxRootProvider } from './combobox-root-provider.js';
|
|
19
20
|
export { ComboboxTrigger } from './combobox-trigger.js';
|
|
21
|
+
export { comboboxAnatomy } from './combobox.anatomy.js';
|
|
20
22
|
export { useCombobox } from './use-combobox.js';
|
|
21
23
|
export { useComboboxContext } from './use-combobox-context.js';
|
|
22
24
|
export { useComboboxItemContext } from './use-combobox-item-context.js';
|
|
23
25
|
import * as combobox from './combobox.js';
|
|
24
26
|
export { combobox as Combobox };
|
|
25
|
-
export { anatomy as comboboxAnatomy } from '@zag-js/combobox';
|
|
@@ -12,7 +12,7 @@ const useFieldsetContext = require('./use-fieldset-context.cjs');
|
|
|
12
12
|
const FieldsetLegend = react.forwardRef((props, ref) => {
|
|
13
13
|
const fieldset = useFieldsetContext.useFieldsetContext();
|
|
14
14
|
const mergedProps = react$1.mergeProps(fieldset.getLegendProps(), props);
|
|
15
|
-
return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.
|
|
15
|
+
return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref });
|
|
16
16
|
});
|
|
17
17
|
FieldsetLegend.displayName = "FieldsetLegend";
|
|
18
18
|
|
|
@@ -2,6 +2,6 @@ import { HTMLProps, PolymorphicProps } from '../factory';
|
|
|
2
2
|
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
3
3
|
export interface FieldsetLegendBaseProps extends PolymorphicProps {
|
|
4
4
|
}
|
|
5
|
-
export interface FieldsetLegendProps extends HTMLProps<'
|
|
5
|
+
export interface FieldsetLegendProps extends HTMLProps<'div'>, FieldsetLegendBaseProps {
|
|
6
6
|
}
|
|
7
|
-
export declare const FieldsetLegend: ForwardRefExoticComponent<FieldsetLegendProps & RefAttributes<
|
|
7
|
+
export declare const FieldsetLegend: ForwardRefExoticComponent<FieldsetLegendProps & RefAttributes<HTMLDivElement>>;
|
|
@@ -2,6 +2,6 @@ import { HTMLProps, PolymorphicProps } from '../factory';
|
|
|
2
2
|
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
3
3
|
export interface FieldsetLegendBaseProps extends PolymorphicProps {
|
|
4
4
|
}
|
|
5
|
-
export interface FieldsetLegendProps extends HTMLProps<'
|
|
5
|
+
export interface FieldsetLegendProps extends HTMLProps<'div'>, FieldsetLegendBaseProps {
|
|
6
6
|
}
|
|
7
|
-
export declare const FieldsetLegend: ForwardRefExoticComponent<FieldsetLegendProps & RefAttributes<
|
|
7
|
+
export declare const FieldsetLegend: ForwardRefExoticComponent<FieldsetLegendProps & RefAttributes<HTMLDivElement>>;
|
|
@@ -8,7 +8,7 @@ import { useFieldsetContext } from './use-fieldset-context.js';
|
|
|
8
8
|
const FieldsetLegend = forwardRef((props, ref) => {
|
|
9
9
|
const fieldset = useFieldsetContext();
|
|
10
10
|
const mergedProps = mergeProps(fieldset.getLegendProps(), props);
|
|
11
|
-
return /* @__PURE__ */ jsx(ark.
|
|
11
|
+
return /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref });
|
|
12
12
|
});
|
|
13
13
|
FieldsetLegend.displayName = "FieldsetLegend";
|
|
14
14
|
|
|
@@ -17,6 +17,7 @@ const useFieldset = (props = {}) => {
|
|
|
17
17
|
const uid = react.useId();
|
|
18
18
|
const id = props.id ?? uid;
|
|
19
19
|
const rootRef = react.useRef(null);
|
|
20
|
+
const legendId = `fieldset::${id}::legend`;
|
|
20
21
|
const errorTextId = `fieldset::${id}::error-text`;
|
|
21
22
|
const helperTextId = `fieldset::${id}::helper-text`;
|
|
22
23
|
useSafeLayoutEffect.useSafeLayoutEffect(() => {
|
|
@@ -46,17 +47,19 @@ const useFieldset = (props = {}) => {
|
|
|
46
47
|
disabled,
|
|
47
48
|
"data-disabled": domQuery.dataAttr(disabled),
|
|
48
49
|
"data-invalid": domQuery.dataAttr(invalid),
|
|
50
|
+
"aria-labelledby": legendId,
|
|
49
51
|
"aria-describedby": labelIds
|
|
50
52
|
}),
|
|
51
|
-
[disabled, invalid, labelIds]
|
|
53
|
+
[disabled, invalid, legendId, labelIds]
|
|
52
54
|
);
|
|
53
55
|
const getLegendProps = react.useMemo(
|
|
54
56
|
() => () => ({
|
|
57
|
+
id: legendId,
|
|
55
58
|
...fieldset_anatomy.parts.legend.attrs,
|
|
56
59
|
"data-disabled": domQuery.dataAttr(disabled),
|
|
57
60
|
"data-invalid": domQuery.dataAttr(invalid)
|
|
58
61
|
}),
|
|
59
|
-
[disabled, invalid]
|
|
62
|
+
[legendId, disabled, invalid]
|
|
60
63
|
);
|
|
61
64
|
const getHelperTextProps = react.useMemo(
|
|
62
65
|
() => () => ({
|
|
@@ -13,6 +13,7 @@ const useFieldset = (props = {}) => {
|
|
|
13
13
|
const uid = useId();
|
|
14
14
|
const id = props.id ?? uid;
|
|
15
15
|
const rootRef = useRef(null);
|
|
16
|
+
const legendId = `fieldset::${id}::legend`;
|
|
16
17
|
const errorTextId = `fieldset::${id}::error-text`;
|
|
17
18
|
const helperTextId = `fieldset::${id}::helper-text`;
|
|
18
19
|
useSafeLayoutEffect(() => {
|
|
@@ -42,17 +43,19 @@ const useFieldset = (props = {}) => {
|
|
|
42
43
|
disabled,
|
|
43
44
|
"data-disabled": dataAttr(disabled),
|
|
44
45
|
"data-invalid": dataAttr(invalid),
|
|
46
|
+
"aria-labelledby": legendId,
|
|
45
47
|
"aria-describedby": labelIds
|
|
46
48
|
}),
|
|
47
|
-
[disabled, invalid, labelIds]
|
|
49
|
+
[disabled, invalid, legendId, labelIds]
|
|
48
50
|
);
|
|
49
51
|
const getLegendProps = useMemo(
|
|
50
52
|
() => () => ({
|
|
53
|
+
id: legendId,
|
|
51
54
|
...parts.legend.attrs,
|
|
52
55
|
"data-disabled": dataAttr(disabled),
|
|
53
56
|
"data-invalid": dataAttr(invalid)
|
|
54
57
|
}),
|
|
55
|
-
[disabled, invalid]
|
|
58
|
+
[legendId, disabled, invalid]
|
|
56
59
|
);
|
|
57
60
|
const getHelperTextProps = useMemo(
|
|
58
61
|
() => () => ({
|
|
@@ -125,6 +125,7 @@ const treeCollection = require('./collection/tree-collection.cjs');
|
|
|
125
125
|
const useListCollection = require('./collection/use-list-collection.cjs');
|
|
126
126
|
const comboboxClearTrigger = require('./combobox/combobox-clear-trigger.cjs');
|
|
127
127
|
const comboboxContent = require('./combobox/combobox-content.cjs');
|
|
128
|
+
const comboboxEmpty = require('./combobox/combobox-empty.cjs');
|
|
128
129
|
const comboboxContext = require('./combobox/combobox-context.cjs');
|
|
129
130
|
const comboboxControl = require('./combobox/combobox-control.cjs');
|
|
130
131
|
const comboboxInput = require('./combobox/combobox-input.cjs');
|
|
@@ -140,10 +141,11 @@ const comboboxPositioner = require('./combobox/combobox-positioner.cjs');
|
|
|
140
141
|
const comboboxRoot = require('./combobox/combobox-root.cjs');
|
|
141
142
|
const comboboxRootProvider = require('./combobox/combobox-root-provider.cjs');
|
|
142
143
|
const comboboxTrigger = require('./combobox/combobox-trigger.cjs');
|
|
144
|
+
const combobox_anatomy = require('./combobox/combobox.anatomy.cjs');
|
|
143
145
|
const useCombobox = require('./combobox/use-combobox.cjs');
|
|
144
146
|
const useComboboxContext = require('./combobox/use-combobox-context.cjs');
|
|
145
147
|
const useComboboxItemContext = require('./combobox/use-combobox-item-context.cjs');
|
|
146
|
-
const combobox
|
|
148
|
+
const combobox = require('./combobox/combobox.cjs');
|
|
147
149
|
const datePicker = require('@zag-js/date-picker');
|
|
148
150
|
const datePickerClearTrigger = require('./date-picker/date-picker-clear-trigger.cjs');
|
|
149
151
|
const datePickerContent = require('./date-picker/date-picker-content.cjs');
|
|
@@ -289,6 +291,7 @@ const useJsonTreeView = require('./json-tree-view/use-json-tree-view.cjs');
|
|
|
289
291
|
const jsonTreeView = require('./json-tree-view/json-tree-view.cjs');
|
|
290
292
|
const listboxContent = require('./listbox/listbox-content.cjs');
|
|
291
293
|
const listboxContext = require('./listbox/listbox-context.cjs');
|
|
294
|
+
const listboxEmpty = require('./listbox/listbox-empty.cjs');
|
|
292
295
|
const listboxInput = require('./listbox/listbox-input.cjs');
|
|
293
296
|
const listboxItem = require('./listbox/listbox-item.cjs');
|
|
294
297
|
const listboxItemContext = require('./listbox/listbox-item-context.cjs');
|
|
@@ -300,10 +303,11 @@ const listboxLabel = require('./listbox/listbox-label.cjs');
|
|
|
300
303
|
const listboxRoot = require('./listbox/listbox-root.cjs');
|
|
301
304
|
const listboxRootProvider = require('./listbox/listbox-root-provider.cjs');
|
|
302
305
|
const listboxValueText = require('./listbox/listbox-value-text.cjs');
|
|
306
|
+
const listbox_anatomy = require('./listbox/listbox.anatomy.cjs');
|
|
303
307
|
const useListbox = require('./listbox/use-listbox.cjs');
|
|
304
308
|
const useListboxContext = require('./listbox/use-listbox-context.cjs');
|
|
305
309
|
const useListboxItemContext = require('./listbox/use-listbox-item-context.cjs');
|
|
306
|
-
const listbox
|
|
310
|
+
const listbox = require('./listbox/listbox.cjs');
|
|
307
311
|
const menuArrow = require('./menu/menu-arrow.cjs');
|
|
308
312
|
const menuArrowTip = require('./menu/menu-arrow-tip.cjs');
|
|
309
313
|
const menuCheckboxItem = require('./menu/menu-checkbox-item.cjs');
|
|
@@ -696,13 +700,11 @@ const avatar = require('@zag-js/avatar');
|
|
|
696
700
|
const carousel = require('@zag-js/carousel');
|
|
697
701
|
const clipboard = require('@zag-js/clipboard');
|
|
698
702
|
const collapsible = require('@zag-js/collapsible');
|
|
699
|
-
const combobox = require('@zag-js/combobox');
|
|
700
703
|
const dialog = require('@zag-js/dialog');
|
|
701
704
|
const editable = require('@zag-js/editable');
|
|
702
705
|
const fileUpload = require('@zag-js/file-upload');
|
|
703
706
|
const floatingPanel = require('@zag-js/floating-panel');
|
|
704
707
|
const hoverCard = require('@zag-js/hover-card');
|
|
705
|
-
const listbox = require('@zag-js/listbox');
|
|
706
708
|
const menu = require('@zag-js/menu');
|
|
707
709
|
const numberInput = require('@zag-js/number-input');
|
|
708
710
|
const pagination = require('@zag-js/pagination');
|
|
@@ -858,6 +860,7 @@ exports.createTreeCollection = treeCollection.createTreeCollection;
|
|
|
858
860
|
exports.useListCollection = useListCollection.useListCollection;
|
|
859
861
|
exports.ComboboxClearTrigger = comboboxClearTrigger.ComboboxClearTrigger;
|
|
860
862
|
exports.ComboboxContent = comboboxContent.ComboboxContent;
|
|
863
|
+
exports.ComboboxEmpty = comboboxEmpty.ComboboxEmpty;
|
|
861
864
|
exports.ComboboxContext = comboboxContext.ComboboxContext;
|
|
862
865
|
exports.ComboboxControl = comboboxControl.ComboboxControl;
|
|
863
866
|
exports.ComboboxInput = comboboxInput.ComboboxInput;
|
|
@@ -873,10 +876,11 @@ exports.ComboboxPositioner = comboboxPositioner.ComboboxPositioner;
|
|
|
873
876
|
exports.ComboboxRoot = comboboxRoot.ComboboxRoot;
|
|
874
877
|
exports.ComboboxRootProvider = comboboxRootProvider.ComboboxRootProvider;
|
|
875
878
|
exports.ComboboxTrigger = comboboxTrigger.ComboboxTrigger;
|
|
879
|
+
exports.comboboxAnatomy = combobox_anatomy.comboboxAnatomy;
|
|
876
880
|
exports.useCombobox = useCombobox.useCombobox;
|
|
877
881
|
exports.useComboboxContext = useComboboxContext.useComboboxContext;
|
|
878
882
|
exports.useComboboxItemContext = useComboboxItemContext.useComboboxItemContext;
|
|
879
|
-
exports.Combobox = combobox
|
|
883
|
+
exports.Combobox = combobox;
|
|
880
884
|
Object.defineProperty(exports, "parseDate", {
|
|
881
885
|
enumerable: true,
|
|
882
886
|
get: () => datePicker.parse
|
|
@@ -1026,6 +1030,7 @@ exports.useJsonTreeView = useJsonTreeView.useJsonTreeView;
|
|
|
1026
1030
|
exports.JsonTreeView = jsonTreeView;
|
|
1027
1031
|
exports.ListboxContent = listboxContent.ListboxContent;
|
|
1028
1032
|
exports.ListboxContext = listboxContext.ListboxContext;
|
|
1033
|
+
exports.ListboxEmpty = listboxEmpty.ListboxEmpty;
|
|
1029
1034
|
exports.ListboxInput = listboxInput.ListboxInput;
|
|
1030
1035
|
exports.ListboxItem = listboxItem.ListboxItem;
|
|
1031
1036
|
exports.ListboxItemContext = listboxItemContext.ListboxItemContext;
|
|
@@ -1037,10 +1042,11 @@ exports.ListboxLabel = listboxLabel.ListboxLabel;
|
|
|
1037
1042
|
exports.ListboxRoot = listboxRoot.ListboxRoot;
|
|
1038
1043
|
exports.ListboxRootProvider = listboxRootProvider.ListboxRootProvider;
|
|
1039
1044
|
exports.ListboxValueText = listboxValueText.ListboxValueText;
|
|
1045
|
+
exports.listboxAnatomy = listbox_anatomy.listboxAnatomy;
|
|
1040
1046
|
exports.useListbox = useListbox.useListbox;
|
|
1041
1047
|
exports.useListboxContext = useListboxContext.useListboxContext;
|
|
1042
1048
|
exports.useListboxItemContext = useListboxItemContext.useListboxItemContext;
|
|
1043
|
-
exports.Listbox = listbox
|
|
1049
|
+
exports.Listbox = listbox;
|
|
1044
1050
|
exports.MenuArrow = menuArrow.MenuArrow;
|
|
1045
1051
|
exports.MenuArrowTip = menuArrowTip.MenuArrowTip;
|
|
1046
1052
|
exports.MenuCheckboxItem = menuCheckboxItem.MenuCheckboxItem;
|
|
@@ -1455,10 +1461,6 @@ Object.defineProperty(exports, "collapsibleAnatomy", {
|
|
|
1455
1461
|
enumerable: true,
|
|
1456
1462
|
get: () => collapsible.anatomy
|
|
1457
1463
|
});
|
|
1458
|
-
Object.defineProperty(exports, "comboboxAnatomy", {
|
|
1459
|
-
enumerable: true,
|
|
1460
|
-
get: () => combobox.anatomy
|
|
1461
|
-
});
|
|
1462
1464
|
Object.defineProperty(exports, "dialogAnatomy", {
|
|
1463
1465
|
enumerable: true,
|
|
1464
1466
|
get: () => dialog.anatomy
|
|
@@ -1479,10 +1481,6 @@ Object.defineProperty(exports, "hoverCardAnatomy", {
|
|
|
1479
1481
|
enumerable: true,
|
|
1480
1482
|
get: () => hoverCard.anatomy
|
|
1481
1483
|
});
|
|
1482
|
-
Object.defineProperty(exports, "listboxAnatomy", {
|
|
1483
|
-
enumerable: true,
|
|
1484
|
-
get: () => listbox.anatomy
|
|
1485
|
-
});
|
|
1486
1484
|
Object.defineProperty(exports, "menuAnatomy", {
|
|
1487
1485
|
enumerable: true,
|
|
1488
1486
|
get: () => menu.anatomy
|