@itwin/itwinui-react 3.3.4 → 3.4.1
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 +18 -0
- package/cjs/core/Alert/Alert.d.ts +1 -1
- package/cjs/core/Alert/Alert.js +0 -1
- package/cjs/core/Avatar/Avatar.d.ts +1 -1
- package/cjs/core/Avatar/Avatar.js +0 -1
- package/cjs/core/AvatarGroup/AvatarGroup.d.ts +1 -1
- package/cjs/core/AvatarGroup/AvatarGroup.js +0 -1
- package/cjs/core/Badge/Badge.d.ts +1 -1
- package/cjs/core/Badge/Badge.js +0 -1
- package/cjs/core/Breadcrumbs/Breadcrumbs.d.ts +1 -1
- package/cjs/core/Breadcrumbs/Breadcrumbs.js +0 -1
- package/cjs/core/ButtonGroup/ButtonGroup.d.ts +1 -1
- package/cjs/core/ButtonGroup/ButtonGroup.js +0 -1
- package/cjs/core/Buttons/Button.d.ts +0 -1
- package/cjs/core/Buttons/Button.js +0 -1
- package/cjs/core/Buttons/DropdownButton.d.ts +0 -1
- package/cjs/core/Buttons/DropdownButton.js +0 -1
- package/cjs/core/Buttons/IconButton.d.ts +0 -1
- package/cjs/core/Buttons/IconButton.js +0 -1
- package/cjs/core/Buttons/IdeasButton.d.ts +1 -1
- package/cjs/core/Buttons/IdeasButton.js +0 -1
- package/cjs/core/Buttons/SplitButton.d.ts +0 -1
- package/cjs/core/Buttons/SplitButton.js +0 -1
- package/cjs/core/Carousel/Carousel.d.ts +1 -1
- package/cjs/core/Carousel/Carousel.js +0 -1
- package/cjs/core/Carousel/CarouselSlider.js +1 -1
- package/cjs/core/Checkbox/Checkbox.d.ts +1 -1
- package/cjs/core/Checkbox/Checkbox.js +0 -1
- package/cjs/core/ColorPicker/ColorInputPanel.d.ts +1 -1
- package/cjs/core/ColorPicker/ColorInputPanel.js +0 -1
- package/cjs/core/ColorPicker/ColorPalette.d.ts +0 -1
- package/cjs/core/ColorPicker/ColorPalette.js +0 -1
- package/cjs/core/ColorPicker/ColorPicker.d.ts +1 -1
- package/cjs/core/ColorPicker/ColorPicker.js +0 -1
- package/cjs/core/ColorPicker/ColorSwatch.d.ts +1 -1
- package/cjs/core/ColorPicker/ColorSwatch.js +0 -1
- package/cjs/core/ComboBox/ComboBox.d.ts +1 -1
- package/cjs/core/ComboBox/ComboBox.js +1 -2
- package/cjs/core/ComboBox/ComboBoxMultipleContainer.js +2 -5
- package/cjs/core/DatePicker/DatePicker.d.ts +9 -1
- package/cjs/core/DatePicker/DatePicker.js +9 -5
- package/cjs/core/Dialog/Dialog.d.ts +1 -1
- package/cjs/core/Dialog/Dialog.js +0 -1
- package/cjs/core/Dialog/DialogBackdrop.d.ts +1 -1
- package/cjs/core/Dialog/DialogBackdrop.js +0 -1
- package/cjs/core/Dialog/DialogButtonBar.d.ts +0 -1
- package/cjs/core/Dialog/DialogButtonBar.js +0 -1
- package/cjs/core/Dialog/DialogContent.d.ts +0 -1
- package/cjs/core/Dialog/DialogContent.js +0 -1
- package/cjs/core/Dialog/DialogMain.d.ts +0 -1
- package/cjs/core/Dialog/DialogMain.js +13 -16
- package/cjs/core/Dialog/DialogTitleBar.d.ts +1 -1
- package/cjs/core/Dialog/DialogTitleBar.js +0 -1
- package/cjs/core/Dialog/DialogTitleBarTitle.d.ts +0 -1
- package/cjs/core/Dialog/DialogTitleBarTitle.js +0 -1
- package/cjs/core/Divider/Divider.d.ts +1 -1
- package/cjs/core/Divider/Divider.js +0 -1
- package/cjs/core/DropdownMenu/DropdownMenu.d.ts +0 -1
- package/cjs/core/DropdownMenu/DropdownMenu.js +0 -1
- package/cjs/core/ExpandableBlock/ExpandableBlock.d.ts +1 -1
- package/cjs/core/ExpandableBlock/ExpandableBlock.js +0 -1
- package/cjs/core/Fieldset/Fieldset.d.ts +1 -1
- package/cjs/core/Fieldset/Fieldset.js +0 -1
- package/cjs/core/FileUpload/FileEmptyCard.d.ts +0 -1
- package/cjs/core/FileUpload/FileEmptyCard.js +2 -3
- package/cjs/core/FileUpload/FileUpload.d.ts +1 -1
- package/cjs/core/FileUpload/FileUpload.js +0 -1
- package/cjs/core/FileUpload/FileUploadCard.d.ts +1 -1
- package/cjs/core/FileUpload/FileUploadCard.js +0 -1
- package/cjs/core/FileUpload/FileUploadTemplate.d.ts +3 -2
- package/cjs/core/FileUpload/FileUploadTemplate.js +2 -2
- package/cjs/core/Flex/Flex.d.ts +1 -1
- package/cjs/core/Flex/Flex.js +0 -1
- package/cjs/core/Footer/Footer.d.ts +1 -1
- package/cjs/core/Footer/Footer.js +0 -1
- package/cjs/core/Footer/FooterItem.d.ts +0 -1
- package/cjs/core/Footer/FooterItem.js +0 -1
- package/cjs/core/Footer/FooterList.d.ts +0 -1
- package/cjs/core/Footer/FooterList.js +0 -1
- package/cjs/core/Footer/FooterSeparator.d.ts +0 -1
- package/cjs/core/Footer/FooterSeparator.js +0 -1
- package/cjs/core/Header/Header.d.ts +1 -1
- package/cjs/core/Header/Header.js +0 -1
- package/cjs/core/Header/HeaderBasicButton.d.ts +0 -1
- package/cjs/core/Header/HeaderBasicButton.js +0 -1
- package/cjs/core/Header/HeaderBreadcrumbs.d.ts +1 -1
- package/cjs/core/Header/HeaderBreadcrumbs.js +0 -1
- package/cjs/core/Header/HeaderButton.d.ts +1 -1
- package/cjs/core/Header/HeaderButton.js +0 -1
- package/cjs/core/Header/HeaderDropdownButton.d.ts +0 -1
- package/cjs/core/Header/HeaderDropdownButton.js +0 -1
- package/cjs/core/Header/HeaderLogo.d.ts +1 -1
- package/cjs/core/Header/HeaderLogo.js +0 -1
- package/cjs/core/Header/HeaderSplitButton.d.ts +0 -1
- package/cjs/core/Header/HeaderSplitButton.js +0 -1
- package/cjs/core/Icon/Icon.d.ts +0 -1
- package/cjs/core/Icon/Icon.js +0 -1
- package/cjs/core/InformationPanel/InformationPanel.d.ts +1 -1
- package/cjs/core/InformationPanel/InformationPanel.js +0 -1
- package/cjs/core/InformationPanel/InformationPanelBody.d.ts +0 -1
- package/cjs/core/InformationPanel/InformationPanelBody.js +0 -1
- package/cjs/core/InformationPanel/InformationPanelContent.d.ts +1 -1
- package/cjs/core/InformationPanel/InformationPanelContent.js +0 -1
- package/cjs/core/InformationPanel/InformationPanelHeader.d.ts +1 -1
- package/cjs/core/InformationPanel/InformationPanelHeader.js +0 -1
- package/cjs/core/InformationPanel/InformationPanelWrapper.d.ts +0 -1
- package/cjs/core/InformationPanel/InformationPanelWrapper.js +0 -1
- package/cjs/core/Input/Input.d.ts +0 -1
- package/cjs/core/Input/Input.js +0 -1
- package/cjs/core/InputGrid/InputGrid.d.ts +1 -1
- package/cjs/core/InputGrid/InputGrid.js +0 -1
- package/cjs/core/InputGroup/InputGroup.d.ts +1 -1
- package/cjs/core/InputGroup/InputGroup.js +0 -1
- package/cjs/core/Label/Label.d.ts +1 -1
- package/cjs/core/Label/Label.js +0 -1
- package/cjs/core/LabeledInput/LabeledInput.d.ts +0 -1
- package/cjs/core/LabeledInput/LabeledInput.js +0 -1
- package/cjs/core/LabeledSelect/LabeledSelect.d.ts +0 -1
- package/cjs/core/LabeledSelect/LabeledSelect.js +0 -1
- package/cjs/core/LabeledTextarea/LabeledTextarea.d.ts +1 -1
- package/cjs/core/LabeledTextarea/LabeledTextarea.js +0 -1
- package/cjs/core/LinkAction/LinkAction.d.ts +3 -2
- package/cjs/core/LinkAction/LinkAction.js +33 -1
- package/cjs/core/Menu/Menu.d.ts +1 -1
- package/cjs/core/Menu/Menu.js +0 -1
- package/cjs/core/Menu/MenuDivider.d.ts +0 -1
- package/cjs/core/Menu/MenuDivider.js +0 -1
- package/cjs/core/Menu/MenuExtraContent.d.ts +0 -1
- package/cjs/core/Menu/MenuExtraContent.js +0 -1
- package/cjs/core/Menu/MenuItem.d.ts +0 -1
- package/cjs/core/Menu/MenuItem.js +0 -1
- package/cjs/core/Menu/MenuItemSkeleton.d.ts +1 -1
- package/cjs/core/Menu/MenuItemSkeleton.js +0 -1
- package/cjs/core/Modal/Modal.d.ts +13 -1
- package/cjs/core/Modal/Modal.js +4 -5
- package/cjs/core/Modal/ModalButtonBar.d.ts +0 -1
- package/cjs/core/Modal/ModalButtonBar.js +0 -1
- package/cjs/core/Modal/ModalContent.d.ts +0 -1
- package/cjs/core/Modal/ModalContent.js +0 -1
- package/cjs/core/NonIdealState/ErrorPage.d.ts +1 -1
- package/cjs/core/NonIdealState/ErrorPage.js +0 -1
- package/cjs/core/NonIdealState/NonIdealState.d.ts +1 -1
- package/cjs/core/NonIdealState/NonIdealState.js +0 -1
- package/cjs/core/NotificationMarker/NotificationMarker.d.ts +1 -1
- package/cjs/core/NotificationMarker/NotificationMarker.js +0 -1
- package/cjs/core/Popover/Popover.d.ts +1 -1
- package/cjs/core/Popover/Popover.js +1 -2
- package/cjs/core/ProgressIndicators/ProgressLinear.d.ts +16 -8
- package/cjs/core/ProgressIndicators/ProgressLinear.js +14 -7
- package/cjs/core/ProgressIndicators/ProgressRadial.d.ts +4 -3
- package/cjs/core/ProgressIndicators/ProgressRadial.js +3 -2
- package/cjs/core/Radio/Radio.d.ts +1 -1
- package/cjs/core/Radio/Radio.js +0 -1
- package/cjs/core/RadioTiles/RadioTile.d.ts +1 -1
- package/cjs/core/RadioTiles/RadioTile.js +0 -1
- package/cjs/core/RadioTiles/RadioTileGroup.d.ts +1 -1
- package/cjs/core/RadioTiles/RadioTileGroup.js +0 -1
- package/cjs/core/SearchBox/SearchBox.d.ts +1 -1
- package/cjs/core/SearchBox/SearchBox.js +0 -1
- package/cjs/core/Select/Select.d.ts +0 -1
- package/cjs/core/Select/Select.js +0 -1
- package/cjs/core/Select/SelectTag.d.ts +1 -1
- package/cjs/core/Select/SelectTag.js +0 -1
- package/cjs/core/Select/SelectTagContainer.d.ts +1 -1
- package/cjs/core/Select/SelectTagContainer.js +0 -1
- package/cjs/core/SideNavigation/SideNavigation.d.ts +1 -1
- package/cjs/core/SideNavigation/SideNavigation.js +0 -1
- package/cjs/core/SideNavigation/SidenavButton.d.ts +1 -1
- package/cjs/core/SideNavigation/SidenavButton.js +0 -1
- package/cjs/core/SideNavigation/SidenavSubmenu.d.ts +0 -1
- package/cjs/core/SideNavigation/SidenavSubmenu.js +0 -1
- package/cjs/core/SideNavigation/SidenavSubmenuHeader.d.ts +1 -1
- package/cjs/core/SideNavigation/SidenavSubmenuHeader.js +0 -1
- package/cjs/core/SkipToContentLink/SkipToContentLink.d.ts +1 -1
- package/cjs/core/SkipToContentLink/SkipToContentLink.js +0 -1
- package/cjs/core/Slider/Slider.d.ts +1 -1
- package/cjs/core/Slider/Slider.js +0 -1
- package/cjs/core/StatusMessage/StatusMessage.d.ts +1 -1
- package/cjs/core/StatusMessage/StatusMessage.js +0 -1
- package/cjs/core/Stepper/Stepper.d.ts +0 -1
- package/cjs/core/Stepper/Stepper.js +0 -1
- package/cjs/core/Stepper/WorkflowDiagram.d.ts +1 -1
- package/cjs/core/Stepper/WorkflowDiagram.js +0 -1
- package/cjs/core/Surface/Surface.d.ts +1 -1
- package/cjs/core/Surface/Surface.js +0 -1
- package/cjs/core/Table/SubRowExpander.d.ts +0 -1
- package/cjs/core/Table/SubRowExpander.js +0 -1
- package/cjs/core/Table/Table.d.ts +0 -1
- package/cjs/core/Table/Table.js +4 -23
- package/cjs/core/Table/TableCell.d.ts +0 -1
- package/cjs/core/Table/TableCell.js +0 -1
- package/cjs/core/Table/TablePaginator.d.ts +0 -1
- package/cjs/core/Table/TablePaginator.js +0 -1
- package/cjs/core/Table/cells/DefaultCell.d.ts +0 -1
- package/cjs/core/Table/cells/DefaultCell.js +0 -1
- package/cjs/core/Table/cells/EditableCell.d.ts +0 -1
- package/cjs/core/Table/cells/EditableCell.js +0 -1
- package/cjs/core/Table/filters/DateRangeFilter/DatePickerInput.d.ts +1 -2
- package/cjs/core/Table/filters/DateRangeFilter/DatePickerInput.js +2 -2
- package/cjs/core/Table/filters/DateRangeFilter/DateRangeFilter.js +3 -6
- package/cjs/core/Table/index.d.ts +0 -2
- package/cjs/core/Table/index.js +0 -1
- package/cjs/core/Tabs/Tabs.d.ts +0 -1
- package/cjs/core/Tabs/Tabs.js +17 -17
- package/cjs/core/Tag/Tag.d.ts +30 -8
- package/cjs/core/Tag/Tag.js +12 -6
- package/cjs/core/Tag/TagContainer.d.ts +1 -1
- package/cjs/core/Tag/TagContainer.js +0 -1
- package/cjs/core/Textarea/Textarea.d.ts +0 -1
- package/cjs/core/Textarea/Textarea.js +0 -1
- package/cjs/core/ThemeProvider/ThemeProvider.d.ts +1 -1
- package/cjs/core/ThemeProvider/ThemeProvider.js +2 -3
- package/cjs/core/Tile/Tile.d.ts +1 -1
- package/cjs/core/Tile/Tile.js +0 -1
- package/cjs/core/TimePicker/TimePicker.d.ts +0 -1
- package/cjs/core/TimePicker/TimePicker.js +0 -1
- package/cjs/core/Toast/Toast.d.ts +0 -1
- package/cjs/core/Toast/Toast.js +0 -1
- package/cjs/core/ToggleSwitch/ToggleSwitch.d.ts +1 -1
- package/cjs/core/ToggleSwitch/ToggleSwitch.js +0 -1
- package/cjs/core/Tooltip/Tooltip.d.ts +1 -1
- package/cjs/core/Tooltip/Tooltip.js +0 -1
- package/cjs/core/TransferList/TransferList.d.ts +1 -1
- package/cjs/core/TransferList/TransferList.js +0 -1
- package/cjs/core/Tree/Tree.d.ts +0 -1
- package/cjs/core/Tree/Tree.js +0 -1
- package/cjs/core/Tree/TreeNode.d.ts +1 -1
- package/cjs/core/Tree/TreeNode.js +0 -1
- package/cjs/core/Tree/TreeNodeExpander.d.ts +1 -1
- package/cjs/core/Tree/TreeNodeExpander.js +0 -1
- package/cjs/core/Typography/Anchor.d.ts +0 -1
- package/cjs/core/Typography/Anchor.js +0 -1
- package/cjs/core/Typography/Blockquote.d.ts +1 -1
- package/cjs/core/Typography/Blockquote.js +0 -1
- package/cjs/core/Typography/Code.d.ts +0 -1
- package/cjs/core/Typography/Code.js +0 -1
- package/cjs/core/Typography/Kbd.d.ts +1 -1
- package/cjs/core/Typography/Kbd.js +0 -1
- package/cjs/core/Typography/Text.d.ts +1 -1
- package/cjs/core/Typography/Text.js +0 -1
- package/cjs/core/VisuallyHidden/VisuallyHidden.d.ts +1 -1
- package/cjs/core/VisuallyHidden/VisuallyHidden.js +0 -1
- package/cjs/core/utils/components/FocusTrap.d.ts +0 -1
- package/cjs/core/utils/components/FocusTrap.js +0 -1
- package/cjs/core/utils/components/MiddleTextTruncation.d.ts +0 -1
- package/cjs/core/utils/components/MiddleTextTruncation.js +0 -1
- package/cjs/core/utils/components/Resizer.d.ts +2 -1
- package/cjs/core/utils/components/Resizer.js +55 -66
- package/cjs/core/utils/components/ShadowRoot.d.ts +10 -0
- package/cjs/core/utils/components/ShadowRoot.js +67 -0
- package/cjs/core/utils/components/VirtualScroll.d.ts +0 -1
- package/cjs/core/utils/components/VirtualScroll.js +7 -8
- package/cjs/core/utils/components/WithCSSTransition.d.ts +0 -1
- package/cjs/core/utils/components/WithCSSTransition.js +0 -1
- package/cjs/core/utils/components/index.d.ts +1 -0
- package/cjs/core/utils/components/index.js +1 -0
- package/cjs/core/utils/hooks/useContainerWidth.d.ts +0 -1
- package/cjs/core/utils/hooks/useContainerWidth.js +0 -1
- package/cjs/core/utils/hooks/useDragAndDrop.d.ts +0 -1
- package/cjs/core/utils/hooks/useDragAndDrop.js +0 -1
- package/cjs/core/utils/hooks/useIsomorphicLayoutEffect.d.ts +4 -1
- package/cjs/core/utils/hooks/useIsomorphicLayoutEffect.js +5 -2
- package/cjs/core/utils/hooks/useMediaQuery.d.ts +0 -1
- package/cjs/core/utils/hooks/useMediaQuery.js +1 -2
- package/cjs/core/utils/hooks/useOverflow.js +3 -3
- package/esm/core/Alert/Alert.d.ts +1 -1
- package/esm/core/Alert/Alert.js +0 -1
- package/esm/core/Avatar/Avatar.d.ts +1 -1
- package/esm/core/Avatar/Avatar.js +0 -1
- package/esm/core/AvatarGroup/AvatarGroup.d.ts +1 -1
- package/esm/core/AvatarGroup/AvatarGroup.js +0 -1
- package/esm/core/Badge/Badge.d.ts +1 -1
- package/esm/core/Badge/Badge.js +0 -1
- package/esm/core/Breadcrumbs/Breadcrumbs.d.ts +1 -1
- package/esm/core/Breadcrumbs/Breadcrumbs.js +0 -1
- package/esm/core/ButtonGroup/ButtonGroup.d.ts +1 -1
- package/esm/core/ButtonGroup/ButtonGroup.js +0 -1
- package/esm/core/Buttons/Button.d.ts +0 -1
- package/esm/core/Buttons/Button.js +0 -1
- package/esm/core/Buttons/DropdownButton.d.ts +0 -1
- package/esm/core/Buttons/DropdownButton.js +0 -1
- package/esm/core/Buttons/IconButton.d.ts +0 -1
- package/esm/core/Buttons/IconButton.js +0 -1
- package/esm/core/Buttons/IdeasButton.d.ts +1 -1
- package/esm/core/Buttons/IdeasButton.js +0 -1
- package/esm/core/Buttons/SplitButton.d.ts +0 -1
- package/esm/core/Buttons/SplitButton.js +0 -1
- package/esm/core/Carousel/Carousel.d.ts +1 -1
- package/esm/core/Carousel/Carousel.js +0 -1
- package/esm/core/Carousel/CarouselSlider.js +2 -2
- package/esm/core/Checkbox/Checkbox.d.ts +1 -1
- package/esm/core/Checkbox/Checkbox.js +0 -1
- package/esm/core/ColorPicker/ColorInputPanel.d.ts +1 -1
- package/esm/core/ColorPicker/ColorInputPanel.js +0 -1
- package/esm/core/ColorPicker/ColorPalette.d.ts +0 -1
- package/esm/core/ColorPicker/ColorPalette.js +0 -1
- package/esm/core/ColorPicker/ColorPicker.d.ts +1 -1
- package/esm/core/ColorPicker/ColorPicker.js +0 -1
- package/esm/core/ColorPicker/ColorSwatch.d.ts +1 -1
- package/esm/core/ColorPicker/ColorSwatch.js +0 -1
- package/esm/core/ComboBox/ComboBox.d.ts +1 -1
- package/esm/core/ComboBox/ComboBox.js +2 -3
- package/esm/core/ComboBox/ComboBoxMultipleContainer.js +1 -1
- package/esm/core/DatePicker/DatePicker.d.ts +9 -1
- package/esm/core/DatePicker/DatePicker.js +9 -5
- package/esm/core/Dialog/Dialog.d.ts +1 -1
- package/esm/core/Dialog/Dialog.js +0 -1
- package/esm/core/Dialog/DialogBackdrop.d.ts +1 -1
- package/esm/core/Dialog/DialogBackdrop.js +0 -1
- package/esm/core/Dialog/DialogButtonBar.d.ts +0 -1
- package/esm/core/Dialog/DialogButtonBar.js +0 -1
- package/esm/core/Dialog/DialogContent.d.ts +0 -1
- package/esm/core/Dialog/DialogContent.js +0 -1
- package/esm/core/Dialog/DialogMain.d.ts +0 -1
- package/esm/core/Dialog/DialogMain.js +14 -17
- package/esm/core/Dialog/DialogTitleBar.d.ts +1 -1
- package/esm/core/Dialog/DialogTitleBar.js +0 -1
- package/esm/core/Dialog/DialogTitleBarTitle.d.ts +0 -1
- package/esm/core/Dialog/DialogTitleBarTitle.js +0 -1
- package/esm/core/Divider/Divider.d.ts +1 -1
- package/esm/core/Divider/Divider.js +0 -1
- package/esm/core/DropdownMenu/DropdownMenu.d.ts +0 -1
- package/esm/core/DropdownMenu/DropdownMenu.js +0 -1
- package/esm/core/ExpandableBlock/ExpandableBlock.d.ts +1 -1
- package/esm/core/ExpandableBlock/ExpandableBlock.js +0 -1
- package/esm/core/Fieldset/Fieldset.d.ts +1 -1
- package/esm/core/Fieldset/Fieldset.js +0 -1
- package/esm/core/FileUpload/FileEmptyCard.d.ts +0 -1
- package/esm/core/FileUpload/FileEmptyCard.js +1 -2
- package/esm/core/FileUpload/FileUpload.d.ts +1 -1
- package/esm/core/FileUpload/FileUpload.js +0 -1
- package/esm/core/FileUpload/FileUploadCard.d.ts +1 -1
- package/esm/core/FileUpload/FileUploadCard.js +0 -1
- package/esm/core/FileUpload/FileUploadTemplate.d.ts +3 -2
- package/esm/core/FileUpload/FileUploadTemplate.js +2 -2
- package/esm/core/Flex/Flex.d.ts +1 -1
- package/esm/core/Flex/Flex.js +0 -1
- package/esm/core/Footer/Footer.d.ts +1 -1
- package/esm/core/Footer/Footer.js +0 -1
- package/esm/core/Footer/FooterItem.d.ts +0 -1
- package/esm/core/Footer/FooterItem.js +0 -1
- package/esm/core/Footer/FooterList.d.ts +0 -1
- package/esm/core/Footer/FooterList.js +0 -1
- package/esm/core/Footer/FooterSeparator.d.ts +0 -1
- package/esm/core/Footer/FooterSeparator.js +0 -1
- package/esm/core/Header/Header.d.ts +1 -1
- package/esm/core/Header/Header.js +0 -1
- package/esm/core/Header/HeaderBasicButton.d.ts +0 -1
- package/esm/core/Header/HeaderBasicButton.js +0 -1
- package/esm/core/Header/HeaderBreadcrumbs.d.ts +1 -1
- package/esm/core/Header/HeaderBreadcrumbs.js +0 -1
- package/esm/core/Header/HeaderButton.d.ts +1 -1
- package/esm/core/Header/HeaderButton.js +0 -1
- package/esm/core/Header/HeaderDropdownButton.d.ts +0 -1
- package/esm/core/Header/HeaderDropdownButton.js +0 -1
- package/esm/core/Header/HeaderLogo.d.ts +1 -1
- package/esm/core/Header/HeaderLogo.js +0 -1
- package/esm/core/Header/HeaderSplitButton.d.ts +0 -1
- package/esm/core/Header/HeaderSplitButton.js +0 -1
- package/esm/core/Icon/Icon.d.ts +0 -1
- package/esm/core/Icon/Icon.js +0 -1
- package/esm/core/InformationPanel/InformationPanel.d.ts +1 -1
- package/esm/core/InformationPanel/InformationPanel.js +0 -1
- package/esm/core/InformationPanel/InformationPanelBody.d.ts +0 -1
- package/esm/core/InformationPanel/InformationPanelBody.js +0 -1
- package/esm/core/InformationPanel/InformationPanelContent.d.ts +1 -1
- package/esm/core/InformationPanel/InformationPanelContent.js +0 -1
- package/esm/core/InformationPanel/InformationPanelHeader.d.ts +1 -1
- package/esm/core/InformationPanel/InformationPanelHeader.js +0 -1
- package/esm/core/InformationPanel/InformationPanelWrapper.d.ts +0 -1
- package/esm/core/InformationPanel/InformationPanelWrapper.js +0 -1
- package/esm/core/Input/Input.d.ts +0 -1
- package/esm/core/Input/Input.js +0 -1
- package/esm/core/InputGrid/InputGrid.d.ts +1 -1
- package/esm/core/InputGrid/InputGrid.js +0 -1
- package/esm/core/InputGroup/InputGroup.d.ts +1 -1
- package/esm/core/InputGroup/InputGroup.js +0 -1
- package/esm/core/Label/Label.d.ts +1 -1
- package/esm/core/Label/Label.js +0 -1
- package/esm/core/LabeledInput/LabeledInput.d.ts +0 -1
- package/esm/core/LabeledInput/LabeledInput.js +0 -1
- package/esm/core/LabeledSelect/LabeledSelect.d.ts +0 -1
- package/esm/core/LabeledSelect/LabeledSelect.js +0 -1
- package/esm/core/LabeledTextarea/LabeledTextarea.d.ts +1 -1
- package/esm/core/LabeledTextarea/LabeledTextarea.js +0 -1
- package/esm/core/LinkAction/LinkAction.d.ts +3 -2
- package/esm/core/LinkAction/LinkAction.js +7 -1
- package/esm/core/Menu/Menu.d.ts +1 -1
- package/esm/core/Menu/Menu.js +0 -1
- package/esm/core/Menu/MenuDivider.d.ts +0 -1
- package/esm/core/Menu/MenuDivider.js +0 -1
- package/esm/core/Menu/MenuExtraContent.d.ts +0 -1
- package/esm/core/Menu/MenuExtraContent.js +0 -1
- package/esm/core/Menu/MenuItem.d.ts +0 -1
- package/esm/core/Menu/MenuItem.js +0 -1
- package/esm/core/Menu/MenuItemSkeleton.d.ts +1 -1
- package/esm/core/Menu/MenuItemSkeleton.js +0 -1
- package/esm/core/Modal/Modal.d.ts +13 -1
- package/esm/core/Modal/Modal.js +4 -5
- package/esm/core/Modal/ModalButtonBar.d.ts +0 -1
- package/esm/core/Modal/ModalButtonBar.js +0 -1
- package/esm/core/Modal/ModalContent.d.ts +0 -1
- package/esm/core/Modal/ModalContent.js +0 -1
- package/esm/core/NonIdealState/ErrorPage.d.ts +1 -1
- package/esm/core/NonIdealState/ErrorPage.js +0 -1
- package/esm/core/NonIdealState/NonIdealState.d.ts +1 -1
- package/esm/core/NonIdealState/NonIdealState.js +0 -1
- package/esm/core/NotificationMarker/NotificationMarker.d.ts +1 -1
- package/esm/core/NotificationMarker/NotificationMarker.js +0 -1
- package/esm/core/Popover/Popover.d.ts +1 -1
- package/esm/core/Popover/Popover.js +2 -3
- package/esm/core/ProgressIndicators/ProgressLinear.d.ts +16 -8
- package/esm/core/ProgressIndicators/ProgressLinear.js +14 -7
- package/esm/core/ProgressIndicators/ProgressRadial.d.ts +4 -3
- package/esm/core/ProgressIndicators/ProgressRadial.js +3 -2
- package/esm/core/Radio/Radio.d.ts +1 -1
- package/esm/core/Radio/Radio.js +0 -1
- package/esm/core/RadioTiles/RadioTile.d.ts +1 -1
- package/esm/core/RadioTiles/RadioTile.js +0 -1
- package/esm/core/RadioTiles/RadioTileGroup.d.ts +1 -1
- package/esm/core/RadioTiles/RadioTileGroup.js +0 -1
- package/esm/core/SearchBox/SearchBox.d.ts +1 -1
- package/esm/core/SearchBox/SearchBox.js +0 -1
- package/esm/core/Select/Select.d.ts +0 -1
- package/esm/core/Select/Select.js +0 -1
- package/esm/core/Select/SelectTag.d.ts +1 -1
- package/esm/core/Select/SelectTag.js +0 -1
- package/esm/core/Select/SelectTagContainer.d.ts +1 -1
- package/esm/core/Select/SelectTagContainer.js +0 -1
- package/esm/core/SideNavigation/SideNavigation.d.ts +1 -1
- package/esm/core/SideNavigation/SideNavigation.js +0 -1
- package/esm/core/SideNavigation/SidenavButton.d.ts +1 -1
- package/esm/core/SideNavigation/SidenavButton.js +0 -1
- package/esm/core/SideNavigation/SidenavSubmenu.d.ts +0 -1
- package/esm/core/SideNavigation/SidenavSubmenu.js +0 -1
- package/esm/core/SideNavigation/SidenavSubmenuHeader.d.ts +1 -1
- package/esm/core/SideNavigation/SidenavSubmenuHeader.js +0 -1
- package/esm/core/SkipToContentLink/SkipToContentLink.d.ts +1 -1
- package/esm/core/SkipToContentLink/SkipToContentLink.js +0 -1
- package/esm/core/Slider/Slider.d.ts +1 -1
- package/esm/core/Slider/Slider.js +0 -1
- package/esm/core/StatusMessage/StatusMessage.d.ts +1 -1
- package/esm/core/StatusMessage/StatusMessage.js +0 -1
- package/esm/core/Stepper/Stepper.d.ts +0 -1
- package/esm/core/Stepper/Stepper.js +0 -1
- package/esm/core/Stepper/WorkflowDiagram.d.ts +1 -1
- package/esm/core/Stepper/WorkflowDiagram.js +0 -1
- package/esm/core/Surface/Surface.d.ts +1 -1
- package/esm/core/Surface/Surface.js +0 -1
- package/esm/core/Table/SubRowExpander.d.ts +0 -1
- package/esm/core/Table/SubRowExpander.js +0 -1
- package/esm/core/Table/Table.d.ts +0 -1
- package/esm/core/Table/Table.js +4 -23
- package/esm/core/Table/TableCell.d.ts +0 -1
- package/esm/core/Table/TableCell.js +0 -1
- package/esm/core/Table/TablePaginator.d.ts +0 -1
- package/esm/core/Table/TablePaginator.js +0 -1
- package/esm/core/Table/cells/DefaultCell.d.ts +0 -1
- package/esm/core/Table/cells/DefaultCell.js +0 -1
- package/esm/core/Table/cells/EditableCell.d.ts +0 -1
- package/esm/core/Table/cells/EditableCell.js +0 -1
- package/esm/core/Table/filters/DateRangeFilter/DatePickerInput.d.ts +1 -2
- package/esm/core/Table/filters/DateRangeFilter/DatePickerInput.js +1 -2
- package/esm/core/Table/filters/DateRangeFilter/DateRangeFilter.js +1 -1
- package/esm/core/Table/index.d.ts +0 -2
- package/esm/core/Table/index.js +0 -1
- package/esm/core/Tabs/Tabs.d.ts +0 -1
- package/esm/core/Tabs/Tabs.js +18 -18
- package/esm/core/Tag/Tag.d.ts +30 -8
- package/esm/core/Tag/Tag.js +13 -7
- package/esm/core/Tag/TagContainer.d.ts +1 -1
- package/esm/core/Tag/TagContainer.js +0 -1
- package/esm/core/Textarea/Textarea.d.ts +0 -1
- package/esm/core/Textarea/Textarea.js +0 -1
- package/esm/core/ThemeProvider/ThemeProvider.d.ts +1 -1
- package/esm/core/ThemeProvider/ThemeProvider.js +3 -4
- package/esm/core/Tile/Tile.d.ts +1 -1
- package/esm/core/Tile/Tile.js +0 -1
- package/esm/core/TimePicker/TimePicker.d.ts +0 -1
- package/esm/core/TimePicker/TimePicker.js +0 -1
- package/esm/core/Toast/Toast.d.ts +0 -1
- package/esm/core/Toast/Toast.js +0 -1
- package/esm/core/ToggleSwitch/ToggleSwitch.d.ts +1 -1
- package/esm/core/ToggleSwitch/ToggleSwitch.js +0 -1
- package/esm/core/Tooltip/Tooltip.d.ts +1 -1
- package/esm/core/Tooltip/Tooltip.js +0 -1
- package/esm/core/TransferList/TransferList.d.ts +1 -1
- package/esm/core/TransferList/TransferList.js +0 -1
- package/esm/core/Tree/Tree.d.ts +0 -1
- package/esm/core/Tree/Tree.js +0 -1
- package/esm/core/Tree/TreeNode.d.ts +1 -1
- package/esm/core/Tree/TreeNode.js +0 -1
- package/esm/core/Tree/TreeNodeExpander.d.ts +1 -1
- package/esm/core/Tree/TreeNodeExpander.js +0 -1
- package/esm/core/Typography/Anchor.d.ts +0 -1
- package/esm/core/Typography/Anchor.js +0 -1
- package/esm/core/Typography/Blockquote.d.ts +1 -1
- package/esm/core/Typography/Blockquote.js +0 -1
- package/esm/core/Typography/Code.d.ts +0 -1
- package/esm/core/Typography/Code.js +0 -1
- package/esm/core/Typography/Kbd.d.ts +1 -1
- package/esm/core/Typography/Kbd.js +0 -1
- package/esm/core/Typography/Text.d.ts +1 -1
- package/esm/core/Typography/Text.js +0 -1
- package/esm/core/VisuallyHidden/VisuallyHidden.d.ts +1 -1
- package/esm/core/VisuallyHidden/VisuallyHidden.js +0 -1
- package/esm/core/utils/components/FocusTrap.d.ts +0 -1
- package/esm/core/utils/components/FocusTrap.js +0 -1
- package/esm/core/utils/components/MiddleTextTruncation.d.ts +0 -1
- package/esm/core/utils/components/MiddleTextTruncation.js +0 -1
- package/esm/core/utils/components/Resizer.d.ts +2 -1
- package/esm/core/utils/components/Resizer.js +54 -65
- package/esm/core/utils/components/ShadowRoot.d.ts +10 -0
- package/esm/core/utils/components/ShadowRoot.js +40 -0
- package/esm/core/utils/components/VirtualScroll.d.ts +0 -1
- package/esm/core/utils/components/VirtualScroll.js +8 -9
- package/esm/core/utils/components/WithCSSTransition.d.ts +0 -1
- package/esm/core/utils/components/WithCSSTransition.js +0 -1
- package/esm/core/utils/components/index.d.ts +1 -0
- package/esm/core/utils/components/index.js +1 -0
- package/esm/core/utils/hooks/useContainerWidth.d.ts +0 -1
- package/esm/core/utils/hooks/useContainerWidth.js +0 -1
- package/esm/core/utils/hooks/useDragAndDrop.d.ts +0 -1
- package/esm/core/utils/hooks/useDragAndDrop.js +0 -1
- package/esm/core/utils/hooks/useIsomorphicLayoutEffect.d.ts +4 -1
- package/esm/core/utils/hooks/useIsomorphicLayoutEffect.js +4 -1
- package/esm/core/utils/hooks/useMediaQuery.d.ts +0 -1
- package/esm/core/utils/hooks/useMediaQuery.js +2 -3
- package/esm/core/utils/hooks/useOverflow.js +4 -4
- package/package.json +6 -9
- package/styles.css +11 -11
|
@@ -44,4 +44,3 @@ export const SideNavigation = React.forwardRef((props, forwardedRef) => {
|
|
|
44
44
|
expanderPlacement === 'bottom' && ExpandButton),
|
|
45
45
|
submenu && (React.createElement(WithCSSTransition, { in: isSubmenuOpen, dimension: 'width', timeout: 200, classNames: 'iui' }, submenu))));
|
|
46
46
|
});
|
|
47
|
-
export default SideNavigation;
|
|
@@ -13,4 +13,3 @@ export const SidenavButton = React.forwardRef((props, ref) => {
|
|
|
13
13
|
const { className, children, isActive = false, disabled = false, isSubmenuOpen = false, ...rest } = props;
|
|
14
14
|
return (React.createElement(Button, { className: cx('iui-sidenav-button', { 'iui-submenu-open': isSubmenuOpen }, className), "data-iui-active": isActive, size: 'large', disabled: disabled, ref: ref, ...rest }, children));
|
|
15
15
|
});
|
|
16
|
-
export default SidenavButton;
|
|
@@ -18,4 +18,3 @@ export const SidenavSubmenu = React.forwardRef((props, ref) => {
|
|
|
18
18
|
return (React.createElement(Box, { className: cx('iui-side-navigation-submenu', className), ref: ref, ...rest },
|
|
19
19
|
React.createElement(Box, { className: 'iui-side-navigation-submenu-content' }, children)));
|
|
20
20
|
});
|
|
21
|
-
export default SidenavSubmenu;
|
|
@@ -25,4 +25,3 @@ export const SidenavSubmenuHeader = React.forwardRef((props, forwardedRef) => {
|
|
|
25
25
|
React.createElement(Box, { className: 'iui-side-navigation-submenu-header-label' }, children),
|
|
26
26
|
actions && (React.createElement(Box, { className: 'iui-side-navigation-submenu-header-actions' }, actions))));
|
|
27
27
|
});
|
|
28
|
-
export default SidenavSubmenuHeader;
|
|
@@ -20,4 +20,4 @@ type SkipToContentLinkProps = {
|
|
|
20
20
|
* <body><SkipToContentLink href='#main-content-id'>{localizedLabel}</SkipToContentLink> ... </body>
|
|
21
21
|
*/
|
|
22
22
|
export declare const SkipToContentLink: PolymorphicForwardRefComponent<"a", SkipToContentLinkProps>;
|
|
23
|
-
export
|
|
23
|
+
export {};
|
|
@@ -17,4 +17,3 @@ export const SkipToContentLink = React.forwardRef((props, ref) => {
|
|
|
17
17
|
const { children = 'Skip to main content', className, ...rest } = props;
|
|
18
18
|
return (React.createElement(Box, { as: 'a', ref: ref, className: cx('iui-skip-to-content-link', className), ...rest }, children));
|
|
19
19
|
});
|
|
20
|
-
export default SkipToContentLink;
|
|
@@ -24,4 +24,3 @@ export const Stepper = React.forwardRef((props, ref) => {
|
|
|
24
24
|
React.createElement(Box, { as: 'span', ...labelCountProps, className: cx('iui-stepper-steps-label-count', labelCountProps?.className) }, localization.stepsCountLabel(boundedCurrentStep + 1, steps.length)),
|
|
25
25
|
steps[boundedCurrentStep].name))));
|
|
26
26
|
});
|
|
27
|
-
export default Stepper;
|
|
@@ -8,4 +8,3 @@ export type SubRowExpanderProps<T extends Record<string, unknown>> = {
|
|
|
8
8
|
density?: 'default' | 'condensed' | 'extra-condensed';
|
|
9
9
|
};
|
|
10
10
|
export declare const SubRowExpander: <T extends Record<string, unknown>>(props: SubRowExpanderProps<T>) => React.JSX.Element;
|
|
11
|
-
export default SubRowExpander;
|
package/esm/core/Table/Table.js
CHANGED
|
@@ -3,18 +3,17 @@
|
|
|
3
3
|
* See LICENSE.md in the project root for license terms and full copyright notice.
|
|
4
4
|
*--------------------------------------------------------------------------------------------*/
|
|
5
5
|
import * as React from 'react';
|
|
6
|
-
import * as ReactDOM from 'react-dom';
|
|
7
6
|
import cx from 'classnames';
|
|
8
7
|
import { actions as TableActions, useFlexLayout, useFilters, useRowSelect, useSortBy, useTable, useExpanded, usePagination, useColumnOrder, useGlobalFilter, } from 'react-table';
|
|
9
8
|
import { ProgressRadial } from '../ProgressIndicators/ProgressRadial.js';
|
|
10
|
-
import { useGlobals, useResizeObserver, SvgSortDown, SvgSortUp,
|
|
9
|
+
import { useGlobals, useResizeObserver, SvgSortDown, SvgSortUp, useLayoutEffect, Box, createWarningLogger, ShadowRoot, } from '../utils/index.js';
|
|
11
10
|
import { getCellStyle, getStickyStyle, getSubRowStyle } from './utils.js';
|
|
12
11
|
import { TableRowMemoized } from './TableRowMemoized.js';
|
|
13
12
|
import { FilterToggle } from './filters/index.js';
|
|
14
13
|
import { customFilterFunctions } from './filters/customFilterFunctions.js';
|
|
15
14
|
import { useExpanderCell, useSelectionCell, useSubRowFiltering, useSubRowSelection, useResizeColumns, useColumnDragAndDrop, useScrollToRow, useStickyColumns, } from './hooks/index.js';
|
|
16
15
|
import { onExpandHandler, onFilterHandler, onToggleHandler, onShiftSelectHandler, onSingleSelectHandler, onTableResizeEnd, onTableResizeStart, } from './actionHandlers/index.js';
|
|
17
|
-
import VirtualScroll from '../utils/components/VirtualScroll.js';
|
|
16
|
+
import { VirtualScroll } from '../utils/components/VirtualScroll.js';
|
|
18
17
|
import { SELECTION_CELL_ID } from './columns/index.js';
|
|
19
18
|
const singleRowSelectedAction = 'singleRowSelected';
|
|
20
19
|
const shiftRowSelectedAction = 'shiftRowSelected';
|
|
@@ -328,7 +327,7 @@ export const Table = (props) => {
|
|
|
328
327
|
const [headerScrollWidth, setHeaderScrollWidth] = React.useState(0);
|
|
329
328
|
const [headerClientWidth, setHeaderClientWidth] = React.useState(0);
|
|
330
329
|
// Flexbox handles columns resize so we take new column widths before browser repaints.
|
|
331
|
-
|
|
330
|
+
useLayoutEffect(() => {
|
|
332
331
|
if (state.isTableResizing) {
|
|
333
332
|
const newColumnWidths = {};
|
|
334
333
|
flatHeaders.forEach((column) => {
|
|
@@ -479,7 +478,7 @@ export const Table = (props) => {
|
|
|
479
478
|
updateStickyState();
|
|
480
479
|
}
|
|
481
480
|
}, tabIndex: -1, "aria-multiselectable": (isSelectable && selectionMode === 'multi') || undefined },
|
|
482
|
-
React.createElement(
|
|
481
|
+
React.createElement(ShadowRoot, null,
|
|
483
482
|
React.createElement("slot", null),
|
|
484
483
|
rows.length === 0 && headerScrollWidth > headerClientWidth && (React.createElement("div", { "aria-hidden": true, style: {
|
|
485
484
|
// This ensures that the table-body is always the same width as the table-header,
|
|
@@ -501,21 +500,3 @@ export const Table = (props) => {
|
|
|
501
500
|
React.createElement("div", null, emptyFilteredTableContent)))),
|
|
502
501
|
paginatorRenderer?.(paginatorRendererProps))));
|
|
503
502
|
};
|
|
504
|
-
export default Table;
|
|
505
|
-
// ----------------------------------------------------------------------------
|
|
506
|
-
/**
|
|
507
|
-
* Wrapper around `<template>` element that attaches shadow root to its parent
|
|
508
|
-
* and moves its children into the shadow root.
|
|
509
|
-
*/
|
|
510
|
-
const ShadowTemplate = ({ children }) => {
|
|
511
|
-
const [shadowRoot, setShadowRoot] = React.useState();
|
|
512
|
-
const attachShadowRef = React.useCallback((template) => {
|
|
513
|
-
const parent = template?.parentElement;
|
|
514
|
-
if (!template || !parent || parent.shadowRoot) {
|
|
515
|
-
return;
|
|
516
|
-
}
|
|
517
|
-
setShadowRoot(parent.attachShadow({ mode: 'open' }));
|
|
518
|
-
template.remove();
|
|
519
|
-
}, []);
|
|
520
|
-
return (React.createElement("template", { ref: attachShadowRef }, shadowRoot && ReactDOM.createPortal(children, shadowRoot)));
|
|
521
|
-
};
|
|
@@ -10,4 +10,3 @@ export type TableCellProps<T extends Record<string, unknown>> = {
|
|
|
10
10
|
density?: 'default' | 'condensed' | 'extra-condensed';
|
|
11
11
|
};
|
|
12
12
|
export declare const TableCell: <T extends Record<string, unknown>>(props: TableCellProps<T>) => React.JSX.Element;
|
|
13
|
-
export default TableCell;
|
|
@@ -154,4 +154,3 @@ export const TablePaginator = (props) => {
|
|
|
154
154
|
onPageSizeChange(size);
|
|
155
155
|
} }, localization.pageSizeLabel(size)))) }, localization.rangeLabel(currentPage * pageSize + 1, Math.min(totalRowsCount, (currentPage + 1) * pageSize), totalRowsCount, isLoading)))))));
|
|
156
156
|
};
|
|
157
|
-
export default TablePaginator;
|
|
@@ -20,5 +20,4 @@ export type DatePickerInputProps = {
|
|
|
20
20
|
*/
|
|
21
21
|
localizedNames?: DatePickerLocalizedNames;
|
|
22
22
|
} & Omit<React.ComponentProps<typeof LabeledInput>, 'value' | 'onChange' | 'svgIcon' | 'displayStyle'>;
|
|
23
|
-
declare const DatePickerInput: PolymorphicForwardRefComponent<"input", DatePickerInputProps>;
|
|
24
|
-
export default DatePickerInput;
|
|
23
|
+
export declare const DatePickerInput: PolymorphicForwardRefComponent<"input", DatePickerInputProps>;
|
|
@@ -9,7 +9,7 @@ import { InputGrid } from '../../../InputGrid/InputGrid.js';
|
|
|
9
9
|
import { Label } from '../../../Label/Label.js';
|
|
10
10
|
import { InputWithDecorations } from '../../../InputWithDecorations/InputWithDecorations.js';
|
|
11
11
|
import { Popover } from '../../../Popover/Popover.js';
|
|
12
|
-
const DatePickerInput = React.forwardRef((props, forwardedRef) => {
|
|
12
|
+
export const DatePickerInput = React.forwardRef((props, forwardedRef) => {
|
|
13
13
|
const uid = useId();
|
|
14
14
|
const { onChange, date, parseInput, formatDate, label, required, disabled, isFromOrTo, selectedDate, wrapperProps, labelProps, inputWrapperProps, id = uid, localizedNames, ...rest } = props;
|
|
15
15
|
const isDateDisabled = (date) => {
|
|
@@ -53,4 +53,3 @@ const DatePickerInput = React.forwardRef((props, forwardedRef) => {
|
|
|
53
53
|
React.createElement(InputWithDecorations.Button, { "aria-label": 'Date picker', ref: buttonRef },
|
|
54
54
|
React.createElement(SvgCalendar, null))))));
|
|
55
55
|
});
|
|
56
|
-
export default DatePickerInput;
|
|
@@ -6,7 +6,7 @@ import * as React from 'react';
|
|
|
6
6
|
import { useGlobals } from '../../../utils/index.js';
|
|
7
7
|
import { FilterButtonBar } from '../FilterButtonBar.js';
|
|
8
8
|
import { BaseFilter } from '../BaseFilter.js';
|
|
9
|
-
import DatePickerInput from './DatePickerInput.js';
|
|
9
|
+
import { DatePickerInput } from './DatePickerInput.js';
|
|
10
10
|
const defaultStrings = {
|
|
11
11
|
from: 'From',
|
|
12
12
|
to: 'To',
|
|
@@ -7,5 +7,3 @@ export type { DefaultCellProps, EditableCellProps } from './cells/index.js';
|
|
|
7
7
|
export { TablePaginator } from './TablePaginator.js';
|
|
8
8
|
export type { TablePaginatorProps } from './TablePaginator.js';
|
|
9
9
|
export { ActionColumn, ExpanderColumn, SelectionColumn, } from './columns/index.js';
|
|
10
|
-
declare const _default: "./Table";
|
|
11
|
-
export default _default;
|
package/esm/core/Table/index.js
CHANGED
|
@@ -7,4 +7,3 @@ export { BaseFilter, FilterButtonBar, tableFilters } from './filters/index.js';
|
|
|
7
7
|
export { DefaultCell, EditableCell } from './cells/index.js';
|
|
8
8
|
export { TablePaginator } from './TablePaginator.js';
|
|
9
9
|
export { ActionColumn, ExpanderColumn, SelectionColumn, } from './columns/index.js';
|
|
10
|
-
export default './Table';
|
package/esm/core/Tabs/Tabs.d.ts
CHANGED
package/esm/core/Tabs/Tabs.js
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
*--------------------------------------------------------------------------------------------*/
|
|
5
5
|
import cx from 'classnames';
|
|
6
6
|
import * as React from 'react';
|
|
7
|
-
import { useSafeContext, Box, polymorphic, useIsClient,
|
|
7
|
+
import { useSafeContext, Box, polymorphic, useIsClient, useLayoutEffect, useMergedRefs, useContainerWidth, ButtonBase, mergeEventHandlers, useControlledState, useId, useLatestRef, } from '../utils/index.js';
|
|
8
8
|
import { Icon } from '../Icon/Icon.js';
|
|
9
9
|
const TabsWrapper = React.forwardRef((props, ref) => {
|
|
10
10
|
const { className, children, orientation = 'horizontal', type = 'default', focusActivationMode = 'auto', color = 'blue', defaultValue, value: activeValueProp, onValueChange, ...rest } = props;
|
|
@@ -53,27 +53,27 @@ const Tab = React.forwardRef((props, forwardedRef) => {
|
|
|
53
53
|
const isActive = activeValue === value;
|
|
54
54
|
const isActiveRef = useLatestRef(isActive);
|
|
55
55
|
// Scroll to active tab only on initial render
|
|
56
|
-
|
|
56
|
+
useLayoutEffect(() => {
|
|
57
57
|
if (isActiveRef.current) {
|
|
58
58
|
tabRef.current?.parentElement?.scrollTo({
|
|
59
59
|
[orientation === 'horizontal' ? 'left' : 'top']: tabRef.current?.[orientation === 'horizontal' ? 'offsetLeft' : 'offsetTop'] - 4,
|
|
60
60
|
behavior: 'instant', // not using 'smooth' to reduce layout shift on page load
|
|
61
61
|
});
|
|
62
62
|
}
|
|
63
|
-
}, []);
|
|
64
|
-
const updateStripe = () => {
|
|
65
|
-
const currentTabRect = tabRef.current?.getBoundingClientRect();
|
|
66
|
-
setStripeProperties({
|
|
67
|
-
'--iui-tabs-stripe-size': orientation === 'horizontal'
|
|
68
|
-
? `${currentTabRect?.width}px`
|
|
69
|
-
: `${currentTabRect?.height}px`,
|
|
70
|
-
'--iui-tabs-stripe-position': orientation === 'horizontal'
|
|
71
|
-
? `${tabRef.current?.offsetLeft}px`
|
|
72
|
-
: `${tabRef.current?.offsetTop}px`,
|
|
73
|
-
});
|
|
74
|
-
};
|
|
63
|
+
}, [isActiveRef, orientation]);
|
|
75
64
|
// CSS custom properties to place the active stripe
|
|
76
|
-
|
|
65
|
+
useLayoutEffect(() => {
|
|
66
|
+
const updateStripe = () => {
|
|
67
|
+
const currentTabRect = tabRef.current?.getBoundingClientRect();
|
|
68
|
+
setStripeProperties({
|
|
69
|
+
'--iui-tabs-stripe-size': orientation === 'horizontal'
|
|
70
|
+
? `${currentTabRect?.width}px`
|
|
71
|
+
: `${currentTabRect?.height}px`,
|
|
72
|
+
'--iui-tabs-stripe-position': orientation === 'horizontal'
|
|
73
|
+
? `${tabRef.current?.offsetLeft}px`
|
|
74
|
+
: `${tabRef.current?.offsetTop}px`,
|
|
75
|
+
});
|
|
76
|
+
};
|
|
77
77
|
if (type !== 'default' && isActive) {
|
|
78
78
|
updateStripe();
|
|
79
79
|
}
|
|
@@ -81,7 +81,8 @@ const Tab = React.forwardRef((props, forwardedRef) => {
|
|
|
81
81
|
type,
|
|
82
82
|
orientation,
|
|
83
83
|
isActive,
|
|
84
|
-
tabsWidth,
|
|
84
|
+
tabsWidth,
|
|
85
|
+
setStripeProperties,
|
|
85
86
|
]);
|
|
86
87
|
const onKeyDown = (event) => {
|
|
87
88
|
if (event.altKey) {
|
|
@@ -157,7 +158,7 @@ TabLabel.displayName = 'Tabs.TabLabel';
|
|
|
157
158
|
const TabDescription = React.forwardRef((props, ref) => {
|
|
158
159
|
const { className, children, ...rest } = props;
|
|
159
160
|
const { hasSublabel, setHasSublabel } = useSafeContext(TabsContext);
|
|
160
|
-
|
|
161
|
+
useLayoutEffect(() => {
|
|
161
162
|
if (!hasSublabel) {
|
|
162
163
|
setHasSublabel(true);
|
|
163
164
|
}
|
|
@@ -320,7 +321,6 @@ export const Tabs = Object.assign(LegacyTabsComponent, {
|
|
|
320
321
|
});
|
|
321
322
|
const TabsContext = React.createContext(undefined);
|
|
322
323
|
const TabListContext = React.createContext(undefined);
|
|
323
|
-
export default Tabs;
|
|
324
324
|
// ----------------------------------------------------------------------------
|
|
325
325
|
/**
|
|
326
326
|
* This conditionally adds `scrollbar-gutter: stable` only if the content overflows.
|
package/esm/core/Tag/Tag.d.ts
CHANGED
|
@@ -2,22 +2,44 @@ import * as React from 'react';
|
|
|
2
2
|
import type { PolymorphicForwardRefComponent } from '../utils/index.js';
|
|
3
3
|
type TagProps = {
|
|
4
4
|
/**
|
|
5
|
-
*
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
* Text inside the tag.
|
|
6
|
+
*/
|
|
7
|
+
children: React.ReactNode;
|
|
8
|
+
/**
|
|
9
|
+
* Callback invoked when the tag is clicked.
|
|
10
|
+
*
|
|
11
|
+
* When this prop is passed, the tag will be rendered as a button.
|
|
12
|
+
*/
|
|
13
|
+
onClick?: React.MouseEventHandler;
|
|
14
|
+
/**
|
|
15
|
+
* Callback function that handles click on the remove ("❌") button.
|
|
16
|
+
* If not passed, the remove button will not be shown.
|
|
17
|
+
*
|
|
18
|
+
* If both `onClick` and `onRemove` are passed, then the tag label (rather than the tag itself)
|
|
19
|
+
* will be rendered as a button, to avoid invalid markup (nested buttons).
|
|
8
20
|
*/
|
|
9
21
|
onRemove?: React.MouseEventHandler;
|
|
10
22
|
/**
|
|
11
|
-
*
|
|
23
|
+
* Props for customizing the remove ("❌") button.
|
|
12
24
|
*/
|
|
13
|
-
|
|
25
|
+
removeButtonProps?: React.ComponentPropsWithRef<'button'>;
|
|
26
|
+
} & ({
|
|
14
27
|
/**
|
|
15
28
|
* Variant of tag.
|
|
16
29
|
* Basic tags don't have an outline.
|
|
17
30
|
* @default 'default'
|
|
18
31
|
*/
|
|
19
|
-
variant?: 'default'
|
|
20
|
-
|
|
32
|
+
variant?: 'default';
|
|
33
|
+
/**
|
|
34
|
+
* Props for customizing the label.
|
|
35
|
+
*
|
|
36
|
+
* Only relevant for the 'default' Tag.
|
|
37
|
+
*/
|
|
38
|
+
labelProps?: React.ComponentPropsWithRef<'span'>;
|
|
39
|
+
} | {
|
|
40
|
+
variant?: 'basic';
|
|
41
|
+
labelProps?: never;
|
|
42
|
+
});
|
|
21
43
|
/**
|
|
22
44
|
* Tag for showing categories, filters etc.
|
|
23
45
|
* @example
|
|
@@ -25,4 +47,4 @@ type TagProps = {
|
|
|
25
47
|
* <Tag variant='basic'>Basic tag</Tag>
|
|
26
48
|
*/
|
|
27
49
|
export declare const Tag: PolymorphicForwardRefComponent<"span", TagProps>;
|
|
28
|
-
export
|
|
50
|
+
export {};
|
package/esm/core/Tag/Tag.js
CHANGED
|
@@ -4,8 +4,9 @@
|
|
|
4
4
|
*--------------------------------------------------------------------------------------------*/
|
|
5
5
|
import cx from 'classnames';
|
|
6
6
|
import * as React from 'react';
|
|
7
|
-
import { SvgCloseSmall, Box } from '../utils/index.js';
|
|
7
|
+
import { SvgCloseSmall, Box, ButtonBase } from '../utils/index.js';
|
|
8
8
|
import { IconButton } from '../Buttons/IconButton.js';
|
|
9
|
+
import { LinkAction, LinkBox } from '../LinkAction/LinkAction.js';
|
|
9
10
|
/**
|
|
10
11
|
* Tag for showing categories, filters etc.
|
|
11
12
|
* @example
|
|
@@ -13,13 +14,18 @@ import { IconButton } from '../Buttons/IconButton.js';
|
|
|
13
14
|
* <Tag variant='basic'>Basic tag</Tag>
|
|
14
15
|
*/
|
|
15
16
|
export const Tag = React.forwardRef((props, forwardedRef) => {
|
|
16
|
-
const { className, variant = 'default', children, onRemove, ...rest } = props;
|
|
17
|
-
|
|
17
|
+
const { className, variant = 'default', children, onRemove, onClick, labelProps, removeButtonProps, ...rest } = props;
|
|
18
|
+
// If both onClick and onRemove are passed, we want to render the label as a button
|
|
19
|
+
// to avoid invalid markup (nested buttons). LinkAction ensures that clicking anywhere outside
|
|
20
|
+
// the remove button (including padding) will still trigger the main onClick callback.
|
|
21
|
+
const shouldUseLinkAction = !!onClick && !!onRemove;
|
|
22
|
+
return (React.createElement(Box, { as: shouldUseLinkAction ? LinkBox : !!onClick ? ButtonBase : 'span', className: cx({
|
|
18
23
|
'iui-tag-basic': variant === 'basic',
|
|
19
24
|
'iui-tag': variant === 'default',
|
|
20
|
-
}, className),
|
|
21
|
-
|
|
22
|
-
|
|
25
|
+
}, className),
|
|
26
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- ref's type doesn't matter internally
|
|
27
|
+
ref: forwardedRef, onClick: !shouldUseLinkAction ? onClick : undefined, ...rest },
|
|
28
|
+
variant === 'default' ? (React.createElement(Box, { as: (shouldUseLinkAction ? LinkAction : 'span'), onClick: shouldUseLinkAction ? onClick : undefined, ...labelProps, className: cx('iui-tag-label', labelProps?.className) }, children)) : (children),
|
|
29
|
+
onRemove && (React.createElement(IconButton, { styleType: 'borderless', size: 'small', onClick: onRemove, "aria-label": 'Delete tag', ...removeButtonProps, className: cx('iui-tag-button', removeButtonProps?.className) },
|
|
23
30
|
React.createElement(SvgCloseSmall, { "aria-hidden": true })))));
|
|
24
31
|
});
|
|
25
|
-
export default Tag;
|
|
@@ -24,4 +24,4 @@ type TagContainerProps = {
|
|
|
24
24
|
* <TagContainer><Tag variant='basic'>Basic tag</Tag><Tag variant='basic'>Basic tag 2</Tag></TagContainer>
|
|
25
25
|
*/
|
|
26
26
|
export declare const TagContainer: PolymorphicForwardRefComponent<"div", TagContainerProps>;
|
|
27
|
-
export
|
|
27
|
+
export {};
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
import * as React from 'react';
|
|
6
6
|
import * as ReactDOM from 'react-dom';
|
|
7
7
|
import cx from 'classnames';
|
|
8
|
-
import { useMediaQuery, useMergedRefs, Box,
|
|
8
|
+
import { useMediaQuery, useMergedRefs, Box, useLayoutEffect, useControlledState, useLatestRef, importCss, isUnitTest, } from '../utils/index.js';
|
|
9
9
|
import { ThemeContext } from './ThemeContext.js';
|
|
10
10
|
import { ToastProvider, Toaster } from '../Toast/Toaster.js';
|
|
11
11
|
/**
|
|
@@ -64,7 +64,6 @@ export const ThemeProvider = React.forwardRef((props, forwardedRef) => {
|
|
|
64
64
|
portaledPortalContainer ? (ReactDOM.createPortal(React.createElement(Toaster, null), portaledPortalContainer)) : (React.createElement("div", { ref: setPortalContainer, style: { display: 'contents' } },
|
|
65
65
|
React.createElement(Toaster, null)))))));
|
|
66
66
|
});
|
|
67
|
-
export default ThemeProvider;
|
|
68
67
|
// ----------------------------------------------------------------------------
|
|
69
68
|
const Root = React.forwardRef((props, forwardedRef) => {
|
|
70
69
|
const { theme, children, themeOptions, className, ...rest } = props;
|
|
@@ -87,7 +86,7 @@ const useParentThemeAndContext = (rootElement) => {
|
|
|
87
86
|
const [parentThemeState, setParentTheme] = React.useState(parentContext?.theme);
|
|
88
87
|
const [parentHighContrastState, setParentHighContrastState] = React.useState(parentContext?.themeOptions?.highContrast);
|
|
89
88
|
const parentThemeRef = useLatestRef(parentContext?.theme);
|
|
90
|
-
|
|
89
|
+
useLayoutEffect(() => {
|
|
91
90
|
// bail if we already have theme from context
|
|
92
91
|
if (parentThemeRef.current) {
|
|
93
92
|
return;
|
|
@@ -126,7 +125,7 @@ const useParentThemeAndContext = (rootElement) => {
|
|
|
126
125
|
* dynamically import it (if possible) and fallback to loading it from a CDN.
|
|
127
126
|
*/
|
|
128
127
|
const FallbackStyles = ({ root }) => {
|
|
129
|
-
|
|
128
|
+
useLayoutEffect(() => {
|
|
130
129
|
// bail if styles are already loaded
|
|
131
130
|
if (getComputedStyle(root).getPropertyValue('--_iui-v3-loaded') === 'yes') {
|
|
132
131
|
return;
|
package/esm/core/Tile/Tile.d.ts
CHANGED
package/esm/core/Tile/Tile.js
CHANGED
package/esm/core/Toast/Toast.js
CHANGED
|
@@ -126,4 +126,3 @@ export const ToastPresentation = React.forwardRef((props, forwardedRef) => {
|
|
|
126
126
|
(type === 'persisting' || hasCloseButton) && (React.createElement(IconButton, { size: 'small', styleType: 'borderless', onClick: onClose, "aria-label": 'Close' },
|
|
127
127
|
React.createElement(SvgCloseSmall, null)))));
|
|
128
128
|
});
|
|
129
|
-
export default Toast;
|
|
@@ -43,4 +43,4 @@ type ToggleSwitchProps = {
|
|
|
43
43
|
* <ToggleSwitch label='With icon toggle' icon={<svg viewBox='0 0 16 16'><path d='M1 1v14h14V1H1zm13 1.7v10.6L8.7 8 14 2.7zM8 7.3L2.7 2h10.6L8 7.3zm-.7.7L2 13.3V2.7L7.3 8zm.7.7l5.3 5.3H2.7L8 8.7z' /></svg>} />
|
|
44
44
|
*/
|
|
45
45
|
export declare const ToggleSwitch: PolymorphicForwardRefComponent<"input", ToggleSwitchProps>;
|
|
46
|
-
export
|
|
46
|
+
export {};
|
|
@@ -42,4 +42,3 @@ export const ToggleSwitch = React.forwardRef((props, ref) => {
|
|
|
42
42
|
icon && size !== 'small' && (React.createElement(Box, { as: 'span', className: 'iui-toggle-switch-icon', "aria-hidden": true }, icon)),
|
|
43
43
|
label && (React.createElement(Box, { as: 'span', className: 'iui-toggle-switch-label' }, label))));
|
|
44
44
|
});
|
|
45
|
-
export default ToggleSwitch;
|