@betfin/ui 0.1.0

package/dist/components/chart.d.ts

@@ -0,0 +1,39 @@
+import * as React from 'react';
+import * as RechartsPrimitive from 'recharts';
+declare const THEMES: {
+    readonly dark: '.dark';
+};
+export type ChartConfig = {
+    [k in string]: {
+        label?: React.ReactNode;
+        icon?: React.ComponentType;
+    } & ({
+        color?: string;
+        theme?: never;
+    } | {
+        color?: never;
+        theme: Record<keyof typeof THEMES, string>;
+    });
+};
+declare function ChartContainer({ id, className, children, config, ...props }: React.ComponentProps<'div'> & {
+    config: ChartConfig;
+    children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>['children'];
+}): React.JSX.Element;
+declare function ChartStyle({ id, config }: {
+    id: string;
+    config: ChartConfig;
+}): React.JSX.Element | null;
+declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;
+declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: React.ComponentProps<typeof RechartsPrimitive.Tooltip> & React.ComponentProps<'div'> & {
+    hideLabel?: boolean;
+    hideIndicator?: boolean;
+    indicator?: 'line' | 'dot' | 'dashed';
+    nameKey?: string;
+    labelKey?: string;
+}): React.JSX.Element | null;
+declare const ChartLegend: typeof RechartsPrimitive.Legend;
+declare function ChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, }: React.ComponentProps<'div'> & Pick<RechartsPrimitive.LegendProps, 'payload' | 'verticalAlign'> & {
+    hideIcon?: boolean;
+    nameKey?: string;
+}): React.JSX.Element | null;
+export { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent };

package/dist/components/chart.js

@@ -0,0 +1,219 @@
+"use client";
+import {
+  cn
+} from "../chunk-Y2TKUANL.js";
+
+// src/components/chart.tsx
+import * as React from "react";
+import * as RechartsPrimitive from "recharts";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var THEMES = { dark: ".dark" };
+var ChartContext = React.createContext(null);
+function useChart() {
+  const context = React.use(ChartContext);
+  if (!context) {
+    throw new Error("useChart must be used within a <ChartContainer />");
+  }
+  return context;
+}
+function ChartContainer({
+  id,
+  className,
+  children,
+  config,
+  ...props
+}) {
+  const uniqueId = React.useId();
+  const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
+  const contextValue = React.useMemo(() => ({ config }), [config]);
+  return /* @__PURE__ */ jsx(ChartContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "chart",
+      "data-chart": chartId,
+      className: cn(
+        "flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(ChartStyle, { id: chartId, config }),
+        /* @__PURE__ */ jsx(RechartsPrimitive.ResponsiveContainer, { children })
+      ]
+    }
+  ) });
+}
+function ChartStyle({ id, config }) {
+  const colorConfig = Object.entries(config).filter(([, cfg]) => cfg.theme || cfg.color);
+  if (!colorConfig.length) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    "style",
+    {
+      dangerouslySetInnerHTML: {
+        __html: Object.entries(THEMES).map(
+          ([theme, prefix]) => `
+${prefix} [data-chart=${id}] {
+${colorConfig.map(([key, itemConfig]) => {
+            const color = itemConfig.theme?.[theme] || itemConfig.color;
+            return color ? `  --color-${key}: ${color};` : null;
+          }).join("\n")}
+}
+`
+        ).join("\n")
+      }
+    }
+  );
+}
+var ChartTooltip = RechartsPrimitive.Tooltip;
+var ChartTooltipLabel = React.memo(function ChartTooltipLabel2({
+  hideLabel,
+  payload,
+  label,
+  labelFormatter,
+  labelClassName,
+  labelKey,
+  config
+}) {
+  if (hideLabel || !payload?.length) {
+    return null;
+  }
+  const [item] = payload;
+  const key = `${labelKey || item?.dataKey || item?.name || "value"}`;
+  const itemConfig = getPayloadConfigFromPayload(config, item, key);
+  const value = !labelKey && typeof label === "string" ? config[label]?.label || label : itemConfig?.label;
+  if (labelFormatter) {
+    return /* @__PURE__ */ jsx("div", { className: cn("font-medium", labelClassName), children: labelFormatter(value, payload) });
+  }
+  if (!value) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn("font-medium", labelClassName), children: value });
+});
+function ChartTooltipContent({
+  active,
+  payload,
+  className,
+  indicator = "dot",
+  hideLabel = false,
+  hideIndicator = false,
+  label,
+  labelFormatter,
+  labelClassName,
+  formatter,
+  color,
+  nameKey,
+  labelKey
+}) {
+  const { config } = useChart();
+  if (!active || !payload?.length) {
+    return null;
+  }
+  const nestLabel = payload.length === 1 && indicator !== "dot";
+  const tooltipLabel = /* @__PURE__ */ jsx(
+    ChartTooltipLabel,
+    {
+      hideLabel,
+      payload,
+      label,
+      labelFormatter,
+      labelClassName,
+      labelKey,
+      config
+    }
+  );
+  return /* @__PURE__ */ jsxs("div", { className: cn("grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl", className), children: [
+    !nestLabel ? tooltipLabel : null,
+    /* @__PURE__ */ jsx("div", { className: "grid gap-1.5", children: payload.map((item, index) => {
+      const key = `${nameKey || item.name || item.dataKey || "value"}`;
+      const itemConfig = getPayloadConfigFromPayload(config, item, key);
+      const indicatorColor = color || item.payload?.fill || item.color;
+      return /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            "flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-muted-foreground",
+            indicator === "dot" && "items-center"
+          ),
+          children: formatter && item?.value !== void 0 && item.name ? formatter(item.value, item.name, item, index, item.payload) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            itemConfig?.icon ? /* @__PURE__ */ jsx(itemConfig.icon, {}) : !hideIndicator && /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: cn("shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)", {
+                  "h-2.5 w-2.5": indicator === "dot",
+                  "w-1": indicator === "line",
+                  "w-0 border-[1.5px] border-dashed bg-transparent": indicator === "dashed",
+                  "my-0.5": nestLabel && indicator === "dashed"
+                }),
+                style: {
+                  "--color-bg": indicatorColor,
+                  "--color-border": indicatorColor
+                }
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { className: cn("flex flex-1 justify-between leading-none", nestLabel ? "items-end" : "items-center"), children: [
+              /* @__PURE__ */ jsxs("div", { className: "grid gap-1.5", children: [
+                nestLabel ? tooltipLabel : null,
+                /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: itemConfig?.label || item.name })
+              ] }),
+              item.value !== void 0 && /* @__PURE__ */ jsx("span", { className: "font-medium font-mono text-foreground tabular-nums", children: item.value.toLocaleString() })
+            ] })
+          ] })
+        },
+        item.dataKey ?? index
+      );
+    }) })
+  ] });
+}
+var ChartLegend = RechartsPrimitive.Legend;
+function ChartLegendContent({
+  className,
+  hideIcon = false,
+  payload,
+  verticalAlign = "bottom",
+  nameKey
+}) {
+  const { config } = useChart();
+  if (!payload?.length) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn("flex items-center justify-center gap-4", verticalAlign === "top" ? "pb-3" : "pt-3", className), children: payload.map((item) => {
+    const key = `${nameKey || item.dataKey || "value"}`;
+    const itemConfig = getPayloadConfigFromPayload(config, item, key);
+    return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground", children: [
+      itemConfig?.icon && !hideIcon ? /* @__PURE__ */ jsx(itemConfig.icon, {}) : /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: "h-2 w-2 shrink-0 rounded-[2px]",
+          style: {
+            backgroundColor: item.color
+          }
+        }
+      ),
+      itemConfig?.label
+    ] }, item.value);
+  }) });
+}
+function getPayloadConfigFromPayload(config, payload, key) {
+  if (typeof payload !== "object" || payload === null) {
+    return void 0;
+  }
+  const payloadPayload = "payload" in payload && typeof payload.payload === "object" && payload.payload !== null ? payload.payload : void 0;
+  let configLabelKey = key;
+  if (key in payload && typeof payload[key] === "string") {
+    configLabelKey = payload[key];
+  } else if (payloadPayload && key in payloadPayload && typeof payloadPayload[key] === "string") {
+    configLabelKey = payloadPayload[key];
+  }
+  return configLabelKey in config ? config[configLabelKey] : config[key];
+}
+export {
+  ChartContainer,
+  ChartLegend,
+  ChartLegendContent,
+  ChartStyle,
+  ChartTooltip,
+  ChartTooltipContent
+};
+//# sourceMappingURL=chart.js.map

package/dist/components/chart.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/chart.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@betfin/ui/lib/utils';\nimport * as React from 'react';\nimport * as RechartsPrimitive from 'recharts';\n\n// Format: { THEME_NAME: CSS_SELECTOR }. Dark-only app — single theme.\nconst THEMES = { dark: '.dark' } as const;\n\nexport type ChartConfig = {\n\t[k in string]: {\n\t\tlabel?: React.ReactNode;\n\t\ticon?: React.ComponentType;\n\t} & ({ color?: string; theme?: never } | { color?: never; theme: Record<keyof typeof THEMES, string> });\n};\n\ntype ChartContextProps = {\n\tconfig: ChartConfig;\n};\n\nconst ChartContext = React.createContext<ChartContextProps | null>(null);\n\nfunction useChart() {\n\tconst context = React.use(ChartContext);\n\n\tif (!context) {\n\t\tthrow new Error('useChart must be used within a <ChartContainer />');\n\t}\n\n\treturn context;\n}\n\nfunction ChartContainer({\n\tid,\n\tclassName,\n\tchildren,\n\tconfig,\n\t...props\n}: React.ComponentProps<'div'> & {\n\tconfig: ChartConfig;\n\tchildren: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>['children'];\n}) {\n\tconst uniqueId = React.useId();\n\tconst chartId = `chart-${id || uniqueId.replace(/:/g, '')}`;\n\tconst contextValue = React.useMemo(() => ({ config }), [config]);\n\n\treturn (\n\t\t<ChartContext.Provider value={contextValue}>\n\t\t\t<div\n\t\t\t\tdata-slot=\"chart\"\n\t\t\t\tdata-chart={chartId}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<ChartStyle id={chartId} config={config} />\n\t\t\t\t<RechartsPrimitive.ResponsiveContainer>{children}</RechartsPrimitive.ResponsiveContainer>\n\t\t\t</div>\n\t\t</ChartContext.Provider>\n\t);\n}\n\nfunction ChartStyle({ id, config }: { id: string; config: ChartConfig }) {\n\tconst colorConfig = Object.entries(config).filter(([, cfg]) => cfg.theme || cfg.color);\n\n\tif (!colorConfig.length) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<style\n\t\t\tdangerouslySetInnerHTML={{\n\t\t\t\t__html: Object.entries(THEMES)\n\t\t\t\t\t.map(\n\t\t\t\t\t\t([theme, prefix]) => `\n${prefix} [data-chart=${id}] {\n${colorConfig\n\t.map(([key, itemConfig]) => {\n\t\tconst color = itemConfig.theme?.[theme as keyof typeof itemConfig.theme] || itemConfig.color;\n\t\treturn color ? `  --color-${key}: ${color};` : null;\n\t})\n\t.join('\\n')}\n}\n`,\n\t\t\t\t\t)\n\t\t\t\t\t.join('\\n'),\n\t\t\t}}\n\t\t/>\n\t);\n}\n\nconst ChartTooltip = RechartsPrimitive.Tooltip;\n\ntype ChartTooltipProps = React.ComponentProps<typeof RechartsPrimitive.Tooltip>;\n\n// Rendered after ChartTooltipContent's early return so the label work is skipped\n// on inactive/empty renders; memoized to keep the previous useMemo's benefit.\nconst ChartTooltipLabel = React.memo(function ChartTooltipLabel({\n\thideLabel,\n\tpayload,\n\tlabel,\n\tlabelFormatter,\n\tlabelClassName,\n\tlabelKey,\n\tconfig,\n}: Pick<ChartTooltipProps, 'payload' | 'label' | 'labelFormatter' | 'labelClassName'> & {\n\thideLabel: boolean;\n\tlabelKey?: string;\n\tconfig: ChartConfig;\n}) {\n\tif (hideLabel || !payload?.length) {\n\t\treturn null;\n\t}\n\n\tconst [item] = payload;\n\tconst key = `${labelKey || item?.dataKey || item?.name || 'value'}`;\n\tconst itemConfig = getPayloadConfigFromPayload(config, item, key);\n\tconst value = !labelKey && typeof label === 'string' ? config[label as keyof typeof config]?.label || label : itemConfig?.label;\n\n\tif (labelFormatter) {\n\t\treturn <div className={cn('font-medium', labelClassName)}>{labelFormatter(value, payload)}</div>;\n\t}\n\n\tif (!value) {\n\t\treturn null;\n\t}\n\n\treturn <div className={cn('font-medium', labelClassName)}>{value}</div>;\n});\n\nfunction ChartTooltipContent({\n\tactive,\n\tpayload,\n\tclassName,\n\tindicator = 'dot',\n\thideLabel = false,\n\thideIndicator = false,\n\tlabel,\n\tlabelFormatter,\n\tlabelClassName,\n\tformatter,\n\tcolor,\n\tnameKey,\n\tlabelKey,\n}: React.ComponentProps<typeof RechartsPrimitive.Tooltip> &\n\tReact.ComponentProps<'div'> & {\n\t\thideLabel?: boolean;\n\t\thideIndicator?: boolean;\n\t\tindicator?: 'line' | 'dot' | 'dashed';\n\t\tnameKey?: string;\n\t\tlabelKey?: string;\n\t}) {\n\tconst { config } = useChart();\n\n\tif (!active || !payload?.length) {\n\t\treturn null;\n\t}\n\n\tconst nestLabel = payload.length === 1 && indicator !== 'dot';\n\n\tconst tooltipLabel = (\n\t\t<ChartTooltipLabel\n\t\t\thideLabel={hideLabel}\n\t\t\tpayload={payload}\n\t\t\tlabel={label}\n\t\t\tlabelFormatter={labelFormatter}\n\t\t\tlabelClassName={labelClassName}\n\t\t\tlabelKey={labelKey}\n\t\t\tconfig={config}\n\t\t/>\n\t);\n\n\treturn (\n\t\t<div className={cn('grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl', className)}>\n\t\t\t{!nestLabel ? tooltipLabel : null}\n\t\t\t<div className=\"grid gap-1.5\">\n\t\t\t\t{payload.map((item, index) => {\n\t\t\t\t\tconst key = `${nameKey || item.name || item.dataKey || 'value'}`;\n\t\t\t\t\tconst itemConfig = getPayloadConfigFromPayload(config, item, key);\n\t\t\t\t\tconst indicatorColor = color || item.payload?.fill || item.color;\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={item.dataKey ?? index}\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t'flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-muted-foreground',\n\t\t\t\t\t\t\t\tindicator === 'dot' && 'items-center',\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{formatter && item?.value !== undefined && item.name ? (\n\t\t\t\t\t\t\t\tformatter(item.value, item.name, item, index, item.payload)\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t{itemConfig?.icon ? (\n\t\t\t\t\t\t\t\t\t\t<itemConfig.icon />\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t!hideIndicator && (\n\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn('shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)', {\n\t\t\t\t\t\t\t\t\t\t\t\t\t'h-2.5 w-2.5': indicator === 'dot',\n\t\t\t\t\t\t\t\t\t\t\t\t\t'w-1': indicator === 'line',\n\t\t\t\t\t\t\t\t\t\t\t\t\t'w-0 border-[1.5px] border-dashed bg-transparent': indicator === 'dashed',\n\t\t\t\t\t\t\t\t\t\t\t\t\t'my-0.5': nestLabel && indicator === 'dashed',\n\t\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'--color-bg': indicatorColor,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'--color-border': indicatorColor,\n\t\t\t\t\t\t\t\t\t\t\t\t\t} as React.CSSProperties\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t<div className={cn('flex flex-1 justify-between leading-none', nestLabel ? 'items-end' : 'items-center')}>\n\t\t\t\t\t\t\t\t\t\t<div className=\"grid gap-1.5\">\n\t\t\t\t\t\t\t\t\t\t\t{nestLabel ? tooltipLabel : null}\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-muted-foreground\">{itemConfig?.label || item.name}</span>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t{item.value !== undefined && <span className=\"font-medium font-mono text-foreground tabular-nums\">{item.value.toLocaleString()}</span>}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nconst ChartLegend = RechartsPrimitive.Legend;\n\nfunction ChartLegendContent({\n\tclassName,\n\thideIcon = false,\n\tpayload,\n\tverticalAlign = 'bottom',\n\tnameKey,\n}: React.ComponentProps<'div'> &\n\tPick<RechartsPrimitive.LegendProps, 'payload' | 'verticalAlign'> & {\n\t\thideIcon?: boolean;\n\t\tnameKey?: string;\n\t}) {\n\tconst { config } = useChart();\n\n\tif (!payload?.length) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<div className={cn('flex items-center justify-center gap-4', verticalAlign === 'top' ? 'pb-3' : 'pt-3', className)}>\n\t\t\t{payload.map((item) => {\n\t\t\t\tconst key = `${nameKey || item.dataKey || 'value'}`;\n\t\t\t\tconst itemConfig = getPayloadConfigFromPayload(config, item, key);\n\n\t\t\t\treturn (\n\t\t\t\t\t<div key={item.value} className=\"flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground\">\n\t\t\t\t\t\t{itemConfig?.icon && !hideIcon ? (\n\t\t\t\t\t\t\t<itemConfig.icon />\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName=\"h-2 w-2 shrink-0 rounded-[2px]\"\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tbackgroundColor: item.color,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{itemConfig?.label}\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t})}\n\t\t</div>\n\t);\n}\n\n// Helper to extract item config from a payload.\nfunction getPayloadConfigFromPayload(config: ChartConfig, payload: unknown, key: string) {\n\tif (typeof payload !== 'object' || payload === null) {\n\t\treturn undefined;\n\t}\n\n\tconst payloadPayload = 'payload' in payload && typeof payload.payload === 'object' && payload.payload !== null ? payload.payload : undefined;\n\n\tlet configLabelKey: string = key;\n\n\tif (key in payload && typeof payload[key as keyof typeof payload] === 'string') {\n\t\tconfigLabelKey = payload[key as keyof typeof payload] as string;\n\t} else if (payloadPayload && key in payloadPayload && typeof payloadPayload[key as keyof typeof payloadPayload] === 'string') {\n\t\tconfigLabelKey = payloadPayload[key as keyof typeof payloadPayload] as string;\n\t}\n\n\treturn configLabelKey in config ? config[configLabelKey] : config[key as keyof typeof config];\n}\n\nexport { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent };\n"],"mappings":"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","names":["ChartTooltipLabel"]}

package/dist/components/checkbox.d.ts

@@ -0,0 +1,3 @@
+import { Checkbox as CheckboxPrimitive } from '@base-ui/react/checkbox';
+declare function Checkbox({ className, ...props }: CheckboxPrimitive.Root.Props): import("react").JSX.Element;
+export { Checkbox };

package/dist/components/checkbox.js

@@ -0,0 +1,26 @@
+import {
+  cn
+} from "../chunk-Y2TKUANL.js";
+
+// src/components/checkbox.tsx
+import { Checkbox as CheckboxPrimitive } from "@base-ui/react/checkbox";
+import { CheckIcon } from "lucide-react";
+import { jsx } from "react/jsx-runtime";
+function Checkbox({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    CheckboxPrimitive.Root,
+    {
+      "data-slot": "checkbox",
+      className: cn(
+        "peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border border-input outline-none transition-colors after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 group-has-disabled/field:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 aria-invalid:aria-checked:border-primary data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground dark:bg-input/30 dark:data-checked:bg-primary dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", className: "grid place-content-center text-current transition-none [&>svg]:size-3.5", children: /* @__PURE__ */ jsx(CheckIcon, {}) })
+    }
+  );
+}
+export {
+  Checkbox
+};
+//# sourceMappingURL=checkbox.js.map

package/dist/components/checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/checkbox.tsx"],"sourcesContent":["import { Checkbox as CheckboxPrimitive } from '@base-ui/react/checkbox';\n\nimport { cn } from '@betfin/ui/lib/utils';\nimport { CheckIcon } from 'lucide-react';\n\nfunction Checkbox({ className, ...props }: CheckboxPrimitive.Root.Props) {\n\treturn (\n\t\t<CheckboxPrimitive.Root\n\t\t\tdata-slot=\"checkbox\"\n\t\t\tclassName={cn(\n\t\t\t\t'peer relative flex size-4 shrink-0 items-center justify-center rounded-[4px] border border-input outline-none transition-colors after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 group-has-disabled/field:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 aria-invalid:aria-checked:border-primary data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground dark:bg-input/30 dark:data-checked:bg-primary dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<CheckboxPrimitive.Indicator data-slot=\"checkbox-indicator\" className=\"grid place-content-center text-current transition-none [&>svg]:size-3.5\">\n\t\t\t\t<CheckIcon />\n\t\t\t</CheckboxPrimitive.Indicator>\n\t\t</CheckboxPrimitive.Root>\n\t);\n}\n\nexport { Checkbox };\n"],"mappings":";;;;;AAAA,SAAS,YAAY,yBAAyB;AAG9C,SAAS,iBAAiB;AAatB;AAXJ,SAAS,SAAS,EAAE,WAAW,GAAG,MAAM,GAAiC;AACxE,SACC;AAAA,IAAC,kBAAkB;AAAA,IAAlB;AAAA,MACA,aAAU;AAAA,MACV,WAAW;AAAA,QACV;AAAA,QACA;AAAA,MACD;AAAA,MACC,GAAG;AAAA,MAEJ,8BAAC,kBAAkB,WAAlB,EAA4B,aAAU,sBAAqB,WAAU,2EACrE,8BAAC,aAAU,GACZ;AAAA;AAAA,EACD;AAEF;","names":[]}

package/dist/components/collapsible.d.ts

@@ -0,0 +1,5 @@
+import { Collapsible as CollapsiblePrimitive } from '@base-ui/react/collapsible';
+declare function Collapsible({ ...props }: CollapsiblePrimitive.Root.Props): import("react").JSX.Element;
+declare function CollapsibleTrigger({ ...props }: CollapsiblePrimitive.Trigger.Props): import("react").JSX.Element;
+declare function CollapsibleContent({ ...props }: CollapsiblePrimitive.Panel.Props): import("react").JSX.Element;
+export { Collapsible, CollapsibleContent, CollapsibleTrigger };

package/dist/components/collapsible.js

@@ -0,0 +1,20 @@
+"use client";
+
+// src/components/collapsible.tsx
+import { Collapsible as CollapsiblePrimitive } from "@base-ui/react/collapsible";
+import { jsx } from "react/jsx-runtime";
+function Collapsible({ ...props }) {
+  return /* @__PURE__ */ jsx(CollapsiblePrimitive.Root, { "data-slot": "collapsible", ...props });
+}
+function CollapsibleTrigger({ ...props }) {
+  return /* @__PURE__ */ jsx(CollapsiblePrimitive.Trigger, { "data-slot": "collapsible-trigger", ...props });
+}
+function CollapsibleContent({ ...props }) {
+  return /* @__PURE__ */ jsx(CollapsiblePrimitive.Panel, { "data-slot": "collapsible-content", ...props });
+}
+export {
+  Collapsible,
+  CollapsibleContent,
+  CollapsibleTrigger
+};
+//# sourceMappingURL=collapsible.js.map

package/dist/components/collapsible.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/collapsible.tsx"],"sourcesContent":["'use client';\n\nimport { Collapsible as CollapsiblePrimitive } from '@base-ui/react/collapsible';\n\nfunction Collapsible({ ...props }: CollapsiblePrimitive.Root.Props) {\n\treturn <CollapsiblePrimitive.Root data-slot=\"collapsible\" {...props} />;\n}\n\nfunction CollapsibleTrigger({ ...props }: CollapsiblePrimitive.Trigger.Props) {\n\treturn <CollapsiblePrimitive.Trigger data-slot=\"collapsible-trigger\" {...props} />;\n}\n\nfunction CollapsibleContent({ ...props }: CollapsiblePrimitive.Panel.Props) {\n\treturn <CollapsiblePrimitive.Panel data-slot=\"collapsible-content\" {...props} />;\n}\n\nexport { Collapsible, CollapsibleContent, CollapsibleTrigger };\n"],"mappings":";;;AAEA,SAAS,eAAe,4BAA4B;AAG5C;AADR,SAAS,YAAY,EAAE,GAAG,MAAM,GAAoC;AACnE,SAAO,oBAAC,qBAAqB,MAArB,EAA0B,aAAU,eAAe,GAAG,OAAO;AACtE;AAEA,SAAS,mBAAmB,EAAE,GAAG,MAAM,GAAuC;AAC7E,SAAO,oBAAC,qBAAqB,SAArB,EAA6B,aAAU,uBAAuB,GAAG,OAAO;AACjF;AAEA,SAAS,mBAAmB,EAAE,GAAG,MAAM,GAAqC;AAC3E,SAAO,oBAAC,qBAAqB,OAArB,EAA2B,aAAU,uBAAuB,GAAG,OAAO;AAC/E;","names":[]}

package/dist/components/command.d.ts

@@ -0,0 +1,19 @@
+import { Dialog } from '@betfin/ui/components/dialog';
+import { Command as CommandPrimitive } from 'cmdk';
+import type * as React from 'react';
+declare function Command({ className, ...props }: React.ComponentProps<typeof CommandPrimitive>): React.JSX.Element;
+declare function CommandDialog({ title, description, children, className, showCloseButton, ...props }: Omit<React.ComponentProps<typeof Dialog>, 'children'> & {
+    title?: string;
+    description?: string;
+    className?: string;
+    showCloseButton?: boolean;
+    children: React.ReactNode;
+}): React.JSX.Element;
+declare function CommandInput({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Input>): React.JSX.Element;
+declare function CommandList({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.List>): React.JSX.Element;
+declare function CommandEmpty({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Empty>): React.JSX.Element;
+declare function CommandGroup({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Group>): React.JSX.Element;
+declare function CommandSeparator({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Separator>): React.JSX.Element;
+declare function CommandItem({ className, children, ...props }: React.ComponentProps<typeof CommandPrimitive.Item>): React.JSX.Element;
+declare function CommandShortcut({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
+export { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut };

package/dist/components/command.js

@@ -0,0 +1,130 @@
+"use client";
+import {
+  InputGroup,
+  InputGroupAddon
+} from "../chunk-QZIKXMHP.js";
+import "../chunk-SSC2M625.js";
+import "../chunk-EP6DYU4N.js";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle
+} from "../chunk-3YCD2QLS.js";
+import "../chunk-5CXIFF6J.js";
+import {
+  cn
+} from "../chunk-Y2TKUANL.js";
+
+// src/components/command.tsx
+import { Command as CommandPrimitive } from "cmdk";
+import { CheckIcon, SearchIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function Command({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    CommandPrimitive,
+    {
+      "data-slot": "command",
+      className: cn("flex size-full flex-col overflow-hidden rounded-xl! bg-popover p-1 text-popover-foreground", className),
+      ...props
+    }
+  );
+}
+function CommandDialog({
+  title = "Command Palette",
+  description = "Search for a command to run...",
+  children,
+  className,
+  showCloseButton = false,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(Dialog, { ...props, children: [
+    /* @__PURE__ */ jsxs(DialogHeader, { className: "sr-only", children: [
+      /* @__PURE__ */ jsx(DialogTitle, { children: title }),
+      /* @__PURE__ */ jsx(DialogDescription, { children: description })
+    ] }),
+    /* @__PURE__ */ jsx(DialogContent, { className: cn("top-1/3 translate-y-0 overflow-hidden rounded-xl! p-0", className), showCloseButton, children })
+  ] });
+}
+function CommandInput({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { "data-slot": "command-input-wrapper", className: "p-1 pb-0", children: /* @__PURE__ */ jsxs(InputGroup, { className: "h-8! rounded-lg! border-input/30 bg-input/30 shadow-none! *:data-[slot=input-group-addon]:pl-2!", children: [
+    /* @__PURE__ */ jsx(
+      CommandPrimitive.Input,
+      {
+        "data-slot": "command-input",
+        className: cn("w-full text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50", className),
+        ...props
+      }
+    ),
+    /* @__PURE__ */ jsx(InputGroupAddon, { children: /* @__PURE__ */ jsx(SearchIcon, { className: "size-4 shrink-0 opacity-50" }) })
+  ] }) });
+}
+function CommandList({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    CommandPrimitive.List,
+    {
+      "data-slot": "command-list",
+      className: cn("no-scrollbar max-h-72 scroll-py-1 overflow-y-auto overflow-x-hidden outline-none", className),
+      ...props
+    }
+  );
+}
+function CommandEmpty({ className, ...props }) {
+  return /* @__PURE__ */ jsx(CommandPrimitive.Empty, { "data-slot": "command-empty", className: cn("py-6 text-center text-sm", className), ...props });
+}
+function CommandGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    CommandPrimitive.Group,
+    {
+      "data-slot": "command-group",
+      className: cn(
+        "overflow-hidden p-1 text-foreground **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:py-1.5 **:[[cmdk-group-heading]]:font-medium **:[[cmdk-group-heading]]:text-muted-foreground **:[[cmdk-group-heading]]:text-xs",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function CommandSeparator({ className, ...props }) {
+  return /* @__PURE__ */ jsx(CommandPrimitive.Separator, { "data-slot": "command-separator", className: cn("-mx-1 h-px bg-border", className), ...props });
+}
+function CommandItem({ className, children, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    CommandPrimitive.Item,
+    {
+      "data-slot": "command-item",
+      className: cn(
+        "group/command-item relative flex cursor-default select-none items-center gap-2 in-data-[slot=dialog-content]:rounded-lg! rounded-sm px-2 py-1.5 text-sm outline-hidden data-[disabled=true]:pointer-events-none data-selected:bg-muted data-selected:text-foreground data-[disabled=true]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0 data-selected:*:[svg]:text-foreground",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(CheckIcon, { className: "ml-auto opacity-0 group-has-data-[slot=command-shortcut]/command-item:hidden group-data-[checked=true]/command-item:opacity-100" })
+      ]
+    }
+  );
+}
+function CommandShortcut({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      "data-slot": "command-shortcut",
+      className: cn("ml-auto text-muted-foreground text-xs tracking-widest group-data-selected/command-item:text-foreground", className),
+      ...props
+    }
+  );
+}
+export {
+  Command,
+  CommandDialog,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList,
+  CommandSeparator,
+  CommandShortcut
+};
+//# sourceMappingURL=command.js.map

package/dist/components/command.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/command.tsx"],"sourcesContent":["'use client';\n\nimport { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '@betfin/ui/components/dialog';\nimport { InputGroup, InputGroupAddon } from '@betfin/ui/components/input-group';\n\nimport { cn } from '@betfin/ui/lib/utils';\nimport { Command as CommandPrimitive } from 'cmdk';\nimport { CheckIcon, SearchIcon } from 'lucide-react';\nimport type * as React from 'react';\n\nfunction Command({ className, ...props }: React.ComponentProps<typeof CommandPrimitive>) {\n\treturn (\n\t\t<CommandPrimitive\n\t\t\tdata-slot=\"command\"\n\t\t\tclassName={cn('flex size-full flex-col overflow-hidden rounded-xl! bg-popover p-1 text-popover-foreground', className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction CommandDialog({\n\ttitle = 'Command Palette',\n\tdescription = 'Search for a command to run...',\n\tchildren,\n\tclassName,\n\tshowCloseButton = false,\n\t...props\n}: Omit<React.ComponentProps<typeof Dialog>, 'children'> & {\n\ttitle?: string;\n\tdescription?: string;\n\tclassName?: string;\n\tshowCloseButton?: boolean;\n\tchildren: React.ReactNode;\n}) {\n\treturn (\n\t\t<Dialog {...props}>\n\t\t\t<DialogHeader className=\"sr-only\">\n\t\t\t\t<DialogTitle>{title}</DialogTitle>\n\t\t\t\t<DialogDescription>{description}</DialogDescription>\n\t\t\t</DialogHeader>\n\t\t\t<DialogContent className={cn('top-1/3 translate-y-0 overflow-hidden rounded-xl! p-0', className)} showCloseButton={showCloseButton}>\n\t\t\t\t{children}\n\t\t\t</DialogContent>\n\t\t</Dialog>\n\t);\n}\n\nfunction CommandInput({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Input>) {\n\treturn (\n\t\t<div data-slot=\"command-input-wrapper\" className=\"p-1 pb-0\">\n\t\t\t<InputGroup className=\"h-8! rounded-lg! border-input/30 bg-input/30 shadow-none! *:data-[slot=input-group-addon]:pl-2!\">\n\t\t\t\t<CommandPrimitive.Input\n\t\t\t\t\tdata-slot=\"command-input\"\n\t\t\t\t\tclassName={cn('w-full text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50', className)}\n\t\t\t\t\t{...props}\n\t\t\t\t/>\n\t\t\t\t<InputGroupAddon>\n\t\t\t\t\t<SearchIcon className=\"size-4 shrink-0 opacity-50\" />\n\t\t\t\t</InputGroupAddon>\n\t\t\t</InputGroup>\n\t\t</div>\n\t);\n}\n\nfunction CommandList({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.List>) {\n\treturn (\n\t\t<CommandPrimitive.List\n\t\t\tdata-slot=\"command-list\"\n\t\t\tclassName={cn('no-scrollbar max-h-72 scroll-py-1 overflow-y-auto overflow-x-hidden outline-none', className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction CommandEmpty({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Empty>) {\n\treturn <CommandPrimitive.Empty data-slot=\"command-empty\" className={cn('py-6 text-center text-sm', className)} {...props} />;\n}\n\nfunction CommandGroup({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Group>) {\n\treturn (\n\t\t<CommandPrimitive.Group\n\t\t\tdata-slot=\"command-group\"\n\t\t\tclassName={cn(\n\t\t\t\t'overflow-hidden p-1 text-foreground **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:py-1.5 **:[[cmdk-group-heading]]:font-medium **:[[cmdk-group-heading]]:text-muted-foreground **:[[cmdk-group-heading]]:text-xs',\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction CommandSeparator({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Separator>) {\n\treturn <CommandPrimitive.Separator data-slot=\"command-separator\" className={cn('-mx-1 h-px bg-border', className)} {...props} />;\n}\n\nfunction CommandItem({ className, children, ...props }: React.ComponentProps<typeof CommandPrimitive.Item>) {\n\treturn (\n\t\t<CommandPrimitive.Item\n\t\t\tdata-slot=\"command-item\"\n\t\t\tclassName={cn(\n\t\t\t\t\"group/command-item relative flex cursor-default select-none items-center gap-2 in-data-[slot=dialog-content]:rounded-lg! rounded-sm px-2 py-1.5 text-sm outline-hidden data-[disabled=true]:pointer-events-none data-selected:bg-muted data-selected:text-foreground data-[disabled=true]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0 data-selected:*:[svg]:text-foreground\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t\t<CheckIcon className=\"ml-auto opacity-0 group-has-data-[slot=command-shortcut]/command-item:hidden group-data-[checked=true]/command-item:opacity-100\" />\n\t\t</CommandPrimitive.Item>\n\t);\n}\n\nfunction CommandShortcut({ className, ...props }: React.ComponentProps<'span'>) {\n\treturn (\n\t\t<span\n\t\t\tdata-slot=\"command-shortcut\"\n\t\t\tclassName={cn('ml-auto text-muted-foreground text-xs tracking-widest group-data-selected/command-item:text-foreground', className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAMA,SAAS,WAAW,wBAAwB;AAC5C,SAAS,WAAW,kBAAkB;AAKpC,cAwBC,YAxBD;AAFF,SAAS,QAAQ,EAAE,WAAW,GAAG,MAAM,GAAkD;AACxF,SACC;AAAA,IAAC;AAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAW,GAAG,8FAA8F,SAAS;AAAA,MACpH,GAAG;AAAA;AAAA,EACL;AAEF;AAEA,SAAS,cAAc;AAAA,EACtB,QAAQ;AAAA,EACR,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB,GAAG;AACJ,GAMG;AACF,SACC,qBAAC,UAAQ,GAAG,OACX;AAAA,yBAAC,gBAAa,WAAU,WACvB;AAAA,0BAAC,eAAa,iBAAM;AAAA,MACpB,oBAAC,qBAAmB,uBAAY;AAAA,OACjC;AAAA,IACA,oBAAC,iBAAc,WAAW,GAAG,yDAAyD,SAAS,GAAG,iBAChG,UACF;AAAA,KACD;AAEF;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,MAAM,GAAwD;AACnG,SACC,oBAAC,SAAI,aAAU,yBAAwB,WAAU,YAChD,+BAAC,cAAW,WAAU,mGACrB;AAAA;AAAA,MAAC,iBAAiB;AAAA,MAAjB;AAAA,QACA,aAAU;AAAA,QACV,WAAW,GAAG,iFAAiF,SAAS;AAAA,QACvG,GAAG;AAAA;AAAA,IACL;AAAA,IACA,oBAAC,mBACA,8BAAC,cAAW,WAAU,8BAA6B,GACpD;AAAA,KACD,GACD;AAEF;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,MAAM,GAAuD;AACjG,SACC;AAAA,IAAC,iBAAiB;AAAA,IAAjB;AAAA,MACA,aAAU;AAAA,MACV,WAAW,GAAG,oFAAoF,SAAS;AAAA,MAC1G,GAAG;AAAA;AAAA,EACL;AAEF;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,MAAM,GAAwD;AACnG,SAAO,oBAAC,iBAAiB,OAAjB,EAAuB,aAAU,iBAAgB,WAAW,GAAG,4BAA4B,SAAS,GAAI,GAAG,OAAO;AAC3H;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,MAAM,GAAwD;AACnG,SACC;AAAA,IAAC,iBAAiB;AAAA,IAAjB;AAAA,MACA,aAAU;AAAA,MACV,WAAW;AAAA,QACV;AAAA,QACA;AAAA,MACD;AAAA,MACC,GAAG;AAAA;AAAA,EACL;AAEF;AAEA,SAAS,iBAAiB,EAAE,WAAW,GAAG,MAAM,GAA4D;AAC3G,SAAO,oBAAC,iBAAiB,WAAjB,EAA2B,aAAU,qBAAoB,WAAW,GAAG,wBAAwB,SAAS,GAAI,GAAG,OAAO;AAC/H;AAEA,SAAS,YAAY,EAAE,WAAW,UAAU,GAAG,MAAM,GAAuD;AAC3G,SACC;AAAA,IAAC,iBAAiB;AAAA,IAAjB;AAAA,MACA,aAAU;AAAA,MACV,WAAW;AAAA,QACV;AAAA,QACA;AAAA,MACD;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,QACD,oBAAC,aAAU,WAAU,mIAAkI;AAAA;AAAA;AAAA,EACxJ;AAEF;AAEA,SAAS,gBAAgB,EAAE,WAAW,GAAG,MAAM,GAAiC;AAC/E,SACC;AAAA,IAAC;AAAA;AAAA,MACA,aAAU;AAAA,MACV,WAAW,GAAG,0GAA0G,SAAS;AAAA,MAChI,GAAG;AAAA;AAAA,EACL;AAEF;","names":[]}

package/dist/components/context-menu.d.ts

@@ -0,0 +1,29 @@
+import { ContextMenu as ContextMenuPrimitive } from '@base-ui/react/context-menu';
+import type * as React from 'react';
+declare function ContextMenu({ ...props }: ContextMenuPrimitive.Root.Props): React.JSX.Element;
+declare function ContextMenuPortal({ ...props }: ContextMenuPrimitive.Portal.Props): React.JSX.Element;
+declare function ContextMenuTrigger({ className, ...props }: ContextMenuPrimitive.Trigger.Props): React.JSX.Element;
+declare function ContextMenuContent({ className, align, alignOffset, side, sideOffset, ...props }: ContextMenuPrimitive.Popup.Props & Pick<ContextMenuPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset'>): React.JSX.Element;
+declare function ContextMenuGroup({ ...props }: ContextMenuPrimitive.Group.Props): React.JSX.Element;
+declare function ContextMenuLabel({ className, inset, ...props }: ContextMenuPrimitive.GroupLabel.Props & {
+    inset?: boolean;
+}): React.JSX.Element;
+declare function ContextMenuItem({ className, inset, variant, ...props }: ContextMenuPrimitive.Item.Props & {
+    inset?: boolean;
+    variant?: 'default' | 'destructive';
+}): React.JSX.Element;
+declare function ContextMenuSub({ ...props }: ContextMenuPrimitive.SubmenuRoot.Props): React.JSX.Element;
+declare function ContextMenuSubTrigger({ className, inset, children, ...props }: ContextMenuPrimitive.SubmenuTrigger.Props & {
+    inset?: boolean;
+}): React.JSX.Element;
+declare function ContextMenuSubContent({ ...props }: React.ComponentProps<typeof ContextMenuContent>): React.JSX.Element;
+declare function ContextMenuCheckboxItem({ className, children, checked, inset, ...props }: ContextMenuPrimitive.CheckboxItem.Props & {
+    inset?: boolean;
+}): React.JSX.Element;
+declare function ContextMenuRadioGroup({ ...props }: ContextMenuPrimitive.RadioGroup.Props): React.JSX.Element;
+declare function ContextMenuRadioItem({ className, children, inset, ...props }: ContextMenuPrimitive.RadioItem.Props & {
+    inset?: boolean;
+}): React.JSX.Element;
+declare function ContextMenuSeparator({ className, ...props }: ContextMenuPrimitive.Separator.Props): React.JSX.Element;
+declare function ContextMenuShortcut({ className, ...props }: React.ComponentProps<'span'>): React.JSX.Element;
+export { ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, };