@updog/data-editor-wc 0.1.45 → 0.1.46

package/index.d.ts

@@ -109,6 +109,7 @@ declare var export_default = {
     modal: {
       importTitle: "Import Data",
       editTitle: "Edit Data",
+      viewTitle: "View Data",
     },
     confirmClose: {
       title: "Discard changes?",
@@ -1148,7 +1149,7 @@ type RemoteSource = {
  * - `"editor"` — opens directly into the spreadsheet grid.
  * - `"uploader"` — opens the file import wizard first, then transitions to the grid.
  */
-type DataEditorVariant = "editor" | "uploader";
+type DataEditorVariant = "editor" | "uploader" | "viewer";
 /** Base configuration shared by the public `DataEditorProps` and the internal provider. */
 type DataEditorBaseProps<TRow extends DataEditorRow = DataEditorRow> = {
     /** Column definitions. Each entry describes one column in the grid. */

package/index.js

@@ -8097,7 +8097,8 @@ var e = Object.create, t = Object.defineProperty, n = Object.getOwnPropertyDescr
 	dataEditor: {
 		modal: {
 			importTitle: "Import Data",
-			editTitle: "Edit Data"
+			editTitle: "Edit Data",
+			viewTitle: "View Data"
 		},
 		confirmClose: {
 			title: "Discard changes?",
@@ -29868,6 +29869,7 @@ function Xm({ columns: e, primaryKey: t, loadData: n, scaleClient: r, onComplete
 		setPendingImportFile: ve,
 		openUploaderWithFile: ye,
 		variant: a ?? "editor",
+		isViewer: a === "viewer",
 		search: ne,
 		setSearch: re,
 		matchCase: ie,
@@ -29883,7 +29885,7 @@ function Xm({ columns: e, primaryKey: t, loadData: n, scaleClient: r, onComplete
 		resetScrollRef: z,
 		scrollToGridTop: B,
 		portalRef: me,
-		readonly: _ ?? !1,
+		readonly: a === "viewer" ? !0 : _ ?? !1,
 		filtersResetKey: de,
 		resetFilters: fe,
 		originalColumns: e,
@@ -31766,7 +31768,7 @@ var kg = 9, Ag = 3, jg = [3, 2], Mg = 1, Ng = 6, Pg = .8, Fg = .5, Ig = 4, Lg =
 	paintHeaderCell(e, t, n) {
 		let { ctx: r, theme: i, layout: a, textCache: o, columns: s, controller: c, sortState: l } = e, u = c.selection, d = a.pinnedCount, f = a.rtl, p = a.getColumnX(t, n), m = a.getColumnWidth(t), h = a.contentToCanvasX(p, m);
 		u.isColumnSelected(t) ? (r.fillStyle = i.headerBgSelected, ag(r, h, 0, m, 36)) : u.isColumnHighlighted(t) && (r.fillStyle = i.headerBgActive, ag(r, h, 0, m, 36));
-		let g = s[t], _ = t < d, v = l?.columnId === g.id, y = e.store.isColumnLocked(g.id), b = 0;
+		let g = s[t], _ = t < d, v = l?.columnId === g.id, y = !c.readonly && e.store.isColumnLocked(g.id), b = 0;
 		y && b++, _ && b++, v && b++;
 		let x = b > 0 ? b * 14 + (b - 1) * Ng + Ng : 0, S = m - kg * 2 - x;
 		r.font = i.headerFont, r.fillStyle = i.headerContentIdle;
@@ -45475,39 +45477,39 @@ var sj = ({ text: e, onSelect: t }) => /* @__PURE__ */ (0, O.jsx)(at, {
 		/* @__PURE__ */ (0, O.jsx)(pj, {})
 	]
 }) }), gj = () => {
-	let { store: e, columns: t, chat: n, enableAddRow: r, readonly: i, navigateToCell: a, importFormats: o, openUploaderWithFile: s } = $m(), { rowCount: c, filteredCount: l, isLoading: u } = ed(e), { t: d } = j(), f = !u && l === 0, p = r && !i && c === 0, m = o !== !1 && o.length > 0, h = (0, y.useCallback)(async () => {
-		a(await sh(e, t, d("dataEditor.dataSources.manuallyAdded")), t[0].id);
+	let { store: e, columns: t, chat: n, enableAddRow: r, readonly: i, isViewer: a, navigateToCell: o, importFormats: s, openUploaderWithFile: c } = $m(), { rowCount: l, filteredCount: u, isLoading: d } = ed(e), { t: f } = j(), p = !d && u === 0, m = r && !i && l === 0, h = s !== !1 && s.length > 0, g = (0, y.useCallback)(async () => {
+		o(await sh(e, t, f("dataEditor.dataSources.manuallyAdded")), t[0].id);
 	}, [
 		e,
 		t,
-		a,
-		d
-	]), g = (0, y.useMemo)(() => {
-		if (p) return {
-			content: d("dataEditor.dataSources.addRow"),
+		o,
+		f
+	]), _ = (0, y.useMemo)(() => {
+		if (m) return {
+			content: f("dataEditor.dataSources.addRow"),
 			startIcon: /* @__PURE__ */ (0, O.jsx)(Ae, { size: "1rem" }),
 			variant: "filled",
-			onClick: h
+			onClick: g
 		};
 	}, [
-		p,
-		h,
-		d
-	]), _ = (0, y.useMemo)(() => th(o === !1 ? [] : o), [o]), v = (0, y.useCallback)((e) => {
+		m,
+		g,
+		f
+	]), v = (0, y.useMemo)(() => th(s === !1 ? [] : s), [s]), b = (0, y.useCallback)((e) => {
 		let t = e[0];
-		t && s(t);
-	}, [s]), { getRootProps: b, isDragActive: x } = Xu({
-		accept: _,
+		t && c(t);
+	}, [c]), { getRootProps: x, isDragActive: S } = Xu({
+		accept: v,
 		maxFiles: 1,
 		noClick: !0,
 		noKeyboard: !0,
-		disabled: i || !m,
-		onDrop: v
+		disabled: i || !h,
+		onDrop: b
 	});
 	return /* @__PURE__ */ (0, O.jsx)(ah, { children: /* @__PURE__ */ (0, O.jsxs)("div", {
-		...b({ className: "updog__data-editor-inner" }),
+		...x({ className: "updog__data-editor-inner" }),
 		children: [
-			/* @__PURE__ */ (0, O.jsx)(nh, { children: /* @__PURE__ */ (0, O.jsx)("div", {
+			!a && /* @__PURE__ */ (0, O.jsx)(nh, { children: /* @__PURE__ */ (0, O.jsx)("div", {
 				className: "updog__data-editor-aside",
 				children: /* @__PURE__ */ (0, O.jsxs)("div", {
 					className: "updog__data-editor-aside__content updog__scrollbar",
@@ -45521,18 +45523,18 @@ var sj = ({ text: e, onSelect: t }) => /* @__PURE__ */ (0, O.jsx)(at, {
 			/* @__PURE__ */ (0, O.jsxs)(rh, { children: [
 				/* @__PURE__ */ (0, O.jsxs)("div", {
 					className: "updog__data-editor-grid-area",
-					children: [/* @__PURE__ */ (0, O.jsx)(TA, {}), f && /* @__PURE__ */ (0, O.jsx)(ac, {
+					children: [/* @__PURE__ */ (0, O.jsx)(TA, {}), p && /* @__PURE__ */ (0, O.jsx)(ac, {
 						className: "updog-grid__empty-state",
-						title: d("dataEditor.grid.emptyTitle"),
-						text: d("dataEditor.grid.emptyText"),
-						buttonProps: g
+						title: f("dataEditor.grid.emptyTitle"),
+						text: f("dataEditor.grid.emptyText"),
+						buttonProps: _
 					})]
 				}),
 				/* @__PURE__ */ (0, O.jsx)(oh, {}),
-				/* @__PURE__ */ (0, O.jsx)(Yh, {})
+				!a && /* @__PURE__ */ (0, O.jsx)(Yh, {})
 			] }),
-			x && /* @__PURE__ */ (0, O.jsx)(ih, {}),
-			n && /* @__PURE__ */ (0, O.jsx)(hj, {})
+			S && /* @__PURE__ */ (0, O.jsx)(ih, {}),
+			n && !a && /* @__PURE__ */ (0, O.jsx)(hj, {})
 		]
 	}) });
 }, _j = "RENDER_ERROR", vj = (e) => {
@@ -48207,7 +48209,7 @@ function _N(e) {
 		g,
 		v,
 		e.readonly
-	]), x = (0, y.useCallback)(() => v?.(), [v]), S = n(f ? "dataEditor.modal.importTitle" : "dataEditor.modal.editTitle");
+	]), x = (0, y.useCallback)(() => v?.(), [v]), S = f ? n("dataEditor.modal.importTitle") : e.variant === "viewer" ? n("dataEditor.modal.viewTitle") : n("dataEditor.modal.editTitle");
 	(0, y.useEffect)(() => {
 		t === "modal" && !o && p(e.variant === "uploader");
 	}, [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@updog/data-editor-wc",
-  "version": "0.1.45",
+  "version": "0.1.46",
   "description": "Client-side CSV importer and spreadsheet editor as a Web Component. Drop into Vue, Angular, Svelte, or vanilla JS. Import CSV, Excel, JSON; edit 1M+ rows entirely in the browser.",
   "author": "Mikhail Kutateladze <admin@updog.tech>",
   "homepage": "https://updog.tech",