{
  "name": "Heading",
  "category": "Typography",
  "subcategory": null,
  "description": "Semantic h1-h6 heading with Lumeo typographic scale.",
  "thumbnail": "/preview-cards/heading.png",
  "hasDocsPage": true,
  "nugetPackage": "Lumeo",
  "files": [
    "UI/Heading/Heading.razor"
  ],
  "dependencies": [],
  "packageDependencies": [],
  "cssVars": [
    "--color-foreground"
  ],
  "api": {
    "name": "Heading",
    "category": "Typography",
    "subcategory": null,
    "description": "Semantic h1-h6 heading with Lumeo typographic scale.",
    "nugetPackage": "Lumeo",
    "files": [
      "UI/Heading/Heading.razor"
    ],
    "namespace": "Lumeo",
    "inheritsFrom": null,
    "implements": [],
    "parameters": [
      {
        "name": "Level",
        "type": "int",
        "default": "2",
        "description": null,
        "isCascading": false,
        "captureUnmatched": false
      },
      {
        "name": "Size",
        "type": "string?",
        "default": null,
        "description": null,
        "isCascading": false,
        "captureUnmatched": false
      },
      {
        "name": "Weight",
        "type": "string?",
        "default": null,
        "description": null,
        "isCascading": false,
        "captureUnmatched": false
      },
      {
        "name": "Tracking",
        "type": "string?",
        "default": null,
        "description": null,
        "isCascading": false,
        "captureUnmatched": false
      },
      {
        "name": "ChildContent",
        "type": "RenderFragment?",
        "default": null,
        "description": null,
        "isCascading": false,
        "captureUnmatched": false
      },
      {
        "name": "Class",
        "type": "string?",
        "default": null,
        "description": null,
        "isCascading": false,
        "captureUnmatched": false
      },
      {
        "name": "AdditionalAttributes",
        "type": "Dictionary<string, object>?",
        "default": null,
        "description": null,
        "isCascading": false,
        "captureUnmatched": true
      }
    ],
    "events": [],
    "enums": [],
    "records": [],
    "cssVars": [
      "--color-foreground"
    ],
    "examples": [
      {
        "title": "All Levels",
        "code": "<Heading Level=\"1\">Heading Level 1</Heading>\n<Heading Level=\"2\">Heading Level 2</Heading>\n<Heading Level=\"3\">Heading Level 3</Heading>\n<Heading Level=\"4\">Heading Level 4</Heading>\n<Heading Level=\"5\">Heading Level 5</Heading>\n<Heading Level=\"6\">Heading Level 6</Heading>"
      },
      {
        "title": "Custom Sizes",
        "code": "<Heading Level=\"2\" Size=\"sm\">h2 with small text</Heading>\n<Heading Level=\"3\" Size=\"3xl\">h3 with 3xl text</Heading>\n<Heading Level=\"4\" Size=\"lg\" Weight=\"normal\">h4 with lg text, normal weight</Heading>"
      },
      {
        "title": "Tracking",
        "code": "<Heading Level=\"1\">Default tight tracking</Heading>\n<Heading Level=\"1\" Tracking=\"normal\">Normal tracking</Heading>\n<Heading Level=\"1\" Tracking=\"wide\">Wide tracking</Heading>"
      },
      {
        "title": "Level — interactive",
        "code": "<Heading Level=\"2\">This is a level 2 heading</Heading>"
      }
    ],
    "subComponents": {},
    "parseFailed": false,
    "parseError": null
  },
  "$schema": "https://lumeo.nativ.sh/registry-component-schema.json",
  "key": "heading",
  "docsUrl": "https://lumeo.nativ.sh/components/heading",
  "sourceUrl": [
    {
      "file": "UI/Heading/Heading.razor",
      "url": "https://github.com/Brain2k-0005/Lumeo/tree/master/src/Lumeo/UI/Heading/Heading.razor"
    }
  ],
  "source": [
    {
      "path": "UI/Heading/Heading.razor",
      "content": "@namespace Lumeo\n\n@switch (Level)\n{\n    case 1:\n        <h1 class=\"@CssClass\" @attributes=\"AdditionalAttributes\">@ChildContent</h1>\n        break;\n    case 2:\n        <h2 class=\"@CssClass\" @attributes=\"AdditionalAttributes\">@ChildContent</h2>\n        break;\n    case 3:\n        <h3 class=\"@CssClass\" @attributes=\"AdditionalAttributes\">@ChildContent</h3>\n        break;\n    case 4:\n        <h4 class=\"@CssClass\" @attributes=\"AdditionalAttributes\">@ChildContent</h4>\n        break;\n    case 5:\n        <h5 class=\"@CssClass\" @attributes=\"AdditionalAttributes\">@ChildContent</h5>\n        break;\n    default:\n        <h6 class=\"@CssClass\" @attributes=\"AdditionalAttributes\">@ChildContent</h6>\n        break;\n}\n\n@code {\n    [Parameter] public int Level { get; set; } = 2;\n    [Parameter] public string? Size { get; set; }\n    [Parameter] public string? Weight { get; set; }\n    [Parameter] public string? Tracking { get; set; }\n    [Parameter] public RenderFragment? ChildContent { get; set; }\n    [Parameter] public string? Class { get; set; }\n    [Parameter(CaptureUnmatchedValues = true)] public Dictionary<string, object>? AdditionalAttributes { get; set; }\n\n    private string ResolvedSize => Size ?? Level switch\n    {\n        1 => \"4xl\",\n        2 => \"3xl\",\n        3 => \"2xl\",\n        4 => \"xl\",\n        5 => \"lg\",\n        _ => \"base\"\n    };\n\n    private string ResolvedWeight => Weight ?? Level switch\n    {\n        1 or 2 => \"bold\",\n        3 or 4 => \"semibold\",\n        _ => \"medium\"\n    };\n\n    private string? ResolvedTracking => Tracking ?? Level switch\n    {\n        1 or 2 => \"tight\",\n        _ => null\n    };\n\n    private string CssClass\n    {\n        get\n        {\n            var classes = new List<string>\n            {\n                $\"text-{ResolvedSize}\",\n                $\"font-{ResolvedWeight}\",\n                \"text-foreground\"\n            };\n\n            if (!string.IsNullOrEmpty(ResolvedTracking))\n                classes.Add($\"tracking-{ResolvedTracking}\");\n\n            if (!string.IsNullOrEmpty(Class))\n                classes.Add(Class);\n\n            return string.Join(\" \", classes);\n        }\n    }\n}\n"
    }
  ],
  "slots": [
    {
      "name": "ChildContent",
      "owner": "Heading",
      "type": "RenderFragment?",
      "description": null
    }
  ],
  "serviceDependencies": [],
  "cascadingDependencies": [],
  "relatedComponents": [],
  "keyboardInteractions": [],
  "tests": [
    "tests/Lumeo.Tests/Components/Command/CommandTests.cs",
    "tests/Lumeo.Tests/Components/Heading/HeadingTests.cs",
    "tests/Lumeo.Tests/Editor/WordImporterTests.cs"
  ],
  "mdSummary": "# Heading\n\nSemantic h1-h6 heading with Lumeo typographic scale.\n\n**Package:** `Lumeo` · **Category:** Typography\n**Docs:** https://lumeo.nativ.sh/components/heading\n\n## Parameters\n| Owner | Name | Type | Default | Description |\n|---|---|---|---|---|\n| Heading | Level | `int` | `2` |  |\n| Heading | Size | `string?` | `` |  |\n| Heading | Weight | `string?` | `` |  |\n| Heading | Tracking | `string?` | `` |  |\n| Heading | ChildContent | `RenderFragment?` | `` |  |\n| Heading | Class | `string?` | `` |  |\n| Heading | AdditionalAttributes | `Dictionary<string, object>?` | `` |  |\n\n## Slots\n- `ChildContent` (Heading) — RenderFragment slot\n\n## Events\n- (none)\n\n## Sub-components\n- (none)\n\n## Cascading values it expects\n- (none)\n\n## Services it injects\n- (none)\n\n## Keyboard\n—\n\n## Example\n```razor\n<Heading />\n```\n\n## CSS variables\n`--color-foreground`\n\n## Files\n- `UI/Heading/Heading.razor`\n"
}