@mkbabb/glass-ui 5.0.0 → 6.0.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/README.md +30 -27
- package/dist/DropdownMenuTrigger-BzQtd9lt.js +65 -0
- package/dist/{FadingScroll-BSRLqQCx.js → FadingScroll-C1ZWEjmG.js} +32 -25
- package/dist/{Input-DKf-XwUM.js → Input-B4WQ_CMc.js} +1 -1
- package/dist/{PagerDots-BP6jh7z4.js → PagerDots-BoTQ7g5l.js} +123 -95
- package/dist/{accent-tone-solve-CBw3L0cy.js → accent-tone-solve-Dii9ePhK.js} +1 -1
- package/dist/animated-digit.js +1 -1
- package/dist/aurora.js +324 -314
- package/dist/blob-config.d.ts +0 -4
- package/dist/blob-config.js +1 -1
- package/dist/blob.js +280 -261
- package/dist/{button-BXzhydVB.js → button-32mg6xA8.js} +63 -56
- package/dist/button.js +1 -1
- package/dist/canvas.js +1 -1
- package/dist/{CardAction-2uUvjMQK.js → card-16xmzIr3.js} +29 -11
- package/dist/card.js +1 -1
- package/dist/carousel.d.ts +1 -2
- package/dist/carousel.js +26 -95
- package/dist/chip.d.ts +0 -9
- package/dist/chip.js +1 -1
- package/dist/collapsible.js +1 -1
- package/dist/color-swatch.js +1 -0
- package/dist/color.js +87 -3
- package/dist/{CommandShortcut-fmdbsEJL.js → command-BjPjUU9z.js} +56 -51
- package/dist/command.js +1 -1
- package/dist/completion-seal.js +64 -55
- package/dist/components/_shared/ModalOverlay.vue.d.ts +5 -52
- package/dist/components/_shared/field-surfaces.css +1 -0
- package/dist/components/_shared/menuItemVariants.d.ts +2 -2
- package/dist/components/_shared/useMotionAxis.d.ts +2 -2
- package/dist/components/_shared/valueDomain.d.ts +6 -0
- package/dist/components/alert/index.d.ts +1 -1
- package/dist/components/animated-digit/AnimatedDigit.vue.d.ts +1 -1
- package/dist/components/aurora/Aurora.vue.d.ts +7 -1
- package/dist/components/aurora/composables/runtime.d.ts +5 -3
- package/dist/components/aurora/composables/useAurora.d.ts +4 -2
- package/dist/components/avatar/AvatarImage.vue.d.ts +3 -1
- package/dist/components/badge/index.d.ts +2 -2
- package/dist/components/blob/Blob.vue.d.ts +11 -0
- package/dist/components/blob/composables/useMetaballRenderer.d.ts +2 -0
- package/dist/components/button/Button.vue.d.ts +4 -2
- package/dist/components/button/index.d.ts +2 -2
- package/dist/components/card/Card.vue.d.ts +4 -4
- package/dist/components/card/ScrollCard.vue.d.ts +1 -1
- package/dist/components/card/styles.css +1 -0
- package/dist/components/carousel/Carousel.vue.d.ts +2 -2
- package/dist/components/carousel/CarouselNext.vue.d.ts +1 -1
- package/dist/components/carousel/CarouselPrevious.vue.d.ts +1 -1
- package/dist/components/carousel/index.d.ts +0 -1
- package/dist/components/carousel/useCarousel.d.ts +2 -2
- package/dist/components/combobox/ComboboxList.vue.d.ts +1 -1
- package/dist/components/combobox/index.d.ts +1 -3
- package/dist/components/command/Command.vue.d.ts +1 -1
- package/dist/components/command/CommandDialog.vue.d.ts +9 -6
- package/dist/components/completion-seal/styles.css +1 -0
- package/dist/components/constellation/Constellation.vue.d.ts +6 -1
- package/dist/components/constellation/composables/useConstellation.d.ts +3 -16
- package/dist/components/constellation/constants.d.ts +6 -16
- package/dist/components/constellation/constellationField.d.ts +3 -5
- package/dist/components/constellation/constellationInteraction.d.ts +1 -1
- package/dist/components/constellation/constellationRender.d.ts +11 -21
- package/dist/components/constellation/constellationTypes.d.ts +12 -9
- package/dist/components/constellation/index.d.ts +1 -1
- package/dist/components/controls/DarkModeToggle.vue.d.ts +0 -2
- package/dist/components/data-table/DataTable.vue.d.ts +14 -2
- package/dist/components/data-table/index.d.ts +1 -2
- package/dist/components/data-table/types.d.ts +26 -1
- package/dist/components/deck/constants.d.ts +0 -10
- package/dist/components/deck/index.d.ts +0 -1
- package/dist/components/dialog/DialogContent.vue.d.ts +7 -1
- package/dist/components/dialog/index.d.ts +0 -1
- package/dist/components/dock/DockControl.vue.d.ts +4 -4
- package/dist/components/dock/DockStack.vue.d.ts +2 -2
- package/dist/components/dock/GlassDock.vue.d.ts +1 -0
- package/dist/components/dock/composables/dockMorphContext.d.ts +2 -0
- package/dist/components/dock/composables/dockMorphMeasure.d.ts +11 -1
- package/dist/components/dock/composables/useDockClickIntegrity.d.ts +4 -0
- package/dist/components/dock/composables/useDockOverflowFit.d.ts +3 -3
- package/dist/components/dock/composables/useDockPopover.d.ts +2 -0
- package/dist/components/dock/composables/useDockShellProps.d.ts +7 -0
- package/dist/components/dock/composables/useDockState.d.ts +2 -2
- package/dist/components/dock/constants.d.ts +0 -12
- package/dist/components/dock/index.d.ts +1 -0
- package/dist/components/dock/styles/adaptive-legibility.css +1 -0
- package/dist/components/dock/styles/controls/icon-button.css +1 -0
- package/dist/{styles/dock-controls → components/dock/styles/controls}/touch-floor.css +1 -1
- package/dist/components/dock/styles/controls.css +1 -0
- package/dist/{styles/dock → components/dock/styles}/density.css +1 -1
- package/dist/components/dock/styles/dock.css +1 -0
- package/dist/components/dock/styles/index.css +1 -0
- package/dist/components/dock/styles/layer-group.css +1 -0
- package/dist/components/dock/styles/layers.css +1 -0
- package/dist/components/dock/styles/overflow.css +1 -0
- package/dist/components/dock/styles/popover.css +1 -0
- package/dist/components/dock/styles/shape.css +1 -0
- package/dist/components/dock/styles/shell.css +1 -0
- package/dist/components/drawer/Drawer.vue.d.ts +3 -3
- package/dist/components/drawer/composables/drawerSnapContext.d.ts +3 -1
- package/dist/components/drawer/constants.d.ts +6 -6
- package/dist/components/drawer/index.d.ts +4 -6
- package/dist/components/drawer/styles.css +1 -0
- package/dist/components/dropdown-menu/DropdownMenuContent.vue.d.ts +1 -1
- package/dist/components/dropdown-menu/DropdownMenuTrigger.vue.d.ts +9 -3
- package/dist/components/dropdown-menu/index.d.ts +0 -1
- package/dist/components/easing/EasingConfigurator.vue.d.ts +1 -1
- package/dist/components/easing/EasingPicker.vue.d.ts +2 -2
- package/dist/components/easing/composables/useEasingPicker.d.ts +4 -0
- package/dist/components/easing/constants.d.ts +2 -0
- package/dist/components/fading-scroll/composables/useFadingScroll.d.ts +3 -3
- package/dist/components/fourier-field/FourierField.vue.d.ts +7 -1
- package/dist/components/fourier-field/composables/useFourierField.d.ts +2 -1
- package/dist/components/handmark/HandMark.vue.d.ts +1 -1
- package/dist/components/handmark/geometry.d.ts +1 -1
- package/dist/components/handmark/index.d.ts +4 -6
- package/dist/components/icon-chip/styles.css +1 -0
- package/dist/components/index.d.ts +0 -1
- package/dist/components/infinite-scroll/index.d.ts +1 -0
- package/dist/components/instrument-chassis/styles.css +1 -0
- package/dist/components/labeled-field/LabeledField.vue.d.ts +12 -2
- package/dist/components/labeled-field/LabeledInput.vue.d.ts +10 -3
- package/dist/components/liquid-grid/LiquidGrid.vue.d.ts +4 -0
- package/dist/components/liquid-grid/composables/useLiquidGrid.d.ts +2 -1
- package/dist/components/metric-stack/MetricStack.vue.d.ts +1 -1
- package/dist/components/pager-dots/PagerDots.vue.d.ts +1 -1
- package/dist/components/popover/PopoverContent.vue.d.ts +1 -1
- package/dist/components/progress/Progress.vue.d.ts +5 -40
- package/dist/components/progress/ProgressDefault.vue.d.ts +1 -17
- package/dist/components/progress/ProgressGradient.vue.d.ts +1 -0
- package/dist/components/progress/ProgressLiquid.vue.d.ts +1 -0
- package/dist/components/progress/index.d.ts +0 -5
- package/dist/components/progress/valueMarks.css +1 -0
- package/dist/components/pulse/Pulse.vue.d.ts +2 -2
- package/dist/components/scroll-progress-rim/styles.css +1 -0
- package/dist/components/search/FuzzySearch.vue.d.ts +4 -2
- package/dist/components/search/SearchBar.vue.d.ts +2 -2
- package/dist/components/search/searchVariants.d.ts +1 -1
- package/dist/components/select/SelectContent.vue.d.ts +1 -1
- package/dist/components/select/index.d.ts +0 -2
- package/dist/components/skeleton/Skeleton.vue.d.ts +1 -1
- package/dist/components/slider/Slider.vue.d.ts +2 -0
- package/dist/components/split-chars/SplitChars.vue.d.ts +1 -1
- package/dist/components/surface/Surface.vue.d.ts +1 -1
- package/dist/components/table/Table.vue.d.ts +4 -0
- package/dist/components/tabs/SegmentedTabs.vue.d.ts +10 -0
- package/dist/components/tabs/index.d.ts +1 -1
- package/dist/components/tabs/styles/drag.css +1 -0
- package/dist/components/tags-input/TagsInput.vue.d.ts +2 -2
- package/dist/components/timeline/ContinuousTimeline.vue.d.ts +1 -1
- package/dist/components/timeline/GlassTimeline.vue.d.ts +4 -4
- package/dist/components/toast/Toast.vue.d.ts +3 -3
- package/dist/components/toast/use-toast.d.ts +4 -4
- package/dist/components/typewriter/TypewriterText.vue.d.ts +1 -4
- package/dist/components/typewriter/composables/useTypewriter.d.ts +0 -1
- package/dist/components/typewriter/utils/graphemes.d.ts +1 -0
- package/dist/components/watercolor-dot/WatercolorDot.vue.d.ts +2 -2
- package/dist/composables/glass/useGlassBackdropLuminance.d.ts +31 -0
- package/dist/composables/glass/webgpu/rendererStatus.d.ts +13 -0
- package/dist/composables/glass/webgpu/useGpuSubstrate.d.ts +3 -0
- package/dist/composables/glass/webgpu/webgpuCanvasTypes.d.ts +2 -0
- package/dist/composables/motion/springProjection.d.ts +16 -0
- package/dist/composables/motion/useAnimatedNumber.d.ts +1 -6
- package/dist/composables/motion/useCountup.d.ts +1 -6
- package/dist/composables/motion/useDockCtaReceive.d.ts +55 -0
- package/dist/composables/motion/useElementMorph.d.ts +8 -0
- package/dist/composables/motion/useLiquidPress.d.ts +12 -4
- package/dist/composables/motion/useNumericTransition.d.ts +2 -0
- package/dist/composables/motion/useTextHighlight.d.ts +2 -1
- package/dist/configurator-CSENXXSy.js +311 -0
- package/dist/configurator.js +2 -3
- package/dist/constellation.js +235 -571
- package/dist/controls.js +55 -63
- package/dist/{createCanvasLifecycle-DlrcvWbb.js → createCanvasLifecycle-hsFkQVdl.js} +32 -32
- package/dist/dark-DIH-blY1.js +70 -0
- package/dist/dark.d.ts +1 -2
- package/dist/dark.js +2 -20
- package/dist/{DataTable-Bxya8nBn.js → data-table-DveMdgBM.js} +231 -120
- package/dist/data-table.js +2 -2
- package/dist/deck.js +10 -21
- package/dist/dialog-BzQxKrUr.js +281 -0
- package/dist/dialog.js +2 -3
- package/dist/dock.js +561 -428
- package/dist/{dockContext-d-WpJN2Z.js → dockContext-4S9qP0Z4.js} +1 -1
- package/dist/dom.js +196 -7
- package/dist/drawer.js +111 -66
- package/dist/dropdown-menu-DORIA52F.js +378 -0
- package/dist/dropdown-menu.js +3 -2
- package/dist/easing.d.ts +0 -9
- package/dist/easing.js +334 -187
- package/dist/expandable-container.js +12 -4
- package/dist/fading-scroll.js +1 -1
- package/dist/focus-scope.js +1 -1
- package/dist/forms.js +37 -78
- package/dist/fourier-field.js +273 -263
- package/dist/fourier-math.d.ts +0 -6
- package/dist/fourier-math.js +112 -2
- package/dist/glass-ui.css +1 -1
- package/dist/glass-ui.js +131 -195
- package/dist/handmark.d.ts +0 -2
- package/dist/handmark.js +82 -82
- package/dist/header-ribbon.js +41 -30
- package/dist/{IconChip-CwLmBJ_K.js → icon-chip-BWuxz1-u.js} +1 -1
- package/dist/icon-chip.js +1 -1
- package/dist/{IconTooltip-D9sbK-Mk.js → icon-tooltip-CO6rw0dZ.js} +1 -1
- package/dist/icon-tooltip.js +1 -1
- package/dist/index.d.ts +0 -1
- package/dist/infinite-scroll.d.ts +0 -1
- package/dist/infinite-scroll.js +17 -15
- package/dist/instrument-chassis.js +1 -1
- package/dist/keyboard.js +104 -2
- package/dist/label.js +1 -1
- package/dist/labeled-field.js +95 -69
- package/dist/liquid-grid.js +173 -162
- package/dist/metric-badge.js +3 -3
- package/dist/metric-cell.js +2 -2
- package/dist/metric-stack.js +1 -1
- package/dist/motion-core.js +15 -16
- package/dist/motion-curves.d.ts +0 -20
- package/dist/motion.js +59 -58
- package/dist/{Notification-DQv2cOh9.js → notification-DVs7ODMg.js} +17 -8
- package/dist/notification.js +1 -1
- package/dist/{NumberFieldContent-BkE7xPS9.js → number-field-PvkGedHk.js} +2 -2
- package/dist/number-field.js +1 -1
- package/dist/pager-dots.js +1 -1
- package/dist/paper-backdrop.js +31 -2
- package/dist/{PopoverContent-DOtszFWK.js → popover-WMgyRSyN.js} +7 -2
- package/dist/popover.js +1 -1
- package/dist/procedural-color.wgsl-B9mLK7v0.js +377 -0
- package/dist/progress-C-HHuFZy.js +192 -0
- package/dist/progress.js +2 -2
- package/dist/pulse.js +3 -1
- package/dist/reactive.js +19 -3
- package/dist/rendererStatus-C2-zC2Q-.js +40 -0
- package/dist/{resolveCanvasColor-B3L-akX0.js → resolveCanvasColor-yarP5bdk.js} +1 -1
- package/dist/scroll-progress-rim.js +1 -1
- package/dist/search.js +187 -146
- package/dist/{SelectScrollDownButton-CDtwaWkZ.js → select-BIv4R3Ir.js} +109 -44
- package/dist/select.js +2 -4
- package/dist/separator-CBU94kTM.js +62 -0
- package/dist/separator.js +1 -1
- package/dist/sidebar.js +1 -1
- package/dist/slider-Cc_qw6GA.js +166 -0
- package/dist/slider.js +1 -1
- package/dist/sortable-list.js +43 -43
- package/dist/styles/accessibility.css +1 -0
- package/dist/styles/components.css +1 -1
- package/dist/styles/glass/control-surfaces.css +1 -1
- package/dist/styles/glass/glass-capsule.css +1 -1
- package/dist/styles/glass/ladder.css +1 -1
- package/dist/styles/glass/liquid-fill.css +1 -1
- package/dist/styles/glass/material-roles.css +1 -0
- package/dist/styles/glass/material.css +1 -1
- package/dist/styles/glass/surface-axis.css +1 -1
- package/dist/styles/glass/surfaces-pager.css +1 -1
- package/dist/styles/glass/surfaces.css +1 -1
- package/dist/styles/glass.css +1 -1
- package/dist/styles/index.css +1 -1
- package/dist/styles/theme/bridges.css +1 -1
- package/dist/styles/tokens/glass-fx.css +1 -1
- package/dist/styles/tokens/glass.css +1 -1
- package/dist/styles/tokens/offsets.css +1 -1
- package/dist/styles/tokens/scale-paper.css +1 -1
- package/dist/styles/tokens/scheme-spring.css +1 -1
- package/dist/styles/tokens/shadow.css +1 -1
- package/dist/styles/tokens.d.ts +53 -0
- package/dist/styles/tokens.ts +58 -0
- package/dist/styles/typography/scale.css +1 -1
- package/dist/styles/typography/semantic.css +1 -1
- package/dist/styles/typography/utilities.css +1 -1
- package/dist/styles/utilities/base.css +1 -1
- package/dist/styles/utilities/btn.css +1 -1
- package/dist/styles/utilities/components.css +1 -1
- package/dist/styles/utilities.css +1 -1
- package/dist/{Switch-BPBfhMU3.js → switch-Boj4Ucn5.js} +1 -1
- package/dist/switch.js +1 -1
- package/dist/tabs.js +51 -45
- package/dist/timeline.js +2 -2
- package/dist/toast.js +1 -1
- package/dist/{ToggleGroupItem-DNWx2aSW.js → toggle-group-BPchFsns.js} +10 -7
- package/dist/toggle-group.js +1 -1
- package/dist/tokens.d.ts +1 -53
- package/dist/tokens.js +1 -1
- package/dist/{TooltipProvider-GtfYdSVf.js → tooltip-BmOQJzh0.js} +1 -0
- package/dist/tooltip.js +1 -1
- package/dist/typewriter.js +151 -166
- package/dist/{useAccentTone-D25DxviG.js → useAccentTone-C-p6WdPe.js} +1 -1
- package/dist/{useAnimatedNumber-2XC4aRB6.js → useAnimatedNumber-BRVVaFFc.js} +1 -1
- package/dist/useDockCtaReceive-CK-RLASa.js +257 -0
- package/dist/{useGooMorph-CU1pwuC6.js → useGooMorph-D1F6QJlH.js} +140 -59
- package/dist/{useIntersectionPause-Cmt5Tnv9.js → useIntersectionPause-B-dbxl9w.js} +1 -1
- package/dist/useLiquidPress-BYcwwGQV.js +68 -0
- package/dist/{useRAFLoop-CvOo_kgb.js → useRAFLoop-BtwQ9DyY.js} +1 -1
- package/dist/{useScrollProgress-C-yImzhU.js → useScrollProgress-DZI4nf4v.js} +1 -1
- package/dist/{useSelectionGroup-Btpf24aY.js → useSelectionGroup-LDzBdR1Y.js} +3 -3
- package/dist/{useTabRovingFocus-CG1H1k1J.js → useTabRovingFocus-DkLYwo4L.js} +1 -1
- package/dist/{useTouchGate-BlegwvwL.js → useTouchGate-Cj5fOkTv.js} +1 -1
- package/dist/valueDomain-B8L04u3U.js +13 -0
- package/dist/watercolor-dot.js +5 -3
- package/package.json +5 -12
- package/src/styles/accessibility.css +48 -0
- package/src/styles/glass/glass-capsule.css +2 -2
- package/src/styles/glass/ladder.css +1 -1
- package/src/styles/glass/material-roles.css +18 -0
- package/src/styles/glass/material.css +18 -12
- package/src/styles/glass.css +5 -5
- package/src/styles/index.css +38 -30
- package/src/styles/theme/bridges.css +0 -6
- package/src/styles/tokens/glass-fx.css +1 -5
- package/src/styles/tokens/glass.css +1 -2
- package/src/styles/tokens/offsets.css +0 -1
- package/src/styles/tokens/property-regs.css +11 -10
- package/src/styles/tokens/scale-paper.css +0 -1
- package/src/styles/tokens/scheme-motion.css +3 -0
- package/src/styles/tokens/scheme-spring.css +0 -10
- package/src/styles/tokens/shadow.css +3 -29
- package/src/styles/tokens.ts +58 -0
- package/src/styles/typography/scale.css +5 -2
- package/src/styles/typography/semantic.css +5 -5
- package/src/styles/typography/utilities.css +5 -5
- package/src/styles/utilities/base.css +5 -5
- package/src/styles/utilities/btn.css +6 -27
- package/src/styles/utilities.css +4 -6
- package/dist/ConfiguratorRow-BV6zPjTM.js +0 -151
- package/dist/DialogContent-Bl4v10AC.js +0 -192
- package/dist/DialogFooter-C0v4Hz2F.js +0 -168
- package/dist/PaperBackdrop-BYwE8_kg.js +0 -31
- package/dist/Progress-uWLyXE7J.js +0 -308
- package/dist/SelectGroup-BuEptUsa.js +0 -31
- package/dist/SelectSeparator-4QGephvr.js +0 -49
- package/dist/Separator-DqJ6PfOd.js +0 -44
- package/dist/color-Bp5jmv4Z.js +0 -86
- package/dist/components/carousel/GlassCarouselPager.vue.d.ts +0 -50
- package/dist/components/combobox/ComboboxSeparator.vue.d.ts +0 -18
- package/dist/components/combobox/ComboboxViewport.vue.d.ts +0 -18
- package/dist/components/constellation/composables/constellationGLSetup.d.ts +0 -10
- package/dist/components/constellation/composables/constellationWGPUSetup.d.ts +0 -19
- package/dist/components/constellation/composables/uniformBridgeWGPU.d.ts +0 -66
- package/dist/components/constellation/shaders/constellation-lines.glsl.d.ts +0 -2
- package/dist/components/constellation/shaders/constellation-lines.wgsl.d.ts +0 -1
- package/dist/components/constellation/shaders/constellation-points.glsl.d.ts +0 -2
- package/dist/components/constellation/shaders/constellation-points.wgsl.d.ts +0 -1
- package/dist/components/deck/composables/useDeckSpring.d.ts +0 -22
- package/dist/components/dialog/DialogScrollContent.vue.d.ts +0 -33
- package/dist/components/progress/ProgressSectioned.vue.d.ts +0 -47
- package/dist/components/progress/useProgressGeometry.d.ts +0 -60
- package/dist/components/section/Section.vue.d.ts +0 -73
- package/dist/components/section/index.d.ts +0 -1
- package/dist/components/stacked-icons/StackedIconGroup.vue.d.ts +0 -30
- package/dist/components/stacked-icons/index.d.ts +0 -2
- package/dist/components/stacked-icons/types.d.ts +0 -19
- package/dist/dropdown-menu-DaGlVdp9.js +0 -421
- package/dist/math-CIEcwsYi.js +0 -112
- package/dist/procedural-color.wgsl-ByduxnzV.js +0 -4
- package/dist/slider-Cxuj_W_H.js +0 -151
- package/dist/stacked-icons.d.ts +0 -1
- package/dist/stacked-icons.js +0 -98
- package/dist/styles/cards.css +0 -1
- package/dist/styles/completion-seal.css +0 -1
- package/dist/styles/dock/adaptive-legibility.css +0 -1
- package/dist/styles/dock/dock.css +0 -1
- package/dist/styles/dock/layer-group.css +0 -1
- package/dist/styles/dock/layers.css +0 -1
- package/dist/styles/dock/overflow.css +0 -1
- package/dist/styles/dock/popover.css +0 -1
- package/dist/styles/dock/shape.css +0 -1
- package/dist/styles/dock/shell.css +0 -1
- package/dist/styles/dock-controls/icon-button.css +0 -1
- package/dist/styles/dock-controls.css +0 -1
- package/dist/styles/dock.css +0 -1
- package/dist/styles/drawer.css +0 -1
- package/dist/styles/icon-chip.css +0 -1
- package/dist/styles/instrument-chassis.css +0 -1
- package/dist/styles/scroll-progress-rim.css +0 -1
- package/dist/styles/select.css +0 -1
- package/dist/styles/tabs/segmented-tabs-drag.css +0 -1
- package/dist/styles/utilities/animate.css +0 -0
- package/dist/useConfiguratorState-Dq35N_7t.js +0 -167
- package/dist/useDockCtaReceive-BgMmeINo.js +0 -161
- package/dist/useGlobalDark-DjKMEQE2.js +0 -53
- package/dist/useGpuSubstrate-DcY584kE.js +0 -347
- package/dist/useInterval-ZATRi-1T.js +0 -18
- package/dist/useKeyboardShortcuts-ynVmNFo3.js +0 -104
- package/dist/useLiquidPress-BXNHydZh.js +0 -40
- package/dist/useTextHighlight-C46Le9u_.js +0 -72
- package/dist/useViewportReady-c0isoKL8.js +0 -191
- package/src/styles/card-scroll.css +0 -189
- package/src/styles/cards.css +0 -485
- package/src/styles/completion-seal.css +0 -205
- package/src/styles/configurator.css +0 -359
- package/src/styles/dialog-placement.css +0 -68
- package/src/styles/dock/adaptive-legibility.css +0 -119
- package/src/styles/dock/crossfade.css +0 -139
- package/src/styles/dock/cta-seat.css +0 -87
- package/src/styles/dock/density.css +0 -458
- package/src/styles/dock/dock.css +0 -199
- package/src/styles/dock/fisheye.css +0 -81
- package/src/styles/dock/layer-group.css +0 -329
- package/src/styles/dock/layers.css +0 -438
- package/src/styles/dock/morph.css +0 -455
- package/src/styles/dock/overflow.css +0 -332
- package/src/styles/dock/popover.css +0 -249
- package/src/styles/dock/search.css +0 -68
- package/src/styles/dock/section.css +0 -59
- package/src/styles/dock/shape.css +0 -188
- package/src/styles/dock/shell-regions.css +0 -73
- package/src/styles/dock/shell.css +0 -500
- package/src/styles/dock-controls/dark-mode-toggle.css +0 -123
- package/src/styles/dock-controls/icon-button.css +0 -221
- package/src/styles/dock-controls/tab-button.css +0 -143
- package/src/styles/dock-controls/touch-floor.css +0 -119
- package/src/styles/dock-controls/triggers.css +0 -157
- package/src/styles/dock-controls.css +0 -92
- package/src/styles/dock.css +0 -219
- package/src/styles/drawer.css +0 -434
- package/src/styles/feedback-tone.css +0 -104
- package/src/styles/icon-chip.css +0 -256
- package/src/styles/instrument-chassis.css +0 -449
- package/src/styles/menu.css +0 -187
- package/src/styles/scroll-progress-rim.css +0 -87
- package/src/styles/segmented-tabs.css +0 -424
- package/src/styles/select.css +0 -201
- package/src/styles/tabs/segmented-tabs-drag.css +0 -200
- package/src/styles/utilities/animate.css +0 -29
- /package/dist/{coalesce-metric-B8o7zT9u.js → coalesce-metric-znAcLzkB.js} +0 -0
- /package/dist/{CollapsibleContent-DiHcB_HH.js → collapsible-bPzS1aQk.js} +0 -0
- /package/dist/{compile-C55K3P9g.js → compile-DK3Fri1B.js} +0 -0
- /package/dist/{styles → components/_shared}/feedback-tone.css +0 -0
- /package/dist/{styles → components/_shared}/menu.css +0 -0
- /package/dist/{styles → components/card}/card-scroll.css +0 -0
- /package/dist/{styles/configurator.css → components/configurator/styles.css} +0 -0
- /package/dist/{styles/dock-controls → components/controls}/dark-mode-toggle.css +0 -0
- /package/dist/{styles/dialog-placement.css → components/dialog/placement.css} +0 -0
- /package/dist/{styles/dock-controls → components/dock/styles/controls}/tab-button.css +0 -0
- /package/dist/{styles/dock-controls → components/dock/styles/controls}/triggers.css +0 -0
- /package/dist/{styles/dock → components/dock/styles}/crossfade.css +0 -0
- /package/dist/{styles/dock → components/dock/styles}/cta-seat.css +0 -0
- /package/dist/{styles/dock → components/dock/styles}/fisheye.css +0 -0
- /package/dist/{styles/dock → components/dock/styles}/morph.css +0 -0
- /package/dist/{styles/dock → components/dock/styles}/search.css +0 -0
- /package/dist/{styles/dock → components/dock/styles}/section.css +0 -0
- /package/dist/{styles/dock → components/dock/styles}/shell-regions.css +0 -0
- /package/dist/{styles/segmented-tabs.css → components/tabs/styles/segmented.css} +0 -0
- /package/dist/{constants-D8lSMkOz.js → constants-DRZmNIY-.js} +0 -0
- /package/dist/{createContext-BQ1Gy_LB.js → createContext-FU0n5MGK.js} +0 -0
- /package/dist/{flow.glsl-CVqPSj8_.js → flow.glsl-DEGFGE11.js} +0 -0
- /package/dist/{FocusScope-BzKwhsBn.js → focus-scope-DUTKveod.js} +0 -0
- /package/dist/{InstrumentChassis-Dss5Tjcm.js → instrument-chassis-Cvstg4_U.js} +0 -0
- /package/dist/{Label-C84TaQiw.js → label-Cj38tJKG.js} +0 -0
- /package/dist/{menuItemVariants-DbO-Fr74.js → menuItemVariants-D6AOzzND.js} +0 -0
- /package/dist/{pointerFieldMappings-4VtmkOWv.js → pointerFieldMappings-CZojkgKj.js} +0 -0
- /package/dist/{presets-B07HzyKd.js → presets-CxeNvxuO.js} +0 -0
- /package/dist/{prng-B0PLRmR6.js → prng-Dz2_9RJu.js} +0 -0
- /package/dist/{scrollReader-DzYqPQ6V.js → scrollReader-C2oK9Hb8.js} +0 -0
- /package/dist/{supportsCssTimeline-Ie4xJFbD.js → supportsCssTimeline-Dz-GVxXM.js} +0 -0
- /package/dist/{Toaster-C_-WeU9W.js → toast-kAbchIN2.js} +0 -0
- /package/dist/{useControlSize-DJwe-7ZQ.js → useControlSize-CFfOk8I-.js} +0 -0
- /package/dist/{useDocumentVisibility-CpJGUgcJ.js → useDocumentVisibility-YeBDGqtI.js} +0 -0
- /package/dist/{useDragMorph-65ihHePq.js → useDragMorph-7ygF9O0m.js} +0 -0
- /package/dist/{useDragVelocity-BWcNMCux.js → useDragVelocity-CbMZEBaC.js} +0 -0
- /package/dist/{useFuzzySearch-KslRxiJY.js → useFuzzySearch-BOgep7RE.js} +0 -0
- /package/dist/{useLeadTrail-DOH4XkL1.js → useLeadTrail-BYu8dq4G.js} +0 -0
- /package/dist/{usePointerVelocityField-CwXyeW0Z.js → usePointerVelocityField-BdvnO0py.js} +0 -0
- /package/dist/{useResizeObserver-DDuoBeBo.js → useResizeObserver-BcUTquV7.js} +0 -0
- /package/dist/{useResolveTokenColor-DVT5kwv6.js → useResolveTokenColor-C07e-qaT.js} +0 -0
- /package/dist/{useRoutePointer-DL7I0gY4.js → useRoutePointer-BDNMFN73.js} +0 -0
- /package/dist/{useSpringMount-CNvvgGiC.js → useSpringMount-C6-DBx4e.js} +0 -0
- /package/dist/{useTimer-CkDV8SC2.js → useTimer-D8koDvJS.js} +0 -0
- /package/dist/{useUserInvalidAria-Bkruei7M.js → useUserInvalidAria-Cr4nR3tu.js} +0 -0
- /package/dist/{vReveal-DUmiEkX_.js → vReveal-DZfWl9XI.js} +0 -0
- /package/dist/{vSpecular-DlYN0UZy.js → vSpecular-CQFmLNzA.js} +0 -0
- /package/dist/{writeVelocityWeight-D1rvdxJu.js → writeVelocityWeight-D_AcvTsE.js} +0 -0
|
@@ -1,458 +0,0 @@
|
|
|
1
|
-
/* dock/density.css — the density × `--dock-scale` cascade (AX.W06 carve).
|
|
2
|
-
*
|
|
3
|
-
* Carved from the dock.css god-module (slice 25). This partial owns the W45
|
|
4
|
-
* density cascade: every per-density geometry axis (padding / control-size /
|
|
5
|
-
* layer-height / gap / tile-min / trigger+tab padding) is `calc(<base> *
|
|
6
|
-
* var(--dock-scale))` so the ONE `--dock-scale` multiplier grows box+pad+gap+
|
|
7
|
-
* tab+tile in lockstep on touch, with the inner `max(…, --dock-control-floor)`
|
|
8
|
-
* WCAG 2.5.5 clamp. The four rungs (compact · comfortable · spacious · audacious)
|
|
9
|
-
* + the audacious narrow-box `@container` label compression.
|
|
10
|
-
*
|
|
11
|
-
* @import-ed by dock.css in cascade order, in the SAME `@layer components` — the
|
|
12
|
-
* carve is isomorphic (same layer, same source order → ZERO visual delta). */
|
|
13
|
-
|
|
14
|
-
/* ── BB.W-HIERARCHY2 — the CONTENT-side anti-collision gutter ───────────────────
|
|
15
|
-
`--dock-content-safe-inset` is the structural CONTENT-side counterpart to the
|
|
16
|
-
dock-collision SEAT fix (W-CHIP-GRAZE + W-DOCK-RAIL-SEAT-FINAL own the chip-fan
|
|
17
|
-
SEAT — the chips fan off-canvas into the rail's dead gutter, chipOverMain:false on
|
|
18
|
-
EVERY route by topology). This token reserves a guaranteed safe-inset gutter on the
|
|
19
|
-
CONTENT column so the page-title band is structurally clear of any chip reach even
|
|
20
|
-
on a route added WITHOUT a per-route audit (the anti-gameability the gestalt gate
|
|
21
|
-
wants). It is keyed to the dock reach (`--dock-rail-extend-length`, the rail's
|
|
22
|
-
beyond-edge overrun) so the content gutter tracks the dock geometry in lockstep,
|
|
23
|
-
and it rides `--dock-scale` transitively through that reach token.
|
|
24
|
-
|
|
25
|
-
THE DE-OVERLOAD IS BINDING (distinct geometry concerns, distinct tokens):
|
|
26
|
-
`--dock-control-safe-inset` (per-density, below) is the dock CONTROL plate-clearance
|
|
27
|
-
inset (the painted plate floors a notch below its track cell — BA.W-DOCK-GEOMETRY,
|
|
28
|
-
owned by proof:dock-plate-clearance); `--dock-content-safe-inset` is the CONTENT-band
|
|
29
|
-
gutter (the content column reserves dead inline space the chips can never share).
|
|
30
|
-
The two close the collision from BOTH sides — the chip seat (the SEAT waves) AND the
|
|
31
|
-
content gutter (this token) — coordinated on the SAME dead inline gutter: the content
|
|
32
|
-
gutter is the RESERVE, the gutter-fan lands the chips in it (ONE gutter, two
|
|
33
|
-
consumers). NEVER re-point this AT --dock-control-safe-inset (the de-overload). */
|
|
34
|
-
:root {
|
|
35
|
-
--dock-content-safe-inset: var(--dock-rail-extend-length, 2.5rem);
|
|
36
|
-
|
|
37
|
-
/* ── BC.W-DOCK-ARBITRARY — the arbitrary-shape morph tokens ─────────────────
|
|
38
|
-
The dock morph is no longer locked to circle↔pill. The shape is now a SCALAR
|
|
39
|
-
PARAMETER: a `--dock-shape-from`/`--dock-shape-to` corner-radius pair the chrome
|
|
40
|
-
radius arm interpolates on `--dock-morph-t`, an OPT-IN `--dock-shape-clip-from`/
|
|
41
|
-
`--dock-shape-clip-to` clip-path silhouette pair (compositor-only, no layout),
|
|
42
|
-
and a `--dock-morph-max-stretch` squish cap. The library DEFAULTS preserve the
|
|
43
|
-
collapsed-perfect-circle ↔ expanded-pill identity (CLAUDE.md `aspect-ratio: 1` +
|
|
44
|
-
`--radius-dock` 9999px), so the common case needs no consumer override; a consumer
|
|
45
|
-
sets these to morph to an arbitrary silhouette (a wide bar, a teardrop, a tall
|
|
46
|
-
rail). Clean break (MEMORY: no backwards compat) — the prior hardcoded circle/pill
|
|
47
|
-
endpoints become these token DEFAULTS, no `--dock-radius-legacy`. */
|
|
48
|
-
|
|
49
|
-
/* The corner profile span — the `from`-radius (the collapsed perfect circle, a
|
|
50
|
-
9999px pill that rounds the height-pinned square into a circle) ↔ the `to`-radius
|
|
51
|
-
(the expanded pill, `--radius-dock`). Consumer-targetable: set either to any
|
|
52
|
-
radius to morph to an arbitrary corner profile. */
|
|
53
|
-
--dock-shape-from: var(--radius-dock, 9999px);
|
|
54
|
-
--dock-shape-to: var(--radius-dock, 9999px);
|
|
55
|
-
|
|
56
|
-
/* The arbitrary-silhouette span — an OPT-IN `clip-path` pair (a compositor property,
|
|
57
|
-
NO layout). DEFAULT-OFF: `none`/`none` means the rectangle/pill morph (the common
|
|
58
|
-
case) needs no clip. A consumer opts into a teardrop/blob silhouette by setting the
|
|
59
|
-
clip-from/to to two `inset()`/`path()`/`shape()` values the morph LERPS between on
|
|
60
|
-
`--dock-morph-t`. */
|
|
61
|
-
--dock-shape-clip-from: none;
|
|
62
|
-
--dock-shape-clip-to: none;
|
|
63
|
-
|
|
64
|
-
/* The squish cap — the LOW volume-preserving `--stretch` ceiling for the shape-morph
|
|
65
|
-
deformation, mirroring the tab-indicator's iOS-segmented register. BD.W-ANIM-IOS27-
|
|
66
|
-
TUNE lifts 1.08 → 1.14 so the box-morph reads as FLOWING MASS (the "MORPH MORE on
|
|
67
|
-
move" mandate; the dock is the most-visible morph surface) — a fast morph swells
|
|
68
|
-
the plate then caps, a gooey settle, never a taffy-pull (≤1.2 anti-taffy bar). */
|
|
69
|
-
--dock-morph-max-stretch: 1.14;
|
|
70
|
-
|
|
71
|
-
/* ── BC.W-LIQUID-MORPH — the reserve floor (the white morph can never paint) ──
|
|
72
|
-
The morph box reserves `inline-size`/`block-size: max(var(--dock-morph-to),
|
|
73
|
-
var(--dock-morph-min))` (layers.css). A degenerate `to:0` measurement (the
|
|
74
|
-
BA-VJS-1 nested-group race, glass-dock-codebase.md §2.2) would otherwise reserve
|
|
75
|
-
a ZERO-width footprint → `overflow: clip` blanks the content → the white/invisible
|
|
76
|
-
morph the user reports. The floor seats it at the collapsed-pill minimum (~44px,
|
|
77
|
-
the WCAG touch floor / `--dock-control-floor`), so a missed measurement degrades to
|
|
78
|
-
"visible at the floor," never "white." A SAFETY NET: on every healthy measurement
|
|
79
|
-
the `max()` resolves to the real `to` (inert above the floor); it fires ONLY on the
|
|
80
|
-
degenerate race. Density-scaled, riding `--dock-scale` transitively. */
|
|
81
|
-
--dock-morph-min: max(2.75rem, var(--dock-control-floor, 0px));
|
|
82
|
-
|
|
83
|
-
/* ── BC.W-DOCK-SEARCH — the collapse-on-scroll trigger-points ─────────────────
|
|
84
|
-
The dock-search optional shrink-on-scroll (composing useScrollChrome — the
|
|
85
|
-
native dual-path reader, persistent-default) reads these two tunable px
|
|
86
|
-
trigger-points: the shrink BEGINS at `--dock-search-shrink-start` of scroll and
|
|
87
|
-
reaches the compact form at `--dock-search-shrink-end` (the words
|
|
88
|
-
`scrollInflectionPoint` generalized into dock-scoped tokens). They ride
|
|
89
|
-
`--dock-scale` transitively (a coarse-pointer dock's trigger-points scale with
|
|
90
|
-
its geometry), and a consumer retunes the inflection in ONE write. NOTE the
|
|
91
|
-
PERSISTENT default — these are inert unless the consumer opts in via
|
|
92
|
-
`collapseOnScroll`; the morph itself NEVER fires on a passive scroll (the
|
|
93
|
-
iOS-27 lesson — the scroll path is the distinct compositor shrink). */
|
|
94
|
-
--dock-search-shrink-start: calc(0rem * var(--dock-scale));
|
|
95
|
-
--dock-search-shrink-end: calc(7.25rem * var(--dock-scale));
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
@layer components {
|
|
99
|
-
/* AX.W45 — the density cascade is threaded by the ONE `--dock-scale`
|
|
100
|
-
multiplier (default 1, lifted to `--dock-mobile-scale` on coarse pointers).
|
|
101
|
-
EVERY per-density geometry axis is `calc(<base> * var(--dock-scale))` so a
|
|
102
|
-
single knob grows box+pad+gap+tab+tile-min in lockstep on touch — the desktop
|
|
103
|
-
proportion preserved, never a 44px box around a desktop glyph. The
|
|
104
|
-
control-size carries an INNER `max(…, 44px)` WCAG 2.5.5 clamp (the coarse
|
|
105
|
-
block sets `--dock-control-floor: var(--dock-touch-target)`) so a consumer
|
|
106
|
-
dialing `--dock-mobile-scale` below 1.0 cannot drop the touch target under the
|
|
107
|
-
floor — the floor survives as a CLAMP, not a parallel `@media` rule. `--dock-
|
|
108
|
-
tile-min` is now IN the cascade (DK4-b) so the grid tile scales with the
|
|
109
|
-
control + glyph; it is a proportional `calc(control-size + tile-pad)` so the
|
|
110
|
-
icon-to-tile margin is ONE knob, not a per-density literal. */
|
|
111
|
-
.glass-dock[data-size="sm"] {
|
|
112
|
-
/* BD.W-DOCK-CORE (A11) — the OUTER pill pad floors lifted ~+50% for the generous
|
|
113
|
-
warm-cream liquid breath (the sliver-pill defect). The inner
|
|
114
|
-
`--dock-control-safe-inset` plate clearance is untouched (a distinct axis). */
|
|
115
|
-
--dock-padding-block: calc(
|
|
116
|
-
var(--dock-density-compact-padding-block, 0.375rem) * var(--dock-scale)
|
|
117
|
-
);
|
|
118
|
-
--dock-padding-inline: calc(
|
|
119
|
-
var(--dock-density-compact-padding-inline, 0.5rem) * var(--dock-scale)
|
|
120
|
-
);
|
|
121
|
-
--dock-control-size: max(
|
|
122
|
-
calc(var(--dock-density-compact-control-size, 2rem) * var(--dock-scale)),
|
|
123
|
-
var(--dock-control-floor, 0px)
|
|
124
|
-
);
|
|
125
|
-
--dock-layer-height: max(
|
|
126
|
-
calc(var(--dock-density-compact-layer-height, 2rem) * var(--dock-scale)),
|
|
127
|
-
var(--dock-control-floor, 0px)
|
|
128
|
-
);
|
|
129
|
-
/* BA.W-DOCK-GEOMETRY — the control-plate clearance inset (DC-2). The
|
|
130
|
-
painted control plate floors a notch BELOW its track cell so the maximal
|
|
131
|
-
hover (×--scale-hover-dock 1.1) / active silhouette stays inside the
|
|
132
|
-
cross-axis clip box with ≥1px margin (the lozenge dies at the plate
|
|
133
|
-
diameter, not at the clip edge). The inset is a per-SIDE fraction of the
|
|
134
|
-
control size (0.1 → an 80%-of-cell painted plate, the iOS-26 inset
|
|
135
|
-
register), so it scales with EVERY density rung in lockstep AND rides the
|
|
136
|
-
`--dock-scale` coarse multiplier transitively through --dock-control-size.
|
|
137
|
-
The control families route it through `padding` + `background-clip:
|
|
138
|
-
content-box`, so the HIT BOX stays the full --dock-control-size (the WCAG
|
|
139
|
-
2.5.5 44px floor stays on the CELL, never the inset plate) while the
|
|
140
|
-
PAINTED plate insets within it. */
|
|
141
|
-
--dock-control-safe-inset: calc(var(--dock-control-size) * 0.1);
|
|
142
|
-
--dock-layer-gap: calc(
|
|
143
|
-
var(--dock-density-compact-gap, 0.25rem) * var(--dock-scale)
|
|
144
|
-
);
|
|
145
|
-
--dock-tile-min: calc(
|
|
146
|
-
var(--dock-control-size) + var(--dock-tile-pad, 1rem) * var(--dock-scale)
|
|
147
|
-
);
|
|
148
|
-
--dock-trigger-padding-block: calc(
|
|
149
|
-
var(--dock-density-compact-trigger-padding-block, 0.1875rem) *
|
|
150
|
-
var(--dock-scale)
|
|
151
|
-
);
|
|
152
|
-
--dock-trigger-padding-inline: calc(
|
|
153
|
-
var(--dock-density-compact-trigger-padding-inline, 0.4375rem) *
|
|
154
|
-
var(--dock-scale)
|
|
155
|
-
);
|
|
156
|
-
--dock-tab-padding-block: calc(
|
|
157
|
-
var(--dock-density-compact-tab-padding-block, 0.3125rem) *
|
|
158
|
-
var(--dock-scale)
|
|
159
|
-
);
|
|
160
|
-
--dock-tab-padding-inline: calc(
|
|
161
|
-
var(--dock-density-compact-tab-padding-inline, 0.625rem) *
|
|
162
|
-
var(--dock-scale)
|
|
163
|
-
);
|
|
164
|
-
--dock-tab-h: calc(32px * var(--dock-scale));
|
|
165
|
-
}
|
|
166
|
-
|
|
167
|
-
/* Comfortable density — the GlassDock default. Sits between compact
|
|
168
|
-
and spacious. */
|
|
169
|
-
.glass-dock[data-size="md"] {
|
|
170
|
-
/* BD.W-DOCK-CORE (A11) — the generous liquid-pill pad: inline 0.5 → 0.75rem (+8px
|
|
171
|
-
total breath), block 0.375 → 0.5rem (softer). The vertical sliver-around-40px
|
|
172
|
-
becomes a soft warm-cream capsule. */
|
|
173
|
-
--dock-padding-block: calc(
|
|
174
|
-
var(--dock-density-comfortable-padding-block, 0.5rem) * var(--dock-scale)
|
|
175
|
-
);
|
|
176
|
-
--dock-padding-inline: calc(
|
|
177
|
-
var(--dock-density-comfortable-padding-inline, 0.75rem) * var(--dock-scale)
|
|
178
|
-
);
|
|
179
|
-
--dock-control-size: max(
|
|
180
|
-
calc(
|
|
181
|
-
var(--dock-density-comfortable-control-size, 2.5rem) *
|
|
182
|
-
var(--dock-scale)
|
|
183
|
-
),
|
|
184
|
-
var(--dock-control-floor, 0px)
|
|
185
|
-
);
|
|
186
|
-
--dock-layer-height: max(
|
|
187
|
-
calc(
|
|
188
|
-
var(--dock-density-comfortable-layer-height, 2.5rem) *
|
|
189
|
-
var(--dock-scale)
|
|
190
|
-
),
|
|
191
|
-
var(--dock-control-floor, 0px)
|
|
192
|
-
);
|
|
193
|
-
/* BA.W-DOCK-GEOMETRY — see the compact rung. */
|
|
194
|
-
--dock-control-safe-inset: calc(var(--dock-control-size) * 0.1);
|
|
195
|
-
--dock-layer-gap: calc(
|
|
196
|
-
var(--dock-density-comfortable-gap, 0.375rem) * var(--dock-scale)
|
|
197
|
-
);
|
|
198
|
-
--dock-tile-min: calc(
|
|
199
|
-
var(--dock-control-size) + var(--dock-tile-pad, 2rem) * var(--dock-scale)
|
|
200
|
-
);
|
|
201
|
-
--dock-trigger-padding-block: calc(
|
|
202
|
-
var(--dock-density-comfortable-trigger-padding-block, 0.25rem) *
|
|
203
|
-
var(--dock-scale)
|
|
204
|
-
);
|
|
205
|
-
--dock-trigger-padding-inline: calc(
|
|
206
|
-
var(--dock-density-comfortable-trigger-padding-inline, 0.5rem) *
|
|
207
|
-
var(--dock-scale)
|
|
208
|
-
);
|
|
209
|
-
--dock-tab-padding-block: calc(
|
|
210
|
-
var(--dock-density-comfortable-tab-padding-block, 0.4375rem) *
|
|
211
|
-
var(--dock-scale)
|
|
212
|
-
);
|
|
213
|
-
--dock-tab-padding-inline: calc(
|
|
214
|
-
var(--dock-density-comfortable-tab-padding-inline, 0.75rem) *
|
|
215
|
-
var(--dock-scale)
|
|
216
|
-
);
|
|
217
|
-
--dock-tab-h: calc(38px * var(--dock-scale));
|
|
218
|
-
}
|
|
219
|
-
|
|
220
|
-
.glass-dock[data-size="lg"] {
|
|
221
|
-
/* BD.W-DOCK-CORE (A11) — the spacious rung breathes in lockstep (~+33%). */
|
|
222
|
-
--dock-padding-block: calc(
|
|
223
|
-
var(--dock-density-spacious-padding-block, 0.625rem) * var(--dock-scale)
|
|
224
|
-
);
|
|
225
|
-
--dock-padding-inline: calc(
|
|
226
|
-
var(--dock-density-spacious-padding-inline, 1rem) * var(--dock-scale)
|
|
227
|
-
);
|
|
228
|
-
--dock-control-size: max(
|
|
229
|
-
calc(
|
|
230
|
-
var(--dock-density-spacious-control-size, 2.75rem) * var(--dock-scale)
|
|
231
|
-
),
|
|
232
|
-
var(--dock-control-floor, 0px)
|
|
233
|
-
);
|
|
234
|
-
--dock-layer-height: max(
|
|
235
|
-
calc(
|
|
236
|
-
var(--dock-density-spacious-layer-height, 2.75rem) * var(--dock-scale)
|
|
237
|
-
),
|
|
238
|
-
var(--dock-control-floor, 0px)
|
|
239
|
-
);
|
|
240
|
-
/* BA.W-DOCK-GEOMETRY — see the compact rung. */
|
|
241
|
-
--dock-control-safe-inset: calc(var(--dock-control-size) * 0.1);
|
|
242
|
-
--dock-layer-gap: calc(
|
|
243
|
-
var(--dock-density-spacious-gap, 0.5rem) * var(--dock-scale)
|
|
244
|
-
);
|
|
245
|
-
--dock-tile-min: calc(
|
|
246
|
-
var(--dock-control-size) + var(--dock-tile-pad, 2.75rem) * var(--dock-scale)
|
|
247
|
-
);
|
|
248
|
-
--dock-trigger-padding-block: calc(
|
|
249
|
-
var(--dock-density-spacious-trigger-padding-block, 0.375rem) *
|
|
250
|
-
var(--dock-scale)
|
|
251
|
-
);
|
|
252
|
-
--dock-trigger-padding-inline: calc(
|
|
253
|
-
var(--dock-density-spacious-trigger-padding-inline, 0.625rem) *
|
|
254
|
-
var(--dock-scale)
|
|
255
|
-
);
|
|
256
|
-
--dock-tab-padding-block: calc(
|
|
257
|
-
var(--dock-density-spacious-tab-padding-block, 0.5rem) * var(--dock-scale)
|
|
258
|
-
);
|
|
259
|
-
--dock-tab-padding-inline: calc(
|
|
260
|
-
var(--dock-density-spacious-tab-padding-inline, 0.875rem) *
|
|
261
|
-
var(--dock-scale)
|
|
262
|
-
);
|
|
263
|
-
--dock-tab-h: calc(44px * var(--dock-scale));
|
|
264
|
-
}
|
|
265
|
-
|
|
266
|
-
/* Audacious density — typography-forward chrome where the dock reads as
|
|
267
|
-
a primary surface, not a tray. Tab buttons set their own min-height so
|
|
268
|
-
consumer-bumped fonts no longer drift the button height — the
|
|
269
|
-
`--dock-tab-min-height` token reserves the row regardless of glyph rise. */
|
|
270
|
-
.glass-dock[data-size="xl"] {
|
|
271
|
-
--dock-padding-block: calc(
|
|
272
|
-
var(--dock-density-audacious-padding-block, 0.5rem) * var(--dock-scale)
|
|
273
|
-
);
|
|
274
|
-
--dock-padding-inline: calc(
|
|
275
|
-
var(--dock-density-audacious-padding-inline, 0.875rem) * var(--dock-scale)
|
|
276
|
-
);
|
|
277
|
-
--dock-control-size: max(
|
|
278
|
-
calc(var(--dock-density-audacious-control-size, 4rem) * var(--dock-scale)),
|
|
279
|
-
var(--dock-control-floor, 0px)
|
|
280
|
-
);
|
|
281
|
-
--dock-layer-height: max(
|
|
282
|
-
calc(var(--dock-density-audacious-layer-height, 4rem) * var(--dock-scale)),
|
|
283
|
-
var(--dock-control-floor, 0px)
|
|
284
|
-
);
|
|
285
|
-
/* BA.W-DOCK-GEOMETRY — see the compact rung. */
|
|
286
|
-
--dock-control-safe-inset: calc(var(--dock-control-size) * 0.1);
|
|
287
|
-
--dock-layer-gap: calc(
|
|
288
|
-
var(--dock-density-audacious-gap, 0.875rem) * var(--dock-scale)
|
|
289
|
-
);
|
|
290
|
-
--dock-tile-min: calc(
|
|
291
|
-
var(--dock-control-size) + var(--dock-tile-pad, 2.75rem) * var(--dock-scale)
|
|
292
|
-
);
|
|
293
|
-
--dock-trigger-padding-block: calc(
|
|
294
|
-
var(--dock-density-audacious-trigger-padding-block, 0.625rem) *
|
|
295
|
-
var(--dock-scale)
|
|
296
|
-
);
|
|
297
|
-
--dock-trigger-padding-inline: calc(
|
|
298
|
-
var(--dock-density-audacious-trigger-padding-inline, 1rem) *
|
|
299
|
-
var(--dock-scale)
|
|
300
|
-
);
|
|
301
|
-
--dock-tab-padding-block: calc(
|
|
302
|
-
var(--dock-density-audacious-tab-padding-block, 0.5rem) * var(--dock-scale)
|
|
303
|
-
);
|
|
304
|
-
--dock-tab-padding-inline: calc(
|
|
305
|
-
var(--dock-density-audacious-tab-padding-inline, 1.5rem) *
|
|
306
|
-
var(--dock-scale)
|
|
307
|
-
);
|
|
308
|
-
--dock-tab-min-height: calc(
|
|
309
|
-
var(--dock-density-audacious-tab-min-height, 3.5rem) * var(--dock-scale)
|
|
310
|
-
);
|
|
311
|
-
--dock-tab-h: calc(
|
|
312
|
-
var(--dock-density-audacious-tab-min-height, 3.5rem) * var(--dock-scale)
|
|
313
|
-
);
|
|
314
|
-
}
|
|
315
|
-
|
|
316
|
-
/* ── BC.W-AX-DOCK-COCKPIT — the `cockpit` geometry PRESET ─────────────────────
|
|
317
|
-
The tight instrument-cockpit register: a FIXED `2.75rem` control floor (the
|
|
318
|
-
Gate-1 Q6 fixed value — NOT a range) with COMPACT-tight chrome (the tightest
|
|
319
|
-
padding/gap/tile-pad, distinct from `spacious`'s LOOSE chrome at the SAME
|
|
320
|
-
2.75rem control). It closes the dock-oversize chronic (speedtest A-9): a
|
|
321
|
-
consumer opts into a dense, proportioned instrument strip — `2.75rem` control,
|
|
322
|
-
compact chrome, the label tracking the control by `--dock-label-ratio` (so the
|
|
323
|
-
label never reads OVERSIZE on the tight pill).
|
|
324
|
-
|
|
325
|
-
It is a NAMED preset, NOT a 5th density rung — the density axis stays FOUR rungs
|
|
326
|
-
(`proof:dock-unify`'s density census is unaffected). The preset is a geometry
|
|
327
|
-
OVERRIDE composing WITH a `data-size` base: `[data-preset="cockpit"]` wins the
|
|
328
|
-
control-size/layer-height/chrome by source-order (this block comes AFTER the rungs),
|
|
329
|
-
so a `<GlassDock data-size="md" data-preset="cockpit">` resolves the
|
|
330
|
-
cockpit geometry. An ancestor `[data-preset="cockpit"]` scope re-declares these
|
|
331
|
-
tokens too (the substitution-vs-inheritance discipline) so descendant docks inherit.
|
|
332
|
-
|
|
333
|
-
The control floor rides the SAME `* var(--dock-scale)` thread + the `max(…,
|
|
334
|
-
--dock-control-floor)` WCAG 2.5.5 clamp as the rungs — the cockpit is tight, but
|
|
335
|
-
the coarse-pointer touch target NEVER drops below the 44px floor. */
|
|
336
|
-
.glass-dock[data-preset="cockpit"] {
|
|
337
|
-
/* The FIXED 2.75rem control floor (Q6) — the cockpit register, riding
|
|
338
|
-
`--dock-scale` + the 44px clamp. NOT a `clamp(2.5rem, …, 3rem)` range. */
|
|
339
|
-
--dock-control-size: max(
|
|
340
|
-
calc(2.75rem * var(--dock-scale)),
|
|
341
|
-
var(--dock-control-floor, 0px)
|
|
342
|
-
);
|
|
343
|
-
--dock-layer-height: max(
|
|
344
|
-
calc(2.75rem * var(--dock-scale)),
|
|
345
|
-
var(--dock-control-floor, 0px)
|
|
346
|
-
);
|
|
347
|
-
/* The TIGHT chrome — the COMPACT-rung tightness (the cockpit is a dense
|
|
348
|
-
instrument strip, NOT the spacious loosening). This is the distinction
|
|
349
|
-
from `spacious` (same control, LOOSE chrome). */
|
|
350
|
-
--dock-padding-block: calc(
|
|
351
|
-
var(--dock-density-compact-padding-block, 0.25rem) * var(--dock-scale)
|
|
352
|
-
);
|
|
353
|
-
--dock-padding-inline: calc(
|
|
354
|
-
var(--dock-density-compact-padding-inline, 0.375rem) * var(--dock-scale)
|
|
355
|
-
);
|
|
356
|
-
--dock-layer-gap: calc(
|
|
357
|
-
var(--dock-density-compact-gap, 0.25rem) * var(--dock-scale)
|
|
358
|
-
);
|
|
359
|
-
/* BA.W-DOCK-GEOMETRY — the control-plate clearance inset, in lockstep with
|
|
360
|
-
the rungs (the 10%-per-side painted-plate inset). */
|
|
361
|
-
--dock-control-safe-inset: calc(var(--dock-control-size) * 0.1);
|
|
362
|
-
--dock-tile-min: calc(
|
|
363
|
-
var(--dock-control-size) + var(--dock-tile-pad, 1rem) * var(--dock-scale)
|
|
364
|
-
);
|
|
365
|
-
--dock-trigger-padding-block: calc(
|
|
366
|
-
var(--dock-density-compact-trigger-padding-block, 0.1875rem) *
|
|
367
|
-
var(--dock-scale)
|
|
368
|
-
);
|
|
369
|
-
--dock-trigger-padding-inline: calc(
|
|
370
|
-
var(--dock-density-compact-trigger-padding-inline, 0.4375rem) *
|
|
371
|
-
var(--dock-scale)
|
|
372
|
-
);
|
|
373
|
-
--dock-tab-padding-block: calc(
|
|
374
|
-
var(--dock-density-compact-tab-padding-block, 0.3125rem) *
|
|
375
|
-
var(--dock-scale)
|
|
376
|
-
);
|
|
377
|
-
--dock-tab-padding-inline: calc(
|
|
378
|
-
var(--dock-density-compact-tab-padding-inline, 0.625rem) *
|
|
379
|
-
var(--dock-scale)
|
|
380
|
-
);
|
|
381
|
-
--dock-tab-h: calc(32px * var(--dock-scale));
|
|
382
|
-
/* The cockpit-tight label ratio — the label reads EVEN tighter relative to
|
|
383
|
-
its control than the `:root` default (the A-9 close). The `dock-label`
|
|
384
|
-
font-size is `calc(--dock-control-size * --dock-label-ratio)`; the cockpit
|
|
385
|
-
tunes the ratio DOWN so a 2.75rem cockpit control carries a label sized for
|
|
386
|
-
the dense strip, not the comfortable-default proportion.
|
|
387
|
-
BI.W-DOCK-CONTROLS (§Inbound speedtest) — adopts the consumer-calibrated
|
|
388
|
-
0.275 (their measured cockpit ask; was 0.42) so the greenfield cockpit
|
|
389
|
-
matches the shipped speedtest SurveyResultDock label proportion. */
|
|
390
|
-
--dock-label-ratio: 0.275;
|
|
391
|
-
/* RE-RESOLVE the density-painted glyph tokens against the cockpit
|
|
392
|
-
`--dock-layer-height` (the same substitution-vs-inheritance trap the
|
|
393
|
-
`.glass-dock[data-size]` re-resolve below fixes — a `[data-preset]`
|
|
394
|
-
scope paints its OWN `--dock-layer-height`, so the `:root`-derived glyph
|
|
395
|
-
would freeze at the fallback). Identical formula to the density re-resolve;
|
|
396
|
-
only the resolution element moves so the cockpit height flows into the glyph. */
|
|
397
|
-
--dock-icon-glyph: max(
|
|
398
|
-
calc(var(--dock-layer-height) * var(--dock-icon-glyph-ratio)),
|
|
399
|
-
var(--dock-icon-glyph-floor)
|
|
400
|
-
);
|
|
401
|
-
--dock-control-glyph-size: var(--dock-icon-glyph);
|
|
402
|
-
}
|
|
403
|
-
|
|
404
|
-
/* BB.W-PERF-PRODUCER A′-6 — RE-RESOLVE the glyph token inside the density-painted
|
|
405
|
-
scope. `--dock-icon-glyph` (offsets-sizing.css) is a RATIO of
|
|
406
|
-
`--dock-layer-height`, but density.css paints `--dock-layer-height` ONLY on
|
|
407
|
-
`.glass-dock[data-size]` — the `:root` `--dock-icon-glyph` definition reads
|
|
408
|
-
`--dock-layer-height` at `:root` (the inline fallback ladder), so it would
|
|
409
|
-
FREEZE at the fallback rather than track the per-rung painted height (the SAME
|
|
410
|
-
substitution-vs-inheritance trap the R5-1 sweep fixed for
|
|
411
|
-
`--dock-collapsed-summary-min-size` in overflow.css). Re-resolving it HERE, on
|
|
412
|
-
the element that paints `--dock-layer-height`, lets the per-density height flow
|
|
413
|
-
into the glyph so a `spacious` dock's glyph grows in lockstep with the shelf
|
|
414
|
-
(the value.js D5-1 defect). The formula is IDENTICAL to the `:root` definition;
|
|
415
|
-
only the resolution element moves. The WCAG floor + the `--dock-icon-glyph-ratio`
|
|
416
|
-
knob ride through unchanged; the `.dark-mode-toggle-button > svg` mirror reads
|
|
417
|
-
the same re-resolved token so both glyphs track the density axis. */
|
|
418
|
-
.glass-dock[data-size] {
|
|
419
|
-
--dock-icon-glyph: max(
|
|
420
|
-
calc(var(--dock-layer-height, calc(2.5rem * var(--dock-scale))) * var(--dock-icon-glyph-ratio)),
|
|
421
|
-
var(--dock-icon-glyph-floor)
|
|
422
|
-
);
|
|
423
|
-
/* BC.W-DOCK-ENGINE move 3 (the Atlas A-9 fold) — RE-RESOLVE the in-dock
|
|
424
|
-
control-glyph knob against the density-painted `--dock-icon-glyph` (the
|
|
425
|
-
same substitution-vs-inheritance trap as the glyph above: a `:root`-only
|
|
426
|
-
`--dock-control-glyph-size` would freeze at the `:root` glyph while
|
|
427
|
-
`--dock-icon-glyph` lifts per density). Re-declaring it HERE keeps the
|
|
428
|
-
docked dark-toggle glyph + its inset pad on the density axis with the nav
|
|
429
|
-
glyphs. Identical to the `:root` default; only the resolution element
|
|
430
|
-
moves so the density-painted glyph flows in. */
|
|
431
|
-
--dock-control-glyph-size: var(--dock-icon-glyph);
|
|
432
|
-
}
|
|
433
|
-
|
|
434
|
-
/* Density-audacious narrow-box carve (AV.W16 TW3) — when the dock's OWN
|
|
435
|
-
box is narrow the audacious-dock label glyphs compress so the chrome
|
|
436
|
-
doesn't overflow its host (≤14px below 30rem, 15px 30–45rem). Keyed off
|
|
437
|
-
the dock's `dock` inline-size container — now OPT-IN via the
|
|
438
|
-
`containerName="dock"` prop (AW.W1 removed the always-on default that
|
|
439
|
-
broke shrink-to-fit), so it fires only for a dock the consumer has
|
|
440
|
-
width-CONSTRAINED into a host (the 320px sidebar case) where the
|
|
441
|
-
compression is meaningful and the containment does not collapse the box.
|
|
442
|
-
A free-floating dock shrink-wraps (box == content) so there is nothing to
|
|
443
|
-
compress. The var
|
|
444
|
-
is set on the `.dock-label` descendant (which reads it via
|
|
445
|
-
`font-size: var(--dock-label-size)`, typography.css). Thresholds keep
|
|
446
|
-
the prior 479/719px viewport cadence as box widths (30rem ≈ 480px,
|
|
447
|
-
45rem ≈ 720px at the 16px root). */
|
|
448
|
-
@container dock (max-width: 29.9375rem) {
|
|
449
|
-
.glass-dock[data-size="xl"] .dock-label {
|
|
450
|
-
--dock-label-size: 14px;
|
|
451
|
-
}
|
|
452
|
-
}
|
|
453
|
-
@container dock (min-width: 30rem) and (max-width: 44.9375rem) {
|
|
454
|
-
.glass-dock[data-size="xl"] .dock-label {
|
|
455
|
-
--dock-label-size: 15px;
|
|
456
|
-
}
|
|
457
|
-
}
|
|
458
|
-
}
|
package/src/styles/dock/dock.css
DELETED
|
@@ -1,199 +0,0 @@
|
|
|
1
|
-
/* dock/dock.css — the GREENFIELD three-z-layer plate SPINE (BI.W-DOCK-SPINE).
|
|
2
|
-
*
|
|
3
|
-
* THE FAM-3 dock-disease terminal cure (PASS-1 §0/§2.1/§2.2). The unanimous root
|
|
4
|
-
* cause: `.glass-dock` was SIMULTANEOUSLY the glass surface, the morph clip aperture
|
|
5
|
-
* (`overflow: clip` + `contain: layout style paint`, shell.css), AND the interactive
|
|
6
|
-
* item container — every named clip/morph defect (UF-C5/C6/C7) was a downstream
|
|
7
|
-
* compensation for that triple identity. This partial SPLITS it into three z-layers so
|
|
8
|
-
* the defects become UNREPRESENTABLE, not patched:
|
|
9
|
-
*
|
|
10
|
-
* L0 — THE PLATE (`.dock-plate`). ONE absolute element owning `backdrop-filter` + the
|
|
11
|
-
* `--glass-*` glass surface + rim + grain (the shipped ladder verbatim — reads the
|
|
12
|
-
* inheriting `--dock-surface-blur`/`--glass-tint-*` tokens the shell + adaptive-
|
|
13
|
-
* legibility partials re-point on `.glass-dock`, so the AZ self-engage darken +
|
|
14
|
-
* the dark-arm glow reach the plate via inheritance, ZERO re-author). Its VISIBLE
|
|
15
|
-
* EXTENT morphs via `clip-path: inset(… )` off the ONE plate-scoped `@property
|
|
16
|
-
* --dock-t` (paint-only, compositor-composited, ZERO endpoint measurement — self-
|
|
17
|
-
* describing over the reserved box). It is a SIBLING of the control run, NEVER its
|
|
18
|
-
* ancestor — so a control hover plate overhangs the plate edge UN-CLIPPED
|
|
19
|
-
* (UF-C6/C7 unrepresentable). The drop-shadow ELEVATION stays on `.glass-dock`
|
|
20
|
-
* (box-shadow OUTSIDE the border box would be clipped by the plate's clip-path).
|
|
21
|
-
*
|
|
22
|
-
* L1 — THE CONTROLS (`.dock-controls`). A normal-flow flex run OVER the plate,
|
|
23
|
-
* `overflow: visible` BOTH axes ALWAYS. No ancestor clips it — "afford enough room
|
|
24
|
-
* from first principles" (UF-C6) IS this layer.
|
|
25
|
-
*
|
|
26
|
-
* L2 — TRANSIENT SURFACES. Top-layer popovers (W-DOCK-ESCAPE) — nothing to escape FROM.
|
|
27
|
-
*
|
|
28
|
-
* ONE ENGINE, ONE SCALAR (PASS-1 §2.2). `--dock-t` is `@property`-registered `<number>`
|
|
29
|
-
* (initial 0), `inherits: false` + scoped to the PLATE — the A′-4 restyle-scope cure (a
|
|
30
|
-
* per-frame write recomputes the plate clip only, not the 10-selector control subtree).
|
|
31
|
-
*
|
|
32
|
-
* TRANSITIONAL COEXISTENCE (the interlock, forbidden-at-close). Until W-DOCK-SPRING-UNIFY
|
|
33
|
-
* re-points `useDockSpring` to write `--dock-t` directly + deletes the scalar zoo, the
|
|
34
|
-
* plate ALIASES `--dock-t` to the live `--dock-morph-t` progress (the honest bridge — a
|
|
35
|
-
* registered scalar, never a masking fallback) and the collapse insets are gated behind
|
|
36
|
-
* `--dock-plate-collapse-inset` (default `0px` → the clip is a corner-safe no-op, the box-
|
|
37
|
-
* size morph still drives the visible extent). SPRING-UNIFY sets the collapse geometry +
|
|
38
|
-
* `round`-radius tracking and the plate clip becomes the sole extent driver.
|
|
39
|
-
*
|
|
40
|
-
* @import-ed by dock.css AFTER shell.css/shell-regions.css and BEFORE morph.css, in the
|
|
41
|
-
* SAME `@layer components` — the plate BASE surface here, the collapsed↔expanded surface
|
|
42
|
-
* INTERP retargeted onto `.dock-plate` in morph.css (source-order + specificity win). */
|
|
43
|
-
|
|
44
|
-
@layer components {
|
|
45
|
-
/* ── L0 — THE PLATE (the lens) ─────────────────────────────────────────────── */
|
|
46
|
-
.dock-plate {
|
|
47
|
-
position: absolute;
|
|
48
|
-
inset: 0;
|
|
49
|
-
/* Paint BELOW the in-flow control run, ABOVE the box's (empty) bg/border +
|
|
50
|
-
drop-shadow: `.glass-dock` mints a stacking context at rest (`scale: 1`,
|
|
51
|
-
shell.css), so a negative-z child stays WITHIN that context — the plate seats
|
|
52
|
-
at the bottom (glass lens), the `display: contents` control run paints over it.
|
|
53
|
-
This keeps the control LAYOUT byte-identical to HEAD (the controls stay direct
|
|
54
|
-
flex children of `.glass-dock`) with the plate added behind. */
|
|
55
|
-
z-index: -1;
|
|
56
|
-
/* The pill IS a surface — clicks on the glass between controls are absorbed by
|
|
57
|
-
the dock, NOT passed through (the reserved-footprint pass-through is the
|
|
58
|
-
TRANSPARENT MARGIN's job below, never the plate's). */
|
|
59
|
-
pointer-events: auto;
|
|
60
|
-
/* Corner rounding follows the box shape exactly (shell.css shape rules set the
|
|
61
|
-
`.glass-dock` border-radius; the plate inherits it) so the plate's bg/border/
|
|
62
|
-
backdrop round-clip to the same silhouette on every shape. */
|
|
63
|
-
border-radius: inherit;
|
|
64
|
-
/* The backdrop lens — reads the dock-scoped resolved blur the shell composes
|
|
65
|
-
(`--dock-surface-blur: var(--glass-blur-resting)`, the 8px peer-locked
|
|
66
|
-
material + its saturate companion; the `.dark .glass-dock` glow arm + the
|
|
67
|
-
`prefers-reduced-transparency` → `--glass-level: 0` bracket both reach it via
|
|
68
|
-
the inheriting token). ONE backdrop-filter in the dock — the box no longer
|
|
69
|
-
carries it (no double-blur). */
|
|
70
|
-
backdrop-filter: var(--dock-surface-blur);
|
|
71
|
-
/* The glass surface — the element-level oklab adaptive tint (the AZ.W-ADAPTIVE-
|
|
72
|
-
AUTO self-engage re-points the inheriting `--glass-tint-source`/`-strength` on
|
|
73
|
-
`.glass-dock`; the plate composes them AT THE ELEMENT so the darken-over-light
|
|
74
|
-
reaches the plate). Zero-delta at the 0% rest default. morph.css OVERRIDES this
|
|
75
|
-
with the collapsed↔expanded interp on `.glass-dock:not(.vertical) .dock-plate`. */
|
|
76
|
-
background: color-mix(
|
|
77
|
-
in oklab,
|
|
78
|
-
var(--glass-bg-dock, var(--glass-bg-resting)),
|
|
79
|
-
var(--glass-tint-source) var(--glass-tint-strength)
|
|
80
|
-
);
|
|
81
|
-
border: 1.5px solid var(--glass-border-dock, var(--glass-border-resting));
|
|
82
|
-
/* THE VISIBLE-EXTENT MORPH — paint-only clip off the ONE plate scalar. Reads
|
|
83
|
-
`--dock-t` (S2: the plate is the sole reader). Transitionally the collapse
|
|
84
|
-
insets are `0px` (the box-size morph drives the extent, shape.css) so this is a
|
|
85
|
-
corner-safe no-op that still tracks the scalar; SPRING-UNIFY sets the collapse
|
|
86
|
-
geometry + `round` radius. No `round` here yet: an inset(0) clip on the
|
|
87
|
-
border-radius-rounded plate keeps the rounded corners (they sit inside the
|
|
88
|
-
bounding box) on EVERY shape, so no fixed-radius over/under-round regression. */
|
|
89
|
-
--dock-t: var(--dock-morph-t);
|
|
90
|
-
--dock-plate-inset-inline: calc(
|
|
91
|
-
(1 - var(--dock-t)) * var(--dock-plate-collapse-inset, 0px)
|
|
92
|
-
);
|
|
93
|
-
--dock-plate-inset-block: calc(
|
|
94
|
-
(1 - var(--dock-t)) * var(--dock-plate-collapse-inset-block, 0px)
|
|
95
|
-
);
|
|
96
|
-
clip-path: inset(
|
|
97
|
-
var(--dock-plate-inset-block) var(--dock-plate-inset-inline)
|
|
98
|
-
);
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
/* The paper-grain overlay — MOVED off `.glass-dock::after` onto the plate (the grain
|
|
102
|
-
belongs on the glass surface, which is the plate now). Same recipe, byte-identical. */
|
|
103
|
-
.dock-plate::after {
|
|
104
|
-
content: "";
|
|
105
|
-
position: absolute;
|
|
106
|
-
inset: 0;
|
|
107
|
-
border-radius: inherit;
|
|
108
|
-
background: var(--paper-clean-texture);
|
|
109
|
-
background-repeat: repeat;
|
|
110
|
-
background-size: var(--paper-texture-size);
|
|
111
|
-
opacity: var(--glass-grain-opacity);
|
|
112
|
-
pointer-events: none;
|
|
113
|
-
mix-blend-mode: overlay;
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
.dark .dock-plate::after {
|
|
117
|
-
mix-blend-mode: soft-light;
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
/* ── L1 — THE CONTROLS ─────────────────────────────────────────────────────────
|
|
121
|
-
A normal-flow run OVER the plate, `overflow: visible` BOTH axes ALWAYS. A hover/
|
|
122
|
-
press plate on an edge control overhangs the plate edge freely — NO ancestor clips
|
|
123
|
-
it, so UF-C6/C7 ("Dock hover items clip") are structurally impossible. The control
|
|
124
|
-
run inherits the box's flex layout via `display: contents` (it groups the controls
|
|
125
|
-
the SFC places without interposing a flex context of its own — the dock's own
|
|
126
|
-
`display: inline-flex` on `.glass-dock` lays the controls out). */
|
|
127
|
-
.dock-controls {
|
|
128
|
-
display: contents;
|
|
129
|
-
overflow: visible;
|
|
130
|
-
pointer-events: auto;
|
|
131
|
-
}
|
|
132
|
-
|
|
133
|
-
/* When a consumer needs the control run to be a real box (a scroll port lands here at
|
|
134
|
-
W-DOCK-OVERFLOW), it stays `overflow: visible` on the cross axis — never a clip. */
|
|
135
|
-
.glass-dock > .dock-controls {
|
|
136
|
-
overflow-x: visible;
|
|
137
|
-
overflow-y: visible;
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
/* ── Reserved-footprint pass-through (G3, PASS-1 §2.1) ──────────────────────────
|
|
141
|
-
A collapse-morphing dock that reserves its EXPANDED footprint out of flow (a
|
|
142
|
-
floating pill) must let click/wheel over the TRANSPARENT reserved margin fall
|
|
143
|
-
THROUGH to the page — `pointer-events: none` on the reserve wrapper, `auto` on the
|
|
144
|
-
plate + control run. Opt-in via a class-neutral `[data-reserve]` wrapper a genuine
|
|
145
|
-
reserved-footprint host (SPRING-UNIFY / OVERFLOW) sets. BI.W-DOCK-RETIRES retired the
|
|
146
|
-
`.glass-dock-frame` `display:contents` rail-escape (the fan/menu/search surfaces are
|
|
147
|
-
TOP-LAYER popovers now — W-DOCK-ESCAPE — nothing to escape from), so the reserve is a
|
|
148
|
-
plain `[data-reserve]` attribute, never the retired escape frame. */
|
|
149
|
-
[data-reserve] {
|
|
150
|
-
pointer-events: none;
|
|
151
|
-
}
|
|
152
|
-
|
|
153
|
-
[data-reserve] > .glass-dock,
|
|
154
|
-
[data-reserve] .dock-plate,
|
|
155
|
-
[data-reserve] .dock-controls {
|
|
156
|
-
pointer-events: auto;
|
|
157
|
-
}
|
|
158
|
-
|
|
159
|
-
/* ── Transform-free centering (PASS-4B ruling 2 — the SAF-1 landmine fence) ──────
|
|
160
|
-
The fixed floating dock centers `inset-inline: 0; margin-inline: auto; inline-size:
|
|
161
|
-
max-content` — NEVER `translateX(-50%)`. Load-bearing: the top-layer escape
|
|
162
|
-
(W-DOCK-ESCAPE) mis-resolves native `anchor()` through ANY transformed ancestor
|
|
163
|
-
chain, so a transform-free dock keeps that door open. GlassDock.vue's fixed class
|
|
164
|
-
chain (`fixed bottom-(--dock-pos) inset-x-0 mx-auto w-max`) resolves to this; the
|
|
165
|
-
rule is the explicit CSS witness the gate reads. A fixed/absolute element is
|
|
166
|
-
blockified (its `inline-flex` computes to `flex`), so the auto inline-margins
|
|
167
|
-
center it over its `max-content` width with no transform. */
|
|
168
|
-
.glass-dock.fixed {
|
|
169
|
-
inset-inline: 0;
|
|
170
|
-
margin-inline: auto;
|
|
171
|
-
inline-size: max-content;
|
|
172
|
-
width: max-content;
|
|
173
|
-
}
|
|
174
|
-
}
|
|
175
|
-
|
|
176
|
-
/* ── §Inbound U-F4 (value.js, A-class) — the desktop-PRM SNAP-TO-END-STATE ───────────
|
|
177
|
-
Under `prefers-reduced-motion: reduce` the reduced-motion cure is SNAP-TO-END-STATE,
|
|
178
|
-
NEVER freeze-at-start (WCAG 2.4.3/2.4.7/1.4.13). The EXPANDED / always-expanded dock
|
|
179
|
-
resolves its EXPANDED plate geometry STATICALLY — the plate scalar pins to its END
|
|
180
|
-
state so the clip reveals the FULL plate (every control reachable, full-width desktop
|
|
181
|
-
viewport), never the collapsed-from sliver the frozen morph clock left (HEAD's
|
|
182
|
-
`--dock-expand-t = 0` freeze). The plate-scalar pin is the GREENFIELD guarantee: when
|
|
183
|
-
W-DOCK-SPRING-UNIFY re-points the plate clip to be the sole extent driver, this arm
|
|
184
|
-
makes the PRM end-state correct BY CONSTRUCTION (independent of the JS morph seat). Not
|
|
185
|
-
inside the `@layer components` block (an `@media` at-rule sits at the stylesheet root;
|
|
186
|
-
it re-declares the `.dock-plate` scalar with the same class-specificity so it wins over
|
|
187
|
-
the transitional `--dock-t: var(--dock-morph-t)` alias under reduce). The oracle is REAL
|
|
188
|
-
GPU (2 headless false-reds on this surface distrusted — verified on Chromium+Metal). */
|
|
189
|
-
@media (prefers-reduced-motion: reduce) {
|
|
190
|
-
@layer components {
|
|
191
|
-
.glass-dock.expanded .dock-plate,
|
|
192
|
-
.glass-dock.always-expanded .dock-plate {
|
|
193
|
-
--dock-t: 1;
|
|
194
|
-
}
|
|
195
|
-
.glass-dock.collapsed .dock-plate {
|
|
196
|
-
--dock-t: 0;
|
|
197
|
-
}
|
|
198
|
-
}
|
|
199
|
-
}
|