@carbon/ibm-products-web-components
Version:
Carbon for IBM Products Web Components
92 lines (91 loc) • 3.4 kB
TypeScript
/**
* @license
*
* Copyright IBM Corp. 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 { LitElement, PropertyValues } from 'lit';
import '@carbon/web-components/es/components/modal/index.js';
import '@carbon/web-components/es/components/icon-button/index.js';
import '../truncated-text';
declare const CDSTearsheetHeaderContent_base: {
new (...args: any[]): {
_handles: Set<import("@carbon/web-components/es/globals/internal/handle").default>;
connectedCallback(): void;
disconnectedCallback(): void;
};
_hostListeners: {
[listenerName: string]: {
[type: string]: {
options?: boolean | AddEventListenerOptions;
};
};
};
} & typeof LitElement & (new (...args: any[]) => import("@lit-labs/signals").SignalWatcherApi);
/**
* Tearsheet Header Content component - Contains the title, description, and decorative elements.
*
* @element c4p-tearsheet-header-content
* @slot label - Optional label text above the title
* @slot title-start - Content before the title (e.g., icons)
* @slot title-end - Content after the title (e.g., badges, tags)
* @slot description - Custom description content below the title
* @slot decorator - AI label or other decorative elements
*/
declare class CDSTearsheetHeaderContent extends CDSTearsheetHeaderContent_base {
slot: string;
/**
* The main title of the tearsheet.
*/
title: string;
/**
* Internal ID for the title element (auto-generated, used for aria-labelledby on the modal)
*/
private _titleId;
/**
* Public getter for the title ID (used by parent tearsheet for aria-labelledby)
*/
get titleId(): string;
private _titleStartSlot?;
private _titleEndSlot?;
private _decoratorSlot?;
private _hasTitleStart;
private _hasTitleEnd;
private _hasDecorator;
private _hasAILabel;
private _isMobileOrNarrow;
private mdMediaQuery;
private isMobileDevice;
private get isNarrowVariant();
/**
* Returns the first focusable element in the header for the focus trap.
* Priority by screen size:
* Large (desktop): header-actions button → close button → AI label
* Small (mobile): AI label → close button → header-actions button
*/
getFirstFocusable(): HTMLElement | null;
protected firstUpdated(_changedProperties: PropertyValues): void;
protected updated(_changedProperties: PropertyValues): void;
/**
* Applies `inert` to collapsed header regions so they are removed from
* the tab order and AT tree. CSS alone (opacity:0 / max-block-size:0)
* does not prevent keyboard focus on hidden elements.
*
* Collapsed regions:
* - Everything in header-content except the title wrapper
* (description, label, extra slot content, "Read more" button)
* - Header-actions on small/narrow screens
*/
private _updateInertState;
private _checkSlots;
private _handleSlotChange;
private _handleDecoratorChange;
private _updateDecoratorSize;
private _updateHeaderOffset;
render(): import("lit-html").TemplateResult<1>;
static styles: any;
}
export default CDSTearsheetHeaderContent;
//# sourceMappingURL=tearsheet-header-content.d.ts.map