@vertebr/react 0.9.0 → 0.11.0

package/dist/components/admin/routes.js

@@ -25,6 +25,8 @@ export function pathForSelection(selection, catalog) {
             return "/overview";
         case "sync":
             return "/sync";
+        case "audit":
+            return "/audit";
         case "addons":
             return "/addons";
         case "addon":
@@ -85,6 +87,8 @@ export function selectionFromPath(pathname, basePath, catalog) {
         return { kind: "overview" };
     if (head === "sync")
         return { kind: "sync" };
+    if (head === "audit")
+        return { kind: "audit" };
     if (head === "addons") {
         if (!tail[0])
             return { kind: "addons" };
@@ -154,6 +158,9 @@ export function coerceSelection(selection, catalog) {
     if (selection.kind === "sync") {
         return catalog.sync?.enabled ? selection : defaultSelection(catalog);
     }
+    if (selection.kind === "audit") {
+        return catalog.audit ? selection : defaultSelection(catalog);
+    }
     if (selection.kind === "addons") {
         return catalog.addons?.length ? selection : defaultSelection(catalog);
     }
@@ -190,7 +197,12 @@ export function selectionsEqual(a, b) {
         return a === b;
     if (a.kind !== b.kind)
         return false;
-    if (a.kind === "overview" || a.kind === "gallery" || a.kind === "fontLibrary" || a.kind === "sync" || a.kind === "addons") {
+    if (a.kind === "overview" ||
+        a.kind === "gallery" ||
+        a.kind === "fontLibrary" ||
+        a.kind === "sync" ||
+        a.kind === "audit" ||
+        a.kind === "addons") {
         return true;
     }
     if (a.kind === "addon" && b.kind === "addon")

package/dist/components/admin/types.d.ts

@@ -47,6 +47,8 @@ export type Selection = {
 } | {
     kind: "emails";
     tab?: EmailsTab;
+} | {
+    kind: "audit";
 } | {
     kind: "config";
     id: string;

package/dist/components/admin/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/admin/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,kDAAkD;IAClD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gEAAgE;IAChE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,4CAA4C;IAC5C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,uDAAuD;IACvD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sDAAsD;IACtD,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,oEAAoE;IACpE,cAAc,CAAC,EAAE,MACb,MAAM,GACN,IAAI,GACJ,SAAS,GACT,OAAO,CAAC,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACvC,iDAAiD;IACjD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACxC,CAAC;AAEF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;AAE7D,MAAM,MAAM,OAAO,GAAG,CAAC,KAAK,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,KAAK,YAAY,CAAC;AAEtE,MAAM,MAAM,SAAS,GACjB;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,GACpB;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,GAChB;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,GAClB;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,GAC7B;IAAE,IAAI,EAAE,UAAU,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAChD;IAAE,IAAI,EAAE,SAAS,CAAA;CAAE,GACnB;IAAE,IAAI,EAAE,aAAa,CAAA;CAAE,GACvB;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,GAAG,CAAC,EAAE,SAAS,CAAA;CAAE,GACnC;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,GAC9B,IAAI,CAAC;AAET,MAAM,MAAM,YAAY,GAAG;IACzB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,KAAK,CAAC;QACf,GAAG,EAAE,MAAM,CAAC;QACZ,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,OAAO,CAAC;QAChB,QAAQ,EAAE,MAAM,IAAI,CAAC;KACtB,CAAC,CAAC;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/admin/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,kDAAkD;IAClD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gEAAgE;IAChE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,4CAA4C;IAC5C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,uDAAuD;IACvD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sDAAsD;IACtD,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,oEAAoE;IACpE,cAAc,CAAC,EAAE,MACb,MAAM,GACN,IAAI,GACJ,SAAS,GACT,OAAO,CAAC,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACvC,iDAAiD;IACjD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACxC,CAAC;AAEF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;AAE7D,MAAM,MAAM,OAAO,GAAG,CAAC,KAAK,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,KAAK,YAAY,CAAC;AAEtE,MAAM,MAAM,SAAS,GACjB;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,GACpB;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,GAChB;IAAE,IAAI,EAAE,QAAQ,CAAA;CAAE,GAClB;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,GAC7B;IAAE,IAAI,EAAE,UAAU,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAChD;IAAE,IAAI,EAAE,SAAS,CAAA;CAAE,GACnB;IAAE,IAAI,EAAE,aAAa,CAAA;CAAE,GACvB;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,GAAG,CAAC,EAAE,SAAS,CAAA;CAAE,GACnC;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,GACjB;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,GAC9B,IAAI,CAAC;AAET,MAAM,MAAM,YAAY,GAAG;IACzB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,KAAK,CAAC;QACf,GAAG,EAAE,MAAM,CAAC;QACZ,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,OAAO,CAAC;QAChB,QAAQ,EAAE,MAAM,IAAI,CAAC;KACtB,CAAC,CAAC;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB,CAAC"}

package/dist/components/config/DatetimeInput.d.ts

@@ -0,0 +1,15 @@
+export type DatetimeInputProps = {
+    id: string;
+    name?: string;
+    value: unknown;
+    readOnly?: boolean;
+    onBlur?: () => void;
+    onChange: (next: string) => void;
+    inputRef?: React.Ref<HTMLButtonElement>;
+};
+/** @deprecated Prefer parts helpers; kept for callers/tests. */
+export declare function toDatetimeLocalValue(value: unknown): string;
+/** @deprecated Prefer parts helpers; kept for callers/tests. */
+export declare function fromDatetimeLocalValue(local: string): string;
+export declare function DatetimeInput({ id, name, value, readOnly, onBlur, onChange, inputRef, }: DatetimeInputProps): import("react").JSX.Element;
+//# sourceMappingURL=DatetimeInput.d.ts.map

package/dist/components/config/DatetimeInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatetimeInput.d.ts","sourceRoot":"","sources":["../../../src/components/config/DatetimeInput.tsx"],"names":[],"mappings":"AAIA,MAAM,MAAM,kBAAkB,GAAG;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;CACzC,CAAC;AAsMF,gEAAgE;AAChE,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,CAI3D;AAED,gEAAgE;AAChE,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAM5D;AAuED,wBAAgB,aAAa,CAAC,EAC5B,EAAE,EACF,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,QAAQ,GACT,EAAE,kBAAkB,+BAgQpB"}

package/dist/components/config/DatetimeInput.js

@@ -0,0 +1,287 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as Popover from "@radix-ui/react-popover";
+import { useEffect, useId, useMemo, useState } from "react";
+import { DayPicker } from "react-day-picker";
+function pad(n) {
+    return String(n).padStart(2, "0");
+}
+function browserTimeZone() {
+    return Intl.DateTimeFormat().resolvedOptions().timeZone || "UTC";
+}
+const TIME_ZONES = [
+    { id: "America/New_York", label: "Eastern (ET)" },
+    { id: "America/Chicago", label: "Central (CT)" },
+    { id: "America/Denver", label: "Mountain (MT)" },
+    { id: "America/Los_Angeles", label: "Pacific (PT)" },
+    { id: "America/Phoenix", label: "Arizona (MST)" },
+    { id: "America/Anchorage", label: "Alaska (AKT)" },
+    { id: "Pacific/Honolulu", label: "Hawaii (HST)" },
+    { id: "UTC", label: "UTC" },
+    { id: "Europe/London", label: "London (GMT/BST)" },
+    { id: "Europe/Paris", label: "Central Europe (CET)" },
+    { id: "Asia/Tokyo", label: "Tokyo (JST)" },
+    { id: "Australia/Sydney", label: "Sydney (AEST)" },
+];
+function timeZoneOptions(current) {
+    const known = new Set(TIME_ZONES.map((zone) => zone.id));
+    if (known.has(current))
+        return TIME_ZONES;
+    return [{ id: current, label: current.replace(/_/g, " ") }, ...TIME_ZONES];
+}
+function zonedParts(instant, timeZone) {
+    const bits = Object.fromEntries(new Intl.DateTimeFormat("en-US", {
+        timeZone,
+        year: "numeric",
+        month: "2-digit",
+        day: "2-digit",
+        hour: "2-digit",
+        minute: "2-digit",
+        hourCycle: "h23",
+    })
+        .formatToParts(instant)
+        .filter((part) => part.type !== "literal")
+        .map((part) => [part.type, part.value]));
+    return {
+        date: `${bits.year}-${bits.month}-${bits.day}`,
+        time: `${bits.hour}:${bits.minute}`,
+    };
+}
+/** Wall-clock date/time in `timeZone` → UTC ISO. */
+function toIsoInZone(parts, timeZone) {
+    if (!parts.date)
+        return "";
+    const time = parts.time || "00:00";
+    const dateBits = parts.date.split("-").map(Number);
+    const timeBits = time.split(":").map(Number);
+    const year = dateBits[0];
+    const month = dateBits[1];
+    const day = dateBits[2];
+    const hour = timeBits[0];
+    const minute = timeBits[1];
+    if (year === undefined ||
+        month === undefined ||
+        day === undefined ||
+        hour === undefined ||
+        minute === undefined ||
+        ![year, month, day, hour, minute].every(Number.isFinite)) {
+        return "";
+    }
+    const desired = Date.UTC(year, month - 1, day, hour, minute, 0);
+    let utcMs = desired;
+    for (let i = 0; i < 2; i += 1) {
+        const shown = zonedParts(new Date(utcMs), timeZone);
+        const shownDate = shown.date.split("-").map(Number);
+        const shownTime = shown.time.split(":").map(Number);
+        const sy = shownDate[0];
+        const sm = shownDate[1];
+        const sd = shownDate[2];
+        const sh = shownTime[0];
+        const smin = shownTime[1];
+        if (sy === undefined ||
+            sm === undefined ||
+            sd === undefined ||
+            sh === undefined ||
+            smin === undefined) {
+            break;
+        }
+        const asUtc = Date.UTC(sy, sm - 1, sd, sh, smin, 0);
+        utcMs -= asUtc - desired;
+    }
+    return new Date(utcMs).toISOString();
+}
+function partsFromValue(value, timeZone) {
+    if (typeof value !== "string")
+        return { date: "", time: "" };
+    const trimmed = value.trim();
+    if (!trimmed)
+        return { date: "", time: "" };
+    const ms = Date.parse(trimmed);
+    if (Number.isFinite(ms))
+        return zonedParts(new Date(ms), timeZone);
+    const match = trimmed.match(/^(\d{4}-\d{2}-\d{2})(?:[T\s](\d{2}:\d{2})(?::\d{2})?)?/);
+    if (!match)
+        return { date: "", time: "" };
+    return { date: match[1] ?? "", time: match[2] ?? "00:00" };
+}
+function to24h(hour12, meridiem) {
+    const hour = ((hour12 - 1) % 12) + 1;
+    if (meridiem === "AM")
+        return hour === 12 ? 0 : hour;
+    return hour === 12 ? 12 : hour + 12;
+}
+function toClock(time) {
+    const [hRaw, mRaw] = (time || "12:00").split(":");
+    let hour24 = Number(hRaw);
+    const minute = pad(Number.isFinite(Number(mRaw)) ? Number(mRaw) : 0);
+    if (!Number.isFinite(hour24))
+        hour24 = 12;
+    const meridiem = hour24 >= 12 ? "PM" : "AM";
+    const hour12 = hour24 % 12 === 0 ? 12 : hour24 % 12;
+    return { hour12: String(hour12), minute, meridiem };
+}
+function fromClock(clock) {
+    const hour12 = Number(clock.hour12);
+    const safeHour = Number.isFinite(hour12) ? hour12 : 12;
+    return `${pad(to24h(safeHour, clock.meridiem))}:${clock.minute || "00"}`;
+}
+function dateFromYmd(ymd) {
+    if (!ymd)
+        return undefined;
+    const [year, month, day] = ymd.split("-").map(Number);
+    if (!year || !month || !day)
+        return undefined;
+    return new Date(year, month - 1, day);
+}
+function ymdFromDate(date) {
+    return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`;
+}
+function formatDateLabel(ymd) {
+    const date = dateFromYmd(ymd);
+    if (!date)
+        return "mm/dd/yyyy";
+    return new Intl.DateTimeFormat(undefined, {
+        month: "short",
+        day: "numeric",
+        year: "numeric",
+    }).format(date);
+}
+function formatTimeLabel(time) {
+    if (!time)
+        return "--:-- --";
+    const clock = toClock(time);
+    return `${clock.hour12}:${clock.minute} ${clock.meridiem}`;
+}
+function formatTimeZoneShort(timeZone, instant = new Date()) {
+    const part = new Intl.DateTimeFormat("en-US", {
+        timeZone,
+        timeZoneName: "short",
+    })
+        .formatToParts(instant)
+        .find((item) => item.type === "timeZoneName");
+    return part?.value ?? timeZone;
+}
+function formatSummary(parts, timeZone) {
+    if (!parts.date)
+        return null;
+    const iso = toIsoInZone(parts, timeZone);
+    if (!iso)
+        return null;
+    const instant = new Date(iso);
+    const when = new Intl.DateTimeFormat(undefined, {
+        timeZone,
+        weekday: "short",
+        month: "short",
+        day: "numeric",
+        year: "numeric",
+        hour: "numeric",
+        minute: "2-digit",
+    }).format(instant);
+    return `${when} ${formatTimeZoneShort(timeZone, instant)}`;
+}
+/** @deprecated Prefer parts helpers; kept for callers/tests. */
+export function toDatetimeLocalValue(value) {
+    const parts = partsFromValue(value, browserTimeZone());
+    if (!parts.date)
+        return "";
+    return `${parts.date}T${parts.time || "00:00"}`;
+}
+/** @deprecated Prefer parts helpers; kept for callers/tests. */
+export function fromDatetimeLocalValue(local) {
+    const trimmed = local.trim();
+    if (!trimmed)
+        return "";
+    const ms = Date.parse(trimmed);
+    if (!Number.isFinite(ms))
+        return "";
+    return new Date(ms).toISOString();
+}
+const HOURS_12 = Array.from({ length: 12 }, (_, i) => String(i + 1));
+const MINUTES = Array.from({ length: 60 }, (_, i) => pad(i));
+function IconCalendar() {
+    return (_jsxs("svg", { className: "vertebr-datetime-icon", width: "16", height: "16", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [_jsx("rect", { x: "3", y: "4.5", width: "14", height: "12", rx: "2", stroke: "currentColor", strokeWidth: "1.5" }), _jsx("path", { d: "M3 8.5h14M7 3v3M13 3v3", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })] }));
+}
+function IconClock() {
+    return (_jsxs("svg", { className: "vertebr-datetime-icon", width: "16", height: "16", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [_jsx("circle", { cx: "10", cy: "10", r: "7", stroke: "currentColor", strokeWidth: "1.5" }), _jsx("path", { d: "M10 6.5V10l2.5 1.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }));
+}
+function IconChevron({ direction }) {
+    return (_jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", "aria-hidden": "true", children: _jsx("path", { d: direction === "left" ? "M8.5 3.5 5 7l3.5 3.5" : "M5.5 3.5 9 7l-3.5 3.5", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+}
+export function DatetimeInput({ id, name, value, readOnly, onBlur, onChange, inputRef, }) {
+    const labelId = useId();
+    const [open, setOpen] = useState(false);
+    const [timeZone, setTimeZone] = useState(browserTimeZone);
+    const [parts, setParts] = useState(() => partsFromValue(value, browserTimeZone()));
+    const summary = useMemo(() => formatSummary(parts, timeZone), [parts, timeZone]);
+    const selected = useMemo(() => dateFromYmd(parts.date), [parts.date]);
+    const clock = useMemo(() => toClock(parts.time || "12:00"), [parts.time]);
+    const zones = useMemo(() => timeZoneOptions(timeZone), [timeZone]);
+    useEffect(() => {
+        setParts(partsFromValue(value, timeZone));
+        // Re-parse when the stored ISO changes; timezone switches keep wall-clock
+        // and rewrite ISO via onTimeZoneChange instead.
+        // eslint-disable-next-line react-hooks/exhaustive-deps -- intentional
+    }, [value]);
+    const commit = (next, zone = timeZone) => {
+        setParts(next);
+        onChange(toIsoInZone(next, zone));
+    };
+    const setClock = (next) => {
+        const time = fromClock(next);
+        if (!parts.date) {
+            commit({ date: ymdFromDate(new Date()), time });
+            return;
+        }
+        commit({ date: parts.date, time });
+    };
+    const onTimeZoneChange = (nextZone) => {
+        setTimeZone(nextZone);
+        if (!parts.date)
+            return;
+        // Keep the wall-clock launch time; reinterpret in the new zone.
+        onChange(toIsoInZone(parts, nextZone));
+    };
+    return (_jsxs("div", { className: "vertebr-datetime", "data-empty": parts.date ? "false" : "true", children: [_jsxs(Popover.Root, { open: readOnly ? false : open, onOpenChange: (next) => {
+                    if (readOnly)
+                        return;
+                    setOpen(next);
+                    if (!next)
+                        onBlur?.();
+                }, children: [_jsxs("div", { className: "vertebr-datetime-shell", children: [_jsx(Popover.Trigger, { asChild: true, children: _jsxs("button", { id: id, ref: inputRef, type: "button", name: name, className: "vertebr-datetime-cell", disabled: readOnly, "aria-labelledby": `${labelId}-date ${labelId}-time`, children: [_jsxs("span", { className: "vertebr-datetime-cell-inner", children: [_jsx(IconCalendar, {}), _jsxs("span", { className: "vertebr-datetime-cell-copy", children: [_jsx("span", { className: "vertebr-datetime-cell-label", id: `${labelId}-date`, children: "Date" }), _jsx("span", { className: "vertebr-datetime-value", "data-empty": parts.date ? "false" : "true", children: formatDateLabel(parts.date) })] })] }), _jsx("span", { className: "vertebr-datetime-divider", "aria-hidden": "true" }), _jsxs("span", { className: "vertebr-datetime-cell-inner", children: [_jsx(IconClock, {}), _jsxs("span", { className: "vertebr-datetime-cell-copy", children: [_jsx("span", { className: "vertebr-datetime-cell-label", id: `${labelId}-time`, children: "Time" }), _jsx("span", { className: "vertebr-datetime-value", "data-empty": parts.time ? "false" : "true", children: parts.time
+                                                                ? `${formatTimeLabel(parts.time)} ${formatTimeZoneShort(timeZone)}`
+                                                                : "--:-- --" })] })] })] }) }), parts.date && !readOnly ? (_jsx("button", { type: "button", className: "vertebr-datetime-clear", "aria-label": "Clear date and time", onClick: () => {
+                                    commit({ date: "", time: "" });
+                                    setOpen(false);
+                                }, children: "Clear" })) : null] }), _jsx(Popover.Portal, { children: _jsxs(Popover.Content, { className: "vertebr-datetime-popover", align: "start", sideOffset: 8, collisionPadding: 12, onOpenAutoFocus: (event) => event.preventDefault(), children: [_jsx(DayPicker, { mode: "single", navLayout: "around", selected: selected, defaultMonth: selected ?? new Date(), onSelect: (day) => {
+                                        if (!day)
+                                            return;
+                                        commit({
+                                            date: ymdFromDate(day),
+                                            time: parts.time || fromClock({ hour12: "12", minute: "00", meridiem: "PM" }),
+                                        });
+                                    }, className: "vertebr-day-picker", classNames: {
+                                        root: "vertebr-day-picker",
+                                        months: "vertebr-day-picker-months",
+                                        month: "vertebr-day-picker-month",
+                                        month_caption: "vertebr-day-picker-caption",
+                                        month_grid: "vertebr-day-picker-grid",
+                                        caption_label: "vertebr-day-picker-caption-label",
+                                        nav: "vertebr-day-picker-nav",
+                                        button_previous: "vertebr-day-picker-nav-btn",
+                                        button_next: "vertebr-day-picker-nav-btn",
+                                        weekdays: "vertebr-day-picker-weekdays",
+                                        weekday: "vertebr-day-picker-weekday",
+                                        week: "vertebr-day-picker-week",
+                                        day: "vertebr-day-picker-day",
+                                        day_button: "vertebr-day-picker-day-btn",
+                                        selected: "vertebr-day-picker-selected",
+                                        today: "vertebr-day-picker-today",
+                                        outside: "vertebr-day-picker-outside",
+                                        disabled: "vertebr-day-picker-disabled",
+                                        hidden: "vertebr-day-picker-hidden",
+                                    }, components: {
+                                        Chevron: ({ orientation }) => (_jsx(IconChevron, { direction: orientation === "left" ? "left" : "right" })),
+                                    } }), _jsxs("div", { className: "vertebr-datetime-time-row", children: [_jsxs("label", { className: "vertebr-datetime-time-field", children: [_jsx("span", { children: "Hour" }), _jsx("select", { className: "vertebr-datetime-time-select", value: clock.hour12, onChange: (event) => setClock({ ...clock, hour12: event.target.value }), children: HOURS_12.map((value) => (_jsx("option", { value: value, children: value }, value))) })] }), _jsx("span", { className: "vertebr-datetime-time-sep", "aria-hidden": "true", children: ":" }), _jsxs("label", { className: "vertebr-datetime-time-field", children: [_jsx("span", { children: "Minute" }), _jsx("select", { className: "vertebr-datetime-time-select", value: clock.minute, onChange: (event) => setClock({ ...clock, minute: event.target.value }), children: MINUTES.map((value) => (_jsx("option", { value: value, children: value }, value))) })] }), _jsxs("label", { className: "vertebr-datetime-time-field vertebr-datetime-time-field-meridiem", children: [_jsx("span", { children: "AM/PM" }), _jsxs("select", { className: "vertebr-datetime-time-select", value: clock.meridiem, onChange: (event) => setClock({
+                                                        ...clock,
+                                                        meridiem: event.target.value,
+                                                    }), children: [_jsx("option", { value: "AM", children: "AM" }), _jsx("option", { value: "PM", children: "PM" })] })] })] }), _jsxs("label", { className: "vertebr-datetime-time-field vertebr-datetime-timezone", children: [_jsx("span", { children: "Timezone" }), _jsx("select", { className: "vertebr-datetime-time-select", value: timeZone, onChange: (event) => onTimeZoneChange(event.target.value), children: zones.map((zone) => (_jsx("option", { value: zone.id, children: zone.label }, zone.id))) })] })] }) })] }), summary ? (_jsx("p", { className: "vertebr-datetime-summary", children: summary })) : (_jsx("p", { className: "vertebr-datetime-summary vertebr-datetime-summary-empty", children: "Pick a launch date and time" }))] }));
+}

package/dist/components/config/EnumInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EnumInput.d.ts","sourceRoot":"","sources":["../../../src/components/config/EnumInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAGnD,MAAM,MAAM,cAAc,GAAG;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,WAAW,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC,CAAC;AAEF,wBAAgB,SAAS,CAAC,EACxB,EAAE,EACF,KAAK,EACL,KAAK,EACL,QAAQ,EACR,QAAQ,GACT,EAAE,cAAc,+BAmDhB"}
+{"version":3,"file":"EnumInput.d.ts","sourceRoot":"","sources":["../../../src/components/config/EnumInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAGnD,MAAM,MAAM,cAAc,GAAG;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,WAAW,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC,CAAC;AAEF,wBAAgB,SAAS,CAAC,EACxB,EAAE,EACF,KAAK,EACL,KAAK,EACL,QAAQ,EACR,QAAQ,GACT,EAAE,cAAc,+BAkDhB"}

package/dist/components/config/EnumInput.js

@@ -2,10 +2,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as Select from "@radix-ui/react-select";
 import { optionLabel } from "./form/helpers/labels";
 export function EnumInput({ id, value, field, readOnly, onChange, }) {
-    const options = field.options?.filter(Boolean) ?? [];
-    const current = typeof value === "string" && options.includes(value)
-        ? value
-        : (options[0] ?? "");
+    const baseOptions = field.options?.filter(Boolean) ?? [];
+    const raw = typeof value === "string" ? value : "";
+    const options = raw && !baseOptions.includes(raw) ? [raw, ...baseOptions] : baseOptions;
+    const current = raw && options.includes(raw) ? raw : (options[0] ?? "");
     if (options.length === 0) {
         return (_jsx("input", { id: id, type: "text", readOnly: readOnly, value: current, disabled: true }));
     }

package/dist/components/config/EnumListInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EnumListInput.d.ts","sourceRoot":"","sources":["../../../src/components/config/EnumListInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAGnD,MAAM,MAAM,kBAAkB,GAAG;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,WAAW,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACrC,CAAC;AAiBF,wBAAgB,aAAa,CAAC,EAC5B,EAAE,EACF,KAAK,EACL,KAAK,EACL,QAAQ,EACR,QAAQ,GACT,EAAE,kBAAkB,+BAiEpB"}
+{"version":3,"file":"EnumListInput.d.ts","sourceRoot":"","sources":["../../../src/components/config/EnumListInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAGnD,MAAM,MAAM,kBAAkB,GAAG;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,WAAW,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACrC,CAAC;AAyBF,wBAAgB,aAAa,CAAC,EAC5B,EAAE,EACF,KAAK,EACL,KAAK,EACL,QAAQ,EACR,QAAQ,GACT,EAAE,kBAAkB,+BAyEpB"}

package/dist/components/config/EnumListInput.js

@@ -1,9 +1,16 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { optionLabel } from "./form/helpers/labels";
 function asStringList(value) {
-    if (!Array.isArray(value))
-        return [];
-    return value.map((item) => String(item).trim()).filter(Boolean);
+    if (Array.isArray(value)) {
+        return value.map((item) => String(item).trim()).filter(Boolean);
+    }
+    if (typeof value === "string") {
+        return value
+            .split(",")
+            .map((item) => item.trim())
+            .filter(Boolean);
+    }
+    return [];
 }
 function orderedRows(options, selected) {
     const known = new Set(options);
@@ -18,6 +25,9 @@ export function EnumListInput({ id, value, field, readOnly, onChange, }) {
     const options = field.options?.filter(Boolean) ?? [];
     const selected = asStringList(value);
     const rows = orderedRows(options, selected);
+    if (options.length === 0) {
+        return (_jsx("p", { className: "vertebr-field-files-empty", id: id, children: "No products available in this environment." }));
+    }
     const commit = (nextRows) => {
         onChange(nextRows.filter((row) => row.on).map((row) => row.id));
     };

package/dist/components/config/ReferenceInput.d.ts

@@ -0,0 +1,11 @@
+import type { FieldSchema, VertebrClient } from "@vertebr/client";
+export type ReferenceInputProps = {
+    id?: string;
+    value: unknown;
+    field: FieldSchema;
+    client: VertebrClient;
+    readOnly?: boolean;
+    onChange: (value: string) => void;
+};
+export declare function ReferenceInput({ id: idProp, value, field, client, readOnly, onChange, }: ReferenceInputProps): import("react").JSX.Element;
+//# sourceMappingURL=ReferenceInput.d.ts.map

package/dist/components/config/ReferenceInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReferenceInput.d.ts","sourceRoot":"","sources":["../../../src/components/config/ReferenceInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAElE,MAAM,MAAM,mBAAmB,GAAG;IAChC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,WAAW,CAAC;IACnB,MAAM,EAAE,aAAa,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC,CAAC;AAuBF,wBAAgB,cAAc,CAAC,EAC7B,EAAE,EAAE,MAAM,EACV,KAAK,EACL,KAAK,EACL,MAAM,EACN,QAAQ,EACR,QAAQ,GACT,EAAE,mBAAmB,+BA0IrB"}

package/dist/components/config/ReferenceInput.js

@@ -0,0 +1,99 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useId, useRef, useState } from "react";
+function rowValue(row, valueField) {
+    const raw = row[valueField] ?? row.id ?? row.slug ?? row.uid;
+    if (typeof raw === "string" && raw.trim())
+        return raw;
+    if (typeof raw === "number")
+        return String(raw);
+    return null;
+}
+function rowLabel(row, labelField, value) {
+    const raw = row[labelField] ?? row.name ?? row.title ?? row.label ?? value;
+    return typeof raw === "string" && raw.trim() ? raw.trim() : value;
+}
+export function ReferenceInput({ id: idProp, value, field, client, readOnly, onChange, }) {
+    const autoId = useId();
+    const id = idProp ?? autoId;
+    const resource = field.reference?.resource ?? "";
+    const valueField = field.reference?.valueField ?? "id";
+    const labelField = field.reference?.labelField ?? "name";
+    const current = typeof value === "string" ? value : "";
+    const [query, setQuery] = useState("");
+    const [open, setOpen] = useState(false);
+    const [options, setOptions] = useState([]);
+    const [loading, setLoading] = useState(false);
+    const [displayLabel, setDisplayLabel] = useState(current);
+    const rootRef = useRef(null);
+    useEffect(() => {
+        setDisplayLabel(current);
+    }, [current]);
+    useEffect(() => {
+        if (!open || !resource || readOnly)
+            return;
+        let cancelled = false;
+        const handle = window.setTimeout(() => {
+            void (async () => {
+                setLoading(true);
+                try {
+                    const listed = await client.listResource(resource, {
+                        q: query.trim() || undefined,
+                        limit: 20,
+                        fresh: true,
+                    });
+                    if (cancelled)
+                        return;
+                    const next = [];
+                    for (const row of listed.items) {
+                        const v = rowValue(row, valueField);
+                        if (!v)
+                            continue;
+                        next.push({ value: v, label: rowLabel(row, labelField, v) });
+                    }
+                    setOptions(next);
+                }
+                catch {
+                    if (!cancelled)
+                        setOptions([]);
+                }
+                finally {
+                    if (!cancelled)
+                        setLoading(false);
+                }
+            })();
+        }, 180);
+        return () => {
+            cancelled = true;
+            window.clearTimeout(handle);
+        };
+    }, [open, query, resource, client, valueField, labelField, readOnly]);
+    useEffect(() => {
+        const onPointer = (event) => {
+            if (!rootRef.current?.contains(event.target)) {
+                setOpen(false);
+            }
+        };
+        document.addEventListener("mousedown", onPointer);
+        return () => document.removeEventListener("mousedown", onPointer);
+    }, []);
+    if (!resource) {
+        return (_jsx("input", { id: id, type: "text", readOnly: readOnly, value: current, onChange: (event) => onChange(event.target.value), placeholder: "Missing reference.resource" }));
+    }
+    return (_jsxs("div", { className: "vertebr-reference", ref: rootRef, "data-open": open || undefined, children: [_jsx("input", { id: id, type: "text", className: "vertebr-reference-input", readOnly: readOnly, value: open ? query : displayLabel || current, placeholder: "Search\u2026", autoComplete: "off", onFocus: () => {
+                    if (readOnly)
+                        return;
+                    setQuery("");
+                    setOpen(true);
+                }, onChange: (event) => {
+                    setQuery(event.target.value);
+                    setOpen(true);
+                } }), current && !readOnly ? (_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet vertebr-reference-clear", onClick: () => {
+                    onChange("");
+                    setDisplayLabel("");
+                    setQuery("");
+                }, children: "Clear" })) : null, open && !readOnly ? (_jsx("ul", { className: "vertebr-reference-menu", role: "listbox", children: loading ? (_jsx("li", { className: "vertebr-reference-empty", children: "Searching\u2026" })) : options.length === 0 ? (_jsx("li", { className: "vertebr-reference-empty", children: "No matches" })) : (options.map((option) => (_jsx("li", { children: _jsxs("button", { type: "button", role: "option", "aria-selected": option.value === current, className: "vertebr-reference-option", onClick: () => {
+                            onChange(option.value);
+                            setDisplayLabel(option.label);
+                            setOpen(false);
+                        }, children: [_jsx("span", { children: option.label }), _jsx("code", { children: option.value })] }) }, option.value)))) })) : null] }));
+}

package/dist/components/config/RevisionHistory.d.ts

@@ -0,0 +1,12 @@
+import type { VertebrClient } from "@vertebr/client";
+export type RevisionHistoryProps = {
+    client: VertebrClient;
+    configId: string;
+    onPublished?: () => void | Promise<void>;
+};
+/**
+ * Compact History control — opens revision list in a modal so the
+ * editor form stays the primary surface.
+ */
+export declare function RevisionHistory({ client, configId, onPublished, }: RevisionHistoryProps): import("react").JSX.Element;
+//# sourceMappingURL=RevisionHistory.d.ts.map

package/dist/components/config/RevisionHistory.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RevisionHistory.d.ts","sourceRoot":"","sources":["../../../src/components/config/RevisionHistory.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAgB,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGnE,MAAM,MAAM,oBAAoB,GAAG;IACjC,MAAM,EAAE,aAAa,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CAC1C,CAAC;AAoBF;;;GAGG;AACH,wBAAgB,eAAe,CAAC,EAC9B,MAAM,EACN,QAAQ,EACR,WAAW,GACZ,EAAE,oBAAoB,+BAuNtB"}