@carbon/ibm-products-web-components 0.35.0 → 0.36.0

package/es/components/coachmark/coachmark.js

@@ -1,138 +1,111 @@
 /**
- * Copyright IBM Corp. 2024
+ * Copyright IBM Corp. 2020, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
-import { __decorate } from 'tslib';
-import { LitElement, html } from 'lit';
-import { property } from 'lit/decorators.js';
-import { prefix } from '../../globals/settings.js';
-import HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener.js';
-import { carbonElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';
-import styles from './coachmark.scss.js';
-import { SignalWatcher } from '@lit-labs/signals';
-import '@carbon/web-components/es/components/popover/index.js';
-import { POPOVER_ALIGNMENT } from '@carbon/web-components/es/components/popover/defs.js';
-import { makeDraggable } from '../../utilities/makeDraggable/makeDraggable.js';
-import { resetCoachmarkDetailsSignal, updateCoachmarkDetailsSignal } from './coachmark-context.js';
+import { prefix } from "../../globals/settings.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
+import coachmark_default$1 from "./coachmark.scss.js";
+import { makeDraggable } from "../../utilities/makeDraggable/makeDraggable.js";
+import { resetCoachmarkDetailsSignal, updateCoachmarkDetailsSignal } from "./coachmark-context.js";
+import { LitElement, html } from "lit";
+import { property } from "lit/decorators.js";
+import HostListenerMixin from "@carbon/web-components/es/globals/mixins/host-listener.js";
+import { carbonElement } from "@carbon/web-components/es/globals/decorators/carbon-element.js";
+import { SignalWatcher } from "@lit-labs/signals";
+import "@carbon/web-components/es/components/popover/index.js";
+import { POPOVER_ALIGNMENT } from "@carbon/web-components/es/components/popover/defs.js";
 
+//#region src/components/coachmark/coachmark.ts
 /**
- * @license
- *
- * Copyright IBM Corp. 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
+* @license
+*
+* Copyright IBM Corp. 2025
+*
+* This source code is licensed under the Apache-2.0 license found in the
+* LICENSE file in the root directory of this source tree.
+*/
 const blockClass = `${prefix}--coachmark`;
 /**
- * coachmark main component
- * @element c4p-coachmark
- * @fires c4p-coachmark-opened
- *   The custom event fired when the coachmark is opened.
- *   This event can be used to perform actions such as focusing elements when the coachmark becomes visible.
- */
+* coachmark main component
+* @element c4p-coachmark
+* @fires c4p-coachmark-opened
+*   The custom event fired when the coachmark is opened.
+*   This event can be used to perform actions such as focusing elements when the coachmark becomes visible.
+*/
 let CDSCoachmark = class CDSCoachmark extends SignalWatcher(HostListenerMixin(LitElement)) {
-    constructor() {
-        super(...arguments);
-        /**
-         * Specifies whether the component is currently open.
-         */
-        this.open = false;
-        /**
-         * Where to render the Coachmark relative to its target.
-         */
-        this.align = POPOVER_ALIGNMENT.TOP;
-        /**
-         * Specifies whether the component is floating or not.
-         */
-        this.floating = false;
-        /**
-         * Specify whether the component should be rendered on high-contrast.
-         */
-        this.highContrast = false;
-        /**
-         * Specify whether a drop shadow should be rendered on the popover.
-         */
-        this.dropShadow = false;
-        this.dragCleanup = null;
-    }
-    disconnectedCallback() {
-        super.disconnectedCallback();
-        if (this.dragCleanup) {
-            this.dragCleanup();
-        }
-        resetCoachmarkDetailsSignal();
-    }
-    setupDraggable() {
-        var _a;
-        const popover = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(`.${blockClass}--popover`);
-        const popoverContent = popover.querySelector('cds-popover-content');
-        const wrapper = popoverContent.querySelector(`.${blockClass}--wrapper`);
-        const slot = wrapper.querySelector('slot');
-        const assignedElements = slot === null || slot === void 0 ? void 0 : slot.assignedElements({ flatten: true });
-        const header = assignedElements === null || assignedElements === void 0 ? void 0 : assignedElements.find((el) => el.tagName.toLowerCase() === `${prefix}-coachmark-header`);
-        requestAnimationFrame(() => {
-            var _a;
-            const dragHandle = (_a = header.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(`.${prefix}--coachmark-header-drag-handle`);
-            const draggable = makeDraggable({
-                el: popoverContent,
-                dragHandle: header,
-                focusableDragHandle: dragHandle,
-            });
-            const onDragStart = () => {
-                popoverContent.classList.add('is-dragging');
-                popoverContent.setAttribute('aria-label', 'Picked up the draggable popoverContent');
-            };
-            const onDragEnd = () => {
-                popoverContent.classList.remove('is-dragging');
-                popoverContent.setAttribute('aria-label', 'Draggable popoverContent was dropped');
-            };
-            popoverContent.addEventListener('dragstart', onDragStart);
-            popoverContent.addEventListener('dragend', onDragEnd);
-            // store cleanup
-            this.dragCleanup = () => {
-                var _a;
-                popoverContent.removeEventListener('dragstart', onDragStart);
-                popoverContent.removeEventListener('dragend', onDragEnd);
-                (_a = draggable.cleanup) === null || _a === void 0 ? void 0 : _a.call(draggable);
-            };
-        });
-    }
-    firstUpdated() {
-        if (this.floating) {
-            this.classList.add(`${blockClass}--floating`);
-            this.setupDraggable();
-            updateCoachmarkDetailsSignal({
-                name: 'floating',
-                detail: this.floating,
-            });
-        }
-    }
-    updated(changedProps) {
-        var _a;
-        if (changedProps.has('position')) {
-            const { x = 0, y = 0 } = (_a = this.position) !== null && _a !== void 0 ? _a : {};
-            if (x !== 0 || y !== 0) {
-                this.style.transform = `translate(${x}px, ${y}px)`;
-            }
-        }
-        // Dispatch custom events when coachmark opens or closes
-        if (changedProps.has('open')) {
-            const init = {
-                bubbles: true,
-                composed: true,
-                detail: { open: this.open },
-            };
-            if (this.open) {
-                this.dispatchEvent(new CustomEvent(this.constructor.eventOpen, init));
-            }
-        }
-    }
-    render() {
-        return html `
+	constructor(..._args) {
+		super(..._args);
+		this.open = false;
+		this.align = POPOVER_ALIGNMENT.TOP;
+		this.floating = false;
+		this.highContrast = false;
+		this.dropShadow = false;
+		this.dragCleanup = null;
+		this._handlePopoverClosed = (event) => {
+			if (this.floating) event.preventDefault();
+		};
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		if (this.dragCleanup) this.dragCleanup();
+		resetCoachmarkDetailsSignal();
+	}
+	setupDraggable() {
+		const popoverContent = (this.shadowRoot?.querySelector(`.${blockClass}--popover`)).querySelector("cds-popover-content");
+		const header = (popoverContent.querySelector(`.${blockClass}--wrapper`).querySelector("slot")?.assignedElements({ flatten: true }))?.find((el) => el.tagName.toLowerCase() === `${prefix}-coachmark-header`);
+		requestAnimationFrame(() => {
+			const dragHandle = header.shadowRoot?.querySelector(`.${prefix}--coachmark-header-drag-handle`);
+			const draggable = makeDraggable({
+				el: popoverContent,
+				dragHandle: header,
+				focusableDragHandle: dragHandle
+			});
+			const onDragStart = () => {
+				popoverContent.classList.add("is-dragging");
+				popoverContent.setAttribute("aria-label", "Picked up the draggable popoverContent");
+			};
+			const onDragEnd = () => {
+				popoverContent.classList.remove("is-dragging");
+				popoverContent.setAttribute("aria-label", "Draggable popoverContent was dropped");
+			};
+			popoverContent.addEventListener("dragstart", onDragStart);
+			popoverContent.addEventListener("dragend", onDragEnd);
+			this.dragCleanup = () => {
+				popoverContent.removeEventListener("dragstart", onDragStart);
+				popoverContent.removeEventListener("dragend", onDragEnd);
+				draggable.cleanup?.();
+			};
+		});
+	}
+	firstUpdated() {
+		if (this.floating) {
+			this.classList.add(`${blockClass}--floating`);
+			this.setupDraggable();
+			updateCoachmarkDetailsSignal({
+				name: "floating",
+				detail: this.floating
+			});
+		}
+	}
+	updated(changedProps) {
+		if (changedProps.has("position")) {
+			const { x = 0, y = 0 } = this.position ?? {};
+			if (x !== 0 || y !== 0) this.style.transform = `translate(${x}px, ${y}px)`;
+		}
+		if (changedProps.has("open")) {
+			const init = {
+				bubbles: true,
+				composed: true,
+				detail: { open: this.open }
+			};
+			if (this.open) this.dispatchEvent(new CustomEvent(this.constructor.eventOpen, init));
+		}
+	}
+	render() {
+		return html`
       <cds-popover
         class="${blockClass}--popover"
         ?open=${this.open}
@@ -140,6 +113,7 @@ let CDSCoachmark = class CDSCoachmark extends SignalWatcher(HostListenerMixin(Li
         ?highContrast=${this.highContrast}
         align=${this.align}
         ?dropShadow=${this.dropShadow}
+        @cds-popover-beingclosed=${this._handlePopoverClosed}
       >
         <slot name="trigger"></slot>
         <cds-popover-content>
@@ -149,37 +123,35 @@ let CDSCoachmark = class CDSCoachmark extends SignalWatcher(HostListenerMixin(Li
         </cds-popover-content>
       </cds-popover>
     `;
-    }
-    /**
-     * The name of the custom event fired when this coachmark is opened.
-     */
-    static get eventOpen() {
-        return `${prefix}-coachmark-opened`;
-    }
+	}
+	/**
+	* The name of the custom event fired when this coachmark is opened.
+	*/
+	static get eventOpen() {
+		return `${prefix}-coachmark-opened`;
+	}
+	static {
+		this.styles = coachmark_default$1;
+	}
 };
-CDSCoachmark.styles = styles;
-__decorate([
-    property({ type: Boolean, reflect: true })
-], CDSCoachmark.prototype, "open", void 0);
-__decorate([
-    property({ reflect: true, type: String })
-], CDSCoachmark.prototype, "align", void 0);
-__decorate([
-    property({ type: Object })
-], CDSCoachmark.prototype, "position", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true })
-], CDSCoachmark.prototype, "floating", void 0);
-__decorate([
-    property({ reflect: true })
-], CDSCoachmark.prototype, "highContrast", void 0);
-__decorate([
-    property({ reflect: true })
-], CDSCoachmark.prototype, "dropShadow", void 0);
-CDSCoachmark = __decorate([
-    carbonElement(`${prefix}-coachmark`)
-], CDSCoachmark);
-var CDSCoachmark_default = CDSCoachmark;
+__decorate([property({
+	type: Boolean,
+	reflect: true
+})], CDSCoachmark.prototype, "open", void 0);
+__decorate([property({
+	reflect: true,
+	type: String
+})], CDSCoachmark.prototype, "align", void 0);
+__decorate([property({ type: Object })], CDSCoachmark.prototype, "position", void 0);
+__decorate([property({
+	type: Boolean,
+	reflect: true
+})], CDSCoachmark.prototype, "floating", void 0);
+__decorate([property({ reflect: true })], CDSCoachmark.prototype, "highContrast", void 0);
+__decorate([property({ reflect: true })], CDSCoachmark.prototype, "dropShadow", void 0);
+CDSCoachmark = __decorate([carbonElement(`${prefix}-coachmark`)], CDSCoachmark);
+var coachmark_default = CDSCoachmark;
 
-export { blockClass, CDSCoachmark_default as default };
-//# sourceMappingURL=coachmark.js.map
+//#endregion
+export { blockClass, coachmark_default as default };
+//# sourceMappingURL=coachmark.js.map

package/es/components/coachmark/coachmark.js.map

@@ -1 +1 @@
-{"version":3,"file":"coachmark.js","sources":["../../../src/components/coachmark/coachmark.ts"],"sourcesContent":[null],"names":["customElement"],"mappings":"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"}
+{"version":3,"file":"coachmark.js","names":["styles","customElement"],"sources":["../../../src/components/coachmark/coachmark.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2025\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListenerMixin from '@carbon/web-components/es/globals/mixins/host-listener.js';\nimport { carbonElement as customElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';\nimport styles from './coachmark.scss?lit';\nimport { SignalWatcher } from '@lit-labs/signals';\nimport '@carbon/web-components/es/components/popover/index.js';\nimport { POPOVER_ALIGNMENT } from '@carbon/web-components/es/components/popover/defs.js';\nimport { makeDraggable } from '../../utilities/makeDraggable/makeDraggable';\nimport {\n  resetCoachmarkDetailsSignal,\n  updateCoachmarkDetailsSignal,\n} from './coachmark-context';\n\nexport const blockClass = `${prefix}--coachmark`;\n\n/**\n * coachmark main component\n * @element c4p-coachmark\n * @fires c4p-coachmark-opened\n *   The custom event fired when the coachmark is opened.\n *   This event can be used to perform actions such as focusing elements when the coachmark becomes visible.\n */\n@customElement(`${prefix}-coachmark`)\nclass CDSCoachmark extends SignalWatcher(HostListenerMixin(LitElement)) {\n  /**\n   * Specifies whether the component is currently open.\n   */\n  @property({ type: Boolean, reflect: true })\n  open: boolean = false;\n  /**\n   * Where to render the Coachmark relative to its target.\n   */\n  @property({ reflect: true, type: String })\n  align?: string = POPOVER_ALIGNMENT.TOP;\n  /**\n   * Fine tune the position of the target in pixels.\n   */\n  @property({ type: Object })\n  position?: { x: number; y: number };\n  /**\n   * Specifies whether the component is floating or not.\n   */\n  @property({ type: Boolean, reflect: true })\n  floating?: boolean = false;\n  /**\n   * Specify whether the component should be rendered on high-contrast.\n   */\n  @property({ reflect: true })\n  highContrast?: boolean = false;\n\n  /**\n   * Specify whether a drop shadow should be rendered on the popover.\n   */\n  @property({ reflect: true })\n  dropShadow?: boolean = false;\n\n  private dragCleanup: (() => void) | null = null;\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    if (this.dragCleanup) {\n      this.dragCleanup();\n    }\n    resetCoachmarkDetailsSignal();\n  }\n\n  private setupDraggable() {\n    const popover = this.shadowRoot?.querySelector(\n      `.${blockClass}--popover`\n    ) as HTMLElement;\n    const popoverContent = popover.querySelector(\n      'cds-popover-content'\n    ) as HTMLElement;\n    const wrapper = popoverContent.querySelector(\n      `.${blockClass}--wrapper`\n    ) as HTMLElement;\n    const slot = wrapper.querySelector('slot');\n    const assignedElements = slot?.assignedElements({ flatten: true });\n    const header = assignedElements?.find(\n      (el) => el.tagName.toLowerCase() === `${prefix}-coachmark-header`\n    ) as HTMLElement;\n    requestAnimationFrame(() => {\n      const dragHandle = header.shadowRoot?.querySelector(\n        `.${prefix}--coachmark-header-drag-handle`\n      ) as HTMLElement;\n\n      const draggable = makeDraggable({\n        el: popoverContent,\n        dragHandle: header,\n        focusableDragHandle: dragHandle,\n      });\n\n      const onDragStart = () => {\n        popoverContent.classList.add('is-dragging');\n        popoverContent.setAttribute(\n          'aria-label',\n          'Picked up the draggable popoverContent'\n        );\n      };\n      const onDragEnd = () => {\n        popoverContent.classList.remove('is-dragging');\n        popoverContent.setAttribute(\n          'aria-label',\n          'Draggable popoverContent was dropped'\n        );\n      };\n\n      popoverContent.addEventListener('dragstart', onDragStart);\n      popoverContent.addEventListener('dragend', onDragEnd);\n\n      // store cleanup\n      this.dragCleanup = () => {\n        popoverContent.removeEventListener('dragstart', onDragStart);\n        popoverContent.removeEventListener('dragend', onDragEnd);\n        draggable.cleanup?.();\n      };\n    });\n  }\n\n  firstUpdated() {\n    if (this.floating) {\n      this.classList.add(`${blockClass}--floating`);\n      this.setupDraggable();\n      updateCoachmarkDetailsSignal({\n        name: 'floating',\n        detail: this.floating,\n      });\n    }\n  }\n\n  updated(changedProps: Map<string, unknown>) {\n    if (changedProps.has('position')) {\n      const { x = 0, y = 0 } = this.position ?? {};\n      if (x !== 0 || y !== 0) {\n        this.style.transform = `translate(${x}px, ${y}px)`;\n      }\n    }\n\n    // Dispatch custom events when coachmark opens or closes\n    if (changedProps.has('open')) {\n      const init = {\n        bubbles: true,\n        composed: true,\n        detail: { open: this.open },\n      };\n\n      if (this.open) {\n        this.dispatchEvent(\n          new CustomEvent(\n            (this.constructor as typeof CDSCoachmark).eventOpen,\n            init\n          )\n        );\n      }\n    }\n  }\n\n  private _handlePopoverClosed = (event: Event) => {\n    // Prevent closing on outside click when floating\n    if (this.floating) {\n      event.preventDefault();\n    }\n  };\n\n  render() {\n    return html`\n      <cds-popover\n        class=\"${blockClass}--popover\"\n        ?open=${this.open}\n        .caret=${this.floating === true ? false : true}\n        ?highContrast=${this.highContrast}\n        align=${this.align}\n        ?dropShadow=${this.dropShadow}\n        @cds-popover-beingclosed=${this._handlePopoverClosed}\n      >\n        <slot name=\"trigger\"></slot>\n        <cds-popover-content>\n          <div class=\"${blockClass}--wrapper\">\n            <slot></slot>\n          </div>\n        </cds-popover-content>\n      </cds-popover>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired when this coachmark is opened.\n   */\n  static get eventOpen() {\n    return `${prefix}-coachmark-opened`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSCoachmark;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAa,aAAa,GAAG,OAAO;;;;;;;;AASpC,yBACM,qBAAqB,cAAc,kBAAkB,WAAW,CAAC,CAAC;;;cAKtD;eAKC,kBAAkB;kBAUd;sBAKI;oBAMF;qBAEoB;+BAqGX,UAAiB;AAE/C,OAAI,KAAK,SACP,OAAM,gBAAgB;;;CAtG1B,uBAAuB;AACrB,QAAM,sBAAsB;AAC5B,MAAI,KAAK,YACP,MAAK,aAAa;AAEpB,+BAA6B;;CAG/B,AAAQ,iBAAiB;EAIvB,MAAM,kBAHU,KAAK,YAAY,cAC/B,IAAI,WAAW,WAChB,EAC8B,cAC7B,sBACD;EAMD,MAAM,UALU,eAAe,cAC7B,IAAI,WAAW,WAChB,CACoB,cAAc,OAAO,EACX,iBAAiB,EAAE,SAAS,MAAM,CAAC,GACjC,MAC9B,OAAO,GAAG,QAAQ,aAAa,KAAK,GAAG,OAAO,mBAChD;AACD,8BAA4B;GAC1B,MAAM,aAAa,OAAO,YAAY,cACpC,IAAI,OAAO,gCACZ;GAED,MAAM,YAAY,cAAc;IAC9B,IAAI;IACJ,YAAY;IACZ,qBAAqB;IACtB,CAAC;GAEF,MAAM,oBAAoB;AACxB,mBAAe,UAAU,IAAI,cAAc;AAC3C,mBAAe,aACb,cACA,yCACD;;GAEH,MAAM,kBAAkB;AACtB,mBAAe,UAAU,OAAO,cAAc;AAC9C,mBAAe,aACb,cACA,uCACD;;AAGH,kBAAe,iBAAiB,aAAa,YAAY;AACzD,kBAAe,iBAAiB,WAAW,UAAU;AAGrD,QAAK,oBAAoB;AACvB,mBAAe,oBAAoB,aAAa,YAAY;AAC5D,mBAAe,oBAAoB,WAAW,UAAU;AACxD,cAAU,WAAW;;IAEvB;;CAGJ,eAAe;AACb,MAAI,KAAK,UAAU;AACjB,QAAK,UAAU,IAAI,GAAG,WAAW,YAAY;AAC7C,QAAK,gBAAgB;AACrB,gCAA6B;IAC3B,MAAM;IACN,QAAQ,KAAK;IACd,CAAC;;;CAIN,QAAQ,cAAoC;AAC1C,MAAI,aAAa,IAAI,WAAW,EAAE;GAChC,MAAM,EAAE,IAAI,GAAG,IAAI,MAAM,KAAK,YAAY,EAAE;AAC5C,OAAI,MAAM,KAAK,MAAM,EACnB,MAAK,MAAM,YAAY,aAAa,EAAE,MAAM,EAAE;;AAKlD,MAAI,aAAa,IAAI,OAAO,EAAE;GAC5B,MAAM,OAAO;IACX,SAAS;IACT,UAAU;IACV,QAAQ,EAAE,MAAM,KAAK,MAAM;IAC5B;AAED,OAAI,KAAK,KACP,MAAK,cACH,IAAI,YACD,KAAK,YAAoC,WAC1C,KACD,CACF;;;CAYP,SAAS;AACP,SAAO,IAAI;;iBAEE,WAAW;gBACZ,KAAK,KAAK;iBACT,KAAK,aAAa,OAAO,QAAQ,KAAK;wBAC/B,KAAK,aAAa;gBAC1B,KAAK,MAAM;sBACL,KAAK,WAAW;mCACH,KAAK,qBAAqB;;;;wBAIrC,WAAW;;;;;;;;;;CAWjC,WAAW,YAAY;AACrB,SAAO,GAAG,OAAO;;;gBAGHA;;;YArKf,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC;YAK1C,SAAS;CAAE,SAAS;CAAM,MAAM;CAAQ,CAAC;YAKzC,SAAS,EAAE,MAAM,QAAQ,CAAC;YAK1B,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC;YAK1C,SAAS,EAAE,SAAS,MAAM,CAAC;YAM3B,SAAS,EAAE,SAAS,MAAM,CAAC;2BA/B7BC,cAAc,GAAG,OAAO,YAAY;AA6KrC,wBAAe"}

package/es/components/coachmark/coachmark.scss.js

@@ -1,13 +1,15 @@
 /**
- * Copyright IBM Corp. 2024
+ * Copyright IBM Corp. 2020, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
-import { css } from 'lit';
+import { css } from "lit";
 
-var styles = css([".c4p--coachmark-beacon{position:relative}.c4p--coachmark-beacon-default .c4p--coachmark-beacon__target:before{display:none}.c4p--coachmark-beacon-default .c4p--coachmark-beacon__target:after{background-color:#4589ff;block-size:.75rem;border-radius:50%;content:\"\";inline-size:.75rem;inset-block-start:.625rem;inset-inline-start:.625rem;position:absolute}.c4p--coachmark-beacon-default .c4p--coachmark-beacon__target:focus{outline:transparent}.c4p--coachmark-beacon-default .c4p--coachmark-beacon__target:focus:before{block-size:18px;border-radius:100%;content:\"\";display:block;inline-size:18px;inset-block-start:7px;inset-inline-start:7px;outline:.125rem var(--cds-focus,#0f62fe) solid;position:absolute}.c4p--coachmark-beacon .c4p--coachmark-beacon__target{background-color:transparent;block-size:2rem;border:none;border-radius:50%;cursor:pointer;display:flex;inline-size:2rem;padding:0}.c4p--coachmark-beacon .c4p--coachmark-beacon__target[aria-expanded=true] circle{animation:none}.c4p--coachmark-beacon__center{block-size:5rem;inline-size:5rem;inset-block-start:-1.375rem;inset-inline-start:-1.375rem;pointer-events:none;position:absolute;z-index:6900}.c4p--coachmark-beacon__center circle{animation:ripple 2s infinite;fill:var(--cds-support-info,#0043ce);fill-opacity:0;-webkit-mask-image:none;mask-image:none;stroke:var(--cds-support-info,#0043ce);stroke-opacity:0;stroke-width:1px;transition-timing-function:motion exit,productive}@media (prefers-reduced-motion){.c4p--coachmark-beacon__center circle{animation:none}}@keyframes ripple{0%{fill-opacity:0;r:1px;stroke-opacity:0;transition-timing-function:cubic-bezier(0,0,.38,.9)}31%{fill-opacity:.2;stroke-opacity:1}62%{fill-opacity:0;r:32px;stroke-opacity:0}to{fill-opacity:0;r:32px;stroke-opacity:0}}@keyframes ring-ripple{0%{fill-opacity:0;r:12px;stroke-opacity:0;transition-timing-function:cubic-bezier(0,0,.38,.9)}31%{fill-opacity:.2;stroke-opacity:1}62%{fill-opacity:0;r:32px;stroke-opacity:0}to{fill-opacity:0;r:32px;stroke-opacity:0}}:host{display:inline-block}.c4p--coachmark--popover{position:fixed}.c4p--coachmark--popover cds-popover-content.is-dragging::part(content){border-radius:0;box-shadow:0 0 0 .125rem var(--cds-icon-inverse,#fff),0 0 0 .25rem var(--cds-background-inverse,#393939)}"]);
+//#region src/components/coachmark/coachmark.scss?lit
+var coachmark_default = css([".c4p--coachmark-beacon{position:relative}.c4p--coachmark-beacon-default .c4p--coachmark-beacon__target:before{display:none}.c4p--coachmark-beacon-default .c4p--coachmark-beacon__target:after{background-color:#4589ff;block-size:.75rem;border-radius:50%;content:\"\";inline-size:.75rem;inset-block-start:.625rem;inset-inline-start:.625rem;position:absolute}.c4p--coachmark-beacon-default .c4p--coachmark-beacon__target:focus{outline:transparent}.c4p--coachmark-beacon-default .c4p--coachmark-beacon__target:focus:before{block-size:18px;border-radius:100%;content:\"\";display:block;inline-size:18px;inset-block-start:7px;inset-inline-start:7px;outline:.125rem var(--cds-focus,#0f62fe) solid;position:absolute}.c4p--coachmark-beacon .c4p--coachmark-beacon__target{background-color:transparent;block-size:2rem;border:none;border-radius:50%;cursor:pointer;display:flex;inline-size:2rem;padding:0}.c4p--coachmark-beacon .c4p--coachmark-beacon__target[aria-expanded=true] circle{animation:none}.c4p--coachmark-beacon__center{block-size:5rem;inline-size:5rem;inset-block-start:-1.375rem;inset-inline-start:-1.375rem;pointer-events:none;position:absolute;z-index:6900}.c4p--coachmark-beacon__center circle{animation:ripple 2s infinite;fill:var(--cds-support-info,#0043ce);fill-opacity:0;-webkit-mask-image:none;mask-image:none;stroke:var(--cds-support-info,#0043ce);stroke-opacity:0;stroke-width:1px;transition-timing-function:motion exit,productive}@media (prefers-reduced-motion){.c4p--coachmark-beacon__center circle{animation:none}}@keyframes ripple{0%{fill-opacity:0;r:1px;stroke-opacity:0;transition-timing-function:cubic-bezier(0,0,.38,.9)}31%{fill-opacity:.2;stroke-opacity:1}62%{fill-opacity:0;r:32px;stroke-opacity:0}to{fill-opacity:0;r:32px;stroke-opacity:0}}@keyframes ring-ripple{0%{fill-opacity:0;r:12px;stroke-opacity:0;transition-timing-function:cubic-bezier(0,0,.38,.9)}31%{fill-opacity:.2;stroke-opacity:1}62%{fill-opacity:0;r:32px;stroke-opacity:0}to{fill-opacity:0;r:32px;stroke-opacity:0}}:host{display:inline-block}.c4p--coachmark--popover{position:fixed}.c4p--coachmark--popover cds-popover-content.is-dragging::part(content){border-radius:0;box-shadow:0 0 0 .125rem var(--cds-icon-inverse,#fff),0 0 0 .25rem var(--cds-background-inverse,#393939)}"]);
 
-export { styles as default };
-//# sourceMappingURL=coachmark.scss.js.map
+//#endregion
+export { coachmark_default as default };
+//# sourceMappingURL=coachmark.scss.js.map

package/es/components/coachmark/coachmark.scss.js.map

@@ -1 +1 @@
-{"version":3,"file":"coachmark.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}
+{"version":3,"file":"coachmark.scss.js","names":[],"sources":["../../../src/components/coachmark/coachmark.scss?lit"],"sourcesContent":["//\n// Copyright IBM Corp. 2025\n//\n// This source code is licensed under the Apache-2.0 license found in the\n// LICENSE file in the root directory of this source tree.\n//\n\n$css--plex: true !default;\n\n@use '@carbon/styles/scss/spacing' as *;\n@use '@carbon/styles/scss/theme' as *;\n@use '@carbon/ibm-products-styles/scss/config';\n@use '@carbon/ibm-products-styles/scss/components/Coachmark/_coachmark-beacon';\n\n$prefix: config.$pkg-prefix;\n$carbon-prefix: config.$carbon-prefix;\n\n$block-class: #{$prefix}--coachmark;\n\n:host {\n  display: inline-block;\n}\n\n.#{$block-class}--popover {\n  position: fixed;\n\n  /* stylelint-disable-next-line selector-type-no-unknown */\n  #{$carbon-prefix}-popover-content.is-dragging::part(content) {\n    border-radius: 0;\n    box-shadow:\n      0 0 0 $spacing-01 $icon-inverse,\n      0 0 0 $spacing-02 $background-inverse;\n  }\n}\n"],"mappings":""}

package/es/components/coachmark/index.d.ts

@@ -9,3 +9,4 @@
 import './coachmark';
 import './coachmark-header';
 import './coachmark-body';
+//# sourceMappingURL=index.d.ts.map

package/es/components/coachmark/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/coachmark/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,aAAa,CAAC;AACrB,OAAO,oBAAoB,CAAC;AAC5B,OAAO,kBAAkB,CAAC"}

package/es/components/coachmark/index.js

@@ -1,11 +1,10 @@
 /**
- * Copyright IBM Corp. 2024
+ * Copyright IBM Corp. 2020, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
-import './coachmark.js';
-import './coachmark-header.js';
-import './coachmark-body.js';
-//# sourceMappingURL=index.js.map
+import "./coachmark.js";
+import "./coachmark-body.js";
+import "./coachmark-header.js";

package/es/components/full-page-error/assets/error403SVG.js

@@ -1,24 +1,21 @@
 /**
- * Copyright IBM Corp. 2024
+ * Copyright IBM Corp. 2020, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
-import { svg, html } from 'lit';
-import { prefix } from '../../../globals/settings.js';
+import { prefix } from "../../../globals/settings.js";
+import { html, svg } from "lit";
 
+//#region src/components/full-page-error/assets/error403SVG.js
 /**
- * Copyright IBM Corp. 2025, 2025
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-
-const componentName = 'full-page-error';
-const blockClass = `${prefix}--${componentName}`;
-
+* Copyright IBM Corp. 2025, 2025
+*
+* This source code is licensed under the Apache-2.0 license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+const blockClass = `${prefix}--full-page-error`;
 const innerSVG = svg`<g clipPath="url(#clip0_0_2401)">
     <path
       d="M555.347 83.237H485.983V152.601H555.347V83.237Z"
@@ -816,7 +813,6 @@ const innerSVG = svg`<g clipPath="url(#clip0_0_2401)">
       <rect width="750" height="569.22" fill="white" />
     </clipPath>
   </defs>`;
-
 const error403SVG = html`<svg
   class=${`${blockClass}__svg ${blockClass}__403`}
   viewBox="0 0 750 570"
@@ -827,5 +823,6 @@ const error403SVG = html`<svg
   ${innerSVG}
 </svg>`;
 
+//#endregion
 export { error403SVG };
-//# sourceMappingURL=error403SVG.js.map
+//# sourceMappingURL=error403SVG.js.map