@patternfly/elements 4.2.0 → 4.3.0

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

@@ -1 +1 @@
-{"version":3,"file":"pf-modal.js","sourceRoot":"","sources":["pf-modal.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, type TemplateResult } 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 { ifDefined } from 'lit/directives/if-defined.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { ComposedEvent } from '@patternfly/pfe-core';\nimport { bound, initializer, observes } from '@patternfly/pfe-core/decorators.js';\nimport { getRandomId } from '@patternfly/pfe-core/functions/random.js';\n\nimport { SlotController } from '@patternfly/pfe-core/controllers/slot-controller.js';\n\nimport style from './pf-modal.css';\n\nexport class ModalCancelEvent extends ComposedEvent {\n  constructor() {\n    super('cancel');\n  }\n}\n\nexport class ModalCloseEvent extends ComposedEvent {\n  constructor() {\n    super('close');\n  }\n}\n\nexport class ModalOpenEvent extends ComposedEvent {\n  constructor(\n    /** The trigger element which triggered the modal to open */\n    public trigger: HTMLElement | null\n  ) {\n    super('open');\n  }\n}\n\n/**\n * A **modal** displays important information to a user without requiring them to navigate\n * to a new page.\n * @summary Displays information or helps a user focus on a task\n * @alias Modal\n * @fires {ModalOpenEvent} open - Fires when a user clicks on the trigger or manually opens a modal.\n * @fires {ModalCloseEvent} close - Fires when either a user clicks on either the close button or the overlay or manually closes a modal.\n */\n@customElement('pf-modal')\nexport class PfModal extends LitElement implements HTMLDialogElement {\n  static override readonly shadowRootOptions: ShadowRootInit = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  static readonly styles: CSSStyleSheet[] = [style];\n\n  /** Should the dialog close when user clicks outside the dialog? */\n  protected static closeOnOutsideClick = false;\n\n  /**\n   * The `variant` controls the width of the modal.\n   * There are three options: `small`, `medium` and `large`. The default is `large`.\n   */\n  @property({ reflect: true }) variant?: 'small' | 'medium' | 'large';\n\n  /**\n   * `position=\"top\"` aligns the dialog with the top of the page\n   */\n  @property({ reflect: true }) position?: 'top';\n\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  /** Optional ID of the trigger element */\n  @property() trigger?: string;\n\n  /** @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/returnValue */\n  public returnValue = '';\n\n  @query('#overlay') private overlay?: HTMLElement | null;\n  @query('#dialog') private dialog?: HTMLElement | null;\n  @query('#close-button') private closeButton?: HTMLElement | null;\n\n  #headerId = getRandomId();\n  #triggerElement: HTMLElement | null = null;\n  #header: HTMLElement | null = null;\n  #body: Element[] = [];\n  #headings: Element[] = [];\n  #cancelling = false;\n\n  #slots = new SlotController(this, null, 'header', 'description', 'footer');\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.addEventListener('keydown', this.onKeydown);\n    this.addEventListener('click', this.onClick);\n  }\n\n  render(): TemplateResult<1> {\n    const headerId = (this.#header || this.#headings.length) ? this.#headerId : undefined;\n    const headerLabel = this.#triggerElement ? this.#triggerElement.innerText : undefined;\n    const hasHeader = this.#slots.hasSlotted('header');\n    const hasDescription = this.#slots.hasSlotted('description');\n    const hasFooter = this.#slots.hasSlotted('footer');\n\n    return html`\n      <section ?hidden=${!this.open}>\n        <!-- summary: The modal overlay which lies under the dialog and above the page body -->\n        <div id=\"overlay\" part=\"overlay\" ?hidden=${!this.open}></div>\n        <!-- summary: The dialog element -->\n        <div id=\"dialog\"\n            part=\"dialog\"\n            tabindex=\"0\"\n            role=\"dialog\"\n            aria-labelledby=${ifDefined(headerId)}\n            aria-label=${ifDefined(headerLabel)}\n            ?hidden=\"${!this.open}\">\n          <div id=\"container\">\n            <!-- summary: The container for the dialog content -->\n            <div id=\"content\" part=\"content\" class=${classMap({ hasHeader, hasDescription, hasFooter })}>\n              <!-- summary: The container for the optional dialog header -->\n              <header part=\"header\">\n                <!-- summary: Heading tag\n                     description: |\n                       The header is an optional slot that appears at the top of the modal window.\n                       It should be a heading tag (h2-h6). -->\n                <slot name=\"header\"></slot>\n                <!-- summary: The container for the optional dialog description in the header -->\n                <div part=\"description\" ?hidden=${!hasDescription}>\n                  <slot name=\"description\"></slot>\n                </div>\n              </header>\n              <!--\n                summary: Modal dialog content\n                description: |\n                  The default slot can contain any type of content. When the header is not present,\n                  this unnamed slot appear at the top of the modal window (to the left of the close\n                  button). Otherwise it will appear beneath the header. -->\n              <slot></slot>\n              <!-- summary: Actions footer container -->\n              <footer ?hidden=${!hasFooter} part=\"footer\">\n                <!-- summary: Optional footer content. Good place to put action buttons. -->\n                <slot name=\"footer\"></slot>\n              </footer>\n            </div>\n            <!-- summary: The modal's close button -->\n            <button id=\"close-button\"\n                part=\"close-button\"\n                aria-label=\"Close dialog\"\n                @keydown=${this.onKeydown}\n                @click=${this.close}>\n              <svg fill=\"currentColor\" 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\"></path>\n              </svg>\n            </button>\n          </div>\n        </div>\n      </section>\n    `;\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n\n    this.removeEventListener('keydown', this.onKeydown);\n\n    this.#triggerElement?.removeEventListener('click', this.onTriggerClick);\n  }\n\n  @initializer()\n  protected async _init(): Promise<void> {\n    await this.updateComplete;\n    this.#header = this.querySelector(`[slot$=\"header\"]`);\n    this.#body = [...this.querySelectorAll(`*:not([slot])`)];\n    this.#headings = this.#body.filter(el => el.tagName.slice(0, 1) === 'H');\n\n    if (this.#triggerElement) {\n      this.#triggerElement.addEventListener('click', this.onTriggerClick);\n      this.removeAttribute('hidden');\n    }\n\n    if (this.#header) {\n      this.#header.id = this.#headerId;\n    } else if (this.#headings.length > 0) {\n      // Get the first heading in the modal if it exists\n      this.#headings[0].id = this.#headerId;\n    }\n  }\n\n  @observes('open')\n  protected async openChanged(oldValue?: boolean, newValue?: boolean): Promise<void> {\n    // loosening types to prevent running these effects in unexpected circumstances\n    // eslint-disable-next-line eqeqeq\n    if (oldValue == null || newValue == null || oldValue == newValue) {\n      return;\n    } else if (this.open) {\n      // This prevents background scroll\n      document.body.style.overflow = 'hidden';\n      await this.updateComplete;\n      // Set the focus to the container\n      this.dialog?.focus();\n      this.dispatchEvent(new ModalOpenEvent(this.#triggerElement));\n    } else {\n      // Return scrollability\n      document.body.style.overflow = 'auto';\n\n      await this.updateComplete;\n\n      if (this.#triggerElement) {\n        this.#triggerElement.focus();\n      }\n\n      this.dispatchEvent(this.#cancelling ? new ModalCancelEvent() : new ModalCloseEvent());\n    }\n  }\n\n  @observes('trigger')\n  protected triggerChanged(): void {\n    if (this.trigger) {\n      this.#triggerElement = (this.getRootNode() as Document | ShadowRoot)\n          .getElementById(this.trigger);\n      this.#triggerElement?.addEventListener('click', this.onTriggerClick);\n    }\n  }\n\n  @bound private onTriggerClick(event: MouseEvent) {\n    event.preventDefault();\n    // TODO: in non-modal case, toggle the dialog\n    this.showModal();\n  }\n\n  @bound private onClick(event: MouseEvent) {\n    const { open, overlay, dialog } = this;\n    if (open) {\n      const path = event.composedPath();\n      const { closeOnOutsideClick } = this.constructor as typeof PfModal;\n\n      if (closeOnOutsideClick && path.includes(overlay!) && !path.includes(dialog!)) {\n        event.preventDefault();\n        this.cancel();\n      }\n    }\n  }\n\n  @bound private onKeydown(event: KeyboardEvent) {\n    switch (event.key) {\n      case 'Tab':\n        if (event.target === this.closeButton) {\n          event.preventDefault();\n          this.dialog?.focus();\n        }\n        return;\n      case 'Escape':\n      case 'Esc':\n        event.preventDefault();\n        this.cancel();\n        return;\n      case 'Enter':\n        if (event.target === this.#triggerElement) {\n          event.preventDefault();\n          this.showModal();\n        }\n        return;\n    }\n  }\n\n  private async cancel() {\n    this.#cancelling = true;\n    this.open = false;\n    await this.updateComplete;\n    this.#cancelling = false;\n  }\n\n  setTrigger(element: HTMLElement): void {\n    this.#triggerElement = element;\n    this.#triggerElement.addEventListener('click', this.onTriggerClick);\n  }\n\n  /**\n   * Manually toggles the modal.\n   * ```js\n   * modal.toggle();\n   * ```\n   */\n  @bound toggle(): void {\n    this.open = !this.open;\n  }\n\n  /**\n   * Manually opens the modal.\n   * ```js\n   * modal.open();\n   * ```\n   */\n  @bound show(): void {\n    this.open = true;\n  }\n\n  @bound showModal(): void {\n    // TODO: non-modal mode\n    this.show();\n  }\n\n  /**\n   * Manually closes the modal.\n   * ```js\n   * modal.close();\n   * ```\n   * @param returnValue dialog return value\n   */\n  @bound close(returnValue?: string): void {\n    if (typeof returnValue === 'string') {\n      this.returnValue = returnValue;\n    }\n\n    this.open = false;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-modal': PfModal;\n  }\n}\n"]}
+{"version":3,"file":"pf-modal.js","sourceRoot":"","sources":["pf-modal.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, type TemplateResult } 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 { ifDefined } from 'lit/directives/if-defined.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { ComposedEvent } from '@patternfly/pfe-core';\nimport { bound, initializer, observes } from '@patternfly/pfe-core/decorators.js';\nimport { getRandomId } from '@patternfly/pfe-core/functions/random.js';\n\nimport { SlotController } from '@patternfly/pfe-core/controllers/slot-controller.js';\n\nimport style from './pf-modal.css';\n\nexport class ModalCancelEvent extends ComposedEvent {\n  constructor() {\n    super('cancel');\n  }\n}\n\nexport class ModalCloseEvent extends ComposedEvent {\n  constructor() {\n    super('close');\n  }\n}\n\nexport class ModalOpenEvent extends ComposedEvent {\n  constructor(\n    /** The trigger element which triggered the modal to open */\n    public trigger: HTMLElement | null\n  ) {\n    super('open');\n  }\n}\n\n/**\n * A **modal** displays important information to a user without requiring them to navigate\n * to a new page.\n * @summary Displays information or helps a user focus on a task\n * @alias Modal\n * @fires {ModalOpenEvent} open - Fires when a user clicks on the trigger or manually opens a modal.\n * @fires {ModalCloseEvent} close - Fires when either a user clicks on either the close button or the overlay or manually closes a modal.\n */\n@customElement('pf-modal')\nexport class PfModal extends LitElement {\n  static override readonly shadowRootOptions: ShadowRootInit = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  static readonly styles: CSSStyleSheet[] = [style];\n\n  /** Should the dialog close when user clicks outside the dialog? */\n  protected static closeOnOutsideClick = false;\n\n  /**\n   * The `variant` controls the width of the modal.\n   * There are three options: `small`, `medium` and `large`. The default is `large`.\n   */\n  @property({ reflect: true }) variant?: 'small' | 'medium' | 'large';\n\n  /**\n   * `position=\"top\"` aligns the dialog with the top of the page\n   */\n  @property({ reflect: true }) position?: 'top';\n\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  /** Optional ID of the trigger element */\n  @property() trigger?: string;\n\n  /** @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/returnValue */\n  public returnValue = '';\n\n  @query('#overlay') private overlay?: HTMLElement | null;\n  @query('#dialog') private dialog?: HTMLElement | null;\n  @query('#close-button') private closeButton?: HTMLElement | null;\n\n  #headerId = getRandomId();\n  #triggerElement: HTMLElement | null = null;\n  #header: HTMLElement | null = null;\n  #body: Element[] = [];\n  #headings: Element[] = [];\n  #cancelling = false;\n\n  #slots = new SlotController(this, null, 'header', 'description', 'footer');\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.addEventListener('keydown', this.onKeydown);\n    this.addEventListener('click', this.onClick);\n  }\n\n  render(): TemplateResult<1> {\n    const headerId = (this.#header || this.#headings.length) ? this.#headerId : undefined;\n    const headerLabel = this.#triggerElement ? this.#triggerElement.innerText : undefined;\n    const hasHeader = this.#slots.hasSlotted('header');\n    const hasDescription = this.#slots.hasSlotted('description');\n    const hasFooter = this.#slots.hasSlotted('footer');\n\n    return html`\n      <section ?hidden=${!this.open}>\n        <!-- summary: The modal overlay which lies under the dialog and above the page body -->\n        <div id=\"overlay\" part=\"overlay\" ?hidden=${!this.open}></div>\n        <!-- summary: The dialog element -->\n        <div id=\"dialog\"\n            part=\"dialog\"\n            tabindex=\"0\"\n            role=\"dialog\"\n            aria-labelledby=${ifDefined(headerId)}\n            aria-label=${ifDefined(headerLabel)}\n            ?hidden=\"${!this.open}\">\n          <div id=\"container\">\n            <!-- summary: The container for the dialog content -->\n            <div id=\"content\" part=\"content\" class=${classMap({ hasHeader, hasDescription, hasFooter })}>\n              <!-- summary: The container for the optional dialog header -->\n              <header part=\"header\">\n                <!-- summary: Heading tag\n                     description: |\n                       The header is an optional slot that appears at the top of the modal window.\n                       It should be a heading tag (h2-h6). -->\n                <slot name=\"header\"></slot>\n                <!-- summary: The container for the optional dialog description in the header -->\n                <div part=\"description\" ?hidden=${!hasDescription}>\n                  <slot name=\"description\"></slot>\n                </div>\n              </header>\n              <!--\n                summary: Modal dialog content\n                description: |\n                  The default slot can contain any type of content. When the header is not present,\n                  this unnamed slot appear at the top of the modal window (to the left of the close\n                  button). Otherwise it will appear beneath the header. -->\n              <slot></slot>\n              <!-- summary: Actions footer container -->\n              <footer ?hidden=${!hasFooter} part=\"footer\">\n                <!-- summary: Optional footer content. Good place to put action buttons. -->\n                <slot name=\"footer\"></slot>\n              </footer>\n            </div>\n            <!-- summary: The modal's close button -->\n            <button id=\"close-button\"\n                part=\"close-button\"\n                aria-label=\"Close dialog\"\n                @keydown=${this.onKeydown}\n                @click=${this.close}>\n              <svg fill=\"currentColor\" 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\"></path>\n              </svg>\n            </button>\n          </div>\n        </div>\n      </section>\n    `;\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n\n    this.removeEventListener('keydown', this.onKeydown);\n\n    this.#triggerElement?.removeEventListener('click', this.onTriggerClick);\n  }\n\n  @initializer()\n  protected async _init(): Promise<void> {\n    await this.updateComplete;\n    this.#header = this.querySelector(`[slot$=\"header\"]`);\n    this.#body = [...this.querySelectorAll(`*:not([slot])`)];\n    this.#headings = this.#body.filter(el => el.tagName.slice(0, 1) === 'H');\n\n    if (this.#triggerElement) {\n      this.#triggerElement.addEventListener('click', this.onTriggerClick);\n      this.removeAttribute('hidden');\n    }\n\n    if (this.#header) {\n      this.#header.id = this.#headerId;\n    } else if (this.#headings.length > 0) {\n      // Get the first heading in the modal if it exists\n      this.#headings[0].id = this.#headerId;\n    }\n  }\n\n  @observes('open')\n  protected async openChanged(oldValue?: boolean, newValue?: boolean): Promise<void> {\n    // loosening types to prevent running these effects in unexpected circumstances\n    // eslint-disable-next-line eqeqeq\n    if (oldValue == null || newValue == null || oldValue == newValue) {\n      return;\n    } else if (this.open) {\n      // This prevents background scroll\n      document.body.style.overflow = 'hidden';\n      await this.updateComplete;\n      // Set the focus to the container\n      this.dialog?.focus();\n      this.dispatchEvent(new ModalOpenEvent(this.#triggerElement));\n    } else {\n      // Return scrollability\n      document.body.style.overflow = 'auto';\n\n      await this.updateComplete;\n\n      if (this.#triggerElement) {\n        this.#triggerElement.focus();\n      }\n\n      this.dispatchEvent(this.#cancelling ? new ModalCancelEvent() : new ModalCloseEvent());\n    }\n  }\n\n  @observes('trigger')\n  protected triggerChanged(): void {\n    if (this.trigger) {\n      this.#triggerElement = (this.getRootNode() as Document | ShadowRoot)\n          .getElementById(this.trigger);\n      this.#triggerElement?.addEventListener('click', this.onTriggerClick);\n    }\n  }\n\n  @bound private onTriggerClick(event: MouseEvent) {\n    event.preventDefault();\n    // TODO: in non-modal case, toggle the dialog\n    this.showModal();\n  }\n\n  @bound private onClick(event: MouseEvent) {\n    const { open, overlay, dialog } = this;\n    if (open) {\n      const path = event.composedPath();\n      const { closeOnOutsideClick } = this.constructor as typeof PfModal;\n\n      if (closeOnOutsideClick && path.includes(overlay!) && !path.includes(dialog!)) {\n        event.preventDefault();\n        this.cancel();\n      }\n    }\n  }\n\n  @bound private onKeydown(event: KeyboardEvent) {\n    switch (event.key) {\n      case 'Tab':\n        if (event.target === this.closeButton) {\n          event.preventDefault();\n          this.dialog?.focus();\n        }\n        return;\n      case 'Escape':\n      case 'Esc':\n        event.preventDefault();\n        this.cancel();\n        return;\n      case 'Enter':\n        if (event.target === this.#triggerElement) {\n          event.preventDefault();\n          this.showModal();\n        }\n        return;\n    }\n  }\n\n  private async cancel() {\n    this.#cancelling = true;\n    this.open = false;\n    await this.updateComplete;\n    this.#cancelling = false;\n  }\n\n  setTrigger(element: HTMLElement): void {\n    this.#triggerElement = element;\n    this.#triggerElement.addEventListener('click', this.onTriggerClick);\n  }\n\n  /**\n   * Manually toggles the modal.\n   * ```js\n   * modal.toggle();\n   * ```\n   */\n  @bound toggle(): void {\n    this.open = !this.open;\n  }\n\n  /**\n   * Manually opens the modal.\n   * ```js\n   * modal.open();\n   * ```\n   */\n  @bound show(): void {\n    this.open = true;\n  }\n\n  @bound showModal(): void {\n    // TODO: non-modal mode\n    this.show();\n  }\n\n  /**\n   * Manually closes the modal.\n   * ```js\n   * modal.close();\n   * ```\n   * @param returnValue dialog return value\n   */\n  @bound close(returnValue?: string): void {\n    if (typeof returnValue === 'string') {\n      this.returnValue = returnValue;\n    }\n\n    this.open = false;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-modal': PfModal;\n  }\n}\n"]}

package/pf-panel/pf-panel.js

@@ -231,7 +231,7 @@ let PfPanel = class PfPanel extends LitElement {
 };
 _PfPanel_slots = new WeakMap();
 PfPanel.styles = [styles];
-PfPanel.version = "4.2.0";
+PfPanel.version = "4.3.0";
 __decorate([
     property({ type: Boolean, reflect: true })
 ], PfPanel.prototype, "scrollable", void 0);

package/pf-popover/pf-popover.js

@@ -508,7 +508,7 @@ PfPopover.alertIcons = new Map(Object.entries({
         });
     }
 })();
-PfPopover.version = "4.2.0";
+PfPopover.version = "4.3.0";
 __decorate([
     property({ reflect: true })
 ], PfPopover.prototype, "position", void 0);

package/pf-progress/pf-progress.js

@@ -330,7 +330,7 @@ _PfProgress_icon_get = function _PfProgress_icon_get() {
     return ICONS.get(this.variant ?? '')?.icon;
 };
 PfProgress.styles = [styles];
-PfProgress.version = "4.2.0";
+PfProgress.version = "4.3.0";
 __decorate([
     property({ reflect: true, type: Number })
 ], PfProgress.prototype, "value", void 0);

package/pf-progress-stepper/pf-progress-step.js

@@ -177,7 +177,7 @@ _PfProgressStep_slots = new WeakMap();
 _PfProgressStep_internals = new WeakMap();
 PfProgressStep.parentTagName = 'pf-progress-stepper';
 PfProgressStep.styles = [style];
-PfProgressStep.version = "4.2.0";
+PfProgressStep.version = "4.3.0";
 __decorate([
     property()
 ], PfProgressStep.prototype, "description", void 0);

package/pf-progress-stepper/pf-progress-stepper.js

@@ -376,7 +376,7 @@ _PfProgressStepper_onMutation = function _PfProgressStepper_onMutation() {
 PfProgressStepper.childTagName = 'pf-progress-step';
 PfProgressStepper.styles = [style];
 PfProgressStepper.formAssociated = true;
-PfProgressStepper.version = "4.2.0";
+PfProgressStepper.version = "4.3.0";
 __decorate([
     property({ type: Boolean, reflect: true })
 ], PfProgressStepper.prototype, "vertical", void 0);

package/pf-search-input/pf-search-input.js

@@ -580,7 +580,7 @@ PfSearchInput.shadowRootOptions = {
     ...LitElement.shadowRootOptions,
     delegatesFocus: true,
 };
-PfSearchInput.version = "4.2.0";
+PfSearchInput.version = "4.3.0";
 __decorate([
     property({ attribute: 'accessible-label' })
 ], PfSearchInput.prototype, "accessibleLabel", void 0);

package/pf-select/pf-option-group.js

@@ -55,7 +55,7 @@ let PfOptionGroup = class PfOptionGroup extends LitElement {
 };
 _PfOptionGroup_internals = new WeakMap();
 PfOptionGroup.styles = [styles];
-PfOptionGroup.version = "4.2.0";
+PfOptionGroup.version = "4.3.0";
 __decorate([
     property()
 ], PfOptionGroup.prototype, "label", void 0);

package/pf-select/pf-option.js

@@ -182,7 +182,7 @@ let PfOption = class PfOption extends LitElement {
 _PfOption_value = new WeakMap();
 _PfOption_internals = new WeakMap();
 PfOption.styles = [styles];
-PfOption.version = "4.2.0";
+PfOption.version = "4.3.0";
 __decorate([
     property({ type: Boolean, reflect: true })
 ], PfOption.prototype, "disabled", void 0);

package/pf-select/pf-select.js

@@ -838,7 +838,7 @@ PfSelect.shadowRootOptions = {
     ...LitElement.shadowRootOptions,
     delegatesFocus: true,
 };
-PfSelect.version = "4.2.0";
+PfSelect.version = "4.3.0";
 __decorate([
     property()
 ], PfSelect.prototype, "variant", void 0);

package/pf-spinner/pf-spinner.js

@@ -125,7 +125,7 @@ let PfSpinner = class PfSpinner extends LitElement {
 };
 _PfSpinner_internals = new WeakMap();
 PfSpinner.styles = [styles];
-PfSpinner.version = "4.2.0";
+PfSpinner.version = "4.3.0";
 __decorate([
     property({ reflect: true })
 ], PfSpinner.prototype, "size", void 0);

package/pf-switch/pf-switch.js

@@ -256,7 +256,7 @@ _PfSwitch_updateLabels = function _PfSwitch_updateLabels() {
 };
 PfSwitch.styles = [styles];
 PfSwitch.formAssociated = true;
-PfSwitch.version = "4.2.0";
+PfSwitch.version = "4.3.0";
 __decorate([
     property({ reflect: true })
 ], PfSwitch.prototype, "label", void 0);

package/pf-table/pf-caption.js

@@ -19,7 +19,7 @@ let PfCaption = class PfCaption extends LitElement {
     }
 };
 PfCaption.styles = [styles];
-PfCaption.version = "4.2.0";
+PfCaption.version = "4.3.0";
 PfCaption = __decorate([
     customElement('pf-caption')
 ], PfCaption);

package/pf-table/pf-table.js

@@ -554,7 +554,7 @@ _PfTable_performSort = function _PfTable_performSort(header, direction) {
     }
 };
 PfTable.styles = [styles];
-PfTable.version = "4.2.0";
+PfTable.version = "4.3.0";
 __decorate([
     state()
 ], PfTable.prototype, "columns", void 0);

package/pf-table/pf-tbody.js

@@ -31,7 +31,7 @@ let PfTbody = class PfTbody extends LitElement {
     }
 };
 PfTbody.styles = [styles];
-PfTbody.version = "4.2.0";
+PfTbody.version = "4.3.0";
 PfTbody = __decorate([
     customElement('pf-tbody')
 ], PfTbody);

package/pf-table/pf-td.js

@@ -140,7 +140,7 @@ _PfTd_onClick = function _PfTd_onClick() {
     this.dispatchEvent(event);
 };
 PfTd.styles = [styles];
-PfTd.version = "4.2.0";
+PfTd.version = "4.3.0";
 __decorate([
     property({ attribute: 'compound-expand' })
 ], PfTd.prototype, "compoundExpand", void 0);

package/pf-table/pf-th.js

@@ -162,7 +162,7 @@ _PfTh_onClick = function _PfTh_onClick() {
     }
 };
 PfTh.styles = [styles];
-PfTh.version = "4.2.0";
+PfTh.version = "4.3.0";
 __decorate([
     property({ type: Boolean, reflect: true })
 ], PfTh.prototype, "sortable", void 0);

package/pf-table/pf-thead.js

@@ -47,7 +47,7 @@ _PfThead_onSlotchange = function _PfThead_onSlotchange() {
     }
 };
 PfThead.styles = [styles];
-PfThead.version = "4.2.0";
+PfThead.version = "4.3.0";
 __decorate([
     provide({ context: thRoleContext })
 ], PfThead.prototype, "thRowContext", void 0);

package/pf-table/pf-tr.js

@@ -225,7 +225,7 @@ _PfTr_onClick = function _PfTr_onClick() {
     this.dispatchEvent(new RequestExpandEvent());
 };
 PfTr.styles = [styles];
-PfTr.version = "4.2.0";
+PfTr.version = "4.3.0";
 __decorate([
     property({
         reflect: true,

package/pf-tabs/pf-tab-panel.js

@@ -56,7 +56,7 @@ let PfTabPanel = class PfTabPanel extends LitElement {
     }
 };
 PfTabPanel.styles = [styles];
-PfTabPanel.version = "4.2.0";
+PfTabPanel.version = "4.3.0";
 __decorate([
     consume({ context, subscribe: true }),
     state()

package/pf-tabs/pf-tab.js

@@ -326,7 +326,7 @@ _PfTab_activate = async function _PfTab_activate() {
     this.dispatchEvent(new TabExpandEvent(this));
 };
 PfTab.styles = [styles];
-PfTab.version = "4.2.0";
+PfTab.version = "4.3.0";
 __decorate([
     queryAssignedElements({ slot: 'icon', flatten: true })
 ], PfTab.prototype, "icons", void 0);

package/pf-tabs/pf-tabs.js

@@ -488,7 +488,7 @@ _PfTabs_onExpand = function _PfTabs_onExpand(event) {
 };
 PfTabs.styles = [styles];
 PfTabs.scrollTimeoutDelay = 150;
-PfTabs.version = "4.2.0";
+PfTabs.version = "4.3.0";
 __decorate([
     property({ reflect: false, attribute: 'label-scroll-left' })
 ], PfTabs.prototype, "labelScrollLeft", void 0);

package/pf-text-area/pf-text-area.js

@@ -422,7 +422,7 @@ PfTextArea.shadowRootOptions = {
     ...LitElement.shadowRootOptions,
     delegatesFocus: true,
 };
-PfTextArea.version = "4.2.0";
+PfTextArea.version = "4.3.0";
 __decorate([
     property({ reflect: true, attribute: 'accessible-label' })
 ], PfTextArea.prototype, "accessibleLabel", void 0);

package/pf-text-input/pf-text-input.js

@@ -516,7 +516,7 @@ PfTextInput.shadowRootOptions = {
     ...LitElement.shadowRootOptions,
     delegatesFocus: true,
 };
-PfTextInput.version = "4.2.0";
+PfTextInput.version = "4.3.0";
 __decorate([
     property({ type: Boolean, reflect: true, attribute: 'left-truncated' })
 ], PfTextInput.prototype, "leftTruncated", void 0);

package/pf-tile/pf-tile.js

@@ -180,7 +180,7 @@ let PfTile = class PfTile extends LitElement {
     }
 };
 PfTile.styles = [styles];
-PfTile.version = "4.2.0";
+PfTile.version = "4.3.0";
 __decorate([
     property({ reflect: true, type: Boolean })
 ], PfTile.prototype, "selected", void 0);

package/pf-timestamp/pf-timestamp.js

@@ -55,7 +55,7 @@ let PfTimestamp = class PfTimestamp extends LitElement {
 };
 _PfTimestamp_timestamp = new WeakMap();
 PfTimestamp.styles = [style];
-PfTimestamp.version = "4.2.0";
+PfTimestamp.version = "4.3.0";
 __decorate([
     property({ reflect: true, attribute: 'date-format' })
 ], PfTimestamp.prototype, "dateFormat", void 0);

package/pf-tooltip/pf-tooltip.js

@@ -245,7 +245,7 @@ _PfTooltip_updateTrigger = function _PfTooltip_updateTrigger() {
     }
 };
 PfTooltip.styles = [styles];
-PfTooltip.version = "4.2.0";
+PfTooltip.version = "4.3.0";
 __decorate([
     property()
 ], PfTooltip.prototype, "position", void 0);