@sito/dashboard 0.0.25 → 0.0.27

package/dist/dashboard.cjs

@@ -1 +1 @@
-var H=require("./main.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("react");var y=(t=>(t.ASC="ASC",t.DESC="DESC",t))(y||{});const E=[20,50,100],w=d.createContext({}),M=t=>{const{children:s}=t,[l,n]=d.useState(0),[r,a]=d.useState(20),[h,b]=d.useState(0),[u,g]=d.useState("id"),[o,i]=d.useState(y.DESC),m={onSort:d.useCallback(c=>{let j=o;if(u===c)switch(o){case y.ASC:j=y.DESC;break;default:j=y.ASC;break}g(c),i(j)},[u,o]),total:l,setTotal:n,sortingBy:u,setSortingBy:g,sortingOrder:o,setSortingOrder:i,pageSize:r,pageSizes:E,setPageSize:a,currentPage:h,setCurrentPage:b};return e.jsx(w.Provider,{value:m,children:s})},N=()=>{const t=d.useContext(w);if(t===void 0)throw new Error("tableOptionsContext must be used within a Provider");return t},S=d.createContext({});function A(t){const{children:s,t:l}=t;return e.jsx(S.Provider,{value:{t:l},children:s})}const v=()=>{const t=d.useContext(S);if(t===void 0)throw new Error("translationContext must be used within a Provider");return t};function T(t){const{content:s,children:l}=t;return e.jsxs("div",{className:"tooltip-container",children:[l,e.jsx("div",{className:"tooltip-text",children:s})]})}function k(t){const{color:s="stroke-blue-800",loaderClass:l,strokeWidth:n="4",...r}=t;return e.jsx("div",{...r,className:`loading ${r.className}`,children:e.jsx("div",{className:"loader-container",children:e.jsx("div",{className:`loader ${l}`,children:e.jsx("svg",{className:"circular",viewBox:"25 25 50 50",children:e.jsx("circle",{className:`path ${s}`,cx:"50",cy:"50",r:"20",fill:"none",strokeWidth:n,strokeMiterlimit:"10"})})})})})}function D(){const{t}=v();return e.jsx("div",{className:"w-full flex items-center justify-center py-2 border-t-[1px]",children:e.jsx("p",{children:t("_accessibility:components.table.empty")})})}function P(t){const{className:s}=t;return e.jsx("svg",{className:s,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 512 512",children:e.jsx("path",{d:"M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z"})})}function $(t){const{className:s}=t;return e.jsx("svg",{className:s,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 512 512",children:e.jsx("path",{d:"M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"})})}function B(t){const{t:s}=v(),{entity:l="",columns:n=[],hasAction:r=!0,columnsOptions:a}=t,{onSort:h,sortingOrder:b,sortingBy:u}=N(),g=d.useMemo(()=>{const{noSortableColumns:o={},columnClassNames:i={}}=a??{};return n==null?void 0:n.map(x=>({id:x.key,label:x.label,className:i[x.key]??"",sortable:!o[x.key]}))},[n,a,l,s]);return e.jsx("thead",{className:"text-xs text-gray-700 bg-gray-50",children:e.jsxs("tr",{children:[g.map(o=>{var i,x,m,c;return e.jsx("th",{scope:"col",className:`px-6 py-3 ${o.className}`,children:e.jsxs("button",{disabled:!o.sortable,onClick:()=>h(o.id),className:"flex items-center gap-2",children:[e.jsx("span",{className:"whitespace-nowrap",children:o.label}),o.sortable&&e.jsx("span",{className:`${u===o.id?"opacity-100":"opacity-0"}`,children:b===y.ASC?((i=a==null?void 0:a.icons)==null?void 0:i.asc)??e.jsx(P,{className:((x=a==null?void 0:a.icons)==null?void 0:x.className)??"w-3"}):((m=a==null?void 0:a.icons)==null?void 0:m.desc)??e.jsx($,{className:((c=a==null?void 0:a.icons)==null?void 0:c.className)??"w-3"})})]})},o.id)}),r&&e.jsx("th",{scope:"col",className:"px-6 py-3 text-center",children:s("_accessibility:labels.actions")})]})})}var z=(t=>(t.error="error",t.good="good",t.default="default",t))(z||{});const L=t=>{switch(t){case"error":return"border-red-500 text-red-900 placeholder-red-700 focus:ring-red-500 focus:border-red-500";case"good":return"border-green-500 text-green-900 placeholder-green-700 focus:ring-green-500 focus:border-green-500";default:return"text-gray-900 border-gray-300 focus:border-blue-600"}},F=t=>{switch(t){case"error":return"peer-focus:text-red-700 text-red-700";case"good":return"peer-focus:text-green-700 text-green-700";default:return"peer-focus:text-blue-600 text-gray-500"}},q=t=>{switch(t){case"error":return"text-red-600";case"good":return"text-green-600";default:return"text-gray-500"}},I=d.forwardRef(function(t,s){const{value:l,onChange:n,options:r,containerClassName:a="",inputClassName:h="",labelClassName:b="",helperText:u="",helperTextClassName:g="",placeholder:o="",label:i="",name:x="",id:m="",state:c=z.default,...j}=t;return d.useEffect(()=>{var f;(!l||l==="")&&(r!=null&&r.length)&&n({target:{value:(f=r[0])==null?void 0:f.id}})},[n,r,l]),e.jsxs("div",{className:`relative z-0 w-full mb-5 group ${a}`,children:[e.jsx("select",{...j,id:m,ref:s,name:x,value:l,onChange:n,className:`block py-2.5 px-0 w-full text-sm bg-transparent border-0 border-b-2 appearance-none focus:outline-none focus:ring-0 disabled:text-[#6b7280] ${L(c)} peer ${h}`,children:r==null?void 0:r.map(f=>e.jsx("option",{value:f.id,children:f.value},f.id))}),e.jsx("label",{htmlFor:x,className:`peer-focus:font-medium absolute text-sm duration-300 transform -translate-y-6 scale-75 top-3 -z-10 origin-[0] peer-focus:start-0 rtl:peer-focus:translate-x-1/4 rtl:peer-focus:left-auto peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6 ${F(c)} ${b}`,children:i}),e.jsx("p",{className:`mt-2 text-sm ${q(c)} ${g}`,children:c!=="error"&&c!=="good"?o:u})]})}),R=I;function U(){const{t}=v(),{pageSizes:s,pageSize:l,setPageSize:n}=N(),r=d.useMemo(()=>s==null?void 0:s.map(a=>({id:a,value:a})),[s]);return e.jsxs("div",{className:"flex gap-2 items-center justify-start px-5",children:[e.jsx("p",{children:t("_accessibility:components.table.pageSizes")}),e.jsx(R,{value:l,options:r,inputClassName:"!py-0 !pl-2 !pr-7 !border-none font-bold",containerClassName:"!w-auto !mb-0 !border-none",helperTextClassName:"hidden",onChange:a=>n(a.target.value)})]})}function W(){const{t}=v(),{total:s,pageSize:l,pageSizes:n,currentPage:r,setCurrentPage:a}=N(),h=(r+1)*l>s?s:(r+1)*l;return e.jsxs("div",{className:"flex w-full items-center justify-between mt-5 px-5",children:[e.jsxs("div",{className:"flex w-full items-center justify-start gap-1",children:[e.jsx("p",{children:t("_accessibility:components.table.pageSizes")}),n[0]<s&&e.jsx(e.Fragment,{children:e.jsxs("p",{children:[t("_accessibility:components.table.from")," ",r*l+1," ",t("_accessibility:components.table.to")," ",h," ",t("_accessibility:components.table.of")]})}),e.jsxs("p",{children:[s," ",t("_accessibility:components.table.results")]})]}),e.jsxs("div",{className:"flex gap-5 items-center justify-end",children:[e.jsx("button",{className:"disabled:text-light-primary/40",disabled:r===0,onClick:()=>a(r-1),children:t("_accessibility:buttons.previous")}),e.jsx("button",{disabled:Math.floor(s/((r+1)*l))===0,className:"disabled:text-light-primary/40",onClick:()=>a(r+1),children:t("_accessibility:buttons.next")})]})]})}function G(t){const{t:s}=v(),{title:l="",rows:n,parseRows:r,entity:a="",isLoading:h=!1,actions:b,columns:u=[],contentClassName:g="h-[calc(100vh-280px)]",className:o="bg-gray-50",columnsOptions:i,softDeleteProperty:x="deleted"}=t,m=d.useMemo(()=>(n==null?void 0:n.map(c=>r(c)))??[],[r,n,s]);return e.jsxs("div",{className:`${o} relative overflow-x-auto w-full h-full`,children:[e.jsx("div",{className:"mb-5 flex w-full items-center justify-between",children:e.jsxs("div",{children:[e.jsx("h1",{className:"text-2xl md:text-3xl font-bold mx-5",children:l}),n!=null&&n.length&&!h?e.jsx(U,{}):null]})}),h?e.jsx(k,{className:"bg-white top-0 left-0 w-full h-full"}):e.jsx("div",{className:`${g} overflow-auto`,children:n!=null&&n.length?e.jsxs(e.Fragment,{children:[e.jsxs("table",{className:"w-full text-sm text-left text-gray-500",children:[e.jsx(B,{entity:a,columns:u,columnsOptions:i,hasAction:!!b}),e.jsx("tbody",{children:m==null?void 0:m.map(c=>{var j,f;return e.jsxs("tr",{className:`border-b ${(j=c[x])!=null&&j.value?"deleted-class":"bg-white"}`,children:[u==null?void 0:u.map((p,_)=>{var C;return e.jsx("td",{className:`px-6 py-4 font-medium ${_===0?"text-gray-900 whitespace-nowrap":""} ${i!=null&&i.columnClassNames?i==null?void 0:i.columnClassNames[p.key]:""}`,children:((C=c[p.key])==null?void 0:C.render)??c[p.key]},p.key)}),b?e.jsx("td",{children:e.jsx("div",{className:"flex items-center gap-3 w-full justify-center",children:(f=b(c).filter(p=>!p.hidden))==null?void 0:f.map(p=>e.jsx(T,{content:p.tooltip,children:e.jsx("button",{onClick:p.onClick,children:p.icon})},p.id))})}):null]},c.id)})})]}),e.jsx(W,{})]}):e.jsx(D,{})})]})}exports.ChevronDown=$;exports.ChevronUp=P;exports.Loading=k;exports.Table=G;exports.TableOptionsProvider=M;exports.Tooltip=T;exports.TranslationProvider=A;exports.useTableOptions=N;exports.useTranslation=v;
+var H=require("./main.css");Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("react");var N=(s=>(s.ASC="ASC",s.DESC="DESC",s))(N||{});const E=[20,50,100],S=d.createContext({}),M=s=>{const{children:t}=s,[l,n]=d.useState(0),[a,r]=d.useState(20),[b,g]=d.useState(0),[u,j]=d.useState("id"),[i,o]=d.useState(N.DESC),m={onSort:d.useCallback(c=>{let v=i;if(u===c)switch(i){case N.ASC:v=N.DESC;break;default:v=N.ASC;break}j(c),o(v)},[u,i]),total:l,setTotal:n,sortingBy:u,setSortingBy:j,sortingOrder:i,setSortingOrder:o,pageSize:a,pageSizes:E,setPageSize:r,currentPage:b,setCurrentPage:g};return e.jsx(S.Provider,{value:m,children:t})},f=()=>{const s=d.useContext(S);if(s===void 0)throw new Error("tableOptionsContext must be used within a Provider");return s},$=d.createContext({});function A(s){const{children:t,t:l}=s;return e.jsx($.Provider,{value:{t:l},children:t})}const C=()=>{const s=d.useContext($);if(s===void 0)throw new Error("translationContext must be used within a Provider");return s};function T(s){const{content:t,children:l}=s;return e.jsxs("div",{className:"tooltip-container",children:[l,e.jsx("div",{className:"tooltip-text",children:t})]})}function w(s){const{color:t="stroke-blue-800",loaderClass:l,strokeWidth:n="4",...a}=s;return e.jsx("div",{...a,className:`loading ${a.className}`,children:e.jsx("div",{className:"loader-container",children:e.jsx("div",{className:`loader ${l}`,children:e.jsx("svg",{className:"circular",viewBox:"25 25 50 50",children:e.jsx("circle",{className:`path ${t}`,cx:"50",cy:"50",r:"20",fill:"none",strokeWidth:n,strokeMiterlimit:"10"})})})})})}function D(){const{t:s}=C();return e.jsx("div",{className:"table-empty",children:e.jsx("p",{children:s("_accessibility:components.table.empty")})})}function k(s){const{className:t}=s;return e.jsx("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 512 512",children:e.jsx("path",{d:"M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z"})})}function P(s){const{className:t}=s;return e.jsx("svg",{className:t,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 512 512",children:e.jsx("path",{d:"M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"})})}function B(s){const{t}=C(),{entity:l="",columns:n=[],hasAction:a=!0,columnsOptions:r}=s,{onSort:b,sortingOrder:g,sortingBy:u}=f(),j=d.useMemo(()=>{const{noSortableColumns:i={},columnClassNames:o={}}=r??{};return n==null?void 0:n.map(h=>({id:h.key,label:h.label,className:o[h.key]??"",sortable:!i[h.key]}))},[n,r,l,t]);return e.jsx("thead",{className:"table-headers-row",children:e.jsxs("tr",{children:[j.map(i=>{var o,h,m,c;return e.jsx("th",{scope:"col",className:`table-headers-column ${i.className}`,children:e.jsxs("button",{disabled:!i.sortable,onClick:()=>b(i.id),className:"table-headers-cell",children:[e.jsx("span",{className:"table-headers-label",children:i.label}),i.sortable&&e.jsx("span",{className:`${u===i.id?"table-headers-sort-on":"table-headers-sort"}`,children:g===N.ASC?((o=r==null?void 0:r.icons)==null?void 0:o.asc)??e.jsx(k,{className:((h=r==null?void 0:r.icons)==null?void 0:h.className)??"table-headers-sort-indicator"}):((m=r==null?void 0:r.icons)==null?void 0:m.desc)??e.jsx(P,{className:((c=r==null?void 0:r.icons)==null?void 0:c.className)??"table-headers-sort-indicator"})})]})},i.id)}),a&&e.jsx("th",{scope:"col",className:"table-headers-action",children:t("_accessibility:labels.actions")})]})})}var z=(s=>(s.error="error",s.good="good",s.default="default",s))(z||{});const L=s=>{switch(s){case"error":return"border-red-500 text-red-900 placeholder-red-700 focus:ring-red-500 focus:border-red-500";case"good":return"border-green-500 text-green-900 placeholder-green-700 focus:ring-green-500 focus:border-green-500";default:return"text-gray-900 border-gray-300 focus:border-blue-600"}},F=s=>{switch(s){case"error":return"peer-focus:text-red-700 text-red-700";case"good":return"peer-focus:text-green-700 text-green-700";default:return"peer-focus:text-blue-600 text-gray-500"}},q=s=>{switch(s){case"error":return"text-red-600";case"good":return"text-green-600";default:return"text-gray-500"}};const I=d.forwardRef(function(s,t){const{value:l,onChange:n,options:a,containerClassName:r="",inputClassName:b="",labelClassName:g="",helperText:u="",helperTextClassName:j="",placeholder:i="",label:o="",name:h="",id:m="",state:c=z.default,...v}=s;return d.useEffect(()=>{var p;(!l||l==="")&&(a!=null&&a.length)&&n({target:{value:(p=a[0])==null?void 0:p.id}})},[n,a,l]),e.jsxs("div",{className:`select-input-container ${r}`,children:[e.jsx("select",{...v,id:m,ref:t,name:h,value:l,onChange:n,className:`select-input ${L(c)} peer ${b}`,children:a==null?void 0:a.map(p=>e.jsx("option",{value:p.id,children:p.value},p.id))}),e.jsx("label",{htmlFor:h,className:`select-input-label ${F(c)} ${g}`,children:o}),e.jsx("p",{className:`select-input-helper-text ${q(c)} ${j}`,children:c!=="error"&&c!=="good"?i:u})]})}),R=I;function U(){const{t:s}=C(),{pageSizes:t,pageSize:l,setPageSize:n}=f(),a=d.useMemo(()=>t==null?void 0:t.map(r=>({id:r,value:r})),[t]);return e.jsxs("div",{className:"page-size",children:[e.jsx("p",{children:s("_accessibility:components.table.pageSizes")}),e.jsx(R,{value:l,options:a,inputClassName:"page-size-input",containerClassName:"page-size-input-container",helperTextClassName:"hidden",onChange:r=>n(r.target.value)})]})}function W(){const{t:s}=C(),{total:t,pageSize:l,pageSizes:n,currentPage:a,setCurrentPage:r}=f(),b=(a+1)*l>t?t:(a+1)*l;return e.jsxs("div",{className:"table-navigation",children:[e.jsxs("div",{className:"table-navigation-sizes",children:[e.jsx("p",{children:s("_accessibility:components.table.pageSizes")}),n[0]<t&&e.jsx(e.Fragment,{children:e.jsxs("p",{children:[s("_accessibility:components.table.from")," ",a*l+1," ",s("_accessibility:components.table.to")," ",b," ",s("_accessibility:components.table.of")]})}),e.jsxs("p",{children:[t," ",s("_accessibility:components.table.results")]})]}),e.jsxs("div",{className:"table-navigation-pages",children:[e.jsx("button",{className:"table-navigation-buttons",disabled:a===0,onClick:()=>r(a-1),children:s("_accessibility:buttons.previous")}),e.jsx("button",{disabled:Math.floor(t/((a+1)*l))===0,className:"table-navigation-buttons",onClick:()=>r(a+1),children:s("_accessibility:buttons.next")})]})]})}function G(s){const{t}=C(),{title:l="",rows:n,parseRows:a,entity:r="",isLoading:b=!1,actions:g,columns:u=[],contentClassName:j="",className:i="",columnsOptions:o,softDeleteProperty:h="deleted"}=s,m=d.useMemo(()=>(n==null?void 0:n.map(c=>a(c)))??[],[a,n,t]);return e.jsxs("div",{className:`${i} table`,children:[e.jsx("div",{className:"table-header",children:e.jsxs("div",{children:[e.jsx("h1",{className:"table-header-title",children:l}),n!=null&&n.length&&!b?e.jsx(U,{}):null]})}),b?e.jsx(w,{className:"table-loading"}):e.jsx("div",{className:`${j} table-body`,children:n!=null&&n.length?e.jsxs(e.Fragment,{children:[e.jsxs("table",{className:"table-content",children:[e.jsx(B,{entity:r,columns:u,columnsOptions:o,hasAction:!!g}),e.jsx("tbody",{children:m==null?void 0:m.map(c=>{var v,p;return e.jsxs("tr",{className:`table-row ${(v=c[h])!=null&&v.value?"deleted-class":""}`,children:[u==null?void 0:u.map((x,_)=>{var y;return e.jsx("td",{className:`table-row-cell ${_===0?"basic":""} ${o!=null&&o.columnClassNames?o==null?void 0:o.columnClassNames[x.key]:""}`,children:((y=c[x.key])==null?void 0:y.render)??c[x.key]},x.key)}),g?e.jsx("td",{children:e.jsx("div",{className:"table-row-cell-action",children:(p=g(c).filter(x=>!x.hidden))==null?void 0:p.map(x=>e.jsx(T,{content:x.tooltip,children:e.jsx("button",{onClick:x.onClick,children:x.icon})},x.id))})}):null]},c.id)})})]}),e.jsx(W,{})]}):e.jsx(D,{})})]})}exports.ChevronDown=P;exports.ChevronUp=k;exports.Loading=w;exports.Table=G;exports.TableOptionsProvider=M;exports.Tooltip=T;exports.TranslationProvider=A;exports.useTableOptions=f;exports.useTranslation=C;

package/dist/dashboard.js

@@ -1,91 +1,91 @@
 import "./main.css";
-import { jsx as t, jsxs as d, Fragment as $ } from "react/jsx-runtime";
-import { createContext as P, useState as v, useCallback as A, useContext as z, useMemo as w, forwardRef as B, useEffect as D } from "react";
-var y = /* @__PURE__ */ ((e) => (e.ASC = "ASC", e.DESC = "DESC", e))(y || {});
-const M = [20, 50, 100], T = P({}), O = (e) => {
-  const { children: r } = e, [n, l] = v(0), [s, a] = v(20), [m, b] = v(0), [p, x] = v("id"), [i, o] = v(y.DESC), f = {
-    onSort: A(
+import { jsx as t, jsxs as d, Fragment as w } from "react/jsx-runtime";
+import { createContext as z, useState as x, useCallback as B, useContext as P, useMemo as S, forwardRef as D, useEffect as M } from "react";
+var f = /* @__PURE__ */ ((e) => (e.ASC = "ASC", e.DESC = "DESC", e))(f || {});
+const L = [20, 50, 100], T = z({}), O = (e) => {
+  const { children: a } = e, [l, n] = x(0), [s, r] = x(20), [m, p] = x(0), [b, v] = x("id"), [i, o] = x(f.DESC), g = {
+    onSort: B(
       (c) => {
-        let N = i;
-        if (p === c)
+        let C = i;
+        if (b === c)
           switch (i) {
-            case y.ASC:
-              N = y.DESC;
+            case f.ASC:
+              C = f.DESC;
               break;
             default:
-              N = y.ASC;
+              C = f.ASC;
               break;
           }
-        x(c), o(N);
+        v(c), o(C);
       },
-      [p, i]
+      [b, i]
     ),
-    total: n,
-    setTotal: l,
-    sortingBy: p,
-    setSortingBy: x,
+    total: l,
+    setTotal: n,
+    sortingBy: b,
+    setSortingBy: v,
     sortingOrder: i,
     setSortingOrder: o,
     pageSize: s,
-    pageSizes: M,
-    setPageSize: a,
+    pageSizes: L,
+    setPageSize: r,
     currentPage: m,
-    setCurrentPage: b
+    setCurrentPage: p
   };
-  return /* @__PURE__ */ t(T.Provider, { value: f, children: r });
-}, S = () => {
-  const e = z(T);
+  return /* @__PURE__ */ t(T.Provider, { value: g, children: a });
+}, $ = () => {
+  const e = P(T);
   if (e === void 0)
     throw new Error("tableOptionsContext must be used within a Provider");
   return e;
-}, _ = P({});
+}, _ = z({});
 function ee(e) {
-  const { children: r, t: n } = e;
-  return /* @__PURE__ */ t(_.Provider, { value: { t: n }, children: r });
+  const { children: a, t: l } = e;
+  return /* @__PURE__ */ t(_.Provider, { value: { t: l }, children: a });
 }
-const C = () => {
-  const e = z(_);
+const y = () => {
+  const e = P(_);
   if (e === void 0)
     throw new Error("translationContext must be used within a Provider");
   return e;
 };
-function L(e) {
-  const { content: r, children: n } = e;
+function j(e) {
+  const { content: a, children: l } = e;
   return /* @__PURE__ */ d("div", { className: "tooltip-container", children: [
-    n,
-    /* @__PURE__ */ t("div", { className: "tooltip-text", children: r })
+    l,
+    /* @__PURE__ */ t("div", { className: "tooltip-text", children: a })
   ] });
 }
 function F(e) {
   const {
-    color: r = "stroke-blue-800",
-    loaderClass: n,
-    strokeWidth: l = "4",
+    color: a = "stroke-blue-800",
+    loaderClass: l,
+    strokeWidth: n = "4",
     ...s
   } = e;
-  return /* @__PURE__ */ t("div", { ...s, className: `loading ${s.className}`, children: /* @__PURE__ */ t("div", { className: "loader-container", children: /* @__PURE__ */ t("div", { className: `loader ${n}`, children: /* @__PURE__ */ t("svg", { className: "circular", viewBox: "25 25 50 50", children: /* @__PURE__ */ t(
+  return /* @__PURE__ */ t("div", { ...s, className: `loading ${s.className}`, children: /* @__PURE__ */ t("div", { className: "loader-container", children: /* @__PURE__ */ t("div", { className: `loader ${l}`, children: /* @__PURE__ */ t("svg", { className: "circular", viewBox: "25 25 50 50", children: /* @__PURE__ */ t(
     "circle",
     {
-      className: `path ${r}`,
+      className: `path ${a}`,
       cx: "50",
       cy: "50",
       r: "20",
       fill: "none",
-      strokeWidth: l,
+      strokeWidth: n,
       strokeMiterlimit: "10"
     }
   ) }) }) }) });
 }
 function I() {
-  const { t: e } = C();
-  return /* @__PURE__ */ t("div", { className: "w-full flex items-center justify-center py-2 border-t-[1px]", children: /* @__PURE__ */ t("p", { children: e("_accessibility:components.table.empty") }) });
+  const { t: e } = y();
+  return /* @__PURE__ */ t("div", { className: "table-empty", children: /* @__PURE__ */ t("p", { children: e("_accessibility:components.table.empty") }) });
 }
 function R(e) {
-  const { className: r } = e;
+  const { className: a } = e;
   return /* @__PURE__ */ t(
     "svg",
     {
-      className: r,
+      className: a,
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 512 512",
       children: /* @__PURE__ */ t("path", { d: "M233.4 105.4c12.5-12.5 32.8-12.5 45.3 0l192 192c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L256 173.3 86.6 342.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l192-192z" })
@@ -93,11 +93,11 @@ function R(e) {
   );
 }
 function U(e) {
-  const { className: r } = e;
+  const { className: a } = e;
   return /* @__PURE__ */ t(
     "svg",
     {
-      className: r,
+      className: a,
       xmlns: "http://www.w3.org/2000/svg",
       viewBox: "0 0 512 512",
       children: /* @__PURE__ */ t("path", { d: "M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z" })
@@ -105,44 +105,44 @@ function U(e) {
   );
 }
 function W(e) {
-  const { t: r } = C(), { entity: n = "", columns: l = [], hasAction: s = !0, columnsOptions: a } = e, { onSort: m, sortingOrder: b, sortingBy: p } = S(), x = w(() => {
-    const { noSortableColumns: i = {}, columnClassNames: o = {} } = a ?? {};
-    return l == null ? void 0 : l.map((u) => ({
-      id: u.key,
-      label: u.label,
-      className: o[u.key] ?? "",
-      sortable: !i[u.key]
+  const { t: a } = y(), { entity: l = "", columns: n = [], hasAction: s = !0, columnsOptions: r } = e, { onSort: m, sortingOrder: p, sortingBy: b } = $(), v = S(() => {
+    const { noSortableColumns: i = {}, columnClassNames: o = {} } = r ?? {};
+    return n == null ? void 0 : n.map((h) => ({
+      id: h.key,
+      label: h.label,
+      className: o[h.key] ?? "",
+      sortable: !i[h.key]
     }));
-  }, [l, a, n, r]);
-  return /* @__PURE__ */ t("thead", { className: "text-xs text-gray-700 bg-gray-50", children: /* @__PURE__ */ d("tr", { children: [
-    x.map((i) => {
-      var o, u, f, c;
+  }, [n, r, l, a]);
+  return /* @__PURE__ */ t("thead", { className: "table-headers-row", children: /* @__PURE__ */ d("tr", { children: [
+    v.map((i) => {
+      var o, h, g, c;
       return /* @__PURE__ */ t(
         "th",
         {
           scope: "col",
-          className: `px-6 py-3 ${i.className}`,
+          className: `table-headers-column ${i.className}`,
           children: /* @__PURE__ */ d(
             "button",
             {
               disabled: !i.sortable,
               onClick: () => m(i.id),
-              className: "flex items-center gap-2",
+              className: "table-headers-cell",
               children: [
-                /* @__PURE__ */ t("span", { className: "whitespace-nowrap", children: i.label }),
+                /* @__PURE__ */ t("span", { className: "table-headers-label", children: i.label }),
                 i.sortable && /* @__PURE__ */ t(
                   "span",
                   {
-                    className: `${p === i.id ? "opacity-100" : "opacity-0"}`,
-                    children: b === y.ASC ? ((o = a == null ? void 0 : a.icons) == null ? void 0 : o.asc) ?? /* @__PURE__ */ t(
+                    className: `${b === i.id ? "table-headers-sort-on" : "table-headers-sort"}`,
+                    children: p === f.ASC ? ((o = r == null ? void 0 : r.icons) == null ? void 0 : o.asc) ?? /* @__PURE__ */ t(
                       R,
                       {
-                        className: ((u = a == null ? void 0 : a.icons) == null ? void 0 : u.className) ?? "w-3"
+                        className: ((h = r == null ? void 0 : r.icons) == null ? void 0 : h.className) ?? "table-headers-sort-indicator"
                       }
-                    ) : ((f = a == null ? void 0 : a.icons) == null ? void 0 : f.desc) ?? /* @__PURE__ */ t(
+                    ) : ((g = r == null ? void 0 : r.icons) == null ? void 0 : g.desc) ?? /* @__PURE__ */ t(
                       U,
                       {
-                        className: ((c = a == null ? void 0 : a.icons) == null ? void 0 : c.className) ?? "w-3"
+                        className: ((c = r == null ? void 0 : r.icons) == null ? void 0 : c.className) ?? "table-headers-sort-indicator"
                       }
                     )
                   }
@@ -154,10 +154,10 @@ function W(e) {
         i.id
       );
     }),
-    s && /* @__PURE__ */ t("th", { scope: "col", className: "px-6 py-3 text-center", children: r("_accessibility:labels.actions") })
+    s && /* @__PURE__ */ t("th", { scope: "col", className: "table-headers-action", children: a("_accessibility:labels.actions") })
   ] }) });
 }
-var j = /* @__PURE__ */ ((e) => (e.error = "error", e.good = "good", e.default = "default", e))(j || {});
+var E = /* @__PURE__ */ ((e) => (e.error = "error", e.good = "good", e.default = "default", e))(E || {});
 const q = (e) => {
   switch (e) {
     case "error":
@@ -185,86 +185,87 @@ const q = (e) => {
     default:
       return "text-gray-500";
   }
-}, J = B(function(e, r) {
+};
+const J = D(function(e, a) {
   const {
-    value: n,
-    onChange: l,
+    value: l,
+    onChange: n,
     options: s,
-    containerClassName: a = "",
+    containerClassName: r = "",
     inputClassName: m = "",
-    labelClassName: b = "",
-    helperText: p = "",
-    helperTextClassName: x = "",
+    labelClassName: p = "",
+    helperText: b = "",
+    helperTextClassName: v = "",
     placeholder: i = "",
     label: o = "",
-    name: u = "",
-    id: f = "",
-    state: c = j.default,
-    ...N
+    name: h = "",
+    id: g = "",
+    state: c = E.default,
+    ...C
   } = e;
-  return D(() => {
-    var g;
-    (!n || n === "") && (s != null && s.length) && l({ target: { value: (g = s[0]) == null ? void 0 : g.id } });
-  }, [l, s, n]), /* @__PURE__ */ d("div", { className: `relative z-0 w-full mb-5 group ${a}`, children: [
+  return M(() => {
+    var N;
+    (!l || l === "") && (s != null && s.length) && n({ target: { value: (N = s[0]) == null ? void 0 : N.id } });
+  }, [n, s, l]), /* @__PURE__ */ d("div", { className: `select-input-container ${r}`, children: [
     /* @__PURE__ */ t(
       "select",
       {
-        ...N,
-        id: f,
-        ref: r,
-        name: u,
-        value: n,
-        onChange: l,
-        className: `block py-2.5 px-0 w-full text-sm bg-transparent border-0 border-b-2 appearance-none focus:outline-none focus:ring-0 disabled:text-[#6b7280] ${q(c)} peer ${m}`,
-        children: s == null ? void 0 : s.map((g) => /* @__PURE__ */ t("option", { value: g.id, children: g.value }, g.id))
+        ...C,
+        id: g,
+        ref: a,
+        name: h,
+        value: l,
+        onChange: n,
+        className: `select-input ${q(c)} peer ${m}`,
+        children: s == null ? void 0 : s.map((N) => /* @__PURE__ */ t("option", { value: N.id, children: N.value }, N.id))
       }
     ),
     /* @__PURE__ */ t(
       "label",
       {
-        htmlFor: u,
-        className: `peer-focus:font-medium absolute text-sm duration-300 transform -translate-y-6 scale-75 top-3 -z-10 origin-[0] peer-focus:start-0 rtl:peer-focus:translate-x-1/4 rtl:peer-focus:left-auto peer-placeholder-shown:scale-100 peer-placeholder-shown:translate-y-0 peer-focus:scale-75 peer-focus:-translate-y-6 ${G(c)} ${b}`,
+        htmlFor: h,
+        className: `select-input-label ${G(c)} ${p}`,
         children: o
       }
     ),
     /* @__PURE__ */ t(
       "p",
       {
-        className: `mt-2 text-sm ${H(c)} ${x}`,
-        children: c !== "error" && c !== "good" ? i : p
+        className: `select-input-helper-text ${H(c)} ${v}`,
+        children: c !== "error" && c !== "good" ? i : b
       }
     )
   ] });
 }), K = J;
 function Q() {
-  const { t: e } = C(), { pageSizes: r, pageSize: n, setPageSize: l } = S(), s = w(
-    () => r == null ? void 0 : r.map((a) => ({ id: a, value: a })),
-    [r]
+  const { t: e } = y(), { pageSizes: a, pageSize: l, setPageSize: n } = $(), s = S(
+    () => a == null ? void 0 : a.map((r) => ({ id: r, value: r })),
+    [a]
   );
-  return /* @__PURE__ */ d("div", { className: "flex gap-2 items-center justify-start px-5", children: [
+  return /* @__PURE__ */ d("div", { className: "page-size", children: [
     /* @__PURE__ */ t("p", { children: e("_accessibility:components.table.pageSizes") }),
     /* @__PURE__ */ t(
       K,
       {
-        value: n,
+        value: l,
         options: s,
-        inputClassName: "!py-0 !pl-2 !pr-7 !border-none font-bold",
-        containerClassName: "!w-auto !mb-0 !border-none",
+        inputClassName: "page-size-input",
+        containerClassName: "page-size-input-container",
         helperTextClassName: "hidden",
-        onChange: (a) => l(a.target.value)
+        onChange: (r) => n(r.target.value)
       }
     )
   ] });
 }
 function V() {
-  const { t: e } = C(), { total: r, pageSize: n, pageSizes: l, currentPage: s, setCurrentPage: a } = S(), m = (s + 1) * n > r ? r : (s + 1) * n;
-  return /* @__PURE__ */ d("div", { className: "flex w-full items-center justify-between mt-5 px-5", children: [
-    /* @__PURE__ */ d("div", { className: "flex w-full items-center justify-start gap-1", children: [
+  const { t: e } = y(), { total: a, pageSize: l, pageSizes: n, currentPage: s, setCurrentPage: r } = $(), m = (s + 1) * l > a ? a : (s + 1) * l;
+  return /* @__PURE__ */ d("div", { className: "table-navigation", children: [
+    /* @__PURE__ */ d("div", { className: "table-navigation-sizes", children: [
       /* @__PURE__ */ t("p", { children: e("_accessibility:components.table.pageSizes") }),
-      l[0] < r && /* @__PURE__ */ t($, { children: /* @__PURE__ */ d("p", { children: [
+      n[0] < a && /* @__PURE__ */ t(w, { children: /* @__PURE__ */ d("p", { children: [
         e("_accessibility:components.table.from"),
         " ",
-        s * n + 1,
+        s * l + 1,
         " ",
         e("_accessibility:components.table.to"),
         " ",
@@ -273,27 +274,27 @@ function V() {
         e("_accessibility:components.table.of")
       ] }) }),
       /* @__PURE__ */ d("p", { children: [
-        r,
+        a,
         " ",
         e("_accessibility:components.table.results")
       ] })
     ] }),
-    /* @__PURE__ */ d("div", { className: "flex gap-5 items-center justify-end", children: [
+    /* @__PURE__ */ d("div", { className: "table-navigation-pages", children: [
       /* @__PURE__ */ t(
         "button",
         {
-          className: "disabled:text-light-primary/40",
+          className: "table-navigation-buttons",
           disabled: s === 0,
-          onClick: () => a(s - 1),
+          onClick: () => r(s - 1),
           children: e("_accessibility:buttons.previous")
         }
       ),
       /* @__PURE__ */ t(
         "button",
         {
-          disabled: Math.floor(r / ((s + 1) * n)) === 0,
-          className: "disabled:text-light-primary/40",
-          onClick: () => a(s + 1),
+          disabled: Math.floor(a / ((s + 1) * l)) === 0,
+          className: "table-navigation-buttons",
+          onClick: () => r(s + 1),
           children: e("_accessibility:buttons.next")
         }
       )
@@ -301,63 +302,63 @@ function V() {
   ] });
 }
 function te(e) {
-  const { t: r } = C(), {
-    title: n = "",
-    rows: l,
+  const { t: a } = y(), {
+    title: l = "",
+    rows: n,
     parseRows: s,
-    entity: a = "",
+    entity: r = "",
     isLoading: m = !1,
-    actions: b,
-    columns: p = [],
-    contentClassName: x = "h-[calc(100vh-280px)]",
-    className: i = "bg-gray-50",
+    actions: p,
+    columns: b = [],
+    contentClassName: v = "",
+    className: i = "",
     columnsOptions: o,
-    softDeleteProperty: u = "deleted"
-  } = e, f = w(
-    () => (l == null ? void 0 : l.map((c) => s(c))) ?? [],
-    [s, l, r]
+    softDeleteProperty: h = "deleted"
+  } = e, g = S(
+    () => (n == null ? void 0 : n.map((c) => s(c))) ?? [],
+    [s, n, a]
   );
-  return /* @__PURE__ */ d("div", { className: `${i} relative overflow-x-auto w-full h-full`, children: [
-    /* @__PURE__ */ t("div", { className: "mb-5 flex w-full items-center justify-between", children: /* @__PURE__ */ d("div", { children: [
-      /* @__PURE__ */ t("h1", { className: "text-2xl md:text-3xl font-bold mx-5", children: n }),
-      l != null && l.length && !m ? /* @__PURE__ */ t(Q, {}) : null
+  return /* @__PURE__ */ d("div", { className: `${i} table`, children: [
+    /* @__PURE__ */ t("div", { className: "table-header", children: /* @__PURE__ */ d("div", { children: [
+      /* @__PURE__ */ t("h1", { className: "table-header-title", children: l }),
+      n != null && n.length && !m ? /* @__PURE__ */ t(Q, {}) : null
     ] }) }),
-    m ? /* @__PURE__ */ t(F, { className: "bg-white top-0 left-0 w-full h-full" }) : /* @__PURE__ */ t("div", { className: `${x} overflow-auto`, children: l != null && l.length ? /* @__PURE__ */ d($, { children: [
-      /* @__PURE__ */ d("table", { className: "w-full text-sm text-left text-gray-500", children: [
+    m ? /* @__PURE__ */ t(F, { className: "table-loading" }) : /* @__PURE__ */ t("div", { className: `${v} table-body`, children: n != null && n.length ? /* @__PURE__ */ d(w, { children: [
+      /* @__PURE__ */ d("table", { className: "table-content", children: [
         /* @__PURE__ */ t(
           W,
           {
-            entity: a,
-            columns: p,
+            entity: r,
+            columns: b,
             columnsOptions: o,
-            hasAction: !!b
+            hasAction: !!p
           }
         ),
-        /* @__PURE__ */ t("tbody", { children: f == null ? void 0 : f.map((c) => {
-          var N, g;
+        /* @__PURE__ */ t("tbody", { children: g == null ? void 0 : g.map((c) => {
+          var C, N;
           return /* @__PURE__ */ d(
             "tr",
             {
-              className: `border-b ${(N = c[u]) != null && N.value ? "deleted-class" : "bg-white"}`,
+              className: `table-row ${(C = c[h]) != null && C.value ? "deleted-class" : ""}`,
               children: [
-                p == null ? void 0 : p.map((h, E) => {
+                b == null ? void 0 : b.map((u, A) => {
                   var k;
                   return /* @__PURE__ */ t(
                     "td",
                     {
-                      className: `px-6 py-4 font-medium ${E === 0 ? "text-gray-900 whitespace-nowrap" : ""} ${o != null && o.columnClassNames ? o == null ? void 0 : o.columnClassNames[h.key] : ""}`,
-                      children: ((k = c[h.key]) == null ? void 0 : k.render) ?? c[h.key]
+                      className: `table-row-cell ${A === 0 ? "basic" : ""} ${o != null && o.columnClassNames ? o == null ? void 0 : o.columnClassNames[u.key] : ""}`,
+                      children: ((k = c[u.key]) == null ? void 0 : k.render) ?? c[u.key]
                     },
-                    h.key
+                    u.key
                   );
                 }),
-                b ? /* @__PURE__ */ t("td", { children: /* @__PURE__ */ t("div", { className: "flex items-center gap-3 w-full justify-center", children: (g = b(c).filter((h) => !h.hidden)) == null ? void 0 : g.map((h) => /* @__PURE__ */ t(
-                  L,
+                p ? /* @__PURE__ */ t("td", { children: /* @__PURE__ */ t("div", { className: "table-row-cell-action", children: (N = p(c).filter((u) => !u.hidden)) == null ? void 0 : N.map((u) => /* @__PURE__ */ t(
+                  j,
                   {
-                    content: h.tooltip,
-                    children: /* @__PURE__ */ t("button", { onClick: h.onClick, children: h.icon })
+                    content: u.tooltip,
+                    children: /* @__PURE__ */ t("button", { onClick: u.onClick, children: u.icon })
                   },
-                  h.id
+                  u.id
                 )) }) }) : null
               ]
             },
@@ -375,8 +376,8 @@ export {
   F as Loading,
   te as Table,
   O as TableOptionsProvider,
-  L as Tooltip,
+  j as Tooltip,
   ee as TranslationProvider,
-  S as useTableOptions,
-  C as useTranslation
+  $ as useTableOptions,
+  y as useTranslation
 };

package/dist/main.css

@@ -1 +1 @@
-*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.absolute{position:absolute}.relative{position:relative}.left-0{left:0}.top-0{top:0}.top-3{top:.75rem}.-z-10{z-index:-10}.z-0{z-index:0}.mx-5{margin-left:1.25rem;margin-right:1.25rem}.\!mb-0{margin-bottom:0!important}.mb-5{margin-bottom:1.25rem}.mt-2{margin-top:.5rem}.mt-5{margin-top:1.25rem}.block{display:block}.flex{display:flex}.table{display:table}.hidden{display:none}.h-\[calc\(100vh-280px\)\]{height:calc(100vh - 280px)}.h-full{height:100%}.\!w-auto{width:auto!important}.w-3{width:.75rem}.w-full{width:100%}.origin-\[0\]{transform-origin:0}.-translate-y-6{--tw-translate-y: -1.5rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-75{--tw-scale-x: .75;--tw-scale-y: .75;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-5{gap:1.25rem}.overflow-auto{overflow:auto}.overflow-x-auto{overflow-x:auto}.whitespace-nowrap{white-space:nowrap}.border-0{border-width:0px}.border-b{border-bottom-width:1px}.border-b-2{border-bottom-width:2px}.border-t-\[1px\]{border-top-width:1px}.\!border-none{border-style:none!important}.border-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity))}.border-green-500{--tw-border-opacity: 1;border-color:rgb(34 197 94 / var(--tw-border-opacity))}.border-red-500{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity))}.bg-gray-50{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity))}.bg-transparent{background-color:transparent}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.stroke-blue-800{stroke:#1e40af}.\!py-0{padding-top:0!important;padding-bottom:0!important}.px-0{padding-left:0;padding-right:0}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.\!pl-2{padding-left:.5rem!important}.\!pr-7{padding-right:1.75rem!important}.text-left{text-align:left}.text-center{text-align:center}.text-2xl{font-size:1.5rem;line-height:2rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.text-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.text-gray-700{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity))}.text-gray-900{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity))}.text-green-600{--tw-text-opacity: 1;color:rgb(22 163 74 / var(--tw-text-opacity))}.text-green-700{--tw-text-opacity: 1;color:rgb(21 128 61 / var(--tw-text-opacity))}.text-green-900{--tw-text-opacity: 1;color:rgb(20 83 45 / var(--tw-text-opacity))}.text-red-600{--tw-text-opacity: 1;color:rgb(220 38 38 / var(--tw-text-opacity))}.text-red-700{--tw-text-opacity: 1;color:rgb(185 28 28 / var(--tw-text-opacity))}.text-red-900{--tw-text-opacity: 1;color:rgb(127 29 29 / var(--tw-text-opacity))}.placeholder-green-700::-moz-placeholder{--tw-placeholder-opacity: 1;color:rgb(21 128 61 / var(--tw-placeholder-opacity))}.placeholder-green-700::placeholder{--tw-placeholder-opacity: 1;color:rgb(21 128 61 / var(--tw-placeholder-opacity))}.placeholder-red-700::-moz-placeholder{--tw-placeholder-opacity: 1;color:rgb(185 28 28 / var(--tw-placeholder-opacity))}.placeholder-red-700::placeholder{--tw-placeholder-opacity: 1;color:rgb(185 28 28 / var(--tw-placeholder-opacity))}.opacity-0{opacity:0}.opacity-100{opacity:1}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.duration-300{transition-duration:.3s}.focus\:border-blue-600:focus{--tw-border-opacity: 1;border-color:rgb(37 99 235 / var(--tw-border-opacity))}.focus\:border-green-500:focus{--tw-border-opacity: 1;border-color:rgb(34 197 94 / var(--tw-border-opacity))}.focus\:border-red-500:focus{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity))}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-0:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-green-500:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(34 197 94 / var(--tw-ring-opacity))}.focus\:ring-red-500:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(239 68 68 / var(--tw-ring-opacity))}.disabled\:text-\[\#6b7280\]:disabled{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:translate-y-0{--tw-translate-y: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.peer:placeholder-shown~.peer-placeholder-shown\:translate-y-0{--tw-translate-y: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:scale-100{--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.peer:placeholder-shown~.peer-placeholder-shown\:scale-100{--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.peer:focus~.peer-focus\:start-0{inset-inline-start:0px}.peer:focus~.peer-focus\:-translate-y-6{--tw-translate-y: -1.5rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.peer:focus~.peer-focus\:scale-75{--tw-scale-x: .75;--tw-scale-y: .75;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.peer:focus~.peer-focus\:font-medium{font-weight:500}.peer:focus~.peer-focus\:text-blue-600{--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity))}.peer:focus~.peer-focus\:text-green-700{--tw-text-opacity: 1;color:rgb(21 128 61 / var(--tw-text-opacity))}.peer:focus~.peer-focus\:text-red-700{--tw-text-opacity: 1;color:rgb(185 28 28 / var(--tw-text-opacity))}@media (min-width: 768px){.md\:text-3xl{font-size:1.875rem;line-height:2.25rem}}.peer:focus~.rtl\:peer-focus\:left-auto:where([dir=rtl],[dir=rtl] *){left:auto}.peer:focus~.rtl\:peer-focus\:translate-x-1\/4:where([dir=rtl],[dir=rtl] *){--tw-translate-x: 25%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.loader-container{padding:5%}.loader{width:40px;position:relative;margin:0 auto}.loader:before{content:"";padding-top:100%;display:block}.circular{width:100%;height:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;animation:rotate 2s linear infinite;transform-origin:center center}.path{stroke-dasharray:1,200;stroke-dashoffset:0;animation:dash 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}.loading{display:flex;width:100%;height:100%;align-items:center;justify-content:center}
+*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.table{display:table}.table-row{display:table-row}.hidden{display:none}.border-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity))}.border-green-500{--tw-border-opacity: 1;border-color:rgb(34 197 94 / var(--tw-border-opacity))}.border-red-500{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity))}.stroke-blue-800{stroke:#1e40af}.text-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.text-gray-900{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity))}.text-green-600{--tw-text-opacity: 1;color:rgb(22 163 74 / var(--tw-text-opacity))}.text-green-700{--tw-text-opacity: 1;color:rgb(21 128 61 / var(--tw-text-opacity))}.text-green-900{--tw-text-opacity: 1;color:rgb(20 83 45 / var(--tw-text-opacity))}.text-red-600{--tw-text-opacity: 1;color:rgb(220 38 38 / var(--tw-text-opacity))}.text-red-700{--tw-text-opacity: 1;color:rgb(185 28 28 / var(--tw-text-opacity))}.text-red-900{--tw-text-opacity: 1;color:rgb(127 29 29 / var(--tw-text-opacity))}.placeholder-green-700::-moz-placeholder{--tw-placeholder-opacity: 1;color:rgb(21 128 61 / var(--tw-placeholder-opacity))}.placeholder-green-700::placeholder{--tw-placeholder-opacity: 1;color:rgb(21 128 61 / var(--tw-placeholder-opacity))}.placeholder-red-700::-moz-placeholder{--tw-placeholder-opacity: 1;color:rgb(185 28 28 / var(--tw-placeholder-opacity))}.placeholder-red-700::placeholder{--tw-placeholder-opacity: 1;color:rgb(185 28 28 / var(--tw-placeholder-opacity))}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.focus\:border-blue-600:focus{--tw-border-opacity: 1;border-color:rgb(37 99 235 / var(--tw-border-opacity))}.focus\:border-green-500:focus{--tw-border-opacity: 1;border-color:rgb(34 197 94 / var(--tw-border-opacity))}.focus\:border-red-500:focus{--tw-border-opacity: 1;border-color:rgb(239 68 68 / var(--tw-border-opacity))}.focus\:ring-green-500:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(34 197 94 / var(--tw-ring-opacity))}.focus\:ring-red-500:focus{--tw-ring-opacity: 1;--tw-ring-color: rgb(239 68 68 / var(--tw-ring-opacity))}.peer:focus~.peer-focus\:text-blue-600{--tw-text-opacity: 1;color:rgb(37 99 235 / var(--tw-text-opacity))}.peer:focus~.peer-focus\:text-green-700{--tw-text-opacity: 1;color:rgb(21 128 61 / var(--tw-text-opacity))}.peer:focus~.peer-focus\:text-red-700{--tw-text-opacity: 1;color:rgb(185 28 28 / var(--tw-text-opacity))}.tooltip-container{position:relative;display:inline-block;cursor:pointer}.tooltip-text{visibility:hidden;background-color:#000;color:#fff;text-align:center;padding:5px 10px;border-radius:5px;position:absolute;z-index:1;bottom:125%;left:50%;transform:translate(-50%);opacity:0;transition:opacity .3s}.tooltip-container:hover .tooltip-text{visibility:visible;opacity:1}.loader-container{padding:5%}.loader{width:40px;position:relative;margin:0 auto}.loader:before{content:"";padding-top:100%;display:block}.circular{width:100%;height:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;animation:rotate 2s linear infinite;transform-origin:center center}.path{stroke-dasharray:1,200;stroke-dashoffset:0;animation:dash 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}.loading{display:flex;width:100%;height:100%;align-items:center;justify-content:center}.select-input-container{position:relative;z-index:0;margin-bottom:1.25rem;width:100%}.select-input{display:block;width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-width:0px;border-bottom-width:2px;background-color:transparent;padding-top:.625rem;padding-bottom:.625rem;padding-left:0;padding-right:0;font-size:.875rem;line-height:1.25rem}.select-input:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.select-input:disabled{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.select-input-label{position:absolute;top:.75rem;z-index:-10;transform-origin:0;--tw-translate-y: -1.5rem;--tw-scale-x: .75;--tw-scale-y: .75;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));font-size:.875rem;line-height:1.25rem;transition-duration:.3s}.peer:-moz-placeholder-shown~.select-input-label{--tw-translate-y: 0px;--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.peer:placeholder-shown~.select-input-label{--tw-translate-y: 0px;--tw-scale-x: 1;--tw-scale-y: 1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.peer:focus~.select-input-label{inset-inline-start:0px;--tw-translate-y: -1.5rem;--tw-scale-x: .75;--tw-scale-y: .75;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));font-weight:500}.peer:focus~.select-input-label:where([dir=rtl],[dir=rtl] *){left:auto;--tw-translate-x: 25%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.select-input-helper-text{margin-top:.5rem;font-size:.875rem;line-height:1.25rem}.table{position:relative;height:100%;width:100%;overflow-x:auto}.table-header{margin-bottom:1.25rem;display:flex;width:100%;align-items:center;justify-content:space-between}.table-header-title{margin-left:1.25rem;margin-right:1.25rem;font-size:1.5rem;line-height:2rem;font-weight:700}@media (min-width: 768px){.table-header-title{font-size:1.875rem;line-height:2.25rem}}.table-body{overflow:auto}.table-content{width:100%;text-align:left;font-size:.875rem;line-height:1.25rem;--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity))}.table-loading{top:0;left:0;height:100%;width:100%;--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.table-row{border-bottom-width:1px;--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.table-row-cell{padding:1rem 1.5rem;font-weight:500}.table-row-cell.basic{white-space:nowrap;--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity))}.table-row-cell-action{display:flex;width:100%;align-items:center;justify-content:center;gap:.75rem}.page-size{display:flex;align-items:center;justify-content:flex-start;gap:.5rem;padding-left:1.25rem;padding-right:1.25rem}.page-size-input{border-style:none!important;padding-top:0!important;padding-bottom:0!important;padding-left:.5rem!important;padding-right:1.75rem!important;font-weight:700}.page-size-input-container{margin-bottom:0!important;width:auto!important;border-style:none!important}.table-headers-row{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity));font-size:.75rem;line-height:1rem;--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity))}.table-headers-column{padding:.75rem 1.5rem}.table-headers-cell{display:flex;align-items:center;gap:.5rem}.table-headers-label{white-space:nowrap}.table-headers-sort{opacity:0}.table-headers-sort-on{opacity:1}.table-headers-sort-indicator{width:.75rem}.table-headers-action{padding:.75rem 1.5rem;text-align:center}.table-empty{display:flex;width:100%;align-items:center;justify-content:center;border-top-width:1px;padding-top:.5rem;padding-bottom:.5rem}.table-navigation{margin-top:1.25rem;display:flex;width:100%;align-items:center;justify-content:space-between;padding-left:1.25rem;padding-right:1.25rem}.table-navigation-sizes{display:flex;width:100%;align-items:center;justify-content:flex-start;gap:.25rem}.table-navigation-pages{display:flex;align-items:center;justify-content:flex-end;gap:1.25rem}.table-navigation-buttons:disabled{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity))}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sito/dashboard",
   "private": false,
-  "version": "0.0.25",
+  "version": "0.0.27",
   "type": "module",
   "description": "UI library with custom components for dashboards",
   "main": "dist/dashboard.cjs",