@rebasepro/ui 0.24.0 → 0.24.1-canary.gcb918fc

package/dist/views/CollectionView/DefaultCellRenderer.es.js

@@ -0,0 +1,302 @@
+import { cls } from "../../util/cls.es.js";
+import { iconSize } from "../../icons/Icon.es.js";
+import { BooleanSwitch } from "../../components/BooleanSwitch.es.js";
+import { Typography } from "../../components/Typography.es.js";
+import { Chip } from "../../components/Chip.es.js";
+import { Tooltip } from "../../components/Tooltip.es.js";
+import { Markdown } from "../../components/Markdown.es.js";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ImageIcon } from "lucide-react";
+//#region src/views/CollectionView/DefaultCellRenderer.tsx
+/**
+* Resolve an enum key to its display label and optional color.
+*/
+function resolveEnumLabel(enumValues, value) {
+	if (!enumValues) return void 0;
+	const key = String(value);
+	if (enumValues instanceof Map) {
+		const config = enumValues.get(value);
+		if (!config) return void 0;
+		if (typeof config === "string") return { label: config };
+		return {
+			label: config.label,
+			color: config.color
+		};
+	}
+	const config = enumValues[key];
+	if (!config) return void 0;
+	if (typeof config === "string") return { label: config };
+	return {
+		label: config.label,
+		color: config.color
+	};
+}
+/**
+* Format a date value using Intl.DateTimeFormat.
+*/
+function formatDate(value, includeTime) {
+	if (value == null) return "—";
+	const date = value instanceof Date ? value : new Date(String(value));
+	if (isNaN(date.getTime())) return String(value);
+	const options = includeTime ? {
+		year: "numeric",
+		month: "short",
+		day: "numeric",
+		hour: "2-digit",
+		minute: "2-digit"
+	} : {
+		year: "numeric",
+		month: "short",
+		day: "numeric"
+	};
+	return new Intl.DateTimeFormat(void 0, options).format(date);
+}
+/**
+* Type guard for geopoint-like objects.
+*/
+function isGeoPoint(value) {
+	if (typeof value !== "object" || value === null) return false;
+	const obj = value;
+	return typeof obj.lat === "number" && typeof obj.lng === "number";
+}
+/**
+* Default cell renderer for the headless CollectionView.
+* Handles all built-in property types without depending on any Rebase core types.
+*
+* @group Preview components
+*/
+function DefaultCellRenderer({ row, propertyKey, property, value, size, width, height }) {
+	if (value === null || value === void 0) return /* @__PURE__ */ jsx(Typography, {
+		variant: "body2",
+		color: "secondary",
+		className: "px-1",
+		children: "—"
+	});
+	if (property.Preview) {
+		const PreviewComponent = property.Preview;
+		return /* @__PURE__ */ jsx(PreviewComponent, {
+			row,
+			propertyKey,
+			property,
+			value,
+			size,
+			width,
+			height
+		});
+	}
+	switch (property.type) {
+		case "string": return renderString(property, value);
+		case "number": return renderNumber(property, value);
+		case "boolean": return renderBoolean(value);
+		case "date": return renderDate(property, value);
+		case "array": return renderArray(property, value);
+		case "map": return renderMap(value);
+		case "reference":
+		case "relation": return renderReference(value);
+		case "geopoint": return renderGeopoint(value);
+		default: return /* @__PURE__ */ jsx(Typography, {
+			variant: "body2",
+			color: "secondary",
+			noWrap: true,
+			className: "px-1",
+			children: JSON.stringify(value)
+		});
+	}
+}
+function renderString(property, value) {
+	const strValue = String(value);
+	if (property.enum) {
+		const resolved = resolveEnumLabel(property.enum, value);
+		return /* @__PURE__ */ jsx(Chip, {
+			size: "small",
+			colorScheme: resolved?.color ? {
+				color: resolved.color,
+				text: "#fff"
+			} : void 0,
+			children: resolved?.label ?? strValue
+		});
+	}
+	if (property.previewAsTag) return /* @__PURE__ */ jsx(Chip, {
+		size: "small",
+		children: strValue
+	});
+	if (property.url) return /* @__PURE__ */ jsx(Typography, {
+		variant: "body2",
+		noWrap: true,
+		component: "a",
+		href: typeof property.url === "string" ? property.url : strValue,
+		target: "_blank",
+		rel: "noopener noreferrer",
+		className: cls("px-1 text-primary hover:underline cursor-pointer"),
+		children: strValue
+	});
+	if (property.email) return /* @__PURE__ */ jsx(Typography, {
+		variant: "body2",
+		noWrap: true,
+		component: "a",
+		href: `mailto:${strValue}`,
+		className: cls("px-1 text-primary hover:underline cursor-pointer"),
+		children: strValue
+	});
+	if (property.markdown) return /* @__PURE__ */ jsx("div", {
+		className: "px-1 max-h-[100px] overflow-hidden",
+		children: /* @__PURE__ */ jsx(Markdown, {
+			source: strValue,
+			size: "small"
+		})
+	});
+	if (property.storage) return /* @__PURE__ */ jsxs("div", {
+		className: cls("px-1 flex items-center justify-center", "w-[40px] h-[40px] rounded overflow-hidden"),
+		children: [strValue ? /* @__PURE__ */ jsx("img", {
+			src: strValue,
+			alt: "",
+			className: "w-full h-full object-cover",
+			onError: (e) => {
+				const target = e.currentTarget;
+				target.style.display = "none";
+				const fallback = target.nextElementSibling;
+				if (fallback instanceof HTMLElement) fallback.style.display = "flex";
+			}
+		}) : null, /* @__PURE__ */ jsx("div", {
+			className: cls("w-full h-full items-center justify-center rounded", "bg-surface-raised text-text-secondary dark:text-text-secondary-dark", strValue ? "hidden" : "flex"),
+			children: /* @__PURE__ */ jsx(ImageIcon, { size: iconSize.small })
+		})]
+	});
+	return /* @__PURE__ */ jsx(Tooltip, {
+		title: strValue.length > 50 ? strValue : void 0,
+		side: "bottom",
+		children: /* @__PURE__ */ jsx(Typography, {
+			variant: "body2",
+			noWrap: true,
+			className: "px-1",
+			children: strValue
+		})
+	});
+}
+function renderNumber(property, value) {
+	const numStr = String(value);
+	if (property.enum) {
+		const resolved = resolveEnumLabel(property.enum, value);
+		return /* @__PURE__ */ jsx(Chip, {
+			size: "small",
+			colorScheme: resolved?.color ? {
+				color: resolved.color,
+				text: "#fff"
+			} : void 0,
+			children: resolved?.label ?? numStr
+		});
+	}
+	return /* @__PURE__ */ jsx(Typography, {
+		variant: "body2",
+		noWrap: true,
+		align: "right",
+		className: "px-1 tabular-nums",
+		children: numStr
+	});
+}
+function renderBoolean(value) {
+	return /* @__PURE__ */ jsx("div", {
+		className: "px-1 flex items-center",
+		children: /* @__PURE__ */ jsx(BooleanSwitch, {
+			value: !!value,
+			size: "small",
+			disabled: true
+		})
+	});
+}
+function renderDate(property, value) {
+	return /* @__PURE__ */ jsx(Typography, {
+		variant: "body2",
+		noWrap: true,
+		className: "px-1 tabular-nums",
+		children: formatDate(value, property.mode === "date_time")
+	});
+}
+function renderArray(property, value) {
+	if (!Array.isArray(value)) return /* @__PURE__ */ jsx(Typography, {
+		variant: "body2",
+		color: "secondary",
+		className: "px-1",
+		children: "—"
+	});
+	if (property.of?.enum && value.length > 0) return /* @__PURE__ */ jsx("div", {
+		className: "px-1 flex flex-wrap gap-1 overflow-hidden",
+		children: value.map((item, i) => {
+			const resolved = resolveEnumLabel(property.of.enum, item);
+			return /* @__PURE__ */ jsx(Chip, {
+				size: "smallest",
+				colorScheme: resolved?.color ? {
+					color: resolved.color,
+					text: "#fff"
+				} : void 0,
+				children: resolved?.label ?? String(item)
+			}, i);
+		})
+	});
+	if (value.length > 0 && value.every((item) => typeof item === "string")) return /* @__PURE__ */ jsx(Typography, {
+		variant: "body2",
+		noWrap: true,
+		className: "px-1",
+		children: value.join(", ")
+	});
+	return /* @__PURE__ */ jsxs(Typography, {
+		variant: "body2",
+		color: "secondary",
+		className: "px-1",
+		children: [
+			value.length,
+			" ",
+			value.length === 1 ? "item" : "items"
+		]
+	});
+}
+function renderMap(value) {
+	if (typeof value !== "object" || value === null) return /* @__PURE__ */ jsx(Typography, {
+		variant: "body2",
+		color: "secondary",
+		className: "px-1",
+		children: "—"
+	});
+	const fieldCount = Object.keys(value).length;
+	return /* @__PURE__ */ jsxs(Typography, {
+		variant: "body2",
+		color: "secondary",
+		className: "px-1",
+		children: [
+			fieldCount,
+			" ",
+			fieldCount === 1 ? "field" : "fields"
+		]
+	});
+}
+function renderReference(value) {
+	return /* @__PURE__ */ jsx(Typography, {
+		variant: "body2",
+		noWrap: true,
+		className: "px-1",
+		children: String(value)
+	});
+}
+function renderGeopoint(value) {
+	if (isGeoPoint(value)) return /* @__PURE__ */ jsxs(Typography, {
+		variant: "body2",
+		noWrap: true,
+		className: "px-1 tabular-nums",
+		children: [
+			value.lat.toFixed(6),
+			", ",
+			value.lng.toFixed(6)
+		]
+	});
+	return /* @__PURE__ */ jsx(Typography, {
+		variant: "body2",
+		color: "secondary",
+		className: "px-1",
+		children: String(value)
+	});
+}
+//#endregion
+export { DefaultCellRenderer };
+
+//# sourceMappingURL=DefaultCellRenderer.es.js.map

package/dist/views/CollectionView/DefaultCellRenderer.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultCellRenderer.es.js","names":[],"sources":["../../../src/views/CollectionView/DefaultCellRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { ImageIcon } from \"lucide-react\";\nimport { cls } from \"../../util\";\nimport { Typography } from \"../../components/Typography\";\nimport { Chip } from \"../../components/Chip\";\nimport { BooleanSwitch } from \"../../components/BooleanSwitch\";\nimport { Markdown } from \"../../components/Markdown\";\nimport { Tooltip } from \"../../components/Tooltip\";\nimport { iconSize } from \"../../icons\";\nimport type { CellRendererProps, CollectionPropertyConfig, CollectionEnumValueConfig } from \"./CollectionViewTypes\";\n\n// ——— Helpers ———\n\n/**\n * Resolve an enum key to its display label and optional color.\n */\nfunction resolveEnumLabel(\n    enumValues: CollectionPropertyConfig[\"enum\"],\n    value: unknown\n): { label: string; color?: string } | undefined {\n    if (!enumValues) return undefined;\n    const key = String(value);\n    if (enumValues instanceof Map) {\n        const config: CollectionEnumValueConfig | undefined = enumValues.get(value as string | number);\n        if (!config) return undefined;\n        if (typeof config === \"string\") return { label: config };\n        return { label: config.label, color: config.color };\n    }\n    const config: CollectionEnumValueConfig | undefined = enumValues[key];\n    if (!config) return undefined;\n    if (typeof config === \"string\") return { label: config };\n    return { label: config.label, color: config.color };\n}\n\n/**\n * Format a date value using Intl.DateTimeFormat.\n */\nfunction formatDate(value: unknown, includeTime: boolean): string {\n    if (value == null) return \"—\";\n    const date = value instanceof Date ? value : new Date(String(value));\n    if (isNaN(date.getTime())) return String(value);\n\n    const options: Intl.DateTimeFormatOptions = includeTime\n        ? { year: \"numeric\", month: \"short\", day: \"numeric\", hour: \"2-digit\", minute: \"2-digit\" }\n        : { year: \"numeric\", month: \"short\", day: \"numeric\" };\n\n    return new Intl.DateTimeFormat(undefined, options).format(date);\n}\n\n/**\n * Type guard for geopoint-like objects.\n */\nfunction isGeoPoint(value: unknown): value is { lat: number; lng: number } {\n    if (typeof value !== \"object\" || value === null) return false;\n    const obj = value as Record<string, unknown>;\n    return typeof obj.lat === \"number\" && typeof obj.lng === \"number\";\n}\n\n// ——— Component ———\n\n/**\n * Default cell renderer for the headless CollectionView.\n * Handles all built-in property types without depending on any Rebase core types.\n *\n * @group Preview components\n */\nexport function DefaultCellRenderer({\n    row,\n    propertyKey,\n    property,\n    value,\n    size,\n    width,\n    height\n}: CellRendererProps) {\n\n    // 1. Null / undefined → em-dash\n    if (value === null || value === undefined) {\n        return (\n            <Typography variant=\"body2\"\n                        color=\"secondary\"\n                        className=\"px-1\">\n                —\n            </Typography>\n        );\n    }\n\n    // 2. Custom Preview component override\n    if (property.Preview) {\n        const PreviewComponent = property.Preview;\n        return (\n            <PreviewComponent\n                row={row}\n                propertyKey={propertyKey}\n                property={property}\n                value={value}\n                size={size}\n                width={width}\n                height={height}\n            />\n        );\n    }\n\n    // ——— Type-specific renderers ———\n\n    switch (property.type) {\n        case \"string\":\n            return renderString(property, value);\n\n        case \"number\":\n            return renderNumber(property, value);\n\n        case \"boolean\":\n            return renderBoolean(value);\n\n        case \"date\":\n            return renderDate(property, value);\n\n        case \"array\":\n            return renderArray(property, value);\n\n        case \"map\":\n            return renderMap(value);\n\n        case \"reference\":\n        case \"relation\":\n            return renderReference(value);\n\n        case \"geopoint\":\n            return renderGeopoint(value);\n\n        default:\n            return (\n                <Typography variant=\"body2\"\n                            color=\"secondary\"\n                            noWrap\n                            className=\"px-1\">\n                    {JSON.stringify(value)}\n                </Typography>\n            );\n    }\n}\n\n// ——— Per-type render functions ———\n\nfunction renderString(property: CollectionPropertyConfig, value: unknown): React.ReactElement {\n    const strValue = String(value);\n\n    // Enum → Chip\n    if (property.enum) {\n        const resolved = resolveEnumLabel(property.enum, value);\n        return (\n            <Chip size=\"small\"\n                  colorScheme={resolved?.color ? { color: resolved.color, text: \"#fff\" } : undefined}>\n                {resolved?.label ?? strValue}\n            </Chip>\n        );\n    }\n\n    // Preview as tag → Chip\n    if (property.previewAsTag) {\n        return (\n            <Chip size=\"small\">\n                {strValue}\n            </Chip>\n        );\n    }\n\n    // URL → clickable link\n    if (property.url) {\n        const href = typeof property.url === \"string\" ? property.url : strValue;\n        return (\n            <Typography variant=\"body2\"\n                        noWrap\n                        component=\"a\"\n                        href={href}\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        className={cls(\n                            \"px-1 text-primary hover:underline cursor-pointer\"\n                        )}>\n                {strValue}\n            </Typography>\n        );\n    }\n\n    // Email → mailto link\n    if (property.email) {\n        return (\n            <Typography variant=\"body2\"\n                        noWrap\n                        component=\"a\"\n                        href={`mailto:${strValue}`}\n                        className={cls(\n                            \"px-1 text-primary hover:underline cursor-pointer\"\n                        )}>\n                {strValue}\n            </Typography>\n        );\n    }\n\n    // Markdown → rendered markdown\n    if (property.markdown) {\n        return (\n            <div className=\"px-1 max-h-[100px] overflow-hidden\">\n                <Markdown source={strValue} size=\"small\" />\n            </div>\n        );\n    }\n\n    // Storage → image preview with fallback\n    if (property.storage) {\n        return (\n            <div className={cls(\n                \"px-1 flex items-center justify-center\",\n                \"w-[40px] h-[40px] rounded overflow-hidden\"\n            )}>\n                {strValue ? (\n                    <img\n                        src={strValue}\n                        alt=\"\"\n                        className=\"w-full h-full object-cover\"\n                        onError={(e) => {\n                            const target = e.currentTarget;\n                            target.style.display = \"none\";\n                            const fallback = target.nextElementSibling;\n                            if (fallback instanceof HTMLElement) {\n                                fallback.style.display = \"flex\";\n                            }\n                        }}\n                    />\n                ) : null}\n                <div className={cls(\n                    \"w-full h-full items-center justify-center rounded\",\n                    \"bg-surface-raised text-text-secondary dark:text-text-secondary-dark\",\n                    strValue ? \"hidden\" : \"flex\"\n                )}>\n                    <ImageIcon size={iconSize.small} />\n                </div>\n            </div>\n        );\n    }\n\n    // Default string → truncated text\n    return (\n        <Tooltip title={strValue.length > 50 ? strValue : undefined}\n                 side=\"bottom\">\n            <Typography variant=\"body2\"\n                        noWrap\n                        className=\"px-1\">\n                {strValue}\n            </Typography>\n        </Tooltip>\n    );\n}\n\nfunction renderNumber(property: CollectionPropertyConfig, value: unknown): React.ReactElement {\n    const numStr = String(value);\n\n    // Enum → Chip\n    if (property.enum) {\n        const resolved = resolveEnumLabel(property.enum, value);\n        return (\n            <Chip size=\"small\"\n                  colorScheme={resolved?.color ? { color: resolved.color, text: \"#fff\" } : undefined}>\n                {resolved?.label ?? numStr}\n            </Chip>\n        );\n    }\n\n    // Default → right-aligned\n    return (\n        <Typography variant=\"body2\"\n                    noWrap\n                    align=\"right\"\n                    className=\"px-1 tabular-nums\">\n            {numStr}\n        </Typography>\n    );\n}\n\nfunction renderBoolean(value: unknown): React.ReactElement {\n    return (\n        <div className=\"px-1 flex items-center\">\n            <BooleanSwitch value={!!value}\n                           size=\"small\"\n                           disabled />\n        </div>\n    );\n}\n\nfunction renderDate(property: CollectionPropertyConfig, value: unknown): React.ReactElement {\n    const includeTime = property.mode === \"date_time\";\n    const formatted = formatDate(value, includeTime);\n\n    return (\n        <Typography variant=\"body2\"\n                    noWrap\n                    className=\"px-1 tabular-nums\">\n            {formatted}\n        </Typography>\n    );\n}\n\nfunction renderArray(property: CollectionPropertyConfig, value: unknown): React.ReactElement {\n    if (!Array.isArray(value)) {\n        return (\n            <Typography variant=\"body2\"\n                        color=\"secondary\"\n                        className=\"px-1\">\n                —\n            </Typography>\n        );\n    }\n\n    // Array of enum values → row of chips\n    if (property.of?.enum && value.length > 0) {\n        return (\n            <div className=\"px-1 flex flex-wrap gap-1 overflow-hidden\">\n                {value.map((item, i) => {\n                    const resolved = resolveEnumLabel(property.of!.enum, item);\n                    return (\n                        <Chip key={i}\n                              size=\"smallest\"\n                              colorScheme={resolved?.color ? { color: resolved.color, text: \"#fff\" } : undefined}>\n                            {resolved?.label ?? String(item)}\n                        </Chip>\n                    );\n                })}\n            </div>\n        );\n    }\n\n    // Array of strings → comma-separated\n    if (value.length > 0 && value.every((item) => typeof item === \"string\")) {\n        return (\n            <Typography variant=\"body2\"\n                        noWrap\n                        className=\"px-1\">\n                {(value as string[]).join(\", \")}\n            </Typography>\n        );\n    }\n\n    // Generic array → item count\n    return (\n        <Typography variant=\"body2\"\n                    color=\"secondary\"\n                    className=\"px-1\">\n            {value.length} {value.length === 1 ? \"item\" : \"items\"}\n        </Typography>\n    );\n}\n\nfunction renderMap(value: unknown): React.ReactElement {\n    if (typeof value !== \"object\" || value === null) {\n        return (\n            <Typography variant=\"body2\"\n                        color=\"secondary\"\n                        className=\"px-1\">\n                —\n            </Typography>\n        );\n    }\n\n    const fieldCount = Object.keys(value as Record<string, unknown>).length;\n    return (\n        <Typography variant=\"body2\"\n                    color=\"secondary\"\n                    className=\"px-1\">\n            {fieldCount} {fieldCount === 1 ? \"field\" : \"fields\"}\n        </Typography>\n    );\n}\n\nfunction renderReference(value: unknown): React.ReactElement {\n    return (\n        <Typography variant=\"body2\"\n                    noWrap\n                    className=\"px-1\">\n            {String(value)}\n        </Typography>\n    );\n}\n\nfunction renderGeopoint(value: unknown): React.ReactElement {\n    if (isGeoPoint(value)) {\n        return (\n            <Typography variant=\"body2\"\n                        noWrap\n                        className=\"px-1 tabular-nums\">\n                {value.lat.toFixed(6)}, {value.lng.toFixed(6)}\n            </Typography>\n        );\n    }\n\n    return (\n        <Typography variant=\"body2\"\n                    color=\"secondary\"\n                    className=\"px-1\">\n            {String(value)}\n        </Typography>\n    );\n}\n"],"mappings":"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"}

package/dist/views/CollectionView/resolveTitleProperty.es.js

@@ -0,0 +1,56 @@
+//#region src/views/CollectionView/resolveTitleProperty.ts
+/**
+* Pick the property that acts as a row's title.
+*
+* Headless mirror of the ranking in `@rebasepro/common`: identifiers are kept
+* out of the title slot structurally (the id property, images, hidden fields),
+* and among what is left a plain text field beats a description, an enum or a
+* relation. Falls back to the id property only when a collection has nothing
+* else to show.
+*/
+function resolveTitlePropertyKey(order, properties, idProperty, titleProperty) {
+	if (titleProperty) return titleProperty;
+	const SCORE = {
+		RELATION: 10,
+		LONG_TEXT: 20,
+		ENUM: 30,
+		EMAIL: 45,
+		PLAIN_TEXT: 60,
+		NAMED: 100
+	};
+	const titleLikeKeys = /* @__PURE__ */ new Set([
+		"name",
+		"fullname",
+		"displayname",
+		"title",
+		"label",
+		"heading",
+		"subject",
+		"username",
+		"nickname"
+	]);
+	let best;
+	order.forEach((key) => {
+		const property = properties[key];
+		if (!property || property.hideFromCollection) return;
+		if (key === idProperty) return;
+		if (property.storage || property.url === "image") return;
+		let score;
+		if (property.type === "relation" || property.type === "reference") score = SCORE.RELATION;
+		else if (property.type !== "string") return;
+		else if (property.enum) score = SCORE.ENUM;
+		else if (property.multiline || property.markdown) score = SCORE.LONG_TEXT;
+		else if (property.email) score = SCORE.EMAIL;
+		else if (titleLikeKeys.has(key.toLowerCase().replace(/[^a-z0-9]/g, ""))) score = SCORE.NAMED;
+		else score = SCORE.PLAIN_TEXT;
+		if (!best || score > best.score) best = {
+			key,
+			score
+		};
+	});
+	return best?.key ?? idProperty;
+}
+//#endregion
+export { resolveTitlePropertyKey };
+
+//# sourceMappingURL=resolveTitleProperty.es.js.map

package/dist/views/CollectionView/resolveTitleProperty.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveTitleProperty.es.js","names":[],"sources":["../../../src/views/CollectionView/resolveTitleProperty.ts"],"sourcesContent":["import type { CollectionPropertyConfig } from \"./CollectionViewTypes\";\n\n/**\n * Pick the property that acts as a row's title.\n *\n * Headless mirror of the ranking in `@rebasepro/common`: identifiers are kept\n * out of the title slot structurally (the id property, images, hidden fields),\n * and among what is left a plain text field beats a description, an enum or a\n * relation. Falls back to the id property only when a collection has nothing\n * else to show.\n */\nexport function resolveTitlePropertyKey(\n    order: string[],\n    properties: Record<string, CollectionPropertyConfig>,\n    idProperty: string,\n    titleProperty?: string\n): string {\n    if (titleProperty) return titleProperty;\n\n    const SCORE = {\n        RELATION: 10,\n        LONG_TEXT: 20,\n        ENUM: 30,\n        EMAIL: 45,\n        PLAIN_TEXT: 60,\n        NAMED: 100\n    };\n    const titleLikeKeys = new Set([\"name\", \"fullname\", \"displayname\", \"title\", \"label\", \"heading\", \"subject\", \"username\", \"nickname\"]);\n\n    let best: { key: string; score: number } | undefined;\n\n    order.forEach(key => {\n        const property = properties[key];\n        if (!property || property.hideFromCollection) return;\n        if (key === idProperty) return;\n        if (property.storage || property.url === \"image\") return;\n\n        let score: number;\n        if (property.type === \"relation\" || property.type === \"reference\") score = SCORE.RELATION;\n        else if (property.type !== \"string\") return;\n        else if (property.enum) score = SCORE.ENUM;\n        else if (property.multiline || property.markdown) score = SCORE.LONG_TEXT;\n        else if (property.email) score = SCORE.EMAIL;\n        else if (titleLikeKeys.has(key.toLowerCase().replace(/[^a-z0-9]/g, \"\"))) score = SCORE.NAMED;\n        else score = SCORE.PLAIN_TEXT;\n\n        if (!best || score > best.score) best = { key,\nscore };\n    });\n\n    return best?.key ?? idProperty;\n}\n"],"mappings":";;;;;;;;;;AAWA,SAAgB,wBACZ,OACA,YACA,YACA,eACM;CACN,IAAI,eAAe,OAAO;CAE1B,MAAM,QAAQ;EACV,UAAU;EACV,WAAW;EACX,MAAM;EACN,OAAO;EACP,YAAY;EACZ,OAAO;CACX;CACA,MAAM,gCAAgB,IAAI,IAAI;EAAC;EAAQ;EAAY;EAAe;EAAS;EAAS;EAAW;EAAW;EAAY;CAAU,CAAC;CAEjI,IAAI;CAEJ,MAAM,SAAQ,QAAO;EACjB,MAAM,WAAW,WAAW;EAC5B,IAAI,CAAC,YAAY,SAAS,oBAAoB;EAC9C,IAAI,QAAQ,YAAY;EACxB,IAAI,SAAS,WAAW,SAAS,QAAQ,SAAS;EAElD,IAAI;EACJ,IAAI,SAAS,SAAS,cAAc,SAAS,SAAS,aAAa,QAAQ,MAAM;OAC5E,IAAI,SAAS,SAAS,UAAU;OAChC,IAAI,SAAS,MAAM,QAAQ,MAAM;OACjC,IAAI,SAAS,aAAa,SAAS,UAAU,QAAQ,MAAM;OAC3D,IAAI,SAAS,OAAO,QAAQ,MAAM;OAClC,IAAI,cAAc,IAAI,IAAI,YAAY,CAAC,CAAC,QAAQ,cAAc,EAAE,CAAC,GAAG,QAAQ,MAAM;OAClF,QAAQ,MAAM;EAEnB,IAAI,CAAC,QAAQ,QAAQ,KAAK,OAAO,OAAO;GAAE;GAClD;EAAM;CACF,CAAC;CAED,OAAO,MAAM,OAAO;AACxB"}

package/dist/views/CollectionView/utils.es.js

@@ -0,0 +1,19 @@
+//#region src/views/CollectionView/utils.ts
+/**
+* Traverse an object by dot-separated path.
+* Returns `undefined` if any segment is missing.
+*/
+function getValueInPath(obj, path) {
+	if (!obj) return void 0;
+	const parts = path.split(".");
+	let current = obj;
+	for (const part of parts) {
+		if (current === null || current === void 0 || typeof current !== "object") return void 0;
+		current = current[part];
+	}
+	return current;
+}
+//#endregion
+export { getValueInPath };
+
+//# sourceMappingURL=utils.es.js.map

package/dist/views/CollectionView/utils.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.es.js","names":[],"sources":["../../../src/views/CollectionView/utils.ts"],"sourcesContent":["/**\n * Traverse an object by dot-separated path.\n * Returns `undefined` if any segment is missing.\n */\nexport function getValueInPath(obj: Record<string, unknown> | undefined, path: string): unknown {\n    if (!obj) return undefined;\n    const parts = path.split(\".\");\n    let current: unknown = obj;\n    for (const part of parts) {\n        if (current === null || current === undefined || typeof current !== \"object\") return undefined;\n        current = (current as Record<string, unknown>)[part];\n    }\n    return current;\n}\n"],"mappings":";;;;;AAIA,SAAgB,eAAe,KAA0C,MAAuB;CAC5F,IAAI,CAAC,KAAK,OAAO,KAAA;CACjB,MAAM,QAAQ,KAAK,MAAM,GAAG;CAC5B,IAAI,UAAmB;CACvB,KAAK,MAAM,QAAQ,OAAO;EACtB,IAAI,YAAY,QAAQ,YAAY,KAAA,KAAa,OAAO,YAAY,UAAU,OAAO,KAAA;EACrF,UAAW,QAAoC;CACnD;CACA,OAAO;AACX"}

package/dist/views/Kanban/Board.es.js

@@ -0,0 +1,237 @@
+import { cls } from "../../util/cls.es.js";
+import { BoardColumn } from "./BoardColumn.es.js";
+import { placeDroppedCard } from "./placement.es.js";
+import { useEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { createPortal } from "react-dom";
+import { SortableContext, arrayMove } from "@dnd-kit/sortable";
+import { DndContext, DragOverlay, PointerSensor, closestCorners, useSensor, useSensors } from "@dnd-kit/core";
+//#region src/views/Kanban/Board.tsx
+function Board({ data, columns: columnsProp, columnLabels, columnColors, className, assignColumn, allowColumnReorder = false, onColumnReorder, onItemsReorder, ItemComponent, columnLoadingState, onLoadMoreColumn, onAddItemToColumn, AddColumnComponent }) {
+	const [activeItem, setActiveItem] = useState(null);
+	const [isDragging, setIsDragging] = useState(false);
+	const [dragOverColumnId, setDragOverColumnId] = useState(null);
+	/**
+	* Which column the card was picked up from.
+	*
+	* `handleDragOver` moves the card between columns in `itemMapState` while
+	* the pointer is still down — that is what makes the gap open up under the
+	* cursor. So by the time the drop is handled, looking the card up by id
+	* finds it in its *destination*, and the board was reporting the move as
+	* source === target: a cross-column drop looked like a plain reorder and
+	* the column property was never written. The card snapped back on the next
+	* fetch.
+	*/
+	const dragSourceColumnRef = useRef(null);
+	const [itemMapState, setItemMapState] = useState(() => {
+		const dataColumnMap = data.reduce((prev, item) => ({
+			...prev,
+			[item.id]: assignColumn(item)
+		}), {});
+		return columnsProp.reduce((previous, column) => ({
+			...previous,
+			[column]: data.filter((item) => dataColumnMap[item.id] === column)
+		}), {});
+	});
+	const sensors = useSensors(useSensor(PointerSensor, { activationConstraint: { distance: 5 } }));
+	useEffect(() => {
+		if (isDragging) return;
+		const dataColumnMap = data.reduce((prev, item) => ({
+			...prev,
+			[item.id]: assignColumn(item)
+		}), {});
+		const newItemMap = columnsProp.reduce((previous, column) => ({
+			...previous,
+			[column]: data.filter((item) => dataColumnMap[item.id] === column)
+		}), {});
+		setItemMapState((prevMap) => {
+			let changed = false;
+			for (const col of columnsProp) {
+				const prevItems = prevMap[col] ?? [];
+				const newItems = newItemMap[col] ?? [];
+				if (prevItems.length !== newItems.length) {
+					changed = true;
+					continue;
+				}
+				for (let i = 0; i < prevItems.length; i++) if (prevItems[i].id !== newItems[i].id || prevItems[i].data !== newItems[i].data) {
+					changed = true;
+					break;
+				}
+			}
+			if (!changed) return prevMap;
+			const updated = {};
+			for (const col of columnsProp) {
+				const prevItems = prevMap[col] ?? [];
+				const newItems = newItemMap[col] ?? [];
+				const prevById = /* @__PURE__ */ new Map();
+				for (const item of prevItems) prevById.set(item.id, item);
+				updated[col] = newItems.map((newItem) => {
+					const prev = prevById.get(newItem.id);
+					if (prev && prev.data === newItem.data) return prev;
+					return newItem;
+				});
+			}
+			return updated;
+		});
+	}, [
+		data,
+		columnsProp,
+		assignColumn
+	]);
+	const findColumnByItemId = (id) => {
+		return Object.keys(itemMapState).find((col) => itemMapState[col]?.some((i) => i.id === id));
+	};
+	const handleDragStart = (event) => {
+		setIsDragging(true);
+		setDragOverColumnId(null);
+		const { active } = event;
+		if (active.data.current?.type === "ITEM") {
+			const columnId = findColumnByItemId(active.id);
+			dragSourceColumnRef.current = columnId ?? null;
+			if (columnId) {
+				const item = itemMapState[columnId]?.find((i) => i.id === active.id);
+				setActiveItem(item || null);
+			}
+		}
+	};
+	const handleDragOver = (event) => {
+		const { active, over } = event;
+		if (!over) {
+			setDragOverColumnId(null);
+			return;
+		}
+		let currentHoveredColumnId = null;
+		const overId = over.id;
+		const overDataType = over.data.current?.type;
+		if (overDataType === "ITEM-LIST" || overDataType === "COLUMN") currentHoveredColumnId = overId;
+		else if (overDataType === "ITEM") currentHoveredColumnId = findColumnByItemId(overId) || null;
+		else if (columnsProp.includes(overId)) currentHoveredColumnId = overId;
+		setDragOverColumnId(currentHoveredColumnId);
+		if (active.data.current?.type !== "ITEM") return;
+		const activeId = active.id;
+		const activeItemColumn = findColumnByItemId(activeId);
+		let overColumnForMove = findColumnByItemId(overId);
+		if (!overColumnForMove && overDataType === "ITEM-LIST") overColumnForMove = overId;
+		if (!overColumnForMove && columnsProp.includes(overId)) overColumnForMove = overId;
+		if (!activeItemColumn || !overColumnForMove) return;
+		if (activeItemColumn === overColumnForMove) return;
+		if (itemMapState[overColumnForMove]?.some((i) => i.id === activeId)) return;
+		setItemMapState((currentMap) => {
+			const activeItems = [...currentMap[activeItemColumn] || []];
+			const overItems = [...currentMap[overColumnForMove] || []];
+			const activeIndex = activeItems.findIndex((i) => i.id === activeId);
+			if (activeIndex === -1) return currentMap;
+			let overIndex;
+			if (overDataType === "ITEM-LIST" || columnsProp.includes(overId) && !findColumnByItemId(overId)) overIndex = overItems.length;
+			else {
+				overIndex = overItems.findIndex((i) => i.id === overId);
+				if (overIndex !== -1) {
+					const modifier = (active.rect.current.translated?.top ?? 0) + (active.rect.current.translated?.height ?? 0) / 2 > (over?.rect.top ?? 0) + (over?.rect.height ?? 0) / 2 ? 1 : 0;
+					overIndex = overIndex >= 0 ? overIndex + modifier : overItems.length;
+				} else overIndex = overItems.length;
+			}
+			const newItemMap = { ...currentMap };
+			const [moved] = activeItems.splice(activeIndex, 1);
+			overItems.splice(overIndex, 0, moved);
+			newItemMap[activeItemColumn] = activeItems;
+			newItemMap[overColumnForMove] = overItems;
+			return newItemMap;
+		});
+	};
+	const handleDragCancel = () => {
+		setIsDragging(false);
+		setActiveItem(null);
+		setDragOverColumnId(null);
+		dragSourceColumnRef.current = null;
+	};
+	const handleDragEnd = (event) => {
+		const { active, over } = event;
+		const sourceColumn = dragSourceColumnRef.current;
+		setIsDragging(false);
+		setActiveItem(null);
+		setDragOverColumnId(null);
+		dragSourceColumnRef.current = null;
+		if (!over) return;
+		const activeId = active.id;
+		const overId = over.id;
+		if (active.data.current?.type === "COLUMN") {
+			if (activeId !== overId) {
+				const oldIndex = columnsProp.indexOf(activeId);
+				const newIndex = columnsProp.indexOf(overId);
+				if (oldIndex !== -1 && newIndex !== -1) {
+					const reordered = arrayMove(columnsProp, oldIndex, newIndex);
+					onColumnReorder?.(reordered);
+				}
+			}
+			return;
+		}
+		const currentCol = findColumnByItemId(activeId);
+		let targetCol = findColumnByItemId(overId);
+		if (!targetCol) {
+			if (over.data.current?.type === "ITEM-LIST" || columnsProp.includes(overId)) targetCol = overId;
+		}
+		targetCol = targetCol ?? currentCol;
+		if (!currentCol || !targetCol) return;
+		const targetItems = itemMapState[targetCol] || [];
+		const movedItem = (itemMapState[currentCol] || []).find((i) => i.id === activeId);
+		if (!movedItem) return;
+		const finalTargetItems = placeDroppedCard({
+			targetItems,
+			movedItem,
+			overId,
+			changedColumn: (sourceColumn ?? currentCol) !== targetCol
+		});
+		onItemsReorder?.(finalTargetItems, {
+			itemId: activeId,
+			sourceColumn: sourceColumn ?? currentCol,
+			targetColumn: targetCol
+		});
+	};
+	return /* @__PURE__ */ jsxs(DndContext, {
+		sensors,
+		collisionDetection: closestCorners,
+		onDragStart: handleDragStart,
+		onDragOver: handleDragOver,
+		onDragEnd: handleDragEnd,
+		onDragCancel: handleDragCancel,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: cls("flex flex-row h-full w-full overflow-x-auto p-4 select-none items-start", className),
+			children: [/* @__PURE__ */ jsx(SortableContext, {
+				items: columnsProp,
+				children: columnsProp.map((col, index) => {
+					const colItems = itemMapState[col] || [];
+					const loadingState = columnLoadingState?.[col];
+					return /* @__PURE__ */ jsx(BoardColumn, {
+						id: String(col),
+						title: columnLabels?.[col] ?? String(col),
+						items: colItems,
+						index,
+						ItemComponent,
+						isDragging,
+						isDragOverColumn: dragOverColumnId === String(col),
+						allowReorder: allowColumnReorder,
+						loading: loadingState?.loading,
+						hasMore: loadingState?.hasMore,
+						error: loadingState?.error,
+						totalCount: loadingState?.totalCount,
+						color: columnColors?.[col],
+						onLoadMore: onLoadMoreColumn ? () => onLoadMoreColumn(col) : void 0,
+						onAddItem: onAddItemToColumn ? () => onAddItemToColumn(col) : void 0
+					}, String(col));
+				})
+			}), AddColumnComponent]
+		}), typeof document !== "undefined" && createPortal(/* @__PURE__ */ jsx(DragOverlay, {
+			dropAnimation: null,
+			zIndex: 9999,
+			children: activeItem && /* @__PURE__ */ jsx(ItemComponent, {
+				item: activeItem,
+				isDragging: true,
+				isClone: true
+			})
+		}), document.body)]
+	});
+}
+//#endregion
+export { Board };
+
+//# sourceMappingURL=Board.es.js.map