@almadar/ui 5.128.0 → 5.130.0

package/dist/runtime/index.js

@@ -23699,7 +23699,7 @@ var init_FormField = __esm({
     FormField.displayName = "FormField";
   }
 });
-var resolveFilterType, lookStyles6, FilterGroup;
+var resolveFilterType, lookStyles6, FilterGroupControls, FilterGroupPopover, FilterGroup;
 var init_FilterGroup = __esm({
   "components/core/molecules/FilterGroup.tsx"() {
     "use client";
@@ -23717,10 +23717,10 @@ var init_FilterGroup = __esm({
       toolbar: "",
       chips: "gap-1 [&_input]:rounded-pill [&_select]:rounded-pill [&_button]:rounded-pill [&_input]:!px-3 [&_select]:!px-3 [&_input]:bg-muted [&_select]:bg-muted [&_label]:hidden",
       pills: "gap-2 [&_input]:rounded-pill [&_select]:rounded-pill [&_button]:rounded-pill",
-      "popover-trigger": "[&>*:not(:first-child)]:hidden",
+      "popover-trigger": "",
       "inline-column-header": "hidden"
     };
-    FilterGroup = ({
+    FilterGroupControls = ({
       entity,
       filters,
       onFilterChange,
@@ -24056,7 +24056,7 @@ var init_FilterGroup = __esm({
                 className: "text-muted-foreground",
                 children: [
                   /* @__PURE__ */ jsx(Icon, { name: "filter", className: "h-4 w-4" }),
-                  /* @__PURE__ */ jsx("span", { className: "text-sm font-bold uppercase tracking-wide", children: t("filterGroup.filters") })
+                  /* @__PURE__ */ jsx("span", { className: "text-xs font-bold uppercase tracking-wide", children: t("filterGroup.filters") })
                 ]
               }
             ),
@@ -24147,6 +24147,42 @@ var init_FilterGroup = __esm({
         }
       );
     };
+    FilterGroupControls.displayName = "FilterGroupControls";
+    FilterGroupPopover = (props) => {
+      const { t } = useTranslate();
+      const [open, setOpen] = useState(false);
+      const queryState = useQuerySingleton(props.query);
+      const activeFilterCount = queryState?.filters ? Object.values(queryState.filters).filter((v) => v !== null && v !== void 0).length : 0;
+      return /* @__PURE__ */ jsxs("div", { className: cn("relative inline-block", props.className), children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: activeFilterCount > 0 ? "secondary" : "ghost",
+            size: "sm",
+            leftIcon: "filter",
+            onClick: () => setOpen((o) => !o),
+            "aria-expanded": open,
+            "aria-haspopup": "true",
+            children: /* @__PURE__ */ jsxs(HStack, { gap: "xs", align: "center", children: [
+              /* @__PURE__ */ jsx("span", { children: t("filterGroup.filters") }),
+              activeFilterCount > 0 && /* @__PURE__ */ jsx(Badge, { variant: "primary", size: "sm", children: activeFilterCount })
+            ] })
+          }
+        ),
+        open && /* @__PURE__ */ jsx("div", { className: "absolute left-0 z-50 mt-2 min-w-[16rem] rounded-lg border border-[var(--color-border)] bg-[var(--color-card)] p-card-md shadow-main", children: /* @__PURE__ */ jsx(
+          FilterGroupControls,
+          {
+            ...props,
+            className: void 0,
+            look: "toolbar",
+            variant: "vertical",
+            showIcon: false
+          }
+        ) })
+      ] });
+    };
+    FilterGroupPopover.displayName = "FilterGroupPopover";
+    FilterGroup = (props) => props.look === "popover-trigger" ? /* @__PURE__ */ jsx(FilterGroupPopover, { ...props }) : /* @__PURE__ */ jsx(FilterGroupControls, { ...props });
     FilterGroup.displayName = "FilterGroup";
   }
 });
@@ -26804,12 +26840,12 @@ var init_MapView = __esm({
         shadowSize: [41, 41]
       });
       L.Marker.prototype.options.icon = defaultIcon;
-      const { useEffect: useEffect59, useRef: useRef59, useCallback: useCallback87, useState: useState89 } = React82__default;
+      const { useEffect: useEffect59, useRef: useRef60, useCallback: useCallback87, useState: useState89 } = React82__default;
       const { Typography: Typography2 } = await Promise.resolve().then(() => (init_Typography(), Typography_exports));
       const { useEventBus: useEventBus2 } = await Promise.resolve().then(() => (init_useEventBus(), useEventBus_exports));
       function MapUpdater({ centerLat, centerLng, zoom }) {
         const map = useMap();
-        const prevRef = useRef59({ centerLat, centerLng, zoom });
+        const prevRef = useRef60({ centerLat, centerLng, zoom });
         useEffect59(() => {
           const prev = prevRef.current;
           if (prev.centerLat !== centerLat || prev.centerLng !== centerLng || prev.zoom !== zoom) {
@@ -27788,9 +27824,19 @@ function TableView({
   const inlineActionCount = hasActions ? maxInlineActions != null ? Math.min(itemActions.length, maxInlineActions) : itemActions.length : 0;
   const hasOverflowActions = hasActions && maxInlineActions != null && itemActions.length > maxInlineActions;
   const actionsTrack = hasActions ? `${inlineActionCount * 6 + (hasOverflowActions ? 3 : 0)}rem` : null;
+  const colFloors = React82__default.useMemo(
+    () => colDefs.map((col) => {
+      const longest = data.reduce((widest, row) => {
+        const cell = formatCell(asFieldValue(getNestedValue(row, col.field ?? col.key)), col.format);
+        return Math.max(widest, cell.length);
+      }, columnLabel(col).length);
+      return Math.min(longest, MAX_MEASURED_COL_CH);
+    }),
+    [colDefs, data]
+  );
   const gridTemplateColumns = [
     selectable ? "auto" : null,
-    ...colDefs.map((c) => c.width ?? "minmax(0, 1fr)"),
+    ...colDefs.map((c, i) => c.width ?? `minmax(${colFloors[i]}ch, 1fr)`),
     actionsTrack
   ].filter(Boolean).join(" ");
   const header = /* @__PURE__ */ jsxs(
@@ -27957,7 +28003,7 @@ function TableView({
     }
   );
 }
-var alignClass, weightClass, LOOKS;
+var MAX_MEASURED_COL_CH, alignClass, weightClass, LOOKS;
 var init_TableView = __esm({
   "components/core/molecules/TableView.tsx"() {
     "use client";
@@ -27975,6 +28021,7 @@ var init_TableView = __esm({
     init_Menu();
     init_useDataDnd();
     createLogger("almadar:ui:table-view");
+    MAX_MEASURED_COL_CH = 32;
     alignClass = {
       left: "justify-start text-left",
       center: "justify-center text-center",
@@ -35861,6 +35908,290 @@ var init_GraphCanvas = __esm({
     GraphCanvas.displayName = "GraphCanvas";
   }
 });
+var ImportSourcePicker;
+var init_ImportSourcePicker = __esm({
+  "components/core/molecules/import/ImportSourcePicker.tsx"() {
+    "use client";
+    init_Box();
+    init_Icon();
+    init_Typography();
+    init_cn();
+    ImportSourcePicker = ({
+      sources,
+      onSelect,
+      onFilesSelected,
+      title,
+      moreSources,
+      className
+    }) => {
+      const fileInputRef = useRef(null);
+      const handlePick = (source) => {
+        if (source.disabled) return;
+        if (source.kind === "file") {
+          const input = fileInputRef.current;
+          if (!input) return;
+          input.accept = source.accept ?? "";
+          input.multiple = source.multiple ?? false;
+          input.click();
+          return;
+        }
+        onSelect?.(source.id);
+      };
+      const handleFiles = (event) => {
+        const files = event.target.files ? Array.from(event.target.files) : [];
+        event.target.value = "";
+        if (files.length > 0) onFilesSelected?.(files);
+      };
+      return /* @__PURE__ */ jsxs(Box, { className: cn("flex flex-col gap-2", className), children: [
+        title ? /* @__PURE__ */ jsx(Typography, { variant: "h4", children: title }) : null,
+        sources.map((source) => /* @__PURE__ */ jsxs(
+          Box,
+          {
+            role: "button",
+            tabIndex: source.disabled ? -1 : 0,
+            "aria-disabled": source.disabled,
+            onClick: () => handlePick(source),
+            onKeyDown: (event) => {
+              if (event.key === "Enter" || event.key === " ") {
+                event.preventDefault();
+                handlePick(source);
+              }
+            },
+            className: cn(
+              "flex items-center gap-3 rounded-md border border-border bg-card px-4 py-3 text-left",
+              source.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer hover:bg-accent hover:text-accent-foreground"
+            ),
+            children: [
+              source.icon ? /* @__PURE__ */ jsx(Icon, { icon: source.icon, size: "md" }) : null,
+              /* @__PURE__ */ jsxs(Box, { className: "flex flex-col", children: [
+                /* @__PURE__ */ jsx(Typography, { variant: "label", children: source.label }),
+                source.description ? /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-muted-foreground", children: source.description }) : null
+              ] })
+            ]
+          },
+          source.id
+        )),
+        moreSources,
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            ref: fileInputRef,
+            type: "file",
+            className: "hidden",
+            onChange: handleFiles,
+            "data-testid": "import-source-file-input"
+          }
+        )
+      ] });
+    };
+  }
+});
+function formatFieldValue(value) {
+  if (value === null) return "\u2014";
+  if (value instanceof Date) return value.toISOString();
+  if (Array.isArray(value)) return value.map(formatFieldValue).join(", ");
+  if (typeof value === "object") return JSON.stringify(value);
+  return String(value);
+}
+function unitTitle(unit) {
+  for (const key of TITLE_KEYS) {
+    const value = unit.fields[key];
+    if (typeof value === "string" && value.length > 0) return value;
+  }
+  return unit.ref;
+}
+function fieldSummary(unit) {
+  return Object.entries(unit.fields).filter(([key]) => !TITLE_KEYS.includes(key)).map(([key, value]) => `${key}: ${formatFieldValue(value)}`).join(" \xB7 ");
+}
+var TITLE_KEYS, ImportPreviewTree;
+var init_ImportPreviewTree = __esm({
+  "components/core/molecules/import/ImportPreviewTree.tsx"() {
+    "use client";
+    init_Box();
+    init_Badge();
+    init_Button();
+    init_Icon();
+    init_Typography();
+    init_cn();
+    TITLE_KEYS = ["title", "name", "label"];
+    ImportPreviewTree = ({
+      units,
+      skipped = [],
+      entityDisplay,
+      onConfirm,
+      onCancel,
+      confirmLabel = "Confirm import",
+      cancelLabel = "Cancel",
+      indent = 16,
+      className
+    }) => {
+      const groups = /* @__PURE__ */ new Map();
+      for (const unit of units) {
+        const group = groups.get(unit.targetEntity);
+        if (group) group.push(unit);
+        else groups.set(unit.targetEntity, [unit]);
+      }
+      const renderUnit = (unit, childrenByParent, depth) => {
+        const summary = fieldSummary(unit);
+        const children = childrenByParent.get(unit.ref) ?? [];
+        return /* @__PURE__ */ jsxs(React82__default.Fragment, { children: [
+          /* @__PURE__ */ jsxs(
+            Box,
+            {
+              className: "flex flex-col py-1",
+              style: { paddingLeft: depth * indent },
+              "data-testid": `import-preview-unit-${unit.ref}`,
+              children: [
+                /* @__PURE__ */ jsxs(Box, { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx(Icon, { icon: "file-text", size: "xs", className: "text-muted-foreground" }),
+                  /* @__PURE__ */ jsx(Typography, { variant: "body2", children: unitTitle(unit) })
+                ] }),
+                summary ? /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-muted-foreground", children: summary }) : null
+              ]
+            }
+          ),
+          children.map((child) => renderUnit(child, childrenByParent, depth + 1))
+        ] }, unit.ref);
+      };
+      return /* @__PURE__ */ jsxs(Box, { className: cn("flex flex-col gap-4", className), children: [
+        units.length === 0 ? /* @__PURE__ */ jsx(Typography, { variant: "body2", className: "text-muted-foreground", children: "No units staged." }) : null,
+        Array.from(groups.entries()).map(([entity, groupUnits]) => {
+          const refs = new Set(groupUnits.map((unit) => unit.ref));
+          const childrenByParent = /* @__PURE__ */ new Map();
+          const roots = [];
+          for (const unit of groupUnits) {
+            if (unit.parentRef && refs.has(unit.parentRef)) {
+              const siblings = childrenByParent.get(unit.parentRef);
+              if (siblings) siblings.push(unit);
+              else childrenByParent.set(unit.parentRef, [unit]);
+            } else {
+              roots.push(unit);
+            }
+          }
+          const label = entityDisplay[entity]?.plural ?? entity;
+          return /* @__PURE__ */ jsxs(Box, { border: true, className: "rounded-md border-border bg-card p-3", children: [
+            /* @__PURE__ */ jsxs(Box, { className: "flex items-center gap-2 pb-2", children: [
+              /* @__PURE__ */ jsx(Typography, { variant: "label", children: label }),
+              /* @__PURE__ */ jsx(Badge, { amount: groupUnits.length })
+            ] }),
+            roots.map((unit) => renderUnit(unit, childrenByParent, 0))
+          ] }, entity);
+        }),
+        skipped.length > 0 ? /* @__PURE__ */ jsxs(Box, { border: true, className: "rounded-md border-border bg-card p-3", children: [
+          /* @__PURE__ */ jsxs(Box, { className: "flex items-center gap-2 pb-2", children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "label", children: "Skipped" }),
+            /* @__PURE__ */ jsx(Badge, { amount: skipped.length })
+          ] }),
+          skipped.map((element) => /* @__PURE__ */ jsxs(Box, { className: "flex items-baseline gap-2 py-1", children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "body2", children: element.ref }),
+            /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-muted-foreground", children: element.reason })
+          ] }, element.ref))
+        ] }) : null,
+        onConfirm || onCancel ? /* @__PURE__ */ jsxs(Box, { className: "flex items-center justify-end gap-2", children: [
+          onCancel ? /* @__PURE__ */ jsx(Button, { variant: "default", label: cancelLabel, onClick: onCancel }) : null,
+          onConfirm ? /* @__PURE__ */ jsx(Button, { variant: "primary", label: confirmLabel, onClick: onConfirm }) : null
+        ] }) : null
+      ] });
+    };
+  }
+});
+var PIPELINE, DEFAULT_LABELS, ImportProgress;
+var init_ImportProgress = __esm({
+  "components/core/molecules/import/ImportProgress.tsx"() {
+    "use client";
+    init_Box();
+    init_Badge();
+    init_Icon();
+    init_Typography();
+    init_cn();
+    PIPELINE = [
+      "fetching",
+      "mapping",
+      "reviewing",
+      "committing"
+    ];
+    DEFAULT_LABELS = {
+      fetching: "Fetching",
+      mapping: "Mapping",
+      reviewing: "Reviewing",
+      committing: "Committing",
+      done: "Done",
+      failed: "Failed"
+    };
+    ImportProgress = ({
+      step,
+      counts,
+      labels,
+      className
+    }) => {
+      const label = (key) => labels?.[key] ?? DEFAULT_LABELS[key];
+      const currentIndex = step === "done" || step === "failed" ? PIPELINE.length : PIPELINE.indexOf(step);
+      return /* @__PURE__ */ jsxs(Box, { className: cn("flex flex-col gap-3", className), children: [
+        /* @__PURE__ */ jsxs(Box, { className: "flex items-center gap-2", children: [
+          PIPELINE.map((key, index) => {
+            const isComplete = index < currentIndex;
+            const isActive = index === currentIndex;
+            return /* @__PURE__ */ jsxs(React82__default.Fragment, { children: [
+              index > 0 ? /* @__PURE__ */ jsx(Box, { className: "h-px w-4 bg-border" }) : null,
+              /* @__PURE__ */ jsxs(Box, { className: "flex items-center gap-1", "data-testid": `import-progress-step-${key}`, children: [
+                /* @__PURE__ */ jsx(
+                  Icon,
+                  {
+                    icon: isComplete ? "check" : isActive ? "loader" : "circle",
+                    size: "sm",
+                    className: cn(
+                      isComplete ? "text-success" : isActive ? "text-primary" : "text-muted-foreground"
+                    )
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  Typography,
+                  {
+                    variant: "caption",
+                    className: cn(isActive ? "text-foreground" : "text-muted-foreground"),
+                    children: label(key)
+                  }
+                )
+              ] })
+            ] }, key);
+          }),
+          step === "done" || step === "failed" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(Box, { className: "h-px w-4 bg-border" }),
+            /* @__PURE__ */ jsxs(Box, { className: "flex items-center gap-1", "data-testid": `import-progress-step-${step}`, children: [
+              /* @__PURE__ */ jsx(
+                Icon,
+                {
+                  icon: step === "done" ? "check" : "x",
+                  size: "sm",
+                  className: step === "done" ? "text-success" : "text-error"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Typography,
+                {
+                  variant: "caption",
+                  className: step === "done" ? "text-success" : "text-error",
+                  children: label(step)
+                }
+              )
+            ] })
+          ] }) : null
+        ] }),
+        counts ? /* @__PURE__ */ jsxs(Box, { className: "flex items-center gap-2", children: [
+          counts.staged !== void 0 ? /* @__PURE__ */ jsx(Badge, { label: `Staged ${counts.staged}` }) : null,
+          counts.committed !== void 0 ? /* @__PURE__ */ jsx(Badge, { variant: "success", label: `Committed ${counts.committed}` }) : null,
+          counts.failed !== void 0 ? /* @__PURE__ */ jsx(Badge, { variant: "danger", label: `Failed ${counts.failed}` }) : null
+        ] }) : null
+      ] });
+    };
+  }
+});
+
+// components/core/molecules/import/index.ts
+var init_import = __esm({
+  "components/core/molecules/import/index.ts"() {
+  }
+});
 var ReflectionBlock;
 var init_ReflectionBlock = __esm({
   "components/core/molecules/ReflectionBlock.tsx"() {
@@ -35935,6 +36266,7 @@ var init_molecules2 = __esm({
     init_EmptyState();
     init_Pagination();
     init_molecules();
+    init_import();
   }
 });
 
@@ -36415,7 +36747,7 @@ function getBadgeVariant(fieldName, value) {
 function formatFieldLabel(fieldName) {
   return fieldName.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase());
 }
-function formatFieldValue(value, fieldName) {
+function formatFieldValue2(value, fieldName) {
   if (typeof value === "number") {
     if (fieldName.toLowerCase().includes("progress") || fieldName.toLowerCase().includes("percent")) {
       return `${value}%`;
@@ -36510,7 +36842,7 @@ function renderRichFieldValue(value, fieldName, fieldType) {
       return str;
     }
     default:
-      return formatFieldValue(value, fieldName);
+      return formatFieldValue2(value, fieldName);
   }
 }
 function normalizeFieldDefs(fields) {
@@ -36621,7 +36953,7 @@ var init_DetailPanel = __esm({
               const value = getNestedValue(normalizedData, field);
               return {
                 label: labelFor(field),
-                value: formatFieldValue(value, field),
+                value: formatFieldValue2(value, field),
                 icon: getFieldIcon(field)
               };
             }
@@ -42652,6 +42984,9 @@ var init_component_registry_generated = __esm({
     init_HeroOrganism();
     init_HeroSection();
     init_Icon();
+    init_ImportPreviewTree();
+    init_ImportProgress();
+    init_ImportSourcePicker();
     init_InfiniteScrollSentinel();
     init_Input();
     init_InputGroup();
@@ -42915,6 +43250,9 @@ var init_component_registry_generated = __esm({
       "HeroOrganism": HeroOrganism,
       "HeroSection": HeroSection,
       "Icon": Icon,
+      "ImportPreviewTree": ImportPreviewTree,
+      "ImportProgress": ImportProgress,
+      "ImportSourcePicker": ImportSourcePicker,
       "InfiniteScrollSentinel": InfiniteScrollSentinel,
       "Input": Input,
       "InputGroup": InputGroup,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@almadar/ui",
-  "version": "5.128.0",
+  "version": "5.130.0",
   "description": "React UI components, hooks, and providers for Almadar",
   "type": "module",
   "sideEffects": [
@@ -110,6 +110,7 @@
     "index.css",
     "themes",
     "locales",
+    "scripts",
     "tailwind-preset.cjs"
   ],
   "publishConfig": {
@@ -117,12 +118,12 @@
     "access": "public"
   },
   "dependencies": {
-    "@almadar/core": "^10.36.0",
+    "@almadar/core": "^10.38.0",
     "@almadar/evaluator": "^2.37.0",
     "@almadar/logger": "^1.10.0",
-    "@almadar/runtime": "^6.39.0",
-    "@almadar/std": "^16.146.0",
-    "@almadar/syntax": "^1.12.0",
+    "@almadar/runtime": "^6.41.0",
+    "@almadar/std": "^16.148.0",
+    "@almadar/syntax": "^1.13.0",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/sortable": "^10.0.0",
     "@dnd-kit/utilities": "^3.2.2",