@kopexa/extension-controlref 1.0.0 → 2.0.0

package/dist/chunk-4C72VBLP.mjs

@@ -0,0 +1,52 @@
+"use client";
+import {
+  getIndicatorProps
+} from "./chunk-AQTNFDGA.mjs";
+
+// src/components/use-control.ts
+import { useEffect, useRef, useState } from "react";
+function useControl({ attrs, resolver, editor }) {
+  var _a;
+  const isEdit = !!editor.isEditable;
+  const interactive = !!editor.isEditable && !!resolver;
+  const [isMissing, setIsMissing] = useState(false);
+  const [isOutdated, setIsOutdated] = useState(false);
+  const lastCheckedRef = useRef(0);
+  const mapped = !!attrs.id;
+  const ind = getIndicatorProps(attrs.status, {
+    mapped,
+    enable: !!((_a = attrs == null ? void 0 : attrs.options) == null ? void 0 : _a.showStatus)
+  });
+  useEffect(() => {
+    if (!isEdit || !(resolver == null ? void 0 : resolver.getControl) || !mapped || !attrs.id) return;
+    let cancelled = false;
+    const now = Date.now();
+    if (now - lastCheckedRef.current < 1e4) return;
+    (async () => {
+      try {
+        if (!attrs.id) return;
+        lastCheckedRef.current = now;
+        const latest = await resolver.getControl(attrs.id);
+        if (cancelled) return;
+        if (!latest) {
+          setIsMissing(true);
+          setIsOutdated(false);
+          return;
+        }
+        setIsMissing(false);
+        const localUpdated = attrs.updatedAt ? new Date(attrs.updatedAt).getTime() : 0;
+        const remoteUpdated = latest.updatedAt ? new Date(latest.updatedAt).getTime() : 0;
+        setIsOutdated(remoteUpdated > localUpdated);
+      } catch {
+      }
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, [isEdit, resolver, mapped, attrs.id, attrs.updatedAt]);
+  return { isEdit, interactive, ind, mapped, isMissing, isOutdated };
+}
+
+export {
+  useControl
+};

package/dist/chunk-A7FWOQDN.mjs

@@ -0,0 +1,210 @@
+"use client";
+import {
+  getIndicatorProps
+} from "./chunk-AQTNFDGA.mjs";
+import {
+  messages
+} from "./chunk-D53W4HWR.mjs";
+
+// src/components/control-picker.tsx
+import { Autocomplete, Button, Chip, Label, Spinner } from "@kopexa/sight";
+import { useEffect, useId, useMemo, useState } from "react";
+import { useIntl } from "react-intl";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function ControlPicker({
+  resolver,
+  value,
+  onChange,
+  debounceMs = 300,
+  timeoutMs = 5e3,
+  initialQuery = "",
+  showItemStatus = true
+}) {
+  const intl = useIntl();
+  const searchId = useId();
+  const [search, setSearch] = useState(initialQuery);
+  const [debouncedSearch, setDebouncedSearch] = useState(search);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const [results, setResults] = useState([]);
+  useEffect(() => {
+    const t = setTimeout(() => setDebouncedSearch(search), debounceMs);
+    return () => clearTimeout(t);
+  }, [search, debounceMs]);
+  useEffect(() => {
+    if (!(resolver == null ? void 0 : resolver.getControls)) return;
+    let ignore = false;
+    (async () => {
+      setLoading(true);
+      setError(null);
+      try {
+        const p = resolver.getControls(debouncedSearch);
+        const data = await Promise.race([
+          p,
+          new Promise(
+            (_, rej) => setTimeout(
+              () => rej(new Error(intl.formatMessage(messages.error_timeout))),
+              timeoutMs
+            )
+          )
+        ]);
+        if (!ignore) setResults(data);
+      } catch (e) {
+        if (!ignore) {
+          setError(
+            e instanceof Error ? e.message : intl.formatMessage(messages.error_loading)
+          );
+          setResults([]);
+        }
+      } finally {
+        if (!ignore) setLoading(false);
+      }
+    })();
+    return () => {
+      ignore = true;
+    };
+  }, [debouncedSearch, resolver, timeoutMs, intl]);
+  const statusNode = useMemo(() => {
+    if (loading)
+      return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(Spinner, { size: "sm" }),
+        /* @__PURE__ */ jsx("span", { children: intl.formatMessage(messages.searching) })
+      ] });
+    if (error) return /* @__PURE__ */ jsx("span", { className: "text-destructive text-sm", children: error });
+    if (results.length === 0 && debouncedSearch)
+      return /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-sm", children: intl.formatMessage(messages.no_results, { query: debouncedSearch }) });
+    if (results.length > 0)
+      return /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-sm", children: intl.formatMessage(messages.results_count, {
+        count: results.length
+      }) });
+    return /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-sm", children: intl.formatMessage(messages.search_hint) });
+  }, [loading, error, results.length, debouncedSearch, intl]);
+  const itemToStringValue = (item) => {
+    var _a, _b;
+    return (_b = (_a = item == null ? void 0 : item.title) != null ? _a : item == null ? void 0 : item.id) != null ? _b : "";
+  };
+  const highlight = (text) => {
+    const t = (text != null ? text : "").toString();
+    const q = debouncedSearch.trim();
+    if (!q) return t;
+    const i = t.toLowerCase().indexOf(q.toLowerCase());
+    if (i === -1) return t;
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      t.slice(0, i),
+      /* @__PURE__ */ jsx("mark", { className: "bg-primary/15 rounded px-0.5", children: t.slice(i, i + q.length) }),
+      t.slice(i + q.length)
+    ] });
+  };
+  const indicator = getIndicatorProps(value == null ? void 0 : value.status, {
+    mapped: !!(value == null ? void 0 : value.id),
+    enable: showItemStatus
+  });
+  const selInd = value ? indicator : {
+    indicator: false,
+    indicatorColor: "default"
+  };
+  const handleClear = () => {
+    onChange(null);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+      /* @__PURE__ */ jsx(Label, { htmlFor: searchId, children: intl.formatMessage(messages.controls) }),
+      /* @__PURE__ */ jsxs(
+        Autocomplete,
+        {
+          items: results,
+          value: search,
+          onValueChange: setSearch,
+          filter: null,
+          itemToStringValue,
+          children: [
+            /* @__PURE__ */ jsxs(Autocomplete.Control, { children: [
+              /* @__PURE__ */ jsx(
+                Autocomplete.Input,
+                {
+                  id: searchId,
+                  placeholder: intl.formatMessage(messages.search_placeholder)
+                }
+              ),
+              search && /* @__PURE__ */ jsx(Autocomplete.Clear, {})
+            ] }),
+            /* @__PURE__ */ jsxs(Autocomplete.Content, { children: [
+              /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-10 bg-background border-b px-2 py-1", children: /* @__PURE__ */ jsx(Autocomplete.Status, { children: statusNode }) }),
+              /* @__PURE__ */ jsx(Autocomplete.List, { children: (c) => {
+                var _a, _b, _c;
+                const id = (_a = c.id) != null ? _a : crypto.randomUUID();
+                const active = (value == null ? void 0 : value.id) && c.id === value.id;
+                const ind = getIndicatorProps(c.status, {
+                  mapped: !!c.id,
+                  enable: showItemStatus
+                });
+                return /* @__PURE__ */ jsx(
+                  Autocomplete.Item,
+                  {
+                    value: c,
+                    className: "rounded-lg data-[active=true]:bg-muted",
+                    "data-active": active ? "true" : void 0,
+                    "aria-selected": active ? "true" : "false",
+                    onClick: () => onChange(c),
+                    children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5 truncate", children: [
+                      /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+                        /* @__PURE__ */ jsx("div", { className: "font-medium truncate", children: highlight((_b = c.title) != null ? _b : c.id) }),
+                        /* @__PURE__ */ jsxs("div", { className: "text-sm text-muted-foreground truncate", children: [
+                          highlight((_c = c.id) != null ? _c : ""),
+                          c.updatedAt ? ` \u2022 ${intl.formatMessage(messages.updated_at, {
+                            date: intl.formatDate(new Date(c.updatedAt), {
+                              year: "numeric",
+                              month: "short",
+                              day: "2-digit",
+                              hour: "2-digit",
+                              minute: "2-digit"
+                            })
+                          })}` : ""
+                        ] })
+                      ] }),
+                      showItemStatus && c.status && /* @__PURE__ */ jsx(
+                        Chip,
+                        {
+                          size: "sm",
+                          variant: "ghost",
+                          indicator: ind.indicator,
+                          indicatorColor: ind.indicatorColor,
+                          indicatorVariant: ind.indicatorVariant,
+                          status: c.status,
+                          children: c.status
+                        }
+                      )
+                    ] })
+                  },
+                  id
+                );
+              } })
+            ] })
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2 border rounded-md px-3 py-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 min-w-0", children: [
+        /* @__PURE__ */ jsx(Label, { children: intl.formatMessage(messages.selected) }),
+        value ? /* @__PURE__ */ jsx(
+          Chip,
+          {
+            size: "sm",
+            variant: "bordered",
+            indicator: selInd.indicator,
+            indicatorColor: selInd.indicatorColor,
+            indicatorVariant: selInd.indicatorVariant,
+            status: showItemStatus ? value == null ? void 0 : value.status : void 0,
+            children: value.title
+          }
+        ) : /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-sm", children: intl.formatMessage(messages.no_control_selected) })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "flex gap-1", children: /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: handleClear, disabled: !value, children: intl.formatMessage(messages.clear) }) })
+    ] })
+  ] });
+}
+
+export {
+  ControlPicker
+};

package/dist/chunk-AQTNFDGA.mjs

@@ -0,0 +1,57 @@
+"use client";
+
+// src/utils/status-indicator.ts
+function norm(status) {
+  return (status != null ? status : "").trim().replace(/[\s-]+/g, "_").toUpperCase();
+}
+function colorForStatusKey(key) {
+  switch (key == null ? void 0 : key.toUpperCase()) {
+    case "FULFILLED_MANUAL":
+    case "FULFILLED_AUTO":
+    case "IMPLEMENTED":
+    case "APPROVED":
+    case "PASSED":
+      return "success";
+    case "IN_PROGRESS":
+    case "NEEDS_APPROVAL":
+    case "CHANGES_REQUESTED":
+    case "PENDING":
+    case "PARTIAL":
+      return "warning";
+    case "FAILED":
+    case "REJECTED":
+      return "destructive";
+    case "OUT_OF_SCOPE":
+    case "PREPARING":
+      return "secondary";
+    default:
+      return "default";
+  }
+}
+function getIndicatorProps(status, opts) {
+  var _a, _b;
+  const mapped = (_a = opts == null ? void 0 : opts.mapped) != null ? _a : true;
+  const enable = (_b = opts == null ? void 0 : opts.enable) != null ? _b : true;
+  if (!enable) {
+    return { indicator: false, indicatorColor: "default" };
+  }
+  if (!mapped) {
+    return {
+      indicator: true,
+      indicatorColor: "destructive",
+      indicatorVariant: "pulse"
+    };
+  }
+  const key = norm(status);
+  const indicatorColor = colorForStatusKey(key);
+  const shouldPulse = key === "IN_PROGRESS" || key === "NEEDS_APPROVAL" || key === "CHANGES_REQUESTED" || key === "PENDING";
+  return {
+    indicator: true,
+    indicatorColor,
+    ...shouldPulse ? { indicatorVariant: "pulse" } : {}
+  };
+}
+
+export {
+  getIndicatorProps
+};

package/dist/chunk-D53W4HWR.mjs

@@ -0,0 +1,245 @@
+"use client";
+
+// src/messages/index.ts
+import { defineMessages } from "react-intl";
+var messages = defineMessages({
+  control: {
+    id: "editor.controlref.control",
+    defaultMessage: "Control",
+    description: "Label for control"
+  },
+  settings_dialog_description: {
+    id: "editor.controlref.settings_dialog_description",
+    defaultMessage: "Customize the appearance and details of the control reference.",
+    description: "Description for the settings dialog"
+  },
+  controls: {
+    id: "editor.controlref.controls",
+    defaultMessage: "Controls",
+    description: "Label for controls"
+  },
+  change_control: {
+    id: "editor.controlref.change_control",
+    defaultMessage: "Change Control",
+    description: "Label for change control button"
+  },
+  map_control: {
+    id: "editor.controlref.map_control",
+    defaultMessage: "Map Control",
+    description: "Label for map control button"
+  },
+  settings: {
+    id: "editor.controlref.settings",
+    defaultMessage: "Settings",
+    description: "Label for settings button"
+  },
+  appearance: {
+    id: "editor.controlref.appearance",
+    defaultMessage: "Appearance",
+    description: "Label for appearance section"
+  },
+  search_controls: {
+    id: "editor.controlref.search_controls",
+    defaultMessage: "Search controls\u2026",
+    description: "Placeholder for search controls input"
+  },
+  variant: {
+    id: "editor.controlref.variant",
+    defaultMessage: "Variante",
+    description: "Label for variant section"
+  },
+  variant_hint: {
+    id: "editor.controlref.variant_hint",
+    defaultMessage: "Choose a visual emphasis for this section.",
+    description: "Hint for variant section"
+  },
+  variant_chip: {
+    id: "editor.controlref.variant_chip",
+    defaultMessage: "Chip",
+    description: "Label for variant chip"
+  },
+  variant_card: {
+    id: "editor.controlref.variant_card",
+    defaultMessage: "Card",
+    description: "Label for variant card"
+  },
+  show_status: {
+    id: "editor.controlref.show_status",
+    defaultMessage: "Show Status",
+    description: "Label for show status toggle"
+  },
+  show_description: {
+    id: "editor.controlref.show_description",
+    defaultMessage: "Show Description",
+    description: "Label for show description toggle"
+  },
+  show_implementations: {
+    id: "editor.controlref.show_implementations",
+    defaultMessage: "Show Implementations",
+    description: "Label for show implementations toggle"
+  },
+  border: {
+    id: "editor.controlref.border",
+    defaultMessage: "Border",
+    description: "Label for border toggle"
+  },
+  shadow: {
+    id: "editor.controlref.shadow",
+    defaultMessage: "Shadow",
+    description: "Label for shadow toggle"
+  },
+  radius: {
+    id: "editor.controlref.radius",
+    defaultMessage: "Radius",
+    description: "Label for radius toggle"
+  },
+  spacing: {
+    id: "editor.controlref.spacing",
+    defaultMessage: "Spacing",
+    description: "Label for spacing section"
+  },
+  cancel: {
+    id: "editor.controlref.cancel",
+    defaultMessage: "Cancel",
+    description: "Label for cancel button"
+  },
+  save_settings: {
+    id: "editor.controlref.save_settings",
+    defaultMessage: "Save Settings",
+    description: "Label for save settings button"
+  },
+  unmapped_control: {
+    id: "editor.controlref.unmapped_control",
+    defaultMessage: "Unmapped Control",
+    description: "Fallback label when no control is selected"
+  },
+  control_with_title: {
+    id: "editor.controlref.control_with_title",
+    defaultMessage: "Control: {title}",
+    description: "Dialog title with selected control"
+  },
+  search_hint: {
+    id: "editor.controlref.search_hint",
+    defaultMessage: "Start typing to search by ID, title or status.",
+    description: "Empty search hint"
+  },
+  no_results: {
+    id: "editor.controlref.no_results",
+    defaultMessage: "No controls found for \u201C{query}\u201D. You can keep this chip unmapped.",
+    description: "Shown when no controls match search query"
+  },
+  results_count: {
+    id: "editor.controlref.results_count",
+    defaultMessage: "{count, plural, one {# result} other {# results}}",
+    description: "Number of search results"
+  },
+  updated_at: {
+    id: "editor.controlref.updated_at",
+    defaultMessage: "Updated {date}",
+    description: "Updated date label"
+  },
+  selected: {
+    id: "editor.controlref.selected",
+    defaultMessage: "Selected",
+    description: "Label for selected item area"
+  },
+  no_control_selected: {
+    id: "editor.controlref.no_control_selected",
+    defaultMessage: "No control selected",
+    description: "Empty state in selected area"
+  },
+  clear: {
+    id: "editor.controlref.clear",
+    defaultMessage: "Clear",
+    description: "Clear selection button"
+  },
+  unmap: {
+    id: "editor.controlref.unmap",
+    defaultMessage: "Unmap",
+    description: "Unmap selection button"
+  },
+  live_preview: {
+    id: "editor.controlref.live_preview",
+    defaultMessage: "Live preview",
+    description: "Live preview section title"
+  },
+  display_options: {
+    id: "editor.controlref.display_options",
+    defaultMessage: "Display options",
+    description: "Display options section title"
+  },
+  show_status_indicator: {
+    id: "editor.controlref.show_status_indicator",
+    defaultMessage: "Show status indicator",
+    description: "Toggle for showing indicator"
+  },
+  searching: {
+    id: "editor.controlref.searching",
+    defaultMessage: "Searching\u2026",
+    description: "Loading indicator text"
+  },
+  map_control_aria: {
+    id: "editor.controlref.map_control_aria",
+    defaultMessage: "Map control",
+    description: "ARIA label for mapping control"
+  },
+  outdated_badge: {
+    id: "editor.controlref.outdated_badge",
+    defaultMessage: "A newer revision exists",
+    description: "Badge for outdated controls"
+  },
+  missing_badge: {
+    id: "editor.controlref.missing_badge",
+    defaultMessage: "Control no longer exists",
+    description: "Badge for missing controls"
+  },
+  error_loading: {
+    id: "editor.controlref.error_loading",
+    defaultMessage: "Failed to load controls",
+    description: "Error message when failing to load controls"
+  },
+  error_timeout: {
+    id: "editor.controlref.error_timeout",
+    defaultMessage: "The request timed out. Please try again.",
+    description: "Error message when the request times out"
+  },
+  missing_callout: {
+    id: "editor.controlref.missing_callout",
+    defaultMessage: "The currently mapped control could not be found. It may have been deleted or you may not have access to it anymore. Please select a different control.",
+    description: "Callout message when the selected control is missing"
+  },
+  outdated_callout: {
+    id: "editor.controlref.outdated_callout",
+    defaultMessage: "A newer revision of the currently mapped control exists. Consider updating to the latest version by re-selecting it below.",
+    description: "Callout message when the selected control is outdated"
+  },
+  search_placeholder: {
+    id: "editor.controlref.search_placeholder",
+    defaultMessage: "e.g. CTRL-001, Asset Inventory\u2026",
+    description: "Placeholder for search controls input"
+  },
+  control_implementations: {
+    id: "editor.controlref.control_implementations",
+    defaultMessage: "Implementations",
+    description: "Label for control implementations section"
+  },
+  header_status: {
+    id: "editor.controlblock.header_status",
+    defaultMessage: "Show status in header",
+    description: "Label for show status in header toggle"
+  },
+  header_status_aria: {
+    id: "editor.controlblock.header_status_aria",
+    defaultMessage: "Toggle status chip in card header",
+    description: "ARIA label for show status in header toggle"
+  },
+  header_status_avv_tip: {
+    id: "editor.controlblock.header_status_avv_tip",
+    defaultMessage: "If this document is intended for use or export as a data processing agreement (AVV), disable this option unless you explicitly want to publish the current control status.",
+    description: "Tooltip for show status in header toggle when used in AVV documents"
+  }
+});
+
+export {
+  messages
+};

package/dist/chunk-FTEE5U3H.mjs

@@ -0,0 +1,37 @@
+"use client";
+import {
+  createControlImplementation
+} from "./chunk-XHD2KFKQ.mjs";
+import {
+  getControlNodeTypes
+} from "./chunk-ZUR6XKMG.mjs";
+import {
+  DEFAULT_CONTROL_REF_OPTIONS
+} from "./chunk-JM66CQVD.mjs";
+
+// src/utils/create-control-block.ts
+function createControlBlock(schema, implementations) {
+  const types = getControlNodeTypes(schema);
+  const attrs = {
+    id: null,
+    title: null,
+    status: null,
+    updatedAt: null,
+    options: DEFAULT_CONTROL_REF_OPTIONS
+  };
+  const implNodes = [];
+  if (implementations == null ? void 0 : implementations.length) {
+    for (const impl of implementations) {
+      const n = createControlImplementation(types.controlImplementation, impl);
+      if (n) implNodes.push(n);
+    }
+  }
+  if (implNodes.length > 0) {
+    return types.controlBlock.createCheck(attrs, null);
+  }
+  return types.controlBlock.createAndFill();
+}
+
+export {
+  createControlBlock
+};