@kbach/react-native 1.0.0-beta.3 → 1.0.0-beta.4
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 +36 -11
- package/dist/chunk-4KCCEMEN.mjs +66 -0
- package/dist/{chunk-7KUNKZBM.mjs → chunk-AEVOM2NB.mjs} +2 -12
- package/dist/{chunk-UP5ZN7CN.mjs → chunk-DLIXI5OW.mjs} +23 -14
- package/dist/chunk-FG5E4NLJ.mjs +18 -0
- package/dist/chunk-KSDFO34H.mjs +32 -0
- package/dist/chunk-OJQAJLYT.mjs +14 -0
- package/dist/chunk-ZUE6SCTE.mjs +14 -0
- package/dist/index.mjs +9 -57
- package/dist/index.web.d.mts +7 -0
- package/dist/index.web.d.ts +7 -0
- package/dist/index.web.js +488 -0
- package/dist/index.web.mjs +32 -0
- package/dist/jsx-dev-runtime.d.mts +3 -12
- package/dist/jsx-dev-runtime.d.ts +3 -12
- package/dist/jsx-dev-runtime.js +53 -46
- package/dist/jsx-dev-runtime.mjs +8 -11
- package/dist/jsx-dev-runtime.web.d.mts +10 -0
- package/dist/jsx-dev-runtime.web.d.ts +10 -0
- package/dist/jsx-dev-runtime.web.js +437 -0
- package/dist/jsx-dev-runtime.web.mjs +17 -0
- package/dist/jsx-runtime.d.mts +3 -26
- package/dist/jsx-runtime.d.ts +3 -26
- package/dist/jsx-runtime.js +43 -37
- package/dist/jsx-runtime.mjs +6 -3
- package/dist/jsx-runtime.web.d.mts +7 -0
- package/dist/jsx-runtime.web.d.ts +7 -0
- package/dist/jsx-runtime.web.js +426 -0
- package/dist/jsx-runtime.web.mjs +14 -0
- package/package.json +20 -4
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import {
|
|
2
|
+
jsx,
|
|
3
|
+
jsxs
|
|
4
|
+
} from "./chunk-ZUE6SCTE.mjs";
|
|
5
|
+
import "./chunk-KSDFO34H.mjs";
|
|
6
|
+
import {
|
|
7
|
+
Fragment,
|
|
8
|
+
createJsxDEV
|
|
9
|
+
} from "./chunk-DLIXI5OW.mjs";
|
|
10
|
+
import "./chunk-AEVOM2NB.mjs";
|
|
11
|
+
|
|
12
|
+
// src/jsx-dev-runtime.web.tsx
|
|
13
|
+
var jsxDEV = createJsxDEV(jsx, jsxs);
|
|
14
|
+
export {
|
|
15
|
+
Fragment,
|
|
16
|
+
jsxDEV
|
|
17
|
+
};
|
package/dist/jsx-runtime.d.mts
CHANGED
|
@@ -1,30 +1,7 @@
|
|
|
1
|
-
import
|
|
1
|
+
import * as react from 'react';
|
|
2
2
|
export { Fragment, JSX } from 'react';
|
|
3
3
|
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
*
|
|
7
|
-
* Drop-in replacement for react/jsx-runtime — same interception shape as
|
|
8
|
-
* @kbach/react/jsx-runtime (Phase 3), but the resolved value becomes the
|
|
9
|
-
* `style` prop instead of `className`: View/Text have no `className` prop
|
|
10
|
-
* at all. Covers layout, color, spacing, border, typography, dark:,
|
|
11
|
-
* active: (Pressable only), and sm:/md:/lg:/xl:/2xl: (gated against the
|
|
12
|
-
* current window width, live) — see nativeBridge.ts / resolve_style.rs for
|
|
13
|
-
* exactly what's resolved; every other modifier (hover:, group- and peer-
|
|
14
|
-
* variants, has-[...], container queries, ...) parses but isn't applied —
|
|
15
|
-
* there's no selector/pseudo-state/ancestor system on native to apply them
|
|
16
|
-
* with.
|
|
17
|
-
*
|
|
18
|
-
* `active:` needs different handling from every other modifier: whether an
|
|
19
|
-
* element is "pressed" isn't a value that can be read once and reused like
|
|
20
|
-
* `dark:`'s color scheme — only RN's `Pressable` ever knows it, and only
|
|
21
|
-
* via a style FUNCTION it calls on every press/release
|
|
22
|
-
* (`style={({pressed}) => ...}`). So for `type === Pressable` specifically,
|
|
23
|
-
* `style` is built as a function instead of a static value; every other
|
|
24
|
-
* element type is completely unaffected by this — same code path as before.
|
|
25
|
-
*/
|
|
26
|
-
|
|
27
|
-
declare function jsx(type: unknown, props: Record<string, unknown> | null, key?: string): ReactElement;
|
|
28
|
-
declare function jsxs(type: unknown, props: Record<string, unknown> | null, key?: string): ReactElement;
|
|
4
|
+
declare const jsx: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
|
|
5
|
+
declare const jsxs: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
|
|
29
6
|
|
|
30
7
|
export { jsx, jsxs };
|
package/dist/jsx-runtime.d.ts
CHANGED
|
@@ -1,30 +1,7 @@
|
|
|
1
|
-
import
|
|
1
|
+
import * as react from 'react';
|
|
2
2
|
export { Fragment, JSX } from 'react';
|
|
3
3
|
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
*
|
|
7
|
-
* Drop-in replacement for react/jsx-runtime — same interception shape as
|
|
8
|
-
* @kbach/react/jsx-runtime (Phase 3), but the resolved value becomes the
|
|
9
|
-
* `style` prop instead of `className`: View/Text have no `className` prop
|
|
10
|
-
* at all. Covers layout, color, spacing, border, typography, dark:,
|
|
11
|
-
* active: (Pressable only), and sm:/md:/lg:/xl:/2xl: (gated against the
|
|
12
|
-
* current window width, live) — see nativeBridge.ts / resolve_style.rs for
|
|
13
|
-
* exactly what's resolved; every other modifier (hover:, group- and peer-
|
|
14
|
-
* variants, has-[...], container queries, ...) parses but isn't applied —
|
|
15
|
-
* there's no selector/pseudo-state/ancestor system on native to apply them
|
|
16
|
-
* with.
|
|
17
|
-
*
|
|
18
|
-
* `active:` needs different handling from every other modifier: whether an
|
|
19
|
-
* element is "pressed" isn't a value that can be read once and reused like
|
|
20
|
-
* `dark:`'s color scheme — only RN's `Pressable` ever knows it, and only
|
|
21
|
-
* via a style FUNCTION it calls on every press/release
|
|
22
|
-
* (`style={({pressed}) => ...}`). So for `type === Pressable` specifically,
|
|
23
|
-
* `style` is built as a function instead of a static value; every other
|
|
24
|
-
* element type is completely unaffected by this — same code path as before.
|
|
25
|
-
*/
|
|
26
|
-
|
|
27
|
-
declare function jsx(type: unknown, props: Record<string, unknown> | null, key?: string): ReactElement;
|
|
28
|
-
declare function jsxs(type: unknown, props: Record<string, unknown> | null, key?: string): ReactElement;
|
|
4
|
+
declare const jsx: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
|
|
5
|
+
declare const jsxs: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
|
|
29
6
|
|
|
30
7
|
export { jsx, jsxs };
|
package/dist/jsx-runtime.js
CHANGED
|
@@ -25,12 +25,47 @@ __export(jsx_runtime_exports, {
|
|
|
25
25
|
jsxs: () => jsxs
|
|
26
26
|
});
|
|
27
27
|
module.exports = __toCommonJS(jsx_runtime_exports);
|
|
28
|
+
|
|
29
|
+
// src/jsxRuntimeCore.ts
|
|
28
30
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
29
31
|
var import_react = require("react");
|
|
30
|
-
var
|
|
32
|
+
var import_react_native = require("react-native");
|
|
33
|
+
function makeElement(isStaticChildren, type, props, key) {
|
|
34
|
+
return (isStaticChildren ? import_jsx_runtime.jsxs : import_jsx_runtime.jsx)(type, props, key);
|
|
35
|
+
}
|
|
36
|
+
function resolvedStyleFor(resolveStyle2, classStrRaw, userStyle, pressed) {
|
|
37
|
+
const resolved = resolveStyle2(classStrRaw, pressed);
|
|
38
|
+
if (userStyle === void 0) {
|
|
39
|
+
return resolved;
|
|
40
|
+
}
|
|
41
|
+
if (typeof userStyle === "function") {
|
|
42
|
+
return [resolved, userStyle({ pressed })];
|
|
43
|
+
}
|
|
44
|
+
return [resolved, userStyle];
|
|
45
|
+
}
|
|
46
|
+
function processElement(resolveStyle2, type, rawProps, key, isStaticChildren) {
|
|
47
|
+
if (type === null || typeof type === "symbol" || !rawProps) {
|
|
48
|
+
return makeElement(isStaticChildren, type, rawProps ?? {}, key);
|
|
49
|
+
}
|
|
50
|
+
const { className: classStrRaw, style: userStyle, ...rest } = rawProps;
|
|
51
|
+
if (typeof classStrRaw !== "string") {
|
|
52
|
+
return makeElement(isStaticChildren, type, rawProps, key);
|
|
53
|
+
}
|
|
54
|
+
const finalStyle = type === import_react_native.Pressable ? (state) => resolvedStyleFor(resolveStyle2, classStrRaw, userStyle, state.pressed) : resolvedStyleFor(resolveStyle2, classStrRaw, userStyle, false);
|
|
55
|
+
return makeElement(isStaticChildren, type, { ...rest, style: finalStyle }, key);
|
|
56
|
+
}
|
|
57
|
+
function createJsxFunctions(resolveStyle2) {
|
|
58
|
+
function jsx2(type, props, key) {
|
|
59
|
+
return processElement(resolveStyle2, type, props, key, false);
|
|
60
|
+
}
|
|
61
|
+
function jsxs2(type, props, key) {
|
|
62
|
+
return processElement(resolveStyle2, type, props, key, true);
|
|
63
|
+
}
|
|
64
|
+
return { jsx: jsx2, jsxs: jsxs2 };
|
|
65
|
+
}
|
|
31
66
|
|
|
32
67
|
// src/nativeBridge.ts
|
|
33
|
-
var
|
|
68
|
+
var import_react_native3 = require("react-native");
|
|
34
69
|
|
|
35
70
|
// src/generatedPalette.ts
|
|
36
71
|
var PALETTE = {
|
|
@@ -338,17 +373,17 @@ function getThemeJson() {
|
|
|
338
373
|
}
|
|
339
374
|
|
|
340
375
|
// src/darkModeStore.ts
|
|
341
|
-
var
|
|
376
|
+
var import_react_native2 = require("react-native");
|
|
342
377
|
var listeners = /* @__PURE__ */ new Set();
|
|
343
378
|
function systemPrefersDark() {
|
|
344
|
-
return
|
|
379
|
+
return import_react_native2.Appearance.getColorScheme() === "dark";
|
|
345
380
|
}
|
|
346
381
|
function resolveIsDark(m) {
|
|
347
382
|
return m === "system" ? systemPrefersDark() : m === "dark";
|
|
348
383
|
}
|
|
349
384
|
var mode = "system";
|
|
350
385
|
var isDark = resolveIsDark(mode);
|
|
351
|
-
var subscription =
|
|
386
|
+
var subscription = import_react_native2.Appearance.addChangeListener(({ colorScheme }) => {
|
|
352
387
|
if (mode !== "system") return;
|
|
353
388
|
isDark = colorScheme === "dark";
|
|
354
389
|
notify();
|
|
@@ -362,44 +397,15 @@ function getGlobalDarkMode() {
|
|
|
362
397
|
|
|
363
398
|
// src/nativeBridge.ts
|
|
364
399
|
function resolveStyle(classString, pressed = false) {
|
|
365
|
-
const KbachModule =
|
|
400
|
+
const KbachModule = import_react_native3.TurboModuleRegistry.getEnforcing("KbachModule");
|
|
366
401
|
const colorScheme = getGlobalDarkMode() ? "dark" : "light";
|
|
367
|
-
const width =
|
|
402
|
+
const width = import_react_native3.Dimensions.get("window").width;
|
|
368
403
|
const json = KbachModule.resolveStyle(classString, getThemeJson(), colorScheme, pressed, width);
|
|
369
404
|
return JSON.parse(json);
|
|
370
405
|
}
|
|
371
406
|
|
|
372
407
|
// src/jsx-runtime.tsx
|
|
373
|
-
|
|
374
|
-
return (isStaticChildren ? import_jsx_runtime.jsxs : import_jsx_runtime.jsx)(type, props, key);
|
|
375
|
-
}
|
|
376
|
-
function resolvedStyleFor(classStrRaw, userStyle, pressed) {
|
|
377
|
-
const resolved = resolveStyle(classStrRaw, pressed);
|
|
378
|
-
if (userStyle === void 0) {
|
|
379
|
-
return resolved;
|
|
380
|
-
}
|
|
381
|
-
if (typeof userStyle === "function") {
|
|
382
|
-
return [resolved, userStyle({ pressed })];
|
|
383
|
-
}
|
|
384
|
-
return [resolved, userStyle];
|
|
385
|
-
}
|
|
386
|
-
function processElement(type, rawProps, key, isStaticChildren) {
|
|
387
|
-
if (type === null || typeof type === "symbol" || !rawProps) {
|
|
388
|
-
return makeElement(isStaticChildren, type, rawProps ?? {}, key);
|
|
389
|
-
}
|
|
390
|
-
const { className: classStrRaw, style: userStyle, ...rest } = rawProps;
|
|
391
|
-
if (typeof classStrRaw !== "string") {
|
|
392
|
-
return makeElement(isStaticChildren, type, rawProps, key);
|
|
393
|
-
}
|
|
394
|
-
const finalStyle = type === import_react_native3.Pressable ? (state) => resolvedStyleFor(classStrRaw, userStyle, state.pressed) : resolvedStyleFor(classStrRaw, userStyle, false);
|
|
395
|
-
return makeElement(isStaticChildren, type, { ...rest, style: finalStyle }, key);
|
|
396
|
-
}
|
|
397
|
-
function jsx(type, props, key) {
|
|
398
|
-
return processElement(type, props, key, false);
|
|
399
|
-
}
|
|
400
|
-
function jsxs(type, props, key) {
|
|
401
|
-
return processElement(type, props, key, true);
|
|
402
|
-
}
|
|
408
|
+
var { jsx, jsxs } = createJsxFunctions(resolveStyle);
|
|
403
409
|
// Annotate the CommonJS export names for ESM import in node:
|
|
404
410
|
0 && (module.exports = {
|
|
405
411
|
Fragment,
|
package/dist/jsx-runtime.mjs
CHANGED
|
@@ -1,9 +1,12 @@
|
|
|
1
1
|
import {
|
|
2
|
-
Fragment,
|
|
3
2
|
jsx,
|
|
4
3
|
jsxs
|
|
5
|
-
} from "./chunk-
|
|
6
|
-
import "./chunk-
|
|
4
|
+
} from "./chunk-OJQAJLYT.mjs";
|
|
5
|
+
import "./chunk-FG5E4NLJ.mjs";
|
|
6
|
+
import {
|
|
7
|
+
Fragment
|
|
8
|
+
} from "./chunk-DLIXI5OW.mjs";
|
|
9
|
+
import "./chunk-AEVOM2NB.mjs";
|
|
7
10
|
export {
|
|
8
11
|
Fragment,
|
|
9
12
|
jsx,
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
export { Fragment, JSX } from 'react';
|
|
3
|
+
|
|
4
|
+
declare const jsx: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
|
|
5
|
+
declare const jsxs: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
|
|
6
|
+
|
|
7
|
+
export { jsx, jsxs };
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
export { Fragment, JSX } from 'react';
|
|
3
|
+
|
|
4
|
+
declare const jsx: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
|
|
5
|
+
declare const jsxs: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
|
|
6
|
+
|
|
7
|
+
export { jsx, jsxs };
|