@bpmn-nova/studio 0.3.1-preview → 0.3.3-preview

package/dist/styles.css

@@ -511,8 +511,8 @@
 .mb-node-event,
 .mb-node-boundary { display: grid; place-items: center; z-index: 7; }
 .mb-event-shape {
-  width: 46px;
-  height: 46px;
+  width: var(--mb-event-shape-size, 46px);
+  height: var(--mb-event-shape-size, 46px);
   box-sizing: border-box;
   display: grid;
   place-items: center;
@@ -523,7 +523,7 @@
   box-shadow: var(--nova-shadow-sm);
   position: relative;
 }
-.mb-node-boundary .mb-event-shape { width: 40px; height: 40px; border-width: 2px; }
+.mb-node-boundary .mb-event-shape { width: var(--mb-event-shape-size, 40px); height: var(--mb-event-shape-size, 40px); border-width: 2px; }
 .mb-event-shape[data-stage="intermediate"],
 .mb-node-boundary .mb-event-shape { box-shadow: inset 0 0 0 3px var(--nova-color-surface), inset 0 0 0 4.5px var(--nova-color-text-muted, #8796a9), var(--nova-shadow-sm); }
 .mb-event-shape[data-stage="end"] { border-width: 4px; border-color: var(--nova-color-text-secondary); }
@@ -1141,6 +1141,8 @@ textarea.property-control { resize: vertical; }
 
 /* @bpmn-nova/internal/studio */
 .nova-studio-shell { --nova-left-width: 244px; --nova-right-width: 360px; --nova-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", "Microsoft YaHei", Arial, sans-serif; --nova-font-size-xs: 10px; --nova-font-size-sm: 12px; --nova-font-size-md: 14px; --nova-font-size-lg: 16px; --nova-font-weight-regular: 400; --nova-font-weight-medium: 500; --nova-font-weight-semibold: 600; --nova-font-weight-bold: 700; position: relative; isolation: isolate; width: 100%; height: 100%; min-height: 520px; overflow: hidden; display: grid; grid-template-rows: 58px minmax(0, 1fr); color: var(--nova-color-text, #263148); background: var(--nova-color-canvas, #f6f7fb); font-family: var(--nova-font-family); }
+.nova-studio-shell.is-header-hidden { grid-template-rows: minmax(0, 1fr); }
+.nova-studio-header[hidden], .nova-studio-left[hidden], .nova-studio-right[hidden], .nova-studio-statusbar[hidden] { display: none !important; }
 .nova-studio-header { min-width: 0; border-bottom: 1px solid var(--nova-color-divider, #e4e8f0); background: var(--nova-color-surface, #fff); display: grid; grid-template-columns: minmax(180px, auto) auto minmax(0, 1fr); align-items: center; gap: 18px; padding: 0 12px 0 14px; }
 .nova-studio-brand { min-width: 0; display: flex; align-items: center; gap: 10px; }
 .nova-studio-brand-mark { flex: none; width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: var(--nova-color-text-inverse, #fff); background: linear-gradient(145deg, var(--nova-color-primary, #5362da), var(--nova-color-primary-hover)); font-size: var(--nova-font-size-md); font-weight: var(--nova-font-weight-bold); box-shadow: var(--nova-shadow-sm); }
@@ -1157,6 +1159,7 @@ textarea.property-control { resize: vertical; }
 .nova-studio-projection-switch button:hover { color: var(--nova-tone-primary-foreground, #4d59ca); background: var(--nova-color-primary-soft, #f4f5ff); }.nova-studio-projection-switch button.is-active { color: var(--nova-tone-primary-foreground, #4654c8); background: var(--nova-color-primary-soft, #eef0ff); font-weight: var(--nova-font-weight-semibold); }
 .nova-studio-tools { min-width: 0; overflow: visible; display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
 .nova-studio-tools::-webkit-scrollbar { display: none; }
+.nova-studio-header-actions { min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 5px; }
 .nova-studio-tool-divider { flex: none; width: 1px; height: 20px; margin: 0 2px; background: var(--nova-color-divider, #e4e8f0); }
 .nova-studio-tool { flex: none; min-height: 32px; border: 1px solid var(--nova-color-border, #e2e6ef); border-radius: 7px; padding: 0 10px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; color: var(--nova-color-text-secondary, #4c586d); background: var(--nova-color-surface, #fff); font-size: var(--nova-font-size-sm); line-height: 18px; white-space: nowrap; cursor: pointer; }
 .nova-studio-tool:focus { outline: none; }.nova-studio-tool:focus-visible { outline: 2px solid var(--nova-color-focus-ring, #aeb7ff); outline-offset: 1px; }
@@ -1194,7 +1197,11 @@ textarea.property-control { resize: vertical; }
 .nova-studio-beautify-action-icon > .nova-icon-svg { width: 14px; height: 14px; }
 .nova-studio-beautify-action strong { font-size: var(--nova-font-size-sm); font-weight: var(--nova-font-weight-semibold); line-height: 18px; }.nova-studio-beautify-action small { color: #778195; color: var(--nova-color-text-muted, #778195); font-size: var(--nova-font-size-xs); line-height: 14px; }
 .nova-studio-body { min-width: 0; min-height: 0; display: grid; grid-template-columns: var(--nova-left-width) minmax(320px, 1fr) var(--nova-right-width); }
+.nova-studio-body.is-left-hidden { grid-template-columns: minmax(320px, 1fr) var(--nova-right-width); }
+.nova-studio-body.is-right-hidden { grid-template-columns: var(--nova-left-width) minmax(320px, 1fr); }
+.nova-studio-body.is-left-hidden.is-right-hidden { grid-template-columns: minmax(320px, 1fr); }
 .nova-studio-body.is-readonly { grid-template-columns: minmax(320px, 1fr) var(--nova-right-width); }
+.nova-studio-body.is-readonly.is-right-hidden { grid-template-columns: minmax(320px, 1fr); }
 .nova-studio-body.is-readonly .nova-studio-left { display: none; }
 .nova-studio-left, .nova-studio-right, .nova-studio-canvas-column, .nova-studio-canvas { min-width: 0; min-height: 0; overflow: hidden; }
 .nova-studio-left { border-right: 1px solid var(--nova-color-divider, #e4e8f0); background: var(--nova-color-surface, #fff); overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
@@ -1206,6 +1213,7 @@ textarea.property-control { resize: vertical; }
 .nova-studio-left::-webkit-scrollbar-thumb:hover, .nova-studio-right::-webkit-scrollbar-thumb:hover { background: #c1c9d5; background: var(--nova-color-text-muted); }
 .nova-studio-left::-webkit-scrollbar-button, .nova-studio-right::-webkit-scrollbar-button { display: none; width: 0; height: 0; }
 .nova-studio-canvas-column { display: grid; grid-template-rows: minmax(0, 1fr) 35px; background: var(--nova-color-canvas, #f7f8fc); }
+.nova-studio-canvas-column.is-footer-hidden { grid-template-rows: minmax(0, 1fr); }
 .nova-studio-canvas-stage { position: relative; min-width: 0; min-height: 0; overflow: hidden; }
 .nova-studio-canvas { position: relative; }
 .nova-studio-canvas-stage > .nova-studio-canvas { width: 100%; height: 100%; }
@@ -1422,6 +1430,7 @@ textarea.property-control { resize: vertical; }
 }
 @media (max-width: 720px) {
   .nova-studio-shell { grid-template-rows: 54px minmax(0,1fr); }
+  .nova-studio-shell.is-header-hidden { grid-template-rows: minmax(0, 1fr); }
   .nova-studio-header { grid-template-columns: auto minmax(0,1fr); padding-left: 9px; }
   .nova-studio-brand-copy { display: none; }
   .nova-studio-body { grid-template-columns: 1fr; }