@vela-studio/ui 1.0.1

package/dist/index.d.ts

@@ -0,0 +1,696 @@
+import { App } from 'vue';
+import { Component } from 'vue';
+import { ComponentOptionsMixin } from 'vue';
+import { ComponentProvideOptions } from 'vue';
+import { DefineComponent } from 'vue';
+import { PublicProps } from 'vue';
+import { Ref } from 'vue';
+
+declare const __VLS_component: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
+click: (event: MouseEvent) => any;
+}, string, PublicProps, Readonly<__VLS_Props> & Readonly<{
+onClick?: ((event: MouseEvent) => any) | undefined;
+}>, {
+text: string;
+type: "primary" | "success" | "warning" | "danger" | "info" | "default";
+size: "large" | "default" | "small";
+styleConfig: ButtonStyleConfig;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLButtonElement>;
+
+declare const __VLS_component_2: DefineComponent<__VLS_Props_3, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_3> & Readonly<{}>, {
+height: string | number;
+layout: GridLayoutConfig;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+declare type __VLS_Props = {
+    text?: string;
+    type?: 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'default';
+    size?: 'large' | 'default' | 'small';
+    plain?: boolean;
+    round?: boolean;
+    circle?: boolean;
+    disabled?: boolean;
+    loading?: boolean;
+    icon?: string;
+    styleConfig?: ButtonStyleConfig;
+};
+
+declare type __VLS_Props_2 = {
+    header?: StatHeader;
+    content?: StatContent;
+    footer?: StatFooter;
+    styleConfig?: StatStyle;
+};
+
+declare type __VLS_Props_3 = {
+    layout?: GridLayoutConfig;
+    height?: string | number;
+};
+
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLButtonElement;
+};
+
+declare function __VLS_template_2(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+
+declare type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+
+declare type __VLS_TemplateResult_2 = ReturnType<typeof __VLS_template_2>;
+
+declare type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+declare type __VLS_WithTemplateSlots_2<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
+export declare const barChart: Component;
+
+/**
+ * Button V2 (UI Layer)
+ * 纯粹的展示组件，严格遵循 Core Schema 定义
+ */
+declare interface ButtonStyleConfig {
+    backgroundColor?: string;
+    textColor?: string;
+    fontSize?: number;
+    fontWeight?: number | string;
+    borderRadius?: number;
+    borderColor?: string;
+}
+
+/** 聚合簇点击事件数据 */
+export declare interface ClusterClickEvent {
+    /** 聚合簇中心点 */
+    center: GISPoint;
+    /** 聚合簇包含的标记数量 */
+    count: number;
+    /** 聚合簇边界 */
+    bounds: MapBounds;
+    /** 聚合簇内的所有标记 */
+    markers: MarkerPoint[];
+}
+
+/** 聚合图标配置 */
+export declare interface ClusterIconConfig {
+    /** 默认图标 URL */
+    iconUrl?: string;
+    /** 图标大小 */
+    iconSize?: [number, number];
+    /** 图标锚点 */
+    iconAnchor?: [number, number];
+    /** 弹窗锚点 */
+    popupAnchor?: [number, number];
+}
+
+/** 聚合图层配置 */
+export declare interface ClusterLayerConfig {
+    /** 最大聚合半径 */
+    maxClusterRadius?: number;
+    /** 禁用聚合的缩放级别 */
+    disableClusteringAtZoom?: number;
+    /** 最大缩放时展开为蜘蛛网形式 */
+    spiderfyOnMaxZoom?: boolean;
+    /** 鼠标悬停时显示聚合范围 */
+    showCoverageOnHover?: boolean;
+    /** 点击聚合簇时缩放到边界 */
+    zoomToBoundsOnClick?: boolean;
+    /** 是否启用分块加载 */
+    chunkedLoading?: boolean;
+    /** 图标配置 */
+    iconConfig?: ClusterIconConfig;
+    /** 聚合簇样式 */
+    clusterStyle?: ClusterStyleConfig;
+}
+
+/** 聚合簇样式配置 */
+export declare interface ClusterStyleConfig {
+    /** 小聚合簇阈值 */
+    smallThreshold?: number;
+    /** 中聚合簇阈值 */
+    mediumThreshold?: number;
+    /** 小聚合簇样式 */
+    smallStyle?: {
+        backgroundColor?: string;
+        color?: string;
+        size?: number;
+    };
+    /** 中聚合簇样式 */
+    mediumStyle?: {
+        backgroundColor?: string;
+        color?: string;
+        size?: number;
+    };
+    /** 大聚合簇样式 */
+    largeStyle?: {
+        backgroundColor?: string;
+        color?: string;
+        size?: number;
+    };
+}
+
+export declare const componentRegistry: Record<string, Component>;
+
+/** 数据加载状态 */
+export declare type DataLoadingState = 'idle' | 'loading' | 'success' | 'error';
+
+export declare interface DataSource {
+    enabled?: boolean;
+    url?: string;
+    method?: string;
+    headers?: Record<string, string>;
+    body?: string;
+    interval?: number;
+}
+
+/** 带状态的数据包装器 */
+export declare interface DataWithState<T> {
+    data: T;
+    state: DataLoadingState;
+    error?: string;
+    /** 数据版本号，用于增量更新检测 */
+    version?: number;
+}
+
+declare const _default: {
+    install(app: App): void;
+};
+export default _default;
+
+export declare const doughnutChart: Component;
+
+/**
+ * 从数据源提取二维数组（用于散点图等）
+ * @param remoteData - 远程数据对象
+ * @param dataPath - 数据路径
+ */
+export declare function extract2DArray(remoteData: unknown, dataPath: string | undefined): Array<[number, number]> | undefined;
+
+/**
+ * KPI 组件专用：提取多个字段的数据
+ * 用于 stat 组件等需要同时提取多个字段的场景
+ *
+ * @param remoteData - 远程数据对象
+ * @param paths - 字段路径映射 { title: 'data.title', value: 'data.value', ... }
+ * @returns 提取的数据对象
+ *
+ * @example
+ * const data = extractMultipleFields(remoteData, {
+ *   title: 'data.kpi.title',
+ *   value: 'data.kpi.value',
+ *   change: 'data.kpi.change'
+ * })
+ * // 返回: { title: '销售额', value: 12345, change: 5.2 }
+ */
+export declare function extractMultipleFields<T extends Record<string, string | undefined>>(remoteData: unknown, paths: T): Record<keyof T, unknown>;
+
+/**
+ * 从数据源提取单个数值
+ * 用于 KPI 组件（countUp, progress, badge 等）
+ *
+ * @param remoteData - 远程数据对象
+ * @param valuePath - 数值路径，可选
+ * @param defaultValue - 默认值
+ * @returns 提取的数值
+ */
+export declare function extractNumber(remoteData: unknown, valuePath: string | undefined, defaultValue?: number): number;
+
+/**
+ * 从数据源提取数字数组
+ * @param remoteData - 远程数据对象
+ * @param dataPath - 数据路径
+ */
+export declare function extractNumberArray(remoteData: unknown, dataPath: string | undefined): number[] | undefined;
+
+/**
+ * 提取并规范化 Sankey 图连接数据
+ * @param remoteData - 远程数据对象
+ * @param dataPath - 数据路径
+ */
+export declare function extractSankeyLinks(remoteData: unknown, dataPath: string | undefined): Array<{
+    source: string;
+    target: string;
+    value: number;
+}> | undefined;
+
+/**
+ * 提取并规范化 Sankey 图节点数据
+ * @param remoteData - 远程数据对象
+ * @param dataPath - 数据路径
+ */
+export declare function extractSankeyNodes(remoteData: unknown, dataPath: string | undefined): Array<{
+    name: string;
+    value?: number;
+    depth?: number;
+    itemStyle?: unknown;
+}> | undefined;
+
+/**
+ * 从数据源提取字符串值
+ * @param remoteData - 远程数据对象
+ * @param dataPath - 数据路径
+ */
+export declare function extractString(remoteData: unknown, dataPath: string | undefined): string | undefined;
+
+/**
+ * 从数据源提取字符串数组
+ * @param remoteData - 远程数据对象
+ * @param dataPath - 数据路径
+ */
+export declare function extractStringArray(remoteData: unknown, dataPath: string | undefined): string[] | undefined;
+
+/**
+ * 智能提取数据：优先使用路径提取，否则使用默认值
+ * 用于所有简单组件（text, countUp, progress, badge 等）
+ *
+ * @param remoteData - 远程数据对象
+ * @param path - 数据路径
+ * @param fallbackValue - 回退值（当路径未配置或提取失败时使用）
+ * @returns 提取的数据或回退值
+ */
+export declare function extractWithFallback<T>(remoteData: unknown, path: string | undefined, fallbackValue: T): T;
+
+export declare const funnelChart: Component;
+
+export declare const gaugeChart: Component;
+
+/** GeoJSON 数据类型联合 */
+export declare type GeoJSONData<P = Record<string, unknown>> = GeoJSONFeature<P> | GeoJSONFeatureCollection<P>;
+
+/** GeoJSON Feature */
+export declare interface GeoJSONFeature<P = Record<string, unknown>> {
+    type: 'Feature';
+    geometry: GeoJSONGeometry;
+    properties: P;
+    id?: string | number;
+}
+
+/** GeoJSON FeatureCollection */
+export declare interface GeoJSONFeatureCollection<P = Record<string, unknown>> {
+    type: 'FeatureCollection';
+    features: GeoJSONFeature<P>[];
+}
+
+/** GeoJSON 几何对象 */
+export declare interface GeoJSONGeometry {
+    type: GeoJSONGeometryType;
+    coordinates: number[] | number[][] | number[][][] | number[][][][];
+}
+
+/** GeoJSON 几何类型 */
+export declare type GeoJSONGeometryType = 'Point' | 'MultiPoint' | 'LineString' | 'MultiLineString' | 'Polygon' | 'MultiPolygon' | 'GeometryCollection';
+
+/**
+ * 数据提取工具函数（通用）
+ * 用于所有组件的数据源、路径解析、数据格式化等
+ * 图表、KPI、Text 等组件都使用这些工具函数提取数据
+ */
+/**
+ * 从对象中根据路径提取值
+ * 支持点号路径和数组索引，如: "data.chart.values" 或 "items[0].name"
+ *
+ * @param obj - 源数据对象
+ * @param path - 提取路径，可选（为空则返回 undefined）
+ * @returns 提取的值，或 undefined
+ */
+export declare function getValueByPath(obj: unknown, path: string | undefined): unknown;
+
+/**
+ * GIS 通用类型定义
+ * Smart 和 Dumb 组件之间的数据契约
+ */
+/** 基础坐标点 */
+export declare interface GISPoint {
+    lat: number;
+    lng: number;
+}
+
+declare interface GridLayoutConfig {
+    columns?: number;
+    gap?: number;
+    rowGap?: number;
+    autoRows?: string;
+    alignItems?: 'start' | 'end' | 'center' | 'stretch';
+    justifyItems?: 'start' | 'end' | 'center' | 'stretch';
+}
+
+export declare interface GroupProps {
+    /** 容器透明度 0-1 */
+    opacity?: number;
+    /** 是否可见 */
+    visible?: boolean;
+    /** 旋转角度 */
+    rotation?: number;
+    /** 边框圆角 */
+    borderRadius?: number;
+    /** 背景色 */
+    backgroundColor?: string;
+    /** 边框样式 */
+    border?: string;
+    /** 是否显示占位符 */
+    showPlaceholder?: boolean;
+    /** 占位符文本 */
+    placeholder?: string;
+}
+
+/** 将普通数组转换为 HeatPoint 数组的映射配置 */
+export declare interface HeatDataMapping {
+    latField: string;
+    lngField: string;
+    intensityField?: string;
+}
+
+/** 热力图渐变色配置 */
+export declare interface HeatGradient {
+    [stop: number]: string;
+}
+
+/** 热力图配置 */
+export declare interface HeatLayerConfig {
+    /** 热力点半径（像素） */
+    radius?: number;
+    /** 模糊程度（像素） */
+    blur?: number;
+    /** 最大缩放级别 */
+    maxZoom?: number;
+    /** 最大强度值 */
+    max?: number;
+    /** 最小透明度 */
+    minOpacity?: number;
+    /** 渐变色配置 */
+    gradient?: HeatGradient;
+}
+
+/** 带强度的热力点 */
+export declare interface HeatPoint extends GISPoint {
+    /** 热力强度 0-1 */
+    intensity?: number;
+}
+
+/** 图层可见性配置 */
+export declare interface LayerVisibility {
+    id: string;
+    name: string;
+    visible: boolean;
+    type: 'tile' | 'heat' | 'cluster' | 'geojson' | 'vector';
+}
+
+export declare const lineChart: Component;
+
+/** 边界框 */
+export declare interface MapBounds {
+    northEast: GISPoint;
+    southWest: GISPoint;
+}
+
+/** 地图点击事件数据 */
+export declare interface MapClickEvent {
+    latlng: GISPoint;
+    layerPoint: {
+        x: number;
+        y: number;
+    };
+    containerPoint: {
+        x: number;
+        y: number;
+    };
+}
+
+/** 地图视口配置 */
+export declare interface MapViewport {
+    center: GISPoint;
+    zoom: number;
+    bounds?: MapBounds;
+}
+
+/** 标记点击事件数据 */
+export declare interface MarkerClickEvent {
+    marker: MarkerPoint;
+    index: number;
+    originalEvent?: MouseEvent;
+}
+
+/** 将普通数组转换为 MarkerPoint 数组的映射配置 */
+export declare interface MarkerDataMapping {
+    idField?: string;
+    latField: string;
+    lngField: string;
+    labelField?: string;
+    popupField?: string;
+    iconField?: string;
+    dataFields?: string[];
+}
+
+/** 聚合/标记点数据 */
+export declare interface MarkerPoint extends GISPoint {
+    /** 唯一标识 */
+    id?: string | number;
+    /** 标签文本 */
+    label?: string;
+    /** 弹窗内容 */
+    popup?: string;
+    /** 图标 URL */
+    icon?: string;
+    /** 图标大小 [width, height] */
+    iconSize?: [number, number];
+    /** 图标锚点 [x, y] */
+    iconAnchor?: [number, number];
+    /** 自定义数据 */
+    data?: Record<string, unknown>;
+}
+
+/**
+ * 解析二维数组输入（用于散点图等）
+ * @param input - 输入字符串，如 "[[10, 8], [8, 7]]"
+ * @param defaultValue - 默认值数组
+ */
+export declare function parse2DArrayInput(input: string | undefined, defaultValue?: Array<[number, number]>): Array<[number, number]>;
+
+/**
+ * 解析 JSON 数组输入（通用）
+ * @param input - JSON 字符串输入
+ * @param defaultValue - 默认值
+ */
+export declare function parseJSONInput<T = unknown>(input: string | undefined, defaultValue: T): T;
+
+/**
+ * 解析逗号分隔的数字输入
+ * 支持 JSON 数组格式和逗号分隔格式
+ * @param input - 输入字符串，如 "150, 230, 224" 或 "[150, 230, 224]"
+ * @param defaultValue - 默认值数组
+ */
+export declare function parseNumberInput(input: string | undefined, defaultValue?: number[]): number[];
+
+/**
+ * 解析逗号分隔的字符串输入
+ * 支持 JSON 数组格式和逗号分隔格式
+ * @param input - 输入字符串，如 "Mon, Tue, Wed" 或 '["Mon", "Tue", "Wed"]'
+ * @param defaultValue - 默认值数组
+ */
+export declare function parseStringInput(input: string | undefined, defaultValue?: string[]): string[];
+
+export declare const pieChart: Component;
+
+export declare const radarChart: Component;
+
+export declare const sankeyChart: Component;
+
+export declare const scatterChart: Component;
+
+/**
+ * 设置对象路径上的值
+ * 支持点号路径和数组索引，如: "data.chart.values" 或 "items[0].name"
+ * 用于数据联动（DataBinding）等需要动态写入路径的场景
+ *
+ * @param obj - 目标对象
+ * @param path - 设置路径
+ * @param value - 要设置的值
+ * @returns 是否设置成功
+ */
+export declare function setValueByPath(obj: unknown, path: string, value: unknown): boolean;
+
+export declare const stackedBarChart: Component;
+
+declare interface StatContent {
+    value?: number | string;
+    prefix?: string;
+    suffix?: string;
+    precision?: number;
+    separator?: boolean;
+}
+
+declare interface StatFooter {
+    trend?: StatTrend;
+}
+
+declare interface StatHeader {
+    title?: string;
+    tooltip?: string;
+}
+
+declare interface StatStyle {
+    background?: {
+        color?: string;
+        image?: string;
+    };
+    border?: {
+        width?: number;
+        color?: string;
+        radius?: number;
+    };
+    padding?: number;
+    shadow?: string;
+    titleColor?: string;
+    titleSize?: number;
+    valueColor?: string;
+    valueSize?: number;
+    valueWeight?: number | string;
+}
+
+declare interface StatTrend {
+    value?: string;
+    label?: string;
+    type?: 'up' | 'down' | 'normal';
+}
+
+/** 瓦片图层配置 */
+export declare interface TileLayerConfig {
+    url: string;
+    attribution?: string;
+    minZoom?: number;
+    maxZoom?: number;
+    subdomains?: string[];
+    opacity?: number;
+}
+
+export declare interface TriggerLog {
+    time: string;
+    message: string;
+    type: 'info' | 'success' | 'warning' | 'error';
+}
+
+/**
+ * 数据源 Hook
+ * 支持 HTTP 请求和自动刷新
+ *
+ * 职责：仅负责网络请求，返回完整响应数据
+ * 数据提取：由各组件使用 dataUtils 工具函数自行提取所需字段
+ * 优势：组件可灵活提取多个字段，互不影响
+ */
+export declare function useDataSource(dataSource: Ref<DataSource | undefined>): {
+    data: Ref<unknown, unknown>;
+    rawData: Ref<unknown, unknown>;
+    loading: Ref<boolean, boolean>;
+    error: Ref<string | null, string | null>;
+    fetchData: () => Promise<void>;
+};
+
+export declare const vBadge: Component;
+
+export declare const vBaseButton: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+
+export declare const vBox: Component;
+
+export declare const vBreadcrumb: Component;
+
+export declare const vButton: Component;
+
+export declare const vButtonGroup: Component;
+
+export declare const vCardGrid: Component;
+
+export declare const vCheckboxGroup: Component;
+
+export declare const vCol: Component;
+
+export declare const vContainer: Component;
+
+export declare const vCountUp: Component;
+
+export declare const vDateRange: Component;
+
+export declare const vFlex: Component;
+
+export declare const vGrid: Component;
+
+export declare const vGridBox: __VLS_WithTemplateSlots_2<typeof __VLS_component_2, __VLS_TemplateResult_2["slots"]>;
+
+export declare const vGroup: Component;
+
+export declare const vHtml: Component;
+
+export declare const vIframe: Component;
+
+export declare const vImage: Component;
+
+export declare const vKpiCard: DefineComponent<__VLS_Props_2, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_2> & Readonly<{}>, {
+styleConfig: StatStyle;
+footer: StatFooter;
+header: StatHeader;
+content: StatContent;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
+
+export declare const vList: Component;
+
+export declare const vMarkdown: Component;
+
+export declare const vModal: Component;
+
+export declare const vMultiSelect: Component;
+
+export declare const vNavButton: Component;
+
+export declare const vPagination: Component;
+
+export declare const vPanel: Component;
+
+export declare const vPivot: Component;
+
+export declare const vProgress: Component;
+
+export declare const vRow: Component;
+
+export declare const vScripting: Component;
+
+export declare const vSearchBox: Component;
+
+export declare const vSelect: Component;
+
+export declare const vSlider: Component;
+
+export declare const vStat: Component;
+
+export declare const vState: Component;
+
+export declare const vSwitch: Component;
+
+export declare const vTable: Component;
+
+export declare const vTabs: Component;
+
+export declare const vText: Component;
+
+export declare const vTimeline: Component;
+
+export declare const vTrigger: Component;
+
+export declare const vVideo: Component;
+
+export { }