@designbasekorea/ui-wc 0.8.1 → 0.8.3

package/dist/react/index.d.ts

@@ -1,5 +1,6 @@
 import * as react from 'react';
 import react__default, { ReactNode } from 'react';
+import { BadgeVariant, BadgeType, TIME_PICKER_FORMATS, DOWNLOAD_PROGRESS_STATUSES, DOWNLOAD_PROGRESS_POSITIONS, OTP_INPUT_SIZES, PHONE_VERIFY_SIZES, EMAIL_VERIFY_SIZES, TWO_FACTOR_SIZES, CHAT_ORB_SIZES, CHAT_ORB_VARIANTS, CHAT_ORB_STATES, CHAT_ORB_THEMES, CHAT_MESSAGE_ROLES, CHAT_WIDGET_VIEWS, CHAT_WIDGET_POSITIONS } from '@designbasekorea/ui-contracts';
 
 /**
  * Light DOM custom element for the canonical web Button.
@@ -9,10 +10,15 @@ import react__default, { ReactNode } from 'react';
  */
 declare class DbButton extends HTMLElement {
     static get observedAttributes(): string[];
+    /**
+     * 계약에 없는 값이 attribute 로 들어오면 기본값으로 되돌린다 — throw 하지 않는다.
+     * 커스텀 엘리먼트의 attribute 는 임의 문자열을 받으므로 타입으로 막을 수 없다. (STD-COERCE)
+     */
     get variant(): string;
     set variant(value: string);
     get size(): string;
     set size(value: string);
+    /** 빈 값은 "사이즈에 따라 자동" 을 뜻하므로 계약값에 포함되지 않아도 유효하다 */
     get radius(): string;
     set radius(value: string);
     get accentStyle(): string;
@@ -45,6 +51,14 @@ declare class DbButton extends HTMLElement {
     private getDefaultRadiusClass;
     private syncRadius;
     private syncAccentStyle;
+    /**
+     * outline 스타일의 회전하는 테두리 글로우.
+     *
+     * conic-gradient 의 각도를 직접 애니메이션하려면 `@property` 가 필요해 기준선이 올라간다.
+     * 대신 넘치는 정사각형을 `overflow: hidden` 컨테이너 안에서 회전시키고,
+     * 컨테이너의 `::after` 가 안쪽을 덮어 1.5px 테두리만 남기는 방식을 쓴다.
+     */
+    private syncAccentRing;
     private syncAccentField;
     private syncModifier;
     private syncBooleanModifier;
@@ -58,6 +72,8 @@ declare global {
 }
 
 declare class DbInput extends HTMLElement {
+    /** 현재 렌더된 DOM 구조의 형태 키 — 바뀔 때만 재구축한다 (PERF-RECONCILE) */
+    private shapeKey;
     static get observedAttributes(): string[];
     private input?;
     private passwordVisible;
@@ -87,6 +103,11 @@ declare class DbInput extends HTMLElement {
     private resolveIconName;
     private resolveStartIcon;
     private getCurrentValue;
+    /**
+     * DOM 골격을 만든다. 구조가 실제로 달라질 때만 호출되며,
+     * 그 외에는 render() 가 기존 노드의 속성만 갱신한다.
+     */
+    private buildStructure;
     private render;
     private mountIcons;
     private shouldShowPasswordValidation;
@@ -114,6 +135,8 @@ declare class DbCheckbox extends HTMLElement {
     private visual?;
     private labelEl?;
     private built;
+    private userInteracted;
+    private readonly cleanups;
     get checked(): boolean;
     set checked(value: boolean);
     get indeterminate(): boolean;
@@ -124,13 +147,22 @@ declare class DbCheckbox extends HTMLElement {
     set readOnly(value: boolean);
     get required(): boolean;
     set required(value: boolean);
+    /** 계약에 없는 값은 기본값으로 되돌린다 — throw 하지 않는다 (STD-COERCE) */
     get size(): string;
     set size(value: string);
     connectedCallback(): void;
+    disconnectedCallback(): void;
+    /** form.reset() 이후 네이티브 input 의 실제 상태를 호스트 attribute 로 되돌린다 */
+    private syncAfterReset;
     attributeChangedCallback(name: string): void;
     private get hasLabel();
     private build;
     private handleChange;
+    /**
+     * 네이티브 검증 상태를 보조기술에 노출한다.
+     * 값 자체는 네이티브 input 이 폼에 싣고, 여기서는 표현만 맞춘다.
+     */
+    private syncValidity;
     private syncState;
     private syncVisual;
     private syncClasses;
@@ -148,6 +180,8 @@ declare class DbToggle extends HTMLElement {
     private root?;
     private labelEl?;
     private built;
+    /** default-checked 는 초기값일 뿐 — 한 번 조작하면 checked/selected 만 본다 */
+    private userInteracted;
     get checked(): boolean;
     set checked(value: boolean);
     get name(): string;
@@ -181,8 +215,8 @@ declare class DbBadge extends HTMLElement {
     set variant(value: string);
     get size(): string;
     set size(value: string);
-    get badgeStyle(): string;
-    set badgeStyle(value: string);
+    get type(): string;
+    set type(value: string);
     get count(): number | undefined;
     set count(value: number | undefined);
     get maxCount(): number;
@@ -224,6 +258,10 @@ declare global {
 }
 
 declare class DbSpinner extends HTMLElement {
+    /** 현재 그려진 스피너 타입 — 바뀔 때만 그래픽을 다시 만든다 */
+    private renderedType?;
+    private graphicEl?;
+    private labelEl?;
     static get observedAttributes(): string[];
     get type(): string;
     set type(value: string);
@@ -307,7 +345,7 @@ declare class DbTabs extends HTMLElement {
     private childObserver?;
     private resizeObserver?;
     private resizeRaf?;
-    get labels(): string[] | string;
+    get labels(): string[];
     set labels(value: string[] | string);
     get tabItems(): TabItemConfig$1[];
     get items(): TabItemConfig$1[];
@@ -353,6 +391,7 @@ declare class DbModal extends HTMLElement {
     private segmentEl?;
     private contentEl?;
     private titleId;
+    private focusTrap?;
     private isMounted;
     private internalTabId;
     private internalSegment;
@@ -392,7 +431,16 @@ declare class DbModal extends HTMLElement {
     private exitTimerId;
     private syncVisibility;
     private syncOpenState;
+    /** 열릴 때 포커스를 패널 안으로 가둔다. 닫으면 직전 포커스 요소로 복원된다. */
+    private activateFocusTrap;
     private teardown;
+    /** 소비자가 `role="alertdialog"` 를 지정하지 않으면 dialog */
+    private dialogRole;
+    /**
+     * 본문 설명을 대화상자에 연결한다.
+     * `describedby` 로 id 를 직접 주거나, 없으면 본문 컨테이너를 자동으로 가리킨다.
+     */
+    private syncDescribedBy;
     private close;
     private handleDocumentKeyDown;
 }
@@ -546,7 +594,7 @@ declare class DbAccordion extends HTMLElement {
     set items(value: AccordionItemConfig$1[] | string);
     get allowMultiple(): boolean;
     set allowMultiple(value: boolean);
-    get expandedItems(): string[] | string;
+    get expandedItems(): string[];
     set expandedItems(value: string[] | string);
     connectedCallback(): void;
     disconnectedCallback(): void;
@@ -672,6 +720,14 @@ declare class DbSelect extends HTMLElement {
     private getFilteredOptions;
     private selectOption;
     private dispatchChange;
+    /**
+     * combobox 트리거에 접근 가능한 이름을 붙인다.
+     *
+     * 트리거는 `<div role="combobox">` 라서 `<label for>` 로는 연결되지 않는다.
+     * 라벨이 있으면 `aria-labelledby`, 없으면 소비자가 준 `aria-label`,
+     * 그것도 없으면 placeholder 를 이름으로 쓴다. (A11Y-NAME)
+     */
+    private syncAccessibleName;
     private syncState;
     private syncOpenState;
     private syncTrigger;
@@ -724,6 +780,7 @@ declare class DbRadio extends HTMLElement {
     private dot?;
     private labelEl?;
     private built;
+    private userInteracted;
     get checked(): boolean;
     set checked(value: boolean);
     get disabled(): boolean;
@@ -795,7 +852,7 @@ declare class DbBreadcrumbs extends HTMLElement {
     private openMenuId;
     private onDocumentMouseDown;
     private onDocumentKeyDown;
-    get items(): BreadcrumbItem[] | string;
+    get items(): BreadcrumbItem[];
     set items(value: BreadcrumbItem[] | string);
     connectedCallback(): void;
     disconnectedCallback(): void;
@@ -944,6 +1001,8 @@ declare global {
 declare class DbBackdrop extends HTMLElement {
     static get observedAttributes(): string[];
     private portal?;
+    /** 참조 카운트 스크롤락을 이 인스턴스가 잡고 있는지 (PERF-GLOBAL-STATE) */
+    private scrollLocked;
     private keyHandler;
     get open(): boolean;
     set open(value: boolean);
@@ -957,6 +1016,8 @@ declare class DbBackdrop extends HTMLElement {
     private detachListeners;
     private handlePortalClick;
     private render;
+    /** 잠근 적이 있을 때만 푼다 — 참조 카운트가 음수로 새지 않도록 */
+    private releaseScrollLock;
 }
 declare global {
     interface HTMLElementTagNameMap {
@@ -1030,15 +1091,19 @@ declare class DbDrawer extends HTMLElement {
     private root?;
     private overlay?;
     private container?;
+    private focusTrap?;
     private contentEl?;
     private isMounted;
     private isActive;
     private enterFrame?;
     private exitTimer?;
-    private previousActiveElement;
+    /** 참조 카운트 스크롤락을 이 인스턴스가 잡고 있는지 (PERF-GLOBAL-STATE) */
+    private scrollLocked;
     private keyHandler;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    /** 잠근 적이 있을 때만 푼다 — 카운트가 음수로 새지 않도록 */
+    private releaseScrollLock;
     attributeChangedCallback(name: string): void;
     private isOpenRequested;
     private clearTimers;
@@ -1062,14 +1127,21 @@ declare class DbToast extends HTMLElement {
     private progressInterval;
     private closeTimerId;
     private closed;
+    private readonly cleanups;
+    /** 일시정지 시점까지 소비한 시간 (ms) */
+    private elapsedBeforePause;
+    private runStartedAt;
+    private paused;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    private pauseTimers;
+    private resumeTimers;
     attributeChangedCallback(name: string): void;
     private clearTimers;
     private startTimers;
     /** 토스트를 닫고(애니메이션 포함) auto-remove 설정 시 DOM에서 제거합니다. */
     close(): void;
-    private iconForStatus;
+    private iconForVariant;
     private render;
 }
 declare global {
@@ -1082,8 +1154,13 @@ declare class DbConfirm extends HTMLElement {
     static get observedAttributes(): string[];
     private root;
     private keyHandler;
+    private focusTrap?;
+    /** 참조 카운트 스크롤락을 이 인스턴스가 잡고 있는지 (PERF-GLOBAL-STATE) */
+    private scrollLocked;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    /** 트랩 해제(=포커스 복원)와 스크롤락 반환을 한 곳에서 처리한다 */
+    private teardownOverlay;
     attributeChangedCallback(): void;
     private isOpen;
     private attachEscape;
@@ -1375,6 +1452,33 @@ declare global {
     }
 }
 
+declare class DbActivityHeatmap extends HTMLElement {
+    static get observedAttributes(): string[];
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(): void;
+    private handleClick;
+    private parseData;
+    private parseEndDate;
+    private parseISODate;
+    private formatISODate;
+    private addDays;
+    private startOfWeek;
+    private isAfter;
+    private buildWeeks;
+    private resolveLevel;
+    private formatMonthLabel;
+    private formatTooltip;
+    private getDayLabels;
+    private getMonthLabels;
+    private render;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'db-activity-heatmap': DbActivityHeatmap;
+    }
+}
+
 declare class DbImage extends HTMLElement {
     private imageState;
     private currentSrc;
@@ -1443,6 +1547,10 @@ declare global {
 
 declare class DbLightbox extends HTMLElement {
     private portalEl;
+    private focusTrap?;
+    /** 참조 카운트 스크롤락을 이 인스턴스가 잡고 있는지 (PERF-GLOBAL-STATE) */
+    private scrollLocked;
+    private readonly titleId;
     private imageEl;
     private loadingEl;
     private errorEl;
@@ -1550,8 +1658,8 @@ interface DbNavbarUserProfile {
     email?: string;
     avatar?: string;
     badge?: number;
-    badgeVariant?: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger';
-    badgeStyle?: 'dot' | 'number' | 'text' | 'outlined';
+    badgeVariant?: BadgeVariant;
+    badgeType?: BadgeType;
     badgeText?: string;
 }
 declare class DbNavbar extends HTMLElement {
@@ -1684,7 +1792,7 @@ interface DbSidebarItem {
     selected?: boolean;
     /** 프로필 메뉴에서 이 항목 앞에 구분선을 표시합니다. */
     dividerBefore?: boolean;
-    /** 클릭 시 이동할 사이드바 패널 id (예: settings) */
+    /** 클릭 시 이동할 사이드바 패널 id (예: authentication, settings) */
     openPanel?: string;
     children?: DbSidebarItem[];
 }
@@ -1695,6 +1803,20 @@ interface DbSidebarSection {
     gap?: 'none' | 's' | 'm' | 'l';
     items: DbSidebarItem[];
 }
+type DbSidebarPanelMode = 'auto' | 'adjacent' | 'replace';
+interface DbSidebarPanel {
+    id: string;
+    title: string;
+    description?: string;
+    ariaLabel?: string;
+    backLabel?: string;
+    /**
+     * @deprecated 레이아웃 폭은 전역 `panel-width`만 사용합니다.
+     * 패널마다 다른 폭을 주면 adjacent에서 폭이 흔들립니다.
+     */
+    width?: number | string;
+    sections: DbSidebarSection[];
+}
 interface DbSidebarUserProfile {
     name: string;
     email?: string;
@@ -1736,6 +1858,9 @@ declare class DbSidebar extends HTMLElement {
     private flyoutCloseTimer;
     private userFlyoutCloseTimer;
     private outsideHandler;
+    private panelMediaQuery;
+    private panelMediaHandler;
+    private resolvedPanelMode;
     /**
      * db-sidebar는 Light DOM으로 렌더링하므로 이름 있는 자식 요소를 직접 보존하고
      * 해당 내비게이션 영역으로 이동해 슬롯처럼 투영합니다.
@@ -1746,7 +1871,9 @@ declare class DbSidebar extends HTMLElement {
     static get observedAttributes(): string[];
     connectedCallback(): void;
     disconnectedCallback(): void;
-    attributeChangedCallback(name: string): void;
+    attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
+    private bindPanelMediaQuery;
+    private unbindPanelMediaQuery;
     private seedExpanded;
     get items(): DbSidebarItem[];
     set items(value: DbSidebarItem[] | string);
@@ -1784,12 +1911,27 @@ declare class DbSidebar extends HTMLElement {
     set backLabel(value: string);
     get backHref(): string;
     set backHref(value: string);
+    get panels(): DbSidebarPanel[];
+    set panels(value: DbSidebarPanel[] | string);
+    /**
+     * @deprecated panels를 사용하세요. 기존 settings-sections는 settings 패널로 자동 변환됩니다.
+     */
     get settingsSections(): DbSidebarSection[];
     set settingsSections(value: DbSidebarSection[] | string);
     get activePanel(): string;
     set activePanel(value: string);
+    get panelMode(): DbSidebarPanelMode;
+    set panelMode(value: DbSidebarPanelMode);
+    get panelWidth(): string;
+    set panelWidth(value: string | number);
+    get panelBreakpoint(): number;
+    set panelBreakpoint(value: number);
+    private normalizeCssLength;
     private parseSettingsSections;
-    private hasSettingsPanel;
+    private parsePanels;
+    private hasPanels;
+    private findPanel;
+    private getActivePanelConfig;
     private parseSections;
     private parseUserMenuItems;
     private parseUserProfile;
@@ -1810,7 +1952,6 @@ declare class DbSidebar extends HTMLElement {
     private setUserFlyout;
     private scheduleUserFlyoutClose;
     private syncHostClasses;
-    private syncActivePanelTrack;
     private navigateToPanel;
     private dispatchItemClick;
     private dispatchUserMenuItemClick;
@@ -1831,8 +1972,10 @@ declare class DbSidebar extends HTMLElement {
     private createUserDropdown;
     private createUpdateBanner;
     private createPromoBanner;
-    private createHeader;
+    private createMainHeader;
+    private createPanelHeader;
     private createNavWrapper;
+    private createFooter;
     private render;
 }
 declare global {
@@ -1923,6 +2066,81 @@ declare global {
     }
 }
 
+declare class DbRangeSlider extends HTMLElement {
+    static get observedAttributes(): string[];
+    private built;
+    private headerEl;
+    private labelEl;
+    private valuesEl;
+    private containerEl;
+    private trackEl;
+    private fillEl;
+    private thumbEls;
+    private currentValue;
+    private currentRange;
+    private isDragging;
+    private activeThumb;
+    private boundTrackClick;
+    private boundPointerMove;
+    private boundPointerUp;
+    private boundContainerKeyDown;
+    private eventsBound;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(name: string): void;
+    private isStructuralAttribute;
+    get value(): number;
+    set value(v: number);
+    get range(): [number, number] | undefined;
+    set range(v: [number, number] | string | undefined);
+    private build;
+    private getValuePosition;
+    private shouldShowLabel;
+    private formatValue;
+    private syncDomOrder;
+    private bindEvents;
+    private unbindEvents;
+    private readAttributeValues;
+    private syncClasses;
+    private syncStructure;
+    private isMarkActive;
+    private syncVisuals;
+    private syncThumbTooltips;
+    private syncA11y;
+    private setThumbPosition;
+    private valueToPercent;
+    private percentToValue;
+    private snapToStep;
+    private clamp;
+    private getNumberAttr;
+    private normalizeRangeInput;
+    private parseRangeAttr;
+    private parseMarks;
+    private parseMarkLabels;
+    private isInteractive;
+    private getTrackPercent;
+    private handleThumbPointerDown;
+    private handleTrackClick;
+    /**
+     * 포인터 이동을 프레임당 1회로 병합한다. preventDefault 를 쓰지 않으므로 안전하다. (PERF-RAF)
+     * 메서드가 아니라 필드로 선언해야 rafThrottle 로 감쌀 수 있다.
+     */
+    private handlePointerMove;
+    private handlePointerUp;
+    private setThumbActive;
+    private applyDragValue;
+    private commitValueAtPosition;
+    private handleKeyDown;
+    private afterKeyboard;
+    private dispatchValueChange;
+    private dispatchRangeChange;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'db-range-slider': DbRangeSlider;
+    }
+}
+
 /**
  * SegmentControl Web Component
  * packages/ui SegmentControl.tsx와 DOM·동작·스타일 1:1 동기화
@@ -2237,6 +2455,7 @@ declare global {
 }
 
 declare class DbFloatingActionButton extends HTMLElement {
+    private detachKeyActivation?;
     static get observedAttributes(): string[];
     get size(): string;
     set size(value: string);
@@ -2267,6 +2486,9 @@ declare class DbBottomSheet extends HTMLElement {
     private grabBar?;
     private contentEl?;
     private sheetHeightPercent;
+    private focusTrap?;
+    /** 참조 카운트 스크롤락을 이 인스턴스가 잡고 있는지 (PERF-GLOBAL-STATE) */
+    private scrollLocked;
     private isDragging;
     private isVisible;
     private isMounted;
@@ -2280,6 +2502,8 @@ declare class DbBottomSheet extends HTMLElement {
     private shouldMountPortal;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    /** 트랩 해제(=포커스 복원)와 스크롤락 반환 */
+    private teardownOverlay;
     attributeChangedCallback(name: string): void;
     private isOpenRequested;
     private clearTimers;
@@ -2366,6 +2590,9 @@ type OnboardingStep$1 = {
 declare class DbOnboardingModal extends HTMLElement {
     static get observedAttributes(): string[];
     private root?;
+    private focusTrap?;
+    /** 참조 카운트 스크롤락을 이 인스턴스가 잡고 있는지 (PERF-GLOBAL-STATE) */
+    private scrollLocked;
     private internalStep;
     private keyHandler;
     private isMounted;
@@ -2492,6 +2719,9 @@ declare class DbDatePicker extends HTMLElement {
     private boundDocumentMouseDown;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    /** 열린 달력은 Escape 로 닫히고 포커스는 트리거로 돌아간다 (A11Y-ESCAPE) */
+    private handleDocumentKeyDown;
+    private boundDocumentKeyDown;
     attributeChangedCallback(name: string): void;
     get value(): string;
     set value(value: string);
@@ -2528,7 +2758,7 @@ declare class DbDatePicker extends HTMLElement {
     private handlePendingApply;
     private handlePendingCancel;
     private handleInputBlur;
-    private get disabled();
+    get disabled(): boolean;
     set disabled(value: boolean);
     get readonly(): boolean;
     set readonly(value: boolean);
@@ -2551,8 +2781,7 @@ declare global {
     }
 }
 
-declare const FORMATS: readonly ["12h", "24h", "12h-with-seconds", "24h-with-seconds"];
-type TimeFormat = (typeof FORMATS)[number];
+type TimeFormat = (typeof TIME_PICKER_FORMATS)[number];
 declare class DbTimePicker extends HTMLElement {
     static get observedAttributes(): string[];
     private built;
@@ -2573,6 +2802,9 @@ declare class DbTimePicker extends HTMLElement {
     private boundDocumentMouseDown;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    /** 열린 드롭다운은 Escape 로 닫히고 포커스는 트리거로 돌아간다 (A11Y-ESCAPE) */
+    private handleDocumentKeyDown;
+    private boundDocumentKeyDown;
     attributeChangedCallback(name: string): void;
     get value(): string;
     set value(value: string);
@@ -3186,8 +3418,17 @@ declare class DbResizablePanels extends HTMLElement {
     private startSize;
     private startPos;
     private currentSize;
+    /** 포인터 이동을 프레임당 1회로 병합하기 위한 핸들 (PERF-RAF) */
+    private rafId;
+    private pendingPoint;
     static get observedAttributes(): string[];
     connectedCallback(): void;
+    /**
+     * 드래그 중에 엘리먼트가 DOM 에서 제거되면 mouseup/touchend 가 오지 않아
+     * document 리스너가 영원히 남는다. 여기서 확실히 걷어낸다. (PERF-CLEANUP)
+     */
+    disconnectedCallback(): void;
+    private detachDragListeners;
     attributeChangedCallback(): void;
     private getBool;
     private getNumber;
@@ -3201,6 +3442,11 @@ declare class DbResizablePanels extends HTMLElement {
     private onTouchStart;
     private startResize;
     private onMouseMove;
+    /**
+     * pointer 이동마다 레이아웃을 다시 계산하면 프레임을 넘겨 버린다.
+     * 마지막 좌표만 남겨 두고 다음 프레임에 한 번만 반영한다.
+     */
+    private scheduleResize;
     private onTouchMove;
     private applyResize;
     private onMouseUp;
@@ -3253,6 +3499,9 @@ declare class DbVideoPlayer extends HTMLElement {
     private getPlaylist;
     private getCurrentSrc;
     private formatTime;
+    /**
+     * 아이콘만 있는 컨트롤 버튼. `label` 이 유일한 접근 가능한 이름이다. (A11Y-NAME)
+     */
     private iconButton;
     private skipButton;
     private syncFromAttributes;
@@ -3356,6 +3605,10 @@ declare class DbAudioPlayer extends HTMLElement {
     private toggleShuffle;
     private handlePlaybackRateChange;
     private handleKeyDown;
+    /**
+     * 아이콘만 있는 컨트롤 버튼. `label` 은 선택이 아니라 필수다 —
+     * 아이콘은 aria-hidden 이므로 이것이 유일한 접근 가능한 이름이 된다. (A11Y-NAME)
+     */
     private iconButton;
     private build;
     private get leftControls();
@@ -3572,6 +3825,7 @@ declare global {
 }
 
 declare class DbAppBadge extends HTMLElement {
+    private detachKeyActivation?;
     static get observedAttributes(): string[];
     private built;
     private labelEl?;
@@ -3582,6 +3836,7 @@ declare class DbAppBadge extends HTMLElement {
     private getStore;
     private getIconSize;
     private build;
+    disconnectedCallback(): void;
     private updateUI;
 }
 declare global {
@@ -4036,6 +4291,7 @@ type TutorialStep$1 = {
 declare class DbTutorial extends HTMLElement {
     static get observedAttributes(): string[];
     private root?;
+    private focusTrap?;
     private overlayEl?;
     private popoverEl?;
     private closeButtonEl?;
@@ -4092,6 +4348,8 @@ declare class DbAnimationBackground extends HTMLElement {
     private syncingControls;
     static get observedAttributes(): string[];
     connectedCallback(): void;
+    /** 열린 설정 패널은 Escape 로 닫힌다 (A11Y-ESCAPE) */
+    private handleDocumentKeyDown;
     disconnectedCallback(): void;
     attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
     private getBool;
@@ -4241,29 +4499,8 @@ declare global {
     }
 }
 
-declare class DbLottie extends HTMLElement {
-    private container?;
-    private animation?;
-    private loadToken;
-    static get observedAttributes(): string[];
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    attributeChangedCallback(): void;
-    private getBool;
-    private getSizeStyle;
-    private destroyAnimation;
-    private renderAnimation;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'db-lottie': DbLottie;
-    }
-}
-
-declare const STATUSES: readonly ["downloading", "paused", "error", "complete"];
-type DownloadStatus = (typeof STATUSES)[number];
-declare const POSITIONS$1: readonly ["bottom-right", "bottom-left", "bottom-center", "top-right", "top-left", "top-center"];
-type DownloadPosition = (typeof POSITIONS$1)[number];
+type DownloadStatus = (typeof DOWNLOAD_PROGRESS_STATUSES)[number];
+type DownloadPosition = (typeof DOWNLOAD_PROGRESS_POSITIONS)[number];
 /**
  * 우측 하단(기본)에 떠 있는 다운로드 진행률 위젯.
  *
@@ -4350,8 +4587,7 @@ declare global {
  *
  * 분할 자릿수 OTP/PIN 입력. 붙여넣기·화살표·백스페이스를 지원합니다.
  */
-declare const SIZES$4: readonly ["s", "m", "l"];
-type OtpSize = (typeof SIZES$4)[number];
+type OtpSize = (typeof OTP_INPUT_SIZES)[number];
 declare class DbOtpInput extends HTMLElement {
     static formAssociated: boolean;
     static get observedAttributes(): string[];
@@ -4403,8 +4639,7 @@ declare global {
  * 한국형 휴대폰 본인인증: 통신사 → 번호 → 인증번호 발송 → OTP + 타이머/재전송.
  */
 
-declare const SIZES$3: readonly ["s", "m", "l"];
-type Size$2 = (typeof SIZES$3)[number];
+type Size$2 = (typeof PHONE_VERIFY_SIZES)[number];
 declare class DbPhoneVerify extends HTMLElement {
     static get observedAttributes(): string[];
     private built;
@@ -4460,8 +4695,7 @@ declare global {
  * 이메일 인증: code(OTP) 모드 / confirm(메일함 확인) 모드.
  */
 
-declare const SIZES$2: readonly ["s", "m", "l"];
-type Size$1 = (typeof SIZES$2)[number];
+type Size$1 = (typeof EMAIL_VERIFY_SIZES)[number];
 declare class DbEmailVerify extends HTMLElement {
     static get observedAttributes(): string[];
     private built;
@@ -4519,6 +4753,7 @@ declare global {
  * 2단계 인증(2FA): 인증앱 / SMS / 이메일 방식 + OTP.
  */
 
+type Size = (typeof TWO_FACTOR_SIZES)[number];
 declare const METHODS: readonly [{
     readonly value: "app";
     readonly label: "인증 앱";
@@ -4529,8 +4764,6 @@ declare const METHODS: readonly [{
     readonly value: "email";
     readonly label: "이메일";
 }];
-declare const SIZES$1: readonly ["s", "m", "l"];
-type Size = (typeof SIZES$1)[number];
 type Method = (typeof METHODS)[number]['value'];
 declare class DbTwoFactor extends HTMLElement {
     static get observedAttributes(): string[];
@@ -4578,14 +4811,10 @@ declare global {
     }
 }
 
-declare const SIZES: readonly ["xs", "s", "m", "l", "xl"];
-declare const VARIANTS: readonly ["aurora", "ocean", "emerald", "violet", "mono"];
-declare const STATES: readonly ["idle", "thinking", "listening"];
-declare const THEMES: readonly ["auto", "light", "dark"];
-type OrbSize = (typeof SIZES)[number];
-type OrbVariant = (typeof VARIANTS)[number];
-type OrbState = (typeof STATES)[number];
-type OrbTheme = (typeof THEMES)[number];
+type OrbSize = (typeof CHAT_ORB_SIZES)[number];
+type OrbVariant = (typeof CHAT_ORB_VARIANTS)[number];
+type OrbState = (typeof CHAT_ORB_STATES)[number];
+type OrbTheme = (typeof CHAT_ORB_THEMES)[number];
 /**
  * AI 어시스턴트를 상징하는 캔버스 기반 애니메이션 오브(구체).
  * 광택 있는 3D 구체 위에 유체처럼 흐르는 내부 광원 + 프레넬 림 라이트 + 스페큘러 하이라이트로
@@ -4778,6 +5007,8 @@ declare class DbChatComposer extends HTMLElement {
     private fileInput;
     private micBtn;
     private sendBtn;
+    private dropOverlay;
+    private dragDepth;
     get value(): string;
     set value(v: string);
     get streaming(): boolean;
@@ -4810,12 +5041,24 @@ declare class DbChatComposer extends HTMLElement {
     private handleOutsideClick;
     private chooseAttachOption;
     private handleFilePicked;
+    private hasDragFiles;
+    private handleDragEnter;
+    private handleDragOver;
+    private handleDragLeave;
+    private handleDrop;
+    private showDropOverlay;
     private addFile;
+    /** 동일 파일을 두 번 끌어놓거나 다시 선택해도 첨부 목록에는 한 번만 표시한다. */
+    private hasAttachment;
     private attachmentMeta;
     private handleInput;
     private handleKeyDown;
     private handleSendClick;
     private submit;
+    /** 여러 파일을 첨부합니다. */
+    addFiles(files: File[], type?: string): void;
+    /** 현재 입력·첨부를 전송합니다. */
+    send(): void;
     /** 입력 필드를 비웁니다. */
     clear(): void;
     /** 첨부를 하나 제거합니다. */
@@ -4874,8 +5117,14 @@ declare global {
     }
 }
 
-declare const ROLES: readonly ["user", "assistant", "system"];
-type Role = (typeof ROLES)[number];
+type Role = (typeof CHAT_MESSAGE_ROLES)[number];
+interface DbChatMessageAttachment {
+    name: string;
+    kind?: 'image' | 'video' | 'file';
+    /** 미리보기/다운로드 URL (blob: 또는 https:) */
+    url?: string;
+    mime?: string;
+}
 /**
  * 채팅 메시지 한 줄. 본문은 라이트 DOM 자식으로 전달하며 컴포넌트가 감쌉니다.
  * 아바타는 `db-avatar` 를 재사용합니다.
@@ -4889,17 +5138,22 @@ declare class DbChatMessage extends HTMLElement {
     static get observedAttributes(): string[];
     private built;
     private contentEl;
+    private mediaEl;
     private avatarWrap;
     private headerEl;
     private nameEl;
     private timeEl;
     private actionsEl;
+    private _attachments;
     get role(): Role;
     set role(v: Role);
+    get attachments(): DbChatMessageAttachment[];
+    set attachments(list: DbChatMessageAttachment[]);
     connectedCallback(): void;
     attributeChangedCallback(name: string): void;
     private build;
     private sync;
+    private renderAttachments;
     private renderAvatar;
     private renderActions;
     private handleAction;
@@ -4929,10 +5183,10 @@ declare global {
     }
 }
 
-declare const VIEWS: readonly ["home", "messages", "conversation", "help"];
-type ChatView = (typeof VIEWS)[number];
-declare const POSITIONS: readonly ["bottom-right", "bottom-left"];
-type ChatPosition = (typeof POSITIONS)[number];
+type ChatView = (typeof CHAT_WIDGET_VIEWS)[number];
+type ChatPosition = (typeof CHAT_WIDGET_POSITIONS)[number];
+/** 홈 메뉴 선택 시 위젯 내부 이동. `none`이면 이벤트만 발행(호스트가 처리) */
+type DbChatWidgetMenuAction = 'conversation' | 'help' | 'none';
 interface DbChatWidgetMessage {
     id?: string;
     /** `assistant`(상담원/봇) 또는 `user` */
@@ -4944,6 +5198,13 @@ interface DbChatWidgetMessage {
     avatarInitials?: string;
     /** 말풍선 액션 (예: 'copy,like,dislike') — db-chat-message 로 전달 */
     actions?: string;
+    /** 첨부 파일/이미지 */
+    attachments?: Array<{
+        name: string;
+        kind?: 'image' | 'video' | 'file';
+        url?: string;
+        mime?: string;
+    }>;
 }
 interface DbChatWidgetConversation {
     id?: string;
@@ -4955,6 +5216,15 @@ interface DbChatWidgetConversation {
     unread?: number;
     online?: boolean;
 }
+/** 홈 바로가기 메뉴 — 필요한 항목만 `menuItems`로 전달 (없으면 숨김) */
+interface DbChatWidgetMenuItem extends DbChatSuggestion {
+    action?: DbChatWidgetMenuAction;
+}
+/** 도움말 문서 — 클릭 시 상세(`article`) 화면으로 이동 */
+interface DbChatWidgetArticle extends DbChatSuggestion {
+    /** 상세 본문. 없으면 description을 본문으로 사용 */
+    body?: string;
+}
 /**
  * FAB 로 열고 닫는 우측 하단 채팅 상담 위젯(껍데기).
  *
@@ -4968,11 +5238,12 @@ interface DbChatWidgetConversation {
  * @fires db-toggle      - FAB 토글 (detail: { open })
  * @fires db-view-change - 화면 전환 (detail: { view })
  * @fires db-send        - 메시지 전송 (detail: { text })
- * @fires db-menu-select - 홈 메뉴 선택 (detail: { id, value })
+ * @fires db-menu-select - 홈 메뉴 선택 (detail: { id, value, action })
  * @fires db-quick-reply - 빠른 답변 선택 (detail: { id, value })
  * @fires db-article-select      - 도움말 문서 선택 (detail: { id, title })
  * @fires db-conversation-select - 대화 목록 선택 (detail: { id })
  * @fires db-message-action      - 말풍선 액션 (detail: { action, text })
+ * @fires db-start-chat          - 대화 시작 CTA (홈·메시지 empty)
  *
  * @example
  *   const chat = document.createElement('db-chat-widget');
@@ -4991,6 +5262,8 @@ declare class DbChatWidget extends HTMLElement {
     static get observedAttributes(): string[];
     private built;
     private typing;
+    private helpQuery;
+    private _activeArticle;
     private _messages;
     private _conversations;
     private _menuItems;
@@ -5017,16 +5290,24 @@ declare class DbChatWidget extends HTMLElement {
     get messages(): DbChatWidgetMessage[];
     set conversations(v: DbChatWidgetConversation[]);
     get conversations(): DbChatWidgetConversation[];
-    set menuItems(v: DbChatSuggestion[]);
-    get menuItems(): DbChatSuggestion[];
+    set menuItems(v: DbChatWidgetMenuItem[]);
+    get menuItems(): DbChatWidgetMenuItem[];
     set quickReplies(v: DbChatSuggestion[]);
     get quickReplies(): DbChatSuggestion[];
-    set articles(v: DbChatSuggestion[]);
-    get articles(): DbChatSuggestion[];
+    set articles(v: DbChatWidgetArticle[]);
+    get articles(): DbChatWidgetArticle[];
     connectedCallback(): void;
+    disconnectedCallback(): void;
+    /** 열린 위젯 패널은 Escape 로 닫히고 포커스는 런처로 돌아간다 (A11Y-ESCAPE) */
+    private handleDocumentKeyDown;
     attributeChangedCallback(name: string, oldVal: string | null, newVal: string | null): void;
     private hydrateFromAttributes;
     private build;
+    private panelDragDepth;
+    private handlePanelDragEnter;
+    private handlePanelDragOver;
+    private handlePanelDragLeave;
+    private handlePanelDrop;
     private sync;
     private syncOpenState;
     private renderBadge;
@@ -5037,9 +5318,14 @@ declare class DbChatWidget extends HTMLElement {
     private renderMessages;
     private renderConversation;
     private renderHelp;
+    private renderHelpResults;
+    private renderArticle;
+    private openArticle;
+    private startConversation;
     private buildMessage;
     private buildTyping;
     private buildEmpty;
+    private buildStartChatButton;
     private renderFooter;
     private renderNav;
     private scrollThreadToEnd;
@@ -5308,6 +5594,7 @@ interface DbChatRoomMessage {
     name?: string;
     avatarSrc?: string;
     avatarInitials?: string;
+    attachments?: DbChatMessageAttachment[];
 }
 /**
  * 사람 간 1:1/그룹 대화 화면. 상단 헤더(상대 정보) + 메시지 스레드 + 하단 컴포저.
@@ -5327,15 +5614,18 @@ declare class DbChatRoom extends HTMLElement {
     static get observedAttributes(): string[];
     private built;
     private typing;
+    private dragDepth;
     private _messages;
     private headerEl;
     private scrollEl;
     private threadEl;
     private dockEl;
+    private dropOverlay;
     private composer;
     set messages(v: DbChatRoomMessage[]);
     get messages(): DbChatRoomMessage[];
     connectedCallback(): void;
+    disconnectedCallback(): void;
     attributeChangedCallback(): void;
     private build;
     private sync;
@@ -5344,6 +5634,13 @@ declare class DbChatRoom extends HTMLElement {
     private buildMessage;
     private buildTyping;
     private scrollToEnd;
+    private nowLabel;
+    private hasDragFiles;
+    private handleDragEnter;
+    private handleDragOver;
+    private handleDragLeave;
+    private handleDrop;
+    private showDropOverlay;
     /** 메시지 추가. 추가된 id 반환 */
     addMessage(msg: DbChatRoomMessage): string;
     /** 전체 메시지 교체 */
@@ -5497,18 +5794,18 @@ declare function ModalHeader({ className, children, ...props }: PartProps): reac
     onFocusCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
     onBlur?: react.FocusEventHandler<HTMLDivElement> | undefined;
     onBlurCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
-    onChange?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onChangeCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onChange?: react.ChangeEventHandler<HTMLDivElement, Element> | undefined;
+    onChangeCapture?: react.ChangeEventHandler<HTMLDivElement, Element> | undefined;
     onBeforeInput?: react.InputEventHandler<HTMLDivElement> | undefined;
-    onBeforeInputCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onInput?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onInputCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onReset?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onResetCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onSubmit?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onSubmitCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onInvalid?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onInvalidCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onBeforeInputCapture?: react.InputEventHandler<HTMLDivElement> | undefined;
+    onInput?: react.InputEventHandler<HTMLDivElement> | undefined;
+    onInputCapture?: react.InputEventHandler<HTMLDivElement> | undefined;
+    onReset?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onResetCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSubmit?: react.SubmitEventHandler<HTMLDivElement> | undefined;
+    onSubmitCapture?: react.SubmitEventHandler<HTMLDivElement> | undefined;
+    onInvalid?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onInvalidCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
     onLoad?: react.ReactEventHandler<HTMLDivElement> | undefined;
     onLoadCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
     onError?: react.ReactEventHandler<HTMLDivElement> | undefined;
@@ -5779,18 +6076,18 @@ declare function ModalBody({ className, children, ...props }: PartProps): react.
     onFocusCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
     onBlur?: react.FocusEventHandler<HTMLDivElement> | undefined;
     onBlurCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
-    onChange?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onChangeCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onChange?: react.ChangeEventHandler<HTMLDivElement, Element> | undefined;
+    onChangeCapture?: react.ChangeEventHandler<HTMLDivElement, Element> | undefined;
     onBeforeInput?: react.InputEventHandler<HTMLDivElement> | undefined;
-    onBeforeInputCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onInput?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onInputCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onReset?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onResetCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onSubmit?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onSubmitCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onInvalid?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onInvalidCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onBeforeInputCapture?: react.InputEventHandler<HTMLDivElement> | undefined;
+    onInput?: react.InputEventHandler<HTMLDivElement> | undefined;
+    onInputCapture?: react.InputEventHandler<HTMLDivElement> | undefined;
+    onReset?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onResetCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSubmit?: react.SubmitEventHandler<HTMLDivElement> | undefined;
+    onSubmitCapture?: react.SubmitEventHandler<HTMLDivElement> | undefined;
+    onInvalid?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onInvalidCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
     onLoad?: react.ReactEventHandler<HTMLDivElement> | undefined;
     onLoadCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
     onError?: react.ReactEventHandler<HTMLDivElement> | undefined;
@@ -6061,18 +6358,18 @@ declare function ModalFooter({ className, children, ...props }: PartProps): reac
     onFocusCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
     onBlur?: react.FocusEventHandler<HTMLDivElement> | undefined;
     onBlurCapture?: react.FocusEventHandler<HTMLDivElement> | undefined;
-    onChange?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onChangeCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onChange?: react.ChangeEventHandler<HTMLDivElement, Element> | undefined;
+    onChangeCapture?: react.ChangeEventHandler<HTMLDivElement, Element> | undefined;
     onBeforeInput?: react.InputEventHandler<HTMLDivElement> | undefined;
-    onBeforeInputCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onInput?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onInputCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onReset?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onResetCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onSubmit?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onSubmitCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onInvalid?: react.FormEventHandler<HTMLDivElement> | undefined;
-    onInvalidCapture?: react.FormEventHandler<HTMLDivElement> | undefined;
+    onBeforeInputCapture?: react.InputEventHandler<HTMLDivElement> | undefined;
+    onInput?: react.InputEventHandler<HTMLDivElement> | undefined;
+    onInputCapture?: react.InputEventHandler<HTMLDivElement> | undefined;
+    onReset?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onResetCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onSubmit?: react.SubmitEventHandler<HTMLDivElement> | undefined;
+    onSubmitCapture?: react.SubmitEventHandler<HTMLDivElement> | undefined;
+    onInvalid?: react.ReactEventHandler<HTMLDivElement> | undefined;
+    onInvalidCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
     onLoad?: react.ReactEventHandler<HTMLDivElement> | undefined;
     onLoadCapture?: react.ReactEventHandler<HTMLDivElement> | undefined;
     onError?: react.ReactEventHandler<HTMLDivElement> | undefined;
@@ -6589,7 +6886,7 @@ type FormProps = WebComponentProps & {
 type BadgeProps = WebComponentProps & {
     variant?: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger';
     size?: 's' | 'm' | 'l';
-    badgeStyle?: 'dot' | 'number' | 'text' | 'outlined';
+    type?: 'dot' | 'number' | 'text' | 'outlined';
     count?: number;
     maxCount?: number;
     disabled?: boolean;
@@ -6699,6 +6996,35 @@ type StatChange = {
     type: 'increase' | 'decrease';
     period?: string;
 };
+type ActivityHeatmapItem = {
+    date: string;
+    value: number;
+};
+type ActivityHeatmapCellDetail = {
+    date: string;
+    value: number;
+    level: number;
+};
+type ActivityHeatmapProps = WebComponentProps & {
+    data?: string | ActivityHeatmapItem[];
+    endDate?: string;
+    weeks?: number;
+    weekStartsOn?: 0 | 1;
+    size?: 's' | 'm' | 'l';
+    locale?: string;
+    colorScheme?: 'green' | 'primary';
+    showLegend?: boolean;
+    showMonthLabels?: boolean;
+    showDayLabels?: boolean;
+    legendLessLabel?: string;
+    legendMoreLabel?: string;
+    valueLabel?: string;
+    maxValue?: number;
+    footerText?: string;
+    footerHref?: string;
+    onCellClick?: DbEventHandler<ActivityHeatmapCellDetail>;
+    onDbCellClick?: DbEventHandler<ActivityHeatmapCellDetail>;
+};
 type StatProps = WebComponentProps & {
     value?: string | number;
     label?: string;
@@ -7226,6 +7552,17 @@ type SidebarSection = {
     gap?: 'none' | 's' | 'm' | 'l';
     items: SidebarItem[];
 };
+type SidebarPanelMode = 'auto' | 'adjacent' | 'replace';
+type SidebarPanel = {
+    id: string;
+    title: string;
+    description?: string;
+    ariaLabel?: string;
+    backLabel?: string;
+    /** @deprecated 레이아웃 폭은 panelWidth만 사용합니다. */
+    width?: number | string;
+    sections: SidebarSection[];
+};
 type SidebarUserProfile = {
     name: string;
     email?: string;
@@ -7282,8 +7619,20 @@ type SidebarProps = WebComponentProps & {
     headerType?: 'default' | 'back';
     backLabel?: string;
     backHref?: string;
+    /** 범용 Secondary Panel 목록입니다. openPanel id와 연결합니다. */
+    panels?: SidebarPanel[] | string;
+    /**
+     * @deprecated panels를 사용하세요. settings 패널로 자동 변환됩니다.
+     */
     settingsSections?: SidebarSection[] | string;
+    /** 현재 열린 패널 id. 닫을 때는 main. */
     activePanel?: string;
+    /** auto(기본) · adjacent · replace */
+    panelMode?: SidebarPanelMode;
+    /** Secondary Panel 기본 너비. 숫자(px) 또는 CSS length. */
+    panelWidth?: number | string;
+    /** panelMode=auto일 때 adjacent 전환 기준(px). 기본 1024. */
+    panelBreakpoint?: number;
     size?: 's' | 'm' | 'l';
     /** 레이아웃 외형입니다. default(우측 보더만) · wrapper(패딩+radius+보더 카드형). */
     variant?: 'default' | 'wrapper';
@@ -7305,11 +7654,19 @@ type SidebarProps = WebComponentProps & {
     }>;
     onPanelChange?: DbEventHandler<{
         panel: string;
-        previous?: string;
+        panelConfig?: SidebarPanel | null;
+        mode?: Exclude<SidebarPanelMode, 'auto'>;
     }>;
     onDbPanelChange?: DbEventHandler<{
         panel: string;
-        previous?: string;
+        panelConfig?: SidebarPanel | null;
+        mode?: Exclude<SidebarPanelMode, 'auto'>;
+    }>;
+    onPanelModeChange?: DbEventHandler<{
+        mode: Exclude<SidebarPanelMode, 'auto'>;
+    }>;
+    onDbPanelModeChange?: DbEventHandler<{
+        mode: Exclude<SidebarPanelMode, 'auto'>;
     }>;
     onPromoCtaClick?: DbEventHandler<{
         banner: SidebarPromoBanner;
@@ -7461,7 +7818,7 @@ type ProgressStepProps = WebComponentProps & {
 };
 type ToastProps = WebComponentProps & {
     toastId?: string;
-    status?: 'info' | 'success' | 'warning' | 'error';
+    variant?: 'default' | 'info' | 'success' | 'warning' | 'danger';
     title?: string;
     description?: string;
     duration?: number;
@@ -7673,7 +8030,7 @@ type AvatarProps = WebComponentProps & {
     badge?: number;
     badgeMaxCount?: number;
     badgeVariant?: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger';
-    badgeStyle?: 'dot' | 'number' | 'text' | 'outlined';
+    badgeType?: 'dot' | 'number' | 'text' | 'outlined';
     badgeText?: string;
     onClick?: DbEventHandler;
     onDbClick?: DbEventHandler;
@@ -9403,16 +9760,6 @@ type CursorFollowerProps = WebComponentProps & {
     hideNativeCursor?: boolean;
     showIcon?: boolean;
 };
-type LottieProps = WebComponentProps & {
-    src?: string;
-    animationData?: object | string;
-    loop?: boolean;
-    autoplay?: boolean;
-    speed?: number;
-    width?: string | number;
-    height?: string | number;
-    renderer?: 'svg' | 'canvas' | 'html';
-};
 type SelectProps = SelectionProps & {
     showClearButton?: boolean;
 };
@@ -9548,7 +9895,7 @@ type ChatTypingProps = WebComponentProps & {
 };
 type ChatWidgetProps = WebComponentProps & {
     open?: boolean;
-    view?: 'home' | 'messages' | 'conversation' | 'help';
+    view?: 'home' | 'messages' | 'conversation' | 'help' | 'article';
     position?: 'bottom-right' | 'bottom-left';
     agentName?: string;
     agentAvatar?: string;
@@ -9561,12 +9908,11 @@ type ChatWidgetProps = WebComponentProps & {
     accent?: string;
     orbVariant?: 'aurora' | 'ocean' | 'emerald' | 'violet' | 'mono';
     launcherLabel?: string;
-    searchEnabled?: boolean;
     messages?: DbChatWidgetMessage[];
     conversations?: DbChatWidgetConversation[];
-    menuItems?: DbChatSuggestion[];
+    menuItems?: DbChatWidgetMenuItem[];
     quickReplies?: DbChatSuggestion[];
-    articles?: DbChatSuggestion[];
+    articles?: DbChatWidgetArticle[];
     onOpen?: DbEventHandler;
     onClose?: DbEventHandler;
     onToggle?: DbEventHandler<{
@@ -9581,6 +9927,7 @@ type ChatWidgetProps = WebComponentProps & {
     onMenuSelect?: DbEventHandler<{
         id: string;
         value: string;
+        action?: string;
     }>;
     onQuickReply?: DbEventHandler<{
         id: string;
@@ -9597,6 +9944,7 @@ type ChatWidgetProps = WebComponentProps & {
         action: string;
         text: string;
     }>;
+    onStartChat?: DbEventHandler;
 };
 declare const ChatOrb: react.ForwardRefExoticComponent<Omit<ChatOrbProps, "ref"> & react.RefAttributes<HTMLElement>>;
 declare const ChatWelcome: react.ForwardRefExoticComponent<Omit<ChatWelcomeProps, "ref"> & react.RefAttributes<HTMLElement>>;
@@ -9713,6 +10061,7 @@ declare const Share: react.ForwardRefExoticComponent<Omit<ShareProps, "ref"> & r
 declare const TopBanner: react.ForwardRefExoticComponent<Omit<TopBannerProps, "ref"> & react.RefAttributes<HTMLElement>>;
 declare const CookieBanner: react.ForwardRefExoticComponent<Omit<CookieBannerProps, "ref"> & react.RefAttributes<HTMLElement>>;
 declare const Stat: react.ForwardRefExoticComponent<Omit<StatProps, "ref"> & react.RefAttributes<HTMLElement>>;
+declare const ActivityHeatmap: react.ForwardRefExoticComponent<Omit<ActivityHeatmapProps, "ref"> & react.RefAttributes<HTMLElement>>;
 declare const Image: react.ForwardRefExoticComponent<Omit<ImageProps, "ref"> & react.RefAttributes<HTMLElement>>;
 declare const ImagePlaceholder: react.ForwardRefExoticComponent<Omit<ImagePlaceholderProps, "ref"> & react.RefAttributes<HTMLElement>>;
 declare const ImageList: react.ForwardRefExoticComponent<Omit<ImageListProps, "ref"> & react.RefAttributes<HTMLElement>>;
@@ -9800,7 +10149,6 @@ type GridBackgroundProps = WebComponentProps & {
 };
 declare const GridBackground: react.ForwardRefExoticComponent<Omit<GridBackgroundProps, "ref"> & react.RefAttributes<HTMLElement>>;
 declare const CursorFollower: react.ForwardRefExoticComponent<Omit<CursorFollowerProps, "ref"> & react.RefAttributes<HTMLElement>>;
-declare const Lottie: react.ForwardRefExoticComponent<Omit<LottieProps, "ref"> & react.RefAttributes<HTMLElement>>;
 declare const PageHeader: react.ForwardRefExoticComponent<Omit<PageHeaderProps, "ref"> & react.RefAttributes<HTMLElement>>;
 declare const Section: react.ForwardRefExoticComponent<Omit<SectionProps, "ref"> & react.RefAttributes<HTMLElement>>;
 declare const FloatingActionButton: react.ForwardRefExoticComponent<Omit<FloatingActionButtonProps, "ref"> & react.RefAttributes<HTMLElement>>;
@@ -9814,5 +10162,5 @@ declare const DatePicker: react.ForwardRefExoticComponent<Omit<DatePickerProps,
 declare const TimePicker: react.ForwardRefExoticComponent<Omit<TimePickerProps, "ref"> & react.RefAttributes<HTMLElement>>;
 declare const Calendar: react.ForwardRefExoticComponent<Omit<CalendarProps, "ref"> & react.RefAttributes<HTMLElement>>;
 
-export { Accordion, AdBanner, AiChat, AiChatList, Alert, AnimationBackground, AnimationText, AppBadge, AudioPlayer, Avatar, Backdrop, Badge, Banner, BottomNavigation, BottomSheet, Breadcrumbs, Button, Calendar, Card, Carousel, ChatComposer, ChatList, ChatMessage, ChatOrb, ChatRoom, ChatSuggestions, ChatTyping, ChatWelcome, ChatWidget, Checkbox, Chip, CodeBlock, ColorPicker, ColorSwatch, Confirm, Container, ContextMenu, CookieBanner, Countdown, CursorFollower, DatePicker, Divider, DownloadProgress, Drawer, Dropdown, Dropzone, EmailVerify, EmptyState, FileUploader, FloatingActionButton, Footer, Form, Gantt, Gradient, Grid, GridBackground, GridItem, Image, ImageList, ImagePlaceholder, Indicator, Input, Kanban, Label, Lightbox, List, Logo, Lottie, MarkdownEditor, Marquee, Masonry, MenuItem, Modal, ModalBody, ModalFooter, ModalHeader, Navbar, OnboardingModal, OtpInput, PageHeader, Pagination, PhoneVerify, Popover, Progress, ProgressStep, Progressbar, Radio, RandomGradient, RangeSlider, Rating, Reorder, ResizablePanels, ScrollArea, SearchBar, Section, SectionAppDownload, SectionContact, SectionCta, SectionFaq, SectionFeature, SectionFeatureGrid, SectionHero, SectionLogoCloud, SectionPricing, SectionStats, SectionTestimonials, SegmentControl, Select, Share, Sidebar, Signature, Skeleton, Spinner, SplitView, Stack, Stat, Stepper, Table, Tabs, Testimonial, Textarea, TimePicker, Timeline, Toast, Toggle, Toolbar, Tooltip, TopBanner, Tutorial, TwoFactor, VideoPlayer, YouTubePlayer, useContextMenu };
-export type { AccordionItemConfig, AccordionProps, AdBannerProps, AiChatListProps, AiChatProps, AlertAction, AlertProps, AnimationBackgroundProps, AnimationTextProps, AppBadgeProps, AudioPlayerProps, AvatarProps, BackdropProps, BadgeProps, BannerAction, BannerProps, BottomNavigationItem, BottomNavigationProps, BottomSheetProps, BreadcrumbItemConfig, BreadcrumbMenuItemConfig, BreadcrumbsProps, ButtonProps, CalendarEvent, CalendarProps, CardProps, CarouselItem, CarouselProps, ChatComposerProps, ChatListProps, ChatMessageProps, ChatOrbProps, ChatRoomProps, ChatSuggestionsProps, ChatTypingProps, ChatWelcomeProps, ChatWidgetProps, ChipProps, CodeBlockItem, CodeBlockProps, ColorPickerProps, ColorSwatchItem, ColorSwatchProps, ConfirmProps, ContextMenuItemConfig, ContextMenuProps, CookieBannerProps, CountdownProps, CursorFollowerProps, DatePickerProps, DbChatSuggestion, DbChatTool, DbChatWidgetConversation, DbChatWidgetMessage, DbEventHandler, DividerProps, DownloadProgressProps, DrawerProps, DropdownItemConfig, DropdownProps, DropzoneProps, EmailVerifyProps, EmptyStateProps, FileUploaderProps, FloatingActionButtonProps, FooterCompanyInfo, FooterFamilySite, FooterLink, FooterLinkColumn, FooterProps, FooterSocialLink, FormFieldData, FormProps, GanttAssignee, GanttGroup, GanttItem, GanttProps, GanttRow, GradientColor, GradientProps, GradientScheme, GradientTone, GridBackgroundProps, ImageListItem, ImageListProps, ImagePlaceholderProps, ImageProps, IndicatorProps, InputProps, KanbanAssignee, KanbanCard, KanbanColumn, KanbanProps, KanbanTag, LabelProps, LightboxImage, LightboxProps, ListItemConfig, ListProps, LogoProps, LottieProps, MarkdownEditorProps, MarqueeImageItem, MarqueeProps, MasonryItem, MasonryProps, MenuItemChildConfig, MenuItemProps, ModalProps, ModalSegmentItem, ModalTabItem, NavbarItem, NavbarProps, NavbarUserProfile, OnboardingModalProps, OnboardingStep, OtpInputProps, PageHeaderProps, PageHeaderTabItem, PaginationProps, PhoneVerifyProps, PopoverProps, ProgressProps, ProgressStepItem, ProgressStepProps, RadioProps, RandomGradientProps, RangeSliderProps, RatingProps, ReorderItem, ReorderProps, ResizablePanelsProps, ScrollAreaProps, SearchBarProps, SectionAppDownloadProps, SectionAppDownloadStore, SectionBlockBadge, SectionContactAction, SectionContactProps, SectionCtaButton, SectionCtaProps, SectionFaqItem, SectionFaqProps, SectionFeatureAction, SectionFeatureBadge, SectionFeatureGridItem, SectionFeatureGridProps, SectionFeatureProps, SectionHeroButton, SectionHeroProps, SectionLogoCloudItem, SectionLogoCloudProps, SectionPricingCta, SectionPricingPlan, SectionPricingProps, SectionProps, SectionStatItem, SectionStatsProps, SectionTestimonialItem, SectionTestimonialsProps, SegmentControlProps, SelectProps, SelectionProps, SharePlatform, ShareProps, SidebarItem, SidebarProject, SidebarPromoBanner, SidebarProps, SidebarSection, SidebarUpdateBanner, SidebarUserProfile, SignatureProps, SkeletonProps, SpinnerProps, SplitViewProps, StatChange, StatProps, StepperProps, TabItemConfig, TableColumn, TableProps, TabsProps, TestimonialProps, TextareaProps, TimePickerProps, TimelineItem, TimelineProps, ToastProps, ToggleProps, TooltipProps, TopBannerProps, TutorialProps, TutorialStep, TwoFactorProps, UseContextMenuReturn, VideoPlayerProps, WebComponentProps, YouTubePlayerProps };
+export { Accordion, ActivityHeatmap, AdBanner, AiChat, AiChatList, Alert, AnimationBackground, AnimationText, AppBadge, AudioPlayer, Avatar, Backdrop, Badge, Banner, BottomNavigation, BottomSheet, Breadcrumbs, Button, Calendar, Card, Carousel, ChatComposer, ChatList, ChatMessage, ChatOrb, ChatRoom, ChatSuggestions, ChatTyping, ChatWelcome, ChatWidget, Checkbox, Chip, CodeBlock, ColorPicker, ColorSwatch, Confirm, Container, ContextMenu, CookieBanner, Countdown, CursorFollower, DatePicker, Divider, DownloadProgress, Drawer, Dropdown, Dropzone, EmailVerify, EmptyState, FileUploader, FloatingActionButton, Footer, Form, Gantt, Gradient, Grid, GridBackground, GridItem, Image, ImageList, ImagePlaceholder, Indicator, Input, Kanban, Label, Lightbox, List, Logo, MarkdownEditor, Marquee, Masonry, MenuItem, Modal, ModalBody, ModalFooter, ModalHeader, Navbar, OnboardingModal, OtpInput, PageHeader, Pagination, PhoneVerify, Popover, Progress, ProgressStep, Progressbar, Radio, RandomGradient, RangeSlider, Rating, Reorder, ResizablePanels, ScrollArea, SearchBar, Section, SectionAppDownload, SectionContact, SectionCta, SectionFaq, SectionFeature, SectionFeatureGrid, SectionHero, SectionLogoCloud, SectionPricing, SectionStats, SectionTestimonials, SegmentControl, Select, Share, Sidebar, Signature, Skeleton, Spinner, SplitView, Stack, Stat, Stepper, Table, Tabs, Testimonial, Textarea, TimePicker, Timeline, Toast, Toggle, Toolbar, Tooltip, TopBanner, Tutorial, TwoFactor, VideoPlayer, YouTubePlayer, useContextMenu };
+export type { AccordionItemConfig, AccordionProps, ActivityHeatmapCellDetail, ActivityHeatmapItem, ActivityHeatmapProps, AdBannerProps, AiChatListProps, AiChatProps, AlertAction, AlertProps, AnimationBackgroundProps, AnimationTextProps, AppBadgeProps, AudioPlayerProps, AvatarProps, BackdropProps, BadgeProps, BannerAction, BannerProps, BottomNavigationItem, BottomNavigationProps, BottomSheetProps, BreadcrumbItemConfig, BreadcrumbMenuItemConfig, BreadcrumbsProps, ButtonProps, CalendarEvent, CalendarProps, CardProps, CarouselItem, CarouselProps, ChatComposerProps, ChatListProps, ChatMessageProps, ChatOrbProps, ChatRoomProps, ChatSuggestionsProps, ChatTypingProps, ChatWelcomeProps, ChatWidgetProps, ChipProps, CodeBlockItem, CodeBlockProps, ColorPickerProps, ColorSwatchItem, ColorSwatchProps, ConfirmProps, ContextMenuItemConfig, ContextMenuProps, CookieBannerProps, CountdownProps, CursorFollowerProps, DatePickerProps, DbChatSuggestion, DbChatTool, DbChatWidgetArticle, DbChatWidgetConversation, DbChatWidgetMenuAction, DbChatWidgetMenuItem, DbChatWidgetMessage, DbEventHandler, DividerProps, DownloadProgressProps, DrawerProps, DropdownItemConfig, DropdownProps, DropzoneProps, EmailVerifyProps, EmptyStateProps, FileUploaderProps, FloatingActionButtonProps, FooterCompanyInfo, FooterFamilySite, FooterLink, FooterLinkColumn, FooterProps, FooterSocialLink, FormFieldData, FormProps, GanttAssignee, GanttGroup, GanttItem, GanttProps, GanttRow, GradientColor, GradientProps, GradientScheme, GradientTone, GridBackgroundProps, ImageListItem, ImageListProps, ImagePlaceholderProps, ImageProps, IndicatorProps, InputProps, KanbanAssignee, KanbanCard, KanbanColumn, KanbanProps, KanbanTag, LabelProps, LightboxImage, LightboxProps, ListItemConfig, ListProps, LogoProps, MarkdownEditorProps, MarqueeImageItem, MarqueeProps, MasonryItem, MasonryProps, MenuItemChildConfig, MenuItemProps, ModalProps, ModalSegmentItem, ModalTabItem, NavbarItem, NavbarProps, NavbarUserProfile, OnboardingModalProps, OnboardingStep, OtpInputProps, PageHeaderProps, PageHeaderTabItem, PaginationProps, PhoneVerifyProps, PopoverProps, ProgressProps, ProgressStepItem, ProgressStepProps, RadioProps, RandomGradientProps, RangeSliderProps, RatingProps, ReorderItem, ReorderProps, ResizablePanelsProps, ScrollAreaProps, SearchBarProps, SectionAppDownloadProps, SectionAppDownloadStore, SectionBlockBadge, SectionContactAction, SectionContactProps, SectionCtaButton, SectionCtaProps, SectionFaqItem, SectionFaqProps, SectionFeatureAction, SectionFeatureBadge, SectionFeatureGridItem, SectionFeatureGridProps, SectionFeatureProps, SectionHeroButton, SectionHeroProps, SectionLogoCloudItem, SectionLogoCloudProps, SectionPricingCta, SectionPricingPlan, SectionPricingProps, SectionProps, SectionStatItem, SectionStatsProps, SectionTestimonialItem, SectionTestimonialsProps, SegmentControlProps, SelectProps, SelectionProps, SharePlatform, ShareProps, SidebarItem, SidebarPanel, SidebarPanelMode, SidebarProject, SidebarPromoBanner, SidebarProps, SidebarSection, SidebarUpdateBanner, SidebarUserProfile, SignatureProps, SkeletonProps, SpinnerProps, SplitViewProps, StatChange, StatProps, StepperProps, TabItemConfig, TableColumn, TableProps, TabsProps, TestimonialProps, TextareaProps, TimePickerProps, TimelineItem, TimelineProps, ToastProps, ToggleProps, TooltipProps, TopBannerProps, TutorialProps, TutorialStep, TwoFactorProps, UseContextMenuReturn, VideoPlayerProps, WebComponentProps, YouTubePlayerProps };