@adyen/bento-vue3 1.1.0 → 1.2.0

package/dist/input-field.js

@@ -1,21 +1,21 @@
-import { defineComponent as q, ref as K, computed as i, resolveComponent as I, openBlock as a, createBlock as l, normalizeClass as X, withCtx as s, createElementBlock as u, createVNode as L, renderSlot as p, createTextVNode as R, toDisplayString as $, createCommentVNode as n, createElementVNode as V, mergeProps as c, withKeys as j } from "vue";
-import { B as J, d as Q, b as Z, a as x } from "./chunks/index.92f7d550.js";
+import { defineComponent as q, ref as j, computed as i, resolveComponent as I, openBlock as a, createBlock as s, normalizeClass as K, withCtx as u, createElementBlock as p, createVNode as L, renderSlot as f, createTextVNode as R, toDisplayString as $, createCommentVNode as n, createElementVNode as V, mergeProps as U, withKeys as X } from "vue";
+import { B as J, d as Q, b as Z, a as x } from "./chunks/index.ebf5f6cf.js";
 import { u as ee } from "./chunks/use-has-slot.068222e6.js";
-import { g as v } from "./chunks/unique-id.a2a2b458.js";
+import { g as S } from "./chunks/unique-id.a2a2b458.js";
 import { u as oe } from "./chunks/i18n.6c402773.js";
-import { B as ae, a as te } from "./chunks/dropdown.374481a8.js";
+import { B as ae, a as te } from "./chunks/dropdown.f9997464.js";
 import { g as ne } from "./chunks/get-slot-text.2db867f8.js";
-import { E as re } from "./chunks/error-message.a65a9abf.js";
+import { E as re } from "./chunks/error-message.b88bb75a.js";
 import { _ as ie } from "./chunks/_plugin-vue_export-helper.dad06003.js";
-import "./assets/index23.css";
-var S = /* @__PURE__ */ ((e) => (e.DEFAULT = "default", e.PAYMENT_METHOD = "payment-method", e.STATIC_VALUE = "static-value", e.DROPDOWN = "dropdown", e))(S || {}), f = /* @__PURE__ */ ((e) => (e.START = "start", e.END = "end", e))(f || {}), D = /* @__PURE__ */ ((e) => (e.DISABLED = "disabled", e.READONLY = "readonly", e.ERROR = "error", e.SMALL_PADDING_LEFT = "small-padding-left", e.SMALL_PADDING_RIGHT = "small-padding-right", e))(D || {}), M = /* @__PURE__ */ ((e) => (e.SEARCH = "search", e.TEXT = "text", e.NUMBER = "number", e))(M || {}), r = /* @__PURE__ */ ((e) => (e.INPUT = "input", e.ESCAPE_PRESSED = "escape-pressed", e.UPDATE_DROPDOWN = "update:dropdown", e.DROPDOWN_INPUT = "dropdown-input", e.FOCUS = "focus", e.CHANGE = "change", e.BLUR = "blur", e.KEYDOWN = "keydown", e))(r || {});
-const U = {
+import "./assets/index17.css";
+var b = /* @__PURE__ */ ((e) => (e.DEFAULT = "default", e.PAYMENT_METHOD = "payment-method", e.STATIC_VALUE = "static-value", e.DROPDOWN = "dropdown", e))(b || {}), l = /* @__PURE__ */ ((e) => (e.START = "start", e.END = "end", e))(l || {}), v = /* @__PURE__ */ ((e) => (e.DISABLED = "disabled", e.READONLY = "readonly", e.ERROR = "error", e.SMALL_PADDING_LEFT = "small-padding-left", e.SMALL_PADDING_RIGHT = "small-padding-right", e))(v || {}), N = /* @__PURE__ */ ((e) => (e.SEARCH = "search", e.TEXT = "text", e.NUMBER = "number", e))(N || {}), r = /* @__PURE__ */ ((e) => (e.INPUT = "input", e.ESCAPE_PRESSED = "escape-pressed", e.UPDATE_DROPDOWN = "update:dropdown", e.DROPDOWN_INPUT = "dropdown-input", e.FOCUS = "focus", e.CHANGE = "change", e.BLUR = "blur", e.KEYDOWN = "keydown", e))(r || {});
+const M = {
   "en-US": {
     optional: "optional",
     required: "required"
   }
 }, de = q({
-  i18n: { messages: U },
+  i18n: { messages: M },
   name: "bento-input-field",
   components: { BentoDropdown: ae, BentoTypography: J, ErrorMessage: re },
   props: {
@@ -44,7 +44,8 @@ const U = {
      */
     dropdownPosition: {
       type: String,
-      default: f.START
+      default: l.START,
+      validator: (e) => Object.values(l).includes(e)
     },
     /**
      * Adds error validation class for outlining input-field.
@@ -82,14 +83,16 @@ const U = {
      */
     staticValuePosition: {
       type: String,
-      default: f.START
+      default: l.START,
+      validator: (e) => Object.values(l).includes(e)
     },
     /**
      * A string specifying the type of control to render.
      */
     type: {
       type: String,
-      default: M.TEXT
+      default: N.TEXT,
+      validator: (e) => Object.values(N).includes(e)
     },
     /**
      * Text displayed as the value of the input-field
@@ -100,7 +103,8 @@ const U = {
      */
     variant: {
       type: String,
-      default: S.DEFAULT
+      default: b.DEFAULT,
+      validator: (e) => Object.values(b).includes(e)
     }
   },
   emits: [
@@ -114,28 +118,28 @@ const U = {
     r.KEYDOWN
   ],
   setup(e, { slots: o, emit: E }) {
-    const { t: N } = oe({ messages: U }), h = ee(o), T = K(null), d = v("input"), y = v("input-dropdown"), m = v("input-static-value"), t = v("input-description"), P = v("input-error"), A = i(
-      () => e.variant === S.STATIC_VALUE && !!o.staticValue
+    const { t: P } = oe({ messages: M }), h = ee(o), T = j(null), d = S("input"), y = S("input-dropdown"), D = S("input-static-value"), t = S("input-description"), O = S("input-error"), A = i(
+      () => e.variant === b.STATIC_VALUE && !!o.staticValue
     ), k = i(
-      () => A.value && e.staticValuePosition === f.START
+      () => A.value && e.staticValuePosition === l.START
     ), C = i(
-      () => A.value && e.staticValuePosition === f.END
-    ), b = i(
-      () => e.variant === S.DROPDOWN && !!e.dropdown
+      () => A.value && e.staticValuePosition === l.END
+    ), m = i(
+      () => e.variant === b.DROPDOWN && !!e.dropdown
     ), B = i(
-      () => b.value && e.dropdownPosition === f.START
-    ), O = i(
-      () => b.value && e.dropdownPosition === f.END
+      () => m.value && e.dropdownPosition === l.START
+    ), c = i(
+      () => m.value && e.dropdownPosition === l.END
     ), w = i(
       () => !e.disabled && !e.readonly && (!!e.errorMessage || e.error)
-    ), H = i(() => b.value === !0 && A.value === !0 ? `${m} ${y}` : b.value === !0 ? `${y}` : A.value === !0 ? `${m}` : null), Y = i(() => e.ariaLabel ? e.ariaLabel : h("default") ? ne(o)("default") : "input field"), W = i(
-      () => `${h("description") ? t : ""} ${w.value && e.errorMessage ? P : ""}`
+    ), H = i(() => m.value === !0 && A.value === !0 ? `${D} ${y}` : m.value === !0 ? `${y}` : A.value === !0 ? `${D}` : null), Y = i(() => e.ariaLabel ? e.ariaLabel : h("default") ? ne(o)("default") : "input field"), W = i(
+      () => `${h("description") ? t : ""} ${w.value && e.errorMessage ? O : ""}`
     ), F = i(() => ({
-      [`b-input-field--${D.DISABLED}`]: e.disabled,
-      [`b-input-field--${D.READONLY}`]: e.readonly,
-      [`b-input-field--${D.ERROR}`]: w.value,
-      [`b-input-field--${D.SMALL_PADDING_LEFT}`]: B.value,
-      [`b-input-field--${D.SMALL_PADDING_RIGHT}`]: O.value
+      [`b-input-field--${v.DISABLED}`]: e.disabled,
+      [`b-input-field--${v.READONLY}`]: e.readonly,
+      [`b-input-field--${v.ERROR}`]: w.value,
+      [`b-input-field--${v.SMALL_PADDING_LEFT}`]: B.value,
+      [`b-input-field--${v.SMALL_PADDING_RIGHT}`]: c.value
     })), G = (g) => {
       e.disabled || E(r.INPUT, g.target.value);
     }, _ = (g) => {
@@ -153,11 +157,11 @@ const U = {
       // Enums
       BentoTypographyVariant: Z,
       BentoTypographyElement: x,
-      BentoInputFieldVariant: S,
+      BentoInputFieldVariant: b,
       BentoDropdownSize: te,
       BentoInputFieldEvent: r,
       // Functions
-      t: N,
+      t: P,
       onDropdownInput: _,
       onInput: G,
       focusInput: z,
@@ -167,14 +171,14 @@ const U = {
       inputFieldElement: T,
       inputFieldId: d,
       dropdownId: y,
-      staticValueId: m,
+      staticValueId: D,
       descriptionId: t,
-      errorId: P,
+      errorId: O,
       shouldDisplayStaticValueAtStart: k,
       shouldDisplayStaticValueAtEnd: C,
-      shouldShowDropdown: b,
+      shouldShowDropdown: m,
       shouldDisplayDropdownAtStart: B,
-      shouldDisplayDropdownAtEnd: O,
+      shouldDisplayDropdownAtEnd: c,
       shouldShowError: w,
       computedAriaOwns: H,
       computedAriaLabel: Y,
@@ -182,17 +186,17 @@ const U = {
     };
   }
 });
-const le = ["for"], se = ["aria-disabled"], ue = ["aria-hidden"], pe = ["aria-hidden"], fe = ["id"], ye = ["id", "aria-label", "aria-describedby", "aria-owns", "aria-invalid", "placeholder", "type", "value", "disabled", "readonly"], De = ["aria-hidden"], me = ["id"], be = ["id"];
-function ve(e, o, E, N, h, T) {
-  const d = I("bento-typography"), y = I("bento-dropdown"), m = I("error-message");
-  return a(), l(d, {
-    class: X(["b-input-field", e.inputFieldConditionalClasses]),
+const le = ["for"], se = ["aria-disabled"], ue = ["aria-hidden"], pe = ["aria-hidden"], fe = ["id"], ye = ["id", "aria-label", "aria-describedby", "aria-owns", "aria-invalid", "placeholder", "type", "value", "disabled", "readonly"], be = ["aria-hidden"], ve = ["id"], De = ["id"];
+function me(e, o, E, P, h, T) {
+  const d = I("bento-typography"), y = I("bento-dropdown"), D = I("error-message");
+  return a(), s(d, {
+    class: K(["b-input-field", e.inputFieldConditionalClasses]),
     "data-testid": "input-text-container",
     el: e.BentoTypographyElement.DIV,
     variant: e.BentoTypographyVariant.BODY
   }, {
-    default: s(() => [
-      e.hasSlot("default") ? (a(), u("label", {
+    default: u(() => [
+      e.hasSlot("default") ? (a(), p("label", {
         key: 0,
         for: e.inputFieldId,
         class: "b-input-field__label",
@@ -204,27 +208,27 @@ function ve(e, o, E, N, h, T) {
           variant: e.BentoTypographyVariant.BODY,
           stronger: ""
         }, {
-          default: s(() => [
-            p(e.$slots, "default", {}, void 0, !0)
+          default: u(() => [
+            f(e.$slots, "default", {}, void 0, !0)
           ]),
           _: 3
         }, 8, ["el", "variant"]),
-        e.optional ? (a(), l(d, {
+        e.optional ? (a(), s(d, {
           key: 0,
           class: "b-input-field__label-requirement",
           el: e.BentoTypographyElement.SPAN
         }, {
-          default: s(() => [
+          default: u(() => [
             R(" (" + $(e.t("optional")) + ") ", 1)
           ]),
           _: 1
         }, 8, ["el"])) : n("", !0),
-        e.required ? (a(), l(d, {
+        e.required ? (a(), s(d, {
           key: 1,
           class: "b-input-field__label-requirement",
           el: e.BentoTypographyElement.SPAN
         }, {
-          default: s(() => [
+          default: u(() => [
             R(" (" + $(e.t("required")) + ") ", 1)
           ]),
           _: 1
@@ -234,41 +238,41 @@ function ve(e, o, E, N, h, T) {
         class: "b-input-field__input-box",
         "aria-disabled": e.disabled
       }, [
-        e.variant === e.BentoInputFieldVariant.DEFAULT && e.hasSlot("defaultIconBefore") ? (a(), u("span", {
+        e.variant === e.BentoInputFieldVariant.DEFAULT && e.hasSlot("defaultIconBefore") ? (a(), p("span", {
           key: 0,
           "aria-hidden": e.ariaHidden ? "true" : void 0,
           class: "b-input-field__default-icon-before"
         }, [
-          p(e.$slots, "defaultIconBefore", {}, void 0, !0)
+          f(e.$slots, "defaultIconBefore", {}, void 0, !0)
         ], 8, ue)) : n("", !0),
-        e.variant === e.BentoInputFieldVariant.PAYMENT_METHOD && e.hasSlot("paymentMethod") ? (a(), u("span", {
+        e.variant === e.BentoInputFieldVariant.PAYMENT_METHOD && e.hasSlot("paymentMethod") ? (a(), p("span", {
           key: 1,
           "aria-hidden": e.ariaHidden ? "true" : void 0,
           class: "b-input-field__payment-method"
         }, [
-          p(e.$slots, "paymentMethod", {}, void 0, !0)
+          f(e.$slots, "paymentMethod", {}, void 0, !0)
         ], 8, pe)) : n("", !0),
-        e.shouldDisplayDropdownAtStart ? (a(), u("div", {
+        e.shouldDisplayDropdownAtStart ? (a(), p("div", {
           key: 2,
           id: e.dropdownId,
           class: "b-input-field__dropdown b-input-field__dropdown--start"
         }, [
-          e.dropdown ? (a(), l(y, c({ key: 0 }, e.dropdown, {
+          e.dropdown ? (a(), s(y, U({ key: 0 }, e.dropdown, {
             size: e.BentoDropdownSize.SMALL,
             disabled: e.disabled,
             readonly: e.readonly,
             onInput: e.onDropdownInput
           }), null, 16, ["size", "disabled", "readonly", "onInput"])) : n("", !0)
         ], 8, fe)) : n("", !0),
-        e.shouldDisplayStaticValueAtStart ? (a(), l(d, {
+        e.shouldDisplayStaticValueAtStart ? (a(), s(d, {
           key: 3,
           id: e.staticValueId,
           class: "b-input-field__static-value b-input-field__static-value--start",
           el: e.BentoTypographyElement.SPAN,
           variant: e.BentoTypographyVariant.BODY
         }, {
-          default: s(() => [
-            p(e.$slots, "staticValue", {}, void 0, !0)
+          default: u(() => [
+            f(e.$slots, "staticValue", {}, void 0, !0)
           ]),
           _: 3
         }, 8, ["id", "el", "variant"])) : n("", !0),
@@ -291,35 +295,35 @@ function ve(e, o, E, N, h, T) {
           onBlur: o[4] || (o[4] = (t) => e.$emit(e.BentoInputFieldEvent.BLUR)),
           onKeydown: [
             o[5] || (o[5] = (t) => e.$emit(e.BentoInputFieldEvent.KEYDOWN, t)),
-            o[6] || (o[6] = j((t) => e.$emit(e.BentoInputFieldEvent.ESCAPE_PRESSED), ["esc"]))
+            o[6] || (o[6] = X((t) => e.$emit(e.BentoInputFieldEvent.ESCAPE_PRESSED), ["esc"]))
           ]
         }, null, 40, ye),
-        e.hasSlot("iconAfter") ? (a(), u("span", {
+        e.hasSlot("iconAfter") ? (a(), p("span", {
           key: 4,
           "aria-hidden": e.ariaHidden ? "true" : void 0,
           class: "b-input-field__icon-after",
           "data-testid": "input-text__icon-after"
         }, [
-          p(e.$slots, "iconAfter", {}, void 0, !0)
-        ], 8, De)) : n("", !0),
-        e.shouldDisplayStaticValueAtEnd ? (a(), l(d, {
+          f(e.$slots, "iconAfter", {}, void 0, !0)
+        ], 8, be)) : n("", !0),
+        e.shouldDisplayStaticValueAtEnd ? (a(), s(d, {
           key: 5,
           id: e.staticValueId,
           class: "b-input-field__static-value b-input-field__static-value--end",
           el: e.BentoTypographyElement.SPAN,
           variant: e.BentoTypographyVariant.BODY
         }, {
-          default: s(() => [
-            p(e.$slots, "staticValue", {}, void 0, !0)
+          default: u(() => [
+            f(e.$slots, "staticValue", {}, void 0, !0)
           ]),
           _: 3
         }, 8, ["id", "el", "variant"])) : n("", !0),
-        e.shouldDisplayDropdownAtEnd ? (a(), u("div", {
+        e.shouldDisplayDropdownAtEnd ? (a(), p("div", {
           key: 6,
           id: e.dropdownId,
           class: "b-input-field__dropdown b-input-field__dropdown--end"
         }, [
-          e.dropdown ? (a(), l(y, c({
+          e.dropdown ? (a(), s(y, U({
             key: 0,
             id: e.dropdownId
           }, e.dropdown, {
@@ -328,15 +332,15 @@ function ve(e, o, E, N, h, T) {
             readonly: e.readonly,
             onInput: e.onDropdownInput
           }), null, 16, ["id", "size", "disabled", "readonly", "onInput"])) : n("", !0)
-        ], 8, me)) : n("", !0)
+        ], 8, ve)) : n("", !0)
       ], 8, se),
-      e.shouldShowError && e.errorMessage ? (a(), l(m, {
+      e.shouldShowError && e.errorMessage ? (a(), s(D, {
         key: 1,
         id: e.errorId,
         "error-message": e.errorMessage,
         class: "b-input-field__error-message"
       }, null, 8, ["id", "error-message"])) : n("", !0),
-      e.hasSlot("description") ? (a(), u("span", {
+      e.hasSlot("description") ? (a(), p("span", {
         key: 2,
         id: e.descriptionId,
         class: "b-input-field__description",
@@ -346,23 +350,23 @@ function ve(e, o, E, N, h, T) {
           el: e.BentoTypographyElement.SPAN,
           variant: e.BentoTypographyVariant.BODY
         }, {
-          default: s(() => [
-            p(e.$slots, "description", { id: "description" }, void 0, !0)
+          default: u(() => [
+            f(e.$slots, "description", { id: "description" }, void 0, !0)
           ]),
           _: 3
         }, 8, ["el", "variant"])
-      ], 8, be)) : n("", !0)
+      ], 8, De)) : n("", !0)
     ]),
     _: 3
   }, 8, ["class", "el", "variant"]);
 }
-const Pe = /* @__PURE__ */ ie(de, [["render", ve], ["__scopeId", "data-v-f5e44e1e"]]);
+const Pe = /* @__PURE__ */ ie(de, [["render", me], ["__scopeId", "data-v-3bde0e5b"]]);
 export {
   Pe as BentoInputField,
-  f as BentoInputFieldElementPosition,
+  l as BentoInputFieldElementPosition,
   r as BentoInputFieldEvent,
-  D as BentoInputFieldStateClass,
-  M as BentoInputFieldType,
-  S as BentoInputFieldVariant
+  v as BentoInputFieldStateClass,
+  N as BentoInputFieldType,
+  b as BentoInputFieldVariant
 };
 //# sourceMappingURL=input-field.js.map

package/dist/input-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-field.js","sources":["../../vue2/src/components/input-field/input-field.types.ts","../../vue2/src/components/input-field/input-field.vue"],"sourcesContent":["import { BentoDropdown } from '@/components/dropdown/';\n\nexport enum BentoInputFieldVariant {\n    DEFAULT = 'default',\n    PAYMENT_METHOD = 'payment-method',\n    STATIC_VALUE = 'static-value',\n    DROPDOWN = 'dropdown',\n}\n\nexport enum BentoInputFieldElementPosition {\n    START = 'start',\n    END = 'end',\n}\n\nexport enum BentoInputFieldStateClass {\n    DISABLED = 'disabled',\n    READONLY = 'readonly',\n    ERROR = 'error',\n    SMALL_PADDING_LEFT = 'small-padding-left',\n    SMALL_PADDING_RIGHT = 'small-padding-right',\n}\n\nexport enum BentoInputFieldType {\n    SEARCH = 'search',\n    TEXT = 'text',\n    NUMBER = 'number',\n}\n\nexport type BentoInputFieldValue = string | number;\n\ntype DropdownProps = InstanceType<typeof BentoDropdown>['$props'];\nexport type BentoInputDropdownProps = {\n    items: DropdownProps['items'];\n    value: DropdownProps['value'];\n};\n\nexport enum BentoInputFieldEvent {\n    INPUT = 'input',\n    ESCAPE_PRESSED = 'escape-pressed',\n    UPDATE_DROPDOWN = 'update:dropdown',\n    DROPDOWN_INPUT = 'dropdown-input',\n    FOCUS = 'focus',\n    CHANGE = 'change',\n    BLUR = 'blur',\n    KEYDOWN = 'keydown',\n}\n","<template>\n    <bento-typography\n        class=\"b-input-field\"\n        data-testid=\"input-text-container\"\n        :class=\"inputFieldConditionalClasses\"\n        :el=\"BentoTypographyElement.DIV\"\n        :variant=\"BentoTypographyVariant.BODY\"\n    >\n        <!-- Label -->\n        <label\n            v-if=\"hasSlot('default')\"\n            :for=\"inputFieldId\"\n            class=\"b-input-field__label\"\n            data-testid=\"input-field-label\"\n            @click=\"focusInput\"\n        >\n            <bento-typography :el=\"BentoTypographyElement.SPAN\" :variant=\"BentoTypographyVariant.BODY\" stronger>\n                <slot></slot>\n            </bento-typography>\n            <bento-typography\n                v-if=\"optional\"\n                class=\"b-input-field__label-requirement\"\n                :el=\"BentoTypographyElement.SPAN\"\n            >\n                ({{ t('optional') }})\n            </bento-typography>\n            <bento-typography\n                v-if=\"required\"\n                class=\"b-input-field__label-requirement\"\n                :el=\"BentoTypographyElement.SPAN\"\n            >\n                ({{ t('required') }})\n            </bento-typography>\n        </label>\n\n        <div class=\"b-input-field__input-box\" :aria-disabled=\"disabled\">\n            <!-- Optional Icon for Default text variant -->\n            <span\n                v-if=\"variant === BentoInputFieldVariant.DEFAULT && hasSlot('defaultIconBefore')\"\n                :aria-hidden=\"ariaHidden ? 'true' : undefined\"\n                class=\"b-input-field__default-icon-before\"\n            >\n                <slot name=\"defaultIconBefore\" />\n            </span>\n\n            <!-- Mandatory Icon for Payment Method variant -->\n            <span\n                v-if=\"variant === BentoInputFieldVariant.PAYMENT_METHOD && hasSlot('paymentMethod')\"\n                :aria-hidden=\"ariaHidden ? 'true' : undefined\"\n                class=\"b-input-field__payment-method\"\n            >\n                <slot name=\"paymentMethod\" />\n            </span>\n\n            <!-- Dropdown at start -->\n            <div\n                v-if=\"shouldDisplayDropdownAtStart\"\n                :id=\"dropdownId\"\n                class=\"b-input-field__dropdown b-input-field__dropdown--start\"\n            >\n                <bento-dropdown\n                    v-if=\"dropdown\"\n                    v-bind=\"dropdown\"\n                    :size=\"BentoDropdownSize.SMALL\"\n                    :disabled=\"disabled\"\n                    :readonly=\"readonly\"\n                    @input=\"onDropdownInput\"\n                />\n            </div>\n\n            <!-- Static Value at start -->\n            <bento-typography\n                v-if=\"shouldDisplayStaticValueAtStart\"\n                :id=\"staticValueId\"\n                class=\"b-input-field__static-value b-input-field__static-value--start\"\n                :el=\"BentoTypographyElement.SPAN\"\n                :variant=\"BentoTypographyVariant.BODY\"\n            >\n                <slot name=\"staticValue\" />\n            </bento-typography>\n\n            <input\n                :id=\"inputFieldId\"\n                ref=\"inputFieldElement\"\n                class=\"b-input-field__input\"\n                :aria-label=\"computedAriaLabel\"\n                :aria-describedby=\"computedAriaDescribedBy\"\n                :aria-owns=\"computedAriaOwns\"\n                :aria-invalid=\"shouldShowError\"\n                :placeholder=\"placeholder\"\n                :type=\"type\"\n                :value=\"value\"\n                :disabled=\"disabled\"\n                :readonly=\"readonly\"\n                @input=\"onInput\"\n                @change=\"$emit(BentoInputFieldEvent.CHANGE)\"\n                @focus=\"$emit(BentoInputFieldEvent.FOCUS)\"\n                @blur=\"$emit(BentoInputFieldEvent.BLUR)\"\n                @keydown=\"$emit(BentoInputFieldEvent.KEYDOWN, $event)\"\n                @keydown.esc=\"$emit(BentoInputFieldEvent.ESCAPE_PRESSED)\"\n            />\n            <span\n                v-if=\"hasSlot('iconAfter')\"\n                :aria-hidden=\"ariaHidden ? 'true' : undefined\"\n                class=\"b-input-field__icon-after\"\n                data-testid=\"input-text__icon-after\"\n            >\n                <slot name=\"iconAfter\" />\n            </span>\n\n            <!-- Static Value at the end -->\n            <bento-typography\n                v-if=\"shouldDisplayStaticValueAtEnd\"\n                :id=\"staticValueId\"\n                class=\"b-input-field__static-value b-input-field__static-value--end\"\n                :el=\"BentoTypographyElement.SPAN\"\n                :variant=\"BentoTypographyVariant.BODY\"\n            >\n                <slot name=\"staticValue\" />\n            </bento-typography>\n\n            <!-- Dropdown at end -->\n            <div\n                v-if=\"shouldDisplayDropdownAtEnd\"\n                :id=\"dropdownId\"\n                class=\"b-input-field__dropdown b-input-field__dropdown--end\"\n            >\n                <bento-dropdown\n                    v-if=\"dropdown\"\n                    :id=\"dropdownId\"\n                    v-bind=\"dropdown\"\n                    :size=\"BentoDropdownSize.SMALL\"\n                    :disabled=\"disabled\"\n                    :readonly=\"readonly\"\n                    @input=\"onDropdownInput\"\n                />\n            </div>\n        </div>\n\n        <error-message\n            v-if=\"shouldShowError && !!errorMessage\"\n            :id=\"errorId\"\n            :error-message=\"errorMessage\"\n            class=\"b-input-field__error-message\"\n        />\n\n        <span v-if=\"hasSlot('description')\" :id=\"descriptionId\" class=\"b-input-field__description\" @click=\"focusInput\">\n            <bento-typography :el=\"BentoTypographyElement.SPAN\" :variant=\"BentoTypographyVariant.BODY\">\n                <slot id=\"description\" name=\"description\" />\n            </bento-typography>\n        </span>\n    </bento-typography>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, PropType, ref } from 'vue';\n    import {\n        BentoInputDropdownProps,\n        BentoInputFieldElementPosition,\n        BentoInputFieldEvent,\n        BentoInputFieldStateClass,\n        BentoInputFieldType,\n        BentoInputFieldValue,\n        BentoInputFieldVariant,\n    } from './input-field.types';\n    import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n    import { ErrorMessage } from '@/components/internal/error-message';\n    import { useHasSlot } from '@/composables';\n    import { generateUid } from '@/utils/ts/unique-id';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { BentoDropdownSize } from '../dropdown/dropdown.types';\n    import { BentoDropdown } from '@/components/dropdown';\n    import { BentoListboxSelectedValue } from '@/types';\n    import { getSlotText } from '@/utils/ts/get-slot-text';\n    import { deprecate } from '@/utils/ts/deprecate';\n\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    export default defineComponent({\n        i18n: { messages },\n        name: 'bento-input-field',\n        components: { BentoDropdown, BentoTypography, ErrorMessage },\n        props: {\n            /**\n             * Indicates whether the element is exposed to an accessibility API.\n             */\n            ariaHidden: { type: Boolean, default: true },\n\n            /**\n             * Text that labels an the input element\n             */\n            ariaLabel: { type: String, default: undefined },\n\n            /**\n             * Disables the possibility of changing value in the input-field\n             */\n            disabled: { type: Boolean, default: false },\n\n            /**\n             * Dropdown props for the small selectable dropdown menu.\n             * @see BentoDropdown\n             */\n            dropdown: {\n                type: Object as PropType<BentoInputDropdownProps>,\n                default: undefined,\n            },\n\n            /**\n             * Position of the dropdown before or after input value\n             */\n            dropdownPosition: {\n                type: String as PropType<BentoInputFieldElementPosition>,\n                default: BentoInputFieldElementPosition.START,\n            },\n\n            /**\n             * Adds error validation class for outlining input-field.\n             *\n             * @deprecated Use \"errorMessage\" prop instead\n             */\n            error: { type: Boolean, default: false },\n\n            /**\n             * Renders input-field with an error state and the error message beneath the input box\n             */\n            errorMessage: { type: String, default: null },\n\n            /**\n             * Highlights the dropdown is optional.\n             */\n            optional: { type: Boolean, default: false },\n\n            /**\n             * Text displayed as the placeholder of the input-field\n             */\n            placeholder: { type: String, default: '' },\n\n            /**\n             * Highlights the dropdown is required.\n             */\n            required: { type: Boolean, default: false },\n\n            /**\n             * Setting this property to true will set the input field to read only state.\n             */\n            readonly: { type: Boolean, default: false },\n\n            /**\n             * Static text that displayed before or after input value\n             * Applicable to the Static Value variant\n             */\n            staticValue: { type: String, default: '' },\n\n            /**\n             * Position of Static Value before or after input value\n             */\n            staticValuePosition: {\n                type: String as PropType<BentoInputFieldElementPosition>,\n                default: BentoInputFieldElementPosition.START,\n            },\n\n            /**\n             * A string specifying the type of control to render.\n             */\n            type: {\n                type: String as PropType<BentoInputFieldType>,\n                default: BentoInputFieldType.TEXT,\n            },\n\n            /**\n             * Text displayed as the value of the input-field\n             */\n            value: { type: [String, Number] as PropType<BentoInputFieldValue>, default: undefined },\n\n            /**\n             * Describes the different variants for the input element\n             */\n            variant: {\n                type: String as PropType<BentoInputFieldVariant>,\n                default: BentoInputFieldVariant.DEFAULT,\n            },\n        },\n        emits: [\n            BentoInputFieldEvent.INPUT,\n            BentoInputFieldEvent.ESCAPE_PRESSED,\n            BentoInputFieldEvent.DROPDOWN_INPUT,\n            BentoInputFieldEvent.UPDATE_DROPDOWN,\n            BentoInputFieldEvent.CHANGE,\n            BentoInputFieldEvent.FOCUS,\n            BentoInputFieldEvent.BLUR,\n            BentoInputFieldEvent.KEYDOWN,\n        ],\n        setup(props, { slots, emit }) {\n            const { t } = useI18n<{ message: MessageSchema }>({ messages });\n            const hasSlot = useHasSlot(slots);\n            const inputFieldElement = ref(null);\n            const inputFieldId = generateUid('input');\n            const dropdownId = generateUid('input-dropdown');\n            const staticValueId = generateUid('input-static-value');\n            const descriptionId = generateUid('input-description');\n            const errorId = generateUid('input-error');\n\n            const shouldShowStaticValue = computed(\n                () => props.variant === BentoInputFieldVariant.STATIC_VALUE && !!slots.staticValue\n            );\n\n            const shouldDisplayStaticValueAtStart = computed(\n                () => shouldShowStaticValue.value && props.staticValuePosition === BentoInputFieldElementPosition.START\n            );\n            const shouldDisplayStaticValueAtEnd = computed(\n                () => shouldShowStaticValue.value && props.staticValuePosition === BentoInputFieldElementPosition.END\n            );\n\n            const shouldShowDropdown = computed(\n                () => props.variant === BentoInputFieldVariant.DROPDOWN && !!props.dropdown\n            );\n            const shouldDisplayDropdownAtStart = computed(\n                () => shouldShowDropdown.value && props.dropdownPosition === BentoInputFieldElementPosition.START\n            );\n            const shouldDisplayDropdownAtEnd = computed(\n                () => shouldShowDropdown.value && props.dropdownPosition === BentoInputFieldElementPosition.END\n            );\n\n            const shouldShowError = computed(\n                () => !props.disabled && !props.readonly && (!!props.errorMessage || props.error)\n            );\n\n            const computedAriaOwns = computed(() => {\n                if (shouldShowDropdown.value === true && shouldShowStaticValue.value === true) {\n                    return `${staticValueId} ${dropdownId}`;\n                }\n                if (shouldShowDropdown.value === true) {\n                    return `${dropdownId}`;\n                }\n                if (shouldShowStaticValue.value === true) {\n                    return `${staticValueId}`;\n                }\n                return null;\n            });\n\n            const computedAriaLabel = computed(() => {\n                if (props.ariaLabel) {\n                    return props.ariaLabel;\n                }\n                if (hasSlot('default')) {\n                    return getSlotText(slots)('default');\n                }\n                return 'input field';\n            });\n\n            const computedAriaDescribedBy = computed(\n                () =>\n                    `${hasSlot('description') ? descriptionId : ''} ${\n                        shouldShowError.value && !!props.errorMessage ? errorId : ''\n                    }`\n            );\n\n            const inputFieldConditionalClasses = computed(() => ({\n                [`b-input-field--${BentoInputFieldStateClass.DISABLED}`]: props.disabled,\n                [`b-input-field--${BentoInputFieldStateClass.READONLY}`]: props.readonly,\n                [`b-input-field--${BentoInputFieldStateClass.ERROR}`]: shouldShowError.value,\n                [`b-input-field--${BentoInputFieldStateClass.SMALL_PADDING_LEFT}`]: shouldDisplayDropdownAtStart.value,\n                [`b-input-field--${BentoInputFieldStateClass.SMALL_PADDING_RIGHT}`]: shouldDisplayDropdownAtEnd.value,\n            }));\n\n            const onInput = (event: Event) => {\n                if (!props.disabled) {\n                    /**\n                     * Triggered when input value is changed\n                     *\n                     * @event input\n                     * @property {String} inputValue - the updated input-field value\n                     */\n                    emit(BentoInputFieldEvent.INPUT, (event.target as HTMLInputElement).value);\n                }\n            };\n\n            const onDropdownInput = (selectedValue: BentoListboxSelectedValue) => {\n                emit(BentoInputFieldEvent.DROPDOWN_INPUT, selectedValue);\n                emit(BentoInputFieldEvent.UPDATE_DROPDOWN, { ...props?.dropdown, value: selectedValue });\n            };\n\n            const focusInput = () => {\n                inputFieldElement.value.focus();\n            };\n\n            if (props.error) {\n                deprecate(\n                    'BentoInputField \"error\" property',\n                    `Use the BentoInputField \"errorMessage\" property instead to indicate that there is a modifier error.\n                    Having the field as \"undefined\" will hide/remove the error.\n                    <bento-dropdown errorMessage=\"Error message text\" />`,\n                    '2.0.0'\n                );\n            }\n\n            return {\n                // Enums\n                BentoTypographyVariant,\n                BentoTypographyElement,\n                BentoInputFieldVariant,\n                BentoDropdownSize,\n                BentoInputFieldEvent,\n\n                // Functions\n                t,\n                onDropdownInput,\n                onInput,\n                focusInput,\n                hasSlot,\n\n                // Values\n                inputFieldConditionalClasses,\n                inputFieldElement,\n                inputFieldId,\n                dropdownId,\n                staticValueId,\n                descriptionId,\n                errorId,\n                shouldDisplayStaticValueAtStart,\n                shouldDisplayStaticValueAtEnd,\n                shouldShowDropdown,\n                shouldDisplayDropdownAtStart,\n                shouldDisplayDropdownAtEnd,\n                shouldShowError,\n                computedAriaOwns,\n                computedAriaLabel,\n                computedAriaDescribedBy,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./input-field.scss\" />\n"],"names":["BentoInputFieldVariant","BentoInputFieldVariant2","BentoInputFieldElementPosition","BentoInputFieldElementPosition2","BentoInputFieldStateClass","BentoInputFieldStateClass2","BentoInputFieldType","BentoInputFieldType2","BentoInputFieldEvent","BentoInputFieldEvent2","_sfc_main","defineComponent","messages","BentoDropdown","BentoTypography","ErrorMessage","props","slots","emit","t","useI18n","hasSlot","useHasSlot","inputFieldElement","ref","inputFieldId","generateUid","dropdownId","staticValueId","descriptionId","errorId","shouldShowStaticValue","computed","shouldDisplayStaticValueAtStart","shouldDisplayStaticValueAtEnd","shouldShowDropdown","shouldDisplayDropdownAtStart","shouldDisplayDropdownAtEnd","shouldShowError","computedAriaOwns","computedAriaLabel","getSlotText","computedAriaDescribedBy","inputFieldConditionalClasses","onInput","event","onDropdownInput","selectedValue","focusInput","deprecate","BentoTypographyVariant","BentoTypographyElement","BentoDropdownSize","openBlock","createBlock","_component_bento_typography","normalizeClass","_ctx","withCtx","createElementBlock","createCommentVNode","_hoisted_1","createElementVNode","_hoisted_3","_component_bento_dropdown","mergeProps","_hoisted_5","_cache","args","$event","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_2"],"mappings":"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"}
+{"version":3,"file":"input-field.js","sources":["../../vue2/src/components/input-field/input-field.types.ts","../../vue2/src/components/input-field/input-field.vue"],"sourcesContent":["import { BentoDropdown } from '@/components/dropdown/';\n\nexport enum BentoInputFieldVariant {\n    DEFAULT = 'default',\n    PAYMENT_METHOD = 'payment-method',\n    STATIC_VALUE = 'static-value',\n    DROPDOWN = 'dropdown',\n}\n\nexport enum BentoInputFieldElementPosition {\n    START = 'start',\n    END = 'end',\n}\n\nexport enum BentoInputFieldStateClass {\n    DISABLED = 'disabled',\n    READONLY = 'readonly',\n    ERROR = 'error',\n    SMALL_PADDING_LEFT = 'small-padding-left',\n    SMALL_PADDING_RIGHT = 'small-padding-right',\n}\n\nexport enum BentoInputFieldType {\n    SEARCH = 'search',\n    TEXT = 'text',\n    NUMBER = 'number',\n}\n\nexport type BentoInputFieldValue = string | number;\n\ntype DropdownProps = InstanceType<typeof BentoDropdown>['$props'];\nexport type BentoInputDropdownProps = {\n    items: DropdownProps['items'];\n    value: DropdownProps['value'];\n};\n\nexport enum BentoInputFieldEvent {\n    INPUT = 'input',\n    ESCAPE_PRESSED = 'escape-pressed',\n    UPDATE_DROPDOWN = 'update:dropdown',\n    DROPDOWN_INPUT = 'dropdown-input',\n    FOCUS = 'focus',\n    CHANGE = 'change',\n    BLUR = 'blur',\n    KEYDOWN = 'keydown',\n}\n","<template>\n    <bento-typography\n        class=\"b-input-field\"\n        data-testid=\"input-text-container\"\n        :class=\"inputFieldConditionalClasses\"\n        :el=\"BentoTypographyElement.DIV\"\n        :variant=\"BentoTypographyVariant.BODY\"\n    >\n        <!-- Label -->\n        <label\n            v-if=\"hasSlot('default')\"\n            :for=\"inputFieldId\"\n            class=\"b-input-field__label\"\n            data-testid=\"input-field-label\"\n            @click=\"focusInput\"\n        >\n            <bento-typography :el=\"BentoTypographyElement.SPAN\" :variant=\"BentoTypographyVariant.BODY\" stronger>\n                <slot></slot>\n            </bento-typography>\n            <bento-typography\n                v-if=\"optional\"\n                class=\"b-input-field__label-requirement\"\n                :el=\"BentoTypographyElement.SPAN\"\n            >\n                ({{ t('optional') }})\n            </bento-typography>\n            <bento-typography\n                v-if=\"required\"\n                class=\"b-input-field__label-requirement\"\n                :el=\"BentoTypographyElement.SPAN\"\n            >\n                ({{ t('required') }})\n            </bento-typography>\n        </label>\n\n        <div class=\"b-input-field__input-box\" :aria-disabled=\"disabled\">\n            <!-- Optional Icon for Default text variant -->\n            <span\n                v-if=\"variant === BentoInputFieldVariant.DEFAULT && hasSlot('defaultIconBefore')\"\n                :aria-hidden=\"ariaHidden ? 'true' : undefined\"\n                class=\"b-input-field__default-icon-before\"\n            >\n                <slot name=\"defaultIconBefore\" />\n            </span>\n\n            <!-- Mandatory Icon for Payment Method variant -->\n            <span\n                v-if=\"variant === BentoInputFieldVariant.PAYMENT_METHOD && hasSlot('paymentMethod')\"\n                :aria-hidden=\"ariaHidden ? 'true' : undefined\"\n                class=\"b-input-field__payment-method\"\n            >\n                <slot name=\"paymentMethod\" />\n            </span>\n\n            <!-- Dropdown at start -->\n            <div\n                v-if=\"shouldDisplayDropdownAtStart\"\n                :id=\"dropdownId\"\n                class=\"b-input-field__dropdown b-input-field__dropdown--start\"\n            >\n                <bento-dropdown\n                    v-if=\"dropdown\"\n                    v-bind=\"dropdown\"\n                    :size=\"BentoDropdownSize.SMALL\"\n                    :disabled=\"disabled\"\n                    :readonly=\"readonly\"\n                    @input=\"onDropdownInput\"\n                />\n            </div>\n\n            <!-- Static Value at start -->\n            <bento-typography\n                v-if=\"shouldDisplayStaticValueAtStart\"\n                :id=\"staticValueId\"\n                class=\"b-input-field__static-value b-input-field__static-value--start\"\n                :el=\"BentoTypographyElement.SPAN\"\n                :variant=\"BentoTypographyVariant.BODY\"\n            >\n                <slot name=\"staticValue\" />\n            </bento-typography>\n\n            <input\n                :id=\"inputFieldId\"\n                ref=\"inputFieldElement\"\n                class=\"b-input-field__input\"\n                :aria-label=\"computedAriaLabel\"\n                :aria-describedby=\"computedAriaDescribedBy\"\n                :aria-owns=\"computedAriaOwns\"\n                :aria-invalid=\"shouldShowError\"\n                :placeholder=\"placeholder\"\n                :type=\"type\"\n                :value=\"value\"\n                :disabled=\"disabled\"\n                :readonly=\"readonly\"\n                @input=\"onInput\"\n                @change=\"$emit(BentoInputFieldEvent.CHANGE)\"\n                @focus=\"$emit(BentoInputFieldEvent.FOCUS)\"\n                @blur=\"$emit(BentoInputFieldEvent.BLUR)\"\n                @keydown=\"$emit(BentoInputFieldEvent.KEYDOWN, $event)\"\n                @keydown.esc=\"$emit(BentoInputFieldEvent.ESCAPE_PRESSED)\"\n            />\n            <span\n                v-if=\"hasSlot('iconAfter')\"\n                :aria-hidden=\"ariaHidden ? 'true' : undefined\"\n                class=\"b-input-field__icon-after\"\n                data-testid=\"input-text__icon-after\"\n            >\n                <slot name=\"iconAfter\" />\n            </span>\n\n            <!-- Static Value at the end -->\n            <bento-typography\n                v-if=\"shouldDisplayStaticValueAtEnd\"\n                :id=\"staticValueId\"\n                class=\"b-input-field__static-value b-input-field__static-value--end\"\n                :el=\"BentoTypographyElement.SPAN\"\n                :variant=\"BentoTypographyVariant.BODY\"\n            >\n                <slot name=\"staticValue\" />\n            </bento-typography>\n\n            <!-- Dropdown at end -->\n            <div\n                v-if=\"shouldDisplayDropdownAtEnd\"\n                :id=\"dropdownId\"\n                class=\"b-input-field__dropdown b-input-field__dropdown--end\"\n            >\n                <bento-dropdown\n                    v-if=\"dropdown\"\n                    :id=\"dropdownId\"\n                    v-bind=\"dropdown\"\n                    :size=\"BentoDropdownSize.SMALL\"\n                    :disabled=\"disabled\"\n                    :readonly=\"readonly\"\n                    @input=\"onDropdownInput\"\n                />\n            </div>\n        </div>\n\n        <error-message\n            v-if=\"shouldShowError && !!errorMessage\"\n            :id=\"errorId\"\n            :error-message=\"errorMessage\"\n            class=\"b-input-field__error-message\"\n        />\n\n        <span v-if=\"hasSlot('description')\" :id=\"descriptionId\" class=\"b-input-field__description\" @click=\"focusInput\">\n            <bento-typography :el=\"BentoTypographyElement.SPAN\" :variant=\"BentoTypographyVariant.BODY\">\n                <slot id=\"description\" name=\"description\" />\n            </bento-typography>\n        </span>\n    </bento-typography>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, PropType, ref } from 'vue';\n    import {\n        BentoInputDropdownProps,\n        BentoInputFieldElementPosition,\n        BentoInputFieldEvent,\n        BentoInputFieldStateClass,\n        BentoInputFieldType,\n        BentoInputFieldValue,\n        BentoInputFieldVariant,\n    } from './input-field.types';\n    import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n    import { ErrorMessage } from '@/components/internal/error-message';\n    import { useHasSlot } from '@/composables';\n    import { generateUid } from '@/utils/ts/unique-id';\n    import { useI18n } from '@/utils/ts/i18n';\n    import { BentoDropdownSize } from '../dropdown/dropdown.types';\n    import { BentoDropdown } from '@/components/dropdown';\n    import { BentoListboxSelectedValue } from '@/types';\n    import { getSlotText } from '@/utils/ts/get-slot-text';\n    import { deprecate } from '@/utils/ts/deprecate';\n\n    import messages from './messages.json';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    export default defineComponent({\n        i18n: { messages },\n        name: 'bento-input-field',\n        components: { BentoDropdown, BentoTypography, ErrorMessage },\n        props: {\n            /**\n             * Indicates whether the element is exposed to an accessibility API.\n             */\n            ariaHidden: { type: Boolean, default: true },\n\n            /**\n             * Text that labels an the input element\n             */\n            ariaLabel: { type: String, default: undefined },\n\n            /**\n             * Disables the possibility of changing value in the input-field\n             */\n            disabled: { type: Boolean, default: false },\n\n            /**\n             * Dropdown props for the small selectable dropdown menu.\n             * @see BentoDropdown\n             */\n            dropdown: {\n                type: Object as PropType<BentoInputDropdownProps>,\n                default: undefined,\n            },\n\n            /**\n             * Position of the dropdown before or after input value\n             */\n            dropdownPosition: {\n                type: String as PropType<BentoInputFieldElementPosition | `${BentoInputFieldElementPosition}`>,\n                default: BentoInputFieldElementPosition.START,\n                validator: (value: BentoInputFieldElementPosition) =>\n                    Object.values(BentoInputFieldElementPosition).includes(value),\n            },\n\n            /**\n             * Adds error validation class for outlining input-field.\n             *\n             * @deprecated Use \"errorMessage\" prop instead\n             */\n            error: { type: Boolean, default: false },\n\n            /**\n             * Renders input-field with an error state and the error message beneath the input box\n             */\n            errorMessage: { type: String, default: null },\n\n            /**\n             * Highlights the dropdown is optional.\n             */\n            optional: { type: Boolean, default: false },\n\n            /**\n             * Text displayed as the placeholder of the input-field\n             */\n            placeholder: { type: String, default: '' },\n\n            /**\n             * Highlights the dropdown is required.\n             */\n            required: { type: Boolean, default: false },\n\n            /**\n             * Setting this property to true will set the input field to read only state.\n             */\n            readonly: { type: Boolean, default: false },\n\n            /**\n             * Static text that displayed before or after input value\n             * Applicable to the Static Value variant\n             */\n            staticValue: { type: String, default: '' },\n\n            /**\n             * Position of Static Value before or after input value\n             */\n            staticValuePosition: {\n                type: String as PropType<BentoInputFieldElementPosition | `${BentoInputFieldElementPosition}`>,\n                default: BentoInputFieldElementPosition.START,\n                validator: (value: BentoInputFieldElementPosition) =>\n                    Object.values(BentoInputFieldElementPosition).includes(value),\n            },\n\n            /**\n             * A string specifying the type of control to render.\n             */\n            type: {\n                type: String as PropType<BentoInputFieldType | `${BentoInputFieldType}`>,\n                default: BentoInputFieldType.TEXT,\n                validator: (value: BentoInputFieldType) => Object.values(BentoInputFieldType).includes(value),\n            },\n\n            /**\n             * Text displayed as the value of the input-field\n             */\n            value: { type: [String, Number] as PropType<BentoInputFieldValue>, default: undefined },\n\n            /**\n             * Describes the different variants for the input element\n             */\n            variant: {\n                type: String as PropType<BentoInputFieldVariant | `${BentoInputFieldVariant}`>,\n                default: BentoInputFieldVariant.DEFAULT,\n                validator: (value: BentoInputFieldVariant) => Object.values(BentoInputFieldVariant).includes(value),\n            },\n        },\n        emits: [\n            BentoInputFieldEvent.INPUT,\n            BentoInputFieldEvent.ESCAPE_PRESSED,\n            BentoInputFieldEvent.DROPDOWN_INPUT,\n            BentoInputFieldEvent.UPDATE_DROPDOWN,\n            BentoInputFieldEvent.CHANGE,\n            BentoInputFieldEvent.FOCUS,\n            BentoInputFieldEvent.BLUR,\n            BentoInputFieldEvent.KEYDOWN,\n        ],\n        setup(props, { slots, emit }) {\n            const { t } = useI18n<{ message: MessageSchema }>({ messages });\n            const hasSlot = useHasSlot(slots);\n            const inputFieldElement = ref(null);\n            const inputFieldId = generateUid('input');\n            const dropdownId = generateUid('input-dropdown');\n            const staticValueId = generateUid('input-static-value');\n            const descriptionId = generateUid('input-description');\n            const errorId = generateUid('input-error');\n\n            const shouldShowStaticValue = computed(\n                () => props.variant === BentoInputFieldVariant.STATIC_VALUE && !!slots.staticValue\n            );\n\n            const shouldDisplayStaticValueAtStart = computed(\n                () => shouldShowStaticValue.value && props.staticValuePosition === BentoInputFieldElementPosition.START\n            );\n            const shouldDisplayStaticValueAtEnd = computed(\n                () => shouldShowStaticValue.value && props.staticValuePosition === BentoInputFieldElementPosition.END\n            );\n\n            const shouldShowDropdown = computed(\n                () => props.variant === BentoInputFieldVariant.DROPDOWN && !!props.dropdown\n            );\n            const shouldDisplayDropdownAtStart = computed(\n                () => shouldShowDropdown.value && props.dropdownPosition === BentoInputFieldElementPosition.START\n            );\n            const shouldDisplayDropdownAtEnd = computed(\n                () => shouldShowDropdown.value && props.dropdownPosition === BentoInputFieldElementPosition.END\n            );\n\n            const shouldShowError = computed(\n                () => !props.disabled && !props.readonly && (!!props.errorMessage || props.error)\n            );\n\n            const computedAriaOwns = computed(() => {\n                if (shouldShowDropdown.value === true && shouldShowStaticValue.value === true) {\n                    return `${staticValueId} ${dropdownId}`;\n                }\n                if (shouldShowDropdown.value === true) {\n                    return `${dropdownId}`;\n                }\n                if (shouldShowStaticValue.value === true) {\n                    return `${staticValueId}`;\n                }\n                return null;\n            });\n\n            const computedAriaLabel = computed(() => {\n                if (props.ariaLabel) {\n                    return props.ariaLabel;\n                }\n                if (hasSlot('default')) {\n                    return getSlotText(slots)('default');\n                }\n                return 'input field';\n            });\n\n            const computedAriaDescribedBy = computed(\n                () =>\n                    `${hasSlot('description') ? descriptionId : ''} ${\n                        shouldShowError.value && !!props.errorMessage ? errorId : ''\n                    }`\n            );\n\n            const inputFieldConditionalClasses = computed(() => ({\n                [`b-input-field--${BentoInputFieldStateClass.DISABLED}`]: props.disabled,\n                [`b-input-field--${BentoInputFieldStateClass.READONLY}`]: props.readonly,\n                [`b-input-field--${BentoInputFieldStateClass.ERROR}`]: shouldShowError.value,\n                [`b-input-field--${BentoInputFieldStateClass.SMALL_PADDING_LEFT}`]: shouldDisplayDropdownAtStart.value,\n                [`b-input-field--${BentoInputFieldStateClass.SMALL_PADDING_RIGHT}`]: shouldDisplayDropdownAtEnd.value,\n            }));\n\n            const onInput = (event: Event) => {\n                if (!props.disabled) {\n                    /**\n                     * Triggered when input value is changed\n                     *\n                     * @event input\n                     * @property {String} inputValue - the updated input-field value\n                     */\n                    emit(BentoInputFieldEvent.INPUT, (event.target as HTMLInputElement).value);\n                }\n            };\n\n            const onDropdownInput = (selectedValue: BentoListboxSelectedValue) => {\n                emit(BentoInputFieldEvent.DROPDOWN_INPUT, selectedValue);\n                emit(BentoInputFieldEvent.UPDATE_DROPDOWN, { ...props?.dropdown, value: selectedValue });\n            };\n\n            const focusInput = () => {\n                inputFieldElement.value.focus();\n            };\n\n            if (props.error) {\n                deprecate(\n                    'BentoInputField \"error\" property',\n                    `Use the BentoInputField \"errorMessage\" property instead to indicate that there is a modifier error.\n                    Having the field as \"undefined\" will hide/remove the error.\n                    <bento-dropdown errorMessage=\"Error message text\" />`,\n                    '2.0.0'\n                );\n            }\n\n            return {\n                // Enums\n                BentoTypographyVariant,\n                BentoTypographyElement,\n                BentoInputFieldVariant,\n                BentoDropdownSize,\n                BentoInputFieldEvent,\n\n                // Functions\n                t,\n                onDropdownInput,\n                onInput,\n                focusInput,\n                hasSlot,\n\n                // Values\n                inputFieldConditionalClasses,\n                inputFieldElement,\n                inputFieldId,\n                dropdownId,\n                staticValueId,\n                descriptionId,\n                errorId,\n                shouldDisplayStaticValueAtStart,\n                shouldDisplayStaticValueAtEnd,\n                shouldShowDropdown,\n                shouldDisplayDropdownAtStart,\n                shouldDisplayDropdownAtEnd,\n                shouldShowError,\n                computedAriaOwns,\n                computedAriaLabel,\n                computedAriaDescribedBy,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./input-field.scss\" />\n"],"names":["BentoInputFieldVariant","BentoInputFieldVariant2","BentoInputFieldElementPosition","BentoInputFieldElementPosition2","BentoInputFieldStateClass","BentoInputFieldStateClass2","BentoInputFieldType","BentoInputFieldType2","BentoInputFieldEvent","BentoInputFieldEvent2","_sfc_main","defineComponent","messages","BentoDropdown","BentoTypography","ErrorMessage","value","props","slots","emit","t","useI18n","hasSlot","useHasSlot","inputFieldElement","ref","inputFieldId","generateUid","dropdownId","staticValueId","descriptionId","errorId","shouldShowStaticValue","computed","shouldDisplayStaticValueAtStart","shouldDisplayStaticValueAtEnd","shouldShowDropdown","shouldDisplayDropdownAtStart","shouldDisplayDropdownAtEnd","shouldShowError","computedAriaOwns","computedAriaLabel","getSlotText","computedAriaDescribedBy","inputFieldConditionalClasses","onInput","event","onDropdownInput","selectedValue","focusInput","deprecate","BentoTypographyVariant","BentoTypographyElement","BentoDropdownSize","openBlock","createBlock","_component_bento_typography","normalizeClass","_ctx","withCtx","createElementBlock","createCommentVNode","_hoisted_1","createElementVNode","_hoisted_3","_component_bento_dropdown","mergeProps","_hoisted_5","_cache","args","$event","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_2"],"mappings":"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"}

package/dist/internal.js

@@ -1,10 +1,10 @@
-import { B as r, L as e } from "./chunks/listbox-option-tag.caa1ceba.js";
-import { C as s, a as p, b as n } from "./chunks/calendar.1fb0d5b2.js";
-import { C } from "./chunks/copy.012e43f2.js";
-import { C as i } from "./chunks/controls-group.0126679a.js";
-import { E as d } from "./chunks/error-message.a65a9abf.js";
+import { B as r, L as e } from "./chunks/listbox-option-tag.73661a5d.js";
+import { C as s, a as p, b as n } from "./chunks/calendar.08885a56.js";
+import { C } from "./chunks/copy.1ce0203e.js";
+import { C as i } from "./chunks/controls-group.806da9bd.js";
+import { E as d } from "./chunks/error-message.b88bb75a.js";
 import { G as L, a as l } from "./chunks/grid-layout.a30855ff.js";
-import { B as G } from "./chunks/listbox.ceacb0ca.js";
+import { B as G } from "./chunks/listbox.7b5e0eee.js";
 export {
   r as BentoAvatar,
   G as BentoListbox,

package/dist/link.js

@@ -1,8 +1,8 @@
 import { defineComponent as m, computed as b, useAttrs as v, openBlock as a, createElementBlock as h, normalizeClass as B, unref as e, createBlock as i, withCtx as c, renderSlot as s, mergeProps as T } from "vue";
 import { RouterLink as g } from "vue-router";
-import { B as d, a as y, b as f } from "./chunks/index.92f7d550.js";
+import { B as u, a as f, b as y } from "./chunks/index.ebf5f6cf.js";
 import { _ as E } from "./chunks/_plugin-vue_export-helper.dad06003.js";
-import "./assets/index31.css";
+import "./assets/index20.css";
 var r = /* @__PURE__ */ ((t) => (t.DEFAULT = "default", t.QUIET = "quiet", t))(r || {});
 const A = ["href", "title"], U = {
   name: "bento-link"
@@ -16,23 +16,23 @@ const A = ["href", "title"], U = {
   },
   emits: ["click"],
   setup(t, { emit: _ }) {
-    const k = t, p = b(() => ({
+    const k = t, d = b(() => ({
       [`b-link--${r.QUIET}`]: k.variant === r.QUIET
-    })), l = v(), u = (o, n) => {
+    })), l = v(), p = (o, n) => {
       _("click", o), n && n();
     };
     return (o, n) => t.external ? (a(), h("a", {
       key: 0,
-      class: B(["b-link", e(p)]),
+      class: B(["b-link", e(d)]),
       href: e(l).to.toString(),
       title: e(l).title,
       target: "_blank",
-      onClick: u
+      onClick: p
     }, [
-      t.disableTypography ? s(o.$slots, "default", { key: 1 }, void 0, !0) : (a(), i(e(d), {
+      t.disableTypography ? s(o.$slots, "default", { key: 1 }, void 0, !0) : (a(), i(e(u), {
         key: 0,
-        el: e(y).SPAN,
-        variant: e(f).BODY
+        el: e(f).SPAN,
+        variant: e(y).BODY
       }, {
         default: c(() => [
           s(o.$slots, "default", {}, void 0, !0)
@@ -40,15 +40,15 @@ const A = ["href", "title"], U = {
         _: 3
       }, 8, ["el", "variant"]))
     ], 10, A)) : (a(), i(e(g), T({ key: 1 }, e(l), {
-      class: ["b-link", e(p)],
+      class: ["b-link", e(d)],
       custom: "",
-      onClick: u
+      onClick: p
     }), {
       default: c(() => [
-        t.disableTypography ? s(o.$slots, "default", { key: 1 }, void 0, !0) : (a(), i(e(d), {
+        t.disableTypography ? s(o.$slots, "default", { key: 1 }, void 0, !0) : (a(), i(e(u), {
           key: 0,
-          el: e(y).SPAN,
-          variant: e(f).BODY
+          el: e(f).SPAN,
+          variant: e(y).BODY
         }, {
           default: c(() => [
             s(o.$slots, "default", {}, void 0, !0)
@@ -60,7 +60,7 @@ const A = ["href", "title"], U = {
     }, 16, ["class"]));
   }
 });
-const x = /* @__PURE__ */ E($, [["__scopeId", "data-v-e6b3e979"]]);
+const x = /* @__PURE__ */ E($, [["__scopeId", "data-v-2deb2f4a"]]);
 export {
   x as BentoLink,
   r as BentoLinkVariant

package/dist/link.js.map

@@ -1 +1 @@
-{"version":3,"file":"link.js","sources":["../../core/src/components/link/link.types.ts","../../vue2/src/components/link/link.vue"],"sourcesContent":["export enum BentoLinkVariant {\n    DEFAULT = 'default',\n    QUIET = 'quiet',\n}\n","<template>\n    <a\n        v-if=\"external\"\n        class=\"b-link\"\n        :class=\"conditionalClasses\"\n        :href=\"linkProps.to.toString()\"\n        :title=\"linkProps.title\"\n        target=\"_blank\"\n        @click=\"onClick\"\n    >\n        <bento-typography\n            v-if=\"!disableTypography\"\n            :el=\"BentoTypographyElement.SPAN\"\n            :variant=\"BentoTypographyVariant.BODY\"\n        >\n            <slot />\n        </bento-typography>\n        <slot v-else />\n    </a>\n    <router-link v-else v-bind=\"linkProps\" class=\"b-link\" :class=\"conditionalClasses\" custom @click.native=\"onClick\">\n        <bento-typography\n            v-if=\"!disableTypography\"\n            :el=\"BentoTypographyElement.SPAN\"\n            :variant=\"BentoTypographyVariant.BODY\"\n        >\n            <slot />\n        </bento-typography>\n        <slot v-else />\n    </router-link>\n</template>\n\n<script lang=\"ts\">\n    import { RouterLink } from 'vue-router';\n    import { computed, useAttrs } from 'vue';\n    import { BentoLinkVariant } from '@/core/components/link/link.types';\n    import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n    import type { RouterLinkProps, RouterLinkSlotArgument } from 'vue-router/types/router';\n    import type { AnchorHTMLAttributes } from 'vue/types/jsx';\n\n    /**\n     * Extends the `router-link` from the `vue-router` NPM package.\n     *\n     * @example\n     * import { BentoLink } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoLink },\n     *     template: `\n     *       <bento-link to=\"/\">\n     *           link\n     *       </bento-link>\n     *     `\n     * }\n     */\n    export default {\n        name: 'bento-link',\n    };\n</script>\n\n<script setup lang=\"ts\">\n    // TODO: replace all this code when migrated to Vue 3 is complete as this is the only\n    // current way to extend the `router-link` component in Vue 2 and Vue Router 3\n    export interface Props extends RouterLinkProps, AnchorHTMLAttributes {\n        // eslint-disable-next-line vue/require-default-prop\n        args?: { props: RouterLinkProps };\n        /**\n         * Set the rendered link to a regular external anchor link.\n         */\n        external?: boolean;\n\n        /**\n         * Link variant type affecting visual style.\n         * @values default, quiet\n         */\n        variant?: BentoLinkVariant;\n\n        /**\n         * Disable the default typography for the component. Only use this when the component is inside another typography component.\n         */\n        disableTypography?: boolean;\n    }\n\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const props = withDefaults(defineProps<Props>(), {\n        variant: BentoLinkVariant.DEFAULT,\n    });\n\n    const conditionalClasses = computed(() => ({\n        [`b-link--${BentoLinkVariant.QUIET}`]: props.variant === BentoLinkVariant.QUIET,\n    }));\n\n    // TODO: replace this when Vue allows users to extend props properly, read above for more info\n    const attributes = useAttrs() as unknown;\n    const linkProps = attributes as Props;\n\n    const emit = defineEmits<{\n        (e: 'click', clickEvent: MouseEvent): void;\n    }>();\n\n    const onClick = (e: MouseEvent, navigateCallback?: RouterLinkSlotArgument['navigate']) => {\n        emit('click', e);\n        if (navigateCallback) {\n            navigateCallback();\n        }\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"@/core/components/link/link.scss\" />\n"],"names":["BentoLinkVariant","BentoLinkVariant2","__default__","conditionalClasses","computed","props","linkProps","useAttrs","onClick","e","navigateCallback","emit"],"mappings":";;;;;AAAY,IAAAA,IAAA,kBAAAC,OACRA,EAAA,UAAA,WACAA,EAAA,QAAA,SAFQA,IAAAD,KAAA,CAAA,CAAA;6BCsDRE,IAAA;AAAA,EAAe,MAAA;AAEf;;;;;;;;;;iBA+BAC,IAAAC,EAAA,OAAA;AAAA,MAA2C,CAAA,WAAAJ,EAAA,OAAA,GAAAK,EAAA,YAAAL,EAAA;AAAA,IACmC,EAAA,GAK9EM,IADAC,EAAA,GAOAC,IAAA,CAAAC,GAAAC,MAAA;AACI,MAAAC,EAAA,SAAAF,CAAA,GACAC,KACIA,EAAA;AAAA,IACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"link.js","sources":["../../core/src/components/link/link.types.ts","../../vue2/src/components/link/link.vue"],"sourcesContent":["export enum BentoLinkVariant {\n    DEFAULT = 'default',\n    QUIET = 'quiet',\n}\n","<template>\n    <a\n        v-if=\"external\"\n        class=\"b-link\"\n        :class=\"conditionalClasses\"\n        :href=\"linkProps.to.toString()\"\n        :title=\"linkProps.title\"\n        target=\"_blank\"\n        @click=\"onClick\"\n    >\n        <bento-typography\n            v-if=\"!disableTypography\"\n            :el=\"BentoTypographyElement.SPAN\"\n            :variant=\"BentoTypographyVariant.BODY\"\n        >\n            <slot />\n        </bento-typography>\n        <slot v-else />\n    </a>\n    <router-link v-else v-bind=\"linkProps\" class=\"b-link\" :class=\"conditionalClasses\" custom @click.native=\"onClick\">\n        <bento-typography\n            v-if=\"!disableTypography\"\n            :el=\"BentoTypographyElement.SPAN\"\n            :variant=\"BentoTypographyVariant.BODY\"\n        >\n            <slot />\n        </bento-typography>\n        <slot v-else />\n    </router-link>\n</template>\n\n<script lang=\"ts\">\n    import { RouterLink } from 'vue-router';\n    import { computed, useAttrs } from 'vue';\n    import { BentoLinkVariant } from '@/core/components/link/link.types';\n    import { BentoTypography, BentoTypographyElement, BentoTypographyVariant } from '@/components/typography';\n    import type { RouterLinkProps, RouterLinkSlotArgument } from 'vue-router/types/router';\n    import type { AnchorHTMLAttributes } from 'vue/types/jsx';\n\n    /**\n     * Extends the `router-link` from the `vue-router` NPM package.\n     *\n     * @example\n     * import { BentoLink } from '@adyen/bento-vue2';\n     *\n     * export default {\n     *     components: { BentoLink },\n     *     template: `\n     *       <bento-link to=\"/\">\n     *           link\n     *       </bento-link>\n     *     `\n     * }\n     */\n    export default {\n        name: 'bento-link',\n    };\n</script>\n\n<script setup lang=\"ts\">\n    // TODO: replace all this code when migrated to Vue 3 is complete as this is the only\n    // current way to extend the `router-link` component in Vue 2 and Vue Router 3\n    export interface Props extends RouterLinkProps, AnchorHTMLAttributes {\n        // eslint-disable-next-line vue/require-default-prop\n        args?: { props: RouterLinkProps };\n        /**\n         * Set the rendered link to a regular external anchor link.\n         */\n        external?: boolean;\n\n        /**\n         * Link variant type affecting visual style.\n         * @values default, quiet\n         */\n        variant?: BentoLinkVariant | `${BentoLinkVariant}`;\n\n        /**\n         * Disable the default typography for the component. Only use this when the component is inside another typography component.\n         */\n        disableTypography?: boolean;\n    }\n\n    const props = withDefaults(defineProps<Props>(), {\n        variant: BentoLinkVariant.DEFAULT,\n    });\n\n    const conditionalClasses = computed(() => ({\n        [`b-link--${BentoLinkVariant.QUIET}`]: props.variant === BentoLinkVariant.QUIET,\n    }));\n\n    // TODO: replace this when Vue allows users to extend props properly, read above for more info\n    const attributes = useAttrs() as unknown;\n    const linkProps = attributes as Props;\n\n    const emit = defineEmits<{\n        (e: 'click', clickEvent: MouseEvent): void;\n    }>();\n\n    const onClick = (e: MouseEvent, navigateCallback?: RouterLinkSlotArgument['navigate']) => {\n        emit('click', e);\n        if (navigateCallback) {\n            navigateCallback();\n        }\n    };\n</script>\n\n<style lang=\"scss\" scoped src=\"@/core/components/link/link.scss\" />\n"],"names":["BentoLinkVariant","BentoLinkVariant2","__default__","conditionalClasses","computed","props","linkProps","useAttrs","onClick","e","navigateCallback","emit"],"mappings":";;;;;AAAY,IAAAA,IAAA,kBAAAC,OACRA,EAAA,UAAA,WACAA,EAAA,QAAA,SAFQA,IAAAD,KAAA,CAAA,CAAA;6BCsDRE,IAAA;AAAA,EAAe,MAAA;AAEf;;;;;;;;;;iBA8BAC,IAAAC,EAAA,OAAA;AAAA,MAA2C,CAAA,WAAAJ,EAAA,OAAA,GAAAK,EAAA,YAAAL,EAAA;AAAA,IACmC,EAAA,GAK9EM,IADAC,EAAA,GAOAC,IAAA,CAAAC,GAAAC,MAAA;AACI,MAAAC,EAAA,SAAAF,CAAA,GACAC,KACIA,EAAA;AAAA,IACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}