{
  "schema_version": "1.0",
  "generated": "2026-05-05T04:37:40.652Z",
  "note": "Recipe-based components have a resolver function in fikir-css/tooling. See resolver_fn field.",
  "global": {
    "tones": [
      "neutral",
      "primary",
      "success",
      "warning",
      "danger",
      "info"
    ],
    "styles": [
      "solid",
      "soft",
      "outline",
      "ghost",
      "plain"
    ],
    "sizes": [
      "xs",
      "sm",
      "md",
      "lg"
    ]
  },
  "recipe_components": {
    "button": {
      "resolver_fn": "buttonRecipe",
      "defaults": {
        "variant": "solid",
        "tone": "primary",
        "size": "md"
      },
      "axes": {
        "variant": {
          "values": [
            "solid",
            "soft",
            "outline",
            "ghost",
            "plain"
          ],
          "default": "solid"
        },
        "tone": {
          "values": [
            "primary",
            "neutral",
            "danger"
          ],
          "default": "primary"
        },
        "size": {
          "values": [
            "sm",
            "md",
            "lg"
          ],
          "default": "md"
        }
      }
    },
    "card": {
      "resolver_fn": "cardRecipe",
      "defaults": {
        "variant": "flat",
        "padding": "md"
      },
      "axes": {
        "variant": {
          "values": [
            "flat",
            "plain",
            "subtle",
            "elevated",
            "interactive"
          ],
          "default": "flat"
        },
        "padding": {
          "values": [
            "sm",
            "md",
            "lg"
          ],
          "default": "md"
        }
      }
    },
    "input": {
      "resolver_fn": "inputRecipe",
      "defaults": {},
      "axes": {}
    },
    "alert": {
      "resolver_fn": "alertRecipe",
      "defaults": {
        "tone": "default"
      },
      "axes": {
        "tone": {
          "values": [
            "default",
            "danger",
            "warning",
            "success",
            "info",
            "neutral"
          ],
          "default": "default"
        }
      }
    },
    "badge": {
      "resolver_fn": "badgeRecipe",
      "defaults": {
        "variant": "soft",
        "tone": "neutral"
      },
      "axes": {
        "variant": {
          "values": [
            "solid",
            "soft",
            "outline",
            "plain"
          ],
          "default": "soft"
        },
        "tone": {
          "values": [
            "neutral",
            "primary",
            "danger",
            "warning",
            "success",
            "info"
          ],
          "default": "neutral"
        }
      }
    },
    "modal": {
      "resolver_fn": "modalRecipe",
      "defaults": {
        "open": false
      },
      "axes": {
        "open": {
          "values": [
            "true",
            "false"
          ],
          "default": false
        }
      }
    },
    "tabs": {
      "resolver_fn": "tabsRecipe",
      "defaults": {},
      "axes": {}
    },
    "coachmark": {
      "resolver_fn": "coachmarkRecipe",
      "defaults": {
        "tone": "info"
      },
      "axes": {
        "tone": {
          "values": [
            "info",
            "warning",
            "success",
            "danger",
            "neutral"
          ],
          "default": "info"
        }
      }
    },
    "authScreen": {
      "resolver_fn": "authScreenRecipe",
      "defaults": {
        "variant": "centered"
      },
      "axes": {
        "variant": {
          "values": [
            "centered",
            "split"
          ],
          "default": "centered"
        }
      }
    },
    "emptySearchState": {
      "resolver_fn": "emptySearchStateRecipe",
      "defaults": {
        "variant": "no-results"
      },
      "axes": {
        "variant": {
          "values": [
            "first-use",
            "no-results",
            "filtered-empty"
          ],
          "default": "no-results"
        }
      }
    },
    "statGroup": {
      "resolver_fn": "statGroupRecipe",
      "defaults": {
        "variant": "default"
      },
      "axes": {
        "variant": {
          "values": [
            "default",
            "compact",
            "divided"
          ],
          "default": "default"
        }
      }
    },
    "timeRangePicker": {
      "resolver_fn": "timeRangePickerRecipe",
      "defaults": {
        "variant": "inline"
      },
      "axes": {
        "variant": {
          "values": [
            "inline",
            "block"
          ],
          "default": "inline"
        }
      }
    },
    "filterBar": {
      "resolver_fn": "filterBarRecipe",
      "defaults": {},
      "axes": {}
    },
    "dataTableToolbar": {
      "resolver_fn": "dataTableToolbarRecipe",
      "defaults": {},
      "axes": {}
    },
    "commandBar": {
      "resolver_fn": "commandBarRecipe",
      "defaults": {},
      "axes": {}
    },
    "copyButton": {
      "resolver_fn": "copyButtonRecipe",
      "defaults": {},
      "axes": {}
    },
    "passwordInput": {
      "resolver_fn": "passwordInputRecipe",
      "defaults": {},
      "axes": {}
    },
    "searchResultItem": {
      "resolver_fn": "searchResultItemRecipe",
      "defaults": {},
      "axes": {}
    },
    "onboardingChecklist": {
      "resolver_fn": "onboardingChecklistRecipe",
      "defaults": {},
      "axes": {}
    }
  },
  "size_variants": {
    "icon-button": {
      "sizes": [
        "xs",
        "sm",
        "md",
        "lg"
      ],
      "default_size": "md"
    },
    "input": {
      "sizes": [
        "sm",
        "md",
        "lg"
      ],
      "default_size": "md"
    },
    "select": {
      "sizes": [
        "sm",
        "md",
        "lg"
      ],
      "default_size": "md"
    },
    "pagination": {
      "sizes": [
        "sm",
        "md",
        "lg"
      ],
      "default_size": "md"
    },
    "spinner": {
      "sizes": [
        "sm",
        "md",
        "lg"
      ],
      "default_size": "md"
    },
    "avatar": {
      "sizes": [
        "sm",
        "md",
        "lg"
      ],
      "default_size": "md"
    },
    "segmented-control": {
      "sizes": [
        "xs",
        "sm",
        "md",
        "lg"
      ],
      "default_size": "md"
    }
  },
  "tone_overrides": {
    "toast": {
      "note": "Toast tones applied via data-tone attribute or modifier class (toast-success etc.)",
      "values": [
        "danger",
        "success",
        "info",
        "warn",
        "error"
      ]
    }
  }
}