asma-ui-core 3.43.6 → 3.45.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/dist/asma-ui-core.css +1 -1
- package/dist/components/custom/module/header-layout/ToolbarActionGroup.js +2 -2
- package/dist/components/custom/module/module-title/StyledModuleTitle.module.js +1 -1
- package/dist/components/custom/widget/widget/StyledWidget.module.js +8 -8
- package/dist/components/custom/widget/widget-title/StyledWidgetTitle.module.js +1 -1
- package/dist/components/data-display/ai-disclosure/StyledAIDisclosure.js +7 -5
- package/dist/components/data-display/badge/StyledBadge.js +53 -23
- package/dist/components/data-display/chip/StyledChip.js +62 -59
- package/dist/components/data-display/chip/chipPadding.js +44 -0
- package/dist/components/data-display/form-label/components/StyledFormLabel.js +18 -10
- package/dist/components/data-display/form-label/styles/StyledFormLabel.module.js +4 -4
- package/dist/components/data-display/interactive-chip/StyledInteractiveChip.js +35 -39
- package/dist/components/data-display/interactive-chip/StyledInteractiveChip.module.js +4 -0
- package/dist/components/data-display/tooltip/StyledTooltip.js +51 -33
- package/dist/components/data-display/typography/StyledTypography.js +62 -4
- package/dist/components/feedback/dialog/StyledDialog.js +102 -39
- package/dist/components/feedback/dialog/StyledDialog.module.js +2 -9
- package/dist/components/feedback/dialog/StyledDialogActions.js +16 -16
- package/dist/components/feedback/dialog/StyledDialogContent.js +18 -14
- package/dist/components/feedback/dialog/StyledDialogTitle.js +18 -13
- package/dist/components/feedback/empty-page/StyledEmptyPage.js +4 -4
- package/dist/components/feedback/filtered-empty-state/StyledFilteredEmptyState.js +7 -7
- package/dist/components/feedback/minimizable-dialog/MinimizableDialog.js +123 -114
- package/dist/components/feedback/minimizable-dialog/components/CloseBtn.js +6 -5
- package/dist/components/feedback/minimizable-dialog/components/FullscreenBtn.js +13 -12
- package/dist/components/feedback/minimizable-dialog/components/MinimizeBtn.js +15 -13
- package/dist/components/feedback/minimizable-dialog/v2/MinimizableDialogV2.js +67 -61
- package/dist/components/feedback/snack-bar/StyledAlert.js +95 -14
- package/dist/components/feedback/snack-bar/StyledSnackbar.js +34 -8
- package/dist/components/feedback/snack-bar/components/StyledDefaultSnackbar.js +32 -33
- package/dist/components/feedback/snack-bar/components/StyledDefaultSnackbar.module.js +16 -16
- package/dist/components/icons/check-icon/CheckIcon.js +8 -7
- package/dist/components/icons/index.js +1 -0
- package/dist/components/icons/move-up-icon/MoveUpIcon.js +13 -0
- package/dist/components/icons/move-up-icon/index.js +1 -0
- package/dist/components/inputs/button/StyledButton.js +22 -18
- package/dist/components/inputs/button/StyledButton.module.js +5 -5
- package/dist/components/inputs/checkbox/base-ui/StyledCheckbox.js +61 -55
- package/dist/components/inputs/checkbox/base-ui/StyledCheckbox.module.js +12 -11
- package/dist/components/inputs/dynamic-select/components/DynamicInteractiveChipGroup.js +54 -50
- package/dist/components/inputs/dynamic-select/components/DynamicSelectAutocomplete.js +107 -99
- package/dist/components/inputs/field-styles.js +8 -0
- package/dist/components/inputs/input-field/StyledInputField.js +188 -83
- package/dist/components/inputs/input-field/StyledInputField.module.js +10 -0
- package/dist/components/inputs/label/StyledLabel.js +19 -11
- package/dist/components/inputs/label/StyledLabel.module.js +1 -1
- package/dist/components/inputs/radio-button/base-ui/RadioGroupContext.js +6 -0
- package/dist/components/inputs/radio-button/base-ui/StyledRadio.js +43 -28
- package/dist/components/inputs/radio-button/base-ui/StyledRadio.module.js +7 -6
- package/dist/components/inputs/radio-button/base-ui/StyledRadioGroup.js +37 -24
- package/dist/components/inputs/search-field/StyledSearchField.js +49 -43
- package/dist/components/inputs/select/StyledSelect.js +170 -45
- package/dist/components/inputs/select/StyledSelectItem.js +19 -23
- package/dist/components/inputs/select-autocomplete/StyledSelectAutocomplete.js +228 -150
- package/dist/components/inputs/slider/StyledSlider.js +100 -52
- package/dist/components/inputs/slider/StyledSlider.module.js +10 -0
- package/dist/components/inputs/switch/base-ui/StyledSwitch.js +45 -38
- package/dist/components/inputs/switch/base-ui/StyledSwitch.module.js +4 -4
- package/dist/components/inputs/textarea/StyledTextarea.js +44 -43
- package/dist/components/inputs/textarea/StyledTextarea.module.js +1 -1
- package/dist/components/miscellaneous/FormControlContext.js +6 -0
- package/dist/components/miscellaneous/StyledFormControl.js +42 -21
- package/dist/components/miscellaneous/StyledFormControlLabel.js +29 -15
- package/dist/components/miscellaneous/StyledFormGroup.js +16 -4
- package/dist/components/miscellaneous/StyledFormHelperText.js +12 -4
- package/dist/components/miscellaneous/StyledInputLabel.js +20 -4
- package/dist/components/mui-compat/Avatar.js +34 -0
- package/dist/components/mui-compat/ClickAwayListener.js +42 -0
- package/dist/components/mui-compat/Container.js +24 -0
- package/dist/components/mui-compat/Fade.js +29 -0
- package/dist/components/mui-compat/Fade.module.js +9 -0
- package/dist/components/mui-compat/FormLabel.js +22 -0
- package/dist/components/mui-compat/Paper.js +44 -0
- package/dist/components/mui-compat/Popper.js +35 -0
- package/dist/components/mui-compat/Skeleton.js +27 -0
- package/dist/components/mui-compat/Stack.js +24 -0
- package/dist/components/navigation/drawer/StyledDrawer.js +45 -4
- package/dist/components/navigation/link/StyledLink.module.js +5 -5
- package/dist/components/navigation/listbox/Listbox.js +7 -7
- package/dist/components/navigation/menu/StyledMenu.js +28 -11
- package/dist/components/navigation/menu/StyledMenuItem.js +21 -19
- package/dist/components/navigation/menu/StyledMenuList.js +34 -4
- package/dist/components/navigation/tabs/StyledTab.js +28 -13
- package/dist/components/navigation/tabs/StyledTabs.js +115 -66
- package/dist/components/navigation/tabs/TabsContext.js +6 -0
- package/dist/components/utils/accordion/base-ui/AccordionContext.js +10 -0
- package/dist/components/utils/accordion/base-ui/StyledAccordion.js +28 -21
- package/dist/components/utils/accordion/base-ui/StyledAccordion.module.js +7 -7
- package/dist/components/utils/accordion/base-ui/StyledAccordionDetails.js +28 -14
- package/dist/components/utils/accordion/base-ui/StyledAccordionSummary.js +34 -27
- package/dist/components/utils/copy-wrapper/CopyButton.js +8 -7
- package/dist/components/utils/copy-wrapper/CopyWrapper.js +23 -20
- package/dist/components/utils/filter-menu/StyledFilterButton.js +14 -13
- package/dist/components/utils/filter-menu/StyledFilterMenu.js +16 -15
- package/dist/components/utils/popover/StyledPopover.js +51 -15
- package/dist/components/utils/virtual-list/VirtualList.js +46 -0
- package/dist/datetime/components/date-picker/StyledDatePicker.js +17 -17
- package/dist/datetime/components/date-picker/components/BaseDatePickerInput.js +98 -99
- package/dist/datetime/components/date-picker/components/DatePickerButton.js +11 -9
- package/dist/datetime/components/date-picker/components/StyledCalendarPicker.js +11 -11
- package/dist/datetime/components/date-picker/components/StyledCalendarPicker.module.js +20 -20
- package/dist/datetime/components/date-picker/components/StyledCalendarPickerCaption.js +8 -7
- package/dist/datetime/components/date-picker/components/StyledCalendarPickerFooter.js +13 -14
- package/dist/datetime/components/date-picker/components/StyledCalendarPickerSelectMonth.js +17 -24
- package/dist/datetime/components/date-picker/components/StyledCalendarPickerSelectYear.js +7 -8
- package/dist/datetime/components/date-picker/components/StyledDayPicker.js +4 -5
- package/dist/datetime/components/date-picker/helpers.js +7 -7
- package/dist/datetime/components/date-picker/hooks/useDatePickerMask.js +3 -7
- package/dist/datetime/components/time-picker/StyledTimePicker.js +25 -25
- package/dist/datetime/components/time-picker/StyledTimePicker.module.js +6 -6
- package/dist/datetime/components/time-picker/TimePickerInput.js +56 -50
- package/dist/datetime/components/time-picker/TimePickerPopper.js +22 -19
- package/dist/datetime/components/time-picker/components/TimePickerColumn.js +12 -12
- package/dist/datetime/components/time-picker/helpers/getTimeFromValue.js +3 -3
- package/dist/datetime/helpers/cn.js +4 -5
- package/dist/datetime/hooks/useWindowWidthSize.hook.js +1 -1
- package/dist/helpers/arrays.js +4 -0
- package/dist/helpers/classOverride.js +12 -0
- package/dist/helpers/cn.js +4 -5
- package/dist/helpers/inputMask.js +58 -0
- package/dist/helpers/sx.js +46 -0
- package/dist/hooks/useFocusTrap.hook.js +34 -0
- package/dist/hooks/useTopLayer.hook.js +25 -0
- package/dist/index.js +203 -191
- package/dist/src/api-surface.test.d.ts +1 -0
- package/dist/src/components/custom/module/header-layout/DynamicToolbar.d.ts +10 -0
- package/dist/src/components/custom/module/module-title/StyledModuleTitle.d.ts +4 -0
- package/dist/src/components/custom/widget/widget/StyledWidget.d.ts +8 -0
- package/dist/src/components/custom/widget/widget-header/StyledWidgetHeader.d.ts +4 -0
- package/dist/src/components/custom/widget/widget-title/StyledWidgetTitle.d.ts +4 -0
- package/dist/src/components/data-display/ai-disclosure/StyledAIDisclosure.d.ts +7 -0
- package/dist/src/components/data-display/badge/StyledBadge.d.ts +40 -2
- package/dist/src/components/data-display/chip/StyledChip.d.ts +74 -5
- package/dist/src/components/data-display/chip/chipPadding.d.ts +3 -0
- package/dist/src/components/data-display/form-label/types.d.ts +11 -0
- package/dist/src/components/data-display/interactive-chip/StyledInteractiveChip.d.ts +22 -4
- package/dist/src/components/data-display/tooltip/StyledTooltip.d.ts +43 -1
- package/dist/src/components/data-display/typography/StyledTypography.d.ts +32 -1
- package/dist/src/components/feedback/dialog/StyledDialog.d.ts +60 -4
- package/dist/src/components/feedback/dialog/StyledDialogActions.d.ts +12 -2
- package/dist/src/components/feedback/dialog/StyledDialogContent.d.ts +12 -2
- package/dist/src/components/feedback/dialog/StyledDialogTitle.d.ts +10 -2
- package/dist/src/components/feedback/empty-page/StyledEmptyPage.d.ts +6 -0
- package/dist/src/components/feedback/filtered-empty-state/StyledFilteredEmptyState.d.ts +7 -0
- package/dist/src/components/feedback/loading/StyledLoading.d.ts +9 -0
- package/dist/src/components/feedback/minimizable-dialog/v2/types.d.ts +13 -0
- package/dist/src/components/feedback/minimizable-dialog/v2/useControlledProps.d.ts +4 -2
- package/dist/src/components/feedback/minimizable-dialog/v2/useTranslations.d.ts +17 -12
- package/dist/src/components/feedback/snack-bar/SnackbarProvider.d.ts +1 -1
- package/dist/src/components/feedback/snack-bar/StyledAlert.d.ts +41 -2
- package/dist/src/components/feedback/snack-bar/StyledAlertSnackbar.d.ts +1 -1
- package/dist/src/components/feedback/snack-bar/StyledSnackbar.d.ts +25 -2
- package/dist/src/components/feedback/snack-bar/components/StyledDefaultSnackbar.d.ts +10 -1
- package/dist/src/components/feedback/snack-bar/components/StyledInfoSnackbar.d.ts +1 -1
- package/dist/src/components/feedback/snack-bar/components/types.d.ts +1 -1
- package/dist/src/components/icons/index.d.ts +1 -0
- package/dist/src/components/icons/move-up-icon/MoveUpIcon.d.ts +2 -0
- package/dist/src/components/icons/move-up-icon/index.d.ts +1 -0
- package/dist/src/components/inputs/button/StyledButton.d.ts +15 -1
- package/dist/src/components/inputs/checkbox/base-ui/StyledCheckbox.d.ts +33 -4
- package/dist/src/components/inputs/dynamic-select/StyledDynamicSelect.d.ts +16 -0
- package/dist/src/components/inputs/dynamic-select/types.d.ts +25 -14
- package/dist/src/components/inputs/field-styles.d.ts +27 -0
- package/dist/src/components/inputs/input-field/StyledInputField.d.ts +85 -10
- package/dist/src/components/inputs/input-field/index.d.ts +1 -1
- package/dist/src/components/inputs/label/StyledLabel.d.ts +13 -0
- package/dist/src/components/inputs/radio-button/base-ui/RadioGroupContext.d.ts +10 -0
- package/dist/src/components/inputs/radio-button/base-ui/StyledRadio.d.ts +60 -5
- package/dist/src/components/inputs/radio-button/base-ui/StyledRadioGroup.d.ts +30 -7
- package/dist/src/components/inputs/search-field/StyledSearchField.d.ts +9 -1
- package/dist/src/components/inputs/select/StyledSelect.d.ts +70 -16
- package/dist/src/components/inputs/select/StyledSelectItem.d.ts +14 -2
- package/dist/src/components/inputs/select/index.d.ts +0 -1
- package/dist/src/components/inputs/select-autocomplete/StyledSelectAutocomplete.d.ts +120 -17
- package/dist/src/components/inputs/slider/StyledSlider.d.ts +66 -3
- package/dist/src/components/inputs/switch/base-ui/StyledSwitch.d.ts +44 -4
- package/dist/src/components/inputs/textarea/StyledTextarea.d.ts +19 -0
- package/dist/src/components/miscellaneous/FormControlContext.d.ts +14 -0
- package/dist/src/components/miscellaneous/StyledFormControl.d.ts +27 -2
- package/dist/src/components/miscellaneous/StyledFormControlLabel.d.ts +21 -2
- package/dist/src/components/miscellaneous/StyledFormGroup.d.ts +11 -2
- package/dist/src/components/miscellaneous/StyledFormHelperText.d.ts +12 -2
- package/dist/src/components/miscellaneous/StyledInputLabel.d.ts +20 -2
- package/dist/src/components/mui-compat/Avatar.d.ts +6 -0
- package/dist/src/components/mui-compat/ClickAwayListener.d.ts +19 -0
- package/dist/src/components/mui-compat/Container.d.ts +6 -0
- package/dist/src/components/mui-compat/Fade.d.ts +21 -0
- package/dist/src/components/mui-compat/FormLabel.d.ts +6 -0
- package/dist/src/components/mui-compat/Paper.d.ts +6 -0
- package/dist/src/components/mui-compat/Popper.d.ts +29 -0
- package/dist/src/components/mui-compat/Skeleton.d.ts +7 -0
- package/dist/src/components/mui-compat/Stack.d.ts +7 -0
- package/dist/src/components/mui-compat/index.d.ts +9 -0
- package/dist/src/components/mui-compat/types.d.ts +46 -0
- package/dist/src/components/navigation/drawer/StyledDrawer.d.ts +33 -2
- package/dist/src/components/navigation/link/StyledLink.d.ts +13 -0
- package/dist/src/components/navigation/menu/StyledMenu.d.ts +33 -2
- package/dist/src/components/navigation/menu/StyledMenuItem.d.ts +35 -2
- package/dist/src/components/navigation/menu/StyledMenuList.d.ts +16 -2
- package/dist/src/components/navigation/menu/index.d.ts +0 -1
- package/dist/src/components/navigation/tabs/StyledTab.d.ts +27 -3
- package/dist/src/components/navigation/tabs/StyledTabs.d.ts +22 -7
- package/dist/src/components/navigation/tabs/TabsContext.d.ts +11 -0
- package/dist/src/components/utils/accordion/base-ui/AccordionContext.d.ts +10 -0
- package/dist/src/components/utils/accordion/base-ui/StyledAccordion.d.ts +9 -3
- package/dist/src/components/utils/accordion/base-ui/StyledAccordionDetails.d.ts +5 -0
- package/dist/src/components/utils/accordion/base-ui/StyledAccordionSummary.d.ts +16 -4
- package/dist/src/components/utils/copy-wrapper/CopyWrapper.d.ts +6 -1
- package/dist/src/components/utils/filter-menu/StyledFilterButton.d.ts +4 -0
- package/dist/src/components/utils/filter-menu/StyledFilterMenu.d.ts +8 -2
- package/dist/src/components/utils/popover/StyledPopover.d.ts +39 -2
- package/dist/src/components/utils/virtual-list/VirtualList.d.ts +32 -0
- package/dist/src/components/utils/virtual-list/index.d.ts +1 -0
- package/dist/src/datetime/components/date-picker/StyledDatePicker.d.ts +11 -0
- package/dist/src/datetime/components/date-picker/components/DatePickerButton.d.ts +2 -0
- package/dist/src/datetime/components/date-picker/components/StyledCalendarPicker.d.ts +1 -1
- package/dist/src/datetime/components/date-picker/components/StyledDayPicker.d.ts +1 -1
- package/dist/src/datetime/components/date-picker/hooks/useDatePickerMask.d.ts +1 -2
- package/dist/src/datetime/components/date-picker/hooks/useDatePickerValidation.d.ts +7 -5
- package/dist/src/datetime/components/time-picker/StyledTimePicker.d.ts +10 -0
- package/dist/src/datetime/components/time-picker/TimePickerInput.d.ts +1 -1
- package/dist/src/datetime/components/time-picker/TimePickerPopper.d.ts +1 -1
- package/dist/src/datetime/components/time-picker/types.d.ts +1 -2
- package/dist/src/datetime/hooks/useToggleMenuVisibility.hook.d.ts +6 -4
- package/dist/src/datetime/shared-components/StyledFormControl.d.ts +1 -2
- package/dist/src/datetime/shared-components/StyledInputField.d.ts +1 -12
- package/dist/src/datetime/shared-components/StyledSelect.d.ts +1 -16
- package/dist/src/datetime/shared-components/StyledSelectItem.d.ts +1 -2
- package/dist/src/datetime/shared-components/StyledTooltip.d.ts +1 -2
- package/dist/src/helpers/applyImportantPadding.d.ts +8 -0
- package/dist/src/helpers/arrays.d.ts +2 -0
- package/dist/src/helpers/arrays.test.d.ts +1 -0
- package/dist/src/helpers/classOverride.d.ts +21 -0
- package/dist/src/helpers/classOverride.test.d.ts +1 -0
- package/dist/src/helpers/inputMask.d.ts +40 -0
- package/dist/src/helpers/inputMask.test.d.ts +1 -0
- package/dist/src/helpers/sx.d.ts +2 -0
- package/dist/src/helpers/sx.test.d.ts +1 -0
- package/dist/src/hooks/useFocusTrap.hook.d.ts +10 -0
- package/dist/src/hooks/useTopLayer.hook.d.ts +49 -0
- package/dist/src/index.d.ts +2 -1
- package/dist/src/table/components/columns/helpers/useElementHeightPx.d.ts +6 -3
- package/dist/src/table/components/columns/helpers/useProxyHorizontalScrollSync.d.ts +9 -6
- package/dist/src/table/hooks/useToggleMenuVisibility.hook.d.ts +6 -4
- package/dist/src/table/hooks/useTranslations.d.ts +15 -8
- package/dist/src/table/shared-components/StyledCheckbox.d.ts +7 -4
- package/dist/src/table/shared-components/StyledMenuItem.d.ts +18 -2
- package/dist/src/table/shared-components/menu-item/index.d.ts +13 -2
- package/dist/src/table/shared-components/tooltip/index.d.ts +5 -1
- package/dist/src/table/types.d.ts +1 -1
- package/dist/table/components/Fetching.js +4 -4
- package/dist/table/components/StyledTable.module.js +48 -48
- package/dist/table/components/TableRow.js +7 -7
- package/dist/table/components/TableSkeleton.js +6 -6
- package/dist/table/components/columns/action-column/actionColumn.js +14 -11
- package/dist/table/components/columns/action-column/components/HeaderActionMenu.js +52 -49
- package/dist/table/components/columns/action-column/components/RowActionMenu.js +40 -36
- package/dist/table/components/columns/expandColumn.js +12 -9
- package/dist/table/components/table-footer/TablePagination.js +28 -25
- package/dist/table/components/table-footer/TableRowCountSelect.js +31 -28
- package/dist/table/components/table-header/TableHeaderCell.js +54 -45
- package/dist/table/custom-features/focus-rows/FocusRowsFeature.js +29 -25
- package/dist/table/helpers/cn.js +4 -5
- package/dist/table/hooks/useColumnVirtualizer.js +1 -1
- package/dist/table/hooks/usePersistedPageSize.js +6 -6
- package/dist/table/hooks/useTranslations.js +6 -4
- package/dist/table/hooks/useWindowWidthSize.hook.js +1 -1
- package/dist/table/shared-components/StyledCheckbox.js +54 -55
- package/dist/table/shared-components/StyledCheckbox.module.js +9 -9
- package/dist/table/shared-components/StyledMenuItem.js +14 -17
- package/dist/table/shared-components/button/StyledButton.module.js +8 -8
- package/dist/table/shared-components/menu-item/index.js +15 -16
- package/dist/table/shared-components/tooltip/index.js +4 -23
- package/package.json +9 -18
- package/src/styles/components-colors/inputVariables.css +59 -57
- package/src/styles/index.css +38 -0
- package/dist/components/feedback/dialog/StyledDialogActions.module.js +0 -8
- package/dist/components/feedback/dialog/StyledDialogContent.module.js +0 -4
- package/dist/components/feedback/dialog/StyledDialogTitle.module.js +0 -4
- package/dist/components/icons/arrow-expand/ArrowExpand.js +0 -18
- package/dist/components/icons/arrow-expand/index.js +0 -1
- package/dist/components/icons/arrow-shrink/ArrowShrink.js +0 -18
- package/dist/components/icons/arrow-shrink/index.js +0 -1
- package/dist/components/inputs/checkbox/StyledCheckbox.js +0 -20
- package/dist/components/inputs/radio-button/StyledRadio.js +0 -17
- package/dist/datetime/components/date-picker/components/HelperTextWithTooltip.js +0 -39
- package/dist/datetime/shared-components/ExpandIcon.js +0 -18
- package/dist/datetime/shared-components/StyledFormControl.js +0 -23
- package/dist/datetime/shared-components/StyledInputField.js +0 -47
- package/dist/datetime/shared-components/StyledSelect.js +0 -47
- package/dist/datetime/shared-components/StyledSelectItem.js +0 -13
- package/dist/datetime/shared-components/StyledTooltip.js +0 -32
- package/dist/src/components/icons/arrow-expand/ArrowExpand.d.ts +0 -2
- package/dist/src/components/icons/arrow-expand/index.d.ts +0 -1
- package/dist/src/components/icons/arrow-shrink/ArrowShrink.d.ts +0 -2
- package/dist/src/components/icons/arrow-shrink/index.d.ts +0 -1
- package/dist/src/components/inputs/checkbox/StyledCheckbox.d.ts +0 -4
- package/dist/src/components/inputs/radio-button/StyledRadio.d.ts +0 -4
- package/dist/src/components/inputs/radio-button/StyledRadioGroup.d.ts +0 -4
- package/dist/src/components/inputs/switch/StyledSwitch.d.ts +0 -5
- package/dist/src/components/utils/accordion/StyledAccordion.d.ts +0 -2
- package/dist/src/components/utils/accordion/StyledAccordionDetails.d.ts +0 -2
- package/dist/src/components/utils/accordion/StyledAccordionSummary.d.ts +0 -8
- package/dist/src/datetime/components/date-picker/components/HelperTextWithTooltip.d.ts +0 -5
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
import { default as React, ReactNode } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* @figmaNode none — layout wrapper (padding 16, space-between): DS `StyledWidgetTitle` (Section title
|
|
4
|
+
* 18/28 delta-800) + right-aligned actions slot. No colours of its own.
|
|
5
|
+
*/
|
|
2
6
|
export declare const StyledWidgetHeader: React.FC<{
|
|
3
7
|
actions?: ReactNode;
|
|
4
8
|
title?: string;
|
|
@@ -1,3 +1,7 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @figmaNode none — DS **Section title** typography (Roboto SemiBold 18/28, `delta-800`). Widget/
|
|
3
|
+
* widget-header heading; theme-safe via the delta token layer.
|
|
4
|
+
*/
|
|
1
5
|
export declare const StyledWidgetTitle: import('node_modules/@types/react').ForwardRefExoticComponent<{
|
|
2
6
|
className?: string;
|
|
3
7
|
} & {
|
|
@@ -1,5 +1,12 @@
|
|
|
1
1
|
import { FunctionComponent } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* @figmaNode none — bespoke "AI" disclosure watermark (no Design-System component). Token-clean and
|
|
4
|
+
* theme-safe: container/watermark border `delta-700`, label = Small 12/16 (ls 0.24px), watermark pill
|
|
5
|
+
* = 10px SemiBold uppercase in a `delta-700` 12-radius border. Tooltip via the aligned `StyledTooltip`.
|
|
6
|
+
*/
|
|
2
7
|
export declare const StyledAIDisclosure: FunctionComponent<{
|
|
8
|
+
/** @figmaProp none — the disclosure label (Small 12/16) */
|
|
3
9
|
label?: string;
|
|
10
|
+
/** @figmaProp none — optional tooltip body (via StyledTooltip) */
|
|
4
11
|
tooltip?: string;
|
|
5
12
|
}>;
|
|
@@ -1,8 +1,46 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { CSSProperties, ElementType, HTMLAttributes, ReactNode } from 'react';
|
|
2
2
|
type StyledBadgeSize = 'medium' | 'small';
|
|
3
|
+
/**
|
|
4
|
+
* @figmaNode wXrXt5uKNNzV2DnQCgyYZH#15181-43817
|
|
5
|
+
* Figma "Badge". Number badge = solid gama-500 pill, white Helper-Semibold 14px (h20/px6/r20);
|
|
6
|
+
* `dot` variant = 8px dot (Unread/Filters). `color` selects the badge palette (primary→teal number
|
|
7
|
+
* badge, error→soft error-100/error-600); other colors are app extensions with no Figma type.
|
|
8
|
+
*/
|
|
9
|
+
interface BadgeProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'color'> {
|
|
10
|
+
/** @figmaProp Badge content (the number/label) */
|
|
11
|
+
badgeContent?: ReactNode;
|
|
12
|
+
/** @figmaProp Type/colour = primary→number badge (gama-500) | error→error-100/600 | others = app */
|
|
13
|
+
color?: string;
|
|
14
|
+
max?: number;
|
|
15
|
+
showZero?: boolean;
|
|
16
|
+
/** @figmaProp Type = dot→"Unread/Filters" (8px) | standard→number badge */
|
|
17
|
+
variant?: 'standard' | 'dot';
|
|
18
|
+
invisible?: boolean;
|
|
19
|
+
anchorOrigin?: {
|
|
20
|
+
vertical: 'top' | 'bottom';
|
|
21
|
+
horizontal: 'left' | 'right';
|
|
22
|
+
};
|
|
23
|
+
overlap?: 'rectangular' | 'circular';
|
|
24
|
+
component?: ElementType;
|
|
25
|
+
classes?: Record<string, string>;
|
|
26
|
+
slots?: Record<string, unknown>;
|
|
27
|
+
slotProps?: {
|
|
28
|
+
badge?: {
|
|
29
|
+
className?: string;
|
|
30
|
+
style?: CSSProperties;
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
sx?: unknown;
|
|
34
|
+
}
|
|
3
35
|
type StyledBadgeProps = BadgeProps & {
|
|
4
36
|
dataTest: string;
|
|
5
37
|
size?: StyledBadgeSize;
|
|
6
38
|
};
|
|
7
|
-
|
|
39
|
+
/**
|
|
40
|
+
* Native, MUI-free reimplementation of the previous `Badge` passthrough. Reproduces MUI v9 badge
|
|
41
|
+
* metrics/positioning via Tailwind, this library's custom `primary` green, and the `small` size.
|
|
42
|
+
* The established styling API `sx={{ '& .MuiBadge-badge': {...} }}` is preserved by extracting that
|
|
43
|
+
* slot and applying `resolveSx` to the badge span (DEC-007 slot-sx). Signature unchanged (DEC-003).
|
|
44
|
+
*/
|
|
45
|
+
export declare const StyledBadge: ({ color, dataTest, size, badgeContent, max, showZero, variant, invisible, anchorOrigin, children, className, sx, overlap: _overlap, classes: _classes, slots: _slots, slotProps, component: _component, ...props }: StyledBadgeProps) => JSX.Element;
|
|
8
46
|
export {};
|
|
@@ -1,7 +1,76 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
import { MouseEvent, ReactElement, ReactNode } from 'react';
|
|
2
|
+
interface ChipClasses {
|
|
3
|
+
root?: string;
|
|
4
|
+
label?: string;
|
|
5
|
+
avatar?: string;
|
|
6
|
+
icon?: string;
|
|
7
|
+
deleteIcon?: string;
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* @figmaNode wXrXt5uKNNzV2DnQCgyYZH#13248-31089
|
|
11
|
+
* Figma "Tag Chip" / `_BASE_Tag`. Figma **State** (Enabled/Hovered/Focused/Read only/Disabled) is
|
|
12
|
+
* driven by native hover/focus + `readOnly`/`disabled` (or forced via `data-hovered`/`data-focus`).
|
|
13
|
+
* Figma **Type** (Standard/User tag/Group tag/Checkbox/Radio) is expressed via slots (`avatar`/`icon`/
|
|
14
|
+
* `label` content) rather than an enum. **Selected** (on/off) is a checkbox/radio concern (see
|
|
15
|
+
* StyledInteractiveChip). Non-annotated props are behavioral / MUI `Chip` API-parity (DEC-003).
|
|
16
|
+
*/
|
|
17
|
+
export interface StyledChipProps {
|
|
18
|
+
/** @figmaProp none — test hook */
|
|
4
19
|
dataTest: string;
|
|
20
|
+
/** @figmaProp Text (the chip label) */
|
|
21
|
+
label?: ReactNode;
|
|
22
|
+
/** @figmaProp none — cosmetically inert; the design always renders white body + delta border */
|
|
23
|
+
variant?: 'filled' | 'outlined';
|
|
24
|
+
/** @figmaProp none — cosmetically inert */
|
|
25
|
+
color?: string;
|
|
26
|
+
/** @figmaProp none — app size (Figma _BASE_Tag is a single 32px height; `small`=24 is app-specific) */
|
|
27
|
+
size?: 'small' | 'medium';
|
|
28
|
+
/** @figmaProp State = true→"Disabled" */
|
|
29
|
+
disabled?: boolean;
|
|
30
|
+
/** @figmaProp State = true→"Read only" */
|
|
5
31
|
readOnly?: boolean;
|
|
6
|
-
|
|
7
|
-
|
|
32
|
+
/** @figmaProp State = drives interactive Hovered/Focused/Pressed via native events */
|
|
33
|
+
clickable?: boolean;
|
|
34
|
+
/** @figmaProp Avatar/start icon slot (Type=User tag etc.) */
|
|
35
|
+
icon?: ReactElement;
|
|
36
|
+
/** @figmaProp Avatar slot (Type=User tag) */
|
|
37
|
+
avatar?: ReactElement;
|
|
38
|
+
/** @figmaProp Clear element */
|
|
39
|
+
deleteIcon?: ReactElement;
|
|
40
|
+
/** @figmaProp Clear element (present → chip shows the delete/Clear button) */
|
|
41
|
+
onDelete?: (event: MouseEvent<HTMLElement>) => void;
|
|
42
|
+
onClick?: (event: MouseEvent<HTMLElement>) => void;
|
|
43
|
+
/** Forwarded to the chip root — e.g. `stopPropagation` so a chip click in a row doesn't select the row. */
|
|
44
|
+
onMouseDown?: (event: MouseEvent<HTMLDivElement>) => void;
|
|
45
|
+
onMouseUp?: (event: MouseEvent<HTMLDivElement>) => void;
|
|
46
|
+
className?: string;
|
|
47
|
+
classes?: ChipClasses;
|
|
48
|
+
sx?: unknown;
|
|
49
|
+
tabIndex?: number;
|
|
50
|
+
'aria-label'?: string;
|
|
51
|
+
/** Overrides the default `role="button"`/no-role logic — for `StyledInteractiveChip`'s
|
|
52
|
+
* checkbox/radio chip, whose inner control is `decorative`/`aria-hidden` (a real, even hidden,
|
|
53
|
+
* `<input>` nested inside this chip's own interactive root is an axe `nested-interactive`
|
|
54
|
+
* violation), so the chip root itself must carry the real checkbox/radio semantics. Unlike the
|
|
55
|
+
* `clickable`-driven `role="button"`, this is rendered **regardless of `readOnly`** — a read-only
|
|
56
|
+
* checkbox/radio still needs its role + checked state announced, just not `role="button"` (which
|
|
57
|
+
* implies operability). */
|
|
58
|
+
role?: 'checkbox' | 'radio';
|
|
59
|
+
/** Paired with `role` above — the checked state of a checkbox/radio chip. */
|
|
60
|
+
'aria-checked'?: boolean;
|
|
61
|
+
/** Paired with `role` above — mirrors `readOnly` for AT that specifically looks for `aria-readonly`
|
|
62
|
+
* on a checkbox/radio (unlike `role="button"`, `aria-readonly` doesn't imply the role disappears). */
|
|
63
|
+
'aria-readonly'?: boolean;
|
|
64
|
+
/** @figmaProp State = present→"Hovered" (forced for state tables) */
|
|
65
|
+
'data-hovered'?: string;
|
|
66
|
+
/** @figmaProp State = present→"Focused" (forced for state tables) */
|
|
67
|
+
'data-focus'?: string;
|
|
68
|
+
}
|
|
69
|
+
/**
|
|
70
|
+
* Native replacement for MUI `Chip` — a styled element with optional avatar/icon start slot, a
|
|
71
|
+
* label, and a delete button. Interactive hover/focus/active visuals also respond to the
|
|
72
|
+
* `data-hovered`/`data-focus` attributes MUI set (state tables rely on them). Public props +
|
|
73
|
+
* `classes`/`sx` slots preserved (DEC-003). TASK-101a.
|
|
74
|
+
*/
|
|
75
|
+
export declare const StyledChip: import('node_modules/@types/react').ForwardRefExoticComponent<StyledChipProps & import('node_modules/@types/react').RefAttributes<HTMLDivElement>>;
|
|
76
|
+
export {};
|
|
@@ -1,9 +1,20 @@
|
|
|
1
1
|
import { MouseEventHandler, ReactNode } from 'react';
|
|
2
2
|
export type IFormLabelSize = 'md' | 'base' | 'lg' | 'xl';
|
|
3
|
+
/**
|
|
4
|
+
* @figmaNode none — no standalone Figma component; maps to DS **typography** styles (Design-System
|
|
5
|
+
* wXrXt5uKNNzV2DnQCgyYZH), colours from the delta token layer (delta-700/-800).
|
|
6
|
+
* md = Helper 14/20 Regular · base = Body Base Semibold 16/24 · lg = Section title 18/28 SemiBold ·
|
|
7
|
+
* xl = 20/28 SemiBold.
|
|
8
|
+
*/
|
|
3
9
|
export interface IStyledFormLabel {
|
|
10
|
+
/** @figmaProp none — the label text */
|
|
4
11
|
title: ReactNode;
|
|
12
|
+
/** @figmaProp none — behavioral */
|
|
5
13
|
onClick?: MouseEventHandler<HTMLDivElement>;
|
|
14
|
+
/** @figmaProp none — behavioral */
|
|
6
15
|
className?: string;
|
|
16
|
+
/** @figmaProp none — test hook */
|
|
7
17
|
dataTest?: string;
|
|
18
|
+
/** @figmaProp Size = md→Helper | base→Body Base Semibold | lg→Section title | xl→20/28 SemiBold */
|
|
8
19
|
size?: IFormLabelSize;
|
|
9
20
|
}
|
|
@@ -1,10 +1,28 @@
|
|
|
1
|
-
import { ComponentProps
|
|
1
|
+
import { ComponentProps } from 'react';
|
|
2
2
|
import { StyledChip } from '../chip';
|
|
3
|
-
|
|
3
|
+
/**
|
|
4
|
+
* @figmaNode wXrXt5uKNNzV2DnQCgyYZH#13248-31089
|
|
5
|
+
* Figma "Tag Chip" **Type=Checkbox** (node 18832-25686 / selected 18869-29068) and **Type=Radio**
|
|
6
|
+
* (18832-25900 / selected 18869-29122). It is a `StyledChip` (h32, radius25, border delta-300, label
|
|
7
|
+
* Body Base 16 delta-700; hover gama-200 + gama-25, focus gama-400 — all inherited) whose start slot
|
|
8
|
+
* is a native checkbox/radio. Figma **State** (Enabled/Hovered/Focused/Read-only/Disabled) ← native
|
|
9
|
+
* + `readOnly`/`disabled`; **Selected** ← `checked`. A selected **radio** additionally gets the teal
|
|
10
|
+
* chip border/fill (gama-400 / gama-50); a selected **checkbox** only checks its box (matching Figma).
|
|
11
|
+
* Non-annotated props are behavioral / forwarded to `StyledChip`.
|
|
12
|
+
*/
|
|
4
13
|
export interface StyledInteractiveChipProps extends ComponentProps<typeof StyledChip> {
|
|
14
|
+
/** @figmaProp Type = "Checkbox" | "Radio" (the start-slot control) */
|
|
5
15
|
type?: 'checkbox' | 'radio';
|
|
6
|
-
|
|
16
|
+
/** @figmaProp Selected = true→"on" | false→"off" */
|
|
17
|
+
checked?: boolean;
|
|
18
|
+
/** @figmaProp none — app size (Figma Tag Chip is a single 32px height) */
|
|
7
19
|
size?: 'small' | 'medium';
|
|
20
|
+
/** @figmaProp none — accessible name for the control */
|
|
8
21
|
ariaLabel?: string;
|
|
9
22
|
}
|
|
10
|
-
|
|
23
|
+
/**
|
|
24
|
+
* A `StyledChip` whose avatar is a native checkbox or radio (base-ui controls now render their own
|
|
25
|
+
* checked/read-only colours, so the old nested `.MuiChip-avatar .Mui*` `sx` is gone). Public props
|
|
26
|
+
* preserved (DEC-003). TASK-101a.
|
|
27
|
+
*/
|
|
28
|
+
export declare const StyledInteractiveChip: import('node_modules/@types/react').ForwardRefExoticComponent<Omit<StyledInteractiveChipProps, "ref"> & import('node_modules/@types/react').RefAttributes<HTMLDivElement>>;
|
|
@@ -1,2 +1,44 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { CSSProperties, ReactElement, ReactNode } from 'react';
|
|
2
|
+
import { Placement } from '@floating-ui/react';
|
|
3
|
+
interface TooltipSlotProps {
|
|
4
|
+
tooltip?: {
|
|
5
|
+
sx?: unknown;
|
|
6
|
+
className?: string;
|
|
7
|
+
style?: CSSProperties;
|
|
8
|
+
};
|
|
9
|
+
popper?: unknown;
|
|
10
|
+
transition?: unknown;
|
|
11
|
+
arrow?: unknown;
|
|
12
|
+
}
|
|
13
|
+
/**
|
|
14
|
+
* @figmaNode wXrXt5uKNNzV2DnQCgyYZH#14680-25248
|
|
15
|
+
* Figma "Tooltip" (Theme=Day): delta-800 #363e4a body, px8/py4, radius 3, Helper 14px/lh20 white,
|
|
16
|
+
* max-width 320, optional arrow (9 placements). Float drop-shadow.
|
|
17
|
+
*/
|
|
18
|
+
export interface TooltipProps {
|
|
19
|
+
title: ReactNode;
|
|
20
|
+
children: ReactElement;
|
|
21
|
+
/** @figmaProp Arrow placement (Top/Bottom/Left/Right × start/middle/end) */
|
|
22
|
+
placement?: Placement;
|
|
23
|
+
/** @figmaProp Arrow = true→"Arrow" | false→"None" */
|
|
24
|
+
arrow?: boolean;
|
|
25
|
+
enterDelay?: number;
|
|
26
|
+
leaveDelay?: number;
|
|
27
|
+
open?: boolean;
|
|
28
|
+
onOpen?: () => void;
|
|
29
|
+
onClose?: () => void;
|
|
30
|
+
disableHoverListener?: boolean;
|
|
31
|
+
disableFocusListener?: boolean;
|
|
32
|
+
disableTouchListener?: boolean;
|
|
33
|
+
offsetDistance?: number;
|
|
34
|
+
className?: string;
|
|
35
|
+
slotProps?: TooltipSlotProps;
|
|
36
|
+
}
|
|
37
|
+
/**
|
|
38
|
+
* Tooltip built on `@floating-ui/react` (replaces MUI `Tooltip`) — hover(+`enterDelay`)/focus open,
|
|
39
|
+
* dismiss on blur/esc, `flip`/`shift` collision handling, optional arrow, portalled. Empty `title`
|
|
40
|
+
* renders the child alone (MUI parity). Preserves the `#363E4A` design and the `title`/`placement`/
|
|
41
|
+
* `arrow`/`enterDelay`/`open`/`slotProps` surface (DEC-003). TASK-301.
|
|
42
|
+
*/
|
|
2
43
|
export declare const StyledTooltip: (props: TooltipProps) => JSX.Element;
|
|
44
|
+
export {};
|
|
@@ -1,2 +1,33 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { CSSProperties, ElementType, HTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
export interface TypographyProps extends Omit<HTMLAttributes<HTMLElement>, 'color'> {
|
|
3
|
+
variant?: string;
|
|
4
|
+
variantMapping?: Record<string, string>;
|
|
5
|
+
align?: CSSProperties['textAlign'];
|
|
6
|
+
noWrap?: boolean;
|
|
7
|
+
gutterBottom?: boolean;
|
|
8
|
+
color?: string;
|
|
9
|
+
component?: ElementType;
|
|
10
|
+
sx?: unknown;
|
|
11
|
+
classes?: Record<string, string>;
|
|
12
|
+
children?: ReactNode;
|
|
13
|
+
}
|
|
14
|
+
/**
|
|
15
|
+
* Native, MUI-free reimplementation of the previous `Typography` passthrough. Reproduces MUI v9's
|
|
16
|
+
* default typography scale via Tailwind utilities, the variant→element mapping, and the
|
|
17
|
+
* `align`/`noWrap`/`gutterBottom`/`color` props. `sx` is honoured via `resolveSx` (DEC-007).
|
|
18
|
+
* Signature unchanged: still accepts `TypographyProps` (DEC-003).
|
|
19
|
+
*
|
|
20
|
+
* @figmaNode none — **MUI-compatibility shim, NOT a Design-System component.** Its `variant` scale
|
|
21
|
+
* (h1=6rem light, body1=1rem, MUI palette colours…) intentionally mirrors MUI v9 so pre-existing
|
|
22
|
+
* `<StyledTypography variant="…">` call-sites keep rendering identically. **Do not rescale it to the
|
|
23
|
+
* Figma type scale** — that would silently change every consumer.
|
|
24
|
+
*
|
|
25
|
+
* The authoritative ASMA Design-System type scale (Figma "Typography" `wXrXt5uKNNzV2DnQCgyYZH#23020-67726`)
|
|
26
|
+
* lives in the Tailwind text-* layer and is applied directly per component — it maps 1:1 onto the
|
|
27
|
+
* default Tailwind scale (Roboto, letter-spacing 0 unless noted):
|
|
28
|
+
* Page title 24/32 → `text-2xl font-semibold` · Subtitle 20/28 → `text-xl font-semibold` ·
|
|
29
|
+
* Section title 18/28 → `text-lg font-semibold` · Body Base 16/24 → `text-base` (+`font-semibold`) ·
|
|
30
|
+
* Helper 14/20 → `text-sm` (+`font-semibold`) · Small 12/16 → `text-xs tracking-[0.24px]` ·
|
|
31
|
+
* X-small uppercase 11/12 → `text-[11px] tracking-[0.55px] uppercase font-semibold`.
|
|
32
|
+
*/
|
|
2
33
|
export declare const StyledTypography: (props: TypographyProps) => JSX.Element;
|
|
@@ -1,11 +1,67 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
export
|
|
1
|
+
import { CSSProperties, ReactNode, SyntheticEvent } from 'react';
|
|
2
|
+
export type DialogCloseReason = 'escapeKeyDown' | 'backdropClick';
|
|
3
|
+
export type DialogMaxWidth = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | false;
|
|
4
|
+
interface DialogPaperProps {
|
|
5
|
+
className?: string;
|
|
6
|
+
style?: CSSProperties;
|
|
7
|
+
sx?: unknown;
|
|
8
|
+
ref?: React.Ref<HTMLDialogElement>;
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* @figmaNode wXrXt5uKNNzV2DnQCgyYZH#15820-18954
|
|
12
|
+
* Figma "Dialog": white paper radius 8 with the Dialogue-popup shadow (#22213366, 0 4 40) over a
|
|
13
|
+
* bg/modal #626e7eb2 overlay. Header = optional label (Helper, delta-600) + title (Page title 24
|
|
14
|
+
* SemiBold, delta-800) + close button. `fullScreen`/mobile drops the radius and fills the viewport.
|
|
15
|
+
*/
|
|
16
|
+
export interface IStyledDialogProps {
|
|
17
|
+
open: boolean;
|
|
18
|
+
onClose?: (event: SyntheticEvent | Event, reason: DialogCloseReason) => void;
|
|
19
|
+
children?: ReactNode;
|
|
20
|
+
dataTest: string;
|
|
21
|
+
maxWidth?: DialogMaxWidth;
|
|
22
|
+
fullWidth?: boolean;
|
|
23
|
+
fullScreen?: boolean;
|
|
24
|
+
scroll?: 'paper' | 'body';
|
|
25
|
+
disableEscapeKeyDown?: boolean;
|
|
26
|
+
/**
|
|
27
|
+
* Accepted for MUI `Dialog` parity (DEC-003). Focus is trapped by the native `<dialog>`
|
|
28
|
+
* `showModal()`, so this MUI `Modal` prop is a typed no-op.
|
|
29
|
+
*/
|
|
30
|
+
disableEnforceFocus?: boolean;
|
|
31
|
+
className?: string;
|
|
32
|
+
style?: CSSProperties;
|
|
33
|
+
sx?: unknown;
|
|
34
|
+
/**
|
|
35
|
+
* MUI `Dialog` `classes` parity (DEC-003). The native `<dialog>` is the paper, so `classes.paper`
|
|
36
|
+
* is merged onto it; `classes.root` is accepted as a typed no-op (no separate root element).
|
|
37
|
+
*/
|
|
38
|
+
classes?: {
|
|
39
|
+
paper?: string;
|
|
40
|
+
root?: string;
|
|
41
|
+
};
|
|
42
|
+
PaperProps?: DialogPaperProps;
|
|
43
|
+
slotProps?: {
|
|
44
|
+
paper?: DialogPaperProps;
|
|
45
|
+
backdrop?: Record<string, unknown>;
|
|
46
|
+
};
|
|
4
47
|
onCloseText?: ReactNode;
|
|
48
|
+
/** @figmaProp none — behavioral */
|
|
5
49
|
showCloseIcon?: boolean;
|
|
6
|
-
|
|
50
|
+
/** @figmaProp header Label (Helper 14, delta-600) */
|
|
7
51
|
dialogLabel?: ReactNode;
|
|
52
|
+
/** @figmaProp header Title (Page title 24 SemiBold, delta-800) */
|
|
8
53
|
dialogTitle?: ReactNode;
|
|
9
54
|
dialogHeaderNode?: ReactNode;
|
|
10
55
|
}
|
|
56
|
+
/**
|
|
57
|
+
* Modal dialog built on the native `<dialog>` element (replaces MUI `Dialog`) — backdrop, focus
|
|
58
|
+
* trap and ESC handling come from `showModal()` for free. The `<dialog>` element is the "paper",
|
|
59
|
+
* so `PaperProps`/`slotProps.paper` and `className` style it directly; `::backdrop` is the overlay.
|
|
60
|
+
* Public props preserved (DEC-003). TASK-205.
|
|
61
|
+
*
|
|
62
|
+
* ponytail: open/close is instant (no MUI fade) and body-scroll behind the modal isn't locked —
|
|
63
|
+
* both known ceilings; Chromatic in CI is the visual gate. Upgrade path: add `@starting-style`
|
|
64
|
+
* transitions and a scroll-lock effect if a diff calls for it.
|
|
65
|
+
*/
|
|
11
66
|
export declare const StyledDialog: React.FC<IStyledDialogProps>;
|
|
67
|
+
export {};
|
|
@@ -1,2 +1,12 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { HTMLAttributes } from 'react';
|
|
2
|
+
interface DialogActionsProps extends HTMLAttributes<HTMLDivElement> {
|
|
3
|
+
sx?: unknown;
|
|
4
|
+
classes?: Record<string, string>;
|
|
5
|
+
disableSpacing?: boolean;
|
|
6
|
+
}
|
|
7
|
+
/**
|
|
8
|
+
* MUI-free dialog actions: a right-aligned flex row of buttons; on mobile each button wrapper
|
|
9
|
+
* stretches full width (was a SCSS media query, now Tailwind `max-md:` arbitrary variant). TASK-101.
|
|
10
|
+
*/
|
|
11
|
+
export declare const StyledDialogActions: ({ children, className, sx, style, classes: _classes, disableSpacing: _disableSpacing, ...rest }: DialogActionsProps) => JSX.Element;
|
|
12
|
+
export {};
|
|
@@ -1,2 +1,12 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { HTMLAttributes } from 'react';
|
|
2
|
+
interface DialogContentProps extends HTMLAttributes<HTMLDivElement> {
|
|
3
|
+
sx?: unknown;
|
|
4
|
+
classes?: Record<string, string>;
|
|
5
|
+
dividers?: boolean;
|
|
6
|
+
}
|
|
7
|
+
/**
|
|
8
|
+
* MUI-free dialog content: a scrollable `<div>` with the previous SCSS metrics as Tailwind,
|
|
9
|
+
* plus MUI's optional `dividers` borders. TASK-101.
|
|
10
|
+
*/
|
|
11
|
+
export declare const StyledDialogContent: ({ children, className, sx, style, dividers, classes: _classes, ...rest }: DialogContentProps) => JSX.Element;
|
|
12
|
+
export {};
|
|
@@ -1,2 +1,10 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { HTMLAttributes } from 'react';
|
|
2
|
+
interface DialogTitleProps extends HTMLAttributes<HTMLHeadingElement> {
|
|
3
|
+
sx?: unknown;
|
|
4
|
+
classes?: Record<string, string>;
|
|
5
|
+
}
|
|
6
|
+
/**
|
|
7
|
+
* MUI-free dialog title: a semantic `<h2>` with the previous SCSS metrics as Tailwind. TASK-101.
|
|
8
|
+
*/
|
|
9
|
+
export declare const StyledDialogTitle: ({ children, className, sx, style, classes: _classes, ...rest }: DialogTitleProps) => JSX.Element | null;
|
|
10
|
+
export {};
|
|
@@ -1,4 +1,10 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* @figmaNode wXrXt5uKNNzV2DnQCgyYZH#22878-67600 (Design-System · "Empty state")
|
|
4
|
+
*
|
|
5
|
+
* Inline empty placeholder: icon 24 + Helper text (14/20 Regular), both in the placeholder grey
|
|
6
|
+
* `text-icon/placeholder` (= `delta-500`), gap 8, centered.
|
|
7
|
+
*/
|
|
2
8
|
export declare const StyledEmptyPage: FC<{
|
|
3
9
|
emptyText: string;
|
|
4
10
|
isEmpty?: boolean;
|
|
@@ -1,5 +1,12 @@
|
|
|
1
1
|
import { FC, ReactNode } from 'react';
|
|
2
2
|
type FilteredEmptyStateLocale = 'en' | 'no';
|
|
3
|
+
/**
|
|
4
|
+
* @figmaNode wXrXt5uKNNzV2DnQCgyYZH#37513-171511 (Design-System · "Filters empty state")
|
|
5
|
+
*
|
|
6
|
+
* Composes `StyledEmptyPage` (delta-500 placeholder) + a reset block: title = Helper Semibold 14/20
|
|
7
|
+
* `delta-800`, description = Helper 14/20 `delta-600`, reset = **medium** Tertiary button (label
|
|
8
|
+
* Body Base Semibold 16/24 `gama-500` + 24px filter-off icon). Container gap 16, reset block gap 8.
|
|
9
|
+
*/
|
|
3
10
|
export interface StyledFilteredEmptyStateProps {
|
|
4
11
|
dataTest: string;
|
|
5
12
|
emptyText?: string;
|
|
@@ -1,7 +1,16 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* @figmaNode wXrXt5uKNNzV2DnQCgyYZH#21335-39606 (Design-System · "Loading spinner")
|
|
4
|
+
*
|
|
5
|
+
* Centered loading spinner in the primary accent (`gama-500` — teal/jade), matching the DS spinner
|
|
6
|
+
* used in buttons/inline. Already conformant: primary colour + 16/24/32 sizes.
|
|
7
|
+
*/
|
|
2
8
|
interface StyledLoadingProps {
|
|
9
|
+
/** @figmaProp none — visibility toggle */
|
|
3
10
|
isLoading: boolean;
|
|
11
|
+
/** @figmaProp none — behavioral */
|
|
4
12
|
className?: string;
|
|
13
|
+
/** @figmaProp Size = small→16 | medium→24 | large→32 (spinner px) */
|
|
5
14
|
size?: 'small' | 'medium' | 'large';
|
|
6
15
|
}
|
|
7
16
|
export declare const StyledLoading: FC<StyledLoadingProps>;
|
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
2
|
export type ILocale = 'en' | 'no';
|
|
3
|
+
/**
|
|
4
|
+
* @figmaNode wXrXt5uKNNzV2DnQCgyYZH#20049-111828 (Design-System · "Dialog minimized")
|
|
5
|
+
*
|
|
6
|
+
* Bespoke bottom-right minimizable dialog (no single DS component). It reuses the DS **modal family**
|
|
7
|
+
* conventions from `StyledDialog`: paper white radius 8 + **Dialogue-popup** shadow (#22213366, 0 4 40),
|
|
8
|
+
* fullscreen overlay `bg/modal` #626e7e @70%, header title Page title 24/32 SemiBold `delta-800` +
|
|
9
|
+
* optional Helper `delta-700` label over a `delta-200` divider. The **minimized bar** matches the DS
|
|
10
|
+
* "Dialog minimized" node: radius 8, Dialogue-popup shadow, Section title 18/28 SemiBold `delta-800`.
|
|
11
|
+
* (Minimized expand/close are compact icon-only buttons — deliberately terser than the labelled Figma
|
|
12
|
+
* variant to keep the bar narrow for the multi-dialog Stack.) Token-clean; no visual change this pass.
|
|
13
|
+
*
|
|
14
|
+
* Positioning (`--dialog-right`/width/`bottom-4`) is owned by `createDialogStack`; do not restyle it.
|
|
15
|
+
*/
|
|
3
16
|
export interface IMinimizableDialogV2Props {
|
|
4
17
|
open: boolean;
|
|
5
18
|
onClose: () => void;
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import { IMinimizableDialogV2Props } from './types';
|
|
2
|
-
|
|
2
|
+
interface ControlledProps {
|
|
3
3
|
fullScreen: boolean;
|
|
4
4
|
setFullScreen: (fullScreen: boolean) => void;
|
|
5
5
|
minimized: boolean;
|
|
6
6
|
setMinimized: (minimized: boolean) => void;
|
|
7
|
-
}
|
|
7
|
+
}
|
|
8
|
+
export declare const useControlledProps: ({ fullScreenState, handleFullScreenState, minimizedState, handleMinimizedState, }: IMinimizableDialogV2Props) => ControlledProps;
|
|
9
|
+
export {};
|
|
@@ -1,14 +1,19 @@
|
|
|
1
1
|
import { ILocale } from './types';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
2
|
+
declare const translations: {
|
|
3
|
+
en: {
|
|
4
|
+
close: string;
|
|
5
|
+
expand: string;
|
|
6
|
+
minimize: string;
|
|
7
|
+
fullscreen: string;
|
|
8
|
+
exitFullscreen: string;
|
|
9
|
+
};
|
|
10
|
+
no: {
|
|
11
|
+
close: string;
|
|
12
|
+
expand: string;
|
|
13
|
+
minimize: string;
|
|
14
|
+
fullscreen: string;
|
|
15
|
+
exitFullscreen: string;
|
|
16
|
+
};
|
|
14
17
|
};
|
|
18
|
+
export declare function useTranslations(locale?: ILocale): typeof translations.en;
|
|
19
|
+
export {};
|
|
@@ -1,2 +1,41 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export
|
|
1
|
+
import { MouseEvent, ReactNode } from 'react';
|
|
2
|
+
export type AlertColor = 'success' | 'info' | 'warning' | 'error';
|
|
3
|
+
export type AlertVariant = 'standard' | 'filled' | 'outlined';
|
|
4
|
+
/**
|
|
5
|
+
* @figmaNode wXrXt5uKNNzV2DnQCgyYZH#22249-56917 (Design-System · "Inline notification")
|
|
6
|
+
*
|
|
7
|
+
* The DS defines a single "Default" inline-notification style: `alerts/{sev}-50` fill +
|
|
8
|
+
* `alerts/{sev}-300` border, a severity-`700` accent (icon + optional bold label) and a
|
|
9
|
+
* neutral `delta/800` body. `filled`/`outlined` have no DS counterpart (MUI-compat only).
|
|
10
|
+
*/
|
|
11
|
+
export interface AlertProps {
|
|
12
|
+
/** @figmaProp none — severity is applied in Figma by swapping the `alerts/{success|info|warning|error}` token set (no discrete component property); each value maps to that family's -50/-300/-700 shades */
|
|
13
|
+
severity?: AlertColor;
|
|
14
|
+
/** @figmaProp Property1 = standard→"Default"; filled/outlined = none (no DS variant — MUI-compat) */
|
|
15
|
+
variant?: AlertVariant;
|
|
16
|
+
/** @figmaProp none — maps the Figma "Icon" slot (severity glyph, 20px) */
|
|
17
|
+
icon?: ReactNode | false;
|
|
18
|
+
/** @figmaProp none — behavioral override of the severity glyph */
|
|
19
|
+
iconMapping?: Partial<Record<AlertColor, ReactNode>>;
|
|
20
|
+
/** @figmaProp none — behavioral (replaces the trailing Close slot) */
|
|
21
|
+
action?: ReactNode;
|
|
22
|
+
/** @figmaProp showClose = onClose defined → Close slot visible */
|
|
23
|
+
onClose?: (event: MouseEvent<HTMLButtonElement>) => void;
|
|
24
|
+
/** @figmaProp none — the "Text" body slot (Helper 14/lh20, delta/800) */
|
|
25
|
+
children?: ReactNode;
|
|
26
|
+
/** @figmaProp none — behavioral */
|
|
27
|
+
className?: string;
|
|
28
|
+
/** @figmaProp none — behavioral (inline style escape hatch) */
|
|
29
|
+
sx?: unknown;
|
|
30
|
+
/** @figmaProp none — a11y */
|
|
31
|
+
role?: string;
|
|
32
|
+
}
|
|
33
|
+
/**
|
|
34
|
+
* Alert banner (replaces MUI `Alert`). Native `role="alert"` with a leading severity icon, message
|
|
35
|
+
* and optional action/close button; `standard`/`filled`/`outlined` variants. Public props preserved
|
|
36
|
+
* (DEC-003). TASK-402.
|
|
37
|
+
*
|
|
38
|
+
* ponytail: severity uses the semantic `success`/`info`/`warning`/`error` token families —
|
|
39
|
+
* Chromatic in CI is the visual gate for exact shades.
|
|
40
|
+
*/
|
|
41
|
+
export declare const StyledAlert: ({ severity, variant, icon, iconMapping, action, onClose, children, className, sx, role, }: AlertProps) => JSX.Element;
|
|
@@ -1,2 +1,25 @@
|
|
|
1
|
-
import {
|
|
2
|
-
export
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
export interface SnackbarOrigin {
|
|
3
|
+
vertical: 'top' | 'bottom';
|
|
4
|
+
horizontal: 'left' | 'center' | 'right';
|
|
5
|
+
}
|
|
6
|
+
export interface SnackbarProps {
|
|
7
|
+
open?: boolean;
|
|
8
|
+
autoHideDuration?: number | null;
|
|
9
|
+
onClose?: (event: Event | null, reason: 'timeout' | 'clickaway') => void;
|
|
10
|
+
anchorOrigin?: SnackbarOrigin;
|
|
11
|
+
message?: ReactNode;
|
|
12
|
+
action?: ReactNode;
|
|
13
|
+
children?: ReactNode;
|
|
14
|
+
className?: string;
|
|
15
|
+
}
|
|
16
|
+
/**
|
|
17
|
+
* Positioned auto-hiding toast (replaces MUI `Snackbar`). Portalled, fixed to the `anchorOrigin`
|
|
18
|
+
* corner; auto-hides after `autoHideDuration` (null disables). Public props preserved (DEC-003).
|
|
19
|
+
* TASK-402.
|
|
20
|
+
*
|
|
21
|
+
* Positioning primitive — no standalone Figma node. The DS severity toast is
|
|
22
|
+
* `StyledDefaultSnackbar` (Figma "System notification-toast"); consumers pass it via `children`.
|
|
23
|
+
* The built-in dark pill is only a bare MUI-compat fallback; radius aligned to the DS 4px token.
|
|
24
|
+
*/
|
|
25
|
+
export declare const StyledSnackbar: ({ open, autoHideDuration, onClose, anchorOrigin, message, action, children, className, }: SnackbarProps) => JSX.Element | null;
|
|
@@ -1,7 +1,16 @@
|
|
|
1
|
-
import { AlertColor } from '
|
|
1
|
+
import { AlertColor } from '../StyledAlert';
|
|
2
2
|
import { CustomContentProps, SnackbarMessage } from 'notistack';
|
|
3
|
+
/**
|
|
4
|
+
* @figmaNode wXrXt5uKNNzV2DnQCgyYZH#22249-56927 (Design-System · "System notification-toast")
|
|
5
|
+
*
|
|
6
|
+
* Toast card: `alerts/{sev}-50` fill + `alerts/{sev}-300` border (warning → -500), Dialogue-popup
|
|
7
|
+
* elevation, radius 4, w400, pl16/pr8/py12. Label = Body Base Semibold 16/24 in the severity accent
|
|
8
|
+
* (title -700, error -600); body = Body Base 16/24 in the per-severity dark shade (-800, error -700).
|
|
9
|
+
*/
|
|
3
10
|
export interface StyledDefaultSnackbarProps extends CustomContentProps {
|
|
11
|
+
/** @figmaProp Type = success|info|warning|error → the `alerts/{sev}` token set (fill/border/title/message) */
|
|
4
12
|
severity: AlertColor;
|
|
13
|
+
/** @figmaProp Label = the bold severity title (falls back to the severity name) */
|
|
5
14
|
title?: SnackbarMessage;
|
|
6
15
|
}
|
|
7
16
|
export declare const StyledDefaultSnackbar: import('node_modules/@types/react').ForwardRefExoticComponent<StyledDefaultSnackbarProps & import('node_modules/@types/react').RefAttributes<HTMLDivElement>>;
|