@oxy.so/bloom 2.12.3 → 3.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 +4 -4
- package/docs/button-group.mdx +46 -4
- package/docs/composition.mdx +159 -0
- package/docs/field.mdx +39 -1
- package/docs/glass.mdx +46 -0
- package/docs/layout.mdx +72 -4
- package/docs/message-bubble.mdx +37 -3
- package/docs/message-media.mdx +6 -0
- package/docs/migrating-to-3.0.mdx +169 -0
- package/docs/page-header.mdx +192 -36
- package/lib/commonjs/button/Button.js +2 -0
- package/lib/commonjs/button/Button.js.map +1 -1
- package/lib/commonjs/button-group/ButtonGroup.js +124 -19
- package/lib/commonjs/button-group/ButtonGroup.js.map +1 -1
- package/lib/commonjs/control-surface/ControlSurface.js +46 -0
- package/lib/commonjs/control-surface/ControlSurface.js.map +1 -0
- package/lib/commonjs/control-surface/context.js +84 -0
- package/lib/commonjs/control-surface/context.js.map +1 -0
- package/lib/commonjs/control-surface/index.js +26 -0
- package/lib/commonjs/control-surface/index.js.map +1 -0
- package/lib/commonjs/control-surface/types.js +6 -0
- package/lib/commonjs/control-surface/types.js.map +1 -0
- package/lib/commonjs/field/Field.js +71 -26
- package/lib/commonjs/field/Field.js.map +1 -1
- package/lib/commonjs/field/context.js +80 -0
- package/lib/commonjs/field/context.js.map +1 -0
- package/lib/commonjs/field/index.js +7 -0
- package/lib/commonjs/field/index.js.map +1 -1
- package/lib/commonjs/floating/TriggerSlot.js +32 -0
- package/lib/commonjs/floating/TriggerSlot.js.map +1 -1
- package/lib/commonjs/glass/GlassIsland.js +107 -0
- package/lib/commonjs/glass/GlassIsland.js.map +1 -0
- package/lib/commonjs/glass/GlassSurface.js +4 -1
- package/lib/commonjs/glass/GlassSurface.js.map +1 -1
- package/lib/commonjs/glass/index.js +7 -0
- package/lib/commonjs/glass/index.js.map +1 -1
- package/lib/commonjs/index.js +564 -517
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/index.web.js +564 -517
- package/lib/commonjs/index.web.js.map +1 -1
- package/lib/commonjs/label/Label.js +4 -1
- package/lib/commonjs/label/Label.js.map +1 -1
- package/lib/commonjs/layout/bottom-edge.js +3 -42
- package/lib/commonjs/layout/bottom-edge.js.map +1 -1
- package/lib/commonjs/layout/edge-store.js +65 -0
- package/lib/commonjs/layout/edge-store.js.map +1 -0
- package/lib/commonjs/layout/index.js +32 -0
- package/lib/commonjs/layout/index.js.map +1 -1
- package/lib/commonjs/layout/scroll-offset.js +83 -0
- package/lib/commonjs/layout/scroll-offset.js.map +1 -0
- package/lib/commonjs/layout/top-edge.js +109 -0
- package/lib/commonjs/layout/top-edge.js.map +1 -0
- package/lib/commonjs/message-bubble/MessageBubble.js +16 -5
- package/lib/commonjs/message-bubble/MessageBubble.js.map +1 -1
- package/lib/commonjs/page-header/EdgeScrim.js +136 -0
- package/lib/commonjs/page-header/EdgeScrim.js.map +1 -0
- package/lib/commonjs/page-header/PageHeader.js +236 -61
- package/lib/commonjs/page-header/PageHeader.js.map +1 -1
- package/lib/commonjs/provider/BloomProvider.js +5 -2
- package/lib/commonjs/provider/BloomProvider.js.map +1 -1
- package/lib/commonjs/social-button/OxyMark.js +2 -2
- package/lib/commonjs/social-button/OxyMark.js.map +1 -1
- package/lib/commonjs/social-button/SocialButton.js +2 -2
- package/lib/commonjs/social-button/SocialButton.js.map +1 -1
- package/lib/commonjs/styles/svg-id.js +29 -0
- package/lib/commonjs/styles/svg-id.js.map +1 -0
- package/lib/commonjs/text-field/TextField.js +39 -6
- package/lib/commonjs/text-field/TextField.js.map +1 -1
- package/lib/commonjs/theme/glass-colors.js +81 -1
- package/lib/commonjs/theme/glass-colors.js.map +1 -1
- package/lib/module/button/Button.js +2 -0
- package/lib/module/button/Button.js.map +1 -1
- package/lib/module/button-group/ButtonGroup.js +124 -19
- package/lib/module/button-group/ButtonGroup.js.map +1 -1
- package/lib/module/control-surface/ControlSurface.js +41 -0
- package/lib/module/control-surface/ControlSurface.js.map +1 -0
- package/lib/module/control-surface/context.js +77 -0
- package/lib/module/control-surface/context.js.map +1 -0
- package/lib/module/control-surface/index.js +5 -0
- package/lib/module/control-surface/index.js.map +1 -0
- package/lib/module/control-surface/types.js +4 -0
- package/lib/module/control-surface/types.js.map +1 -0
- package/lib/module/field/Field.js +72 -27
- package/lib/module/field/Field.js.map +1 -1
- package/lib/module/field/context.js +74 -0
- package/lib/module/field/context.js.map +1 -0
- package/lib/module/field/index.js +1 -0
- package/lib/module/field/index.js.map +1 -1
- package/lib/module/floating/TriggerSlot.js +33 -1
- package/lib/module/floating/TriggerSlot.js.map +1 -1
- package/lib/module/glass/GlassIsland.js +102 -0
- package/lib/module/glass/GlassIsland.js.map +1 -0
- package/lib/module/glass/GlassSurface.js +5 -2
- package/lib/module/glass/GlassSurface.js.map +1 -1
- package/lib/module/glass/index.js +1 -0
- package/lib/module/glass/index.js.map +1 -1
- package/lib/module/index.js +2 -1
- package/lib/module/index.js.map +1 -1
- package/lib/module/index.web.js +2 -1
- package/lib/module/index.web.js.map +1 -1
- package/lib/module/label/Label.js +4 -1
- package/lib/module/label/Label.js.map +1 -1
- package/lib/module/layout/bottom-edge.js +2 -41
- package/lib/module/layout/bottom-edge.js.map +1 -1
- package/lib/module/layout/edge-store.js +58 -0
- package/lib/module/layout/edge-store.js.map +1 -0
- package/lib/module/layout/index.js +8 -3
- package/lib/module/layout/index.js.map +1 -1
- package/lib/module/layout/scroll-offset.js +77 -0
- package/lib/module/layout/scroll-offset.js.map +1 -0
- package/lib/module/layout/top-edge.js +102 -0
- package/lib/module/layout/top-edge.js.map +1 -0
- package/lib/module/message-bubble/MessageBubble.js +16 -5
- package/lib/module/message-bubble/MessageBubble.js.map +1 -1
- package/lib/module/page-header/EdgeScrim.js +132 -0
- package/lib/module/page-header/EdgeScrim.js.map +1 -0
- package/lib/module/page-header/PageHeader.js +233 -58
- package/lib/module/page-header/PageHeader.js.map +1 -1
- package/lib/module/provider/BloomProvider.js +5 -2
- package/lib/module/provider/BloomProvider.js.map +1 -1
- package/lib/module/social-button/OxyMark.js +1 -1
- package/lib/module/social-button/OxyMark.js.map +1 -1
- package/lib/module/social-button/SocialButton.js +1 -1
- package/lib/module/social-button/SocialButton.js.map +1 -1
- package/lib/module/styles/svg-id.js +26 -0
- package/lib/module/styles/svg-id.js.map +1 -0
- package/lib/module/text-field/TextField.js +39 -6
- package/lib/module/text-field/TextField.js.map +1 -1
- package/lib/module/theme/glass-colors.js +79 -0
- package/lib/module/theme/glass-colors.js.map +1 -1
- package/lib/typescript/commonjs/button/Button.d.ts.map +1 -1
- package/lib/typescript/commonjs/button-group/ButtonGroup.d.ts.map +1 -1
- package/lib/typescript/commonjs/button-group/types.d.ts +61 -5
- package/lib/typescript/commonjs/button-group/types.d.ts.map +1 -1
- package/lib/typescript/commonjs/control-surface/ControlSurface.d.ts +4 -0
- package/lib/typescript/commonjs/control-surface/ControlSurface.d.ts.map +1 -0
- package/lib/typescript/commonjs/control-surface/context.d.ts +21 -0
- package/lib/typescript/commonjs/control-surface/context.d.ts.map +1 -0
- package/lib/typescript/commonjs/control-surface/index.d.ts +4 -0
- package/lib/typescript/commonjs/control-surface/index.d.ts.map +1 -0
- package/lib/typescript/commonjs/control-surface/types.d.ts +37 -0
- package/lib/typescript/commonjs/control-surface/types.d.ts.map +1 -0
- package/lib/typescript/commonjs/field/Field.d.ts +1 -1
- package/lib/typescript/commonjs/field/Field.d.ts.map +1 -1
- package/lib/typescript/commonjs/field/context.d.ts +55 -0
- package/lib/typescript/commonjs/field/context.d.ts.map +1 -0
- package/lib/typescript/commonjs/field/index.d.ts +2 -0
- package/lib/typescript/commonjs/field/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/field/types.d.ts +22 -3
- package/lib/typescript/commonjs/field/types.d.ts.map +1 -1
- package/lib/typescript/commonjs/floating/TriggerSlot.d.ts.map +1 -1
- package/lib/typescript/commonjs/glass/GlassIsland.d.ts +4 -0
- package/lib/typescript/commonjs/glass/GlassIsland.d.ts.map +1 -0
- package/lib/typescript/commonjs/glass/GlassSurface.d.ts.map +1 -1
- package/lib/typescript/commonjs/glass/index.d.ts +2 -1
- package/lib/typescript/commonjs/glass/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/glass/types.d.ts +43 -0
- package/lib/typescript/commonjs/glass/types.d.ts.map +1 -1
- package/lib/typescript/commonjs/index.d.ts +3 -2
- package/lib/typescript/commonjs/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/index.web.d.ts +3 -2
- package/lib/typescript/commonjs/index.web.d.ts.map +1 -1
- package/lib/typescript/commonjs/label/Label.d.ts.map +1 -1
- package/lib/typescript/commonjs/label/types.d.ts +7 -1
- package/lib/typescript/commonjs/label/types.d.ts.map +1 -1
- package/lib/typescript/commonjs/layout/bottom-edge.d.ts.map +1 -1
- package/lib/typescript/commonjs/layout/edge-store.d.ts +31 -0
- package/lib/typescript/commonjs/layout/edge-store.d.ts.map +1 -0
- package/lib/typescript/commonjs/layout/index.d.ts +8 -3
- package/lib/typescript/commonjs/layout/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/layout/scroll-offset.d.ts +16 -0
- package/lib/typescript/commonjs/layout/scroll-offset.d.ts.map +1 -0
- package/lib/typescript/commonjs/layout/top-edge.d.ts +77 -0
- package/lib/typescript/commonjs/layout/top-edge.d.ts.map +1 -0
- package/lib/typescript/commonjs/message-bubble/MessageBubble.d.ts +1 -1
- package/lib/typescript/commonjs/message-bubble/MessageBubble.d.ts.map +1 -1
- package/lib/typescript/commonjs/message-bubble/index.d.ts +1 -1
- package/lib/typescript/commonjs/message-bubble/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/message-bubble/types.d.ts +27 -5
- package/lib/typescript/commonjs/message-bubble/types.d.ts.map +1 -1
- package/lib/typescript/commonjs/page-header/EdgeScrim.d.ts +95 -0
- package/lib/typescript/commonjs/page-header/EdgeScrim.d.ts.map +1 -0
- package/lib/typescript/commonjs/page-header/PageHeader.d.ts +1 -1
- package/lib/typescript/commonjs/page-header/PageHeader.d.ts.map +1 -1
- package/lib/typescript/commonjs/page-header/index.d.ts +1 -1
- package/lib/typescript/commonjs/page-header/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/page-header/types.d.ts +97 -10
- package/lib/typescript/commonjs/page-header/types.d.ts.map +1 -1
- package/lib/typescript/commonjs/provider/BloomProvider.d.ts.map +1 -1
- package/lib/typescript/commonjs/styles/svg-id.d.ts +20 -0
- package/lib/typescript/commonjs/styles/svg-id.d.ts.map +1 -0
- package/lib/typescript/commonjs/text-field/TextField.d.ts.map +1 -1
- package/lib/typescript/commonjs/theme/glass-colors.d.ts +67 -0
- package/lib/typescript/commonjs/theme/glass-colors.d.ts.map +1 -1
- package/lib/typescript/module/button/Button.d.ts.map +1 -1
- package/lib/typescript/module/button-group/ButtonGroup.d.ts.map +1 -1
- package/lib/typescript/module/button-group/types.d.ts +61 -5
- package/lib/typescript/module/button-group/types.d.ts.map +1 -1
- package/lib/typescript/module/control-surface/ControlSurface.d.ts +4 -0
- package/lib/typescript/module/control-surface/ControlSurface.d.ts.map +1 -0
- package/lib/typescript/module/control-surface/context.d.ts +21 -0
- package/lib/typescript/module/control-surface/context.d.ts.map +1 -0
- package/lib/typescript/module/control-surface/index.d.ts +4 -0
- package/lib/typescript/module/control-surface/index.d.ts.map +1 -0
- package/lib/typescript/module/control-surface/types.d.ts +37 -0
- package/lib/typescript/module/control-surface/types.d.ts.map +1 -0
- package/lib/typescript/module/field/Field.d.ts +1 -1
- package/lib/typescript/module/field/Field.d.ts.map +1 -1
- package/lib/typescript/module/field/context.d.ts +55 -0
- package/lib/typescript/module/field/context.d.ts.map +1 -0
- package/lib/typescript/module/field/index.d.ts +2 -0
- package/lib/typescript/module/field/index.d.ts.map +1 -1
- package/lib/typescript/module/field/types.d.ts +22 -3
- package/lib/typescript/module/field/types.d.ts.map +1 -1
- package/lib/typescript/module/floating/TriggerSlot.d.ts.map +1 -1
- package/lib/typescript/module/glass/GlassIsland.d.ts +4 -0
- package/lib/typescript/module/glass/GlassIsland.d.ts.map +1 -0
- package/lib/typescript/module/glass/GlassSurface.d.ts.map +1 -1
- package/lib/typescript/module/glass/index.d.ts +2 -1
- package/lib/typescript/module/glass/index.d.ts.map +1 -1
- package/lib/typescript/module/glass/types.d.ts +43 -0
- package/lib/typescript/module/glass/types.d.ts.map +1 -1
- package/lib/typescript/module/index.d.ts +3 -2
- package/lib/typescript/module/index.d.ts.map +1 -1
- package/lib/typescript/module/index.web.d.ts +3 -2
- package/lib/typescript/module/index.web.d.ts.map +1 -1
- package/lib/typescript/module/label/Label.d.ts.map +1 -1
- package/lib/typescript/module/label/types.d.ts +7 -1
- package/lib/typescript/module/label/types.d.ts.map +1 -1
- package/lib/typescript/module/layout/bottom-edge.d.ts.map +1 -1
- package/lib/typescript/module/layout/edge-store.d.ts +31 -0
- package/lib/typescript/module/layout/edge-store.d.ts.map +1 -0
- package/lib/typescript/module/layout/index.d.ts +8 -3
- package/lib/typescript/module/layout/index.d.ts.map +1 -1
- package/lib/typescript/module/layout/scroll-offset.d.ts +16 -0
- package/lib/typescript/module/layout/scroll-offset.d.ts.map +1 -0
- package/lib/typescript/module/layout/top-edge.d.ts +77 -0
- package/lib/typescript/module/layout/top-edge.d.ts.map +1 -0
- package/lib/typescript/module/message-bubble/MessageBubble.d.ts +1 -1
- package/lib/typescript/module/message-bubble/MessageBubble.d.ts.map +1 -1
- package/lib/typescript/module/message-bubble/index.d.ts +1 -1
- package/lib/typescript/module/message-bubble/index.d.ts.map +1 -1
- package/lib/typescript/module/message-bubble/types.d.ts +27 -5
- package/lib/typescript/module/message-bubble/types.d.ts.map +1 -1
- package/lib/typescript/module/page-header/EdgeScrim.d.ts +95 -0
- package/lib/typescript/module/page-header/EdgeScrim.d.ts.map +1 -0
- package/lib/typescript/module/page-header/PageHeader.d.ts +1 -1
- package/lib/typescript/module/page-header/PageHeader.d.ts.map +1 -1
- package/lib/typescript/module/page-header/index.d.ts +1 -1
- package/lib/typescript/module/page-header/index.d.ts.map +1 -1
- package/lib/typescript/module/page-header/types.d.ts +97 -10
- package/lib/typescript/module/page-header/types.d.ts.map +1 -1
- package/lib/typescript/module/provider/BloomProvider.d.ts.map +1 -1
- package/lib/typescript/module/styles/svg-id.d.ts +20 -0
- package/lib/typescript/module/styles/svg-id.d.ts.map +1 -0
- package/lib/typescript/module/text-field/TextField.d.ts.map +1 -1
- package/lib/typescript/module/theme/glass-colors.d.ts +67 -0
- package/lib/typescript/module/theme/glass-colors.d.ts.map +1 -1
- package/package.json +15 -1
- package/src/button/Button.tsx +10 -1
- package/src/button-group/ButtonGroup.tsx +146 -19
- package/src/button-group/types.ts +68 -5
- package/src/control-surface/ControlSurface.tsx +41 -0
- package/src/control-surface/context.ts +81 -0
- package/src/control-surface/index.ts +4 -0
- package/src/control-surface/types.ts +40 -0
- package/src/field/Field.tsx +84 -27
- package/src/field/context.ts +110 -0
- package/src/field/index.ts +3 -0
- package/src/field/types.ts +22 -3
- package/src/floating/TriggerSlot.tsx +35 -1
- package/src/glass/GlassIsland.tsx +109 -0
- package/src/glass/GlassSurface.tsx +26 -2
- package/src/glass/index.ts +3 -0
- package/src/glass/types.ts +45 -0
- package/src/index.ts +7 -0
- package/src/index.web.ts +7 -0
- package/src/label/Label.tsx +3 -1
- package/src/label/types.ts +7 -1
- package/src/layout/bottom-edge.tsx +3 -56
- package/src/layout/edge-store.ts +69 -0
- package/src/layout/index.ts +8 -3
- package/src/layout/scroll-offset.ts +76 -0
- package/src/layout/top-edge.tsx +109 -0
- package/src/message-bubble/MessageBubble.tsx +19 -5
- package/src/message-bubble/index.ts +1 -0
- package/src/message-bubble/types.ts +28 -5
- package/src/page-header/EdgeScrim.tsx +118 -0
- package/src/page-header/PageHeader.tsx +253 -61
- package/src/page-header/index.ts +9 -1
- package/src/page-header/types.ts +103 -10
- package/src/provider/BloomProvider.tsx +12 -1
- package/src/social-button/OxyMark.tsx +1 -1
- package/src/social-button/SocialButton.tsx +1 -1
- package/src/styles/svg-id.ts +23 -0
- package/src/text-field/TextField.tsx +44 -5
- package/src/theme/glass-colors.ts +80 -0
- package/lib/commonjs/social-button/use-svg-id.js +0 -16
- package/lib/commonjs/social-button/use-svg-id.js.map +0 -1
- package/lib/module/social-button/use-svg-id.js +0 -13
- package/lib/module/social-button/use-svg-id.js.map +0 -1
- package/lib/typescript/commonjs/social-button/use-svg-id.d.ts +0 -7
- package/lib/typescript/commonjs/social-button/use-svg-id.d.ts.map +0 -1
- package/lib/typescript/module/social-button/use-svg-id.d.ts +0 -7
- package/lib/typescript/module/social-button/use-svg-id.d.ts.map +0 -1
- package/src/social-button/use-svg-id.ts +0 -10
|
@@ -0,0 +1,169 @@
|
|
|
1
|
+
---
|
|
2
|
+
title: Migrating to 3.0
|
|
3
|
+
description: Every breaking change between @oxy.so/bloom 2.12.4 and 3.0.0 — PageHeader's floating default, the split of `transparent` into two props, and what is additive.
|
|
4
|
+
order: 2
|
|
5
|
+
---
|
|
6
|
+
|
|
7
|
+
# Migrating to 3.0
|
|
8
|
+
|
|
9
|
+
Bloom 3.0 is a small release with one large default change. `PageHeader` is a
|
|
10
|
+
floating header now — a back capsule, islands of grouped actions and a gradient
|
|
11
|
+
edge — where it used to be an opaque full-width strip. Everything else in this
|
|
12
|
+
release is additive.
|
|
13
|
+
|
|
14
|
+
Bloom keeps its clean-cut rule: there are no `@deprecated` aliases and no shims.
|
|
15
|
+
The flat bar is still here, but you ask for it by name.
|
|
16
|
+
|
|
17
|
+
## The short version
|
|
18
|
+
|
|
19
|
+
1. Install `@oxy.so/bloom@^3.0.0`.
|
|
20
|
+
2. Decide, per header: keep the bar (`presentation="bar"`) or take the islands.
|
|
21
|
+
3. If a header used `transparent` over media, add `titleReveal="onScroll"` —
|
|
22
|
+
`transparent` no longer hides the title.
|
|
23
|
+
4. Nothing else breaks. `tsc` will not catch either of the above, because both
|
|
24
|
+
are default changes rather than API removals; this guide is the checklist.
|
|
25
|
+
|
|
26
|
+
## 1. `PageHeader` defaults to `presentation="floating"`
|
|
27
|
+
|
|
28
|
+
A `<PageHeader>` with no `presentation` used to paint an opaque strip with a
|
|
29
|
+
hairline separator and a scroll-linked shadow. It now paints nothing across the
|
|
30
|
+
width: the back button sits in its own translucent capsule, the `actions` slot
|
|
31
|
+
is a glass control surface, the title floats between them, and a vertical
|
|
32
|
+
gradient of the page colour fades out below the whole thing.
|
|
33
|
+
|
|
34
|
+
**To keep exactly what you had:**
|
|
35
|
+
|
|
36
|
+
```diff
|
|
37
|
+
-<PageHeader title="Order #4821" onBack={router.back} />
|
|
38
|
+
+<PageHeader presentation="bar" title="Order #4821" onBack={router.back} />
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
That header is byte-for-byte what it was — same background, same separator, same
|
|
42
|
+
shadow, same back button, same geometry.
|
|
43
|
+
|
|
44
|
+
**To take the new one**, decide who reserves the space:
|
|
45
|
+
|
|
46
|
+
- `placement="inline"` (the default) leaves the header in layout, as before.
|
|
47
|
+
Nothing passes under it; the page colour shows through where the strip used to
|
|
48
|
+
be. This is the smallest step, and it is what an existing screen gets for free.
|
|
49
|
+
- `placement="overlay"` floats the header over the content, which is what the
|
|
50
|
+
islands are actually for. The content then has to clear it:
|
|
51
|
+
|
|
52
|
+
```tsx
|
|
53
|
+
import { useTopEdgeInset } from '@oxy.so/bloom/layout';
|
|
54
|
+
|
|
55
|
+
const inset = useTopEdgeInset();
|
|
56
|
+
<ScrollView contentContainerStyle={{ paddingTop: inset }}>…</ScrollView>
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
`BloomProvider` already mounts the registry. Do not add `insets.top` on top of
|
|
60
|
+
the claim — the header's own safe-area padding is already in it.
|
|
61
|
+
|
|
62
|
+
**Icon actions want `ButtonGroupItem`.** A `Button variant="secondary"` in a
|
|
63
|
+
floating header's `actions` paints its own opaque fill, which reads as a card
|
|
64
|
+
floating over the content. It still works and it is still legible; it is just
|
|
65
|
+
not the shape:
|
|
66
|
+
|
|
67
|
+
```diff
|
|
68
|
+
actions={
|
|
69
|
+
- <>
|
|
70
|
+
- <Button variant="secondary" iconOnly leadingIcon={RiSearchLine} accessibilityLabel="Search" />
|
|
71
|
+
- <Button variant="secondary" iconOnly leadingIcon={RiShare2Line} accessibilityLabel="Share" />
|
|
72
|
+
- </>
|
|
73
|
+
+ <ButtonGroup accessibilityLabel="Page actions">
|
|
74
|
+
+ <ButtonGroupItem iconOnly leadingIcon={RiSearchLine} accessibilityLabel="Search" />
|
|
75
|
+
+ <ButtonGroupItem iconOnly leadingIcon={RiShare2Line} accessibilityLabel="Share" />
|
|
76
|
+
+ </ButtonGroup>
|
|
77
|
+
}
|
|
78
|
+
```
|
|
79
|
+
|
|
80
|
+
A primary action keeps its own `Button` — an accent capsule beside the islands is
|
|
81
|
+
the intended shape for Save or Done.
|
|
82
|
+
|
|
83
|
+
## 2. `transparent` no longer hides the title
|
|
84
|
+
|
|
85
|
+
`transparent` did two things: it faded the bar's background in with scroll, and
|
|
86
|
+
it held the title back until the scroll arrived. The first is right for any
|
|
87
|
+
header over media; the second is right only when something else on screen
|
|
88
|
+
already names the page. A header that wanted one inherited both.
|
|
89
|
+
|
|
90
|
+
They are two props now:
|
|
91
|
+
|
|
92
|
+
```diff
|
|
93
|
+
-<PageHeader transparent scrollThreshold={264} title="Lisbon loft" />
|
|
94
|
+
+<PageHeader presentation="bar" transparent titleReveal="onScroll" scrollThreshold={264} title="Lisbon loft" />
|
|
95
|
+
```
|
|
96
|
+
|
|
97
|
+
If your header used `transparent` and you were happy for the title to show at
|
|
98
|
+
rest, drop `titleReveal` and you now get what you wanted.
|
|
99
|
+
|
|
100
|
+
## 3. `border` and `transparent` are `presentation="bar"` props
|
|
101
|
+
|
|
102
|
+
The floating presentation has no strip to fade and no separator to draw, so it
|
|
103
|
+
ignores both. Its counterpart is `scrim`:
|
|
104
|
+
|
|
105
|
+
| bar | floating |
|
|
106
|
+
| --- | --- |
|
|
107
|
+
| `border="auto"` | `scrim="auto"` — the gradient fades in with scroll |
|
|
108
|
+
| `border="always"` | `scrim="always"` — the gradient paints at rest |
|
|
109
|
+
| `border="none"` | `scrim="none"` — no gradient; the islands carry legibility alone |
|
|
110
|
+
| `transparent` | (the floating header is always transparent) |
|
|
111
|
+
|
|
112
|
+
A floating header on a screen that paints its own background colour also wants `scrimColor`: the ramp fades content into the surface it is leaving, and the header cannot read the pixel behind it.
|
|
113
|
+
|
|
114
|
+
## Everything else is additive
|
|
115
|
+
|
|
116
|
+
Nothing below removes or renames anything.
|
|
117
|
+
|
|
118
|
+
- **`@oxy.so/bloom/control-surface`** — the inherited presentation contract. A
|
|
119
|
+
container declares a material and a density once; the controls inside default
|
|
120
|
+
to it. See [Composition](/docs/composition).
|
|
121
|
+
- **`ButtonGroup` gains `variant`, `dividers`, and a `glass` material.** The
|
|
122
|
+
default is `solid`, which is what every existing group renders, unchanged.
|
|
123
|
+
- **`ButtonGroupItem` gains `hitSlop`, `variant` and the trigger contract**
|
|
124
|
+
(`onLongPress`, `aria-expanded`, `aria-haspopup`, `accessibilityRole`), so an
|
|
125
|
+
item can be an anchored family's `asChild` trigger. `onPress` now receives the
|
|
126
|
+
press event; a `() => void` handler still type-checks.
|
|
127
|
+
- **`@oxy.so/bloom/layout` gains `TopEdgeProvider` / `useTopEdgeInset` /
|
|
128
|
+
`useClaimTopEdge`** and **`ScrollOffsetProvider` / `useScrollOffset`**.
|
|
129
|
+
`BloomProvider` mounts `TopEdgeProvider` for you.
|
|
130
|
+
- **`Field` associates rather than only stacking.** It generates SSR-stable ids,
|
|
131
|
+
wires `aria-describedby`, `aria-invalid`, `aria-required` and the control's
|
|
132
|
+
accessible name, and gains `multiple` for a field holding several controls.
|
|
133
|
+
One behaviour change worth naming: **`Field disabled` now disables a control
|
|
134
|
+
that reads the field context** (today, `TextFieldInput`). It previously only
|
|
135
|
+
dimmed the label. If you were relying on a disabled-looking field with a live
|
|
136
|
+
input, that combination no longer exists.
|
|
137
|
+
- **`Label.htmlFor` accepts `null`**, meaning "this label names a group, not a
|
|
138
|
+
control". Omitting it still falls back to `nativeID`.
|
|
139
|
+
- **`asChild` triggers can be cancelled.** `event.preventDefault()` in the
|
|
140
|
+
child's own `onPress` stops the surface opening. A fragment child now throws
|
|
141
|
+
instead of rendering a dead trigger — if you were passing one, the trigger was
|
|
142
|
+
never working.
|
|
143
|
+
- **A neutral `chrome` glass role**, measured over the whole backdrop range. See
|
|
144
|
+
[Glass](/docs/glass).
|
|
145
|
+
|
|
146
|
+
## One fix that changes existing pixels on web
|
|
147
|
+
|
|
148
|
+
`<Svg style={StyleSheet.absoluteFill}>` does not fill anything on web. An
|
|
149
|
+
`<svg>` is a replaced element, so `width: auto` resolves to its intrinsic size
|
|
150
|
+
and an SVG without one falls back to CSS's default 300 × 150 — `left: 0;
|
|
151
|
+
right: 0` does not stretch it. Three surfaces were affected, all of them
|
|
152
|
+
shipping since before 3.0:
|
|
153
|
+
|
|
154
|
+
- **`Button`'s gradient** — a button wider than 300px stopped its gradient dead
|
|
155
|
+
at 300px, and every narrower one scaled the vertical ramp over 150px instead
|
|
156
|
+
of the button's own height, so only the top quarter of the gradient showed.
|
|
157
|
+
- **`GlassSurface`'s sheen** — the same, on every glass surface.
|
|
158
|
+
- The new header's scrim, which is how it was found.
|
|
159
|
+
|
|
160
|
+
All three now declare `width="100%" height="100%"`. **Native was never
|
|
161
|
+
affected** (react-native-svg lays its host view out with flexbox there), so this
|
|
162
|
+
changes web pixels only, in the direction of what the component always meant to
|
|
163
|
+
paint. Gate: `src/__tests__/svg-absolute-fill-size.test.ts`.
|
|
164
|
+
|
|
165
|
+
## What did not change
|
|
166
|
+
|
|
167
|
+
The theme, the tokens, the icon set, the typography, every other family's API,
|
|
168
|
+
and the license. If your app does not render a `PageHeader`, 3.0.0 is a drop-in
|
|
169
|
+
upgrade from 2.12.x.
|
package/docs/page-header.mdx
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
---
|
|
2
2
|
title: PageHeader
|
|
3
|
-
description: A screen's top
|
|
3
|
+
description: A screen's top chrome — a floating back capsule, islands of grouped actions and a gradient edge by default, or Bloom's original flat bar, with scroll-linked paint and safe-area handling on both platforms.
|
|
4
4
|
order: 105
|
|
5
5
|
---
|
|
6
6
|
|
|
@@ -8,74 +8,232 @@ order: 105
|
|
|
8
8
|
|
|
9
9
|
```tsx
|
|
10
10
|
import { PageHeader } from '@oxy.so/bloom/page-header';
|
|
11
|
+
import { ButtonGroup, ButtonGroupItem } from '@oxy.so/bloom/button-group';
|
|
11
12
|
|
|
12
13
|
<PageHeader
|
|
13
14
|
onBack={router.back}
|
|
14
|
-
title="
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
15
|
+
title="Lisbon loft"
|
|
16
|
+
actions={
|
|
17
|
+
<ButtonGroup accessibilityLabel="Page actions">
|
|
18
|
+
<ButtonGroupItem iconOnly leadingIcon={RiSearchLine} accessibilityLabel="Search" />
|
|
19
|
+
<ButtonGroupItem iconOnly leadingIcon={RiShare2Line} accessibilityLabel="Share" />
|
|
20
|
+
</ButtonGroup>
|
|
21
|
+
}
|
|
20
22
|
/>
|
|
21
23
|
```
|
|
22
24
|
|
|
23
25
|
Router-agnostic: the back button renders when `onBack` is set. Pass `router.back`, your app's safe-back helper, or omit it on a root screen (`router.canGoBack() ? router.back : undefined`).
|
|
24
26
|
|
|
27
|
+
## The default is floating
|
|
28
|
+
|
|
29
|
+
The header is no longer a strip. The back button sits in its own translucent capsule, the actions you declared as a group share one island, the title floats between them, and the whole thing ends in a soft vertical gradient rather than a hairline. Content passes under it.
|
|
30
|
+
|
|
31
|
+
```
|
|
32
|
+
( ← ) Lisbon loft ( ⌕ ↗ ) ( ⋯ )
|
|
33
|
+
|
|
34
|
+
its own island one island another
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
Three things that used to be one flag are three props now:
|
|
38
|
+
|
|
39
|
+
| prop | default | |
|
|
40
|
+
| --- | --- | --- |
|
|
41
|
+
| `presentation` | `'floating'` | `'bar'` is the original opaque strip. |
|
|
42
|
+
| `placement` | `'inline'` | `'overlay'` floats the header over the content. |
|
|
43
|
+
| `scrim` / `titleReveal` | `'auto'` / `'always'` | the edge effect and the title, decided separately. |
|
|
44
|
+
|
|
45
|
+
### The islands are yours to declare
|
|
46
|
+
|
|
47
|
+
The header never infers grouping from its children's types. The `actions` slot is wrapped in a `ControlSurface` with `material: 'glass'`, so a `ButtonGroup` placed there becomes one island with no prop written on it, two `ButtonGroup`s become two islands, and a `Button` keeps its own chrome — which is what a primary action in its own accent capsule should do.
|
|
48
|
+
|
|
49
|
+
```tsx
|
|
50
|
+
actions={
|
|
51
|
+
<>
|
|
52
|
+
<ButtonGroup accessibilityLabel="Page actions">
|
|
53
|
+
<ButtonGroupItem iconOnly leadingIcon={RiSearchLine} accessibilityLabel="Search" />
|
|
54
|
+
<ButtonGroupItem iconOnly leadingIcon={RiShare2Line} accessibilityLabel="Share" />
|
|
55
|
+
</ButtonGroup>
|
|
56
|
+
<Button variant="primary" size="medium">Save</Button>
|
|
57
|
+
</>
|
|
58
|
+
}
|
|
59
|
+
```
|
|
60
|
+
|
|
61
|
+
For an icon action that should sit flush on an island, use `ButtonGroupItem` — a `Button` paints its own fill and would read as a card inside the capsule. The full rule is in [Composition](/docs/composition).
|
|
62
|
+
|
|
63
|
+
### The edge effect
|
|
64
|
+
|
|
65
|
+
A vertical gradient of the page colour, fading to nothing **below** the header's own box — the ramp is 1.55× the header's height, so it finishes past the layout rather than at it. That overhang is the point: a translucent rectangle ends at its own bottom edge, and that edge is a line across the screen whether or not it is drawn.
|
|
66
|
+
|
|
67
|
+
It is an opacity ramp of one flat colour, not a blur of varying intensity. `backdrop-filter` and `expo-blur` both take a single radius for a whole surface; a real blur falloff needs the stacked layers `progressive-blur` uses, and is not what this is.
|
|
68
|
+
|
|
69
|
+
`scrim="auto"` fades it in over `[0, scrollThreshold]`, so it appears when content starts passing under. `"always"` paints it at rest — for a header born over a photograph. `"none"` removes it and leaves legibility to the islands alone.
|
|
70
|
+
|
|
71
|
+
**The colour is the PAGE's, and the header cannot read it.** The ramp's job is to fade content into the surface it is leaving, so its colour has to be that surface — `theme.colors.background` by default. A screen that paints its own background (a tinted section, a brand panel, a dark surface inside a light app) hands it over with `scrimColor`; without it the ramp is a wash of the wrong hue rather than a fade. Pass an **opaque** colour: the alpha belongs to the ramp, and a colour carrying its own would multiply with it.
|
|
72
|
+
|
|
73
|
+
**The islands protect themselves; the title does not.** An island carries its own material and is legible over both ends of the backdrop range (measured, in [Glass](/docs/glass)). A title is bare text on whatever is behind it, and with `scrim="auto"` there is nothing behind it until the page scrolls. So a header that sits over a photograph **at rest** needs one of two explicit answers:
|
|
74
|
+
|
|
75
|
+
- `titleReveal="onScroll"` — the photo already names the screen, and the title arrives with the scrim. This is what the hero pattern wants.
|
|
76
|
+
- `scrim="always"` — the title is the name of the screen and must be readable from the first frame, so the gradient is there from the first frame too.
|
|
77
|
+
|
|
78
|
+
Leaving both at their defaults over a hero photo is the one combination that reads as a bug, and it is a combination the header cannot resolve for you: it does not know what is behind it.
|
|
79
|
+
|
|
25
80
|
## Props
|
|
26
81
|
|
|
27
82
|
| Prop | Default | |
|
|
28
83
|
| --- | --- | --- |
|
|
29
84
|
| `title` | — | A string is the heading (`role="heading"`, `aria-level={headingLevel}`); a node renders as-is and owns its semantics. |
|
|
30
85
|
| `subtitle` | — | A string is a secondary line; a node renders as-is. |
|
|
31
|
-
| `titleAlign` | `'start'` | `'center'` centres the title on the
|
|
86
|
+
| `titleAlign` | `'start'` | `'center'` centres the title on the container whatever the two sides hold. |
|
|
32
87
|
| `headingLevel` | `1` | |
|
|
88
|
+
| `titleReveal` | `'always'` | `'onScroll'` holds the title back and fades it in — for a header over a hero the photo already names. |
|
|
89
|
+
| `presentation` | `'floating'` | `'bar'` for the flat strip. |
|
|
90
|
+
| `placement` | `'inline'` | `'overlay'` positions the header over the content and claims the top edge. |
|
|
33
91
|
| `onBack` / `backLabel` | — / `"Back"` | `backLabel` is the button's accessible name — localise it. |
|
|
34
|
-
| `leading` | — | After the back
|
|
35
|
-
| `actions` | — | End of the bar
|
|
36
|
-
| `
|
|
37
|
-
| `
|
|
38
|
-
| `
|
|
39
|
-
| `
|
|
40
|
-
| `
|
|
92
|
+
| `leading` | — | After the back capsule, before the title (an avatar, a logo). |
|
|
93
|
+
| `actions` | — | End of the bar. Floating: wrapped in a glass `ControlSurface`. |
|
|
94
|
+
| `scrim` | `'auto'` | `presentation="floating"` only. `auto` \| `always` \| `none`. |
|
|
95
|
+
| `scrimColor` | `theme.colors.background` | The opaque colour the edge effect fades from. Pass it when the screen paints a background the theme does not know about. |
|
|
96
|
+
| `border` | `'auto'` | `presentation="bar"` only. `auto` fades the separator in with scroll; `always`; `none`. |
|
|
97
|
+
| `transparent` | `false` | `presentation="bar"` only: background and shadow fade in with scroll. It no longer hides the title. |
|
|
98
|
+
| `scrollY` | — | A Reanimated `SharedValue<number>`. Omitted, the header reads `ScrollOffsetProvider`, then `window.scrollY` on web. |
|
|
99
|
+
| `scrollThreshold` | `20` | The offset over which the scroll-linked paint arrives. Over a hero, use the hero height minus the bar. |
|
|
100
|
+
| `sticky` | `true` | Web, `placement="inline"`: `position: sticky; top: 0`. No effect on native or on an overlay. |
|
|
41
101
|
| `safeArea` | native `true`, web `false` | Pads the top by the safe-area inset (read from `SafeAreaInsetsContext`; no provider → 0). |
|
|
42
102
|
|
|
43
103
|
## Look
|
|
44
104
|
|
|
45
|
-
- Bar min-height 56; side inset 16 below `sm`, 24 from `sm
|
|
46
|
-
-
|
|
47
|
-
-
|
|
48
|
-
-
|
|
49
|
-
-
|
|
105
|
+
- Bar min-height 56; side inset 16 below `sm`, 24 from `sm` — measured against the header's **container**, not the window, so a narrow desktop panel gets the narrow inset.
|
|
106
|
+
- Islands are 36 tall (a 34 control plus the hairline), 8 apart. The back capsule carries 4px of hit slop on every side, which makes it a 44pt target with nothing beside it to steal from. **A grouped item is 34 × 34 with no slop** — items in a group are adjacent, and slop on one overlaps its neighbour. Where the 44pt floor matters for every action, give each one its own island instead of grouping them.
|
|
107
|
+
- Island material: rung 1 of the surface ladder (the fill a card and a menu panel paint) at the chrome alpha — 0.72 light, 0.80 dark. See [Glass](/docs/glass) for what those two numbers buy and cost.
|
|
108
|
+
- Title `headline-medium` text-primary, subtitle `body-2-regular` secondary. Both truncate to one line.
|
|
109
|
+
- `bar`: background `background/full` (card; dark neutral-925), separator 1px (neutral-200; dark neutral-800), shadow `shadow-xs` once scrolled.
|
|
110
|
+
- No press scale. Every fade is scroll-linked, not timed, so there is no motion to reduce.
|
|
111
|
+
- **RTL** is structural rather than handled: the bar is a `flexDirection: 'row'`, which React Native mirrors, and the centred title's inset is the *wider* of the two sides applied to *both*, so it is symmetric by construction and has no side to get backwards.
|
|
112
|
+
|
|
113
|
+
## Placement, and who reserves the space
|
|
114
|
+
|
|
115
|
+
**`inline`** — the header is a sibling above the content in a column. It occupies layout; nothing passes under it and nothing needs padding. On web it is `position: sticky` unless you pass `sticky={false}`.
|
|
116
|
+
|
|
117
|
+
**`overlay`** — the header is absolutely positioned over the content, which starts at the top of the container and scrolls under the islands. The header then claims its measured height on the top-edge registry, and the content reads it:
|
|
118
|
+
|
|
119
|
+
```tsx
|
|
120
|
+
import { useTopEdgeInset } from '@oxy.so/bloom/layout';
|
|
121
|
+
|
|
122
|
+
function Screen() {
|
|
123
|
+
const inset = useTopEdgeInset();
|
|
124
|
+
return (
|
|
125
|
+
<View style={{ flex: 1 }}>
|
|
126
|
+
<ScrollView contentContainerStyle={{ paddingTop: inset }}>…</ScrollView>
|
|
127
|
+
<PageHeader title="Inbox" onBack={router.back} placement="overlay" actions={…} />
|
|
128
|
+
</View>
|
|
129
|
+
);
|
|
130
|
+
}
|
|
131
|
+
```
|
|
132
|
+
|
|
133
|
+
`BloomProvider` already mounts `TopEdgeProvider`. The height is **measured**, not computed from a constant plus the insets — a subtitle, an enlarged font and a notch all move it, and a computed height fails silently, with content starting a few points under the islands as if that were the design.
|
|
134
|
+
|
|
135
|
+
The claim registers in an effect, so a reader mounted in the same commit sees `0` on its first render. The header narrows that to one frame by claiming its resting height (safe area + 56) immediately.
|
|
136
|
+
|
|
137
|
+
Apply the safe area **once**: the header pads itself by `insets.top` on native, and the content's padding comes from the claim, which already includes it. Do not add `insets.top` again in the scroll container.
|
|
50
138
|
|
|
51
139
|
## Scroll
|
|
52
140
|
|
|
53
|
-
|
|
141
|
+
Everything scroll-linked interpolates over `[0, scrollThreshold]` of the resolved offset. The header resolves it in this order:
|
|
142
|
+
|
|
143
|
+
1. the `scrollY` prop,
|
|
144
|
+
2. the nearest `ScrollOffsetProvider` (`@oxy.so/bloom/layout`),
|
|
145
|
+
3. `window.scrollY` — **web only**.
|
|
54
146
|
|
|
55
|
-
|
|
56
|
-
- **A scroll container (any platform):** pass the offset.
|
|
147
|
+
On native with none of the three, the header stays at rest.
|
|
57
148
|
|
|
58
149
|
```tsx
|
|
150
|
+
import { ScrollOffsetProvider } from '@oxy.so/bloom/layout';
|
|
151
|
+
|
|
59
152
|
const scrollY = useSharedValue(0);
|
|
60
|
-
const onScroll = useAnimatedScrollHandler(
|
|
153
|
+
const onScroll = useAnimatedScrollHandler(
|
|
154
|
+
{ onScroll: (e) => { scrollY.value = e.contentOffset.y; } },
|
|
155
|
+
[scrollY],
|
|
156
|
+
);
|
|
61
157
|
|
|
62
|
-
<
|
|
63
|
-
<
|
|
158
|
+
<ScrollOffsetProvider value={scrollY}>
|
|
159
|
+
<PageHeader title="Inbox" onBack={back} sticky={false} />
|
|
160
|
+
<Animated.ScrollView onScroll={onScroll} scrollEventThrottle={16}>…</Animated.ScrollView>
|
|
161
|
+
</ScrollOffsetProvider>
|
|
64
162
|
```
|
|
65
163
|
|
|
66
|
-
|
|
164
|
+
The context is what makes a desktop panel work: `window.scrollY` never moves inside a fixed shell, so a header following it looked deliberately inert. Name `scrollY` in the handler's dependency array — without the worklets Babel plugin (Storybook, some web builds) a shared value missing from it never updates.
|
|
67
165
|
|
|
68
|
-
**Over media
|
|
166
|
+
**Over media:** let the photo start under the chrome (`placement="overlay"`, or a negative margin on the hero), and set `scrollThreshold` to the hero height minus the bar so the scrim arrives as the photo leaves. Add `titleReveal="onScroll"` if the photo already names the screen.
|
|
69
167
|
|
|
70
168
|
## Accessibility
|
|
71
169
|
|
|
72
170
|
- The title is a `heading` (level 1 by default: the page header titles the page).
|
|
73
171
|
- The container carries no landmark role. `role="banner"` would be one banner per header, and an app shell already owns the page's banner; a page header inside `main` is not a landmark in HTML either.
|
|
74
|
-
- The back button is named by `backLabel`.
|
|
172
|
+
- The back button is named by `backLabel`. Its island carries no `role="group"` — a group of one is a container a screen reader steps into for nothing.
|
|
173
|
+
- The gradient is `pointerEvents: none` and is not in the accessibility tree. The bar and the actions row are `box-none`, so the gaps between islands stay transparent to touch — a floating header covers content it does not own, and an invisible rectangle that swallowed presses across the screen would be total and silent.
|
|
174
|
+
- **Reduced transparency is not yet wired.** The islands are translucent on every device. Where the platform reports a reduce-transparency preference, Bloom does not currently read it; the material is legible over both ends of the backdrop range (see [Glass](/docs/glass)), but that is a legibility argument, not the preference being honoured.
|
|
175
|
+
|
|
176
|
+
## Platform notes
|
|
177
|
+
|
|
178
|
+
- **Web.** The material is `backdrop-filter` through `expo-blur`'s real web build; the gradient is `react-native-svg`. A browser without `backdrop-filter` still gets the tint and the hairline — the island keeps its geometry and its legibility, it just stops blurring.
|
|
179
|
+
- **iOS.** `expo-blur` provides the radius. `expo-glass-effect` is NOT used here; the tab bar is the only family on it.
|
|
180
|
+
- **Android.** The islands paint tint, hairline, sheen and rim with **no blur**, deliberately. `expo-blur` needs a `blurTarget` pointing at a `BlurTargetView` wrapping the content to blur, and a `BlurView` that is a descendant of the view it points at takes the process down with SIGSEGV — which is the only topology available to a surface that fills its own caller. The mechanism is in [Glass](/docs/glass); it has not changed for this header.
|
|
181
|
+
|
|
182
|
+
## What was measured, and where
|
|
183
|
+
|
|
184
|
+
Everything about a translucent surface that matters is a property of **painted pixels**, and jest sees markup. `scripts/verify-header-islands.mjs` drives a real Chrome over the Storybook stories, screenshots them, reloads the PNG into the page and samples a canvas — the round trip being the only way to read the composited result of a `backdrop-filter`, which exists nowhere in the DOM.
|
|
185
|
+
|
|
186
|
+
```bash
|
|
187
|
+
bun run storybook
|
|
188
|
+
node scripts/verify-header-islands.mjs --out docs/page-header-islands.png
|
|
189
|
+
```
|
|
190
|
+
|
|
191
|
+
Measured at 900 × 780, device scale 1, on the `teal` preset:
|
|
192
|
+
|
|
193
|
+
| property | how | result |
|
|
194
|
+
| --- | --- | --- |
|
|
195
|
+
| islands, not a strip | runs of chrome ≥20px along a line through the bar | **2** light (48, 126), **3** dark (36, 70, 36) |
|
|
196
|
+
| the island is translucent | the same back capsule over the page and over a photograph | moved **35** of 255 |
|
|
197
|
+
| the edge ends in nothing | the ramp against a deliberately mismatched scrim colour | travelled **67** of 255 |
|
|
198
|
+
| no horizontal cut | the largest single-row step down that ramp | **2** of 255 |
|
|
199
|
+
| a matched scrim is invisible | the same ramp with `scrimColor` = the page colour | travelled **0** |
|
|
200
|
+
| control | the same row sampler on `presentation="bar"` | **0** runs — a strip is one colour |
|
|
201
|
+
|
|
202
|
+
Three of those readings deserve their real explanation rather than a round number.
|
|
203
|
+
|
|
204
|
+
The ramp is measured against a **deliberately mismatched** `scrimColor`, because that is the only configuration in which its shape is visible at all: a correctly configured scrim is the page's own colour, so over the page it paints nothing and its profile is a flat line. The row below it measures exactly that — the same header, the same `scrim="always"`, the colour handed over, travelling 0.
|
|
205
|
+
|
|
206
|
+
In **light** mode the sampler reports two island runs, not three: the two action islands are 8px apart and their drop shadows meet in the gap, so at a 1-level tolerance the gap is not backdrop. The gap is visible; it is not *measurably* backdrop. In **dark** mode, where the shadow is weaker against a dark page, all three separate cleanly.
|
|
207
|
+
|
|
208
|
+
And the island fill in light mode is the card fill over a near-white page — the same relation a `Card` has to the page, read by its hairline and shadow rather than by its fill. That is deliberate, and it is why an island reads as Bloom chrome rather than as a new material.
|
|
209
|
+
|
|
210
|
+

|
|
211
|
+
|
|
212
|
+

|
|
213
|
+
|
|
214
|
+

|
|
215
|
+
|
|
216
|
+

|
|
217
|
+
|
|
218
|
+
**Not verified on a device.** Every number above is Chrome on Linux. iOS and Android have not been run for this change: the material is `expo-blur` on both and is unchanged from the `GlassSurface` the library already shipped, but the geometry, the safe-area padding, the top-edge claim and the scroll linkage have only been exercised in jest and in a browser. Android additionally paints **no blur at all** here, by the design described above, so what a device would show is the tint, the hairline, the sheen and the rim.
|
|
75
219
|
|
|
76
220
|
## Not included
|
|
77
221
|
|
|
78
|
-
- **iOS large title.** A large title that collapses into the bar needs to live inside the scroll content (so it scrolls under the
|
|
222
|
+
- **iOS large title.** A large title that collapses into the bar needs to live inside the scroll content (so it scrolls under the chrome) while the chrome lives outside it; a standalone header cannot own both without making content move at twice the scroll speed on native. `Dialog`'s own header ([Dialog](/docs/dialog)) does it because the Dialog owns its scroller.
|
|
223
|
+
- **Adaptive overflow.** Actions that do not fit are not collapsed into a menu. Declare fewer islands, or a menu of your own.
|
|
224
|
+
|
|
225
|
+
## Migrating to 3.0
|
|
226
|
+
|
|
227
|
+
**The default presentation changed.** A `<PageHeader>` with no `presentation` was a flat opaque bar and is now floating. Two ways forward:
|
|
228
|
+
|
|
229
|
+
- Keep the old look: add `presentation="bar"`. Everything else about that header is byte-for-byte what it was.
|
|
230
|
+
- Take the new one: the header is transparent, so make sure something is behind it. Either leave `placement="inline"` (the page colour shows through, which looks like the old bar minus the strip) or move to `placement="overlay"` and pad the content with `useTopEdgeInset()`.
|
|
231
|
+
|
|
232
|
+
**`transparent` no longer hides the title.** It faded the background in with scroll AND held the title back; those are `transparent` and `titleReveal="onScroll"` now. A header that wants the old combined behaviour passes both. A header that only ever wanted the fading background gets it without losing its title.
|
|
233
|
+
|
|
234
|
+
**`border` and `transparent` apply to `presentation="bar"` only.** They are ignored by the floating presentation, which has no strip and no separator; `scrim` is its counterpart.
|
|
235
|
+
|
|
236
|
+
**Icon actions want `ButtonGroupItem`.** A `Button variant="secondary"` in a floating header's actions paints its own opaque fill, which reads as a card floating over the content. It still works; it is just not the shape the islands are for.
|
|
79
237
|
|
|
80
238
|
## Migrating from app headers
|
|
81
239
|
|
|
@@ -89,13 +247,11 @@ Mention, Allo and Homiio each hand-roll a `Header` with an `options` object. The
|
|
|
89
247
|
| `options.showBackButton` (+ `useSafeBack` / `router.back` inside) | `onBack={safeBack}` — omit to hide |
|
|
90
248
|
| Homiio `showBackButton && router.canGoBack()` | `onBack={router.canGoBack() ? router.back : undefined}` |
|
|
91
249
|
| `options.leftComponents: ReactNode[]` | `leading={<>…</>}` |
|
|
92
|
-
| `options.rightComponents: ReactNode[]` | `actions={<>…</>}` |
|
|
93
|
-
| `hideBottomBorder` | `
|
|
250
|
+
| `options.rightComponents: ReactNode[]` | `actions={<>…</>}`, grouped into `ButtonGroup`s |
|
|
251
|
+
| `hideBottomBorder` | `presentation="bar"` + `border="none"` |
|
|
94
252
|
| `disableSticky` | `sticky={false}` |
|
|
95
253
|
| web `window.scrollY > 20` sticky state | built in (`scrollThreshold`, default 20) |
|
|
96
|
-
| Homiio `options.transparent` / `options.scrollThreshold` | `transparent` / `scrollThreshold` |
|
|
97
|
-
| Homiio `scrollY` | `scrollY` |
|
|
254
|
+
| Homiio `options.transparent` / `options.scrollThreshold` | `presentation="bar" transparent titleReveal="onScroll"` / `scrollThreshold` |
|
|
255
|
+
| Homiio `scrollY` | `scrollY`, or a `ScrollOffsetProvider` around the screen |
|
|
98
256
|
| Homiio `useSafeAreaInsets().top` | `safeArea` (default on native) |
|
|
99
257
|
| Mention `options.headerTitleStyle` | pass a node `title` |
|
|
100
|
-
|
|
101
|
-
Two visual changes: the title is `headline-medium` (16/22, 500) instead of 18/800, and the back button is a pill icon button instead of a bare arrow.
|
|
@@ -132,6 +132,8 @@ const ButtonGradientFill = /*#__PURE__*/(0, _react.memo)(function ButtonGradient
|
|
|
132
132
|
overflow: 'hidden'
|
|
133
133
|
}],
|
|
134
134
|
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
|
|
135
|
+
width: "100%",
|
|
136
|
+
height: "100%",
|
|
135
137
|
style: _reactNative.StyleSheet.absoluteFill,
|
|
136
138
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Defs, {
|
|
137
139
|
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.LinearGradient, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeSvg","_reactNativeCss","_useTheme","_Typography","_useInteractionState","_shared","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","SIZE_HIT_SLOP","xs","top","bottom","left","right","small","medium","large","LINK_HIT_SLOP","SQUARE_HIT_SLOP","ButtonPressable","Pressable","StyledPressable","styled","className","buttonGradientIdCounter","ButtonGradientFill","memo","gradient","radius","id","useMemo","jsx","View","pointerEvents","style","StyleSheet","absoluteFill","borderRadius","overflow","children","jsxs","Defs","LinearGradient","x1","y1","x2","y2","Stop","offset","stopColor","Rect","x","y","width","height","fill","ButtonComponent","onPress","disabled","variant","variantProp","size","sizeProp","textStyle","icon","iconPosition","leadingIcon","LeadingIcon","trailingIcon","TrailingIcon","iconOnly","linkTone","underline","textVariant","numberOfLines","href","loading","loadingColor","accessibilityLabel","accessibilityHint","accessibilityRole","hitSlop","testID","ariaExpanded","ariaHasPopup","theme","useTheme","BUTTON_SIZE_ALIAS","geometry","BUTTON_GEOMETRY","isIconVariant","isSquare","isText","isLink","isInteractionBlocked","iconSize","ICON_BUTTON_ICON_SIZE","palette","resolveButtonPalette","underlineMode","resolveButtonUnderline","state","pressed","onIn","onPressedIn","onOut","onPressedOut","useInteractionState","hovered","onHoveredIn","onHoveredOut","handlePressIn","undefined","handlePressOut","paint","active","hover","rest","baseStyles","styles","alignItems","justifyContent","flexDirection","gap","paddingHorizontal","BUTTON_RADIUS","borderWidth","borderColor","border","backgroundColor","background","shadow","boxShadow","BUTTON_SHADOW","isDark","disabledOpacity","opacity","iconOnlyWidth","paddingVertical","LINK_BUTTON_GAP","computedTextStyle","labelPaddingHorizontal","color","foreground","textDecorationLine","defaultHitSlop","IconFromProp","isIconComponent","iconNode","content","Fragment","Text","type","handlePress","Linking","openURL","onPressIn","onPressOut","onHoverIn","onHoverOut","loadingHiddenContent","importantForAccessibility","accessibilityElementsHidden","loadingOverlay","ActivityIndicator","create","Button","exports","displayName","PrimaryButton","props","SecondaryButton","IconButton","GhostButton","InverseButton","TextButton","OutlineButton","LinkButton","DestructiveButton"],"sourceRoot":"../../../src","sources":["button/Button.tsx"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeSvg","_reactNativeCss","_useTheme","_Typography","_useInteractionState","_shared","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","SIZE_HIT_SLOP","xs","top","bottom","left","right","small","medium","large","LINK_HIT_SLOP","SQUARE_HIT_SLOP","ButtonPressable","Pressable","StyledPressable","styled","className","buttonGradientIdCounter","ButtonGradientFill","memo","gradient","radius","id","useMemo","jsx","View","pointerEvents","style","StyleSheet","absoluteFill","borderRadius","overflow","children","jsxs","width","height","Defs","LinearGradient","x1","y1","x2","y2","Stop","offset","stopColor","Rect","x","y","fill","ButtonComponent","onPress","disabled","variant","variantProp","size","sizeProp","textStyle","icon","iconPosition","leadingIcon","LeadingIcon","trailingIcon","TrailingIcon","iconOnly","linkTone","underline","textVariant","numberOfLines","href","loading","loadingColor","accessibilityLabel","accessibilityHint","accessibilityRole","hitSlop","testID","ariaExpanded","ariaHasPopup","theme","useTheme","BUTTON_SIZE_ALIAS","geometry","BUTTON_GEOMETRY","isIconVariant","isSquare","isText","isLink","isInteractionBlocked","iconSize","ICON_BUTTON_ICON_SIZE","palette","resolveButtonPalette","underlineMode","resolveButtonUnderline","state","pressed","onIn","onPressedIn","onOut","onPressedOut","useInteractionState","hovered","onHoveredIn","onHoveredOut","handlePressIn","undefined","handlePressOut","paint","active","hover","rest","baseStyles","styles","alignItems","justifyContent","flexDirection","gap","paddingHorizontal","BUTTON_RADIUS","borderWidth","borderColor","border","backgroundColor","background","shadow","boxShadow","BUTTON_SHADOW","isDark","disabledOpacity","opacity","iconOnlyWidth","paddingVertical","LINK_BUTTON_GAP","computedTextStyle","labelPaddingHorizontal","color","foreground","textDecorationLine","defaultHitSlop","IconFromProp","isIconComponent","iconNode","content","Fragment","Text","type","handlePress","Linking","openURL","onPressIn","onPressOut","onHoverIn","onHoverOut","loadingHiddenContent","importantForAccessibility","accessibilityElementsHidden","loadingOverlay","ActivityIndicator","create","Button","exports","displayName","PrimaryButton","props","SecondaryButton","IconButton","GhostButton","InverseButton","TextButton","OutlineButton","LinkButton","DestructiveButton"],"sourceRoot":"../../../src","sources":["button/Button.tsx"],"mappings":"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","ignoreList":[]}
|