@gustavo-valsechi/client 1.4.76 → 1.4.78

package/dist/components/types/form/types/select/index.mjs

@@ -10,11 +10,10 @@ import InputSelectOption from "./options";
 function InputSelect(props) {
   const inputRef = useRef({});
   const target = useTarget();
-  const option = useState("");
   const [focus, setFocus] = useState(false);
   const register = (props.register || ((name) => ({})))(props.name || "");
   useEffect(() => {
-    target.add({ ref: inputRef, component: /* @__PURE__ */ jsx(InputSelectOption, { option, ...props }) });
+    target.add({ ref: inputRef, component: /* @__PURE__ */ jsx(InputSelectOption, { ...props, inputRef, register }) });
     return () => target.remove(inputRef);
   }, []);
   const onBlur = (event) => {
@@ -35,7 +34,7 @@ function InputSelect(props) {
       props.label,
       props.required ? "*" : ""
     ] }),
-    /* @__PURE__ */ jsxs("div", { ref: inputRef, className: "iz-input-content", children: [
+    /* @__PURE__ */ jsxs("div", { ref: inputRef, className: "input-content", children: [
       /* @__PURE__ */ jsx(
         "input",
         {
@@ -45,7 +44,8 @@ function InputSelect(props) {
           ...register,
           onChange,
           onFocus,
-          onBlur
+          onBlur,
+          focus
         }
       ),
       /* @__PURE__ */ jsx("i", { "aria-hidden": true, className: focus ? "fa-solid fa-chevron-up" : "fa-solid fa-chevron-down" })

package/dist/components/types/form/types/select/options/index.d.ts

@@ -1,4 +1,4 @@
 import { IInputSelect } from "@interfaces";
 export default function InputSelectOption(props: IInputSelect & {
-    option: any;
+    inputRef: any;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/types/form/types/select/options/index.js

@@ -33,16 +33,23 @@ __export(options_exports, {
 });
 module.exports = __toCommonJS(options_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
 var import_styles = require("./styles");
 var import_lodash = __toESM(require("lodash"));
 function InputSelectOption(props) {
-  const [value, set] = props.option;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.Container, { children: import_lodash.default.map(
+  var _a, _b;
+  const [value, set] = (0, import_react.useState)("");
+  (0, import_react.useEffect)(() => {
+    var _a2;
+    (_a2 = props.setValue) == null ? void 0 : _a2.call(props, value);
+  }, [value, props.inputRef]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.Container, { width: (_b = (_a = props.inputRef) == null ? void 0 : _a.current) == null ? void 0 : _b.offsetWidth, children: import_lodash.default.map(
     props.options,
     (data, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      "option",
+      "div",
       {
-        value: Object.keys(data),
+        className: "input-option",
+        onClick: () => set(Object.keys(data)[index]),
         children: Object.values(data)
       },
       index

package/dist/components/types/form/types/select/options/index.mjs

@@ -1,15 +1,22 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
 import { Container } from "./styles";
 import _ from "lodash";
 function InputSelectOption(props) {
-  const [value, set] = props.option;
-  return /* @__PURE__ */ jsx(Container, { children: _.map(
+  var _a, _b;
+  const [value, set] = useState("");
+  useEffect(() => {
+    var _a2;
+    (_a2 = props.setValue) == null ? void 0 : _a2.call(props, value);
+  }, [value, props.inputRef]);
+  return /* @__PURE__ */ jsx(Container, { width: (_b = (_a = props.inputRef) == null ? void 0 : _a.current) == null ? void 0 : _b.offsetWidth, children: _.map(
     props.options,
     (data, index) => /* @__PURE__ */ jsx(
-      "option",
+      "div",
       {
-        value: Object.keys(data),
+        className: "input-option",
+        onClick: () => set(Object.keys(data)[index]),
         children: Object.values(data)
       },
       index

package/dist/components/types/form/types/select/options/styles.js

@@ -34,11 +34,20 @@ __export(styles_exports, {
 module.exports = __toCommonJS(styles_exports);
 var import_styled_components = __toESM(require("styled-components"));
 const Container = import_styled_components.default.div`
-    width: 20rem;
-    height: 10rem;
+    width: ${({ width }) => width}px;
     background-color: ${({ theme }) => theme.primary};
     border: 1px solid ${({ error, theme }) => error ? theme.negative : theme.t2};
     border-radius: 5px;
+    
+    .input-option {
+        padding: .5rem .8rem;
+        border-radius: 5px;
+        cursor: pointer;
+        
+        &:hover {
+            background-color: ${({ theme }) => theme.t05};
+        }
+    }
 `;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/components/types/form/types/select/options/styles.mjs

@@ -1,11 +1,20 @@
 "use client";
 import styled from "styled-components";
 const Container = styled.div`
-    width: 20rem;
-    height: 10rem;
+    width: ${({ width }) => width}px;
     background-color: ${({ theme }) => theme.primary};
     border: 1px solid ${({ error, theme }) => error ? theme.negative : theme.t2};
     border-radius: 5px;
+    
+    .input-option {
+        padding: .5rem .8rem;
+        border-radius: 5px;
+        cursor: pointer;
+        
+        &:hover {
+            background-color: ${({ theme }) => theme.t05};
+        }
+    }
 `;
 export {
   Container

package/dist/components/types/form/types/select/styles.js

@@ -36,7 +36,7 @@ var import_styled_components = __toESM(require("styled-components"));
 const Container = import_styled_components.default.div`
     width: 100%;
 
-    .iz-input-content {
+    .input-content {
         display: flex;
         align-items: center;
         justify-content: center;
@@ -53,6 +53,7 @@ const Container = import_styled_components.default.div`
             font-size: .8rem;
             background-color: ${({ theme }) => theme.primary};
             color: ${({ theme }) => theme.t6};
+            cursor: ${({ focus }) => focus ? "vertical-text" : "pointer"};
 
             &:disabled {
                 background-color: ${({ theme }) => theme.t2};
@@ -68,6 +69,9 @@ const Container = import_styled_components.default.div`
         i {
             color: ${({ theme }) => theme.t3};
             cursor: pointer;
+            font-size: .9rem;
+            padding: 0 .5rem 0 .8rem;
+            height: 100%;
         }
     }
 `;

package/dist/components/types/form/types/select/styles.mjs

@@ -3,7 +3,7 @@ import styled from "styled-components";
 const Container = styled.div`
     width: 100%;
 
-    .iz-input-content {
+    .input-content {
         display: flex;
         align-items: center;
         justify-content: center;
@@ -20,6 +20,7 @@ const Container = styled.div`
             font-size: .8rem;
             background-color: ${({ theme }) => theme.primary};
             color: ${({ theme }) => theme.t6};
+            cursor: ${({ focus }) => focus ? "vertical-text" : "pointer"};
 
             &:disabled {
                 background-color: ${({ theme }) => theme.t2};
@@ -35,6 +36,9 @@ const Container = styled.div`
         i {
             color: ${({ theme }) => theme.t3};
             cursor: pointer;
+            font-size: .9rem;
+            padding: 0 .5rem 0 .8rem;
+            height: 100%;
         }
     }
 `;

package/dist/components/types/form/types/text/index.js

@@ -52,7 +52,7 @@ function InputText(props) {
       props.label,
       props.required ? "*" : ""
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "iz-input-content", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "input-content", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         "input",
         {

package/dist/components/types/form/types/text/index.mjs

@@ -19,7 +19,7 @@ function InputText(props) {
       props.label,
       props.required ? "*" : ""
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: "iz-input-content", children: [
+    /* @__PURE__ */ jsxs("div", { className: "input-content", children: [
       /* @__PURE__ */ jsx(
         "input",
         {

package/dist/components/types/form/types/text/styles.js

@@ -36,7 +36,7 @@ var import_styled_components = __toESM(require("styled-components"));
 const Container = import_styled_components.default.div`
     width: 100%;
 
-    .iz-input-content {
+    .input-content {
         display: flex;
         align-items: center;
         justify-content: center;

package/dist/components/types/form/types/text/styles.mjs

@@ -3,7 +3,7 @@ import styled from "styled-components";
 const Container = styled.div`
     width: 100%;
 
-    .iz-input-content {
+    .input-content {
         display: flex;
         align-items: center;
         justify-content: center;

package/dist/components/types/form/types/textarea/index.js

@@ -50,7 +50,7 @@ function InputTextarea(props) {
       props.label,
       props.required ? "*" : ""
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "iz-input-content", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "input-content", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "textarea",
       {
         ...import_lodash.default.omit(props, ["onFocus", "maxLength", "className", "onChange", "mask", "rows", "required", "register", "setValue"]),

package/dist/components/types/form/types/textarea/index.mjs

@@ -17,7 +17,7 @@ function InputTextarea(props) {
       props.label,
       props.required ? "*" : ""
     ] }),
-    /* @__PURE__ */ jsx("div", { className: "iz-input-content", children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx("div", { className: "input-content", children: /* @__PURE__ */ jsx(
       "textarea",
       {
         ..._.omit(props, ["onFocus", "maxLength", "className", "onChange", "mask", "rows", "required", "register", "setValue"]),

package/dist/components/types/form/types/textarea/styles.js

@@ -36,7 +36,7 @@ var import_styled_components = __toESM(require("styled-components"));
 const Container = import_styled_components.default.div`
     width: 100%;
 
-    .iz-input-content {
+    .input-content {
         display: flex;
         align-items: center;
         justify-content: center;

package/dist/components/types/form/types/textarea/styles.mjs

@@ -3,7 +3,7 @@ import styled from "styled-components";
 const Container = styled.div`
     width: 100%;
 
-    .iz-input-content {
+    .input-content {
         display: flex;
         align-items: center;
         justify-content: center;

package/dist/components/types/loading/app/index.js

@@ -26,7 +26,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
 var import_styles = require("./styles");
 var import_logo = require("../../logo");
 function LoadingApp(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.Container, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_logo.Logo, { className: "iz-loading-logo", onlyPrefix: true }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.Container, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_logo.Logo, { className: "loading-logo", onlyPrefix: true }) });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/components/types/loading/app/index.mjs

@@ -3,7 +3,7 @@ import { jsx } from "react/jsx-runtime";
 import { Container } from "./styles";
 import { Logo } from "../../logo";
 function LoadingApp(props) {
-  return /* @__PURE__ */ jsx(Container, { ...props, children: /* @__PURE__ */ jsx(Logo, { className: "iz-loading-logo", onlyPrefix: true }) });
+  return /* @__PURE__ */ jsx(Container, { ...props, children: /* @__PURE__ */ jsx(Logo, { className: "loading-logo", onlyPrefix: true }) });
 }
 export {
   LoadingApp

package/dist/components/types/loading/app/styles.js

@@ -45,7 +45,7 @@ const Container = import_styled_components.default.div`
     background: ${({ initialization, theme }) => initialization ? `${theme.maingrad}, ${theme.primary}` : "transparent"};
     z-index: ${({ initialization }) => initialization ? "9" : "0"};
     
-    .iz-loading-logo {
+    .loading-logo {
         font-size: 4rem;
         opacity: 40%;
         animation: loop 2s infinite;

package/dist/components/types/loading/app/styles.mjs

@@ -12,7 +12,7 @@ const Container = styled.div`
     background: ${({ initialization, theme }) => initialization ? `${theme.maingrad}, ${theme.primary}` : "transparent"};
     z-index: ${({ initialization }) => initialization ? "9" : "0"};
     
-    .iz-loading-logo {
+    .loading-logo {
         font-size: 4rem;
         opacity: 40%;
         animation: loop 2s infinite;

package/dist/components/types/modal/index.js

@@ -39,20 +39,20 @@ var import_lodash = __toESM(require("lodash"));
 function Modal(props) {
   var _a, _b, _c;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.Container, { ...import_lodash.default.omit(props, ["className"]), position: props.position || "center", title: "", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "iz-modal-back", onClick: props.onClose }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "iz-modal-container", children: [
-      (!!props.title || !!props.header) && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "iz-modal-header", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "iz-modal-title", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "modal-back", onClick: props.onClose }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "modal-container", children: [
+      (!!props.title || !!props.header) && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "modal-header", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "modal-title", children: [
           ((_a = props.header) == null ? void 0 : _a.icon) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("i", { "aria-hidden": true, className: (_b = props.header) == null ? void 0 : _b.icon }),
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: props.title || ((_c = props.header) == null ? void 0 : _c.title) })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("i", { "aria-hidden": true, className: "fa-solid fa-xmark", onClick: props.onClose })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: `iz-modal-content ${props.className || ""}`, children: [
-        props.onClose && !props.title && !props.header && !props.noCloseIcon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "iz-modal-close", onClick: props.onClose, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("i", { "aria-hidden": true, className: "fa-solid fa-xmark" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: `modal-content ${props.className || ""}`, children: [
+        props.onClose && !props.title && !props.header && !props.noCloseIcon && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "modal-close", onClick: props.onClose, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("i", { "aria-hidden": true, className: "fa-solid fa-xmark" }) }),
         props.children
       ] }),
-      props.buttons && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "iz-modal-buttons", children: import_lodash.default.map(
+      props.buttons && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "modal-buttons", children: import_lodash.default.map(
         props.buttons,
         (button, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.Button, { ...button }, index)
       ) })

package/dist/components/types/modal/index.mjs

@@ -6,20 +6,20 @@ import _ from "lodash";
 function Modal(props) {
   var _a, _b, _c;
   return /* @__PURE__ */ jsxs(Container, { ..._.omit(props, ["className"]), position: props.position || "center", title: "", children: [
-    /* @__PURE__ */ jsx("div", { className: "iz-modal-back", onClick: props.onClose }),
-    /* @__PURE__ */ jsxs("div", { className: "iz-modal-container", children: [
-      (!!props.title || !!props.header) && /* @__PURE__ */ jsxs("div", { className: "iz-modal-header", children: [
-        /* @__PURE__ */ jsxs("div", { className: "iz-modal-title", children: [
+    /* @__PURE__ */ jsx("div", { className: "modal-back", onClick: props.onClose }),
+    /* @__PURE__ */ jsxs("div", { className: "modal-container", children: [
+      (!!props.title || !!props.header) && /* @__PURE__ */ jsxs("div", { className: "modal-header", children: [
+        /* @__PURE__ */ jsxs("div", { className: "modal-title", children: [
           ((_a = props.header) == null ? void 0 : _a.icon) && /* @__PURE__ */ jsx("i", { "aria-hidden": true, className: (_b = props.header) == null ? void 0 : _b.icon }),
           /* @__PURE__ */ jsx("span", { children: props.title || ((_c = props.header) == null ? void 0 : _c.title) })
         ] }),
         /* @__PURE__ */ jsx("i", { "aria-hidden": true, className: "fa-solid fa-xmark", onClick: props.onClose })
       ] }),
-      /* @__PURE__ */ jsxs("div", { className: `iz-modal-content ${props.className || ""}`, children: [
-        props.onClose && !props.title && !props.header && !props.noCloseIcon && /* @__PURE__ */ jsx("div", { className: "iz-modal-close", onClick: props.onClose, children: /* @__PURE__ */ jsx("i", { "aria-hidden": true, className: "fa-solid fa-xmark" }) }),
+      /* @__PURE__ */ jsxs("div", { className: `modal-content ${props.className || ""}`, children: [
+        props.onClose && !props.title && !props.header && !props.noCloseIcon && /* @__PURE__ */ jsx("div", { className: "modal-close", onClick: props.onClose, children: /* @__PURE__ */ jsx("i", { "aria-hidden": true, className: "fa-solid fa-xmark" }) }),
         props.children
       ] }),
-      props.buttons && /* @__PURE__ */ jsx("div", { className: "iz-modal-buttons", children: _.map(
+      props.buttons && /* @__PURE__ */ jsx("div", { className: "modal-buttons", children: _.map(
         props.buttons,
         (button, index) => /* @__PURE__ */ jsx(Button, { ...button }, index)
       ) })

package/dist/components/types/modal/styles.js

@@ -45,7 +45,7 @@ const Container = import_styled_components.default.div`
   transform: ${(props) => props.toggle ? "translateX(0%)" : "translateX(100%)"};
   transition: ${(props) => props.toggle ? ".0s ease .0s" : ".3s ease .3s"};
 
-  .iz-modal-back {
+  .modal-back {
     width: 100%;
     height: 100%;
     background: rgb(0, 0, 0, 0.3);
@@ -54,7 +54,7 @@ const Container = import_styled_components.default.div`
     position: absolute;
   }
 
-  .iz-modal-container {
+  .modal-container {
     display: flex;
     flex-direction: column;
     height: ${(props) => props.position !== "center" ? "100%" : void 0};
@@ -81,14 +81,14 @@ const Container = import_styled_components.default.div`
       ${(props) => props.position === "right" ? "right: 0;" : props.position === "left" ? "left: 0;" : "left: 50%; bottom: 0;"}
     }
 
-    .iz-modal-header {
+    .modal-header {
       padding: 1rem 1.5rem;
       display: flex;
       align-items: center;
       justify-content: space-between;
       border-bottom: 1px solid rgb(0, 0, 0, 0.2);
 
-      .iz-modal-title {
+      .modal-title {
         color: ${({ theme }) => theme.t6};
         font-size: 1rem;
         font-weight: 500;
@@ -113,14 +113,14 @@ const Container = import_styled_components.default.div`
       }
     }
 
-    .iz-modal-content {
+    .modal-content {
       overflow-x: hidden;
       overflow-y: overlay;
       position: relative;
       height: ${(props) => props.position === "center" ? "initial" : "100%"};
       padding: ${(props) => props.position === "center" ? "1.5rem" : "0"};
 
-      .iz-modal-close {
+      .modal-close {
         position: absolute;
         color: ${(props) => props.light ? "rgb(255, 255, 255, 0.6)" : "rgb(0, 0, 0, 0.6)"};
         top: ${(props) => props.position === "center" ? "1rem" : "1.5rem"};
@@ -143,7 +143,7 @@ const Container = import_styled_components.default.div`
       }
     }
 
-    .iz-modal-buttons {
+    .modal-buttons {
       padding: 1rem 2rem;
 
       @media(max-width: ${({ theme }) => theme.mobileMaxWidth}) {

package/dist/components/types/modal/styles.mjs

@@ -12,7 +12,7 @@ const Container = styled.div`
   transform: ${(props) => props.toggle ? "translateX(0%)" : "translateX(100%)"};
   transition: ${(props) => props.toggle ? ".0s ease .0s" : ".3s ease .3s"};
 
-  .iz-modal-back {
+  .modal-back {
     width: 100%;
     height: 100%;
     background: rgb(0, 0, 0, 0.3);
@@ -21,7 +21,7 @@ const Container = styled.div`
     position: absolute;
   }
 
-  .iz-modal-container {
+  .modal-container {
     display: flex;
     flex-direction: column;
     height: ${(props) => props.position !== "center" ? "100%" : void 0};
@@ -48,14 +48,14 @@ const Container = styled.div`
       ${(props) => props.position === "right" ? "right: 0;" : props.position === "left" ? "left: 0;" : "left: 50%; bottom: 0;"}
     }
 
-    .iz-modal-header {
+    .modal-header {
       padding: 1rem 1.5rem;
       display: flex;
       align-items: center;
       justify-content: space-between;
       border-bottom: 1px solid rgb(0, 0, 0, 0.2);
 
-      .iz-modal-title {
+      .modal-title {
         color: ${({ theme }) => theme.t6};
         font-size: 1rem;
         font-weight: 500;
@@ -80,14 +80,14 @@ const Container = styled.div`
       }
     }
 
-    .iz-modal-content {
+    .modal-content {
       overflow-x: hidden;
       overflow-y: overlay;
       position: relative;
       height: ${(props) => props.position === "center" ? "initial" : "100%"};
       padding: ${(props) => props.position === "center" ? "1.5rem" : "0"};
 
-      .iz-modal-close {
+      .modal-close {
         position: absolute;
         color: ${(props) => props.light ? "rgb(255, 255, 255, 0.6)" : "rgb(0, 0, 0, 0.6)"};
         top: ${(props) => props.position === "center" ? "1rem" : "1.5rem"};
@@ -110,7 +110,7 @@ const Container = styled.div`
       }
     }
 
-    .iz-modal-buttons {
+    .modal-buttons {
       padding: 1rem 2rem;
 
       @media(max-width: ${({ theme }) => theme.mobileMaxWidth}) {

package/dist/components/types/table/index.js

@@ -69,9 +69,9 @@ function Table(props) {
       "div",
       {
         className: `
-          iz-table-content 
-          ${((_a2 = option.row) == null ? void 0 : _a2.actions) ? "iz-table-action" : ""} 
-          ${((_b2 = option.row) == null ? void 0 : _b2.icon) ? "iz-table-identifier" : ""}
+          table-content 
+          ${((_a2 = option.row) == null ? void 0 : _a2.actions) ? "table-action" : ""} 
+          ${((_b2 = option.row) == null ? void 0 : _b2.icon) ? "table-identifier" : ""}
         `,
         style: import_lodash.default.isFunction((_c2 = option.row) == null ? void 0 : _c2.style) ? option.row.style(data, option) : (_d2 = option.row) == null ? void 0 : _d2.style,
         children: renderRowContent(data, option)
@@ -81,13 +81,13 @@ function Table(props) {
   const renderRowContent = (data, option) => {
     var _a2, _b2, _c2, _d2, _e2;
     if (!!((_a2 = option.row) == null ? void 0 : _a2.actions)) {
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "iz-table-actions", children: import_lodash.default.map(
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "table-actions", children: import_lodash.default.map(
         (_b2 = option.row) == null ? void 0 : _b2.actions,
         (action, index) => renderButton(action, data, index)
       ) });
     }
     if ((_c2 = option.row) == null ? void 0 : _c2.icon) {
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "iz-table-icon", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "table-icon", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         "i",
         {
           "aria-hidden": true,
@@ -101,7 +101,7 @@ function Table(props) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "button",
       {
-        className: `iz-table-button ${import_lodash.default.includes(action.icon, "trash") ? "negative" : ""}`,
+        className: `table-button ${import_lodash.default.includes(action.icon, "trash") ? "negative" : ""}`,
         onClick: () => action.function ? action.function(data) : null,
         disabled: action.disabled,
         "data-tooltip": action.tooltip,
@@ -124,7 +124,7 @@ function Table(props) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       "div",
       {
-        className: "iz-table-content-elipse",
+        className: "table-content-elipse",
         "data-tooltip": import_lodash.default.isString(body) ? body : "",
         "data-tooltip-props": '{"position":"bottom"}',
         children: body
@@ -132,7 +132,7 @@ function Table(props) {
     );
   };
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.Container, { notFound: !((_b = props.content) == null ? void 0 : _b.length) && !props.loading, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "iz-table-container", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("table", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "table-container", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("table", { children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("thead", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("tr", { children: import_lodash.default.map(
         props.options,
         (option, index) => {
@@ -140,7 +140,7 @@ function Table(props) {
           return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("th", { style: (_a2 = option.column) == null ? void 0 : _a2.style, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
             "div",
             {
-              className: `iz-table-content ${((_b2 = option.column) == null ? void 0 : _b2.action) ? `iz-table-action ${((_d2 = (_c2 = option.column) == null ? void 0 : _c2.action) == null ? void 0 : _d2.position) ? (_f2 = (_e2 = option.column) == null ? void 0 : _e2.action) == null ? void 0 : _f2.position : ""}` : ""}`,
+              className: `table-content ${((_b2 = option.column) == null ? void 0 : _b2.action) ? `table-action ${((_d2 = (_c2 = option.column) == null ? void 0 : _c2.action) == null ? void 0 : _d2.position) ? (_f2 = (_e2 = option.column) == null ? void 0 : _e2.action) == null ? void 0 : _f2.position : ""}` : ""}`,
               children: !!((_g = option.column) == null ? void 0 : _g.action) ? renderButton(option.column.action) : !((_h = props.content) == null ? void 0 : _h.length) && !props.loading ? "" : import_lodash.default.isString(((_i = option.column) == null ? void 0 : _i.name) || option.column) ? ((_j = option.column) == null ? void 0 : _j.name) || option.column : ""
             }
           ) }, index);
@@ -158,7 +158,7 @@ function Table(props) {
         ) }, index);
       }) }, key)) : import_lodash.default.map(props.content, (data, key) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("tr", { children: import_lodash.default.map(props.options, (option, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("td", { onClick: () => index < 2 ? onShowLine(key) : null, children: renderRowContainer(data, option) }, index)) }, key)) })
     ] }) }),
-    !((_d = props.content) == null ? void 0 : _d.length) && !props.loading && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "iz-table-not-found", children: [
+    !((_d = props.content) == null ? void 0 : _d.length) && !props.loading && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "table-not-found", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: ((_e = props.notFound) == null ? void 0 : _e.title) || "Nenhuma campanha encontrado" }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: ((_f = props.notFound) == null ? void 0 : _f.message) || "Envie uma campanha de marketing para aparecer algum registro" })
     ] }),