@patternfly/elements 2.4.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":"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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 *\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.d.ts

@@ -1,7 +1,7 @@
 import type { TemplateResult } from 'lit';
 import { LitElement } from 'lit';
 export declare abstract class BaseCodeBlock extends LitElement {
-    static readonly styles: import("lit").CSSResult[];
+    static readonly styles: CSSStyleSheet[];
     abstract render(): TemplateResult;
     protected get content(): string;
     protected dedent(str: string): string;

package/pf-code-block/BaseCodeBlock.js

@@ -1,11 +1,11 @@
 import { LitElement } from 'lit';
 import { css } from "lit";
-const styles = css `:host{display:block}[hidden]{display:none!important}`;
-class BaseCodeBlock extends LitElement {
+const styles = css `:host {\n  display: block;\n}\n\n[hidden] {\n  display: none !important;\n}\n`;
+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 {
@@ -19,5 +19,4 @@ class BaseCodeBlock extends LitElement {
     }
 }
 BaseCodeBlock.styles = [styles];
-export { BaseCodeBlock };
 //# sourceMappingURL=BaseCodeBlock.js.map

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,MAAsB,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;YACnD,OAAO,EAAE,CAAC;SACX;aAAM;YACL,OAAO,MAAM,EAAE,WAAW,IAAI,EAAE,CAAC;SAClC;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;SADd,aAAa","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

@@ -23,7 +23,7 @@ import { BaseCodeBlock } from './BaseCodeBlock.js';
  */
 export declare class PfCodeBlock extends BaseCodeBlock {
     #private;
-    static readonly styles: import("lit").CSSResult[];
+    static readonly styles: CSSStyleSheet[];
     expanded: boolean;
     render(): import("lit-html").TemplateResult<1>;
 }

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

@@ -6,7 +6,7 @@ import { property } from 'lit/decorators/property.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { BaseCodeBlock } from './BaseCodeBlock.js';
 import { css } from "lit";
-const styles = css `:host{background-color:var(--pf-c-code-block--BackgroundColor,#f0f0f0);font-size:var(--pf-c-code-block__pre--FontSize, .875rem);font-family:var(--pf-c-code-block__pre--FontFamily, "Liberation Mono", consolas, "SFMono-Regular", menlo, monaco, "Courier New", monospace)}#container{padding-top:var(--pf-c-code-block__content--PaddingTop,1rem);padding-right:var(--pf-c-code-block__content--PaddingRight,1rem);padding-bottom:var(--pf-c-code-block__content--PaddingBottom,1rem);padding-left:var(--pf-c-code-block__content--PaddingLeft,1rem)}#header{border-bottom:var(--pf-c-code-block__header--BorderBottomWidth,1px) solid var(--pf-c-code-block__header--BorderBottomColor,#d2d2d2)}#container{margin:0}pre{margin:0}slot[name=actions]{display:flex;justify-content:end}#expanded{display:inline}button{display:flex;background:0 0;border:none;padding:6px 16px 6px 0;color:#06c;cursor:pointer;font-size:16px}button svg{color:#151515;margin-right:12px;transition:.2s ease-in 0s}.expanded button svg{transform:rotate(-90deg)}`;
+const styles = css `:host {\n  background-color: var(--pf-c-code-block--BackgroundColor, #f0f0f0);\n  font-size: var(--pf-c-code-block__pre--FontSize, 0.875rem);\n  font-family: var(--pf-c-code-block__pre--FontFamily, "Liberation Mono", consolas, "SFMono-Regular", menlo, monaco, "Courier New", monospace);\n}\n\n#container {\n  padding-top: var(--pf-c-code-block__content--PaddingTop, 1rem);\n  padding-right: var(--pf-c-code-block__content--PaddingRight, 1rem);\n  padding-bottom: var(--pf-c-code-block__content--PaddingBottom, 1rem);\n  padding-left: var(--pf-c-code-block__content--PaddingLeft, 1rem);\n}\n\n#header {\n  border-bottom: var(--pf-c-code-block__header--BorderBottomWidth, 1px) solid var(--pf-c-code-block__header--BorderBottomColor, #d2d2d2);\n}\n\n#container {\n  margin: 0;\n}\n\npre {\n  margin: 0;\n}\n\nslot[name="actions"] {\n  display: flex;\n  justify-content: end;\n}\n\n#expanded {\n  display: inline;\n}\n\nbutton {\n  display: flex;\n  background: none;\n  border: none;\n  padding: 6px 16px 6px 0;\n  color: #06c;\n  cursor: pointer;\n  font-size: 16px;\n}\n\nbutton svg {\n  color: #151515;\n  margin-right: 12px;\n  transition: .2s ease-in 0s;\n}\n\n.expanded button svg {\n  transform: rotate(-90deg);\n}\n`;
 /**
  * A **code block** is a component that contains 2 or more lines of read-only code. The code in a code block can be copied to the clipboard.
  *

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

@@ -1 +1 @@
-{"version":3,"file":"pf-code-block.js","sourceRoot":"","sources":["pf-code-block.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,aAAa,EAAE,MAAM,oBAAoB,CAAC;;;AAGnD;;;;;;;;;;;;;;;;;;;;;GAqBG;AAGH,IAAa,WAAW,GAAxB,MAAa,WAAY,SAAQ,aAAa;IAA9C;;;QAG8C,aAAQ,GAAG,KAAK,CAAC;IA+B/D,CAAC;IArBU,MAAM;QACb,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QAC1B,OAAO,IAAI,CAAA;;;;;;mCAMoB,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC;kCACvB,IAAI,CAAC,OAAO;qBACzB,CAAC,QAAQ,KAAK,uBAAA,IAAI,gEAAiB;2BAC7B,CAAC,uBAAA,IAAI,gEAAiB;yBACxB,uBAAA,IAAI,mDAAQ;gCACL,IAAI,CAAC,QAAQ;;;YAGjC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW;;;KAGjD,CAAC;IACJ,CAAC;;;;IA3BC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;AACjC,CAAC;;IAGC,OAAO,IAAI,CAAC,aAAa,CAAC,qBAAqB,CAAC,EAAE,WAAW,IAAI,EAAE,CAAC;AACtE,CAAC;AAVe,kBAAM,GAAG,CAAC,GAAG,aAAa,CAAC,MAAM,EAAE,MAAM,CAAC,AAApC,CAAqC;AAEf;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAAkB;AAHlD,WAAW;IADvB,aAAa,CAAC,eAAe,CAAC;GAClB,WAAW,CAkCvB;SAlCY,WAAW","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 { BaseCodeBlock } from './BaseCodeBlock.js';\nimport styles from './pf-code-block.css';\n\n/**\n * A **code block** is a component that contains 2 or more lines of read-only code. The code in a code block can be copied to the clipboard.\n *\n * @slot code\n *       The slot to put the code in\n * @slot expandable-code\n *       The slot to put the code in that should be revealed when the \"Show more\" button is\n *       clicked to expand the code-block\n * @slot actions\n *       Contains the actions for the code-block. For example, copy to clipboard.\n * @attr {boolean} expanded {@default `false`}\n *       Indicates if the code-block has been expanded\n * @cssprop {<color>} --pf-c-code-block--BackgroundColor {@default `#f0f0f0`}\n * @cssprop {<length>} --pf-c-code-block__header--BorderBottomWidth {@default `1px`}\n * @cssprop {<color>} --pf-c-code-block__header--BorderBottomColor {@default `#d2d2d2`}\n * @cssprop {<length>} --pf-c-code-block__content--PaddingTop {@default `1rem`}\n * @cssprop {<length>} --pf-c-code-block__content--PaddingRight {@default `1rem`}\n * @cssprop {<length>} --pf-c-code-block__content--PaddingBottom {@default `1rem`}\n * @cssprop {<length>} --pf-c-code-block__content--PaddingLeft {@default `1rem`}\n * @cssprop {<length>} --pf-c-code-block__pre--FontSize {@default `0.875rem`}\n * @cssprop {<string>} --pf-c-code-block__pre--FontFamily {@default `\"Liberation Mono\", consolas, \"SFMono-Regular\", menlo, monaco, \"Courier New\", monospace`}\n */\n\n@customElement('pf-code-block')\nexport class PfCodeBlock extends BaseCodeBlock {\n  static readonly styles = [...BaseCodeBlock.styles, styles];\n\n  @property({ type: Boolean, reflect: true }) expanded = false;\n\n  #toggle() {\n    this.expanded = !this.expanded;\n  }\n\n  get #expandedContent(): string {\n    return this.querySelector('script[data-expand]')?.textContent ?? '';\n  }\n\n  override render() {\n    const { expanded } = this;\n    return html`\n      <div id=\"header\">\n        <div id=\"actions\">\n          <slot name=\"actions\"></slot>\n        </div>\n      </div>\n      <div id=\"container\" class=\"${classMap({ expanded })}\">\n        <pre><code id=\"content\">${this.content}</code><code id=\"code-block-expand\"\n          ?hidden=\"${!expanded}\">${this.#expandedContent}</code></pre>\n        <button ?hidden=\"${!this.#expandedContent}\"\n                @click=${this.#toggle}\n                aria-expanded=${this.expanded}\n                aria-controls=\"code-block-expand\">\n          <svg fill=\"currentColor\" height=\"1em\" width=\"1em\" viewBox=\"0 0 256 512\" aria-hidden=\"true\" role=\"img\" style=\"vertical-align: -0.125em;\"><path d=\"M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z\"></path></svg>\n          ${!this.expanded ? 'Show more' : 'Show less'}\n        </button>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-code-block': PfCodeBlock;\n  }\n}\n"]}
+{"version":3,"file":"pf-code-block.js","sourceRoot":"","sources":["pf-code-block.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,aAAa,EAAE,MAAM,oBAAoB,CAAC;;;AAGnD;;;;;;;;;;;;;;;;;;;;;GAqBG;AAGI,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,aAAa;IAAvC;;;QAGuC,aAAQ,GAAG,KAAK,CAAC;IA+B/D,CAAC;IArBU,MAAM;QACb,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QAC1B,OAAO,IAAI,CAAA;;;;;;mCAMoB,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC;kCACvB,IAAI,CAAC,OAAO;qBACzB,CAAC,QAAQ,KAAK,uBAAA,IAAI,gEAAiB;2BAC7B,CAAC,uBAAA,IAAI,gEAAiB;yBACxB,uBAAA,IAAI,mDAAQ;gCACL,IAAI,CAAC,QAAQ;;;YAGjC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW;;;KAGjD,CAAC;IACJ,CAAC;;;;IA3BC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;AACjC,CAAC;;IAGC,OAAO,IAAI,CAAC,aAAa,CAAC,qBAAqB,CAAC,EAAE,WAAW,IAAI,EAAE,CAAC;AACtE,CAAC;AAVe,kBAAM,GAAG,CAAC,GAAG,aAAa,CAAC,MAAM,EAAE,MAAM,CAAC,AAApC,CAAqC;AAEf;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAAkB;AAHlD,WAAW;IADvB,aAAa,CAAC,eAAe,CAAC;GAClB,WAAW,CAkCvB","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 { BaseCodeBlock } from './BaseCodeBlock.js';\nimport styles from './pf-code-block.css';\n\n/**\n * A **code block** is a component that contains 2 or more lines of read-only code. The code in a code block can be copied to the clipboard.\n *\n * @slot code\n *       The slot to put the code in\n * @slot expandable-code\n *       The slot to put the code in that should be revealed when the \"Show more\" button is\n *       clicked to expand the code-block\n * @slot actions\n *       Contains the actions for the code-block. For example, copy to clipboard.\n * @attr {boolean} expanded {@default `false`}\n *       Indicates if the code-block has been expanded\n * @cssprop {<color>} --pf-c-code-block--BackgroundColor {@default `#f0f0f0`}\n * @cssprop {<length>} --pf-c-code-block__header--BorderBottomWidth {@default `1px`}\n * @cssprop {<color>} --pf-c-code-block__header--BorderBottomColor {@default `#d2d2d2`}\n * @cssprop {<length>} --pf-c-code-block__content--PaddingTop {@default `1rem`}\n * @cssprop {<length>} --pf-c-code-block__content--PaddingRight {@default `1rem`}\n * @cssprop {<length>} --pf-c-code-block__content--PaddingBottom {@default `1rem`}\n * @cssprop {<length>} --pf-c-code-block__content--PaddingLeft {@default `1rem`}\n * @cssprop {<length>} --pf-c-code-block__pre--FontSize {@default `0.875rem`}\n * @cssprop {<string>} --pf-c-code-block__pre--FontFamily {@default `\"Liberation Mono\", consolas, \"SFMono-Regular\", menlo, monaco, \"Courier New\", monospace`}\n */\n\n@customElement('pf-code-block')\nexport class PfCodeBlock extends BaseCodeBlock {\n  static readonly styles = [...BaseCodeBlock.styles, styles];\n\n  @property({ type: Boolean, reflect: true }) expanded = false;\n\n  #toggle() {\n    this.expanded = !this.expanded;\n  }\n\n  get #expandedContent(): string {\n    return this.querySelector('script[data-expand]')?.textContent ?? '';\n  }\n\n  override render() {\n    const { expanded } = this;\n    return html`\n      <div id=\"header\">\n        <div id=\"actions\">\n          <slot name=\"actions\"></slot>\n        </div>\n      </div>\n      <div id=\"container\" class=\"${classMap({ expanded })}\">\n        <pre><code id=\"content\">${this.content}</code><code id=\"code-block-expand\"\n          ?hidden=\"${!expanded}\">${this.#expandedContent}</code></pre>\n        <button ?hidden=\"${!this.#expandedContent}\"\n                @click=${this.#toggle}\n                aria-expanded=${this.expanded}\n                aria-controls=\"code-block-expand\">\n          <svg fill=\"currentColor\" height=\"1em\" width=\"1em\" viewBox=\"0 0 256 512\" aria-hidden=\"true\" role=\"img\" style=\"vertical-align: -0.125em;\"><path d=\"M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z\"></path></svg>\n          ${!this.expanded ? 'Show more' : 'Show less'}\n        </button>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-code-block': PfCodeBlock;\n  }\n}\n"]}

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/context.d.ts

@@ -0,0 +1,6 @@
+export interface PfDropdownContext {
+    disabled: boolean;
+}
+export declare const context: {
+    __context__: PfDropdownContext;
+};

package/pf-dropdown/context.js

@@ -0,0 +1,3 @@
+import { createContextWithRoot } from '@patternfly/pfe-core/functions/context.js';
+export const context = createContextWithRoot(Symbol('pf-dropdown-menu-context'));
+//# sourceMappingURL=context.js.map

package/pf-dropdown/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","sourceRoot":"","sources":["context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,2CAA2C,CAAC;AAMlF,MAAM,CAAC,MAAM,OAAO,GAClB,qBAAqB,CAAqB,MAAM,CAAC,0BAA0B,CAAC,CAAC,CAAC","sourcesContent":["import { createContextWithRoot } from '@patternfly/pfe-core/functions/context.js';\n\nexport interface PfDropdownContext {\n  disabled: boolean;\n}\n\nexport const context =\n  createContextWithRoot<PfDropdownContext >(Symbol('pf-dropdown-menu-context'));\n"]}

package/pf-dropdown/pf-dropdown-group.css

@@ -0,0 +1,38 @@
+:host {
+  display: block;
+}
+
+[hidden] {
+  display: none !important;
+}
+
+p {
+  margin: 0;
+  font-size: 14px;
+  font-weight: normal;
+  color: #777;
+  padding-top: 0.5rem;
+  padding-right: 1rem;
+  padding-bottom: 0.5rem;
+  padding-left: 1rem;
+  font-size: 0.75rem;
+  font-weight: 400;
+  color: #6a6e73;
+}
+
+::slotted(hr) {
+  margin: 0;
+  border-color: var(--pf-c-divider--BackgroundColor, var(--pf-global--BorderColor--100, #d2d2d2));
+  border-style: solid;
+}
+
+::slotted([role="separator"]:not(hr)) {
+  width: 100%;
+  height: 1px;
+  background-color: var(--pf-c-divider--BackgroundColor, var(--pf-global--BorderColor--100, #d2d2d2));
+  padding: 0px;
+  margin: 0px;
+  border: 0;
+  display: block;
+  pointer-events: none;
+}

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

@@ -0,0 +1,26 @@
+import { LitElement } from 'lit';
+/**
+ * Represents a group of items for a dropdown component.
+ * @slot
+ *     Content for the group of dropdown items
+ */
+export declare class PfDropdownGroup extends LitElement {
+    static readonly styles: CSSStyleSheet[];
+    static readonly shadowRootOptions: {
+        delegatesFocus: boolean;
+        mode: ShadowRootMode;
+        slotAssignment?: SlotAssignmentMode | undefined;
+        customElements?: CustomElementRegistry | undefined;
+        registry?: CustomElementRegistry | undefined;
+    };
+    /**
+     * The label for the group of dropdown items.
+     */
+    label?: string;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'pf-dropdown-group': PfDropdownGroup;
+    }
+}

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

@@ -0,0 +1,32 @@
+import { __decorate } from "tslib";
+import { LitElement, html } from 'lit';
+import { customElement } from 'lit/decorators/custom-element.js';
+import { property } from 'lit/decorators/property.js';
+import { css } from "lit";
+const styles = css `:host {\n  display: block;\n}\n\n[hidden] {\n  display: none !important;\n}\n\np {\n  margin: 0;\n  font-size: 14px;\n  font-weight: normal;\n  color: #777;\n  padding-top: 0.5rem;\n  padding-right: 1rem;\n  padding-bottom: 0.5rem;\n  padding-left: 1rem;\n  font-size: 0.75rem;\n  font-weight: 400;\n  color: #6a6e73;\n}\n\n::slotted(hr) {\n  margin: 0;\n  border-color: var(--pf-c-divider--BackgroundColor, var(--pf-global--BorderColor--100, #d2d2d2));\n  border-style: solid;\n}\n\n::slotted([role="separator"]:not(hr)) {\n  width: 100%;\n  height: 1px;\n  background-color: var(--pf-c-divider--BackgroundColor, var(--pf-global--BorderColor--100, #d2d2d2));\n  padding: 0px;\n  margin: 0px;\n  border: 0;\n  display: block;\n  pointer-events: none;\n}\n`;
+/**
+ * Represents a group of items for a dropdown component.
+ * @slot
+ *     Content for the group of dropdown items
+ */
+let PfDropdownGroup = class PfDropdownGroup extends LitElement {
+    render() {
+        return html `
+      <p ?hidden="${!this.label}" role="presentation">${this.label}</p>
+      <slot></slot>
+    `;
+    }
+};
+PfDropdownGroup.styles = [styles];
+PfDropdownGroup.shadowRootOptions = {
+    ...LitElement.shadowRootOptions,
+    delegatesFocus: true,
+};
+__decorate([
+    property({ reflect: true })
+], PfDropdownGroup.prototype, "label", void 0);
+PfDropdownGroup = __decorate([
+    customElement('pf-dropdown-group')
+], PfDropdownGroup);
+export { PfDropdownGroup };
+//# sourceMappingURL=pf-dropdown-group.js.map

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

@@ -0,0 +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;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"]}