@telefonica/mistica 14.41.0 → 14.42.1

package/dist/icons/icon-amex.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 type Props = {
     role?: string;
-    size?: number;
+    size?: number | string;
 };
 declare const IconAmex: React.FC<Props>;
 export default IconAmex;

package/dist/icons/icon-cvv-amex.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 type Props = {
     role?: string;
-    size?: number;
+    size?: number | string;
     color?: string;
 };
 declare const IconCvvAmex: React.FC<Props>;

package/dist/icons/icon-cvv-visa-mc.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 type Props = {
     role?: string;
-    size?: number;
+    size?: number | string;
     color?: string;
 };
 declare const IconCvvVisaMc: React.FC<Props>;

package/dist/icons/icon-mastercard.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 type Props = {
     role?: string;
-    size?: number;
+    size?: number | string;
 };
 declare const IconMastercard: React.FC<Props>;
 export default IconMastercard;

package/dist/icons/icon-visa.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 type Props = {
     role?: string;
-    size?: number;
+    size?: number | string;
 };
 declare const IconVisa: React.FC<Props>;
 export default IconVisa;

package/dist/index.d.ts

@@ -26,7 +26,7 @@ export { LoadingScreen, BrandLoadingScreen } from './loading-screen';
 export { default as IconButton } from './icon-button';
 export { default as Popover } from './popover';
 export { default as FocusTrap } from './focus-trap';
-export { confirm, alert, dialog } from './dialog';
+export { confirm, alert, dialog, useDialog } from './dialog-context';
 export { default as Badge } from './badge';
 export { default as TextLink } from './text-link';
 export { default as Overlay } from './overlay';
@@ -76,7 +76,7 @@ export { default as Image } from './image';
 export { default as Chip } from './chip';
 export { default as Video } from './video';
 export type { VideoElement } from './video';
-export { Carousel, CenteredCarousel, Slideshow, PageBullets } from './carousel';
+export { Carousel, CenteredCarousel, Slideshow, PageBullets, CarouselContextProvider, useCarouselContext, CarouselContextConsummer, } from './carousel';
 export { Grid, GridItem } from './grid';
 export { default as Sheet, ActionsSheet, InfoSheet, ActionsListSheet, RadioListSheet, SheetBody, } from './sheet';
 export { default as SheetRoot, showSheet } from './sheet-root';

package/dist/index.js

@@ -87,6 +87,12 @@ _export(exports, {
     Carousel: function() {
         return _carousel.Carousel;
     },
+    CarouselContextConsummer: function() {
+        return _carousel.CarouselContextConsummer;
+    },
+    CarouselContextProvider: function() {
+        return _carousel.CarouselContextProvider;
+    },
     CenteredCarousel: function() {
         return _carousel.CenteredCarousel;
     },
@@ -5596,7 +5602,7 @@ _export(exports, {
         return _logo.VivoLogo;
     },
     alert: function() {
-        return _dialog.alert;
+        return _dialogcontext.alert;
     },
     applyAlpha: function() {
         return _color.applyAlpha;
@@ -5605,13 +5611,13 @@ _export(exports, {
         return _blau.palette;
     },
     confirm: function() {
-        return _dialog.confirm;
+        return _dialogcontext.confirm;
     },
     createNestableContext: function() {
         return _nestablecontext.createNestableContext;
     },
     dialog: function() {
-        return _dialog.dialog;
+        return _dialogcontext.dialog;
     },
     getBlauSkin: function() {
         return _blau.getBlauSkin;
@@ -5670,6 +5676,12 @@ _export(exports, {
     useAriaId: function() {
         return _hooks.useAriaId;
     },
+    useCarouselContext: function() {
+        return _carousel.useCarouselContext;
+    },
+    useDialog: function() {
+        return _dialogcontext.useDialog;
+    },
     useDocumentVisibility: function() {
         return _documentvisibility.useDocumentVisibility;
     },
@@ -5745,7 +5757,7 @@ const _loadingscreen = require("./loading-screen.js");
 const _iconbutton = /*#__PURE__*/ _interop_require_default(require("./icon-button.js"));
 const _popover = /*#__PURE__*/ _interop_require_default(require("./popover.js"));
 const _focustrap = /*#__PURE__*/ _interop_require_default(require("./focus-trap.js"));
-const _dialog = require("./dialog.js");
+const _dialogcontext = require("./dialog-context.js");
 const _badge = /*#__PURE__*/ _interop_require_default(require("./badge.js"));
 const _textlink = /*#__PURE__*/ _interop_require_default(require("./text-link.js"));
 const _overlay = /*#__PURE__*/ _interop_require_default(require("./overlay.js"));

package/dist/inline.css-mistica.js

@@ -9,10 +9,10 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    flexInline: function() {
-        return v;
-    },
     fullWidth: function() {
+        return k;
+    },
+    inline: function() {
         return a;
     },
     marginInline: function() {
@@ -21,17 +21,20 @@ _export(exports, {
     noFullWidth: function() {
         return r;
     },
-    vars: function() {
+    stringSpace: function() {
         return b;
     },
+    vars: function() {
+        return e;
+    },
     wrap: function() {
         return f;
     }
 });
 require("./inline.css.ts.vanilla.css-mistica.js");
-var v = "kkfbnv5", a = "kkfbnv7 kkfbnv6", n = "kkfbnv4", r = "kkfbnv9 kkfbnv6", b = {
+var k = "kkfbnv6", a = "kkfbnv5", n = "kkfbnv4", r = "kkfbnv8", b = "kkfbnv9", e = {
     space: "var(--kkfbnv0)",
     spaceMobile: "var(--kkfbnv1)",
     spaceTablet: "var(--kkfbnv2)",
     spaceDesktop: "var(--kkfbnv3)"
-}, f = "kkfbnv8 kkfbnv6";
+}, f = "kkfbnv7";

package/dist/inline.css.d.ts

@@ -5,8 +5,8 @@ export declare const vars: {
     spaceDesktop: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
 };
 export declare const marginInline: string;
-export declare const flexInline: string;
 export declare const inline: string;
 export declare const fullWidth: string;
 export declare const wrap: string;
 export declare const noFullWidth: string;
+export declare const stringSpace: string;

package/dist/inline.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return S;
+        return P;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -126,23 +126,23 @@ const i = (t)=>typeof t == "number" ? `${t}px` : `space-${t}`, A = (t)=>{
     };
     return t.tablet && (e[_inlinecssmistica.vars.spaceTablet] = i(t.tablet)), e;
 }, C = (param)=>{
-    let { space: t, className: e, children: s, role: a, alignItems: m = "stretch", "aria-labelledby": f, fullWidth: p, wrap: u, dataAttributes: c } = param;
-    const d = p || typeof t == "string", { platformOverrides: l } = (0, _hooks.useTheme)(), b = typeof t == "string";
+    let { space: t, className: e, children: s, role: a, alignItems: m = "stretch", "aria-labelledby": p, fullWidth: f, wrap: c, dataAttributes: u } = param;
+    const { platformOverrides: o } = (0, _hooks.useTheme)(), d = typeof t == "string";
     return /* @__PURE__ */ (0, _jsxruntime.jsx)("div", _object_spread_props(_object_spread({
-        className: (0, _classnames.default)(e, (0, _sprinklescssmistica.sprinkles)({
+        className: (0, _classnames.default)(e, _inlinecssmistica.inline, (0, _sprinklescssmistica.sprinkles)({
             alignItems: m
-        }), u ? _inlinecssmistica.wrap : d ? _inlinecssmistica.fullWidth : _inlinecssmistica.noFullWidth, b ? _inlinecssmistica.flexInline : _inlinecssmistica.marginInline),
+        }), c ? _inlinecssmistica.wrap : f ? _inlinecssmistica.fullWidth : _inlinecssmistica.noFullWidth, d ? _inlinecssmistica.stringSpace : _inlinecssmistica.marginInline),
         style: (0, _css.applyCssVars)(A(t)),
         role: a,
-        "aria-labelledby": f
-    }, (0, _dom.getPrefixedDataAttributes)(c, "Inline")), {
+        "aria-labelledby": p
+    }, (0, _dom.getPrefixedDataAttributes)(u, "Inline")), {
         children: _react.Children.map(s, (n)=>n || n === 0 ? /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
                 style: {
                     // Hack to fix https://jira.tid.es/browse/WEB-1683
                     // In iOS the inline component sometimes cuts the last line of the content
-                    paddingBottom: (0, _platform.isIos)(l) && !(0, _platform.isRunningAcceptanceTest)(l) ? 1 : void 0
+                    paddingBottom: (0, _platform.isIos)(o) && !(0, _platform.isRunningAcceptanceTest)(o) ? 1 : void 0
                 },
                 children: n
             }) : null)
     }));
-}, S = C;
+}, P = C;

package/dist/integer-field.js

@@ -11,7 +11,7 @@ function _export(target, all) {
 }
 _export(exports, {
     IntegerInput: function() {
-        return T;
+        return h;
     },
     default: function() {
         return C;
@@ -100,7 +100,7 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const T = (_param)=>{
+const h = (_param)=>{
     var { inputRef: u, value: r, defaultValue: n, type: i = "text" } = _param, o = _object_without_properties(_param, [
         "inputRef",
         "value",
@@ -119,8 +119,8 @@ const T = (_param)=>{
         value: r === void 0 ? void 0 : t(r),
         defaultValue: n === void 0 ? void 0 : t(n)
     }));
-}, h = (_param)=>{
-    var { disabled: u, error: r, helperText: n, name: i, optional: o, validate: t, onChange: c, onChangeValue: e, onBlur: m, value: p, defaultValue: a } = _param, l = _object_without_properties(_param, [
+}, A = (_param)=>{
+    var { disabled: u, error: r, helperText: n, name: i, optional: o, validate: t, onChange: d, onChangeValue: e, onBlur: m, value: a, defaultValue: p, dataAttributes: l } = _param, f = _object_without_properties(_param, [
         "disabled",
         "error",
         "helperText",
@@ -131,23 +131,27 @@ const T = (_param)=>{
         "onChangeValue",
         "onBlur",
         "value",
-        "defaultValue"
+        "defaultValue",
+        "dataAttributes"
     ]);
-    const { texts: f } = (0, _hooks.useTheme)(), g = (0, _formcontext.useFieldProps)({
+    const { texts: g } = (0, _hooks.useTheme)(), I = (0, _formcontext.useFieldProps)({
         name: i,
-        value: p,
-        defaultValue: a,
+        value: a,
+        defaultValue: p,
         processValue: (s)=>s.trim(),
         helperText: n,
         optional: o,
         error: r,
         disabled: u,
         onBlur: m,
-        validate: (s, I)=>s ? t == null ? void 0 : t(s, I) : o ? "" : f.formFieldErrorIsMandatory,
-        onChange: c,
+        validate: (s, F)=>s ? t == null ? void 0 : t(s, F) : o ? "" : g.formFieldErrorIsMandatory,
+        onChange: d,
         onChangeValue: e
     });
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(_textfieldbase.TextFieldBaseAutosuggest, _object_spread_props(_object_spread({}, l, g), {
-        inputComponent: T
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(_textfieldbase.TextFieldBaseAutosuggest, _object_spread_props(_object_spread({}, f, I), {
+        inputComponent: h,
+        dataAttributes: _object_spread({
+            "component-name": "IntegerField"
+        }, l)
     }));
-}, C = h;
+}, C = A;

package/dist/loading-bar.css-mistica.js

@@ -10,21 +10,18 @@ function _export(target, all) {
 }
 _export(exports, {
     hidden: function() {
-        return r;
-    },
-    innerProgress: function() {
         return _;
     },
     portal: function() {
-        return f;
+        return r;
     },
     progress: function() {
-        return y;
+        return f;
     },
     progressContainer: function() {
-        return g;
+        return y;
     }
 });
 require("./sprinkles.css.ts.vanilla.css-mistica.js");
 require("./loading-bar.css.ts.vanilla.css-mistica.js");
-var r = "_1num3qg3", _ = "_1num3qga _1y2v1nfhm", f = "_1num3qg2 _1y2v1nfge _1y2v1nfjp _1y2v1nfk4 _1y2v1nfkj", y = "_1num3qg7 _1y2v1nfgd _1y2v1nfhm _1y2v1nfh5", g = "_1y2v1nfh5 _1y2v1nfjj _1y2v1nfgc _1y2v1nf4k _1y2v1nfhp";
+var _ = "_1num3qg3", r = "_1num3qg2 _1y2v1nfge _1y2v1nfjp _1y2v1nfk4 _1y2v1nfkj", f = "_1num3qg7 _1y2v1nfgd _1y2v1nfh5 _1y2v1nfhm", y = "_1y2v1nfh5 _1y2v1nfjj _1y2v1nfgc _1y2v1nf4j _1y2v1nfhp";

package/dist/loading-bar.css.d.ts

@@ -1,6 +1,4 @@
-export declare const TRANSITION_DURATION_MS = 400;
 export declare const portal: string;
 export declare const hidden: string;
 export declare const progressContainer: string;
 export declare const progress: string;
-export declare const innerProgress: string;

package/dist/loading-bar.js

@@ -71,7 +71,7 @@ function _object_spread_props(target, source) {
     }
     return target;
 }
-const c = (param)=>{
+const l = (param)=>{
     let { visible: a, dataAttributes: o } = param;
     return /* @__PURE__ */ (0, _jsxruntime.jsx)(_portal.Portal, {
         className: (0, _classnames.default)(_loadingbarcssmistica.portal, {
@@ -81,11 +81,8 @@ const c = (param)=>{
             className: _loadingbarcssmistica.progressContainer
         }, (0, _dom.getPrefixedDataAttributes)(o, "LoadingBar")), {
             children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                className: _loadingbarcssmistica.progress,
-                children: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-                    className: _loadingbarcssmistica.innerProgress
-                })
+                className: _loadingbarcssmistica.progress
             })
         }))
     });
-}, u = c;
+}, u = l;

package/dist/month-field.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return G;
+        return U;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -18,6 +18,8 @@ const _environment = require("./utils/environment.js");
 const _iconcalendarregular = /*#__PURE__*/ _interop_require_default(require("./generated/mistica-icons/icon-calendar-regular.js"));
 const _time = require("./utils/time.js");
 const _hooks = require("./hooks.js");
+const _datefieldcssmistica = require("./date-field.css-mistica.js");
+const _textfieldbasecssmistica = require("./text-field-base.css-mistica.js");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -143,8 +145,8 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const j = /*#__PURE__*/ _react.lazy(()=>Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require(/* webpackChunkName: "date-time-picker" */ "./date-time-picker.js")))), z = (_param)=>{
-    var { disabled: l, error: h, helperText: g, name: y, optional: a, validate: s, onChange: D, onChangeValue: n, onBlur: R, value: S, defaultValue: k, min: o, max: i } = _param, d = _object_without_properties(_param, [
+const B = /*#__PURE__*/ _react.lazy(()=>Promise.resolve().then(()=>/*#__PURE__*/ _interop_require_wildcard(require(/* webpackChunkName: "date-time-picker" */ "./date-time-picker.js")))), C = (_param)=>{
+    var { disabled: h, error: g, helperText: D, name: F, optional: f, validate: n, onChange: S, onChangeValue: s, onBlur: y, value: R, defaultValue: k, min: o, max: i, dataAttributes: d } = _param, p = _object_without_properties(_param, [
         "disabled",
         "error",
         "helperText",
@@ -157,43 +159,47 @@ const j = /*#__PURE__*/ _react.lazy(()=>Promise.resolve().then(()=>/*#__PURE__*/
         "value",
         "defaultValue",
         "min",
-        "max"
+        "max",
+        "dataAttributes"
     ]);
-    const F = (t)=>t, I = _react.useMemo(()=>(0, _dom.isInputTypeSupported)("month"), []), { texts: T } = (0, _hooks.useTheme)(), c = (t)=>!(o && t && t < (0, _time.getLocalYearMonthString)(o) || i && t && t > (0, _time.getLocalYearMonthString)(i)), u = (0, _formcontext.useFieldProps)({
-        name: y,
-        value: S,
+    const I = (e)=>e, M = _react.useMemo(()=>(0, _dom.isInputTypeSupported)("month"), []), { texts: T } = (0, _hooks.useTheme)(), m = (e)=>!(o && e && e < (0, _time.getLocalYearMonthString)(o) || i && e && e > (0, _time.getLocalYearMonthString)(i)), u = (0, _formcontext.useFieldProps)({
+        name: F,
+        value: R,
         defaultValue: k,
-        processValue: F,
-        helperText: g,
-        optional: a,
-        error: h,
-        disabled: l,
-        onBlur: R,
-        validate: (t, m)=>c(t) ? s == null ? void 0 : s(t, m) : T.formDateOutOfRangeError,
-        onChange: D,
-        onChangeValue: (t, m)=>{
-            c(t) && (n == null || n(t, m));
+        processValue: I,
+        helperText: D,
+        optional: f,
+        error: g,
+        disabled: h,
+        onBlur: y,
+        validate: (e, c)=>m(e) ? n == null ? void 0 : n(e, c) : T.formDateOutOfRangeError,
+        onChange: S,
+        onChangeValue: (e, c)=>{
+            m(e) && (s == null || s(e, c));
         }
-    }), p = /* @__PURE__ */ (0, _jsxruntime.jsx)(_textfieldbase.TextFieldBaseAutosuggest, _object_spread_props(_object_spread({}, d, u), {
+    }), l = /* @__PURE__ */ (0, _jsxruntime.jsx)(_textfieldbase.TextFieldBaseAutosuggest, _object_spread_props(_object_spread({}, p, u), {
         min: o ? (0, _time.getLocalYearMonthString)(o) : void 0,
         max: i ? (0, _time.getLocalYearMonthString)(i) : void 0,
         type: "month",
         endIconOverlay: /* @__PURE__ */ (0, _jsxruntime.jsx)("div", {
-            style: {
-                position: "absolute",
-                top: 16,
-                right: 16,
-                pointerEvents: "none"
-            },
-            children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconcalendarregular.default, {})
-        })
+            className: _datefieldcssmistica.iconContainer,
+            children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconcalendarregular.default, {
+                size: _textfieldbasecssmistica.iconSize
+            })
+        }),
+        dataAttributes: _object_spread({
+            "component-name": "MonthField"
+        }, d)
     }));
-    return I || (0, _environment.isServerSide)() ? p : /* @__PURE__ */ (0, _jsxruntime.jsx)(_react.Suspense, {
-        fallback: p,
-        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(j, _object_spread_props(_object_spread({}, d, u), {
-            optional: a,
-            isValidDate: (t)=>c((0, _time.getLocalYearMonthString)(t.toDate())),
-            mode: "year-month"
+    return M || (0, _environment.isServerSide)() ? l : /* @__PURE__ */ (0, _jsxruntime.jsx)(_react.Suspense, {
+        fallback: l,
+        children: /* @__PURE__ */ (0, _jsxruntime.jsx)(B, _object_spread_props(_object_spread({}, p, u), {
+            optional: f,
+            isValidDate: (e)=>m((0, _time.getLocalYearMonthString)(e.toDate())),
+            mode: "year-month",
+            dataAttributes: _object_spread({
+                "component-name": "MonthField"
+            }, d)
         }))
     });
-}, G = z;
+}, U = C;

package/dist/package-version.js

@@ -8,4 +8,4 @@ Object.defineProperty(exports, "PACKAGE_VERSION", {
         return o;
     }
 });
-const o = "14.41.0";
+const o = "14.42.1";

package/dist/password-field.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "default", {
     enumerable: true,
     get: function() {
-        return D;
+        return C;
     }
 });
 const _jsxruntime = require("react/jsx-runtime");
@@ -14,10 +14,9 @@ const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
 const _formcontext = require("./form-context.js");
 const _textfieldbase = require("./text-field-base.js");
 const _hooks = require("./hooks.js");
-const _iconbutton = require("./icon-button.js");
 const _iconeyeoffregular = /*#__PURE__*/ _interop_require_default(require("./generated/mistica-icons/icon-eye-off-regular.js"));
 const _iconeyeregular = /*#__PURE__*/ _interop_require_default(require("./generated/mistica-icons/icon-eye-regular.js"));
-const _passwordfieldcssmistica = require("./password-field.css-mistica.js");
+const _textfieldbasecssmistica = require("./text-field-base.css-mistica.js");
 function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -143,20 +142,19 @@ function _object_without_properties_loose(source, excluded) {
     }
     return target;
 }
-const j = (param)=>{
-    let { isVisible: s, setVisibility: i, focus: c } = param;
-    const { texts: a } = (0, _hooks.useTheme)();
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconbutton.BaseIconButton, {
-        "aria-label": a.togglePasswordVisibilityLabel,
+const B = (param)=>{
+    let { isVisible: e, setVisibility: n, focus: i } = param;
+    const { texts: c } = (0, _hooks.useTheme)();
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(_textfieldbase.FieldEndIcon, {
+        Icon: e ? _iconeyeoffregular.default : _iconeyeregular.default,
+        "aria-label": c.togglePasswordVisibilityLabel,
+        className: _textfieldbasecssmistica.endIconWithShadow,
         onPress: ()=>{
-            i(!s), c();
-        },
-        size: 40,
-        className: _passwordfieldcssmistica.shadow,
-        children: s ? /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconeyeoffregular.default, {}) : /* @__PURE__ */ (0, _jsxruntime.jsx)(_iconeyeregular.default, {})
+            n(!e), i();
+        }
     });
-}, q = (_param)=>{
-    var { disabled: s, error: i, helperText: c, name: a, optional: l, validate: m, onChange: p, onChangeValue: d, onBlur: R, value: P, autoComplete: w = "current-password", defaultValue: g } = _param, F = _object_without_properties(_param, [
+}, L = (_param)=>{
+    var { disabled: e, error: n, helperText: i, name: c, optional: f, validate: m, onChange: d, onChangeValue: p, onBlur: P, value: R, autoComplete: w = "current-password", defaultValue: F, dataAttributes: I } = _param, b = _object_without_properties(_param, [
         "disabled",
         "error",
         "helperText",
@@ -168,51 +166,55 @@ const j = (param)=>{
         "onBlur",
         "value",
         "autoComplete",
-        "defaultValue"
+        "defaultValue",
+        "dataAttributes"
     ]);
-    const [u, I] = _react.useState(!1), r = _react.useRef(0), o = _react.useRef(null), b = (t)=>t, x = ()=>{
+    const [a, g] = _react.useState(!1), s = _react.useRef(0), o = _react.useRef(null), x = (t)=>t, y = ()=>{
         const t = o.current;
-        t && (t.selectionStart !== null && (r.current = t.selectionStart), t.focus());
+        t && (t.selectionStart !== null && (s.current = t.selectionStart), t.focus());
     };
     _react.useEffect(()=>{
         const t = o.current;
         if (t) {
-            const y = requestAnimationFrame(()=>{
-                t.selectionStart = r.current, t.selectionEnd = r.current;
+            const A = requestAnimationFrame(()=>{
+                t.selectionStart = s.current, t.selectionEnd = s.current;
             });
             return ()=>{
-                cancelAnimationFrame(y);
+                cancelAnimationFrame(A);
             };
         }
     }, [
-        u,
-        r,
+        a,
+        s,
         o
     ]);
-    const f = (0, _formcontext.useFieldProps)({
-        name: a,
-        value: P,
-        defaultValue: g,
-        processValue: b,
-        helperText: c,
-        optional: l,
-        error: i,
-        disabled: s,
-        onBlur: R,
+    const l = (0, _formcontext.useFieldProps)({
+        name: c,
+        value: R,
+        defaultValue: F,
+        processValue: x,
+        helperText: i,
+        optional: f,
+        error: n,
+        disabled: e,
+        onBlur: P,
         validate: m,
-        onChange: p,
-        onChangeValue: d
+        onChange: d,
+        onChangeValue: p
     });
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(_textfieldbase.TextFieldBaseAutosuggest, _object_spread_props(_object_spread({}, F, f), {
-        type: u ? "text" : "password",
+    return /* @__PURE__ */ (0, _jsxruntime.jsx)(_textfieldbase.TextFieldBaseAutosuggest, _object_spread_props(_object_spread({}, b, l), {
+        type: a ? "text" : "password",
         inputRef: (t)=>{
-            f.inputRef(t), o.current = t;
+            l.inputRef(t), o.current = t;
         },
         autoComplete: w,
-        endIcon: /* @__PURE__ */ (0, _jsxruntime.jsx)(j, {
-            focus: x,
-            isVisible: u,
-            setVisibility: I
-        })
+        endIcon: /* @__PURE__ */ (0, _jsxruntime.jsx)(B, {
+            focus: y,
+            isVisible: a,
+            setVisibility: g
+        }),
+        dataAttributes: _object_spread({
+            "component-name": "PasswordField"
+        }, I)
     }));
-}, D = q;
+}, C = L;