diff --git a/src/components/popover/popover.e2e.ts b/src/components/popover/popover.e2e.ts index 59550c27468..fb61400c75a 100644 --- a/src/components/popover/popover.e2e.ts +++ b/src/components/popover/popover.e2e.ts @@ -37,10 +37,6 @@ describe("calcite-popover", () => { it("is accessible when open", async () => accessible(`
😄
`)); - it("is accessible with close button (deprecated)", async () => - accessible( - `
😄
` - )); it("is accessible with close button", async () => accessible( `
😄
` @@ -70,10 +66,6 @@ describe("calcite-popover", () => { propertyName: "open", defaultValue: false }, - { - propertyName: "dismissible", - defaultValue: false - }, { propertyName: "closable", defaultValue: false @@ -195,28 +187,6 @@ describe("calcite-popover", () => { expect(computedStyle.transform).not.toBe("matrix(0, 0, 0, 0, 0, 0)"); }); - it("should show closeButton when enabled (deprecated)", async () => { - const page = await newE2EPage(); - - await page.setContent( - `content
referenceElement
` - ); - - await page.waitForChanges(); - - let closeButton = await page.find(`calcite-popover >>> .${CSS.closeButton}`); - - expect(closeButton).toBe(null); - - const element = await page.find("calcite-popover"); - - element.setProperty("dismissible", true); - - await page.waitForChanges(); - - closeButton = await page.find(`calcite-popover >>> .${CSS.closeButton}`); - }); - it("should show closeButton when enabled with closable prop", async () => { const page = await newE2EPage(); @@ -684,28 +654,6 @@ describe("calcite-popover", () => { expect(await shadowPopover.getProperty("open")).toBe(false); }); - it("should set dismissible prop to true when closable is true", async () => { - const page = await newE2EPage(); - - await page.setContent( - html` -

- Popover content here -

-
` - ); - - await page.waitForChanges(); - const popoverEl = await page.find("calcite-popover"); - - expect(await popoverEl.getProperty("closable")).toBe(true); - - popoverEl.setProperty("dismissible", false); - await page.waitForChanges(); - - expect(await popoverEl.getProperty("closable")).toBe(false); - }); - it("should still function when disconnected and reconnected", async () => { const page = await newE2EPage(); diff --git a/src/components/popover/popover.stories.ts b/src/components/popover/popover.stories.ts index 97849916576..625bd46941c 100644 --- a/src/components/popover/popover.stories.ts +++ b/src/components/popover/popover.stories.ts @@ -29,7 +29,7 @@ export const simple = (): string => html`
${referenceElementHTML} html` export const darkThemeRTL_TestOnly = (): string => html`
${referenceElementHTML} html`
${referenceElementHTML} html`
${nestedReferenceElementHTML}
${contentHTML} diff --git a/src/components/popover/popover.tsx b/src/components/popover/popover.tsx index 0db0f9ed315..8ac361006ac 100644 --- a/src/components/popover/popover.tsx +++ b/src/components/popover/popover.tsx @@ -78,33 +78,9 @@ export class Popover */ @Prop({ reflect: true }) autoClose = false; - /** - * When `true`, a close button is added to the component. - * - * @deprecated use dismissible instead. - */ - @Prop({ reflect: true }) closeButton = false; - - /** - * When `true`, a close button is added to the component. - * - * @deprecated use `closable` instead. - */ - @Prop({ mutable: true, reflect: true }) dismissible = false; - - @Watch("dismissible") - handleDismissible(value: boolean): void { - this.closable = value; - } - /** When `true`, display a close button within the component. */ @Prop({ mutable: true, reflect: true }) closable = false; - @Watch("closable") - handleClosable(value: boolean): void { - this.dismissible = value; - } - /** * When `true`, prevents flipping the component's placement when overlapping its `referenceElement`. */ @@ -274,13 +250,6 @@ export class Popover connectedCallback(): void { this.setFilteredPlacements(); connectOpenCloseComponent(this); - const closable = this.closable || this.dismissible; - if (closable) { - this.handleDismissible(closable); - } - if (closable) { - this.handleClosable(closable); - } this.setUpReferenceElement(this.hasLoaded); } @@ -526,9 +495,9 @@ export class Popover // -------------------------------------------------------------------------- renderCloseButton(): VNode { - const { closeButton, intlClose, closable } = this; + const { intlClose, closable } = this; - return closable || closeButton ? ( + return closable ? (