@forter/form-section/web-components.json

form-section from Forter Components

{
  "version": 2,
  "tags": [
    {
      "name": "fc-form-section",
      "description": "An element by Forter\n<!-- Author: oweingart <oweingart@forter.com> -->\n\n## Usage\n\n```html\n<script>\n   import '@forter/form-section';\n</script>\n\n<fc-form-section>\n  <fc-form-field></fc-form-field>\n</fc-form-section>\n```",
      "jsDoc": "/**\n * An element by Forter\n * <!-- Author: oweingart <oweingart@forter.com> -->\n *\n * ## Usage\n *\n * ```html\n * <script>\n *   import '@forter/form-section';\n * </script>\n *\n * <fc-form-section>\n *  <fc-form-field></fc-form-field>\n * </fc-form-section>\n * ```\n *\n * @element fc-form-section\n * @cssprop --fc-form-section-color - section font color. default: \"balck\"\n * @cssprop --fc-form-section-padding-left - section padding left. default: \"5px\"\n * @cssprop --fc-form-section-margin-right-item - section margin right of each field (row alignment only). default: \"20px\"\n * @cssprop --fc-form-section-label-invalid-color - section label color when the section is invalid. default: \"var(--fc-red-900)\"\n * @cssprop --fc-form-section-label-font-size - section label font size. default: \"12px\"\n * @cssprop --fc-form-section-label-font-weight - section label font weight. default: \"normal\"\n * @cssprop --fc-form-section-label-margin-bottom - section label margin bottom. default: \"0px\"\n * @cssprop --fc-form-section-arrow-color - section label arrow color (when section is collapsable) . default: \"var(--fc-gray-700)\"\n */",
      "attributes": [
        {
          "name": "align",
          "description": "Alignment of the form section (row/column)",
          "jsDoc": "/**\n   * Alignment of the form section (row/column)\n   * @type {string}\n   */",
          "type": "string"
        },
        {
          "name": "collapsable",
          "description": "If the section is collapsable",
          "jsDoc": "/**\n   * If the section is collapsable\n   * @type {boolean}\n   */",
          "type": "boolean"
        },
        {
          "name": "collapse",
          "description": "If the section is currently collapsed",
          "jsDoc": "/**\n   * If the section is currently collapsed\n   * @type {boolean}\n   */",
          "type": "boolean"
        },
        {
          "name": "disabled",
          "description": "Internal Observables",
          "jsDoc": "/**\n   *\n   * Internal Observables\n   *\n   */",
          "type": "boolean"
        },
        {
          "name": "valid",
          "description": "If the section is valid",
          "jsDoc": "/**\n   * If the section is valid\n   * @type {Boolean}\n   * @attr\n   */",
          "type": "boolean"
        },
        {
          "name": "dirty",
          "description": "If the section is dirty",
          "jsDoc": "/**\n   * If the section is dirty\n   * @type {Boolean}\n   * @attr\n   */",
          "type": "boolean"
        },
        {
          "name": "touched",
          "description": "If the section was touched",
          "jsDoc": "/**\n   * If the section was touched\n   * @type {Boolean}\n   * @attr\n   */",
          "type": "boolean"
        },
        {
          "name": "label",
          "type": "\"\" | TemplateResult"
        }
      ],
      "properties": [
        {
          "name": "align",
          "description": "Alignment of the form section (row/column)",
          "jsDoc": "/**\n   * Alignment of the form section (row/column)\n   * @type {string}\n   */",
          "type": "string"
        },
        {
          "name": "collapsable",
          "description": "If the section is collapsable",
          "jsDoc": "/**\n   * If the section is collapsable\n   * @type {boolean}\n   */",
          "type": "boolean"
        },
        {
          "name": "collapse",
          "description": "If the section is currently collapsed",
          "jsDoc": "/**\n   * If the section is currently collapsed\n   * @type {boolean}\n   */",
          "type": "boolean"
        },
        {
          "name": "disabled",
          "description": "Internal Observables",
          "jsDoc": "/**\n   *\n   * Internal Observables\n   *\n   */",
          "type": "boolean"
        },
        {
          "name": "valid",
          "description": "If the section is valid",
          "jsDoc": "/**\n   * If the section is valid\n   * @type {Boolean}\n   * @attr\n   */",
          "type": "boolean"
        },
        {
          "name": "dirty",
          "description": "If the section is dirty",
          "jsDoc": "/**\n   * If the section is dirty\n   * @type {Boolean}\n   * @attr\n   */",
          "type": "boolean"
        },
        {
          "name": "touched",
          "description": "If the section was touched",
          "jsDoc": "/**\n   * If the section was touched\n   * @type {Boolean}\n   * @attr\n   */",
          "type": "boolean"
        },
        {
          "name": "invalidFields",
          "type": "never[]"
        },
        {
          "name": "missingRequiredFields",
          "type": "never[]"
        },
        {
          "name": "model",
          "type": "{}"
        },
        {
          "name": "isSlottedLabel",
          "type": "\"\" | TemplateResult"
        },
        {
          "name": "label",
          "type": "\"\" | TemplateResult"
        },
        {
          "name": "isCollapsed",
          "type": "\"right\" | \"down\""
        }
      ],
      "events": [
        {
          "name": "field-added"
        }
      ],
      "cssProperties": [
        {
          "name": "--fc-form-section-arrow-color",
          "description": "section label arrow color (when section is collapsable) . default: \"var(--fc-gray-700)\""
        },
        {
          "name": "--fc-form-section-label-margin-bottom",
          "description": "section label margin bottom. default: \"0px\""
        },
        {
          "name": "--fc-form-section-label-font-weight",
          "description": "section label font weight. default: \"normal\""
        },
        {
          "name": "--fc-form-section-label-font-size",
          "description": "section label font size. default: \"12px\""
        },
        {
          "name": "--fc-form-section-label-invalid-color",
          "description": "section label color when the section is invalid. default: \"var(--fc-red-900)\""
        },
        {
          "name": "--fc-form-section-margin-right-item",
          "description": "section margin right of each field (row alignment only). default: \"20px\""
        },
        {
          "name": "--fc-form-section-padding-left",
          "description": "section padding left. default: \"5px\""
        },
        {
          "name": "--fc-form-section-color",
          "description": "section font color. default: \"balck\""
        }
      ]
    }
  ]
}