welcome-ui 9.0.15 → 9.1.1

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.
Files changed (106) hide show
  1. package/README.md +1 -1
  2. package/dist/Accordion.css +1 -1
  3. package/dist/Accordion.js +20 -20
  4. package/dist/Alert.css +1 -1
  5. package/dist/Alert.js +64 -64
  6. package/dist/Avatar.css +1 -1
  7. package/dist/Avatar.js +23 -23
  8. package/dist/Badge.css +1 -1
  9. package/dist/Badge.js +25 -25
  10. package/dist/Breadcrumb.css +1 -1
  11. package/dist/Breadcrumb.js +20 -20
  12. package/dist/Button.css +1 -1
  13. package/dist/Button.js +47 -47
  14. package/dist/Card.css +1 -1
  15. package/dist/Card.js +10 -10
  16. package/dist/Checkbox.css +1 -1
  17. package/dist/Checkbox.js +19 -19
  18. package/dist/CloseButton.css +1 -1
  19. package/dist/CloseButton.js +14 -14
  20. package/dist/CustomPopper.css +1 -1
  21. package/dist/DatePicker.js +4 -4
  22. package/dist/DateTimePicker.js +1 -1
  23. package/dist/Drawer.css +1 -1
  24. package/dist/Drawer.js +101 -101
  25. package/dist/DropdownMenu.css +1 -1
  26. package/dist/DropdownMenu.js +6 -6
  27. package/dist/Field.css +1 -1
  28. package/dist/Field.js +14 -14
  29. package/dist/FieldGroup.css +1 -1
  30. package/dist/FieldGroup.js +9 -9
  31. package/dist/FileDrop.css +1 -1
  32. package/dist/FileDrop.js +66 -66
  33. package/dist/FileUpload.css +1 -1
  34. package/dist/FileUpload.js +38 -38
  35. package/dist/Hint.css +1 -1
  36. package/dist/Hint.js +11 -11
  37. package/dist/Icon-6NFFlbYr.js +30 -0
  38. package/dist/Icon.css +1 -1
  39. package/dist/Icon.js +12 -12
  40. package/dist/InputText.css +1 -1
  41. package/dist/InputText.js +41 -41
  42. package/dist/Label.css +1 -1
  43. package/dist/Label.js +11 -11
  44. package/dist/Link.css +1 -1
  45. package/dist/Link.js +25 -25
  46. package/dist/Loader.css +1 -1
  47. package/dist/Loader.js +21 -21
  48. package/dist/Logo.css +1 -1
  49. package/dist/Logo.js +1 -1
  50. package/dist/Modal.css +1 -1
  51. package/dist/Modal.js +104 -104
  52. package/dist/Pagination.css +1 -1
  53. package/dist/Pagination.js +34 -34
  54. package/dist/PasswordInput.js +2 -2
  55. package/dist/Popover.css +1 -1
  56. package/dist/Popover.js +75 -75
  57. package/dist/Radio.css +1 -1
  58. package/dist/Radio.js +22 -22
  59. package/dist/RadioGroup.css +1 -1
  60. package/dist/RadioGroup.js +15 -15
  61. package/dist/RadioTab.css +1 -1
  62. package/dist/RadioTab.js +14 -14
  63. package/dist/Search.css +1 -1
  64. package/dist/Search.js +105 -105
  65. package/dist/Select.css +1 -1
  66. package/dist/Select.js +299 -316
  67. package/dist/Slider.css +1 -1
  68. package/dist/Slider.js +139 -139
  69. package/dist/Swiper.css +1 -1
  70. package/dist/Swiper.js +49 -49
  71. package/dist/Table.css +1 -1
  72. package/dist/Table.js +21 -21
  73. package/dist/Tabs.css +1 -1
  74. package/dist/Tabs.js +53 -53
  75. package/dist/Tag.css +1 -1
  76. package/dist/Tag.js +59 -59
  77. package/dist/Text.css +1 -1
  78. package/dist/Text.js +38 -38
  79. package/dist/Textarea.css +1 -1
  80. package/dist/Textarea.js +13 -13
  81. package/dist/TimePicker.js +1 -1
  82. package/dist/Toast.css +1 -1
  83. package/dist/Toast.js +92 -92
  84. package/dist/Toggle.css +1 -1
  85. package/dist/Toggle.js +14 -14
  86. package/dist/Tooltip.css +1 -1
  87. package/dist/Tooltip.js +1 -1
  88. package/dist/VariantIcon.css +1 -1
  89. package/dist/VariantIcon.js +17 -17
  90. package/dist/WelcomeLoader.js +1 -1
  91. package/dist/{index-CWVOLBDY.js → index-0-R1dN5M.js} +1 -1
  92. package/dist/{index-Dcq5gh3E.js → index-BVLUYl2k.js} +1 -1
  93. package/dist/{index-Cvtm6uuS.js → index-BeRXG_2L.js} +1 -1
  94. package/dist/{index-lbUBMgHp.js → index-BnmY6B8X.js} +2 -2
  95. package/dist/{index-BG2aV9o8.js → index-Bs8eheHX.js} +1 -1
  96. package/dist/{index-CTgip19b.js → index-CXnMDXEI.js} +1 -1
  97. package/dist/{index-DL4-ut3P.js → index-CxSNo-75.js} +1 -1
  98. package/dist/{index-C1jjVTAc.js → index-DwCitn4e.js} +1 -1
  99. package/dist/{index-C8GsqBDe.js → index-El_pLPkJ.js} +1 -1
  100. package/dist/{index-CnxSNAPH.js → index-P19C5FOE.js} +1 -1
  101. package/dist/{index-BJLXLdM3.js → index-Rhin_BZ2.js} +1 -1
  102. package/dist/{index-5rXezknO.js → index-kGm5brPn.js} +1 -1
  103. package/dist/{utils-BNMgUIHQ.js → utils-BH1Mz5gU.js} +21 -21
  104. package/dist/utils.css +1 -1
  105. package/package.json +1 -1
  106. package/dist/Icon-BisRi8B3.js +0 -30
package/README.md CHANGED
@@ -50,7 +50,7 @@ On your theme or global css import:
50
50
  - Welcome UI components style
51
51
 
52
52
  ```css
53
- @import 'tailwindcss';
53
+ @import 'tailwindcss' prefix(nine);
54
54
 
55
55
  @import 'welcome-ui/theme.css';
56
56
 
@@ -1 +1 @@
1
- @layer components{._root_173le_2{background-color:var(--color-neutral-10);border:var(--border-width-sm) solid var(--color-neutral-30);border-radius:var(--radius-md);transition:var(--duration-medium)}._root_173le_2:hover{border-color:var(--color-neutral-50)}._icon_173le_11{flex-shrink:0;transform:rotate3d(0);transition:var(--duration-medium);padding:var(--spacing-sm);display:flex;border-radius:var(--radius-circle);color:var(--color-neutral-90)}._icon_173le_11 *:first-child{margin:auto}._disclosure_173le_23{width:100%;padding:var(--spacing-lg);background-color:transparent;border:0;display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-lg)}._disclosure_173le_23[aria-expanded=true] ._icon_173le_11{transform:rotate3d(0,0,1,90deg)}._disclosure_173le_23:focus,._disclosure_173le_23:hover{cursor:pointer}._disclosure_173le_23:focus ._icon_173le_11,._disclosure_173le_23:hover ._icon_173le_11{background-color:var(--color-neutral-30)}._disclosure_173le_23:focus{outline:0}._disclosure_173le_23:focus ._icon_173le_11{color:inherit}._disclosure-content_173le_48{display:grid;grid-template-rows:0fr;transition-property:grid-template-rows;transition-timing-function:linear;transition-duration:.2s;animation-duration:.2s}._disclosure-content_173le_48>*{overflow:hidden;padding:0}._disclosure-content_173le_48[data-enter]{grid-template-rows:1fr}._content-child_173le_63{padding:var(--spacing-lg);padding-top:0;color:var(--color-neutral-70);font-size:var(--font-size-sm)}}
1
+ @layer components{._root_tvvmx_2{background-color:var(--nine-color-neutral-10);border:var(--nine-border-width-sm) solid var(--nine-color-neutral-30);border-radius:var(--nine-radius-md);transition:var(--nine-duration-medium)}._root_tvvmx_2:hover{border-color:var(--nine-color-neutral-50)}._icon_tvvmx_11{flex-shrink:0;transform:rotate3d(0);transition:var(--nine-duration-medium);padding:var(--nine-spacing-sm);display:flex;border-radius:var(--nine-radius-circle);color:var(--nine-color-neutral-90)}._icon_tvvmx_11 *:first-child{margin:auto}._disclosure_tvvmx_23{width:100%;padding:var(--nine-spacing-lg);background-color:transparent;border:0;display:flex;justify-content:space-between;align-items:center;gap:var(--nine-spacing-lg)}._disclosure_tvvmx_23[aria-expanded=true] ._icon_tvvmx_11{transform:rotate3d(0,0,1,90deg)}._disclosure_tvvmx_23:focus,._disclosure_tvvmx_23:hover{cursor:pointer}._disclosure_tvvmx_23:focus ._icon_tvvmx_11,._disclosure_tvvmx_23:hover ._icon_tvvmx_11{background-color:var(--nine-color-neutral-30)}._disclosure_tvvmx_23:focus{outline:0}._disclosure_tvvmx_23:focus ._icon_tvvmx_11{color:inherit}._disclosure-content_tvvmx_48{display:grid;grid-template-rows:0fr;transition-property:grid-template-rows;transition-timing-function:linear;transition-duration:.2s;animation-duration:.2s}._disclosure-content_tvvmx_48>*{overflow:hidden;padding:0}._disclosure-content_tvvmx_48[data-enter]{grid-template-rows:1fr}._content-child_tvvmx_63{padding:var(--nine-spacing-lg);padding-top:0;color:var(--nine-color-neutral-70);font-size:var(--nine-font-size-sm)}}
package/dist/Accordion.js CHANGED
@@ -1,30 +1,30 @@
1
1
  "use client";
2
- import { jsxs as t, jsx as o } from "react/jsx-runtime";
2
+ import { jsxs as i, jsx as o } from "react/jsx-runtime";
3
3
  import { D as d } from "./NMGNQVTG-a9HpYqEe.js";
4
4
  import { D as a } from "./T22PY7TE-BxbmImwX.js";
5
5
  import { u as k } from "./T22PY7TE-BxbmImwX.js";
6
- import { forwardRef as _ } from "react";
7
- import "./Icon-BisRi8B3.js";
8
- import { R as u } from "./index-Dcq5gh3E.js";
9
- import { Text as f } from "./Text.js";
10
- import { c as h } from "./index-PAaZGbyz.js";
11
- const p = "_root_173le_2", v = "_icon_173le_11", x = "_disclosure_173le_23", N = {
12
- root: p,
13
- icon: v,
14
- disclosure: x,
15
- "disclosure-content": "_disclosure-content_173le_48",
16
- "content-child": "_content-child_173le_63"
17
- }, s = h(N), z = _(
18
- ({ children: e, className: r, dataTestId: c, store: i, title: n, ...l }, m) => /* @__PURE__ */ t("div", { className: s("root", r), ref: m, ...l, children: [
19
- /* @__PURE__ */ t(
6
+ import { forwardRef as v } from "react";
7
+ import "./Icon-6NFFlbYr.js";
8
+ import { R as _ } from "./index-BVLUYl2k.js";
9
+ import { Text as u } from "./Text.js";
10
+ import { c as x } from "./index-PAaZGbyz.js";
11
+ const f = "_root_tvvmx_2", h = "_icon_tvvmx_11", p = "_disclosure_tvvmx_23", N = {
12
+ root: f,
13
+ icon: h,
14
+ disclosure: p,
15
+ "disclosure-content": "_disclosure-content_tvvmx_48",
16
+ "content-child": "_content-child_tvvmx_63"
17
+ }, s = x(N), z = v(
18
+ ({ children: r, className: e, dataTestId: c, store: t, title: n, ...m }, l) => /* @__PURE__ */ i("div", { className: s("root", e), ref: l, ...m, children: [
19
+ /* @__PURE__ */ i(
20
20
  d,
21
21
  {
22
22
  className: s("disclosure"),
23
23
  "data-testid": c ? `${c}-title` : void 0,
24
- store: i,
24
+ store: t,
25
25
  children: [
26
- /* @__PURE__ */ o(f, { variant: "h5", children: n }),
27
- /* @__PURE__ */ o("div", { className: s("icon"), children: /* @__PURE__ */ o(u, { size: "sm" }) })
26
+ /* @__PURE__ */ o(u, { variant: "h5", children: n }),
27
+ /* @__PURE__ */ o("div", { className: s("icon"), children: /* @__PURE__ */ o(_, { size: "sm" }) })
28
28
  ]
29
29
  }
30
30
  ),
@@ -33,8 +33,8 @@ const p = "_root_173le_2", v = "_icon_173le_11", x = "_disclosure_173le_23", N =
33
33
  {
34
34
  className: s("disclosure-content"),
35
35
  "data-testid": c ? `${c}-content` : void 0,
36
- store: i,
37
- children: /* @__PURE__ */ o("div", { className: s("content-child"), children: e })
36
+ store: t,
37
+ children: /* @__PURE__ */ o("div", { className: s("content-child"), children: r })
38
38
  }
39
39
  )
40
40
  ] })
package/dist/Alert.css CHANGED
@@ -1 +1 @@
1
- @layer components{._root_1c0qe_2{position:relative;display:flex;align-items:flex-start;width:100%;border-radius:var(--radius-lg);border:var(--border-width-sm) solid;padding:var(--padding);max-width:var(--maxWidth, max-content);background-color:var(--backgroundColor, var(--color-neutral-10));border-color:var(--borderColor, var(--color-neutral-30));color:var(--color, var(--color-neutral-80))}._size-sm_1c0qe_16{--padding: var(--spacing-lg)}._size-md_1c0qe_19{--padding: var(--spacing-xl)}._variant-ai_1c0qe_22{--backgroundColor: var(--color-violet-10);--borderColor: var(--color-violet-10);--color: var(--color-violet-90)}._variant-beige_1c0qe_27{--backgroundColor: var(--color-beige-20);--borderColor: var(--color-beige-20);--color: var(--color-beige-80)}._variant-danger_1c0qe_32{--backgroundColor: var(--color-red-10);--borderColor: var(--color-red-10);--color: var(--color-red-90)}._variant-info_1c0qe_37{--backgroundColor: var(--color-blue-10);--borderColor: var(--color-blue-10);--color: var(--color-blue-90)}._variant-success_1c0qe_42{--backgroundColor: var(--color-green-10);--borderColor: var(--color-green-10);--color: var(--color-green-90)}._variant-warning_1c0qe_47{--backgroundColor: var(--color-orange-10);--borderColor: var(--color-orange-10);--color: var(--color-orange-90)}._full-width_1c0qe_52{--maxWidth: 100%}._icon_1c0qe_55._size-sm_1c0qe_16 svg{margin-top:1px}._icon_1c0qe_55._size-sm_1c0qe_16 ._content_1c0qe_58{margin-left:var(--spacing-md)}._icon_1c0qe_55._size-md_1c0qe_19 svg{margin-top:-3px}._icon_1c0qe_55._size-md_1c0qe_19 ._content_1c0qe_58{margin-left:var(--spacing-lg)}._content_1c0qe_58{display:flex;gap:var(--spacing-md);flex-direction:column;justify-content:space-between;align-items:flex-start;flex:1}._content-text_1c0qe_76{flex:1}._content-actions_1c0qe_79{display:flex;align-items:center;gap:var(--spacing-sm)}._variant-icon_1c0qe_84{align-self:start}._title_1c0qe_88{font-weight:var(--font-weight-500);margin-bottom:var(--titleMarginBottom)}._title-size-sm_1c0qe_93{--titleMarginBottom: var(--spacing-xs)}._title-size-md_1c0qe_96{--titleMarginBottom: var(--spacing-sm)}._title-close-button_1c0qe_99{margin-right:var(--spacing-xl)}._close-button_1c0qe_103{position:absolute;right:var(--spacing-sm);top:var(--spacing-sm)}}
1
+ @layer components{._root_baz3m_2{position:relative;display:flex;align-items:flex-start;width:100%;border-radius:var(--nine-radius-lg);border:var(--nine-border-width-sm) solid;padding:var(--padding);max-width:var(--maxWidth, max-content);background-color:var(--backgroundColor, var(--nine-color-neutral-10));border-color:var(--borderColor, var(--nine-color-neutral-30));color:var(--color, var(--nine-color-neutral-80))}._size-sm_baz3m_16{--padding: var(--nine-spacing-lg)}._size-md_baz3m_19{--padding: var(--nine-spacing-xl)}._variant-ai_baz3m_22{--backgroundColor: var(--nine-color-violet-10);--borderColor: var(--nine-color-violet-10);--color: var(--nine-color-violet-90)}._variant-beige_baz3m_27{--backgroundColor: var(--nine-color-beige-20);--borderColor: var(--nine-color-beige-20);--color: var(--nine-color-beige-80)}._variant-danger_baz3m_32{--backgroundColor: var(--nine-color-red-10);--borderColor: var(--nine-color-red-10);--color: var(--nine-color-red-90)}._variant-info_baz3m_37{--backgroundColor: var(--nine-color-blue-10);--borderColor: var(--nine-color-blue-10);--color: var(--nine-color-blue-90)}._variant-success_baz3m_42{--backgroundColor: var(--nine-color-green-10);--borderColor: var(--nine-color-green-10);--color: var(--nine-color-green-90)}._variant-warning_baz3m_47{--backgroundColor: var(--nine-color-orange-10);--borderColor: var(--nine-color-orange-10);--color: var(--nine-color-orange-90)}._full-width_baz3m_52{--maxWidth: 100%}._icon_baz3m_55._size-sm_baz3m_16 svg{margin-top:1px}._icon_baz3m_55._size-sm_baz3m_16 ._content_baz3m_58{margin-left:var(--nine-spacing-md)}._icon_baz3m_55._size-md_baz3m_19 svg{margin-top:-3px}._icon_baz3m_55._size-md_baz3m_19 ._content_baz3m_58{margin-left:var(--nine-spacing-lg)}._content_baz3m_58{display:flex;gap:var(--nine-spacing-md);flex-direction:column;justify-content:space-between;align-items:flex-start;flex:1}._content-text_baz3m_76{flex:1}._content-actions_baz3m_79{display:flex;align-items:center;gap:var(--nine-spacing-sm)}._variant-icon_baz3m_84{align-self:start}._title_baz3m_88{font-weight:var(--nine-font-weight-500);margin-bottom:var(--titleMarginBottom)}._title-size-sm_baz3m_93{--titleMarginBottom: var(--nine-spacing-xs)}._title-size-md_baz3m_96{--titleMarginBottom: var(--nine-spacing-sm)}._title-close-button_baz3m_99{margin-right:var(--nine-spacing-xl)}._close-button_baz3m_103{position:absolute;right:var(--nine-spacing-sm);top:var(--nine-spacing-sm)}}
package/dist/Alert.js CHANGED
@@ -1,98 +1,98 @@
1
1
  "use client";
2
- import { jsxs as v, jsx as r } from "react/jsx-runtime";
3
- import C, { forwardRef as I, Children as q, cloneElement as _ } from "react";
4
- import { Button as d } from "./Button.js";
5
- import { CloseButton as R } from "./CloseButton.js";
6
- import { Text as w } from "./Text.js";
7
- import { VariantIcon as S } from "./VariantIcon.js";
8
- import { c as T } from "./index-PAaZGbyz.js";
9
- import { f as y } from "./forwardRefWithAs-8eP3ZN15.js";
10
- const V = "_root_1c0qe_2", $ = "_icon_1c0qe_55", E = "_content_1c0qe_58", O = "_title_1c0qe_88", W = {
11
- root: V,
12
- "size-sm": "_size-sm_1c0qe_16",
13
- "size-md": "_size-md_1c0qe_19",
14
- "variant-ai": "_variant-ai_1c0qe_22",
15
- "variant-beige": "_variant-beige_1c0qe_27",
16
- "variant-danger": "_variant-danger_1c0qe_32",
17
- "variant-info": "_variant-info_1c0qe_37",
18
- "variant-success": "_variant-success_1c0qe_42",
19
- "variant-warning": "_variant-warning_1c0qe_47",
20
- "full-width": "_full-width_1c0qe_52",
21
- icon: $,
22
- content: E,
23
- "content-text": "_content-text_1c0qe_76",
24
- "content-actions": "_content-actions_1c0qe_79",
25
- "variant-icon": "_variant-icon_1c0qe_84",
26
- title: O,
27
- "title-size-sm": "_title-size-sm_1c0qe_93",
28
- "title-size-md": "_title-size-md_1c0qe_96",
29
- "title-close-button": "_title-close-button_1c0qe_99",
30
- "close-button": "_close-button_1c0qe_103"
31
- }, i = T(W), D = I(
32
- ({ children: n, className: o, cta: e, handleClose: c, hideIcon: A, isFullWidth: g, size: s = "sm", variant: a, ...B }, z) => {
33
- const h = a === "beige" ? void 0 : a, l = a === "ai", m = !A, j = q.toArray(n).map((t) => t.type === x ? _(t, { hasCloseButton: !!c, variant: s }) : t), u = (t) => {
34
- var p;
2
+ import { jsxs as z, jsx as i } from "react/jsx-runtime";
3
+ import I, { forwardRef as R, Children as p, cloneElement as _ } from "react";
4
+ import { Button as v } from "./Button.js";
5
+ import { CloseButton as S } from "./CloseButton.js";
6
+ import { Text as d } from "./Text.js";
7
+ import { VariantIcon as T } from "./VariantIcon.js";
8
+ import { c as V } from "./index-PAaZGbyz.js";
9
+ import { f as w } from "./forwardRefWithAs-8eP3ZN15.js";
10
+ const $ = "_root_baz3m_2", E = "_icon_baz3m_55", O = "_content_baz3m_58", W = "_title_baz3m_88", q = {
11
+ root: $,
12
+ "size-sm": "_size-sm_baz3m_16",
13
+ "size-md": "_size-md_baz3m_19",
14
+ "variant-ai": "_variant-ai_baz3m_22",
15
+ "variant-beige": "_variant-beige_baz3m_27",
16
+ "variant-danger": "_variant-danger_baz3m_32",
17
+ "variant-info": "_variant-info_baz3m_37",
18
+ "variant-success": "_variant-success_baz3m_42",
19
+ "variant-warning": "_variant-warning_baz3m_47",
20
+ "full-width": "_full-width_baz3m_52",
21
+ icon: E,
22
+ content: O,
23
+ "content-text": "_content-text_baz3m_76",
24
+ "content-actions": "_content-actions_baz3m_79",
25
+ "variant-icon": "_variant-icon_baz3m_84",
26
+ title: W,
27
+ "title-size-sm": "_title-size-sm_baz3m_93",
28
+ "title-size-md": "_title-size-md_baz3m_96",
29
+ "title-close-button": "_title-close-button_baz3m_99",
30
+ "close-button": "_close-button_baz3m_103"
31
+ }, a = V(q), D = R(
32
+ ({ children: e, className: o, cta: n, handleClose: s, hideIcon: A, isFullWidth: g, size: r = "sm", variant: c, ...B }, h) => {
33
+ const j = c === "beige" ? void 0 : c, m = c === "ai", l = !A, k = p.toArray(e).map((t) => t.type === x ? _(t, { hasCloseButton: !!s, variant: r }) : t), u = (t) => {
34
+ var f;
35
35
  if (t) {
36
- if (t.type === b)
36
+ if (t.type === y)
37
37
  return _(t, {
38
- size: s,
39
- variant: l ? "primary-ai" : void 0
38
+ size: r,
39
+ variant: m ? "primary-ai" : void 0
40
40
  });
41
41
  if (t.type === N)
42
42
  return _(t, {
43
- size: s,
44
- variant: l ? "tertiary-ai" : void 0
43
+ size: r,
44
+ variant: m ? "tertiary-ai" : void 0
45
45
  });
46
- if ((p = t.props) != null && p.children)
46
+ if ((f = t.props) != null && f.children)
47
47
  return _(t, {
48
48
  ...t.props,
49
- children: q.map(
49
+ children: p.map(
50
50
  t.props.children,
51
- (k) => u(k)
51
+ (C) => u(C)
52
52
  )
53
53
  });
54
54
  }
55
55
  return t;
56
- }, f = C.isValidElement(e) ? u(e) : e;
57
- return /* @__PURE__ */ v(
56
+ }, b = I.isValidElement(n) ? u(n) : n;
57
+ return /* @__PURE__ */ z(
58
58
  "div",
59
59
  {
60
- className: i(
60
+ className: a(
61
61
  "root",
62
62
  g && "full-width",
63
- s && `size-${s}`,
64
- a && `variant-${a}`,
65
- m && "icon",
63
+ r && `size-${r}`,
64
+ c && `variant-${c}`,
65
+ l && "icon",
66
66
  o
67
67
  ),
68
- ref: z,
68
+ ref: h,
69
69
  ...B,
70
70
  children: [
71
- !!c && /* @__PURE__ */ r(R, { className: i("close-button"), onClick: c, size: "xs" }),
72
- m ? /* @__PURE__ */ r(S, { className: i("variant-icon"), size: s, variant: h }) : null,
73
- /* @__PURE__ */ v("div", { className: i("content"), children: [
74
- /* @__PURE__ */ r(w, { as: "div", className: i("content-text"), children: j }),
75
- !!f && /* @__PURE__ */ r("div", { className: i("content-actions"), children: f })
71
+ !!s && /* @__PURE__ */ i(S, { className: a("close-button"), onClick: s, size: "xs" }),
72
+ l ? /* @__PURE__ */ i(T, { className: a("variant-icon"), size: r, variant: j }) : null,
73
+ /* @__PURE__ */ z("div", { className: a("content"), children: [
74
+ /* @__PURE__ */ i(d, { as: "div", className: a("content-text"), children: k }),
75
+ !!b && /* @__PURE__ */ i("div", { className: a("content-actions"), children: b })
76
76
  ] })
77
77
  ]
78
78
  }
79
79
  );
80
80
  }
81
- ), b = y(
82
- ({ variant: n = "secondary", ...o }, e) => /* @__PURE__ */ r(d, { className: "shrink-0 w-fit", ref: e, ...o, variant: n })
83
- ), N = y(
84
- ({ variant: n = "tertiary", ...o }, e) => /* @__PURE__ */ r(d, { className: "shrink-0 w-fit", ref: e, ...o, variant: n })
85
- ), x = ({ children: n, hasCloseButton: o, variant: e, ...c }) => /* @__PURE__ */ r(
86
- w,
81
+ ), y = w(
82
+ ({ variant: e = "secondary", ...o }, n) => /* @__PURE__ */ i(v, { className: "nine:shrink-0 nine:w-fit", ref: n, ...o, variant: e })
83
+ ), N = w(
84
+ ({ variant: e = "tertiary", ...o }, n) => /* @__PURE__ */ i(v, { className: "nine:shrink-0 nine:w-fit", ref: n, ...o, variant: e })
85
+ ), x = ({ children: e, hasCloseButton: o, variant: n, ...s }) => /* @__PURE__ */ i(
86
+ d,
87
87
  {
88
88
  as: "span",
89
- className: i("title", `title-size-${e}`, o && "title-close-button"),
90
- variant: e,
91
- ...c,
92
- children: n
89
+ className: a("title", `title-size-${n}`, o && "title-close-button"),
90
+ variant: n,
91
+ ...s,
92
+ children: e
93
93
  }
94
94
  ), Q = Object.assign(D, {
95
- Button: b,
95
+ Button: y,
96
96
  SecondaryButton: N,
97
97
  Title: x
98
98
  });
package/dist/Avatar.css CHANGED
@@ -1 +1 @@
1
- @layer components{._root_zm5un_2{flex-shrink:0;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;aspect-ratio:1/1;border-radius:var(--radius-circle);color:var(--color-neutral-90);font-weight:var(--font-weight-medium);width:var(--size);height:var(--size);background-color:var(--backgroundColor);font-size:calc(var(--size) / 2.5)}._root_zm5un_2 img{object-fit:cover;width:100%;height:100%}._size-sm_zm5un_24{--size: var(--height-20)}._size-md_zm5un_27{--size: var(--height-30)}._size-lg_zm5un_30{--size: var(--height-40)}._size-xl_zm5un_33{--size: var(--height-50)}._size-xxl_zm5un_36{--size: var(--height-60)}._background-secondary-blue_zm5un_39{--backgroundColor: var(--color-secondary-blue)}._background-secondary-green_zm5un_42{--backgroundColor: var(--color-secondary-green)}._background-secondary-orange_zm5un_45{--backgroundColor: var(--color-secondary-orange)}._background-secondary-pink_zm5un_48{--backgroundColor: var(--color-secondary-pink)}._background-secondary-teal_zm5un_51{--backgroundColor: var(--color-secondary-teal)}._background-secondary-violet_zm5un_54{--backgroundColor: var(--color-secondary-violet)}}
1
+ @layer components{._root_ak32f_2{flex-shrink:0;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;aspect-ratio:1/1;border-radius:var(--nine-radius-circle);color:var(--nine-color-neutral-90);font-weight:var(--nine-font-weight-medium);width:var(--size);height:var(--size);background-color:var(--backgroundColor);font-size:calc(var(--size) / 2.5)}._root_ak32f_2 img{object-fit:cover;width:100%;height:100%}._size-sm_ak32f_24{--size: var(--nine-height-20)}._size-md_ak32f_27{--size: var(--nine-height-30)}._size-lg_ak32f_30{--size: var(--nine-height-40)}._size-xl_ak32f_33{--size: var(--nine-height-50)}._size-xxl_ak32f_36{--size: var(--nine-height-60)}._background-secondary-blue_ak32f_39{--backgroundColor: var(--nine-color-secondary-blue)}._background-secondary-green_ak32f_42{--backgroundColor: var(--nine-color-secondary-green)}._background-secondary-orange_ak32f_45{--backgroundColor: var(--nine-color-secondary-orange)}._background-secondary-pink_ak32f_48{--backgroundColor: var(--nine-color-secondary-pink)}._background-secondary-teal_ak32f_51{--backgroundColor: var(--nine-color-secondary-teal)}._background-secondary-violet_ak32f_54{--backgroundColor: var(--nine-color-secondary-violet)}}
package/dist/Avatar.js CHANGED
@@ -1,51 +1,51 @@
1
1
  "use client";
2
- import { jsx as n } from "react/jsx-runtime";
2
+ import { jsx as a } from "react/jsx-runtime";
3
3
  import { forwardRef as i } from "react";
4
4
  import { c as _ } from "./index-PAaZGbyz.js";
5
- const l = "_root_zm5un_2", u = {
5
+ const l = "_root_ak32f_2", g = {
6
6
  root: l,
7
- "size-sm": "_size-sm_zm5un_24",
8
- "size-md": "_size-md_zm5un_27",
9
- "size-lg": "_size-lg_zm5un_30",
10
- "size-xl": "_size-xl_zm5un_33",
11
- "size-xxl": "_size-xxl_zm5un_36",
12
- "background-secondary-blue": "_background-secondary-blue_zm5un_39",
13
- "background-secondary-green": "_background-secondary-green_zm5un_42",
14
- "background-secondary-orange": "_background-secondary-orange_zm5un_45",
15
- "background-secondary-pink": "_background-secondary-pink_zm5un_48",
16
- "background-secondary-teal": "_background-secondary-teal_zm5un_51",
17
- "background-secondary-violet": "_background-secondary-violet_zm5un_54"
7
+ "size-sm": "_size-sm_ak32f_24",
8
+ "size-md": "_size-md_ak32f_27",
9
+ "size-lg": "_size-lg_ak32f_30",
10
+ "size-xl": "_size-xl_ak32f_33",
11
+ "size-xxl": "_size-xxl_ak32f_36",
12
+ "background-secondary-blue": "_background-secondary-blue_ak32f_39",
13
+ "background-secondary-green": "_background-secondary-green_ak32f_42",
14
+ "background-secondary-orange": "_background-secondary-orange_ak32f_45",
15
+ "background-secondary-pink": "_background-secondary-pink_ak32f_48",
16
+ "background-secondary-teal": "_background-secondary-teal_ak32f_51",
17
+ "background-secondary-violet": "_background-secondary-violet_ak32f_54"
18
18
  };
19
- function g(e = "") {
19
+ function k(e = "") {
20
20
  const [o, r] = e.split(" ");
21
21
  return o && r ? `${o.charAt(0).toUpperCase()}${r.charAt(0).toUpperCase()}` : o.substring(0, 2).toUpperCase();
22
22
  }
23
- const m = (e = "") => {
23
+ const u = (e = "") => {
24
24
  const o = e.length % t.length;
25
25
  return t[o];
26
- }, z = _(u), t = [
26
+ }, f = _(g), t = [
27
27
  "secondary-blue",
28
28
  "secondary-green",
29
29
  "secondary-orange",
30
30
  "secondary-pink",
31
31
  "secondary-teal",
32
32
  "secondary-violet"
33
- ], p = i(
34
- ({ className: e, getInitials: o = g, name: r, size: s = "md", src: a }, d) => {
35
- const c = m(r);
36
- return /* @__PURE__ */ n(
33
+ ], m = i(
34
+ ({ className: e, getInitials: o = k, name: r, size: n = "md", src: s }, d) => {
35
+ const c = u(r);
36
+ return /* @__PURE__ */ a(
37
37
  "div",
38
38
  {
39
39
  "aria-label": r,
40
- className: z("root", s && `size-${s}`, c && `background-${c}`, e),
40
+ className: f("root", n && `size-${n}`, c && `background-${c}`, e),
41
41
  ref: d,
42
42
  role: "img",
43
- children: a ? /* @__PURE__ */ n("img", { alt: r, src: a }) : /* @__PURE__ */ n("p", { children: o(r) })
43
+ children: s ? /* @__PURE__ */ a("img", { alt: r, src: s }) : /* @__PURE__ */ a("p", { children: o(r) })
44
44
  }
45
45
  );
46
46
  }
47
47
  );
48
48
  export {
49
- p as Avatar,
49
+ m as Avatar,
50
50
  t as colors
51
51
  };
package/dist/Badge.css CHANGED
@@ -1 +1 @@
1
- @layer components{._root_nle8k_2{align-items:center;border-radius:var(--radius-xl);display:inline-flex;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);justify-content:center;line-height:var(--line-height-xs);background-color:var(--backgroundColor);color:var(--color);height:var(--height);padding:var(--padding);width:var(--width)}._disabled-default_nle8k_18{--backgroundColor: var(--color-beige-20);--color: var(--color-beige-40)}._disabled-primary_nle8k_22{--backgroundColor: var(--color-brand-50);--color: var(--color-brand-80)}._rounded-md_nle8k_26{--width: var(--height-20)}._rounded-sm_nle8k_29{--width: var(--height-16)}._size-md_nle8k_32{--height: var(--height-20);--padding: var(--spacing-xs)}._size-sm_nle8k_36{--height: var(--height-16);--padding: var(--spacing-xxs)}._variant-default_nle8k_40{--backgroundColor: var(--color-beige-30);--color: var(--color-beige-70)}._variant-primary_nle8k_44{--backgroundColor: var(--color-brand-40);--color: var(--color-neutral-90)}}
1
+ @layer components{._root_umuwb_2{align-items:center;border-radius:var(--nine-radius-xl);display:inline-flex;font-size:var(--nine-font-size-xs);font-weight:var(--nine-font-weight-medium);justify-content:center;line-height:var(--nine-line-height-xs);background-color:var(--backgroundColor);color:var(--color);height:var(--height);padding:var(--padding);width:var(--width)}._disabled-default_umuwb_18{--backgroundColor: var(--nine-color-beige-20);--color: var(--nine-color-beige-40)}._disabled-primary_umuwb_22{--backgroundColor: var(--nine-color-brand-50);--color: var(--nine-color-brand-80)}._rounded-md_umuwb_26{--width: var(--nine-height-20)}._rounded-sm_umuwb_29{--width: var(--nine-height-16)}._size-md_umuwb_32{--height: var(--nine-height-20);--padding: var(--nine-spacing-xs)}._size-sm_umuwb_36{--height: var(--nine-height-16);--padding: var(--nine-spacing-xxs)}._variant-default_umuwb_40{--backgroundColor: var(--nine-color-beige-30);--color: var(--nine-color-beige-70)}._variant-primary_umuwb_44{--backgroundColor: var(--nine-color-brand-40);--color: var(--nine-color-neutral-90)}}
package/dist/Badge.js CHANGED
@@ -1,18 +1,18 @@
1
1
  "use client";
2
- import { jsx as m } from "react/jsx-runtime";
3
- import { forwardRef as u } from "react";
4
- import { c } from "./index-PAaZGbyz.js";
5
- const b = "_root_nle8k_2", f = {
6
- root: b,
7
- "disabled-default": "_disabled-default_nle8k_18",
8
- "disabled-primary": "_disabled-primary_nle8k_22",
9
- "rounded-md": "_rounded-md_nle8k_26",
10
- "rounded-sm": "_rounded-sm_nle8k_29",
11
- "size-md": "_size-md_nle8k_32",
12
- "size-sm": "_size-sm_nle8k_36",
13
- "variant-default": "_variant-default_nle8k_40",
14
- "variant-primary": "_variant-primary_nle8k_44"
15
- }, g = c(f), k = u(
2
+ import { jsx as n } from "react/jsx-runtime";
3
+ import { forwardRef as b } from "react";
4
+ import { c as l } from "./index-PAaZGbyz.js";
5
+ const c = "_root_umuwb_2", f = {
6
+ root: c,
7
+ "disabled-default": "_disabled-default_umuwb_18",
8
+ "disabled-primary": "_disabled-primary_umuwb_22",
9
+ "rounded-md": "_rounded-md_umuwb_26",
10
+ "rounded-sm": "_rounded-sm_umuwb_29",
11
+ "size-md": "_size-md_umuwb_32",
12
+ "size-sm": "_size-sm_umuwb_36",
13
+ "variant-default": "_variant-default_umuwb_40",
14
+ "variant-primary": "_variant-primary_umuwb_44"
15
+ }, w = l(f), g = b(
16
16
  ({
17
17
  children: e,
18
18
  className: a,
@@ -20,27 +20,27 @@ const b = "_root_nle8k_2", f = {
20
20
  size: t = "md",
21
21
  variant: s = "default",
22
22
  withNumberAbbreviation: d,
23
- ...n
24
- }, o) => {
25
- const i = Number.isInteger(e), _ = e.toString().length === 1, l = i && d && e > 99 ? "99+" : e;
26
- return /* @__PURE__ */ m(
23
+ ...o
24
+ }, u) => {
25
+ const m = Number.isInteger(e), i = e.toString().length === 1, _ = m && d && e > 99 ? "99+" : e;
26
+ return /* @__PURE__ */ n(
27
27
  "div",
28
28
  {
29
- ...n,
30
- className: g(
29
+ ...o,
30
+ className: w(
31
31
  "root",
32
32
  r ? `disabled-${s}` : `variant-${s}`,
33
33
  `size-${t}`,
34
- _ && `rounded-${t}`,
34
+ i && `rounded-${t}`,
35
35
  a
36
36
  ),
37
- ref: o,
38
- children: l
37
+ ref: u,
38
+ children: _
39
39
  }
40
40
  );
41
41
  }
42
42
  );
43
- k.displayName = "Badge";
43
+ g.displayName = "Badge";
44
44
  export {
45
- k as Badge
45
+ g as Badge
46
46
  };
@@ -1 +1 @@
1
- @layer components{._root_ce14e_2{height:100%;position:relative;overflow-x:hidden;padding:var(--spacing-sm) 0;font-size:var(--font-size-subtitle-sm);font-weight:var(--font-weight-medium);letter-spacing:var(--letter-spacing-subtitle-sm);line-height:var(--line-height-subtitle-sm);text-transform:uppercase;font-family:var(--font-family-headings)}._list_ce14e_14{display:inline-flex;align-items:center;max-width:100%;overflow-x:auto;margin:0;padding:0;list-style:none;white-space:nowrap}._start-gradient_ce14e_24{left:0;transform-origin:left}._end-gradient_ce14e_28{right:0;transform-origin:right}._start-gradient_ce14e_24,._end-gradient_ce14e_28{position:absolute;bottom:0;top:0;width:var(--spacing-xxl)}._item-wrapper_ce14e_39{display:inline-flex;flex:0 0 auto;line-height:normal}._item-content_ce14e_44{color:var(--breadcrumbItemColor, var(--color-neutral-50));text-decoration:none;align-items:center;transition:var(--duration-medium);direction:initial}._item-content_ce14e_44:hover,._item-content_ce14e_44[aria-current=page]{--breadcrumbItemColor: var(--color-neutral-70)}._item-content_ce14e_44[aria-disabled=true]{pointer-events:none;cursor:default}._item-separator_ce14e_58{color:var(--color-neutral-50);padding:0 var(--spacing-xs);display:flex;align-items:center}}
1
+ @layer components{._root_g4mk8_2{height:100%;position:relative;overflow-x:hidden;padding:var(--nine-spacing-sm) 0;font-size:var(--nine-font-size-subtitle-sm);font-weight:var(--nine-font-weight-medium);letter-spacing:var(--nine-letter-spacing-subtitle-sm);line-height:var(--nine-line-height-subtitle-sm);text-transform:uppercase;font-family:var(--nine-font-family-headings)}._list_g4mk8_14{display:inline-flex;align-items:center;max-width:100%;overflow-x:auto;margin:0;padding:0;list-style:none;white-space:nowrap}._start-gradient_g4mk8_24{left:0;transform-origin:left}._end-gradient_g4mk8_28{right:0;transform-origin:right}._start-gradient_g4mk8_24,._end-gradient_g4mk8_28{position:absolute;bottom:0;top:0;width:var(--nine-spacing-xxl)}._item-wrapper_g4mk8_39{display:inline-flex;flex:0 0 auto;line-height:normal}._item-content_g4mk8_44{color:var(--breadcrumbItemColor, var(--nine-color-neutral-50));text-decoration:none;align-items:center;transition:var(--nine-duration-medium);direction:initial}._item-content_g4mk8_44:hover,._item-content_g4mk8_44[aria-current=page]{--breadcrumbItemColor: var(--nine-color-neutral-70)}._item-content_g4mk8_44[aria-disabled=true]{pointer-events:none;cursor:default}._item-separator_g4mk8_58{color:var(--nine-color-neutral-50);padding:0 var(--nine-spacing-xs);display:flex;align-items:center}}
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  import { jsxs as te, jsx as R } from "react/jsx-runtime";
3
3
  import { forwardRef as he, Children as pe, cloneElement as be, useRef as A, useState as V, useCallback as X, useMemo as ge, useEffect as q } from "react";
4
- import "./Icon-BisRi8B3.js";
5
- import { R as me } from "./index-Dcq5gh3E.js";
4
+ import "./Icon-6NFFlbYr.js";
5
+ import { R as me } from "./index-BVLUYl2k.js";
6
6
  import { c as re } from "./index-PAaZGbyz.js";
7
7
  import { t as xe } from "./throttle-BDBzFeFj.js";
8
8
  import { f as ze } from "./forwardRefWithAs-8eP3ZN15.js";
@@ -142,26 +142,26 @@ var g = function(e) {
142
142
  for (j(e); Re(); )
143
143
  e = _e(), j(e);
144
144
  return we() && Oe(), e > 0;
145
- }, M, ce = [], Ne = function() {
145
+ }, M, ce = [], ke = function() {
146
146
  return ce.splice(0).forEach(function(e) {
147
147
  return e();
148
148
  });
149
- }, ke = function(e) {
149
+ }, Ne = function(e) {
150
150
  if (!M) {
151
151
  var t = 0, r = document.createTextNode(""), n = { characterData: !0 };
152
152
  new MutationObserver(function() {
153
- return Ne();
153
+ return ke();
154
154
  }).observe(r, n), M = function() {
155
155
  r.textContent = "".concat(t ? t-- : t++);
156
156
  };
157
157
  }
158
158
  ce.push(e), M();
159
159
  }, De = function(e) {
160
- ke(function() {
160
+ Ne(function() {
161
161
  requestAnimationFrame(e);
162
162
  });
163
- }, N = 0, Ae = function() {
164
- return !!N;
163
+ }, k = 0, Ae = function() {
164
+ return !!k;
165
165
  }, Me = 250, Ie = { attributes: !0, characterData: !0, childList: !0, subtree: !0 }, K = [
166
166
  "resize",
167
167
  "load",
@@ -221,7 +221,7 @@ var g = function(e) {
221
221
  }), this.stopped = !0);
222
222
  }, e;
223
223
  }(), W = new Le(), Z = function(e) {
224
- !N && e > 0 && W.start(), N += e, !N && W.stop();
224
+ !k && e > 0 && W.start(), k += e, !k && W.stop();
225
225
  }, We = function(e) {
226
226
  return !P(e) && !ye(e) && getComputedStyle(e).display === "inline";
227
227
  }, Pe = function() {
@@ -289,14 +289,14 @@ var g = function(e) {
289
289
  return "function ResizeObserver () { [polyfill code] }";
290
290
  }, e;
291
291
  }();
292
- const He = (e, t, r) => Math.min(Math.max(e, t), r), Ve = "_root_ce14e_2", Xe = "_list_ce14e_14", ve = {
292
+ const He = (e, t, r) => Math.min(Math.max(e, t), r), Ve = "_root_g4mk8_2", Xe = "_list_g4mk8_14", ve = {
293
293
  root: Ve,
294
294
  list: Xe,
295
- "start-gradient": "_start-gradient_ce14e_24",
296
- "end-gradient": "_end-gradient_ce14e_28",
297
- "item-wrapper": "_item-wrapper_ce14e_39",
298
- "item-content": "_item-content_ce14e_44",
299
- "item-separator": "_item-separator_ce14e_58"
295
+ "start-gradient": "_start-gradient_g4mk8_24",
296
+ "end-gradient": "_end-gradient_g4mk8_28",
297
+ "item-wrapper": "_item-wrapper_g4mk8_39",
298
+ "item-content": "_item-content_g4mk8_44",
299
+ "item-separator": "_item-separator_g4mk8_58"
300
300
  }, L = re(ve), qe = ze(
301
301
  ({ as: e = "a", children: t, "data-testid": r, isActive: n, separator: i, ...o }, s) => {
302
302
  const c = o.href || o.to;
@@ -315,7 +315,7 @@ const He = (e, t, r) => Math.min(Math.max(e, t), r), Ve = "_root_ce14e_2", Xe =
315
315
  )
316
316
  ] });
317
317
  }
318
- ), k = re(ve), $e = he(
318
+ ), N = re(ve), $e = he(
319
319
  ({ children: e, lastChildNotClickable: t = !0, separator: r = /* @__PURE__ */ R(me, { size: "xs" }), ...n }, i) => {
320
320
  const o = pe.toArray(e).filter(Boolean), s = o.length, c = o.map((w, a) => {
321
321
  const l = s === 1 || s === a + 1;
@@ -326,9 +326,9 @@ const He = (e, t, r) => Math.min(Math.max(e, t), r), Ve = "_root_ce14e_2", Xe =
326
326
  ...w.props
327
327
  });
328
328
  }), { endGradient: v, listRef: u, onListScroll: h, startGradient: f } = Je();
329
- return /* @__PURE__ */ te("nav", { ref: i, ...n, className: k("root", n.className), children: [
329
+ return /* @__PURE__ */ te("nav", { ref: i, ...n, className: N("root", n.className), children: [
330
330
  f,
331
- /* @__PURE__ */ R("ol", { className: k("list"), dir: "rtl", onScroll: h, ref: u, children: c.reverse() }),
331
+ /* @__PURE__ */ R("ol", { className: N("list"), dir: "rtl", onScroll: h, ref: u, children: c.reverse() }),
332
332
  v
333
333
  ] });
334
334
  }
@@ -372,14 +372,14 @@ const He = (e, t, r) => Math.min(Math.max(e, t), r), Ve = "_root_ce14e_2", Xe =
372
372
  const f = n ? /* @__PURE__ */ R(
373
373
  "span",
374
374
  {
375
- className: k("start-gradient", "bg-linear-to-r from-neutral-10 to-transparent"),
375
+ className: N("start-gradient", "bg-linear-to-r nine:from-neutral-10 nine:to-transparent"),
376
376
  ref: t
377
377
  }
378
378
  ) : null;
379
379
  return { endGradient: n ? /* @__PURE__ */ R(
380
380
  "span",
381
381
  {
382
- className: k("end-gradient", "bg-linear-to-l from-neutral-10 to-transparent"),
382
+ className: N("end-gradient", "bg-linear-to-l nine:from-neutral-10 nine:to-transparent"),
383
383
  ref: r
384
384
  }
385
385
  ) : null, listRef: e, onListScroll: u, startGradient: f };
package/dist/Button.css CHANGED
@@ -1 +1 @@
1
- @layer components{._root_1q8jk_2{position:relative;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border-style:solid;border-width:var(--border-width-sm);transition-property:all;transition-duration:var(--duration-medium);outline:transparent solid var(--border-width-md);font-weight:var(--font-weight-bold);aspect-ratio:var(--aspectRatio, auto);height:var(--height);padding-inline:var(--paddingInline);border-radius:var(--borderRadius);font-size:var(--fontSize);color:var(--color, var(--color-neutral-90));background-color:var(--backgroundColor);border-color:var(--borderColor);line-height:var(--lineHeight)}._root_1q8jk_2[data-focus-visible],._root_1q8jk_2:focus-visible{outline-color:var(--outlineColorFocus)}@media (hover: hover) and (pointer: fine){._root_1q8jk_2:hover{background-color:var(--backgroundColorHover);border-color:var(--borderColorHover)}}._root_1q8jk_2:active{background-color:var(--backgroundColorActive);border-color:var(--borderColorActive)}._root_1q8jk_2:disabled,._root_1q8jk_2[aria-disabled]{background-color:var(--backgroundColorDisabled);border-color:var(--borderColorDisabled);color:var(--colorDisabled);cursor:var(--cursorDisabled)}._root_1q8jk_2:has(i.wui-icon-font),._root_1q8jk_2:has(svg){padding-inline:var(--paddingInlineHasIcon)}._root_1q8jk_2 i.wui-icon-font,._root_1q8jk_2 svg{font-weight:initial}._root_1q8jk_2 i.wui-icon-font:only-child,._root_1q8jk_2 svg:only-child{width:var(--iconOnlySize);height:var(--iconOnlySize);font-size:var(--iconOnlySize)}._root_1q8jk_2 i.wui-icon-font:not(:only-child),._root_1q8jk_2 svg:not(:only-child){width:var(--iconDefaultSize);height:var(--iconDefaultSize);font-size:var(--iconDefaultSize)}._root_1q8jk_2 i.wui-icon-font:first-child:not(:only-child),._root_1q8jk_2 svg:first-child:not(:only-child){margin-inline-end:var(--spacing-xs)}._root_1q8jk_2 i.wui-icon-font:last-child:not(:only-child),._root_1q8jk_2 svg:last-child:not(:only-child){margin-inline-start:var(--spacing-xs)}._shape-default_1q8jk_77{--borderRadius: var(--radius-md)}._shape-circle_1q8jk_80{--borderRadius: var(--radius-circle)}._shape-square_1q8jk_84{--borderRadius: var(--radius-md)}._shape-circle_1q8jk_80._size-lg_1q8jk_87,._shape-circle_1q8jk_80._size-md_1q8jk_87,._shape-circle_1q8jk_80._size-sm_1q8jk_87,._shape-circle_1q8jk_80._size-xs_1q8jk_87,._shape-square_1q8jk_84._size-lg_1q8jk_87,._shape-square_1q8jk_84._size-md_1q8jk_87,._shape-square_1q8jk_84._size-sm_1q8jk_87,._shape-square_1q8jk_84._size-xs_1q8jk_87{--aspectRatio: 1;--paddingInline: 0;--paddingInlineHasIcon: 0}._shape-circle_1q8jk_80._size-lg_1q8jk_87,._shape-square_1q8jk_84._size-lg_1q8jk_87{--fontSize: var(--font-size-xl)}._shape-circle_1q8jk_80._size-md_1q8jk_87,._shape-square_1q8jk_84._size-md_1q8jk_87,._shape-circle_1q8jk_80._size-sm_1q8jk_87,._shape-square_1q8jk_84._size-sm_1q8jk_87,._shape-circle_1q8jk_80._size-xs_1q8jk_87,._shape-square_1q8jk_84._size-xs_1q8jk_87{--fontSize: var(--font-size-md)}._size-xs_1q8jk_87{--fontSize: var(--font-size-xs);--height: var(--height-elements-sm);--paddingInline: var(--spacing-sm);--paddingInlineHasIcon: var(--spacing-sm);--iconDefaultSize: .75rem;--iconOnlySize: 1rem;--lineHeight: var(--line-height-xs)}._size-sm_1q8jk_87{--fontSize: var(--font-size-xs);--height: var(--height-elements-md);--paddingInline: var(--spacing-sm);--paddingInlineHasIcon: var(--spacing-md);--iconDefaultSize: 1rem;--iconOnlySize: 1rem;--lineHeight: var(--line-height-xs)}._size-md_1q8jk_87{--fontSize: var(--font-size-sm);--height: var(--height-elements-lg);--paddingInline: var(--spacing-xl);--paddingInlineHasIcon: var(--spacing-md);--iconDefaultSize: 1rem;--iconOnlySize: 1rem;--lineHeight: var(--line-height-sm)}._size-lg_1q8jk_87{--fontSize: var(--font-size-sm);--height: var(--height-elements-xl);--paddingInline: var(--spacing-xl);--paddingInlineHasIcon: var(--spacing-lg);--iconDefaultSize: 1rem;--iconOnlySize: 1.5rem;--lineHeight: var(--line-height-sm)}._variant-disabled_1q8jk_140{--backgroundColorDisabled: var(--color-beige-40);--borderColorDisabled: var(--color-beige-40);--colorDisabled: var(--color-beige-70);--cursorDisabled: not-allowed;--outlineColorFocus: var(--color-beige-10)}._variant-ghost_1q8jk_147{--backgroundColorActive: color-mix(in oklab, var(--color-neutral-90) 40%, transparent);--backgroundColorHover: color-mix(in oklab, var(--color-neutral-90) 10%, transparent);--borderColor: transparent;--borderColorActive: transparent;--borderColorHover: transparent;--outlineColorFocus: color-mix(in oklab, var(--color-neutral-90) 10%, transparent)}._variant-ghost-ai_1q8jk_155{--backgroundColorActive: var(--color-violet-30);--backgroundColorHover: var(--color-violet-10);--borderColor: transparent;--borderColorActive: var(--color-violet-30);--borderColorHover: var(--color-violet-10);--color: var(--color-violet-70);--outlineColorFocus: var(--color-violet-50)}._variant-ghost-danger_1q8jk_164{--backgroundColorActive: var(--color-red-20);--backgroundColorHover: var(--color-red-10);--borderColor: transparent;--borderColorActive: var(--color-red-20);--borderColorHover: var(--color-red-10);--color: var(--color-red-80);--outlineColorFocus: var(--color-red-40)}._variant-primary_1q8jk_173{--backgroundColor: var(--color-brand-40);--backgroundColorActive: var(--color-brand-10);--backgroundColorHover: var(--color-brand-30);--borderColor: var(--color-brand-40);--borderColorActive: var(--color-brand-10);--borderColorHover: var(--color-brand-30);--outlineColorFocus: var(--color-brand-20)}._variant-primary-ai_1q8jk_182{--backgroundColor: var(--color-violet-70);--backgroundColorActive: var(--color-violet-40);--backgroundColorHover: var(--color-violet-60);--borderColor: var(--color-violet-70);--borderColorActive: var(--color-violet-40);--borderColorHover: var(--color-violet-60);--color: var(--color-neutral-10);--outlineColorFocus: var(--color-violet-50)}._variant-primary-danger_1q8jk_192{--backgroundColor: var(--color-red-70);--backgroundColorActive: var(--color-red-50);--backgroundColorHover: var(--color-red-60);--borderColor: var(--color-red-70);--borderColorActive: var(--color-red-50);--borderColorHover: var(--color-red-60);--color: var(--color-neutral-10);--outlineColorFocus: var(--color-red-40)}._variant-secondary_1q8jk_202{--backgroundColor: var(--color-neutral-90);--backgroundColorActive: var(--color-neutral-50);--backgroundColorHover: var(--color-neutral-70);--borderColor: var(--color-neutral-90);--borderColorActive: var(--color-neutral-50);--borderColorHover: var(--color-neutral-70);--color: var(--color-neutral-10);--outlineColorFocus: var(--color-neutral-40)}._variant-tertiary_1q8jk_212{--backgroundColor: var(--color-neutral-10);--backgroundColorActive: color-mix(in oklab, var(--color-neutral-90) 40%, transparent);--backgroundColorHover: color-mix(in oklab, var(--color-neutral-90) 10%, transparent);--borderColor: var(--color-neutral-90);--outlineColorFocus: var(--color-neutral-40)}._variant-tertiary-ai_1q8jk_219{--backgroundColor: var(--color-neutral-10);--backgroundColorActive: var(--color-violet-30);--backgroundColorHover: var(--color-violet-10);--borderColor: var(--color-violet-70);--color: var(--color-violet-70);--outlineColorFocus: var(--color-violet-50)}._variant-tertiary-danger_1q8jk_227{--backgroundColor: var(--color-neutral-10);--backgroundColorActive: var(--color-red-20);--backgroundColorHover: var(--color-red-10);--borderColor: var(--color-red-80);--color: var(--color-red-80);--outlineColorFocus: var(--color-red-40)}._loader_1q8jk_235{display:flex;align-items:center;justify-content:center;position:absolute;bottom:0;left:0;right:0;top:0}._loader-children_1q8jk_245{opacity:0}}
1
+ @layer components{._root_1yqp8_2{position:relative;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border-style:solid;border-width:var(--nine-border-width-sm);transition-property:all;transition-duration:var(--nine-duration-medium);outline:transparent solid var(--nine-border-width-md);font-weight:var(--nine-font-weight-bold);aspect-ratio:var(--aspectRatio, auto);height:var(--height);padding-inline:var(--paddingInline);border-radius:var(--borderRadius);font-size:var(--fontSize);color:var(--color, var(--nine-color-neutral-90));background-color:var(--backgroundColor);border-color:var(--borderColor);line-height:var(--lineHeight)}._root_1yqp8_2[data-focus-visible],._root_1yqp8_2:focus-visible{outline-color:var(--outlineColorFocus)}@media (hover: hover) and (pointer: fine){._root_1yqp8_2:hover{background-color:var(--backgroundColorHover);border-color:var(--borderColorHover)}}._root_1yqp8_2:active{background-color:var(--backgroundColorActive);border-color:var(--borderColorActive)}._root_1yqp8_2:disabled,._root_1yqp8_2[aria-disabled]{background-color:var(--backgroundColorDisabled);border-color:var(--borderColorDisabled);color:var(--colorDisabled);cursor:var(--cursorDisabled)}._root_1yqp8_2:has(i.wui-icon-font),._root_1yqp8_2:has(svg){padding-inline:var(--paddingInlineHasIcon)}._root_1yqp8_2 i.wui-icon-font,._root_1yqp8_2 svg{font-weight:initial}._root_1yqp8_2 i.wui-icon-font:only-child,._root_1yqp8_2 svg:only-child{width:var(--iconOnlySize);height:var(--iconOnlySize);font-size:var(--iconOnlySize)}._root_1yqp8_2 i.wui-icon-font:not(:only-child),._root_1yqp8_2 svg:not(:only-child){width:var(--iconDefaultSize);height:var(--iconDefaultSize);font-size:var(--iconDefaultSize)}._root_1yqp8_2 i.wui-icon-font:first-child:not(:only-child),._root_1yqp8_2 svg:first-child:not(:only-child){margin-inline-end:var(--nine-spacing-xs)}._root_1yqp8_2 i.wui-icon-font:last-child:not(:only-child),._root_1yqp8_2 svg:last-child:not(:only-child){margin-inline-start:var(--nine-spacing-xs)}._shape-default_1yqp8_77{--borderRadius: var(--nine-radius-md)}._shape-circle_1yqp8_80{--borderRadius: var(--nine-radius-circle)}._shape-square_1yqp8_84{--borderRadius: var(--nine-radius-md)}._shape-circle_1yqp8_80._size-lg_1yqp8_87,._shape-circle_1yqp8_80._size-md_1yqp8_87,._shape-circle_1yqp8_80._size-sm_1yqp8_87,._shape-circle_1yqp8_80._size-xs_1yqp8_87,._shape-square_1yqp8_84._size-lg_1yqp8_87,._shape-square_1yqp8_84._size-md_1yqp8_87,._shape-square_1yqp8_84._size-sm_1yqp8_87,._shape-square_1yqp8_84._size-xs_1yqp8_87{--aspectRatio: 1;--paddingInline: 0;--paddingInlineHasIcon: 0}._shape-circle_1yqp8_80._size-lg_1yqp8_87,._shape-square_1yqp8_84._size-lg_1yqp8_87{--fontSize: var(--nine-font-size-xl)}._shape-circle_1yqp8_80._size-md_1yqp8_87,._shape-square_1yqp8_84._size-md_1yqp8_87,._shape-circle_1yqp8_80._size-sm_1yqp8_87,._shape-square_1yqp8_84._size-sm_1yqp8_87,._shape-circle_1yqp8_80._size-xs_1yqp8_87,._shape-square_1yqp8_84._size-xs_1yqp8_87{--fontSize: var(--nine-font-size-md)}._size-xs_1yqp8_87{--fontSize: var(--nine-font-size-xs);--height: var(--nine-height-elements-sm);--paddingInline: var(--nine-spacing-sm);--paddingInlineHasIcon: var(--nine-spacing-sm);--iconDefaultSize: .75rem;--iconOnlySize: 1rem;--lineHeight: var(--nine-line-height-xs)}._size-sm_1yqp8_87{--fontSize: var(--nine-font-size-xs);--height: var(--nine-height-elements-md);--paddingInline: var(--nine-spacing-sm);--paddingInlineHasIcon: var(--nine-spacing-md);--iconDefaultSize: 1rem;--iconOnlySize: 1rem;--lineHeight: var(--nine-line-height-xs)}._size-md_1yqp8_87{--fontSize: var(--nine-font-size-sm);--height: var(--nine-height-elements-lg);--paddingInline: var(--nine-spacing-xl);--paddingInlineHasIcon: var(--nine-spacing-md);--iconDefaultSize: 1rem;--iconOnlySize: 1rem;--lineHeight: var(--nine-line-height-sm)}._size-lg_1yqp8_87{--fontSize: var(--nine-font-size-sm);--height: var(--nine-height-elements-xl);--paddingInline: var(--nine-spacing-xl);--paddingInlineHasIcon: var(--nine-spacing-lg);--iconDefaultSize: 1rem;--iconOnlySize: 1.5rem;--lineHeight: var(--nine-line-height-sm)}._variant-disabled_1yqp8_140{--backgroundColorDisabled: var(--nine-color-beige-40);--borderColorDisabled: var(--nine-color-beige-40);--colorDisabled: var(--nine-color-beige-70);--cursorDisabled: not-allowed;--outlineColorFocus: var(--nine-color-beige-10)}._variant-ghost_1yqp8_147{--backgroundColorActive: color-mix(in oklab, var(--nine-color-neutral-90) 40%, transparent);--backgroundColorHover: color-mix(in oklab, var(--nine-color-neutral-90) 10%, transparent);--borderColor: transparent;--borderColorActive: transparent;--borderColorHover: transparent;--outlineColorFocus: color-mix(in oklab, var(--nine-color-neutral-90) 10%, transparent)}._variant-ghost-ai_1yqp8_155{--backgroundColorActive: var(--nine-color-violet-30);--backgroundColorHover: var(--nine-color-violet-10);--borderColor: transparent;--borderColorActive: var(--nine-color-violet-30);--borderColorHover: var(--nine-color-violet-10);--color: var(--nine-color-violet-70);--outlineColorFocus: var(--nine-color-violet-50)}._variant-ghost-danger_1yqp8_164{--backgroundColorActive: var(--nine-color-red-20);--backgroundColorHover: var(--nine-color-red-10);--borderColor: transparent;--borderColorActive: var(--nine-color-red-20);--borderColorHover: var(--nine-color-red-10);--color: var(--nine-color-red-80);--outlineColorFocus: var(--nine-color-red-40)}._variant-primary_1yqp8_173{--backgroundColor: var(--nine-color-brand-40);--backgroundColorActive: var(--nine-color-brand-10);--backgroundColorHover: var(--nine-color-brand-30);--borderColor: var(--nine-color-brand-40);--borderColorActive: var(--nine-color-brand-10);--borderColorHover: var(--nine-color-brand-30);--outlineColorFocus: var(--nine-color-brand-20)}._variant-primary-ai_1yqp8_182{--backgroundColor: var(--nine-color-violet-70);--backgroundColorActive: var(--nine-color-violet-40);--backgroundColorHover: var(--nine-color-violet-60);--borderColor: var(--nine-color-violet-70);--borderColorActive: var(--nine-color-violet-40);--borderColorHover: var(--nine-color-violet-60);--color: var(--nine-color-neutral-10);--outlineColorFocus: var(--nine-color-violet-50)}._variant-primary-danger_1yqp8_192{--backgroundColor: var(--nine-color-red-70);--backgroundColorActive: var(--nine-color-red-50);--backgroundColorHover: var(--nine-color-red-60);--borderColor: var(--nine-color-red-70);--borderColorActive: var(--nine-color-red-50);--borderColorHover: var(--nine-color-red-60);--color: var(--nine-color-neutral-10);--outlineColorFocus: var(--nine-color-red-40)}._variant-secondary_1yqp8_202{--backgroundColor: var(--nine-color-neutral-90);--backgroundColorActive: var(--nine-color-neutral-50);--backgroundColorHover: var(--nine-color-neutral-70);--borderColor: var(--nine-color-neutral-90);--borderColorActive: var(--nine-color-neutral-50);--borderColorHover: var(--nine-color-neutral-70);--color: var(--nine-color-neutral-10);--outlineColorFocus: var(--nine-color-neutral-40)}._variant-tertiary_1yqp8_212{--backgroundColor: var(--nine-color-neutral-10);--backgroundColorActive: color-mix(in oklab, var(--nine-color-neutral-90) 40%, transparent);--backgroundColorHover: color-mix(in oklab, var(--nine-color-neutral-90) 10%, transparent);--borderColor: var(--nine-color-neutral-90);--outlineColorFocus: var(--nine-color-neutral-40)}._variant-tertiary-ai_1yqp8_219{--backgroundColor: var(--nine-color-neutral-10);--backgroundColorActive: var(--nine-color-violet-30);--backgroundColorHover: var(--nine-color-violet-10);--borderColor: var(--nine-color-violet-70);--color: var(--nine-color-violet-70);--outlineColorFocus: var(--nine-color-violet-50)}._variant-tertiary-danger_1yqp8_227{--backgroundColor: var(--nine-color-neutral-10);--backgroundColorActive: var(--nine-color-red-20);--backgroundColorHover: var(--nine-color-red-10);--borderColor: var(--nine-color-red-80);--color: var(--nine-color-red-80);--outlineColorFocus: var(--nine-color-red-40)}._loader_1yqp8_235{display:flex;align-items:center;justify-content:center;position:absolute;bottom:0;left:0;right:0;top:0}._loader-children_1yqp8_245{opacity:0}}