@vitus-labs/rocketstyle 2.0.0-alpha.27 → 2.0.0-alpha.29

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 CHANGED
@@ -5,7 +5,7 @@ Multi-dimensional styling system for React.
5
5
  [![npm](https://img.shields.io/npm/v/@vitus-labs/rocketstyle)](https://www.npmjs.com/package/@vitus-labs/rocketstyle)
6
6
  [![license](https://img.shields.io/npm/l/@vitus-labs/rocketstyle)](https://github.com/vitus-labs/ui-system/blob/main/LICENSE)
7
7
 
8
- Organize component styles by dimensions — states, sizes, variants — instead of flat props. Chain theme values, attach styled-components CSS, and get full TypeScript inference. Built-in pseudo-state handling, light/dark mode, and provider/consumer patterns for parent-child state propagation.
8
+ Organize component styles by dimensions — states, sizes, variants — instead of flat props. Chain theme values, attach CSS via the active connector, and get full TypeScript inference. Built-in pseudo-state handling, light/dark mode, and provider/consumer patterns for parent-child state propagation.
9
9
 
10
10
  ## Features
11
11
 
@@ -21,7 +21,7 @@ Organize component styles by dimensions — states, sizes, variants — instead
21
21
  ## Installation
22
22
 
23
23
  ```bash
24
- npm install @vitus-labs/rocketstyle @vitus-labs/core styled-components
24
+ npm install @vitus-labs/rocketstyle @vitus-labs/core
25
25
  ```
26
26
 
27
27
  ## Quick Start
@@ -110,7 +110,7 @@ Pseudo-state keys nest directly in the theme object:
110
110
 
111
111
  ### Styles Function
112
112
 
113
- The `.styles()` method defines the styled-components template that receives the computed theme:
113
+ The `.styles()` method defines the CSS template that receives the computed theme:
114
114
 
115
115
  ```tsx
116
116
  .styles((css) => css`
@@ -200,7 +200,7 @@ Button.states((theme, mode, css) => ({
200
200
 
201
201
  ### .styles(callback)
202
202
 
203
- Define the styled-components CSS template.
203
+ Define the CSS template using the active connector's `css` tagged template.
204
204
 
205
205
  ```tsx
206
206
  Button.styles((css) => css`
package/lib/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import { config, context, render } from "@vitus-labs/core";
2
- import { ComponentType, FC, FocusEventHandler, ForwardRefExoticComponent, MouseEventHandler, ReactNode } from "react";
2
+ import { ComponentType, FC, FocusEventHandler, MouseEventHandler, ReactNode } from "react";
3
3
 
4
4
  //#region src/context/context.d.ts
5
5
  type Theme$1 = {
@@ -66,11 +66,9 @@ type PseudoProps = Partial<PseudoState & PseudoActions>;
66
66
  type TObj = Record<string, unknown>;
67
67
  type TFn = (...args: any) => any;
68
68
  type CallBackParam = TObj | TFn;
69
- type ElementType<T extends TObj | unknown = any> = (ComponentType<T> & Partial<{
69
+ type ElementType<T extends TObj | unknown = any> = ComponentType<T> & Partial<{
70
70
  [key: string]: any;
71
- }>) | (ForwardRefExoticComponent<T> & {
72
- [key: string]: any;
73
- });
71
+ }>;
74
72
  type ValueOf<T> = T[keyof T];
75
73
  type ArrayOfValues<T> = T[keyof T][];
76
74
  type ArrayOfKeys<T> = Array<keyof T>;
@@ -83,7 +81,7 @@ type ExtractNullableKeys<T> = { [P in keyof T as IsAny<T[P]> extends true ? P :
83
81
  type SpreadTwo<L, R> = Id<Pick<L, Exclude<keyof L, keyof R>> & R>;
84
82
  type Spread<A extends readonly [...any]> = A extends [infer L, ...infer R] ? SpreadTwo<L, Spread<R>> : unknown;
85
83
  type MergeTypes<A extends readonly [...any]> = ExtractNullableKeys<Spread<A>>;
86
- type ExtractProps<TComponentOrTProps> = TComponentOrTProps extends ComponentType<infer TProps> ? TProps : TComponentOrTProps extends ForwardRefExoticComponent<infer TProps> ? TProps : TComponentOrTProps;
84
+ type ExtractProps<TComponentOrTProps> = TComponentOrTProps extends ComponentType<infer TProps> ? TProps : TComponentOrTProps;
87
85
  //#endregion
88
86
  //#region src/types/styles.d.ts
89
87
  interface StylesDefault {}
@@ -219,10 +217,6 @@ type GenericHoc = (component: ElementType) => ElementType;
219
217
  type ComposeParam = Record<string, GenericHoc | null | undefined | false>;
220
218
  //#endregion
221
219
  //#region src/types/rocketstyle.d.ts
222
- interface ExoticComponent<P = {}> {
223
- (props: P): ReactNode;
224
- readonly $$typeof: symbol;
225
- }
226
220
  type RocketStyleComponent<OA extends TObj = {}, EA extends TObj = {}, T extends TObj = {}, CSS extends TObj = {}, S extends TObj = {}, HOC extends TObj = {}, D extends Dimensions = Dimensions, UB extends boolean = boolean, DKP extends TDKP = TDKP> = IRocketStyleComponent<OA, EA, T, CSS, S, HOC, D, UB, DKP> & { [I in keyof D]: <K extends DimensionValue = D[I], P extends DimensionCallbackParam<Theme<T>, Styles<CSS>> = DimensionCallbackParam<Theme<T>, Styles<CSS>>>(param: P) => P extends DimensionCallbackParam<Theme<T>, Styles<CSS>> ? RocketStyleComponent<OA, EA, T, CSS, S, HOC, D, UB, DimensionProps<K, D, P, DKP>> : RocketStyleComponent<OA, EA, T, CSS, S, HOC, D, UB, DKP> };
227
221
  /**
228
222
  * @param OA Origin component props params.
@@ -235,7 +229,10 @@ type RocketStyleComponent<OA extends TObj = {}, EA extends TObj = {}, T extends
235
229
  * @param DKP Dimensions key props.
236
230
  * @param DFP Calculated final component props
237
231
  */
238
- interface IRocketStyleComponent<OA extends TObj = {}, EA extends TObj = {}, T extends TObj = {}, CSS extends TObj = {}, S extends TObj = {}, HOC extends TObj = {}, D extends Dimensions = Dimensions, UB extends boolean = boolean, DKP extends TDKP = TDKP, DFP = MergeTypes<[OA, EA, DefaultProps, ExtractDimensionProps<D, DKP, UB>]>> extends ExoticComponent<DFP> {
232
+ interface IRocketStyleComponent<OA extends TObj = {}, EA extends TObj = {}, T extends TObj = {}, CSS extends TObj = {}, S extends TObj = {}, HOC extends TObj = {}, D extends Dimensions = Dimensions, UB extends boolean = boolean, DKP extends TDKP = TDKP, DFP = MergeTypes<[OA, EA, DefaultProps, ExtractDimensionProps<D, DKP, UB>]>> {
233
+ (props: DFP & {
234
+ ref?: any;
235
+ }): ReactNode;
239
236
  /**
240
237
  * A chaining method to define default component theme
241
238
  * @param param _object_
@@ -575,11 +572,11 @@ type Rocketstyle = <D extends Dimensions = DefaultDimensions, UB extends boolean
575
572
  name: string;
576
573
  component: C;
577
574
  }) => ReturnType<RocketComponent<C, {}, {}, D, UB>>;
578
- declare const rocketstyle: Rocketstyle;
575
+ declare const typedRocketstyle: Rocketstyle;
579
576
  //#endregion
580
577
  //#region src/isRocketComponent.d.ts
581
578
  type IsRocketComponent = <T>(component: T) => boolean;
582
579
  declare const isRocketComponent: IsRocketComponent;
583
580
  //#endregion
584
- export { type AttrsCb, type ComposeParam, type ConfigAttrs, type ConsumerCb, type ConsumerCtxCBValue, type ConsumerCtxCb, type DefaultProps, type DimensionCallbackParam, type DimensionProps, type DimensionValue, type Dimensions, type ElementType, type ExtractDimensionProps, type ExtractDimensions, type ExtractProps, type GenericHoc, type IRocketStyleComponent, type IsRocketComponent, type MergeTypes, Provider, type RocketComponentType, type RocketProviderState, type RocketStyleComponent, type RocketStyleInterpolationProps, type Rocketstyle, type StylesCb, type StylesDefault, type TDKP, type TObj, type TProvider, type ThemeCb, type ThemeDefault, type ThemeMode, type ThemeModeCallback, type ThemeModeKeys, context, rocketstyle as default, rocketstyle, isRocketComponent };
581
+ export { type AttrsCb, type ComposeParam, type ConfigAttrs, type ConsumerCb, type ConsumerCtxCBValue, type ConsumerCtxCb, type DefaultProps, type DimensionCallbackParam, type DimensionProps, type DimensionValue, type Dimensions, type ElementType, type ExtractDimensionProps, type ExtractDimensions, type ExtractProps, type GenericHoc, type IRocketStyleComponent, type IsRocketComponent, type MergeTypes, Provider, type RocketComponentType, type RocketProviderState, type RocketStyleComponent, type RocketStyleInterpolationProps, type Rocketstyle, type StylesCb, type StylesDefault, type TDKP, type TObj, type TProvider, type ThemeCb, type ThemeDefault, type ThemeMode, type ThemeModeCallback, type ThemeModeKeys, context, typedRocketstyle as default, typedRocketstyle as rocketstyle, isRocketComponent };
585
582
  //# sourceMappingURL=index2.d.ts.map
package/lib/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { Provider as Provider$1, compose, config, context, get, hoistNonReactStatics, isEmpty, merge, omit, pick, render, set, useStableValue } from "@vitus-labs/core";
2
- import { createContext, forwardRef, useCallback, useContext, useImperativeHandle, useMemo, useRef, useState } from "react";
2
+ import { createContext, useCallback, useContext, useImperativeHandle, useMemo, useRef, useState } from "react";
3
3
  import { jsx } from "react/jsx-runtime";
4
4
 
5
5
  //#region src/constants/index.ts
@@ -202,12 +202,18 @@ const useThemeAttrs = ({ inversed }) => {
202
202
  const { theme = {}, mode: ctxMode = "light", isDark: ctxDark } = useContext(context) || {};
203
203
  const mode = inversed ? THEME_MODES_INVERSED[ctxMode] : ctxMode;
204
204
  const isDark = inversed ? !ctxDark : ctxDark;
205
- return {
205
+ const isLight = !isDark;
206
+ return useMemo(() => ({
206
207
  theme,
207
208
  mode,
208
209
  isDark,
209
- isLight: !isDark
210
- };
210
+ isLight
211
+ }), [
212
+ theme,
213
+ mode,
214
+ isDark,
215
+ isLight
216
+ ]);
211
217
  };
212
218
 
213
219
  //#endregion
@@ -218,13 +224,16 @@ const useThemeAttrs = ({ inversed }) => {
218
224
  * to its rocketstyle children.
219
225
  */
220
226
  const context$1 = createContext({});
227
+ const EMPTY_CTX = { pseudo: {} };
221
228
  const useLocalContext = (consumer) => {
222
229
  const ctx = useContext(context$1);
223
- if (!consumer) return { pseudo: {} };
224
- return {
225
- pseudo: {},
226
- ...consumer((callback) => callback(ctx))
227
- };
230
+ return useMemo(() => {
231
+ if (!consumer) return EMPTY_CTX;
232
+ return {
233
+ pseudo: {},
234
+ ...consumer((callback) => callback(ctx))
235
+ };
236
+ }, [consumer, ctx]);
228
237
  };
229
238
  const LocalProvider = context$1.Provider;
230
239
 
@@ -235,32 +244,35 @@ const LocalProvider = context$1.Provider;
235
244
  * detecting pseudo-states (hover, focus, pressed) via mouse/focus events
236
245
  * and broadcasting them through local context to child rocketstyle components.
237
246
  */
238
- const RocketStyleProviderComponent = (WrappedComponent) => forwardRef(({ onMouseEnter, onMouseLeave, onMouseUp, onMouseDown, onFocus, onBlur, $rocketstate, ...props }, ref) => {
239
- const { state: pseudoState, events: pseudoEvents } = usePseudoState({
240
- onMouseEnter,
241
- onMouseLeave,
242
- onMouseUp,
243
- onMouseDown,
244
- onFocus,
245
- onBlur
246
- });
247
- const updatedState = useStableValue({
248
- ...$rocketstate,
249
- pseudo: {
250
- ...$rocketstate.pseudo,
251
- ...pseudoState
252
- }
253
- });
254
- return /* @__PURE__ */ jsx(LocalProvider, {
255
- value: updatedState,
256
- children: /* @__PURE__ */ jsx(WrappedComponent, {
257
- ...props,
258
- ...pseudoEvents,
259
- ref,
260
- $rocketstate: updatedState
261
- })
262
- });
263
- });
247
+ const RocketStyleProviderComponent = (WrappedComponent) => {
248
+ const HOC = ({ onMouseEnter, onMouseLeave, onMouseUp, onMouseDown, onFocus, onBlur, $rocketstate, ref, ...props }) => {
249
+ const { state: pseudoState, events: pseudoEvents } = usePseudoState({
250
+ onMouseEnter,
251
+ onMouseLeave,
252
+ onMouseUp,
253
+ onMouseDown,
254
+ onFocus,
255
+ onBlur
256
+ });
257
+ const updatedState = useStableValue({
258
+ ...$rocketstate,
259
+ pseudo: {
260
+ ...$rocketstate.pseudo,
261
+ ...pseudoState
262
+ }
263
+ });
264
+ return /* @__PURE__ */ jsx(LocalProvider, {
265
+ value: updatedState,
266
+ children: /* @__PURE__ */ jsx(WrappedComponent, {
267
+ ...props,
268
+ ...pseudoEvents,
269
+ ref,
270
+ $rocketstate: updatedState
271
+ })
272
+ });
273
+ };
274
+ return HOC;
275
+ };
264
276
 
265
277
  //#endregion
266
278
  //#region src/utils/attrs.ts
@@ -288,17 +300,20 @@ const calculateStylingAttrs = ({ useBooleans, multiKeys }) => ({ props, dimensio
288
300
  else result[item] = void 0;
289
301
  });
290
302
  if (useBooleans) {
291
- const propsKeys = Object.keys(props).reverse();
303
+ const propsKeys = Object.keys(props);
292
304
  Object.entries(result).forEach(([key, value]) => {
293
305
  const isMultiKey = multiKeys[key];
294
306
  if (!value) {
295
307
  let newDimensionValue;
296
- const keywords = Object.keys(dimensions[key]);
297
- if (isMultiKey) newDimensionValue = propsKeys.filter((key) => keywords.includes(key));
298
- else newDimensionValue = propsKeys.find((key) => {
299
- if (keywords.includes(key) && props[key]) return key;
300
- return false;
301
- });
308
+ const keywordSet = new Set(Object.keys(dimensions[key]));
309
+ if (isMultiKey) newDimensionValue = propsKeys.filter((key) => keywordSet.has(key));
310
+ else for (let i = propsKeys.length - 1; i >= 0; i--) {
311
+ const k = propsKeys[i];
312
+ if (keywordSet.has(k) && props[k]) {
313
+ newDimensionValue = k;
314
+ break;
315
+ }
316
+ }
302
317
  result[key] = newDimensionValue;
303
318
  }
304
319
  });
@@ -317,27 +332,30 @@ const calculateStylingAttrs = ({ useBooleans, multiKeys }) => ({ props, dimensio
317
332
  const rocketStyleHOC = ({ inversed, attrs, priorityAttrs }) => {
318
333
  const calculateAttrs = calculateChainOptions(attrs);
319
334
  const calculatePriorityAttrs = calculateChainOptions(priorityAttrs);
320
- const Enhanced = (WrappedComponent) => forwardRef((props, ref) => {
321
- const { theme, mode, isDark, isLight } = useThemeAttrs({ inversed });
322
- const callbackParams = [theme, {
323
- render,
324
- mode,
325
- isDark,
326
- isLight
327
- }];
328
- const filteredProps = removeUndefinedProps(props);
329
- const prioritizedAttrs = calculatePriorityAttrs([filteredProps, ...callbackParams]);
330
- const finalAttrs = calculateAttrs([{
331
- ...prioritizedAttrs,
332
- ...filteredProps
333
- }, ...callbackParams]);
334
- return /* @__PURE__ */ jsx(WrappedComponent, {
335
- $rocketstyleRef: ref,
336
- ...prioritizedAttrs,
337
- ...finalAttrs,
338
- ...filteredProps
339
- });
340
- });
335
+ const Enhanced = (WrappedComponent) => {
336
+ const HOC = ({ ref, ...props }) => {
337
+ const { theme, mode, isDark, isLight } = useThemeAttrs({ inversed });
338
+ const callbackParams = [theme, {
339
+ render,
340
+ mode,
341
+ isDark,
342
+ isLight
343
+ }];
344
+ const filteredProps = removeUndefinedProps(props);
345
+ const prioritizedAttrs = calculatePriorityAttrs([filteredProps, ...callbackParams]);
346
+ const finalAttrs = calculateAttrs([{
347
+ ...prioritizedAttrs,
348
+ ...filteredProps
349
+ }, ...callbackParams]);
350
+ return /* @__PURE__ */ jsx(WrappedComponent, {
351
+ $rocketstyleRef: ref,
352
+ ...prioritizedAttrs,
353
+ ...finalAttrs,
354
+ ...filteredProps
355
+ });
356
+ };
357
+ return HOC;
358
+ };
341
359
  return Enhanced;
342
360
  };
343
361
 
@@ -432,12 +450,17 @@ const removeNullableValues = (obj) => Object.entries(obj).filter(([, v]) => v !=
432
450
 
433
451
  //#endregion
434
452
  //#region src/utils/theme.ts
453
+ const MODE_CALLBACK_BRAND = Symbol.for("vl.themeModeCallback");
435
454
  /** Creates a mode-switching function that returns the light or dark value based on the active mode. */
436
- const themeModeCallback = (light, dark) => (mode) => {
437
- if (!mode || mode === "light") return light;
438
- return dark;
455
+ const themeModeCallback = (light, dark) => {
456
+ const fn = (mode) => {
457
+ if (!mode || mode === "light") return light;
458
+ return dark;
459
+ };
460
+ fn.__brand = MODE_CALLBACK_BRAND;
461
+ return fn;
439
462
  };
440
- const isModeCallback = (value) => typeof value === "function" && value.toString() === themeModeCallback().toString();
463
+ const isModeCallback = (value) => typeof value === "function" && value.__brand === MODE_CALLBACK_BRAND;
441
464
  const getThemeFromChain = (options, theme) => {
442
465
  const result = {};
443
466
  if (!options || isEmpty(options)) return result;
@@ -454,20 +477,21 @@ const getDimensionThemes = (theme, options) => {
454
477
  }, result);
455
478
  };
456
479
  const getTheme = ({ rocketstate, themes, baseTheme, transformKeys, appTheme }) => {
457
- let finalTheme = { ...baseTheme };
480
+ const finalTheme = { ...baseTheme };
458
481
  const deferredTransforms = [];
459
482
  Object.entries(rocketstate).forEach(([key, value]) => {
460
483
  const keyTheme = themes[key];
461
484
  const isTransform = transformKeys?.[key];
462
485
  const mergeValue = (item) => {
463
486
  const val = keyTheme[item];
487
+ if (val == null) return;
464
488
  if (isTransform && typeof val === "function") deferredTransforms.push(val);
465
- else finalTheme = merge({}, finalTheme, val);
489
+ else merge(finalTheme, val);
466
490
  };
467
491
  if (Array.isArray(value)) value.forEach(mergeValue);
468
492
  else mergeValue(value);
469
493
  });
470
- for (const transform of deferredTransforms) finalTheme = merge({}, finalTheme, transform(finalTheme, appTheme ?? {}, themeModeCallback, config.css));
494
+ for (const transform of deferredTransforms) merge(finalTheme, transform(finalTheme, appTheme ?? {}, themeModeCallback, config.css));
471
495
  return finalTheme;
472
496
  };
473
497
  const getThemeByMode = (object, mode) => Object.keys(object).reduce((acc, key) => {
@@ -480,6 +504,32 @@ const getThemeByMode = (object, mode) => Object.keys(object).reduce((acc, key) =
480
504
 
481
505
  //#endregion
482
506
  //#region src/rocketstyle.tsx
507
+ /**
508
+ * Core rocketstyle component factory. Creates a fully-featured React component
509
+ * that integrates theme management (with light/dark mode support), multi-tier
510
+ * WeakMap caching, dimension-based styling props, pseudo-state detection, and
511
+ * chainable static methods (`.attrs()`, `.theme()`, `.styles()`, `.config()`, etc.).
512
+ * @module rocketstyle
513
+ */
514
+ const arraysEqual = (a, b) => {
515
+ if (a.length !== b.length) return false;
516
+ for (let i = 0; i < a.length; i++) if (a[i] !== b[i]) return false;
517
+ return true;
518
+ };
519
+ const isShallowEqualRocketstate = (a, b) => {
520
+ if (a === b) return true;
521
+ if (!a || !b) return false;
522
+ const aKeys = Object.keys(a);
523
+ if (aKeys.length !== Object.keys(b).length) return false;
524
+ for (const k of aKeys) {
525
+ const av = a[k];
526
+ const bv = b[k];
527
+ if (av === bv) continue;
528
+ if (Array.isArray(av) && Array.isArray(bv) && arraysEqual(av, bv)) continue;
529
+ return false;
530
+ }
531
+ return true;
532
+ };
483
533
  /** Clones the current configuration and merges new options, returning a fresh rocketComponent. */
484
534
  const cloneAndEnhance = (defaultOpts, opts) => rocketComponent({
485
535
  ...defaultOpts,
@@ -503,7 +553,7 @@ const cloneAndEnhance = (defaultOpts, opts) => rocketComponent({
503
553
  * chainable static enhancers attached to the returned component.
504
554
  */
505
555
  const rocketComponent = (options) => {
506
- const { component, styles } = options;
556
+ const { component, styles, transformKeys } = options;
507
557
  const { styled } = config;
508
558
  const _calculateStylingAttrs = calculateStylingAttrs({
509
559
  multiKeys: options.multiKeys,
@@ -516,7 +566,7 @@ const rocketComponent = (options) => {
516
566
  const RenderComponent = options.provider ? RocketStyleProviderComponent(STYLED_COMPONENT) : STYLED_COMPONENT;
517
567
  const ThemeManager$1 = new ThemeManager();
518
568
  const hocsFuncs = [rocketStyleHOC(options), ...calculateHocsFuncs(options.compose)];
519
- const EnhancedComponent = forwardRef(({ $rocketstyleRef, ...props }, ref) => {
569
+ const EnhancedComponent = ({ $rocketstyleRef, ref, ...props }) => {
520
570
  const internalRef = useRocketstyleRef({
521
571
  $rocketstyleRef,
522
572
  ref
@@ -564,20 +614,17 @@ const rocketComponent = (options) => {
564
614
  ...rocketstate,
565
615
  pseudo: pseudoRocketstate
566
616
  };
567
- let rsKey = "";
568
- for (const k in rocketstate) {
569
- const v = rocketstate[k];
570
- rsKey += k;
571
- rsKey += Array.isArray(v) ? v.join(",") : v;
572
- }
617
+ const rocketstateRef = useRef(rocketstate);
618
+ if (!isShallowEqualRocketstate(rocketstateRef.current, rocketstate)) rocketstateRef.current = rocketstate;
619
+ const stableRocketstate = rocketstateRef.current;
573
620
  const rocketstyle = useMemo(() => getTheme({
574
- rocketstate,
621
+ rocketstate: stableRocketstate,
575
622
  themes: currentModeThemes,
576
623
  baseTheme: currentModeBaseTheme,
577
- transformKeys: options.transformKeys,
624
+ transformKeys,
578
625
  appTheme: theme
579
626
  }), [
580
- rsKey,
627
+ stableRocketstate,
581
628
  currentModeThemes,
582
629
  currentModeBaseTheme,
583
630
  theme
@@ -609,7 +656,7 @@ const rocketComponent = (options) => {
609
656
  }
610
657
  }
611
658
  return /* @__PURE__ */ jsx(RenderComponent, { ...finalProps });
612
- });
659
+ };
613
660
  const RocketComponent = compose(...hocsFuncs)(EnhancedComponent);
614
661
  RocketComponent.IS_ROCKETSTYLE = true;
615
662
  RocketComponent.displayName = componentName;
@@ -682,32 +729,44 @@ const validateInit = (name, component, dimensions) => {
682
729
  }
683
730
  if (!isEmpty(errors)) throw Error(JSON.stringify(errors));
684
731
  };
685
- const rocketstyle = ({ dimensions = DEFAULT_DIMENSIONS, useBooleans = true } = {}) => ({ name, component }) => {
686
- if (process.env.NODE_ENV !== "production") validateInit(name, component, dimensions);
687
- return rocketComponent({
688
- name,
689
- component,
690
- useBooleans,
691
- dimensions,
692
- dimensionKeys: getKeys(dimensions),
693
- dimensionValues: getDimensionsValues(dimensions),
694
- multiKeys: getMultipleDimensions(dimensions),
695
- transformKeys: getTransformDimensions(dimensions),
696
- styled: true
697
- });
732
+ /**
733
+ * Generic implementation. The `D | DefaultDimensions` runtime fallback is
734
+ * narrowed to `D` via a single cast — semantically correct because when no
735
+ * user dimensions are supplied, `D` *is* the default (its type-parameter
736
+ * default is `DefaultDimensions`). This single boundary cast replaces the
737
+ * file-wide `@ts-nocheck` previously used here.
738
+ */
739
+ const rocketstyle = (params) => {
740
+ const dimensions = params?.dimensions ?? DEFAULT_DIMENSIONS;
741
+ const useBooleans = params?.useBooleans ?? true;
742
+ return ({ name, component }) => {
743
+ if (process.env.NODE_ENV !== "production") validateInit(name, component, dimensions);
744
+ return rocketComponent({
745
+ name,
746
+ component,
747
+ useBooleans,
748
+ dimensions,
749
+ dimensionKeys: getKeys(dimensions),
750
+ dimensionValues: getDimensionsValues(dimensions),
751
+ multiKeys: getMultipleDimensions(dimensions),
752
+ transformKeys: getTransformDimensions(dimensions),
753
+ styled: true
754
+ });
755
+ };
698
756
  };
757
+ const typedRocketstyle = rocketstyle;
699
758
 
700
759
  //#endregion
701
760
  //#region src/isRocketComponent.tsx
702
761
  const isRocketComponent = (component) => {
703
- if (component && typeof component === "object" && component !== null && Object.hasOwn(component, "IS_ROCKETSTYLE")) return true;
762
+ if (component && (typeof component === "object" || typeof component === "function") && Object.hasOwn(component, "IS_ROCKETSTYLE")) return true;
704
763
  return false;
705
764
  };
706
765
 
707
766
  //#endregion
708
767
  //#region src/index.ts
709
- var src_default = rocketstyle;
768
+ var src_default = typedRocketstyle;
710
769
 
711
770
  //#endregion
712
- export { Provider, context, src_default as default, isRocketComponent, rocketstyle };
771
+ export { Provider, context, src_default as default, isRocketComponent, typedRocketstyle as rocketstyle };
713
772
  //# sourceMappingURL=index.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vitus-labs/rocketstyle",
3
- "version": "2.0.0-alpha.27",
3
+ "version": "2.0.0-alpha.29",
4
4
  "license": "MIT",
5
5
  "author": "Vit Bokisch <vit@bokisch.cz>",
6
6
  "maintainers": [
@@ -14,6 +14,7 @@
14
14
  "types": "./lib/index.d.ts"
15
15
  },
16
16
  "types": "./lib/index.d.ts",
17
+ "main": "./lib/index.js",
17
18
  "files": [
18
19
  "lib",
19
20
  "!lib/**/*.map",
@@ -64,16 +65,15 @@
64
65
  "version": "node ../../scripts/sync-peer-deps.mjs"
65
66
  },
66
67
  "peerDependencies": {
67
- "@vitus-labs/core": "2.0.0-alpha.26",
68
+ "@vitus-labs/core": "2.0.0-alpha.29",
68
69
  "react": ">= 19"
69
70
  },
70
71
  "devDependencies": {
71
- "@vitus-labs/core": "2.0.0-alpha.27",
72
- "@vitus-labs/elements": "2.0.0-alpha.27",
73
- "@vitus-labs/tools-rolldown": "1.9.1-alpha.19",
74
- "@vitus-labs/tools-storybook": "1.9.1-alpha.19",
75
- "@vitus-labs/tools-typescript": "1.9.1-alpha.19",
76
- "@vitus-labs/unistyle": "2.0.0-alpha.27"
77
- },
78
- "gitHead": "6230c7b4eb1f8fe52bd47275cf72cdcab706cb45"
72
+ "@vitus-labs/core": "workspace:*",
73
+ "@vitus-labs/elements": "workspace:*",
74
+ "@vitus-labs/tools-rolldown": "2.0.0",
75
+ "@vitus-labs/tools-storybook": "2.0.0",
76
+ "@vitus-labs/tools-typescript": "2.0.0",
77
+ "@vitus-labs/unistyle": "workspace:*"
78
+ }
79
79
  }
package/LICENSE DELETED
@@ -1,21 +0,0 @@
1
- MIT License
2
-
3
- Copyright (c) 2023-present Vit Bokisch
4
-
5
- Permission is hereby granted, free of charge, to any person obtaining a copy
6
- of this software and associated documentation files (the "Software"), to deal
7
- in the Software without restriction, including without limitation the rights
8
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
- copies of the Software, and to permit persons to whom the Software is
10
- furnished to do so, subject to the following conditions:
11
-
12
- The above copyright notice and this permission notice shall be included in all
13
- copies or substantial portions of the Software.
14
-
15
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
- SOFTWARE.