@contractspec/bundle.library 0.0.0-canary-20260206014742

package/dist/components/docs/specs/SpecsWorkflowsPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpecsWorkflowsPage.js","names":[],"sources":["../../../../src/components/docs/specs/SpecsWorkflowsPage.tsx"],"sourcesContent":["import Link from '@contractspec/lib.ui-link';\nimport { ChevronRight } from 'lucide-react';\n\n// export const metadata = {\n//   title: 'Workflows: ContractSpec Docs',\n//   description:\n//     'Learn how to define multi-step workflows with retries, compensation, and monitoring in ContractSpec.',\n// };\n\nexport function SpecsWorkflowsPage() {\n  return (\n    <div className=\"space-y-8\">\n      <div className=\"space-y-4\">\n        <h1 className=\"text-4xl font-bold\">Workflows</h1>\n        <p className=\"text-muted-foreground\">\n          A <strong>WorkflowSpec</strong> orchestrates multi-step processes. It\n          defines the sequence of operations, handles failures with retries and\n          compensation, and provides observability into long-running tasks.\n        </p>\n      </div>\n\n      <div className=\"space-y-4\">\n        <h2 className=\"text-2xl font-bold\">Core concepts</h2>\n        <div className=\"space-y-3\">\n          <div>\n            <h3 className=\"text-lg font-semibold\">Identifiers</h3>\n            <p className=\"text-muted-foreground\">\n              Each workflow has a unique{' '}\n              <code className=\"bg-background/50 rounded px-2 py-1\">\n                workflowId\n              </code>{' '}\n              and a{' '}\n              <code className=\"bg-background/50 rounded px-2 py-1\">\n                version\n              </code>\n              . This allows you to run multiple versions of the same workflow\n              simultaneously during migrations or A/B tests.\n            </p>\n          </div>\n          <div>\n            <h3 className=\"text-lg font-semibold\">Steps</h3>\n            <p className=\"text-muted-foreground\">\n              A workflow is composed of <strong>steps</strong>. Each step\n              invokes a{' '}\n              <Link\n                href=\"/docs/specs/capabilities\"\n                className=\"text-violet-400 hover:text-violet-300\"\n              >\n                CapabilitySpec\n              </Link>\n              , passes inputs, and receives outputs. Steps can run sequentially\n              or in parallel.\n            </p>\n          </div>\n          <div>\n            <h3 className=\"text-lg font-semibold\">Transitions</h3>\n            <p className=\"text-muted-foreground\">\n              <strong>Transitions</strong> define the flow between steps. They\n              can be conditional (e.g., \"if payment succeeds, go to step 3;\n              otherwise, go to step 5\") or unconditional.\n            </p>\n          </div>\n          <div>\n            <h3 className=\"text-lg font-semibold\">Retries</h3>\n            <p className=\"text-muted-foreground\">\n              If a step fails, the workflow can retry it with exponential\n              backoff. You specify the maximum number of retries and the backoff\n              strategy in the spec.\n            </p>\n          </div>\n          <div>\n            <h3 className=\"text-lg font-semibold\">Compensation</h3>\n            <p className=\"text-muted-foreground\">\n              When a workflow fails partway through,{' '}\n              <strong>compensation</strong> steps undo the effects of completed\n              steps (e.g., refunding a payment, releasing a reservation). This\n              ensures consistency even in failure scenarios.\n            </p>\n          </div>\n          <div>\n            <h3 className=\"text-lg font-semibold\">SLAs</h3>\n            <p className=\"text-muted-foreground\">\n              You can define Service Level Agreements (SLAs) for each step or\n              the entire workflow. If a step exceeds its SLA, the system can\n              trigger alerts or escalations.\n            </p>\n          </div>\n        </div>\n      </div>\n\n      <div className=\"space-y-4\">\n        <h2 className=\"text-2xl font-bold\">\n          Example WorkflowSpec (TypeScript)\n        </h2>\n        <p className=\"text-muted-foreground\">\n          Here's a simplified example of a payment workflow in TypeScript:\n        </p>\n        <div className=\"bg-background/50 border-border text-muted-foreground overflow-x-auto rounded-lg border p-4 font-mono text-sm\">\n          <pre>{`import { defineWorkflow } from '@contractspec/lib.contracts';\nimport { ValidatePaymentMethod, ChargePayment, SendEmail } from './specs';\n\nexport const PaymentFlow = defineWorkflow({\n  meta: {\n    key: 'payment.flow',\n    version: '1.0.0',\n    description: 'End-to-end payment processing',\n    owners: ['team-payments'],\n    tags: ['payments'],\n    stability: 'stable',\n  },\n  steps: [\n    {\n      id: 'validate-payment',\n      operation: ValidatePaymentMethod,\n      inputs: (ctx, input) => ({\n        userId: ctx.userId,\n        paymentMethodId: input.paymentMethodId,\n      }),\n      retry: {\n        maxAttempts: 3,\n        backoff: 'exponential',\n      },\n      onSuccess: 'charge-payment',\n      onFailure: 'notify-user',\n    },\n    {\n      id: 'charge-payment',\n      operation: ChargePayment,\n      inputs: (ctx, input, steps) => ({\n        amount: input.amount,\n        paymentMethodId: input.paymentMethodId,\n      }),\n      compensation: 'refund-payment',\n      onSuccess: 'send-receipt',\n      onFailure: 'notify-admin',\n    },\n    {\n      id: 'send-receipt',\n      operation: SendEmail,\n      inputs: (ctx, input, steps) => ({\n        to: ctx.userEmail,\n        template: 'payment-receipt',\n        data: steps['charge-payment'].output,\n      }),\n    },\n  ],\n  sla: {\n    maxDuration: 30000, // milliseconds\n    alertOnBreach: true,\n  },\n});`}</pre>\n        </div>\n      </div>\n\n      <div className=\"space-y-4\">\n        <h2 className=\"text-2xl font-bold\">Triggers</h2>\n        <p className=\"text-muted-foreground\">\n          Workflows can be triggered in several ways:\n        </p>\n        <ul className=\"text-muted-foreground list-inside list-disc space-y-2\">\n          <li>\n            <strong>Manual invocation</strong> – A user or system calls the\n            workflow via an API endpoint.\n          </li>\n          <li>\n            <strong>Event-driven</strong> – The workflow starts automatically\n            when a specific event occurs (e.g., a new order is created).\n          </li>\n          <li>\n            <strong>Scheduled</strong> – The workflow runs on a cron schedule\n            (e.g., nightly batch processing).\n          </li>\n          <li>\n            <strong>Chained</strong> – One workflow can invoke another as a\n            step.\n          </li>\n        </ul>\n      </div>\n\n      <div className=\"space-y-4\">\n        <h2 className=\"text-2xl font-bold\">Monitoring and versioning</h2>\n        <p className=\"text-muted-foreground\">\n          ContractSpec automatically instruments workflows with telemetry. You\n          can view:\n        </p>\n        <ul className=\"text-muted-foreground list-inside list-disc space-y-2\">\n          <li>Real-time execution status for each step</li>\n          <li>Historical run data and success/failure rates</li>\n          <li>Latency distributions and SLA compliance</li>\n          <li>Compensation events and retry attempts</li>\n        </ul>\n        <p className=\"text-muted-foreground\">\n          When you update a workflow, you increment its version. Running\n          workflows continue on their original version, while new invocations\n          use the latest version. This allows safe, zero-downtime deployments.\n        </p>\n      </div>\n\n      <div className=\"space-y-4\">\n        <h2 className=\"text-2xl font-bold\">Best practices</h2>\n        <ul className=\"text-muted-foreground list-inside list-disc space-y-2\">\n          <li>\n            Keep steps idempotent – they should be safe to retry without side\n            effects.\n          </li>\n          <li>\n            Define compensation for any step that modifies external state.\n          </li>\n          <li>Use meaningful step IDs that describe the operation.</li>\n          <li>Set realistic SLAs and monitor them in production.</li>\n          <li>Test failure scenarios locally before deploying.</li>\n        </ul>\n      </div>\n\n      <div className=\"flex items-center gap-4 pt-4\">\n        <Link href=\"/docs/specs/capabilities\" className=\"btn-ghost\">\n          Previous: Capabilities\n        </Link>\n        <Link href=\"/docs/safety\" className=\"btn-primary\">\n          Next: Safety Features <ChevronRight size={16} />\n        </Link>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/docs/specs/index.d.ts

@@ -0,0 +1,7 @@
+import { SpecsOverviewPage } from "./SpecsOverviewPage.js";
+import { SpecsCapabilitiesPage } from "./SpecsCapabilitiesPage.js";
+import { SpecsDataViewsPage } from "./SpecsDataViewsPage.js";
+import { SpecsWorkflowsPage } from "./SpecsWorkflowsPage.js";
+import { SpecsPolicyPage } from "./SpecsPolicyPage.js";
+import { SpecsOverlaysPage } from "./SpecsOverlaysPage.js";
+export { SpecsCapabilitiesPage, SpecsDataViewsPage, SpecsOverlaysPage, SpecsOverviewPage, SpecsPolicyPage, SpecsWorkflowsPage };

package/dist/components/docs/specs/index.js

@@ -0,0 +1,8 @@
+import { SpecsOverviewPage } from "./SpecsOverviewPage.js";
+import { SpecsCapabilitiesPage } from "./SpecsCapabilitiesPage.js";
+import { SpecsDataViewsPage } from "./SpecsDataViewsPage.js";
+import { SpecsWorkflowsPage } from "./SpecsWorkflowsPage.js";
+import { SpecsPolicyPage } from "./SpecsPolicyPage.js";
+import { SpecsOverlaysPage } from "./SpecsOverlaysPage.js";
+
+export { SpecsCapabilitiesPage, SpecsDataViewsPage, SpecsOverlaysPage, SpecsOverviewPage, SpecsPolicyPage, SpecsWorkflowsPage };

package/dist/components/docs/studio/StudioBYOKPage.d.ts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/docs/studio/StudioBYOKPage.d.ts
+declare function StudioBYOKPage(): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { StudioBYOKPage };
+//# sourceMappingURL=StudioBYOKPage.d.ts.map

package/dist/components/docs/studio/StudioBYOKPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StudioBYOKPage.d.ts","names":[],"sources":["../../../../src/components/docs/studio/StudioBYOKPage.tsx"],"mappings":";;;iBAyBgB,cAAA,CAAA,GAAc,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/docs/studio/StudioBYOKPage.js

@@ -0,0 +1,79 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/docs/studio/StudioBYOKPage.tsx
+const steps = [
+	{
+		title: "1. Provide vault endpoint",
+		body: "Enter your Vault/HSM URL and the key identifier. Studio only stores the reference."
+	},
+	{
+		title: "2. Verify encryption",
+		body: "Studio runs a test by encrypting a dummy payload and asking you to decrypt it."
+	},
+	{
+		title: "3. Store credentials",
+		body: "When integrations are connected, secrets get encrypted client side before landing in the database."
+	},
+	{
+		title: "4. Rotate keys",
+		body: "Trigger rotation from the BYOK manager. Studio fetches existing secrets, decrypts with the old key, and re-encrypts with the new one."
+	}
+];
+function StudioBYOKPage() {
+	return /* @__PURE__ */ jsxs("main", {
+		className: "space-y-12 py-12",
+		children: [
+			/* @__PURE__ */ jsxs("header", {
+				className: "space-y-3",
+				children: [
+					/* @__PURE__ */ jsx("p", {
+						className: "text-xs font-semibold tracking-[0.3em] text-violet-400 uppercase",
+						children: "BYOK"
+					}),
+					/* @__PURE__ */ jsx("h1", {
+						className: "text-4xl font-bold",
+						children: "Bring your own key to Studio"
+					}),
+					/* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground max-w-3xl text-lg",
+						children: "Keep secrets under your control. Studio never touches plaintext credentials; everything is encrypted with tenant-specific material."
+					})
+				]
+			}),
+			/* @__PURE__ */ jsx("section", {
+				className: "grid gap-4 md:grid-cols-2",
+				children: steps.map((step) => /* @__PURE__ */ jsxs("article", {
+					className: "card-subtle space-y-2 p-6",
+					children: [/* @__PURE__ */ jsx("h2", {
+						className: "text-xl font-semibold",
+						children: step.title
+					}), /* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground text-sm",
+						children: step.body
+					})]
+				}, step.title))
+			}),
+			/* @__PURE__ */ jsxs("section", {
+				className: "space-y-2",
+				children: [
+					/* @__PURE__ */ jsx("h2", {
+						className: "text-2xl font-semibold",
+						children: "Audit trail"
+					}),
+					/* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground text-sm",
+						children: "Every decrypt operation logs who requested it, what integration was involved, and the purpose (sync, deploy, manual action)."
+					}),
+					/* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground text-sm",
+						children: "You can stream audit logs to your SIEM via webhooks or export CSVs for compliance reviews."
+					})
+				]
+			})
+		]
+	});
+}
+
+//#endregion
+export { StudioBYOKPage };
+//# sourceMappingURL=StudioBYOKPage.js.map

package/dist/components/docs/studio/StudioBYOKPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StudioBYOKPage.js","names":[],"sources":["../../../../src/components/docs/studio/StudioBYOKPage.tsx"],"sourcesContent":["// export const metadata: Metadata = {\n//   title: 'Studio – BYOK Setup',\n//   description:\n//     'Configure Bring Your Own Key for ContractSpec Studio. Secure credentials, rotate keys, and audit access.',\n// };\n\nconst steps = [\n  {\n    title: '1. Provide vault endpoint',\n    body: 'Enter your Vault/HSM URL and the key identifier. Studio only stores the reference.',\n  },\n  {\n    title: '2. Verify encryption',\n    body: 'Studio runs a test by encrypting a dummy payload and asking you to decrypt it.',\n  },\n  {\n    title: '3. Store credentials',\n    body: 'When integrations are connected, secrets get encrypted client side before landing in the database.',\n  },\n  {\n    title: '4. Rotate keys',\n    body: 'Trigger rotation from the BYOK manager. Studio fetches existing secrets, decrypts with the old key, and re-encrypts with the new one.',\n  },\n];\n\nexport function StudioBYOKPage() {\n  return (\n    <main className=\"space-y-12 py-12\">\n      <header className=\"space-y-3\">\n        <p className=\"text-xs font-semibold tracking-[0.3em] text-violet-400 uppercase\">\n          BYOK\n        </p>\n        <h1 className=\"text-4xl font-bold\">Bring your own key to Studio</h1>\n        <p className=\"text-muted-foreground max-w-3xl text-lg\">\n          Keep secrets under your control. Studio never touches plaintext\n          credentials; everything is encrypted with tenant-specific material.\n        </p>\n      </header>\n      <section className=\"grid gap-4 md:grid-cols-2\">\n        {steps.map((step) => (\n          <article key={step.title} className=\"card-subtle space-y-2 p-6\">\n            <h2 className=\"text-xl font-semibold\">{step.title}</h2>\n            <p className=\"text-muted-foreground text-sm\">{step.body}</p>\n          </article>\n        ))}\n      </section>\n      <section className=\"space-y-2\">\n        <h2 className=\"text-2xl font-semibold\">Audit trail</h2>\n        <p className=\"text-muted-foreground text-sm\">\n          Every decrypt operation logs who requested it, what integration was\n          involved, and the purpose (sync, deploy, manual action).\n        </p>\n        <p className=\"text-muted-foreground text-sm\">\n          You can stream audit logs to your SIEM via webhooks or export CSVs for\n          compliance reviews.\n        </p>\n      </section>\n    </main>\n  );\n}\n"],"mappings":";;;AAMA,MAAM,QAAQ;CACZ;EACE,OAAO;EACP,MAAM;EACP;CACD;EACE,OAAO;EACP,MAAM;EACP;CACD;EACE,OAAO;EACP,MAAM;EACP;CACD;EACE,OAAO;EACP,MAAM;EACP;CACF;AAED,SAAgB,iBAAiB;AAC/B,QACE,qBAAC;EAAK,WAAU;;GACd,qBAAC;IAAO,WAAU;;KAChB,oBAAC;MAAE,WAAU;gBAAmE;OAE5E;KACJ,oBAAC;MAAG,WAAU;gBAAqB;OAAiC;KACpE,oBAAC;MAAE,WAAU;gBAA0C;OAGnD;;KACG;GACT,oBAAC;IAAQ,WAAU;cAChB,MAAM,KAAK,SACV,qBAAC;KAAyB,WAAU;gBAClC,oBAAC;MAAG,WAAU;gBAAyB,KAAK;OAAW,EACvD,oBAAC;MAAE,WAAU;gBAAiC,KAAK;OAAS;OAFhD,KAAK,MAGT,CACV;KACM;GACV,qBAAC;IAAQ,WAAU;;KACjB,oBAAC;MAAG,WAAU;gBAAyB;OAAgB;KACvD,oBAAC;MAAE,WAAU;gBAAgC;OAGzC;KACJ,oBAAC;MAAE,WAAU;gBAAgC;OAGzC;;KACI;;GACL"}

package/dist/components/docs/studio/StudioDeploymentsPage.d.ts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/docs/studio/StudioDeploymentsPage.d.ts
+declare function StudioDeploymentsPage(): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { StudioDeploymentsPage };
+//# sourceMappingURL=StudioDeploymentsPage.d.ts.map

package/dist/components/docs/studio/StudioDeploymentsPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StudioDeploymentsPage.d.ts","names":[],"sources":["../../../../src/components/docs/studio/StudioDeploymentsPage.tsx"],"mappings":";;;iBAkCgB,qBAAA,CAAA,GAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/docs/studio/StudioDeploymentsPage.js

@@ -0,0 +1,84 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/docs/studio/StudioDeploymentsPage.tsx
+const comparisons = [{
+	label: "Shared",
+	points: [
+		"Ready in seconds",
+		"DEV + STAGE by default",
+		"Best for prototypes",
+		"Managed SSL"
+	]
+}, {
+	label: "Dedicated",
+	points: [
+		"Isolated clusters",
+		"Choose region + VPC",
+		"Rolling deploys",
+		"Custom observability sinks"
+	]
+}];
+const checklist = [
+	"Validate specs before deploying (Studio does this automatically).",
+	"Tag deployments with a description so rituals have context.",
+	"Monitor status cards—failed deploys trigger alerts and auto rollback.",
+	"Use the CLI to export deployment manifests if you want infra-as-code."
+];
+function StudioDeploymentsPage() {
+	return /* @__PURE__ */ jsxs("main", {
+		className: "space-y-12 py-12",
+		children: [
+			/* @__PURE__ */ jsxs("header", {
+				className: "space-y-3",
+				children: [
+					/* @__PURE__ */ jsx("p", {
+						className: "text-xs font-semibold tracking-[0.3em] text-violet-400 uppercase",
+						children: "Deployments"
+					}),
+					/* @__PURE__ */ jsx("h1", {
+						className: "text-4xl font-bold",
+						children: "Shared vs dedicated workflows"
+					}),
+					/* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground max-w-3xl text-lg",
+						children: "Studio abstracts infra, but you still stay in control. This guide explains how environments are provisioned, monitored, and rolled back."
+					})
+				]
+			}),
+			/* @__PURE__ */ jsx("section", {
+				className: "grid gap-4 md:grid-cols-2",
+				children: comparisons.map((option) => /* @__PURE__ */ jsxs("article", {
+					className: "card-subtle space-y-2 p-6",
+					children: [/* @__PURE__ */ jsxs("h2", {
+						className: "text-2xl font-semibold",
+						children: [option.label, " deployments"]
+					}), /* @__PURE__ */ jsx("ul", {
+						className: "space-y-1 text-sm",
+						children: option.points.map((point) => /* @__PURE__ */ jsxs("li", { children: ["• ", point] }, point))
+					})]
+				}, option.label))
+			}),
+			/* @__PURE__ */ jsxs("section", {
+				className: "space-y-3",
+				children: [
+					/* @__PURE__ */ jsx("h2", {
+						className: "text-2xl font-semibold",
+						children: "Health & rollback"
+					}),
+					/* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground text-sm",
+						children: "Every deployment emits health events. If a check fails, Studio pauses traffic and offers rollback controls with diff context."
+					}),
+					/* @__PURE__ */ jsx("ul", {
+						className: "space-y-2 text-sm",
+						children: checklist.map((item) => /* @__PURE__ */ jsxs("li", { children: ["• ", item] }, item))
+					})
+				]
+			})
+		]
+	});
+}
+
+//#endregion
+export { StudioDeploymentsPage };
+//# sourceMappingURL=StudioDeploymentsPage.js.map

package/dist/components/docs/studio/StudioDeploymentsPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StudioDeploymentsPage.js","names":[],"sources":["../../../../src/components/docs/studio/StudioDeploymentsPage.tsx"],"sourcesContent":["// export const metadata: Metadata = {\n//   title: 'Studio – Deployment Guide',\n//   description:\n//     'Learn how Studio provisions shared and dedicated environments, monitors health, and rolls back safely.',\n// };\n\nconst comparisons = [\n  {\n    label: 'Shared',\n    points: [\n      'Ready in seconds',\n      'DEV + STAGE by default',\n      'Best for prototypes',\n      'Managed SSL',\n    ],\n  },\n  {\n    label: 'Dedicated',\n    points: [\n      'Isolated clusters',\n      'Choose region + VPC',\n      'Rolling deploys',\n      'Custom observability sinks',\n    ],\n  },\n];\n\nconst checklist = [\n  'Validate specs before deploying (Studio does this automatically).',\n  'Tag deployments with a description so rituals have context.',\n  'Monitor status cards—failed deploys trigger alerts and auto rollback.',\n  'Use the CLI to export deployment manifests if you want infra-as-code.',\n];\n\nexport function StudioDeploymentsPage() {\n  return (\n    <main className=\"space-y-12 py-12\">\n      <header className=\"space-y-3\">\n        <p className=\"text-xs font-semibold tracking-[0.3em] text-violet-400 uppercase\">\n          Deployments\n        </p>\n        <h1 className=\"text-4xl font-bold\">Shared vs dedicated workflows</h1>\n        <p className=\"text-muted-foreground max-w-3xl text-lg\">\n          Studio abstracts infra, but you still stay in control. This guide\n          explains how environments are provisioned, monitored, and rolled back.\n        </p>\n      </header>\n      <section className=\"grid gap-4 md:grid-cols-2\">\n        {comparisons.map((option) => (\n          <article key={option.label} className=\"card-subtle space-y-2 p-6\">\n            <h2 className=\"text-2xl font-semibold\">\n              {option.label} deployments\n            </h2>\n            <ul className=\"space-y-1 text-sm\">\n              {option.points.map((point) => (\n                <li key={point}>• {point}</li>\n              ))}\n            </ul>\n          </article>\n        ))}\n      </section>\n      <section className=\"space-y-3\">\n        <h2 className=\"text-2xl font-semibold\">Health & rollback</h2>\n        <p className=\"text-muted-foreground text-sm\">\n          Every deployment emits health events. If a check fails, Studio pauses\n          traffic and offers rollback controls with diff context.\n        </p>\n        <ul className=\"space-y-2 text-sm\">\n          {checklist.map((item) => (\n            <li key={item}>• {item}</li>\n          ))}\n        </ul>\n      </section>\n    </main>\n  );\n}\n"],"mappings":";;;AAMA,MAAM,cAAc,CAClB;CACE,OAAO;CACP,QAAQ;EACN;EACA;EACA;EACA;EACD;CACF,EACD;CACE,OAAO;CACP,QAAQ;EACN;EACA;EACA;EACA;EACD;CACF,CACF;AAED,MAAM,YAAY;CAChB;CACA;CACA;CACA;CACD;AAED,SAAgB,wBAAwB;AACtC,QACE,qBAAC;EAAK,WAAU;;GACd,qBAAC;IAAO,WAAU;;KAChB,oBAAC;MAAE,WAAU;gBAAmE;OAE5E;KACJ,oBAAC;MAAG,WAAU;gBAAqB;OAAkC;KACrE,oBAAC;MAAE,WAAU;gBAA0C;OAGnD;;KACG;GACT,oBAAC;IAAQ,WAAU;cAChB,YAAY,KAAK,WAChB,qBAAC;KAA2B,WAAU;gBACpC,qBAAC;MAAG,WAAU;iBACX,OAAO,OAAM;OACX,EACL,oBAAC;MAAG,WAAU;gBACX,OAAO,OAAO,KAAK,UAClB,qBAAC,mBAAe,MAAG,UAAV,MAAqB,CAC9B;OACC;OARO,OAAO,MASX,CACV;KACM;GACV,qBAAC;IAAQ,WAAU;;KACjB,oBAAC;MAAG,WAAU;gBAAyB;OAAsB;KAC7D,oBAAC;MAAE,WAAU;gBAAgC;OAGzC;KACJ,oBAAC;MAAG,WAAU;gBACX,UAAU,KAAK,SACd,qBAAC,mBAAc,MAAG,SAAT,KAAmB,CAC5B;OACC;;KACG;;GACL"}

package/dist/components/docs/studio/StudioGettingStartedPage.d.ts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/docs/studio/StudioGettingStartedPage.d.ts
+declare function StudioGettingStartedPage(): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { StudioGettingStartedPage };
+//# sourceMappingURL=StudioGettingStartedPage.d.ts.map

package/dist/components/docs/studio/StudioGettingStartedPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StudioGettingStartedPage.d.ts","names":[],"sources":["../../../../src/components/docs/studio/StudioGettingStartedPage.tsx"],"mappings":";;;iBA6BgB,wBAAA,CAAA,GAAwB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/docs/studio/StudioGettingStartedPage.js

@@ -0,0 +1,93 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/docs/studio/StudioGettingStartedPage.tsx
+const steps = [
+	{
+		title: "1. Create a Studio workspace",
+		body: "Sign in, pick “Studio managed” as product, and invite teammates. We provision the workspace plus default shared environments."
+	},
+	{
+		title: "2. Add your first project",
+		body: "Click “New project”, choose Starter tier, and keep BYOK disabled for the trial. You can upgrade later."
+	},
+	{
+		title: "3. Author a spec",
+		body: "Use the Visual Builder or Spec Editor. Pick “Capability” as type and describe the operation (e.g., capture donation)."
+	},
+	{
+		title: "4. Deploy to shared infra",
+		body: "Open the deployment panel, select Development, and hit Deploy. Studio provisions the runtime slice automatically."
+	},
+	{
+		title: "5. Wire integrations",
+		body: "From Integration Hub, connect one provider (e.g., PostHog). Starter plan supports two providers."
+	}
+];
+function StudioGettingStartedPage() {
+	return /* @__PURE__ */ jsxs("main", {
+		className: "space-y-12 py-12",
+		children: [
+			/* @__PURE__ */ jsxs("header", {
+				className: "space-y-3",
+				children: [
+					/* @__PURE__ */ jsx("p", {
+						className: "text-xs font-semibold tracking-[0.3em] text-violet-400 uppercase",
+						children: "Getting started"
+					}),
+					/* @__PURE__ */ jsx("h1", {
+						className: "text-4xl font-bold",
+						children: "Launch your first Studio project"
+					}),
+					/* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground max-w-3xl text-lg",
+						children: "This short guide takes you from workspace creation to the first deployment. Every step is mobile-friendly and safe to undo."
+					})
+				]
+			}),
+			/* @__PURE__ */ jsx("section", {
+				className: "grid gap-4",
+				children: steps.map((step) => /* @__PURE__ */ jsxs("article", {
+					className: "card-subtle space-y-2 p-6",
+					children: [/* @__PURE__ */ jsx("h2", {
+						className: "text-xl font-semibold",
+						children: step.title
+					}), /* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground text-sm",
+						children: step.body
+					})]
+				}, step.title))
+			}),
+			/* @__PURE__ */ jsxs("section", {
+				className: "space-y-4",
+				children: [
+					/* @__PURE__ */ jsx("h2", {
+						className: "text-2xl font-semibold",
+						children: "CLI helper (optional)"
+					}),
+					/* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground text-sm",
+						children: "Prefer automation? Use the CLI to pull specs and push overlays."
+					}),
+					/* @__PURE__ */ jsx("pre", {
+						className: "bg-muted/40 border-border overflow-auto rounded-xl border p-4 text-left font-mono text-sm",
+						children: `# Authenticate
+cs login
+
+# List projects
+cs studio projects list
+
+# Pull specs locally
+cs studio specs pull <project-id>
+
+# Push after editing
+cs studio specs push <project-id>`
+					})
+				]
+			})
+		]
+	});
+}
+
+//#endregion
+export { StudioGettingStartedPage };
+//# sourceMappingURL=StudioGettingStartedPage.js.map

package/dist/components/docs/studio/StudioGettingStartedPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StudioGettingStartedPage.js","names":[],"sources":["../../../../src/components/docs/studio/StudioGettingStartedPage.tsx"],"sourcesContent":["// export const metadata: Metadata = {\n//   title: 'Studio – Getting Started',\n//   description:\n//     'Create your first ContractSpec Studio project, add specs, and deploy to shared infrastructure.',\n// };\n\nconst steps = [\n  {\n    title: '1. Create a Studio workspace',\n    body: 'Sign in, pick “Studio managed” as product, and invite teammates. We provision the workspace plus default shared environments.',\n  },\n  {\n    title: '2. Add your first project',\n    body: 'Click “New project”, choose Starter tier, and keep BYOK disabled for the trial. You can upgrade later.',\n  },\n  {\n    title: '3. Author a spec',\n    body: 'Use the Visual Builder or Spec Editor. Pick “Capability” as type and describe the operation (e.g., capture donation).',\n  },\n  {\n    title: '4. Deploy to shared infra',\n    body: 'Open the deployment panel, select Development, and hit Deploy. Studio provisions the runtime slice automatically.',\n  },\n  {\n    title: '5. Wire integrations',\n    body: 'From Integration Hub, connect one provider (e.g., PostHog). Starter plan supports two providers.',\n  },\n];\n\nexport function StudioGettingStartedPage() {\n  return (\n    <main className=\"space-y-12 py-12\">\n      <header className=\"space-y-3\">\n        <p className=\"text-xs font-semibold tracking-[0.3em] text-violet-400 uppercase\">\n          Getting started\n        </p>\n        <h1 className=\"text-4xl font-bold\">Launch your first Studio project</h1>\n        <p className=\"text-muted-foreground max-w-3xl text-lg\">\n          This short guide takes you from workspace creation to the first\n          deployment. Every step is mobile-friendly and safe to undo.\n        </p>\n      </header>\n      <section className=\"grid gap-4\">\n        {steps.map((step) => (\n          <article key={step.title} className=\"card-subtle space-y-2 p-6\">\n            <h2 className=\"text-xl font-semibold\">{step.title}</h2>\n            <p className=\"text-muted-foreground text-sm\">{step.body}</p>\n          </article>\n        ))}\n      </section>\n      <section className=\"space-y-4\">\n        <h2 className=\"text-2xl font-semibold\">CLI helper (optional)</h2>\n        <p className=\"text-muted-foreground text-sm\">\n          Prefer automation? Use the CLI to pull specs and push overlays.\n        </p>\n        <pre className=\"bg-muted/40 border-border overflow-auto rounded-xl border p-4 text-left font-mono text-sm\">\n          {`# Authenticate\ncs login\n\n# List projects\ncs studio projects list\n\n# Pull specs locally\ncs studio specs pull <project-id>\n\n# Push after editing\ncs studio specs push <project-id>`}\n        </pre>\n      </section>\n    </main>\n  );\n}\n"],"mappings":";;;AAMA,MAAM,QAAQ;CACZ;EACE,OAAO;EACP,MAAM;EACP;CACD;EACE,OAAO;EACP,MAAM;EACP;CACD;EACE,OAAO;EACP,MAAM;EACP;CACD;EACE,OAAO;EACP,MAAM;EACP;CACD;EACE,OAAO;EACP,MAAM;EACP;CACF;AAED,SAAgB,2BAA2B;AACzC,QACE,qBAAC;EAAK,WAAU;;GACd,qBAAC;IAAO,WAAU;;KAChB,oBAAC;MAAE,WAAU;gBAAmE;OAE5E;KACJ,oBAAC;MAAG,WAAU;gBAAqB;OAAqC;KACxE,oBAAC;MAAE,WAAU;gBAA0C;OAGnD;;KACG;GACT,oBAAC;IAAQ,WAAU;cAChB,MAAM,KAAK,SACV,qBAAC;KAAyB,WAAU;gBAClC,oBAAC;MAAG,WAAU;gBAAyB,KAAK;OAAW,EACvD,oBAAC;MAAE,WAAU;gBAAiC,KAAK;OAAS;OAFhD,KAAK,MAGT,CACV;KACM;GACV,qBAAC;IAAQ,WAAU;;KACjB,oBAAC;MAAG,WAAU;gBAAyB;OAA0B;KACjE,oBAAC;MAAE,WAAU;gBAAgC;OAEzC;KACJ,oBAAC;MAAI,WAAU;gBACZ;;;;;;;;;;;OAWG;;KACE;;GACL"}

package/dist/components/docs/studio/StudioIntegrationsPage.d.ts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/docs/studio/StudioIntegrationsPage.d.ts
+declare function StudioIntegrationsPage(): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { StudioIntegrationsPage };
+//# sourceMappingURL=StudioIntegrationsPage.d.ts.map

package/dist/components/docs/studio/StudioIntegrationsPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StudioIntegrationsPage.d.ts","names":[],"sources":["../../../../src/components/docs/studio/StudioIntegrationsPage.tsx"],"mappings":";;;iBAqBgB,sBAAA,CAAA,GAAsB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/docs/studio/StudioIntegrationsPage.js

@@ -0,0 +1,68 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/docs/studio/StudioIntegrationsPage.tsx
+const flow = [
+	{
+		title: "Connect a provider",
+		body: "Choose a provider from the marketplace, enter credentials, and run the test connection. Studio encrypts secrets immediately."
+	},
+	{
+		title: "Schedule syncs",
+		body: "Define sync cadence (manual, hourly, daily). Studio tracks usage count and last sync timestamp."
+	},
+	{
+		title: "Index knowledge",
+		body: "Add documentation or API specs as knowledge sources. Reindex whenever files change."
+	}
+];
+function StudioIntegrationsPage() {
+	return /* @__PURE__ */ jsxs("main", {
+		className: "space-y-12 py-12",
+		children: [
+			/* @__PURE__ */ jsxs("header", {
+				className: "space-y-3",
+				children: [
+					/* @__PURE__ */ jsx("p", {
+						className: "text-xs font-semibold tracking-[0.3em] text-violet-400 uppercase",
+						children: "Integration hub"
+					}),
+					/* @__PURE__ */ jsx("h1", {
+						className: "text-4xl font-bold",
+						children: "Unified connections with BYOK"
+					}),
+					/* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground max-w-3xl text-lg",
+						children: "Manage SaaS providers and knowledge sources without scattering secrets across tools. Studio gives you a simple card layout plus CLI automation."
+					})
+				]
+			}),
+			/* @__PURE__ */ jsx("section", {
+				className: "grid gap-4 md:grid-cols-3",
+				children: flow.map((step) => /* @__PURE__ */ jsxs("article", {
+					className: "card-subtle space-y-2 p-6",
+					children: [/* @__PURE__ */ jsx("h2", {
+						className: "text-xl font-semibold",
+						children: step.title
+					}), /* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground text-sm",
+						children: step.body
+					})]
+				}, step.title))
+			}),
+			/* @__PURE__ */ jsxs("section", {
+				className: "space-y-2",
+				children: [/* @__PURE__ */ jsx("h2", {
+					className: "text-2xl font-semibold",
+					children: "Monitoring"
+				}), /* @__PURE__ */ jsx("p", {
+					className: "text-muted-foreground text-sm",
+					children: "Every integration exposes sync logs and failure alerts. Use the webhook to forward sync events to Slack or PagerDuty."
+				})]
+			})
+		]
+	});
+}
+
+//#endregion
+export { StudioIntegrationsPage };
+//# sourceMappingURL=StudioIntegrationsPage.js.map

package/dist/components/docs/studio/StudioIntegrationsPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StudioIntegrationsPage.js","names":[],"sources":["../../../../src/components/docs/studio/StudioIntegrationsPage.tsx"],"sourcesContent":["// export const metadata: Metadata = {\n//   title: 'Studio – Integration Hub Guide',\n//   description:\n//     'Connect providers, manage BYOK credentials, and sync data in the Studio Integration Hub.',\n// };\n\nconst flow = [\n  {\n    title: 'Connect a provider',\n    body: 'Choose a provider from the marketplace, enter credentials, and run the test connection. Studio encrypts secrets immediately.',\n  },\n  {\n    title: 'Schedule syncs',\n    body: 'Define sync cadence (manual, hourly, daily). Studio tracks usage count and last sync timestamp.',\n  },\n  {\n    title: 'Index knowledge',\n    body: 'Add documentation or API specs as knowledge sources. Reindex whenever files change.',\n  },\n];\n\nexport function StudioIntegrationsPage() {\n  return (\n    <main className=\"space-y-12 py-12\">\n      <header className=\"space-y-3\">\n        <p className=\"text-xs font-semibold tracking-[0.3em] text-violet-400 uppercase\">\n          Integration hub\n        </p>\n        <h1 className=\"text-4xl font-bold\">Unified connections with BYOK</h1>\n        <p className=\"text-muted-foreground max-w-3xl text-lg\">\n          Manage SaaS providers and knowledge sources without scattering secrets\n          across tools. Studio gives you a simple card layout plus CLI\n          automation.\n        </p>\n      </header>\n      <section className=\"grid gap-4 md:grid-cols-3\">\n        {flow.map((step) => (\n          <article key={step.title} className=\"card-subtle space-y-2 p-6\">\n            <h2 className=\"text-xl font-semibold\">{step.title}</h2>\n            <p className=\"text-muted-foreground text-sm\">{step.body}</p>\n          </article>\n        ))}\n      </section>\n      <section className=\"space-y-2\">\n        <h2 className=\"text-2xl font-semibold\">Monitoring</h2>\n        <p className=\"text-muted-foreground text-sm\">\n          Every integration exposes sync logs and failure alerts. Use the\n          webhook to forward sync events to Slack or PagerDuty.\n        </p>\n      </section>\n    </main>\n  );\n}\n"],"mappings":";;;AAMA,MAAM,OAAO;CACX;EACE,OAAO;EACP,MAAM;EACP;CACD;EACE,OAAO;EACP,MAAM;EACP;CACD;EACE,OAAO;EACP,MAAM;EACP;CACF;AAED,SAAgB,yBAAyB;AACvC,QACE,qBAAC;EAAK,WAAU;;GACd,qBAAC;IAAO,WAAU;;KAChB,oBAAC;MAAE,WAAU;gBAAmE;OAE5E;KACJ,oBAAC;MAAG,WAAU;gBAAqB;OAAkC;KACrE,oBAAC;MAAE,WAAU;gBAA0C;OAInD;;KACG;GACT,oBAAC;IAAQ,WAAU;cAChB,KAAK,KAAK,SACT,qBAAC;KAAyB,WAAU;gBAClC,oBAAC;MAAG,WAAU;gBAAyB,KAAK;OAAW,EACvD,oBAAC;MAAE,WAAU;gBAAiC,KAAK;OAAS;OAFhD,KAAK,MAGT,CACV;KACM;GACV,qBAAC;IAAQ,WAAU;eACjB,oBAAC;KAAG,WAAU;eAAyB;MAAe,EACtD,oBAAC;KAAE,WAAU;eAAgC;MAGzC;KACI;;GACL"}

package/dist/components/docs/studio/StudioOverviewPage.d.ts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/docs/studio/StudioOverviewPage.d.ts
+declare function StudioOverviewPage(): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { StudioOverviewPage };
+//# sourceMappingURL=StudioOverviewPage.d.ts.map

package/dist/components/docs/studio/StudioOverviewPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StudioOverviewPage.d.ts","names":[],"sources":["../../../../src/components/docs/studio/StudioOverviewPage.tsx"],"mappings":";;;iBAoCgB,kBAAA,CAAA,GAAkB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/docs/studio/StudioOverviewPage.js

@@ -0,0 +1,70 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import Link from "@contractspec/lib.ui-link";
+
+//#region src/components/docs/studio/StudioOverviewPage.tsx
+const sections = [
+	{
+		title: "1. Getting started",
+		body: "Provision your Studio workspace, create a project, and run the first deployment.",
+		href: "/docs/studio/getting-started"
+	},
+	{
+		title: "2. Visual builder",
+		body: "Learn the canvas controls, component palette, and spec validation workflow.",
+		href: "/docs/studio/visual-builder"
+	},
+	{
+		title: "3. Deployments",
+		body: "Switch between shared and dedicated environments, monitor health, and roll back safely.",
+		href: "/docs/studio/deployments"
+	},
+	{
+		title: "4. BYOK security",
+		body: "Configure your vault, rotate keys, and audit credential access.",
+		href: "/docs/studio/byok"
+	},
+	{
+		title: "5. Integration hub",
+		body: "Connect third-party providers, sync data, and index knowledge sources.",
+		href: "/docs/studio/integrations"
+	}
+];
+function StudioOverviewPage() {
+	return /* @__PURE__ */ jsxs("main", {
+		className: "space-y-16 py-16",
+		children: [/* @__PURE__ */ jsxs("section", {
+			className: "section-padding",
+			children: [
+				/* @__PURE__ */ jsx("p", {
+					className: "text-xs font-semibold tracking-[0.3em] text-violet-400 uppercase",
+					children: "Studio docs"
+				}),
+				/* @__PURE__ */ jsx("h1", {
+					className: "mt-4 text-4xl font-bold",
+					children: "Everything you need to run Studio."
+				}),
+				/* @__PURE__ */ jsx("p", {
+					className: "text-muted-foreground mt-4 max-w-3xl text-lg",
+					children: "ContractSpec Studio pairs a visual builder with managed infrastructure. These guides keep teams aligned—especially when engineers and operators share the same console."
+				})
+			]
+		}), /* @__PURE__ */ jsx("section", {
+			className: "section-padding grid gap-4",
+			children: sections.map((section) => /* @__PURE__ */ jsxs(Link, {
+				href: section.href,
+				className: "card-subtle group space-y-2 p-6 transition hover:border-violet-500/40",
+				children: [/* @__PURE__ */ jsx("h2", {
+					className: "text-xl font-semibold group-hover:text-violet-400",
+					children: section.title
+				}), /* @__PURE__ */ jsx("p", {
+					className: "text-muted-foreground text-sm",
+					children: section.body
+				})]
+			}, section.href))
+		})]
+	});
+}
+
+//#endregion
+export { StudioOverviewPage };
+//# sourceMappingURL=StudioOverviewPage.js.map

package/dist/components/docs/studio/StudioOverviewPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StudioOverviewPage.js","names":[],"sources":["../../../../src/components/docs/studio/StudioOverviewPage.tsx"],"sourcesContent":["import Link from '@contractspec/lib.ui-link';\n\n// export const metadata: Metadata = {\n//   title: 'Studio Documentation – ContractSpec',\n//   description:\n//     'Official ContractSpec Studio documentation. Jump into getting started, visual builder, deployments, BYOK, and integration guides.',\n// };\n\nconst sections = [\n  {\n    title: '1. Getting started',\n    body: 'Provision your Studio workspace, create a project, and run the first deployment.',\n    href: '/docs/studio/getting-started',\n  },\n  {\n    title: '2. Visual builder',\n    body: 'Learn the canvas controls, component palette, and spec validation workflow.',\n    href: '/docs/studio/visual-builder',\n  },\n  {\n    title: '3. Deployments',\n    body: 'Switch between shared and dedicated environments, monitor health, and roll back safely.',\n    href: '/docs/studio/deployments',\n  },\n  {\n    title: '4. BYOK security',\n    body: 'Configure your vault, rotate keys, and audit credential access.',\n    href: '/docs/studio/byok',\n  },\n  {\n    title: '5. Integration hub',\n    body: 'Connect third-party providers, sync data, and index knowledge sources.',\n    href: '/docs/studio/integrations',\n  },\n];\n\nexport function StudioOverviewPage() {\n  return (\n    <main className=\"space-y-16 py-16\">\n      <section className=\"section-padding\">\n        <p className=\"text-xs font-semibold tracking-[0.3em] text-violet-400 uppercase\">\n          Studio docs\n        </p>\n        <h1 className=\"mt-4 text-4xl font-bold\">\n          Everything you need to run Studio.\n        </h1>\n        <p className=\"text-muted-foreground mt-4 max-w-3xl text-lg\">\n          ContractSpec Studio pairs a visual builder with managed\n          infrastructure. These guides keep teams aligned—especially when\n          engineers and operators share the same console.\n        </p>\n      </section>\n      <section className=\"section-padding grid gap-4\">\n        {sections.map((section) => (\n          <Link\n            key={section.href}\n            href={section.href}\n            className=\"card-subtle group space-y-2 p-6 transition hover:border-violet-500/40\"\n          >\n            <h2 className=\"text-xl font-semibold group-hover:text-violet-400\">\n              {section.title}\n            </h2>\n            <p className=\"text-muted-foreground text-sm\">{section.body}</p>\n          </Link>\n        ))}\n      </section>\n    </main>\n  );\n}\n"],"mappings":";;;;AAQA,MAAM,WAAW;CACf;EACE,OAAO;EACP,MAAM;EACN,MAAM;EACP;CACD;EACE,OAAO;EACP,MAAM;EACN,MAAM;EACP;CACD;EACE,OAAO;EACP,MAAM;EACN,MAAM;EACP;CACD;EACE,OAAO;EACP,MAAM;EACN,MAAM;EACP;CACD;EACE,OAAO;EACP,MAAM;EACN,MAAM;EACP;CACF;AAED,SAAgB,qBAAqB;AACnC,QACE,qBAAC;EAAK,WAAU;aACd,qBAAC;GAAQ,WAAU;;IACjB,oBAAC;KAAE,WAAU;eAAmE;MAE5E;IACJ,oBAAC;KAAG,WAAU;eAA0B;MAEnC;IACL,oBAAC;KAAE,WAAU;eAA+C;MAIxD;;IACI,EACV,oBAAC;GAAQ,WAAU;aAChB,SAAS,KAAK,YACb,qBAAC;IAEC,MAAM,QAAQ;IACd,WAAU;eAEV,oBAAC;KAAG,WAAU;eACX,QAAQ;MACN,EACL,oBAAC;KAAE,WAAU;eAAiC,QAAQ;MAAS;MAP1D,QAAQ,KAQR,CACP;IACM;GACL"}

package/dist/components/docs/studio/StudioVisualBuilderPage.d.ts

@@ -0,0 +1,7 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/docs/studio/StudioVisualBuilderPage.d.ts
+declare function StudioVisualBuilderPage(): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { StudioVisualBuilderPage };
+//# sourceMappingURL=StudioVisualBuilderPage.d.ts.map

package/dist/components/docs/studio/StudioVisualBuilderPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StudioVisualBuilderPage.d.ts","names":[],"sources":["../../../../src/components/docs/studio/StudioVisualBuilderPage.tsx"],"mappings":";;;iBAegB,uBAAA,CAAA,GAAuB,kBAAA,CAAA,GAAA,CAAA,OAAA"}