@oxy.so/bloom 2.12.4 → 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/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/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/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 +2 -1
- package/lib/typescript/commonjs/index.d.ts.map +1 -1
- package/lib/typescript/commonjs/index.web.d.ts +2 -1
- 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/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 +2 -1
- package/lib/typescript/module/index.d.ts.map +1 -1
- package/lib/typescript/module/index.web.d.ts +2 -1
- 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/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 +6 -0
- package/src/index.web.ts +6 -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/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,107 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.GlassIsland = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
var _index = require("../control-surface/index.js");
|
|
10
|
+
var _shadows = require("../design-tokens/shadows");
|
|
11
|
+
var _surfaceLevels = require("../styles/surface-levels.js");
|
|
12
|
+
var _tokens = require("../styles/tokens.js");
|
|
13
|
+
var _glassColors = require("../theme/glass-colors.js");
|
|
14
|
+
var _useTheme = require("../theme/use-theme.js");
|
|
15
|
+
var _GlassSurface = require("./GlassSurface.js");
|
|
16
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
17
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
18
|
+
/**
|
|
19
|
+
* An ISLAND: one translucent, rounded container holding one or more controls
|
|
20
|
+
* that float over content the container does not own.
|
|
21
|
+
*
|
|
22
|
+
* ── WHY THIS EXISTS RATHER THAN A SECOND MATERIAL ───────────────────────────
|
|
23
|
+
*
|
|
24
|
+
* `GlassSurface` is the material — blur, tint, sheen, lit rim — and by its own
|
|
25
|
+
* contract it does NOT own the geometry, the hairline or the shadow: it clips
|
|
26
|
+
* itself, and a shadow drawn on a clipping node is clipped away on iOS. So
|
|
27
|
+
* every caller that wants a floating pane has to assemble the same four things
|
|
28
|
+
* in the same order. Two callers now want exactly that assembly — a
|
|
29
|
+
* `ButtonGroup` in its glass variant, and a page header's back capsule — which
|
|
30
|
+
* is the second real need that justifies writing it once.
|
|
31
|
+
*
|
|
32
|
+
* ── THE FILL IS THE LADDER'S, NOT A LOCAL PALETTE ───────────────────────────
|
|
33
|
+
*
|
|
34
|
+
* The island paints rung 1 of `styles/surface-levels` — byte-for-byte the fill
|
|
35
|
+
* a card and a menu panel already paint — at the CHROME alpha. That is the
|
|
36
|
+
* whole reason it reads as Bloom rather than as a fourth material invented for
|
|
37
|
+
* headers, and it is why a preset change moves islands with everything else.
|
|
38
|
+
*
|
|
39
|
+
* ── WHAT IT TELLS ITS CHILDREN ──────────────────────────────────────────────
|
|
40
|
+
*
|
|
41
|
+
* It mounts a `ControlSurface` with `material: 'glass'`, so a control inside it
|
|
42
|
+
* paints flush — no second fill, no second blur — without the caller writing
|
|
43
|
+
* `variant="glass"` on every one. The nesting rule is the material's, not a
|
|
44
|
+
* preference: a translucent pane inside a translucent pane composites two
|
|
45
|
+
* alphas and two blurs for one pane's worth of depth, and on Android the second
|
|
46
|
+
* blur is not available at all.
|
|
47
|
+
*
|
|
48
|
+
* It does NOT publish a `SurfaceLevelProvider`. A published surface fill is a
|
|
49
|
+
* promise that a descendant can read the pixel it lands on, and the pixel here
|
|
50
|
+
* depends on content Bloom cannot see.
|
|
51
|
+
*
|
|
52
|
+
* ── NO `overflow: hidden` ───────────────────────────────────────────────────
|
|
53
|
+
*
|
|
54
|
+
* Deliberately absent, twice over: `GlassSurface` clips its own layers, and
|
|
55
|
+
* `clipsToBounds` on iOS would clip this box's drop shadow away. Controls
|
|
56
|
+
* inside round their own press highlight instead of relying on the island to
|
|
57
|
+
* cut it.
|
|
58
|
+
*/
|
|
59
|
+
const GlassIslandComponent = ({
|
|
60
|
+
children,
|
|
61
|
+
radius = _tokens.borderRadius.full,
|
|
62
|
+
role,
|
|
63
|
+
accessibilityLabel,
|
|
64
|
+
sheen = true,
|
|
65
|
+
style,
|
|
66
|
+
testID
|
|
67
|
+
}) => {
|
|
68
|
+
const theme = (0, _useTheme.useTheme)();
|
|
69
|
+
const paint = (0, _react.useMemo)(() => {
|
|
70
|
+
const level = (0, _surfaceLevels.resolveSurfaceLevel)(theme, 1);
|
|
71
|
+
return {
|
|
72
|
+
fill: level.background,
|
|
73
|
+
glass: (0, _glassColors.resolveChromeGlassColors)(level.background, level.border, theme.isDark)
|
|
74
|
+
};
|
|
75
|
+
}, [theme]);
|
|
76
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ControlSurface, {
|
|
77
|
+
material: "glass",
|
|
78
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
|
|
79
|
+
role: role,
|
|
80
|
+
accessibilityLabel: accessibilityLabel,
|
|
81
|
+
testID: testID,
|
|
82
|
+
style: [styles.island, {
|
|
83
|
+
borderRadius: radius,
|
|
84
|
+
borderWidth: paint.glass.hairlineWidth,
|
|
85
|
+
borderColor: paint.glass.hairline
|
|
86
|
+
}, (0, _shadows.bloomShadowStyle)('glass'), style],
|
|
87
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_GlassSurface.GlassSurface, {
|
|
88
|
+
fill: paint.fill,
|
|
89
|
+
material: "chrome",
|
|
90
|
+
radius: radius,
|
|
91
|
+
sheen: sheen,
|
|
92
|
+
testID: testID ? `${testID}-material` : undefined
|
|
93
|
+
}), children]
|
|
94
|
+
})
|
|
95
|
+
});
|
|
96
|
+
};
|
|
97
|
+
const styles = _reactNative.StyleSheet.create({
|
|
98
|
+
island: {
|
|
99
|
+
flexDirection: 'row',
|
|
100
|
+
alignItems: 'stretch',
|
|
101
|
+
alignSelf: 'flex-start',
|
|
102
|
+
position: 'relative'
|
|
103
|
+
}
|
|
104
|
+
});
|
|
105
|
+
const GlassIsland = exports.GlassIsland = /*#__PURE__*/(0, _react.memo)(GlassIslandComponent);
|
|
106
|
+
GlassIsland.displayName = 'GlassIsland';
|
|
107
|
+
//# sourceMappingURL=GlassIsland.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_index","_shadows","_surfaceLevels","_tokens","_glassColors","_useTheme","_GlassSurface","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","GlassIslandComponent","children","radius","borderRadius","full","role","accessibilityLabel","sheen","style","testID","theme","useTheme","paint","useMemo","level","resolveSurfaceLevel","fill","background","glass","resolveChromeGlassColors","border","isDark","jsx","ControlSurface","material","jsxs","View","styles","island","borderWidth","hairlineWidth","borderColor","hairline","bloomShadowStyle","GlassSurface","undefined","StyleSheet","create","flexDirection","alignItems","alignSelf","position","GlassIsland","exports","memo","displayName"],"sourceRoot":"../../../src","sources":["glass/GlassIsland.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -53,12 +53,13 @@ let glassSheenIdCounter = 0;
|
|
|
53
53
|
const GlassSurfaceComponent = ({
|
|
54
54
|
fill,
|
|
55
55
|
radius,
|
|
56
|
+
material = 'accent',
|
|
56
57
|
sheen = true,
|
|
57
58
|
style,
|
|
58
59
|
testID
|
|
59
60
|
}) => {
|
|
60
61
|
const theme = (0, _useTheme.useTheme)();
|
|
61
|
-
const glass = (0, _react.useMemo)(() => (0, _glassColors.resolveGlassColors)(fill), [fill]);
|
|
62
|
+
const glass = (0, _react.useMemo)(() => material === 'chrome' ? (0, _glassColors.resolveChromeGlassColors)(fill, fill, theme.isDark) : (0, _glassColors.resolveGlassColors)(fill), [fill, material, theme.isDark]);
|
|
62
63
|
// Per instance, because two panes in one document would otherwise share an id
|
|
63
64
|
// and the survivor of an unmount would reference a gradient that is gone. Same
|
|
64
65
|
// counter shape as `AvatarRing`.
|
|
@@ -100,6 +101,8 @@ const GlassSurfaceComponent = ({
|
|
|
100
101
|
backgroundColor: glass.fill
|
|
101
102
|
}]
|
|
102
103
|
}), sheen ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeSvg.default, {
|
|
104
|
+
width: "100%",
|
|
105
|
+
height: "100%",
|
|
103
106
|
style: _reactNative.StyleSheet.absoluteFill,
|
|
104
107
|
testID: testID ? `${testID}-sheen` : undefined,
|
|
105
108
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Defs, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_expoBlur","_reactNativeSvg","_useTheme","_glassColors","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","glassSheenIdCounter","GlassSurfaceComponent","fill","radius","sheen","style","testID","theme","useTheme","glass","useMemo","resolveGlassColors","sheenId","jsxs","View","pointerEvents","StyleSheet","absoluteFill","borderRadius","styles","clip","children","jsx","BlurView","intensity","GLASS_BLUR_INTENSITY","tint","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_expoBlur","_reactNativeSvg","_useTheme","_glassColors","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","glassSheenIdCounter","GlassSurfaceComponent","fill","radius","material","sheen","style","testID","theme","useTheme","glass","useMemo","resolveChromeGlassColors","isDark","resolveGlassColors","sheenId","jsxs","View","pointerEvents","StyleSheet","absoluteFill","borderRadius","styles","clip","children","jsx","BlurView","intensity","GLASS_BLUR_INTENSITY","tint","backgroundColor","width","height","undefined","Defs","LinearGradient","id","x1","y1","x2","y2","Stop","offset","stopColor","GLASS_SHEEN","top","color","stopOpacity","opacity","String","middleStop","middle","bottom","Rect","x","y","rim","create","overflow","boxShadow","GLASS_RIM_HIGHLIGHT","GlassSurface","exports","memo","displayName"],"sourceRoot":"../../../src","sources":["glass/GlassSurface.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -15,6 +15,12 @@ Object.defineProperty(exports, "GlassBlurWindow", {
|
|
|
15
15
|
return _blurTarget.GlassBlurWindow;
|
|
16
16
|
}
|
|
17
17
|
});
|
|
18
|
+
Object.defineProperty(exports, "GlassIsland", {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: function () {
|
|
21
|
+
return _GlassIsland.GlassIsland;
|
|
22
|
+
}
|
|
23
|
+
});
|
|
18
24
|
Object.defineProperty(exports, "GlassSurface", {
|
|
19
25
|
enumerable: true,
|
|
20
26
|
get: function () {
|
|
@@ -27,6 +33,7 @@ Object.defineProperty(exports, "useWindowedBlurTarget", {
|
|
|
27
33
|
return _blurTarget.useWindowedBlurTarget;
|
|
28
34
|
}
|
|
29
35
|
});
|
|
36
|
+
var _GlassIsland = require("./GlassIsland.js");
|
|
30
37
|
var _GlassSurface = require("./GlassSurface.js");
|
|
31
38
|
var _blurTarget = require("./blur-target.js");
|
|
32
39
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["
|
|
1
|
+
{"version":3,"names":["_GlassIsland","require","_GlassSurface","_blurTarget"],"sourceRoot":"../../../src","sources":["glass/index.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA","ignoreList":[]}
|