@kbach/react 0.5.4 → 0.5.6

package/dist/{chunk-UR4DTYE3.mjs → chunk-BQJS4P2Z.mjs}

@@ -8,7 +8,7 @@ import {
   resolve,
   useConditionalWidth,
   useGlobalDarkMode
-} from "./chunk-D7Q7ZCOW.mjs";
+} from "./chunk-MNDU7U43.mjs";
 
 // src/jsx-runtime.tsx
 import { jsx as _jsx, jsxs as _jsxs, Fragment } from "react/jsx-runtime";

package/dist/{chunk-D7Q7ZCOW.mjs → chunk-MNDU7U43.mjs}

@@ -3384,16 +3384,21 @@ function buildConfig(userConfig) {
   if (userConfig.theme) {
     theme = deepMerge(theme, userConfig.theme);
   }
-  if (userConfig.extend?.theme) {
-    const ext = userConfig.extend.theme;
-    for (const [key, value] of Object.entries(ext)) {
-      if (value !== null && typeof value === "object" && !Array.isArray(value)) {
-        theme[key] = deepMerge(
-          theme[key] ?? {},
-          value
-        );
-      } else {
-        theme[key] = value;
+  if (userConfig.extend) {
+    const { theme: nestedTheme, ...directKeys } = userConfig.extend;
+    const extSources = [];
+    if (nestedTheme) extSources.push(nestedTheme);
+    if (Object.keys(directKeys).length) extSources.push(directKeys);
+    for (const ext of extSources) {
+      for (const [key, value] of Object.entries(ext)) {
+        if (value !== null && typeof value === "object" && !Array.isArray(value)) {
+          theme[key] = deepMerge(
+            theme[key] ?? {},
+            value
+          );
+        } else if (value !== void 0) {
+          theme[key] = value;
+        }
       }
     }
   }

package/dist/index.d.mts

@@ -57,9 +57,10 @@ interface PluginAPI {
 interface FrameworkConfig {
     darkMode?: DarkMode;
     theme?: Partial<ThemeConfig>;
+    /** Additive theme extension — accepts either `extend.theme.X` or `extend.X` directly. */
     extend?: {
         theme?: Partial<ThemeConfig>;
-    };
+    } & Partial<ThemeConfig>;
     plugins?: Array<(api: PluginAPI) => void>;
     content?: string[];
 }

package/dist/index.d.ts

@@ -57,9 +57,10 @@ interface PluginAPI {
 interface FrameworkConfig {
     darkMode?: DarkMode;
     theme?: Partial<ThemeConfig>;
+    /** Additive theme extension — accepts either `extend.theme.X` or `extend.X` directly. */
     extend?: {
         theme?: Partial<ThemeConfig>;
-    };
+    } & Partial<ThemeConfig>;
     plugins?: Array<(api: PluginAPI) => void>;
     content?: string[];
 }

package/dist/index.js

@@ -3514,16 +3514,21 @@ function buildConfig(userConfig) {
   if (userConfig.theme) {
     theme = deepMerge(theme, userConfig.theme);
   }
-  if (userConfig.extend?.theme) {
-    const ext = userConfig.extend.theme;
-    for (const [key, value] of Object.entries(ext)) {
-      if (value !== null && typeof value === "object" && !Array.isArray(value)) {
-        theme[key] = deepMerge(
-          theme[key] ?? {},
-          value
-        );
-      } else {
-        theme[key] = value;
+  if (userConfig.extend) {
+    const { theme: nestedTheme, ...directKeys } = userConfig.extend;
+    const extSources = [];
+    if (nestedTheme) extSources.push(nestedTheme);
+    if (Object.keys(directKeys).length) extSources.push(directKeys);
+    for (const ext of extSources) {
+      for (const [key, value] of Object.entries(ext)) {
+        if (value !== null && typeof value === "object" && !Array.isArray(value)) {
+          theme[key] = deepMerge(
+            theme[key] ?? {},
+            value
+          );
+        } else if (value !== void 0) {
+          theme[key] = value;
+        }
       }
     }
   }
@@ -3968,6 +3973,9 @@ function styled(Component, baseClasses = "") {
         style: styleProp,
         onPressIn,
         onPressOut,
+        onPointerDown,
+        onPointerUp,
+        onPointerLeave,
         onMouseEnter,
         onMouseLeave,
         onFocus,
@@ -3986,6 +3994,18 @@ function styled(Component, baseClasses = "") {
         setPressed(false);
         onPressOut?.(e);
       }, [onPressOut]);
+      const handlePointerDown = (0, import_react6.useCallback)((e) => {
+        setPressed(true);
+        onPointerDown?.(e);
+      }, [onPointerDown]);
+      const handlePointerUp = (0, import_react6.useCallback)((e) => {
+        setPressed(false);
+        onPointerUp?.(e);
+      }, [onPointerUp]);
+      const handlePointerLeave = (0, import_react6.useCallback)((e) => {
+        setPressed(false);
+        onPointerLeave?.(e);
+      }, [onPointerLeave]);
       const handleMouseEnter = (0, import_react6.useCallback)((e) => {
         setHovered(true);
         onMouseEnter?.(e);
@@ -4020,9 +4040,8 @@ function styled(Component, baseClasses = "") {
         style: finalStyle,
         // className lets injected CSS rules (group-hover:, before:, print:, etc.) match the element.
         ...isWeb && combined ? { className: combined } : {},
-        // onPressIn / onPressOut are React Native-only events; forwarding them to
-        // a DOM element on web triggers React's unknown-prop warning.
-        ...isWeb ? {} : { onPressIn: handlePressIn, onPressOut: handlePressOut },
+        // onPressIn / onPressOut are React Native-only; on web use Pointer Events instead.
+        ...isWeb ? { onPointerDown: handlePointerDown, onPointerUp: handlePointerUp, onPointerLeave: handlePointerLeave } : { onPressIn: handlePressIn, onPressOut: handlePressOut },
         onMouseEnter: handleMouseEnter,
         onMouseLeave: handleMouseLeave,
         onFocus: handleFocus,

package/dist/index.mjs

@@ -23,7 +23,7 @@ import {
   useConditionalWidth,
   useGlobalDarkMode,
   useGlobalWidth
-} from "./chunk-D7Q7ZCOW.mjs";
+} from "./chunk-MNDU7U43.mjs";
 
 // src/context.tsx
 import { createContext, useContext } from "react";
@@ -390,6 +390,9 @@ function styled(Component, baseClasses = "") {
         style: styleProp,
         onPressIn,
         onPressOut,
+        onPointerDown,
+        onPointerUp,
+        onPointerLeave,
         onMouseEnter,
         onMouseLeave,
         onFocus,
@@ -408,6 +411,18 @@ function styled(Component, baseClasses = "") {
         setPressed(false);
         onPressOut?.(e);
       }, [onPressOut]);
+      const handlePointerDown = useCallback3((e) => {
+        setPressed(true);
+        onPointerDown?.(e);
+      }, [onPointerDown]);
+      const handlePointerUp = useCallback3((e) => {
+        setPressed(false);
+        onPointerUp?.(e);
+      }, [onPointerUp]);
+      const handlePointerLeave = useCallback3((e) => {
+        setPressed(false);
+        onPointerLeave?.(e);
+      }, [onPointerLeave]);
       const handleMouseEnter = useCallback3((e) => {
         setHovered(true);
         onMouseEnter?.(e);
@@ -442,9 +457,8 @@ function styled(Component, baseClasses = "") {
         style: finalStyle,
         // className lets injected CSS rules (group-hover:, before:, print:, etc.) match the element.
         ...isWeb && combined ? { className: combined } : {},
-        // onPressIn / onPressOut are React Native-only events; forwarding them to
-        // a DOM element on web triggers React's unknown-prop warning.
-        ...isWeb ? {} : { onPressIn: handlePressIn, onPressOut: handlePressOut },
+        // onPressIn / onPressOut are React Native-only; on web use Pointer Events instead.
+        ...isWeb ? { onPointerDown: handlePointerDown, onPointerUp: handlePointerUp, onPointerLeave: handlePointerLeave } : { onPressIn: handlePressIn, onPressOut: handlePressOut },
         onMouseEnter: handleMouseEnter,
         onMouseLeave: handleMouseLeave,
         onFocus: handleFocus,

package/dist/jsx-dev-runtime.js

@@ -3397,16 +3397,21 @@ function buildConfig(userConfig) {
   if (userConfig.theme) {
     theme = deepMerge(theme, userConfig.theme);
   }
-  if (userConfig.extend?.theme) {
-    const ext = userConfig.extend.theme;
-    for (const [key, value] of Object.entries(ext)) {
-      if (value !== null && typeof value === "object" && !Array.isArray(value)) {
-        theme[key] = deepMerge(
-          theme[key] ?? {},
-          value
-        );
-      } else {
-        theme[key] = value;
+  if (userConfig.extend) {
+    const { theme: nestedTheme, ...directKeys } = userConfig.extend;
+    const extSources = [];
+    if (nestedTheme) extSources.push(nestedTheme);
+    if (Object.keys(directKeys).length) extSources.push(directKeys);
+    for (const ext of extSources) {
+      for (const [key, value] of Object.entries(ext)) {
+        if (value !== null && typeof value === "object" && !Array.isArray(value)) {
+          theme[key] = deepMerge(
+            theme[key] ?? {},
+            value
+          );
+        } else if (value !== void 0) {
+          theme[key] = value;
+        }
       }
     }
   }

package/dist/jsx-dev-runtime.mjs

@@ -2,8 +2,8 @@ import {
   Fragment,
   jsx,
   jsxs
-} from "./chunk-UR4DTYE3.mjs";
-import "./chunk-D7Q7ZCOW.mjs";
+} from "./chunk-BQJS4P2Z.mjs";
+import "./chunk-MNDU7U43.mjs";
 
 // src/jsx-dev-runtime.tsx
 function jsxDEV(type, props, key, isStaticChildren, _source, _self) {

package/dist/jsx-runtime.js

@@ -3396,16 +3396,21 @@ function buildConfig(userConfig) {
   if (userConfig.theme) {
     theme = deepMerge(theme, userConfig.theme);
   }
-  if (userConfig.extend?.theme) {
-    const ext = userConfig.extend.theme;
-    for (const [key, value] of Object.entries(ext)) {
-      if (value !== null && typeof value === "object" && !Array.isArray(value)) {
-        theme[key] = deepMerge(
-          theme[key] ?? {},
-          value
-        );
-      } else {
-        theme[key] = value;
+  if (userConfig.extend) {
+    const { theme: nestedTheme, ...directKeys } = userConfig.extend;
+    const extSources = [];
+    if (nestedTheme) extSources.push(nestedTheme);
+    if (Object.keys(directKeys).length) extSources.push(directKeys);
+    for (const ext of extSources) {
+      for (const [key, value] of Object.entries(ext)) {
+        if (value !== null && typeof value === "object" && !Array.isArray(value)) {
+          theme[key] = deepMerge(
+            theme[key] ?? {},
+            value
+          );
+        } else if (value !== void 0) {
+          theme[key] = value;
+        }
       }
     }
   }

package/dist/jsx-runtime.mjs

@@ -2,8 +2,8 @@ import {
   Fragment,
   jsx,
   jsxs
-} from "./chunk-UR4DTYE3.mjs";
-import "./chunk-D7Q7ZCOW.mjs";
+} from "./chunk-BQJS4P2Z.mjs";
+import "./chunk-MNDU7U43.mjs";
 export {
   Fragment,
   jsx,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kbach/react",
-  "version": "0.5.4",
+  "version": "0.5.6",
   "description": "React / React Native components and hooks for the Kbach framework",
   "source": "./src/index.ts",
   "main": "./dist/index.js",