@simpli-route/apollo-ds 0.1.5 → 0.1.7

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 (126) hide show
  1. package/dist/components/Accordion/types.d.ts +1 -0
  2. package/dist/components/Chips/types.d.ts +1 -0
  3. package/dist/components/ProgressBar/ProgressBar.d.ts +12 -0
  4. package/dist/components/ProgressBar/ProgressBar.test.d.ts +1 -0
  5. package/dist/components/ProgressBar/index.d.ts +2 -0
  6. package/dist/components/ProgressBar/types.d.ts +59 -0
  7. package/dist/components/ProgressBar/variants.d.ts +6 -0
  8. package/dist/components/Tabs/types.d.ts +8 -2
  9. package/dist/components/Tooltip/types.d.ts +1 -0
  10. package/dist/components/Typography/types.d.ts +1 -0
  11. package/dist/components/index.d.ts +1 -0
  12. package/dist/index.cjs.js +1 -1
  13. package/dist/index.cjs10.js +1 -1
  14. package/dist/index.cjs11.js +1 -1
  15. package/dist/index.cjs12.js +1 -1
  16. package/dist/index.cjs13.js +1 -1
  17. package/dist/index.cjs14.js +1 -1
  18. package/dist/index.cjs15.js +1 -1
  19. package/dist/index.cjs16.js +1 -1
  20. package/dist/index.cjs17.js +1 -1
  21. package/dist/index.cjs18.js +1 -1
  22. package/dist/index.cjs19.js +1 -1
  23. package/dist/index.cjs2.js +1 -1
  24. package/dist/index.cjs20.js +1 -1
  25. package/dist/index.cjs21.js +1 -1
  26. package/dist/index.cjs22.js +1 -1
  27. package/dist/index.cjs23.js +1 -1
  28. package/dist/index.cjs24.js +1 -1
  29. package/dist/index.cjs25.js +1 -1
  30. package/dist/index.cjs26.js +1 -1
  31. package/dist/index.cjs27.js +1 -1
  32. package/dist/index.cjs28.js +1 -1
  33. package/dist/index.cjs29.js +1 -1
  34. package/dist/index.cjs3.js +1 -1
  35. package/dist/index.cjs30.js +1 -1
  36. package/dist/index.cjs31.js +1 -1
  37. package/dist/index.cjs32.js +1 -1
  38. package/dist/index.cjs33.js +1 -1
  39. package/dist/index.cjs34.js +1 -1
  40. package/dist/index.cjs35.js +1 -1
  41. package/dist/index.cjs36.js +1 -1
  42. package/dist/index.cjs37.js +1 -1
  43. package/dist/index.cjs38.js +1 -1
  44. package/dist/index.cjs39.js +1 -1
  45. package/dist/index.cjs4.js +1 -1
  46. package/dist/index.cjs40.js +1 -1
  47. package/dist/index.cjs41.js +1 -1
  48. package/dist/index.cjs42.js +1 -1
  49. package/dist/index.cjs43.js +1 -9
  50. package/dist/index.cjs44.js +1 -19
  51. package/dist/index.cjs45.js +9 -1
  52. package/dist/index.cjs46.js +19 -1
  53. package/dist/index.cjs47.js +1 -1
  54. package/dist/index.cjs48.js +1 -1
  55. package/dist/index.cjs49.js +1 -1
  56. package/dist/index.cjs5.js +1 -1
  57. package/dist/index.cjs50.js +1 -1
  58. package/dist/index.cjs51.js +1 -1
  59. package/dist/index.cjs52.js +1 -1
  60. package/dist/index.cjs53.js +1 -1
  61. package/dist/index.cjs54.js +1 -0
  62. package/dist/index.cjs55.js +1 -0
  63. package/dist/index.cjs6.js +1 -1
  64. package/dist/index.cjs7.js +1 -1
  65. package/dist/index.cjs8.js +1 -1
  66. package/dist/index.cjs9.js +1 -1
  67. package/dist/index.es.js +14 -12
  68. package/dist/index.es10.js +5 -5
  69. package/dist/index.es11.js +4 -4
  70. package/dist/index.es12.js +5 -5
  71. package/dist/index.es13.js +5 -5
  72. package/dist/index.es14.js +4 -4
  73. package/dist/index.es15.js +3 -3
  74. package/dist/index.es16.js +3 -3
  75. package/dist/index.es17.js +3 -3
  76. package/dist/index.es18.js +88 -6
  77. package/dist/index.es19.js +6 -6
  78. package/dist/index.es2.js +3 -3
  79. package/dist/index.es20.js +6 -22
  80. package/dist/index.es21.js +22 -173
  81. package/dist/index.es22.js +150 -20
  82. package/dist/index.es23.js +40 -31
  83. package/dist/index.es24.js +31 -56
  84. package/dist/index.es25.js +59 -3
  85. package/dist/index.es26.js +3 -92
  86. package/dist/index.es27.js +87 -17
  87. package/dist/index.es28.js +20 -28
  88. package/dist/index.es29.js +32 -161
  89. package/dist/index.es3.js +24 -22
  90. package/dist/index.es30.js +163 -11
  91. package/dist/index.es31.js +30 -10
  92. package/dist/index.es32.js +11 -10
  93. package/dist/index.es33.js +10 -12
  94. package/dist/index.es34.js +17 -94
  95. package/dist/index.es35.js +18 -11
  96. package/dist/index.es36.js +10 -19
  97. package/dist/index.es37.js +12 -20
  98. package/dist/index.es38.js +96 -10
  99. package/dist/index.es39.js +12 -9
  100. package/dist/index.es4.js +4 -4
  101. package/dist/index.es40.js +36 -22
  102. package/dist/index.es41.js +10 -45
  103. package/dist/index.es42.js +10 -2
  104. package/dist/index.es43.js +30 -29
  105. package/dist/index.es44.js +2 -599
  106. package/dist/index.es45.js +30 -19
  107. package/dist/index.es46.js +599 -19
  108. package/dist/index.es47.js +2 -21
  109. package/dist/index.es48.js +2 -21
  110. package/dist/index.es49.js +8 -8
  111. package/dist/index.es5.js +3 -3
  112. package/dist/index.es50.js +19 -30
  113. package/dist/index.es51.js +21 -56
  114. package/dist/index.es52.js +21 -2
  115. package/dist/index.es53.js +19 -2
  116. package/dist/index.es54.js +32 -0
  117. package/dist/index.es55.js +58 -0
  118. package/dist/index.es6.js +3 -3
  119. package/dist/index.es7.js +3 -3
  120. package/dist/index.es8.js +2 -2
  121. package/dist/index.es9.js +3 -3
  122. package/dist/stories/ProgressBar.stories.d.ts +30 -0
  123. package/dist/style.css +57 -0
  124. package/dist/testing/tests/itRendersChildren.d.ts +1 -0
  125. package/dist/testing/tests/itSupportsClassName.d.ts +1 -0
  126. package/package.json +3 -2
@@ -1,175 +1,24 @@
1
- import { cva as r } from "class-variance-authority";
2
- const t = r(
3
- "inline-flex select-none items-center justify-center text-center text-base font-semibold leading-6 transition duration-150 ease-in-out focus:outline-none",
4
- {
5
- variants: {
6
- intent: {
7
- primary: "bg-primary-500 text-primary-50",
8
- secondary: "border border-primary-500 bg-primary-50 text-primary-500",
9
- tertiary: "text-primary-500",
10
- outline: "border border-primary-500 text-primary-500",
11
- success: "border bg-success-500 text-success-50",
12
- error: "border bg-error-500 text-error-50",
13
- orangeWarning: "border bg-orange-warning-500 text-orange-warning-50",
14
- yellowWarning: "border bg-yellow-warning-500 text-[#6F5711]",
15
- //TODO: Este color yellow-warning-900 esta mal en @simpli-route/tailwind-preset, debe borrarse la 'h' al final del color
16
- info: "border bg-blue-500 text-blue-50"
17
- },
18
- size: {
19
- xs: "rounded px-3 py-1",
20
- sm: "rounded px-3 py-2",
21
- md: "rounded-lg px-4 py-3",
22
- lg: "rounded-lg px-6 py-4"
23
- },
24
- isDisabled: {
25
- true: "pointer-events-none cursor-not-allowed border-none bg-neutral-400 text-neutral-600"
26
- },
27
- isHovered: {
28
- true: ""
29
- },
30
- isActive: {
31
- true: ""
32
- },
33
- fullWidth: {
34
- true: "w-full",
35
- false: "w-fit"
36
- },
37
- isLoading: {
38
- true: "pointer-events-none cursor-not-allowed opacity-70"
39
- },
40
- isFocused: {
41
- true: "focus:outline-none focus:ring-2 focus:ring-sky-400 focus:ring-offset-[0.4px] border-none",
42
- false: ""
43
- }
44
- },
45
- defaultVariants: {
46
- intent: "primary",
47
- size: "md"
48
- },
49
- compoundVariants: [
50
- /* Hover State */
51
- {
52
- intent: "primary",
53
- isHovered: !0,
54
- class: "bg-primary-700"
55
- },
56
- {
57
- intent: "secondary",
58
- isHovered: !0,
59
- class: "bg-primary-200"
60
- },
61
- {
62
- intent: "tertiary",
63
- isHovered: !0,
64
- class: "bg-primary-300 text-primary-800"
65
- },
66
- {
67
- intent: "outline",
68
- isHovered: !0,
69
- class: "bg-primary-500 text-primary-50"
70
- },
71
- {
72
- intent: "success",
73
- isHovered: !0,
74
- class: "bg-success-700 text-neutral-50"
75
- },
76
- {
77
- intent: "error",
78
- isHovered: !0,
79
- class: "bg-error-700 text-error-50"
80
- },
81
- {
82
- intent: "orangeWarning",
83
- isHovered: !0,
84
- class: "bg-orange-warning-700 text-orange-warning-50"
85
- },
86
- {
87
- intent: "yellowWarning",
88
- isHovered: !0,
89
- class: "bg-yellow-warning-700 text-neutral-50"
90
- },
91
- {
92
- intent: "info",
93
- isHovered: !0,
94
- class: "bg-blue-700 text-blue-50"
95
- },
96
- /* /Focus State */
97
- {
98
- intent: "success",
99
- isFocused: !0,
100
- class: "border-[1.5px] focus:ring-success-500"
101
- },
102
- {
103
- intent: "error",
104
- isFocused: !0,
105
- class: "border-[1.5px] focus:ring-error-500"
106
- },
107
- {
108
- intent: "orangeWarning",
109
- isFocused: !0,
110
- class: "border-[1.5px] focus:ring-orange-500"
111
- },
112
- {
113
- intent: "yellowWarning",
114
- isFocused: !0,
115
- class: "border-[1.5px] focus:ring-yellow-500"
116
- },
117
- {
118
- intent: "info",
119
- isFocused: !0,
120
- class: "border-[1.5px] focus:ring-blue-500"
121
- },
122
- /* Active State */
123
- {
124
- intent: "primary",
125
- isActive: !0,
126
- class: "bg-primary-900"
127
- },
128
- {
129
- intent: "secondary",
130
- isActive: !0,
131
- class: "bg-primary-300"
132
- },
133
- {
134
- intent: "tertiary",
135
- isActive: !0,
136
- class: "bg-primary-500 text-white"
137
- },
138
- {
139
- intent: "outline",
140
- isActive: !0,
141
- class: "border border-primary-500 bg-primary-300 text-primary-500"
142
- },
143
- {
144
- intent: "success",
145
- isActive: !0,
146
- class: "border border-transparent bg-success-300 text-success-900"
147
- },
148
- {
149
- intent: "error",
150
- isActive: !0,
151
- class: "border border-transparent bg-error-300 text-error-900"
152
- },
153
- {
154
- intent: "orangeWarning",
155
- isActive: !0,
156
- class: "border border-transparent bg-orange-warning-300 text-orange-warning-900"
157
- },
158
- {
159
- intent: "yellowWarning",
160
- isActive: !0,
161
- class: "border border-transparent bg-yellow-warning-300 text-[#6F5711]"
162
- //TODO: Este color yellow-warning-900 esta mal en @simpli-route/tailwind-preset, debe borrarse la 'h' al final del color
163
- },
164
- {
165
- intent: "info",
166
- isActive: !0,
167
- class: "border border-transparent bg-blue-200 text-blue-900"
168
- }
169
- /* /Active State */
170
- ]
171
- }
172
- );
1
+ import { j as s } from "./index.es19.js";
2
+ import { MinusIcon as p, PlusIcon as u } from "./index.es32.js";
3
+ import { cn as e } from "./index.es20.js";
4
+ const f = ({
5
+ label: o,
6
+ section: n,
7
+ active: r,
8
+ onToggle: l,
9
+ itemClassName: t,
10
+ sectionClassName: c,
11
+ hasIcon: i = !0
12
+ }) => {
13
+ const a = e("rounded-md border border-solid border-purple-200 bg-gray-100", t), d = e("px-4 pb-4", c), m = r ? p : u;
14
+ return /* @__PURE__ */ s.jsxs("div", { className: a, children: [
15
+ /* @__PURE__ */ s.jsxs("button", { className: "flex w-full cursor-pointer items-center gap-x-4 p-4", onClick: l, children: [
16
+ /* @__PURE__ */ s.jsx("div", { className: "flex-1", children: o }),
17
+ i ? /* @__PURE__ */ s.jsx("span", { className: `shrink-0 transition duration-300 ${r ? "-rotate-180" : "rotate-0"}`, children: /* @__PURE__ */ s.jsx(m, { className: "size-6" }) }) : null
18
+ ] }),
19
+ r ? /* @__PURE__ */ s.jsx("div", { className: d, children: n }) : null
20
+ ] });
21
+ };
173
22
  export {
174
- t as buttonVariants
23
+ f as AccordionItem
175
24
  };
@@ -1,45 +1,175 @@
1
1
  import { cva as r } from "class-variance-authority";
2
- const i = r(
3
- "flex h-5 w-5 shrink-0 cursor-pointer items-center justify-center rounded border-2 border-primary-200 text-white transition duration-150 ease-in-out",
2
+ const t = r(
3
+ "inline-flex select-none items-center justify-center text-center text-base font-semibold leading-6 transition duration-150 ease-in-out focus:outline-none",
4
4
  {
5
5
  variants: {
6
+ intent: {
7
+ primary: "bg-primary-500 text-primary-50",
8
+ secondary: "border border-primary-500 bg-primary-50 text-primary-500",
9
+ tertiary: "text-primary-500",
10
+ outline: "border border-primary-500 text-primary-500",
11
+ success: "border bg-success-500 text-success-50",
12
+ error: "border bg-error-500 text-error-50",
13
+ orangeWarning: "border bg-orange-warning-500 text-orange-warning-50",
14
+ yellowWarning: "border bg-yellow-warning-500 text-[#6F5711]",
15
+ //TODO: Este color yellow-warning-900 esta mal en @simpli-route/tailwind-preset, debe borrarse la 'h' al final del color
16
+ info: "border bg-blue-500 text-blue-50"
17
+ },
18
+ size: {
19
+ xs: "rounded px-3 py-1",
20
+ sm: "rounded px-3 py-2",
21
+ md: "rounded-lg px-4 py-3",
22
+ lg: "rounded-lg px-6 py-4"
23
+ },
24
+ isDisabled: {
25
+ true: "pointer-events-none cursor-not-allowed border-none bg-neutral-400 text-neutral-600"
26
+ },
6
27
  isHovered: {
7
28
  true: ""
8
29
  },
9
- isSelected: {
10
- true: "border-primary-500 bg-primary-500",
11
- false: "bg-white"
30
+ isActive: {
31
+ true: ""
12
32
  },
13
- isFocusVisible: {
14
- true: "border-primary-500 group-active:border-primary-500"
33
+ fullWidth: {
34
+ true: "w-full",
35
+ false: "w-fit"
15
36
  },
16
- isDisabled: {
17
- true: "border-neutral-500 cursor-not-allowed"
37
+ isLoading: {
38
+ true: "pointer-events-none cursor-not-allowed opacity-70"
18
39
  },
19
- label: {
20
- true: "mr-2"
40
+ isFocused: {
41
+ true: "focus:outline-none focus:ring-2 focus:ring-sky-400 focus:ring-offset-[0.4px] border-none",
42
+ false: ""
21
43
  }
22
44
  },
45
+ defaultVariants: {
46
+ intent: "primary",
47
+ size: "md"
48
+ },
23
49
  compoundVariants: [
50
+ /* Hover State */
51
+ {
52
+ intent: "primary",
53
+ isHovered: !0,
54
+ class: "bg-primary-700"
55
+ },
56
+ {
57
+ intent: "secondary",
58
+ isHovered: !0,
59
+ class: "bg-primary-200"
60
+ },
61
+ {
62
+ intent: "tertiary",
63
+ isHovered: !0,
64
+ class: "bg-primary-300 text-primary-800"
65
+ },
66
+ {
67
+ intent: "outline",
68
+ isHovered: !0,
69
+ class: "bg-primary-500 text-primary-50"
70
+ },
71
+ {
72
+ intent: "success",
73
+ isHovered: !0,
74
+ class: "bg-success-700 text-neutral-50"
75
+ },
76
+ {
77
+ intent: "error",
78
+ isHovered: !0,
79
+ class: "bg-error-700 text-error-50"
80
+ },
81
+ {
82
+ intent: "orangeWarning",
83
+ isHovered: !0,
84
+ class: "bg-orange-warning-700 text-orange-warning-50"
85
+ },
24
86
  {
87
+ intent: "yellowWarning",
25
88
  isHovered: !0,
26
- isSelected: !0,
27
- class: "border-none bg-primary-600 group-active:bg-primary-600"
89
+ class: "bg-yellow-warning-700 text-neutral-50"
28
90
  },
29
91
  {
92
+ intent: "info",
30
93
  isHovered: !0,
31
- isSelected: !1,
32
- isDisabled: !1,
33
- class: "border-primary-700 group-active:bg-primary-600"
94
+ class: "bg-blue-700 text-blue-50"
95
+ },
96
+ /* /Focus State */
97
+ {
98
+ intent: "success",
99
+ isFocused: !0,
100
+ class: "border-[1.5px] focus:ring-success-500"
101
+ },
102
+ {
103
+ intent: "error",
104
+ isFocused: !0,
105
+ class: "border-[1.5px] focus:ring-error-500"
106
+ },
107
+ {
108
+ intent: "orangeWarning",
109
+ isFocused: !0,
110
+ class: "border-[1.5px] focus:ring-orange-500"
111
+ },
112
+ {
113
+ intent: "yellowWarning",
114
+ isFocused: !0,
115
+ class: "border-[1.5px] focus:ring-yellow-500"
116
+ },
117
+ {
118
+ intent: "info",
119
+ isFocused: !0,
120
+ class: "border-[1.5px] focus:ring-blue-500"
121
+ },
122
+ /* Active State */
123
+ {
124
+ intent: "primary",
125
+ isActive: !0,
126
+ class: "bg-primary-900"
127
+ },
128
+ {
129
+ intent: "secondary",
130
+ isActive: !0,
131
+ class: "bg-primary-300"
132
+ },
133
+ {
134
+ intent: "tertiary",
135
+ isActive: !0,
136
+ class: "bg-primary-500 text-white"
137
+ },
138
+ {
139
+ intent: "outline",
140
+ isActive: !0,
141
+ class: "border border-primary-500 bg-primary-300 text-primary-500"
142
+ },
143
+ {
144
+ intent: "success",
145
+ isActive: !0,
146
+ class: "border border-transparent bg-success-300 text-success-900"
147
+ },
148
+ {
149
+ intent: "error",
150
+ isActive: !0,
151
+ class: "border border-transparent bg-error-300 text-error-900"
152
+ },
153
+ {
154
+ intent: "orangeWarning",
155
+ isActive: !0,
156
+ class: "border border-transparent bg-orange-warning-300 text-orange-warning-900"
157
+ },
158
+ {
159
+ intent: "yellowWarning",
160
+ isActive: !0,
161
+ class: "border border-transparent bg-yellow-warning-300 text-[#6F5711]"
162
+ //TODO: Este color yellow-warning-900 esta mal en @simpli-route/tailwind-preset, debe borrarse la 'h' al final del color
34
163
  },
35
164
  {
36
- isDisabled: !0,
37
- isSelected: !0,
38
- class: "bg-neutral-500"
165
+ intent: "info",
166
+ isActive: !0,
167
+ class: "border border-transparent bg-blue-200 text-blue-900"
39
168
  }
169
+ /* /Active State */
40
170
  ]
41
171
  }
42
172
  );
43
173
  export {
44
- i as checkboxVariants
174
+ t as buttonVariants
45
175
  };
@@ -1,36 +1,45 @@
1
1
  import { cva as r } from "class-variance-authority";
2
- const t = r("bg-primary-50 inline-flex items-center select-none border border-transparent", {
3
- variants: {
4
- style: {
5
- square: "rounded-md",
6
- rounded: "rounded-full"
2
+ const i = r(
3
+ "flex h-5 w-5 shrink-0 cursor-pointer items-center justify-center rounded border-2 border-primary-200 text-white transition duration-150 ease-in-out",
4
+ {
5
+ variants: {
6
+ isHovered: {
7
+ true: ""
8
+ },
9
+ isSelected: {
10
+ true: "border-primary-500 bg-primary-500",
11
+ false: "bg-white"
12
+ },
13
+ isFocusVisible: {
14
+ true: "border-primary-500 group-active:border-primary-500"
15
+ },
16
+ isDisabled: {
17
+ true: "border-neutral-500 cursor-not-allowed"
18
+ },
19
+ label: {
20
+ true: "mr-2"
21
+ }
7
22
  },
8
- size: {
9
- xs: [
10
- "gap-1 py-[2px] pr-[6px] pl-1 font-normal text-neutral-900 text-[10px]",
11
- "[&_svg]:w-[10px] [&_svg]:h-[10px]"
12
- ],
13
- sm: ["gap-1 py-[2px] pr-[6px] pl-1 font-normal text-neutral-900 text-xs", "[&_svg]:w-3 [&_svg]:h-3"],
14
- md: ["gap-1 py-1 pr-3 pl-2 font-normal text-neutral-900 text-sm", "[&_svg]:w-4 [&_svg]:h-4"],
15
- lg: ["gap-2 py-1 pr-3 pl-2 font-normal text-neutral-900 text-sm", "[&_svg]:w-4 [&_svg]:h-4"]
16
- },
17
- pressable: {
18
- true: "cursor-pointer"
19
- },
20
- isFocused: {
21
- true: "border-primary-500"
22
- },
23
- isHovered: {
24
- true: "border-primary-300"
25
- },
26
- isPressed: {
27
- true: "bg-primary-200"
28
- },
29
- isDisabled: {
30
- true: "bg-neutral-50 text-neutral-600 [&_svg]:text-neutral-600 cursor-not-allowed"
31
- }
23
+ compoundVariants: [
24
+ {
25
+ isHovered: !0,
26
+ isSelected: !0,
27
+ class: "border-none bg-primary-600 group-active:bg-primary-600"
28
+ },
29
+ {
30
+ isHovered: !0,
31
+ isSelected: !1,
32
+ isDisabled: !1,
33
+ class: "border-primary-700 group-active:bg-primary-600"
34
+ },
35
+ {
36
+ isDisabled: !0,
37
+ isSelected: !0,
38
+ class: "bg-neutral-500"
39
+ }
40
+ ]
32
41
  }
33
- });
42
+ );
34
43
  export {
35
- t as assistChipVariants
44
+ i as checkboxVariants
36
45
  };
@@ -1,61 +1,36 @@
1
1
  import { cva as r } from "class-variance-authority";
2
- const o = r(
3
- "box-border w-full rounded border border-neutral-500 px-3 placeholder:text-neutral-700 focus:outline-none",
4
- {
5
- variants: {
6
- size: {
7
- xs: "py-1",
8
- sm: "py-2",
9
- md: "py-3",
10
- lg: "py-4"
11
- },
12
- isHovered: {
13
- true: ""
14
- },
15
- isFocused: {
16
- true: ""
17
- },
18
- isDisabled: {
19
- true: "border border-neutral-200 bg-neutral-200 cursor-not-allowed text-neutral-700",
20
- false: "bg-neutral-50"
21
- },
22
- isReadOnly: {
23
- true: "cursor-not-allowed"
24
- },
25
- validationState: {
26
- default: "",
27
- valid: "border border-success-500",
28
- invalid: "border border-error-500"
29
- }
2
+ const t = r("bg-primary-50 inline-flex items-center select-none border border-transparent", {
3
+ variants: {
4
+ style: {
5
+ square: "rounded-md",
6
+ rounded: "rounded-full"
30
7
  },
31
- compoundVariants: [
32
- {
33
- isHovered: !0,
34
- isDisabled: !1,
35
- validationState: "default",
36
- class: "border border-neutral-900"
37
- },
38
- // default focus
39
- {
40
- isFocused: !0,
41
- isDisabled: !1,
42
- class: "border-2 focus-within:border-primary-500 focus-within:ring-1 focus-within:ring-primary-500 focus:border-primary-500 focus:ring-1 focus:ring-primary-500"
43
- },
44
- // success focused
45
- {
46
- validationState: "valid",
47
- isFocused: !0,
48
- class: "border-2 border-success-500 focus-within:ring-1 focus-within:ring-success-500 focus:border-success-500 focus:ring-1 focus:ring-success-500"
49
- },
50
- // error focused
51
- {
52
- validationState: "invalid",
53
- isFocused: !0,
54
- class: "border-2 border-error-500 focus-within:ring-1 focus-within:ring-error-500 focus:border-error-500 focus:ring-1 focus:ring-error-500"
55
- }
56
- ]
8
+ size: {
9
+ xs: [
10
+ "gap-1 py-[2px] pr-[6px] pl-1 font-normal text-neutral-900 text-[10px]",
11
+ "[&_svg]:w-[10px] [&_svg]:h-[10px]"
12
+ ],
13
+ sm: ["gap-1 py-[2px] pr-[6px] pl-1 font-normal text-neutral-900 text-xs", "[&_svg]:w-3 [&_svg]:h-3"],
14
+ md: ["gap-1 py-1 pr-3 pl-2 font-normal text-neutral-900 text-sm", "[&_svg]:w-4 [&_svg]:h-4"],
15
+ lg: ["gap-2 py-1 pr-3 pl-2 font-normal text-neutral-900 text-sm", "[&_svg]:w-4 [&_svg]:h-4"]
16
+ },
17
+ pressable: {
18
+ true: "cursor-pointer"
19
+ },
20
+ isFocused: {
21
+ true: "border-primary-500"
22
+ },
23
+ isHovered: {
24
+ true: "border-primary-300"
25
+ },
26
+ isPressed: {
27
+ true: "bg-primary-200"
28
+ },
29
+ isDisabled: {
30
+ true: "bg-neutral-50 text-neutral-600 [&_svg]:text-neutral-600 cursor-not-allowed"
31
+ }
57
32
  }
58
- );
33
+ });
59
34
  export {
60
- o as inputNumberVariant
35
+ t as assistChipVariants
61
36
  };
@@ -1,5 +1,61 @@
1
- import { createContext as t } from "react";
2
- const e = t({});
1
+ import { cva as r } from "class-variance-authority";
2
+ const o = r(
3
+ "box-border w-full rounded border border-neutral-500 px-3 placeholder:text-neutral-700 focus:outline-none",
4
+ {
5
+ variants: {
6
+ size: {
7
+ xs: "py-1",
8
+ sm: "py-2",
9
+ md: "py-3",
10
+ lg: "py-4"
11
+ },
12
+ isHovered: {
13
+ true: ""
14
+ },
15
+ isFocused: {
16
+ true: ""
17
+ },
18
+ isDisabled: {
19
+ true: "border border-neutral-200 bg-neutral-200 cursor-not-allowed text-neutral-700",
20
+ false: "bg-neutral-50"
21
+ },
22
+ isReadOnly: {
23
+ true: "cursor-not-allowed"
24
+ },
25
+ validationState: {
26
+ default: "",
27
+ valid: "border border-success-500",
28
+ invalid: "border border-error-500"
29
+ }
30
+ },
31
+ compoundVariants: [
32
+ {
33
+ isHovered: !0,
34
+ isDisabled: !1,
35
+ validationState: "default",
36
+ class: "border border-neutral-900"
37
+ },
38
+ // default focus
39
+ {
40
+ isFocused: !0,
41
+ isDisabled: !1,
42
+ class: "border-2 focus-within:border-primary-500 focus-within:ring-1 focus-within:ring-primary-500 focus:border-primary-500 focus:ring-1 focus:ring-primary-500"
43
+ },
44
+ // success focused
45
+ {
46
+ validationState: "valid",
47
+ isFocused: !0,
48
+ class: "border-2 border-success-500 focus-within:ring-1 focus-within:ring-success-500 focus:border-success-500 focus:ring-1 focus:ring-success-500"
49
+ },
50
+ // error focused
51
+ {
52
+ validationState: "invalid",
53
+ isFocused: !0,
54
+ class: "border-2 border-error-500 focus-within:ring-1 focus-within:ring-error-500 focus:border-error-500 focus:ring-1 focus:ring-error-500"
55
+ }
56
+ ]
57
+ }
58
+ );
3
59
  export {
4
- e as TooltipContext
60
+ o as inputNumberVariant
5
61
  };