{
  "name": "EmptyState",
  "category": "Feedback",
  "subcategory": null,
  "description": "Illustrated placeholder for empty lists with call-to-action.",
  "thumbnail": "/preview-cards/empty-state.png",
  "hasDocsPage": true,
  "nugetPackage": "Lumeo",
  "files": [
    "UI/EmptyState/EmptyState.razor"
  ],
  "dependencies": [],
  "packageDependencies": [],
  "cssVars": [
    "--color-muted",
    "--color-muted-foreground"
  ],
  "api": {
    "name": "EmptyState",
    "category": "Feedback",
    "subcategory": null,
    "description": "Illustrated placeholder for empty lists with call-to-action.",
    "nugetPackage": "Lumeo",
    "files": [
      "UI/EmptyState/EmptyState.razor"
    ],
    "namespace": "Lumeo",
    "inheritsFrom": null,
    "implements": [],
    "parameters": [
      {
        "name": "IconContent",
        "type": "RenderFragment?",
        "default": null,
        "description": "Icon slot. Named IconContent to avoid shadowing the &lt;Icon&gt; component.",
        "isCascading": false,
        "captureUnmatched": false
      },
      {
        "name": "Title",
        "type": "string?",
        "default": null,
        "description": null,
        "isCascading": false,
        "captureUnmatched": false
      },
      {
        "name": "Description",
        "type": "string?",
        "default": null,
        "description": null,
        "isCascading": false,
        "captureUnmatched": false
      },
      {
        "name": "Action",
        "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-muted",
      "--color-muted-foreground"
    ],
    "examples": [
      {
        "title": "Default",
        "code": "<EmptyState\n    Title=\"No results found\"\n    Description=\"Try adjusting your search or filters.\" />"
      },
      {
        "title": "With Icon and Action",
        "code": "<EmptyState Title=\"No projects yet\" Description=\"Get started by creating your first project.\">\n    <IconContent>\n        <DynamicIcon Name=\"Plus\" Class=\"h-10 w-10\" />\n    </IconContent>\n    <Action>\n        <Button>Create Project</Button>\n    </Action>\n</EmptyState>"
      },
      {
        "title": "Inbox Empty",
        "code": "<EmptyState Title=\"Inbox zero\" Description=\"You have no new messages.\">\n    <IconContent>\n        <DynamicIcon Name=\"Mail\" Class=\"h-10 w-10\" />\n    </IconContent>\n</EmptyState>"
      }
    ],
    "subComponents": {},
    "parseFailed": false,
    "parseError": null
  },
  "$schema": "https://lumeo.nativ.sh/registry-component-schema.json",
  "key": "empty-state",
  "docsUrl": "https://lumeo.nativ.sh/components/empty-state",
  "sourceUrl": [
    {
      "file": "UI/EmptyState/EmptyState.razor",
      "url": "https://github.com/Brain2k-0005/Lumeo/tree/master/src/Lumeo/UI/EmptyState/EmptyState.razor"
    }
  ],
  "source": [
    {
      "path": "UI/EmptyState/EmptyState.razor",
      "content": "@namespace Lumeo\n\n<div class=\"@CssClass\" @attributes=\"AdditionalAttributes\">\n    @if (IconContent is not null)\n    {\n        <div class=\"mb-4 text-muted-foreground\">\n            @IconContent\n        </div>\n    }\n    @if (Title is not null)\n    {\n        <h3 class=\"text-lg font-semibold\">@Title</h3>\n    }\n    @if (Description is not null)\n    {\n        <p class=\"mt-1 text-sm text-muted-foreground\">@Description</p>\n    }\n    @if (Action is not null)\n    {\n        <div class=\"mt-4\">\n            @Action\n        </div>\n    }\n</div>\n\n@code {\n    /// <summary>Icon slot. Named <c>IconContent</c> to avoid shadowing the <c>&lt;Icon&gt;</c> component.</summary>\n    [Parameter] public RenderFragment? IconContent { get; set; }\n\n    [Parameter] public string? Title { get; set; }\n    [Parameter] public string? Description { get; set; }\n    [Parameter] public RenderFragment? Action { get; set; }\n    [Parameter] public string? Class { get; set; }\n    [Parameter(CaptureUnmatchedValues = true)] public Dictionary<string, object>? AdditionalAttributes { get; set; }\n\n    private string CssClass => $\"flex flex-col items-center justify-center px-6 py-12 text-center {Class}\".Trim();\n}\n"
    }
  ],
  "slots": [
    {
      "name": "IconContent",
      "owner": "EmptyState",
      "type": "RenderFragment?",
      "description": "Icon slot. Named IconContent to avoid shadowing the &lt;Icon&gt; component."
    },
    {
      "name": "Action",
      "owner": "EmptyState",
      "type": "RenderFragment?",
      "description": null
    }
  ],
  "serviceDependencies": [],
  "cascadingDependencies": [],
  "relatedComponents": [],
  "keyboardInteractions": [],
  "tests": [
    "tests/Lumeo.Tests/Components/EmptyState/EmptyStateTests.cs"
  ],
  "mdSummary": "# EmptyState\n\nIllustrated placeholder for empty lists with call-to-action.\n\n**Package:** `Lumeo` · **Category:** Feedback\n**Docs:** https://lumeo.nativ.sh/components/empty-state\n\n## Parameters\n| Owner | Name | Type | Default | Description |\n|---|---|---|---|---|\n| EmptyState | IconContent | `RenderFragment?` | `` | Icon slot. Named IconContent to avoid shadowing the &lt;Icon&gt; component. |\n| EmptyState | Title | `string?` | `` |  |\n| EmptyState | Description | `string?` | `` |  |\n| EmptyState | Action | `RenderFragment?` | `` |  |\n| EmptyState | Class | `string?` | `` |  |\n| EmptyState | AdditionalAttributes | `Dictionary<string, object>?` | `` |  |\n\n## Slots\n- `IconContent` (EmptyState) — Icon slot. Named IconContent to avoid shadowing the &lt;Icon&gt; component.\n- `Action` (EmptyState) — 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<EmptyState />\n```\n\n## CSS variables\n`--color-muted`, `--color-muted-foreground`\n\n## Files\n- `UI/EmptyState/EmptyState.razor`\n"
}