@patternfly/elements 2.3.1 → 2.4.0

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

@@ -1,4 +1,5 @@
-import { __decorate } from "tslib";
+var _PfClipboardCopy_instances, _PfClipboardCopy_copied, _PfClipboardCopy_mo, _PfClipboardCopy_onClick, _PfClipboardCopy_onChange, _PfClipboardCopy_onMutation, _PfClipboardCopy_dedent;
+import { __classPrivateFieldGet, __classPrivateFieldSet, __decorate } from "tslib";
 import { html } from 'lit';
 import { customElement } from 'lit/decorators/custom-element.js';
 import { property } from 'lit/decorators/property.js';
@@ -20,6 +21,7 @@ const sleep = (ms) => new Promise(r => setTimeout(r, ms));
 let PfClipboardCopy = class PfClipboardCopy extends BaseClipboardCopy {
     constructor() {
         super(...arguments);
+        _PfClipboardCopy_instances.add(this);
         this.clickTip = 'Copied';
         this.hoverTip = 'Copy';
         this.textAriaLabel = 'Copyable input';
@@ -40,17 +42,13 @@ let PfClipboardCopy = class PfClipboardCopy extends BaseClipboardCopy {
         this.inline = false;
         this.compact = false;
         this.value = '';
-        this.#copied = false;
-        this.#mo = new MutationObserver(() => this.#onMutation());
+        _PfClipboardCopy_copied.set(this, false);
+        _PfClipboardCopy_mo.set(this, new MutationObserver(() => __classPrivateFieldGet(this, _PfClipboardCopy_instances, "m", _PfClipboardCopy_onMutation).call(this)));
     }
-    static { this.styles = [...BaseClipboardCopy.styles, styles]; }
-    static { this.shadowRootOptions = { ...BaseClipboardCopy.shadowRootOptions, delegatesFocus: true }; }
-    #copied;
-    #mo;
     connectedCallback() {
         super.connectedCallback();
-        this.#mo.observe(this, { characterData: true });
-        this.#onMutation();
+        __classPrivateFieldGet(this, _PfClipboardCopy_mo, "f").observe(this, { characterData: true });
+        __classPrivateFieldGet(this, _PfClipboardCopy_instances, "m", _PfClipboardCopy_onMutation).call(this);
     }
     /**
      * @todo fix the collapsed whitespace between the end of the "inline-compact" variant and the text node.
@@ -68,7 +66,7 @@ let PfClipboardCopy = class PfClipboardCopy extends BaseClipboardCopy {
                         variant="control"
                         label="EXPAND"
                         ?inert="${!expandable}"
-                        @click="${this.#onClick}">
+                        @click="${__classPrivateFieldGet(this, _PfClipboardCopy_instances, "m", _PfClipboardCopy_onClick)}">
               <pf-icon icon="chevron-right"></pf-icon>
             </pf-button>
           </div>
@@ -77,7 +75,7 @@ let PfClipboardCopy = class PfClipboardCopy extends BaseClipboardCopy {
               ?hidden="${inline || compact}"
               ?disabled="${expanded || readonly}"
               .value="${this.value}"
-              @input="${this.#onChange}"
+              @input="${__classPrivateFieldGet(this, _PfClipboardCopy_instances, "m", _PfClipboardCopy_onChange)}"
               aria-label="${this.textAriaLabel}">
           <pf-tooltip>
             <pf-button id="copy-button"
@@ -88,46 +86,51 @@ let PfClipboardCopy = class PfClipboardCopy extends BaseClipboardCopy {
                         @click="${this.copy}">
               <pf-icon icon="copy"></pf-icon>
             </pf-button>
-            <span slot="content">${this.#copied ? this.clickTip : this.hoverTip}</span>
+            <span slot="content">${__classPrivateFieldGet(this, _PfClipboardCopy_copied, "f") ? this.clickTip : this.hoverTip}</span>
           </pf-tooltip>
           <slot name="actions"></slot>
         </div>
         <textarea .value="${this.value}"
                   .disabled="${this.readonly}"
                   ?hidden="${!(expandable && expanded)}"
-                  @input="${this.#onChange}">
+                  @input="${__classPrivateFieldGet(this, _PfClipboardCopy_instances, "m", _PfClipboardCopy_onChange)}">
         </textarea>
       </div>
     `;
     }
-    #onClick() {
-        this.expanded = !this.expanded;
-    }
-    #onChange(e) {
-        const { value } = e.target || HTMLTextAreaElement;
-        this.value = value;
-    }
-    #onMutation() {
-        if (this.childNodes.length > 0) {
-            this.value = this.getAttribute('value') ?? this.#dedent(Array.from(this.childNodes, child => (child instanceof Element || child instanceof Text) ? (child.textContent ?? '') : '')
-                .join(''));
-        }
-    }
-    #dedent(str) {
-        const stripped = str.replace(/^\n/, '');
-        const match = stripped.match(/^\s+/);
-        return match ? stripped.replace(new RegExp(`^${match[0]}`, 'gm'), '') : str;
-    }
     async copy() {
         await super.copy();
         await sleep(this.entryDelay);
-        this.#copied = true;
+        __classPrivateFieldSet(this, _PfClipboardCopy_copied, true, "f");
         this.requestUpdate();
         await sleep(this.exitDelay);
-        this.#copied = false;
+        __classPrivateFieldSet(this, _PfClipboardCopy_copied, false, "f");
         this.requestUpdate();
     }
 };
+_PfClipboardCopy_copied = new WeakMap();
+_PfClipboardCopy_mo = new WeakMap();
+_PfClipboardCopy_instances = new WeakSet();
+_PfClipboardCopy_onClick = function _PfClipboardCopy_onClick() {
+    this.expanded = !this.expanded;
+};
+_PfClipboardCopy_onChange = function _PfClipboardCopy_onChange(e) {
+    const { value } = e.target || HTMLTextAreaElement;
+    this.value = value;
+};
+_PfClipboardCopy_onMutation = function _PfClipboardCopy_onMutation() {
+    if (this.childNodes.length > 0) {
+        this.value = this.getAttribute('value') ?? __classPrivateFieldGet(this, _PfClipboardCopy_instances, "m", _PfClipboardCopy_dedent).call(this, Array.from(this.childNodes, child => (child instanceof Element || child instanceof Text) ? (child.textContent ?? '') : '')
+            .join(''));
+    }
+};
+_PfClipboardCopy_dedent = function _PfClipboardCopy_dedent(str) {
+    const stripped = str.replace(/^\n/, '');
+    const match = stripped.match(/^\s+/);
+    return match ? stripped.replace(new RegExp(`^${match[0]}`, 'gm'), '') : str;
+};
+PfClipboardCopy.styles = [...BaseClipboardCopy.styles, styles];
+PfClipboardCopy.shadowRootOptions = { ...BaseClipboardCopy.shadowRootOptions, delegatesFocus: true };
 __decorate([
     property({ attribute: 'click-tip' })
 ], PfClipboardCopy.prototype, "clickTip", void 0);

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

@@ -1 +1 @@
-{"version":3,"file":"pf-clipboard-copy.js","sourceRoot":"","sources":["pf-clipboard-copy.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { BaseClipboardCopy } from './BaseClipboardCopy.js';\n\nimport styles from './pf-clipboard-copy.css';\n\nimport '@patternfly/elements/pf-button/pf-button.js';\nimport '@patternfly/elements/pf-icon/pf-icon.js';\nimport '@patternfly/elements/pf-tooltip/pf-tooltip.js';\n\nconst sleep = (ms?: number) => new Promise(r => setTimeout(r, ms));\n\n/**\n * The **clipboard copy** component allows users to quickly and easily copy content to their clipboard.\n *\n * @slot - Place content to copy here, or use the `value` attribute\n * @slot actions - Place additional action buttons here\n */\n@customElement('pf-clipboard-copy')\nexport class PfClipboardCopy extends BaseClipboardCopy {\n  static readonly styles = [...BaseClipboardCopy.styles, styles];\n\n  static shadowRootOptions: ShadowRootInit = { ...BaseClipboardCopy.shadowRootOptions, delegatesFocus: true };\n\n  @property({ attribute: 'click-tip' }) clickTip = 'Copied';\n\n  @property({ attribute: 'hover-tip' }) hoverTip = 'Copy';\n\n  @property({ attribute: 'text-label' }) textAriaLabel = 'Copyable input';\n\n  @property({ attribute: 'toggle-label' }) toggleAriaLabel = 'Show content';\n\n  @property({ type: Number, attribute: 'entry-delay' }) entryDelay = 300;\n\n  @property({ type: Number, attribute: 'exit-delay' }) exitDelay = 1500;\n\n  @property({ type: Boolean, reflect: true }) block = false;\n\n  @property({ type: Boolean, reflect: true }) code = false;\n\n  @property({ type: Boolean, reflect: true }) expanded = false;\n\n  /**\n   * Implies not `inline`.\n   */\n  @property({ type: Boolean, reflect: true }) expandable = false;\n\n  @property({ type: Boolean, reflect: true }) readonly = false;\n\n  /**\n   * Implies not expandable. Overrules `expandable`.\n   */\n  @property({ type: Boolean, reflect: true }) inline = false;\n\n  @property({ type: Boolean, reflect: true }) compact = false;\n\n  @property() override value = '';\n\n  #copied = false;\n\n  #mo = new MutationObserver(() => this.#onMutation());\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.#mo.observe(this, { characterData: true });\n    this.#onMutation();\n  }\n\n  /**\n   * @todo fix the collapsed whitespace between the end of the \"inline-compact\" variant and the text node.\n   * This demonstrates the collapsed whitespace issue.\n   * The extra space between the closing slot tag and the closing template literal results in a collapsed whitespace.\n   */\n  render() {\n    const { expanded, expandable, inline, compact, code, block, readonly } = this;\n    return html`\n      <div class=\"container ${classMap({ code, expanded, inline, compact, block, })}\">\n        <div id=\"input-group\">\n          <div id=\"wrapper\">\n            <pf-button id=\"expand-button\"\n                        plain\n                        variant=\"control\"\n                        label=\"EXPAND\"\n                        ?inert=\"${!expandable}\"\n                        @click=\"${this.#onClick}\">\n              <pf-icon icon=\"chevron-right\"></pf-icon>\n            </pf-button>\n          </div>\n          <span ?hidden=\"${!(inline || compact)}\">${this.value}</span>\n          <input\n              ?hidden=\"${inline || compact}\"\n              ?disabled=\"${expanded || readonly}\"\n              .value=\"${this.value}\"\n              @input=\"${this.#onChange}\"\n              aria-label=\"${this.textAriaLabel}\">\n          <pf-tooltip>\n            <pf-button id=\"copy-button\"\n                        plain\n                        variant=\"${ifDefined(!(inline || compact) ? 'control' : undefined)}\"\n                        label=\"${this.hoverTip}\"\n                        size=\"lg\"\n                        @click=\"${this.copy}\">\n              <pf-icon icon=\"copy\"></pf-icon>\n            </pf-button>\n            <span slot=\"content\">${this.#copied ? this.clickTip : this.hoverTip}</span>\n          </pf-tooltip>\n          <slot name=\"actions\"></slot>\n        </div>\n        <textarea .value=\"${this.value}\"\n                  .disabled=\"${this.readonly}\"\n                  ?hidden=\"${!(expandable && expanded)}\"\n                  @input=\"${this.#onChange}\">\n        </textarea>\n      </div>\n    `;\n  }\n\n  #onClick() {\n    this.expanded = !this.expanded;\n  }\n\n  #onChange(e: Event) {\n    const { value } = e.target as HTMLInputElement || HTMLTextAreaElement;\n    this.value = value;\n  }\n\n  #onMutation() {\n    if (this.childNodes.length > 0) {\n      this.value = this.getAttribute('value') ?? this.#dedent(Array.from(this.childNodes, child =>\n        (child instanceof Element || child instanceof Text) ? (child.textContent ?? '') : '')\n        .join(''));\n    }\n  }\n\n  #dedent(str: string): string {\n    const stripped = str.replace(/^\\n/, '');\n    const match = stripped.match(/^\\s+/);\n    return match ? stripped.replace(new RegExp(`^${match[0]}`, 'gm'), '') : str;\n  }\n\n  override async copy() {\n    await super.copy();\n    await sleep(this.entryDelay);\n    this.#copied = true;\n    this.requestUpdate();\n    await sleep(this.exitDelay);\n    this.#copied = false;\n    this.requestUpdate();\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-clipboard-copy': PfClipboardCopy;\n  }\n}\n"]}
+{"version":3,"file":"pf-clipboard-copy.js","sourceRoot":"","sources":["pf-clipboard-copy.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { BaseClipboardCopy } from './BaseClipboardCopy.js';\n\nimport styles from './pf-clipboard-copy.css';\n\nimport '@patternfly/elements/pf-button/pf-button.js';\nimport '@patternfly/elements/pf-icon/pf-icon.js';\nimport '@patternfly/elements/pf-tooltip/pf-tooltip.js';\n\nconst sleep = (ms?: number) => new Promise(r => setTimeout(r, ms));\n\n/**\n * The **clipboard copy** component allows users to quickly and easily copy content to their clipboard.\n *\n * @slot - Place content to copy here, or use the `value` attribute\n * @slot actions - Place additional action buttons here\n */\n@customElement('pf-clipboard-copy')\nexport class PfClipboardCopy extends BaseClipboardCopy {\n  static readonly styles = [...BaseClipboardCopy.styles, styles];\n\n  static shadowRootOptions: ShadowRootInit = { ...BaseClipboardCopy.shadowRootOptions, delegatesFocus: true };\n\n  @property({ attribute: 'click-tip' }) clickTip = 'Copied';\n\n  @property({ attribute: 'hover-tip' }) hoverTip = 'Copy';\n\n  @property({ attribute: 'text-label' }) textAriaLabel = 'Copyable input';\n\n  @property({ attribute: 'toggle-label' }) toggleAriaLabel = 'Show content';\n\n  @property({ type: Number, attribute: 'entry-delay' }) entryDelay = 300;\n\n  @property({ type: Number, attribute: 'exit-delay' }) exitDelay = 1500;\n\n  @property({ type: Boolean, reflect: true }) block = false;\n\n  @property({ type: Boolean, reflect: true }) code = false;\n\n  @property({ type: Boolean, reflect: true }) expanded = false;\n\n  /**\n   * Implies not `inline`.\n   */\n  @property({ type: Boolean, reflect: true }) expandable = false;\n\n  @property({ type: Boolean, reflect: true }) readonly = false;\n\n  /**\n   * Implies not expandable. Overrules `expandable`.\n   */\n  @property({ type: Boolean, reflect: true }) inline = false;\n\n  @property({ type: Boolean, reflect: true }) compact = false;\n\n  @property() override value = '';\n\n  #copied = false;\n\n  #mo = new MutationObserver(() => this.#onMutation());\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.#mo.observe(this, { characterData: true });\n    this.#onMutation();\n  }\n\n  /**\n   * @todo fix the collapsed whitespace between the end of the \"inline-compact\" variant and the text node.\n   * This demonstrates the collapsed whitespace issue.\n   * The extra space between the closing slot tag and the closing template literal results in a collapsed whitespace.\n   */\n  render() {\n    const { expanded, expandable, inline, compact, code, block, readonly } = this;\n    return html`\n      <div class=\"container ${classMap({ code, expanded, inline, compact, block, })}\">\n        <div id=\"input-group\">\n          <div id=\"wrapper\">\n            <pf-button id=\"expand-button\"\n                        plain\n                        variant=\"control\"\n                        label=\"EXPAND\"\n                        ?inert=\"${!expandable}\"\n                        @click=\"${this.#onClick}\">\n              <pf-icon icon=\"chevron-right\"></pf-icon>\n            </pf-button>\n          </div>\n          <span ?hidden=\"${!(inline || compact)}\">${this.value}</span>\n          <input\n              ?hidden=\"${inline || compact}\"\n              ?disabled=\"${expanded || readonly}\"\n              .value=\"${this.value}\"\n              @input=\"${this.#onChange}\"\n              aria-label=\"${this.textAriaLabel}\">\n          <pf-tooltip>\n            <pf-button id=\"copy-button\"\n                        plain\n                        variant=\"${ifDefined(!(inline || compact) ? 'control' : undefined)}\"\n                        label=\"${this.hoverTip}\"\n                        size=\"lg\"\n                        @click=\"${this.copy}\">\n              <pf-icon icon=\"copy\"></pf-icon>\n            </pf-button>\n            <span slot=\"content\">${this.#copied ? this.clickTip : this.hoverTip}</span>\n          </pf-tooltip>\n          <slot name=\"actions\"></slot>\n        </div>\n        <textarea .value=\"${this.value}\"\n                  .disabled=\"${this.readonly}\"\n                  ?hidden=\"${!(expandable && expanded)}\"\n                  @input=\"${this.#onChange}\">\n        </textarea>\n      </div>\n    `;\n  }\n\n  #onClick() {\n    this.expanded = !this.expanded;\n  }\n\n  #onChange(e: Event) {\n    const { value } = e.target as HTMLInputElement || HTMLTextAreaElement;\n    this.value = value;\n  }\n\n  #onMutation() {\n    if (this.childNodes.length > 0) {\n      this.value = this.getAttribute('value') ?? this.#dedent(Array.from(this.childNodes, child =>\n        (child instanceof Element || child instanceof Text) ? (child.textContent ?? '') : '')\n        .join(''));\n    }\n  }\n\n  #dedent(str: string): string {\n    const stripped = str.replace(/^\\n/, '');\n    const match = stripped.match(/^\\s+/);\n    return match ? stripped.replace(new RegExp(`^${match[0]}`, 'gm'), '') : str;\n  }\n\n  override async copy() {\n    await super.copy();\n    await sleep(this.entryDelay);\n    this.#copied = true;\n    this.requestUpdate();\n    await sleep(this.exitDelay);\n    this.#copied = false;\n    this.requestUpdate();\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-clipboard-copy': PfClipboardCopy;\n  }\n}\n"]}

package/pf-code-block/BaseCodeBlock.js

@@ -2,7 +2,6 @@ import { LitElement } from 'lit';
 import { css } from "lit";
 const styles = css `:host{display:block}[hidden]{display:none!important}`;
 class BaseCodeBlock extends LitElement {
-    static { this.styles = [styles]; }
     get content() {
         const script = this.querySelector('script[type]');
         if (script?.type !== 'text/javascript-sample' &&
@@ -19,5 +18,6 @@ class BaseCodeBlock extends LitElement {
         return match ? stripped.replace(new RegExp(`^${match[0]}`, 'gm'), '') : str;
     }
 }
+BaseCodeBlock.styles = [styles];
 export { BaseCodeBlock };
 //# sourceMappingURL=BaseCodeBlock.js.map

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

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

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

@@ -1,4 +1,5 @@
-import { __decorate } from "tslib";
+var _PfCodeBlock_instances, _PfCodeBlock_toggle, _PfCodeBlock_expandedContent_get;
+import { __classPrivateFieldGet, __decorate } from "tslib";
 import { html } from 'lit';
 import { customElement } from 'lit/decorators/custom-element.js';
 import { property } from 'lit/decorators/property.js';
@@ -31,15 +32,9 @@ const styles = css `:host{background-color:var(--pf-c-code-block--BackgroundColo
 let PfCodeBlock = class PfCodeBlock extends BaseCodeBlock {
     constructor() {
         super(...arguments);
+        _PfCodeBlock_instances.add(this);
         this.expanded = false;
     }
-    static { this.styles = [...BaseCodeBlock.styles, styles]; }
-    #toggle() {
-        this.expanded = !this.expanded;
-    }
-    get #expandedContent() {
-        return this.querySelector('script[data-expand]')?.textContent ?? '';
-    }
     render() {
         const { expanded } = this;
         return html `
@@ -50,9 +45,9 @@ let PfCodeBlock = class PfCodeBlock extends BaseCodeBlock {
       </div>
       <div id="container" class="${classMap({ expanded })}">
         <pre><code id="content">${this.content}</code><code id="code-block-expand"
-          ?hidden="${!expanded}">${this.#expandedContent}</code></pre>
-        <button ?hidden="${!this.#expandedContent}"
-                @click=${this.#toggle}
+          ?hidden="${!expanded}">${__classPrivateFieldGet(this, _PfCodeBlock_instances, "a", _PfCodeBlock_expandedContent_get)}</code></pre>
+        <button ?hidden="${!__classPrivateFieldGet(this, _PfCodeBlock_instances, "a", _PfCodeBlock_expandedContent_get)}"
+                @click=${__classPrivateFieldGet(this, _PfCodeBlock_instances, "m", _PfCodeBlock_toggle)}
                 aria-expanded=${this.expanded}
                 aria-controls="code-block-expand">
           <svg fill="currentColor" height="1em" width="1em" viewBox="0 0 256 512" aria-hidden="true" role="img" style="vertical-align: -0.125em;"><path d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"></path></svg>
@@ -62,6 +57,14 @@ let PfCodeBlock = class PfCodeBlock extends BaseCodeBlock {
     `;
     }
 };
+_PfCodeBlock_instances = new WeakSet();
+_PfCodeBlock_toggle = function _PfCodeBlock_toggle() {
+    this.expanded = !this.expanded;
+};
+_PfCodeBlock_expandedContent_get = function _PfCodeBlock_expandedContent_get() {
+    return this.querySelector('script[data-expand]')?.textContent ?? '';
+};
+PfCodeBlock.styles = [...BaseCodeBlock.styles, styles];
 __decorate([
     property({ type: Boolean, reflect: true })
 ], PfCodeBlock.prototype, "expanded", void 0);

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

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

package/pf-icon/BaseIcon.js

@@ -1,4 +1,5 @@
-import { __decorate } from "tslib";
+var _BaseIcon_instances, _a, _BaseIcon_intersecting, _BaseIcon_logger, _BaseIcon_class_get, _BaseIcon_lazyLoad, _BaseIcon_iconChanged;
+import { __classPrivateFieldGet, __classPrivateFieldSet, __decorate } from "tslib";
 import { LitElement, html } from 'lit';
 import { property } from 'lit/decorators/property.js';
 import { state } from 'lit/decorators/state.js';
@@ -27,8 +28,9 @@ class IconLoadError extends ErrorEvent {
 class BaseIcon extends LitElement {
     constructor() {
         super(...arguments);
+        _BaseIcon_instances.add(this);
         /** Icon set */
-        this.set = this.#class.defaultIconSet;
+        this.set = __classPrivateFieldGet(this, _BaseIcon_instances, "a", _BaseIcon_class_get).defaultIconSet;
         /** Icon name */
         this.icon = '';
         /**
@@ -38,10 +40,9 @@ class BaseIcon extends LitElement {
          * - `lazy` (default): wait for the element to enter the viewport before loading
          */
         this.loading = 'lazy';
-        this.#intersecting = false;
-        this.#logger = new Logger(this);
+        _BaseIcon_intersecting.set(this, false);
+        _BaseIcon_logger.set(this, new Logger(this));
     }
-    static { this.styles = [style]; }
     static addIconSet(setName, getter) {
         if (typeof getter !== 'function') {
             Logger.warn(`[${this.name}.addIconSet(setName, getter)]: getter must be a function`);
@@ -53,49 +54,18 @@ class BaseIcon extends LitElement {
             }
         }
     }
-    static { this.getIconUrl = (set, icon) => new URL(`./icons/${set}/${icon}.js`, import.meta.url); }
-    static { this.onIntersect = records => records.forEach(({ isIntersecting, target }) => {
-        const icon = target;
-        icon.#intersecting = isIntersecting;
-        ric(() => {
-            if (icon.#intersecting) {
-                icon.load();
-            }
-        });
-    }); }
-    static { this.io = new IntersectionObserver(this.onIntersect); }
-    static { this.getters = new Map(); }
-    static { this.instances = new Set(); }
-    #intersecting;
-    #logger;
-    get #class() {
-        return this.constructor;
-    }
-    #lazyLoad() {
-        this.#class.io.observe(this);
-        if (this.#intersecting) {
-            this.load();
-        }
-    }
-    #iconChanged() {
-        switch (this.loading) {
-            case 'idle': return void ric(() => this.load());
-            case 'lazy': return void this.#lazyLoad();
-            case 'eager': return void this.load();
-        }
-    }
     connectedCallback() {
         super.connectedCallback();
-        this.#class.instances.add(this);
+        __classPrivateFieldGet(this, _BaseIcon_instances, "a", _BaseIcon_class_get).instances.add(this);
     }
     willUpdate(changed) {
         if (changed.has('icon')) {
-            this.#iconChanged();
+            __classPrivateFieldGet(this, _BaseIcon_instances, "m", _BaseIcon_iconChanged).call(this);
         }
     }
     disconnectedCallback() {
         super.disconnectedCallback();
-        this.#class.instances.delete(this);
+        __classPrivateFieldGet(this, _BaseIcon_instances, "a", _BaseIcon_class_get).instances.delete(this);
     }
     render() {
         const content = this.content ?? ''; /* eslint-disable indent */
@@ -108,7 +78,7 @@ class BaseIcon extends LitElement {
     }
     async load() {
         const { set, icon, } = this;
-        const getter = this.#class.getters.get(set) ?? this.#class.getIconUrl;
+        const getter = __classPrivateFieldGet(this, _BaseIcon_instances, "a", _BaseIcon_class_get).getters.get(set) ?? __classPrivateFieldGet(this, _BaseIcon_instances, "a", _BaseIcon_class_get).getIconUrl;
         let spec = 'UNKNOWN ICON';
         if (set && icon) {
             try {
@@ -126,12 +96,40 @@ class BaseIcon extends LitElement {
             }
             catch (error) {
                 const event = new IconLoadError(spec, error);
-                this.#logger.error(error.message);
+                __classPrivateFieldGet(this, _BaseIcon_logger, "f").error(error.message);
                 this.dispatchEvent(event);
             }
         }
     }
 }
+_a = BaseIcon, _BaseIcon_intersecting = new WeakMap(), _BaseIcon_logger = new WeakMap(), _BaseIcon_instances = new WeakSet(), _BaseIcon_class_get = function _BaseIcon_class_get() {
+    return this.constructor;
+}, _BaseIcon_lazyLoad = function _BaseIcon_lazyLoad() {
+    __classPrivateFieldGet(this, _BaseIcon_instances, "a", _BaseIcon_class_get).io.observe(this);
+    if (__classPrivateFieldGet(this, _BaseIcon_intersecting, "f")) {
+        this.load();
+    }
+}, _BaseIcon_iconChanged = function _BaseIcon_iconChanged() {
+    switch (this.loading) {
+        case 'idle': return void ric(() => this.load());
+        case 'lazy': return void __classPrivateFieldGet(this, _BaseIcon_instances, "m", _BaseIcon_lazyLoad).call(this);
+        case 'eager': return void this.load();
+    }
+};
+BaseIcon.styles = [style];
+BaseIcon.getIconUrl = (set, icon) => new URL(`./icons/${set}/${icon}.js`, import.meta.url);
+BaseIcon.onIntersect = records => records.forEach(({ isIntersecting, target }) => {
+    const icon = target;
+    __classPrivateFieldSet(icon, _BaseIcon_intersecting, isIntersecting, "f");
+    ric(() => {
+        if (__classPrivateFieldGet(icon, _BaseIcon_intersecting, "f")) {
+            icon.load();
+        }
+    });
+});
+BaseIcon.io = new IntersectionObserver(_a.onIntersect);
+BaseIcon.getters = new Map();
+BaseIcon.instances = new Set();
 __decorate([
     property()
 ], BaseIcon.prototype, "set", void 0);

package/pf-icon/BaseIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseIcon.js","sourceRoot":"","sources":["BaseIcon.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyValues } from 'lit';\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport { Logger } from '@patternfly/pfe-core/controllers/logger.js';\n\nimport style from './BaseIcon.css';\n\nexport type URLGetter = (set: string, icon: string) => URL | string;\n\n/** requestIdleCallback when available, requestAnimationFrame when not */\nconst ric = window.requestIdleCallback ?? window.requestAnimationFrame;\n\n/** Fired when an icon fails to load */\nclass IconLoadError extends ErrorEvent {\n  constructor(\n    pathname: string,\n    /** The original error when importing the icon module */\n    public originalError: Error\n  ) {\n    super('error', { message: `Could not load icon at ${pathname}` });\n  }\n}\n\n/**\n * Icon component lazy-loads icons and allows custom icon sets\n *\n * @slot - Slotted content is used as a fallback in case the icon doesn't load\n * @fires load - Fired when an icon is loaded and rendered\n * @fires error - Fired when an icon fails to load\n * @csspart fallback - Container for the fallback (i.e. slotted) content\n */\nexport abstract class BaseIcon extends LitElement {\n  public static readonly styles = [style];\n\n  public static addIconSet(setName: string, getter: typeof BaseIcon['getIconUrl']) {\n    if (typeof getter !== 'function') {\n      Logger.warn(`[${this.name}.addIconSet(setName, getter)]: getter must be a function`);\n    } else {\n      this.getters.set(setName, getter);\n      for (const instance of this.instances) {\n        instance.load();\n      }\n    }\n  }\n\n  public static getIconUrl: URLGetter = (set: string, icon: string) =>\n    new URL(`./icons/${set}/${icon}.js`, import.meta.url);\n\n  private static onIntersect: IntersectionObserverCallback = records =>\n    records.forEach(({ isIntersecting, target }) => {\n      const icon = target as BaseIcon;\n      icon.#intersecting = isIntersecting;\n      ric(() => {\n        if (icon.#intersecting) {\n          icon.load();\n        }\n      });\n    });\n\n  private static io = new IntersectionObserver(this.onIntersect);\n\n  private static getters = new Map<string, URLGetter>();\n\n  private static instances = new Set<BaseIcon>();\n\n  declare public static defaultIconSet: string;\n\n  /** Icon set */\n  @property() set = this.#class.defaultIconSet;\n\n  /** Icon name */\n  @property({ reflect: true }) icon = '';\n\n  /** Size of the icon */\n  abstract size: string;\n\n  /**\n   * Controls how eager the element will be to load the icon data\n   * - `eager`: eagerly load the icon, blocking the main thread\n   * - `idle`: wait for the browser to attain an idle state before loading\n   * - `lazy` (default): wait for the element to enter the viewport before loading\n   */\n  @property() loading?: 'idle' | 'lazy' | 'eager' = 'lazy';\n\n  /** Icon content. Any value that lit can render */\n  @state() private content?: unknown;\n\n  #intersecting = false;\n\n  #logger = new Logger(this);\n\n  get #class(): typeof BaseIcon {\n    return this.constructor as typeof BaseIcon;\n  }\n\n  #lazyLoad() {\n    this.#class.io.observe(this);\n    if (this.#intersecting) {\n      this.load();\n    }\n  }\n\n  #iconChanged() {\n    switch (this.loading) {\n      case 'idle': return void ric(() => this.load());\n      case 'lazy': return void this.#lazyLoad();\n      case 'eager': return void this.load();\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.#class.instances.add(this);\n  }\n\n  willUpdate(changed: PropertyValues<this>) {\n    if (changed.has('icon')) {\n      this.#iconChanged();\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.#class.instances.delete(this);\n  }\n\n  render() {\n    const content = this.content ?? ''; /* eslint-disable indent */\n    return html`\n      <div id=\"container\" aria-hidden=\"true\">${content\n       }<span part=\"fallback\" ?hidden=${!!content}>\n          <slot></slot>\n        </span>\n      </div>\n    `;/* eslint-enable indent */\n  }\n\n  protected async load() {\n    const { set, icon, } = this;\n    const getter = this.#class.getters.get(set) ?? this.#class.getIconUrl;\n    let spec = 'UNKNOWN ICON';\n    if (set && icon) {\n      try {\n        const gotten = getter(set, icon);\n        if (gotten instanceof URL) {\n          spec = gotten.pathname;\n        } else {\n          spec = gotten;\n        }\n        const mod = await import(spec);\n        this.content = mod.default instanceof Node ? mod.default.cloneNode(true) : mod.default;\n        await this.updateComplete;\n        this.dispatchEvent(new Event('load', { bubbles: true }));\n      } catch (error: unknown) {\n        const event = new IconLoadError(spec, error as Error);\n        this.#logger.error((error as IconLoadError).message);\n        this.dispatchEvent(event);\n      }\n    }\n  }\n}\n"]}
+{"version":3,"file":"BaseIcon.js","sourceRoot":"","sources":["BaseIcon.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyValues } from 'lit';\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators/property.js';\nimport { state } from 'lit/decorators/state.js';\nimport { Logger } from '@patternfly/pfe-core/controllers/logger.js';\n\nimport style from './BaseIcon.css';\n\nexport type URLGetter = (set: string, icon: string) => URL | string;\n\n/** requestIdleCallback when available, requestAnimationFrame when not */\nconst ric = window.requestIdleCallback ?? window.requestAnimationFrame;\n\n/** Fired when an icon fails to load */\nclass IconLoadError extends ErrorEvent {\n  constructor(\n    pathname: string,\n    /** The original error when importing the icon module */\n    public originalError: Error\n  ) {\n    super('error', { message: `Could not load icon at ${pathname}` });\n  }\n}\n\n/**\n * Icon component lazy-loads icons and allows custom icon sets\n *\n * @slot - Slotted content is used as a fallback in case the icon doesn't load\n * @fires load - Fired when an icon is loaded and rendered\n * @fires error - Fired when an icon fails to load\n * @csspart fallback - Container for the fallback (i.e. slotted) content\n */\nexport abstract class BaseIcon extends LitElement {\n  public static readonly styles = [style];\n\n  public static addIconSet(setName: string, getter: typeof BaseIcon['getIconUrl']) {\n    if (typeof getter !== 'function') {\n      Logger.warn(`[${this.name}.addIconSet(setName, getter)]: getter must be a function`);\n    } else {\n      this.getters.set(setName, getter);\n      for (const instance of this.instances) {\n        instance.load();\n      }\n    }\n  }\n\n  public static getIconUrl: URLGetter = (set: string, icon: string) =>\n    new URL(`./icons/${set}/${icon}.js`, import.meta.url);\n\n  private static onIntersect: IntersectionObserverCallback = records =>\n    records.forEach(({ isIntersecting, target }) => {\n      const icon = target as BaseIcon;\n      icon.#intersecting = isIntersecting;\n      ric(() => {\n        if (icon.#intersecting) {\n          icon.load();\n        }\n      });\n    });\n\n  private static io = new IntersectionObserver(this.onIntersect);\n\n  private static getters = new Map<string, URLGetter>();\n\n  private static instances = new Set<BaseIcon>();\n\n  declare public static defaultIconSet: string;\n\n  /** Icon set */\n  @property() set = this.#class.defaultIconSet;\n\n  /** Icon name */\n  @property({ reflect: true }) icon = '';\n\n  /** Size of the icon */\n  abstract size: string;\n\n  /**\n   * Controls how eager the element will be to load the icon data\n   * - `eager`: eagerly load the icon, blocking the main thread\n   * - `idle`: wait for the browser to attain an idle state before loading\n   * - `lazy` (default): wait for the element to enter the viewport before loading\n   */\n  @property() loading?: 'idle' | 'lazy' | 'eager' = 'lazy';\n\n  /** Icon content. Any value that lit can render */\n  @state() private content?: unknown;\n\n  #intersecting = false;\n\n  #logger = new Logger(this);\n\n  get #class(): typeof BaseIcon {\n    return this.constructor as typeof BaseIcon;\n  }\n\n  #lazyLoad() {\n    this.#class.io.observe(this);\n    if (this.#intersecting) {\n      this.load();\n    }\n  }\n\n  #iconChanged() {\n    switch (this.loading) {\n      case 'idle': return void ric(() => this.load());\n      case 'lazy': return void this.#lazyLoad();\n      case 'eager': return void this.load();\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.#class.instances.add(this);\n  }\n\n  willUpdate(changed: PropertyValues<this>) {\n    if (changed.has('icon')) {\n      this.#iconChanged();\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.#class.instances.delete(this);\n  }\n\n  render() {\n    const content = this.content ?? ''; /* eslint-disable indent */\n    return html`\n      <div id=\"container\" aria-hidden=\"true\">${content\n       }<span part=\"fallback\" ?hidden=${!!content}>\n          <slot></slot>\n        </span>\n      </div>\n    `;/* eslint-enable indent */\n  }\n\n  protected async load() {\n    const { set, icon, } = this;\n    const getter = this.#class.getters.get(set) ?? this.#class.getIconUrl;\n    let spec = 'UNKNOWN ICON';\n    if (set && icon) {\n      try {\n        const gotten = getter(set, icon);\n        if (gotten instanceof URL) {\n          spec = gotten.pathname;\n        } else {\n          spec = gotten;\n        }\n        const mod = await import(spec);\n        this.content = mod.default instanceof Node ? mod.default.cloneNode(true) : mod.default;\n        await this.updateComplete;\n        this.dispatchEvent(new Event('load', { bubbles: true }));\n      } catch (error: unknown) {\n        const event = new IconLoadError(spec, error as Error);\n        this.#logger.error((error as IconLoadError).message);\n        this.dispatchEvent(event);\n      }\n    }\n  }\n}\n"]}

package/pf-icon/pf-icon.js

@@ -19,9 +19,9 @@ let PfIcon = class PfIcon extends BaseIcon {
         /** Size of the icon */
         this.size = 'sm';
     }
-    static { this.styles = [...BaseIcon.styles, style]; }
-    static { this.defaultIconSet = 'fas'; }
 };
+PfIcon.styles = [...BaseIcon.styles, style];
+PfIcon.defaultIconSet = 'fas';
 __decorate([
     property({ reflect: true })
 ], PfIcon.prototype, "size", void 0);

package/pf-icon/pf-icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"pf-icon.js","sourceRoot":"","sources":["pf-icon.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;;;AAItD;;;;;;;;GAQG;AAEH,IAAa,MAAM,GAAnB,MAAa,MAAO,SAAQ,QAAQ;IAApC;;QAKE,uBAAuB;QACM,SAAI,GAA8B,IAAI,CAAC;IACtE,CAAC;aANwB,WAAM,GAAG,CAAC,GAAG,QAAQ,CAAC,MAAM,EAAE,KAAK,CAAC,AAA9B,CAA+B;aAE9C,mBAAc,GAAG,KAAK,AAAR,CAAS;;AAGR;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;oCAAwC;AANzD,MAAM;IADlB,aAAa,CAAC,SAAS,CAAC;GACZ,MAAM,CAOlB;SAPY,MAAM","sourcesContent":["import { BaseIcon } from './BaseIcon.js';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\n\nimport style from './pf-icon.css';\n\n/**\n * An **icon** component is a container that allows for icons of varying dimensions to\n * seamlessly replace each other without shifting surrounding content.\n *\n * @slot - Slotted content is used as a fallback in case the icon doesn't load\n * @fires load - Fired when an icon is loaded and rendered\n * @fires error - Fired when an icon fails to load\n * @csspart fallback - Container for the fallback (i.e. slotted) content\n */\n@customElement('pf-icon')\nexport class PfIcon extends BaseIcon {\n  public static readonly styles = [...BaseIcon.styles, style];\n\n  public static defaultIconSet = 'fas';\n\n  /** Size of the icon */\n  @property({ reflect: true }) size: 'sm' | 'md' | 'lg' | 'xl' = 'sm';\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-icon': PfIcon;\n  }\n}\n"]}
+{"version":3,"file":"pf-icon.js","sourceRoot":"","sources":["pf-icon.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;;;AAItD;;;;;;;;GAQG;AAEH,IAAa,MAAM,GAAnB,MAAa,MAAO,SAAQ,QAAQ;IAApC;;QAKE,uBAAuB;QACM,SAAI,GAA8B,IAAI,CAAC;IACtE,CAAC;;AANwB,aAAM,GAAG,CAAC,GAAG,QAAQ,CAAC,MAAM,EAAE,KAAK,CAAC,AAA9B,CAA+B;AAE9C,qBAAc,GAAG,KAAK,AAAR,CAAS;AAGR;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;oCAAwC;AANzD,MAAM;IADlB,aAAa,CAAC,SAAS,CAAC;GACZ,MAAM,CAOlB;SAPY,MAAM","sourcesContent":["import { BaseIcon } from './BaseIcon.js';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\n\nimport style from './pf-icon.css';\n\n/**\n * An **icon** component is a container that allows for icons of varying dimensions to\n * seamlessly replace each other without shifting surrounding content.\n *\n * @slot - Slotted content is used as a fallback in case the icon doesn't load\n * @fires load - Fired when an icon is loaded and rendered\n * @fires error - Fired when an icon fails to load\n * @csspart fallback - Container for the fallback (i.e. slotted) content\n */\n@customElement('pf-icon')\nexport class PfIcon extends BaseIcon {\n  public static readonly styles = [...BaseIcon.styles, style];\n\n  public static defaultIconSet = 'fas';\n\n  /** Size of the icon */\n  @property({ reflect: true }) size: 'sm' | 'md' | 'lg' | 'xl' = 'sm';\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-icon': PfIcon;\n  }\n}\n"]}

package/pf-jump-links/pf-jump-links-item.js

@@ -1,4 +1,5 @@
-import { __decorate } from "tslib";
+var _PfJumpLinksItem_instances, _PfJumpLinksItem_internals, _PfJumpLinksItem_onClick, _PfJumpLinksItem_onFocus;
+import { __classPrivateFieldGet, __decorate } from "tslib";
 import { html, LitElement } from 'lit';
 import { customElement } from 'lit/decorators/custom-element.js';
 import { property } from 'lit/decorators/property.js';
@@ -18,37 +19,39 @@ import { observed } from '@patternfly/pfe-core/decorators/observed.js';
 let PfJumpLinksItem = class PfJumpLinksItem extends LitElement {
     constructor() {
         super(...arguments);
+        _PfJumpLinksItem_instances.add(this);
         /** Whether this item is active. */
         this.active = false;
-        this.#internals = new InternalsController(this, {
+        _PfJumpLinksItem_internals.set(this, new InternalsController(this, {
             role: 'listitem'
-        });
+        }));
     }
-    static { this.styles = [style]; }
-    static { this.shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true }; }
-    #internals;
     connectedCallback() {
         super.connectedCallback();
         this.activeChanged();
     }
     render() {
         return html `
-      <a href="${ifDefined(this.href)}" @focus="${this.#onFocus}" @click="${this.#onClick}">
+      <a href="${ifDefined(this.href)}" @focus="${__classPrivateFieldGet(this, _PfJumpLinksItem_instances, "m", _PfJumpLinksItem_onFocus)}" @click="${__classPrivateFieldGet(this, _PfJumpLinksItem_instances, "m", _PfJumpLinksItem_onClick)}">
         <slot></slot>
       </a>
       <slot name="subsection"></slot>
     `;
     }
     activeChanged() {
-        this.#internals.ariaCurrent = this.active ? 'location' : null;
-    }
-    #onClick() {
-        this.dispatchEvent(new Event('select', { bubbles: true }));
-    }
-    #onFocus() {
-        this.dispatchEvent(new Event('focus', { bubbles: true }));
+        __classPrivateFieldGet(this, _PfJumpLinksItem_internals, "f").ariaCurrent = this.active ? 'location' : null;
     }
 };
+_PfJumpLinksItem_internals = new WeakMap();
+_PfJumpLinksItem_instances = new WeakSet();
+_PfJumpLinksItem_onClick = function _PfJumpLinksItem_onClick() {
+    this.dispatchEvent(new Event('select', { bubbles: true }));
+};
+_PfJumpLinksItem_onFocus = function _PfJumpLinksItem_onFocus() {
+    this.dispatchEvent(new Event('focus', { bubbles: true }));
+};
+PfJumpLinksItem.styles = [style];
+PfJumpLinksItem.shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };
 __decorate([
     observed('activeChanged'),
     property({ type: Boolean, reflect: true })

package/pf-jump-links/pf-jump-links-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"pf-jump-links-item.js","sourceRoot":"","sources":["pf-jump-links-item.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAEtD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,OAAO,EAAE,mBAAmB,EAAE,MAAM,0DAA0D,CAAC;;;AAI/F,OAAO,EAAE,QAAQ,EAAE,MAAM,6CAA6C,CAAC;AAEvE;;;;;;;GAOG;AAEH,IAAa,eAAe,GAA5B,MAAa,eAAgB,SAAQ,UAAU;IAA/C;;QAKE,mCAAmC;QAES,WAAM,GAAG,KAAK,CAAC;QAK3D,eAAU,GAAG,IAAI,mBAAmB,CAAC,IAAI,EAAE;YACzC,IAAI,EAAE,UAAU;SACjB,CAAC,CAAC;IA2BL,CAAC;aAxCiB,WAAM,GAAG,CAAC,KAAK,CAAC,AAAV,CAAW;aAEjB,sBAAiB,GAAmB,EAAE,GAAG,UAAU,CAAC,iBAAiB,EAAE,cAAc,EAAE,IAAI,EAAE,AAA5E,CAA6E;IAS9G,UAAU,CAEP;IAEM,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;iBACE,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,QAAQ,aAAa,IAAI,CAAC,QAAQ;;;;KAIpF,CAAC;IACJ,CAAC;IAEO,aAAa;QACnB,IAAI,CAAC,UAAU,CAAC,WAAW,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC;IAChE,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;IAC7D,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;IAC5D,CAAC;;AAjC2C;IAD3C,QAAQ,CAAC,eAAe,CAAC;IACzB,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+CAAgB;AAG9B;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAAe;AAVhC,eAAe;IAD3B,aAAa,CAAC,oBAAoB,CAAC;GACvB,eAAe,CAyC3B;SAzCY,eAAe","sourcesContent":["import { html, LitElement } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\n\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { InternalsController } from '@patternfly/pfe-core/controllers/internals-controller.js';\n\nimport style from './pf-jump-links-item.css';\n\nimport { observed } from '@patternfly/pfe-core/decorators/observed.js';\n\n/**\n * @cssprop --pf-c-jump-links__link--PaddingTop -- padding around the link\n * @cssprop --pf-c-jump-links__link--PaddingRight\n * @cssprop --pf-c-jump-links__link--PaddingBottom\n * @cssprop --pf-c-jump-links__link--PaddingLeft\n * @cssprop --pf-c-jump-links__link--OutlineOffset\n * @cssprop --pf-c-jump-links__link-text--Color\n */\n@customElement('pf-jump-links-item')\nexport class PfJumpLinksItem extends LitElement {\n  static readonly styles = [style];\n\n  static readonly shadowRootOptions: ShadowRootInit = { ...LitElement.shadowRootOptions, delegatesFocus: true };\n\n  /** Whether this item is active. */\n  @observed('activeChanged')\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  /** hypertext reference for this link */\n  @property({ reflect: true }) href?: string;\n\n  #internals = new InternalsController(this, {\n    role: 'listitem'\n  });\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.activeChanged();\n  }\n\n  render() {\n    return html`\n      <a href=\"${ifDefined(this.href)}\" @focus=\"${this.#onFocus}\" @click=\"${this.#onClick}\">\n        <slot></slot>\n      </a>\n      <slot name=\"subsection\"></slot>\n    `;\n  }\n\n  private activeChanged() {\n    this.#internals.ariaCurrent = this.active ? 'location' : null;\n  }\n\n  #onClick() {\n    this.dispatchEvent(new Event('select', { bubbles: true }));\n  }\n\n  #onFocus() {\n    this.dispatchEvent(new Event('focus', { bubbles: true }));\n  }\n}\n\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-jump-links-item': PfJumpLinksItem;\n  }\n}\n"]}
+{"version":3,"file":"pf-jump-links-item.js","sourceRoot":"","sources":["pf-jump-links-item.ts"],"names":[],"mappings":";;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AAEtD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,OAAO,EAAE,mBAAmB,EAAE,MAAM,0DAA0D,CAAC;;;AAI/F,OAAO,EAAE,QAAQ,EAAE,MAAM,6CAA6C,CAAC;AAEvE;;;;;;;GAOG;AAEH,IAAa,eAAe,GAA5B,MAAa,eAAgB,SAAQ,UAAU;IAA/C;;;QAKE,mCAAmC;QAES,WAAM,GAAG,KAAK,CAAC;QAK3D,qCAAa,IAAI,mBAAmB,CAAC,IAAI,EAAE;YACzC,IAAI,EAAE,UAAU;SACjB,CAAC,EAAC;IA2BL,CAAC;IAzBU,iBAAiB;QACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;iBACE,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,uBAAA,IAAI,4DAAS,aAAa,uBAAA,IAAI,4DAAS;;;;KAIpF,CAAC;IACJ,CAAC;IAEO,aAAa;QACnB,uBAAA,IAAI,kCAAW,CAAC,WAAW,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC;IAChE,CAAC;;;;;IAGC,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;AAC7D,CAAC;;IAGC,IAAI,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;AAC5D,CAAC;AAvCe,sBAAM,GAAG,CAAC,KAAK,CAAC,AAAV,CAAW;AAEjB,iCAAiB,GAAmB,EAAE,GAAG,UAAU,CAAC,iBAAiB,EAAE,cAAc,EAAE,IAAI,EAAE,AAA5E,CAA6E;AAIlE;IAD3C,QAAQ,CAAC,eAAe,CAAC;IACzB,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;+CAAgB;AAG9B;IAA5B,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAAe;AAVhC,eAAe;IAD3B,aAAa,CAAC,oBAAoB,CAAC;GACvB,eAAe,CAyC3B;SAzCY,eAAe","sourcesContent":["import { html, LitElement } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\n\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { InternalsController } from '@patternfly/pfe-core/controllers/internals-controller.js';\n\nimport style from './pf-jump-links-item.css';\n\nimport { observed } from '@patternfly/pfe-core/decorators/observed.js';\n\n/**\n * @cssprop --pf-c-jump-links__link--PaddingTop -- padding around the link\n * @cssprop --pf-c-jump-links__link--PaddingRight\n * @cssprop --pf-c-jump-links__link--PaddingBottom\n * @cssprop --pf-c-jump-links__link--PaddingLeft\n * @cssprop --pf-c-jump-links__link--OutlineOffset\n * @cssprop --pf-c-jump-links__link-text--Color\n */\n@customElement('pf-jump-links-item')\nexport class PfJumpLinksItem extends LitElement {\n  static readonly styles = [style];\n\n  static readonly shadowRootOptions: ShadowRootInit = { ...LitElement.shadowRootOptions, delegatesFocus: true };\n\n  /** Whether this item is active. */\n  @observed('activeChanged')\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  /** hypertext reference for this link */\n  @property({ reflect: true }) href?: string;\n\n  #internals = new InternalsController(this, {\n    role: 'listitem'\n  });\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.activeChanged();\n  }\n\n  render() {\n    return html`\n      <a href=\"${ifDefined(this.href)}\" @focus=\"${this.#onFocus}\" @click=\"${this.#onClick}\">\n        <slot></slot>\n      </a>\n      <slot name=\"subsection\"></slot>\n    `;\n  }\n\n  private activeChanged() {\n    this.#internals.ariaCurrent = this.active ? 'location' : null;\n  }\n\n  #onClick() {\n    this.dispatchEvent(new Event('select', { bubbles: true }));\n  }\n\n  #onFocus() {\n    this.dispatchEvent(new Event('focus', { bubbles: true }));\n  }\n}\n\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-jump-links-item': PfJumpLinksItem;\n  }\n}\n"]}

package/pf-jump-links/pf-jump-links-list.js

@@ -9,7 +9,6 @@ const style = css `:host{display:block}#container{display:contents;--pf-c-jump-l
  * @cssprop --pf-c-jump-links__list__list__link--PaddingLeft
  */
 let PfJumpLinksList = class PfJumpLinksList extends LitElement {
-    static { this.styles = [style]; }
     render() {
         return html `
       <div id="container" role="listbox">
@@ -18,6 +17,7 @@ let PfJumpLinksList = class PfJumpLinksList extends LitElement {
     `;
     }
 };
+PfJumpLinksList.styles = [style];
 PfJumpLinksList = __decorate([
     customElement('pf-jump-links-list')
 ], PfJumpLinksList);

package/pf-jump-links/pf-jump-links-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"pf-jump-links-list.js","sourceRoot":"","sources":["pf-jump-links-list.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;;;AAIjE;;;;GAIG;AAEH,IAAa,eAAe,GAA5B,MAAa,eAAgB,SAAQ,UAAU;aAC7B,WAAM,GAAG,CAAC,KAAK,CAAC,AAAV,CAAW;IAEjC,MAAM;QACJ,OAAO,IAAI,CAAA;;;;KAIV,CAAC;IACJ,CAAC;;AATU,eAAe;IAD3B,aAAa,CAAC,oBAAoB,CAAC;GACvB,eAAe,CAU3B;SAVY,eAAe","sourcesContent":["import { html, LitElement } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\n\nimport style from './pf-jump-links-list.css';\n\n/**\n * @cssprop --pf-c-jump-links__list__list__link--PaddingTop -- padding around each link\n * @cssprop --pf-c-jump-links__list__list__link--PaddingBottom\n * @cssprop --pf-c-jump-links__list__list__link--PaddingLeft\n */\n@customElement('pf-jump-links-list')\nexport class PfJumpLinksList extends LitElement {\n  static readonly styles = [style];\n\n  render() {\n    return html`\n      <div id=\"container\" role=\"listbox\">\n        <slot></slot>\n      </div>\n    `;\n  }\n}\n\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-jump-links-list': PfJumpLinksList;\n  }\n}\n"]}
+{"version":3,"file":"pf-jump-links-list.js","sourceRoot":"","sources":["pf-jump-links-list.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;;;AAIjE;;;;GAIG;AAEH,IAAa,eAAe,GAA5B,MAAa,eAAgB,SAAQ,UAAU;IAG7C,MAAM;QACJ,OAAO,IAAI,CAAA;;;;KAIV,CAAC;IACJ,CAAC;;AARe,sBAAM,GAAG,CAAC,KAAK,CAAC,AAAV,CAAW;AADtB,eAAe;IAD3B,aAAa,CAAC,oBAAoB,CAAC;GACvB,eAAe,CAU3B;SAVY,eAAe","sourcesContent":["import { html, LitElement } from 'lit';\nimport { customElement } from 'lit/decorators/custom-element.js';\n\nimport style from './pf-jump-links-list.css';\n\n/**\n * @cssprop --pf-c-jump-links__list__list__link--PaddingTop -- padding around each link\n * @cssprop --pf-c-jump-links__list__list__link--PaddingBottom\n * @cssprop --pf-c-jump-links__list__list__link--PaddingLeft\n */\n@customElement('pf-jump-links-list')\nexport class PfJumpLinksList extends LitElement {\n  static readonly styles = [style];\n\n  render() {\n    return html`\n      <div id=\"container\" role=\"listbox\">\n        <slot></slot>\n      </div>\n    `;\n  }\n}\n\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-jump-links-list': PfJumpLinksList;\n  }\n}\n"]}