@adyen/bento-vue3 1.2.0 → 1.3.0

package/dist/textarea.js

@@ -1,37 +1,38 @@
-import { openBlock as n, createElementBlock as g, mergeProps as X, toDisplayString as b, createCommentVNode as i, pushScopeId as x, popScopeId as ee, createElementVNode as N, defineComponent as ae, toRefs as te, ref as h, computed as s, watch as $, nextTick as le, onMounted as re, resolveComponent as v, normalizeClass as C, normalizeStyle as w, createVNode as E, withCtx as c, createTextVNode as y, createBlock as p, withKeys as R } from "vue";
-import { B as oe, a as ne } from "./chunks/index.ebf5f6cf.js";
-import { B as se, a as ie } from "./chunks/button.1f630b6e.js";
+import { openBlock as n, createElementBlock as v, mergeProps as x, toDisplayString as b, createCommentVNode as i, pushScopeId as ee, popScopeId as ae, createElementVNode as P, defineComponent as te, toRefs as le, ref as h, toRef as re, computed as s, watch as $, nextTick as oe, onMounted as ne, resolveComponent as C, normalizeClass as E, normalizeStyle as w, createVNode as L, withCtx as c, createTextVNode as y, createBlock as p, withKeys as N } from "vue";
+import { B as se, a as ie } from "./chunks/index.222d29b0.js";
+import { B as ue, a as de } from "./chunks/button.e1c39f66.js";
 import { _ as U } from "./chunks/_plugin-vue_export-helper.dad06003.js";
-import { g as ue } from "./chunks/unique-id.a2a2b458.js";
-import { o as de } from "./chunks/resize.a041304d.js";
-import { u as ce } from "./chunks/i18n.6c402773.js";
-import { u as pe } from "./chunks/aria-label.ac9651a5.js";
-import { E as be } from "./chunks/error-message.b88bb75a.js";
-import "./assets/index36.css";
-var P = /* @__PURE__ */ ((e) => (e.HORIZONTAL = "horizontal", e.VERTICAL = "vertical", e.BOTH = "both", e.NONE = "none", e))(P || {}), m = /* @__PURE__ */ ((e) => (e.CLEARABLE = "clearable", e.DISABLED = "disabled", e.ERROR = "error", e.READONLY = "readonly", e))(m || {}), l = /* @__PURE__ */ ((e) => (e.BLUR = "blur", e.CHANGE = "change", e.CLEAR = "clear", e.ESCAPE_PRESSED = "escape-pressed", e.FOCUS = "focus", e.INPUT = "input", e))(l || {});
-let O = 0;
-const me = {
+import { g as ce } from "./chunks/unique-id.a2a2b458.js";
+import { o as pe } from "./chunks/resize.a041304d.js";
+import { u as be } from "./chunks/i18n.6c402773.js";
+import { u as me } from "./chunks/aria-label.ac9651a5.js";
+import { u as fe } from "./chunks/use-form-layout-loading.d03e5d48.js";
+import { E as ye } from "./chunks/error-message.ddfe8ea5.js";
+import "./assets/index34.css";
+var T = /* @__PURE__ */ ((e) => (e.HORIZONTAL = "horizontal", e.VERTICAL = "vertical", e.BOTH = "both", e.NONE = "none", e))(T || {}), m = /* @__PURE__ */ ((e) => (e.CLEARABLE = "clearable", e.DISABLED = "disabled", e.ERROR = "error", e.READONLY = "readonly", e))(m || {}), l = /* @__PURE__ */ ((e) => (e.BLUR = "blur", e.CHANGE = "change", e.CLEAR = "clear", e.ESCAPE_PRESSED = "escape-pressed", e.FOCUS = "focus", e.INPUT = "input", e))(l || {});
+let F = 0;
+const ve = {
   beforeCreate() {
-    this.uuid = O.toString(), O += 1;
+    this.uuid = F.toString(), F += 1;
   }
-}, fe = (e) => (x("data-v-3c9e4cfb"), e = e(), ee(), e), ye = { key: 0 }, ge = /* @__PURE__ */ fe(() => /* @__PURE__ */ N("path", {
+}, ge = (e) => (ee("data-v-3c9e4cfb"), e = e(), ae(), e), he = { key: 0 }, Ce = /* @__PURE__ */ ge(() => /* @__PURE__ */ P("path", {
   fill: "#00112C",
   "fill-rule": "evenodd",
   d: "M2.25 8C2.25 4.82436 4.82436 2.25 8 2.25C11.1756 2.25 13.75 4.82436 13.75 8C13.75 11.1756 11.1756 13.75 8 13.75C4.82436 13.75 2.25 11.1756 2.25 8ZM5.46967 5.46967C5.17678 5.76256 5.17678 6.23744 5.46967 6.53033L6.93934 8L5.46967 9.46967C5.17678 9.76256 5.17678 10.2374 5.46967 10.5303C5.76256 10.8232 6.23744 10.8232 6.53033 10.5303L8 9.06066L9.46967 10.5303C9.76256 10.8232 10.2374 10.8232 10.5303 10.5303C10.8232 10.2374 10.8232 9.76256 10.5303 9.46967L9.06066 8L10.5303 6.53033C10.8232 6.23744 10.8232 5.76256 10.5303 5.46967C10.2374 5.17678 9.76256 5.17678 9.46967 5.46967L8 6.93934L6.53033 5.46967C6.23744 5.17678 5.76256 5.17678 5.46967 5.46967Z",
   "clip-rule": "evenodd"
 }, null, -1));
-function he(e, a, L, u, _, S) {
-  return n(), g("svg", X({ role: "img" }, e.$attrs, {
+function Ee(e, a, _, u, S, B) {
+  return n(), v("svg", x({ role: "img" }, e.$attrs, {
     xmlns: "http://www.w3.org/2000/svg",
     width: "16",
     height: "16",
     fill: "none"
   }), [
-    e.$attrs["svg-title"] ? (n(), g("title", ye, b(e.$attrs["svg-title"]), 1)) : i("", !0),
-    ge
+    e.$attrs["svg-title"] ? (n(), v("title", he, b(e.$attrs["svg-title"]), 1)) : i("", !0),
+    Ce
   ], 16);
 }
-const ve = /* @__PURE__ */ U(me, [["render", he], ["__scopeId", "data-v-3c9e4cfb"]]), H = {
+const Le = /* @__PURE__ */ U(ve, [["render", Ee], ["__scopeId", "data-v-3c9e4cfb"]]), H = {
   "en-US": {
     clearText: "Clear text",
     optional: "optional",
@@ -39,10 +40,10 @@ const ve = /* @__PURE__ */ U(me, [["render", he], ["__scopeId", "data-v-3c9e4cfb
     textarea: "textarea",
     yourTextCanBenAtMost: "Your text can be at most {characterLimit} characters"
   }
-}, Ce = ae({
+}, _e = te({
   i18n: { messages: H },
   name: "bento-textarea",
-  components: { BentoButton: se, BentoTypography: oe, ErrorMessage: be, CrossCircleFillSmallIcon: ve },
+  components: { BentoButton: ue, BentoTypography: se, ErrorMessage: ye, CrossCircleFillSmallIcon: Le },
   props: {
     /**
      * Text that labels an the input element
@@ -93,8 +94,8 @@ const ve = /* @__PURE__ */ U(me, [["render", he], ["__scopeId", "data-v-3c9e4cfb
      */
     resizable: {
       type: String,
-      default: P.BOTH,
-      validator: (e) => Object.values(P).includes(e)
+      default: T.BOTH,
+      validator: (e) => Object.values(T).includes(e)
     },
     /**
      * Highlights the textarea is required.
@@ -114,13 +115,13 @@ const ve = /* @__PURE__ */ U(me, [["render", he], ["__scopeId", "data-v-3c9e4cfb
     l.INPUT
   ],
   setup(e, { emit: a }) {
-    const { ariaLabel: L, height: u, label: _ } = te(e), S = ue("textarea"), t = h(null), r = h(e.value), f = 44, d = h(e.height || `${f}px`), o = h("100%"), { t: B } = ce({ messages: H }), D = s(() => `${r.value.length} / ${e.characterLimit}`), A = s(
+    const { ariaLabel: _, height: u, label: S } = le(e), B = ce("textarea"), t = h(null), r = h(e.value), f = 44, d = h(e.height || `${f}px`), o = h("100%"), { t: A } = be({ messages: H }), { isReadOnly: g } = fe(re(e, "readonly")), D = s(() => `${r.value.length} / ${e.characterLimit}`), I = s(
       () => e.characterLimit && r.value.length > e.characterLimit
-    ), I = () => {
+    ), R = () => {
       t.value && t.value.scrollHeight > f && (d.value = `${t.value.scrollHeight + 3}px`);
     };
     $(u, () => {
-      u.value ? d.value = u.value : I();
+      u.value ? d.value = u.value : R();
     }), $(
       () => e.value,
       () => {
@@ -133,98 +134,99 @@ const ve = /* @__PURE__ */ U(me, [["render", he], ["__scopeId", "data-v-3c9e4cfb
         if (!u.value) {
           if (d.value = `${f}px`, !r.value)
             return;
-          await le(), I();
+          await oe(), R();
         }
       },
       { immediate: !0 }
     );
-    const T = s(() => !!e.errorMessage || A.value), F = s(() => ({
+    const k = s(() => !!e.errorMessage || I.value), M = s(() => ({
       [`b-textarea--${m.DISABLED}`]: e.disabled
-    })), M = s(() => ({
+    })), V = s(() => ({
       [`b-textarea__input--${m.CLEARABLE}`]: e.clearable,
-      [`b-textarea__input--${m.READONLY}`]: e.readonly,
-      [`b-textarea__input--${m.ERROR}`]: T.value,
+      [`b-textarea__input--${m.READONLY}`]: g.value,
+      [`b-textarea__input--${m.ERROR}`]: k.value,
       ["b-textarea__input--dynamic-height"]: !u.value
-    })), V = s(() => ({
-      ["b-textarea__label-box--no-label"]: !e.label
     })), q = s(() => ({
-      [`b-textarea__label-item--${m.ERROR}`]: A.value
-    })), K = s(
-      () => B("yourTextCanBenAtMost", { characterLimit: e.characterLimit })
-    ), W = pe({
-      ariaLabel: L,
-      label: _,
-      defaultFallback: B("textarea")
-    }), z = s(
-      () => e.clearable && r.value && !e.disabled && !e.readonly
-    ), Y = () => {
+      ["b-textarea__label-box--no-label"]: !e.label
+    })), K = s(() => ({
+      [`b-textarea__label-item--${m.ERROR}`]: I.value
+    })), W = s(
+      () => A("yourTextCanBenAtMost", { characterLimit: e.characterLimit })
+    ), z = me({
+      ariaLabel: _,
+      label: S,
+      defaultFallback: A("textarea")
+    }), Y = s(
+      () => e.clearable && r.value && !e.disabled && !g.value
+    ), G = () => {
       r.value = "", a(l.CLEAR), a(l.INPUT, "");
-    }, G = (k) => {
-      !e.disabled && !e.readonly && (r.value = k.target.value, a(l.INPUT, r.value));
-    }, Z = () => {
-      t.value.scrollTop = 0, a(l.BLUR);
+    }, Z = (O) => {
+      !e.disabled && !g.value && (r.value = O.target.value, a(l.INPUT, r.value));
     }, j = () => {
-      t.value.focus(), a(l.FOCUS);
+      t.value.scrollTop = 0, a(l.BLUR);
     }, J = () => {
-      a(l.CHANGE);
+      t.value.focus(), a(l.FOCUS);
     }, Q = () => {
+      a(l.CHANGE);
+    }, X = () => {
       a(l.ESCAPE_PRESSED);
     };
-    return re(() => {
-      de(t.value, () => {
+    return ne(() => {
+      pe(t.value, () => {
         o.value = `${t.value.offsetWidth}px`;
-      }), u.value || I();
+      }), u.value || R();
     }), {
       // Enums
-      BentoButtonVariant: ie,
+      BentoButtonVariant: de,
       BentoTextareaEvent: l,
-      BentoTypographyElement: ne,
+      BentoTypographyElement: ie,
       // Methods
-      onBlur: Z,
-      onChange: J,
-      onClear: Y,
-      onFocus: j,
-      onInput: G,
-      onPressEscape: Q,
-      t: B,
+      onBlur: j,
+      onChange: Q,
+      onClear: G,
+      onFocus: J,
+      onInput: Z,
+      onPressEscape: X,
+      t: A,
       // Values
-      computedAriaLabel: W,
-      conditionalClasses: F,
-      conditionalClassesLabelItem: q,
-      conditionalClassesLabelBox: V,
+      computedAriaLabel: z,
+      conditionalClasses: M,
+      conditionalClassesLabelItem: K,
+      conditionalClassesLabelBox: q,
       counter: D,
-      counterErrorText: K,
-      conditionalClassesInput: M,
-      invalidInput: T,
-      isOverCharacterLimit: A,
-      showClearButton: z,
+      counterErrorText: W,
+      conditionalClassesInput: V,
+      invalidInput: k,
+      isOverCharacterLimit: I,
+      isReadOnly: g,
+      showClearButton: Y,
       textareaElement: t,
       textareaHeight: d,
-      textareaId: S,
+      textareaId: B,
       textareaValue: r,
       textareaWidth: o
     };
   }
 });
-const Ee = ["for"], Le = ["id", "value", "aria-label", "aria-invalid", "readonly", "disabled", "placeholder"], _e = {
+const Se = ["for"], Be = ["id", "value", "aria-label", "aria-invalid", "readonly", "disabled", "placeholder"], Ae = {
   key: 0,
   class: "b-textarea__clear-button"
 };
-function Se(e, a, L, u, _, S) {
-  const t = v("bento-typography"), r = v("cross-circle-fill-small-icon"), f = v("bento-button"), d = v("error-message");
-  return n(), g("div", {
-    class: C(["b-textarea", e.conditionalClasses]),
+function Ie(e, a, _, u, S, B) {
+  const t = C("bento-typography"), r = C("cross-circle-fill-small-icon"), f = C("bento-button"), d = C("error-message");
+  return n(), v("div", {
+    class: E(["b-textarea", e.conditionalClasses]),
     style: w({ width: e.textareaWidth })
   }, [
-    N("div", {
-      class: C(["b-textarea__label-box", e.conditionalClassesLabelBox])
+    P("div", {
+      class: E(["b-textarea__label-box", e.conditionalClassesLabelBox])
     }, [
-      e.label ? (n(), g("label", {
+      e.label ? (n(), v("label", {
         key: 0,
         for: e.textareaId,
         class: "b-textarea__label"
       }, [
-        E(t, {
+        L(t, {
           el: e.BentoTypographyElement.SPAN,
           stronger: ""
         }, {
@@ -253,11 +255,11 @@ function Se(e, a, L, u, _, S) {
           ]),
           _: 1
         }, 8, ["el"])) : i("", !0)
-      ], 8, Ee)) : i("", !0),
+      ], 8, Se)) : i("", !0),
       e.characterLimit ? (n(), p(t, {
         key: 1,
         el: e.BentoTypographyElement.SPAN,
-        class: C(["b-textarea__label-item", e.conditionalClassesLabelItem])
+        class: E(["b-textarea__label-item", e.conditionalClassesLabelItem])
       }, {
         default: c(() => [
           y(b(e.counter), 1)
@@ -265,20 +267,20 @@ function Se(e, a, L, u, _, S) {
         _: 1
       }, 8, ["el", "class"])) : i("", !0)
     ], 2),
-    E(t, {
+    L(t, {
       el: e.BentoTypographyElement.DIV,
       class: "b-textarea__input-box",
       "aria-disabled": e.disabled
     }, {
       default: c(() => [
-        N("textarea", {
+        P("textarea", {
           id: e.textareaId,
           ref: "textareaElement",
           value: e.textareaValue,
-          class: C(["b-textarea__input", e.conditionalClassesInput]),
+          class: E(["b-textarea__input", e.conditionalClassesInput]),
           "aria-label": e.computedAriaLabel,
           "aria-invalid": e.invalidInput,
-          readonly: e.readonly,
+          readonly: e.isReadOnly,
           disabled: e.disabled,
           placeholder: e.placeholder,
           style: w({ resize: e.resizable, height: e.textareaHeight }),
@@ -286,19 +288,19 @@ function Se(e, a, L, u, _, S) {
           onChange: a[1] || (a[1] = (...o) => e.onChange && e.onChange(...o)),
           onFocus: a[2] || (a[2] = (...o) => e.onFocus && e.onFocus(...o)),
           onInput: a[3] || (a[3] = (...o) => e.onInput && e.onInput(...o)),
-          onKeydown: a[4] || (a[4] = R((...o) => e.onPressEscape && e.onPressEscape(...o), ["esc"]))
+          onKeydown: a[4] || (a[4] = N((...o) => e.onPressEscape && e.onPressEscape(...o), ["esc"]))
         }, `
-            `, 46, Le),
-        e.showClearButton ? (n(), g("div", _e, [
-          E(f, {
+            `, 46, Be),
+        e.showClearButton ? (n(), v("div", Ae, [
+          L(f, {
             variant: e.BentoButtonVariant.TERTIARY,
             disabled: e.disabled,
             onClick: e.onClear,
-            onKeypress: R(e.onClear, ["enter"]),
-            onKeyup: R(e.onClear, ["space"])
+            onKeypress: N(e.onClear, ["enter"]),
+            onKeyup: N(e.onClear, ["space"])
           }, {
             iconLeft: c(() => [
-              E(r, {
+              L(r, {
                 "svg-title": e.t("clearText")
               }, null, 8, ["svg-title"])
             ]),
@@ -328,8 +330,8 @@ function Se(e, a, L, u, _, S) {
     }, 8, ["el"])) : i("", !0)
   ], 6);
 }
-const we = /* @__PURE__ */ U(Ce, [["render", Se], ["__scopeId", "data-v-d8862135"]]);
+const Ue = /* @__PURE__ */ U(_e, [["render", Ie], ["__scopeId", "data-v-c644bdce"]]);
 export {
-  we as BentoTextarea
+  Ue as BentoTextarea
 };
 //# sourceMappingURL=textarea.js.map

package/dist/textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.js","sources":["../../vue2/src/components/textarea/textarea.types.ts","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/cross-circle-fill-small.vue","../../vue2/src/components/textarea/textarea.vue"],"sourcesContent":["export enum BentoTextareaResizeOption {\n    HORIZONTAL = 'horizontal',\n    VERTICAL = 'vertical',\n    BOTH = 'both',\n    NONE = 'none',\n}\n\nexport enum BentoTextareaStateClass {\n    CLEARABLE = 'clearable',\n    DISABLED = 'disabled',\n    ERROR = 'error',\n    READONLY = 'readonly',\n}\n\nexport enum BentoTextareaEvent {\n    BLUR = 'blur',\n    CHANGE = 'change',\n    CLEAR = 'clear',\n    ESCAPE_PRESSED = 'escape-pressed',\n    FOCUS = 'focus',\n    INPUT = 'input',\n}\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M2.25 8C2.25 4.82436 4.82436 2.25 8 2.25C11.1756 2.25 13.75 4.82436 13.75 8C13.75 11.1756 11.1756 13.75 8 13.75C4.82436 13.75 2.25 11.1756 2.25 8ZM5.46967 5.46967C5.17678 5.76256 5.17678 6.23744 5.46967 6.53033L6.93934 8L5.46967 9.46967C5.17678 9.76256 5.17678 10.2374 5.46967 10.5303C5.76256 10.8232 6.23744 10.8232 6.53033 10.5303L8 9.06066L9.46967 10.5303C9.76256 10.8232 10.2374 10.8232 10.5303 10.5303C10.8232 10.2374 10.8232 9.76256 10.5303 9.46967L9.06066 8L10.5303 6.53033C10.8232 6.23744 10.8232 5.76256 10.5303 5.46967C10.2374 5.17678 9.76256 5.17678 9.46967 5.46967L8 6.93934L6.53033 5.46967C6.23744 5.17678 5.76256 5.17678 5.46967 5.46967Z\" clip-rule=\"evenodd\"/></svg>\n</template>\n<script>\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n<style scoped lang=\"scss\">\n    svg {\n        display: inline-flex;\n        flex-shrink: 0;\n    }\n    \n    svg,\n    svg * {\n        fill: currentcolor;\n    }\n</style>\n","<template>\n    <div class=\"b-textarea\" :class=\"conditionalClasses\" :style=\"{ width: textareaWidth }\">\n        <div class=\"b-textarea__label-box\" :class=\"conditionalClassesLabelBox\">\n            <label v-if=\"label\" :for=\"textareaId\" class=\"b-textarea__label\">\n                <bento-typography :el=\"BentoTypographyElement.SPAN\" stronger>{{ label }}</bento-typography>\n                <bento-typography\n                    v-if=\"optional && !required\"\n                    :el=\"BentoTypographyElement.SPAN\"\n                    class=\"b-textarea__label-item\"\n                >\n                    ({{ t('optional') }})\n                </bento-typography>\n                <bento-typography v-if=\"required\" :el=\"BentoTypographyElement.SPAN\" class=\"b-textarea__label-item\">\n                    ({{ t('required') }})\n                </bento-typography>\n            </label>\n            <bento-typography\n                v-if=\"characterLimit\"\n                :el=\"BentoTypographyElement.SPAN\"\n                class=\"b-textarea__label-item\"\n                :class=\"conditionalClassesLabelItem\"\n            >\n                {{ counter }}\n            </bento-typography>\n        </div>\n        <bento-typography :el=\"BentoTypographyElement.DIV\" class=\"b-textarea__input-box\" :aria-disabled=\"disabled\">\n            <textarea\n                :id=\"textareaId\"\n                ref=\"textareaElement\"\n                :value=\"textareaValue\"\n                class=\"b-textarea__input\"\n                :class=\"conditionalClassesInput\"\n                :aria-label=\"computedAriaLabel\"\n                :aria-invalid=\"invalidInput\"\n                :readonly=\"readonly\"\n                :disabled=\"disabled\"\n                :placeholder=\"placeholder\"\n                :style=\"{ resize: resizable, height: textareaHeight }\"\n                @blur=\"onBlur\"\n                @change=\"onChange\"\n                @focus=\"onFocus\"\n                @input=\"onInput\"\n                @keydown.esc=\"onPressEscape\"\n            >\n            </textarea>\n\n            <div v-if=\"showClearButton\" class=\"b-textarea__clear-button\">\n                <bento-button\n                    :variant=\"BentoButtonVariant.TERTIARY\"\n                    :disabled=\"disabled\"\n                    @click=\"onClear\"\n                    @keypress.enter=\"onClear\"\n                    @keyup.space=\"onClear\"\n                >\n                    <template #iconLeft>\n                        <cross-circle-fill-small-icon :svg-title=\"t('clearText')\" />\n                    </template>\n                </bento-button>\n            </div>\n        </bento-typography>\n\n        <error-message v-if=\"isOverCharacterLimit\" :error-message=\"counterErrorText\" />\n\n        <error-message v-if=\"errorMessage\" :error-message=\"errorMessage\" />\n\n        <bento-typography v-if=\"description\" class=\"b-textarea__description\" :el=\"BentoTypographyElement.SPAN\">\n            {{ description }}\n        </bento-typography>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, nextTick, onMounted, PropType, ref, toRefs, watch } from 'vue';\n    import { BentoTextareaEvent, BentoTextareaResizeOption, BentoTextareaStateClass } from './textarea.types';\n    import { BentoTypography, BentoTypographyElement } from '@/components/typography';\n    import { BentoButton, BentoButtonVariant } from '@/components/button';\n    import { ErrorMessage } from '@/components/internal';\n    import CrossCircleFillSmallIcon from '@adyen/ui-assets-icons-16/vue/cross-circle-fill-small';\n    import { generateUid } from '@/utils/ts/unique-id';\n    import { observeSizeOfElement } from '@/utils/ts/resize';\n    import { useI18n } from '@/utils/ts/i18n';\n\n    import messages from './messages.json';\n    import { useAriaLabel } from '@/utils/ts/aria-label';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    export default defineComponent({\n        i18n: { messages },\n        name: 'bento-textarea',\n        components: { BentoButton, BentoTypography, ErrorMessage, CrossCircleFillSmallIcon },\n        props: {\n            /**\n             * Text that labels an the input element\n             */\n            ariaLabel: { type: String, default: undefined },\n\n            /**\n             * Text that shows number of characters in textarea\n             */\n            characterLimit: { type: Number, default: undefined },\n\n            /**\n             * Text displayed as the help text of the textarea\n             */\n            description: { type: String, default: '' },\n\n            /**\n             * Disables the possibility of changing value in the textarea\n             */\n            disabled: { type: Boolean, default: false },\n\n            /**\n             * If set to true, shows a button to clear all the text\n             */\n            clearable: { type: Boolean, default: false },\n\n            /**\n             * Adds error text\n             */\n            errorMessage: { type: String, default: '' },\n\n            /**\n             * Sets the height of the textarea, e.g 200px OR 20vh\n             */\n            height: { type: String, default: null },\n\n            /**\n             * Text displayed as the label of the textarea\n             */\n            label: { type: String, default: '' },\n\n            /**\n             * Highlights the textarea is optional.\n             */\n            optional: { type: Boolean, default: false },\n\n            /**\n             * Text displayed as the placeholder of the textarea\n             */\n            placeholder: { type: String, default: '' },\n\n            /**\n             * Set the textarea to read only state.\n             */\n            readonly: { type: Boolean, default: false },\n\n            /**\n             * Indicates the possibility of resize the textarea\n             */\n            resizable: {\n                type: String as PropType<BentoTextareaResizeOption | `${BentoTextareaResizeOption}`>,\n                default: BentoTextareaResizeOption.BOTH,\n                validator: (value: BentoTextareaResizeOption) =>\n                    Object.values(BentoTextareaResizeOption).includes(value),\n            },\n\n            /**\n             * Highlights the textarea is required.\n             */\n            required: { type: Boolean, default: false },\n\n            /**\n             * Text displayed as the value of the textarea\n             */\n            value: { type: String, default: '' },\n        },\n        emits: [\n            BentoTextareaEvent.BLUR,\n            BentoTextareaEvent.CHANGE,\n            BentoTextareaEvent.CLEAR,\n            BentoTextareaEvent.ESCAPE_PRESSED,\n            BentoTextareaEvent.FOCUS,\n            BentoTextareaEvent.INPUT,\n        ],\n        setup(props, { emit }) {\n            const { ariaLabel, height, label } = toRefs(props);\n\n            const textareaId = generateUid('textarea');\n            const textareaElement = ref<HTMLTextAreaElement>(null);\n            const textareaValue = ref(props.value);\n            const defaultTextareaHeight = 44;\n            const textareaHeight = ref(props.height || `${defaultTextareaHeight}px`);\n            const textareaWidth = ref('100%');\n\n            const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n            const counter = computed(() => `${textareaValue.value.length} / ${props.characterLimit}`);\n            const isOverCharacterLimit = computed(\n                () => props.characterLimit && textareaValue.value.length > props.characterLimit\n            );\n\n            const calculateHeight = () => {\n                const borderWidth = 3;\n                if (textareaElement.value && textareaElement.value.scrollHeight > defaultTextareaHeight) {\n                    textareaHeight.value = `${textareaElement.value.scrollHeight + borderWidth}px`;\n                }\n            };\n\n            watch(height, () => {\n                if (!height.value) {\n                    calculateHeight();\n                } else {\n                    textareaHeight.value = height.value;\n                }\n            });\n\n            watch(\n                () => props.value,\n                () => {\n                    textareaValue.value = props.value;\n                },\n                { immediate: true }\n            );\n\n            watch(\n                () => textareaValue.value,\n                async () => {\n                    if (!height.value) {\n                        // Hack to make the textarea calculate its height properly\n                        // Set the textarea back to the original value before calculating the height\n                        textareaHeight.value = `${defaultTextareaHeight}px`;\n                        if (!textareaValue.value) {\n                            return;\n                        }\n\n                        await nextTick();\n                        calculateHeight();\n                    }\n                },\n                { immediate: true }\n            );\n\n            const invalidInput = computed(() => !!props.errorMessage || isOverCharacterLimit.value);\n\n            const conditionalClasses = computed(() => ({\n                [`b-textarea--${BentoTextareaStateClass.DISABLED}`]: props.disabled,\n            }));\n\n            const conditionalClassesInput = computed(() => ({\n                [`b-textarea__input--${BentoTextareaStateClass.CLEARABLE}`]: props.clearable,\n                [`b-textarea__input--${BentoTextareaStateClass.READONLY}`]: props.readonly,\n                [`b-textarea__input--${BentoTextareaStateClass.ERROR}`]: invalidInput.value,\n                [`b-textarea__input--dynamic-height`]: !height.value,\n            }));\n\n            const conditionalClassesLabelBox = computed(() => ({\n                [`b-textarea__label-box--no-label`]: !props.label,\n            }));\n\n            const conditionalClassesLabelItem = computed(() => ({\n                [`b-textarea__label-item--${BentoTextareaStateClass.ERROR}`]: isOverCharacterLimit.value,\n            }));\n\n            const counterErrorText = computed(() =>\n                t('yourTextCanBenAtMost', { characterLimit: props.characterLimit })\n            );\n\n            const computedAriaLabel = useAriaLabel({\n                ariaLabel,\n                label,\n                defaultFallback: t('textarea'),\n            });\n\n            const showClearButton = computed(\n                () => props.clearable && textareaValue.value && !props.disabled && !props.readonly\n            );\n\n            const onClear = () => {\n                textareaValue.value = '';\n                emit(BentoTextareaEvent.CLEAR);\n                emit(BentoTextareaEvent.INPUT, '');\n            };\n\n            const onInput = (event: InputEvent) => {\n                if (!props.disabled && !props.readonly) {\n                    textareaValue.value = (event.target as HTMLInputElement).value;\n                    /**\n                     * Triggered when input value is changed\n                     *\n                     * @event input\n                     * @property {String} inputValue - the updated textarea value\n                     */\n                    emit(BentoTextareaEvent.INPUT, textareaValue.value);\n                }\n            };\n\n            const onBlur = () => {\n                textareaElement.value.scrollTop = 0;\n                emit(BentoTextareaEvent.BLUR);\n            };\n\n            const onFocus = () => {\n                textareaElement.value.focus();\n                emit(BentoTextareaEvent.FOCUS);\n            };\n\n            const onChange = () => {\n                emit(BentoTextareaEvent.CHANGE);\n            };\n\n            const onPressEscape = () => {\n                emit(BentoTextareaEvent.ESCAPE_PRESSED);\n            };\n\n            onMounted(() => {\n                observeSizeOfElement(textareaElement.value, () => {\n                    textareaWidth.value = `${textareaElement.value.offsetWidth}px`;\n                });\n\n                if (!height.value) {\n                    calculateHeight();\n                }\n            });\n\n            return {\n                // Enums\n                BentoButtonVariant,\n                BentoTextareaEvent,\n                BentoTypographyElement,\n\n                // Methods\n                onBlur,\n                onChange,\n                onClear,\n                onFocus,\n                onInput,\n                onPressEscape,\n                t,\n\n                // Values\n                computedAriaLabel,\n                conditionalClasses,\n                conditionalClassesLabelItem,\n                conditionalClassesLabelBox,\n                counter,\n                counterErrorText,\n                conditionalClassesInput,\n                invalidInput,\n                isOverCharacterLimit,\n                showClearButton,\n                textareaElement,\n                textareaHeight,\n                textareaId,\n                textareaValue,\n                textareaWidth,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./textarea.scss\" />\n"],"names":["BentoTextareaResizeOption","BentoTextareaResizeOption2","BentoTextareaStateClass","BentoTextareaStateClass2","BentoTextareaEvent","BentoTextareaEvent2","uuid","openBlock","createElementBlock","mergeProps","_ctx","_hoisted_1$1","toDisplayString","_sfc_main","defineComponent","messages","BentoButton","BentoTypography","ErrorMessage","CrossCircleFillSmallIcon","value","props","emit","ariaLabel","height","label","toRefs","textareaId","generateUid","textareaElement","ref","textareaValue","defaultTextareaHeight","textareaHeight","textareaWidth","t","useI18n","counter","computed","isOverCharacterLimit","calculateHeight","watch","nextTick","invalidInput","conditionalClasses","conditionalClassesInput","conditionalClassesLabelBox","conditionalClassesLabelItem","counterErrorText","computedAriaLabel","useAriaLabel","showClearButton","onClear","onInput","event","onBlur","onFocus","onChange","onPressEscape","onMounted","observeSizeOfElement","BentoButtonVariant","BentoTypographyElement","normalizeClass","createCommentVNode","createBlock","_component_bento_typography","_hoisted_1","createVNode","createElementVNode","normalizeStyle","_cache","args","withKeys","_hoisted_2","_hoisted_3","_component_bento_button","withCtx","_component_cross_circle_fill_small_icon","_component_error_message"],"mappings":"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","x_google_ignoreList":[1]}
+{"version":3,"file":"textarea.js","sources":["../../vue2/src/components/textarea/textarea.types.ts","../../../node_modules/@adyen/ui-assets-icons-16/dist/vue/cross-circle-fill-small.vue","../../vue2/src/components/textarea/textarea.vue"],"sourcesContent":["export enum BentoTextareaResizeOption {\n    HORIZONTAL = 'horizontal',\n    VERTICAL = 'vertical',\n    BOTH = 'both',\n    NONE = 'none',\n}\n\nexport enum BentoTextareaStateClass {\n    CLEARABLE = 'clearable',\n    DISABLED = 'disabled',\n    ERROR = 'error',\n    READONLY = 'readonly',\n}\n\nexport enum BentoTextareaEvent {\n    BLUR = 'blur',\n    CHANGE = 'change',\n    CLEAR = 'clear',\n    ESCAPE_PRESSED = 'escape-pressed',\n    FOCUS = 'focus',\n    INPUT = 'input',\n}\n","\n<template>\n    <svg role=\"img\" v-bind=\"$attrs\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"none\"><title v-if=\"$attrs['svg-title']\">{{ $attrs['svg-title'] }}</title><path fill=\"#00112C\" fill-rule=\"evenodd\" d=\"M2.25 8C2.25 4.82436 4.82436 2.25 8 2.25C11.1756 2.25 13.75 4.82436 13.75 8C13.75 11.1756 11.1756 13.75 8 13.75C4.82436 13.75 2.25 11.1756 2.25 8ZM5.46967 5.46967C5.17678 5.76256 5.17678 6.23744 5.46967 6.53033L6.93934 8L5.46967 9.46967C5.17678 9.76256 5.17678 10.2374 5.46967 10.5303C5.76256 10.8232 6.23744 10.8232 6.53033 10.5303L8 9.06066L9.46967 10.5303C9.76256 10.8232 10.2374 10.8232 10.5303 10.5303C10.8232 10.2374 10.8232 9.76256 10.5303 9.46967L9.06066 8L10.5303 6.53033C10.8232 6.23744 10.8232 5.76256 10.5303 5.46967C10.2374 5.17678 9.76256 5.17678 9.46967 5.46967L8 6.93934L6.53033 5.46967C6.23744 5.17678 5.76256 5.17678 5.46967 5.46967Z\" clip-rule=\"evenodd\"/></svg>\n</template>\n<script>\n    let uuid = 0;\n\n    export default {\n        beforeCreate() {\n            this.uuid = uuid.toString();\n            uuid += 1;\n        },\n    };\n</script>\n<style scoped lang=\"scss\">\n    svg {\n        display: inline-flex;\n        flex-shrink: 0;\n    }\n    \n    svg,\n    svg * {\n        fill: currentcolor;\n    }\n</style>\n","<template>\n    <div class=\"b-textarea\" :class=\"conditionalClasses\" :style=\"{ width: textareaWidth }\">\n        <div class=\"b-textarea__label-box\" :class=\"conditionalClassesLabelBox\">\n            <label v-if=\"label\" :for=\"textareaId\" class=\"b-textarea__label\">\n                <bento-typography :el=\"BentoTypographyElement.SPAN\" stronger>{{ label }}</bento-typography>\n                <bento-typography\n                    v-if=\"optional && !required\"\n                    :el=\"BentoTypographyElement.SPAN\"\n                    class=\"b-textarea__label-item\"\n                >\n                    ({{ t('optional') }})\n                </bento-typography>\n                <bento-typography v-if=\"required\" :el=\"BentoTypographyElement.SPAN\" class=\"b-textarea__label-item\">\n                    ({{ t('required') }})\n                </bento-typography>\n            </label>\n            <bento-typography\n                v-if=\"characterLimit\"\n                :el=\"BentoTypographyElement.SPAN\"\n                class=\"b-textarea__label-item\"\n                :class=\"conditionalClassesLabelItem\"\n            >\n                {{ counter }}\n            </bento-typography>\n        </div>\n        <bento-typography :el=\"BentoTypographyElement.DIV\" class=\"b-textarea__input-box\" :aria-disabled=\"disabled\">\n            <textarea\n                :id=\"textareaId\"\n                ref=\"textareaElement\"\n                :value=\"textareaValue\"\n                class=\"b-textarea__input\"\n                :class=\"conditionalClassesInput\"\n                :aria-label=\"computedAriaLabel\"\n                :aria-invalid=\"invalidInput\"\n                :readonly=\"isReadOnly\"\n                :disabled=\"disabled\"\n                :placeholder=\"placeholder\"\n                :style=\"{ resize: resizable, height: textareaHeight }\"\n                @blur=\"onBlur\"\n                @change=\"onChange\"\n                @focus=\"onFocus\"\n                @input=\"onInput\"\n                @keydown.esc=\"onPressEscape\"\n            >\n            </textarea>\n\n            <div v-if=\"showClearButton\" class=\"b-textarea__clear-button\">\n                <bento-button\n                    :variant=\"BentoButtonVariant.TERTIARY\"\n                    :disabled=\"disabled\"\n                    @click=\"onClear\"\n                    @keypress.enter=\"onClear\"\n                    @keyup.space=\"onClear\"\n                >\n                    <template #iconLeft>\n                        <cross-circle-fill-small-icon :svg-title=\"t('clearText')\" />\n                    </template>\n                </bento-button>\n            </div>\n        </bento-typography>\n\n        <error-message v-if=\"isOverCharacterLimit\" :error-message=\"counterErrorText\" />\n\n        <error-message v-if=\"errorMessage\" :error-message=\"errorMessage\" />\n\n        <bento-typography v-if=\"description\" class=\"b-textarea__description\" :el=\"BentoTypographyElement.SPAN\">\n            {{ description }}\n        </bento-typography>\n    </div>\n</template>\n\n<script lang=\"ts\">\n    import { computed, defineComponent, nextTick, onMounted, PropType, ref, toRef, toRefs, watch } from 'vue';\n    import { BentoTextareaEvent, BentoTextareaResizeOption, BentoTextareaStateClass } from './textarea.types';\n    import { BentoTypography, BentoTypographyElement } from '@/components/typography';\n    import { BentoButton, BentoButtonVariant } from '@/components/button';\n    import { ErrorMessage } from '@/components/internal';\n    import CrossCircleFillSmallIcon from '@adyen/ui-assets-icons-16/vue/cross-circle-fill-small';\n    import { generateUid } from '@/utils/ts/unique-id';\n    import { observeSizeOfElement } from '@/utils/ts/resize';\n    import { useI18n } from '@/utils/ts/i18n';\n\n    import messages from './messages.json';\n    import { useAriaLabel } from '@/utils/ts/aria-label';\n    import { useFormLayoutFieldLoading } from '@/composables/use-form-layout-loading/use-form-layout-loading';\n\n    type MessageSchema = (typeof messages)['en-US'];\n\n    export default defineComponent({\n        i18n: { messages },\n        name: 'bento-textarea',\n        components: { BentoButton, BentoTypography, ErrorMessage, CrossCircleFillSmallIcon },\n        props: {\n            /**\n             * Text that labels an the input element\n             */\n            ariaLabel: { type: String, default: undefined },\n\n            /**\n             * Text that shows number of characters in textarea\n             */\n            characterLimit: { type: Number, default: undefined },\n\n            /**\n             * Text displayed as the help text of the textarea\n             */\n            description: { type: String, default: '' },\n\n            /**\n             * Disables the possibility of changing value in the textarea\n             */\n            disabled: { type: Boolean, default: false },\n\n            /**\n             * If set to true, shows a button to clear all the text\n             */\n            clearable: { type: Boolean, default: false },\n\n            /**\n             * Adds error text\n             */\n            errorMessage: { type: String, default: '' },\n\n            /**\n             * Sets the height of the textarea, e.g 200px OR 20vh\n             */\n            height: { type: String, default: null },\n\n            /**\n             * Text displayed as the label of the textarea\n             */\n            label: { type: String, default: '' },\n\n            /**\n             * Highlights the textarea is optional.\n             */\n            optional: { type: Boolean, default: false },\n\n            /**\n             * Text displayed as the placeholder of the textarea\n             */\n            placeholder: { type: String, default: '' },\n\n            /**\n             * Set the textarea to read only state.\n             */\n            readonly: { type: Boolean, default: false },\n\n            /**\n             * Indicates the possibility of resize the textarea\n             */\n            resizable: {\n                type: String as PropType<BentoTextareaResizeOption | `${BentoTextareaResizeOption}`>,\n                default: BentoTextareaResizeOption.BOTH,\n                validator: (value: BentoTextareaResizeOption) =>\n                    Object.values(BentoTextareaResizeOption).includes(value),\n            },\n\n            /**\n             * Highlights the textarea is required.\n             */\n            required: { type: Boolean, default: false },\n\n            /**\n             * Text displayed as the value of the textarea\n             */\n            value: { type: String, default: '' },\n        },\n        emits: [\n            BentoTextareaEvent.BLUR,\n            BentoTextareaEvent.CHANGE,\n            BentoTextareaEvent.CLEAR,\n            BentoTextareaEvent.ESCAPE_PRESSED,\n            BentoTextareaEvent.FOCUS,\n            BentoTextareaEvent.INPUT,\n        ],\n        setup(props, { emit }) {\n            const { ariaLabel, height, label } = toRefs(props);\n\n            const textareaId = generateUid('textarea');\n            const textareaElement = ref<HTMLTextAreaElement>(null);\n            const textareaValue = ref(props.value);\n            const defaultTextareaHeight = 44;\n            const textareaHeight = ref(props.height || `${defaultTextareaHeight}px`);\n            const textareaWidth = ref('100%');\n\n            const { t } = useI18n<{ message: MessageSchema }>({ messages });\n\n            const { isReadOnly } = useFormLayoutFieldLoading(toRef(props, 'readonly'));\n\n            const counter = computed(() => `${textareaValue.value.length} / ${props.characterLimit}`);\n            const isOverCharacterLimit = computed(\n                () => props.characterLimit && textareaValue.value.length > props.characterLimit\n            );\n\n            const calculateHeight = () => {\n                const borderWidth = 3;\n                if (textareaElement.value && textareaElement.value.scrollHeight > defaultTextareaHeight) {\n                    textareaHeight.value = `${textareaElement.value.scrollHeight + borderWidth}px`;\n                }\n            };\n\n            watch(height, () => {\n                if (!height.value) {\n                    calculateHeight();\n                } else {\n                    textareaHeight.value = height.value;\n                }\n            });\n\n            watch(\n                () => props.value,\n                () => {\n                    textareaValue.value = props.value;\n                },\n                { immediate: true }\n            );\n\n            watch(\n                () => textareaValue.value,\n                async () => {\n                    if (!height.value) {\n                        // Hack to make the textarea calculate its height properly\n                        // Set the textarea back to the original value before calculating the height\n                        textareaHeight.value = `${defaultTextareaHeight}px`;\n                        if (!textareaValue.value) {\n                            return;\n                        }\n\n                        await nextTick();\n                        calculateHeight();\n                    }\n                },\n                { immediate: true }\n            );\n\n            const invalidInput = computed(() => !!props.errorMessage || isOverCharacterLimit.value);\n\n            const conditionalClasses = computed(() => ({\n                [`b-textarea--${BentoTextareaStateClass.DISABLED}`]: props.disabled,\n            }));\n\n            const conditionalClassesInput = computed(() => ({\n                [`b-textarea__input--${BentoTextareaStateClass.CLEARABLE}`]: props.clearable,\n                [`b-textarea__input--${BentoTextareaStateClass.READONLY}`]: isReadOnly.value,\n                [`b-textarea__input--${BentoTextareaStateClass.ERROR}`]: invalidInput.value,\n                [`b-textarea__input--dynamic-height`]: !height.value,\n            }));\n\n            const conditionalClassesLabelBox = computed(() => ({\n                [`b-textarea__label-box--no-label`]: !props.label,\n            }));\n\n            const conditionalClassesLabelItem = computed(() => ({\n                [`b-textarea__label-item--${BentoTextareaStateClass.ERROR}`]: isOverCharacterLimit.value,\n            }));\n\n            const counterErrorText = computed(() =>\n                t('yourTextCanBenAtMost', { characterLimit: props.characterLimit })\n            );\n\n            const computedAriaLabel = useAriaLabel({\n                ariaLabel,\n                label,\n                defaultFallback: t('textarea'),\n            });\n\n            const showClearButton = computed(\n                () => props.clearable && textareaValue.value && !props.disabled && !isReadOnly.value\n            );\n\n            const onClear = () => {\n                textareaValue.value = '';\n                emit(BentoTextareaEvent.CLEAR);\n                emit(BentoTextareaEvent.INPUT, '');\n            };\n\n            const onInput = (event: InputEvent) => {\n                if (!props.disabled && !isReadOnly.value) {\n                    textareaValue.value = (event.target as HTMLInputElement).value;\n                    /**\n                     * Triggered when input value is changed\n                     *\n                     * @event input\n                     * @property {String} inputValue - the updated textarea value\n                     */\n                    emit(BentoTextareaEvent.INPUT, textareaValue.value);\n                }\n            };\n\n            const onBlur = () => {\n                textareaElement.value.scrollTop = 0;\n                emit(BentoTextareaEvent.BLUR);\n            };\n\n            const onFocus = () => {\n                textareaElement.value.focus();\n                emit(BentoTextareaEvent.FOCUS);\n            };\n\n            const onChange = () => {\n                emit(BentoTextareaEvent.CHANGE);\n            };\n\n            const onPressEscape = () => {\n                emit(BentoTextareaEvent.ESCAPE_PRESSED);\n            };\n\n            onMounted(() => {\n                observeSizeOfElement(textareaElement.value, () => {\n                    textareaWidth.value = `${textareaElement.value.offsetWidth}px`;\n                });\n\n                if (!height.value) {\n                    calculateHeight();\n                }\n            });\n\n            return {\n                // Enums\n                BentoButtonVariant,\n                BentoTextareaEvent,\n                BentoTypographyElement,\n\n                // Methods\n                onBlur,\n                onChange,\n                onClear,\n                onFocus,\n                onInput,\n                onPressEscape,\n                t,\n\n                // Values\n                computedAriaLabel,\n                conditionalClasses,\n                conditionalClassesLabelItem,\n                conditionalClassesLabelBox,\n                counter,\n                counterErrorText,\n                conditionalClassesInput,\n                invalidInput,\n                isOverCharacterLimit,\n                isReadOnly,\n                showClearButton,\n                textareaElement,\n                textareaHeight,\n                textareaId,\n                textareaValue,\n                textareaWidth,\n            };\n        },\n    });\n</script>\n\n<style lang=\"scss\" scoped src=\"./textarea.scss\" />\n"],"names":["BentoTextareaResizeOption","BentoTextareaResizeOption2","BentoTextareaStateClass","BentoTextareaStateClass2","BentoTextareaEvent","BentoTextareaEvent2","uuid","openBlock","createElementBlock","mergeProps","_ctx","_hoisted_1$1","toDisplayString","_sfc_main","defineComponent","messages","BentoButton","BentoTypography","ErrorMessage","CrossCircleFillSmallIcon","value","props","emit","ariaLabel","height","label","toRefs","textareaId","generateUid","textareaElement","ref","textareaValue","defaultTextareaHeight","textareaHeight","textareaWidth","t","useI18n","isReadOnly","useFormLayoutFieldLoading","toRef","counter","computed","isOverCharacterLimit","calculateHeight","watch","nextTick","invalidInput","conditionalClasses","conditionalClassesInput","conditionalClassesLabelBox","conditionalClassesLabelItem","counterErrorText","computedAriaLabel","useAriaLabel","showClearButton","onClear","onInput","event","onBlur","onFocus","onChange","onPressEscape","onMounted","observeSizeOfElement","BentoButtonVariant","BentoTypographyElement","normalizeClass","createCommentVNode","createBlock","_component_bento_typography","_hoisted_1","createVNode","createElementVNode","normalizeStyle","_cache","args","withKeys","_hoisted_2","_hoisted_3","_component_bento_button","withCtx","_component_cross_circle_fill_small_icon","_component_error_message"],"mappings":"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","x_google_ignoreList":[1]}

package/dist/timeline.js

@@ -1,17 +1,17 @@
 import { defineComponent as W, ref as Y, computed as c, toRefs as ae, provide as V, openBlock as s, createElementBlock as _, renderSlot as oe, mergeProps as X, toDisplayString as y, createCommentVNode as h, pushScopeId as G, popScopeId as x, createElementVNode as p, inject as j, resolveComponent as w, createVNode as S, withCtx as b, createTextVNode as I, createBlock as C, resolveDynamicComponent as se, normalizeClass as q, Fragment as $, renderList as re } from "vue";
 import { _ as F } from "./chunks/_plugin-vue_export-helper.dad06003.js";
-import { B as le, a as me } from "./chunks/button.1f630b6e.js";
-import { B as de } from "./chunks/index.7dd953ea.js";
+import { B as le, a as me } from "./chunks/button.e1c39f66.js";
+import { B as de } from "./chunks/index.d27367cd.js";
 import { BentoTag as ue } from "./tag.js";
-import { B as ce, a as _e, b as pe } from "./chunks/index.ebf5f6cf.js";
-import { B as fe, a as he, S as ve } from "./chunks/index.64b7b3cc.js";
+import { B as ce, a as _e, b as pe } from "./chunks/index.222d29b0.js";
+import { B as fe, a as he, S as ve } from "./chunks/index.3da90517.js";
 import { C as ge } from "./chunks/checkmark-circle-fill.e6b84561.js";
 import { C as be } from "./chunks/cross-circle-fill.0feb37b3.js";
 import { r as ye, e as Ie, t as B, g as z } from "./chunks/index.f55fdc32.js";
 import { c as Te, a as Ee } from "./chunks/index.86453263.js";
 import { g as Se } from "./chunks/unique-id.a2a2b458.js";
 import { u as we } from "./chunks/i18n.6c402773.js";
-import "./assets/index33.css";
+import "./assets/index35.css";
 var H = 1e3 * 60, D = 60 * 24, J = D * 30, K = D * 365;
 function P(e, n) {
   var r = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {};
@@ -121,7 +121,7 @@ function Oe(e, n, r, l, f, a) {
     oe(e.$slots, "default", {}, void 0, !0)
   ]);
 }
-const mt = /* @__PURE__ */ F(Me, [["render", Oe], ["__scopeId", "data-v-81d01ba5"]]);
+const mt = /* @__PURE__ */ F(Me, [["render", Oe], ["__scopeId", "data-v-835711f5"]]);
 let Z = 0;
 const Ae = {
   beforeCreate() {
@@ -264,7 +264,7 @@ const ke = /* @__PURE__ */ F(Ae, [["render", Re], ["__scopeId", "data-v-f702de38
     };
   }
 });
-const ie = (e) => (G("data-v-7b96ecec"), e = e(), x(), e), Ve = {
+const ie = (e) => (G("data-v-e71b1cbd"), e = e(), x(), e), Ve = {
   key: 0,
   class: "b-timeline-item"
 }, Fe = {
@@ -421,7 +421,7 @@ function Qe(e, n, r, l, f, a) {
     ])) : h("", !0)
   ])) : h("", !0);
 }
-const dt = /* @__PURE__ */ F($e, [["render", Qe], ["__scopeId", "data-v-7b96ecec"]]);
+const dt = /* @__PURE__ */ F($e, [["render", Qe], ["__scopeId", "data-v-e71b1cbd"]]);
 export {
   mt as BentoTimeline,
   Ce as BentoTimelineGapUnit,