@icanbwell/baileyai-chat-ui 0.3.2 → 0.3.3

package/dist/chart.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require("react"),t=require("react/jsx-runtime"),n=require("@mui/material"),r=require("chart.js"),i=require("react-chartjs-2");r.Chart.register(r.CategoryScale,r.LinearScale,r.PointElement,r.LineElement,r.BarElement,r.ArcElement,r.Title,r.Tooltip,r.Legend,r.BarController,r.LineController,r.PieController,r.DoughnutController,r.ScatterController);var a=[`#2563eb`,`#16a34a`,`#7c3aed`,`#ea580c`,`#0d9488`,`#db2777`,`#4b5563`,`#ca8a04`],o=[`#60a5fa`,`#4ade80`,`#a78bfa`,`#fb923c`,`#2dd4bf`,`#f472b6`,`#d1d5db`,`#fbbf24`],s=({spec:r,isDarkMode:s=!1,palette:c})=>{let l=c??(s?o:a),u=r.type===`pie`||r.type===`doughnut`,d=(0,e.useMemo)(()=>({labels:r.data.labels,datasets:r.data.datasets.map((e,t)=>({label:e.label,data:e.data,backgroundColor:u?e.data.map((e,t)=>l[t%l.length]):l[t%l.length],borderColor:u?void 0:l[t%l.length]}))}),[r,u,l]),f=(0,e.useMemo)(()=>({responsive:!0,maintainAspectRatio:!1,plugins:{title:{display:!!r.title,text:r.title},legend:{display:r.data.datasets.length>1||u}}}),[r.title,r.data.datasets.length,u]);return(0,t.jsx)(n.Box,{sx:{my:1,height:300},children:(0,t.jsx)(i.Chart,{type:r.type,data:d,options:f})})};exports.BaileyChart=s,exports.DEFAULT_DARK_PALETTE=o,exports.DEFAULT_LIGHT_PALETTE=a;

package/dist/chart.d.ts

@@ -0,0 +1,36 @@
+import { JSX } from 'react';
+
+export declare const BaileyChart: ({ spec, isDarkMode, palette }: BaileyChartProps) => JSX.Element;
+
+declare interface BaileyChartDataset {
+    label: string;
+    data: number[] | Array<{
+        x: number;
+        y: number;
+    }>;
+}
+
+export declare interface BaileyChartProps {
+    spec: BaileyChartSpec;
+    isDarkMode?: boolean;
+    /** Overrides the built-in default palette. Cycled by dataset index (or by pie/doughnut slice
+     *  index for a sliced chart) the same way a host's own brand palette would be. */
+    palette?: string[];
+}
+
+declare interface BaileyChartSpec {
+    type: BaileyChartType;
+    title?: string;
+    data: {
+        labels?: string[];
+        datasets: BaileyChartDataset[];
+    };
+}
+
+declare type BaileyChartType = 'bar' | 'line' | 'pie' | 'doughnut' | 'scatter';
+
+export declare const DEFAULT_DARK_PALETTE: string[];
+
+export declare const DEFAULT_LIGHT_PALETTE: string[];
+
+export { }

package/dist/chart.js

@@ -0,0 +1,67 @@
+import { useMemo as e } from "react";
+import { jsx as t } from "react/jsx-runtime";
+import { Box as n } from "@mui/material";
+import { ArcElement as r, BarController as i, BarElement as a, CategoryScale as o, Chart as s, DoughnutController as c, Legend as l, LineController as u, LineElement as d, LinearScale as f, PieController as p, PointElement as m, ScatterController as h, Title as g, Tooltip as _ } from "chart.js";
+import { Chart as v } from "react-chartjs-2";
+//#region src/ui/BaileyChart.tsx
+s.register(o, f, m, d, a, r, g, _, l, i, u, p, c, h);
+var y = [
+	"#2563eb",
+	"#16a34a",
+	"#7c3aed",
+	"#ea580c",
+	"#0d9488",
+	"#db2777",
+	"#4b5563",
+	"#ca8a04"
+], b = [
+	"#60a5fa",
+	"#4ade80",
+	"#a78bfa",
+	"#fb923c",
+	"#2dd4bf",
+	"#f472b6",
+	"#d1d5db",
+	"#fbbf24"
+], x = ({ spec: r, isDarkMode: i = !1, palette: a }) => {
+	let o = a ?? (i ? b : y), s = r.type === "pie" || r.type === "doughnut", c = e(() => ({
+		labels: r.data.labels,
+		datasets: r.data.datasets.map((e, t) => ({
+			label: e.label,
+			data: e.data,
+			backgroundColor: s ? e.data.map((e, t) => o[t % o.length]) : o[t % o.length],
+			borderColor: s ? void 0 : o[t % o.length]
+		}))
+	}), [
+		r,
+		s,
+		o
+	]), l = e(() => ({
+		responsive: !0,
+		maintainAspectRatio: !1,
+		plugins: {
+			title: {
+				display: !!r.title,
+				text: r.title
+			},
+			legend: { display: r.data.datasets.length > 1 || s }
+		}
+	}), [
+		r.title,
+		r.data.datasets.length,
+		s
+	]);
+	return /* @__PURE__ */ t(n, {
+		sx: {
+			my: 1,
+			height: 300
+		},
+		children: /* @__PURE__ */ t(v, {
+			type: r.type,
+			data: c,
+			options: l
+		})
+	});
+};
+//#endregion
+export { x as BaileyChart, b as DEFAULT_DARK_PALETTE, y as DEFAULT_LIGHT_PALETTE };

package/dist/safeMarkdownUrl-DsMPGzpD.cjs

@@ -0,0 +1 @@
+var e=/^(https?|mailto):/i,t=e=>e.replace(/[\t\n\r]/g,``).trim(),n=n=>{let r=t(n);return!/^[a-z][a-z0-9+.-]*:/i.test(r)||e.test(r)};Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return n}});

package/dist/safeMarkdownUrl-xI42YYzd.js

@@ -0,0 +1,7 @@
+//#region src/utils/safeMarkdownUrl.ts
+var e = /^(https?|mailto):/i, t = (e) => e.replace(/[\t\n\r]/g, "").trim(), n = (n) => {
+	let r = t(n);
+	return !/^[a-z][a-z0-9+.-]*:/i.test(r) || e.test(r);
+};
+//#endregion
+export { n as t };

package/dist/table.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./safeMarkdownUrl-DsMPGzpD.cjs");let t=require("react"),n=require("react/jsx-runtime"),r=require("@mui/material"),i=require("ag-grid-react"),a=require("ag-grid-community");a.ModuleRegistry.registerModules([a.ColumnAutoSizeModule,a.ColumnHoverModule,a.RowAutoHeightModule,a.RowStyleModule,a.TooltipModule,a.TextFilterModule,a.NumberFilterModule,a.ClientSideRowModelModule]);var o={resizable:!0,sortable:!0,filter:!0},s=t=>{let i=t.colDef?.field?t.data?.[`${t.colDef.field}Href`]:void 0;return typeof i!=`string`||!e.t(i)?(0,n.jsx)(n.Fragment,{children:t.value}):(0,n.jsx)(r.Link,{href:i,target:`_blank`,rel:`noopener noreferrer`,children:t.value})},c=e=>e.trim()!==``&&Number.isFinite(Number(e)),l=({headers:e,rows:l,theme:u=a.themeBalham})=>{let{columnDefs:d,rowData:f}=(0,t.useMemo)(()=>{let t=e.map((e,t)=>l.some(e=>e[t]?.href)),n=e.map((e,n)=>{if(t[n])return!1;let r=l.map(e=>e[n]).filter(e=>!!e?.text.trim());return r.length>0&&r.every(e=>c(e.text))});return{columnDefs:e.map((e,r)=>({headerName:e,field:`col${r}`,...n[r]?{cellDataType:`number`}:{},...t[r]?{cellRenderer:s}:{}})),rowData:l.map(e=>e.reduce((e,t,r)=>{let i=`col${r}`,a=t.text.trim()===``;return e[i]=n[r]?a?null:Number(t.text):t.text,t.href&&(e[`${i}Href`]=t.href),e},{}))}},[e,l]);return(0,n.jsx)(r.Box,{sx:{width:`100%`,my:1},children:(0,n.jsx)(i.AgGridReact,{theme:u,columnDefs:d,rowData:f,defaultColDef:o,domLayout:`autoHeight`})})};exports.BaileyTable=l;

package/dist/table.d.ts

@@ -0,0 +1,20 @@
+import { JSX } from 'react';
+import { Theme } from 'ag-grid-community';
+
+export declare const BaileyTable: ({ headers, rows, theme }: BaileyTableProps) => JSX.Element;
+
+declare interface BaileyTableCell {
+    text: string;
+    href?: string;
+}
+
+export declare interface BaileyTableProps {
+    headers: string[];
+    rows: BaileyTableCell[][];
+    /** ag-grid Theming-API Theme object. Defaults to the stock themeBalham (no brand params) —
+     *  a host with its own brand theme passes it here instead of this component reading any
+     *  theme context of its own. */
+    theme?: Theme;
+}
+
+export { }

package/dist/table.js

@@ -0,0 +1,65 @@
+import { t as e } from "./safeMarkdownUrl-xI42YYzd.js";
+import { useMemo as t } from "react";
+import { Fragment as n, jsx as r } from "react/jsx-runtime";
+import { Box as i, Link as a } from "@mui/material";
+import { AgGridReact as o } from "ag-grid-react";
+import { ClientSideRowModelModule as s, ColumnAutoSizeModule as c, ColumnHoverModule as l, ModuleRegistry as u, NumberFilterModule as d, RowAutoHeightModule as f, RowStyleModule as p, TextFilterModule as m, TooltipModule as h, themeBalham as g } from "ag-grid-community";
+//#region src/ui/BaileyTable.tsx
+u.registerModules([
+	c,
+	l,
+	f,
+	p,
+	h,
+	m,
+	d,
+	s
+]);
+var _ = {
+	resizable: !0,
+	sortable: !0,
+	filter: !0
+}, v = (t) => {
+	let i = t.colDef?.field ? t.data?.[`${t.colDef.field}Href`] : void 0;
+	return typeof i != "string" || !e(i) ? /* @__PURE__ */ r(n, { children: t.value }) : /* @__PURE__ */ r(a, {
+		href: i,
+		target: "_blank",
+		rel: "noopener noreferrer",
+		children: t.value
+	});
+}, y = (e) => e.trim() !== "" && Number.isFinite(Number(e)), b = ({ headers: e, rows: n, theme: a = g }) => {
+	let { columnDefs: s, rowData: c } = t(() => {
+		let t = e.map((e, t) => n.some((e) => e[t]?.href)), r = e.map((e, r) => {
+			if (t[r]) return !1;
+			let i = n.map((e) => e[r]).filter((e) => !!e?.text.trim());
+			return i.length > 0 && i.every((e) => y(e.text));
+		});
+		return {
+			columnDefs: e.map((e, n) => ({
+				headerName: e,
+				field: `col${n}`,
+				...r[n] ? { cellDataType: "number" } : {},
+				...t[n] ? { cellRenderer: v } : {}
+			})),
+			rowData: n.map((e) => e.reduce((e, t, n) => {
+				let i = `col${n}`, a = t.text.trim() === "";
+				return e[i] = r[n] ? a ? null : Number(t.text) : t.text, t.href && (e[`${i}Href`] = t.href), e;
+			}, {}))
+		};
+	}, [e, n]);
+	return /* @__PURE__ */ r(i, {
+		sx: {
+			width: "100%",
+			my: 1
+		},
+		children: /* @__PURE__ */ r(o, {
+			theme: a,
+			columnDefs: s,
+			rowData: c,
+			defaultColDef: _,
+			domLayout: "autoHeight"
+		})
+	});
+};
+//#endregion
+export { b as BaileyTable };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@icanbwell/baileyai-chat-ui",
-  "version": "0.3.2",
+  "version": "0.3.3",
   "description": "Shared React chat UI and streaming logic for Bailey, the icanbwell AI assistant",
   "license": "Apache-2.0",
   "repository": {
@@ -24,7 +24,17 @@
       "import": "./dist/baileyai-chat-ui.js",
       "require": "./dist/baileyai-chat-ui.cjs"
     },
-    "./styles.css": "./dist/baileyai-chat-ui.css"
+    "./styles.css": "./dist/baileyai-chat-ui.css",
+    "./table": {
+      "types": "./dist/table.d.ts",
+      "import": "./dist/table.js",
+      "require": "./dist/table.cjs"
+    },
+    "./chart": {
+      "types": "./dist/chart.d.ts",
+      "import": "./dist/chart.js",
+      "require": "./dist/chart.cjs"
+    }
   },
   "files": [
     "dist"
@@ -43,16 +53,49 @@
     "lint": "eslint \"src/**/*.{ts,tsx}\" \"dev/**/*.{ts,tsx}\" \"vite.config.ts\" \"*.js\""
   },
   "peerDependencies": {
+    "@emotion/react": "^11.0.0",
+    "@emotion/styled": "^11.0.0",
+    "@mui/material": "^9.0.0",
+    "ag-grid-community": "^35.0.0",
+    "ag-grid-react": "^35.0.0",
+    "chart.js": "^4.0.0",
     "react": "^19.0.0",
+    "react-chartjs-2": "^5.0.0",
     "react-dom": "^19.0.0"
   },
+  "peerDependenciesMeta": {
+    "@emotion/react": {
+      "optional": true
+    },
+    "@emotion/styled": {
+      "optional": true
+    },
+    "@mui/material": {
+      "optional": true
+    },
+    "ag-grid-community": {
+      "optional": true
+    },
+    "ag-grid-react": {
+      "optional": true
+    },
+    "chart.js": {
+      "optional": true
+    },
+    "react-chartjs-2": {
+      "optional": true
+    }
+  },
   "dependencies": {
     "@radix-ui/react-tooltip": "^1.1.8",
     "react-markdown": "^10.1.0",
     "remark-gfm": "^4.0.1"
   },
   "devDependencies": {
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.1",
     "@eslint/js": "^9",
+    "@mui/material": "^9.0.1",
     "@tailwindcss/postcss": "^4.3.3",
     "@testing-library/dom": "^10.0.0",
     "@testing-library/jest-dom": "^7.0.1",
@@ -61,13 +104,17 @@
     "@types/react": "^19.2.17",
     "@types/react-dom": "^19.2.3",
     "@vitejs/plugin-react": "^4.3.4",
+    "ag-grid-community": "^35.3.0",
+    "ag-grid-react": "^35.3.0",
     "autoprefixer": "^10.5.0",
+    "chart.js": "^4.5.1",
     "eslint": "^9.39.1",
     "eslint-plugin-react-hooks": "^7.1.1",
     "eslint-plugin-react-refresh": "^0.5.4",
     "jsdom": "^29.1.1",
     "postcss": "^8.5.23",
     "react": "^19.2.7",
+    "react-chartjs-2": "^5.3.1",
     "react-dom": "^19.2.7",
     "tailwindcss": "^4.3.1",
     "typescript": "^6.0.3",