@contractspec/lib.example-shared-ui 3.4.2 → 4.0.0

package/dist/browser/bundles/index.js

@@ -0,0 +1,85 @@
+// src/bundles/ExampleTemplateBundle.ts
+import { defineModuleBundle } from "@contractspec/lib.surface-runtime/spec";
+var ExampleTemplateBundle = defineModuleBundle({
+  meta: {
+    key: "example.template",
+    version: "0.1.0",
+    title: "Example Template",
+    description: "Adaptive template shell for ContractSpec examples",
+    owners: ["team-platform"],
+    tags: ["example", "template"],
+    stability: "experimental"
+  },
+  routes: [
+    {
+      routeId: "template",
+      path: "/sandbox",
+      defaultSurface: "template-shell"
+    }
+  ],
+  surfaces: {
+    "template-shell": {
+      surfaceId: "template-shell",
+      kind: "workbench",
+      title: "Template Shell",
+      slots: [
+        {
+          slotId: "header",
+          role: "header",
+          accepts: ["action-bar"],
+          cardinality: "many"
+        },
+        {
+          slotId: "primary",
+          role: "primary",
+          accepts: ["entity-section", "rich-doc", "form", "custom-widget"],
+          cardinality: "many"
+        },
+        {
+          slotId: "sidebar",
+          role: "secondary",
+          accepts: ["entity-section", "custom-widget"],
+          cardinality: "one"
+        }
+      ],
+      layouts: [
+        {
+          layoutId: "main-with-sidebar",
+          title: "Main with sidebar",
+          root: {
+            type: "panel-group",
+            direction: "horizontal",
+            persistKey: "example.template.main-sidebar",
+            children: [
+              {
+                type: "panel-group",
+                direction: "vertical",
+                persistKey: "example.template.content",
+                children: [
+                  { type: "slot", slotId: "header" },
+                  { type: "slot", slotId: "primary" }
+                ]
+              },
+              { type: "slot", slotId: "sidebar" }
+            ]
+          }
+        }
+      ],
+      data: [],
+      verification: {
+        dimensions: {
+          guidance: "Can reveal hints and walkthrough notes.",
+          density: "Can select compact or balanced layouts.",
+          dataDepth: "Controls content depth and expansion.",
+          control: "Shows advanced options when allowed.",
+          media: "Supports text-first and hybrid modes.",
+          pace: "Maps to motion tokens and transitions.",
+          narrative: "Can order summary before or after detail."
+        }
+      }
+    }
+  }
+});
+export {
+  ExampleTemplateBundle
+};

package/dist/browser/index.js

@@ -2128,6 +2128,79 @@ function SaveToStudioButton({
   }, undefined, true, undefined, this);
 }
 
+// src/SpecDrivenTemplateShell.tsx
+import { BundleProvider, BundleRenderer } from "@contractspec/lib.surface-runtime/react";
+import { jsxDEV as jsxDEV8 } from "react/jsx-dev-runtime";
+function SpecDrivenTemplateShell({
+  plan,
+  title,
+  description,
+  sidebar,
+  actions,
+  showSaveAction = true,
+  saveProps,
+  children
+}) {
+  const headerContent = /* @__PURE__ */ jsxDEV8("header", {
+    className: "border-border bg-card rounded-2xl border p-6 shadow-sm",
+    children: [
+      /* @__PURE__ */ jsxDEV8("div", {
+        className: "flex flex-wrap items-center justify-between gap-4",
+        children: [
+          /* @__PURE__ */ jsxDEV8("div", {
+            children: [
+              /* @__PURE__ */ jsxDEV8("p", {
+                className: "text-muted-foreground text-sm font-semibold tracking-wide uppercase",
+                children: "ContractSpec Templates"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV8("h1", {
+                className: "text-3xl font-bold",
+                children: title
+              }, undefined, false, undefined, this),
+              description ? /* @__PURE__ */ jsxDEV8("p", {
+                className: "text-muted-foreground mt-2 max-w-2xl text-sm",
+                children: description
+              }, undefined, false, undefined, this) : null
+            ]
+          }, undefined, true, undefined, this),
+          /* @__PURE__ */ jsxDEV8("div", {
+            className: "flex flex-col items-end gap-2",
+            children: [
+              /* @__PURE__ */ jsxDEV8(LocalDataIndicator, {}, undefined, false, undefined, this),
+              showSaveAction ? /* @__PURE__ */ jsxDEV8(SaveToStudioButton, {
+                ...saveProps
+              }, undefined, false, undefined, this) : null
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      actions ? /* @__PURE__ */ jsxDEV8("div", {
+        className: "mt-4",
+        children: actions
+      }, undefined, false, undefined, this) : null
+    ]
+  }, undefined, true, undefined, this);
+  const slotContent = {
+    header: headerContent,
+    primary: /* @__PURE__ */ jsxDEV8("main", {
+      className: "space-y-4 p-2",
+      children
+    }, undefined, false, undefined, this)
+  };
+  if (sidebar != null) {
+    slotContent.sidebar = /* @__PURE__ */ jsxDEV8("aside", {
+      className: "border-border bg-card rounded-2xl border p-4",
+      children: sidebar
+    }, undefined, false, undefined, this);
+  }
+  return /* @__PURE__ */ jsxDEV8(BundleProvider, {
+    plan,
+    children: /* @__PURE__ */ jsxDEV8(BundleRenderer, {
+      slotContent
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+
 // src/utils/generateSpecFromTemplate.ts
 function generateSpecFromTemplate(template) {
   const templateId = template?.id ?? "unknown";
@@ -2697,7 +2770,7 @@ function useSpecContent(templateId) {
 import { useCallback as useCallback8, useEffect as useEffect5 } from "react";
 import { Button as Button5, LoaderBlock as LoaderBlock3 } from "@contractspec/lib.design-system";
 import { Badge as Badge5 } from "@contractspec/lib.ui-kit-web/ui/badge";
-import { jsxDEV as jsxDEV8 } from "react/jsx-dev-runtime";
+import { jsxDEV as jsxDEV9 } from "react/jsx-dev-runtime";
 "use client";
 function SpecEditorPanel({
   templateId,
@@ -2739,54 +2812,54 @@ function SpecEditorPanel({
     onLog?.("Spec reset to template defaults");
   }, [reset, onLog]);
   if (loading) {
-    return /* @__PURE__ */ jsxDEV8(LoaderBlock3, {
+    return /* @__PURE__ */ jsxDEV9(LoaderBlock3, {
       label: "Loading spec..."
     }, undefined, false, undefined, this);
   }
-  return /* @__PURE__ */ jsxDEV8("div", {
+  return /* @__PURE__ */ jsxDEV9("div", {
     className: "space-y-4",
     children: [
-      /* @__PURE__ */ jsxDEV8("div", {
+      /* @__PURE__ */ jsxDEV9("div", {
         className: "flex items-center justify-between",
         children: [
-          /* @__PURE__ */ jsxDEV8("div", {
+          /* @__PURE__ */ jsxDEV9("div", {
             className: "flex items-center gap-2",
             children: [
-              /* @__PURE__ */ jsxDEV8(Button5, {
+              /* @__PURE__ */ jsxDEV9(Button5, {
                 variant: "default",
                 size: "sm",
                 onClick: handleSave,
                 children: "Save"
               }, undefined, false, undefined, this),
-              /* @__PURE__ */ jsxDEV8(Button5, {
+              /* @__PURE__ */ jsxDEV9(Button5, {
                 variant: "outline",
                 size: "sm",
                 onClick: handleValidate,
                 children: "Validate"
               }, undefined, false, undefined, this),
-              isDirty && /* @__PURE__ */ jsxDEV8(Badge5, {
+              isDirty && /* @__PURE__ */ jsxDEV9(Badge5, {
                 variant: "secondary",
                 className: "border-amber-500/30 bg-amber-500/20 text-amber-400",
                 children: "Unsaved changes"
               }, undefined, false, undefined, this),
-              validation && /* @__PURE__ */ jsxDEV8(Badge5, {
+              validation && /* @__PURE__ */ jsxDEV9(Badge5, {
                 variant: validation.valid ? "default" : "destructive",
                 className: validation.valid ? "border-green-500/30 bg-green-500/20 text-green-400" : "",
                 children: validation.valid ? "Valid" : `${validation.errors.filter((e) => e.severity === "error").length} errors`
               }, undefined, false, undefined, this)
             ]
           }, undefined, true, undefined, this),
-          /* @__PURE__ */ jsxDEV8("div", {
+          /* @__PURE__ */ jsxDEV9("div", {
             className: "flex items-center gap-2",
             children: [
-              lastSaved && /* @__PURE__ */ jsxDEV8("span", {
+              lastSaved && /* @__PURE__ */ jsxDEV9("span", {
                 className: "text-muted-foreground text-xs",
                 children: [
                   "Last saved: ",
                   new Date(lastSaved).toLocaleTimeString()
                 ]
               }, undefined, true, undefined, this),
-              /* @__PURE__ */ jsxDEV8(Button5, {
+              /* @__PURE__ */ jsxDEV9(Button5, {
                 variant: "ghost",
                 size: "sm",
                 onPress: handleReset,
@@ -2796,16 +2869,16 @@ function SpecEditorPanel({
           }, undefined, true, undefined, this)
         ]
       }, undefined, true, undefined, this),
-      validation && validation.errors.length > 0 && /* @__PURE__ */ jsxDEV8("div", {
+      validation && validation.errors.length > 0 && /* @__PURE__ */ jsxDEV9("div", {
         className: "rounded-lg border border-amber-500/50 bg-amber-500/10 p-3",
         children: [
-          /* @__PURE__ */ jsxDEV8("p", {
+          /* @__PURE__ */ jsxDEV9("p", {
             className: "mb-2 text-xs font-semibold text-amber-400 uppercase",
             children: "Validation Issues"
           }, undefined, false, undefined, this),
-          /* @__PURE__ */ jsxDEV8("ul", {
+          /* @__PURE__ */ jsxDEV9("ul", {
             className: "space-y-1",
-            children: validation.errors.map((error, index) => /* @__PURE__ */ jsxDEV8("li", {
+            children: validation.errors.map((error, index) => /* @__PURE__ */ jsxDEV9("li", {
               className: `text-xs ${error.severity === "error" ? "text-red-400" : "text-amber-400"}`,
               children: [
                 "Line ",
@@ -2817,9 +2890,9 @@ function SpecEditorPanel({
           }, undefined, false, undefined, this)
         ]
       }, undefined, true, undefined, this),
-      /* @__PURE__ */ jsxDEV8("div", {
+      /* @__PURE__ */ jsxDEV9("div", {
         className: "border-border bg-card rounded-2xl border p-4",
-        children: /* @__PURE__ */ jsxDEV8(SpecEditor, {
+        children: /* @__PURE__ */ jsxDEV9(SpecEditor, {
           projectId: "sandbox",
           type: "CAPABILITY",
           content,
@@ -2834,7 +2907,7 @@ function SpecEditorPanel({
 }
 
 // src/TemplateShell.tsx
-import { jsxDEV as jsxDEV9 } from "react/jsx-dev-runtime";
+import { jsxDEV as jsxDEV10 } from "react/jsx-dev-runtime";
 var TemplateShell = ({
   title,
   description,
@@ -2843,56 +2916,56 @@ var TemplateShell = ({
   showSaveAction = true,
   saveProps,
   children
-}) => /* @__PURE__ */ jsxDEV9("div", {
+}) => /* @__PURE__ */ jsxDEV10("div", {
   className: "space-y-6",
   children: [
-    /* @__PURE__ */ jsxDEV9("header", {
+    /* @__PURE__ */ jsxDEV10("header", {
       className: "border-border bg-card rounded-2xl border p-6 shadow-sm",
       children: [
-        /* @__PURE__ */ jsxDEV9("div", {
+        /* @__PURE__ */ jsxDEV10("div", {
           className: "flex flex-wrap items-center justify-between gap-4",
           children: [
-            /* @__PURE__ */ jsxDEV9("div", {
+            /* @__PURE__ */ jsxDEV10("div", {
               children: [
-                /* @__PURE__ */ jsxDEV9("p", {
+                /* @__PURE__ */ jsxDEV10("p", {
                   className: "text-muted-foreground text-sm font-semibold tracking-wide uppercase",
                   children: "ContractSpec Templates"
                 }, undefined, false, undefined, this),
-                /* @__PURE__ */ jsxDEV9("h1", {
+                /* @__PURE__ */ jsxDEV10("h1", {
                   className: "text-3xl font-bold",
                   children: title
                 }, undefined, false, undefined, this),
-                description ? /* @__PURE__ */ jsxDEV9("p", {
+                description ? /* @__PURE__ */ jsxDEV10("p", {
                   className: "text-muted-foreground mt-2 max-w-2xl text-sm",
                   children: description
                 }, undefined, false, undefined, this) : null
               ]
             }, undefined, true, undefined, this),
-            /* @__PURE__ */ jsxDEV9("div", {
+            /* @__PURE__ */ jsxDEV10("div", {
               className: "flex flex-col items-end gap-2",
               children: [
-                /* @__PURE__ */ jsxDEV9(LocalDataIndicator, {}, undefined, false, undefined, this),
-                showSaveAction ? /* @__PURE__ */ jsxDEV9(SaveToStudioButton, {
+                /* @__PURE__ */ jsxDEV10(LocalDataIndicator, {}, undefined, false, undefined, this),
+                showSaveAction ? /* @__PURE__ */ jsxDEV10(SaveToStudioButton, {
                   ...saveProps
                 }, undefined, false, undefined, this) : null
               ]
             }, undefined, true, undefined, this)
           ]
         }, undefined, true, undefined, this),
-        actions ? /* @__PURE__ */ jsxDEV9("div", {
+        actions ? /* @__PURE__ */ jsxDEV10("div", {
           className: "mt-4",
           children: actions
         }, undefined, false, undefined, this) : null
       ]
     }, undefined, true, undefined, this),
-    /* @__PURE__ */ jsxDEV9("div", {
+    /* @__PURE__ */ jsxDEV10("div", {
       className: sidebar ? "grid gap-6 lg:grid-cols-[minmax(0,1fr)_320px]" : "w-full",
       children: [
-        /* @__PURE__ */ jsxDEV9("main", {
+        /* @__PURE__ */ jsxDEV10("main", {
           className: "space-y-4 p-2",
           children
         }, undefined, false, undefined, this),
-        sidebar ? /* @__PURE__ */ jsxDEV9("aside", {
+        sidebar ? /* @__PURE__ */ jsxDEV10("aside", {
           className: "border-border bg-card rounded-2xl border p-4",
           children: sidebar
         }, undefined, false, undefined, this) : null
@@ -3486,6 +3559,7 @@ export {
   TemplateRuntimeContext,
   TemplateComponentRegistry,
   SpecEditorPanel,
+  SpecDrivenTemplateShell,
   SaveToStudioButton,
   PersonalizationInsights,
   OverlayContextProvider,

package/dist/bundles/ExampleTemplateBundle.d.ts

@@ -0,0 +1,79 @@
+/**
+ * Minimal bundle spec for example template shells.
+ * Requires @contractspec/lib.surface-runtime when used.
+ */
+export declare const ExampleTemplateBundle: {
+    readonly meta: {
+        readonly key: "example.template";
+        readonly version: "0.1.0";
+        readonly title: "Example Template";
+        readonly description: "Adaptive template shell for ContractSpec examples";
+        readonly owners: ["team-platform"];
+        readonly tags: ["example", "template"];
+        readonly stability: "experimental";
+    };
+    readonly routes: [{
+        readonly routeId: "template";
+        readonly path: "/sandbox";
+        readonly defaultSurface: "template-shell";
+    }];
+    readonly surfaces: {
+        readonly 'template-shell': {
+            readonly surfaceId: "template-shell";
+            readonly kind: "workbench";
+            readonly title: "Template Shell";
+            readonly slots: [{
+                readonly slotId: "header";
+                readonly role: "header";
+                readonly accepts: ["action-bar"];
+                readonly cardinality: "many";
+            }, {
+                readonly slotId: "primary";
+                readonly role: "primary";
+                readonly accepts: ["entity-section", "rich-doc", "form", "custom-widget"];
+                readonly cardinality: "many";
+            }, {
+                readonly slotId: "sidebar";
+                readonly role: "secondary";
+                readonly accepts: ["entity-section", "custom-widget"];
+                readonly cardinality: "one";
+            }];
+            readonly layouts: [{
+                readonly layoutId: "main-with-sidebar";
+                readonly title: "Main with sidebar";
+                readonly root: {
+                    readonly type: "panel-group";
+                    readonly direction: "horizontal";
+                    readonly persistKey: "example.template.main-sidebar";
+                    readonly children: [{
+                        readonly type: "panel-group";
+                        readonly direction: "vertical";
+                        readonly persistKey: "example.template.content";
+                        readonly children: [{
+                            readonly type: "slot";
+                            readonly slotId: "header";
+                        }, {
+                            readonly type: "slot";
+                            readonly slotId: "primary";
+                        }];
+                    }, {
+                        readonly type: "slot";
+                        readonly slotId: "sidebar";
+                    }];
+                };
+            }];
+            readonly data: [];
+            readonly verification: {
+                readonly dimensions: {
+                    readonly guidance: "Can reveal hints and walkthrough notes.";
+                    readonly density: "Can select compact or balanced layouts.";
+                    readonly dataDepth: "Controls content depth and expansion.";
+                    readonly control: "Shows advanced options when allowed.";
+                    readonly media: "Supports text-first and hybrid modes.";
+                    readonly pace: "Maps to motion tokens and transitions.";
+                    readonly narrative: "Can order summary before or after detail.";
+                };
+            };
+        };
+    };
+};

package/dist/bundles/ExampleTemplateBundle.js

@@ -0,0 +1,86 @@
+// @bun
+// src/bundles/ExampleTemplateBundle.ts
+import { defineModuleBundle } from "@contractspec/lib.surface-runtime/spec";
+var ExampleTemplateBundle = defineModuleBundle({
+  meta: {
+    key: "example.template",
+    version: "0.1.0",
+    title: "Example Template",
+    description: "Adaptive template shell for ContractSpec examples",
+    owners: ["team-platform"],
+    tags: ["example", "template"],
+    stability: "experimental"
+  },
+  routes: [
+    {
+      routeId: "template",
+      path: "/sandbox",
+      defaultSurface: "template-shell"
+    }
+  ],
+  surfaces: {
+    "template-shell": {
+      surfaceId: "template-shell",
+      kind: "workbench",
+      title: "Template Shell",
+      slots: [
+        {
+          slotId: "header",
+          role: "header",
+          accepts: ["action-bar"],
+          cardinality: "many"
+        },
+        {
+          slotId: "primary",
+          role: "primary",
+          accepts: ["entity-section", "rich-doc", "form", "custom-widget"],
+          cardinality: "many"
+        },
+        {
+          slotId: "sidebar",
+          role: "secondary",
+          accepts: ["entity-section", "custom-widget"],
+          cardinality: "one"
+        }
+      ],
+      layouts: [
+        {
+          layoutId: "main-with-sidebar",
+          title: "Main with sidebar",
+          root: {
+            type: "panel-group",
+            direction: "horizontal",
+            persistKey: "example.template.main-sidebar",
+            children: [
+              {
+                type: "panel-group",
+                direction: "vertical",
+                persistKey: "example.template.content",
+                children: [
+                  { type: "slot", slotId: "header" },
+                  { type: "slot", slotId: "primary" }
+                ]
+              },
+              { type: "slot", slotId: "sidebar" }
+            ]
+          }
+        }
+      ],
+      data: [],
+      verification: {
+        dimensions: {
+          guidance: "Can reveal hints and walkthrough notes.",
+          density: "Can select compact or balanced layouts.",
+          dataDepth: "Controls content depth and expansion.",
+          control: "Shows advanced options when allowed.",
+          media: "Supports text-first and hybrid modes.",
+          pace: "Maps to motion tokens and transitions.",
+          narrative: "Can order summary before or after detail."
+        }
+      }
+    }
+  }
+});
+export {
+  ExampleTemplateBundle
+};

package/dist/bundles/index.d.ts

@@ -0,0 +1 @@
+export { ExampleTemplateBundle } from './ExampleTemplateBundle';

package/dist/bundles/index.js

@@ -0,0 +1,86 @@
+// @bun
+// src/bundles/ExampleTemplateBundle.ts
+import { defineModuleBundle } from "@contractspec/lib.surface-runtime/spec";
+var ExampleTemplateBundle = defineModuleBundle({
+  meta: {
+    key: "example.template",
+    version: "0.1.0",
+    title: "Example Template",
+    description: "Adaptive template shell for ContractSpec examples",
+    owners: ["team-platform"],
+    tags: ["example", "template"],
+    stability: "experimental"
+  },
+  routes: [
+    {
+      routeId: "template",
+      path: "/sandbox",
+      defaultSurface: "template-shell"
+    }
+  ],
+  surfaces: {
+    "template-shell": {
+      surfaceId: "template-shell",
+      kind: "workbench",
+      title: "Template Shell",
+      slots: [
+        {
+          slotId: "header",
+          role: "header",
+          accepts: ["action-bar"],
+          cardinality: "many"
+        },
+        {
+          slotId: "primary",
+          role: "primary",
+          accepts: ["entity-section", "rich-doc", "form", "custom-widget"],
+          cardinality: "many"
+        },
+        {
+          slotId: "sidebar",
+          role: "secondary",
+          accepts: ["entity-section", "custom-widget"],
+          cardinality: "one"
+        }
+      ],
+      layouts: [
+        {
+          layoutId: "main-with-sidebar",
+          title: "Main with sidebar",
+          root: {
+            type: "panel-group",
+            direction: "horizontal",
+            persistKey: "example.template.main-sidebar",
+            children: [
+              {
+                type: "panel-group",
+                direction: "vertical",
+                persistKey: "example.template.content",
+                children: [
+                  { type: "slot", slotId: "header" },
+                  { type: "slot", slotId: "primary" }
+                ]
+              },
+              { type: "slot", slotId: "sidebar" }
+            ]
+          }
+        }
+      ],
+      data: [],
+      verification: {
+        dimensions: {
+          guidance: "Can reveal hints and walkthrough notes.",
+          density: "Can select compact or balanced layouts.",
+          dataDepth: "Controls content depth and expansion.",
+          control: "Shows advanced options when allowed.",
+          media: "Supports text-first and hybrid modes.",
+          pace: "Maps to motion tokens and transitions.",
+          narrative: "Can order summary before or after detail."
+        }
+      }
+    }
+  }
+});
+export {
+  ExampleTemplateBundle
+};

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 export * from './TemplateShell';
+export * from './SpecDrivenTemplateShell';
 export * from './LocalDataIndicator';
 export * from './SaveToStudioButton';
 export * from './overlay-types';