@fairgarden/design 0.1.0-alpha.1 → 0.1.0-alpha.2
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/LICENSE +21 -0
- package/Readme.md +51 -27
- package/actions/button/Button.d.ts.map +1 -1
- package/actions/button/Button.js +13 -1
- package/actions/button/Button.js.map +1 -1
- package/actions/button/button.module.css +85 -25
- package/actions/chip/Chip.d.ts +2 -2
- package/actions/chip/Chip.js +2 -2
- package/actions/chip/chip.module.css +12 -18
- package/actions/link/Link.d.ts +1 -1
- package/actions/link/link.module.css +22 -19
- package/actions/toggle/Toggle.js +1 -1
- package/actions/toggle/toggle.module.css +27 -23
- package/content/card/card.module.css +27 -27
- package/content/card-grid/CardGrid.js +1 -1
- package/content/card-grid/card-grid.module.css +3 -3
- package/content/carousel/Carousel.d.ts.map +1 -1
- package/content/carousel/Carousel.js +1 -4
- package/content/carousel/Carousel.js.map +1 -1
- package/content/carousel/carousel.module.css +19 -9
- package/content/code-block/CodeActionsMenu.d.ts +34 -0
- package/content/code-block/CodeActionsMenu.d.ts.map +1 -0
- package/content/code-block/CodeActionsMenu.js +102 -0
- package/content/code-block/CodeActionsMenu.js.map +1 -0
- package/content/code-block/CodeBlock.d.ts +37 -0
- package/content/code-block/CodeBlock.d.ts.map +1 -0
- package/content/code-block/CodeBlock.js +30 -0
- package/content/code-block/CodeBlock.js.map +1 -0
- package/content/code-block/CodeBlockFrame.d.ts +54 -0
- package/content/code-block/CodeBlockFrame.d.ts.map +1 -0
- package/content/code-block/CodeBlockFrame.js +80 -0
- package/content/code-block/CodeBlockFrame.js.map +1 -0
- package/content/code-block/CodeBlockHeader.d.ts +26 -0
- package/content/code-block/CodeBlockHeader.d.ts.map +1 -0
- package/content/code-block/CodeBlockHeader.js +16 -0
- package/content/code-block/CodeBlockHeader.js.map +1 -0
- package/content/code-block/CodeBlockLazy.d.ts +11 -0
- package/content/code-block/CodeBlockLazy.d.ts.map +1 -0
- package/content/code-block/CodeBlockLazy.js +14 -0
- package/content/code-block/CodeBlockLazy.js.map +1 -0
- package/content/code-block/CodeBlockLoading.d.ts +31 -0
- package/content/code-block/CodeBlockLoading.d.ts.map +1 -0
- package/content/code-block/CodeBlockLoading.js +90 -0
- package/content/code-block/CodeBlockLoading.js.map +1 -0
- package/content/code-block/CodeBlockSection.d.ts +40 -0
- package/content/code-block/CodeBlockSection.d.ts.map +1 -0
- package/content/code-block/CodeBlockSection.js +105 -0
- package/content/code-block/CodeBlockSection.js.map +1 -0
- package/content/code-block/CodeBlockToasts.d.ts +26 -0
- package/content/code-block/CodeBlockToasts.d.ts.map +1 -0
- package/content/code-block/CodeBlockToasts.js +88 -0
- package/content/code-block/CodeBlockToasts.js.map +1 -0
- package/content/code-block/code-block.module.css +949 -0
- package/content/code-block/index.d.ts +4 -0
- package/content/code-block/index.d.ts.map +1 -0
- package/content/code-block/index.js +4 -0
- package/content/code-block/index.js.map +1 -0
- package/content/demo/DemoContent.d.ts +32 -0
- package/content/demo/DemoContent.d.ts.map +1 -0
- package/content/demo/DemoContent.js +87 -0
- package/content/demo/DemoContent.js.map +1 -0
- package/content/demo/DemoFrame.d.ts +6 -0
- package/content/demo/DemoFrame.d.ts.map +1 -0
- package/content/demo/DemoFrame.js +17 -0
- package/content/demo/DemoFrame.js.map +1 -0
- package/content/demo/DemoLazy.d.ts +11 -0
- package/content/demo/DemoLazy.d.ts.map +1 -0
- package/content/demo/DemoLazy.js +14 -0
- package/content/demo/DemoLazy.js.map +1 -0
- package/content/demo/DemoLoading.d.ts +23 -0
- package/content/demo/DemoLoading.d.ts.map +1 -0
- package/content/demo/DemoLoading.js +26 -0
- package/content/demo/DemoLoading.js.map +1 -0
- package/content/demo/demo.module.css +163 -0
- package/content/demo/index.d.ts +4 -0
- package/content/demo/index.d.ts.map +1 -0
- package/content/demo/index.js +4 -0
- package/content/demo/index.js.map +1 -0
- package/content/empty-state/EmptyState.d.ts +1 -1
- package/content/empty-state/EmptyState.js +1 -1
- package/content/empty-state/empty-state.module.css +11 -11
- package/content/feature-grid/feature-grid.module.css +22 -22
- package/content/index-rows/IndexRows.d.ts +2 -2
- package/content/index-rows/IndexRows.d.ts.map +1 -1
- package/content/index-rows/IndexRows.js +1 -1
- package/content/index-rows/index-rows.module.css +29 -29
- package/content/pricing/Pricing.d.ts +4 -4
- package/content/pricing/Pricing.d.ts.map +1 -1
- package/content/pricing/Pricing.js +4 -4
- package/content/pricing/Pricing.js.map +1 -1
- package/content/pricing/pricing.module.css +22 -22
- package/content/profile/Profile.d.ts +1 -1
- package/content/profile/Profile.js +2 -2
- package/content/profile/profile.module.css +13 -13
- package/content/quote/Quote.d.ts +1 -1
- package/content/quote/quote.module.css +9 -9
- package/content/timeline/Timeline.d.ts +1 -1
- package/content/timeline/Timeline.d.ts.map +1 -1
- package/content/timeline/Timeline.js +5 -5
- package/content/timeline/Timeline.js.map +1 -1
- package/content/timeline/timeline.module.css +12 -12
- package/content/types-table/TypePre.d.ts +11 -0
- package/content/types-table/TypePre.d.ts.map +1 -0
- package/content/types-table/TypePre.js +13 -0
- package/content/types-table/TypePre.js.map +1 -0
- package/content/types-table/TypesTable.d.ts +22 -0
- package/content/types-table/TypesTable.d.ts.map +1 -0
- package/content/types-table/TypesTable.js +124 -0
- package/content/types-table/TypesTable.js.map +1 -0
- package/content/types-table/index.d.ts +3 -0
- package/content/types-table/index.d.ts.map +1 -0
- package/content/types-table/index.js +3 -0
- package/content/types-table/index.js.map +1 -0
- package/content/types-table/types-table.module.css +160 -0
- package/data/chart/Chart.d.ts +8 -1
- package/data/chart/Chart.d.ts.map +1 -1
- package/data/chart/Chart.js +28 -15
- package/data/chart/Chart.js.map +1 -1
- package/data/chart/chart.module.css +20 -6
- package/data/figure/Figure.d.ts +1 -1
- package/data/figure/Figure.js +1 -1
- package/data/figure/figure.module.css +7 -7
- package/data/map/Map.d.ts +3 -3
- package/data/map/Map.d.ts.map +1 -1
- package/data/map/Map.js +10 -8
- package/data/map/Map.js.map +1 -1
- package/data/map/MapCanvas.d.ts.map +1 -1
- package/data/map/MapCanvas.js +5 -9
- package/data/map/MapCanvas.js.map +1 -1
- package/data/map/map.module.css +39 -14
- package/data/map/mapStyle.d.ts +2 -2
- package/data/map/mapStyle.d.ts.map +1 -1
- package/data/map/mapStyle.js +5 -5
- package/data/map/mapStyle.js.map +1 -1
- package/data/scroll-area/ScrollArea.d.ts.map +1 -1
- package/data/scroll-area/ScrollArea.js +8 -4
- package/data/scroll-area/ScrollArea.js.map +1 -1
- package/data/scroll-area/scroll-area.module.css +28 -9
- package/data/spec-grid/spec-grid.module.css +8 -8
- package/data/spec-list/spec-list.module.css +3 -3
- package/data/spec-sheet/SpecSheet.d.ts +2 -2
- package/data/spec-sheet/SpecSheet.js +1 -1
- package/data/spec-sheet/spec-sheet.module.css +9 -9
- package/data/stat/Stat.d.ts +1 -1
- package/data/stat/Stat.d.ts.map +1 -1
- package/data/stat/stat.module.css +4 -4
- package/data/table/Table.d.ts +6 -5
- package/data/table/Table.d.ts.map +1 -1
- package/data/table/Table.js.map +1 -1
- package/data/table/table.module.css +43 -46
- package/disclosure/accordion/Accordion.d.ts +1 -1
- package/disclosure/accordion/Accordion.js +1 -1
- package/disclosure/accordion/accordion.module.css +12 -12
- package/disclosure/collapsible/Collapsible.d.ts +4 -4
- package/disclosure/collapsible/Collapsible.js +4 -4
- package/disclosure/collapsible/collapsible.module.css +10 -10
- package/disclosure/faq/FAQ.d.ts +3 -3
- package/disclosure/faq/FAQ.d.ts.map +1 -1
- package/disclosure/faq/FAQ.js +3 -3
- package/disclosure/faq/FAQ.js.map +1 -1
- package/disclosure/faq/faq.module.css +20 -20
- package/feedback/alert/alert.module.css +4 -4
- package/feedback/avatar/avatar-group.module.css +2 -2
- package/feedback/avatar/avatar.module.css +9 -9
- package/feedback/badge/Badge.d.ts +1 -1
- package/feedback/badge/badge.module.css +7 -7
- package/feedback/meter/Meter.d.ts +2 -2
- package/feedback/meter/meter.module.css +14 -14
- package/feedback/progress/Progress.d.ts +1 -1
- package/feedback/progress/progress.module.css +7 -7
- package/feedback/tag/tag.module.css +7 -7
- package/feedback/toast/Toast.d.ts +3 -3
- package/feedback/toast/Toast.d.ts.map +1 -1
- package/feedback/toast/Toast.js +17 -7
- package/feedback/toast/Toast.js.map +1 -1
- package/feedback/toast/toast.module.css +31 -20
- package/forms/autocomplete/Autocomplete.d.ts +11 -0
- package/forms/autocomplete/Autocomplete.d.ts.map +1 -1
- package/forms/autocomplete/Autocomplete.js +27 -6
- package/forms/autocomplete/Autocomplete.js.map +1 -1
- package/forms/autocomplete/autocomplete.module.css +35 -41
- package/forms/checkbox/Checkbox.js +1 -1
- package/forms/checkbox/checkbox.module.css +29 -25
- package/forms/checkbox-group/checkbox-group.module.css +4 -4
- package/forms/combobox/Combobox.d.ts +10 -0
- package/forms/combobox/Combobox.d.ts.map +1 -1
- package/forms/combobox/Combobox.js +28 -7
- package/forms/combobox/Combobox.js.map +1 -1
- package/forms/combobox/combobox.module.css +34 -41
- package/forms/field/field.module.css +1 -1
- package/forms/fieldset/Fieldset.d.ts +1 -1
- package/forms/fieldset/Fieldset.js +2 -2
- package/forms/fieldset/fieldset.module.css +14 -14
- package/forms/form/form.module.css +2 -2
- package/forms/input/Input.d.ts +10 -3
- package/forms/input/Input.d.ts.map +1 -1
- package/forms/input/Input.js +10 -4
- package/forms/input/Input.js.map +1 -1
- package/forms/input/input.module.css +38 -21
- package/forms/number-field/number-field.module.css +24 -23
- package/forms/radio/Radio.d.ts +1 -1
- package/forms/radio/Radio.d.ts.map +1 -1
- package/forms/radio/Radio.js +5 -3
- package/forms/radio/Radio.js.map +1 -1
- package/forms/radio/radio.module.css +38 -30
- package/forms/radio-group/RadioGroup.d.ts +1 -1
- package/forms/radio-group/radio-group.module.css +3 -3
- package/forms/search/Search.d.ts +10 -0
- package/forms/search/Search.d.ts.map +1 -1
- package/forms/search/Search.js +25 -6
- package/forms/search/Search.js.map +1 -1
- package/forms/search/search.module.css +25 -33
- package/forms/select/Select.d.ts +10 -2
- package/forms/select/Select.d.ts.map +1 -1
- package/forms/select/Select.js +27 -12
- package/forms/select/Select.js.map +1 -1
- package/forms/select/select.module.css +42 -48
- package/forms/slider/Slider.js +2 -2
- package/forms/slider/slider.module.css +23 -23
- package/forms/switch/Switch.js +1 -1
- package/forms/switch/switch.module.css +23 -19
- package/foundations/expanding-box/ExpandingBox.d.ts +86 -0
- package/foundations/expanding-box/ExpandingBox.d.ts.map +1 -0
- package/foundations/expanding-box/ExpandingBox.js +179 -0
- package/foundations/expanding-box/ExpandingBox.js.map +1 -0
- package/foundations/expanding-box/expanding-box.module.css +415 -0
- package/foundations/expanding-box/index.d.ts +3 -0
- package/foundations/expanding-box/index.d.ts.map +1 -0
- package/foundations/expanding-box/index.js +3 -0
- package/foundations/expanding-box/index.js.map +1 -0
- package/foundations/expanding-box/startExpandingTransition.d.ts +33 -0
- package/foundations/expanding-box/startExpandingTransition.d.ts.map +1 -0
- package/foundations/expanding-box/startExpandingTransition.js +82 -0
- package/foundations/expanding-box/startExpandingTransition.js.map +1 -0
- package/foundations/ground/Ground.d.ts +1 -1
- package/foundations/ground/ground.module.css +4 -4
- package/foundations/icon/Icon.d.ts +1 -1
- package/foundations/icon/Icon.js +1 -1
- package/foundations/icon/icon.module.css +1 -1
- package/foundations/outline-morph/OutlineMorph.d.ts +112 -0
- package/foundations/outline-morph/OutlineMorph.d.ts.map +1 -0
- package/foundations/outline-morph/OutlineMorph.js +83 -0
- package/foundations/outline-morph/OutlineMorph.js.map +1 -0
- package/foundations/outline-morph/index.d.ts +3 -0
- package/foundations/outline-morph/index.d.ts.map +1 -0
- package/foundations/outline-morph/index.js +3 -0
- package/foundations/outline-morph/index.js.map +1 -0
- package/foundations/outline-morph/morphEngine.d.ts +219 -0
- package/foundations/outline-morph/morphEngine.d.ts.map +1 -0
- package/foundations/outline-morph/morphEngine.js +1331 -0
- package/foundations/outline-morph/morphEngine.js.map +1 -0
- package/foundations/outline-morph/outline-morph.module.css +113 -0
- package/foundations/outline-morph/useOutlineMorphRoot.d.ts +50 -0
- package/foundations/outline-morph/useOutlineMorphRoot.d.ts.map +1 -0
- package/foundations/outline-morph/useOutlineMorphRoot.js +55 -0
- package/foundations/outline-morph/useOutlineMorphRoot.js.map +1 -0
- package/foundations/separator/separator.module.css +10 -10
- package/foundations/sticker/Sticker.d.ts +4 -4
- package/foundations/sticker/Sticker.d.ts.map +1 -1
- package/foundations/sticker/Sticker.js +3 -3
- package/foundations/sticker/sticker.module.css +10 -10
- package/icons/paths.d.ts +1 -1
- package/icons/paths.d.ts.map +1 -1
- package/icons/paths.js +50 -0
- package/icons/paths.js.map +1 -1
- package/navigation/breadcrumb/Breadcrumb.d.ts +7 -1
- package/navigation/breadcrumb/Breadcrumb.d.ts.map +1 -1
- package/navigation/breadcrumb/Breadcrumb.js +8 -8
- package/navigation/breadcrumb/Breadcrumb.js.map +1 -1
- package/navigation/breadcrumb/breadcrumb.module.css +14 -14
- package/navigation/file-tabs/FileTabs.d.ts +169 -0
- package/navigation/file-tabs/FileTabs.d.ts.map +1 -0
- package/navigation/file-tabs/FileTabs.js +253 -0
- package/navigation/file-tabs/FileTabs.js.map +1 -0
- package/navigation/file-tabs/file-tabs.module.css +868 -0
- package/navigation/file-tabs/index.d.ts +2 -0
- package/navigation/file-tabs/index.d.ts.map +1 -0
- package/navigation/file-tabs/index.js +2 -0
- package/navigation/file-tabs/index.js.map +1 -0
- package/navigation/nav-drawer/NavDrawer.d.ts +32 -6
- package/navigation/nav-drawer/NavDrawer.d.ts.map +1 -1
- package/navigation/nav-drawer/NavDrawer.js +94 -28
- package/navigation/nav-drawer/NavDrawer.js.map +1 -1
- package/navigation/nav-drawer/nav-drawer.module.css +78 -55
- package/navigation/navigation-bar/NavigationBar.d.ts +31 -11
- package/navigation/navigation-bar/NavigationBar.d.ts.map +1 -1
- package/navigation/navigation-bar/NavigationBar.js +40 -17
- package/navigation/navigation-bar/NavigationBar.js.map +1 -1
- package/navigation/navigation-bar/navigation-bar.module.css +58 -27
- package/navigation/navigation-menu/NavigationMenu.d.ts +9 -9
- package/navigation/navigation-menu/NavigationMenu.d.ts.map +1 -1
- package/navigation/navigation-menu/NavigationMenu.js +15 -15
- package/navigation/navigation-menu/navigation-menu.module.css +39 -53
- package/navigation/pagination/Pagination.js +1 -1
- package/navigation/pagination/pagination.module.css +24 -24
- package/navigation/sidebar-nav/SidebarNav.d.ts +71 -0
- package/navigation/sidebar-nav/SidebarNav.d.ts.map +1 -0
- package/navigation/sidebar-nav/SidebarNav.js +169 -0
- package/navigation/sidebar-nav/SidebarNav.js.map +1 -0
- package/navigation/sidebar-nav/index.d.ts +2 -0
- package/navigation/sidebar-nav/index.d.ts.map +1 -0
- package/navigation/sidebar-nav/index.js +2 -0
- package/navigation/sidebar-nav/index.js.map +1 -0
- package/navigation/sidebar-nav/sidebar-nav.module.css +270 -0
- package/navigation/table-of-contents/TableOfContents.d.ts +92 -0
- package/navigation/table-of-contents/TableOfContents.d.ts.map +1 -0
- package/navigation/table-of-contents/TableOfContents.js +211 -0
- package/navigation/table-of-contents/TableOfContents.js.map +1 -0
- package/navigation/table-of-contents/index.d.ts +3 -0
- package/navigation/table-of-contents/index.d.ts.map +1 -0
- package/navigation/table-of-contents/index.js +3 -0
- package/navigation/table-of-contents/index.js.map +1 -0
- package/navigation/table-of-contents/table-of-contents.module.css +322 -0
- package/navigation/table-of-contents/useActiveHeading.d.ts +37 -0
- package/navigation/table-of-contents/useActiveHeading.d.ts.map +1 -0
- package/navigation/table-of-contents/useActiveHeading.js +111 -0
- package/navigation/table-of-contents/useActiveHeading.js.map +1 -0
- package/navigation/tabs/Tabs.d.ts +2 -2
- package/navigation/tabs/Tabs.js +3 -3
- package/navigation/tabs/tabs.module.css +22 -19
- package/navigation/toolbar/Toolbar.d.ts +7 -1
- package/navigation/toolbar/Toolbar.d.ts.map +1 -1
- package/navigation/toolbar/Toolbar.js +3 -3
- package/navigation/toolbar/Toolbar.js.map +1 -1
- package/navigation/toolbar/toolbar.module.css +6 -6
- package/overlays/alert-dialog/AlertDialog.d.ts +14 -4
- package/overlays/alert-dialog/AlertDialog.d.ts.map +1 -1
- package/overlays/alert-dialog/AlertDialog.js +15 -5
- package/overlays/alert-dialog/AlertDialog.js.map +1 -1
- package/overlays/alert-dialog/alert-dialog.module.css +4 -4
- package/overlays/context-menu/ContextMenu.d.ts +1 -1
- package/overlays/context-menu/ContextMenu.js +1 -1
- package/overlays/dialog/Dialog.d.ts +26 -11
- package/overlays/dialog/Dialog.d.ts.map +1 -1
- package/overlays/dialog/Dialog.js +36 -17
- package/overlays/dialog/Dialog.js.map +1 -1
- package/overlays/dialog/dialog.module.css +32 -31
- package/overlays/dialog/morph.d.ts +17 -0
- package/overlays/dialog/morph.d.ts.map +1 -0
- package/overlays/dialog/morph.js +44 -0
- package/overlays/dialog/morph.js.map +1 -0
- package/overlays/menu/Menu.d.ts +18 -7
- package/overlays/menu/Menu.d.ts.map +1 -1
- package/overlays/menu/Menu.js +35 -12
- package/overlays/menu/Menu.js.map +1 -1
- package/overlays/menu/menu.module.css +26 -50
- package/overlays/menu/morph.d.ts +16 -0
- package/overlays/menu/morph.d.ts.map +1 -0
- package/overlays/menu/morph.js +36 -0
- package/overlays/menu/morph.js.map +1 -0
- package/overlays/menu/popup.d.ts +2 -0
- package/overlays/menu/popup.d.ts.map +1 -1
- package/overlays/menu/popup.js +11 -3
- package/overlays/menu/popup.js.map +1 -1
- package/overlays/menubar/Menubar.d.ts +10 -1
- package/overlays/menubar/Menubar.d.ts.map +1 -1
- package/overlays/menubar/Menubar.js +22 -12
- package/overlays/menubar/Menubar.js.map +1 -1
- package/overlays/menubar/menubar.module.css +13 -13
- package/overlays/popover/Popover.d.ts +22 -8
- package/overlays/popover/Popover.d.ts.map +1 -1
- package/overlays/popover/Popover.js +51 -16
- package/overlays/popover/Popover.js.map +1 -1
- package/overlays/popover/popover.module.css +73 -47
- package/overlays/preview-card/PreviewCard.d.ts +3 -3
- package/overlays/preview-card/PreviewCard.d.ts.map +1 -1
- package/overlays/preview-card/PreviewCard.js +5 -6
- package/overlays/preview-card/PreviewCard.js.map +1 -1
- package/overlays/preview-card/preview-card.module.css +19 -54
- package/overlays/search-dialog/SearchDialog.d.ts +89 -0
- package/overlays/search-dialog/SearchDialog.d.ts.map +1 -0
- package/overlays/search-dialog/SearchDialog.js +220 -0
- package/overlays/search-dialog/SearchDialog.js.map +1 -0
- package/overlays/search-dialog/SearchDialogPopup.d.ts +39 -0
- package/overlays/search-dialog/SearchDialogPopup.d.ts.map +1 -0
- package/overlays/search-dialog/SearchDialogPopup.js +80 -0
- package/overlays/search-dialog/SearchDialogPopup.js.map +1 -0
- package/overlays/search-dialog/SearchDialogTrigger.d.ts +24 -0
- package/overlays/search-dialog/SearchDialogTrigger.d.ts.map +1 -0
- package/overlays/search-dialog/SearchDialogTrigger.js +32 -0
- package/overlays/search-dialog/SearchDialogTrigger.js.map +1 -0
- package/overlays/search-dialog/index.d.ts +3 -0
- package/overlays/search-dialog/index.d.ts.map +1 -0
- package/overlays/search-dialog/index.js +3 -0
- package/overlays/search-dialog/index.js.map +1 -0
- package/overlays/search-dialog/search-dialog.module.css +492 -0
- package/overlays/search-dialog/useShortcutLabel.d.ts +13 -0
- package/overlays/search-dialog/useShortcutLabel.d.ts.map +1 -0
- package/overlays/search-dialog/useShortcutLabel.js +19 -0
- package/overlays/search-dialog/useShortcutLabel.js.map +1 -0
- package/overlays/search-dialog/variants.d.ts +25 -0
- package/overlays/search-dialog/variants.d.ts.map +1 -0
- package/overlays/search-dialog/variants.js +31 -0
- package/overlays/search-dialog/variants.js.map +1 -0
- package/overlays/tooltip/Tooltip.d.ts +3 -3
- package/overlays/tooltip/Tooltip.d.ts.map +1 -1
- package/overlays/tooltip/Tooltip.js +3 -3
- package/overlays/tooltip/Tooltip.js.map +1 -1
- package/overlays/tooltip/tooltip.module.css +2 -2
- package/package.json +27 -19
- package/page/announcement-bar/AnnouncementBar.d.ts +1 -1
- package/page/announcement-bar/AnnouncementBar.js +4 -4
- package/page/announcement-bar/AnnouncementBar.js.map +1 -1
- package/page/announcement-bar/announcement-bar.module.css +11 -17
- package/page/cta-block/CTABlock.d.ts +5 -5
- package/page/cta-block/CTABlock.d.ts.map +1 -1
- package/page/cta-block/CTABlock.js +2 -2
- package/page/cta-block/cta-block.module.css +26 -26
- package/page/docs-layout/DocsLayout.d.ts +83 -0
- package/page/docs-layout/DocsLayout.d.ts.map +1 -0
- package/page/docs-layout/DocsLayout.js +108 -0
- package/page/docs-layout/DocsLayout.js.map +1 -0
- package/page/docs-layout/docs-layout.module.css +266 -0
- package/page/docs-layout/index.d.ts +2 -0
- package/page/docs-layout/index.d.ts.map +1 -0
- package/page/docs-layout/index.js +2 -0
- package/page/docs-layout/index.js.map +1 -0
- package/page/footer/Footer.d.ts +1 -1
- package/page/footer/Footer.js +1 -1
- package/page/footer/footer.module.css +31 -31
- package/page/hero/Hero.d.ts +3 -3
- package/page/hero/Hero.d.ts.map +1 -1
- package/page/hero/Hero.js +1 -1
- package/page/hero/hero.module.css +36 -36
- package/page/marquee/Marquee.d.ts +2 -2
- package/page/marquee/Marquee.js +1 -1
- package/page/marquee/marquee.module.css +11 -11
- package/page/newsletter/Newsletter.d.ts.map +1 -1
- package/page/newsletter/Newsletter.js +4 -59
- package/page/newsletter/Newsletter.js.map +1 -1
- package/page/newsletter/newsletter.module.css +44 -22
- package/page/section-bar/SectionBar.d.ts +10 -3
- package/page/section-bar/SectionBar.d.ts.map +1 -1
- package/page/section-bar/SectionBar.js +21 -11
- package/page/section-bar/SectionBar.js.map +1 -1
- package/page/section-bar/section-bar.module.css +43 -46
- package/page/section-divider/SectionDivider.d.ts +2 -2
- package/page/section-divider/SectionDivider.js +4 -4
- package/page/section-divider/SectionDivider.js.map +1 -1
- package/page/section-divider/section-divider.module.css +18 -18
- package/page/section-header/SectionHeader.d.ts +7 -7
- package/page/section-header/SectionHeader.d.ts.map +1 -1
- package/page/section-header/SectionHeader.js +3 -3
- package/page/section-header/SectionHeader.js.map +1 -1
- package/page/section-header/section-header.module.css +16 -16
- package/utils/Ornament.d.ts +1 -1
- package/utils/Ornament.js +2 -2
- package/utils/assignRef.d.ts +7 -1
- package/utils/assignRef.d.ts.map +1 -1
- package/utils/assignRef.js +18 -0
- package/utils/assignRef.js.map +1 -1
- package/utils/docs/DemoTitle.d.ts +12 -0
- package/utils/docs/DemoTitle.d.ts.map +1 -0
- package/utils/docs/DemoTitle.js +11 -0
- package/utils/docs/DemoTitle.js.map +1 -0
- package/utils/docs/Pre.d.ts +39 -0
- package/utils/docs/Pre.d.ts.map +1 -0
- package/utils/docs/Pre.js +26 -0
- package/utils/docs/Pre.js.map +1 -0
- package/utils/docs/createDemo.d.ts +89 -0
- package/utils/docs/createDemo.d.ts.map +1 -0
- package/utils/docs/createDemo.js +51 -0
- package/utils/docs/createDemo.js.map +1 -0
- package/utils/docs/createMdxComponents.d.ts +52 -0
- package/utils/docs/createMdxComponents.d.ts.map +1 -0
- package/utils/docs/createMdxComponents.js +59 -0
- package/utils/docs/createMdxComponents.js.map +1 -0
- package/utils/docs/createTypes.d.ts +23 -0
- package/utils/docs/createTypes.d.ts.map +1 -0
- package/utils/docs/createTypes.js +27 -0
- package/utils/docs/createTypes.js.map +1 -0
- package/utils/docs/index.d.ts +8 -0
- package/utils/docs/index.d.ts.map +1 -0
- package/utils/docs/index.js +16 -0
- package/utils/docs/index.js.map +1 -0
- package/utils/docs/mdx.module.css +201 -0
- package/utils/docs/serverSourceEnhancers.d.ts +26 -0
- package/utils/docs/serverSourceEnhancers.d.ts.map +1 -0
- package/utils/docs/serverSourceEnhancers.js +32 -0
- package/utils/docs/serverSourceEnhancers.js.map +1 -0
- package/utils/docs/toSidebarItems.d.ts +23 -0
- package/utils/docs/toSidebarItems.d.ts.map +1 -0
- package/utils/docs/toSidebarItems.js +36 -0
- package/utils/docs/toSidebarItems.js.map +1 -0
- package/utils/font-fallbacks.css +176 -0
- package/utils/fonts.d.ts +1 -0
- package/utils/fonts.d.ts.map +1 -1
- package/utils/fonts.js +12 -0
- package/utils/fonts.js.map +1 -1
- package/utils/frame.d.ts +4 -0
- package/utils/frame.d.ts.map +1 -0
- package/utils/frame.js +11 -0
- package/utils/frame.js.map +1 -0
- package/utils/global.css +480 -266
- package/utils/line.module.css +17 -17
- package/utils/media.css +1 -1
- package/utils/ornament.module.css +19 -19
- package/utils/overlay.d.ts +4 -4
- package/utils/overlay.js +4 -4
- package/utils/pattern.module.css +45 -45
- package/utils/print.css +48 -34
- package/utils/reset.css +9 -2
- package/utils/roles.css +29 -29
- package/utils/seriesPatterns.js +3 -3
- package/utils/syntax.module.css +92 -0
- package/utils/theme.css +6 -6
- package/utils/tokens.css +262 -192
- package/utils/tokens.d.ts +51 -8
- package/utils/tokens.d.ts.map +1 -1
- package/utils/tokens.js +46 -9
- package/utils/tokens.js.map +1 -1
- package/utils/type.module.css +87 -87
- package/utils/useReleaseMark.d.ts +13 -0
- package/utils/useReleaseMark.d.ts.map +1 -0
- package/utils/useReleaseMark.js +44 -0
- package/utils/useReleaseMark.js.map +1 -0
- package/utils/view-transitions.css +122 -0
|
@@ -4,16 +4,18 @@
|
|
|
4
4
|
* `kind="band"` Ground of the header's preset, so it takes the header's
|
|
5
5
|
* ground and mode, never a `white` overlay scope [D97, D148].
|
|
6
6
|
*
|
|
7
|
-
* Parts: base, bar, logo, logoMark, close, closeLabel, scroll, nav,
|
|
8
|
-
*
|
|
9
|
-
*
|
|
10
|
-
*
|
|
11
|
-
*
|
|
7
|
+
* Parts: base, bar, logo, logoMark, close, closeLabel, scroll, nav,
|
|
8
|
+
* navHost (a passed-in navigation: the docs sidebar [D202]), list, item,
|
|
9
|
+
* group, groupRow, rowLabel, glyph (the Collapsible module's D109 glyph),
|
|
10
|
+
* panel, childList (the indent guide), childItem, childLink, directLink,
|
|
11
|
+
* linkLabel, footer, footerAction, footerList, footerLink, footerLocale,
|
|
12
|
+
* menuTrigger, menuIcon, menuLabel.
|
|
12
13
|
*
|
|
13
14
|
* No backdrop or tint [D24 → D121]: the full sheet hides the page; the side
|
|
14
|
-
* sheet leaves it unpainted and inert.
|
|
15
|
-
*
|
|
16
|
-
*
|
|
15
|
+
* sheet leaves it unpainted and inert. The sheet grows out of the menu
|
|
16
|
+
* Button by the outline morph (§9.17), else opens and closes at once, never
|
|
17
|
+
* a fade [D91, D205, D206]. Colors are role variables only; local custom
|
|
18
|
+
* properties carry dimensions only.
|
|
17
19
|
*/
|
|
18
20
|
|
|
19
21
|
/* Composition sits in top-level rules, outside the layers: Lightning CSS
|
|
@@ -55,8 +57,8 @@
|
|
|
55
57
|
align-items: center;
|
|
56
58
|
gap: var(--size-px-2);
|
|
57
59
|
box-sizing: border-box;
|
|
58
|
-
min-block-size: var(--
|
|
59
|
-
min-inline-size: var(--
|
|
60
|
+
min-block-size: var(--fgd-size-hit);
|
|
61
|
+
min-inline-size: var(--fgd-size-hit);
|
|
60
62
|
margin: 0;
|
|
61
63
|
padding-block: 0;
|
|
62
64
|
padding-inline: var(--size-px-1);
|
|
@@ -73,8 +75,15 @@
|
|
|
73
75
|
flex: none;
|
|
74
76
|
}
|
|
75
77
|
|
|
78
|
+
/*
|
|
79
|
+
* Both labels reserve --size-px-8 (48 px), more than "Menu" or "Close"
|
|
80
|
+
* takes in the UI face or its fallbacks, so the web font arriving never
|
|
81
|
+
* moves the header's end, and the close control has the menu Button's
|
|
82
|
+
* width [D201, D203].
|
|
83
|
+
*/
|
|
76
84
|
.menuLabel,
|
|
77
85
|
.closeLabel {
|
|
86
|
+
min-inline-size: var(--size-px-8);
|
|
78
87
|
text-decoration-color: var(--role-accent);
|
|
79
88
|
text-underline-offset: var(--size-px-1);
|
|
80
89
|
}
|
|
@@ -83,6 +92,7 @@
|
|
|
83
92
|
@media (max-width: 359.98px) {
|
|
84
93
|
.menuLabel {
|
|
85
94
|
position: absolute;
|
|
95
|
+
min-inline-size: 0;
|
|
86
96
|
inline-size: 1px;
|
|
87
97
|
block-size: 1px;
|
|
88
98
|
overflow: hidden;
|
|
@@ -99,16 +109,20 @@
|
|
|
99
109
|
align-items: center;
|
|
100
110
|
gap: var(--size-px-3);
|
|
101
111
|
box-sizing: content-box;
|
|
102
|
-
block-size: var(--
|
|
103
|
-
|
|
112
|
+
block-size: var(--fgd-size-control-xl);
|
|
113
|
+
/* In a Navigation Bar's slot: down to the header's bar, so the close control covers the menu Button (NavDrawer measures it). */
|
|
114
|
+
margin-block-start: var(--nav-drawer-bar-offset, 0px);
|
|
115
|
+
padding-inline: var(--fgd-space-margin);
|
|
104
116
|
border-block-end: var(--border-size-1) solid var(--role-rule);
|
|
105
117
|
}
|
|
106
118
|
|
|
119
|
+
/* As in the header's base fit: the logo gives way (clipped inside a --fgd-size-hit target), never the close control. */
|
|
107
120
|
.logo {
|
|
108
121
|
display: inline-flex;
|
|
109
|
-
flex:
|
|
122
|
+
flex: 0 1 auto;
|
|
110
123
|
align-items: center;
|
|
111
|
-
min-
|
|
124
|
+
min-inline-size: var(--fgd-size-hit);
|
|
125
|
+
min-block-size: var(--fgd-size-hit);
|
|
112
126
|
color: var(--primary12);
|
|
113
127
|
text-decoration-line: none;
|
|
114
128
|
}
|
|
@@ -116,18 +130,27 @@
|
|
|
116
130
|
.logoMark {
|
|
117
131
|
display: inline-flex;
|
|
118
132
|
align-items: center;
|
|
133
|
+
min-inline-size: 0;
|
|
119
134
|
block-size: var(--size-px-6);
|
|
135
|
+
overflow-x: clip;
|
|
120
136
|
}
|
|
121
137
|
|
|
122
138
|
.logoMark > * {
|
|
123
139
|
display: block;
|
|
124
140
|
inline-size: auto;
|
|
141
|
+
min-inline-size: 0;
|
|
125
142
|
block-size: 100%;
|
|
126
143
|
}
|
|
127
144
|
|
|
128
|
-
/*
|
|
145
|
+
/*
|
|
146
|
+
* The close control sits exactly where the menu Button was, never shrunk;
|
|
147
|
+
* in a Navigation Bar's slot NavDrawer measures any inline difference
|
|
148
|
+
* left (a capped header box) and shifts it onto the Button.
|
|
149
|
+
*/
|
|
129
150
|
.close {
|
|
151
|
+
flex: none;
|
|
130
152
|
margin-inline-start: auto;
|
|
153
|
+
translate: var(--nav-drawer-close-shift, 0px) 0;
|
|
131
154
|
}
|
|
132
155
|
|
|
133
156
|
/* ── The list ──────────────────────────────────────────────────────── */
|
|
@@ -137,6 +160,13 @@
|
|
|
137
160
|
display: block;
|
|
138
161
|
}
|
|
139
162
|
|
|
163
|
+
/* A passed-in navigation (the docs sidebar): the page margins round it. */
|
|
164
|
+
.navHost {
|
|
165
|
+
display: block;
|
|
166
|
+
padding-block: var(--size-px-3) var(--size-px-5);
|
|
167
|
+
padding-inline: var(--fgd-space-margin);
|
|
168
|
+
}
|
|
169
|
+
|
|
140
170
|
.list,
|
|
141
171
|
.childList,
|
|
142
172
|
.footerList {
|
|
@@ -153,11 +183,11 @@
|
|
|
153
183
|
.item:not(:first-child)::before {
|
|
154
184
|
content: '';
|
|
155
185
|
display: block;
|
|
156
|
-
margin-inline: var(--
|
|
186
|
+
margin-inline: var(--fgd-space-margin);
|
|
157
187
|
border-block-start: var(--border-size-1) solid var(--role-hairline);
|
|
158
188
|
}
|
|
159
189
|
|
|
160
|
-
/* Group rows and direct links: the display serif at a --
|
|
190
|
+
/* Group rows and direct links: the display serif at a --fgd-size-control-xl pitch [D60]. */
|
|
161
191
|
.groupRow,
|
|
162
192
|
.directLink {
|
|
163
193
|
position: relative;
|
|
@@ -166,10 +196,10 @@
|
|
|
166
196
|
gap: var(--size-px-3);
|
|
167
197
|
box-sizing: border-box;
|
|
168
198
|
inline-size: 100%;
|
|
169
|
-
min-block-size: var(--
|
|
199
|
+
min-block-size: var(--fgd-size-control-xl);
|
|
170
200
|
margin: 0;
|
|
171
201
|
padding-block: 0;
|
|
172
|
-
padding-inline: var(--
|
|
202
|
+
padding-inline: var(--fgd-space-margin);
|
|
173
203
|
border: 0;
|
|
174
204
|
background: none;
|
|
175
205
|
color: var(--primary12);
|
|
@@ -202,7 +232,7 @@
|
|
|
202
232
|
text-underline-offset: var(--size-px-1);
|
|
203
233
|
}
|
|
204
234
|
|
|
205
|
-
/* The D109 glyph, right-aligned at the header's icon tier (20 px at --
|
|
235
|
+
/* The D109 glyph, right-aligned at the header's icon tier (20 px at --border-size-1-5). */
|
|
206
236
|
.glyph {
|
|
207
237
|
flex: none;
|
|
208
238
|
}
|
|
@@ -216,8 +246,8 @@
|
|
|
216
246
|
|
|
217
247
|
/* Child links sit on a --border-size-1 --role-hairline indent guide, --size-px-5 in. */
|
|
218
248
|
.childList {
|
|
219
|
-
margin-inline-start: calc(var(--
|
|
220
|
-
margin-inline-end: var(--
|
|
249
|
+
margin-inline-start: calc(var(--fgd-space-margin) + var(--size-px-5));
|
|
250
|
+
margin-inline-end: var(--fgd-space-margin);
|
|
221
251
|
margin-block-end: var(--size-px-5);
|
|
222
252
|
border-inline-start: var(--border-size-1) solid var(--role-hairline);
|
|
223
253
|
}
|
|
@@ -232,7 +262,7 @@
|
|
|
232
262
|
display: flex;
|
|
233
263
|
align-items: center;
|
|
234
264
|
box-sizing: border-box;
|
|
235
|
-
min-block-size: var(--
|
|
265
|
+
min-block-size: var(--fgd-size-hit);
|
|
236
266
|
padding-inline: var(--size-px-3);
|
|
237
267
|
color: var(--primary12);
|
|
238
268
|
text-decoration-line: none;
|
|
@@ -250,9 +280,9 @@
|
|
|
250
280
|
display: flex;
|
|
251
281
|
flex-direction: column;
|
|
252
282
|
align-items: flex-start;
|
|
253
|
-
gap: var(--
|
|
283
|
+
gap: var(--size-px-2-5);
|
|
254
284
|
padding-block: var(--size-px-3);
|
|
255
|
-
padding-inline: var(--
|
|
285
|
+
padding-inline: var(--fgd-space-margin);
|
|
256
286
|
border-block-start: var(--border-size-2) solid var(--role-rule);
|
|
257
287
|
}
|
|
258
288
|
|
|
@@ -269,25 +299,25 @@
|
|
|
269
299
|
position: relative;
|
|
270
300
|
display: flex;
|
|
271
301
|
align-items: center;
|
|
272
|
-
min-block-size: var(--
|
|
302
|
+
min-block-size: var(--fgd-size-hit);
|
|
273
303
|
color: var(--primary12);
|
|
274
304
|
text-decoration-line: none;
|
|
275
305
|
}
|
|
276
306
|
|
|
277
|
-
/* Hover transitions [D181]: color only, --
|
|
307
|
+
/* Hover transitions [D181]: color only, --fgd-duration-quick. */
|
|
278
308
|
@media (prefers-reduced-motion: no-preference) {
|
|
279
309
|
.menuLabel,
|
|
280
310
|
.closeLabel,
|
|
281
311
|
.rowLabel,
|
|
282
312
|
.linkLabel {
|
|
283
313
|
transition-property: color, text-decoration-color;
|
|
284
|
-
transition-duration: var(--
|
|
314
|
+
transition-duration: var(--fgd-duration-quick);
|
|
285
315
|
transition-timing-function: var(--ease-out-3);
|
|
286
316
|
}
|
|
287
317
|
|
|
288
318
|
.panel {
|
|
289
319
|
transition-property: block-size;
|
|
290
|
-
transition-duration: var(--
|
|
320
|
+
transition-duration: var(--fgd-duration-disclosure);
|
|
291
321
|
transition-timing-function: var(--ease-out-3);
|
|
292
322
|
}
|
|
293
323
|
}
|
|
@@ -297,11 +327,9 @@
|
|
|
297
327
|
/*
|
|
298
328
|
* The sheet. Written in the variants layer so it outranks the composed
|
|
299
329
|
* Ground's own base-layer display. Base: full screen, opaque, no border
|
|
300
|
-
* [D24 → D121]
|
|
330
|
+
* [D24 → D121].
|
|
301
331
|
*/
|
|
302
332
|
.base {
|
|
303
|
-
--nav-drawer-clip-from: inset(0 0 100% 0);
|
|
304
|
-
|
|
305
333
|
position: fixed;
|
|
306
334
|
inset: 0;
|
|
307
335
|
z-index: var(--layer-4);
|
|
@@ -309,29 +337,16 @@
|
|
|
309
337
|
flex-direction: column;
|
|
310
338
|
box-sizing: border-box;
|
|
311
339
|
margin: 0;
|
|
312
|
-
|
|
340
|
+
/* The band's seams would lie on the viewport's edges: a sheet has none there. */
|
|
341
|
+
border-block-width: 0;
|
|
313
342
|
}
|
|
314
343
|
|
|
315
|
-
/* From --md-n-above: a --size-sm side sheet docked at the trigger's (end) edge, --
|
|
344
|
+
/* From --md-n-above: a --size-sm side sheet docked at the trigger's (end) edge, --border-size-2-25 inner edge [D92]. */
|
|
316
345
|
@media (min-width: 768px) {
|
|
317
346
|
.base {
|
|
318
|
-
--nav-drawer-clip-from: inset(0 0 0 100%);
|
|
319
|
-
|
|
320
347
|
inset-inline-start: auto;
|
|
321
348
|
inline-size: min(var(--size-sm), 100%);
|
|
322
|
-
border-inline-start: var(--
|
|
323
|
-
}
|
|
324
|
-
|
|
325
|
-
.base:dir(rtl) {
|
|
326
|
-
--nav-drawer-clip-from: inset(0 100% 0 0);
|
|
327
|
-
}
|
|
328
|
-
}
|
|
329
|
-
|
|
330
|
-
@media (prefers-reduced-motion: no-preference) {
|
|
331
|
-
.base {
|
|
332
|
-
transition-property: clip-path;
|
|
333
|
-
transition-duration: var(--ds-duration-disclosure);
|
|
334
|
-
transition-timing-function: var(--ease-out-3);
|
|
349
|
+
border-inline-start: var(--border-size-2-25) solid var(--primary12);
|
|
335
350
|
}
|
|
336
351
|
}
|
|
337
352
|
}
|
|
@@ -356,7 +371,7 @@
|
|
|
356
371
|
.menuTrigger:hover .menuLabel,
|
|
357
372
|
.close:hover .closeLabel {
|
|
358
373
|
color: var(--role-link-hover);
|
|
359
|
-
text-decoration-line: var(--
|
|
374
|
+
text-decoration-line: var(--fgd-link-hover-line);
|
|
360
375
|
}
|
|
361
376
|
|
|
362
377
|
/* Pressed: the inverse pair (§9.2). */
|
|
@@ -399,11 +414,11 @@
|
|
|
399
414
|
outline-offset: calc(-1 * var(--border-size-2));
|
|
400
415
|
}
|
|
401
416
|
|
|
402
|
-
/* Current: the --
|
|
417
|
+
/* Current: the --border-size-2-25 start-edge bar; links also take weight 700 [D15]. */
|
|
403
418
|
.groupRow[aria-current='true']::before,
|
|
404
419
|
.directLink[aria-current='page']::before,
|
|
405
420
|
.childLink[aria-current='page']::before {
|
|
406
|
-
border-inline-start-width: var(--
|
|
421
|
+
border-inline-start-width: var(--border-size-2-25);
|
|
407
422
|
}
|
|
408
423
|
|
|
409
424
|
.childLink[aria-current='page'],
|
|
@@ -423,9 +438,17 @@
|
|
|
423
438
|
block-size: 0;
|
|
424
439
|
}
|
|
425
440
|
|
|
426
|
-
/*
|
|
427
|
-
|
|
428
|
-
|
|
441
|
+
/*
|
|
442
|
+
* While the outline morph draws the edge (§9.17) [D206], the side sheet's
|
|
443
|
+
* inner edge takes the ground and its transitions stay off. The frame
|
|
444
|
+
* lands on that 3 px edge (stepping once from the ring's 2 px) and one
|
|
445
|
+
* weight past the viewport on the three sides the sheet has no edge; on
|
|
446
|
+
* the full sheet, past all four. The band's seams keep their color: the
|
|
447
|
+
* clip reveals them as the frame passes the viewport's edge.
|
|
448
|
+
*/
|
|
449
|
+
.base[data-outline-morph] {
|
|
450
|
+
border-inline-start-color: var(--role-ground);
|
|
451
|
+
transition: none;
|
|
429
452
|
}
|
|
430
453
|
|
|
431
454
|
/* Focus parked on the sheet itself (opened by touch): the ring sits inside. */
|
|
@@ -6,6 +6,7 @@ export declare const navigationBar: (props?: ({
|
|
|
6
6
|
masthead?: boolean | null | undefined;
|
|
7
7
|
ruled?: boolean | null | undefined;
|
|
8
8
|
compact?: boolean | null | undefined;
|
|
9
|
+
wide?: boolean | null | undefined;
|
|
9
10
|
primary?: "ruby" | "brown" | "crimson" | "gold" | "gray" | "indigo" | "olive" | "pink" | "plum" | "purple" | "red" | "tomato" | "violet" | "bronze" | "iris" | "mauve" | "sage" | "sand" | "slate" | null | undefined;
|
|
10
11
|
secondary?: "ruby" | "blue" | "brown" | "crimson" | "cyan" | "gold" | "gray" | "green" | "indigo" | "lime" | "olive" | "orange" | "pink" | "plum" | "purple" | "red" | "teal" | "tomato" | "violet" | "yellow" | "amber" | "bronze" | "grass" | "iris" | "jade" | "mauve" | "mint" | "sage" | "sand" | "sky" | "slate" | null | undefined;
|
|
11
12
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -22,6 +23,8 @@ export interface NavigationBarContextValue {
|
|
|
22
23
|
logoLabel?: string;
|
|
23
24
|
/** The current page's URL path. */
|
|
24
25
|
currentPath?: string;
|
|
26
|
+
/** Builds the home link; the drawer's bar repeats it. */
|
|
27
|
+
renderLink?: (href: string) => React.ReactElement;
|
|
25
28
|
}
|
|
26
29
|
/** Provided by NavigationBar; read by NavDrawer and the utility links. */
|
|
27
30
|
export declare const NavigationBarContext: React.Context<NavigationBarContextValue | null>;
|
|
@@ -49,27 +52,38 @@ export type NavigationBarProps = Omit<React.ComponentProps<'header'>, 'children'
|
|
|
49
52
|
primary?: NavigationBarVariants['primary'];
|
|
50
53
|
/** Override the preset's secondary. Never defaulted. */
|
|
51
54
|
secondary?: NavigationBarVariants['secondary'];
|
|
52
|
-
/**
|
|
55
|
+
/**
|
|
56
|
+
* The logo: an ink logo in `currentColor` (an `svg` or `img`), 28 px tall, 36 px from --lg-n-above.
|
|
57
|
+
* On a narrow bar it gives way (clipped in its 44 px target); a lockup drops its wordmark.
|
|
58
|
+
*/
|
|
53
59
|
logo: React.ReactNode;
|
|
54
60
|
/** The home link's accessible name, e.g. "FairGarden home". */
|
|
55
61
|
logoLabel: string;
|
|
56
62
|
/** The home link. Default "/". */
|
|
57
63
|
logoHref?: string;
|
|
58
|
-
/**
|
|
64
|
+
/**
|
|
65
|
+
* Builds the home link, e.g. `(href) => <NextLink href={href} />`; the
|
|
66
|
+
* drawer's bar repeats it. Default: a plain `<a href>`.
|
|
67
|
+
*/
|
|
68
|
+
renderLink?: (href: string) => React.ReactElement;
|
|
69
|
+
/** An optional fine-line brand drawing (--border-size-0-75) beside the logo; dropped when compact. */
|
|
59
70
|
brandDrawing?: React.ReactNode;
|
|
60
|
-
/** A `NavigationBarUtility` row above the bar, from --
|
|
71
|
+
/** A `NavigationBarUtility` row above the bar, from --fgd-nav-inline-n-above; never docks. */
|
|
61
72
|
utility?: React.ReactNode;
|
|
62
|
-
/** The `NavigationMenu`, inline from --
|
|
73
|
+
/** The `NavigationMenu`, inline from --fgd-nav-inline-n-above. */
|
|
63
74
|
children?: React.ReactNode;
|
|
64
75
|
/** Icon Buttons, e.g. `<Search kind="trigger" … />`, `--size-px-1` apart. */
|
|
65
76
|
search?: React.ReactNode;
|
|
66
|
-
/** The one primary action: a `solid` Button at `size="sm"`. Below
|
|
77
|
+
/** The one primary action: a `solid` Button at `size="sm"`. Below --md-n-above (768 px) it moves to the drawer footer, so repeat it there. */
|
|
67
78
|
action?: React.ReactNode;
|
|
68
|
-
/** The `NavDrawer` (menu Button and sheet), shown below --
|
|
79
|
+
/** The `NavDrawer` (menu Button and sheet), shown below --fgd-nav-inline-n-above. */
|
|
69
80
|
drawer?: React.ReactNode;
|
|
70
81
|
/** The current page's URL path, shared with the menu, drawer and utility links. */
|
|
71
82
|
currentPath?: string;
|
|
72
|
-
/**
|
|
83
|
+
/**
|
|
84
|
+
* The skip link's target. Default "#main". Inside the docs layout, which
|
|
85
|
+
* renders the page's skip link itself, the bar renders none.
|
|
86
|
+
*/
|
|
73
87
|
skipHref?: string;
|
|
74
88
|
/** The skip link's words. Default "Skip to main content". */
|
|
75
89
|
skipLabel?: string;
|
|
@@ -79,6 +93,12 @@ export type NavigationBarProps = Omit<React.ComponentProps<'header'>, 'children'
|
|
|
79
93
|
ruled?: NavigationBarVariants['ruled'];
|
|
80
94
|
/** `true`: the compact header, even undocked. The sticky observer sets it while docked. Default `false`. */
|
|
81
95
|
compact?: NavigationBarVariants['compact'];
|
|
96
|
+
/**
|
|
97
|
+
* `true`: the bar's content box, and the utility row's, run to
|
|
98
|
+
* `--fgd-container-wide` rather than `--fgd-container-content`, aligned
|
|
99
|
+
* with a wide page frame: the docs layout's columns [D202]. Default `false`.
|
|
100
|
+
*/
|
|
101
|
+
wide?: NavigationBarVariants['wide'];
|
|
82
102
|
/** How the header docks. Default `none`. */
|
|
83
103
|
dock?: NavigationBarDock;
|
|
84
104
|
/** With `dock="swap"`: a zero-height element at the section bar's in-flow position. */
|
|
@@ -89,7 +109,7 @@ export type NavigationBarProps = Omit<React.ComponentProps<'header'>, 'children'
|
|
|
89
109
|
/**
|
|
90
110
|
* The site header: a skip link first, the green brand strip, an optional
|
|
91
111
|
* utility row, then the bar holding the logo (a home link), the Navigation
|
|
92
|
-
* Menu (from --
|
|
112
|
+
* Menu (from --fgd-nav-inline-n-above), icon Buttons, the one action and,
|
|
93
113
|
* below the threshold, the drawer's menu Button. It is opaque, ruled at the
|
|
94
114
|
* bottom in --role-rule, 56 px tall (64 px from --lg-n-above), and its
|
|
95
115
|
* items never wrap: overflow goes to the utility row, then a "More" item
|
|
@@ -110,8 +130,8 @@ export type NavigationBarUtilityProps = Omit<React.ComponentProps<'nav'>, 'child
|
|
|
110
130
|
/**
|
|
111
131
|
* The 36 px utility row above the bar (§11.3): secondary destinations as
|
|
112
132
|
* text links in a `nav` labelled "Utility", divided from the bar by a
|
|
113
|
-
* --role-hairline rule, aligned to --
|
|
114
|
-
* --
|
|
133
|
+
* --role-hairline rule, aligned to --fgd-container-content. Shown from
|
|
134
|
+
* --fgd-nav-inline-n-above (below it, repeat its links in the drawer
|
|
115
135
|
* footer); the compact docked header drops it [D183]. Put it in the bar's
|
|
116
136
|
* `utility` slot.
|
|
117
137
|
*/
|
|
@@ -122,7 +142,7 @@ export type NavigationBarUtilityLinkProps = React.ComponentProps<'a'>;
|
|
|
122
142
|
* A utility link: `type-label` caps, no rest underline, the bare-text
|
|
123
143
|
* underline on hover [D181], a 24 px target at a 24 px pitch (the §1.5.12
|
|
124
144
|
* utility exemption). The current page (its path equals the bar's
|
|
125
|
-
* `currentPath`) takes `aria-current="page"` and the --
|
|
145
|
+
* `currentPath`) takes `aria-current="page"` and the --border-size-2-25 bar.
|
|
126
146
|
*/
|
|
127
147
|
export declare function NavigationBarUtilityLink(props: NavigationBarUtilityLinkProps): React.JSX.Element;
|
|
128
148
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavigationBar.d.ts","sourceRoot":"","sources":["../../src/navigation/navigation-bar/NavigationBar.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"NavigationBar.d.ts","sourceRoot":"","sources":["../../src/navigation/navigation-bar/NavigationBar.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import * as React from 'react';
|
|
3
|
+
import { useRender } from '@base-ui/react/use-render';
|
|
3
4
|
import { cva } from 'class-variance-authority';
|
|
4
5
|
import { Ground } from '../../foundations/ground';
|
|
5
6
|
import { NavigationMenuFrameContext, isCurrentPath, } from '../navigation-menu';
|
|
6
7
|
import { cx } from '../../utils/className';
|
|
8
|
+
import { SkipLinkContext } from '../../utils/frame';
|
|
7
9
|
import { primaryScaleVariants, secondaryScaleVariants, } from '../../utils/scales';
|
|
8
10
|
import { isBandPreset, useScope } from '../../utils/scope';
|
|
9
11
|
import styles from './navigation-bar.module.css';
|
|
@@ -17,17 +19,20 @@ import styles from './navigation-bar.module.css';
|
|
|
17
19
|
* --border-size-2 top rule); `ruled` → `ruled` (vertical --border-size-1
|
|
18
20
|
* rules between items); `compact` → `compact` (the docked header: brand
|
|
19
21
|
* drawing and utility row dropped; triggers, search and action kept, at
|
|
20
|
-
* the same height) [D183]; `
|
|
21
|
-
*
|
|
22
|
+
* the same height) [D183]; `wide` → `wide` (the content box runs to
|
|
23
|
+
* --fgd-container-wide, for a wide page frame such as the docs layout
|
|
24
|
+
* [D202]); `primary`, `secondary` → scales module classes, applied
|
|
25
|
+
* through the header's Ground.
|
|
22
26
|
* - Compound variants: none.
|
|
23
|
-
* - Defaults: masthead false, ruled false, compact false; color
|
|
27
|
+
* - Defaults: masthead false, ruled false, compact false, wide false; color
|
|
28
|
+
* axes none.
|
|
24
29
|
* - Color fallback: inherits the scope; the action is the §9.2 `solid`
|
|
25
30
|
* Button on the scope's action scale; the strip passes secondary green.
|
|
26
31
|
* - States: item states are the Navigation Menu's (§9.6); `data-docked`
|
|
27
32
|
* (written by the sticky observer) → the frame fixed at the top edge on
|
|
28
|
-
* --layer-2, swapped in by a --
|
|
33
|
+
* --layer-2, swapped in by a --fgd-duration-quick clip cut; utility links
|
|
29
34
|
* `:hover` → the bare-text underline [D181], `aria-current="page"` → the
|
|
30
|
-
* --
|
|
35
|
+
* --border-size-2-25 bar; `:focus-visible` → the ring.
|
|
31
36
|
* - Parts: base, frame, skipLink, strip, utility (utilityInner, slot,
|
|
32
37
|
* utilityNav, utilityList, utilityLink, utilityLabel, locale), bar,
|
|
33
38
|
* inner, logo, logoMark, brandDrawing, nav, tools, iconButtons, action,
|
|
@@ -37,7 +42,9 @@ import styles from './navigation-bar.module.css';
|
|
|
37
42
|
* only over the night media hero) [D178]. Panels are portaled `white`
|
|
38
43
|
* scopes (§9.6).
|
|
39
44
|
* - Container: none; page frame on the viewport custom media
|
|
40
|
-
* --
|
|
45
|
+
* --fgd-nav-inline-n-above [D183], with the action from --md-n-above.
|
|
46
|
+
* Below the threshold the logo is the bar's one flexible item (the base
|
|
47
|
+
* fit), so the bar never overflows.
|
|
41
48
|
*/
|
|
42
49
|
export const navigationBar = cva(styles.base, {
|
|
43
50
|
variants: {
|
|
@@ -50,6 +57,9 @@ export const navigationBar = cva(styles.base, {
|
|
|
50
57
|
compact: {
|
|
51
58
|
true: styles.compact,
|
|
52
59
|
},
|
|
60
|
+
wide: {
|
|
61
|
+
true: styles.wide,
|
|
62
|
+
},
|
|
53
63
|
// Color axes: never defaulted [D133]; the header's Ground applies them.
|
|
54
64
|
primary: primaryScaleVariants,
|
|
55
65
|
secondary: secondaryScaleVariants,
|
|
@@ -58,6 +68,7 @@ export const navigationBar = cva(styles.base, {
|
|
|
58
68
|
masthead: false,
|
|
59
69
|
ruled: false,
|
|
60
70
|
compact: false,
|
|
71
|
+
wide: false,
|
|
61
72
|
},
|
|
62
73
|
});
|
|
63
74
|
/** Provided by NavigationBar; read by NavDrawer and the utility links. */
|
|
@@ -66,16 +77,17 @@ NavigationBarContext.displayName = 'NavigationBarContext';
|
|
|
66
77
|
/**
|
|
67
78
|
* The site header: a skip link first, the green brand strip, an optional
|
|
68
79
|
* utility row, then the bar holding the logo (a home link), the Navigation
|
|
69
|
-
* Menu (from --
|
|
80
|
+
* Menu (from --fgd-nav-inline-n-above), icon Buttons, the one action and,
|
|
70
81
|
* below the threshold, the drawer's menu Button. It is opaque, ruled at the
|
|
71
82
|
* bottom in --role-rule, 56 px tall (64 px from --lg-n-above), and its
|
|
72
83
|
* items never wrap: overflow goes to the utility row, then a "More" item
|
|
73
84
|
* [D183]. It prints as the §7.8 masthead's logo only.
|
|
74
85
|
*/
|
|
75
86
|
export function NavigationBar(props) {
|
|
76
|
-
const { preset: presetProp, primary, secondary, logo, logoLabel, logoHref = '/', brandDrawing, utility, children, search, action, drawer, currentPath, skipHref = '#main', skipLabel = 'Skip to main content', masthead, ruled, compact, dock = 'none', sentinelRef, onDockChange, className, style, ref, ...rest } = props;
|
|
87
|
+
const { preset: presetProp, primary, secondary, logo, logoLabel, logoHref = '/', renderLink, brandDrawing, utility, children, search, action, drawer, currentPath, skipHref = '#main', skipLabel = 'Skip to main content', masthead, ruled, compact, wide, dock = 'none', sentinelRef, onDockChange, className, style, ref, ...rest } = props;
|
|
77
88
|
const scope = useScope();
|
|
78
89
|
const preset = presetProp ?? (isBandPreset(scope.ground) ? scope.ground : 'paper');
|
|
90
|
+
const frameSkipLink = React.useContext(SkipLinkContext);
|
|
79
91
|
const rootRef = React.useRef(null);
|
|
80
92
|
const frameRef = React.useRef(null);
|
|
81
93
|
const barRef = React.useRef(null);
|
|
@@ -162,7 +174,20 @@ export function NavigationBar(props) {
|
|
|
162
174
|
logoHref,
|
|
163
175
|
logoLabel,
|
|
164
176
|
currentPath,
|
|
165
|
-
|
|
177
|
+
renderLink,
|
|
178
|
+
}), [preset, primary, secondary, logo, logoHref, logoLabel, currentPath, renderLink]);
|
|
179
|
+
const logoLink = useRender({
|
|
180
|
+
render: renderLink?.(logoHref),
|
|
181
|
+
defaultTagName: 'a',
|
|
182
|
+
props: {
|
|
183
|
+
className: styles.logo,
|
|
184
|
+
href: logoHref,
|
|
185
|
+
'aria-label': logoLabel,
|
|
186
|
+
children: (React.createElement(React.Fragment, null,
|
|
187
|
+
React.createElement("span", { className: styles.logoMark }, logo),
|
|
188
|
+
brandDrawing != null ? (React.createElement("span", { className: styles.brandDrawing, "aria-hidden": "true" }, brandDrawing)) : null)),
|
|
189
|
+
},
|
|
190
|
+
});
|
|
166
191
|
const setRootRef = React.useCallback((node) => {
|
|
167
192
|
rootRef.current = node;
|
|
168
193
|
if (typeof ref === 'function')
|
|
@@ -175,16 +200,14 @@ export function NavigationBar(props) {
|
|
|
175
200
|
: style;
|
|
176
201
|
return (React.createElement(NavigationBarContext.Provider, { value: barContext },
|
|
177
202
|
React.createElement(NavigationMenuFrameContext.Provider, { value: frame },
|
|
178
|
-
React.createElement(Ground, { ...rest, kind: "band", preset: preset, primary: primary ?? undefined, secondary: secondary ?? undefined, render: React.createElement("header", null), ref: setRootRef, style: rootStyle, "data-docked": docked ? '' : undefined, className: navigationBar({ masthead, ruled, compact: compact || docked, className }) },
|
|
203
|
+
React.createElement(Ground, { ...rest, kind: "band", preset: preset, primary: primary ?? undefined, secondary: secondary ?? undefined, render: React.createElement("header", null), ref: setRootRef, style: rootStyle, "data-docked": docked ? '' : undefined, className: navigationBar({ masthead, ruled, compact: compact || docked, wide, className }) },
|
|
179
204
|
React.createElement("div", { ref: frameRef, className: styles.frame },
|
|
180
|
-
React.createElement("a", { className: styles.skipLink, href: skipHref }, skipLabel),
|
|
205
|
+
frameSkipLink ? null : (React.createElement("a", { className: styles.skipLink, href: skipHref }, skipLabel)),
|
|
181
206
|
React.createElement("div", { className: cx(styles.strip, secondaryScaleVariants.green), "aria-hidden": "true" }),
|
|
182
207
|
utility,
|
|
183
208
|
React.createElement("div", { ref: barRef, className: styles.bar },
|
|
184
209
|
React.createElement("div", { ref: innerRef, className: styles.inner },
|
|
185
|
-
|
|
186
|
-
React.createElement("span", { className: styles.logoMark }, logo),
|
|
187
|
-
brandDrawing != null ? (React.createElement("span", { className: styles.brandDrawing, "aria-hidden": "true" }, brandDrawing)) : null),
|
|
210
|
+
logoLink,
|
|
188
211
|
children != null ? React.createElement("div", { className: styles.nav }, children) : null,
|
|
189
212
|
React.createElement("div", { className: styles.tools },
|
|
190
213
|
search != null ? React.createElement("div", { className: styles.iconButtons }, search) : null,
|
|
@@ -194,8 +217,8 @@ export function NavigationBar(props) {
|
|
|
194
217
|
/**
|
|
195
218
|
* The 36 px utility row above the bar (§11.3): secondary destinations as
|
|
196
219
|
* text links in a `nav` labelled "Utility", divided from the bar by a
|
|
197
|
-
* --role-hairline rule, aligned to --
|
|
198
|
-
* --
|
|
220
|
+
* --role-hairline rule, aligned to --fgd-container-content. Shown from
|
|
221
|
+
* --fgd-nav-inline-n-above (below it, repeat its links in the drawer
|
|
199
222
|
* footer); the compact docked header drops it [D183]. Put it in the bar's
|
|
200
223
|
* `utility` slot.
|
|
201
224
|
*/
|
|
@@ -212,7 +235,7 @@ export function NavigationBarUtility(props) {
|
|
|
212
235
|
* A utility link: `type-label` caps, no rest underline, the bare-text
|
|
213
236
|
* underline on hover [D181], a 24 px target at a 24 px pitch (the §1.5.12
|
|
214
237
|
* utility exemption). The current page (its path equals the bar's
|
|
215
|
-
* `currentPath`) takes `aria-current="page"` and the --
|
|
238
|
+
* `currentPath`) takes `aria-current="page"` and the --border-size-2-25 bar.
|
|
216
239
|
*/
|
|
217
240
|
export function NavigationBarUtilityLink(props) {
|
|
218
241
|
const { href, className, children, ...rest } = props;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavigationBar.js","sourceRoot":"","sources":["../../src/navigation/navigation-bar/NavigationBar.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAEZ,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAA;AAEjE,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAA;AACjD,OAAO,EACL,0BAA0B,EAC1B,aAAa,GAEd,MAAM,oBAAoB,CAAA;AAC3B,OAAO,EAAE,EAAE,EAAE,MAAM,uBAAuB,CAAA;AAC1C,OAAO,EACL,oBAAoB,EACpB,sBAAsB,GAGvB,MAAM,oBAAoB,CAAA;AAC3B,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAmB,MAAM,mBAAmB,CAAA;AAC3E,OAAO,MAAM,MAAM,6BAA6B,CAAA;AAEhD
|
|
1
|
+
{"version":3,"file":"NavigationBar.js","sourceRoot":"","sources":["../../src/navigation/navigation-bar/NavigationBar.tsx"],"names":[],"mappings":"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"}
|