@gnome-ui/react 1.45.1 → 1.46.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/AboutDialog/AboutDialog.cjs +1 -1
- package/dist/components/AboutDialog/AboutDialog.cjs.map +1 -1
- package/dist/components/AboutDialog/AboutDialog.d.ts +1 -1
- package/dist/components/AboutDialog/AboutDialog.js +106 -108
- package/dist/components/AboutDialog/AboutDialog.js.map +1 -1
- package/dist/components/AboutDialog/AboutDialog.module.css.cjs +1 -1
- package/dist/components/AboutDialog/AboutDialog.module.css.js +28 -29
- package/dist/components/AboutDialog.cjs +1 -1
- package/dist/components/ActionRow/ActionRow.cjs +1 -1
- package/dist/components/ActionRow/ActionRow.cjs.map +1 -1
- package/dist/components/ActionRow/ActionRow.d.ts +1 -1
- package/dist/components/ActionRow/ActionRow.js +2 -2
- package/dist/components/ActionRow/ActionRow.js.map +1 -1
- package/dist/components/ActionRow.cjs +1 -1
- package/dist/components/Avatar/Avatar.cjs +1 -1
- package/dist/components/Avatar/Avatar.cjs.map +1 -1
- package/dist/components/Avatar/Avatar.d.ts +1 -1
- package/dist/components/Avatar/Avatar.js +2 -2
- package/dist/components/Avatar/Avatar.js.map +1 -1
- package/dist/components/Avatar.cjs +1 -1
- package/dist/components/AvatarRotator/AvatarRotator.cjs +1 -1
- package/dist/components/AvatarRotator/AvatarRotator.cjs.map +1 -1
- package/dist/components/AvatarRotator/AvatarRotator.d.ts +1 -1
- package/dist/components/AvatarRotator/AvatarRotator.js +2 -2
- package/dist/components/AvatarRotator/AvatarRotator.js.map +1 -1
- package/dist/components/AvatarRotator.cjs +1 -1
- package/dist/components/Badge/Badge.cjs +1 -1
- package/dist/components/Badge/Badge.cjs.map +1 -1
- package/dist/components/Badge/Badge.d.ts +1 -1
- package/dist/components/Badge/Badge.js +2 -2
- package/dist/components/Badge/Badge.js.map +1 -1
- package/dist/components/Badge.cjs +1 -1
- package/dist/components/Banner/Banner.cjs +1 -1
- package/dist/components/Banner/Banner.cjs.map +1 -1
- package/dist/components/Banner/Banner.d.ts +1 -1
- package/dist/components/Banner/Banner.js +34 -36
- package/dist/components/Banner/Banner.js.map +1 -1
- package/dist/components/Banner/Banner.module.css.cjs +1 -1
- package/dist/components/Banner/Banner.module.css.js +11 -12
- package/dist/components/Banner.cjs +1 -1
- package/dist/components/Bin/Bin.cjs +1 -1
- package/dist/components/Bin/Bin.cjs.map +1 -1
- package/dist/components/Bin/Bin.d.ts +1 -1
- package/dist/components/Bin/Bin.js +4 -6
- package/dist/components/Bin/Bin.js.map +1 -1
- package/dist/components/Bin.cjs +1 -1
- package/dist/components/Blockquote/Blockquote.cjs +1 -1
- package/dist/components/Blockquote/Blockquote.cjs.map +1 -1
- package/dist/components/Blockquote/Blockquote.d.ts +1 -1
- package/dist/components/Blockquote/Blockquote.js +24 -26
- package/dist/components/Blockquote/Blockquote.js.map +1 -1
- package/dist/components/Blockquote.cjs +1 -1
- package/dist/components/BottomSheet/BottomSheet.cjs +1 -1
- package/dist/components/BottomSheet/BottomSheet.cjs.map +1 -1
- package/dist/components/BottomSheet/BottomSheet.d.ts +1 -1
- package/dist/components/BottomSheet/BottomSheet.js +37 -38
- package/dist/components/BottomSheet/BottomSheet.js.map +1 -1
- package/dist/components/BottomSheet/BottomSheet.module.css.cjs +1 -1
- package/dist/components/BottomSheet/BottomSheet.module.css.js +8 -9
- package/dist/components/BottomSheet.cjs +1 -1
- package/dist/components/Box/Box.cjs +1 -1
- package/dist/components/Box/Box.cjs.map +1 -1
- package/dist/components/Box/Box.d.ts +1 -1
- package/dist/components/Box/Box.js +2 -2
- package/dist/components/Box/Box.js.map +1 -1
- package/dist/components/Box.cjs +1 -1
- package/dist/components/BoxedList/BoxedList.cjs +1 -1
- package/dist/components/BoxedList/BoxedList.cjs.map +1 -1
- package/dist/components/BoxedList/BoxedList.d.ts +1 -1
- package/dist/components/BoxedList/BoxedList.js +2 -2
- package/dist/components/BoxedList/BoxedList.js.map +1 -1
- package/dist/components/BoxedList.cjs +1 -1
- package/dist/components/BreakpointBin/BreakpointBin.cjs +1 -1
- package/dist/components/BreakpointBin/BreakpointBin.cjs.map +1 -1
- package/dist/components/BreakpointBin/BreakpointBin.d.ts +1 -1
- package/dist/components/BreakpointBin/BreakpointBin.js +2 -2
- package/dist/components/BreakpointBin/BreakpointBin.js.map +1 -1
- package/dist/components/BreakpointBin.cjs +1 -1
- package/dist/components/Button/Button.cjs +1 -1
- package/dist/components/Button/Button.cjs.map +1 -1
- package/dist/components/Button/Button.js.map +1 -1
- package/dist/components/Button.cjs +1 -1
- package/dist/components/ButtonContent/ButtonContent.cjs +1 -1
- package/dist/components/ButtonContent/ButtonContent.cjs.map +1 -1
- package/dist/components/ButtonContent/ButtonContent.d.ts +1 -1
- package/dist/components/ButtonContent/ButtonContent.js +24 -26
- package/dist/components/ButtonContent/ButtonContent.js.map +1 -1
- package/dist/components/ButtonContent.cjs +1 -1
- package/dist/components/ButtonRow/ButtonRow.cjs +1 -1
- package/dist/components/ButtonRow/ButtonRow.cjs.map +1 -1
- package/dist/components/ButtonRow/ButtonRow.d.ts +1 -1
- package/dist/components/ButtonRow/ButtonRow.js +22 -24
- package/dist/components/ButtonRow/ButtonRow.js.map +1 -1
- package/dist/components/ButtonRow.cjs +1 -1
- package/dist/components/Card/Card.cjs +1 -1
- package/dist/components/Card/Card.cjs.map +1 -1
- package/dist/components/Card/Card.d.ts +1 -1
- package/dist/components/Card/Card.js +10 -12
- package/dist/components/Card/Card.js.map +1 -1
- package/dist/components/Card/Card.module.css.cjs +1 -1
- package/dist/components/Card/Card.module.css.js +4 -5
- package/dist/components/Card.cjs +1 -1
- package/dist/components/Carousel/Carousel.cjs +1 -1
- package/dist/components/Carousel/Carousel.cjs.map +1 -1
- package/dist/components/Carousel/Carousel.d.ts +3 -3
- package/dist/components/Carousel/Carousel.js +28 -34
- package/dist/components/Carousel/Carousel.js.map +1 -1
- package/dist/components/Carousel.cjs +1 -1
- package/dist/components/CheckRow/CheckRow.cjs +1 -1
- package/dist/components/CheckRow/CheckRow.cjs.map +1 -1
- package/dist/components/CheckRow/CheckRow.d.ts +1 -1
- package/dist/components/CheckRow/CheckRow.js +7 -7
- package/dist/components/CheckRow/CheckRow.js.map +1 -1
- package/dist/components/CheckRow.cjs +1 -1
- package/dist/components/Checkbox/Checkbox.cjs +1 -1
- package/dist/components/Checkbox/Checkbox.cjs.map +1 -1
- package/dist/components/Checkbox/Checkbox.d.ts +1 -1
- package/dist/components/Checkbox/Checkbox.js +2 -2
- package/dist/components/Checkbox/Checkbox.js.map +1 -1
- package/dist/components/Checkbox.cjs +1 -1
- package/dist/components/Chip/Chip.cjs +1 -1
- package/dist/components/Chip/Chip.cjs.map +1 -1
- package/dist/components/Chip/Chip.d.ts +1 -1
- package/dist/components/Chip/Chip.js +2 -2
- package/dist/components/Chip/Chip.js.map +1 -1
- package/dist/components/Chip.cjs +1 -1
- package/dist/components/Clamp/Clamp.cjs +1 -1
- package/dist/components/Clamp/Clamp.cjs.map +1 -1
- package/dist/components/Clamp/Clamp.d.ts +1 -1
- package/dist/components/Clamp/Clamp.js +9 -11
- package/dist/components/Clamp/Clamp.js.map +1 -1
- package/dist/components/Clamp.cjs +1 -1
- package/dist/components/ColorPicker/ColorPicker.cjs +1 -1
- package/dist/components/ColorPicker/ColorPicker.cjs.map +1 -1
- package/dist/components/ColorPicker/ColorPicker.d.ts +2 -2
- package/dist/components/ColorPicker/ColorPicker.js +33 -37
- package/dist/components/ColorPicker/ColorPicker.js.map +1 -1
- package/dist/components/ColorPicker/ColorPicker.module.css.cjs +1 -1
- package/dist/components/ColorPicker/ColorPicker.module.css.js +9 -10
- package/dist/components/ColorPicker.cjs +1 -1
- package/dist/components/ColumnView/ColumnView.cjs +1 -1
- package/dist/components/ColumnView/ColumnView.cjs.map +1 -1
- package/dist/components/ColumnView/ColumnView.d.ts +1 -1
- package/dist/components/ColumnView/ColumnView.js +24 -28
- package/dist/components/ColumnView/ColumnView.js.map +1 -1
- package/dist/components/ColumnView.cjs +1 -1
- package/dist/components/ComboRow/ComboRow.cjs +1 -1
- package/dist/components/ComboRow/ComboRow.cjs.map +1 -1
- package/dist/components/ComboRow/ComboRow.d.ts +1 -1
- package/dist/components/ComboRow/ComboRow.js +2 -2
- package/dist/components/ComboRow/ComboRow.js.map +1 -1
- package/dist/components/ComboRow/ComboRow.module.css.cjs +1 -1
- package/dist/components/ComboRow/ComboRow.module.css.js +24 -25
- package/dist/components/ComboRow.cjs +1 -1
- package/dist/components/ContributionGraph/ContributionGraph.cjs +1 -1
- package/dist/components/ContributionGraph/ContributionGraph.cjs.map +1 -1
- package/dist/components/ContributionGraph/ContributionGraph.d.ts +1 -1
- package/dist/components/ContributionGraph/ContributionGraph.js +2 -2
- package/dist/components/ContributionGraph/ContributionGraph.js.map +1 -1
- package/dist/components/ContributionGraph.cjs +1 -1
- package/dist/components/CountDownTimer/CountDownTimer.cjs +1 -1
- package/dist/components/CountDownTimer/CountDownTimer.cjs.map +1 -1
- package/dist/components/CountDownTimer/CountDownTimer.d.ts +1 -1
- package/dist/components/CountDownTimer/CountDownTimer.js +2 -2
- package/dist/components/CountDownTimer/CountDownTimer.js.map +1 -1
- package/dist/components/CountDownTimer.cjs +1 -1
- package/dist/components/Dialog/Dialog.cjs +1 -1
- package/dist/components/Dialog/Dialog.cjs.map +1 -1
- package/dist/components/Dialog/Dialog.d.ts +1 -1
- package/dist/components/Dialog/Dialog.js +51 -52
- package/dist/components/Dialog/Dialog.js.map +1 -1
- package/dist/components/Dialog/Dialog.module.css.cjs +1 -1
- package/dist/components/Dialog/Dialog.module.css.js +8 -9
- package/dist/components/Dialog/dialogUtils.cjs +1 -1
- package/dist/components/Dialog/dialogUtils.cjs.map +1 -1
- package/dist/components/Dialog/dialogUtils.d.ts +6 -0
- package/dist/components/Dialog/dialogUtils.js +11 -2
- package/dist/components/Dialog/dialogUtils.js.map +1 -1
- package/dist/components/Dialog.cjs +1 -1
- package/dist/components/Drawer/Drawer.cjs +1 -1
- package/dist/components/Drawer/Drawer.cjs.map +1 -1
- package/dist/components/Drawer/Drawer.d.ts +1 -1
- package/dist/components/Drawer/Drawer.js +2 -2
- package/dist/components/Drawer/Drawer.js.map +1 -1
- package/dist/components/Drawer/Drawer.module.css.cjs +1 -1
- package/dist/components/Drawer/Drawer.module.css.js +11 -12
- package/dist/components/Drawer.cjs +1 -1
- package/dist/components/Dropdown/Dropdown.cjs +1 -1
- package/dist/components/Dropdown/Dropdown.cjs.map +1 -1
- package/dist/components/Dropdown/Dropdown.d.ts +1 -1
- package/dist/components/Dropdown/Dropdown.js +89 -85
- package/dist/components/Dropdown/Dropdown.js.map +1 -1
- package/dist/components/Dropdown/Dropdown.module.css.cjs +1 -1
- package/dist/components/Dropdown/Dropdown.module.css.js +20 -21
- package/dist/components/Dropdown.cjs +1 -1
- package/dist/components/EntryRow/EntryRow.cjs +1 -1
- package/dist/components/EntryRow/EntryRow.cjs.map +1 -1
- package/dist/components/EntryRow/EntryRow.d.ts +1 -1
- package/dist/components/EntryRow/EntryRow.js +2 -2
- package/dist/components/EntryRow/EntryRow.js.map +1 -1
- package/dist/components/EntryRow.cjs +1 -1
- package/dist/components/ExpanderRow/ExpanderRow.cjs +1 -1
- package/dist/components/ExpanderRow/ExpanderRow.cjs.map +1 -1
- package/dist/components/ExpanderRow/ExpanderRow.d.ts +1 -1
- package/dist/components/ExpanderRow/ExpanderRow.js +2 -2
- package/dist/components/ExpanderRow/ExpanderRow.js.map +1 -1
- package/dist/components/ExpanderRow.cjs +1 -1
- package/dist/components/Footer/Footer.cjs +1 -1
- package/dist/components/Footer/Footer.cjs.map +1 -1
- package/dist/components/Footer/Footer.d.ts +1 -1
- package/dist/components/Footer/Footer.js +22 -24
- package/dist/components/Footer/Footer.js.map +1 -1
- package/dist/components/Footer.cjs +1 -1
- package/dist/components/Frame/Frame.cjs +1 -1
- package/dist/components/Frame/Frame.cjs.map +1 -1
- package/dist/components/Frame/Frame.d.ts +1 -1
- package/dist/components/Frame/Frame.js +5 -7
- package/dist/components/Frame/Frame.js.map +1 -1
- package/dist/components/Frame.cjs +1 -1
- package/dist/components/GnomeProvider/GnomeContext.cjs +1 -1
- package/dist/components/GnomeProvider/GnomeContext.cjs.map +1 -1
- package/dist/components/GnomeProvider/GnomeContext.js.map +1 -1
- package/dist/components/GnomeProvider/GnomeProvider.cjs +1 -1
- package/dist/components/GnomeProvider/GnomeProvider.cjs.map +1 -1
- package/dist/components/GnomeProvider/GnomeProvider.d.ts +1 -1
- package/dist/components/GnomeProvider/GnomeProvider.js +2 -2
- package/dist/components/GnomeProvider/GnomeProvider.js.map +1 -1
- package/dist/components/HeaderBar/HeaderBar.cjs +1 -1
- package/dist/components/HeaderBar/HeaderBar.cjs.map +1 -1
- package/dist/components/HeaderBar/HeaderBar.d.ts +1 -1
- package/dist/components/HeaderBar/HeaderBar.js +26 -28
- package/dist/components/HeaderBar/HeaderBar.js.map +1 -1
- package/dist/components/HeaderBar.cjs +1 -1
- package/dist/components/Icon/Icon.cjs +1 -1
- package/dist/components/Icon/Icon.cjs.map +1 -1
- package/dist/components/Icon/Icon.d.ts +1 -1
- package/dist/components/Icon/Icon.js +2 -2
- package/dist/components/Icon/Icon.js.map +1 -1
- package/dist/components/Icon.cjs +1 -1
- package/dist/components/IconButton/IconButton.cjs +1 -1
- package/dist/components/IconButton/IconButton.cjs.map +1 -1
- package/dist/components/IconButton/IconButton.js +4 -4
- package/dist/components/IconButton/IconButton.js.map +1 -1
- package/dist/components/IconButton.cjs +1 -1
- package/dist/components/InlineViewSwitcher/InlineViewSwitcher.cjs +1 -1
- package/dist/components/InlineViewSwitcher/InlineViewSwitcher.cjs.map +1 -1
- package/dist/components/InlineViewSwitcher/InlineViewSwitcher.d.ts +1 -1
- package/dist/components/InlineViewSwitcher/InlineViewSwitcher.js +2 -2
- package/dist/components/InlineViewSwitcher/InlineViewSwitcher.js.map +1 -1
- package/dist/components/InlineViewSwitcher/InlineViewSwitcherItem.cjs +1 -1
- package/dist/components/InlineViewSwitcher/InlineViewSwitcherItem.cjs.map +1 -1
- package/dist/components/InlineViewSwitcher/InlineViewSwitcherItem.d.ts +1 -1
- package/dist/components/InlineViewSwitcher/InlineViewSwitcherItem.js +2 -2
- package/dist/components/InlineViewSwitcher/InlineViewSwitcherItem.js.map +1 -1
- package/dist/components/InlineViewSwitcher.cjs +1 -1
- package/dist/components/Link/Link.cjs +1 -1
- package/dist/components/Link/Link.cjs.map +1 -1
- package/dist/components/Link/Link.d.ts +1 -1
- package/dist/components/Link/Link.js +2 -2
- package/dist/components/Link/Link.js.map +1 -1
- package/dist/components/Link.cjs +1 -1
- package/dist/components/LinkedGroup/LinkedGroup.cjs +1 -1
- package/dist/components/LinkedGroup/LinkedGroup.cjs.map +1 -1
- package/dist/components/LinkedGroup/LinkedGroup.d.ts +1 -1
- package/dist/components/LinkedGroup/LinkedGroup.js +9 -11
- package/dist/components/LinkedGroup/LinkedGroup.js.map +1 -1
- package/dist/components/LinkedGroup.cjs +1 -1
- package/dist/components/NavigationSplitView/NavigationSplitView.cjs +1 -1
- package/dist/components/NavigationSplitView/NavigationSplitView.cjs.map +1 -1
- package/dist/components/NavigationSplitView/NavigationSplitView.d.ts +1 -1
- package/dist/components/NavigationSplitView/NavigationSplitView.js +2 -2
- package/dist/components/NavigationSplitView/NavigationSplitView.js.map +1 -1
- package/dist/components/NavigationSplitView.cjs +1 -1
- package/dist/components/NavigationView/NavigationView.cjs +1 -1
- package/dist/components/NavigationView/NavigationView.cjs.map +1 -1
- package/dist/components/NavigationView/NavigationView.d.ts +2 -2
- package/dist/components/NavigationView/NavigationView.js +3 -4
- package/dist/components/NavigationView/NavigationView.js.map +1 -1
- package/dist/components/NavigationView/NavigationView.module.css.cjs +1 -1
- package/dist/components/NavigationView/NavigationView.module.css.js +9 -10
- package/dist/components/NavigationView.cjs +1 -1
- package/dist/components/OverlaySplitView/OverlaySplitView.cjs +1 -1
- package/dist/components/OverlaySplitView/OverlaySplitView.cjs.map +1 -1
- package/dist/components/OverlaySplitView/OverlaySplitView.d.ts +1 -1
- package/dist/components/OverlaySplitView/OverlaySplitView.js +2 -2
- package/dist/components/OverlaySplitView/OverlaySplitView.js.map +1 -1
- package/dist/components/OverlaySplitView.cjs +1 -1
- package/dist/components/PasswordEntryRow/PasswordEntryRow.cjs +1 -1
- package/dist/components/PasswordEntryRow/PasswordEntryRow.cjs.map +1 -1
- package/dist/components/PasswordEntryRow/PasswordEntryRow.d.ts +1 -1
- package/dist/components/PasswordEntryRow/PasswordEntryRow.js +11 -10
- package/dist/components/PasswordEntryRow/PasswordEntryRow.js.map +1 -1
- package/dist/components/PasswordEntryRow.cjs +1 -1
- package/dist/components/PathBar/PathBar.cjs +1 -1
- package/dist/components/PathBar/PathBar.cjs.map +1 -1
- package/dist/components/PathBar/PathBar.d.ts +1 -1
- package/dist/components/PathBar/PathBar.js +48 -50
- package/dist/components/PathBar/PathBar.js.map +1 -1
- package/dist/components/PathBar.cjs +1 -1
- package/dist/components/Popover/Popover.cjs +1 -1
- package/dist/components/Popover/Popover.cjs.map +1 -1
- package/dist/components/Popover/Popover.d.ts +1 -1
- package/dist/components/Popover/Popover.js +5 -5
- package/dist/components/Popover/Popover.js.map +1 -1
- package/dist/components/Popover.cjs +1 -1
- package/dist/components/PreferencesDialog/PreferencesDialog.cjs +1 -1
- package/dist/components/PreferencesDialog/PreferencesDialog.cjs.map +1 -1
- package/dist/components/PreferencesDialog/PreferencesDialog.d.ts +1 -1
- package/dist/components/PreferencesDialog/PreferencesDialog.js +2 -2
- package/dist/components/PreferencesDialog/PreferencesDialog.js.map +1 -1
- package/dist/components/PreferencesDialog/PreferencesDialog.module.css.cjs +1 -1
- package/dist/components/PreferencesDialog/PreferencesDialog.module.css.js +18 -19
- package/dist/components/PreferencesDialog.cjs +1 -1
- package/dist/components/PreferencesGroup/PreferencesGroup.cjs +1 -1
- package/dist/components/PreferencesGroup/PreferencesGroup.cjs.map +1 -1
- package/dist/components/PreferencesGroup/PreferencesGroup.d.ts +1 -1
- package/dist/components/PreferencesGroup/PreferencesGroup.js +2 -2
- package/dist/components/PreferencesGroup/PreferencesGroup.js.map +1 -1
- package/dist/components/PreferencesGroup.cjs +1 -1
- package/dist/components/PreferencesPage/PreferencesPage.cjs +1 -1
- package/dist/components/PreferencesPage/PreferencesPage.cjs.map +1 -1
- package/dist/components/PreferencesPage/PreferencesPage.d.ts +1 -1
- package/dist/components/PreferencesPage/PreferencesPage.js +9 -11
- package/dist/components/PreferencesPage/PreferencesPage.js.map +1 -1
- package/dist/components/PreferencesPage.cjs +1 -1
- package/dist/components/ProgressBar/ProgressBar.cjs +1 -1
- package/dist/components/ProgressBar/ProgressBar.cjs.map +1 -1
- package/dist/components/ProgressBar/ProgressBar.d.ts +1 -1
- package/dist/components/ProgressBar/ProgressBar.js +2 -2
- package/dist/components/ProgressBar/ProgressBar.js.map +1 -1
- package/dist/components/ProgressBar.cjs +1 -1
- package/dist/components/RadioButton/RadioButton.cjs +1 -1
- package/dist/components/RadioButton/RadioButton.cjs.map +1 -1
- package/dist/components/RadioButton/RadioButton.d.ts +1 -1
- package/dist/components/RadioButton/RadioButton.js +5 -7
- package/dist/components/RadioButton/RadioButton.js.map +1 -1
- package/dist/components/RadioButton.cjs +1 -1
- package/dist/components/SearchBar/SearchBar.cjs +1 -1
- package/dist/components/SearchBar/SearchBar.cjs.map +1 -1
- package/dist/components/SearchBar/SearchBar.d.ts +1 -1
- package/dist/components/SearchBar/SearchBar.js +2 -2
- package/dist/components/SearchBar/SearchBar.js.map +1 -1
- package/dist/components/SearchBar.cjs +1 -1
- package/dist/components/SegmentedBar/SegmentedBar.cjs +1 -1
- package/dist/components/SegmentedBar/SegmentedBar.cjs.map +1 -1
- package/dist/components/SegmentedBar/SegmentedBar.js.map +1 -1
- package/dist/components/SegmentedBar.cjs +1 -1
- package/dist/components/Separator/Separator.cjs +1 -1
- package/dist/components/Separator/Separator.cjs.map +1 -1
- package/dist/components/Separator/Separator.d.ts +1 -1
- package/dist/components/Separator/Separator.js +2 -2
- package/dist/components/Separator/Separator.js.map +1 -1
- package/dist/components/Separator.cjs +1 -1
- package/dist/components/ShortcutLabel/ShortcutLabel.cjs +1 -1
- package/dist/components/ShortcutLabel/ShortcutLabel.cjs.map +1 -1
- package/dist/components/ShortcutLabel/ShortcutLabel.d.ts +1 -1
- package/dist/components/ShortcutLabel/ShortcutLabel.js +2 -3
- package/dist/components/ShortcutLabel/ShortcutLabel.js.map +1 -1
- package/dist/components/ShortcutLabel.cjs +1 -1
- package/dist/components/ShortcutsDialog/ShortcutsDialog.cjs +1 -1
- package/dist/components/ShortcutsDialog/ShortcutsDialog.cjs.map +1 -1
- package/dist/components/ShortcutsDialog/ShortcutsDialog.d.ts +1 -1
- package/dist/components/ShortcutsDialog/ShortcutsDialog.js +75 -76
- package/dist/components/ShortcutsDialog/ShortcutsDialog.js.map +1 -1
- package/dist/components/ShortcutsDialog/ShortcutsDialog.module.css.cjs +1 -1
- package/dist/components/ShortcutsDialog/ShortcutsDialog.module.css.js +21 -22
- package/dist/components/ShortcutsDialog.cjs +1 -1
- package/dist/components/Sidebar/Sidebar.cjs +1 -1
- package/dist/components/Sidebar/Sidebar.cjs.map +1 -1
- package/dist/components/Sidebar/Sidebar.d.ts +1 -1
- package/dist/components/Sidebar/Sidebar.js +2 -3
- package/dist/components/Sidebar/Sidebar.js.map +1 -1
- package/dist/components/Sidebar/Sidebar.module.css.cjs +1 -1
- package/dist/components/Sidebar/Sidebar.module.css.js +33 -34
- package/dist/components/Sidebar/SidebarItem.cjs +1 -1
- package/dist/components/Sidebar/SidebarItem.cjs.map +1 -1
- package/dist/components/Sidebar/SidebarItem.d.ts +1 -1
- package/dist/components/Sidebar/SidebarItem.js +16 -16
- package/dist/components/Sidebar/SidebarItem.js.map +1 -1
- package/dist/components/Sidebar/SidebarSection.cjs +1 -1
- package/dist/components/Sidebar/SidebarSection.cjs.map +1 -1
- package/dist/components/Sidebar/SidebarSection.js.map +1 -1
- package/dist/components/Sidebar.cjs +1 -1
- package/dist/components/Skeleton/Skeleton.cjs +1 -1
- package/dist/components/Skeleton/Skeleton.cjs.map +1 -1
- package/dist/components/Skeleton/Skeleton.d.ts +1 -1
- package/dist/components/Skeleton/Skeleton.js +9 -10
- package/dist/components/Skeleton/Skeleton.js.map +1 -1
- package/dist/components/Skeleton.cjs +1 -1
- package/dist/components/Slider/Slider.cjs +1 -1
- package/dist/components/Slider/Slider.cjs.map +1 -1
- package/dist/components/Slider/Slider.d.ts +1 -1
- package/dist/components/Slider/Slider.js +2 -2
- package/dist/components/Slider/Slider.js.map +1 -1
- package/dist/components/Slider.cjs +1 -1
- package/dist/components/SpinButton/SpinButton.cjs +1 -1
- package/dist/components/SpinButton/SpinButton.cjs.map +1 -1
- package/dist/components/SpinButton/SpinButton.d.ts +1 -1
- package/dist/components/SpinButton/SpinButton.js +2 -2
- package/dist/components/SpinButton/SpinButton.js.map +1 -1
- package/dist/components/SpinButton.cjs +1 -1
- package/dist/components/SpinRow/SpinRow.cjs +1 -1
- package/dist/components/SpinRow/SpinRow.cjs.map +1 -1
- package/dist/components/SpinRow/SpinRow.d.ts +1 -1
- package/dist/components/SpinRow/SpinRow.js +2 -2
- package/dist/components/SpinRow/SpinRow.js.map +1 -1
- package/dist/components/SpinRow.cjs +1 -1
- package/dist/components/Spinner/Spinner.cjs +1 -1
- package/dist/components/Spinner/Spinner.cjs.map +1 -1
- package/dist/components/Spinner/Spinner.d.ts +1 -1
- package/dist/components/Spinner/Spinner.js +2 -2
- package/dist/components/Spinner/Spinner.js.map +1 -1
- package/dist/components/Spinner.cjs +1 -1
- package/dist/components/SplitButton/SplitButton.cjs +1 -1
- package/dist/components/SplitButton/SplitButton.cjs.map +1 -1
- package/dist/components/SplitButton/SplitButton.d.ts +1 -1
- package/dist/components/SplitButton/SplitButton.js +2 -2
- package/dist/components/SplitButton/SplitButton.js.map +1 -1
- package/dist/components/SplitButton.cjs +1 -1
- package/dist/components/StatusBadge/StatusBadge.cjs +1 -1
- package/dist/components/StatusBadge/StatusBadge.cjs.map +1 -1
- package/dist/components/StatusBadge/StatusBadge.d.ts +1 -1
- package/dist/components/StatusBadge/StatusBadge.js +9 -11
- package/dist/components/StatusBadge/StatusBadge.js.map +1 -1
- package/dist/components/StatusBadge.cjs +1 -1
- package/dist/components/StatusPage/StatusPage.cjs +1 -1
- package/dist/components/StatusPage/StatusPage.cjs.map +1 -1
- package/dist/components/StatusPage/StatusPage.d.ts +1 -1
- package/dist/components/StatusPage/StatusPage.js +2 -2
- package/dist/components/StatusPage/StatusPage.js.map +1 -1
- package/dist/components/StatusPage.cjs +1 -1
- package/dist/components/Switch/Switch.cjs +1 -1
- package/dist/components/Switch/Switch.cjs.map +1 -1
- package/dist/components/Switch/Switch.d.ts +1 -1
- package/dist/components/Switch/Switch.js +6 -8
- package/dist/components/Switch/Switch.js.map +1 -1
- package/dist/components/Switch.cjs +1 -1
- package/dist/components/SwitchRow/SwitchRow.cjs +1 -1
- package/dist/components/SwitchRow/SwitchRow.cjs.map +1 -1
- package/dist/components/SwitchRow/SwitchRow.d.ts +1 -1
- package/dist/components/SwitchRow/SwitchRow.js +7 -7
- package/dist/components/SwitchRow/SwitchRow.js.map +1 -1
- package/dist/components/SwitchRow.cjs +1 -1
- package/dist/components/Tabs/TabBar.cjs +1 -1
- package/dist/components/Tabs/TabBar.cjs.map +1 -1
- package/dist/components/Tabs/TabBar.d.ts +1 -1
- package/dist/components/Tabs/TabBar.js +2 -2
- package/dist/components/Tabs/TabBar.js.map +1 -1
- package/dist/components/Tabs/TabItem.cjs +1 -1
- package/dist/components/Tabs/TabItem.cjs.map +1 -1
- package/dist/components/Tabs/TabItem.js.map +1 -1
- package/dist/components/Tabs/TabPanel.cjs +1 -1
- package/dist/components/Tabs/TabPanel.cjs.map +1 -1
- package/dist/components/Tabs/TabPanel.d.ts +1 -1
- package/dist/components/Tabs/TabPanel.js +8 -10
- package/dist/components/Tabs/TabPanel.js.map +1 -1
- package/dist/components/Tabs.cjs +1 -1
- package/dist/components/TerminalView/TerminalView.cjs +1 -1
- package/dist/components/TerminalView/TerminalView.cjs.map +1 -1
- package/dist/components/TerminalView/TerminalView.d.ts +1 -1
- package/dist/components/TerminalView/TerminalView.js +2 -2
- package/dist/components/TerminalView/TerminalView.js.map +1 -1
- package/dist/components/TerminalView.cjs +1 -1
- package/dist/components/Text/Text.cjs +1 -1
- package/dist/components/Text/Text.cjs.map +1 -1
- package/dist/components/Text/Text.d.ts +1 -1
- package/dist/components/Text/Text.js +10 -13
- package/dist/components/Text/Text.js.map +1 -1
- package/dist/components/Text/Text.module.css.cjs +1 -1
- package/dist/components/Text/Text.module.css.js +9 -10
- package/dist/components/Text.cjs +1 -1
- package/dist/components/TextField/TextField.cjs +1 -1
- package/dist/components/TextField/TextField.cjs.map +1 -1
- package/dist/components/TextField/TextField.d.ts +1 -1
- package/dist/components/TextField/TextField.js +2 -2
- package/dist/components/TextField/TextField.js.map +1 -1
- package/dist/components/TextField.cjs +1 -1
- package/dist/components/Timeline/Timeline.cjs +1 -1
- package/dist/components/Timeline/Timeline.cjs.map +1 -1
- package/dist/components/Timeline/Timeline.d.ts +1 -1
- package/dist/components/Timeline/Timeline.js +2 -2
- package/dist/components/Timeline/Timeline.js.map +1 -1
- package/dist/components/Timeline.cjs +1 -1
- package/dist/components/Toast/Toast.cjs +1 -1
- package/dist/components/Toast/Toast.cjs.map +1 -1
- package/dist/components/Toast/Toast.d.ts +1 -1
- package/dist/components/Toast/Toast.js +2 -2
- package/dist/components/Toast/Toast.js.map +1 -1
- package/dist/components/Toast/Toast.module.css.cjs +1 -1
- package/dist/components/Toast/Toast.module.css.js +10 -11
- package/dist/components/Toast/Toaster.cjs +1 -1
- package/dist/components/Toast/Toaster.cjs.map +1 -1
- package/dist/components/Toast/Toaster.d.ts +1 -1
- package/dist/components/Toast/Toaster.js +2 -2
- package/dist/components/Toast/Toaster.js.map +1 -1
- package/dist/components/Toast.cjs +1 -1
- package/dist/components/ToggleGroup/ToggleGroup.cjs +1 -1
- package/dist/components/ToggleGroup/ToggleGroup.cjs.map +1 -1
- package/dist/components/ToggleGroup/ToggleGroup.d.ts +1 -1
- package/dist/components/ToggleGroup/ToggleGroup.js +2 -2
- package/dist/components/ToggleGroup/ToggleGroup.js.map +1 -1
- package/dist/components/ToggleGroup/ToggleGroupItem.cjs +1 -1
- package/dist/components/ToggleGroup/ToggleGroupItem.cjs.map +1 -1
- package/dist/components/ToggleGroup/ToggleGroupItem.d.ts +1 -1
- package/dist/components/ToggleGroup/ToggleGroupItem.js +2 -2
- package/dist/components/ToggleGroup/ToggleGroupItem.js.map +1 -1
- package/dist/components/ToggleGroup.cjs +1 -1
- package/dist/components/Toolbar/Spacer.cjs +1 -1
- package/dist/components/Toolbar/Spacer.cjs.map +1 -1
- package/dist/components/Toolbar/Spacer.d.ts +1 -1
- package/dist/components/Toolbar/Spacer.js +5 -7
- package/dist/components/Toolbar/Spacer.js.map +1 -1
- package/dist/components/Toolbar/Toolbar.cjs +1 -1
- package/dist/components/Toolbar/Toolbar.cjs.map +1 -1
- package/dist/components/Toolbar/Toolbar.d.ts +1 -1
- package/dist/components/Toolbar/Toolbar.js +5 -7
- package/dist/components/Toolbar/Toolbar.js.map +1 -1
- package/dist/components/Toolbar.cjs +1 -1
- package/dist/components/ToolbarView/ToolbarView.cjs +1 -1
- package/dist/components/ToolbarView/ToolbarView.cjs.map +1 -1
- package/dist/components/ToolbarView/ToolbarView.d.ts +1 -1
- package/dist/components/ToolbarView/ToolbarView.js +18 -20
- package/dist/components/ToolbarView/ToolbarView.js.map +1 -1
- package/dist/components/ToolbarView.cjs +1 -1
- package/dist/components/Tooltip/Tooltip.cjs +1 -1
- package/dist/components/Tooltip/Tooltip.cjs.map +1 -1
- package/dist/components/Tooltip/Tooltip.d.ts +1 -1
- package/dist/components/Tooltip/Tooltip.js +2 -2
- package/dist/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/components/Tooltip.cjs +1 -1
- package/dist/components/ViewSwitcher/ViewSwitcher.cjs +1 -1
- package/dist/components/ViewSwitcher/ViewSwitcher.cjs.map +1 -1
- package/dist/components/ViewSwitcher/ViewSwitcher.d.ts +1 -1
- package/dist/components/ViewSwitcher/ViewSwitcher.js +2 -2
- package/dist/components/ViewSwitcher/ViewSwitcher.js.map +1 -1
- package/dist/components/ViewSwitcher/ViewSwitcherItem.cjs +1 -1
- package/dist/components/ViewSwitcher/ViewSwitcherItem.cjs.map +1 -1
- package/dist/components/ViewSwitcher/ViewSwitcherItem.d.ts +1 -1
- package/dist/components/ViewSwitcher/ViewSwitcherItem.js +24 -26
- package/dist/components/ViewSwitcher/ViewSwitcherItem.js.map +1 -1
- package/dist/components/ViewSwitcher.cjs +1 -1
- package/dist/components/ViewSwitcherBar/ViewSwitcherBar.cjs +1 -1
- package/dist/components/ViewSwitcherBar/ViewSwitcherBar.cjs.map +1 -1
- package/dist/components/ViewSwitcherBar/ViewSwitcherBar.d.ts +1 -1
- package/dist/components/ViewSwitcherBar/ViewSwitcherBar.js +7 -9
- package/dist/components/ViewSwitcherBar/ViewSwitcherBar.js.map +1 -1
- package/dist/components/ViewSwitcherBar.cjs +1 -1
- package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebar.cjs +1 -1
- package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebar.cjs.map +1 -1
- package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebar.d.ts +1 -1
- package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebar.js +2 -2
- package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebar.js.map +1 -1
- package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebarItem.cjs +1 -1
- package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebarItem.cjs.map +1 -1
- package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebarItem.d.ts +1 -1
- package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebarItem.js +2 -2
- package/dist/components/ViewSwitcherSidebar/ViewSwitcherSidebarItem.js.map +1 -1
- package/dist/components/ViewSwitcherSidebar.cjs +1 -1
- package/dist/components/WindowTitle/WindowTitle.cjs +1 -1
- package/dist/components/WindowTitle/WindowTitle.cjs.map +1 -1
- package/dist/components/WindowTitle/WindowTitle.d.ts +1 -1
- package/dist/components/WindowTitle/WindowTitle.js +11 -13
- package/dist/components/WindowTitle/WindowTitle.js.map +1 -1
- package/dist/components/WindowTitle.cjs +1 -1
- package/dist/components/WrapBox/WrapBox.cjs +1 -1
- package/dist/components/WrapBox/WrapBox.cjs.map +1 -1
- package/dist/components/WrapBox/WrapBox.d.ts +1 -1
- package/dist/components/WrapBox/WrapBox.js +5 -5
- package/dist/components/WrapBox/WrapBox.js.map +1 -1
- package/dist/components/WrapBox.cjs +1 -1
- package/dist/hooks/useBreakpoint.cjs +1 -1
- package/dist/hooks/useBreakpoint.cjs.map +1 -1
- package/dist/hooks/useBreakpoint.js.map +1 -1
- package/dist/hooks.cjs +1 -1
- package/dist/index.cjs +1 -1
- package/package.json +2 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const e=require(
|
|
1
|
+
const e=require("./Toolbar.module.css.cjs");let t=require("react/jsx-runtime");var n=({className:n,...r})=>(0,t.jsx)(`div`,{"aria-hidden":`true`,className:[e.default.spacer,n].filter(Boolean).join(` `),...r});exports.Spacer=n;
|
|
2
2
|
//# sourceMappingURL=Spacer.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Spacer.cjs","names":[],"sources":["../../../src/components/Toolbar/Spacer.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\n\nimport styles from './Toolbar.module.css';\n\nexport type SpacerProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * Invisible `flex: 1` filler for `Toolbar` and `HeaderBar`.\n *\n * Place between leading and trailing groups to push trailing items to the end.\n * Mirrors `GtkSeparator` with the `.spacer` style class.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/style-classes.html#spacer\n *\n * @example\n * <Toolbar>\n * <Button variant=\"flat\">Back</Button>\n * <Spacer />\n * <Button variant=\"flat\">Done</Button>\n * </Toolbar>\n */\nexport
|
|
1
|
+
{"version":3,"file":"Spacer.cjs","names":[],"sources":["../../../src/components/Toolbar/Spacer.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\n\nimport styles from './Toolbar.module.css';\n\nexport type SpacerProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * Invisible `flex: 1` filler for `Toolbar` and `HeaderBar`.\n *\n * Place between leading and trailing groups to push trailing items to the end.\n * Mirrors `GtkSeparator` with the `.spacer` style class.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/style-classes.html#spacer\n *\n * @example\n * <Toolbar>\n * <Button variant=\"flat\">Back</Button>\n * <Spacer />\n * <Button variant=\"flat\">Done</Button>\n * </Toolbar>\n */\nexport const Spacer = ({ className, ...props }: SpacerProps) => {\n return (\n <div\n aria-hidden=\"true\"\n className={[styles.spacer, className].filter(Boolean).join(' ')}\n {...props}\n />\n );\n};\n"],"mappings":"+EAqBA,IAAa,GAAU,CAAE,YAAW,GAAG,MAEnC,EAAA,EAAA,KAAC,MAAD,CACE,cAAY,OACZ,UAAW,CAAC,EAAA,QAAO,OAAQ,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAC9D,GAAI,CACL,CAAA"}
|
|
@@ -15,4 +15,4 @@ export type SpacerProps = HTMLAttributes<HTMLDivElement>;
|
|
|
15
15
|
* <Button variant="flat">Done</Button>
|
|
16
16
|
* </Toolbar>
|
|
17
17
|
*/
|
|
18
|
-
export declare
|
|
18
|
+
export declare const Spacer: ({ className, ...props }: SpacerProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,13 +1,11 @@
|
|
|
1
1
|
import e from "./Toolbar.module.css.js";
|
|
2
2
|
import { jsx as t } from "react/jsx-runtime";
|
|
3
3
|
//#region src/components/Toolbar/Spacer.tsx
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
});
|
|
10
|
-
}
|
|
4
|
+
var n = ({ className: n, ...r }) => /* @__PURE__ */ t("div", {
|
|
5
|
+
"aria-hidden": "true",
|
|
6
|
+
className: [e.spacer, n].filter(Boolean).join(" "),
|
|
7
|
+
...r
|
|
8
|
+
});
|
|
11
9
|
//#endregion
|
|
12
10
|
export { n as Spacer };
|
|
13
11
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Spacer.js","names":[],"sources":["../../../src/components/Toolbar/Spacer.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\n\nimport styles from './Toolbar.module.css';\n\nexport type SpacerProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * Invisible `flex: 1` filler for `Toolbar` and `HeaderBar`.\n *\n * Place between leading and trailing groups to push trailing items to the end.\n * Mirrors `GtkSeparator` with the `.spacer` style class.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/style-classes.html#spacer\n *\n * @example\n * <Toolbar>\n * <Button variant=\"flat\">Back</Button>\n * <Spacer />\n * <Button variant=\"flat\">Done</Button>\n * </Toolbar>\n */\nexport
|
|
1
|
+
{"version":3,"file":"Spacer.js","names":[],"sources":["../../../src/components/Toolbar/Spacer.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\n\nimport styles from './Toolbar.module.css';\n\nexport type SpacerProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * Invisible `flex: 1` filler for `Toolbar` and `HeaderBar`.\n *\n * Place between leading and trailing groups to push trailing items to the end.\n * Mirrors `GtkSeparator` with the `.spacer` style class.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/style-classes.html#spacer\n *\n * @example\n * <Toolbar>\n * <Button variant=\"flat\">Back</Button>\n * <Spacer />\n * <Button variant=\"flat\">Done</Button>\n * </Toolbar>\n */\nexport const Spacer = ({ className, ...props }: SpacerProps) => {\n return (\n <div\n aria-hidden=\"true\"\n className={[styles.spacer, className].filter(Boolean).join(' ')}\n {...props}\n />\n );\n};\n"],"mappings":";;;AAqBA,IAAa,KAAU,EAAE,cAAW,GAAG,QAEnC,kBAAC,OAAD;CACE,eAAY;CACZ,WAAW,CAAC,EAAO,QAAQ,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;CAC9D,GAAI;AACL,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const e=require(
|
|
1
|
+
const e=require("./Toolbar.module.css.cjs");let t=require("react/jsx-runtime");var n=({children:n,className:r,...i})=>(0,t.jsx)(`div`,{className:[e.default.toolbar,r].filter(Boolean).join(` `),...i,children:n});exports.Toolbar=n;
|
|
2
2
|
//# sourceMappingURL=Toolbar.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toolbar.cjs","names":[],"sources":["../../../src/components/Toolbar/Toolbar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './Toolbar.module.css';\n\nexport interface ToolbarProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n}\n\n/**\n * Horizontal action bar following the libadwaita `.toolbar` pattern.\n *\n * Provides 6 px padding and gap — the standard spacing for rows of flat\n * buttons in header bars, action bars, and tool rows. Place `<Spacer />`\n * between leading and trailing groups to push trailing items to the end.\n *\n * Use `<Button variant=\"flat\">` or `<Button variant=\"raised\">` inside:\n * - `flat` for buttons that blend into the bar background.\n * - `raised` for buttons that need explicit elevation within a flat context.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/style-classes.html#toolbar-style-class\n */\nexport
|
|
1
|
+
{"version":3,"file":"Toolbar.cjs","names":[],"sources":["../../../src/components/Toolbar/Toolbar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './Toolbar.module.css';\n\nexport interface ToolbarProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n}\n\n/**\n * Horizontal action bar following the libadwaita `.toolbar` pattern.\n *\n * Provides 6 px padding and gap — the standard spacing for rows of flat\n * buttons in header bars, action bars, and tool rows. Place `<Spacer />`\n * between leading and trailing groups to push trailing items to the end.\n *\n * Use `<Button variant=\"flat\">` or `<Button variant=\"raised\">` inside:\n * - `flat` for buttons that blend into the bar background.\n * - `raised` for buttons that need explicit elevation within a flat context.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/style-classes.html#toolbar-style-class\n */\nexport const Toolbar = ({ children, className, ...props }: ToolbarProps) => {\n return (\n <div className={[styles.toolbar, className].filter(Boolean).join(' ')} {...props}>\n {children}\n </div>\n );\n};\n"],"mappings":"+EAqBA,IAAa,GAAW,CAAE,WAAU,YAAW,GAAG,MAE9C,EAAA,EAAA,KAAC,MAAD,CAAK,UAAW,CAAC,EAAA,QAAO,QAAS,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAAG,GAAI,EACxE,UACE,CAAA"}
|
|
@@ -15,4 +15,4 @@ export interface ToolbarProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
15
15
|
*
|
|
16
16
|
* @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/style-classes.html#toolbar-style-class
|
|
17
17
|
*/
|
|
18
|
-
export declare
|
|
18
|
+
export declare const Toolbar: ({ children, className, ...props }: ToolbarProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,13 +1,11 @@
|
|
|
1
1
|
import e from "./Toolbar.module.css.js";
|
|
2
2
|
import { jsx as t } from "react/jsx-runtime";
|
|
3
3
|
//#region src/components/Toolbar/Toolbar.tsx
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
});
|
|
10
|
-
}
|
|
4
|
+
var n = ({ children: n, className: r, ...i }) => /* @__PURE__ */ t("div", {
|
|
5
|
+
className: [e.toolbar, r].filter(Boolean).join(" "),
|
|
6
|
+
...i,
|
|
7
|
+
children: n
|
|
8
|
+
});
|
|
11
9
|
//#endregion
|
|
12
10
|
export { n as Toolbar };
|
|
13
11
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toolbar.js","names":[],"sources":["../../../src/components/Toolbar/Toolbar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './Toolbar.module.css';\n\nexport interface ToolbarProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n}\n\n/**\n * Horizontal action bar following the libadwaita `.toolbar` pattern.\n *\n * Provides 6 px padding and gap — the standard spacing for rows of flat\n * buttons in header bars, action bars, and tool rows. Place `<Spacer />`\n * between leading and trailing groups to push trailing items to the end.\n *\n * Use `<Button variant=\"flat\">` or `<Button variant=\"raised\">` inside:\n * - `flat` for buttons that blend into the bar background.\n * - `raised` for buttons that need explicit elevation within a flat context.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/style-classes.html#toolbar-style-class\n */\nexport
|
|
1
|
+
{"version":3,"file":"Toolbar.js","names":[],"sources":["../../../src/components/Toolbar/Toolbar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './Toolbar.module.css';\n\nexport interface ToolbarProps extends HTMLAttributes<HTMLDivElement> {\n children: ReactNode;\n}\n\n/**\n * Horizontal action bar following the libadwaita `.toolbar` pattern.\n *\n * Provides 6 px padding and gap — the standard spacing for rows of flat\n * buttons in header bars, action bars, and tool rows. Place `<Spacer />`\n * between leading and trailing groups to push trailing items to the end.\n *\n * Use `<Button variant=\"flat\">` or `<Button variant=\"raised\">` inside:\n * - `flat` for buttons that blend into the bar background.\n * - `raised` for buttons that need explicit elevation within a flat context.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/1-latest/style-classes.html#toolbar-style-class\n */\nexport const Toolbar = ({ children, className, ...props }: ToolbarProps) => {\n return (\n <div className={[styles.toolbar, className].filter(Boolean).join(' ')} {...props}>\n {children}\n </div>\n );\n};\n"],"mappings":";;;AAqBA,IAAa,KAAW,EAAE,aAAU,cAAW,GAAG,QAE9C,kBAAC,OAAD;CAAK,WAAW,CAAC,EAAO,SAAS,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;CAAG,GAAI;CACxE;AACE,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./Toolbar/Spacer.cjs"),t=require("./Toolbar/Toolbar.cjs");exports.Spacer=e.Spacer,exports.Toolbar=t.Toolbar;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const e=require(
|
|
1
|
+
const e=require("./ToolbarView.module.css.cjs");let t=require("react/jsx-runtime");var n=({topBar:n,bottomBar:r,children:i,className:a,...o})=>(0,t.jsxs)(`div`,{className:[e.default.toolbarView,a].filter(Boolean).join(` `),...o,children:[n&&(0,t.jsx)(`div`,{className:e.default.top,children:n}),(0,t.jsx)(`div`,{className:e.default.content,children:i}),r&&(0,t.jsx)(`div`,{className:e.default.bottom,children:r})]});exports.ToolbarView=n;
|
|
2
2
|
//# sourceMappingURL=ToolbarView.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToolbarView.cjs","names":[],"sources":["../../../src/components/ToolbarView/ToolbarView.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './ToolbarView.module.css';\n\nexport interface ToolbarViewProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Bar(s) pinned to the top — typically a `HeaderBar` or `Toolbar`.\n * Multiple bars stack vertically.\n */\n topBar?: ReactNode;\n /**\n * Bar(s) pinned to the bottom — typically a `Toolbar` or `ViewSwitcherBar`.\n * Multiple bars stack vertically.\n */\n bottomBar?: ReactNode;\n /** Scrollable content area between the bars. */\n children?: ReactNode;\n}\n\n/**\n * Layout container that attaches bars at the top and/or bottom while\n * scrolling only the middle content.\n *\n * The top/bottom bars remain fixed; the inner content area gets\n * `overflow-y: auto` so it scrolls independently.\n *\n * Mirrors `AdwToolbarView`.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ToolbarView.html\n */\nexport
|
|
1
|
+
{"version":3,"file":"ToolbarView.cjs","names":[],"sources":["../../../src/components/ToolbarView/ToolbarView.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './ToolbarView.module.css';\n\nexport interface ToolbarViewProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Bar(s) pinned to the top — typically a `HeaderBar` or `Toolbar`.\n * Multiple bars stack vertically.\n */\n topBar?: ReactNode;\n /**\n * Bar(s) pinned to the bottom — typically a `Toolbar` or `ViewSwitcherBar`.\n * Multiple bars stack vertically.\n */\n bottomBar?: ReactNode;\n /** Scrollable content area between the bars. */\n children?: ReactNode;\n}\n\n/**\n * Layout container that attaches bars at the top and/or bottom while\n * scrolling only the middle content.\n *\n * The top/bottom bars remain fixed; the inner content area gets\n * `overflow-y: auto` so it scrolls independently.\n *\n * Mirrors `AdwToolbarView`.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ToolbarView.html\n */\nexport const ToolbarView = ({\n topBar,\n bottomBar,\n children,\n className,\n ...props\n}: ToolbarViewProps) => {\n return (\n <div className={[styles.toolbarView, className].filter(Boolean).join(' ')} {...props}>\n {topBar && <div className={styles.top}>{topBar}</div>}\n <div className={styles.content}>{children}</div>\n {bottomBar && <div className={styles.bottom}>{bottomBar}</div>}\n </div>\n );\n};\n"],"mappings":"mFA8BA,IAAa,GAAe,CAC1B,SACA,YACA,WACA,YACA,GAAG,MAGD,EAAA,EAAA,MAAC,MAAD,CAAK,UAAW,CAAC,EAAA,QAAO,YAAa,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAAG,GAAI,WAA/E,CACG,IAAU,EAAA,EAAA,KAAC,MAAD,CAAK,UAAW,EAAA,QAAO,aAAM,CAAY,CAAA,GACpD,EAAA,EAAA,KAAC,MAAD,CAAK,UAAW,EAAA,QAAO,QAAU,UAAc,CAAA,EAC9C,IAAa,EAAA,EAAA,KAAC,MAAD,CAAK,UAAW,EAAA,QAAO,gBAAS,CAAe,CAAA,CAC1D"}
|
|
@@ -24,4 +24,4 @@ export interface ToolbarViewProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
24
24
|
*
|
|
25
25
|
* @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ToolbarView.html
|
|
26
26
|
*/
|
|
27
|
-
export declare
|
|
27
|
+
export declare const ToolbarView: ({ topBar, bottomBar, children, className, ...props }: ToolbarViewProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,26 +1,24 @@
|
|
|
1
1
|
import e from "./ToolbarView.module.css.js";
|
|
2
2
|
import { jsx as t, jsxs as n } from "react/jsx-runtime";
|
|
3
3
|
//#region src/components/ToolbarView/ToolbarView.tsx
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
});
|
|
23
|
-
}
|
|
4
|
+
var r = ({ topBar: r, bottomBar: i, children: a, className: o, ...s }) => /* @__PURE__ */ n("div", {
|
|
5
|
+
className: [e.toolbarView, o].filter(Boolean).join(" "),
|
|
6
|
+
...s,
|
|
7
|
+
children: [
|
|
8
|
+
r && /* @__PURE__ */ t("div", {
|
|
9
|
+
className: e.top,
|
|
10
|
+
children: r
|
|
11
|
+
}),
|
|
12
|
+
/* @__PURE__ */ t("div", {
|
|
13
|
+
className: e.content,
|
|
14
|
+
children: a
|
|
15
|
+
}),
|
|
16
|
+
i && /* @__PURE__ */ t("div", {
|
|
17
|
+
className: e.bottom,
|
|
18
|
+
children: i
|
|
19
|
+
})
|
|
20
|
+
]
|
|
21
|
+
});
|
|
24
22
|
//#endregion
|
|
25
23
|
export { r as ToolbarView };
|
|
26
24
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToolbarView.js","names":[],"sources":["../../../src/components/ToolbarView/ToolbarView.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './ToolbarView.module.css';\n\nexport interface ToolbarViewProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Bar(s) pinned to the top — typically a `HeaderBar` or `Toolbar`.\n * Multiple bars stack vertically.\n */\n topBar?: ReactNode;\n /**\n * Bar(s) pinned to the bottom — typically a `Toolbar` or `ViewSwitcherBar`.\n * Multiple bars stack vertically.\n */\n bottomBar?: ReactNode;\n /** Scrollable content area between the bars. */\n children?: ReactNode;\n}\n\n/**\n * Layout container that attaches bars at the top and/or bottom while\n * scrolling only the middle content.\n *\n * The top/bottom bars remain fixed; the inner content area gets\n * `overflow-y: auto` so it scrolls independently.\n *\n * Mirrors `AdwToolbarView`.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ToolbarView.html\n */\nexport
|
|
1
|
+
{"version":3,"file":"ToolbarView.js","names":[],"sources":["../../../src/components/ToolbarView/ToolbarView.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './ToolbarView.module.css';\n\nexport interface ToolbarViewProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * Bar(s) pinned to the top — typically a `HeaderBar` or `Toolbar`.\n * Multiple bars stack vertically.\n */\n topBar?: ReactNode;\n /**\n * Bar(s) pinned to the bottom — typically a `Toolbar` or `ViewSwitcherBar`.\n * Multiple bars stack vertically.\n */\n bottomBar?: ReactNode;\n /** Scrollable content area between the bars. */\n children?: ReactNode;\n}\n\n/**\n * Layout container that attaches bars at the top and/or bottom while\n * scrolling only the middle content.\n *\n * The top/bottom bars remain fixed; the inner content area gets\n * `overflow-y: auto` so it scrolls independently.\n *\n * Mirrors `AdwToolbarView`.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ToolbarView.html\n */\nexport const ToolbarView = ({\n topBar,\n bottomBar,\n children,\n className,\n ...props\n}: ToolbarViewProps) => {\n return (\n <div className={[styles.toolbarView, className].filter(Boolean).join(' ')} {...props}>\n {topBar && <div className={styles.top}>{topBar}</div>}\n <div className={styles.content}>{children}</div>\n {bottomBar && <div className={styles.bottom}>{bottomBar}</div>}\n </div>\n );\n};\n"],"mappings":";;;AA8BA,IAAa,KAAe,EAC1B,WACA,cACA,aACA,cACA,GAAG,QAGD,kBAAC,OAAD;CAAK,WAAW,CAAC,EAAO,aAAa,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;CAAG,GAAI;WAA/E;EACG,KAAU,kBAAC,OAAD;GAAK,WAAW,EAAO;aAAM;EAAY,CAAA;EACpD,kBAAC,OAAD;GAAK,WAAW,EAAO;GAAU;EAAc,CAAA;EAC9C,KAAa,kBAAC,OAAD;GAAK,WAAW,EAAO;aAAS;EAAe,CAAA;CAC1D"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./ToolbarView/ToolbarView.cjs");exports.ToolbarView=e.ToolbarView;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const e=require(
|
|
1
|
+
const e=require("./Tooltip.module.css.cjs");let t=require("react"),n=require("react-dom"),r=require("react/jsx-runtime");var i=6;function a(e,t){if(e){if(typeof e==`function`){e(t);return}e.current=t}}function o(e,t,n){let r=window.innerWidth,a=window.innerHeight,o=[n,n===`top`||n===`bottom`?n===`top`?`bottom`:`top`:n===`left`?`right`:`left`,`top`,`bottom`,`left`,`right`];for(let n of o){let o=0,s=0;n===`top`?(o=e.top-t.height-i,s=e.left+e.width/2-t.width/2):n===`bottom`?(o=e.bottom+i,s=e.left+e.width/2-t.width/2):n===`left`?(o=e.top+e.height/2-t.height/2,s=e.left-t.width-i):(o=e.top+e.height/2-t.height/2,s=e.right+i);let c=s>=8&&s+t.width<=r-8,l=o>=8&&o+t.height<=a-8;if(c&&l)return{top:Math.max(8,Math.min(o,a-t.height-8)),left:Math.max(8,Math.min(s,r-t.width-8)),placement:n}}let s=0,c=0;return n===`top`&&(s=e.top-t.height-i,c=e.left+e.width/2-t.width/2),n===`bottom`&&(s=e.bottom+i,c=e.left+e.width/2-t.width/2),n===`left`&&(s=e.top+e.height/2-t.height/2,c=e.left-t.width-i),n===`right`&&(s=e.top+e.height/2-t.height/2,c=e.right+i),{top:Math.max(8,Math.min(s,a-t.height-8)),left:Math.max(8,Math.min(c,window.innerWidth-t.width-8)),placement:n}}var s=({label:i,placement:s=`top`,delay:c=500,children:l})=>{let u=(0,t.useId)(),[d,f]=(0,t.useState)(!1),[p,m]=(0,t.useState)(null),h=(0,t.useRef)(null),g=(0,t.useRef)(null),_=(0,t.useRef)(null),v=(0,t.useCallback)(()=>{_.current&&=(clearTimeout(_.current),null)},[]),y=(0,t.useCallback)(()=>{!h.current||!g.current||m(o(h.current.getBoundingClientRect(),g.current.getBoundingClientRect(),s))},[s]);(0,t.useEffect)(()=>{if(d)return y(),window.addEventListener(`scroll`,y,{passive:!0,capture:!0}),window.addEventListener(`resize`,y,{passive:!0}),()=>{window.removeEventListener(`scroll`,y,{capture:!0}),window.removeEventListener(`resize`,y)}},[d,y]);let b=(0,t.useCallback)(()=>{v(),_.current=setTimeout(()=>f(!0),c)},[c,v]),x=(0,t.useCallback)(()=>{v(),f(!1),m(null)},[v]);(0,t.useEffect)(()=>{d&&y()},[d,y]),(0,t.useEffect)(()=>{if(!d)return;let e=e=>{e.key===`Escape`&&x()};return document.addEventListener(`keydown`,e),()=>document.removeEventListener(`keydown`,e)},[d,x]);let S=l.props.ref,C=(0,t.cloneElement)(l,{ref:e=>{h.current=e,a(S,e)},"aria-describedby":u,onMouseEnter:e=>{b(),l.props.onMouseEnter?.(e)},onMouseLeave:e=>{x(),l.props.onMouseLeave?.(e)},onFocus:e=>{b(),l.props.onFocus?.(e)},onBlur:e=>{x(),l.props.onBlur?.(e)}}),w=(0,r.jsx)(`div`,{ref:g,id:u,role:`tooltip`,className:[e.default.tooltip,p?e.default[p.placement]:null,d&&p?e.default.visible:null].filter(Boolean).join(` `),style:p?{top:p.top,left:p.left}:{visibility:`hidden`,top:-9999,left:-9999},children:i});return(0,r.jsxs)(r.Fragment,{children:[C,typeof document<`u`?(0,n.createPortal)(w,document.body):w]})};exports.Tooltip=s;
|
|
2
2
|
//# sourceMappingURL=Tooltip.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.cjs","names":[],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import {\n cloneElement,\n type FocusEvent,\n type HTMLAttributes,\n type MouseEvent,\n type ReactElement,\n type Ref,\n useCallback,\n useEffect,\n useId,\n useRef,\n useState,\n} from 'react';\n\nimport { createPortal } from 'react-dom';\n\nimport styles from './Tooltip.module.css';\n\nexport type TooltipPlacement = 'top' | 'bottom' | 'left' | 'right';\n\nexport interface TooltipProps {\n /**\n * The tooltip label. Keep it short — a noun phrase or brief description.\n * Do not duplicate information already visible on screen.\n */\n label: string;\n /**\n * Preferred placement relative to the trigger.\n * The tooltip flips automatically if there is not enough space.\n * Defaults to `\"top\"`.\n */\n placement?: TooltipPlacement;\n /**\n * Delay in milliseconds before the tooltip appears on hover.\n * Defaults to `500`. Set to `0` for instant.\n */\n delay?: number;\n /**\n * The element that triggers the tooltip.\n * Must be a single React element that can receive `ref` and event props.\n */\n children: ReactElement<HTMLAttributes<HTMLElement>>;\n}\n\ninterface Position {\n top: number;\n left: number;\n placement: TooltipPlacement;\n}\n\nconst GAP = 6; // px between trigger and tooltip\n\nfunction assignRef<T>(ref: Ref<T> | undefined, value: T | null) {\n if (!ref) {\n return;\n }\n\n if (typeof ref === 'function') {\n ref(value);\n\n return;\n }\n\n ref.current = value;\n}\n\nfunction computePosition(\n trigger: DOMRect,\n tooltip: DOMRect,\n preferred: TooltipPlacement,\n): Position {\n const vw = window.innerWidth;\n const vh = window.innerHeight;\n\n const placements: TooltipPlacement[] = [\n preferred,\n preferred === 'top' || preferred === 'bottom'\n ? preferred === 'top'\n ? 'bottom'\n : 'top'\n : preferred === 'left'\n ? 'right'\n : 'left',\n 'top',\n 'bottom',\n 'left',\n 'right',\n ];\n\n for (const p of placements) {\n let top = 0;\n let left = 0;\n\n if (p === 'top') {\n top = trigger.top - tooltip.height - GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n } else if (p === 'bottom') {\n top = trigger.bottom + GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n } else if (p === 'left') {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.left - tooltip.width - GAP;\n } else {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.right + GAP;\n }\n\n // Clamp to viewport with 8 px margin\n const margin = 8;\n const fitsH = left >= margin && left + tooltip.width <= vw - margin;\n const fitsV = top >= margin && top + tooltip.height <= vh - margin;\n\n if (fitsH && fitsV) {\n return {\n top: Math.max(margin, Math.min(top, vh - tooltip.height - margin)),\n left: Math.max(margin, Math.min(left, vw - tooltip.width - margin)),\n placement: p,\n };\n }\n }\n\n // Fallback: clamp preferred\n let top = 0,\n left = 0;\n if (preferred === 'top') {\n top = trigger.top - tooltip.height - GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n }\n\n if (preferred === 'bottom') {\n top = trigger.bottom + GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n }\n\n if (preferred === 'left') {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.left - tooltip.width - GAP;\n }\n\n if (preferred === 'right') {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.right + GAP;\n }\n\n const margin = 8;\n\n return {\n top: Math.max(margin, Math.min(top, vh - tooltip.height - margin)),\n left: Math.max(margin, Math.min(left, window.innerWidth - tooltip.width - margin)),\n placement: preferred,\n };\n}\n\n/**\n * Informational tooltip following the Adwaita / GNOME HIG pattern.\n *\n * Wraps a single trigger element and shows a floating label on hover or\n * keyboard focus. The tooltip is positioned automatically and flips if\n * there is not enough space.\n *\n * - `aria-describedby` is wired to the trigger automatically.\n * - The tooltip itself is `role=\"tooltip\"` and rendered in a portal.\n * - Does not show on touch — touch devices have no hover state.\n *\n * @example\n * <Tooltip label=\"Save file (Ctrl+S)\">\n * <Button aria-label=\"Save\"><Icon icon={Save} /></Button>\n * </Tooltip>\n *\n * @see https://developer.gnome.org/hig/patterns/feedback/tooltips.html\n */\nexport function Tooltip({\n label,\n placement: preferredPlacement = 'top',\n delay = 500,\n children,\n}: TooltipProps) {\n const id = useId();\n const [visible, setVisible] = useState(false);\n const [pos, setPos] = useState<Position | null>(null);\n\n const triggerRef = useRef<HTMLElement>(null);\n const tooltipRef = useRef<HTMLDivElement>(null);\n const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const clearTimer = useCallback(() => {\n if (timerRef.current) {\n clearTimeout(timerRef.current);\n timerRef.current = null;\n }\n }, []);\n\n const place = useCallback(() => {\n if (!triggerRef.current || !tooltipRef.current) {\n return;\n }\n\n const triggerRect = triggerRef.current.getBoundingClientRect();\n const tooltipRect = tooltipRef.current.getBoundingClientRect();\n\n setPos(computePosition(triggerRect, tooltipRect, preferredPlacement));\n }, [preferredPlacement]);\n\n // Reposition on scroll/resize while visible\n useEffect(() => {\n if (!visible) {\n return;\n }\n\n place();\n window.addEventListener('scroll', place, { passive: true, capture: true });\n window.addEventListener('resize', place, { passive: true });\n\n return () => {\n window.removeEventListener('scroll', place, { capture: true });\n window.removeEventListener('resize', place);\n };\n }, [visible, place]);\n\n const show = useCallback(() => {\n clearTimer();\n timerRef.current = setTimeout(() => setVisible(true), delay);\n }, [delay, clearTimer]);\n\n const hide = useCallback(() => {\n clearTimer();\n setVisible(false);\n setPos(null);\n }, [clearTimer]);\n\n // Position as soon as the tooltip mounts\n useEffect(() => {\n if (visible) {\n place();\n }\n }, [visible, place]);\n\n // Dismiss on Escape\n useEffect(() => {\n if (!visible) {\n return;\n }\n\n const handler = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n hide();\n }\n };\n\n document.addEventListener('keydown', handler);\n\n return () => document.removeEventListener('keydown', handler);\n }, [visible, hide]);\n\n const childRef = (\n children.props as HTMLAttributes<HTMLElement> & {\n ref?: Ref<HTMLElement>;\n }\n ).ref;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const child = cloneElement(children as any, {\n ref: (node: HTMLElement | null) => {\n triggerRef.current = node;\n assignRef(childRef, node);\n },\n 'aria-describedby': id,\n onMouseEnter: (e: MouseEvent<HTMLElement>) => {\n show();\n children.props.onMouseEnter?.(e);\n },\n onMouseLeave: (e: MouseEvent<HTMLElement>) => {\n hide();\n children.props.onMouseLeave?.(e);\n },\n onFocus: (e: FocusEvent<HTMLElement>) => {\n show();\n children.props.onFocus?.(e);\n },\n onBlur: (e: FocusEvent<HTMLElement>) => {\n hide();\n children.props.onBlur?.(e);\n },\n });\n\n const tooltip = (\n <div\n ref={tooltipRef}\n id={id}\n role=\"tooltip\"\n className={[\n styles.tooltip,\n pos ? styles[pos.placement] : null,\n visible && pos ? styles.visible : null,\n ]\n .filter(Boolean)\n .join(' ')}\n style={\n pos ? { top: pos.top, left: pos.left } : { visibility: 'hidden', top: -9999, left: -9999 }\n }\n >\n {label}\n </div>\n );\n\n return (\n <>\n {child}\n {typeof document !== 'undefined' ? createPortal(tooltip, document.body) : tooltip}\n </>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tooltip.cjs","names":[],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import {\n cloneElement,\n type FocusEvent,\n type HTMLAttributes,\n type MouseEvent,\n type ReactElement,\n type Ref,\n useCallback,\n useEffect,\n useId,\n useRef,\n useState,\n} from 'react';\n\nimport { createPortal } from 'react-dom';\n\nimport styles from './Tooltip.module.css';\n\nexport type TooltipPlacement = 'top' | 'bottom' | 'left' | 'right';\n\nexport interface TooltipProps {\n /**\n * The tooltip label. Keep it short — a noun phrase or brief description.\n * Do not duplicate information already visible on screen.\n */\n label: string;\n /**\n * Preferred placement relative to the trigger.\n * The tooltip flips automatically if there is not enough space.\n * Defaults to `\"top\"`.\n */\n placement?: TooltipPlacement;\n /**\n * Delay in milliseconds before the tooltip appears on hover.\n * Defaults to `500`. Set to `0` for instant.\n */\n delay?: number;\n /**\n * The element that triggers the tooltip.\n * Must be a single React element that can receive `ref` and event props.\n */\n children: ReactElement<HTMLAttributes<HTMLElement>>;\n}\n\ninterface Position {\n top: number;\n left: number;\n placement: TooltipPlacement;\n}\n\nconst GAP = 6; // px between trigger and tooltip\n\nfunction assignRef<T>(ref: Ref<T> | undefined, value: T | null) {\n if (!ref) {\n return;\n }\n\n if (typeof ref === 'function') {\n ref(value);\n\n return;\n }\n\n ref.current = value;\n}\n\nfunction computePosition(\n trigger: DOMRect,\n tooltip: DOMRect,\n preferred: TooltipPlacement,\n): Position {\n const vw = window.innerWidth;\n const vh = window.innerHeight;\n\n const placements: TooltipPlacement[] = [\n preferred,\n preferred === 'top' || preferred === 'bottom'\n ? preferred === 'top'\n ? 'bottom'\n : 'top'\n : preferred === 'left'\n ? 'right'\n : 'left',\n 'top',\n 'bottom',\n 'left',\n 'right',\n ];\n\n for (const p of placements) {\n let top = 0;\n let left = 0;\n\n if (p === 'top') {\n top = trigger.top - tooltip.height - GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n } else if (p === 'bottom') {\n top = trigger.bottom + GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n } else if (p === 'left') {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.left - tooltip.width - GAP;\n } else {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.right + GAP;\n }\n\n // Clamp to viewport with 8 px margin\n const margin = 8;\n const fitsH = left >= margin && left + tooltip.width <= vw - margin;\n const fitsV = top >= margin && top + tooltip.height <= vh - margin;\n\n if (fitsH && fitsV) {\n return {\n top: Math.max(margin, Math.min(top, vh - tooltip.height - margin)),\n left: Math.max(margin, Math.min(left, vw - tooltip.width - margin)),\n placement: p,\n };\n }\n }\n\n // Fallback: clamp preferred\n let top = 0,\n left = 0;\n if (preferred === 'top') {\n top = trigger.top - tooltip.height - GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n }\n\n if (preferred === 'bottom') {\n top = trigger.bottom + GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n }\n\n if (preferred === 'left') {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.left - tooltip.width - GAP;\n }\n\n if (preferred === 'right') {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.right + GAP;\n }\n\n const margin = 8;\n\n return {\n top: Math.max(margin, Math.min(top, vh - tooltip.height - margin)),\n left: Math.max(margin, Math.min(left, window.innerWidth - tooltip.width - margin)),\n placement: preferred,\n };\n}\n\n/**\n * Informational tooltip following the Adwaita / GNOME HIG pattern.\n *\n * Wraps a single trigger element and shows a floating label on hover or\n * keyboard focus. The tooltip is positioned automatically and flips if\n * there is not enough space.\n *\n * - `aria-describedby` is wired to the trigger automatically.\n * - The tooltip itself is `role=\"tooltip\"` and rendered in a portal.\n * - Does not show on touch — touch devices have no hover state.\n *\n * @example\n * <Tooltip label=\"Save file (Ctrl+S)\">\n * <Button aria-label=\"Save\"><Icon icon={Save} /></Button>\n * </Tooltip>\n *\n * @see https://developer.gnome.org/hig/patterns/feedback/tooltips.html\n */\nexport const Tooltip = ({\n label,\n placement: preferredPlacement = 'top',\n delay = 500,\n children,\n}: TooltipProps) => {\n const id = useId();\n const [visible, setVisible] = useState(false);\n const [pos, setPos] = useState<Position | null>(null);\n\n const triggerRef = useRef<HTMLElement>(null);\n const tooltipRef = useRef<HTMLDivElement>(null);\n const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const clearTimer = useCallback(() => {\n if (timerRef.current) {\n clearTimeout(timerRef.current);\n timerRef.current = null;\n }\n }, []);\n\n const place = useCallback(() => {\n if (!triggerRef.current || !tooltipRef.current) {\n return;\n }\n\n const triggerRect = triggerRef.current.getBoundingClientRect();\n const tooltipRect = tooltipRef.current.getBoundingClientRect();\n\n setPos(computePosition(triggerRect, tooltipRect, preferredPlacement));\n }, [preferredPlacement]);\n\n // Reposition on scroll/resize while visible\n useEffect(() => {\n if (!visible) {\n return;\n }\n\n place();\n window.addEventListener('scroll', place, { passive: true, capture: true });\n window.addEventListener('resize', place, { passive: true });\n\n return () => {\n window.removeEventListener('scroll', place, { capture: true });\n window.removeEventListener('resize', place);\n };\n }, [visible, place]);\n\n const show = useCallback(() => {\n clearTimer();\n timerRef.current = setTimeout(() => setVisible(true), delay);\n }, [delay, clearTimer]);\n\n const hide = useCallback(() => {\n clearTimer();\n setVisible(false);\n setPos(null);\n }, [clearTimer]);\n\n // Position as soon as the tooltip mounts\n useEffect(() => {\n if (visible) {\n place();\n }\n }, [visible, place]);\n\n // Dismiss on Escape\n useEffect(() => {\n if (!visible) {\n return;\n }\n\n const handler = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n hide();\n }\n };\n\n document.addEventListener('keydown', handler);\n\n return () => document.removeEventListener('keydown', handler);\n }, [visible, hide]);\n\n const childRef = (\n children.props as HTMLAttributes<HTMLElement> & {\n ref?: Ref<HTMLElement>;\n }\n ).ref;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const child = cloneElement(children as any, {\n ref: (node: HTMLElement | null) => {\n triggerRef.current = node;\n assignRef(childRef, node);\n },\n 'aria-describedby': id,\n onMouseEnter: (e: MouseEvent<HTMLElement>) => {\n show();\n children.props.onMouseEnter?.(e);\n },\n onMouseLeave: (e: MouseEvent<HTMLElement>) => {\n hide();\n children.props.onMouseLeave?.(e);\n },\n onFocus: (e: FocusEvent<HTMLElement>) => {\n show();\n children.props.onFocus?.(e);\n },\n onBlur: (e: FocusEvent<HTMLElement>) => {\n hide();\n children.props.onBlur?.(e);\n },\n });\n\n const tooltip = (\n <div\n ref={tooltipRef}\n id={id}\n role=\"tooltip\"\n className={[\n styles.tooltip,\n pos ? styles[pos.placement] : null,\n visible && pos ? styles.visible : null,\n ]\n .filter(Boolean)\n .join(' ')}\n style={\n pos ? { top: pos.top, left: pos.left } : { visibility: 'hidden', top: -9999, left: -9999 }\n }\n >\n {label}\n </div>\n );\n\n return (\n <>\n {child}\n {typeof document !== 'undefined' ? createPortal(tooltip, document.body) : tooltip}\n </>\n );\n};\n"],"mappings":"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"}
|
|
@@ -41,4 +41,4 @@ export interface TooltipProps {
|
|
|
41
41
|
*
|
|
42
42
|
* @see https://developer.gnome.org/hig/patterns/feedback/tooltips.html
|
|
43
43
|
*/
|
|
44
|
-
export declare
|
|
44
|
+
export declare const Tooltip: ({ label, placement: preferredPlacement, delay, children, }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -39,7 +39,7 @@ function p(e, t, n) {
|
|
|
39
39
|
placement: n
|
|
40
40
|
};
|
|
41
41
|
}
|
|
42
|
-
|
|
42
|
+
var m = ({ label: d, placement: m = "top", delay: h = 500, children: g }) => {
|
|
43
43
|
let _ = i(), [v, y] = o(!1), [b, x] = o(null), S = a(null), C = a(null), w = a(null), T = n(() => {
|
|
44
44
|
w.current &&= (clearTimeout(w.current), null);
|
|
45
45
|
}, []), E = n(() => {
|
|
@@ -104,7 +104,7 @@ function m({ label: d, placement: m = "top", delay: h = 500, children: g }) {
|
|
|
104
104
|
children: d
|
|
105
105
|
});
|
|
106
106
|
return /* @__PURE__ */ u(c, { children: [A, typeof document < "u" ? s(j, document.body) : j] });
|
|
107
|
-
}
|
|
107
|
+
};
|
|
108
108
|
//#endregion
|
|
109
109
|
export { m as Tooltip };
|
|
110
110
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.js","names":[],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import {\n cloneElement,\n type FocusEvent,\n type HTMLAttributes,\n type MouseEvent,\n type ReactElement,\n type Ref,\n useCallback,\n useEffect,\n useId,\n useRef,\n useState,\n} from 'react';\n\nimport { createPortal } from 'react-dom';\n\nimport styles from './Tooltip.module.css';\n\nexport type TooltipPlacement = 'top' | 'bottom' | 'left' | 'right';\n\nexport interface TooltipProps {\n /**\n * The tooltip label. Keep it short — a noun phrase or brief description.\n * Do not duplicate information already visible on screen.\n */\n label: string;\n /**\n * Preferred placement relative to the trigger.\n * The tooltip flips automatically if there is not enough space.\n * Defaults to `\"top\"`.\n */\n placement?: TooltipPlacement;\n /**\n * Delay in milliseconds before the tooltip appears on hover.\n * Defaults to `500`. Set to `0` for instant.\n */\n delay?: number;\n /**\n * The element that triggers the tooltip.\n * Must be a single React element that can receive `ref` and event props.\n */\n children: ReactElement<HTMLAttributes<HTMLElement>>;\n}\n\ninterface Position {\n top: number;\n left: number;\n placement: TooltipPlacement;\n}\n\nconst GAP = 6; // px between trigger and tooltip\n\nfunction assignRef<T>(ref: Ref<T> | undefined, value: T | null) {\n if (!ref) {\n return;\n }\n\n if (typeof ref === 'function') {\n ref(value);\n\n return;\n }\n\n ref.current = value;\n}\n\nfunction computePosition(\n trigger: DOMRect,\n tooltip: DOMRect,\n preferred: TooltipPlacement,\n): Position {\n const vw = window.innerWidth;\n const vh = window.innerHeight;\n\n const placements: TooltipPlacement[] = [\n preferred,\n preferred === 'top' || preferred === 'bottom'\n ? preferred === 'top'\n ? 'bottom'\n : 'top'\n : preferred === 'left'\n ? 'right'\n : 'left',\n 'top',\n 'bottom',\n 'left',\n 'right',\n ];\n\n for (const p of placements) {\n let top = 0;\n let left = 0;\n\n if (p === 'top') {\n top = trigger.top - tooltip.height - GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n } else if (p === 'bottom') {\n top = trigger.bottom + GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n } else if (p === 'left') {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.left - tooltip.width - GAP;\n } else {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.right + GAP;\n }\n\n // Clamp to viewport with 8 px margin\n const margin = 8;\n const fitsH = left >= margin && left + tooltip.width <= vw - margin;\n const fitsV = top >= margin && top + tooltip.height <= vh - margin;\n\n if (fitsH && fitsV) {\n return {\n top: Math.max(margin, Math.min(top, vh - tooltip.height - margin)),\n left: Math.max(margin, Math.min(left, vw - tooltip.width - margin)),\n placement: p,\n };\n }\n }\n\n // Fallback: clamp preferred\n let top = 0,\n left = 0;\n if (preferred === 'top') {\n top = trigger.top - tooltip.height - GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n }\n\n if (preferred === 'bottom') {\n top = trigger.bottom + GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n }\n\n if (preferred === 'left') {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.left - tooltip.width - GAP;\n }\n\n if (preferred === 'right') {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.right + GAP;\n }\n\n const margin = 8;\n\n return {\n top: Math.max(margin, Math.min(top, vh - tooltip.height - margin)),\n left: Math.max(margin, Math.min(left, window.innerWidth - tooltip.width - margin)),\n placement: preferred,\n };\n}\n\n/**\n * Informational tooltip following the Adwaita / GNOME HIG pattern.\n *\n * Wraps a single trigger element and shows a floating label on hover or\n * keyboard focus. The tooltip is positioned automatically and flips if\n * there is not enough space.\n *\n * - `aria-describedby` is wired to the trigger automatically.\n * - The tooltip itself is `role=\"tooltip\"` and rendered in a portal.\n * - Does not show on touch — touch devices have no hover state.\n *\n * @example\n * <Tooltip label=\"Save file (Ctrl+S)\">\n * <Button aria-label=\"Save\"><Icon icon={Save} /></Button>\n * </Tooltip>\n *\n * @see https://developer.gnome.org/hig/patterns/feedback/tooltips.html\n */\nexport function Tooltip({\n label,\n placement: preferredPlacement = 'top',\n delay = 500,\n children,\n}: TooltipProps) {\n const id = useId();\n const [visible, setVisible] = useState(false);\n const [pos, setPos] = useState<Position | null>(null);\n\n const triggerRef = useRef<HTMLElement>(null);\n const tooltipRef = useRef<HTMLDivElement>(null);\n const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const clearTimer = useCallback(() => {\n if (timerRef.current) {\n clearTimeout(timerRef.current);\n timerRef.current = null;\n }\n }, []);\n\n const place = useCallback(() => {\n if (!triggerRef.current || !tooltipRef.current) {\n return;\n }\n\n const triggerRect = triggerRef.current.getBoundingClientRect();\n const tooltipRect = tooltipRef.current.getBoundingClientRect();\n\n setPos(computePosition(triggerRect, tooltipRect, preferredPlacement));\n }, [preferredPlacement]);\n\n // Reposition on scroll/resize while visible\n useEffect(() => {\n if (!visible) {\n return;\n }\n\n place();\n window.addEventListener('scroll', place, { passive: true, capture: true });\n window.addEventListener('resize', place, { passive: true });\n\n return () => {\n window.removeEventListener('scroll', place, { capture: true });\n window.removeEventListener('resize', place);\n };\n }, [visible, place]);\n\n const show = useCallback(() => {\n clearTimer();\n timerRef.current = setTimeout(() => setVisible(true), delay);\n }, [delay, clearTimer]);\n\n const hide = useCallback(() => {\n clearTimer();\n setVisible(false);\n setPos(null);\n }, [clearTimer]);\n\n // Position as soon as the tooltip mounts\n useEffect(() => {\n if (visible) {\n place();\n }\n }, [visible, place]);\n\n // Dismiss on Escape\n useEffect(() => {\n if (!visible) {\n return;\n }\n\n const handler = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n hide();\n }\n };\n\n document.addEventListener('keydown', handler);\n\n return () => document.removeEventListener('keydown', handler);\n }, [visible, hide]);\n\n const childRef = (\n children.props as HTMLAttributes<HTMLElement> & {\n ref?: Ref<HTMLElement>;\n }\n ).ref;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const child = cloneElement(children as any, {\n ref: (node: HTMLElement | null) => {\n triggerRef.current = node;\n assignRef(childRef, node);\n },\n 'aria-describedby': id,\n onMouseEnter: (e: MouseEvent<HTMLElement>) => {\n show();\n children.props.onMouseEnter?.(e);\n },\n onMouseLeave: (e: MouseEvent<HTMLElement>) => {\n hide();\n children.props.onMouseLeave?.(e);\n },\n onFocus: (e: FocusEvent<HTMLElement>) => {\n show();\n children.props.onFocus?.(e);\n },\n onBlur: (e: FocusEvent<HTMLElement>) => {\n hide();\n children.props.onBlur?.(e);\n },\n });\n\n const tooltip = (\n <div\n ref={tooltipRef}\n id={id}\n role=\"tooltip\"\n className={[\n styles.tooltip,\n pos ? styles[pos.placement] : null,\n visible && pos ? styles.visible : null,\n ]\n .filter(Boolean)\n .join(' ')}\n style={\n pos ? { top: pos.top, left: pos.left } : { visibility: 'hidden', top: -9999, left: -9999 }\n }\n >\n {label}\n </div>\n );\n\n return (\n <>\n {child}\n {typeof document !== 'undefined' ? createPortal(tooltip, document.body) : tooltip}\n </>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tooltip.js","names":[],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import {\n cloneElement,\n type FocusEvent,\n type HTMLAttributes,\n type MouseEvent,\n type ReactElement,\n type Ref,\n useCallback,\n useEffect,\n useId,\n useRef,\n useState,\n} from 'react';\n\nimport { createPortal } from 'react-dom';\n\nimport styles from './Tooltip.module.css';\n\nexport type TooltipPlacement = 'top' | 'bottom' | 'left' | 'right';\n\nexport interface TooltipProps {\n /**\n * The tooltip label. Keep it short — a noun phrase or brief description.\n * Do not duplicate information already visible on screen.\n */\n label: string;\n /**\n * Preferred placement relative to the trigger.\n * The tooltip flips automatically if there is not enough space.\n * Defaults to `\"top\"`.\n */\n placement?: TooltipPlacement;\n /**\n * Delay in milliseconds before the tooltip appears on hover.\n * Defaults to `500`. Set to `0` for instant.\n */\n delay?: number;\n /**\n * The element that triggers the tooltip.\n * Must be a single React element that can receive `ref` and event props.\n */\n children: ReactElement<HTMLAttributes<HTMLElement>>;\n}\n\ninterface Position {\n top: number;\n left: number;\n placement: TooltipPlacement;\n}\n\nconst GAP = 6; // px between trigger and tooltip\n\nfunction assignRef<T>(ref: Ref<T> | undefined, value: T | null) {\n if (!ref) {\n return;\n }\n\n if (typeof ref === 'function') {\n ref(value);\n\n return;\n }\n\n ref.current = value;\n}\n\nfunction computePosition(\n trigger: DOMRect,\n tooltip: DOMRect,\n preferred: TooltipPlacement,\n): Position {\n const vw = window.innerWidth;\n const vh = window.innerHeight;\n\n const placements: TooltipPlacement[] = [\n preferred,\n preferred === 'top' || preferred === 'bottom'\n ? preferred === 'top'\n ? 'bottom'\n : 'top'\n : preferred === 'left'\n ? 'right'\n : 'left',\n 'top',\n 'bottom',\n 'left',\n 'right',\n ];\n\n for (const p of placements) {\n let top = 0;\n let left = 0;\n\n if (p === 'top') {\n top = trigger.top - tooltip.height - GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n } else if (p === 'bottom') {\n top = trigger.bottom + GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n } else if (p === 'left') {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.left - tooltip.width - GAP;\n } else {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.right + GAP;\n }\n\n // Clamp to viewport with 8 px margin\n const margin = 8;\n const fitsH = left >= margin && left + tooltip.width <= vw - margin;\n const fitsV = top >= margin && top + tooltip.height <= vh - margin;\n\n if (fitsH && fitsV) {\n return {\n top: Math.max(margin, Math.min(top, vh - tooltip.height - margin)),\n left: Math.max(margin, Math.min(left, vw - tooltip.width - margin)),\n placement: p,\n };\n }\n }\n\n // Fallback: clamp preferred\n let top = 0,\n left = 0;\n if (preferred === 'top') {\n top = trigger.top - tooltip.height - GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n }\n\n if (preferred === 'bottom') {\n top = trigger.bottom + GAP;\n left = trigger.left + trigger.width / 2 - tooltip.width / 2;\n }\n\n if (preferred === 'left') {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.left - tooltip.width - GAP;\n }\n\n if (preferred === 'right') {\n top = trigger.top + trigger.height / 2 - tooltip.height / 2;\n left = trigger.right + GAP;\n }\n\n const margin = 8;\n\n return {\n top: Math.max(margin, Math.min(top, vh - tooltip.height - margin)),\n left: Math.max(margin, Math.min(left, window.innerWidth - tooltip.width - margin)),\n placement: preferred,\n };\n}\n\n/**\n * Informational tooltip following the Adwaita / GNOME HIG pattern.\n *\n * Wraps a single trigger element and shows a floating label on hover or\n * keyboard focus. The tooltip is positioned automatically and flips if\n * there is not enough space.\n *\n * - `aria-describedby` is wired to the trigger automatically.\n * - The tooltip itself is `role=\"tooltip\"` and rendered in a portal.\n * - Does not show on touch — touch devices have no hover state.\n *\n * @example\n * <Tooltip label=\"Save file (Ctrl+S)\">\n * <Button aria-label=\"Save\"><Icon icon={Save} /></Button>\n * </Tooltip>\n *\n * @see https://developer.gnome.org/hig/patterns/feedback/tooltips.html\n */\nexport const Tooltip = ({\n label,\n placement: preferredPlacement = 'top',\n delay = 500,\n children,\n}: TooltipProps) => {\n const id = useId();\n const [visible, setVisible] = useState(false);\n const [pos, setPos] = useState<Position | null>(null);\n\n const triggerRef = useRef<HTMLElement>(null);\n const tooltipRef = useRef<HTMLDivElement>(null);\n const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const clearTimer = useCallback(() => {\n if (timerRef.current) {\n clearTimeout(timerRef.current);\n timerRef.current = null;\n }\n }, []);\n\n const place = useCallback(() => {\n if (!triggerRef.current || !tooltipRef.current) {\n return;\n }\n\n const triggerRect = triggerRef.current.getBoundingClientRect();\n const tooltipRect = tooltipRef.current.getBoundingClientRect();\n\n setPos(computePosition(triggerRect, tooltipRect, preferredPlacement));\n }, [preferredPlacement]);\n\n // Reposition on scroll/resize while visible\n useEffect(() => {\n if (!visible) {\n return;\n }\n\n place();\n window.addEventListener('scroll', place, { passive: true, capture: true });\n window.addEventListener('resize', place, { passive: true });\n\n return () => {\n window.removeEventListener('scroll', place, { capture: true });\n window.removeEventListener('resize', place);\n };\n }, [visible, place]);\n\n const show = useCallback(() => {\n clearTimer();\n timerRef.current = setTimeout(() => setVisible(true), delay);\n }, [delay, clearTimer]);\n\n const hide = useCallback(() => {\n clearTimer();\n setVisible(false);\n setPos(null);\n }, [clearTimer]);\n\n // Position as soon as the tooltip mounts\n useEffect(() => {\n if (visible) {\n place();\n }\n }, [visible, place]);\n\n // Dismiss on Escape\n useEffect(() => {\n if (!visible) {\n return;\n }\n\n const handler = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n hide();\n }\n };\n\n document.addEventListener('keydown', handler);\n\n return () => document.removeEventListener('keydown', handler);\n }, [visible, hide]);\n\n const childRef = (\n children.props as HTMLAttributes<HTMLElement> & {\n ref?: Ref<HTMLElement>;\n }\n ).ref;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const child = cloneElement(children as any, {\n ref: (node: HTMLElement | null) => {\n triggerRef.current = node;\n assignRef(childRef, node);\n },\n 'aria-describedby': id,\n onMouseEnter: (e: MouseEvent<HTMLElement>) => {\n show();\n children.props.onMouseEnter?.(e);\n },\n onMouseLeave: (e: MouseEvent<HTMLElement>) => {\n hide();\n children.props.onMouseLeave?.(e);\n },\n onFocus: (e: FocusEvent<HTMLElement>) => {\n show();\n children.props.onFocus?.(e);\n },\n onBlur: (e: FocusEvent<HTMLElement>) => {\n hide();\n children.props.onBlur?.(e);\n },\n });\n\n const tooltip = (\n <div\n ref={tooltipRef}\n id={id}\n role=\"tooltip\"\n className={[\n styles.tooltip,\n pos ? styles[pos.placement] : null,\n visible && pos ? styles.visible : null,\n ]\n .filter(Boolean)\n .join(' ')}\n style={\n pos ? { top: pos.top, left: pos.left } : { visibility: 'hidden', top: -9999, left: -9999 }\n }\n >\n {label}\n </div>\n );\n\n return (\n <>\n {child}\n {typeof document !== 'undefined' ? createPortal(tooltip, document.body) : tooltip}\n </>\n );\n};\n"],"mappings":";;;;;AAkDA,IAAM,IAAM;AAEZ,SAAS,EAAa,GAAyB,GAAiB;CACzD,OAIL;MAAI,OAAO,KAAQ,YAAY;GAC7B,EAAI,CAAK;GAET;EACF;EAEA,EAAI,UAAU;CAFd;AAGF;AAEA,SAAS,EACP,GACA,GACA,GACU;CACV,IAAM,IAAK,OAAO,YACZ,IAAK,OAAO,aAEZ,IAAiC;EACrC;EACA,MAAc,SAAS,MAAc,WACjC,MAAc,QACZ,WACA,QACF,MAAc,SACZ,UACA;EACN;EACA;EACA;EACA;CACF;CAEA,KAAK,IAAM,KAAK,GAAY;EAC1B,IAAI,IAAM,GACN,IAAO;EAEX,AAAI,MAAM,SACR,IAAM,EAAQ,MAAM,EAAQ,SAAS,GACrC,IAAO,EAAQ,OAAO,EAAQ,QAAQ,IAAI,EAAQ,QAAQ,KACjD,MAAM,YACf,IAAM,EAAQ,SAAS,GACvB,IAAO,EAAQ,OAAO,EAAQ,QAAQ,IAAI,EAAQ,QAAQ,KACjD,MAAM,UACf,IAAM,EAAQ,MAAM,EAAQ,SAAS,IAAI,EAAQ,SAAS,GAC1D,IAAO,EAAQ,OAAO,EAAQ,QAAQ,MAEtC,IAAM,EAAQ,MAAM,EAAQ,SAAS,IAAI,EAAQ,SAAS,GAC1D,IAAO,EAAQ,QAAQ;EAIzB,IACM,IAAQ,KAAQ,KAAU,IAAO,EAAQ,SAAS,IAAK,GACvD,IAAQ,KAAO,KAAU,IAAM,EAAQ,UAAU,IAAK;EAE5D,IAAI,KAAS,GACX,OAAO;GACL,KAAK,KAAK,IAAI,GAAQ,KAAK,IAAI,GAAK,IAAK,EAAQ,SAAS,CAAM,CAAC;GACjE,MAAM,KAAK,IAAI,GAAQ,KAAK,IAAI,GAAM,IAAK,EAAQ,QAAQ,CAAM,CAAC;GAClE,WAAW;EACb;CAEJ;CAGA,IAAI,IAAM,GACR,IAAO;CAuBT,OAtBI,MAAc,UAChB,IAAM,EAAQ,MAAM,EAAQ,SAAS,GACrC,IAAO,EAAQ,OAAO,EAAQ,QAAQ,IAAI,EAAQ,QAAQ,IAGxD,MAAc,aAChB,IAAM,EAAQ,SAAS,GACvB,IAAO,EAAQ,OAAO,EAAQ,QAAQ,IAAI,EAAQ,QAAQ,IAGxD,MAAc,WAChB,IAAM,EAAQ,MAAM,EAAQ,SAAS,IAAI,EAAQ,SAAS,GAC1D,IAAO,EAAQ,OAAO,EAAQ,QAAQ,IAGpC,MAAc,YAChB,IAAM,EAAQ,MAAM,EAAQ,SAAS,IAAI,EAAQ,SAAS,GAC1D,IAAO,EAAQ,QAAQ,IAKlB;EACL,KAAK,KAAK,IAAI,GAAQ,KAAK,IAAI,GAAK,IAAK,EAAQ,SAAS,CAAM,CAAC;EACjE,MAAM,KAAK,IAAI,GAAQ,KAAK,IAAI,GAAM,OAAO,aAAa,EAAQ,QAAQ,CAAM,CAAC;EACjF,WAAW;CACb;AACF;AAoBA,IAAa,KAAW,EACtB,UACA,WAAW,IAAqB,OAChC,WAAQ,KACR,kBACkB;CAClB,IAAM,IAAK,EAAM,GACX,CAAC,GAAS,KAAc,EAAS,EAAK,GACtC,CAAC,GAAK,KAAU,EAA0B,IAAI,GAE9C,IAAa,EAAoB,IAAI,GACrC,IAAa,EAAuB,IAAI,GACxC,IAAW,EAA6C,IAAI,GAE5D,IAAa,QAAkB;EACnC,AAEE,EAAS,aADT,aAAa,EAAS,OAAO,GACV;CAEvB,GAAG,CAAC,CAAC,GAEC,IAAQ,QAAkB;EAC1B,CAAC,EAAW,WAAW,CAAC,EAAW,WAOvC,EAAO,EAHa,EAAW,QAAQ,sBAGhB,GAFH,EAAW,QAAQ,sBAEH,GAAa,CAAkB,CAAC;CACtE,GAAG,CAAC,CAAkB,CAAC;CAGvB,QAAgB;EACT,OAQL,OAJA,EAAM,GACN,OAAO,iBAAiB,UAAU,GAAO;GAAE,SAAS;GAAM,SAAS;EAAK,CAAC,GACzE,OAAO,iBAAiB,UAAU,GAAO,EAAE,SAAS,GAAK,CAAC,SAE7C;GAEX,AADA,OAAO,oBAAoB,UAAU,GAAO,EAAE,SAAS,GAAK,CAAC,GAC7D,OAAO,oBAAoB,UAAU,CAAK;EAC5C;CACF,GAAG,CAAC,GAAS,CAAK,CAAC;CAEnB,IAAM,IAAO,QAAkB;EAE7B,AADA,EAAW,GACX,EAAS,UAAU,iBAAiB,EAAW,EAAI,GAAG,CAAK;CAC7D,GAAG,CAAC,GAAO,CAAU,CAAC,GAEhB,IAAO,QAAkB;EAG7B,AAFA,EAAW,GACX,EAAW,EAAK,GAChB,EAAO,IAAI;CACb,GAAG,CAAC,CAAU,CAAC;CAUf,AAPA,QAAgB;EACd,AAAI,KACF,EAAM;CAEV,GAAG,CAAC,GAAS,CAAK,CAAC,GAGnB,QAAgB;EACd,IAAI,CAAC,GACH;EAGF,IAAM,KAAW,MAAqB;GACpC,AAAI,EAAE,QAAQ,YACZ,EAAK;EAET;EAIA,OAFA,SAAS,iBAAiB,WAAW,CAAO,SAE/B,SAAS,oBAAoB,WAAW,CAAO;CAC9D,GAAG,CAAC,GAAS,CAAI,CAAC;CAElB,IAAM,IACJ,EAAS,MAGT,KAGI,IAAQ,EAAa,GAAiB;EAC1C,MAAM,MAA6B;GAEjC,AADA,EAAW,UAAU,GACrB,EAAU,GAAU,CAAI;EAC1B;EACA,oBAAoB;EACpB,eAAe,MAA+B;GAE5C,AADA,EAAK,GACL,EAAS,MAAM,eAAe,CAAC;EACjC;EACA,eAAe,MAA+B;GAE5C,AADA,EAAK,GACL,EAAS,MAAM,eAAe,CAAC;EACjC;EACA,UAAU,MAA+B;GAEvC,AADA,EAAK,GACL,EAAS,MAAM,UAAU,CAAC;EAC5B;EACA,SAAS,MAA+B;GAEtC,AADA,EAAK,GACL,EAAS,MAAM,SAAS,CAAC;EAC3B;CACF,CAAC,GAEK,IACJ,kBAAC,OAAD;EACE,KAAK;EACD;EACJ,MAAK;EACL,WAAW;GACT,EAAO;GACP,IAAM,EAAO,EAAI,aAAa;GAC9B,KAAW,IAAM,EAAO,UAAU;EACpC,EACG,OAAO,OAAO,EACd,KAAK,GAAG;EACX,OACE,IAAM;GAAE,KAAK,EAAI;GAAK,MAAM,EAAI;EAAK,IAAI;GAAE,YAAY;GAAU,KAAK;GAAO,MAAM;EAAM;YAG1F;CACE,CAAA;CAGP,OACE,kBAAA,GAAA,EAAA,UAAA,CACG,GACA,OAAO,WAAa,MAAc,EAAa,GAAS,SAAS,IAAI,IAAI,CAC1E,EAAA,CAAA;AAEN"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./Tooltip/Tooltip.cjs");exports.Tooltip=e.Tooltip;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const e=require(
|
|
1
|
+
const e=require("./ViewSwitcher.module.css.cjs");let t=require("react"),n=require("react/jsx-runtime");var r=({children:r,className:i,"aria-label":a=`View switcher`,...o})=>{let s=(0,t.useRef)(null);function c(e){let t=Array.from(s.current?.querySelectorAll(`[role=radio]:not(:disabled)`)??[]),n=document.activeElement,r=n instanceof HTMLButtonElement?t.indexOf(n):-1;if(r===-1)return;let i=r;if(e.key===`ArrowRight`||e.key===`ArrowDown`)i=(r+1)%t.length;else if(e.key===`ArrowLeft`||e.key===`ArrowUp`)i=(r-1+t.length)%t.length;else if(e.key===`Home`)i=0;else if(e.key===`End`)i=t.length-1;else return;e.preventDefault(),t[i].focus(),t[i].click()}return(0,n.jsx)(`div`,{ref:s,role:`radiogroup`,"aria-label":a,onKeyDown:c,className:[e.default.switcher,i].filter(Boolean).join(` `),...o,children:r})};exports.ViewSwitcher=r;
|
|
2
2
|
//# sourceMappingURL=ViewSwitcher.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ViewSwitcher.cjs","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcher.tsx"],"sourcesContent":["import { type HTMLAttributes, type KeyboardEvent, type ReactNode, useRef } from 'react';\n\nimport styles from './ViewSwitcher.module.css';\n\nexport interface ViewSwitcherProps extends HTMLAttributes<HTMLDivElement> {\n children?: ReactNode;\n /** Accessible label for the group. */\n 'aria-label'?: string;\n}\n\n/**\n * Segmented control for switching between major views.\n *\n * Mirrors the Adwaita `AdwViewSwitcher` pattern. Place in a `HeaderBar`\n * as the `title` for the canonical GNOME layout.\n *\n * Compose with `ViewSwitcherItem` for each option.\n * Keyboard: ← / → cycle through items, Home / End jump to first / last.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcher.html\n * @see https://developer.gnome.org/hig/patterns/nav/view-switchers.html\n */\nexport
|
|
1
|
+
{"version":3,"file":"ViewSwitcher.cjs","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcher.tsx"],"sourcesContent":["import { type HTMLAttributes, type KeyboardEvent, type ReactNode, useRef } from 'react';\n\nimport styles from './ViewSwitcher.module.css';\n\nexport interface ViewSwitcherProps extends HTMLAttributes<HTMLDivElement> {\n children?: ReactNode;\n /** Accessible label for the group. */\n 'aria-label'?: string;\n}\n\n/**\n * Segmented control for switching between major views.\n *\n * Mirrors the Adwaita `AdwViewSwitcher` pattern. Place in a `HeaderBar`\n * as the `title` for the canonical GNOME layout.\n *\n * Compose with `ViewSwitcherItem` for each option.\n * Keyboard: ← / → cycle through items, Home / End jump to first / last.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcher.html\n * @see https://developer.gnome.org/hig/patterns/nav/view-switchers.html\n */\nexport const ViewSwitcher = ({\n children,\n className,\n 'aria-label': ariaLabel = 'View switcher',\n ...props\n}: ViewSwitcherProps) => {\n const groupRef = useRef<HTMLDivElement>(null);\n\n function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n const items = Array.from(\n groupRef.current?.querySelectorAll<HTMLButtonElement>('[role=radio]:not(:disabled)') ?? [],\n );\n const activeElement = document.activeElement;\n const idx = activeElement instanceof HTMLButtonElement ? items.indexOf(activeElement) : -1;\n\n if (idx === -1) {\n return;\n }\n\n let next = idx;\n if (e.key === 'ArrowRight' || e.key === 'ArrowDown') {\n next = (idx + 1) % items.length;\n } else if (e.key === 'ArrowLeft' || e.key === 'ArrowUp') {\n next = (idx - 1 + items.length) % items.length;\n } else if (e.key === 'Home') {\n next = 0;\n } else if (e.key === 'End') {\n next = items.length - 1;\n } else {\n return;\n }\n\n e.preventDefault();\n items[next].focus();\n items[next].click();\n }\n\n return (\n <div\n ref={groupRef}\n role=\"radiogroup\"\n aria-label={ariaLabel}\n onKeyDown={handleKeyDown}\n className={[styles.switcher, className].filter(Boolean).join(' ')}\n {...props}\n >\n {children}\n </div>\n );\n};\n"],"mappings":"uGAsBA,IAAa,GAAgB,CAC3B,WACA,YACA,aAAc,EAAY,gBAC1B,GAAG,KACoB,CACvB,IAAM,GAAA,EAAA,EAAA,QAAkC,IAAI,EAE5C,SAAS,EAAc,EAAkC,CACvD,IAAM,EAAQ,MAAM,KAClB,EAAS,SAAS,iBAAoC,6BAA6B,GAAK,CAAC,CAC3F,EACM,EAAgB,SAAS,cACzB,EAAM,aAAyB,kBAAoB,EAAM,QAAQ,CAAa,EAAI,GAExF,GAAI,IAAQ,GACV,OAGF,IAAI,EAAO,EACX,GAAI,EAAE,MAAQ,cAAgB,EAAE,MAAQ,YACtC,GAAQ,EAAM,GAAK,EAAM,YACpB,GAAI,EAAE,MAAQ,aAAe,EAAE,MAAQ,UAC5C,GAAQ,EAAM,EAAI,EAAM,QAAU,EAAM,YACnC,GAAI,EAAE,MAAQ,OACnB,EAAO,OACF,GAAI,EAAE,MAAQ,MACnB,EAAO,EAAM,OAAS,OAEtB,OAGF,EAAE,eAAe,EACjB,EAAM,GAAM,MAAM,EAClB,EAAM,GAAM,MAAM,CACpB,CAEA,OACE,EAAA,EAAA,KAAC,MAAD,CACE,IAAK,EACL,KAAK,aACL,aAAY,EACZ,UAAW,EACX,UAAW,CAAC,EAAA,QAAO,SAAU,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAChE,GAAI,EAEH,UACE,CAAA,CAET"}
|
|
@@ -16,4 +16,4 @@ export interface ViewSwitcherProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
16
16
|
* @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcher.html
|
|
17
17
|
* @see https://developer.gnome.org/hig/patterns/nav/view-switchers.html
|
|
18
18
|
*/
|
|
19
|
-
export declare
|
|
19
|
+
export declare const ViewSwitcher: ({ children, className, "aria-label": ariaLabel, ...props }: ViewSwitcherProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -2,7 +2,7 @@ import e from "./ViewSwitcher.module.css.js";
|
|
|
2
2
|
import { useRef as t } from "react";
|
|
3
3
|
import { jsx as n } from "react/jsx-runtime";
|
|
4
4
|
//#region src/components/ViewSwitcher/ViewSwitcher.tsx
|
|
5
|
-
|
|
5
|
+
var r = ({ children: r, className: i, "aria-label": a = "View switcher", ...o }) => {
|
|
6
6
|
let s = t(null);
|
|
7
7
|
function c(e) {
|
|
8
8
|
let t = Array.from(s.current?.querySelectorAll("[role=radio]:not(:disabled)") ?? []), n = document.activeElement, r = n instanceof HTMLButtonElement ? t.indexOf(n) : -1;
|
|
@@ -24,7 +24,7 @@ function r({ children: r, className: i, "aria-label": a = "View switcher", ...o
|
|
|
24
24
|
...o,
|
|
25
25
|
children: r
|
|
26
26
|
});
|
|
27
|
-
}
|
|
27
|
+
};
|
|
28
28
|
//#endregion
|
|
29
29
|
export { r as ViewSwitcher };
|
|
30
30
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ViewSwitcher.js","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcher.tsx"],"sourcesContent":["import { type HTMLAttributes, type KeyboardEvent, type ReactNode, useRef } from 'react';\n\nimport styles from './ViewSwitcher.module.css';\n\nexport interface ViewSwitcherProps extends HTMLAttributes<HTMLDivElement> {\n children?: ReactNode;\n /** Accessible label for the group. */\n 'aria-label'?: string;\n}\n\n/**\n * Segmented control for switching between major views.\n *\n * Mirrors the Adwaita `AdwViewSwitcher` pattern. Place in a `HeaderBar`\n * as the `title` for the canonical GNOME layout.\n *\n * Compose with `ViewSwitcherItem` for each option.\n * Keyboard: ← / → cycle through items, Home / End jump to first / last.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcher.html\n * @see https://developer.gnome.org/hig/patterns/nav/view-switchers.html\n */\nexport
|
|
1
|
+
{"version":3,"file":"ViewSwitcher.js","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcher.tsx"],"sourcesContent":["import { type HTMLAttributes, type KeyboardEvent, type ReactNode, useRef } from 'react';\n\nimport styles from './ViewSwitcher.module.css';\n\nexport interface ViewSwitcherProps extends HTMLAttributes<HTMLDivElement> {\n children?: ReactNode;\n /** Accessible label for the group. */\n 'aria-label'?: string;\n}\n\n/**\n * Segmented control for switching between major views.\n *\n * Mirrors the Adwaita `AdwViewSwitcher` pattern. Place in a `HeaderBar`\n * as the `title` for the canonical GNOME layout.\n *\n * Compose with `ViewSwitcherItem` for each option.\n * Keyboard: ← / → cycle through items, Home / End jump to first / last.\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcher.html\n * @see https://developer.gnome.org/hig/patterns/nav/view-switchers.html\n */\nexport const ViewSwitcher = ({\n children,\n className,\n 'aria-label': ariaLabel = 'View switcher',\n ...props\n}: ViewSwitcherProps) => {\n const groupRef = useRef<HTMLDivElement>(null);\n\n function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n const items = Array.from(\n groupRef.current?.querySelectorAll<HTMLButtonElement>('[role=radio]:not(:disabled)') ?? [],\n );\n const activeElement = document.activeElement;\n const idx = activeElement instanceof HTMLButtonElement ? items.indexOf(activeElement) : -1;\n\n if (idx === -1) {\n return;\n }\n\n let next = idx;\n if (e.key === 'ArrowRight' || e.key === 'ArrowDown') {\n next = (idx + 1) % items.length;\n } else if (e.key === 'ArrowLeft' || e.key === 'ArrowUp') {\n next = (idx - 1 + items.length) % items.length;\n } else if (e.key === 'Home') {\n next = 0;\n } else if (e.key === 'End') {\n next = items.length - 1;\n } else {\n return;\n }\n\n e.preventDefault();\n items[next].focus();\n items[next].click();\n }\n\n return (\n <div\n ref={groupRef}\n role=\"radiogroup\"\n aria-label={ariaLabel}\n onKeyDown={handleKeyDown}\n className={[styles.switcher, className].filter(Boolean).join(' ')}\n {...props}\n >\n {children}\n </div>\n );\n};\n"],"mappings":";;;;AAsBA,IAAa,KAAgB,EAC3B,aACA,cACA,cAAc,IAAY,iBAC1B,GAAG,QACoB;CACvB,IAAM,IAAW,EAAuB,IAAI;CAE5C,SAAS,EAAc,GAAkC;EACvD,IAAM,IAAQ,MAAM,KAClB,EAAS,SAAS,iBAAoC,6BAA6B,KAAK,CAAC,CAC3F,GACM,IAAgB,SAAS,eACzB,IAAM,aAAyB,oBAAoB,EAAM,QAAQ,CAAa,IAAI;EAExF,IAAI,MAAQ,IACV;EAGF,IAAI,IAAO;EACX,IAAI,EAAE,QAAQ,gBAAgB,EAAE,QAAQ,aACtC,KAAQ,IAAM,KAAK,EAAM;OACpB,IAAI,EAAE,QAAQ,eAAe,EAAE,QAAQ,WAC5C,KAAQ,IAAM,IAAI,EAAM,UAAU,EAAM;OACnC,IAAI,EAAE,QAAQ,QACnB,IAAO;OACF,IAAI,EAAE,QAAQ,OACnB,IAAO,EAAM,SAAS;OAEtB;EAKF,AAFA,EAAE,eAAe,GACjB,EAAM,GAAM,MAAM,GAClB,EAAM,GAAM,MAAM;CACpB;CAEA,OACE,kBAAC,OAAD;EACE,KAAK;EACL,MAAK;EACL,cAAY;EACZ,WAAW;EACX,WAAW,CAAC,EAAO,UAAU,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;EAChE,GAAI;EAEH;CACE,CAAA;AAET"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const e=require(
|
|
1
|
+
const e=require("../Icon/Icon.cjs"),t=require("./ViewSwitcher.module.css.cjs");let n=require("react/jsx-runtime");var r=({label:r,icon:i,active:a=!1,className:o,disabled:s,...c})=>(0,n.jsxs)(`button`,{type:`button`,role:`radio`,"aria-checked":a,tabIndex:a?0:-1,disabled:s,className:[t.default.item,a?t.default.active:null,o].filter(Boolean).join(` `),...c,children:[i&&(0,n.jsx)(`span`,{className:t.default.itemIcon,children:(0,n.jsx)(e.Icon,{icon:i,size:`md`,"aria-hidden":!0})}),(0,n.jsx)(`span`,{className:t.default.itemLabel,children:r})]});exports.ViewSwitcherItem=r;
|
|
2
2
|
//# sourceMappingURL=ViewSwitcherItem.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ViewSwitcherItem.cjs","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcherItem.tsx"],"sourcesContent":["import type { IconDefinition } from '@gnome-ui/icons';\nimport type { ButtonHTMLAttributes } from 'react';\n\nimport { Icon } from '../Icon';\n\nimport styles from './ViewSwitcher.module.css';\n\nexport interface ViewSwitcherItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n /** Display label. */\n label: string;\n /** Optional icon from `@gnome-ui/icons`. */\n icon?: IconDefinition;\n /** Marks this item as the currently active view. */\n active?: boolean;\n}\n\n/**\n * Individual option inside a `ViewSwitcher`.\n *\n * Renders as `role=\"radio\"` so the group has proper radiogroup semantics.\n */\nexport
|
|
1
|
+
{"version":3,"file":"ViewSwitcherItem.cjs","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcherItem.tsx"],"sourcesContent":["import type { IconDefinition } from '@gnome-ui/icons';\nimport type { ButtonHTMLAttributes } from 'react';\n\nimport { Icon } from '../Icon';\n\nimport styles from './ViewSwitcher.module.css';\n\nexport interface ViewSwitcherItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n /** Display label. */\n label: string;\n /** Optional icon from `@gnome-ui/icons`. */\n icon?: IconDefinition;\n /** Marks this item as the currently active view. */\n active?: boolean;\n}\n\n/**\n * Individual option inside a `ViewSwitcher`.\n *\n * Renders as `role=\"radio\"` so the group has proper radiogroup semantics.\n */\nexport const ViewSwitcherItem = ({\n label,\n icon,\n active = false,\n className,\n disabled,\n ...props\n}: ViewSwitcherItemProps) => {\n return (\n <button\n type=\"button\"\n role=\"radio\"\n aria-checked={active}\n tabIndex={active ? 0 : -1}\n disabled={disabled}\n className={[styles.item, active ? styles.active : null, className].filter(Boolean).join(' ')}\n {...props}\n >\n {icon && (\n <span className={styles.itemIcon}>\n <Icon icon={icon} size=\"md\" aria-hidden />\n </span>\n )}\n <span className={styles.itemLabel}>{label}</span>\n </button>\n );\n};\n"],"mappings":"kHAqBA,IAAa,GAAoB,CAC/B,QACA,OACA,SAAS,GACT,YACA,WACA,GAAG,MAGD,EAAA,EAAA,MAAC,SAAD,CACE,KAAK,SACL,KAAK,QACL,eAAc,EACd,SAAU,EAAS,EAAI,GACb,WACV,UAAW,CAAC,EAAA,QAAO,KAAM,EAAS,EAAA,QAAO,OAAS,KAAM,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAC3F,GAAI,WAPN,CASG,IACC,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,mBACtB,EAAA,EAAA,KAAC,EAAA,KAAD,CAAY,OAAM,KAAK,KAAK,cAAA,EAAa,CAAA,CACrC,CAAA,GAER,EAAA,EAAA,KAAC,OAAD,CAAM,UAAW,EAAA,QAAO,mBAAY,CAAY,CAAA,CAC1C"}
|
|
@@ -13,4 +13,4 @@ export interface ViewSwitcherItemProps extends ButtonHTMLAttributes<HTMLButtonEl
|
|
|
13
13
|
*
|
|
14
14
|
* Renders as `role="radio"` so the group has proper radiogroup semantics.
|
|
15
15
|
*/
|
|
16
|
-
export declare
|
|
16
|
+
export declare const ViewSwitcherItem: ({ label, icon, active, className, disabled, ...props }: ViewSwitcherItemProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -2,32 +2,30 @@ import { Icon as e } from "../Icon/Icon.js";
|
|
|
2
2
|
import t from "./ViewSwitcher.module.css.js";
|
|
3
3
|
import { jsx as n, jsxs as r } from "react/jsx-runtime";
|
|
4
4
|
//#region src/components/ViewSwitcher/ViewSwitcherItem.tsx
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
});
|
|
30
|
-
}
|
|
5
|
+
var i = ({ label: i, icon: a, active: o = !1, className: s, disabled: c, ...l }) => /* @__PURE__ */ r("button", {
|
|
6
|
+
type: "button",
|
|
7
|
+
role: "radio",
|
|
8
|
+
"aria-checked": o,
|
|
9
|
+
tabIndex: o ? 0 : -1,
|
|
10
|
+
disabled: c,
|
|
11
|
+
className: [
|
|
12
|
+
t.item,
|
|
13
|
+
o ? t.active : null,
|
|
14
|
+
s
|
|
15
|
+
].filter(Boolean).join(" "),
|
|
16
|
+
...l,
|
|
17
|
+
children: [a && /* @__PURE__ */ n("span", {
|
|
18
|
+
className: t.itemIcon,
|
|
19
|
+
children: /* @__PURE__ */ n(e, {
|
|
20
|
+
icon: a,
|
|
21
|
+
size: "md",
|
|
22
|
+
"aria-hidden": !0
|
|
23
|
+
})
|
|
24
|
+
}), /* @__PURE__ */ n("span", {
|
|
25
|
+
className: t.itemLabel,
|
|
26
|
+
children: i
|
|
27
|
+
})]
|
|
28
|
+
});
|
|
31
29
|
//#endregion
|
|
32
30
|
export { i as ViewSwitcherItem };
|
|
33
31
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ViewSwitcherItem.js","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcherItem.tsx"],"sourcesContent":["import type { IconDefinition } from '@gnome-ui/icons';\nimport type { ButtonHTMLAttributes } from 'react';\n\nimport { Icon } from '../Icon';\n\nimport styles from './ViewSwitcher.module.css';\n\nexport interface ViewSwitcherItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n /** Display label. */\n label: string;\n /** Optional icon from `@gnome-ui/icons`. */\n icon?: IconDefinition;\n /** Marks this item as the currently active view. */\n active?: boolean;\n}\n\n/**\n * Individual option inside a `ViewSwitcher`.\n *\n * Renders as `role=\"radio\"` so the group has proper radiogroup semantics.\n */\nexport
|
|
1
|
+
{"version":3,"file":"ViewSwitcherItem.js","names":[],"sources":["../../../src/components/ViewSwitcher/ViewSwitcherItem.tsx"],"sourcesContent":["import type { IconDefinition } from '@gnome-ui/icons';\nimport type { ButtonHTMLAttributes } from 'react';\n\nimport { Icon } from '../Icon';\n\nimport styles from './ViewSwitcher.module.css';\n\nexport interface ViewSwitcherItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n /** Display label. */\n label: string;\n /** Optional icon from `@gnome-ui/icons`. */\n icon?: IconDefinition;\n /** Marks this item as the currently active view. */\n active?: boolean;\n}\n\n/**\n * Individual option inside a `ViewSwitcher`.\n *\n * Renders as `role=\"radio\"` so the group has proper radiogroup semantics.\n */\nexport const ViewSwitcherItem = ({\n label,\n icon,\n active = false,\n className,\n disabled,\n ...props\n}: ViewSwitcherItemProps) => {\n return (\n <button\n type=\"button\"\n role=\"radio\"\n aria-checked={active}\n tabIndex={active ? 0 : -1}\n disabled={disabled}\n className={[styles.item, active ? styles.active : null, className].filter(Boolean).join(' ')}\n {...props}\n >\n {icon && (\n <span className={styles.itemIcon}>\n <Icon icon={icon} size=\"md\" aria-hidden />\n </span>\n )}\n <span className={styles.itemLabel}>{label}</span>\n </button>\n );\n};\n"],"mappings":";;;;AAqBA,IAAa,KAAoB,EAC/B,UACA,SACA,YAAS,IACT,cACA,aACA,GAAG,QAGD,kBAAC,UAAD;CACE,MAAK;CACL,MAAK;CACL,gBAAc;CACd,UAAU,IAAS,IAAI;CACb;CACV,WAAW;EAAC,EAAO;EAAM,IAAS,EAAO,SAAS;EAAM;CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;CAC3F,GAAI;WAPN,CASG,KACC,kBAAC,QAAD;EAAM,WAAW,EAAO;YACtB,kBAAC,GAAD;GAAY;GAAM,MAAK;GAAK,eAAA;EAAa,CAAA;CACrC,CAAA,GAER,kBAAC,QAAD;EAAM,WAAW,EAAO;YAAY;CAAY,CAAA,CAC1C"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./ViewSwitcher/ViewSwitcher.cjs"),t=require("./ViewSwitcher/ViewSwitcherItem.cjs");exports.ViewSwitcher=e.ViewSwitcher,exports.ViewSwitcherItem=t.ViewSwitcherItem;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const e=require(
|
|
1
|
+
const e=require("./ViewSwitcherBar.module.css.cjs");let t=require("react/jsx-runtime");var n=({children:n,reveal:r=!0,className:i,...a})=>r?(0,t.jsx)(`div`,{role:`navigation`,"aria-label":`Bottom navigation`,className:[e.default.bar,i].filter(Boolean).join(` `),...a,children:n}):null;exports.ViewSwitcherBar=n;
|
|
2
2
|
//# sourceMappingURL=ViewSwitcherBar.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ViewSwitcherBar.cjs","names":[],"sources":["../../../src/components/ViewSwitcherBar/ViewSwitcherBar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './ViewSwitcherBar.module.css';\n\nexport interface ViewSwitcherBarProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * `ViewSwitcherItem` elements to render in the bottom bar.\n * Use the same items you pass to the header-bar `ViewSwitcher`.\n */\n children: ReactNode;\n /**\n * Whether the bar is visible.\n * Typically tied to `useBreakpoint().isMedium` so it appears\n * automatically when the window is ≤ 550 px wide.\n */\n reveal?: boolean;\n}\n\n/**\n * Bottom navigation bar for `ViewSwitcher` items on narrow screens (≤ 550 px),\n * mirroring the Adwaita `AdwViewSwitcherBar` pattern.\n *\n * Use in tandem with a `ViewSwitcher` in the `HeaderBar`:\n * - **Wide** (> 550 px): show the `ViewSwitcher` in the header, hide the bar.\n * - **Narrow** (≤ 550 px): hide the header switcher, reveal the bar.\n *\n * @example\n * const { isMedium } = useBreakpoint();\n * <>\n * <HeaderBar\n * title={\n * !isMedium && (\n * <ViewSwitcher aria-label=\"View\">…items…</ViewSwitcher>\n * )\n * }\n * />\n * <ViewSwitcherBar reveal={isMedium}>…items…</ViewSwitcherBar>\n * </>\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcherBar.html\n */\nexport
|
|
1
|
+
{"version":3,"file":"ViewSwitcherBar.cjs","names":[],"sources":["../../../src/components/ViewSwitcherBar/ViewSwitcherBar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\n\nimport styles from './ViewSwitcherBar.module.css';\n\nexport interface ViewSwitcherBarProps extends HTMLAttributes<HTMLDivElement> {\n /**\n * `ViewSwitcherItem` elements to render in the bottom bar.\n * Use the same items you pass to the header-bar `ViewSwitcher`.\n */\n children: ReactNode;\n /**\n * Whether the bar is visible.\n * Typically tied to `useBreakpoint().isMedium` so it appears\n * automatically when the window is ≤ 550 px wide.\n */\n reveal?: boolean;\n}\n\n/**\n * Bottom navigation bar for `ViewSwitcher` items on narrow screens (≤ 550 px),\n * mirroring the Adwaita `AdwViewSwitcherBar` pattern.\n *\n * Use in tandem with a `ViewSwitcher` in the `HeaderBar`:\n * - **Wide** (> 550 px): show the `ViewSwitcher` in the header, hide the bar.\n * - **Narrow** (≤ 550 px): hide the header switcher, reveal the bar.\n *\n * @example\n * const { isMedium } = useBreakpoint();\n * <>\n * <HeaderBar\n * title={\n * !isMedium && (\n * <ViewSwitcher aria-label=\"View\">…items…</ViewSwitcher>\n * )\n * }\n * />\n * <ViewSwitcherBar reveal={isMedium}>…items…</ViewSwitcherBar>\n * </>\n *\n * @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.ViewSwitcherBar.html\n */\nexport const ViewSwitcherBar = ({\n children,\n reveal = true,\n className,\n ...props\n}: ViewSwitcherBarProps) => {\n if (!reveal) {\n return null;\n }\n\n return (\n <div\n role=\"navigation\"\n aria-label=\"Bottom navigation\"\n className={[styles.bar, className].filter(Boolean).join(' ')}\n {...props}\n >\n {children}\n </div>\n );\n};\n"],"mappings":"uFAyCA,IAAa,GAAmB,CAC9B,WACA,SAAS,GACT,YACA,GAAG,KAEE,GAKH,EAAA,EAAA,KAAC,MAAD,CACE,KAAK,aACL,aAAW,oBACX,UAAW,CAAC,EAAA,QAAO,IAAK,CAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,EAC3D,GAAI,EAEH,UACE,CAAA,EAXE"}
|