@leabankab/component-library 7.3.0 → 8.0.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 (187) hide show
  1. package/CHANGELOG.md +644 -0
  2. package/README.md +2 -5
  3. package/dist/component-library.es.js +2712 -5705
  4. package/dist/component-library.es.js.map +1 -1
  5. package/dist/component-library.umd.js +2 -28
  6. package/dist/component-library.umd.js.map +1 -1
  7. package/dist/components/animations/icons/status-icon.d.ts +4 -0
  8. package/dist/components/animations/illustrations/check-animation.d.ts +8 -0
  9. package/dist/components/animations/illustrations/pulse-animation.d.ts +5 -1
  10. package/dist/components/animations/illustrations/status-animation.d.ts +8 -1
  11. package/dist/components/animations/shared.d.ts +6 -32
  12. package/dist/components/animations/spinner.d.ts +18 -0
  13. package/dist/components/animations/use-animation-labels.d.ts +0 -5
  14. package/dist/components/buttons/action-button.d.ts +8 -10
  15. package/dist/components/buttons/button-base.d.ts +26 -12
  16. package/dist/components/buttons/button.d.ts +2 -2
  17. package/dist/components/buttons/close-button.d.ts +1 -1
  18. package/dist/components/buttons/icon-button.d.ts +1 -13
  19. package/dist/components/buttons/skip-link.d.ts +21 -4
  20. package/dist/components/color-roles.d.ts +8 -0
  21. package/dist/components/data-display/card.d.ts +31 -4
  22. package/dist/components/data-display/chip.d.ts +50 -8
  23. package/dist/components/data-display/data-field.d.ts +15 -4
  24. package/dist/components/data-display/tooltip.d.ts +74 -22
  25. package/dist/components/feedback/alert-parts.d.ts +10 -9
  26. package/dist/components/feedback/alert.d.ts +1 -1
  27. package/dist/components/feedback/simple-dialog.d.ts +1 -1
  28. package/dist/components/form/amount-slider.d.ts +68 -0
  29. package/dist/components/form/autocomplete.d.ts +56 -59
  30. package/dist/components/form/checkbox-box.d.ts +11 -0
  31. package/dist/components/form/checkbox.d.ts +67 -7
  32. package/dist/components/form/combo-field.d.ts +60 -0
  33. package/dist/components/form/email-input.d.ts +20 -26
  34. package/dist/components/form/field-parts.d.ts +36 -0
  35. package/dist/components/form/index.d.ts +3 -9
  36. package/dist/components/form/input.d.ts +51 -13
  37. package/dist/components/form/multi-select.d.ts +12 -14
  38. package/dist/components/form/number-input.d.ts +20 -14
  39. package/dist/components/form/phone-number-input/phone-number-input.d.ts +25 -14
  40. package/dist/components/form/radio-card.d.ts +94 -43
  41. package/dist/components/form/radio-circle.d.ts +14 -13
  42. package/dist/components/form/radio-group-root.d.ts +88 -0
  43. package/dist/components/form/radio.d.ts +68 -24
  44. package/dist/components/form/select-field.d.ts +78 -0
  45. package/dist/components/form/select.d.ts +30 -42
  46. package/dist/components/form/slider-parts.d.ts +34 -0
  47. package/dist/components/form/slider.d.ts +40 -16
  48. package/dist/components/form/use-autocomplete-labels.d.ts +3 -16
  49. package/dist/components/form/use-blur-outside.d.ts +7 -0
  50. package/dist/components/form/use-focus-target-ref.d.ts +11 -0
  51. package/dist/components/form/use-tooltip-trigger-labels.d.ts +5 -0
  52. package/dist/components/index.d.ts +0 -1
  53. package/dist/components/navigation/form-stepper.d.ts +1 -1
  54. package/dist/components/navigation/index.d.ts +1 -1
  55. package/dist/components/navigation/linear-form-stepper.d.ts +1 -1
  56. package/dist/components/navigation/progress-circle.d.ts +14 -8
  57. package/dist/components/navigation/tabs.d.ts +37 -34
  58. package/dist/components/navigation/use-stepper-labels.d.ts +1 -1
  59. package/dist/components/typography/link.d.ts +25 -16
  60. package/dist/components/typography/lists.d.ts +20 -23
  61. package/dist/components/typography/text.d.ts +46 -10
  62. package/dist/components/ui/app-header.d.ts +9 -1
  63. package/dist/cookie-consent/react.d.ts +0 -1
  64. package/dist/cookie-consent-react.cjs +1 -1
  65. package/dist/cookie-consent-react.cjs.map +1 -1
  66. package/dist/cookie-consent-react.mjs +106 -96
  67. package/dist/cookie-consent-react.mjs.map +1 -1
  68. package/dist/cookie-consent.css +1 -1
  69. package/dist/date-picker/datepicker.d.ts +140 -0
  70. package/dist/date-picker/index.d.ts +18 -0
  71. package/dist/date-picker/theme/field-base.d.ts +23 -0
  72. package/dist/date-picker/theme/form-control.theme.d.ts +7 -0
  73. package/dist/date-picker/theme/index.d.ts +12 -0
  74. package/dist/date-picker/theme/input.theme.d.ts +6 -0
  75. package/dist/{components/form/datepicker → date-picker}/use-view-toggle-labels.d.ts +1 -1
  76. package/dist/date-picker.cjs +2 -0
  77. package/dist/date-picker.cjs.map +1 -0
  78. package/dist/date-picker.mjs +1012 -0
  79. package/dist/date-picker.mjs.map +1 -0
  80. package/dist/{components/dev-panel → dev-panel}/dev-panel-payload.d.ts +1 -1
  81. package/dist/{components/dev-panel → dev-panel}/dev-panel-status.d.ts +2 -2
  82. package/dist/{components/dev-panel → dev-panel}/dev-panel-steps.d.ts +2 -1
  83. package/dist/{components/dev-panel → dev-panel}/dev-panel.d.ts +25 -19
  84. package/dist/dev-panel/index.d.ts +10 -0
  85. package/dist/{components/dev-panel → dev-panel}/json-highlight.d.ts +2 -2
  86. package/dist/dev-panel/parts.d.ts +9 -0
  87. package/dist/{components/dev-panel → dev-panel}/segmented-control.d.ts +5 -4
  88. package/dist/{components/dev-panel → dev-panel}/use-dev-panel-labels.d.ts +1 -1
  89. package/dist/{components/dev-panel → dev-panel}/use-roving-radio.d.ts +2 -2
  90. package/dist/dev-panel.cjs +3 -0
  91. package/dist/dev-panel.cjs.map +1 -0
  92. package/dist/dev-panel.css +1 -0
  93. package/dist/dev-panel.mjs +818 -0
  94. package/dist/dev-panel.mjs.map +1 -0
  95. package/dist/fonts/ClashGrotesk-Variable.woff2 +0 -0
  96. package/dist/index.css +1 -1
  97. package/dist/index.d.ts +1 -3
  98. package/dist/provider/lea-provider.d.ts +4 -7
  99. package/dist/react-hook-form/form-field.d.ts +76 -0
  100. package/dist/react-hook-form/index.d.ts +1 -0
  101. package/dist/react-hook-form.cjs +2 -0
  102. package/dist/react-hook-form.cjs.map +1 -0
  103. package/dist/react-hook-form.mjs +33 -0
  104. package/dist/react-hook-form.mjs.map +1 -0
  105. package/dist/tailwind.css +103 -17
  106. package/dist/theme/index.d.ts +0 -4
  107. package/dist/theme/token-types.d.ts +15 -3
  108. package/dist/theme/tokens/colors.d.ts +13 -0
  109. package/dist/theme/tokens/font-family.d.ts +9 -0
  110. package/dist/theme/tokens/font-sizes.d.ts +8 -0
  111. package/dist/theme/tokens/index.d.ts +4 -1
  112. package/dist/theme/tokens/line-heights.d.ts +11 -0
  113. package/dist/theme/tokens/spacing.d.ts +6 -0
  114. package/dist/theme/tokens/text-styles.d.ts +61 -0
  115. package/dist/theme/tokens/type-scale.d.ts +21 -0
  116. package/dist/theme/types.d.ts +19 -30
  117. package/package.json +42 -6
  118. package/dist/components/dev-panel/index.d.ts +0 -9
  119. package/dist/components/form/datepicker/datepicker.d.ts +0 -99
  120. package/dist/components/form/datepicker/index.d.ts +0 -1
  121. package/dist/components/form/fields/autocomplete-field.d.ts +0 -17
  122. package/dist/components/form/fields/boolean-radio-field.d.ts +0 -3
  123. package/dist/components/form/fields/checkbox-field.d.ts +0 -12
  124. package/dist/components/form/fields/datepicker-field.d.ts +0 -9
  125. package/dist/components/form/fields/email-field.d.ts +0 -10
  126. package/dist/components/form/fields/field-types.d.ts +0 -18
  127. package/dist/components/form/fields/index.d.ts +0 -14
  128. package/dist/components/form/fields/input-field.d.ts +0 -9
  129. package/dist/components/form/fields/multi-select-field.d.ts +0 -9
  130. package/dist/components/form/fields/number-field.d.ts +0 -10
  131. package/dist/components/form/fields/phone-number-field.d.ts +0 -11
  132. package/dist/components/form/fields/radio-card-field.d.ts +0 -22
  133. package/dist/components/form/fields/radio-field.d.ts +0 -16
  134. package/dist/components/form/fields/select-field.d.ts +0 -9
  135. package/dist/components/form/fields/use-field-control.d.ts +0 -6
  136. package/dist/components/form/fields/use-tooltip-trigger-labels.d.ts +0 -5
  137. package/dist/components/form/form-control/form-control-context.d.ts +0 -35
  138. package/dist/components/form/form-control/form-control-label.d.ts +0 -1
  139. package/dist/components/form/form-control/form-control.d.ts +0 -13
  140. package/dist/components/form/form-control/form-helper-text.d.ts +0 -9
  141. package/dist/components/form/form-control/form-label.d.ts +0 -9
  142. package/dist/components/form/form-control/index.d.ts +0 -5
  143. package/dist/components/form/input-label.d.ts +0 -9
  144. package/dist/theme/components/accordion.theme.d.ts +0 -7
  145. package/dist/theme/components/action-button.theme.d.ts +0 -45
  146. package/dist/theme/components/alert.theme.d.ts +0 -2
  147. package/dist/theme/components/autocomplete.theme.d.ts +0 -2
  148. package/dist/theme/components/baseline-css.d.ts +0 -2
  149. package/dist/theme/components/button.theme.d.ts +0 -2
  150. package/dist/theme/components/card.theme.d.ts +0 -2
  151. package/dist/theme/components/checkbox.theme.d.ts +0 -2
  152. package/dist/theme/components/chip.theme.d.ts +0 -2
  153. package/dist/theme/components/dev-panel.theme.d.ts +0 -95
  154. package/dist/theme/components/dialog.theme.d.ts +0 -2
  155. package/dist/theme/components/drawer.theme.d.ts +0 -4
  156. package/dist/theme/components/field-base.d.ts +0 -31
  157. package/dist/theme/components/form-control-label.theme.d.ts +0 -2
  158. package/dist/theme/components/form-control.theme.d.ts +0 -2
  159. package/dist/theme/components/index.d.ts +0 -2
  160. package/dist/theme/components/input.theme.d.ts +0 -3
  161. package/dist/theme/components/link.theme.d.ts +0 -2
  162. package/dist/theme/components/menu-item.theme.d.ts +0 -2
  163. package/dist/theme/components/number-input.theme.d.ts +0 -23
  164. package/dist/theme/components/phone-number-input.theme.d.ts +0 -43
  165. package/dist/theme/components/radio.theme.d.ts +0 -2
  166. package/dist/theme/components/select.theme.d.ts +0 -2
  167. package/dist/theme/components/slider.theme.d.ts +0 -2
  168. package/dist/theme/components/tabs.theme.d.ts +0 -34
  169. package/dist/theme/components/tooltip.theme.d.ts +0 -110
  170. package/dist/theme/components/typography.theme.d.ts +0 -2
  171. package/dist/theme/mui-augmentation.d.ts +0 -147
  172. package/dist/theme/sx-config.d.ts +0 -10
  173. /package/dist/{components/form/datepicker → date-picker}/calendar-header.d.ts +0 -0
  174. /package/dist/{components/form/datepicker → date-picker}/drawer-toolbar.d.ts +0 -0
  175. /package/dist/{theme/components → date-picker/theme}/date-picker.theme.d.ts +0 -0
  176. /package/dist/{theme/components → date-picker/theme}/icon-button.theme.d.ts +0 -0
  177. /package/dist/{theme/tokens → date-picker/theme}/typography.d.ts +0 -0
  178. /package/dist/{components/form/datepicker → date-picker}/use-calendar-header-labels.d.ts +0 -0
  179. /package/dist/{components/form/datepicker → date-picker}/use-datepicker-title-labels.d.ts +0 -0
  180. /package/dist/{components/form/datepicker → date-picker}/view-renderers.d.ts +0 -0
  181. /package/dist/{components/form/datepicker → date-picker}/view-toggle.d.ts +0 -0
  182. /package/dist/{components/dev-panel → dev-panel}/dev-panel-country.d.ts +0 -0
  183. /package/dist/{components/dev-panel → dev-panel}/dev-panel-flow.d.ts +0 -0
  184. /package/dist/{components/dev-panel → dev-panel}/dev-panel-footer.d.ts +0 -0
  185. /package/dist/{components/dev-panel → dev-panel}/dev-panel-step-state.d.ts +0 -0
  186. /package/dist/{components/dev-panel → dev-panel}/dev-panel-variant.d.ts +0 -0
  187. /package/dist/{components/dev-panel → dev-panel}/use-copy.d.ts +0 -0
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@leabankab/component-library",
3
- "version": "7.3.0",
4
- "description": "@leabankab/component-library — Lea Bank's React component library built on MUI.",
3
+ "version": "8.0.0",
4
+ "description": "@leabankab/component-library — Lea Bank's React component library.",
5
5
  "engines": {
6
6
  "node": ">=20"
7
7
  },
@@ -26,6 +26,21 @@
26
26
  "import": "./dist/cookie-consent-react.mjs",
27
27
  "require": "./dist/cookie-consent-react.cjs"
28
28
  },
29
+ "./react-hook-form": {
30
+ "types": "./dist/react-hook-form/index.d.ts",
31
+ "import": "./dist/react-hook-form.mjs",
32
+ "require": "./dist/react-hook-form.cjs"
33
+ },
34
+ "./date-picker": {
35
+ "types": "./dist/date-picker/index.d.ts",
36
+ "import": "./dist/date-picker.mjs",
37
+ "require": "./dist/date-picker.cjs"
38
+ },
39
+ "./dev-panel": {
40
+ "types": "./dist/dev-panel/index.d.ts",
41
+ "import": "./dist/dev-panel.mjs",
42
+ "require": "./dist/dev-panel.cjs"
43
+ },
29
44
  "./cookie-consent.css": "./dist/cookie-consent.css",
30
45
  "./styles.css": "./dist/index.css",
31
46
  "./tailwind.css": "./dist/tailwind.css",
@@ -46,7 +61,6 @@
46
61
  },
47
62
  "dependencies": {
48
63
  "@base-ui/react": "^1.6.0",
49
- "@storybook/addon-a11y": "^10.5.5",
50
64
  "libphonenumber-js": "^1.13.10",
51
65
  "lucide-react": "^1.28.0",
52
66
  "motion": "^12.43.0"
@@ -58,12 +72,33 @@
58
72
  "@mui/system": "^9.0.0",
59
73
  "@mui/x-date-pickers": "^9.0.0",
60
74
  "date-fns": "^4.0.0",
61
- "react": "^18.0.0 || ^19.0.0",
62
- "react-dom": "^18.0.0 || ^19.0.0",
75
+ "react": "^19.0.0",
76
+ "react-dom": "^19.0.0",
63
77
  "react-hook-form": "^7.56.0",
64
78
  "vanilla-cookieconsent": "3.1.0"
65
79
  },
66
80
  "peerDependenciesMeta": {
81
+ "@emotion/react": {
82
+ "optional": true
83
+ },
84
+ "@emotion/styled": {
85
+ "optional": true
86
+ },
87
+ "@mui/material": {
88
+ "optional": true
89
+ },
90
+ "@mui/system": {
91
+ "optional": true
92
+ },
93
+ "@mui/x-date-pickers": {
94
+ "optional": true
95
+ },
96
+ "date-fns": {
97
+ "optional": true
98
+ },
99
+ "react-hook-form": {
100
+ "optional": true
101
+ },
67
102
  "vanilla-cookieconsent": {
68
103
  "optional": true
69
104
  }
@@ -79,6 +114,7 @@
79
114
  "@mui/material": "^9.2.0",
80
115
  "@mui/system": "^9.2.0",
81
116
  "@mui/x-date-pickers": "^9.10.1",
117
+ "@storybook/addon-a11y": "^10.5.5",
82
118
  "@storybook/addon-docs": "^10.5.5",
83
119
  "@storybook/addon-links": "^10.5.5",
84
120
  "@storybook/addon-mcp": "^0.6.0",
@@ -115,7 +151,7 @@
115
151
  "scripts": {
116
152
  "preinstall": "npx only-allow pnpm",
117
153
  "dev": "storybook dev -p 6006",
118
- "build": "cross-env NODE_OPTIONS=--max-old-space-size=4096 vite build && vite build -c vite.cookie-consent.config.ts",
154
+ "build": "cross-env NODE_OPTIONS=--max-old-space-size=4096 vite build && vite build -c vite.cookie-consent.config.ts && vite build -c vite.react-hook-form.config.ts && vite build -c vite.date-picker.config.ts && vite build -c vite.dev-panel.config.ts",
119
155
  "watch": "cross-env NODE_OPTIONS=--max-old-space-size=4096 vite build --watch",
120
156
  "storybook": "storybook dev -p 6006",
121
157
  "build-storybook": "cross-env NODE_OPTIONS=--max-old-space-size=4096 storybook build",
@@ -1,9 +0,0 @@
1
- export * from './dev-panel';
2
- export * from './dev-panel-country';
3
- export * from './dev-panel-variant';
4
- export * from './dev-panel-step-state';
5
- export * from './dev-panel-steps';
6
- export * from './dev-panel-status';
7
- export * from './dev-panel-flow';
8
- export * from './dev-panel-payload';
9
- export * from './dev-panel-footer';
@@ -1,99 +0,0 @@
1
- import { DatePickerProps as MuiDatePickerProps } from '@mui/x-date-pickers/DatePicker';
2
- import { Locale } from 'date-fns';
3
- import { ReactNode } from 'react';
4
- import { MonthYearOrder } from './view-toggle';
5
- import { ViewToggleLabels } from './use-view-toggle-labels';
6
- import { CalendarHeaderLabels } from './use-calendar-header-labels';
7
- export { type ViewToggleLabels, type CalendarHeaderLabels };
8
- export type DatePickerProps = MuiDatePickerProps & {
9
- /** Helper / error text shown below the control and linked via `aria-describedby`. */
10
- helperText?: ReactNode;
11
- /** Puts the control in an error state and styles the helper text accordingly. */
12
- error?: boolean;
13
- /** Marks the control as required. */
14
- required?: boolean;
15
- /**
16
- * `date-fns` locale used by the internal `LocalizationProvider`. Defaults to
17
- * the `LeaProvider` language (`no`->`nb`, `se`->`sv`, `fi`->`fi`, `es`->`es`);
18
- * set this to override.
19
- */
20
- adapterLocale?: Locale;
21
- /** Small uppercase context label shown above the drawer title on mobile. */
22
- eyebrow?: ReactNode;
23
- /** Drawer heading on mobile. Defaults from `views` ("Velg dato" or "Velg måned og år"). */
24
- title?: ReactNode;
25
- /** Order of month and year in the month/year picker. Default: "month-year" */
26
- monthYearOrder?: MonthYearOrder;
27
- /**
28
- * Override the month/year toggle's translated labels (`month`, `year`,
29
- * `selectView`) per-instance. Only used by the month/year picker
30
- * (`views={["year", "month"]}`).
31
- */
32
- viewToggleLabels?: ViewToggleLabels;
33
- /**
34
- * Override the day calendar header's translated labels (`previousMonth`,
35
- * `nextMonth`, `switchToYearView`, `switchToDayView`) per-instance. Only
36
- * used by the day picker (default `views`).
37
- */
38
- calendarHeaderLabels?: CalendarHeaderLabels;
39
- };
40
- /**
41
- * DatePicker built on MUI's responsive `DatePicker` (`@mui/x-date-pickers`),
42
- * styled to the Lea Bank design.
43
- *
44
- * Two calendar designs, chosen by `views`:
45
- * - **Day picker** (default): MUI's `DateCalendar` day grid with a centered Lea
46
- * Bank header (prev/next month chevrons either side of a clickable month-year
47
- * label that switches to the year list) and lowercase Monday-first weekdays.
48
- * - **Month/year picker** (`views={["year", "month"]}`): a Måned / År segmented
49
- * toggle above the month / year grids. Control the order via `monthYearOrder`:
50
- * "month-year" (default) or "year-month" (for Sweden and other locales).
51
- * Opens on the first view and drills through to the second.
52
- *
53
- * - **Desktop:** a compact popover ("dropdown").
54
- * - **Mobile:** a bottom `Drawer` with an `eyebrow` + `title` header. The switch
55
- * happens at `theme.breakpoints.up("sm")` by default; override with
56
- * `desktopModeMediaQuery`.
57
- *
58
- * Selecting a value commits immediately (`closeOnSelect`) in both modes.
59
- * Configure which views are shown via `views` (e.g. `views={["year", "month"]}`).
60
- * The trigger is the picker's accessible field,
61
- * themed to match the library's other inputs (see `date-picker.theme.ts`), and a
62
- * `LocalizationProvider` + `AdapterDateFns` are bundled in (locale follows the
63
- * `LeaProvider` language, defaulting to Norwegian `nb`; set `adapterLocale` to
64
- * override). MUI X's own texts (the open-picker button, month navigation,
65
- * action bar) come from its bundled locale pack for that language — override
66
- * them per-instance with `localeText`.
67
- */
68
- export declare const DatePicker: import('react').ForwardRefExoticComponent<MuiDatePickerProps & {
69
- /** Helper / error text shown below the control and linked via `aria-describedby`. */
70
- helperText?: ReactNode;
71
- /** Puts the control in an error state and styles the helper text accordingly. */
72
- error?: boolean;
73
- /** Marks the control as required. */
74
- required?: boolean;
75
- /**
76
- * `date-fns` locale used by the internal `LocalizationProvider`. Defaults to
77
- * the `LeaProvider` language (`no`->`nb`, `se`->`sv`, `fi`->`fi`, `es`->`es`);
78
- * set this to override.
79
- */
80
- adapterLocale?: Locale;
81
- /** Small uppercase context label shown above the drawer title on mobile. */
82
- eyebrow?: ReactNode;
83
- /** Drawer heading on mobile. Defaults from `views` ("Velg dato" or "Velg måned og år"). */
84
- title?: ReactNode;
85
- /** Order of month and year in the month/year picker. Default: "month-year" */
86
- monthYearOrder?: MonthYearOrder;
87
- /**
88
- * Override the month/year toggle's translated labels (`month`, `year`,
89
- * `selectView`) per-instance. Only used by the month/year picker
90
- * (`views={["year", "month"]}`).
91
- */
92
- viewToggleLabels?: ViewToggleLabels;
93
- /**
94
- * Override the day calendar header's translated labels (`previousMonth`,
95
- * `nextMonth`, `switchToYearView`, `switchToDayView`) per-instance. Only
96
- * used by the day picker (default `views`).
97
- */
98
- calendarHeaderLabels?: CalendarHeaderLabels;
99
- } & import('react').RefAttributes<HTMLDivElement>>;
@@ -1 +0,0 @@
1
- export * from './datepicker';
@@ -1,17 +0,0 @@
1
- import { FieldValues } from 'react-hook-form';
2
- import { AutocompleteProps } from '../autocomplete';
3
- import { BaseFieldProps } from './field-types';
4
- /**
5
- * Distributes `Omit` across the `AutocompleteProps` union so the single- and
6
- * multiple-select props (e.g. `email`, `min`, `max`) survive rather than
7
- * collapsing to the keys common to both branches.
8
- */
9
- type DistributiveOmit<T, K extends PropertyKey> = T extends unknown ? Omit<T, K> : never;
10
- export type AutocompleteFieldProps<T extends FieldValues> = BaseFieldProps<T> & DistributiveOmit<AutocompleteProps, "name" | "value" | "defaultValue" | "onChange" | "error">;
11
- /**
12
- * `Autocomplete` connected to react-hook-form via `Controller`. Reads `control`
13
- * from the nearest `FormProvider` when the prop is omitted. Supports both
14
- * single (`string`) and `multiple` (`string[]`) selection.
15
- */
16
- export declare const AutocompleteField: <T extends FieldValues>({ name, control, rules, disabled, label, helperText, ...rest }: AutocompleteFieldProps<T>) => import("react").JSX.Element;
17
- export {};
@@ -1,3 +0,0 @@
1
- import { FieldValues } from 'react-hook-form';
2
- import { RadioCardFieldProps } from './radio-card-field';
3
- export declare const BooleanRadioCardField: <T extends FieldValues>(props: Omit<RadioCardFieldProps<T>, "format" | "parse">) => import("react").JSX.Element;
@@ -1,12 +0,0 @@
1
- import { ReactNode } from 'react';
2
- import { FieldValues } from 'react-hook-form';
3
- import { BaseFieldProps } from './field-types';
4
- export type CheckboxFieldProps<T extends FieldValues> = BaseFieldProps<T> & {
5
- label: ReactNode;
6
- };
7
- /**
8
- * `Checkbox` connected to react-hook-form via `Controller`, composed with
9
- * `FormControlLabel`. Reads `control` from the nearest `FormProvider` when the
10
- * prop is omitted.
11
- */
12
- export declare const CheckboxField: <T extends FieldValues>({ name, control, rules, disabled, label, }: CheckboxFieldProps<T>) => import("react").JSX.Element;
@@ -1,9 +0,0 @@
1
- import { FieldValues } from 'react-hook-form';
2
- import { DatePickerProps } from '../datepicker';
3
- import { BaseFieldProps } from './field-types';
4
- export type DatePickerFieldProps<T extends FieldValues> = BaseFieldProps<T> & Omit<DatePickerProps, "name" | "value" | "defaultValue" | "error" | "onChange">;
5
- /**
6
- * `DatePicker` connected to react-hook-form via `Controller`. Reads `control`
7
- * from the nearest `FormProvider` when the prop is omitted.
8
- */
9
- export declare const DatePickerField: <T extends FieldValues>({ name, control, rules, disabled, helperText, ...rest }: DatePickerFieldProps<T>) => import("react").JSX.Element;
@@ -1,10 +0,0 @@
1
- import { FieldValues } from 'react-hook-form';
2
- import { EmailInputProps } from '../email-input';
3
- import { BaseFieldProps } from './field-types';
4
- export type EmailFieldProps<T extends FieldValues> = BaseFieldProps<T> & Omit<EmailInputProps, "name" | "value" | "defaultValue" | "onChange" | "error">;
5
- /**
6
- * `EmailInput` (with `@` domain autocomplete) connected to react-hook-form via
7
- * `Controller`. Reads `control` from the nearest `FormProvider` when the prop is
8
- * omitted.
9
- */
10
- export declare const EmailField: <T extends FieldValues>({ name, control, rules, disabled, label, helperText, ...rest }: EmailFieldProps<T>) => import("react").JSX.Element;
@@ -1,18 +0,0 @@
1
- import { ReactNode } from 'react';
2
- import { Control, FieldPath, FieldValues, RegisterOptions } from 'react-hook-form';
3
- export interface BaseFieldProps<T extends FieldValues> {
4
- name: FieldPath<T>;
5
- control?: Control<T>;
6
- rules?: RegisterOptions<T, FieldPath<T>>;
7
- disabled?: boolean;
8
- }
9
- export type FieldOption = {
10
- value: string;
11
- label: ReactNode;
12
- };
13
- export type FieldValueTransform = {
14
- /** Maps the form value to the string the control displays. */
15
- format?: (value: unknown) => string;
16
- /** Maps the control's string value back to the form value. */
17
- parse?: (value: string) => unknown;
18
- };
@@ -1,14 +0,0 @@
1
- export * from './autocomplete-field';
2
- export * from './boolean-radio-field';
3
- export * from './checkbox-field';
4
- export * from './datepicker-field';
5
- export * from './email-field';
6
- export * from './field-types';
7
- export * from './input-field';
8
- export * from './multi-select-field';
9
- export * from './number-field';
10
- export * from './phone-number-field';
11
- export * from './radio-card-field';
12
- export * from './radio-field';
13
- export * from './select-field';
14
- export * from './use-field-control';
@@ -1,9 +0,0 @@
1
- import { FieldValues } from 'react-hook-form';
2
- import { InputProps } from '../input';
3
- import { BaseFieldProps } from './field-types';
4
- export type InputFieldProps<T extends FieldValues> = BaseFieldProps<T> & Omit<InputProps, "name" | "value" | "defaultValue" | "error">;
5
- /**
6
- * `Input` connected to react-hook-form via `Controller`. Reads `control` from
7
- * the nearest `FormProvider` when the prop is omitted.
8
- */
9
- export declare const InputField: <T extends FieldValues>({ name, control, rules, disabled, label, helperText, ...rest }: InputFieldProps<T>) => import("react").JSX.Element;
@@ -1,9 +0,0 @@
1
- import { FieldValues } from 'react-hook-form';
2
- import { MultiSelectProps } from '../multi-select';
3
- import { BaseFieldProps } from './field-types';
4
- export type MultiSelectFieldProps<T extends FieldValues> = BaseFieldProps<T> & Omit<MultiSelectProps, "name" | "value" | "defaultValue" | "error">;
5
- /**
6
- * `MultiSelect` connected to react-hook-form via `Controller`. Reads `control` from
7
- * the nearest `FormProvider` when the prop is omitted.
8
- */
9
- export declare const MultiSelectField: <T extends FieldValues>({ name, control, rules, disabled, label, helperText, options, ...rest }: MultiSelectFieldProps<T>) => import("react").JSX.Element;
@@ -1,10 +0,0 @@
1
- import { FieldValues } from 'react-hook-form';
2
- import { NumberInputProps } from '../number-input';
3
- import { BaseFieldProps } from './field-types';
4
- export type NumberFieldProps<T extends FieldValues> = BaseFieldProps<T> & Omit<NumberInputProps, "name" | "value" | "defaultValue" | "error" | "onValueChange">;
5
- /**
6
- * `NumberInput` connected to react-hook-form via `Controller`. Reads `control`
7
- * from the nearest `FormProvider` when the prop is omitted. The form value is
8
- * the raw `number | null` from the field.
9
- */
10
- export declare const NumberField: <T extends FieldValues>({ name, control, rules, disabled, label, helperText, ...rest }: NumberFieldProps<T>) => import("react").JSX.Element;
@@ -1,11 +0,0 @@
1
- import { FieldValues } from 'react-hook-form';
2
- import { PhoneNumberInputProps } from '../phone-number-input';
3
- import { BaseFieldProps } from './field-types';
4
- export type PhoneNumberFieldProps<T extends FieldValues> = BaseFieldProps<T> & Omit<PhoneNumberInputProps, "name" | "value" | "defaultValue" | "onChange" | "error">;
5
- /**
6
- * `PhoneNumberInput` connected to react-hook-form via `Controller`. Reads
7
- * `control` from the nearest `FormProvider` when the prop is omitted. The form
8
- * value is the formatted national number string; pass `defaultCountry` (or a
9
- * controlled `country` + `onCountryChange`) to drive the country.
10
- */
11
- export declare const PhoneNumberField: <T extends FieldValues>({ name, control, rules, disabled, label, helperText, ...rest }: PhoneNumberFieldProps<T>) => import("react").JSX.Element;
@@ -1,22 +0,0 @@
1
- import { ReactNode } from 'react';
2
- import { FieldValues } from 'react-hook-form';
3
- import { RadioGroupProps } from '../radio';
4
- import { BaseFieldProps, FieldOption, FieldValueTransform } from './field-types';
5
- export type RadioCardFieldProps<T extends FieldValues> = BaseFieldProps<T> & FieldValueTransform & {
6
- label: ReactNode;
7
- options: FieldOption[];
8
- /** CSS grid-template-columns for the option layout. Defaults to two equal columns. */
9
- gridColumns?: string;
10
- /** Size passed to each `RadioCard`. */
11
- cardSize?: "sm" | "lg";
12
- /** Tooltip content to display when hovering over the field. */
13
- tooltip?: ReactNode;
14
- } & Omit<RadioGroupProps, "value" | "onChange" | "name" | "defaultValue">;
15
- /**
16
- * `RadioGroup` of `RadioCard` options connected to react-hook-form via
17
- * `Controller`. Reads `control` from the nearest `FormProvider` when the prop
18
- * is omitted.
19
- *
20
- * Pass optional `format` / `parse` to coerce values (e.g. boolean <-> string).
21
- */
22
- export declare const RadioCardField: <T extends FieldValues>({ name, control, rules, disabled, label, options, format, parse, gridColumns, cardSize, tooltip, size, ...rest }: RadioCardFieldProps<T>) => import("react").JSX.Element;
@@ -1,16 +0,0 @@
1
- import { ReactNode } from 'react';
2
- import { FieldValues } from 'react-hook-form';
3
- import { RadioGroupProps } from '../radio';
4
- import { BaseFieldProps, FieldOption, FieldValueTransform } from './field-types';
5
- export type RadioFieldProps<T extends FieldValues> = BaseFieldProps<T> & FieldValueTransform & {
6
- label: ReactNode;
7
- options: FieldOption[];
8
- } & Omit<RadioGroupProps, "value" | "onChange" | "name" | "defaultValue">;
9
- /**
10
- * `RadioGroup` connected to react-hook-form via `Controller`, rendering each
11
- * option as a `FormControlLabel` + `Radio`. Reads `control` from the nearest
12
- * `FormProvider` when the prop is omitted.
13
- *
14
- * Pass optional `format` / `parse` to coerce values (e.g. boolean <-> string).
15
- */
16
- export declare const RadioField: <T extends FieldValues>({ name, control, rules, disabled, label, options, format, parse, size, ...rest }: RadioFieldProps<T>) => import("react").JSX.Element;
@@ -1,9 +0,0 @@
1
- import { FieldValues } from 'react-hook-form';
2
- import { SelectProps } from '../select';
3
- import { BaseFieldProps } from './field-types';
4
- export type SelectFieldProps<T extends FieldValues> = BaseFieldProps<T> & Omit<SelectProps, "name" | "value" | "defaultValue" | "error">;
5
- /**
6
- * `Select` connected to react-hook-form via `Controller`. Reads `control` from
7
- * the nearest `FormProvider` when the prop is omitted.
8
- */
9
- export declare const SelectField: <T extends FieldValues>({ name, control, rules, disabled, label, helperText, options, children, ...rest }: SelectFieldProps<T>) => import("react").JSX.Element;
@@ -1,6 +0,0 @@
1
- import { Control, FieldValues } from 'react-hook-form';
2
- /**
3
- * Resolves the `control` instance for a field component. Uses the explicit
4
- * `control` prop when provided, otherwise reads from the nearest `FormProvider`.
5
- */
6
- export declare function useResolvedControl<T extends FieldValues>(control?: Control<T>): Control<T>;
@@ -1,5 +0,0 @@
1
- /**
2
- * Translated accessible name for the info trigger a field renders next to its
3
- * label when given a `tooltip`.
4
- */
5
- export declare const useTooltipTriggerLabels: () => Record<"moreInformation", string>;
@@ -1,35 +0,0 @@
1
- /**
2
- * Ids shared between a `FormControl` and its label / control / helper text so
3
- * they stay wired together for assistive technology without the consumer ever
4
- * writing `htmlFor` or `aria-describedby` by hand.
5
- */
6
- export interface FormFieldIds {
7
- /** Id of the focusable control (input / select). */
8
- control: string;
9
- /** Id of the label element. */
10
- label: string;
11
- /** Id of the helper text element. */
12
- helperText: string;
13
- }
14
- export interface FormFieldContextValue {
15
- ids: FormFieldIds;
16
- /** Whether a `FormHelperText` is currently rendered, so the control knows to link it. */
17
- hasHelperText: boolean;
18
- /** Called by `FormHelperText` on mount / unmount to register its presence. */
19
- setHasHelperText: (present: boolean) => void;
20
- /**
21
- * Whether the control currently holds a value that should float the label
22
- * even when a start adornment is present (e.g. multi-select chips). A plain
23
- * leading icon leaves this `false` so it doesn't float the label on its own.
24
- */
25
- hasValue: boolean;
26
- /** Called by a value-bearing control to keep `hasValue` in sync. */
27
- setHasValue: (present: boolean) => void;
28
- }
29
- export declare const FormFieldProvider: import('react').Provider<FormFieldContextValue | null>;
30
- /**
31
- * Reads the field context provided by the surrounding `FormControl`. Returns
32
- * `null` when a control is rendered outside our `FormControl`, which lets a
33
- * standalone control provision its own wrapper and ids.
34
- */
35
- export declare const useFormField: () => FormFieldContextValue | null;
@@ -1 +0,0 @@
1
- export { FormControlLabel, type FormControlLabelProps, } from '@mui/material';
@@ -1,13 +0,0 @@
1
- import { FormControlProps } from '@mui/material';
2
- export type { FormControlProps };
3
- /**
4
- * Wrapper around MUI's `FormControl` that generates a unique base id (via
5
- * `useId`, overridable with the `id` prop) and shares the derived label /
6
- * control / helper-text ids with its children through context. This lets
7
- * `Input`, `Select`, `InputLabel` and `FormHelperText` wire `htmlFor`, `id` and
8
- * `aria-describedby` automatically — the consumer never writes them.
9
- *
10
- * MUI's own `FormControl` context still propagates `error` / `required` /
11
- * `disabled` / focused state to children; we only layer the ids on top.
12
- */
13
- export declare const FormControl: ({ id, fullWidth, focused: focusedProp, onFocus, onBlur, children, ...rest }: FormControlProps) => import("react").JSX.Element;
@@ -1,9 +0,0 @@
1
- import { FormHelperTextProps } from '@mui/material';
2
- export type { FormHelperTextProps };
3
- /**
4
- * Supplementary / error text for a field. When rendered inside our
5
- * `FormControl` it takes the helper-text id from context and registers its
6
- * presence, so the control links to it via `aria-describedby` automatically.
7
- * Pass `error` to render it in the error colour.
8
- */
9
- export declare const FormHelperText: (props: FormHelperTextProps) => import("react").JSX.Element;
@@ -1,9 +0,0 @@
1
- import { FormLabelProps } from '@mui/material';
2
- /**
3
- * Group label for non-floating controls (e.g. a `RadioGroup`). When rendered
4
- * inside our `FormControl` it claims the shared label id, so a sibling
5
- * `RadioGroup` can point its `aria-labelledby` at it automatically — the
6
- * consumer never wires the ids by hand. Reads required / error / focus state
7
- * from the surrounding `FormControl` like MUI's own `FormLabel`.
8
- */
9
- export declare const FormLabel: (props: FormLabelProps) => import("react").JSX.Element;
@@ -1,5 +0,0 @@
1
- export * from './form-control';
2
- export * from './form-control-context';
3
- export * from './form-control-label';
4
- export * from './form-label';
5
- export * from './form-helper-text';
@@ -1,9 +0,0 @@
1
- import { InputLabelProps } from '@mui/material';
2
- export type { InputLabelProps };
3
- /**
4
- * Floating label for a field. When rendered inside our `FormControl` it links
5
- * itself to the control automatically via `htmlFor` / `id`, so the consumer
6
- * never has to wire them. MUI appends the required asterisk and reads focus /
7
- * error / required state from the surrounding `FormControl` on its own.
8
- */
9
- export declare const InputLabel: (props: InputLabelProps) => import("react").JSX.Element;
@@ -1,7 +0,0 @@
1
- import { Components, Theme } from '@mui/material';
2
- /**
3
- * Lea styling for MUI Accordion. Importing `Accordion` / `AccordionSummary` /
4
- * `AccordionDetails` from `@mui/material` (with the app `ThemeProvider` + this theme)
5
- * applies these defaults and style overrides.
6
- */
7
- export declare const accordionTheme: Pick<Components<Theme>, "MuiAccordion" | "MuiAccordionSummary" | "MuiAccordionDetails">;
@@ -1,45 +0,0 @@
1
- export declare const actionButtonVariant: {
2
- props: {
3
- variant: "action";
4
- };
5
- style: {
6
- color: string;
7
- backgroundColor: string;
8
- outline: string;
9
- border: string;
10
- borderRadius: 100;
11
- paddingInlineStart: string;
12
- paddingInlineEnd: string;
13
- paddingBlock: string;
14
- fontSize: "1.25rem";
15
- textTransform: "uppercase";
16
- fontWeight: 700;
17
- svg: {
18
- display: string;
19
- width: number;
20
- height: number;
21
- borderRadius: 100;
22
- marginInlineStart: string;
23
- backgroundColor: string;
24
- color: string;
25
- transition: string;
26
- };
27
- "&:hover": {
28
- svg: {
29
- transform: string;
30
- backgroundColor: string;
31
- };
32
- };
33
- "& .MuiTouchRipple-root": {
34
- color: string;
35
- };
36
- "&:active": {
37
- outline: string;
38
- color: string;
39
- };
40
- "&:focus-visible": {
41
- outline: string;
42
- outlineColor: string;
43
- };
44
- };
45
- };
@@ -1,2 +0,0 @@
1
- import { Components, Theme } from '@mui/material';
2
- export declare const alertTheme: Components<Theme>["MuiAlert"];
@@ -1,2 +0,0 @@
1
- import { Components, Theme } from '@mui/material';
2
- export declare const autocompleteTheme: Components<Theme>["MuiAutocomplete"];
@@ -1,2 +0,0 @@
1
- import { Components, Theme } from '@mui/material';
2
- export declare const baselineCss: Components<Theme>["MuiCssBaseline"];
@@ -1,2 +0,0 @@
1
- import { Components, Theme } from '@mui/material';
2
- export declare const buttonTheme: Components<Theme>["MuiButton"];
@@ -1,2 +0,0 @@
1
- import { Components, Theme } from '@mui/material';
2
- export declare const cardTheme: Components<Theme>["MuiCard"];
@@ -1,2 +0,0 @@
1
- import { Components, Theme } from '@mui/material';
2
- export declare const checkboxTheme: Components<Theme>["MuiCheckbox"];
@@ -1,2 +0,0 @@
1
- import { Components, Theme } from '@mui/material';
2
- export declare const chipTheme: Components<Theme>["MuiChip"];