@ark-ui/vue 5.15.1 → 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.
- package/dist/components/index.cjs +7 -4
- package/dist/components/index.js +1 -1
- package/dist/components/password-input/index.cjs +7 -4
- package/dist/components/password-input/index.js +1 -1
- package/dist/components/password-input/use-password-input.cjs +22 -3
- package/dist/components/password-input/use-password-input.js +3 -3
- package/dist/components/tree-view/tree-view-root.vue.d.cts +4 -4
- package/dist/components/tree-view/tree-view-root.vue.d.ts +4 -4
- package/dist/index.cjs +7 -4
- package/dist/index.js +1 -1
- package/package.json +58 -55
- package/dist/node_modules/@zag-js/core/dist/index.cjs +0 -12
- package/dist/node_modules/@zag-js/core/dist/index.js +0 -8
- package/dist/node_modules/@zag-js/password-input/dist/index.cjs +0 -243
- package/dist/node_modules/@zag-js/password-input/dist/index.js +0 -236
|
@@ -356,7 +356,7 @@ const passwordInputRootProvider_vue_vue_type_script_setup_true_lang = require('.
|
|
|
356
356
|
const passwordInputVisibilityTrigger_vue_vue_type_script_setup_true_lang = require('./password-input/password-input-visibility-trigger.vue.cjs');
|
|
357
357
|
const usePasswordInput = require('./password-input/use-password-input.cjs');
|
|
358
358
|
const usePasswordInputContext = require('./password-input/use-password-input-context.cjs');
|
|
359
|
-
const passwordInput = require('./password-input/password-input.cjs');
|
|
359
|
+
const passwordInput$1 = require('./password-input/password-input.cjs');
|
|
360
360
|
const pinInputContext_vue_vue_type_script_setup_true_lang = require('./pin-input/pin-input-context.vue.cjs');
|
|
361
361
|
const pinInputControl_vue_vue_type_script_setup_true_lang = require('./pin-input/pin-input-control.vue.cjs');
|
|
362
362
|
const pinInputHiddenInput_vue_vue_type_script_setup_true_lang = require('./pin-input/pin-input-hidden-input.vue.cjs');
|
|
@@ -687,7 +687,7 @@ const listbox = require('@zag-js/listbox');
|
|
|
687
687
|
const menu = require('@zag-js/menu');
|
|
688
688
|
const numberInput = require('@zag-js/number-input');
|
|
689
689
|
const pagination = require('@zag-js/pagination');
|
|
690
|
-
const
|
|
690
|
+
const passwordInput = require('@zag-js/password-input');
|
|
691
691
|
const pinInput = require('@zag-js/pin-input');
|
|
692
692
|
const popover = require('@zag-js/popover');
|
|
693
693
|
const progress = require('@zag-js/progress');
|
|
@@ -1073,7 +1073,7 @@ exports.PasswordInputRootProvider = passwordInputRootProvider_vue_vue_type_scrip
|
|
|
1073
1073
|
exports.PasswordInputVisibilityTrigger = passwordInputVisibilityTrigger_vue_vue_type_script_setup_true_lang.default;
|
|
1074
1074
|
exports.usePasswordInput = usePasswordInput.usePasswordInput;
|
|
1075
1075
|
exports.usePasswordInputContext = usePasswordInputContext.usePasswordInputContext;
|
|
1076
|
-
exports.PasswordInput = passwordInput;
|
|
1076
|
+
exports.PasswordInput = passwordInput$1;
|
|
1077
1077
|
exports.PinInputContext = pinInputContext_vue_vue_type_script_setup_true_lang.default;
|
|
1078
1078
|
exports.PinInputControl = pinInputControl_vue_vue_type_script_setup_true_lang.default;
|
|
1079
1079
|
exports.PinInputHiddenInput = pinInputHiddenInput_vue_vue_type_script_setup_true_lang.default;
|
|
@@ -1456,7 +1456,10 @@ Object.defineProperty(exports, "paginationAnatomy", {
|
|
|
1456
1456
|
enumerable: true,
|
|
1457
1457
|
get: () => pagination.anatomy
|
|
1458
1458
|
});
|
|
1459
|
-
exports
|
|
1459
|
+
Object.defineProperty(exports, "passwordInputAnatomy", {
|
|
1460
|
+
enumerable: true,
|
|
1461
|
+
get: () => passwordInput.anatomy
|
|
1462
|
+
});
|
|
1460
1463
|
Object.defineProperty(exports, "pinInputAnatomy", {
|
|
1461
1464
|
enumerable: true,
|
|
1462
1465
|
get: () => pinInput.anatomy
|
package/dist/components/index.js
CHANGED
|
@@ -729,7 +729,7 @@ export { anatomy as listboxAnatomy } from '@zag-js/listbox';
|
|
|
729
729
|
export { anatomy as menuAnatomy } from '@zag-js/menu';
|
|
730
730
|
export { anatomy as numberInputAnatomy } from '@zag-js/number-input';
|
|
731
731
|
export { anatomy as paginationAnatomy } from '@zag-js/pagination';
|
|
732
|
-
export { anatomy as passwordInputAnatomy } from '
|
|
732
|
+
export { anatomy as passwordInputAnatomy } from '@zag-js/password-input';
|
|
733
733
|
export { anatomy as pinInputAnatomy } from '@zag-js/pin-input';
|
|
734
734
|
export { anatomy as popoverAnatomy } from '@zag-js/popover';
|
|
735
735
|
export { anatomy as progressAnatomy } from '@zag-js/progress';
|
|
@@ -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
|
|
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
|
|
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 '
|
|
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
|
|
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(
|
|
40
|
-
return vue.computed(() =>
|
|
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
|
|
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
|
@@ -356,7 +356,7 @@ const passwordInputRootProvider_vue_vue_type_script_setup_true_lang = require('.
|
|
|
356
356
|
const passwordInputVisibilityTrigger_vue_vue_type_script_setup_true_lang = require('./components/password-input/password-input-visibility-trigger.vue.cjs');
|
|
357
357
|
const usePasswordInput = require('./components/password-input/use-password-input.cjs');
|
|
358
358
|
const usePasswordInputContext = require('./components/password-input/use-password-input-context.cjs');
|
|
359
|
-
const passwordInput = require('./components/password-input/password-input.cjs');
|
|
359
|
+
const passwordInput$1 = require('./components/password-input/password-input.cjs');
|
|
360
360
|
const pinInputContext_vue_vue_type_script_setup_true_lang = require('./components/pin-input/pin-input-context.vue.cjs');
|
|
361
361
|
const pinInputControl_vue_vue_type_script_setup_true_lang = require('./components/pin-input/pin-input-control.vue.cjs');
|
|
362
362
|
const pinInputHiddenInput_vue_vue_type_script_setup_true_lang = require('./components/pin-input/pin-input-hidden-input.vue.cjs');
|
|
@@ -696,7 +696,7 @@ const listbox = require('@zag-js/listbox');
|
|
|
696
696
|
const menu = require('@zag-js/menu');
|
|
697
697
|
const numberInput = require('@zag-js/number-input');
|
|
698
698
|
const pagination = require('@zag-js/pagination');
|
|
699
|
-
const
|
|
699
|
+
const passwordInput = require('@zag-js/password-input');
|
|
700
700
|
const pinInput = require('@zag-js/pin-input');
|
|
701
701
|
const popover = require('@zag-js/popover');
|
|
702
702
|
const progress = require('@zag-js/progress');
|
|
@@ -1082,7 +1082,7 @@ exports.PasswordInputRootProvider = passwordInputRootProvider_vue_vue_type_scrip
|
|
|
1082
1082
|
exports.PasswordInputVisibilityTrigger = passwordInputVisibilityTrigger_vue_vue_type_script_setup_true_lang.default;
|
|
1083
1083
|
exports.usePasswordInput = usePasswordInput.usePasswordInput;
|
|
1084
1084
|
exports.usePasswordInputContext = usePasswordInputContext.usePasswordInputContext;
|
|
1085
|
-
exports.PasswordInput = passwordInput;
|
|
1085
|
+
exports.PasswordInput = passwordInput$1;
|
|
1086
1086
|
exports.PinInputContext = pinInputContext_vue_vue_type_script_setup_true_lang.default;
|
|
1087
1087
|
exports.PinInputControl = pinInputControl_vue_vue_type_script_setup_true_lang.default;
|
|
1088
1088
|
exports.PinInputHiddenInput = pinInputHiddenInput_vue_vue_type_script_setup_true_lang.default;
|
|
@@ -1476,7 +1476,10 @@ Object.defineProperty(exports, "paginationAnatomy", {
|
|
|
1476
1476
|
enumerable: true,
|
|
1477
1477
|
get: () => pagination.anatomy
|
|
1478
1478
|
});
|
|
1479
|
-
exports
|
|
1479
|
+
Object.defineProperty(exports, "passwordInputAnatomy", {
|
|
1480
|
+
enumerable: true,
|
|
1481
|
+
get: () => passwordInput.anatomy
|
|
1482
|
+
});
|
|
1480
1483
|
Object.defineProperty(exports, "pinInputAnatomy", {
|
|
1481
1484
|
enumerable: true,
|
|
1482
1485
|
get: () => pinInput.anatomy
|
package/dist/index.js
CHANGED
|
@@ -738,7 +738,7 @@ export { anatomy as listboxAnatomy } from '@zag-js/listbox';
|
|
|
738
738
|
export { anatomy as menuAnatomy } from '@zag-js/menu';
|
|
739
739
|
export { anatomy as numberInputAnatomy } from '@zag-js/number-input';
|
|
740
740
|
export { anatomy as paginationAnatomy } from '@zag-js/pagination';
|
|
741
|
-
export { anatomy as passwordInputAnatomy } from '
|
|
741
|
+
export { anatomy as passwordInputAnatomy } from '@zag-js/password-input';
|
|
742
742
|
export { anatomy as pinInputAnatomy } from '@zag-js/pin-input';
|
|
743
743
|
export { anatomy as popoverAnatomy } from '@zag-js/popover';
|
|
744
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.
|
|
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.
|
|
144
|
-
"@zag-js/angle-slider": "1.17.
|
|
145
|
-
"@zag-js/anatomy": "1.17.
|
|
146
|
-
"@zag-js/auto-resize": "1.17.
|
|
147
|
-
"@zag-js/avatar": "1.17.
|
|
148
|
-
"@zag-js/carousel": "1.17.
|
|
149
|
-
"@zag-js/checkbox": "1.17.
|
|
150
|
-
"@zag-js/clipboard": "1.17.
|
|
151
|
-
"@zag-js/collapsible": "1.17.
|
|
152
|
-
"@zag-js/collection": "1.17.
|
|
153
|
-
"@zag-js/color-picker": "1.17.
|
|
154
|
-
"@zag-js/
|
|
155
|
-
"@zag-js/
|
|
156
|
-
"@zag-js/
|
|
157
|
-
"@zag-js/
|
|
158
|
-
"@zag-js/
|
|
159
|
-
"@zag-js/
|
|
160
|
-
"@zag-js/
|
|
161
|
-
"@zag-js/
|
|
162
|
-
"@zag-js/
|
|
163
|
-
"@zag-js/
|
|
164
|
-
"@zag-js/
|
|
165
|
-
"@zag-js/
|
|
166
|
-
"@zag-js/
|
|
167
|
-
"@zag-js/
|
|
168
|
-
"@zag-js/
|
|
169
|
-
"@zag-js/
|
|
170
|
-
"@zag-js/
|
|
171
|
-
"@zag-js/
|
|
172
|
-
"@zag-js/
|
|
173
|
-
"@zag-js/
|
|
174
|
-
"@zag-js/
|
|
175
|
-
"@zag-js/
|
|
176
|
-
"@zag-js/
|
|
177
|
-
"@zag-js/
|
|
178
|
-
"@zag-js/
|
|
179
|
-
"@zag-js/
|
|
180
|
-
"@zag-js/
|
|
181
|
-
"@zag-js/
|
|
182
|
-
"@zag-js/
|
|
183
|
-
"@zag-js/
|
|
184
|
-
"@zag-js/
|
|
185
|
-
"@zag-js/
|
|
186
|
-
"@zag-js/
|
|
187
|
-
"@zag-js/
|
|
188
|
-
"@zag-js/
|
|
189
|
-
"@zag-js/
|
|
190
|
-
"@zag-js/
|
|
191
|
-
"@zag-js/
|
|
192
|
-
"@zag-js/
|
|
193
|
-
"@zag-js/
|
|
194
|
-
"@zag-js/
|
|
195
|
-
"@zag-js/
|
|
196
|
-
"@zag-js/
|
|
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,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 };
|