@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.
- package/CHANGELOG.md +644 -0
- package/README.md +2 -5
- package/dist/component-library.es.js +2712 -5705
- package/dist/component-library.es.js.map +1 -1
- package/dist/component-library.umd.js +2 -28
- package/dist/component-library.umd.js.map +1 -1
- package/dist/components/animations/icons/status-icon.d.ts +4 -0
- package/dist/components/animations/illustrations/check-animation.d.ts +8 -0
- package/dist/components/animations/illustrations/pulse-animation.d.ts +5 -1
- package/dist/components/animations/illustrations/status-animation.d.ts +8 -1
- package/dist/components/animations/shared.d.ts +6 -32
- package/dist/components/animations/spinner.d.ts +18 -0
- package/dist/components/animations/use-animation-labels.d.ts +0 -5
- package/dist/components/buttons/action-button.d.ts +8 -10
- package/dist/components/buttons/button-base.d.ts +26 -12
- package/dist/components/buttons/button.d.ts +2 -2
- package/dist/components/buttons/close-button.d.ts +1 -1
- package/dist/components/buttons/icon-button.d.ts +1 -13
- package/dist/components/buttons/skip-link.d.ts +21 -4
- package/dist/components/color-roles.d.ts +8 -0
- package/dist/components/data-display/card.d.ts +31 -4
- package/dist/components/data-display/chip.d.ts +50 -8
- package/dist/components/data-display/data-field.d.ts +15 -4
- package/dist/components/data-display/tooltip.d.ts +74 -22
- package/dist/components/feedback/alert-parts.d.ts +10 -9
- package/dist/components/feedback/alert.d.ts +1 -1
- package/dist/components/feedback/simple-dialog.d.ts +1 -1
- package/dist/components/form/amount-slider.d.ts +68 -0
- package/dist/components/form/autocomplete.d.ts +56 -59
- package/dist/components/form/checkbox-box.d.ts +11 -0
- package/dist/components/form/checkbox.d.ts +67 -7
- package/dist/components/form/combo-field.d.ts +60 -0
- package/dist/components/form/email-input.d.ts +20 -26
- package/dist/components/form/field-parts.d.ts +36 -0
- package/dist/components/form/index.d.ts +3 -9
- package/dist/components/form/input.d.ts +51 -13
- package/dist/components/form/multi-select.d.ts +12 -14
- package/dist/components/form/number-input.d.ts +20 -14
- package/dist/components/form/phone-number-input/phone-number-input.d.ts +25 -14
- package/dist/components/form/radio-card.d.ts +94 -43
- package/dist/components/form/radio-circle.d.ts +14 -13
- package/dist/components/form/radio-group-root.d.ts +88 -0
- package/dist/components/form/radio.d.ts +68 -24
- package/dist/components/form/select-field.d.ts +78 -0
- package/dist/components/form/select.d.ts +30 -42
- package/dist/components/form/slider-parts.d.ts +34 -0
- package/dist/components/form/slider.d.ts +40 -16
- package/dist/components/form/use-autocomplete-labels.d.ts +3 -16
- package/dist/components/form/use-blur-outside.d.ts +7 -0
- package/dist/components/form/use-focus-target-ref.d.ts +11 -0
- package/dist/components/form/use-tooltip-trigger-labels.d.ts +5 -0
- package/dist/components/index.d.ts +0 -1
- package/dist/components/navigation/form-stepper.d.ts +1 -1
- package/dist/components/navigation/index.d.ts +1 -1
- package/dist/components/navigation/linear-form-stepper.d.ts +1 -1
- package/dist/components/navigation/progress-circle.d.ts +14 -8
- package/dist/components/navigation/tabs.d.ts +37 -34
- package/dist/components/navigation/use-stepper-labels.d.ts +1 -1
- package/dist/components/typography/link.d.ts +25 -16
- package/dist/components/typography/lists.d.ts +20 -23
- package/dist/components/typography/text.d.ts +46 -10
- package/dist/components/ui/app-header.d.ts +9 -1
- package/dist/cookie-consent/react.d.ts +0 -1
- package/dist/cookie-consent-react.cjs +1 -1
- package/dist/cookie-consent-react.cjs.map +1 -1
- package/dist/cookie-consent-react.mjs +106 -96
- package/dist/cookie-consent-react.mjs.map +1 -1
- package/dist/cookie-consent.css +1 -1
- package/dist/date-picker/datepicker.d.ts +140 -0
- package/dist/date-picker/index.d.ts +18 -0
- package/dist/date-picker/theme/field-base.d.ts +23 -0
- package/dist/date-picker/theme/form-control.theme.d.ts +7 -0
- package/dist/date-picker/theme/index.d.ts +12 -0
- package/dist/date-picker/theme/input.theme.d.ts +6 -0
- package/dist/{components/form/datepicker → date-picker}/use-view-toggle-labels.d.ts +1 -1
- package/dist/date-picker.cjs +2 -0
- package/dist/date-picker.cjs.map +1 -0
- package/dist/date-picker.mjs +1012 -0
- package/dist/date-picker.mjs.map +1 -0
- package/dist/{components/dev-panel → dev-panel}/dev-panel-payload.d.ts +1 -1
- package/dist/{components/dev-panel → dev-panel}/dev-panel-status.d.ts +2 -2
- package/dist/{components/dev-panel → dev-panel}/dev-panel-steps.d.ts +2 -1
- package/dist/{components/dev-panel → dev-panel}/dev-panel.d.ts +25 -19
- package/dist/dev-panel/index.d.ts +10 -0
- package/dist/{components/dev-panel → dev-panel}/json-highlight.d.ts +2 -2
- package/dist/dev-panel/parts.d.ts +9 -0
- package/dist/{components/dev-panel → dev-panel}/segmented-control.d.ts +5 -4
- package/dist/{components/dev-panel → dev-panel}/use-dev-panel-labels.d.ts +1 -1
- package/dist/{components/dev-panel → dev-panel}/use-roving-radio.d.ts +2 -2
- package/dist/dev-panel.cjs +3 -0
- package/dist/dev-panel.cjs.map +1 -0
- package/dist/dev-panel.css +1 -0
- package/dist/dev-panel.mjs +818 -0
- package/dist/dev-panel.mjs.map +1 -0
- package/dist/fonts/ClashGrotesk-Variable.woff2 +0 -0
- package/dist/index.css +1 -1
- package/dist/index.d.ts +1 -3
- package/dist/provider/lea-provider.d.ts +4 -7
- package/dist/react-hook-form/form-field.d.ts +76 -0
- package/dist/react-hook-form/index.d.ts +1 -0
- package/dist/react-hook-form.cjs +2 -0
- package/dist/react-hook-form.cjs.map +1 -0
- package/dist/react-hook-form.mjs +33 -0
- package/dist/react-hook-form.mjs.map +1 -0
- package/dist/tailwind.css +103 -17
- package/dist/theme/index.d.ts +0 -4
- package/dist/theme/token-types.d.ts +15 -3
- package/dist/theme/tokens/colors.d.ts +13 -0
- package/dist/theme/tokens/font-family.d.ts +9 -0
- package/dist/theme/tokens/font-sizes.d.ts +8 -0
- package/dist/theme/tokens/index.d.ts +4 -1
- package/dist/theme/tokens/line-heights.d.ts +11 -0
- package/dist/theme/tokens/spacing.d.ts +6 -0
- package/dist/theme/tokens/text-styles.d.ts +61 -0
- package/dist/theme/tokens/type-scale.d.ts +21 -0
- package/dist/theme/types.d.ts +19 -30
- package/package.json +42 -6
- package/dist/components/dev-panel/index.d.ts +0 -9
- package/dist/components/form/datepicker/datepicker.d.ts +0 -99
- package/dist/components/form/datepicker/index.d.ts +0 -1
- package/dist/components/form/fields/autocomplete-field.d.ts +0 -17
- package/dist/components/form/fields/boolean-radio-field.d.ts +0 -3
- package/dist/components/form/fields/checkbox-field.d.ts +0 -12
- package/dist/components/form/fields/datepicker-field.d.ts +0 -9
- package/dist/components/form/fields/email-field.d.ts +0 -10
- package/dist/components/form/fields/field-types.d.ts +0 -18
- package/dist/components/form/fields/index.d.ts +0 -14
- package/dist/components/form/fields/input-field.d.ts +0 -9
- package/dist/components/form/fields/multi-select-field.d.ts +0 -9
- package/dist/components/form/fields/number-field.d.ts +0 -10
- package/dist/components/form/fields/phone-number-field.d.ts +0 -11
- package/dist/components/form/fields/radio-card-field.d.ts +0 -22
- package/dist/components/form/fields/radio-field.d.ts +0 -16
- package/dist/components/form/fields/select-field.d.ts +0 -9
- package/dist/components/form/fields/use-field-control.d.ts +0 -6
- package/dist/components/form/fields/use-tooltip-trigger-labels.d.ts +0 -5
- package/dist/components/form/form-control/form-control-context.d.ts +0 -35
- package/dist/components/form/form-control/form-control-label.d.ts +0 -1
- package/dist/components/form/form-control/form-control.d.ts +0 -13
- package/dist/components/form/form-control/form-helper-text.d.ts +0 -9
- package/dist/components/form/form-control/form-label.d.ts +0 -9
- package/dist/components/form/form-control/index.d.ts +0 -5
- package/dist/components/form/input-label.d.ts +0 -9
- package/dist/theme/components/accordion.theme.d.ts +0 -7
- package/dist/theme/components/action-button.theme.d.ts +0 -45
- package/dist/theme/components/alert.theme.d.ts +0 -2
- package/dist/theme/components/autocomplete.theme.d.ts +0 -2
- package/dist/theme/components/baseline-css.d.ts +0 -2
- package/dist/theme/components/button.theme.d.ts +0 -2
- package/dist/theme/components/card.theme.d.ts +0 -2
- package/dist/theme/components/checkbox.theme.d.ts +0 -2
- package/dist/theme/components/chip.theme.d.ts +0 -2
- package/dist/theme/components/dev-panel.theme.d.ts +0 -95
- package/dist/theme/components/dialog.theme.d.ts +0 -2
- package/dist/theme/components/drawer.theme.d.ts +0 -4
- package/dist/theme/components/field-base.d.ts +0 -31
- package/dist/theme/components/form-control-label.theme.d.ts +0 -2
- package/dist/theme/components/form-control.theme.d.ts +0 -2
- package/dist/theme/components/index.d.ts +0 -2
- package/dist/theme/components/input.theme.d.ts +0 -3
- package/dist/theme/components/link.theme.d.ts +0 -2
- package/dist/theme/components/menu-item.theme.d.ts +0 -2
- package/dist/theme/components/number-input.theme.d.ts +0 -23
- package/dist/theme/components/phone-number-input.theme.d.ts +0 -43
- package/dist/theme/components/radio.theme.d.ts +0 -2
- package/dist/theme/components/select.theme.d.ts +0 -2
- package/dist/theme/components/slider.theme.d.ts +0 -2
- package/dist/theme/components/tabs.theme.d.ts +0 -34
- package/dist/theme/components/tooltip.theme.d.ts +0 -110
- package/dist/theme/components/typography.theme.d.ts +0 -2
- package/dist/theme/mui-augmentation.d.ts +0 -147
- package/dist/theme/sx-config.d.ts +0 -10
- /package/dist/{components/form/datepicker → date-picker}/calendar-header.d.ts +0 -0
- /package/dist/{components/form/datepicker → date-picker}/drawer-toolbar.d.ts +0 -0
- /package/dist/{theme/components → date-picker/theme}/date-picker.theme.d.ts +0 -0
- /package/dist/{theme/components → date-picker/theme}/icon-button.theme.d.ts +0 -0
- /package/dist/{theme/tokens → date-picker/theme}/typography.d.ts +0 -0
- /package/dist/{components/form/datepicker → date-picker}/use-calendar-header-labels.d.ts +0 -0
- /package/dist/{components/form/datepicker → date-picker}/use-datepicker-title-labels.d.ts +0 -0
- /package/dist/{components/form/datepicker → date-picker}/view-renderers.d.ts +0 -0
- /package/dist/{components/form/datepicker → date-picker}/view-toggle.d.ts +0 -0
- /package/dist/{components/dev-panel → dev-panel}/dev-panel-country.d.ts +0 -0
- /package/dist/{components/dev-panel → dev-panel}/dev-panel-flow.d.ts +0 -0
- /package/dist/{components/dev-panel → dev-panel}/dev-panel-footer.d.ts +0 -0
- /package/dist/{components/dev-panel → dev-panel}/dev-panel-step-state.d.ts +0 -0
- /package/dist/{components/dev-panel → dev-panel}/dev-panel-variant.d.ts +0 -0
- /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": "
|
|
4
|
-
"description": "@leabankab/component-library — Lea Bank's React component library
|
|
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": "^
|
|
62
|
-
"react-dom": "^
|
|
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,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,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,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
|
-
};
|