npm - @react-md/core - Versions diffs - 1.0.0-next.1 → 1.0.0-next.3 - Mend

@react-md/core 1.0.0-next.1 → 1.0.0-next.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (840) hide show

package/.turbo/turbo-build.log +5 -5
package/.turbo/turbo-lint.log +3 -3
package/.turbo/turbo-test.log +142 -129
package/.turbo/turbo-typecheck.log +1 -1
package/CHANGELOG.md +111 -0
package/coverage/clover.xml +437 -3
package/coverage/coverage-final.json +4 -1
package/coverage/lcov-report/Avatar.tsx.html +472 -0
package/coverage/lcov-report/DefaultToastRenderer.tsx.html +166 -112
package/coverage/lcov-report/IconRotator.tsx.html +322 -0
package/coverage/lcov-report/ListItem.tsx.html +892 -0
package/coverage/lcov-report/Portal.tsx.html +223 -0
package/coverage/lcov-report/PortalContainerProvider.tsx.html +367 -0
package/coverage/lcov-report/SkeletonPlaceholder.tsx.html +613 -0
package/coverage/lcov-report/Snackbar.tsx.html +360 -402
package/coverage/lcov-report/Tab.tsx.html +261 -147
package/coverage/lcov-report/Toast.tsx.html +868 -0
package/coverage/lcov-report/ToastManager.tsx.html +1783 -0
package/coverage/lcov-report/ToastManagerProvider.tsx.html +216 -216
package/coverage/lcov-report/TreeGroup.tsx.html +313 -0
package/coverage/lcov-report/app-bar/AppBar.tsx.html +178 -28
package/coverage/lcov-report/app-bar/index.html +7 -7
package/coverage/lcov-report/button/TooltippedButton.tsx.html +445 -0
package/coverage/lcov-report/button/index.html +10 -10
package/coverage/lcov-report/card/Card.tsx.html +349 -0
package/coverage/lcov-report/card/CardContent.tsx.html +223 -0
package/coverage/lcov-report/card/ClickableCard.tsx.html +400 -0
package/coverage/lcov-report/card/index.html +21 -21
package/coverage/lcov-report/card/styles.ts.html +428 -392
package/coverage/lcov-report/cssUtils.ts.html +86 -59
package/coverage/lcov-report/draggable/index.html +21 -36
package/coverage/lcov-report/draggable/useDraggable.ts.html +377 -368
package/coverage/lcov-report/draggable/utils.ts.html +96 -195
package/coverage/lcov-report/expansion-panel/ExpansionList.tsx.html +211 -0
package/coverage/lcov-report/expansion-panel/ExpansionPanel.tsx.html +12 -15
package/coverage/lcov-report/expansion-panel/index.html +34 -19
package/coverage/lcov-report/expansion-panel/useExpansionPanels.ts.html +928 -0
package/coverage/lcov-report/form/MenuItemInputToggle.tsx.html +2 -2
package/coverage/lcov-report/form/Select.tsx.html +1663 -0
package/coverage/lcov-report/form/Slider.tsx.html +163 -40
package/coverage/lcov-report/form/index.html +21 -21
package/coverage/lcov-report/icon/FontIcon.tsx.html +28 -28
package/coverage/lcov-report/icon/index.html +1 -1
package/coverage/lcov-report/index.html +41 -11
package/coverage/lcov-report/interaction/UserInteractionModeProvider.tsx.html +679 -0
package/coverage/lcov-report/interaction/config.ts.html +181 -0
package/coverage/lcov-report/interaction/index.html +33 -18
package/coverage/lcov-report/list/List.tsx.html +490 -0
package/coverage/lcov-report/list/ListItem.tsx.html +886 -0
package/coverage/lcov-report/list/ListItemAddon.tsx.html +286 -0
package/coverage/lcov-report/list/ListItemChildren.tsx.html +445 -0
package/coverage/lcov-report/list/ListItemLink.tsx.html +5 -5
package/coverage/lcov-report/list/index.html +81 -6
package/coverage/lcov-report/list/listItemStyles.ts.html +703 -0
package/coverage/lcov-report/media-queries/appSize.ts.html +1 -1
package/coverage/lcov-report/media-queries/index.html +1 -1
package/coverage/lcov-report/menu/Menu.tsx.html +37 -19
package/coverage/lcov-report/menu/index.html +14 -44
package/coverage/lcov-report/sheet/index.html +8 -8
package/coverage/lcov-report/sheet/styles.ts.html +376 -0
package/coverage/lcov-report/skeletonPlaceholderUtils.ts.html +400 -0
package/coverage/lcov-report/snackbar/Snackbar.tsx.html +55 -97
package/coverage/lcov-report/snackbar/Toast.tsx.html +546 -501
package/coverage/lcov-report/snackbar/ToastManager.tsx.html +269 -269
package/coverage/lcov-report/snackbar/ToastManagerProvider.tsx.html +23 -23
package/coverage/lcov-report/snackbar/index.html +59 -14
package/coverage/lcov-report/snackbar/snackbarStyles.ts.html +12 -87
package/coverage/lcov-report/snackbar/toastStyles.ts.html +206 -146
package/coverage/lcov-report/snackbar/useCurrentToastActions.ts.html +226 -0
package/coverage/lcov-report/snackbarStyles.ts.html +46 -121
package/coverage/lcov-report/src/CoreProviders.tsx.html +20 -20
package/coverage/lcov-report/src/NoSsr.tsx.html +1 -1
package/coverage/lcov-report/src/SsrProvider.tsx.html +10 -10
package/coverage/lcov-report/src/app-bar/AppBar.tsx.html +143 -23
package/coverage/lcov-report/src/app-bar/AppBarTitle.tsx.html +1 -1
package/coverage/lcov-report/src/app-bar/index.html +5 -5
package/coverage/lcov-report/src/avatar/Avatar.tsx.html +2 -2
package/coverage/lcov-report/src/avatar/index.html +1 -1
package/coverage/lcov-report/src/avatar/styles.ts.html +1 -1
package/coverage/lcov-report/src/badge/Badge.tsx.html +1 -1
package/coverage/lcov-report/src/badge/index.html +1 -1
package/coverage/lcov-report/src/box/Box.tsx.html +1 -1
package/coverage/lcov-report/src/box/index.html +23 -8
package/coverage/lcov-report/src/box/styles.ts.html +46 -46
package/coverage/lcov-report/src/button/AsyncButton.tsx.html +1 -1
package/coverage/lcov-report/src/button/Button.tsx.html +84 -84
package/coverage/lcov-report/src/button/ButtonUnstyled.tsx.html +1 -1
package/coverage/lcov-report/src/button/FloatingActionButton.tsx.html +11 -11
package/coverage/lcov-report/src/button/TooltippedButton.tsx.html +445 -0
package/coverage/lcov-report/src/button/buttonStyles.ts.html +52 -52
package/coverage/lcov-report/src/button/buttonUnstyledStyles.ts.html +1 -1
package/coverage/lcov-report/src/button/index.html +83 -8
package/coverage/lcov-report/src/card/Card.tsx.html +37 -31
package/coverage/lcov-report/src/card/CardContent.tsx.html +4 -4
package/coverage/lcov-report/src/card/CardFooter.tsx.html +1 -1
package/coverage/lcov-report/src/card/CardHeader.tsx.html +1 -1
package/coverage/lcov-report/src/card/CardSubtitle.tsx.html +1 -1
package/coverage/lcov-report/src/card/CardTitle.tsx.html +1 -1
package/coverage/lcov-report/src/card/ClickableCard.tsx.html +400 -0
package/coverage/lcov-report/src/card/index.html +24 -9
package/coverage/lcov-report/src/card/styles.ts.html +58 -31
package/coverage/lcov-report/src/chip/Chip.tsx.html +1 -1
package/coverage/lcov-report/src/chip/index.html +7 -7
package/coverage/lcov-report/src/chip/styles.ts.html +9 -12
package/coverage/lcov-report/src/cssUtils.ts.html +53 -53
package/coverage/lcov-report/src/delegateEvent.ts.html +109 -109
package/coverage/lcov-report/src/dialog/Dialog.tsx.html +1 -1
package/coverage/lcov-report/src/dialog/DialogContainer.tsx.html +1 -1
package/coverage/lcov-report/src/dialog/DialogContent.tsx.html +1 -1
package/coverage/lcov-report/src/dialog/DialogFooter.tsx.html +1 -1
package/coverage/lcov-report/src/dialog/DialogHeader.tsx.html +1 -1
package/coverage/lcov-report/src/dialog/DialogTitle.tsx.html +1 -1
package/coverage/lcov-report/src/dialog/FixedDialog.tsx.html +1 -1
package/coverage/lcov-report/src/dialog/NestedDialogProvider.ts.html +1 -1
package/coverage/lcov-report/src/dialog/index.html +129 -9
package/coverage/lcov-report/src/dialog/styles.ts.html +1 -1
package/coverage/lcov-report/src/divider/Divider.tsx.html +4 -7
package/coverage/lcov-report/src/divider/index.html +5 -5
package/coverage/lcov-report/src/divider/styles.ts.html +1 -1
package/coverage/lcov-report/src/draggable/index.html +27 -27
package/coverage/lcov-report/src/draggable/useDraggable.ts.html +47 -44
package/coverage/lcov-report/src/draggable/utils.ts.html +29 -131
package/coverage/lcov-report/src/expansion-panel/ExpansionList.tsx.html +1 -1
package/coverage/lcov-report/src/expansion-panel/ExpansionPanel.tsx.html +1 -1
package/coverage/lcov-report/src/expansion-panel/ExpansionPanelHeader.tsx.html +1 -1
package/coverage/lcov-report/src/expansion-panel/index.html +8 -8
package/coverage/lcov-report/src/expansion-panel/useExpansionList.ts.html +1 -1
package/coverage/lcov-report/src/expansion-panel/useExpansionPanels.ts.html +36 -24
package/coverage/lcov-report/src/focus/index.html +1 -1
package/coverage/lcov-report/src/focus/useFocusContainer.ts.html +1 -1
package/coverage/lcov-report/src/focus/utils.ts.html +1 -1
package/coverage/lcov-report/src/form/Checkbox.tsx.html +1 -1
package/coverage/lcov-report/src/form/Fieldset.tsx.html +1 -1
package/coverage/lcov-report/src/form/FileInput.tsx.html +1 -1
package/coverage/lcov-report/src/form/Form.tsx.html +1 -1
package/coverage/lcov-report/src/form/FormMessage.tsx.html +1 -1
package/coverage/lcov-report/src/form/FormMessageContainer.tsx.html +5 -5
package/coverage/lcov-report/src/form/FormMessageCounter.tsx.html +1 -1
package/coverage/lcov-report/src/form/InputToggle.tsx.html +110 -110
package/coverage/lcov-report/src/form/InputToggleIcon.tsx.html +63 -63
package/coverage/lcov-report/src/form/Label.tsx.html +98 -98
package/coverage/lcov-report/src/form/Legend.tsx.html +1 -1
package/coverage/lcov-report/src/form/MenuItemCheckbox.tsx.html +1 -1
package/coverage/lcov-report/src/form/MenuItemFileInput.tsx.html +1 -1
package/coverage/lcov-report/src/form/MenuItemInputToggle.tsx.html +2 -2
package/coverage/lcov-report/src/form/MenuItemRadio.tsx.html +1 -1
package/coverage/lcov-report/src/form/MenuItemSwitch.tsx.html +1 -1
package/coverage/lcov-report/src/form/MenuItemTextField.tsx.html +1 -1
package/coverage/lcov-report/src/form/NativeSelect.tsx.html +1 -1
package/coverage/lcov-report/src/form/OptGroup.tsx.html +1 -1
package/coverage/lcov-report/src/form/Option.tsx.html +1 -1
package/coverage/lcov-report/src/form/Password.tsx.html +1 -1
package/coverage/lcov-report/src/form/Radio.tsx.html +3 -3
package/coverage/lcov-report/src/form/Select.tsx.html +29 -5
package/coverage/lcov-report/src/form/SelectValue.tsx.html +1 -1
package/coverage/lcov-report/src/form/Slider.tsx.html +1 -1
package/coverage/lcov-report/src/form/SliderContainer.tsx.html +1 -1
package/coverage/lcov-report/src/form/SliderMark.tsx.html +1 -1
package/coverage/lcov-report/src/form/SliderMarkLabel.tsx.html +1 -1
package/coverage/lcov-report/src/form/SliderThumb.tsx.html +1 -1
package/coverage/lcov-report/src/form/SliderTrack.tsx.html +1 -1
package/coverage/lcov-report/src/form/SliderValueMarks.tsx.html +1 -1
package/coverage/lcov-report/src/form/SliderValueTooltip.tsx.html +1 -1
package/coverage/lcov-report/src/form/Switch.tsx.html +1 -1
package/coverage/lcov-report/src/form/SwitchTrack.tsx.html +1 -1
package/coverage/lcov-report/src/form/TextArea.tsx.html +2 -2
package/coverage/lcov-report/src/form/TextField.tsx.html +1 -1
package/coverage/lcov-report/src/form/TextFieldAddon.tsx.html +1 -1
package/coverage/lcov-report/src/form/TextFieldContainer.tsx.html +1 -1
package/coverage/lcov-report/src/form/TextFieldContainerStyles.ts.html +8 -8
package/coverage/lcov-report/src/form/fileUtils.ts.html +1 -1
package/coverage/lcov-report/src/form/formConfig.ts.html +1 -1
package/coverage/lcov-report/src/form/formMessageStyles.ts.html +1 -1
package/coverage/lcov-report/src/form/index.html +940 -10
package/coverage/lcov-report/src/form/inputToggleStyles.ts.html +30 -30
package/coverage/lcov-report/src/form/nativeSelectStyles.ts.html +1 -1
package/coverage/lcov-report/src/form/optionStyles.ts.html +1 -1
package/coverage/lcov-report/src/form/passwordStyles.ts.html +1 -1
package/coverage/lcov-report/src/form/selectStyles.ts.html +1 -1
package/coverage/lcov-report/src/form/selectUtils.ts.html +1 -1
package/coverage/lcov-report/src/form/sliderUtils.ts.html +1 -1
package/coverage/lcov-report/src/form/switchStyles.ts.html +1 -1
package/coverage/lcov-report/src/form/textAreaStyles.ts.html +3 -3
package/coverage/lcov-report/src/form/textFieldStyles.ts.html +1 -1
package/coverage/lcov-report/src/form/useCheckboxGroup.ts.html +1 -1
package/coverage/lcov-report/src/form/useFileUpload.ts.html +1 -1
package/coverage/lcov-report/src/form/useListboxProvider.ts.html +1 -1
package/coverage/lcov-report/src/form/useNumberField.ts.html +1 -1
package/coverage/lcov-report/src/form/useRadioGroup.ts.html +47 -47
package/coverage/lcov-report/src/form/useRangeSlider.ts.html +1 -1
package/coverage/lcov-report/src/form/useResizingTextArea.ts.html +1 -1
package/coverage/lcov-report/src/form/useSlider.ts.html +1 -1
package/coverage/lcov-report/src/form/useTextField.ts.html +1 -1
package/coverage/lcov-report/src/form/utils.ts.html +1 -1
package/coverage/lcov-report/src/form/validation.ts.html +1 -1
package/coverage/lcov-report/src/hoverMode/index.html +1 -1
package/coverage/lcov-report/src/hoverMode/useHoverMode.ts.html +98 -98
package/coverage/lcov-report/src/hoverMode/useHoverModeProvider.ts.html +19 -19
package/coverage/lcov-report/src/icon/FontIcon.tsx.html +28 -28
package/coverage/lcov-report/src/icon/IconRotator.tsx.html +5 -8
package/coverage/lcov-report/src/icon/MaterialIcon.tsx.html +1 -1
package/coverage/lcov-report/src/icon/MaterialSymbol.tsx.html +1 -1
package/coverage/lcov-report/src/icon/SVGIcon.tsx.html +1 -1
package/coverage/lcov-report/src/icon/TextIconSpacing.tsx.html +1 -1
package/coverage/lcov-report/src/icon/iconConfig.tsx.html +8 -8
package/coverage/lcov-report/src/icon/index.html +7 -7
package/coverage/lcov-report/src/icon/material.ts.html +1 -1
package/coverage/lcov-report/src/icon/materialConfig.ts.html +1 -1
package/coverage/lcov-report/src/icon/styles.ts.html +38 -38
package/coverage/lcov-report/src/index.html +354 -9
package/coverage/lcov-report/src/interaction/Ripple.tsx.html +1 -1
package/coverage/lcov-report/src/interaction/RippleContainer.tsx.html +1 -1
package/coverage/lcov-report/src/interaction/UserInteractionModeProvider.tsx.html +87 -87
package/coverage/lcov-report/src/interaction/config.ts.html +7 -7
package/coverage/lcov-report/src/interaction/index.html +1 -1
package/coverage/lcov-report/src/interaction/useElementInteraction.tsx.html +123 -123
package/coverage/lcov-report/src/interaction/useHigherContrastChildren.tsx.html +17 -17
package/coverage/lcov-report/src/interaction/utils.ts.html +1 -1
package/coverage/lcov-report/src/layout/LayoutAppBar.tsx.html +1 -1
package/coverage/lcov-report/src/layout/LayoutNav.tsx.html +60 -60
package/coverage/lcov-report/src/layout/LayoutWindowSplitter.tsx.html +1 -1
package/coverage/lcov-report/src/layout/Main.tsx.html +1 -1
package/coverage/lcov-report/src/layout/index.html +15 -15
package/coverage/lcov-report/src/layout/layoutNavStyles.ts.html +5 -5
package/coverage/lcov-report/src/layout/layoutWindowSplitterStyles.ts.html +1 -1
package/coverage/lcov-report/src/layout/mainStyles.ts.html +1 -1
package/coverage/lcov-report/src/layout/useExpandableLayout.ts.html +1 -1
package/coverage/lcov-report/src/layout/useHorizontalLayoutTransition.ts.html +1 -1
package/coverage/lcov-report/src/layout/useLayoutAppBarHeight.ts.html +20 -32
package/coverage/lcov-report/src/layout/useLayoutTree.ts.html +1 -1
package/coverage/lcov-report/src/layout/useLayoutWindowSplitter.ts.html +1 -1
package/coverage/lcov-report/src/layout/useMainTabIndex.ts.html +1 -1
package/coverage/lcov-report/src/layout/useResizableLayout.ts.html +1 -1
package/coverage/lcov-report/src/layout/useTemporaryLayout.ts.html +1 -1
package/coverage/lcov-report/src/link/Link.tsx.html +1 -1
package/coverage/lcov-report/src/link/SkipToMainContent.tsx.html +1 -1
package/coverage/lcov-report/src/link/index.html +1 -1
package/coverage/lcov-report/src/link/styles.ts.html +1 -1
package/coverage/lcov-report/src/list/List.tsx.html +30 -30
package/coverage/lcov-report/src/list/ListItem.tsx.html +37 -16
package/coverage/lcov-report/src/list/ListItemAddon.tsx.html +13 -7
package/coverage/lcov-report/src/list/ListItemChildren.tsx.html +12 -6
package/coverage/lcov-report/src/list/ListItemLink.tsx.html +4 -4
package/coverage/lcov-report/src/list/ListItemText.tsx.html +1 -1
package/coverage/lcov-report/src/list/ListSubheader.tsx.html +1 -1
package/coverage/lcov-report/src/list/getListItemHeight.ts.html +1 -1
package/coverage/lcov-report/src/list/index.html +11 -11
package/coverage/lcov-report/src/list/listItemStyles.ts.html +39 -9
package/coverage/lcov-report/src/media-queries/AppSizeProvider.tsx.html +54 -54
package/coverage/lcov-report/src/media-queries/appSize.ts.html +1 -1
package/coverage/lcov-report/src/media-queries/index.html +1 -1
package/coverage/lcov-report/src/media-queries/useMediaQuery.ts.html +25 -25
package/coverage/lcov-report/src/menu/DropdownMenu.tsx.html +1 -1
package/coverage/lcov-report/src/menu/Menu.tsx.html +2 -2
package/coverage/lcov-report/src/menu/MenuBar.tsx.html +1 -1
package/coverage/lcov-report/src/menu/MenuButton.tsx.html +1 -1
package/coverage/lcov-report/src/menu/MenuConfigurationProvider.tsx.html +1 -1
package/coverage/lcov-report/src/menu/MenuItem.tsx.html +1 -1
package/coverage/lcov-report/src/menu/MenuItemButton.tsx.html +1 -1
package/coverage/lcov-report/src/menu/MenuItemGroup.tsx.html +1 -1
package/coverage/lcov-report/src/menu/MenuItemSeparator.tsx.html +1 -1
package/coverage/lcov-report/src/menu/MenuSheet.tsx.html +1 -1
package/coverage/lcov-report/src/menu/MenuVisibilityProvider.tsx.html +1 -1
package/coverage/lcov-report/src/menu/MenuWidget.tsx.html +1 -1
package/coverage/lcov-report/src/menu/MenuWidgetKeyboardProvider.tsx.html +1 -1
package/coverage/lcov-report/src/menu/index.html +1 -1
package/coverage/lcov-report/src/menu/useContextMenu.ts.html +1 -1
package/coverage/lcov-report/src/menu/useMenuBarProvider.ts.html +1 -1
package/coverage/lcov-report/src/menu/utils.ts.html +1 -1
package/coverage/lcov-report/src/movement/constants.ts.html +1 -1
package/coverage/lcov-report/src/movement/findMatchIndex.ts.html +1 -1
package/coverage/lcov-report/src/movement/index.html +1 -1
package/coverage/lcov-report/src/movement/useKeyboardMovementProvider.ts.html +3 -3
package/coverage/lcov-report/src/movement/utils.ts.html +1 -1
package/coverage/lcov-report/src/overlay/Overlay.tsx.html +1 -1
package/coverage/lcov-report/src/overlay/index.html +1 -1
package/coverage/lcov-report/src/overlay/overlayStyles.ts.html +1 -1
package/coverage/lcov-report/src/portal/Portal.tsx.html +7 -7
package/coverage/lcov-report/src/portal/PortalContainerProvider.tsx.html +59 -35
package/coverage/lcov-report/src/portal/index.html +7 -7
package/coverage/lcov-report/src/positioning/constants.ts.html +1 -1
package/coverage/lcov-report/src/positioning/createHorizontalPosition.ts.html +47 -47
package/coverage/lcov-report/src/positioning/createVerticalPosition.ts.html +55 -55
package/coverage/lcov-report/src/positioning/getFixedPosition.ts.html +89 -89
package/coverage/lcov-report/src/positioning/index.html +1 -1
package/coverage/lcov-report/src/positioning/useFixedPositioning.ts.html +193 -193
package/coverage/lcov-report/src/positioning/utils.ts.html +59 -59
package/coverage/lcov-report/src/progress/CircularProgress.tsx.html +3 -3
package/coverage/lcov-report/src/progress/LinearProgress.tsx.html +3 -3
package/coverage/lcov-report/src/progress/getProgressA11y.ts.html +1 -1
package/coverage/lcov-report/src/progress/index.html +20 -5
package/coverage/lcov-report/src/responsive-item/ResponsiveItemContainer.tsx.html +1 -1
package/coverage/lcov-report/src/responsive-item/ResponsiveItemOverlay.tsx.html +1 -1
package/coverage/lcov-report/src/responsive-item/index.html +1 -1
package/coverage/lcov-report/src/responsive-item/styles.ts.html +1 -1
package/coverage/lcov-report/src/scroll/ScrollLock.tsx.html +1 -1
package/coverage/lcov-report/src/scroll/getScrollbarWidth.ts.html +1 -1
package/coverage/lcov-report/src/scroll/index.html +1 -1
package/coverage/lcov-report/src/scroll/useScrollLock.ts.html +1 -1
package/coverage/lcov-report/src/segmented-button/SegmentedButton.tsx.html +1 -1
package/coverage/lcov-report/src/segmented-button/SegmentedButtonContainer.tsx.html +1 -1
package/coverage/lcov-report/src/segmented-button/index.html +1 -1
package/coverage/lcov-report/src/segmented-button/segmentedButtonContainerStyles.ts.html +1 -1
package/coverage/lcov-report/src/segmented-button/segmentedButtonStyles.ts.html +1 -1
package/coverage/lcov-report/src/sheet/Sheet.tsx.html +1 -1
package/coverage/lcov-report/src/sheet/index.html +5 -5
package/coverage/lcov-report/src/sheet/styles.ts.html +45 -48
package/coverage/lcov-report/src/snackbar/DefaultToastRenderer.tsx.html +80 -80
package/coverage/lcov-report/src/snackbar/Snackbar.tsx.html +21 -45
package/coverage/lcov-report/src/snackbar/Toast.tsx.html +108 -93
package/coverage/lcov-report/src/snackbar/ToastActionButton.tsx.html +1 -1
package/coverage/lcov-report/src/snackbar/ToastCloseButton.tsx.html +1 -1
package/coverage/lcov-report/src/snackbar/ToastContent.tsx.html +48 -48
package/coverage/lcov-report/src/snackbar/ToastManager.tsx.html +278 -275
package/coverage/lcov-report/src/snackbar/ToastManagerProvider.tsx.html +6 -6
package/coverage/lcov-report/src/snackbar/index.html +19 -19
package/coverage/lcov-report/src/snackbar/snackbarStyles.ts.html +15 -15
package/coverage/lcov-report/src/snackbar/toastContentStyles.ts.html +14 -14
package/coverage/lcov-report/src/snackbar/toastStyles.ts.html +27 -27
package/coverage/lcov-report/src/snackbar/useCurrentToastActions.ts.html +1 -1
package/coverage/lcov-report/src/suspense/CircularProgressSuspense.tsx.html +1 -1
package/coverage/lcov-report/src/suspense/NullSuspense.tsx.html +1 -1
package/coverage/lcov-report/src/suspense/index.html +20 -5
package/coverage/lcov-report/src/table/Table.tsx.html +45 -114
package/coverage/lcov-report/src/table/TableBody.tsx.html +43 -43
package/coverage/lcov-report/src/table/TableCell.tsx.html +109 -298
package/coverage/lcov-report/src/table/TableCellContent.tsx.html +81 -27
package/coverage/lcov-report/src/table/TableCheckbox.tsx.html +16 -10
package/coverage/lcov-report/src/table/TableConfigurationProvider.tsx.html +20 -20
package/coverage/lcov-report/src/table/TableContainer.tsx.html +7 -28
package/coverage/lcov-report/src/table/TableContainerProvider.tsx.html +1 -1
package/coverage/lcov-report/src/table/TableFooter.tsx.html +64 -43
package/coverage/lcov-report/src/table/TableHeader.tsx.html +41 -92
package/coverage/lcov-report/src/table/TableRadio.tsx.html +676 -0
package/coverage/lcov-report/src/table/TableRow.tsx.html +38 -119
package/coverage/lcov-report/src/table/index.html +151 -46
package/coverage/lcov-report/src/table/tableCellStyles.ts.html +334 -0
package/coverage/lcov-report/src/table/tableContainerStyles.ts.html +142 -0
package/coverage/lcov-report/src/table/tableFooterStyles.ts.html +166 -0
package/coverage/lcov-report/src/table/tableHeaderStyles.ts.html +172 -0
package/coverage/lcov-report/src/table/tableRowStyles.ts.html +169 -0
package/coverage/lcov-report/src/table/tableStyles.ts.html +157 -0
package/coverage/lcov-report/src/tabs/Tab.tsx.html +263 -143
package/coverage/lcov-report/src/tabs/TabList.tsx.html +1 -1
package/coverage/lcov-report/src/tabs/TabListScrollButton.tsx.html +1 -1
package/coverage/lcov-report/src/tabs/index.html +25 -25
package/coverage/lcov-report/src/tabs/tabIndicatorStyles.ts.html +37 -7
package/coverage/lcov-report/src/tabs/tabListScrollButtonStyles.ts.html +1 -1
package/coverage/lcov-report/src/tabs/tabListStyles.ts.html +2 -2
package/coverage/lcov-report/src/tabs/tabStyles.ts.html +64 -28
package/coverage/lcov-report/src/tabs/useTabList.ts.html +44 -38
package/coverage/lcov-report/src/tabs/useTabs.ts.html +1 -1
package/coverage/lcov-report/src/tabs/utils.ts.html +3 -3
package/coverage/lcov-report/src/test-utils/IntersectionObserver.ts.html +1 -1
package/coverage/lcov-report/src/test-utils/ResizeObserver.ts.html +205 -205
package/coverage/lcov-report/src/test-utils/data-testid.ts.html +1 -1
package/coverage/lcov-report/src/test-utils/drag.ts.html +1 -1
package/coverage/lcov-report/src/test-utils/index.html +4 -4
package/coverage/lcov-report/src/test-utils/jest-setup.ts.html +9 -9
package/coverage/lcov-report/src/test-utils/matchMedia.ts.html +4 -4
package/coverage/lcov-report/src/test-utils/polyfills/IntersectionObserver.ts.html +4 -4
package/coverage/lcov-report/src/test-utils/polyfills/ResizeObserver.ts.html +3 -3
package/coverage/lcov-report/src/test-utils/polyfills/index.html +1 -1
package/coverage/lcov-report/src/test-utils/polyfills/matchMedia.ts.html +6 -6
package/coverage/lcov-report/src/test-utils/polyfills/offsetParent.ts.html +14 -14
package/coverage/lcov-report/src/test-utils/polyfills/scrollIntoView.ts.html +5 -5
package/coverage/lcov-report/src/test-utils/render.tsx.html +21 -21
package/coverage/lcov-report/src/test-utils/timers.ts.html +1 -1
package/coverage/lcov-report/src/theme/LocalStorageColorSchemeProvider.tsx.html +1 -1
package/coverage/lcov-report/src/theme/ThemeProvider.tsx.html +1 -1
package/coverage/lcov-report/src/theme/colors.ts.html +1 -1
package/coverage/lcov-report/src/theme/cssVars.ts.html +1 -1
package/coverage/lcov-report/src/theme/index.html +1 -1
package/coverage/lcov-report/src/theme/useCSSVariables.ts.html +25 -25
package/coverage/lcov-report/src/theme/useColorScheme.ts.html +1 -1
package/coverage/lcov-report/src/theme/useColorSchemeMetaTag.ts.html +1 -1
package/coverage/lcov-report/src/theme/useColorSchemeProvider.ts.html +1 -1
package/coverage/lcov-report/src/theme/usePrefersColorScheme.ts.html +1 -1
package/coverage/lcov-report/src/theme/utils.ts.html +1 -1
package/coverage/lcov-report/src/tooltip/Tooltip.tsx.html +62 -62
package/coverage/lcov-report/src/tooltip/TooltipHoverModeProvider.tsx.html +3 -3
package/coverage/lcov-report/src/tooltip/constants.ts.html +1 -1
package/coverage/lcov-report/src/tooltip/index.html +9 -9
package/coverage/lcov-report/src/tooltip/tooltipStyles.ts.html +12 -12
package/coverage/lcov-report/src/tooltip/useTooltip.ts.html +243 -222
package/coverage/lcov-report/src/tooltip/useTooltipPosition.ts.html +27 -27
package/coverage/lcov-report/src/tooltip/utils.ts.html +22 -22
package/coverage/lcov-report/src/transition/CSSTransition.tsx.html +1 -1
package/coverage/lcov-report/src/transition/Collapse.tsx.html +1 -1
package/coverage/lcov-report/src/transition/CrossFade.tsx.html +1 -1
package/coverage/lcov-report/src/transition/ScaleTransition.tsx.html +1 -1
package/coverage/lcov-report/src/transition/SkeletonPlaceholder.tsx.html +374 -338
package/coverage/lcov-report/src/transition/Slide.tsx.html +1 -1
package/coverage/lcov-report/src/transition/SlideContainer.tsx.html +1 -1
package/coverage/lcov-report/src/transition/collapseStyles.ts.html +13 -13
package/coverage/lcov-report/src/transition/config.ts.html +5 -5
package/coverage/lcov-report/src/transition/index.html +47 -32
package/coverage/lcov-report/src/transition/maxWidthTransition.ts.html +1 -1
package/coverage/lcov-report/src/transition/skeletonPlaceholderUtils.ts.html +400 -0
package/coverage/lcov-report/src/transition/useCSSTransition.ts.html +68 -68
package/coverage/lcov-report/src/transition/useCarousel.ts.html +1 -1
package/coverage/lcov-report/src/transition/useCollapseTransition.ts.html +87 -87
package/coverage/lcov-report/src/transition/useCrossFadeTransition.ts.html +1 -1
package/coverage/lcov-report/src/transition/useMaxWidthTransition.ts.html +1 -1
package/coverage/lcov-report/src/transition/useScaleTransition.ts.html +18 -18
package/coverage/lcov-report/src/transition/useSkeletonPlaceholder.ts.html +607 -562
package/coverage/lcov-report/src/transition/useSlideTransition.ts.html +1 -1
package/coverage/lcov-report/src/transition/useTransition.ts.html +237 -237
package/coverage/lcov-report/src/transition/utils.ts.html +43 -43
package/coverage/lcov-report/src/tree/DefaultTreeItemRenderer.tsx.html +18 -6
package/coverage/lcov-report/src/tree/Tree.tsx.html +20 -8
package/coverage/lcov-report/src/tree/TreeGroup.tsx.html +45 -45
package/coverage/lcov-report/src/tree/TreeItem.tsx.html +7 -10
package/coverage/lcov-report/src/tree/TreeItemExpander.tsx.html +1 -1
package/coverage/lcov-report/src/tree/TreeProvider.tsx.html +8 -8
package/coverage/lcov-report/src/tree/index.html +11 -11
package/coverage/lcov-report/src/tree/styles.ts.html +8 -35
package/coverage/lcov-report/src/tree/useTree.ts.html +1 -1
package/coverage/lcov-report/src/tree/useTreeExpansion.ts.html +1 -1
package/coverage/lcov-report/src/tree/useTreeItems.ts.html +1 -1
package/coverage/lcov-report/src/tree/useTreeMovement.ts.html +1 -1
package/coverage/lcov-report/src/tree/useTreeSelection.ts.html +1 -1
package/coverage/lcov-report/src/tree/utils.ts.html +1 -1
package/coverage/lcov-report/src/typography/SrOnly.tsx.html +1 -1
package/coverage/lcov-report/src/typography/TextContainer.tsx.html +1 -1
package/coverage/lcov-report/src/typography/Typography.tsx.html +1 -1
package/coverage/lcov-report/src/typography/WritingDirectionProvider.tsx.html +1 -1
package/coverage/lcov-report/src/typography/index.html +1 -1
package/coverage/lcov-report/src/useAsyncAction.ts.html +1 -1
package/coverage/lcov-report/src/useDebouncedFunction.ts.html +1 -1
package/coverage/lcov-report/src/useDropzone.ts.html +1 -1
package/coverage/lcov-report/src/useElementSize.ts.html +334 -0
package/coverage/lcov-report/src/useEnsuredId.ts.html +8 -8
package/coverage/lcov-report/src/useEnsuredRef.ts.html +14 -14
package/coverage/lcov-report/src/useEnsuredState.ts.html +1 -1
package/coverage/lcov-report/src/useHtmlClassName.ts.html +1 -1
package/coverage/lcov-report/src/useIntersectionObserver.ts.html +1 -1
package/coverage/lcov-report/src/useIsomorphicLayoutEffect.ts.html +1 -1
package/coverage/lcov-report/src/useLocalStorage.ts.html +1 -1
package/coverage/lcov-report/src/useOrientation.ts.html +32 -32
package/coverage/lcov-report/src/usePageInactive.ts.html +30 -30
package/coverage/lcov-report/src/useResizeListener.ts.html +38 -32
package/coverage/lcov-report/src/useResizeObserver.ts.html +68 -179
package/coverage/lcov-report/src/useThrottledFunction.ts.html +1 -1
package/coverage/lcov-report/src/useToggle.ts.html +1 -1
package/coverage/lcov-report/src/useUnmounted.ts.html +1 -1
package/coverage/lcov-report/src/useWindowSize.ts.html +124 -94
package/coverage/lcov-report/src/utils/RenderRecursively.tsx.html +1 -1
package/coverage/lcov-report/src/utils/alphaNumericSort.ts.html +1 -1
package/coverage/lcov-report/src/utils/applyRef.ts.html +11 -11
package/coverage/lcov-report/src/utils/bem.ts.html +45 -45
package/coverage/lcov-report/src/utils/filters.ts.html +1 -1
package/coverage/lcov-report/src/utils/getClientPosition.ts.html +1 -1
package/coverage/lcov-report/src/utils/getMiddleOfRange.ts.html +163 -0
package/coverage/lcov-report/src/utils/getPercentage.ts.html +9 -9
package/coverage/lcov-report/src/utils/getRangeDefaultValue.ts.html +66 -87
package/coverage/lcov-report/src/utils/getRangeSteps.ts.html +7 -7
package/coverage/lcov-report/src/utils/identity.ts.html +1 -1
package/coverage/lcov-report/src/utils/index.html +46 -31
package/coverage/lcov-report/src/utils/isElementVisible.ts.html +1 -1
package/coverage/lcov-report/src/utils/isValidNumber.ts.html +118 -0
package/coverage/lcov-report/src/utils/loop.ts.html +1 -1
package/coverage/lcov-report/src/utils/nearest.ts.html +21 -21
package/coverage/lcov-report/src/utils/parseCssLengthUnit.ts.html +18 -18
package/coverage/lcov-report/src/utils/randomInt.ts.html +52 -52
package/coverage/lcov-report/src/utils/wait.ts.html +1 -1
package/coverage/lcov-report/src/utils/withinRange.ts.html +1 -1
package/coverage/lcov-report/src/window-splitter/WindowSplitter.tsx.html +1 -1
package/coverage/lcov-report/src/window-splitter/index.html +14 -14
package/coverage/lcov-report/src/window-splitter/useWindowSplitter.ts.html +19 -67
package/coverage/lcov-report/src/window-splitter/useWindowSplitterMaxValue.ts.html +256 -0
package/coverage/lcov-report/suspense/CircularProgressSuspense.tsx.html +283 -0
package/coverage/lcov-report/suspense/NullSuspense.tsx.html +202 -0
package/coverage/lcov-report/suspense/index.html +131 -0
package/coverage/lcov-report/tabIndicatorStyles.ts.html +43 -13
package/coverage/lcov-report/tabListStyles.ts.html +35 -26
package/coverage/lcov-report/tabStyles.ts.html +68 -26
package/coverage/lcov-report/tabs/Tab.tsx.html +233 -143
package/coverage/lcov-report/tabs/TabList.tsx.html +85 -85
package/coverage/lcov-report/tabs/index.html +56 -11
package/coverage/lcov-report/tabs/tabIndicatorStyles.ts.html +187 -0
package/coverage/lcov-report/tabs/tabListStyles.ts.html +241 -0
package/coverage/lcov-report/tabs/tabStyles.ts.html +253 -0
package/coverage/lcov-report/tabs/useTabList.ts.html +736 -0
package/coverage/lcov-report/tabs/useTabs.ts.html +1 -1
package/coverage/lcov-report/tabs/utils.ts.html +1 -1
package/coverage/lcov-report/test-utils/index.html +21 -21
package/coverage/lcov-report/test-utils/use.ts.html +187 -0
package/coverage/lcov-report/tooltip/Tooltip.tsx.html +62 -62
package/coverage/lcov-report/tooltip/index.html +10 -70
package/coverage/lcov-report/tooltip/useTooltip.ts.html +243 -222
package/coverage/lcov-report/transition/SkeletonPlaceholder.tsx.html +595 -0
package/coverage/lcov-report/transition/config.ts.html +5 -5
package/coverage/lcov-report/transition/index.html +1 -1
package/coverage/lcov-report/transition/skeletonPlaceholderUtils.ts.html +400 -0
package/coverage/lcov-report/transition/useSkeletonPlaceholder.ts.html +952 -0
package/coverage/lcov-report/tree/TreeItem.tsx.html +7 -10
package/coverage/lcov-report/tree/index.html +12 -27
package/coverage/lcov-report/tree/styles.ts.html +538 -0
package/coverage/lcov-report/typography/Typography.tsx.html +138 -432
package/coverage/lcov-report/typography/WritingDirectionProvider.tsx.html +75 -75
package/coverage/lcov-report/typography/index.html +18 -18
package/coverage/lcov-report/useSkeletonPlaceholder.ts.html +952 -0
package/coverage/lcov-report/useTabList.ts.html +142 -136
package/coverage/lcov-report/useWindowSplitter.ts.html +640 -0
package/coverage/lcov-report/useWindowSplitterMaxValue.ts.html +256 -0
package/coverage/lcov-report/utils/index.html +16 -31
package/coverage/lcov-report/utils/isElementVisible.ts.html +14 -14
package/coverage/lcov-report/utils/randomInt.ts.html +148 -0
package/coverage/lcov-report/utils/wait.ts.html +1 -1
package/coverage/lcov-report/window-splitter/index.html +21 -36
package/coverage/lcov-report/window-splitter/useWindowSplitter.ts.html +406 -328
package/coverage/lcov.info +474 -0
package/dist/_box-shadows.scss +12 -2
package/dist/_core.scss +34 -3
package/dist/_utils.scss +79 -0
package/dist/app-bar/AppBar.d.ts +4 -9
package/dist/app-bar/AppBar.js +29 -7
package/dist/app-bar/AppBar.js.map +1 -1
package/dist/app-bar/_app-bar.scss +22 -32
package/dist/avatar/Avatar.d.ts +1 -1
package/dist/avatar/Avatar.js.map +1 -1
package/dist/avatar/_avatar.scss +25 -34
package/dist/badge/_badge.scss +80 -48
package/dist/box/_box.scss +18 -29
package/dist/button/TooltippedButton.d.ts +62 -0
package/dist/button/TooltippedButton.js +62 -0
package/dist/button/TooltippedButton.js.map +1 -0
package/dist/button/_button.scss +50 -62
package/dist/card/Card.js +3 -2
package/dist/card/Card.js.map +1 -1
package/dist/card/CardContent.js +1 -1
package/dist/card/CardContent.js.map +1 -1
package/dist/card/ClickableCard.d.ts +42 -0
package/dist/card/ClickableCard.js +73 -0
package/dist/card/ClickableCard.js.map +1 -0
package/dist/card/_card.scss +29 -32
package/dist/card/styles.d.ts +8 -0
package/dist/card/styles.js +6 -3
package/dist/card/styles.js.map +1 -1
package/dist/chip/_chip.scss +33 -46
package/dist/dialog/_dialog.scss +118 -103
package/dist/divider/Divider.d.ts +0 -1
package/dist/divider/Divider.js.map +1 -1
package/dist/divider/_divider.scss +40 -51
package/dist/draggable/useDraggable.d.ts +12 -23
package/dist/draggable/useDraggable.js +15 -6
package/dist/draggable/useDraggable.js.map +1 -1
package/dist/draggable/utils.d.ts +4 -17
package/dist/draggable/utils.js +9 -25
package/dist/draggable/utils.js.map +1 -1
package/dist/expansion-panel/_expansion-panel.scss +25 -16
package/dist/expansion-panel/useExpansionPanels.d.ts +5 -3
package/dist/expansion-panel/useExpansionPanels.js +16 -9
package/dist/expansion-panel/useExpansionPanels.js.map +1 -1
package/dist/form/Label.d.ts +5 -5
package/dist/form/Label.js.map +1 -1
package/dist/form/MenuItemInputToggle.d.ts +1 -1
package/dist/form/MenuItemInputToggle.js.map +1 -1
package/dist/form/Select.js +6 -1
package/dist/form/Select.js.map +1 -1
package/dist/form/TextArea.js +1 -1
package/dist/form/TextArea.js.map +1 -1
package/dist/form/TextFieldContainerStyles.d.ts +7 -7
package/dist/form/TextFieldContainerStyles.js.map +1 -1
package/dist/form/_form.scss +240 -225
package/dist/form/textAreaStyles.d.ts +2 -2
package/dist/form/textAreaStyles.js.map +1 -1
package/dist/form/types.d.ts +0 -2
package/dist/form/types.js.map +1 -1
package/dist/icon/IconRotator.js +2 -3
package/dist/icon/IconRotator.js.map +1 -1
package/dist/icon/_icon.scss +38 -49
package/dist/index.d.ts +5 -0
package/dist/index.js +5 -0
package/dist/index.js.map +1 -1
package/dist/interaction/_interaction.scss +59 -66
package/dist/layout/_layout.scss +14 -19
package/dist/layout/useLayoutAppBarHeight.js +5 -9
package/dist/layout/useLayoutAppBarHeight.js.map +1 -1
package/dist/link/_link.scss +41 -35
package/dist/list/ListItem.d.ts +8 -3
package/dist/list/ListItem.js +4 -3
package/dist/list/ListItem.js.map +1 -1
package/dist/list/ListItemAddon.js +2 -1
package/dist/list/ListItemAddon.js.map +1 -1
package/dist/list/ListItemChildren.js +3 -2
package/dist/list/ListItemChildren.js.map +1 -1
package/dist/list/ListItemLink.js +3 -3
package/dist/list/ListItemLink.js.map +1 -1
package/dist/list/_list.scss +75 -74
package/dist/list/listItemStyles.d.ts +9 -1
package/dist/list/listItemStyles.js +5 -5
package/dist/list/listItemStyles.js.map +1 -1
package/dist/list/types.d.ts +14 -4
package/dist/list/types.js.map +1 -1
package/dist/menu/Menu.d.ts +1 -1
package/dist/menu/Menu.js.map +1 -1
package/dist/menu/_menu.scss +19 -41
package/dist/overlay/_overlay.scss +14 -19
package/dist/portal/PortalContainerProvider.d.ts +2 -2
package/dist/portal/PortalContainerProvider.js +6 -1
package/dist/portal/PortalContainerProvider.js.map +1 -1
package/dist/progress/_progress.scss +25 -30
package/dist/segmented-button/_segmented-button.scss +32 -43
package/dist/sheet/_sheet.scss +24 -42
package/dist/sheet/styles.d.ts +14 -15
package/dist/sheet/styles.js.map +1 -1
package/dist/snackbar/DefaultToastRenderer.js +1 -1
package/dist/snackbar/DefaultToastRenderer.js.map +1 -1
package/dist/snackbar/Snackbar.d.ts +1 -3
package/dist/snackbar/Snackbar.js +2 -3
package/dist/snackbar/Snackbar.js.map +1 -1
package/dist/snackbar/Toast.d.ts +1 -1
package/dist/snackbar/Toast.js +5 -1
package/dist/snackbar/Toast.js.map +1 -1
package/dist/snackbar/ToastManager.d.ts +2 -1
package/dist/snackbar/ToastManager.js +1 -1
package/dist/snackbar/ToastManager.js.map +1 -1
package/dist/snackbar/_snackbar.scss +15 -23
package/dist/table/TableCheckbox.d.ts +3 -2
package/dist/table/TableCheckbox.js +4 -2
package/dist/table/TableCheckbox.js.map +1 -1
package/dist/table/TableRadio.d.ts +3 -2
package/dist/table/TableRadio.js +4 -2
package/dist/table/TableRadio.js.map +1 -1
package/dist/table/_table.scss +55 -70
package/dist/table/tableCellStyles.d.ts +1 -1
package/dist/table/tableCellStyles.js.map +1 -1
package/dist/tabs/Tab.d.ts +24 -3
package/dist/tabs/Tab.js +15 -8
package/dist/tabs/Tab.js.map +1 -1
package/dist/tabs/_tabs.scss +54 -47
package/dist/tabs/tabIndicatorStyles.d.ts +2 -1
package/dist/tabs/tabIndicatorStyles.js +6 -3
package/dist/tabs/tabIndicatorStyles.js.map +1 -1
package/dist/tabs/tabListStyles.js +2 -1
package/dist/tabs/tabListStyles.js.map +1 -1
package/dist/tabs/tabStyles.d.ts +2 -0
package/dist/tabs/tabStyles.js +6 -3
package/dist/tabs/tabStyles.js.map +1 -1
package/dist/tabs/useTabList.d.ts +3 -3
package/dist/tabs/useTabList.js +9 -6
package/dist/tabs/useTabList.js.map +1 -1
package/dist/theme/_theme.scss +31 -89
package/dist/tooltip/_tooltip.scss +16 -25
package/dist/tooltip/useTooltip.d.ts +14 -14
package/dist/tooltip/useTooltip.js.map +1 -1
package/dist/transition/SkeletonPlaceholder.d.ts +2 -2
package/dist/transition/SkeletonPlaceholder.js +8 -3
package/dist/transition/SkeletonPlaceholder.js.map +1 -1
package/dist/transition/_transition.scss +50 -44
package/dist/transition/skeletonPlaceholderUtils.d.ts +77 -0
package/dist/transition/skeletonPlaceholderUtils.js +38 -0
package/dist/transition/skeletonPlaceholderUtils.js.map +1 -0
package/dist/transition/useSkeletonPlaceholder.d.ts +12 -7
package/dist/transition/useSkeletonPlaceholder.js +38 -37
package/dist/transition/useSkeletonPlaceholder.js.map +1 -1
package/dist/tree/DefaultTreeItemRenderer.d.ts +2 -2
package/dist/tree/DefaultTreeItemRenderer.js.map +1 -1
package/dist/tree/Tree.d.ts +8 -4
package/dist/tree/Tree.js.map +1 -1
package/dist/tree/TreeItem.js +3 -4
package/dist/tree/TreeItem.js.map +1 -1
package/dist/tree/_tree.scss +106 -106
package/dist/tree/styles.d.ts +0 -6
package/dist/tree/styles.js +1 -2
package/dist/tree/styles.js.map +1 -1
package/dist/types.d.ts +7 -0
package/dist/types.js +1 -2
package/dist/types.js.map +1 -1
package/dist/typography/_typography.scss +30 -25
package/dist/useElementSize.d.ts +40 -0
package/dist/useElementSize.js +53 -0
package/dist/useElementSize.js.map +1 -0
package/dist/useResizeListener.d.ts +1 -1
package/dist/useResizeListener.js +1 -0
package/dist/useResizeListener.js.map +1 -1
package/dist/useResizeObserver.d.ts +4 -43
package/dist/useResizeObserver.js +3 -42
package/dist/useResizeObserver.js.map +1 -1
package/dist/useWindowSize.d.ts +14 -11
package/dist/useWindowSize.js +12 -7
package/dist/useWindowSize.js.map +1 -1
package/dist/utils/getMiddleOfRange.d.ts +13 -0
package/dist/utils/getMiddleOfRange.js +20 -0
package/dist/utils/getMiddleOfRange.js.map +1 -0
package/dist/utils/getRangeDefaultValue.d.ts +3 -5
package/dist/utils/getRangeDefaultValue.js +3 -13
package/dist/utils/getRangeDefaultValue.js.map +1 -1
package/dist/utils/getRangeSteps.d.ts +1 -1
package/dist/utils/getRangeSteps.js +2 -2
package/dist/utils/getRangeSteps.js.map +1 -1
package/dist/utils/nearest.js +1 -1
package/dist/utils/nearest.js.map +1 -1
package/dist/window-splitter/_window-splitter.scss +30 -61
package/dist/window-splitter/useWindowSplitter.d.ts +3 -5
package/dist/window-splitter/useWindowSplitter.js +3 -11
package/dist/window-splitter/useWindowSplitter.js.map +1 -1
package/package.json +18 -18
package/src/__tests__/useElementSize.tsx +181 -0
package/src/__tests__/useWindowSize.node.tsx +56 -0
package/src/__tests__/useWindowSize.tsx +156 -0
package/src/_box-shadows.scss +12 -2
package/src/_core.scss +34 -3
package/src/_utils.scss +79 -0
package/src/app-bar/AppBar.tsx +59 -19
package/src/app-bar/__tests__/__snapshots__/AppBar.tsx.snap +21 -21
package/src/app-bar/_app-bar.scss +22 -32
package/src/avatar/Avatar.tsx +1 -1
package/src/avatar/_avatar.scss +25 -34
package/src/badge/_badge.scss +80 -48
package/src/box/_box.scss +18 -29
package/src/button/TooltippedButton.tsx +120 -0
package/src/button/__tests__/TooltippedButton.tsx +60 -0
package/src/button/__tests__/__snapshots__/TooltippedButton.tsx.snap +26 -0
package/src/button/_button.scss +50 -62
package/src/card/Card.tsx +5 -3
package/src/card/CardContent.tsx +3 -3
package/src/card/ClickableCard.tsx +105 -0
package/src/card/__tests__/ClickableCard.tsx +66 -0
package/src/card/__tests__/__snapshots__/CardHeader.tsx.snap +1 -1
package/src/card/__tests__/__snapshots__/CardSubtitle.tsx.snap +2 -2
package/src/card/__tests__/__snapshots__/ClickableCard.tsx.snap +20 -0
package/src/card/__tests__/__snapshots__/styles.ts.snap +1 -1
package/src/card/_card.scss +29 -32
package/src/card/styles.ts +19 -10
package/src/chip/_chip.scss +33 -46
package/src/dialog/_dialog.scss +118 -103
package/src/divider/Divider.tsx +0 -1
package/src/divider/_divider.scss +40 -51
package/src/draggable/useDraggable.ts +26 -25
package/src/draggable/utils.ts +16 -50
package/src/expansion-panel/__tests__/ExpansionPanel.tsx +2 -2
package/src/expansion-panel/_expansion-panel.scss +25 -16
package/src/expansion-panel/useExpansionPanels.ts +20 -16
package/src/form/Label.tsx +5 -5
package/src/form/MenuItemInputToggle.tsx +1 -1
package/src/form/Select.tsx +9 -1
package/src/form/TextArea.tsx +1 -1
package/src/form/TextFieldContainerStyles.ts +7 -7
package/src/form/_form.scss +240 -225
package/src/form/textAreaStyles.ts +2 -2
package/src/form/types.ts +0 -2
package/src/icon/IconRotator.tsx +1 -2
package/src/icon/_icon.scss +38 -49
package/src/index.ts +5 -0
package/src/interaction/_interaction.scss +59 -66
package/src/layout/__tests__/__snapshots__/LayoutAppBar.tsx.snap +4 -4
package/src/layout/__tests__/__snapshots__/useExpandableLayout.tsx.snap +1 -1
package/src/layout/__tests__/__snapshots__/useLayoutTree.tsx.snap +18 -18
package/src/layout/__tests__/__snapshots__/useResizableLayout.tsx.snap +1 -1
package/src/layout/__tests__/__snapshots__/useTemporaryLayout.tsx.snap +1 -1
package/src/layout/_layout.scss +14 -19
package/src/layout/useLayoutAppBarHeight.ts +5 -9
package/src/link/_link.scss +41 -35
package/src/list/ListItem.tsx +19 -12
package/src/list/ListItemAddon.tsx +5 -3
package/src/list/ListItemChildren.tsx +4 -2
package/src/list/ListItemLink.tsx +3 -3
package/src/list/__tests__/ListItem.tsx +1 -1
package/src/list/__tests__/__snapshots__/ListItem.tsx.snap +1 -1
package/src/list/_list.scss +75 -74
package/src/list/listItemStyles.ts +15 -5
package/src/list/types.ts +15 -4
package/src/menu/Menu.tsx +1 -1
package/src/menu/_menu.scss +19 -41
package/src/overlay/_overlay.scss +14 -19
package/src/portal/PortalContainerProvider.tsx +10 -2
package/src/portal/__tests__/PortalContainerProvider.tsx +23 -0
package/src/progress/_progress.scss +25 -30
package/src/segmented-button/_segmented-button.scss +32 -43
package/src/sheet/_sheet.scss +24 -42
package/src/sheet/styles.ts +14 -15
package/src/snackbar/DefaultToastRenderer.tsx +1 -1
package/src/snackbar/Snackbar.tsx +17 -25
package/src/snackbar/Toast.tsx +7 -2
package/src/snackbar/ToastManager.tsx +3 -2
package/src/snackbar/__tests__/Snackbar.tsx +12 -11
package/src/snackbar/__tests__/ToastManagerProvider.tsx +20 -42
package/src/snackbar/__tests__/__snapshots__/Snackbar.tsx.snap +127 -27
package/src/snackbar/__tests__/__snapshots__/ToastManagerProvider.tsx.snap +23 -8
package/src/snackbar/_snackbar.scss +15 -23
package/src/suspense/__tests__/CircularProgressSuspense.tsx +90 -0
package/src/suspense/__tests__/NullSuspense.tsx +46 -0
package/src/suspense/__tests__/__snapshots__/CircularProgressSuspense.tsx.snap +24 -0
package/src/table/TableCheckbox.tsx +4 -2
package/src/table/TableRadio.tsx +4 -2
package/src/table/_table.scss +55 -70
package/src/table/tableCellStyles.ts +1 -1
package/src/tabs/Tab.tsx +110 -70
package/src/tabs/__tests__/Tab.tsx +25 -2
package/src/tabs/__tests__/TabList.tsx +4 -4
package/src/tabs/__tests__/__snapshots__/TabList.tsx.snap +2 -2
package/src/tabs/_tabs.scss +54 -47
package/src/tabs/tabIndicatorStyles.ts +13 -3
package/src/tabs/tabListStyles.ts +1 -1
package/src/tabs/tabStyles.ts +16 -4
package/src/tabs/useTabList.ts +10 -8
package/src/theme/_theme.scss +31 -89
package/src/tooltip/_tooltip.scss +16 -25
package/src/tooltip/useTooltip.ts +23 -16
package/src/transition/SkeletonPlaceholder.tsx +18 -6
package/src/transition/__tests__/SkeletonPlaceholder.tsx +72 -0
package/src/transition/__tests__/__snapshots__/SkeletonPlaceholder.tsx.snap +24 -0
package/src/transition/_transition.scss +50 -44
package/src/transition/skeletonPlaceholderUtils.ts +105 -0
package/src/transition/useSkeletonPlaceholder.ts +62 -47
package/src/tree/DefaultTreeItemRenderer.tsx +6 -2
package/src/tree/Tree.tsx +8 -4
package/src/tree/TreeItem.tsx +3 -4
package/src/tree/__tests__/Tree.tsx +1 -1
package/src/tree/__tests__/__snapshots__/Tree.tsx.snap +124 -124
package/src/tree/_tree.scss +106 -106
package/src/tree/styles.ts +0 -9
package/src/types.ts +8 -0
package/src/typography/_typography.scss +30 -25
package/src/useElementSize.ts +83 -0
package/src/useResizeListener.ts +3 -1
package/src/useResizeObserver.ts +7 -44
package/src/useWindowSize.ts +29 -19
package/src/utils/__tests__/getMiddleOfRange.ts +12 -0
package/src/utils/__tests__/getRangeDefaultValue.ts +47 -0
package/src/utils/getMiddleOfRange.ts +26 -0
package/src/utils/getRangeDefaultValue.ts +8 -15
package/src/utils/getRangeSteps.ts +2 -2
package/src/utils/nearest.ts +1 -1
package/src/window-splitter/_window-splitter.scss +30 -61
package/src/window-splitter/useWindowSplitter.ts +12 -28
package/dist/divider/VerticalDivider.d.ts +0 -32
package/dist/divider/useVerticalDividerHeight.d.ts +0 -37
package/dist/icon/MaterialIconsProvider.d.ts +0 -12
package/dist/icon/MaterialIconsProvider.js +0 -17
package/dist/icon/MaterialIconsProvider.js.map +0 -1
package/dist/icon/MaterialSymbolsProvider.d.ts +0 -145
package/dist/icon/MaterialSymbolsProvider.js +0 -60
package/dist/icon/MaterialSymbolsProvider.js.map +0 -1
package/dist/link/LinkProvider.d.ts +0 -29
package/dist/menu/menuConfig.d.ts +0 -60
package/dist/tooltip/useOverflowTooltip.d.ts +0 -61

package/coverage/lcov-report/useSkeletonPlaceholder.ts.html ADDED Viewed

@@ -0,0 +1,952 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <title>Code coverage report for useSkeletonPlaceholder.ts</title>
+    <meta charset="utf-8" />
+    <link rel="stylesheet" href="prettify.css" />
+    <link rel="stylesheet" href="base.css" />
+    <link rel="shortcut icon" type="image/x-icon" href="favicon.png" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <style type='text/css'>
+        .coverage-summary .sorter {
+            background-image: url(sort-arrow-sprite.png);
+        }
+    </style>
+</head>
+<body>
+<div class='wrapper'>
+    <div class='pad1'>
+        <h1><a href="index.html">All files</a> useSkeletonPlaceholder.ts</h1>
+        <div class='clearfix'>
+            <div class='fl pad1y space-right2'>
+                <span class="strong">100% </span>
+                <span class="quiet">Statements</span>
+                <span class='fraction'>289/289</span>
+            </div>
+            <div class='fl pad1y space-right2'>
+                <span class="strong">85% </span>
+                <span class="quiet">Branches</span>
+                <span class='fraction'>17/20</span>
+            </div>
+            <div class='fl pad1y space-right2'>
+                <span class="strong">100% </span>
+                <span class="quiet">Functions</span>
+                <span class='fraction'>1/1</span>
+            </div>
+            <div class='fl pad1y space-right2'>
+                <span class="strong">100% </span>
+                <span class="quiet">Lines</span>
+                <span class='fraction'>289/289</span>
+            </div>
+        </div>
+        <p class="quiet">
+            Press <em>n</em> or <em>j</em> to go to the next uncovered block, <em>b</em>, <em>p</em> or <em>k</em> for the previous block.
+        </p>
+        <template id="filterTemplate">
+            <div class="quiet">
+                Filter:
+                <input oninput="onInput()" type="search" id="fileSearch">
+            </div>
+        </template>
+    </div>
+    <div class='status-line high'></div>
+    <pre><table class="coverage">
+<tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
+<a name='L2'></a><a href='#L2'>2</a>
+<a name='L3'></a><a href='#L3'>3</a>
+<a name='L4'></a><a href='#L4'>4</a>
+<a name='L5'></a><a href='#L5'>5</a>
+<a name='L6'></a><a href='#L6'>6</a>
+<a name='L7'></a><a href='#L7'>7</a>
+<a name='L8'></a><a href='#L8'>8</a>
+<a name='L9'></a><a href='#L9'>9</a>
+<a name='L10'></a><a href='#L10'>10</a>
+<a name='L11'></a><a href='#L11'>11</a>
+<a name='L12'></a><a href='#L12'>12</a>
+<a name='L13'></a><a href='#L13'>13</a>
+<a name='L14'></a><a href='#L14'>14</a>
+<a name='L15'></a><a href='#L15'>15</a>
+<a name='L16'></a><a href='#L16'>16</a>
+<a name='L17'></a><a href='#L17'>17</a>
+<a name='L18'></a><a href='#L18'>18</a>
+<a name='L19'></a><a href='#L19'>19</a>
+<a name='L20'></a><a href='#L20'>20</a>
+<a name='L21'></a><a href='#L21'>21</a>
+<a name='L22'></a><a href='#L22'>22</a>
+<a name='L23'></a><a href='#L23'>23</a>
+<a name='L24'></a><a href='#L24'>24</a>
+<a name='L25'></a><a href='#L25'>25</a>
+<a name='L26'></a><a href='#L26'>26</a>
+<a name='L27'></a><a href='#L27'>27</a>
+<a name='L28'></a><a href='#L28'>28</a>
+<a name='L29'></a><a href='#L29'>29</a>
+<a name='L30'></a><a href='#L30'>30</a>
+<a name='L31'></a><a href='#L31'>31</a>
+<a name='L32'></a><a href='#L32'>32</a>
+<a name='L33'></a><a href='#L33'>33</a>
+<a name='L34'></a><a href='#L34'>34</a>
+<a name='L35'></a><a href='#L35'>35</a>
+<a name='L36'></a><a href='#L36'>36</a>
+<a name='L37'></a><a href='#L37'>37</a>
+<a name='L38'></a><a href='#L38'>38</a>
+<a name='L39'></a><a href='#L39'>39</a>
+<a name='L40'></a><a href='#L40'>40</a>
+<a name='L41'></a><a href='#L41'>41</a>
+<a name='L42'></a><a href='#L42'>42</a>
+<a name='L43'></a><a href='#L43'>43</a>
+<a name='L44'></a><a href='#L44'>44</a>
+<a name='L45'></a><a href='#L45'>45</a>
+<a name='L46'></a><a href='#L46'>46</a>
+<a name='L47'></a><a href='#L47'>47</a>
+<a name='L48'></a><a href='#L48'>48</a>
+<a name='L49'></a><a href='#L49'>49</a>
+<a name='L50'></a><a href='#L50'>50</a>
+<a name='L51'></a><a href='#L51'>51</a>
+<a name='L52'></a><a href='#L52'>52</a>
+<a name='L53'></a><a href='#L53'>53</a>
+<a name='L54'></a><a href='#L54'>54</a>
+<a name='L55'></a><a href='#L55'>55</a>
+<a name='L56'></a><a href='#L56'>56</a>
+<a name='L57'></a><a href='#L57'>57</a>
+<a name='L58'></a><a href='#L58'>58</a>
+<a name='L59'></a><a href='#L59'>59</a>
+<a name='L60'></a><a href='#L60'>60</a>
+<a name='L61'></a><a href='#L61'>61</a>
+<a name='L62'></a><a href='#L62'>62</a>
+<a name='L63'></a><a href='#L63'>63</a>
+<a name='L64'></a><a href='#L64'>64</a>
+<a name='L65'></a><a href='#L65'>65</a>
+<a name='L66'></a><a href='#L66'>66</a>
+<a name='L67'></a><a href='#L67'>67</a>
+<a name='L68'></a><a href='#L68'>68</a>
+<a name='L69'></a><a href='#L69'>69</a>
+<a name='L70'></a><a href='#L70'>70</a>
+<a name='L71'></a><a href='#L71'>71</a>
+<a name='L72'></a><a href='#L72'>72</a>
+<a name='L73'></a><a href='#L73'>73</a>
+<a name='L74'></a><a href='#L74'>74</a>
+<a name='L75'></a><a href='#L75'>75</a>
+<a name='L76'></a><a href='#L76'>76</a>
+<a name='L77'></a><a href='#L77'>77</a>
+<a name='L78'></a><a href='#L78'>78</a>
+<a name='L79'></a><a href='#L79'>79</a>
+<a name='L80'></a><a href='#L80'>80</a>
+<a name='L81'></a><a href='#L81'>81</a>
+<a name='L82'></a><a href='#L82'>82</a>
+<a name='L83'></a><a href='#L83'>83</a>
+<a name='L84'></a><a href='#L84'>84</a>
+<a name='L85'></a><a href='#L85'>85</a>
+<a name='L86'></a><a href='#L86'>86</a>
+<a name='L87'></a><a href='#L87'>87</a>
+<a name='L88'></a><a href='#L88'>88</a>
+<a name='L89'></a><a href='#L89'>89</a>
+<a name='L90'></a><a href='#L90'>90</a>
+<a name='L91'></a><a href='#L91'>91</a>
+<a name='L92'></a><a href='#L92'>92</a>
+<a name='L93'></a><a href='#L93'>93</a>
+<a name='L94'></a><a href='#L94'>94</a>
+<a name='L95'></a><a href='#L95'>95</a>
+<a name='L96'></a><a href='#L96'>96</a>
+<a name='L97'></a><a href='#L97'>97</a>
+<a name='L98'></a><a href='#L98'>98</a>
+<a name='L99'></a><a href='#L99'>99</a>
+<a name='L100'></a><a href='#L100'>100</a>
+<a name='L101'></a><a href='#L101'>101</a>
+<a name='L102'></a><a href='#L102'>102</a>
+<a name='L103'></a><a href='#L103'>103</a>
+<a name='L104'></a><a href='#L104'>104</a>
+<a name='L105'></a><a href='#L105'>105</a>
+<a name='L106'></a><a href='#L106'>106</a>
+<a name='L107'></a><a href='#L107'>107</a>
+<a name='L108'></a><a href='#L108'>108</a>
+<a name='L109'></a><a href='#L109'>109</a>
+<a name='L110'></a><a href='#L110'>110</a>
+<a name='L111'></a><a href='#L111'>111</a>
+<a name='L112'></a><a href='#L112'>112</a>
+<a name='L113'></a><a href='#L113'>113</a>
+<a name='L114'></a><a href='#L114'>114</a>
+<a name='L115'></a><a href='#L115'>115</a>
+<a name='L116'></a><a href='#L116'>116</a>
+<a name='L117'></a><a href='#L117'>117</a>
+<a name='L118'></a><a href='#L118'>118</a>
+<a name='L119'></a><a href='#L119'>119</a>
+<a name='L120'></a><a href='#L120'>120</a>
+<a name='L121'></a><a href='#L121'>121</a>
+<a name='L122'></a><a href='#L122'>122</a>
+<a name='L123'></a><a href='#L123'>123</a>
+<a name='L124'></a><a href='#L124'>124</a>
+<a name='L125'></a><a href='#L125'>125</a>
+<a name='L126'></a><a href='#L126'>126</a>
+<a name='L127'></a><a href='#L127'>127</a>
+<a name='L128'></a><a href='#L128'>128</a>
+<a name='L129'></a><a href='#L129'>129</a>
+<a name='L130'></a><a href='#L130'>130</a>
+<a name='L131'></a><a href='#L131'>131</a>
+<a name='L132'></a><a href='#L132'>132</a>
+<a name='L133'></a><a href='#L133'>133</a>
+<a name='L134'></a><a href='#L134'>134</a>
+<a name='L135'></a><a href='#L135'>135</a>
+<a name='L136'></a><a href='#L136'>136</a>
+<a name='L137'></a><a href='#L137'>137</a>
+<a name='L138'></a><a href='#L138'>138</a>
+<a name='L139'></a><a href='#L139'>139</a>
+<a name='L140'></a><a href='#L140'>140</a>
+<a name='L141'></a><a href='#L141'>141</a>
+<a name='L142'></a><a href='#L142'>142</a>
+<a name='L143'></a><a href='#L143'>143</a>
+<a name='L144'></a><a href='#L144'>144</a>
+<a name='L145'></a><a href='#L145'>145</a>
+<a name='L146'></a><a href='#L146'>146</a>
+<a name='L147'></a><a href='#L147'>147</a>
+<a name='L148'></a><a href='#L148'>148</a>
+<a name='L149'></a><a href='#L149'>149</a>
+<a name='L150'></a><a href='#L150'>150</a>
+<a name='L151'></a><a href='#L151'>151</a>
+<a name='L152'></a><a href='#L152'>152</a>
+<a name='L153'></a><a href='#L153'>153</a>
+<a name='L154'></a><a href='#L154'>154</a>
+<a name='L155'></a><a href='#L155'>155</a>
+<a name='L156'></a><a href='#L156'>156</a>
+<a name='L157'></a><a href='#L157'>157</a>
+<a name='L158'></a><a href='#L158'>158</a>
+<a name='L159'></a><a href='#L159'>159</a>
+<a name='L160'></a><a href='#L160'>160</a>
+<a name='L161'></a><a href='#L161'>161</a>
+<a name='L162'></a><a href='#L162'>162</a>
+<a name='L163'></a><a href='#L163'>163</a>
+<a name='L164'></a><a href='#L164'>164</a>
+<a name='L165'></a><a href='#L165'>165</a>
+<a name='L166'></a><a href='#L166'>166</a>
+<a name='L167'></a><a href='#L167'>167</a>
+<a name='L168'></a><a href='#L168'>168</a>
+<a name='L169'></a><a href='#L169'>169</a>
+<a name='L170'></a><a href='#L170'>170</a>
+<a name='L171'></a><a href='#L171'>171</a>
+<a name='L172'></a><a href='#L172'>172</a>
+<a name='L173'></a><a href='#L173'>173</a>
+<a name='L174'></a><a href='#L174'>174</a>
+<a name='L175'></a><a href='#L175'>175</a>
+<a name='L176'></a><a href='#L176'>176</a>
+<a name='L177'></a><a href='#L177'>177</a>
+<a name='L178'></a><a href='#L178'>178</a>
+<a name='L179'></a><a href='#L179'>179</a>
+<a name='L180'></a><a href='#L180'>180</a>
+<a name='L181'></a><a href='#L181'>181</a>
+<a name='L182'></a><a href='#L182'>182</a>
+<a name='L183'></a><a href='#L183'>183</a>
+<a name='L184'></a><a href='#L184'>184</a>
+<a name='L185'></a><a href='#L185'>185</a>
+<a name='L186'></a><a href='#L186'>186</a>
+<a name='L187'></a><a href='#L187'>187</a>
+<a name='L188'></a><a href='#L188'>188</a>
+<a name='L189'></a><a href='#L189'>189</a>
+<a name='L190'></a><a href='#L190'>190</a>
+<a name='L191'></a><a href='#L191'>191</a>
+<a name='L192'></a><a href='#L192'>192</a>
+<a name='L193'></a><a href='#L193'>193</a>
+<a name='L194'></a><a href='#L194'>194</a>
+<a name='L195'></a><a href='#L195'>195</a>
+<a name='L196'></a><a href='#L196'>196</a>
+<a name='L197'></a><a href='#L197'>197</a>
+<a name='L198'></a><a href='#L198'>198</a>
+<a name='L199'></a><a href='#L199'>199</a>
+<a name='L200'></a><a href='#L200'>200</a>
+<a name='L201'></a><a href='#L201'>201</a>
+<a name='L202'></a><a href='#L202'>202</a>
+<a name='L203'></a><a href='#L203'>203</a>
+<a name='L204'></a><a href='#L204'>204</a>
+<a name='L205'></a><a href='#L205'>205</a>
+<a name='L206'></a><a href='#L206'>206</a>
+<a name='L207'></a><a href='#L207'>207</a>
+<a name='L208'></a><a href='#L208'>208</a>
+<a name='L209'></a><a href='#L209'>209</a>
+<a name='L210'></a><a href='#L210'>210</a>
+<a name='L211'></a><a href='#L211'>211</a>
+<a name='L212'></a><a href='#L212'>212</a>
+<a name='L213'></a><a href='#L213'>213</a>
+<a name='L214'></a><a href='#L214'>214</a>
+<a name='L215'></a><a href='#L215'>215</a>
+<a name='L216'></a><a href='#L216'>216</a>
+<a name='L217'></a><a href='#L217'>217</a>
+<a name='L218'></a><a href='#L218'>218</a>
+<a name='L219'></a><a href='#L219'>219</a>
+<a name='L220'></a><a href='#L220'>220</a>
+<a name='L221'></a><a href='#L221'>221</a>
+<a name='L222'></a><a href='#L222'>222</a>
+<a name='L223'></a><a href='#L223'>223</a>
+<a name='L224'></a><a href='#L224'>224</a>
+<a name='L225'></a><a href='#L225'>225</a>
+<a name='L226'></a><a href='#L226'>226</a>
+<a name='L227'></a><a href='#L227'>227</a>
+<a name='L228'></a><a href='#L228'>228</a>
+<a name='L229'></a><a href='#L229'>229</a>
+<a name='L230'></a><a href='#L230'>230</a>
+<a name='L231'></a><a href='#L231'>231</a>
+<a name='L232'></a><a href='#L232'>232</a>
+<a name='L233'></a><a href='#L233'>233</a>
+<a name='L234'></a><a href='#L234'>234</a>
+<a name='L235'></a><a href='#L235'>235</a>
+<a name='L236'></a><a href='#L236'>236</a>
+<a name='L237'></a><a href='#L237'>237</a>
+<a name='L238'></a><a href='#L238'>238</a>
+<a name='L239'></a><a href='#L239'>239</a>
+<a name='L240'></a><a href='#L240'>240</a>
+<a name='L241'></a><a href='#L241'>241</a>
+<a name='L242'></a><a href='#L242'>242</a>
+<a name='L243'></a><a href='#L243'>243</a>
+<a name='L244'></a><a href='#L244'>244</a>
+<a name='L245'></a><a href='#L245'>245</a>
+<a name='L246'></a><a href='#L246'>246</a>
+<a name='L247'></a><a href='#L247'>247</a>
+<a name='L248'></a><a href='#L248'>248</a>
+<a name='L249'></a><a href='#L249'>249</a>
+<a name='L250'></a><a href='#L250'>250</a>
+<a name='L251'></a><a href='#L251'>251</a>
+<a name='L252'></a><a href='#L252'>252</a>
+<a name='L253'></a><a href='#L253'>253</a>
+<a name='L254'></a><a href='#L254'>254</a>
+<a name='L255'></a><a href='#L255'>255</a>
+<a name='L256'></a><a href='#L256'>256</a>
+<a name='L257'></a><a href='#L257'>257</a>
+<a name='L258'></a><a href='#L258'>258</a>
+<a name='L259'></a><a href='#L259'>259</a>
+<a name='L260'></a><a href='#L260'>260</a>
+<a name='L261'></a><a href='#L261'>261</a>
+<a name='L262'></a><a href='#L262'>262</a>
+<a name='L263'></a><a href='#L263'>263</a>
+<a name='L264'></a><a href='#L264'>264</a>
+<a name='L265'></a><a href='#L265'>265</a>
+<a name='L266'></a><a href='#L266'>266</a>
+<a name='L267'></a><a href='#L267'>267</a>
+<a name='L268'></a><a href='#L268'>268</a>
+<a name='L269'></a><a href='#L269'>269</a>
+<a name='L270'></a><a href='#L270'>270</a>
+<a name='L271'></a><a href='#L271'>271</a>
+<a name='L272'></a><a href='#L272'>272</a>
+<a name='L273'></a><a href='#L273'>273</a>
+<a name='L274'></a><a href='#L274'>274</a>
+<a name='L275'></a><a href='#L275'>275</a>
+<a name='L276'></a><a href='#L276'>276</a>
+<a name='L277'></a><a href='#L277'>277</a>
+<a name='L278'></a><a href='#L278'>278</a>
+<a name='L279'></a><a href='#L279'>279</a>
+<a name='L280'></a><a href='#L280'>280</a>
+<a name='L281'></a><a href='#L281'>281</a>
+<a name='L282'></a><a href='#L282'>282</a>
+<a name='L283'></a><a href='#L283'>283</a>
+<a name='L284'></a><a href='#L284'>284</a>
+<a name='L285'></a><a href='#L285'>285</a>
+<a name='L286'></a><a href='#L286'>286</a>
+<a name='L287'></a><a href='#L287'>287</a>
+<a name='L288'></a><a href='#L288'>288</a>
+<a name='L289'></a><a href='#L289'>289</a>
+<a name='L290'></a><a href='#L290'>290</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">2x</span>
+<span class="cline-any cline-yes">2x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">4x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">1x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">3x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">"use client";
+import { cnb } from "cnbuilder";
+import { useEffect, useState, type CSSProperties } from "react";
+import { useSsr } from "../SsrProvider.js";
+import {
+  randomSkeletonPlaceholder,
+  skeletonPlaceholder,
+  type SkeletonPlaceholderRandomOptions,
+} from "./skeletonPlaceholderUtils.js";
+&nbsp;
+/** @remarks \@since 6.0.0 */
+export interface SkeletonPlaceholderOptions
+  extends SkeletonPlaceholderRandomOptions {
+  style?: CSSProperties;
+  className?: string;
+&nbsp;
+  /**
+   * Set this to a custom `animation-delay` value (should be in milliseconds).
+   *
+   * @example
+   * ```ts
+   * delay="200ms"
+   * ```
+   */
+  delay?: string;
+&nbsp;
+  /**
+   * Set this value tp a number or length unit string to set the height with
+   * inline styles.
+   *
+   * If this is `undefined`, it will use the skeleton placeholder CSS variable
+   * value instead which defaults to `1.125em`
+   *
+   * @defaultValue `undefined`
+   */
+  height?: string | number;
+&nbsp;
+  /**
+   * A custom width to apply to the skeleton placeholder.
+   *
+   * Set this value to an empty string if you want to control the width through
+   * SCSS.
+   *
+   * @example
+   * No Inline Width CSS
+   * ```scss
+   * @use "@react-md/core";
+   *
+   * .customStyles {
+   *   // You could use these mixins on a parent element instead which would
+   *   // set the height and width to all skeleton placeholders that appear as a
+   *   // child instead
+   *   // @include core.transition-set-var(skeleton-placeholder-height, 1.5rem);
+   *   // @include core.transition-set-var(skeleton-placeholder-width, 40%);
+   *
+   *   height: 1,5rem;
+   *   width: 40%;
+   * }
+   * ```
+   *
+   * @example
+   * No Inline Width
+   * ```ts
+   * import type { ReactElement } from "@react";
+   * import { useSkeletonPlaceholder } from "@react-md/core";
+   *
+   * import styles from "./MyComponent.module.scss";
+   *
+   * export function Example(): ReactElement {
+   *   const skeletonProps = useSkeletonPlaceholder({
+   *     width: null,
+   *     className: styles.customStyles,
+   *   });
+   *
+   *   return &lt;div {...skeletonProps} /&gt;;
+   * }
+   * ```
+   *
+   *
+   * Set this value to a number or length unit string to set the width with
+   * inline styles.
+   *
+   * @example
+   * Custom Inline Width
+   * ```ts
+   * import type { ReactElement } from "@react";
+   * import { useSkeletonPlaceholder } from "@react-md/core";
+   *
+   * export function Example(): ReactElement {
+   *   const skeletonProps = useSkeletonPlaceholder({
+   *     // any of these are valid
+   *     // width: 40,
+   *     // width: "1rem",
+   *     // width: "1vh",
+   *     // width: "40%",
+   *     width: "1rem",
+   *   });
+   *
+   *   return &lt;div {...skeletonProps} /&gt;;
+   * }
+   * ```
+   *
+   * If this value is `undefined`, a random percentage will be generated instead
+   * using the {@link minPercentage} and {@link maxPercentage} options.
+   *
+   * Set this value to `null` if the size should be derived from the provided
+   * `className` instead.
+   *
+   * @defaultValue `randomInt({ min: minPercentage, max: maxPercentage })%`
+   */
+  width?: number | string | null;
+&nbsp;
+  /**
+   * Settings this to `true` will prevent any of the skeleton placeholder styles
+   * to be applied. This is really only useful if you can prerender parts of
+   * your layout while waiting for the data to load.
+   *
+   * @example
+   * Pre-rendered Layout
+   * ```tsx
+   * import type { ReactElement } from "@react";
+   * import { SkeletonPlaceholder } from "@react-md/core";
+   *
+   * interface Data {
+   *   id: string;
+   *   name: string;
+   *   createdBy: string
+   *   createdOn: string;
+   *   modifiedBy: string;
+   *   modifiedOn: string;
+   * }
+   *
+   * function ShowData({
+   *   id,
+   *   name,
+   *   createdBy,
+   *   createdOn,
+   *   modifiedBy,
+   *   modifiedOn,
+   * }: Partial&lt;Data&gt;:: ReactElement {
+   *   const loading =
+   *     !name &amp;&amp;
+   *     !createdBy &amp;&amp;
+   *     !createdOn &amp;&amp;
+   *     !modifiedBy &amp;&amp;
+   *     !modifiedOn;
+   *
+   *   return (
+   *     &lt;Box grid gridClassName="custom-class-name"&gt;
+   *       &lt;SkeletonPlaceholder disabled={!loading}&gt;
+   *         {id}
+   *       &lt;/SkeletonPlaceholder&gt;
+   *       &lt;SkeletonPlaceholder disabled={!loading}&gt;
+   *         {name}
+   *       &lt;/SkeletonPlaceholder&gt;
+   *       &lt;SkeletonPlaceholder disabled={!loading}&gt;
+   *         {createdOn}
+   *       &lt;/SkeletonPlaceholder&gt;
+   *       &lt;SkeletonPlaceholder disabled={!loading}&gt;
+   *         {createdBy}
+   *       &lt;/SkeletonPlaceholder&gt;
+   *       &lt;SkeletonPlaceholder disabled={!loading}&gt;
+   *         {modifiedOn}
+   *       &lt;/SkeletonPlaceholder&gt;
+   *       &lt;SkeletonPlaceholder disabled={!loading}&gt;
+   *         {modifiedBy}
+   *       &lt;/SkeletonPlaceholder&gt;
+   *     &lt;/Box&gt;
+   *   );
+   * }
+   *
+   * export function Example(): ReactElement {
+   *   const { data } = useLoadSomeDataQuery();
+   *
+   *   const items = useMemo(() =&gt; {
+   *     // if the data has been fetched, just return the data
+   *     if (data) {
+   *       return data;
+   *     }
+   *
+   *     // if the data does not exist, set up a skeleton of your layout by
+   *     // rendering a random number of items.
+   *     //
+   *     // NOTE: This is memoized so you don't create a random length each
+   *     // render
+   *     const length = randomInt({ min: 3, max: 10 })
+   *     return Array.from({ length }, (_, i) =&gt; ({ id: `placeholder-${i}` }));
+   *   }, [data])
+   *
+   *   return (
+   *     &lt;List&gt;
+   *       {items.map((item) =&gt; &lt;ShowData {...item} /&gt;)}
+   *     &lt;/List&gt;
+   *   );
+   * }
+   * ```
+   *
+   * @defaultValue `false`
+   */
+  disabled?: boolean;
+}
+&nbsp;
+export interface SkeletonPlaceholderStylingProps {
+  style?: CSSProperties;
+  className: string;
+}
+&nbsp;
+export function useSkeletonPlaceholder(
+  options: SkeletonPlaceholderOptions = {}
+): SkeletonPlaceholderStylingProps {
+  const {
+    style: propStyle,
+    className,
+    height,
+    width: propWidth,
+    disabled = false,
+    delay: propDelay,
+    minDelay,
+    maxDelay,
+    minPercentage,
+    maxPercentage,
+  } = options;
+  const ssr = useSsr();
+&nbsp;
+  const isDefinedWidth = typeof propWidth !== "undefined";
+  const isDefinedDelay = typeof propDelay !== "undefined";
+  const [randomStyles, setRandomStyles] = useState&lt;CSSProperties&gt;(() =&gt; {
+    if (typeof window === "undefined" || ssr || disabled) {
+      return {};
+    }
+&nbsp;
+    return randomSkeletonPlaceholder({
+      minDelay,
+      maxDelay,
+      minPercentage,
+      maxPercentage,
+    });
+  });
+&nbsp;
+  useEffect(() =&gt; {
+    if (!ssr || disabled || (<span class="branch-0 cbranch-no" title="branch not covered" >isDefinedDelay &amp;&amp; isDefinedWidth)) {</span>
+      return;
+    }
+&nbsp;
+    setRandomStyles(
+      randomSkeletonPlaceholder({
+        minDelay,
+        maxDelay,
+        minPercentage,
+        maxPercentage,
+      })
+    );
+  }, [
+    disabled,
+    isDefinedDelay,
+    isDefinedWidth,
+    maxDelay,
+    maxPercentage,
+    minDelay,
+    minPercentage,
+    ssr,
+  ]);
+&nbsp;
+  let width = propWidth;
+  let animationDelay = propDelay;
+  if (!isDefinedDelay) {
+    ({ animationDelay } = randomStyles);
+  }
+  if (!isDefinedWidth) {
+    ({ width } = randomStyles);
+  }
+&nbsp;
+  let style: CSSProperties | undefined = propStyle;
+  if (!!width || !!animationDelay || typeof height !== "undefined") {
+    style = {
+      ...style,
+      height: height ?? style?.height,
+      width: <span class="branch-0 cbranch-no" title="branch not covered" >width ?? style?.width,</span>
+      // Note: not including MozAnimationDelay and WebkitAnimationDelay since
+      // they weren't applied when they were set. Probably no longer required?
+      animationDelay: <span class="branch-0 cbranch-no" title="branch not covered" >animationDelay ?? style?.animationDelay,</span>
+    };
+  }
+&nbsp;
+  return {
+    style,
+    className: cnb(className, !disabled &amp;&amp; skeletonPlaceholder()),
+  };
+}
+&nbsp;</pre></td></tr></table></pre>
+                <div class='push'></div><!-- for sticky footer -->
+            </div><!-- /wrapper -->
+            <div class='footer quiet pad2 space-top1 center small'>
+                Code coverage generated by
+                <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
+                at 2023-12-02T01:30:29.148Z
+            </div>
+        <script src="prettify.js"></script>
+        <script>
+            window.onload = function () {
+                prettyPrint();
+            };
+        </script>
+        <script src="sorter.js"></script>
+        <script src="block-navigation.js"></script>
+    </body>
+</html>