@weing-dev/ui-kit-primitive 0.4.6 → 0.5.1

package/dist/color-qJrSCDan.js

@@ -0,0 +1,155 @@
+import { B as e, S as g, T as r } from "./baseColor-DYa5_IOB.js";
+const y = {
+  light: {
+    textPrimary: e.grey.Grey9,
+    textSecondary: e.grey.Grey7,
+    textTertiary: e.grey.Grey6,
+    textDisabled: e.grey.Grey5,
+    backgroundDefault: e.whiteWhite,
+    backgroundPaper: e.whiteWhite,
+    backgroundSecond: r.grey8,
+    backgroundNeutral: e.grey.Grey2,
+    shadow8: r.grey8,
+    shadow12: r.grey12,
+    shadow20: r.grey20,
+    componentTextfieldFilled: r.grey8,
+    componentTextfieldUnderline: r.grey40,
+    componentTextfieldOutline: r.grey24,
+    actionHover: r.grey16,
+    actionDisabled: r.grey40,
+    actionDisabledBackground: r.grey16,
+    actionSelected: r.grey16,
+    actionFocus: r.grey48,
+    textError: e.red.Red6,
+    textSuccess: e.lightGreen.LightGreen6,
+    actionAction: e.grey.Grey6,
+    textWarning: e.gold.Gold6,
+    textContrast: e.whiteWhite,
+    inheritColor: e.whiteWhite,
+    inheritBgcolor: e.grey.Grey9,
+    inheritHover: e.grey.Grey8,
+    swapDarkLightRed: e.red.Red8,
+    swapDarkLightLightGreen: e.lightGreen.LightGreen8,
+    swapDarkLightDeepGreen: e.deepGreen.DeepGreen8,
+    swapDarkLightCyanBlue: e.cyanBlue.CyanBlue8,
+    swapDarkLightPurple: e.purple.Purple8,
+    swapDarkLightGold: e.gold.Gold8,
+    swapDarkLightBlue: e.blue.Blue8,
+    swapDarkLightPrimary: e.deepGreen.DeepGreen8,
+    // ── Chart 전역 기본 팔레트([5]) · 보조 토큰 ──
+    // 인덱스 키 객체 → buildCssVariables 가 `--chartCategorical0..7` 로 펼침
+    chartCategorical: {
+      0: e.deepGreen.DeepGreen6,
+      // 브랜드 1순위
+      1: e.blue.Blue6,
+      2: e.gold.Gold6,
+      3: e.purple.Purple6,
+      4: e.cyanBlue.CyanBlue6,
+      5: e.red.Red6,
+      6: e.lightGreen.LightGreen6,
+      7: e.grey.Grey6
+    },
+    chartGrid: r.grey24,
+    chartAxis: e.grey.Grey6,
+    chartLabel: e.grey.Grey7,
+    chartTooltipBg: e.grey.Grey9,
+    chartTooltipText: e.whiteWhite
+  },
+  dark: {
+    textPrimary: e.whiteWhite,
+    textSecondary: e.grey.Grey5,
+    textTertiary: e.grey.Grey6,
+    textDisabled: e.grey.Grey7,
+    backgroundDefault: e.grey.Grey10,
+    backgroundPaper: e.grey.Grey9,
+    backgroundSecond: e.grey.Grey8,
+    backgroundNeutral: r.grey12,
+    shadow8: r.black8,
+    shadow12: r.black12,
+    shadow20: r.black20,
+    componentTextfieldFilled: r.grey8,
+    componentTextfieldUnderline: r.grey40,
+    componentTextfieldOutline: r.grey24,
+    actionHover: r.grey16,
+    actionDisabled: r.grey40,
+    actionDisabledBackground: r.grey20,
+    actionSelected: r.grey16,
+    actionFocus: r.grey8,
+    textError: e.red.Red6,
+    textSuccess: e.lightGreen.LightGreen6,
+    actionAction: e.grey.Grey5,
+    textWarning: e.gold.Gold6,
+    textContrast: e.blackBlack,
+    inheritColor: e.grey.Grey9,
+    inheritBgcolor: e.whiteWhite,
+    inheritHover: e.grey.Grey5,
+    swapDarkLightRed: e.red.Red4,
+    swapDarkLightLightGreen: e.lightGreen.LightGreen4,
+    swapDarkLightDeepGreen: e.deepGreen.DeepGreen4,
+    swapDarkLightCyanBlue: e.cyanBlue.CyanBlue4,
+    swapDarkLightPurple: e.purple.Purple4,
+    swapDarkLightGold: e.gold.Gold4,
+    swapDarkLightBlue: e.blue.Blue4,
+    swapDarkLightPrimary: e.deepGreen.DeepGreen4,
+    // ── Chart 전역 기본 팔레트([5]) · 보조 토큰 (다크: 한 톤 밝게) ──
+    chartCategorical: {
+      0: e.deepGreen.DeepGreen4,
+      1: e.blue.Blue4,
+      2: e.gold.Gold4,
+      3: e.purple.Purple4,
+      4: e.cyanBlue.CyanBlue4,
+      5: e.red.Red4,
+      6: e.lightGreen.LightGreen4,
+      7: e.grey.Grey5
+    },
+    chartGrid: r.white16,
+    chartAxis: e.grey.Grey6,
+    chartLabel: e.grey.Grey5,
+    chartTooltipBg: e.grey.Grey2,
+    chartTooltipText: e.grey.Grey9
+  },
+  primary: {
+    pLighter: g.deepGreen.Lighter,
+    pLight: g.deepGreen.Light,
+    pMain: g.deepGreen.Main,
+    pDark: g.deepGreen.Dark,
+    pDarker: g.deepGreen.Darker,
+    p4: r.deepGreen4,
+    p8: r.deepGreen8,
+    p12: r.deepGreen12,
+    p16: r.deepGreen16,
+    p20: r.deepGreen20,
+    p24: r.deepGreen24,
+    p32: r.deepGreen32,
+    p40: r.deepGreen40,
+    p48: r.deepGreen48,
+    pContrastText: g.whiteMain
+  }
+}, d = (t) => {
+  const a = Object.keys(t), c = (l, o) => Object.keys(l).reduce((n, p) => {
+    const i = l[p];
+    return typeof i == "object" ? n.concat(c(i, `${o}${p}`)) : n.concat(`--${o}${p}: ${i};
+`);
+  }, "");
+  return a.reduce((l, o) => {
+    const n = t[o];
+    return typeof n == "object" ? l.concat(c(n, o)) : l.concat(`--${o.replace(/_/g, "-")}: ${n};
+`);
+  }, "");
+};
+d(y.light), d(y.dark), d(y.primary), d(e), d(g), d(r);
+const s = (t) => `var(--${t.replace(/_/g, "-")})`, h = (t, a) => `var(--${t}${a.replace(/_/g, "-")})`, G = (t, a) => `${t.replace(/_/g, "-")}, ${a})`.replace(/(\))(\\,)/, "$2").replace(/(\d.)/g, "-$1"), u = Object.keys(y.light);
+u.reduce((t, a) => {
+  const c = y.light[a];
+  if (typeof c != "string") {
+    const l = Object.keys(c).reduce((o, n) => {
+      const p = c[n];
+      return o[n] = Array.isArray(p) ? G(h(a, n.replace(/_/g, "-").replace(/^[a-z]/, (i) => `-${i}`).replace(/([A-Z])/g, (i) => `-${i.toLocaleLowerCase()}`).replace(/(\d.)/g, "-$1")), p[1]) : h(a, n.replace(/_/g, "-").replace(/^[a-z]/, (i) => `-${i}`).replace(/([A-Z])/g, (i) => `-${i.toLocaleLowerCase()}`).replace(/(\d.)/g, "-$1")), o;
+    }, {});
+    return t[a] = l, t;
+  }
+  return t[a] = s(a), t;
+}, {});
+export {
+  y as c
+};

package/dist/components/Calendar/Calendar.d.ts

@@ -1,64 +1,10 @@
 import { default as React } from 'react';
-import { default as dayjs } from 'dayjs';
-import { CalendarProviderProps } from './Calendar.context';
-type AsBodyProps = {
-    columns: dayjs.Dayjs[];
-    className?: string;
-    columnRender: () => React.ReactNode;
-};
-type ColumnAsProps = {
-    date: string;
-    visible: boolean;
-    className?: string;
-    selected: boolean;
-    onClick?: (date: string | string[]) => void;
-    disabled: boolean;
-    between: boolean;
-    both: boolean;
-    start: boolean;
-    end: boolean;
-    columns: dayjs.Dayjs[];
-};
-type CalendarBodyProps = {
-    as?: (props: AsBodyProps) => React.ReactNode;
-    className?: string;
-    /** 이전, 다음달 채울지 여부 */
-    isFill?: boolean;
-    /** column className */
-    columnClassName?: string;
-    columnAs?: (props: ColumnAsProps) => React.ReactNode;
-};
+import { CalendarBodyProps, DirectionButtonProps, DayTextListProps, HeaderDateProps, RootProps } from './Calendar.type';
 declare const Body: (props: CalendarBodyProps) => string | number | bigint | boolean | import("react/jsx-runtime").JSX.Element | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null | undefined;
-type AsDirectionProps = {
-    disabled?: boolean;
-};
-type DirectionButtonProps = {
-    as?: (props: AsDirectionProps) => React.ReactNode;
-    className?: string;
-    disabled?: boolean;
-    moveValue?: number;
-};
 declare const Next: (props: DirectionButtonProps) => import("react/jsx-runtime").JSX.Element;
 declare const Prev: (props: DirectionButtonProps) => import("react/jsx-runtime").JSX.Element;
-type AsDayTextProps = {
-    columns: (string | undefined)[];
-};
-type DayTextListProps = React.PropsWithChildren<{
-    as?: (props: AsDayTextProps) => React.ReactNode;
-    /** dayColumn */
-    column?: React.ReactElement;
-    className?: string;
-}>;
 declare const DayTextList: (props: DayTextListProps) => string | number | bigint | boolean | import("react/jsx-runtime").JSX.Element | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null | undefined;
-type HeaderDateProps = {
-    className?: string;
-    format?: string;
-};
 declare const HeaderDate: (props: HeaderDateProps) => import("react/jsx-runtime").JSX.Element;
-type RootProps = CalendarProviderProps & {
-    currentDate?: string;
-    className?: string;
-};
 declare const Root: (props: RootProps) => import("react/jsx-runtime").JSX.Element;
 interface ICalendar {
     Root: typeof Root;

package/dist/components/Calendar/Calendar.type.d.ts

@@ -0,0 +1,61 @@
+import { default as React } from 'react';
+import { default as dayjs } from 'dayjs';
+import { CalendarProviderProps } from './Calendar.context';
+export type AsBodyProps = {
+    columns: dayjs.Dayjs[];
+    className?: string;
+    columnRender: () => React.ReactNode;
+};
+export type ColumnAsProps = {
+    date: string;
+    visible: boolean;
+    className?: string;
+    selected: boolean;
+    onClick?: (date: string | string[]) => void;
+    disabled: boolean;
+    between: boolean;
+    both: boolean;
+    start: boolean;
+    end: boolean;
+    columns: dayjs.Dayjs[];
+};
+export type CalendarBodyProps = {
+    as?: (props: AsBodyProps) => React.ReactNode;
+    className?: string;
+    /** 이전, 다음달 채울지 여부 */
+    isFill?: boolean;
+    /** column className */
+    columnClassName?: string;
+    columnAs?: (props: ColumnAsProps) => React.ReactNode;
+};
+export type AsDirectionProps = {
+    disabled?: boolean;
+};
+export type DirectionButtonProps = {
+    as?: (props: AsDirectionProps) => React.ReactNode;
+    className?: string;
+    disabled?: boolean;
+    moveValue?: number;
+};
+export type AsDayTextProps = {
+    columns: (string | undefined)[];
+};
+export type DayTextListProps = React.PropsWithChildren<{
+    as?: (props: AsDayTextProps) => React.ReactNode;
+    /** dayColumn */
+    column?: React.ReactElement;
+    className?: string;
+}>;
+export type DayTextProps = React.PropsWithChildren<{
+    day?: number;
+    children?: React.ReactNode;
+    className?: string;
+}>;
+export type HeaderDateProps = {
+    className?: string;
+    format?: string;
+};
+export type RootProps = CalendarProviderProps & {
+    currentDate?: string;
+    className?: string;
+};

package/dist/components/Cascader/Cascader.d.ts

@@ -1,44 +1,10 @@
 import { default as React } from 'react';
-import { CascaderProviderProps, CascaderOption, OnSelectProps } from './Cascader.context';
+import { CascaderOption, OnSelectProps } from './Cascader.context';
+import { ItemProps, ColumnProps, MenuProps, RootProps } from './Cascader.type';
 import { useCascader } from './Cascader.hook';
-type ItemAsProps = {
-    ref: React.RefObject<HTMLDivElement | null>;
-    option: CascaderOption;
-    level: number;
-    disabled?: boolean;
-    role?: CascaderOption["role"];
-    isSelected?: boolean;
-    showChildrenCount?: boolean;
-    defaultClassName: string;
-    onClick: () => void;
-};
-type ItemProps = React.PropsWithChildren<{
-    option: CascaderOption;
-    level: number;
-    as?: (props: ItemAsProps) => React.ReactNode;
-} & React.ComponentProps<"div">>;
 declare const Item: (props: ItemProps) => string | number | bigint | boolean | import("react/jsx-runtime").JSX.Element | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null | undefined;
-type ColumnAsProps = {
-    defaultClassName: string;
-    maxColumnView?: number;
-    columnPositionFromParent?: boolean;
-    selectedOptionTop?: number[];
-    index?: number;
-    topOffset?: number;
-};
-type ColumnProps = React.PropsWithChildren<{
-    index: number;
-    as?: (props: ColumnAsProps) => React.ReactNode;
-} & React.ComponentProps<"div">>;
 declare const Column: (props: React.PropsWithoutRef<ColumnProps>) => string | number | bigint | boolean | import("react/jsx-runtime").JSX.Element | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null | undefined;
-type MenuAsProps = {
-    defaultClassName: string;
-};
-type MenuProps = React.PropsWithChildren<{
-    as?: (props: MenuAsProps) => React.ReactNode;
-} & React.ComponentProps<"div">>;
 declare const Menu: (props: React.PropsWithoutRef<MenuProps>) => string | number | bigint | boolean | import("react/jsx-runtime").JSX.Element | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null | undefined;
-type RootProps = Omit<CascaderProviderProps, "selectedOptionTop" | "setSelectedOptionTop"> & Omit<React.ComponentProps<"div">, "onSelect">;
 declare const Root: (props: React.PropsWithoutRef<RootProps>) => import("react/jsx-runtime").JSX.Element;
 interface ICascader {
     Root: typeof Root;

package/dist/components/Cascader/Cascader.type.d.ts

@@ -0,0 +1,37 @@
+import { default as React } from 'react';
+import { CascaderOption, CascaderProviderProps } from './Cascader.context';
+export type ItemAsProps = {
+    ref: React.RefObject<HTMLDivElement | null>;
+    option: CascaderOption;
+    level: number;
+    disabled?: boolean;
+    role?: CascaderOption["role"];
+    isSelected?: boolean;
+    showChildrenCount?: boolean;
+    defaultClassName: string;
+    onClick: () => void;
+};
+export type ItemProps = React.PropsWithChildren<{
+    option: CascaderOption;
+    level: number;
+    as?: (props: ItemAsProps) => React.ReactNode;
+} & React.ComponentProps<"div">>;
+export type ColumnAsProps = {
+    defaultClassName: string;
+    maxColumnView?: number;
+    columnPositionFromParent?: boolean;
+    selectedOptionTop?: number[];
+    index?: number;
+    topOffset?: number;
+};
+export type ColumnProps = React.PropsWithChildren<{
+    index: number;
+    as?: (props: ColumnAsProps) => React.ReactNode;
+} & React.ComponentProps<"div">>;
+export type MenuAsProps = {
+    defaultClassName: string;
+};
+export type MenuProps = React.PropsWithChildren<{
+    as?: (props: MenuAsProps) => React.ReactNode;
+} & React.ComponentProps<"div">>;
+export type RootProps = Omit<CascaderProviderProps, "selectedOptionTop" | "setSelectedOptionTop"> & Omit<React.ComponentProps<"div">, "onSelect">;

package/dist/components/Chart/Chart.context.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { ChartThemeValue } from './Chart.type';
+/**
+ * [3] 앱/화면 단위 테마 Context. 감싸지 않으면 undefined → 위층(토큰)이 그대로 흐른다.
+ * Provider 컴포넌트는 Chart.theme.tsx 에 분리(컨벤션: context 파일은 비컴포넌트만).
+ */
+export declare const ChartThemeContext: React.Context<ChartThemeValue | undefined>;
+/** React 19: Context 소비는 React.use 로 통일 */
+export declare const useChartTheme: () => ChartThemeValue | undefined;

package/dist/components/Chart/Chart.gradient.d.ts

@@ -0,0 +1,10 @@
+import { Color, Scriptable, ScriptableContext } from 'chart.js';
+/**
+ * canvas gradient 는 chartArea(레이아웃 결과)가 있어야 만들 수 있어 정적 색으로 못 박는다.
+ * chart.js 의 scriptable backgroundColor(렌더 시 ctx 주입)로 lazy 생성한다 —
+ * 순수함수 빌더 안에서도 함수만 반환하면 되고 plugin/useEffect 가 불필요하다.
+ *
+ * 색 토큰을 canvas 가 직접 못 읽는 것과 같은 제약을 같은 패턴(런타임 해석)으로 푼다.
+ */
+/** 세로 방향 그라데이션(상단 from → 하단 to). chartArea 미정(레이아웃 전)이면 from 단색으로 폴백. */
+export declare const verticalGradient: (from: string, to: string) => Scriptable<Color, ScriptableContext<"line">>;

package/dist/components/Chart/Chart.hooks.d.ts

@@ -0,0 +1,4 @@
+import { ChartKind } from './Chart.type';
+import { InstanceStyle, StyleSources } from './Chart.style';
+/** cascade 5층 소스를 모은다: [2]인스턴스 · [3]테마 · [4]프리셋 · [5]토큰팔레트 */
+export declare const useStyleSources: (kind: ChartKind, instance: InstanceStyle) => StyleSources;

package/dist/components/Chart/Chart.options.d.ts

@@ -0,0 +1,29 @@
+import { ChartData, ChartOptions } from 'chart.js';
+import { AxisConfig, CategoricalData, ChartBaseProps, ChartKind, PointStyle, ProportionData } from './Chart.type';
+import { ChartAxisTokens } from './Chart.palette';
+import { StyleSources } from './Chart.style';
+export declare const deepMerge: <T>(base: T, over?: Partial<T>) => T;
+/** 카테고리형(bar/line) → chart.js ChartData */
+export declare const buildCategoricalData: (data: CategoricalData, sources: StyleSources, opts?: {
+    area?: boolean;
+    tension?: number;
+    pointStyle?: PointStyle;
+    lineWidth?: number;
+}) => ChartData;
+/** 비중형(pie/doughnut) → chart.js ChartData */
+export declare const buildProportionData: (data: ProportionData, sources: StyleSources) => ChartData;
+type BuildOptionArgs = {
+    kind: ChartKind;
+    base: Pick<ChartBaseProps, "title" | "legend" | "height" | "aspectRatio" | "padding" | "valueLabel" | "options" | "rawOptions">;
+    tokens: ChartAxisTokens;
+    /** 종류별 추가 옵션 (indexAxis, cutout, scales stacked 등). 차트별 전용 키 허용 위해 느슨한 타입 */
+    extra?: Record<string, unknown>;
+    /** 직교좌표 y축 설정 (max/min/단위 포맷). y1 정의 시 우측 보조축(듀얼축) 생성 */
+    axes?: {
+        y?: AxisConfig;
+        y1?: AxisConfig;
+    };
+};
+/** 프리셋 → L2(options deep-merge) → L3(rawOptions 통째 대체) */
+export declare const buildOptions: ({ kind, base, tokens, extra, axes }: BuildOptionArgs) => ChartOptions;
+export {};

package/dist/components/Chart/Chart.palette.d.ts

@@ -0,0 +1,20 @@
+import { PaletteInput } from './Chart.type';
+/** 단일 색 토큰 문자열 해석: hex/rgb/hsl/var 는 그대로, 팔레트키는 매핑 */
+export declare const resolveColor: (c: string) => string;
+/** 전역 카테고리컬 팔레트(hex 8색)를 토큰에서 해석 — cascade [5] */
+export declare const useChartPalette: () => string[];
+export type ChartAxisTokens = {
+    grid: string;
+    axis: string;
+    label: string;
+    tooltipBg: string;
+    tooltipText: string;
+};
+export declare const useChartTokens: () => ChartAxisTokens;
+/**
+ * PaletteInput 을 hex 색 배열로 정규화.
+ * - "categorical" → 토큰 팔레트
+ * - "sequential"/"diverging" → 1차엔 categorical fallback (전용 팔레트는 실수요 시)
+ * - string[] → 각 요소를 resolveColor (hex/팔레트키 혼용)
+ */
+export declare const normalizePalette: (input: PaletteInput | undefined, categorical: string[]) => string[] | undefined;

package/dist/components/Chart/Chart.preset.d.ts

@@ -0,0 +1,7 @@
+import { ChartPreset } from './Chart.type';
+/**
+ * [4] 차트 종류별 기본 정책 통로.
+ * A안(통로 5층 + 값 3층): 통로만 두고 값은 비워 둔다(no-op).
+ * 실수요가 생기면 아래에 값만 채우면 켜지고, 컴포넌트·호출부 코드는 바뀌지 않는다.
+ */
+export declare const chartPresets: ChartPreset;

package/dist/components/Chart/Chart.register.d.ts

@@ -0,0 +1 @@
+export declare const ensureChartRegistered: () => void;

package/dist/components/Chart/Chart.style.d.ts

@@ -0,0 +1,21 @@
+import { ChartKind, ChartStyleDefaults, ChartThemeValue, PaletteInput } from './Chart.type';
+/**
+ * 스타일 cascade 5층 해석기.
+ *   [1] datum.color / [2] series.color … 항목·시리즈 단위 색은 옵션 빌더에서 최우선 적용.
+ *   본 모듈은 인스턴스/테마/프리셋/토큰 층([2]props·[3]·[4]·[5])을 `??` 로 병합한다.
+ * 빈 층(undefined)은 자연 통과 → 런타임 비용 0. [3][4] 는 1차엔 빈 통로(no-op).
+ */
+export type InstanceStyle = ChartStyleDefaults & {
+    colors?: PaletteInput;
+};
+export type StyleSources = {
+    kind: ChartKind;
+    instance?: InstanceStyle;
+    theme?: ChartThemeValue;
+    preset?: ChartStyleDefaults;
+    tokenPalette: string[];
+};
+/** 스칼라 스타일(barRadius·tension·cutout·legend…) cascade. 최종 fallback 은 빌더가 `?? 기본값` 으로 처리 */
+export declare const resolveStyle: <K extends keyof ChartStyleDefaults>(key: K, s: StyleSources) => ChartStyleDefaults[K] | undefined;
+/** 시리즈 index i 의 최종 색 cascade ([2]colors > [3] > [4] > [5]token) */
+export declare const resolveSeriesColor: (i: number, s: StyleSources) => string;

package/dist/components/Chart/Chart.theme.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { ChartThemeValue } from './Chart.type';
+/**
+ * [3] 앱/화면 단위 테마 통로. Provider 만 제공하고 기본값은 비워 둔다(no-op).
+ * <ChartThemeProvider value={{ palette, defaults, presets }}> 로 하위 차트에 정책 주입.
+ */
+export declare const ChartThemeProvider: ({ value, children, }: React.PropsWithChildren<{
+    value: ChartThemeValue;
+}>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Chart/Chart.type.d.ts

@@ -0,0 +1,161 @@
+import { ChartOptions, Plugin } from 'chart.js';
+import { default as React } from 'react';
+/** 단일 시리즈 간편 입력: bar/pie/doughnut 한 줄짜리 */
+export type SimpleDatum = {
+    label: string;
+    value: number;
+    /** 이 항목만 색 강제 (팔레트 키 또는 CSS 색) — cascade [1] */
+    color?: string;
+};
+/** 다중 시리즈 한 줄 */
+export type ChartSeries = {
+    name: string;
+    /** null = 데이터 없는 구간(선 끊김). spanGaps 로 이을지 제어 */
+    values: (number | null)[];
+    /** 이 시리즈만 색 강제 — cascade [2] */
+    color?: string;
+    /** 이 시리즈가 참조할 y축 id. 보조축 연결 시 "y1" (듀얼축) */
+    yAxisID?: string;
+    /** 점선 패턴 (예: [4,4]). line 전용 */
+    borderDash?: number[];
+    /** null 값 구간을 선으로 이을지 여부 (기본 chart.js 기본값=false 동작) */
+    spanGaps?: boolean;
+    /**
+     * 면적 gradient 채우기 (line 전용). true=시리즈 색 기반 자동 alpha,
+     * {from,to}=명시 색. 켜면 fill 자동 활성.
+     */
+    gradient?: boolean | {
+        from?: string;
+        to?: string;
+    };
+};
+/** 다중 시리즈 입력 */
+export type SeriesData = {
+    labels: string[];
+    series: ChartSeries[];
+};
+/** 카테고리형(bar/line): 간편형 or 시리즈형 둘 다 허용 */
+export type CategoricalData = SimpleDatum[] | SeriesData;
+/** 비중형(pie/doughnut): 항상 단일 시리즈 */
+export type ProportionData = SimpleDatum[];
+/** 토큰 팔레트 이름 또는 임의 색/팔레트키 배열 */
+export type PaletteInput = "categorical" | "sequential" | "diverging" | string[];
+/** 차트 종류별/테마 단위로 상속시킬 수 있는 스타일 기본값 묶음 */
+export type ChartStyleDefaults = {
+    palette?: PaletteInput;
+    legend?: LegendOption;
+    aspectRatio?: number;
+    barRadius?: number;
+    tension?: number;
+    cutout?: number;
+    showTotal?: boolean;
+    pointStyle?: PointStyle;
+};
+/** [4] 차트 종류별 기본 정책. 1차엔 최소값만 채우고 나머지는 빈 통로(no-op) */
+export type ChartPreset = Partial<Record<ChartKind, ChartStyleDefaults>>;
+/** [3] 앱/화면 단위 테마. <ChartThemeProvider value={...}> 로 주입 */
+export type ChartThemeValue = {
+    palette?: PaletteInput;
+    defaults?: ChartStyleDefaults;
+    presets?: ChartPreset;
+};
+export type ChartKind = "bar" | "line" | "pie" | "doughnut" | "radar";
+export type LegendOption = boolean | "top" | "bottom" | "left" | "right";
+export type PointStyle = "circle" | "rect" | "triangle" | false;
+/** 직교좌표(bar/line) 축 설정. 듀얼축·단위 포맷 노출 */
+export type AxisConfig = {
+    max?: number;
+    min?: number;
+    /** 눈금 단위 포맷터 (예: (v) => `${v}건`) → ticks.callback */
+    tickFormat?: (value: number) => string;
+    /** 축 제목 */
+    title?: string;
+};
+export type ChartBaseProps = {
+    title?: string;
+    /** true=top, false=숨김, 또는 위치 지정 */
+    legend?: LegendOption;
+    /** px. 미지정 시 aspectRatio 사용 (vw/vh 강제 금지) */
+    height?: number;
+    aspectRatio?: number;
+    /** 차트 영역 여백(px). 라벨 잘림 조정 등에 사용. 미지정 시 valueLabel일 때만 기본 여백 적용 */
+    padding?: number | {
+        top?: number;
+        right?: number;
+        bottom?: number;
+        left?: number;
+    };
+    loading?: boolean;
+    /** 데이터 0건일 때 노출 (기본 문구 내장) */
+    empty?: React.ReactNode;
+    /** 값 라벨 표시(막대 위/조각 안). true=값 그대로, 함수=포맷터. 켤 때만 datalabels 플러그인 주입 */
+    valueLabel?: boolean | ((value: number) => string);
+    className?: string;
+    /** L1: 시리즈 색 일괄 지정 — cascade [2] */
+    colors?: PaletteInput;
+    /** L2: 프리셋 위에 deep-merge */
+    options?: ChartOptions;
+    /** L3: 프리셋 무시하고 raw 통째 대체 */
+    rawOptions?: ChartOptions;
+    /**
+     * 커스텀 chart.js 플러그인 (인스턴스 한정 주입). afterDraw/beforeDatasetsDraw 등으로
+     * 캔버스에 직접 드로잉. 플러그인 옵션은 L2 `options.plugins.<id>` 로 전달.
+     */
+    plugins?: Plugin[];
+};
+export type BarChartProps = ChartBaseProps & {
+    data: CategoricalData;
+    orientation?: "vertical" | "horizontal";
+    stacked?: boolean;
+    /** L0 승격 스타일: 막대 모서리 둥글기 */
+    barRadius?: number;
+    barThickness?: number;
+    /** 주 y축 설정 (max/min/단위 포맷) */
+    yAxis?: AxisConfig;
+    /** 보조 y축 (우측). 정의 시 생성 — 시리즈 `yAxisID:"y1"` 로 연결 (듀얼축) */
+    y1Axis?: AxisConfig;
+};
+export type LineChartProps = ChartBaseProps & {
+    data: CategoricalData;
+    /** 면적 채우기 */
+    area?: boolean;
+    /** 곡선 보간 강도 0~1 (기본 0.4) */
+    tension?: number;
+    /** L0 승격 스타일 */
+    pointStyle?: PointStyle;
+    lineWidth?: number;
+    /** 주 y축 설정 (max/min/단위 포맷) */
+    yAxis?: AxisConfig;
+    /** 보조 y축 (우측). 정의 시 생성 — 시리즈 `yAxisID:"y1"` 로 연결 (듀얼축) */
+    y1Axis?: AxisConfig;
+};
+export type PieChartProps = ChartBaseProps & {
+    data: ProportionData;
+};
+export type DoughnutChartProps = ChartBaseProps & {
+    data: ProportionData;
+    /** 중앙 합계 라벨 */
+    showTotal?: boolean;
+    /** 0~1, 도넛 구멍 크기 (기본 0.6) */
+    cutout?: number;
+};
+export type RadarChartProps = ChartBaseProps & {
+    /** 단일 시리즈(labels+values) 또는 다중 시리즈 모두 허용 */
+    data: CategoricalData;
+    /** 방사축 최댓값 (suggestedMax). 미지정 시 자동 */
+    max?: number;
+    /** 다각형 면적 채우기 (기본 true) */
+    fill?: boolean;
+};
+/** ChartRenderer가 받는 통합 타입. type으로 좁히면 data가 자동 결정 → `as` 캐스팅 제거 */
+export type AnyChartProps = ({
+    type: "bar";
+} & BarChartProps) | ({
+    type: "line";
+} & LineChartProps) | ({
+    type: "pie";
+} & PieChartProps) | ({
+    type: "doughnut";
+} & DoughnutChartProps) | ({
+    type: "radar";
+} & RadarChartProps);

package/dist/components/Chart/ChartFrame.d.ts

@@ -0,0 +1,14 @@
+import { default as React } from 'react';
+type Props = React.PropsWithChildren<{
+    height?: number;
+    loading?: boolean;
+    empty?: React.ReactNode;
+    isEmpty?: boolean;
+    className?: string;
+}>;
+/**
+ * 차트 공통 컨테이너. 부모 레이아웃을 따르며(vw/vh 강제 금지) height 로만 높이를 제어.
+ * loading/empty 상태를 라이브러리 밖 표준 UI 로 흡수.
+ */
+export declare const ChartFrame: ({ height, loading, empty, isEmpty, className, children, }: Props) => import("react/jsx-runtime").JSX.Element;
+export {};