@situaction/traq-ui-ste 1.0.21 → 1.0.23

package/dist/components/button/Button.d.ts

@@ -9,7 +9,7 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     /** what mode do you use for light or dark color **/
     colorMode?: 'light' | 'dark';
     /** How large should the button be? */
-    size?: Size;
+    size?: Size | 'menu';
     /** button contents */
     label: string;
     /** If true, the button will be styled to indicate an error state. */

package/dist/components/button/Button.js

@@ -1,68 +1,70 @@
-import { jsxs as y, jsx as a } from "react/jsx-runtime";
-import { useEffect as x } from "react";
-import { useTheme as g } from "../theme/ThemeContext.js";
-import '../../styles/Button.css';const v = "_button_1031d_21", z = "_flexHorizontalCenter_1031d_167", o = {
-  button: v,
-  "button-primary": "_button-primary_1031d_43",
-  "button-secondary": "_button-secondary_1031d_57",
-  "button-tertiary": "_button-tertiary_1031d_71",
-  "button-ghost": "_button-ghost_1031d_85",
-  "button-text": "_button-text_1031d_101",
-  "button-text-selected": "_button-text-selected_1031d_114",
-  "button-error": "_button-error_1031d_120",
-  "button-size-xl": "_button-size-xl_1031d_133",
-  "button-size-l": "_button-size-l_1031d_139",
-  "button-size-m": "_button-size-m_1031d_145",
-  "button-size-s": "_button-size-s_1031d_151",
-  "button-gap-xl": "_button-gap-xl_1031d_157",
-  "button-gap-l": "_button-gap-l_1031d_160",
-  "button-gap-m": "_button-gap-m_1031d_163",
-  "button-gap-s": "_button-gap-s_1031d_163",
+import { jsxs as w, jsx as a } from "react/jsx-runtime";
+import { useEffect as g } from "react";
+import { useTheme as x } from "../theme/ThemeContext.js";
+import '../../styles/Button.css';const d = "_button_138cw_23", z = "_flexHorizontalCenter_138cw_178", o = {
+  button: d,
+  "button-primary": "_button-primary_138cw_45",
+  "button-secondary": "_button-secondary_138cw_59",
+  "button-tertiary": "_button-tertiary_138cw_73",
+  "button-ghost": "_button-ghost_138cw_87",
+  "button-text": "_button-text_138cw_103",
+  "button-text-selected": "_button-text-selected_138cw_116",
+  "button-error": "_button-error_138cw_122",
+  "button-size-xl": "_button-size-xl_138cw_135",
+  "button-size-l": "_button-size-l_138cw_141",
+  "button-size-m": "_button-size-m_138cw_147",
+  "button-size-s": "_button-size-s_138cw_153",
+  "button-size-menu": "_button-size-menu_138cw_159",
+  "button-gap-menu": "_button-gap-menu_138cw_165",
+  "button-gap-xl": "_button-gap-xl_138cw_168",
+  "button-gap-l": "_button-gap-l_138cw_171",
+  "button-gap-m": "_button-gap-m_138cw_165",
+  "button-gap-s": "_button-gap-s_138cw_174",
   flexHorizontalCenter: z
-}, C = ({
-  mode: n = "primary",
-  size: s = "m",
+}, $ = ({
+  mode: r = "primary",
+  size: u = "m",
   color: t,
-  colorMode: r,
-  label: u,
-  error: l,
-  selected: b,
-  childrenLeft: i,
-  childrenRight: _,
-  ...d
+  colorMode: n,
+  label: i,
+  error: c,
+  selected: l,
+  childrenLeft: _,
+  childrenRight: s,
+  ...b
 }) => {
-  const { mode: e } = g(), c = () => l ? "error" : n;
-  x(() => {
-    r && !t && console.warn("`colorMode` is defined but `color` is missing. `colorMode` will be ignored.");
+  const { mode: e } = x(), m = () => c ? "error" : r;
+  g(() => {
+    n && !t && console.warn("`colorMode` is defined but `color` is missing. `colorMode` will be ignored.");
   }, [t]);
-  const m = [
+  const p = [
     o.button,
-    o[`button-${c()}`],
-    o[`button-size-${s}`],
-    o[`button-gap-${s}`],
-    b && n === "text" && o["button-text-selected"],
+    o[`button-${m()}`],
+    o[`button-size-${u}`],
+    o[`button-gap-${u}`],
+    l && r === "text" && o["button-text-selected"],
     o.flexHorizontalCenter
-  ].join(" "), p = {
-    "--dynamic-color-text": t ? r === "dark" ? `var(--color-${t}-900)` : "var(--color-light-100)" : e === "light" ? "var(--color-light-100)" : "var(--primary-color-900)",
-    "--dynamic-color": t ? `var(--color-${t}-${r === "dark" ? "200" : "900"})` : "var(--primary-color)",
-    "--dynamic-color-hover": t ? `var(--color-${t}-${r === "dark" ? "100" : "800"})` : e === "light" ? "var(--primary-color-800)" : "var(--primary-color-100)",
-    "--dynamic-color-activated": t ? `var(--color-${t}-${r === "dark" ? "50" : "700"})` : e === "light" ? "var(--primary-color-700)" : "var(--primary-color-50)"
+  ].join(" "), y = {
+    "--dynamic-color-text": t ? n === "dark" ? `var(--color-${t}-900)` : "var(--color-light-100)" : e === "light" ? "var(--color-light-100)" : "var(--primary-color-900)",
+    "--dynamic-color": t ? `var(--color-${t}-${n === "dark" ? "200" : "900"})` : "var(--primary-color)",
+    "--dynamic-color-hover": t ? `var(--color-${t}-${n === "dark" ? "100" : "800"})` : e === "light" ? "var(--primary-color-800)" : "var(--primary-color-100)",
+    "--dynamic-color-activated": t ? `var(--color-${t}-${n === "dark" ? "50" : "700"})` : e === "light" ? "var(--primary-color-700)" : "var(--primary-color-50)"
   };
-  return /* @__PURE__ */ y(
+  return /* @__PURE__ */ w(
     "button",
     {
       type: "button",
-      className: m,
-      style: n === "primary" ? p : void 0,
-      ...d,
+      className: p,
+      style: r === "primary" ? y : void 0,
+      ...b,
       children: [
-        i && /* @__PURE__ */ a("span", { className: o.flexHorizontalCenter, children: i }),
-        /* @__PURE__ */ a("span", { children: u }),
-        _ && /* @__PURE__ */ a("span", { className: o.flexHorizontalCenter, children: _ })
+        _ && /* @__PURE__ */ a("span", { className: o.flexHorizontalCenter, children: _ }),
+        /* @__PURE__ */ a("span", { children: i }),
+        s && /* @__PURE__ */ a("span", { className: o.flexHorizontalCenter, children: s })
       ]
     }
   );
 };
 export {
-  C as Button
+  $ as Button
 };

package/dist/components/checkbox/Checkbox.js

@@ -1,47 +1,47 @@
-import { jsx as s } from "react/jsx-runtime";
-import { useState as x } from "react";
+import { jsx as h } from "react/jsx-runtime";
+import { useState as b } from "react";
 import { useTheme as m } from "../theme/ThemeContext.js";
-import '../../styles/Checkbox.css';const n = "_checkbox_1cb1z_21", r = "_checked_1cb1z_32", z = "_disabled_1cb1z_44", e = {
+import '../../styles/Checkbox.css';const n = "_checkbox_hj8dh_23", r = "_checked_hj8dh_34", j = "_disabled_hj8dh_46", e = {
   checkbox: n,
-  "dark-mode": "_dark-mode_1cb1z_29",
+  "dark-mode": "_dark-mode_hj8dh_31",
   checked: r,
-  disabled: z,
-  "checkbox-size-s": "_checkbox-size-s_1cb1z_58",
-  "checkbox-size-m": "_checkbox-size-m_1cb1z_63",
-  "checkbox-size-l": "_checkbox-size-l_1cb1z_68",
-  "checkbox-size-xl": "_checkbox-size-xl_1cb1z_73"
-}, g = ({
-  checked: h = !1,
-  icon: t = /* @__PURE__ */ s("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "32", viewBox: "0 0 256 256", children: /* @__PURE__ */ s(
+  disabled: j,
+  "checkbox-size-s": "_checkbox-size-s_hj8dh_60",
+  "checkbox-size-m": "_checkbox-size-m_hj8dh_65",
+  "checkbox-size-l": "_checkbox-size-l_hj8dh_70",
+  "checkbox-size-xl": "_checkbox-size-xl_hj8dh_75"
+}, p = ({
+  checked: d = !1,
+  icon: t = /* @__PURE__ */ h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "32", viewBox: "0 0 256 256", children: /* @__PURE__ */ h(
     "path",
     {
       d: "M229.66,77.66l-128,128a8,8,0,0,1-11.32,0l-56-56a8,8,0,0,1,11.32-11.32L96,188.69,218.34,66.34a8,8,0,0,1,11.32,11.32Z"
     }
   ) }),
-  size: b = "m",
-  disabled: i = !1,
-  onChange: o
+  size: i = "m",
+  disabled: k = !1,
+  onChange: s
 }) => {
-  const { mode: k } = m(), [c, _] = x(h), a = () => {
-    const d = !c;
-    _(d), o && o(d);
-  }, l = [
+  const { mode: _ } = m(), [c, a] = b(d), l = () => {
+    const o = !c;
+    a(o), s && s(o);
+  }, x = [
     e.checkbox,
-    e[`checkbox-size-${b}`],
+    e[`checkbox-size-${i}`],
     c && e.checked,
-    i && e.disabled,
-    k === "dark" && e["dark-mode"]
+    k && e.disabled,
+    _ === "dark" && e["dark-mode"]
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ s(
+  return /* @__PURE__ */ h(
     "div",
     {
       "data-testid": "checkbox",
-      className: l,
-      onClick: a,
+      className: x,
+      onClick: l,
       children: c && t
     }
   );
 };
 export {
-  g as Checkbox
+  p as Checkbox
 };

package/dist/components/icon-button/IconButton.d.ts

@@ -1,5 +1,5 @@
 import { FC, ReactElement } from 'react';
-import { Color } from '../interface';
+import { Color, Size } from '../interface';
 
 export interface IconButtonProps {
     /** Specifies the visual style of the button. */
@@ -9,7 +9,7 @@ export interface IconButtonProps {
     /** what mode do you use for light or dark color **/
     colorMode?: 'light' | 'dark';
     /** How large should the button be? */
-    size?: 's' | 'm' | 'l' | 'xl';
+    size?: Size | 'menu';
     /** If true, the button will have rounded corners. */
     round?: boolean;
     /** If true, the button will be styled to indicate an error state. */

package/dist/components/icon-button/IconButton.js

@@ -1,58 +1,59 @@
-import { jsx as y } from "react/jsx-runtime";
-import { useEffect as d } from "react";
-import { useTheme as p } from "../theme/ThemeContext.js";
-import '../../styles/IconButton.css';const x = "_button_1v64m_21", z = "_flexHorizontalCenter_1v64m_158", o = {
-  button: x,
-  "button-round": "_button-round_1v64m_49",
-  "button-primary": "_button-primary_1v64m_52",
-  "button-secondary": "_button-secondary_1v64m_65",
-  "button-tertiary": "_button-tertiary_1v64m_79",
-  "button-ghost": "_button-ghost_1v64m_93",
-  "button-text": "_button-text_1v64m_106",
-  "button-text-selected": "_button-text-selected_1v64m_118",
-  "button-error": "_button-error_1v64m_124",
-  "button-size-xl": "_button-size-xl_1v64m_137",
-  "button-size-l": "_button-size-l_1v64m_142",
-  "button-size-m": "_button-size-m_1v64m_147",
-  "button-size-s": "_button-size-s_1v64m_152",
-  flexHorizontalCenter: z
+import { jsx as g } from "react/jsx-runtime";
+import { useEffect as y } from "react";
+import { useTheme as d } from "../theme/ThemeContext.js";
+import '../../styles/IconButton.css';const z = "_button_16ptg_23", v = "_flexHorizontalCenter_16ptg_168", o = {
+  button: z,
+  "button-round": "_button-round_16ptg_50",
+  "button-primary": "_button-primary_16ptg_53",
+  "button-secondary": "_button-secondary_16ptg_66",
+  "button-tertiary": "_button-tertiary_16ptg_80",
+  "button-ghost": "_button-ghost_16ptg_94",
+  "button-icon": "_button-icon_16ptg_107",
+  "button-icon-selected": "_button-icon-selected_16ptg_119",
+  "button-error": "_button-error_16ptg_128",
+  "button-size-xl": "_button-size-xl_16ptg_141",
+  "button-size-l": "_button-size-l_16ptg_146",
+  "button-size-m": "_button-size-m_16ptg_151",
+  "button-size-s": "_button-size-s_16ptg_156",
+  "button-size-menu": "_button-size-menu_16ptg_161",
+  flexHorizontalCenter: v
 }, $ = ({
   mode: e = "primary",
   color: t,
   colorMode: r,
   size: i = "m",
-  error: a,
-  selected: u,
+  error: u,
+  selected: a,
   round: s,
-  disabled: m,
-  children: _,
-  onClick: b
+  disabled: _,
+  children: b,
+  onClick: l
 }) => {
-  const { mode: n } = p(), l = () => a ? "error" : e;
-  d(() => {
+  const { mode: n } = d(), c = () => u ? "error" : e;
+  y(() => {
     r && !t && console.warn("`colorMode` is defined but `color` is missing. `colorMode` will be ignored.");
   }, [t]);
-  const c = [
+  const m = [
     o.button,
-    o[`button-${l()}`],
+    o[`button-${c()}`],
     s && o["button-round"],
     o[`button-size-${i}`],
-    u && e === "icon" && o["button-text-selected"],
+    a && e === "icon" && o["button-icon-selected"],
     o.flexHorizontalCenter
-  ].join(" "), v = {
+  ].join(" "), p = {
     "--dynamic-color-text": t ? r === "dark" ? "var(--primary-color-900)" : "var(--color-light-100)" : n === "light" ? "var(--color-light-100)" : "var(--primary-color-900)",
     "--dynamic-color": t ? `var(--color-${t}-${r === "dark" ? "200" : "900"})` : "var(--primary-color)",
     "--dynamic-color-hover": t ? `var(--color-${t}-${r === "dark" ? "100" : "800"})` : n === "light" ? "var(--primary-color-800)" : "var(--primary-color-100)",
     "--dynamic-color-activated": t ? `var(--color-${t}-${r === "dark" ? "50" : "700"})` : n === "light" ? "var(--primary-color-700)" : "var(--primary-color-50)"
   };
-  return /* @__PURE__ */ y(
+  return /* @__PURE__ */ g(
     "button",
     {
-      className: c,
-      style: v,
-      onClick: b,
-      disabled: m,
-      children: _
+      className: m,
+      style: p,
+      onClick: l,
+      disabled: _,
+      children: b
     }
   );
 };

package/dist/components/input/Input.d.ts

@@ -6,8 +6,6 @@ export interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
     sizeStyle?: Size;
     /** input status style **/
     status?: 'default' | 'error' | 'success' | 'secondary' | 'ghost';
-    /** The label or placeholder text for the input field **/
-    label: string;
     /** Optional unit or additional label to display next to the input **/
     labelUnit?: string;
     /** If true, the input will have rounded corners **/

package/dist/components/input/Input.js

@@ -1,86 +1,89 @@
-import { jsxs as a, jsx as s, Fragment as c } from "react/jsx-runtime";
-import { useState as y, useRef as j } from "react";
+import { jsxs as y, jsx as s, Fragment as p } from "react/jsx-runtime";
+import { useState as d, useRef as _ } from "react";
 import { useTheme as N } from "../theme/ThemeContext.js";
-import '../../styles/Input.css';const k = "_flexHorizontalBetween_115tz_153", I = "_flexHorizontal_115tz_153", t = {
-  "input-style": "_input-style_115tz_37",
-  "input-style-disabled": "_input-style-disabled_115tz_49",
-  "input-style-focused": "_input-style-focused_115tz_60",
-  "input-style-secondary": "_input-style-secondary_115tz_68",
-  "input-style-ghost": "_input-style-ghost_115tz_82",
-  "input-style-error": "_input-style-error_115tz_85",
-  "input-style-success": "_input-style-success_115tz_95",
-  "input-container": "_input-container_115tz_105",
-  "input-style-size-xl": "_input-style-size-xl_115tz_109",
-  "input-style-size-l": "_input-style-size-l_115tz_119",
-  "input-style-size-m": "_input-style-size-m_115tz_129",
-  "input-style-size-s": "_input-style-size-s_115tz_139",
-  "input-style-radius": "_input-style-radius_115tz_149",
-  flexHorizontalBetween: k,
-  flexHorizontal: I
+import '../../styles/Input.css';const I = "_flexHorizontalBetween_8cbxu_156", $ = "_flexHorizontal_8cbxu_156", e = {
+  "input-style": "_input-style_8cbxu_40",
+  "input-style-disabled": "_input-style-disabled_8cbxu_52",
+  "input-style-focused": "_input-style-focused_8cbxu_63",
+  "input-style-secondary": "_input-style-secondary_8cbxu_71",
+  "input-style-ghost": "_input-style-ghost_8cbxu_85",
+  "input-style-error": "_input-style-error_8cbxu_88",
+  "input-style-success": "_input-style-success_8cbxu_98",
+  "input-container": "_input-container_8cbxu_108",
+  "input-style-size-xl": "_input-style-size-xl_8cbxu_112",
+  "input-style-size-l": "_input-style-size-l_8cbxu_122",
+  "input-style-size-m": "_input-style-size-m_8cbxu_132",
+  "input-style-size-s": "_input-style-size-s_8cbxu_142",
+  "input-style-radius": "_input-style-radius_8cbxu_152",
+  flexHorizontalBetween: I,
+  flexHorizontal: $
 }, M = ({
-  sizeStyle: p = "m",
-  label: d,
-  labelUnit: n,
-  status: l = "default",
-  childrenLeft: o,
-  childrenRight: i,
-  round: _,
+  sizeStyle: f = "m",
+  labelUnit: o,
+  status: n = "default",
+  childrenLeft: i,
+  childrenRight: u,
+  round: x,
   disabled: r,
-  defaultValue: z,
-  ...h
+  defaultValue: h,
+  ...m
 }) => {
-  const { mode: e } = N(), [f, u] = y(!1), [m, g] = y(z || ""), v = j(null), x = () => u(!0), B = () => u(!1), H = (F) => {
-    g(F.target.value);
-  }, b = [
-    t["input-style"],
-    t[`input-style-size-${p}`],
-    _ && t["input-style-radius"],
-    t.flexHorizontalBetween
-  ].filter(Boolean).join(" "), S = [
-    f && t["input-style-focused"],
-    r && t["input-style-disabled"],
-    l === "secondary" && t["input-style-secondary"],
-    l === "ghost" && t["input-style-ghost"]
-  ].filter(Boolean).join(" "), w = () => {
-    switch (l) {
+  const { mode: t } = N(), [b, c] = d(!1), [g, z] = d(h || ""), v = _(null), a = _(null), B = () => c(!0), C = () => c(!1), H = (l) => {
+    z(l.target.value);
+  }, S = () => {
+    var l;
+    (l = a.current) == null || l.focus();
+  }, k = [
+    e["input-style"],
+    e[`input-style-size-${f}`],
+    x && e["input-style-radius"],
+    e.flexHorizontalBetween
+  ].filter(Boolean).join(" "), w = [
+    b && e["input-style-focused"],
+    r && e["input-style-disabled"],
+    n === "secondary" && e["input-style-secondary"],
+    n === "ghost" && e["input-style-ghost"]
+  ].filter(Boolean).join(" "), F = () => {
+    switch (n) {
       case "error":
-        return t["input-style-error"];
+        return e["input-style-error"];
       case "success":
-        return t["input-style-success"];
+        return e["input-style-success"];
       default:
-        return S;
+        return w;
     }
-  }, C = {
-    "--dynamic-color": e === "light" ? "var(--color-blue-grey-400)" : "var(--color-blue-grey-200)",
-    "--dynamic-color-activated": e === "light" ? "var(--color-dark-100)" : "var(--color-light-100)",
-    "--dynamic-color-disabled": e === "light" ? "var(--color-dark-40)" : "var(--color-light-40)",
-    "--dynamic-color-border-disabled": e === "light" ? "var(--color-dark-10)" : "var(--color-light-10)",
-    "--dynamic-color-secondary": e === "light" ? "var(--color-blue-situaction-900)" : "var(--color-light-100)"
+  }, j = {
+    "--dynamic-color": t === "light" ? "var(--color-blue-grey-400)" : "var(--color-blue-grey-200)",
+    "--dynamic-color-activated": t === "light" ? "var(--color-dark-100)" : "var(--color-light-100)",
+    "--dynamic-color-disabled": t === "light" ? "var(--color-dark-40)" : "var(--color-light-40)",
+    "--dynamic-color-border-disabled": t === "light" ? "var(--color-dark-10)" : "var(--color-light-10)",
+    "--dynamic-color-secondary": t === "light" ? "var(--color-blue-situaction-900)" : "var(--color-light-100)"
   };
-  return /* @__PURE__ */ a(
+  return /* @__PURE__ */ y(
     "div",
     {
       ref: v,
-      className: `input-style ${b} ${w()}`,
-      onFocus: x,
-      onBlur: B,
-      style: C,
+      className: `input-style ${k} ${F()}`,
+      onFocus: B,
+      onBlur: C,
+      onClick: S,
+      style: j,
       children: [
-        o && /* @__PURE__ */ s(c, { children: o }),
-        /* @__PURE__ */ s("div", { className: t["input-container"], children: /* @__PURE__ */ s(
+        i && /* @__PURE__ */ s(p, { children: i }),
+        /* @__PURE__ */ s("div", { className: e["input-container"], children: /* @__PURE__ */ s(
           "input",
           {
             autoCorrect: "false",
-            placeholder: d,
             disabled: r,
-            value: m,
+            value: g,
             onChange: H,
-            ...h
+            ref: a,
+            ...m
           }
         ) }),
-        /* @__PURE__ */ a(c, { children: [
-          n && /* @__PURE__ */ s("div", { children: n }),
-          i && /* @__PURE__ */ s("span", { className: t.flexHorizontal, children: i })
+        /* @__PURE__ */ y(p, { children: [
+          o && /* @__PURE__ */ s("div", { children: o }),
+          u && /* @__PURE__ */ s("span", { className: e.flexHorizontal, children: u })
         ] })
       ]
     }

package/dist/components/select/Select.d.ts

@@ -0,0 +1,20 @@
+import { FC } from 'react';
+
+interface Option {
+    value: string | number;
+    label: string;
+}
+export interface SelectProps {
+    /** options to display ( label with a value ) **/
+    options: Option[];
+    /** label to display when selected **/
+    placeholder: string;
+    /** function for taking back the selected value **/
+    onChange?: (value: string | number) => void;
+    /** disable option **/
+    disabled?: boolean;
+    /** options to display on top or bottom **/
+    top?: boolean;
+}
+export declare const Select: FC<SelectProps>;
+export {};

package/dist/components/select/Select.js

@@ -0,0 +1,76 @@
+import { jsxs as v, jsx as s } from "react/jsx-runtime";
+import { useState as r, useRef as g, useEffect as w } from "react";
+import { Button as S } from "../button/Button.js";
+import { useTheme as k } from "../theme/ThemeContext.js";
+import '../../styles/Select.css';const b = "_customSelect_e5r04_40", x = "_selectOptions_e5r04_46", N = "_option_e5r04_70", t = {
+  customSelect: b,
+  selectOptions: x,
+  "selectOptions-top": "_selectOptions-top_e5r04_54",
+  "selectOptions-bottom": "_selectOptions-bottom_e5r04_57",
+  "selectOptions-dark": "_selectOptions-dark_e5r04_60",
+  "selectOptions-light": "_selectOptions-light_e5r04_63",
+  "selectOptions-s": "_selectOptions-s_e5r04_66",
+  option: N,
+  "icon-size-s": "_icon-size-s_e5r04_98"
+}, E = ({
+  options: a,
+  placeholder: p = "",
+  onChange: n,
+  disabled: d,
+  top: m = !1
+  // size = "m",
+}) => {
+  const { mode: _ } = k(), [o, l] = r(!1), [c, u] = r(null), i = g(null);
+  w(() => {
+    const e = (f) => {
+      i.current && !i.current.contains(f.target) && l(!1);
+    };
+    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+  }, []);
+  const O = () => [
+    t.selectOptions,
+    _ === "dark" ? t["selectOptions-dark"] : t["selectOptions-light"],
+    m ? t["selectOptions-top"] : t["selectOptions-bottom"],
+    t["selectOptions-s"]
+  ].join(" "), h = (e) => {
+    u(e), l(!1), n && n(e.value);
+  };
+  return /* @__PURE__ */ v("div", { className: `${t.customSelect}`, children: [
+    /* @__PURE__ */ s(
+      S,
+      {
+        onClick: () => l(!o),
+        disabled: d,
+        size: "s",
+        mode: "tertiary",
+        childrenRight: /* @__PURE__ */ s(
+          "svg",
+          {
+            className: t["icon-size-s"],
+            style: {
+              transition: ".3s",
+              rotate: o ? "180deg" : "0deg"
+            },
+            xmlns: "http://www.w3.org/2000/svg",
+            viewBox: "0 0 256 256",
+            children: /* @__PURE__ */ s("path", { d: "M213.66,101.66l-80,80a8,8,0,0,1-11.32,0l-80-80A8,8,0,0,1,53.66,90.34L128,164.69l74.34-74.35a8,8,0,0,1,11.32,11.32Z" })
+          }
+        ),
+        label: c ? c.label : p
+      }
+    ),
+    o && /* @__PURE__ */ s("div", { className: O(), children: a.map((e) => /* @__PURE__ */ s(
+      "div",
+      {
+        className: t.option,
+        role: "option",
+        onClick: () => h(e),
+        children: e.label
+      },
+      e.value
+    )) })
+  ] });
+};
+export {
+  E as Select
+};

package/dist/components/tabs/Tabs.d.ts

@@ -1,11 +1,15 @@
-import { FC } from 'react';
+import { FC, ReactNode } from 'react';
 
 export interface TabsProps {
+    /** select the type of data text or icon that we put in tabs */
+    type: 'text' | 'icon';
     /** Array of strings representing the labels of the tabs */
-    listItems: string[];
+    listItems: (string | ReactNode)[];
     /** Index of the tab that should be active by default */
     defaultActiveTab?: number;
+    /** Position Tabs */
+    position?: 'center' | 'right' | 'left';
     /** Callback function to handle tab selection, receiving the selected tab's label */
-    onTabSelect: (selectedItem: string) => void;
+    onTabSelect: (selectedItem: string | ReactNode) => void;
 }
 export declare const Tabs: FC<TabsProps>;

package/dist/components/tabs/Tabs.js

@@ -1,39 +1,54 @@
-import { jsxs as h, jsx as n } from "react/jsx-runtime";
-import { useState as u, useRef as a, useLayoutEffect as g } from "react";
-import { Button as v } from "../button/Button.js";
-import '../../styles/Tabs.css';const y = "_underline_eo8ix_34", $ = "_flexHorizontal_eo8ix_42", l = {
-  "tab-container": "_tab-container_eo8ix_21",
-  "tab-items": "_tab-items_eo8ix_28",
-  underline: y,
-  flexHorizontal: $
-}, w = ({ listItems: o, onTabSelect: f, defaultActiveTab: d = 0 }) => {
-  const [r, b] = u(d), [x, m] = u({}), i = a(null), _ = a(null), s = a(new Array(o.length).fill(null)), p = (e) => {
-    b(e), f(o[e]);
-  }, R = (e) => {
-    if (i.current && e) {
-      const t = e.getBoundingClientRect(), c = i.current.getBoundingClientRect();
-      m({
-        left: `${t.left - c.left}px`,
+import { jsxs as z, jsx as n } from "react/jsx-runtime";
+import { useState as u, useRef as a, useLayoutEffect as R } from "react";
+import { Button as y } from "../button/Button.js";
+import { IconButton as H } from "../icon-button/IconButton.js";
+import '../../styles/Tabs.css';const C = "_underline_118wv_33", o = {
+  "tab-container": "_tab-container_118wv_23",
+  "tab-items": "_tab-items_118wv_28",
+  underline: C,
+  "flexHorizontal-center": "_flexHorizontal-center_118wv_41",
+  "flexHorizontal-left": "_flexHorizontal-left_118wv_47",
+  "flexHorizontal-right": "_flexHorizontal-right_118wv_53"
+}, j = ({ listItems: r, type: d, onTabSelect: _, defaultActiveTab: m = 0, position: b = "left" }) => {
+  const [l, x] = u(m), [v, h] = u({}), c = a(null), p = a(null), s = a(new Array(r.length).fill(null)), f = (e) => {
+    x(e), _(r[e]);
+  }, w = (e) => {
+    if (c.current && e) {
+      const t = e.getBoundingClientRect(), i = c.current.getBoundingClientRect();
+      h({
+        left: `${t.left - i.left}px`,
         width: `${t.width}px`
       });
     }
-  };
-  return g(() => {
-    const e = s.current[r];
-    e && R(e);
-  }, [r]), /* @__PURE__ */ h("div", { className: `tab ${l["tab-container"]}`, ref: i, children: [
-    /* @__PURE__ */ n("div", { className: `${l.flexHorizontal} ${l["tab-items"]}`, children: o.map((e, t) => /* @__PURE__ */ n("div", { ref: (c) => s.current[t] = c, children: /* @__PURE__ */ n(
-      v,
+  }, g = [
+    o[`flexHorizontal-${b}`],
+    o["tab-items"]
+  ].filter(Boolean).join(" ");
+  return R(() => {
+    const e = s.current[l];
+    e && w(e);
+  }, [l]), /* @__PURE__ */ z("div", { className: `tab ${o["tab-container"]}`, ref: c, children: [
+    /* @__PURE__ */ n("div", { className: g, children: r.map((e, t) => /* @__PURE__ */ n("div", { ref: (i) => s.current[t] = i, children: d === "text" ? /* @__PURE__ */ n(
+      y,
       {
         label: e,
         mode: "text",
-        selected: t === r,
-        onClick: () => p(t)
+        selected: t === l,
+        onClick: () => f(t)
+      }
+    ) : /* @__PURE__ */ n(
+      H,
+      {
+        mode: "icon",
+        size: "s",
+        selected: t === l,
+        onClick: () => f(t),
+        children: e
       }
     ) }, t)) }),
-    /* @__PURE__ */ n("div", { ref: _, className: l.underline, style: x })
+    /* @__PURE__ */ n("div", { ref: p, className: o.underline, style: v })
   ] });
 };
 export {
-  w as Tabs
+  j as Tabs
 };

package/dist/components/tag-counter/TagCounter.js

@@ -1,19 +1,19 @@
 import { jsx as a } from "react/jsx-runtime";
-import { useTheme as n } from "../theme/ThemeContext.js";
-import '../../styles/TagCounter.css';const t = {
-  "tag-counter": "_tag-counter_12ztz_21",
-  "dark-mode": "_dark-mode_12ztz_32",
-  "tag-counter-size-xl": "_tag-counter-size-xl_12ztz_36",
-  "tag-counter-size-l": "_tag-counter-size-l_12ztz_43",
-  "tag-counter-size-m": "_tag-counter-size-m_12ztz_50",
-  "tag-counter-size-s": "_tag-counter-size-s_12ztz_57"
-}, _ = ({ label: e, size: o = "m" }) => {
-  const { mode: r } = n(), s = [
-    t["tag-counter"],
-    t[`tag-counter-size-${o}`],
-    r === "dark" && t["dark-mode"]
+import { useTheme as u } from "../theme/ThemeContext.js";
+import '../../styles/TagCounter.css';const e = {
+  "tag-counter": "_tag-counter_1wqu5_23",
+  "dark-mode": "_dark-mode_1wqu5_34",
+  "tag-counter-size-xl": "_tag-counter-size-xl_1wqu5_38",
+  "tag-counter-size-l": "_tag-counter-size-l_1wqu5_45",
+  "tag-counter-size-m": "_tag-counter-size-m_1wqu5_52",
+  "tag-counter-size-s": "_tag-counter-size-s_1wqu5_59"
+}, _ = ({ label: t, size: o = "m" }) => {
+  const { mode: r } = u(), s = [
+    e["tag-counter"],
+    e[`tag-counter-size-${o}`],
+    r === "dark" && e["dark-mode"]
   ].join(" ");
-  return /* @__PURE__ */ a("div", { className: s, children: e });
+  return /* @__PURE__ */ a("div", { className: s, children: t });
 };
 export {
   _ as TagCounter

package/dist/components/tooltip/Tooltip.js

@@ -1,19 +1,19 @@
-import { jsxs as d, jsx as h } from "react/jsx-runtime";
+import { jsxs as h, jsx as b } from "react/jsx-runtime";
 import { useState as _ } from "react";
-import { useTheme as u } from "../theme/ThemeContext.js";
-import '../../styles/Tooltip.css';const x = "_tooltip_1w7yx_21", o = {
-  "tooltip-container": "_tooltip-container_1w7yx_21",
-  tooltip: x,
-  "tooltip-dark": "_tooltip-dark_1w7yx_42",
-  "tooltip-light": "_tooltip-light_1w7yx_47"
-}, k = ({ children: s, content: a, colorMode: e, position: n = "top", gap: r = "xs-5", padding: p = "xs-5" }) => {
-  const [c, l] = _(!1), { mode: m } = u(), f = [
+import { useTheme as y } from "../theme/ThemeContext.js";
+import '../../styles/Tooltip.css';const u = "_tooltip_wpb50_23", o = {
+  "tooltip-container": "_tooltip-container_wpb50_23",
+  tooltip: u,
+  "tooltip-dark": "_tooltip-dark_wpb50_44",
+  "tooltip-light": "_tooltip-light_wpb50_49"
+}, k = ({ children: s, content: a, colorMode: e, position: p = "top", gap: n = "xs-5", padding: r = "xs-5" }) => {
+  const [c, l] = _(!1), { mode: m } = y(), f = [
     o.tooltip,
     o[e ? `tooltip-${e}` : m === "light" ? "tooltip-light" : "tooltip-dark"]
   ].filter(Boolean).join(" "), g = {
-    "--dynamic-gap": `var(--spacing-${r})`,
-    "--dynamic-padding": `var(--spacing-${p})`
-  }, y = () => {
+    "--dynamic-gap": `var(--spacing-${n})`,
+    "--dynamic-padding": `var(--spacing-${r})`
+  }, d = () => {
     const t = "calc(100% + var(--dynamic-gap))", i = {
       top: { bottom: t, left: "50%", transform: "translateX(-50%)" },
       topLeft: { bottom: t, right: "100%" },
@@ -24,9 +24,9 @@ import '../../styles/Tooltip.css';const x = "_tooltip_1w7yx_21", o = {
       left: { top: "50%", right: t, transform: "translateY(-50%)" },
       right: { top: "50%", left: t, transform: "translateY(-50%)" }
     };
-    return { ...i[n] || i.top };
+    return { ...i[p] || i.top };
   };
-  return /* @__PURE__ */ d(
+  return /* @__PURE__ */ h(
     "div",
     {
       className: o["tooltip-container"],
@@ -35,7 +35,7 @@ import '../../styles/Tooltip.css';const x = "_tooltip_1w7yx_21", o = {
       onMouseLeave: () => l(!1),
       children: [
         s,
-        c && /* @__PURE__ */ h("div", { className: f, style: y(), children: a })
+        c && /* @__PURE__ */ b("div", { className: f, style: d(), children: a })
       ]
     }
   );

package/dist/styles/Button.css

@@ -1 +1 @@
-@font-face{font-family:Urbanist-Thin;src:url(../fonts/Urbanist-Thin.ttf) format("truetype");font-weight:100;font-style:normal}@font-face{font-family:Urbanist-Extra-Light;src:url(../fonts/Urbanist-ExtraLight.ttf) format("truetype");font-weight:200;font-style:normal}@font-face{font-family:Urbanist-Light;src:url(../fonts/Urbanist-Light.ttf) format("truetype");font-weight:300;font-style:normal}@font-face{font-family:Urbanist-Regular;src:url(../fonts/Urbanist-Regular.ttf) format("truetype");font-weight:400;font-style:normal}@font-face{font-family:Urbanist;src:url(../fonts/Urbanist-Medium.ttf) format("truetype");font-weight:500;font-style:normal}@font-face{font-family:Urbanist-Back;src:url(../fonts/Urbanist-Black.ttf) format("truetype");font-weight:600;font-style:normal}@font-face{font-family:Urbanist-Semi-Bold;src:url(../fonts/Urbanist-SemiBold.ttf) format("truetype");font-weight:700;font-style:normal}@font-face{font-family:Urbanist-Bold;src:url(../fonts/Urbanist-Bold.ttf) format("truetype");font-weight:800;font-style:normal}@font-face{font-family:Urbanist-Extra-Bold;src:url(../fonts/Urbanist-ExtraBold.ttf) format("truetype");font-weight:900;font-style:normal}:root,body{font-family:Urbanist,sans-serif;line-height:1;width:100vw;height:100vh}._button_1031d_21{font-family:var(--font-family);font-weight:500;border:0;cursor:pointer;width:fit-content}._button_1031d_21:focus-visible{outline:2px solid var(--dynamic-color);outline-offset:2px}._button_1031d_21:disabled{background-color:#0f0f0f0d;color:#0f0f0f66;border:1px solid rgba(15,15,15,.1);cursor:initial;pointer-events:none}._button_1031d_21:disabled *{fill:#0f0f0f66}._button-primary_1031d_43{color:var(--dynamic-color-text);background-color:var(--dynamic-color)}._button-primary_1031d_43:hover{background-color:var(--dynamic-color-hover)}._button-primary_1031d_43:active{background-color:var(--dynamic-color-activated);outline:none}._button-primary_1031d_43 *{fill:var(--dynamic-color-text)}._button-secondary_1031d_57{color:var(--color-text);background-color:#96b4ee33;border:1px solid rgba(150,180,238,.5)}._button-secondary_1031d_57:hover{background-color:#96b4ee66}._button-secondary_1031d_57:active{background-color:#96b4ee99}._button-secondary_1031d_57 *{fill:var(--color-text)}._button-tertiary_1031d_71{color:var(--color-text);background-color:transparent;border:1px solid rgba(150,180,238,.5)}._button-tertiary_1031d_71:hover{background-color:#96b4ee1a}._button-tertiary_1031d_71:active{background-color:#96b4ee33}._button-tertiary_1031d_71 *{fill:var(--color-text)}._button-ghost_1031d_85{color:var(--color-text);background-color:transparent}._button-ghost_1031d_85:hover{background-color:#96b4ee1a}._button-ghost_1031d_85:active{background-color:#96b4ee33}._button-ghost_1031d_85:disabled{border:none}._button-ghost_1031d_85 *{fill:var(--color-text)}._button-text_1031d_101{color:#96b4eecc;background-color:transparent;padding:0!important}._button-text_1031d_101:hover{color:#96b4ee}._button-text_1031d_101:disabled{border:none;background-color:transparent;color:#a5b4bb}._button-text-selected_1031d_114,._button-text-selected_1031d_114:hover{color:var(--color-text)}._button-error_1031d_120{color:#fff;background-color:#ff4747}._button-error_1031d_120:hover{background-color:#ed1515}._button-error_1031d_120:active{background-color:#c80d0d}._button-error_1031d_120 *{fill:var(--color-text)}._button-size-xl_1031d_133{padding:1rem 2rem;font-size:1.125em;line-height:28px;border-radius:8px}._button-size-l_1031d_139{padding:.75rem 1.5rem;font-size:1em;line-height:24px;border-radius:8px}._button-size-m_1031d_145{padding:.5rem 1rem;font-size:.875em;line-height:22px;border-radius:4px}._button-size-s_1031d_151{padding:.375rem .75rem;font-size:.75em;line-height:16px;border-radius:4px}._button-gap-xl_1031d_157{gap:12px}._button-gap-l_1031d_160{gap:8px}._button-gap-m_1031d_163,._button-gap-s_1031d_163{gap:4px}._flexHorizontalCenter_1031d_167{display:flex;justify-content:center;align-items:center;flex-direction:row}
+@font-face{font-family:Urbanist-Thin;src:url(../fonts/Urbanist-Thin.ttf) format("truetype");font-weight:100;font-style:normal}@font-face{font-family:Urbanist-Extra-Light;src:url(../fonts/Urbanist-ExtraLight.ttf) format("truetype");font-weight:200;font-style:normal}@font-face{font-family:Urbanist-Light;src:url(../fonts/Urbanist-Light.ttf) format("truetype");font-weight:300;font-style:normal}@font-face{font-family:Urbanist-Regular;src:url(../fonts/Urbanist-Regular.ttf) format("truetype");font-weight:400;font-style:normal}@font-face{font-family:Urbanist;src:url(../fonts/Urbanist-Medium.ttf) format("truetype");font-weight:500;font-style:normal}@font-face{font-family:Urbanist-Back;src:url(../fonts/Urbanist-Black.ttf) format("truetype");font-weight:600;font-style:normal}@font-face{font-family:Urbanist-Semi-Bold;src:url(../fonts/Urbanist-SemiBold.ttf) format("truetype");font-weight:700;font-style:normal}@font-face{font-family:Urbanist-Bold;src:url(../fonts/Urbanist-Bold.ttf) format("truetype");font-weight:800;font-style:normal}@font-face{font-family:Urbanist-Extra-Bold;src:url(../fonts/Urbanist-ExtraBold.ttf) format("truetype");font-weight:900;font-style:normal}:root,body{font-family:Urbanist,sans-serif;line-height:1;width:100vw;height:100vh}h1{font-size:1.875em;font-style:normal;font-weight:700;line-height:2.25rem}h2{font-size:1.5em;font-style:normal;font-weight:700;line-height:2rem;margin:0}h3{font-size:1.25em;font-style:normal;font-weight:700;line-height:1.75rem;margin:0}h4{font-size:1.125em;font-style:normal;font-weight:700;line-height:1.75rem;margin:0}h5{font-size:1em;font-style:normal;font-weight:700;line-height:1.5rem;margin:0}h6{font-size:.875em;font-style:normal;font-weight:700;line-height:1.25rem;margin:0}.textExtraLarge{font-size:1.25em;font-style:normal;line-height:2rem}.textLarge{font-size:1.125em;font-style:normal;line-height:1.75rem}.textMedium{font-size:1em;font-style:normal;line-height:1.5rem}.textSmall{font-size:.875em;font-style:normal;line-height:1.25rem}.textSmaller{font-size:.75em;font-style:normal;line-height:1rem}.labelExtraLarge{font-size:1.25em;font-style:normal;line-height:normal;letter-spacing:1.2px}.labelLarge{font-size:1.125em;font-style:normal;line-height:normal;letter-spacing:1.08px}.labelMedium{font-size:1em;font-style:normal;line-height:normal;letter-spacing:.96px}.labelSmall{font-size:.875em;font-style:normal;line-height:normal;letter-spacing:.84px}.labelSmaller{font-size:.75em;font-style:normal;line-height:normal;letter-spacing:.72px}.labelSmallest{font-size:.625em;font-style:normal;line-height:normal;letter-spacing:.6px}.fontWeight-100{font-weight:100}.fontWeight-200{font-weight:200}.fontWeight-300{font-weight:300}.fontWeight-400{font-weight:400}.fontWeight-500{font-weight:500}.fontWeight-600{font-weight:600}.fontWeight-700{font-weight:700}.fontWeight-800{font-weight:800}.fontWeight-900{font-weight:900}._button_138cw_23{font-family:var(--font-family);font-weight:500;border:0;cursor:pointer;width:fit-content}._button_138cw_23:focus-visible{outline:2px solid var(--dynamic-color);outline-offset:2px}._button_138cw_23:disabled{background-color:#0f0f0f0d;color:#0f0f0f66;border:1px solid rgba(15,15,15,.1);cursor:initial;pointer-events:none}._button_138cw_23:disabled *{fill:#0f0f0f66}._button-primary_138cw_45{color:var(--dynamic-color-text);background-color:var(--dynamic-color)}._button-primary_138cw_45:hover{background-color:var(--dynamic-color-hover)}._button-primary_138cw_45:active{background-color:var(--dynamic-color-activated);outline:none}._button-primary_138cw_45 *{fill:var(--dynamic-color-text)}._button-secondary_138cw_59{color:var(--color-text);background-color:#96b4ee33;border:1px solid rgba(150,180,238,.5)}._button-secondary_138cw_59:hover{background-color:#96b4ee66}._button-secondary_138cw_59:active{background-color:#96b4ee99}._button-secondary_138cw_59 *{fill:var(--color-text)}._button-tertiary_138cw_73{color:var(--color-text);background-color:transparent;border:1px solid rgba(150,180,238,.5)}._button-tertiary_138cw_73:hover{background-color:#96b4ee1a}._button-tertiary_138cw_73:active{background-color:#96b4ee33}._button-tertiary_138cw_73 *{fill:var(--color-text)}._button-ghost_138cw_87{color:var(--color-text);background-color:transparent}._button-ghost_138cw_87:hover{background-color:#96b4ee1a}._button-ghost_138cw_87:active{background-color:#96b4ee33}._button-ghost_138cw_87:disabled{border:none}._button-ghost_138cw_87 *{fill:var(--color-text)}._button-text_138cw_103{color:#a5b4bb;background-color:transparent;padding:0!important}._button-text_138cw_103:hover{color:#788d98}._button-text_138cw_103:disabled{border:none;background-color:transparent;color:#a5b4bb}._button-text-selected_138cw_116,._button-text-selected_138cw_116:hover{color:var(--color-text)}._button-error_138cw_122{color:#fff;background-color:#ff4747}._button-error_138cw_122:hover{background-color:#ed1515}._button-error_138cw_122:active{background-color:#c80d0d}._button-error_138cw_122 *{fill:var(--color-text)}._button-size-xl_138cw_135{padding:1rem 2rem;font-size:1.125em;line-height:28px;border-radius:8px}._button-size-l_138cw_141{padding:.75rem 1.5rem;font-size:1em;line-height:24px;border-radius:8px}._button-size-m_138cw_147{padding:.5rem 1rem;font-size:.875em;line-height:22px;border-radius:4px}._button-size-s_138cw_153{padding:.375rem .75rem;font-size:.75em;line-height:16px;border-radius:4px}._button-size-menu_138cw_159{padding:.5rem;font-size:1em;line-height:24px;border-radius:4px}._button-gap-menu_138cw_165{gap:.5rem}._button-gap-xl_138cw_168{gap:12px}._button-gap-l_138cw_171{gap:8px}._button-gap-m_138cw_165,._button-gap-s_138cw_174{gap:4px}._flexHorizontalCenter_138cw_178{display:flex;justify-content:center;align-items:center;flex-direction:row}

package/dist/styles/Checkbox.css

@@ -1 +1 @@
-._checkbox_1cb1z_21{cursor:pointer;display:flex;align-items:center;justify-content:center;border:1px solid var(--primary-color-950);padding:.125rem}._checkbox_1cb1z_21._dark-mode_1cb1z_29{border:1px solid #FFF}._checkbox_1cb1z_21._checked_1cb1z_32{background-color:var(--primary-color-950)}._checkbox_1cb1z_21._checked_1cb1z_32 *{fill:#fff}._checkbox_1cb1z_21._checked_1cb1z_32._dark-mode_1cb1z_29{background-color:#fff}._checkbox_1cb1z_21._checked_1cb1z_32._dark-mode_1cb1z_29 *{fill:#09090b}._checkbox_1cb1z_21._disabled_1cb1z_44{border:1px solid rgba(15,15,15,.2);pointer-events:none}._checkbox_1cb1z_21._disabled_1cb1z_44._dark-mode_1cb1z_29{border:1px solid rgba(255,255,255,.2)}._checkbox_1cb1z_21._disabled_1cb1z_44._checked_1cb1z_32{border:1px solid transparent;background-color:#0f0f0f33}._checkbox_1cb1z_21._disabled_1cb1z_44._checked_1cb1z_32._dark-mode_1cb1z_29{background-color:#fff3}._checkbox-size-s_1cb1z_58{width:10px;height:10px;border-radius:.063rem}._checkbox-size-m_1cb1z_63{width:12px;height:12px;border-radius:.125rem}._checkbox-size-l_1cb1z_68{width:14px;height:14px;border-radius:.125rem}._checkbox-size-xl_1cb1z_73{width:16px;height:16px;border-radius:.125rem}
+._checkbox_hj8dh_23{cursor:pointer;display:flex;align-items:center;justify-content:center;border:1px solid var(--primary-color-950);padding:.125rem}._checkbox_hj8dh_23._dark-mode_hj8dh_31{border:1px solid #FFF}._checkbox_hj8dh_23._checked_hj8dh_34{background-color:var(--primary-color-950)}._checkbox_hj8dh_23._checked_hj8dh_34 *{fill:#fff}._checkbox_hj8dh_23._checked_hj8dh_34._dark-mode_hj8dh_31{background-color:#fff}._checkbox_hj8dh_23._checked_hj8dh_34._dark-mode_hj8dh_31 *{fill:#09090b}._checkbox_hj8dh_23._disabled_hj8dh_46{border:1px solid rgba(15,15,15,.2);pointer-events:none}._checkbox_hj8dh_23._disabled_hj8dh_46._dark-mode_hj8dh_31{border:1px solid rgba(255,255,255,.2)}._checkbox_hj8dh_23._disabled_hj8dh_46._checked_hj8dh_34{border:1px solid transparent;background-color:#0f0f0f33}._checkbox_hj8dh_23._disabled_hj8dh_46._checked_hj8dh_34._dark-mode_hj8dh_31{background-color:#fff3}._checkbox-size-s_hj8dh_60{width:10px;height:10px;border-radius:.063rem}._checkbox-size-m_hj8dh_65{width:12px;height:12px;border-radius:.125rem}._checkbox-size-l_hj8dh_70{width:14px;height:14px;border-radius:.125rem}._checkbox-size-xl_hj8dh_75{width:16px;height:16px;border-radius:.125rem}

package/dist/styles/IconButton.css

@@ -1 +1 @@
-._button_1v64m_21{font-family:var(--font-family);font-weight:500;border:0;cursor:pointer;line-height:1;box-shadow:0 4px 10px #00000008;display:inline-flex;justify-content:center;align-items:center;min-width:12px;min-height:12px;aspect-ratio:1/1}._button_1v64m_21:focus-visible{outline:none}._button_1v64m_21:disabled{background-color:#0f0f0f0d;color:#0f0f0f66;border:1px solid rgba(15,15,15,.1);cursor:initial;pointer-events:none}._button_1v64m_21:disabled *{fill:#0f0f0f66}._button-round_1v64m_49._button_1v64m_21{border-radius:50%}._button-primary_1v64m_52{color:var(--dynamic-color-text);background-color:var(--dynamic-color)}._button-primary_1v64m_52:hover{background-color:var(--dynamic-color-hover)}._button-primary_1v64m_52:active{background-color:var(--dynamic-color-activated)}._button-primary_1v64m_52 *{fill:var(--dynamic-color-text)}._button-secondary_1v64m_65{color:var(--color-text);background-color:#96b4ee33;border:1px solid rgba(150,180,238,.5)}._button-secondary_1v64m_65:hover{background-color:#96b4ee66}._button-secondary_1v64m_65:active{background-color:#96b4ee99}._button-secondary_1v64m_65 *{fill:var(--color-text)}._button-tertiary_1v64m_79{color:var(--color-text);background-color:transparent;border:1px solid rgba(150,180,238,.5)}._button-tertiary_1v64m_79:hover{background-color:#96b4ee1a}._button-tertiary_1v64m_79:active{background-color:#96b4ee33}._button-tertiary_1v64m_79 *{fill:var(--color-text)}._button-ghost_1v64m_93{color:var(--color-text);background-color:transparent}._button-ghost_1v64m_93:hover{background-color:#96b4ee1a}._button-ghost_1v64m_93:active{background-color:#96b4ee33}._button-ghost_1v64m_93 *{fill:var(--color-text)}._button-text_1v64m_106{color:#96b4eecc;background-color:transparent}._button-text_1v64m_106:hover{color:#96b4ee}._button-text_1v64m_106:disabled{border:none;background-color:transparent;color:#a5b4bb}._button-text-selected_1v64m_118,._button-text-selected_1v64m_118:hover{color:var(--color-text)}._button-error_1v64m_124{color:#fff;background-color:#ff4747}._button-error_1v64m_124:hover{background-color:#ed1515}._button-error_1v64m_124:active{background-color:#c80d0d}._button-error_1v64m_124 *{fill:var(--color-text)}._button-size-xl_1v64m_137{border-radius:.5rem;padding:1rem;font-size:1.125em}._button-size-l_1v64m_142{border-radius:.5rem;padding:.75rem;font-size:1em}._button-size-m_1v64m_147{border-radius:.25rem;padding:.5rem;font-size:.875em}._button-size-s_1v64m_152{border-radius:.25rem;padding:.375rem;font-size:.75em}._flexHorizontalCenter_1v64m_158{display:flex;justify-content:center;align-items:center;flex-direction:row}
+._button_16ptg_23{font-family:var(--font-family);font-weight:500;border:0;cursor:pointer;line-height:1;display:inline-flex;justify-content:center;align-items:center;min-width:12px;min-height:12px;aspect-ratio:1/1}._button_16ptg_23:focus-visible{outline:none}._button_16ptg_23:disabled{background-color:#0f0f0f0d;color:#0f0f0f66;border:1px solid rgba(15,15,15,.1);cursor:initial;pointer-events:none}._button_16ptg_23:disabled *{fill:#0f0f0f66}._button-round_16ptg_50._button_16ptg_23{border-radius:50%}._button-primary_16ptg_53{color:var(--dynamic-color-text);background-color:var(--dynamic-color)}._button-primary_16ptg_53:hover{background-color:var(--dynamic-color-hover)}._button-primary_16ptg_53:active{background-color:var(--dynamic-color-activated)}._button-primary_16ptg_53 *{fill:var(--dynamic-color-text)}._button-secondary_16ptg_66{color:var(--color-text);background-color:#96b4ee33;border:1px solid rgba(150,180,238,.5)}._button-secondary_16ptg_66:hover{background-color:#96b4ee66}._button-secondary_16ptg_66:active{background-color:#96b4ee99}._button-secondary_16ptg_66 *{fill:var(--color-text)}._button-tertiary_16ptg_80{color:var(--color-text);background-color:transparent;border:1px solid rgba(150,180,238,.5)}._button-tertiary_16ptg_80:hover{background-color:#96b4ee1a}._button-tertiary_16ptg_80:active{background-color:#96b4ee33}._button-tertiary_16ptg_80 *{fill:var(--color-text)}._button-ghost_16ptg_94{color:var(--color-text);background-color:transparent}._button-ghost_16ptg_94:hover{background-color:#96b4ee1a}._button-ghost_16ptg_94:active{background-color:#96b4ee33}._button-ghost_16ptg_94 *{fill:var(--color-text)}._button-icon_16ptg_107{fill:#a5b4bb;background-color:transparent}._button-icon_16ptg_107:hover{fill:#788d98}._button-icon_16ptg_107:disabled{border:none;background-color:transparent;fill:#a5b4bb}._button-icon-selected_16ptg_119,._button-icon-selected_16ptg_119:hover{fill:var(--color-text)}._button-icon_16ptg_107 svg{fill:inherit}._button-error_16ptg_128{color:#fff;background-color:#ff4747}._button-error_16ptg_128:hover{background-color:#ed1515}._button-error_16ptg_128:active{background-color:#c80d0d}._button-error_16ptg_128 *{fill:var(--color-text)}._button-size-xl_16ptg_141{border-radius:.5rem;padding:1rem;font-size:1.125em}._button-size-l_16ptg_146{border-radius:.5rem;padding:.75rem;font-size:1em}._button-size-m_16ptg_151{border-radius:.25rem;padding:.5rem;font-size:.875em}._button-size-s_16ptg_156{border-radius:.25rem;padding:.375rem;font-size:.75em}._button-size-menu_16ptg_161{padding:.5rem;font-size:1em;line-height:24px;border-radius:4px}._flexHorizontalCenter_16ptg_168{display:flex;justify-content:center;align-items:center;flex-direction:row}

package/dist/styles/Input.css

@@ -1 +1 @@
-input{font-family:Urbanist,sans-serif;border:none;background-color:transparent}input:focus{outline:none;box-shadow:none;border-color:transparent}input::placeholder{font-family:Urbanist,sans-serif;color:var(--dynamic-color)}._input-style_115tz_37{font-family:Urbanist,sans-serif;border:1px solid rgba(150,180,238,.5);color:var(--dynamic-color)}._input-style_115tz_37 input{color:var(--dynamic-color-activated)}._input-style_115tz_37 *{fill:var(--dynamic-color)}._input-style-disabled_115tz_49{background-color:#0f0f0f0d;border-color:var(--dynamic-color-border-disabled);pointer-events:none}._input-style-disabled_115tz_49 input{color:var(--dynamic-color-disabled)}._input-style-disabled_115tz_49 *{fill:var(--dynamic-color-disabled)}._input-style-focused_115tz_60{color:var(--dynamic-color);border-color:var(--dynamic-color-border);background-color:var(--dynamic-background-color)}._input-style-focused_115tz_60 *{fill:var(--dynamic-color-activated)}._input-style-secondary_115tz_68{background-color:#96b4ee33;color:var(--dynamic-color-secondary);border:1px solid rgba(150,180,238,.5)}._input-style-secondary_115tz_68 input{color:var(--dynamic-color-secondary)}._input-style-secondary_115tz_68 input::placeholder{color:var(--dynamic-color-secondary)}._input-style-secondary_115tz_68 *{fill:var(--dynamic-color-secondary)}._input-style-ghost_115tz_82{border:none}._input-style-error_115tz_85{border-color:#ff4747;color:#ff4747}._input-style-error_115tz_85 input::placeholder{color:#ff4747}._input-style-error_115tz_85 *{fill:#ff4747}._input-style-success_115tz_95{border-color:#33b449;color:#33b449}._input-style-success_115tz_95 input::placeholder{color:#33b449}._input-style-success_115tz_95 *{fill:#33b449}._input-style_115tz_37 ._input-container_115tz_105{position:relative;width:100%}._input-style-size-xl_115tz_109{padding:1rem;font-size:1.125em;line-height:28px;border-radius:8px;gap:.625rem}._input-style-size-xl_115tz_109 input{line-height:28px}._input-style-size-l_115tz_119{padding:.75rem;font-size:1em;line-height:24px;border-radius:8px;gap:.5rem}._input-style-size-l_115tz_119 input{line-height:24px}._input-style-size-m_115tz_129{padding:.5rem;font-size:.875em;line-height:20px;border-radius:4px;gap:.375rem}._input-style-size-m_115tz_129 input{line-height:20px}._input-style-size-s_115tz_139{padding:.375rem;font-size:.75em;line-height:16px;border-radius:4px;gap:.25rem}._input-style-size-s_115tz_139 input{line-height:16px}._input-style-radius_115tz_149{border-radius:50px}._flexHorizontalBetween_115tz_153{display:flex;justify-content:space-between;align-items:center;flex-direction:row}._flexHorizontal_115tz_153{display:flex;justify-content:flex-start;align-items:center;flex-direction:row}
+input{font-family:Urbanist,sans-serif;border:none;background-color:transparent;width:100%}input:focus{outline:none;box-shadow:none;border-color:transparent}input::placeholder{font-family:Urbanist,sans-serif;color:var(--dynamic-color)}._input-style_8cbxu_40{font-family:Urbanist,sans-serif;border:1px solid rgba(150,180,238,.5);color:var(--dynamic-color)}._input-style_8cbxu_40 input{color:var(--dynamic-color-activated)}._input-style_8cbxu_40 *{fill:var(--dynamic-color)}._input-style-disabled_8cbxu_52{background-color:#0f0f0f0d;border-color:var(--dynamic-color-border-disabled);pointer-events:none}._input-style-disabled_8cbxu_52 input{color:var(--dynamic-color-disabled)}._input-style-disabled_8cbxu_52 *{fill:var(--dynamic-color-disabled)}._input-style-focused_8cbxu_63{color:var(--dynamic-color);border-color:var(--dynamic-color-border);background-color:var(--dynamic-background-color)}._input-style-focused_8cbxu_63 *{fill:var(--dynamic-color-activated)}._input-style-secondary_8cbxu_71{background-color:#96b4ee33;color:var(--dynamic-color-secondary);border:1px solid rgba(150,180,238,.5)}._input-style-secondary_8cbxu_71 input{color:var(--dynamic-color-secondary)}._input-style-secondary_8cbxu_71 input::placeholder{color:var(--dynamic-color-secondary)}._input-style-secondary_8cbxu_71 *{fill:var(--dynamic-color-secondary)}._input-style-ghost_8cbxu_85{border:none}._input-style-error_8cbxu_88{border-color:#ff4747;color:#ff4747}._input-style-error_8cbxu_88 input::placeholder{color:#ff4747}._input-style-error_8cbxu_88 *{fill:#ff4747}._input-style-success_8cbxu_98{border-color:#33b449;color:#33b449}._input-style-success_8cbxu_98 input::placeholder{color:#33b449}._input-style-success_8cbxu_98 *{fill:#33b449}._input-style_8cbxu_40 ._input-container_8cbxu_108{position:relative;width:100%}._input-style-size-xl_8cbxu_112{padding:1rem;font-size:1.125em;line-height:28px;border-radius:8px;gap:.625rem}._input-style-size-xl_8cbxu_112 input{line-height:28px}._input-style-size-l_8cbxu_122{padding:.75rem;font-size:1em;line-height:24px;border-radius:8px;gap:.5rem}._input-style-size-l_8cbxu_122 input{line-height:24px}._input-style-size-m_8cbxu_132{padding:.5rem;font-size:.875em;line-height:20px;border-radius:4px;gap:.375rem}._input-style-size-m_8cbxu_132 input{line-height:20px}._input-style-size-s_8cbxu_142{padding:.375rem;font-size:.75em;line-height:16px;border-radius:4px;gap:.25rem}._input-style-size-s_8cbxu_142 input{line-height:16px}._input-style-radius_8cbxu_152{border-radius:50px}._flexHorizontalBetween_8cbxu_156{display:flex;justify-content:space-between;align-items:center;flex-direction:row}._flexHorizontal_8cbxu_156{display:flex;justify-content:flex-start;align-items:center;flex-direction:row}

package/dist/styles/Select.css

@@ -0,0 +1 @@
+._customSelect_e5r04_40{position:relative;margin:0;padding:0;color:var(--color-text)}._customSelect_e5r04_40 ._selectOptions_e5r04_46{overflow:auto;max-height:80px;position:absolute;border-radius:var(--spacing-xs-6);border:1px solid rgba(150,180,238,.5);transform:translateY(0)}._customSelect_e5r04_40 ._selectOptions-top_e5r04_54{bottom:calc(100% + 6px)}._customSelect_e5r04_40 ._selectOptions-bottom_e5r04_57{top:calc(100% + 6px)}._customSelect_e5r04_40 ._selectOptions-dark_e5r04_60{background-color:#24292e}._customSelect_e5r04_40 ._selectOptions-light_e5r04_63{background-color:#fff}._customSelect_e5r04_40 ._selectOptions-s_e5r04_66{padding:var(--spacing-xs-6);font-size:.75em}._customSelect_e5r04_40 ._selectOptions_e5r04_46 ._option_e5r04_70{border-radius:var(--spacing-xs-7);padding:var(--spacing-xs-6) var(--spacing-xs-5);cursor:pointer}._customSelect_e5r04_40 ._selectOptions_e5r04_46 ._option_e5r04_70:hover{background-color:#96b4ee33}._customSelect_e5r04_40 ::-webkit-scrollbar{width:4px;height:4px}._customSelect_e5r04_40 ::-webkit-scrollbar-thumb{background-color:var(--color-blue-700);border-radius:8px;transition:all .3s ease;margin:10px;background-clip:padding-box}._customSelect_e5r04_40 ::-webkit-scrollbar-thumb:hover{background-color:var(--color-blue-700)}._customSelect_e5r04_40 ::-webkit-scrollbar-track{background:var(--color-blue-trans-50)}._customSelect_e5r04_40 ::-webkit-scrollbar-corner{background:var(--color-blue-trans-50)}._customSelect_e5r04_40 ._icon-size-s_e5r04_98{width:.75em}

package/dist/styles/Tabs.css

@@ -1 +1 @@
-._tab-container_eo8ix_21{position:relative;color:#a5b4bb;font-weight:500;font-size:.875em;line-height:1.25rem}._tab-items_eo8ix_28{gap:2.25rem;padding:.625rem .125rem;border-bottom:1px solid rgba(150,180,238,.8)}._underline_eo8ix_34{position:absolute;bottom:0;height:2px;background-color:var(--primary-color);transition:all .3s ease}._flexHorizontal_eo8ix_42{display:flex;justify-content:flex-start;align-items:center;flex-direction:row}
+._tab-container_118wv_23{position:relative;line-height:1.25rem;border-bottom:1px solid rgba(150,180,238,.5)}._tab-items_118wv_28{gap:2.25rem;padding:.625rem .125rem}._underline_118wv_33{position:absolute;bottom:0;height:2px;background-color:var(--primary-color);transition:all .3s ease}._flexHorizontal-center_118wv_41{display:flex;justify-content:center;align-items:center;flex-direction:row}._flexHorizontal-left_118wv_47{display:flex;justify-content:flex-start;align-items:center;flex-direction:row}._flexHorizontal-right_118wv_53{display:flex;justify-content:flex-end;align-items:center;flex-direction:row}

package/dist/styles/TagCounter.css

@@ -1 +1 @@
-._tag-counter_12ztz_21{color:#1d3557;background-color:#96b4ee66;width:fit-content;display:flex;justify-content:center;align-items:center;padding:4px;box-sizing:border-box}._tag-counter_12ztz_21._dark-mode_12ztz_32{color:#fff;background-color:#fff3}._tag-counter-size-xl_12ztz_36{border-radius:.25rem;font-size:1.125em;line-height:1.75rem;min-width:1.75rem;height:1.75rem}._tag-counter-size-l_12ztz_43{border-radius:.25rem;font-size:1em;line-height:1.5rem;min-width:1.5rem;height:1.5rem}._tag-counter-size-m_12ztz_50{border-radius:.125rem;font-size:.875em;line-height:1.25rem;min-width:1.25rem;height:1.25rem}._tag-counter-size-s_12ztz_57{border-radius:.125rem;font-size:.75em;line-height:1rem;min-width:1rem;height:1rem}
+._tag-counter_1wqu5_23{color:#1d3557;background-color:#96b4ee66;width:fit-content;display:flex;justify-content:center;align-items:center;padding:4px;box-sizing:border-box}._tag-counter_1wqu5_23._dark-mode_1wqu5_34{color:#fff;background-color:#fff3}._tag-counter-size-xl_1wqu5_38{border-radius:.25rem;font-size:1.125em;line-height:1.75rem;min-width:1.75rem;height:1.75rem}._tag-counter-size-l_1wqu5_45{border-radius:.25rem;font-size:1em;line-height:1.5rem;min-width:1.5rem;height:1.5rem}._tag-counter-size-m_1wqu5_52{border-radius:.125rem;font-size:.875em;line-height:1.25rem;min-width:1.25rem;height:1.25rem}._tag-counter-size-s_1wqu5_59{border-radius:.125rem;font-size:.75em;line-height:1rem;min-width:1rem;height:1rem}

package/dist/styles/ThemeContext.css

@@ -1 +1 @@
-:root{--color-light-05: rgba(255, 255, 255, .05);--color-light-10: rgba(255, 255, 255, .1);--color-light-20: rgba(255, 255, 255, .2);--color-light-30: rgba(255, 255, 255, .3);--color-light-40: rgba(255, 255, 255, .4);--color-light-50: rgba(255, 255, 255, .5);--color-light-60: rgba(255, 255, 255, .6);--color-light-70: rgba(255, 255, 255, .7);--color-light-80: rgba(255, 255, 255, .8);--color-light-90: rgba(255, 255, 255, .9);--color-light-100: #FFF;--color-dark-05: rgba(15, 15, 15, .05);--color-dark-10: rgba(15, 15, 15, .1);--color-dark-20: rgba(15, 15, 15, .2);--color-dark-30: rgba(15, 15, 15, .3);--color-dark-40: rgba(15, 15, 15, .4);--color-dark-50: rgba(15, 15, 15, .5);--color-dark-60: rgba(15, 15, 15, .6);--color-dark-70: rgba(15, 15, 15, .7);--color-dark-80: rgba(15, 15, 15, .8);--color-dark-90: rgba(15, 15, 15, .9);--color-dark-100: #09090B;--color-grey-50: #FAFAFA;--color-grey-100: #E7E7E7;--color-grey-200: #D1D1D1;--color-grey-300: #B0B0B0;--color-grey-400: #888888;--color-grey-500: #6D6D6D;--color-grey-600: #5D5D5D;--color-grey-700: #4F4F4F;--color-grey-800: #454545;--color-grey-900: #3D3D3D;--color-grey-950: #0F0F0F;--color-blue-grey-50: #F4F6F7;--color-blue-grey-100: #E3E8EA;--color-blue-grey-200: #CAD3D7;--color-blue-grey-300: #A5B4BB;--color-blue-grey-400: #788D98;--color-blue-grey-500: #55626C;--color-blue-grey-600: #49565F;--color-blue-grey-700: #445058;--color-blue-grey-800: #3A4047;--color-blue-grey-900: #2B3137;--color-blue-grey-950: #24292E;--color-blue-50: #F5F8FE;--color-blue-100: #EFF4FD;--color-blue-200: #EAF0FC;--color-blue-300: #E0E9FA;--color-blue-400: #D5E1F8;--color-blue-500: #CBDAF7;--color-blue-600: #C0D2F5;--color-blue-700: #B6CBF4;--color-blue-800: #ABC3F1;--color-blue-900: #A1BCF0;--color-blue-950: #24292E;--color-blue-situaction-50: #EFF8FF;--color-blue-situaction-100: #DFF1FF;--color-blue-situaction-200: #C3E9FD;--color-blue-situaction-300: #7ED3FB;--color-blue-situaction-400: #31B7FF;--color-blue-situaction-500: #069DEF;--color-blue-situaction-600: #007DCE;--color-blue-situaction-700: #02548A;--color-blue-situaction-800: #1F416D;--color-blue-situaction-900: #1D3557;--color-blue-situaction-950: #14243D;--color-purple-50: #F1F2FC;--color-purple-100: #E6E7F9;--color-purple-200: #D1D3F4;--color-purple-300: #B5B6EC;--color-purple-400: #9A96E3;--color-purple-500: #887DD7;--color-purple-600: #6E59C5;--color-purple-700: #6652B0;--color-purple-800: #53458E;--color-purple-900: #463D72;--color-purple-950: #2A2442;--color-pink-50: #FBF4F8;--color-pink-100: #F8EBF3;--color-pink-200: #F2D8E9;--color-pink-300: #E9B8D6;--color-pink-400: #DB8BBB;--color-pink-500: #CC68A0;--color-pink-600: #B84A83;--color-pink-700: #9D3869;--color-pink-800: #833158;--color-pink-900: #6E2D4C;--color-pink-950: #42152A;--color-gold-50: #FDFAE9;--color-gold-100: #FAF0B9;--color-gold-200: #F8E490;--color-gold-300: #F4CF50;--color-gold-400: #EEB721;--color-gold-500: #DE9F14;--color-gold-600: #C07A0E;--color-gold-700: #99570F;--color-gold-800: #7F4614;--color-gold-900: #6C3917;--color-gold-950: #3F1C09;--color-brown-50: #FDF9ED;--color-brown-100: #F6E4B6;--color-brown-200: #F2D897;--color-brown-300: #ECBD5F;--color-brown-400: #E6A637;--color-brown-500: #DF8620;--color-brown-600: #C7681A;--color-brown-700: #A44919;--color-brown-800: #853A19;--color-brown-900: #6C3019;--color-brown-950: #3E1709;--color-emerald-50: #F2F7F3;--color-emerald-100: #DFECE0;--color-emerald-200: #C1D9C5;--color-emerald-300: #98BDA0;--color-emerald-400: #71A07D;--color-emerald-500: #4A7F59;--color-emerald-600: #376445;--color-emerald-700: #2C5038;--color-emerald-800: #25402F;--color-emerald-900: #1F3527;--color-emerald-950: #111D15;--color-red-50: #FFF1F1;--color-red-100: #FFDFDF;--color-red-200: #FFC5C5;--color-red-300: #FF9D9D;--color-red-400: #FF6464;--color-red-500: #FF4747;--color-red-600: #ED1515;--color-red-700: #C80D0D;--color-red-800: #A50F0F;--color-red-900: #881414;--color-red-950: #4B0404;--color-green-50: #F1FCF3;--color-green-100: #DFF9E3;--color-green-200: #C1F1C8;--color-green-300: #91E49E;--color-green-400: #45C85A;--color-green-500: #33B449;--color-green-600: #259437;--color-green-700: #20752F;--color-green-800: #1E5D29;--color-green-900: #1B4C24;--color-green-950: #092A10;--color-blue-trans-50: rgba(150, 180, 238, .05);--color-blue-trans-100: rgba(150, 180, 238, .1);--color-blue-trans-200: rgba(150, 180, 238, .2);--color-blue-trans-300: rgba(150, 180, 238, .3);--color-blue-trans-400: rgba(150, 180, 238, .4);--color-blue-trans-500: rgba(150, 180, 238, .5);--color-blue-trans-600: rgba(150, 180, 238, .6);--color-blue-trans-700: rgba(150, 180, 238, .7);--color-blue-trans-800: rgba(150, 180, 238, .8);--color-blue-trans-900: rgba(150, 180, 238, .8);--color-blue-trans-950: #96B4EE;--spacing-xs-7: .125rem;--spacing-xs-6: .25rem;--spacing-xs-5: .375rem;--spacing-xs-4: .5rem;--spacing-xs-3: .625rem;--spacing-xs-2: .75rem;--spacing-xs: .875rem;--spacing-s: 1rem;--spacing-m-1: 1.125rem;--spacing-m-2: 1.25rem;--spacing-l: 1.5rem;--spacing-xl: 1.75rem;--spacing-xl-2: 2rem;--spacing-xl-3: 2.25rem;--spacing-xl-4: 2.75rem;--spacing-xl-5: 3rem;--spacing-xl-6: 4rem}
+:root{--color-light-05: rgba(255, 255, 255, .05);--color-light-10: rgba(255, 255, 255, .1);--color-light-20: rgba(255, 255, 255, .2);--color-light-30: rgba(255, 255, 255, .3);--color-light-40: rgba(255, 255, 255, .4);--color-light-50: rgba(255, 255, 255, .5);--color-light-60: rgba(255, 255, 255, .6);--color-light-70: rgba(255, 255, 255, .7);--color-light-80: rgba(255, 255, 255, .8);--color-light-90: rgba(255, 255, 255, .9);--color-light-100: #FFF;--color-dark-05: rgba(15, 15, 15, .05);--color-dark-10: rgba(15, 15, 15, .1);--color-dark-20: rgba(15, 15, 15, .2);--color-dark-30: rgba(15, 15, 15, .3);--color-dark-40: rgba(15, 15, 15, .4);--color-dark-50: rgba(15, 15, 15, .5);--color-dark-60: rgba(15, 15, 15, .6);--color-dark-70: rgba(15, 15, 15, .7);--color-dark-80: rgba(15, 15, 15, .8);--color-dark-90: rgba(15, 15, 15, .9);--color-dark-100: #09090B;--color-grey-50: #FAFAFA;--color-grey-100: #E7E7E7;--color-grey-200: #D1D1D1;--color-grey-300: #B0B0B0;--color-grey-400: #888888;--color-grey-500: #6D6D6D;--color-grey-600: #5D5D5D;--color-grey-700: #4F4F4F;--color-grey-800: #454545;--color-grey-900: #3D3D3D;--color-grey-950: #0F0F0F;--color-blue-grey-50: #F4F6F7;--color-blue-grey-100: #E3E8EA;--color-blue-grey-200: #CAD3D7;--color-blue-grey-300: #A5B4BB;--color-blue-grey-400: #788D98;--color-blue-grey-500: #55626C;--color-blue-grey-600: #49565F;--color-blue-grey-700: #445058;--color-blue-grey-800: #3A4047;--color-blue-grey-900: #2B3137;--color-blue-grey-950: #24292E;--color-blue-50: #F5F8FE;--color-blue-100: #EFF4FD;--color-blue-200: #EAF0FC;--color-blue-300: #E0E9FA;--color-blue-400: #D5E1F8;--color-blue-500: #CBDAF7;--color-blue-600: #C0D2F5;--color-blue-700: #B6CBF4;--color-blue-800: #ABC3F1;--color-blue-900: #A1BCF0;--color-blue-950: #24292E;--color-blue-sky-50: #F5F8FE;--color-blue-sky-100: #EFF4FD;--color-blue-sky-200: #EAF0FC;--color-blue-sky-300: #E0E9FA;--color-blue-sky-400: #D5E1F8;--color-blue-sky-500: #CBDAF7;--color-blue-sky-600: #C0D2F5;--color-blue-sky-700: #B6CBF4;--color-blue-sky-800: #ABC3F1;--color-blue-sky-900: #A1BCF0;--color-blue-sky-950: #96B4EE;--color-blue-dark-50: #294266;--color-blue-dark-100: #354E76;--color-blue-dark-200: #415B84;--color-blue-dark-300: #4D6893;--color-blue-dark-400: #5A75A3;--color-blue-dark-500: #6681B2;--color-blue-dark-600: #728EC1;--color-blue-dark-700: #728EC1;--color-blue-dark-800: #ABC3F1;--color-blue-dark-900: #A1BCF0;--color-blue-dark-950: #96B4EE;--color-blue-situaction-50: #EFF8FF;--color-blue-situaction-100: #DFF1FF;--color-blue-situaction-200: #C3E9FD;--color-blue-situaction-300: #7ED3FB;--color-blue-situaction-400: #31B7FF;--color-blue-situaction-500: #069DEF;--color-blue-situaction-600: #007DCE;--color-blue-situaction-700: #02548A;--color-blue-situaction-800: #1F416D;--color-blue-situaction-900: #1D3557;--color-blue-situaction-950: #14243D;--color-purple-50: #F1F2FC;--color-purple-100: #E6E7F9;--color-purple-200: #D1D3F4;--color-purple-300: #B5B6EC;--color-purple-400: #9A96E3;--color-purple-500: #887DD7;--color-purple-600: #6E59C5;--color-purple-700: #6652B0;--color-purple-800: #53458E;--color-purple-900: #463D72;--color-purple-950: #2A2442;--color-pink-50: #FBF4F8;--color-pink-100: #F8EBF3;--color-pink-200: #F2D8E9;--color-pink-300: #E9B8D6;--color-pink-400: #DB8BBB;--color-pink-500: #CC68A0;--color-pink-600: #B84A83;--color-pink-700: #9D3869;--color-pink-800: #833158;--color-pink-900: #6E2D4C;--color-pink-950: #42152A;--color-gold-50: #FDFAE9;--color-gold-100: #FAF0B9;--color-gold-200: #F8E490;--color-gold-300: #F4CF50;--color-gold-400: #EEB721;--color-gold-500: #DE9F14;--color-gold-600: #C07A0E;--color-gold-700: #99570F;--color-gold-800: #7F4614;--color-gold-900: #6C3917;--color-gold-950: #3F1C09;--color-brown-50: #FDF9ED;--color-brown-100: #F6E4B6;--color-brown-200: #F2D897;--color-brown-300: #ECBD5F;--color-brown-400: #E6A637;--color-brown-500: #DF8620;--color-brown-600: #C7681A;--color-brown-700: #A44919;--color-brown-800: #853A19;--color-brown-900: #6C3019;--color-brown-950: #3E1709;--color-emerald-50: #F2F7F3;--color-emerald-100: #DFECE0;--color-emerald-200: #C1D9C5;--color-emerald-300: #98BDA0;--color-emerald-400: #71A07D;--color-emerald-500: #4A7F59;--color-emerald-600: #376445;--color-emerald-700: #2C5038;--color-emerald-800: #25402F;--color-emerald-900: #1F3527;--color-emerald-950: #111D15;--color-red-50: #FFF1F1;--color-red-100: #FFDFDF;--color-red-200: #FFC5C5;--color-red-300: #FF9D9D;--color-red-400: #FF6464;--color-red-500: #FF4747;--color-red-600: #ED1515;--color-red-700: #C80D0D;--color-red-800: #A50F0F;--color-red-900: #881414;--color-red-950: #4B0404;--color-green-50: #F1FCF3;--color-green-100: #DFF9E3;--color-green-200: #C1F1C8;--color-green-300: #91E49E;--color-green-400: #45C85A;--color-green-500: #33B449;--color-green-600: #259437;--color-green-700: #20752F;--color-green-800: #1E5D29;--color-green-900: #1B4C24;--color-green-950: #092A10;--color-blue-trans-50: rgba(150, 180, 238, .05);--color-blue-trans-100: rgba(150, 180, 238, .1);--color-blue-trans-200: rgba(150, 180, 238, .2);--color-blue-trans-300: rgba(150, 180, 238, .3);--color-blue-trans-400: rgba(150, 180, 238, .4);--color-blue-trans-500: rgba(150, 180, 238, .5);--color-blue-trans-600: rgba(150, 180, 238, .6);--color-blue-trans-700: rgba(150, 180, 238, .7);--color-blue-trans-800: rgba(150, 180, 238, .8);--color-blue-trans-900: rgba(150, 180, 238, .8);--color-blue-trans-950: #96B4EE;--spacing-xs-7: .125rem;--spacing-xs-6: .25rem;--spacing-xs-5: .375rem;--spacing-xs-4: .5rem;--spacing-xs-3: .625rem;--spacing-xs-2: .75rem;--spacing-xs: .875rem;--spacing-s: 1rem;--spacing-m-1: 1.125rem;--spacing-m-2: 1.25rem;--spacing-l: 1.5rem;--spacing-xl: 1.75rem;--spacing-xl-2: 2rem;--spacing-xl-3: 2.25rem;--spacing-xl-4: 2.75rem;--spacing-xl-5: 3rem;--spacing-xl-6: 4rem}

package/dist/styles/Tooltip.css

@@ -1 +1 @@
-._tooltip-container_1w7yx_21{position:relative;display:inline-block;width:auto;height:auto;display:flex;justify-content:center;align-items:center;cursor:pointer}._tooltip-container_1w7yx_21 ._tooltip_1w7yx_21{position:absolute;padding:var(--dynamic-padding);border-radius:4px;font-size:12px;white-space:nowrap;z-index:10;opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s}._tooltip-container_1w7yx_21 ._tooltip-dark_1w7yx_42{background-color:#3a4047;box-shadow:0 0 10.9px #0000001a;color:#fff}._tooltip-container_1w7yx_21 ._tooltip-light_1w7yx_47{background-color:#fff;box-shadow:0 0 10.9px #0000001a;color:#1d3557}._tooltip-container_1w7yx_21:hover ._tooltip_1w7yx_21{opacity:1;visibility:visible}
+._tooltip-container_wpb50_23{position:relative;display:inline-block;width:auto;height:auto;display:flex;justify-content:center;align-items:center;cursor:pointer}._tooltip-container_wpb50_23 ._tooltip_wpb50_23{position:absolute;padding:var(--dynamic-padding);border-radius:4px;font-size:12px;white-space:nowrap;z-index:10;opacity:0;visibility:hidden;transition:opacity .3s ease-in-out,visibility .3s}._tooltip-container_wpb50_23 ._tooltip-dark_wpb50_44{background-color:#3a4047;box-shadow:0 0 10.9px #0000001a;color:#fff}._tooltip-container_wpb50_23 ._tooltip-light_wpb50_49{background-color:#fff;box-shadow:0 0 10.9px #0000001a;color:#1d3557}._tooltip-container_wpb50_23:hover ._tooltip_wpb50_23{opacity:1;visibility:visible}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@situaction/traq-ui-ste",
-  "version": "1.0.21",
+  "version": "1.0.23",
   "description": "library react component Situaction",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",