@manta-eu/react 0.1.0

package/dist/components/chart/chart-schemas.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart-schemas.d.ts","sourceRoot":"","sources":["../../../src/components/chart/chart-schemas.ts"],"names":[],"mappings":"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"}

package/dist/components/chart/chart-schemas.js

@@ -0,0 +1,168 @@
+import { z } from "zod/v4";
+const baseChartSchema = z.object({
+    title: z.string().optional(),
+    height: z.number().int().min(120).max(600).optional(),
+});
+const cartesianAxisFields = {
+    xAxisLabel: z.string().optional(),
+    yAxisLabel: z.string().optional(),
+};
+const xyDataPointSchema = z.object({
+    x: z.union([z.string(), z.number()]),
+    y: z.number(),
+});
+const nameValueDataPointSchema = z.object({
+    name: z.string(),
+    value: z.number(),
+});
+const scatterDataPointSchema = z.object({
+    x: z.number(),
+    y: z.number(),
+});
+const radarDataPointSchema = z.object({
+    subject: z.string(),
+    value: z.number(),
+});
+const composedDataPointSchema = z.object({
+    name: z.string(),
+    barValue: z.number(),
+    lineValue: z.number(),
+});
+const axisValueSchema = z.union([z.string(), z.number()]);
+export const annotationTones = ["danger", "warning", "success", "info", "neutral"];
+export const annotationStats = ["average", "median", "min", "max", "p90"];
+export const annotationSeriesValues = ["bar", "line"];
+export const annotationToneSchema = z.enum(annotationTones);
+export const annotationStatSchema = z.enum(annotationStats);
+const annotationSeriesSchema = z.enum(annotationSeriesValues);
+const referenceLineAnnotationSchema = z.object({
+    kind: z.literal("reference-line"),
+    axis: z.enum(["x", "y"]),
+    value: axisValueSchema,
+    label: z.string().optional(),
+    tone: annotationToneSchema.optional(),
+    color: z.string().optional(),
+    strokeDasharray: z.string().optional(),
+});
+const statLineAnnotationSchema = z.object({
+    kind: z.literal("stat-line"),
+    stat: annotationStatSchema,
+    axis: z.enum(["x", "y"]).optional(),
+    series: annotationSeriesSchema.optional(),
+    label: z.string().optional(),
+    tone: annotationToneSchema.optional(),
+    color: z.string().optional(),
+    strokeDasharray: z.string().optional(),
+});
+const referenceAreaAnnotationSchema = z.object({
+    kind: z.literal("reference-area"),
+    axis: z.enum(["x", "y"]),
+    from: axisValueSchema,
+    to: axisValueSchema,
+    label: z.string().optional(),
+    tone: annotationToneSchema.optional(),
+    color: z.string().optional(),
+});
+const referencePointAnnotationSchema = z.object({
+    kind: z.literal("reference-point"),
+    x: axisValueSchema,
+    y: z.number(),
+    label: z.string().optional(),
+    tone: annotationToneSchema.optional(),
+    color: z.string().optional(),
+});
+export const annotationSchema = z.discriminatedUnion("kind", [
+    referenceLineAnnotationSchema,
+    statLineAnnotationSchema,
+    referenceAreaAnnotationSchema,
+    referencePointAnnotationSchema,
+]);
+const cartesianAnnotationFields = {
+    annotations: z.array(annotationSchema).optional(),
+    showValueLabels: z.boolean().optional(),
+};
+export const lineChartSchema = baseChartSchema.extend({
+    type: z.literal("line"),
+    data: z.array(xyDataPointSchema).min(1),
+    ...cartesianAxisFields,
+    ...cartesianAnnotationFields,
+});
+export const areaChartSchema = baseChartSchema.extend({
+    type: z.literal("area"),
+    data: z.array(xyDataPointSchema).min(1),
+    ...cartesianAxisFields,
+    ...cartesianAnnotationFields,
+});
+export const barChartSchema = baseChartSchema.extend({
+    type: z.literal("bar"),
+    data: z.array(nameValueDataPointSchema).min(1),
+    ...cartesianAxisFields,
+    ...cartesianAnnotationFields,
+});
+export const pieChartSchema = baseChartSchema.extend({
+    type: z.literal("pie"),
+    data: z.array(nameValueDataPointSchema).min(1),
+});
+export const scatterChartSchema = baseChartSchema.extend({
+    type: z.literal("scatter"),
+    data: z.array(scatterDataPointSchema).min(1),
+    ...cartesianAxisFields,
+    ...cartesianAnnotationFields,
+});
+export const radarChartSchema = baseChartSchema.extend({
+    type: z.literal("radar"),
+    data: z.array(radarDataPointSchema).min(1),
+});
+export const composedChartSchema = baseChartSchema.extend({
+    type: z.literal("composed"),
+    data: z.array(composedDataPointSchema).min(1),
+    barLabel: z.string().optional(),
+    lineLabel: z.string().optional(),
+    ...cartesianAxisFields,
+    ...cartesianAnnotationFields,
+});
+export const chartSchema = z.discriminatedUnion("type", [
+    lineChartSchema,
+    areaChartSchema,
+    barChartSchema,
+    pieChartSchema,
+    scatterChartSchema,
+    radarChartSchema,
+    composedChartSchema,
+]);
+const generateChartDataPointSchema = z.object({
+    x: z.union([z.string(), z.number()]).optional(),
+    y: z.number().optional(),
+    name: z.string().optional(),
+    value: z.number().optional(),
+    subject: z.string().optional(),
+    barValue: z.number().optional(),
+    lineValue: z.number().optional(),
+});
+const generateChartAnnotationSchema = z.object({
+    kind: z.enum(["reference-line", "stat-line", "reference-area", "reference-point"]),
+    axis: z.enum(["x", "y"]).optional(),
+    value: axisValueSchema.optional(),
+    from: axisValueSchema.optional(),
+    to: axisValueSchema.optional(),
+    x: axisValueSchema.optional(),
+    y: z.number().optional(),
+    stat: annotationStatSchema.optional(),
+    series: annotationSeriesSchema.optional(),
+    label: z.string().optional(),
+    tone: annotationToneSchema.optional(),
+    color: z.string().optional(),
+    strokeDasharray: z.string().optional(),
+});
+export const generateChartInputSchema = z.object({
+    type: z.enum(["line", "area", "bar", "pie", "scatter", "radar", "composed"]),
+    title: z.string().optional(),
+    height: z.number().int().min(120).max(600).optional(),
+    xAxisLabel: z.string().optional(),
+    yAxisLabel: z.string().optional(),
+    barLabel: z.string().optional(),
+    lineLabel: z.string().optional(),
+    data: z.array(generateChartDataPointSchema).min(1),
+    annotations: z.array(generateChartAnnotationSchema).optional(),
+    showValueLabels: z.boolean().optional(),
+});

package/dist/components/chart/chart.d.ts

@@ -0,0 +1,44 @@
+import type { ComponentProps, ComponentType, ReactNode } from "react";
+import type { LegendProps } from "recharts";
+import { Legend, ResponsiveContainer, Tooltip } from "recharts";
+export type Theme = "light" | "dark";
+export type Selector = string;
+export declare const themes: Record<Theme, Selector>;
+export type ChartConfig = {
+    [k in string]: {
+        label?: ReactNode;
+        icon?: ComponentType;
+    } & ({
+        color?: string;
+        theme?: never;
+    } | {
+        color?: never;
+        theme: Record<keyof typeof themes, string>;
+    });
+};
+export type ChartContainerProps = ComponentProps<"div"> & {
+    config: ChartConfig;
+    children: ComponentProps<typeof ResponsiveContainer>["children"];
+};
+export declare function ChartContainer(props: ChartContainerProps): import("react/jsx-runtime").JSX.Element;
+export type ChartStyleProps = {
+    id: string;
+    config: ChartConfig;
+};
+export declare function ChartStyle(props: ChartStyleProps): import("react/jsx-runtime").JSX.Element | null;
+export type CHartToolTipContentProps = ComponentProps<typeof Tooltip> & ComponentProps<"div"> & {
+    hideLabel?: boolean;
+    hideIndicator?: boolean;
+    indicator?: "line" | "dot" | "dashed";
+    nameKey?: string;
+    labelKey?: string;
+};
+export declare function ChartTooltipContent(props: CHartToolTipContentProps): import("react/jsx-runtime").JSX.Element | null;
+export type ChartLegendContentProps = ComponentProps<"div"> & Pick<LegendProps, "payload" | "verticalAlign"> & {
+    hideIcon?: boolean;
+    nameKey?: string;
+};
+export declare function ChartLegendContent(props: ChartLegendContentProps): import("react/jsx-runtime").JSX.Element | null;
+export declare const ChartLegend: typeof Legend;
+export declare const ChartTooltip: typeof Tooltip;
+//# sourceMappingURL=chart.d.ts.map

package/dist/components/chart/chart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["../../../src/components/chart/chart.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,aAAa,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAC;AAErF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,mBAAmB,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAGhE,MAAM,MAAM,KAAK,GAAG,OAAO,GAAG,MAAM,CAAC;AAErC,MAAM,MAAM,QAAQ,GAAG,MAAM,CAAC;AAE9B,eAAO,MAAM,MAAM,EAAE,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAgC,CAAC;AAE5E,MAAM,MAAM,WAAW,GAAG;KACvB,CAAC,IAAI,MAAM,GAAG;QACb,KAAK,CAAC,EAAE,SAAS,CAAC;QAClB,IAAI,CAAC,EAAE,aAAa,CAAC;KACtB,GAAG,CAAC;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,KAAK,CAAA;KAAE,GAAG;QAAE,KAAK,CAAC,EAAE,KAAK,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC,MAAM,OAAO,MAAM,EAAE,MAAM,CAAC,CAAA;KAAE,CAAC;CACxG,CAAC;AAkBF,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IACxD,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,EAAE,cAAc,CAAC,OAAO,mBAAmB,CAAC,CAAC,UAAU,CAAC,CAAC;CAClE,CAAC;AAEF,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,2CAsBxD;AAED,MAAM,MAAM,eAAe,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,WAAW,CAAA;CAAE,CAAC;AAElE,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,kDA6BhD;AAED,MAAM,MAAM,wBAAwB,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,GACnE,cAAc,CAAC,KAAK,CAAC,GAAG;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,QAAQ,CAAC;IACtC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEJ,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,kDAsHlE;AAED,MAAM,MAAM,uBAAuB,GAAG,cAAc,CAAC,KAAK,CAAC,GACzD,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,eAAe,CAAC,GAAG;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEJ,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,kDAuChE;AA4BD,eAAO,MAAM,WAAW,eAAS,CAAC;AAClC,eAAO,MAAM,YAAY,gBAAU,CAAC"}

package/dist/components/chart/chart.js

@@ -0,0 +1,119 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { isPresent } from "@manta-eu/lib/present";
+import { createContext, use, useId, useMemo } from "react";
+import { Legend, ResponsiveContainer, Tooltip } from "recharts";
+import { cn } from "#style";
+export const themes = { light: "", dark: ".dark" };
+const ChartContext = createContext(null);
+function useChart() {
+    const context = use(ChartContext);
+    if (!context) {
+        throw new Error("useChart must be used within a <ChartContainer />");
+    }
+    return context;
+}
+export function ChartContainer(props) {
+    const { id, className, children, config, ...otherProps } = props;
+    const uniqueId = useId();
+    const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
+    return (_jsx(ChartContext.Provider, { value: { config }, children: _jsxs("div", { "data-slot": "chart", "data-chart": chartId, className: cn("[&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-muted-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-muted-border [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-muted-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-muted-border flex aspect-video justify-center typography-tiny [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-hidden [&_.recharts-sector]:outline-hidden [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-surface]:outline-hidden", className), ...otherProps, children: [_jsx(ChartStyle, { id: chartId, config: config }), _jsx(ResponsiveContainer, { children: children })] }) }));
+}
+export function ChartStyle(props) {
+    const { id, config } = props;
+    const colorConfig = Object.entries(config).filter(([, config]) => config.theme || config.color);
+    if (!isPresent(colorConfig)) {
+        return null;
+    }
+    return (_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"),
+        } }));
+}
+export function ChartTooltipContent(props) {
+    const { active, payload, className, indicator = "dot", hideLabel = false, hideIndicator = false, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, } = props;
+    const { config } = useChart();
+    const tooltipLabel = useMemo(() => {
+        if (hideLabel || !isPresent(payload)) {
+            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 _jsx("div", { className: cn("typography-small-medium", labelClassName), children: labelFormatter(value, payload) });
+        }
+        if (!value) {
+            return null;
+        }
+        return _jsx("div", { className: cn("typography-small-medium", labelClassName), children: value });
+    }, [label, labelFormatter, payload, hideLabel, labelClassName, config, labelKey]);
+    if (!active || !isPresent(payload)) {
+        return null;
+    }
+    const nestLabel = payload.length === 1 && indicator !== "dot";
+    return (_jsxs("div", { className: cn("border-default-border/50 bg-background text-default-foreground grid min-w-[8rem] items-start gap-1.5 rounded-lg border px-2.5 py-1.5 typography-tiny shadow-xl", className), children: [!nestLabel ? tooltipLabel : null, _jsx("div", { className: "grid gap-1.5", children: payload
+                    .filter((item) => item.type !== "none")
+                    .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 (_jsx("div", { className: cn("[&>svg]:text-muted-foreground flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5", indicator === "dot" && "items-center"), children: formatter && item?.value !== undefined && item.name ? (formatter(item.value, item.name, item, index, item.payload)) : (_jsxs(_Fragment, { children: [itemConfig?.icon ? (_jsx(itemConfig.icon, {})) : (!hideIndicator && (_jsx("div", { className: cn("shrink-0 rounded-[2px] border-(--color-border) bg-(--color-bg)", {
+                                        "size-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,
+                                    } }))), _jsxs("div", { className: cn("flex flex-1 justify-between leading-none", nestLabel ? "items-end" : "items-center"), children: [_jsxs("div", { className: "grid gap-1.5", children: [nestLabel ? tooltipLabel : null, _jsx("span", { className: "text-muted-foreground", children: itemConfig?.label || item.name })] }), item.value && (_jsx("span", { className: "text-default-foreground typography-small-medium font-mono tabular-nums", children: item.value.toLocaleString() }))] })] })) }, item.dataKey));
+                }) })] }));
+}
+export function ChartLegendContent(props) {
+    const { className, hideIcon = false, payload, verticalAlign = "bottom", nameKey } = props;
+    const { config } = useChart();
+    if (!isPresent(payload)) {
+        return null;
+    }
+    return (_jsx("div", { className: cn("flex items-center justify-center gap-4", verticalAlign === "top" ? "pb-3" : "pt-3", className), children: payload
+            .filter((item) => item.type !== "none")
+            .map((item) => {
+            const key = `${nameKey || item.dataKey || "value"}`;
+            const itemConfig = getPayloadConfigFromPayload(config, item, key);
+            return (_jsxs("div", { className: cn("text-default-foreground [&>svg]:text-muted-foreground flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3"), children: [itemConfig?.icon && !hideIcon ? (_jsx(itemConfig.icon, {})) : (_jsx("div", { className: "size-2 shrink-0 rounded-[2px]", style: {
+                            backgroundColor: item.color,
+                        } })), itemConfig?.label] }, item.value));
+        }) }));
+}
+// Helper to extract item config from a payload.
+function getPayloadConfigFromPayload(config, payload, key) {
+    if (typeof payload !== "object" || payload === null) {
+        return undefined;
+    }
+    const payloadPayload = "payload" in payload && typeof payload.payload === "object" && payload.payload !== null
+        ? payload.payload
+        : undefined;
+    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 const ChartLegend = Legend;
+export const ChartTooltip = Tooltip;

package/dist/components/chart/index.d.ts

@@ -0,0 +1,11 @@
+export { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, themes, type CHartToolTipContentProps, type ChartConfig, type ChartContainerProps, type ChartLegendContentProps, type ChartStyleProps, type Selector, type Theme, } from "./chart.js";
+export { chartColorAt } from "./chart-colors.js";
+export { ChartFrame, type ChartFrameProps } from "./ChartFrame.js";
+export { AreaChart, type AreaChartProps } from "./AreaChart.js";
+export { BarChart, type BarChartProps } from "./BarChart.js";
+export { ComposedChart, type ComposedChartProps } from "./ComposedChart.js";
+export { LineChart, type LineChartProps } from "./LineChart.js";
+export { PieChart, type PieChartProps } from "./PieChart.js";
+export { RadarChart, type RadarChartProps } from "./RadarChart.js";
+export { ScatterChart, type ScatterChartProps } from "./ScatterChart.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/chart/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/chart/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,EACd,WAAW,EACX,kBAAkB,EAClB,UAAU,EACV,YAAY,EACZ,mBAAmB,EACnB,MAAM,EACN,KAAK,wBAAwB,EAC7B,KAAK,WAAW,EAChB,KAAK,mBAAmB,EACxB,KAAK,uBAAuB,EAC5B,KAAK,eAAe,EACpB,KAAK,QAAQ,EACb,KAAK,KAAK,GACX,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,YAAY,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACzE,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,YAAY,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/chart/index.js

@@ -0,0 +1,10 @@
+export { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, themes, } from "./chart.js";
+export { chartColorAt } from "./chart-colors.js";
+export { ChartFrame } from "./ChartFrame.js";
+export { AreaChart } from "./AreaChart.js";
+export { BarChart } from "./BarChart.js";
+export { ComposedChart } from "./ComposedChart.js";
+export { LineChart } from "./LineChart.js";
+export { PieChart } from "./PieChart.js";
+export { RadarChart } from "./RadarChart.js";
+export { ScatterChart } from "./ScatterChart.js";

package/dist/components/chat/chat-conversation-starters/index.d.ts

@@ -0,0 +1,20 @@
+export type ConversationStarter = {
+    id: string;
+    title: string;
+};
+export type ConversationStarterGroup = {
+    integration: string;
+    starters: ConversationStarter[];
+};
+export type ChatConversationStartersArgs = {
+    groups?: ConversationStarterGroup[];
+    starters?: ConversationStarter[];
+    isLoading?: boolean;
+    onStarterClick: (starter: ConversationStarter) => void;
+    className?: string;
+};
+export declare function ChatConversationStarters(props: ChatConversationStartersArgs): import("react/jsx-runtime").JSX.Element;
+export declare namespace ChatConversationStarters {
+    var displayName: string;
+}
+//# sourceMappingURL=index.d.ts.map

package/dist/components/chat/chat-conversation-starters/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/chat/chat-conversation-starters/index.tsx"],"names":[],"mappings":"AAwDA,MAAM,MAAM,mBAAmB,GAAG;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACrC,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,mBAAmB,EAAE,CAAC;CACjC,CAAC;AAEF,MAAM,MAAM,4BAA4B,GAAG;IACzC,MAAM,CAAC,EAAE,wBAAwB,EAAE,CAAC;IACpC,QAAQ,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACjC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE,CAAC,OAAO,EAAE,mBAAmB,KAAK,IAAI,CAAC;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,wBAAwB,CAAC,KAAK,EAAE,4BAA4B,2CA4D3E;yBA5De,wBAAwB"}

package/dist/components/chat/chat-conversation-starters/index.js

@@ -0,0 +1,55 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { TrendingUp } from "lucide-react";
+import { tv } from "tailwind-variants";
+import { ChannelIcon } from "#components/channel-icon/index";
+import { Popover, PopoverClose, PopoverContent, PopoverTrigger } from "#components/popover/index";
+import { Skeleton } from "#components/skeleton/index";
+import { cn } from "#style";
+const conversationStartersVariants = tv({
+    base: "flex flex-wrap justify-center gap-2",
+});
+const channelPillVariants = tv({
+    base: [
+        "flex cursor-pointer items-center gap-1.5 rounded-md-v4 border px-3 py-1.5 transition-colors",
+        "border-muted-border bg-input hover:bg-faint hover:border-active-border/50",
+        "data-[state=open]:border-active-border data-[state=open]:bg-faint",
+    ],
+});
+const starterRowVariants = tv({
+    base: [
+        "flex w-full cursor-pointer items-center gap-3 rounded-md-v4 px-3 py-2.5 text-left",
+        "hover:bg-muted transition-colors",
+    ],
+});
+const integrationConfigMap = {
+    general: { icon: null, label: "General", priority: 1 },
+    meta: { icon: "META", label: "Meta", priority: 2 },
+    google: { icon: "GOOGLE_ADS", label: "Google", priority: 3 },
+    shopify: { icon: "SHOPIFY", label: "Shopify", priority: 4 },
+    snapchat: { icon: "SNAPCHAT", label: "Snapchat", priority: 5 },
+};
+function compareByIntegrationPriority(a, b) {
+    return ((integrationConfigMap[a.integration]?.priority ?? Infinity) -
+        (integrationConfigMap[b.integration]?.priority ?? Infinity));
+}
+function StarterIcon(props) {
+    const { config, className } = props;
+    if (!config)
+        return null;
+    if (config.icon)
+        return _jsx(ChannelIcon, { channel: config.icon, rounded: true, className: className });
+    return _jsx(TrendingUp, { className: cn("shrink-0", className) });
+}
+export function ChatConversationStarters(props) {
+    const { groups = [], starters, isLoading, onStarterClick, className } = props;
+    if (isLoading) {
+        return (_jsx("div", { className: cn(conversationStartersVariants(), className), children: [1, 2, 3].map((index) => (_jsx(Skeleton, { className: "h-8 w-24 rounded-md-v4" }, index))) }));
+    }
+    if (starters && starters.length > 0) {
+        return (_jsx("div", { className: cn("flex flex-col gap-1", className), children: starters.map((starter) => (_jsx("button", { type: "button", onClick: () => onStarterClick(starter), className: starterRowVariants(), title: starter.title, children: _jsx("span", { className: "typography-small text-default-foreground", children: starter.title }) }, starter.id))) }));
+    }
+    const sortedGroups = [...groups].sort(compareByIntegrationPriority);
+    return (_jsx("div", { className: cn(conversationStartersVariants(), className), children: sortedGroups.map((group) => (_jsxs(Popover, { children: [_jsxs(PopoverTrigger, { className: channelPillVariants(), children: [_jsx(StarterIcon, { config: integrationConfigMap[group.integration], className: "size-4" }), _jsx("span", { className: "typography-small-semibold", children: integrationConfigMap[group.integration]?.label })] }), _jsx(PopoverContent, { align: "center", className: "w-auto max-w-sm p-1", children: group.starters.map((starter) => (_jsx(PopoverClose, { asChild: true, children: _jsxs("button", { type: "button", onClick: () => onStarterClick(starter), className: starterRowVariants(), title: starter.title, children: [_jsx(StarterIcon, { config: integrationConfigMap[group.integration], className: "size-5" }), _jsx("span", { className: "typography-small text-default-foreground", children: starter.title })] }) }, starter.id))) })] }, group.integration))) }));
+}
+ChatConversationStarters.displayName = "ChatConversationStarters";

package/dist/components/chat/chat-input/index.d.ts

@@ -0,0 +1,50 @@
+import { type ChangeEvent, type ComponentType, type ReactNode, type RefObject } from "react";
+export type RejectedFile = {
+    file: File;
+    reason: string;
+};
+export type ChatInputProps = {
+    children: ReactNode;
+    topContent?: ReactNode;
+    onSubmit?: (_value: string, _files: File[]) => void | Promise<void>;
+    onRejected?: (_files: RejectedFile[]) => void;
+    className?: string;
+    dropTargetRef?: RefObject<HTMLElement | null>;
+    /** Read once, on mount. Re-seed with a React `key`. */
+    initialValue?: string;
+};
+export declare function ChatInput(props: ChatInputProps): import("react/jsx-runtime").JSX.Element;
+export type ChatInputActionsProps = {
+    icon: ComponentType<{
+        className?: string;
+    }>;
+    "aria-label": string;
+    className?: string;
+    onClick?: () => void;
+};
+export declare function ChatInputActions(props: ChatInputActionsProps): import("react/jsx-runtime").JSX.Element;
+export declare const ChatInputTextarea: import("react").ForwardRefExoticComponent<Omit<Omit<import("react-textarea-autosize").TextareaAutosizeProps & import("react").RefAttributes<HTMLTextAreaElement>, "ref">, "value" | "ref" | "onChange"> & {
+    className?: string;
+    onChange?: (_e: ChangeEvent<HTMLTextAreaElement>) => void;
+} & import("react").RefAttributes<HTMLTextAreaElement>>;
+export type ChatInputSubmitProps = {
+    icon: ComponentType<{
+        className?: string;
+    }>;
+    "aria-label": string;
+    disabled?: boolean;
+    isLoading?: boolean;
+    isDisabled?: boolean;
+    className?: string;
+    stopGeneration?: () => void;
+};
+export declare function ChatInputSubmit(props: ChatInputSubmitProps): import("react/jsx-runtime").JSX.Element;
+export type ChatInputAttachButtonProps = {
+    className?: string;
+};
+export declare function ChatInputAttachButton(props: ChatInputAttachButtonProps): import("react/jsx-runtime").JSX.Element;
+export type ChatInputFilePreviewProps = {
+    progress?: Record<string, number>;
+};
+export declare function ChatInputFilePreview(props: ChatInputFilePreviewProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/chat/chat-input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/chat/chat-input/index.tsx"],"names":[],"mappings":"AAMA,OAAO,EAQL,KAAK,WAAW,EAEhB,KAAK,aAAa,EAGlB,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AA6Bf,MAAM,MAAM,YAAY,GAAG;IACzB,IAAI,EAAE,IAAI,CAAC;IACX,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAuFF,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,EAAE,SAAS,CAAC;IACpB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACpE,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,EAAE,KAAK,IAAI,CAAC;IAC9C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC9C,uDAAuD;IACvD,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAMF,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,2CA2G9C;AAED,MAAM,MAAM,qBAAqB,GAAG;IAClC,IAAI,EAAE,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC5C,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,2CAc5D;AAOD,eAAO,MAAM,iBAAiB;gBAJhB,MAAM;eACP,CAAC,EAAE,EAAE,WAAW,CAAC,mBAAmB,CAAC,KAAK,IAAI;uDAoD1D,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,IAAI,EAAE,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC5C,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B,CAAC;AAEF,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,2CAoC1D;AAED,MAAM,MAAM,0BAA0B,GAAG;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,2CAmCtE;AA6ED,MAAM,MAAM,yBAAyB,GAAG;IACtC,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACnC,CAAC;AAIF,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,yBAAyB,kDA6DpE"}