@kern-ux-annex/kern-angular-kit/schemas/kern-components.schema.json

Angular-Umsetzung der KERN UX-Standard Komponenten

{
  "$schema": "http://json-schema.org/draft-07/schema#",
  "$id": "https://kern-ux.de/schemas/kern-angular-kit.json",
  "title": "KERN Angular Kit Components",
  "description": "JSON Schema for KERN Angular Kit components configuration and validation",
  "type": "object",
  "definitions": {
    "KernAccordion": {
      "type": "object",
      "description": "Configuration for kern-accordion component",
      "properties": {
        "title": {
          "type": "string",
          "description": "The title text displayed in the accordion header"
        },
        "open": {
          "type": "boolean",
          "default": false,
          "description": "Whether the accordion is initially expanded"
        }
      },
      "required": ["title"],
      "additionalProperties": false
    },
    "KernAlert": {
      "type": "object",
      "description": "Configuration for kern-alert component",
      "properties": {
        "title": {
          "type": "string",
          "description": "The title text displayed in the alert"
        },
        "type": {
          "type": "string",
          "enum": ["info", "success", "warning", "danger"],
          "default": "info",
          "description": "The visual style and semantic meaning of the alert"
        }
      },
      "required": ["title"],
      "additionalProperties": false
    },
    "KernDialog": {
      "type": "object",
      "description": "Configuration for kern-dialog component",
      "properties": {
        "dialogId": {
          "type": "string",
          "description": "Custom ID for the dialog element (auto-generated if not provided)"
        },
        "title": {
          "type": "string",
          "description": "The title text displayed in the dialog header"
        },
        "btnCloseLabelText": {
          "type": "string",
          "default": "Schließen",
          "description": "Label text for the close button"
        },
        "btnPrimaryLabelText": {
          "type": ["string", "null"],
          "description": "Label text for the primary action button (null to hide)"
        },
        "btnSecondaryLabelText": {
          "type": ["string", "null"],
          "description": "Label text for the secondary action button (null to hide)"
        }
      },
      "required": ["title"],
      "additionalProperties": false
    },
    "KernLoader": {
      "type": "object",
      "description": "Configuration for kern-loader component",
      "properties": {
        "text": {
          "type": "string",
          "default": "Laden...",
          "description": "Loading text displayed alongside the spinner"
        }
      },
      "additionalProperties": false
    },
    "KernInputBase": {
      "type": "object",
      "description": "Base configuration shared by all form input components",
      "properties": {
        "inputId": {
          "type": "string",
          "description": "Custom ID for the input element (auto-generated if not provided)"
        },
        "labelText": {
          "type": "string",
          "description": "Label text displayed for the input field"
        },
        "optional": {
          "type": "boolean",
          "default": false,
          "description": "Whether to display '(optional)' in the label"
        },
        "readonly": {
          "type": "boolean",
          "default": false,
          "description": "Whether the input is read-only"
        },
        "required": {
          "type": "boolean",
          "default": false,
          "description": "Whether the input is required for form submission"
        }
      },
      "required": ["labelText"]
    },
    "KernInputText": {
      "allOf": [
        { "$ref": "#/definitions/KernInputBase" },
        {
          "type": "object",
          "description": "Configuration for kern-input-text component",
          "properties": {
            "inputmode": {
              "type": ["string", "null"],
              "enum": ["decimal", "numeric", null],
              "description": "Input mode hint for mobile keyboards"
            },
            "maxlength": {
              "type": ["number", "null"],
              "minimum": 1,
              "description": "Maximum number of characters allowed"
            }
          }
        }
      ]
    },
    "KernInputDate": {
      "allOf": [
        { "$ref": "#/definitions/KernInputBase" },
        {
          "type": "object",
          "description": "Configuration for kern-input-date component",
          "properties": {
            "min": {
              "type": ["string", "null"],
              "pattern": "^\\d{4}-\\d{2}-\\d{2}$",
              "description": "Minimum selectable date in YYYY-MM-DD format"
            },
            "max": {
              "type": ["string", "null"],
              "pattern": "^\\d{4}-\\d{2}-\\d{2}$",
              "description": "Maximum selectable date in YYYY-MM-DD format"
            }
          }
        }
      ]
    },
    "KernInputFile": {
      "allOf": [
        { "$ref": "#/definitions/KernInputBase" },
        {
          "type": "object",
          "description": "Configuration for kern-input-file component",
          "properties": {
            "accept": {
              "type": ["string", "null"],
              "description": "Comma-separated list of accepted file types (MIME types or extensions)"
            },
            "multiple": {
              "type": "boolean",
              "default": false,
              "description": "Whether multiple files can be selected"
            }
          }
        }
      ]
    },
    "KernInputPassword": {
      "allOf": [
        { "$ref": "#/definitions/KernInputBase" },
        {
          "type": "object",
          "description": "Configuration for kern-input-password component",
          "properties": {
            "maxlength": {
              "type": ["number", "null"],
              "minimum": 1,
              "description": "Maximum number of characters allowed"
            }
          }
        }
      ]
    },
    "KernInputRadio": {
      "allOf": [
        { "$ref": "#/definitions/KernInputBase" },
        {
          "type": "object",
          "description": "Configuration for kern-input-radio component",
          "properties": {
            "value": {
              "type": "string",
              "description": "The value submitted when this radio button is selected"
            },
            "name": {
              "type": "string",
              "description": "Name attribute for grouping radio buttons together"
            }
          },
          "required": ["value", "name"]
        }
      ]
    },
    "KernInputSelect": {
      "allOf": [
        { "$ref": "#/definitions/KernInputBase" },
        {
          "type": "object",
          "description": "Configuration for kern-input-select component",
          "properties": {
            "multiple": {
              "type": "boolean",
              "default": false,
              "description": "Whether multiple options can be selected"
            }
          }
        }
      ]
    },
    "KernInputTextarea": {
      "allOf": [
        { "$ref": "#/definitions/KernInputBase" },
        {
          "type": "object",
          "description": "Configuration for kern-input-textarea component",
          "properties": {
            "rows": {
              "type": ["number", "null"],
              "minimum": 1,
              "description": "Number of visible text lines for the textarea"
            },
            "cols": {
              "type": ["number", "null"],
              "minimum": 1,
              "description": "Visible width of the textarea in characters"
            },
            "maxlength": {
              "type": ["number", "null"],
              "minimum": 1,
              "description": "Maximum number of characters allowed"
            }
          }
        }
      ]
    }
  },
  "properties": {
    "components": {
      "type": "object",
      "description": "Component configurations organized by component selector",
      "properties": {
        "kern-accordion": { "$ref": "#/definitions/KernAccordion" },
        "kern-alert": { "$ref": "#/definitions/KernAlert" },
        "kern-dialog": { "$ref": "#/definitions/KernDialog" },
        "kern-loader": { "$ref": "#/definitions/KernLoader" },
        "kern-input-text": { "$ref": "#/definitions/KernInputText" },
        "kern-input-checkbox": { "$ref": "#/definitions/KernInputBase" },
        "kern-input-date": { "$ref": "#/definitions/KernInputDate" },
        "kern-input-email": { "$ref": "#/definitions/KernInputBase" },
        "kern-input-file": { "$ref": "#/definitions/KernInputFile" },
        "kern-input-password": { "$ref": "#/definitions/KernInputPassword" },
        "kern-input-radio": { "$ref": "#/definitions/KernInputRadio" },
        "kern-input-select": { "$ref": "#/definitions/KernInputSelect" },
        "kern-input-tel": { "$ref": "#/definitions/KernInputBase" },
        "kern-input-textarea": { "$ref": "#/definitions/KernInputTextarea" },
        "kern-input-url": { "$ref": "#/definitions/KernInputBase" }
      },
      "additionalProperties": false
    }
  },
  "additionalProperties": false
}