Slot Variant Recipe Builder (styled-system/sva.ts)

chakra-ui · ui, UI / Frontend, theming, variant, styled-system, recipe, slots

Utility functions to generate slot‑based variant recipes for Chakra's styled‑system theming.

// Source: https://github.com/mperkins0155/chakra-ui | License: MIT | Copyright 2019 Chakra Systems Inc
// Provided via justclaw.it.com; keep this notice with the code.
import { type Dict, mapEntries, memo, omit, splitProps } from "../utils"
import type { RecipeCreatorFn, SlotRecipeCreatorFn } from "./recipe.types"
import { EMPTY_ARRAY, EMPTY_OBJECT, createEmptyObject } from "./singleton"

interface Options {
  cva: RecipeCreatorFn
}

const getSlotRecipes = (
  config: Record<string, any> = EMPTY_OBJECT,
): Record<string, any> => {
  const init = (slot: string) => ({
    base: config.base?.[slot] ?? EMPTY_OBJECT,
    variants: createEmptyObject(),
    defaultVariants: config.defaultVariants ?? EMPTY_OBJECT,
    compoundVariants: config.compoundVariants
      ? getSlotCompoundVariant(config

... (truncated -- full source via MCP)

See the full source, get the GitHub permalink, and search 40K more like it.

Get a free API key