{
  "definitions": {
    "events": {
      "$ref": "#/definitions/Events",
      "$schema": "http://json-schema.org/draft-07/schema#",
      "definitions": {
        "CardNavigatorRowSelected": {
          "additionalProperties": false,
          "properties": {
            "icon": {
              "type": "string"
            },
            "id": {
              "type": "string"
            },
            "sort": {
              "type": "number"
            },
            "title": {
              "type": "string"
            }
          },
          "required": [
            "id"
          ],
          "type": "object"
        },
        "CardRow": {
          "additionalProperties": false,
          "properties": {
            "badge": {
              "additionalProperties": false,
              "properties": {
                "class": {
                  "type": "string"
                },
                "classcolor": {
                  "type": "string"
                },
                "text": {
                  "type": "string"
                }
              },
              "required": [
                "text"
              ],
              "type": "object"
            },
            "bootstrapIcon": {
              "type": "string"
            },
            "key": {
              "type": "string"
            },
            "selected": {
              "type": "boolean"
            },
            "subtext": {
              "type": "string"
            },
            "switchToPanelId": {
              "type": "string"
            },
            "text": {
              "type": "string"
            },
            "type": {
              "enum": [
                "switch",
                "range",
                "radio",
                "checkbox",
                "button"
              ],
              "type": "string"
            },
            "value": {
              "type": [
                "string",
                "number",
                "boolean"
              ]
            }
          },
          "required": [
            "key",
            "text"
          ],
          "type": "object"
        },
        "CardRowSelected": {
          "additionalProperties": false,
          "properties": {
            "card": {
              "$ref": "#/definitions/CardNavigatorRowSelected"
            },
            "id": {
              "type": "string"
            },
            "panel": {
              "$ref": "#/definitions/PanelRowSelected"
            },
            "row": {
              "$ref": "#/definitions/CardRow"
            }
          },
          "required": [
            "panel",
            "card",
            "row",
            "id"
          ],
          "type": "object"
        },
        "Events": {
          "additionalProperties": false,
          "properties": {
            "itemClick": {
              "$ref": "#/definitions/CardRowSelected"
            }
          },
          "required": [
            "itemClick"
          ],
          "type": "object"
        },
        "PanelRowSelected": {
          "additionalProperties": false,
          "properties": {
            "icon": {
              "type": "string"
            },
            "id": {
              "type": "string"
            },
            "main": {
              "type": "boolean"
            },
            "parentPanelId": {
              "type": "string"
            },
            "title": {
              "type": "string"
            }
          },
          "required": [
            "id"
          ],
          "type": "object"
        }
      }
    },
    "component": {
      "$ref": "#/definitions/Component",
      "$schema": "http://json-schema.org/draft-07/schema#",
      "definitions": {
        "CardNavigator": {
          "additionalProperties": false,
          "properties": {
            "icon": {
              "type": "string"
            },
            "id": {
              "type": "string"
            },
            "rows": {
              "items": {
                "$ref": "#/definitions/CardRow"
              },
              "type": "array"
            },
            "sort": {
              "type": "number"
            },
            "title": {
              "type": "string"
            }
          },
          "required": [
            "id",
            "rows"
          ],
          "type": "object"
        },
        "CardRow": {
          "additionalProperties": false,
          "properties": {
            "badge": {
              "additionalProperties": false,
              "properties": {
                "class": {
                  "type": "string"
                },
                "classcolor": {
                  "type": "string"
                },
                "text": {
                  "type": "string"
                }
              },
              "required": [
                "text"
              ],
              "type": "object"
            },
            "bootstrapIcon": {
              "type": "string"
            },
            "key": {
              "type": "string"
            },
            "selected": {
              "type": "boolean"
            },
            "subtext": {
              "type": "string"
            },
            "switchToPanelId": {
              "type": "string"
            },
            "text": {
              "type": "string"
            },
            "type": {
              "enum": [
                "switch",
                "range",
                "radio",
                "checkbox",
                "button"
              ],
              "type": "string"
            },
            "value": {
              "type": [
                "string",
                "number",
                "boolean"
              ]
            }
          },
          "required": [
            "key",
            "text"
          ],
          "type": "object"
        },
        "Component": {
          "additionalProperties": false,
          "properties": {
            "id": {
              "type": "string"
            },
            "panels": {
              "items": {
                "$ref": "#/definitions/Panel"
              },
              "type": "array"
            },
            "style": {
              "type": "string"
            }
          },
          "type": "object"
        },
        "Panel": {
          "additionalProperties": false,
          "properties": {
            "cards": {
              "items": {
                "$ref": "#/definitions/CardNavigator"
              },
              "type": "array"
            },
            "icon": {
              "type": "string"
            },
            "id": {
              "type": "string"
            },
            "main": {
              "type": "boolean"
            },
            "parentPanelId": {
              "type": "string"
            },
            "title": {
              "type": "string"
            }
          },
          "required": [
            "cards",
            "id"
          ],
          "type": "object"
        }
      }
    }
  },
  "description": "Stacked sidebar navigator: picks an active panel from JSON panels (main or first without parent), shows hb-navbar with back when parentPanelId exists, then cards of rows rendered as hb-sidenav-button. Emits itemClick with panel, card and row context; rows can switch panels via switchToPanelId.",
  "storybookArgs": {
    "panels": {
      "control": {
        "type": "object"
      }
    },
    "itemClick": {
      "action": "itemClickEvent"
    }
  },
  "styleSetup": {
    "vars": [
      {
        "name": "--bulma-block-spacing",
        "valueType": "number",
        "defaultValue": "1.5rem",
        "description": "Vertical gap between stacked cards in the navigator column."
      },
      {
        "name": "--bulma-text",
        "valueType": "color",
        "defaultValue": "#363636",
        "description": "Card titles, row labels, and navbar copy."
      },
      {
        "name": "--bulma-text-strong",
        "valueType": "color",
        "defaultValue": "#363636",
        "description": "Emphasized headings (panel titles, card titles)."
      },
      {
        "name": "--bulma-link",
        "valueType": "color",
        "defaultValue": "#485fc7",
        "description": "Interactive accents on nested `hb-navbar` / `hb-sidenav-button` rows."
      },
      {
        "name": "--bulma-scheme-main",
        "valueType": "color",
        "defaultValue": "#ffffff",
        "description": "Card surfaces behind each stack."
      }
    ],
    "parts": []
  },
  "contributors": [],
  "htmlSlots": [],
  "i18n": [],
  "examples": [
    {
      "name": "default",
      "data": {
        "panels": [
          {
            "id": "1",
            "title": "test",
            "cards": [
              {
                "id": "1",
                "rows": [
                  {
                    "key": "1",
                    "text": "test",
                    "bootstrapIcon": "house-door",
                    "switchToPanelId": "2"
                  }
                ]
              },
              {
                "id": "2",
                "rows": [
                  {
                    "key": "1",
                    "text": "test2"
                  }
                ]
              },
              {
                "id": "3",
                "rows": [
                  {
                    "key": "1",
                    "text": "test3"
                  }
                ]
              }
            ]
          },
          {
            "id": "2",
            "parentPanelId": "1",
            "title": "test2",
            "cards": [
              {
                "id": "1",
                "title": "ttteesstt",
                "rows": [
                  {
                    "key": "1",
                    "text": "test"
                  },
                  {
                    "key": "2",
                    "text": "ciao"
                  }
                ]
              },
              {
                "id": "2",
                "rows": [
                  {
                    "key": "1",
                    "text": "test2",
                    "bootstrapIcon": "house-door",
                    "switchToPanelId": "1"
                  }
                ]
              }
            ]
          },
          {
            "id": "3",
            "title": "test3",
            "cards": [
              {
                "id": "1",
                "rows": [
                  {
                    "key": "1",
                    "text": "test"
                  }
                ]
              },
              {
                "id": "2",
                "rows": [
                  {
                    "key": "1",
                    "text": "test2",
                    "bootstrapIcon": "house-door",
                    "switchToPanelId": "1"
                  }
                ]
              }
            ]
          }
        ]
      }
    },
    {
      "name": "empty",
      "data": {
        "panels": []
      }
    },
    {
      "name": "emptyRows",
      "data": {
        "panels": [
          {
            "id": "1",
            "cards": [
              {
                "id": "1",
                "rows": []
              }
            ]
          }
        ]
      }
    },
    {
      "name": "singlePanelTwoCards",
      "description": "One panel with two simple cards.",
      "data": {
        "panels": [
          {
            "id": "main",
            "main": true,
            "title": "Overview",
            "cards": [
              {
                "id": "c1",
                "title": "Account",
                "rows": [
                  {
                    "key": "profile",
                    "text": "Profile",
                    "bootstrapIcon": "person"
                  },
                  {
                    "key": "security",
                    "text": "Security",
                    "bootstrapIcon": "shield-lock"
                  }
                ]
              },
              {
                "id": "c2",
                "title": "Billing",
                "rows": [
                  {
                    "key": "invoices",
                    "text": "Invoices",
                    "bootstrapIcon": "receipt"
                  }
                ]
              }
            ]
          }
        ]
      }
    }
  ],
  "iifeIntegrity": "sha384-ein2h3J9RXImKAy8koNSYz7mq6iEIxWC6++2Q4U4x+AGmwouXChl36+yUm+zgr5v",
  "dependencies": [
    {
      "name": "hb-navbar",
      "dependencies": [
        {
          "name": "hb-dropdown-simple",
          "dependencies": []
        }
      ]
    },
    {
      "name": "hb-sidenav-button",
      "dependencies": []
    }
  ],
  "screenshots": [],
  "licenses": [
    {
      "type": "Apache-2.0",
      "path": "LICENSE.md",
      "cost": 0,
      "currency": "EUR"
    }
  ],
  "readmePath": "README.md",
  "name": "hb-sidebar-cards-navigator",
  "category": "layout",
  "tags": [
    "layout",
    "navigation"
  ],
  "size": {},
  "iifePath": "main.iife.js",
  "repoName": "@htmlbricks/hb-sidebar-cards-navigator",
  "version": "0.76.5"
}