@opengeni/react 7.4.0 → 7.5.0-canary.36919050519001

package/dist/artifacts.js

@@ -1,1431 +1,163 @@
+import {
+  ArtifactSandbox,
+  ChatInteractiveBlock,
+  DeferredChatMedia,
+  inlineHtmlDocument
+} from "./chunk-YBXQDQFX.js";
 import {
   EditableSpreadsheetArtifactSurface,
   EditableSpreadsheetGrid,
   SpreadsheetArtifactSurface,
   SpreadsheetGrid,
   SpreadsheetProjectionGrid
-} from "./chunk-SEEVCT36.js";
+} from "./chunk-A4UJB2MM.js";
+import {
+  DocumentArtifactSurface,
+  DocumentEditor,
+  DocumentProjectionArtifactSurface,
+  DocumentProjectionEditor,
+  EditableDocumentArtifactSurface
+} from "./chunk-WUISZ3WU.js";
+import {
+  isRetainedImageContentType,
+  useRetainedImageObjectUrl
+} from "./chunk-FZCP527Y.js";
+import {
+  ArtifactBadge,
+  ArtifactButton,
+  ArtifactLabelsProvider,
+  ArtifactLoading,
+  ArtifactProblem,
+  ArtifactSelect,
+  ArtifactViewerHeader,
+  DEFAULT_ARTIFACT_LABELS,
+  artifactKindIcon,
+  artifactKindSubtitle,
+  artifactLoadErrorMessage,
+  artifactLoadErrorView,
+  useArtifactLabels
+} from "./chunk-5CVXZA3Y.js";
+import "./chunk-ERGYJIBB.js";
+import "./chunk-XCHWDJ22.js";
 import {
   PUBLISHED_HTML_ARTIFACT_IFRAME_SANDBOX,
   PublishedHtmlArtifactFrame,
+  loadSiteSnapshot,
   openGeniSiteBridgePortFromBootstrap,
   publishedHtmlArtifactDocument
-} from "./chunk-UGMKPUEM.js";
+} from "./chunk-SCOTPE2I.js";
+import {
+  useOpenGeni
+} from "./chunk-NEXLLTP4.js";
 import {
   EditablePresentationArtifactSurface,
   PresentationArtifactSurface,
   PresentationEditor,
   PresentationProjectionArtifactSurface,
   PresentationProjectionEditor
-} from "./chunk-KNDIXZN6.js";
-import {
-  isRetainedImageContentType,
-  useRetainedImageObjectUrl
-} from "./chunk-FZCP527Y.js";
-import "./chunk-ERGYJIBB.js";
-import {
-  DocumentArtifactSurface,
-  DocumentEditor,
-  DocumentProjectionArtifactSurface,
-  DocumentProjectionEditor,
-  EditableDocumentArtifactSurface
-} from "./chunk-3E2AITTZ.js";
+} from "./chunk-7UAMYXJY.js";
+import "./chunk-WEHMPOXK.js";
 import {
   ArtifactSurface,
   EditableArtifactMessage
-} from "./chunk-DUEBTL3N.js";
-import "./chunk-22KP6LR5.js";
-
-// src/components/artifacts/visualization-assets.gen.ts
-var VISUALIZATION_CSS = `/* Adapted from Codex visualize 1.0.32; shared with the OpenGeni visualization skill. */
-:root {
-  color-scheme: light dark;
-  background-color: var(
-    --background,
-    var(--color-background-primary, light-dark(rgb(255 255 255), rgb(24 24 24)))
-  ) !important;
-
-  /* Agent-facing contract; keep in sync with SKILL.md. */
-  --background: var(
-    --color-background-primary,
-    light-dark(rgb(255 255 255), rgb(24 24 24))
-  );
-  --foreground: var(
-    --color-text-primary,
-    light-dark(rgb(26 28 31), rgb(255 255 255))
-  );
-  --card: color-mix(in oklab, var(--foreground) 5%, var(--background));
-  --card-foreground: var(
-    --color-text-primary,
-    light-dark(rgb(26 28 31), rgb(255 255 255))
-  );
-  --popover: var(
-    --color-background-secondary,
-    light-dark(rgb(255 255 255), rgb(45 45 45))
-  );
-  --popover-foreground: var(
-    --color-text-primary,
-    light-dark(rgb(26 28 31), rgb(255 255 255))
-  );
-  --primary: var(
-    --color-text-info,
-    light-dark(rgb(51 156 255), rgb(131 195 255))
-  );
-  --primary-foreground: var(
-    --color-text-inverse,
-    light-dark(rgb(255 255 255), rgb(13 13 13))
-  );
-  --secondary: var(
-    --color-background-secondary,
-    light-dark(rgb(255 255 255 / 96%), rgb(54 54 54 / 96%))
-  );
-  --secondary-foreground: var(
-    --color-text-primary,
-    light-dark(rgb(26 28 31), rgb(255 255 255))
-  );
-  --muted: color-mix(in srgb, var(--foreground) 10%, transparent);
-  --muted-foreground: var(
-    --color-text-secondary,
-    light-dark(rgb(26 28 31 / 49.4%), rgb(255 255 255 / 49.8%))
-  );
-  --accent: var(
-    --color-background-info,
-    light-dark(rgb(229 242 255), rgb(13 39 63))
-  );
-  --accent-foreground: var(
-    --color-text-info,
-    light-dark(rgb(51 156 255), rgb(131 195 255))
-  );
-  --destructive: var(
-    --color-text-warning,
-    light-dark(rgb(226 85 7), rgb(255 133 73))
-  );
-  --border: var(
-    --color-border-secondary,
-    light-dark(rgb(26 28 31 / 8%), rgb(255 255 255 / 8.2%))
-  );
-  --input: var(
-    --color-border-primary,
-    light-dark(
-      rgb(26 28 31 / 11.8%),
-      color-mix(in oklab, rgb(0 0 0) 10%, transparent)
-    )
-  );
-  --ring: var(
-    --color-ring-primary,
-    light-dark(rgb(51 156 255), rgb(131 195 255 / 76%))
-  );
-  --font-size-base: var(--font-text-md-size, 14px);
-  --blue: light-dark(rgb(51 156 255), rgb(51 156 255));
-  --orange: light-dark(rgb(226 85 7), rgb(251 106 34));
-  --green: light-dark(rgb(0 162 64), rgb(64 201 119));
-  --red: light-dark(rgb(224 46 42), rgb(255 103 100));
-  --purple: light-dark(rgb(146 79 247), rgb(173 123 249));
-  --yellow: light-dark(rgb(255 195 0), rgb(255 210 64));
-  --viz-series-1: var(--primary);
-  --viz-series-2: light-dark(rgb(243 136 59), rgb(245 154 86));
-  --viz-series-3: light-dark(rgb(93 201 119), rgb(116 213 139));
-  --viz-series-4: light-dark(rgb(235 119 177), rgb(240 143 192));
-  --viz-series-5: light-dark(rgb(155 121 236), rgb(170 145 239));
-  --viz-series-6: light-dark(rgb(58 185 177), rgb(90 203 194));
-
-  /* Internal implementation variables; not part of the agent contract. */
-  --font-sans: -apple-system, system-ui, "Segoe UI", sans-serif;
-  --font-mono:
-    ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono",
-    monospace;
-  --font-size-normal: max(11px, var(--font-size-base));
-  --font-size-tooltip: calc(var(--font-size-base) - 1px);
-  --font-size-small: max(11px, calc(var(--font-size-base) - 2px));
-  --font-size-h1: calc(var(--font-size-normal) * 1.7142857143);
-  --font-size-h2: calc(var(--font-size-normal) * 1.4285714286);
-  --font-size-h3: calc(var(--font-size-normal) * 1.2857142857);
-  --font-weight-normal: 430;
-  --font-weight-medium: 500;
-  --icon-size: 16px;
-  --line-height-normal: calc(var(--font-size-normal) * 1.5);
-  --line-height-tooltip: calc(var(--font-size-tooltip) * 1.4285714286);
-  --line-height-small: calc(var(--font-size-small) + 4px);
-  --corner-shape: round;
-  --radius: var(--border-radius-lg, 10px);
-  --radius-sm: calc(var(--radius) * 0.6);
-  --radius-md: calc(var(--radius) * 0.8);
-  --radius-lg: var(--radius);
-  --radius-2xl: calc(var(--radius) * 1.6);
-  --radius-full: 9999px;
-  --shadow-sm: 0 1px 2px -1px rgb(0 0 0 / 8%);
-  --checkmark-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 17'%3E%3Cpath d='M 12.8961 3.64101C13.1297 3.41418 13.4984 3.37523 13.7779 3.56581C14.0571 3.75635 14.1554 4.11331 14.0299 4.41347L13.9615 4.53847L7.71151 13.7045C7.59411 13.8767 7.4063 13.9877 7.19881 14.0072C6.99136 14.0267 6.78564 13.9533 6.63826 13.806L2.88826 10.056L2.79842 9.9457C2.6192 9.67407 2.64927 9.30496 2.88826 9.06581C3.12738 8.82669 3.49647 8.79676 3.76815 8.97597L3.8785 9.06581L7.03084 12.2182L12.8053 3.74941L12.8961 3.64101Z'/%3E%3C/svg%3E");
-
-  /* Legacy aliases; not part of the current agent contract. */
-  --viz-bg: transparent;
-  --viz-panel: var(--card);
-  --viz-border: var(--border);
-  --viz-text: var(--foreground);
-  --viz-muted: var(--muted-foreground);
-  --viz-accent: var(--primary);
-  --viz-accent-text: var(--primary-foreground);
-  --viz-accent-bg: var(--accent);
-  --viz-font-size: var(--font-size-base);
-  --viz-warning: var(--destructive);
-}
-
-:root[data-theme="light"] {
-  color-scheme: light;
-}
-
-:root[data-theme="dark"] {
-  color-scheme: dark;
-}
-
-* {
-  box-sizing: border-box;
-}
-
-html > body {
-  /* Preserve MCP aliases for older inline renderers without creating :root cycles. */
-  --color-background-primary: var(
-    --background,
-    light-dark(rgb(255 255 255), rgb(24 24 24))
-  );
-  --color-text-primary: var(
-    --foreground,
-    light-dark(rgb(26 28 31), rgb(255 255 255))
-  );
-  --color-border-secondary: var(
-    --border,
-    light-dark(rgb(26 28 31 / 8%), rgb(255 255 255 / 8.2%))
-  );
-
-  margin: 0;
-  padding: var(--visualize-paint-gutter, 16px);
-  color: var(--foreground);
-  background: transparent !important;
-  font-family: var(--font-sans) !important;
-  font-size: var(--font-size-normal);
-  font-weight: var(--font-weight-normal);
-  line-height: var(--line-height-normal);
-}
-
-a {
-  color: color-mix(in srgb, var(--viz-accent) 80%, var(--viz-text) 20%);
-  cursor: pointer;
-  font-weight: var(--font-weight-medium, 500);
-  text-decoration: none;
-  text-underline-offset: 2px;
-}
-
-a:is(:hover, :focus-visible) {
-  text-decoration-line: underline;
-  text-decoration-style: dashed;
-  text-decoration-thickness: 0.5px;
-}
-
-h1,
-h2,
-h3,
-h4,
-h5,
-h6,
-p {
-  margin-block: 0;
-}
-
-h1 {
-  font-size: var(--font-size-h1);
-  font-weight: var(--font-weight-medium);
-  line-height: 1.25;
-}
-
-h2 {
-  font-size: var(--font-size-h2);
-  font-weight: var(--font-weight-medium);
-  line-height: 1.25;
-}
-
-h3,
-h4,
-h5,
-h6 {
-  font-size: var(--font-size-h3);
-  font-weight: var(--font-weight-medium);
-  line-height: 1.3;
-}
-
-b,
-strong,
-th {
-  font-weight: var(--font-weight-medium);
-}
-
-code:not(pre code) {
-  display: inline;
-  padding: 1px 6px;
-  border-radius: var(--radius-sm);
-  corner-shape: var(--corner-shape);
-  background: var(--muted);
-  font-family: var(--font-mono);
-  font-size: 0.92em;
-  overflow-wrap: anywhere;
-  -webkit-box-decoration-break: clone;
-  box-decoration-break: clone;
-  word-break: break-word;
-}
-
-.table-responsive {
-  width: 100%;
-  overflow-x: auto;
-  scrollbar-width: thin;
-}
-
-.table {
-  width: 100%;
-  border-collapse: collapse;
-  color: var(--foreground);
-  font: inherit;
-  text-align: start;
-}
-
-.table :is(th, td) {
-  padding-block: 10px;
-  padding-inline: 0 24px;
-  overflow-wrap: anywhere;
-  border-bottom: 1px solid var(--border);
-  text-align: start;
-  vertical-align: top;
-}
-
-.table-responsive > .table :is(th, td) {
-  overflow-wrap: break-word;
-}
-
-.table :is(th, td):last-child {
-  padding-inline-end: 0;
-}
-
-.table :is(caption, thead th) {
-  font-weight: 600;
-}
-
-.table thead th {
-  padding-block: 8px;
-  border-bottom-color: color-mix(in srgb, var(--foreground) 16%, transparent);
-}
-
-.table tbody tr:last-child :is(th, td) {
-  border-bottom: 0;
-}
-
-.table.table-sm :is(th, td) {
-  padding-block: 6px;
-}
-
-.table.table-sm :is(th, td):not(:last-child) {
-  padding-inline-end: 16px;
-}
-
-.table :is(.text-end, [align="right"]) {
-  text-align: end;
-  font-variant-numeric: tabular-nums;
-}
-
-.table :is(.text-center, [align="center"]) {
-  text-align: center;
-}
-
-.table .text-nowrap {
-  white-space: nowrap;
-}
-
-#widget {
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-  width: 100%;
-  padding: 0;
-  background: transparent !important;
-}
-
-.card {
-  min-width: 0;
-  padding: 12px;
-  overflow: hidden;
-  overflow-wrap: break-word;
-  border-radius: var(--radius-2xl);
-  corner-shape: var(--corner-shape);
-  color: var(--card-foreground);
-  background: var(--card);
-}
-
-#widget > :not(.card, .progress) {
-  width: 100% !important;
-  max-width: none !important;
-  margin: 0 !important;
-  padding: 0 !important;
-  border: 0 !important;
-  border-radius: 0 !important;
-  background: transparent !important;
-  box-shadow: none !important;
-}
-
-.tooltip {
-  position: fixed;
-  z-index: 50;
-  top: 0;
-  left: 0;
-  width: max-content;
-  max-width: min(
-    20rem,
-    var(--tooltip-available-width, calc(100vw - 10px)),
-    calc(100vw - 10px)
-  );
-  max-height: min(
-    var(--tooltip-available-height, calc(100vh - 10px)),
-    calc(100vh - 10px)
-  );
-  padding: 4px 8px;
-  border: 1px solid var(--border);
-  border-radius: var(--radius-lg);
-  corner-shape: var(--corner-shape);
-  color: var(--popover-foreground);
-  background: var(--popover);
-  box-shadow: none;
-  font-size: var(--font-size-tooltip);
-  line-height: var(--line-height-tooltip);
-  overflow-wrap: break-word;
-  white-space: normal;
-  pointer-events: none;
-  user-select: none;
-}
-
-.viz-grid {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(max(180px, 24%), 1fr));
-  gap: 10px;
-}
-
-.viz-stat {
-  display: flex;
-  flex-direction: column;
-  gap: 2px;
-}
-
-.viz-stat-value {
-  font-size: var(--font-size-h2);
-  font-weight: var(--font-weight-medium);
-  line-height: 1.25;
-}
-
-.viz-row {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 10px;
-}
-
-hr {
-  width: 100%;
-  height: 1px;
-  margin-block: 6px;
-  border: 0;
-  background: var(--border);
-}
-
-.nav {
-  display: flex;
-  min-width: 0;
-  align-items: center;
-  gap: 4px;
-}
-
-.progress {
-  display: flex;
-  height: 8px;
-  margin-block: calc((var(--line-height-normal, 1.5em) - 8px) / 2);
-  overflow: hidden;
-  border: 0;
-  border-radius: var(--radius-full);
-  background: var(--muted);
-}
-
-.progress-bar:only-child {
-  border-radius: var(--radius-full);
-}
-
-.progress-bar {
-  height: 100%;
-  flex-shrink: 0;
-  border: 0;
-  background: var(--viz-series-1);
-}
-
-.viz-badge {
-  padding: 3px 8px;
-  border-radius: var(--radius-full);
-  color: var(--accent-foreground);
-  background: var(--accent);
-  font-weight: var(--font-weight-medium);
-}
-
-small,
-.text-small,
-.viz-badge {
-  font-size: var(--font-size-small);
-  line-height: var(--line-height-small);
-}
-
-.text-muted {
-  color: var(--muted-foreground);
-}
-
-.tabular-nums {
-  font-variant-numeric: tabular-nums;
-}
-
-.sr-only {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  padding: 0;
-  overflow: hidden;
-  clip: rect(0, 0, 0, 0);
-  white-space: nowrap;
-  border: 0;
-}
-
-.viz-controls {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 8px;
-}
-
-.viz-controls > .form-label {
-  display: grid;
-  min-width: min(100%, 260px);
-  flex: 1 1 280px;
-  grid-template-columns: minmax(0, 1fr) auto;
-  align-items: baseline;
-  gap: 2px 12px;
-  margin-bottom: 0;
-}
-
-.viz-controls > .form-label > :is(.form-control, .form-range, .form-select) {
-  grid-column: 1 / -1;
-}
-
-.btn,
-.nav-link,
-.form-check-input,
-.form-control,
-.form-range,
-.form-select {
-  font: inherit;
-}
-
-.btn,
-.nav-link {
-  appearance: button;
-  display: inline-flex;
-  inline-size: fit-content;
-  max-inline-size: 100%;
-  min-height: 28px;
-  align-items: center;
-  justify-content: center;
-  gap: 4px;
-  margin: 0;
-  padding: 0 8px;
-  -webkit-app-region: no-drag;
-  border: 1px solid var(--input);
-  border-radius: var(--radius-lg);
-  corner-shape: var(--corner-shape);
-  color: var(--secondary-foreground);
-  background: var(--secondary);
-  cursor: var(--cursor-interaction, pointer);
-  text-align: center;
-  text-decoration: none;
-  white-space: nowrap;
-  user-select: none;
-  -webkit-font-smoothing: antialiased;
-}
-
-.btn:is(.btn-block, .viz-tile) {
-  inline-size: 100%;
-}
-
-.btn.viz-tile {
-  min-width: 0;
-  overflow-wrap: anywhere;
-  white-space: normal;
-}
-
-a.btn {
-  cursor: pointer;
-  text-decoration: none;
-}
-
-.btn:not(:disabled):hover,
-.nav-link:not(:disabled):not([aria-disabled="true"]):hover {
-  background: color-mix(in srgb, var(--foreground) 6%, var(--secondary));
-}
-
-.btn-primary {
-  border-color: transparent;
-  color: var(--primary-foreground);
-  background: var(--foreground);
-  background-clip: padding-box;
-}
-
-.btn-primary .text-muted {
-  color: color-mix(in srgb, var(--primary-foreground) 50%, transparent);
-}
-
-.btn-primary:not(:disabled):hover {
-  background: color-mix(in srgb, var(--foreground) 80%, transparent);
-  background-clip: padding-box;
-}
-
-.btn-ghost {
-  border-color: transparent;
-  color: var(--muted-foreground);
-  background: transparent;
-}
-
-.btn-ghost:not(:disabled):hover {
-  color: var(--foreground);
-  background: color-mix(in srgb, var(--foreground) 6%, var(--secondary));
-}
-
-.nav-pills .nav-link {
-  min-width: 0;
-  border-color: transparent;
-  color: var(--muted-foreground);
-  background: transparent;
-}
-
-.nav-justified .nav-link {
-  flex: 1 1 0;
-  overflow-wrap: anywhere;
-  white-space: normal;
-}
-
-.nav-pills .nav-link.active {
-  color: var(--foreground);
-  background: var(--muted);
-}
-
-.btn:disabled,
-.nav-link:disabled,
-.nav-link[aria-disabled="true"] {
-  cursor: not-allowed;
-  opacity: 0.4;
-}
-
-[data-lucide] {
-  stroke-width: 1.6;
-}
-
-.form-label {
-  display: block;
-  margin-bottom: 6px;
-  color: var(--foreground);
-}
-
-.form-control {
-  display: block;
-  width: 100%;
-  min-height: 28px;
-  padding: 0 8px;
-  outline: none;
-  border: 1px solid var(--input);
-  border-radius: var(--radius-lg);
-  corner-shape: var(--corner-shape);
-  color: var(--foreground);
-  background: var(--secondary);
-}
-
-.form-control::placeholder {
-  color: var(--muted-foreground);
-}
-
-.form-control[type="file"] {
-  padding: 0;
-  overflow: hidden;
-  cursor: var(--cursor-interaction, pointer);
-}
-
-.form-control[type="file"]::file-selector-button {
-  min-height: 26px;
-  margin-right: 8px;
-  padding: 0 8px;
-  border: 0;
-  border-right: 1px solid var(--input);
-  color: var(--secondary-foreground);
-  background: var(--secondary);
-  cursor: inherit;
-  font: inherit;
-}
-
-.form-control[type="file"]:not(:disabled):hover::file-selector-button {
-  background: color-mix(in srgb, var(--foreground) 6%, var(--secondary));
-}
-
-.form-control-color[type="color"] {
-  width: 40px;
-  height: 28px;
-  padding: 3px;
-  cursor: var(--cursor-interaction, pointer);
-}
-
-.form-control-color[type="color"]::-webkit-color-swatch-wrapper {
-  padding: 0;
-}
-
-.form-control-color[type="color"]::-webkit-color-swatch {
-  border: 0;
-  border-radius: calc(var(--radius-lg) - 4px);
-  corner-shape: var(--corner-shape);
-}
-
-textarea.form-control {
-  height: auto;
-  min-height: 72px;
-  padding: 8px 10px;
-  resize: vertical;
-}
-
-.form-control:focus-visible {
-  border-color: var(--ring);
-  box-shadow: inset 0 0 0 1px var(--ring);
-}
-
-.form-control:disabled,
-.form-select:disabled {
-  cursor: not-allowed;
-  opacity: 0.4;
-}
-
-.form-select {
-  appearance: none;
-  display: block;
-  width: 100%;
-  min-height: 28px;
-  margin: 0;
-  padding: 0 32px 0 8px;
-  outline: none;
-  border: 1px solid var(--input);
-  border-radius: var(--radius-lg);
-  corner-shape: var(--corner-shape);
-  color: var(--foreground);
-  background-color: var(--secondary);
-  background-image:
-    linear-gradient(45deg, transparent 50%, var(--muted-foreground) 50%),
-    linear-gradient(135deg, var(--muted-foreground) 50%, transparent 50%);
-  background-position:
-    calc(100% - 14px) 50%,
-    calc(100% - 10px) 50%;
-  background-repeat: no-repeat;
-  background-size: 4px 4px;
-  cursor: var(--cursor-interaction, default);
-}
-
-.form-select:not(:disabled):hover {
-  background-color: color-mix(in srgb, var(--foreground) 6%, var(--secondary));
-}
-
-.form-select:focus-visible {
-  border-color: var(--ring);
-  box-shadow: inset 0 0 0 1px var(--ring);
-}
-
-.form-check {
-  display: flex;
-  min-height: 20px;
-  align-items: center;
-  gap: 6px;
-}
-
-.form-check-input {
-  appearance: none;
-  width: 14px;
-  height: 14px;
-  flex: 0 0 auto;
-  margin: 0;
-  border: 1px solid var(--input);
-  color: var(--primary-foreground);
-  background-color: transparent;
-  cursor: var(--cursor-interaction, default);
-  transition:
-    background-color 150ms,
-    border-color 150ms,
-    box-shadow 150ms;
-}
-
-.form-check:not(.form-switch) .form-check-input[type="checkbox"] {
-  border-color: var(--input);
-  border-radius: var(--radius-sm);
-  corner-shape: var(--corner-shape);
-  background-color: var(--secondary);
-  box-shadow: var(--shadow-sm);
-}
-
-.form-check:not(.form-switch)
-  .form-check-input:not(:disabled):not(:checked):hover {
-  background-color: var(--card);
-}
-
-.form-check:not(.form-switch) .form-check-input[type="checkbox"]:checked {
-  border-color: var(--primary);
-  background-color: var(--primary);
-}
-
-.form-check:not(.form-switch)
-  .form-check-input[type="checkbox"]:checked::before {
-  display: block;
-  width: 100%;
-  height: 100%;
-  background: var(--primary-foreground);
-  content: "";
-  mask: var(--checkmark-image) center / 12px 12px no-repeat;
-}
-
-.form-check-input[type="radio"] {
-  width: 14px;
-  height: 14px;
-  border-radius: var(--radius-full);
-}
-
-.form-check-input[type="radio"]:checked {
-  border: 2px solid var(--primary);
-  background:
-    radial-gradient(circle, var(--primary-foreground) 0 2.5px, transparent 3px),
-    var(--primary);
-}
-
-.form-check:not(.form-switch) .form-check-input:focus-visible {
-  outline: 2px solid var(--ring);
-  outline-offset: 2px;
-}
-
-.form-check:not(.form-switch) .form-check-input:disabled {
-  cursor: not-allowed;
-  pointer-events: none;
-}
-
-.form-check:not(.form-switch) .form-check-input:disabled + .form-check-label {
-  cursor: not-allowed;
-}
-
-.form-switch .form-check-input:disabled,
-.form-switch .form-check-input:disabled + .form-check-label {
-  cursor: not-allowed;
-  opacity: 0.6;
-}
-
-.form-check-label {
-  color: var(--foreground);
-  cursor: var(--cursor-interaction, default);
-}
-
-.form-switch .form-check-input {
-  position: relative;
-  width: 32px;
-  height: 20px;
-  border: 0;
-  border-radius: var(--radius-full);
-  background: var(--muted);
-  box-shadow: none;
-  transition: background-color 200ms cubic-bezier(0, 0, 0.2, 1);
-}
-
-.form-switch .form-check-input::before {
-  position: absolute;
-  top: 50%;
-  left: 0;
-  width: 16px;
-  height: 16px;
-  box-sizing: border-box;
-  border: 1px solid light-dark(var(--primary-foreground), var(--foreground));
-  border-radius: var(--radius-full);
-  background: light-dark(var(--primary-foreground), var(--foreground));
-  box-shadow: var(--shadow-sm);
-  content: "";
-  transform: translate(2px, -50%);
-  transition: transform 200ms cubic-bezier(0, 0, 0.2, 1);
-}
-
-.form-switch .form-check-input:checked {
-  background: var(--primary);
-}
-
-.form-switch .form-check-input:checked::before {
-  transform: translate(14px, -50%);
-}
-
-.form-switch .form-check-input:focus-visible {
-  box-shadow: 0 0 0 2px var(--ring);
-}
-
-.form-range {
-  appearance: none;
-  display: block;
-  width: 100%;
-  height: 28px;
-  flex: 1;
-  margin: 0;
-  padding: 0;
-  outline: none;
-  border: 0;
-  accent-color: var(--primary);
-  background: linear-gradient(
-      color-mix(in srgb, var(--foreground) 7%, transparent),
-      color-mix(in srgb, var(--foreground) 7%, transparent)
-    )
-    center / 100% 2px no-repeat;
-}
-
-.form-range::-webkit-slider-runnable-track {
-  height: 28px;
-  background: transparent;
-}
-
-.form-range::-webkit-slider-thumb {
-  appearance: none;
-  width: 20px;
-  height: 20px;
-  margin-top: 4px;
-  border: 1px solid var(--border);
-  border-radius: var(--radius-full);
-  background: light-dark(var(--primary-foreground), var(--foreground));
-}
-
-.form-range:focus-visible::-webkit-slider-thumb {
-  border-color: var(--ring);
-  box-shadow: inset 0 0 0 1px var(--ring);
-}
-
-.form-range::-moz-range-track {
-  height: 28px;
-  background: transparent;
-}
-
-.form-range::-moz-range-thumb {
-  width: 20px;
-  height: 20px;
-  border: 1px solid var(--border);
-  border-radius: var(--radius-full);
-  background: light-dark(var(--primary-foreground), var(--foreground));
-}
-
-.form-range:focus-visible::-moz-range-thumb {
-  border-color: var(--ring);
-  box-shadow: inset 0 0 0 1px var(--ring);
-}
-
-.form-range:disabled {
-  cursor: not-allowed;
-  opacity: 0.4;
-}
-
-.btn:not(.btn-primary, .viz-tile):is(
-  [aria-pressed="true"],
-  [aria-selected="true"],
-  .is-selected
-) {
-  border-color: var(--primary);
-  color: var(--primary-foreground);
-  background: var(--primary);
-}
-
-.btn.viz-tile:is([aria-pressed="true"], [aria-selected="true"], .is-selected) {
-  border-color: var(--primary);
-  box-shadow: inset 0 0 0 1px var(--primary);
-}
-
-.btn:focus-visible,
-.nav-link:focus-visible {
-  outline: 2px solid var(--ring);
-  outline-offset: 2px;
-}
-
-@media (pointer: coarse) {
-  .btn,
-  .nav-link,
-  .form-control,
-  .form-select {
-    min-width: 44px;
-    min-height: 44px;
-  }
-
-  /* Keep small-screen WebKit from zooming when a text field receives focus. */
-  .form-control,
-  .form-select {
-    font-size: max(16px, var(--font-size-normal));
-  }
-
-  .form-control[type="file"]::file-selector-button {
-    min-width: 44px;
-    min-height: 44px;
-  }
-
-  .form-control-color[type="color"] {
-    width: 44px;
-    height: 44px;
-  }
-
-  .form-control:is(
-    [type="date"],
-    [type="datetime-local"],
-    [type="month"],
-    [type="time"],
-    [type="week"]
-  ) {
-    min-width: 0;
-    max-width: 100%;
-    padding-block: 8px;
-  }
-
-  .form-check {
-    min-height: 44px;
-    padding-inline: 15px;
-  }
-
-  .form-check-input {
-    position: relative;
-  }
-
-  .form-check-input::after {
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    width: 44px;
-    height: 44px;
-    content: "";
-    transform: translate(-50%, -50%);
-  }
-
-  .form-check-label {
-    display: inline-flex;
-    min-width: 44px;
-    min-height: 44px;
-    align-items: center;
-  }
-
-  .form-range {
-    height: 44px;
-    touch-action: pan-y;
-  }
-
-  .form-range::-webkit-slider-runnable-track {
-    height: 44px;
-  }
-
-  .form-range::-moz-range-track {
-    height: 44px;
-  }
-
-  .form-range::-webkit-slider-thumb {
-    margin-top: 12px;
-  }
-}
-
-svg {
-  display: block;
-  max-width: 100%;
-  height: auto;
-}
-
-#widget > svg {
-  width: 100%;
-}
-
-/* Model-authored chart rules can otherwise stretch icons after these styles load. */
-svg.lucide {
-  display: block;
-  width: var(--icon-size) !important;
-  height: var(--icon-size) !important;
-  flex: none;
-  margin: 0 !important;
-  stroke-width: 1.6;
-}
-
-.text-warning,
-.text-destructive {
-  color: var(--destructive);
-}
-`;
-var VISUALIZATION_HELPERS = `
-<script src="https://unpkg.com/@floating-ui/core@1.7.3/dist/floating-ui.core.umd.min.js"></script>
-<script src="https://unpkg.com/@floating-ui/dom@1.7.4/dist/floating-ui.dom.umd.min.js"></script>
-<script>
-  (() => {
-    if (window.FloatingUIDOM == null) {
-      return;
-    }
-    const { autoUpdate, computePosition, flip, offset, shift, size } = window.FloatingUIDOM;
-    const tooltipPlacements = new Set(["top", "right", "bottom", "left"]);
-    const tooltipId = \`codex-visualization-tooltip-\${
-      window.crypto?.randomUUID?.() ?? Date.now().toString(36)
-    }\`;
-    const tooltipGap = 5;
-    const hoverDelay = 700;
-    const skipDelay = 300;
-    let activeTrigger = null;
-    let pendingTrigger = null;
-    let tooltip = null;
-    let openTimeout = null;
-    let autoUpdateCleanup = null;
-    let positionRequest = 0;
-    let skipDelayUntil = 0;
-    let lastPointerWasTouch = false;
-    let pinnedByTouch = false;
+} from "./chunk-Y2PRMYLC.js";
+import {
+  cn
+} from "./chunk-22KP6LR5.js";
 
-    const getTrigger = (target) =>
-      target?.nodeType === Node.ELEMENT_NODE ? target.closest("[data-tooltip]") : null;
-    const containsTarget = (trigger, target) =>
-      target?.nodeType != null && trigger.contains(target);
-    const getContent = (trigger) => trigger.getAttribute("data-tooltip")?.trim() ?? "";
-    const getPlacement = (trigger) => {
-      const placement = trigger.getAttribute("data-tooltip-placement");
-      return tooltipPlacements.has(placement) ? placement : "top";
-    };
-    const getTooltip = () => {
-      if (tooltip == null) {
-        tooltip = document.createElement("div");
-        tooltip.id = tooltipId;
-        tooltip.className = "tooltip";
-        tooltip.setAttribute("role", "tooltip");
-      }
-      return tooltip;
-    };
-    const setDescribedBy = (trigger, described) => {
-      const ids = new Set(
-        (trigger.getAttribute("aria-describedby") ?? "").split(/\\s+/).filter(Boolean),
-      );
-      if (described) {
-        ids.add(tooltipId);
-      } else {
-        ids.delete(tooltipId);
-      }
-      if (ids.size === 0) {
-        trigger.removeAttribute("aria-describedby");
-      } else {
-        trigger.setAttribute("aria-describedby", [...ids].join(" "));
-      }
-    };
-    const clearOpenTimeout = () => {
-      if (openTimeout != null) {
-        window.clearTimeout(openTimeout);
-        openTimeout = null;
-      }
-      pendingTrigger = null;
-    };
-    const closeTooltip = (activateSkipDelay = true) => {
-      clearOpenTimeout();
-      pinnedByTouch = false;
-      positionRequest += 1;
-      autoUpdateCleanup?.();
-      autoUpdateCleanup = null;
-      if (activeTrigger == null) {
-        return;
-      }
-      setDescribedBy(activeTrigger, false);
-      activeTrigger = null;
-      tooltip?.remove();
-      if (activateSkipDelay) {
-        skipDelayUntil = Date.now() + skipDelay;
-      }
-    };
-    const updatePosition = (trigger, floating) => {
-      const request = ++positionRequest;
-      void computePosition(trigger, floating, {
-        middleware: [
-          offset(tooltipGap),
-          flip({ padding: tooltipGap }),
-          shift({ padding: tooltipGap }),
-          size({
-            padding: tooltipGap,
-            apply({ availableHeight, availableWidth, elements }) {
-              elements.floating.style.setProperty(
-                "--tooltip-available-width",
-                \`\${Math.max(0, availableWidth)}px\`,
-              );
-              elements.floating.style.setProperty(
-                "--tooltip-available-height",
-                \`\${Math.max(0, availableHeight)}px\`,
-              );
-            },
-          }),
-        ],
-        placement: getPlacement(trigger),
-        strategy: "fixed",
-      })
-        .then(({ x, y }) => {
-          if (activeTrigger !== trigger || request !== positionRequest) {
-            return;
-          }
-          const scale = window.devicePixelRatio || 1;
-          floating.style.transform = \`translate(\${Math.round(x * scale) / scale}px, \${Math.round(y * scale) / scale}px)\`;
-          floating.style.visibility = "visible";
-        })
-        .catch(() => {
-          if (activeTrigger === trigger && request === positionRequest) {
-            closeTooltip(false);
-          }
-        });
-    };
-    const openTooltip = (trigger) => {
-      const content = getContent(trigger);
-      if (!trigger.isConnected || content.length === 0) {
-        return;
-      }
-      clearOpenTimeout();
-      if (activeTrigger === trigger) {
-        return;
-      }
-      closeTooltip();
-      const floating = getTooltip();
-      floating.textContent = content;
-      floating.style.visibility = "hidden";
-      floating.style.transform = "translate(0, 0)";
-      document.body.appendChild(floating);
-      activeTrigger = trigger;
-      setDescribedBy(trigger, true);
-      autoUpdateCleanup = autoUpdate(trigger, floating, () => {
-        updatePosition(trigger, floating);
+// src/components/artifacts/site-view.tsx
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+function SiteView({
+  client,
+  workspaceId,
+  siteId,
+  toolBridge,
+  theme,
+  archivedMessage,
+  showTitle = true,
+  loadingLabel,
+  onTitle,
+  className
+}) {
+  const labels = useArtifactLabels();
+  const [snapshot, setSnapshot] = useState(null);
+  const [error, setError] = useState(null);
+  const readAbort = useRef(null);
+  const onTitleRef = useRef(onTitle);
+  onTitleRef.current = onTitle;
+  const load = useCallback(async () => {
+    readAbort.current?.abort();
+    const abort = new AbortController();
+    readAbort.current = abort;
+    try {
+      setError(null);
+      const next = await loadSiteSnapshot(client, workspaceId, siteId, {
+        signal: abort.signal,
+        includeArchivedContent: true
       });
-    };
-    const requestOpen = (trigger, immediate = false) => {
-      if (
-        getContent(trigger).length === 0 ||
-        activeTrigger === trigger ||
-        pendingTrigger === trigger
-      ) {
-        return;
-      }
-      clearOpenTimeout();
-      pendingTrigger = trigger;
-      const delay =
-        immediate || activeTrigger != null || Date.now() < skipDelayUntil ? 0 : hoverDelay;
-      if (delay === 0) {
-        openTooltip(trigger);
-        return;
-      }
-      openTimeout = window.setTimeout(() => {
-        openTimeout = null;
-        pendingTrigger = null;
-        openTooltip(trigger);
-      }, delay);
-    };
-    const handlePointerOpen = (event) => {
-      if (event.pointerType === "touch") {
-        return;
-      }
-      const trigger = getTrigger(event.target);
-      if (trigger == null || containsTarget(trigger, event.relatedTarget)) {
-        return;
-      }
-      requestOpen(trigger);
-    };
-    const handlePointer = (event) => {
-      lastPointerWasTouch = event.type === "pointerdown" && event.pointerType === "touch";
-    };
-    const handleTouchClick = (event) => {
-      const isTouch = event.pointerType === "touch" || lastPointerWasTouch;
-      lastPointerWasTouch = false;
-      if (!isTouch || event.detail === 0) {
-        return;
-      }
-      const trigger = getTrigger(event.target);
-      if (
-        trigger == null ||
-        !trigger.isConnected ||
-        getContent(trigger).length === 0 ||
-        (pinnedByTouch && activeTrigger === trigger)
-      ) {
-        if (pinnedByTouch) {
-          closeTooltip();
-        }
-        return;
-      }
-      openTooltip(trigger);
-      pinnedByTouch = activeTrigger === trigger;
-      window.setTimeout(() => {
-        if (activeTrigger === trigger && !trigger.isConnected) {
-          closeTooltip(false);
-        }
-      }, 0);
-    };
-    const handleLeave = (event) => {
-      if (pinnedByTouch) {
-        return;
-      }
-      const trigger = getTrigger(event.target);
-      if (trigger == null || containsTarget(trigger, event.relatedTarget)) {
-        return;
-      }
-      if (activeTrigger === trigger || pendingTrigger === trigger) {
-        closeTooltip();
-      }
-    };
-    const handleFocusIn = (event) => {
-      const trigger = getTrigger(event.target);
-      if (trigger?.matches(":focus-visible")) {
-        requestOpen(trigger, true);
-      }
-    };
-    const handleKeyDown = (event) => {
-      if (event.key === "Escape") {
-        closeTooltip();
-      }
-    };
-    const handleContextMenu = (event) => {
-      lastPointerWasTouch = false;
-      const trigger = getTrigger(event.target);
-      if (activeTrigger === trigger || pendingTrigger === trigger) {
-        closeTooltip();
-      }
-    };
-    const destroy = () => {
-      closeTooltip(false);
-      lastPointerWasTouch = false;
-      document.removeEventListener("pointerover", handlePointerOpen);
-      document.removeEventListener("pointerdown", handlePointer);
-      document.removeEventListener("pointercancel", handlePointer);
-      document.removeEventListener("click", handleTouchClick);
-      document.removeEventListener("pointerout", handleLeave);
-      document.removeEventListener("focusin", handleFocusIn);
-      document.removeEventListener("focusout", handleLeave);
-      document.removeEventListener("keydown", handleKeyDown);
-      document.removeEventListener("contextmenu", handleContextMenu);
-      tooltip = null;
-    };
-
-    document.addEventListener("pointerover", handlePointerOpen);
-    document.addEventListener("pointerdown", handlePointer);
-    document.addEventListener("pointercancel", handlePointer);
-    document.addEventListener("click", handleTouchClick);
-    document.addEventListener("pointerout", handleLeave);
-    document.addEventListener("focusin", handleFocusIn);
-    document.addEventListener("focusout", handleLeave);
-    document.addEventListener("keydown", handleKeyDown);
-    document.addEventListener("contextmenu", handleContextMenu);
-    window.addEventListener("pagehide", destroy, { once: true });
-  })();
-</script>
-<script id="codex-visualization-tabs">
-  (() => {
-    const selector = '.nav[role="tablist"] [role="tab"]';
-    const disabled = ':disabled,[aria-disabled="true"]';
-    const selectTab = (selected) => {
-      const panelId = selected.getAttribute("aria-controls");
-      for (const tab of selected.closest('[role="tablist"]').querySelectorAll('[role="tab"]')) {
-        const active = tab === selected;
-        tab.classList.toggle("active", active);
-        tab.setAttribute("aria-selected", String(active));
-        const id = tab.getAttribute("aria-controls");
-        const panel = id && document.getElementById(id);
-        if (panel != null) {
-          panel.hidden = id !== panelId;
-          if (!panel.hidden && selected.id) {
-            panel.setAttribute("aria-labelledby", selected.id);
-          }
-        }
-      }
-    };
-    const interact = (event) => {
-      const tab = event.target?.closest?.(selector);
-      if (event.defaultPrevented || tab == null || tab.matches(disabled)) {
-        return;
-      }
-      if (event.type === "click") {
-        selectTab(tab);
-        return;
-      }
-      const tabs = Array.from(
-        tab.closest('[role="tablist"]').querySelectorAll('[role="tab"]'),
-      ).filter((candidate) => !candidate.matches(disabled));
-      const current = tabs.indexOf(tab);
-      let next;
-      if (event.key === "ArrowRight" || event.key === "ArrowDown") {
-        next = (current + 1) % tabs.length;
-      } else if (event.key === "ArrowLeft" || event.key === "ArrowUp") {
-        next = (current + tabs.length - 1) % tabs.length;
-      } else if (event.key === "Home") {
-        next = 0;
-      } else if (event.key === "End") {
-        next = tabs.length - 1;
-      } else {
-        return;
-      }
-      event.preventDefault();
-      tabs[next].focus();
-      selectTab(tabs[next]);
-    };
-
-    for (const list of document.querySelectorAll('.nav[role="tablist"]')) {
-      const selected =
-        list.querySelector('[role="tab"][aria-selected="true"]') ??
-        list.querySelector('[role="tab"].active') ??
-        list.querySelector('[role="tab"]');
-      if (selected != null) {
-        selectTab(selected);
-      }
+      if (abort.signal.aborted) return;
+      setSnapshot(next);
+      onTitleRef.current?.(next.detail.artifact.title);
+    } catch (nextError) {
+      if (abort.signal.aborted) return;
+      setSnapshot(null);
+      setError(nextError);
     }
-    document.addEventListener("click", interact);
-    document.addEventListener("keydown", interact);
-    window.addEventListener(
-      "pagehide",
-      () => {
-        document.removeEventListener("click", interact);
-        document.removeEventListener("keydown", interact);
-      },
-      { once: true },
+  }, [client, siteId, workspaceId]);
+  useEffect(() => {
+    setSnapshot(null);
+    void load();
+    return () => readAbort.current?.abort();
+  }, [load]);
+  const content = snapshot?.content;
+  const bridge = useMemo(
+    () => content ? toolBridge?.({
+      artifactId: siteId,
+      siteVersionId: content.versionId,
+      requestedTools: content.requestedTools
+    }) : void 0,
+    [content, siteId, toolBridge]
+  );
+  if (error)
+    return /* @__PURE__ */ jsx(
+      ArtifactProblem,
+      {
+        view: artifactLoadErrorView(error, "site", labels),
+        onRetry: () => void load()
+      }
     );
-  })();
-</script>
-<script
-  id="codex-visualization-lucide"
-  async
-  src="https://unpkg.com/lucide@1.17.0/dist/umd/lucide.js"
-></script>
-<script>
-  (() => {
-    const initialize = () => {
-      globalThis.lucide?.createIcons({ attrs: { width: 16, height: 16 } });
-    };
-    if (globalThis.lucide != null) {
-      initialize();
-      return;
+  if (!snapshot || !content) return /* @__PURE__ */ jsx(ArtifactLoading, { label: loadingLabel ?? labels.loadingSite });
+  if (snapshot.detail.artifact.status === "archived")
+    return /* @__PURE__ */ jsx("div", { className: "p-4 text-sm text-fg-muted", children: archivedMessage ?? labels.siteArchived });
+  return /* @__PURE__ */ jsx(
+    ArtifactSandbox,
+    {
+      html: content.html,
+      title: snapshot.detail.artifact.title,
+      showTitle,
+      versionLabel: `v${snapshot.detail.artifact.currentVersion?.revision}`,
+      toolBridge: bridge,
+      connectedToolCount: content.requestedTools.length,
+      theme,
+      fill: true,
+      className: className ?? "h-full rounded-none border-0"
     }
-    document
-      .getElementById("codex-visualization-lucide")
-      ?.addEventListener("load", initialize, { once: true });
-  })();
-</script>
-`;
-
-// src/components/artifacts/inline-html-document.ts
-function inlineHtmlDocument(fragment) {
-  return '<!doctype html><html><head><meta name="viewport" content="width=device-width,initial-scale=1"><style>' + VISUALIZATION_CSS + "</style><style>html,body{margin:0;min-height:0}body{padding:16px;box-sizing:border-box}</style></head><body>" + fragment + VISUALIZATION_HELPERS + `<script>
-(()=>{
-  window.addEventListener('message',event=>{
-    if(event.source!==parent||event.data?.type!=='opengeni.preview.theme')return;
-    if(event.data.theme==='light'||event.data.theme==='dark')document.documentElement.style.colorScheme=event.data.theme;
-    previous=0;resize();
-  });
-  let previous=0;
-  const resize=()=>{const height=Math.ceil(document.body.getBoundingClientRect().height);if(height!==previous){previous=height;parent.postMessage({type:'opengeni.preview.height',height},'*')}};
-  new ResizeObserver(resize).observe(document.body);resize();
-})();
-</script></body></html>`;
+  );
 }
 
+// src/components/artifacts/editable-artifact-view.tsx
+import {
+  createBrowserEditableArtifactSession as createBrowserEditableArtifactSession2
+} from "@opengeni/sdk/editable-artifacts";
+import { useCallback as useCallback3, useEffect as useEffect3, useMemo as useMemo2, useRef as useRef3, useState as useState3 } from "react";
+
 // src/components/artifacts/editable-artifact-workbench.tsx
 import {
   createBrowserEditableArtifactSession
 } from "@opengeni/sdk/editable-artifacts";
-import { useCallback, useEffect, useRef, useState } from "react";
-import { jsx } from "react/jsx-runtime";
+import { useCallback as useCallback2, useEffect as useEffect2, useRef as useRef2, useState as useState2 } from "react";
+import { jsx as jsx2 } from "react/jsx-runtime";
 function EditableArtifactWorkbench({
   session,
   document,
@@ -1434,7 +166,7 @@ function EditableArtifactWorkbench({
 }) {
   switch (session.modality) {
     case "document":
-      return /* @__PURE__ */ jsx(
+      return /* @__PURE__ */ jsx2(
         EditableDocumentArtifactSurface,
         {
           ...document,
@@ -1443,9 +175,9 @@ function EditableArtifactWorkbench({
         }
       );
     case "spreadsheet":
-      return /* @__PURE__ */ jsx(EditableSpreadsheetArtifactSurface, { ...spreadsheet, session });
+      return /* @__PURE__ */ jsx2(EditableSpreadsheetArtifactSurface, { ...spreadsheet, session });
     case "presentation":
-      return /* @__PURE__ */ jsx(EditablePresentationArtifactSurface, { ...presentation, session });
+      return /* @__PURE__ */ jsx2(EditablePresentationArtifactSurface, { ...presentation, session });
   }
 }
 function EditableArtifactWorkbenchHost({
@@ -1455,13 +187,13 @@ function EditableArtifactWorkbenchHost({
   spreadsheet,
   presentation
 }) {
-  const createSessionRef = useRef(createSession);
-  const [retryEpoch, setRetryEpoch] = useState(0);
-  const [state, setState] = useState({ key: null, session: null, error: null });
-  useEffect(() => {
+  const createSessionRef = useRef2(createSession);
+  const [retryEpoch, setRetryEpoch] = useState2(0);
+  const [state, setState] = useState2({ key: null, session: null, error: null });
+  useEffect2(() => {
     createSessionRef.current = createSession;
   }, [createSession]);
-  useEffect(() => {
+  useEffect2(() => {
     let owned = null;
     setState({ key: sessionKey, session: null, error: null });
     try {
@@ -1480,10 +212,11 @@ function EditableArtifactWorkbenchHost({
       if (closing) void closing.close().catch(() => void 0);
     };
   }, [retryEpoch, sessionKey]);
-  const retry = useCallback(() => setRetryEpoch((value) => value + 1), []);
+  const retry = useCallback2(() => setRetryEpoch((value) => value + 1), []);
+  const labels = useArtifactLabels();
   const currentError = state.key === sessionKey ? state.error : null;
   if (state.key === sessionKey && state.session) {
-    return /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx2(
       EditableArtifactWorkbench,
       {
         session: state.session,
@@ -1493,12 +226,13 @@ function EditableArtifactWorkbenchHost({
       }
     );
   }
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx2(
     EditableArtifactMessage,
     {
-      title: currentError ? "Could not open this artifact" : "Opening artifact",
-      detail: currentError?.message ?? "Starting the secure editing session\u2026",
-      retry: currentError ? retry : void 0
+      title: currentError ? labels.editableErrors.transient.title : labels.opening,
+      detail: currentError?.message ?? labels.startingEditor,
+      retry: currentError ? retry : void 0,
+      retryLabel: labels.retry
     }
   );
 }
@@ -1509,8 +243,8 @@ function BrowserEditableArtifactWorkbench({
   presentation
 }) {
   const sessionKey = browserSessionKey(options);
-  const createSession = useCallback(() => createBrowserEditableArtifactSession(options), [options]);
-  return /* @__PURE__ */ jsx(
+  const createSession = useCallback2(() => createBrowserEditableArtifactSession(options), [options]);
+  return /* @__PURE__ */ jsx2(
     EditableArtifactWorkbenchHost,
     {
       sessionKey,
@@ -1541,13 +275,375 @@ function browserSessionKey(options) {
     (_key, value) => value instanceof URL ? value.href : value
   );
 }
+
+// src/components/artifacts/editable-artifact-view.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+function EditableArtifactView({
+  baseUrl,
+  workspaceId,
+  artifactId,
+  open,
+  runtimes,
+  transport,
+  showHeader = true,
+  authorityKey,
+  describeError,
+  onTitle,
+  loadingLabel
+}) {
+  const [loadEpoch, setLoadEpoch] = useState3(0);
+  const labels = useArtifactLabels();
+  const loadKey = JSON.stringify([artifactId, authorityKey, baseUrl.href, workspaceId, loadEpoch]);
+  const [state, setState] = useState3({ key: null, kind: "loading" });
+  const current = state.key === loadKey ? state : null;
+  const openRef = useRef3(open);
+  openRef.current = open;
+  const onTitleRef = useRef3(onTitle);
+  onTitleRef.current = onTitle;
+  useEffect3(() => {
+    const abort = new AbortController();
+    setState({ key: loadKey, kind: "loading" });
+    void openRef.current(abort.signal).then((value) => {
+      if (abort.signal.aborted) return;
+      setState({ key: loadKey, kind: "ready", value });
+      onTitleRef.current?.(value.artifact.title);
+    }).catch((error) => {
+      if (!abort.signal.aborted) setState({ key: loadKey, kind: "error", error });
+    });
+    return () => abort.abort();
+  }, [loadKey]);
+  const ready = current?.kind === "ready" ? current.value : null;
+  const transportRef = useRef3(transport);
+  transportRef.current = transport;
+  const sessionKey = useMemo2(
+    () => ready ? JSON.stringify({
+      baseUrl: baseUrl.href,
+      authorityKey,
+      workspaceId,
+      artifact: { id: ready.artifact.id, modality: ready.artifact.modality },
+      authority: ready.authority,
+      replicaId: ready.replicaId,
+      workerUrl: runtimes.workerUrl
+    }) : "",
+    [authorityKey, baseUrl.href, ready, runtimes.workerUrl, workspaceId]
+  );
+  const createSession = useCallback3(() => {
+    if (!ready) throw new Error("Artifact is not open");
+    return createBrowserEditableArtifactSession2({
+      baseUrl,
+      workspaceId,
+      artifact: ready.artifact,
+      storageAuthority: ready.authority,
+      replicaId: ready.replicaId,
+      runtime: {
+        ...runtimeFor(runtimes, ready.artifact.modality),
+        workerUrl: runtimes.workerUrl,
+        ...runtimes.applicationOrigin ? { applicationOrigin: runtimes.applicationOrigin } : {},
+        ...runtimes.allowInsecureDevelopmentAssets ? { allowInsecureDevelopmentAssets: true } : {}
+      },
+      ...transportRef.current ? { transport: transportRef.current } : {}
+    });
+  }, [baseUrl, ready, runtimes, workspaceId]);
+  if (!current || current.kind === "loading")
+    return /* @__PURE__ */ jsx3(ArtifactLoading, { label: loadingLabel ?? labels.opening });
+  if (current.kind === "error") {
+    return /* @__PURE__ */ jsx3(
+      ArtifactProblem,
+      {
+        view: describeError ? describeError(current.error) : artifactLoadErrorView(current.error, "editable", labels),
+        onRetry: () => setLoadEpoch((value) => value + 1)
+      }
+    );
+  }
+  const { artifact } = current.value;
+  const surface = { title: artifact.title, showHeader };
+  return /* @__PURE__ */ jsx3("div", { className: "h-full min-h-0 bg-og-bg text-og-fg", children: /* @__PURE__ */ jsx3(
+    EditableArtifactWorkbenchHost,
+    {
+      sessionKey,
+      createSession,
+      document: surface,
+      spreadsheet: surface,
+      presentation: surface
+    }
+  ) });
+}
+function runtimeFor(runtimes, modality) {
+  switch (modality) {
+    case "document":
+      return runtimes.document;
+    case "spreadsheet":
+      return runtimes.spreadsheet;
+    case "presentation":
+      return runtimes.presentation;
+  }
+}
+
+// src/components/artifacts/session-artifact-viewer.tsx
+import { SESSION_SCOPE_HEADER } from "@opengeni/sdk";
+import { createEditableArtifactReplicaId } from "@opengeni/sdk/editable-artifacts";
+import { useCallback as useCallback4, useEffect as useEffect4, useMemo as useMemo3, useRef as useRef4, useState as useState4 } from "react";
+import { jsx as jsx4, jsxs } from "react/jsx-runtime";
+var viewerClientKeys = /* @__PURE__ */ new WeakMap();
+function viewerClientKey(client) {
+  let key = viewerClientKeys.get(client);
+  if (!key) {
+    key = crypto.randomUUID();
+    viewerClientKeys.set(client, key);
+  }
+  return key;
+}
+function SessionArtifactViewer({ labels, ...props }) {
+  return /* @__PURE__ */ jsx4(ArtifactLabelsProvider, { labels, children: /* @__PURE__ */ jsx4(Viewer, { ...props }) });
+}
+function Viewer({
+  client: clientOverride,
+  workspaceId: workspaceOverride,
+  sessionId,
+  target,
+  onClose,
+  onBack,
+  editableRuntimes,
+  theme,
+  siteToolBridge,
+  className
+}) {
+  const labels = useArtifactLabels();
+  const context = useOpenGeni({ client: clientOverride, workspaceId: workspaceOverride });
+  const base = context.client;
+  const workspaceId = context.workspaceId;
+  const client = useMemo3(
+    () => base.withHeaders({ [SESSION_SCOPE_HEADER]: sessionId }),
+    [base, sessionId]
+  );
+  const [loaded, setLoaded] = useState4(null);
+  const targetKey = `${target.kind}:${target.artifactId}`;
+  const current = loaded?.key === targetKey && loaded.client === client && loaded.workspaceId === workspaceId ? loaded : null;
+  const kind = target.kind === "site" ? "site" : current?.kind ?? null;
+  const [unavailable, setUnavailable] = useState4(null);
+  const markUnavailable = useCallback4(
+    () => setUnavailable({ key: targetKey, client, workspaceId }),
+    [client, targetKey, workspaceId]
+  );
+  const title = current?.title ?? target.title ?? (unavailable?.key === targetKey && unavailable.client === client && unavailable.workspaceId === workspaceId ? labels.artifact : labels.opening);
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      "aria-label": title,
+      "data-og-artifact-viewer": target.kind,
+      className: cn("og-root flex h-full min-h-0 w-full min-w-0 flex-col bg-bg text-fg", className),
+      children: [
+        /* @__PURE__ */ jsx4(
+          ArtifactViewerHeader,
+          {
+            kind,
+            title,
+            onBack,
+            backLabel: labels.back,
+            onClose,
+            closeLabel: labels.close
+          }
+        ),
+        /* @__PURE__ */ jsx4("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col overflow-hidden", children: target.kind === "site" ? /* @__PURE__ */ jsx4(
+          SiteView,
+          {
+            client,
+            workspaceId,
+            siteId: target.artifactId,
+            theme,
+            toolBridge: siteToolBridge,
+            showTitle: false,
+            onTitle: (next) => setLoaded({ key: targetKey, client, workspaceId, title: next, kind: "site" })
+          },
+          targetKey
+        ) : /* @__PURE__ */ jsx4(
+          EditableBody,
+          {
+            client,
+            workspaceId,
+            sessionId,
+            artifactId: target.artifactId,
+            runtimes: editableRuntimes,
+            onOpened: (next, modality) => setLoaded({ key: targetKey, client, workspaceId, title: next, kind: modality }),
+            onUnavailable: markUnavailable
+          },
+          targetKey
+        ) })
+      ]
+    }
+  );
+}
+function EditableBody({
+  client,
+  workspaceId,
+  sessionId,
+  artifactId,
+  runtimes,
+  onOpened,
+  onUnavailable
+}) {
+  const labels = useArtifactLabels();
+  const clientKey = viewerClientKey(client);
+  const [retryEpoch, setRetryEpoch] = useState4(0);
+  const [configState, setConfigState] = useState4(null);
+  const current = configState?.client === client && configState.workspaceId === workspaceId && configState.sessionId === sessionId ? configState.result : null;
+  const config = current?.kind === "ready" ? current.config : null;
+  const scopeRef = useRef4({ client, workspaceId, sessionId });
+  scopeRef.current = { client, workspaceId, sessionId };
+  useEffect4(() => {
+    let live = true;
+    setConfigState(null);
+    client.getClientConfig().then(
+      (value) => live && setConfigState({
+        client,
+        workspaceId,
+        sessionId,
+        result: value.artifacts ? { kind: "ready", config: value.artifacts } : { kind: "unavailable" }
+      }),
+      (error) => live && setConfigState({ client, workspaceId, sessionId, result: { kind: "error", error } })
+    );
+    return () => {
+      live = false;
+    };
+  }, [client, retryEpoch, sessionId, workspaceId]);
+  const baseUrl = useMemo3(
+    () => new URL(client.apiUrl("/"), globalThis.location?.href ?? "http://localhost/"),
+    [client]
+  );
+  const transport = useMemo3(() => {
+    if (!config) return void 0;
+    const socket = new URL(config.editableLiveUrl);
+    let scope = new AbortController();
+    const checkCurrent = (signal) => {
+      signal.throwIfAborted();
+      if (scopeRef.current.client !== client || scopeRef.current.workspaceId !== workspaceId || scopeRef.current.sessionId !== sessionId) {
+        throw new DOMException("Artifact viewer scope changed", "AbortError");
+      }
+    };
+    return {
+      activate: () => {
+        if (scope.signal.aborted) scope = new AbortController();
+      },
+      abort: () => scope.abort(),
+      fetch: async (input, init) => {
+        const signal = AbortSignal.any([scope.signal, ...init?.signal ? [init.signal] : []]);
+        checkCurrent(signal);
+        const url = new URL(input instanceof Request ? input.url : input, baseUrl);
+        if (init?.method === "POST" && url.pathname === new URL(
+          `v1/workspaces/${encodeURIComponent(workspaceId)}/editable-artifacts/${encodeURIComponent(artifactId)}/live-ticket`,
+          baseUrl
+        ).pathname) {
+          const next = (await client.getClientConfig({ signal })).artifacts;
+          checkCurrent(signal);
+          if (!next || artifactCapabilityKey(next) !== artifactCapabilityKey(config)) {
+            setConfigState({
+              client,
+              workspaceId,
+              sessionId,
+              result: next ? { kind: "ready", config: next } : { kind: "unavailable" }
+            });
+            scope.abort();
+            signal.throwIfAborted();
+          }
+          const { replicaId } = await new Request(input, init).json();
+          if (typeof replicaId !== "string") throw new TypeError("Artifact replica is required");
+          await client.getEditableArtifact(workspaceId, artifactId, { replicaId, signal });
+          checkCurrent(signal);
+        }
+        return client.fetchApi(url, { ...init, signal });
+      },
+      webSocketUrl: socket,
+      ...isLoopback(baseUrl) && isLoopback(socket) ? { allowInsecureDevelopmentTransport: true } : {}
+    };
+  }, [artifactId, baseUrl, client, config, sessionId, workspaceId]);
+  useEffect4(() => {
+    transport?.activate();
+    return () => transport?.abort();
+  }, [transport]);
+  const blocked = current !== null && (current.kind !== "ready" || !runtimes);
+  useEffect4(() => {
+    if (blocked) onUnavailable();
+  }, [blocked, onUnavailable]);
+  if (!current) return /* @__PURE__ */ jsx4(ArtifactLoading, { label: labels.opening });
+  if (current.kind === "error") {
+    return /* @__PURE__ */ jsx4(
+      ArtifactProblem,
+      {
+        view: artifactLoadErrorView(current.error, "editable", labels),
+        onRetry: () => setRetryEpoch((value) => value + 1)
+      }
+    );
+  }
+  if (!config || !transport) {
+    return /* @__PURE__ */ jsx4(ArtifactProblem, { view: { ...labels.viewingDisabled, retryable: false } });
+  }
+  if (!runtimes) {
+    return /* @__PURE__ */ jsx4(ArtifactProblem, { view: { ...labels.editorsMissing, retryable: false } });
+  }
+  return /* @__PURE__ */ jsx4(
+    EditableArtifactView,
+    {
+      baseUrl,
+      workspaceId,
+      artifactId,
+      authorityKey: JSON.stringify([clientKey, sessionId, artifactCapabilityKey(config)]),
+      runtimes: {
+        ...runtimes,
+        ...isLoopback(baseUrl) ? { allowInsecureDevelopmentAssets: true } : {}
+      },
+      transport,
+      showHeader: false,
+      open: async (signal) => {
+        const replicaId = createEditableArtifactReplicaId();
+        const artifact = await client.getEditableArtifact(workspaceId, artifactId, {
+          replicaId,
+          signal
+        });
+        signal.throwIfAborted();
+        onOpened(artifact.title, artifact.modality);
+        return {
+          artifact,
+          replicaId,
+          authority: {
+            deploymentOrigin: baseUrl.origin,
+            workspaceId,
+            ...config.cachePartition
+          }
+        };
+      }
+    }
+  );
+}
+function artifactCapabilityKey(config) {
+  return JSON.stringify([
+    config.editableLiveUrl,
+    config.cachePartition.accountId,
+    config.cachePartition.principalId,
+    config.cachePartition.authorizationEpoch
+  ]);
+}
+function isLoopback(url) {
+  return (url.protocol === "http:" || url.protocol === "ws:") && (url.hostname === "localhost" || url.hostname === "127.0.0.1" || url.hostname === "[::1]");
+}
 export {
+  ArtifactBadge,
+  ArtifactButton,
+  ArtifactLabelsProvider,
+  ArtifactLoading,
+  ArtifactProblem,
+  ArtifactSandbox,
+  ArtifactSelect,
   ArtifactSurface,
+  ArtifactViewerHeader,
   BrowserEditableArtifactWorkbench,
+  ChatInteractiveBlock,
+  DEFAULT_ARTIFACT_LABELS,
+  DeferredChatMedia,
   DocumentArtifactSurface,
   DocumentEditor,
   DocumentProjectionArtifactSurface,
   DocumentProjectionEditor,
+  EditableArtifactView,
   EditableArtifactWorkbench,
   EditableArtifactWorkbenchHost,
   EditableDocumentArtifactSurface,
@@ -1560,13 +656,20 @@ export {
   PresentationProjectionArtifactSurface,
   PresentationProjectionEditor,
   PublishedHtmlArtifactFrame,
+  SessionArtifactViewer,
+  SiteView,
   SpreadsheetArtifactSurface,
   SpreadsheetGrid,
   SpreadsheetProjectionGrid,
+  artifactKindIcon,
+  artifactKindSubtitle,
+  artifactLoadErrorMessage,
+  artifactLoadErrorView,
   inlineHtmlDocument,
   isRetainedImageContentType,
   openGeniSiteBridgePortFromBootstrap,
   publishedHtmlArtifactDocument,
+  useArtifactLabels,
   useRetainedImageObjectUrl
 };
 //# sourceMappingURL=artifacts.js.map