@adyen/bento-vue2 1.83.0 → 1.84.0

package/dist/chunks/{input-field-password.C7zjyp7f.js → input-field-password.D23H_RvO.js}

@@ -1,17 +1,17 @@
-import { defineComponent as ue, useAttrs as ce, ref as n, provide as pe, computed as u, watch as P } from "vue";
-import { B as ve } from "./button.C5GvPqe5.js";
+import { defineComponent as ue, useAttrs as ce, ref as l, provide as pe, computed as u, watch as P } from "vue";
+import { B as ve } from "./button.DIU6m9wD.js";
 import { B as fe } from "./image.C2D2hKat.js";
-import { B as me } from "./input-field.DsT4AWXC.js";
-import { h as _e } from "./button-actions.BWVq6OZQ.js";
-import { d as be, B as he } from "./typography.Bq-EGj9y.js";
+import { B as me } from "./input-field.hf0_ALq0.js";
+import { h as _e } from "./button-actions.D9n7MxWe.js";
+import { d as he, B as be } from "./typography.Bq-EGj9y.js";
 import { C as Ce } from "./checkmark-circle-fill.BttTCjrM.js";
 import { D as ge } from "./dot.BW9SneIk.js";
 import { S as ke, H as we } from "./show.B_mKPF6I.js";
-import { e as ye, w as Le } from "./index.BDK4hwK_.js";
+import { e as Le, w as ye } from "./index.BDK4hwK_.js";
 import { u as Re } from "./index.B6WW_F-J.js";
 import { g as Q } from "./generate-uid.NJ8tVoha.js";
 import { u as Ee } from "./form-field.D_2g7vaP.js";
-import { b as Ie } from "./dropdown.Dt0_ZUBn.js";
+import { b as Ie } from "./dropdown.C2pXf8Li.js";
 import { T as Te } from "./tooltip.C6YCavPw.js";
 import { n as Ve } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
 import "../assets/input-field-password.css";
@@ -55,25 +55,31 @@ const qe = {
     capsLockEnabled: "Caps lockオン",
     hidePassword: "非表示",
     showPassword: "表示",
-    validationMinLength: "{numberOfCharacters}字",
-    validationRequireLowercase: "小文字{numberOne}字 (a-z)",
-    validationRequireNumeric: "数字{numberOne}字 (0-9)",
-    validationRequireSpecialCharacter: "特殊文字{numberOne}字",
-    validationRequireUppercase: "大文字{numberOne}字 (A-Z)",
-    validationSuggestion: "通貨記号やアクセント付き文字は避けてください。",
-    validationTitle: "パスワードには少なくとも次のものを含める必要があります :"
+    validationChecked: "チェック済み",
+    validationMinLength: "{numberOfCharacters}文字",
+    validationRequireLowercase: "{numberOne} 小文字（a-z）",
+    validationRequireNumeric: "{numberOne} 数値 (0-9)",
+    validationRequireSpecialCharacter: "{numberOne} 特殊文字",
+    validationRequireUppercase: "{numberOne} 大文字 (A-Z)",
+    validationSuggestion: "通貨記号やアクセント付き文字は使用しないでください。",
+    validationTitle: "パスワードには少なくとも次のものを含める必要があります :",
+    validationUnchecked: "チェックなし",
+    validationValid: "入力は有効です"
   },
   "pt-BR": {
-    capsLockEnabled: "Caps lock ativado",
-    hidePassword: "Ocultar",
+    capsLockEnabled: "Caps Lock ativado",
+    hidePassword: "ocultar",
     showPassword: "Exibir",
+    validationChecked: "Checado",
     validationMinLength: "{numberOfCharacters} caracteres",
     validationRequireLowercase: "{numberOne} minúscula (a-z)",
     validationRequireNumeric: "{numberOne} numérico (0-9)",
     validationRequireSpecialCharacter: "{numberOne} caractere especial",
     validationRequireUppercase: "{numberOne} maiúscula (A-Z)",
-    validationSuggestion: "Evite símbolos de moeda ou letras acentuadas.",
-    validationTitle: "A senha deve conter pelo menos:"
+    validationSuggestion: "Evite usar símbolos de moeda e letras com acento.",
+    validationTitle: "A senha deve conter pelo menos:",
+    validationUnchecked: "Não verificado",
+    validationValid: "A entrada é válida"
   }
 }, Z = 12, z = 500, X = 2e3, G = 2e3, Me = {
   i18n: { messages: qe },
@@ -101,9 +107,9 @@ const qe = {
   },
   emits: ["blur", "focus", "input:valid", "input:error", "input", "update:model-value"],
   setup(o, { emit: t }) {
-    const a = o, { t: e, n: d } = Re(), v = ce(), b = n(g.PASSWORD), c = n(a.modelValue ?? a.value), O = n(!1), S = n(!1), w = n([]), L = n({}), p = n(null), f = n(!1), U = n(null), A = n(null), J = n(null), R = n(!1);
+    const a = o, { t: e, n: d } = Re(), v = ce(), h = l(g.PASSWORD), c = l(a.modelValue ?? a.value), O = l(!1), S = l(!1), w = l([]), y = l({}), p = l(null), f = l(!1), U = l(null), A = l(null), J = l(null), R = l(!1);
     pe(Ie, "bento-input-field-password");
-    const { focused: B } = ye(U), { emitValue: q } = Ee(t), K = Q("validationListId"), M = Q("validationPopoverId"), N = u(() => b.value === g.TEXT), Y = u(
+    const { focused: B } = Le(U), { emitValue: q } = Ee(t), K = Q("validationListId"), M = Q("validationPopoverId"), N = u(() => h.value === g.TEXT), Y = u(
       () => w.value.map(
         (i) => i ? "b-input-field-password__validation-list--valid" : "b-input-field-password__validation-list--invalid"
       )
@@ -119,13 +125,13 @@ const qe = {
       readonly: a.readonly,
       required: a.required,
       tooltipText: a.tooltipText,
-      type: b.value,
+      type: h.value,
       modelValue: c.value,
       "aria-haspopup": I.value ? "dialog" : !1,
       "aria-describedby": I.value ? M : "",
       ...v
     })), E = u(() => {
-      var m, h, l, C, y, x;
+      var m, b, n, C, L, x;
       if (a.validation && !a.validation.extendDefaultValidation)
         return a.validation;
       const i = [
@@ -157,14 +163,14 @@ const qe = {
       ];
       let s = i;
       if (a.validation) {
-        const ne = i.map((r) => r.key), V = (h = (m = a.validation) == null ? void 0 : m.list) == null ? void 0 : h.map((r) => r.key), re = ((C = (l = a.validation) == null ? void 0 : l.list) == null ? void 0 : C.filter((r) => !ne.includes(r.key))) ?? [];
+        const le = i.map((r) => r.key), V = (b = (m = a.validation) == null ? void 0 : m.list) == null ? void 0 : b.map((r) => r.key), re = ((C = (n = a.validation) == null ? void 0 : n.list) == null ? void 0 : C.filter((r) => !le.includes(r.key))) ?? [];
         s = [...i.map((r) => {
           var D, W;
           return V != null && V.includes(r.key) ? (W = (D = a.validation) == null ? void 0 : D.list) == null ? void 0 : W.find((de) => de.key === r.key) : r;
         }), ...re];
       }
       return {
-        title: ((y = a.validation) == null ? void 0 : y.title) ?? e("validationTitle"),
+        title: ((L = a.validation) == null ? void 0 : L.title) ?? e("validationTitle"),
         suggestion: ((x = a.validation) == null ? void 0 : x.suggestion) ?? e("validationSuggestion"),
         list: s
       };
@@ -182,7 +188,7 @@ const qe = {
     ), ee = (i) => {
       typeof i.getModifierState == "function" && (R.value = i.getModifierState("CapsLock"));
     }, ae = () => {
-      N.value ? b.value = g.PASSWORD : b.value = g.TEXT;
+      N.value ? h.value = g.PASSWORD : h.value = g.TEXT;
     }, te = (i) => {
       a.disabled || (c.value = i, q(c.value));
     }, ie = () => {
@@ -190,23 +196,23 @@ const qe = {
     }, oe = () => {
       t("blur");
     }, T = (i) => {
-      var h;
-      const s = (h = H.value) == null ? void 0 : h.map((l) => ({
-        key: l.key,
-        label: l.label,
-        isValid: l.validate(i, ...l.additionalArgs ?? [])
+      var b;
+      const s = (b = H.value) == null ? void 0 : b.map((n) => ({
+        key: n.key,
+        label: n.label,
+        isValid: n.validate(i, ...n.additionalArgs ?? [])
       }));
       let m = 1;
-      w.value = s == null ? void 0 : s.map((l) => l.isValid), L.value = s == null ? void 0 : s.filter((l) => !l.isValid).reduce((l, C) => {
-        const y = C.key ?? `custom-rule-${m++}`;
+      w.value = s == null ? void 0 : s.map((n) => n.isValid), y.value = s == null ? void 0 : s.filter((n) => !n.isValid).reduce((n, C) => {
+        const L = C.key ?? `custom-rule-${m++}`;
         return {
-          ...l,
-          [y]: C.label
+          ...n,
+          [L]: C.label
         };
       }, {});
     }, se = () => {
       f.value = !1, p.value = null;
-    }, le = () => {
+    }, ne = () => {
       f.value = !0;
     };
     return P(
@@ -220,19 +226,19 @@ const qe = {
       i ? (f.value = !0, p.value = setTimeout(() => {
         p.value = null, f.value = !1;
       }, G)) : (clearTimeout(p.value), p.value = null, f.value = !1);
-    }), Le(
+    }), ye(
       c,
       (i) => {
-        T(i), F.value ? t("input:error", L.value) : t("input:valid");
+        T(i), F.value ? t("input:error", y.value) : t("input:valid");
       },
       // wait for 0.5s before checking validity OR 2s of continuous typing
       { debounce: a.debounceTime, maxWait: X }
-    ), a.value && be(
+    ), a.value && he(
       'BentoInputFieldPassword "value" property',
       `The use of "value" prop in "BentoInputFieldPassword" is no longer supported.
                 Use the "v-model" or "model-value" property instead.`,
       "2.0.0"
-    ), { __sfc: !0, MIN_PASSWORD_LENGTH: Z, DEBOUNCE_DURATION: z, DEBOUNCE_MAX_WAIT: X, TOOLTIP_TIMEOUT: G, t: e, n: d, props: a, emit: t, attrs: v, inputType: b, inputValue: c, isHintDisplayed: O, isTouched: S, passwordValidity: w, errorsList: L, capsLockTooltipTimeoutID: p, isTooltipDisplayed: f, inputFieldPasswordRef: U, inputFieldPasswordInputRef: A, inputFieldPasswordCapsLockIconRef: J, isCapsLockOn: R, focused: B, emitValue: q, validationListId: K, validationPopoverId: M, isPasswordReadable: N, passwordValidityConditionalClass: Y, tooltipConditionalClass: $, inputFieldArgs: j, computedValidations: E, computedValidationList: H, hasErrors: F, hasValidations: I, checkCapsLock: ee, toggleInputType: ae, onUpdateModelValue: te, onFocus: ie, onBlur: oe, checkValidity: T, handleCapsLockMouseLeave: se, handleCapsLockMouseEnter: le, BentoButton: ve, BentoImage: fe, BentoInputField: me, BentoPopover: _e, BentoTypography: he, Tooltip: Te, CheckmarkCircleFillIcon: Ce, DotIcon: ge, HideIcon: we, ShowIcon: ke, CapsLockIcon: Pe };
+    ), { __sfc: !0, MIN_PASSWORD_LENGTH: Z, DEBOUNCE_DURATION: z, DEBOUNCE_MAX_WAIT: X, TOOLTIP_TIMEOUT: G, t: e, n: d, props: a, emit: t, attrs: v, inputType: h, inputValue: c, isHintDisplayed: O, isTouched: S, passwordValidity: w, errorsList: y, capsLockTooltipTimeoutID: p, isTooltipDisplayed: f, inputFieldPasswordRef: U, inputFieldPasswordInputRef: A, inputFieldPasswordCapsLockIconRef: J, isCapsLockOn: R, focused: B, emitValue: q, validationListId: K, validationPopoverId: M, isPasswordReadable: N, passwordValidityConditionalClass: Y, tooltipConditionalClass: $, inputFieldArgs: j, computedValidations: E, computedValidationList: H, hasErrors: F, hasValidations: I, checkCapsLock: ee, toggleInputType: ae, onUpdateModelValue: te, onFocus: ie, onBlur: oe, checkValidity: T, handleCapsLockMouseLeave: se, handleCapsLockMouseEnter: ne, BentoButton: ve, BentoImage: fe, BentoInputField: me, BentoPopover: _e, BentoTypography: be, Tooltip: Te, CheckmarkCircleFillIcon: Ce, DotIcon: ge, HideIcon: we, ShowIcon: ke, CapsLockIcon: Pe };
   }
 });
 var He = function() {
@@ -258,13 +264,13 @@ var He = function() {
   null,
   "57349ba0"
 );
-const la = xe.exports;
+const na = xe.exports;
 export {
   Ue as a,
   Ae as b,
   Be as c,
-  la as i,
+  na as i,
   Oe as m,
   Se as r
 };
-//# sourceMappingURL=input-field-password.C7zjyp7f.js.map
+//# sourceMappingURL=input-field-password.D23H_RvO.js.map

package/dist/chunks/{input-field-password.C7zjyp7f.js.map → input-field-password.D23H_RvO.js.map}

@@ -1 +1 @@
-{"version":3,"file":"input-field-password.C7zjyp7f.js","sources":["../../src/components/input-field-password/input-field-password.types.ts","../../src/components/input-field-password/assets/capslock.svg","../../src/components/input-field-password/utilities/input-field-password.validation.ts","../../src/components/input-field-password/input-field-password.vue"],"sourcesContent":["import type { BentoInputFieldProps, BentoInputFieldValue } from '@/components/input-field/input-field.types';\nimport { type FormField } from '../../types/form-field';\n\n/**\n * Public\n */\n\nexport interface BentoInputFieldPasswordValidationListItem {\n    label?: string;\n    key?: BentoInputFieldPasswordDefaultRuleKeys | string;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    validate?: (value: BentoInputFieldValue, ...args: Array<any>) => boolean;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    additionalArgs?: Array<any>;\n    disabled?: boolean;\n}\n\nexport type BentoInputFieldPasswordDefaultRuleKeys =\n    | 'minLength'\n    | 'requireLowercase'\n    | 'requireNumeric'\n    | 'requireSpecialCharacter'\n    | 'requireUppercase';\n\nexport type BentoInputFieldPasswordErrorsList = Record<BentoInputFieldPasswordDefaultRuleKeys | string, string>;\n\nexport interface BentoInputFieldPasswordValidation {\n    title?: string;\n    suggestion?: string;\n    extendDefaultValidation?: boolean;\n    list: Array<BentoInputFieldPasswordValidationListItem>;\n}\n\nexport interface BentoInputFieldPasswordProps extends FormField {\n    /**\n     * Reduces height of the input\n     */\n    condensed?: BentoInputFieldProps['condensed'];\n\n    /**\n     * The debounce time in milliseconds for running validation and emitting the `input` event after the user has stopped typing.\n     * This helps to avoid excessive validation checks on every keystroke. Defaults to `500`.\n     */\n    debounceTime?: number;\n\n    /**\n     * Performs real-time validations over the input value. Default: `false`.\n     * Disabling the option (set to `true`) will not run pre-defined validations or custom validations defined in the `validation` field.\n     */\n    disableValidation?: boolean;\n\n    /**\n     * Text displayed as the value of the input-field\n     * @deprecated for usage with properties since version 2.0. Use `v-model` or `model-value` instead.\n     */\n    value?: BentoInputFieldProps['value'];\n\n    /**\n     * Text displayed as the value of the input-field\n     */\n    modelValue?: BentoInputFieldProps['modelValue'];\n\n    /**\n     * Configuration object for password field validation.\n     *\n     * This object defines the validation criteria and associated messages for a password field.\n     * It includes the following properties:\n     *\n     * - `title`: The title displayed at the top of the validation hint.\n     * - `suggestion`: The message displayed at the bottom of the validation hint, providing additional guidance.\n     * - `extendDefaultValidation`: Set to true if you want to add your custom rules to the default validation instead of overriding the list.\n     * - `list`: An array of callback functions to be executed on the value after each user input, validating the password against the specified rules.\n     *\n     * By default, the validation checks that:\n     *\n     * - The value has a minimum length of 12 characters.\n     * - The value contains at least one lowercase letter.\n     * - The value contains at least one uppercase letter.\n     * - The value contains at least one numeric digit.\n     * - The value contains at least one special character.\n     *\n     *\n     */\n    validation?: BentoInputFieldPasswordValidation;\n\n    /**\n     * Whether the password validation hint is displayed when the input field is activated via focus or input\n     */\n    withHint?: boolean;\n}\n\n/**\n * Private\n */\n\nexport enum BentoInputFieldPasswordType {\n    TEXT = 'text',\n    PASSWORD = 'password',\n}\n\nexport enum BentoInputFieldPasswordDefaultRule {\n    MIN_LENGTH = 'minLength',\n    REQUIRE_LOWERCASE = 'requireLowercase',\n    REQUIRE_NUMERIC = 'requireNumeric',\n    REQUIRE_SPECIAL_CHARACTER = 'requireSpecialCharacter',\n    REQUIRE_UPPERCASE = 'requireUppercase',\n}\n","export default \"data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='capslock'%3e%3cg%20id='Union'%3e%3cpath%20d='M13.75%205.63952L8%201.03952L2.25%205.63952V7.74999H4.75V11.75H11.25V7.74999H13.75V5.63952ZM6.25%206.24999H3.88809L8%202.96046L12.1119%206.24999H9.75V10.25H6.25V6.24999Z'%20fill='%2300112C'/%3e%3cpath%20d='M11.25%2014.75V13.25H4.75V14.75H11.25Z'%20fill='%2300112C'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e\"","import { type BentoInputFieldValue } from '@/components/input-field';\n\nfunction stringifyValue(value: BentoInputFieldValue): string {\n    return value?.toString() ?? '';\n}\n\n/**\n * Validates if the length of the provided value is greater than or equal to the specified length.\n *\n * @param value - The input value to check.\n * @param length - The minimum required length of the value. Defaults to 12.\n * @returns `true` if the length of the value is greater than or equal to the specified length, `false` otherwise.\n */\nexport function minLength(value: BentoInputFieldValue, length = 12): boolean {\n    return stringifyValue(value).length >= length;\n}\n\n/**\n * Validates if the provided value contains at least one lowercase letter.\n *\n * @param value - The input value to check.\n * @returns `true` if the value contains at least one lowercase letter, `false` otherwise.\n */\nexport function requireLowercase(value: BentoInputFieldValue): boolean {\n    return /[a-z]/.test(stringifyValue(value));\n}\n\n/**\n * Validates if the provided value contains at least one uppercase letter.\n *\n * @param value - The input value to check.\n * @returns `true` if the value contains at least one uppercase letter, `false` otherwise.\n */\nexport function requireUppercase(value: BentoInputFieldValue): boolean {\n    return /[A-Z]/.test(stringifyValue(value));\n}\n\n/**\n * Validates if the provided value contains at least one numerical digit.\n *\n * @param value - The input value to check.\n * @returns `true` if the value contains at least one numerical digit, `false` otherwise.\n */\nexport function requireNumeric(value: BentoInputFieldValue): boolean {\n    return /\\d/.test(stringifyValue(value));\n}\n\n/**\n * Validates if the provided value contains at least one special character (non-alphanumeric).\n *\n * @param value - The input value to check.\n * @returns `true` if the value contains at least one special character, `false` otherwise.\n */\nexport function requireSpecialCharacter(value: BentoInputFieldValue): boolean {\n    return /[^a-zA-Z0-9]/.test(stringifyValue(value));\n}\n","<template>\n    <div ref=\"inputFieldPasswordRef\">\n        <bento-input-field\n            ref=\"inputFieldPasswordInputRef\"\n            v-bind=\"inputFieldArgs\"\n            class=\"b-input-field-password__input\"\n            spellcheck=\"false\"\n            @blur=\"onBlur\"\n            @focus=\"onFocus\"\n            @update:model-value=\"onUpdateModelValue\"\n            @keydown=\"checkCapsLock\"\n            @keyup=\"checkCapsLock\"\n        >\n            <template v-if=\"label\">{{ label }}</template>\n            <template v-else><slot /></template>\n            <template v-if=\"description\" #description>\n                <slot name=\"description\">{{ description }}</slot>\n            </template>\n\n            <template v-if=\"isCapsLockOn\" #iconBefore>\n                <div\n                    class=\"b-input-field-password__caps-lock-indicator\"\n                    @mouseenter=\"handleCapsLockMouseEnter\"\n                    @mouseleave=\"handleCapsLockMouseLeave\"\n                >\n                    <bento-image\n                        ref=\"inputFieldPasswordCapsLockIconRef\"\n                        :src=\"CapsLockIcon\"\n                        :alt=\"t('capsLockEnabled')\"\n                    />\n                </div>\n\n                <tooltip\n                    v-if=\"inputFieldPasswordCapsLockIconRef\"\n                    :class=\"tooltipConditionalClass\"\n                    :content=\"t('capsLockEnabled')\"\n                    :disabled-focus-trap=\"true\"\n                    :fallback-position=\"['top', 'bottom']\"\n                    :is-shown=\"isTooltipDisplayed\"\n                    :target-element=\"inputFieldPasswordCapsLockIconRef\"\n                />\n            </template>\n\n            <template v-if=\"!disabled\" #iconAfter>\n                <bento-button variant=\"tertiary\" @click=\"toggleInputType\">\n                    <template #iconLeft>\n                        <show-icon v-if=\"!isPasswordReadable\" :svg-title=\"t('showPassword')\" />\n                        <hide-icon v-if=\"isPasswordReadable\" :svg-title=\"t('hidePassword')\" />\n                    </template>\n                </bento-button>\n            </template>\n        </bento-input-field>\n\n        <bento-popover\n            v-if=\"hasValidations\"\n            :open=\"isHintDisplayed\"\n            :target-element=\"inputFieldPasswordInputRef\"\n            :disable-focus-trap=\"true\"\n            :aria-label=\"computedValidations.title\"\n            :aria-describedby=\"validationListId\"\n            position=\"right-start\"\n        >\n            <div :id=\"validationPopoverId\">\n                <bento-typography v-if=\"computedValidations.title\" class=\"b-input-field-password__validation-title\">\n                    {{ computedValidations.title }}\n                </bento-typography>\n\n                <p v-if=\"!hasErrors\" class=\"b-input-field-password__validation-status--valid\" role=\"alert\">\n                    {{ t('validationValid') }}\n                </p>\n\n                <ul :id=\"validationListId\" class=\"b-input-field-password__validation-list\">\n                    <li\n                        v-for=\"(rule, index) in computedValidationList\"\n                        :key=\"index\"\n                        :class=\"passwordValidityConditionalClass[index]\"\n                        aria-live=\"polite\"\n                        aria-atomic=\"true\"\n                    >\n                        <span class=\"b-input-field-password__validation-list-icon\">\n                            <checkmark-circle-fill-icon\n                                v-if=\"passwordValidity[index]\"\n                                :svg-title=\"t('validationChecked')\"\n                            />\n\n                            <dot-icon v-else :svg-title=\"t('validationUnchecked')\" />\n                        </span>\n\n                        <bento-typography class=\"b-input-field-password__validation-list-text\" el=\"span\">\n                            {{ rule.label }}\n                        </bento-typography>\n                    </li>\n                </ul>\n\n                <bento-typography\n                    v-if=\"computedValidations.suggestion\"\n                    class=\"b-input-field-password__validation-suggestion\"\n                >\n                    {{ computedValidations.suggestion }}\n                </bento-typography>\n            </div>\n        </bento-popover>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { BentoButton } from '@/components/button';\n    import { BentoImage } from '@/components/image';\n    import { BentoInputField } from '@/components/input-field';\n    import { BentoPopover } from '@/components/popover';\n    import { BentoTypography } from '@/components/typography';\n    import { Tooltip } from '@/internal';\n    import type { BentoInputFieldProps } from '@/components/input-field/input-field.types';\n    import {\n        BentoInputFieldPasswordDefaultRule,\n        type BentoInputFieldPasswordErrorsList,\n        type BentoInputFieldPasswordProps,\n        BentoInputFieldPasswordType,\n        type BentoInputFieldPasswordValidation,\n        type BentoInputFieldPasswordValidationListItem,\n    } from './input-field-password.types';\n    import CheckmarkCircleFillIcon from '@adyen/ui-assets-icons-16/vue/checkmark-circle-fill';\n    import DotIcon from '@adyen/ui-assets-icons-16/vue/dot';\n    import HideIcon from '@adyen/ui-assets-icons-16/vue/hide';\n    import ShowIcon from '@adyen/ui-assets-icons-16/vue/show';\n    import CapsLockIcon from './assets/capslock.svg';\n\n    import { useFocusWithin, watchDebounced } from '@vueuse/core';\n    import { computed, provide, ref, type SetupContext, useAttrs, watch } from 'vue';\n\n    import { useI18n } from '@/utils/ts/i18n';\n\n    import {\n        minLength,\n        requireLowercase,\n        requireNumeric,\n        requireSpecialCharacter,\n        requireUppercase,\n    } from '@/components/input-field-password/utilities/input-field-password.validation';\n    import { generateUid } from '@/core/utils/ts';\n    import { useFormFieldEmits } from '@/utils/ts/form-field/form-field';\n    import { deprecate } from '@/utils/ts/deprecate';\n\n    import messages from './messages.json';\n    import { INPUT_FIELD_PARENT_COMPONENT_INJECTION_KEY } from '@/components/input-field/input-field.keys';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const { t, n } = useI18n<{ message: MessageSchema }>({ messages });\n\n    const props = defineProps({\n  description: { default: null },\n  disabled: { type: Boolean, default: false },\n  errorMessage: { default: null },\n  label: { default: null },\n  optional: { type: Boolean, default: false },\n  placeholder: { default: '' },\n  readonly: { type: Boolean, default: false },\n  required: { type: Boolean, default: false },\n  tooltipText: { default: null },\n  condensed: { default: false },\n  debounceTime: { default: DEBOUNCE_DURATION },\n  disableValidation: { type: Boolean, default: false },\n  value: { default: undefined },\n  modelValue: { default: undefined },\n  validation: { default: undefined },\n  withHint: { type: Boolean, default: true }\n});\n\n    const emit = defineEmits([\"blur\", \"focus\", \"input:valid\", \"input:error\", \"input\", \"update:model-value\"]);\n\n    const attrs = useAttrs();\n\n    const inputType = ref(BentoInputFieldPasswordType.PASSWORD);\n    const inputValue = ref(props.modelValue ?? props.value);\n    const isHintDisplayed = ref(false);\n    const isTouched = ref(false);\n    const passwordValidity = ref<Array<boolean>>([]);\n    const errorsList = ref<BentoInputFieldPasswordErrorsList>({});\n    const capsLockTooltipTimeoutID = ref<ReturnType<typeof setTimeout>>(null);\n    const isTooltipDisplayed = ref(false);\n    const inputFieldPasswordRef = ref(null);\n    const inputFieldPasswordInputRef = ref(null);\n    const inputFieldPasswordCapsLockIconRef = ref(null);\n    const isCapsLockOn = ref(false);\n\n    provide(INPUT_FIELD_PARENT_COMPONENT_INJECTION_KEY, 'bento-input-field-password');\n\n    const { focused } = useFocusWithin(inputFieldPasswordRef);\n\n    const { emitValue } = useFormFieldEmits<BentoInputFieldPasswordProps['modelValue']>(emit);\n\n    const validationListId = generateUid('validationListId');\n    const validationPopoverId = generateUid('validationPopoverId');\n\n    const isPasswordReadable = computed(() => inputType.value === BentoInputFieldPasswordType.TEXT);\n\n    const passwordValidityConditionalClass = computed(() =>\n        passwordValidity.value.map(validity =>\n            validity\n                ? 'b-input-field-password__validation-list--valid'\n                : 'b-input-field-password__validation-list--invalid'\n        )\n    );\n\n    const tooltipConditionalClass = computed(() =>\n        capsLockTooltipTimeoutID.value ? 'b-input-field-password__input-tooltip--timed' : ''\n    );\n\n    const inputFieldArgs = computed<BentoInputFieldProps & SetupContext['attrs']>(() => ({\n        ariaHidden: false,\n        condensed: props.condensed,\n        disabled: props.disabled,\n        errorMessage: props.errorMessage,\n        optional: props.optional,\n        placeholder: props.placeholder,\n        readonly: props.readonly,\n        required: props.required,\n        tooltipText: props.tooltipText,\n        type: inputType.value,\n        modelValue: inputValue.value,\n\n        'aria-haspopup': hasValidations.value ? 'dialog' : false,\n        'aria-describedby': hasValidations.value ? validationPopoverId : '',\n\n        ...attrs,\n    }));\n\n    const computedValidations = computed<BentoInputFieldPasswordValidation>(() => {\n        if (props.validation && !props.validation.extendDefaultValidation) {\n            return props.validation;\n        }\n\n        const defaultValidationList = [\n            {\n                label: t('validationMinLength', { numberOfCharacters: n(MIN_PASSWORD_LENGTH) }),\n                key: BentoInputFieldPasswordDefaultRule.MIN_LENGTH,\n                validate: minLength,\n            },\n            {\n                label: t('validationRequireLowercase', { numberOne: n(1) }),\n                key: BentoInputFieldPasswordDefaultRule.REQUIRE_LOWERCASE,\n                validate: requireLowercase,\n            },\n            {\n                label: t('validationRequireUppercase', { numberOne: n(1) }),\n                key: BentoInputFieldPasswordDefaultRule.REQUIRE_UPPERCASE,\n                validate: requireUppercase,\n            },\n            {\n                label: t('validationRequireNumeric', { numberOne: n(1) }),\n                key: BentoInputFieldPasswordDefaultRule.REQUIRE_NUMERIC,\n                validate: requireNumeric,\n            },\n            {\n                label: t('validationRequireSpecialCharacter', { numberOne: n(1) }),\n                key: BentoInputFieldPasswordDefaultRule.REQUIRE_SPECIAL_CHARACTER,\n                validate: requireSpecialCharacter,\n            },\n        ];\n\n        let validationList: Array<BentoInputFieldPasswordValidationListItem> = defaultValidationList;\n\n        if (props.validation) {\n            const defaultValidationKeys: Array<string> = defaultValidationList.map(rule => rule.key);\n            const customRuleKeys = props.validation?.list?.map(rule => rule.key);\n            // remove from the custom list any rules with default keys (rules that are overriding existent rules)\n            const customValidationList =\n                props.validation?.list?.filter(rule => !defaultValidationKeys.includes(rule.key)) ?? [];\n\n            // loop through the default list and replace default rule with the custom rule if it exists\n            const validationListWithOverrides = defaultValidationList.map(rule => {\n                if (customRuleKeys?.includes(rule.key)) {\n                    const customRule = props.validation?.list?.find(customRule => customRule.key === rule.key);\n                    return customRule;\n                } else {\n                    return rule;\n                }\n            });\n            validationList = [...validationListWithOverrides, ...customValidationList];\n        }\n\n        return {\n            title: props.validation?.title ?? t('validationTitle'),\n            suggestion: props.validation?.suggestion ?? t('validationSuggestion'),\n            list: validationList,\n        };\n    });\n\n    const computedValidationList = computed(() => computedValidations.value?.list?.filter(rule => !rule.disabled));\n\n    const hasErrors = computed(() => passwordValidity.value?.some(validation => !validation));\n    const hasValidations = computed(\n        () => inputFieldPasswordInputRef.value && computedValidations.value?.list?.length > 0\n    );\n\n    const checkCapsLock = (e: KeyboardEvent) => {\n        // Check if getModifierState exists and is a function in case the user's browser is autofilling\n        if (typeof e.getModifierState === 'function') {\n            isCapsLockOn.value = e.getModifierState('CapsLock');\n        }\n    };\n\n    const toggleInputType = () => {\n        if (isPasswordReadable.value) {\n            inputType.value = BentoInputFieldPasswordType.PASSWORD;\n        } else {\n            inputType.value = BentoInputFieldPasswordType.TEXT;\n        }\n    };\n\n    const onUpdateModelValue = (value: string) => {\n        if (props.disabled) {\n            return;\n        }\n\n        inputValue.value = value;\n\n        emitValue(inputValue.value);\n    };\n\n    const onFocus = () => {\n        emit('focus');\n    };\n\n    const onBlur = () => {\n        emit('blur');\n    };\n\n    const checkValidity = (value: BentoInputFieldPasswordProps['value']) => {\n        const rulesValidityObj = computedValidationList.value?.map(validationItem => ({\n            key: validationItem.key,\n            label: validationItem.label,\n            isValid: validationItem.validate(value, ...(validationItem.additionalArgs ?? [])),\n        }));\n        let customRuleIndex = 1;\n\n        passwordValidity.value = rulesValidityObj?.map(error => error.isValid);\n\n        errorsList.value = rulesValidityObj\n            ?.filter(rule => !rule.isValid)\n            .reduce((errorsObject, error) => {\n                const key = error.key ?? `custom-rule-${customRuleIndex++}`;\n                return {\n                    ...errorsObject,\n                    [key]: error.label,\n                };\n            }, {});\n    };\n\n    const handleCapsLockMouseLeave = () => {\n        isTooltipDisplayed.value = false;\n        capsLockTooltipTimeoutID.value = null;\n    };\n\n    const handleCapsLockMouseEnter = () => {\n        isTooltipDisplayed.value = true;\n    };\n\n    watch(\n        () => [props.value, props.modelValue],\n        () => {\n            inputValue.value = props.modelValue ?? props.value;\n        }\n    );\n\n    watch(focused, focused => {\n        // Always set dirty to true when blur occurs\n        if (!focused) {\n            isTouched.value = true;\n        }\n\n        // Disable validations & hint if \"disableValidation\" is \"true\"\n        if (!props.disableValidation) {\n            if (props.withHint) {\n                isHintDisplayed.value = focused;\n            }\n            checkValidity(inputValue.value);\n        }\n    });\n\n    watch(isCapsLockOn, isCapsLockOn => {\n        if (!isCapsLockOn) {\n            clearTimeout(capsLockTooltipTimeoutID.value);\n\n            capsLockTooltipTimeoutID.value = null;\n            isTooltipDisplayed.value = false;\n        } else {\n            isTooltipDisplayed.value = true;\n\n            capsLockTooltipTimeoutID.value = setTimeout(() => {\n                capsLockTooltipTimeoutID.value = null;\n                isTooltipDisplayed.value = false;\n            }, TOOLTIP_TIMEOUT);\n        }\n    });\n\n    watchDebounced(\n        inputValue,\n        inputValue => {\n            checkValidity(inputValue);\n\n            if (!hasErrors.value) {\n                emit('input:valid');\n            } else {\n                emit('input:error', errorsList.value);\n            }\n        },\n        // wait for 0.5s before checking validity OR 2s of continuous typing\n        { debounce: props.debounceTime, maxWait: DEBOUNCE_MAX_WAIT }\n    );\n\n    if (props.value) {\n        deprecate(\n            'BentoInputFieldPassword \"value\" property',\n            `The use of \"value\" prop in \"BentoInputFieldPassword\" is no longer supported.\n                Use the \"v-model\" or \"model-value\" property instead.`,\n            '2.0.0'\n        );\n    }\n</script>\n\n<script lang=\"ts\">\n    const MIN_PASSWORD_LENGTH = 12;\n    const DEBOUNCE_DURATION = 500;\n    const DEBOUNCE_MAX_WAIT = 2000;\n    const TOOLTIP_TIMEOUT = 2000;\n\n    /**\n     * The input field password is a component designed to support users' preference for entering values securely.\n     * This is an extension of the `bento-input-field` component.\n     *\n     * @example\n     * import { BentoInputFieldPassword } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoInputFieldPassword },\n     *     template: `\n     *          <bento-input-field-password\n     *              label=\"Label\"\n     *              error-message=\"Error\"\n     *              :validation=\"{\n     *                  extendDefaultValidation: true,\n     *                  list: [\n     *                      { label: '18 characters', key: 'minLength', validate: minLength, additionalArgs: [18] },\n     *                      { label: 'Always true', key: 'alwaysTrue', validate: () => true },\n     *                      { key: 'requireSpecialCharacter', disabled: true }\n     *                  ],\n     *              }\"\n     *          />\n     *     `\n     * }\n     */\n    export default {\n        i18n: { messages },\n        name: 'bento-input-field-password',\n        model: { prop: 'modelValue' },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./input-field-password.scss\" />\n"],"names":["BentoInputFieldPasswordType","BentoInputFieldPasswordType2","BentoInputFieldPasswordDefaultRule","BentoInputFieldPasswordDefaultRule2","CapsLockIcon","stringifyValue","value","minLength","length","requireLowercase","requireUppercase","requireNumeric","requireSpecialCharacter","MIN_PASSWORD_LENGTH","DEBOUNCE_DURATION","DEBOUNCE_MAX_WAIT","TOOLTIP_TIMEOUT","__default__","messages","t","n","useI18n","attrs","useAttrs","inputType","ref","inputValue","props","isHintDisplayed","isTouched","passwordValidity","errorsList","capsLockTooltipTimeoutID","isTooltipDisplayed","inputFieldPasswordRef","inputFieldPasswordInputRef","inputFieldPasswordCapsLockIconRef","isCapsLockOn","provide","INPUT_FIELD_PARENT_COMPONENT_INJECTION_KEY","focused","useFocusWithin","emitValue","useFormFieldEmits","emit","validationListId","generateUid","validationPopoverId","isPasswordReadable","computed","passwordValidityConditionalClass","validity","tooltipConditionalClass","inputFieldArgs","hasValidations","computedValidations","defaultValidationList","validationList","defaultValidationKeys","rule","customRuleKeys","_b","_a","customValidationList","_d","_c","customRule2","_e","_f","computedValidationList","hasErrors","validation","checkCapsLock","e","toggleInputType","onUpdateModelValue","onFocus","onBlur","checkValidity","rulesValidityObj","validationItem","customRuleIndex","error","errorsObject","key","handleCapsLockMouseLeave","handleCapsLockMouseEnter","watch","focused2","isCapsLockOn2","watchDebounced","inputValue2","deprecate"],"mappings":"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"}
+{"version":3,"file":"input-field-password.D23H_RvO.js","sources":["../../src/components/input-field-password/input-field-password.types.ts","../../src/components/input-field-password/assets/capslock.svg","../../src/components/input-field-password/utilities/input-field-password.validation.ts","../../src/components/input-field-password/input-field-password.vue"],"sourcesContent":["import type { BentoInputFieldProps, BentoInputFieldValue } from '@/components/input-field/input-field.types';\nimport { type FormField } from '../../types/form-field';\n\n/**\n * Public\n */\n\nexport interface BentoInputFieldPasswordValidationListItem {\n    label?: string;\n    key?: BentoInputFieldPasswordDefaultRuleKeys | string;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    validate?: (value: BentoInputFieldValue, ...args: Array<any>) => boolean;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    additionalArgs?: Array<any>;\n    disabled?: boolean;\n}\n\nexport type BentoInputFieldPasswordDefaultRuleKeys =\n    | 'minLength'\n    | 'requireLowercase'\n    | 'requireNumeric'\n    | 'requireSpecialCharacter'\n    | 'requireUppercase';\n\nexport type BentoInputFieldPasswordErrorsList = Record<BentoInputFieldPasswordDefaultRuleKeys | string, string>;\n\nexport interface BentoInputFieldPasswordValidation {\n    title?: string;\n    suggestion?: string;\n    extendDefaultValidation?: boolean;\n    list: Array<BentoInputFieldPasswordValidationListItem>;\n}\n\nexport interface BentoInputFieldPasswordProps extends FormField {\n    /**\n     * Reduces height of the input\n     */\n    condensed?: BentoInputFieldProps['condensed'];\n\n    /**\n     * The debounce time in milliseconds for running validation and emitting the `input` event after the user has stopped typing.\n     * This helps to avoid excessive validation checks on every keystroke. Defaults to `500`.\n     */\n    debounceTime?: number;\n\n    /**\n     * Performs real-time validations over the input value. Default: `false`.\n     * Disabling the option (set to `true`) will not run pre-defined validations or custom validations defined in the `validation` field.\n     */\n    disableValidation?: boolean;\n\n    /**\n     * Text displayed as the value of the input-field\n     * @deprecated for usage with properties since version 2.0. Use `v-model` or `model-value` instead.\n     */\n    value?: BentoInputFieldProps['value'];\n\n    /**\n     * Text displayed as the value of the input-field\n     */\n    modelValue?: BentoInputFieldProps['modelValue'];\n\n    /**\n     * Configuration object for password field validation.\n     *\n     * This object defines the validation criteria and associated messages for a password field.\n     * It includes the following properties:\n     *\n     * - `title`: The title displayed at the top of the validation hint.\n     * - `suggestion`: The message displayed at the bottom of the validation hint, providing additional guidance.\n     * - `extendDefaultValidation`: Set to true if you want to add your custom rules to the default validation instead of overriding the list.\n     * - `list`: An array of callback functions to be executed on the value after each user input, validating the password against the specified rules.\n     *\n     * By default, the validation checks that:\n     *\n     * - The value has a minimum length of 12 characters.\n     * - The value contains at least one lowercase letter.\n     * - The value contains at least one uppercase letter.\n     * - The value contains at least one numeric digit.\n     * - The value contains at least one special character.\n     *\n     *\n     */\n    validation?: BentoInputFieldPasswordValidation;\n\n    /**\n     * Whether the password validation hint is displayed when the input field is activated via focus or input\n     */\n    withHint?: boolean;\n}\n\n/**\n * Private\n */\n\nexport enum BentoInputFieldPasswordType {\n    TEXT = 'text',\n    PASSWORD = 'password',\n}\n\nexport enum BentoInputFieldPasswordDefaultRule {\n    MIN_LENGTH = 'minLength',\n    REQUIRE_LOWERCASE = 'requireLowercase',\n    REQUIRE_NUMERIC = 'requireNumeric',\n    REQUIRE_SPECIAL_CHARACTER = 'requireSpecialCharacter',\n    REQUIRE_UPPERCASE = 'requireUppercase',\n}\n","export default \"data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='capslock'%3e%3cg%20id='Union'%3e%3cpath%20d='M13.75%205.63952L8%201.03952L2.25%205.63952V7.74999H4.75V11.75H11.25V7.74999H13.75V5.63952ZM6.25%206.24999H3.88809L8%202.96046L12.1119%206.24999H9.75V10.25H6.25V6.24999Z'%20fill='%2300112C'/%3e%3cpath%20d='M11.25%2014.75V13.25H4.75V14.75H11.25Z'%20fill='%2300112C'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e\"","import { type BentoInputFieldValue } from '@/components/input-field';\n\nfunction stringifyValue(value: BentoInputFieldValue): string {\n    return value?.toString() ?? '';\n}\n\n/**\n * Validates if the length of the provided value is greater than or equal to the specified length.\n *\n * @param value - The input value to check.\n * @param length - The minimum required length of the value. Defaults to 12.\n * @returns `true` if the length of the value is greater than or equal to the specified length, `false` otherwise.\n */\nexport function minLength(value: BentoInputFieldValue, length = 12): boolean {\n    return stringifyValue(value).length >= length;\n}\n\n/**\n * Validates if the provided value contains at least one lowercase letter.\n *\n * @param value - The input value to check.\n * @returns `true` if the value contains at least one lowercase letter, `false` otherwise.\n */\nexport function requireLowercase(value: BentoInputFieldValue): boolean {\n    return /[a-z]/.test(stringifyValue(value));\n}\n\n/**\n * Validates if the provided value contains at least one uppercase letter.\n *\n * @param value - The input value to check.\n * @returns `true` if the value contains at least one uppercase letter, `false` otherwise.\n */\nexport function requireUppercase(value: BentoInputFieldValue): boolean {\n    return /[A-Z]/.test(stringifyValue(value));\n}\n\n/**\n * Validates if the provided value contains at least one numerical digit.\n *\n * @param value - The input value to check.\n * @returns `true` if the value contains at least one numerical digit, `false` otherwise.\n */\nexport function requireNumeric(value: BentoInputFieldValue): boolean {\n    return /\\d/.test(stringifyValue(value));\n}\n\n/**\n * Validates if the provided value contains at least one special character (non-alphanumeric).\n *\n * @param value - The input value to check.\n * @returns `true` if the value contains at least one special character, `false` otherwise.\n */\nexport function requireSpecialCharacter(value: BentoInputFieldValue): boolean {\n    return /[^a-zA-Z0-9]/.test(stringifyValue(value));\n}\n","<template>\n    <div ref=\"inputFieldPasswordRef\">\n        <bento-input-field\n            ref=\"inputFieldPasswordInputRef\"\n            v-bind=\"inputFieldArgs\"\n            class=\"b-input-field-password__input\"\n            spellcheck=\"false\"\n            @blur=\"onBlur\"\n            @focus=\"onFocus\"\n            @update:model-value=\"onUpdateModelValue\"\n            @keydown=\"checkCapsLock\"\n            @keyup=\"checkCapsLock\"\n        >\n            <template v-if=\"label\">{{ label }}</template>\n            <template v-else><slot /></template>\n            <template v-if=\"description\" #description>\n                <slot name=\"description\">{{ description }}</slot>\n            </template>\n\n            <template v-if=\"isCapsLockOn\" #iconBefore>\n                <div\n                    class=\"b-input-field-password__caps-lock-indicator\"\n                    @mouseenter=\"handleCapsLockMouseEnter\"\n                    @mouseleave=\"handleCapsLockMouseLeave\"\n                >\n                    <bento-image\n                        ref=\"inputFieldPasswordCapsLockIconRef\"\n                        :src=\"CapsLockIcon\"\n                        :alt=\"t('capsLockEnabled')\"\n                    />\n                </div>\n\n                <tooltip\n                    v-if=\"inputFieldPasswordCapsLockIconRef\"\n                    :class=\"tooltipConditionalClass\"\n                    :content=\"t('capsLockEnabled')\"\n                    :disabled-focus-trap=\"true\"\n                    :fallback-position=\"['top', 'bottom']\"\n                    :is-shown=\"isTooltipDisplayed\"\n                    :target-element=\"inputFieldPasswordCapsLockIconRef\"\n                />\n            </template>\n\n            <template v-if=\"!disabled\" #iconAfter>\n                <bento-button variant=\"tertiary\" @click=\"toggleInputType\">\n                    <template #iconLeft>\n                        <show-icon v-if=\"!isPasswordReadable\" :svg-title=\"t('showPassword')\" />\n                        <hide-icon v-if=\"isPasswordReadable\" :svg-title=\"t('hidePassword')\" />\n                    </template>\n                </bento-button>\n            </template>\n        </bento-input-field>\n\n        <bento-popover\n            v-if=\"hasValidations\"\n            :open=\"isHintDisplayed\"\n            :target-element=\"inputFieldPasswordInputRef\"\n            :disable-focus-trap=\"true\"\n            :aria-label=\"computedValidations.title\"\n            :aria-describedby=\"validationListId\"\n            position=\"right-start\"\n        >\n            <div :id=\"validationPopoverId\">\n                <bento-typography v-if=\"computedValidations.title\" class=\"b-input-field-password__validation-title\">\n                    {{ computedValidations.title }}\n                </bento-typography>\n\n                <p v-if=\"!hasErrors\" class=\"b-input-field-password__validation-status--valid\" role=\"alert\">\n                    {{ t('validationValid') }}\n                </p>\n\n                <ul :id=\"validationListId\" class=\"b-input-field-password__validation-list\">\n                    <li\n                        v-for=\"(rule, index) in computedValidationList\"\n                        :key=\"index\"\n                        :class=\"passwordValidityConditionalClass[index]\"\n                        aria-live=\"polite\"\n                        aria-atomic=\"true\"\n                    >\n                        <span class=\"b-input-field-password__validation-list-icon\">\n                            <checkmark-circle-fill-icon\n                                v-if=\"passwordValidity[index]\"\n                                :svg-title=\"t('validationChecked')\"\n                            />\n\n                            <dot-icon v-else :svg-title=\"t('validationUnchecked')\" />\n                        </span>\n\n                        <bento-typography class=\"b-input-field-password__validation-list-text\" el=\"span\">\n                            {{ rule.label }}\n                        </bento-typography>\n                    </li>\n                </ul>\n\n                <bento-typography\n                    v-if=\"computedValidations.suggestion\"\n                    class=\"b-input-field-password__validation-suggestion\"\n                >\n                    {{ computedValidations.suggestion }}\n                </bento-typography>\n            </div>\n        </bento-popover>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\n    import { BentoButton } from '@/components/button';\n    import { BentoImage } from '@/components/image';\n    import { BentoInputField } from '@/components/input-field';\n    import { BentoPopover } from '@/components/popover';\n    import { BentoTypography } from '@/components/typography';\n    import { Tooltip } from '@/internal';\n    import type { BentoInputFieldProps } from '@/components/input-field/input-field.types';\n    import {\n        BentoInputFieldPasswordDefaultRule,\n        type BentoInputFieldPasswordErrorsList,\n        type BentoInputFieldPasswordProps,\n        BentoInputFieldPasswordType,\n        type BentoInputFieldPasswordValidation,\n        type BentoInputFieldPasswordValidationListItem,\n    } from './input-field-password.types';\n    import CheckmarkCircleFillIcon from '@adyen/ui-assets-icons-16/vue/checkmark-circle-fill';\n    import DotIcon from '@adyen/ui-assets-icons-16/vue/dot';\n    import HideIcon from '@adyen/ui-assets-icons-16/vue/hide';\n    import ShowIcon from '@adyen/ui-assets-icons-16/vue/show';\n    import CapsLockIcon from './assets/capslock.svg';\n\n    import { useFocusWithin, watchDebounced } from '@vueuse/core';\n    import { computed, provide, ref, type SetupContext, useAttrs, watch } from 'vue';\n\n    import { useI18n } from '@/utils/ts/i18n';\n\n    import {\n        minLength,\n        requireLowercase,\n        requireNumeric,\n        requireSpecialCharacter,\n        requireUppercase,\n    } from '@/components/input-field-password/utilities/input-field-password.validation';\n    import { generateUid } from '@/core/utils/ts';\n    import { useFormFieldEmits } from '@/utils/ts/form-field/form-field';\n    import { deprecate } from '@/utils/ts/deprecate';\n\n    import messages from './messages.json';\n    import { INPUT_FIELD_PARENT_COMPONENT_INJECTION_KEY } from '@/components/input-field/input-field.keys';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    const { t, n } = useI18n<{ message: MessageSchema }>({ messages });\n\n    const props = defineProps({\n  description: { default: null },\n  disabled: { type: Boolean, default: false },\n  errorMessage: { default: null },\n  label: { default: null },\n  optional: { type: Boolean, default: false },\n  placeholder: { default: '' },\n  readonly: { type: Boolean, default: false },\n  required: { type: Boolean, default: false },\n  tooltipText: { default: null },\n  condensed: { default: false },\n  debounceTime: { default: DEBOUNCE_DURATION },\n  disableValidation: { type: Boolean, default: false },\n  value: { default: undefined },\n  modelValue: { default: undefined },\n  validation: { default: undefined },\n  withHint: { type: Boolean, default: true }\n});\n\n    const emit = defineEmits([\"blur\", \"focus\", \"input:valid\", \"input:error\", \"input\", \"update:model-value\"]);\n\n    const attrs = useAttrs();\n\n    const inputType = ref(BentoInputFieldPasswordType.PASSWORD);\n    const inputValue = ref(props.modelValue ?? props.value);\n    const isHintDisplayed = ref(false);\n    const isTouched = ref(false);\n    const passwordValidity = ref<Array<boolean>>([]);\n    const errorsList = ref<BentoInputFieldPasswordErrorsList>({});\n    const capsLockTooltipTimeoutID = ref<ReturnType<typeof setTimeout>>(null);\n    const isTooltipDisplayed = ref(false);\n    const inputFieldPasswordRef = ref(null);\n    const inputFieldPasswordInputRef = ref(null);\n    const inputFieldPasswordCapsLockIconRef = ref(null);\n    const isCapsLockOn = ref(false);\n\n    provide(INPUT_FIELD_PARENT_COMPONENT_INJECTION_KEY, 'bento-input-field-password');\n\n    const { focused } = useFocusWithin(inputFieldPasswordRef);\n\n    const { emitValue } = useFormFieldEmits<BentoInputFieldPasswordProps['modelValue']>(emit);\n\n    const validationListId = generateUid('validationListId');\n    const validationPopoverId = generateUid('validationPopoverId');\n\n    const isPasswordReadable = computed(() => inputType.value === BentoInputFieldPasswordType.TEXT);\n\n    const passwordValidityConditionalClass = computed(() =>\n        passwordValidity.value.map(validity =>\n            validity\n                ? 'b-input-field-password__validation-list--valid'\n                : 'b-input-field-password__validation-list--invalid'\n        )\n    );\n\n    const tooltipConditionalClass = computed(() =>\n        capsLockTooltipTimeoutID.value ? 'b-input-field-password__input-tooltip--timed' : ''\n    );\n\n    const inputFieldArgs = computed<BentoInputFieldProps & SetupContext['attrs']>(() => ({\n        ariaHidden: false,\n        condensed: props.condensed,\n        disabled: props.disabled,\n        errorMessage: props.errorMessage,\n        optional: props.optional,\n        placeholder: props.placeholder,\n        readonly: props.readonly,\n        required: props.required,\n        tooltipText: props.tooltipText,\n        type: inputType.value,\n        modelValue: inputValue.value,\n\n        'aria-haspopup': hasValidations.value ? 'dialog' : false,\n        'aria-describedby': hasValidations.value ? validationPopoverId : '',\n\n        ...attrs,\n    }));\n\n    const computedValidations = computed<BentoInputFieldPasswordValidation>(() => {\n        if (props.validation && !props.validation.extendDefaultValidation) {\n            return props.validation;\n        }\n\n        const defaultValidationList = [\n            {\n                label: t('validationMinLength', { numberOfCharacters: n(MIN_PASSWORD_LENGTH) }),\n                key: BentoInputFieldPasswordDefaultRule.MIN_LENGTH,\n                validate: minLength,\n            },\n            {\n                label: t('validationRequireLowercase', { numberOne: n(1) }),\n                key: BentoInputFieldPasswordDefaultRule.REQUIRE_LOWERCASE,\n                validate: requireLowercase,\n            },\n            {\n                label: t('validationRequireUppercase', { numberOne: n(1) }),\n                key: BentoInputFieldPasswordDefaultRule.REQUIRE_UPPERCASE,\n                validate: requireUppercase,\n            },\n            {\n                label: t('validationRequireNumeric', { numberOne: n(1) }),\n                key: BentoInputFieldPasswordDefaultRule.REQUIRE_NUMERIC,\n                validate: requireNumeric,\n            },\n            {\n                label: t('validationRequireSpecialCharacter', { numberOne: n(1) }),\n                key: BentoInputFieldPasswordDefaultRule.REQUIRE_SPECIAL_CHARACTER,\n                validate: requireSpecialCharacter,\n            },\n        ];\n\n        let validationList: Array<BentoInputFieldPasswordValidationListItem> = defaultValidationList;\n\n        if (props.validation) {\n            const defaultValidationKeys: Array<string> = defaultValidationList.map(rule => rule.key);\n            const customRuleKeys = props.validation?.list?.map(rule => rule.key);\n            // remove from the custom list any rules with default keys (rules that are overriding existent rules)\n            const customValidationList =\n                props.validation?.list?.filter(rule => !defaultValidationKeys.includes(rule.key)) ?? [];\n\n            // loop through the default list and replace default rule with the custom rule if it exists\n            const validationListWithOverrides = defaultValidationList.map(rule => {\n                if (customRuleKeys?.includes(rule.key)) {\n                    const customRule = props.validation?.list?.find(customRule => customRule.key === rule.key);\n                    return customRule;\n                } else {\n                    return rule;\n                }\n            });\n            validationList = [...validationListWithOverrides, ...customValidationList];\n        }\n\n        return {\n            title: props.validation?.title ?? t('validationTitle'),\n            suggestion: props.validation?.suggestion ?? t('validationSuggestion'),\n            list: validationList,\n        };\n    });\n\n    const computedValidationList = computed(() => computedValidations.value?.list?.filter(rule => !rule.disabled));\n\n    const hasErrors = computed(() => passwordValidity.value?.some(validation => !validation));\n    const hasValidations = computed(\n        () => inputFieldPasswordInputRef.value && computedValidations.value?.list?.length > 0\n    );\n\n    const checkCapsLock = (e: KeyboardEvent) => {\n        // Check if getModifierState exists and is a function in case the user's browser is autofilling\n        if (typeof e.getModifierState === 'function') {\n            isCapsLockOn.value = e.getModifierState('CapsLock');\n        }\n    };\n\n    const toggleInputType = () => {\n        if (isPasswordReadable.value) {\n            inputType.value = BentoInputFieldPasswordType.PASSWORD;\n        } else {\n            inputType.value = BentoInputFieldPasswordType.TEXT;\n        }\n    };\n\n    const onUpdateModelValue = (value: string) => {\n        if (props.disabled) {\n            return;\n        }\n\n        inputValue.value = value;\n\n        emitValue(inputValue.value);\n    };\n\n    const onFocus = () => {\n        emit('focus');\n    };\n\n    const onBlur = () => {\n        emit('blur');\n    };\n\n    const checkValidity = (value: BentoInputFieldPasswordProps['value']) => {\n        const rulesValidityObj = computedValidationList.value?.map(validationItem => ({\n            key: validationItem.key,\n            label: validationItem.label,\n            isValid: validationItem.validate(value, ...(validationItem.additionalArgs ?? [])),\n        }));\n        let customRuleIndex = 1;\n\n        passwordValidity.value = rulesValidityObj?.map(error => error.isValid);\n\n        errorsList.value = rulesValidityObj\n            ?.filter(rule => !rule.isValid)\n            .reduce((errorsObject, error) => {\n                const key = error.key ?? `custom-rule-${customRuleIndex++}`;\n                return {\n                    ...errorsObject,\n                    [key]: error.label,\n                };\n            }, {});\n    };\n\n    const handleCapsLockMouseLeave = () => {\n        isTooltipDisplayed.value = false;\n        capsLockTooltipTimeoutID.value = null;\n    };\n\n    const handleCapsLockMouseEnter = () => {\n        isTooltipDisplayed.value = true;\n    };\n\n    watch(\n        () => [props.value, props.modelValue],\n        () => {\n            inputValue.value = props.modelValue ?? props.value;\n        }\n    );\n\n    watch(focused, focused => {\n        // Always set dirty to true when blur occurs\n        if (!focused) {\n            isTouched.value = true;\n        }\n\n        // Disable validations & hint if \"disableValidation\" is \"true\"\n        if (!props.disableValidation) {\n            if (props.withHint) {\n                isHintDisplayed.value = focused;\n            }\n            checkValidity(inputValue.value);\n        }\n    });\n\n    watch(isCapsLockOn, isCapsLockOn => {\n        if (!isCapsLockOn) {\n            clearTimeout(capsLockTooltipTimeoutID.value);\n\n            capsLockTooltipTimeoutID.value = null;\n            isTooltipDisplayed.value = false;\n        } else {\n            isTooltipDisplayed.value = true;\n\n            capsLockTooltipTimeoutID.value = setTimeout(() => {\n                capsLockTooltipTimeoutID.value = null;\n                isTooltipDisplayed.value = false;\n            }, TOOLTIP_TIMEOUT);\n        }\n    });\n\n    watchDebounced(\n        inputValue,\n        inputValue => {\n            checkValidity(inputValue);\n\n            if (!hasErrors.value) {\n                emit('input:valid');\n            } else {\n                emit('input:error', errorsList.value);\n            }\n        },\n        // wait for 0.5s before checking validity OR 2s of continuous typing\n        { debounce: props.debounceTime, maxWait: DEBOUNCE_MAX_WAIT }\n    );\n\n    if (props.value) {\n        deprecate(\n            'BentoInputFieldPassword \"value\" property',\n            `The use of \"value\" prop in \"BentoInputFieldPassword\" is no longer supported.\n                Use the \"v-model\" or \"model-value\" property instead.`,\n            '2.0.0'\n        );\n    }\n</script>\n\n<script lang=\"ts\">\n    const MIN_PASSWORD_LENGTH = 12;\n    const DEBOUNCE_DURATION = 500;\n    const DEBOUNCE_MAX_WAIT = 2000;\n    const TOOLTIP_TIMEOUT = 2000;\n\n    /**\n     * The input field password is a component designed to support users' preference for entering values securely.\n     * This is an extension of the `bento-input-field` component.\n     *\n     * @example\n     * import { BentoInputFieldPassword } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoInputFieldPassword },\n     *     template: `\n     *          <bento-input-field-password\n     *              label=\"Label\"\n     *              error-message=\"Error\"\n     *              :validation=\"{\n     *                  extendDefaultValidation: true,\n     *                  list: [\n     *                      { label: '18 characters', key: 'minLength', validate: minLength, additionalArgs: [18] },\n     *                      { label: 'Always true', key: 'alwaysTrue', validate: () => true },\n     *                      { key: 'requireSpecialCharacter', disabled: true }\n     *                  ],\n     *              }\"\n     *          />\n     *     `\n     * }\n     */\n    export default {\n        i18n: { messages },\n        name: 'bento-input-field-password',\n        model: { prop: 'modelValue' },\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"./input-field-password.scss\" />\n"],"names":["BentoInputFieldPasswordType","BentoInputFieldPasswordType2","BentoInputFieldPasswordDefaultRule","BentoInputFieldPasswordDefaultRule2","CapsLockIcon","stringifyValue","value","minLength","length","requireLowercase","requireUppercase","requireNumeric","requireSpecialCharacter","MIN_PASSWORD_LENGTH","DEBOUNCE_DURATION","DEBOUNCE_MAX_WAIT","TOOLTIP_TIMEOUT","__default__","messages","t","n","useI18n","attrs","useAttrs","inputType","ref","inputValue","props","isHintDisplayed","isTouched","passwordValidity","errorsList","capsLockTooltipTimeoutID","isTooltipDisplayed","inputFieldPasswordRef","inputFieldPasswordInputRef","inputFieldPasswordCapsLockIconRef","isCapsLockOn","provide","INPUT_FIELD_PARENT_COMPONENT_INJECTION_KEY","focused","useFocusWithin","emitValue","useFormFieldEmits","emit","validationListId","generateUid","validationPopoverId","isPasswordReadable","computed","passwordValidityConditionalClass","validity","tooltipConditionalClass","inputFieldArgs","hasValidations","computedValidations","defaultValidationList","validationList","defaultValidationKeys","rule","customRuleKeys","_b","_a","customValidationList","_d","_c","customRule2","_e","_f","computedValidationList","hasErrors","validation","checkCapsLock","e","toggleInputType","onUpdateModelValue","onFocus","onBlur","checkValidity","rulesValidityObj","validationItem","customRuleIndex","error","errorsObject","key","handleCapsLockMouseLeave","handleCapsLockMouseEnter","watch","focused2","isCapsLockOn2","watchDebounced","inputValue2","deprecate"],"mappings":"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"}

package/dist/chunks/{input-field-phone-number.DwuTziSU.js → input-field-phone-number.Bvk2Pvec.js}

@@ -1,9 +1,9 @@
 import { defineComponent as Ae, computed as B, ref as z, provide as Fe, watch as xe, nextTick as we } from "vue";
-import { B as Oe } from "./input-field.DsT4AWXC.js";
+import { B as Oe } from "./input-field.hf0_ALq0.js";
 import { u as Re } from "./index.B6WW_F-J.js";
 import { u as De } from "./form-field.D_2g7vaP.js";
 import { p as Me, d as Le } from "./typography.Bq-EGj9y.js";
-import { b as ke } from "./dropdown.Dt0_ZUBn.js";
+import { b as ke } from "./dropdown.C2pXf8Li.js";
 import { a as nt, u as le } from "./use-country-phon-code.Bui3zD6W.js";
 import { n as Ge } from "./_plugin-vue2_normalizer.CeySl7Fu.js";
 import "../assets/input-field-phone-number.css";
@@ -3184,6 +3184,12 @@ const s1 = ["-", "(", ")", "/", "[", "]", ".", "~"], f1 = (t, e, r) => {
 }, p1 = {
   "en-US": {
     countrySelectorDropdown: "Country selector dropdown"
+  },
+  "ja-JP": {
+    countrySelectorDropdown: "国選択ドロップダウン"
+  },
+  "pt-BR": {
+    countrySelectorDropdown: "Menu suspenso do seletor de país"
   }
 }, v1 = {
   i18n: { messages: p1 },
@@ -3321,4 +3327,4 @@ export {
   g1 as B,
   w1 as i
 };
-//# sourceMappingURL=input-field-phone-number.DwuTziSU.js.map
+//# sourceMappingURL=input-field-phone-number.Bvk2Pvec.js.map