@cfasim-ui/charts 0.1.9 → 0.2.0

package/dist/ChartMenu/ChartMenu.d.ts

@@ -0,0 +1,9 @@
+export interface ChartMenuItem {
+    label: string;
+    action: () => void;
+}
+type __VLS_Props = {
+    items: ChartMenuItem[];
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/dist/ChartMenu/download.d.ts

@@ -0,0 +1,4 @@
+export declare function downloadBlob(blob: Blob, name: string): void;
+export declare function saveSvg(svg: SVGSVGElement, filename: string): void;
+export declare function savePng(svg: SVGSVGElement, filename: string): void;
+export declare function downloadCsv(csv: string, filename: string): void;

package/dist/ChartTooltip/ChartTooltip.d.ts

@@ -0,0 +1,37 @@
+type __VLS_Props = {
+    /** Pixel x-coordinate relative to the positioned parent container */
+    x: number;
+    /** Pixel y-coordinate relative to the positioned parent container */
+    y: number;
+    /** Whether the tooltip is visible */
+    open: boolean;
+    /** Interaction mode. Default: 'hover' */
+    mode?: "hover" | "click";
+    /** Offset from anchor in pixels. Default: 8 */
+    sideOffset?: number;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    close: () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClose?: (() => any) | undefined;
+}>, {
+    sideOffset: number;
+    mode: "hover" | "click";
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/ChartTooltip/ChartTooltip.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ChoroplethMap/ChoroplethMap.d.ts

@@ -0,0 +1,91 @@
+export type GeoType = "states" | "counties" | "hsas";
+export interface StateData {
+    /** FIPS code (e.g. "06" for California, "04015" for a county) or name */
+    id: string;
+    value: number | string;
+}
+export interface ChoroplethColorScale {
+    /** Minimum color (CSS color string). Default: "#e5f0fa" */
+    min?: string;
+    /** Maximum color (CSS color string). Default: "#08519c" */
+    max?: string;
+}
+export interface ThresholdStop {
+    /** Lower bound (inclusive). Values at or above this threshold get this color. */
+    min: number;
+    color: string;
+    /** Optional label for the legend (defaults to the min value) */
+    label?: string;
+}
+export interface CategoricalStop {
+    /** The categorical value to match */
+    value: string;
+    /** CSS color string */
+    color: string;
+}
+type __VLS_Props = {
+    data?: StateData[];
+    /** Geographic type: "states" (default), "counties", or "hsas" (Health Service Areas) */
+    geoType?: GeoType;
+    width?: number;
+    height?: number;
+    colorScale?: ChoroplethColorScale | ThresholdStop[] | CategoricalStop[];
+    title?: string;
+    noDataColor?: string;
+    strokeColor?: string;
+    strokeWidth?: number;
+    menu?: boolean | string;
+    /** Show legend. Default: true */
+    legend?: boolean;
+    /** Title displayed next to the legend */
+    legendTitle?: string;
+    /** Enable mouse-wheel zooming. Default: false */
+    zoom?: boolean;
+    /** Enable click-and-drag panning. Default: false */
+    pan?: boolean;
+    /** Tooltip activation mode */
+    tooltipTrigger?: "hover" | "click";
+    /** Custom tooltip formatter. Receives { id, name, value } and returns HTML string. */
+    tooltipFormat?: (data: {
+        id: string;
+        name: string;
+        value?: number | string;
+    }) => string;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    stateClick: (state: {
+        id: string;
+        name: string;
+        value?: number | string;
+    }) => any;
+    stateHover: (state: {
+        id: string;
+        name: string;
+        value?: number | string;
+    } | null) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onStateClick?: ((state: {
+        id: string;
+        name: string;
+        value?: number | string;
+    }) => any) | undefined;
+    onStateHover?: ((state: {
+        id: string;
+        name: string;
+        value?: number | string;
+    } | null) => any) | undefined;
+}>, {
+    legend: boolean;
+    menu: boolean | string;
+    geoType: GeoType;
+    noDataColor: string;
+    strokeColor: string;
+    strokeWidth: number;
+    zoom: boolean;
+    pan: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    containerRef: HTMLDivElement;
+    svgRef: SVGSVGElement;
+    mapGroupRef: SVGGElement;
+}, HTMLDivElement>;
+export default _default;

package/dist/ChoroplethMap/ChoroplethMap.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/ChoroplethMap/hsaMapping.d.ts

@@ -0,0 +1,4 @@
+/** County FIPS code to HSA code mapping */
+export declare const fipsToHsa: Record<string, string>;
+/** HSA code to HSA name mapping */
+export declare const hsaNames: Record<string, string>;

package/dist/DataTable/DataTable.d.ts

@@ -0,0 +1,21 @@
+import { ModelOutput } from '@cfasim-ui/shared';
+export type TableRecord = Record<string, ArrayLike<number | string | boolean>>;
+export type TableData = TableRecord | ModelOutput;
+export type ColumnWidth = "small" | "medium" | "large";
+export type ColumnAlign = "left" | "center" | "right";
+export interface ColumnConfig {
+    label?: string;
+    width?: ColumnWidth | number;
+    align?: ColumnAlign;
+    cellClass?: string;
+}
+type __VLS_Props = {
+    data: TableData;
+    maxRows?: number;
+    columnConfig?: Record<string, ColumnConfig>;
+    menu?: boolean | string;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    menu: boolean | string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;

package/dist/DataTable/DataTable.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/LineChart/LineChart.d.ts

@@ -0,0 +1,96 @@
+export interface Series {
+    data: number[];
+    color?: string;
+    dashed?: boolean;
+    strokeWidth?: number;
+    opacity?: number;
+    line?: boolean;
+    dots?: boolean;
+    dotRadius?: number;
+    dotFill?: string;
+    dotStroke?: string;
+}
+export interface Area {
+    upper: number[];
+    lower: number[];
+    color?: string;
+    opacity?: number;
+}
+type __VLS_Props = {
+    data?: number[];
+    series?: Series[];
+    areas?: Area[];
+    width?: number;
+    height?: number;
+    lineOpacity?: number;
+    title?: string;
+    xLabel?: string;
+    yLabel?: string;
+    yMin?: number;
+    xMin?: number;
+    xLabels?: string[];
+    debounce?: number;
+    menu?: boolean | string;
+    xGrid?: boolean;
+    yGrid?: boolean;
+    /** Custom per-index data passed to the tooltip slot */
+    tooltipData?: unknown[];
+    /** Tooltip activation mode. Default: 'hover' */
+    tooltipTrigger?: "hover" | "click";
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Readonly<{
+        tooltip?(props: {
+            index: number;
+            xLabel?: string;
+            values: {
+                value: number;
+                color: string;
+                seriesIndex: number;
+            }[];
+            data: unknown;
+        }): unknown;
+    }> & {
+        tooltip?(props: {
+            index: number;
+            xLabel?: string;
+            values: {
+                value: number;
+                color: string;
+                seriesIndex: number;
+            }[];
+            data: unknown;
+        }): unknown;
+    };
+    refs: {
+        containerRef: HTMLDivElement;
+        svgRef: SVGSVGElement;
+        tooltipRef: HTMLDivElement;
+    };
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    hover: (payload: {
+        index: number;
+    } | null) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onHover?: ((payload: {
+        index: number;
+    } | null) => any) | undefined;
+}>, {
+    menu: boolean | string;
+    lineOpacity: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    containerRef: HTMLDivElement;
+    svgRef: SVGSVGElement;
+    tooltipRef: HTMLDivElement;
+}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/LineChart/LineChart.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/LineChart/LineChart.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/index.css

@@ -0,0 +1,2 @@
+.chart-menu-trigger-area[data-v-fe2f6904]{z-index:1;position:absolute;top:0;right:0}.chart-menu-button[data-v-fe2f6904]{border:1px solid var(--color-border);background:var(--color-bg-0,#fff);width:28px;height:28px;color:var(--color-text-secondary);cursor:pointer;opacity:0;border-radius:.25em;justify-content:center;align-items:center;transition:opacity .15s;display:flex}.chart-menu-button[data-state=open][data-v-fe2f6904]{opacity:1}.chart-menu-button[data-v-fe2f6904]:hover{background:var(--color-bg-1,#0000000d);color:var(--color-text)}.chart-menu-content{z-index:100;background:var(--color-bg-0);border:1px solid var(--color-border);border-radius:.25em;min-width:140px;padding:.25em;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.chart-menu-item{font-size:var(--font-size-sm);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;border-radius:.25em;outline:none;align-items:center;padding:.375em .5em;display:flex}.chart-menu-item[data-highlighted]{background:var(--color-primary);color:#fff}.line-chart-wrapper[data-v-55a24433]{width:100%;position:relative}.line-chart-wrapper[data-v-55a24433]:hover .chart-menu-button{opacity:1}.line-chart-tooltip-label[data-v-55a24433]{margin-bottom:.25em;font-weight:600}.line-chart-tooltip-row[data-v-55a24433]{align-items:center;gap:.375em;display:flex}.line-chart-tooltip-swatch[data-v-55a24433]{border-radius:50%;flex-shrink:0;width:.625em;height:.625em;display:inline-block}.choropleth-wrapper[data-v-7f5b0832]{width:100%;position:relative}.choropleth-wrapper.pannable svg[data-v-7f5b0832]{cursor:grab}.choropleth-wrapper.pannable svg[data-v-7f5b0832]:active{cursor:grabbing}.choropleth-wrapper[data-v-7f5b0832]:hover .chart-menu-button{opacity:1}.state-path[data-v-7f5b0832]{cursor:pointer}.chart-tooltip-anchor[data-v-44377f70]{pointer-events:none;width:1px;height:1px;position:absolute}.chart-tooltip-content{z-index:100;background:var(--color-bg-0,#fff);border:1px solid var(--color-border,#e5e7eb);font-size:var(--font-size-sm,.875rem);pointer-events:none;border-radius:.375em;padding:.5em .75em;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.TableOuter[data-v-dbfb7c84]{display:inline-block;position:relative}.TableOuter.has-menu[data-v-dbfb7c84]{padding-top:32px}.TableOuter[data-v-dbfb7c84]:hover .chart-menu-button{opacity:1}.TableWrapper[data-v-dbfb7c84]{font-size:var(--font-size-sm);overflow-x:auto}.Table[data-v-dbfb7c84]{border-collapse:collapse;font-variant-numeric:tabular-nums;border:1px solid var(--color-border)}.Table tr[data-v-dbfb7c84],.Table th[data-v-dbfb7c84],.Table td[data-v-dbfb7c84]{background:0 0;border:none}.Table th[data-v-dbfb7c84],.Table td[data-v-dbfb7c84]{white-space:nowrap;padding:.75em 1.25em}.Table th[data-v-dbfb7c84]{border-bottom:1px solid var(--color-border-header);font-weight:600;position:sticky;top:0}.Table tbody td[data-v-dbfb7c84]{border-bottom:1px solid var(--color-border)}.Table tbody tr:last-child td[data-v-dbfb7c84]{border-bottom:none}
+/*$vite$:1*/

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export { default as LineChart, type Series, type Area, } from './LineChart/LineChart';
+export { default as ChoroplethMap, type GeoType, type StateData, type ChoroplethColorScale, type ThresholdStop, type CategoricalStop, } from './ChoroplethMap/ChoroplethMap';
+export { default as ChartTooltip } from './ChartTooltip/ChartTooltip';
+export { default as DataTable, type TableData, type TableRecord, type ColumnAlign, type ColumnConfig, type ColumnWidth, } from './DataTable/DataTable';