@loworbitstudio/visor 1.30.0 → 1.31.0

package/dist/CHANGELOG.json

@@ -1,6 +1,6 @@
 {
   "version": "0.4.0",
-  "generated_at": "2026-10-03T18:10:41.409Z",
+  "generated_at": "2026-10-03T23:23:41.697Z",
   "components": {
     "accessibility-specimen": {
       "changeType": "current",
@@ -14,6 +14,12 @@
       "breakingChange": false,
       "migrationNote": null
     },
+    "action-row": {
+      "changeType": "current",
+      "files": [],
+      "breakingChange": false,
+      "migrationNote": null
+    },
     "activity-feed": {
       "changeType": "current",
       "files": [],
@@ -746,6 +752,12 @@
       "breakingChange": false,
       "migrationNote": null
     },
+    "time-picker": {
+      "changeType": "current",
+      "files": [],
+      "breakingChange": false,
+      "migrationNote": null
+    },
     "timeline": {
       "changeType": "current",
       "files": [],

package/dist/index.js

@@ -8802,6 +8802,50 @@ var FIXTURES = {
           ])],
         };
       })()`
+    },
+    // VI-667: bottom-sheet presentation, with the drag handle and a leading back action.
+    sheet: {
+      export: "Dialog",
+      props: `(function () {
+        var h = React.createElement;
+        return {
+          open: true,
+          presentation: "sheet",
+          children: [h(__mod.DialogTrigger, { key: "tr", asChild: true }, h("button", { type: "button" }, "Open")), h(__mod.DialogContent, { key: "c", showHandle: true }, [
+            h(__mod.DialogHeader, { key: "h", back: h(__mod.DialogBack, null) }, [
+              h(__mod.DialogTitle, { key: "t" }, "Set start time"),
+              h(__mod.DialogDescription, { key: "d" }, "Doors open one hour earlier."),
+            ]),
+            h("input", { key: "i", "aria-label": "Start", defaultValue: "21:00", style: { width: "100%", boxSizing: "border-box", padding: "8px" } }),
+            h(__mod.DialogFooter, { key: "f" }, h("button", { type: "button" }, "Save")),
+          ])],
+        };
+      })()`
+    },
+    // VI-667: dialog scoped to one pane (#root) under a scrim; the page outside it is untouched.
+    scoped: {
+      export: "Dialog",
+      props: `(function () {
+        var h = React.createElement;
+        var pane = document.getElementById("root");
+        pane.style.minHeight = "420px";
+        pane.style.position = "relative";
+        pane.style.background = "var(--surface-card, #f3f4f6)";
+        return {
+          open: true,
+          container: pane,
+          children: [
+            h("p", { key: "p", style: { margin: 0, padding: "16px" } }, "Editor pane: stays visible behind the scrim."),
+            h(__mod.DialogContent, { key: "c" }, [
+              h(__mod.DialogHeader, { key: "h", back: h(__mod.DialogBack, null) }, [
+                h(__mod.DialogTitle, { key: "t" }, "Sign back in"),
+                h(__mod.DialogDescription, { key: "d" }, "Your session timed out."),
+              ]),
+              h(__mod.DialogFooter, { key: "f" }, h("button", { type: "button" }, "Continue")),
+            ]),
+          ],
+        };
+      })()`
     }
   },
   popover: {
@@ -8838,6 +8882,49 @@ var FIXTURES = {
       })()`
     }
   },
+  // VI-669: a block, resolved from blocks/. July 2026 with a stay crossing a week
+  // edge, three overlapping spans plus a fourth ("+1"), a colour-token event, a
+  // day mark, and the week detail slot open under the selected day.
+  "month-calendar": {
+    default: {
+      export: "MonthCalendar",
+      props: `(function () {
+        var h = React.createElement;
+        return {
+          month: "2026-07-01",
+          today: "2026-07-09",
+          selectedDate: "2026-07-15",
+          weekStartsOn: 1,
+          onSelectDate: function () {},
+          events: [
+            { id: "berlin", start: "2026-07-02", end: "2026-07-05", title: "Berlin stay", series: 1 },
+            { id: "lisbon", start: "2026-07-13", end: "2026-07-19", title: "Lisbon run", color: "--chart-3" },
+            { id: "paris", start: "2026-07-20", end: "2026-07-22", title: "Paris", series: 4 },
+            { id: "a", start: "2026-07-20", end: "2026-07-21", title: "Studio hold", series: 2 },
+            { id: "b", start: "2026-07-20", end: "2026-07-24", title: "Press week", series: 5 },
+            { id: "c", start: "2026-07-21", end: "2026-07-22", title: "Fourth lane", series: 3 },
+            { id: "gig", date: "2026-07-09", title: "Soundcheck", status: "success", series: 2 },
+          ],
+          renderDayMark: function (day) { return day.date === "2026-07-17" ? "3" : null; },
+          renderWeekDetail: function (week) {
+            return h("div", null, h("strong", null, "Week of " + week.start), h("p", { style: { margin: 0 } }, "Day sheet content sits here."));
+          },
+        };
+      })()`
+    },
+    overlap: {
+      export: "MonthCalendar",
+      props: `{
+        month: "2026-07-01",
+        events: [
+          { id: "a", start: "2026-07-07", end: "2026-07-11", title: "Stay A", series: 1 },
+          { id: "b", start: "2026-07-08", end: "2026-07-12", title: "Stay B", series: 2 },
+          { id: "c", start: "2026-07-09", end: "2026-07-10", title: "Stay C", series: 3 },
+          { id: "d", start: "2026-07-09", end: "2026-07-10", title: "Stay D", series: 4 },
+        ],
+      }`
+    }
+  },
   "stat-card": {
     default: {
       export: "StatCard",
@@ -9029,6 +9116,14 @@ var FIXTURES = {
     default: { export: "Input", interactiveTarget: "input", props: `{ placeholder: "Email address" }` },
     invalid: { export: "Input", interactiveTarget: "input", props: `{ defaultValue: "not-an-email", "aria-invalid": true }` }
   },
+  // VI-624: `default` is the closed field; the popover fixtures render open so the
+  // two-column (24-hour) and three-column (12-hour) anatomy can be inspected.
+  "time-picker": {
+    default: { export: "TimePicker", interactiveTarget: "input", props: `{ "aria-label": "Doors open", hourCycle: 12, minuteStep: 15, defaultValue: "16:00" }` },
+    "popover-24h": { export: "TimePicker", interactiveTarget: "input", props: `{ "aria-label": "Set start", hourCycle: 24, minuteStep: 15, defaultValue: "16:15", open: true }` },
+    "popover-12h": { export: "TimePicker", interactiveTarget: "input", props: `{ "aria-label": "Doors open", hourCycle: 12, minuteStep: 15, defaultValue: "16:15", open: true }` },
+    invalid: { export: "TimePicker", interactiveTarget: "input", props: `{ "aria-label": "Doors open", hourCycle: 12, defaultValue: "16:00", "aria-invalid": true }` }
+  },
   textarea: {
     default: { export: "Textarea", interactiveTarget: "textarea", props: `{ placeholder: "Tell us more" }` },
     invalid: { export: "Textarea", interactiveTarget: "textarea", props: `{ defaultValue: "Too short", "aria-invalid": true }` }
@@ -9055,6 +9150,51 @@ var FIXTURES = {
     checked: { export: "Checkbox", interactiveTarget: "button", props: `{ "aria-label": "Accept", defaultChecked: true }` },
     invalid: { export: "Checkbox", interactiveTarget: "button", props: `{ "aria-label": "Accept", "aria-invalid": true }` }
   },
+  // VI-668: the card variant — icon, title, line; the third level is drawn disabled.
+  "radio-group": {
+    default: {
+      export: "RadioGroup",
+      interactiveTarget: '[role="radio"]',
+      props: `(function () {
+        var h = React.createElement;
+        return {
+          "aria-label": "Size",
+          defaultValue: "medium",
+          style: { width: 320 },
+          children: ["small", "medium", "large"].map(function (v) {
+            return h(__mod.RadioGroupItem, { key: v, value: v, "aria-label": v });
+          }),
+        };
+      })()`
+    },
+    card: {
+      export: "RadioGroup",
+      interactiveTarget: '[role="radio"]',
+      props: `(function () {
+        var h = React.createElement;
+        var icon = function (shapes) {
+          return h("svg", { width: "1em", height: "1em", viewBox: "0 0 24 24", fill: "currentColor" }, shapes);
+        };
+        var levels = [
+          ["just-you", "Just You", "Only you can see this booking.", icon([h("circle", { key: 1, cx: 12, cy: 8, r: 4 }), h("path", { key: 2, d: "M4 21a8 8 0 0 1 16 0Z" })])],
+          ["team", "Your Team", "Everyone on your team can see it.", icon([h("circle", { key: 1, cx: 8, cy: 9, r: 3.5 }), h("circle", { key: 2, cx: 16, cy: 9, r: 3.5 }), h("path", { key: 3, d: "M1 20a7 7 0 0 1 14 0ZM9 20a7 7 0 0 1 14 0Z" })])],
+          ["public", "Public", "Verified bookers only for now.", icon([h("path", { key: 1, d: "M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm0 3a7 7 0 0 1 0 14 7 7 0 0 1 0-14Z", fillRule: "evenodd" })])],
+        ];
+        return {
+          variant: "card",
+          "aria-label": "Visibility",
+          defaultValue: "team",
+          style: { width: 360 },
+          children: levels.map(function (l, i) {
+            return h(__mod.RadioGroupItem, {
+              key: l[0], value: l[0], icon: l[3], title: l[1], description: l[2],
+              disabled: i === 2, "aria-describedby": i === 2 ? "radio-reason" : undefined,
+            });
+          }).concat([h("p", { key: "r", id: "radio-reason", style: { margin: 0, fontSize: 12 } }, "Public needs a verified booking.")]),
+        };
+      })()`
+    }
+  },
   switch: {
     default: { export: "Switch", interactiveTarget: "button", props: `{ "aria-label": "Notifications" }` },
     checked: { export: "Switch", interactiveTarget: "button", props: `{ "aria-label": "Notifications", defaultChecked: true }` },
@@ -9093,13 +9233,37 @@ var FIXTURES = {
       export: "InlineEdit",
       interactiveTarget: "input",
       props: `{ as: "h2", style: { margin: 0, fontSize: "21px", lineHeight: 1.25, fontWeight: 600 }, label: "Section title", value: "Track record", defaultValue: "Untitled section", onCommit: function () {}, defaultEditing: true }`
+    },
+    // VI-677: pencil={false}. The text is the button, so hover/focus drive it.
+    "no-pencil": {
+      export: "InlineEdit",
+      interactiveTarget: "button",
+      props: `{ label: "Rider title", value: "Technical rider", defaultValue: "Rider", onCommit: function () {}, pencil: false }`
+    },
+    "no-pencil-default-value": {
+      export: "InlineEdit",
+      interactiveTarget: "button",
+      props: `{ label: "Rider title", value: "", defaultValue: "Rider", onCommit: function () {}, pencil: false }`
+    },
+    // Descenders and accents must survive the cap-band trim.
+    "no-pencil-glyphs": {
+      export: "InlineEdit",
+      interactiveTarget: "button",
+      props: `{ label: "Rider title", value: "Typography jpq \xC9\xC5\xD1", defaultValue: "Rider", onCommit: function () {}, pencil: false }`
+    },
+    "no-pencil-heading": {
+      export: "InlineEdit",
+      interactiveTarget: "button",
+      props: `{ as: "h2", style: { margin: 0, fontSize: "21px", lineHeight: 1.25, fontWeight: 600 }, label: "Section title", value: "Track record", defaultValue: "Untitled section", onCommit: function () {}, pencil: false }`
     }
   },
-  // VI-657: the autosave readout in each state. It draws no edge in any of them.
+  // VI-657/VI-665: the autosave readout in each state, Unsaved as a dot too. It draws no edge in any of them.
   "save-status": {
     default: { export: "SaveStatus", props: `{ status: "saved" }` },
     saving: { export: "SaveStatus", props: `{ status: "saving" }` },
+    syncing: { export: "SaveStatus", props: `{ status: "syncing" }` },
     unsaved: { export: "SaveStatus", props: `{ status: "unsaved" }` },
+    "unsaved-dot": { export: "SaveStatus", props: `{ status: "unsaved", unsavedAs: "dot" }` },
     refused: { export: "SaveStatus", props: `{ status: "refused" }` },
     "refused-retry": { export: "SaveStatus", interactiveTarget: "button", props: `{ status: "refused", onRetry: function () {} }` }
   },
@@ -9123,6 +9287,55 @@ var FIXTURES = {
     default: {
       export: "EmptyState",
       props: `{ heading: "No projects yet", description: "Create a project to get started." }`
+    },
+    error: {
+      export: "EmptyState",
+      props: `{ intent: "error", tone: "subtle", icon: ${ICON_X}, heading: "Could not load the inbox", description: "The request timed out. Check your connection and try again." }`
+    }
+  },
+  // VI-666: ActionRow. Every row is captioned (title = state, line = what it
+  // reads); `edges-off` binds both switches on the list: the resting edge and
+  // the hairline go, the selected state edge and focus stay. `--state hover|focus` drives the
+  // first row.
+  "action-row": {
+    default: {
+      export: "ActionRowList",
+      props: `(function () {
+        var h = React.createElement;
+        var row = function (key, props) {
+          return h(__mod.ActionRow, Object.assign({ key: key, leading: ${ICON_X}, trailing: h("span", null, "Value") }, props), props.title);
+        };
+        return { "aria-label": "States", style: { maxWidth: "420px" }, children: [
+          row("rest", { title: "Rest", line: "no fill, 44px floor" }),
+          row("selected", { title: "Selected", line: "lifted fill + inset edge", selected: true }),
+          row("open", { title: "Open", line: "open fill, aria-expanded", open: true }),
+          row("disabled", { title: "Disabled", line: "disabled opacity", disabled: true }),
+          h(__mod.ActionRow, { key: "bare", trailing: h("span", null, "Review") }, "Title only, trailing value"),
+          h(__mod.ActionRow, { key: "long", leading: ${ICON_X}, line: "A second line that is long enough that it has to wrap onto another line", trailing: h("span", null, "3 suggested") }, "A title long enough that it wraps to a second line at this width"),
+          h(__mod.ActionRow, { key: "glyphs", leading: ${ICON_X}, line: "Descenders jpqgy and accents \xC9\xC5\xD1", trailing: h("span", null, "jpq \xC9\xC5\xD1") }, "Typography jpq \xC9\xC5\xD1"),
+          h(__mod.ActionRow, { key: "link", asChild: true, leading: ${ICON_X}, trailing: h("span", null, "Open") }, h("a", { href: "#billing" }, "Row as a link (asChild)")),
+        ] };
+      })()`
+    },
+    interactive: {
+      export: "ActionRowList",
+      props: `(function () {
+        var h = React.createElement;
+        return { "aria-label": "Interactive", style: { maxWidth: "420px" }, children: [
+          h(__mod.ActionRow, { key: "a", leading: ${ICON_X}, line: "driven by --state", trailing: h("span", null, "Value") }, "First row"),
+          h(__mod.ActionRow, { key: "b", leading: ${ICON_X}, line: "left at rest", trailing: h("span", null, "Value") }, "Second row"),
+        ] };
+      })()`
+    },
+    "edges-off": {
+      export: "ActionRowList",
+      props: `(function () {
+        var h = React.createElement;
+        return { "aria-label": "Edges off", style: { maxWidth: "420px", "--control-edge-width": "0", "--hairline-width": "0" }, children: [
+          h(__mod.ActionRow, { key: "a", leading: ${ICON_X}, line: "edge kept, resting edge off", trailing: h("span", null, "Value"), selected: true }, "Selected"),
+          h(__mod.ActionRow, { key: "b", leading: ${ICON_X}, line: "hairline off", trailing: h("span", null, "Value") }, "Rest"),
+        ] };
+      })()`
     }
   },
   badge: {
@@ -9173,7 +9386,8 @@ function resolveComponentFile(cwd, name) {
   return firstExisting([
     resolve21(cwd, "components", "ui", name, `${name}.tsx`),
     resolve21(cwd, "components", "devtools", name, `${name}.tsx`),
-    resolve21(cwd, "components", "ui", name, "index.tsx")
+    resolve21(cwd, "components", "ui", name, "index.tsx"),
+    resolve21(cwd, "blocks", name, `${name}.tsx`)
   ]);
 }
 function resolveThemeCssFile(cwd, slug2) {
@@ -9301,7 +9515,7 @@ async function renderCommand(component, cwd, options) {
   if (!componentFile) {
     fail3(
       "COMPONENT_NOT_FOUND",
-      `Component "${component}" not found under components/ui/. Expected components/ui/${component}/${component}.tsx.`
+      `Component "${component}" not found under components/ui/ or blocks/. Expected components/ui/${component}/${component}.tsx or blocks/${component}/${component}.tsx.`
     );
   }
   const themeCssFile = resolveThemeCssFile(cwd, options.theme);