@carbon/ibm-products-web-components 0.30.0-rc.0 → 0.30.0

package/es/components/page-header/page-header-scroller.d.ts

@@ -0,0 +1,56 @@
+/**
+ * @license
+ *
+ * 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.
+ */
+import '@carbon/web-components/es/components/button/index.js';
+import CDSButton from '@carbon/web-components/es/components/button/button';
+/**
+ * Page header Scroller button
+ * @element c4p-page-header-scroller
+ */
+export declare class PageHeaderScroller extends CDSButton {
+    /**
+     * Specify how the trigger should align with the tooltip
+     */
+    align: string;
+    /**
+     * Specify whether a auto align functionality should be applied
+     */
+    autoalign: boolean;
+    /**
+     * Determines whether the tooltip should close when inner content is activated (click, Enter or Space)
+     */
+    closeOnActivation: boolean;
+    /**
+     * Specify the collapse text for the scroller button
+     */
+    collapseText: string;
+    /**
+     * Specify whether the tooltip should be open when it first renders
+     */
+    defaultOpen: boolean;
+    /**
+     * Specify the duration in milliseconds to delay before displaying the tooltip
+     */
+    enterDelayMs: number;
+    /**
+     * Specify the expand text for the scroller button
+     */
+    expandText: string;
+    /**
+     * Specify the duration in milliseconds to delay before hiding the tooltip
+     */
+    leaveDelayMs: number;
+    /**
+     * Specify the size of the Button. Defaults to `md`.
+     */
+    size: string;
+    context: any;
+    protected _renderTooltipContent(): import("lit-html").TemplateResult<1>;
+    private _handleScroller;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/es/components/page-header/page-header-scroller.js

@@ -0,0 +1,166 @@
+/**
+ * Copyright IBM Corp. 2024
+ *
+ * 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 { html } from 'lit';
+import { property } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+import { carbonElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';
+import Chevron20 from '@carbon/icons/es/chevron--up/20';
+import ChevronDown20 from '@carbon/icons/es/chevron--down/20';
+import { iconLoader } from '@carbon/web-components/es/globals/internal/icon-loader.js';
+import '@carbon/web-components/es/components/button/index.js';
+import { pageHeaderContext } from './context.js';
+import { consume } from '@lit/context';
+import CDSButton from '@carbon/web-components/es/components/button/button';
+import { prefix } from '../../globals/settings.js';
+import { scrollableAncestorInner } from './utils.js';
+
+/**
+ * @license
+ *
+ * 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.
+ */
+/**
+ * Page header Scroller button
+ * @element c4p-page-header-scroller
+ */
+let PageHeaderScroller = class PageHeaderScroller extends CDSButton {
+    constructor() {
+        super(...arguments);
+        /**
+         * Specify how the trigger should align with the tooltip
+         */
+        this.align = 'top';
+        /**
+         * Specify whether a auto align functionality should be applied
+         */
+        this.autoalign = true;
+        /**
+         * Determines whether the tooltip should close when inner content is activated (click, Enter or Space)
+         */
+        this.closeOnActivation = true;
+        /**
+         * Specify the collapse text for the scroller button
+         */
+        this.collapseText = 'Collapse';
+        /**
+         * Specify whether the tooltip should be open when it first renders
+         */
+        this.defaultOpen = false;
+        /**
+         * Specify the duration in milliseconds to delay before displaying the tooltip
+         */
+        this.enterDelayMs = 100;
+        /**
+         * Specify the expand text for the scroller button
+         */
+        this.expandText = 'Expand';
+        /**
+         * Specify the duration in milliseconds to delay before hiding the tooltip
+         */
+        this.leaveDelayMs = 300;
+        /**
+         * Specify the size of the Button. Defaults to `md`.
+         */
+        this.size = 'md';
+        this._handleScroller = () => {
+            const { root, fullyCollapsed } = this.context;
+            const contentElement = root.querySelector(`${prefix}-page-header-content`);
+            if (!contentElement) {
+                return;
+            }
+            const scrollableTarget = scrollableAncestorInner(contentElement);
+            // Page header content is not fully collapsed
+            if (!fullyCollapsed) {
+                const pageHeaderContentHeight = contentElement.offsetHeight;
+                scrollableTarget === null || scrollableTarget === void 0 ? void 0 : scrollableTarget.scrollTo({
+                    top: pageHeaderContentHeight, // headerTopValue, check if breadcrumb bar is included
+                    behavior: 'smooth',
+                });
+            }
+            else {
+                // Page header content is fully collapsed
+                scrollableTarget === null || scrollableTarget === void 0 ? void 0 : scrollableTarget.scrollTo({ top: 0, behavior: 'smooth' });
+            }
+        };
+    }
+    _renderTooltipContent() {
+        return html `
+      <cds-tooltip-content>
+        <slot name="tooltip-content"></slot>
+      </cds-tooltip-content>
+    `;
+    }
+    render() {
+        const { align, closeOnActivation, defaultOpen, enterDelayMs, leaveDelayMs, disabled, isSelected, size, context, autoalign, } = this;
+        const iconClasses = classMap({
+            [`${prefix}--page-header-scroller-collapsed`]: !!(context === null || context === void 0 ? void 0 : context.fullyCollapsed),
+            [`${prefix}--page-header-scroller-icon`]: true,
+        });
+        return html `<cds-icon-button
+      align=${align}
+      ?close-on-activation=${closeOnActivation}
+      ?defaultOpen=${defaultOpen}
+      ?disabled=${disabled}
+      enter-delay-ms=${enterDelayMs}
+      ?isSelected=${isSelected}
+      kind="ghost"
+      leave-delay-ms=${leaveDelayMs}
+      size=${size}
+      ?autoalign=${autoalign}
+      class=${iconClasses}
+      @click=${this._handleScroller}
+    >
+      ${(context === null || context === void 0 ? void 0 : context.fullyCollapsed)
+            ? html `${iconLoader(ChevronDown20, { slot: 'icon' })}`
+            : html `${iconLoader(Chevron20, { slot: 'icon' })}`}
+      <span slot="tooltip-content">
+        ${(context === null || context === void 0 ? void 0 : context.fullyCollapsed) ? this.expandText : this.collapseText}
+      </span>
+    </cds-icon-button>`;
+    }
+};
+__decorate([
+    property({ reflect: true, type: String })
+], PageHeaderScroller.prototype, "align", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], PageHeaderScroller.prototype, "autoalign", void 0);
+__decorate([
+    property({ attribute: 'close-on-activation', reflect: true, type: Boolean })
+], PageHeaderScroller.prototype, "closeOnActivation", void 0);
+__decorate([
+    property({ reflect: true, type: String })
+], PageHeaderScroller.prototype, "collapseText", void 0);
+__decorate([
+    property({ reflect: true, type: Boolean })
+], PageHeaderScroller.prototype, "defaultOpen", void 0);
+__decorate([
+    property({ attribute: 'enter-delay-ms', type: Number })
+], PageHeaderScroller.prototype, "enterDelayMs", void 0);
+__decorate([
+    property({ reflect: true, type: String })
+], PageHeaderScroller.prototype, "expandText", void 0);
+__decorate([
+    property({ attribute: 'leave-delay-ms', type: Number })
+], PageHeaderScroller.prototype, "leaveDelayMs", void 0);
+__decorate([
+    property({ reflect: true })
+], PageHeaderScroller.prototype, "size", void 0);
+__decorate([
+    consume({ context: pageHeaderContext, subscribe: true })
+], PageHeaderScroller.prototype, "context", void 0);
+PageHeaderScroller = __decorate([
+    carbonElement(`${prefix}-page-header-scroller`)
+], PageHeaderScroller);
+
+export { PageHeaderScroller };
+//# sourceMappingURL=page-header-scroller.js.map

package/es/components/page-header/page-header-scroller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-header-scroller.js","sources":["../../../src/components/page-header/page-header-scroller.ts"],"sourcesContent":[null],"names":["customElement"],"mappings":"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"}

package/es/components/page-header/page-header-tabs.d.ts

@@ -0,0 +1,18 @@
+/**
+ * @license
+ *
+ * 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.
+ */
+import { LitElement } from 'lit';
+/**
+ * Page header Tabs Bar.
+ * @element c4p-page-header-tabs
+ */
+declare class CDSPageHeaderTabs extends LitElement {
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: any;
+}
+export default CDSPageHeaderTabs;

package/es/components/page-header/page-header-tabs.js

@@ -0,0 +1,48 @@
+/**
+ * Copyright IBM Corp. 2024
+ *
+ * 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 { prefix, carbonPrefix } from '../../globals/settings.js';
+import styles from './page-header.scss.js';
+import { carbonElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';
+
+/**
+ * @license
+ *
+ * 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.
+ */
+/**
+ * Page header Tabs Bar.
+ * @element c4p-page-header-tabs
+ */
+let CDSPageHeaderTabs = class CDSPageHeaderTabs extends LitElement {
+    render() {
+        return html ` <div class="${carbonPrefix}--css-grid" condensed="">
+      <div
+        class="${carbonPrefix}--sm:col-span-4 ${carbonPrefix}--md:col-span-8 ${carbonPrefix}--lg:col-span-16 ${carbonPrefix}--css-grid-column"
+      >
+        <div class="${prefix}--page-header__tab-bar--tablist">
+          <slot></slot>
+          <slot name="tags"></slot>
+        </div>
+      </div>
+      <slot name="scroller"></slot>
+    </div>`;
+    }
+};
+CDSPageHeaderTabs.styles = styles;
+CDSPageHeaderTabs = __decorate([
+    carbonElement(`${prefix}-page-header-tabs`)
+], CDSPageHeaderTabs);
+var CDSPageHeaderTabs$1 = CDSPageHeaderTabs;
+
+export { CDSPageHeaderTabs$1 as default };
+//# sourceMappingURL=page-header-tabs.js.map

package/es/components/page-header/page-header-tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-header-tabs.js","sources":["../../../src/components/page-header/page-header-tabs.ts"],"sourcesContent":[null],"names":["customElement"],"mappings":";;;;;;;;;;;;;AAAA;;;;;;;AAOG;AAOH;;;AAGG;AAEH,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,UAAU,CAAA;IACxC,MAAM,GAAA;QACJ,OAAO,IAAI,CAAA,CAAA,aAAA,EAAgB,YAAY,CAAA;;AAE1B,eAAA,EAAA,YAAY,CAAmB,gBAAA,EAAA,YAAY,CAAmB,gBAAA,EAAA,YAAY,oBAAoB,YAAY,CAAA;;sBAErG,MAAM,CAAA;;;;;;WAMjB;;;AAGF,iBAAM,CAAA,MAAA,GAAG,MAAH;AAfT,iBAAiB,GAAA,UAAA,CAAA;AADtB,IAAAA,aAAa,CAAC,CAAA,EAAG,MAAM,CAAA,iBAAA,CAAmB;AACrC,CAAA,EAAA,iBAAiB,CAgBtB;AAED,0BAAe,iBAAiB;;;;"}

package/es/components/page-header/page-header-title-breadcrumb.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @license
+ *
+ * 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.
+ */
+import CDSBreadcrumbItem from '@carbon/web-components/es/components/breadcrumb/breadcrumb-item';
+/**
+ * Page header Title Breadcrumb
+ * @element c4p-page-header-title-breadcrumb
+ */
+declare class CDSPageHeaderTitleBreadcrumb extends CDSBreadcrumbItem {
+    context: any;
+    constructor();
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: any;
+}
+export default CDSPageHeaderTitleBreadcrumb;

package/es/components/page-header/page-header-title-breadcrumb.js

@@ -0,0 +1,71 @@
+/**
+ * Copyright IBM Corp. 2024
+ *
+ * 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 { html } from 'lit';
+import { consume, ContextConsumer } from '@lit/context';
+import { carbonElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';
+import CDSBreadcrumbItem from '@carbon/web-components/es/components/breadcrumb/breadcrumb-item';
+import { prefix } from '../../globals/settings.js';
+import styles from './page-header.scss.js';
+import { pageHeaderContext } from './context.js';
+
+/**
+ * @license
+ *
+ * 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.
+ */
+/**
+ * Page header Title Breadcrumb
+ * @element c4p-page-header-title-breadcrumb
+ */
+let CDSPageHeaderTitleBreadcrumb = class CDSPageHeaderTitleBreadcrumb extends CDSBreadcrumbItem {
+    constructor() {
+        super();
+        new ContextConsumer(this, {
+            context: pageHeaderContext,
+            subscribe: true,
+            callback: (state) => {
+                if (state.titleClipped) {
+                    this.classList.add(`${prefix}--page-header-title-breadcrumb-show__fallback`);
+                }
+                else {
+                    this.classList.remove(`${prefix}--page-header-title-breadcrumb-show__fallback`);
+                }
+                if (state.withContent) {
+                    this.classList.add(`${prefix}--page-header-title-breadcrumb-show__with-content`);
+                    this.classList.remove(`${prefix}--page-header-title-breadcrumb-show__by-default`);
+                }
+                else {
+                    this.classList.remove(`${prefix}--page-header-title-breadcrumb-show__with-content`);
+                    this.classList.add(`${prefix}--page-header-title-breadcrumb-show__by-default`);
+                }
+            },
+        });
+    }
+    render() {
+        return html `
+      <cds-breadcrumb-item class="${prefix}--page-header-title-breadcrumb">
+        <slot></slot>
+      </cds-breadcrumb-item>
+    `;
+    }
+};
+CDSPageHeaderTitleBreadcrumb.styles = styles;
+__decorate([
+    consume({ context: pageHeaderContext, subscribe: true })
+], CDSPageHeaderTitleBreadcrumb.prototype, "context", void 0);
+CDSPageHeaderTitleBreadcrumb = __decorate([
+    carbonElement(`${prefix}-page-header-title-breadcrumb`)
+], CDSPageHeaderTitleBreadcrumb);
+var CDSPageHeaderTitleBreadcrumb$1 = CDSPageHeaderTitleBreadcrumb;
+
+export { CDSPageHeaderTitleBreadcrumb$1 as default };
+//# sourceMappingURL=page-header-title-breadcrumb.js.map

package/es/components/page-header/page-header-title-breadcrumb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-header-title-breadcrumb.js","sources":["../../../src/components/page-header/page-header-title-breadcrumb.ts"],"sourcesContent":[null],"names":["customElement"],"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;AAOG;AAWH;;;AAGG;AAEH,IAAM,4BAA4B,GAAlC,MAAM,4BAA6B,SAAQ,iBAAiB,CAAA;AAI1D,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE;QACP,IAAI,eAAe,CAAC,IAAI,EAAE;AACxB,YAAA,OAAO,EAAE,iBAAiB;AAC1B,YAAA,SAAS,EAAE,IAAI;AACf,YAAA,QAAQ,EAAE,CAAC,KAAK,KAAI;AAClB,gBAAA,IAAK,KAA+B,CAAC,YAAY,EAAE;oBACjD,IAAI,CAAC,SAAS,CAAC,GAAG,CAChB,CAAG,EAAA,MAAM,CAA+C,6CAAA,CAAA,CACzD;;qBACI;oBACL,IAAI,CAAC,SAAS,CAAC,MAAM,CACnB,CAAG,EAAA,MAAM,CAA+C,6CAAA,CAAA,CACzD;;AAEH,gBAAA,IAAK,KAA+B,CAAC,WAAW,EAAE;oBAChD,IAAI,CAAC,SAAS,CAAC,GAAG,CAChB,CAAG,EAAA,MAAM,CAAmD,iDAAA,CAAA,CAC7D;oBACD,IAAI,CAAC,SAAS,CAAC,MAAM,CACnB,CAAG,EAAA,MAAM,CAAiD,+CAAA,CAAA,CAC3D;;qBACI;oBACL,IAAI,CAAC,SAAS,CAAC,MAAM,CACnB,CAAG,EAAA,MAAM,CAAmD,iDAAA,CAAA,CAC7D;oBACD,IAAI,CAAC,SAAS,CAAC,GAAG,CAChB,CAAG,EAAA,MAAM,CAAiD,+CAAA,CAAA,CAC3D;;aAEJ;AACF,SAAA,CAAC;;IAEJ,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA;oCACqB,MAAM,CAAA;;;KAGrC;;;AAGI,4BAAM,CAAA,MAAA,GAAG,MAAH;AA3Cb,UAAA,CAAA;IADC,OAAO,CAAC,EAAE,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,IAAI,EAAE;AAChD,CAAA,EAAA,4BAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAFJ,4BAA4B,GAAA,UAAA,CAAA;AADjC,IAAAA,aAAa,CAAC,CAAA,EAAG,MAAM,CAAA,6BAAA,CAA+B;AACjD,CAAA,EAAA,4BAA4B,CA8CjC;AAED,qCAAe,4BAA4B;;;;"}

package/es/components/page-header/page-header.d.ts

@@ -0,0 +1,31 @@
+/**
+ * @license
+ *
+ * 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.
+ */
+import { LitElement } from 'lit';
+export interface pageHeaderContextType {
+    breadcrumbOffset?: number;
+    headerOffset?: number;
+    fullyCollapsed?: boolean;
+    titleClipped?: boolean;
+    contentActionsClipped?: boolean;
+    root?: CDSPageHeader | null;
+    withContent?: boolean;
+}
+/**
+ * Page header.
+ * @element c4p-page-header
+ */
+declare class CDSPageHeader extends LitElement {
+    context: pageHeaderContextType;
+    private resizeObserver;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: any;
+}
+export default CDSPageHeader;

package/es/components/page-header/page-header.js

@@ -0,0 +1,128 @@
+/**
+ * Copyright IBM Corp. 2024
+ *
+ * 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 { state } from 'lit/decorators.js';
+import { provide } from '@lit/context';
+import { prefix } from '../../globals/settings.js';
+import styles from './page-header.scss.js';
+import { carbonElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';
+import { pageHeaderContext } from './context.js';
+import { getHeaderOffset } from './utils.js';
+import CDSPageHeaderContent from './page-header-content.js';
+
+/**
+ * @license
+ *
+ * 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.
+ */
+/**
+ * Page header.
+ * @element c4p-page-header
+ */
+let CDSPageHeader = class CDSPageHeader extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.context = {};
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        const contentElement = this.querySelector(`${prefix}-page-header-content`);
+        this.resizeObserver = new ResizeObserver((entries) => {
+            var _a, _b;
+            const pageHeaderElement = entries[0];
+            const contentEl = pageHeaderElement.target.querySelector(`${prefix}-page-header-content`);
+            const contentHeight = contentEl instanceof CDSPageHeaderContent ? contentEl.scrollHeight : 0;
+            const padding = contentEl instanceof CDSPageHeaderContent
+                ? parseFloat((_a = getComputedStyle(contentEl)) === null || _a === void 0 ? void 0 : _a.paddingBlockStart) +
+                    parseFloat((_b = getComputedStyle(contentEl)) === null || _b === void 0 ? void 0 : _b.paddingBlockEnd)
+                : 0;
+            const totalContentHeight = contentHeight + padding;
+            const headerOffset = getHeaderOffset(this);
+            const contentPadding = contentEl instanceof CDSPageHeaderContent ? 48 : 0;
+            this.style.setProperty(`--${prefix}-page-header-header-top`, `${(Math.round(totalContentHeight - contentPadding) - headerOffset) * -1}px`);
+            this.style.setProperty(`--${prefix}-page-header-breadcrumb-top`, `${headerOffset}px`);
+            this.context = Object.assign(Object.assign({}, this.context), { breadcrumbOffset: headerOffset, headerOffset: (Math.round(totalContentHeight) - headerOffset) * -1, root: this, withContent: !!contentEl });
+        });
+        this.resizeObserver.observe(this);
+        const predefinedContentPadding = 24;
+        const totalHeaderOffset = getHeaderOffset(this);
+        const contentObserver = new IntersectionObserver((entries) => {
+            entries.forEach((entry) => {
+                if (!entry.isIntersecting) {
+                    this.context = Object.assign(Object.assign({}, this.context), { fullyCollapsed: true });
+                }
+                else {
+                    this.context = Object.assign(Object.assign({}, this.context), { fullyCollapsed: false });
+                }
+            });
+        }, {
+            root: null,
+            rootMargin: `${(predefinedContentPadding + totalHeaderOffset + 40) * -1}px 0px 0px 0px`,
+            threshold: 0.1,
+        });
+        const titleObserver = new IntersectionObserver((entries) => {
+            entries.forEach((entry) => {
+                if (!entry.isIntersecting) {
+                    this.context = Object.assign(Object.assign({}, this.context), { titleClipped: true });
+                }
+                else {
+                    this.context = Object.assign(Object.assign({}, this.context), { titleClipped: false });
+                }
+            });
+        }, {
+            root: null,
+            rootMargin: `${(predefinedContentPadding + totalHeaderOffset + 40) * -1}px 0px 0px 0px`,
+            threshold: 0.95,
+        });
+        const actionsObserver = new IntersectionObserver((entries) => {
+            entries.forEach((entry) => {
+                if (!entry.isIntersecting) {
+                    this.context = Object.assign(Object.assign({}, this.context), { contentActionsClipped: true });
+                }
+                else {
+                    this.context = Object.assign(Object.assign({}, this.context), { contentActionsClipped: false });
+                }
+            });
+        }, {
+            root: null,
+            // 48 -> breadcrumb bar
+            // 18 -> content padding
+            rootMargin: `${(totalHeaderOffset + 48 + 18) * -1}px 0px 0px 0px`,
+            threshold: 0.95,
+        });
+        if (contentElement) {
+            contentObserver.observe(contentElement);
+            titleObserver.observe(contentElement);
+            actionsObserver.observe(contentElement);
+        }
+    }
+    disconnectedCallback() {
+        var _a;
+        (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect(); // Clean up
+        super.disconnectedCallback();
+    }
+    render() {
+        return html `<slot></slot>`;
+    }
+};
+CDSPageHeader.styles = styles;
+__decorate([
+    state(),
+    provide({ context: pageHeaderContext })
+], CDSPageHeader.prototype, "context", void 0);
+CDSPageHeader = __decorate([
+    carbonElement(`${prefix}-page-header`)
+], CDSPageHeader);
+var CDSPageHeader$1 = CDSPageHeader;
+
+export { CDSPageHeader$1 as default };
+//# sourceMappingURL=page-header.js.map

package/es/components/page-header/page-header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"page-header.js","sources":["../../../src/components/page-header/page-header.ts"],"sourcesContent":[null],"names":["customElement"],"mappings":"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"}