@kbach/react-native 1.0.0-beta.2 → 1.0.0-beta.4

package/dist/jsx-dev-runtime.web.mjs

@@ -0,0 +1,17 @@
+import {
+  jsx,
+  jsxs
+} from "./chunk-ZUE6SCTE.mjs";
+import "./chunk-KSDFO34H.mjs";
+import {
+  Fragment,
+  createJsxDEV
+} from "./chunk-DLIXI5OW.mjs";
+import "./chunk-AEVOM2NB.mjs";
+
+// src/jsx-dev-runtime.web.tsx
+var jsxDEV = createJsxDEV(jsx, jsxs);
+export {
+  Fragment,
+  jsxDEV
+};

package/dist/jsx-runtime.d.mts

@@ -1,27 +1,7 @@
-import { ReactElement } from 'react';
+import * as react from 'react';
 export { Fragment, JSX } from 'react';
 
-/**
- * @kbach/react-native/jsx-runtime
- *
- * Drop-in replacement for react/jsx-runtime — same interception shape as
- * @kbach/react/jsx-runtime (Phase 3), but the resolved value becomes the
- * `style` prop instead of `className`: View/Text have no `className` prop
- * at all. Covers layout, color, spacing, border, typography, dark:, and
- * active: (Pressable only) — see nativeBridge.ts / resolve_style.rs for
- * exactly what's resolved; every other modifier (hover:/responsive/...)
- * parses but isn't applied yet.
- *
- * `active:` needs different handling from every other modifier: whether an
- * element is "pressed" isn't a value that can be read once and reused like
- * `dark:`'s color scheme — only RN's `Pressable` ever knows it, and only
- * via a style FUNCTION it calls on every press/release
- * (`style={({pressed}) => ...}`). So for `type === Pressable` specifically,
- * `style` is built as a function instead of a static value; every other
- * element type is completely unaffected by this — same code path as before.
- */
-
-declare function jsx(type: unknown, props: Record<string, unknown> | null, key?: string): ReactElement;
-declare function jsxs(type: unknown, props: Record<string, unknown> | null, key?: string): ReactElement;
+declare const jsx: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
+declare const jsxs: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
 
 export { jsx, jsxs };

package/dist/jsx-runtime.d.ts

@@ -1,27 +1,7 @@
-import { ReactElement } from 'react';
+import * as react from 'react';
 export { Fragment, JSX } from 'react';
 
-/**
- * @kbach/react-native/jsx-runtime
- *
- * Drop-in replacement for react/jsx-runtime — same interception shape as
- * @kbach/react/jsx-runtime (Phase 3), but the resolved value becomes the
- * `style` prop instead of `className`: View/Text have no `className` prop
- * at all. Covers layout, color, spacing, border, typography, dark:, and
- * active: (Pressable only) — see nativeBridge.ts / resolve_style.rs for
- * exactly what's resolved; every other modifier (hover:/responsive/...)
- * parses but isn't applied yet.
- *
- * `active:` needs different handling from every other modifier: whether an
- * element is "pressed" isn't a value that can be read once and reused like
- * `dark:`'s color scheme — only RN's `Pressable` ever knows it, and only
- * via a style FUNCTION it calls on every press/release
- * (`style={({pressed}) => ...}`). So for `type === Pressable` specifically,
- * `style` is built as a function instead of a static value; every other
- * element type is completely unaffected by this — same code path as before.
- */
-
-declare function jsx(type: unknown, props: Record<string, unknown> | null, key?: string): ReactElement;
-declare function jsxs(type: unknown, props: Record<string, unknown> | null, key?: string): ReactElement;
+declare const jsx: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
+declare const jsxs: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
 
 export { jsx, jsxs };

package/dist/jsx-runtime.js

@@ -25,12 +25,47 @@ __export(jsx_runtime_exports, {
   jsxs: () => jsxs
 });
 module.exports = __toCommonJS(jsx_runtime_exports);
+
+// src/jsxRuntimeCore.ts
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
-var import_react_native3 = require("react-native");
+var import_react_native = require("react-native");
+function makeElement(isStaticChildren, type, props, key) {
+  return (isStaticChildren ? import_jsx_runtime.jsxs : import_jsx_runtime.jsx)(type, props, key);
+}
+function resolvedStyleFor(resolveStyle2, classStrRaw, userStyle, pressed) {
+  const resolved = resolveStyle2(classStrRaw, pressed);
+  if (userStyle === void 0) {
+    return resolved;
+  }
+  if (typeof userStyle === "function") {
+    return [resolved, userStyle({ pressed })];
+  }
+  return [resolved, userStyle];
+}
+function processElement(resolveStyle2, type, rawProps, key, isStaticChildren) {
+  if (type === null || typeof type === "symbol" || !rawProps) {
+    return makeElement(isStaticChildren, type, rawProps ?? {}, key);
+  }
+  const { className: classStrRaw, style: userStyle, ...rest } = rawProps;
+  if (typeof classStrRaw !== "string") {
+    return makeElement(isStaticChildren, type, rawProps, key);
+  }
+  const finalStyle = type === import_react_native.Pressable ? (state) => resolvedStyleFor(resolveStyle2, classStrRaw, userStyle, state.pressed) : resolvedStyleFor(resolveStyle2, classStrRaw, userStyle, false);
+  return makeElement(isStaticChildren, type, { ...rest, style: finalStyle }, key);
+}
+function createJsxFunctions(resolveStyle2) {
+  function jsx2(type, props, key) {
+    return processElement(resolveStyle2, type, props, key, false);
+  }
+  function jsxs2(type, props, key) {
+    return processElement(resolveStyle2, type, props, key, true);
+  }
+  return { jsx: jsx2, jsxs: jsxs2 };
+}
 
 // src/nativeBridge.ts
-var import_react_native2 = require("react-native");
+var import_react_native3 = require("react-native");
 
 // src/generatedPalette.ts
 var PALETTE = {
@@ -323,7 +358,13 @@ var defaultTheme = {
     "6": 24,
     "8": 32
   },
-  screens: {},
+  screens: {
+    sm: 640,
+    md: 768,
+    lg: 1024,
+    xl: 1280,
+    "2xl": 1536
+  },
   darkMode: "attribute"
 };
 var activeThemeJson = JSON.stringify(defaultTheme);
@@ -332,17 +373,17 @@ function getThemeJson() {
 }
 
 // src/darkModeStore.ts
-var import_react_native = require("react-native");
+var import_react_native2 = require("react-native");
 var listeners = /* @__PURE__ */ new Set();
 function systemPrefersDark() {
-  return import_react_native.Appearance.getColorScheme() === "dark";
+  return import_react_native2.Appearance.getColorScheme() === "dark";
 }
 function resolveIsDark(m) {
   return m === "system" ? systemPrefersDark() : m === "dark";
 }
 var mode = "system";
 var isDark = resolveIsDark(mode);
-var subscription = import_react_native.Appearance.addChangeListener(({ colorScheme }) => {
+var subscription = import_react_native2.Appearance.addChangeListener(({ colorScheme }) => {
   if (mode !== "system") return;
   isDark = colorScheme === "dark";
   notify();
@@ -356,43 +397,15 @@ function getGlobalDarkMode() {
 
 // src/nativeBridge.ts
 function resolveStyle(classString, pressed = false) {
-  const KbachModule = import_react_native2.TurboModuleRegistry.getEnforcing("KbachModule");
+  const KbachModule = import_react_native3.TurboModuleRegistry.getEnforcing("KbachModule");
   const colorScheme = getGlobalDarkMode() ? "dark" : "light";
-  const json = KbachModule.resolveStyle(classString, getThemeJson(), colorScheme, pressed);
+  const width = import_react_native3.Dimensions.get("window").width;
+  const json = KbachModule.resolveStyle(classString, getThemeJson(), colorScheme, pressed, width);
   return JSON.parse(json);
 }
 
 // src/jsx-runtime.tsx
-function makeElement(isStaticChildren, type, props, key) {
-  return (isStaticChildren ? import_jsx_runtime.jsxs : import_jsx_runtime.jsx)(type, props, key);
-}
-function resolvedStyleFor(classStrRaw, userStyle, pressed) {
-  const resolved = resolveStyle(classStrRaw, pressed);
-  if (userStyle === void 0) {
-    return resolved;
-  }
-  if (typeof userStyle === "function") {
-    return [resolved, userStyle({ pressed })];
-  }
-  return [resolved, userStyle];
-}
-function processElement(type, rawProps, key, isStaticChildren) {
-  if (type === null || typeof type === "symbol" || !rawProps) {
-    return makeElement(isStaticChildren, type, rawProps ?? {}, key);
-  }
-  const { className: classStrRaw, style: userStyle, ...rest } = rawProps;
-  if (typeof classStrRaw !== "string") {
-    return makeElement(isStaticChildren, type, rawProps, key);
-  }
-  const finalStyle = type === import_react_native3.Pressable ? (state) => resolvedStyleFor(classStrRaw, userStyle, state.pressed) : resolvedStyleFor(classStrRaw, userStyle, false);
-  return makeElement(isStaticChildren, type, { ...rest, style: finalStyle }, key);
-}
-function jsx(type, props, key) {
-  return processElement(type, props, key, false);
-}
-function jsxs(type, props, key) {
-  return processElement(type, props, key, true);
-}
+var { jsx, jsxs } = createJsxFunctions(resolveStyle);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Fragment,

package/dist/jsx-runtime.mjs

@@ -1,9 +1,12 @@
 import {
-  Fragment,
   jsx,
   jsxs
-} from "./chunk-SVMYVXY6.mjs";
-import "./chunk-YHF3QLRL.mjs";
+} from "./chunk-OJQAJLYT.mjs";
+import "./chunk-FG5E4NLJ.mjs";
+import {
+  Fragment
+} from "./chunk-DLIXI5OW.mjs";
+import "./chunk-AEVOM2NB.mjs";
 export {
   Fragment,
   jsx,

package/dist/jsx-runtime.web.d.mts

@@ -0,0 +1,7 @@
+import * as react from 'react';
+export { Fragment, JSX } from 'react';
+
+declare const jsx: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
+declare const jsxs: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
+
+export { jsx, jsxs };

package/dist/jsx-runtime.web.d.ts

@@ -0,0 +1,7 @@
+import * as react from 'react';
+export { Fragment, JSX } from 'react';
+
+declare const jsx: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
+declare const jsxs: (type: unknown, props: Record<string, unknown> | null, key?: string) => react.ReactElement;
+
+export { jsx, jsxs };