@ark-ui/react 5.9.1 → 5.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/collection.d.cts +1 -1
- package/dist/components/collection.d.ts +1 -1
- package/dist/components/field/use-field.cjs +7 -5
- package/dist/components/field/use-field.js +8 -6
- package/dist/components/fieldset/index.cjs +2 -0
- package/dist/components/fieldset/index.d.cts +1 -0
- package/dist/components/fieldset/index.d.ts +1 -0
- package/dist/components/fieldset/index.js +1 -0
- package/dist/components/fieldset/use-fieldset.cjs +11 -9
- package/dist/components/fieldset/use-fieldset.js +12 -10
- package/dist/components/index.cjs +29 -0
- package/dist/components/index.d.cts +1 -0
- package/dist/components/index.d.ts +1 -0
- package/dist/components/index.js +14 -0
- package/dist/components/password-input/index.cjs +34 -0
- package/dist/components/password-input/index.d.cts +13 -0
- package/dist/components/password-input/index.d.ts +13 -0
- package/dist/components/password-input/index.js +13 -0
- package/dist/components/password-input/password-input-context.cjs +12 -0
- package/dist/components/password-input/password-input-context.d.cts +6 -0
- package/dist/components/password-input/password-input-context.d.ts +6 -0
- package/dist/components/password-input/password-input-context.js +8 -0
- package/dist/components/password-input/password-input-control.cjs +19 -0
- package/dist/components/password-input/password-input-control.d.cts +7 -0
- package/dist/components/password-input/password-input-control.d.ts +7 -0
- package/dist/components/password-input/password-input-control.js +15 -0
- package/dist/components/password-input/password-input-indicator.cjs +19 -0
- package/dist/components/password-input/password-input-indicator.d.cts +11 -0
- package/dist/components/password-input/password-input-indicator.d.ts +11 -0
- package/dist/components/password-input/password-input-indicator.js +15 -0
- package/dist/components/password-input/password-input-input.cjs +21 -0
- package/dist/components/password-input/password-input-input.d.cts +7 -0
- package/dist/components/password-input/password-input-input.d.ts +7 -0
- package/dist/components/password-input/password-input-input.js +17 -0
- package/dist/components/password-input/password-input-label.cjs +19 -0
- package/dist/components/password-input/password-input-label.d.cts +7 -0
- package/dist/components/password-input/password-input-label.d.ts +7 -0
- package/dist/components/password-input/password-input-label.js +15 -0
- package/dist/components/password-input/password-input-root-provider.cjs +19 -0
- package/dist/components/password-input/password-input-root-provider.d.cts +12 -0
- package/dist/components/password-input/password-input-root-provider.d.ts +12 -0
- package/dist/components/password-input/password-input-root-provider.js +15 -0
- package/dist/components/password-input/password-input-root.cjs +36 -0
- package/dist/components/password-input/password-input-root.d.cts +9 -0
- package/dist/components/password-input/password-input-root.d.ts +9 -0
- package/dist/components/password-input/password-input-root.js +32 -0
- package/dist/components/password-input/password-input-visibility-trigger.cjs +21 -0
- package/dist/components/password-input/password-input-visibility-trigger.d.cts +7 -0
- package/dist/components/password-input/password-input-visibility-trigger.d.ts +7 -0
- package/dist/components/password-input/password-input-visibility-trigger.js +17 -0
- package/dist/components/password-input/password-input.anatomy.d.cts +1 -0
- package/dist/components/password-input/password-input.anatomy.d.ts +1 -0
- package/dist/components/password-input/password-input.cjs +23 -0
- package/dist/components/password-input/password-input.d.cts +9 -0
- package/dist/components/password-input/password-input.d.ts +9 -0
- package/dist/components/password-input/password-input.js +8 -0
- package/dist/components/password-input/use-password-input-context.cjs +15 -0
- package/dist/components/password-input/use-password-input-context.d.cts +5 -0
- package/dist/components/password-input/use-password-input-context.d.ts +5 -0
- package/dist/components/password-input/use-password-input-context.js +10 -0
- package/dist/components/password-input/use-password-input.cjs +54 -0
- package/dist/components/password-input/use-password-input.d.cts +8 -0
- package/dist/components/password-input/use-password-input.d.ts +8 -0
- package/dist/components/password-input/use-password-input.js +31 -0
- package/dist/components/select/select-root.cjs +1 -0
- package/dist/components/select/select-root.js +1 -0
- package/dist/index.cjs +29 -0
- package/dist/index.js +14 -0
- package/dist/providers/environment/environment-provider.cjs +1 -1
- package/dist/providers/environment/environment-provider.js +1 -1
- package/package.json +62 -59
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
+
|
|
6
|
+
const jsxRuntime = require('react/jsx-runtime');
|
|
7
|
+
const react$1 = require('@zag-js/react');
|
|
8
|
+
const react = require('react');
|
|
9
|
+
const factory = require('../factory.cjs');
|
|
10
|
+
const useFieldContext = require('../field/use-field-context.cjs');
|
|
11
|
+
const usePasswordInputContext = require('./use-password-input-context.cjs');
|
|
12
|
+
|
|
13
|
+
const PasswordInputInput = react.forwardRef((props, ref) => {
|
|
14
|
+
const passwordInput = usePasswordInputContext.usePasswordInputContext();
|
|
15
|
+
const mergedProps = react$1.mergeProps(passwordInput.getInputProps(), props);
|
|
16
|
+
const field = useFieldContext.useFieldContext();
|
|
17
|
+
return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
|
|
18
|
+
});
|
|
19
|
+
PasswordInputInput.displayName = "PasswordInputInput";
|
|
20
|
+
|
|
21
|
+
exports.PasswordInputInput = PasswordInputInput;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { HTMLProps, PolymorphicProps } from '../factory';
|
|
2
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
3
|
+
export interface PasswordInputInputBaseProps extends PolymorphicProps {
|
|
4
|
+
}
|
|
5
|
+
export interface PasswordInputInputProps extends HTMLProps<'input'>, PasswordInputInputBaseProps {
|
|
6
|
+
}
|
|
7
|
+
export declare const PasswordInputInput: ForwardRefExoticComponent<PasswordInputInputProps & RefAttributes<HTMLInputElement>>;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { HTMLProps, PolymorphicProps } from '../factory';
|
|
2
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
3
|
+
export interface PasswordInputInputBaseProps extends PolymorphicProps {
|
|
4
|
+
}
|
|
5
|
+
export interface PasswordInputInputProps extends HTMLProps<'input'>, PasswordInputInputBaseProps {
|
|
6
|
+
}
|
|
7
|
+
export declare const PasswordInputInput: ForwardRefExoticComponent<PasswordInputInputProps & RefAttributes<HTMLInputElement>>;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
import { mergeProps } from '@zag-js/react';
|
|
4
|
+
import { forwardRef } from 'react';
|
|
5
|
+
import { ark } from '../factory.js';
|
|
6
|
+
import { useFieldContext } from '../field/use-field-context.js';
|
|
7
|
+
import { usePasswordInputContext } from './use-password-input-context.js';
|
|
8
|
+
|
|
9
|
+
const PasswordInputInput = forwardRef((props, ref) => {
|
|
10
|
+
const passwordInput = usePasswordInputContext();
|
|
11
|
+
const mergedProps = mergeProps(passwordInput.getInputProps(), props);
|
|
12
|
+
const field = useFieldContext();
|
|
13
|
+
return /* @__PURE__ */ jsx(ark.input, { "aria-describedby": field?.ariaDescribedby, ...mergedProps, ref });
|
|
14
|
+
});
|
|
15
|
+
PasswordInputInput.displayName = "PasswordInputInput";
|
|
16
|
+
|
|
17
|
+
export { PasswordInputInput };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
+
|
|
6
|
+
const jsxRuntime = require('react/jsx-runtime');
|
|
7
|
+
const react$1 = require('@zag-js/react');
|
|
8
|
+
const react = require('react');
|
|
9
|
+
const factory = require('../factory.cjs');
|
|
10
|
+
const usePasswordInputContext = require('./use-password-input-context.cjs');
|
|
11
|
+
|
|
12
|
+
const PasswordInputLabel = react.forwardRef((props, ref) => {
|
|
13
|
+
const passwordInput = usePasswordInputContext.usePasswordInputContext();
|
|
14
|
+
const mergedProps = react$1.mergeProps(passwordInput.getLabelProps(), props);
|
|
15
|
+
return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.label, { ...mergedProps, ref });
|
|
16
|
+
});
|
|
17
|
+
PasswordInputLabel.displayName = "PasswordInputLabel";
|
|
18
|
+
|
|
19
|
+
exports.PasswordInputLabel = PasswordInputLabel;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { HTMLProps, PolymorphicProps } from '../factory';
|
|
2
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
3
|
+
export interface PasswordInputLabelBaseProps extends PolymorphicProps {
|
|
4
|
+
}
|
|
5
|
+
export interface PasswordInputLabelProps extends HTMLProps<'label'>, PasswordInputLabelBaseProps {
|
|
6
|
+
}
|
|
7
|
+
export declare const PasswordInputLabel: ForwardRefExoticComponent<PasswordInputLabelProps & RefAttributes<HTMLLabelElement>>;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { HTMLProps, PolymorphicProps } from '../factory';
|
|
2
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
3
|
+
export interface PasswordInputLabelBaseProps extends PolymorphicProps {
|
|
4
|
+
}
|
|
5
|
+
export interface PasswordInputLabelProps extends HTMLProps<'label'>, PasswordInputLabelBaseProps {
|
|
6
|
+
}
|
|
7
|
+
export declare const PasswordInputLabel: ForwardRefExoticComponent<PasswordInputLabelProps & RefAttributes<HTMLLabelElement>>;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
import { mergeProps } from '@zag-js/react';
|
|
4
|
+
import { forwardRef } from 'react';
|
|
5
|
+
import { ark } from '../factory.js';
|
|
6
|
+
import { usePasswordInputContext } from './use-password-input-context.js';
|
|
7
|
+
|
|
8
|
+
const PasswordInputLabel = forwardRef((props, ref) => {
|
|
9
|
+
const passwordInput = usePasswordInputContext();
|
|
10
|
+
const mergedProps = mergeProps(passwordInput.getLabelProps(), props);
|
|
11
|
+
return /* @__PURE__ */ jsx(ark.label, { ...mergedProps, ref });
|
|
12
|
+
});
|
|
13
|
+
PasswordInputLabel.displayName = "PasswordInputLabel";
|
|
14
|
+
|
|
15
|
+
export { PasswordInputLabel };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
+
|
|
6
|
+
const jsxRuntime = require('react/jsx-runtime');
|
|
7
|
+
const react$1 = require('@zag-js/react');
|
|
8
|
+
const react = require('react');
|
|
9
|
+
const factory = require('../factory.cjs');
|
|
10
|
+
const usePasswordInputContext = require('./use-password-input-context.cjs');
|
|
11
|
+
|
|
12
|
+
const PasswordInputRootProvider = react.forwardRef((props, ref) => {
|
|
13
|
+
const { value: passwordInput, ...localProps } = props;
|
|
14
|
+
const mergedProps = react$1.mergeProps(passwordInput.getRootProps(), localProps);
|
|
15
|
+
return /* @__PURE__ */ jsxRuntime.jsx(usePasswordInputContext.PasswordInputProvider, { value: passwordInput, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
|
|
16
|
+
});
|
|
17
|
+
PasswordInputRootProvider.displayName = "PasswordInputRootProvider";
|
|
18
|
+
|
|
19
|
+
exports.PasswordInputRootProvider = PasswordInputRootProvider;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { HTMLProps, PolymorphicProps } from '../factory';
|
|
2
|
+
import { UsePasswordInputReturn } from './use-password-input';
|
|
3
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
4
|
+
interface RootProviderProps {
|
|
5
|
+
value: UsePasswordInputReturn;
|
|
6
|
+
}
|
|
7
|
+
export interface PasswordInputRootProviderBaseProps extends RootProviderProps, PolymorphicProps {
|
|
8
|
+
}
|
|
9
|
+
export interface PasswordInputRootProviderProps extends HTMLProps<'div'>, PasswordInputRootProviderBaseProps {
|
|
10
|
+
}
|
|
11
|
+
export declare const PasswordInputRootProvider: ForwardRefExoticComponent<PasswordInputRootProviderProps & RefAttributes<HTMLDivElement>>;
|
|
12
|
+
export {};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { HTMLProps, PolymorphicProps } from '../factory';
|
|
2
|
+
import { UsePasswordInputReturn } from './use-password-input';
|
|
3
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
4
|
+
interface RootProviderProps {
|
|
5
|
+
value: UsePasswordInputReturn;
|
|
6
|
+
}
|
|
7
|
+
export interface PasswordInputRootProviderBaseProps extends RootProviderProps, PolymorphicProps {
|
|
8
|
+
}
|
|
9
|
+
export interface PasswordInputRootProviderProps extends HTMLProps<'div'>, PasswordInputRootProviderBaseProps {
|
|
10
|
+
}
|
|
11
|
+
export declare const PasswordInputRootProvider: ForwardRefExoticComponent<PasswordInputRootProviderProps & RefAttributes<HTMLDivElement>>;
|
|
12
|
+
export {};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
import { mergeProps } from '@zag-js/react';
|
|
4
|
+
import { forwardRef } from 'react';
|
|
5
|
+
import { ark } from '../factory.js';
|
|
6
|
+
import { PasswordInputProvider } from './use-password-input-context.js';
|
|
7
|
+
|
|
8
|
+
const PasswordInputRootProvider = forwardRef((props, ref) => {
|
|
9
|
+
const { value: passwordInput, ...localProps } = props;
|
|
10
|
+
const mergedProps = mergeProps(passwordInput.getRootProps(), localProps);
|
|
11
|
+
return /* @__PURE__ */ jsx(PasswordInputProvider, { value: passwordInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
|
|
12
|
+
});
|
|
13
|
+
PasswordInputRootProvider.displayName = "PasswordInputRootProvider";
|
|
14
|
+
|
|
15
|
+
export { PasswordInputRootProvider };
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
+
|
|
6
|
+
const jsxRuntime = require('react/jsx-runtime');
|
|
7
|
+
const react$1 = require('@zag-js/react');
|
|
8
|
+
const react = require('react');
|
|
9
|
+
const createSplitProps = require('../../utils/create-split-props.cjs');
|
|
10
|
+
const factory = require('../factory.cjs');
|
|
11
|
+
const usePasswordInput = require('./use-password-input.cjs');
|
|
12
|
+
const usePasswordInputContext = require('./use-password-input-context.cjs');
|
|
13
|
+
|
|
14
|
+
const PasswordInputRoot = react.forwardRef((props, ref) => {
|
|
15
|
+
const [usePasswordInputProps, localProps] = createSplitProps.createSplitProps()(props, [
|
|
16
|
+
"autoComplete",
|
|
17
|
+
"defaultVisible",
|
|
18
|
+
"disabled",
|
|
19
|
+
"id",
|
|
20
|
+
"ids",
|
|
21
|
+
"ignorePasswordManagers",
|
|
22
|
+
"invalid",
|
|
23
|
+
"name",
|
|
24
|
+
"onVisibilityChange",
|
|
25
|
+
"readOnly",
|
|
26
|
+
"required",
|
|
27
|
+
"translations",
|
|
28
|
+
"visible"
|
|
29
|
+
]);
|
|
30
|
+
const passwordInput = usePasswordInput.usePasswordInput(usePasswordInputProps);
|
|
31
|
+
const mergedProps = react$1.mergeProps(passwordInput.getRootProps(), localProps);
|
|
32
|
+
return /* @__PURE__ */ jsxRuntime.jsx(usePasswordInputContext.PasswordInputProvider, { value: passwordInput, children: /* @__PURE__ */ jsxRuntime.jsx(factory.ark.div, { ...mergedProps, ref }) });
|
|
33
|
+
});
|
|
34
|
+
PasswordInputRoot.displayName = "PasswordInputRoot";
|
|
35
|
+
|
|
36
|
+
exports.PasswordInputRoot = PasswordInputRoot;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Assign } from '../../types';
|
|
2
|
+
import { HTMLProps, PolymorphicProps } from '../factory';
|
|
3
|
+
import { UsePasswordInputProps } from './use-password-input';
|
|
4
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
5
|
+
export interface PasswordInputRootBaseProps extends UsePasswordInputProps, PolymorphicProps {
|
|
6
|
+
}
|
|
7
|
+
export interface PasswordInputRootProps extends Assign<HTMLProps<'div'>, PasswordInputRootBaseProps> {
|
|
8
|
+
}
|
|
9
|
+
export declare const PasswordInputRoot: ForwardRefExoticComponent<PasswordInputRootProps & RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Assign } from '../../types';
|
|
2
|
+
import { HTMLProps, PolymorphicProps } from '../factory';
|
|
3
|
+
import { UsePasswordInputProps } from './use-password-input';
|
|
4
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
5
|
+
export interface PasswordInputRootBaseProps extends UsePasswordInputProps, PolymorphicProps {
|
|
6
|
+
}
|
|
7
|
+
export interface PasswordInputRootProps extends Assign<HTMLProps<'div'>, PasswordInputRootBaseProps> {
|
|
8
|
+
}
|
|
9
|
+
export declare const PasswordInputRoot: ForwardRefExoticComponent<PasswordInputRootProps & RefAttributes<HTMLDivElement>>;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
import { mergeProps } from '@zag-js/react';
|
|
4
|
+
import { forwardRef } from 'react';
|
|
5
|
+
import { createSplitProps } from '../../utils/create-split-props.js';
|
|
6
|
+
import { ark } from '../factory.js';
|
|
7
|
+
import { usePasswordInput } from './use-password-input.js';
|
|
8
|
+
import { PasswordInputProvider } from './use-password-input-context.js';
|
|
9
|
+
|
|
10
|
+
const PasswordInputRoot = forwardRef((props, ref) => {
|
|
11
|
+
const [usePasswordInputProps, localProps] = createSplitProps()(props, [
|
|
12
|
+
"autoComplete",
|
|
13
|
+
"defaultVisible",
|
|
14
|
+
"disabled",
|
|
15
|
+
"id",
|
|
16
|
+
"ids",
|
|
17
|
+
"ignorePasswordManagers",
|
|
18
|
+
"invalid",
|
|
19
|
+
"name",
|
|
20
|
+
"onVisibilityChange",
|
|
21
|
+
"readOnly",
|
|
22
|
+
"required",
|
|
23
|
+
"translations",
|
|
24
|
+
"visible"
|
|
25
|
+
]);
|
|
26
|
+
const passwordInput = usePasswordInput(usePasswordInputProps);
|
|
27
|
+
const mergedProps = mergeProps(passwordInput.getRootProps(), localProps);
|
|
28
|
+
return /* @__PURE__ */ jsx(PasswordInputProvider, { value: passwordInput, children: /* @__PURE__ */ jsx(ark.div, { ...mergedProps, ref }) });
|
|
29
|
+
});
|
|
30
|
+
PasswordInputRoot.displayName = "PasswordInputRoot";
|
|
31
|
+
|
|
32
|
+
export { PasswordInputRoot };
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
+
|
|
6
|
+
const jsxRuntime = require('react/jsx-runtime');
|
|
7
|
+
const react$1 = require('@zag-js/react');
|
|
8
|
+
const react = require('react');
|
|
9
|
+
const factory = require('../factory.cjs');
|
|
10
|
+
const usePasswordInputContext = require('./use-password-input-context.cjs');
|
|
11
|
+
|
|
12
|
+
const PasswordInputVisibilityTrigger = react.forwardRef(
|
|
13
|
+
(props, ref) => {
|
|
14
|
+
const passwordInput = usePasswordInputContext.usePasswordInputContext();
|
|
15
|
+
const mergedProps = react$1.mergeProps(passwordInput.getVisibilityTriggerProps(), props);
|
|
16
|
+
return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.button, { ...mergedProps, ref });
|
|
17
|
+
}
|
|
18
|
+
);
|
|
19
|
+
PasswordInputVisibilityTrigger.displayName = "PasswordInputVisibilityTrigger";
|
|
20
|
+
|
|
21
|
+
exports.PasswordInputVisibilityTrigger = PasswordInputVisibilityTrigger;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { HTMLProps, PolymorphicProps } from '../factory';
|
|
2
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
3
|
+
export interface PasswordInputVisibilityTriggerBaseProps extends PolymorphicProps {
|
|
4
|
+
}
|
|
5
|
+
export interface PasswordInputVisibilityTriggerProps extends HTMLProps<'button'>, PasswordInputVisibilityTriggerBaseProps {
|
|
6
|
+
}
|
|
7
|
+
export declare const PasswordInputVisibilityTrigger: ForwardRefExoticComponent<PasswordInputVisibilityTriggerProps & RefAttributes<HTMLButtonElement>>;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { HTMLProps, PolymorphicProps } from '../factory';
|
|
2
|
+
import { ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
3
|
+
export interface PasswordInputVisibilityTriggerBaseProps extends PolymorphicProps {
|
|
4
|
+
}
|
|
5
|
+
export interface PasswordInputVisibilityTriggerProps extends HTMLProps<'button'>, PasswordInputVisibilityTriggerBaseProps {
|
|
6
|
+
}
|
|
7
|
+
export declare const PasswordInputVisibilityTrigger: ForwardRefExoticComponent<PasswordInputVisibilityTriggerProps & RefAttributes<HTMLButtonElement>>;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
import { mergeProps } from '@zag-js/react';
|
|
4
|
+
import { forwardRef } from 'react';
|
|
5
|
+
import { ark } from '../factory.js';
|
|
6
|
+
import { usePasswordInputContext } from './use-password-input-context.js';
|
|
7
|
+
|
|
8
|
+
const PasswordInputVisibilityTrigger = forwardRef(
|
|
9
|
+
(props, ref) => {
|
|
10
|
+
const passwordInput = usePasswordInputContext();
|
|
11
|
+
const mergedProps = mergeProps(passwordInput.getVisibilityTriggerProps(), props);
|
|
12
|
+
return /* @__PURE__ */ jsx(ark.button, { ...mergedProps, ref });
|
|
13
|
+
}
|
|
14
|
+
);
|
|
15
|
+
PasswordInputVisibilityTrigger.displayName = "PasswordInputVisibilityTrigger";
|
|
16
|
+
|
|
17
|
+
export { PasswordInputVisibilityTrigger };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { anatomy as passwordInputAnatomy } from '@zag-js/password-input';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { anatomy as passwordInputAnatomy } from '@zag-js/password-input';
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
|
+
|
|
5
|
+
const passwordInputContext = require('./password-input-context.cjs');
|
|
6
|
+
const passwordInputControl = require('./password-input-control.cjs');
|
|
7
|
+
const passwordInputIndicator = require('./password-input-indicator.cjs');
|
|
8
|
+
const passwordInputInput = require('./password-input-input.cjs');
|
|
9
|
+
const passwordInputLabel = require('./password-input-label.cjs');
|
|
10
|
+
const passwordInputRoot = require('./password-input-root.cjs');
|
|
11
|
+
const passwordInputRootProvider = require('./password-input-root-provider.cjs');
|
|
12
|
+
const passwordInputVisibilityTrigger = require('./password-input-visibility-trigger.cjs');
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
exports.Context = passwordInputContext.PasswordInputContext;
|
|
17
|
+
exports.Control = passwordInputControl.PasswordInputControl;
|
|
18
|
+
exports.Indicator = passwordInputIndicator.PasswordInputIndicator;
|
|
19
|
+
exports.Input = passwordInputInput.PasswordInputInput;
|
|
20
|
+
exports.Label = passwordInputLabel.PasswordInputLabel;
|
|
21
|
+
exports.Root = passwordInputRoot.PasswordInputRoot;
|
|
22
|
+
exports.RootProvider = passwordInputRootProvider.PasswordInputRootProvider;
|
|
23
|
+
exports.VisibilityTrigger = passwordInputVisibilityTrigger.PasswordInputVisibilityTrigger;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export type { VisibilityChangeDetails } from '@zag-js/password-input';
|
|
2
|
+
export { PasswordInputContext as Context, type PasswordInputContextProps as ContextProps, } from './password-input-context';
|
|
3
|
+
export { PasswordInputControl as Control, type PasswordInputControlBaseProps as ControlBaseProps, type PasswordInputControlProps as ControlProps, } from './password-input-control';
|
|
4
|
+
export { PasswordInputIndicator as Indicator, type PasswordInputIndicatorBaseProps as IndicatorBaseProps, type PasswordInputIndicatorProps as IndicatorProps, } from './password-input-indicator';
|
|
5
|
+
export { PasswordInputInput as Input, type PasswordInputInputBaseProps as InputBaseProps, type PasswordInputInputProps as InputProps, } from './password-input-input';
|
|
6
|
+
export { PasswordInputLabel as Label, type PasswordInputLabelBaseProps as LabelBaseProps, type PasswordInputLabelProps as LabelProps, } from './password-input-label';
|
|
7
|
+
export { PasswordInputRoot as Root, type PasswordInputRootBaseProps as RootBaseProps, type PasswordInputRootProps as RootProps, } from './password-input-root';
|
|
8
|
+
export { PasswordInputRootProvider as RootProvider, type PasswordInputRootProviderBaseProps as RootProviderBaseProps, type PasswordInputRootProviderProps as RootProviderProps, } from './password-input-root-provider';
|
|
9
|
+
export { PasswordInputVisibilityTrigger as VisibilityTrigger, type PasswordInputVisibilityTriggerBaseProps as VisibilityTriggerBaseProps, type PasswordInputVisibilityTriggerProps as VisibilityTriggerProps, } from './password-input-visibility-trigger';
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export type { VisibilityChangeDetails } from '@zag-js/password-input';
|
|
2
|
+
export { PasswordInputContext as Context, type PasswordInputContextProps as ContextProps, } from './password-input-context';
|
|
3
|
+
export { PasswordInputControl as Control, type PasswordInputControlBaseProps as ControlBaseProps, type PasswordInputControlProps as ControlProps, } from './password-input-control';
|
|
4
|
+
export { PasswordInputIndicator as Indicator, type PasswordInputIndicatorBaseProps as IndicatorBaseProps, type PasswordInputIndicatorProps as IndicatorProps, } from './password-input-indicator';
|
|
5
|
+
export { PasswordInputInput as Input, type PasswordInputInputBaseProps as InputBaseProps, type PasswordInputInputProps as InputProps, } from './password-input-input';
|
|
6
|
+
export { PasswordInputLabel as Label, type PasswordInputLabelBaseProps as LabelBaseProps, type PasswordInputLabelProps as LabelProps, } from './password-input-label';
|
|
7
|
+
export { PasswordInputRoot as Root, type PasswordInputRootBaseProps as RootBaseProps, type PasswordInputRootProps as RootProps, } from './password-input-root';
|
|
8
|
+
export { PasswordInputRootProvider as RootProvider, type PasswordInputRootProviderBaseProps as RootProviderBaseProps, type PasswordInputRootProviderProps as RootProviderProps, } from './password-input-root-provider';
|
|
9
|
+
export { PasswordInputVisibilityTrigger as VisibilityTrigger, type PasswordInputVisibilityTriggerBaseProps as VisibilityTriggerBaseProps, type PasswordInputVisibilityTriggerProps as VisibilityTriggerProps, } from './password-input-visibility-trigger';
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export { PasswordInputContext as Context } from './password-input-context.js';
|
|
2
|
+
export { PasswordInputControl as Control } from './password-input-control.js';
|
|
3
|
+
export { PasswordInputIndicator as Indicator } from './password-input-indicator.js';
|
|
4
|
+
export { PasswordInputInput as Input } from './password-input-input.js';
|
|
5
|
+
export { PasswordInputLabel as Label } from './password-input-label.js';
|
|
6
|
+
export { PasswordInputRoot as Root } from './password-input-root.js';
|
|
7
|
+
export { PasswordInputRootProvider as RootProvider } from './password-input-root-provider.js';
|
|
8
|
+
export { PasswordInputVisibilityTrigger as VisibilityTrigger } from './password-input-visibility-trigger.js';
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
+
|
|
6
|
+
const createContext = require('../../utils/create-context.cjs');
|
|
7
|
+
|
|
8
|
+
const [PasswordInputProvider, usePasswordInputContext] = createContext.createContext({
|
|
9
|
+
name: "PasswordInputContext",
|
|
10
|
+
hookName: "usePasswordInputContext",
|
|
11
|
+
providerName: "<PasswordInputProvider />"
|
|
12
|
+
});
|
|
13
|
+
|
|
14
|
+
exports.PasswordInputProvider = PasswordInputProvider;
|
|
15
|
+
exports.usePasswordInputContext = usePasswordInputContext;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { UsePasswordInputReturn } from './use-password-input';
|
|
2
|
+
import { Provider } from 'react';
|
|
3
|
+
export interface UsePasswordInputContext extends UsePasswordInputReturn {
|
|
4
|
+
}
|
|
5
|
+
export declare const PasswordInputProvider: Provider<UsePasswordInputContext>, usePasswordInputContext: () => UsePasswordInputContext;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { UsePasswordInputReturn } from './use-password-input';
|
|
2
|
+
import { Provider } from 'react';
|
|
3
|
+
export interface UsePasswordInputContext extends UsePasswordInputReturn {
|
|
4
|
+
}
|
|
5
|
+
export declare const PasswordInputProvider: Provider<UsePasswordInputContext>, usePasswordInputContext: () => UsePasswordInputContext;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { createContext } from '../../utils/create-context.js';
|
|
3
|
+
|
|
4
|
+
const [PasswordInputProvider, usePasswordInputContext] = createContext({
|
|
5
|
+
name: "PasswordInputContext",
|
|
6
|
+
hookName: "usePasswordInputContext",
|
|
7
|
+
providerName: "<PasswordInputProvider />"
|
|
8
|
+
});
|
|
9
|
+
|
|
10
|
+
export { PasswordInputProvider, usePasswordInputContext };
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
5
|
+
|
|
6
|
+
const passwordInput = require('@zag-js/password-input');
|
|
7
|
+
const react$1 = require('@zag-js/react');
|
|
8
|
+
const react = require('react');
|
|
9
|
+
const useEnvironmentContext = require('../../providers/environment/use-environment-context.cjs');
|
|
10
|
+
const useLocaleContext = require('../../providers/locale/use-locale-context.cjs');
|
|
11
|
+
const useFieldContext = require('../field/use-field-context.cjs');
|
|
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
|
+
|
|
32
|
+
const usePasswordInput = (props) => {
|
|
33
|
+
const id = react.useId();
|
|
34
|
+
const { getRootNode } = useEnvironmentContext.useEnvironmentContext();
|
|
35
|
+
const { dir } = useLocaleContext.useLocaleContext();
|
|
36
|
+
const field = useFieldContext.useFieldContext();
|
|
37
|
+
const machineProps = {
|
|
38
|
+
id,
|
|
39
|
+
ids: {
|
|
40
|
+
input: field?.ids.control
|
|
41
|
+
},
|
|
42
|
+
disabled: field?.disabled,
|
|
43
|
+
readOnly: field?.readOnly,
|
|
44
|
+
required: field?.required,
|
|
45
|
+
invalid: field?.invalid,
|
|
46
|
+
dir,
|
|
47
|
+
getRootNode,
|
|
48
|
+
...props
|
|
49
|
+
};
|
|
50
|
+
const service = react$1.useMachine(passwordInput__namespace.machine, machineProps);
|
|
51
|
+
return passwordInput__namespace.connect(service, react$1.normalizeProps);
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
exports.usePasswordInput = usePasswordInput;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { PropTypes } from '@zag-js/react';
|
|
2
|
+
import { Optional } from '../../types';
|
|
3
|
+
import * as passwordInput from '@zag-js/password-input';
|
|
4
|
+
export interface UsePasswordInputProps extends Optional<Omit<passwordInput.Props, 'dir' | 'getRootNode'>, 'id'> {
|
|
5
|
+
}
|
|
6
|
+
export interface UsePasswordInputReturn extends passwordInput.Api<PropTypes> {
|
|
7
|
+
}
|
|
8
|
+
export declare const usePasswordInput: (props?: UsePasswordInputProps) => UsePasswordInputReturn;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { PropTypes } from '@zag-js/react';
|
|
2
|
+
import { Optional } from '../../types';
|
|
3
|
+
import * as passwordInput from '@zag-js/password-input';
|
|
4
|
+
export interface UsePasswordInputProps extends Optional<Omit<passwordInput.Props, 'dir' | 'getRootNode'>, 'id'> {
|
|
5
|
+
}
|
|
6
|
+
export interface UsePasswordInputReturn extends passwordInput.Api<PropTypes> {
|
|
7
|
+
}
|
|
8
|
+
export declare const usePasswordInput: (props?: UsePasswordInputProps) => UsePasswordInputReturn;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import * as passwordInput from '@zag-js/password-input';
|
|
3
|
+
import { useMachine, normalizeProps } from '@zag-js/react';
|
|
4
|
+
import { useId } from 'react';
|
|
5
|
+
import { useEnvironmentContext } from '../../providers/environment/use-environment-context.js';
|
|
6
|
+
import { useLocaleContext } from '../../providers/locale/use-locale-context.js';
|
|
7
|
+
import { useFieldContext } from '../field/use-field-context.js';
|
|
8
|
+
|
|
9
|
+
const usePasswordInput = (props) => {
|
|
10
|
+
const id = useId();
|
|
11
|
+
const { getRootNode } = useEnvironmentContext();
|
|
12
|
+
const { dir } = useLocaleContext();
|
|
13
|
+
const field = useFieldContext();
|
|
14
|
+
const machineProps = {
|
|
15
|
+
id,
|
|
16
|
+
ids: {
|
|
17
|
+
input: field?.ids.control
|
|
18
|
+
},
|
|
19
|
+
disabled: field?.disabled,
|
|
20
|
+
readOnly: field?.readOnly,
|
|
21
|
+
required: field?.required,
|
|
22
|
+
invalid: field?.invalid,
|
|
23
|
+
dir,
|
|
24
|
+
getRootNode,
|
|
25
|
+
...props
|
|
26
|
+
};
|
|
27
|
+
const service = useMachine(passwordInput.machine, machineProps);
|
|
28
|
+
return passwordInput.connect(service, normalizeProps);
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
export { usePasswordInput };
|
package/dist/index.cjs
CHANGED
|
@@ -222,6 +222,7 @@ const fieldsetLegend = require('./components/fieldset/fieldset-legend.cjs');
|
|
|
222
222
|
const fieldsetRoot = require('./components/fieldset/fieldset-root.cjs');
|
|
223
223
|
const fieldsetRootProvider = require('./components/fieldset/fieldset-root-provider.cjs');
|
|
224
224
|
const fieldset_anatomy = require('./components/fieldset/fieldset.anatomy.cjs');
|
|
225
|
+
const useFieldset = require('./components/fieldset/use-fieldset.cjs');
|
|
225
226
|
const useFieldsetContext = require('./components/fieldset/use-fieldset-context.cjs');
|
|
226
227
|
const fieldset = require('./components/fieldset/fieldset.cjs');
|
|
227
228
|
const fileUploadClearTrigger = require('./components/file-upload/file-upload-clear-trigger.cjs');
|
|
@@ -341,6 +342,17 @@ const paginationRootProvider = require('./components/pagination/pagination-root-
|
|
|
341
342
|
const usePagination = require('./components/pagination/use-pagination.cjs');
|
|
342
343
|
const usePaginationContext = require('./components/pagination/use-pagination-context.cjs');
|
|
343
344
|
const pagination$1 = require('./components/pagination/pagination.cjs');
|
|
345
|
+
const passwordInputContext = require('./components/password-input/password-input-context.cjs');
|
|
346
|
+
const passwordInputControl = require('./components/password-input/password-input-control.cjs');
|
|
347
|
+
const passwordInputIndicator = require('./components/password-input/password-input-indicator.cjs');
|
|
348
|
+
const passwordInputInput = require('./components/password-input/password-input-input.cjs');
|
|
349
|
+
const passwordInputLabel = require('./components/password-input/password-input-label.cjs');
|
|
350
|
+
const passwordInputRoot = require('./components/password-input/password-input-root.cjs');
|
|
351
|
+
const passwordInputRootProvider = require('./components/password-input/password-input-root-provider.cjs');
|
|
352
|
+
const passwordInputVisibilityTrigger = require('./components/password-input/password-input-visibility-trigger.cjs');
|
|
353
|
+
const usePasswordInput = require('./components/password-input/use-password-input.cjs');
|
|
354
|
+
const usePasswordInputContext = require('./components/password-input/use-password-input-context.cjs');
|
|
355
|
+
const passwordInput$1 = require('./components/password-input/password-input.cjs');
|
|
344
356
|
const pinInputContext = require('./components/pin-input/pin-input-context.cjs');
|
|
345
357
|
const pinInputControl = require('./components/pin-input/pin-input-control.cjs');
|
|
346
358
|
const pinInputHiddenInput = require('./components/pin-input/pin-input-hidden-input.cjs');
|
|
@@ -674,6 +686,7 @@ const listbox = require('@zag-js/listbox');
|
|
|
674
686
|
const menu = require('@zag-js/menu');
|
|
675
687
|
const numberInput = require('@zag-js/number-input');
|
|
676
688
|
const pagination = require('@zag-js/pagination');
|
|
689
|
+
const passwordInput = require('@zag-js/password-input');
|
|
677
690
|
const pinInput = require('@zag-js/pin-input');
|
|
678
691
|
const popover = require('@zag-js/popover');
|
|
679
692
|
const progress = require('@zag-js/progress');
|
|
@@ -926,6 +939,7 @@ exports.FieldsetLegend = fieldsetLegend.FieldsetLegend;
|
|
|
926
939
|
exports.FieldsetRoot = fieldsetRoot.FieldsetRoot;
|
|
927
940
|
exports.FieldsetRootProvider = fieldsetRootProvider.FieldsetRootProvider;
|
|
928
941
|
exports.fieldsetAnatomy = fieldset_anatomy.fieldsetAnatomy;
|
|
942
|
+
exports.useFieldset = useFieldset.useFieldset;
|
|
929
943
|
exports.useFieldsetContext = useFieldsetContext.useFieldsetContext;
|
|
930
944
|
exports.Fieldset = fieldset;
|
|
931
945
|
exports.FileUploadClearTrigger = fileUploadClearTrigger.FileUploadClearTrigger;
|
|
@@ -1045,6 +1059,17 @@ exports.PaginationRootProvider = paginationRootProvider.PaginationRootProvider;
|
|
|
1045
1059
|
exports.usePagination = usePagination.usePagination;
|
|
1046
1060
|
exports.usePaginationContext = usePaginationContext.usePaginationContext;
|
|
1047
1061
|
exports.Pagination = pagination$1;
|
|
1062
|
+
exports.PasswordInputContext = passwordInputContext.PasswordInputContext;
|
|
1063
|
+
exports.PasswordInputControl = passwordInputControl.PasswordInputControl;
|
|
1064
|
+
exports.PasswordInputIndicator = passwordInputIndicator.PasswordInputIndicator;
|
|
1065
|
+
exports.PasswordInputInput = passwordInputInput.PasswordInputInput;
|
|
1066
|
+
exports.PasswordInputLabel = passwordInputLabel.PasswordInputLabel;
|
|
1067
|
+
exports.PasswordInputRoot = passwordInputRoot.PasswordInputRoot;
|
|
1068
|
+
exports.PasswordInputRootProvider = passwordInputRootProvider.PasswordInputRootProvider;
|
|
1069
|
+
exports.PasswordInputVisibilityTrigger = passwordInputVisibilityTrigger.PasswordInputVisibilityTrigger;
|
|
1070
|
+
exports.usePasswordInput = usePasswordInput.usePasswordInput;
|
|
1071
|
+
exports.usePasswordInputContext = usePasswordInputContext.usePasswordInputContext;
|
|
1072
|
+
exports.PasswordInput = passwordInput$1;
|
|
1048
1073
|
exports.PinInputContext = pinInputContext.PinInputContext;
|
|
1049
1074
|
exports.PinInputControl = pinInputControl.PinInputControl;
|
|
1050
1075
|
exports.PinInputHiddenInput = pinInputHiddenInput.PinInputHiddenInput;
|
|
@@ -1430,6 +1455,10 @@ Object.defineProperty(exports, "paginationAnatomy", {
|
|
|
1430
1455
|
enumerable: true,
|
|
1431
1456
|
get: () => pagination.anatomy
|
|
1432
1457
|
});
|
|
1458
|
+
Object.defineProperty(exports, "passwordInputAnatomy", {
|
|
1459
|
+
enumerable: true,
|
|
1460
|
+
get: () => passwordInput.anatomy
|
|
1461
|
+
});
|
|
1433
1462
|
Object.defineProperty(exports, "pinInputAnatomy", {
|
|
1434
1463
|
enumerable: true,
|
|
1435
1464
|
get: () => pinInput.anatomy
|