@pyreon/rocketstyle 0.24.0 → 0.24.1

package/lib/index.js

@@ -16,6 +16,13 @@ const PSEUDO_KEYS = [
 ];
 /** Meta pseudo-state keys representing non-interactive states (disabled, readOnly). */
 const PSEUDO_META_KEYS = ["disabled", "readOnly"];
+/**
+* Pre-merged interaction + meta keys. Hoisted from `rocketstyle.ts`'s
+* `rocketComponent` definition scope to module scope so the merged
+* 6-element array is allocated ONCE per process, not once per
+* rocketstyle definition. Ported from vitus-labs `00fdadc2`.
+*/
+const PSEUDO_AND_META_KEYS = [...PSEUDO_KEYS, ...PSEUDO_META_KEYS];
 /** Supported theme mode flags. */
 const THEME_MODES = {
 	light: true,
@@ -269,7 +276,7 @@ const mergeDescriptors = (...sources) => {
 /** Picks only the props whose keys exist in the dimension keywords lookup and have truthy values. */
 const pickStyledAttrs = (props, keywords) => {
 	const result = {};
-	for (const key of Object.keys(props)) if (keywords[key] && props[key]) result[key] = props[key];
+	for (const key in props) if (keywords[key] && props[key]) result[key] = props[key];
 	return result;
 };
 const calculateChainOptions = (options) => (args) => {
@@ -477,13 +484,16 @@ const getTheme = ({ rocketstate, themes, baseTheme, transformKeys, appTheme }) =
 	finalTheme.readOnly ??= EMPTY_PSEUDO;
 	return finalTheme;
 };
-const getThemeByMode = (object, mode) => Object.keys(object).reduce((acc, key) => {
-	const value = object[key];
-	if (typeof value === "object" && value !== null) acc[key] = getThemeByMode(value, mode);
-	else if (isModeCallback(value)) acc[key] = value(mode);
-	else acc[key] = value;
+const getThemeByMode = (object, mode) => {
+	const acc = {};
+	for (const key in object) {
+		const value = object[key];
+		if (typeof value === "object" && value !== null) acc[key] = getThemeByMode(value, mode);
+		else if (isModeCallback(value)) acc[key] = value(mode);
+		else acc[key] = value;
+	}
 	return acc;
-}, {});
+};
 
 //#endregion
 //#region src/rocketstyle.ts
@@ -535,7 +545,7 @@ const rocketComponent = (options) => {
 	const ThemeManager$1 = new ThemeManager();
 	const _dimensionsCache = /* @__PURE__ */ new WeakMap();
 	const _reservedKeysCache = /* @__PURE__ */ new WeakMap();
-	const ALL_PSEUDO_KEYS = [...PSEUDO_KEYS, ...PSEUDO_META_KEYS];
+	const ALL_PSEUDO_KEYS = PSEUDO_AND_META_KEYS;
 	const STATIC_OMIT_KEYS = [
 		"pseudo",
 		...PSEUDO_KEYS,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pyreon/rocketstyle",
-  "version": "0.24.0",
+  "version": "0.24.1",
   "description": "Multi-dimensional style composition for Pyreon components",
   "license": "MIT",
   "repository": {
@@ -43,8 +43,8 @@
   },
   "devDependencies": {
     "@pyreon/test-utils": "^0.13.11",
-    "@pyreon/typescript": "^0.24.0",
-    "@pyreon/ui-core": "^0.24.0",
+    "@pyreon/typescript": "^0.24.1",
+    "@pyreon/ui-core": "^0.24.1",
     "@vitest/browser-playwright": "^4.1.4",
     "@vitus-labs/tools-rolldown": "^2.4.0"
   },
@@ -52,9 +52,9 @@
     "node": ">= 22"
   },
   "dependencies": {
-    "@pyreon/core": "^0.24.0",
-    "@pyreon/reactivity": "^0.24.0",
-    "@pyreon/styler": "^0.24.0",
-    "@pyreon/ui-core": "^0.24.0"
+    "@pyreon/core": "^0.24.1",
+    "@pyreon/reactivity": "^0.24.1",
+    "@pyreon/styler": "^0.24.1",
+    "@pyreon/ui-core": "^0.24.1"
   }
 }

package/src/constants/index.ts

@@ -14,6 +14,14 @@ export const PSEUDO_KEYS = ['hover', 'active', 'focus', 'pressed'] as const
 /** Meta pseudo-state keys representing non-interactive states (disabled, readOnly). */
 export const PSEUDO_META_KEYS = ['disabled', 'readOnly'] as const
 
+/**
+ * Pre-merged interaction + meta keys. Hoisted from `rocketstyle.ts`'s
+ * `rocketComponent` definition scope to module scope so the merged
+ * 6-element array is allocated ONCE per process, not once per
+ * rocketstyle definition. Ported from vitus-labs `00fdadc2`.
+ */
+export const PSEUDO_AND_META_KEYS = [...PSEUDO_KEYS, ...PSEUDO_META_KEYS] as const
+
 /** Supported theme mode flags. */
 export const THEME_MODES = {
   light: true,

package/src/rocketstyle.ts

@@ -1,6 +1,6 @@
 import { compose, config, hoistNonReactStatics, omit, pick, render } from '@pyreon/ui-core'
 import { LocalThemeManager } from './cache'
-import { CONFIG_KEYS, PSEUDO_KEYS, PSEUDO_META_KEYS, STYLING_KEYS, __DEV__ } from './constants'
+import { CONFIG_KEYS, PSEUDO_AND_META_KEYS, PSEUDO_KEYS, STYLING_KEYS, __DEV__ } from './constants'
 import createLocalProvider from './context/createLocalProvider'
 import { useLocalContext } from './context/localContext'
 import { rocketstyleAttrsHoc } from './hoc'
@@ -130,8 +130,11 @@ const rocketComponent: RocketComponent = (options) => {
   >()
   const _reservedKeysCache = new WeakMap<object, string[]>()
 
-  // Pre-compute merged key arrays once per definition (not per mount)
-  const ALL_PSEUDO_KEYS = [...PSEUDO_KEYS, ...PSEUDO_META_KEYS]
+  // Reuse the module-scope pre-merged constant. Cast away `readonly` for
+  // the downstream consumers that take a plain `string[]`. Saves the
+  // 6-element array allocation that fired once per `rocketstyle()`
+  // definition. Ported from vitus-labs `00fdadc2`.
+  const ALL_PSEUDO_KEYS = PSEUDO_AND_META_KEYS as unknown as string[]
   // Static portion of omit keys — PSEUDO_KEYS + filterAttrs + 'pseudo' are definition-scoped.
   // RESERVED_STYLING_PROPS_KEYS is dimension-dependent but also cached per definition.
   // 'pseudo' is included here so we can skip the destructuring spread of mergeProps.

package/src/utils/attrs.ts

@@ -72,8 +72,13 @@ export const pickStyledAttrs = <
   props: T,
   keywords: K,
 ): { [I in keyof K & keyof T]: T[I] } => {
+  // Direct `for...in` avoids the `Object.keys(props)` array allocation
+  // that `for (const key of Object.keys(props))` paid on every render.
+  // The hot path is rocketstyle's `EnhancedComponent` body — fires once
+  // per render of every rocketstyle-wrapped component. Ported from
+  // vitus-labs `00fdadc2`.
   const result: Record<string, unknown> = {}
-  for (const key of Object.keys(props)) {
+  for (const key in props) {
     if (keywords[key] && props[key]) result[key] = props[key]
   }
   return result as { [I in keyof K & keyof T]: T[I] }

package/src/utils/theme.ts

@@ -189,20 +189,23 @@ export type GetThemeByMode = (
   themes: Record<string, unknown>
 }>
 
-export const getThemeByMode: GetThemeByMode = (object, mode) =>
-  Object.keys(object).reduce(
-    (acc, key) => {
-      const value = object[key]
-
-      if (typeof value === 'object' && value !== null) {
-        acc[key] = getThemeByMode(value, mode)
-      } else if (isModeCallback(value)) {
-        acc[key] = value(mode)
-      } else {
-        acc[key] = value
-      }
-
-      return acc
-    },
-    {} as Record<string, any>,
-  )
+export const getThemeByMode: GetThemeByMode = (object, mode) => {
+  // Recursive theme walker — `for...in` avoids the per-node
+  // `Object.keys` array allocation that the prior reduce paid. Called
+  // from inside cached `LocalThemeManager` WeakMap tiers (one per
+  // theme/mode transition), so the win is smaller than per-render
+  // helpers but the pattern is consistent. Ported from vitus-labs
+  // `00fdadc2`.
+  const acc: Record<string, any> = {}
+  for (const key in object) {
+    const value = object[key]
+    if (typeof value === 'object' && value !== null) {
+      acc[key] = getThemeByMode(value, mode)
+    } else if (isModeCallback(value)) {
+      acc[key] = value(mode)
+    } else {
+      acc[key] = value
+    }
+  }
+  return acc
+}