@arobo/styles 1.0.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 (222) hide show
  1. package/README.md +3 -0
  2. package/dist/aroboui.min.css +2 -0
  3. package/dist/base/base.css +8 -0
  4. package/dist/components/button/button.styles.d.ts +70 -0
  5. package/dist/components/button/button.styles.d.ts.map +1 -0
  6. package/dist/components/button/button.styles.js +36 -0
  7. package/dist/components/button/index.d.ts +2 -0
  8. package/dist/components/button/index.d.ts.map +1 -0
  9. package/dist/components/button/index.js +1 -0
  10. package/dist/components/button-group/button-group.styles.d.ts +19 -0
  11. package/dist/components/button-group/button-group.styles.d.ts.map +1 -0
  12. package/dist/components/button-group/button-group.styles.js +16 -0
  13. package/dist/components/button-group/index.d.ts +2 -0
  14. package/dist/components/button-group/index.d.ts.map +1 -0
  15. package/dist/components/button-group/index.js +1 -0
  16. package/dist/components/button-group.css +78 -0
  17. package/dist/components/button.css +158 -0
  18. package/dist/components/calendar/calendar.styles.d.ts +40 -0
  19. package/dist/components/calendar/calendar.styles.d.ts.map +1 -0
  20. package/dist/components/calendar/calendar.styles.js +25 -0
  21. package/dist/components/calendar/index.d.ts +2 -0
  22. package/dist/components/calendar/index.d.ts.map +1 -0
  23. package/dist/components/calendar/index.js +1 -0
  24. package/dist/components/calendar.css +35 -0
  25. package/dist/components/card/card.styles.d.ts +71 -0
  26. package/dist/components/card/card.styles.d.ts.map +1 -0
  27. package/dist/components/card/card.styles.js +33 -0
  28. package/dist/components/card/index.d.ts +2 -0
  29. package/dist/components/card/index.d.ts.map +1 -0
  30. package/dist/components/card/index.js +1 -0
  31. package/dist/components/card.css +50 -0
  32. package/dist/components/checkbox/checkbox.styles.d.ts +46 -0
  33. package/dist/components/checkbox/checkbox.styles.d.ts.map +1 -0
  34. package/dist/components/checkbox/checkbox.styles.js +25 -0
  35. package/dist/components/checkbox/index.d.ts +2 -0
  36. package/dist/components/checkbox/index.d.ts.map +1 -0
  37. package/dist/components/checkbox/index.js +1 -0
  38. package/dist/components/checkbox-group/checkbox-group.styles.d.ts +34 -0
  39. package/dist/components/checkbox-group/checkbox-group.styles.d.ts.map +1 -0
  40. package/dist/components/checkbox-group/checkbox-group.styles.js +22 -0
  41. package/dist/components/checkbox-group/index.d.ts +2 -0
  42. package/dist/components/checkbox-group/index.d.ts.map +1 -0
  43. package/dist/components/checkbox-group/index.js +1 -0
  44. package/dist/components/checkbox-group.css +7 -0
  45. package/dist/components/checkbox.css +269 -0
  46. package/dist/components/close-button/close-button.styles.d.ts +16 -0
  47. package/dist/components/close-button/close-button.styles.d.ts.map +1 -0
  48. package/dist/components/close-button/close-button.styles.js +15 -0
  49. package/dist/components/close-button/index.d.ts +2 -0
  50. package/dist/components/close-button/index.d.ts.map +1 -0
  51. package/dist/components/close-button/index.js +1 -0
  52. package/dist/components/close-button.css +65 -0
  53. package/dist/components/combobox/combobox.styles.d.ts +43 -0
  54. package/dist/components/combobox/combobox.styles.d.ts.map +1 -0
  55. package/dist/components/combobox/combobox.styles.js +24 -0
  56. package/dist/components/combobox/index.d.ts +2 -0
  57. package/dist/components/combobox/index.d.ts.map +1 -0
  58. package/dist/components/combobox/index.js +1 -0
  59. package/dist/components/combobox.css +169 -0
  60. package/dist/components/date-field/date-field.styles.d.ts +19 -0
  61. package/dist/components/date-field/date-field.styles.d.ts.map +1 -0
  62. package/dist/components/date-field/date-field.styles.js +16 -0
  63. package/dist/components/date-field/index.d.ts +2 -0
  64. package/dist/components/date-field/index.d.ts.map +1 -0
  65. package/dist/components/date-field/index.js +1 -0
  66. package/dist/components/date-field.css +24 -0
  67. package/dist/components/date-input-group/date-input-group.styles.d.ts +43 -0
  68. package/dist/components/date-input-group/date-input-group.styles.d.ts.map +1 -0
  69. package/dist/components/date-input-group/date-input-group.styles.js +24 -0
  70. package/dist/components/date-input-group/index.d.ts +2 -0
  71. package/dist/components/date-input-group/index.d.ts.map +1 -0
  72. package/dist/components/date-input-group/index.js +1 -0
  73. package/dist/components/date-input-group.css +116 -0
  74. package/dist/components/date-picker/date-picker.styles.d.ts +37 -0
  75. package/dist/components/date-picker/date-picker.styles.d.ts.map +1 -0
  76. package/dist/components/date-picker/date-picker.styles.js +11 -0
  77. package/dist/components/date-picker/index.d.ts +2 -0
  78. package/dist/components/date-picker/index.d.ts.map +1 -0
  79. package/dist/components/date-picker/index.js +1 -0
  80. package/dist/components/date-picker.css +32 -0
  81. package/dist/components/date-range-picker/date-range-picker.styles.d.ts +49 -0
  82. package/dist/components/date-range-picker/date-range-picker.styles.d.ts.map +1 -0
  83. package/dist/components/date-range-picker/date-range-picker.styles.js +28 -0
  84. package/dist/components/date-range-picker/index.d.ts +2 -0
  85. package/dist/components/date-range-picker/index.d.ts.map +1 -0
  86. package/dist/components/date-range-picker/index.js +1 -0
  87. package/dist/components/date-range-picker.css +28 -0
  88. package/dist/components/description/description.styles.d.ts +4 -0
  89. package/dist/components/description/description.styles.d.ts.map +1 -0
  90. package/dist/components/description/description.styles.js +7 -0
  91. package/dist/components/description/index.d.ts +2 -0
  92. package/dist/components/description/index.d.ts.map +1 -0
  93. package/dist/components/description/index.js +1 -0
  94. package/dist/components/description.css +4 -0
  95. package/dist/components/error-message/error-message.styles.d.ts +4 -0
  96. package/dist/components/error-message/error-message.styles.d.ts.map +1 -0
  97. package/dist/components/error-message/error-message.styles.js +7 -0
  98. package/dist/components/error-message/index.d.ts +2 -0
  99. package/dist/components/error-message/index.d.ts.map +1 -0
  100. package/dist/components/error-message/index.js +1 -0
  101. package/dist/components/error-message.css +13 -0
  102. package/dist/components/field-error/field-error.styles.d.ts +4 -0
  103. package/dist/components/field-error/field-error.styles.d.ts.map +1 -0
  104. package/dist/components/field-error/field-error.styles.js +7 -0
  105. package/dist/components/field-error/index.d.ts +2 -0
  106. package/dist/components/field-error/index.d.ts.map +1 -0
  107. package/dist/components/field-error/index.js +1 -0
  108. package/dist/components/field-error.css +13 -0
  109. package/dist/components/field-group/field-group.styles.d.ts +69 -0
  110. package/dist/components/field-group/field-group.styles.d.ts.map +1 -0
  111. package/dist/components/field-group/field-group.styles.js +25 -0
  112. package/dist/components/field-group/index.d.ts +2 -0
  113. package/dist/components/field-group/index.d.ts.map +1 -0
  114. package/dist/components/field-group/index.js +1 -0
  115. package/dist/components/field-group.css +7 -0
  116. package/dist/components/index.css +23 -0
  117. package/dist/components/index.d.ts +23 -0
  118. package/dist/components/index.d.ts.map +1 -0
  119. package/dist/components/input/index.d.ts +2 -0
  120. package/dist/components/input/index.d.ts.map +1 -0
  121. package/dist/components/input/index.js +1 -0
  122. package/dist/components/input/input.styles.d.ts +31 -0
  123. package/dist/components/input/input.styles.d.ts.map +1 -0
  124. package/dist/components/input/input.styles.js +21 -0
  125. package/dist/components/input.css +72 -0
  126. package/dist/components/label/index.d.ts +2 -0
  127. package/dist/components/label/index.d.ts.map +1 -0
  128. package/dist/components/label/index.js +1 -0
  129. package/dist/components/label/label.styles.d.ts +34 -0
  130. package/dist/components/label/label.styles.d.ts.map +1 -0
  131. package/dist/components/label/label.styles.js +23 -0
  132. package/dist/components/label.css +31 -0
  133. package/dist/components/popover/index.d.ts +2 -0
  134. package/dist/components/popover/index.d.ts.map +1 -0
  135. package/dist/components/popover/index.js +1 -0
  136. package/dist/components/popover/popover.styles.d.ts +46 -0
  137. package/dist/components/popover/popover.styles.d.ts.map +1 -0
  138. package/dist/components/popover/popover.styles.js +12 -0
  139. package/dist/components/popover.css +91 -0
  140. package/dist/components/range-calendar/index.d.ts +2 -0
  141. package/dist/components/range-calendar/index.d.ts.map +1 -0
  142. package/dist/components/range-calendar/index.js +1 -0
  143. package/dist/components/range-calendar/range-calendar.styles.d.ts +43 -0
  144. package/dist/components/range-calendar/range-calendar.styles.d.ts.map +1 -0
  145. package/dist/components/range-calendar/range-calendar.styles.js +26 -0
  146. package/dist/components/range-calendar.css +83 -0
  147. package/dist/components/surface/index.d.ts +2 -0
  148. package/dist/components/surface/index.d.ts.map +1 -0
  149. package/dist/components/surface/index.js +1 -0
  150. package/dist/components/surface/surface.styles.d.ts +37 -0
  151. package/dist/components/surface/surface.styles.d.ts.map +1 -0
  152. package/dist/components/surface/surface.styles.js +35 -0
  153. package/dist/components/surface.css +36 -0
  154. package/dist/components/text-field/index.d.ts +2 -0
  155. package/dist/components/text-field/index.d.ts.map +1 -0
  156. package/dist/components/text-field/index.js +1 -0
  157. package/dist/components/text-field/text-field.styles.d.ts +19 -0
  158. package/dist/components/text-field/text-field.styles.d.ts.map +1 -0
  159. package/dist/components/text-field/text-field.styles.js +16 -0
  160. package/dist/components/text-field.css +26 -0
  161. package/dist/index.css +17 -0
  162. package/dist/index.d.ts +4 -0
  163. package/dist/index.d.ts.map +1 -0
  164. package/dist/index.js +24 -0
  165. package/dist/themes/default/index.css +4 -0
  166. package/dist/themes/default/variables.css +157 -0
  167. package/dist/themes/shared/theme.css +338 -0
  168. package/dist/utilities/index.css +45 -0
  169. package/dist/utils/index.d.ts +2 -0
  170. package/dist/utils/index.d.ts.map +1 -0
  171. package/dist/utils/state.d.ts +17 -0
  172. package/dist/utils/state.d.ts.map +1 -0
  173. package/dist/utils/state.js +13 -0
  174. package/package.json +53 -0
  175. package/src/components/button/button.styles.ts +38 -0
  176. package/src/components/button/index.ts +1 -0
  177. package/src/components/button-group/button-group.styles.ts +18 -0
  178. package/src/components/button-group/index.ts +1 -0
  179. package/src/components/calendar/calendar.styles.ts +27 -0
  180. package/src/components/calendar/index.ts +1 -0
  181. package/src/components/card/card.styles.ts +36 -0
  182. package/src/components/card/index.ts +1 -0
  183. package/src/components/checkbox/checkbox.styles.ts +27 -0
  184. package/src/components/checkbox/index.ts +1 -0
  185. package/src/components/checkbox-group/checkbox-group.styles.ts +24 -0
  186. package/src/components/checkbox-group/index.ts +1 -0
  187. package/src/components/close-button/close-button.styles.ts +17 -0
  188. package/src/components/close-button/index.ts +1 -0
  189. package/src/components/combobox/combobox.styles.ts +26 -0
  190. package/src/components/combobox/index.ts +1 -0
  191. package/src/components/date-field/date-field.styles.ts +18 -0
  192. package/src/components/date-field/index.ts +1 -0
  193. package/src/components/date-input-group/date-input-group.styles.ts +28 -0
  194. package/src/components/date-input-group/index.ts +1 -0
  195. package/src/components/date-picker/date-picker.styles.ts +13 -0
  196. package/src/components/date-picker/index.ts +1 -0
  197. package/src/components/date-range-picker/date-range-picker.styles.ts +32 -0
  198. package/src/components/date-range-picker/index.ts +1 -0
  199. package/src/components/description/description.styles.ts +9 -0
  200. package/src/components/description/index.ts +1 -0
  201. package/src/components/error-message/error-message.styles.ts +9 -0
  202. package/src/components/error-message/index.ts +1 -0
  203. package/src/components/field-error/field-error.styles.ts +9 -0
  204. package/src/components/field-error/index.ts +1 -0
  205. package/src/components/field-group/field-group.styles.ts +29 -0
  206. package/src/components/field-group/index.ts +1 -0
  207. package/src/components/index.ts +23 -0
  208. package/src/components/input/index.ts +1 -0
  209. package/src/components/input/input.styles.ts +23 -0
  210. package/src/components/label/index.ts +1 -0
  211. package/src/components/label/label.styles.ts +25 -0
  212. package/src/components/popover/index.ts +1 -0
  213. package/src/components/popover/popover.styles.ts +14 -0
  214. package/src/components/range-calendar/index.ts +1 -0
  215. package/src/components/range-calendar/range-calendar.styles.ts +28 -0
  216. package/src/components/surface/index.ts +1 -0
  217. package/src/components/surface/surface.styles.ts +37 -0
  218. package/src/components/text-field/index.ts +1 -0
  219. package/src/components/text-field/text-field.styles.ts +18 -0
  220. package/src/index.ts +4 -0
  221. package/src/utils/index.ts +1 -0
  222. package/src/utils/state.ts +11 -0
@@ -0,0 +1,32 @@
1
+ .date-picker {
2
+ @apply flex flex-col gap-1 font-sans;
3
+
4
+ &:has([data-open="true"]) [data-slot="trigger"] {
5
+ &[data-pressed] {
6
+ background-color: var(--button-bg-pressed);
7
+ transform: scale(0.97);
8
+ }
9
+ }
10
+
11
+ &:not([data-open="true"]) [data-slot="trigger"] {
12
+ &[data-pressed][data-hovered="true"] {
13
+ background-color: var(--button-bg-hover);
14
+ }
15
+ &[data-pressed] {
16
+ transform: none;
17
+ background-color: transparent;
18
+ }
19
+ }
20
+ }
21
+
22
+ .date-picker__trigger {
23
+ @apply size-6 mr-1 outline-offset-0 rounded-sm;
24
+
25
+ [data-slot="icon"] {
26
+ @apply w-4 h-4 text-fgColor-muted;
27
+ }
28
+ }
29
+
30
+ .date-picker__input {
31
+ @apply flex-1 min-w-37.5 px-3 text-sm text-fgColor-default;
32
+ }
@@ -0,0 +1,49 @@
1
+ import type { VariantProps } from "tailwind-variants";
2
+ export declare const dateRangePickerVariants: import("tailwind-variants").TVReturnType<{
3
+ variant: {
4
+ primary: string;
5
+ secondary: string;
6
+ };
7
+ size: {
8
+ sm: string;
9
+ md: string;
10
+ lg: string;
11
+ };
12
+ }, {
13
+ trigger: string;
14
+ inputGroup: string;
15
+ input: string;
16
+ separator: string;
17
+ }, "date-range-picker", {
18
+ variant: {
19
+ primary: string;
20
+ secondary: string;
21
+ };
22
+ size: {
23
+ sm: string;
24
+ md: string;
25
+ lg: string;
26
+ };
27
+ }, {
28
+ trigger: string;
29
+ inputGroup: string;
30
+ input: string;
31
+ separator: string;
32
+ }, import("tailwind-variants").TVReturnType<{
33
+ variant: {
34
+ primary: string;
35
+ secondary: string;
36
+ };
37
+ size: {
38
+ sm: string;
39
+ md: string;
40
+ lg: string;
41
+ };
42
+ }, {
43
+ trigger: string;
44
+ inputGroup: string;
45
+ input: string;
46
+ separator: string;
47
+ }, "date-range-picker", unknown, unknown, undefined>>;
48
+ export type DateRangePickerVariants = VariantProps<typeof dateRangePickerVariants>;
49
+ //# sourceMappingURL=date-range-picker.styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"date-range-picker.styles.d.ts","sourceRoot":"","sources":["../../../src/components/date-range-picker/date-range-picker.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qDAuBlC,CAAC;AAEH,MAAM,MAAM,uBAAuB,GAAG,YAAY,CAChD,OAAO,uBAAuB,CAC/B,CAAC"}
@@ -0,0 +1,28 @@
1
+ import { tv } from 'tailwind-variants';
2
+
3
+ const dateRangePickerVariants = tv({
4
+ base: "date-range-picker",
5
+ slots: {
6
+ trigger: "date-range-picker__trigger",
7
+ inputGroup: "date-range-picker__input-group",
8
+ input: "date-range-picker__input",
9
+ separator: "date-range-picker__separator",
10
+ },
11
+ defaultVariants: {
12
+ variant: "primary",
13
+ size: "md",
14
+ },
15
+ variants: {
16
+ variant: {
17
+ primary: "date-range-picker--primary",
18
+ secondary: "date-range-picker--secondary",
19
+ },
20
+ size: {
21
+ sm: "date-range-picker--sm",
22
+ md: "date-range-picker--md",
23
+ lg: "date-range-picker--lg",
24
+ },
25
+ },
26
+ });
27
+
28
+ export { dateRangePickerVariants };
@@ -0,0 +1,2 @@
1
+ export * from "./date-range-picker.styles";
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/date-range-picker/index.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC"}
@@ -0,0 +1 @@
1
+ export { dateRangePickerVariants } from './date-range-picker.styles.js';
@@ -0,0 +1,28 @@
1
+ .date-range-picker__trigger {
2
+ @apply size-6 mr-1 outline-offset-0 rounded-sm;
3
+
4
+ [data-slot="icon"] {
5
+ @apply w-4 h-4 text-fgColor-muted;
6
+ }
7
+ }
8
+
9
+ .date-range-picker__input-group {
10
+ @apply flex-1 w-fit flex items-center overflow-x-auto overflow-y-clip [scrollbar-width:none];
11
+
12
+ &[data-disabled="true"] .date-range-picker__separator {
13
+ @apply text-fgColor-disabled;
14
+ }
15
+
16
+ &[data-invalid="true"] .date-range-picker__separator,
17
+ &[data-invalid="true"] [data-slot="icon"] {
18
+ @apply text-fgColor-danger;
19
+ }
20
+ }
21
+
22
+ .date-range-picker__input {
23
+ @apply flex-1 ps-2 pe-3 text-sm text-fgColor-default;
24
+ }
25
+
26
+ .date-range-picker__separator {
27
+ @apply text-fgColor-default;
28
+ }
@@ -0,0 +1,4 @@
1
+ import type { VariantProps } from "tailwind-variants";
2
+ export declare const descriptionVariants: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "description", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "description", unknown, unknown, undefined>>;
3
+ export type DescriptionVariants = VariantProps<typeof descriptionVariants>;
4
+ //# sourceMappingURL=description.styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"description.styles.d.ts","sourceRoot":"","sources":["../../../src/components/description/description.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,mBAAmB,gNAE9B,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,CAAC"}
@@ -0,0 +1,7 @@
1
+ import { tv } from 'tailwind-variants';
2
+
3
+ const descriptionVariants = tv({
4
+ base: "description",
5
+ });
6
+
7
+ export { descriptionVariants };
@@ -0,0 +1,2 @@
1
+ export * from "./description.styles";
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/description/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC"}
@@ -0,0 +1 @@
1
+ export { descriptionVariants } from './description.styles.js';
@@ -0,0 +1,4 @@
1
+ /* Base description styles */
2
+ .description {
3
+ @apply text-xs text-wrap wrap-break-word text-muted;
4
+ }
@@ -0,0 +1,4 @@
1
+ import type { VariantProps } from "tailwind-variants";
2
+ export declare const errorMessageVariants: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "error-message", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "error-message", unknown, unknown, undefined>>;
3
+ export type ErrorMessageVariants = VariantProps<typeof errorMessageVariants>;
4
+ //# sourceMappingURL=error-message.styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"error-message.styles.d.ts","sourceRoot":"","sources":["../../../src/components/error-message/error-message.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,oBAAoB,oNAE/B,CAAC;AAEH,MAAM,MAAM,oBAAoB,GAAG,YAAY,CAAC,OAAO,oBAAoB,CAAC,CAAC"}
@@ -0,0 +1,7 @@
1
+ import { tv } from 'tailwind-variants';
2
+
3
+ const errorMessageVariants = tv({
4
+ base: "error-message",
5
+ });
6
+
7
+ export { errorMessageVariants };
@@ -0,0 +1,2 @@
1
+ export * from "./error-message.styles";
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/error-message/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC"}
@@ -0,0 +1 @@
1
+ export { errorMessageVariants } from './error-message.styles.js';
@@ -0,0 +1,13 @@
1
+ /* Base error message styles */
2
+ .error-message {
3
+ @apply h-auto text-xs wrap-break-word text-danger;
4
+
5
+ /**
6
+ * Transitions
7
+ * CRITICAL: motion-reduce must be AFTER transition for correct override specificity
8
+ */
9
+ transition:
10
+ opacity 150ms var(--ease-out),
11
+ height 350ms var(--ease-smooth);
12
+ @apply motion-reduce:transition-none;
13
+ }
@@ -0,0 +1,4 @@
1
+ import type { VariantProps } from "tailwind-variants";
2
+ export declare const fieldErrorVariants: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "field-error", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "field-error", unknown, unknown, undefined>>;
3
+ export type FieldErrorVariants = VariantProps<typeof fieldErrorVariants>;
4
+ //# sourceMappingURL=field-error.styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"field-error.styles.d.ts","sourceRoot":"","sources":["../../../src/components/field-error/field-error.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,kBAAkB,gNAE7B,CAAC;AAEH,MAAM,MAAM,kBAAkB,GAAG,YAAY,CAAC,OAAO,kBAAkB,CAAC,CAAC"}
@@ -0,0 +1,7 @@
1
+ import { tv } from 'tailwind-variants';
2
+
3
+ const fieldErrorVariants = tv({
4
+ base: "field-error",
5
+ });
6
+
7
+ export { fieldErrorVariants };
@@ -0,0 +1,2 @@
1
+ export * from "./field-error.styles";
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/field-error/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC"}
@@ -0,0 +1 @@
1
+ export { fieldErrorVariants } from './field-error.styles.js';
@@ -0,0 +1,13 @@
1
+ /* Field error styles */
2
+ .field-error {
3
+ @apply h-0 px-1 text-xs wrap-break-word text-danger opacity-0 data-[visible=true]:h-auto data-[visible=true]:opacity-100;
4
+
5
+ /**
6
+ * Transitions
7
+ * CRITICAL: motion-reduce must be AFTER transition for correct override specificity
8
+ */
9
+ transition:
10
+ opacity 150ms var(--ease-out),
11
+ height 350ms var(--ease-smooth);
12
+ @apply motion-reduce:transition-none;
13
+ }
@@ -0,0 +1,69 @@
1
+ import type { VariantProps } from "tailwind-variants";
2
+ export declare const fieldBorderStyles: import("tailwind-variants").TVReturnType<{
3
+ isFocusWithin: {
4
+ false: string;
5
+ true: string;
6
+ };
7
+ isInvalid: {
8
+ true: string;
9
+ };
10
+ isDisabled: {
11
+ true: string;
12
+ };
13
+ }, undefined, "transition", {
14
+ isFocusWithin: {
15
+ false: string;
16
+ true: string;
17
+ };
18
+ isInvalid: {
19
+ true: string;
20
+ };
21
+ isDisabled: {
22
+ true: string;
23
+ };
24
+ }, undefined, import("tailwind-variants").TVReturnType<{
25
+ isFocusWithin: {
26
+ false: string;
27
+ true: string;
28
+ };
29
+ isInvalid: {
30
+ true: string;
31
+ };
32
+ isDisabled: {
33
+ true: string;
34
+ };
35
+ }, undefined, "transition", unknown, unknown, undefined>>;
36
+ export declare const fieldGroupVariants: import("tailwind-variants").TVReturnType<{
37
+ isFocusWithin: {
38
+ false: string;
39
+ true: string;
40
+ };
41
+ isInvalid: {
42
+ true: string;
43
+ };
44
+ isDisabled: {
45
+ true: string;
46
+ };
47
+ }, undefined, "field-group", {
48
+ isFocusVisible: {
49
+ false: string;
50
+ true: string;
51
+ };
52
+ }, undefined, import("tailwind-variants").TVReturnType<{
53
+ isFocusVisible: {
54
+ false: string;
55
+ true: string;
56
+ };
57
+ }, undefined, "focus-ring", {
58
+ isFocusVisible: {
59
+ false: string;
60
+ true: string;
61
+ };
62
+ }, undefined, import("tailwind-variants").TVReturnType<{
63
+ isFocusVisible: {
64
+ false: string;
65
+ true: string;
66
+ };
67
+ }, undefined, "focus-ring", unknown, unknown, undefined>>>;
68
+ export type FieldGroupVariants = VariantProps<typeof fieldGroupVariants>;
69
+ //# sourceMappingURL=field-group.styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"field-group.styles.d.ts","sourceRoot":"","sources":["../../../src/components/field-group/field-group.styles.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;yDAe5B,CAAC;AAEH,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;0DAI7B,CAAC;AAEH,MAAM,MAAM,kBAAkB,GAAG,YAAY,CAAC,OAAO,kBAAkB,CAAC,CAAC"}
@@ -0,0 +1,25 @@
1
+ import { focusRing } from '../../utils/state.js';
2
+ import { tv } from 'tailwind-variants';
3
+
4
+ const fieldBorderStyles = tv({
5
+ base: "transition",
6
+ variants: {
7
+ isFocusWithin: {
8
+ false: "border-neutral-300 hover:border-neutral-400 dark:border-neutral-600 dark:hover:border-neutral-500 forced-colors:border-[ButtonBorder]",
9
+ true: "border-neutral-600 dark:border-neutral-300 forced-colors:border-[Highlight]",
10
+ },
11
+ isInvalid: {
12
+ true: "border-red-600 dark:border-red-600 forced-colors:border-[Mark]",
13
+ },
14
+ isDisabled: {
15
+ true: "border-neutral-200 dark:border-neutral-700 forced-colors:border-[GrayText]",
16
+ },
17
+ },
18
+ });
19
+ const fieldGroupVariants = tv({
20
+ extend: focusRing,
21
+ base: "field-group",
22
+ variants: fieldBorderStyles.variants,
23
+ });
24
+
25
+ export { fieldBorderStyles, fieldGroupVariants };
@@ -0,0 +1,2 @@
1
+ export * from "./field-group.styles";
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/field-group/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC"}
@@ -0,0 +1 @@
1
+ export { fieldBorderStyles, fieldGroupVariants } from './field-group.styles.js';
@@ -0,0 +1,7 @@
1
+ /* FieldGroup component styles */
2
+
3
+ /* Base field-group styles */
4
+ .field-group {
5
+ @apply flex items-center h-9 box-border;
6
+ @apply dark:bg-neutral-900 bg-field border border-borderColor-default rounded-field overflow-hidden transition;
7
+ }
@@ -0,0 +1,23 @@
1
+ @import "./button.css";
2
+ @import "./button-group.css";
3
+ @import "./calendar.css";
4
+ @import "./card.css";
5
+ @import "./checkbox-group.css";
6
+ @import "./checkbox.css";
7
+ @import "./close-button.css";
8
+ @import "./combobox.css";
9
+ @import "./date-field.css";
10
+ @import "./date-input-group.css";
11
+ @import "./date-picker.css";
12
+ @import "./date-range-picker.css";
13
+ @import "./description.css";
14
+ @import "./error-message.css";
15
+ @import "./field-error.css";
16
+ @import "./field-group.css";
17
+ @import "./input.css";
18
+ @import "./label.css";
19
+ @import "./popover.css";
20
+ @import "./range-calendar.css";
21
+ @import "./surface.css";
22
+
23
+ @import "./text-field.css";
@@ -0,0 +1,23 @@
1
+ export * from "./button";
2
+ export * from "./button-group";
3
+ export * from "./calendar";
4
+ export * from "./card";
5
+ export * from "./checkbox";
6
+ export * from "./checkbox-group";
7
+ export * from "./close-button";
8
+ export * from "./combobox";
9
+ export * from "./date-field";
10
+ export * from "./date-input-group";
11
+ export * from "./date-picker";
12
+ export * from "./date-range-picker";
13
+ export * from "./description";
14
+ export * from "./error-message";
15
+ export * from "./field-error";
16
+ export * from "./field-group";
17
+ export * from "./input";
18
+ export * from "./label";
19
+ export * from "./popover";
20
+ export * from "./range-calendar";
21
+ export * from "./surface";
22
+ export * from "./text-field";
23
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAE1B,cAAc,cAAc,CAAC"}
@@ -0,0 +1,2 @@
1
+ export * from "./input.styles";
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/input/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}
@@ -0,0 +1 @@
1
+ export { inputVariants } from './input.styles.js';
@@ -0,0 +1,31 @@
1
+ import type { VariantProps } from "tailwind-variants";
2
+ export declare const inputVariants: import("tailwind-variants").TVReturnType<{
3
+ fullWidth: {
4
+ false: string;
5
+ true: string;
6
+ };
7
+ variant: {
8
+ primary: string;
9
+ secondary: string;
10
+ };
11
+ }, undefined, "input", {
12
+ fullWidth: {
13
+ false: string;
14
+ true: string;
15
+ };
16
+ variant: {
17
+ primary: string;
18
+ secondary: string;
19
+ };
20
+ }, undefined, import("tailwind-variants").TVReturnType<{
21
+ fullWidth: {
22
+ false: string;
23
+ true: string;
24
+ };
25
+ variant: {
26
+ primary: string;
27
+ secondary: string;
28
+ };
29
+ }, undefined, "input", unknown, unknown, undefined>>;
30
+ export type InputVariants = VariantProps<typeof inputVariants>;
31
+ //# sourceMappingURL=input.styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"input.styles.d.ts","sourceRoot":"","sources":["../../../src/components/input/input.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;oDAgBxB,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC"}
@@ -0,0 +1,21 @@
1
+ import { tv } from 'tailwind-variants';
2
+
3
+ const inputVariants = tv({
4
+ base: "input",
5
+ defaultVariants: {
6
+ fullWidth: false,
7
+ variant: "primary",
8
+ },
9
+ variants: {
10
+ fullWidth: {
11
+ false: "",
12
+ true: "input--full-width",
13
+ },
14
+ variant: {
15
+ primary: "input--primary",
16
+ secondary: "input--secondary",
17
+ },
18
+ },
19
+ });
20
+
21
+ export { inputVariants };
@@ -0,0 +1,72 @@
1
+ .input {
2
+ @apply rounded-field ring ring-borderColor-default border bg-field px-3 py-2 text-base text-field-foreground outline-none placeholder:text-field-placeholder sm:text-sm;
3
+
4
+ border-width: var(--border-width-field);
5
+ border-color: var(--color-field-border);
6
+
7
+ /**
8
+ * Transitions
9
+ * CRITICAL: motion-reduce must be AFTER transition for correct override specificity
10
+ */
11
+ transition:
12
+ background-color 150ms var(--ease-smooth),
13
+ border-color 150ms var(--ease-smooth),
14
+ box-shadow 150ms var(--ease-out);
15
+ @apply motion-reduce:transition-none;
16
+
17
+ @media (hover: hover) {
18
+ &:hover:not(:focus):not(:focus-visible),
19
+ &[data-hovered="true"]:not([data-focused="true"]):not(
20
+ [data-focus-visible="true"]
21
+ ) {
22
+ @apply bg-field-hover;
23
+ border-color: var(--color-field-border-hover);
24
+ }
25
+ }
26
+
27
+ /* Focus state */
28
+ &:focus,
29
+ &[data-focused="true"]:not([data-invalid="true"]) {
30
+ @apply status-focused-field;
31
+ background-color: var(--color-field-focus);
32
+ }
33
+
34
+ /* Focus visible state */
35
+ &:focus-visible:not(:focus),
36
+ &[data-focus-visible="true"] {
37
+ }
38
+
39
+ /* Disabled state */
40
+ &[data-disabled="true"],
41
+ &[aria-disabled="true"] {
42
+ @apply status-disabled;
43
+ }
44
+
45
+ &[data-invalid="true"] {
46
+ @apply status-invalid-field!;
47
+ }
48
+ }
49
+
50
+ /* Variant property definitions */
51
+ .input--primary {
52
+ /* Default styles */
53
+ }
54
+
55
+ .input--secondary {
56
+ background-color: var(--input-bg);
57
+
58
+ --input-bg-hover: var(--color-default-hover);
59
+ --input-bg-focus: var(--color-default);
60
+
61
+ &:focus,
62
+ &[data-focused="true"]:not([data-invalid="true"]) {
63
+ @apply ring-2 ring-input-secondary-ring ring-offset-0 outline-none;
64
+ /* No separation - ring sits directly against the element */
65
+ --tw-ring-offset-width: 0px;
66
+ }
67
+ }
68
+
69
+ /* Full width modifier */
70
+ .input--full-width {
71
+ @apply w-full;
72
+ }
@@ -0,0 +1,2 @@
1
+ export * from "./label.styles";
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/label/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}
@@ -0,0 +1 @@
1
+ export { labelVariants } from './label.styles.js';
@@ -0,0 +1,34 @@
1
+ import type { VariantProps } from "tailwind-variants";
2
+ export declare const labelVariants: import("tailwind-variants").TVReturnType<{
3
+ isDisabled: {
4
+ true: string;
5
+ };
6
+ isInvalid: {
7
+ true: string;
8
+ };
9
+ isRequired: {
10
+ true: string;
11
+ };
12
+ }, undefined, "label", {
13
+ isDisabled: {
14
+ true: string;
15
+ };
16
+ isInvalid: {
17
+ true: string;
18
+ };
19
+ isRequired: {
20
+ true: string;
21
+ };
22
+ }, undefined, import("tailwind-variants").TVReturnType<{
23
+ isDisabled: {
24
+ true: string;
25
+ };
26
+ isInvalid: {
27
+ true: string;
28
+ };
29
+ isRequired: {
30
+ true: string;
31
+ };
32
+ }, undefined, "label", unknown, unknown, undefined>>;
33
+ export type LabelVariants = VariantProps<typeof labelVariants>;
34
+ //# sourceMappingURL=label.styles.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"label.styles.d.ts","sourceRoot":"","sources":["../../../src/components/label/label.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;oDAkBxB,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC"}