@lius1314/visual-dashboard-scaffold 1.0.0

package/dist/types/index.d.ts

@@ -0,0 +1,25 @@
+/**
+ * visual-dashboard-scaffold - 可视化大屏脚手架
+ *
+ * 导出所有公共组件、类型、工具函数，供外部使用。
+ */
+export { default as App } from './App';
+export { OuterContainer } from './components/OuterContainer';
+export { HeaderSection } from './components/HeaderSection';
+export { MiddleSection } from './components/MiddleSection';
+export { FooterSection } from './components/FooterSection';
+export { SettingsPanel } from './components/SettingsPanel';
+export { ChartBlock } from './components/ChartBlock';
+export { BackgroundPicker } from './components/BackgroundPicker';
+export { useConfigStore, defaultConfig } from './store/configStore';
+export type { ConfigStore } from './store/configStore';
+export { registerBlock, getBlockComponent, getRegisteredBlockIds } from './blocks/registry';
+export type { BlockComponentProps } from './blocks/registry';
+export { SampleMonitor } from './blocks/SampleBlock';
+export type { CSSSize, ColorValue, AutofitConfig, OuterContainerConfig, SectionConfig, HeaderTitleConfig, HeaderPanel, HeaderSectionConfig, ChartBlockLayout, ChartBlockConfig, BottomBlockItem, BottomSectionConfig, GlobalConfig, } from './types';
+export { resolveBackground } from './utils/background';
+export { cn } from './utils/cn';
+export { BUILTIN_ICONS, BUILTIN_EMOJIS } from './utils/icons';
+export type { IconItem } from './utils/icons';
+export { fetchRealtimeData } from './api/monitor';
+export type { MonitorRealtimeData, VisitTrendSeries } from './api/monitor';

package/dist/types/store/configStore.d.ts

@@ -0,0 +1,28 @@
+import type { GlobalConfig, ChartBlockConfig, ChartBlockLayout, BottomBlockItem, SectionConfig, BottomSectionConfig, OuterContainerConfig, HeaderSectionConfig, HeaderTitleConfig, HeaderPanel } from '../types';
+export declare const defaultConfig: GlobalConfig;
+export declare function useConfigStore(): {
+    config: GlobalConfig;
+    setConfig: import("react").Dispatch<import("react").SetStateAction<GlobalConfig>>;
+    setEditMode: (enabled: boolean) => void;
+    setGlobalBackground: (bg: string) => void;
+    updateOuter: (patch: Partial<OuterContainerConfig>) => void;
+    updateHeader: (patch: Partial<HeaderSectionConfig>) => void;
+    updateHeaderTitle: (patch: Partial<HeaderTitleConfig>) => void;
+    addHeaderPanel: (side: "left" | "right") => void;
+    removeHeaderPanel: (side: "left" | "right", id: string) => void;
+    updateHeaderPanel: (side: "left" | "right", id: string, patch: Partial<HeaderPanel>) => void;
+    updateMiddle: (patch: Partial<SectionConfig>) => void;
+    updateFooter: (patch: Partial<BottomSectionConfig>) => void;
+    addChartBlock: () => void;
+    removeChartBlock: (id: string) => void;
+    updateChartBlock: (id: string, patch: Partial<ChartBlockConfig>) => void;
+    updateChartLayouts: (layouts: ChartBlockLayout[]) => void;
+    reorderChartBlocks: (orderedIds: string[]) => void;
+    addBottomItem: () => void;
+    removeBottomItem: (id: string) => void;
+    updateBottomItem: (id: string, patch: Partial<BottomBlockItem>) => void;
+    exportConfig: () => void;
+    importConfig: (jsonStr: string) => void;
+    resetConfig: () => void;
+};
+export type ConfigStore = ReturnType<typeof useConfigStore>;

package/dist/types/types/index.d.ts

@@ -0,0 +1,88 @@
+export interface CSSSize {
+    value: number | string;
+    unit?: 'px' | '%' | 'vh' | 'vw' | 'rem' | 'em';
+}
+export type ColorValue = string;
+export interface AutofitConfig {
+    enabled: boolean;
+    designWidth?: number;
+    designHeight?: number;
+    renderDom?: string;
+    resize?: boolean;
+    transition?: number;
+    delay?: number;
+}
+export interface OuterContainerConfig {
+    width: number | string;
+    height: number | string;
+    background: ColorValue;
+    autofit?: AutofitConfig;
+}
+export interface SectionConfig {
+    height: number | string;
+    background: ColorValue;
+    visible?: boolean;
+}
+export interface HeaderTitleConfig {
+    text: string;
+    fontSize: number;
+    color: string;
+    fontWeight: number;
+    letterSpacing: number;
+    fontFamily: string;
+    useGradient: boolean;
+    gradientCss: string;
+}
+export interface HeaderPanel {
+    id: string;
+    width: number;
+    background: ColorValue;
+    title: string;
+}
+export interface HeaderSectionConfig extends SectionConfig {
+    title: HeaderTitleConfig;
+    leftPanels: HeaderPanel[];
+    rightPanels: HeaderPanel[];
+}
+export interface ChartBlockLayout {
+    i: string;
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+    zIndex?: number;
+    minW?: number;
+    minH?: number;
+}
+export interface ChartBlockConfig {
+    id: string;
+    title: string;
+    titleHeight: number;
+    titleBackground: ColorValue;
+    contentBackground: ColorValue;
+    blockBackground: ColorValue;
+    layout: ChartBlockLayout;
+}
+export interface BottomBlockItem {
+    id: string;
+    icon: string;
+    iconType?: 'emoji' | 'iconfont' | 'image';
+    label: string;
+    color?: ColorValue;
+}
+export interface BottomSectionConfig extends SectionConfig {
+    items: BottomBlockItem[];
+    itemWidth?: number;
+    itemGap?: number;
+}
+export interface GlobalConfig {
+    editMode: boolean;
+    globalBackground: ColorValue;
+    outer: OuterContainerConfig;
+    header: HeaderSectionConfig;
+    middle: SectionConfig;
+    footer: BottomSectionConfig;
+    chartBlocks: ChartBlockConfig[];
+    cols?: number;
+    rowHeight?: number;
+}

package/dist/types/utils/background.d.ts

@@ -0,0 +1,11 @@
+/**
+ * 解析背景值，支持:
+ *   - CSS 颜色: '#0f172a', 'rgba(0,0,0,0.5)'
+ *   - CSS 渐变: 'linear-gradient(...)'
+ *   - 图片路径: '/assets/bg.png' (自动包装为 url())
+ *   - 已包装的: 'url(/assets/bg.png)'
+ *   - 混合值:   'url(/assets/bg.png) center/cover no-repeat'
+ *
+ * 返回可直接用于 CSS background 属性的字符串。
+ */
+export declare function resolveBackground(value: string | undefined | null): string;

package/dist/types/utils/cn.d.ts

@@ -0,0 +1,2 @@
+import { type ClassValue } from "clsx";
+export declare function cn(...inputs: ClassValue[]): string;

package/dist/types/utils/icons.d.ts

@@ -0,0 +1,16 @@
+/**
+ * 内置图标列表
+ * Font Awesome 6 免费版 (2000+ 图标)
+ * CDN 已在 index.html 中引入
+ *
+ * 使用方式: <i className="fa-solid fa-chart-line" />
+ * 图标浏览: https://fontawesome.com/search?o=r&m=free
+ */
+export interface IconItem {
+    name: string;
+    label: string;
+}
+/** 内置大屏常用 Font Awesome 图标 */
+export declare const BUILTIN_ICONS: IconItem[];
+/** 内置 emoji 图标 */
+export declare const BUILTIN_EMOJIS: string[];