@patternfly/elements 3.0.0 → 3.0.1

package/pf-clipboard-copy/pf-clipboard-copy.js.map

@@ -1 +1 @@
-{"version":3,"file":"pf-clipboard-copy.js","sourceRoot":"","sources":["pf-clipboard-copy.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;;;AAI3D,OAAO,6CAA6C,CAAC;AACrD,OAAO,yCAAyC,CAAC;AACjD,OAAO,+CAA+C,CAAC;AAEvD,MAAM,KAAK,GAAG,CAAC,EAAW,EAAE,EAAE,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;AAEnE;;;;;GAKG;AAEI,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,iBAAiB;IAA/C;;;QAKiC,aAAQ,GAAG,QAAQ,CAAC;QAEpB,aAAQ,GAAG,MAAM,CAAC;QAEjB,kBAAa,GAAG,gBAAgB,CAAC;QAE/B,oBAAe,GAAG,cAAc,CAAC;QAEpB,eAAU,GAAG,GAAG,CAAC;QAElB,cAAS,GAAG,IAAI,CAAC;QAE1B,UAAK,GAAG,KAAK,CAAC;QAEd,SAAI,GAAG,KAAK,CAAC;QAEb,aAAQ,GAAG,KAAK,CAAC;QAE7D;;WAEG;QACyC,eAAU,GAAG,KAAK,CAAC;QAEnB,aAAQ,GAAG,KAAK,CAAC;QAE7D;;WAEG;QACyC,WAAM,GAAG,KAAK,CAAC;QAEf,YAAO,GAAG,KAAK,CAAC;QAEvC,UAAK,GAAG,EAAE,CAAC;QAEhC,kCAAU,KAAK,EAAC;QAEhB,8BAAM,IAAI,gBAAgB,CAAC,GAAG,EAAE,CAAC,uBAAA,IAAI,+DAAY,MAAhB,IAAI,CAAc,CAAC,EAAC;IAyFvD,CAAC;IAvFC,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,uBAAA,IAAI,2BAAI,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC;QAChD,uBAAA,IAAI,+DAAY,MAAhB,IAAI,CAAc,CAAC;IACrB,CAAC;IAED;;;;OAIG;IACH,MAAM;QACJ,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QAC9E,OAAO,IAAI,CAAA;8BACe,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,KAAK,GAAG,CAAC;;;;;;;kCAOjD,CAAC,UAAU;kCACX,uBAAA,IAAI,4DAAS;;;;2BAIpB,CAAC,CAAC,MAAM,IAAI,OAAO,CAAC,KAAK,IAAI,CAAC,KAAK;;yBAErC,MAAM,IAAI,OAAO;2BACf,QAAQ,IAAI,QAAQ;wBACvB,IAAI,CAAC,KAAK;wBACV,uBAAA,IAAI,6DAAU;4BACV,IAAI,CAAC,aAAa;;;;mCAIX,SAAS,CAAC,CAAC,CAAC,MAAM,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;iCACzD,IAAI,CAAC,QAAQ;;kCAEZ,IAAI,CAAC,IAAI;;;mCAGR,uBAAA,IAAI,+BAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ;;;;4BAInD,IAAI,CAAC,KAAK;+BACP,IAAI,CAAC,QAAQ;6BACf,CAAC,CAAC,UAAU,IAAI,QAAQ,CAAC;4BAC1B,uBAAA,IAAI,6DAAU;;;KAGrC,CAAC;IACJ,CAAC;IAyBQ,KAAK,CAAC,IAAI;QACjB,MAAM,KAAK,CAAC,IAAI,EAAE,CAAC;QACnB,MAAM,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC7B,uBAAA,IAAI,2BAAW,IAAI,MAAA,CAAC;QACpB,IAAI,CAAC,aAAa,EAAE,CAAC;QACrB,MAAM,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC5B,uBAAA,IAAI,2BAAW,KAAK,MAAA,CAAC;QACrB,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;;;;;;IA9BC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;AACjC,CAAC;+DAES,CAAQ;IAChB,MAAM,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC,MAA0B,IAAI,mBAAmB,CAAC;IACtE,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;AACrB,CAAC;;IAGC,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QAC/B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,uBAAA,IAAI,2DAAQ,MAAZ,IAAI,EAAS,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,KAAK,CAAC,EAAE,CAC1F,CAAC,KAAK,YAAY,OAAO,IAAI,KAAK,YAAY,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;aACpF,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;IACf,CAAC;AACH,CAAC;2DAEO,GAAW;IACjB,MAAM,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;IACxC,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IACrC,OAAO,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,MAAM,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;AAC9E,CAAC;AAtHe,sBAAM,GAAG,CAAC,GAAG,iBAAiB,CAAC,MAAM,EAAE,MAAM,CAAC,AAAxC,CAAyC;AAExD,iCAAiB,GAAmB,EAAE,GAAG,iBAAiB,CAAC,iBAAiB,EAAE,cAAc,EAAE,IAAI,EAAE,AAAnF,CAAoF;AAEtE;IAArC,QAAQ,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC;iDAAqB;AAEpB;IAArC,QAAQ,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC;iDAAmB;AAEjB;IAAtC,QAAQ,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;sDAAkC;AAE/B;IAAxC,QAAQ,CAAC,EAAE,SAAS,EAAE,cAAc,EAAE,CAAC;wDAAkC;AAEpB;IAArD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC;mDAAkB;AAElB;IAApD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;kDAAkB;AAE1B;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAAe;AAEd;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAAc;AAEb;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDAAkB;AAKjB;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDAAoB;AAEnB;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;iDAAkB;AAKjB;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+CAAgB;AAEf;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gDAAiB;AAEvC;IAApB,QAAQ,EAAE;8CAAqB;AArCrB,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CAkI3B","sourcesContent":["import { html } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { BaseClipboardCopy } from './BaseClipboardCopy.js';\n\nimport styles from './pf-clipboard-copy.css';\n\nimport '@patternfly/elements/pf-button/pf-button.js';\nimport '@patternfly/elements/pf-icon/pf-icon.js';\nimport '@patternfly/elements/pf-tooltip/pf-tooltip.js';\n\nconst sleep = (ms?: number) => new Promise(r => setTimeout(r, ms));\n\n/**\n * The **clipboard copy** component allows users to quickly and easily copy content to their clipboard.\n *\n * @slot - Place content to copy here, or use the `value` attribute\n * @slot actions - Place additional action buttons here\n */\n@customElement('pf-clipboard-copy')\nexport class PfClipboardCopy extends BaseClipboardCopy {\n  static readonly styles = [...BaseClipboardCopy.styles, styles];\n\n  static shadowRootOptions: ShadowRootInit = { ...BaseClipboardCopy.shadowRootOptions, delegatesFocus: true };\n\n  @property({ attribute: 'click-tip' }) clickTip = 'Copied';\n\n  @property({ attribute: 'hover-tip' }) hoverTip = 'Copy';\n\n  @property({ attribute: 'text-label' }) textAriaLabel = 'Copyable input';\n\n  @property({ attribute: 'toggle-label' }) toggleAriaLabel = 'Show content';\n\n  @property({ type: Number, attribute: 'entry-delay' }) entryDelay = 300;\n\n  @property({ type: Number, attribute: 'exit-delay' }) exitDelay = 1500;\n\n  @property({ type: Boolean, reflect: true }) block = false;\n\n  @property({ type: Boolean, reflect: true }) code = false;\n\n  @property({ type: Boolean, reflect: true }) expanded = false;\n\n  /**\n   * Implies not `inline`.\n   */\n  @property({ type: Boolean, reflect: true }) expandable = false;\n\n  @property({ type: Boolean, reflect: true }) readonly = false;\n\n  /**\n   * Implies not expandable. Overrules `expandable`.\n   */\n  @property({ type: Boolean, reflect: true }) inline = false;\n\n  @property({ type: Boolean, reflect: true }) compact = false;\n\n  @property() override value = '';\n\n  #copied = false;\n\n  #mo = new MutationObserver(() => this.#onMutation());\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.#mo.observe(this, { characterData: true });\n    this.#onMutation();\n  }\n\n  /**\n   * @todo fix the collapsed whitespace between the end of the \"inline-compact\" variant and the text node.\n   * This demonstrates the collapsed whitespace issue.\n   * The extra space between the closing slot tag and the closing template literal results in a collapsed whitespace.\n   */\n  render() {\n    const { expanded, expandable, inline, compact, code, block, readonly } = this;\n    return html`\n      <div class=\"container ${classMap({ code, expanded, inline, compact, block, })}\">\n        <div id=\"input-group\">\n          <div id=\"wrapper\">\n            <pf-button id=\"expand-button\"\n                        plain\n                        variant=\"control\"\n                        label=\"EXPAND\"\n                        ?inert=\"${!expandable}\"\n                        @click=\"${this.#onClick}\">\n              <pf-icon icon=\"chevron-right\"></pf-icon>\n            </pf-button>\n          </div>\n          <span ?hidden=\"${!(inline || compact)}\">${this.value}</span>\n          <input\n              ?hidden=\"${inline || compact}\"\n              ?disabled=\"${expanded || readonly}\"\n              .value=\"${this.value}\"\n              @input=\"${this.#onChange}\"\n              aria-label=\"${this.textAriaLabel}\">\n          <pf-tooltip>\n            <pf-button id=\"copy-button\"\n                        plain\n                        variant=\"${ifDefined(!(inline || compact) ? 'control' : undefined)}\"\n                        label=\"${this.hoverTip}\"\n                        size=\"lg\"\n                        @click=\"${this.copy}\">\n              <pf-icon icon=\"copy\"></pf-icon>\n            </pf-button>\n            <span slot=\"content\">${this.#copied ? this.clickTip : this.hoverTip}</span>\n          </pf-tooltip>\n          <slot name=\"actions\"></slot>\n        </div>\n        <textarea .value=\"${this.value}\"\n                  .disabled=\"${this.readonly}\"\n                  ?hidden=\"${!(expandable && expanded)}\"\n                  @input=\"${this.#onChange}\">\n        </textarea>\n      </div>\n    `;\n  }\n\n  #onClick() {\n    this.expanded = !this.expanded;\n  }\n\n  #onChange(e: Event) {\n    const { value } = e.target as HTMLInputElement || HTMLTextAreaElement;\n    this.value = value;\n  }\n\n  #onMutation() {\n    if (this.childNodes.length > 0) {\n      this.value = this.getAttribute('value') ?? this.#dedent(Array.from(this.childNodes, child =>\n        (child instanceof Element || child instanceof Text) ? (child.textContent ?? '') : '')\n        .join(''));\n    }\n  }\n\n  #dedent(str: string): string {\n    const stripped = str.replace(/^\\n/, '');\n    const match = stripped.match(/^\\s+/);\n    return match ? stripped.replace(new RegExp(`^${match[0]}`, 'gm'), '') : str;\n  }\n\n  override async copy() {\n    await super.copy();\n    await sleep(this.entryDelay);\n    this.#copied = true;\n    this.requestUpdate();\n    await sleep(this.exitDelay);\n    this.#copied = false;\n    this.requestUpdate();\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-clipboard-copy': PfClipboardCopy;\n  }\n}\n"]}
+{"version":3,"file":"pf-clipboard-copy.js","sourceRoot":"","sources":["pf-clipboard-copy.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { BaseClipboardCopy } from './BaseClipboardCopy.js';\n\nimport styles from './pf-clipboard-copy.css';\n\nimport '@patternfly/elements/pf-button/pf-button.js';\nimport '@patternfly/elements/pf-icon/pf-icon.js';\nimport '@patternfly/elements/pf-tooltip/pf-tooltip.js';\n\nconst sleep = (ms?: number) => new Promise(r => setTimeout(r, ms));\n\n/**\n * The **clipboard copy** component allows users to quickly and easily copy content to their clipboard.\n * @slot - Place content to copy here, or use the `value` attribute\n * @slot actions - Place additional action buttons here\n */\n@customElement('pf-clipboard-copy')\nexport class PfClipboardCopy extends BaseClipboardCopy {\n  static readonly styles = [...BaseClipboardCopy.styles, styles];\n\n  static override readonly shadowRootOptions = {\n    ...BaseClipboardCopy.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  @property({ attribute: 'click-tip' }) clickTip = 'Copied';\n\n  @property({ attribute: 'hover-tip' }) hoverTip = 'Copy';\n\n  @property({ attribute: 'text-label' }) textAriaLabel = 'Copyable input';\n\n  @property({ attribute: 'toggle-label' }) toggleAriaLabel = 'Show content';\n\n  @property({ type: Number, attribute: 'entry-delay' }) entryDelay = 300;\n\n  @property({ type: Number, attribute: 'exit-delay' }) exitDelay = 1500;\n\n  @property({ type: Boolean, reflect: true }) block = false;\n\n  @property({ type: Boolean, reflect: true }) code = false;\n\n  @property({ type: Boolean, reflect: true }) expanded = false;\n\n  /**\n   * Implies not `inline`.\n   */\n  @property({ type: Boolean, reflect: true }) expandable = false;\n\n  @property({ type: Boolean, reflect: true }) readonly = false;\n\n  /**\n   * Implies not expandable. Overrules `expandable`.\n   */\n  @property({ type: Boolean, reflect: true }) inline = false;\n\n  @property({ type: Boolean, reflect: true }) compact = false;\n\n  @property() override value = '';\n\n  #copied = false;\n\n  #mo = new MutationObserver(() => this.#onMutation());\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.#mo.observe(this, { characterData: true });\n    this.#onMutation();\n  }\n\n  /**\n   * @todo fix the collapsed whitespace between the end of the \"inline-compact\" variant and the text node.\n   * This demonstrates the collapsed whitespace issue.\n   * The extra space between the closing slot tag and the closing template literal results in a collapsed whitespace.\n   */\n  render() {\n    const { expanded, expandable, inline, compact, code, block, readonly } = this;\n    return html`\n      <div class=\"container ${classMap({ code, expanded, inline, compact, block })}\">\n        <div id=\"input-group\">\n          <div id=\"wrapper\">\n            <pf-button id=\"expand-button\"\n                        plain\n                        variant=\"control\"\n                        label=\"EXPAND\"\n                        ?inert=\"${!expandable}\"\n                        @click=\"${this.#onClick}\">\n              <pf-icon icon=\"chevron-right\"></pf-icon>\n            </pf-button>\n          </div>\n          <span ?hidden=\"${!(inline || compact)}\">${this.value}</span>\n          <input\n              ?hidden=\"${inline || compact}\"\n              ?disabled=\"${expanded || readonly}\"\n              .value=\"${this.value}\"\n              @input=\"${this.#onChange}\"\n              aria-label=\"${this.textAriaLabel}\">\n          <pf-tooltip>\n            <pf-button id=\"copy-button\"\n                        plain\n                        variant=\"${ifDefined(!(inline || compact) ? 'control' : undefined)}\"\n                        label=\"${this.hoverTip}\"\n                        size=\"lg\"\n                        @click=\"${this.copy}\">\n              <pf-icon icon=\"copy\"></pf-icon>\n            </pf-button>\n            <span slot=\"content\">${this.#copied ? this.clickTip : this.hoverTip}</span>\n          </pf-tooltip>\n          <slot name=\"actions\"></slot>\n        </div>\n        <textarea .value=\"${this.value}\"\n                  .disabled=\"${this.readonly}\"\n                  ?hidden=\"${!(expandable && expanded)}\"\n                  @input=\"${this.#onChange}\">\n        </textarea>\n      </div>\n    `;\n  }\n\n  #onClick() {\n    this.expanded = !this.expanded;\n  }\n\n  #onChange(e: Event) {\n    const { value } = e.target as HTMLInputElement || HTMLTextAreaElement;\n    this.value = value;\n  }\n\n  #onMutation() {\n    if (this.childNodes.length > 0) {\n      this.value = this.getAttribute('value') ?? this.#dedent(Array.from(this.childNodes, child =>\n        (child instanceof Element || child instanceof Text) ? (child.textContent ?? '') : '')\n          .join(''));\n    }\n  }\n\n  #dedent(str: string): string {\n    const stripped = str.replace(/^\\n/, '');\n    const match = stripped.match(/^\\s+/);\n    return match ? stripped.replace(new RegExp(`^${match[0]}`, 'gm'), '') : str;\n  }\n\n  override async copy() {\n    await super.copy();\n    await sleep(this.entryDelay);\n    this.#copied = true;\n    this.requestUpdate();\n    await sleep(this.exitDelay);\n    this.#copied = false;\n    this.requestUpdate();\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-clipboard-copy': PfClipboardCopy;\n  }\n}\n"]}

package/pf-clipboard-copy/test/pf-clipboard-copy.e2e.d.ts

@@ -0,0 +1 @@
+export {};

package/pf-clipboard-copy/test/pf-clipboard-copy.e2e.js

@@ -0,0 +1,11 @@
+import { test } from '@playwright/test';
+import { PfeDemoPage } from '@patternfly/pfe-tools/test/playwright/PfeDemoPage.js';
+const tagName = 'pf-clipboard-copy';
+test.describe(tagName, () => {
+    test('snapshot', async ({ page }) => {
+        const componentPage = new PfeDemoPage(page, tagName);
+        await componentPage.navigate();
+        await componentPage.snapshot();
+    });
+});
+//# sourceMappingURL=pf-clipboard-copy.e2e.js.map

package/pf-clipboard-copy/test/pf-clipboard-copy.e2e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pf-clipboard-copy.e2e.js","sourceRoot":"","sources":["pf-clipboard-copy.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,sDAAsD,CAAC;AAEnF,MAAM,OAAO,GAAG,mBAAmB,CAAC;AAEpC,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,GAAG,EAAE;IAC1B,IAAI,CAAC,UAAU,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QAClC,MAAM,aAAa,GAAG,IAAI,WAAW,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QACrD,MAAM,aAAa,CAAC,QAAQ,EAAE,CAAC;QAC/B,MAAM,aAAa,CAAC,QAAQ,EAAE,CAAC;IACjC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { test } from '@playwright/test';\nimport { PfeDemoPage } from '@patternfly/pfe-tools/test/playwright/PfeDemoPage.js';\n\nconst tagName = 'pf-clipboard-copy';\n\ntest.describe(tagName, () => {\n  test('snapshot', async ({ page }) => {\n    const componentPage = new PfeDemoPage(page, tagName);\n    await componentPage.navigate();\n    await componentPage.snapshot();\n  });\n});\n"]}

package/pf-clipboard-copy/test/pf-clipboard-copy.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/pf-clipboard-copy/test/pf-clipboard-copy.spec.js

@@ -0,0 +1,103 @@
+import { sendKeys } from '@web/test-runner-commands';
+import { expect, html } from '@open-wc/testing';
+import { createFixture } from '@patternfly/pfe-tools/test/create-fixture.js';
+import { PfClipboardCopy } from '@patternfly/elements/pf-clipboard-copy/pf-clipboard-copy.js';
+import { stub } from 'sinon';
+describe('<pf-clipboard-copy>', function () {
+    let element;
+    beforeEach(function stubCopy() {
+        stub(navigator.clipboard, 'writeText');
+    });
+    afterEach(function restoreCopy() {
+        navigator.clipboard.writeText.restore();
+    });
+    beforeEach(async function () {
+        element = await createFixture(html `
+      <pf-clipboard-copy></pf-clipboard-copy>
+    `);
+    });
+    it('imperatively instantiates', function () {
+        expect(document.createElement('pf-clipboard-copy')).to.be.an.instanceof(PfClipboardCopy);
+    });
+    it('should upgrade', async function () {
+        const klass = customElements.get('pf-clipboard-copy');
+        expect(element)
+            .to.be.an.instanceOf(klass)
+            .and
+            .to.be.an.instanceOf(PfClipboardCopy);
+    });
+    describe('setting value attribute', function () {
+        const VALUE = 'another copy item!';
+        beforeEach(async function () {
+            element.setAttribute('value', VALUE);
+            await element.updateComplete;
+        });
+        describe('then calling copy()', function () {
+            beforeEach(async function () {
+                await element.copy();
+            });
+            it('should copy the new value.', function () {
+                expect(navigator.clipboard.writeText).to.have.been.calledWith(VALUE);
+            });
+        });
+    });
+    describe('setting readonly attribute', function () {
+        const VALUE = 'HI';
+        beforeEach(async function () {
+            element.toggleAttribute('readonly', true);
+            await element.updateComplete;
+        });
+        describe('then focusing the element and typing', function () {
+            beforeEach(async function () {
+                element.focus();
+                await sendKeys({ type: VALUE });
+            });
+            describe('then calling copy', function () {
+                beforeEach(async function () {
+                    await element.copy();
+                });
+                it('should not include the new value', async function () {
+                    expect(navigator.clipboard.writeText).to.not.have.been.calledWith(VALUE);
+                });
+            });
+        });
+    });
+    describe('setting expandable value', function () {
+        let initialHeight;
+        let initialFocus;
+        const VALUE = 'Hello!';
+        beforeEach(async function () {
+            element.toggleAttribute('expandable', true);
+            await element.updateComplete;
+            initialHeight = element.getBoundingClientRect().height;
+        });
+        describe('then focusing the element and pressing SPACE', function () {
+            beforeEach(async function () {
+                element.focus();
+                initialFocus = element.shadowRoot.activeElement;
+                await sendKeys({ press: ' ' });
+            });
+            it('it should be expanded', async function () {
+                expect(element.getBoundingClientRect().height).to.be.greaterThan(initialHeight);
+            });
+            describe('then focusing the textarea', function () {
+                beforeEach(async function () {
+                    await sendKeys({ press: 'Tab' });
+                    await sendKeys({ press: 'Tab' });
+                });
+                it('focuses a different element', function () {
+                    expect(element.shadowRoot?.activeElement).to.not.equal(initialFocus);
+                });
+                describe('then typing', function () {
+                    beforeEach(async function () {
+                        await sendKeys({ type: VALUE });
+                    });
+                    it('updates the value property', function () {
+                        expect(element.value).to.equal(VALUE);
+                    });
+                });
+            });
+        });
+    });
+});
+//# sourceMappingURL=pf-clipboard-copy.spec.js.map

package/pf-clipboard-copy/test/pf-clipboard-copy.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pf-clipboard-copy.spec.js","sourceRoot":"","sources":["pf-clipboard-copy.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import type { SinonStub } from 'sinon';\n\nimport { sendKeys } from '@web/test-runner-commands';\nimport { expect, html } from '@open-wc/testing';\nimport { createFixture } from '@patternfly/pfe-tools/test/create-fixture.js';\nimport { PfClipboardCopy } from '@patternfly/elements/pf-clipboard-copy/pf-clipboard-copy.js';\n\nimport { stub } from 'sinon';\n\ndescribe('<pf-clipboard-copy>', function() {\n  let element: PfClipboardCopy;\n  beforeEach(function stubCopy() {\n    stub(navigator.clipboard, 'writeText');\n  });\n\n  afterEach(function restoreCopy() {\n    (navigator.clipboard.writeText as SinonStub).restore();\n  });\n\n  beforeEach(async function() {\n    element = await createFixture<PfClipboardCopy>(html`\n      <pf-clipboard-copy></pf-clipboard-copy>\n    `);\n  });\n\n  it('imperatively instantiates', function() {\n    expect(document.createElement('pf-clipboard-copy')).to.be.an.instanceof(PfClipboardCopy);\n  });\n\n  it('should upgrade', async function() {\n    const klass = customElements.get('pf-clipboard-copy');\n    expect(element)\n        .to.be.an.instanceOf(klass)\n        .and\n        .to.be.an.instanceOf(PfClipboardCopy);\n  });\n\n  describe('setting value attribute', function() {\n    const VALUE = 'another copy item!';\n    beforeEach(async function() {\n      element.setAttribute('value', VALUE);\n      await element.updateComplete;\n    });\n    describe('then calling copy()', function() {\n      beforeEach(async function() {\n        await element.copy();\n      });\n      it('should copy the new value.', function() {\n        expect(navigator.clipboard.writeText).to.have.been.calledWith(VALUE);\n      });\n    });\n  });\n\n  describe('setting readonly attribute', function() {\n    const VALUE = 'HI';\n    beforeEach(async function() {\n      element.toggleAttribute('readonly', true);\n      await element.updateComplete;\n    });\n    describe('then focusing the element and typing', function() {\n      beforeEach(async function() {\n        element.focus();\n        await sendKeys({ type: VALUE });\n      });\n      describe('then calling copy', function() {\n        beforeEach(async function() {\n          await element.copy();\n        });\n        it('should not include the new value', async function() {\n          expect(navigator.clipboard.writeText).to.not.have.been.calledWith(VALUE);\n        });\n      });\n    });\n  });\n\n  describe('setting expandable value', function() {\n    let initialHeight: number;\n    let initialFocus: Element;\n    const VALUE = 'Hello!';\n    beforeEach(async function() {\n      element.toggleAttribute('expandable', true);\n      await element.updateComplete;\n      initialHeight = element.getBoundingClientRect().height;\n    });\n    describe('then focusing the element and pressing SPACE', function() {\n      beforeEach(async function() {\n        element.focus();\n        initialFocus = element.shadowRoot!.activeElement!;\n        await sendKeys({ press: ' ' });\n      });\n      it('it should be expanded', async function() {\n        expect(element.getBoundingClientRect().height).to.be.greaterThan(initialHeight);\n      });\n      describe('then focusing the textarea', function() {\n        beforeEach(async function() {\n          await sendKeys({ press: 'Tab' });\n          await sendKeys({ press: 'Tab' });\n        });\n        it('focuses a different element', function() {\n          expect(element.shadowRoot?.activeElement).to.not.equal(initialFocus);\n        });\n        describe('then typing', function() {\n          beforeEach(async function() {\n            await sendKeys({ type: VALUE });\n          });\n          it('updates the value property', function() {\n            expect(element.value).to.equal(VALUE);\n          });\n        });\n      });\n    });\n  });\n});\n"]}

package/pf-code-block/BaseCodeBlock.js

@@ -4,8 +4,8 @@ const styles = css `:host {\n  display: block;\n}\n\n[hidden] {\n  display: none
 export class BaseCodeBlock extends LitElement {
     get content() {
         const script = this.querySelector('script[type]');
-        if (script?.type !== 'text/javascript-sample' &&
-            !!script?.type.match(/(j(ava)?|ecma|live)script/)) {
+        if (script?.type !== 'text/javascript-sample'
+            && !!script?.type.match(/(j(ava)?|ecma|live)script/)) {
             return '';
         }
         else {

package/pf-code-block/BaseCodeBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseCodeBlock.js","sourceRoot":"","sources":["BaseCodeBlock.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;;;AAIjC,MAAM,OAAgB,aAAc,SAAQ,UAAU;IAKpD,IAAc,OAAO;QACnB,MAAM,MAAM,GAAG,IAAI,CAAC,aAAa,CAAoB,cAAc,CAAC,CAAC;QACrE,IACE,MAAM,EAAE,IAAI,KAAK,wBAAwB;YACzC,CAAC,CAAC,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,CAAC,EAAE,CAAC;YACpD,OAAO,EAAE,CAAC;QACZ,CAAC;aAAM,CAAC;YACN,OAAO,MAAM,EAAE,WAAW,IAAI,EAAE,CAAC;QACnC,CAAC;IACH,CAAC;IAES,MAAM,CAAC,GAAW;QAC1B,MAAM,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;QACxC,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QACrC,OAAO,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,MAAM,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;IAC9E,CAAC;;AAnBe,oBAAM,GAAG,CAAC,MAAM,CAAC,CAAC","sourcesContent":["import type { TemplateResult } from 'lit';\n\nimport { LitElement } from 'lit';\n\nimport styles from './BaseCodeBlock.css';\n\nexport abstract class BaseCodeBlock extends LitElement {\n  static readonly styles = [styles];\n\n  abstract render(): TemplateResult;\n\n  protected get content() {\n    const script = this.querySelector<HTMLScriptElement>('script[type]');\n    if (\n      script?.type !== 'text/javascript-sample' &&\n      !!script?.type.match(/(j(ava)?|ecma|live)script/)) {\n      return '';\n    } else {\n      return script?.textContent ?? '';\n    }\n  }\n\n  protected dedent(str: string): string {\n    const stripped = str.replace(/^\\n/, '');\n    const match = stripped.match(/^\\s+/);\n    return match ? stripped.replace(new RegExp(`^${match[0]}`, 'gm'), '') : str;\n  }\n}\n"]}
+{"version":3,"file":"BaseCodeBlock.js","sourceRoot":"","sources":["BaseCodeBlock.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;;;AAIjC,MAAM,OAAgB,aAAc,SAAQ,UAAU;IAKpD,IAAc,OAAO;QACnB,MAAM,MAAM,GAAG,IAAI,CAAC,aAAa,CAAoB,cAAc,CAAC,CAAC;QACrE,IACE,MAAM,EAAE,IAAI,KAAK,wBAAwB;eACtC,CAAC,CAAC,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,CAAC,EAAE,CAAC;YACvD,OAAO,EAAE,CAAC;QACZ,CAAC;aAAM,CAAC;YACN,OAAO,MAAM,EAAE,WAAW,IAAI,EAAE,CAAC;QACnC,CAAC;IACH,CAAC;IAES,MAAM,CAAC,GAAW;QAC1B,MAAM,QAAQ,GAAG,GAAG,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;QACxC,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QACrC,OAAO,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,MAAM,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;IAC9E,CAAC;;AAnBe,oBAAM,GAAG,CAAC,MAAM,CAAC,CAAC","sourcesContent":["import type { TemplateResult } from 'lit';\n\nimport { LitElement } from 'lit';\n\nimport styles from './BaseCodeBlock.css';\n\nexport abstract class BaseCodeBlock extends LitElement {\n  static readonly styles = [styles];\n\n  abstract render(): TemplateResult;\n\n  protected get content() {\n    const script = this.querySelector<HTMLScriptElement>('script[type]');\n    if (\n      script?.type !== 'text/javascript-sample'\n      && !!script?.type.match(/(j(ava)?|ecma|live)script/)) {\n      return '';\n    } else {\n      return script?.textContent ?? '';\n    }\n  }\n\n  protected dedent(str: string): string {\n    const stripped = str.replace(/^\\n/, '');\n    const match = stripped.match(/^\\s+/);\n    return match ? stripped.replace(new RegExp(`^${match[0]}`, 'gm'), '') : str;\n  }\n}\n"]}

package/pf-code-block/pf-code-block.d.ts

@@ -25,7 +25,7 @@ export declare class PfCodeBlock extends BaseCodeBlock {
     #private;
     static readonly styles: CSSStyleSheet[];
     expanded: boolean;
-    render(): import("lit").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1>;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/pf-code-block/test/pf-code-block.e2e.d.ts

@@ -0,0 +1 @@
+export {};

package/pf-code-block/test/pf-code-block.e2e.js

@@ -0,0 +1,11 @@
+import { test } from '@playwright/test';
+import { PfeDemoPage } from '@patternfly/pfe-tools/test/playwright/PfeDemoPage.js';
+const tagName = 'pf-code-block';
+test.describe(tagName, () => {
+    test('snapshot', async ({ page }) => {
+        const componentPage = new PfeDemoPage(page, tagName);
+        await componentPage.navigate();
+        await componentPage.snapshot();
+    });
+});
+//# sourceMappingURL=pf-code-block.e2e.js.map

package/pf-code-block/test/pf-code-block.e2e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pf-code-block.e2e.js","sourceRoot":"","sources":["pf-code-block.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,sDAAsD,CAAC;AAEnF,MAAM,OAAO,GAAG,eAAe,CAAC;AAEhC,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE,GAAG,EAAE;IAC1B,IAAI,CAAC,UAAU,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QAClC,MAAM,aAAa,GAAG,IAAI,WAAW,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QACrD,MAAM,aAAa,CAAC,QAAQ,EAAE,CAAC;QAC/B,MAAM,aAAa,CAAC,QAAQ,EAAE,CAAC;IACjC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { test } from '@playwright/test';\nimport { PfeDemoPage } from '@patternfly/pfe-tools/test/playwright/PfeDemoPage.js';\n\nconst tagName = 'pf-code-block';\n\ntest.describe(tagName, () => {\n  test('snapshot', async ({ page }) => {\n    const componentPage = new PfeDemoPage(page, tagName);\n    await componentPage.navigate();\n    await componentPage.snapshot();\n  });\n});\n"]}

package/pf-code-block/test/pf-code-block.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/pf-code-block/test/pf-code-block.spec.js

@@ -0,0 +1,89 @@
+import { expect, html, nextFrame } from '@open-wc/testing';
+import { createFixture } from '@patternfly/pfe-tools/test/create-fixture.js';
+import { PfCodeBlock } from '@patternfly/elements/pf-code-block/pf-code-block.js';
+const element = html `
+  <pf-code-block id="code">
+    <script type="application/openshift">
+      apiVersion: helm.openshift.io/v1beta1/
+      kind: HelmChartRepository
+      metadata:
+      name: azure-sample-repo0oooo00ooo
+      spec:
+      connectionConfig:
+      url: https://raw.githubusercontent.com/Azure-Samples/helm-charts/master/docs
+    </script>
+    <pf-clipboard-copy slot="actions" copy-from="#code"></pf-clipboard-copy>
+  </pf-code-block>
+`;
+const expandElement = html `
+  <pf-code-block id="expandable-code">
+    <script type="application/openshift">
+      apiVersion: helm.openshift.io/v1beta1/
+      kind: HelmChartRepository
+      metadata:
+      name: azure-sample-repo</script><script type="application/openshift" data-expand>
+      spec:
+      connectionConfig:
+      url: https://raw.githubusercontent.com/Azure-Samples/helm-charts/master/docs
+    </script>
+    <pf-clipboard-copy slot="actions" copy-from="#expandable-code"></pf-clipboard-copy>
+  </pf-code-block>
+`;
+const expandElementByDefault = html `
+  <pf-code-block id="expandable-code-expanded" expanded>
+    <script type="application/openshift">
+      apiVersion: helm.openshift.io/v1beta1/
+      kind: HelmChartRepository
+      metadata:
+      name: azure-sample-repo</script><script type="application/openshift" data-expand>
+      spec:
+      connectionConfig:
+      url: https://raw.githubusercontent.com/Azure-Samples/helm-charts/master/docs
+    </script>
+    <pf-clipboard-copy slot="actions" copy-from="#expandable-code-expanded"></pf-clipboard-copy>
+  </pf-code-block>
+`;
+describe('<pf-code-block>', function () {
+    it('imperatively instantiates', function () {
+        expect(document.createElement('pf-code-block')).to.be.an.instanceof(PfCodeBlock);
+    });
+    it('should upgrade', async function () {
+        const el = await createFixture(element);
+        const klass = customElements.get('pf-code-block');
+        expect(el)
+            .to.be.an.instanceOf(klass)
+            .and
+            .to.be.an.instanceOf(PfCodeBlock);
+    });
+    it('should not show a "Show more" button by default', async function () {
+        const el = await createFixture(element);
+        const button = el.shadowRoot?.querySelector('button');
+        expect(button?.hidden).to.be.true;
+    });
+    it('should show a "Show more" button if content is present in the expandable-code slot', async function () {
+        const expandEl = await createFixture(expandElement);
+        const expandButton = expandEl.shadowRoot?.querySelector('button');
+        expect(expandButton).to.not.be.null;
+    });
+    it('should expand the code block when the "Show more" button is clicked', async function () {
+        const expandEl = await createFixture(expandElement);
+        const expandButton = expandEl.shadowRoot?.querySelector('button');
+        expandButton?.click();
+        await nextFrame();
+        expect(expandEl.hasAttribute('expanded')).to.be.true;
+        expect(expandButton?.getAttribute('aria-expanded')).to.equal('true');
+    });
+    it('should toggle the "Show more" button text to "Show less" when the button is clicked', async function () {
+        const expandEl = await createFixture(expandElement);
+        const expandButton = expandEl.shadowRoot?.querySelector('button');
+        expandButton?.click();
+        await nextFrame();
+        expect(expandButton?.textContent?.trim()).to.equal('Show less');
+    });
+    it('should be expanded by default if the expanded attribute is present on render', async function () {
+        const expandByDefaultEl = await createFixture(expandElementByDefault);
+        const expandButton = expandByDefaultEl.shadowRoot?.querySelector('button');
+        expect(expandButton?.textContent?.trim()).to.equal('Show less');
+    });
+});
+//# sourceMappingURL=pf-code-block.spec.js.map

package/pf-code-block/test/pf-code-block.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pf-code-block.spec.js","sourceRoot":"","sources":["pf-code-block.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { expect, html, nextFrame } from '@open-wc/testing';\nimport { createFixture } from '@patternfly/pfe-tools/test/create-fixture.js';\nimport { PfCodeBlock } from '@patternfly/elements/pf-code-block/pf-code-block.js';\n\nconst element = html`\n  <pf-code-block id=\"code\">\n    <script type=\"application/openshift\">\n      apiVersion: helm.openshift.io/v1beta1/\n      kind: HelmChartRepository\n      metadata:\n      name: azure-sample-repo0oooo00ooo\n      spec:\n      connectionConfig:\n      url: https://raw.githubusercontent.com/Azure-Samples/helm-charts/master/docs\n    </script>\n    <pf-clipboard-copy slot=\"actions\" copy-from=\"#code\"></pf-clipboard-copy>\n  </pf-code-block>\n`;\n\nconst expandElement = html`\n  <pf-code-block id=\"expandable-code\">\n    <script type=\"application/openshift\">\n      apiVersion: helm.openshift.io/v1beta1/\n      kind: HelmChartRepository\n      metadata:\n      name: azure-sample-repo</script><script type=\"application/openshift\" data-expand>\n      spec:\n      connectionConfig:\n      url: https://raw.githubusercontent.com/Azure-Samples/helm-charts/master/docs\n    </script>\n    <pf-clipboard-copy slot=\"actions\" copy-from=\"#expandable-code\"></pf-clipboard-copy>\n  </pf-code-block>\n`;\n\nconst expandElementByDefault = html`\n  <pf-code-block id=\"expandable-code-expanded\" expanded>\n    <script type=\"application/openshift\">\n      apiVersion: helm.openshift.io/v1beta1/\n      kind: HelmChartRepository\n      metadata:\n      name: azure-sample-repo</script><script type=\"application/openshift\" data-expand>\n      spec:\n      connectionConfig:\n      url: https://raw.githubusercontent.com/Azure-Samples/helm-charts/master/docs\n    </script>\n    <pf-clipboard-copy slot=\"actions\" copy-from=\"#expandable-code-expanded\"></pf-clipboard-copy>\n  </pf-code-block>\n`;\n\ndescribe('<pf-code-block>', function() {\n  it('imperatively instantiates', function() {\n    expect(document.createElement('pf-code-block')).to.be.an.instanceof(PfCodeBlock);\n  });\n\n  it('should upgrade', async function() {\n    const el = await createFixture <PfCodeBlock>(element);\n    const klass = customElements.get('pf-code-block');\n    expect(el)\n        .to.be.an.instanceOf(klass)\n        .and\n        .to.be.an.instanceOf(PfCodeBlock);\n  });\n\n  it('should not show a \"Show more\" button by default', async function() {\n    const el = await createFixture <PfCodeBlock>(element);\n    const button = el.shadowRoot?.querySelector('button');\n    expect(button?.hidden).to.be.true;\n  });\n\n  it('should show a \"Show more\" button if content is present in the expandable-code slot', async function() {\n    const expandEl = await createFixture<PfCodeBlock>(expandElement);\n    const expandButton = expandEl.shadowRoot?.querySelector('button');\n    expect(expandButton).to.not.be.null;\n  });\n\n  it('should expand the code block when the \"Show more\" button is clicked', async function() {\n    const expandEl = await createFixture<PfCodeBlock>(expandElement);\n    const expandButton = expandEl.shadowRoot?.querySelector('button');\n    expandButton?.click();\n    await nextFrame();\n    expect(expandEl.hasAttribute('expanded')).to.be.true;\n    expect(expandButton?.getAttribute('aria-expanded')).to.equal('true');\n  });\n\n  it('should toggle the \"Show more\" button text to \"Show less\" when the button is clicked', async function() {\n    const expandEl = await createFixture<PfCodeBlock>(expandElement);\n    const expandButton = expandEl.shadowRoot?.querySelector('button');\n    expandButton?.click();\n    await nextFrame();\n    expect(expandButton?.textContent?.trim()).to.equal('Show less');\n  });\n\n  it('should be expanded by default if the expanded attribute is present on render', async function() {\n    const expandByDefaultEl = await createFixture<PfCodeBlock>(expandElementByDefault);\n    const expandButton = expandByDefaultEl.shadowRoot?.querySelector('button');\n    expect(expandButton?.textContent?.trim()).to.equal('Show less');\n  });\n});\n"]}

package/pf-dropdown/pf-dropdown-group.d.ts

@@ -17,7 +17,7 @@ export declare class PfDropdownGroup extends LitElement {
      * The label for the group of dropdown items.
      */
     label?: string;
-    render(): import("lit").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1>;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/pf-dropdown/pf-dropdown-group.js

@@ -18,7 +18,10 @@ let PfDropdownGroup = class PfDropdownGroup extends LitElement {
     }
 };
 PfDropdownGroup.styles = [styles];
-PfDropdownGroup.shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };
+PfDropdownGroup.shadowRootOptions = {
+    ...LitElement.shadowRootOptions,
+    delegatesFocus: true,
+};
 __decorate([
     property({ reflect: true })
 ], PfDropdownGroup.prototype, "label", void 0);

package/pf-dropdown/pf-dropdown-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"pf-dropdown-group.js","sourceRoot":"","sources":["pf-dropdown-group.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;;;AAItD;;;;GAIG;AAEI,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,UAAU;IAU7C,MAAM;QACJ,OAAO,IAAI,CAAA;oBACK,CAAC,IAAI,CAAC,KAAK,yBAAyB,IAAI,CAAC,KAAK;;KAE7D,CAAC;IACJ,CAAC;;AAde,sBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAET,iCAAiB,GAAG,EAAE,GAAG,UAAU,CAAC,iBAAiB,EAAE,cAAc,EAAE,IAAI,EAAE,AAA5D,CAA6D;AAK1E;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAAgB;AARjC,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CAgB3B","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\n\nimport styles from './pf-dropdown-group.css';\n\n/**\n * Represents a group of items for a dropdown component.\n * @slot\n *     Content for the group of dropdown items\n */\n@customElement('pf-dropdown-group')\nexport class PfDropdownGroup extends LitElement {\n  static readonly styles = [styles];\n\n  static override readonly shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };\n\n  /**\n   * The label for the group of dropdown items.\n   */\n  @property({ reflect: true }) label?: string;\n\n  render() {\n    return html`\n      <p ?hidden=\"${!this.label}\" role=\"presentation\">${this.label}</p>\n      <slot></slot>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-dropdown-group': PfDropdownGroup;\n  }\n}\n"]}
+{"version":3,"file":"pf-dropdown-group.js","sourceRoot":"","sources":["pf-dropdown-group.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;;;AAItD;;;;GAIG;AAEI,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,UAAU;IAa7C,MAAM;QACJ,OAAO,IAAI,CAAA;oBACK,CAAC,IAAI,CAAC,KAAK,yBAAyB,IAAI,CAAC,KAAK;;KAE7D,CAAC;IACJ,CAAC;;AAjBe,sBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAET,iCAAiB,GAAG;IAC3C,GAAG,UAAU,CAAC,iBAAiB;IAC/B,cAAc,EAAE,IAAI;CACrB,AAHyC,CAGxC;AAK2B;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAAgB;AAXjC,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CAmB3B","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\n\nimport styles from './pf-dropdown-group.css';\n\n/**\n * Represents a group of items for a dropdown component.\n * @slot\n *     Content for the group of dropdown items\n */\n@customElement('pf-dropdown-group')\nexport class PfDropdownGroup extends LitElement {\n  static readonly styles = [styles];\n\n  static override readonly shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  /**\n   * The label for the group of dropdown items.\n   */\n  @property({ reflect: true }) label?: string;\n\n  render() {\n    return html`\n      <p ?hidden=\"${!this.label}\" role=\"presentation\">${this.label}</p>\n      <slot></slot>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-dropdown-group': PfDropdownGroup;\n  }\n}\n"]}

package/pf-dropdown/pf-dropdown-item.d.ts

@@ -10,7 +10,6 @@ export declare class DropdownItemChange extends Event {
  *      Optional slot for item description
  * @slot -
  *      Content for the dropdown item
- *
  * @cssprop {<length>} --pf-c-dropdown__menu-item--FontSize
  *          Dropdown item font size
  *          {@default `1rem`}
@@ -72,7 +71,7 @@ export declare class PfDropdownItem extends LitElement {
     /** @internal */
     menuItem: HTMLElement;
     protected updated(changed: PropertyValues<this>): void;
-    render(): import("lit").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1>;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/pf-dropdown/pf-dropdown-item.js

@@ -22,7 +22,6 @@ export class DropdownItemChange extends Event {
  *      Optional slot for item description
  * @slot -
  *      Content for the dropdown item
- *
  * @cssprop {<length>} --pf-c-dropdown__menu-item--FontSize
  *          Dropdown item font size
  *          {@default `1rem`}
@@ -88,7 +87,10 @@ let PfDropdownItem = class PfDropdownItem extends LitElement {
     }
 };
 PfDropdownItem.styles = [styles];
-PfDropdownItem.shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };
+PfDropdownItem.shadowRootOptions = {
+    ...LitElement.shadowRootOptions,
+    delegatesFocus: true,
+};
 __decorate([
     property({ reflect: true })
 ], PfDropdownItem.prototype, "value", void 0);

package/pf-dropdown/pf-dropdown-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"pf-dropdown-item.js","sourceRoot":"","sources":["pf-dropdown-item.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAuB,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,mBAAmB,EAAE,MAAM,0DAA0D,CAAC;AAE/F,OAAO,EAAE,OAAO,EAA0B,MAAM,cAAc,CAAC;;;AAI/D,MAAM,OAAO,kBAAmB,SAAQ,KAAK;IAC3C;QACE,KAAK,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC;IACvD,CAAC;CACF;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AAEI,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,UAAU;IAAvC;;QAgBL;;WAEG;QACyC,WAAM,GAAG,KAAK,CAAC;QAE3D;;;WAGG;QACyC,aAAQ,GAAG,KAAK,CAAC;IAmC/D,CAAC;IAvBoB,OAAO,CAAC,OAA6B;QACtD,IAAI,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC;YACxB,IAAI,CAAC,aAAa,CAAC,IAAI,kBAAkB,EAAE,CAAC,CAAC;QAC/C,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,GAAG,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;QACrD,MAAM,UAAU,GAAG,CAAC,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,QAAQ,CAAC;QAC3D,OAAO,IAAI,CAAA;8CAC+B,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA;6CAC5C,IAAI,CAAC,IAAI,oBAAoB,UAAU;;;;SAI3E,CAAC,CAAC,CAAC,IAAI,CAAA;wDACwC,UAAU;;;eAGnD;oDACqC,IAAI,CAAC,WAAW,IAAI,EAAE;aAC7D,CAAC;IACZ,CAAC;;AA1De,qBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAET,gCAAiB,GAAG,EAAE,GAAG,UAAU,CAAC,iBAAiB,EAAE,cAAc,EAAE,IAAI,EAAE,AAA5D,CAA6D;AAM1E;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAAgB;AAKX;IAAhC,QAAQ,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC;4CAAe;AAKH;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAAgB;AAMf;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gDAAkB;AAGjD;IAAX,QAAQ,EAAE;mDAAsB;AAIzB;IAFP,OAAO,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACrC,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;2CACC;AAGhB;IAAf,KAAK,CAAC,OAAO,CAAC;gDAAwB;AAnC5B,cAAc;IAD1B,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,CA4D1B","sourcesContent":["import { LitElement, html, type PropertyValues } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { query } from 'lit/decorators/query.js';\nimport { consume } from '@lit/context';\n\nimport { InternalsController } from '@patternfly/pfe-core/controllers/internals-controller.js';\n\nimport { context, type PfDropdownContext } from './context.js';\n\nimport styles from './pf-dropdown-item.css';\n\nexport class DropdownItemChange extends Event {\n  constructor() {\n    super('change', { bubbles: true, cancelable: true });\n  }\n}\n\n/**\n * Represents an item for a dropdown component.\n * @slot icon\n *      Optional slot for an icon\n * @slot description\n *      Optional slot for item description\n * @slot -\n *      Content for the dropdown item\n *\n * @cssprop {<length>} --pf-c-dropdown__menu-item--FontSize\n *          Dropdown item font size\n *          {@default `1rem`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--FontWeight\n *          Dropdown item font weight\n *          {@default `400`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--LineHeight\n *          Dropdown item line height\n *          {@default `1.5`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--Color\n *          Dropdown item color\n *          {@default `#151515`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--BackgroundColor\n *          Dropdown item background color\n *          {@default `transparent`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--PaddingTop\n *          Dropdown item padding top\n *          {@default `0.5rem`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--PaddingRight\n *          Dropdown item padding right\n *          {@default `1rem`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--PaddingBottom\n *          Dropdown item padding bottom\n *          {@default `0.5rem`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--PaddingLeft\n *          Dropdown item padding left\n *          {@default `1rem`}\n */\n@customElement('pf-dropdown-item')\nexport class PfDropdownItem extends LitElement {\n  static readonly styles = [styles];\n\n  static override readonly shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };\n\n  /**\n   * The value associated with the dropdown item.\n   * This value can be used to identify the selected item\n   */\n  @property({ reflect: true }) value?: string;\n\n  /**\n   * href for link dropdown items\n   */\n  @property({ attribute: 'href' }) href?: string;\n\n  /**\n   * Flag indicating whether the item is active\n   */\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  /**\n   * Indicates whether the dropdown item is disabled.\n   * A disabled item cannot be selected.\n   */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** Item description; overridden by `description` slot */\n  @property() description?: string;\n\n  @consume({ context, subscribe: true })\n  @property({ attribute: false })\n  private ctx?: PfDropdownContext;\n\n  /** @internal */\n  @query('#item') menuItem!: HTMLElement;\n\n  protected override updated(changed: PropertyValues<this>): void {\n    if (changed.has('href')) {\n      this.dispatchEvent(new DropdownItemChange());\n    }\n  }\n\n  render() {\n    const { disabled } = this.ctx ?? { disabled: false };\n    const isDisabled = !!this.disabled || !!this.ctx?.disabled;\n    return html`\n      <div id=\"menuitem\" role=\"none\" class=\"${classMap({ disabled })}\">${this.href ? html`\n        <a id=\"item\" role=\"menuitem\" href=\"${this.href}\" aria-disabled=\"${isDisabled}\">\n          <slot name=\"icon\"></slot>\n          <slot></slot>\n        </a>\n        ` : html`\n        <div id=\"item\" role=\"menuitem\" aria-disabled=\"${isDisabled}\">\n          <slot name=\"icon\"></slot>\n          <slot></slot>\n        </div>`}\n        <slot id=\"description\" name=\"description\">${this.description ?? ''}</slot>\n      </div>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-dropdown-item': PfDropdownItem;\n  }\n}\n"]}
+{"version":3,"file":"pf-dropdown-item.js","sourceRoot":"","sources":["pf-dropdown-item.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAuB,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AAEvC,OAAO,EAAE,mBAAmB,EAAE,MAAM,0DAA0D,CAAC;AAE/F,OAAO,EAAE,OAAO,EAA0B,MAAM,cAAc,CAAC;;;AAI/D,MAAM,OAAO,kBAAmB,SAAQ,KAAK;IAC3C;QACE,KAAK,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC;IACvD,CAAC;CACF;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AAEI,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,UAAU;IAAvC;;QAmBL;;WAEG;QACyC,WAAM,GAAG,KAAK,CAAC;QAE3D;;;WAGG;QACyC,aAAQ,GAAG,KAAK,CAAC;IAmC/D,CAAC;IAvBoB,OAAO,CAAC,OAA6B;QACtD,IAAI,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC;YACxB,IAAI,CAAC,aAAa,CAAC,IAAI,kBAAkB,EAAE,CAAC,CAAC;QAC/C,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,GAAG,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;QACrD,MAAM,UAAU,GAAG,CAAC,CAAC,IAAI,CAAC,QAAQ,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,QAAQ,CAAC;QAC3D,OAAO,IAAI,CAAA;8CAC+B,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA;6CAC5C,IAAI,CAAC,IAAI,oBAAoB,UAAU;;;;SAI3E,CAAC,CAAC,CAAC,IAAI,CAAA;wDACwC,UAAU;;;eAGnD;oDACqC,IAAI,CAAC,WAAW,IAAI,EAAE;aAC7D,CAAC;IACZ,CAAC;;AA7De,qBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAET,gCAAiB,GAAG;IAC3C,GAAG,UAAU,CAAC,iBAAiB;IAC/B,cAAc,EAAE,IAAI;CACrB,AAHyC,CAGxC;AAM2B;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAAgB;AAKX;IAAhC,QAAQ,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,CAAC;4CAAe;AAKH;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;8CAAgB;AAMf;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gDAAkB;AAGjD;IAAX,QAAQ,EAAE;mDAAsB;AAIzB;IAFP,OAAO,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACrC,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;2CACC;AAGhB;IAAf,KAAK,CAAC,OAAO,CAAC;gDAAwB;AAtC5B,cAAc;IAD1B,aAAa,CAAC,kBAAkB,CAAC;GACrB,cAAc,CA+D1B","sourcesContent":["import { LitElement, html, type PropertyValues } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { query } from 'lit/decorators/query.js';\nimport { consume } from '@lit/context';\n\nimport { InternalsController } from '@patternfly/pfe-core/controllers/internals-controller.js';\n\nimport { context, type PfDropdownContext } from './context.js';\n\nimport styles from './pf-dropdown-item.css';\n\nexport class DropdownItemChange extends Event {\n  constructor() {\n    super('change', { bubbles: true, cancelable: true });\n  }\n}\n\n/**\n * Represents an item for a dropdown component.\n * @slot icon\n *      Optional slot for an icon\n * @slot description\n *      Optional slot for item description\n * @slot -\n *      Content for the dropdown item\n * @cssprop {<length>} --pf-c-dropdown__menu-item--FontSize\n *          Dropdown item font size\n *          {@default `1rem`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--FontWeight\n *          Dropdown item font weight\n *          {@default `400`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--LineHeight\n *          Dropdown item line height\n *          {@default `1.5`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--Color\n *          Dropdown item color\n *          {@default `#151515`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--BackgroundColor\n *          Dropdown item background color\n *          {@default `transparent`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--PaddingTop\n *          Dropdown item padding top\n *          {@default `0.5rem`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--PaddingRight\n *          Dropdown item padding right\n *          {@default `1rem`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--PaddingBottom\n *          Dropdown item padding bottom\n *          {@default `0.5rem`}\n * @cssprop {<length>} --pf-c-dropdown__menu-item--PaddingLeft\n *          Dropdown item padding left\n *          {@default `1rem`}\n */\n@customElement('pf-dropdown-item')\nexport class PfDropdownItem extends LitElement {\n  static readonly styles = [styles];\n\n  static override readonly shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  /**\n   * The value associated with the dropdown item.\n   * This value can be used to identify the selected item\n   */\n  @property({ reflect: true }) value?: string;\n\n  /**\n   * href for link dropdown items\n   */\n  @property({ attribute: 'href' }) href?: string;\n\n  /**\n   * Flag indicating whether the item is active\n   */\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  /**\n   * Indicates whether the dropdown item is disabled.\n   * A disabled item cannot be selected.\n   */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** Item description; overridden by `description` slot */\n  @property() description?: string;\n\n  @consume({ context, subscribe: true })\n  @property({ attribute: false })\n  private ctx?: PfDropdownContext;\n\n  /** @internal */\n  @query('#item') menuItem!: HTMLElement;\n\n  protected override updated(changed: PropertyValues<this>): void {\n    if (changed.has('href')) {\n      this.dispatchEvent(new DropdownItemChange());\n    }\n  }\n\n  render() {\n    const { disabled } = this.ctx ?? { disabled: false };\n    const isDisabled = !!this.disabled || !!this.ctx?.disabled;\n    return html`\n      <div id=\"menuitem\" role=\"none\" class=\"${classMap({ disabled })}\">${this.href ? html`\n        <a id=\"item\" role=\"menuitem\" href=\"${this.href}\" aria-disabled=\"${isDisabled}\">\n          <slot name=\"icon\"></slot>\n          <slot></slot>\n        </a>\n        ` : html`\n        <div id=\"item\" role=\"menuitem\" aria-disabled=\"${isDisabled}\">\n          <slot name=\"icon\"></slot>\n          <slot></slot>\n        </div>`}\n        <slot id=\"description\" name=\"description\">${this.description ?? ''}</slot>\n      </div>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-dropdown-item': PfDropdownItem;\n  }\n}\n"]}

package/pf-dropdown/pf-dropdown-menu.d.ts

@@ -3,7 +3,6 @@ import { PfDropdownItem } from './pf-dropdown-item.js';
 /**
  * A **dropdown** presents a menu of actions or links in a constrained space that will trigger a
  * process or navigate to a new location.
- *
  * @slot - Must contain one or more `<pf-dropdown-item>` or `<pf-dropdown-group>`
  */
 export declare class PfDropdownMenu extends LitElement {
@@ -28,7 +27,7 @@ export declare class PfDropdownMenu extends LitElement {
     get items(): PfDropdownItem[];
     connectedCallback(): void;
     protected willUpdate(): void;
-    render(): import("lit").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1>;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/pf-dropdown/pf-dropdown-menu.js

@@ -19,7 +19,6 @@ function isDisabledItemClick(event) {
 /**
  * A **dropdown** presents a menu of actions or links in a constrained space that will trigger a
  * process or navigate to a new location.
- *
  * @slot - Must contain one or more `<pf-dropdown-item>` or `<pf-dropdown-group>`
  */
 let PfDropdownMenu = class PfDropdownMenu extends LitElement {
@@ -84,8 +83,8 @@ _PfDropdownMenu_onMenuitemFocusin = function _PfDropdownMenu_onMenuitemFocusin(e
         event.preventDefault();
         event.stopPropagation();
     }
-    else if (event.target instanceof PfDropdownItem &&
-        event.target.menuItem !== __classPrivateFieldGet(this, _PfDropdownMenu_tabindex, "f").activeItem) {
+    else if (event.target instanceof PfDropdownItem
+        && event.target.menuItem !== __classPrivateFieldGet(this, _PfDropdownMenu_tabindex, "f").activeItem) {
         __classPrivateFieldGet(this, _PfDropdownMenu_tabindex, "f").setActiveItem(event.target.menuItem);
     }
 };
@@ -94,8 +93,8 @@ _PfDropdownMenu_onMenuitemClick = function _PfDropdownMenu_onMenuitemClick(event
         event.preventDefault();
         event.stopPropagation();
     }
-    else if (event.target instanceof PfDropdownItem &&
-        event.target.menuItem !== __classPrivateFieldGet(this, _PfDropdownMenu_tabindex, "f").activeItem) {
+    else if (event.target instanceof PfDropdownItem
+        && event.target.menuItem !== __classPrivateFieldGet(this, _PfDropdownMenu_tabindex, "f").activeItem) {
         __classPrivateFieldGet(this, _PfDropdownMenu_tabindex, "f").setActiveItem(event.target.menuItem);
     }
 };
@@ -118,7 +117,10 @@ _PfDropdownMenu_getSlottedItems = function _PfDropdownMenu_getSlottedItems(slot)
     }) ?? [];
 };
 PfDropdownMenu.styles = [styles];
-PfDropdownMenu.shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };
+PfDropdownMenu.shadowRootOptions = {
+    ...LitElement.shadowRootOptions,
+    delegatesFocus: true,
+};
 __decorate([
     consume({ context, subscribe: true }),
     state()

package/pf-dropdown/pf-dropdown-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"pf-dropdown-menu.js","sourceRoot":"","sources":["pf-dropdown-menu.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { consume } from '@lit/context';\nimport { state } from 'lit/decorators/state.js';\nimport { context, type PfDropdownContext } from './context.js';\n\nimport { RovingTabindexController } from '@patternfly/pfe-core/controllers/roving-tabindex-controller.js';\nimport { InternalsController } from '@patternfly/pfe-core/controllers/internals-controller.js';\n\nimport { PfDropdownItem, DropdownItemChange } from './pf-dropdown-item.js';\nimport { PfDropdownGroup } from './pf-dropdown-group.js';\n\nimport styles from './pf-dropdown-menu.css';\nimport { classMap } from 'lit/directives/class-map.js';\n\nfunction isDisabledItemClick(event: MouseEvent) {\n  const item: PfDropdownItem | undefined =\n    event.composedPath().find((x): x is PfDropdownItem => x instanceof PfDropdownItem);\n  return !!item?.disabled;\n}\n\n/**\n * A **dropdown** presents a menu of actions or links in a constrained space that will trigger a\n * process or navigate to a new location.\n *\n * @slot - Must contain one or more `<pf-dropdown-item>` or `<pf-dropdown-group>`\n */\n@customElement('pf-dropdown-menu')\nexport class PfDropdownMenu extends LitElement {\n  static readonly styles = [styles];\n\n  static override readonly shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };\n\n  @consume({ context, subscribe: true })\n  @state()\n  private ctx?: PfDropdownContext;\n\n  #internals = InternalsController.of(this, { role: 'menu' });\n\n  #tabindex = new RovingTabindexController(this, {\n    getItems: () => this.items.map(x => x.menuItem),\n  });\n\n  /**\n   * current active descendant in menu\n   */\n  get activeItem() {\n    return this.#tabindex.activeItem ?? this.#tabindex.firstItem;\n  }\n\n  /**\n   * index of current active descendant in menu\n   */\n  get activeIndex() {\n    if (!this.#tabindex.activeItem) {\n      return -1;\n    } else {\n      return this.#tabindex.items.indexOf(this.#tabindex.activeItem);\n    }\n  }\n\n  get items(): PfDropdownItem[] {\n    return this.#getSlottedItems(this.shadowRoot?.querySelector('slot'));\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('focusin', this.#onMenuitemFocusin);\n    this.addEventListener('click', this.#onMenuitemClick);\n  }\n\n  protected override willUpdate(): void {\n    this.#internals.ariaDisabled = String(!!this.ctx?.disabled);\n  }\n\n  render() {\n    const { disabled = false } = this.ctx ?? {};\n    return html`\n      <slot class=\"${classMap({ disabled })}\"\n            @slotchange=\"${this.#onSlotChange}\"\n            @change=\"${this.#onItemChange}\"></slot>\n    `;\n  }\n\n  /**\n   * handles a change event from a dropdown item\n   * @param event {Event}\n   */\n  #onItemChange(event: Event) {\n    if (event instanceof DropdownItemChange) {\n      this.#tabindex.updateItems();\n    }\n  }\n\n  /**\n   * handles slot change event\n   */\n  #onSlotChange() {\n    this.#tabindex.updateItems();\n  }\n\n  /**\n   * handles focusing on an option:\n   * updates roving tabindex and active descendant\n   */\n  #onMenuitemFocusin(event: FocusEvent) {\n    if (this.ctx?.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n    } else if (event.target instanceof PfDropdownItem &&\n        event.target.menuItem !== this.#tabindex.activeItem) {\n      this.#tabindex.setActiveItem(event.target.menuItem);\n    }\n  }\n\n  /**\n   * handles clicking on a menuitem:\n   * which selects an item by default\n   * or toggles selection if multiselectable\n   */\n  #onMenuitemClick(event: MouseEvent) {\n    if (this.ctx?.disabled || isDisabledItemClick(event)) {\n      event.preventDefault();\n      event.stopPropagation();\n    } else if (event.target instanceof PfDropdownItem &&\n        event.target.menuItem !== this.#tabindex.activeItem) {\n      this.#tabindex.setActiveItem(event.target.menuItem);\n    }\n  }\n\n  #getSlottedItems(slot?: HTMLSlotElement | null): PfDropdownItem[] {\n    return slot\n      ?.assignedElements()\n      .flatMap(element => {\n        if (element instanceof HTMLSlotElement) {\n          return this.#getSlottedItems(element);\n        } else if (element instanceof PfDropdownItem) {\n          return [element];\n        } else if (element instanceof PfDropdownGroup) {\n          return Array.from(element.querySelectorAll('pf-dropdown-item'));\n        } else {\n          return [];\n        }\n      }) ?? [];\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-dropdown-menu': PfDropdownMenu;\n  }\n}\n"]}
+{"version":3,"file":"pf-dropdown-menu.js","sourceRoot":"","sources":["pf-dropdown-menu.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { consume } from '@lit/context';\nimport { state } from 'lit/decorators/state.js';\nimport { context, type PfDropdownContext } from './context.js';\n\nimport { RovingTabindexController } from '@patternfly/pfe-core/controllers/roving-tabindex-controller.js';\nimport { InternalsController } from '@patternfly/pfe-core/controllers/internals-controller.js';\n\nimport { PfDropdownItem, DropdownItemChange } from './pf-dropdown-item.js';\nimport { PfDropdownGroup } from './pf-dropdown-group.js';\n\nimport styles from './pf-dropdown-menu.css';\nimport { classMap } from 'lit/directives/class-map.js';\n\nfunction isDisabledItemClick(event: MouseEvent) {\n  const item: PfDropdownItem | undefined =\n    event.composedPath().find((x): x is PfDropdownItem => x instanceof PfDropdownItem);\n  return !!item?.disabled;\n}\n\n/**\n * A **dropdown** presents a menu of actions or links in a constrained space that will trigger a\n * process or navigate to a new location.\n * @slot - Must contain one or more `<pf-dropdown-item>` or `<pf-dropdown-group>`\n */\n@customElement('pf-dropdown-menu')\nexport class PfDropdownMenu extends LitElement {\n  static readonly styles = [styles];\n\n  static override readonly shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  @consume({ context, subscribe: true })\n  @state()\n  private ctx?: PfDropdownContext;\n\n  #internals = InternalsController.of(this, { role: 'menu' });\n\n  #tabindex = new RovingTabindexController(this, {\n    getItems: () => this.items.map(x => x.menuItem),\n  });\n\n  /**\n   * current active descendant in menu\n   */\n  get activeItem() {\n    return this.#tabindex.activeItem ?? this.#tabindex.firstItem;\n  }\n\n  /**\n   * index of current active descendant in menu\n   */\n  get activeIndex() {\n    if (!this.#tabindex.activeItem) {\n      return -1;\n    } else {\n      return this.#tabindex.items.indexOf(this.#tabindex.activeItem);\n    }\n  }\n\n  get items(): PfDropdownItem[] {\n    return this.#getSlottedItems(this.shadowRoot?.querySelector('slot'));\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('focusin', this.#onMenuitemFocusin);\n    this.addEventListener('click', this.#onMenuitemClick);\n  }\n\n  protected override willUpdate(): void {\n    this.#internals.ariaDisabled = String(!!this.ctx?.disabled);\n  }\n\n  render() {\n    const { disabled = false } = this.ctx ?? {};\n    return html`\n      <slot class=\"${classMap({ disabled })}\"\n            @slotchange=\"${this.#onSlotChange}\"\n            @change=\"${this.#onItemChange}\"></slot>\n    `;\n  }\n\n  /**\n   * handles a change event from a dropdown item\n   * @param event {Event}\n   */\n  #onItemChange(event: Event) {\n    if (event instanceof DropdownItemChange) {\n      this.#tabindex.updateItems();\n    }\n  }\n\n  /**\n   * handles slot change event\n   */\n  #onSlotChange() {\n    this.#tabindex.updateItems();\n  }\n\n  /**\n   * handles focusing on an option:\n   * updates roving tabindex and active descendant\n   */\n  #onMenuitemFocusin(event: FocusEvent) {\n    if (this.ctx?.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n    } else if (event.target instanceof PfDropdownItem\n        && event.target.menuItem !== this.#tabindex.activeItem) {\n      this.#tabindex.setActiveItem(event.target.menuItem);\n    }\n  }\n\n  /**\n   * handles clicking on a menuitem:\n   * which selects an item by default\n   * or toggles selection if multiselectable\n   */\n  #onMenuitemClick(event: MouseEvent) {\n    if (this.ctx?.disabled || isDisabledItemClick(event)) {\n      event.preventDefault();\n      event.stopPropagation();\n    } else if (event.target instanceof PfDropdownItem\n        && event.target.menuItem !== this.#tabindex.activeItem) {\n      this.#tabindex.setActiveItem(event.target.menuItem);\n    }\n  }\n\n  #getSlottedItems(slot?: HTMLSlotElement | null): PfDropdownItem[] {\n    return slot\n        ?.assignedElements()\n        .flatMap(element => {\n          if (element instanceof HTMLSlotElement) {\n            return this.#getSlottedItems(element);\n          } else if (element instanceof PfDropdownItem) {\n            return [element];\n          } else if (element instanceof PfDropdownGroup) {\n            return Array.from(element.querySelectorAll('pf-dropdown-item'));\n          } else {\n            return [];\n          }\n        }) ?? [];\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-dropdown-menu': PfDropdownMenu;\n  }\n}\n"]}