@ai-matrx/design-system 0.20.2 → 0.20.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +20 -0
- package/dist/content-transfer.cjs +35 -15
- package/dist/content-transfer.cjs.map +1 -1
- package/dist/content-transfer.css +10 -2
- package/dist/content-transfer.js +35 -15
- package/dist/content-transfer.js.map +1 -1
- package/dist/data-table/data-row-inspector.cjs +60 -14
- package/dist/data-table/data-row-inspector.cjs.map +1 -1
- package/dist/data-table/data-row-inspector.js +60 -14
- package/dist/data-table/data-row-inspector.js.map +1 -1
- package/dist/data-table/data-row-window.cjs +60 -14
- package/dist/data-table/data-row-window.cjs.map +1 -1
- package/dist/data-table/data-row-window.js +60 -14
- package/dist/data-table/data-row-window.js.map +1 -1
- package/dist/data-table/index.cjs +67 -46
- package/dist/data-table/index.cjs.map +1 -1
- package/dist/data-table/index.js +67 -46
- package/dist/data-table/index.js.map +1 -1
- package/dist/styles.css +1 -19
- package/package.json +1 -1
|
@@ -1196,7 +1196,7 @@ var useContentTransferCapabilities = () => React9.useContext(CapabilityContext);
|
|
|
1196
1196
|
var SurfaceContext = React9.createContext(null);
|
|
1197
1197
|
function MenuPresentation({ label, hint, icon: Icon2 }) {
|
|
1198
1198
|
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
|
|
1199
|
-
Icon2 ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Icon2, { className: "matrx-alchemy-menu-icon" }) :
|
|
1199
|
+
Icon2 ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Icon2, { className: "matrx-alchemy-menu-icon" }) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PaletteGlyph, { file: true }),
|
|
1200
1200
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { children: [
|
|
1201
1201
|
label,
|
|
1202
1202
|
hint ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("small", { className: "matrx-alchemy-menu-hint", children: hint }) : null
|
|
@@ -1218,8 +1218,11 @@ function DestinationPresentation({ action }) {
|
|
|
1218
1218
|
};
|
|
1219
1219
|
const path = paths[action.id.replace(/^matrx:/, "")];
|
|
1220
1220
|
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
|
|
1221
|
-
|
|
1222
|
-
/* @__PURE__ */ (0, import_jsx_runtime13.
|
|
1221
|
+
action.icon ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(action.icon, { className: "matrx-alchemy-menu-icon" }) : path ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { className: "matrx-alchemy-palette-glyph", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: path }) }) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PaletteGlyph, { file: true }),
|
|
1222
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { children: [
|
|
1223
|
+
action.label,
|
|
1224
|
+
action.hint ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("small", { className: "matrx-alchemy-menu-hint", children: action.hint }) : null
|
|
1225
|
+
] })
|
|
1223
1226
|
] });
|
|
1224
1227
|
}
|
|
1225
1228
|
function ReceiptLink({ target }) {
|
|
@@ -1229,6 +1232,11 @@ function ReceiptLink({ target }) {
|
|
|
1229
1232
|
] }) : null;
|
|
1230
1233
|
}
|
|
1231
1234
|
function PaletteGlyph({ format, ai = false, file = false, kind }) {
|
|
1235
|
+
if (kind === "link") return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { className: "matrx-alchemy-palette-glyph", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M10 13a5 5 0 0 0 7 0l3-3a5 5 0 0 0-7-7l-2 2M14 11a5 5 0 0 0-7 0l-3 3a5 5 0 0 0 7 7l2-2" }) });
|
|
1236
|
+
if (kind === "surface") return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("svg", { className: "matrx-alchemy-palette-glyph", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
|
|
1237
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
|
|
1238
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M3 9h18M9 9v12" })
|
|
1239
|
+
] });
|
|
1232
1240
|
if (kind === "ai-copy") return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("svg", { className: "matrx-alchemy-palette-glyph", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
|
|
1233
1241
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("rect", { x: "5", y: "5", width: "11", height: "14", rx: "2" }),
|
|
1234
1242
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "M9 3h6a2 2 0 0 1 2 2v10" }),
|
|
@@ -1709,7 +1717,7 @@ function ContentTransferMenuSession({ references = [], referenceActions = [], so
|
|
|
1709
1717
|
const presentation = options.action;
|
|
1710
1718
|
const Icon2 = presentation?.icon;
|
|
1711
1719
|
const fallbackLabel = options.file && !/^download\b/i.test(label2) ? `Download ${label2}` : label2;
|
|
1712
|
-
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("button", { type: "button", className: "matrx-alchemy-palette-tile", "aria-label": presentation?.ariaLabel ?? (presentation ? fallbackLabel : options.ariaLabel ?? `${resolvedMode === "copy" ? "Copy" : "Download"} ${label2}`), onClick: () => {
|
|
1720
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("button", { type: "button", className: "matrx-alchemy-palette-tile", title: id === "table-data" ? "JSON using column display names" : id === "table-schema" ? "Table schema and rows" : label2, "aria-label": presentation?.ariaLabel ?? (presentation ? fallbackLabel : options.ariaLabel ?? `${resolvedMode === "copy" ? "Copy" : "Download"} ${label2}`), onClick: () => {
|
|
1713
1721
|
closePalette();
|
|
1714
1722
|
onClick();
|
|
1715
1723
|
}, children: [
|
|
@@ -1771,7 +1779,7 @@ function ContentTransferMenuSession({ references = [], referenceActions = [], so
|
|
|
1771
1779
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PaletteGlyph, { kind: "ai-copy" }),
|
|
1772
1780
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { children: [
|
|
1773
1781
|
"Copy with AI context",
|
|
1774
|
-
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("small", { className: "matrx-alchemy-menu-hint", children: "
|
|
1782
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("small", { className: "matrx-alchemy-menu-hint", children: "Include source context" })
|
|
1775
1783
|
] })
|
|
1776
1784
|
] }) : null, items: quickVariants("ai"), onRun: (variant) => {
|
|
1777
1785
|
closePalette();
|
|
@@ -1784,32 +1792,44 @@ function ContentTransferMenuSession({ references = [], referenceActions = [], so
|
|
|
1784
1792
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PaletteGlyph, { kind: "sliders" }),
|
|
1785
1793
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { children: [
|
|
1786
1794
|
"Prepare for AI",
|
|
1787
|
-
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("small", { className: "matrx-alchemy-menu-hint", children: "
|
|
1795
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("small", { className: "matrx-alchemy-menu-hint", children: "Trim, edit or summarize" })
|
|
1788
1796
|
] })
|
|
1789
1797
|
] }) })
|
|
1790
1798
|
] }) : null,
|
|
1791
1799
|
prepareAvailable && (nearestWorkspaceKey || variants.length) ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PaletteRows, { title: "Other sources", items: [], extra: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
|
|
1792
|
-
nearestWorkspaceKey && nearestSurface ? /* @__PURE__ */ (0, import_jsx_runtime13.
|
|
1800
|
+
nearestWorkspaceKey && nearestSurface ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("button", { type: "button", className: "matrx-alchemy-palette-row", onClick: () => {
|
|
1793
1801
|
closePalette();
|
|
1794
1802
|
void openWorkspace(nearestWorkspaceKey, { source: nearestSurface, label: nearestSurface.surfaceName });
|
|
1795
|
-
}, children:
|
|
1803
|
+
}, children: [
|
|
1804
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PaletteGlyph, { kind: "surface" }),
|
|
1805
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children: "Prepare this page" })
|
|
1806
|
+
] }) : null,
|
|
1796
1807
|
variants.map((variant) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { type: "button", className: "matrx-alchemy-palette-row", "aria-label": variant.ariaLabel, onClick: () => {
|
|
1797
1808
|
closePalette();
|
|
1798
1809
|
void openWorkspace(variantWorkspaceKeys.get(variant.id), variant);
|
|
1799
1810
|
}, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(MenuPresentation, { ...variant, label: `Prepare ${variant.label}` }) }, variant.id))
|
|
1800
1811
|
] }) }) : null,
|
|
1801
1812
|
references.length || referenceActions.length ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("section", { className: "matrx-alchemy-palette-section", children: [
|
|
1802
|
-
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("h3", { children: "
|
|
1803
|
-
/* @__PURE__ */ (0, import_jsx_runtime13.
|
|
1804
|
-
|
|
1805
|
-
|
|
1813
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("h3", { children: "References" }),
|
|
1814
|
+
referenceActions.map((action) => /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("button", { type: "button", className: "matrx-alchemy-palette-row", onClick: () => void openReference(action), children: [
|
|
1815
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PaletteGlyph, { kind: "link" }),
|
|
1816
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children: action.label }),
|
|
1817
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { className: "matrx-alchemy-disclosure", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "m6 4 4 4-4 4" }) })
|
|
1818
|
+
] }, action.id)),
|
|
1819
|
+
references.map((reference) => /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("button", { type: "button", className: "matrx-alchemy-palette-row", title: "Copies a reference to saved data", onClick: () => void copyReference(reference), children: [
|
|
1820
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PaletteGlyph, { kind: "link" }),
|
|
1821
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children: reference.label })
|
|
1822
|
+
] }, reference.id))
|
|
1806
1823
|
] }) : null,
|
|
1807
1824
|
["save", "chat", "email", "other"].map((group) => {
|
|
1808
1825
|
const entries = ordinaryActions.filter((action) => (action.group ?? "other") === group);
|
|
1809
1826
|
return entries.length ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("details", { className: "matrx-alchemy-palette-destinations", children: [
|
|
1810
1827
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("summary", { children: [
|
|
1811
1828
|
group === "save" ? "Save to Matrx" : group === "chat" ? "Continue with AI" : group === "email" ? "Email to me" : "Actions",
|
|
1812
|
-
/* @__PURE__ */ (0, import_jsx_runtime13.
|
|
1829
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { className: "matrx-alchemy-disclosure-meta", children: [
|
|
1830
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children: entries.length }),
|
|
1831
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("svg", { className: "matrx-alchemy-disclosure", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("path", { d: "m6 4 4 4-4 4" }) })
|
|
1832
|
+
] })
|
|
1813
1833
|
] }),
|
|
1814
1834
|
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { children: entries.map((action) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { type: "button", className: "matrx-alchemy-palette-row", "aria-label": action.ariaLabel, onClick: () => {
|
|
1815
1835
|
closePalette();
|
|
@@ -3178,6 +3198,32 @@ function isUuidValue(value) {
|
|
|
3178
3198
|
return typeof value === "string" && /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(value);
|
|
3179
3199
|
}
|
|
3180
3200
|
|
|
3201
|
+
// src/data-table/filter-engine.ts
|
|
3202
|
+
function stringifyCellValue(value) {
|
|
3203
|
+
if (value == null) return "";
|
|
3204
|
+
if (typeof value === "string") return value;
|
|
3205
|
+
if (typeof value === "number" || typeof value === "boolean") {
|
|
3206
|
+
return String(value);
|
|
3207
|
+
}
|
|
3208
|
+
if (value instanceof Date) return value.toISOString();
|
|
3209
|
+
try {
|
|
3210
|
+
return JSON.stringify(value);
|
|
3211
|
+
} catch {
|
|
3212
|
+
return String(value);
|
|
3213
|
+
}
|
|
3214
|
+
}
|
|
3215
|
+
|
|
3216
|
+
// src/data-table/display-value.ts
|
|
3217
|
+
function formatTableDisplayValue(value) {
|
|
3218
|
+
if (typeof value === "number") return value.toLocaleString(void 0, { maximumFractionDigits: 12 });
|
|
3219
|
+
if (value instanceof Date) return value.toLocaleString();
|
|
3220
|
+
if (typeof value === "string" && /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}/.test(value) && !Number.isNaN(Date.parse(value))) {
|
|
3221
|
+
return new Date(value).toLocaleString();
|
|
3222
|
+
}
|
|
3223
|
+
if (typeof value === "boolean") return value ? "Yes" : "No";
|
|
3224
|
+
return stringifyCellValue(value) || "\u2014";
|
|
3225
|
+
}
|
|
3226
|
+
|
|
3181
3227
|
// src/data-table/DataRowInspector.tsx
|
|
3182
3228
|
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
3183
3229
|
var noFieldToken = () => null;
|
|
@@ -3250,7 +3296,7 @@ function DataRowInspector({
|
|
|
3250
3296
|
key
|
|
3251
3297
|
);
|
|
3252
3298
|
}
|
|
3253
|
-
const formatted = formatValue(value);
|
|
3299
|
+
const formatted = value !== null && typeof value === "object" && !(value instanceof Date) ? formatValue(value) : formatTableDisplayValue(value);
|
|
3254
3300
|
const multiline = formatted.includes("\n") || formatted.length > 80;
|
|
3255
3301
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
3256
3302
|
"div",
|