@pyreon/rocketstyle 0.11.0 → 0.11.2

package/src/types/rocketstyle.ts

@@ -0,0 +1,156 @@
+import type { VNodeChild } from "@pyreon/core"
+import type { AttrsCb } from "./attrs"
+import type { ConfigAttrs } from "./config"
+import type { DefaultProps } from "./configuration"
+import type {
+  DimensionCallbackParam,
+  DimensionProps,
+  Dimensions,
+  DimensionValue,
+  ExtractDimensionProps,
+  ExtractDimensions,
+  MultiKeys,
+  TDKP,
+} from "./dimensions"
+import type { ComposeParam } from "./hoc"
+import type { Styles, StylesCb } from "./styles"
+import type { Theme, ThemeCb, ThemeModeKeys } from "./theme"
+import type { ElementType, ExtractProps, MergeTypes, TObj } from "./utils"
+
+export type InnerComponentProps = {
+  "data-rocketstyle"?: string | undefined
+} & Record<string, any>
+
+export 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>
+}
+
+/**
+ * @param OA   Origin component props params.
+ * @param EA   Extended prop types
+ * @param T    Theme passed via context.
+ * @param CSS  Custom theme accepted by styles.
+ * @param S    Defined statics
+ * @param D    Dimensions to be used for defining component states.
+ * @param UB   Use booleans value
+ * @param DKP  Dimensions key props.
+ * @param DFP  Calculated final component props
+ */
+export interface IRocketStyleComponent<
+  // original component props
+  OA extends TObj = {},
+  // extended component props
+  EA extends TObj = {},
+  // theme
+  T extends TObj = {},
+  // custom style properties
+  CSS extends TObj = {},
+  // statics
+  S extends TObj = {},
+  // hocs
+  HOC extends TObj = {},
+  // dimensions
+  D extends Dimensions = Dimensions,
+  // use booleans
+  UB extends boolean = boolean,
+  // dimension key props
+  DKP extends TDKP = TDKP,
+  // calculated final props
+  DFP = MergeTypes<[OA, EA, DefaultProps, ExtractDimensionProps<D, DKP, UB>]>,
+> {
+  // The component is callable — Pyreon components are plain functions
+  (props: DFP): VNodeChild
+
+  // CONFIG chaining method
+  config: <NC extends ElementType | unknown = unknown>({
+    name,
+    component: NC,
+    provider,
+    consumer,
+    DEBUG,
+    inversed,
+    passProps,
+  }: ConfigAttrs<NC, D, DKP, UB>) => NC extends ElementType
+    ? RocketStyleComponent<ExtractProps<NC>, EA, T, CSS, S, HOC, D, UB, DKP>
+    : RocketStyleComponent<OA, EA, T, CSS, S, HOC, D, UB, DKP>
+
+  // ATTRS chaining method
+  attrs: <P extends TObj | unknown = unknown>(
+    param: P extends TObj
+      ?
+          | Partial<DFP & P>
+          | ((
+              props: Partial<DFP & P>,
+              theme: Theme<T>,
+              helpers: any,
+            ) => Partial<P> & Record<string, unknown>)
+      : Partial<DFP> | AttrsCb<DFP, Theme<T>>,
+    config?: Partial<{
+      priority: boolean
+      filter: P extends TObj ? Partial<keyof (EA & P)>[] : Partial<keyof EA>[]
+    }>,
+  ) => P extends TObj
+    ? RocketStyleComponent<OA, MergeTypes<[EA, P]>, T, CSS, S, HOC, D, UB, DKP>
+    : RocketStyleComponent<OA, EA, T, CSS, S, HOC, D, UB, DKP>
+
+  // THEME chaining method
+  theme: <P extends TObj = TObj>(
+    param: Partial<P> | Partial<Styles<CSS>> | ThemeCb<P, Theme<T>>,
+  ) => RocketStyleComponent<OA, EA, T, MergeTypes<[CSS, P]>, S, HOC, D, UB, DKP>
+
+  // STYLES chaining method
+  styles: (param: StylesCb<CSS>) => RocketStyleComponent<OA, EA, T, CSS, S, HOC, D, UB, DKP>
+
+  // COMPOSE chaining method
+  compose: <P extends ComposeParam>(
+    param: P,
+  ) => P extends TObj
+    ? RocketStyleComponent<OA, EA, T, CSS, S, MergeTypes<[HOC, P]>, D, UB, DKP>
+    : RocketStyleComponent<OA, EA, T, CSS, S, HOC, D, UB, DKP>
+
+  // STATICS chaining method
+  statics: <P extends TObj | unknown = unknown>(
+    param: P,
+  ) => P extends TObj
+    ? RocketStyleComponent<OA, EA, T, CSS, MergeTypes<[S, P]>, HOC, D, UB, DKP>
+    : RocketStyleComponent<OA, EA, T, CSS, S, HOC, D, UB, DKP>
+
+  /** Access to all defined statics on the component. */
+  meta: S
+
+  getStaticDimensions: (theme: TObj) => {
+    dimensions: DKP
+    useBooleans: UB
+    multiKeys: MultiKeys<D>
+  }
+
+  getDefaultAttrs: (props: TObj, theme: TObj, mode: ThemeModeKeys) => TObj
+
+  readonly $$rocketstyle: ExtractDimensions<D, DKP>
+  readonly $$originTypes: OA
+  readonly $$extendedTypes: EA
+  readonly $$types: DFP
+
+  IS_ROCKETSTYLE: true
+  displayName: string
+}

package/src/types/styles.ts

@@ -0,0 +1,46 @@
+import type { config } from "@pyreon/ui-core"
+import type { PseudoState } from "./pseudo"
+import type { TObj } from "./utils"
+
+// biome-ignore lint/suspicious/noEmptyInterface: this is an interface to be extended in consuming projects
+export interface StylesDefault {}
+
+// biome-ignore lint/correctness/noUnusedVariables: S kept for backward compatibility
+export type Styles<S = unknown> = StylesDefault
+
+export type Css = typeof config.css
+export type Style = ReturnType<Css>
+export type OptionStyles = ((css: Css) => ReturnType<Css>)[]
+
+/**
+ * Props available inside `.styles()` interpolation functions.
+ *
+ * - `$rocketstyle` — computed theme (inferred from `.theme()` chain)
+ * - `$rocketstate` — active dimension values + pseudo state
+ */
+export type RocketStyleInterpolationProps<CSS extends TObj = TObj> = {
+  $rocketstyle: CSS
+  $rocketstate: Record<string, string | string[]> & {
+    pseudo: Partial<PseudoState>
+  }
+} & Record<string, any>
+
+/**
+ * A tagged-template css function whose interpolation functions
+ * receive typed props including `$rocketstyle` and `$rocketstate`.
+ */
+export type RocketCss<CSS extends TObj = TObj> = (
+  strings: TemplateStringsArray,
+  ...values: Array<
+    | string
+    | number
+    | boolean
+    | null
+    | undefined
+    | ((props: RocketStyleInterpolationProps<CSS>) => any)
+    | any[]
+  >
+) => any
+
+export type StylesCb<CSS extends TObj = TObj> = (css: RocketCss<CSS>) => ReturnType<Css>
+export type StylesCbArray = StylesCb[]

package/src/types/theme.ts

@@ -0,0 +1,19 @@
+import type { THEME_MODES } from "../constants"
+import type { Css } from "./styles"
+import type { MergeTypes } from "./utils"
+
+// biome-ignore lint/suspicious/noEmptyInterface: this is an interface to be extended in consuming projects
+export interface ThemeDefault {}
+
+export type Theme<T> = T extends unknown ? ThemeDefault : MergeTypes<[ThemeDefault, T]>
+
+export type ThemeModeKeys = keyof typeof THEME_MODES
+
+export type ThemeModeCallback = <A = any, B = any>(
+  light: A,
+  dark: B,
+) => (mode: "light" | "dark") => A | B
+
+export type ThemeMode = <A = any, B = any>(light: A, dark: B) => A | B
+
+export type ThemeCb<CSS, T> = (theme: T, mode: ThemeModeCallback, css: Css) => Partial<CSS>

package/src/types/utils.ts

@@ -0,0 +1,55 @@
+import type { VNodeChild } from "@pyreon/core"
+
+export type TObj = Record<string, unknown>
+export type TFn = (...args: any) => any
+export type CallBackParam = TObj | TFn
+export type DisplayName = string
+
+/** In Pyreon, components are plain functions — no forwardRef needed. */
+export type ComponentFn<P = any> = ((props: P) => VNodeChild) & Partial<Record<string, any>>
+
+export type ElementType<T extends TObj | unknown = any> = ComponentFn<T>
+
+export type ValueOf<T> = T[keyof T]
+
+export type ArrayOfValues<T> = T[keyof T][]
+
+export type ArrayOfKeys<T> = Array<keyof T>
+
+export type SimpleHoc<P extends Record<string, unknown> = Record<string, unknown>> = <
+  T extends ComponentFn<any>,
+>(
+  WrappedComponent: T,
+) => ComponentFn<MergeTypes<[P, ExtractProps<T>]>>
+
+type IsFalseOrNullable<T> = T extends null | undefined | false ? never : true
+export type NullableKeys<T> = { [K in keyof T]: IsFalseOrNullable<T[K]> }
+
+export type ReturnCbParam<P extends TFn | TObj> = P extends TFn ? ReturnType<P> : P
+
+// ─── MergeTypes ───────────────────────────────────────────────
+type Id<T> = T extends infer U ? { [K in keyof U]: U[K] } : never
+
+type IsAny<T> = 0 extends 1 & T ? true : false
+
+type ExtractNullableKeys<T> = {
+  [P in keyof T as IsAny<T[P]> extends true
+    ? P
+    : [T[P]] extends [never]
+      ? never
+      : [T[P]] extends [null | undefined]
+        ? never
+        : P]: T[P]
+}
+
+type SpreadTwo<L, R> = Id<Pick<L, Exclude<keyof L, keyof R>> & R>
+
+export type Spread<A extends readonly [...any]> = A extends [infer L, ...infer R]
+  ? SpreadTwo<L, Spread<R>>
+  : unknown
+
+export type MergeTypes<A extends readonly [...any]> = ExtractNullableKeys<Spread<A>>
+
+// ─── ExtractProps ─────────────────────────────────────────────
+export type ExtractProps<TComponentOrTProps> =
+  TComponentOrTProps extends ComponentFn<infer TProps> ? TProps : TComponentOrTProps

package/src/utils/attrs.ts

@@ -0,0 +1,134 @@
+import type { MultiKeys } from "../types/dimensions"
+
+// --------------------------------------------------------
+// remove undefined props
+// --------------------------------------------------------
+/** Strips keys with `undefined` values so they don't shadow default props during merging. */
+type RemoveUndefinedProps = <T extends Record<string, any>>(props: T) => Partial<T>
+
+export const removeUndefinedProps: RemoveUndefinedProps = (props) => {
+  const result: Partial<typeof props> = {}
+  for (const key in props) {
+    if (props[key] !== undefined) result[key] = props[key]
+  }
+  return result
+}
+
+// --------------------------------------------------------
+// pick styled props
+// --------------------------------------------------------
+/** Picks only the props whose keys exist in the dimension keywords lookup and have truthy values. */
+export const pickStyledAttrs = <
+  T extends Record<string, any>,
+  K extends Record<string, true | undefined>,
+>(
+  props: T,
+  keywords: K,
+): { [I in keyof K & keyof T]: T[I] } => {
+  const result: Record<string, unknown> = {}
+  for (const key of Object.keys(props)) {
+    if (keywords[key] && props[key]) result[key] = props[key]
+  }
+  return result as { [I in keyof K & keyof T]: T[I] }
+}
+
+// --------------------------------------------------------
+// combine values
+// --------------------------------------------------------
+/**
+ * Returns a curried function that evaluates an array of `.attrs()` callbacks,
+ * spreading each result into a single merged props object via `Object.assign`.
+ */
+type OptionFunc<A> = (...arg: A[]) => Record<string, unknown>
+type CalculateChainOptions = <A>(
+  options?: OptionFunc<A>[],
+) => (args: A[]) => ReturnType<OptionFunc<A>>
+
+export const calculateChainOptions: CalculateChainOptions = (options) => (args) => {
+  if (!options || options.length === 0) return {}
+
+  return options.reduce<Record<string, unknown>>(
+    (acc, item) => Object.assign(acc, item(...args)),
+    {},
+  )
+}
+
+// --------------------------------------------------------
+// get style attributes
+// --------------------------------------------------------
+/**
+ * Resolves the active value for each styling dimension from component props.
+ * First checks for explicit prop values (string, number, or array for multi-keys),
+ * then falls back to boolean shorthand props when `useBooleans` is enabled.
+ */
+type CalculateStylingAttrs = ({
+  useBooleans,
+  multiKeys,
+}: {
+  useBooleans?: boolean
+  multiKeys?: MultiKeys
+}) => ({
+  props,
+  dimensions,
+}: {
+  props: Record<string, unknown>
+  dimensions: Record<string, unknown>
+}) => Record<string, any>
+export const calculateStylingAttrs: CalculateStylingAttrs =
+  ({ useBooleans, multiKeys }) =>
+  ({ props, dimensions }) => {
+    const result: Record<string, any> = {}
+
+    // (1) find dimension keys values & initialize
+    // object with possible options
+    Object.keys(dimensions).forEach((item) => {
+      const pickedProp = props[item]
+      const t = typeof pickedProp
+
+      // if the property is multi key, allow assign array as well
+      if (multiKeys?.[item] && Array.isArray(pickedProp)) {
+        result[item] = pickedProp
+      }
+      // assign when it's only a string or number otherwise it's considered
+      // as invalid param
+      else if (t === "string" || t === "number") {
+        result[item] = pickedProp
+      } else {
+        result[item] = undefined
+      }
+    })
+
+    // (2) if booleans are being used let's find the rest
+    if (useBooleans) {
+      const propsKeys = Object.keys(props)
+
+      // biome-ignore lint/complexity/noExcessiveCognitiveComplexity: complex logic is inherent to this function
+      Object.entries(result).forEach(([key, value]) => {
+        const isMultiKey = multiKeys?.[key]
+
+        // when value in result is not assigned yet
+        if (!value) {
+          let newDimensionValue: string | string[] | undefined
+          const keywordSet = new Set(Object.keys(dimensions[key] as Record<string, unknown>))
+
+          if (isMultiKey) {
+            newDimensionValue = propsKeys.filter((propKey) => keywordSet.has(propKey))
+          } else {
+            // iterate backwards to guarantee the last one will have
+            // a priority over previous ones
+            for (let i = propsKeys.length - 1; i >= 0; i--) {
+              const k = propsKeys[i] as string
+              if (keywordSet.has(k) && props[k]) {
+                newDimensionValue = k
+                break
+              }
+            }
+          }
+
+          result[key] = newDimensionValue
+        }
+      })
+    }
+
+    return result
+  }

package/src/utils/chaining.ts

@@ -0,0 +1,58 @@
+type Func = (...args: any) => Record<string, unknown>
+type Obj = Record<string, unknown>
+
+// --------------------------------------------------------
+// Chain Options
+// --------------------------------------------------------
+/**
+ * Appends a new option (function or plain object) to an existing chain
+ * of option callbacks. Objects are wrapped in a thunk for uniform handling.
+ */
+type ChainOptions = (opts: Obj | Func | undefined, defaultOpts: Func[]) => Func[]
+
+export const chainOptions: ChainOptions = (opts, defaultOpts = []) => {
+  const result = [...defaultOpts]
+
+  if (typeof opts === "function") result.push(opts)
+  else if (typeof opts === "object") result.push(() => opts)
+
+  return result
+}
+
+// --------------------------------------------------------
+// Chain Or Options
+// --------------------------------------------------------
+/**
+ * For each key, picks the new value if truthy, otherwise falls back
+ * to the default. Used for config keys that replace rather than merge.
+ */
+type ChainOrOptions = (
+  keys: readonly string[],
+  opts: Obj,
+  defaultOpts: Obj,
+) => Record<string, unknown>
+
+export const chainOrOptions: ChainOrOptions = (keys, opts, defaultOpts) =>
+  keys.reduce((acc, item) => ({ ...acc, [item]: opts[item] || defaultOpts[item] }), {})
+
+// --------------------------------------------------------
+// Chain Reserved Options
+// --------------------------------------------------------
+/**
+ * Chains option callbacks for reserved dimension and styling keys,
+ * delegating to `chainOptions` for each key individually.
+ */
+type ChainReservedKeyOptions = (
+  keys: readonly string[],
+  opts: Record<string, Obj | Func>,
+  defaultOpts: Record<string, Func[]>,
+) => Record<string, ReturnType<typeof chainOptions>>
+
+export const chainReservedKeyOptions: ChainReservedKeyOptions = (keys, opts, defaultOpts) =>
+  keys.reduce(
+    (acc, item) => ({
+      ...acc,
+      [item]: chainOptions(opts[item], defaultOpts[item] ?? []),
+    }),
+    {},
+  )

package/src/utils/collection.ts

@@ -0,0 +1,9 @@
+// --------------------------------------------------------
+// Remove Nullable values
+// --------------------------------------------------------
+/** Filters out entries with `null`, `undefined`, or `false` values from an object. */
+type RemoveNullableValues = (obj: Record<string, any>) => Record<string, any>
+export const removeNullableValues: RemoveNullableValues = (obj) =>
+  Object.entries(obj)
+    .filter(([, v]) => v != null && v !== false)
+    .reduce((acc, [k, v]) => ({ ...acc, [k]: v }), {})

package/src/utils/compose.ts

@@ -0,0 +1,11 @@
+/**
+ * Extracts HOC functions from the compose configuration object,
+ * filters out non-function entries, and reverses them so the
+ * outermost HOC in the chain wraps first (inside-out composition).
+ */
+type CalculateHocsFuncs = (options: Record<string, any>) => ((arg: any) => any)[]
+
+export const calculateHocsFuncs: CalculateHocsFuncs = (options = {}) =>
+  Object.values(options)
+    .filter((item) => typeof item === "function")
+    .reverse()

package/src/utils/dimensions.ts

@@ -0,0 +1,126 @@
+import { get, isEmpty, set } from "@pyreon/ui-core"
+import type { Dimensions, DimensionValue, MultiKeys } from "../types/dimensions"
+
+// --------------------------------------------------------
+// Is value a valid key
+// --------------------------------------------------------
+/** Checks whether a dimension value is defined and not explicitly disabled (false). */
+type IsValidKey = (value: any) => boolean
+export const isValidKey: IsValidKey = (value) =>
+  value !== undefined && value !== null && value !== false
+
+// --------------------------------------------------------
+// Is value a multi key
+// --------------------------------------------------------
+/** Determines if a dimension value is a multi-key config object, returning [isMulti, propName]. */
+type IsMultiKey = (value: string | Record<string, unknown>) => [boolean, string]
+export const isMultiKey: IsMultiKey = (value) => {
+  if (typeof value === "object" && value !== null) return [true, get(value, "propName") as string]
+  return [false, value]
+}
+
+// --------------------------------------------------------
+// calculate dimensions map
+// --------------------------------------------------------
+/**
+ * Builds a two-level map (`keysMap`) of dimension -> option -> true,
+ * and a flat `keywords` lookup of all prop names reserved by dimensions
+ * (including boolean shorthand keys when `useBooleans` is enabled).
+ */
+type GetDimensionsMap = <T extends Record<string, any>>({
+  themes,
+  useBooleans,
+}: {
+  themes: T
+  useBooleans?: boolean
+}) => { keysMap: Record<string, any>; keywords: Record<string, any> }
+
+export const getDimensionsMap: GetDimensionsMap = ({ themes, useBooleans }) => {
+  const result = {
+    keysMap: {} as Record<string, any>,
+    keywords: {} as Record<string, any>,
+  }
+
+  if (isEmpty(themes)) return result
+
+  return Object.entries(themes).reduce((accumulator, [key, value]) => {
+    const { keysMap, keywords } = accumulator
+    keywords[key] = true
+
+    Object.entries(value).forEach(([itemKey, itemValue]) => {
+      if (!isValidKey(itemValue)) return
+
+      if (useBooleans) {
+        keywords[itemKey] = true
+      }
+
+      set(keysMap, [key, itemKey], true)
+    })
+
+    return accumulator
+  }, result)
+}
+
+// --------------------------------------------------------
+// simple object getters
+// --------------------------------------------------------
+/** Returns the keys of an object with proper typing. */
+type GetKeys = <T extends Record<string, unknown>>(obj: T) => Array<keyof T>
+export const getKeys: GetKeys = (obj) => Object.keys(obj)
+
+type GetValues = <T extends Record<string, unknown>, K extends keyof T>(obj: T) => T[K][]
+export const getValues = (<T extends Record<string, unknown>>(obj: T) =>
+  Object.values(obj)) as GetValues
+
+// --------------------------------------------------------
+// get dimensions values array
+// --------------------------------------------------------
+/** Extracts the prop name from each dimension value, unwrapping multi-key config objects. */
+type ValueType<T> = T extends string ? T : T[][0]
+type GetDimensionsValues = <T extends Dimensions, K extends keyof T>(obj: T) => ValueType<T[K]>[]
+
+export const getDimensionsValues = (<T extends Dimensions>(obj: T) =>
+  getValues(obj).map((item: DimensionValue) => {
+    if (typeof item === "object") {
+      return item.propName as string
+    }
+
+    return item
+  })) as GetDimensionsValues
+
+// --------------------------------------------------------
+// get multiple dimensions map
+// --------------------------------------------------------
+/** Builds a lookup of dimension prop names that accept multiple simultaneous values. */
+type GetMultipleDimensions = <T extends Dimensions>(obj: T) => MultiKeys<T>
+
+export const getMultipleDimensions: GetMultipleDimensions = (obj) =>
+  getValues(obj).reduce(
+    (accumulator, value: DimensionValue) => {
+      if (typeof value === "object") {
+        if (value.multi === true) accumulator[value.propName] = true
+      }
+
+      return accumulator
+    },
+    {} as Record<string, true>,
+  )
+
+// --------------------------------------------------------
+// get transform dimensions map
+// --------------------------------------------------------
+/** Builds a lookup of dimension prop names that are transform dimensions (evaluated last with function values). */
+type TransformKeys = Partial<Record<string, true>>
+type GetTransformDimensions = <T extends Dimensions>(obj: T) => TransformKeys
+
+export const getTransformDimensions: GetTransformDimensions = (obj) =>
+  getValues(obj).reduce(
+    (accumulator, value: DimensionValue) => {
+      if (typeof value === "object") {
+        if (value.transform === true) accumulator[value.propName] = true
+      }
+
+      return accumulator
+    },
+    {} as Record<string, true>,
+  )

package/src/utils/statics.ts

@@ -0,0 +1,44 @@
+import { isEmpty } from "@pyreon/ui-core"
+import { STATIC_KEYS } from "../constants"
+
+// --------------------------------------------------------
+// helpers for create statics chaining methods on component
+// --------------------------------------------------------
+/**
+ * Attaches chaining static methods (e.g. `.states()`, `.sizes()`, `.theme()`)
+ * to a component. Each method calls `cloneAndEnhance` with the corresponding key.
+ */
+type CreateStaticsChainingEnhancers = <O extends Record<string, any>, DK extends string[]>(props: {
+  context: Record<string, any>
+  dimensionKeys: DK
+  func: (defaultOpts: O, opts: any) => void
+  options: O
+}) => void
+
+export const createStaticsChainingEnhancers: CreateStaticsChainingEnhancers = ({
+  context,
+  dimensionKeys,
+  func,
+  options,
+}) => {
+  const keys = [...dimensionKeys, ...STATIC_KEYS]
+
+  keys.forEach((item) => {
+    context[item] = (props: any) => func(options, { [item]: props })
+  })
+}
+
+// --------------------------------------------------------
+// helpers for create statics on component
+// --------------------------------------------------------
+/** Copies user-defined static properties onto the component's `meta` object. */
+type CreateStaticsEnhancers = (params: {
+  context: Record<string, any>
+  options: Record<string, any>
+}) => void
+
+export const createStaticsEnhancers: CreateStaticsEnhancers = ({ context, options }) => {
+  if (!isEmpty(options)) {
+    Object.assign(context, options)
+  }
+}

package/src/utils/styles.ts

@@ -0,0 +1,18 @@
+import { config } from "@pyreon/ui-core"
+import type { StylesCbArray } from "../types/styles"
+
+// --------------------------------------------------------
+// Calculate styles
+// --------------------------------------------------------
+/**
+ * Evaluates an array of style callback functions with the configured
+ * `css` tagged-template helper, producing the final CSS interpolations
+ * to be passed into the styled-component template literal.
+ */
+type CalculateStyles = (styles: StylesCbArray | undefined) => ReturnType<StylesCbArray[number]>[]
+
+export const calculateStyles: CalculateStyles = (styles) => {
+  if (!styles) return []
+
+  return styles.map((item) => item(config.css as Parameters<typeof item>[0]))
+}