{"version":3,"file":"heading.CQIzFo2C.js","sources":["../../../../../packages/web-components/src/lib/components/heading/heading.ts"],"sourcesContent":["import { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { pdsCustomElement as customElement } from '../../decorators/pds-custom-element';\nimport { PdsElement } from '../PdsElement';\nimport { required } from '../../decorators/required';\nimport styles from './heading.scss?inline';\n\n/**\n * @summary This component displays different heading tags in different sizes based on properties\n *\n * @slot default Required: Heading text\n */\n@customElement('pds-heading', {\n  category: 'component',\n  type: 'component',\n  state: 'stable',\n  styles,\n})\nexport class PdsHeading extends PdsElement {\n  /**\n   * Style variant\n   * - **display-default** renders a heading with `display-default` type semantic preset\n   * - **display-sm** renders a heading with `display-sm` type semantic preset\n   * - **headline-lg** renders a heading with `headline-lg` type semantic preset\n   * - **headline-default** renders a heading with `headline-default` type semantic preset\n   * - **headline-sm** renders a heading with `headline-sm` type semantic preset\n   * - **title-lg** renders a heading with `title-lg` type semantic preset\n   * - **title-default** renders a heading with `title-default` type semantic preset\n   * - **title-sm** renders a heading with `title-sm` type semantic preset\n   * - **title-xs** renders a heading with `title-xs` type semantic preset\n   * - **label-lg** renders a heading with `label-lg` type semantic preset\n   * - **label-default** renders a heading with `label-default` type semantic preset\n   * - **label-sm** renders a heading with `label-sm` type semantic preset\n   * - **meta-default** renders a heading with `meta-default` type semantic preset\n   * - **meta-sm** renders a heading with `meta-sm` type semantic preset\n   * This is a **required** property.\n   */\n  @required\n  @property()\n  variant:\n    | 'display-default'\n    | 'display-sm'\n    | 'headline-lg'\n    | 'headline-default'\n    | 'headline-sm'\n    | 'title-lg'\n    | 'title-default'\n    | 'title-sm'\n    | 'title-xs'\n    | 'label-lg'\n    | 'label-default'\n    | 'label-sm'\n    | 'meta-sm'\n    | 'meta-default';\n\n  @property({ type: Boolean })\n  inverted?: boolean;\n\n  /**\n   * Dynamic tag name for the component\n   * This is needed to use proper semantic heading treatments depending on where the banner lives on the page\n   * <pds-heading variant=\"display-default\">\n   *   <ul>\n   *     <li>**h1** renders an `h1` tag</li>\n   *     <li>**h2** renders an `h2` tag</li>\n   *     <li>**h3** renders an `h3` tag</li>\n   *     <li>**h4** renders an `h4` tag</li>\n   *     <li>**h5** renders an `h5` tag</li>\n   *     <li>**h6** renders an `h6` tag</li>\n   *   </ul>\n   * </pds-heading>\n   * This is a **required** property.\n   */\n  @required\n  @property()\n  headingTag: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\n  /**\n   * @internal\n   */\n  get classNames() {\n    return {\n      [this.variant]: !!this.variant,\n      inverted: this.inverted === true,\n    };\n  }\n\n  render() {\n    switch (this.headingTag) {\n      case 'h2':\n        return html`<h2 class=${this.getClass()}>\n          <slot></slot>\n        </h2> `;\n      case 'h3':\n        return html`<h3 class=${this.getClass()} part=\"heading\">\n          <slot></slot>\n        </h3>`;\n      case 'h4':\n        return html`<h4 class=${this.getClass()}>\n          <slot></slot>\n        </h4>`;\n      case 'h5':\n        return html`<h5 class=${this.getClass()}>\n          <slot></slot>\n        </h5>`;\n      case 'h6':\n        return html`<h6 class=${this.getClass()}>\n          <slot></slot>\n        </h6>`;\n      default:\n        return html`<h2>\n          <slot></slot>\n        </h2>`;\n    }\n  }\n}\n"],"names":["PdsHeading","PdsElement","html","__decorateClass","required","property","customElement","styles"],"mappings":";;;;;;;;;AAkBa,IAAAA,IAAN,cAAyBC,EAAW;AAAA;AAAA;AAAA;AAAA,EA8DzC,IAAI,aAAa;AACR,WAAA;AAAA,MACL,CAAC,KAAK,OAAO,GAAG,CAAC,CAAC,KAAK;AAAA,MACvB,UAAU,KAAK,aAAa;AAAA,IAAA;AAAA,EAEhC;AAAA,EAEA,SAAS;AACP,YAAQ,KAAK,YAAY;AAAA,MACvB,KAAK;AACI,eAAAC,cAAiB,KAAK,SAAA,CAAU;AAAA;AAAA;AAAA,MAGzC,KAAK;AACI,eAAAA,cAAiB,KAAK,SAAA,CAAU;AAAA;AAAA;AAAA,MAGzC,KAAK;AACI,eAAAA,cAAiB,KAAK,SAAA,CAAU;AAAA;AAAA;AAAA,MAGzC,KAAK;AACI,eAAAA,cAAiB,KAAK,SAAA,CAAU;AAAA;AAAA;AAAA,MAGzC,KAAK;AACI,eAAAA,cAAiB,KAAK,SAAA,CAAU;AAAA;AAAA;AAAA,MAGzC;AACS,eAAAA,cAAiB,KAAK,SAAA,CAAU;AAAA;AAAA;AAAA,IAG3C;AAAA,EACF;AACF;AA5EEC,EAAA;AAAA,EAFCC;AAAA,EACAC,EAAS;AAAA,GApBCL,EAqBX,WAAA,WAAA,CAAA;AAiBAG,EAAA;AAAA,EADCE,EAAS,EAAE,MAAM,SAAS;AAAA,GArChBL,EAsCX,WAAA,YAAA,CAAA;AAmBAG,EAAA;AAAA,EAFCC;AAAA,EACAC,EAAS;AAAA,GAxDCL,EAyDX,WAAA,cAAA,CAAA;AAzDWA,IAANG,EAAA;AAAA,EANNG,EAAc,eAAe;AAAA,IAC5B,UAAU;AAAA,IACV,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAAC;AAAA,EAAA,CACD;AAAA,GACYP,CAAA;"}