@situaction/traq-ui-ste 1.0.22 → 1.0.24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -9,7 +9,7 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
9
9
  /** what mode do you use for light or dark color **/
10
10
  colorMode?: 'light' | 'dark';
11
11
  /** How large should the button be? */
12
- size?: Size;
12
+ size?: Size | 'menu';
13
13
  /** button contents */
14
14
  label: string;
15
15
  /** If true, the button will be styled to indicate an error state. */
@@ -1,68 +1,70 @@
1
- import { jsxs as y, jsx as a } from "react/jsx-runtime";
2
- import { useEffect as x } from "react";
3
- import { useTheme as g } from "../theme/ThemeContext.js";
4
- import '../../styles/Button.css';const v = "_button_1031d_21", z = "_flexHorizontalCenter_1031d_167", o = {
5
- button: v,
6
- "button-primary": "_button-primary_1031d_43",
7
- "button-secondary": "_button-secondary_1031d_57",
8
- "button-tertiary": "_button-tertiary_1031d_71",
9
- "button-ghost": "_button-ghost_1031d_85",
10
- "button-text": "_button-text_1031d_101",
11
- "button-text-selected": "_button-text-selected_1031d_114",
12
- "button-error": "_button-error_1031d_120",
13
- "button-size-xl": "_button-size-xl_1031d_133",
14
- "button-size-l": "_button-size-l_1031d_139",
15
- "button-size-m": "_button-size-m_1031d_145",
16
- "button-size-s": "_button-size-s_1031d_151",
17
- "button-gap-xl": "_button-gap-xl_1031d_157",
18
- "button-gap-l": "_button-gap-l_1031d_160",
19
- "button-gap-m": "_button-gap-m_1031d_163",
20
- "button-gap-s": "_button-gap-s_1031d_163",
1
+ import { jsxs as w, jsx as a } from "react/jsx-runtime";
2
+ import { useEffect as g } from "react";
3
+ import { useTheme as x } from "../theme/ThemeContext.js";
4
+ import '../../styles/Button.css';const d = "_button_138cw_23", z = "_flexHorizontalCenter_138cw_178", o = {
5
+ button: d,
6
+ "button-primary": "_button-primary_138cw_45",
7
+ "button-secondary": "_button-secondary_138cw_59",
8
+ "button-tertiary": "_button-tertiary_138cw_73",
9
+ "button-ghost": "_button-ghost_138cw_87",
10
+ "button-text": "_button-text_138cw_103",
11
+ "button-text-selected": "_button-text-selected_138cw_116",
12
+ "button-error": "_button-error_138cw_122",
13
+ "button-size-xl": "_button-size-xl_138cw_135",
14
+ "button-size-l": "_button-size-l_138cw_141",
15
+ "button-size-m": "_button-size-m_138cw_147",
16
+ "button-size-s": "_button-size-s_138cw_153",
17
+ "button-size-menu": "_button-size-menu_138cw_159",
18
+ "button-gap-menu": "_button-gap-menu_138cw_165",
19
+ "button-gap-xl": "_button-gap-xl_138cw_168",
20
+ "button-gap-l": "_button-gap-l_138cw_171",
21
+ "button-gap-m": "_button-gap-m_138cw_165",
22
+ "button-gap-s": "_button-gap-s_138cw_174",
21
23
  flexHorizontalCenter: z
22
- }, C = ({
23
- mode: n = "primary",
24
- size: s = "m",
24
+ }, $ = ({
25
+ mode: r = "primary",
26
+ size: u = "m",
25
27
  color: t,
26
- colorMode: r,
27
- label: u,
28
- error: l,
29
- selected: b,
30
- childrenLeft: i,
31
- childrenRight: _,
32
- ...d
28
+ colorMode: n,
29
+ label: i,
30
+ error: c,
31
+ selected: l,
32
+ childrenLeft: _,
33
+ childrenRight: s,
34
+ ...b
33
35
  }) => {
34
- const { mode: e } = g(), c = () => l ? "error" : n;
35
- x(() => {
36
- r && !t && console.warn("`colorMode` is defined but `color` is missing. `colorMode` will be ignored.");
36
+ const { mode: e } = x(), m = () => c ? "error" : r;
37
+ g(() => {
38
+ n && !t && console.warn("`colorMode` is defined but `color` is missing. `colorMode` will be ignored.");
37
39
  }, [t]);
38
- const m = [
40
+ const p = [
39
41
  o.button,
40
- o[`button-${c()}`],
41
- o[`button-size-${s}`],
42
- o[`button-gap-${s}`],
43
- b && n === "text" && o["button-text-selected"],
42
+ o[`button-${m()}`],
43
+ o[`button-size-${u}`],
44
+ o[`button-gap-${u}`],
45
+ l && r === "text" && o["button-text-selected"],
44
46
  o.flexHorizontalCenter
45
- ].join(" "), p = {
46
- "--dynamic-color-text": t ? r === "dark" ? `var(--color-${t}-900)` : "var(--color-light-100)" : e === "light" ? "var(--color-light-100)" : "var(--primary-color-900)",
47
- "--dynamic-color": t ? `var(--color-${t}-${r === "dark" ? "200" : "900"})` : "var(--primary-color)",
48
- "--dynamic-color-hover": t ? `var(--color-${t}-${r === "dark" ? "100" : "800"})` : e === "light" ? "var(--primary-color-800)" : "var(--primary-color-100)",
49
- "--dynamic-color-activated": t ? `var(--color-${t}-${r === "dark" ? "50" : "700"})` : e === "light" ? "var(--primary-color-700)" : "var(--primary-color-50)"
47
+ ].join(" "), y = {
48
+ "--dynamic-color-text": t ? n === "dark" ? `var(--color-${t}-900)` : "var(--color-light-100)" : e === "light" ? "var(--color-light-100)" : "var(--primary-color-900)",
49
+ "--dynamic-color": t ? `var(--color-${t}-${n === "dark" ? "200" : "900"})` : "var(--primary-color)",
50
+ "--dynamic-color-hover": t ? `var(--color-${t}-${n === "dark" ? "100" : "800"})` : e === "light" ? "var(--primary-color-800)" : "var(--primary-color-100)",
51
+ "--dynamic-color-activated": t ? `var(--color-${t}-${n === "dark" ? "50" : "700"})` : e === "light" ? "var(--primary-color-700)" : "var(--primary-color-50)"
50
52
  };
51
- return /* @__PURE__ */ y(
53
+ return /* @__PURE__ */ w(
52
54
  "button",
53
55
  {
54
56
  type: "button",
55
- className: m,
56
- style: n === "primary" ? p : void 0,
57
- ...d,
57
+ className: p,
58
+ style: r === "primary" ? y : void 0,
59
+ ...b,
58
60
  children: [
59
- i && /* @__PURE__ */ a("span", { className: o.flexHorizontalCenter, children: i }),
60
- /* @__PURE__ */ a("span", { children: u }),
61
- _ && /* @__PURE__ */ a("span", { className: o.flexHorizontalCenter, children: _ })
61
+ _ && /* @__PURE__ */ a("span", { className: o.flexHorizontalCenter, children: _ }),
62
+ /* @__PURE__ */ a("span", { children: i }),
63
+ s && /* @__PURE__ */ a("span", { className: o.flexHorizontalCenter, children: s })
62
64
  ]
63
65
  }
64
66
  );
65
67
  };
66
68
  export {
67
- C as Button
69
+ $ as Button
68
70
  };
@@ -1,47 +1,47 @@
1
- import { jsx as s } from "react/jsx-runtime";
2
- import { useState as x } from "react";
1
+ import { jsx as h } from "react/jsx-runtime";
2
+ import { useState as b } from "react";
3
3
  import { useTheme as m } from "../theme/ThemeContext.js";
4
- import '../../styles/Checkbox.css';const n = "_checkbox_1cb1z_21", r = "_checked_1cb1z_32", z = "_disabled_1cb1z_44", e = {
4
+ import '../../styles/Checkbox.css';const n = "_checkbox_hj8dh_23", r = "_checked_hj8dh_34", j = "_disabled_hj8dh_46", e = {
5
5
  checkbox: n,
6
- "dark-mode": "_dark-mode_1cb1z_29",
6
+ "dark-mode": "_dark-mode_hj8dh_31",
7
7
  checked: r,
8
- disabled: z,
9
- "checkbox-size-s": "_checkbox-size-s_1cb1z_58",
10
- "checkbox-size-m": "_checkbox-size-m_1cb1z_63",
11
- "checkbox-size-l": "_checkbox-size-l_1cb1z_68",
12
- "checkbox-size-xl": "_checkbox-size-xl_1cb1z_73"
13
- }, g = ({
14
- checked: h = !1,
15
- icon: t = /* @__PURE__ */ s("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "32", viewBox: "0 0 256 256", children: /* @__PURE__ */ s(
8
+ disabled: j,
9
+ "checkbox-size-s": "_checkbox-size-s_hj8dh_60",
10
+ "checkbox-size-m": "_checkbox-size-m_hj8dh_65",
11
+ "checkbox-size-l": "_checkbox-size-l_hj8dh_70",
12
+ "checkbox-size-xl": "_checkbox-size-xl_hj8dh_75"
13
+ }, p = ({
14
+ checked: d = !1,
15
+ icon: t = /* @__PURE__ */ h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "32", viewBox: "0 0 256 256", children: /* @__PURE__ */ h(
16
16
  "path",
17
17
  {
18
18
  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"
19
19
  }
20
20
  ) }),
21
- size: b = "m",
22
- disabled: i = !1,
23
- onChange: o
21
+ size: i = "m",
22
+ disabled: k = !1,
23
+ onChange: s
24
24
  }) => {
25
- const { mode: k } = m(), [c, _] = x(h), a = () => {
26
- const d = !c;
27
- _(d), o && o(d);
28
- }, l = [
25
+ const { mode: _ } = m(), [c, a] = b(d), l = () => {
26
+ const o = !c;
27
+ a(o), s && s(o);
28
+ }, x = [
29
29
  e.checkbox,
30
- e[`checkbox-size-${b}`],
30
+ e[`checkbox-size-${i}`],
31
31
  c && e.checked,
32
- i && e.disabled,
33
- k === "dark" && e["dark-mode"]
32
+ k && e.disabled,
33
+ _ === "dark" && e["dark-mode"]
34
34
  ].filter(Boolean).join(" ");
35
- return /* @__PURE__ */ s(
35
+ return /* @__PURE__ */ h(
36
36
  "div",
37
37
  {
38
38
  "data-testid": "checkbox",
39
- className: l,
40
- onClick: a,
39
+ className: x,
40
+ onClick: l,
41
41
  children: c && t
42
42
  }
43
43
  );
44
44
  };
45
45
  export {
46
- g as Checkbox
46
+ p as Checkbox
47
47
  };
@@ -1,5 +1,5 @@
1
1
  import { FC, ReactElement } from 'react';
2
- import { Color } from '../interface';
2
+ import { Color, Size } from '../interface';
3
3
 
4
4
  export interface IconButtonProps {
5
5
  /** Specifies the visual style of the button. */
@@ -9,7 +9,7 @@ export interface IconButtonProps {
9
9
  /** what mode do you use for light or dark color **/
10
10
  colorMode?: 'light' | 'dark';
11
11
  /** How large should the button be? */
12
- size?: 's' | 'm' | 'l' | 'xl';
12
+ size?: Size | 'menu';
13
13
  /** If true, the button will have rounded corners. */
14
14
  round?: boolean;
15
15
  /** If true, the button will be styled to indicate an error state. */
@@ -1,35 +1,36 @@
1
- import { jsx as y } from "react/jsx-runtime";
2
- import { useEffect as d } from "react";
3
- import { useTheme as j } from "../theme/ThemeContext.js";
4
- import '../../styles/IconButton.css';const w = "_button_pjwt4_21", v = "_flexHorizontalCenter_pjwt4_160", o = {
5
- button: w,
6
- "button-round": "_button-round_pjwt4_48",
7
- "button-primary": "_button-primary_pjwt4_51",
8
- "button-secondary": "_button-secondary_pjwt4_64",
9
- "button-tertiary": "_button-tertiary_pjwt4_78",
10
- "button-ghost": "_button-ghost_pjwt4_92",
11
- "button-icon": "_button-icon_pjwt4_105",
12
- "button-icon-selected": "_button-icon-selected_pjwt4_117",
13
- "button-error": "_button-error_pjwt4_126",
14
- "button-size-xl": "_button-size-xl_pjwt4_139",
15
- "button-size-l": "_button-size-l_pjwt4_144",
16
- "button-size-m": "_button-size-m_pjwt4_149",
17
- "button-size-s": "_button-size-s_pjwt4_154",
1
+ import { jsx as g } from "react/jsx-runtime";
2
+ import { useEffect as y } from "react";
3
+ import { useTheme as d } from "../theme/ThemeContext.js";
4
+ import '../../styles/IconButton.css';const z = "_button_16ptg_23", v = "_flexHorizontalCenter_16ptg_168", o = {
5
+ button: z,
6
+ "button-round": "_button-round_16ptg_50",
7
+ "button-primary": "_button-primary_16ptg_53",
8
+ "button-secondary": "_button-secondary_16ptg_66",
9
+ "button-tertiary": "_button-tertiary_16ptg_80",
10
+ "button-ghost": "_button-ghost_16ptg_94",
11
+ "button-icon": "_button-icon_16ptg_107",
12
+ "button-icon-selected": "_button-icon-selected_16ptg_119",
13
+ "button-error": "_button-error_16ptg_128",
14
+ "button-size-xl": "_button-size-xl_16ptg_141",
15
+ "button-size-l": "_button-size-l_16ptg_146",
16
+ "button-size-m": "_button-size-m_16ptg_151",
17
+ "button-size-s": "_button-size-s_16ptg_156",
18
+ "button-size-menu": "_button-size-menu_16ptg_161",
18
19
  flexHorizontalCenter: v
19
- }, h = ({
20
+ }, $ = ({
20
21
  mode: e = "primary",
21
22
  color: t,
22
23
  colorMode: r,
23
24
  size: i = "m",
24
- error: a,
25
- selected: u,
25
+ error: u,
26
+ selected: a,
26
27
  round: s,
27
28
  disabled: _,
28
29
  children: b,
29
30
  onClick: l
30
31
  }) => {
31
- const { mode: n } = j(), c = () => a ? "error" : e;
32
- d(() => {
32
+ const { mode: n } = d(), c = () => u ? "error" : e;
33
+ y(() => {
33
34
  r && !t && console.warn("`colorMode` is defined but `color` is missing. `colorMode` will be ignored.");
34
35
  }, [t]);
35
36
  const m = [
@@ -37,7 +38,7 @@ import '../../styles/IconButton.css';const w = "_button_pjwt4_21", v = "_flexHor
37
38
  o[`button-${c()}`],
38
39
  s && o["button-round"],
39
40
  o[`button-size-${i}`],
40
- u && e === "icon" && o["button-icon-selected"],
41
+ a && e === "icon" && o["button-icon-selected"],
41
42
  o.flexHorizontalCenter
42
43
  ].join(" "), p = {
43
44
  "--dynamic-color-text": t ? r === "dark" ? "var(--primary-color-900)" : "var(--color-light-100)" : n === "light" ? "var(--color-light-100)" : "var(--primary-color-900)",
@@ -45,7 +46,7 @@ import '../../styles/IconButton.css';const w = "_button_pjwt4_21", v = "_flexHor
45
46
  "--dynamic-color-hover": t ? `var(--color-${t}-${r === "dark" ? "100" : "800"})` : n === "light" ? "var(--primary-color-800)" : "var(--primary-color-100)",
46
47
  "--dynamic-color-activated": t ? `var(--color-${t}-${r === "dark" ? "50" : "700"})` : n === "light" ? "var(--primary-color-700)" : "var(--primary-color-50)"
47
48
  };
48
- return /* @__PURE__ */ y(
49
+ return /* @__PURE__ */ g(
49
50
  "button",
50
51
  {
51
52
  className: m,
@@ -57,5 +58,5 @@ import '../../styles/IconButton.css';const w = "_button_pjwt4_21", v = "_flexHor
57
58
  );
58
59
  };
59
60
  export {
60
- h as IconButton
61
+ $ as IconButton
61
62
  };
@@ -1,89 +1,94 @@
1
- import { jsxs as a, jsx as s, Fragment as c } from "react/jsx-runtime";
2
- import { useState as y, useRef as F } from "react";
3
- import { useTheme as j } from "../theme/ThemeContext.js";
4
- import '../../styles/Input.css';const N = "_flexHorizontalBetween_tg8sh_154", k = "_flexHorizontal_tg8sh_154", t = {
5
- "input-style": "_input-style_tg8sh_38",
6
- "input-style-disabled": "_input-style-disabled_tg8sh_50",
7
- "input-style-focused": "_input-style-focused_tg8sh_61",
8
- "input-style-secondary": "_input-style-secondary_tg8sh_69",
9
- "input-style-ghost": "_input-style-ghost_tg8sh_83",
10
- "input-style-error": "_input-style-error_tg8sh_86",
11
- "input-style-success": "_input-style-success_tg8sh_96",
12
- "input-container": "_input-container_tg8sh_106",
13
- "input-style-size-xl": "_input-style-size-xl_tg8sh_110",
14
- "input-style-size-l": "_input-style-size-l_tg8sh_120",
15
- "input-style-size-m": "_input-style-size-m_tg8sh_130",
16
- "input-style-size-s": "_input-style-size-s_tg8sh_140",
17
- "input-style-radius": "_input-style-radius_tg8sh_150",
18
- flexHorizontalBetween: N,
19
- flexHorizontal: k
20
- }, D = ({
21
- sizeStyle: p = "m",
22
- labelUnit: n,
23
- status: l = "default",
24
- childrenLeft: o,
25
- childrenRight: i,
26
- round: d,
1
+ import { jsxs as y, jsx as s, Fragment as p } from "react/jsx-runtime";
2
+ import { useState as d, useRef as _ } from "react";
3
+ import { useTheme as N } from "../theme/ThemeContext.js";
4
+ import '../../styles/Input.css';const I = "_flexHorizontalBetween_8cbxu_156", $ = "_flexHorizontal_8cbxu_156", e = {
5
+ "input-style": "_input-style_8cbxu_40",
6
+ "input-style-disabled": "_input-style-disabled_8cbxu_52",
7
+ "input-style-focused": "_input-style-focused_8cbxu_63",
8
+ "input-style-secondary": "_input-style-secondary_8cbxu_71",
9
+ "input-style-ghost": "_input-style-ghost_8cbxu_85",
10
+ "input-style-error": "_input-style-error_8cbxu_88",
11
+ "input-style-success": "_input-style-success_8cbxu_98",
12
+ "input-container": "_input-container_8cbxu_108",
13
+ "input-style-size-xl": "_input-style-size-xl_8cbxu_112",
14
+ "input-style-size-l": "_input-style-size-l_8cbxu_122",
15
+ "input-style-size-m": "_input-style-size-m_8cbxu_132",
16
+ "input-style-size-s": "_input-style-size-s_8cbxu_142",
17
+ "input-style-radius": "_input-style-radius_8cbxu_152",
18
+ flexHorizontalBetween: I,
19
+ flexHorizontal: $
20
+ }, M = ({
21
+ sizeStyle: f = "m",
22
+ labelUnit: o,
23
+ status: n = "default",
24
+ childrenLeft: i,
25
+ childrenRight: u,
26
+ round: x,
27
27
  disabled: r,
28
- defaultValue: _,
29
- ...h
28
+ defaultValue: h,
29
+ ...m
30
30
  }) => {
31
- const { mode: e } = j(), [g, u] = y(!1), [f, m] = y(_ || ""), z = F(null), v = () => u(!0), x = () => u(!1), B = (C) => {
32
- m(C.target.value);
33
- }, H = [
34
- t["input-style"],
35
- t[`input-style-size-${p}`],
36
- d && t["input-style-radius"],
37
- t.flexHorizontalBetween
38
- ].filter(Boolean).join(" "), b = [
39
- g && t["input-style-focused"],
40
- r && t["input-style-disabled"],
41
- l === "secondary" && t["input-style-secondary"],
42
- l === "ghost" && t["input-style-ghost"]
43
- ].filter(Boolean).join(" "), S = () => {
44
- switch (l) {
31
+ const { mode: t } = N(), [b, c] = d(!1), [g, z] = d(h || ""), v = _(null), a = _(null), B = () => c(!0), C = () => c(!1), H = (l) => {
32
+ z(l.target.value);
33
+ }, S = () => {
34
+ var l;
35
+ (l = a.current) == null || l.focus();
36
+ }, k = [
37
+ e["input-style"],
38
+ e[`input-style-size-${f}`],
39
+ x && e["input-style-radius"],
40
+ e.flexHorizontalBetween
41
+ ].filter(Boolean).join(" "), w = [
42
+ b && e["input-style-focused"],
43
+ r && e["input-style-disabled"],
44
+ n === "secondary" && e["input-style-secondary"],
45
+ n === "ghost" && e["input-style-ghost"]
46
+ ].filter(Boolean).join(" "), F = () => {
47
+ switch (n) {
45
48
  case "error":
46
- return t["input-style-error"];
49
+ return e["input-style-error"];
47
50
  case "success":
48
- return t["input-style-success"];
51
+ return e["input-style-success"];
49
52
  default:
50
- return b;
53
+ return w;
51
54
  }
52
- }, w = {
53
- "--dynamic-color": e === "light" ? "var(--color-blue-grey-400)" : "var(--color-blue-grey-200)",
54
- "--dynamic-color-activated": e === "light" ? "var(--color-dark-100)" : "var(--color-light-100)",
55
- "--dynamic-color-disabled": e === "light" ? "var(--color-dark-40)" : "var(--color-light-40)",
56
- "--dynamic-color-border-disabled": e === "light" ? "var(--color-dark-10)" : "var(--color-light-10)",
57
- "--dynamic-color-secondary": e === "light" ? "var(--color-blue-situaction-900)" : "var(--color-light-100)"
55
+ }, j = {
56
+ "--dynamic-color": t === "light" ? "var(--color-blue-grey-400)" : "var(--color-blue-grey-200)",
57
+ "--dynamic-color-activated": t === "light" ? "var(--color-dark-100)" : "var(--color-light-100)",
58
+ "--dynamic-color-disabled": t === "light" ? "var(--color-dark-40)" : "var(--color-light-40)",
59
+ "--dynamic-color-border-disabled": t === "light" ? "var(--color-dark-10)" : "var(--color-light-10)",
60
+ "--dynamic-color-secondary": t === "light" ? "var(--color-blue-situaction-900)" : "var(--color-light-100)"
58
61
  };
59
- return /* @__PURE__ */ a(
62
+ return /* @__PURE__ */ y(
60
63
  "div",
61
64
  {
62
- ref: z,
63
- className: `input-style ${H} ${S()}`,
64
- onFocus: v,
65
- onBlur: x,
66
- style: w,
65
+ ref: v,
66
+ className: `input-style ${k} ${F()}`,
67
+ onFocus: B,
68
+ onBlur: C,
69
+ onClick: S,
70
+ style: j,
67
71
  children: [
68
- o && /* @__PURE__ */ s(c, { children: o }),
69
- /* @__PURE__ */ s("div", { className: t["input-container"], children: /* @__PURE__ */ s(
72
+ i && /* @__PURE__ */ s(p, { children: i }),
73
+ /* @__PURE__ */ s("div", { className: e["input-container"], children: /* @__PURE__ */ s(
70
74
  "input",
71
75
  {
72
76
  autoCorrect: "false",
73
77
  disabled: r,
74
- value: f,
75
- onChange: B,
76
- ...h
78
+ value: g,
79
+ onChange: H,
80
+ ref: a,
81
+ ...m
77
82
  }
78
83
  ) }),
79
- /* @__PURE__ */ a(c, { children: [
80
- n && /* @__PURE__ */ s("div", { children: n }),
81
- i && /* @__PURE__ */ s("span", { className: t.flexHorizontal, children: i })
84
+ /* @__PURE__ */ y(p, { children: [
85
+ o && /* @__PURE__ */ s("div", { children: o }),
86
+ u && /* @__PURE__ */ s("span", { className: e.flexHorizontal, children: u })
82
87
  ] })
83
88
  ]
84
89
  }
85
90
  );
86
91
  };
87
92
  export {
88
- D as Input
93
+ M as Input
89
94
  };
@@ -0,0 +1,20 @@
1
+ import { FC } from 'react';
2
+
3
+ interface Option {
4
+ value: string | number;
5
+ label: string;
6
+ }
7
+ export interface SelectProps {
8
+ /** options to display ( label with a value ) **/
9
+ options: Option[];
10
+ /** label to display when selected **/
11
+ placeholder: string;
12
+ /** function for taking back the selected value **/
13
+ onChange?: (value: string | number) => void;
14
+ /** disable option **/
15
+ disabled?: boolean;
16
+ /** options to display on top or bottom **/
17
+ top?: boolean;
18
+ }
19
+ export declare const Select: FC<SelectProps>;
20
+ export {};
@@ -0,0 +1,76 @@
1
+ import { jsxs as v, jsx as s } from "react/jsx-runtime";
2
+ import { useState as r, useRef as g, useEffect as w } from "react";
3
+ import { Button as S } from "../button/Button.js";
4
+ import { useTheme as k } from "../theme/ThemeContext.js";
5
+ import '../../styles/Select.css';const b = "_customSelect_e5r04_40", x = "_selectOptions_e5r04_46", N = "_option_e5r04_70", t = {
6
+ customSelect: b,
7
+ selectOptions: x,
8
+ "selectOptions-top": "_selectOptions-top_e5r04_54",
9
+ "selectOptions-bottom": "_selectOptions-bottom_e5r04_57",
10
+ "selectOptions-dark": "_selectOptions-dark_e5r04_60",
11
+ "selectOptions-light": "_selectOptions-light_e5r04_63",
12
+ "selectOptions-s": "_selectOptions-s_e5r04_66",
13
+ option: N,
14
+ "icon-size-s": "_icon-size-s_e5r04_98"
15
+ }, E = ({
16
+ options: a,
17
+ placeholder: p = "",
18
+ onChange: n,
19
+ disabled: d,
20
+ top: m = !1
21
+ // size = "m",
22
+ }) => {
23
+ const { mode: _ } = k(), [o, l] = r(!1), [c, u] = r(null), i = g(null);
24
+ w(() => {
25
+ const e = (f) => {
26
+ i.current && !i.current.contains(f.target) && l(!1);
27
+ };
28
+ return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
29
+ }, []);
30
+ const O = () => [
31
+ t.selectOptions,
32
+ _ === "dark" ? t["selectOptions-dark"] : t["selectOptions-light"],
33
+ m ? t["selectOptions-top"] : t["selectOptions-bottom"],
34
+ t["selectOptions-s"]
35
+ ].join(" "), h = (e) => {
36
+ u(e), l(!1), n && n(e.value);
37
+ };
38
+ return /* @__PURE__ */ v("div", { className: `${t.customSelect}`, children: [
39
+ /* @__PURE__ */ s(
40
+ S,
41
+ {
42
+ onClick: () => l(!o),
43
+ disabled: d,
44
+ size: "s",
45
+ mode: "tertiary",
46
+ childrenRight: /* @__PURE__ */ s(
47
+ "svg",
48
+ {
49
+ className: t["icon-size-s"],
50
+ style: {
51
+ transition: ".3s",
52
+ rotate: o ? "180deg" : "0deg"
53
+ },
54
+ xmlns: "http://www.w3.org/2000/svg",
55
+ viewBox: "0 0 256 256",
56
+ 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" })
57
+ }
58
+ ),
59
+ label: c ? c.label : p
60
+ }
61
+ ),
62
+ o && /* @__PURE__ */ s("div", { className: O(), children: a.map((e) => /* @__PURE__ */ s(
63
+ "div",
64
+ {
65
+ className: t.option,
66
+ role: "option",
67
+ onClick: () => h(e),
68
+ children: e.label
69
+ },
70
+ e.value
71
+ )) })
72
+ ] });
73
+ };
74
+ export {
75
+ E as Select
76
+ };
@@ -1,35 +1,35 @@
1
1
  import { jsxs as z, jsx as n } from "react/jsx-runtime";
2
- import { useState as d, useRef as i, useLayoutEffect as H } from "react";
3
- import { Button as v } from "../button/Button.js";
4
- import { IconButton as C } from "../icon-button/IconButton.js";
5
- import '../../styles/Tabs.css';const B = "_underline_6d6ac_34", o = {
6
- "tab-container": "_tab-container_6d6ac_21",
7
- "tab-items": "_tab-items_6d6ac_29",
8
- underline: B,
9
- "flexHorizontal-center": "_flexHorizontal-center_6d6ac_42",
10
- "flexHorizontal-left": "_flexHorizontal-left_6d6ac_48",
11
- "flexHorizontal-right": "_flexHorizontal-right_6d6ac_54"
12
- }, k = ({ listItems: r, type: u, onTabSelect: _, defaultActiveTab: m = 0, position: b = "left" }) => {
13
- const [l, x] = d(m), [h, p] = d({}), c = i(null), g = i(null), s = i(new Array(r.length).fill(null)), f = (e) => {
2
+ import { useState as u, useRef as a, useLayoutEffect as R } from "react";
3
+ import { Button as y } from "../button/Button.js";
4
+ import { IconButton as H } from "../icon-button/IconButton.js";
5
+ import '../../styles/Tabs.css';const C = "_underline_118wv_33", o = {
6
+ "tab-container": "_tab-container_118wv_23",
7
+ "tab-items": "_tab-items_118wv_28",
8
+ underline: C,
9
+ "flexHorizontal-center": "_flexHorizontal-center_118wv_41",
10
+ "flexHorizontal-left": "_flexHorizontal-left_118wv_47",
11
+ "flexHorizontal-right": "_flexHorizontal-right_118wv_53"
12
+ }, j = ({ listItems: r, type: d, onTabSelect: _, defaultActiveTab: m = 0, position: b = "left" }) => {
13
+ const [l, x] = u(m), [v, h] = u({}), c = a(null), p = a(null), s = a(new Array(r.length).fill(null)), f = (e) => {
14
14
  x(e), _(r[e]);
15
- }, R = (e) => {
15
+ }, w = (e) => {
16
16
  if (c.current && e) {
17
- const t = e.getBoundingClientRect(), a = c.current.getBoundingClientRect();
18
- p({
19
- left: `${t.left - a.left}px`,
17
+ const t = e.getBoundingClientRect(), i = c.current.getBoundingClientRect();
18
+ h({
19
+ left: `${t.left - i.left}px`,
20
20
  width: `${t.width}px`
21
21
  });
22
22
  }
23
- }, y = [
23
+ }, g = [
24
24
  o[`flexHorizontal-${b}`],
25
25
  o["tab-items"]
26
26
  ].filter(Boolean).join(" ");
27
- return H(() => {
27
+ return R(() => {
28
28
  const e = s.current[l];
29
- e && R(e);
29
+ e && w(e);
30
30
  }, [l]), /* @__PURE__ */ z("div", { className: `tab ${o["tab-container"]}`, ref: c, children: [
31
- /* @__PURE__ */ n("div", { className: y, children: r.map((e, t) => /* @__PURE__ */ n("div", { ref: (a) => s.current[t] = a, children: u === "text" ? /* @__PURE__ */ n(
32
- v,
31
+ /* @__PURE__ */ n("div", { className: g, children: r.map((e, t) => /* @__PURE__ */ n("div", { ref: (i) => s.current[t] = i, children: d === "text" ? /* @__PURE__ */ n(
32
+ y,
33
33
  {
34
34
  label: e,
35
35
  mode: "text",
@@ -37,17 +37,18 @@ import '../../styles/Tabs.css';const B = "_underline_6d6ac_34", o = {
37
37
  onClick: () => f(t)
38
38
  }
39
39
  ) : /* @__PURE__ */ n(
40
- C,
40
+ H,
41
41
  {
42
42
  mode: "icon",
43
+ size: "s",
43
44
  selected: t === l,
44
45
  onClick: () => f(t),
45
46
  children: e
46
47
  }
47
48
  ) }, t)) }),
48
- /* @__PURE__ */ n("div", { ref: g, className: o.underline, style: h })
49
+ /* @__PURE__ */ n("div", { ref: p, className: o.underline, style: v })
49
50
  ] });
50
51
  };
51
52
  export {
52
- k as Tabs
53
+ j as Tabs
53
54
  };
@@ -1,19 +1,19 @@
1
1
  import { jsx as a } from "react/jsx-runtime";
2
- import { useTheme as n } from "../theme/ThemeContext.js";
3
- import '../../styles/TagCounter.css';const t = {
4
- "tag-counter": "_tag-counter_12ztz_21",
5
- "dark-mode": "_dark-mode_12ztz_32",
6
- "tag-counter-size-xl": "_tag-counter-size-xl_12ztz_36",
7
- "tag-counter-size-l": "_tag-counter-size-l_12ztz_43",
8
- "tag-counter-size-m": "_tag-counter-size-m_12ztz_50",
9
- "tag-counter-size-s": "_tag-counter-size-s_12ztz_57"
10
- }, _ = ({ label: e, size: o = "m" }) => {
11
- const { mode: r } = n(), s = [
12
- t["tag-counter"],
13
- t[`tag-counter-size-${o}`],
14
- r === "dark" && t["dark-mode"]
2
+ import { useTheme as u } from "../theme/ThemeContext.js";
3
+ import '../../styles/TagCounter.css';const e = {
4
+ "tag-counter": "_tag-counter_1wqu5_23",
5
+ "dark-mode": "_dark-mode_1wqu5_34",
6
+ "tag-counter-size-xl": "_tag-counter-size-xl_1wqu5_38",
7
+ "tag-counter-size-l": "_tag-counter-size-l_1wqu5_45",
8
+ "tag-counter-size-m": "_tag-counter-size-m_1wqu5_52",
9
+ "tag-counter-size-s": "_tag-counter-size-s_1wqu5_59"
10
+ }, _ = ({ label: t, size: o = "m" }) => {
11
+ const { mode: r } = u(), s = [
12
+ e["tag-counter"],
13
+ e[`tag-counter-size-${o}`],
14
+ r === "dark" && e["dark-mode"]
15
15
  ].join(" ");
16
- return /* @__PURE__ */ a("div", { className: s, children: e });
16
+ return /* @__PURE__ */ a("div", { className: s, children: t });
17
17
  };
18
18
  export {
19
19
  _ as TagCounter
@@ -1,13 +1,13 @@
1
1
  import { jsxs as t, jsx as e } from "react/jsx-runtime";
2
- import '../../styles/Title.css';const n = "_flexHorizontal_1funw_6", r = {
3
- flexHorizontal: n
4
- }, i = ({
2
+ import '../../styles/Title.css';const r = "_flexHorizontal_xid1b_6", s = {
3
+ flexHorizontal: r
4
+ }, n = ({
5
5
  title: o,
6
6
  children: l
7
- }) => /* @__PURE__ */ t("div", { className: `${r.flexHorizontal} gap-xs-3 fontSize30`, children: [
7
+ }) => /* @__PURE__ */ t("div", { className: `${s.flexHorizontal} gap-xs-3`, children: [
8
8
  l,
9
9
  /* @__PURE__ */ e("h1", { children: o })
10
10
  ] });
11
11
  export {
12
- i as Title
12
+ n as Title
13
13
  };
@@ -1,19 +1,19 @@
1
- import { jsxs as d, jsx as h } from "react/jsx-runtime";
1
+ import { jsxs as h, jsx as b } from "react/jsx-runtime";
2
2
  import { useState as _ } from "react";
3
- import { useTheme as u } from "../theme/ThemeContext.js";
4
- import '../../styles/Tooltip.css';const x = "_tooltip_1w7yx_21", o = {
5
- "tooltip-container": "_tooltip-container_1w7yx_21",
6
- tooltip: x,
7
- "tooltip-dark": "_tooltip-dark_1w7yx_42",
8
- "tooltip-light": "_tooltip-light_1w7yx_47"
9
- }, k = ({ children: s, content: a, colorMode: e, position: n = "top", gap: r = "xs-5", padding: p = "xs-5" }) => {
10
- const [c, l] = _(!1), { mode: m } = u(), f = [
3
+ import { useTheme as y } from "../theme/ThemeContext.js";
4
+ import '../../styles/Tooltip.css';const u = "_tooltip_wpb50_23", o = {
5
+ "tooltip-container": "_tooltip-container_wpb50_23",
6
+ tooltip: u,
7
+ "tooltip-dark": "_tooltip-dark_wpb50_44",
8
+ "tooltip-light": "_tooltip-light_wpb50_49"
9
+ }, k = ({ children: s, content: a, colorMode: e, position: p = "top", gap: n = "xs-5", padding: r = "xs-5" }) => {
10
+ const [c, l] = _(!1), { mode: m } = y(), f = [
11
11
  o.tooltip,
12
12
  o[e ? `tooltip-${e}` : m === "light" ? "tooltip-light" : "tooltip-dark"]
13
13
  ].filter(Boolean).join(" "), g = {
14
- "--dynamic-gap": `var(--spacing-${r})`,
15
- "--dynamic-padding": `var(--spacing-${p})`
16
- }, y = () => {
14
+ "--dynamic-gap": `var(--spacing-${n})`,
15
+ "--dynamic-padding": `var(--spacing-${r})`
16
+ }, d = () => {
17
17
  const t = "calc(100% + var(--dynamic-gap))", i = {
18
18
  top: { bottom: t, left: "50%", transform: "translateX(-50%)" },
19
19
  topLeft: { bottom: t, right: "100%" },
@@ -24,9 +24,9 @@ import '../../styles/Tooltip.css';const x = "_tooltip_1w7yx_21", o = {
24
24
  left: { top: "50%", right: t, transform: "translateY(-50%)" },
25
25
  right: { top: "50%", left: t, transform: "translateY(-50%)" }
26
26
  };
27
- return { ...i[n] || i.top };
27
+ return { ...i[p] || i.top };
28
28
  };
29
- return /* @__PURE__ */ d(
29
+ return /* @__PURE__ */ h(
30
30
  "div",
31
31
  {
32
32
  className: o["tooltip-container"],
@@ -35,7 +35,7 @@ import '../../styles/Tooltip.css';const x = "_tooltip_1w7yx_21", o = {
35
35
  onMouseLeave: () => l(!1),
36
36
  children: [
37
37
  s,
38
- c && /* @__PURE__ */ h("div", { className: f, style: y(), children: a })
38
+ c && /* @__PURE__ */ b("div", { className: f, style: d(), children: a })
39
39
  ]
40
40
  }
41
41
  );
@@ -1 +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}
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}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}
@@ -1 +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}
1
+ ._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}
@@ -1 +1 @@
1
- ._button_pjwt4_21{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_pjwt4_21:focus-visible{outline:none}._button_pjwt4_21:disabled{background-color:#0f0f0f0d;color:#0f0f0f66;border:1px solid rgba(15,15,15,.1);cursor:initial;pointer-events:none}._button_pjwt4_21:disabled *{fill:#0f0f0f66}._button-round_pjwt4_48._button_pjwt4_21{border-radius:50%}._button-primary_pjwt4_51{color:var(--dynamic-color-text);background-color:var(--dynamic-color)}._button-primary_pjwt4_51:hover{background-color:var(--dynamic-color-hover)}._button-primary_pjwt4_51:active{background-color:var(--dynamic-color-activated)}._button-primary_pjwt4_51 *{fill:var(--dynamic-color-text)}._button-secondary_pjwt4_64{color:var(--color-text);background-color:#96b4ee33;border:1px solid rgba(150,180,238,.5)}._button-secondary_pjwt4_64:hover{background-color:#96b4ee66}._button-secondary_pjwt4_64:active{background-color:#96b4ee99}._button-secondary_pjwt4_64 *{fill:var(--color-text)}._button-tertiary_pjwt4_78{color:var(--color-text);background-color:transparent;border:1px solid rgba(150,180,238,.5)}._button-tertiary_pjwt4_78:hover{background-color:#96b4ee1a}._button-tertiary_pjwt4_78:active{background-color:#96b4ee33}._button-tertiary_pjwt4_78 *{fill:var(--color-text)}._button-ghost_pjwt4_92{color:var(--color-text);background-color:transparent}._button-ghost_pjwt4_92:hover{background-color:#96b4ee1a}._button-ghost_pjwt4_92:active{background-color:#96b4ee33}._button-ghost_pjwt4_92 *{fill:var(--color-text)}._button-icon_pjwt4_105{fill:#96b4eecc;background-color:transparent}._button-icon_pjwt4_105:hover{fill:#96b4ee}._button-icon_pjwt4_105:disabled{border:none;background-color:transparent;fill:#a5b4bb}._button-icon-selected_pjwt4_117,._button-icon-selected_pjwt4_117:hover{fill:var(--color-text)}._button-icon_pjwt4_105 svg{fill:inherit}._button-error_pjwt4_126{color:#fff;background-color:#ff4747}._button-error_pjwt4_126:hover{background-color:#ed1515}._button-error_pjwt4_126:active{background-color:#c80d0d}._button-error_pjwt4_126 *{fill:var(--color-text)}._button-size-xl_pjwt4_139{border-radius:.5rem;padding:1rem;font-size:1.125em}._button-size-l_pjwt4_144{border-radius:.5rem;padding:.75rem;font-size:1em}._button-size-m_pjwt4_149{border-radius:.25rem;padding:.5rem;font-size:.875em}._button-size-s_pjwt4_154{border-radius:.25rem;padding:.375rem;font-size:.75em}._flexHorizontalCenter_pjwt4_160{display:flex;justify-content:center;align-items:center;flex-direction:row}
1
+ ._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}
@@ -1 +1 @@
1
- input{font-family:Urbanist,sans-serif;border:none;background-color:transparent;width:auto}input:focus{outline:none;box-shadow:none;border-color:transparent}input::placeholder{font-family:Urbanist,sans-serif;color:var(--dynamic-color)}._input-style_tg8sh_38{font-family:Urbanist,sans-serif;border:1px solid rgba(150,180,238,.5);color:var(--dynamic-color)}._input-style_tg8sh_38 input{color:var(--dynamic-color-activated)}._input-style_tg8sh_38 *{fill:var(--dynamic-color)}._input-style-disabled_tg8sh_50{background-color:#0f0f0f0d;border-color:var(--dynamic-color-border-disabled);pointer-events:none}._input-style-disabled_tg8sh_50 input{color:var(--dynamic-color-disabled)}._input-style-disabled_tg8sh_50 *{fill:var(--dynamic-color-disabled)}._input-style-focused_tg8sh_61{color:var(--dynamic-color);border-color:var(--dynamic-color-border);background-color:var(--dynamic-background-color)}._input-style-focused_tg8sh_61 *{fill:var(--dynamic-color-activated)}._input-style-secondary_tg8sh_69{background-color:#96b4ee33;color:var(--dynamic-color-secondary);border:1px solid rgba(150,180,238,.5)}._input-style-secondary_tg8sh_69 input{color:var(--dynamic-color-secondary)}._input-style-secondary_tg8sh_69 input::placeholder{color:var(--dynamic-color-secondary)}._input-style-secondary_tg8sh_69 *{fill:var(--dynamic-color-secondary)}._input-style-ghost_tg8sh_83{border:none}._input-style-error_tg8sh_86{border-color:#ff4747;color:#ff4747}._input-style-error_tg8sh_86 input::placeholder{color:#ff4747}._input-style-error_tg8sh_86 *{fill:#ff4747}._input-style-success_tg8sh_96{border-color:#33b449;color:#33b449}._input-style-success_tg8sh_96 input::placeholder{color:#33b449}._input-style-success_tg8sh_96 *{fill:#33b449}._input-style_tg8sh_38 ._input-container_tg8sh_106{position:relative;width:100%}._input-style-size-xl_tg8sh_110{padding:1rem;font-size:1.125em;line-height:28px;border-radius:8px;gap:.625rem}._input-style-size-xl_tg8sh_110 input{line-height:28px}._input-style-size-l_tg8sh_120{padding:.75rem;font-size:1em;line-height:24px;border-radius:8px;gap:.5rem}._input-style-size-l_tg8sh_120 input{line-height:24px}._input-style-size-m_tg8sh_130{padding:.5rem;font-size:.875em;line-height:20px;border-radius:4px;gap:.375rem}._input-style-size-m_tg8sh_130 input{line-height:20px}._input-style-size-s_tg8sh_140{padding:.375rem;font-size:.75em;line-height:16px;border-radius:4px;gap:.25rem}._input-style-size-s_tg8sh_140 input{line-height:16px}._input-style-radius_tg8sh_150{border-radius:50px}._flexHorizontalBetween_tg8sh_154{display:flex;justify-content:space-between;align-items:center;flex-direction:row}._flexHorizontal_tg8sh_154{display:flex;justify-content:flex-start;align-items:center;flex-direction:row}
1
+ 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}
@@ -0,0 +1 @@
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}
@@ -1 +1 @@
1
- ._tab-container_6d6ac_21{position:relative;color:#a5b4bb;font-weight:500;font-size:.875em;line-height:1.25rem;border-bottom:1px solid rgba(150,180,238,.8)}._tab-items_6d6ac_29{gap:2.25rem;padding:.625rem .125rem}._underline_6d6ac_34{position:absolute;bottom:0;height:2px;background-color:var(--primary-color);transition:all .3s ease}._flexHorizontal-center_6d6ac_42{display:flex;justify-content:center;align-items:center;flex-direction:row}._flexHorizontal-left_6d6ac_48{display:flex;justify-content:flex-start;align-items:center;flex-direction:row}._flexHorizontal-right_6d6ac_54{display:flex;justify-content:flex-end;align-items:center;flex-direction:row}
1
+ ._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}
@@ -1 +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}
1
+ ._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}
@@ -1 +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}
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-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}
@@ -1 +1 @@
1
- ._flexHorizontal_1funw_6{display:flex;justify-content:flex-start;align-items:center;flex-direction:row}h1{margin:0;padding:0;font-style:normal;font-weight:700;line-height:36px}
1
+ ._flexHorizontal_xid1b_6{display:flex;justify-content:flex-start;align-items:center;flex-direction:row}h1{margin:0;padding:0}
@@ -1 +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}
1
+ ._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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@situaction/traq-ui-ste",
3
- "version": "1.0.22",
3
+ "version": "1.0.24",
4
4
  "description": "library react component Situaction",
5
5
  "main": "dist/main.js",
6
6
  "types": "dist/main.d.ts",