@ark-ui/vue 5.15.0 → 5.15.2

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.
Files changed (29) hide show
  1. package/dist/components/index.cjs +9 -4
  2. package/dist/components/index.js +2 -1
  3. package/dist/components/listbox/index.cjs +2 -0
  4. package/dist/components/listbox/index.d.cts +1 -0
  5. package/dist/components/listbox/index.d.ts +1 -0
  6. package/dist/components/listbox/index.js +1 -0
  7. package/dist/components/listbox/listbox-item-context.vue.cjs +18 -0
  8. package/dist/components/listbox/listbox-item-context.vue.d.cts +17 -0
  9. package/dist/components/listbox/listbox-item-context.vue.d.ts +17 -0
  10. package/dist/components/listbox/listbox-item-context.vue.js +14 -0
  11. package/dist/components/listbox/listbox-item-context.vue2.cjs +9 -0
  12. package/dist/components/listbox/listbox-item-context.vue2.js +5 -0
  13. package/dist/components/listbox/listbox.cjs +2 -0
  14. package/dist/components/listbox/listbox.d.cts +1 -0
  15. package/dist/components/listbox/listbox.d.ts +1 -0
  16. package/dist/components/listbox/listbox.js +1 -0
  17. package/dist/components/password-input/index.cjs +7 -4
  18. package/dist/components/password-input/index.js +1 -1
  19. package/dist/components/password-input/use-password-input.cjs +22 -3
  20. package/dist/components/password-input/use-password-input.js +3 -3
  21. package/dist/components/tree-view/tree-view-root.vue.d.cts +4 -4
  22. package/dist/components/tree-view/tree-view-root.vue.d.ts +4 -4
  23. package/dist/index.cjs +9 -4
  24. package/dist/index.js +2 -1
  25. package/package.json +58 -55
  26. package/dist/node_modules/@zag-js/core/dist/index.cjs +0 -12
  27. package/dist/node_modules/@zag-js/core/dist/index.js +0 -8
  28. package/dist/node_modules/@zag-js/password-input/dist/index.cjs +0 -243
  29. package/dist/node_modules/@zag-js/password-input/dist/index.js +0 -236
@@ -285,6 +285,7 @@ const listboxContext_vue_vue_type_script_setup_true_lang = require('./listbox/li
285
285
  const listboxContent_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-content.vue.cjs');
286
286
  const listboxInput_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-input.vue.cjs');
287
287
  const listboxItem_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-item.vue.cjs');
288
+ const listboxItemContext_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-item-context.vue.cjs');
288
289
  const listboxItemGroup_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-item-group.vue.cjs');
289
290
  const listboxItemGroupLabel_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-item-group-label.vue.cjs');
290
291
  const listboxItemIndicator_vue_vue_type_script_setup_true_lang = require('./listbox/listbox-item-indicator.vue.cjs');
@@ -355,7 +356,7 @@ const passwordInputRootProvider_vue_vue_type_script_setup_true_lang = require('.
355
356
  const passwordInputVisibilityTrigger_vue_vue_type_script_setup_true_lang = require('./password-input/password-input-visibility-trigger.vue.cjs');
356
357
  const usePasswordInput = require('./password-input/use-password-input.cjs');
357
358
  const usePasswordInputContext = require('./password-input/use-password-input-context.cjs');
358
- const passwordInput = require('./password-input/password-input.cjs');
359
+ const passwordInput$1 = require('./password-input/password-input.cjs');
359
360
  const pinInputContext_vue_vue_type_script_setup_true_lang = require('./pin-input/pin-input-context.vue.cjs');
360
361
  const pinInputControl_vue_vue_type_script_setup_true_lang = require('./pin-input/pin-input-control.vue.cjs');
361
362
  const pinInputHiddenInput_vue_vue_type_script_setup_true_lang = require('./pin-input/pin-input-hidden-input.vue.cjs');
@@ -686,7 +687,7 @@ const listbox = require('@zag-js/listbox');
686
687
  const menu = require('@zag-js/menu');
687
688
  const numberInput = require('@zag-js/number-input');
688
689
  const pagination = require('@zag-js/pagination');
689
- const index = require('../node_modules/@zag-js/password-input/dist/index.cjs');
690
+ const passwordInput = require('@zag-js/password-input');
690
691
  const pinInput = require('@zag-js/pin-input');
691
692
  const popover = require('@zag-js/popover');
692
693
  const progress = require('@zag-js/progress');
@@ -1001,6 +1002,7 @@ exports.ListboxContext = listboxContext_vue_vue_type_script_setup_true_lang.defa
1001
1002
  exports.ListboxContent = listboxContent_vue_vue_type_script_setup_true_lang.default;
1002
1003
  exports.ListboxInput = listboxInput_vue_vue_type_script_setup_true_lang.default;
1003
1004
  exports.ListboxItem = listboxItem_vue_vue_type_script_setup_true_lang.default;
1005
+ exports.ListboxItemContext = listboxItemContext_vue_vue_type_script_setup_true_lang.default;
1004
1006
  exports.ListboxItemGroup = listboxItemGroup_vue_vue_type_script_setup_true_lang.default;
1005
1007
  exports.ListboxItemGroupLabel = listboxItemGroupLabel_vue_vue_type_script_setup_true_lang.default;
1006
1008
  exports.ListboxItemIndicator = listboxItemIndicator_vue_vue_type_script_setup_true_lang.default;
@@ -1071,7 +1073,7 @@ exports.PasswordInputRootProvider = passwordInputRootProvider_vue_vue_type_scrip
1071
1073
  exports.PasswordInputVisibilityTrigger = passwordInputVisibilityTrigger_vue_vue_type_script_setup_true_lang.default;
1072
1074
  exports.usePasswordInput = usePasswordInput.usePasswordInput;
1073
1075
  exports.usePasswordInputContext = usePasswordInputContext.usePasswordInputContext;
1074
- exports.PasswordInput = passwordInput;
1076
+ exports.PasswordInput = passwordInput$1;
1075
1077
  exports.PinInputContext = pinInputContext_vue_vue_type_script_setup_true_lang.default;
1076
1078
  exports.PinInputControl = pinInputControl_vue_vue_type_script_setup_true_lang.default;
1077
1079
  exports.PinInputHiddenInput = pinInputHiddenInput_vue_vue_type_script_setup_true_lang.default;
@@ -1454,7 +1456,10 @@ Object.defineProperty(exports, "paginationAnatomy", {
1454
1456
  enumerable: true,
1455
1457
  get: () => pagination.anatomy
1456
1458
  });
1457
- exports.passwordInputAnatomy = index.anatomy;
1459
+ Object.defineProperty(exports, "passwordInputAnatomy", {
1460
+ enumerable: true,
1461
+ get: () => passwordInput.anatomy
1462
+ });
1458
1463
  Object.defineProperty(exports, "pinInputAnatomy", {
1459
1464
  enumerable: true,
1460
1465
  get: () => pinInput.anatomy
@@ -299,6 +299,7 @@ export { default as ListboxContext } from './listbox/listbox-context.vue.js';
299
299
  export { default as ListboxContent } from './listbox/listbox-content.vue.js';
300
300
  export { default as ListboxInput } from './listbox/listbox-input.vue.js';
301
301
  export { default as ListboxItem } from './listbox/listbox-item.vue.js';
302
+ export { default as ListboxItemContext } from './listbox/listbox-item-context.vue.js';
302
303
  export { default as ListboxItemGroup } from './listbox/listbox-item-group.vue.js';
303
304
  export { default as ListboxItemGroupLabel } from './listbox/listbox-item-group-label.vue.js';
304
305
  export { default as ListboxItemIndicator } from './listbox/listbox-item-indicator.vue.js';
@@ -728,7 +729,7 @@ export { anatomy as listboxAnatomy } from '@zag-js/listbox';
728
729
  export { anatomy as menuAnatomy } from '@zag-js/menu';
729
730
  export { anatomy as numberInputAnatomy } from '@zag-js/number-input';
730
731
  export { anatomy as paginationAnatomy } from '@zag-js/pagination';
731
- export { anatomy as passwordInputAnatomy } from '../node_modules/@zag-js/password-input/dist/index.js';
732
+ export { anatomy as passwordInputAnatomy } from '@zag-js/password-input';
732
733
  export { anatomy as pinInputAnatomy } from '@zag-js/pin-input';
733
734
  export { anatomy as popoverAnatomy } from '@zag-js/popover';
734
735
  export { anatomy as progressAnatomy } from '@zag-js/progress';
@@ -7,6 +7,7 @@ const listboxContext_vue_vue_type_script_setup_true_lang = require('./listbox-co
7
7
  const listboxContent_vue_vue_type_script_setup_true_lang = require('./listbox-content.vue.cjs');
8
8
  const listboxInput_vue_vue_type_script_setup_true_lang = require('./listbox-input.vue.cjs');
9
9
  const listboxItem_vue_vue_type_script_setup_true_lang = require('./listbox-item.vue.cjs');
10
+ const listboxItemContext_vue_vue_type_script_setup_true_lang = require('./listbox-item-context.vue.cjs');
10
11
  const listboxItemGroup_vue_vue_type_script_setup_true_lang = require('./listbox-item-group.vue.cjs');
11
12
  const listboxItemGroupLabel_vue_vue_type_script_setup_true_lang = require('./listbox-item-group-label.vue.cjs');
12
13
  const listboxItemIndicator_vue_vue_type_script_setup_true_lang = require('./listbox-item-indicator.vue.cjs');
@@ -28,6 +29,7 @@ exports.ListboxContext = listboxContext_vue_vue_type_script_setup_true_lang.defa
28
29
  exports.ListboxContent = listboxContent_vue_vue_type_script_setup_true_lang.default;
29
30
  exports.ListboxInput = listboxInput_vue_vue_type_script_setup_true_lang.default;
30
31
  exports.ListboxItem = listboxItem_vue_vue_type_script_setup_true_lang.default;
32
+ exports.ListboxItemContext = listboxItemContext_vue_vue_type_script_setup_true_lang.default;
31
33
  exports.ListboxItemGroup = listboxItemGroup_vue_vue_type_script_setup_true_lang.default;
32
34
  exports.ListboxItemGroupLabel = listboxItemGroupLabel_vue_vue_type_script_setup_true_lang.default;
33
35
  exports.ListboxItemIndicator = listboxItemIndicator_vue_vue_type_script_setup_true_lang.default;
@@ -4,6 +4,7 @@ export { default as ListboxContext, type ListboxContextProps } from './listbox-c
4
4
  export { default as ListboxContent, type ListboxContentBaseProps, type ListboxContentProps, } from './listbox-content.vue';
5
5
  export { default as ListboxInput, type ListboxInputBaseProps, type ListboxInputProps } from './listbox-input.vue';
6
6
  export { default as ListboxItem, type ListboxItemBaseProps, type ListboxItemProps } from './listbox-item.vue';
7
+ export { default as ListboxItemContext, type ListboxItemContextProps } from './listbox-item-context.vue';
7
8
  export { default as ListboxItemGroup, type ListboxItemGroupBaseProps, type ListboxItemGroupProps, } from './listbox-item-group.vue';
8
9
  export { default as ListboxItemGroupLabel, type ListboxItemGroupLabelBaseProps, type ListboxItemGroupLabelProps, } from './listbox-item-group-label.vue';
9
10
  export { default as ListboxItemIndicator, type ListboxItemIndicatorBaseProps, type ListboxItemIndicatorProps, } from './listbox-item-indicator.vue';
@@ -4,6 +4,7 @@ export { default as ListboxContext, type ListboxContextProps } from './listbox-c
4
4
  export { default as ListboxContent, type ListboxContentBaseProps, type ListboxContentProps, } from './listbox-content.vue';
5
5
  export { default as ListboxInput, type ListboxInputBaseProps, type ListboxInputProps } from './listbox-input.vue';
6
6
  export { default as ListboxItem, type ListboxItemBaseProps, type ListboxItemProps } from './listbox-item.vue';
7
+ export { default as ListboxItemContext, type ListboxItemContextProps } from './listbox-item-context.vue';
7
8
  export { default as ListboxItemGroup, type ListboxItemGroupBaseProps, type ListboxItemGroupProps, } from './listbox-item-group.vue';
8
9
  export { default as ListboxItemGroupLabel, type ListboxItemGroupLabelBaseProps, type ListboxItemGroupLabelProps, } from './listbox-item-group-label.vue';
9
10
  export { default as ListboxItemIndicator, type ListboxItemIndicatorBaseProps, type ListboxItemIndicatorProps, } from './listbox-item-indicator.vue';
@@ -3,6 +3,7 @@ export { default as ListboxContext } from './listbox-context.vue.js';
3
3
  export { default as ListboxContent } from './listbox-content.vue.js';
4
4
  export { default as ListboxInput } from './listbox-input.vue.js';
5
5
  export { default as ListboxItem } from './listbox-item.vue.js';
6
+ export { default as ListboxItemContext } from './listbox-item-context.vue.js';
6
7
  export { default as ListboxItemGroup } from './listbox-item-group.vue.js';
7
8
  export { default as ListboxItemGroupLabel } from './listbox-item-group-label.vue.js';
8
9
  export { default as ListboxItemIndicator } from './listbox-item-indicator.vue.js';
@@ -0,0 +1,18 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
4
+
5
+ const vue = require('vue');
6
+ const useListboxItemContext = require('./use-listbox-item-context.cjs');
7
+
8
+ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
9
+ __name: "listbox-item-context",
10
+ setup(__props) {
11
+ const context = useListboxItemContext.useListboxItemContext();
12
+ return (_ctx, _cache) => {
13
+ return vue.renderSlot(_ctx.$slots, "default", vue.normalizeProps(vue.guardReactiveProps(vue.unref(context))));
14
+ };
15
+ }
16
+ });
17
+
18
+ exports.default = _sfc_main;
@@ -0,0 +1,17 @@
1
+ import { SlotsType, UnwrapRef, DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
2
+ import { UseListboxItemContext } from './use-listbox-item-context';
3
+ export interface ListboxItemContextProps extends SlotsType<{
4
+ default: UnwrapRef<UseListboxItemContext>;
5
+ }> {
6
+ }
7
+ declare const _default: __VLS_WithTemplateSlots< DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, Readonly<{
8
+ default(context: UnwrapRef<UseListboxItemContext>): unknown;
9
+ }> & {
10
+ default(context: UnwrapRef<UseListboxItemContext>): unknown;
11
+ }>;
12
+ export default _default;
13
+ type __VLS_WithTemplateSlots<T, S> = T & {
14
+ new (): {
15
+ $slots: S;
16
+ };
17
+ };
@@ -0,0 +1,17 @@
1
+ import { SlotsType, UnwrapRef, DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
2
+ import { UseListboxItemContext } from './use-listbox-item-context';
3
+ export interface ListboxItemContextProps extends SlotsType<{
4
+ default: UnwrapRef<UseListboxItemContext>;
5
+ }> {
6
+ }
7
+ declare const _default: __VLS_WithTemplateSlots< DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>, Readonly<{
8
+ default(context: UnwrapRef<UseListboxItemContext>): unknown;
9
+ }> & {
10
+ default(context: UnwrapRef<UseListboxItemContext>): unknown;
11
+ }>;
12
+ export default _default;
13
+ type __VLS_WithTemplateSlots<T, S> = T & {
14
+ new (): {
15
+ $slots: S;
16
+ };
17
+ };
@@ -0,0 +1,14 @@
1
+ import { defineComponent, renderSlot, normalizeProps, guardReactiveProps, unref } from 'vue';
2
+ import { useListboxItemContext } from './use-listbox-item-context.js';
3
+
4
+ const _sfc_main = /* @__PURE__ */ defineComponent({
5
+ __name: "listbox-item-context",
6
+ setup(__props) {
7
+ const context = useListboxItemContext();
8
+ return (_ctx, _cache) => {
9
+ return renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(context))));
10
+ };
11
+ }
12
+ });
13
+
14
+ export { _sfc_main as default };
@@ -0,0 +1,9 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
4
+
5
+ const listboxItemContext_vue_vue_type_script_setup_true_lang = require('./listbox-item-context.vue.cjs');
6
+
7
+
8
+
9
+ exports.default = listboxItemContext_vue_vue_type_script_setup_true_lang.default;
@@ -0,0 +1,5 @@
1
+ import _sfc_main from './listbox-item-context.vue.js';
2
+
3
+
4
+
5
+ export { _sfc_main as default };
@@ -5,6 +5,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
5
5
  const listboxContext_vue_vue_type_script_setup_true_lang = require('./listbox-context.vue.cjs');
6
6
  const listboxContent_vue_vue_type_script_setup_true_lang = require('./listbox-content.vue.cjs');
7
7
  const listboxInput_vue_vue_type_script_setup_true_lang = require('./listbox-input.vue.cjs');
8
+ const listboxItemContext_vue_vue_type_script_setup_true_lang = require('./listbox-item-context.vue.cjs');
8
9
  const listboxItemGroupLabel_vue_vue_type_script_setup_true_lang = require('./listbox-item-group-label.vue.cjs');
9
10
  const listboxItemGroup_vue_vue_type_script_setup_true_lang = require('./listbox-item-group.vue.cjs');
10
11
  const listboxItemIndicator_vue_vue_type_script_setup_true_lang = require('./listbox-item-indicator.vue.cjs');
@@ -20,6 +21,7 @@ const listboxValueText_vue_vue_type_script_setup_true_lang = require('./listbox-
20
21
  exports.Context = listboxContext_vue_vue_type_script_setup_true_lang.default;
21
22
  exports.Content = listboxContent_vue_vue_type_script_setup_true_lang.default;
22
23
  exports.Input = listboxInput_vue_vue_type_script_setup_true_lang.default;
24
+ exports.ItemContext = listboxItemContext_vue_vue_type_script_setup_true_lang.default;
23
25
  exports.ItemGroupLabel = listboxItemGroupLabel_vue_vue_type_script_setup_true_lang.default;
24
26
  exports.ItemGroup = listboxItemGroup_vue_vue_type_script_setup_true_lang.default;
25
27
  exports.ItemIndicator = listboxItemIndicator_vue_vue_type_script_setup_true_lang.default;
@@ -2,6 +2,7 @@ export type { HighlightChangeDetails, ScrollToIndexDetails, SelectionDetails, Se
2
2
  export { default as Context, type ListboxContextProps as ContextProps } from './listbox-context.vue';
3
3
  export { default as Content, type ListboxContentBaseProps as ContentBaseProps, type ListboxContentProps as ContentProps, } from './listbox-content.vue';
4
4
  export { default as Input, type ListboxInputBaseProps as InputBaseProps, type ListboxInputProps as InputProps, } from './listbox-input.vue';
5
+ export { default as ItemContext, type ListboxItemContextProps as ItemContextProps } from './listbox-item-context.vue';
5
6
  export { default as ItemGroupLabel, type ListboxItemGroupLabelBaseProps as ItemGroupLabelBaseProps, type ListboxItemGroupLabelProps as ItemGroupLabelProps, } from './listbox-item-group-label.vue';
6
7
  export { default as ItemGroup, type ListboxItemGroupBaseProps as ItemGroupBaseProps, type ListboxItemGroupProps as ItemGroupProps, } from './listbox-item-group.vue';
7
8
  export { default as ItemIndicator, type ListboxItemIndicatorBaseProps as ItemIndicatorBaseProps, type ListboxItemIndicatorProps as ItemIndicatorProps, } from './listbox-item-indicator.vue';
@@ -2,6 +2,7 @@ export type { HighlightChangeDetails, ScrollToIndexDetails, SelectionDetails, Se
2
2
  export { default as Context, type ListboxContextProps as ContextProps } from './listbox-context.vue';
3
3
  export { default as Content, type ListboxContentBaseProps as ContentBaseProps, type ListboxContentProps as ContentProps, } from './listbox-content.vue';
4
4
  export { default as Input, type ListboxInputBaseProps as InputBaseProps, type ListboxInputProps as InputProps, } from './listbox-input.vue';
5
+ export { default as ItemContext, type ListboxItemContextProps as ItemContextProps } from './listbox-item-context.vue';
5
6
  export { default as ItemGroupLabel, type ListboxItemGroupLabelBaseProps as ItemGroupLabelBaseProps, type ListboxItemGroupLabelProps as ItemGroupLabelProps, } from './listbox-item-group-label.vue';
6
7
  export { default as ItemGroup, type ListboxItemGroupBaseProps as ItemGroupBaseProps, type ListboxItemGroupProps as ItemGroupProps, } from './listbox-item-group.vue';
7
8
  export { default as ItemIndicator, type ListboxItemIndicatorBaseProps as ItemIndicatorBaseProps, type ListboxItemIndicatorProps as ItemIndicatorProps, } from './listbox-item-indicator.vue';
@@ -1,6 +1,7 @@
1
1
  export { default as Context } from './listbox-context.vue.js';
2
2
  export { default as Content } from './listbox-content.vue.js';
3
3
  export { default as Input } from './listbox-input.vue.js';
4
+ export { default as ItemContext } from './listbox-item-context.vue.js';
4
5
  export { default as ItemGroupLabel } from './listbox-item-group-label.vue.js';
5
6
  export { default as ItemGroup } from './listbox-item-group.vue.js';
6
7
  export { default as ItemIndicator } from './listbox-item-indicator.vue.js';
@@ -12,8 +12,8 @@ const passwordInputRootProvider_vue_vue_type_script_setup_true_lang = require('.
12
12
  const passwordInputVisibilityTrigger_vue_vue_type_script_setup_true_lang = require('./password-input-visibility-trigger.vue.cjs');
13
13
  const usePasswordInput = require('./use-password-input.cjs');
14
14
  const usePasswordInputContext = require('./use-password-input-context.cjs');
15
- const passwordInput = require('./password-input.cjs');
16
- const index = require('../../node_modules/@zag-js/password-input/dist/index.cjs');
15
+ const passwordInput$1 = require('./password-input.cjs');
16
+ const passwordInput = require('@zag-js/password-input');
17
17
 
18
18
 
19
19
 
@@ -27,5 +27,8 @@ exports.PasswordInputRootProvider = passwordInputRootProvider_vue_vue_type_scrip
27
27
  exports.PasswordInputVisibilityTrigger = passwordInputVisibilityTrigger_vue_vue_type_script_setup_true_lang.default;
28
28
  exports.usePasswordInput = usePasswordInput.usePasswordInput;
29
29
  exports.usePasswordInputContext = usePasswordInputContext.usePasswordInputContext;
30
- exports.PasswordInput = passwordInput;
31
- exports.passwordInputAnatomy = index.anatomy;
30
+ exports.PasswordInput = passwordInput$1;
31
+ Object.defineProperty(exports, "passwordInputAnatomy", {
32
+ enumerable: true,
33
+ get: () => passwordInput.anatomy
34
+ });
@@ -10,4 +10,4 @@ export { usePasswordInput } from './use-password-input.js';
10
10
  export { usePasswordInputContext } from './use-password-input-context.js';
11
11
  import * as passwordInput from './password-input.js';
12
12
  export { passwordInput as PasswordInput };
13
- export { anatomy as passwordInputAnatomy } from '../../node_modules/@zag-js/password-input/dist/index.js';
13
+ export { anatomy as passwordInputAnatomy } from '@zag-js/password-input';
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
4
 
5
- const index = require('../../node_modules/@zag-js/password-input/dist/index.cjs');
5
+ const passwordInput = require('@zag-js/password-input');
6
6
  const vue$1 = require('@zag-js/vue');
7
7
  const vue = require('vue');
8
8
  const useEnvironmentContext = require('../../providers/environment/use-environment-context.cjs');
@@ -10,6 +10,25 @@ const useLocaleContext = require('../../providers/locale/use-locale-context.cjs'
10
10
  const cleanProps = require('../../utils/clean-props.cjs');
11
11
  const useFieldContext = require('../field/use-field-context.cjs');
12
12
 
13
+ function _interopNamespaceDefault(e) {
14
+ const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
15
+ if (e) {
16
+ for (const k in e) {
17
+ if (k !== 'default') {
18
+ const d = Object.getOwnPropertyDescriptor(e, k);
19
+ Object.defineProperty(n, k, d.get ? d : {
20
+ enumerable: true,
21
+ get: () => e[k]
22
+ });
23
+ }
24
+ }
25
+ }
26
+ n.default = e;
27
+ return Object.freeze(n);
28
+ }
29
+
30
+ const passwordInput__namespace = /*#__PURE__*/_interopNamespaceDefault(passwordInput);
31
+
13
32
  const usePasswordInput = (props = {}, emit) => {
14
33
  const id = vue.useId();
15
34
  const env = useEnvironmentContext.useEnvironmentContext(useEnvironmentContext.DEFAULT_ENVIRONMENT);
@@ -36,8 +55,8 @@ const usePasswordInput = (props = {}, emit) => {
36
55
  }
37
56
  };
38
57
  });
39
- const service = vue$1.useMachine(index.machine, context);
40
- return vue.computed(() => index.connect(service, vue$1.normalizeProps));
58
+ const service = vue$1.useMachine(passwordInput__namespace.machine, context);
59
+ return vue.computed(() => passwordInput__namespace.connect(service, vue$1.normalizeProps));
41
60
  };
42
61
 
43
62
  exports.usePasswordInput = usePasswordInput;
@@ -1,4 +1,4 @@
1
- import { machine, connect } from '../../node_modules/@zag-js/password-input/dist/index.js';
1
+ import * as passwordInput from '@zag-js/password-input';
2
2
  import { useMachine, normalizeProps } from '@zag-js/vue';
3
3
  import { useId, computed, toValue } from 'vue';
4
4
  import { useEnvironmentContext, DEFAULT_ENVIRONMENT } from '../../providers/environment/use-environment-context.js';
@@ -32,8 +32,8 @@ const usePasswordInput = (props = {}, emit) => {
32
32
  }
33
33
  };
34
34
  });
35
- const service = useMachine(machine, context);
36
- return computed(() => connect(service, normalizeProps));
35
+ const service = useMachine(passwordInput.machine, context);
36
+ return computed(() => passwordInput.connect(service, normalizeProps));
37
37
  };
38
38
 
39
39
  export { usePasswordInput };
@@ -15,11 +15,11 @@ HTMLAttributes {
15
15
  export type { RootEmits as TreeViewRootEmits } from './tree-view.types';
16
16
  declare const _default: <T extends TreeNode>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
17
17
  props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
18
- readonly onFocusChange?: ((details: FocusChangeDetails) => any) | undefined;
18
+ readonly onFocusChange?: ((details: FocusChangeDetails<any>) => any) | undefined;
19
19
  readonly onCheckedChange?: ((details: CheckedChangeDetails) => any) | undefined;
20
20
  readonly "onUpdate:focusedValue"?: ((value: string | null) => any) | undefined;
21
- readonly onExpandedChange?: ((details: ExpandedChangeDetails) => any) | undefined;
22
- readonly onSelectionChange?: ((details: SelectionChangeDetails) => any) | undefined;
21
+ readonly onExpandedChange?: ((details: ExpandedChangeDetails<any>) => any) | undefined;
22
+ readonly onSelectionChange?: ((details: SelectionChangeDetails<any>) => any) | undefined;
23
23
  readonly onLoadChildrenComplete?: ((details: LoadChildrenCompleteDetails<T>) => any) | undefined;
24
24
  readonly onLoadChildrenError?: ((details: LoadChildrenErrorDetails<T>) => any) | undefined;
25
25
  readonly "onUpdate:expandedValue"?: ((value: string[]) => any) | undefined;
@@ -31,7 +31,7 @@ declare const _default: <T extends TreeNode>(__VLS_props: NonNullable<Awaited<ty
31
31
  slots: {
32
32
  default?(_: {}): any;
33
33
  };
34
- emit: ((evt: "focusChange", details: FocusChangeDetails) => void) & ((evt: "checkedChange", details: CheckedChangeDetails) => void) & ((evt: "update:focusedValue", value: string | null) => void) & ((evt: "expandedChange", details: ExpandedChangeDetails) => void) & ((evt: "selectionChange", details: SelectionChangeDetails) => void) & ((evt: "loadChildrenComplete", details: LoadChildrenCompleteDetails<T>) => void) & ((evt: "loadChildrenError", details: LoadChildrenErrorDetails<T>) => void) & ((evt: "update:expandedValue", value: string[]) => void) & ((evt: "update:selectedValue", value: string[]) => void) & ((evt: "update:checkedValue", value: string[]) => void);
34
+ emit: ((evt: "focusChange", details: FocusChangeDetails<any>) => void) & ((evt: "checkedChange", details: CheckedChangeDetails) => void) & ((evt: "update:focusedValue", value: string | null) => void) & ((evt: "expandedChange", details: ExpandedChangeDetails<any>) => void) & ((evt: "selectionChange", details: SelectionChangeDetails<any>) => void) & ((evt: "loadChildrenComplete", details: LoadChildrenCompleteDetails<T>) => void) & ((evt: "loadChildrenError", details: LoadChildrenErrorDetails<T>) => void) & ((evt: "update:expandedValue", value: string[]) => void) & ((evt: "update:selectedValue", value: string[]) => void) & ((evt: "update:checkedValue", value: string[]) => void);
35
35
  }>) => VNode & {
36
36
  __ctx?: Awaited<typeof __VLS_setup>;
37
37
  };
@@ -15,11 +15,11 @@ HTMLAttributes {
15
15
  export type { RootEmits as TreeViewRootEmits } from './tree-view.types';
16
16
  declare const _default: <T extends TreeNode>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
17
17
  props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
18
- readonly onFocusChange?: ((details: FocusChangeDetails) => any) | undefined;
18
+ readonly onFocusChange?: ((details: FocusChangeDetails<any>) => any) | undefined;
19
19
  readonly onCheckedChange?: ((details: CheckedChangeDetails) => any) | undefined;
20
20
  readonly "onUpdate:focusedValue"?: ((value: string | null) => any) | undefined;
21
- readonly onExpandedChange?: ((details: ExpandedChangeDetails) => any) | undefined;
22
- readonly onSelectionChange?: ((details: SelectionChangeDetails) => any) | undefined;
21
+ readonly onExpandedChange?: ((details: ExpandedChangeDetails<any>) => any) | undefined;
22
+ readonly onSelectionChange?: ((details: SelectionChangeDetails<any>) => any) | undefined;
23
23
  readonly onLoadChildrenComplete?: ((details: LoadChildrenCompleteDetails<T>) => any) | undefined;
24
24
  readonly onLoadChildrenError?: ((details: LoadChildrenErrorDetails<T>) => any) | undefined;
25
25
  readonly "onUpdate:expandedValue"?: ((value: string[]) => any) | undefined;
@@ -31,7 +31,7 @@ declare const _default: <T extends TreeNode>(__VLS_props: NonNullable<Awaited<ty
31
31
  slots: {
32
32
  default?(_: {}): any;
33
33
  };
34
- emit: ((evt: "focusChange", details: FocusChangeDetails) => void) & ((evt: "checkedChange", details: CheckedChangeDetails) => void) & ((evt: "update:focusedValue", value: string | null) => void) & ((evt: "expandedChange", details: ExpandedChangeDetails) => void) & ((evt: "selectionChange", details: SelectionChangeDetails) => void) & ((evt: "loadChildrenComplete", details: LoadChildrenCompleteDetails<T>) => void) & ((evt: "loadChildrenError", details: LoadChildrenErrorDetails<T>) => void) & ((evt: "update:expandedValue", value: string[]) => void) & ((evt: "update:selectedValue", value: string[]) => void) & ((evt: "update:checkedValue", value: string[]) => void);
34
+ emit: ((evt: "focusChange", details: FocusChangeDetails<any>) => void) & ((evt: "checkedChange", details: CheckedChangeDetails) => void) & ((evt: "update:focusedValue", value: string | null) => void) & ((evt: "expandedChange", details: ExpandedChangeDetails<any>) => void) & ((evt: "selectionChange", details: SelectionChangeDetails<any>) => void) & ((evt: "loadChildrenComplete", details: LoadChildrenCompleteDetails<T>) => void) & ((evt: "loadChildrenError", details: LoadChildrenErrorDetails<T>) => void) & ((evt: "update:expandedValue", value: string[]) => void) & ((evt: "update:selectedValue", value: string[]) => void) & ((evt: "update:checkedValue", value: string[]) => void);
35
35
  }>) => VNode & {
36
36
  __ctx?: Awaited<typeof __VLS_setup>;
37
37
  };
package/dist/index.cjs CHANGED
@@ -285,6 +285,7 @@ const listboxContext_vue_vue_type_script_setup_true_lang = require('./components
285
285
  const listboxContent_vue_vue_type_script_setup_true_lang = require('./components/listbox/listbox-content.vue.cjs');
286
286
  const listboxInput_vue_vue_type_script_setup_true_lang = require('./components/listbox/listbox-input.vue.cjs');
287
287
  const listboxItem_vue_vue_type_script_setup_true_lang = require('./components/listbox/listbox-item.vue.cjs');
288
+ const listboxItemContext_vue_vue_type_script_setup_true_lang = require('./components/listbox/listbox-item-context.vue.cjs');
288
289
  const listboxItemGroup_vue_vue_type_script_setup_true_lang = require('./components/listbox/listbox-item-group.vue.cjs');
289
290
  const listboxItemGroupLabel_vue_vue_type_script_setup_true_lang = require('./components/listbox/listbox-item-group-label.vue.cjs');
290
291
  const listboxItemIndicator_vue_vue_type_script_setup_true_lang = require('./components/listbox/listbox-item-indicator.vue.cjs');
@@ -355,7 +356,7 @@ const passwordInputRootProvider_vue_vue_type_script_setup_true_lang = require('.
355
356
  const passwordInputVisibilityTrigger_vue_vue_type_script_setup_true_lang = require('./components/password-input/password-input-visibility-trigger.vue.cjs');
356
357
  const usePasswordInput = require('./components/password-input/use-password-input.cjs');
357
358
  const usePasswordInputContext = require('./components/password-input/use-password-input-context.cjs');
358
- const passwordInput = require('./components/password-input/password-input.cjs');
359
+ const passwordInput$1 = require('./components/password-input/password-input.cjs');
359
360
  const pinInputContext_vue_vue_type_script_setup_true_lang = require('./components/pin-input/pin-input-context.vue.cjs');
360
361
  const pinInputControl_vue_vue_type_script_setup_true_lang = require('./components/pin-input/pin-input-control.vue.cjs');
361
362
  const pinInputHiddenInput_vue_vue_type_script_setup_true_lang = require('./components/pin-input/pin-input-hidden-input.vue.cjs');
@@ -695,7 +696,7 @@ const listbox = require('@zag-js/listbox');
695
696
  const menu = require('@zag-js/menu');
696
697
  const numberInput = require('@zag-js/number-input');
697
698
  const pagination = require('@zag-js/pagination');
698
- const index = require('./node_modules/@zag-js/password-input/dist/index.cjs');
699
+ const passwordInput = require('@zag-js/password-input');
699
700
  const pinInput = require('@zag-js/pin-input');
700
701
  const popover = require('@zag-js/popover');
701
702
  const progress = require('@zag-js/progress');
@@ -1010,6 +1011,7 @@ exports.ListboxContext = listboxContext_vue_vue_type_script_setup_true_lang.defa
1010
1011
  exports.ListboxContent = listboxContent_vue_vue_type_script_setup_true_lang.default;
1011
1012
  exports.ListboxInput = listboxInput_vue_vue_type_script_setup_true_lang.default;
1012
1013
  exports.ListboxItem = listboxItem_vue_vue_type_script_setup_true_lang.default;
1014
+ exports.ListboxItemContext = listboxItemContext_vue_vue_type_script_setup_true_lang.default;
1013
1015
  exports.ListboxItemGroup = listboxItemGroup_vue_vue_type_script_setup_true_lang.default;
1014
1016
  exports.ListboxItemGroupLabel = listboxItemGroupLabel_vue_vue_type_script_setup_true_lang.default;
1015
1017
  exports.ListboxItemIndicator = listboxItemIndicator_vue_vue_type_script_setup_true_lang.default;
@@ -1080,7 +1082,7 @@ exports.PasswordInputRootProvider = passwordInputRootProvider_vue_vue_type_scrip
1080
1082
  exports.PasswordInputVisibilityTrigger = passwordInputVisibilityTrigger_vue_vue_type_script_setup_true_lang.default;
1081
1083
  exports.usePasswordInput = usePasswordInput.usePasswordInput;
1082
1084
  exports.usePasswordInputContext = usePasswordInputContext.usePasswordInputContext;
1083
- exports.PasswordInput = passwordInput;
1085
+ exports.PasswordInput = passwordInput$1;
1084
1086
  exports.PinInputContext = pinInputContext_vue_vue_type_script_setup_true_lang.default;
1085
1087
  exports.PinInputControl = pinInputControl_vue_vue_type_script_setup_true_lang.default;
1086
1088
  exports.PinInputHiddenInput = pinInputHiddenInput_vue_vue_type_script_setup_true_lang.default;
@@ -1474,7 +1476,10 @@ Object.defineProperty(exports, "paginationAnatomy", {
1474
1476
  enumerable: true,
1475
1477
  get: () => pagination.anatomy
1476
1478
  });
1477
- exports.passwordInputAnatomy = index.anatomy;
1479
+ Object.defineProperty(exports, "passwordInputAnatomy", {
1480
+ enumerable: true,
1481
+ get: () => passwordInput.anatomy
1482
+ });
1478
1483
  Object.defineProperty(exports, "pinInputAnatomy", {
1479
1484
  enumerable: true,
1480
1485
  get: () => pinInput.anatomy
package/dist/index.js CHANGED
@@ -299,6 +299,7 @@ export { default as ListboxContext } from './components/listbox/listbox-context.
299
299
  export { default as ListboxContent } from './components/listbox/listbox-content.vue.js';
300
300
  export { default as ListboxInput } from './components/listbox/listbox-input.vue.js';
301
301
  export { default as ListboxItem } from './components/listbox/listbox-item.vue.js';
302
+ export { default as ListboxItemContext } from './components/listbox/listbox-item-context.vue.js';
302
303
  export { default as ListboxItemGroup } from './components/listbox/listbox-item-group.vue.js';
303
304
  export { default as ListboxItemGroupLabel } from './components/listbox/listbox-item-group-label.vue.js';
304
305
  export { default as ListboxItemIndicator } from './components/listbox/listbox-item-indicator.vue.js';
@@ -737,7 +738,7 @@ export { anatomy as listboxAnatomy } from '@zag-js/listbox';
737
738
  export { anatomy as menuAnatomy } from '@zag-js/menu';
738
739
  export { anatomy as numberInputAnatomy } from '@zag-js/number-input';
739
740
  export { anatomy as paginationAnatomy } from '@zag-js/pagination';
740
- export { anatomy as passwordInputAnatomy } from './node_modules/@zag-js/password-input/dist/index.js';
741
+ export { anatomy as passwordInputAnatomy } from '@zag-js/password-input';
741
742
  export { anatomy as pinInputAnatomy } from '@zag-js/pin-input';
742
743
  export { anatomy as popoverAnatomy } from '@zag-js/popover';
743
744
  export { anatomy as progressAnatomy } from '@zag-js/progress';
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ark-ui/vue",
3
3
  "type": "module",
4
- "version": "5.15.0",
4
+ "version": "5.15.2",
5
5
  "description": "A collection of unstyled, accessible UI components for Vue, utilizing state machines for seamless interaction.",
6
6
  "keywords": [
7
7
  "accordion",
@@ -140,60 +140,63 @@
140
140
  "sideEffects": false,
141
141
  "dependencies": {
142
142
  "@internationalized/date": "3.8.2",
143
- "@zag-js/accordion": "1.17.0",
144
- "@zag-js/angle-slider": "1.17.0",
145
- "@zag-js/anatomy": "1.17.0",
146
- "@zag-js/auto-resize": "1.17.0",
147
- "@zag-js/avatar": "1.17.0",
148
- "@zag-js/carousel": "1.17.0",
149
- "@zag-js/checkbox": "1.17.0",
150
- "@zag-js/clipboard": "1.17.0",
151
- "@zag-js/collapsible": "1.17.0",
152
- "@zag-js/collection": "1.17.0",
153
- "@zag-js/color-picker": "1.17.0",
154
- "@zag-js/combobox": "1.17.0",
155
- "@zag-js/date-picker": "1.17.0",
156
- "@zag-js/dialog": "1.17.0",
157
- "@zag-js/dom-query": "1.17.0",
158
- "@zag-js/editable": "1.17.0",
159
- "@zag-js/file-upload": "1.17.0",
160
- "@zag-js/file-utils": "1.17.0",
161
- "@zag-js/focus-trap": "1.17.0",
162
- "@zag-js/floating-panel": "1.17.0",
163
- "@zag-js/highlight-word": "1.17.0",
164
- "@zag-js/hover-card": "1.17.0",
165
- "@zag-js/i18n-utils": "1.17.0",
166
- "@zag-js/listbox": "1.17.0",
167
- "@zag-js/menu": "1.17.0",
168
- "@zag-js/number-input": "1.17.0",
169
- "@zag-js/pagination": "1.17.0",
170
- "@zag-js/pin-input": "1.17.0",
171
- "@zag-js/popover": "1.17.0",
172
- "@zag-js/presence": "1.17.0",
173
- "@zag-js/progress": "1.17.0",
174
- "@zag-js/qr-code": "1.17.0",
175
- "@zag-js/radio-group": "1.17.0",
176
- "@zag-js/rating-group": "1.17.0",
177
- "@zag-js/select": "1.17.0",
178
- "@zag-js/signature-pad": "1.17.0",
179
- "@zag-js/slider": "1.17.0",
180
- "@zag-js/splitter": "1.17.0",
181
- "@zag-js/switch": "1.17.0",
182
- "@zag-js/tabs": "1.17.0",
183
- "@zag-js/tags-input": "1.17.0",
184
- "@zag-js/time-picker": "1.17.0",
185
- "@zag-js/timer": "1.17.0",
186
- "@zag-js/toast": "1.17.0",
187
- "@zag-js/toggle": "1.17.0",
188
- "@zag-js/toggle-group": "1.17.0",
189
- "@zag-js/tooltip": "1.17.0",
190
- "@zag-js/tour": "1.17.0",
191
- "@zag-js/tree-view": "1.17.0",
192
- "@zag-js/types": "1.17.0",
193
- "@zag-js/utils": "1.17.0",
194
- "@zag-js/steps": "1.17.0",
195
- "@zag-js/store": "1.17.0",
196
- "@zag-js/vue": "1.17.0"
143
+ "@zag-js/accordion": "1.17.2",
144
+ "@zag-js/angle-slider": "1.17.2",
145
+ "@zag-js/anatomy": "1.17.2",
146
+ "@zag-js/auto-resize": "1.17.2",
147
+ "@zag-js/avatar": "1.17.2",
148
+ "@zag-js/carousel": "1.17.2",
149
+ "@zag-js/checkbox": "1.17.2",
150
+ "@zag-js/clipboard": "1.17.2",
151
+ "@zag-js/collapsible": "1.17.2",
152
+ "@zag-js/collection": "1.17.2",
153
+ "@zag-js/color-picker": "1.17.2",
154
+ "@zag-js/color-utils": "1.17.2",
155
+ "@zag-js/combobox": "1.17.2",
156
+ "@zag-js/core": "1.17.2",
157
+ "@zag-js/date-picker": "1.17.2",
158
+ "@zag-js/date-utils": "1.17.2",
159
+ "@zag-js/dialog": "1.17.2",
160
+ "@zag-js/dom-query": "1.17.2",
161
+ "@zag-js/editable": "1.17.2",
162
+ "@zag-js/file-upload": "1.17.2",
163
+ "@zag-js/file-utils": "1.17.2",
164
+ "@zag-js/focus-trap": "1.17.2",
165
+ "@zag-js/floating-panel": "1.17.2",
166
+ "@zag-js/highlight-word": "1.17.2",
167
+ "@zag-js/hover-card": "1.17.2",
168
+ "@zag-js/i18n-utils": "1.17.2",
169
+ "@zag-js/listbox": "1.17.2",
170
+ "@zag-js/menu": "1.17.2",
171
+ "@zag-js/number-input": "1.17.2",
172
+ "@zag-js/pagination": "1.17.2",
173
+ "@zag-js/password-input": "1.17.2",
174
+ "@zag-js/pin-input": "1.17.2",
175
+ "@zag-js/popover": "1.17.2",
176
+ "@zag-js/presence": "1.17.2",
177
+ "@zag-js/progress": "1.17.2",
178
+ "@zag-js/qr-code": "1.17.2",
179
+ "@zag-js/radio-group": "1.17.2",
180
+ "@zag-js/rating-group": "1.17.2",
181
+ "@zag-js/select": "1.17.2",
182
+ "@zag-js/signature-pad": "1.17.2",
183
+ "@zag-js/slider": "1.17.2",
184
+ "@zag-js/splitter": "1.17.2",
185
+ "@zag-js/switch": "1.17.2",
186
+ "@zag-js/tabs": "1.17.2",
187
+ "@zag-js/tags-input": "1.17.2",
188
+ "@zag-js/time-picker": "1.17.2",
189
+ "@zag-js/timer": "1.17.2",
190
+ "@zag-js/toast": "1.17.2",
191
+ "@zag-js/toggle": "1.17.2",
192
+ "@zag-js/toggle-group": "1.17.2",
193
+ "@zag-js/tooltip": "1.17.2",
194
+ "@zag-js/tour": "1.17.2",
195
+ "@zag-js/tree-view": "1.17.2",
196
+ "@zag-js/types": "1.17.2",
197
+ "@zag-js/utils": "1.17.2",
198
+ "@zag-js/steps": "1.17.2",
199
+ "@zag-js/vue": "1.17.2"
197
200
  },
198
201
  "devDependencies": {
199
202
  "@biomejs/biome": "1.9.4",
@@ -1,12 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
-
5
- require('@zag-js/utils');
6
- require('@zag-js/dom-query');
7
-
8
- function createMachine(config) {
9
- return config;
10
- }
11
-
12
- exports.createMachine = createMachine;
@@ -1,8 +0,0 @@
1
- import '@zag-js/utils';
2
- import '@zag-js/dom-query';
3
-
4
- function createMachine(config) {
5
- return config;
6
- }
7
-
8
- export { createMachine };
@@ -1,243 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
4
-
5
- const anatomy$1 = require('@zag-js/anatomy');
6
- const domQuery = require('@zag-js/dom-query');
7
- const index = require('../../core/dist/index.cjs');
8
- const utils = require('@zag-js/utils');
9
- const types = require('@zag-js/types');
10
-
11
- // src/password-input.anatomy.ts
12
- var anatomy = anatomy$1.createAnatomy("password-input").parts(
13
- "root",
14
- "input",
15
- "label",
16
- "control",
17
- "indicator",
18
- "visibilityTrigger"
19
- );
20
- var parts = anatomy.build();
21
-
22
- // src/password-input.dom.ts
23
- var getInputId = (ctx) => ctx.ids?.input ?? `p-input-${ctx.id}-input`;
24
- var getInputEl = (ctx) => ctx.getById(getInputId(ctx));
25
-
26
- // src/password-input.connect.ts
27
- function connect(service, normalize) {
28
- const { scope, prop, context } = service;
29
- const visible = context.get("visible");
30
- const disabled = !!prop("disabled");
31
- const invalid = !!prop("invalid");
32
- const readOnly = !!prop("readOnly");
33
- const interactive = !(readOnly || disabled);
34
- const translations = prop("translations");
35
- return {
36
- visible,
37
- disabled,
38
- invalid,
39
- focus() {
40
- getInputEl(scope)?.focus();
41
- },
42
- setVisible(value) {
43
- service.send({ type: "VISIBILITY.SET", value });
44
- },
45
- toggleVisible() {
46
- service.send({ type: "VISIBILITY.SET", value: !visible });
47
- },
48
- getRootProps() {
49
- return normalize.element({
50
- ...parts.root.attrs,
51
- dir: prop("dir"),
52
- "data-disabled": domQuery.dataAttr(disabled),
53
- "data-invalid": domQuery.dataAttr(invalid),
54
- "data-readonly": domQuery.dataAttr(readOnly)
55
- });
56
- },
57
- getLabelProps() {
58
- return normalize.label({
59
- ...parts.label.attrs,
60
- htmlFor: getInputId(scope),
61
- "data-disabled": domQuery.dataAttr(disabled),
62
- "data-invalid": domQuery.dataAttr(invalid),
63
- "data-readonly": domQuery.dataAttr(readOnly)
64
- });
65
- },
66
- getInputProps() {
67
- return normalize.input({
68
- ...parts.input.attrs,
69
- id: getInputId(scope),
70
- autoCapitalize: "off",
71
- name: prop("name"),
72
- required: prop("required"),
73
- autoComplete: prop("autoComplete"),
74
- spellCheck: false,
75
- readOnly,
76
- disabled,
77
- type: visible ? "text" : "password",
78
- "data-state": visible ? "visible" : "hidden",
79
- "aria-invalid": domQuery.ariaAttr(invalid),
80
- "data-disabled": domQuery.dataAttr(disabled),
81
- "data-invalid": domQuery.dataAttr(invalid),
82
- "data-readonly": domQuery.dataAttr(readOnly),
83
- ...prop("ignorePasswordManagers") ? passwordManagerProps : {}
84
- });
85
- },
86
- getVisibilityTriggerProps() {
87
- return normalize.button({
88
- ...parts.visibilityTrigger.attrs,
89
- type: "button",
90
- tabIndex: -1,
91
- "aria-controls": getInputId(scope),
92
- "aria-expanded": visible,
93
- "data-readonly": domQuery.dataAttr(readOnly),
94
- disabled,
95
- "data-disabled": domQuery.dataAttr(disabled),
96
- "data-state": visible ? "visible" : "hidden",
97
- "aria-label": translations?.visibilityTrigger?.(visible),
98
- onPointerDown(event) {
99
- if (!domQuery.isLeftClick(event)) return;
100
- if (!interactive) return;
101
- event.preventDefault();
102
- service.send({ type: "TRIGGER.CLICK" });
103
- }
104
- });
105
- },
106
- getIndicatorProps() {
107
- return normalize.element({
108
- ...parts.indicator.attrs,
109
- "aria-hidden": true,
110
- "data-state": visible ? "visible" : "hidden",
111
- "data-disabled": domQuery.dataAttr(disabled),
112
- "data-invalid": domQuery.dataAttr(invalid),
113
- "data-readonly": domQuery.dataAttr(readOnly)
114
- });
115
- },
116
- getControlProps() {
117
- return normalize.element({
118
- ...parts.control.attrs,
119
- "data-disabled": domQuery.dataAttr(disabled),
120
- "data-invalid": domQuery.dataAttr(invalid),
121
- "data-readonly": domQuery.dataAttr(readOnly)
122
- });
123
- }
124
- };
125
- }
126
- var passwordManagerProps = {
127
- // 1Password
128
- "data-1p-ignore": "",
129
- // LastPass
130
- "data-lpignore": "true",
131
- // Bitwarden
132
- "data-bwignore": "true",
133
- // Dashlane
134
- "data-form-type": "other",
135
- // Proton Pass
136
- "data-protonpass-ignore": "true"
137
- };
138
- var machine = index.createMachine({
139
- props({ props: props2 }) {
140
- return {
141
- id: utils.uuid(),
142
- defaultVisible: false,
143
- autoComplete: "current-password",
144
- ignorePasswordManagers: false,
145
- ...props2,
146
- translations: {
147
- visibilityTrigger(visible) {
148
- return visible ? "Hide password" : "Show password";
149
- },
150
- ...props2.translations
151
- }
152
- };
153
- },
154
- context({ prop, bindable }) {
155
- return {
156
- visible: bindable(() => ({
157
- value: prop("visible"),
158
- defaultValue: prop("defaultVisible"),
159
- onChange(value) {
160
- prop("onVisibilityChange")?.({ visible: value });
161
- }
162
- }))
163
- };
164
- },
165
- initialState() {
166
- return "idle";
167
- },
168
- effects: ["trackFormEvents"],
169
- states: {
170
- idle: {
171
- on: {
172
- "VISIBILITY.SET": {
173
- actions: ["setVisibility"]
174
- },
175
- "TRIGGER.CLICK": {
176
- actions: ["toggleVisibility", "focusInputEl"]
177
- }
178
- }
179
- }
180
- },
181
- implementations: {
182
- actions: {
183
- setVisibility({ context, event }) {
184
- context.set("visible", event.value);
185
- },
186
- toggleVisibility({ context }) {
187
- context.set("visible", (c) => !c);
188
- },
189
- focusInputEl({ scope }) {
190
- const inputEl = getInputEl(scope);
191
- inputEl?.focus();
192
- }
193
- },
194
- effects: {
195
- trackFormEvents({ scope, send }) {
196
- const inputEl = getInputEl(scope);
197
- const form = inputEl?.form;
198
- if (!form) return;
199
- const win = scope.getWin();
200
- const controller = new win.AbortController();
201
- form.addEventListener(
202
- "reset",
203
- (event) => {
204
- if (event.defaultPrevented) return;
205
- send({ type: "VISIBILITY.SET", value: false });
206
- },
207
- { signal: controller.signal }
208
- );
209
- form.addEventListener(
210
- "submit",
211
- () => {
212
- send({ type: "VISIBILITY.SET", value: false });
213
- },
214
- { signal: controller.signal }
215
- );
216
- return () => controller.abort();
217
- }
218
- }
219
- }
220
- });
221
- var props = types.createProps()([
222
- "defaultVisible",
223
- "dir",
224
- "id",
225
- "onVisibilityChange",
226
- "visible",
227
- "ids",
228
- "getRootNode",
229
- "disabled",
230
- "invalid",
231
- "required",
232
- "readOnly",
233
- "translations",
234
- "ignorePasswordManagers",
235
- "autoComplete",
236
- "name"
237
- ]);
238
- utils.createSplitProps(props);
239
-
240
- exports.anatomy = anatomy;
241
- exports.connect = connect;
242
- exports.machine = machine;
243
- exports.props = props;
@@ -1,236 +0,0 @@
1
- import { createAnatomy } from '@zag-js/anatomy';
2
- import { dataAttr, isLeftClick, ariaAttr } from '@zag-js/dom-query';
3
- import { createMachine } from '../../core/dist/index.js';
4
- import { uuid, createSplitProps } from '@zag-js/utils';
5
- import { createProps } from '@zag-js/types';
6
-
7
- // src/password-input.anatomy.ts
8
- var anatomy = createAnatomy("password-input").parts(
9
- "root",
10
- "input",
11
- "label",
12
- "control",
13
- "indicator",
14
- "visibilityTrigger"
15
- );
16
- var parts = anatomy.build();
17
-
18
- // src/password-input.dom.ts
19
- var getInputId = (ctx) => ctx.ids?.input ?? `p-input-${ctx.id}-input`;
20
- var getInputEl = (ctx) => ctx.getById(getInputId(ctx));
21
-
22
- // src/password-input.connect.ts
23
- function connect(service, normalize) {
24
- const { scope, prop, context } = service;
25
- const visible = context.get("visible");
26
- const disabled = !!prop("disabled");
27
- const invalid = !!prop("invalid");
28
- const readOnly = !!prop("readOnly");
29
- const interactive = !(readOnly || disabled);
30
- const translations = prop("translations");
31
- return {
32
- visible,
33
- disabled,
34
- invalid,
35
- focus() {
36
- getInputEl(scope)?.focus();
37
- },
38
- setVisible(value) {
39
- service.send({ type: "VISIBILITY.SET", value });
40
- },
41
- toggleVisible() {
42
- service.send({ type: "VISIBILITY.SET", value: !visible });
43
- },
44
- getRootProps() {
45
- return normalize.element({
46
- ...parts.root.attrs,
47
- dir: prop("dir"),
48
- "data-disabled": dataAttr(disabled),
49
- "data-invalid": dataAttr(invalid),
50
- "data-readonly": dataAttr(readOnly)
51
- });
52
- },
53
- getLabelProps() {
54
- return normalize.label({
55
- ...parts.label.attrs,
56
- htmlFor: getInputId(scope),
57
- "data-disabled": dataAttr(disabled),
58
- "data-invalid": dataAttr(invalid),
59
- "data-readonly": dataAttr(readOnly)
60
- });
61
- },
62
- getInputProps() {
63
- return normalize.input({
64
- ...parts.input.attrs,
65
- id: getInputId(scope),
66
- autoCapitalize: "off",
67
- name: prop("name"),
68
- required: prop("required"),
69
- autoComplete: prop("autoComplete"),
70
- spellCheck: false,
71
- readOnly,
72
- disabled,
73
- type: visible ? "text" : "password",
74
- "data-state": visible ? "visible" : "hidden",
75
- "aria-invalid": ariaAttr(invalid),
76
- "data-disabled": dataAttr(disabled),
77
- "data-invalid": dataAttr(invalid),
78
- "data-readonly": dataAttr(readOnly),
79
- ...prop("ignorePasswordManagers") ? passwordManagerProps : {}
80
- });
81
- },
82
- getVisibilityTriggerProps() {
83
- return normalize.button({
84
- ...parts.visibilityTrigger.attrs,
85
- type: "button",
86
- tabIndex: -1,
87
- "aria-controls": getInputId(scope),
88
- "aria-expanded": visible,
89
- "data-readonly": dataAttr(readOnly),
90
- disabled,
91
- "data-disabled": dataAttr(disabled),
92
- "data-state": visible ? "visible" : "hidden",
93
- "aria-label": translations?.visibilityTrigger?.(visible),
94
- onPointerDown(event) {
95
- if (!isLeftClick(event)) return;
96
- if (!interactive) return;
97
- event.preventDefault();
98
- service.send({ type: "TRIGGER.CLICK" });
99
- }
100
- });
101
- },
102
- getIndicatorProps() {
103
- return normalize.element({
104
- ...parts.indicator.attrs,
105
- "aria-hidden": true,
106
- "data-state": visible ? "visible" : "hidden",
107
- "data-disabled": dataAttr(disabled),
108
- "data-invalid": dataAttr(invalid),
109
- "data-readonly": dataAttr(readOnly)
110
- });
111
- },
112
- getControlProps() {
113
- return normalize.element({
114
- ...parts.control.attrs,
115
- "data-disabled": dataAttr(disabled),
116
- "data-invalid": dataAttr(invalid),
117
- "data-readonly": dataAttr(readOnly)
118
- });
119
- }
120
- };
121
- }
122
- var passwordManagerProps = {
123
- // 1Password
124
- "data-1p-ignore": "",
125
- // LastPass
126
- "data-lpignore": "true",
127
- // Bitwarden
128
- "data-bwignore": "true",
129
- // Dashlane
130
- "data-form-type": "other",
131
- // Proton Pass
132
- "data-protonpass-ignore": "true"
133
- };
134
- var machine = createMachine({
135
- props({ props: props2 }) {
136
- return {
137
- id: uuid(),
138
- defaultVisible: false,
139
- autoComplete: "current-password",
140
- ignorePasswordManagers: false,
141
- ...props2,
142
- translations: {
143
- visibilityTrigger(visible) {
144
- return visible ? "Hide password" : "Show password";
145
- },
146
- ...props2.translations
147
- }
148
- };
149
- },
150
- context({ prop, bindable }) {
151
- return {
152
- visible: bindable(() => ({
153
- value: prop("visible"),
154
- defaultValue: prop("defaultVisible"),
155
- onChange(value) {
156
- prop("onVisibilityChange")?.({ visible: value });
157
- }
158
- }))
159
- };
160
- },
161
- initialState() {
162
- return "idle";
163
- },
164
- effects: ["trackFormEvents"],
165
- states: {
166
- idle: {
167
- on: {
168
- "VISIBILITY.SET": {
169
- actions: ["setVisibility"]
170
- },
171
- "TRIGGER.CLICK": {
172
- actions: ["toggleVisibility", "focusInputEl"]
173
- }
174
- }
175
- }
176
- },
177
- implementations: {
178
- actions: {
179
- setVisibility({ context, event }) {
180
- context.set("visible", event.value);
181
- },
182
- toggleVisibility({ context }) {
183
- context.set("visible", (c) => !c);
184
- },
185
- focusInputEl({ scope }) {
186
- const inputEl = getInputEl(scope);
187
- inputEl?.focus();
188
- }
189
- },
190
- effects: {
191
- trackFormEvents({ scope, send }) {
192
- const inputEl = getInputEl(scope);
193
- const form = inputEl?.form;
194
- if (!form) return;
195
- const win = scope.getWin();
196
- const controller = new win.AbortController();
197
- form.addEventListener(
198
- "reset",
199
- (event) => {
200
- if (event.defaultPrevented) return;
201
- send({ type: "VISIBILITY.SET", value: false });
202
- },
203
- { signal: controller.signal }
204
- );
205
- form.addEventListener(
206
- "submit",
207
- () => {
208
- send({ type: "VISIBILITY.SET", value: false });
209
- },
210
- { signal: controller.signal }
211
- );
212
- return () => controller.abort();
213
- }
214
- }
215
- }
216
- });
217
- var props = createProps()([
218
- "defaultVisible",
219
- "dir",
220
- "id",
221
- "onVisibilityChange",
222
- "visible",
223
- "ids",
224
- "getRootNode",
225
- "disabled",
226
- "invalid",
227
- "required",
228
- "readOnly",
229
- "translations",
230
- "ignorePasswordManagers",
231
- "autoComplete",
232
- "name"
233
- ]);
234
- createSplitProps(props);
235
-
236
- export { anatomy, connect, machine, props };