{
  "schemaVersion": "2.1.0",
  "modules": [
    {
      "kind": "javascript-module",
      "path": "rh-accordion/rh-accordion-header.js",
      "declarations": [
        {
          "name": "AccordionHeaderChangeEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "members": [
            {
              "name": "target",
              "type": {
                "text": "RhAccordionHeader"
              },
              "kind": "field"
            },
            {
              "name": "expanded",
              "type": {
                "text": "boolean"
              },
              "kind": "field"
            },
            {
              "name": "toggle",
              "type": {
                "text": "RhAccordionHeader"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/rh-accordion-header.ts#L22"
          },
          "kind": "class"
        },
        {
          "name": "RhAccordionHeader",
          "description": "Accordion Header\nWe expect the light DOM of the rh-accordion-header to be a heading level tag (h1, h2, h3, h4, h5, h6)",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "expanded",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "expanded",
              "reflects": true
            },
            {
              "name": "ctx",
              "type": {
                "text": "RhAccordionContext"
              },
              "kind": "field",
              "privacy": "private"
            },
            {
              "name": "expandedChanged",
              "kind": "method",
              "privacy": "private"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/rh-accordion-header.ts#L39"
          },
          "kind": "class",
          "tagName": "rh-accordion-header",
          "attributes": [
            {
              "name": "expanded",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "expanded"
            }
          ],
          "events": [
            {
              "name": "change",
              "description": "when the open panels change",
              "type": {
                "text": "AccordionHeaderChangeEvent"
              }
            }
          ],
          "slots": [
            {
              "name": "",
              "summary": "accordion toggle content"
            },
            {
              "name": "accents",
              "summary": "decorations like icons or tags",
              "description": "These elements will appear inline by default with the header title, between the header and the chevron\n(or after the chevron and header in disclosure mode). There is an option to set the accents placement to bottom"
            }
          ],
          "cssParts": [
            {
              "name": "text",
              "summary": "inline element containing the heading text or slotted heading content"
            },
            {
              "name": "accents",
              "summary": "container for accents within the header"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "default": "1px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-lg",
              "description": "3px border width: Example: Expanded Accordion panel",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-accent-brand",
              "description": "Responsive `accent-brand` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-accent-brand-on-light` on a themable container with a light color palette and `--rh-color-accent-brand-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-medium",
              "description": "Medium font weight",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "AccordionHeaderChangeEvent",
          "declaration": {
            "name": "AccordionHeaderChangeEvent",
            "module": "rh-accordion/rh-accordion-header.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-accordion-header",
          "declaration": {
            "name": "RhAccordionHeader",
            "module": "rh-accordion/rh-accordion-header.js"
          }
        },
        {
          "kind": "js",
          "name": "RhAccordionHeader",
          "declaration": {
            "name": "RhAccordionHeader",
            "module": "rh-accordion/rh-accordion-header.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-accordion/rh-accordion-panel.js",
      "declarations": [
        {
          "name": "RhAccordionPanel",
          "description": "Accordion Panel",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "expanded",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "expanded",
              "reflects": true
            },
            {
              "name": "ctx",
              "type": {
                "text": "RhAccordionContext"
              },
              "kind": "field",
              "privacy": "private"
            },
            {
              "name": "expandedChanged",
              "kind": "method",
              "privacy": "private"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/rh-accordion-panel.ts#L21"
          },
          "kind": "class",
          "tagName": "rh-accordion-panel",
          "attributes": [
            {
              "name": "expanded",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "expanded"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "The content of the accordion panel can be any basic markup including but not limited\nto div, paragraph, or nested accordion panels."
            }
          ],
          "cssParts": [
            {
              "name": "container"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-lg",
              "description": "3px border width: Example: Expanded Accordion panel",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-accent-brand",
              "description": "Responsive `accent-brand` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-accent-brand-on-light` on a themable container with a light color palette and `--rh-color-accent-brand-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-accordion-panel",
          "declaration": {
            "name": "RhAccordionPanel",
            "module": "rh-accordion/rh-accordion-panel.js"
          }
        },
        {
          "kind": "js",
          "name": "RhAccordionPanel",
          "declaration": {
            "name": "RhAccordionPanel",
            "module": "rh-accordion/rh-accordion-panel.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-accordion/rh-accordion.js",
      "declarations": [
        {
          "name": "AccordionExpandEvent",
          "superclass": {
            "name": "ComposedEvent"
          },
          "members": [
            {
              "name": "toggle",
              "type": {
                "text": "RhAccordionHeader"
              },
              "kind": "field"
            },
            {
              "name": "panel",
              "type": {
                "text": "RhAccordionPanel"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/rh-accordion.ts#L25"
          },
          "kind": "class"
        },
        {
          "name": "AccordionCollapseEvent",
          "superclass": {
            "name": "ComposedEvent"
          },
          "members": [
            {
              "name": "toggle",
              "type": {
                "text": "RhAccordionHeader"
              },
              "kind": "field"
            },
            {
              "name": "panel",
              "type": {
                "text": "RhAccordionPanel"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/rh-accordion.ts#L34"
          },
          "kind": "class"
        },
        {
          "name": "RhAccordion",
          "summary": "Expands or collapses a stacked list of panels",
          "description": "An accordion is a stacked list of panels which allows users to expand or collapse information\nwhen selected. They feature panels that consist of a section text label and a caret icon that\ncollapses or expands to reveal more information.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "parameters": [
                {
                  "name": "target",
                  "type": {
                    "text": "EventTarget | null"
                  }
                }
              ],
              "name": "isAccordion",
              "kind": "method",
              "static": true
            },
            {
              "parameters": [
                {
                  "name": "target",
                  "type": {
                    "text": "EventTarget | null"
                  }
                }
              ],
              "name": "isHeader",
              "kind": "method",
              "static": true
            },
            {
              "parameters": [
                {
                  "name": "target",
                  "type": {
                    "text": "EventTarget | null"
                  }
                }
              ],
              "name": "isPanel",
              "kind": "method",
              "static": true
            },
            {
              "parameters": [
                {
                  "name": "event",
                  "type": {
                    "text": "Event"
                  }
                }
              ],
              "name": "isAccordionChangeEvent",
              "kind": "method",
              "static": true
            },
            {
              "name": "accents",
              "description": "Sets accordion header's accents position to inline or bottom",
              "type": {
                "text": "'inline' | 'bottom'"
              },
              "kind": "field",
              "attribute": "accents",
              "reflects": true
            },
            {
              "name": "large",
              "description": "If this accordion uses large styles",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "large",
              "reflects": true
            },
            {
              "name": "colorPalette",
              "description": "Color Palette for this accordion.",
              "type": {
                "text": "ColorPalette"
              },
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            },
            {
              "name": "hasChanged",
              "kind": "method"
            },
            {
              "name": "expandedIndex",
              "description": "Sets and reflects the currently expanded accordion 0-based indexes.\nUse commas to separate multiple indexes.\n```html\n\u003crh-accordion expanded-index=\"1,2\"\u003e\n...\n\u003c/rh-accordion\u003e\n```",
              "kind": "field",
              "attribute": "expanded-index"
            },
            {
              "name": "headers",
              "description": "All headers for this accordion",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "panels",
              "description": "All panels for this accordion",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "updateExpanded",
              "kind": "method",
              "privacy": "private"
            },
            {
              "name": "contextChanged",
              "kind": "method",
              "privacy": "private"
            },
            {
              "name": "updateAccessibility",
              "description": "Initialize the accordion by connecting headers and panels\nwith aria controls and labels; set up the default disclosure\nstate if not set by the author; and check the URL for default\nopen",
              "kind": "method",
              "privacy": "public"
            },
            {
              "parameters": [
                {
                  "name": "index",
                  "type": {
                    "text": "number"
                  }
                }
              ],
              "name": "toggle",
              "description": "Accepts a 0-based index value (integer) for the set of accordion items to expand or collapse.",
              "kind": "method",
              "privacy": "public"
            },
            {
              "parameters": [
                {
                  "name": "index",
                  "type": {
                    "text": "number"
                  }
                },
                {
                  "name": "parentAccordion",
                  "type": {
                    "text": "RhAccordion"
                  }
                }
              ],
              "name": "expand",
              "description": "Accepts a 0-based index value (integer) for the set of accordion items to expand.\nAccepts an optional parent accordion to search for headers and panels.",
              "kind": "method",
              "privacy": "public"
            },
            {
              "name": "expandAll",
              "description": "Expands all accordion items.",
              "kind": "method",
              "privacy": "public"
            },
            {
              "parameters": [
                {
                  "name": "index",
                  "type": {
                    "text": "number"
                  }
                }
              ],
              "name": "collapse",
              "description": "Accepts a 0-based index value (integer) for the set of accordion items to collapse.",
              "kind": "method",
              "privacy": "public"
            },
            {
              "name": "collapseAll",
              "description": "Collapses all accordion items.",
              "kind": "method",
              "privacy": "public"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/rh-accordion.ts#L59"
          },
          "kind": "class",
          "tagName": "rh-accordion",
          "attributes": [
            {
              "name": "accents",
              "default": "inline"
            },
            {
              "name": "accents",
              "description": "Sets accordion header's accents position to inline or bottom",
              "type": {
                "text": "'inline' | 'bottom'"
              },
              "fieldName": "accents"
            },
            {
              "name": "large",
              "description": "If this accordion uses large styles",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "large"
            },
            {
              "name": "color-palette",
              "description": "Color Palette for this accordion.",
              "type": {
                "text": "ColorPalette"
              },
              "fieldName": "colorPalette"
            },
            {
              "name": "expanded-index",
              "description": "Sets and reflects the currently expanded accordion 0-based indexes.\nUse commas to separate multiple indexes.\n```html\n\u003crh-accordion expanded-index=\"1,2\"\u003e\n...\n\u003c/rh-accordion\u003e\n```",
              "fieldName": "expandedIndex"
            }
          ],
          "events": [
            {
              "name": "expand",
              "description": "when a panel expands",
              "type": {
                "text": "AccordionExpandEvent"
              }
            },
            {
              "name": "collapse",
              "description": "when a panel collapses",
              "type": {
                "text": "AccordionCollapseEvent"
              }
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Place the `rh-accordion-header` and `rh-accordion-panel` elements here."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-lg",
              "description": "18px font size",
              "default": "1.125rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-box-shadow-sm",
              "description": "Small box shadow",
              "default": "0 2px 4px 0 rgba(21, 21, 21, 0.2)",
              "syntax": "\u003cshadow\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/accordion/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/accordion/demo/accents-bottom/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/demo/accents-bottom.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/accordion/demo/accents/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/demo/accents.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/accordion/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/accordion/demo/expanded-attribute/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/demo/expanded-attribute.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/accordion/demo/expanded-index/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/demo/expanded-index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/accordion/demo/large/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/demo/large.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/accordion/demo/nested/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/demo/nested.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/accordion/demo/right-to-left/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-accordion/demo/right-to-left.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "AccordionExpandEvent",
          "declaration": {
            "name": "AccordionExpandEvent",
            "module": "rh-accordion/rh-accordion.js"
          }
        },
        {
          "kind": "js",
          "name": "AccordionCollapseEvent",
          "declaration": {
            "name": "AccordionCollapseEvent",
            "module": "rh-accordion/rh-accordion.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-accordion",
          "declaration": {
            "name": "RhAccordion",
            "module": "rh-accordion/rh-accordion.js"
          }
        },
        {
          "kind": "js",
          "name": "RhAccordion",
          "declaration": {
            "name": "RhAccordion",
            "module": "rh-accordion/rh-accordion.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-alert/rh-alert.js",
      "declarations": [
        {
          "name": "AlertCloseEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "members": [
            {
              "name": "action",
              "type": {
                "text": "'close' | 'confirm' | 'dismiss' | string"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-alert/rh-alert.ts#L47"
          },
          "kind": "class"
        },
        {
          "name": "RhAlert",
          "summary": "Notifies a user without blocking their workflow",
          "description": "An alert is a banner used to notify a user about a change in status\nor communicate other information. It can be generated with or without\na user triggering an action first.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "toast",
              "description": "Toast a message with an rh-alert",
              "kind": "method",
              "static": true,
              "privacy": "public"
            },
            {
              "name": "state",
              "description": "Communicates the urgency of a message and is denoted by various styling configurations.\n\n- `neutral` - Indicates generic information or a message with no severity.\n- `danger` - Indicates a danger state, like an error that is blocking a user from completing a task.\n- `warning` - Indicates a warning state, like a non-blocking error that might need to be fixed.\n- `caution` - Indicates an action or notice which should immediately draw the attention\n- `info` - Indicates helpful information or a message with very little to no severity.\n- `success` - Indicates a success state, like if a process was completed without errors.\n\nNote: 'note', 'default', and 'error' will also work, but are deprecated",
              "type": {
                "text": "| 'danger'\n    | 'warning'\n    | 'caution'\n    | 'neutral'\n    | 'info'\n    | 'success'"
              },
              "default": "'neutral'",
              "kind": "field",
              "attribute": "state",
              "reflects": true
            },
            {
              "name": "variant",
              "description": "The alternate Inline alert style includes a border instead of a line which\ncan be used to express more urgency or better grab the attention of a user.\n\nA Toast alert is used to present a global message about an event,\nupdate, or confirmation, like the result of a user action that cannot\nbe presented within a specific layout or component.",
              "type": {
                "text": "'alternate' | 'toast' | 'inline'"
              },
              "kind": "field",
              "attribute": "variant",
              "reflects": true
            },
            {
              "name": "dismissable",
              "description": "Alert variants have different rules regarding their ability to be dismissed by a user.\nDefault, Info, and Success Inline alerts can be dismissed by a user selecting the close button.\nWarning and Danger Inline alerts can be dismissed by a user resolving the issues caused by the alert.\nAll Toast alerts can be dismissed by a user selecting the close button or waiting for them to time out.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "dismissable",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-alert/rh-alert.ts#L70"
          },
          "kind": "class",
          "tagName": "rh-alert",
          "attributes": [
            {
              "name": "state",
              "description": "Communicates the urgency of a message and is denoted by various styling configurations.\n\n- `neutral` - Indicates generic information or a message with no severity.\n- `danger` - Indicates a danger state, like an error that is blocking a user from completing a task.\n- `warning` - Indicates a warning state, like a non-blocking error that might need to be fixed.\n- `caution` - Indicates an action or notice which should immediately draw the attention\n- `info` - Indicates helpful information or a message with very little to no severity.\n- `success` - Indicates a success state, like if a process was completed without errors.\n\nNote: 'note', 'default', and 'error' will also work, but are deprecated",
              "type": {
                "text": "| 'danger'\n    | 'warning'\n    | 'caution'\n    | 'neutral'\n    | 'info'\n    | 'success'"
              },
              "default": "'neutral'",
              "fieldName": "state"
            },
            {
              "name": "variant",
              "description": "The alternate Inline alert style includes a border instead of a line which\ncan be used to express more urgency or better grab the attention of a user.\n\nA Toast alert is used to present a global message about an event,\nupdate, or confirmation, like the result of a user action that cannot\nbe presented within a specific layout or component.",
              "type": {
                "text": "'alternate' | 'toast' | 'inline'"
              },
              "fieldName": "variant"
            },
            {
              "name": "dismissable",
              "description": "Alert variants have different rules regarding their ability to be dismissed by a user.\nDefault, Info, and Success Inline alerts can be dismissed by a user selecting the close button.\nWarning and Danger Inline alerts can be dismissed by a user resolving the issues caused by the alert.\nAll Toast alerts can be dismissed by a user selecting the close button or waiting for them to time out.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "dismissable"
            }
          ],
          "events": [
            {
              "name": "close",
              "description": "when the dismissable alert closes",
              "type": {
                "text": "AlertCloseEvent"
              }
            }
          ],
          "slots": [
            {
              "name": "actions",
              "description": "Provide actions that the user can take for the alert"
            },
            {
              "name": "header",
              "description": "Provide a header for the alert message."
            },
            {
              "name": "",
              "description": "Provide a description for the alert message"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-teal-10",
              "description": "Alert - Default background",
              "default": "#daf2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-teal-50",
              "description": "Alert - Default accent",
              "default": "#37a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-medium",
              "description": "Medium font weight",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-status-neutral",
              "description": "Responsive `status-neutral` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-neutral-on-light` on a themable container with a light color palette and `--rh-color-status-neutral-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-status-neutral",
              "description": "Responsive `icon-status-neutral` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-icon-status-neutral-on-light` on a themable container with a light color palette and `--rh-color-icon-status-neutral-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-status-neutral",
              "description": "Responsive `surface-status-neutral` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-surface-status-neutral-on-light` on a themable container with a light color palette and `--rh-color-surface-status-neutral-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-info",
              "description": "Responsive `status-info` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-info-on-light` on a themable container with a light color palette and `--rh-color-status-info-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-status-info",
              "description": "Responsive `icon-status-info` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-icon-status-info-on-light` on a themable container with a light color palette and `--rh-color-icon-status-info-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-status-info",
              "description": "Responsive `surface-status-info` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-surface-status-info-on-light` on a themable container with a light color palette and `--rh-color-surface-status-info-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-success",
              "description": "Responsive `status-success` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-success-on-light` on a themable container with a light color palette and `--rh-color-status-success-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-status-success",
              "description": "Responsive `icon-status-success` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-icon-status-success-on-light` on a themable container with a light color palette and `--rh-color-icon-status-success-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-status-success",
              "description": "Responsive `surface-status-success` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-surface-status-success-on-light` on a themable container with a light color palette and `--rh-color-surface-status-success-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-caution",
              "description": "Responsive `status-caution` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-caution-on-light` on a themable container with a light color palette and `--rh-color-status-caution-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-status-caution",
              "description": "Responsive `icon-status-caution` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-icon-status-caution-on-light` on a themable container with a light color palette and `--rh-color-icon-status-caution-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-status-caution",
              "description": "Responsive `surface-status-caution` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-surface-status-caution-on-light` on a themable container with a light color palette and `--rh-color-surface-status-caution-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-warning",
              "description": "Responsive `status-warning` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-warning-on-light` on a themable container with a light color palette and `--rh-color-status-warning-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-status-warning",
              "description": "Responsive `icon-status-warning` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-icon-status-warning-on-light` on a themable container with a light color palette and `--rh-color-icon-status-warning-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-status-warning",
              "description": "Responsive `surface-status-warning` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-surface-status-warning-on-light` on a themable container with a light color palette and `--rh-color-surface-status-warning-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-danger",
              "description": "Responsive `status-danger` color value. Typically read-only – use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-danger-on-light` on a themable container with a light color palette and `--rh-color-status-danger-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-status-danger",
              "description": "Responsive `icon-status-danger` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-icon-status-danger-on-light` on a themable container with a light color palette and `--rh-color-icon-status-danger-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-status-danger",
              "description": "Responsive `surface-status-danger` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-surface-status-danger-on-light` on a themable container with a light color palette and `--rh-color-surface-status-danger-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-box-shadow-xl",
              "description": "Extra large box shadow",
              "default": "0 8px 24px 3px rgba(21, 21, 21, 0.35)",
              "syntax": "\u003cshadow\u003e"
            },
            {
              "name": "--rh-space-xs",
              "description": "4px spacer",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-size-icon-02",
              "description": "24px icon box",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-length-xl",
              "description": "24px length token",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/alert/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-alert/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/alert/demo/alternate/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-alert/demo/alternate.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/alert/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-alert/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/alert/demo/deprecated-states/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-alert/demo/deprecated-states.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/alert/demo/dismissable/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-alert/demo/dismissable.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/alert/demo/inline/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-alert/demo/inline.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/alert/demo/states/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-alert/demo/states.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/alert/demo/toast/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-alert/demo/toast.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "AlertCloseEvent",
          "declaration": {
            "name": "AlertCloseEvent",
            "module": "rh-alert/rh-alert.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-alert",
          "declaration": {
            "name": "RhAlert",
            "module": "rh-alert/rh-alert.js"
          }
        },
        {
          "kind": "js",
          "name": "RhAlert",
          "declaration": {
            "name": "RhAlert",
            "module": "rh-alert/rh-alert.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-announcement/rh-announcement.js",
      "declarations": [
        {
          "name": "AnnouncementCloseEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-announcement/rh-announcement.ts#L15"
          },
          "kind": "class"
        },
        {
          "name": "RhAnnouncement",
          "summary": "Arranges content and interactive elements in a layout",
          "description": "Announcements are flexible surfaces used to group information in a full width banner layout, traditionally across the top of a page.\nThey are used to announce new features, promos, or news.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "colorPalette",
              "description": "Sets color context for child components, overrides parent context",
              "type": {
                "text": "ColorPalette"
              },
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            },
            {
              "name": "dismissable",
              "description": "Make an announcement dismissable",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "dismissable",
              "reflects": true
            },
            {
              "name": "imagePosition",
              "description": "Set the position of the image in the announcement on mobile viewports. Possible values are:\n- `inline-start`\n- `block-start`",
              "type": {
                "text": "'inline-start' | 'block-start'"
              },
              "kind": "field",
              "attribute": "image-position",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-announcement/rh-announcement.ts#L34"
          },
          "kind": "class",
          "tagName": "rh-announcement",
          "attributes": [
            {
              "name": "color-palette",
              "description": "Sets color context for child components, overrides parent context",
              "type": {
                "text": "ColorPalette"
              },
              "fieldName": "colorPalette"
            },
            {
              "name": "dismissable",
              "description": "Make an announcement dismissable",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "dismissable"
            },
            {
              "name": "image-position",
              "description": "Set the position of the image in the announcement on mobile viewports. Possible values are:\n- `inline-start`\n- `block-start`",
              "type": {
                "text": "'inline-start' | 'block-start'"
              },
              "fieldName": "imagePosition"
            }
          ],
          "events": [
            {
              "name": "close",
              "type": {
                "text": "AnnouncementCloseEvent"
              }
            }
          ],
          "slots": [
            {
              "name": "image",
              "description": "If this slot is used, we expect an image tag with a width and height set.\nAn icon, svg, or use of the icon component are also valid in this region."
            },
            {
              "name": "",
              "description": "Any content that is not designated for the header or footer slot, will go to this slot."
            },
            {
              "name": "cta",
              "description": "If this slot is used, we expect a rh-cta component."
            }
          ],
          "cssParts": [
            {
              "name": "row",
              "description": "The row for the banner. Contains the image and content divs."
            },
            {
              "name": "image",
              "description": "The image for the banner. Contains the image slot."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-length-lg",
              "description": "16px length token",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-font-size-body-text-lg",
              "description": "18px font size",
              "default": "1.125rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/announcement/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-announcement/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/announcement/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-announcement/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/announcement/demo/dismissable/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-announcement/demo/dismissable.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/announcement/demo/events/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-announcement/demo/events.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/announcement/demo/image-position/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-announcement/demo/image-position.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "AnnouncementCloseEvent",
          "declaration": {
            "name": "AnnouncementCloseEvent",
            "module": "rh-announcement/rh-announcement.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-announcement",
          "declaration": {
            "name": "RhAnnouncement",
            "module": "rh-announcement/rh-announcement.js"
          }
        },
        {
          "kind": "js",
          "name": "RhAnnouncement",
          "declaration": {
            "name": "RhAnnouncement",
            "module": "rh-announcement/rh-announcement.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-audio-player/rh-audio-player-about.js",
      "declarations": [
        {
          "name": "RhAudioPlayerAbout",
          "description": "Audio Player About Panel",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "label",
              "description": "Default label content",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "label"
            },
            {
              "name": "mediaseries",
              "description": "Series this track belongs to, if applicable",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "series"
            },
            {
              "name": "mediatitle",
              "description": "Title of audio track",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "mediatitle"
            },
            {
              "name": "menuLabel",
              "type": {
                "text": "string"
              },
              "kind": "field"
            },
            {
              "name": "scrollText",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/rh-audio-player-about.ts#L18"
          },
          "kind": "class",
          "tagName": "rh-audio-player-about",
          "attributes": [
            {
              "name": "label",
              "description": "Default label content",
              "type": {
                "text": "string"
              },
              "fieldName": "label"
            },
            {
              "name": "series",
              "description": "Series this track belongs to, if applicable",
              "type": {
                "text": "string"
              },
              "fieldName": "mediaseries"
            },
            {
              "name": "mediatitle",
              "description": "Title of audio track",
              "type": {
                "text": "string"
              },
              "fieldName": "mediatitle"
            }
          ],
          "slots": [
            {
              "name": "heading",
              "description": "custom heading for panel"
            },
            {
              "name": "",
              "description": "panel content"
            },
            {
              "name": "profile",
              "description": "`\u003crh-avatar\u003e` for attribution"
            }
          ],
          "cssParts": [
            {
              "name": "heading",
              "description": "panel heading"
            },
            {
              "name": "body",
              "description": "panel body"
            },
            {
              "name": "profile",
              "description": "panel profile / avatar\n"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-avatar-size",
              "default": "var(--rh-size-icon-05, 48px)"
            },
            {
              "name": "--rh-size-icon-05",
              "description": "48px icon box",
              "default": "48px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-letter-spacing-body-text",
              "description": "Extra letter spacing for small body text sizes",
              "default": "0.0125rem"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-medium",
              "description": "Medium font weight",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-font-size-heading-xs",
              "description": "h6 heading font size",
              "default": "1.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-weight-heading-medium",
              "description": "Medium font weight for headings",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-line-height-heading",
              "description": "Line height for headings",
              "default": "1.3"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-audio-player-about",
          "declaration": {
            "name": "RhAudioPlayerAbout",
            "module": "rh-audio-player/rh-audio-player-about.js"
          }
        },
        {
          "kind": "js",
          "name": "RhAudioPlayerAbout",
          "declaration": {
            "name": "RhAudioPlayerAbout",
            "module": "rh-audio-player/rh-audio-player-about.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-audio-player/rh-audio-player-rate-stepper.js",
      "declarations": [
        {
          "name": "RhAudioPlayerRateStepper",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "pbrMin",
              "type": {
                "text": "number"
              },
              "default": "0.25",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "pbrMax",
              "type": {
                "text": "number"
              },
              "default": "2",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "pbrStep",
              "type": {
                "text": "number"
              },
              "default": "0.25",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "pbrFixed",
              "type": {
                "text": "number"
              },
              "default": "2",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "playbackRate",
              "description": "Playback rate",
              "type": {
                "text": "number"
              },
              "default": "1",
              "kind": "field",
              "attribute": "playback-rate",
              "reflects": true
            },
            {
              "name": "disabled",
              "description": "Playback rate",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "disabled",
              "reflects": true
            },
            {
              "name": "label",
              "description": "Playback rate",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "label"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/rh-audio-player-rate-stepper.ts#L13"
          },
          "kind": "class",
          "tagName": "rh-audio-player-rate-stepper",
          "attributes": [
            {
              "name": "playback-rate",
              "description": "Playback rate",
              "type": {
                "text": "number"
              },
              "default": "1",
              "fieldName": "playbackRate"
            },
            {
              "name": "disabled",
              "description": "Playback rate",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "disabled"
            },
            {
              "name": "label",
              "description": "Playback rate",
              "type": {
                "text": "string"
              },
              "fieldName": "label"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-font-size-code-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-code",
              "description": "Code font family",
              "default": "RedHatMono, 'Red Hat Mono', 'Courier New', Courier, monospace",
              "syntax": "\u003cfont-family\u003e"
            }
          ],
          "customElement": true
        },
        {
          "name": "RhAudioPlayerRateSelectEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "members": [
            {
              "name": "playbackRate",
              "type": {
                "text": "number"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/rh-audio-player-rate-stepper.ts#L124"
          },
          "kind": "class"
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-audio-player-rate-stepper",
          "declaration": {
            "name": "RhAudioPlayerRateStepper",
            "module": "rh-audio-player/rh-audio-player-rate-stepper.js"
          }
        },
        {
          "kind": "js",
          "name": "RhAudioPlayerRateStepper",
          "declaration": {
            "name": "RhAudioPlayerRateStepper",
            "module": "rh-audio-player/rh-audio-player-rate-stepper.js"
          }
        },
        {
          "kind": "js",
          "name": "RhAudioPlayerRateSelectEvent",
          "declaration": {
            "name": "RhAudioPlayerRateSelectEvent",
            "module": "rh-audio-player/rh-audio-player-rate-stepper.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-audio-player/rh-audio-player-scrolling-text-overflow.js",
      "declarations": [
        {
          "name": "RhAudioPlayerScrollingTextOverflow",
          "description": "Audio Player Scrolling Text Overflow",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "firstUpdated",
              "kind": "method"
            },
            {
              "name": "stopScrolling",
              "kind": "method"
            },
            {
              "name": "startScrolling",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/rh-audio-player-scrolling-text-overflow.ts#L14"
          },
          "kind": "class",
          "tagName": "rh-audio-player-scrolling-text-overflow",
          "slots": [
            {
              "name": "",
              "description": "inline text to scroll if wider than host"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-audio-player-scrolling-text-overflow-background-color",
              "default": "var(--rh-color-surface-darkest, #151515)"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-audio-player-scrolling-text-overflow",
          "declaration": {
            "name": "RhAudioPlayerScrollingTextOverflow",
            "module": "rh-audio-player/rh-audio-player-scrolling-text-overflow.js"
          }
        },
        {
          "kind": "js",
          "name": "RhAudioPlayerScrollingTextOverflow",
          "declaration": {
            "name": "RhAudioPlayerScrollingTextOverflow",
            "module": "rh-audio-player/rh-audio-player-scrolling-text-overflow.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-audio-player/rh-audio-player-subscribe.js",
      "declarations": [
        {
          "name": "RhAudioPlayerSubscribe",
          "description": "Audio Player Subscribe Panel",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "heading",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "heading"
            },
            {
              "name": "label",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "label"
            },
            {
              "name": "menuLabel",
              "type": {
                "text": "string"
              },
              "kind": "field"
            },
            {
              "name": "scrollText",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/rh-audio-player-subscribe.ts#L18"
          },
          "kind": "class",
          "tagName": "rh-audio-player-subscribe",
          "attributes": [
            {
              "name": "heading",
              "type": {
                "text": "string"
              },
              "fieldName": "heading"
            },
            {
              "name": "label",
              "type": {
                "text": "string"
              },
              "fieldName": "label"
            }
          ],
          "slots": [
            {
              "name": "heading",
              "description": "custom heading for panel"
            },
            {
              "name": "",
              "description": "panel content"
            },
            {
              "name": "link",
              "summary": "link to subscribe to podcast"
            }
          ],
          "cssParts": [
            {
              "name": "heading",
              "description": "scrolling text overflow"
            },
            {
              "name": "body",
              "description": "panel content"
            },
            {
              "name": "links",
              "summary": "subscribe links"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-heading-xs",
              "description": "h6 heading font size",
              "default": "1.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-line-height-heading",
              "description": "Line height for headings",
              "default": "1.3"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-letter-spacing-body-text",
              "description": "Extra letter spacing for small body text sizes",
              "default": "0.0125rem"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-heading-medium",
              "description": "Medium font weight for headings",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-audio-player-subscribe",
          "declaration": {
            "name": "RhAudioPlayerSubscribe",
            "module": "rh-audio-player/rh-audio-player-subscribe.js"
          }
        },
        {
          "kind": "js",
          "name": "RhAudioPlayerSubscribe",
          "declaration": {
            "name": "RhAudioPlayerSubscribe",
            "module": "rh-audio-player/rh-audio-player-subscribe.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-audio-player/rh-audio-player.js",
      "declarations": [
        {
          "name": "RhAudioPlayer",
          "summary": "Plays audio clips and includes other features",
          "description": "An audio player plays audio clips in the browser and includes other features.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "instances",
              "default": "new Set\u003cRhAudioPlayer\u003e()",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "enUS",
              "default": "{\\n    'play': 'Play',\\n    'pause': 'Pause',\\n    'seek': 'Seek',\\n    'rewind': 'Rewind 15 seconds',\\n    'advance': 'Advance 15 seconds',\\n    'speed': 'Speed',\\n    'mute': 'Mute',\\n    'unmute': 'Unmute',\\n    'volume': 'Volume',\\n    'menu': 'More options',\\n    'close': 'Close',\\n    'about': 'About the episode',\\n    'subscribe': 'Subscribe',\\n    'transcript': 'Transcript',\\n    'autoscroll': 'Autoscroll',\\n    'download': 'Download',\\n  }",
              "kind": "field",
              "static": true
            },
            {
              "name": "mediaseries",
              "description": "Audio's series name, e.g. Podcast series.",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "mediaseries",
              "reflects": true
            },
            {
              "name": "mediatitle",
              "description": "Audio's title, e.g. Podcast episode title.",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "mediatitle",
              "reflects": true
            },
            {
              "name": "layout",
              "description": "Layout:\n- `mini` (default): minimal controls: play/pause, range; volume and other controls hidden behind menu\n- `compact`: artwork and more controls: time, skip, volume\n- `compact-wide`: like compact but full width\n- `full`: maximal controls and artwork",
              "type": {
                "text": "'mini' | 'compact' | 'compact-wide' | 'full'"
              },
              "default": "'mini'",
              "kind": "field",
              "attribute": "layout",
              "reflects": true
            },
            {
              "name": "poster",
              "description": "URL to audio's artwork",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "poster",
              "reflects": true
            },
            {
              "name": "volume",
              "description": "Playback volume",
              "type": {
                "text": "number"
              },
              "default": "0.5",
              "kind": "field",
              "attribute": "volume",
              "reflects": true
            },
            {
              "name": "playbackRate",
              "description": "Playback rate",
              "type": {
                "text": "number"
              },
              "default": "1",
              "kind": "field",
              "attribute": "playbackrate",
              "reflects": true
            },
            {
              "name": "expanded",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "expanded",
              "reflects": true
            },
            {
              "name": "lang",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "lang",
              "reflects": true
            },
            {
              "name": "microcopy",
              "default": "{}",
              "kind": "field"
            },
            {
              "name": "colorPalette",
              "description": "Element's color palette",
              "type": {
                "text": "ColorPalette"
              },
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            },
            {
              "name": "currentTime",
              "description": "elapsed time in seconds",
              "kind": "field"
            },
            {
              "name": "duration",
              "description": "total time in seconds",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "muted",
              "description": "whether audio is muted",
              "type": {
                "text": "boolean"
              },
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "paused",
              "description": "whether media is paused",
              "type": {
                "text": "boolean"
              },
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "readyState",
              "description": "media status",
              "type": {
                "text": "number"
              },
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "firstUpdated",
              "kind": "method"
            },
            {
              "name": "mute",
              "description": "Mutes media volume",
              "kind": "method"
            },
            {
              "name": "unmute",
              "description": "Unmutes media volume",
              "kind": "method"
            },
            {
              "name": "pause",
              "description": "Pauses playback",
              "kind": "method"
            },
            {
              "name": "play",
              "description": "Starts or resumes playback",
              "kind": "method"
            },
            {
              "parameters": [
                {
                  "name": "seconds",
                  "type": {
                    "text": "number"
                  }
                }
              ],
              "name": "seek",
              "description": "Seeks media to a given point in seconds",
              "kind": "method"
            },
            {
              "name": "seekFromCurrentTime",
              "description": "Seeks media a given number of secons from current elapsed time",
              "kind": "method"
            },
            {
              "name": "rewind",
              "description": "Rewinds media by 15 seconds (default)",
              "kind": "method"
            },
            {
              "name": "forward",
              "description": "Advances media by 15 seconds (default)",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/rh-audio-player.ts#L44"
          },
          "kind": "class",
          "tagName": "rh-audio-player",
          "attributes": [
            {
              "name": "mediaseries",
              "description": "Audio's series name, e.g. Podcast series.",
              "type": {
                "text": "string"
              },
              "fieldName": "mediaseries"
            },
            {
              "name": "mediatitle",
              "description": "Audio's title, e.g. Podcast episode title.",
              "type": {
                "text": "string"
              },
              "fieldName": "mediatitle"
            },
            {
              "name": "layout",
              "description": "Layout:\n- `mini` (default): minimal controls: play/pause, range; volume and other controls hidden behind menu\n- `compact`: artwork and more controls: time, skip, volume\n- `compact-wide`: like compact but full width\n- `full`: maximal controls and artwork",
              "type": {
                "text": "'mini' | 'compact' | 'compact-wide' | 'full'"
              },
              "default": "'mini'",
              "fieldName": "layout"
            },
            {
              "name": "poster",
              "description": "URL to audio's artwork",
              "type": {
                "text": "string"
              },
              "fieldName": "poster"
            },
            {
              "name": "volume",
              "description": "Playback volume",
              "type": {
                "text": "number"
              },
              "default": "0.5",
              "fieldName": "volume"
            },
            {
              "name": "playbackrate",
              "description": "Playback rate",
              "type": {
                "text": "number"
              },
              "default": "1",
              "fieldName": "playbackRate"
            },
            {
              "name": "expanded",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "expanded"
            },
            {
              "name": "lang",
              "type": {
                "text": "string"
              },
              "fieldName": "lang"
            },
            {
              "name": "color-palette",
              "description": "Element's color palette",
              "type": {
                "text": "ColorPalette"
              },
              "fieldName": "colorPalette"
            }
          ],
          "slots": [
            {
              "name": "media"
            },
            {
              "name": "series",
              "description": "optional, name of podcast series"
            },
            {
              "name": "title",
              "description": "optional, title of episode"
            },
            {
              "name": "about",
              "description": "optional `rh-audio-player-about` panel with attribution"
            },
            {
              "name": "subscribe",
              "description": "optional `rh-audio-player-subscribe` panel with links to subscribe"
            },
            {
              "name": "transcript",
              "description": "optional `rh-transcript` panel with `rh-cue` elements"
            }
          ],
          "cssParts": [
            {
              "name": "toolbar",
              "description": "main controls"
            },
            {
              "name": "panel",
              "description": "expandable panel"
            },
            {
              "name": "about",
              "description": "about the episode panel"
            },
            {
              "name": "subscribe",
              "description": "subscribe panel"
            },
            {
              "name": "transcript",
              "description": "transcript panel"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-size-icon-03",
              "description": "32px icon box",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-code-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-box-shadow-md",
              "description": "Medium box shadow",
              "default": "0 4px 6px 1px rgba(21, 21, 21, 0.25)",
              "syntax": "\u003cshadow\u003e"
            },
            {
              "name": "--rh-audio-player-text-color",
              "default": "var(--rh-color-text-primary)"
            },
            {
              "name": "--rh-length-lg",
              "description": "16px length token",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-xs",
              "description": "4px length token",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-gray-30",
              "description": "Subtle borders (light theme)",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-50",
              "description": "Subtle icon",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-interactive",
              "description": "Responsive `border-interactive` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-interactive-on-light` on a themable container with a light color palette and `--rh-color-border-interactive-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-accent-brand",
              "description": "Responsive `accent-brand` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-accent-brand-on-light` on a themable container with a light color palette and `--rh-color-accent-brand-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "color of player border -\n\nResponsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-audio-player-range-thumb-color",
              "description": "color of time and volume range slider thumb",
              "default": "var(--_accent-color)"
            },
            {
              "name": "--rh-audio-player-range-progress-color",
              "default": "var(--_accent-color)"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--box-fill"
            },
            {
              "name": "--rh-audio-player-secondary-text-color",
              "description": "player secondary text color -",
              "default": "var(--rh-color-text-primary)"
            },
            {
              "name": "--rh-audio-player-secondary-opacity",
              "description": "player secondary opacity used for partially faded elements -",
              "default": "0.75"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-light",
              "description": "Secondary surface (light theme)",
              "default": "#e0e0e0",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xl",
              "description": "20px font size",
              "default": "1.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-line-height-heading",
              "description": "Line height for headings",
              "default": "1.3"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-heading-xs",
              "description": "h6 heading font size",
              "default": "1.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-heading-medium",
              "description": "Medium font weight for headings",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-letter-spacing-body-text",
              "description": "Extra letter spacing for small body text sizes",
              "default": "0.0125rem"
            },
            {
              "name": "--rh-font-family-code",
              "description": "Code font family",
              "default": "RedHatMono, 'Red Hat Mono', 'Courier New', Courier, monospace",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-code-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-line-height-code",
              "description": "Line height for code",
              "default": "1.5"
            },
            {
              "name": "--rh-size-icon-01",
              "description": "16px icon box",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-icon-size"
            },
            {
              "name": "--rh-audio-player-background-color",
              "description": "color of player background -",
              "default": "var(--_static-surface-color)"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-size-icon-02",
              "description": "24px icon box",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-md",
              "description": "8px length token",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/audio-player/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/audio-player/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/audio-player/demo/compact-wide/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/demo/compact-wide.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/audio-player/demo/compact/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/demo/compact.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/audio-player/demo/customization/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/demo/customization.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/audio-player/demo/detailed-transcript/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/demo/detailed-transcript.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/audio-player/demo/heading-levels/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/demo/heading-levels.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/audio-player/demo/language-localization/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/demo/language-localization.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/audio-player/demo/mini/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/demo/mini.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/audio-player/demo/prevent-concurrent-playback/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/demo/prevent-concurrent-playback.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/audio-player/demo/right-to-left/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/demo/right-to-left.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-audio-player",
          "declaration": {
            "name": "RhAudioPlayer",
            "module": "rh-audio-player/rh-audio-player.js"
          }
        },
        {
          "kind": "js",
          "name": "RhAudioPlayer",
          "declaration": {
            "name": "RhAudioPlayer",
            "module": "rh-audio-player/rh-audio-player.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-audio-player/rh-cue.js",
      "declarations": [
        {
          "parameters": [
            {
              "name": "seconds",
              "type": {
                "text": "Seconds"
              }
            }
          ],
          "name": "getFormattedTime",
          "description": "formats time in seconds as `mm:ss.ms` string",
          "kind": "function",
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/rh-cue.ts#L15"
          }
        },
        {
          "parameters": [
            {
              "name": "str",
              "type": {
                "text": "TimeString"
              }
            }
          ],
          "name": "getSeconds",
          "description": "gets seconds from a string formatted as `mm:ss.mss` or `hh:mm:ss.mss`",
          "kind": "function",
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/rh-cue.ts#L45"
          }
        },
        {
          "name": "RhCue",
          "description": "Media Transcript Cue",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "start",
              "description": "Start time, in mm:ss.ms",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "start"
            },
            {
              "name": "end",
              "description": "End time, in mm:ss.ms",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "end"
            },
            {
              "name": "text",
              "description": "Text of this cue. Overridden by `text` slot",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "text"
            },
            {
              "name": "voice",
              "description": "Name of voice speaking this text. Overridden by `voice` slot",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "voice",
              "reflects": true
            },
            {
              "name": "active",
              "description": "Whether this cue is active right now",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "active",
              "reflects": true
            },
            {
              "name": "startTime",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "endTime",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "downloadText",
              "readonly": true,
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/rh-cue.ts#L63"
          },
          "kind": "class",
          "tagName": "rh-cue",
          "attributes": [
            {
              "name": "start",
              "description": "Start time, in mm:ss.ms",
              "type": {
                "text": "string"
              },
              "fieldName": "start"
            },
            {
              "name": "end",
              "description": "End time, in mm:ss.ms",
              "type": {
                "text": "string"
              },
              "fieldName": "end"
            },
            {
              "name": "text",
              "description": "Text of this cue. Overridden by `text` slot",
              "type": {
                "text": "string"
              },
              "fieldName": "text"
            },
            {
              "name": "voice",
              "description": "Name of voice speaking this text. Overridden by `voice` slot",
              "type": {
                "text": "string"
              },
              "fieldName": "voice"
            },
            {
              "name": "active",
              "description": "Whether this cue is active right now",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "active"
            }
          ],
          "events": [
            {
              "name": "cueseek",
              "description": "when user clicks a time cue"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "text of cue"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-family-code",
              "description": "Code font family",
              "default": "RedHatMono, 'Red Hat Mono', 'Courier New', Courier, monospace",
              "syntax": "\u003cfont-family\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "getFormattedTime",
          "declaration": {
            "name": "getFormattedTime",
            "module": "rh-audio-player/rh-cue.js"
          }
        },
        {
          "kind": "js",
          "name": "getSeconds",
          "declaration": {
            "name": "getSeconds",
            "module": "rh-audio-player/rh-cue.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-cue",
          "declaration": {
            "name": "RhCue",
            "module": "rh-audio-player/rh-cue.js"
          }
        },
        {
          "kind": "js",
          "name": "RhCue",
          "declaration": {
            "name": "RhCue",
            "module": "rh-audio-player/rh-cue.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-audio-player/rh-transcript.js",
      "declarations": [
        {
          "name": "RhTranscript",
          "description": "Audio Player Transcript Panel",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "heading",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "heading"
            },
            {
              "name": "label",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "label"
            },
            {
              "name": "lang",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "lang",
              "reflects": true
            },
            {
              "name": "menuLabel",
              "type": {
                "text": "string"
              },
              "default": "'About the episode'",
              "kind": "field",
              "attribute": "menulabel"
            },
            {
              "name": "downloadLabel",
              "type": {
                "text": "string"
              },
              "default": "'Download'",
              "kind": "field",
              "attribute": "downloadlabel"
            },
            {
              "name": "autoscrollLabel",
              "type": {
                "text": "string"
              },
              "default": "'Autoscroll'",
              "kind": "field",
              "attribute": "autoscrolllabel"
            },
            {
              "name": "downloadText",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "setActiveCues",
              "kind": "method"
            },
            {
              "parameters": [
                {
                  "name": "mediaDuration",
                  "type": {
                    "text": "number"
                  }
                }
              ],
              "name": "setDuration",
              "kind": "method"
            },
            {
              "name": "scrollText",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-audio-player/rh-transcript.ts#L25"
          },
          "kind": "class",
          "tagName": "rh-transcript",
          "attributes": [
            {
              "name": "heading",
              "type": {
                "text": "string"
              },
              "fieldName": "heading"
            },
            {
              "name": "label",
              "type": {
                "text": "string"
              },
              "fieldName": "label"
            },
            {
              "name": "lang",
              "type": {
                "text": "string"
              },
              "fieldName": "lang"
            },
            {
              "name": "menulabel",
              "type": {
                "text": "string"
              },
              "default": "'About the episode'",
              "fieldName": "menuLabel"
            },
            {
              "name": "downloadlabel",
              "type": {
                "text": "string"
              },
              "default": "'Download'",
              "fieldName": "downloadLabel"
            },
            {
              "name": "autoscrolllabel",
              "type": {
                "text": "string"
              },
              "default": "'Autoscroll'",
              "fieldName": "autoscrollLabel"
            }
          ],
          "slots": [
            {
              "name": "heading",
              "description": "custom heading for panel"
            },
            {
              "name": "",
              "description": "`rh-cue` elements"
            }
          ],
          "cssParts": [
            {
              "name": "heading",
              "description": "scrolling text overflow"
            },
            {
              "name": "toolbar",
              "description": "toolbar area above cues list"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-size-icon-03",
              "description": "32px icon box",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-interactive",
              "description": "Responsive `border-interactive` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-interactive-on-light` on a themable container with a light color palette and `--rh-color-border-interactive-on-dark` on a themable container with a dark color palette.",
              "default": "2px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-icon-size"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-heading-xs",
              "description": "h6 heading font size",
              "default": "1.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-line-height-heading",
              "description": "Line height for headings",
              "default": "1.3"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-letter-spacing-body-text",
              "description": "Extra letter spacing for small body text sizes",
              "default": "0.0125rem"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-heading-medium",
              "description": "Medium font weight for headings",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-transcript",
          "declaration": {
            "name": "RhTranscript",
            "module": "rh-audio-player/rh-transcript.js"
          }
        },
        {
          "kind": "js",
          "name": "RhTranscript",
          "declaration": {
            "name": "RhTranscript",
            "module": "rh-audio-player/rh-transcript.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-avatar/rh-avatar.js",
      "declarations": [
        {
          "name": "RhAvatar",
          "summary": "Visually represents a user in a masthead or navigation",
          "description": "An avatar is a small thumbnail representation of a user.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "src",
              "description": "The URL to the user's custom avatar image.\n\nIt will be displayed instead of a random pattern.",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "src",
              "reflects": true
            },
            {
              "name": "name",
              "description": "The user's name, either given name and family name, or username.\n\nWhen displaying a pattern, the name will be used to seed the pattern generator.",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "name",
              "reflects": true
            },
            {
              "name": "subtitle",
              "description": "The auxiliary information about the user, e.g. job title",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "subtitle",
              "reflects": true
            },
            {
              "name": "layout",
              "description": "Places avatar on the left or on top of the text.",
              "type": {
                "text": "'inline' | 'block'"
              },
              "kind": "field",
              "attribute": "layout",
              "reflects": true
            },
            {
              "name": "pattern",
              "description": "The type of pattern to display.",
              "type": {
                "text": "'squares' | 'triangles'"
              },
              "kind": "field",
              "attribute": "pattern",
              "reflects": true
            },
            {
              "name": "plain",
              "description": "When true, hides the title and subtitle",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "plain",
              "reflects": true
            },
            {
              "name": "variant",
              "description": "Adds a subtle border to the avatar image",
              "type": {
                "text": "'bordered'"
              },
              "kind": "field",
              "attribute": "variant",
              "reflects": true
            },
            {
              "name": "updatePattern",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-avatar/rh-avatar.ts#L22"
          },
          "kind": "class",
          "tagName": "rh-avatar",
          "attributes": [
            {
              "name": "src",
              "description": "The URL to the user's custom avatar image.\n\nIt will be displayed instead of a random pattern.",
              "type": {
                "text": "string"
              },
              "fieldName": "src"
            },
            {
              "name": "name",
              "description": "The user's name, either given name and family name, or username.\n\nWhen displaying a pattern, the name will be used to seed the pattern generator.",
              "type": {
                "text": "string"
              },
              "fieldName": "name"
            },
            {
              "name": "subtitle",
              "description": "The auxiliary information about the user, e.g. job title",
              "type": {
                "text": "string"
              },
              "fieldName": "subtitle"
            },
            {
              "name": "layout",
              "description": "Places avatar on the left or on top of the text.",
              "type": {
                "text": "'inline' | 'block'"
              },
              "fieldName": "layout"
            },
            {
              "name": "pattern",
              "description": "The type of pattern to display.",
              "type": {
                "text": "'squares' | 'triangles'"
              },
              "fieldName": "pattern"
            },
            {
              "name": "plain",
              "description": "When true, hides the title and subtitle",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "plain"
            },
            {
              "name": "variant",
              "description": "Adds a subtle border to the avatar image",
              "type": {
                "text": "'bordered'"
              },
              "fieldName": "variant"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "The subject's name"
            },
            {
              "name": "subtitle",
              "description": "auxiliary information about the subject, e.g. job title"
            }
          ],
          "cssParts": [
            {
              "name": "canvas",
              "description": "Target the canvas element"
            },
            {
              "name": "img",
              "description": "Targets the img or svg element"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-30",
              "description": "Inline link (dark theme)",
              "default": "#92c5f9",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-teal-50",
              "description": "Alert - Default accent",
              "default": "#37a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-green-60",
              "description": "Alert - Success accent",
              "default": "#3d7317",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-40",
              "description": "Light brand red",
              "default": "#f56e6e",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-purple-60",
              "description": "Inline link visited (light theme)",
              "default": "#3d2785",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-avatar-colors",
              "default": "var(--rh-color-blue-50, #0066cc) var(--rh-color-teal-70, #004d4d) var(--rh-color-green-70, #204d00) var(--rh-color-red-50, #ee0000) var(--rh-color-purple-70, #21134d)"
            },
            {
              "name": "--rh-color-blue-50",
              "description": "Label - Filled (Blue) accent color",
              "default": "#0066cc",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-teal-70",
              "description": "Alert - Default title text",
              "default": "#004d4d",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-green-70",
              "description": "Alert - Success title text",
              "default": "#204d00",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-50",
              "description": "Brand red (light and dark theme)",
              "default": "#ee0000",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-purple-70",
              "description": "Inline link visited hover (light theme)",
              "default": "#21134d",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-weight-heading-medium",
              "description": "Medium font weight for headings",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-font-weight-heading-regular",
              "description": "Regular font weight for headings",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-visited-default",
              "description": "Responsive `interactive-primary-visited` (e.g. visited link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-visited-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-visited-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-avatar-size",
              "description": "Size of the avatar,",
              "default": "var(--rh-size-icon-06, 64px)"
            },
            {
              "name": "--rh-size-icon-06",
              "description": "64px icon box",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-radius-pill",
              "description": "Pill border radius; Example: Label",
              "default": "64px"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/avatar/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-avatar/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/avatar/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-avatar/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/avatar/demo/links/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-avatar/demo/links.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/avatar/demo/pattern/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-avatar/demo/pattern.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/avatar/demo/plain/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-avatar/demo/plain.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/avatar/demo/position/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-avatar/demo/position.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/avatar/demo/sizes/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-avatar/demo/sizes.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/avatar/demo/subtitles/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-avatar/demo/subtitles.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/avatar/demo/variants/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-avatar/demo/variants.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-avatar",
          "declaration": {
            "name": "RhAvatar",
            "module": "rh-avatar/rh-avatar.js"
          }
        },
        {
          "kind": "js",
          "name": "RhAvatar",
          "declaration": {
            "name": "RhAvatar",
            "module": "rh-avatar/rh-avatar.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-back-to-top/rh-back-to-top.js",
      "declarations": [
        {
          "name": "RhBackToTop",
          "summary": "A shortcut to the top of the page content",
          "description": "Back to top component is a fragment link that allows users to quickly navigate\nto the top of a lengthy content page.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "visible",
              "description": "Flag to always show back to top button, defaults to false.",
              "type": {
                "text": "'always' | undefined"
              },
              "kind": "field",
              "attribute": "visible",
              "reflects": true
            },
            {
              "name": "scrollableSelector",
              "description": "Element selector to spy on for scrolling. Not passing a selector defaults to spying on window scroll events",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "scrollable-selector",
              "reflects": true
            },
            {
              "name": "scrollDistance",
              "description": "Distance from the top of the scrollable element to trigger the visibility of the back to top button",
              "type": {
                "text": "number"
              },
              "default": "400",
              "kind": "field",
              "attribute": "scroll-distance"
            },
            {
              "name": "href",
              "description": "Page fragment link to target element, must include hash ex: #top",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "href",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-back-to-top/rh-back-to-top.ts#L20"
          },
          "kind": "class",
          "tagName": "rh-back-to-top",
          "attributes": [
            {
              "name": "visible",
              "description": "Flag to always show back to top button, defaults to false.",
              "type": {
                "text": "'always' | undefined"
              },
              "fieldName": "visible"
            },
            {
              "name": "scrollable-selector",
              "description": "Element selector to spy on for scrolling. Not passing a selector defaults to spying on window scroll events",
              "type": {
                "text": "string"
              },
              "fieldName": "scrollableSelector"
            },
            {
              "name": "scroll-distance",
              "description": "Distance from the top of the scrollable element to trigger the visibility of the back to top button",
              "type": {
                "text": "number"
              },
              "default": "400",
              "fieldName": "scrollDistance"
            },
            {
              "name": "href",
              "description": "Page fragment link to target element, must include hash ex: #top",
              "type": {
                "text": "string"
              },
              "fieldName": "href"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Text for the back to top link"
            }
          ],
          "cssParts": [
            {
              "name": "trigger",
              "description": "back to top link anchor element"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-dark",
              "description": "Primary text color for dark theme",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-light",
              "description": "Primary text color for light theme",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-back-to-top-background-color",
              "default": "var(--rh-color-accent-base)"
            },
            {
              "name": "--rh-color-accent-base",
              "description": "Responsive `accent-base` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-accent-base-on-light` on a themable container with a light color palette and `--rh-color-accent-base-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-radius-pill",
              "description": "Pill border radius; Example: Label",
              "default": "64px"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-strong-on-dark",
              "description": "Strong border color (dark theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-strong-on-light",
              "description": "Strong border color (light theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "default": "2px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xs",
              "description": "4px spacer",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-3xl",
              "description": "48px spacer",
              "default": "48px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/back-to-top/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-back-to-top/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/back-to-top/demo/always-visible/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-back-to-top/demo/always-visible.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/back-to-top/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-back-to-top/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/back-to-top/demo/no-slotted-text/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-back-to-top/demo/no-slotted-text.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/back-to-top/demo/scroll-distance/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-back-to-top/demo/scroll-distance.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-back-to-top",
          "declaration": {
            "name": "RhBackToTop",
            "module": "rh-back-to-top/rh-back-to-top.js"
          }
        },
        {
          "kind": "js",
          "name": "RhBackToTop",
          "declaration": {
            "name": "RhBackToTop",
            "module": "rh-back-to-top/rh-back-to-top.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-badge/rh-badge.js",
      "declarations": [
        {
          "name": "RhBadge",
          "summary": "Annotates information like a label or object",
          "description": "A badge is used to annotate other information like a label or an object name.\n\n- `neutral` - Indicates generic information or a message with no severity.\n- `danger` - Indicates a danger state, like an error that is blocking a user from completing a task.\n- `warning` - Indicates a warning state, like a non-blocking error that might need to be fixed.\n- `caution` - Indicates an action or notice which should immediately draw the attention\n- `info` - Indicates helpful information or a message with very little to no severity.\n- `success` - Indicates a success state, like if a process was completed without errors.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "state",
              "description": "Denotes the state-of-affairs this badge represents\nNote: 'moderate','important', and 'critical' will also work, but are deprecated",
              "type": {
                "text": "| 'danger'\n    | 'warning'\n    | 'caution'\n    | 'neutral'\n    | 'success'\n    | 'info'"
              },
              "default": "'neutral'",
              "kind": "field",
              "attribute": "state",
              "reflects": true
            },
            {
              "name": "number",
              "description": "Sets a numeric value for a badge.\n\nYou can pair it with `threshold` attribute to add a `+` sign\nif the number exceeds the threshold value.",
              "type": {
                "text": "number"
              },
              "kind": "field",
              "attribute": "number",
              "reflects": true
            },
            {
              "name": "threshold",
              "description": "Sets a threshold for the numeric value and adds `+` sign if\nthe numeric value exceeds the threshold value.",
              "type": {
                "text": "number"
              },
              "kind": "field",
              "attribute": "threshold",
              "reflects": true
            },
            {
              "name": "stateChanged",
              "description": "Ensures that state is consistent, regardless of input",
              "kind": "method",
              "privacy": "private"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-badge/rh-badge.ts#L28"
          },
          "kind": "class",
          "tagName": "rh-badge",
          "attributes": [
            {
              "name": "state",
              "description": "Denotes the state-of-affairs this badge represents\nNote: 'moderate','important', and 'critical' will also work, but are deprecated",
              "type": {
                "text": "| 'danger'\n    | 'warning'\n    | 'caution'\n    | 'neutral'\n    | 'success'\n    | 'info'"
              },
              "default": "'neutral'",
              "fieldName": "state"
            },
            {
              "name": "number",
              "description": "Sets a numeric value for a badge.\n\nYou can pair it with `threshold` attribute to add a `+` sign\nif the number exceeds the threshold value.",
              "type": {
                "text": "number"
              },
              "fieldName": "number"
            },
            {
              "name": "threshold",
              "description": "Sets a threshold for the numeric value and adds `+` sign if\nthe numeric value exceeds the threshold value.",
              "type": {
                "text": "number"
              },
              "fieldName": "threshold"
            }
          ],
          "slots": [
            {
              "name": ""
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-border-radius-pill",
              "description": "Pill border radius; Example: Label",
              "default": "64px"
            },
            {
              "name": "--rh-length-lg",
              "description": "16px length token",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-dark",
              "description": "Primary text color for dark theme",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-neutral",
              "description": "Responsive `status-neutral` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-neutral-on-light` on a themable container with a light color palette and `--rh-color-status-neutral-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-info",
              "description": "Responsive `status-info` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-info-on-light` on a themable container with a light color palette and `--rh-color-status-info-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-success",
              "description": "Responsive `status-success` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-success-on-light` on a themable container with a light color palette and `--rh-color-status-success-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-caution",
              "description": "Responsive `status-caution` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-caution-on-light` on a themable container with a light color palette and `--rh-color-status-caution-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-warning",
              "description": "Responsive `status-warning` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-warning-on-light` on a themable container with a light color palette and `--rh-color-status-warning-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-light",
              "description": "Primary text color for light theme",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-danger",
              "description": "Responsive `status-danger` color value. Typically read-only – use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-danger-on-light` on a themable container with a light color palette and `--rh-color-status-danger-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/badge/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-badge/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/badge/demo/caution/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-badge/demo/caution.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/badge/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-badge/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/badge/demo/danger/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-badge/demo/danger.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/badge/demo/deprecated-states/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-badge/demo/deprecated-states.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/badge/demo/info/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-badge/demo/info.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/badge/demo/neutral/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-badge/demo/neutral.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/badge/demo/success/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-badge/demo/success.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/badge/demo/threshold/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-badge/demo/threshold.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/badge/demo/warning/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-badge/demo/warning.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-badge",
          "declaration": {
            "name": "RhBadge",
            "module": "rh-badge/rh-badge.js"
          }
        },
        {
          "kind": "js",
          "name": "RhBadge",
          "declaration": {
            "name": "RhBadge",
            "module": "rh-badge/rh-badge.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-blockquote/rh-blockquote.js",
      "declarations": [
        {
          "name": "RhBlockquote",
          "summary": "Highlights quotations and citations with text styles",
          "description": "A blockquote is styled quote text with an icon and attribution text.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "colorPalette",
              "description": "Set the colorPalette of the blockquote. Possible values are:\n- `lightest` (default)\n- `darkest`",
              "type": {
                "text": "ColorPalette"
              },
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            },
            {
              "name": "align",
              "description": "Set the alignment of the blockquote. Possible values are:\n- `left` (default)\n- `center`",
              "type": {
                "text": "'center' | 'inline-start'"
              },
              "default": "'inline-start'",
              "kind": "field",
              "attribute": "align",
              "reflects": true
            },
            {
              "name": "highlight",
              "description": "Optional highlight attribute that, when present, shows a highlight on side of blockquote.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "highlight",
              "reflects": true
            },
            {
              "name": "size",
              "description": "Set the text size of the blockquote. Possible values are:\n- `default`\n- `large`",
              "type": {
                "text": "'default' | 'large'"
              },
              "default": "'default'",
              "kind": "field",
              "attribute": "size",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-blockquote/rh-blockquote.ts#L24"
          },
          "kind": "class",
          "tagName": "rh-blockquote",
          "attributes": [
            {
              "name": "color-palette",
              "description": "Set the colorPalette of the blockquote. Possible values are:\n- `lightest` (default)\n- `darkest`",
              "type": {
                "text": "ColorPalette"
              },
              "fieldName": "colorPalette"
            },
            {
              "name": "align",
              "description": "Set the alignment of the blockquote. Possible values are:\n- `left` (default)\n- `center`",
              "type": {
                "text": "'center' | 'inline-start'"
              },
              "default": "'inline-start'",
              "fieldName": "align"
            },
            {
              "name": "highlight",
              "description": "Optional highlight attribute that, when present, shows a highlight on side of blockquote.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "highlight"
            },
            {
              "name": "size",
              "description": "Set the text size of the blockquote. Possible values are:\n- `default`\n- `large`",
              "type": {
                "text": "'default' | 'large'"
              },
              "default": "'default'",
              "fieldName": "size"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Provide a quote for the blockquote"
            },
            {
              "name": "author",
              "description": "Provide an author for the blockquote"
            },
            {
              "name": "title",
              "description": "Provide an author title for the blockquote"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-lg",
              "description": "18px font size",
              "default": "1.125rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-font-weight-heading-regular",
              "description": "Regular font weight for headings",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xl",
              "description": "20px font size",
              "default": "1.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-lg",
              "description": "16px length token",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-heading-bold",
              "description": "Bold font weight for headings",
              "default": "700",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-icon-primary",
              "description": "Responsive `icon-primary` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-icon-primary-on-light` on a themable container with a light color palette and `--rh-color-icon-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-2xl",
              "description": "24px font size",
              "default": "1.5rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-line-height-heading",
              "description": "Line height for headings",
              "default": "1.3"
            },
            {
              "name": "--rh-font-size-heading-md",
              "description": "h4 heading font size",
              "default": "1.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-md",
              "description": "8px length token",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-accent-brand",
              "description": "Responsive `accent-brand` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-accent-brand-on-light` on a themable container with a light color palette and `--rh-color-accent-brand-on-dark` on a themable container with a dark color palette.",
              "default": "8px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-length-xl",
              "description": "24px length token",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/blockquote/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-blockquote/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/blockquote/demo/centered/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-blockquote/demo/centered.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/blockquote/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-blockquote/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/blockquote/demo/highlighted/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-blockquote/demo/highlighted.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/blockquote/demo/large/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-blockquote/demo/large.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-blockquote",
          "declaration": {
            "name": "RhBlockquote",
            "module": "rh-blockquote/rh-blockquote.js"
          }
        },
        {
          "kind": "js",
          "name": "RhBlockquote",
          "declaration": {
            "name": "RhBlockquote",
            "module": "rh-blockquote/rh-blockquote.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-breadcrumb/rh-breadcrumb.js",
      "declarations": [
        {
          "name": "RhBreadcrumb",
          "summary": "Links displaying a hierarchical location",
          "description": "A breadcrumb navigation is a secondary navigation element consisting of a list\nof links to the parent pages of the current page in hierarchical order. It\nhelps users find their place within a website or web application.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "accessibleLabel",
              "description": "Customize the default `aria-label` on the `\u003cnav\u003e` container.\nDefaults to \"Breadcrumb\" if no attribute/property is set.",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "accessible-label"
            },
            {
              "name": "variant",
              "description": "Sets variants to breadcrumbs",
              "type": {
                "text": "'subtle'"
              },
              "kind": "field",
              "attribute": "variant",
              "reflects": true
            },
            {
              "name": "truncate",
              "description": "Breadcrumbs over four items will be truncated and include a button to expand the middle breadcrumb items",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "truncate",
              "reflects": true
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "firstUpdated",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-breadcrumb/rh-breadcrumb.ts#L46"
          },
          "kind": "class",
          "tagName": "rh-breadcrumb",
          "attributes": [
            {
              "name": "accessible-label",
              "description": "Customize the default `aria-label` on the `\u003cnav\u003e` container.\nDefaults to \"Breadcrumb\" if no attribute/property is set.",
              "type": {
                "text": "string"
              },
              "fieldName": "accessibleLabel"
            },
            {
              "name": "variant",
              "description": "Sets variants to breadcrumbs",
              "type": {
                "text": "'subtle'"
              },
              "fieldName": "variant"
            },
            {
              "name": "truncate",
              "description": "Breadcrumbs over four items will be truncated and include a button to expand the middle breadcrumb items",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "truncate"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Place an ordered list (`\u003col\u003e`) of your breadcrumbs into the slot"
            }
          ],
          "cssParts": [
            {
              "name": "container",
              "description": "container element for slotted breadcrumb"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-breadcrumb-caret-image",
              "description": "The default `mask-image` separating each breadcrumb item",
              "default": "{svg encoded as data URI}"
            },
            {
              "name": "--rh-breadcrumb-li-padding-inline-end",
              "description": "Sets the spacing between each breadcrumb item.",
              "default": "var(--rh-space-lg, 16px)"
            },
            {
              "name": "--rh-breadcrumb-link-color",
              "description": "The link color for each anchor in the list",
              "default": "var(--rh-color-interactive-primary-default)"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/breadcrumb/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-breadcrumb/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/breadcrumb/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-breadcrumb/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/breadcrumb/demo/custom-accessible-label/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-breadcrumb/demo/custom-accessible-label.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/breadcrumb/demo/non-interactive-last-item/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-breadcrumb/demo/non-interactive-last-item.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/breadcrumb/demo/subtle/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-breadcrumb/demo/subtle.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/breadcrumb/demo/truncate/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-breadcrumb/demo/truncate.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-breadcrumb",
          "declaration": {
            "name": "RhBreadcrumb",
            "module": "rh-breadcrumb/rh-breadcrumb.js"
          }
        },
        {
          "kind": "js",
          "name": "RhBreadcrumb",
          "declaration": {
            "name": "RhBreadcrumb",
            "module": "rh-breadcrumb/rh-breadcrumb.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-button/rh-button.js",
      "declarations": [
        {
          "name": "RhButton",
          "summary": "Triggers actions on the page or in the background",
          "description": "A button is clickable text or an icon that triggers an action on the page or in the background.\nDepending on the action, content, and hierarchy, a button can be used on its own or grouped with\nother buttons.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "disabled",
              "description": "Disables the button",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "disabled",
              "reflects": true
            },
            {
              "name": "type",
              "description": "button type",
              "type": {
                "text": "'button' | 'submit' | 'reset'"
              },
              "kind": "field",
              "attribute": "type",
              "reflects": true
            },
            {
              "name": "label",
              "description": "Accessible name for the button, use when the button does not have slotted text",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "label"
            },
            {
              "name": "value",
              "description": "Form value for the button",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "value"
            },
            {
              "name": "name",
              "description": "Form name for the button",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "name"
            },
            {
              "name": "icon",
              "description": "Shorthand for the `icon` slot, the value is icon name",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "kind": "field",
              "attribute": "icon"
            },
            {
              "name": "iconSet",
              "description": "Icon set for the `icon` property - 'ui' by default",
              "type": {
                "text": "IconSetName"
              },
              "kind": "field",
              "attribute": "icon-set"
            },
            {
              "name": "variant",
              "description": "Changes the style of the button.\n- Primary: Used for the most important call to action on a page. Try to\nlimit primary buttons to one per page.\n- Secondary: Use secondary buttons for general actions on a page, that\ndon’t require as much emphasis as primary button actions. For example,\nyou can use secondary buttons where there are multiple actions, like in\ntoolbars or data lists.\n- Tertiary: Tertiary buttons are flexible and can be used as needed.",
              "type": {
                "text": "| 'primary'\n    | 'secondary'\n    | 'tertiary'\n    | 'close'\n    | 'play'"
              },
              "default": "'primary'",
              "kind": "field",
              "attribute": "variant",
              "reflects": true
            },
            {
              "name": "danger",
              "description": "Use danger buttons for actions a user can take that are potentially\ndestructive or difficult/impossible to undo, like deleting or removing\nuser data.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "danger",
              "reflects": true
            },
            {
              "name": "focus",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-button/rh-button.ts#L27"
          },
          "kind": "class",
          "tagName": "rh-button",
          "attributes": [
            {
              "name": "disabled",
              "description": "Disables the button",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "disabled"
            },
            {
              "name": "type",
              "description": "button type",
              "type": {
                "text": "'button' | 'submit' | 'reset'"
              },
              "fieldName": "type"
            },
            {
              "name": "label",
              "description": "Accessible name for the button, use when the button does not have slotted text",
              "type": {
                "text": "string"
              },
              "fieldName": "label"
            },
            {
              "name": "value",
              "description": "Form value for the button",
              "type": {
                "text": "string"
              },
              "fieldName": "value"
            },
            {
              "name": "name",
              "description": "Form name for the button",
              "type": {
                "text": "string"
              },
              "fieldName": "name"
            },
            {
              "name": "icon",
              "description": "Shorthand for the `icon` slot, the value is icon name",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "fieldName": "icon"
            },
            {
              "name": "icon-set",
              "description": "Icon set for the `icon` property - 'ui' by default",
              "type": {
                "text": "IconSetName"
              },
              "fieldName": "iconSet"
            },
            {
              "name": "variant",
              "description": "Changes the style of the button.\n- Primary: Used for the most important call to action on a page. Try to\nlimit primary buttons to one per page.\n- Secondary: Use secondary buttons for general actions on a page, that\ndon’t require as much emphasis as primary button actions. For example,\nyou can use secondary buttons where there are multiple actions, like in\ntoolbars or data lists.\n- Tertiary: Tertiary buttons are flexible and can be used as needed.",
              "type": {
                "text": "| 'primary'\n    | 'secondary'\n    | 'tertiary'\n    | 'close'\n    | 'play'"
              },
              "default": "'primary'",
              "fieldName": "variant"
            },
            {
              "name": "danger",
              "description": "Use danger buttons for actions a user can take that are potentially\ndestructive or difficult/impossible to undo, like deleting or removing\nuser data.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "danger"
            }
          ],
          "slots": [
            {
              "name": "icon",
              "description": "Contains the button's icon or state indicator, e.g. a spinner."
            },
            {
              "name": "",
              "description": "Contains button text"
            }
          ],
          "cssParts": [
            {
              "name": "button",
              "description": "Internal button element"
            },
            {
              "name": "icon",
              "description": "Container for the icon slot"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-length-4xs",
              "description": "1px length token",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-space-sm",
              "description": "6px spacer",
              "default": "6px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover-on-light",
              "description": "Primary interactive - hover (Light theme)",
              "default": "#003366",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-dark",
              "description": "Primary text color for dark theme",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-light",
              "description": "Primary text color for light theme",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-danger",
              "description": "Responsive `status-danger` color value. Typically read-only – use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-danger-on-light` on a themable container with a light color palette and `--rh-color-status-danger-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-status-danger",
              "description": "Responsive `border-danger` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-danger-on-light` on a themable container with a light color palette and `--rh-color-border-danger-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-60",
              "description": "Dark brand red",
              "default": "#a60000",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-30",
              "description": "Lighter brand red",
              "default": "#f9a8a8",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-strong",
              "description": "Responsive `border-strong` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-border-strong-on-light` on a themable container with a light color palette and `--rh-color-border-strong-on-dark` on a themable container with a dark color palette",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-blue-70",
              "description": "Alert - Info title text",
              "default": "#003366",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover-on-dark",
              "description": "Primary interactive - hover (Dark theme)",
              "default": "#b9dafc",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-secondary",
              "description": "Responsive `icon-secondary` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-icon-secondary-on-light` on a themable container with a light color palette and `--rh-color-icon-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-secondary-active",
              "description": "Responsive `interactive-secondary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-secondary-active-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-secondary-active-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-secondary-focus",
              "description": "Responsive `interactive-secondary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-secondary-focus-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-secondary-focus-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-secondary-hover",
              "description": "Responsive `interactive-secondary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-secondary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-secondary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-length-lg",
              "description": "16px length token",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-opacity-50",
              "description": "50% opacity",
              "default": "50%"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-90",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-opacity-80",
              "description": "80% opacity",
              "default": "80%"
            },
            {
              "name": "--rh-length-4xl",
              "description": "64px length token",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-icon-secondary-on-dark",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-secondary-on-light",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-50",
              "description": "Subtle icon",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-60",
              "description": "Secondary text (light theme)",
              "default": "#4d4d4d",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-30",
              "description": "Subtle borders (light theme)",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-status-disabled"
            },
            {
              "name": "--rh-color-status-disabled"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/button/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-button/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/button/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-button/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/button/demo/form-control/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-button/demo/form-control.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/button/demo/icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-button/demo/icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/button/demo/variants/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-button/demo/variants.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-button",
          "declaration": {
            "name": "RhButton",
            "module": "rh-button/rh-button.js"
          }
        },
        {
          "kind": "js",
          "name": "RhButton",
          "declaration": {
            "name": "RhButton",
            "module": "rh-button/rh-button.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-card/rh-card.js",
      "declarations": [
        {
          "name": "RhCard",
          "summary": "Arranges content and interactive elements in a layout",
          "description": "Cards are flexible surfaces used to group information in a small layout. They give small previews of information or provide secondary content in relation to the content it's near. Several cards can be used together to group related information.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "colorPalette",
              "description": "Sets color palette, which affects the element's styles as well as descendants' color theme.\nOverrides parent color context.\nYour theme will influence these colors so check there first if you are seeing inconsistencies.\nSee [CSS Custom Properties](#css-custom-properties) for default values",
              "type": {
                "text": "ColorPalette"
              },
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            },
            {
              "name": "variant",
              "description": "Change the style of the card to be a \"Promo\"",
              "type": {
                "text": "'promo'"
              },
              "kind": "field",
              "attribute": "variant",
              "reflects": true
            },
            {
              "name": "fullWidth",
              "description": "Change a promo with an image + body + footer to use the `full-width` style",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "full-width",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-card/rh-card.ts#L25"
          },
          "kind": "class",
          "tagName": "rh-card",
          "attributes": [
            {
              "name": "color-palette",
              "description": "Sets color palette, which affects the element's styles as well as descendants' color theme.\nOverrides parent color context.\nYour theme will influence these colors so check there first if you are seeing inconsistencies.\nSee [CSS Custom Properties](#css-custom-properties) for default values",
              "type": {
                "text": "ColorPalette"
              },
              "fieldName": "colorPalette"
            },
            {
              "name": "variant",
              "description": "Change the style of the card to be a \"Promo\"",
              "type": {
                "text": "'promo'"
              },
              "fieldName": "variant"
            },
            {
              "name": "full-width",
              "description": "Change a promo with an image + body + footer to use the `full-width` style",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "fullWidth"
            }
          ],
          "slots": [
            {
              "name": "header",
              "description": "If this slot is used, we expect a heading level tag (h1, h2, h3, h4, h5, h6).\nAn icon, svg, or use of the icon component are also valid in this region."
            },
            {
              "name": "footer",
              "description": "Use this slot for anything that you want to be stuck to the base of the card."
            },
            {
              "name": "image",
              "description": "Use this slot for the promo variant of the card. Images \u0026 CTA's are most often slotted here."
            },
            {
              "name": "",
              "description": "Any content that is not designated for the header or footer slot, will go to this slot."
            }
          ],
          "cssParts": [
            {
              "name": "header",
              "description": "The header for the card. Contains the header slot."
            },
            {
              "name": "footer",
              "description": "The footer for the card. Contains the footer slot."
            },
            {
              "name": "container",
              "description": "The container for the card. Contains the image, header, body, and footer."
            },
            {
              "name": "image",
              "description": "The image for the promo variant for the card. Contains the image slot."
            },
            {
              "name": "body",
              "description": "The body for the card. Contains the default slot."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-focus",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-focus-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-focus-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-active",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-active-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-active-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-visited-default",
              "description": "Responsive `interactive-primary-visited` (e.g. visited link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-visited-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-visited-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-visited-hover",
              "description": "Responsive `interactive-primary-visited` (e.g. visited link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-visited-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-visited-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-visited-focus",
              "description": "Responsive `interactive-primary-visited` (e.g. visited link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-visited-focus-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-visited-focus-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-visited-active",
              "description": "Responsive `interactive-primary-visited` (e.g. visited link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-visited-active-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-visited-active-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-card-header-background-on-light",
              "default": "transparent"
            },
            {
              "name": "--rh-card-header-background-on-dark",
              "default": "transparent"
            },
            {
              "name": "--rh-border-width-lg",
              "description": "3px border width: Example: Expanded Accordion panel",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Computed from the color context. Intended to be read for\ntheming purposes, rather than set in page css.\n\nResponsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-card-heading-font-weight",
              "description": "The font weight for headings in the header and body",
              "default": "var(--rh-font-weight-body-text-medium, 500)"
            },
            {
              "name": "--rh-font-size-heading-xs",
              "description": "h6 heading font size",
              "default": "1.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darker",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-card-heading-font-family",
              "description": "The font family for headings in the header and body",
              "default": "var(--rh-font-family-heading, RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif)"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xl",
              "description": "20px font size",
              "default": "1.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-medium",
              "description": "Medium font weight",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-line-height-heading",
              "description": "Line height for headings",
              "default": "1.3"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-2xl",
              "description": "24px font size",
              "default": "1.5rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-heading-sm",
              "description": "h5 heading font size",
              "default": "1.5rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-3xl",
              "description": "48px spacer",
              "default": "48px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-4xl",
              "description": "64px spacer",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-lg",
              "description": "18px font size",
              "default": "1.125rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-card-heading-font-size",
              "description": "The font size for headings in the header and body",
              "default": "var(--rh-font-size-heading-md, 1.75rem)"
            },
            {
              "name": "--rh-font-size-heading-md",
              "description": "h4 heading font size",
              "default": "1.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-7xl",
              "description": "128px spacer",
              "default": "128px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/card/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-card/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/card/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-card/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/card/demo/grid/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-card/demo/grid.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/card/demo/promo-full-width/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-card/demo/promo-full-width.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/card/demo/promo-narrow/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-card/demo/promo-narrow.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/card/demo/promo-standard/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-card/demo/promo-standard.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/card/demo/promo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-card/demo/promo.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/card/demo/sticky-pattern/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-card/demo/sticky-pattern.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/card/demo/title-pattern/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-card/demo/title-pattern.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/card/demo/variants/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-card/demo/variants.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/card/demo/video-pattern/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-card/demo/video-pattern.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-card",
          "declaration": {
            "name": "RhCard",
            "module": "rh-card/rh-card.js"
          }
        },
        {
          "kind": "js",
          "name": "RhCard",
          "declaration": {
            "name": "RhCard",
            "module": "rh-card/rh-card.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-chip/rh-chip-group.js",
      "declarations": [
        {
          "name": "RhChipGroup",
          "description": "Chip Group",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "size",
              "description": "Decreases the font-size of the chip's label",
              "type": {
                "text": "'sm'"
              },
              "kind": "field",
              "attribute": "size",
              "reflects": true
            },
            {
              "name": "accessibleLabel",
              "description": "The accessible label for the form control / `rh-chip-group`",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "accessible-label"
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "firstUpdated",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-chip/rh-chip-group.ts#L16"
          },
          "kind": "class",
          "tagName": "rh-chip-group",
          "attributes": [
            {
              "name": "size",
              "description": "Decreases the font-size of the chip's label",
              "type": {
                "text": "'sm'"
              },
              "fieldName": "size"
            },
            {
              "name": "accessible-label",
              "description": "The accessible label for the form control / `rh-chip-group`",
              "type": {
                "text": "string"
              },
              "fieldName": "accessibleLabel"
            }
          ],
          "slots": [
            {
              "name": "accessible-label",
              "description": "An accessible label for the chip group.\nContent for this slot is put into the `\u003clegend\u003e` element.\nAlso available as an attribute."
            },
            {
              "name": "",
              "description": "Place individual `rh-chips` inside `rh-chip-group`"
            },
            {
              "name": "clear-all",
              "description": "Customized text for the \"Clear all\" button"
            }
          ],
          "cssParts": [
            {
              "name": "legend"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-radius-pill",
              "description": "Pill border radius; Example: Label",
              "default": "64px"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xs",
              "description": "4px spacer",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-length-4xs",
              "description": "1px length token",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-md",
              "description": "8px length token",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-interactive",
              "description": "Responsive `border-interactive` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-interactive-on-light` on a themable container with a light color palette and `--rh-color-border-interactive-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-chip-group",
          "declaration": {
            "name": "RhChipGroup",
            "module": "rh-chip/rh-chip-group.js"
          }
        },
        {
          "kind": "js",
          "name": "RhChipGroup",
          "declaration": {
            "name": "RhChipGroup",
            "module": "rh-chip/rh-chip-group.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-chip/rh-chip.js",
      "declarations": [
        {
          "name": "ChipChangeEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "members": [
            {
              "name": "checked",
              "type": {
                "text": "boolean"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-chip/rh-chip.ts#L19"
          },
          "kind": "class"
        },
        {
          "name": "RhChip",
          "summary": "Filter information or indicate that a selection was made",
          "description": "A chip is used to filter information or indicate that a selection was made.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "checked",
              "description": "Whether the chip is checked.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "checked",
              "reflects": true
            },
            {
              "name": "disabled",
              "description": "Whether the chip is disabled.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "disabled",
              "reflects": true
            },
            {
              "name": "value",
              "description": "Set a custom string for the input's `value` attribute. Defaults to `on`.",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "value",
              "reflects": true
            },
            {
              "name": "checkedChanged",
              "kind": "method",
              "privacy": "private"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-chip/rh-chip.ts#L38"
          },
          "kind": "class",
          "tagName": "rh-chip",
          "attributes": [
            {
              "name": "checked",
              "description": "Whether the chip is checked.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "checked"
            },
            {
              "name": "disabled",
              "description": "Whether the chip is disabled.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "disabled"
            },
            {
              "name": "value",
              "description": "Set a custom string for the input's `value` attribute. Defaults to `on`.",
              "type": {
                "text": "string"
              },
              "fieldName": "value"
            }
          ],
          "events": [
            {
              "name": "chip-checked",
              "description": "when chip is checked/unchecked",
              "type": {
                "text": "ChipCheckedEvent"
              }
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "The label of the checkbox"
            }
          ],
          "cssParts": [
            {
              "name": "chip",
              "description": "The main chip container"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-border-radius-pill",
              "description": "Pill border radius; Example: Label",
              "default": "64px"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-xs",
              "description": "4px spacer",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-length-3xs",
              "description": "2px length token",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-md",
              "description": "8px length token",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-interactive",
              "description": "Responsive `border-interactive` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-interactive-on-light` on a themable container with a light color palette and `--rh-color-border-interactive-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-30",
              "description": "Subtle borders (light theme)",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-70",
              "description": "Alert - Info title text",
              "default": "#003366",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-10",
              "description": "Alert - Info background",
              "default": "#e0f0ff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-30",
              "description": "Inline link (dark theme)",
              "default": "#92c5f9",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-50",
              "description": "Label - Filled (Blue) accent color",
              "default": "#0066cc",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/chip/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-chip/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/chip/demo/attributes-and-states/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-chip/demo/attributes-and-states.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/chip/demo/chip-group/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-chip/demo/chip-group.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/chip/demo/clear-all/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-chip/demo/clear-all.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/chip/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-chip/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/chip/demo/custom-label/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-chip/demo/custom-label.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/chip/demo/events/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-chip/demo/events.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/chip/demo/form-control/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-chip/demo/form-control.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/chip/demo/size/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-chip/demo/size.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "ChipChangeEvent",
          "declaration": {
            "name": "ChipChangeEvent",
            "module": "rh-chip/rh-chip.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-chip",
          "declaration": {
            "name": "RhChip",
            "module": "rh-chip/rh-chip.js"
          }
        },
        {
          "kind": "js",
          "name": "RhChip",
          "declaration": {
            "name": "RhChip",
            "module": "rh-chip/rh-chip.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-code-block/rh-code-block.js",
      "declarations": [
        {
          "name": "RhCodeBlockCopyEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "members": [
            {
              "name": "content",
              "description": "Text content to copy",
              "type": {
                "text": "string"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/rh-code-block.ts#L37"
          },
          "kind": "class"
        },
        {
          "name": "RhCodeBlock",
          "summary": "Formats code strings within a container",
          "description": "A code block applies special formatting to sections of code.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "actionIcons",
              "default": "new Map([\\n    ['wrap', html`\\n      \u003csvg xmlns=\"http://www.w3.org/2000/svg\"\\n           role=\"presentation\"\\n           fill=\"currentColor\"\\n           viewBox=\"0 0 20 20\"\u003e\\n        \u003cpath d=\"M19 0c.313.039.781-.077 1 .057V20c-.313-.039-.781.077-1-.057V0ZM10.82 4.992C9.877 4.996 8.31 5.57 8.174 6c1.21.03 2.432-.073 3.635.08 2.181.383 3.677 2.796 3.066 4.922-.41 1.753-2.108 2.995-3.877 3.014L11 14H5.207l2.682-2.682-.707-.707L3.293 14.5l3.889 3.889.707-.707L5.207 15h5.736l.004-.008c1.444.005 2.896-.59 3.832-1.722 1.65-1.82 1.612-4.85-.08-6.63A5 5 0 0 0 11 5a1.948 1.948 0 0 0-.18-.008z\"/\u003e\\n        \u003cpath d=\"M4 5h7c-.039.313.077.781-.057 1H4V5ZM0 0c.313.039.781-.077 1 .057V20c-.313-.039-.781.077-1-.057V0Z\"/\u003e\\n      \u003c/svg\u003e\\n    `],\\n    ['wrap-active', html`\\n      \u003csvg xmlns=\"http://www.w3.org/2000/svg\"\\n           role=\"presentation\"\\n           fill=\"none\"\\n           viewBox=\"0 0 21 20\"\u003e\\n        \u003cpath fill=\"currentColor\" d=\"M12 13h1v7h-1zM12 0h1v7h-1z\"/\u003e\\n        \u003cpath stroke=\"currentColor\" d=\"M16.465 6.464 20 10l-3.535 3.536\"/\u003e\\n        \u003cpath fill=\"currentColor\" d=\"M3 9.5h17v1H3zM0 0h1v20H0z\"/\u003e\\n      \u003c/svg\u003e\\n    `],\\n    ['copy', html`\\n      \u003csvg xmlns=\"http://www.w3.org/2000/svg\"\\n           version=\"1.1\"\\n           viewBox=\"0 0 20 20\"\u003e\\n        \u003cpath fill=\"currentColor\" d=\"M12 0H2C.9 0 0 .9 0 2v10h1V2c0-.6.4-1 1-1h10V0z\"/\u003e\\n        \u003cpath fill=\"currentColor\" d=\"M18 20H8c-1.1 0-2-.9-2-2V8c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2v10c0 1.1-.9 2-2 2zM8 7c-.6 0-1 .4-1 1v10c0 .6.4 1 1 1h10c.6 0 1-.4 1-1V8c0-.6-.4-1-1-1H8z\"/\u003e\\n      \u003c/svg\u003e\\n    `],\\n  ])",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "actions",
              "description": "Space- or comma-separated list of code block action buttons to display, containing either 'copy', 'wrap', or both.\n'copy' adds a button that copies the text content to the clipboard. 'wrap' adds a button that toggles line wrap.\n\nTo override the default labels, e.g. for purposes of internationalization, use the\n`action-label-copy` and `action-label-wrap` slots. Each slot may receive two elements,\none for the action's default state (e.g. \"Copy to clipboard\"),\nand one for the actions alternative state, e.g. \"Copied!\".\nThe active-state element must have the attributes `hidden data-code-block-state=\"active\"`\n\n\u003cfigure\u003e\n\u003cfigcaption\u003ehtml```\n\u003crh-code-block actions=\"copy wrap\"\u003e\n\u003cspan slot=\"action-label-copy\"\u003eCopy to Clipboard\u003c/span\u003e\n\u003cspan slot=\"action-label-copy\" hidden data-code-block-state=\"active\"\u003eCopied!\u003c/span\u003e\n\u003cspan slot=\"action-label-copy\" hidden data-code-block-state=\"failed\"\u003eCopy failed!\u003c/span\u003e\n\u003cspan slot=\"action-label-wrap\"\u003eToggle word wrap\u003c/span\u003e\n\u003cspan slot=\"action-label-wrap\" hidden data-code-block-state=\"active\"\u003eToggle overflow\u003c/span\u003e\n\u003c/rh-code-block\u003e\u003c/figcaption\u003e\n\n```\n\u003c/figure\u003e",
              "type": {
                "text": "('copy' | 'wrap')[]"
              },
              "default": "[]",
              "kind": "field",
              "attribute": "actions",
              "reflects": true
            },
            {
              "name": "fromAttribute",
              "kind": "method"
            },
            {
              "name": "toAttribute",
              "kind": "method"
            },
            {
              "name": "highlighting",
              "description": "When set to \"client\", `\u003crh-code-block\u003e` will automatically highlight the source using Prism.js\nWhen set to \"Prerendered\", `\u003crh-code-block\u003e` will apply supported RHDS styles to children with\nprismjs classnames in the element's root.",
              "type": {
                "text": "'client' | 'prerendered'"
              },
              "kind": "field",
              "attribute": "highlighting"
            },
            {
              "name": "language",
              "description": "When set along with `highlighting=\"client\"`, this grammar will be used to highlight source code",
              "type": {
                "text": "| 'html'\n    | 'css'\n    | 'javascript'\n    | 'typescript'\n    | 'bash'\n    | 'ruby'\n    | 'yaml'\n    | 'json'"
              },
              "kind": "field",
              "attribute": "language"
            },
            {
              "name": "compact",
              "description": "When set, the code block displays with compact spacing",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "compact",
              "reflects": true
            },
            {
              "name": "dedent",
              "description": "When set, the code block source code will be dedented",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "dedent",
              "reflects": true
            },
            {
              "name": "resizable",
              "description": "When set, the code block is resizable",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "resizable",
              "reflects": true
            },
            {
              "name": "fullHeight",
              "description": "When set, the code block occupies it's full height, without scrolling",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "full-height",
              "reflects": true
            },
            {
              "name": "lineNumbers",
              "description": "When set to `hidden`, the code block's line numbers are hidden",
              "type": {
                "text": "'hidden'"
              },
              "kind": "field",
              "attribute": "line-numbers",
              "reflects": true
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "firstUpdated",
              "kind": "method",
              "privacy": "protected"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/rh-code-block.ts#L58"
          },
          "kind": "class",
          "tagName": "rh-code-block",
          "attributes": [
            {
              "name": "actions",
              "description": "Space- or comma-separated list of code block action buttons to display, containing either 'copy', 'wrap', or both.\n'copy' adds a button that copies the text content to the clipboard. 'wrap' adds a button that toggles line wrap.\n\nTo override the default labels, e.g. for purposes of internationalization, use the\n`action-label-copy` and `action-label-wrap` slots. Each slot may receive two elements,\none for the action's default state (e.g. \"Copy to clipboard\"),\nand one for the actions alternative state, e.g. \"Copied!\".\nThe active-state element must have the attributes `hidden data-code-block-state=\"active\"`\n\n\u003cfigure\u003e\n\u003cfigcaption\u003ehtml```\n\u003crh-code-block actions=\"copy wrap\"\u003e\n\u003cspan slot=\"action-label-copy\"\u003eCopy to Clipboard\u003c/span\u003e\n\u003cspan slot=\"action-label-copy\" hidden data-code-block-state=\"active\"\u003eCopied!\u003c/span\u003e\n\u003cspan slot=\"action-label-copy\" hidden data-code-block-state=\"failed\"\u003eCopy failed!\u003c/span\u003e\n\u003cspan slot=\"action-label-wrap\"\u003eToggle word wrap\u003c/span\u003e\n\u003cspan slot=\"action-label-wrap\" hidden data-code-block-state=\"active\"\u003eToggle overflow\u003c/span\u003e\n\u003c/rh-code-block\u003e\u003c/figcaption\u003e\n\n```\n\u003c/figure\u003e",
              "type": {
                "text": "('copy' | 'wrap')[]"
              },
              "default": "[]",
              "fieldName": "actions"
            },
            {
              "name": "highlighting",
              "description": "When set to \"client\", `\u003crh-code-block\u003e` will automatically highlight the source using Prism.js\nWhen set to \"Prerendered\", `\u003crh-code-block\u003e` will apply supported RHDS styles to children with\nprismjs classnames in the element's root.",
              "type": {
                "text": "'client' | 'prerendered'"
              },
              "fieldName": "highlighting"
            },
            {
              "name": "language",
              "description": "When set along with `highlighting=\"client\"`, this grammar will be used to highlight source code",
              "type": {
                "text": "| 'html'\n    | 'css'\n    | 'javascript'\n    | 'typescript'\n    | 'bash'\n    | 'ruby'\n    | 'yaml'\n    | 'json'"
              },
              "fieldName": "language"
            },
            {
              "name": "compact",
              "description": "When set, the code block displays with compact spacing",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "compact"
            },
            {
              "name": "dedent",
              "description": "When set, the code block source code will be dedented",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "dedent"
            },
            {
              "name": "resizable",
              "description": "When set, the code block is resizable",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "resizable"
            },
            {
              "name": "full-height",
              "description": "When set, the code block occupies it's full height, without scrolling",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "fullHeight"
            },
            {
              "name": "line-numbers",
              "description": "When set to `hidden`, the code block's line numbers are hidden",
              "type": {
                "text": "'hidden'"
              },
              "fieldName": "lineNumbers"
            }
          ],
          "events": [
            {
              "name": "copy",
              "description": "fired when the user requests to copy the code block text.\nModify the `event.content` field to change the copied text\n(e.g. to remove a prompt from a shell command)",
              "type": {
                "text": "RhCodeBlockCopyEvent"
              }
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "A non-executable script tag containing the sample content. JavaScript\nsamples should use the type `text/sample-javascript`. HTML samples\ncontaining script tags must escape the closing `\u003c/script\u003e` tag. Can\nalso be a `\u003cpre\u003e` tag."
            },
            {
              "name": "action-label-copy",
              "description": "Tooltip content for the copy action button"
            },
            {
              "name": "action-label-wrap",
              "description": "Tooltip content for the wrap action button"
            },
            {
              "name": "show-more",
              "description": "text content for the expandable toggle button when the code block is collapsed."
            },
            {
              "name": "show-less",
              "description": "text content for the expandable toggle button when the code block is expanded."
            },
            {
              "name": "legend",
              "description": "`\u003cdl\u003e` element containing rh-badges in the `\u003cdt\u003e` and legend text in the `\u003cdd\u003e` elements"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-code-block-callout-size",
              "default": "var(--rh-size-icon-02, 24px)"
            },
            {
              "name": "--rh-length-3xl",
              "description": "48px length token",
              "default": "48px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-size-icon-02",
              "description": "24px icon box",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-blue-10",
              "description": "Alert - Info background",
              "default": "#e0f0ff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-20",
              "description": "Secondary surface (light theme)",
              "default": "#e0e0e0",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-95",
              "description": "Primary surface (dark theme) or primary text (light theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-10",
              "default": "#fce3e3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-purple-50",
              "default": "#5e40be",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-teal-20",
              "default": "#b9e5e5",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-40",
              "description": "Light brand red",
              "default": "#f56e6e",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-teal-60",
              "default": "#147878",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-60",
              "default": "#96640f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-40",
              "description": "Alert - Info accent",
              "default": "#4394e5",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-60",
              "description": "Inline link hover (light theme)",
              "default": "#004d99",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-orange-40",
              "description": "Label - Filled (Orange) accent color",
              "default": "#f5921b",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-60",
              "description": "Dark brand red",
              "default": "#a60000",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-40",
              "description": "Alert - Warning accent",
              "default": "#dca614",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-purple-30",
              "default": "#b6a6e9",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-orange-60",
              "default": "#9e4a06",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-green-40",
              "default": "#87bb62",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-code-block-border-block-start-width",
              "default": "var(--rh-border-width-sm, 1px)"
            },
            {
              "name": "--rh-size-icon-06",
              "description": "64px icon box",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-code",
              "description": "Code font family",
              "default": "RedHatMono, 'Red Hat Mono', 'Courier New', Courier, monospace",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-weight-code-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-line-height-code",
              "description": "Line height for code",
              "default": "1.5"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-color-icon-secondary",
              "description": "Responsive `icon-secondary` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-icon-secondary-on-light` on a themable container with a light color palette and `--rh-color-icon-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-sm",
              "description": "6px spacer",
              "default": "6px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-code-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-3xl",
              "description": "48px spacer",
              "default": "48px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-4xl",
              "description": "64px spacer",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/actions-i18n/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/actions-i18n.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/actions/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/actions.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/below-the-fold/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/below-the-fold.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/callout-badges/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/callout-badges.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/callout-prerendered/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/callout-prerendered.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/client-side-highlighting/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/client-side-highlighting.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/copy-cancel/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/copy-cancel.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/copy-modify/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/copy-modify.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/hide-line-numbers/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/hide-line-numbers.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/prerendered-prism-highlighting/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/prerendered-prism-highlighting.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/resizable/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/resizable.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/sizes/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/sizes.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/code-block/demo/thousands/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-code-block/demo/thousands.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "RhCodeBlockCopyEvent",
          "declaration": {
            "name": "RhCodeBlockCopyEvent",
            "module": "rh-code-block/rh-code-block.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-code-block",
          "declaration": {
            "name": "RhCodeBlock",
            "module": "rh-code-block/rh-code-block.js"
          }
        },
        {
          "kind": "js",
          "name": "RhCodeBlock",
          "declaration": {
            "name": "RhCodeBlock",
            "module": "rh-code-block/rh-code-block.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-cta/rh-cta.js",
      "declarations": [
        {
          "name": "RhCta",
          "summary": "A call to action is styled text representing a link.",
          "description": "A call to action is styled text representing a link.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "variant",
              "description": "Indicates the importance of this call-to-action in the context of the page.\nWill also influence how the call-to-action is styled.\n- **Primary**: Use for the primary or most important link. This variant is the highest in\nhierarchy and can also be used to play a video in a Modal or large container.\n- **Secondary**: Use for secondary or general links. This variant is lower in hierarchy than\nthe Primary variant and can be used multiple times in the same container or layout.\n- **Brick**: Use to group links together. Only the Brick variant can stretch to fit a\ncontainer or grid, otherwise the text label padding in other variants stays the same.\n- Default (no variant): Use for tertiary or the least important links. This variant is the\nlowest in hierarchy and can be used multiple times in the same container or layout.",
              "type": {
                "text": "'primary' | 'secondary' | 'brick'"
              },
              "kind": "field",
              "attribute": "variant",
              "reflects": true
            },
            {
              "name": "href",
              "description": "When set, overrides the default slot. Use *instead* of a slotted anchor tag",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "href",
              "reflects": true
            },
            {
              "name": "download",
              "description": "when `href` is set, the link's `download` attribute",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "download"
            },
            {
              "name": "referrerpolicy",
              "description": "when `href` is set, the link's `referrerpolicy` attribute",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "referrerpolicy"
            },
            {
              "name": "rel",
              "description": "when `href` is set, the link's `rel` attribute",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "rel"
            },
            {
              "name": "target",
              "description": "when `href` is set, the link's `target` attribute",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "target"
            },
            {
              "name": "icon",
              "description": "Icon name",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "kind": "field",
              "attribute": "icon",
              "reflects": true
            },
            {
              "name": "iconSet",
              "description": "Icon set",
              "type": {
                "text": "IconSetName"
              },
              "default": "'ui'",
              "kind": "field",
              "attribute": "icon-set"
            },
            {
              "name": "scheduleUpdate",
              "kind": "method"
            },
            {
              "name": "firstUpdated",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-cta/rh-cta.ts#L28"
          },
          "kind": "class",
          "tagName": "rh-cta",
          "attributes": [
            {
              "name": "variant",
              "description": "Indicates the importance of this call-to-action in the context of the page.\nWill also influence how the call-to-action is styled.\n- **Primary**: Use for the primary or most important link. This variant is the highest in\nhierarchy and can also be used to play a video in a Modal or large container.\n- **Secondary**: Use for secondary or general links. This variant is lower in hierarchy than\nthe Primary variant and can be used multiple times in the same container or layout.\n- **Brick**: Use to group links together. Only the Brick variant can stretch to fit a\ncontainer or grid, otherwise the text label padding in other variants stays the same.\n- Default (no variant): Use for tertiary or the least important links. This variant is the\nlowest in hierarchy and can be used multiple times in the same container or layout.",
              "type": {
                "text": "'primary' | 'secondary' | 'brick'"
              },
              "fieldName": "variant"
            },
            {
              "name": "href",
              "description": "When set, overrides the default slot. Use *instead* of a slotted anchor tag",
              "type": {
                "text": "string"
              },
              "fieldName": "href"
            },
            {
              "name": "download",
              "description": "when `href` is set, the link's `download` attribute",
              "type": {
                "text": "string"
              },
              "fieldName": "download"
            },
            {
              "name": "referrerpolicy",
              "description": "when `href` is set, the link's `referrerpolicy` attribute",
              "type": {
                "text": "string"
              },
              "fieldName": "referrerpolicy"
            },
            {
              "name": "rel",
              "description": "when `href` is set, the link's `rel` attribute",
              "type": {
                "text": "string"
              },
              "fieldName": "rel"
            },
            {
              "name": "target",
              "description": "when `href` is set, the link's `target` attribute",
              "type": {
                "text": "string"
              },
              "fieldName": "target"
            },
            {
              "name": "icon",
              "description": "Icon name",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "fieldName": "icon"
            },
            {
              "name": "icon-set",
              "description": "Icon set",
              "type": {
                "text": "IconSetName"
              },
              "default": "'ui'",
              "fieldName": "iconSet"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "The default slot contains the link text when the `href`\nattribute is set. In case there is no href attribute, an anchor\ntag (`\u003ca href=\"...\"\u003e`) should be the first child inside `rh-cta`\nelement. Less preferred but allowed for specific use-cases\ninclude: `\u003cbutton\u003e` (note however that the `button` tag is not\nsupported for the default CTA styles)."
            }
          ],
          "cssParts": [
            {
              "name": "container",
              "description": "container element for slotted CTA"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-font-size-body-text-lg",
              "description": "18px font size",
              "default": "1.125rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-icon-size"
            },
            {
              "name": "--rh-animation-speed",
              "default": "0.3s",
              "syntax": "\u003ctime\u003e"
            },
            {
              "name": "--rh-animation-timing",
              "default": "cubic-bezier(0.465, 0.183, 0.153, 0.946)",
              "syntax": "\u003ceasing-function\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-cta-focus-container-outline-color",
              "default": "var(--rh-cta-focus-outline-color)"
            },
            {
              "name": "--rh-cta-focus-outline-color"
            },
            {
              "name": "--rh-cta-hover-text-underline-offset"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-cta-font-size-priority",
              "default": "var(--rh-font-size-body-text-md, 1rem)"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-cta-focus-container-background-color",
              "description": "Sets the cta container background color on focus",
              "default": "#73bcf740"
            },
            {
              "name": "--rh-cta-active-container-background-color",
              "description": "Sets the cta container background color on active.\nApplicable only for default variant",
              "default": "#73bcf740"
            },
            {
              "name": "--rh-color-brand-red",
              "description": "Responsive `brand-red` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-brand-red-on-light` on a themable container with a light color palette and `--rh-color-brand-red-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-brand-red-dark",
              "description": "Dark brand red/Brand red hover",
              "default": "#a60000",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-dark",
              "description": "Primary text color for dark theme",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-light",
              "description": "Primary text color for light theme",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-cta-focus-background-color",
              "description": "Sets the cta background color on focus",
              "default": "var(--rh-color-surface-dark, #383838)"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-cta-active-color",
              "description": "Sets the cta color on active. Applicable only for secondary variant",
              "default": "var(--rh-color-text-primary)"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-strong",
              "description": "Responsive `border-strong` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-border-strong-on-light` on a themable container with a light color palette and `--rh-color-border-strong-on-dark` on a themable container with a dark color palette",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-light",
              "description": "Secondary surface (light theme)",
              "default": "#e0e0e0",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-strong-on-light",
              "description": "Strong border color (light theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-cta-background-color",
              "description": "Sets the cta background color",
              "default": "transparent"
            },
            {
              "name": "--rh-cta-border-color",
              "description": "Sets the cta border color",
              "default": "var(--rh-color-border-subtle)"
            },
            {
              "name": "--rh-cta-color",
              "description": "Sets the cta color",
              "default": "var(--rh-color-interactive-primary-default)"
            },
            {
              "name": "--rh-cta-hover-background-color",
              "description": "Sets the cta background color on hover",
              "default": "var(--rh-color-surface-darker, #1f1f1f)"
            },
            {
              "name": "--rh-cta-hover-border-color",
              "description": "Sets the cta boder color on hover",
              "default": "var(--rh-color-border-subtle)"
            },
            {
              "name": "--rh-cta-hover-color",
              "description": "Sets the cta color on hover",
              "default": "var(--rh-color-interactive-primary-hover)"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-cta-hover-text-decoration",
              "description": "Sets the cta text decoration on hover",
              "default": "underline"
            },
            {
              "name": "--rh-cta-focus-color",
              "description": "Sets the cta color on focus",
              "default": "var(--rh-color-interactive-primary-default)"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-cta-focus-border-color",
              "description": "Sets the cta border color on focus",
              "default": "var(--rh-color-border-subtle)"
            },
            {
              "name": "--rh-cta-focus-inner-border-color",
              "description": "Sets the cta inner border color on focus",
              "default": "var(--rh-color-border-subtle)"
            },
            {
              "name": "--rh-cta-focus-text-decoration",
              "description": "Sets the cta text decoration on focus",
              "default": "none"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-cta-active-background-color",
              "default": "var(--rh-color-surface-darker, #1f1f1f)"
            },
            {
              "name": "--rh-color-surface-darker",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-cta-active-inner-border-color",
              "description": "Sets the cta inner border color on active",
              "default": "var(--rh-color-border-subtle)"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-cta-active-text-decoration",
              "description": "Sets the cta text decoration on active",
              "default": "underline"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/call-to-action/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-cta/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/call-to-action/demo/analytics/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-cta/demo/analytics.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/call-to-action/demo/brick/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-cta/demo/brick.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/call-to-action/demo/button/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-cta/demo/button.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/call-to-action/demo/color-context-with-lightdom-css/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-cta/demo/color-context-with-lightdom-css.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/call-to-action/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-cta/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/call-to-action/demo/href-attribute/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-cta/demo/href-attribute.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/call-to-action/demo/no-cta-javascript/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-cta/demo/no-cta-javascript.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/call-to-action/demo/resizing/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-cta/demo/resizing.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/call-to-action/demo/right-to-left/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-cta/demo/right-to-left.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/call-to-action/demo/variants/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-cta/demo/variants.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-cta",
          "declaration": {
            "name": "RhCta",
            "module": "rh-cta/rh-cta.js"
          }
        },
        {
          "kind": "js",
          "name": "RhCta",
          "declaration": {
            "name": "RhCta",
            "module": "rh-cta/rh-cta.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-dialog/rh-dialog.js",
      "declarations": [
        {
          "name": "DialogCancelEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-dialog/rh-dialog.ts#L20"
          },
          "kind": "class"
        },
        {
          "name": "DialogCloseEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-dialog/rh-dialog.ts#L26"
          },
          "kind": "class"
        },
        {
          "name": "DialogOpenEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "members": [
            {
              "name": "trigger",
              "description": "The trigger element which triggered the dialog to open",
              "type": {
                "text": "HTMLElement | null"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-dialog/rh-dialog.ts#L32"
          },
          "kind": "class"
        },
        {
          "name": "RhDialog",
          "summary": "Communicates information requiring user input or action",
          "description": "A dialog displays important information to users without requiring them to navigate away from the page.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "variant",
              "description": "The `variant` controls the width of the dialog.\nThere are three options: `small`, `medium` and `large`. The default is `large`.",
              "type": {
                "text": "'small' | 'medium' | 'large'"
              },
              "kind": "field",
              "attribute": "variant",
              "reflects": true
            },
            {
              "name": "position",
              "description": "`position=\"top\"` aligns the dialog with the top of the page",
              "type": {
                "text": "'top'"
              },
              "kind": "field",
              "attribute": "position",
              "reflects": true
            },
            {
              "name": "accessibleLabel",
              "description": "Use `accessible-label=\"My custom label\"` to specify the dialog's accessible name.\nDefaults to the name of the dialog trigger if no attribute is set and no headings exist in the modal.\nSee Dialog's Accessibility page for more info.",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "accessible-label"
            },
            {
              "name": "open",
              "description": "`open` / `open=\"open\"` declaratively opens the dialog",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "open",
              "reflects": true
            },
            {
              "name": "trigger",
              "description": "Optional ID of the trigger element",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "trigger"
            },
            {
              "name": "type",
              "description": "Use `type=\"video\"` to embed a video player into a dialog.",
              "type": {
                "text": "'video'"
              },
              "kind": "field",
              "attribute": "type",
              "reflects": true
            },
            {
              "name": "returnValue",
              "type": {
                "text": "string"
              },
              "default": "''",
              "kind": "field"
            },
            {
              "name": "_init",
              "kind": "method",
              "privacy": "protected"
            },
            {
              "parameters": [
                {
                  "name": "oldValue",
                  "type": {
                    "text": "boolean"
                  }
                },
                {
                  "name": "open",
                  "type": {
                    "text": "boolean"
                  }
                }
              ],
              "name": "_openChanged",
              "kind": "method",
              "privacy": "protected"
            },
            {
              "name": "_triggerChanged",
              "kind": "method",
              "privacy": "protected"
            },
            {
              "parameters": [
                {
                  "name": "event",
                  "type": {
                    "text": "MouseEvent"
                  }
                }
              ],
              "name": "onTriggerClick",
              "kind": "method",
              "privacy": "private"
            },
            {
              "parameters": [
                {
                  "name": "returnValue",
                  "type": {
                    "text": "string"
                  }
                }
              ],
              "name": "cancel",
              "kind": "method"
            },
            {
              "parameters": [
                {
                  "name": "element",
                  "type": {
                    "text": "HTMLElement"
                  }
                }
              ],
              "name": "setTrigger",
              "kind": "method"
            },
            {
              "name": "toggle",
              "description": "Manually toggles the dialog.\n```js\ndialog.toggle();\n```",
              "kind": "method"
            },
            {
              "name": "show",
              "description": "Manually opens the dialog.\n```js\ndialog.show();\n```",
              "kind": "method"
            },
            {
              "name": "showModal",
              "kind": "method"
            },
            {
              "parameters": [
                {
                  "name": "returnValue",
                  "type": {
                    "text": "string"
                  }
                }
              ],
              "name": "close",
              "description": "Manually closes the dialog.\n\n```js\ndialog.close();\n```",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-dialog/rh-dialog.ts#L59"
          },
          "kind": "class",
          "tagName": "rh-dialog",
          "attributes": [
            {
              "name": "variant",
              "description": "The `variant` controls the width of the dialog.\nThere are three options: `small`, `medium` and `large`. The default is `large`.",
              "type": {
                "text": "'small' | 'medium' | 'large'"
              },
              "fieldName": "variant"
            },
            {
              "name": "position",
              "description": "`position=\"top\"` aligns the dialog with the top of the page",
              "type": {
                "text": "'top'"
              },
              "fieldName": "position"
            },
            {
              "name": "accessible-label",
              "description": "Use `accessible-label=\"My custom label\"` to specify the dialog's accessible name.\nDefaults to the name of the dialog trigger if no attribute is set and no headings exist in the modal.\nSee Dialog's Accessibility page for more info.",
              "type": {
                "text": "string"
              },
              "fieldName": "accessibleLabel"
            },
            {
              "name": "open",
              "description": "`open` / `open=\"open\"` declaratively opens the dialog",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "open"
            },
            {
              "name": "trigger",
              "description": "Optional ID of the trigger element",
              "type": {
                "text": "string"
              },
              "fieldName": "trigger"
            },
            {
              "name": "type",
              "description": "Use `type=\"video\"` to embed a video player into a dialog.",
              "type": {
                "text": "'video'"
              },
              "fieldName": "type"
            }
          ],
          "events": [
            {
              "name": "open",
              "description": "Fires when a user clicks on the trigger or manually opens a dialog.",
              "type": {
                "text": "DialogOpenEvent"
              }
            },
            {
              "name": "close",
              "description": "Fires when either a user clicks on either the close button or manually closes a dialog.",
              "type": {
                "text": "DialogCloseEvent"
              }
            },
            {
              "name": "cancel",
              "description": "Fires when a user clicks outside the dialog or hits ESC on their keyboard.",
              "type": {
                "text": "DialogCancelEvent"
              }
            }
          ],
          "slots": [
            {
              "name": "header",
              "description": "The header is an optional slot that appears at the top of the dialog window. It should be a header tag (h2-h6)."
            },
            {
              "name": "description"
            },
            {
              "name": "",
              "description": "The default slot can contain any type of content. When the header is not present this unnamed slot appear at the top of the dialog window (to the left of the close button). Otherwise it will appear beneath the header."
            },
            {
              "name": "footer",
              "description": "Optional footer content. Good place to put action buttons."
            }
          ],
          "cssParts": [
            {
              "name": "dialog",
              "description": "The dialog element"
            },
            {
              "name": "close-button",
              "description": "The dialog's close button"
            },
            {
              "name": "content",
              "description": "The container for the dialog content"
            },
            {
              "name": "header",
              "description": "The container for the optional dialog header"
            },
            {
              "name": "description",
              "description": "The container for the optional dialog description in the header"
            },
            {
              "name": "body"
            },
            {
              "name": "footer",
              "description": "Actions footer container"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-surface-darker",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-box-shadow-xl",
              "description": "Extra large box shadow",
              "default": "0 8px 24px 3px rgba(21, 21, 21, 0.35)",
              "syntax": "\u003cshadow\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-3xl",
              "description": "48px spacer",
              "default": "48px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-heading-sm",
              "description": "h5 heading font size",
              "default": "1.5rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-icon-secondary",
              "description": "Responsive `icon-secondary` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-icon-secondary-on-light` on a themable container with a light color palette and `--rh-color-icon-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-length-xl",
              "description": "24px length token",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-gray-90",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-opacity-60",
              "description": "60% opacity",
              "default": "60%"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-sm",
              "description": "6px spacer",
              "default": "6px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-dialog-close-button-color",
              "description": "Sets the dialog close button color.",
              "default": "var(--rh-color-surface-lightest, #ffffff)"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-dialog-video-aspect-ratio",
              "default": "16/9"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/dialog/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-dialog/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/dialog/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-dialog/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/dialog/demo/events/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-dialog/demo/events.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/dialog/demo/form/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-dialog/demo/form.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/dialog/demo/lots-of-content/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-dialog/demo/lots-of-content.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/dialog/demo/no-header-content/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-dialog/demo/no-header-content.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/dialog/demo/no-headings/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-dialog/demo/no-headings.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/dialog/demo/video-modal/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-dialog/demo/video-modal.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "DialogCancelEvent",
          "declaration": {
            "name": "DialogCancelEvent",
            "module": "rh-dialog/rh-dialog.js"
          }
        },
        {
          "kind": "js",
          "name": "DialogCloseEvent",
          "declaration": {
            "name": "DialogCloseEvent",
            "module": "rh-dialog/rh-dialog.js"
          }
        },
        {
          "kind": "js",
          "name": "DialogOpenEvent",
          "declaration": {
            "name": "DialogOpenEvent",
            "module": "rh-dialog/rh-dialog.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-dialog",
          "declaration": {
            "name": "RhDialog",
            "module": "rh-dialog/rh-dialog.js"
          }
        },
        {
          "kind": "js",
          "name": "RhDialog",
          "declaration": {
            "name": "RhDialog",
            "module": "rh-dialog/rh-dialog.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-disclosure/rh-disclosure.js",
      "declarations": [
        {
          "name": "DisclosureToggleEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-disclosure/rh-disclosure.ts#L17"
          },
          "kind": "class"
        },
        {
          "name": "RhDisclosure",
          "summary": "A disclosure toggles the visibility of content when triggered",
          "description": "A disclosure toggles the visibility of content when triggered.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "preventEscElements",
              "default": "[\\n    'input:not([type=\"hidden\"]):not([type=\"radio\"])',\\n\\n    // Elements that need the :disabled selector:\\n    ...[\\n      'input[type=\"radio\"]',\\n      'select',\\n      'textarea',\\n      'rh-audio-player',\\n      'rh-dialog',\\n    ].map(selector =\u003e `${selector}:not([inert]):not([inert] *):not([tabindex^='-']):not(:disabled)`),\\n\\n    // Elements that don't need the :disabled selector:\\n    ...[\\n      'iframe',\\n      'audio[controls]',\\n      'video[controls]',\\n      '[contenteditable]',\\n    ].map(selector =\u003e `${selector}:not([inert]):not([inert] *):not([tabindex^='-'])`),\\n  ].join(',')",
              "readonly": true,
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "colorPalette",
              "description": "Set the colorPalette of the disclosure. Overrides parent context. Possible values are:\n- `lightest` (default)\n- `lighter`\n- `light`\n- `dark`\n- `darker`\n- `darkest`",
              "type": {
                "text": "ColorPalette"
              },
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            },
            {
              "name": "open",
              "description": "Sets the disclosure to be in its open (expanded) state",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "open",
              "reflects": true
            },
            {
              "name": "variant",
              "description": "Borderless: Removes the outer and left border from the disclosure.\nThe background is `surface-light`/`surface-dark` when expanded.\nCompact: decreases disclosure padding.",
              "type": {
                "text": "'borderless' | 'compact'"
              },
              "kind": "field",
              "attribute": "variant",
              "reflects": true
            },
            {
              "name": "summary",
              "description": "Sets the disclosure title via an attribute",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "summary",
              "reflects": true
            },
            {
              "name": "_openChanged",
              "kind": "method",
              "privacy": "protected"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-disclosure/rh-disclosure.ts#L35"
          },
          "kind": "class",
          "tagName": "rh-disclosure",
          "attributes": [
            {
              "name": "color-palette",
              "description": "Set the colorPalette of the disclosure. Overrides parent context. Possible values are:\n- `lightest` (default)\n- `lighter`\n- `light`\n- `dark`\n- `darker`\n- `darkest`",
              "type": {
                "text": "ColorPalette"
              },
              "fieldName": "colorPalette"
            },
            {
              "name": "open",
              "description": "Sets the disclosure to be in its open (expanded) state",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "open"
            },
            {
              "name": "variant",
              "description": "Borderless: Removes the outer and left border from the disclosure.\nThe background is `surface-light`/`surface-dark` when expanded.\nCompact: decreases disclosure padding.",
              "type": {
                "text": "'borderless' | 'compact'"
              },
              "fieldName": "variant"
            },
            {
              "name": "summary",
              "description": "Sets the disclosure title via an attribute",
              "type": {
                "text": "string"
              },
              "fieldName": "summary"
            }
          ],
          "events": [
            {
              "name": "toggle",
              "description": "Fires when a user opens or closes a disclosure.",
              "type": {
                "text": "DisclosureToggleEvent"
              }
            }
          ],
          "slots": [
            {
              "name": "summary",
              "description": "The title of the disclosure"
            },
            {
              "name": "",
              "description": "Place the content you want to disclose in the default slot. This content is hidden by default."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "default": "1px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-medium",
              "description": "Medium font weight",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-box-shadow-sm",
              "description": "Small box shadow",
              "default": "0 2px 4px 0 rgba(21, 21, 21, 0.2)",
              "syntax": "\u003cshadow\u003e"
            },
            {
              "name": "--rh-color-brand-red",
              "description": "Responsive `brand-red` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-brand-red-on-light` on a themable container with a light color palette and `--rh-color-brand-red-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darker",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-length-3xs",
              "description": "2px length token",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-color-surface-light",
              "description": "Secondary surface (light theme)",
              "default": "#e0e0e0",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/disclosure/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-disclosure/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/disclosure/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-disclosure/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/disclosure/demo/events/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-disclosure/demo/events.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/disclosure/demo/nested-disclosures/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-disclosure/demo/nested-disclosures.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/disclosure/demo/nested-jump-links/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-disclosure/demo/nested-jump-links.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/disclosure/demo/slotted-summary/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-disclosure/demo/slotted-summary.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/disclosure/demo/variants/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-disclosure/demo/variants.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "DisclosureToggleEvent",
          "declaration": {
            "name": "DisclosureToggleEvent",
            "module": "rh-disclosure/rh-disclosure.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-disclosure",
          "declaration": {
            "name": "RhDisclosure",
            "module": "rh-disclosure/rh-disclosure.js"
          }
        },
        {
          "kind": "js",
          "name": "RhDisclosure",
          "declaration": {
            "name": "RhDisclosure",
            "module": "rh-disclosure/rh-disclosure.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-footer/rh-footer-block.js",
      "declarations": [
        {
          "name": "RhFooterBlock",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-footer/rh-footer-block.ts#L7"
          },
          "kind": "class",
          "tagName": "rh-footer-block",
          "slots": [
            {
              "name": "header"
            },
            {
              "name": ""
            }
          ],
          "cssParts": [
            {
              "name": "base"
            },
            {
              "name": "header"
            },
            {
              "name": "content"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-heading-medium",
              "description": "Medium font weight for headings",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-dark",
              "description": "Primary text color for dark theme",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-secondary-on-dark",
              "description": "Secondary text color for dark theme",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-footer-block",
          "declaration": {
            "name": "RhFooterBlock",
            "module": "rh-footer/rh-footer-block.js"
          }
        },
        {
          "kind": "js",
          "name": "RhFooterBlock",
          "declaration": {
            "name": "RhFooterBlock",
            "module": "rh-footer/rh-footer-block.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-footer/rh-footer-copyright.js",
      "declarations": [
        {
          "name": "RhFooterCopyright",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-footer/rh-footer-copyright.ts#L9"
          },
          "kind": "class",
          "tagName": "rh-footer-copyright",
          "slots": [
            {
              "name": ""
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-footer-copyright",
          "declaration": {
            "name": "RhFooterCopyright",
            "module": "rh-footer/rh-footer-copyright.js"
          }
        },
        {
          "kind": "js",
          "name": "RhFooterCopyright",
          "declaration": {
            "name": "RhFooterCopyright",
            "module": "rh-footer/rh-footer-copyright.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-footer/rh-footer-links.js",
      "declarations": [
        {
          "name": "RhFooterLinks",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "headerHidden",
              "description": "Cause the header slot to be visually hidden.\nSetting this to true will not affect `aria-labelledby`.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "header-hidden",
              "reflects": true
            },
            {
              "name": "slots",
              "default": "new SlotController(this, 'header')",
              "kind": "field",
              "privacy": "protected"
            },
            {
              "name": "updateAccessibility",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-footer/rh-footer-links.ts#L10"
          },
          "kind": "class",
          "tagName": "rh-footer-links",
          "attributes": [
            {
              "name": "header-hidden",
              "description": "Cause the header slot to be visually hidden.\nSetting this to true will not affect `aria-labelledby`.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "headerHidden"
            }
          ],
          "slots": [
            {
              "name": "header"
            },
            {
              "name": "panel"
            },
            {
              "name": ""
            }
          ],
          "cssParts": [
            {
              "name": "header"
            },
            {
              "name": "default"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-footer-links",
          "declaration": {
            "name": "RhFooterLinks",
            "module": "rh-footer/rh-footer-links.js"
          }
        },
        {
          "kind": "js",
          "name": "RhFooterLinks",
          "declaration": {
            "name": "RhFooterLinks",
            "module": "rh-footer/rh-footer-links.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-footer/rh-footer-social-link.js",
      "declarations": [
        {
          "name": "RhFooterSocialLink",
          "description": "Social media links for Red Hat Footer",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "icon",
              "description": "Icon for this social link e.g. `'facebook'`",
              "type": {
                "text": "IconNameFor\u003c'social'\u003e"
              },
              "kind": "field",
              "attribute": "icon"
            },
            {
              "name": "href",
              "description": "Social link address",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "href"
            },
            {
              "name": "accessibleLabel",
              "description": "Textual label for the social link e.g. \"Instagram\"",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "accessible-label"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-footer/rh-footer-social-link.ts#L15"
          },
          "kind": "class",
          "tagName": "rh-footer-social-link",
          "attributes": [
            {
              "name": "icon",
              "description": "Icon for this social link e.g. `'facebook'`",
              "type": {
                "text": "IconNameFor\u003c'social'\u003e"
              },
              "fieldName": "icon"
            },
            {
              "name": "href",
              "description": "Social link address",
              "type": {
                "text": "string"
              },
              "fieldName": "href"
            },
            {
              "name": "accessible-label",
              "description": "Textual label for the social link e.g. \"Instagram\"",
              "type": {
                "text": "string"
              },
              "fieldName": "accessibleLabel"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Optional icon for social link. Use only when suitable icon is unavailable with `\u003crh-icon\u003e`"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-footer--social-icon--size",
              "default": "var(--rh-size-icon-02, 24px)"
            },
            {
              "name": "--rh-size-icon-02",
              "description": "24px icon box",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-footer-social-link",
          "declaration": {
            "name": "RhFooterSocialLink",
            "module": "rh-footer/rh-footer-social-link.js"
          }
        },
        {
          "kind": "js",
          "name": "RhFooterSocialLink",
          "declaration": {
            "name": "RhFooterSocialLink",
            "module": "rh-footer/rh-footer-social-link.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-footer/rh-footer-universal.js",
      "declarations": [
        {
          "name": "RhFooterUniversal",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "colorPalette",
              "type": {
                "text": "ColorPalette"
              },
              "default": "'darker'",
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-footer/rh-footer-universal.ts#L18"
          },
          "kind": "class",
          "tagName": "rh-footer-universal",
          "attributes": [
            {
              "name": "color-palette",
              "type": {
                "text": "ColorPalette"
              },
              "default": "'darker'",
              "fieldName": "colorPalette"
            }
          ],
          "slots": [
            {
              "name": "heading",
              "description": "text that describes the footer section to assistive tecchnology. Contains default text \"Red Hat footer\"."
            },
            {
              "name": "base"
            },
            {
              "name": "logo",
              "description": "logo"
            },
            {
              "name": "primary",
              "description": "primary"
            },
            {
              "name": "primary-start",
              "description": "primary-start"
            },
            {
              "name": "links-primary",
              "description": "links-primary"
            },
            {
              "name": "primary-end",
              "description": "primary-end"
            },
            {
              "name": "secondary",
              "description": "secondary"
            },
            {
              "name": "secondary-start",
              "description": "secondary-start"
            },
            {
              "name": "links-secondary",
              "description": "links-secondary"
            },
            {
              "name": "secondary-end",
              "description": "secondary-end"
            },
            {
              "name": "tertiary",
              "description": "tertiary"
            }
          ],
          "cssParts": [
            {
              "name": "section",
              "description": "base"
            },
            {
              "name": "base",
              "description": "base"
            },
            {
              "name": "logo",
              "description": "logo"
            },
            {
              "name": "logo-anchor"
            },
            {
              "name": "logo-image",
              "description": "logo-image"
            },
            {
              "name": "primary",
              "description": "primary"
            },
            {
              "name": "primary-start",
              "description": "primary-start"
            },
            {
              "name": "links-primary",
              "description": "links-primary"
            },
            {
              "name": "primary-end",
              "description": "primary-end"
            },
            {
              "name": "spacer"
            },
            {
              "name": "secondary",
              "description": "secondary"
            },
            {
              "name": "secondary-start",
              "description": "secondary-start"
            },
            {
              "name": "links-secondary",
              "description": "links-secondary"
            },
            {
              "name": "secondary-end",
              "description": "secondary-end"
            },
            {
              "name": "tertiary",
              "description": "tertiary"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-footer-nojs-min-height",
              "description": "Minimum height for the footer when JavaScript is disabled",
              "deprecated": "target `rh-footer:not(:defined) directly"
            },
            {
              "name": "--rh-footer-icon-color",
              "default": "var(--rh-color-gray-40, #a3a3a3)"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-footer-icon-color-hover",
              "default": "var(--rh-color-gray-30, #c7c7c7)"
            },
            {
              "name": "--rh-color-gray-30",
              "description": "Subtle borders (light theme)",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-footer-border-color",
              "default": "var(--rh-color-border-subtle-on-dark, #707070)"
            },
            {
              "name": "--rh-color-border-subtle-on-dark",
              "description": "Subtle border color (dark theme)",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-footer-accent-color",
              "default": "var(--rh-color-accent-brand-on-light, #ee0000)"
            },
            {
              "name": "--rh-color-accent-brand-on-light",
              "description": "Brand red (light theme)",
              "default": "#ee0000",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-footer-section-side-gap",
              "default": "var(--rh-space-lg, 16px)"
            },
            {
              "name": "--rh-color-white",
              "description": "Lightest surface (light theme) or primary text (dark theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-size-icon-04",
              "description": "40px icon box",
              "default": "40px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-line-height-heading",
              "description": "Line height for headings",
              "default": "1.3"
            },
            {
              "name": "--rh-length-xl",
              "description": "24px length token",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-3xs",
              "description": "2px length token",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xs",
              "description": "4px spacer",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-code",
              "description": "Code font family",
              "default": "RedHatMono, 'Red Hat Mono', 'Courier New', Courier, monospace",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-code-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-4xs",
              "description": "1px length token",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface-darker",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--pf-global--spacer--xl",
              "default": "32px"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-lg",
              "description": "18px font size",
              "default": "1.125rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-footer-links-gap",
              "default": "var(--rh-space-lg, 16px)"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-heading-medium",
              "description": "Medium font weight for headings",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-footer-link-header-font-size",
              "default": "var(--rh-font-size-body-text-sm, 0.875rem)"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-4xl",
              "description": "64px spacer",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-footer-universal",
          "declaration": {
            "name": "RhFooterUniversal",
            "module": "rh-footer/rh-footer-universal.js"
          }
        },
        {
          "kind": "js",
          "name": "RhFooterUniversal",
          "declaration": {
            "name": "RhFooterUniversal",
            "module": "rh-footer/rh-footer-universal.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-footer/rh-footer.js",
      "declarations": [
        {
          "name": "RhFooter",
          "summary": "Displays secondary information at the bottom of a page",
          "description": "A footer displays secondary content and legal information to users who reach the bottom of a page.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "version",
              "type": {
                "text": "string"
              },
              "default": "'{{version}}'",
              "readonly": true,
              "kind": "field",
              "static": true
            },
            {
              "parameters": [
                {
                  "name": "relativeLocation",
                  "type": {
                    "text": "string | URL"
                  }
                }
              ],
              "return": {
                "type": {
                  "text": "string | URL"
                }
              },
              "name": "getImportURL",
              "description": "Isomorphic import.meta.url function\nRequires a node.js dom shim that sets window.location",
              "kind": "method",
              "static": true
            },
            {
              "name": "screenSize",
              "description": "ScreenSizeController effects callback to set #compact is true when viewport\n`(min-width: ${tabletLandscapeBreakpoint})`.",
              "default": "new ScreenSizeController(this, 'md', {\\n    onChange: matches =\u003e {\\n      this.#compact = !matches;\\n    },\\n  })",
              "kind": "field",
              "privacy": "protected"
            },
            {
              "name": "LISTS_SELECTOR",
              "type": {
                "text": "string"
              },
              "default": "':is([slot^=links],[slot=footer-links-primary],[slot=footer-links-secondary]):is(ul)'",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "updateAccessibility",
              "description": "Get any `\u003cul\u003e`s that are in the designated link slots\nand synchronously update each list and header if we need to.",
              "kind": "method",
              "privacy": "public"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-footer/rh-footer.ts#L32"
          },
          "kind": "class",
          "tagName": "rh-footer",
          "slots": [
            {
              "name": "heading",
              "description": "text that describes the footer section to assistive technology. Contains default text \"Red Hat footer\"."
            },
            {
              "name": "base",
              "description": "Overrides everything. Do not use."
            },
            {
              "name": "header",
              "description": "Overrides `header-*`, `logo`, `social-links`"
            },
            {
              "name": "header-primary",
              "description": "primary footer header content, e.g. main logo. Overrides `logo`"
            },
            {
              "name": "logo",
              "description": "main page or product logo. Defaults to Red Hat corporate logo"
            },
            {
              "name": "header-secondary",
              "description": "secondary footer header content, e.g. social links. Overrides `social-links`"
            },
            {
              "name": "social-links",
              "description": "social media links (icons). Contains a default set of links"
            },
            {
              "name": "main",
              "description": "main footer content. Overrides `main-*`"
            },
            {
              "name": "main-primary",
              "description": "main footer region. typically a columnar grid"
            },
            {
              "name": "main-secondary",
              "description": "typically contains prose or promotional content"
            },
            {
              "name": "universal",
              "description": "must contain `\u003crh-footer-universal\u003e`"
            }
          ],
          "cssParts": [
            {
              "name": "base",
              "description": "main footer element, containing all footer content"
            },
            {
              "name": "header",
              "description": "footer header, typically containing main logo and social links"
            },
            {
              "name": "header-primary",
              "description": "primary footer header content, e.g. main logo"
            },
            {
              "name": "logo",
              "description": "main page or product logo container"
            },
            {
              "name": "header-secondary",
              "description": "secondary footer header content, e.g. social links"
            },
            {
              "name": "social-links",
              "description": "social links container `\u003crh-footer-links\u003e`"
            },
            {
              "name": "section",
              "description": "main content container."
            },
            {
              "name": "main",
              "description": "main content container."
            },
            {
              "name": "main-primary",
              "description": "container for main footer links"
            },
            {
              "name": "links",
              "description": "container for main footer links"
            },
            {
              "name": "main-secondary",
              "description": "container for prose or promotional content"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-footer-nojs-min-height",
              "description": "Minimum height for the footer when JavaScript is disabled",
              "deprecated": "target `rh-footer:not(:defined) directly"
            },
            {
              "name": "--rh-footer-icon-color",
              "default": "var(--rh-color-gray-40, #a3a3a3)"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-footer-icon-color-hover",
              "default": "var(--rh-color-gray-30, #c7c7c7)"
            },
            {
              "name": "--rh-color-gray-30",
              "description": "Subtle borders (light theme)",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-footer-border-color",
              "default": "var(--rh-color-border-subtle-on-dark, #707070)"
            },
            {
              "name": "--rh-color-border-subtle-on-dark",
              "description": "Subtle border color (dark theme)",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-footer-accent-color",
              "default": "var(--rh-color-accent-brand-on-light, #ee0000)"
            },
            {
              "name": "--rh-color-accent-brand-on-light",
              "description": "Brand red (light theme)",
              "default": "#ee0000",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-footer-section-side-gap",
              "default": "var(--rh-space-lg, 16px)"
            },
            {
              "name": "--rh-color-white",
              "description": "Lightest surface (light theme) or primary text (dark theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-size-icon-04",
              "description": "40px icon box",
              "default": "40px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-line-height-heading",
              "description": "Line height for headings",
              "default": "1.3"
            },
            {
              "name": "--rh-length-xl",
              "description": "24px length token",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-3xs",
              "description": "2px length token",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xs",
              "description": "4px spacer",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-code",
              "description": "Code font family",
              "default": "RedHatMono, 'Red Hat Mono', 'Courier New', Courier, monospace",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-code-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-4xs",
              "description": "1px length token",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface-darker",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--pf-global--spacer--xl",
              "default": "32px"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-lg",
              "description": "18px font size",
              "default": "1.125rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-footer-links-gap",
              "default": "var(--rh-space-lg, 16px)"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-heading-medium",
              "description": "Medium font weight for headings",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-footer-link-header-font-size",
              "default": "var(--rh-font-size-body-text-sm, 0.875rem)"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-4xl",
              "description": "64px spacer",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/footer/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-footer/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/footer/demo/footer-universal/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-footer/demo/footer-universal.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/footer/demo/slotted-social-links/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-footer/demo/slotted-social-links.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-footer",
          "declaration": {
            "name": "RhFooter",
            "module": "rh-footer/rh-footer.js"
          }
        },
        {
          "kind": "js",
          "name": "RhFooter",
          "declaration": {
            "name": "RhFooter",
            "module": "rh-footer/rh-footer.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-health-index/rh-health-index.js",
      "declarations": [
        {
          "name": "RhHealthIndex",
          "summary": "Displays a health grade for a particular item or package",
          "description": "Health index displays a health grade (A–F) for a particular item or package.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "grades",
              "type": {
                "text": "string"
              },
              "default": "'ABCDEF'",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "size",
              "description": "Sets the size of the health index\nDefaults to `md`",
              "type": {
                "text": "'sm' | 'md' | 'lg' | 'xl'"
              },
              "default": "'md'",
              "kind": "field",
              "attribute": "size",
              "reflects": true
            },
            {
              "name": "grade",
              "description": "Sets the health grade\nDefaults to `A`",
              "type": {
                "text": "'A' | 'B' | 'C' | 'D' | 'E' | 'F'"
              },
              "default": "'A'",
              "kind": "field",
              "attribute": "grade",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-health-index/rh-health-index.ts#L21"
          },
          "kind": "class",
          "tagName": "rh-health-index",
          "attributes": [
            {
              "name": "size",
              "description": "Sets the size of the health index\nDefaults to `md`",
              "type": {
                "text": "'sm' | 'md' | 'lg' | 'xl'"
              },
              "default": "'md'",
              "fieldName": "size"
            },
            {
              "name": "grade",
              "description": "Sets the health grade\nDefaults to `A`",
              "type": {
                "text": "'A' | 'B' | 'C' | 'D' | 'E' | 'F'"
              },
              "default": "'A'",
              "fieldName": "grade"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface-status-success",
              "description": "Responsive `surface-status-success` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-surface-status-success-on-light` on a themable container with a light color palette and `--rh-color-surface-status-success-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-success",
              "description": "Responsive `status-success` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-success-on-light` on a themable container with a light color palette and `--rh-color-status-success-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-status-warning",
              "description": "Responsive `surface-status-warning` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-surface-status-warning-on-light` on a themable container with a light color palette and `--rh-color-surface-status-warning-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-warning",
              "description": "Responsive `status-warning` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-warning-on-light` on a themable container with a light color palette and `--rh-color-status-warning-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-status-caution",
              "description": "Responsive `surface-status-caution` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-surface-status-caution-on-light` on a themable container with a light color palette and `--rh-color-surface-status-caution-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-caution",
              "description": "Responsive `status-caution` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-caution-on-light` on a themable container with a light color palette and `--rh-color-status-caution-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-status-danger",
              "description": "Responsive `surface-status-danger` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-surface-status-danger-on-light` on a themable container with a light color palette and `--rh-color-surface-status-danger-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-danger",
              "description": "Responsive `status-danger` color value. Typically read-only – use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-danger-on-light` on a themable container with a light color palette and `--rh-color-status-danger-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xl",
              "description": "20px font size",
              "default": "1.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-code",
              "description": "Code font family",
              "default": "RedHatMono, 'Red Hat Mono', 'Courier New', Courier, monospace",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-subtle-on-light",
              "description": "Subtle border color (light theme)",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-subtle",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-length-xs",
              "description": "4px length token",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-code-medium",
              "description": "Medium font weight",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/health-index/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-health-index/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/health-index/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-health-index/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/health-index/demo/screen-readers/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-health-index/demo/screen-readers.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/health-index/demo/variants/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-health-index/demo/variants.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-health-index",
          "declaration": {
            "name": "RhHealthIndex",
            "module": "rh-health-index/rh-health-index.js"
          }
        },
        {
          "kind": "js",
          "name": "RhHealthIndex",
          "declaration": {
            "name": "RhHealthIndex",
            "module": "rh-health-index/rh-health-index.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-icon/rh-icon.js",
      "declarations": [
        {
          "name": "IconResolveErrorEvent",
          "description": "Fired when an icon fails to load",
          "superclass": {
            "name": "ErrorEvent",
            "package": "global:"
          },
          "members": [
            {
              "name": "originalError",
              "description": "The original error when importing the icon module",
              "type": {
                "text": "Error"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-icon/rh-icon.ts#L35"
          },
          "kind": "class"
        },
        {
          "name": "RhIcon",
          "summary": "Decorative element which supports related content",
          "description": "Icons represents general concepts and can support text as a decorative\nelement. The icon element is a container that allows users to add icons of\nvarying dimensions in the same area without shifting surrounding content.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "onIntersect",
              "kind": "method",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "io",
              "default": "new IntersectionObserver(RhIcon.onIntersect)",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "instances",
              "default": "new Set\u003cRhIcon\u003e()",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "resolve",
              "kind": "method",
              "static": true,
              "privacy": "public"
            },
            {
              "name": "set",
              "description": "Icon set",
              "type": {
                "text": "IconSetName"
              },
              "default": "'standard'",
              "kind": "field",
              "attribute": "set",
              "reflects": true
            },
            {
              "name": "icon",
              "description": "Icon name",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "kind": "field",
              "attribute": "icon",
              "reflects": true
            },
            {
              "name": "accessibleLabel",
              "description": "Defines a string value that labels the icon element.\nAdds role=\"img\" to element.",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "accessible-label"
            },
            {
              "name": "loading",
              "description": "Controls how eager the element will be to load the icon data\n- `eager`: eagerly load the icon, blocking the main thread\n- `idle`: wait for the browser to attain an idle state before loading\n- `lazy` (default): wait for the element to enter the viewport before loading",
              "type": {
                "text": "'idle' | 'lazy' | 'eager'"
              },
              "default": "'lazy'",
              "kind": "field",
              "attribute": "loading"
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "iconChanged",
              "kind": "method",
              "privacy": "private"
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "accessibleLabelChanged",
              "kind": "method",
              "privacy": "private"
            },
            {
              "parameters": [
                {
                  "name": "old",
                  "type": {
                    "text": "unknown"
                  }
                }
              ],
              "name": "contentChanged",
              "kind": "method",
              "privacy": "private"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-icon/rh-icon.ts#L60"
          },
          "kind": "class",
          "tagName": "rh-icon",
          "attributes": [
            {
              "name": "set",
              "description": "Icon set",
              "type": {
                "text": "IconSetName"
              },
              "default": "'standard'",
              "fieldName": "set"
            },
            {
              "name": "icon",
              "description": "Icon name",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "fieldName": "icon"
            },
            {
              "name": "accessible-label",
              "description": "Defines a string value that labels the icon element.\nAdds role=\"img\" to element.",
              "type": {
                "text": "string"
              },
              "fieldName": "accessibleLabel"
            },
            {
              "name": "loading",
              "description": "Controls how eager the element will be to load the icon data\n- `eager`: eagerly load the icon, blocking the main thread\n- `idle`: wait for the browser to attain an idle state before loading\n- `lazy` (default): wait for the element to enter the viewport before loading",
              "type": {
                "text": "'idle' | 'lazy' | 'eager'"
              },
              "default": "'lazy'",
              "fieldName": "loading"
            }
          ],
          "events": [
            {
              "name": "load",
              "description": "Fired when an icon is loaded and rendered"
            },
            {
              "name": "error",
              "description": "Fired when an icon fails to load"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Slotted content is used as a fallback in case the icon doesn't load"
            }
          ],
          "cssParts": [
            {
              "name": "fallback",
              "description": "Container for the fallback (i.e. slotted) content"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-size-icon-01",
              "description": "16px icon box",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-size-icon-04",
              "description": "40px icon box",
              "default": "40px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-icon-size",
              "description": "Override default icon size",
              "default": "12px"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/icon/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-icon/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/icon/demo/accessibility/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-icon/demo/accessibility.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "IconResolveErrorEvent",
          "declaration": {
            "name": "IconResolveErrorEvent",
            "module": "rh-icon/rh-icon.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-icon",
          "declaration": {
            "name": "RhIcon",
            "module": "rh-icon/rh-icon.js"
          }
        },
        {
          "kind": "js",
          "name": "RhIcon",
          "declaration": {
            "name": "RhIcon",
            "module": "rh-icon/rh-icon.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-jump-links/rh-jump-link.js",
      "declarations": [
        {
          "name": "RhJumpLink",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "active",
              "description": "Whether this item is active.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "active",
              "reflects": true
            },
            {
              "name": "href",
              "description": "hypertext reference for this link",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "href",
              "reflects": true
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "activeChanged",
              "kind": "method",
              "privacy": "protected"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-jump-links/rh-jump-link.ts#L20"
          },
          "kind": "class",
          "tagName": "rh-jump-link",
          "attributes": [
            {
              "name": "active",
              "description": "Whether this item is active.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "active"
            },
            {
              "name": "href",
              "description": "hypertext reference for this link",
              "type": {
                "text": "string"
              },
              "fieldName": "href"
            }
          ],
          "slots": [
            {
              "name": ""
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-interactive-secondary-default",
              "description": "Responsive `interactive-secondary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-secondary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-secondary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-jump-link-max-width",
              "description": "max-width for each vertical jump link",
              "default": "calc(var(--rh-length-md, 8px) * 40)"
            },
            {
              "name": "--rh-length-md",
              "description": "8px length token",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-brand-red",
              "description": "Responsive `brand-red` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-brand-red-on-light` on a themable container with a light color palette and `--rh-color-brand-red-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-lg",
              "description": "3px border width: Example: Expanded Accordion panel",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-status-neutral",
              "description": "Responsive `border-neutral` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-neutral-on-light` on a themable container with a light color palette and `--rh-color-border-neutral-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-jump-link",
          "declaration": {
            "name": "RhJumpLink",
            "module": "rh-jump-links/rh-jump-link.js"
          }
        },
        {
          "kind": "js",
          "name": "RhJumpLink",
          "declaration": {
            "name": "RhJumpLink",
            "module": "rh-jump-links/rh-jump-link.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-jump-links/rh-jump-links-list.js",
      "declarations": [
        {
          "name": "RhJumpLinksList",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "active",
              "description": "Whether this item is active.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "active",
              "reflects": true
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "activeChanged",
              "kind": "method",
              "privacy": "protected"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-jump-links/rh-jump-links-list.ts#L22"
          },
          "kind": "class",
          "tagName": "rh-jump-links-list",
          "attributes": [
            {
              "name": "active",
              "description": "Whether this item is active.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "active"
            }
          ],
          "slots": [
            {
              "name": "parent"
            },
            {
              "name": ""
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-length-4xs",
              "description": "1px length token",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "default": "1px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-xs",
              "description": "4px length token",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-brand-red",
              "description": "Responsive `brand-red` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-brand-red-on-light` on a themable container with a light color palette and `--rh-color-brand-red-on-dark` on a themable container with a dark color palette.",
              "default": "4px",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-jump-links-list",
          "declaration": {
            "name": "RhJumpLinksList",
            "module": "rh-jump-links/rh-jump-links-list.js"
          }
        },
        {
          "kind": "js",
          "name": "RhJumpLinksList",
          "declaration": {
            "name": "RhJumpLinksList",
            "module": "rh-jump-links/rh-jump-links-list.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-jump-links/rh-jump-links.js",
      "declarations": [
        {
          "name": "RhJumpLinks",
          "description": "Jump links allow users to navigate sections of content on a page.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "orientation",
              "description": "Whether the layout of children is vertical or horizontal.",
              "type": {
                "text": "'horizontal' | 'vertical'"
              },
              "default": "'vertical'",
              "kind": "field",
              "attribute": "orientation",
              "reflects": true
            },
            {
              "name": "accessibleLabel",
              "description": "Accessible label for nav",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "accessible-label"
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "firstUpdated",
              "kind": "method"
            },
            {
              "name": "labelChanged",
              "kind": "method",
              "privacy": "protected"
            },
            {
              "name": "orientationChanged",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-jump-links/rh-jump-links.ts#L30"
          },
          "kind": "class",
          "tagName": "rh-jump-links",
          "attributes": [
            {
              "name": "orientation",
              "description": "Whether the layout of children is vertical or horizontal.",
              "type": {
                "text": "'horizontal' | 'vertical'"
              },
              "default": "'vertical'",
              "fieldName": "orientation"
            },
            {
              "name": "accessible-label",
              "description": "Accessible label for nav",
              "type": {
                "text": "string"
              },
              "fieldName": "accessibleLabel"
            }
          ],
          "events": [
            {
              "name": "toggle",
              "description": "when the `expanded` disclosure widget is toggled"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Place `\u003crh-jump-link\u003e` or `\u003crh-jump-links-list\u003e` elements here"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-length-4xs",
              "description": "1px length token",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-3xl",
              "description": "48px spacer",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "default": "1px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-50",
              "description": "Subtle icon",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/jump-links/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-jump-links/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/jump-links/demo/horizontal/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-jump-links/demo/horizontal.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/jump-links/demo/nested/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-jump-links/demo/nested.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/jump-links/demo/responsive/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-jump-links/demo/responsive.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/jump-links/demo/with-content/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-jump-links/demo/with-content.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-jump-links",
          "declaration": {
            "name": "RhJumpLinks",
            "module": "rh-jump-links/rh-jump-links.js"
          }
        },
        {
          "kind": "js",
          "name": "RhJumpLinks",
          "declaration": {
            "name": "RhJumpLinks",
            "module": "rh-jump-links/rh-jump-links.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-menu-dropdown/rh-menu-dropdown.js",
      "declarations": [
        {
          "name": "MenuDropdownSelectEvent",
          "description": "Fired when a user selects an action or link from the menu",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "members": [
            {
              "name": "selectedItem",
              "type": {
                "text": "RhMenuItem"
              },
              "kind": "field"
            },
            {
              "name": "text",
              "type": {
                "text": "string"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/rh-menu-dropdown.ts#L18"
          },
          "kind": "class"
        },
        {
          "name": "RhMenuDropdown",
          "summary": "A collapsible menu for presenting a list of options or actions",
          "description": "A menu dropdown presents a list of actions or links in a vertically stacked menu,\nappearing when a user interacts with a toggle button.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "instances",
              "default": "new Set\u003cRhMenuDropdown\u003e()",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "open",
              "description": "whether the dropdown is currently open.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "open",
              "reflects": true
            },
            {
              "name": "variant",
              "description": "Defines the visual style of the dropdown.\nSetting it to 'borderless' removes the default border styling.",
              "type": {
                "text": "'borderless'"
              },
              "kind": "field",
              "attribute": "variant",
              "reflects": true
            },
            {
              "name": "layout",
              "description": "The 'compact' layout reduces spacing and add the rh-icon `ellipsis-vertical-fill`.",
              "type": {
                "text": "'compact'"
              },
              "kind": "field",
              "attribute": "layout",
              "reflects": true
            },
            {
              "name": "disabled",
              "description": "Disables user interaction with the dropdown. When true, the dropdown cannot\nbe opened or interacted with, and appears visually disabled.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "disabled",
              "reflects": true
            },
            {
              "name": "accessibleLabel",
              "description": "Provides an accessible name for the dropdown's trigger, improving screen reader support.\nThis label is announced to assistive technologies to describe the purpose of\nthe compact menu dropdown.",
              "type": {
                "text": "string"
              },
              "default": "'Toggle menu'",
              "kind": "field",
              "attribute": "accessible-label",
              "reflects": true
            },
            {
              "name": "firstUpdated",
              "kind": "method"
            },
            {
              "name": "focus",
              "description": "Moves focus to the currently active (focused) item.",
              "kind": "method"
            },
            {
              "name": "items",
              "type": {
                "text": "HTMLElement[]"
              },
              "readonly": true,
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/rh-menu-dropdown.ts#L37"
          },
          "kind": "class",
          "tagName": "rh-menu-dropdown",
          "attributes": [
            {
              "name": "open",
              "description": "whether the dropdown is currently open.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "open"
            },
            {
              "name": "variant",
              "description": "Defines the visual style of the dropdown.\nSetting it to 'borderless' removes the default border styling.",
              "type": {
                "text": "'borderless'"
              },
              "fieldName": "variant"
            },
            {
              "name": "layout",
              "description": "The 'compact' layout reduces spacing and add the rh-icon `ellipsis-vertical-fill`.",
              "type": {
                "text": "'compact'"
              },
              "fieldName": "layout"
            },
            {
              "name": "disabled",
              "description": "Disables user interaction with the dropdown. When true, the dropdown cannot\nbe opened or interacted with, and appears visually disabled.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "disabled"
            },
            {
              "name": "accessible-label",
              "description": "Provides an accessible name for the dropdown's trigger, improving screen reader support.\nThis label is announced to assistive technologies to describe the purpose of\nthe compact menu dropdown.",
              "type": {
                "text": "string"
              },
              "default": "'Toggle menu'",
              "fieldName": "accessibleLabel"
            }
          ],
          "slots": [
            {
              "name": "toggle-label",
              "description": "Use this slot for the toggle label. Keep toggle labels short and succinct."
            },
            {
              "name": "",
              "description": "Use this slot to provide the menu content. Use the \"rh-menu\" component \nfor the menu panel, and use \"rh-menu-items\" to define the individual menu items.\nTo organize menu items into groups, use the \"rh-menu-item-group\" component."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-box-shadow-md",
              "description": "Medium box shadow",
              "default": "0 4px 6px 1px rgba(21, 21, 21, 0.25)",
              "syntax": "\u003cshadow\u003e"
            },
            {
              "name": "--rh-color-accent-base-on-light",
              "description": "Inline link (light theme)",
              "default": "#0066cc",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-accent-base-on-dark",
              "description": "Inline link (dark theme)",
              "default": "#92c5f9",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-line-height-code",
              "description": "Line height for code",
              "default": "1.5"
            },
            {
              "name": "--rh-space-sm",
              "description": "6px spacer",
              "default": "6px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darker",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-length-3xs",
              "description": "2px length token",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-gray-30",
              "description": "Subtle borders (light theme)",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-gray-50",
              "description": "Subtle icon",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-60",
              "description": "Secondary text (light theme)",
              "default": "#4d4d4d",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/menu-dropdown/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu-dropdown/demo/basic-toggle-with-anchor-links/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/demo/basic-toggle-with-anchor-links.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu-dropdown/demo/basic-toggle-with-fit-text/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/demo/basic-toggle-with-fit-text.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu-dropdown/demo/basic-toggle-with-icon-on-left/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/demo/basic-toggle-with-icon-on-left.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu-dropdown/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu-dropdown/demo/compact-borderless-variant/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/demo/compact-borderless-variant.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu-dropdown/demo/compact/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/demo/compact.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu-dropdown/demo/disabled/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/demo/disabled.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu-dropdown/demo/drodown-items-with-icons/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/demo/drodown-items-with-icons.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu-dropdown/demo/dropdown-items-with-item-descriptions/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/demo/dropdown-items-with-item-descriptions.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu-dropdown/demo/dropdown-with-group-headings/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/demo/dropdown-with-group-headings.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu-dropdown/demo/info-action-icon-only/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu-dropdown/demo/info-action-icon-only.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "MenuDropdownSelectEvent",
          "declaration": {
            "name": "MenuDropdownSelectEvent",
            "module": "rh-menu-dropdown/rh-menu-dropdown.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-menu-dropdown",
          "declaration": {
            "name": "RhMenuDropdown",
            "module": "rh-menu-dropdown/rh-menu-dropdown.js"
          }
        },
        {
          "kind": "js",
          "name": "RhMenuDropdown",
          "declaration": {
            "name": "RhMenuDropdown",
            "module": "rh-menu-dropdown/rh-menu-dropdown.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-menu/rh-menu-item-group.js",
      "declarations": [
        {
          "name": "RhMenuItemGroup",
          "description": "Menu Dropdown Item Group",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "groupHeading",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "group-heading",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu/rh-menu-item-group.ts#L11"
          },
          "kind": "class",
          "tagName": "rh-menu-item-group",
          "attributes": [
            {
              "name": "group-heading",
              "type": {
                "text": "string"
              },
              "fieldName": "groupHeading"
            }
          ],
          "slots": [
            {
              "name": ""
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-color-interactive-secondary-default",
              "description": "Responsive `interactive-secondary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-secondary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-secondary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-menu-item-group",
          "declaration": {
            "name": "RhMenuItemGroup",
            "module": "rh-menu/rh-menu-item-group.js"
          }
        },
        {
          "kind": "js",
          "name": "RhMenuItemGroup",
          "declaration": {
            "name": "RhMenuItemGroup",
            "module": "rh-menu/rh-menu-item-group.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-menu/rh-menu-item.js",
      "declarations": [
        {
          "name": "RhMenuItem",
          "description": "Menu Dropdown Item",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "disabled",
              "description": "Whether the menu item is disabled.\nDisabled items are not interactive and are visually indicated as such.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "disabled",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu/rh-menu-item.ts#L13"
          },
          "kind": "class",
          "tagName": "rh-menu-item",
          "attributes": [
            {
              "name": "disabled",
              "description": "Whether the menu item is disabled.\nDisabled items are not interactive and are visually indicated as such.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "disabled"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Use this slot to provide the text content inside menu item."
            },
            {
              "name": "icon",
              "description": "Slot for an icon displayed alongside the menu item.\nThe icon will appear to the left of the menu item text in left-to-right (LTR) layouts."
            },
            {
              "name": "description",
              "description": "Use this slot to provide the description inside menu item."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-line-height-code",
              "description": "Line height for code",
              "default": "1.5"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-secondary-default",
              "description": "Responsive `interactive-secondary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-secondary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-secondary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darker",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-accent-base-on-light",
              "description": "Inline link (light theme)",
              "default": "#0066cc",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-accent-base-on-dark",
              "description": "Inline link (dark theme)",
              "default": "#92c5f9",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-color-gray-50",
              "description": "Subtle icon",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-60",
              "description": "Secondary text (light theme)",
              "default": "#4d4d4d",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-heading-regular",
              "description": "Regular font weight for headings",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-menu-item",
          "declaration": {
            "name": "RhMenuItem",
            "module": "rh-menu/rh-menu-item.js"
          }
        },
        {
          "kind": "js",
          "name": "RhMenuItem",
          "declaration": {
            "name": "RhMenuItem",
            "module": "rh-menu/rh-menu-item.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-menu/rh-menu.js",
      "declarations": [
        {
          "name": "MenuToggleEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "members": [
            {
              "name": "open",
              "type": {
                "text": "boolean"
              },
              "kind": "field"
            },
            {
              "name": "menu",
              "type": {
                "text": "HTMLElement"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu/rh-menu.ts#L15"
          },
          "kind": "class"
        },
        {
          "name": "RhMenu",
          "description": "Menu",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "parameters": [
                {
                  "name": "items",
                  "type": {
                    "text": "HTMLElement[]"
                  }
                }
              ],
              "return": {
                "type": {
                  "text": "HTMLElement[]"
                }
              },
              "name": "getItems",
              "description": "override or set to add items to the roving tab index controller",
              "kind": "method"
            },
            {
              "name": "activeItem",
              "readonly": true,
              "kind": "field"
            },
            {
              "parameters": [
                {
                  "name": "item",
                  "type": {
                    "text": "HTMLElement"
                  }
                }
              ],
              "name": "activateItem",
              "kind": "method"
            },
            {
              "name": "focus",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu/rh-menu.ts#L31"
          },
          "kind": "class",
          "tagName": "rh-menu",
          "slots": [
            {
              "name": "",
              "description": "menu items"
            }
          ],
          "cssParts": [
            {
              "name": "menu",
              "description": "menu items"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-visited-default",
              "description": "Responsive `interactive-primary-visited` (e.g. visited link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-visited-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-visited-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-gray-30",
              "description": "Subtle borders (light theme)",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-50",
              "description": "Subtle icon",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/menu/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu/demo/menu-item/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu/demo/menu-item.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu/demo/position-left/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu/demo/position-left.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu/demo/position-right/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu/demo/position-right.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/menu/demo/position-top/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-menu/demo/position-top.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "MenuToggleEvent",
          "declaration": {
            "name": "MenuToggleEvent",
            "module": "rh-menu/rh-menu.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-menu",
          "declaration": {
            "name": "RhMenu",
            "module": "rh-menu/rh-menu.js"
          }
        },
        {
          "kind": "js",
          "name": "RhMenu",
          "declaration": {
            "name": "RhMenu",
            "module": "rh-menu/rh-menu.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-navigation-link/rh-navigation-link.js",
      "declarations": [
        {
          "name": "RhNavigationLink",
          "summary": "A link that can be used as a child of navigation elements.",
          "description": "Navigation Link is a link element that is used as a child of the primary, secondary,\nsubnav, and vertical navigation elements. Intrinsically, the Navigation Link is a list\nitem and should not be used outside of navigation elements that define the parent list element.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "icon",
              "description": "Shorthand for the `icon` slot, the value is icon name",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "kind": "field",
              "attribute": "icon"
            },
            {
              "name": "iconSet",
              "description": "Icon set for the `icon` property - 'ui' by default",
              "type": {
                "text": "IconSetName"
              },
              "kind": "field",
              "attribute": "icon-set"
            },
            {
              "name": "href",
              "description": "The URL to navigate to when the link is clicked",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "href",
              "reflects": true
            },
            {
              "name": "currentPage",
              "description": "Indicates that this link refers to the current page for accessibility; used with the `href` attribute.\nSets the `aria-current` attribute to 'page' on the anchor element internally in the shadow DOM.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "current-page"
            },
            {
              "name": "scheduleUpdate",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-link/rh-navigation-link.ts#L24"
          },
          "kind": "class",
          "tagName": "rh-navigation-link",
          "attributes": [
            {
              "name": "icon",
              "description": "Shorthand for the `icon` slot, the value is icon name",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "fieldName": "icon"
            },
            {
              "name": "icon-set",
              "description": "Icon set for the `icon` property - 'ui' by default",
              "type": {
                "text": "IconSetName"
              },
              "fieldName": "iconSet"
            },
            {
              "name": "href",
              "description": "The URL to navigate to when the link is clicked",
              "type": {
                "text": "string"
              },
              "fieldName": "href"
            },
            {
              "name": "current-page",
              "description": "Indicates that this link refers to the current page for accessibility; used with the `href` attribute.\nSets the `aria-current` attribute to 'page' on the anchor element internally in the shadow DOM.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "currentPage"
            }
          ],
          "slots": [
            {
              "name": "icon",
              "description": "Use this slot when the `icon` and `icon-set` attributes are not set. \nMust be used in conjunction with the `href` attribute.  \nCan contain a rh-icon, svg, or img tag."
            },
            {
              "name": "",
              "description": "The default slot should contain the link text when the `href` attribute is set. \nAlternatively, an anchor tag (`\u003ca href=\"...\"\u003e`) should be the first child inside\nthe slot. Slot should never contain a button tag."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-50",
              "description": "Subtle icon",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/navigation-link/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-link/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-link/demo/in-nav-primary/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-link/demo/in-nav-primary.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-link/demo/in-nav-secondary/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-link/demo/in-nav-secondary.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-link/demo/in-subnav/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-link/demo/in-subnav.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-navigation-link",
          "declaration": {
            "name": "RhNavigationLink",
            "module": "rh-navigation-link/rh-navigation-link.js"
          }
        },
        {
          "kind": "js",
          "name": "RhNavigationLink",
          "declaration": {
            "name": "RhNavigationLink",
            "module": "rh-navigation-link/rh-navigation-link.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-navigation-primary/rh-navigation-primary-item-menu.js",
      "declarations": [
        {
          "name": "RhNavigationPrimaryItemMenu",
          "description": "Navigation Menu",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "return": {
                "type": {
                  "text": "Promise\u003cvoid\u003e"
                }
              },
              "name": "firstUpdated",
              "kind": "method",
              "privacy": "protected"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-primary/rh-navigation-primary-item-menu.ts#L15"
          },
          "kind": "class",
          "tagName": "rh-navigation-primary-item-menu",
          "slots": [
            {
              "name": "",
              "description": "Place element content here"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-3xl",
              "description": "48px spacer",
              "default": "48px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-navigation-primary-item-menu",
          "declaration": {
            "name": "RhNavigationPrimaryItemMenu",
            "module": "rh-navigation-primary/rh-navigation-primary-item-menu.js"
          }
        },
        {
          "kind": "js",
          "name": "RhNavigationPrimaryItemMenu",
          "declaration": {
            "name": "RhNavigationPrimaryItemMenu",
            "module": "rh-navigation-primary/rh-navigation-primary-item-menu.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-navigation-primary/rh-navigation-primary-item.js",
      "declarations": [
        {
          "name": "RhNavigationPrimaryItem",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "open",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "open",
              "reflects": true
            },
            {
              "name": "summary",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "summary"
            },
            {
              "name": "variant",
              "type": {
                "text": "'link' | 'dropdown'"
              },
              "default": "'link'",
              "kind": "field",
              "attribute": "variant"
            },
            {
              "name": "hideAt",
              "description": "Hides the element at various container query based breakpoints.\nBreakpoints available 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'",
              "type": {
                "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'"
              },
              "default": "undefined",
              "kind": "field",
              "attribute": "hide-at",
              "reflects": true
            },
            {
              "name": "icon",
              "description": "Shorthand for the `icon` slot, the value is icon name",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "kind": "field",
              "attribute": "icon"
            },
            {
              "name": "iconSet",
              "description": "Icon set for the `icon` property - 'ui' by default",
              "type": {
                "text": "IconSetName"
              },
              "kind": "field",
              "attribute": "icon-set"
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "firstUpdated",
              "kind": "method",
              "privacy": "protected"
            },
            {
              "name": "hide",
              "summary": "hides the dropdown",
              "kind": "method",
              "privacy": "public"
            },
            {
              "name": "show",
              "summary": "shows the dropdown",
              "kind": "method",
              "privacy": "public"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-primary/rh-navigation-primary-item.ts#L26"
          },
          "kind": "class",
          "tagName": "rh-navigation-primary-item",
          "attributes": [
            {
              "name": "open",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "open"
            },
            {
              "name": "summary",
              "type": {
                "text": "string"
              },
              "fieldName": "summary"
            },
            {
              "name": "variant",
              "type": {
                "text": "'link' | 'dropdown'"
              },
              "default": "'link'",
              "fieldName": "variant"
            },
            {
              "name": "hide-at",
              "description": "Hides the element at various container query based breakpoints.\nBreakpoints available 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'",
              "type": {
                "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'"
              },
              "default": "undefined",
              "fieldName": "hideAt"
            },
            {
              "name": "icon",
              "description": "Shorthand for the `icon` slot, the value is icon name",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "fieldName": "icon"
            },
            {
              "name": "icon-set",
              "description": "Icon set for the `icon` property - 'ui' by default",
              "type": {
                "text": "IconSetName"
              },
              "fieldName": "iconSet"
            }
          ],
          "slots": [
            {
              "name": "icon"
            },
            {
              "name": "summary"
            },
            {
              "name": ""
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-size-icon-02",
              "description": "24px icon box",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-sm",
              "description": "6px spacer",
              "default": "6px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-icon-subtle",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-lg",
              "description": "3px border width: Example: Expanded Accordion panel",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-accent-brand",
              "description": "Responsive `accent-brand` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-accent-brand-on-light` on a themable container with a light color palette and `--rh-color-accent-brand-on-dark` on a themable container with a dark color palette.",
              "default": "3px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-pill",
              "description": "Pill border radius; Example: Label",
              "default": "64px"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darker",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-50",
              "description": "Subtle icon",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "default": "2px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-navigation-primary-item",
          "declaration": {
            "name": "RhNavigationPrimaryItem",
            "module": "rh-navigation-primary/rh-navigation-primary-item.js"
          }
        },
        {
          "kind": "js",
          "name": "RhNavigationPrimaryItem",
          "declaration": {
            "name": "RhNavigationPrimaryItem",
            "module": "rh-navigation-primary/rh-navigation-primary-item.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-navigation-primary/rh-navigation-primary-overlay.js",
      "declarations": [
        {
          "name": "RhNavigationPrimaryOverlay",
          "description": "Overlay",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "open",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "open",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-primary/rh-navigation-primary-overlay.ts#L12"
          },
          "kind": "class",
          "tagName": "rh-navigation-primary-overlay",
          "attributes": [
            {
              "name": "open",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "open"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Place element content here"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-gray-90",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-opacity-80",
              "description": "80% opacity",
              "default": "80%"
            },
            {
              "name": "--rh-overlay-z-index",
              "default": "1"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-navigation-primary-overlay",
          "declaration": {
            "name": "RhNavigationPrimaryOverlay",
            "module": "rh-navigation-primary/rh-navigation-primary-overlay.js"
          }
        },
        {
          "kind": "js",
          "name": "RhNavigationPrimaryOverlay",
          "declaration": {
            "name": "RhNavigationPrimaryOverlay",
            "module": "rh-navigation-primary/rh-navigation-primary-overlay.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-navigation-primary/rh-navigation-primary.js",
      "declarations": [
        {
          "name": "RhNavigationPrimary",
          "summary": "Primary navigation",
          "description": "Primary navigation helps users orient themselves and move through websites and domains.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "mobileToggleLabel",
              "description": "Sets the mobile toggle (hamburger) text, used for translations, defaults to 'Menu'",
              "type": {
                "text": "string"
              },
              "default": "'Menu'",
              "kind": "field",
              "attribute": "mobile-toggle-label"
            },
            {
              "name": "colorPalette",
              "description": "Sets color context for child components, overrides parent context",
              "type": {
                "text": "NavigationPrimaryPalette"
              },
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            },
            {
              "name": "accessibleLabel",
              "description": "Customize the default label for the navigation.\nDefaults to \"Main navigation\" if no value is set.",
              "type": {
                "text": "string"
              },
              "default": "'Main navigation'",
              "kind": "field",
              "attribute": "accessible-label"
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "firstUpdated",
              "kind": "method",
              "privacy": "protected"
            },
            {
              "parameters": [
                {
                  "name": "oldVal",
                  "type": {
                    "text": "boolean"
                  }
                },
                {
                  "name": "newVal",
                  "type": {
                    "text": "boolean"
                  }
                }
              ],
              "name": "compactChanged",
              "kind": "method",
              "privacy": "protected"
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "close",
              "description": "Close Menus",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-primary/rh-navigation-primary.ts#L41"
          },
          "kind": "class",
          "tagName": "rh-navigation-primary",
          "attributes": [
            {
              "name": "mobile-toggle-label",
              "description": "Sets the mobile toggle (hamburger) text, used for translations, defaults to 'Menu'",
              "type": {
                "text": "string"
              },
              "default": "'Menu'",
              "fieldName": "mobileToggleLabel"
            },
            {
              "name": "color-palette",
              "description": "Sets color context for child components, overrides parent context",
              "type": {
                "text": "NavigationPrimaryPalette"
              },
              "fieldName": "colorPalette"
            },
            {
              "name": "accessible-label",
              "description": "Customize the default label for the navigation.\nDefaults to \"Main navigation\" if no value is set.",
              "type": {
                "text": "string"
              },
              "default": "'Main navigation'",
              "fieldName": "accessibleLabel"
            }
          ],
          "slots": [
            {
              "name": "logo",
              "description": "Use this slot to override the link and logo image for translations and sub sites."
            },
            {
              "name": "",
              "description": "Use this slot for `\u003crh-primary-navigation-item\u003e` hamburger menu links and dropdowns.\nIf left empty will result in accessibility issues."
            },
            {
              "name": "event",
              "description": "Use this slot for event promotion.  Images such as SVGs and links are most often slotted here.\nSlot these items using the `\u003crh-navigation-primary-item slot=\"event\"\u003e` element. If any \nother element is slotted here, it will need to be a role=\"listitem\" to avoid accessibility \nissues.  Other slotted elements will also likely have other rendering issues."
            },
            {
              "name": "links",
              "description": "Use this slot for quick links to other sites not directly associated with the page the\nnavigation is on.  Common use cases are developers docs and support. Slot these items using\nthe `\u003crh-navigation-primary-item slot=\"links\"\u003e` element. If any other element is slotted \nhere, it will need to be a role=\"listitem\" to avoid accessibility issues.  Other slotted \nelements will also likely have other rendering issues."
            },
            {
              "name": "dropdowns",
              "description": "Use this slot for search, for you, and account dropdowns. Slot these items using the\n`\u003crh-navigation-primary-item slot=\"dropdowns\" variant=\"dropdown\"\u003e` element. If any \nother element is slotted here, it will need to be a role=\"listitem\" to avoid accessibility \nissues.  Other slotted elements will also likely have other rendering issues."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-brand-red-light",
              "description": "Light brand red",
              "default": "#f56e6e",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-purple-40",
              "description": "Inline link visited (dark theme)",
              "default": "#876fd4",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-purple-60",
              "description": "Inline link visited (light theme)",
              "default": "#3d2785",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-navigation-primary-z-index",
              "default": "102"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-border-radius-pill",
              "description": "Pill border radius; Example: Label",
              "default": "64px"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darker",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "default": "2px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-subtle",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-secondary",
              "description": "Responsive `icon-secondary` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-icon-secondary-on-light` on a themable container with a light color palette and `--rh-color-icon-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xs",
              "description": "4px spacer",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "default": "light-dark(\n                var(--rh-color-text-primary-on-light, #151515),\n                var(--rh-color-text-primary-on-dark, #ffffff))",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-light",
              "description": "Primary text color for light theme",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-dark",
              "description": "Primary text color for dark theme",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-box-shadow-sm",
              "description": "Small box shadow",
              "default": "0 2px 4px 0 rgba(21, 21, 21, 0.2)",
              "syntax": "\u003cshadow\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "default": "1px",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/navigation-primary/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-primary/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-primary/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-primary/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-primary/demo/links-as-top-level/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-primary/demo/links-as-top-level.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-primary/demo/no-secondary-items/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-primary/demo/no-secondary-items.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-primary/demo/not-defined/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-primary/demo/not-defined.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-primary/demo/right-to-left/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-primary/demo/right-to-left.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-primary/demo/translation/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-primary/demo/translation.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-navigation-primary",
          "declaration": {
            "name": "RhNavigationPrimary",
            "module": "rh-navigation-primary/rh-navigation-primary.js"
          }
        },
        {
          "kind": "js",
          "name": "RhNavigationPrimary",
          "declaration": {
            "name": "RhNavigationPrimary",
            "module": "rh-navigation-primary/rh-navigation-primary.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-navigation-secondary/rh-navigation-secondary-dropdown.js",
      "declarations": [
        {
          "name": "SecondaryNavDropdownExpandEvent",
          "superclass": {
            "name": "ComposedEvent"
          },
          "members": [
            {
              "name": "expanded",
              "type": {
                "text": "boolean"
              },
              "kind": "field"
            },
            {
              "name": "toggle",
              "type": {
                "text": "RhNavigationSecondaryDropdown"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/rh-navigation-secondary-dropdown.ts#L15"
          },
          "kind": "class"
        },
        {
          "name": "RhNavigationSecondaryDropdown",
          "summary": "Upgrades a top level nav link to include dropdown functionality",
          "description": "Upgrades a top level nav link to include dropdown functionality",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "parameters": [
                {
                  "name": "oldVal",
                  "type": {
                    "text": "'false' | 'true'"
                  }
                },
                {
                  "name": "newVal",
                  "type": {
                    "text": "'false' | 'true'"
                  }
                }
              ],
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "_expandedChanged",
              "description": "When expanded property changes, check the new value, if true\nrun the `#open()` method, if false run the `#close()` method.",
              "kind": "method",
              "privacy": "protected"
            },
            {
              "parameters": [
                {
                  "name": "event",
                  "type": {
                    "text": "MouseEvent"
                  }
                }
              ],
              "name": "_clickHandler",
              "description": "When a dropdown is clicked set expanded to the opposite of the expanded property\nand then dispatch that value in a SecondaryNavDropdownExpandEvent",
              "kind": "method",
              "privacy": "private"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/rh-navigation-secondary-dropdown.ts#L38"
          },
          "kind": "class",
          "tagName": "rh-navigation-secondary-dropdown",
          "events": [
            {
              "name": "change",
              "description": "Fires when a dropdown is clicked",
              "type": {
                "text": " SecondaryNavDropdownExpandEvent "
              }
            }
          ],
          "slots": [
            {
              "name": "link",
              "description": "Link for dropdown, expects `\u003ca\u003e` element"
            },
            {
              "name": "menu",
              "description": "Menu for dropdown, expects `\u003crh-navigation-secondary-menu\u003e` element"
            }
          ],
          "cssParts": [
            {
              "name": "container"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-border-width-lg",
              "description": "3px border width: Example: Expanded Accordion panel",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle-on-light",
              "description": "Subtle border color (light theme)",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-box-shadow-sm",
              "description": "Small box shadow",
              "default": "0 2px 4px 0 rgba(21, 21, 21, 0.2)",
              "syntax": "\u003cshadow\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-brand-on-light",
              "description": "Brand text color for light theme",
              "default": "#ee0000",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-light",
              "description": "Primary text color for light theme",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "SecondaryNavDropdownExpandEvent",
          "declaration": {
            "name": "SecondaryNavDropdownExpandEvent",
            "module": "rh-navigation-secondary/rh-navigation-secondary-dropdown.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-navigation-secondary-dropdown",
          "declaration": {
            "name": "RhNavigationSecondaryDropdown",
            "module": "rh-navigation-secondary/rh-navigation-secondary-dropdown.js"
          }
        },
        {
          "kind": "js",
          "name": "RhNavigationSecondaryDropdown",
          "declaration": {
            "name": "RhNavigationSecondaryDropdown",
            "module": "rh-navigation-secondary/rh-navigation-secondary-dropdown.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-navigation-secondary/rh-navigation-secondary-menu-section.js",
      "declarations": [
        {
          "name": "RhNavigationSecondaryMenuSection",
          "summary": "'A menu section which auto upgrades accessibility for headers and sibling list'",
          "description": "A menu section which auto upgrades accessibility for headers and sibling list",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/rh-navigation-secondary-menu-section.ts#L16"
          },
          "kind": "class",
          "tagName": "rh-navigation-secondary-menu-section",
          "slots": [
            {
              "name": "header",
              "description": "Adds a header tag to section, expects `\u003ch1\u003e | \u003ch2\u003e | \u003ch3\u003e | \u003ch4\u003e | \u003ch5\u003e | \u003ch6\u003e` element"
            },
            {
              "name": "links",
              "description": "Adds a ul tag to section, expects `\u003cul\u003e | \u003col\u003e` element"
            },
            {
              "name": "cta",
              "description": "Adds a section level CTA, expects `\u003crh-cta\u003e` element"
            }
          ],
          "cssParts": [
            {
              "name": "container",
              "description": "container, \u003csection\u003e element"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-navigation-secondary-menu-section",
          "declaration": {
            "name": "RhNavigationSecondaryMenuSection",
            "module": "rh-navigation-secondary/rh-navigation-secondary-menu-section.js"
          }
        },
        {
          "kind": "js",
          "name": "RhNavigationSecondaryMenuSection",
          "declaration": {
            "name": "RhNavigationSecondaryMenuSection",
            "module": "rh-navigation-secondary/rh-navigation-secondary-menu-section.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-navigation-secondary/rh-navigation-secondary-menu.js",
      "declarations": [
        {
          "name": "RhNavigationSecondaryMenu",
          "summary": "'Dropdown menu for secondary nav, available in full-width and fixed-with sizes'",
          "description": "Dropdown menu for secondary nav, available in full-width and fixed-with sizes",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "colorPalette",
              "description": "Color palette (default: lightest)\nSecondary nav menus are always represented on the lightest color palette.",
              "type": {
                "text": "ColorPalette"
              },
              "default": "'lightest'",
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            },
            {
              "name": "layout",
              "description": "Layout (default: full-width)\nSecondary nav menus by default are always full-width, but can be set to fixed-width for special cases.",
              "type": {
                "text": "'fixed-width' | 'full-width'"
              },
              "default": "'full-width'",
              "kind": "field",
              "attribute": "layout",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/rh-navigation-secondary-menu.ts#L21"
          },
          "kind": "class",
          "tagName": "rh-navigation-secondary-menu",
          "attributes": [
            {
              "name": "color-palette",
              "description": "Color palette (default: lightest)\nSecondary nav menus are always represented on the lightest color palette.",
              "type": {
                "text": "ColorPalette"
              },
              "default": "'lightest'",
              "fieldName": "colorPalette"
            },
            {
              "name": "layout",
              "description": "Layout (default: full-width)\nSecondary nav menus by default are always full-width, but can be set to fixed-width for special cases.",
              "type": {
                "text": "'fixed-width' | 'full-width'"
              },
              "default": "'full-width'",
              "fieldName": "layout"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Optional `\u003crh-navigation-secondary-menu-section\u003e` elements or content following [design guidelines](../guidelines/#expandable-tray)"
            }
          ],
          "cssParts": [
            {
              "name": "full-width",
              "description": "container - `\u003cdiv\u003e` element, wrapper for full-width menus"
            },
            {
              "name": "fixed-width",
              "description": "container - `\u003cdiv\u003e` element, wrapper for fixed-width menus"
            },
            {
              "name": "sections",
              "description": "container - `\u003cdiv\u003e` element, wrapper for menu sections"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-text-primary-on-light",
              "description": "Primary text color for light theme",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-navigation-secondary-menu-section-grid",
              "description": "grid-template-columns for menu sections",
              "default": "repeat(auto-fit,\n      minmax(15.5rem, 1fr))"
            },
            {
              "name": "--rh-navigation-secondary-menu-section-grid-gap",
              "description": "grid-gap for menu sections",
              "default": "var(--rh-space-2xl, 32px)"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-box-shadow-sm",
              "description": "Small box shadow",
              "default": "0 2px 4px 0 rgba(21, 21, 21, 0.2)",
              "syntax": "\u003cshadow\u003e"
            },
            {
              "name": "--rh-navigation-secondary-menu-content-max-width",
              "description": "max-width for menu content",
              "default": "1136px"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-3xl",
              "description": "48px spacer",
              "default": "48px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-4xl",
              "description": "64px spacer",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-navigation-secondary-menu",
          "declaration": {
            "name": "RhNavigationSecondaryMenu",
            "module": "rh-navigation-secondary/rh-navigation-secondary-menu.js"
          }
        },
        {
          "kind": "js",
          "name": "RhNavigationSecondaryMenu",
          "declaration": {
            "name": "RhNavigationSecondaryMenu",
            "module": "rh-navigation-secondary/rh-navigation-secondary-menu.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-navigation-secondary/rh-navigation-secondary-overlay.js",
      "declarations": [
        {
          "name": "RhNavigationSecondaryOverlay",
          "summary": "An overlay element to cover content with an opacity when navigation is expanded.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "open",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "open",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/rh-navigation-secondary-overlay.ts#L11"
          },
          "kind": "class",
          "tagName": "rh-navigation-secondary-overlay",
          "attributes": [
            {
              "name": "open",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "open"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-gray-90",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-opacity-80",
              "description": "80% opacity",
              "default": "80%"
            },
            {
              "name": "--rh-navigation-secondary-overlay-z-index",
              "description": "z-index of the navigation-secondary-overlay",
              "default": "var(--rh-secondary-nav-overlay-z-index, -1)"
            },
            {
              "name": "--rh-secondary-nav-overlay-z-index",
              "default": "-1",
              "deprecated": "use --rh-navigation-secondary-overlay-z-index"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-navigation-secondary-overlay",
          "declaration": {
            "name": "RhNavigationSecondaryOverlay",
            "module": "rh-navigation-secondary/rh-navigation-secondary-overlay.js"
          }
        },
        {
          "kind": "js",
          "name": "RhNavigationSecondaryOverlay",
          "declaration": {
            "name": "RhNavigationSecondaryOverlay",
            "module": "rh-navigation-secondary/rh-navigation-secondary-overlay.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-navigation-secondary/rh-navigation-secondary.js",
      "declarations": [
        {
          "name": "SecondaryNavOverlayChangeEvent",
          "superclass": {
            "name": "ComposedEvent"
          },
          "members": [
            {
              "name": "open",
              "type": {
                "text": "boolean"
              },
              "kind": "field"
            },
            {
              "name": "toggle",
              "type": {
                "text": "HTMLElement"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/rh-navigation-secondary.ts#L26"
          },
          "kind": "class"
        },
        {
          "name": "RhNavigationSecondary",
          "summary": "Propagates related content across a series of pages",
          "description": "The secondary navigation is used to connect a series of pages together. It displays wayfinding content and links relevant to the page it is placed on. It should be used in conjunction with the [primary navigation](../navigation-primary).",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "instances",
              "default": "new Set\u003cRhNavigationSecondary\u003e()",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "colorPalette",
              "description": "Color palette dark | lighter (default: lighter)",
              "type": {
                "text": "ColorPalette"
              },
              "default": "'lighter'",
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            },
            {
              "name": "accessibleLabel",
              "description": "Customize the default `aria-label` on the `\u003cnav\u003e` container.\nDefaults to \"secondary\" if no attribute/property is set.",
              "type": {
                "text": "string"
              },
              "default": "'secondary'",
              "kind": "field",
              "attribute": "accessible-label"
            },
            {
              "parameters": [
                {
                  "name": "element",
                  "type": {
                    "text": "Element | null"
                  }
                }
              ],
              "name": "isDropdown",
              "description": "Checks if passed in element is a RhNavigationSecondaryDropdown",
              "kind": "method",
              "static": true
            },
            {
              "name": "firstUpdated",
              "kind": "method"
            },
            {
              "parameters": [
                {
                  "name": "index",
                  "type": {
                    "text": "number"
                  }
                }
              ],
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "open",
              "description": "Opens a specific dropdown based on index.\nCloses all open dropdowns before opening specified.\nToggles overlay to open",
              "kind": "method",
              "privacy": "public"
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "close",
              "description": "Closes all open dropdowns",
              "kind": "method",
              "privacy": "public"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/rh-navigation-secondary.ts#L64"
          },
          "kind": "class",
          "tagName": "rh-navigation-secondary",
          "attributes": [
            {
              "name": "color-palette",
              "description": "Color palette dark | lighter (default: lighter)",
              "type": {
                "text": "ColorPalette"
              },
              "default": "'lighter'",
              "fieldName": "colorPalette"
            },
            {
              "name": "accessible-label",
              "description": "Customize the default `aria-label` on the `\u003cnav\u003e` container.\nDefaults to \"secondary\" if no attribute/property is set.",
              "type": {
                "text": "string"
              },
              "default": "'secondary'",
              "fieldName": "accessibleLabel"
            }
          ],
          "events": [
            {
              "name": "overlay-change",
              "description": "Fires when an dropdown is opened or closed in desktop\nview or when the mobile menu button is toggled in mobile\nview.",
              "type": {
                "text": "SecondaryNavOverlayChangeEvent"
              }
            }
          ],
          "slots": [
            {
              "name": "logo",
              "description": "Logo added to the main nav bar, expects `\u003ca\u003eText\u003c/a\u003e | \u003ca\u003e\u003csvg/\u003e\u003c/a\u003e | \u003ca\u003e\u003cimg/\u003e\u003c/a\u003e` element"
            },
            {
              "name": "mobile-menu",
              "description": "Text label for the mobile menu button, for l10n. Defaults to \"Menu\""
            },
            {
              "name": "nav",
              "description": "Navigation list added to the main nav bar, expects `\u003cul\u003e` element"
            },
            {
              "name": "cta",
              "description": "Nav bar level CTA, expects `\u003crh-cta\u003e` element"
            }
          ],
          "cssParts": [
            {
              "name": "nav",
              "description": "container, `\u003cnav\u003e` element"
            },
            {
              "name": "container",
              "description": "container, `\u003cdiv\u003e` element"
            },
            {
              "name": "cta",
              "description": "container, `\u003cdiv\u003e` element"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-brand-red",
              "description": "Responsive `brand-red` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-brand-red-on-light` on a themable container with a light color palette and `--rh-color-brand-red-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-navigation-secondary-z-index",
              "description": "z-index of the navigation-secondary",
              "default": "102"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-lg",
              "description": "3px border width: Example: Expanded Accordion panel",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-brand-on-light",
              "description": "Brand text color for light theme",
              "default": "#ee0000",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-dark",
              "description": "Primary text color for dark theme",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-light",
              "description": "Primary text color for light theme",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/navigation-secondary/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-secondary/demo/analytics/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/demo/analytics.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-secondary/demo/current-page-indicator/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/demo/current-page-indicator.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-secondary/demo/dark-variant/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/demo/dark-variant.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-secondary/demo/long-logo-text/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/demo/long-logo-text.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-secondary/demo/right-to-left/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/demo/right-to-left.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-secondary/demo/translation/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/demo/translation.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-secondary/demo/with-long-content/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-secondary/demo/with-long-content.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "SecondaryNavOverlayChangeEvent",
          "declaration": {
            "name": "SecondaryNavOverlayChangeEvent",
            "module": "rh-navigation-secondary/rh-navigation-secondary.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-navigation-secondary",
          "declaration": {
            "name": "RhNavigationSecondary",
            "module": "rh-navigation-secondary/rh-navigation-secondary.js"
          }
        },
        {
          "kind": "js",
          "name": "RhNavigationSecondary",
          "declaration": {
            "name": "RhNavigationSecondary",
            "module": "rh-navigation-secondary/rh-navigation-secondary.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-navigation-vertical/rh-navigation-vertical-list.js",
      "declarations": [
        {
          "name": "RhNavigationVerticalList",
          "summary": "Vertical navigation group",
          "description": "A disclosure menu of grouped navigation items in a vertical navigation list.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "preventEscElements",
              "default": "[\\n    'input:not([type=\"hidden\"]):not([type=\"radio\"])',\\n\\n    // Elements that need the :disabled selector:\\n    ...[\\n      'input[type=\"radio\"]',\\n      'select',\\n      'textarea',\\n      'rh-audio-player',\\n      'rh-dialog',\\n    ].map(selector =\u003e `${selector}:not([inert]):not([inert] *):not([tabindex^='-']):not(:disabled)`),\\n\\n    // Elements that don't need the :disabled selector:\\n    ...[\\n      'iframe',\\n      'audio[controls]',\\n      'video[controls]',\\n      '[contenteditable]',\\n    ].map(selector =\u003e `${selector}:not([inert]):not([inert] *):not([tabindex^='-'])`),\\n  ].join(',')",
              "readonly": true,
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "open",
              "description": "Optional open attribute that, sets the open state of the group.\nDefaults to false.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "open",
              "reflects": true
            },
            {
              "name": "highlight",
              "description": "Bolds the first `\u003crh-navigation-link\u003e` of the group. Should not be used if the first child is a `\u003crh-navigation-vertical-list\u003e`.\nDefaults to false.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "highlight",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-vertical/rh-navigation-vertical-list.ts#L20"
          },
          "kind": "class",
          "tagName": "rh-navigation-vertical-list",
          "attributes": [
            {
              "name": "open",
              "description": "Optional open attribute that, sets the open state of the group.\nDefaults to false.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "open"
            },
            {
              "name": "highlight",
              "description": "Bolds the first `\u003crh-navigation-link\u003e` of the group. Should not be used if the first child is a `\u003crh-navigation-vertical-list\u003e`.\nDefaults to false.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "highlight"
            }
          ],
          "slots": [
            {
              "name": "summary",
              "description": "A summary slot for the group title, overrides the summary attribute"
            },
            {
              "name": "",
              "description": "Use this slot for `\u003crh-navigation-link\u003e` or `\u003crh-navigation-vertical-list\u003e` elements."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-space-xs",
              "description": "4px spacer",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-brand-red",
              "description": "Responsive `brand-red` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-brand-red-on-light` on a themable container with a light color palette and `--rh-color-brand-red-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-medium",
              "description": "Medium font weight",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-navigation-vertical-list",
          "declaration": {
            "name": "RhNavigationVerticalList",
            "module": "rh-navigation-vertical/rh-navigation-vertical-list.js"
          }
        },
        {
          "kind": "js",
          "name": "RhNavigationVerticalList",
          "declaration": {
            "name": "RhNavigationVerticalList",
            "module": "rh-navigation-vertical/rh-navigation-vertical-list.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-navigation-vertical/rh-navigation-vertical.js",
      "declarations": [
        {
          "name": "RhNavigationVertical",
          "summary": "Vertical navigation",
          "description": "A vertical navigation list of top-level and grouped navigation items, typically used in a side navigation pattern.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "accessibleLabel",
              "description": "The accessible-label attribute labels the navigation using a visually hidden heading.\nDefaults to 'Navigation'. This label should be changed if other navigation elements\nare present or when translations are needed.",
              "type": {
                "text": "string"
              },
              "default": "'Navigation'",
              "kind": "field",
              "attribute": "accessible-label"
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "firstUpdated",
              "kind": "method",
              "privacy": "protected"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-vertical/rh-navigation-vertical.ts#L25"
          },
          "kind": "class",
          "tagName": "rh-navigation-vertical",
          "attributes": [
            {
              "name": "accessible-label",
              "description": "The accessible-label attribute labels the navigation using a visually hidden heading.\nDefaults to 'Navigation'. This label should be changed if other navigation elements\nare present or when translations are needed.",
              "type": {
                "text": "string"
              },
              "default": "'Navigation'",
              "fieldName": "accessibleLabel"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Use this slot for `\u003crh-navigation-link\u003e` elements to provide a list of navigation links  \nand `\u003crh-navigation-vertical-list\u003e` when providing a grouped list of navigation links."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darker",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-xs",
              "description": "4px spacer",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-lg",
              "description": "3px border width: Example: Expanded Accordion panel",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-brand-red",
              "description": "Responsive `brand-red` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-brand-red-on-light` on a themable container with a light color palette and `--rh-color-brand-red-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/navigation-vertical/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-vertical/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-vertical/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-vertical/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-vertical/demo/contained/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-vertical/demo/contained.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-vertical/demo/nested/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-vertical/demo/nested.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-vertical/demo/open/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-vertical/demo/open.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-vertical/demo/slotted-anchor-links/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-vertical/demo/slotted-anchor-links.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/navigation-vertical/demo/slotted-icons/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-navigation-vertical/demo/slotted-icons.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-navigation-vertical",
          "declaration": {
            "name": "RhNavigationVertical",
            "module": "rh-navigation-vertical/rh-navigation-vertical.js"
          }
        },
        {
          "kind": "js",
          "name": "RhNavigationVertical",
          "declaration": {
            "name": "RhNavigationVertical",
            "module": "rh-navigation-vertical/rh-navigation-vertical.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-pagination/rh-pagination.js",
      "declarations": [
        {
          "name": "RhPagination",
          "summary": "Allows users to navigate content divided into pages",
          "description": "A paginator allows users to navigate between pages of related content.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "instances",
              "default": "new Set\u003cRhPagination\u003e()",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "overflow",
              "description": "Override `overflow` values set from HTML or JS.\n`overflow` should ideally be private, but because\nwe can't do `::slotted(nav ol li)`, we need to reflect\nit to a host attribute, so that lightdom CSS can target\nthe list items.",
              "type": {
                "text": "'start' | 'end' | 'both' | null"
              },
              "default": "null",
              "kind": "field",
              "attribute": "overflow",
              "reflects": true
            },
            {
              "name": "label",
              "description": "Accessible label for the 'nav' element",
              "type": {
                "text": "string"
              },
              "default": "'Page navigation'",
              "kind": "field",
              "attribute": "label"
            },
            {
              "name": "labelFirst",
              "description": "Accessible label for the 'first page' button",
              "type": {
                "text": "string"
              },
              "default": "'first page'",
              "kind": "field",
              "attribute": "label-first"
            },
            {
              "name": "labelPrevious",
              "description": "Accessible label for the 'previous page' button",
              "type": {
                "text": "string"
              },
              "default": "'previous page'",
              "kind": "field",
              "attribute": "label-previous"
            },
            {
              "name": "labelNext",
              "description": "Accessible label for the 'next page' button",
              "type": {
                "text": "string"
              },
              "default": "'next page'",
              "kind": "field",
              "attribute": "label-next"
            },
            {
              "name": "labelLast",
              "description": "Accessible label for the 'last page' button",
              "type": {
                "text": "string"
              },
              "default": "'last page'",
              "kind": "field",
              "attribute": "label-last"
            },
            {
              "name": "size",
              "description": "Change pagination size to small",
              "type": {
                "text": "'sm' | null"
              },
              "default": "null",
              "kind": "field",
              "attribute": "size",
              "reflects": true
            },
            {
              "name": "variant",
              "description": "\"Open\" variant",
              "type": {
                "text": "'open' | null"
              },
              "default": "null",
              "kind": "field",
              "attribute": "variant",
              "reflects": true
            },
            {
              "name": "first",
              "description": "Navigate to the first page",
              "kind": "method"
            },
            {
              "name": "prev",
              "description": "Navigate to the previous page",
              "kind": "method"
            },
            {
              "name": "next",
              "description": "Navigate to the next page",
              "kind": "method"
            },
            {
              "name": "last",
              "description": "Navigate to the last page",
              "kind": "method"
            },
            {
              "parameters": [
                {
                  "name": "page",
                  "type": {
                    "text": "'first' | 'prev' | 'next' | 'last' | number"
                  }
                }
              ],
              "name": "go",
              "description": "Navigate to a specific page",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/rh-pagination.ts#L36"
          },
          "kind": "class",
          "tagName": "rh-pagination",
          "attributes": [
            {
              "name": "overflow",
              "description": "Override `overflow` values set from HTML or JS.\n`overflow` should ideally be private, but because\nwe can't do `::slotted(nav ol li)`, we need to reflect\nit to a host attribute, so that lightdom CSS can target\nthe list items.",
              "type": {
                "text": "'start' | 'end' | 'both' | null"
              },
              "default": "null",
              "fieldName": "overflow"
            },
            {
              "name": "label",
              "description": "Accessible label for the 'nav' element",
              "type": {
                "text": "string"
              },
              "default": "'Page navigation'",
              "fieldName": "label"
            },
            {
              "name": "label-first",
              "description": "Accessible label for the 'first page' button",
              "type": {
                "text": "string"
              },
              "default": "'first page'",
              "fieldName": "labelFirst"
            },
            {
              "name": "label-previous",
              "description": "Accessible label for the 'previous page' button",
              "type": {
                "text": "string"
              },
              "default": "'previous page'",
              "fieldName": "labelPrevious"
            },
            {
              "name": "label-next",
              "description": "Accessible label for the 'next page' button",
              "type": {
                "text": "string"
              },
              "default": "'next page'",
              "fieldName": "labelNext"
            },
            {
              "name": "label-last",
              "description": "Accessible label for the 'last page' button",
              "type": {
                "text": "string"
              },
              "default": "'last page'",
              "fieldName": "labelLast"
            },
            {
              "name": "size",
              "description": "Change pagination size to small",
              "type": {
                "text": "'sm' | null"
              },
              "default": "null",
              "fieldName": "size"
            },
            {
              "name": "variant",
              "description": "\"Open\" variant",
              "type": {
                "text": "'open' | null"
              },
              "default": "null",
              "fieldName": "variant"
            }
          ],
          "slots": [
            {
              "name": "go-to-page",
              "description": "\"Go to page\" text, defaults to \"Page\""
            },
            {
              "name": "out-of"
            },
            {
              "name": "",
              "description": "An ordered list of links"
            }
          ],
          "cssParts": [
            {
              "name": "numeric",
              "description": "shared container for the numeric controls at all widths"
            },
            {
              "name": "container",
              "description": "pagination container"
            },
            {
              "name": "numeric-middle",
              "description": "container for the numeric control at medium screen widths"
            },
            {
              "name": "numeric-end",
              "description": "container for the numeric control at small and large screen widths"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-length-3xl",
              "description": "48px length token",
              "default": "48px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xs",
              "description": "4px spacer",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-visited-default",
              "description": "Responsive `interactive-primary-visited` (e.g. visited link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-visited-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-visited-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-visited-hover",
              "description": "Responsive `interactive-primary-visited` (e.g. visited link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-visited-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-visited-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-dark",
              "description": "Primary text color for dark theme",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-subtle-on-light",
              "description": "Subtle border color (light theme)",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-secondary-on-dark",
              "description": "Secondary text color for dark theme",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-status-disabled"
            },
            {
              "name": "--rh-pagination-stepper-color",
              "description": "Sets the stepper color.",
              "default": "var(--rh-color-gray-50, #707070)"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-heading-xs",
              "description": "h6 heading font size",
              "default": "1.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-lg",
              "description": "3px border width: Example: Expanded Accordion panel",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-interactive",
              "description": "Responsive `border-interactive` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-interactive-on-light` on a themable container with a light color palette and `--rh-color-border-interactive-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-pagination-background-focused",
              "description": "Sets the disabled stepper color."
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-2xl",
              "description": "32px length token",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-4xl",
              "description": "64px length token",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-60",
              "description": "Secondary text (light theme)",
              "default": "#4d4d4d",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-pagination-accent-color",
              "description": "Sets the outline color when the page input has focus.",
              "default": "var(--rh-color-interactive-primary-default)"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-sm",
              "description": "6px spacer",
              "default": "6px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-red-60",
              "description": "Dark brand red",
              "default": "#a60000",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-40",
              "description": "Light brand red",
              "default": "#f56e6e",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-gray-50",
              "description": "Subtle icon",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/aria-current/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/aria-current.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/compact/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/compact.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/many-pages/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/many-pages.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/no-numeric-control/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/no-numeric-control.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/open-compact-size/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/open-compact-size.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/open-compact/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/open-compact.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/open/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/open.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/overflow/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/overflow.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/right-to-left/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/right-to-left.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/size-compact/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/size-compact.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/size/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/size.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/pagination/demo/vue/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-pagination/demo/vue.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-pagination",
          "declaration": {
            "name": "RhPagination",
            "module": "rh-pagination/rh-pagination.js"
          }
        },
        {
          "kind": "js",
          "name": "RhPagination",
          "declaration": {
            "name": "RhPagination",
            "module": "rh-pagination/rh-pagination.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-progress-stepper/rh-progress-step.js",
      "declarations": [
        {
          "name": "RhProgressStepChangeEvent",
          "description": "Fired when a step becomes active",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-progress-stepper/rh-progress-step.ts#L43"
          },
          "kind": "class"
        },
        {
          "name": "RhProgressStep",
          "summary": "Single step in a progress stepper",
          "description": "A progress step represents a single step in a progress stepper.\nEach step can have different states and may include an icon, label,\nand description. Steps can also be linked to URLs.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "state",
              "description": "Sets the state of the progress step\n- `inactive` - The step is not active\n- `active` - The step is currently active\n- `complete` - The step has been completed\n- `warn` - The step is in a warning state\n- `fail` - The step has failed\n- `custom` - The step uses a custom icon",
              "type": {
                "text": "ProgressStepState"
              },
              "kind": "field",
              "attribute": "state",
              "reflects": true
            },
            {
              "name": "description",
              "description": "Sets the description text for the progress step when more context is needed.\nDescriptions are secondary to titles.\n\nIt is overridden by the `description` slot.",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "description",
              "reflects": true
            },
            {
              "name": "icon",
              "description": "Can be used to set a custom icon for the step.\nWhen the step is in the `warn` or `fail` state, it should not have a custom icon.\nIf there's no custom icon, the default active or inactive icon will appear.\n\nIt can be overridden by the `icon` slot.",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "kind": "field",
              "attribute": "icon"
            },
            {
              "name": "iconSet",
              "description": "Icon set for the `icon` property - 'ui' by default",
              "type": {
                "text": "IconSetName"
              },
              "default": "'ui'",
              "kind": "field",
              "attribute": "icon-set"
            },
            {
              "name": "href",
              "description": "Sets a URL to make the step's title clickable.\nOnly completed or current steps will appear linked.\nThe linked title will use our inline link styling, with gray, dashed underlines.",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "href",
              "reflects": true
            },
            {
              "name": "computeIcon",
              "description": "Icons for each step indicates the status of a process or task.\nIcons change as users progress.\n\nComputes the icon for the step:",
              "kind": "method",
              "privacy": "protected"
            },
            {
              "name": "stateChanged",
              "kind": "method",
              "privacy": "protected"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-progress-stepper/rh-progress-step.ts#L60"
          },
          "kind": "class",
          "tagName": "rh-progress-step",
          "attributes": [
            {
              "name": "state",
              "description": "Sets the state of the progress step\n- `inactive` - The step is not active\n- `active` - The step is currently active\n- `complete` - The step has been completed\n- `warn` - The step is in a warning state\n- `fail` - The step has failed\n- `custom` - The step uses a custom icon",
              "type": {
                "text": "ProgressStepState"
              },
              "fieldName": "state"
            },
            {
              "name": "description",
              "description": "Sets the description text for the progress step when more context is needed.\nDescriptions are secondary to titles.\n\nIt is overridden by the `description` slot.",
              "type": {
                "text": "string"
              },
              "fieldName": "description"
            },
            {
              "name": "icon",
              "description": "Can be used to set a custom icon for the step.\nWhen the step is in the `warn` or `fail` state, it should not have a custom icon.\nIf there's no custom icon, the default active or inactive icon will appear.\n\nIt can be overridden by the `icon` slot.",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "fieldName": "icon"
            },
            {
              "name": "icon-set",
              "description": "Icon set for the `icon` property - 'ui' by default",
              "type": {
                "text": "IconSetName"
              },
              "default": "'ui'",
              "fieldName": "iconSet"
            },
            {
              "name": "href",
              "description": "Sets a URL to make the step's title clickable.\nOnly completed or current steps will appear linked.\nThe linked title will use our inline link styling, with gray, dashed underlines.",
              "type": {
                "text": "string"
              },
              "fieldName": "href"
            }
          ],
          "events": [
            {
              "name": "change",
              "description": "fired when this step becomes active",
              "type": {
                "text": " RhProgressStepChangeEvent "
              }
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "A short title (1 to 3 words) for each step is required and serves as the step's accessible name.\nTitles can be hyperlinked. Do not add punctuation to end."
            },
            {
              "name": "icon",
              "summary": "custom icon for the step",
              "description": "Overrides the `icon` and `icon-set` attributes.\nPrefer using the `icon` attribute and the (default) UI Icon set.\nAvoid slotting content here if the step is in the `warn` or `fail` state,\nSince those states should always show their prescribed icons."
            },
            {
              "name": "description",
              "summary": "Elaborative, optional description for the step",
              "description": "Rich HTML content can be slotted here , to override the (plain text) `description` attribute.\nAvoid slotting links, images, block-level content, etc.: descriptions should be prose only \n(around 40 characters or a max of 2 lines at the 768px breakpoint)."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-text-primary",
              "summary": "Icon color (default state)\n\nLabel text color (default state)",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-length-5xl",
              "summary": "Horizontal padding in compact mode at wide viewports",
              "description": "80px length token",
              "default": "80px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-secondary",
              "summary": "A step's description color",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "summary": "Font family for step labels and descriptions",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "summary": "Font size for step labels",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-50",
              "description": "Subtle icon",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "summary": "Link text color on hover\n\nLink underline color on hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "summary": "Font weight for labels of steps\n\nFont weight for step descriptions",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "summary": "Font size for step descriptions",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-status-note",
              "summary": "Icon color when step is active",
              "description": "Responsive `status-note` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-note-on-light` on a themable container with a light color palette and `--rh-color-status-note-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-success",
              "summary": "Icon color when step is complete",
              "description": "Responsive `status-success` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-success-on-light` on a themable container with a light color palette and `--rh-color-status-success-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-50",
              "summary": "Warning icon color in light mode",
              "default": "#b98412",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-30",
              "summary": "Warning icon color in dark mode",
              "default": "#ffcc17",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-60",
              "summary": "Warning label color in light mode",
              "default": "#96640f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-20",
              "summary": "Warning label color in dark mode",
              "default": "#ffe072",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-danger",
              "summary": "Icon color when step has failed\n\nLabel color when step has failed",
              "description": "Responsive `status-danger` color value. Typically read-only – use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-danger-on-light` on a themable container with a light color palette and `--rh-color-status-danger-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-medium",
              "summary": "Font weight for current/active/warn/fail step labels",
              "description": "Medium font weight",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "RhProgressStepChangeEvent",
          "declaration": {
            "name": "RhProgressStepChangeEvent",
            "module": "rh-progress-stepper/rh-progress-step.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-progress-step",
          "declaration": {
            "name": "RhProgressStep",
            "module": "rh-progress-stepper/rh-progress-step.js"
          }
        },
        {
          "kind": "js",
          "name": "RhProgressStep",
          "declaration": {
            "name": "RhProgressStep",
            "module": "rh-progress-stepper/rh-progress-step.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-progress-stepper/rh-progress-stepper.js",
      "declarations": [
        {
          "name": "RhProgressStepper",
          "summary": "Communicate how many steps are required to complete a process",
          "description": "A progress stepper conveys the steps necessary to complete a process or task, and the status of\neach step. Steps have titles and descriptions; and each step can be in one of a number of possible states:\n- inactive (yet to be performed)\n- active (currently being performed)\n- warn (succeeded, but with warnings)\n- fail (failed to occur)\nOr a custom state, set using the `icon` attribute.\n\n## Usage guidelines\n- Use 3-5 steps maximum to reduce cognitive load\n- Designed to complement standard previous/next navigation. Avoid using as the only navigation.\n- When process is completed, users cannot go back and must start over\n\n## Accessibility\n- Communicates list structure and step states to screen readers\n- Supports keyboard navigation for linked step titles\n- Maintains logical focus order (left to right, top to bottom)\n- Provides aria-current for the active step",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "verticalAt",
              "description": "Makes the element `vertical` at various container query based breakpoints.\nBreakpoints available 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'\n\nUse when horizontal space becomes limited. The element automatically\nchanges to vertical orientation at screen sizes of \u003c768px.",
              "type": {
                "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'"
              },
              "default": "undefined",
              "kind": "field",
              "attribute": "vertical-at",
              "reflects": true
            },
            {
              "name": "orientation",
              "description": "Sets the orientation of the progress stepper.\n- `horizontal` - Steps are displayed in a horizontal row (default)\n- `vertical` - Steps are displayed in a vertical column\n\n## Responsive behavior\n- \u003e992px: Padding between steps is set to --rh-space-5xl\n- ≤992px: Padding reduces to --rh-space-2xl\n- \u003c768px: Orientation automatically changes to vertical\n\nUse vertical orientation when horizontal space is limited or when\nyou need to display more detailed step information.",
              "type": {
                "text": "ProgressStepsOrientation"
              },
              "default": "'horizontal'",
              "kind": "field",
              "attribute": "orientation",
              "reflects": true
            },
            {
              "name": "compact",
              "description": "Makes element display as `compact`.\n\n## Usage guidelines\n- Use when there is limited space and less visual prominence is needed\n- Maintain the compact size as designed - do not stretch spacing between steps\n- Switch to default size or different orientation instead of stretching compact\n- Always include step titles even in compact mode for accessibility",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "compact",
              "reflects": true
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "firstUpdated",
              "description": "Initializes responsive behavior on first update.\nSets mobile state based on element width,\nensuring the stepper displays correctly on initial load.",
              "kind": "method",
              "privacy": "protected"
            },
            {
              "name": "verticalAtChanged",
              "description": "Handles changes to the verticalAt property.\nUpdates the breakpoint threshold for responsive vertical orientation switching.",
              "kind": "method",
              "privacy": "protected"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-progress-stepper/rh-progress-stepper.ts#L72"
          },
          "kind": "class",
          "tagName": "rh-progress-stepper",
          "attributes": [
            {
              "name": "vertical-at",
              "description": "Makes the element `vertical` at various container query based breakpoints.\nBreakpoints available 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'\n\nUse when horizontal space becomes limited. The element automatically\nchanges to vertical orientation at screen sizes of \u003c768px.",
              "type": {
                "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'"
              },
              "default": "undefined",
              "fieldName": "verticalAt"
            },
            {
              "name": "orientation",
              "description": "Sets the orientation of the progress stepper.\n- `horizontal` - Steps are displayed in a horizontal row (default)\n- `vertical` - Steps are displayed in a vertical column\n\n## Responsive behavior\n- \u003e992px: Padding between steps is set to --rh-space-5xl\n- ≤992px: Padding reduces to --rh-space-2xl\n- \u003c768px: Orientation automatically changes to vertical\n\nUse vertical orientation when horizontal space is limited or when\nyou need to display more detailed step information.",
              "type": {
                "text": "ProgressStepsOrientation"
              },
              "default": "'horizontal'",
              "fieldName": "orientation"
            },
            {
              "name": "compact",
              "description": "Makes element display as `compact`.\n\n## Usage guidelines\n- Use when there is limited space and less visual prominence is needed\n- Maintain the compact size as designed - do not stretch spacing between steps\n- Switch to default size or different orientation instead of stretching compact\n- Always include step titles even in compact mode for accessibility",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "compact"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Use this slot for `\u003crh-progress-step\u003e` items\nEach step should include title and optional description"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-border-strong",
              "summary": "Connecting line color between steps",
              "description": "Responsive `border-strong` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-border-strong-on-light` on a themable container with a light color palette and `--rh-color-border-strong-on-dark` on a themable container with a dark color palette",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "summary": "Step label color (default state)",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-length-xl",
              "summary": "Base icon container size",
              "description": "24px length token",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-size-icon-02",
              "summary": "Icon size for step indicators",
              "description": "24px icon box",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "summary": "Connecting line color for inactive steps",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-length-2xl",
              "summary": "Horizontal padding between steps in compact mode\n\nVertical padding between steps in compact vertical mode",
              "description": "32px length token",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-xs",
              "summary": "Vertical spacing between rows in step grid\n\nVertical spacing between step elements",
              "description": "4px length token",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-lg",
              "summary": "Horizontal gap between step elements\n\nVertical spacing between stepper elements\n\nHorizontal gap between icon and label in vertical mode\n\nHorizontal padding in compact horizontal mode\n\nVertical padding in compact vertical mode\n\nHorizontal padding override for compact steps",
              "description": "16px length token",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-status-note",
              "summary": "Color for active step in compact mode",
              "description": "Responsive `status-note` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-note-on-light` on a themable container with a light color palette and `--rh-color-status-note-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-success",
              "summary": "Color for completed step in compact mode",
              "description": "Responsive `status-success` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-success-on-light` on a themable container with a light color palette and `--rh-color-status-success-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-50",
              "summary": "Warning step color in light mode",
              "default": "#b98412",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-30",
              "summary": "Warning step color in dark mode",
              "default": "#ffcc17",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-60",
              "summary": "Warning step label color in light mode",
              "default": "#96640f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-20",
              "summary": "Warning step label color in dark mode",
              "default": "#ffe072",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-danger",
              "summary": "Color for failed step icon in compact mode\n\nColor for failed step label in compact mode",
              "description": "Responsive `status-danger` color value. Typically read-only – use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-danger-on-light` on a themable container with a light color palette and `--rh-color-status-danger-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/progress-stepper/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-progress-stepper/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/progress-stepper/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-progress-stepper/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/progress-stepper/demo/compact-horizontal/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-progress-stepper/demo/compact-horizontal.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/progress-stepper/demo/compact-vertical/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-progress-stepper/demo/compact-vertical.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/progress-stepper/demo/custom-icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-progress-stepper/demo/custom-icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/progress-stepper/demo/linked-steps/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-progress-stepper/demo/linked-steps.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/progress-stepper/demo/rich-descriptions/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-progress-stepper/demo/rich-descriptions.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/progress-stepper/demo/vertical-at/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-progress-stepper/demo/vertical-at.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/progress-stepper/demo/vertical-stepper/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-progress-stepper/demo/vertical-stepper.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-progress-stepper",
          "declaration": {
            "name": "RhProgressStepper",
            "module": "rh-progress-stepper/rh-progress-stepper.js"
          }
        },
        {
          "kind": "js",
          "name": "RhProgressStepper",
          "declaration": {
            "name": "RhProgressStepper",
            "module": "rh-progress-stepper/rh-progress-stepper.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-scheme-toggle/rh-scheme-toggle.js",
      "declarations": [
        {
          "name": "RhSchemeToggle",
          "summary": "Switches between a variety of color schemes",
          "description": "A scheme toggle switches between light, dark, and system default color schemes.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "scheme",
              "description": "Current color scheme setting",
              "type": {
                "text": "Scheme"
              },
              "default": "globalThis.localStorage\\n      ?.rhdsColorScheme as Scheme",
              "kind": "field",
              "attribute": "scheme",
              "reflects": true
            },
            {
              "name": "legendText",
              "description": "Legend text for the color scheme toggle group",
              "type": {
                "text": "string"
              },
              "default": "'Color scheme'",
              "kind": "field",
              "attribute": "legend-text"
            },
            {
              "name": "lightText",
              "description": "Label text for the light mode option",
              "type": {
                "text": "string"
              },
              "default": "'Light'",
              "kind": "field",
              "attribute": "light-text"
            },
            {
              "name": "darkText",
              "description": "Label text for the dark mode option",
              "type": {
                "text": "string"
              },
              "default": "'Dark'",
              "kind": "field",
              "attribute": "dark-text"
            },
            {
              "name": "systemText",
              "description": "Label text for the system default option",
              "type": {
                "text": "string"
              },
              "default": "'System'",
              "kind": "field",
              "attribute": "system-text"
            },
            {
              "name": "schemeChanged",
              "kind": "method",
              "privacy": "private"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-scheme-toggle/rh-scheme-toggle.ts#L26"
          },
          "kind": "class",
          "tagName": "rh-scheme-toggle",
          "attributes": [
            {
              "name": "scheme",
              "description": "Current color scheme setting",
              "type": {
                "text": "Scheme"
              },
              "default": "globalThis.localStorage\\n      ?.rhdsColorScheme as Scheme",
              "fieldName": "scheme"
            },
            {
              "name": "legend-text",
              "description": "Legend text for the color scheme toggle group",
              "type": {
                "text": "string"
              },
              "default": "'Color scheme'",
              "fieldName": "legendText"
            },
            {
              "name": "light-text",
              "description": "Label text for the light mode option",
              "type": {
                "text": "string"
              },
              "default": "'Light'",
              "fieldName": "lightText"
            },
            {
              "name": "dark-text",
              "description": "Label text for the dark mode option",
              "type": {
                "text": "string"
              },
              "default": "'Dark'",
              "fieldName": "darkText"
            },
            {
              "name": "system-text",
              "description": "Label text for the system default option",
              "type": {
                "text": "string"
              },
              "default": "'System'",
              "fieldName": "systemText"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-size-icon-01",
              "description": "16px icon box",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-3xl",
              "description": "48px spacer",
              "default": "48px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-color-interactive-secondary-focus",
              "description": "Responsive `interactive-secondary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-secondary-focus-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-secondary-focus-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-active",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-active-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-active-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-interactive",
              "description": "Responsive `border-interactive` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-interactive-on-light` on a themable container with a light color palette and `--rh-color-border-interactive-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-dark",
              "description": "Primary text color for dark theme",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-light",
              "description": "Primary text color for light theme",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-focus",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-focus-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-focus-on-dark` on a themable container with a dark color palette.",
              "default": "1px",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/scheme-toggle/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-scheme-toggle/demo/index.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-scheme-toggle",
          "declaration": {
            "name": "RhSchemeToggle",
            "module": "rh-scheme-toggle/rh-scheme-toggle.js"
          }
        },
        {
          "kind": "js",
          "name": "RhSchemeToggle",
          "declaration": {
            "name": "RhSchemeToggle",
            "module": "rh-scheme-toggle/rh-scheme-toggle.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-site-status/rh-site-status.js",
      "declarations": [
        {
          "name": "RhSiteStatus",
          "summary": "Communicates operational status of a website or domain",
          "description": "Website status communicates the operational status of a website or domain using a status icon and\nlink. It is usually located in the Footer component.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "dataURI",
              "type": {
                "text": "string"
              },
              "default": "'https://status.redhat.com/index.json' as const",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "fetchOptions",
              "type": {
                "text": "RequestInit"
              },
              "default": "{\\n    mode: 'cors',\\n    cache: 'no-cache',\\n    headers: {\\n      Accept: 'application/json',\\n    },\\n  }",
              "kind": "field",
              "static": true,
              "privacy": "private"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-site-status/rh-site-status.ts#L131"
          },
          "kind": "class",
          "tagName": "rh-site-status",
          "slots": [
            {
              "name": "loading-text",
              "description": "Text to display while loading the status defaults to \"Loading\""
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface-status-success",
              "description": "Responsive `surface-status-success` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-surface-status-success-on-light` on a themable container with a light color palette and `--rh-color-surface-status-success-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-status-warning",
              "description": "Responsive `surface-status-warning` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-surface-status-warning-on-light` on a themable container with a light color palette and `--rh-color-surface-status-warning-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-status-danger",
              "description": "Responsive `surface-status-danger` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-surface-status-danger-on-light` on a themable container with a light color palette and `--rh-color-surface-status-danger-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-light",
              "description": "Secondary surface (light theme)",
              "default": "#e0e0e0",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-interactive",
              "description": "Responsive `border-interactive` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-interactive-on-light` on a themable container with a light color palette and `--rh-color-border-interactive-on-dark` on a themable container with a dark color palette.",
              "default": "2px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-size-icon-01",
              "description": "16px icon box",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-white",
              "description": "Lightest surface (light theme) or primary text (dark theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-success",
              "description": "Responsive `status-success` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-success-on-light` on a themable container with a light color palette and `--rh-color-status-success-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-warning",
              "description": "Responsive `status-warning` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-warning-on-light` on a themable container with a light color palette and `--rh-color-status-warning-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-status-danger",
              "description": "Responsive `status-danger` color value. Typically read-only – use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-status-danger-on-light` on a themable container with a light color palette and `--rh-color-status-danger-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/site-status/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-site-status/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/site-status/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-site-status/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/site-status/demo/domains/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-site-status/demo/domains.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/site-status/demo/loading/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-site-status/demo/loading.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/site-status/demo/localization/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-site-status/demo/localization.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/site-status/demo/status-404/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-site-status/demo/status-404.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/site-status/demo/status-critical/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-site-status/demo/status-critical.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/site-status/demo/status-major/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-site-status/demo/status-major.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/site-status/demo/status-minor/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-site-status/demo/status-minor.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-site-status",
          "declaration": {
            "name": "RhSiteStatus",
            "module": "rh-site-status/rh-site-status.js"
          }
        },
        {
          "kind": "js",
          "name": "RhSiteStatus",
          "declaration": {
            "name": "RhSiteStatus",
            "module": "rh-site-status/rh-site-status.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-skeleton/rh-skeleton.js",
      "declarations": [
        {
          "name": "RhSkeleton",
          "summary": "A placeholder for content that is loading.",
          "description": "A skeleton displays an animated placeholder that mimics the structure and layout of actual content while it loads.\nIt gives users a preview of what's coming and reduces perceived loading time.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "type",
              "description": "What shape the skeleton should be. Defaults to `body-copy`.",
              "type": {
                "text": "'body-copy' | 'heading' | 'circle' | 'square' | 'rectangle'"
              },
              "kind": "field",
              "attribute": "type",
              "reflects": true
            },
            {
              "name": "size",
              "description": "What size the skeleton should be. Defaults to `md`.\nThe `size` attribute is not valid on circle, square, or rectangle skeletons.",
              "type": {
                "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'"
              },
              "kind": "field",
              "attribute": "size",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-skeleton/rh-skeleton.ts#L16"
          },
          "kind": "class",
          "tagName": "rh-skeleton",
          "attributes": [
            {
              "name": "type",
              "description": "What shape the skeleton should be. Defaults to `body-copy`.",
              "type": {
                "text": "'body-copy' | 'heading' | 'circle' | 'square' | 'rectangle'"
              },
              "fieldName": "type"
            },
            {
              "name": "size",
              "description": "What size the skeleton should be. Defaults to `md`.\nThe `size` attribute is not valid on circle, square, or rectangle skeletons.",
              "type": {
                "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'"
              },
              "fieldName": "size"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Place a visually hidden description of what is being loaded for assistive technologies."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-length-4xs",
              "description": "1px length token",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/skeleton/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-skeleton/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/skeleton/demo/circle/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-skeleton/demo/circle.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/skeleton/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-skeleton/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/skeleton/demo/rectangle/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-skeleton/demo/rectangle.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/skeleton/demo/square/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-skeleton/demo/square.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/skeleton/demo/text/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-skeleton/demo/text.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-skeleton",
          "declaration": {
            "name": "RhSkeleton",
            "module": "rh-skeleton/rh-skeleton.js"
          }
        },
        {
          "kind": "js",
          "name": "RhSkeleton",
          "declaration": {
            "name": "RhSkeleton",
            "module": "rh-skeleton/rh-skeleton.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-skip-link/rh-skip-link.js",
      "declarations": [
        {
          "name": "RhSkipLink",
          "summary": "Skip to the main content of a page",
          "description": "A skip link is used to skip repetitive content on a page.\nIt is hidden by default and can be activated by hitting\nthe \"Tab\" key after loading/refreshing a page.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "href",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "href",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-skip-link/rh-skip-link.ts#L18"
          },
          "kind": "class",
          "tagName": "rh-skip-link",
          "attributes": [
            {
              "name": "href",
              "type": {
                "text": "string"
              },
              "fieldName": "href"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "An anchor tag targeting the main page content by id hash.\nOr, if the `href` attribute is set, the text of the link."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-interactive-on-light",
              "description": "Interactive border color (light theme)",
              "default": "#0066cc",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-color-interactive-primary-default-on-light",
              "description": "Primary interactive - default (Light theme)",
              "default": "#0066cc",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-heading-bold",
              "description": "Bold font weight for headings",
              "default": "700",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover-on-light",
              "description": "Primary interactive - hover (Light theme)",
              "default": "#003366",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/skip-link/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-skip-link/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/skip-link/demo/href-attribute/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-skip-link/demo/href-attribute.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/skip-link/demo/with-content/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-skip-link/demo/with-content.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-skip-link",
          "declaration": {
            "name": "RhSkipLink",
            "module": "rh-skip-link/rh-skip-link.js"
          }
        },
        {
          "kind": "js",
          "name": "RhSkipLink",
          "declaration": {
            "name": "RhSkipLink",
            "module": "rh-skip-link/rh-skip-link.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-spinner/rh-spinner.js",
      "declarations": [
        {
          "name": "RhSpinner",
          "summary": "Notifies users their action is being processed or loaded",
          "description": "A spinner indicates that an action is in progress.\nIt appears as an animated circle over the section that is loading,\nand it may include a text label",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "size",
              "description": "Preset sizes for the spinner",
              "type": {
                "text": "'sm' | 'md' | 'lg'"
              },
              "default": "'lg'",
              "kind": "field",
              "attribute": "size",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-spinner/rh-spinner.ts#L22"
          },
          "kind": "class",
          "tagName": "rh-spinner",
          "attributes": [
            {
              "name": "size",
              "description": "Preset sizes for the spinner",
              "type": {
                "text": "'sm' | 'md' | 'lg'"
              },
              "default": "'lg'",
              "fieldName": "size"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Optional text label below the animated circle."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-length-4xl",
              "description": "64px length token",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-accent-base",
              "description": "Responsive `accent-base` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-accent-base-on-light` on a themable container with a light color palette and `--rh-color-accent-base-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-10",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-70",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-size-icon-06",
              "description": "64px icon box",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-sm",
              "description": "6px length token",
              "default": "6px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-lg",
              "description": "18px font size",
              "default": "1.125rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-size-icon-04",
              "description": "40px icon box",
              "default": "40px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-xs",
              "description": "4px length token",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-size-icon-01",
              "description": "16px icon box",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-2xs",
              "description": "3px length token",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/spinner/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-spinner/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/spinner/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-spinner/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/spinner/demo/size-medium/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-spinner/demo/size-medium.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/spinner/demo/size-small/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-spinner/demo/size-small.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/spinner/demo/with-text-label/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-spinner/demo/with-text-label.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-spinner",
          "declaration": {
            "name": "RhSpinner",
            "module": "rh-spinner/rh-spinner.js"
          }
        },
        {
          "kind": "js",
          "name": "RhSpinner",
          "declaration": {
            "name": "RhSpinner",
            "module": "rh-spinner/rh-spinner.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-stat/rh-stat.js",
      "declarations": [
        {
          "name": "RhStat",
          "summary": "Showcases a data point or quick fact visually",
          "description": "A statistic showcases a data point or quick fact visually.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "icon",
              "description": "The icon to display in the statistic",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "kind": "field",
              "attribute": "icon",
              "reflects": true
            },
            {
              "name": "iconSet",
              "description": "Icon set to display in the statistic",
              "type": {
                "text": "IconSetName"
              },
              "default": "'standard'",
              "kind": "field",
              "attribute": "icon-set"
            },
            {
              "name": "top",
              "description": "Whether the title or statistic should be displayed on top in the statistic",
              "type": {
                "text": "'default' | 'statistic'"
              },
              "default": "'default'",
              "kind": "field",
              "attribute": "top",
              "reflects": true
            },
            {
              "name": "size",
              "description": "The size of the statistic",
              "type": {
                "text": "'default' | 'large'"
              },
              "default": "'default'",
              "kind": "field",
              "attribute": "size",
              "reflects": true
            },
            {
              "name": "isMobile",
              "description": "Whether the statistic is in a mobile view or not for styling",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "is-mobile",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-stat/rh-stat.ts#L25"
          },
          "kind": "class",
          "tagName": "rh-stat",
          "attributes": [
            {
              "name": "icon",
              "description": "The icon to display in the statistic",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "fieldName": "icon"
            },
            {
              "name": "icon-set",
              "description": "Icon set to display in the statistic",
              "type": {
                "text": "IconSetName"
              },
              "default": "'standard'",
              "fieldName": "iconSet"
            },
            {
              "name": "top",
              "description": "Whether the title or statistic should be displayed on top in the statistic",
              "type": {
                "text": "'default' | 'statistic'"
              },
              "default": "'default'",
              "fieldName": "top"
            },
            {
              "name": "size",
              "description": "The size of the statistic",
              "type": {
                "text": "'default' | 'large'"
              },
              "default": "'default'",
              "fieldName": "size"
            },
            {
              "name": "is-mobile",
              "description": "Whether the statistic is in a mobile view or not for styling",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "isMobile"
            }
          ],
          "slots": [
            {
              "name": "icon",
              "description": "Optional icon"
            },
            {
              "name": "title",
              "description": "Statistic title"
            },
            {
              "name": "statistic",
              "description": "Statistic data"
            },
            {
              "name": "",
              "description": "Description of the stat"
            },
            {
              "name": "cta",
              "description": "Call to action"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-text-brand-on-light",
              "description": "Brand text color for light theme",
              "default": "#ee0000",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-dark",
              "description": "Primary text color for dark theme",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-secondary",
              "description": "Responsive `icon-secondary` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-icon-secondary-on-light` on a themable container with a light color palette and `--rh-color-icon-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-size-icon-04",
              "description": "40px icon box",
              "default": "40px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-size-icon-06",
              "description": "64px icon box",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xl",
              "description": "20px font size",
              "default": "1.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-font-size-heading-lg",
              "description": "h3 heading font size",
              "default": "2.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-heading-regular",
              "description": "Regular font weight for headings",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-space-sm",
              "description": "6px spacer",
              "default": "6px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-lg",
              "description": "18px font size",
              "default": "1.125rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-heading-2xl",
              "description": "h1 heading font size",
              "default": "3rem",
              "syntax": "\u003clength\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/statistic/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-stat/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/statistic/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-stat/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/statistic/demo/icon-slot/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-stat/demo/icon-slot.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/statistic/demo/icon-svg/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-stat/demo/icon-svg.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/statistic/demo/icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-stat/demo/icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/statistic/demo/large/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-stat/demo/large.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/statistic/demo/slotted-content/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-stat/demo/slotted-content.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-stat",
          "declaration": {
            "name": "RhStat",
            "module": "rh-stat/rh-stat.js"
          }
        },
        {
          "kind": "js",
          "name": "RhStat",
          "declaration": {
            "name": "RhStat",
            "module": "rh-stat/rh-stat.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-subnav/rh-subnav.js",
      "declarations": [
        {
          "name": "RhSubnav",
          "summary": "Organizes content into sections using tabbed pages",
          "description": "A subnavigation allows users to navigate between a small number of page links.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "instances",
              "default": "new Set\u003cRhSubnav\u003e()",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "colorPalette",
              "description": "Sets color palette, which affects the element's styles as well as descendants' color theme.\nOverrides parent color context.\nYour theme will influence these colors so check there first if you are seeing inconsistencies.\nSee [CSS Custom Properties](#css-custom-properties) for default values",
              "type": {
                "text": "ColorPalette"
              },
              "deprecated": "`\u003crh-subnav\u003e` reacts to the parent set color-scheme and should not set its own color-palette.\nThe color-palette attribute will be removed in a future release.",
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            },
            {
              "name": "accessibleLabel",
              "description": "Customize the default `aria-label` on the `\u003cnav\u003e` container.\nDefaults to \"subnavigation\" if no attribute/property is set.",
              "type": {
                "text": "string"
              },
              "default": "'subnavigation'",
              "kind": "field",
              "attribute": "accessible-label"
            },
            {
              "name": "labelScrollLeft",
              "description": "Label for the scroll back button",
              "type": {
                "text": "string"
              },
              "default": "'Scroll back'",
              "kind": "field",
              "attribute": "label-scroll-left",
              "reflects": true
            },
            {
              "name": "labelScrollRight",
              "description": "Label for the scroll forward button",
              "type": {
                "text": "string"
              },
              "default": "'Scroll forward'",
              "kind": "field",
              "attribute": "label-scroll-right",
              "reflects": true
            },
            {
              "name": "firstUpdated",
              "kind": "method",
              "privacy": "protected"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-subnav/rh-subnav.ts#L31"
          },
          "kind": "class",
          "tagName": "rh-subnav",
          "attributes": [
            {
              "name": "color-palette",
              "description": "Sets color palette, which affects the element's styles as well as descendants' color theme.\nOverrides parent color context.\nYour theme will influence these colors so check there first if you are seeing inconsistencies.\nSee [CSS Custom Properties](#css-custom-properties) for default values",
              "type": {
                "text": "ColorPalette"
              },
              "fieldName": "colorPalette",
              "deprecated": "`\u003crh-subnav\u003e` reacts to the parent set color-scheme and should not set its own color-palette.\nThe color-palette attribute will be removed in a future release."
            },
            {
              "name": "accessible-label",
              "description": "Customize the default `aria-label` on the `\u003cnav\u003e` container.\nDefaults to \"subnavigation\" if no attribute/property is set.",
              "type": {
                "text": "string"
              },
              "default": "'subnavigation'",
              "fieldName": "accessibleLabel"
            },
            {
              "name": "label-scroll-left",
              "description": "Label for the scroll back button",
              "type": {
                "text": "string"
              },
              "default": "'Scroll back'",
              "fieldName": "labelScrollLeft"
            },
            {
              "name": "label-scroll-right",
              "description": "Label for the scroll forward button",
              "type": {
                "text": "string"
              },
              "default": "'Scroll forward'",
              "fieldName": "labelScrollRight"
            }
          ],
          "slots": [
            {
              "name": ""
            }
          ],
          "cssParts": [
            {
              "name": "container",
              "description": "container, `\u003cdiv\u003e` element"
            },
            {
              "name": "links"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-accent-brand",
              "description": "Responsive `accent-brand` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-accent-brand-on-light` on a themable container with a light color palette and `--rh-color-accent-brand-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-interactive",
              "description": "Responsive `border-interactive` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-interactive-on-light` on a themable container with a light color palette and `--rh-color-border-interactive-on-dark` on a themable container with a dark color palette.",
              "default": "2px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-xs",
              "description": "4px spacer",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-brand-red",
              "description": "Responsive `brand-red` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-brand-red-on-light` on a themable container with a light color palette and `--rh-color-brand-red-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-lg",
              "description": "3px border width: Example: Expanded Accordion panel",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "default": "1px",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/subnavigation/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-subnav/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/subnavigation/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-subnav/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/subnavigation/demo/dynamic/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-subnav/demo/dynamic.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/subnavigation/demo/overflow-scroll/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-subnav/demo/overflow-scroll.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/subnavigation/demo/padded/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-subnav/demo/padded.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/subnavigation/demo/right-to-left/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-subnav/demo/right-to-left.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/subnavigation/demo/with-navigation-link/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-subnav/demo/with-navigation-link.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-subnav",
          "declaration": {
            "name": "RhSubnav",
            "module": "rh-subnav/rh-subnav.js"
          }
        },
        {
          "kind": "js",
          "name": "RhSubnav",
          "declaration": {
            "name": "RhSubnav",
            "module": "rh-subnav/rh-subnav.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-surface/rh-surface.js",
      "declarations": [
        {
          "name": "RhSurface",
          "summary": "Provides background color context for elements placed on top",
          "description": "Surfaces are content containers with a color palette which provide a theme\n(i.e. a background color as well as accessible font colors) to their child\nelements. Use surface only when other containers like card or accordion\nare inappropriate.\n\n\u003cfigure\u003e\n\u003cfigcaption\u003eA surface providing a theme to a spinner\u003c/figcaption\u003e\n\n```html\n\u003crh-surface color-palette=\"light\"\u003e\n\u003crh-spinner\u003eLoading...\u003c/rh-spinner\u003e\n\u003c/rh-surface\u003e\n```\n\u003c/figure\u003e",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "colorPalette",
              "description": "Sets color palette, which affects the element's styles as well as\ndescendants' color theme. The default surface color palette is 'lightest',\nSurface always overrides the parent's color context.\nYour theme will influence these colors so check there first if you are seeing inconsistencies.\nSee [CSS Custom Properties](#css-custom-properties) for default values",
              "type": {
                "text": "ColorPalette"
              },
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-surface/rh-surface.ts#L29"
          },
          "kind": "class",
          "tagName": "rh-surface",
          "attributes": [
            {
              "name": "color-palette",
              "description": "Sets color palette, which affects the element's styles as well as\ndescendants' color theme. The default surface color palette is 'lightest',\nSurface always overrides the parent's color context.\nYour theme will influence these colors so check there first if you are seeing inconsistencies.\nSee [CSS Custom Properties](#css-custom-properties) for default values",
              "type": {
                "text": "ColorPalette"
              },
              "fieldName": "colorPalette"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "The `\u003crh-surface\u003e` element has a single anonymous slot which accepts any content and does not provide additional layout styling"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/surface/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-surface/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/surface/demo/color-palettes/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-surface/demo/color-palettes.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/surface/demo/nested-combination-elements/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-surface/demo/nested-combination-elements.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-surface",
          "declaration": {
            "name": "RhSurface",
            "module": "rh-surface/rh-surface.js"
          }
        },
        {
          "kind": "js",
          "name": "RhSurface",
          "declaration": {
            "name": "RhSurface",
            "module": "rh-surface/rh-surface.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-switch/rh-switch.js",
      "declarations": [
        {
          "name": "RhSwitch",
          "summary": "A switch toggles the state of a setting (between on and off).",
          "description": "A switch toggles the state of a setting (between on and off). Switches and checkboxes can often be used interchangeably, but the switch provides a more explicit, visible representation on a setting.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "accessibleLabel",
              "description": "invisible, accessible label for screen readers",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "accessible-label",
              "reflects": true
            },
            {
              "name": "messageOn",
              "description": "Message to display when the switch is on (i.e. checked)",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "message-on",
              "reflects": true
            },
            {
              "name": "messageOff",
              "description": "Message to display when the switch is off (i.e. unchecked)",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "message-off",
              "reflects": true
            },
            {
              "name": "showCheckIcon",
              "description": "If the checkmark icon should be displayed when the switch is on",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "show-check-icon",
              "reflects": true
            },
            {
              "name": "checked",
              "description": "If the switch is on",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "checked",
              "reflects": true
            },
            {
              "name": "disabled",
              "description": "If the switch is disabled",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "disabled",
              "reflects": true
            },
            {
              "name": "reversed",
              "description": "If the switch is reversed: message first, then control",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "reversed",
              "reflects": true
            },
            {
              "name": "labels",
              "type": {
                "text": "NodeListOf\u003cHTMLLabelElement\u003e"
              },
              "readonly": true,
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-switch/rh-switch.ts#L25"
          },
          "kind": "class",
          "tagName": "rh-switch",
          "attributes": [
            {
              "name": "accessible-label",
              "description": "invisible, accessible label for screen readers",
              "type": {
                "text": "string"
              },
              "fieldName": "accessibleLabel"
            },
            {
              "name": "message-on",
              "description": "Message to display when the switch is on (i.e. checked)",
              "type": {
                "text": "string"
              },
              "fieldName": "messageOn"
            },
            {
              "name": "message-off",
              "description": "Message to display when the switch is off (i.e. unchecked)",
              "type": {
                "text": "string"
              },
              "fieldName": "messageOff"
            },
            {
              "name": "show-check-icon",
              "description": "If the checkmark icon should be displayed when the switch is on",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "showCheckIcon"
            },
            {
              "name": "checked",
              "description": "If the switch is on",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "checked"
            },
            {
              "name": "disabled",
              "description": "If the switch is disabled",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "disabled"
            },
            {
              "name": "reversed",
              "description": "If the switch is reversed: message first, then control",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "reversed"
            }
          ],
          "slots": [
            {
              "name": "message-on",
              "description": "message content when checked. Overrides the `message-on` attribute."
            },
            {
              "name": "message-off",
              "description": "message content when unchecked. Overrides the `message-off` attribute."
            }
          ],
          "cssParts": [
            {
              "name": "container"
            },
            {
              "name": "switch"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-switch-unchecked",
              "description": "The background color of the switch when it is unchecked.",
              "default": "var(--rh-color-gray-40, #a3a3a3)"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-box-shadow-sm",
              "description": "Small box shadow",
              "default": "0 2px 4px 0 rgba(21, 21, 21, 0.2)",
              "syntax": "\u003cshadow\u003e"
            },
            {
              "name": "--rh-border-radius-pill",
              "description": "Pill border radius; Example: Label",
              "default": "64px"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-switch-checked",
              "description": "The background color of the switch when it is checked.",
              "default": "var(--rh-color-accent-base)"
            },
            {
              "name": "--rh-color-accent-base",
              "description": "Responsive `accent-base` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-accent-base-on-light` on a themable container with a light color palette and `--rh-color-accent-base-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-interactive",
              "description": "Responsive `border-interactive` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-interactive-on-light` on a themable container with a light color palette and `--rh-color-border-interactive-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-sm",
              "description": "6px spacer",
              "default": "6px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-gray-50",
              "description": "Subtle icon",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-30",
              "description": "Subtle borders (light theme)",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-switch-disabled",
              "description": "The background color of the switch when it is disabled.",
              "default": "var(--rh-color-gray-60, #4d4d4d)"
            },
            {
              "name": "--rh-color-gray-60",
              "description": "Secondary text (light theme)",
              "default": "#4d4d4d",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/switch/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-switch/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/switch/demo/check-icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-switch/demo/check-icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/switch/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-switch/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/switch/demo/disabled/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-switch/demo/disabled.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/switch/demo/fieldset/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-switch/demo/fieldset.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/switch/demo/nested-in-label/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-switch/demo/nested-in-label.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/switch/demo/reversed/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-switch/demo/reversed.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/switch/demo/rich-messages/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-switch/demo/rich-messages.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/switch/demo/right-to-left/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-switch/demo/right-to-left.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/switch/demo/without-messages/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-switch/demo/without-messages.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-switch",
          "declaration": {
            "name": "RhSwitch",
            "module": "rh-switch/rh-switch.js"
          }
        },
        {
          "kind": "js",
          "name": "RhSwitch",
          "declaration": {
            "name": "RhSwitch",
            "module": "rh-switch/rh-switch.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-table/rh-sort-button.js",
      "declarations": [
        {
          "name": "RequestSortEvent",
          "superclass": {
            "name": "ComposedEvent"
          },
          "members": [
            {
              "name": "direction",
              "type": {
                "text": "'asc' | 'desc'"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/rh-sort-button.ts#L13"
          },
          "kind": "class"
        },
        {
          "name": "RhSortButton",
          "description": "Table sort button",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "sortDirection",
              "description": "The button's sorting order",
              "type": {
                "text": "'asc' | 'desc'"
              },
              "kind": "field",
              "attribute": "sort-direction",
              "reflects": true
            },
            {
              "name": "column",
              "description": "The column name associated with this button (for screen readers)",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "column"
            },
            {
              "name": "sort",
              "description": "Dispatch a request-sort event in ascending (asc) or descending (desc) order",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/rh-sort-button.ts#L37"
          },
          "kind": "class",
          "tagName": "rh-sort-button",
          "attributes": [
            {
              "name": "sort-direction",
              "description": "The button's sorting order",
              "type": {
                "text": "'asc' | 'desc'"
              },
              "fieldName": "sortDirection"
            },
            {
              "name": "column",
              "description": "The column name associated with this button (for screen readers)",
              "type": {
                "text": "string"
              },
              "fieldName": "column"
            }
          ],
          "events": [
            {
              "name": "request-sort",
              "description": "when the button is clicked",
              "type": {
                "text": "RequestSortEvent"
              }
            }
          ],
          "cssParts": [
            {
              "name": "sort-button",
              "description": "button element"
            },
            {
              "name": "sort-indicator",
              "description": "icon wrapper element"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "RequestSortEvent",
          "declaration": {
            "name": "RequestSortEvent",
            "module": "rh-table/rh-sort-button.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-sort-button",
          "declaration": {
            "name": "RhSortButton",
            "module": "rh-table/rh-sort-button.js"
          }
        },
        {
          "kind": "js",
          "name": "RhSortButton",
          "declaration": {
            "name": "RhSortButton",
            "module": "rh-table/rh-sort-button.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-table/rh-table.js",
      "declarations": [
        {
          "name": "RhTable",
          "summary": "Organizes and displays information from a data set",
          "description": "A table is a container for displaying information. It allows a user to scan, examine, and compare large amounts of data.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "parameters": [
                {
                  "name": "columnIndexToSort",
                  "type": {
                    "text": "number"
                  }
                },
                {
                  "name": "node",
                  "type": {
                    "text": "Element"
                  }
                }
              ],
              "name": "getNodeContentForSort",
              "kind": "method",
              "static": true,
              "privacy": "private"
            },
            {
              "parameters": [
                {
                  "name": "direction",
                  "type": {
                    "text": "'asc' | 'desc'"
                  }
                },
                {
                  "name": "a",
                  "type": {
                    "text": "{ content: string }"
                  }
                },
                {
                  "name": "b",
                  "type": {
                    "text": "{ content: string }"
                  }
                }
              ],
              "name": "sortByContent",
              "kind": "method",
              "static": true,
              "privacy": "private"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/rh-table.ts#L22"
          },
          "kind": "class",
          "tagName": "rh-table",
          "slots": [
            {
              "name": "",
              "description": "an HTML table"
            },
            {
              "name": "summary",
              "description": "description of the data"
            }
          ],
          "cssParts": [
            {
              "name": "container"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-50",
              "description": "Subtle icon",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-table-row-border",
              "description": "row border",
              "default": "var(--rh-border-width-sm, 1px) solid var(--rh-color-border-subtle-on-light, #c7c7c7)"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle-on-light",
              "description": "Subtle border color (light theme)",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-table-row-background-hover-color",
              "description": "row hover background color",
              "default": "rgba(from var(--rh-color-gray-40, #a3a3a3) r g b / 0.1)"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-white",
              "description": "Lightest surface (light theme) or primary text (dark theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-table-column-background-hover-color",
              "description": "column hover background color",
              "default": "rgba(from var(--rh-color-blue-50, #0066cc) r g b / 0.1)"
            },
            {
              "name": "--rh-color-blue-50",
              "description": "Label - Filled (Blue) accent color",
              "default": "#0066cc",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-70",
              "description": "Alert - Info title text",
              "default": "#003366",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/table/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/table/demo/auto-data-labels/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/demo/auto-data-labels.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/table/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/table/demo/column-headers/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/demo/column-headers.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/table/demo/headers-and-summary-but-no-title/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/demo/headers-and-summary-but-no-title.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/table/demo/horizontal-overflow/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/demo/horizontal-overflow.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/table/demo/no-title-headers-or-summary/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/demo/no-title-headers-or-summary.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/table/demo/row-and-column-headers/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/demo/row-and-column-headers.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/table/demo/row-headers/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/demo/row-headers.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/table/demo/title-and-summary-but-no-headers/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/demo/title-and-summary-but-no-headers.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/table/demo/title-headers-and-summary/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/demo/title-headers-and-summary.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/table/demo/vertical-overflow/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-table/demo/vertical-overflow.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-table",
          "declaration": {
            "name": "RhTable",
            "module": "rh-table/rh-table.js"
          }
        },
        {
          "kind": "js",
          "name": "RhTable",
          "declaration": {
            "name": "RhTable",
            "module": "rh-table/rh-table.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-tabs/rh-tab-panel.js",
      "declarations": [
        {
          "name": "RhTabPanel",
          "description": "The tab panel for use within a rh-tabs element, must be paired with a rh-tab.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/rh-tab-panel.ts#L14"
          },
          "kind": "class",
          "tagName": "rh-tab-panel",
          "slots": [
            {
              "name": "",
              "description": "Panel content should follow guidelines for [tab panel content layout](../guidelines)"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-tab-panel",
          "declaration": {
            "name": "RhTabPanel",
            "module": "rh-tabs/rh-tab-panel.js"
          }
        },
        {
          "kind": "js",
          "name": "RhTabPanel",
          "declaration": {
            "name": "RhTabPanel",
            "module": "rh-tabs/rh-tab-panel.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-tabs/rh-tab.js",
      "declarations": [
        {
          "name": "TabExpandEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "members": [
            {
              "name": "active",
              "type": {
                "text": "boolean"
              },
              "kind": "field"
            },
            {
              "name": "tab",
              "type": {
                "text": "RhTab"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/rh-tab.ts#L25"
          },
          "kind": "class"
        },
        {
          "name": "RhTab",
          "description": "The tab button for use within a rh-tabs element, must be paired with a rh-tab-panel.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "active",
              "description": "True when the tab is selected",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "active",
              "reflects": true
            },
            {
              "name": "disabled",
              "description": "True when the tab is disabled",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "disabled",
              "reflects": true
            },
            {
              "parameters": [
                {
                  "name": "old",
                  "type": {
                    "text": "boolean"
                  }
                }
              ],
              "name": "activeChanged",
              "kind": "method",
              "privacy": "private"
            },
            {
              "name": "disabledChanged",
              "description": "if a tab is disabled, then it is also aria-disabled\nif a tab is removed from disabled its not necessarily\nnot still aria-disabled so we don't remove the aria-disabled",
              "kind": "method",
              "privacy": "private"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/rh-tab.ts#L40"
          },
          "kind": "class",
          "tagName": "rh-tab",
          "attributes": [
            {
              "name": "active",
              "description": "True when the tab is selected",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "active"
            },
            {
              "name": "disabled",
              "description": "True when the tab is disabled",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "disabled"
            }
          ],
          "events": [
            {
              "name": "expand",
              "description": "when a tab expands",
              "type": {
                "text": " TabExpandEvent "
              }
            }
          ],
          "slots": [
            {
              "name": "icon",
              "description": "Can contain an `\u003csvg\u003e` or `\u003crh-icon\u003e`"
            },
            {
              "name": "",
              "description": "Tab title text"
            }
          ],
          "cssParts": [
            {
              "name": "button",
              "description": "element that contains the interactive part of a tab"
            },
            {
              "name": "icon",
              "description": "Can contain an `\u003csvg\u003e` or `\u003crh-icon\u003e`"
            },
            {
              "name": "text",
              "description": "Tab title text"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-tabs-active-border-color",
              "default": "var(--rh-color-accent-brand)"
            },
            {
              "name": "--rh-color-accent-brand",
              "description": "Responsive `accent-brand` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-accent-brand-on-light` on a themable container with a light color palette and `--rh-color-accent-brand-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-line-height-heading",
              "description": "Line height for headings",
              "default": "1.3"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-tabs-link-padding-inline-end",
              "description": "Tab padding inline end",
              "default": "var(--rh-space-2xl, 32px)"
            },
            {
              "name": "--rh-tabs-link-padding-inline-start",
              "description": "Tab padding inline start",
              "default": "var(--rh-space-2xl, 32px)"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darker",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-tabs-link-padding-block-start",
              "description": "Tab padding block start",
              "default": "var(--rh-space-md, 8px)"
            },
            {
              "name": "--rh-tabs-link-padding-block-end",
              "description": "Tab padding block end",
              "default": "var(--rh-space-md, 8px)"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-tabs-link-color",
              "description": "Tab link text color",
              "default": "var(--rh-color-text-primary)"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "default": "1px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-lg",
              "description": "Tab active border color\n\n3px border width: Example: Expanded Accordion panel",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-interactive-secondary-default",
              "description": "Responsive `interactive-secondary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-secondary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-secondary-default-on-dark` on a themable container with a dark color palette.",
              "default": "3px",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-default",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-default-on-light` on a themable container with a light color palette and `--rh-color-interactive-primary-default-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "TabExpandEvent",
          "declaration": {
            "name": "TabExpandEvent",
            "module": "rh-tabs/rh-tab.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-tab",
          "declaration": {
            "name": "RhTab",
            "module": "rh-tabs/rh-tab.js"
          }
        },
        {
          "kind": "js",
          "name": "RhTab",
          "declaration": {
            "name": "RhTab",
            "module": "rh-tabs/rh-tab.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-tabs/rh-tabs.js",
      "declarations": [
        {
          "name": "RhTabs",
          "summary": "Arranges content in a contained view on the same page",
          "description": "Tabs are used to organize and navigate between sections of content.\nThey feature a horizontal or a vertical list of section text labels\nwith a content panel below or to the right of the component.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "labelScrollLeft",
              "description": "Label for the scroll left button",
              "type": {
                "text": "string"
              },
              "default": "'Scroll left'",
              "kind": "field",
              "attribute": "label-scroll-left",
              "reflects": true
            },
            {
              "name": "labelScrollRight",
              "description": "Label for the scroll right button",
              "type": {
                "text": "string"
              },
              "default": "'Scroll right'",
              "kind": "field",
              "attribute": "label-scroll-right",
              "reflects": true
            },
            {
              "name": "manual",
              "description": "Tabs can be either [automatic](https://w3c.github.io/aria-practices/examples/tabs/tabs-automatic.html) activated\nor [manual](https://w3c.github.io/aria-practices/examples/tabs/tabs-manual.html)",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "manual",
              "reflects": true
            },
            {
              "name": "activeIndex",
              "description": "Index of the active tab",
              "kind": "field",
              "attribute": "active-index"
            },
            {
              "name": "activeTab",
              "type": {
                "text": "RhTab"
              },
              "kind": "field"
            },
            {
              "name": "colorPalette",
              "description": "Sets color context for child components, overrides parent context",
              "type": {
                "text": "ColorPalette"
              },
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            },
            {
              "name": "centered",
              "description": "Aligns tabs to the center",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "centered",
              "reflects": true
            },
            {
              "name": "box",
              "description": "Sets tabs to a boxed style with or without an inset",
              "type": {
                "text": "'box' | 'inset'"
              },
              "kind": "field",
              "attribute": "box",
              "reflects": true
            },
            {
              "name": "vertical",
              "description": "Sets the alignment of the tabs vertical",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "vertical",
              "reflects": true
            },
            {
              "name": "canShowScrollButtons",
              "type": {
                "text": "boolean"
              },
              "readonly": true,
              "kind": "field",
              "privacy": "protected"
            },
            {
              "name": "tabs",
              "type": {
                "text": "RhTab[]"
              },
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "panels",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "firstUpdated",
              "kind": "method"
            },
            {
              "parameters": [
                {
                  "name": "old",
                  "type": {
                    "text": "RhTab"
                  }
                },
                {
                  "name": "activeTab",
                  "type": {
                    "text": "RhTab"
                  }
                }
              ],
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "activeTabChanged",
              "kind": "method",
              "privacy": "protected"
            },
            {
              "parameters": [
                {
                  "name": "option",
                  "type": {
                    "text": "RhTab | number"
                  }
                }
              ],
              "name": "select",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/rh-tabs.ts#L50"
          },
          "kind": "class",
          "tagName": "rh-tabs",
          "attributes": [
            {
              "name": "label-scroll-left",
              "description": "Label for the scroll left button",
              "type": {
                "text": "string"
              },
              "default": "'Scroll left'",
              "fieldName": "labelScrollLeft"
            },
            {
              "name": "label-scroll-right",
              "description": "Label for the scroll right button",
              "type": {
                "text": "string"
              },
              "default": "'Scroll right'",
              "fieldName": "labelScrollRight"
            },
            {
              "name": "manual",
              "description": "Tabs can be either [automatic](https://w3c.github.io/aria-practices/examples/tabs/tabs-automatic.html) activated\nor [manual](https://w3c.github.io/aria-practices/examples/tabs/tabs-manual.html)",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "manual"
            },
            {
              "name": "active-index",
              "description": "Index of the active tab",
              "fieldName": "activeIndex"
            },
            {
              "name": "color-palette",
              "description": "Sets color context for child components, overrides parent context",
              "type": {
                "text": "ColorPalette"
              },
              "fieldName": "colorPalette"
            },
            {
              "name": "centered",
              "description": "Aligns tabs to the center",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "centered"
            },
            {
              "name": "box",
              "description": "Sets tabs to a boxed style with or without an inset",
              "type": {
                "text": "'box' | 'inset'"
              },
              "fieldName": "box"
            },
            {
              "name": "vertical",
              "description": "Sets the alignment of the tabs vertical",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "vertical"
            }
          ],
          "slots": [
            {
              "name": "tab",
              "description": "Must contain one or more `\u003crh-tab\u003e`"
            },
            {
              "name": "",
              "description": "Must contain one or more `\u003crh-tab-panel\u003e`"
            }
          ],
          "cssParts": [
            {
              "name": "container",
              "description": "outer container"
            },
            {
              "name": "tabs-container",
              "description": "tabs container"
            },
            {
              "name": "tabs",
              "description": "tablist"
            },
            {
              "name": "panels",
              "description": "panels"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-accent-base",
              "description": "Responsive `accent-base` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-accent-base-on-light` on a themable container with a light color palette and `--rh-color-accent-base-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-60",
              "description": "Secondary text (light theme)",
              "default": "#4d4d4d",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-icon-status-disabled"
            },
            {
              "name": "--rh-space-3xl",
              "description": "48px spacer",
              "default": "48px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-4xl",
              "description": "64px spacer",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-tabs-inset",
              "default": "var(--_inset-inline-margin, auto)"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-width-lg",
              "description": "3px border width: Example: Expanded Accordion panel",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "default": "3px",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/tabs/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tabs/demo/box-inset/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/demo/box-inset.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tabs/demo/centered/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/demo/centered.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tabs/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tabs/demo/deprecation/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/demo/deprecation.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tabs/demo/icons-and-text/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/demo/icons-and-text.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tabs/demo/long-tab-content/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/demo/long-tab-content.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tabs/demo/manual-activation/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/demo/manual-activation.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tabs/demo/nested/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/demo/nested.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tabs/demo/right-to-left/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/demo/right-to-left.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tabs/demo/vertical/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tabs/demo/vertical.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-tabs",
          "declaration": {
            "name": "RhTabs",
            "module": "rh-tabs/rh-tabs.js"
          }
        },
        {
          "kind": "js",
          "name": "RhTabs",
          "declaration": {
            "name": "RhTabs",
            "module": "rh-tabs/rh-tabs.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-tag/rh-tag.js",
      "declarations": [
        {
          "name": "RhTag",
          "summary": "Highlights an element to add clarity or draw attention",
          "description": "A tag is a caption added to an element for better clarity and user convenience.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "icon",
              "description": "The icon to display in the tag.",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "kind": "field",
              "attribute": "icon",
              "reflects": true
            },
            {
              "name": "iconSet",
              "description": "Icon set to display in the tag",
              "type": {
                "text": "IconSetName"
              },
              "default": "'ui'",
              "kind": "field",
              "attribute": "icon-set"
            },
            {
              "name": "variant",
              "description": "The variant of the tag.",
              "type": {
                "text": "'filled' | 'outline' | 'desaturated'"
              },
              "default": "'filled'",
              "kind": "field",
              "attribute": "variant"
            },
            {
              "name": "size",
              "description": "The size of the tag.",
              "type": {
                "text": "'compact'"
              },
              "kind": "field",
              "attribute": "size"
            },
            {
              "name": "href",
              "description": "optional href for linked tag.",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "href"
            },
            {
              "name": "disabled",
              "description": "Whether an interactive tag is disabled.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "disabled",
              "reflects": true
            },
            {
              "name": "color",
              "description": "The color of the label.\nNote: 'cyan' will also work, but is deprecated",
              "type": {
                "text": "| 'red'\n    | 'red-orange'\n    | 'orange'\n    | 'yellow'\n    | 'green'\n    | 'teal'\n    | 'blue'\n    | 'purple'\n    | 'gray'"
              },
              "kind": "field",
              "attribute": "color"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tag/rh-tag.ts#L30"
          },
          "kind": "class",
          "tagName": "rh-tag",
          "attributes": [
            {
              "name": "icon",
              "description": "The icon to display in the tag.",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "fieldName": "icon"
            },
            {
              "name": "icon-set",
              "description": "Icon set to display in the tag",
              "type": {
                "text": "IconSetName"
              },
              "default": "'ui'",
              "fieldName": "iconSet"
            },
            {
              "name": "variant",
              "description": "The variant of the tag.",
              "type": {
                "text": "'filled' | 'outline' | 'desaturated'"
              },
              "default": "'filled'",
              "fieldName": "variant"
            },
            {
              "name": "size",
              "description": "The size of the tag.",
              "type": {
                "text": "'compact'"
              },
              "fieldName": "size"
            },
            {
              "name": "href",
              "description": "optional href for linked tag.",
              "type": {
                "text": "string"
              },
              "fieldName": "href"
            },
            {
              "name": "disabled",
              "description": "Whether an interactive tag is disabled.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "disabled"
            },
            {
              "name": "color",
              "description": "The color of the label.\nNote: 'cyan' will also work, but is deprecated",
              "type": {
                "text": "| 'red'\n    | 'red-orange'\n    | 'orange'\n    | 'yellow'\n    | 'green'\n    | 'teal'\n    | 'blue'\n    | 'purple'\n    | 'gray'"
              },
              "fieldName": "color"
            }
          ],
          "events": [
            {
              "name": "close",
              "description": "when a removable label's close button is clicked"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Must contain the text for the label."
            },
            {
              "name": "icon",
              "summary": "Contains the labels's icon, e.g. web-icon-alert-success."
            }
          ],
          "cssParts": [
            {
              "name": "icon",
              "summary": "container for the label icon"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-length-3xs",
              "description": "2px length token",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-regular",
              "description": "Regular font weight",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-size-icon-01",
              "description": "16px icon box",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-border-radius-pill",
              "description": "Pill border radius; Example: Label",
              "default": "64px"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-space-xs",
              "description": "4px spacer",
              "default": "4px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-interactive",
              "description": "Responsive `border-interactive` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-interactive-on-light` on a themable container with a light color palette and `--rh-color-border-interactive-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-tag-padding-block-start",
              "description": "The padding at the start of the direction perpendicular to the flow of the text.",
              "default": "0"
            },
            {
              "name": "--rh-tag-padding-inline-end",
              "description": "The padding at the end of the direction parallel to the flow of the text.",
              "default": "var(--rh-space-md, 8px)"
            },
            {
              "name": "--rh-tag-padding-block-end",
              "description": "The padding at the end of the direction perpendicular to the flow of the text.",
              "default": "0"
            },
            {
              "name": "--rh-tag-padding-inline-start",
              "description": "The padding at the start of the direction parallel to the flow of the text.",
              "default": "var(--rh-space-md, 8px)"
            },
            {
              "name": "--rh-space-md",
              "description": "8px spacer",
              "default": "8px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-red-50",
              "description": "Brand red (light and dark theme)",
              "default": "#ee0000",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-70",
              "description": "Darker brand red",
              "default": "#5f0000",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-10",
              "default": "#fce3e3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-20",
              "description": "Lightest brand red",
              "default": "#fbc5c5",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-60",
              "description": "Dark brand red",
              "default": "#a60000",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-30",
              "description": "Lighter brand red",
              "default": "#f9a8a8",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-orange-50",
              "default": "#f0561d",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-orange-70",
              "default": "#731f00",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-orange-10",
              "default": "#ffe3d9",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-orange-20",
              "default": "#fbbea8",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-orange-60",
              "default": "#b1380b",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-red-orange-30",
              "default": "#f89b78",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-orange-50",
              "description": "Label - Filled (Orange) accent color",
              "default": "#ca6c0f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-orange-70",
              "description": "Label - Filled (Orange) text color",
              "default": "#732e00",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-orange-10",
              "description": "Label - Filled (Orange) background color",
              "default": "#ffe8cc",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-orange-20",
              "default": "#fccb8f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-orange-60",
              "default": "#9e4a06",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-orange-30",
              "description": "Label - Filled (Orange) border color",
              "default": "#f8ae54",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-50",
              "default": "#b98412",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-70",
              "description": "Alert - Warning title text",
              "default": "#73480b",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-10",
              "description": "Alert - Warning background",
              "default": "#fff4cc",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-20",
              "default": "#ffe072",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-60",
              "default": "#96640f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-yellow-30",
              "default": "#ffcc17",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-green-50",
              "default": "#63993d",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-green-70",
              "description": "Alert - Success title text",
              "default": "#204d00",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-green-10",
              "description": "Alert - success background",
              "default": "#e9f7df",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-green-20",
              "description": "Label - Filled (Green) border color",
              "default": "#d1f1bb",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-green-60",
              "description": "Alert - Success accent",
              "default": "#3d7317",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-green-30",
              "default": "#afdc8f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-teal-50",
              "description": "Alert - Default accent",
              "default": "#37a3a3",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-teal-70",
              "description": "Alert - Default title text",
              "default": "#004d4d",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-teal-10",
              "description": "Alert - Default background",
              "default": "#daf2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-teal-20",
              "default": "#b9e5e5",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-teal-60",
              "default": "#147878",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-teal-30",
              "description": "Label (Cyan) border color",
              "default": "#9ad8d8",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-50",
              "description": "Label - Filled (Blue) accent color",
              "default": "#0066cc",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-70",
              "description": "Alert - Info title text",
              "default": "#003366",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-10",
              "description": "Alert - Info background",
              "default": "#e0f0ff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-20",
              "description": "Label - Filled (Blue) border color",
              "default": "#b9dafc",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-60",
              "description": "Inline link hover (light theme)",
              "default": "#004d99",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-blue-30",
              "description": "Inline link (dark theme)",
              "default": "#92c5f9",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-purple-50",
              "default": "#5e40be",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-purple-70",
              "description": "Inline link visited hover (light theme)",
              "default": "#21134d",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-purple-10",
              "description": "Label - Filled (Purple) background color",
              "default": "#ece6ff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-purple-20",
              "description": "Inline link visited hover (dark theme)",
              "default": "#d0c5f4",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-purple-60",
              "description": "Inline link visited (light theme)",
              "default": "#3d2785",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-purple-30",
              "default": "#b6a6e9",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-10",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-20",
              "description": "Secondary surface (light theme)",
              "default": "#e0e0e0",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-white",
              "description": "Lightest surface (light theme) or primary text (dark theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-95",
              "description": "Primary surface (dark theme) or primary text (light theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-50",
              "description": "Subtle icon",
              "default": "#707070",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-30",
              "description": "Subtle borders (light theme)",
              "default": "#c7c7c7",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-70",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-60",
              "description": "Secondary text (light theme)",
              "default": "#4d4d4d",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-gray-40",
              "description": "Subtle icon (hover state)",
              "default": "#a3a3a3",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/tag/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tag/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tag/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tag/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tag/demo/colors/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tag/demo/colors.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tag/demo/desaturated-with-icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tag/demo/desaturated-with-icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tag/demo/desaturated/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tag/demo/desaturated.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tag/demo/filled-color-with-icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tag/demo/filled-color-with-icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tag/demo/filled-color-with-slotted-icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tag/demo/filled-color-with-slotted-icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tag/demo/filled-color/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tag/demo/filled-color.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tag/demo/links/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tag/demo/links.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tag/demo/outline-with-icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tag/demo/outline-with-icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tag/demo/outline-with-slotted-icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tag/demo/outline-with-slotted-icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tag/demo/outline/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tag/demo/outline.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-tag",
          "declaration": {
            "name": "RhTag",
            "module": "rh-tag/rh-tag.js"
          }
        },
        {
          "kind": "js",
          "name": "RhTag",
          "declaration": {
            "name": "RhTag",
            "module": "rh-tag/rh-tag.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-tile/rh-tile-group.js",
      "declarations": [
        {
          "name": "RhTileGroup",
          "description": "A group of `\u003crh-tile\u003e` elements which handles radio selection.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "disabled",
              "description": "Whether tile group interaction is disabled",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "disabled",
              "reflects": true
            },
            {
              "name": "radio",
              "description": "If tile is checkable, whether only one tile can be checked",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "radio",
              "reflects": true
            },
            {
              "name": "colorPalette",
              "description": "Sets color palette, which affects the element's styles as well as descendants' color theme.\nOverrides parent color context.\nYour theme will influence these colors so check there first if you are seeing inconsistencies.\nSee [CSS Custom Properties](#css-custom-properties) for default values\n\nTile group always resets its context to `base`, unless explicitly provided with a `color-palette`.",
              "type": {
                "text": "ColorPalette"
              },
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            },
            {
              "name": "tiles",
              "description": "All slotted tiles",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "selected",
              "description": "All selected tiles",
              "readonly": true,
              "kind": "field"
            },
            {
              "return": {
                "type": {
                  "text": "void"
                }
              },
              "name": "firstUpdated",
              "kind": "method"
            },
            {
              "name": "focus",
              "description": "Sets focus on active tile",
              "kind": "method"
            },
            {
              "parameters": [
                {
                  "name": "tile",
                  "type": {
                    "text": "RhTile"
                  }
                }
              ],
              "name": "selectItem",
              "description": "Programatically select a tile",
              "kind": "method"
            },
            {
              "parameters": [
                {
                  "name": "tile",
                  "type": {
                    "text": "RhTile"
                  }
                }
              ],
              "name": "toggleItem",
              "description": "Programatically toggle a tile",
              "kind": "method"
            },
            {
              "name": "updateItems",
              "description": "Updates slotted tiles to set properties and keyboard navigation",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/rh-tile-group.ts#L23"
          },
          "kind": "class",
          "tagName": "rh-tile-group",
          "attributes": [
            {
              "name": "disabled",
              "description": "Whether tile group interaction is disabled",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "disabled"
            },
            {
              "name": "radio",
              "description": "If tile is checkable, whether only one tile can be checked",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "radio"
            },
            {
              "name": "color-palette",
              "description": "Sets color palette, which affects the element's styles as well as descendants' color theme.\nOverrides parent color context.\nYour theme will influence these colors so check there first if you are seeing inconsistencies.\nSee [CSS Custom Properties](#css-custom-properties) for default values\n\nTile group always resets its context to `base`, unless explicitly provided with a `color-palette`.",
              "type": {
                "text": "ColorPalette"
              },
              "fieldName": "colorPalette"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Put one or more `rh-tile` elements in this slot"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-tile-group",
          "declaration": {
            "name": "RhTileGroup",
            "module": "rh-tile/rh-tile-group.js"
          }
        },
        {
          "kind": "js",
          "name": "RhTileGroup",
          "declaration": {
            "name": "RhTileGroup",
            "module": "rh-tile/rh-tile-group.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-tile/rh-tile.js",
      "declarations": [
        {
          "name": "TileSelectEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "members": [
            {
              "name": "target",
              "type": {
                "text": "RhTile"
              },
              "kind": "field"
            },
            {
              "name": "force",
              "type": {
                "text": "boolean"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/rh-tile.ts#L21"
          },
          "kind": "class"
        },
        {
          "name": "RhTile",
          "summary": "Creates a clickable, contained surface",
          "description": "A tile is a flexible layout with a clickable and contained surface.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "shadowRoot",
              "type": {
                "text": "ShadowRoot"
              },
              "kind": "field"
            },
            {
              "name": "icon",
              "description": "The icon to display in the tile",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "kind": "field",
              "attribute": "icon",
              "reflects": true
            },
            {
              "name": "iconSet",
              "description": "Icon set to display in the tile",
              "type": {
                "text": "IconSetName"
              },
              "default": "'standard'",
              "kind": "field",
              "attribute": "icon-set"
            },
            {
              "name": "accessibleLabel",
              "description": "When checkable, the accessible (visually hidden) label for the form control\nIf not set, the text content of the tile element will be used instead.\n\n\u003cfigure\u003e\n\u003cfigcaption\u003eSetting an accessible label when there is no text content\u003c/figcaption\u003e\n\n```html\n\u003cform\u003e\n\u003crh-tile-group radio\u003e\n\u003crh-tile name=\"radio\" value=\"1\"\u003eTile 1\u003c/rh-tile\u003e\n\u003crh-tile name=\"radio\" value=\"2\"\u003eTile 2\u003c/rh-tile\u003e\n\u003crh-tile name=\"radio\"\nvalue=\"3\"\naccessible-label=\"Tile 3\"\u003e\n\u003cimg slot=\"image\"\nrole=\"presentation\"\nsrc=\"tile-3.webp\"\u003e\n\u003c/rh-tile\u003e\n\u003c/rh-tile-group\u003e\n\u003c/form\u003e\n```\n\u003c/figure\u003e",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "accessible-label"
            },
            {
              "name": "name",
              "description": "Form name",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "name"
            },
            {
              "name": "value",
              "description": "Form value",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "value"
            },
            {
              "name": "checked",
              "description": "If tile is checkable, whether it is currently checked",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "checked",
              "reflects": true
            },
            {
              "name": "disabled",
              "description": "Whether tile interaction is disabled",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "disabled",
              "reflects": true
            },
            {
              "name": "colorPalette",
              "description": "Sets color palette, which affects the element's styles as well as descendants' color theme.\nOverrides parent color context.\nYour theme will influence these colors so check there first if you are seeing inconsistencies.\nSee [CSS Custom Properties](#css-custom-properties) for default values\n\nTile always resets its context to `base`, unless explicitly provided with a `color-palette`.",
              "type": {
                "text": "ColorPalette"
              },
              "kind": "field",
              "attribute": "color-palette",
              "reflects": true
            },
            {
              "name": "link",
              "description": "When set to \"private\", the icon representing the link changes from an arrow to a padlock",
              "type": {
                "text": "'private' | 'public' | 'external'"
              },
              "kind": "field",
              "attribute": "link"
            },
            {
              "parameters": [
                {
                  "name": "message",
                  "type": {
                    "text": "string"
                  }
                }
              ],
              "name": "setCustomValidity",
              "kind": "method"
            },
            {
              "name": "checkValidity",
              "kind": "method"
            },
            {
              "name": "reportValidity",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/rh-tile.ts#L40"
          },
          "kind": "class",
          "tagName": "rh-tile",
          "attributes": [
            {
              "name": "icon",
              "description": "The icon to display in the tile",
              "type": {
                "text": "IconNameFor\u003cIconSetName\u003e"
              },
              "fieldName": "icon"
            },
            {
              "name": "icon-set",
              "description": "Icon set to display in the tile",
              "type": {
                "text": "IconSetName"
              },
              "default": "'standard'",
              "fieldName": "iconSet"
            },
            {
              "name": "accessible-label",
              "description": "When checkable, the accessible (visually hidden) label for the form control\nIf not set, the text content of the tile element will be used instead.\n\n\u003cfigure\u003e\n\u003cfigcaption\u003eSetting an accessible label when there is no text content\u003c/figcaption\u003e\n\n```html\n\u003cform\u003e\n\u003crh-tile-group radio\u003e\n\u003crh-tile name=\"radio\" value=\"1\"\u003eTile 1\u003c/rh-tile\u003e\n\u003crh-tile name=\"radio\" value=\"2\"\u003eTile 2\u003c/rh-tile\u003e\n\u003crh-tile name=\"radio\"\nvalue=\"3\"\naccessible-label=\"Tile 3\"\u003e\n\u003cimg slot=\"image\"\nrole=\"presentation\"\nsrc=\"tile-3.webp\"\u003e\n\u003c/rh-tile\u003e\n\u003c/rh-tile-group\u003e\n\u003c/form\u003e\n```\n\u003c/figure\u003e",
              "type": {
                "text": "string"
              },
              "fieldName": "accessibleLabel"
            },
            {
              "name": "name",
              "description": "Form name",
              "type": {
                "text": "string"
              },
              "fieldName": "name"
            },
            {
              "name": "value",
              "description": "Form value",
              "type": {
                "text": "string"
              },
              "fieldName": "value"
            },
            {
              "name": "checked",
              "description": "If tile is checkable, whether it is currently checked",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "checked"
            },
            {
              "name": "disabled",
              "description": "Whether tile interaction is disabled",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "disabled"
            },
            {
              "name": "color-palette",
              "description": "Sets color palette, which affects the element's styles as well as descendants' color theme.\nOverrides parent color context.\nYour theme will influence these colors so check there first if you are seeing inconsistencies.\nSee [CSS Custom Properties](#css-custom-properties) for default values\n\nTile always resets its context to `base`, unless explicitly provided with a `color-palette`.",
              "type": {
                "text": "ColorPalette"
              },
              "fieldName": "colorPalette"
            },
            {
              "name": "link",
              "description": "When set to \"private\", the icon representing the link changes from an arrow to a padlock",
              "type": {
                "text": "'private' | 'public' | 'external'"
              },
              "fieldName": "link"
            }
          ],
          "events": [
            {
              "name": "select",
              "description": "when tile is clicked",
              "type": {
                "text": "TileSelectEvent"
              }
            }
          ],
          "slots": [
            {
              "name": "image",
              "description": "optional image on top of tile"
            },
            {
              "name": "icon",
              "description": "optional icon"
            },
            {
              "name": "title",
              "description": "A title provides secondary descriptive context. Selectable and compact tiles do not have title slots"
            },
            {
              "name": "headline",
              "description": "In a link tile, the heading should indicate what clicking on the tile will do. In a selectable tile, the heading labels the radio button or checkbox."
            },
            {
              "name": "",
              "description": "The body text expands on heading content and gives the user more information."
            },
            {
              "name": "footer",
              "description": "Footer text should be brief and be used for supplementary information only."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-font-family-body-text",
              "description": "Body text font family",
              "default": "RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-weight-heading-regular",
              "description": "Regular font weight for headings",
              "default": "400",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-tile-interactive-color",
              "description": "Color of interactive elements.\nCould cause accessibility issues; prefer to use `--rh-color-border-interactive-on-light`\nand `--rh-color-border-interactive-on-dark` for theming.",
              "default": "var(--rh-color-border-interactive)"
            },
            {
              "name": "--rh-color-border-interactive",
              "description": "Responsive `border-interactive` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-interactive-on-light` on a themable container with a light color palette and `--rh-color-border-interactive-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-tile-focus-interactive-color",
              "default": "var(--rh-color-interactive-primary-hover)"
            },
            {
              "name": "--rh-color-interactive-primary-hover",
              "description": "Responsive `interactive-primary` (e.g. link) color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-interactive-primary-hover-on-light` on a themable container with a light color palette\n     and to `--rh-color-interactive-primary-hover-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-tile-text-color-secondary",
              "description": "Disabled text and icons.\nCould cause accessibility issues; prefer to use `--rh-color-text-secondary-on-light`\nand `--rh-color-text-secondary-on-dark` for theming.",
              "default": "var(--rh-color-text-secondary)"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-tile-focus-background-color",
              "default": "var(--rh-color-surface-darker, #1f1f1f)"
            },
            {
              "name": "--rh-tile-disabled-background-color",
              "default": "var(--rh-color-surface-dark, #383838)"
            },
            {
              "name": "--rh-tile-border-color",
              "description": "Color of tile border.\nCould cause accessibility issues; prefer to use `--rh-color-border-subtle-on-light`\nand `--rh-color-border-subtle-on-dark` for theming.",
              "default": "var(--rh-color-border-subtle)"
            },
            {
              "name": "--rh-color-border-subtle",
              "description": "Responsive `border-subtle` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-subtle-on-light` on a themable container with a light color palette and `--rh-color-border-subtle-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-tile-link-color",
              "description": "Color of tile link.",
              "default": "var(--_interactive-color)"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-border-width-sm",
              "description": "1px border width; Example: Secondary CTA or Button",
              "default": "1px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-size-icon-05",
              "description": "48px icon box",
              "default": "48px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-size-icon-03",
              "description": "32px icon box",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-heading-xs",
              "description": "h6 heading font size",
              "default": "1.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-weight-body-text-medium",
              "description": "Medium font weight",
              "default": "500",
              "syntax": "\u003cnumber\u003e"
            },
            {
              "name": "--rh-tile-text-color",
              "description": "Color of text.\nCould cause accessibility issues; prefer to use `--rh-color-text-primary-on-light`\nand `--rh-color-text-primary-on-dark` for theming.",
              "default": "var(--rh-color-text-primary)"
            },
            {
              "name": "--rh-color-text-primary",
              "description": "Responsive `text-primary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-primary-on-light` on a themable container with a light color palette and `--rh-color-text-primary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-lg",
              "description": "18px font size",
              "default": "1.125rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-xs",
              "description": "12px font size",
              "default": "0.75rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-2xl",
              "description": "32px spacer",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-animation-speed",
              "default": "0.3s",
              "syntax": "\u003ctime\u003e"
            },
            {
              "name": "--rh-animation-timing",
              "default": "cubic-bezier(0.465, 0.183, 0.153, 0.946)",
              "syntax": "\u003ceasing-function\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-body-text-md",
              "description": "16px font size",
              "default": "1rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-border-interactive-on-dark",
              "description": "Interactive border color (dark theme)",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover-on-dark",
              "description": "Primary interactive - hover (Dark theme)",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-secondary-on-dark",
              "description": "Secondary text color for dark theme",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-subtle-on-dark",
              "description": "Subtle border color (dark theme)",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-dark",
              "description": "Primary text color for dark theme",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-darker",
              "description": "Secondary surface (dark theme)",
              "default": "#1f1f1f",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-dark",
              "description": "Tertiary surface (dark theme)",
              "default": "#383838",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-interactive-on-light",
              "description": "Interactive border color (light theme)",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-interactive-primary-hover-on-light",
              "description": "Primary interactive - hover (Light theme)",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-secondary-on-light",
              "description": "Secondary text color for light theme",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-border-subtle-on-light",
              "description": "Subtle border color (light theme)",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-text-primary-on-light",
              "description": "Primary text color for light theme",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lighter",
              "description": "Tertiary surface (light theme)",
              "default": "#f2f2f2",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-light",
              "description": "Secondary surface (light theme)",
              "default": "#e0e0e0",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/tile/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/accented-tiles/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/accented-tiles.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/checkable/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/checkable.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/color-palettes/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/color-palettes.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/compact-link-with-fullwidth-image-and-icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/compact-link-with-fullwidth-image-and-icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/compact-link-with-icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/compact-link-with-icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/compact-link-with-image-and-icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/compact-link-with-image-and-icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/compact-link-with-image/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/compact-link-with-image.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/compact/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/compact.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/custom-props/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/custom-props.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/desaturated-heading-slotted-icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/desaturated-heading-slotted-icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/desaturated-heading/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/desaturated-heading.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/disabled/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/disabled.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/form-control/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/form-control.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/full-width-images/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/full-width-images.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/icon-with-full-width-image/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/icon-with-full-width-image.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/icon-with-image/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/icon-with-image.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/icon/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/icon.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/in-flex-container/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/in-flex-container.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/link-types/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/link-types.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/tile-group-disabled/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/tile-group-disabled.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/tile-group-radio-disabled/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/tile-group-radio-disabled.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/tile-group-radio/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/tile-group-radio.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/tile-group/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/tile-group.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tile/demo/without-footer-content/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tile/demo/without-footer-content.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "TileSelectEvent",
          "declaration": {
            "name": "TileSelectEvent",
            "module": "rh-tile/rh-tile.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-tile",
          "declaration": {
            "name": "RhTile",
            "module": "rh-tile/rh-tile.js"
          }
        },
        {
          "kind": "js",
          "name": "RhTile",
          "declaration": {
            "name": "RhTile",
            "module": "rh-tile/rh-tile.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-timestamp/rh-timestamp.js",
      "declarations": [
        {
          "name": "RhTimestamp",
          "summary": "Displays a line of text with date and time values",
          "description": "A timestamp provides consistent formats for displaying date and time values.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "dateFormat",
              "description": "Custom date formatting style. See [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat#datestyle) for options.",
              "type": {
                "text": "DateTimeFormat"
              },
              "kind": "field",
              "attribute": "date-format",
              "reflects": true
            },
            {
              "name": "timeFormat",
              "description": "Custom time formatting style. See [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat#timestyle) for options.",
              "type": {
                "text": "DateTimeFormat"
              },
              "kind": "field",
              "attribute": "time-format",
              "reflects": true
            },
            {
              "name": "customFormat",
              "description": "Custom date and time formatting options. See [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat#options) for a list of options.",
              "type": {
                "text": "object"
              },
              "kind": "field"
            },
            {
              "name": "displaySuffix",
              "description": "Text to display after the timestamp",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "display-suffix",
              "reflects": true
            },
            {
              "name": "locale",
              "description": "Overrides the runtime's default locale",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "locale",
              "reflects": true
            },
            {
              "name": "relative",
              "description": "Formats a timestamp in realtive terms",
              "type": {
                "text": "boolean"
              },
              "kind": "field",
              "attribute": "relative",
              "reflects": true
            },
            {
              "name": "utc",
              "description": "Sets the timezone as UTC",
              "type": {
                "text": "boolean"
              },
              "kind": "field",
              "attribute": "utc",
              "reflects": true
            },
            {
              "name": "hour12",
              "description": "Whether to use 12-hour time (as opposed to 24-hour time)",
              "type": {
                "text": "boolean"
              },
              "kind": "field",
              "attribute": "hour-12",
              "reflects": true
            },
            {
              "name": "date",
              "description": "A string value representing a date",
              "kind": "field",
              "attribute": "date",
              "reflects": true
            },
            {
              "name": "isoString",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "time",
              "readonly": true,
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-timestamp/rh-timestamp.ts#L28"
          },
          "kind": "class",
          "tagName": "rh-timestamp",
          "attributes": [
            {
              "name": "date-format",
              "description": "Custom date formatting style. See [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat#datestyle) for options.",
              "type": {
                "text": "DateTimeFormat"
              },
              "fieldName": "dateFormat"
            },
            {
              "name": "time-format",
              "description": "Custom time formatting style. See [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/DateTimeFormat#timestyle) for options.",
              "type": {
                "text": "DateTimeFormat"
              },
              "fieldName": "timeFormat"
            },
            {
              "name": "display-suffix",
              "description": "Text to display after the timestamp",
              "type": {
                "text": "string"
              },
              "fieldName": "displaySuffix"
            },
            {
              "name": "locale",
              "description": "Overrides the runtime's default locale",
              "type": {
                "text": "string"
              },
              "fieldName": "locale"
            },
            {
              "name": "relative",
              "description": "Formats a timestamp in realtive terms",
              "type": {
                "text": "boolean"
              },
              "fieldName": "relative"
            },
            {
              "name": "utc",
              "description": "Sets the timezone as UTC",
              "type": {
                "text": "boolean"
              },
              "fieldName": "utc"
            },
            {
              "name": "hour-12",
              "description": "Whether to use 12-hour time (as opposed to 24-hour time)",
              "type": {
                "text": "boolean"
              },
              "fieldName": "hour12"
            },
            {
              "name": "date",
              "description": "A string value representing a date",
              "fieldName": "date"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/timestamp/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-timestamp/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/timestamp/demo/custom-format/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-timestamp/demo/custom-format.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/timestamp/demo/fallback/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-timestamp/demo/fallback.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/timestamp/demo/formats/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-timestamp/demo/formats.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/timestamp/demo/relative/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-timestamp/demo/relative.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/timestamp/demo/tooltip/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-timestamp/demo/tooltip.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-timestamp",
          "declaration": {
            "name": "RhTimestamp",
            "module": "rh-timestamp/rh-timestamp.js"
          }
        },
        {
          "kind": "js",
          "name": "RhTimestamp",
          "declaration": {
            "name": "RhTimestamp",
            "module": "rh-timestamp/rh-timestamp.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-tooltip/rh-tooltip.js",
      "declarations": [
        {
          "name": "RhTooltip",
          "summary": "Reveals a small area of information on hover",
          "description": "A tooltip is a floating text area that provides helpful\nor contextual information on hover, focus, or tap.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "version",
              "type": {
                "text": "string"
              },
              "default": "'{{version}}'",
              "readonly": true,
              "kind": "field",
              "static": true
            },
            {
              "name": "instances",
              "default": "new Set\u003cRhTooltip\u003e()",
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "announcer",
              "type": {
                "text": "HTMLElement"
              },
              "kind": "field",
              "static": true,
              "privacy": "private"
            },
            {
              "parameters": [
                {
                  "name": "message",
                  "type": {
                    "text": "string"
                  }
                }
              ],
              "name": "announce",
              "kind": "method",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "initAnnouncer",
              "kind": "method",
              "static": true,
              "privacy": "private"
            },
            {
              "name": "position",
              "description": "The position of the tooltip, relative to the invoking content",
              "type": {
                "text": "Placement"
              },
              "default": "'top'",
              "kind": "field",
              "attribute": "position"
            },
            {
              "name": "content",
              "description": "Tooltip content. Overridden by the content slot",
              "type": {
                "text": "string"
              },
              "kind": "field",
              "attribute": "content"
            },
            {
              "name": "silent",
              "description": "When true, disables screen reader announcements for tooltip content. Only use when another accessible label is provided.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "silent",
              "reflects": true
            },
            {
              "name": "show",
              "description": "Show the tooltip",
              "kind": "method"
            },
            {
              "name": "hide",
              "description": "Hide the tooltip",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tooltip/rh-tooltip.ts#L56"
          },
          "kind": "class",
          "tagName": "rh-tooltip",
          "attributes": [
            {
              "name": "position",
              "description": "The position of the tooltip, relative to the invoking content",
              "type": {
                "text": "Placement"
              },
              "default": "'top'",
              "fieldName": "position"
            },
            {
              "name": "content",
              "description": "Tooltip content. Overridden by the content slot",
              "type": {
                "text": "string"
              },
              "fieldName": "content"
            },
            {
              "name": "silent",
              "description": "When true, disables screen reader announcements for tooltip content. Only use when another accessible label is provided.",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "silent"
            }
          ],
          "slots": [
            {
              "name": "",
              "description": "Place invoking element here,\ni.e. the element which when hovered the tooltip will display.\nMust be inline content."
            },
            {
              "name": "content",
              "description": "Place tooltip content here. Overrides the `content` attribute."
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-tooltip-arrow-size",
              "default": "var(--rh-tooltip__arrow--Width, 11px)"
            },
            {
              "name": "--rh-tooltip__arrow--Width",
              "default": "11px",
              "deprecated": "use --rh-tooltip-arrow-size"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-box-shadow-sm",
              "description": "Small box shadow",
              "default": "0 2px 4px 0 rgba(21, 21, 21, 0.2)",
              "syntax": "\u003cshadow\u003e"
            },
            {
              "name": "--rh-tooltip-max-width",
              "default": "var(--rh-tooltip--MaxWidth, 18.75rem)"
            },
            {
              "name": "--rh-tooltip--MaxWidth",
              "default": "18.75rem",
              "deprecated": "use --rh-tooltip-max-width"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-tooltip-content-padding-block-start",
              "default": "var(--rh-tooltip__content--PaddingTop, var(--rh-space-lg, 16px))"
            },
            {
              "name": "--rh-tooltip__content--PaddingTop",
              "default": "var(--rh-space-lg, 16px)",
              "deprecated": "use --rh-tooltip-content-padding-block-start"
            },
            {
              "name": "--rh-tooltip-content-padding-block-end",
              "default": "var(--rh-tooltip__content--PaddingBottom, var(--rh-space-lg, 16px))"
            },
            {
              "name": "--rh-tooltip__content--PaddingBottom",
              "default": "var(--rh-space-lg, 16px)",
              "deprecated": "use --rh-tooltip-content-padding-block-end"
            },
            {
              "name": "--rh-tooltip-content-padding-inline-start",
              "default": "var(--rh-tooltip__content--PaddingLeft, var(--rh-space-lg, 16px))"
            },
            {
              "name": "--rh-tooltip__content--PaddingLeft",
              "default": "var(--rh-space-lg, 16px)",
              "deprecated": "use --rh-tooltip-content-padding-inline-start"
            },
            {
              "name": "--rh-tooltip-content-padding-inline-end",
              "default": "var(--rh-tooltip__content--PaddingRight, var(--rh-space-lg, 16px))"
            },
            {
              "name": "--rh-tooltip__content--PaddingRight",
              "default": "var(--rh-space-lg, 16px)",
              "deprecated": "use --rh-tooltip-content-padding-inline-end"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-tooltip-content-font-size",
              "description": "Font size",
              "default": "var(--rh-tooltip__content--FontSize, var(--rh-font-size-body-text-sm, 0.875rem))"
            },
            {
              "name": "--rh-tooltip__content--FontSize",
              "default": "var(--rh-font-size-body-text-sm, 0.875rem)",
              "deprecated": "use --rh-tooltip-content-font-size"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-tooltip__content--Color",
              "default": "var(--rh-color-text-primary-on-light, #151515)",
              "deprecated": "use --rh-tooltip-content-color"
            },
            {
              "name": "--rh-color-text-primary-on-light",
              "description": "Primary text color for light theme",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-tooltip-content-color",
              "default": "var(--rh-color-text-primary-on-dark, #ffffff)"
            },
            {
              "name": "--rh-color-text-primary-on-dark",
              "description": "Primary text color for dark theme",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-color-surface-lightest",
              "description": "Primary surface (light theme)",
              "default": "#ffffff",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-tooltip-content-background-color",
              "default": "var(--rh-tooltip__content--BackgroundColor, var(--rh-color-surface-darkest, #151515))"
            },
            {
              "name": "--rh-tooltip__content--BackgroundColor",
              "default": "var(--rh-color-surface-darkest, #151515)",
              "deprecated": "use --rh-tooltip-content-background-color"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/tooltip/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tooltip/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tooltip/demo/bottom/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tooltip/demo/bottom.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tooltip/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tooltip/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tooltip/demo/content-attributes/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tooltip/demo/content-attributes.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tooltip/demo/left/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tooltip/demo/left.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tooltip/demo/right/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tooltip/demo/right.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tooltip/demo/silent/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tooltip/demo/silent.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/tooltip/demo/top/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-tooltip/demo/top.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "custom-element-definition",
          "name": "rh-tooltip",
          "declaration": {
            "name": "RhTooltip",
            "module": "rh-tooltip/rh-tooltip.js"
          }
        },
        {
          "kind": "js",
          "name": "RhTooltip",
          "declaration": {
            "name": "RhTooltip",
            "module": "rh-tooltip/rh-tooltip.js"
          }
        }
      ]
    },
    {
      "kind": "javascript-module",
      "path": "rh-video-embed/rh-video-embed.js",
      "declarations": [
        {
          "name": "ConsentClickEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "members": [
            {
              "name": "target",
              "type": {
                "text": "RhVideoEmbed"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-video-embed/rh-video-embed.ts#L15"
          },
          "kind": "class"
        },
        {
          "name": "VideoClickEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "members": [
            {
              "name": "target",
              "type": {
                "text": "RhVideoEmbed"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-video-embed/rh-video-embed.ts#L22"
          },
          "kind": "class"
        },
        {
          "name": "VideoPlayEvent",
          "superclass": {
            "name": "Event",
            "package": "global:"
          },
          "members": [
            {
              "name": "target",
              "type": {
                "text": "RhVideoEmbed"
              },
              "kind": "field"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-video-embed/rh-video-embed.ts#L29"
          },
          "kind": "class"
        },
        {
          "name": "RhVideoEmbed",
          "summary": "Reveals a small area of information on hover",
          "description": "A Video embed is a graphical preview of a video overlayed with a play button. When clicked, the embedded YouTube video will begin playing.",
          "superclass": {
            "name": "LitElement",
            "package": "lit"
          },
          "members": [
            {
              "name": "requireConsent",
              "description": "Add to `rh-video-embed` when a video requires consent for cookies",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "kind": "field",
              "attribute": "require-consent"
            },
            {
              "name": "consentButton",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "consentClicked",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "focusableElement",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "iframeElement",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "playButton",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "playClicked",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "playStarted",
              "readonly": true,
              "kind": "field"
            },
            {
              "name": "firstUpdated",
              "kind": "method"
            }
          ],
          "source": {
            "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-video-embed/rh-video-embed.ts#L49"
          },
          "kind": "class",
          "tagName": "rh-video-embed",
          "attributes": [
            {
              "name": "require-consent",
              "description": "Add to `rh-video-embed` when a video requires consent for cookies",
              "type": {
                "text": "boolean"
              },
              "default": "false",
              "fieldName": "requireConsent"
            }
          ],
          "events": [
            {
              "name": "consent-click",
              "description": "\"Update preferences\" consent button is clicked"
            },
            {
              "name": "request-play",
              "description": "Play button is clicked"
            },
            {
              "name": "play",
              "description": "Video is about to be played"
            }
          ],
          "slots": [
            {
              "name": "thumbnail",
              "description": "Optional thumbnail image on top of video embed; should include `alt` text"
            },
            {
              "name": "",
              "description": "Place video embed code here; iframe should include a `title` attribute with the video title"
            },
            {
              "name": "autoplay",
              "description": "DO NOT USE! (Used by `rh-video-embed`.)"
            },
            {
              "name": "consent-message",
              "description": "Text explaining opt-in to cookies is required, e.g. `\u003cp\u003eView this video by opting in to “Advertising Cookies.”\u003c/p\u003e`"
            },
            {
              "name": "consent-button-text",
              "description": "Text for CTA button to update preferences, e.g. \"Update preferences\""
            },
            {
              "name": "play-button-text",
              "description": "Text for play button; recommended value \"Video title (video)\""
            },
            {
              "name": "caption",
              "description": "Optional caption below video embed"
            }
          ],
          "cssParts": [
            {
              "name": "figure",
              "description": "The outer container for rh-video-embed"
            },
            {
              "name": "video",
              "description": "The container for the video, thumbnail, and play button"
            },
            {
              "name": "consent-body",
              "description": "The container for the consent message and consent button"
            },
            {
              "name": "play",
              "description": "The play button on top of the thumbnail"
            },
            {
              "name": "caption",
              "description": "The container for the caption"
            }
          ],
          "cssProperties": [
            {
              "name": "--rh-color-border-interactive",
              "description": "Responsive `border-interactive` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to `--rh-color-border-interactive-on-light` on a themable container with a light color palette and `--rh-color-border-interactive-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-opacity-20",
              "description": "20% opacity",
              "default": "20%"
            },
            {
              "name": "--rh-opacity-80",
              "description": "80% opacity",
              "default": "80%"
            },
            {
              "name": "--rh-opacity-50",
              "description": "50% opacity",
              "default": "50%"
            },
            {
              "name": "--rh-color-text-secondary",
              "description": "Responsive `text-secondary` color value. Typically read only - use a themable container e.g. `\u003crh-surface\u003e` Resolves to `--rh-color-text-secondary-on-light` on a themable container with a light color palette and `--rh-color-text-secondary-on-dark` on a themable container with a dark color palette.",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-font-size-body-text-sm",
              "description": "14px font size",
              "default": "0.875rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-line-height-body-text",
              "description": "Line height for body text",
              "default": "1.5"
            },
            {
              "name": "--rh-font-family-heading",
              "description": "Heading font family",
              "default": "RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif",
              "syntax": "\u003cfont-family\u003e"
            },
            {
              "name": "--rh-font-size-heading-xs",
              "description": "h6 heading font size",
              "default": "1.25rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-line-height-heading",
              "description": "Line height for headings",
              "default": "1.3"
            },
            {
              "name": "--rh-space-lg",
              "description": "16px spacer",
              "default": "16px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-space-xl",
              "description": "24px spacer",
              "default": "24px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-font-size-heading-sm",
              "description": "h5 heading font size",
              "default": "1.5rem",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-radius-default",
              "description": "3px border radius; Example: Card",
              "default": "3px"
            },
            {
              "name": "--rh-border-width-lg",
              "description": "3px border width: Example: Expanded Accordion panel",
              "default": "3px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-border-width-md",
              "description": "2px border width: Example: Alert",
              "default": "2px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface-darkest",
              "description": "Primary surface (dark theme)",
              "default": "#151515",
              "syntax": "\u003ccolor\u003e"
            },
            {
              "name": "--rh-length-2xl",
              "description": "32px length token",
              "default": "32px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-length-4xl",
              "description": "64px length token",
              "default": "64px",
              "syntax": "\u003clength\u003e"
            },
            {
              "name": "--rh-color-surface",
              "description": "Responsive `surface` color value. Typically read-only - use a themable container, e.g. `\u003crh-surface\u003e`. Resolves to the surface color corresponding to the surface' color palette.",
              "syntax": "\u003ccolor\u003e"
            }
          ],
          "demos": [
            {
              "url": "https://ux.redhat.com/elements/video-embed/demo/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-video-embed/demo/index.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/video-embed/demo/alignment/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-video-embed/demo/alignment.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/video-embed/demo/card-with-video/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-video-embed/demo/card-with-video.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/video-embed/demo/color-context/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-video-embed/demo/color-context.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/video-embed/demo/no-caption/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-video-embed/demo/no-caption.html"
              }
            },
            {
              "url": "https://ux.redhat.com/elements/video-embed/demo/require-consent/",
              "source": {
                "href": "https://github.com/redhat-ux/red-hat-design-system/tree/main/elements/rh-video-embed/demo/require-consent.html"
              }
            }
          ],
          "customElement": true
        }
      ],
      "exports": [
        {
          "kind": "js",
          "name": "ConsentClickEvent",
          "declaration": {
            "name": "ConsentClickEvent",
            "module": "rh-video-embed/rh-video-embed.js"
          }
        },
        {
          "kind": "js",
          "name": "VideoClickEvent",
          "declaration": {
            "name": "VideoClickEvent",
            "module": "rh-video-embed/rh-video-embed.js"
          }
        },
        {
          "kind": "js",
          "name": "VideoPlayEvent",
          "declaration": {
            "name": "VideoPlayEvent",
            "module": "rh-video-embed/rh-video-embed.js"
          }
        },
        {
          "kind": "custom-element-definition",
          "name": "rh-video-embed",
          "declaration": {
            "name": "RhVideoEmbed",
            "module": "rh-video-embed/rh-video-embed.js"
          }
        },
        {
          "kind": "js",
          "name": "RhVideoEmbed",
          "declaration": {
            "name": "RhVideoEmbed",
            "module": "rh-video-embed/rh-video-embed.js"
          }
        }
      ]
    }
  ]
}