{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "code",
  "title": "Code",
  "description": "Code inside running text, in mono on a fill.",
  "dependencies": [
    "@base-ui/react",
    "@stylexjs/stylex"
  ],
  "registryDependencies": [
    "https://constella.aayush.cv/r/base.json"
  ],
  "files": [
    {
      "path": "src/components/typography/code.tsx",
      "content": "import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport * as stylex from \"@stylexjs/stylex\";\n\nimport type { Sx } from \"@/lib/constella/styles\";\nimport { colors, fonts, radii, space } from \"@/lib/constella/tokens.stylex\";\n\ntype CodeProps = Omit<\n  useRender.ComponentProps<\"code\">,\n  \"className\" | \"style\"\n> & {\n  sx?: Sx;\n};\n\nconst styles = stylex.create({\n  base: {\n    backgroundColor: colors.fill,\n    boxDecorationBreak: \"clone\",\n    borderStartStartRadius: radii.xs,\n    borderStartEndRadius: radii.xs,\n    borderEndStartRadius: radii.xs,\n    borderEndEndRadius: radii.xs,\n    fontFamily: fonts.mono,\n    fontSize: \"0.875em\",\n    fontVariantLigatures: \"none\",\n    paddingInlineStart: space.xxs,\n    paddingInlineEnd: space.xxs,\n  },\n});\n\n/** Code inside running text: a name, a value, a short command. */\nfunction Code({ render, sx, ...props }: CodeProps) {\n  return useRender({\n    defaultTagName: \"code\",\n    props: mergeProps<\"code\">(props, stylex.props(styles.base, sx)),\n    render,\n    state: { slot: \"code\" },\n  });\n}\n\nexport { Code };\nexport type { CodeProps };\n",
      "type": "registry:component"
    }
  ],
  "docs": "Usage: https://constella.aayush.cv/docs/components/code/index.md",
  "type": "registry:ui"
}