@coopdigital/react 0.44.0 → 0.46.0

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 (85) hide show
  1. package/dist/components/Button/Button.d.ts +6 -4
  2. package/dist/components/Button/Button.js +4 -6
  3. package/dist/components/Card/Card.js +2 -2
  4. package/dist/components/Checkbox/Checkbox.d.ts +4 -24
  5. package/dist/components/Checkbox/Checkbox.js +7 -14
  6. package/dist/components/Checkbox/index.d.ts +1 -2
  7. package/dist/components/Expandable/Expandable.js +2 -2
  8. package/dist/components/Field/Field.d.ts +44 -5
  9. package/dist/components/Field/Field.js +68 -5
  10. package/dist/components/FieldMarkers/Error.d.ts +9 -0
  11. package/dist/components/{FieldError/FieldError.js → FieldMarkers/Error.js} +2 -2
  12. package/dist/components/FieldMarkers/Hint.d.ts +9 -0
  13. package/dist/components/{FieldHint/FieldHint.js → FieldMarkers/Hint.js} +2 -2
  14. package/dist/components/FieldMarkers/Label.d.ts +11 -0
  15. package/dist/components/FieldMarkers/Label.js +8 -0
  16. package/dist/components/FieldMarkers/Legend.d.ts +11 -0
  17. package/dist/components/FieldMarkers/Legend.js +13 -0
  18. package/dist/components/Fieldset/Fieldset.d.ts +54 -0
  19. package/dist/components/Fieldset/Fieldset.js +44 -0
  20. package/dist/components/Fieldset/index.d.ts +4 -0
  21. package/dist/components/Pill/Pill.js +2 -2
  22. package/dist/components/Radio/Radio.d.ts +18 -0
  23. package/dist/components/Radio/Radio.js +22 -0
  24. package/dist/components/Radio/index.d.ts +4 -0
  25. package/dist/components/{SearchBox/SearchBox.d.ts → Searchbox/Searchbox.d.ts} +7 -7
  26. package/dist/components/{SearchBox/SearchBox.js → Searchbox/Searchbox.js} +6 -6
  27. package/dist/components/Searchbox/index.d.ts +4 -0
  28. package/dist/components/TextInput/TextInput.d.ts +5 -19
  29. package/dist/components/TextInput/TextInput.js +7 -11
  30. package/dist/components/Textarea/Textarea.d.ts +4 -18
  31. package/dist/components/Textarea/Textarea.js +8 -9
  32. package/dist/hooks/useId.d.ts +2 -0
  33. package/dist/hooks/useId.js +8 -0
  34. package/dist/{utils/slots.d.ts → hooks/useSlots.d.ts} +3 -1
  35. package/dist/{utils/slots.js → hooks/useSlots.js} +9 -3
  36. package/dist/index.d.ts +3 -5
  37. package/dist/index.js +4 -8
  38. package/package.json +10 -10
  39. package/src/components/Button/Button.tsx +10 -14
  40. package/src/components/Card/Card.tsx +2 -3
  41. package/src/components/Checkbox/Checkbox.tsx +8 -64
  42. package/src/components/Checkbox/index.ts +1 -2
  43. package/src/components/Expandable/Expandable.tsx +2 -2
  44. package/src/components/Field/Field.tsx +144 -8
  45. package/src/components/{FieldError/FieldError.tsx → FieldMarkers/Error.tsx} +4 -4
  46. package/src/components/{FieldHint/FieldHint.tsx → FieldMarkers/Hint.tsx} +5 -9
  47. package/src/components/FieldMarkers/Label.tsx +21 -0
  48. package/src/components/FieldMarkers/Legend.tsx +28 -0
  49. package/src/components/Fieldset/Fieldset.tsx +98 -0
  50. package/src/components/Fieldset/index.ts +5 -0
  51. package/src/components/Pill/Pill.tsx +2 -2
  52. package/src/components/Radio/Radio.tsx +47 -0
  53. package/src/components/Radio/index.ts +5 -0
  54. package/src/components/{SearchBox/SearchBox.tsx → Searchbox/Searchbox.tsx} +15 -13
  55. package/src/components/Searchbox/index.ts +5 -0
  56. package/src/components/TextInput/TextInput.tsx +25 -46
  57. package/src/components/Textarea/Textarea.tsx +12 -40
  58. package/src/hooks/useId.ts +9 -0
  59. package/src/{utils/slots.ts → hooks/useSlots.ts} +10 -2
  60. package/src/index.ts +3 -5
  61. package/dist/components/Checkbox/CheckboxGroup.d.ts +0 -32
  62. package/dist/components/Checkbox/CheckboxGroup.js +0 -21
  63. package/dist/components/FieldError/FieldError.d.ts +0 -9
  64. package/dist/components/FieldError/index.d.ts +0 -4
  65. package/dist/components/FieldHint/FieldHint.d.ts +0 -9
  66. package/dist/components/FieldHint/index.d.ts +0 -4
  67. package/dist/components/FieldLabel/FieldLabel.d.ts +0 -13
  68. package/dist/components/FieldLabel/FieldLabel.js +0 -13
  69. package/dist/components/FieldLabel/index.d.ts +0 -4
  70. package/dist/components/RadioButton/RadioButton.d.ts +0 -36
  71. package/dist/components/RadioButton/RadioButton.js +0 -26
  72. package/dist/components/RadioButton/RadioButtonGroup.d.ts +0 -32
  73. package/dist/components/RadioButton/RadioButtonGroup.js +0 -21
  74. package/dist/components/RadioButton/index.d.ts +0 -5
  75. package/dist/components/SearchBox/index.d.ts +0 -4
  76. package/dist/components/Tag/index.js +0 -5
  77. package/src/components/Checkbox/CheckboxGroup.tsx +0 -73
  78. package/src/components/FieldError/index.ts +0 -5
  79. package/src/components/FieldHint/index.ts +0 -5
  80. package/src/components/FieldLabel/FieldLabel.tsx +0 -31
  81. package/src/components/FieldLabel/index.ts +0 -5
  82. package/src/components/RadioButton/RadioButton.tsx +0 -97
  83. package/src/components/RadioButton/RadioButtonGroup.tsx +0 -73
  84. package/src/components/RadioButton/index.ts +0 -6
  85. package/src/components/SearchBox/index.ts +0 -5
@@ -1,73 +0,0 @@
1
- import type { FieldsetHTMLAttributes, JSX } from "react"
2
-
3
- import clsx from "clsx"
4
-
5
- import { FormFieldError, StandardSizes } from "../../types"
6
- import { FieldError } from "../FieldError"
7
- import { FieldHint } from "../FieldHint"
8
-
9
- export interface RadioButtonGroupProps extends FieldsetHTMLAttributes<HTMLFieldSetElement> {
10
- /** **(Optional)** Main content inside the component. It can be any valid JSX or string. */
11
- children?: React.ReactNode
12
- /** **(Optional)** Specify additional CSS classes to be applied to the component. */
13
- className?: string
14
- /** **(Optional)** Specify whether the RadioButtonGroup, and all of its descendents, should be disabled. Refer to Experience Library guidance on disabled form controls and accessibility. */
15
- disabled?: boolean
16
- /** **(Optional)** Specify the RadioButtonGroup error state.
17
- *
18
- * This is an instance of `FormFieldError`. You can provide either an object with a `message` key, or a boolean value if you need to render the message independently.
19
- */
20
- error?: FormFieldError
21
- /** **(Optional)** Specify the RadioButtonGroup hint.
22
- *
23
- * This text is rendered under the label to provide further guidance for users.
24
- */
25
- hint?: string
26
- /** **(Optional)** Specify the label for the RadioButtonGroup. This will be rendered as a fieldset legend. */
27
- label?: string
28
- /** **(Optional)** Specify whether the label should be visible to humans or screen readers. */
29
- labelVisible?: boolean
30
- /** **(Optional)** Specify the RadioButtonGroup orientation. */
31
- orientation?: "horizontal" | "vertical"
32
- /** **(Optional)** Specify the RadioButtonGroup size. */
33
- size?: StandardSizes
34
- /** **(Optional)** Specify the RadioButtonGroup variant. */
35
- variant?: "default" | "boxed"
36
- }
37
-
38
- export const RadioButtonGroup = ({
39
- children,
40
- className,
41
- error = false,
42
- hint,
43
- label,
44
- labelVisible = true,
45
- orientation = "vertical",
46
- size = "md",
47
- variant = "default",
48
- ...props
49
- }: RadioButtonGroupProps): JSX.Element => {
50
- const componentProps = {
51
- className: clsx("coop-fieldset", "coop-radio-button-group", className),
52
- "data-error": error ? "" : undefined,
53
- "data-orientation": orientation !== "vertical" ? orientation : undefined,
54
- "data-size": size.length && size !== "md" ? size : undefined,
55
- "data-variant": variant !== "default" ? variant : undefined,
56
- ...props,
57
- }
58
-
59
- const legendProps = {
60
- className: clsx("coop-field-label", !labelVisible && "sr-only"),
61
- }
62
-
63
- return (
64
- <fieldset {...componentProps}>
65
- {label && <legend {...legendProps}>{label}</legend>}
66
- {hint && <FieldHint>{hint}</FieldHint>}
67
- {typeof error === "object" && error?.message && <FieldError>{error.message}</FieldError>}
68
- <div className="coop-radio-button-group-options">{children}</div>
69
- </fieldset>
70
- )
71
- }
72
-
73
- export default RadioButtonGroup
@@ -1,6 +0,0 @@
1
- import RadioButton from "./RadioButton"
2
- import RadioButtonGroup from "./RadioButtonGroup"
3
-
4
- export default RadioButton
5
- export { RadioButton, RadioButtonGroup }
6
- export * from "./RadioButton"
@@ -1,5 +0,0 @@
1
- import SearchBox from "./SearchBox"
2
-
3
- export default SearchBox
4
- export { SearchBox }
5
- export * from "./SearchBox"