@patternfly/elements 3.0.0 → 3.0.2

package/pf-modal/test/pf-modal.e2e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pf-modal.e2e.js","sourceRoot":"","sources":["pf-modal.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,sDAAsD,CAAC;AAEnF,MAAM,OAAO,GAAG,UAAU,CAAC;AAE3B,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;QAE/B,MAAM,aAAa,CAAC,KAAK,CAAC,GAAG,OAAO,SAAS,CAAC,CAAC;QAC/C,MAAM,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;QAE/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-modal';\n\ntest.describe(tagName, () => {\n  test('snapshot', async ({ page }) => {\n    const componentPage = new PfeDemoPage(page, tagName);\n    await componentPage.navigate();\n\n    await componentPage.click(`${tagName} button`);\n    await page.waitForTimeout(100);\n\n    await componentPage.snapshot();\n  });\n});\n"]}

package/pf-modal/test/pf-modal.spec.d.ts

@@ -0,0 +1 @@
+import '@patternfly/pfe-tools/test/stub-logger.js';

package/pf-modal/test/pf-modal.spec.js

@@ -0,0 +1,197 @@
+import { expect, nextFrame, html } from '@open-wc/testing';
+import { createFixture } from '@patternfly/pfe-tools/test/create-fixture.js';
+import { setViewport } from '@web/test-runner-commands';
+import { PfModal } from '@patternfly/elements/pf-modal/pf-modal.js';
+import '@patternfly/pfe-tools/test/stub-logger.js';
+// One element, defined here, is used
+// in multiple tests. It's torn down and recreated each time.
+const TEMPLATES = {
+    testElement: html `<pf-modal></pf-modal>`,
+    smallModal: html `
+    <pf-modal variant="small">
+      <h2 slot="header">Small modal</h2>
+      <p>Lorem ipsum dolor sit amet, <a href="#foo">consectetur adipisicing</a> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+    </pf-modal>
+  `,
+    mediumModal: html `
+    <pf-modal variant="medium">
+      <h2 slot="header">Medium modal</h2>
+      <p>Lorem ipsum dolor sit amet, <a href="#foo">consectetur adipisicing</a> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+    </pf-modal>
+  `,
+    largeModal: html `
+    <pf-modal variant="large">
+      <h2 slot="header">Large modal</h2>
+      <p>Lorem ipsum dolor sit amet, <a href="#foo">consectetur adipisicing</a> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+    </pf-modal>
+  `,
+};
+describe('<pf-modal>', function () {
+    it('imperatively instantiates', function () {
+        expect(document.createElement('pf-modal')).to.be.an.instanceof(PfModal);
+    });
+    it('should upgrade', async function () {
+        const el = await createFixture(TEMPLATES.testElement);
+        expect(el, 'pf-modal should be an instance of PfModal')
+            .to.be.an.instanceOf(customElements.get('pf-modal'))
+            .and
+            .to.be.an.instanceOf(PfModal);
+    });
+    // Example test.
+    it('should apply attributes correctly', async function () {
+        // Use the same markup that's declared at the top of the file.
+        const el = await createFixture(html `
+      <pf-modal>
+        <h2 slot="header">Modal with a header</h2>
+        <p>Lorem ipsum dolor sit amet, <a href="#foo">consectetur adipisicing</a> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+      </pf-modal>
+    `);
+        const modalWindow = el.shadowRoot.querySelector('#dialog');
+        const button = el.shadowRoot.querySelector('[part=close-button]');
+        await nextFrame();
+        expect(modalWindow.getAttribute('tabindex'), 'dialog tabindex').to.equal('0');
+        expect(modalWindow.hasAttribute('hidden'), 'hidden').to.be.true;
+        expect(button.getAttribute('aria-label'), 'button aria-label').to.equal('Close dialog');
+    });
+    it('should open the modal window when the trigger is clicked', async function () {
+        const el = await createFixture(html `
+      <pf-modal trigger="trigger">
+        <h2 slot="header">Modal with a header</h2>
+        <p>Lorem ipsum dolor sit amet, <a href="#foo">consectetur adipisicing</a> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+      </pf-modal>
+      <pf-button id="trigger">Open a modal</pf-button>
+    `);
+        const modalWindow = el.shadowRoot.querySelector('#dialog');
+        const trigger = document.getElementById('trigger');
+        trigger.click();
+        await el.updateComplete;
+        expect(modalWindow.hasAttribute('hidden')).to.not.be.true;
+        // reset
+        el.close();
+        await el.updateComplete;
+        expect(modalWindow.hasAttribute('hidden')).to.be.true;
+    });
+    it('should remove the hidden attribute from the host on upgrade', async function () {
+        const el = await createFixture(TEMPLATES.testElement);
+        await new Promise(r => setTimeout(r, 25));
+        // test for the hidden attribute on the host
+        expect(el.hasAttribute('hidden')).to.not.be.true;
+    });
+    describe('on extra large screen', function () {
+        beforeEach(async function () {
+            await setViewport({ width: 1600, height: 1200 });
+        });
+        describe('with variant=small attribute', function () {
+            it('has small modal width', async function () {
+                const el = await createFixture(TEMPLATES.smallModal);
+                const modalWindow = el.shadowRoot.querySelector('#dialog');
+                expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))
+                    .to.equal('calc(100% - 32px)');
+            });
+        });
+        describe('with variant=medium attribute', function () {
+            it('has medium modal width', async function () {
+                const el = await createFixture(TEMPLATES.mediumModal);
+                const modalWindow = el.shadowRoot.querySelector('#dialog');
+                expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))
+                    .to.equal('calc(100% - 32px)');
+            });
+        });
+        describe('with variant=large attribute', function () {
+            it('has large modal width', async function () {
+                const el = await createFixture(TEMPLATES.largeModal);
+                const modalWindow = el.shadowRoot.querySelector('#dialog');
+                expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))
+                    .to.equal('calc(100% - 32px)');
+            });
+        });
+    });
+    describe('on large screen', function () {
+        beforeEach(async function () {
+            await setViewport({ width: 1000, height: 800 });
+        });
+        describe('with variant=small attribute', function () {
+            it('has small modal width', async function () {
+                const el = await createFixture(TEMPLATES.smallModal);
+                const modalWindow = el.shadowRoot.querySelector('#dialog');
+                expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))
+                    .to.equal('calc(100% - 32px)');
+            });
+        });
+        describe('with variant=medium attribute', function () {
+            it('has medium modal width', async function () {
+                const el = await createFixture(TEMPLATES.mediumModal);
+                const modalWindow = el.shadowRoot.querySelector('#dialog');
+                expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))
+                    .to.equal('calc(100% - 32px)');
+            });
+        });
+        describe('with variant=large attribute', function () {
+            it('has large modal width', async function () {
+                const el = await createFixture(TEMPLATES.largeModal);
+                const modalWindow = el.shadowRoot.querySelector('#dialog');
+                expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))
+                    .to.equal('calc(100% - 32px)');
+            });
+        });
+    });
+    describe('on medium screen', function () {
+        beforeEach(async function () {
+            await setViewport({ width: 768, height: 600 });
+        });
+        describe('with variant=small attribute', function () {
+            it('has small modal width', async function () {
+                const el = await createFixture(TEMPLATES.smallModal);
+                const modalWindow = el.shadowRoot.querySelector('#dialog');
+                expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))
+                    .to.equal('calc(100% - 32px)');
+            });
+        });
+        describe('with variant=medium attribute', function () {
+            it('has medium modal width', async function () {
+                const el = await createFixture(TEMPLATES.mediumModal);
+                const modalWindow = el.shadowRoot.querySelector('#dialog');
+                expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))
+                    .to.equal('calc(100% - 32px)');
+            });
+        });
+        describe('with variant=large attribute', function () {
+            it('has large modal width', async function () {
+                const el = await createFixture(TEMPLATES.largeModal);
+                const modalWindow = el.shadowRoot.querySelector('#dialog');
+                expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))
+                    .to.equal('calc(100% - 32px)');
+            });
+        });
+    });
+    describe('on small screen', function () {
+        beforeEach(async function () {
+            await setViewport({ width: 480, height: 540 });
+        });
+        describe('with variant=small attribute', function () {
+            it('has small modal width', async function () {
+                const el = await createFixture(TEMPLATES.smallModal);
+                const modalWindow = el.shadowRoot.querySelector('#dialog');
+                expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))
+                    .to.equal('calc(100% - 32px)');
+            });
+        });
+        describe('with variant=medium attribute', function () {
+            it('has medium modal width', async function () {
+                const el = await createFixture(TEMPLATES.mediumModal);
+                const modalWindow = el.shadowRoot.querySelector('#dialog');
+                expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))
+                    .to.equal('calc(100% - 32px)');
+            });
+        });
+        describe('with variant=large attribute', function () {
+            it('has large modal width', async function () {
+                const el = await createFixture(TEMPLATES.largeModal);
+                const modalWindow = el.shadowRoot.querySelector('#dialog');
+                expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))
+                    .to.equal('calc(100% - 32px)');
+            });
+        });
+    });
+});
+//# sourceMappingURL=pf-modal.spec.js.map

package/pf-modal/test/pf-modal.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pf-modal.spec.js","sourceRoot":"","sources":["pf-modal.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { expect, nextFrame, html } from '@open-wc/testing';\nimport { createFixture } from '@patternfly/pfe-tools/test/create-fixture.js';\nimport { setViewport } from '@web/test-runner-commands';\nimport { PfModal } from '@patternfly/elements/pf-modal/pf-modal.js';\nimport '@patternfly/pfe-tools/test/stub-logger.js';\n\n// One element, defined here, is used\n// in multiple tests. It's torn down and recreated each time.\nconst TEMPLATES = {\n  testElement: html`<pf-modal></pf-modal>`,\n\n  smallModal: html`\n    <pf-modal variant=\"small\">\n      <h2 slot=\"header\">Small modal</h2>\n      <p>Lorem ipsum dolor sit amet, <a href=\"#foo\">consectetur adipisicing</a> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>\n    </pf-modal>\n  `,\n\n  mediumModal: html`\n    <pf-modal variant=\"medium\">\n      <h2 slot=\"header\">Medium modal</h2>\n      <p>Lorem ipsum dolor sit amet, <a href=\"#foo\">consectetur adipisicing</a> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>\n    </pf-modal>\n  `,\n\n  largeModal: html`\n    <pf-modal variant=\"large\">\n      <h2 slot=\"header\">Large modal</h2>\n      <p>Lorem ipsum dolor sit amet, <a href=\"#foo\">consectetur adipisicing</a> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>\n    </pf-modal>\n  `,\n\n};\n\ndescribe('<pf-modal>', function() {\n  it('imperatively instantiates', function() {\n    expect(document.createElement('pf-modal')).to.be.an.instanceof(PfModal);\n  });\n\n  it('should upgrade', async function() {\n    const el = await createFixture<PfModal>(TEMPLATES.testElement);\n    expect(el, 'pf-modal should be an instance of PfModal')\n        .to.be.an.instanceOf(customElements.get('pf-modal'))\n        .and\n        .to.be.an.instanceOf(PfModal);\n  });\n\n  // Example test.\n  it('should apply attributes correctly', async function() {\n    // Use the same markup that's declared at the top of the file.\n    const el = await createFixture<PfModal>(html`\n      <pf-modal>\n        <h2 slot=\"header\">Modal with a header</h2>\n        <p>Lorem ipsum dolor sit amet, <a href=\"#foo\">consectetur adipisicing</a> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>\n      </pf-modal>\n    `);\n    const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n    const button = el.shadowRoot!.querySelector('[part=close-button]')!;\n\n    await nextFrame();\n\n    expect(modalWindow.getAttribute('tabindex'), 'dialog tabindex').to.equal('0');\n    expect(modalWindow.hasAttribute('hidden'), 'hidden').to.be.true;\n    expect(button.getAttribute('aria-label'), 'button aria-label').to.equal('Close dialog');\n  });\n\n  it('should open the modal window when the trigger is clicked', async function() {\n    const el = await createFixture<PfModal>(html`\n      <pf-modal trigger=\"trigger\">\n        <h2 slot=\"header\">Modal with a header</h2>\n        <p>Lorem ipsum dolor sit amet, <a href=\"#foo\">consectetur adipisicing</a> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>\n      </pf-modal>\n      <pf-button id=\"trigger\">Open a modal</pf-button>\n    `);\n    const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n    const trigger = document.getElementById('trigger')!;\n\n    trigger.click();\n    await el.updateComplete;\n\n    expect(modalWindow.hasAttribute('hidden')).to.not.be.true;\n\n    // reset\n    el.close();\n    await el.updateComplete;\n\n    expect(modalWindow.hasAttribute('hidden')).to.be.true;\n  });\n\n  it('should remove the hidden attribute from the host on upgrade', async function() {\n    const el = await createFixture<PfModal>(TEMPLATES.testElement);\n\n    await new Promise(r => setTimeout(r, 25));\n    // test for the hidden attribute on the host\n    expect(el.hasAttribute('hidden')).to.not.be.true;\n  });\n\n  describe('on extra large screen', function() {\n    beforeEach(async function() {\n      await setViewport({ width: 1600, height: 1200 });\n    });\n\n    describe('with variant=small attribute', function() {\n      it('has small modal width', async function() {\n        const el = await createFixture<PfModal>(TEMPLATES.smallModal);\n        const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n        expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))\n            .to.equal('calc(100% - 32px)');\n      });\n    });\n\n    describe('with variant=medium attribute', function() {\n      it('has medium modal width', async function() {\n        const el = await createFixture<PfModal>(TEMPLATES.mediumModal);\n        const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n        expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))\n            .to.equal('calc(100% - 32px)');\n      });\n    });\n\n    describe('with variant=large attribute', function() {\n      it('has large modal width', async function() {\n        const el = await createFixture<PfModal>(TEMPLATES.largeModal);\n        const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n        expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))\n            .to.equal('calc(100% - 32px)');\n      });\n    });\n  });\n\n  describe('on large screen', function() {\n    beforeEach(async function() {\n      await setViewport({ width: 1000, height: 800 });\n    });\n\n    describe('with variant=small attribute', function() {\n      it('has small modal width', async function() {\n        const el = await createFixture<PfModal>(TEMPLATES.smallModal);\n        const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n        expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))\n            .to.equal('calc(100% - 32px)');\n      });\n    });\n\n    describe('with variant=medium attribute', function() {\n      it('has medium modal width', async function() {\n        const el = await createFixture<PfModal>(TEMPLATES.mediumModal);\n        const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n        expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))\n            .to.equal('calc(100% - 32px)');\n      });\n    });\n\n    describe('with variant=large attribute', function() {\n      it('has large modal width', async function() {\n        const el = await createFixture<PfModal>(TEMPLATES.largeModal);\n        const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n        expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))\n            .to.equal('calc(100% - 32px)');\n      });\n    });\n  });\n\n  describe('on medium screen', function() {\n    beforeEach(async function() {\n      await setViewport({ width: 768, height: 600 });\n    });\n\n    describe('with variant=small attribute', function() {\n      it('has small modal width', async function() {\n        const el = await createFixture<PfModal>(TEMPLATES.smallModal);\n        const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n        expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))\n            .to.equal('calc(100% - 32px)');\n      });\n    });\n\n    describe('with variant=medium attribute', function() {\n      it('has medium modal width', async function() {\n        const el = await createFixture<PfModal>(TEMPLATES.mediumModal);\n        const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n        expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))\n            .to.equal('calc(100% - 32px)');\n      });\n    });\n\n    describe('with variant=large attribute', function() {\n      it('has large modal width', async function() {\n        const el = await createFixture<PfModal>(TEMPLATES.largeModal);\n        const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n        expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))\n            .to.equal('calc(100% - 32px)');\n      });\n    });\n  });\n\n  describe('on small screen', function() {\n    beforeEach(async function() {\n      await setViewport({ width: 480, height: 540 });\n    });\n\n    describe('with variant=small attribute', function() {\n      it('has small modal width', async function() {\n        const el = await createFixture<PfModal>(TEMPLATES.smallModal);\n        const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n        expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))\n            .to.equal('calc(100% - 32px)');\n      });\n    });\n\n    describe('with variant=medium attribute', function() {\n      it('has medium modal width', async function() {\n        const el = await createFixture<PfModal>(TEMPLATES.mediumModal);\n        const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n        expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))\n            .to.equal('calc(100% - 32px)');\n      });\n    });\n\n    describe('with variant=large attribute', function() {\n      it('has large modal width', async function() {\n        const el = await createFixture<PfModal>(TEMPLATES.largeModal);\n        const modalWindow = el.shadowRoot!.querySelector('#dialog')!;\n        expect(getComputedStyle(modalWindow).getPropertyValue('max-width'))\n            .to.equal('calc(100% - 32px)');\n      });\n    });\n  });\n});\n"]}

package/pf-panel/pf-panel.d.ts

@@ -14,7 +14,7 @@ export declare class PfPanel extends LitElement {
     static readonly styles: CSSStyleSheet[];
     scrollable: boolean;
     variant?: 'raised' | 'bordered';
-    render(): import("lit").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1>;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/pf-panel/test/pf-panel.e2e.d.ts

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

package/pf-panel/test/pf-panel.e2e.js

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

package/pf-panel/test/pf-panel.e2e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pf-panel.e2e.js","sourceRoot":"","sources":["pf-panel.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,sDAAsD,CAAC;AAEnF,MAAM,OAAO,GAAG,UAAU,CAAC;AAE3B,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-panel';\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-panel/test/pf-panel.spec.d.ts

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

package/pf-panel/test/pf-panel.spec.js

@@ -0,0 +1,22 @@
+import { expect, html } from '@open-wc/testing';
+import { createFixture } from '@patternfly/pfe-tools/test/create-fixture.js';
+import { PfPanel } from '@patternfly/elements/pf-panel/pf-panel.js';
+describe('<pf-panel>', function () {
+    describe('simply instantiating', function () {
+        let element;
+        beforeEach(async function () {
+            element = await createFixture(html `<pf-panel></pf-panel>`);
+        });
+        it('imperatively instantiates', function () {
+            expect(document.createElement('pf-panel')).to.be.an.instanceof(PfPanel);
+        });
+        it('should upgrade', function () {
+            const klass = customElements.get('pf-panel');
+            expect(element)
+                .to.be.an.instanceOf(klass)
+                .and
+                .to.be.an.instanceOf(PfPanel);
+        });
+    });
+});
+//# sourceMappingURL=pf-panel.spec.js.map

package/pf-panel/test/pf-panel.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pf-panel.spec.js","sourceRoot":"","sources":["pf-panel.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,8CAA8C,CAAC;AAC7E,OAAO,EAAE,OAAO,EAAE,MAAM,2CAA2C,CAAC;AAEpE,QAAQ,CAAC,YAAY,EAAE;IACrB,QAAQ,CAAC,sBAAsB,EAAE;QAC/B,IAAI,OAAgB,CAAC;QACrB,UAAU,CAAC,KAAK;YACd,OAAO,GAAG,MAAM,aAAa,CAAW,IAAI,CAAA,uBAAuB,CAAC,CAAC;QACvE,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,2BAA2B,EAAE;YAC9B,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;QAC1E,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,gBAAgB,EAAE;YACnB,MAAM,KAAK,GAAG,cAAc,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;YAC7C,MAAM,CAAC,OAAO,CAAC;iBACV,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC;iBAC1B,GAAG;iBACH,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;QACpC,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { expect, html } from '@open-wc/testing';\nimport { createFixture } from '@patternfly/pfe-tools/test/create-fixture.js';\nimport { PfPanel } from '@patternfly/elements/pf-panel/pf-panel.js';\n\ndescribe('<pf-panel>', function() {\n  describe('simply instantiating', function() {\n    let element: PfPanel;\n    beforeEach(async function() {\n      element = await createFixture <PfPanel>(html`<pf-panel></pf-panel>`);\n    });\n\n    it('imperatively instantiates', function() {\n      expect(document.createElement('pf-panel')).to.be.an.instanceof(PfPanel);\n    });\n\n    it('should upgrade', function() {\n      const klass = customElements.get('pf-panel');\n      expect(element)\n          .to.be.an.instanceOf(klass)\n          .and\n          .to.be.an.instanceOf(PfPanel);\n    });\n  });\n});\n"]}

package/pf-popover/pf-popover.d.ts

@@ -19,9 +19,7 @@ export declare class PopoverShownEvent extends ComposedEvent {
 }
 /**
  * A **Popover** displays content in a non-modal dialog and adds contextual information or provides resources via text and links.
- *
  * @summary Toggle the visibility of helpful or contextual information.
- *
  * @slot -
  *         The default slot holds invoking element.
  *         Typically this would be an icon, button, or other small sized element.
@@ -35,7 +33,6 @@ export declare class PopoverShownEvent extends ComposedEvent {
  *       This slot renders the content that will be displayed inside of the body of the popover.
  * @slot footer
  *       This slot renders the content that will be displayed inside of the footer of the popover.
- *
  * @csspart container - The component wrapper
  * @csspart content - The content wrapper
  * @csspart header - The header element; only visible if both an icon annd heading are provided.
@@ -44,7 +41,6 @@ export declare class PopoverShownEvent extends ComposedEvent {
  * @csspart close-button - The close button
  * @csspart body - The container for the body content
  * @csspart footer - The container for the footer content
- *
  * @cssprop {<length>} --pf-c-popover__arrow--Height
  *          Height of the arrow
  *          {@default `1.5625rem`}
@@ -241,7 +237,7 @@ export declare class PfPopover extends LitElement {
     private _slottedTrigger?;
     private _arrow;
     constructor();
-    render(): import("lit").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1>;
     disconnectedCallback(): void;
     /**
      * Removes event listeners from the old trigger element and attaches

package/pf-popover/pf-popover.js

@@ -39,9 +39,7 @@ export class PopoverShownEvent extends ComposedEvent {
 }
 /**
  * A **Popover** displays content in a non-modal dialog and adds contextual information or provides resources via text and links.
- *
  * @summary Toggle the visibility of helpful or contextual information.
- *
  * @slot -
  *         The default slot holds invoking element.
  *         Typically this would be an icon, button, or other small sized element.
@@ -55,7 +53,6 @@ export class PopoverShownEvent extends ComposedEvent {
  *       This slot renders the content that will be displayed inside of the body of the popover.
  * @slot footer
  *       This slot renders the content that will be displayed inside of the footer of the popover.
- *
  * @csspart container - The component wrapper
  * @csspart content - The content wrapper
  * @csspart header - The header element; only visible if both an icon annd heading are provided.
@@ -64,7 +61,6 @@ export class PopoverShownEvent extends ComposedEvent {
  * @csspart close-button - The close button
  * @csspart body - The container for the body content
  * @csspart footer - The container for the footer content
- *
  * @cssprop {<length>} --pf-c-popover__arrow--Height
  *          Height of the arrow
  *          {@default `1.5625rem`}
@@ -236,7 +232,9 @@ let PfPopover = PfPopover_1 = class PfPopover extends LitElement {
         const headingSlotWithFallback = html `
       <slot id="heading" name="heading" part="heading" ?hidden=${!hasHeading}>${headingContent}</slot>
     `;
-        const headerIcon = this.icon ?? PfPopover_1.alertIcons.get(this.alertSeverity) ?? '';
+        const headerIcon = this.icon
+            ?? PfPopover_1.alertIcons.get(this.alertSeverity)
+            ?? '';
         return html `
       <div id="container"
            style="${styleMap(styles)}"
@@ -411,7 +409,11 @@ __decorate([
     property({ type: Boolean, reflect: true, attribute: 'no-flip' })
 ], PfPopover.prototype, "noFlip", void 0);
 __decorate([
-    property({ type: Number, reflect: true, attribute: 'heading-level' })
+    property({
+        type: Number,
+        reflect: true,
+        attribute: 'heading-level',
+    })
 ], PfPopover.prototype, "headingLevel", void 0);
 __decorate([
     property({ reflect: true, attribute: 'icon-set' })
@@ -426,7 +428,10 @@ __decorate([
     property({ reflect: true, attribute: 'accessible-close-label' })
 ], PfPopover.prototype, "accessibleCloseLabel", void 0);
 __decorate([
-    deprecation({ alias: 'accessible-close-label', attribute: 'close-label' })
+    deprecation({
+        alias: 'accessible-close-label',
+        attribute: 'close-label',
+    })
 ], PfPopover.prototype, "closeButtonLabel", void 0);
 __decorate([
     property({ reflect: true, attribute: 'alert-severity-text' })

package/pf-popover/pf-popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"pf-popover.js","sourceRoot":"","sources":["pf-popover.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, nothing, html, type PropertyValues } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\nimport { query } from 'lit/decorators/query.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { FloatingDOMController } from '@patternfly/pfe-core/controllers/floating-dom-controller.js';\nimport { SlotController } from '@patternfly/pfe-core/controllers/slot-controller.js';\nimport { bound } from '@patternfly/pfe-core/decorators/bound.js';\nimport { ComposedEvent, StringListConverter } from '@patternfly/pfe-core/core.js';\nimport type { Placement } from '@patternfly/pfe-core/controllers/floating-dom-controller.js';\nimport '@patternfly/elements/pf-button/pf-button.js';\nimport styles from './pf-popover.css';\nimport { deprecation } from '@patternfly/pfe-core/decorators/deprecation.js';\n\nconst headingLevels = [2, 3, 4, 5, 6] as const;\n\ntype HeadingLevel = (typeof headingLevels)[number];\n\ntype AlertSeverity = 'default' | 'info' | 'warning' | 'success' | 'danger';\n\nexport class PopoverHideEvent extends ComposedEvent {\n  constructor() {\n    super('hide');\n  }\n}\n\nexport class PopoverHiddenEvent extends ComposedEvent {\n  constructor() {\n    super('hidden');\n  }\n}\n\nexport class PopoverShowEvent extends ComposedEvent {\n  constructor() {\n    super('show');\n  }\n}\n\nexport class PopoverShownEvent extends ComposedEvent {\n  constructor() {\n    super('shown');\n  }\n}\n\n/**\n * A **Popover** displays content in a non-modal dialog and adds contextual information or provides resources via text and links.\n *\n * @summary Toggle the visibility of helpful or contextual information.\n *\n * @slot -\n *         The default slot holds invoking element.\n *         Typically this would be an icon, button, or other small sized element.\n * @slot heading\n *       This slot renders the content that will be displayed inside of the header of the popover.\n *       Typically this would be a heading element.\n * @slot icon\n *       This slot renders the icon that will be displayed inside the header of the popover,\n *       before the heading.\n * @slot body\n *       This slot renders the content that will be displayed inside of the body of the popover.\n * @slot footer\n *       This slot renders the content that will be displayed inside of the footer of the popover.\n *\n * @csspart container - The component wrapper\n * @csspart content - The content wrapper\n * @csspart header - The header element; only visible if both an icon annd heading are provided.\n * @csspart heading - The heading element\n * @csspart icon - The header icon\n * @csspart close-button - The close button\n * @csspart body - The container for the body content\n * @csspart footer - The container for the footer content\n *\n * @cssprop {<length>} --pf-c-popover__arrow--Height\n *          Height of the arrow\n *          {@default `1.5625rem`}\n * @cssprop {<length>} --pf-c-popover__arrow--Width\n *          Width of the arrow\n *          {@default `1.5625rem`}\n * @cssprop {<color>} --pf-c-popover__title-text--Color\n *          Heading font color\n *          {@default `inherit`}\n * @cssprop {<color>} --pf-c-popover__title-icon--Color\n *          Heading icon font color\n *          {@default `#151515`}\n * @cssprop {<color>} --pf-c-popover__arrow--BackgroundColor\n *          Arrow background color\n *          {@default `#fff`}\n * @cssprop --pf-c-popover__arrow--BoxShadow\n *          Arrow box shadow\n *          {@default `0 0.5rem 1rem 0 rgba(3, 3, 3, 0.16), 0 0 0.375rem 0 rgba(3, 3, 3, 0.08)`}\n * @cssprop --pf-c-popover--BoxShadow\n *          Popover box shadow\n *          {@default `0 0.5rem 1rem 0 rgba(3, 3, 3, 0.16), 0 0 0.375rem 0 rgba(3, 3, 3, 0.08)`}\n * @cssprop {<length>} --pf-c-tooltip__content--PaddingTop\n *          Popover top padding\n *          {@default `1rem`}\n * @cssprop {<length>} --pf-c-tooltip__content--PaddingRight\n *          Popover right padding\n *          {@default `1rem`}\n * @cssprop {<length>} --pf-c-tooltip__content--PaddingBottom\n *          Popover bottom padding\n *          {@default `1rem`}\n * @cssprop {<length>} --pf-c-tooltip__content--PaddingLeft\n *          Popover left padding\n *          {@default `1rem`}\n * @cssprop {<number>} --pf-c-popover--line-height\n *          Popover line height\n *          {@default `1.5`}\n * @cssprop {<length>} --pf-c-popover__content--FontSize\n *          Popover font-size\n *          {@default `0.875rem`}\n * @cssprop {<color>} --pf-c-popover__content--BackgroundColor\n *          Popover background color\n *          {@default `#fff`}\n * @cssprop {<length>} --pf-c-popover--MaxWidth\n *          Popover max-width\n *          {@default `20.75rem`}\n * @cssprop {<length>} --pf-c-popover--MinWidth\n *          Popover min-width\n *          {@default `20.75rem`}\n * @cssprop {<number>} --pf-c-popover--c-button--Right\n *          Close button right position\n *          {@default `0}\n * @cssprop {<number>} --pf-c-popover--c-button--Top\n *          Close button top position\n *          {@default `0`}\n * @cssprop {<length>} --pf-c-popover--c-button--sibling--PaddingRight\n *          Padding between close button and its immediate sibling\n *          {@default `3rem`}\n * @cssprop {<length>} --pf-c-popover__title-icon--MarginRight\n *          Heading icon right margin\n *          {@default `0.5rem`}\n * @cssprop {<length>} --pf-c-popover__title--FontSize\n *          Header font-size\n *          {@default `1rem`}\n * @cssprop {<length>} --pf-c-popover__title--MarginBottom\n *          Header bottom margin\n *          {@default `0.5rem`}\n * @cssprop {<number>} --pf-c-popover__title--LineHeight\n *          Header line height\n *          {@default `1.5`}\n * @cssprop {<string>} --pf-c-popover__title--FontFamily\n *          Header font-family\n *          {@default `'RedHatDisplay', 'Overpass', overpass, helvetica, arial, sans-serif`}\n * @cssprop {<length>} --pf-c-popover__footer--MarginTop\n *          Footer top margin\n *          {@default `1rem`}\n * @cssprop {<color>} --pf-c-popover--m-default__title-text--Color\n *          Default alert heading color\n *          {@default `#003737`}\n * @cssprop {<color>} --pf-c-popover--m-default__title-icon--Color\n *          Default alert icon color\n *          {@default `#009596`}\n * @cssprop {<color>} --pf-c-popover--m-info__title-text--Color\n *          Default alert heading color\n *          {@default `#002952`}\n * @cssprop {<color>} --pf-c-popover--m-info__title-icon--Color\n *          Default alert icon color\n *          {@default `#2b9af3`}\n * @cssprop {<color>} --pf-c-popover--m-warning__title-text--Color\n *          Default alert heading color\n *          {@default `#795600`}\n * @cssprop {<color>} --pf-c-popover--m-warning__title-icon--Color\n *          Default alert icon color\n *          {@default `#f0ab00`}\n * @cssprop {<color>} --pf-c-popover--m-success__title-text--Color\n *          Default alert heading color\n *          {@default `#1e4f18`}\n * @cssprop {<color>} --pf-c-popover--m-success__title-icon--Color\n *          Default alert icon color\n *          {@default `#3e8635`}\n * @cssprop {<color>} --pf-c-popover--m-danger__title-text--Color\n *          Default alert heading color\n *          {@default `#a30000`}\n * @cssprop {<color>} --pf-c-popover--m-danger__title-icon--Color\n *          Default alert icon color\n *          {@default `#c9190b`}\n */\n@customElement('pf-popover')\nexport class PfPopover extends LitElement {\n  static readonly styles = [styles];\n\n  private static instances = new Set<PfPopover>();\n\n  private static alertIcons = new Map(Object.entries({\n    default: 'bell',\n    info: 'circle-info',\n    success: 'circle-check',\n    warning: 'triangle-exclamation',\n    danger: 'circle-exclamation',\n  } satisfies Record<AlertSeverity, string>) as [AlertSeverity, string][]);\n\n  static {\n    document.addEventListener('click', function(event) {\n      for (const instance of PfPopover.instances) {\n        if (!instance.noOutsideClick) {\n          instance.#outsideClick(event);\n        }\n      }\n    });\n  }\n\n  /**\n   * Indicates the initial popover position.\n   * There are 12 options: `top`, `bottom`, `left`, `right`, `top-start`, `top-end`,\n   * `bottom-start`, `bottom-end`, `left-start`, `left-end`,`right-start`, `right-end`.\n   * The default is `top`.\n   */\n  @property({ reflect: true }) position: Placement = 'top';\n\n  /**\n   * The content rendered in the popover's heading.\n   */\n  @property({ reflect: true }) heading?: string;\n\n  /**\n   * The content rendered in the popover's body.\n   */\n  @property({ reflect: true }) body?: string;\n\n  /**\n   * The content rendered in the popover's footer.\n   */\n  @property({ reflect: true }) footer?: string;\n\n  /**\n   * The icon placed before the popover's heading.\n   */\n  @property({ reflect: true }) icon?: string;\n\n  /**\n   * The accessible label for the popover. This is required if the no heading is set.\n   */\n  @property({ reflect: true }) label?: string;\n\n  /**\n   * The distance to set between the popover and its trigger element.\n   */\n  @property({ type: Number, reflect: true }) distance?: number;\n\n  /**\n   * The flip order when flip is enabled and the initial position is not possible.\n   * There are 12 options: `top`, `bottom`, `left`, `right`, `top-start`, `top-end`,\n   * `bottom-start`, `bottom-end`, `left-start`, `left-end`,`right-start`, `right-end`.\n   * The default is [oppositePlacement], where only the opposite placement is tried.\n   */\n  @property({\n    attribute: 'flip-behavior',\n    converter: StringListConverter,\n  }) flipBehavior?: Placement[];\n\n  /**\n   * Disable the flip behavior. The default is `false`.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'no-flip' }) noFlip = false;\n\n  /**\n   * The heading level to use for the popover's header. The default is `h6`.\n   */\n  @property({ type: Number, reflect: true, attribute: 'heading-level' }) headingLevel?: HeadingLevel;\n\n  /**\n   * Indicates which icon set to use for the header's icon.\n   * The default is `fas` (Font Awesome Free Solid).\n   */\n  @property({ reflect: true, attribute: 'icon-set' }) iconSet?: string;\n\n  /**\n   * Hide the close button. The default is `false`.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-close' }) hideClose?: boolean;\n\n  /**\n   * Indicates the severity variant to use for the alert popover.\n   * There are five options: `default`, `info`, `warning`, `success`, and `danger`.\n   */\n  @property({ reflect: true, attribute: 'alert-severity' }) alertSeverity?: AlertSeverity;\n\n  /**\n   * The accessible label for the popover's close button. The default is `Close popover`.\n   */\n  @property({ reflect: true, attribute: 'accessible-close-label' }) accessibleCloseLabel?: string;\n\n  /**\n   * @deprecated do not use the color-palette attribute, which was added by mistake. use context-providing containers (e.g. rh-card) instead\n   */\n  @deprecation({ alias: 'accessible-close-label', attribute: 'close-label' }) closeButtonLabel?: string;\n\n  /**\n   * The text announced by the screen reader to indicate the popover's severity.\n   * The default is `${alertSeverity} alert:`.\n   */\n  @property({ reflect: true, attribute: 'alert-severity-text' }) alertSeverityText?: string;\n\n  /**\n   * Don't hide the popover when clicking ouside of it.\n   */\n  @property({\n    type: Boolean,\n    reflect: true,\n    attribute: 'no-outside-click',\n  }) noOutsideClick?: boolean;\n\n  /**\n   * The ID of the element to attach the popover to.\n   */\n  @property({ reflect: true }) trigger?: string;\n\n  @query('#popover') private _popover!: HTMLDialogElement;\n  @query('#trigger') private _slottedTrigger?: HTMLElement | null;\n  @query('#arrow') private _arrow!: HTMLDivElement;\n\n  /** True before the show animation begins and after the hide animation ends */\n  #hideDialog = true;\n\n  #referenceTrigger?: HTMLElement | null = null;\n\n  #float = new FloatingDOMController(this, {\n    content: () => this._popover,\n    arrow: () => this._arrow,\n    invoker: () => this.#referenceTrigger || this._slottedTrigger,\n  });\n\n  #slots = new SlotController(this, null, 'icon', 'heading', 'body', 'footer');\n\n  constructor() {\n    super();\n    this.addEventListener('keydown', this.#onKeydown);\n  }\n\n  render() {\n    const { alignment, anchor, styles } = this.#float;\n    const hasFooter = this.#slots.hasSlotted('footer') || !!this.footer;\n    const hasHeading = this.#slots.hasSlotted('heading') || !!this.heading;\n    const hasIcon = this.#slots.hasSlotted('icon') || !!this.icon || !!this.alertSeverity;\n\n    // https://github.com/asyncLiz/minify-html-literals/issues/37\n    let headingContent = html`<h6>${this.heading ?? ''}</h6>`;\n    switch (this.headingLevel) {\n      case 2: headingContent = html`<h2>${this.heading ?? ''}</h2>`; break;\n      case 3: headingContent = html`<h3>${this.heading ?? ''}</h3>`; break;\n      case 4: headingContent = html`<h4>${this.heading ?? ''}</h4>`; break;\n      case 5: headingContent = html`<h5>${this.heading ?? ''}</h5>`; break;\n    }\n\n    const headingSlotWithFallback = html`\n      <slot id=\"heading\" name=\"heading\" part=\"heading\" ?hidden=${!hasHeading}>${headingContent}</slot>\n    `;\n\n    const headerIcon = this.icon ?? PfPopover.alertIcons.get(this.alertSeverity as AlertSeverity) ?? '';\n\n    return html`\n      <div id=\"container\"\n           style=\"${styleMap(styles)}\"\n           class=\"${classMap({ [anchor]: !!anchor, [alignment]: !!alignment })}\">\n        <slot id=\"trigger\"\n              @slotchange=\"${this.#triggerChanged}\"\n              @keydown=\"${this.#onKeydown}\"\n              @click=\"${this.toggle}\"></slot>\n        <dialog id=\"popover\"\n                ?hidden=\"${this.#hideDialog}\"\n                aria-labelledby=\"heading\"\n                aria-describedby=\"body\"\n                aria-label=${ifDefined(this.label)}>\n          <div id=\"arrow\"></div>\n          <div id=\"content\" part=\"content\">\n            <pf-button id=\"close-button\"\n                       part=\"close-button\"\n                       plain\n                       label=\"${this.accessibleCloseLabel ?? this.closeButtonLabel ?? 'Close popover'}\"\n                       @click=\"${this.hide}\"\n                       @keydown=\"${this.#onKeydown}\"\n                       ?hidden=\"${this.hideClose}\">\n              <svg fill=\"currentColor\" height=\"1em\" width=\"1em\" viewBox=\"0 0 352 512\">\n                <path d=\"M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z\"/>\n              </svg>\n            </pf-button>\n            ${!(hasHeading && hasIcon) ? headingSlotWithFallback : html`\n            <header part=\"header\">\n              <span part=\"icon\">\n                <slot name=\"icon\">\n                  <pf-icon icon=\"${headerIcon}\"\n                           set=\"${ifDefined(this.iconSet)}\"\n                           size=\"md\"></pf-icon>\n                </slot>\n              </span>${!this.alertSeverity ? nothing : html`\n              <span class=\"visually-hidden\">${this.alertSeverityText ?? `${this.alertSeverity} alert:`}</span>`}\n              ${headingSlotWithFallback}\n            </header>`}\n            <slot id=\"body\" part=\"body\" name=\"body\">${this.body ?? ''}</slot>\n            <footer part=\"footer\" ?hidden=${!hasFooter}>\n              <slot name=\"footer\">${this.footer}</slot>\n            </footer>\n          </div>\n        </dialog>\n      </div>\n    `;\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    PfPopover.instances.delete(this);\n    this.#referenceTrigger?.removeEventListener('click', this.toggle);\n    this.#referenceTrigger?.removeEventListener('keydown', this.#onKeydown);\n  }\n\n  #getReferenceTrigger() {\n    const root = this.getRootNode() as Document | ShadowRoot;\n    return !this.trigger ? null : root.getElementById(this.trigger);\n  }\n\n  #triggerChanged() {\n    const oldReferenceTrigger = this.#referenceTrigger;\n    this.#referenceTrigger = this.#getReferenceTrigger();\n    if (oldReferenceTrigger !== this.#referenceTrigger) {\n      oldReferenceTrigger?.removeEventListener('click', this.toggle);\n      oldReferenceTrigger?.removeEventListener('keydown', this.#onKeydown);\n      this.#referenceTrigger?.addEventListener('click', this.toggle);\n      this.#referenceTrigger?.addEventListener('keydown', this.#onKeydown);\n    }\n  }\n\n  #onKeydown = (event: KeyboardEvent) => {\n    switch (event.key) {\n      case 'Escape':\n      case 'Esc':\n        event.preventDefault();\n        this.hide();\n        return;\n      case 'Enter':\n        if (event.target === this.#referenceTrigger || event.target === this._slottedTrigger) {\n          event.preventDefault();\n          this.show();\n        }\n        return;\n    }\n  };\n\n  #outsideClick(event: MouseEvent) {\n    const path = event.composedPath();\n    if (!path.includes(this) && !path.includes(this.#referenceTrigger as HTMLElement)) {\n      this.hide();\n    }\n  }\n\n  /**\n   * Removes event listeners from the old trigger element and attaches\n   * them to the new trigger element.\n   */\n  override willUpdate(changed: PropertyValues<this>) {\n    if (changed.has('trigger')) {\n      this.#triggerChanged();\n    }\n  }\n\n  /**\n   * Toggle the popover\n   */\n  @bound async toggle() {\n    this.#float.open ? this.hide() : this.show();\n  }\n\n  /**\n   * Opens the popover\n   */\n  @bound async show() {\n    this.#hideDialog = false;\n    this.requestUpdate();\n    this.dispatchEvent(new PopoverShowEvent());\n    await this.updateComplete;\n    await this.#float.show({\n      offset: this.distance ?? 25,\n      placement: this.position,\n      flip: !this.noFlip,\n      fallbackPlacements: this.flipBehavior,\n    });\n    this._popover?.show();\n    this.dispatchEvent(new PopoverShownEvent());\n    PfPopover.instances.add(this);\n  }\n\n  /**\n   * Closes the popover\n   */\n  @bound async hide() {\n    this.dispatchEvent(new PopoverHideEvent());\n    await this.#float.hide();\n    this._popover?.close();\n    this.dispatchEvent(new PopoverHiddenEvent());\n    PfPopover.instances.delete(this);\n    this.#hideDialog = true;\n    this.requestUpdate();\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-popover': PfPopover;\n  }\n}\n"]}
+{"version":3,"file":"pf-popover.js","sourceRoot":"","sources":["pf-popover.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, nothing, html, type PropertyValues } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\nimport { query } from 'lit/decorators/query.js';\nimport { styleMap } from 'lit/directives/style-map.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { FloatingDOMController } from '@patternfly/pfe-core/controllers/floating-dom-controller.js';\nimport { SlotController } from '@patternfly/pfe-core/controllers/slot-controller.js';\nimport { bound } from '@patternfly/pfe-core/decorators/bound.js';\nimport { ComposedEvent, StringListConverter } from '@patternfly/pfe-core/core.js';\nimport type { Placement } from '@patternfly/pfe-core/controllers/floating-dom-controller.js';\nimport '@patternfly/elements/pf-button/pf-button.js';\nimport styles from './pf-popover.css';\nimport { deprecation } from '@patternfly/pfe-core/decorators/deprecation.js';\n\nconst headingLevels = [2, 3, 4, 5, 6] as const;\n\ntype HeadingLevel = (typeof headingLevels)[number];\n\ntype AlertSeverity = 'default' | 'info' | 'warning' | 'success' | 'danger';\n\nexport class PopoverHideEvent extends ComposedEvent {\n  constructor() {\n    super('hide');\n  }\n}\n\nexport class PopoverHiddenEvent extends ComposedEvent {\n  constructor() {\n    super('hidden');\n  }\n}\n\nexport class PopoverShowEvent extends ComposedEvent {\n  constructor() {\n    super('show');\n  }\n}\n\nexport class PopoverShownEvent extends ComposedEvent {\n  constructor() {\n    super('shown');\n  }\n}\n\n/**\n * A **Popover** displays content in a non-modal dialog and adds contextual information or provides resources via text and links.\n * @summary Toggle the visibility of helpful or contextual information.\n * @slot -\n *         The default slot holds invoking element.\n *         Typically this would be an icon, button, or other small sized element.\n * @slot heading\n *       This slot renders the content that will be displayed inside of the header of the popover.\n *       Typically this would be a heading element.\n * @slot icon\n *       This slot renders the icon that will be displayed inside the header of the popover,\n *       before the heading.\n * @slot body\n *       This slot renders the content that will be displayed inside of the body of the popover.\n * @slot footer\n *       This slot renders the content that will be displayed inside of the footer of the popover.\n * @csspart container - The component wrapper\n * @csspart content - The content wrapper\n * @csspart header - The header element; only visible if both an icon annd heading are provided.\n * @csspart heading - The heading element\n * @csspart icon - The header icon\n * @csspart close-button - The close button\n * @csspart body - The container for the body content\n * @csspart footer - The container for the footer content\n * @cssprop {<length>} --pf-c-popover__arrow--Height\n *          Height of the arrow\n *          {@default `1.5625rem`}\n * @cssprop {<length>} --pf-c-popover__arrow--Width\n *          Width of the arrow\n *          {@default `1.5625rem`}\n * @cssprop {<color>} --pf-c-popover__title-text--Color\n *          Heading font color\n *          {@default `inherit`}\n * @cssprop {<color>} --pf-c-popover__title-icon--Color\n *          Heading icon font color\n *          {@default `#151515`}\n * @cssprop {<color>} --pf-c-popover__arrow--BackgroundColor\n *          Arrow background color\n *          {@default `#fff`}\n * @cssprop --pf-c-popover__arrow--BoxShadow\n *          Arrow box shadow\n *          {@default `0 0.5rem 1rem 0 rgba(3, 3, 3, 0.16), 0 0 0.375rem 0 rgba(3, 3, 3, 0.08)`}\n * @cssprop --pf-c-popover--BoxShadow\n *          Popover box shadow\n *          {@default `0 0.5rem 1rem 0 rgba(3, 3, 3, 0.16), 0 0 0.375rem 0 rgba(3, 3, 3, 0.08)`}\n * @cssprop {<length>} --pf-c-tooltip__content--PaddingTop\n *          Popover top padding\n *          {@default `1rem`}\n * @cssprop {<length>} --pf-c-tooltip__content--PaddingRight\n *          Popover right padding\n *          {@default `1rem`}\n * @cssprop {<length>} --pf-c-tooltip__content--PaddingBottom\n *          Popover bottom padding\n *          {@default `1rem`}\n * @cssprop {<length>} --pf-c-tooltip__content--PaddingLeft\n *          Popover left padding\n *          {@default `1rem`}\n * @cssprop {<number>} --pf-c-popover--line-height\n *          Popover line height\n *          {@default `1.5`}\n * @cssprop {<length>} --pf-c-popover__content--FontSize\n *          Popover font-size\n *          {@default `0.875rem`}\n * @cssprop {<color>} --pf-c-popover__content--BackgroundColor\n *          Popover background color\n *          {@default `#fff`}\n * @cssprop {<length>} --pf-c-popover--MaxWidth\n *          Popover max-width\n *          {@default `20.75rem`}\n * @cssprop {<length>} --pf-c-popover--MinWidth\n *          Popover min-width\n *          {@default `20.75rem`}\n * @cssprop {<number>} --pf-c-popover--c-button--Right\n *          Close button right position\n *          {@default `0}\n * @cssprop {<number>} --pf-c-popover--c-button--Top\n *          Close button top position\n *          {@default `0`}\n * @cssprop {<length>} --pf-c-popover--c-button--sibling--PaddingRight\n *          Padding between close button and its immediate sibling\n *          {@default `3rem`}\n * @cssprop {<length>} --pf-c-popover__title-icon--MarginRight\n *          Heading icon right margin\n *          {@default `0.5rem`}\n * @cssprop {<length>} --pf-c-popover__title--FontSize\n *          Header font-size\n *          {@default `1rem`}\n * @cssprop {<length>} --pf-c-popover__title--MarginBottom\n *          Header bottom margin\n *          {@default `0.5rem`}\n * @cssprop {<number>} --pf-c-popover__title--LineHeight\n *          Header line height\n *          {@default `1.5`}\n * @cssprop {<string>} --pf-c-popover__title--FontFamily\n *          Header font-family\n *          {@default `'RedHatDisplay', 'Overpass', overpass, helvetica, arial, sans-serif`}\n * @cssprop {<length>} --pf-c-popover__footer--MarginTop\n *          Footer top margin\n *          {@default `1rem`}\n * @cssprop {<color>} --pf-c-popover--m-default__title-text--Color\n *          Default alert heading color\n *          {@default `#003737`}\n * @cssprop {<color>} --pf-c-popover--m-default__title-icon--Color\n *          Default alert icon color\n *          {@default `#009596`}\n * @cssprop {<color>} --pf-c-popover--m-info__title-text--Color\n *          Default alert heading color\n *          {@default `#002952`}\n * @cssprop {<color>} --pf-c-popover--m-info__title-icon--Color\n *          Default alert icon color\n *          {@default `#2b9af3`}\n * @cssprop {<color>} --pf-c-popover--m-warning__title-text--Color\n *          Default alert heading color\n *          {@default `#795600`}\n * @cssprop {<color>} --pf-c-popover--m-warning__title-icon--Color\n *          Default alert icon color\n *          {@default `#f0ab00`}\n * @cssprop {<color>} --pf-c-popover--m-success__title-text--Color\n *          Default alert heading color\n *          {@default `#1e4f18`}\n * @cssprop {<color>} --pf-c-popover--m-success__title-icon--Color\n *          Default alert icon color\n *          {@default `#3e8635`}\n * @cssprop {<color>} --pf-c-popover--m-danger__title-text--Color\n *          Default alert heading color\n *          {@default `#a30000`}\n * @cssprop {<color>} --pf-c-popover--m-danger__title-icon--Color\n *          Default alert icon color\n *          {@default `#c9190b`}\n */\n@customElement('pf-popover')\nexport class PfPopover extends LitElement {\n  static readonly styles = [styles];\n\n  private static instances = new Set<PfPopover>();\n\n  private static alertIcons = new Map(Object.entries({\n    default: 'bell',\n    info: 'circle-info',\n    success: 'circle-check',\n    warning: 'triangle-exclamation',\n    danger: 'circle-exclamation',\n  } satisfies Record<AlertSeverity, string>) as [AlertSeverity, string][]);\n\n  static {\n    document.addEventListener('click', function(event) {\n      for (const instance of PfPopover.instances) {\n        if (!instance.noOutsideClick) {\n          instance.#outsideClick(event);\n        }\n      }\n    });\n  }\n\n  /**\n   * Indicates the initial popover position.\n   * There are 12 options: `top`, `bottom`, `left`, `right`, `top-start`, `top-end`,\n   * `bottom-start`, `bottom-end`, `left-start`, `left-end`,`right-start`, `right-end`.\n   * The default is `top`.\n   */\n  @property({ reflect: true }) position: Placement = 'top';\n\n  /**\n   * The content rendered in the popover's heading.\n   */\n  @property({ reflect: true }) heading?: string;\n\n  /**\n   * The content rendered in the popover's body.\n   */\n  @property({ reflect: true }) body?: string;\n\n  /**\n   * The content rendered in the popover's footer.\n   */\n  @property({ reflect: true }) footer?: string;\n\n  /**\n   * The icon placed before the popover's heading.\n   */\n  @property({ reflect: true }) icon?: string;\n\n  /**\n   * The accessible label for the popover. This is required if the no heading is set.\n   */\n  @property({ reflect: true }) label?: string;\n\n  /**\n   * The distance to set between the popover and its trigger element.\n   */\n  @property({ type: Number, reflect: true }) distance?: number;\n\n  /**\n   * The flip order when flip is enabled and the initial position is not possible.\n   * There are 12 options: `top`, `bottom`, `left`, `right`, `top-start`, `top-end`,\n   * `bottom-start`, `bottom-end`, `left-start`, `left-end`,`right-start`, `right-end`.\n   * The default is [oppositePlacement], where only the opposite placement is tried.\n   */\n  @property({\n    attribute: 'flip-behavior',\n    converter: StringListConverter,\n  }) flipBehavior?: Placement[];\n\n  /**\n   * Disable the flip behavior. The default is `false`.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'no-flip' }) noFlip = false;\n\n  /**\n   * The heading level to use for the popover's header. The default is `h6`.\n   */\n  @property({\n    type: Number,\n    reflect: true,\n    attribute: 'heading-level',\n  }) headingLevel?: HeadingLevel;\n\n  /**\n   * Indicates which icon set to use for the header's icon.\n   * The default is `fas` (Font Awesome Free Solid).\n   */\n  @property({ reflect: true, attribute: 'icon-set' }) iconSet?: string;\n\n  /**\n   * Hide the close button. The default is `false`.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-close' }) hideClose?: boolean;\n\n  /**\n   * Indicates the severity variant to use for the alert popover.\n   * There are five options: `default`, `info`, `warning`, `success`, and `danger`.\n   */\n  @property({ reflect: true, attribute: 'alert-severity' }) alertSeverity?: AlertSeverity;\n\n  /**\n   * The accessible label for the popover's close button. The default is `Close popover`.\n   */\n  @property({ reflect: true, attribute: 'accessible-close-label' }) accessibleCloseLabel?: string;\n\n  /**\n   * @deprecated do not use the color-palette attribute, which was added by mistake. use context-providing containers (e.g. rh-card) instead\n   */\n  @deprecation({\n    alias: 'accessible-close-label',\n    attribute: 'close-label',\n  }) closeButtonLabel?: string;\n\n  /**\n   * The text announced by the screen reader to indicate the popover's severity.\n   * The default is `${alertSeverity} alert:`.\n   */\n  @property({ reflect: true, attribute: 'alert-severity-text' }) alertSeverityText?: string;\n\n  /**\n   * Don't hide the popover when clicking ouside of it.\n   */\n  @property({\n    type: Boolean,\n    reflect: true,\n    attribute: 'no-outside-click',\n  }) noOutsideClick?: boolean;\n\n  /**\n   * The ID of the element to attach the popover to.\n   */\n  @property({ reflect: true }) trigger?: string;\n\n  @query('#popover') private _popover!: HTMLDialogElement;\n  @query('#trigger') private _slottedTrigger?: HTMLElement | null;\n  @query('#arrow') private _arrow!: HTMLDivElement;\n\n  /** True before the show animation begins and after the hide animation ends */\n  #hideDialog = true;\n\n  #referenceTrigger?: HTMLElement | null = null;\n\n  #float = new FloatingDOMController(this, {\n    content: () => this._popover,\n    arrow: () => this._arrow,\n    invoker: () => this.#referenceTrigger || this._slottedTrigger,\n  });\n\n  #slots = new SlotController(this, null, 'icon', 'heading', 'body', 'footer');\n\n  constructor() {\n    super();\n    this.addEventListener('keydown', this.#onKeydown);\n  }\n\n  render() {\n    const { alignment, anchor, styles } = this.#float;\n    const hasFooter = this.#slots.hasSlotted('footer') || !!this.footer;\n    const hasHeading = this.#slots.hasSlotted('heading') || !!this.heading;\n    const hasIcon = this.#slots.hasSlotted('icon') || !!this.icon || !!this.alertSeverity;\n\n    // https://github.com/asyncLiz/minify-html-literals/issues/37\n    let headingContent = html`<h6>${this.heading ?? ''}</h6>`;\n    switch (this.headingLevel) {\n      case 2: headingContent = html`<h2>${this.heading ?? ''}</h2>`; break;\n      case 3: headingContent = html`<h3>${this.heading ?? ''}</h3>`; break;\n      case 4: headingContent = html`<h4>${this.heading ?? ''}</h4>`; break;\n      case 5: headingContent = html`<h5>${this.heading ?? ''}</h5>`; break;\n    }\n\n    const headingSlotWithFallback = html`\n      <slot id=\"heading\" name=\"heading\" part=\"heading\" ?hidden=${!hasHeading}>${headingContent}</slot>\n    `;\n\n    const headerIcon = this.icon\n      ?? PfPopover.alertIcons.get(this.alertSeverity as AlertSeverity)\n      ?? '';\n\n    return html`\n      <div id=\"container\"\n           style=\"${styleMap(styles)}\"\n           class=\"${classMap({ [anchor]: !!anchor, [alignment]: !!alignment })}\">\n        <slot id=\"trigger\"\n              @slotchange=\"${this.#triggerChanged}\"\n              @keydown=\"${this.#onKeydown}\"\n              @click=\"${this.toggle}\"></slot>\n        <dialog id=\"popover\"\n                ?hidden=\"${this.#hideDialog}\"\n                aria-labelledby=\"heading\"\n                aria-describedby=\"body\"\n                aria-label=${ifDefined(this.label)}>\n          <div id=\"arrow\"></div>\n          <div id=\"content\" part=\"content\">\n            <pf-button id=\"close-button\"\n                       part=\"close-button\"\n                       plain\n                       label=\"${this.accessibleCloseLabel ?? this.closeButtonLabel ?? 'Close popover'}\"\n                       @click=\"${this.hide}\"\n                       @keydown=\"${this.#onKeydown}\"\n                       ?hidden=\"${this.hideClose}\">\n              <svg fill=\"currentColor\" height=\"1em\" width=\"1em\" viewBox=\"0 0 352 512\">\n                <path d=\"M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z\"/>\n              </svg>\n            </pf-button>\n            ${!(hasHeading && hasIcon) ? headingSlotWithFallback : html`\n            <header part=\"header\">\n              <span part=\"icon\">\n                <slot name=\"icon\">\n                  <pf-icon icon=\"${headerIcon}\"\n                           set=\"${ifDefined(this.iconSet)}\"\n                           size=\"md\"></pf-icon>\n                </slot>\n              </span>${!this.alertSeverity ? nothing : html`\n              <span class=\"visually-hidden\">${this.alertSeverityText ?? `${this.alertSeverity} alert:`}</span>`}\n              ${headingSlotWithFallback}\n            </header>`}\n            <slot id=\"body\" part=\"body\" name=\"body\">${this.body ?? ''}</slot>\n            <footer part=\"footer\" ?hidden=${!hasFooter}>\n              <slot name=\"footer\">${this.footer}</slot>\n            </footer>\n          </div>\n        </dialog>\n      </div>\n    `;\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    PfPopover.instances.delete(this);\n    this.#referenceTrigger?.removeEventListener('click', this.toggle);\n    this.#referenceTrigger?.removeEventListener('keydown', this.#onKeydown);\n  }\n\n  #getReferenceTrigger() {\n    const root = this.getRootNode() as Document | ShadowRoot;\n    return !this.trigger ? null : root.getElementById(this.trigger);\n  }\n\n  #triggerChanged() {\n    const oldReferenceTrigger = this.#referenceTrigger;\n    this.#referenceTrigger = this.#getReferenceTrigger();\n    if (oldReferenceTrigger !== this.#referenceTrigger) {\n      oldReferenceTrigger?.removeEventListener('click', this.toggle);\n      oldReferenceTrigger?.removeEventListener('keydown', this.#onKeydown);\n      this.#referenceTrigger?.addEventListener('click', this.toggle);\n      this.#referenceTrigger?.addEventListener('keydown', this.#onKeydown);\n    }\n  }\n\n  #onKeydown = (event: KeyboardEvent) => {\n    switch (event.key) {\n      case 'Escape':\n      case 'Esc':\n        event.preventDefault();\n        this.hide();\n        return;\n      case 'Enter':\n        if (event.target === this.#referenceTrigger || event.target === this._slottedTrigger) {\n          event.preventDefault();\n          this.show();\n        }\n        return;\n    }\n  };\n\n  #outsideClick(event: MouseEvent) {\n    const path = event.composedPath();\n    if (!path.includes(this) && !path.includes(this.#referenceTrigger as HTMLElement)) {\n      this.hide();\n    }\n  }\n\n  /**\n   * Removes event listeners from the old trigger element and attaches\n   * them to the new trigger element.\n   */\n  override willUpdate(changed: PropertyValues<this>) {\n    if (changed.has('trigger')) {\n      this.#triggerChanged();\n    }\n  }\n\n  /**\n   * Toggle the popover\n   */\n  @bound async toggle() {\n    this.#float.open ? this.hide() : this.show();\n  }\n\n  /**\n   * Opens the popover\n   */\n  @bound async show() {\n    this.#hideDialog = false;\n    this.requestUpdate();\n    this.dispatchEvent(new PopoverShowEvent());\n    await this.updateComplete;\n    await this.#float.show({\n      offset: this.distance ?? 25,\n      placement: this.position,\n      flip: !this.noFlip,\n      fallbackPlacements: this.flipBehavior,\n    });\n    this._popover?.show();\n    this.dispatchEvent(new PopoverShownEvent());\n    PfPopover.instances.add(this);\n  }\n\n  /**\n   * Closes the popover\n   */\n  @bound async hide() {\n    this.dispatchEvent(new PopoverHideEvent());\n    await this.#float.hide();\n    this._popover?.close();\n    this.dispatchEvent(new PopoverHiddenEvent());\n    PfPopover.instances.delete(this);\n    this.#hideDialog = true;\n    this.requestUpdate();\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-popover': PfPopover;\n  }\n}\n"]}

package/pf-popover/test/pf-popover.e2e.d.ts

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

package/pf-popover/test/pf-popover.e2e.js

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

package/pf-popover/test/pf-popover.e2e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pf-popover.e2e.js","sourceRoot":"","sources":["pf-popover.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,sDAAsD,CAAC;AAEnF,MAAM,OAAO,GAAG,YAAY,CAAC;AAE7B,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-popover';\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-popover/test/pf-popover.spec.d.ts

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