@pathscale/ui 1.1.34 → 1.1.35

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 (249) hide show
  1. package/dist/components/button/Button.css +10 -1
  2. package/dist/components/button/Button.d.ts +2 -0
  3. package/dist/components/button/Button.js +31 -6
  4. package/dist/components/button-group/ButtonGroup.css +117 -0
  5. package/dist/components/button-group/ButtonGroup.d.ts +23 -0
  6. package/dist/components/button-group/ButtonGroup.js +91 -0
  7. package/dist/components/button-group/context.d.ts +8 -0
  8. package/dist/components/button-group/context.js +3 -0
  9. package/dist/components/button-group/index.d.ts +1 -0
  10. package/dist/components/button-group/index.js +6 -0
  11. package/dist/components/card/Card.css +110 -0
  12. package/dist/components/card/Card.d.ts +26 -26
  13. package/dist/components/card/Card.js +131 -70
  14. package/dist/components/card/index.d.ts +1 -1
  15. package/dist/components/card/index.js +6 -1
  16. package/dist/components/checkbox/Checkbox.js +18 -4
  17. package/dist/components/checkbox-group/CheckboxGroup.css +10 -0
  18. package/dist/components/checkbox-group/CheckboxGroup.d.ts +18 -0
  19. package/dist/components/checkbox-group/CheckboxGroup.js +97 -0
  20. package/dist/components/checkbox-group/context.d.ts +11 -0
  21. package/dist/components/checkbox-group/context.js +3 -0
  22. package/dist/components/checkbox-group/index.d.ts +4 -0
  23. package/dist/components/checkbox-group/index.js +4 -0
  24. package/dist/components/chip/Chip.css +11 -9
  25. package/dist/components/chip/Chip.d.ts +2 -2
  26. package/dist/components/chip/Chip.js +38 -30
  27. package/dist/components/close-button/CloseButton.css +81 -0
  28. package/dist/components/close-button/CloseButton.d.ts +14 -0
  29. package/dist/components/close-button/CloseButton.js +76 -0
  30. package/dist/components/close-button/index.d.ts +1 -0
  31. package/dist/components/close-button/index.js +3 -0
  32. package/dist/components/combo-box/ComboBox.css +344 -0
  33. package/dist/components/combo-box/ComboBox.d.ts +86 -0
  34. package/dist/components/combo-box/ComboBox.js +708 -0
  35. package/dist/components/combo-box/index.d.ts +1 -0
  36. package/dist/components/combo-box/index.js +10 -0
  37. package/dist/components/date-field/DateField.css +215 -0
  38. package/dist/components/date-field/DateField.d.ts +64 -0
  39. package/dist/components/date-field/DateField.js +341 -0
  40. package/dist/components/date-field/index.d.ts +1 -0
  41. package/dist/components/date-field/index.js +11 -0
  42. package/dist/components/description/Description.css +10 -0
  43. package/dist/components/description/Description.d.ts +11 -0
  44. package/dist/components/{form/Label.js → description/Description.js} +23 -14
  45. package/dist/components/description/index.d.ts +1 -0
  46. package/dist/components/description/index.js +5 -0
  47. package/dist/components/drawer/Drawer.css +15 -0
  48. package/dist/components/drawer/Drawer.d.ts +2 -0
  49. package/dist/components/drawer/Drawer.js +24 -16
  50. package/dist/components/error-message/ErrorMessage.css +20 -0
  51. package/dist/components/error-message/ErrorMessage.d.ts +11 -0
  52. package/dist/components/error-message/ErrorMessage.js +40 -0
  53. package/dist/components/error-message/index.d.ts +1 -0
  54. package/dist/components/error-message/index.js +5 -0
  55. package/dist/components/field-error/FieldError.css +27 -0
  56. package/dist/components/field-error/FieldError.d.ts +21 -0
  57. package/dist/components/field-error/FieldError.js +69 -0
  58. package/dist/components/field-error/index.d.ts +1 -0
  59. package/dist/components/field-error/index.js +5 -0
  60. package/dist/components/fieldset/Fieldset.css +30 -0
  61. package/dist/components/fieldset/Fieldset.d.ts +22 -9
  62. package/dist/components/fieldset/Fieldset.js +88 -44
  63. package/dist/components/fieldset/index.d.ts +1 -2
  64. package/dist/components/fieldset/index.js +7 -2
  65. package/dist/components/form/Form.css +5 -0
  66. package/dist/components/form/Form.d.ts +10 -16
  67. package/dist/components/form/Form.js +33 -16
  68. package/dist/components/form/index.d.ts +1 -4
  69. package/dist/components/form/index.js +3 -4
  70. package/dist/components/header/Header.css +13 -0
  71. package/dist/components/header/Header.d.ts +9 -0
  72. package/dist/components/{menu/MenuDetails.js → header/Header.js} +17 -20
  73. package/dist/components/header/index.d.ts +1 -0
  74. package/dist/components/header/index.js +5 -0
  75. package/dist/components/immersive-landing/components/FirefoxPWABanner.js +62 -68
  76. package/dist/components/immersive-landing/components/PWAInstallPrompt.js +58 -64
  77. package/dist/components/input/Input.css +3 -2
  78. package/dist/components/input/Input.d.ts +2 -2
  79. package/dist/components/input/Input.js +7 -7
  80. package/dist/components/input-group/InputGroup.css +172 -0
  81. package/dist/components/input-group/InputGroup.d.ts +44 -0
  82. package/dist/components/input-group/InputGroup.js +227 -0
  83. package/dist/components/input-group/index.d.ts +1 -0
  84. package/dist/components/input-group/index.js +9 -0
  85. package/dist/components/input-otp/InputOTP.css +170 -0
  86. package/dist/components/input-otp/InputOTP.d.ts +46 -0
  87. package/dist/components/input-otp/InputOTP.js +385 -0
  88. package/dist/components/input-otp/index.d.ts +1 -0
  89. package/dist/components/input-otp/index.js +11 -0
  90. package/dist/components/label/Label.css +30 -0
  91. package/dist/components/label/Label.d.ts +17 -0
  92. package/dist/components/label/Label.js +64 -0
  93. package/dist/components/label/index.d.ts +1 -0
  94. package/dist/components/label/index.js +5 -0
  95. package/dist/components/list-box/ListBox.css +148 -0
  96. package/dist/components/list-box/ListBox.d.ts +23 -0
  97. package/dist/components/list-box/ListBox.js +224 -0
  98. package/dist/components/list-box/ListBoxItem.d.ts +28 -0
  99. package/dist/components/list-box/ListBoxItem.js +231 -0
  100. package/dist/components/list-box/ListBoxSection.d.ts +11 -0
  101. package/dist/components/list-box/ListBoxSection.js +48 -0
  102. package/dist/components/list-box/context.d.ts +27 -0
  103. package/dist/components/list-box/context.js +3 -0
  104. package/dist/components/list-box/index.d.ts +17 -0
  105. package/dist/components/list-box/index.js +17 -0
  106. package/dist/components/menu/Menu.css +199 -0
  107. package/dist/components/menu/Menu.d.ts +32 -20
  108. package/dist/components/menu/Menu.js +213 -39
  109. package/dist/components/menu/MenuItem.d.ts +35 -5
  110. package/dist/components/menu/MenuItem.js +270 -19
  111. package/dist/components/menu/MenuSection.d.ts +11 -0
  112. package/dist/components/menu/MenuSection.js +48 -0
  113. package/dist/components/menu/context.d.ts +26 -0
  114. package/dist/components/menu/context.js +3 -0
  115. package/dist/components/menu/index.d.ts +4 -3
  116. package/dist/components/menu/index.js +11 -2
  117. package/dist/components/number-field/NumberField.css +198 -0
  118. package/dist/components/number-field/NumberField.d.ts +48 -0
  119. package/dist/components/number-field/NumberField.js +350 -0
  120. package/dist/components/number-field/index.d.ts +1 -0
  121. package/dist/components/number-field/index.js +9 -0
  122. package/dist/components/search-field/SearchField.css +183 -0
  123. package/dist/components/search-field/SearchField.d.ts +53 -0
  124. package/dist/components/search-field/SearchField.js +303 -0
  125. package/dist/components/search-field/index.d.ts +1 -0
  126. package/dist/components/search-field/index.js +9 -0
  127. package/dist/components/select/Select.css +16 -10
  128. package/dist/components/select/Select.d.ts +10 -2
  129. package/dist/components/select/Select.js +119 -33
  130. package/dist/components/separator/Separator.css +35 -0
  131. package/dist/components/separator/Separator.d.ts +12 -0
  132. package/dist/components/separator/Separator.js +57 -0
  133. package/dist/components/separator/index.d.ts +1 -0
  134. package/dist/components/separator/index.js +4 -0
  135. package/dist/components/sidenav/Sidenav.js +2 -2
  136. package/dist/components/surface/Surface.css +37 -0
  137. package/dist/components/surface/Surface.d.ts +12 -0
  138. package/dist/components/surface/Surface.js +41 -0
  139. package/dist/components/surface/index.d.ts +1 -0
  140. package/dist/components/surface/index.js +4 -0
  141. package/dist/components/table/hooks/index.d.ts +1 -9
  142. package/dist/components/table/hooks/index.js +1 -18
  143. package/dist/components/tag/Tag.css +121 -0
  144. package/dist/components/tag/Tag.d.ts +33 -0
  145. package/dist/components/tag/Tag.js +241 -0
  146. package/dist/components/tag/index.d.ts +1 -0
  147. package/dist/components/tag/index.js +6 -0
  148. package/dist/components/tag-group/TagGroup.css +22 -0
  149. package/dist/components/tag-group/TagGroup.d.ts +32 -0
  150. package/dist/components/tag-group/TagGroup.js +177 -0
  151. package/dist/components/tag-group/context.d.ts +15 -0
  152. package/dist/components/tag-group/context.js +3 -0
  153. package/dist/components/tag-group/index.d.ts +2 -0
  154. package/dist/components/tag-group/index.js +6 -0
  155. package/dist/components/text/Text.css +66 -0
  156. package/dist/components/text/Text.d.ts +17 -0
  157. package/dist/components/text/Text.js +46 -0
  158. package/dist/components/text/index.d.ts +1 -0
  159. package/dist/components/text/index.js +5 -0
  160. package/dist/components/text-area/TextArea.css +95 -0
  161. package/dist/components/text-area/TextArea.d.ts +19 -0
  162. package/dist/components/text-area/TextArea.js +64 -0
  163. package/dist/components/text-area/index.d.ts +1 -0
  164. package/dist/components/text-area/index.js +5 -0
  165. package/dist/components/text-field/TextField.css +33 -0
  166. package/dist/components/text-field/TextField.d.ts +34 -0
  167. package/dist/components/text-field/TextField.js +85 -0
  168. package/dist/components/text-field/index.d.ts +1 -0
  169. package/dist/components/text-field/index.js +7 -0
  170. package/dist/components/textarea/Textarea.d.ts +8 -13
  171. package/dist/components/textarea/Textarea.js +14 -45
  172. package/dist/components/textarea/index.d.ts +2 -1
  173. package/dist/components/textarea/index.js +4 -1
  174. package/dist/components/time-field/TimeField.css +215 -0
  175. package/dist/components/time-field/TimeField.d.ts +64 -0
  176. package/dist/components/time-field/TimeField.js +341 -0
  177. package/dist/components/time-field/index.d.ts +1 -0
  178. package/dist/components/time-field/index.js +11 -0
  179. package/dist/components/utils.d.ts +2 -2
  180. package/dist/components/utils.js +3 -17
  181. package/dist/hooks/form/index.d.ts +5 -0
  182. package/dist/hooks/form/index.js +12 -0
  183. package/dist/hooks/form/useField.d.ts +11 -0
  184. package/dist/hooks/form/useField.js +20 -0
  185. package/dist/hooks/form/useFieldError.d.ts +3 -0
  186. package/dist/hooks/form/useFieldError.js +3 -0
  187. package/dist/hooks/form/useFieldMeta.d.ts +20 -0
  188. package/dist/hooks/form/useFieldMeta.js +49 -0
  189. package/dist/hooks/form/useFieldProps.d.ts +10 -0
  190. package/dist/hooks/form/useFieldProps.js +51 -0
  191. package/dist/hooks/form/useForm.d.ts +27 -0
  192. package/dist/hooks/form/useForm.js +54 -0
  193. package/dist/hooks/form/utils.d.ts +4 -0
  194. package/dist/hooks/form/utils.js +30 -0
  195. package/dist/hooks/layout/index.d.ts +1 -0
  196. package/dist/hooks/layout/index.js +3 -0
  197. package/dist/hooks/layout/useDesktop.d.ts +1 -0
  198. package/dist/hooks/layout/useDesktop.js +17 -0
  199. package/dist/hooks/table/index.d.ts +9 -0
  200. package/dist/hooks/table/index.js +18 -0
  201. package/dist/index.d.ts +59 -7
  202. package/dist/index.js +140 -15
  203. package/dist/styles/icons/generated-icons.css +1 -1
  204. package/package.json +1 -1
  205. package/dist/components/card/CardActions.d.ts +0 -4
  206. package/dist/components/card/CardActions.js +0 -15
  207. package/dist/components/card/CardBody.d.ts +0 -4
  208. package/dist/components/card/CardBody.js +0 -15
  209. package/dist/components/card/CardImage.d.ts +0 -3
  210. package/dist/components/card/CardImage.js +0 -10
  211. package/dist/components/card/CardTitle.d.ts +0 -6
  212. package/dist/components/card/CardTitle.js +0 -13
  213. package/dist/components/card/card.css +0 -171
  214. package/dist/components/form/FormBase.d.ts +0 -8
  215. package/dist/components/form/FormBase.js +0 -74
  216. package/dist/components/form/FormDropdown.d.ts +0 -25
  217. package/dist/components/form/FormDropdown.js +0 -139
  218. package/dist/components/form/FormField.d.ts +0 -14
  219. package/dist/components/form/FormField.js +0 -78
  220. package/dist/components/form/Label.d.ts +0 -7
  221. package/dist/components/form/NumberField.d.ts +0 -20
  222. package/dist/components/form/NumberField.js +0 -109
  223. package/dist/components/form/PasswordField.d.ts +0 -16
  224. package/dist/components/form/PasswordField.js +0 -113
  225. package/dist/components/form/ValidatedForm.d.ts +0 -26
  226. package/dist/components/form/ValidatedForm.js +0 -55
  227. package/dist/components/menu/MenuDetails.d.ts +0 -8
  228. package/dist/components/menu/MenuDropdown.d.ts +0 -12
  229. package/dist/components/menu/MenuDropdown.js +0 -48
  230. package/dist/components/menu/MenuTitle.d.ts +0 -8
  231. package/dist/components/menu/MenuTitle.js +0 -22
  232. package/dist/components/menu/menu.css +0 -364
  233. package/dist/components/textarea/textarea.css +0 -191
  234. /package/dist/{components/table/hooks → hooks/table}/helpers.d.ts +0 -0
  235. /package/dist/{components/table/hooks → hooks/table}/helpers.js +0 -0
  236. /package/dist/{components/table/hooks → hooks/table}/useAnchoredOverlayPosition.d.ts +0 -0
  237. /package/dist/{components/table/hooks → hooks/table}/useAnchoredOverlayPosition.js +0 -0
  238. /package/dist/{components/table/hooks → hooks/table}/useTableExpansion.d.ts +0 -0
  239. /package/dist/{components/table/hooks → hooks/table}/useTableExpansion.js +0 -0
  240. /package/dist/{components/table/hooks → hooks/table}/useTableFiltering.d.ts +0 -0
  241. /package/dist/{components/table/hooks → hooks/table}/useTableFiltering.js +0 -0
  242. /package/dist/{components/table/hooks → hooks/table}/useTableModel.d.ts +0 -0
  243. /package/dist/{components/table/hooks → hooks/table}/useTableModel.js +0 -0
  244. /package/dist/{components/table/hooks → hooks/table}/useTablePagination.d.ts +0 -0
  245. /package/dist/{components/table/hooks → hooks/table}/useTablePagination.js +0 -0
  246. /package/dist/{components/table/hooks → hooks/table}/useTableSelection.d.ts +0 -0
  247. /package/dist/{components/table/hooks → hooks/table}/useTableSelection.js +0 -0
  248. /package/dist/{components/table/hooks → hooks/table}/useTableSorting.d.ts +0 -0
  249. /package/dist/{components/table/hooks → hooks/table}/useTableSorting.js +0 -0
@@ -1,73 +1,57 @@
1
1
  import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
2
- import "./card.css";
3
- import * as __WEBPACK_EXTERNAL_MODULE_clsx__ from "clsx";
2
+ import "./Card.css";
4
3
  import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
5
4
  import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
6
- import * as __WEBPACK_EXTERNAL_MODULE__CardActions_js_327b246f__ from "./CardActions.js";
7
- import * as __WEBPACK_EXTERNAL_MODULE__CardBody_js_3648715c__ from "./CardBody.js";
8
- import * as __WEBPACK_EXTERNAL_MODULE__CardImage_js_0ac1c65a__ from "./CardImage.js";
9
- import * as __WEBPACK_EXTERNAL_MODULE__CardTitle_js_a12d15c2__ from "./CardTitle.js";
10
5
  var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>");
11
- const DYNAMIC_MODIFIERS = {
12
- side: {
13
- true: "card-side",
14
- xs: "card-side-xs",
15
- sm: "card-side-sm",
16
- md: "card-side-md",
17
- lg: "card-side-lg"
18
- }
6
+ const CARD_VARIANT_CLASS = {
7
+ default: "card--default",
8
+ flat: "card--flat",
9
+ bordered: "card--bordered",
10
+ shadow: "card--shadow"
19
11
  };
20
- const Card = (props)=>{
12
+ const invokeEventHandler = (handler, event)=>{
13
+ if ("function" == typeof handler) return void handler(event);
14
+ if (Array.isArray(handler) && "function" == typeof handler[0]) handler[0](handler[1], event);
15
+ };
16
+ const CardRoot = (props)=>{
21
17
  const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
22
- "size",
23
- "border",
24
- "variant",
25
- "imageFull",
26
- "side",
27
- "background",
28
- "shadow",
29
- "fullWidth",
18
+ "children",
30
19
  "class",
31
20
  "className",
32
21
  "dataTheme",
33
22
  "style",
34
- "aria-label",
35
- "aria-describedby",
36
- "aria-labelledby",
37
- "role"
23
+ "variant",
24
+ "isHoverable",
25
+ "isPressable",
26
+ "onKeyDown",
27
+ "role",
28
+ "tabIndex"
38
29
  ]);
39
- const classes = (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("card", local.class, local.className, (0, __WEBPACK_EXTERNAL_MODULE_clsx__.clsx)({
40
- "w-full": local.fullWidth,
41
- "shadow-sm": "sm" === local.shadow,
42
- "shadow-md": "md" === local.shadow,
43
- "shadow-lg": "lg" === local.shadow,
44
- "shadow-xl": "xl" === local.shadow,
45
- "shadow-none": "none" === local.shadow,
46
- "bg-base-100": "base-100" === local.background,
47
- "bg-base-200": "base-200" === local.background,
48
- "bg-base-300": "base-300" === local.background,
49
- "bg-primary": "primary" === local.background,
50
- "bg-secondary": "secondary" === local.background,
51
- "bg-accent": "accent" === local.background,
52
- "bg-neutral": "neutral" === local.background,
53
- "bg-info": "info" === local.background,
54
- "bg-success": "success" === local.background,
55
- "bg-warning": "warning" === local.background,
56
- "bg-error": "error" === local.background,
57
- "card-xl": "xl" === local.size,
58
- "card-lg": "lg" === local.size,
59
- "card-md": "md" === local.size,
60
- "card-sm": "sm" === local.size,
61
- "card-xs": "xs" === local.size,
62
- "card-dash": "dash" === local.variant,
63
- "card-border": false !== local.border || "outline" === local.variant || "border" === local.variant,
64
- "image-full": local.imageFull,
65
- [DYNAMIC_MODIFIERS.side[local.side?.toString()] ?? ""]: !!local.side
66
- }));
30
+ const variant = ()=>local.variant ?? "default";
31
+ const handleKeyDown = (event)=>{
32
+ invokeEventHandler(local.onKeyDown, event);
33
+ if (event.defaultPrevented || !local.isPressable) return;
34
+ if ("Enter" !== event.key && " " !== event.key) return;
35
+ if (event.target !== event.currentTarget) return;
36
+ event.preventDefault();
37
+ event.currentTarget.click();
38
+ };
67
39
  return (()=>{
68
40
  var _el$ = _tmpl$();
69
41
  (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
70
- class: classes,
42
+ get ["class"] () {
43
+ return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("card", CARD_VARIANT_CLASS[variant()], local.isHoverable && "card--hoverable", local.isPressable && "card--pressable", local.class, local.className);
44
+ },
45
+ "data-slot": "card",
46
+ get ["data-variant"] () {
47
+ return variant();
48
+ },
49
+ get ["data-hoverable"] () {
50
+ return local.isHoverable ? "true" : "false";
51
+ },
52
+ get ["data-pressable"] () {
53
+ return local.isPressable ? "true" : "false";
54
+ },
71
55
  get ["data-theme"] () {
72
56
  return local.dataTheme;
73
57
  },
@@ -75,24 +59,101 @@ const Card = (props)=>{
75
59
  return local.style;
76
60
  },
77
61
  get role () {
78
- return local.role;
62
+ return local.role ?? (local.isPressable ? "button" : void 0);
79
63
  },
80
- get ["aria-label"] () {
81
- return local["aria-label"];
64
+ get tabIndex () {
65
+ return local.tabIndex ?? (local.isPressable ? 0 : void 0);
66
+ },
67
+ onKeyDown: handleKeyDown
68
+ }), false, true);
69
+ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, ()=>local.children);
70
+ return _el$;
71
+ })();
72
+ };
73
+ const CardHeader = (props)=>{
74
+ const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
75
+ "children",
76
+ "class",
77
+ "className",
78
+ "dataTheme",
79
+ "style"
80
+ ]);
81
+ return (()=>{
82
+ var _el$2 = _tmpl$();
83
+ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$2, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
84
+ get ["class"] () {
85
+ return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("card__header", local.class, local.className);
82
86
  },
83
- get ["aria-describedby"] () {
84
- return local["aria-describedby"];
87
+ "data-slot": "card-header",
88
+ get ["data-theme"] () {
89
+ return local.dataTheme;
85
90
  },
86
- get ["aria-labelledby"] () {
87
- return local["aria-labelledby"];
91
+ get style () {
92
+ return local.style;
88
93
  }
89
- }), false, false);
90
- return _el$;
94
+ }), false, true);
95
+ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, ()=>local.children);
96
+ return _el$2;
97
+ })();
98
+ };
99
+ const CardBody = (props)=>{
100
+ const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
101
+ "children",
102
+ "class",
103
+ "className",
104
+ "dataTheme",
105
+ "style"
106
+ ]);
107
+ return (()=>{
108
+ var _el$3 = _tmpl$();
109
+ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$3, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
110
+ get ["class"] () {
111
+ return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("card__body", local.class, local.className);
112
+ },
113
+ "data-slot": "card-body",
114
+ get ["data-theme"] () {
115
+ return local.dataTheme;
116
+ },
117
+ get style () {
118
+ return local.style;
119
+ }
120
+ }), false, true);
121
+ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$3, ()=>local.children);
122
+ return _el$3;
123
+ })();
124
+ };
125
+ const CardFooter = (props)=>{
126
+ const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
127
+ "children",
128
+ "class",
129
+ "className",
130
+ "dataTheme",
131
+ "style"
132
+ ]);
133
+ return (()=>{
134
+ var _el$4 = _tmpl$();
135
+ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$4, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
136
+ get ["class"] () {
137
+ return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("card__footer", local.class, local.className);
138
+ },
139
+ "data-slot": "card-footer",
140
+ get ["data-theme"] () {
141
+ return local.dataTheme;
142
+ },
143
+ get style () {
144
+ return local.style;
145
+ }
146
+ }), false, true);
147
+ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$4, ()=>local.children);
148
+ return _el$4;
91
149
  })();
92
150
  };
93
- Card.Actions = __WEBPACK_EXTERNAL_MODULE__CardActions_js_327b246f__["default"];
94
- Card.Body = __WEBPACK_EXTERNAL_MODULE__CardBody_js_3648715c__["default"];
95
- Card.Title = __WEBPACK_EXTERNAL_MODULE__CardTitle_js_a12d15c2__["default"];
96
- Card.Image = __WEBPACK_EXTERNAL_MODULE__CardImage_js_0ac1c65a__["default"];
151
+ const Card = Object.assign(CardRoot, {
152
+ Root: CardRoot,
153
+ Header: CardHeader,
154
+ Body: CardBody,
155
+ Content: CardBody,
156
+ Footer: CardFooter
157
+ });
97
158
  const card_Card = Card;
98
- export { card_Card as default };
159
+ export { Card, CardBody, CardFooter, CardHeader, CardRoot, card_Card as default };
@@ -1 +1 @@
1
- export { default, type CardProps } from "./Card";
1
+ export { default, Card, CardRoot, CardHeader, CardBody, CardFooter, type CardProps, type CardVariant, type CardRootProps, type CardHeaderProps, type CardBodyProps, type CardFooterProps, } from "./Card";
@@ -1,3 +1,8 @@
1
1
  import * as __WEBPACK_EXTERNAL_MODULE__Card_js_d67c086a__ from "./Card.js";
2
+ var __webpack_exports__Card = __WEBPACK_EXTERNAL_MODULE__Card_js_d67c086a__.Card;
3
+ var __webpack_exports__CardBody = __WEBPACK_EXTERNAL_MODULE__Card_js_d67c086a__.CardBody;
4
+ var __webpack_exports__CardFooter = __WEBPACK_EXTERNAL_MODULE__Card_js_d67c086a__.CardFooter;
5
+ var __webpack_exports__CardHeader = __WEBPACK_EXTERNAL_MODULE__Card_js_d67c086a__.CardHeader;
6
+ var __webpack_exports__CardRoot = __WEBPACK_EXTERNAL_MODULE__Card_js_d67c086a__.CardRoot;
2
7
  var __webpack_exports__default = __WEBPACK_EXTERNAL_MODULE__Card_js_d67c086a__["default"];
3
- export { __webpack_exports__default as default };
8
+ export { __webpack_exports__Card as Card, __webpack_exports__CardBody as CardBody, __webpack_exports__CardFooter as CardFooter, __webpack_exports__CardHeader as CardHeader, __webpack_exports__CardRoot as CardRoot, __webpack_exports__default as default };
@@ -2,6 +2,7 @@ import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web
2
2
  import "./Checkbox.css";
3
3
  import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
4
4
  import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
5
+ import * as __WEBPACK_EXTERNAL_MODULE__checkbox_group_context_js_31d5d7d2__ from "../checkbox-group/context.js";
5
6
  var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<svg aria-hidden=true data-slot=checkbox-default-indicator--indeterminate fill=none role=presentation stroke=currentColor stroke-linecap=round stroke-width=3 viewBox="0 0 24 24"><line x1=21 x2=3 y1=12 y2=12>'), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<span data-slot=label>"), _tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<span class=checkbox__description data-slot=description>"), _tmpl$4 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<span class=checkbox__content data-slot=checkbox-content>"), _tmpl$5 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<label data-slot=checkbox><input><span class=checkbox__control data-slot=checkbox-control aria-hidden=true><span class=checkbox__indicator data-slot=checkbox-indicator>"), _tmpl$6 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<svg aria-hidden=true data-slot=checkbox-default-indicator--checkmark fill=none role=presentation stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 viewBox="0 0 17 18"><polyline points="1 9 7 14 15 4">');
6
7
  const invokeEventHandler = (handler, event)=>{
7
8
  if ("function" == typeof handler) return void handler(event);
@@ -13,6 +14,7 @@ const VARIANT_CLASS_MAP = {
13
14
  };
14
15
  const Checkbox_Checkbox = (props)=>{
15
16
  let inputRef;
17
+ const group = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.useContext)(__WEBPACK_EXTERNAL_MODULE__checkbox_group_context_js_31d5d7d2__.CheckboxGroupContext);
16
18
  const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
17
19
  "class",
18
20
  "className",
@@ -25,6 +27,8 @@ const Checkbox_Checkbox = (props)=>{
25
27
  "variant",
26
28
  "checked",
27
29
  "defaultChecked",
30
+ "value",
31
+ "name",
28
32
  "disabled",
29
33
  "onChange",
30
34
  "dataTheme",
@@ -32,11 +36,14 @@ const Checkbox_Checkbox = (props)=>{
32
36
  ]);
33
37
  const [internalSelected, setInternalSelected] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(Boolean(local.defaultChecked));
34
38
  const isControlled = ()=>void 0 !== local.checked;
35
- const isSelected = ()=>isControlled() ? Boolean(local.checked) : internalSelected();
36
- const isDisabled = ()=>Boolean(local.isDisabled) || Boolean(local.disabled);
37
- const isInvalid = ()=>Boolean(local.isInvalid) || Boolean(local["aria-invalid"]);
39
+ const optionValue = ()=>null != local.value ? String(local.value) : void 0;
40
+ const isGrouped = ()=>Boolean(group && void 0 !== optionValue());
41
+ const isSelected = ()=>isGrouped() ? Boolean(group?.value().includes(optionValue())) : isControlled() ? Boolean(local.checked) : internalSelected();
42
+ const isDisabled = ()=>Boolean(local.isDisabled) || Boolean(local.disabled) || Boolean(group?.isDisabled());
43
+ const isInvalid = ()=>Boolean(local.isInvalid) || Boolean(local["aria-invalid"]) || Boolean(group?.isInvalid());
38
44
  const isIndeterminate = ()=>Boolean(local.isIndeterminate) || Boolean(local.indeterminate);
39
- const variant = ()=>local.variant ?? "primary";
45
+ const variant = ()=>local.variant ?? group?.variant() ?? "primary";
46
+ const name = ()=>local.name ?? group?.name();
40
47
  const hasContent = ()=>null != local.children || null != local.description;
41
48
  (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createEffect)(()=>{
42
49
  if (!inputRef) return;
@@ -46,6 +53,7 @@ const Checkbox_Checkbox = (props)=>{
46
53
  invokeEventHandler(local.onChange, event);
47
54
  if (event.defaultPrevented) return;
48
55
  if (isDisabled()) return;
56
+ if (group && void 0 !== optionValue()) return void group.toggleValue(optionValue(), event.currentTarget.checked, event);
49
57
  if (!isControlled()) setInternalSelected(event.currentTarget.checked);
50
58
  };
51
59
  return (()=>{
@@ -57,6 +65,12 @@ const Checkbox_Checkbox = (props)=>{
57
65
  type: "checkbox",
58
66
  class: "checkbox__input",
59
67
  "data-slot": "checkbox-input",
68
+ get value () {
69
+ return local.value;
70
+ },
71
+ get name () {
72
+ return name();
73
+ },
60
74
  get checked () {
61
75
  return isSelected();
62
76
  },
@@ -0,0 +1,10 @@
1
+ @layer components {
2
+ .checkbox-group {
3
+ display: flex;
4
+ flex-direction: column;
5
+ }
6
+
7
+ .checkbox-group [data-slot="checkbox"] {
8
+ margin-top: 1rem;
9
+ }
10
+ }
@@ -0,0 +1,18 @@
1
+ import "./CheckboxGroup.css";
2
+ import { type Component, type JSX } from "solid-js";
3
+ import type { CheckboxVariant } from "../checkbox";
4
+ import type { IComponentBaseProps } from "../types";
5
+ export type CheckboxGroupVariant = CheckboxVariant;
6
+ export type CheckboxGroupProps = Omit<JSX.HTMLAttributes<HTMLDivElement>, "children" | "onChange"> & IComponentBaseProps & {
7
+ children?: JSX.Element | ((values: string[]) => JSX.Element);
8
+ value?: string[];
9
+ defaultValue?: string[];
10
+ onChange?: (value: string[]) => void;
11
+ name?: string;
12
+ isDisabled?: boolean;
13
+ disabled?: boolean;
14
+ isInvalid?: boolean;
15
+ variant?: CheckboxGroupVariant;
16
+ };
17
+ declare const CheckboxGroup: Component<CheckboxGroupProps>;
18
+ export default CheckboxGroup;
@@ -0,0 +1,97 @@
1
+ import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
2
+ import "./CheckboxGroup.css";
3
+ import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
4
+ import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
5
+ import * as __WEBPACK_EXTERNAL_MODULE__context_js_80e2871f__ from "./context.js";
6
+ var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>");
7
+ const VARIANT_CLASS_MAP = {
8
+ primary: "checkbox-group--primary",
9
+ secondary: "checkbox-group--secondary"
10
+ };
11
+ const CheckboxGroup = (props)=>{
12
+ const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
13
+ "children",
14
+ "class",
15
+ "className",
16
+ "dataTheme",
17
+ "style",
18
+ "value",
19
+ "defaultValue",
20
+ "onChange",
21
+ "name",
22
+ "isDisabled",
23
+ "disabled",
24
+ "isInvalid",
25
+ "variant",
26
+ "role"
27
+ ]);
28
+ const [internalValue, setInternalValue] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(local.defaultValue ?? []);
29
+ const isControlled = ()=>void 0 !== local.value;
30
+ const selectedValues = ()=>isControlled() ? local.value ?? [] : internalValue();
31
+ const variant = ()=>local.variant ?? "primary";
32
+ const isDisabled = ()=>Boolean(local.isDisabled) || Boolean(local.disabled);
33
+ const isInvalid = ()=>Boolean(local.isInvalid);
34
+ const handleToggle = (optionValue, checked)=>{
35
+ const currentValues = selectedValues();
36
+ const nextValues = checked ? currentValues.includes(optionValue) ? currentValues : [
37
+ ...currentValues,
38
+ optionValue
39
+ ] : currentValues.filter((value)=>value !== optionValue);
40
+ if (!isControlled()) setInternalValue(nextValues);
41
+ local.onChange?.(nextValues);
42
+ };
43
+ const contextValue = {
44
+ value: selectedValues,
45
+ name: ()=>local.name,
46
+ variant,
47
+ isDisabled,
48
+ isInvalid,
49
+ toggleValue: (optionValue, checked, event)=>{
50
+ if (event.defaultPrevented || isDisabled()) return;
51
+ handleToggle(optionValue, checked);
52
+ }
53
+ };
54
+ return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__context_js_80e2871f__.CheckboxGroupContext.Provider, {
55
+ value: contextValue,
56
+ get children () {
57
+ var _el$ = _tmpl$();
58
+ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
59
+ get role () {
60
+ return local.role ?? "group";
61
+ },
62
+ get ["aria-disabled"] () {
63
+ return isDisabled() ? "true" : void 0;
64
+ },
65
+ get ["aria-invalid"] () {
66
+ return isInvalid() ? "true" : void 0;
67
+ },
68
+ "data-slot": "checkbox-group",
69
+ get ["data-variant"] () {
70
+ return variant();
71
+ },
72
+ get ["data-disabled"] () {
73
+ return isDisabled() ? "true" : "false";
74
+ },
75
+ get ["data-invalid"] () {
76
+ return isInvalid() ? "true" : "false";
77
+ },
78
+ get ["class"] () {
79
+ return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("checkbox-group", VARIANT_CLASS_MAP[variant()], isDisabled() && "checkbox-group--disabled", isInvalid() && "checkbox-group--invalid", local.class, local.className);
80
+ },
81
+ get ["data-theme"] () {
82
+ return local.dataTheme;
83
+ },
84
+ get style () {
85
+ return local.style;
86
+ }
87
+ }), false, true);
88
+ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (()=>{
89
+ var _c$ = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>"function" == typeof local.children);
90
+ return ()=>_c$() ? local.children(selectedValues()) : local.children;
91
+ })());
92
+ return _el$;
93
+ }
94
+ });
95
+ };
96
+ const checkbox_group_CheckboxGroup = CheckboxGroup;
97
+ export { checkbox_group_CheckboxGroup as default };
@@ -0,0 +1,11 @@
1
+ import { type Accessor } from "solid-js";
2
+ import type { CheckboxVariant } from "../checkbox";
3
+ export type CheckboxGroupContextValue = {
4
+ value: Accessor<string[]>;
5
+ name: Accessor<string | undefined>;
6
+ variant: Accessor<CheckboxVariant>;
7
+ isDisabled: Accessor<boolean>;
8
+ isInvalid: Accessor<boolean>;
9
+ toggleValue: (optionValue: string, checked: boolean, event: Event) => void;
10
+ };
11
+ export declare const CheckboxGroupContext: import("solid-js").Context<CheckboxGroupContextValue | undefined>;
@@ -0,0 +1,3 @@
1
+ import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
2
+ const CheckboxGroupContext = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createContext)();
3
+ export { CheckboxGroupContext };
@@ -0,0 +1,4 @@
1
+ import CheckboxGroup from "./CheckboxGroup";
2
+ export type { CheckboxGroupProps, CheckboxGroupVariant } from "./CheckboxGroup";
3
+ export { CheckboxGroup };
4
+ export default CheckboxGroup;
@@ -0,0 +1,4 @@
1
+ import * as __WEBPACK_EXTERNAL_MODULE__CheckboxGroup_js_11417210__ from "./CheckboxGroup.js";
2
+ const checkbox_group = __WEBPACK_EXTERNAL_MODULE__CheckboxGroup_js_11417210__["default"];
3
+ var __webpack_exports__CheckboxGroup = __WEBPACK_EXTERNAL_MODULE__CheckboxGroup_js_11417210__["default"];
4
+ export { checkbox_group as default, __webpack_exports__CheckboxGroup as CheckboxGroup };
@@ -130,28 +130,25 @@
130
130
  padding-inline: 0.125rem;
131
131
  }
132
132
 
133
- .chip__start,
134
- .chip__end {
133
+ .chip__icon {
135
134
  display: inline-flex;
136
135
  align-items: center;
137
136
  justify-content: center;
138
137
  flex-shrink: 0;
139
138
  }
140
139
 
141
- .chip__start svg,
142
- .chip__end svg {
140
+ .chip__icon > * {
143
141
  width: 0.875rem;
144
142
  height: 0.875rem;
143
+ pointer-events: none;
145
144
  }
146
145
 
147
- .chip--sm .chip__start svg,
148
- .chip--sm .chip__end svg {
146
+ .chip--sm .chip__icon > * {
149
147
  width: 0.75rem;
150
148
  height: 0.75rem;
151
149
  }
152
150
 
153
- .chip--lg .chip__start svg,
154
- .chip--lg .chip__end svg {
151
+ .chip--lg .chip__icon > * {
155
152
  width: 1rem;
156
153
  height: 1rem;
157
154
  }
@@ -172,9 +169,14 @@
172
169
  transition: background-color 120ms ease;
173
170
  }
174
171
 
175
- .chip__remove svg {
172
+ .chip__remove-icon,
173
+ .chip__remove-icon > * {
174
+ display: inline-flex;
175
+ align-items: center;
176
+ justify-content: center;
176
177
  width: 100%;
177
178
  height: 100%;
179
+ pointer-events: none;
178
180
  }
179
181
 
180
182
  .chip__remove:focus-visible {
@@ -10,8 +10,8 @@ interface ChipRootProps extends Omit<JSX.HTMLAttributes<HTMLSpanElement>, "color
10
10
  variant?: ChipVariant;
11
11
  color?: ChipColor;
12
12
  size?: ChipSize;
13
- startContent?: JSX.Element;
14
- endContent?: JSX.Element;
13
+ startIcon?: JSX.Element;
14
+ endIcon?: JSX.Element;
15
15
  onRemove?: () => void;
16
16
  removeButtonLabel?: string;
17
17
  isDisabled?: boolean;