@idds/vue 1.4.20 → 1.4.22

package/dist/index.es.js

@@ -422,8 +422,7 @@ const _sfc_main$P = /* @__PURE__ */ defineComponent({
     defaultOpen: { type: Boolean, default: false },
     open: { type: Boolean, default: void 0 },
     onToggle: {},
-    disabled: { type: Boolean, default: false },
-    className: { default: "" }
+    disabled: { type: Boolean, default: false }
   },
   emits: ["toggle"],
   setup(__props, { emit: __emit }) {
@@ -456,9 +455,6 @@ const _sfc_main$P = /* @__PURE__ */ defineComponent({
     const contentId = computed(() => `accordion-content-${itemId.value}`);
     const accordionClasses = computed(() => {
       const classes = ["ina-accordion"];
-      if (props.className) {
-        classes.push(props.className);
-      }
       if (props.disabled) {
         classes.push("ina-accordion--disabled");
       }
@@ -1309,21 +1305,21 @@ const _sfc_main$K = /* @__PURE__ */ defineComponent({
     alt: { default: "Avatar" },
     initials: { default: "" },
     size: { default: 32 },
-    shape: { default: "circle" },
-    className: { default: "" }
+    shape: { default: "circle" }
   },
   setup(__props) {
     const props = __props;
     const imageError = ref(false);
     const imageLoaded = ref(false);
     const avatarClasses = computed(() => {
-      const classes = ["ina-avatar", `ina-avatar--${props.size}`, `ina-avatar--${props.shape}`];
+      const classes = [
+        "ina-avatar",
+        `ina-avatar--${props.size}`,
+        `ina-avatar--${props.shape}`
+      ];
       if (props.src && !imageError.value) {
         classes.push("ina-avatar--image");
       }
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes;
     });
     const handleImageError = () => {
@@ -1365,8 +1361,7 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
     size: { default: "md" },
     rounded: { default: "full" },
     prefixIcon: {},
-    suffixIcon: {},
-    className: { default: "" }
+    suffixIcon: {}
   },
   setup(__props) {
     const props = __props;
@@ -1378,9 +1373,6 @@ const _sfc_main$J = /* @__PURE__ */ defineComponent({
         `ina-badge--${props.size}`,
         `ina-badge--rounded-${props.rounded}`
       ];
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes;
     });
     return (_ctx, _cache) => {
@@ -1585,8 +1577,7 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
     prefixIcon: {},
     suffixIcon: {},
     disabled: { type: Boolean, default: false },
-    type: { default: "button" },
-    className: { default: "" }
+    type: { default: "button" }
   },
   emits: ["click"],
   setup(__props) {
@@ -1595,9 +1586,6 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
       const classes = ["ina-button"];
       classes.push(`ina-button--${props.hierarchy}`);
       classes.push(`ina-button--${props.size}`);
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes;
     });
     const renderIcon = (icon, wrapperClass) => {
@@ -1637,7 +1625,6 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
     options: {},
     modelValue: {},
     disabled: { type: Boolean, default: false },
-    className: { default: "" },
     name: {}
   },
   emits: ["update:modelValue", "change"],
@@ -1649,9 +1636,6 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
       if (props.disabled) {
         classes.push("ina-button-group--disabled");
       }
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes;
     });
     const isSelected = (option) => {
@@ -1745,7 +1729,7 @@ const _hoisted_13$6 = {
   class: "ina-card__media"
 };
 const _hoisted_14$5 = ["src", "alt"];
-const _hoisted_15$3 = {
+const _hoisted_15$4 = {
   key: 4,
   class: "ina-card__media"
 };
@@ -1793,8 +1777,7 @@ const _sfc_main$E = /* @__PURE__ */ defineComponent({
     showFooter: { type: Boolean, default: false },
     hoverable: { type: Boolean, default: false },
     clickable: { type: Boolean, default: false },
-    size: { default: "md" },
-    className: { default: "" }
+    size: { default: "md" }
   },
   emits: ["buttonClick", "click"],
   setup(__props, { emit: __emit }) {
@@ -1831,9 +1814,6 @@ const _sfc_main$E = /* @__PURE__ */ defineComponent({
       if (props.showFooter) {
         classes.push("ina-card--with-footer");
       }
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes;
     });
     const handleButtonClick = () => {
@@ -1921,7 +1901,7 @@ const _sfc_main$E = /* @__PURE__ */ defineComponent({
             }, null, 8, _hoisted_14$5)) : createCommentVNode("", true)
           ])
         ])) : createCommentVNode("", true),
-        __props.variant === "horizontal" && computedMediaPosition.value === "right" ? (openBlock(), createElementBlock("div", _hoisted_15$3, [
+        __props.variant === "horizontal" && computedMediaPosition.value === "right" ? (openBlock(), createElementBlock("div", _hoisted_15$4, [
           renderSlot(_ctx.$slots, "media", {}, () => [
             __props.mediaSrc ? (openBlock(), createElementBlock("img", {
               key: 0,
@@ -2647,8 +2627,7 @@ const _sfc_main$B = /* @__PURE__ */ defineComponent({
     onSelect: {},
     showCustomization: { type: Boolean, default: false },
     customizationLabel: { default: "Kustomisasi" },
-    customizationComponent: {},
-    className: { default: "" }
+    customizationComponent: {}
   },
   emits: ["select"],
   setup(__props, { emit: __emit }) {
@@ -2690,9 +2669,6 @@ const _sfc_main$B = /* @__PURE__ */ defineComponent({
     );
     const chipContainerClasses = computed(() => {
       const classes = ["ina-chip"];
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes;
     });
     const getChipItemClasses = (opt, index2) => {
@@ -2780,8 +2756,7 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
     diameter: { default: 20 },
     strokeWidth: { default: 3 },
     variant: { default: "primary" },
-    trackColor: { default: "#EAECF0" },
-    className: { default: "" }
+    trackColor: { default: "#EAECF0" }
   },
   setup(__props) {
     const props = __props;
@@ -2797,7 +2772,7 @@ const _sfc_main$A = /* @__PURE__ */ defineComponent({
     const isCustomColor = computed(() => props.variant.startsWith("#"));
     const containerClasses = computed(() => {
       const variantClass = !isCustomColor.value ? `ina-circle-progress-bar--${props.variant}` : "";
-      return ["ina-circle-progress-bar", variantClass, props.className].filter(Boolean).join(" ");
+      return ["ina-circle-progress-bar", variantClass].filter(Boolean).join(" ");
     });
     const containerStyle = computed(() => {
       const style = {
@@ -2983,7 +2958,6 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
     trigger: {},
     triggerText: { default: "Dropdown" },
     items: {},
-    className: { default: "" },
     dropdownClassName: { default: "" },
     dropdownStyle: {},
     disabled: { type: Boolean, default: false },
@@ -3000,9 +2974,6 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
     });
     const containerClasses = computed(() => {
       const classes = ["ina-dropdown"];
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes;
     });
     const triggerClasses = computed(() => {
@@ -3136,7 +3107,7 @@ const _sfc_main$x = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Dropdown = /* @__PURE__ */ _export_sfc(_sfc_main$x, [["__scopeId", "data-v-caab13f9"]]);
+const Dropdown = /* @__PURE__ */ _export_sfc(_sfc_main$x, [["__scopeId", "data-v-3db9a074"]]);
 const _hoisted_1$s = { class: "ina-field-input-table__wrapper" };
 const _hoisted_2$r = { class: "ina-field-input-table__label" };
 const _hoisted_3$p = ["value"];
@@ -3148,19 +3119,14 @@ const _sfc_main$w = /* @__PURE__ */ defineComponent({
     onChange: {},
     onCommit: {},
     onCancel: {},
-    placeholder: { default: "" },
-    className: { default: "" }
+    placeholder: { default: "" }
   },
   emits: ["change", "commit", "cancel"],
   setup(__props, { emit: __emit }) {
-    const props = __props;
     const emit = __emit;
     const inputRef = ref(null);
     const containerClasses = computed(() => {
       const classes = ["ina-field-input-table"];
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes.join(" ");
     });
     const handleKeyDown = (e) => {
@@ -3497,7 +3463,7 @@ const _hoisted_14$4 = {
   key: 2,
   class: "ina-file-upload__file-icon-wrapper ina-file-upload__file-icon-wrapper--error"
 };
-const _hoisted_15$2 = {
+const _hoisted_15$3 = {
   key: 3,
   class: "ina-file-upload__file-icon-wrapper ina-file-upload__file-icon-wrapper--success"
 };
@@ -3532,7 +3498,6 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
     maxTotalSizeMB: { default: void 0 },
     validateMagicNumber: { type: Boolean, default: true },
     disabled: { type: Boolean, default: false },
-    className: { default: "" },
     onChange: {},
     onRemove: {}
   },
@@ -3579,9 +3544,6 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
     };
     const uploadClasses = computed(() => {
       const classes = ["ina-file-upload"];
-      if (props.className) {
-        classes.push(props.className);
-      }
       if (props.disabled) {
         classes.push("ina-file-upload--disabled");
       }
@@ -3819,7 +3781,7 @@ const _sfc_main$v = /* @__PURE__ */ defineComponent({
                       size: 20,
                       stroke: "2"
                     })
-                  ])) : uploadedFile.status === "idle" ? (openBlock(), createElementBlock("div", _hoisted_15$2, [
+                  ])) : uploadedFile.status === "idle" ? (openBlock(), createElementBlock("div", _hoisted_15$3, [
                     createVNode(unref(IconCircleCheck), {
                       size: 20,
                       stroke: "2"
@@ -5760,8 +5722,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
     duration: { default: 1e3 },
     variant: { default: "primary" },
     height: { default: "sm" },
-    shimmer: { type: Boolean, default: true },
-    className: { default: "" }
+    shimmer: { type: Boolean, default: true }
   },
   setup(__props) {
     const props = __props;
@@ -5773,9 +5734,6 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
       if (!props.visible) {
         classes.push("ina-progress-bar--hidden");
       }
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes.join(" ");
     });
     const fillClasses = computed(() => {
@@ -5819,8 +5777,7 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
   __name: "LinearProgressIndicator",
   props: {
     value: { default: 0 },
-    visible: { type: Boolean, default: true },
-    className: { default: "" }
+    visible: { type: Boolean, default: true }
   },
   setup(__props) {
     const props = __props;
@@ -5829,9 +5786,6 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
     });
     const containerClasses = computed(() => {
       const classes = ["ina-linear-progress-indicator"];
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes.join(" ");
     });
     return (_ctx, _cache) => {
@@ -6387,7 +6341,7 @@ const _hoisted_11$4 = { class: "ina-date-picker__day-number" };
 const _hoisted_12$3 = { class: "ina-date-picker__calendar-container" };
 const _hoisted_13$3 = { class: "ina-date-picker__calendar-header" };
 const _hoisted_14$2 = { class: "ina-date-picker__header-controls" };
-const _hoisted_15$1 = { class: "ina-date-picker__dropdown-container" };
+const _hoisted_15$2 = { class: "ina-date-picker__dropdown-container" };
 const _hoisted_16$1 = { class: "ina-date-picker__dropdown-container" };
 const _hoisted_17$1 = { class: "ina-date-picker__calendar-grid" };
 const _hoisted_18$1 = ["disabled", "onClick"];
@@ -6427,8 +6381,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
     panelMaxHeight: { default: void 0 },
     panelClassName: { default: "" },
     triggerClassname: { default: "" },
-    popperPlacement: { default: "bottom-start" },
-    className: {}
+    popperPlacement: { default: "bottom-start" }
   },
   emits: ["update:modelValue", "change", "clear"],
   setup(__props, { emit: __emit }) {
@@ -6501,11 +6454,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
       return "";
     });
     const containerClasses = computed(() => {
-      return clsx(
-        "ina-date-picker",
-        props.className,
-        props.disabled && "ina-date-picker--disabled"
-      );
+      return clsx("ina-date-picker", props.disabled && "ina-date-picker--disabled");
     });
     const triggerClasses = computed(() => {
       return clsx(
@@ -7305,7 +7254,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
                     })
                   ]),
                   createElementVNode("div", _hoisted_14$2, [
-                    createElementVNode("div", _hoisted_15$1, [
+                    createElementVNode("div", _hoisted_15$2, [
                       createVNode(MonthPicker, {
                         "model-value": currentMonth.value,
                         disabled: __props.disabled,
@@ -7435,7 +7384,7 @@ const _sfc_main$j = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const DatePicker = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-d43f3297"]]);
+const DatePicker = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-93b333e7"]]);
 const _hoisted_1$f = ["disabled"];
 const _hoisted_2$f = {
   key: 0,
@@ -7465,7 +7414,7 @@ const _hoisted_11$3 = { class: "ina-select-dropdown__preview-item-text" };
 const _hoisted_12$2 = ["aria-label"];
 const _hoisted_13$2 = ["disabled", "onClick"];
 const _hoisted_14$1 = { class: "ina-select-dropdown__option-content" };
-const _hoisted_15 = { class: "ina-select-dropdown__option-label" };
+const _hoisted_15$1 = { class: "ina-select-dropdown__option-label" };
 const _hoisted_16 = {
   key: 0,
   class: "ina-select-dropdown__option-check-indicator"
@@ -7514,7 +7463,6 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     onRemoveSelected: {},
     panelClassName: { default: "" },
     triggerClassName: { default: "" },
-    className: { default: "" },
     showPreviewValue: { type: Boolean, default: true },
     searchable: { type: Boolean, default: true }
   },
@@ -7792,11 +7740,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
       }
     };
     const containerClasses = computed(() => {
-      return clsx(
-        "ina-select-dropdown",
-        `ina-select-dropdown--size-${props.size}`,
-        props.className
-      );
+      return clsx("ina-select-dropdown", `ina-select-dropdown--size-${props.size}`);
     });
     const triggerClasses = computed(() => {
       return clsx(
@@ -7943,7 +7887,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
                         option,
                         selected: isSelected(option)
                       }, () => [
-                        createElementVNode("span", _hoisted_15, toDisplayString(getOptionLabel(option)), 1)
+                        createElementVNode("span", _hoisted_15$1, toDisplayString(getOptionLabel(option)), 1)
                       ], true)
                     ]),
                     __props.multiple ? (openBlock(), createElementBlock("div", {
@@ -8002,7 +7946,7 @@ const _sfc_main$i = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SelectDropdown = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-e3f2a508"]]);
+const SelectDropdown = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-1efeeb5b"]]);
 const _hoisted_1$e = ["aria-labelledby", "aria-describedby"];
 const _hoisted_2$e = {
   key: 0,
@@ -8196,7 +8140,6 @@ const Drawer = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-a
 const _sfc_main$g = /* @__PURE__ */ defineComponent({
   __name: "Skeleton",
   props: {
-    className: { default: "" },
     color: { default: "gray" },
     width: { default: void 0 },
     height: { default: "32px" },
@@ -8208,9 +8151,6 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
       const classes = ["ina-skeleton"];
       classes.push(`ina-skeleton--rounded-${props.rounded}`);
       classes.push(`ina-skeleton--color-${props.color}`);
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes;
     });
     const skeletonStyle = computed(() => {
@@ -8326,7 +8266,6 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
     steps: {},
     currentStep: {},
     orientation: { default: "horizontal" },
-    className: {},
     onStepClick: {},
     errorSteps: { default: () => [] }
   },
@@ -8340,8 +8279,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
           `ina-stepper--${props.orientation}`,
           {
             "ina-stepper--horizontal-responsive": isHorizontal.value
-          },
-          props.className
+          }
         ])
       }, [
         (openBlock(true), createElementBlock(Fragment, null, renderList(props.steps, (step, index2) => {
@@ -8393,7 +8331,7 @@ const _sfc_main$e = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Stepper = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-2ab1d888"]]);
+const Stepper = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-7098cd68"]]);
 const _hoisted_1$b = ["aria-selected", "aria-disabled", "disabled", "onClick", "onKeydown"];
 const _hoisted_2$b = { key: 0 };
 const _hoisted_3$9 = { key: 1 };
@@ -8409,7 +8347,6 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
     fullWidth: { type: Boolean, default: false },
     useBrandColor: { type: Boolean, default: false },
     disabled: { type: Boolean, default: false },
-    className: { default: "" },
     containerClassName: { default: "" },
     tabClassName: { default: "" }
   },
@@ -8437,9 +8374,6 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
       if (props.disabled) {
         classes.push("ina-tab-horizontal--disabled");
       }
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes;
     });
     const tabsContainerClasses = computed(() => {
@@ -8551,7 +8485,6 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
     variant: { default: "outline" },
     useBrandColor: { type: Boolean, default: false },
     disabled: { type: Boolean, default: false },
-    className: { default: "" },
     containerClassName: { default: "" },
     tabClassName: { default: "" },
     width: { default: "200px" }
@@ -8577,9 +8510,6 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
       if (props.disabled) {
         classes.push("ina-tab-vertical--disabled");
       }
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes;
     });
     const tabsContainerClasses = computed(() => {
@@ -8682,8 +8612,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
   props: {
     visible: { type: Boolean, default: true },
     loading: { type: Boolean, default: false },
-    variant: { default: "primary" },
-    className: { default: "" }
+    variant: { default: "primary" }
   },
   setup(__props) {
     const props = __props;
@@ -8728,9 +8657,6 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
       if (isAnimating.value) {
         classes.push("ina-table-progress-bar--animating");
       }
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes.join(" ");
     });
     return (_ctx, _cache) => {
@@ -8784,7 +8710,6 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
     placeholderSearch: { default: "Search..." },
     searchPlaceholder: { default: "Input pencarian" },
     buttonSearchLabel: { default: "Cari" },
-    className: { default: "" },
     selectable: { type: Boolean, default: false },
     onSelectionChange: {},
     editableColumns: { default: () => [] },
@@ -9013,7 +8938,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
       page.value = 1;
     };
     const tableContainerClasses = computed(() => {
-      return clsx("ina-table", props.className, {
+      return clsx("ina-table", {
         "ina-table--sticky-last-column": props.lastColumnSticky
       });
     });
@@ -9059,7 +8984,7 @@ const _sfc_main$a = /* @__PURE__ */ defineComponent({
           visible: loading.value,
           loading: loading.value,
           variant: "primary",
-          className: "ina-table__progress-bar"
+          class: "ina-table__progress-bar"
         }, null, 8, ["visible", "loading"]),
         createElementVNode("table", {
           ref_key: "tableRef",
@@ -9513,7 +9438,6 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     error: { type: Boolean, default: false },
     disabled: { type: Boolean, default: false },
     readonly: { type: Boolean, default: false },
-    className: {},
     autoFocus: { type: Boolean, default: false }
   },
   emits: ["update:modelValue", "complete"],
@@ -9556,7 +9480,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
       }
     );
     const containerClasses = computed(() => {
-      return clsx("ina-one-time-password", props.className);
+      return clsx("ina-one-time-password");
     });
     const inputClasses = computed(() => {
       return clsx(
@@ -9743,7 +9667,6 @@ const _hoisted_2$6 = ["aria-label", "title"];
 const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   __name: "ThemeToggle",
   props: {
-    className: { default: "" },
     size: { default: "md" },
     showLabel: { type: Boolean, default: false }
   },
@@ -9765,9 +9688,6 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     };
     const containerClasses = computed(() => {
       const classes = ["ina-theme-toggle", `ina-theme-toggle--size-${props.size}`];
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes.join(" ");
     });
     const buttonClasses = computed(() => {
@@ -9847,7 +9767,6 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
     modelValue: {},
     onChange: {},
     onOpenChange: {},
-    className: {},
     use12Hours: { type: Boolean, default: false },
     showSecond: { type: Boolean, default: false },
     allowClear: { type: Boolean, default: true },
@@ -10062,9 +9981,6 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
       if (isOpen.value) {
         classes.push("ina-time-picker--open");
       }
-      if (props.className) {
-        classes.push(props.className);
-      }
       return classes;
     });
     const inputClasses = computed(() => {
@@ -10310,8 +10226,7 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
     state: { default: "default" },
     style: { default: "solid" },
     duration: { default: 5e3 },
-    position: { default: "top-right" },
-    className: { default: "" }
+    position: { default: "top-right" }
   },
   setup(__props) {
     const props = __props;
@@ -10400,13 +10315,14 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
         }
       }, 300);
     }
+    const attrs = useAttrs();
     const toastClasses = computed(() => {
       return clsx(
         "ina-toast",
         `ina-toast--state-${props.state}`,
         `ina-toast--style-${props.style}`,
         `ina-toast--${isVisible.value ? "visible" : "hidden"}`,
-        props.className
+        attrs.class
       );
     });
     return (_ctx, _cache) => {
@@ -10490,8 +10406,8 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
             style: normalizeStyle(toast2.style),
             duration: toast2.duration,
             position: toast2.position,
-            className: toast2.className
-          }, null, 8, ["onClose", "title", "description", "actionNode", "state", "style", "duration", "position", "className"]);
+            class: normalizeClass(toast2.class)
+          }, null, 8, ["onClose", "title", "description", "actionNode", "state", "style", "duration", "position", "class"]);
         }), 128))
       ]);
     };
@@ -10534,7 +10450,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
           {
             hierarchy: "custom",
             size: "sm",
-            className: cancelClassName,
+            class: cancelClassName,
             onClick: () => handleCloseFn(false)
           },
           { default: () => cancelText }
@@ -10544,7 +10460,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
           {
             hierarchy: "custom",
             size: "sm",
-            className: confirmClassName,
+            class: confirmClassName,
             onClick: () => handleCloseFn(true)
           },
           { default: () => confirmText }
@@ -10802,8 +10718,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     showArrow: { type: Boolean, default: true },
     onClose: {},
     onNext: {},
-    customContent: { type: Boolean, default: false },
-    className: { default: "" }
+    customContent: { type: Boolean, default: false }
   },
   emits: ["close", "next"],
   setup(__props, { emit: __emit }) {
@@ -10831,9 +10746,6 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
     const tooltipClasses = computed(() => {
       const classes = ["ina-tooltip", `ina-tooltip--placement-${props.placement}`];
-      if (props.className) {
-        classes.push(props.className);
-      }
       if (isClosed.value) {
         classes.push("ina-tooltip--closed");
       }
@@ -10932,7 +10844,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Tooltip = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-e5a730e8"]]);
+const Tooltip = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-6ec52ff3"]]);
 const predefinedBrands = [
   "inagov",
   "inaku",
@@ -10995,20 +10907,21 @@ function initializeTheme(brandName) {
 if (typeof window !== "undefined") {
   initializeTheme();
 }
-const _hoisted_1 = ["id", "accept", "disabled"];
-const _hoisted_2 = ["tabindex", "aria-label"];
-const _hoisted_3 = { class: "ina-single-file-upload__icon-wrapper ina-single-file-upload__icon-wrapper--default" };
-const _hoisted_4 = { class: "ina-single-file-upload__content" };
-const _hoisted_5 = { class: "ina-single-file-upload__title" };
-const _hoisted_6 = { class: "ina-single-file-upload__description" };
-const _hoisted_7 = { class: "ina-single-file-upload__icon-wrapper ina-single-file-upload__icon-wrapper--default" };
-const _hoisted_8 = { class: "ina-single-file-upload__progress" };
-const _hoisted_9 = { class: "ina-single-file-upload__progress-bar" };
-const _hoisted_10 = { class: "ina-single-file-upload__progress-text" };
-const _hoisted_11 = { class: "ina-single-file-upload__icon-wrapper ina-single-file-upload__icon-wrapper--file" };
-const _hoisted_12 = { class: "ina-single-file-upload__content" };
-const _hoisted_13 = { class: "ina-single-file-upload__title" };
-const _hoisted_14 = { class: "ina-single-file-upload__description" };
+const _hoisted_1 = { class: "ina-single-file-upload" };
+const _hoisted_2 = ["id", "accept", "disabled"];
+const _hoisted_3 = ["tabindex", "aria-label"];
+const _hoisted_4 = { class: "ina-single-file-upload__icon-wrapper ina-single-file-upload__icon-wrapper--default" };
+const _hoisted_5 = { class: "ina-single-file-upload__content" };
+const _hoisted_6 = { class: "ina-single-file-upload__title" };
+const _hoisted_7 = { class: "ina-single-file-upload__description" };
+const _hoisted_8 = { class: "ina-single-file-upload__icon-wrapper ina-single-file-upload__icon-wrapper--default" };
+const _hoisted_9 = { class: "ina-single-file-upload__progress" };
+const _hoisted_10 = { class: "ina-single-file-upload__progress-bar" };
+const _hoisted_11 = { class: "ina-single-file-upload__progress-text" };
+const _hoisted_12 = { class: "ina-single-file-upload__icon-wrapper ina-single-file-upload__icon-wrapper--file" };
+const _hoisted_13 = { class: "ina-single-file-upload__content" };
+const _hoisted_14 = { class: "ina-single-file-upload__title" };
+const _hoisted_15 = { class: "ina-single-file-upload__description" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "SingleFileUpload",
   props: {
@@ -11019,7 +10932,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     allowedExtensions: {},
     validateMagicNumber: { type: Boolean, default: true },
     disabled: { type: Boolean, default: false },
-    className: { default: "" },
     progress: {},
     status: {}
   },
@@ -11274,9 +11186,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       emit("change", droppedFile, null);
     };
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["ina-single-file-upload", props.className])
-      }, [
+      return openBlock(), createElementBlock("div", _hoisted_1, [
         createElementVNode("input", mergeProps(filteredAttrs.value, {
           id: inputId.value,
           ref_key: "fileInputRef",
@@ -11286,7 +11196,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           disabled: props.disabled,
           class: "ina-single-file-upload__input",
           onChange: handleFileChange
-        }), null, 16, _hoisted_1),
+        }), null, 16, _hoisted_2),
         createElementVNode("div", {
           class: normalizeClass(containerClasses.value),
           role: "button",
@@ -11300,35 +11210,35 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           onDrop: handleDrop
         }, [
           !file.value && status.value === "idle" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-            createElementVNode("div", _hoisted_3, [
+            createElementVNode("div", _hoisted_4, [
               createVNode(unref(IconUpload), { size: 24 })
             ]),
-            createElementVNode("div", _hoisted_4, [
-              createElementVNode("div", _hoisted_5, toDisplayString(props.title), 1),
-              createElementVNode("div", _hoisted_6, toDisplayString(props.description), 1)
+            createElementVNode("div", _hoisted_5, [
+              createElementVNode("div", _hoisted_6, toDisplayString(props.title), 1),
+              createElementVNode("div", _hoisted_7, toDisplayString(props.description), 1)
             ])
           ], 64)) : createCommentVNode("", true),
           !file.value && status.value === "uploading" ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-            createElementVNode("div", _hoisted_7, [
+            createElementVNode("div", _hoisted_8, [
               createVNode(unref(IconUpload), { size: 24 })
             ]),
-            createElementVNode("div", _hoisted_8, [
-              createElementVNode("div", _hoisted_9, [
+            createElementVNode("div", _hoisted_9, [
+              createElementVNode("div", _hoisted_10, [
                 createElementVNode("div", {
                   class: "ina-single-file-upload__progress-fill",
                   style: normalizeStyle({ width: `${progress.value}%` })
                 }, null, 4)
               ]),
-              createElementVNode("div", _hoisted_10, " Uploading... " + toDisplayString(progress.value) + "% ", 1)
+              createElementVNode("div", _hoisted_11, " Uploading... " + toDisplayString(progress.value) + "% ", 1)
             ])
           ], 64)) : createCommentVNode("", true),
           file.value && status.value === "success" ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
-            createElementVNode("div", _hoisted_11, [
+            createElementVNode("div", _hoisted_12, [
               (openBlock(), createBlock(resolveDynamicComponent(fileIconComponent.value), { size: 16 }))
             ]),
-            createElementVNode("div", _hoisted_12, [
-              createElementVNode("div", _hoisted_13, toDisplayString(file.value.name), 1),
-              createElementVNode("div", _hoisted_14, toDisplayString(props.description), 1)
+            createElementVNode("div", _hoisted_13, [
+              createElementVNode("div", _hoisted_14, toDisplayString(file.value.name), 1),
+              createElementVNode("div", _hoisted_15, toDisplayString(props.description), 1)
             ]),
             createElementVNode("button", {
               type: "button",
@@ -11339,8 +11249,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               createVNode(unref(IconTrash), { size: 18 })
             ])
           ], 64)) : createCommentVNode("", true)
-        ], 42, _hoisted_2)
-      ], 2);
+        ], 42, _hoisted_3)
+      ]);
     };
   }
 });