@xaui/native 0.9.1-alpha.2 → 0.9.1-alpha.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunk-2WMVDMFV.cjs +62 -0
- package/dist/chunk-33QILJJH.cjs +143 -0
- package/dist/chunk-4NE3SLTM.cjs +695 -0
- package/dist/{chunk-M7P46XKI.cjs → chunk-57SJ4LJF.cjs} +33 -3
- package/dist/chunk-5LC6KVL3.cjs +68 -0
- package/dist/{chunk-RBNCR5KB.js → chunk-A3EGFI6T.js} +31 -1
- package/dist/chunk-APCBIHLR.cjs +507 -0
- package/dist/chunk-BPBY7ON7.cjs +451 -0
- package/dist/chunk-EVXZGNPA.cjs +303 -0
- package/dist/chunk-EXX6ATAS.js +303 -0
- package/dist/chunk-GGW42MY4.js +20 -0
- package/dist/chunk-IBRVMLUF.js +668 -0
- package/dist/chunk-ISVUXVFL.js +471 -0
- package/dist/chunk-JL27KVRT.js +68 -0
- package/dist/chunk-JXLRHKCQ.js +143 -0
- package/dist/chunk-MC7SY2QH.cjs +20 -0
- package/dist/{chunk-RCP3SD26.js → chunk-N7C4UNUL.js} +2 -126
- package/dist/chunk-RMLFMRWL.js +102 -0
- package/dist/chunk-RRRGLRRP.cjs +28 -0
- package/dist/chunk-SGHP76GU.js +28 -0
- package/dist/{chunk-PBVPOX7D.js → chunk-TUJBDS5M.js} +30 -63
- package/dist/chunk-UBA6AEY6.cjs +102 -0
- package/dist/{chunk-NHPQQQ7P.cjs → chunk-UL263KGM.cjs} +56 -89
- package/dist/{chunk-B755PRVJ.cjs → chunk-UVO4GFSW.cjs} +3 -127
- package/dist/chunk-XHZBXYVU.js +62 -0
- package/dist/chunk-YRCUALUQ.js +451 -0
- package/dist/components/button/index.cjs +17 -0
- package/dist/components/button/index.d.cts +659 -0
- package/dist/components/button/index.d.ts +659 -0
- package/dist/components/button/index.js +17 -0
- package/dist/components/card/index.cjs +20 -0
- package/dist/components/card/index.d.cts +620 -0
- package/dist/components/card/index.d.ts +620 -0
- package/dist/components/card/index.js +20 -0
- package/dist/components/typography/index.cjs +14 -0
- package/dist/components/typography/index.d.cts +116 -0
- package/dist/components/typography/index.d.ts +116 -0
- package/dist/components/typography/index.js +14 -0
- package/dist/components/view/index.cjs +16 -0
- package/dist/components/view/index.d.cts +152 -0
- package/dist/components/view/index.d.ts +152 -0
- package/dist/components/view/index.js +16 -0
- package/dist/create-recipe-CC3NNCqF.d.ts +94 -0
- package/dist/create-recipe-CPBFg7ym.d.cts +94 -0
- package/dist/icon.type-BkcEPJbK.d.ts +73 -0
- package/dist/icon.type-Cs1tMX0W.d.cts +73 -0
- package/dist/index.cjs +167 -5
- package/dist/index.d.cts +79 -4
- package/dist/index.d.ts +79 -4
- package/dist/index.js +171 -9
- package/dist/pressable-feedback.type-DsvWZXWC.d.ts +127 -0
- package/dist/pressable-feedback.type-wfeiJz5m.d.cts +127 -0
- package/dist/style-props.type-B1BG5TCm.d.cts +31 -0
- package/dist/style-props.type-B1BG5TCm.d.ts +31 -0
- package/dist/system/index.cjs +66 -3
- package/dist/system/index.d.cts +301 -75
- package/dist/system/index.d.ts +301 -75
- package/dist/system/index.js +68 -5
- package/dist/theme/index.cjs +4 -3
- package/dist/theme/index.d.cts +27 -15
- package/dist/theme/index.d.ts +27 -15
- package/dist/theme/index.js +7 -6
- package/dist/{theme.type-B3ODSLbB.d.cts → theme.type-C2gNHpEx.d.cts} +8 -2
- package/dist/{theme.type-B3ODSLbB.d.ts → theme.type-C2gNHpEx.d.ts} +8 -2
- package/package.json +74 -18
|
@@ -1,67 +1,55 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
|
|
4
|
+
|
|
5
|
+
var _chunk57SJ4LJFcjs = require('./chunk-57SJ4LJF.cjs');
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
var _chunkMC7SY2QHcjs = require('./chunk-MC7SY2QH.cjs');
|
|
5
9
|
|
|
6
10
|
// src/provider/xaui-provider.tsx
|
|
7
11
|
var _reactnative = require('react-native');
|
|
8
12
|
|
|
9
|
-
// src/utils/stable-hash.ts
|
|
10
|
-
function canonical(value) {
|
|
11
|
-
if (value === null || typeof value !== "object") return _nullishCoalesce(JSON.stringify(value), () => ( "null"));
|
|
12
|
-
if (Array.isArray(value)) return `[${value.map(canonical).join(",")}]`;
|
|
13
|
-
const entries = Object.entries(value).filter(([, v]) => typeof v !== "function").sort(([a], [b]) => a < b ? -1 : 1).map(([k, v]) => `${JSON.stringify(k)}:${canonical(v)}`);
|
|
14
|
-
return `{${entries.join(",")}}`;
|
|
15
|
-
}
|
|
16
|
-
function stableHash(value) {
|
|
17
|
-
const input = canonical(value);
|
|
18
|
-
let hash = 2166136261;
|
|
19
|
-
for (let i = 0; i < input.length; i++) {
|
|
20
|
-
hash ^= input.charCodeAt(i);
|
|
21
|
-
hash = Math.imul(hash, 16777619) >>> 0;
|
|
22
|
-
}
|
|
23
|
-
return hash.toString(36);
|
|
24
|
-
}
|
|
25
|
-
|
|
26
13
|
// src/theme/derive-colors.ts
|
|
27
14
|
function deriveColors(s) {
|
|
28
15
|
return {
|
|
29
|
-
accentPressed:
|
|
30
|
-
successPressed:
|
|
31
|
-
warningPressed:
|
|
32
|
-
dangerPressed:
|
|
33
|
-
defaultPressed:
|
|
34
|
-
surfacePressed:
|
|
35
|
-
defaultSoft:
|
|
16
|
+
accentPressed: _chunk57SJ4LJFcjs.mix.call(void 0, s.accent, s.foreground, 0.1),
|
|
17
|
+
successPressed: _chunk57SJ4LJFcjs.mix.call(void 0, s.success, s.foreground, 0.1),
|
|
18
|
+
warningPressed: _chunk57SJ4LJFcjs.mix.call(void 0, s.warning, s.foreground, 0.1),
|
|
19
|
+
dangerPressed: _chunk57SJ4LJFcjs.mix.call(void 0, s.danger, s.foreground, 0.1),
|
|
20
|
+
defaultPressed: _chunk57SJ4LJFcjs.mix.call(void 0, s.default, s.defaultForeground, 0.04),
|
|
21
|
+
surfacePressed: _chunk57SJ4LJFcjs.mix.call(void 0, s.surface, s.surfaceForeground, 0.08),
|
|
22
|
+
defaultSoft: _chunk57SJ4LJFcjs.alpha.call(void 0, s.default, 0.5),
|
|
36
23
|
defaultSoftForeground: s.defaultForeground,
|
|
37
|
-
defaultSoftPressed:
|
|
38
|
-
accentSoft:
|
|
39
|
-
accentSoftForeground:
|
|
40
|
-
accentSoftPressed:
|
|
41
|
-
successSoft:
|
|
42
|
-
successSoftForeground:
|
|
43
|
-
successSoftPressed:
|
|
44
|
-
warningSoft:
|
|
45
|
-
warningSoftForeground:
|
|
46
|
-
warningSoftPressed:
|
|
47
|
-
dangerSoft:
|
|
48
|
-
dangerSoftForeground:
|
|
49
|
-
dangerSoftPressed:
|
|
50
|
-
backgroundSecondary:
|
|
51
|
-
backgroundTertiary:
|
|
24
|
+
defaultSoftPressed: _chunk57SJ4LJFcjs.alpha.call(void 0, s.default, 0.6),
|
|
25
|
+
accentSoft: _chunk57SJ4LJFcjs.alpha.call(void 0, s.accent, 0.15),
|
|
26
|
+
accentSoftForeground: _chunk57SJ4LJFcjs.mix.call(void 0, s.accent, s.foreground, 0.2),
|
|
27
|
+
accentSoftPressed: _chunk57SJ4LJFcjs.alpha.call(void 0, s.accent, 0.2),
|
|
28
|
+
successSoft: _chunk57SJ4LJFcjs.alpha.call(void 0, s.success, 0.15),
|
|
29
|
+
successSoftForeground: _chunk57SJ4LJFcjs.mix.call(void 0, s.success, s.foreground, 0.3),
|
|
30
|
+
successSoftPressed: _chunk57SJ4LJFcjs.alpha.call(void 0, s.success, 0.2),
|
|
31
|
+
warningSoft: _chunk57SJ4LJFcjs.alpha.call(void 0, s.warning, 0.15),
|
|
32
|
+
warningSoftForeground: _chunk57SJ4LJFcjs.mix.call(void 0, s.warning, s.foreground, 0.35),
|
|
33
|
+
warningSoftPressed: _chunk57SJ4LJFcjs.alpha.call(void 0, s.warning, 0.2),
|
|
34
|
+
dangerSoft: _chunk57SJ4LJFcjs.alpha.call(void 0, s.danger, 0.15),
|
|
35
|
+
dangerSoftForeground: _chunk57SJ4LJFcjs.mix.call(void 0, s.danger, s.foreground, 0.2),
|
|
36
|
+
dangerSoftPressed: _chunk57SJ4LJFcjs.alpha.call(void 0, s.danger, 0.2),
|
|
37
|
+
backgroundSecondary: _chunk57SJ4LJFcjs.mix.call(void 0, s.background, s.foreground, 0.04),
|
|
38
|
+
backgroundTertiary: _chunk57SJ4LJFcjs.mix.call(void 0, s.background, s.foreground, 0.08),
|
|
52
39
|
backgroundInverse: s.foreground,
|
|
53
|
-
borderSecondary:
|
|
54
|
-
borderTertiary:
|
|
55
|
-
separatorSecondary:
|
|
56
|
-
separatorTertiary:
|
|
57
|
-
fieldPressed:
|
|
40
|
+
borderSecondary: _chunk57SJ4LJFcjs.mix.call(void 0, s.surface, s.surfaceForeground, 0.22),
|
|
41
|
+
borderTertiary: _chunk57SJ4LJFcjs.mix.call(void 0, s.surface, s.surfaceForeground, 0.34),
|
|
42
|
+
separatorSecondary: _chunk57SJ4LJFcjs.mix.call(void 0, s.surface, s.surfaceForeground, 0.15),
|
|
43
|
+
separatorTertiary: _chunk57SJ4LJFcjs.mix.call(void 0, s.surface, s.surfaceForeground, 0.19),
|
|
44
|
+
fieldPressed: _chunk57SJ4LJFcjs.mix.call(void 0, s.fieldBackground, s.fieldForeground, 0.1),
|
|
58
45
|
fieldFocus: s.fieldBackground,
|
|
59
|
-
fieldBorderPressed:
|
|
60
|
-
fieldBorderFocus:
|
|
46
|
+
fieldBorderPressed: _chunk57SJ4LJFcjs.mix.call(void 0, s.fieldBorder, s.fieldForeground, 0.12),
|
|
47
|
+
fieldBorderFocus: _chunk57SJ4LJFcjs.mix.call(void 0, s.fieldBorder, s.fieldForeground, 0.26)
|
|
61
48
|
};
|
|
62
49
|
}
|
|
63
50
|
|
|
64
51
|
// src/theme/scales.ts
|
|
52
|
+
|
|
65
53
|
var SPACING_UNIT = 4;
|
|
66
54
|
var RADIUS_BASE = 12;
|
|
67
55
|
function buildRadius(base) {
|
|
@@ -113,7 +101,10 @@ var fontWeights = {
|
|
|
113
101
|
var fontFamilies = {
|
|
114
102
|
body: "System",
|
|
115
103
|
heading: "System",
|
|
116
|
-
|
|
104
|
+
// `'monospace'` is an Android family name, not a generic one: iOS does not resolve it and
|
|
105
|
+
// silently falls back to the system face, so code set with it is not monospaced there.
|
|
106
|
+
// Menlo is the face iOS ships, and it is what HeroUI Native selects for the same reason.
|
|
107
|
+
mono: _reactnative.Platform.OS === "ios" ? "Menlo" : "monospace"
|
|
117
108
|
};
|
|
118
109
|
var borderWidth = { default: 1, field: 1 };
|
|
119
110
|
var opacity = { disabled: 0.5 };
|
|
@@ -170,7 +161,7 @@ var tokens = {
|
|
|
170
161
|
foreground: "#18181b",
|
|
171
162
|
surface: "#ffffff",
|
|
172
163
|
surfaceForeground: "#18181b",
|
|
173
|
-
surfaceSecondary: "#
|
|
164
|
+
surfaceSecondary: "#ececee",
|
|
174
165
|
surfaceSecondaryForeground: "#18181b",
|
|
175
166
|
surfaceTertiary: "#e4e4e7",
|
|
176
167
|
surfaceTertiaryForeground: "#18181b",
|
|
@@ -178,7 +169,7 @@ var tokens = {
|
|
|
178
169
|
overlayForeground: "#18181b",
|
|
179
170
|
backdrop: "rgba(0, 0, 0, 0.2)",
|
|
180
171
|
muted: "#71717a",
|
|
181
|
-
default: "#
|
|
172
|
+
default: "#e4e4e7",
|
|
182
173
|
defaultForeground: "#18181b",
|
|
183
174
|
accent: "#9333ea",
|
|
184
175
|
accentForeground: "#faf5ff",
|
|
@@ -198,15 +189,15 @@ var tokens = {
|
|
|
198
189
|
separator: "#d4d4d8",
|
|
199
190
|
focus: "#9333ea",
|
|
200
191
|
link: "#18181b",
|
|
201
|
-
accentPressed: "#
|
|
202
|
-
successPressed: "#
|
|
203
|
-
warningPressed: "#
|
|
204
|
-
dangerPressed: "#
|
|
205
|
-
defaultPressed: "#
|
|
192
|
+
accentPressed: "#8533d3",
|
|
193
|
+
successPressed: "#1b753a",
|
|
194
|
+
warningPressed: "#a34d13",
|
|
195
|
+
dangerPressed: "#c72927",
|
|
196
|
+
defaultPressed: "#dbdbde",
|
|
206
197
|
surfacePressed: "#eaeaea",
|
|
207
|
-
defaultSoft: "rgba(
|
|
198
|
+
defaultSoft: "rgba(228, 228, 231, 0.5)",
|
|
208
199
|
defaultSoftForeground: "#18181b",
|
|
209
|
-
defaultSoftPressed: "rgba(
|
|
200
|
+
defaultSoftPressed: "rgba(228, 228, 231, 0.6)",
|
|
210
201
|
accentSoft: "rgba(147, 51, 234, 0.15)",
|
|
211
202
|
accentSoftForeground: "#7833bc",
|
|
212
203
|
accentSoftPressed: "rgba(147, 51, 234, 0.2)",
|
|
@@ -268,10 +259,10 @@ var tokens = {
|
|
|
268
259
|
separator: "#52525b",
|
|
269
260
|
focus: "#c084fc",
|
|
270
261
|
link: "#fafafa",
|
|
271
|
-
accentPressed: "#
|
|
272
|
-
successPressed: "#
|
|
273
|
-
warningPressed: "#
|
|
274
|
-
dangerPressed: "#
|
|
262
|
+
accentPressed: "#c691fd",
|
|
263
|
+
successPressed: "#64e18d",
|
|
264
|
+
warningPressed: "#fbc54b",
|
|
265
|
+
dangerPressed: "#fa807e",
|
|
275
266
|
defaultPressed: "#2e2e31",
|
|
276
267
|
surfacePressed: "#27272a",
|
|
277
268
|
defaultSoft: "rgba(39, 39, 42, 0.5)",
|
|
@@ -376,7 +367,7 @@ function resolveMode(mode, config, id) {
|
|
|
376
367
|
};
|
|
377
368
|
}
|
|
378
369
|
function createTheme(config = {}) {
|
|
379
|
-
const id = stableHash(config);
|
|
370
|
+
const id = _chunkMC7SY2QHcjs.stableHash.call(void 0, config);
|
|
380
371
|
return {
|
|
381
372
|
id,
|
|
382
373
|
light: resolveMode("light", config, id),
|
|
@@ -385,11 +376,8 @@ function createTheme(config = {}) {
|
|
|
385
376
|
}
|
|
386
377
|
var defaultTheme = createTheme();
|
|
387
378
|
|
|
388
|
-
// src/theme/theme-context.ts
|
|
389
|
-
var _react = require('react');
|
|
390
|
-
var ThemeContext = _react.createContext.call(void 0, null);
|
|
391
|
-
|
|
392
379
|
// src/provider/xaui-provider.tsx
|
|
380
|
+
var _jsxruntime = require('react/jsx-runtime');
|
|
393
381
|
function XAUIProvider({
|
|
394
382
|
children,
|
|
395
383
|
theme = defaultTheme,
|
|
@@ -397,7 +385,7 @@ function XAUIProvider({
|
|
|
397
385
|
}) {
|
|
398
386
|
const scheme = _reactnative.useColorScheme.call(void 0, );
|
|
399
387
|
const resolved = colorMode === "system" ? scheme === "dark" ? "dark" : "light" : colorMode;
|
|
400
|
-
return /* @__PURE__ */
|
|
388
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk57SJ4LJFcjs.ThemeContext.Provider, { value: theme[resolved], children });
|
|
401
389
|
}
|
|
402
390
|
|
|
403
391
|
// src/theme/palette.ts
|
|
@@ -699,27 +687,6 @@ var primitives = {
|
|
|
699
687
|
eclipse: "#18181b"
|
|
700
688
|
};
|
|
701
689
|
|
|
702
|
-
// src/theme/theme-hooks.ts
|
|
703
|
-
|
|
704
|
-
function useXAUITheme() {
|
|
705
|
-
const theme = _react.useContext.call(void 0, ThemeContext);
|
|
706
|
-
if (theme === null) {
|
|
707
|
-
throw new Error("XAUI: useXAUITheme must be used within <XAUIProvider>.");
|
|
708
|
-
}
|
|
709
|
-
return theme;
|
|
710
|
-
}
|
|
711
|
-
function useColorMode() {
|
|
712
|
-
return useXAUITheme().mode;
|
|
713
|
-
}
|
|
714
|
-
function useThemeColor(token) {
|
|
715
|
-
const { colors } = useXAUITheme();
|
|
716
|
-
return Array.isArray(token) ? token.map((key) => colors[key]) : colors[token];
|
|
717
|
-
}
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
690
|
|
|
724
691
|
|
|
725
692
|
|
|
@@ -731,4 +698,4 @@ function useThemeColor(token) {
|
|
|
731
698
|
|
|
732
699
|
|
|
733
700
|
|
|
734
|
-
exports.deriveColors = deriveColors; exports.buildRadius = buildRadius; exports.buildShadows = buildShadows; exports.tokens = tokens; exports.sourceKeys = sourceKeys; exports.createTheme = createTheme; exports.defaultTheme = defaultTheme; exports.
|
|
701
|
+
exports.deriveColors = deriveColors; exports.buildRadius = buildRadius; exports.buildShadows = buildShadows; exports.tokens = tokens; exports.sourceKeys = sourceKeys; exports.createTheme = createTheme; exports.defaultTheme = defaultTheme; exports.XAUIProvider = XAUIProvider; exports.palette = palette; exports.primitives = primitives;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _chunk57SJ4LJFcjs = require('./chunk-57SJ4LJF.cjs');
|
|
4
4
|
|
|
5
5
|
// src/system/recipe/resolve-tint.ts
|
|
6
6
|
var TINT_SLICE_BY_SUFFIX = [
|
|
@@ -17,7 +17,7 @@ function tintSliceFor(token) {
|
|
|
17
17
|
return "base";
|
|
18
18
|
}
|
|
19
19
|
function resolveTint(tokens, color, theme) {
|
|
20
|
-
const tint =
|
|
20
|
+
const tint = _chunk57SJ4LJFcjs.deriveTint.call(void 0, color, theme);
|
|
21
21
|
const colors = {};
|
|
22
22
|
for (const [role, token] of Object.entries(_nullishCoalesce(tokens, () => ( {})))) {
|
|
23
23
|
colors[role] = tint[tintSliceFor(token)];
|
|
@@ -145,130 +145,6 @@ function apply(fns, theme, colors) {
|
|
|
145
145
|
return merged;
|
|
146
146
|
}
|
|
147
147
|
|
|
148
|
-
// src/system/slot/children-to-string.ts
|
|
149
|
-
var _react = require('react');
|
|
150
|
-
function childrenToString(children) {
|
|
151
|
-
const text = stringify(children);
|
|
152
|
-
return text === null || text === "" ? null : text;
|
|
153
|
-
}
|
|
154
|
-
function stringify(node) {
|
|
155
|
-
if (node === null || node === void 0 || typeof node === "boolean") return "";
|
|
156
|
-
if (typeof node === "string") return node;
|
|
157
|
-
if (typeof node === "number") return String(node);
|
|
158
|
-
if (_react.isValidElement.call(void 0, node)) return null;
|
|
159
|
-
if (Array.isArray(node)) {
|
|
160
|
-
let text = "";
|
|
161
|
-
for (const child of node) {
|
|
162
|
-
const part = stringify(child);
|
|
163
|
-
if (part === null) return null;
|
|
164
|
-
text += part;
|
|
165
|
-
}
|
|
166
|
-
return text;
|
|
167
|
-
}
|
|
168
|
-
return null;
|
|
169
|
-
}
|
|
170
|
-
|
|
171
|
-
// src/system/slot/create-slot-context.ts
|
|
172
|
-
|
|
173
|
-
function createSlotContext(name) {
|
|
174
|
-
const Context = _react.createContext.call(void 0, null);
|
|
175
|
-
Context.displayName = `XAUI.${name}.Context`;
|
|
176
|
-
function useSlotContext() {
|
|
177
|
-
const value = _react.useContext.call(void 0, Context);
|
|
178
|
-
if (value === null) {
|
|
179
|
-
const error = new Error(
|
|
180
|
-
`XAUI: use${name} must be called inside <${name}>. A slot reads the values its root resolved, so it can only be rendered as a child of one.`
|
|
181
|
-
);
|
|
182
|
-
_optionalChain([Error, 'access', _4 => _4.captureStackTrace, 'optionalCall', _5 => _5(
|
|
183
|
-
error,
|
|
184
|
-
useSlotContext
|
|
185
|
-
)]);
|
|
186
|
-
throw error;
|
|
187
|
-
}
|
|
188
|
-
return value;
|
|
189
|
-
}
|
|
190
|
-
return [Context.Provider, useSlotContext];
|
|
191
|
-
}
|
|
192
|
-
|
|
193
|
-
// src/system/slot/merge-refs.ts
|
|
194
|
-
function mergeRefs(...refs) {
|
|
195
|
-
return (value) => {
|
|
196
|
-
for (const ref of refs) {
|
|
197
|
-
if (typeof ref === "function") ref(value);
|
|
198
|
-
else if (ref) ref.current = value;
|
|
199
|
-
}
|
|
200
|
-
};
|
|
201
|
-
}
|
|
202
|
-
|
|
203
|
-
// src/system/slot/merge-props.ts
|
|
204
|
-
var EVENT_HANDLER = /^on[A-Z]/;
|
|
205
|
-
function mergeProps(ours, theirs) {
|
|
206
|
-
const merged = { ...ours };
|
|
207
|
-
for (const key of Object.keys(theirs)) {
|
|
208
|
-
const ourValue = ours[key];
|
|
209
|
-
const theirValue = theirs[key];
|
|
210
|
-
if (EVENT_HANDLER.test(key)) {
|
|
211
|
-
merged[key] = composeHandlers(ourValue, theirValue);
|
|
212
|
-
} else if (key === "style") {
|
|
213
|
-
merged[key] = mergeStyles(ourValue, theirValue);
|
|
214
|
-
} else if (key === "ref") {
|
|
215
|
-
merged[key] = mergeRefs(
|
|
216
|
-
ourValue,
|
|
217
|
-
theirValue
|
|
218
|
-
);
|
|
219
|
-
} else {
|
|
220
|
-
merged[key] = theirValue;
|
|
221
|
-
}
|
|
222
|
-
}
|
|
223
|
-
return merged;
|
|
224
|
-
}
|
|
225
|
-
function composeHandlers(ours, theirs) {
|
|
226
|
-
if (typeof ours !== "function") return theirs;
|
|
227
|
-
if (typeof theirs !== "function") return ours;
|
|
228
|
-
return (...args) => {
|
|
229
|
-
;
|
|
230
|
-
ours(...args);
|
|
231
|
-
return theirs(...args);
|
|
232
|
-
};
|
|
233
|
-
}
|
|
234
|
-
function mergeStyles(ours, theirs) {
|
|
235
|
-
if (typeof ours === "function" || typeof theirs === "function") {
|
|
236
|
-
return (state) => [
|
|
237
|
-
resolveStyle(ours, state),
|
|
238
|
-
resolveStyle(theirs, state)
|
|
239
|
-
];
|
|
240
|
-
}
|
|
241
|
-
return [ours, theirs];
|
|
242
|
-
}
|
|
243
|
-
function resolveStyle(style, state) {
|
|
244
|
-
return typeof style === "function" ? style(state) : style;
|
|
245
|
-
}
|
|
246
|
-
|
|
247
|
-
// src/system/slot/slot.tsx
|
|
248
|
-
|
|
249
|
-
var Slot = _react.forwardRef.call(void 0, function Slot2({ children, ...ours }, ref) {
|
|
250
|
-
if (!_react.isValidElement.call(void 0, children)) {
|
|
251
|
-
throw new Error(
|
|
252
|
-
"XAUI: asChild expects exactly one React element as its child, and merges the component's props into it. Text, a fragment, several children or none give it nothing to merge into \u2014 drop `asChild` to render the component itself."
|
|
253
|
-
);
|
|
254
|
-
}
|
|
255
|
-
const child = children;
|
|
256
|
-
const merged = mergeProps(ours, child.props);
|
|
257
|
-
merged.ref = mergeRefs(ref, refOf(child));
|
|
258
|
-
return _react.cloneElement.call(void 0, child, merged);
|
|
259
|
-
});
|
|
260
|
-
Slot.displayName = "XAUI.Slot";
|
|
261
|
-
function refOf(element) {
|
|
262
|
-
const fromProps = element.props.ref;
|
|
263
|
-
const fromElement = element.ref;
|
|
264
|
-
return _nullishCoalesce(fromProps, () => ( fromElement));
|
|
265
|
-
}
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
148
|
|
|
273
149
|
|
|
274
|
-
exports.createRecipe = createRecipe;
|
|
150
|
+
exports.createRecipe = createRecipe;
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import {
|
|
2
|
+
useStyleProps
|
|
3
|
+
} from "./chunk-EXX6ATAS.js";
|
|
4
|
+
|
|
5
|
+
// src/system/portal/portal.tsx
|
|
6
|
+
import { useContext, useId, useLayoutEffect } from "react";
|
|
7
|
+
|
|
8
|
+
// src/system/portal/portal-context.ts
|
|
9
|
+
import { createContext } from "react";
|
|
10
|
+
var PortalContext = createContext(null);
|
|
11
|
+
|
|
12
|
+
// src/system/portal/portal.tsx
|
|
13
|
+
function Portal({ children }) {
|
|
14
|
+
const context = useContext(PortalContext);
|
|
15
|
+
const key = useId();
|
|
16
|
+
useLayoutEffect(() => {
|
|
17
|
+
context?.addPortal(key, children);
|
|
18
|
+
}, [children, context, key]);
|
|
19
|
+
useLayoutEffect(() => {
|
|
20
|
+
return () => context?.removePortal(key);
|
|
21
|
+
}, [context, key]);
|
|
22
|
+
return null;
|
|
23
|
+
}
|
|
24
|
+
Portal.displayName = "XAUI.Portal";
|
|
25
|
+
|
|
26
|
+
// src/system/portal/portal-host.tsx
|
|
27
|
+
import { Fragment, useCallback, useMemo, useState } from "react";
|
|
28
|
+
import { StyleSheet, View } from "react-native";
|
|
29
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
30
|
+
var styles = StyleSheet.create({
|
|
31
|
+
container: { flex: 1 }
|
|
32
|
+
});
|
|
33
|
+
function PortalHost({ children, ...props }) {
|
|
34
|
+
const [styleProps] = useStyleProps(props);
|
|
35
|
+
const [portals, setPortals] = useState(/* @__PURE__ */ new Map());
|
|
36
|
+
const addPortal = useCallback((key, element) => {
|
|
37
|
+
setPortals((current) => new Map(current).set(key, element));
|
|
38
|
+
}, []);
|
|
39
|
+
const removePortal = useCallback((key) => {
|
|
40
|
+
setPortals((current) => {
|
|
41
|
+
if (!current.has(key)) return current;
|
|
42
|
+
const next = new Map(current);
|
|
43
|
+
next.delete(key);
|
|
44
|
+
return next;
|
|
45
|
+
});
|
|
46
|
+
}, []);
|
|
47
|
+
const methods = useMemo(
|
|
48
|
+
() => ({ addPortal, removePortal }),
|
|
49
|
+
[addPortal, removePortal]
|
|
50
|
+
);
|
|
51
|
+
return /* @__PURE__ */ jsx(PortalContext.Provider, { value: methods, children: /* @__PURE__ */ jsxs(View, { style: [styles.container, styleProps], children: [
|
|
52
|
+
children,
|
|
53
|
+
Array.from(portals, ([key, element]) => /* @__PURE__ */ jsx(Fragment, { children: element }, key))
|
|
54
|
+
] }) });
|
|
55
|
+
}
|
|
56
|
+
PortalHost.displayName = "XAUI.PortalHost";
|
|
57
|
+
|
|
58
|
+
export {
|
|
59
|
+
PortalContext,
|
|
60
|
+
Portal,
|
|
61
|
+
PortalHost
|
|
62
|
+
};
|