@henriquepetrelli/hp-design-system 1.1.27 → 1.1.29

package/dist/hp-design-system.umd.js

@@ -23,8 +23,8 @@
     return ButtonSize2;
   })(ButtonSize || {});
 
-  const _hoisted_1$i = ["xlink:href"];
-  const _sfc_main$k = /* @__PURE__ */ vue.defineComponent({
+  const _hoisted_1$j = ["xlink:href"];
+  const _sfc_main$l = /* @__PURE__ */ vue.defineComponent({
     __name: "Icon",
     props: {
       name: {
@@ -58,7 +58,7 @@
         }, [
           vue.createElementVNode("use", {
             "xlink:href": `#icon-${__props.name}`
-          }, null, 8, _hoisted_1$i)
+          }, null, 8, _hoisted_1$j)
         ], 6);
       };
     }
@@ -72,18 +72,18 @@
     return target;
   };
 
-  const HpIcon = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-0b477588"]]);
+  const HpIcon = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-0b477588"]]);
 
-  const _hoisted_1$h = ["aria-label", "aria-disabled", "disabled"];
-  const _hoisted_2$g = {
+  const _hoisted_1$i = ["aria-label", "aria-disabled", "disabled"];
+  const _hoisted_2$h = {
     key: 0,
     class: "button-primary__icon--left"
   };
-  const _hoisted_3$e = {
+  const _hoisted_3$f = {
     key: 1,
     class: "button-primary__icon--right"
   };
-  const _sfc_main$j = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$k = /* @__PURE__ */ vue.defineComponent({
     __name: "ButtonPrimary",
     props: {
       label: {
@@ -156,7 +156,7 @@
           disabled: __props.disabled,
           onClick: handleClick
         }, [
-          __props.icon && __props.iconPosition === vue.unref(IconPosition).LEFT ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$g, [
+          __props.icon && __props.iconPosition === vue.unref(IconPosition).LEFT ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$h, [
             vue.createVNode(HpIcon, {
               name: __props.icon,
               size: "sm",
@@ -167,31 +167,31 @@
             class: "button-primary__label",
             style: vue.normalizeStyle({ color: computedColor.value })
           }, vue.toDisplayString(__props.label), 5),
-          __props.icon && __props.iconPosition === vue.unref(IconPosition).RIGHT ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$e, [
+          __props.icon && __props.iconPosition === vue.unref(IconPosition).RIGHT ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$f, [
             vue.createVNode(HpIcon, {
               name: __props.icon,
               size: "sm",
               color: computedColor.value
             }, null, 8, ["name", "color"])
           ])) : vue.createCommentVNode("", true)
-        ], 14, _hoisted_1$h);
+        ], 14, _hoisted_1$i);
       };
     }
   });
 
-  const HpButtonPrimary = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-5c29dcce"]]);
+  const HpButtonPrimary = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-5c29dcce"]]);
 
-  const _hoisted_1$g = ["aria-label", "aria-disabled", "disabled"];
-  const _hoisted_2$f = {
+  const _hoisted_1$h = ["aria-label", "aria-disabled", "disabled"];
+  const _hoisted_2$g = {
     key: 0,
     class: "button-secondary__icon--left"
   };
-  const _hoisted_3$d = { class: "button-secondary__label" };
-  const _hoisted_4$9 = {
+  const _hoisted_3$e = { class: "button-secondary__label" };
+  const _hoisted_4$a = {
     key: 1,
     class: "button-secondary__icon--right"
   };
-  const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$j = /* @__PURE__ */ vue.defineComponent({
     __name: "ButtonSecondary",
     props: {
       label: {
@@ -249,37 +249,37 @@
           disabled: __props.disabled,
           onClick: handleClick
         }, [
-          __props.icon && __props.iconPosition === vue.unref(IconPosition).LEFT ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$f, [
+          __props.icon && __props.iconPosition === vue.unref(IconPosition).LEFT ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$g, [
             vue.createVNode(HpIcon, {
               name: __props.icon,
               size: "sm"
             }, null, 8, ["name"])
           ])) : vue.createCommentVNode("", true),
-          vue.createElementVNode("span", _hoisted_3$d, vue.toDisplayString(__props.label), 1),
-          __props.icon && __props.iconPosition === vue.unref(IconPosition).RIGHT ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$9, [
+          vue.createElementVNode("span", _hoisted_3$e, vue.toDisplayString(__props.label), 1),
+          __props.icon && __props.iconPosition === vue.unref(IconPosition).RIGHT ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$a, [
             vue.createVNode(HpIcon, {
               name: __props.icon,
               size: "sm"
             }, null, 8, ["name"])
           ])) : vue.createCommentVNode("", true)
-        ], 14, _hoisted_1$g);
+        ], 14, _hoisted_1$h);
       };
     }
   });
 
-  const HpButtonSecondary = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-ce9350e4"]]);
+  const HpButtonSecondary = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-ce9350e4"]]);
 
-  const _hoisted_1$f = ["aria-label", "aria-disabled", "disabled"];
-  const _hoisted_2$e = {
+  const _hoisted_1$g = ["aria-label", "aria-disabled", "disabled"];
+  const _hoisted_2$f = {
     key: 0,
     class: "button-tertiary__icon--left"
   };
-  const _hoisted_3$c = { class: "button-tertiary__label" };
-  const _hoisted_4$8 = {
+  const _hoisted_3$d = { class: "button-tertiary__label" };
+  const _hoisted_4$9 = {
     key: 1,
     class: "button-tertiary__icon--right"
   };
-  const _sfc_main$h = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
     __name: "ButtonTertiary",
     props: {
       label: {
@@ -337,25 +337,25 @@
           disabled: __props.disabled,
           onClick: handleClick
         }, [
-          __props.icon && __props.iconPosition === vue.unref(IconPosition).LEFT ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$e, [
+          __props.icon && __props.iconPosition === vue.unref(IconPosition).LEFT ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$f, [
             vue.createVNode(HpIcon, {
               name: __props.icon,
               size: "sm"
             }, null, 8, ["name"])
           ])) : vue.createCommentVNode("", true),
-          vue.createElementVNode("span", _hoisted_3$c, vue.toDisplayString(__props.label), 1),
-          __props.icon && __props.iconPosition === vue.unref(IconPosition).RIGHT ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$8, [
+          vue.createElementVNode("span", _hoisted_3$d, vue.toDisplayString(__props.label), 1),
+          __props.icon && __props.iconPosition === vue.unref(IconPosition).RIGHT ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$9, [
             vue.createVNode(HpIcon, {
               name: __props.icon,
               size: "sm"
             }, null, 8, ["name"])
           ])) : vue.createCommentVNode("", true)
-        ], 14, _hoisted_1$f);
+        ], 14, _hoisted_1$g);
       };
     }
   });
 
-  const ButtonTertiary = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-0401b00e"]]);
+  const ButtonTertiary = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-0401b00e"]]);
 
   var ButtonIconSize = /* @__PURE__ */ ((ButtonIconSize2) => {
     ButtonIconSize2["SMALL"] = "sm";
@@ -382,8 +382,8 @@
     return "";
   };
 
-  const _hoisted_1$e = ["aria-label", "tabindex", "aria-disabled", "disabled"];
-  const _sfc_main$g = /* @__PURE__ */ vue.defineComponent({
+  const _hoisted_1$f = ["aria-label", "tabindex", "aria-disabled", "disabled"];
+  const _sfc_main$h = /* @__PURE__ */ vue.defineComponent({
     __name: "ButtonIcon",
     props: {
       label: {
@@ -465,7 +465,7 @@
             name: __props.icon,
             size: __props.size,
             color: computedIconColor.value
-          }, null, 8, ["name", "size", "color"])) : (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$c), {
+          }, null, 8, ["name", "size", "color"])) : (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$d), {
             key: 1,
             type: "circle1",
             color: computedIconColor.value || "#000",
@@ -473,12 +473,12 @@
             size: __props.size,
             speed: 0.8
           }, null, 8, ["color", "secondaryColor", "size"]))
-        ], 14, _hoisted_1$e);
+        ], 14, _hoisted_1$f);
       };
     }
   });
 
-  const HpButtonIcon = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-8cf8a123"]]);
+  const HpButtonIcon = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-8cf8a123"]]);
 
   var ButtonLetterSize = /* @__PURE__ */ ((ButtonLetterSize2) => {
     ButtonLetterSize2["SMALL"] = "sm";
@@ -487,9 +487,9 @@
     return ButtonLetterSize2;
   })(ButtonLetterSize || {});
 
-  const _hoisted_1$d = ["aria-label", "aria-disabled", "disabled", "tabindex"];
-  const _hoisted_2$d = { key: 0 };
-  const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
+  const _hoisted_1$e = ["aria-label", "aria-disabled", "disabled", "tabindex"];
+  const _hoisted_2$e = { key: 0 };
+  const _sfc_main$g = /* @__PURE__ */ vue.defineComponent({
     __name: "ButtonLetter",
     props: {
       label: {
@@ -572,7 +572,7 @@
             color: computedLetterColor.value
           })
         }, [
-          !__props.isLoading ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$d, vue.toDisplayString(__props.letter), 1)) : (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$c), {
+          !__props.isLoading ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$e, vue.toDisplayString(__props.letter), 1)) : (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$d), {
             key: 1,
             type: "circle1",
             color: computedLetterColor.value || "var(--color-primary)",
@@ -580,12 +580,12 @@
             size: __props.size,
             speed: 0.8
           }, null, 8, ["color", "secondaryColor", "size"]))
-        ], 14, _hoisted_1$d);
+        ], 14, _hoisted_1$e);
       };
     }
   });
 
-  const ButtonLetter = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-13b75270"]]);
+  const ButtonLetter = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-13b75270"]]);
 
   var AlertType = /* @__PURE__ */ ((AlertType2) => {
     AlertType2["WARNING"] = "warning";
@@ -595,9 +595,9 @@
     return AlertType2;
   })(AlertType || {});
 
-  const _hoisted_1$c = { class: "alert" };
-  const _hoisted_2$c = { class: "alert__container__message" };
-  const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
+  const _hoisted_1$d = { class: "alert" };
+  const _hoisted_2$d = { class: "alert__container__message" };
+  const _sfc_main$f = /* @__PURE__ */ vue.defineComponent({
     __name: "Alert",
     props: {
       message: {
@@ -660,7 +660,7 @@
         return props.type;
       });
       return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("section", _hoisted_1$c, [
+        return vue.openBlock(), vue.createElementBlock("section", _hoisted_1$d, [
           vue.createElementVNode("div", {
             class: "alert__container",
             style: vue.normalizeStyle({
@@ -668,7 +668,7 @@
               "--color": computedColorType.value
             })
           }, [
-            vue.createElementVNode("p", _hoisted_2$c, vue.toDisplayString(__props.message), 1),
+            vue.createElementVNode("p", _hoisted_2$d, vue.toDisplayString(__props.message), 1),
             vue.createVNode(vue.unref(HpButtonIcon), {
               class: "alert__container__icon",
               label: "Fechar modal",
@@ -684,18 +684,18 @@
     }
   });
 
-  const Alert = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-10dcca72"]]);
+  const Alert = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-10dcca72"]]);
 
-  const _hoisted_1$b = {
+  const _hoisted_1$c = {
     key: 0,
     class: "card__header"
   };
-  const _hoisted_2$b = { class: "card__body" };
-  const _hoisted_3$b = {
+  const _hoisted_2$c = { class: "card__body" };
+  const _hoisted_3$c = {
     key: 1,
     class: "card__footer"
   };
-  const _sfc_main$d = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$e = /* @__PURE__ */ vue.defineComponent({
     __name: "Card",
     props: {
       title: { type: String, default: "" },
@@ -717,10 +717,10 @@
           "aria-labelledby": titleId,
           "aria-describedby": descriptionId
         }, [
-          _ctx.$slots.header ? (vue.openBlock(), vue.createElementBlock("header", _hoisted_1$b, [
+          _ctx.$slots.header ? (vue.openBlock(), vue.createElementBlock("header", _hoisted_1$c, [
             vue.renderSlot(_ctx.$slots, "header", {}, void 0, true)
           ])) : vue.createCommentVNode("", true),
-          vue.createElementVNode("div", _hoisted_2$b, [
+          vue.createElementVNode("div", _hoisted_2$c, [
             __props.title ? (vue.openBlock(), vue.createElementBlock("h3", {
               key: 0,
               id: titleId,
@@ -733,7 +733,7 @@
             }, vue.toDisplayString(__props.description), 1)) : vue.createCommentVNode("", true),
             vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
           ]),
-          _ctx.$slots.footer ? (vue.openBlock(), vue.createElementBlock("footer", _hoisted_3$b, [
+          _ctx.$slots.footer ? (vue.openBlock(), vue.createElementBlock("footer", _hoisted_3$c, [
             vue.renderSlot(_ctx.$slots, "footer", {}, void 0, true)
           ])) : vue.createCommentVNode("", true)
         ], 2);
@@ -741,7 +741,7 @@
     }
   });
 
-  const Card = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-2b489100"]]);
+  const Card = /* @__PURE__ */ _export_sfc(_sfc_main$e, [["__scopeId", "data-v-2b489100"]]);
 
   var SpinnerLoaderSize = /* @__PURE__ */ ((SpinnerLoaderSize2) => {
     SpinnerLoaderSize2["SMALL"] = "sm";
@@ -750,35 +750,35 @@
     return SpinnerLoaderSize2;
   })(SpinnerLoaderSize || {});
 
-  const _hoisted_1$a = {
+  const _hoisted_1$b = {
     key: 0,
     class: "spinner-circle-1"
   };
-  const _hoisted_2$a = {
+  const _hoisted_2$b = {
     key: 1,
     class: "spinner-circle-2"
   };
-  const _hoisted_3$a = {
+  const _hoisted_3$b = {
     key: 2,
     class: "spinner-circle-3"
   };
-  const _hoisted_4$7 = {
+  const _hoisted_4$8 = {
     key: 3,
     class: "spinner-circle-4"
   };
-  const _hoisted_5$7 = {
+  const _hoisted_5$8 = {
     key: 4,
     class: "spinner-dot-1"
   };
-  const _hoisted_6$4 = {
+  const _hoisted_6$5 = {
     key: 5,
     class: "spinner-dot-2"
   };
-  const _hoisted_7$4 = {
+  const _hoisted_7$5 = {
     key: 6,
     class: "spinner-dot-3"
   };
-  const _hoisted_8$4 = {
+  const _hoisted_8$5 = {
     key: 7,
     class: "spinner-dot-4"
   };
@@ -814,7 +814,7 @@
     key: 15,
     class: "spinner-search"
   };
-  const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$d = /* @__PURE__ */ vue.defineComponent({
     __name: "SpinnerLoader",
     props: {
       type: {
@@ -864,11 +864,11 @@
           class: vue.normalizeClass(["spinner-loader", `spinner-${__props.type}`]),
           style: vue.normalizeStyle(spinnerStyles.value)
         }, [
-          __props.type === "circle1" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$a)) : vue.createCommentVNode("", true),
-          __props.type === "circle2" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$a)) : vue.createCommentVNode("", true),
-          __props.type === "circle3" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$a)) : vue.createCommentVNode("", true),
-          __props.type === "circle4" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$7)) : vue.createCommentVNode("", true),
-          __props.type === "dot1" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$7, [
+          __props.type === "circle1" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b)) : vue.createCommentVNode("", true),
+          __props.type === "circle2" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$b)) : vue.createCommentVNode("", true),
+          __props.type === "circle3" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$b)) : vue.createCommentVNode("", true),
+          __props.type === "circle4" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$8)) : vue.createCommentVNode("", true),
+          __props.type === "dot1" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$8, [
             (vue.openBlock(), vue.createElementBlock(vue.Fragment, null, vue.renderList(3, (i) => {
               return vue.createElementVNode("div", {
                 key: `dot1-${i}`,
@@ -876,16 +876,16 @@
               });
             }), 64))
           ])) : vue.createCommentVNode("", true),
-          __props.type === "dot2" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$4)) : vue.createCommentVNode("", true),
-          __props.type === "dot3" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$4)) : vue.createCommentVNode("", true),
-          __props.type === "dot4" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_8$4)) : vue.createCommentVNode("", true),
+          __props.type === "dot2" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$5)) : vue.createCommentVNode("", true),
+          __props.type === "dot3" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7$5)) : vue.createCommentVNode("", true),
+          __props.type === "dot4" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_8$5)) : vue.createCommentVNode("", true),
           __props.type === "dot5" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_9$3)) : vue.createCommentVNode("", true),
           __props.type === "ring1" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_10$3)) : vue.createCommentVNode("", true),
           __props.type === "ring2" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_11$1)) : vue.createCommentVNode("", true),
           __props.type === "ring3" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12$1)) : vue.createCommentVNode("", true),
-          __props.type === "clock" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_13$1, _cache[0] || (_cache[0] = [
+          __props.type === "clock" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_13$1, [..._cache[0] || (_cache[0] = [
             vue.createElementVNode("div", { class: "clock-hand" }, null, -1)
-          ]))) : vue.createCommentVNode("", true),
+          ])])) : vue.createCommentVNode("", true),
           __props.type === "reload" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14$1)) : vue.createCommentVNode("", true),
           __props.type === "engine" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_15$1)) : vue.createCommentVNode("", true),
           __props.type === "search" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_16$1)) : vue.createCommentVNode("", true)
@@ -894,13 +894,13 @@
     }
   });
 
-  const _hoisted_1$9 = ["for"];
-  const _hoisted_2$9 = ["id", "checked", "disabled"];
-  const _hoisted_3$9 = {
+  const _hoisted_1$a = ["for"];
+  const _hoisted_2$a = ["id", "checked", "disabled"];
+  const _hoisted_3$a = {
     key: 0,
     class: "checkbox__label"
   };
-  const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$c = /* @__PURE__ */ vue.defineComponent({
     __name: "Checkbox",
     props: {
       modelValue: {
@@ -986,7 +986,7 @@
             checked: isChecked.value,
             disabled: __props.disabled,
             onChange: handleChange
-          }, null, 40, _hoisted_2$9),
+          }, null, 40, _hoisted_2$a),
           vue.createElementVNode("span", {
             class: vue.normalizeClass(["checkbox__container", { "checkbox__container--rounded": __props.rounded }]),
             style: vue.normalizeStyle({ "--background-color": computedBackgroundColor.value })
@@ -1000,27 +1000,27 @@
               width: "12px",
               height: "9px",
               viewBox: "0 0 12 9"
-            }, _cache[0] || (_cache[0] = [
+            }, [..._cache[0] || (_cache[0] = [
               vue.createElementVNode("polyline", { points: "1 5 4 8 11 1" }, null, -1)
-            ]), 6)) : vue.createCommentVNode("", true)
+            ])], 6)) : vue.createCommentVNode("", true)
           ], 6),
-          _ctx.$slots.default ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$9, [
+          _ctx.$slots.default ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$a, [
             vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
           ])) : vue.createCommentVNode("", true)
-        ], 14, _hoisted_1$9);
+        ], 14, _hoisted_1$a);
       };
     }
   });
 
-  const Checkbox = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-29384d40"]]);
+  const Checkbox = /* @__PURE__ */ _export_sfc(_sfc_main$c, [["__scopeId", "data-v-29384d40"]]);
 
-  const _hoisted_1$8 = ["for"];
-  const _hoisted_2$8 = ["id", "checked", "disabled", "value"];
-  const _hoisted_3$8 = {
+  const _hoisted_1$9 = ["for"];
+  const _hoisted_2$9 = ["id", "checked", "disabled", "value"];
+  const _hoisted_3$9 = {
     key: 0,
     class: "radio__label"
   };
-  const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$b = /* @__PURE__ */ vue.defineComponent({
     __name: "RadioButton",
     props: {
       modelValue: {
@@ -1102,7 +1102,7 @@
             disabled: __props.disabled,
             value: __props.value,
             onChange: handleChange
-          }, null, 40, _hoisted_2$8),
+          }, null, 40, _hoisted_2$9),
           vue.createElementVNode("span", {
             class: vue.normalizeClass(["radio__container", { "radio__container--rounded": __props.rounded }])
           }, [
@@ -1111,15 +1111,15 @@
               class: vue.normalizeClass(["radio__dot", { "radio__dot--animated": __props.hasAnimation }])
             }, null, 2)) : vue.createCommentVNode("", true)
           ], 2),
-          _ctx.$slots.default ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$8, [
+          _ctx.$slots.default ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$9, [
             vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
           ])) : vue.createCommentVNode("", true)
-        ], 14, _hoisted_1$8);
+        ], 14, _hoisted_1$9);
       };
     }
   });
 
-  const RadioButton = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-50110fea"]]);
+  const RadioButton = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-50110fea"]]);
 
   var TextSize = /* @__PURE__ */ ((TextSize2) => {
     TextSize2["EXTRA_SMALL"] = "xs";
@@ -1140,7 +1140,7 @@
     return HeadingLevel2;
   })(HeadingLevel || {});
 
-  const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$a = /* @__PURE__ */ vue.defineComponent({
     __name: "Text",
     props: {
       size: {
@@ -1171,9 +1171,9 @@
     }
   });
 
-  const Text = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-e52f8226"]]);
+  const HpText = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-e52f8226"]]);
 
-  const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$9 = /* @__PURE__ */ vue.defineComponent({
     __name: "Heading",
     props: {
       level: {
@@ -1211,20 +1211,20 @@
     }
   });
 
-  const Heading = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-35210bc7"]]);
+  const Heading = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-35210bc7"]]);
 
-  const _hoisted_1$7 = { class: "modal__header" };
-  const _hoisted_2$7 = { class: "modal__title" };
-  const _hoisted_3$7 = { class: "modal__content" };
-  const _hoisted_4$6 = {
+  const _hoisted_1$8 = { class: "modal__header" };
+  const _hoisted_2$8 = { class: "modal__title" };
+  const _hoisted_3$8 = { class: "modal__content" };
+  const _hoisted_4$7 = {
     key: 0,
     class: "modal__footer"
   };
-  const _hoisted_5$6 = {
+  const _hoisted_5$7 = {
     key: 1,
     class: "modal__footer"
   };
-  const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$8 = /* @__PURE__ */ vue.defineComponent({
     __name: "Modal",
     props: {
       title: {
@@ -1303,7 +1303,7 @@
               vue.createElementVNode("div", {
                 class: vue.normalizeClass(["modal__container", [`modal__container--${__props.size}`]])
               }, [
-                vue.createElementVNode("div", _hoisted_1$7, [
+                vue.createElementVNode("div", _hoisted_1$8, [
                   __props.showBackButton ? (vue.openBlock(), vue.createBlock(vue.unref(HpButtonIcon), {
                     key: 0,
                     class: "modal__back-button",
@@ -1312,7 +1312,7 @@
                     label: "Botão de voltar",
                     onClick: handleBackClick
                   })) : vue.createCommentVNode("", true),
-                  vue.createElementVNode("h2", _hoisted_2$7, vue.toDisplayString(__props.title), 1),
+                  vue.createElementVNode("h2", _hoisted_2$8, vue.toDisplayString(__props.title), 1),
                   __props.showCloseButton ? (vue.openBlock(), vue.createBlock(vue.unref(HpButtonIcon), {
                     key: 1,
                     class: "modal__close-button",
@@ -1322,10 +1322,10 @@
                     onClick: handleCloseModal
                   })) : vue.createCommentVNode("", true)
                 ]),
-                vue.createElementVNode("div", _hoisted_3$7, [
+                vue.createElementVNode("div", _hoisted_3$8, [
                   vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
                 ]),
-                __props.hasPrimaryButton || __props.hasSecondaryButton ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$6, [
+                __props.hasPrimaryButton || __props.hasSecondaryButton ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$7, [
                   __props.hasSecondaryButton ? (vue.openBlock(), vue.createBlock(vue.unref(HpButtonSecondary), {
                     key: 0,
                     label: __props.secondaryButtonLabel,
@@ -1339,7 +1339,7 @@
                     onClick: handleSecondaryButtonClick
                   }, null, 8, ["label", "backgroundColor"])) : vue.createCommentVNode("", true)
                 ])) : vue.createCommentVNode("", true),
-                !__props.hasPrimaryButton && !__props.hasSecondaryButton && _ctx.$slots.buttons ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$6, [
+                !__props.hasPrimaryButton && !__props.hasSecondaryButton && _ctx.$slots.buttons ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$7, [
                   vue.renderSlot(_ctx.$slots, "buttons", {}, void 0, true)
                 ])) : vue.createCommentVNode("", true)
               ], 2)
@@ -1351,15 +1351,15 @@
     }
   });
 
-  const Modal = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-cdf63c2b"]]);
+  const Modal = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-cdf63c2b"]]);
 
-  const _hoisted_1$6 = ["id", "checked", "disabled", "aria-checked", "aria-labelledby"];
-  const _hoisted_2$6 = ["for", "id", "tabindex", "onKeydown"];
-  const _hoisted_3$6 = {
+  const _hoisted_1$7 = ["id", "checked", "disabled", "aria-checked", "aria-labelledby"];
+  const _hoisted_2$7 = ["for", "id", "tabindex", "onKeydown"];
+  const _hoisted_3$7 = {
     key: 0,
     class: "toggle-switch__text"
   };
-  const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$7 = /* @__PURE__ */ vue.defineComponent({
     __name: "ToggleSwitch",
     props: {
       modelValue: {
@@ -1424,7 +1424,7 @@
             "aria-checked": __props.modelValue,
             "aria-labelledby": `${__props.id}-label`,
             tabindex: "-1"
-          }, null, 40, _hoisted_1$6),
+          }, null, 40, _hoisted_1$7),
           vue.createElementVNode("label", {
             for: __props.id,
             class: "toggle-switch__label",
@@ -1445,28 +1445,28 @@
                 style: vue.normalizeStyle({ "--thumb-color": computedThumbColor.value })
               }, null, 4)
             ], 4),
-            _ctx.$slots.default ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$6, [
+            _ctx.$slots.default ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$7, [
               vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
             ])) : vue.createCommentVNode("", true)
-          ], 44, _hoisted_2$6)
+          ], 44, _hoisted_2$7)
         ], 2);
       };
     }
   });
 
-  const ToggleSwitch = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-14c54b46"]]);
+  const ToggleSwitch = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-14c54b46"]]);
 
-  const _hoisted_1$5 = { key: 0 };
-  const _hoisted_2$5 = ["aria-checked", "onKeydown"];
-  const _hoisted_3$5 = {
+  const _hoisted_1$6 = { key: 0 };
+  const _hoisted_2$6 = ["aria-checked", "onKeydown"];
+  const _hoisted_3$6 = {
     key: 1,
     class: "theme-switcher-animation"
   };
-  const _hoisted_4$5 = ["id", "aria-checked"];
-  const _hoisted_5$5 = ["for", "onKeydown"];
+  const _hoisted_4$6 = ["id", "aria-checked"];
+  const _hoisted_5$6 = ["for", "onKeydown"];
 
 
-  const _sfc_main$5 = {
+  const _sfc_main$6 = {
     __name: 'ThemeSwitcher',
     props: {
     modelValue: {
@@ -1578,7 +1578,7 @@
 
   return (_ctx, _cache) => {
     return (!__props.hasAnimation)
-      ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$5, [
+      ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$6, [
           vue.createElementVNode("button", {
             class: "theme-switcher",
             type: "button",
@@ -1601,9 +1601,9 @@
               size: "sm",
               color: computedButtonIconColor.value
             }, null, 8, ["name", "color"])
-          ], 44, _hoisted_2$5)
+          ], 44, _hoisted_2$6)
         ]))
-      : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$5, [
+      : (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$6, [
           vue.withDirectives(vue.createElementVNode("input", {
             type: "checkbox",
             id: __props.id,
@@ -1614,7 +1614,7 @@
             "aria-checked": isDarkMode.value,
             "aria-label": "Alternar entre tema claro e escuro",
             tabindex: "-1"
-          }, null, 40, _hoisted_4$5), [
+          }, null, 40, _hoisted_4$6), [
             [vue.vModelCheckbox, isDarkMode.value]
           ]),
           vue.createElementVNode("label", {
@@ -1631,33 +1631,33 @@
               vue.withKeys(vue.withModifiers(handleToggle, ["prevent"]), ["enter"]),
               vue.withKeys(vue.withModifiers(handleToggle, ["prevent"]), ["space"])
             ]
-          }, _cache[1] || (_cache[1] = [
+          }, [...(_cache[1] || (_cache[1] = [
             vue.createElementVNode("span", { class: "toggle--label-background" }, null, -1)
-          ]), 44, _hoisted_5$5)
+          ]))], 44, _hoisted_5$6)
         ]))
   }
   }
 
   };
-  const ThemeSwitcher = /*#__PURE__*/_export_sfc(_sfc_main$5, [['__scopeId',"data-v-7efca676"]]);
+  const ThemeSwitcher = /*#__PURE__*/_export_sfc(_sfc_main$6, [['__scopeId',"data-v-7efca676"]]);
 
-  const _hoisted_1$4 = { class: "input__fieldset" };
-  const _hoisted_2$4 = {
+  const _hoisted_1$5 = { class: "input__fieldset" };
+  const _hoisted_2$5 = {
     style: {"display":"none"},
     "aria-hidden": true
   };
-  const _hoisted_3$4 = ["for"];
-  const _hoisted_4$4 = { class: "input__wrapper" };
-  const _hoisted_5$4 = ["id", "value", "readonly", "aria-readonly", "disabled", "placeholder", "required", "maxlength", "aria-labelledby", "aria-describedby", "aria-invalid"];
-  const _hoisted_6$3 = { class: "input__footer" };
-  const _hoisted_7$3 = ["id"];
-  const _hoisted_8$3 = {
+  const _hoisted_3$5 = ["for"];
+  const _hoisted_4$5 = { class: "input__wrapper" };
+  const _hoisted_5$5 = ["id", "value", "readonly", "aria-readonly", "disabled", "placeholder", "required", "maxlength", "aria-labelledby", "aria-describedby", "aria-invalid"];
+  const _hoisted_6$4 = { class: "input__footer" };
+  const _hoisted_7$4 = ["id"];
+  const _hoisted_8$4 = {
     key: 1,
     class: "input__counter"
   };
 
 
-  const _sfc_main$4 = {
+  const _sfc_main$5 = {
     __name: 'InputText',
     props: {
     modelValue: {
@@ -1784,16 +1784,16 @@
         '--icon-padding-right': __props.trailingIcon ? '32px' : '0px'
       })
     }, [
-      vue.createElementVNode("fieldset", _hoisted_1$4, [
-        vue.createElementVNode("legend", _hoisted_2$4, vue.toDisplayString(__props.label), 1),
+      vue.createElementVNode("fieldset", _hoisted_1$5, [
+        vue.createElementVNode("legend", _hoisted_2$5, vue.toDisplayString(__props.label), 1),
         (isFocused.value || __props.modelValue !== '' || __props.placeholder !== '')
           ? (vue.openBlock(), vue.createElementBlock("label", {
               key: 0,
               for: __props.id,
               class: vue.normalizeClass(["input__label", { 'input__label--required': __props.required }])
-            }, vue.toDisplayString(__props.label), 11, _hoisted_3$4))
+            }, vue.toDisplayString(__props.label), 11, _hoisted_3$5))
           : vue.createCommentVNode("", true),
-        vue.createElementVNode("div", _hoisted_4$4, [
+        vue.createElementVNode("div", _hoisted_4$5, [
           (__props.leadingIcon)
             ? (vue.openBlock(), vue.createBlock(vue.unref(HpIcon), {
                 key: 0,
@@ -1822,7 +1822,7 @@
             "aria-labelledby": `${__props.id}-label`,
             "aria-describedby": __props.helperText ? `${__props.id}-helper-text` : undefined,
             "aria-invalid": __props.status === 'error'
-          }, null, 40, _hoisted_5$4),
+          }, null, 40, _hoisted_5$5),
           (__props.iconHasAction && __props.trailingIcon)
             ? (vue.openBlock(), vue.createBlock(vue.unref(HpButtonIcon), {
                 key: 1,
@@ -1846,16 +1846,16 @@
               : vue.createCommentVNode("", true)
         ])
       ]),
-      vue.createElementVNode("div", _hoisted_6$3, [
+      vue.createElementVNode("div", _hoisted_6$4, [
         (__props.helperText)
           ? (vue.openBlock(), vue.createElementBlock("span", {
               key: 0,
               id: `${__props.id}-helper-text`,
               class: vue.normalizeClass(["input__helper-text", { [`input__helper-text--${__props.status}`]: __props.status !== 'default' }])
-            }, vue.toDisplayString(__props.helperText), 11, _hoisted_7$3))
+            }, vue.toDisplayString(__props.helperText), 11, _hoisted_7$4))
           : vue.createCommentVNode("", true),
         (__props.hasLengthCount)
-          ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_8$3, vue.toDisplayString(__props.modelValue?.length || 0) + "/" + vue.toDisplayString(__props.maxLength), 1))
+          ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_8$4, vue.toDisplayString(__props.modelValue?.length || 0) + "/" + vue.toDisplayString(__props.maxLength), 1))
           : vue.createCommentVNode("", true)
       ])
     ], 6))
@@ -1863,24 +1863,24 @@
   }
 
   };
-  const InputText = /*#__PURE__*/_export_sfc(_sfc_main$4, [['__scopeId',"data-v-6450d99a"]]);
+  const HpInputText = /*#__PURE__*/_export_sfc(_sfc_main$5, [['__scopeId',"data-v-6450d99a"]]);
 
-  const _hoisted_1$3 = { class: "input__fieldset" };
-  const _hoisted_2$3 = {
+  const _hoisted_1$4 = { class: "input__fieldset" };
+  const _hoisted_2$4 = {
     style: {"display":"none"},
     "aria-hidden": true
   };
-  const _hoisted_3$3 = ["for"];
-  const _hoisted_4$3 = { class: "input__wrapper" };
-  const _hoisted_5$3 = ["id", "value", "readonly", "aria-readonly", "disabled", "placeholder", "required", "min", "max", "aria-labelledby", "aria-describedby", "aria-invalid"];
-  const _hoisted_6$2 = { class: "input__buttons-container" };
-  const _hoisted_7$2 = ["disabled", "aria-label"];
-  const _hoisted_8$2 = ["disabled", "aria-label"];
+  const _hoisted_3$4 = ["for"];
+  const _hoisted_4$4 = { class: "input__wrapper" };
+  const _hoisted_5$4 = ["id", "value", "readonly", "aria-readonly", "disabled", "placeholder", "required", "min", "max", "aria-labelledby", "aria-describedby", "aria-invalid"];
+  const _hoisted_6$3 = { class: "input__buttons-container" };
+  const _hoisted_7$3 = ["disabled", "aria-label"];
+  const _hoisted_8$3 = ["disabled", "aria-label"];
   const _hoisted_9$2 = { class: "input__footer" };
   const _hoisted_10$2 = ["id"];
 
 
-  const _sfc_main$3 = {
+  const _sfc_main$4 = {
     __name: 'InputNumber',
     props: {
     modelValue: {
@@ -2046,16 +2046,16 @@
         '--icon-padding-left': __props.leadingIcon ? '24px' : '0px'
       })
     }, [
-      vue.createElementVNode("fieldset", _hoisted_1$3, [
-        vue.createElementVNode("legend", _hoisted_2$3, vue.toDisplayString(__props.label), 1),
+      vue.createElementVNode("fieldset", _hoisted_1$4, [
+        vue.createElementVNode("legend", _hoisted_2$4, vue.toDisplayString(__props.label), 1),
         (isFocused.value || modelValueFormatted.value !== null || __props.placeholder !== '')
           ? (vue.openBlock(), vue.createElementBlock("label", {
               key: 0,
               for: __props.id,
               class: vue.normalizeClass(["input__label", { 'input__label--required': __props.required }])
-            }, vue.toDisplayString(__props.label), 11, _hoisted_3$3))
+            }, vue.toDisplayString(__props.label), 11, _hoisted_3$4))
           : vue.createCommentVNode("", true),
-        vue.createElementVNode("div", _hoisted_4$3, [
+        vue.createElementVNode("div", _hoisted_4$4, [
           (__props.leadingIcon)
             ? (vue.openBlock(), vue.createBlock(vue.unref(HpIcon), {
                 key: 0,
@@ -2086,8 +2086,8 @@
             "aria-labelledby": `${__props.id}-label`,
             "aria-describedby": __props.helperText ? `${__props.id}-helper-text` : undefined,
             "aria-invalid": __props.status === 'error'
-          }, null, 40, _hoisted_5$3),
-          vue.createElementVNode("div", _hoisted_6$2, [
+          }, null, 40, _hoisted_5$4),
+          vue.createElementVNode("div", _hoisted_6$3, [
             vue.createElementVNode("button", {
               type: "button",
               disabled: __props.disabled || __props.readonly || isMinValue.value,
@@ -2100,7 +2100,7 @@
                 size: "sm",
                 color: "#666666"
               })
-            ], 8, _hoisted_7$2),
+            ], 8, _hoisted_7$3),
             _cache[0] || (_cache[0] = vue.createElementVNode("div", { class: "input__buttons-container--divider" }, null, -1)),
             vue.createElementVNode("button", {
               type: "button",
@@ -2114,7 +2114,7 @@
                 size: "sm",
                 color: "#666666"
               })
-            ], 8, _hoisted_8$2)
+            ], 8, _hoisted_8$3)
           ])
         ])
       ]),
@@ -2132,25 +2132,25 @@
   }
 
   };
-  const InputNumber = /*#__PURE__*/_export_sfc(_sfc_main$3, [['__scopeId',"data-v-7f20743b"]]);
+  const InputNumber = /*#__PURE__*/_export_sfc(_sfc_main$4, [['__scopeId',"data-v-7f20743b"]]);
 
-  const _hoisted_1$2 = { class: "input__fieldset" };
-  const _hoisted_2$2 = {
+  const _hoisted_1$3 = { class: "input__fieldset" };
+  const _hoisted_2$3 = {
     style: {"display":"none"},
     "aria-hidden": true
   };
-  const _hoisted_3$2 = ["for", "id"];
-  const _hoisted_4$2 = {
+  const _hoisted_3$3 = ["for", "id"];
+  const _hoisted_4$3 = {
     key: 0,
     class: "required-asterisk"
   };
-  const _hoisted_5$2 = { class: "input__wrapper" };
-  const _hoisted_6$1 = {
+  const _hoisted_5$3 = { class: "input__wrapper" };
+  const _hoisted_6$2 = {
     key: 0,
     class: "autocomplete-wrapper"
   };
-  const _hoisted_7$1 = ["id", "placeholder", "disabled", "readonly", "required", "aria-labelledby", "aria-describedby", "aria-invalid", "aria-disabled", "aria-expanded", "aria-activedescendant"];
-  const _hoisted_8$1 = ["aria-labelledby"];
+  const _hoisted_7$2 = ["id", "placeholder", "disabled", "readonly", "required", "aria-labelledby", "aria-describedby", "aria-invalid", "aria-disabled", "aria-expanded", "aria-activedescendant"];
+  const _hoisted_8$2 = ["aria-labelledby"];
   const _hoisted_9$1 = ["id", "onMousedown", "aria-selected", "aria-disabled"];
   const _hoisted_10$1 = ["aria-expanded", "aria-owns"];
   const _hoisted_11 = ["id", "tabindex", "aria-labelledby", "aria-describedby", "aria-invalid", "aria-disabled"];
@@ -2172,7 +2172,7 @@
   };
 
 
-  const _sfc_main$2 = {
+  const _sfc_main$3 = {
     __name: 'InputSelect',
     props: {
     modelValue: {
@@ -2456,8 +2456,8 @@
       ref_key: "select",
       ref: select
     }, [
-      vue.createElementVNode("fieldset", _hoisted_1$2, [
-        vue.createElementVNode("legend", _hoisted_2$2, vue.toDisplayString(__props.label), 1),
+      vue.createElementVNode("fieldset", _hoisted_1$3, [
+        vue.createElementVNode("legend", _hoisted_2$3, vue.toDisplayString(__props.label), 1),
         (__props.modelValue !== null || __props.placeholder !== '')
           ? (vue.openBlock(), vue.createElementBlock("label", {
               key: 0,
@@ -2467,13 +2467,13 @@
             }, [
               vue.createTextVNode(vue.toDisplayString(__props.label) + " ", 1),
               (__props.required)
-                ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$2, "*"))
+                ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$3, "*"))
                 : vue.createCommentVNode("", true)
-            ], 10, _hoisted_3$2))
+            ], 10, _hoisted_3$3))
           : vue.createCommentVNode("", true),
-        vue.createElementVNode("div", _hoisted_5$2, [
+        vue.createElementVNode("div", _hoisted_5$3, [
           (__props.autocomplete)
-            ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$1, [
+            ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$2, [
                 vue.withDirectives(vue.createElementVNode("input", {
                   id: __props.id,
                   "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => ((searchText).value = $event)),
@@ -2503,7 +2503,7 @@
               ,
                   role: "combobox",
                   "aria-autocomplete": "list"
-                }, null, 40, _hoisted_7$1), [
+                }, null, 40, _hoisted_7$2), [
                   [vue.vModelText, searchText.value]
                 ]),
                 vue.createVNode(vue.unref(HpIcon), {
@@ -2533,7 +2533,7 @@
                       "aria-disabled": option.disabled
                     }, vue.toDisplayString(option.label), 43, _hoisted_9$1))
                   }), 128))
-                ], 12, _hoisted_8$1), [
+                ], 12, _hoisted_8$2), [
                   [vue.vShow, isOpen.value && filteredOptions.value.length > 0]
                 ])
               ]))
@@ -2659,22 +2659,22 @@
   }
 
   };
-  const InputSelect = /*#__PURE__*/_export_sfc(_sfc_main$2, [['__scopeId',"data-v-00cdf827"]]);
+  const InputSelect = /*#__PURE__*/_export_sfc(_sfc_main$3, [['__scopeId',"data-v-00cdf827"]]);
 
-  const _hoisted_1$1 = { class: "input-range__fieldset" };
-  const _hoisted_2$1 = {
+  const _hoisted_1$2 = { class: "input-range__fieldset" };
+  const _hoisted_2$2 = {
     key: 0,
     class: "input-range__legend"
   };
-  const _hoisted_3$1 = {
+  const _hoisted_3$2 = {
     key: 0,
     class: "input-range__required"
   };
-  const _hoisted_4$1 = { class: "input-range__wrapper" };
-  const _hoisted_5$1 = ["id", "min", "max", "step", "value", "disabled", "aria-valuemin", "aria-valuemax", "aria-valuenow", "aria-labelledby", "aria-describedby"];
-  const _hoisted_6 = { class: "input-range__value-display" };
-  const _hoisted_7 = { class: "input-range__value" };
-  const _hoisted_8 = {
+  const _hoisted_4$2 = { class: "input-range__wrapper" };
+  const _hoisted_5$2 = ["id", "min", "max", "step", "value", "disabled", "aria-valuemin", "aria-valuemax", "aria-valuenow", "aria-labelledby", "aria-describedby"];
+  const _hoisted_6$1 = { class: "input-range__value-display" };
+  const _hoisted_7$1 = { class: "input-range__value" };
+  const _hoisted_8$1 = {
     key: 0,
     class: "input-range__unit"
   };
@@ -2685,7 +2685,7 @@
   const _hoisted_10 = ["id"];
 
 
-  const _sfc_main$1 = {
+  const _sfc_main$2 = {
     __name: 'InputRange',
     props: {
     modelValue: {
@@ -2768,16 +2768,16 @@
         [`input-range--${__props.status}`]: __props.status !== 'default'
       }])
     }, [
-      vue.createElementVNode("fieldset", _hoisted_1$1, [
+      vue.createElementVNode("fieldset", _hoisted_1$2, [
         (__props.label)
-          ? (vue.openBlock(), vue.createElementBlock("legend", _hoisted_2$1, [
+          ? (vue.openBlock(), vue.createElementBlock("legend", _hoisted_2$2, [
               vue.createTextVNode(vue.toDisplayString(__props.label) + " ", 1),
               (__props.required)
-                ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$1, "*"))
+                ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$2, "*"))
                 : vue.createCommentVNode("", true)
             ]))
           : vue.createCommentVNode("", true),
-        vue.createElementVNode("div", _hoisted_4$1, [
+        vue.createElementVNode("div", _hoisted_4$2, [
           vue.createElementVNode("input", {
             id: __props.id,
             ref_key: "input",
@@ -2796,11 +2796,11 @@
             "aria-valuenow": __props.modelValue,
             "aria-labelledby": `${__props.id}-label`,
             "aria-describedby": __props.helperText ? `${__props.id}-helper` : undefined
-          }, null, 40, _hoisted_5$1),
-          vue.createElementVNode("div", _hoisted_6, [
-            vue.createElementVNode("span", _hoisted_7, vue.toDisplayString(__props.modelValue), 1),
+          }, null, 40, _hoisted_5$2),
+          vue.createElementVNode("div", _hoisted_6$1, [
+            vue.createElementVNode("span", _hoisted_7$1, vue.toDisplayString(__props.modelValue), 1),
             (__props.unit)
-              ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_8, vue.toDisplayString(__props.unit), 1))
+              ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_8$1, vue.toDisplayString(__props.unit), 1))
               : vue.createCommentVNode("", true)
           ])
         ])
@@ -2818,17 +2818,17 @@
   }
 
   };
-  const InputRange = /*#__PURE__*/_export_sfc(_sfc_main$1, [['__scopeId',"data-v-32e54a28"]]);
+  const InputRange = /*#__PURE__*/_export_sfc(_sfc_main$2, [['__scopeId',"data-v-32e54a28"]]);
 
-  const _hoisted_1 = { class: "progress-bar" };
-  const _hoisted_2 = {
+  const _hoisted_1$1 = { class: "progress-bar" };
+  const _hoisted_2$1 = {
     key: 0,
     class: "progress-bar__header"
   };
-  const _hoisted_3 = { class: "progress-bar__value" };
-  const _hoisted_4 = { class: "progress-bar__wrapper" };
-  const _hoisted_5 = ["value", "max", "aria-labelledby"];
-  const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  const _hoisted_3$1 = { class: "progress-bar__value" };
+  const _hoisted_4$1 = { class: "progress-bar__wrapper" };
+  const _hoisted_5$1 = ["value", "max", "aria-labelledby"];
+  const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
     __name: "ProgressBar",
     props: {
       label: {
@@ -2868,29 +2868,172 @@
         "--bar-color": props.barColor || "var(--color-danger, #b91c1c)"
       }));
       return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
-          __props.hasLabel ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
+        return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [
+          __props.hasLabel ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$1, [
             vue.createElementVNode("span", {
               class: "progress-bar__label",
               id: labelId
             }, vue.toDisplayString(__props.label), 1),
-            vue.createElementVNode("span", _hoisted_3, vue.toDisplayString(normalizedValue.value) + "% ", 1)
+            vue.createElementVNode("span", _hoisted_3$1, vue.toDisplayString(normalizedValue.value) + "% ", 1)
           ])) : vue.createCommentVNode("", true),
-          vue.createElementVNode("div", _hoisted_4, [
+          vue.createElementVNode("div", _hoisted_4$1, [
             vue.createElementVNode("progress", {
               class: "progress-bar__track",
               value: __props.value,
               max: __props.max,
               "aria-labelledby": __props.label ? labelId : void 0,
               style: vue.normalizeStyle(trackStyle.value)
-            }, null, 12, _hoisted_5)
+            }, null, 12, _hoisted_5$1)
           ])
         ]);
       };
     }
   });
 
-  const ProgressBar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-80b0b9cd"]]);
+  const ProgressBar = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-80b0b9cd"]]);
+
+  const _hoisted_1 = { class: "data-table__table" };
+  const _hoisted_2 = { class: "data-table__row" };
+  const _hoisted_3 = {
+    key: 0,
+    class: "data-table__header-cell data-table__header-cell--right"
+  };
+  const _hoisted_4 = { class: "data-table__body" };
+  const _hoisted_5 = {
+    key: 0,
+    class: "data-table__row"
+  };
+  const _hoisted_6 = ["colspan"];
+  const _hoisted_7 = ["data-label"];
+  const _hoisted_8 = {
+    key: 0,
+    class: "data-table__cell data-table__cell--actions"
+  };
+  const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+    __name: "DataTable",
+    props: {
+      searchable: {
+        type: Boolean,
+        default: true
+      },
+      placeholderSearch: {
+        type: String,
+        default: "Digite para buscar..."
+      },
+      hasRowLine: {
+        type: Boolean,
+        default: false
+      },
+      items: {
+        type: Array,
+        required: true
+      },
+      columns: {
+        type: Array,
+        required: true
+      }
+    },
+    setup(__props) {
+      const props = __props;
+      const search = vue.ref("");
+      const filteredItems = vue.computed(() => {
+        if (!search.value) return props.items;
+        return props.items.filter(
+          (item) => JSON.stringify(item).toLowerCase().includes(search.value.toLowerCase())
+        );
+      });
+      return (_ctx, _cache) => {
+        return vue.openBlock(), vue.createElementBlock("section", {
+          class: vue.normalizeClass(["data-table", { "data-table--has-row-line": __props.hasRowLine }]),
+          role: "region"
+        }, [
+          __props.searchable ? (vue.openBlock(), vue.createBlock(vue.unref(HpInputText), {
+            key: 0,
+            class: "data-table__search",
+            leadingIcon: "BE0090",
+            placeholder: __props.placeholderSearch,
+            "model-value": search.value,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => search.value = $event),
+            "aria-label": __props.placeholderSearch
+          }, null, 8, ["placeholder", "model-value", "aria-label"])) : vue.createCommentVNode("", true),
+          vue.createElementVNode("table", _hoisted_1, [
+            vue.createElementVNode("thead", null, [
+              vue.createElementVNode("tr", _hoisted_2, [
+                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.columns, (column, index) => {
+                  return vue.openBlock(), vue.createElementBlock("th", {
+                    key: index,
+                    class: vue.normalizeClass(["data-table__header-cell", {
+                      "data-table__header-cell--right": column.align === "right"
+                    }]),
+                    style: vue.normalizeStyle({ width: column.width })
+                  }, [
+                    vue.createVNode(vue.unref(HpText), null, {
+                      default: vue.withCtx(() => [
+                        vue.createTextVNode(vue.toDisplayString(column.label), 1)
+                      ]),
+                      _: 2
+                    }, 1024)
+                  ], 6);
+                }), 128)),
+                _ctx.$slots.actions ? (vue.openBlock(), vue.createElementBlock("th", _hoisted_3, [
+                  vue.createVNode(vue.unref(HpText), null, {
+                    default: vue.withCtx(() => [..._cache[1] || (_cache[1] = [
+                      vue.createTextVNode("Ações", -1)
+                    ])]),
+                    _: 1
+                  })
+                ])) : vue.createCommentVNode("", true)
+              ])
+            ]),
+            vue.createElementVNode("tbody", _hoisted_4, [
+              filteredItems.value.length === 0 ? (vue.openBlock(), vue.createElementBlock("tr", _hoisted_5, [
+                vue.createElementVNode("td", {
+                  class: "data-table__cell",
+                  colspan: __props.columns.length + (_ctx.$slots.actions ? 1 : 0),
+                  role: "status",
+                  "aria-live": "polite"
+                }, [
+                  vue.createVNode(vue.unref(HpText), null, {
+                    default: vue.withCtx(() => [..._cache[2] || (_cache[2] = [
+                      vue.createTextVNode("Nenhum resultado encontrado.", -1)
+                    ])]),
+                    _: 1
+                  })
+                ], 8, _hoisted_6)
+              ])) : (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 1 }, vue.renderList(filteredItems.value, (item, rowIndex) => {
+                return vue.openBlock(), vue.createElementBlock("tr", {
+                  key: rowIndex,
+                  class: "data-table__row"
+                }, [
+                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.columns, (column) => {
+                    return vue.openBlock(), vue.createElementBlock("td", {
+                      key: column.key,
+                      class: vue.normalizeClass(["data-table__cell", {
+                        "data-table__cell--right": column.align === "right"
+                      }]),
+                      "data-label": column.label
+                    }, [
+                      vue.createVNode(vue.unref(HpText), null, {
+                        default: vue.withCtx(() => [
+                          vue.createTextVNode(vue.toDisplayString(item[column.key]), 1)
+                        ]),
+                        _: 2
+                      }, 1024)
+                    ], 10, _hoisted_7);
+                  }), 128)),
+                  _ctx.$slots.actions ? (vue.openBlock(), vue.createElementBlock("td", _hoisted_8, [
+                    vue.renderSlot(_ctx.$slots, "actions", { item }, void 0, true)
+                  ])) : vue.createCommentVNode("", true)
+                ]);
+              }), 128))
+            ])
+          ])
+        ], 2);
+      };
+    }
+  });
+
+  const DataTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-5012aa82"]]);
 
   const components = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
     __proto__: null,
@@ -2902,17 +3045,18 @@
     HpButtonTertiary: ButtonTertiary,
     HpCard: Card,
     HpCheckbox: Checkbox,
+    HpDataTable: DataTable,
     HpHeading: Heading,
     HpIcon,
     HpInputNumber: InputNumber,
     HpInputRange: InputRange,
     HpInputSelect: InputSelect,
-    HpInputText: InputText,
+    HpInputText,
     HpModal: Modal,
     HpProgressBar: ProgressBar,
     HpRadioButton: RadioButton,
-    HpSpinnerLoader: _sfc_main$c,
-    HpText: Text,
+    HpSpinnerLoader: _sfc_main$d,
+    HpText,
     HpThemeSwitcher: ThemeSwitcher,
     HpToggleSwitch: ToggleSwitch
   }, Symbol.toStringTag, { value: 'Module' }));
@@ -2960,17 +3104,18 @@
   exports.HpButtonTertiary = ButtonTertiary;
   exports.HpCard = Card;
   exports.HpCheckbox = Checkbox;
+  exports.HpDataTable = DataTable;
   exports.HpHeading = Heading;
   exports.HpIcon = HpIcon;
   exports.HpInputNumber = InputNumber;
   exports.HpInputRange = InputRange;
   exports.HpInputSelect = InputSelect;
-  exports.HpInputText = InputText;
+  exports.HpInputText = HpInputText;
   exports.HpModal = Modal;
   exports.HpProgressBar = ProgressBar;
   exports.HpRadioButton = RadioButton;
-  exports.HpSpinnerLoader = _sfc_main$c;
-  exports.HpText = Text;
+  exports.HpSpinnerLoader = _sfc_main$d;
+  exports.HpText = HpText;
   exports.HpThemeSwitcher = ThemeSwitcher;
   exports.HpToggleSwitch = ToggleSwitch;
   exports.default = index;