@aithe/aithe-ui 26.2.2 → 26.3.1

package/dist/components/framework/dashboard.d.ts

@@ -0,0 +1,182 @@
+import { AitheElement } from '../../core/aithe-element';
+import './dashboard-panel';
+/** Panel layout state record. 面板布局状态记录。 */
+export interface DashboardPanelState {
+    panelId: string;
+    label: string;
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+    visible: boolean;
+    maximized: boolean;
+}
+/**
+ * Drag-and-drop dashboard parent component. Uses CSS Grid for panel positioning.
+ * Manages all child panel layout, visibility, drag-swap, resize, auto-rearrange, and state persistence.
+ * The grid auto-fills the container width — cellWidth is computed from container width / columns.
+ *
+ * 拖拽式仪表盘父组件。使用 CSS Grid 管理面板定位，统一管理子面板布局、显隐、拖拽换位、
+ * 调整大小、自动重排和状态持久化。网格自动填充容器宽度——cellWidth 由容器宽度/列数计算。
+ *
+ * @slot - Default slot for dashboard-panel children. 默认插槽，放置 dashboard-panel 子组件。
+ * @slot toolbar - Slot for custom toolbar buttons (inserted at the left side of the toolbar). 工具栏插槽，用于插入自定义按钮（位于工具栏左侧）。
+ *
+ * @csspart toolbar - The header toolbar bar. 头部工具栏。
+ * @csspart grid - The CSS Grid container. CSS Grid 容器。
+ *
+ * @fires aithe-dashboard-change - Emitted when panel layout changes with `{ panels }`. 面板布局变更时发出。
+ * @fires aithe-dashboard-fullscreen - Emitted when fullscreen mode toggles with `{ fullscreen }`. 全屏模式切换时发出。
+ *
+ * @example
+ * ```html
+ * <aithe-dashboard columns="12" cell-height="60" gap="10">
+ *   <aithe-dashboard-panel panel-id="stats" x="0" y="0" w="6" h="4" label="Statistics" icon="barChart">
+ *     <p>Stats content</p>
+ *   </aithe-dashboard-panel>
+ * </aithe-dashboard>
+ * ```
+ */
+export declare class AitheDashboard extends AitheElement {
+    /** Total number of grid columns. 网格总列数。 */
+    columns: number;
+    /** Base cell height in pixels. 格子基础高度（像素）。 */
+    cellHeight: number;
+    /** Gap between grid cells in pixels. 格子间距（像素）。 */
+    gap: number;
+    /** Whether the dashboard is locked (disables all drag and resize). 仪表盘是否锁定（禁用所有拖拽和调整大小）。 */
+    locked: boolean;
+    /** Storage key for persisting panel state. If empty, persistence is disabled. 状态持久化存储键，为空则禁用持久化。 */
+    storageKey: string;
+    /** Whether to show the built-in toolbar header. 是否显示内置工具栏头部。 */
+    showToolbar: boolean;
+    /** Whether to show the visibility dropdown button. 是否显示可见性下拉按钮。 */
+    showVisibility: boolean;
+    /** Whether to show the lock toggle button. 是否显示锁定切换按钮。 */
+    showLock: boolean;
+    /** Whether to show the reset button. 是否显示重置按钮。 */
+    showReset: boolean;
+    /** Whether to show the fullscreen toggle button. 是否显示全屏切换按钮。 */
+    showFullscreen: boolean;
+    /** Whether to show the theme picker button. 是否显示主题选择按钮。 */
+    showTheme: boolean;
+    /** Whether to show the auto-arrange button. 是否显示自动重排按钮。 */
+    showAutoArrange: boolean;
+    /** Whether to show the toggle content button. 是否显示内容切换按钮。 */
+    showToggleContent: boolean;
+    private panelStates;
+    private visibilityDropdownOpen;
+    private fullscreen;
+    /** Whether the grid content area is visible. 网格内容区域是否可见。 */
+    private showContent;
+    /** Internal theme for scoping theme changes to the dashboard only. 仅作用于仪表盘内部的本地主题。 */
+    private dashboardTheme;
+    private readonly gridContainer?;
+    private readonly visibilityDropdownEl?;
+    /** Computed cell width derived from container width / columns. 由容器宽度/列数计算的格子宽度。 */
+    private computedCellWidth;
+    /** Initial panel states from DOM attributes, used for reset. 从 DOM 属性读取的初始面板状态，用于重置。 */
+    private readonly initialPanelStates;
+    private dragTargetId;
+    private dragStartGridX;
+    private dragStartGridY;
+    private resizeTargetId;
+    private resizeEdge;
+    private resizeStartW;
+    private resizeStartH;
+    private resizeStartX;
+    private resizeStartY;
+    private resizeObserver;
+    private readonly handleSlotChange;
+    private readonly handlePanelClose;
+    private readonly handlePanelDragStart;
+    private readonly handlePanelDrag;
+    private readonly handlePanelDragEnd;
+    private readonly handlePanelMaximize;
+    /** Handle panel resize start event. 处理面板调整大小开始事件。 */
+    private readonly handlePanelResizeStart;
+    /** Handle panel resize move event. Auto-rearranges overlapping panels like drag. 处理面板调整大小移动事件。与拖拽一样自动重排重叠面板。 */
+    private readonly handlePanelResize;
+    /** Handle panel resize end event. 处理面板调整大小结束事件。 */
+    private readonly handlePanelResizeEnd;
+    static readonly styles: (import("lit").CSSResult | import("lit").CSSResult[])[];
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected updated(changed: Map<string, unknown>): void;
+    /** Setup ResizeObserver to recalculate cell width when container resizes. 设置 ResizeObserver 以在容器尺寸变化时重新计算格子宽度。 */
+    private setupResizeObserver;
+    /** Recalculate cellWidth from container width. 根据容器宽度重新计算格子宽度。 */
+    private recalcCellWidth;
+    private syncPanelsFromDOM;
+    private applyPanelAttributes;
+    private updateGridHeight;
+    private updatePanelState;
+    private clampX;
+    /**
+     * Move a panel to new position and auto-rearrange overlapping panels.
+     * When the moving panel overlaps another, push the overlapped panel to the next available position.
+     * 移动面板到新位置并自动重排重叠面板。当移动面板与另一面板重叠时，将被重叠面板推到下一个可用位置。
+     */
+    private movePanelWithAutoRearrange;
+    /** Find all panels overlapping the given rect. 查找与给定矩形重叠的所有面板。 */
+    private findAllOverlapping;
+    /**
+     * Push an overlapped panel to the first available position below the moving panel.
+     * 将被重叠的面板推到移动面板下方的第一个可用位置。
+     */
+    private pushPanelDown;
+    /**
+     * Find the next available grid slot for a panel of given size, scanning left-to-right top-to-bottom.
+     * 为给定尺寸的面板查找下一个可用网格位置，从左到右、从上到下扫描。
+     */
+    private findNextAvailableSlot;
+    /**
+     * Auto-arrange all visible panels into a compact grid, scanning left-to-right top-to-bottom.
+     * 自动重排所有可见面板为紧凑网格，从左到右、从上到下扫描。
+     */
+    private readonly autoArrangeAll;
+    /** Like findNextAvailableSlot but checks against a provided Map instead of this.panelStates. 与 findNextAvailableSlot 类似，但检查提供的 Map 而非 this.panelStates。 */
+    private findNextAvailableSlotInMap;
+    /** Like findAllOverlapping but checks against a provided Map. 与 findAllOverlapping 类似，但检查提供的 Map。 */
+    private findAllOverlappingInMap;
+    /**
+     * Resize a panel to new position/size and auto-rearrange overlapping panels.
+     * When the resized panel overlaps another, push the overlapped panel to the next available position.
+     * 调整面板到新位置/尺寸并自动重排重叠面板。当调整后的面板与另一面板重叠时，将被重叠面板推到下一个可用位置。
+     */
+    private resizePanelWithAutoRearrange;
+    private swapPanels;
+    private getPanelStatesArray;
+    private getStorageFullKey;
+    private saveState;
+    private restoreState;
+    private readonly toggleLock;
+    private readonly toggleVisibilityDropdown;
+    private readonly togglePanelVisibility;
+    /** Reset all panels to their initial DOM-defined positions and sizes. 重置所有面板到初始 DOM 定义的位置和尺寸。 */
+    private readonly resetToDefault;
+    /** Toggle dashboard fullscreen mode for big-screen display. 切换仪表盘全屏模式，用于大屏显示。 */
+    private readonly toggleFullscreen;
+    /** Handle theme change from the theme picker. Scoped to dashboard only — prevents global theme switch and applies data-aithe-theme on the internal wrapper. 处理主题选择器的主题变更。仅作用于仪表盘内部——阻止全局主题切换，并在内部容器上设置 data-aithe-theme。 */
+    private readonly handleThemeChange;
+    private readonly handleDocClick;
+    /** Render visibility dropdown button. 渲染可见性下拉按钮。 */
+    private renderVisibilityBtn;
+    /** Render reset button. 渲染重置按钮。 */
+    private renderResetBtn;
+    /** Render lock toggle button. 渲染锁定切换按钮。 */
+    private renderLockBtn;
+    /** Render fullscreen toggle button. 渲染全屏切换按钮。 */
+    private renderFullscreenBtn;
+    /** Render theme picker button. 渲染主题选择按钮。 */
+    private renderThemeBtn;
+    /** Render auto-arrange button. 渲染自动重排按钮。 */
+    private renderAutoArrangeBtn;
+    /** Render toggle content button. 渲染内容切换按钮。 */
+    private renderToggleContentBtn;
+    private renderToolbar;
+    /** Compute outer margin for grid container (gap, minimum 20px). 计算网格容器外边距（gap，最小 20px）。 */
+    private get outerMargin();
+    render(): import("lit-html").TemplateResult<1>;
+}
+//# sourceMappingURL=dashboard.d.ts.map

package/dist/components/framework/dashboard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dashboard.d.ts","sourceRoot":"","sources":["../../../src/components/framework/dashboard.ts"],"names":[],"mappings":"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"}