@7pmlabs/design-system 1.0.1 → 1.0.2

package/dist/design-system100.mjs

@@ -1,71 +1,9 @@
-import { defineComponent as w, ref as a, watch as c, onMounted as B, withDirectives as b, openBlock as D, createElementBlock as O, vModelText as x } from "vue";
-const _ = ["disabled"], K = /* @__PURE__ */ w({
-  __name: "BOtpFieldBox",
-  props: {
-    value: { default: "" },
-    focus: { type: Boolean, default: !1 },
-    isDisabled: { type: Boolean, default: !1 }
-  },
-  emits: ["on-change", "on-keydown", "on-keyup", "on-paste", "on-focus", "on-blur"],
-  setup(d, { expose: i, emit: r }) {
-    const t = d, s = r, n = a(t.value || ""), o = a(null), u = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"], f = () => {
-      if (!u.includes(n.value)) {
-        n.value = "";
-        return;
-      }
-      return n.value = n.value.toString(), n.value.length > 1 && (n.value = n.value.slice(0, 1)), s("on-change", n.value);
-    }, p = (e) => {
-      t.isDisabled && e.preventDefault();
-      const l = e;
-      [
-        "Alt",
-        "Control",
-        "Meta",
-        "Backspace",
-        "ArrowLeft",
-        "ArrowRight",
-        "v",
-        ...u
-      ].includes(l.key) ? s("on-keydown", e) : l.preventDefault();
-    }, v = (e) => {
-      s("on-keyup", e);
-    }, h = (e) => {
-      s("on-paste", e);
-    }, m = () => (o.value.select(), s("on-focus")), y = () => s("on-blur"), g = () => {
-      o.value.focus(), o.value.select();
-    };
-    return c(
-      () => t.value,
-      (e, l) => {
-        e !== l && (n.value = e);
-      }
-    ), c(
-      () => t.focus,
-      (e, l) => {
-        l !== e && o.value && t.focus && (o.value.focus(), o.value.select());
-      }
-    ), B(() => {
-      o.value && t.focus && (o.value.focus(), o.value.select());
-    }), i({ focus: g }), (e, l) => b((D(), O("input", {
-      ref_key: "inputRef",
-      ref: o,
-      "onUpdate:modelValue": l[0] || (l[0] = (k) => n.value = k),
-      disabled: e.isDisabled,
-      class: "ds-h-11 ds-w-11 ds-rounded-lg ds-border ds-text-center ds-drop-shadow-light ds-transition-all ds-duration-200",
-      inputmode: "numeric",
-      maxlength: "1",
-      onBlur: y,
-      onFocus: m,
-      onInput: f,
-      onKeydown: p,
-      onKeyup: v,
-      onPaste: h
-    }, null, 40, _)), [
-      [x, n.value]
-    ]);
-  }
-});
+import o from "./design-system128.mjs";
+var r = 1, n = 4;
+function L(e) {
+  return o(e, r | n);
+}
 export {
-  K as default
+  L as default
 };
 //# sourceMappingURL=design-system100.mjs.map

package/dist/design-system100.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system100.mjs","sources":["../src/components/BOtpField/BOtpFieldBox.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { vModelText as _vModelText, withDirectives as _withDirectives, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nconst _hoisted_1 = [\"disabled\"]\n\nimport { onMounted, ref, type Ref, watch } from 'vue';\n\n//#region Props\nexport interface Props {\n  value?: string;\n  focus?: boolean;\n  isDisabled?: boolean;\n}\n\n\nexport default /*@__PURE__*/_defineComponent({\n  __name: 'BOtpFieldBox',\n  props: {\n    value: { default: '' },\n    focus: { type: Boolean, default: false },\n    isDisabled: { type: Boolean, default: false }\n  },\n  emits: [\"on-change\", \"on-keydown\", \"on-keyup\", \"on-paste\", \"on-focus\", \"on-blur\"],\n  setup(__props: any, { expose: __expose, emit: __emit }) {\n\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst model = ref(props.value || '');\nconst inputRef = ref<HTMLInputElement | null>(null) as Ref<HTMLInputElement>;\nconst digits = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];\n//#endregion\n\n//#region Methods\nconst handleOnChange = () => {\n  if (!digits.includes(model.value)) {\n    model.value = '';\n    return;\n  }\n\n  model.value = model.value.toString();\n  if (model.value.length > 1) {\n    model.value = model.value.slice(0, 1);\n  }\n  return emit('on-change', model.value);\n};\n\nconst handleOnKeyDown = (event: KeyboardEvent) => {\n  if (props.isDisabled) {\n    event.preventDefault();\n  }\n  // Only allow characters 0-9, DEL, Backspace, Enter, Right and Left Arrows, and Pasting\n  const keyEvent = event;\n  if (\n    [\n      'Alt',\n      'Control',\n      'Meta',\n      'Backspace',\n      'ArrowLeft',\n      'ArrowRight',\n      'v',\n      ...digits,\n    ].includes(keyEvent.key)\n  ) {\n    emit('on-keydown', event);\n  } else {\n    keyEvent.preventDefault();\n  }\n};\nconst handleOnKeyUp = (event: KeyboardEvent) => {\n  emit('on-keyup', event);\n};\nconst handleOnPaste = (event: ClipboardEvent) => {\n  emit('on-paste', event);\n};\nconst handleOnFocus = () => {\n  inputRef.value.select();\n  return emit('on-focus');\n};\nconst handleOnBlur = () => emit('on-blur');\nconst focusFn = () => {\n  inputRef.value.focus();\n  inputRef.value.select();\n};\n//#endregion\n\n//#region Watchers\nwatch(\n  () => props.value,\n  (newValue, oldValue) => {\n    if (newValue !== oldValue) {\n      model.value = newValue;\n    }\n  },\n);\nwatch(\n  () => props.focus,\n  (newFocusValue, oldFocusValue) => {\n    // Check if focusedInput changed\n    // Prevent calling function if input already in focus\n    if (oldFocusValue !== newFocusValue && inputRef.value && props.focus) {\n      inputRef.value.focus();\n      inputRef.value.select();\n    }\n  },\n);\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n  if (inputRef.value && props.focus) {\n    inputRef.value.focus();\n    inputRef.value.select();\n  }\n});\n//#endregion\n\n__expose({ focus: focusFn });\n\nreturn (_ctx: any,_cache: any) => {\n  return _withDirectives((_openBlock(), _createElementBlock(\"input\", {\n    ref_key: \"inputRef\",\n    ref: inputRef,\n    \"onUpdate:modelValue\": _cache[0] || (_cache[0] = ($event: any) => ((model).value = $event)),\n    disabled: _ctx.isDisabled,\n    class: \"ds-h-11 ds-w-11 ds-rounded-lg ds-border ds-text-center ds-drop-shadow-light ds-transition-all ds-duration-200\",\n    inputmode: \"numeric\",\n    maxlength: \"1\",\n    onBlur: handleOnBlur,\n    onFocus: handleOnFocus,\n    onInput: handleOnChange,\n    onKeydown: handleOnKeyDown,\n    onKeyup: handleOnKeyUp,\n    onPaste: handleOnPaste\n  }, null, 40, _hoisted_1)), [\n    [_vModelText, model.value]\n  ])\n}\n}\n\n})"],"names":["_hoisted_1","_sfc_main","_defineComponent","__props","__expose","__emit","props","emit","model","ref","inputRef","digits","handleOnChange","handleOnKeyDown","event","keyEvent","handleOnKeyUp","handleOnPaste","handleOnFocus","handleOnBlur","focusFn","watch","newValue","oldValue","newFocusValue","oldFocusValue","onMounted","_ctx","_cache","_withDirectives","_openBlock","_createElementBlock","$event","_vModelText"],"mappings":"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"}
+{"version":3,"file":"design-system100.mjs","sources":["../node_modules/lodash-es/cloneDeep.js"],"sourcesContent":["import baseClone from './_baseClone.js';\n\n/** Used to compose bitmasks for cloning. */\nvar CLONE_DEEP_FLAG = 1,\n    CLONE_SYMBOLS_FLAG = 4;\n\n/**\n * This method is like `_.clone` except that it recursively clones `value`.\n *\n * @static\n * @memberOf _\n * @since 1.0.0\n * @category Lang\n * @param {*} value The value to recursively clone.\n * @returns {*} Returns the deep cloned value.\n * @see _.clone\n * @example\n *\n * var objects = [{ 'a': 1 }, { 'b': 2 }];\n *\n * var deep = _.cloneDeep(objects);\n * console.log(deep[0] === objects[0]);\n * // => false\n */\nfunction cloneDeep(value) {\n  return baseClone(value, CLONE_DEEP_FLAG | CLONE_SYMBOLS_FLAG);\n}\n\nexport default cloneDeep;\n"],"names":["CLONE_DEEP_FLAG","CLONE_SYMBOLS_FLAG","cloneDeep","value","baseClone"],"mappings":";AAGA,IAAIA,IAAkB,GAClBC,IAAqB;AAoBzB,SAASC,EAAUC,GAAO;AACxB,SAAOC,EAAUD,GAAOH,IAAkBC,CAAkB;AAC9D;","x_google_ignoreList":[0]}

package/dist/design-system101.mjs

@@ -1,9 +1,70 @@
-import o from "./design-system128.mjs";
-var r = 1, n = 4;
-function L(e) {
-  return o(e, r | n);
-}
+import { defineComponent as C, ref as h, computed as a, onMounted as B, onBeforeUnmount as E, openBlock as x, createBlock as y, withCtx as L, createElementVNode as d, normalizeClass as c, renderSlot as _ } from "vue";
+import { BModalSize as t } from "./design-system5.mjs";
+import M from "./design-system35.mjs";
+const P = /* @__PURE__ */ C({
+  __name: "BModalContainer",
+  props: {
+    size: { default: t.Medium },
+    fullscreen: { type: Boolean, default: !1 },
+    persistent: { type: Boolean, default: !1 }
+  },
+  emits: ["close"],
+  setup(i, { emit: u }) {
+    const s = i, n = u, o = h(null), m = a(() => {
+      let e = "ds-relative ds-w-full ds-h-auto ds-m-auto ds-flex ds-items-center ";
+      if (s.fullscreen)
+        e += "ds-w-screen ds-h-screen ";
+      else
+        switch (e += "ds-p-4 ", s.size) {
+          case t.Small:
+            e += "ds-max-w-md ";
+            break;
+          case t.Large:
+            e += "ds-max-w-4xl ";
+            break;
+          case t.Medium:
+          default:
+            e += "ds-max-w-2xl ";
+            break;
+        }
+      return e;
+    }), p = a(() => {
+      let e = "ds-relative ds-rounded-lg ds-shadow ";
+      return e += s.fullscreen ? "ds-w-screen ds-h-screen ds-rounded-none " : "", e;
+    }), f = () => {
+      document.addEventListener("keydown", r);
+    }, r = (e) => {
+      e.key === "Escape" && n("close");
+    }, v = () => {
+      document.addEventListener("click", l);
+    }, l = (e) => {
+      [o.value].some((k) => e.composedPath().includes(k)) || n("close");
+    };
+    return B(() => {
+      s.persistent || setTimeout(() => {
+        f(), v();
+      }, 200);
+    }), E(() => {
+      s.persistent || (document.removeEventListener("keydown", r), document.removeEventListener("click", l));
+    }), (e, w) => (x(), y(M, null, {
+      default: L(() => [
+        d("div", {
+          class: c([m.value, "modal-wrapper"])
+        }, [
+          d("div", {
+            ref_key: "modalWrapperContentRef",
+            ref: o,
+            class: c([p.value, "modal-wrapper-content ds-w-full"])
+          }, [
+            _(e.$slots, "default")
+          ], 2)
+        ], 2)
+      ]),
+      _: 3
+    }));
+  }
+});
 export {
-  L as default
+  P as default
 };
 //# sourceMappingURL=design-system101.mjs.map

package/dist/design-system101.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system101.mjs","sources":["../node_modules/lodash-es/cloneDeep.js"],"sourcesContent":["import baseClone from './_baseClone.js';\n\n/** Used to compose bitmasks for cloning. */\nvar CLONE_DEEP_FLAG = 1,\n    CLONE_SYMBOLS_FLAG = 4;\n\n/**\n * This method is like `_.clone` except that it recursively clones `value`.\n *\n * @static\n * @memberOf _\n * @since 1.0.0\n * @category Lang\n * @param {*} value The value to recursively clone.\n * @returns {*} Returns the deep cloned value.\n * @see _.clone\n * @example\n *\n * var objects = [{ 'a': 1 }, { 'b': 2 }];\n *\n * var deep = _.cloneDeep(objects);\n * console.log(deep[0] === objects[0]);\n * // => false\n */\nfunction cloneDeep(value) {\n  return baseClone(value, CLONE_DEEP_FLAG | CLONE_SYMBOLS_FLAG);\n}\n\nexport default cloneDeep;\n"],"names":["CLONE_DEEP_FLAG","CLONE_SYMBOLS_FLAG","cloneDeep","value","baseClone"],"mappings":";AAGA,IAAIA,IAAkB,GAClBC,IAAqB;AAoBzB,SAASC,EAAUC,GAAO;AACxB,SAAOC,EAAUD,GAAOH,IAAkBC,CAAkB;AAC9D;","x_google_ignoreList":[0]}
+{"version":3,"file":"design-system101.mjs","sources":["../src/components/BModal/BModalContainer.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, withCtx as _withCtx, openBlock as _openBlock, createBlock as _createBlock } from \"vue\"\n\nimport { BModalSize } from '@/constants/Enums';\nimport { computed, onBeforeUnmount, onMounted, ref } from 'vue';\nimport BOverlay from '../BOverlay.vue';\n\n//#region Props\nexport interface Props {\n  size?: BModalSize;\n  fullscreen?: boolean;\n  persistent?: boolean;\n}\n\n\nexport default /*@__PURE__*/_defineComponent({\n  __name: 'BModalContainer',\n  props: {\n    size: { default: BModalSize.Medium },\n    fullscreen: { type: Boolean, default: false },\n    persistent: { type: Boolean, default: false }\n  },\n  emits: [\"close\"],\n  setup(__props: any, { emit: __emit }) {\n\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst modalWrapperContentRef = ref<HTMLDivElement | null>(null);\nconst modalWrapperCssClass = computed(() => {\n  let result = `ds-relative ds-w-full ds-h-auto ds-m-auto ds-flex ds-items-center `;\n\n  if (props.fullscreen) {\n    result += `ds-w-screen ds-h-screen `;\n  } else {\n    result += `ds-p-4 `;\n    switch (props.size) {\n      case BModalSize.Small:\n        result += `ds-max-w-md `;\n        break;\n      case BModalSize.Large:\n        result += `ds-max-w-4xl `;\n        break;\n      case BModalSize.Medium:\n      default:\n        result += `ds-max-w-2xl `;\n        break;\n    }\n  }\n\n  return result;\n});\nconst modalWrapperContentCssClass = computed(() => {\n  let result = `ds-relative ds-rounded-lg ds-shadow `;\n  result += props.fullscreen ? `ds-w-screen ds-h-screen ds-rounded-none ` : ``;\n\n  return result;\n});\n//#endregion\n\n//#region Methods\nconst initPressEscapeEventListener = () => {\n  document.addEventListener('keydown', closeOnEscapePressed);\n};\nconst closeOnEscapePressed = (event: KeyboardEvent) => {\n  if (event.key === 'Escape') {\n    emit('close');\n  }\n};\nconst initClickOutsideEventListener = () => {\n  document.addEventListener('click', closeOnClickOutside);\n};\nconst closeOnClickOutside = (event: any) => {\n  const refs = [modalWrapperContentRef.value];\n  const withinBoundaries = refs.some((r) => event.composedPath().includes(r));\n  if (!withinBoundaries) {\n    emit('close');\n  }\n};\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n  if (!props.persistent) {\n    setTimeout(() => {\n      initPressEscapeEventListener();\n      initClickOutsideEventListener();\n    }, 200);\n  }\n});\nonBeforeUnmount(() => {\n  if (!props.persistent) {\n    document.removeEventListener('keydown', closeOnEscapePressed);\n    document.removeEventListener('click', closeOnClickOutside);\n  }\n});\n//#endregion\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createBlock(BOverlay, null, {\n    default: _withCtx(() => [\n      _createElementVNode(\"div\", {\n        class: _normalizeClass([modalWrapperCssClass.value, \"modal-wrapper\"])\n      }, [\n        _createElementVNode(\"div\", {\n          ref_key: \"modalWrapperContentRef\",\n          ref: modalWrapperContentRef,\n          class: _normalizeClass([modalWrapperContentCssClass.value, \"modal-wrapper-content ds-w-full\"])\n        }, [\n          _renderSlot(_ctx.$slots, \"default\")\n        ], 2)\n      ], 2)\n    ]),\n    _: 3\n  }))\n}\n}\n\n})"],"names":["_sfc_main","_defineComponent","BModalSize","__props","__emit","props","emit","modalWrapperContentRef","ref","modalWrapperCssClass","computed","result","modalWrapperContentCssClass","initPressEscapeEventListener","closeOnEscapePressed","event","initClickOutsideEventListener","closeOnClickOutside","r","onMounted","onBeforeUnmount","_ctx","_cache","_openBlock","_createBlock","BOverlay","_withCtx","_createElementVNode","_normalizeClass","_renderSlot"],"mappings":";;;AAeA,MAA4BA,IAAiBC,gBAAAA,EAAA;AAAA,EAC3C,QAAQ;AAAA,EACR,OAAO;AAAA,IACL,MAAM,EAAE,SAASC,EAAW,OAAO;AAAA,IACnC,YAAY,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,IAC5C,YAAY,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,EAC9C;AAAA,EACA,OAAO,CAAC,OAAO;AAAA,EACf,MAAMC,GAAc,EAAE,MAAMC,KAAU;AAExC,UAAMC,IAAQF,GAIRG,IAAOF,GAIPG,IAAyBC,EAA2B,IAAI,GACxDC,IAAuBC,EAAS,MAAM;AAC1C,UAAIC,IAAS;AAEb,UAAIN,EAAM;AACE,QAAAM,KAAA;AAAA;AAGV,gBADUA,KAAA,WACFN,EAAM,MAAM;AAAA,UAClB,KAAKH,EAAW;AACJ,YAAAS,KAAA;AACV;AAAA,UACF,KAAKT,EAAW;AACJ,YAAAS,KAAA;AACV;AAAA,UACF,KAAKT,EAAW;AAAA,UAChB;AACY,YAAAS,KAAA;AACV;AAAA,QACJ;AAGK,aAAAA;AAAA,IAAA,CACR,GACKC,IAA8BF,EAAS,MAAM;AACjD,UAAIC,IAAS;AACH,aAAAA,KAAAN,EAAM,aAAa,6CAA6C,IAEnEM;AAAA,IAAA,CACR,GAIKE,IAA+B,MAAM;AAChC,eAAA,iBAAiB,WAAWC,CAAoB;AAAA,IAAA,GAErDA,IAAuB,CAACC,MAAyB;AACjD,MAAAA,EAAM,QAAQ,YAChBT,EAAK,OAAO;AAAA,IACd,GAEIU,IAAgC,MAAM;AACjC,eAAA,iBAAiB,SAASC,CAAmB;AAAA,IAAA,GAElDA,IAAsB,CAACF,MAAe;AAG1C,MAFa,CAACR,EAAuB,KAAK,EACZ,KAAK,CAACW,MAAMH,EAAM,eAAe,SAASG,CAAC,CAAC,KAExEZ,EAAK,OAAO;AAAA,IACd;AAKF,WAAAa,EAAU,MAAM;AACV,MAACd,EAAM,cACT,WAAW,MAAM;AACc,QAAAQ,KACCG;SAC7B,GAAG;AAAA,IACR,CACD,GACDI,EAAgB,MAAM;AAChB,MAACf,EAAM,eACA,SAAA,oBAAoB,WAAWS,CAAoB,GACnD,SAAA,oBAAoB,SAASG,CAAmB;AAAA,IAC3D,CACD,GAGM,CAACI,GAAUC,OACRC,EAAW,GAAGC,EAAaC,GAAU,MAAM;AAAA,MACjD,SAASC,EAAS,MAAM;AAAA,QACtBC,EAAoB,OAAO;AAAA,UACzB,OAAOC,EAAgB,CAACnB,EAAqB,OAAO,eAAe,CAAC;AAAA,QAAA,GACnE;AAAA,UACDkB,EAAoB,OAAO;AAAA,YACzB,SAAS;AAAA,YACT,KAAKpB;AAAA,YACL,OAAOqB,EAAgB,CAAChB,EAA4B,OAAO,iCAAiC,CAAC;AAAA,UAAA,GAC5F;AAAA,YACDiB,EAAYR,EAAK,QAAQ,SAAS;AAAA,aACjC,CAAC;AAAA,WACH,CAAC;AAAA,MAAA,CACL;AAAA,MACD,GAAG;AAAA,IAAA,CACJ;AAAA,EAEH;AAEA,CAAC;"}

package/dist/design-system116.mjs

@@ -1,4 +1,4 @@
-import f from "./design-system99.mjs";
+import f from "./design-system101.mjs";
 export {
   f as default
 };

package/dist/design-system117.mjs

@@ -1,4 +1,4 @@
-import f from "./design-system100.mjs";
+import f from "./design-system99.mjs";
 export {
   f as default
 };

package/dist/design-system15.mjs

@@ -1,7 +1,7 @@
 import { defineComponent as u, computed as m, watch as f, onBeforeUnmount as p, openBlock as o, createBlock as a, Teleport as y, createVNode as B, Transition as _, withCtx as r, normalizeClass as v, renderSlot as z, createCommentVNode as V } from "vue";
 import { BModalSize as k } from "./design-system5.mjs";
 import { lockScrollBody as C, unlockScrollBody as n } from "./design-system6.mjs";
-import S from "./design-system99.mjs";
+import S from "./design-system101.mjs";
 const $ = {
   // https://vuejs.org/guide/components/attrs.html#disabling-attribute-inheritance
   inheritAttrs: !1

package/dist/design-system17.mjs

@@ -2,9 +2,9 @@ import { defineComponent as L, ref as f, computed as l, openBlock as d, createEl
 import J from "./design-system29.mjs";
 import { useValidationField as Q } from "./design-system3.mjs";
 import { useI18n as T } from "./design-system49.mjs";
-import X from "./design-system100.mjs";
+import X from "./design-system99.mjs";
 import Y from "./design-system98.mjs";
-import Z from "./design-system101.mjs";
+import Z from "./design-system100.mjs";
 const ee = { class: "ds-flex ds-items-center ds-justify-center ds-space-x-2" }, re = /* @__PURE__ */ L({
   __name: "BOtpField",
   props: {

package/dist/design-system40.mjs

@@ -1,4 +1,4 @@
-import { defineComponent as u, computed as w, openBlock as l, createElementBlock as d, normalizeClass as v, unref as i, createElementVNode as e, createCommentVNode as a, renderSlot as n } from "vue";
+import { defineComponent as u, computed as w, openBlock as l, createElementBlock as d, normalizeClass as v, unref as a, createElementVNode as e, createCommentVNode as r, renderSlot as n } from "vue";
 import { BToastItemType as o } from "./design-system5.mjs";
 const x = {
   key: 0,
@@ -6,7 +6,7 @@ const x = {
 }, g = {
   key: 1,
   class: "ds-flex ds-flex-initial ds-items-center ds-pr-2"
-}, y = { class: "ds-flex ds-flex-auto ds-flex-wrap ds-text-sm" }, h = {
+}, h = { class: "ds-flex ds-flex-auto ds-flex-wrap ds-text-sm" }, y = {
   key: 0,
   class: "ds-w-full"
 }, k = ["innerHTML"], L = {
@@ -22,9 +22,9 @@ const x = {
   },
   emits: ["close"],
   setup(c, { emit: m }) {
-    const r = c, f = m, p = w(() => {
-      let s = "ds-flex ds-items-center ds-w-80 ds-px-4 ds-py-5 ds-rounded-lg ds-shadow-2xl ";
-      switch (r.type) {
+    const i = c, f = m, p = w(() => {
+      let s = "ds-flex ds-items-center ds-w-80 ds-px-4 ds-py-5 ds-rounded-lg ds-shadow-2xl ds-bg-white ";
+      switch (i.type) {
         case o.Success:
           s += "";
           break;
@@ -40,7 +40,7 @@ const x = {
     return (s, t) => (l(), d("div", {
       class: v(p.value)
     }, [
-      i(o).Success === r.type ? (l(), d("div", x, t[1] || (t[1] = [
+      a(o).Success === i.type ? (l(), d("div", x, t[1] || (t[1] = [
         e("svg", {
           class: "ds-h-5 ds-w-5 ds-fill-[#00a86b]",
           viewBox: "0 0 512 512",
@@ -48,7 +48,7 @@ const x = {
         }, [
           e("path", { d: "M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM369 209L241 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L335 175c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z" })
         ], -1)
-      ]))) : i(o).Error === r.type ? (l(), d("div", g, t[2] || (t[2] = [
+      ]))) : a(o).Error === i.type ? (l(), d("div", g, t[2] || (t[2] = [
         e("svg", {
           class: "ds-h-5 ds-w-5 ds-fill-red-600",
           viewBox: "0 0 512 512",
@@ -56,16 +56,16 @@ const x = {
         }, [
           e("path", { d: "M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24V264c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z" })
         ], -1)
-      ]))) : a("", !0),
-      e("div", y, [
-        s.text || s.$slots.text ? (l(), d("div", h, [
+      ]))) : r("", !0),
+      e("div", h, [
+        s.text || s.$slots.text ? (l(), d("div", y, [
           n(s.$slots, "text", {}, () => [
             e("div", {
               class: "ds-font-semibold ds-text-black/80",
               innerHTML: s.text
             }, null, 8, k)
           ])
-        ])) : a("", !0),
+        ])) : r("", !0),
         s.message || s.$slots.message ? (l(), d("div", L, [
           n(s.$slots, "message", {}, () => [
             e("div", {
@@ -73,9 +73,9 @@ const x = {
               innerHTML: s.message
             }, null, 8, M)
           ])
-        ])) : a("", !0)
+        ])) : r("", !0)
       ]),
-      r.hideClose ? a("", !0) : (l(), d("div", {
+      i.hideClose ? r("", !0) : (l(), d("div", {
         key: 2,
         class: "ds-flex ds-flex-initial ds-cursor-pointer ds-items-center ds-pl-1",
         onClick: t[0] || (t[0] = (B) => f("close"))

package/dist/design-system40.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system40.mjs","sources":["../src/components/BToast/BToastItem.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { unref as _unref, createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock, createCommentVNode as _createCommentVNode, renderSlot as _renderSlot, normalizeClass as _normalizeClass } from \"vue\"\n\nconst _hoisted_1 = {\n  key: 0,\n  class: \"ds-flex ds-flex-initial ds-items-center ds-pr-2\"\n}\nconst _hoisted_2 = {\n  key: 1,\n  class: \"ds-flex ds-flex-initial ds-items-center ds-pr-2\"\n}\nconst _hoisted_3 = { class: \"ds-flex ds-flex-auto ds-flex-wrap ds-text-sm\" }\nconst _hoisted_4 = {\n  key: 0,\n  class: \"ds-w-full\"\n}\nconst _hoisted_5 = [\"innerHTML\"]\nconst _hoisted_6 = {\n  key: 1,\n  class: \"ds-w-full\"\n}\nconst _hoisted_7 = [\"innerHTML\"]\n\nimport { BToastItemType } from '@/constants/Enums';\nimport { computed } from 'vue';\n\n//#region Props\nexport interface Props {\n  text?: string;\n  message?: string;\n  type?: `${BToastItemType}`;\n  hideClose?: boolean;\n}\n\n\nexport default /*@__PURE__*/_defineComponent({\n  __name: 'BToastItem',\n  props: {\n    text: { default: '' },\n    message: { default: '' },\n    type: { default: BToastItemType.Default },\n    hideClose: { type: Boolean, default: false }\n  },\n  emits: [\"close\"],\n  setup(__props: any, { emit: __emit }) {\n\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst cssClass = computed<string>(() => {\n  let result = `ds-flex ds-items-center ds-w-80 ds-px-4 ds-py-5 ds-rounded-lg ds-shadow-2xl `;\n\n  switch (props.type) {\n    case BToastItemType.Success:\n      result += ``;\n      break;\n    case BToastItemType.Error:\n      result += ``;\n      break;\n    case BToastItemType.Default:\n    default:\n      result += ``;\n  }\n\n  return result;\n});\n//#endregion\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", {\n    class: _normalizeClass(cssClass.value)\n  }, [\n    (_unref(BToastItemType).Success === props.type)\n      ? (_openBlock(), _createElementBlock(\"div\", _hoisted_1, _cache[1] || (_cache[1] = [\n          _createElementVNode(\"svg\", {\n            class: \"ds-h-5 ds-w-5 ds-fill-[#00a86b]\",\n            viewBox: \"0 0 512 512\",\n            xmlns: \"http://www.w3.org/2000/svg\"\n          }, [\n            _createElementVNode(\"path\", { d: \"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM369 209L241 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L335 175c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z\" })\n          ], -1)\n        ])))\n      : (_unref(BToastItemType).Error === props.type)\n        ? (_openBlock(), _createElementBlock(\"div\", _hoisted_2, _cache[2] || (_cache[2] = [\n            _createElementVNode(\"svg\", {\n              class: \"ds-h-5 ds-w-5 ds-fill-red-600\",\n              viewBox: \"0 0 512 512\",\n              xmlns: \"http://www.w3.org/2000/svg\"\n            }, [\n              _createElementVNode(\"path\", { d: \"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24V264c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z\" })\n            ], -1)\n          ])))\n        : _createCommentVNode(\"\", true),\n    _createElementVNode(\"div\", _hoisted_3, [\n      (_ctx.text || _ctx.$slots.text)\n        ? (_openBlock(), _createElementBlock(\"div\", _hoisted_4, [\n            _renderSlot(_ctx.$slots, \"text\", {}, () => [\n              _createElementVNode(\"div\", {\n                class: \"ds-font-semibold ds-text-black/80\",\n                innerHTML: _ctx.text\n              }, null, 8, _hoisted_5)\n            ])\n          ]))\n        : _createCommentVNode(\"\", true),\n      (_ctx.message || _ctx.$slots.message)\n        ? (_openBlock(), _createElementBlock(\"div\", _hoisted_6, [\n            _renderSlot(_ctx.$slots, \"message\", {}, () => [\n              _createElementVNode(\"div\", {\n                class: \"ds-text-gray-500\",\n                innerHTML: _ctx.message\n              }, null, 8, _hoisted_7)\n            ])\n          ]))\n        : _createCommentVNode(\"\", true)\n    ]),\n    (!props.hideClose)\n      ? (_openBlock(), _createElementBlock(\"div\", {\n          key: 2,\n          class: \"ds-flex ds-flex-initial ds-cursor-pointer ds-items-center ds-pl-1\",\n          onClick: _cache[0] || (_cache[0] = ($event: any) => (emit('close')))\n        }, _cache[3] || (_cache[3] = [\n          _createElementVNode(\"svg\", {\n            class: \"ds-h-5 ds-w-5 ds-fill-gray-600\",\n            viewBox: \"0 0 384 512\",\n            xmlns: \"http://www.w3.org/2000/svg\"\n          }, [\n            _createElementVNode(\"path\", { d: \"M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z\" })\n          ], -1)\n        ])))\n      : _createCommentVNode(\"\", true)\n  ], 2))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_sfc_main","_defineComponent","BToastItemType","__props","__emit","props","emit","cssClass","computed","result","_ctx","_cache","_openBlock","_createElementBlock","_normalizeClass","_unref","_createElementVNode","_createCommentVNode","_renderSlot","$event"],"mappings":"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"}
+{"version":3,"file":"design-system40.mjs","sources":["../src/components/BToast/BToastItem.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { unref as _unref, createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock, createCommentVNode as _createCommentVNode, renderSlot as _renderSlot, normalizeClass as _normalizeClass } from \"vue\"\n\nconst _hoisted_1 = {\n  key: 0,\n  class: \"ds-flex ds-flex-initial ds-items-center ds-pr-2\"\n}\nconst _hoisted_2 = {\n  key: 1,\n  class: \"ds-flex ds-flex-initial ds-items-center ds-pr-2\"\n}\nconst _hoisted_3 = { class: \"ds-flex ds-flex-auto ds-flex-wrap ds-text-sm\" }\nconst _hoisted_4 = {\n  key: 0,\n  class: \"ds-w-full\"\n}\nconst _hoisted_5 = [\"innerHTML\"]\nconst _hoisted_6 = {\n  key: 1,\n  class: \"ds-w-full\"\n}\nconst _hoisted_7 = [\"innerHTML\"]\n\nimport { BToastItemType } from '@/constants/Enums';\nimport { computed } from 'vue';\n\n//#region Props\nexport interface Props {\n  text?: string;\n  message?: string;\n  type?: `${BToastItemType}`;\n  hideClose?: boolean;\n}\n\n\nexport default /*@__PURE__*/_defineComponent({\n  __name: 'BToastItem',\n  props: {\n    text: { default: '' },\n    message: { default: '' },\n    type: { default: BToastItemType.Default },\n    hideClose: { type: Boolean, default: false }\n  },\n  emits: [\"close\"],\n  setup(__props: any, { emit: __emit }) {\n\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst cssClass = computed<string>(() => {\n  let result = `ds-flex ds-items-center ds-w-80 ds-px-4 ds-py-5 ds-rounded-lg ds-shadow-2xl ds-bg-white `;\n\n  switch (props.type) {\n    case BToastItemType.Success:\n      result += ``;\n      break;\n    case BToastItemType.Error:\n      result += ``;\n      break;\n    case BToastItemType.Default:\n    default:\n      result += ``;\n  }\n\n  return result;\n});\n//#endregion\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createElementBlock(\"div\", {\n    class: _normalizeClass(cssClass.value)\n  }, [\n    (_unref(BToastItemType).Success === props.type)\n      ? (_openBlock(), _createElementBlock(\"div\", _hoisted_1, _cache[1] || (_cache[1] = [\n          _createElementVNode(\"svg\", {\n            class: \"ds-h-5 ds-w-5 ds-fill-[#00a86b]\",\n            viewBox: \"0 0 512 512\",\n            xmlns: \"http://www.w3.org/2000/svg\"\n          }, [\n            _createElementVNode(\"path\", { d: \"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM369 209L241 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L335 175c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z\" })\n          ], -1)\n        ])))\n      : (_unref(BToastItemType).Error === props.type)\n        ? (_openBlock(), _createElementBlock(\"div\", _hoisted_2, _cache[2] || (_cache[2] = [\n            _createElementVNode(\"svg\", {\n              class: \"ds-h-5 ds-w-5 ds-fill-red-600\",\n              viewBox: \"0 0 512 512\",\n              xmlns: \"http://www.w3.org/2000/svg\"\n            }, [\n              _createElementVNode(\"path\", { d: \"M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c13.3 0 24 10.7 24 24V264c0 13.3-10.7 24-24 24s-24-10.7-24-24V152c0-13.3 10.7-24 24-24zM224 352a32 32 0 1 1 64 0 32 32 0 1 1 -64 0z\" })\n            ], -1)\n          ])))\n        : _createCommentVNode(\"\", true),\n    _createElementVNode(\"div\", _hoisted_3, [\n      (_ctx.text || _ctx.$slots.text)\n        ? (_openBlock(), _createElementBlock(\"div\", _hoisted_4, [\n            _renderSlot(_ctx.$slots, \"text\", {}, () => [\n              _createElementVNode(\"div\", {\n                class: \"ds-font-semibold ds-text-black/80\",\n                innerHTML: _ctx.text\n              }, null, 8, _hoisted_5)\n            ])\n          ]))\n        : _createCommentVNode(\"\", true),\n      (_ctx.message || _ctx.$slots.message)\n        ? (_openBlock(), _createElementBlock(\"div\", _hoisted_6, [\n            _renderSlot(_ctx.$slots, \"message\", {}, () => [\n              _createElementVNode(\"div\", {\n                class: \"ds-text-gray-500\",\n                innerHTML: _ctx.message\n              }, null, 8, _hoisted_7)\n            ])\n          ]))\n        : _createCommentVNode(\"\", true)\n    ]),\n    (!props.hideClose)\n      ? (_openBlock(), _createElementBlock(\"div\", {\n          key: 2,\n          class: \"ds-flex ds-flex-initial ds-cursor-pointer ds-items-center ds-pl-1\",\n          onClick: _cache[0] || (_cache[0] = ($event: any) => (emit('close')))\n        }, _cache[3] || (_cache[3] = [\n          _createElementVNode(\"svg\", {\n            class: \"ds-h-5 ds-w-5 ds-fill-gray-600\",\n            viewBox: \"0 0 384 512\",\n            xmlns: \"http://www.w3.org/2000/svg\"\n          }, [\n            _createElementVNode(\"path\", { d: \"M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z\" })\n          ], -1)\n        ])))\n      : _createCommentVNode(\"\", true)\n  ], 2))\n}\n}\n\n})"],"names":["_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_sfc_main","_defineComponent","BToastItemType","__props","__emit","props","emit","cssClass","computed","result","_ctx","_cache","_openBlock","_createElementBlock","_normalizeClass","_unref","_createElementVNode","_createCommentVNode","_renderSlot","$event"],"mappings":"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"}

package/dist/design-system99.mjs

@@ -1,70 +1,71 @@
-import { defineComponent as C, ref as h, computed as a, onMounted as B, onBeforeUnmount as E, openBlock as x, createBlock as y, withCtx as L, createElementVNode as d, normalizeClass as c, renderSlot as _ } from "vue";
-import { BModalSize as t } from "./design-system5.mjs";
-import M from "./design-system35.mjs";
-const P = /* @__PURE__ */ C({
-  __name: "BModalContainer",
+import { defineComponent as w, ref as a, watch as c, onMounted as B, withDirectives as b, openBlock as D, createElementBlock as O, vModelText as x } from "vue";
+const _ = ["disabled"], K = /* @__PURE__ */ w({
+  __name: "BOtpFieldBox",
   props: {
-    size: { default: t.Medium },
-    fullscreen: { type: Boolean, default: !1 },
-    persistent: { type: Boolean, default: !1 }
+    value: { default: "" },
+    focus: { type: Boolean, default: !1 },
+    isDisabled: { type: Boolean, default: !1 }
   },
-  emits: ["close"],
-  setup(i, { emit: u }) {
-    const s = i, n = u, o = h(null), m = a(() => {
-      let e = "ds-relative ds-w-full ds-h-auto ds-m-auto ds-flex ds-items-center ";
-      if (s.fullscreen)
-        e += "ds-w-screen ds-h-screen ";
-      else
-        switch (e += "ds-p-4 ", s.size) {
-          case t.Small:
-            e += "ds-max-w-md ";
-            break;
-          case t.Large:
-            e += "ds-max-w-4xl ";
-            break;
-          case t.Medium:
-          default:
-            e += "ds-max-w-2xl ";
-            break;
-        }
-      return e;
-    }), p = a(() => {
-      let e = "ds-relative ds-rounded-lg ds-shadow ";
-      return e += s.fullscreen ? "ds-w-screen ds-h-screen ds-rounded-none " : "", e;
-    }), f = () => {
-      document.addEventListener("keydown", r);
-    }, r = (e) => {
-      e.key === "Escape" && n("close");
-    }, v = () => {
-      document.addEventListener("click", l);
-    }, l = (e) => {
-      [o.value].some((k) => e.composedPath().includes(k)) || n("close");
+  emits: ["on-change", "on-keydown", "on-keyup", "on-paste", "on-focus", "on-blur"],
+  setup(d, { expose: i, emit: r }) {
+    const t = d, s = r, n = a(t.value || ""), o = a(null), u = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"], f = () => {
+      if (!u.includes(n.value)) {
+        n.value = "";
+        return;
+      }
+      return n.value = n.value.toString(), n.value.length > 1 && (n.value = n.value.slice(0, 1)), s("on-change", n.value);
+    }, p = (e) => {
+      t.isDisabled && e.preventDefault();
+      const l = e;
+      [
+        "Alt",
+        "Control",
+        "Meta",
+        "Backspace",
+        "ArrowLeft",
+        "ArrowRight",
+        "v",
+        ...u
+      ].includes(l.key) ? s("on-keydown", e) : l.preventDefault();
+    }, v = (e) => {
+      s("on-keyup", e);
+    }, h = (e) => {
+      s("on-paste", e);
+    }, m = () => (o.value.select(), s("on-focus")), y = () => s("on-blur"), g = () => {
+      o.value.focus(), o.value.select();
     };
-    return B(() => {
-      s.persistent || setTimeout(() => {
-        f(), v();
-      }, 200);
-    }), E(() => {
-      s.persistent || (document.removeEventListener("keydown", r), document.removeEventListener("click", l));
-    }), (e, w) => (x(), y(M, null, {
-      default: L(() => [
-        d("div", {
-          class: c([m.value, "modal-wrapper"])
-        }, [
-          d("div", {
-            ref_key: "modalWrapperContentRef",
-            ref: o,
-            class: c([p.value, "modal-wrapper-content ds-w-full"])
-          }, [
-            _(e.$slots, "default")
-          ], 2)
-        ], 2)
-      ]),
-      _: 3
-    }));
+    return c(
+      () => t.value,
+      (e, l) => {
+        e !== l && (n.value = e);
+      }
+    ), c(
+      () => t.focus,
+      (e, l) => {
+        l !== e && o.value && t.focus && (o.value.focus(), o.value.select());
+      }
+    ), B(() => {
+      o.value && t.focus && (o.value.focus(), o.value.select());
+    }), i({ focus: g }), (e, l) => b((D(), O("input", {
+      ref_key: "inputRef",
+      ref: o,
+      "onUpdate:modelValue": l[0] || (l[0] = (k) => n.value = k),
+      disabled: e.isDisabled,
+      class: "ds-h-11 ds-w-11 ds-rounded-lg ds-border ds-text-center ds-drop-shadow-light ds-transition-all ds-duration-200",
+      inputmode: "numeric",
+      maxlength: "1",
+      onBlur: y,
+      onFocus: m,
+      onInput: f,
+      onKeydown: p,
+      onKeyup: v,
+      onPaste: h
+    }, null, 40, _)), [
+      [x, n.value]
+    ]);
   }
 });
 export {
-  P as default
+  K as default
 };
 //# sourceMappingURL=design-system99.mjs.map

package/dist/design-system99.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"design-system99.mjs","sources":["../src/components/BModal/BModalContainer.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { renderSlot as _renderSlot, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, withCtx as _withCtx, openBlock as _openBlock, createBlock as _createBlock } from \"vue\"\n\nimport { BModalSize } from '@/constants/Enums';\nimport { computed, onBeforeUnmount, onMounted, ref } from 'vue';\nimport BOverlay from '../BOverlay.vue';\n\n//#region Props\nexport interface Props {\n  size?: BModalSize;\n  fullscreen?: boolean;\n  persistent?: boolean;\n}\n\n\nexport default /*@__PURE__*/_defineComponent({\n  __name: 'BModalContainer',\n  props: {\n    size: { default: BModalSize.Medium },\n    fullscreen: { type: Boolean, default: false },\n    persistent: { type: Boolean, default: false }\n  },\n  emits: [\"close\"],\n  setup(__props: any, { emit: __emit }) {\n\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst modalWrapperContentRef = ref<HTMLDivElement | null>(null);\nconst modalWrapperCssClass = computed(() => {\n  let result = `ds-relative ds-w-full ds-h-auto ds-m-auto ds-flex ds-items-center `;\n\n  if (props.fullscreen) {\n    result += `ds-w-screen ds-h-screen `;\n  } else {\n    result += `ds-p-4 `;\n    switch (props.size) {\n      case BModalSize.Small:\n        result += `ds-max-w-md `;\n        break;\n      case BModalSize.Large:\n        result += `ds-max-w-4xl `;\n        break;\n      case BModalSize.Medium:\n      default:\n        result += `ds-max-w-2xl `;\n        break;\n    }\n  }\n\n  return result;\n});\nconst modalWrapperContentCssClass = computed(() => {\n  let result = `ds-relative ds-rounded-lg ds-shadow `;\n  result += props.fullscreen ? `ds-w-screen ds-h-screen ds-rounded-none ` : ``;\n\n  return result;\n});\n//#endregion\n\n//#region Methods\nconst initPressEscapeEventListener = () => {\n  document.addEventListener('keydown', closeOnEscapePressed);\n};\nconst closeOnEscapePressed = (event: KeyboardEvent) => {\n  if (event.key === 'Escape') {\n    emit('close');\n  }\n};\nconst initClickOutsideEventListener = () => {\n  document.addEventListener('click', closeOnClickOutside);\n};\nconst closeOnClickOutside = (event: any) => {\n  const refs = [modalWrapperContentRef.value];\n  const withinBoundaries = refs.some((r) => event.composedPath().includes(r));\n  if (!withinBoundaries) {\n    emit('close');\n  }\n};\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n  if (!props.persistent) {\n    setTimeout(() => {\n      initPressEscapeEventListener();\n      initClickOutsideEventListener();\n    }, 200);\n  }\n});\nonBeforeUnmount(() => {\n  if (!props.persistent) {\n    document.removeEventListener('keydown', closeOnEscapePressed);\n    document.removeEventListener('click', closeOnClickOutside);\n  }\n});\n//#endregion\n\nreturn (_ctx: any,_cache: any) => {\n  return (_openBlock(), _createBlock(BOverlay, null, {\n    default: _withCtx(() => [\n      _createElementVNode(\"div\", {\n        class: _normalizeClass([modalWrapperCssClass.value, \"modal-wrapper\"])\n      }, [\n        _createElementVNode(\"div\", {\n          ref_key: \"modalWrapperContentRef\",\n          ref: modalWrapperContentRef,\n          class: _normalizeClass([modalWrapperContentCssClass.value, \"modal-wrapper-content ds-w-full\"])\n        }, [\n          _renderSlot(_ctx.$slots, \"default\")\n        ], 2)\n      ], 2)\n    ]),\n    _: 3\n  }))\n}\n}\n\n})"],"names":["_sfc_main","_defineComponent","BModalSize","__props","__emit","props","emit","modalWrapperContentRef","ref","modalWrapperCssClass","computed","result","modalWrapperContentCssClass","initPressEscapeEventListener","closeOnEscapePressed","event","initClickOutsideEventListener","closeOnClickOutside","r","onMounted","onBeforeUnmount","_ctx","_cache","_openBlock","_createBlock","BOverlay","_withCtx","_createElementVNode","_normalizeClass","_renderSlot"],"mappings":";;;AAeA,MAA4BA,IAAiBC,gBAAAA,EAAA;AAAA,EAC3C,QAAQ;AAAA,EACR,OAAO;AAAA,IACL,MAAM,EAAE,SAASC,EAAW,OAAO;AAAA,IACnC,YAAY,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,IAC5C,YAAY,EAAE,MAAM,SAAS,SAAS,GAAM;AAAA,EAC9C;AAAA,EACA,OAAO,CAAC,OAAO;AAAA,EACf,MAAMC,GAAc,EAAE,MAAMC,KAAU;AAExC,UAAMC,IAAQF,GAIRG,IAAOF,GAIPG,IAAyBC,EAA2B,IAAI,GACxDC,IAAuBC,EAAS,MAAM;AAC1C,UAAIC,IAAS;AAEb,UAAIN,EAAM;AACE,QAAAM,KAAA;AAAA;AAGV,gBADUA,KAAA,WACFN,EAAM,MAAM;AAAA,UAClB,KAAKH,EAAW;AACJ,YAAAS,KAAA;AACV;AAAA,UACF,KAAKT,EAAW;AACJ,YAAAS,KAAA;AACV;AAAA,UACF,KAAKT,EAAW;AAAA,UAChB;AACY,YAAAS,KAAA;AACV;AAAA,QACJ;AAGK,aAAAA;AAAA,IAAA,CACR,GACKC,IAA8BF,EAAS,MAAM;AACjD,UAAIC,IAAS;AACH,aAAAA,KAAAN,EAAM,aAAa,6CAA6C,IAEnEM;AAAA,IAAA,CACR,GAIKE,IAA+B,MAAM;AAChC,eAAA,iBAAiB,WAAWC,CAAoB;AAAA,IAAA,GAErDA,IAAuB,CAACC,MAAyB;AACjD,MAAAA,EAAM,QAAQ,YAChBT,EAAK,OAAO;AAAA,IACd,GAEIU,IAAgC,MAAM;AACjC,eAAA,iBAAiB,SAASC,CAAmB;AAAA,IAAA,GAElDA,IAAsB,CAACF,MAAe;AAG1C,MAFa,CAACR,EAAuB,KAAK,EACZ,KAAK,CAACW,MAAMH,EAAM,eAAe,SAASG,CAAC,CAAC,KAExEZ,EAAK,OAAO;AAAA,IACd;AAKF,WAAAa,EAAU,MAAM;AACV,MAACd,EAAM,cACT,WAAW,MAAM;AACc,QAAAQ,KACCG;SAC7B,GAAG;AAAA,IACR,CACD,GACDI,EAAgB,MAAM;AAChB,MAACf,EAAM,eACA,SAAA,oBAAoB,WAAWS,CAAoB,GACnD,SAAA,oBAAoB,SAASG,CAAmB;AAAA,IAC3D,CACD,GAGM,CAACI,GAAUC,OACRC,EAAW,GAAGC,EAAaC,GAAU,MAAM;AAAA,MACjD,SAASC,EAAS,MAAM;AAAA,QACtBC,EAAoB,OAAO;AAAA,UACzB,OAAOC,EAAgB,CAACnB,EAAqB,OAAO,eAAe,CAAC;AAAA,QAAA,GACnE;AAAA,UACDkB,EAAoB,OAAO;AAAA,YACzB,SAAS;AAAA,YACT,KAAKpB;AAAA,YACL,OAAOqB,EAAgB,CAAChB,EAA4B,OAAO,iCAAiC,CAAC;AAAA,UAAA,GAC5F;AAAA,YACDiB,EAAYR,EAAK,QAAQ,SAAS;AAAA,aACjC,CAAC;AAAA,WACH,CAAC;AAAA,MAAA,CACL;AAAA,MACD,GAAG;AAAA,IAAA,CACJ;AAAA,EAEH;AAEA,CAAC;"}
+{"version":3,"file":"design-system99.mjs","sources":["../src/components/BOtpField/BOtpFieldBox.vue?vue&type=script&setup=true&lang.ts"],"sourcesContent":["import { defineComponent as _defineComponent } from 'vue'\nimport { vModelText as _vModelText, withDirectives as _withDirectives, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nconst _hoisted_1 = [\"disabled\"]\n\nimport { onMounted, ref, type Ref, watch } from 'vue';\n\n//#region Props\nexport interface Props {\n  value?: string;\n  focus?: boolean;\n  isDisabled?: boolean;\n}\n\n\nexport default /*@__PURE__*/_defineComponent({\n  __name: 'BOtpFieldBox',\n  props: {\n    value: { default: '' },\n    focus: { type: Boolean, default: false },\n    isDisabled: { type: Boolean, default: false }\n  },\n  emits: [\"on-change\", \"on-keydown\", \"on-keyup\", \"on-paste\", \"on-focus\", \"on-blur\"],\n  setup(__props: any, { expose: __expose, emit: __emit }) {\n\nconst props = __props;\n//#endregion\n\n//#region Events\nconst emit = __emit;\n//#endregion\n\n//#region Data\nconst model = ref(props.value || '');\nconst inputRef = ref<HTMLInputElement | null>(null) as Ref<HTMLInputElement>;\nconst digits = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];\n//#endregion\n\n//#region Methods\nconst handleOnChange = () => {\n  if (!digits.includes(model.value)) {\n    model.value = '';\n    return;\n  }\n\n  model.value = model.value.toString();\n  if (model.value.length > 1) {\n    model.value = model.value.slice(0, 1);\n  }\n  return emit('on-change', model.value);\n};\n\nconst handleOnKeyDown = (event: KeyboardEvent) => {\n  if (props.isDisabled) {\n    event.preventDefault();\n  }\n  // Only allow characters 0-9, DEL, Backspace, Enter, Right and Left Arrows, and Pasting\n  const keyEvent = event;\n  if (\n    [\n      'Alt',\n      'Control',\n      'Meta',\n      'Backspace',\n      'ArrowLeft',\n      'ArrowRight',\n      'v',\n      ...digits,\n    ].includes(keyEvent.key)\n  ) {\n    emit('on-keydown', event);\n  } else {\n    keyEvent.preventDefault();\n  }\n};\nconst handleOnKeyUp = (event: KeyboardEvent) => {\n  emit('on-keyup', event);\n};\nconst handleOnPaste = (event: ClipboardEvent) => {\n  emit('on-paste', event);\n};\nconst handleOnFocus = () => {\n  inputRef.value.select();\n  return emit('on-focus');\n};\nconst handleOnBlur = () => emit('on-blur');\nconst focusFn = () => {\n  inputRef.value.focus();\n  inputRef.value.select();\n};\n//#endregion\n\n//#region Watchers\nwatch(\n  () => props.value,\n  (newValue, oldValue) => {\n    if (newValue !== oldValue) {\n      model.value = newValue;\n    }\n  },\n);\nwatch(\n  () => props.focus,\n  (newFocusValue, oldFocusValue) => {\n    // Check if focusedInput changed\n    // Prevent calling function if input already in focus\n    if (oldFocusValue !== newFocusValue && inputRef.value && props.focus) {\n      inputRef.value.focus();\n      inputRef.value.select();\n    }\n  },\n);\n//#endregion\n\n//#region Lifecycle Hooks\nonMounted(() => {\n  if (inputRef.value && props.focus) {\n    inputRef.value.focus();\n    inputRef.value.select();\n  }\n});\n//#endregion\n\n__expose({ focus: focusFn });\n\nreturn (_ctx: any,_cache: any) => {\n  return _withDirectives((_openBlock(), _createElementBlock(\"input\", {\n    ref_key: \"inputRef\",\n    ref: inputRef,\n    \"onUpdate:modelValue\": _cache[0] || (_cache[0] = ($event: any) => ((model).value = $event)),\n    disabled: _ctx.isDisabled,\n    class: \"ds-h-11 ds-w-11 ds-rounded-lg ds-border ds-text-center ds-drop-shadow-light ds-transition-all ds-duration-200\",\n    inputmode: \"numeric\",\n    maxlength: \"1\",\n    onBlur: handleOnBlur,\n    onFocus: handleOnFocus,\n    onInput: handleOnChange,\n    onKeydown: handleOnKeyDown,\n    onKeyup: handleOnKeyUp,\n    onPaste: handleOnPaste\n  }, null, 40, _hoisted_1)), [\n    [_vModelText, model.value]\n  ])\n}\n}\n\n})"],"names":["_hoisted_1","_sfc_main","_defineComponent","__props","__expose","__emit","props","emit","model","ref","inputRef","digits","handleOnChange","handleOnKeyDown","event","keyEvent","handleOnKeyUp","handleOnPaste","handleOnFocus","handleOnBlur","focusFn","watch","newValue","oldValue","newFocusValue","oldFocusValue","onMounted","_ctx","_cache","_withDirectives","_openBlock","_createElementBlock","$event","_vModelText"],"mappings":"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"}

package/dist/style.css

@@ -1 +1 @@
-@layer design-system{*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}:root{--ds-colors-primary-f: 6 182 212;--ds-colors-primary-t: 59 130 246;--ds-colors-focus: 86 221 214;--ds-colors-primary-f-stop: 0%;--ds-colors-primary-t-stop: 100%}.ds-container{width:100%}@media (min-width: 640px){.ds-container{max-width:640px}}@media (min-width: 768px){.ds-container{max-width:768px}}@media (min-width: 1024px){.ds-container{max-width:1024px}}@media (min-width: 1280px){.ds-container{max-width:1280px}}@media (min-width: 1536px){.ds-container{max-width:1536px}}.ds-pointer-events-none{pointer-events:none}.ds-fixed{position:fixed}.ds-absolute{position:absolute}.ds-relative{position:relative}.ds-left-0{left:0}.ds-left-3{left:.75rem}.ds-right-0{right:0}.ds-right-1{right:.25rem}.ds-right-3{right:.75rem}.ds-right-4{right:1rem}.ds-top-0{top:0}.ds-top-1{top:.25rem}.ds-top-4{top:1rem}.ds-z-10{z-index:10}.ds-z-100{z-index:100}.ds-z-50{z-index:50}.ds-z-\[110\]{z-index:110}.ds-z-\[1\]{z-index:1}.ds-z-\[3\]{z-index:3}.ds-m-auto{margin:auto}.-ds-mx-0\.5{margin-left:-.125rem;margin-right:-.125rem}.ds-mx-auto{margin-left:auto;margin-right:auto}.ds-my-0\.5{margin-top:.125rem;margin-bottom:.125rem}.ds-my-2{margin-top:.5rem;margin-bottom:.5rem}.ds-my-24{margin-top:6rem;margin-bottom:6rem}.-ds-ml-\[25px\]{margin-left:-25px}.ds-mb-0\.5{margin-bottom:.125rem}.ds-mb-1{margin-bottom:.25rem}.ds-mb-2{margin-bottom:.5rem}.ds-mb-4{margin-bottom:1rem}.ds-ml-0{margin-left:0}.ds-ml-1{margin-left:.25rem}.ds-ml-2{margin-left:.5rem}.ds-ml-4{margin-left:1rem}.ds-mt-1{margin-top:.25rem}.ds-mt-4{margin-top:1rem}.ds-mt-8{margin-top:2rem}.ds-block{display:block}.ds-inline-block{display:inline-block}.ds-inline{display:inline}.ds-flex{display:flex}.ds-inline-flex{display:inline-flex}.ds-grid{display:grid}.ds-hidden{display:none}.ds-aspect-square{aspect-ratio:1 / 1}.\!ds-h-\[30px\]{height:30px!important}.ds-h-10{height:2.5rem}.ds-h-11{height:2.75rem}.ds-h-12{height:3rem}.ds-h-3\.5{height:.875rem}.ds-h-4{height:1rem}.ds-h-4\.5{height:1.125rem}.ds-h-5{height:1.25rem}.ds-h-8{height:2rem}.ds-h-9{height:2.25rem}.ds-h-\[40px\]{height:40px}.ds-h-auto{height:auto}.ds-h-full{height:100%}.ds-h-screen{height:100vh}.ds-max-h-72{max-height:18rem}.ds-min-h-4,.ds-min-h-\[1rem\]{min-height:1rem}.ds-min-h-\[6rem\]{min-height:6rem}.ds-w-10{width:2.5rem}.ds-w-11{width:2.75rem}.ds-w-12{width:3rem}.ds-w-3\.5{width:.875rem}.ds-w-4{width:1rem}.ds-w-4\.5{width:1.125rem}.ds-w-5{width:1.25rem}.ds-w-8{width:2rem}.ds-w-80{width:20rem}.ds-w-full{width:100%}.ds-w-screen{width:100vw}.ds-min-w-4{min-width:1rem}.ds-min-w-\[5rem\]{min-width:5rem}.ds-min-w-\[8rem\]{min-width:8rem}.ds-max-w-2xl{max-width:42rem}.ds-max-w-4xl{max-width:56rem}.ds-max-w-md{max-width:28rem}.ds-flex-1{flex:1 1 0%}.ds-flex-auto{flex:1 1 auto}.ds-flex-initial{flex:0 1 auto}.ds-rotate-180{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.ds-cursor-default{cursor:default}.ds-cursor-not-allowed{cursor:not-allowed}.ds-cursor-pointer{cursor:pointer}.ds-grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.ds-grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}.ds-grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}.ds-grid-rows-\[0fr\]{grid-template-rows:0fr}.ds-grid-rows-\[1fr\]{grid-template-rows:1fr}.ds-flex-wrap{flex-wrap:wrap}.ds-items-start{align-items:flex-start}.ds-items-center{align-items:center}.ds-justify-end{justify-content:flex-end}.ds-justify-center{justify-content:center}.ds-justify-between{justify-content:space-between}.ds-gap-1{gap:.25rem}.ds-gap-2{gap:.5rem}.ds-gap-3{gap:.75rem}.ds-gap-4{gap:1rem}.ds-gap-5{gap:1.25rem}.ds-gap-x-1{-moz-column-gap:.25rem;column-gap:.25rem}.ds-gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}.ds-gap-y-3{row-gap:.75rem}.ds-space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.25rem * var(--tw-space-x-reverse));margin-left:calc(.25rem * calc(1 - var(--tw-space-x-reverse)))}.ds-space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.ds-space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.ds-space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.ds-space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.ds-overflow-hidden{overflow:hidden}.ds-overflow-y-auto{overflow-y:auto}.ds-overflow-x-hidden{overflow-x:hidden}.ds-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ds-whitespace-nowrap{white-space:nowrap}.ds-rounded-full{border-radius:9999px}.ds-rounded-lg{border-radius:.5rem}.ds-rounded-none{border-radius:0}.ds-rounded-xl{border-radius:.75rem}.ds-rounded-b-lg{border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem}.ds-rounded-t-lg{border-top-left-radius:.5rem;border-top-right-radius:.5rem}.ds-border{border-width:1px}.ds-border-2{border-width:2px}.ds-border-l-2{border-left-width:2px}.ds-border-none{border-style:none}.\!ds-border-focus{--tw-border-opacity: 1 !important;border-color:rgb(var(--ds-colors-focus) / var(--tw-border-opacity))!important}.ds-border-black\/10,.ds-border-black\/\[0\.1\]{border-color:#0000001a}.ds-border-error{--tw-border-opacity: 1;border-color:rgb(236 55 65 / var(--tw-border-opacity))}.ds-border-focus{--tw-border-opacity: 1;border-color:rgb(var(--ds-colors-focus) / var(--tw-border-opacity))}.ds-border-gray-100{--tw-border-opacity: 1;border-color:rgb(243 244 246 / var(--tw-border-opacity))}.ds-border-gray-200{--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity))}.ds-border-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity))}.ds-border-primary-f\/50{border-color:rgb(var(--ds-colors-primary-f) / .5)}.ds-bg-\[\#f2f2f2\]{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.ds-bg-black\/10{background-color:#0000001a}.ds-bg-black\/20{background-color:#0003}.ds-bg-black\/65{background-color:#000000a6}.ds-bg-gray-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))}.ds-bg-gray-150{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.ds-bg-gray-200{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity))}.ds-bg-primary-f{--tw-bg-opacity: 1;background-color:rgb(var(--ds-colors-primary-f) / var(--tw-bg-opacity))}.ds-bg-primary-f\/40{background-color:rgb(var(--ds-colors-primary-f) / .4)}.ds-bg-primary-t{--tw-bg-opacity: 1;background-color:rgb(var(--ds-colors-primary-t) / var(--tw-bg-opacity))}.ds-bg-primary-t\/10{background-color:rgb(var(--ds-colors-primary-t) / .1)}.ds-bg-slate-100{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity))}.ds-bg-slate-300{--tw-bg-opacity: 1;background-color:rgb(203 213 225 / var(--tw-bg-opacity))}.ds-bg-slate-50{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))}.ds-bg-transparent{background-color:transparent}.ds-bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/hd\/colorful-love-birds-0ctuhn6r2rubq7v3\.webp\'\)\]{background-image:url(https://wallpapers.com/images/hd/colorful-love-birds-0ctuhn6r2rubq7v3.webp)}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/hd\/elegant-feline-in-soft-natural-light-00nbm86akvtczty6\.webp\'\)\]{background-image:url(https://wallpapers.com/images/hd/elegant-feline-in-soft-natural-light-00nbm86akvtczty6.webp)}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/high\/dog-underwater-swimming-2siawk4nemp214kj\.webp\'\)\]{background-image:url(https://wallpapers.com/images/high/dog-underwater-swimming-2siawk4nemp214kj.webp)}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/high\/three-teen-lions-9xiimjysh7htjow3\.webp\'\)\]{background-image:url(https://wallpapers.com/images/high/three-teen-lions-9xiimjysh7htjow3.webp)}.ds-bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.ds-from-primary-f{--tw-gradient-from: rgb(var(--ds-colors-primary-f) / 1) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--ds-colors-primary-f) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.ds-from-primary-f-stop{--tw-gradient-from-position: var(--ds-colors-primary-f-stop)}.ds-to-primary-t{--tw-gradient-to: rgb(var(--ds-colors-primary-t) / 1) var(--tw-gradient-to-position)}.ds-bg-contain{background-size:contain}.ds-bg-cover{background-size:cover}.ds-bg-center{background-position:center}.ds-bg-no-repeat{background-repeat:no-repeat}.ds-fill-\[\#00a86b\]{fill:#00a86b}.ds-fill-black\/40{fill:#0006}.ds-fill-black\/60{fill:#0009}.ds-fill-black\/80{fill:#000c}.ds-fill-gray-500{fill:#6b7280}.ds-fill-gray-600{fill:#4b5563}.ds-fill-primary-t{fill:rgb(var(--ds-colors-primary-t) / 1)}.ds-fill-red-600{fill:#dc2626}.ds-fill-white{fill:#fff}.ds-p-0\.5{padding:.125rem}.ds-p-2{padding:.5rem}.ds-p-3{padding:.75rem}.ds-p-4{padding:1rem}.ds-p-5{padding:1.25rem}.ds-px-0{padding-left:0;padding-right:0}.ds-px-2{padding-left:.5rem;padding-right:.5rem}.ds-px-3{padding-left:.75rem;padding-right:.75rem}.ds-px-4{padding-left:1rem;padding-right:1rem}.ds-py-1{padding-top:.25rem;padding-bottom:.25rem}.ds-py-2{padding-top:.5rem;padding-bottom:.5rem}.ds-py-3{padding-top:.75rem;padding-bottom:.75rem}.ds-py-4{padding-top:1rem;padding-bottom:1rem}.ds-py-5{padding-top:1.25rem;padding-bottom:1.25rem}.ds-pb-2{padding-bottom:.5rem}.ds-pl-0{padding-left:0}.ds-pl-1{padding-left:.25rem}.ds-pl-2{padding-left:.5rem}.ds-pr-1{padding-right:.25rem}.ds-pr-2{padding-right:.5rem}.ds-text-center{text-align:center}.ds-text-right{text-align:right}.ds-text-2xl{font-size:1.5rem;line-height:2rem}.ds-text-4xl{font-size:2.25rem;line-height:2.5rem}.ds-text-base{font-size:1rem;line-height:1.5rem}.ds-text-sm{font-size:.875rem;line-height:1.25rem}.ds-text-xs{font-size:.75rem;line-height:1rem}.ds-font-bold{font-weight:700}.ds-font-medium{font-weight:500}.ds-font-semibold{font-weight:600}.ds-capitalize{text-transform:capitalize}.ds-leading-4{line-height:1rem}.ds-text-black\/40{color:#0006}.ds-text-black\/80{color:#000c}.ds-text-black\/\[0\.4\]{color:#0006}.ds-text-black\/\[0\.85\]{color:#000000d9}.ds-text-gray-400{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity))}.ds-text-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.ds-text-gray-700{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity))}.ds-text-gray-900{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity))}.ds-text-primary-t{--tw-text-opacity: 1;color:rgb(var(--ds-colors-primary-t) / var(--tw-text-opacity))}.ds-text-red-500{--tw-text-opacity: 1;color:rgb(239 68 68 / var(--tw-text-opacity))}.ds-text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.ds-opacity-0{opacity:0}.ds-shadow{--tw-shadow: 0px 5px 10px rgba(0, 0, 0, .04), 0px 1px 2px rgba(0, 0, 0, .06);--tw-shadow-colored: 0px 5px 10px var(--tw-shadow-color), 0px 1px 2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.ds-shadow-2xl{--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / .25);--tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.ds-shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.\!ds-ring-0{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)!important}.ds-ring-1{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.ds-ring-error{--tw-ring-opacity: 1;--tw-ring-color: rgb(236 55 65 / var(--tw-ring-opacity))}.ds-ring-focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-focus) / var(--tw-ring-opacity))}.ds-drop-shadow{--tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / .1)) drop-shadow(0 1px 1px rgb(0 0 0 / .06));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ds-drop-shadow-light{--tw-drop-shadow: drop-shadow(0 1px 3px rgba(0, 0, 0, .11));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ds-drop-shadow-none{--tw-drop-shadow: drop-shadow(0 0 #0000);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ds-backdrop-blur-sm{--tw-backdrop-blur: blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.ds-transition-\[grid-template-rows\]{transition-property:grid-template-rows;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-duration-200{transition-duration:.2s}.ds-duration-300{transition-duration:.3s}.ds-ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}:focus-visible{outline-offset:unset;outline:unset}.ds-border-inner-secondary{box-shadow:inset 0 0 0 1px rgb(var(--ds-colors-primary-t) / 1)}.ds-border-inner-secondary--disabled{box-shadow:inset 0 0 0 1px #0006}.ds-border-inner-additional,.ds-border-inner-additional--disabled{box-shadow:inset 0 0 0 1px #00000040}.fade-enter-from,.fade-leave-to{opacity:0}.fade-enter-active,.fade-leave-active{transition:opacity .3s cubic-bezier(.4,0,.2,1)}}.after\:ds-mx-3:after{content:var(--tw-content);margin-left:.75rem;margin-right:.75rem}.after\:ds-h-1:after{content:var(--tw-content);height:.25rem}.after\:ds-w-full:after{content:var(--tw-content);width:100%}.after\:ds-border-b:after{content:var(--tw-content);border-bottom-width:1px}.after\:ds-border-gray-200:after{content:var(--tw-content);--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity))}.hover\:ds-bg-blue-light:hover{--tw-bg-opacity: 1;background-color:rgb(230 240 254 / var(--tw-bg-opacity))}.hover\:ds-bg-gray-150:hover{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.hover\:ds-bg-primary-f\/70:hover{background-color:rgb(var(--ds-colors-primary-f) / .7)}.hover\:ds-bg-slate-100:hover{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity))}.hover\:ds-bg-slate-300:hover{--tw-bg-opacity: 1;background-color:rgb(203 213 225 / var(--tw-bg-opacity))}.hover\:ds-bg-slate-50:hover{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))}.hover\:ds-fill-black\/40:hover{fill:#0006}.hover\:ds-fill-primary-t\/80:hover{fill:rgb(var(--ds-colors-primary-t) / .8)}.hover\:ds-fill-white\/60:hover{fill:#fff9}.hover\:ds-text-primary-t:hover{--tw-text-opacity: 1;color:rgb(var(--ds-colors-primary-t) / var(--tw-text-opacity))}.hover\:ds-ring-2:hover{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.hover\:ds-ring-primary-t:hover{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-primary-t) / var(--tw-ring-opacity))}.focus\:ds-border-focus:focus{--tw-border-opacity: 1;border-color:rgb(var(--ds-colors-focus) / var(--tw-border-opacity))}.focus\:ds-ring-1:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ds-ring-error:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(236 55 65 / var(--tw-ring-opacity))}.focus\:ds-ring-focus:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-focus) / var(--tw-ring-opacity))}.focus\:ds-ring-primary-t:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-primary-t) / var(--tw-ring-opacity))}.focus-visible\:ds-bg-blue-light:focus-visible{--tw-bg-opacity: 1;background-color:rgb(230 240 254 / var(--tw-bg-opacity))}.focus-visible\:ds-bg-gray-150:focus-visible{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.focus-visible\:ds-from-primary-f\/90:focus-visible{--tw-gradient-from: rgb(var(--ds-colors-primary-f) / .9) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--ds-colors-primary-f) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.focus-visible\:ds-to-primary-t\/90:focus-visible{--tw-gradient-to: rgb(var(--ds-colors-primary-t) / .9) var(--tw-gradient-to-position)}.focus-visible\:ds-fill-primary-t\/80:focus-visible{fill:rgb(var(--ds-colors-primary-t) / .8)}.enabled\:ds-text-gray-400:enabled{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity))}.enabled\:hover\:ds-bg-blue-light:hover:enabled{--tw-bg-opacity: 1;background-color:rgb(230 240 254 / var(--tw-bg-opacity))}.enabled\:hover\:ds-bg-gray-150:hover:enabled{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.enabled\:hover\:ds-from-primary-f\/90:hover:enabled{--tw-gradient-from: rgb(var(--ds-colors-primary-f) / .9) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--ds-colors-primary-f) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.enabled\:hover\:ds-to-primary-t\/90:hover:enabled{--tw-gradient-to: rgb(var(--ds-colors-primary-t) / .9) var(--tw-gradient-to-position)}.\*\:enabled\:hover\:ds-bg-gray-150:hover:enabled>*{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.disabled\:ds-cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:ds-bg-gray-150:disabled{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.disabled\:ds-fill-black\/40:disabled{fill:#0006}.disabled\:ds-text-black\/40:disabled{color:#0006}.disabled\:ds-text-black\/\[0\.4\]:disabled{color:#0006}.disabled\:ds-text-gray-200:disabled{--tw-text-opacity: 1;color:rgb(229 231 235 / var(--tw-text-opacity))}@media (min-width: 640px){.sm\:ds-absolute{position:absolute}.sm\:ds-left-\[unset\]{left:unset}.sm\:ds-top-\[unset\]{top:unset}.sm\:ds-z-50{z-index:50}.sm\:ds-block{display:block}.sm\:ds-h-auto{height:auto}.sm\:ds-w-auto{width:auto}.sm\:ds-bg-transparent{background-color:transparent}.sm\:ds-backdrop-blur-none{--tw-backdrop-blur: ;-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}}.tab[data-v-797a82dc]{display:none}.tab.active[data-v-797a82dc]{display:block}.carousel-content[data-v-b5c5062f]{position:absolute;top:0;left:0;width:100%;max-height:100%;height:100%}.carousel-navigation--left[data-v-b5c5062f],.carousel-navigation--right[data-v-b5c5062f]{padding:0 1rem;height:100%;position:absolute;display:flex;justify-content:center;align-items:center}.carousel-navigation--right[data-v-b5c5062f]{right:0}.carousel-pagination[data-v-b5c5062f]{position:absolute;bottom:.5rem;width:100%;display:flex;gap:1rem;justify-content:center;align-items:center}.carousel-pagination span[data-v-b5c5062f]{cursor:pointer;width:1.25rem;height:1.25rem;border-radius:50%;background-color:#fff;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;opacity:.8}.b-loading-bar[data-v-31348ccc]{height:.25rem;display:block;width:100%;background-color:#e6effe;overflow:hidden}.b-loading-bar .b-loading-bar-indeterminate[data-v-31348ccc]{background-color:#3b82f6}.b-loading-bar .b-loading-bar-indeterminate[data-v-31348ccc]:before{content:"";position:absolute;z-index:100;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;animation:indeterminate-31348ccc 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.b-loading-bar .b-loading-bar-indeterminate[data-v-31348ccc]:after{content:"";position:absolute;z-index:100;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;animation:indeterminate-short-31348ccc 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation-delay:1.15s}@keyframes indeterminate-31348ccc{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes indeterminate-short-31348ccc{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}.b-checkbox .b-checkbox__input[data-v-1d793d06]{display:none;width:1.5rem;height:1.5rem;min-width:1.5rem;min-height:1.5rem}.b-checkbox .b-checkbox__input:checked+.b-checkbox__input-label[data-v-1d793d06]{background-color:rgb(var(--ds-colors-primary-t) / 1)}.b-checkbox .b-checkbox__input:checked+.b-checkbox__input-label[data-v-1d793d06]:after{border-color:#fff}.b-checkbox .b-checkbox__input:disabled+.b-checkbox__input-label[data-v-1d793d06]{background-color:#f3f4f6}.b-checkbox .b-checkbox__input:disabled+.b-checkbox__input-label[data-v-1d793d06]:after{border-color:#f3f4f6}.b-checkbox .b-checkbox__input-label[data-v-1d793d06]{position:relative;background-color:#fff;border-radius:.5rem;cursor:pointer;width:1.5rem;height:1.5rem;transition:all .15s linear}.b-checkbox .b-checkbox__input-label[data-v-1d793d06]:after{border:3px solid transparent;border-top:none;border-right:none;content:"";height:7px;left:5.5px;position:absolute;top:7px;transform:rotate(-45deg);width:.75rem;transition:all .15s linear}.b-checkbox.size-sm .b-checkbox__input[data-v-1d793d06]{width:1.25rem;height:1.25rem;min-width:1.25rem;min-height:1.25rem}.b-checkbox.size-sm .b-checkbox__input-label[data-v-1d793d06]{width:1.25rem;height:1.25rem}.b-checkbox.size-sm .b-checkbox__input-label[data-v-1d793d06]:after{border:2.5px solid transparent;border-top:none;border-right:none;left:3.5px;top:4.5px}.carousel-item[data-v-6f2b0dc4]{position:absolute;height:100%;width:100%;display:none;transform:translate(100%)}.carousel-item.reverse[data-v-6f2b0dc4]{transform:translate(-100%)}.carousel-item.active[data-v-6f2b0dc4]{display:block}.slide-in[data-v-6f2b0dc4]{animation:slide-in-6f2b0dc4 .5s forwards}.slide-out[data-v-6f2b0dc4]{animation:slide-out-6f2b0dc4 .5s forwards}@keyframes slide-in-6f2b0dc4{to{transform:translate(0)}}@keyframes slide-out-6f2b0dc4{0%{transform:translate(0)}to{transform:translate(-100%)}}.slide-in-reverse[data-v-6f2b0dc4]{animation:slide-in-reverse-6f2b0dc4 .5s forwards}.slide-out-reverse[data-v-6f2b0dc4]{animation:slide-out-reverse-6f2b0dc4 .5s forwards}@keyframes slide-in-reverse-6f2b0dc4{to{transform:translate(0)}}@keyframes slide-out-reverse-6f2b0dc4{0%{transform:translate(0)}to{transform:translate(100%)}}.carousel-item img{min-width:100%;height:100%}.spinner[data-v-c49c635e]{border:.25rem solid #e5e7eb;border-radius:50%;border-top:.25rem solid rgb(var(--ds-colors-primary-t) / 1);border-right:.25rem solid rgb(var(--ds-colors-primary-t) / 1);border-bottom:.25rem solid rgb(var(--ds-colors-primary-t) / 1);animation:spin-c49c635e 2s linear infinite}@keyframes spin-c49c635e{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.b-radio__input[data-v-98637356]{display:none}.b-radio__input:checked+.b-radio__input-label[data-v-98637356]:before{background-color:rgb(var(--ds-colors-primary-t) / 1)}.b-radio__input:disabled+.b-radio__input-label[data-v-98637356]{background-color:#f3f4f6}.b-radio__input:disabled+.b-radio__input-label[data-v-98637356]:before{background-color:#f3f4f6}.b-radio__input-label[data-v-98637356]{position:relative;width:1.5rem;height:1.5rem;background-color:#fff;border-radius:9999px}.b-radio__input-label[data-v-98637356]:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background-color:transparent;height:1rem;width:1rem;border-radius:9999px;transition:all .15s linear}.tab-header.active[data-v-646ae8c4]{background-color:#fff;color:rgb(var(--ds-colors-primary-t) / 1)}.b-text-field:has(.b-text-field__prepend-icon) input[data-v-d47b93d4]{padding-left:2.25rem}.b-text-field:has(.b-text-field__append-icon) input[data-v-d47b93d4]{padding-right:2.25rem}.tooltip-arrow[data-v-419a3aa7]{position:absolute;left:0;transform:translate3d(59.5px,0,0)}.b-image-picker[data-v-8033e228]{container-name:image-picker;container-type:inline-size}.b-image-picker__draggable[data-v-8033e228]{width:100%;position:relative}.b-image-picker__draggable[data-v-8033e228]:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:.5rem}@container image-picker (min-width: 640px){.b-image-picker__draggable[data-v-8033e228]{width:calc(33.3333333333% - .3333333333rem)}}@container image-pbnicker (min-width: 768px){.b-image-picker__draggable[data-v-8033e228]{width:calc(25% - .375rem)}}@container image-picker (min-width: 1280px){.b-image-picker__draggable[data-v-8033e228]{width:calc(20% - .4rem)}}.dragging[data-v-8033e228]{opacity:.5}.dropped-target[data-v-8033e228]{border-width:2px;--tw-border-opacity: 1;border-color:rgb(var(--ds-colors-primary-f) / var(--tw-border-opacity))}.b-currency-field:has(.b-currency-field__prepend-icon) input[data-v-5cbc4bba]{padding-left:2.25rem}.b-currency-field:has(.b-currency-field__append-icon) input[data-v-5cbc4bba]{padding-right:2.25rem}.b-switch__input[data-v-94d47575]{display:none}.b-switch__input:checked+.b-switch__input-label[data-v-94d47575]{background-color:rgb(var(--ds-colors-primary-t) / 1)}.b-switch__input:checked+.b-switch__input-label[data-v-94d47575]:before{transform:translate(100%);background-color:#fff}.b-switch__input:disabled+.b-switch__input-label[data-v-94d47575]:before{background-color:#f3f4f6}.b-switch__input-label[data-v-94d47575]{position:relative;display:flex;background-color:#e5e7eb;border-radius:1rem;padding:.125rem;width:2.75rem;height:1.5rem}.b-switch__input-label[data-v-94d47575]:before{content:"";position:absolute;width:1.25rem;height:1.25rem;background-color:#fff;border-radius:9999px;left:calc(.125rem - 1px);top:calc(.125rem - 1px);transition:all .15s linear}.date-range:not(:has(.--start):has(.--end)) .date-item.--selected~.date-item:has(~.date-item:hover) .date-item__inner[data-v-9a965dba]{background-color:rgb(var(--ds-colors-primary-t) / 10%)}.date-range:not(:has(.--start):has(.--end)) .date-item:hover~.date-item:has(~.date-item.--selected) .date-item__inner[data-v-9a965dba]{background-color:rgb(var(--ds-colors-primary-t) / 10%)}
+@layer design-system{*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}:root{--ds-colors-primary-f: 6 182 212;--ds-colors-primary-t: 59 130 246;--ds-colors-focus: 86 221 214;--ds-colors-primary-f-stop: 0%;--ds-colors-primary-t-stop: 100%}.ds-container{width:100%}@media (min-width: 640px){.ds-container{max-width:640px}}@media (min-width: 768px){.ds-container{max-width:768px}}@media (min-width: 1024px){.ds-container{max-width:1024px}}@media (min-width: 1280px){.ds-container{max-width:1280px}}@media (min-width: 1536px){.ds-container{max-width:1536px}}.ds-pointer-events-none{pointer-events:none}.ds-fixed{position:fixed}.ds-absolute{position:absolute}.ds-relative{position:relative}.ds-left-0{left:0}.ds-left-3{left:.75rem}.ds-right-0{right:0}.ds-right-1{right:.25rem}.ds-right-3{right:.75rem}.ds-right-4{right:1rem}.ds-top-0{top:0}.ds-top-1{top:.25rem}.ds-top-4{top:1rem}.ds-z-10{z-index:10}.ds-z-100{z-index:100}.ds-z-50{z-index:50}.ds-z-\[110\]{z-index:110}.ds-z-\[1\]{z-index:1}.ds-z-\[3\]{z-index:3}.ds-m-auto{margin:auto}.-ds-mx-0\.5{margin-left:-.125rem;margin-right:-.125rem}.ds-mx-auto{margin-left:auto;margin-right:auto}.ds-my-0\.5{margin-top:.125rem;margin-bottom:.125rem}.ds-my-2{margin-top:.5rem;margin-bottom:.5rem}.ds-my-24{margin-top:6rem;margin-bottom:6rem}.-ds-ml-\[25px\]{margin-left:-25px}.ds-mb-0\.5{margin-bottom:.125rem}.ds-mb-1{margin-bottom:.25rem}.ds-mb-2{margin-bottom:.5rem}.ds-mb-4{margin-bottom:1rem}.ds-ml-0{margin-left:0}.ds-ml-1{margin-left:.25rem}.ds-ml-2{margin-left:.5rem}.ds-ml-4{margin-left:1rem}.ds-mt-1{margin-top:.25rem}.ds-mt-4{margin-top:1rem}.ds-mt-8{margin-top:2rem}.ds-block{display:block}.ds-inline-block{display:inline-block}.ds-inline{display:inline}.ds-flex{display:flex}.ds-inline-flex{display:inline-flex}.ds-grid{display:grid}.ds-hidden{display:none}.ds-aspect-square{aspect-ratio:1 / 1}.\!ds-h-\[30px\]{height:30px!important}.ds-h-10{height:2.5rem}.ds-h-11{height:2.75rem}.ds-h-12{height:3rem}.ds-h-3\.5{height:.875rem}.ds-h-4{height:1rem}.ds-h-4\.5{height:1.125rem}.ds-h-5{height:1.25rem}.ds-h-8{height:2rem}.ds-h-9{height:2.25rem}.ds-h-\[40px\]{height:40px}.ds-h-auto{height:auto}.ds-h-full{height:100%}.ds-h-screen{height:100vh}.ds-max-h-72{max-height:18rem}.ds-min-h-4,.ds-min-h-\[1rem\]{min-height:1rem}.ds-min-h-\[6rem\]{min-height:6rem}.ds-w-10{width:2.5rem}.ds-w-11{width:2.75rem}.ds-w-12{width:3rem}.ds-w-3\.5{width:.875rem}.ds-w-4{width:1rem}.ds-w-4\.5{width:1.125rem}.ds-w-5{width:1.25rem}.ds-w-8{width:2rem}.ds-w-80{width:20rem}.ds-w-full{width:100%}.ds-w-screen{width:100vw}.ds-min-w-4{min-width:1rem}.ds-min-w-\[5rem\]{min-width:5rem}.ds-min-w-\[8rem\]{min-width:8rem}.ds-max-w-2xl{max-width:42rem}.ds-max-w-4xl{max-width:56rem}.ds-max-w-md{max-width:28rem}.ds-flex-1{flex:1 1 0%}.ds-flex-auto{flex:1 1 auto}.ds-flex-initial{flex:0 1 auto}.ds-rotate-180{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.ds-cursor-default{cursor:default}.ds-cursor-not-allowed{cursor:not-allowed}.ds-cursor-pointer{cursor:pointer}.ds-grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.ds-grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.ds-grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}.ds-grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}.ds-grid-rows-\[0fr\]{grid-template-rows:0fr}.ds-grid-rows-\[1fr\]{grid-template-rows:1fr}.ds-flex-wrap{flex-wrap:wrap}.ds-items-start{align-items:flex-start}.ds-items-center{align-items:center}.ds-justify-end{justify-content:flex-end}.ds-justify-center{justify-content:center}.ds-justify-between{justify-content:space-between}.ds-gap-1{gap:.25rem}.ds-gap-2{gap:.5rem}.ds-gap-3{gap:.75rem}.ds-gap-4{gap:1rem}.ds-gap-5{gap:1.25rem}.ds-gap-x-1{-moz-column-gap:.25rem;column-gap:.25rem}.ds-gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}.ds-gap-y-3{row-gap:.75rem}.ds-space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.25rem * var(--tw-space-x-reverse));margin-left:calc(.25rem * calc(1 - var(--tw-space-x-reverse)))}.ds-space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.ds-space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.ds-space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.ds-space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.ds-overflow-hidden{overflow:hidden}.ds-overflow-y-auto{overflow-y:auto}.ds-overflow-x-hidden{overflow-x:hidden}.ds-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ds-whitespace-nowrap{white-space:nowrap}.ds-rounded-full{border-radius:9999px}.ds-rounded-lg{border-radius:.5rem}.ds-rounded-none{border-radius:0}.ds-rounded-xl{border-radius:.75rem}.ds-rounded-b-lg{border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem}.ds-rounded-t-lg{border-top-left-radius:.5rem;border-top-right-radius:.5rem}.ds-border{border-width:1px}.ds-border-2{border-width:2px}.ds-border-l-2{border-left-width:2px}.ds-border-none{border-style:none}.\!ds-border-focus{--tw-border-opacity: 1 !important;border-color:rgb(var(--ds-colors-focus) / var(--tw-border-opacity))!important}.ds-border-black\/10,.ds-border-black\/\[0\.1\]{border-color:#0000001a}.ds-border-error{--tw-border-opacity: 1;border-color:rgb(236 55 65 / var(--tw-border-opacity))}.ds-border-focus{--tw-border-opacity: 1;border-color:rgb(var(--ds-colors-focus) / var(--tw-border-opacity))}.ds-border-gray-100{--tw-border-opacity: 1;border-color:rgb(243 244 246 / var(--tw-border-opacity))}.ds-border-gray-200{--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity))}.ds-border-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity))}.ds-border-primary-f\/50{border-color:rgb(var(--ds-colors-primary-f) / .5)}.ds-bg-\[\#f2f2f2\]{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.ds-bg-black\/10{background-color:#0000001a}.ds-bg-black\/20{background-color:#0003}.ds-bg-black\/65{background-color:#000000a6}.ds-bg-gray-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))}.ds-bg-gray-150{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.ds-bg-gray-200{--tw-bg-opacity: 1;background-color:rgb(229 231 235 / var(--tw-bg-opacity))}.ds-bg-primary-f{--tw-bg-opacity: 1;background-color:rgb(var(--ds-colors-primary-f) / var(--tw-bg-opacity))}.ds-bg-primary-f\/40{background-color:rgb(var(--ds-colors-primary-f) / .4)}.ds-bg-primary-t{--tw-bg-opacity: 1;background-color:rgb(var(--ds-colors-primary-t) / var(--tw-bg-opacity))}.ds-bg-primary-t\/10{background-color:rgb(var(--ds-colors-primary-t) / .1)}.ds-bg-slate-100{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity))}.ds-bg-slate-300{--tw-bg-opacity: 1;background-color:rgb(203 213 225 / var(--tw-bg-opacity))}.ds-bg-slate-50{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))}.ds-bg-transparent{background-color:transparent}.ds-bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/hd\/colorful-love-birds-0ctuhn6r2rubq7v3\.webp\'\)\]{background-image:url(https://wallpapers.com/images/hd/colorful-love-birds-0ctuhn6r2rubq7v3.webp)}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/hd\/elegant-feline-in-soft-natural-light-00nbm86akvtczty6\.webp\'\)\]{background-image:url(https://wallpapers.com/images/hd/elegant-feline-in-soft-natural-light-00nbm86akvtczty6.webp)}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/high\/dog-underwater-swimming-2siawk4nemp214kj\.webp\'\)\]{background-image:url(https://wallpapers.com/images/high/dog-underwater-swimming-2siawk4nemp214kj.webp)}.ds-bg-\[url\(\'https\:\/\/wallpapers\.com\/images\/high\/three-teen-lions-9xiimjysh7htjow3\.webp\'\)\]{background-image:url(https://wallpapers.com/images/high/three-teen-lions-9xiimjysh7htjow3.webp)}.ds-bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.ds-from-primary-f{--tw-gradient-from: rgb(var(--ds-colors-primary-f) / 1) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--ds-colors-primary-f) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.ds-from-primary-f-stop{--tw-gradient-from-position: var(--ds-colors-primary-f-stop)}.ds-to-primary-t{--tw-gradient-to: rgb(var(--ds-colors-primary-t) / 1) var(--tw-gradient-to-position)}.ds-bg-contain{background-size:contain}.ds-bg-cover{background-size:cover}.ds-bg-center{background-position:center}.ds-bg-no-repeat{background-repeat:no-repeat}.ds-fill-\[\#00a86b\]{fill:#00a86b}.ds-fill-black\/40{fill:#0006}.ds-fill-black\/60{fill:#0009}.ds-fill-black\/80{fill:#000c}.ds-fill-gray-500{fill:#6b7280}.ds-fill-gray-600{fill:#4b5563}.ds-fill-primary-t{fill:rgb(var(--ds-colors-primary-t) / 1)}.ds-fill-red-600{fill:#dc2626}.ds-fill-white{fill:#fff}.ds-p-0\.5{padding:.125rem}.ds-p-2{padding:.5rem}.ds-p-3{padding:.75rem}.ds-p-4{padding:1rem}.ds-p-5{padding:1.25rem}.ds-px-0{padding-left:0;padding-right:0}.ds-px-2{padding-left:.5rem;padding-right:.5rem}.ds-px-3{padding-left:.75rem;padding-right:.75rem}.ds-px-4{padding-left:1rem;padding-right:1rem}.ds-py-1{padding-top:.25rem;padding-bottom:.25rem}.ds-py-2{padding-top:.5rem;padding-bottom:.5rem}.ds-py-3{padding-top:.75rem;padding-bottom:.75rem}.ds-py-4{padding-top:1rem;padding-bottom:1rem}.ds-py-5{padding-top:1.25rem;padding-bottom:1.25rem}.ds-pb-2{padding-bottom:.5rem}.ds-pl-0{padding-left:0}.ds-pl-1{padding-left:.25rem}.ds-pl-2{padding-left:.5rem}.ds-pr-1{padding-right:.25rem}.ds-pr-2{padding-right:.5rem}.ds-text-center{text-align:center}.ds-text-right{text-align:right}.ds-text-2xl{font-size:1.5rem;line-height:2rem}.ds-text-4xl{font-size:2.25rem;line-height:2.5rem}.ds-text-base{font-size:1rem;line-height:1.5rem}.ds-text-sm{font-size:.875rem;line-height:1.25rem}.ds-text-xs{font-size:.75rem;line-height:1rem}.ds-font-bold{font-weight:700}.ds-font-medium{font-weight:500}.ds-font-semibold{font-weight:600}.ds-capitalize{text-transform:capitalize}.ds-leading-4{line-height:1rem}.ds-text-black\/40{color:#0006}.ds-text-black\/80{color:#000c}.ds-text-black\/\[0\.4\]{color:#0006}.ds-text-black\/\[0\.85\]{color:#000000d9}.ds-text-gray-400{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity))}.ds-text-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.ds-text-gray-700{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity))}.ds-text-gray-900{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity))}.ds-text-primary-t{--tw-text-opacity: 1;color:rgb(var(--ds-colors-primary-t) / var(--tw-text-opacity))}.ds-text-red-500{--tw-text-opacity: 1;color:rgb(239 68 68 / var(--tw-text-opacity))}.ds-text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.ds-opacity-0{opacity:0}.ds-shadow{--tw-shadow: 0px 5px 10px rgba(0, 0, 0, .04), 0px 1px 2px rgba(0, 0, 0, .06);--tw-shadow-colored: 0px 5px 10px var(--tw-shadow-color), 0px 1px 2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.ds-shadow-2xl{--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / .25);--tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.ds-shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.\!ds-ring-0{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)!important}.ds-ring-1{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.ds-ring-error{--tw-ring-opacity: 1;--tw-ring-color: rgb(236 55 65 / var(--tw-ring-opacity))}.ds-ring-focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-focus) / var(--tw-ring-opacity))}.ds-drop-shadow{--tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / .1)) drop-shadow(0 1px 1px rgb(0 0 0 / .06));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ds-drop-shadow-light{--tw-drop-shadow: drop-shadow(0 1px 3px rgba(0, 0, 0, .11));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ds-drop-shadow-none{--tw-drop-shadow: drop-shadow(0 0 #0000);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.ds-backdrop-blur-sm{--tw-backdrop-blur: blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.ds-transition-\[grid-template-rows\]{transition-property:grid-template-rows;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ds-duration-200{transition-duration:.2s}.ds-duration-300{transition-duration:.3s}.ds-ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}:focus-visible{outline-offset:unset;outline:unset}.ds-border-inner-secondary{box-shadow:inset 0 0 0 1px rgb(var(--ds-colors-primary-t) / 1)}.ds-border-inner-secondary--disabled{box-shadow:inset 0 0 0 1px #0006}.ds-border-inner-additional,.ds-border-inner-additional--disabled{box-shadow:inset 0 0 0 1px #00000040}.fade-enter-from,.fade-leave-to{opacity:0}.fade-enter-active,.fade-leave-active{transition:opacity .3s cubic-bezier(.4,0,.2,1)}}.after\:ds-mx-3:after{content:var(--tw-content);margin-left:.75rem;margin-right:.75rem}.after\:ds-h-1:after{content:var(--tw-content);height:.25rem}.after\:ds-w-full:after{content:var(--tw-content);width:100%}.after\:ds-border-b:after{content:var(--tw-content);border-bottom-width:1px}.after\:ds-border-gray-200:after{content:var(--tw-content);--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity))}.hover\:ds-bg-blue-light:hover{--tw-bg-opacity: 1;background-color:rgb(230 240 254 / var(--tw-bg-opacity))}.hover\:ds-bg-gray-150:hover{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.hover\:ds-bg-primary-f\/70:hover{background-color:rgb(var(--ds-colors-primary-f) / .7)}.hover\:ds-bg-slate-100:hover{--tw-bg-opacity: 1;background-color:rgb(241 245 249 / var(--tw-bg-opacity))}.hover\:ds-bg-slate-300:hover{--tw-bg-opacity: 1;background-color:rgb(203 213 225 / var(--tw-bg-opacity))}.hover\:ds-bg-slate-50:hover{--tw-bg-opacity: 1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))}.hover\:ds-fill-black\/40:hover{fill:#0006}.hover\:ds-fill-primary-t\/80:hover{fill:rgb(var(--ds-colors-primary-t) / .8)}.hover\:ds-fill-white\/60:hover{fill:#fff9}.hover\:ds-text-primary-t:hover{--tw-text-opacity: 1;color:rgb(var(--ds-colors-primary-t) / var(--tw-text-opacity))}.hover\:ds-ring-2:hover{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.hover\:ds-ring-primary-t:hover{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-primary-t) / var(--tw-ring-opacity))}.focus\:ds-border-focus:focus{--tw-border-opacity: 1;border-color:rgb(var(--ds-colors-focus) / var(--tw-border-opacity))}.focus\:ds-ring-1:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ds-ring-error:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(236 55 65 / var(--tw-ring-opacity))}.focus\:ds-ring-focus:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-focus) / var(--tw-ring-opacity))}.focus\:ds-ring-primary-t:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(var(--ds-colors-primary-t) / var(--tw-ring-opacity))}.focus-visible\:ds-bg-blue-light:focus-visible{--tw-bg-opacity: 1;background-color:rgb(230 240 254 / var(--tw-bg-opacity))}.focus-visible\:ds-bg-gray-150:focus-visible{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.focus-visible\:ds-from-primary-f\/90:focus-visible{--tw-gradient-from: rgb(var(--ds-colors-primary-f) / .9) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--ds-colors-primary-f) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.focus-visible\:ds-to-primary-t\/90:focus-visible{--tw-gradient-to: rgb(var(--ds-colors-primary-t) / .9) var(--tw-gradient-to-position)}.focus-visible\:ds-fill-primary-t\/80:focus-visible{fill:rgb(var(--ds-colors-primary-t) / .8)}.enabled\:ds-text-gray-400:enabled{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity))}.enabled\:hover\:ds-bg-blue-light:hover:enabled{--tw-bg-opacity: 1;background-color:rgb(230 240 254 / var(--tw-bg-opacity))}.enabled\:hover\:ds-bg-gray-150:hover:enabled{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.enabled\:hover\:ds-from-primary-f\/90:hover:enabled{--tw-gradient-from: rgb(var(--ds-colors-primary-f) / .9) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--ds-colors-primary-f) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.enabled\:hover\:ds-to-primary-t\/90:hover:enabled{--tw-gradient-to: rgb(var(--ds-colors-primary-t) / .9) var(--tw-gradient-to-position)}.\*\:enabled\:hover\:ds-bg-gray-150:hover:enabled>*{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.disabled\:ds-cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:ds-bg-gray-150:disabled{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.disabled\:ds-fill-black\/40:disabled{fill:#0006}.disabled\:ds-text-black\/40:disabled{color:#0006}.disabled\:ds-text-black\/\[0\.4\]:disabled{color:#0006}.disabled\:ds-text-gray-200:disabled{--tw-text-opacity: 1;color:rgb(229 231 235 / var(--tw-text-opacity))}@media (min-width: 640px){.sm\:ds-absolute{position:absolute}.sm\:ds-left-\[unset\]{left:unset}.sm\:ds-top-\[unset\]{top:unset}.sm\:ds-z-50{z-index:50}.sm\:ds-block{display:block}.sm\:ds-h-auto{height:auto}.sm\:ds-w-auto{width:auto}.sm\:ds-bg-transparent{background-color:transparent}.sm\:ds-backdrop-blur-none{--tw-backdrop-blur: ;-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}}.tab[data-v-797a82dc]{display:none}.tab.active[data-v-797a82dc]{display:block}.b-loading-bar[data-v-31348ccc]{height:.25rem;display:block;width:100%;background-color:#e6effe;overflow:hidden}.b-loading-bar .b-loading-bar-indeterminate[data-v-31348ccc]{background-color:#3b82f6}.b-loading-bar .b-loading-bar-indeterminate[data-v-31348ccc]:before{content:"";position:absolute;z-index:100;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;animation:indeterminate-31348ccc 2.1s cubic-bezier(.65,.815,.735,.395) infinite}.b-loading-bar .b-loading-bar-indeterminate[data-v-31348ccc]:after{content:"";position:absolute;z-index:100;background-color:inherit;top:0;left:0;bottom:0;will-change:left,right;animation:indeterminate-short-31348ccc 2.1s cubic-bezier(.165,.84,.44,1) infinite;animation-delay:1.15s}@keyframes indeterminate-31348ccc{0%{left:-35%;right:100%}60%{left:100%;right:-90%}to{left:100%;right:-90%}}@keyframes indeterminate-short-31348ccc{0%{left:-200%;right:100%}60%{left:107%;right:-8%}to{left:107%;right:-8%}}.carousel-content[data-v-b5c5062f]{position:absolute;top:0;left:0;width:100%;max-height:100%;height:100%}.carousel-navigation--left[data-v-b5c5062f],.carousel-navigation--right[data-v-b5c5062f]{padding:0 1rem;height:100%;position:absolute;display:flex;justify-content:center;align-items:center}.carousel-navigation--right[data-v-b5c5062f]{right:0}.carousel-pagination[data-v-b5c5062f]{position:absolute;bottom:.5rem;width:100%;display:flex;gap:1rem;justify-content:center;align-items:center}.carousel-pagination span[data-v-b5c5062f]{cursor:pointer;width:1.25rem;height:1.25rem;border-radius:50%;background-color:#fff;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;opacity:.8}.b-checkbox .b-checkbox__input[data-v-1d793d06]{display:none;width:1.5rem;height:1.5rem;min-width:1.5rem;min-height:1.5rem}.b-checkbox .b-checkbox__input:checked+.b-checkbox__input-label[data-v-1d793d06]{background-color:rgb(var(--ds-colors-primary-t) / 1)}.b-checkbox .b-checkbox__input:checked+.b-checkbox__input-label[data-v-1d793d06]:after{border-color:#fff}.b-checkbox .b-checkbox__input:disabled+.b-checkbox__input-label[data-v-1d793d06]{background-color:#f3f4f6}.b-checkbox .b-checkbox__input:disabled+.b-checkbox__input-label[data-v-1d793d06]:after{border-color:#f3f4f6}.b-checkbox .b-checkbox__input-label[data-v-1d793d06]{position:relative;background-color:#fff;border-radius:.5rem;cursor:pointer;width:1.5rem;height:1.5rem;transition:all .15s linear}.b-checkbox .b-checkbox__input-label[data-v-1d793d06]:after{border:3px solid transparent;border-top:none;border-right:none;content:"";height:7px;left:5.5px;position:absolute;top:7px;transform:rotate(-45deg);width:.75rem;transition:all .15s linear}.b-checkbox.size-sm .b-checkbox__input[data-v-1d793d06]{width:1.25rem;height:1.25rem;min-width:1.25rem;min-height:1.25rem}.b-checkbox.size-sm .b-checkbox__input-label[data-v-1d793d06]{width:1.25rem;height:1.25rem}.b-checkbox.size-sm .b-checkbox__input-label[data-v-1d793d06]:after{border:2.5px solid transparent;border-top:none;border-right:none;left:3.5px;top:4.5px}.spinner[data-v-c49c635e]{border:.25rem solid #e5e7eb;border-radius:50%;border-top:.25rem solid rgb(var(--ds-colors-primary-t) / 1);border-right:.25rem solid rgb(var(--ds-colors-primary-t) / 1);border-bottom:.25rem solid rgb(var(--ds-colors-primary-t) / 1);animation:spin-c49c635e 2s linear infinite}@keyframes spin-c49c635e{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.carousel-item[data-v-6f2b0dc4]{position:absolute;height:100%;width:100%;display:none;transform:translate(100%)}.carousel-item.reverse[data-v-6f2b0dc4]{transform:translate(-100%)}.carousel-item.active[data-v-6f2b0dc4]{display:block}.slide-in[data-v-6f2b0dc4]{animation:slide-in-6f2b0dc4 .5s forwards}.slide-out[data-v-6f2b0dc4]{animation:slide-out-6f2b0dc4 .5s forwards}@keyframes slide-in-6f2b0dc4{to{transform:translate(0)}}@keyframes slide-out-6f2b0dc4{0%{transform:translate(0)}to{transform:translate(-100%)}}.slide-in-reverse[data-v-6f2b0dc4]{animation:slide-in-reverse-6f2b0dc4 .5s forwards}.slide-out-reverse[data-v-6f2b0dc4]{animation:slide-out-reverse-6f2b0dc4 .5s forwards}@keyframes slide-in-reverse-6f2b0dc4{to{transform:translate(0)}}@keyframes slide-out-reverse-6f2b0dc4{0%{transform:translate(0)}to{transform:translate(100%)}}.carousel-item img{min-width:100%;height:100%}.b-radio__input[data-v-98637356]{display:none}.b-radio__input:checked+.b-radio__input-label[data-v-98637356]:before{background-color:rgb(var(--ds-colors-primary-t) / 1)}.b-radio__input:disabled+.b-radio__input-label[data-v-98637356]{background-color:#f3f4f6}.b-radio__input:disabled+.b-radio__input-label[data-v-98637356]:before{background-color:#f3f4f6}.b-radio__input-label[data-v-98637356]{position:relative;width:1.5rem;height:1.5rem;background-color:#fff;border-radius:9999px}.b-radio__input-label[data-v-98637356]:before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background-color:transparent;height:1rem;width:1rem;border-radius:9999px;transition:all .15s linear}.tab-header.active[data-v-646ae8c4]{background-color:#fff;color:rgb(var(--ds-colors-primary-t) / 1)}.b-text-field:has(.b-text-field__prepend-icon) input[data-v-d47b93d4]{padding-left:2.25rem}.b-text-field:has(.b-text-field__append-icon) input[data-v-d47b93d4]{padding-right:2.25rem}.tooltip-arrow[data-v-419a3aa7]{position:absolute;left:0;transform:translate3d(59.5px,0,0)}.b-image-picker[data-v-8033e228]{container-name:image-picker;container-type:inline-size}.b-image-picker__draggable[data-v-8033e228]{width:100%;position:relative}.b-image-picker__draggable[data-v-8033e228]:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:.5rem}@container image-picker (min-width: 640px){.b-image-picker__draggable[data-v-8033e228]{width:calc(33.3333333333% - .3333333333rem)}}@container image-pbnicker (min-width: 768px){.b-image-picker__draggable[data-v-8033e228]{width:calc(25% - .375rem)}}@container image-picker (min-width: 1280px){.b-image-picker__draggable[data-v-8033e228]{width:calc(20% - .4rem)}}.dragging[data-v-8033e228]{opacity:.5}.dropped-target[data-v-8033e228]{border-width:2px;--tw-border-opacity: 1;border-color:rgb(var(--ds-colors-primary-f) / var(--tw-border-opacity))}.b-currency-field:has(.b-currency-field__prepend-icon) input[data-v-5cbc4bba]{padding-left:2.25rem}.b-currency-field:has(.b-currency-field__append-icon) input[data-v-5cbc4bba]{padding-right:2.25rem}.b-switch__input[data-v-94d47575]{display:none}.b-switch__input:checked+.b-switch__input-label[data-v-94d47575]{background-color:rgb(var(--ds-colors-primary-t) / 1)}.b-switch__input:checked+.b-switch__input-label[data-v-94d47575]:before{transform:translate(100%);background-color:#fff}.b-switch__input:disabled+.b-switch__input-label[data-v-94d47575]:before{background-color:#f3f4f6}.b-switch__input-label[data-v-94d47575]{position:relative;display:flex;background-color:#e5e7eb;border-radius:1rem;padding:.125rem;width:2.75rem;height:1.5rem}.b-switch__input-label[data-v-94d47575]:before{content:"";position:absolute;width:1.25rem;height:1.25rem;background-color:#fff;border-radius:9999px;left:calc(.125rem - 1px);top:calc(.125rem - 1px);transition:all .15s linear}.date-range:not(:has(.--start):has(.--end)) .date-item.--selected~.date-item:has(~.date-item:hover) .date-item__inner[data-v-9a965dba]{background-color:rgb(var(--ds-colors-primary-t) / 10%)}.date-range:not(:has(.--start):has(.--end)) .date-item:hover~.date-item:has(~.date-item.--selected) .date-item__inner[data-v-9a965dba]{background-color:rgb(var(--ds-colors-primary-t) / 10%)}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@7pmlabs/design-system",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "homepage": "https://github.com/ngphanducthinh/design-system",
   "sideEffects": [
     "style.css"