@itwin/itwinui-react 3.0.4 → 3.0.6
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 +13 -0
- package/cjs/core/Alert/Alert.js +46 -106
- package/cjs/core/Avatar/Avatar.js +21 -58
- package/cjs/core/AvatarGroup/AvatarGroup.js +26 -64
- package/cjs/core/Backdrop/Backdrop.js +8 -16
- package/cjs/core/Badge/Badge.js +22 -39
- package/cjs/core/Breadcrumbs/Breadcrumbs.js +61 -138
- package/cjs/core/ButtonGroup/ButtonGroup.js +32 -68
- package/cjs/core/Buttons/Button.js +11 -57
- package/cjs/core/Buttons/DropdownButton.js +15 -49
- package/cjs/core/Buttons/IconButton.js +13 -53
- package/cjs/core/Buttons/IdeasButton.js +8 -20
- package/cjs/core/Buttons/SplitButton.js +43 -103
- package/cjs/core/Carousel/Carousel.js +54 -78
- package/cjs/core/Carousel/CarouselContext.js +4 -4
- package/cjs/core/Carousel/CarouselDot.js +12 -23
- package/cjs/core/Carousel/CarouselDotsList.js +92 -153
- package/cjs/core/Carousel/CarouselNavigation.js +41 -84
- package/cjs/core/Carousel/CarouselSlide.js +26 -49
- package/cjs/core/Carousel/CarouselSlider.js +47 -66
- package/cjs/core/Checkbox/Checkbox.js +32 -88
- package/cjs/core/ColorPicker/ColorBuilder.js +174 -292
- package/cjs/core/ColorPicker/ColorInputPanel.js +246 -411
- package/cjs/core/ColorPicker/ColorPalette.js +23 -47
- package/cjs/core/ColorPicker/ColorPicker.js +53 -87
- package/cjs/core/ColorPicker/ColorPickerContext.js +9 -11
- package/cjs/core/ColorPicker/ColorSwatch.js +15 -40
- package/cjs/core/ComboBox/ComboBox.js +280 -402
- package/cjs/core/ComboBox/ComboBoxEndIcon.js +12 -28
- package/cjs/core/ComboBox/ComboBoxInput.js +131 -207
- package/cjs/core/ComboBox/ComboBoxInputContainer.js +12 -35
- package/cjs/core/ComboBox/ComboBoxMenu.js +43 -87
- package/cjs/core/ComboBox/ComboBoxMenuItem.js +21 -73
- package/cjs/core/ComboBox/ComboBoxMultipleContainer.js +7 -13
- package/cjs/core/ComboBox/helpers.js +43 -47
- package/cjs/core/DatePicker/DatePicker.js +333 -569
- package/cjs/core/Dialog/Dialog.js +36 -65
- package/cjs/core/Dialog/DialogBackdrop.js +27 -47
- package/cjs/core/Dialog/DialogButtonBar.js +3 -3
- package/cjs/core/Dialog/DialogContent.js +18 -26
- package/cjs/core/Dialog/DialogContext.js +5 -5
- package/cjs/core/Dialog/DialogDragContext.js +8 -8
- package/cjs/core/Dialog/DialogMain.js +137 -183
- package/cjs/core/Dialog/DialogTitleBar.js +20 -67
- package/cjs/core/Dialog/DialogTitleBarTitle.js +3 -3
- package/cjs/core/Divider/Divider.js +8 -14
- package/cjs/core/DropdownMenu/DropdownMenu.js +46 -80
- package/cjs/core/ExpandableBlock/ExpandableBlock.js +101 -206
- package/cjs/core/Fieldset/Fieldset.js +14 -25
- package/cjs/core/FileUpload/FileEmptyCard.js +17 -43
- package/cjs/core/FileUpload/FileUpload.js +42 -88
- package/cjs/core/FileUpload/FileUploadCard.js +84 -169
- package/cjs/core/FileUpload/FileUploadTemplate.js +16 -51
- package/cjs/core/Flex/Flex.js +77 -93
- package/cjs/core/Footer/Footer.js +64 -103
- package/cjs/core/Footer/FooterItem.js +3 -3
- package/cjs/core/Footer/FooterList.js +3 -3
- package/cjs/core/Footer/FooterSeparator.js +5 -8
- package/cjs/core/Header/Header.js +22 -67
- package/cjs/core/Header/HeaderBasicButton.js +13 -24
- package/cjs/core/Header/HeaderBreadcrumbs.js +14 -38
- package/cjs/core/Header/HeaderButton.js +22 -76
- package/cjs/core/Header/HeaderDropdownButton.js +20 -48
- package/cjs/core/Header/HeaderLogo.js +11 -42
- package/cjs/core/Header/HeaderSplitButton.js +21 -66
- package/cjs/core/Icon/Icon.js +18 -32
- package/cjs/core/InformationPanel/InformationPanel.js +42 -77
- package/cjs/core/InformationPanel/InformationPanelBody.js +4 -6
- package/cjs/core/InformationPanel/InformationPanelContent.js +8 -20
- package/cjs/core/InformationPanel/InformationPanelHeader.js +14 -34
- package/cjs/core/InformationPanel/InformationPanelWrapper.js +4 -6
- package/cjs/core/Input/Input.js +10 -18
- package/cjs/core/InputGrid/InputGrid.js +8 -17
- package/cjs/core/InputGroup/InputGroup.js +25 -72
- package/cjs/core/InputWithDecorations/InputWithDecorations.js +23 -51
- package/cjs/core/Label/Label.js +11 -32
- package/cjs/core/LabeledInput/LabeledInput.js +20 -70
- package/cjs/core/LabeledSelect/LabeledSelect.js +28 -77
- package/cjs/core/LabeledTextarea/LabeledTextarea.js +7 -13
- package/cjs/core/LinkAction/LinkAction.js +3 -3
- package/cjs/core/List/List.js +3 -3
- package/cjs/core/List/ListItem.js +35 -55
- package/cjs/core/Menu/Menu.js +53 -66
- package/cjs/core/Menu/MenuDivider.js +4 -4
- package/cjs/core/Menu/MenuExtraContent.js +4 -4
- package/cjs/core/Menu/MenuItem.js +92 -168
- package/cjs/core/Menu/MenuItemSkeleton.js +19 -54
- package/cjs/core/Modal/Modal.js +11 -38
- package/cjs/core/Modal/ModalButtonBar.js +4 -7
- package/cjs/core/Modal/ModalContent.js +3 -3
- package/cjs/core/NonIdealState/ErrorPage.js +131 -187
- package/cjs/core/NonIdealState/NonIdealState.js +12 -77
- package/cjs/core/NotificationMarker/NotificationMarker.js +8 -29
- package/cjs/core/Overlay/Overlay.d.ts +20 -24
- package/cjs/core/Overlay/Overlay.js +50 -64
- package/cjs/core/Popover/Popover.js +87 -157
- package/cjs/core/ProgressIndicators/ProgressLinear.js +11 -49
- package/cjs/core/ProgressIndicators/ProgressRadial.js +19 -51
- package/cjs/core/Radio/Radio.js +12 -54
- package/cjs/core/RadioTiles/RadioTile.js +14 -80
- package/cjs/core/RadioTiles/RadioTileGroup.js +9 -16
- package/cjs/core/SearchBox/SearchBox.js +104 -221
- package/cjs/core/Select/Select.js +141 -276
- package/cjs/core/Select/SelectTag.js +9 -21
- package/cjs/core/Select/SelectTagContainer.js +14 -30
- package/cjs/core/SideNavigation/SideNavigation.js +29 -138
- package/cjs/core/SideNavigation/SidenavButton.js +8 -30
- package/cjs/core/SideNavigation/SidenavSubmenu.js +9 -23
- package/cjs/core/SideNavigation/SidenavSubmenuHeader.js +10 -29
- package/cjs/core/SkipToContentLink/SkipToContentLink.js +8 -20
- package/cjs/core/Slider/Slider.js +195 -376
- package/cjs/core/Slider/Thumb.js +57 -108
- package/cjs/core/Slider/Track.js +55 -83
- package/cjs/core/StatusMessage/StatusMessage.js +12 -34
- package/cjs/core/Stepper/Stepper.js +21 -80
- package/cjs/core/Stepper/StepperStep.js +36 -109
- package/cjs/core/Stepper/WorkflowDiagram.js +15 -38
- package/cjs/core/Stepper/WorkflowDiagramStep.js +11 -39
- package/cjs/core/Surface/Surface.js +54 -94
- package/cjs/core/Table/SubRowExpander.js +15 -37
- package/cjs/core/Table/Table.js +419 -763
- package/cjs/core/Table/TableCell.js +63 -113
- package/cjs/core/Table/TablePaginator.js +136 -312
- package/cjs/core/Table/TableRowMemoized.js +64 -137
- package/cjs/core/Table/actionHandlers/expandHandler.js +12 -12
- package/cjs/core/Table/actionHandlers/filterHandler.js +17 -25
- package/cjs/core/Table/actionHandlers/index.js +14 -56
- package/cjs/core/Table/actionHandlers/resizeHandler.js +13 -13
- package/cjs/core/Table/actionHandlers/selectHandler.js +98 -128
- package/cjs/core/Table/cells/DefaultCell.js +13 -48
- package/cjs/core/Table/cells/EditableCell.js +46 -75
- package/cjs/core/Table/cells/index.js +6 -16
- package/cjs/core/Table/columns/actionColumn.js +67 -97
- package/cjs/core/Table/columns/expanderColumn.js +32 -46
- package/cjs/core/Table/columns/index.js +11 -41
- package/cjs/core/Table/columns/selectionColumn.js +29 -57
- package/cjs/core/Table/filters/BaseFilter.js +13 -24
- package/cjs/core/Table/filters/DateRangeFilter/DatePickerInput.js +52 -120
- package/cjs/core/Table/filters/DateRangeFilter/DateRangeFilter.js +60 -120
- package/cjs/core/Table/filters/FilterButtonBar.js +16 -39
- package/cjs/core/Table/filters/FilterToggle.js +26 -62
- package/cjs/core/Table/filters/NumberRangeFilter/NumberRangeFilter.js +36 -58
- package/cjs/core/Table/filters/TextFilter/TextFilter.js +28 -40
- package/cjs/core/Table/filters/customFilterFunctions.js +14 -16
- package/cjs/core/Table/filters/defaultFilterFunctions.js +81 -86
- package/cjs/core/Table/filters/index.js +11 -35
- package/cjs/core/Table/filters/tableFilters.js +32 -44
- package/cjs/core/Table/filters/types.js +2 -2
- package/cjs/core/Table/hooks/index.js +19 -67
- package/cjs/core/Table/hooks/useColumnDragAndDrop.js +86 -101
- package/cjs/core/Table/hooks/useExpanderCell.js +25 -33
- package/cjs/core/Table/hooks/useResizeColumns.js +290 -362
- package/cjs/core/Table/hooks/useScrollToRow.js +38 -46
- package/cjs/core/Table/hooks/useSelectionCell.js +10 -17
- package/cjs/core/Table/hooks/useStickyColumns.js +62 -64
- package/cjs/core/Table/hooks/useSubRowFiltering.js +88 -95
- package/cjs/core/Table/hooks/useSubRowSelection.js +31 -32
- package/cjs/core/Table/index.js +18 -78
- package/cjs/core/Table/utils.js +40 -42
- package/cjs/core/Tabs/Tabs.js +232 -417
- package/cjs/core/Tag/Tag.js +15 -42
- package/cjs/core/Tag/TagContainer.js +11 -23
- package/cjs/core/Textarea/Textarea.js +6 -11
- package/cjs/core/ThemeProvider/ThemeContext.js +4 -4
- package/cjs/core/ThemeProvider/ThemeProvider.js +52 -105
- package/cjs/core/Tile/Tile.js +230 -410
- package/cjs/core/TimePicker/TimePicker.js +234 -458
- package/cjs/core/Toast/Toast.js +107 -204
- package/cjs/core/Toast/Toaster.js +77 -102
- package/cjs/core/ToggleSwitch/ToggleSwitch.js +23 -66
- package/cjs/core/Tooltip/Tooltip.js +91 -137
- package/cjs/core/TransferList/TransferList.js +103 -177
- package/cjs/core/Tree/Tree.js +129 -204
- package/cjs/core/Tree/TreeContext.js +9 -9
- package/cjs/core/Tree/TreeNode.js +104 -207
- package/cjs/core/Tree/TreeNodeExpander.js +12 -26
- package/cjs/core/Typography/Anchor.js +3 -3
- package/cjs/core/Typography/Blockquote.js +10 -18
- package/cjs/core/Typography/Code.js +3 -3
- package/cjs/core/Typography/Kbd.js +21 -30
- package/cjs/core/Typography/Text.js +13 -26
- package/cjs/core/VisuallyHidden/VisuallyHidden.js +8 -14
- package/cjs/core/utils/color/ColorValue.js +453 -535
- package/cjs/core/utils/color/index.js +4 -4
- package/cjs/core/utils/components/AutoclearingHiddenLiveRegion.js +13 -20
- package/cjs/core/utils/components/Box.js +3 -3
- package/cjs/core/utils/components/ButtonBase.js +20 -38
- package/cjs/core/utils/components/FocusTrap.js +38 -47
- package/cjs/core/utils/components/InputContainer.js +19 -58
- package/cjs/core/utils/components/InputFlexContainer.js +8 -24
- package/cjs/core/utils/components/MiddleTextTruncation.js +22 -32
- package/cjs/core/utils/components/Portal.js +20 -22
- package/cjs/core/utils/components/Resizer.js +196 -253
- package/cjs/core/utils/components/VirtualScroll.js +223 -304
- package/cjs/core/utils/components/WithCSSTransition.js +32 -49
- package/cjs/core/utils/components/index.js +14 -14
- package/cjs/core/utils/functions/colors.js +22 -25
- package/cjs/core/utils/functions/date.js +10 -10
- package/cjs/core/utils/functions/dev.js +14 -13
- package/cjs/core/utils/functions/dom.d.ts +2 -1
- package/cjs/core/utils/functions/dom.js +22 -25
- package/cjs/core/utils/functions/focusable.js +17 -26
- package/cjs/core/utils/functions/import.js +23 -46
- package/cjs/core/utils/functions/index.js +13 -13
- package/cjs/core/utils/functions/numbers.d.ts +7 -0
- package/cjs/core/utils/functions/numbers.js +21 -10
- package/cjs/core/utils/functions/polymorphic.js +30 -43
- package/cjs/core/utils/functions/react.js +24 -26
- package/cjs/core/utils/functions/supports.js +4 -5
- package/cjs/core/utils/hooks/index.js +17 -17
- package/cjs/core/utils/hooks/useContainerWidth.js +19 -26
- package/cjs/core/utils/hooks/useControlledState.js +12 -21
- package/cjs/core/utils/hooks/useDragAndDrop.js +87 -110
- package/cjs/core/utils/hooks/useEventListener.js +22 -22
- package/cjs/core/utils/hooks/useGlobals.js +27 -33
- package/cjs/core/utils/hooks/useId.js +8 -10
- package/cjs/core/utils/hooks/useIntersection.js +24 -30
- package/cjs/core/utils/hooks/useIsClient.js +9 -9
- package/cjs/core/utils/hooks/useIsomorphicLayoutEffect.js +5 -6
- package/cjs/core/utils/hooks/useLatestRef.js +9 -9
- package/cjs/core/utils/hooks/useMediaQuery.js +31 -31
- package/cjs/core/utils/hooks/useMergedRefs.js +16 -15
- package/cjs/core/utils/hooks/useOverflow.js +57 -70
- package/cjs/core/utils/hooks/useResizeObserver.js +17 -22
- package/cjs/core/utils/hooks/useSafeContext.js +9 -9
- package/cjs/core/utils/icons/StatusIconMap.js +12 -28
- package/cjs/core/utils/icons/Svg.js +3 -3
- package/cjs/core/utils/icons/SvgCalendar.js +7 -12
- package/cjs/core/utils/icons/SvgCaretDownSmall.js +7 -12
- package/cjs/core/utils/icons/SvgCaretRightSmall.js +7 -12
- package/cjs/core/utils/icons/SvgCaretUpSmall.js +7 -12
- package/cjs/core/utils/icons/SvgCheckmark.js +7 -10
- package/cjs/core/utils/icons/SvgCheckmarkSmall.js +7 -12
- package/cjs/core/utils/icons/SvgChevronLeft.js +7 -12
- package/cjs/core/utils/icons/SvgChevronLeftDouble.js +7 -12
- package/cjs/core/utils/icons/SvgChevronRight.js +7 -12
- package/cjs/core/utils/icons/SvgChevronRightDouble.js +7 -12
- package/cjs/core/utils/icons/SvgClose.js +7 -12
- package/cjs/core/utils/icons/SvgCloseSmall.js +7 -12
- package/cjs/core/utils/icons/SvgColumnManager.js +7 -12
- package/cjs/core/utils/icons/SvgDocument.js +7 -10
- package/cjs/core/utils/icons/SvgFilter.js +7 -10
- package/cjs/core/utils/icons/SvgFilterHollow.js +7 -12
- package/cjs/core/utils/icons/SvgImportantSmall.js +7 -12
- package/cjs/core/utils/icons/SvgInfoCircular.js +7 -12
- package/cjs/core/utils/icons/SvgMore.js +7 -12
- package/cjs/core/utils/icons/SvgMoreVertical.js +7 -12
- package/cjs/core/utils/icons/SvgNew.js +7 -12
- package/cjs/core/utils/icons/SvgSearch.js +7 -12
- package/cjs/core/utils/icons/SvgSmileyHappy.js +7 -12
- package/cjs/core/utils/icons/SvgSortDown.js +7 -12
- package/cjs/core/utils/icons/SvgSortUp.js +7 -12
- package/cjs/core/utils/icons/SvgStatusError.js +7 -12
- package/cjs/core/utils/icons/SvgStatusSuccess.js +7 -12
- package/cjs/core/utils/icons/SvgStatusWarning.js +7 -12
- package/cjs/core/utils/icons/SvgSwap.js +7 -12
- package/cjs/core/utils/icons/SvgUpload.js +7 -12
- package/cjs/core/utils/icons/index.js +34 -34
- package/cjs/core/utils/index.js +10 -10
- package/cjs/core/utils/props.js +2 -2
- package/cjs/core/utils/types.js +2 -2
- package/cjs/index.js +229 -949
- package/cjs/react-table/react-table.js +2 -2
- package/cjs/styles.js +412 -425
- package/esm/core/Alert/Alert.js +39 -106
- package/esm/core/Avatar/Avatar.js +14 -42
- package/esm/core/AvatarGroup/AvatarGroup.js +20 -58
- package/esm/core/Backdrop/Backdrop.js +2 -10
- package/esm/core/Badge/Badge.js +16 -31
- package/esm/core/Breadcrumbs/Breadcrumbs.js +55 -135
- package/esm/core/ButtonGroup/ButtonGroup.js +25 -61
- package/esm/core/Buttons/Button.js +5 -45
- package/esm/core/Buttons/DropdownButton.js +7 -37
- package/esm/core/Buttons/IconButton.js +5 -40
- package/esm/core/Buttons/IdeasButton.js +2 -12
- package/esm/core/Buttons/SplitButton.js +34 -101
- package/esm/core/Carousel/Carousel.js +43 -72
- package/esm/core/Carousel/CarouselDot.js +6 -17
- package/esm/core/Carousel/CarouselDotsList.js +85 -147
- package/esm/core/Carousel/CarouselNavigation.js +32 -68
- package/esm/core/Carousel/CarouselSlide.js +19 -41
- package/esm/core/Carousel/CarouselSlider.js +41 -65
- package/esm/core/Checkbox/Checkbox.js +25 -78
- package/esm/core/ColorPicker/ColorBuilder.js +167 -280
- package/esm/core/ColorPicker/ColorInputPanel.js +237 -395
- package/esm/core/ColorPicker/ColorPalette.js +14 -35
- package/esm/core/ColorPicker/ColorPicker.js +46 -79
- package/esm/core/ColorPicker/ColorPickerContext.js +5 -7
- package/esm/core/ColorPicker/ColorSwatch.js +7 -24
- package/esm/core/ComboBox/ComboBox.js +267 -396
- package/esm/core/ComboBox/ComboBoxEndIcon.js +5 -18
- package/esm/core/ComboBox/ComboBoxInput.js +125 -197
- package/esm/core/ComboBox/ComboBoxInputContainer.js +5 -20
- package/esm/core/ComboBox/ComboBoxMenu.js +37 -77
- package/esm/core/ComboBox/ComboBoxMenuItem.js +14 -61
- package/esm/core/ComboBox/ComboBoxMultipleContainer.js +2 -6
- package/esm/core/ComboBox/helpers.js +38 -38
- package/esm/core/DatePicker/DatePicker.js +326 -555
- package/esm/core/Dialog/Dialog.js +24 -53
- package/esm/core/Dialog/DialogBackdrop.js +19 -39
- package/esm/core/Dialog/DialogContent.js +12 -20
- package/esm/core/Dialog/DialogContext.js +1 -1
- package/esm/core/Dialog/DialogDragContext.js +4 -4
- package/esm/core/Dialog/DialogMain.js +128 -177
- package/esm/core/Dialog/DialogTitleBar.js +10 -45
- package/esm/core/Divider/Divider.js +2 -8
- package/esm/core/DropdownMenu/DropdownMenu.js +40 -75
- package/esm/core/ExpandableBlock/ExpandableBlock.js +92 -193
- package/esm/core/Fieldset/Fieldset.js +8 -19
- package/esm/core/FileUpload/FileEmptyCard.js +8 -19
- package/esm/core/FileUpload/FileUpload.js +36 -72
- package/esm/core/FileUpload/FileUploadCard.js +76 -153
- package/esm/core/FileUpload/FileUploadTemplate.js +9 -37
- package/esm/core/Flex/Flex.js +71 -87
- package/esm/core/Footer/Footer.js +55 -86
- package/esm/core/Footer/FooterSeparator.js +1 -1
- package/esm/core/Header/Header.js +14 -55
- package/esm/core/Header/HeaderBasicButton.js +7 -15
- package/esm/core/Header/HeaderBreadcrumbs.js +8 -32
- package/esm/core/Header/HeaderButton.js +14 -62
- package/esm/core/Header/HeaderDropdownButton.js +13 -42
- package/esm/core/Header/HeaderLogo.js +5 -36
- package/esm/core/Header/HeaderSplitButton.js +14 -61
- package/esm/core/Icon/Icon.js +12 -26
- package/esm/core/InformationPanel/InformationPanel.js +36 -71
- package/esm/core/InformationPanel/InformationPanelContent.js +3 -17
- package/esm/core/InformationPanel/InformationPanelHeader.js +8 -32
- package/esm/core/InformationPanel/InformationPanelWrapper.js +1 -3
- package/esm/core/Input/Input.js +4 -12
- package/esm/core/InputGrid/InputGrid.js +2 -11
- package/esm/core/InputGroup/InputGroup.js +16 -57
- package/esm/core/InputWithDecorations/InputWithDecorations.js +11 -42
- package/esm/core/Label/Label.js +5 -26
- package/esm/core/LabeledInput/LabeledInput.js +10 -63
- package/esm/core/LabeledSelect/LabeledSelect.js +18 -67
- package/esm/core/LabeledTextarea/LabeledTextarea.js +2 -8
- package/esm/core/List/ListItem.js +28 -46
- package/esm/core/Menu/Menu.js +48 -64
- package/esm/core/Menu/MenuDivider.js +1 -1
- package/esm/core/Menu/MenuExtraContent.js +1 -1
- package/esm/core/Menu/MenuItem.js +84 -164
- package/esm/core/Menu/MenuItemSkeleton.js +12 -43
- package/esm/core/Modal/Modal.js +6 -33
- package/esm/core/NonIdealState/ErrorPage.js +123 -173
- package/esm/core/NonIdealState/NonIdealState.js +6 -65
- package/esm/core/NotificationMarker/NotificationMarker.js +2 -20
- package/esm/core/Overlay/Overlay.d.ts +20 -24
- package/esm/core/Overlay/Overlay.js +45 -55
- package/esm/core/Popover/Popover.js +80 -172
- package/esm/core/ProgressIndicators/ProgressLinear.js +5 -40
- package/esm/core/ProgressIndicators/ProgressRadial.js +14 -40
- package/esm/core/Radio/Radio.js +6 -45
- package/esm/core/RadioTiles/RadioTile.js +8 -62
- package/esm/core/RadioTiles/RadioTileGroup.js +3 -10
- package/esm/core/SearchBox/SearchBox.js +97 -214
- package/esm/core/Select/Select.js +130 -265
- package/esm/core/Select/SelectTag.js +3 -15
- package/esm/core/Select/SelectTagContainer.js +7 -20
- package/esm/core/SideNavigation/SideNavigation.js +21 -118
- package/esm/core/SideNavigation/SidenavButton.js +2 -24
- package/esm/core/SideNavigation/SidenavSubmenu.js +3 -14
- package/esm/core/SideNavigation/SidenavSubmenuHeader.js +4 -20
- package/esm/core/SkipToContentLink/SkipToContentLink.js +2 -11
- package/esm/core/Slider/Slider.js +187 -340
- package/esm/core/Slider/Thumb.js +50 -97
- package/esm/core/Slider/Track.js +49 -74
- package/esm/core/StatusMessage/StatusMessage.js +5 -23
- package/esm/core/Stepper/Stepper.js +14 -70
- package/esm/core/Stepper/StepperStep.js +29 -92
- package/esm/core/Stepper/WorkflowDiagram.js +8 -21
- package/esm/core/Stepper/WorkflowDiagramStep.js +4 -22
- package/esm/core/Surface/Surface.js +48 -84
- package/esm/core/Table/SubRowExpander.js +9 -31
- package/esm/core/Table/Table.js +408 -763
- package/esm/core/Table/TableCell.js +53 -87
- package/esm/core/Table/TablePaginator.js +125 -306
- package/esm/core/Table/TableRowMemoized.js +58 -129
- package/esm/core/Table/actionHandlers/expandHandler.js +10 -10
- package/esm/core/Table/actionHandlers/filterHandler.js +15 -23
- package/esm/core/Table/actionHandlers/index.js +1 -5
- package/esm/core/Table/actionHandlers/resizeHandler.js +11 -11
- package/esm/core/Table/actionHandlers/selectHandler.js +95 -122
- package/esm/core/Table/cells/DefaultCell.js +7 -42
- package/esm/core/Table/cells/EditableCell.js +41 -70
- package/esm/core/Table/columns/actionColumn.js +55 -85
- package/esm/core/Table/columns/expanderColumn.js +25 -39
- package/esm/core/Table/columns/selectionColumn.js +23 -51
- package/esm/core/Table/filters/BaseFilter.js +7 -15
- package/esm/core/Table/filters/DateRangeFilter/DatePickerInput.js +42 -107
- package/esm/core/Table/filters/DateRangeFilter/DateRangeFilter.js +52 -110
- package/esm/core/Table/filters/FilterButtonBar.js +9 -28
- package/esm/core/Table/filters/FilterToggle.js +18 -51
- package/esm/core/Table/filters/NumberRangeFilter/NumberRangeFilter.js +28 -50
- package/esm/core/Table/filters/TextFilter/TextFilter.js +20 -32
- package/esm/core/Table/filters/customFilterFunctions.js +12 -14
- package/esm/core/Table/filters/defaultFilterFunctions.js +79 -84
- package/esm/core/Table/filters/tableFilters.js +25 -34
- package/esm/core/Table/hooks/useColumnDragAndDrop.js +81 -88
- package/esm/core/Table/hooks/useExpanderCell.js +20 -26
- package/esm/core/Table/hooks/useResizeColumns.js +287 -353
- package/esm/core/Table/hooks/useScrollToRow.js +34 -42
- package/esm/core/Table/hooks/useSelectionCell.js +6 -10
- package/esm/core/Table/hooks/useStickyColumns.js +59 -61
- package/esm/core/Table/hooks/useSubRowFiltering.js +83 -90
- package/esm/core/Table/hooks/useSubRowSelection.js +27 -28
- package/esm/core/Table/index.js +1 -5
- package/esm/core/Table/utils.js +38 -40
- package/esm/core/Tabs/Tabs.js +226 -401
- package/esm/core/Tag/Tag.js +8 -35
- package/esm/core/Tag/TagContainer.js +5 -17
- package/esm/core/Textarea/Textarea.js +1 -6
- package/esm/core/ThemeProvider/ThemeProvider.js +44 -101
- package/esm/core/Tile/Tile.js +218 -386
- package/esm/core/TimePicker/TimePicker.js +228 -448
- package/esm/core/Toast/Toast.js +99 -193
- package/esm/core/Toast/Toaster.js +69 -82
- package/esm/core/ToggleSwitch/ToggleSwitch.js +17 -60
- package/esm/core/Tooltip/Tooltip.js +86 -151
- package/esm/core/TransferList/TransferList.js +93 -157
- package/esm/core/Tree/Tree.js +122 -196
- package/esm/core/Tree/TreeContext.js +5 -5
- package/esm/core/Tree/TreeNode.js +96 -195
- package/esm/core/Tree/TreeNodeExpander.js +5 -16
- package/esm/core/Typography/Blockquote.js +4 -12
- package/esm/core/Typography/Kbd.js +15 -24
- package/esm/core/Typography/Text.js +7 -20
- package/esm/core/VisuallyHidden/VisuallyHidden.js +2 -8
- package/esm/core/utils/color/ColorValue.js +449 -524
- package/esm/core/utils/components/AutoclearingHiddenLiveRegion.js +7 -11
- package/esm/core/utils/components/ButtonBase.js +13 -31
- package/esm/core/utils/components/FocusTrap.js +32 -41
- package/esm/core/utils/components/InputContainer.js +11 -50
- package/esm/core/utils/components/InputFlexContainer.js +2 -15
- package/esm/core/utils/components/MiddleTextTruncation.js +17 -27
- package/esm/core/utils/components/Portal.js +12 -12
- package/esm/core/utils/components/Resizer.js +192 -250
- package/esm/core/utils/components/VirtualScroll.js +218 -297
- package/esm/core/utils/components/WithCSSTransition.js +26 -43
- package/esm/core/utils/functions/colors.js +19 -19
- package/esm/core/utils/functions/date.js +8 -8
- package/esm/core/utils/functions/dev.js +12 -11
- package/esm/core/utils/functions/dom.d.ts +2 -1
- package/esm/core/utils/functions/dom.js +18 -18
- package/esm/core/utils/functions/focusable.js +15 -24
- package/esm/core/utils/functions/import.js +2 -4
- package/esm/core/utils/functions/numbers.d.ts +7 -0
- package/esm/core/utils/functions/numbers.js +17 -7
- package/esm/core/utils/functions/polymorphic.js +23 -32
- package/esm/core/utils/functions/react.js +19 -21
- package/esm/core/utils/functions/supports.js +1 -2
- package/esm/core/utils/hooks/useContainerWidth.js +13 -16
- package/esm/core/utils/hooks/useControlledState.js +8 -17
- package/esm/core/utils/hooks/useDragAndDrop.js +81 -100
- package/esm/core/utils/hooks/useEventListener.js +18 -18
- package/esm/core/utils/hooks/useGlobals.js +21 -27
- package/esm/core/utils/hooks/useId.js +3 -4
- package/esm/core/utils/hooks/useIntersection.js +19 -25
- package/esm/core/utils/hooks/useIsClient.js +5 -5
- package/esm/core/utils/hooks/useIsomorphicLayoutEffect.js +1 -2
- package/esm/core/utils/hooks/useLatestRef.js +5 -5
- package/esm/core/utils/hooks/useMediaQuery.js +25 -23
- package/esm/core/utils/hooks/useMergedRefs.js +12 -11
- package/esm/core/utils/hooks/useOverflow.js +51 -63
- package/esm/core/utils/hooks/useResizeObserver.js +12 -17
- package/esm/core/utils/hooks/useSafeContext.js +5 -5
- package/esm/core/utils/icons/StatusIconMap.js +4 -8
- package/esm/core/utils/icons/SvgCalendar.js +2 -7
- package/esm/core/utils/icons/SvgCaretDownSmall.js +2 -7
- package/esm/core/utils/icons/SvgCaretRightSmall.js +2 -7
- package/esm/core/utils/icons/SvgCaretUpSmall.js +2 -7
- package/esm/core/utils/icons/SvgCheckmark.js +2 -5
- package/esm/core/utils/icons/SvgCheckmarkSmall.js +2 -7
- package/esm/core/utils/icons/SvgChevronLeft.js +2 -7
- package/esm/core/utils/icons/SvgChevronLeftDouble.js +2 -7
- package/esm/core/utils/icons/SvgChevronRight.js +2 -7
- package/esm/core/utils/icons/SvgChevronRightDouble.js +2 -7
- package/esm/core/utils/icons/SvgClose.js +2 -7
- package/esm/core/utils/icons/SvgCloseSmall.js +2 -7
- package/esm/core/utils/icons/SvgColumnManager.js +2 -7
- package/esm/core/utils/icons/SvgDocument.js +2 -5
- package/esm/core/utils/icons/SvgFilter.js +2 -5
- package/esm/core/utils/icons/SvgFilterHollow.js +2 -7
- package/esm/core/utils/icons/SvgImportantSmall.js +2 -7
- package/esm/core/utils/icons/SvgInfoCircular.js +2 -7
- package/esm/core/utils/icons/SvgMore.js +2 -7
- package/esm/core/utils/icons/SvgMoreVertical.js +2 -7
- package/esm/core/utils/icons/SvgNew.js +2 -7
- package/esm/core/utils/icons/SvgSearch.js +2 -7
- package/esm/core/utils/icons/SvgSmileyHappy.js +2 -7
- package/esm/core/utils/icons/SvgSortDown.js +2 -7
- package/esm/core/utils/icons/SvgSortUp.js +2 -7
- package/esm/core/utils/icons/SvgStatusError.js +2 -7
- package/esm/core/utils/icons/SvgStatusSuccess.js +2 -7
- package/esm/core/utils/icons/SvgStatusWarning.js +2 -7
- package/esm/core/utils/icons/SvgSwap.js +2 -7
- package/esm/core/utils/icons/SvgUpload.js +2 -7
- package/esm/index.js +3 -21
- package/esm/styles.js +414 -425
- package/package.json +2 -2
- package/styles.css +6 -6
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports,
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.InputGrid = void 0;
|
|
4
|
-
const tslib_1 = require(
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
5
|
/*---------------------------------------------------------------------------------------------
|
|
6
6
|
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
|
|
7
7
|
* See LICENSE.md in the project root for license terms and full copyright notice.
|
|
8
8
|
*--------------------------------------------------------------------------------------------*/
|
|
9
|
-
const React = tslib_1.__importStar(require(
|
|
10
|
-
const index_js_1 = require(
|
|
11
|
-
const classnames_1 = tslib_1.__importDefault(require(
|
|
9
|
+
const React = tslib_1.__importStar(require("react"));
|
|
10
|
+
const index_js_1 = require("../utils/index.js");
|
|
11
|
+
const classnames_1 = tslib_1.__importDefault(require("classnames"));
|
|
12
12
|
//-------------------------------------------------------------------------------
|
|
13
13
|
/**
|
|
14
14
|
* InputGrid component is used to display inputs (input, textarea, select)
|
|
@@ -23,17 +23,8 @@ const classnames_1 = tslib_1.__importDefault(require('classnames'));
|
|
|
23
23
|
* </InputGrid>
|
|
24
24
|
*/
|
|
25
25
|
exports.InputGrid = React.forwardRef((props, ref) => {
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
index_js_1.Box,
|
|
29
|
-
{
|
|
30
|
-
className: (0, classnames_1.default)('iui-input-grid', className),
|
|
31
|
-
'data-iui-label-placement': labelPlacement,
|
|
32
|
-
ref: ref,
|
|
33
|
-
...rest,
|
|
34
|
-
},
|
|
35
|
-
children,
|
|
36
|
-
);
|
|
26
|
+
const { children, className, labelPlacement = undefined, ...rest } = props;
|
|
27
|
+
return (React.createElement(index_js_1.Box, { className: (0, classnames_1.default)('iui-input-grid', className), "data-iui-label-placement": labelPlacement, ref: ref, ...rest }, children));
|
|
37
28
|
});
|
|
38
29
|
//-------------------------------------------------------------------------------
|
|
39
30
|
exports.default = exports.InputGrid;
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports,
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.InputGroup = void 0;
|
|
4
|
-
const tslib_1 = require(
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
5
|
/*---------------------------------------------------------------------------------------------
|
|
6
6
|
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
|
|
7
7
|
* See LICENSE.md in the project root for license terms and full copyright notice.
|
|
8
8
|
*--------------------------------------------------------------------------------------------*/
|
|
9
|
-
const React = tslib_1.__importStar(require(
|
|
10
|
-
const classnames_1 = tslib_1.__importDefault(require(
|
|
11
|
-
const index_js_1 = require(
|
|
12
|
-
const InputGrid_js_1 = require(
|
|
13
|
-
const Label_js_1 = require(
|
|
14
|
-
const StatusMessage_js_1 = require(
|
|
9
|
+
const React = tslib_1.__importStar(require("react"));
|
|
10
|
+
const classnames_1 = tslib_1.__importDefault(require("classnames"));
|
|
11
|
+
const index_js_1 = require("../utils/index.js");
|
|
12
|
+
const InputGrid_js_1 = require("../InputGrid/InputGrid.js");
|
|
13
|
+
const Label_js_1 = require("../Label/Label.js");
|
|
14
|
+
const StatusMessage_js_1 = require("../StatusMessage/StatusMessage.js");
|
|
15
15
|
/**
|
|
16
16
|
* Group Checkbox/Radio components together
|
|
17
17
|
* @example
|
|
@@ -28,68 +28,21 @@ const StatusMessage_js_1 = require('../StatusMessage/StatusMessage.js');
|
|
|
28
28
|
* </InputGroup>
|
|
29
29
|
*/
|
|
30
30
|
exports.InputGroup = React.forwardRef((props, forwardedRef) => {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
if (svgIcon) {
|
|
48
|
-
return React.cloneElement(svgIcon, { 'aria-hidden': true });
|
|
49
|
-
}
|
|
50
|
-
if (status && message) {
|
|
51
|
-
return React.cloneElement(index_js_1.StatusIconMap[status](), {
|
|
52
|
-
'aria-hidden': true,
|
|
53
|
-
});
|
|
54
|
-
}
|
|
55
|
-
return undefined;
|
|
56
|
-
};
|
|
57
|
-
return React.createElement(
|
|
58
|
-
InputGrid_js_1.InputGrid,
|
|
59
|
-
{
|
|
60
|
-
ref: forwardedRef,
|
|
61
|
-
as: 'div',
|
|
62
|
-
labelPlacement: displayStyle,
|
|
63
|
-
className: (0, classnames_1.default)(
|
|
64
|
-
'iui-input-group-wrapper',
|
|
65
|
-
className,
|
|
66
|
-
),
|
|
67
|
-
...rest,
|
|
68
|
-
},
|
|
69
|
-
label &&
|
|
70
|
-
React.createElement(
|
|
71
|
-
Label_js_1.Label,
|
|
72
|
-
{ as: 'label', required: required, disabled: disabled, ...labelProps },
|
|
73
|
-
label,
|
|
74
|
-
),
|
|
75
|
-
React.createElement(
|
|
76
|
-
index_js_1.Box,
|
|
77
|
-
{
|
|
78
|
-
as: 'div',
|
|
79
|
-
...innerProps,
|
|
80
|
-
className: (0, classnames_1.default)(
|
|
81
|
-
'iui-input-group',
|
|
82
|
-
innerProps?.className,
|
|
83
|
-
),
|
|
84
|
-
},
|
|
85
|
-
children,
|
|
86
|
-
),
|
|
87
|
-
(message || status || svgIcon) &&
|
|
88
|
-
React.createElement(
|
|
89
|
-
StatusMessage_js_1.StatusMessage,
|
|
90
|
-
{ startIcon: icon(), status: status, ...messageProps },
|
|
91
|
-
displayStyle !== 'inline' && message,
|
|
92
|
-
),
|
|
93
|
-
);
|
|
31
|
+
const { className, children, disabled = false, displayStyle = 'default', label, message, status, svgIcon, required = false, labelProps, messageProps, innerProps, ...rest } = props;
|
|
32
|
+
const icon = () => {
|
|
33
|
+
if (svgIcon) {
|
|
34
|
+
return React.cloneElement(svgIcon, { 'aria-hidden': true });
|
|
35
|
+
}
|
|
36
|
+
if (status && message) {
|
|
37
|
+
return React.cloneElement(index_js_1.StatusIconMap[status](), {
|
|
38
|
+
'aria-hidden': true,
|
|
39
|
+
});
|
|
40
|
+
}
|
|
41
|
+
return undefined;
|
|
42
|
+
};
|
|
43
|
+
return (React.createElement(InputGrid_js_1.InputGrid, { ref: forwardedRef, as: 'div', labelPlacement: displayStyle, className: (0, classnames_1.default)('iui-input-group-wrapper', className), ...rest },
|
|
44
|
+
label && (React.createElement(Label_js_1.Label, { as: 'label', required: required, disabled: disabled, ...labelProps }, label)),
|
|
45
|
+
React.createElement(index_js_1.Box, { as: 'div', ...innerProps, className: (0, classnames_1.default)('iui-input-group', innerProps?.className) }, children),
|
|
46
|
+
(message || status || svgIcon) && (React.createElement(StatusMessage_js_1.StatusMessage, { startIcon: icon(), status: status, ...messageProps }, displayStyle !== 'inline' && message))));
|
|
94
47
|
});
|
|
95
48
|
exports.default = exports.InputGroup;
|
|
@@ -1,59 +1,31 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports,
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.InputWithDecorations = void 0;
|
|
4
|
-
const tslib_1 = require(
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
5
|
/*---------------------------------------------------------------------------------------------
|
|
6
6
|
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
|
|
7
7
|
* See LICENSE.md in the project root for license terms and full copyright notice.
|
|
8
8
|
*--------------------------------------------------------------------------------------------*/
|
|
9
|
-
const React = tslib_1.__importStar(require(
|
|
10
|
-
const index_js_1 = require(
|
|
11
|
-
const IconButton_js_1 = require(
|
|
9
|
+
const React = tslib_1.__importStar(require("react"));
|
|
10
|
+
const index_js_1 = require("../utils/index.js");
|
|
11
|
+
const IconButton_js_1 = require("../Buttons/IconButton.js");
|
|
12
12
|
const InputWithDecorationsContext = React.createContext(undefined);
|
|
13
13
|
const InputWithDecorationsComponent = React.forwardRef((props, ref) => {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
{ value: { size, isDisabled } },
|
|
18
|
-
React.createElement(
|
|
19
|
-
index_js_1.InputFlexContainer,
|
|
20
|
-
{ isDisabled: isDisabled, size: size, ref: ref, ...rest },
|
|
21
|
-
children,
|
|
22
|
-
),
|
|
23
|
-
);
|
|
14
|
+
const { children, size, isDisabled, ...rest } = props;
|
|
15
|
+
return (React.createElement(InputWithDecorationsContext.Provider, { value: { size, isDisabled } },
|
|
16
|
+
React.createElement(index_js_1.InputFlexContainer, { isDisabled: isDisabled, size: size, ref: ref, ...rest }, children)));
|
|
24
17
|
});
|
|
25
18
|
//-------------------------------------------------------------------------------
|
|
26
19
|
const InputWithDecorationsInput = React.forwardRef((props, ref) => {
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
);
|
|
31
|
-
return React.createElement(index_js_1.Box, {
|
|
32
|
-
as: 'input',
|
|
33
|
-
ref: ref,
|
|
34
|
-
'data-iui-size': size ?? contextSize,
|
|
35
|
-
disabled: localDisabled ?? isDisabled,
|
|
36
|
-
id: idProp,
|
|
37
|
-
...rest,
|
|
38
|
-
});
|
|
20
|
+
const { id: idProp, size, disabled: localDisabled, ...rest } = props;
|
|
21
|
+
const { size: contextSize, isDisabled } = (0, index_js_1.useSafeContext)(InputWithDecorationsContext);
|
|
22
|
+
return (React.createElement(index_js_1.Box, { as: 'input', ref: ref, "data-iui-size": size ?? contextSize, disabled: localDisabled ?? isDisabled, id: idProp, ...rest }));
|
|
39
23
|
});
|
|
40
24
|
//-------------------------------------------------------------------------------
|
|
41
25
|
const InputWithDecorationsButton = React.forwardRef((props, ref) => {
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
);
|
|
46
|
-
return React.createElement(
|
|
47
|
-
IconButton_js_1.IconButton,
|
|
48
|
-
{
|
|
49
|
-
ref: ref,
|
|
50
|
-
size: size ?? contextSize,
|
|
51
|
-
styleType: 'borderless',
|
|
52
|
-
disabled: localDisabled ?? isDisabled,
|
|
53
|
-
...rest,
|
|
54
|
-
},
|
|
55
|
-
children,
|
|
56
|
-
);
|
|
26
|
+
const { children, size, disabled: localDisabled, ...rest } = props;
|
|
27
|
+
const { size: contextSize, isDisabled } = (0, index_js_1.useSafeContext)(InputWithDecorationsContext);
|
|
28
|
+
return (React.createElement(IconButton_js_1.IconButton, { ref: ref, size: size ?? contextSize, styleType: 'borderless', disabled: localDisabled ?? isDisabled, ...rest }, children));
|
|
57
29
|
});
|
|
58
30
|
/**
|
|
59
31
|
* Input component with various additional decorations.
|
|
@@ -70,12 +42,12 @@ const InputWithDecorationsButton = React.forwardRef((props, ref) => {
|
|
|
70
42
|
* </InputWithDecorations>
|
|
71
43
|
*/
|
|
72
44
|
exports.InputWithDecorations = Object.assign(InputWithDecorationsComponent, {
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
45
|
+
/**
|
|
46
|
+
* Subcomponent to include input in your InputWithDecorations
|
|
47
|
+
*/
|
|
48
|
+
Input: InputWithDecorationsInput,
|
|
49
|
+
/**
|
|
50
|
+
* Subcomponent to include button in your InputWithDecorations
|
|
51
|
+
*/
|
|
52
|
+
Button: InputWithDecorationsButton,
|
|
81
53
|
});
|
package/cjs/core/Label/Label.js
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports,
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.Label = void 0;
|
|
4
|
-
const tslib_1 = require(
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
5
|
/*---------------------------------------------------------------------------------------------
|
|
6
6
|
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
|
|
7
7
|
* See LICENSE.md in the project root for license terms and full copyright notice.
|
|
8
8
|
*--------------------------------------------------------------------------------------------*/
|
|
9
|
-
const React = tslib_1.__importStar(require(
|
|
10
|
-
const classnames_1 = tslib_1.__importDefault(require(
|
|
11
|
-
const index_js_1 = require(
|
|
9
|
+
const React = tslib_1.__importStar(require("react"));
|
|
10
|
+
const classnames_1 = tslib_1.__importDefault(require("classnames"));
|
|
11
|
+
const index_js_1 = require("../utils/index.js");
|
|
12
12
|
/**
|
|
13
13
|
* A standalone label to be used with input components (using `htmlFor`).
|
|
14
14
|
* Can be rendered as any element, e.g. span, using the `as` prop.
|
|
@@ -17,31 +17,10 @@ const index_js_1 = require('../utils/index.js');
|
|
|
17
17
|
* <Input id='name-input' />
|
|
18
18
|
*/
|
|
19
19
|
exports.Label = React.forwardRef((props, forwardedRef) => {
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
children,
|
|
26
|
-
...rest
|
|
27
|
-
} = props;
|
|
28
|
-
return React.createElement(
|
|
29
|
-
index_js_1.Box,
|
|
30
|
-
{
|
|
31
|
-
as: 'label',
|
|
32
|
-
className: (0, classnames_1.default)(
|
|
33
|
-
'iui-input-label',
|
|
34
|
-
{
|
|
35
|
-
'iui-inline': displayStyle === 'inline',
|
|
36
|
-
'iui-required': required,
|
|
37
|
-
},
|
|
38
|
-
className,
|
|
39
|
-
),
|
|
40
|
-
'data-iui-disabled': disabled ? true : undefined,
|
|
41
|
-
ref: forwardedRef,
|
|
42
|
-
...rest,
|
|
43
|
-
},
|
|
44
|
-
children,
|
|
45
|
-
);
|
|
20
|
+
const { displayStyle = 'block', required, disabled, className, children, ...rest } = props;
|
|
21
|
+
return (React.createElement(index_js_1.Box, { as: 'label', className: (0, classnames_1.default)('iui-input-label', {
|
|
22
|
+
'iui-inline': displayStyle === 'inline',
|
|
23
|
+
'iui-required': required,
|
|
24
|
+
}, className), "data-iui-disabled": disabled ? true : undefined, ref: forwardedRef, ...rest }, children));
|
|
46
25
|
});
|
|
47
26
|
exports.default = exports.Label;
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports,
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.LabeledInput = void 0;
|
|
4
|
-
const tslib_1 = require(
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
5
|
/*---------------------------------------------------------------------------------------------
|
|
6
6
|
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
|
|
7
7
|
* See LICENSE.md in the project root for license terms and full copyright notice.
|
|
8
8
|
*--------------------------------------------------------------------------------------------*/
|
|
9
|
-
const React = tslib_1.__importStar(require(
|
|
10
|
-
const index_js_1 = require(
|
|
11
|
-
const InputGrid_js_1 = require(
|
|
12
|
-
const InputWithDecorations_js_1 = require(
|
|
13
|
-
const StatusMessage_js_1 = require(
|
|
14
|
-
const Label_js_1 = require(
|
|
15
|
-
const Icon_js_1 = require(
|
|
9
|
+
const React = tslib_1.__importStar(require("react"));
|
|
10
|
+
const index_js_1 = require("../utils/index.js");
|
|
11
|
+
const InputGrid_js_1 = require("../InputGrid/InputGrid.js");
|
|
12
|
+
const InputWithDecorations_js_1 = require("../InputWithDecorations/InputWithDecorations.js");
|
|
13
|
+
const StatusMessage_js_1 = require("../StatusMessage/StatusMessage.js");
|
|
14
|
+
const Label_js_1 = require("../Label/Label.js");
|
|
15
|
+
const Icon_js_1 = require("../Icon/Icon.js");
|
|
16
16
|
/**
|
|
17
17
|
* Basic labeled input component
|
|
18
18
|
* @example
|
|
@@ -22,65 +22,15 @@ const Icon_js_1 = require('../Icon/Icon.js');
|
|
|
22
22
|
* <LabeledInput status='negative' label='Negative' />
|
|
23
23
|
*/
|
|
24
24
|
exports.LabeledInput = React.forwardRef((props, ref) => {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
iconProps,
|
|
36
|
-
inputWrapperProps,
|
|
37
|
-
displayStyle = 'default',
|
|
38
|
-
required = false,
|
|
39
|
-
id = uid,
|
|
40
|
-
...rest
|
|
41
|
-
} = props;
|
|
42
|
-
const icon = svgIcon ?? (status && index_js_1.StatusIconMap[status]());
|
|
43
|
-
const shouldShowIcon = svgIcon !== null && (svgIcon || (status && !message));
|
|
44
|
-
return React.createElement(
|
|
45
|
-
InputGrid_js_1.InputGrid,
|
|
46
|
-
{ labelPlacement: displayStyle, ...wrapperProps },
|
|
47
|
-
label &&
|
|
48
|
-
React.createElement(
|
|
49
|
-
Label_js_1.Label,
|
|
50
|
-
{
|
|
51
|
-
as: 'label',
|
|
52
|
-
required: required,
|
|
53
|
-
disabled: disabled,
|
|
54
|
-
htmlFor: id,
|
|
55
|
-
...labelProps,
|
|
56
|
-
},
|
|
57
|
-
label,
|
|
58
|
-
),
|
|
59
|
-
React.createElement(
|
|
60
|
-
InputWithDecorations_js_1.InputWithDecorations,
|
|
61
|
-
{ status: status, isDisabled: disabled, ...inputWrapperProps },
|
|
62
|
-
React.createElement(
|
|
63
|
-
InputWithDecorations_js_1.InputWithDecorations.Input,
|
|
64
|
-
{ disabled: disabled, required: required, id: id, ref: ref, ...rest },
|
|
65
|
-
),
|
|
66
|
-
shouldShowIcon &&
|
|
67
|
-
React.createElement(
|
|
68
|
-
Icon_js_1.Icon,
|
|
69
|
-
{ fill: !svgIcon ? status : undefined, padded: true, ...iconProps },
|
|
70
|
-
icon,
|
|
71
|
-
),
|
|
72
|
-
),
|
|
73
|
-
typeof message === 'string'
|
|
74
|
-
? React.createElement(
|
|
75
|
-
StatusMessage_js_1.StatusMessage,
|
|
76
|
-
{
|
|
77
|
-
status: status,
|
|
78
|
-
iconProps: iconProps,
|
|
79
|
-
contentProps: messageContentProps,
|
|
80
|
-
},
|
|
81
|
-
message,
|
|
82
|
-
)
|
|
83
|
-
: message,
|
|
84
|
-
);
|
|
25
|
+
const uid = (0, index_js_1.useId)();
|
|
26
|
+
const { disabled = false, label, message, status, svgIcon, wrapperProps, labelProps, messageContentProps, iconProps, inputWrapperProps, displayStyle = 'default', required = false, id = uid, ...rest } = props;
|
|
27
|
+
const icon = svgIcon ?? (status && index_js_1.StatusIconMap[status]());
|
|
28
|
+
const shouldShowIcon = svgIcon !== null && (svgIcon || (status && !message));
|
|
29
|
+
return (React.createElement(InputGrid_js_1.InputGrid, { labelPlacement: displayStyle, ...wrapperProps },
|
|
30
|
+
label && (React.createElement(Label_js_1.Label, { as: 'label', required: required, disabled: disabled, htmlFor: id, ...labelProps }, label)),
|
|
31
|
+
React.createElement(InputWithDecorations_js_1.InputWithDecorations, { status: status, isDisabled: disabled, ...inputWrapperProps },
|
|
32
|
+
React.createElement(InputWithDecorations_js_1.InputWithDecorations.Input, { disabled: disabled, required: required, id: id, ref: ref, ...rest }),
|
|
33
|
+
shouldShowIcon && (React.createElement(Icon_js_1.Icon, { fill: !svgIcon ? status : undefined, padded: true, ...iconProps }, icon))),
|
|
34
|
+
typeof message === 'string' ? (React.createElement(StatusMessage_js_1.StatusMessage, { status: status, iconProps: iconProps, contentProps: messageContentProps }, message)) : (message)));
|
|
85
35
|
});
|
|
86
36
|
exports.default = exports.LabeledInput;
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports,
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.LabeledSelect = void 0;
|
|
4
|
-
const tslib_1 = require(
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
5
|
/*---------------------------------------------------------------------------------------------
|
|
6
6
|
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
|
|
7
7
|
* See LICENSE.md in the project root for license terms and full copyright notice.
|
|
8
8
|
*--------------------------------------------------------------------------------------------*/
|
|
9
|
-
const React = tslib_1.__importStar(require(
|
|
10
|
-
const Select_js_1 = require(
|
|
11
|
-
const index_js_1 = require(
|
|
12
|
-
const StatusMessage_js_1 = require(
|
|
13
|
-
const InputGrid_js_1 = require(
|
|
14
|
-
const Label_js_1 = require(
|
|
15
|
-
const Icon_js_1 = require(
|
|
9
|
+
const React = tslib_1.__importStar(require("react"));
|
|
10
|
+
const Select_js_1 = require("../Select/Select.js");
|
|
11
|
+
const index_js_1 = require("../utils/index.js");
|
|
12
|
+
const StatusMessage_js_1 = require("../StatusMessage/StatusMessage.js");
|
|
13
|
+
const InputGrid_js_1 = require("../InputGrid/InputGrid.js");
|
|
14
|
+
const Label_js_1 = require("../Label/Label.js");
|
|
15
|
+
const Icon_js_1 = require("../Icon/Icon.js");
|
|
16
16
|
/**
|
|
17
17
|
* Labeled select component to select value from options.
|
|
18
18
|
* @example
|
|
@@ -47,72 +47,23 @@ const Icon_js_1 = require('../Icon/Icon.js');
|
|
|
47
47
|
* />
|
|
48
48
|
*/
|
|
49
49
|
exports.LabeledSelect = React.forwardRef((props, forwardedRef) => {
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
wrapperProps,
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
const icon = () => {
|
|
69
|
-
if (svgIcon) {
|
|
70
|
-
return React.createElement(Icon_js_1.Icon, null, svgIcon);
|
|
71
|
-
}
|
|
72
|
-
if (status && message) {
|
|
73
|
-
return index_js_1.StatusIconMap[status]();
|
|
74
|
-
}
|
|
75
|
-
return undefined;
|
|
76
|
-
};
|
|
77
|
-
return React.createElement(
|
|
78
|
-
InputGrid_js_1.InputGrid,
|
|
79
|
-
{ labelPlacement: displayStyle, ...wrapperProps },
|
|
80
|
-
label &&
|
|
81
|
-
React.createElement(
|
|
82
|
-
Label_js_1.Label,
|
|
83
|
-
{
|
|
84
|
-
as: 'div',
|
|
85
|
-
required: required,
|
|
86
|
-
disabled: disabled,
|
|
87
|
-
id: labelId,
|
|
88
|
-
...labelProps,
|
|
89
|
-
},
|
|
90
|
-
label,
|
|
91
|
-
),
|
|
92
|
-
React.createElement(Select_js_1.Select, {
|
|
93
|
-
disabled: disabled,
|
|
94
|
-
className: className,
|
|
95
|
-
style: style,
|
|
96
|
-
status: status,
|
|
97
|
-
...rest,
|
|
98
|
-
ref: forwardedRef,
|
|
99
|
-
triggerProps: {
|
|
100
|
-
'aria-labelledby': labelId,
|
|
101
|
-
...triggerProps,
|
|
102
|
-
},
|
|
103
|
-
}),
|
|
104
|
-
typeof message === 'string'
|
|
105
|
-
? React.createElement(
|
|
106
|
-
StatusMessage_js_1.StatusMessage,
|
|
107
|
-
{
|
|
108
|
-
status: status,
|
|
109
|
-
startIcon: displayStyle === 'default' ? icon() : undefined,
|
|
110
|
-
iconProps: messageIconProps,
|
|
111
|
-
contentProps: messageContentProps,
|
|
112
|
-
},
|
|
113
|
-
message,
|
|
114
|
-
)
|
|
115
|
-
: message,
|
|
116
|
-
);
|
|
50
|
+
const { className, disabled = false, label, message, status, svgIcon, displayStyle = 'default', style, required = false, triggerProps, wrapperProps, labelProps, messageContentProps, messageIconProps, ...rest } = props;
|
|
51
|
+
const labelId = `${(0, index_js_1.useId)()}-label`;
|
|
52
|
+
const icon = () => {
|
|
53
|
+
if (svgIcon) {
|
|
54
|
+
return React.createElement(Icon_js_1.Icon, null, svgIcon);
|
|
55
|
+
}
|
|
56
|
+
if (status && message) {
|
|
57
|
+
return index_js_1.StatusIconMap[status]();
|
|
58
|
+
}
|
|
59
|
+
return undefined;
|
|
60
|
+
};
|
|
61
|
+
return (React.createElement(InputGrid_js_1.InputGrid, { labelPlacement: displayStyle, ...wrapperProps },
|
|
62
|
+
label && (React.createElement(Label_js_1.Label, { as: 'div', required: required, disabled: disabled, id: labelId, ...labelProps }, label)),
|
|
63
|
+
React.createElement(Select_js_1.Select, { disabled: disabled, className: className, style: style, status: status, ...rest, ref: forwardedRef, triggerProps: {
|
|
64
|
+
'aria-labelledby': labelId,
|
|
65
|
+
...triggerProps,
|
|
66
|
+
} }),
|
|
67
|
+
typeof message === 'string' ? (React.createElement(StatusMessage_js_1.StatusMessage, { status: status, startIcon: displayStyle === 'default' ? icon() : undefined, iconProps: messageIconProps, contentProps: messageContentProps }, message)) : (message)));
|
|
117
68
|
});
|
|
118
69
|
exports.default = exports.LabeledSelect;
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports,
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.LabeledTextarea = void 0;
|
|
4
|
-
const tslib_1 = require(
|
|
4
|
+
const tslib_1 = require("tslib");
|
|
5
5
|
/*---------------------------------------------------------------------------------------------
|
|
6
6
|
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
|
|
7
7
|
* See LICENSE.md in the project root for license terms and full copyright notice.
|
|
8
8
|
*--------------------------------------------------------------------------------------------*/
|
|
9
|
-
const React = tslib_1.__importStar(require(
|
|
10
|
-
const LabeledInput_js_1 = require(
|
|
9
|
+
const React = tslib_1.__importStar(require("react"));
|
|
10
|
+
const LabeledInput_js_1 = require("../LabeledInput/LabeledInput.js");
|
|
11
11
|
/**
|
|
12
12
|
* Textarea wrapper that allows for additional styling and labelling
|
|
13
13
|
* @example
|
|
@@ -30,16 +30,10 @@ const LabeledInput_js_1 = require('../LabeledInput/LabeledInput.js');
|
|
|
30
30
|
* />
|
|
31
31
|
*/
|
|
32
32
|
exports.LabeledTextarea = React.forwardRef((props, forwardedRef) => {
|
|
33
|
-
|
|
33
|
+
return (
|
|
34
34
|
// ref types don't match but it's internal, so ts-ignore is ok here
|
|
35
35
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
36
36
|
// @ts-ignore
|
|
37
|
-
React.createElement(LabeledInput_js_1.LabeledInput, {
|
|
38
|
-
as: 'textarea',
|
|
39
|
-
rows: 3,
|
|
40
|
-
ref: forwardedRef,
|
|
41
|
-
...props,
|
|
42
|
-
})
|
|
43
|
-
);
|
|
37
|
+
React.createElement(LabeledInput_js_1.LabeledInput, { as: 'textarea', rows: 3, ref: forwardedRef, ...props }));
|
|
44
38
|
});
|
|
45
39
|
exports.default = exports.LabeledTextarea;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports,
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.LinkBox = exports.LinkAction = void 0;
|
|
4
4
|
/*---------------------------------------------------------------------------------------------
|
|
5
5
|
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
|
|
6
6
|
* See LICENSE.md in the project root for license terms and full copyright notice.
|
|
7
7
|
*--------------------------------------------------------------------------------------------*/
|
|
8
|
-
const polymorphic_js_1 = require(
|
|
8
|
+
const polymorphic_js_1 = require("../utils/functions/polymorphic.js");
|
|
9
9
|
/**
|
|
10
10
|
* Polymorphic link action component.
|
|
11
11
|
* It is rendered as `a` by default.
|
package/cjs/core/List/List.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
Object.defineProperty(exports,
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.List = void 0;
|
|
4
4
|
/*---------------------------------------------------------------------------------------------
|
|
5
5
|
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
|
|
6
6
|
* See LICENSE.md in the project root for license terms and full copyright notice.
|
|
7
7
|
*--------------------------------------------------------------------------------------------*/
|
|
8
|
-
const index_js_1 = require(
|
|
8
|
+
const index_js_1 = require("../utils/index.js");
|
|
9
9
|
exports.List = index_js_1.polymorphic.ul('iui-list', { role: 'list' });
|
|
10
10
|
exports.List.displayName = 'List';
|