@_linked/shape-ui 2.0.0 → 2.3.0

package/lib/esm/components/EditInstanceForms.js

@@ -0,0 +1,118 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { motion } from 'framer-motion';
+import { Button } from '@_linked/primitives/components/Button';
+import { Select } from '@_linked/primitives/components/Select';
+import { shacl } from '@_linked/core/ontologies/shacl';
+import { useEffect, useMemo, useState } from 'react';
+import { useDataManagerHost } from '../hostContext.js';
+import { Spinner } from '@_linked/primitives/components/Spinner';
+import { useFormDependencies } from '../shape/useFormDependencies.js';
+import { getTransition, staggerContainer, staggerItem, useReducedMotion, } from '@_linked/primitives/motion';
+import { classifyProperties, getVisibleProperties, } from '../shape/propertyVisibility.js';
+import { DynamicForm } from './DynamicFormField.js';
+// Shared by both form organisms — named for what it is, rather than one of its two
+// consumers importing the other's stylesheet.
+import style from './forms.module.css';
+function EditInstanceForms({ of, onSave, onCancel, shape, properties, allShapes, projectId, propertyUsage, codeUsage, }) {
+    const reducedMotion = useReducedMotion();
+    const propShapes = shape.propertyShapes;
+    const [isSaving, setIsSaving] = useState(false);
+    const [saveError, setSaveError] = useState(null);
+    const [extraFields, setExtraFields] = useState(new Set());
+    // Dependent field visibility & narrowing
+    const host = useDataManagerHost();
+    const { depMap, onParentValueChange, initFromData, isParent, getDependencyState, } = useFormDependencies(shape, allShapes || null, projectId || null, host.readInstance);
+    // Wrap `of` in a Proxy to detect parent field changes
+    const proxyOf = useMemo(() => {
+        return new Proxy(of, {
+            set(target, prop, value) {
+                const propLabel = prop;
+                const oldValue = target[propLabel];
+                target[propLabel] = value;
+                if (isParent(propLabel)) {
+                    // Only cascade-clear children when the parent value actually changed,
+                    // not during initialization write-backs from CustomMultiSelect
+                    let changed;
+                    if (oldValue == null || value == null) {
+                        changed = oldValue !== value;
+                    }
+                    else if (Array.isArray(oldValue) && Array.isArray(value)) {
+                        changed =
+                            oldValue.length !== value.length ||
+                                oldValue.some((o, i) => { var _a; return (o === null || o === void 0 ? void 0 : o.id) !== ((_a = value[i]) === null || _a === void 0 ? void 0 : _a.id); });
+                    }
+                    else if (typeof oldValue === 'object' && typeof value === 'object') {
+                        changed = oldValue.id !== value.id;
+                    }
+                    else {
+                        changed = oldValue !== value;
+                    }
+                    if (changed) {
+                        onParentValueChange(propLabel, value);
+                        for (const [childLabel, deps] of depMap) {
+                            if (deps.some((d) => d.parentLabel === propLabel)) {
+                                target[childLabel] = undefined;
+                            }
+                        }
+                    }
+                }
+                return true;
+            },
+        });
+    }, [of, depMap, onParentValueChange, isParent]);
+    // Initialize dependency state from existing instance data
+    useEffect(() => {
+        if (of) {
+            initFromData(of);
+        }
+    }, []);
+    const handleSave = async () => {
+        setIsSaving(true);
+        setSaveError(null);
+        try {
+            await (onSave === null || onSave === void 0 ? void 0 : onSave(of));
+        }
+        catch (err) {
+            setSaveError(err instanceof Error ? err.message : String(err));
+            setIsSaving(false);
+        }
+    };
+    return (_jsxs(motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { duration: reducedMotion ? 0 : 0.3, ease: [0.4, 0, 0.2, 1] }, children: [_jsx(motion.div, { className: style.container, initial: { opacity: 0, y: 10 }, animate: { opacity: 1, y: 0 }, transition: {
+                    duration: reducedMotion ? 0 : 0.4,
+                    ease: [0.4, 0, 0.2, 1],
+                    delay: reducedMotion ? 0 : 0.1,
+                }, children: _jsx(motion.div, { className: style.rows, variants: staggerContainer, initial: "initial", animate: "animate", children: (() => {
+                        const classified = classifyProperties(propShapes, propertyUsage || null, { codeUsage });
+                        const autoVisible = getVisibleProperties(classified, 'form-edit', of);
+                        const autoVisibleLabels = new Set(autoVisible.map((c) => c.property.label));
+                        const visibleProps = propShapes.filter((p) => autoVisibleLabels.has(p.label) || extraFields.has(p.label));
+                        const availableExtras = classified.filter((c) => !autoVisibleLabels.has(c.property.label) && !extraFields.has(c.property.label));
+                        return (_jsxs(_Fragment, { children: [visibleProps.map((propShape) => {
+                                    var _a;
+                                    let required = propShape.minCount > 0;
+                                    let formName = propShape.label;
+                                    let label = propShape.label
+                                        .replace(/([A-Z])/g, ' $1')
+                                        .replace(/_/g, ' ')
+                                        .replace(/^./, (char) => char.toUpperCase());
+                                    let dataType;
+                                    let nodeKind = propShape.nodeKind;
+                                    if ((nodeKind === null || nodeKind === void 0 ? void 0 : nodeKind.id) === shacl.Literal.id) {
+                                        dataType = (_a = propShape.datatype) === null || _a === void 0 ? void 0 : _a.id.split('#')[1];
+                                    }
+                                    if ((nodeKind === null || nodeKind === void 0 ? void 0 : nodeKind.id) === shacl.IRI.id) {
+                                        dataType = 'nodeShape';
+                                    }
+                                    return (_jsx(motion.div, { variants: staggerItem, transition: getTransition(reducedMotion), children: _jsx(DynamicForm, { dataType: dataType, formName: formName, label: label, placeholder: `Type ${label.toLowerCase()} here`, required: required, value: proxyOf[propShape.label], of: proxyOf, property: propShape, shape: null, dependencyState: getDependencyState(propShape.label) }) }, propShape.label));
+                                }), availableExtras.length > 0 && (_jsx(motion.div, { variants: staggerItem, transition: getTransition(reducedMotion), className: style.addFieldSection, children: _jsxs(Select.Root, { value: "", onValueChange: (label) => setExtraFields((prev) => new Set(prev).add(label)), children: [_jsx(Select.Trigger, { "aria-label": "Add optional field", children: _jsx(Select.Value, { placeholder: "+ Add optional field..." }) }), _jsx(Select.Content, { children: _jsx(Select.Group, { children: availableExtras.map((c) => (_jsx(Select.Item, { value: c.property.label, children: c.property.label
+                                                            .replace(/([A-Z])/g, ' $1')
+                                                            .replace(/_/g, ' ')
+                                                            .replace(/^./, (char) => char.toUpperCase()) }, c.property.label))) }) })] }) }))] }));
+                    })() }) }), saveError && (_jsx("p", { className: style.saveError, children: saveError })), _jsxs(motion.div, { className: style.actions, initial: { opacity: 0, y: 10 }, animate: { opacity: 1, y: 0 }, transition: {
+                    duration: reducedMotion ? 0 : 0.3,
+                    ease: [0.4, 0, 0.2, 1],
+                    delay: reducedMotion ? 0 : 0.3,
+                }, children: [_jsx(Button, { variant: "outline", onClick: onCancel, disabled: isSaving, children: "Cancel" }), _jsx(Button, { onClick: handleSave, disabled: isSaving, children: isSaving ? (_jsxs(_Fragment, { children: [_jsx(Spinner, { size: "small" }), " Saving"] })) : ('Save') })] })] }));
+}
+export default EditInstanceForms;
+//# sourceMappingURL=EditInstanceForms.js.map

package/lib/esm/components/EditInstanceForms.js.map

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

package/lib/esm/components/FilterBadge.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+export interface FilterBadgeProps {
+    label: string;
+    /** A filter can be muted without being removed, so a viewer can compare with and without. */
+    isActive?: boolean;
+    onToggle?: () => void;
+    onRemove?: () => void;
+    className?: string;
+}
+/**
+ * One active filter, as a chip that can be muted or removed.
+ *
+ * Two controls in one badge, which is why it is a component rather than a `<Badge>` with
+ * props: the body toggles and the trailing button removes, and each has to stop the other
+ * from firing. Getting that wrong means a viewer aiming for "remove" mutes it instead.
+ *
+ * An inactive filter is dimmed rather than hidden — the point of toggling instead of removing
+ * is to see the filter you have switched off.
+ */
+export declare function FilterBadge({ label, isActive, onToggle, onRemove, className, }: FilterBadgeProps): React.JSX.Element;

package/lib/esm/components/FilterBadge.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Badge } from '@_linked/primitives/components/Badge';
+import style from './FilterBadge.module.css';
+/**
+ * One active filter, as a chip that can be muted or removed.
+ *
+ * Two controls in one badge, which is why it is a component rather than a `<Badge>` with
+ * props: the body toggles and the trailing button removes, and each has to stop the other
+ * from firing. Getting that wrong means a viewer aiming for "remove" mutes it instead.
+ *
+ * An inactive filter is dimmed rather than hidden — the point of toggling instead of removing
+ * is to see the filter you have switched off.
+ */
+export function FilterBadge({ label, isActive = true, onToggle, onRemove, className, }) {
+    return (_jsxs(Badge, { variant: isActive ? 'soft' : 'outline', color: isActive ? 'primary' : 'neutral', className: [style.Root, !isActive && style.inactive, className]
+            .filter(Boolean)
+            .join(' '), children: [_jsx("button", { type: "button", className: style.toggle, onClick: (event) => {
+                    event.stopPropagation();
+                    onToggle === null || onToggle === void 0 ? void 0 : onToggle();
+                }, "aria-pressed": isActive, children: label }), onRemove && (_jsx("button", { type: "button", className: style.remove, "aria-label": `Remove filter ${label}`, onClick: (event) => {
+                    // Without this the toggle fires too, and the filter is muted on its way out.
+                    event.stopPropagation();
+                    onRemove();
+                }, children: _jsxs("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", "aria-hidden": "true", children: [_jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), _jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })] }) }))] }));
+}
+//# sourceMappingURL=FilterBadge.js.map

package/lib/esm/components/FilterBadge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterBadge.js","sourceRoot":"","sources":["../../../src/components/FilterBadge.tsx"],"names":[],"mappings":";AACA,OAAO,EAAC,KAAK,EAAC,MAAM,sCAAsC,CAAC;AAC3D,OAAO,KAAK,MAAM,0BAA0B,CAAC;AAW7C;;;;;;;;;GASG;AACH,MAAM,UAAU,WAAW,CAAC,EAC1B,KAAK,EACL,QAAQ,GAAG,IAAI,EACf,QAAQ,EACR,QAAQ,EACR,SAAS,GACQ;IACjB,OAAO,CACL,MAAC,KAAK,IACJ,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EACtC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,EACvC,SAAS,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,EAAE,SAAS,CAAC;aAC5D,MAAM,CAAC,OAAO,CAAC;aACf,IAAI,CAAC,GAAG,CAAC,aAEZ,iBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,KAAK,CAAC,MAAM,EACvB,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;oBACjB,KAAK,CAAC,eAAe,EAAE,CAAC;oBACxB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,EAAI,CAAC;gBACf,CAAC,kBACa,QAAQ,YAErB,KAAK,GACC,EACR,QAAQ,IAAI,CACX,iBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,KAAK,CAAC,MAAM,gBACX,iBAAiB,KAAK,EAAE,EACpC,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE;oBACjB,6EAA6E;oBAC7E,KAAK,CAAC,eAAe,EAAE,CAAC;oBACxB,QAAQ,EAAE,CAAC;gBACb,CAAC,YAED,eAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAC/E,WAAW,EAAC,KAAK,EAAC,aAAa,EAAC,OAAO,iBAAa,MAAM,aAC1D,eAAM,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,IAAI,GAAG,EACtC,eAAM,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,GAAG,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,GAAG,IAClC,GACC,CACV,IACK,CACT,CAAC;AACJ,CAAC"}

package/lib/esm/components/FilterBadge.module.css

@@ -0,0 +1,25 @@
+.Root {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--space-xs);
+}
+
+.inactive {
+  opacity: 0.55;
+}
+
+.toggle,
+.remove {
+  all: unset;
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+}
+
+.remove {
+  opacity: 0.7;
+}
+
+.remove:hover {
+  opacity: 1;
+}

package/lib/esm/components/FormField.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+interface FormFieldProps {
+    of?: any;
+    property?: any;
+    label?: string;
+    name?: string;
+    type: string;
+    placeholder?: string;
+    disabled?: boolean;
+    className?: string;
+    onChange?: (e: any) => void;
+    onBlur?: (e: any) => void;
+    value?: string | number;
+    required?: boolean;
+    defaultValue?: any;
+}
+declare const FormField: ({ of, property, label, name, type, placeholder, className, onChange, value, required, onBlur, defaultValue, ...restProps }: FormFieldProps) => React.JSX.Element;
+export { FormField };

package/lib/esm/components/FormField.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Label } from '@_linked/primitives/components/Label';
+import style from './FormField.module.css';
+import { TextfieldEditor } from './TextfieldEditor.js'; // import input field that already connected with shape
+const FormField = ({ of, property, label, name, type, placeholder = '', className, onChange, value, required, onBlur, defaultValue, ...restProps }) => {
+    return (_jsxs("div", { className: style.Root, children: [label && _jsx(Label, { htmlFor: name, children: label }), _jsx(TextfieldEditor, { of: of, type: type, name: name, placeholder: placeholder, className: className, onChange: onChange, onBlur: onBlur, value: value, defaultValue: defaultValue, required: required, readOnly: false, disabled: false, ...restProps })] }));
+};
+export { FormField };
+//# sourceMappingURL=FormField.js.map

package/lib/esm/components/FormField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../../src/components/FormField.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,KAAK,EAAE,MAAM,sCAAsC,CAAC;AAC7D,OAAO,KAAK,MAAM,wBAAwB,CAAC;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC,CAAC,uDAAuD;AAkB/G,MAAM,SAAS,GAAG,CAAC,EACjB,EAAE,EACF,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,WAAW,GAAG,EAAE,EAChB,SAAS,EACT,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,MAAM,EACN,YAAY,EACZ,GAAG,SAAS,EACG,EAAE,EAAE;IACnB,OAAO,CACL,eAAK,SAAS,EAAE,KAAK,CAAC,IAAI,aACvB,KAAK,IAAI,KAAC,KAAK,IAAC,OAAO,EAAE,IAAI,YAAG,KAAK,GAAS,EAC/C,KAAC,eAAe,IACd,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EAC1B,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,KAAK,EACf,QAAQ,EAAE,KAAK,KACX,SAAS,GACb,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/lib/esm/components/FormField.module.css

@@ -0,0 +1,57 @@
+/* ============================================================================
+   FormField.module.css
+   
+   Basic form field wrapper component.
+   Uses semantic tokens from theme.css.
+   ============================================================================ */
+
+/* === Root Container === */
+.Root {
+  display: grid;
+  width: 100%;
+  max-width: 24rem;
+  align-items: center;
+  gap: var(--space-xs-plus);
+}
+
+.Root div > input {
+  width: 98%;
+  background-color: var(--field-bg);
+  border: 1px solid var(--field-border);
+  border-radius: var(--radius-field);
+  padding: var(--space-sm-plus) 0.75rem;
+  color: var(--field-text);
+  font-size: var(--typography-small-size);
+  transition: all var(--transition-fast);
+}
+
+.Root div > input:focus {
+  outline: none;
+  border-color: var(--field-border-focus);
+  box-shadow: 0 0 0 3px
+    color-mix(in srgb, var(--form-field-tertiary-500, var(--color-tertiary-500)) 15%, transparent);
+}
+
+.Root div > input::placeholder {
+  color: var(--field-text-placeholder);
+}
+
+/* ============================================================================
+   Dark Mode
+   ============================================================================ */
+
+[data-theme='dark'] .Root div > input {
+  background-color: var(--field-bg);
+  border-color: var(--field-border);
+  color: var(--field-text);
+}
+
+[data-theme='dark'] .Root div > input:focus {
+  border-color: var(--field-border-focus);
+  box-shadow: 0 0 0 3px
+    color-mix(in srgb, var(--form-field-tertiary-500, var(--color-tertiary-500)) 20%, transparent);
+}
+
+[data-theme='dark'] .Root div > input::placeholder {
+  color: var(--field-text-placeholder);
+}

package/lib/esm/components/InstanceDeletionDialog.d.ts

@@ -0,0 +1,17 @@
+import type { InstanceDeletionExecuteInput, InstanceDeletionPreview, InstanceDeletionPreviewInput, InstanceDeletionResult, InstanceDeletionTarget } from '../shape/contracts.js';
+type PreviewDeletion = (input: InstanceDeletionPreviewInput) => Promise<InstanceDeletionPreview>;
+type ExecuteDeletion = (input: InstanceDeletionExecuteInput) => Promise<InstanceDeletionResult>;
+export interface InstanceDeletionDialogProps {
+    isOpen: boolean;
+    projectId: string;
+    targets: InstanceDeletionTarget[];
+    labels?: Record<string, string>;
+    onClose: () => void;
+    onDeleted: (result: InstanceDeletionResult) => void;
+    /** How to preview the cascade. Required: the organism has no opinion on where data lives. */
+    previewDeletion: PreviewDeletion;
+    /** How to perform it. */
+    executeDeletion: ExecuteDeletion;
+}
+export declare function InstanceDeletionDialog({ isOpen, projectId, targets, labels, onClose, onDeleted, previewDeletion, executeDeletion, }: InstanceDeletionDialogProps): import("react").JSX.Element;
+export {};

package/lib/esm/components/InstanceDeletionDialog.js

@@ -0,0 +1,83 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from 'react';
+import { ConfirmDialog } from '@_linked/primitives/components/ConfirmDialog';
+import { Spinner } from '@_linked/primitives/components/Spinner';
+import style from './InstanceDeletionDialog.module.css';
+function errorMessage(error) {
+    return error instanceof Error ? error.message : String(error);
+}
+function replacementPreview(error) {
+    if (!error || typeof error !== 'object')
+        return undefined;
+    const candidate = error;
+    return candidate.code === 'impact-changed' ? candidate.preview : undefined;
+}
+export function InstanceDeletionDialog({ isOpen, projectId, targets, labels = {}, onClose, onDeleted, previewDeletion, executeDeletion, }) {
+    const [preview, setPreview] = useState();
+    const [isLoading, setIsLoading] = useState(false);
+    const [isDeleting, setIsDeleting] = useState(false);
+    const [error, setError] = useState();
+    const [impactChanged, setImpactChanged] = useState(false);
+    const targetKey = useMemo(() => targets.map(({ instanceId, shapeIri }) => `${shapeIri}\u0000${instanceId}`).join('\u0001'), [targets]);
+    useEffect(() => {
+        if (!isOpen || !projectId || targets.length === 0)
+            return;
+        let active = true;
+        setPreview(undefined);
+        setError(undefined);
+        setImpactChanged(false);
+        setIsLoading(true);
+        previewDeletion({ projectId, targets })
+            .then((next) => {
+            if (active)
+                setPreview(next);
+        })
+            .catch((reason) => {
+            if (active)
+                setError(errorMessage(reason));
+        })
+            .finally(() => {
+            if (active)
+                setIsLoading(false);
+        });
+        return () => { active = false; };
+    }, [isOpen, projectId, targetKey, previewDeletion]);
+    const confirm = async () => {
+        if (!preview || isDeleting)
+            return;
+        setIsDeleting(true);
+        setError(undefined);
+        setImpactChanged(false);
+        try {
+            const result = await executeDeletion({
+                projectId,
+                targets,
+                expectedImpactHash: preview.impactHash,
+            });
+            onDeleted(result);
+            onClose();
+        }
+        catch (reason) {
+            const replacement = replacementPreview(reason);
+            if (replacement) {
+                setPreview(replacement);
+                setImpactChanged(true);
+            }
+            else {
+                setError(errorMessage(reason));
+            }
+        }
+        finally {
+            setIsDeleting(false);
+        }
+    };
+    const message = (_jsxs("div", { className: style.summary, children: [_jsx("p", { className: style.intro, children: "Review references and document provenance before deleting. This preview is checked again when you confirm." }), isLoading && _jsxs("div", { role: "status", children: [_jsx(Spinner, { size: "small" }), " Checking current impact\u2026"] }), impactChanged && (_jsx("p", { className: style.changed, role: "alert", children: "The impact changed since the previous preview. Review the updated details, then confirm again." })), error && _jsx("p", { className: style.error, role: "alert", children: error }), preview && (_jsx("div", { className: style.targets, children: preview.targets.map((target) => {
+                    const hasImpact = target.inboundReferences.length > 0 || target.sourceDocuments.length > 0;
+                    return (_jsxs("section", { className: style.target, children: [_jsx("strong", { children: labels[target.instanceId] || target.instanceId }), _jsx("small", { children: target.instanceId }), !hasImpact && _jsx("p", { className: style.empty, children: "No inbound references or source documents found." }), target.sourceDocuments.length > 0 && (_jsx("ul", { className: style.impactList, "aria-label": "Source documents", children: target.sourceDocuments.map((documentId) => (_jsxs("li", { children: ["Produced from document ", documentId] }, documentId))) })), target.inboundReferences.length > 0 && (_jsx("ul", { className: style.impactList, "aria-label": "Inbound references", children: target.inboundReferences.map((reference) => (_jsxs("li", { children: ["Referenced by ", reference.subjectId, " through ", reference.propertyIri] }, `${reference.subjectId}:${reference.propertyIri}`))) })), target.pendingRecreation && (_jsx("p", { className: style.warning, children: "This instance came from Document Studio. Deleting it also suppresses automatic recreation until it is explicitly restored." }))] }, `${target.shapeIri}:${target.instanceId}`));
+                }) }))] }));
+    return (_jsx(ConfirmDialog, { open: isOpen, onOpenChange: (next) => {
+            if (!next)
+                onClose();
+        }, onConfirm: confirm, title: targets.length === 1 ? 'Delete this instance?' : `Delete ${targets.length} instances?`, message: message, confirmText: targets.length === 1 ? 'Delete instance' : `Delete ${targets.length} instances`, tone: "danger", isLoading: isDeleting, confirmDisabled: !preview || isLoading, loadingContent: _jsxs(_Fragment, { children: [_jsx(Spinner, { size: "small" }), " Deleting"] }) }));
+}
+//# sourceMappingURL=InstanceDeletionDialog.js.map

package/lib/esm/components/InstanceDeletionDialog.js.map

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

package/lib/esm/components/InstanceDeletionDialog.module.css

@@ -0,0 +1,59 @@
+.summary {
+  display: grid;
+  gap: 0.875rem;
+  min-width: min(32rem, 75vw);
+}
+
+.intro,
+.empty,
+.error,
+.changed {
+  margin: 0;
+}
+
+.targets {
+  display: grid;
+  gap: 0.75rem;
+  max-height: 48vh;
+  overflow: auto;
+}
+
+.target {
+  display: grid;
+  gap: 0.45rem;
+  padding: 0.75rem;
+  border: 1px solid var(--surface-border, #d8dee8);
+  border-radius: 0.5rem;
+  background: var(--section-bg, #f8fafc);
+}
+
+.target strong,
+.target small {
+  overflow-wrap: anywhere;
+}
+
+.impactList {
+  display: grid;
+  gap: 0.25rem;
+  margin: 0;
+  padding-left: 1.15rem;
+}
+
+.impactList li {
+  overflow-wrap: anywhere;
+}
+
+.warning {
+  color: var(--intent-warning-text, #8a4b08);
+}
+
+.error {
+  color: var(--color-error, #b42318);
+}
+
+.changed {
+  padding: 0.65rem;
+  border-radius: 0.4rem;
+  background: var(--intent-warning-bg, #fff4e5);
+  color: var(--intent-warning-text, #8a4b08);
+}

package/lib/esm/components/InstanceOverview.d.ts

@@ -0,0 +1,43 @@
+import type { ShapeInstancesQueryConfig } from '../shape/contracts.js';
+import type { PropertyShapeWire, NodeShapeWire } from '@_linked/core/shapes/nodeShapeWire';
+import type { TableMode } from '../columns.js';
+import React from 'react';
+import { type ReactTableProps } from './ReactTable.js';
+type PropertiesMap = Record<string, PropertyShapeWire>;
+type InstanceRecord<P extends PropertiesMap> = Partial<Record<keyof P, unknown>>;
+export interface BatchResult {
+    succeeded: string[];
+    failed: string[];
+}
+interface InstanceOverviewProps<P extends PropertiesMap = PropertiesMap, I extends InstanceRecord<P> = InstanceRecord<P>> {
+    customColumns?: any;
+    instances: I[];
+    /**
+     * Total row count of the whole dataset when `instances` is one server-fetched page.
+     * Omit it for client-side pagination over the full `instances` array. Forwarded to
+     * `ReactTable`, which switches to manual pagination when it is set.
+     */
+    totalCount?: number;
+    properties: P;
+    shape?: NodeShapeWire;
+    isLoading?: boolean;
+    config?: ShapeInstancesQueryConfig;
+    setConfig?: (updated: ShapeInstancesQueryConfig) => void;
+    onSelectionChange?: (selectedRows: number[], selectedInstances: I[]) => void;
+    isPickMode?: boolean;
+    pickMaxCount?: number;
+    pickAlreadySelected?: {
+        id: string;
+        label: string;
+        image?: string;
+    }[];
+    deletionProjectId?: string;
+    previewDeletion?: ReactTableProps['previewDeletion'];
+    executeDeletion?: ReactTableProps['executeDeletion'];
+    onInstancesDeleted?: ReactTableProps['onInstancesDeleted'];
+    onBatchUpdate?: (changes: Record<string, any>, uris: string[]) => Promise<BatchResult>;
+    tableMode?: TableMode;
+    onTableModeChange?: (mode: TableMode) => void;
+}
+declare function InstanceOverview<P extends PropertiesMap, I extends InstanceRecord<P>>({ customColumns, instances, totalCount, properties, shape, isLoading, config, setConfig, onSelectionChange, isPickMode, pickMaxCount, pickAlreadySelected, deletionProjectId, previewDeletion, executeDeletion, onInstancesDeleted, onBatchUpdate, tableMode, onTableModeChange, }: InstanceOverviewProps<P, I>): React.JSX.Element;
+export default InstanceOverview;