@flamingo-stack/openframe-frontend-core 0.0.777 → 0.0.781

package/dist/components/features/scripts/execution-cells.d.ts

@@ -56,10 +56,13 @@ export declare function ExecutionResultCell({ result, empty }: {
  * yet says so (its page polls, so the output streams in) instead of a dead
  * end; a finished run with no output shows the host's empty mark.
  */
-export declare function ScriptExecutionResult({ result, inFlight, empty, className, }: {
+export declare function ScriptExecutionResult({ result, inFlight, empty, loading: loadingProp, className, }: {
     result?: string | null;
     inFlight?: boolean;
     empty: ReactNode;
+    /** The execution is still being read: the output is one `text-h4` line, the "Result" caption real. A loading
+     *  scope does the same. */
+    loading?: boolean;
     className?: string;
 }): import("react").JSX.Element;
 //# sourceMappingURL=execution-cells.d.ts.map

package/dist/components/features/scripts/execution-cells.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"execution-cells.d.ts","sourceRoot":"","sources":["../../../../src/components/features/scripts/execution-cells.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQvC;;;;;GAKG;AAEH,iFAAiF;AACjF,wBAAgB,oBAAoB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;IAAE,MAAM,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,sCAYpH;AAED;;;GAGG;AACH,wBAAgB,sBAAsB,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,+BAS5G;AAED,4FAA4F;AAC5F,wBAAgB,mBAAmB,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAA;CAAE,+BAOpF;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE;IAAE,IAAI,EAAE,SAAS,CAAC;IAAC,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,+BAe5G;AAED;;;;;;;GAOG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,MAAM,EACN,IAAI,EACJ,MAAM,EACN,UAAU,GACX,EAAE;IACD,MAAM,EAAE,SAAS,CAAC;IAClB,IAAI,EAAE,SAAS,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B,+BAiBA;AAED,gGAAgG;AAChG,wBAAgB,mBAAmB,CAAC,EAAE,MAAM,EAAE,KAAY,EAAE,EAAE;IAAE,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAE,+BAE1G;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,MAAM,EACN,QAAgB,EAChB,KAAK,EACL,SAAS,GACV,EAAE;IACD,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,SAAS,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAWA"}
+{"version":3,"file":"execution-cells.d.ts","sourceRoot":"","sources":["../../../../src/components/features/scripts/execution-cells.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAUvC;;;;;GAKG;AAEH,iFAAiF;AACjF,wBAAgB,oBAAoB,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE;IAAE,MAAM,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,sCAYpH;AAED;;;GAGG;AACH,wBAAgB,sBAAsB,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,WAAW,EAAE,MAAM,CAAA;CAAE,+BAS5G;AAED,4FAA4F;AAC5F,wBAAgB,mBAAmB,CAAC,EAAE,MAAM,EAAE,EAAE;IAAE,MAAM,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAA;CAAE,+BAOpF;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE;IAAE,IAAI,EAAE,SAAS,CAAC;IAAC,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;CAAE,+BAiB5G;AAED;;;;;;;GAOG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,MAAM,EACN,IAAI,EACJ,MAAM,EACN,UAAU,GACX,EAAE;IACD,MAAM,EAAE,SAAS,CAAC;IAClB,IAAI,EAAE,SAAS,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B,+BAiBA;AAED,gGAAgG;AAChG,wBAAgB,mBAAmB,CAAC,EAAE,MAAM,EAAE,KAAY,EAAE,EAAE;IAAE,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAE,+BAI1G;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,MAAM,EACN,QAAgB,EAChB,KAAK,EACL,OAAO,EAAE,WAAmB,EAC5B,SAAS,GACV,EAAE;IACD,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,SAAS,CAAC;IACjB;+BAC2B;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAeA"}

package/dist/components/features/scripts/execution-cells.js

@@ -3,6 +3,8 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "../../../utils/cn.js";
 import { AgentMark } from "../../agent-mark.js";
 import { MonitorIcon } from "../../icons-v2-generated/devices/monitor-icon.js";
+import { TextLineSkeleton } from "../../loading/unified-skeleton.js";
+import { useLoadingScope } from "../../ui/loading-scope.js";
 import { Tag } from "../../ui/tag.js";
 import { TruncateText } from "../../ui/truncate-text.js";
 import { scriptExecutionStatus } from "./execution-status.js";
@@ -25,12 +27,13 @@ function ExecutionStatusCell({ status }) {
   return /* @__PURE__ */ jsx("div", { className: "flex", children: /* @__PURE__ */ jsx(Tag, { label: presentation?.label ?? String(status ?? ""), variant: presentation?.variant ?? "grey" }) });
 }
 function ExecutionDeviceCell({ name, organization }) {
+  const loading = useLoadingScope();
   return /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col justify-center gap-1", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-1", children: [
       /* @__PURE__ */ jsx(MonitorIcon, { className: "size-6 shrink-0 text-ods-text-secondary" }),
       /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: typeof name === "string" ? /* @__PURE__ */ jsx(TruncateText, { children: name }) : name })
     ] }),
-    organization && /* @__PURE__ */ jsx(TruncateText, { variant: "h6", tone: "secondary", children: organization })
+    (organization || loading) && /* @__PURE__ */ jsx(TruncateText, { variant: "h6", tone: "secondary", children: organization ?? "" })
   ] });
 }
 function ExecutionInitiatorCell({
@@ -51,16 +54,19 @@ function ExecutionInitiatorCell({
   ] });
 }
 function ExecutionResultCell({ result, empty = null }) {
-  return result ? /* @__PURE__ */ jsx(TruncateText, { lines: 2, children: result }) : /* @__PURE__ */ jsx(Fragment, { children: empty });
+  const loading = useLoadingScope();
+  return result || loading ? /* @__PURE__ */ jsx(TruncateText, { lines: 2, children: result ?? "" }) : /* @__PURE__ */ jsx(Fragment, { children: empty });
 }
 function ScriptExecutionResult({
   result,
   inFlight = false,
   empty,
+  loading: loadingProp = false,
   className
 }) {
+  const loading = useLoadingScope() || loadingProp;
   return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-[var(--spacing-system-xxs)] p-[var(--spacing-system-m)]", className), children: [
-    result ? /* @__PURE__ */ jsx("div", { className: "whitespace-pre-wrap break-words text-ods-text-primary text-h4", children: result }) : /* @__PURE__ */ jsx("div", { className: "text-ods-text-secondary text-h4", children: inFlight ? "Waiting for output\u2026" : empty }),
+    loading ? /* @__PURE__ */ jsx(TextLineSkeleton, { type: "h4", className: "w-3/4 max-w-full" }) : result ? /* @__PURE__ */ jsx("div", { className: "whitespace-pre-wrap break-words text-ods-text-primary text-h4", children: result }) : /* @__PURE__ */ jsx("div", { className: "text-ods-text-secondary text-h4", children: inFlight ? "Waiting for output\u2026" : empty }),
     /* @__PURE__ */ jsx("div", { className: "text-ods-text-secondary text-h6", children: "Result" })
   ] });
 }

package/dist/components/features/scripts/schedule-form/schedule-script-picker-card.js

@@ -56,13 +56,15 @@ function ScheduleScriptPickerCard({
                   className: `flex min-w-0 flex-1 items-end ${dragAndDropEnabled ? "gap-[var(--spacing-system-xs)]" : "gap-[var(--spacing-system-xsf)]"}`,
                   children: [
                     dragAndDropEnabled && /* @__PURE__ */ jsx(
-                      "button",
+                      Button,
                       {
+                        variant: "transparent",
+                        size: "icon",
                         type: "button",
                         ...dragHandleProps,
                         disabled,
                         "aria-label": `Reorder ${selected?.name || `script ${index + 1}`}`,
-                        className: `flex size-12 shrink-0 items-center justify-center rounded-[6px] text-ods-text-secondary hover:text-ods-text-primary focus-visible:outline focus-visible:outline-2 focus-visible:outline-ods-border-focus disabled:cursor-not-allowed disabled:opacity-30 ${isDragging ? "cursor-grabbing text-ods-text-primary" : "cursor-grab"}`,
+                        className: `shrink-0 ${isDragging ? "cursor-grabbing" : "cursor-grab"}`,
                         children: /* @__PURE__ */ jsx(DraggerIcon, { size: 24 })
                       }
                     ),

package/dist/components/features/scripts/schedule-form/schedule-timing-fields.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"schedule-timing-fields.d.ts","sourceRoot":"","sources":["../../../../../src/components/features/scripts/schedule-form/schedule-timing-fields.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAGL,KAAK,gBAAgB,EACrB,KAAK,gBAAgB,EACtB,MAAM,uBAAuB,CAAC;AAkB/B,MAAM,WAAW,yBAAyB;IACxC,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,gBAAgB,CAAC;IACrC;;;;OAIG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,EAAE,aAAa,EAAE,qBAAqB,KAAK,gBAAgB,EAAE,CAAC;CAChG;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwDG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,UAAU,EACV,QAAgB,EAChB,iBAAyB,EACzB,YAAiC,GAClC,EAAE,yBAAyB,+BA+W3B"}
+{"version":3,"file":"schedule-timing-fields.d.ts","sourceRoot":"","sources":["../../../../../src/components/features/scripts/schedule-form/schedule-timing-fields.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAGL,KAAK,gBAAgB,EACrB,KAAK,gBAAgB,EACtB,MAAM,uBAAuB,CAAC;AAkB/B,MAAM,WAAW,yBAAyB;IACxC,UAAU,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,gBAAgB,CAAC;IACrC;;;;OAIG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,EAAE,aAAa,EAAE,qBAAqB,KAAK,gBAAgB,EAAE,CAAC;CAChG;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwDG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,UAAU,EACV,QAAgB,EAChB,iBAAyB,EACzB,YAAiC,GAClC,EAAE,yBAAyB,+BAiX3B"}

package/dist/components/features/scripts/schedule-form/schedule-timing-fields.js

@@ -5,6 +5,7 @@ import { useCallback, useMemo } from "react";
 import { Controller, useFormContext, useWatch } from "react-hook-form";
 import { cn } from "../../../../utils/cn.js";
 import { XmarkCircleIcon } from "../../../icons-v2-generated/signs-and-symbols/xmark-circle-icon.js";
+import { Button } from "../../../ui/button/index.js";
 import { CheckboxBlock } from "../../../ui/checkbox-block.js";
 import { DatePickerInputSimple } from "../../../ui/date-picker.js";
 import { Label } from "../../../ui/label.js";
@@ -111,12 +112,14 @@ function ScheduleTimingFields({
                     }
                   ),
                   field.value && !fieldsDisabled && /* @__PURE__ */ jsx(
-                    "button",
+                    Button,
                     {
+                      variant: "transparent",
+                      size: "icon-sm",
                       type: "button",
                       onClick: () => field.onChange(null),
                       "aria-label": "Clear date",
-                      className: "absolute right-3 top-6 -translate-y-1/2 text-ods-text-secondary hover:text-ods-text-primary",
+                      className: "absolute right-2 top-6 -translate-y-1/2",
                       children: /* @__PURE__ */ jsx(XmarkCircleIcon, { size: 24 })
                     }
                   )

package/dist/components/features/scripts/script-executions-table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"script-executions-table.d.ts","sourceRoot":"","sources":["../../../../src/components/features/scripts/script-executions-table.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAwB,MAAM,OAAO,CAAC;AAU7D,OAAO,EAA+C,KAAK,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAGrH,wDAAwD;AACxD,MAAM,WAAW,uBAAuB;IACtC,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;IACpB,iDAAiD;IACjD,SAAS,EAAE,MAAM,CAAC;IAClB,0DAA0D;IAC1D,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,6BAA6B;IAC7B,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,sBAAsB;IACtB,SAAS,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9D,qDAAqD;IACrD,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,uEAAuE;IACvE,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,kCAAkC;IAClC,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,2EAA2E;IAC3E,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,0BAA0B;IACzC,IAAI,EAAE,uBAAuB,EAAE,CAAC;IAChC;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,wBAAwB,EAAE,CAAC;IAC9C,sDAAsD;IACtD,WAAW,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAChC,4EAA4E;IAC5E,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,uBAAuB,KAAK,SAAS,CAAC;IAC3D,iGAAiG;IACjG,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,2EAA2E;IAC3E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,8DAA8D;IAC9D,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,IAAI,EACJ,OAAO,EAAE,MAAiC,EAC1C,WAAW,EACX,YAAY,EACZ,OAAe,EACf,SAAiB,EACjB,YAAqC,EACrC,UAAU,EAAE,UAAiB,EAC7B,SAAS,EACT,YAAiB,GAClB,EAAE,0BAA0B,+BAkE5B"}
+{"version":3,"file":"script-executions-table.d.ts","sourceRoot":"","sources":["../../../../src/components/features/scripts/script-executions-table.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAwB,MAAM,OAAO,CAAC;AAY7D,OAAO,EAA+C,KAAK,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAGrH,wDAAwD;AACxD,MAAM,WAAW,uBAAuB;IACtC,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,MAAM,CAAC;IACpB,iDAAiD;IACjD,SAAS,EAAE,MAAM,CAAC;IAClB,0DAA0D;IAC1D,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,6BAA6B;IAC7B,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,sBAAsB;IACtB,SAAS,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9D,qDAAqD;IACrD,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,uEAAuE;IACvE,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,kCAAkC;IAClC,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,2EAA2E;IAC3E,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAaD,MAAM,WAAW,0BAA0B;IACzC,IAAI,EAAE,uBAAuB,EAAE,CAAC;IAChC;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,wBAAwB,EAAE,CAAC;IAC9C,sDAAsD;IACtD,WAAW,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAChC,4EAA4E;IAC5E,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,uBAAuB,KAAK,SAAS,CAAC;IAC3D,iGAAiG;IACjG,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,2EAA2E;IAC3E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,8DAA8D;IAC9D,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,IAAI,EACJ,OAAO,EAAE,MAAiC,EAC1C,WAAW,EACX,YAAY,EACZ,OAAe,EACf,SAAiB,EACjB,YAAqC,EACrC,UAAU,EAAE,UAAiB,EAC7B,SAAS,EACT,YAAY,GACb,EAAE,0BAA0B,+BA2E5B"}

package/dist/components/features/scripts/script-executions-table.js

@@ -1,7 +1,9 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useMemo } from "react";
-import { DataTable, useDataTable } from "../../ui/data-table/index.js";
+import { DataTable, dataTableLoadingRows, useDataTable } from "../../ui/data-table/index.js";
+import { DATA_TABLE_SKELETON_ROWS } from "../../ui/data-table/utils.js";
+import { useLoadingScope } from "../../ui/loading-scope.js";
 import { SquareAvatar } from "../../ui/square-avatar.js";
 import {
   ExecutionDeviceCell,
@@ -12,6 +14,15 @@ import {
 } from "./execution-cells.js";
 import { EXECUTION_COLUMNS, EXECUTIONS_TABLE_COLUMNS } from "./scripts-table-columns.js";
 import { OpenInNewTabCell, scriptsColumnMeta } from "./scripts-table-shared.js";
+const loadingExecution = (id) => ({
+  id,
+  executionId: "",
+  timestamp: "",
+  status: "",
+  machineName: "",
+  initiator: { name: "", initials: "" },
+  href: ""
+});
 function ScriptExecutionsTable({
   rows,
   columns: layout = EXECUTIONS_TABLE_COLUMNS,
@@ -22,8 +33,9 @@ function ScriptExecutionsTable({
   emptyMessage = "No executions found.",
   showHeader: withHeader = true,
   rightSlot,
-  skeletonRows = 10
+  skeletonRows
 }) {
+  const loading = useLoadingScope() || isLoading;
   const columns = useMemo(() => {
     const renderers = {
       [EXECUTION_COLUMNS.executionId.id]: (row) => /* @__PURE__ */ jsx(ExecutionTimestampCell, { timestamp: row.timestamp, executionId: row.executionId }),
@@ -49,7 +61,7 @@ function ScriptExecutionsTable({
         }
       ),
       [EXECUTION_COLUMNS.result.id]: (row) => /* @__PURE__ */ jsx(ExecutionResultCell, { result: row.result }),
-      [EXECUTION_COLUMNS.open.id]: (row) => row.href ? /* @__PURE__ */ jsx(OpenInNewTabCell, { href: row.href }) : null
+      [EXECUTION_COLUMNS.open.id]: (row) => row.href !== void 0 ? /* @__PURE__ */ jsx(OpenInNewTabCell, { href: row.href }) : null
     };
     return layout.filter((column) => renderers[column.id] && !hideColumns?.includes(column.id)).map((column) => ({
       id: column.id,
@@ -59,20 +71,25 @@ function ScriptExecutionsTable({
       meta: scriptsColumnMeta(column)
     }));
   }, [layout, hideColumns]);
+  const loadingRows = useMemo(
+    () => loading ? dataTableLoadingRows(skeletonRows ?? DATA_TABLE_SKELETON_ROWS, loadingExecution) : null,
+    [loading, skeletonRows]
+  );
   const table = useDataTable({
-    data: rows,
+    data: loadingRows ?? rows,
     columns,
     getRowId: (row) => row.id,
     enableSorting: false
   });
-  const rowHref = useCallback((row) => row.href, []);
-  const showHeader = withHeader && (isLoading || rows.length > 0);
+  const rowHref = useCallback((row) => row.href || void 0, []);
+  const showHeader = withHeader && (loading || rows.length > 0);
   return /* @__PURE__ */ jsxs(DataTable, { table, children: [
     showHeader && /* @__PURE__ */ jsx(DataTable.Header, { rightSlot }),
     /* @__PURE__ */ jsx(
       DataTable.Body,
       {
-        loading: isLoading,
+        loading,
+        loadingCells: true,
         skeletonRows,
         emptyMessage,
         rowClassName: "mb-1",

package/dist/components/features/scripts/script-schedules-table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"script-schedules-table.d.ts","sourceRoot":"","sources":["../../../../src/components/features/scripts/script-schedules-table.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAwB,MAAM,OAAO,CAAC;AAQ7D,sFAAsF;AACtF,MAAM,WAAW,sBAAsB;IACrC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,kBAAkB,EAAE,MAAM,EAAE,CAAC;IAC7B,iFAAiF;IACjF,QAAQ,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IACjD,6DAA6D;IAC7D,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,4EAA4E;IAC5E,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,yBAAyB;IACxC,IAAI,EAAE,sBAAsB,EAAE,CAAC;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,mFAAmF;IACnF,WAAW,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAChC,gEAAgE;IAChE,aAAa,CAAC,EAAE,CAAC,GAAG,EAAE,sBAAsB,KAAK,SAAS,CAAC;IAC3D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAID;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,IAAI,EACJ,SAAiB,EACjB,WAAW,EACX,aAAa,EACb,YAAoC,EACpC,YAAoB,EACpB,kBAAkB,EAClB,SAAS,EACT,YAAiB,GAClB,EAAE,yBAAyB,+BAwD3B"}
+{"version":3,"file":"script-schedules-table.d.ts","sourceRoot":"","sources":["../../../../src/components/features/scripts/script-schedules-table.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAwB,MAAM,OAAO,CAAC;AAW7D,sFAAsF;AACtF,MAAM,WAAW,sBAAsB;IACrC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,kBAAkB,EAAE,MAAM,EAAE,CAAC;IAC7B,iFAAiF;IACjF,QAAQ,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IACjD,6DAA6D;IAC7D,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,4EAA4E;IAC5E,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,yBAAyB;IACxC,IAAI,EAAE,sBAAsB,EAAE,CAAC;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,mFAAmF;IACnF,WAAW,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAChC,gEAAgE;IAChE,aAAa,CAAC,EAAE,CAAC,GAAG,EAAE,sBAAsB,KAAK,SAAS,CAAC;IAC3D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAqBD;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,IAAI,EACJ,SAAiB,EACjB,WAAW,EACX,aAAa,EACb,YAAoC,EACpC,YAAoB,EACpB,kBAAkB,EAClB,SAAS,EACT,YAAY,GACb,EAAE,yBAAyB,+BAqE3B"}

package/dist/components/features/scripts/script-schedules-table.js

@@ -1,13 +1,29 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useMemo } from "react";
-import { DataTable, useDataTable } from "../../ui/data-table/index.js";
+import { TextLineSkeleton } from "../../loading/unified-skeleton.js";
+import { DataTable, dataTableLoadingRows, useDataTable } from "../../ui/data-table/index.js";
+import { DATA_TABLE_SKELETON_ROWS } from "../../ui/data-table/utils.js";
+import { useLoadingScope } from "../../ui/loading-scope.js";
 import { TruncateText } from "../../ui/truncate-text.js";
 import { OSTypeBadgeGroup } from "../os-type-badge-group.js";
 import { ScheduleDateTimeCell, ScriptNameCell } from "./script-cells.js";
 import { SCHEDULE_COLUMNS } from "./scripts-table-columns.js";
 import { OpenInNewTabCell, RowActionsCell, scriptsColumnMeta } from "./scripts-table-shared.js";
 const VALUE_CLASS = "text-ods-text-primary text-h4";
+function ScheduleValueCell({ children }) {
+  if (useLoadingScope()) return /* @__PURE__ */ jsx(TextLineSkeleton, { type: "h4", className: "w-16" });
+  return /* @__PURE__ */ jsx("span", { className: VALUE_CLASS, children });
+}
+const loadingSchedule = (id) => ({
+  id,
+  name: "",
+  supportedPlatforms: [],
+  startsAt: { date: "", time: "" },
+  repeat: "",
+  deviceCount: 0,
+  href: ""
+});
 function ScriptSchedulesTable({
   rows,
   isLoading = false,
@@ -17,8 +33,9 @@ function ScriptSchedulesTable({
   stickyHeader = false,
   stickyHeaderOffset,
   rightSlot,
-  skeletonRows = 10
+  skeletonRows
 }) {
+  const loading = useLoadingScope() || isLoading;
   const columns = useMemo(() => {
     const cell = (layout, render) => ({
       id: layout.id,
@@ -35,29 +52,39 @@ function ScriptSchedulesTable({
         SCHEDULE_COLUMNS.dateTime,
         (row) => row.startsAt ? /* @__PURE__ */ jsx(ScheduleDateTimeCell, { date: row.startsAt.date, time: row.startsAt.time }) : row.trigger ? /* @__PURE__ */ jsx(TruncateText, { tone: "secondary", children: row.trigger }) : null
       ),
-      cell(SCHEDULE_COLUMNS.repeat, (row) => row.repeat ? /* @__PURE__ */ jsx("span", { className: VALUE_CLASS, children: row.repeat }) : null),
-      cell(SCHEDULE_COLUMNS.deviceCount, (row) => /* @__PURE__ */ jsx("span", { className: VALUE_CLASS, children: row.deviceCount }))
+      cell(
+        SCHEDULE_COLUMNS.repeat,
+        (row) => row.repeat != null ? /* @__PURE__ */ jsx(ScheduleValueCell, { children: row.repeat }) : null
+      ),
+      cell(SCHEDULE_COLUMNS.deviceCount, (row) => /* @__PURE__ */ jsx(ScheduleValueCell, { children: row.deviceCount }))
     ];
     if (renderActions) {
       all.push(cell(SCHEDULE_COLUMNS.actions, (row) => /* @__PURE__ */ jsx(RowActionsCell, { children: renderActions(row) })));
     }
-    all.push(cell(SCHEDULE_COLUMNS.open, (row) => row.href ? /* @__PURE__ */ jsx(OpenInNewTabCell, { href: row.href }) : null));
+    all.push(
+      cell(SCHEDULE_COLUMNS.open, (row) => row.href !== void 0 ? /* @__PURE__ */ jsx(OpenInNewTabCell, { href: row.href }) : null)
+    );
     return hideColumns ? all.filter((column) => !hideColumns.includes(column.id ?? "")) : all;
   }, [hideColumns, renderActions]);
+  const loadingRows = useMemo(
+    () => loading ? dataTableLoadingRows(skeletonRows ?? DATA_TABLE_SKELETON_ROWS, loadingSchedule) : null,
+    [loading, skeletonRows]
+  );
   const table = useDataTable({
-    data: rows,
+    data: loadingRows ?? rows,
     columns,
     getRowId: (row) => row.id,
     enableSorting: false
   });
-  const rowHref = useCallback((row) => row.href, []);
-  const showHeader = isLoading || rows.length > 0;
+  const rowHref = useCallback((row) => row.href || void 0, []);
+  const showHeader = loading || rows.length > 0;
   return /* @__PURE__ */ jsxs(DataTable, { table, children: [
     showHeader && /* @__PURE__ */ jsx(DataTable.Header, { stickyHeader, stickyHeaderOffset, rightSlot }),
     /* @__PURE__ */ jsx(
       DataTable.Body,
       {
-        loading: isLoading,
+        loading,
+        loadingCells: true,
         skeletonRows,
         emptyMessage,
         rowClassName: "mb-1",

package/dist/components/features/scripts/script-shell-badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"script-shell-badge.d.ts","sourceRoot":"","sources":["../../../../src/components/features/scripts/script-shell-badge.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,qBAAqB;IACpC,oCAAoC;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,sEAAsE;AACtE,wBAAgB,gBAAgB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,EAAE,qBAAqB,+BAW1F"}
+{"version":3,"file":"script-shell-badge.d.ts","sourceRoot":"","sources":["../../../../src/components/features/scripts/script-shell-badge.tsx"],"names":[],"mappings":"AAOA,MAAM,WAAW,qBAAqB;IACpC,oCAAoC;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,sEAAsE;AACtE,wBAAgB,gBAAgB,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,EAAE,qBAAqB,+BAoB1F"}

package/dist/components/features/scripts/script-shell-badge.js

@@ -1,8 +1,16 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "../../../utils/cn.js";
+import { TextLineSkeleton, UnifiedSkeleton } from "../../loading/unified-skeleton.js";
+import { useLoadingScope } from "../../ui/loading-scope.js";
 import { scriptShellType } from "./shell-types.js";
 function ScriptShellBadge({ value, className, iconClassName }) {
+  if (useLoadingScope() && !value) {
+    return /* @__PURE__ */ jsxs("span", { className: cn("flex items-center gap-2", className), children: [
+      /* @__PURE__ */ jsx(UnifiedSkeleton, { className: cn("h-5 w-5", iconClassName) }),
+      /* @__PURE__ */ jsx(TextLineSkeleton, { type: "inherit", as: "span", className: "w-20" })
+    ] });
+  }
   const shell = scriptShellType(value);
   const Icon = shell?.icon;
   return /* @__PURE__ */ jsxs("span", { className: cn("flex items-center gap-2", className), children: [

package/dist/components/features/scripts/scripts-table-shared.d.ts

@@ -12,7 +12,10 @@ export declare function scriptsColumnMeta(column: ScriptsTableColumnLayout): {
 export declare function RowActionsCell({ children }: {
     children: ReactNode;
 }): import("react").JSX.Element;
-/** The last cell of a row: its page in a new tab. The row is a link itself, so this opens by script. */
+/**
+ * The last cell of a row: its page in a new tab. The row is a link itself, so this opens by script. While the row is
+ * read (a loading scope) the button is static chrome: drawn real and inert.
+ */
 export declare function OpenInNewTabCell({ href }: {
     href: string;
 }): import("react").JSX.Element;

package/dist/components/features/scripts/scripts-table-shared.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"scripts-table-shared.d.ts","sourceRoot":"","sources":["../../../../src/components/features/scripts/scripts-table-shared.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAExE,4FAA4F;AAC5F,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,wBAAwB;;;;;;EAQjE;AAED,uDAAuD;AACvD,wBAAgB,cAAc,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,+BAMnE;AAED,wGAAwG;AACxG,wBAAgB,gBAAgB,CAAC,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,+BAa1D"}
+{"version":3,"file":"scripts-table-shared.d.ts","sourceRoot":"","sources":["../../../../src/components/features/scripts/scripts-table-shared.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,yBAAyB,CAAC;AAExE,4FAA4F;AAC5F,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,wBAAwB;;;;;;EAQjE;AAED,uDAAuD;AACvD,wBAAgB,cAAc,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,+BAMnE;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,+BAe1D"}

package/dist/components/features/scripts/scripts-table-shared.js

@@ -3,6 +3,7 @@ import { jsx } from "react/jsx-runtime";
 import { openInNewTab } from "../../../utils/open-in-new-tab.js";
 import { ArrowRightUpIcon } from "../../icons-v2-generated/arrows/arrow-right-up-icon.js";
 import { Button } from "../../ui/button/index.js";
+import { useLoadingScope } from "../../ui/loading-scope.js";
 function scriptsColumnMeta(column) {
   return {
     width: column.width,
@@ -16,10 +17,12 @@ function RowActionsCell({ children }) {
   return /* @__PURE__ */ jsx("div", { "data-no-row-click": true, className: "pointer-events-auto flex items-center justify-end gap-2", children });
 }
 function OpenInNewTabCell({ href }) {
+  const loading = useLoadingScope();
   return /* @__PURE__ */ jsx("div", { "data-no-row-click": true, className: "pointer-events-auto flex items-center justify-end", children: /* @__PURE__ */ jsx(
     Button,
     {
-      onClick: openInNewTab(href),
+      onClick: loading ? void 0 : openInNewTab(href),
+      disabled: loading,
       variant: "outline",
       size: "icon",
       leftIcon: /* @__PURE__ */ jsx(ArrowRightUpIcon, { className: "h-5 w-5" }),

package/dist/components/features/scripts/scripts-table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"scripts-table.d.ts","sourceRoot":"","sources":["../../../../src/components/features/scripts/scripts-table.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAwB,MAAM,OAAO,CAAC;AAU7D,wDAAwD;AACxD,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,2CAA2C;IAC3C,SAAS,EAAE,MAAM,CAAC;IAClB,sEAAsE;IACtE,kBAAkB,EAAE,MAAM,EAAE,CAAC;IAC7B,8CAA8C;IAC9C,MAAM,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IACnE,wEAAwE;IACxE,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,cAAc,EAAE,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gFAAgF;IAChF,WAAW,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAChC,gEAAgE;IAChE,aAAa,CAAC,EAAE,CAAC,GAAG,EAAE,cAAc,KAAK,SAAS,CAAC;IACnD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,8DAA8D;IAC9D,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAID;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,SAAiB,EACjB,WAAW,EACX,aAAa,EACb,YAAkC,EAClC,YAAoB,EACpB,kBAAkB,EAClB,SAAS,EACT,YAAiB,GAClB,EAAE,iBAAiB,+BAgEnB"}
+{"version":3,"file":"scripts-table.d.ts","sourceRoot":"","sources":["../../../../src/components/features/scripts/scripts-table.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAwB,MAAM,OAAO,CAAC;AAY7D,wDAAwD;AACxD,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,2CAA2C;IAC3C,SAAS,EAAE,MAAM,CAAC;IAClB,sEAAsE;IACtE,kBAAkB,EAAE,MAAM,EAAE,CAAC;IAC7B,8CAA8C;IAC9C,MAAM,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IACnE,wEAAwE;IACxE,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,cAAc,EAAE,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gFAAgF;IAChF,WAAW,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAChC,gEAAgE;IAChE,aAAa,CAAC,EAAE,CAAC,GAAG,EAAE,cAAc,KAAK,SAAS,CAAC;IACnD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,8DAA8D;IAC9D,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAcD;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,SAAiB,EACjB,WAAW,EACX,aAAa,EACb,YAAkC,EAClC,YAAoB,EACpB,kBAAkB,EAClB,SAAS,EACT,YAAY,GACb,EAAE,iBAAiB,+BAyEnB"}

package/dist/components/features/scripts/scripts-table.js

@@ -1,7 +1,9 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useMemo } from "react";
-import { DataTable, useDataTable } from "../../ui/data-table/index.js";
+import { DataTable, dataTableLoadingRows, useDataTable } from "../../ui/data-table/index.js";
+import { DATA_TABLE_SKELETON_ROWS } from "../../ui/data-table/utils.js";
+import { useLoadingScope } from "../../ui/loading-scope.js";
 import { SquareAvatar } from "../../ui/square-avatar.js";
 import { TruncateText } from "../../ui/truncate-text.js";
 import { OSTypeBadgeGroup } from "../os-type-badge-group.js";
@@ -10,6 +12,14 @@ import { ScriptShellBadge } from "./script-shell-badge.js";
 import { SCRIPT_COLUMNS } from "./scripts-table-columns.js";
 import { OpenInNewTabCell, RowActionsCell, scriptsColumnMeta } from "./scripts-table-shared.js";
 const BADGE_ICON = "h-4 w-4 content-md:h-6 content-md:w-6";
+const loadingScript = (id) => ({
+  id,
+  name: "",
+  shellType: "",
+  supportedPlatforms: [],
+  author: { name: "", initials: "" },
+  href: ""
+});
 function ScriptsTable({
   rows,
   isLoading = false,
@@ -19,8 +29,9 @@ function ScriptsTable({
   stickyHeader = false,
   stickyHeaderOffset,
   rightSlot,
-  skeletonRows = 10
+  skeletonRows
 }) {
+  const loading = useLoadingScope() || isLoading;
   const columns = useMemo(() => {
     const cell = (layout, render) => ({
       id: layout.id,
@@ -54,23 +65,28 @@ function ScriptsTable({
     if (renderActions) {
       all.push(cell(SCRIPT_COLUMNS.actions, (row) => /* @__PURE__ */ jsx(RowActionsCell, { children: renderActions(row) })));
     }
-    all.push(cell(SCRIPT_COLUMNS.open, (row) => row.href ? /* @__PURE__ */ jsx(OpenInNewTabCell, { href: row.href }) : null));
+    all.push(cell(SCRIPT_COLUMNS.open, (row) => row.href !== void 0 ? /* @__PURE__ */ jsx(OpenInNewTabCell, { href: row.href }) : null));
     return hideColumns ? all.filter((column) => !hideColumns.includes(column.id ?? "")) : all;
   }, [hideColumns, renderActions]);
+  const loadingRows = useMemo(
+    () => loading ? dataTableLoadingRows(skeletonRows ?? DATA_TABLE_SKELETON_ROWS, loadingScript) : null,
+    [loading, skeletonRows]
+  );
   const table = useDataTable({
-    data: rows,
+    data: loadingRows ?? rows,
     columns,
     getRowId: (row) => row.id,
     enableSorting: false
   });
-  const rowHref = useCallback((row) => row.href, []);
-  const showHeader = isLoading || rows.length > 0;
+  const rowHref = useCallback((row) => row.href || void 0, []);
+  const showHeader = loading || rows.length > 0;
   return /* @__PURE__ */ jsxs(DataTable, { table, children: [
     showHeader && /* @__PURE__ */ jsx(DataTable.Header, { stickyHeader, stickyHeaderOffset, rightSlot }),
     /* @__PURE__ */ jsx(
       DataTable.Body,
       {
-        loading: isLoading,
+        loading,
+        loadingCells: true,
         skeletonRows,
         emptyMessage,
         rowClassName: "mb-1",

package/dist/components/features/select-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"select-button.d.ts","sourceRoot":"","sources":["../../../src/components/features/select-button.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE/C,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE;QACN,GAAG,EAAE,MAAM,CAAC;QACZ,GAAG,EAAE,MAAM,CAAC;KACb,CAAC;IACF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,UAAU,CAAC,EAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;IACjC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,YAAY,6FAqFxB,CAAC"}
+{"version":3,"file":"select-button.d.ts","sourceRoot":"","sources":["../../../src/components/features/select-button.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE/C,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,KAAK,CAAC,EAAE;QACN,GAAG,EAAE,MAAM,CAAC;QACZ,GAAG,EAAE,MAAM,CAAC;KACb,CAAC;IACF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,UAAU,CAAC,EAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;IACjC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,YAAY,6FA4ExB,CAAC"}

package/dist/components/features/select-button.js

@@ -4,6 +4,7 @@ import React from "react";
 import Image from "../../embed-shims/next-image.js";
 import { cn } from "../../utils/cn.js";
 import { CheckCircleIcon } from "../icons-v2-generated/signs-and-symbols/check-circle-icon.js";
+import { Button } from "../ui/button/index.js";
 import { Tag } from "../ui/tag.js";
 const SelectButton = React.forwardRef(
   ({
@@ -19,25 +20,17 @@ const SelectButton = React.forwardRef(
     className
   }, ref) => {
     return /* @__PURE__ */ jsxs(
-      "button",
+      Button,
       {
+        variant: "field",
         ref,
         type: "button",
         role: "option",
         "aria-selected": selected,
+        "data-state": selected ? "open" : void 0,
         disabled,
         onClick,
-        className: cn(
-          "group flex h-11 items-center gap-1 rounded-[6px] border px-3 py-3 transition-colors duration-200 content-md:h-16 content-md:gap-2 content-md:px-4",
-          "w-full text-left font-body",
-          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ods-focus",
-          "disabled:pointer-events-none disabled:opacity-50",
-          // Hover / active move the BACKGROUND only, like Input — the accent
-          // border is reserved for the selected state, so an unselected button
-          // no longer flashes "selected" under the cursor.
-          selected ? "border-ods-accent bg-ods-open-yellow-light hover:bg-ods-open-yellow-light-hover active:bg-ods-open-yellow-light-action" : "border-ods-border bg-ods-card hover:bg-ods-bg-hover active:bg-ods-bg-active",
-          className
-        ),
+        className: cn("content-md:h-16", className),
         children: [
           icon && /* @__PURE__ */ jsx(
             "span",

package/dist/components/features/status-filter-component.d.ts

@@ -42,18 +42,4 @@ export declare const STATUS_FILTER_SKELETON_PILLS = 3;
  * Displays a row of status filter buttons matching the blog posts dashboard pattern
  */
 export declare function StatusFilterComponent({ selectedStatus, onStatusChange, statusOptions, showCount, count, className, disabledValues, label, showAll, loading, }: StatusFilterComponentProps): import("react").JSX.Element;
-/**
- * The status filter while its page is read: the same row, its label and "All" for real (the row's own words), the
- * `options` the page states for real, else `pills` option buttons as boxes of the buttons' size. With `showCount`
- * the count is a bar before "items".
- */
-export declare function StatusFilterComponentSkeleton({ label, options, pills, showAll, showCount, className, }: {
-    label?: string;
-    /** Option labels the page states itself: drawn as real buttons (in place of `pills` boxes). */
-    options?: string[];
-    pills?: number;
-    showAll?: boolean;
-    showCount?: boolean;
-    className?: string;
-}): import("react").JSX.Element;
 //# sourceMappingURL=status-filter-component.d.ts.map

package/dist/components/features/status-filter-component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"status-filter-component.d.ts","sourceRoot":"","sources":["../../../src/components/features/status-filter-component.tsx"],"names":[],"mappings":"AASA,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,0BAA0B;IACzC,cAAc,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,aAAa,EAAE,YAAY,EAAE,CAAC;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;2EAGuE;IACvE,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kHAAkH;IAClH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAYD,0FAA0F;AAC1F,eAAO,MAAM,4BAA4B,IAAI,CAAC;AAE9C;;;;GAIG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,cAAc,EACd,cAAc,EACd,aAAa,EACb,SAAiB,EACjB,KAAS,EACT,SAAc,EACd,cAAmB,EACnB,KAAgB,EAChB,OAAc,EACd,OAAe,GAChB,EAAE,0BAA0B,+BAyD5B;AAED;;;;GAIG;AACH,wBAAgB,6BAA6B,CAAC,EAC5C,KAAgB,EAChB,OAAO,EACP,KAAoC,EACpC,OAAc,EACd,SAAiB,EACjB,SAAS,GACV,EAAE;IACD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+FAA+F;IAC/F,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAyCA"}
+{"version":3,"file":"status-filter-component.d.ts","sourceRoot":"","sources":["../../../src/components/features/status-filter-component.tsx"],"names":[],"mappings":"AASA,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,0BAA0B;IACzC,cAAc,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,aAAa,EAAE,YAAY,EAAE,CAAC;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;2EAGuE;IACvE,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kHAAkH;IAClH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAYD,0FAA0F;AAC1F,eAAO,MAAM,4BAA4B,IAAI,CAAC;AAE9C;;;;GAIG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,cAAc,EACd,cAAc,EACd,aAAa,EACb,SAAiB,EACjB,KAAS,EACT,SAAc,EACd,cAAmB,EACnB,KAAgB,EAChB,OAAc,EACd,OAAe,GAChB,EAAE,0BAA0B,+BAyD5B"}

package/dist/components/features/status-filter-component.js

@@ -119,6 +119,5 @@ function StatusFilterComponentSkeleton({
 }
 export {
   STATUS_FILTER_SKELETON_PILLS,
-  StatusFilterComponent,
-  StatusFilterComponentSkeleton
+  StatusFilterComponent
 };

package/dist/components/features/tags-selector.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tags-selector.d.ts","sourceRoot":"","sources":["../../../src/components/features/tags-selector.tsx"],"names":[],"mappings":"AAOA,UAAU,GAAG;IACX,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd;AAED,UAAU,iBAAiB;IACzB,aAAa,EAAE,GAAG,EAAE,CAAC;IACrB,cAAc,EAAE,MAAM,EAAE,CAAC;IACzB,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACzC,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC,GAAG,GAAG,IAAI,CAAC,CAAC;IACvD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,YAAY,CAAC,EAC3B,aAAa,EACb,cAAc,EACd,YAAY,EACZ,WAAW,EACX,OAAY,EACZ,WAA8B,EAC9B,SAAS,EACT,QAAgB,EAChB,WAAkB,GACnB,EAAE,iBAAiB,+BAyMnB"}
+{"version":3,"file":"tags-selector.d.ts","sourceRoot":"","sources":["../../../src/components/features/tags-selector.tsx"],"names":[],"mappings":"AAOA,UAAU,GAAG;IACX,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd;AAED,UAAU,iBAAiB;IACzB,aAAa,EAAE,GAAG,EAAE,CAAC;IACrB,cAAc,EAAE,MAAM,EAAE,CAAC;IACzB,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACzC,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC,GAAG,GAAG,IAAI,CAAC,CAAC;IACvD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,YAAY,CAAC,EAC3B,aAAa,EACb,cAAc,EACd,YAAY,EACZ,WAAW,EACX,OAAY,EACZ,WAA8B,EAC9B,SAAS,EACT,QAAgB,EAChB,WAAkB,GACnB,EAAE,iBAAiB,+BA0MnB"}

package/dist/components/features/tags-selector.js

@@ -76,17 +76,18 @@ function TagsSelector({
                 children: [
                   tag.name,
                   !disabled && /* @__PURE__ */ jsx(
-                    "button",
+                    Button,
                     {
+                      variant: "transparent",
+                      size: "icon-inline",
                       type: "button",
                       onClick: (e) => {
                         e.preventDefault();
                         e.stopPropagation();
                         handleTagRemove(tag.id);
                       },
-                      className: "inline-flex h-4 w-4 items-center justify-center rounded-full text-ods-text-secondary transition-colors hover:bg-ods-accent/20 hover:text-ods-text-primary",
                       "aria-label": `Remove ${tag.name}`,
-                      children: /* @__PURE__ */ jsx(X, { className: "h-3 w-3" })
+                      children: /* @__PURE__ */ jsx(X, {})
                     }
                   )
                 ]

package/dist/components/features/ticket-status-config-list/ticket-status-config-list.d.ts

@@ -19,8 +19,17 @@ export interface TicketStatusConfigListProps<T extends {
     renderRow: (item: T, args: SortableRowRenderArgs) => ReactNode;
     /** Names a row for the live region and the move buttons, e.g. its status name. */
     getItemLabel?: (index: number) => string | undefined;
+    /**
+     * The rows are being read. With no rows yet the list draws `skeletonRows` row skeletons (a loading scope does the
+     * same); rows it already has draw themselves.
+     */
+    loading?: boolean;
+    /** Row skeletons while loading with no rows. Default `TICKET_STATUS_CONFIG_LIST_SKELETON_ROWS`. */
+    skeletonRows?: number;
     className?: string;
 }
+/** Row skeletons a status list draws while it has none: a typical list (the list is not paged). */
+export declare const TICKET_STATUS_CONFIG_LIST_SKELETON_ROWS = 4;
 /**
  * A reorderable list of config rows (ticket statuses, AI quick actions), built
  * on {@link SortableList} — Pragmatic drag and drop on desktop, an explicit
@@ -31,5 +40,5 @@ export interface TicketStatusConfigListProps<T extends {
  */
 export declare function TicketStatusConfigList<T extends {
     id: string;
-}>({ items, onReorder, renderRow, getItemLabel, className, }: TicketStatusConfigListProps<T>): import("react").JSX.Element;
+}>({ items, onReorder, renderRow, getItemLabel, loading: loadingProp, skeletonRows, className, }: TicketStatusConfigListProps<T>): import("react").JSX.Element;
 //# sourceMappingURL=ticket-status-config-list.d.ts.map

package/dist/components/features/ticket-status-config-list/ticket-status-config-list.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ticket-status-config-list.d.ts","sourceRoot":"","sources":["../../../../src/components/features/ticket-status-config-list/ticket-status-config-list.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,OAAO,EAAE,KAAK,uBAAuB,EAAmB,MAAM,oCAAoC,CAAC;AAEnG,MAAM,WAAW,qBAAqB;IACpC,6EAA6E;IAC7E,eAAe,EAAE,uBAAuB,CAAC;IACzC,UAAU,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,WAAW,EAAE,SAAS,GAAG,IAAI,CAAC;CAC/B;AAED,MAAM,WAAW,2BAA2B,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE;IACnE,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,SAAS,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACxD,SAAS,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,qBAAqB,KAAK,SAAS,CAAC;IAC/D,kFAAkF;IAClF,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,wBAAgB,sBAAsB,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,EAAE,EAC/D,KAAK,EACL,SAAS,EACT,SAAS,EACT,YAAY,EACZ,SAAS,GACV,EAAE,2BAA2B,CAAC,CAAC,CAAC,+BAchC"}
+{"version":3,"file":"ticket-status-config-list.d.ts","sourceRoot":"","sources":["../../../../src/components/features/ticket-status-config-list/ticket-status-config-list.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,OAAO,EAAE,KAAK,uBAAuB,EAAmB,MAAM,oCAAoC,CAAC;AAEnG,MAAM,WAAW,qBAAqB;IACpC,6EAA6E;IAC7E,eAAe,EAAE,uBAAuB,CAAC;IACzC,UAAU,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,WAAW,EAAE,SAAS,GAAG,IAAI,CAAC;CAC/B;AAED,MAAM,WAAW,2BAA2B,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE;IACnE,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,SAAS,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACxD,SAAS,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,qBAAqB,KAAK,SAAS,CAAC;IAC/D,kFAAkF;IAClF,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,GAAG,SAAS,CAAC;IACrD;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mGAAmG;IACnG,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,mGAAmG;AACnG,eAAO,MAAM,uCAAuC,IAAI,CAAC;AAMzD;;;;;;;GAOG;AACH,wBAAgB,sBAAsB,CAAC,CAAC,SAAS;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,EAAE,EAC/D,KAAK,EACL,SAAS,EACT,SAAS,EACT,YAAY,EACZ,OAAO,EAAE,WAAW,EACpB,YAAsD,EACtD,SAAS,GACV,EAAE,2BAA2B,CAAC,CAAC,CAAC,+BAyChC"}