@wildwinter/app-shell 0.34.0 → 0.34.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -136,7 +136,7 @@ body.pane-resizing .panes {
136
136
  border-radius: var(--radius-sm);
137
137
  background: none;
138
138
  color: var(--muted);
139
- font-size: 1.05rem;
139
+ font-size: 0.95rem;
140
140
  line-height: 1;
141
141
  cursor: pointer;
142
142
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/pane-shell.css"],"sourcesContent":["/* ============================================================================\n The pane-shell frame: top bar + nav | centre | inspector grid with collapse\n and drag-resize. Reads the shared token grammar (tokens.css) and the app's\n palette vars (--surface / --ink / --muted / --line / --accent, and an\n optional --line-soft). The host fills the pane bodies and the top-bar\n lead/trail slots.\n ============================================================================ */\n\n.pane-shell { flex: 1; display: flex; flex-direction: column; min-height: 0; }\n\n.topbar {\n display: flex; align-items: center; gap: 10px;\n padding: 8px 14px;\n border-bottom: 1px solid var(--line-soft, var(--line));\n background: var(--surface);\n}\n.topbar-lead { display: flex; align-items: center; gap: 8px; min-width: 0; }\n.topbar-spacer { flex: 1; }\n.topbar-trail { display: flex; align-items: center; gap: 10px; }\n.pane-toggle {\n color: var(--muted); font: inherit; font-size: 0.95rem;\n background: none; border: 0; border-radius: var(--radius-sm); padding: 2px 8px; cursor: pointer;\n}\n.pane-toggle:hover { color: var(--accent); }\n\n/* --- the fused title bar (the family ruling, 2026-08-27) --------------------\n On macOS the topbar IS the window's title bar: the app's main window uses\n titleBarStyle \"hiddenInset\" and marks the bar with these classes, so one\n row carries the traffic lights, the identity and the top-level controls\n instead of a native strip whose only cargo is a title. `titlebar` makes the\n bar the drag surface (its controls stay clickable; add `no-drag` to any\n other interactive thing the host mounts); `titlebar-inset` leaves room for\n the traffic lights and is added ONLY on macOS - elsewhere the window keeps\n its native frame and the same bar sits beneath it, identically in every\n app of the family. */\n.topbar.titlebar { -webkit-app-region: drag; }\n.topbar.titlebar :is(button, input, select, a, .no-drag) { -webkit-app-region: no-drag; }\n.topbar.titlebar-inset { padding-left: 84px; }\n\n.panes {\n --nav-open-w: 14rem; --insp-open-w: 22rem;\n --nav-w: var(--nav-open-w); --insp-w: var(--insp-open-w);\n position: relative; flex: 1; min-height: 0;\n display: grid; grid-template-columns: var(--nav-w) minmax(0, 1fr) var(--insp-w);\n transition: grid-template-columns var(--dur-panel) var(--ease-standard);\n}\n.panes.no-nav { --nav-w: 0px; }\n.panes.no-inspector { --insp-w: 0px; }\n\n/* Side panes clip; their inner holds a fixed width so a collapse wipes cleanly\n rather than reflowing while the column animates to 0. */\n.pane { overflow: hidden; min-height: 0; }\n.pane-inner { height: 100%; overflow: auto; }\n.pane-nav .pane-inner { width: var(--nav-open-w); }\n.pane-inspector .pane-inner { width: var(--insp-open-w); }\n.pane-centre { min-width: 0; min-height: 0; overflow: auto; }\n\n.panes > .pane { transition: opacity var(--dur-panel) var(--ease-standard); }\n.panes.no-nav > .pane-nav, .panes.no-inspector > .pane-inspector { opacity: 0; pointer-events: none; }\n\n/* Drag seams over each side pane's inner edge, tracking the grid columns. */\n.pane-resizer { position: absolute; top: 0; bottom: 0; width: 7px; z-index: 6; cursor: col-resize; touch-action: none; }\n.pane-resizer-nav { left: calc(var(--nav-w) - 3px); }\n.pane-resizer-insp { right: calc(var(--insp-w) - 3px); }\n.panes.no-nav .pane-resizer-nav, .panes.no-inspector .pane-resizer-insp { display: none; }\nbody.pane-resizing { cursor: col-resize; user-select: none; }\nbody.pane-resizing .panes { transition: none; } /* 1:1 feel: suspend the grid tween mid-drag */\n\n/* --- the back/forward pair (nav-history.ts) --------------------------------\n VS Code's quietness: two plain chevrons, borderless, greyed where there is\n nowhere to go. They sit to the LEFT of the app's normal navigation (the\n crumb trail here, whatever the host's equivalent is), so they read as part\n of the chrome, not a control demanding attention. */\n.shell-histnav { display: inline-flex; gap: 2px; margin-right: 6px; }\n.shell-histnav-btn { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; padding: 0; border: none; border-radius: var(--radius-sm); background: none; color: var(--muted); font-size: 1.05rem; line-height: 1; cursor: pointer; }\n.shell-histnav-btn:hover:not(:disabled) { color: var(--ink); background: var(--accent-soft); }\n.shell-histnav-btn:disabled { opacity: 0.35; cursor: default; }\n"],"mappings":";AAQA,CAAC;AAAa,QAAM;AAAG,WAAS;AAAM,kBAAgB;AAAQ,cAAY;AAAG;AAE7E,CAAC;AACC,WAAS;AAAM,eAAa;AAAQ,OAAK;AACzC,WAAS,IAAI;AACb,iBAAe,IAAI,MAAM,IAAI,WAAW,EAAE,IAAI;AAC9C,cAAY,IAAI;AAClB;AACA,CAAC;AAAc,WAAS;AAAM,eAAa;AAAQ,OAAK;AAAK,aAAW;AAAG;AAC3E,CAAC;AAAgB,QAAM;AAAG;AAC1B,CAAC;AAAe,WAAS;AAAM,eAAa;AAAQ,OAAK;AAAM;AAC/D,CAAC;AACC,SAAO,IAAI;AAAU,QAAM;AAAS,aAAW;AAC/C,cAAY;AAAM,UAAQ;AAAG,iBAAe,IAAI;AAAc,WAAS,IAAI;AAAK,UAAQ;AAC1F;AACA,CAJC,WAIW;AAAS,SAAO,IAAI;AAAW;AAY3C,CAzBC,MAyBM,CAAC;AAAW,sBAAoB;AAAM;AAC7C,CA1BC,MA0BM,CADC,SACS,IAAI,QAAQ,OAAO,QAAQ,GAAG,CAAC;AAAW,sBAAoB;AAAS;AACxF,CA3BC,MA2BM,CAAC;AAAiB,gBAAc;AAAM;AAE7C,CAAC;AACC,gBAAc;AAAO,iBAAe;AACpC,WAAS,IAAI;AAAe,YAAU,IAAI;AAC1C,YAAU;AAAU,QAAM;AAAG,cAAY;AACzC,WAAS;AAAM,yBAAuB,IAAI,SAAS,OAAO,CAAC,EAAE,KAAK,IAAI;AACtE,cAAY,sBAAsB,IAAI,aAAa,IAAI;AACzD;AACA,CAPC,KAOK,CAAC;AAAS,WAAS;AAAK;AAC9B,CARC,KAQK,CAAC;AAAe,YAAU;AAAK;AAIrC,CAAC;AAAO,YAAU;AAAQ,cAAY;AAAG;AACzC,CAAC;AAAa,UAAQ;AAAM,YAAU;AAAM;AAC5C,CAAC,SAAS,CADT;AACuB,SAAO,IAAI;AAAe;AAClD,CAAC,eAAe,CAFf;AAE6B,SAAO,IAAI;AAAgB;AACzD,CAAC;AAAc,aAAW;AAAG,cAAY;AAAG,YAAU;AAAM;AAE5D,CAlBC,MAkBM,EAAE,CANR;AAMgB,cAAY,QAAQ,IAAI,aAAa,IAAI;AAAkB;AAC5E,CAnBC,KAmBK,CAZC,OAYO,EAAE,CALf;AAK0B,CAnB1B,KAmBgC,CAX1B,aAWwC,EAAE,CAJhD;AAIkE,WAAS;AAAG,kBAAgB;AAAM;AAGrG,CAAC;AAAe,YAAU;AAAU,OAAK;AAAG,UAAQ;AAAG,SAAO;AAAK,WAAS;AAAG,UAAQ;AAAY,gBAAc;AAAM;AACvH,CAAC;AAAmB,QAAM,KAAK,IAAI,SAAS,EAAE;AAAM;AACpD,CAAC;AAAoB,SAAO,KAAK,IAAI,UAAU,EAAE;AAAM;AACvD,CAzBC,KAyBK,CAlBC,OAkBO,CAFb;AAEgC,CAzBhC,KAyBsC,CAjBhC,aAiB8C,CADpD;AACyE,WAAS;AAAM;AACzF,IAAI,CAAC;AAAgB,UAAQ;AAAY,eAAa;AAAM;AAC5D,IAAI,CADC,cACc,CA3BlB;AA2B2B,cAAY;AAAM;AAO9C,CAAC;AAAgB,WAAS;AAAa,OAAK;AAAK,gBAAc;AAAK;AACpE,CAAC;AAAoB,WAAS;AAAa,eAAa;AAAQ,mBAAiB;AAAQ,SAAO;AAAM,UAAQ;AAAM,WAAS;AAAG,UAAQ;AAAM,iBAAe,IAAI;AAAc,cAAY;AAAM,SAAO,IAAI;AAAU,aAAW;AAAS,eAAa;AAAG,UAAQ;AAAS;AAC3Q,CADC,iBACiB,MAAM,KAAK;AAAa,SAAO,IAAI;AAAQ,cAAY,IAAI;AAAgB;AAC7F,CAFC,iBAEiB;AAAY,WAAS;AAAM,UAAQ;AAAS;","names":[]}
1
+ {"version":3,"sources":["../src/pane-shell.css"],"sourcesContent":["/* ============================================================================\n The pane-shell frame: top bar + nav | centre | inspector grid with collapse\n and drag-resize. Reads the shared token grammar (tokens.css) and the app's\n palette vars (--surface / --ink / --muted / --line / --accent, and an\n optional --line-soft). The host fills the pane bodies and the top-bar\n lead/trail slots.\n ============================================================================ */\n\n.pane-shell { flex: 1; display: flex; flex-direction: column; min-height: 0; }\n\n.topbar {\n display: flex; align-items: center; gap: 10px;\n padding: 8px 14px;\n border-bottom: 1px solid var(--line-soft, var(--line));\n background: var(--surface);\n}\n.topbar-lead { display: flex; align-items: center; gap: 8px; min-width: 0; }\n.topbar-spacer { flex: 1; }\n.topbar-trail { display: flex; align-items: center; gap: 10px; }\n.pane-toggle {\n color: var(--muted); font: inherit; font-size: 0.95rem;\n background: none; border: 0; border-radius: var(--radius-sm); padding: 2px 8px; cursor: pointer;\n}\n.pane-toggle:hover { color: var(--accent); }\n\n/* --- the fused title bar (the family ruling, 2026-08-27) --------------------\n On macOS the topbar IS the window's title bar: the app's main window uses\n titleBarStyle \"hiddenInset\" and marks the bar with these classes, so one\n row carries the traffic lights, the identity and the top-level controls\n instead of a native strip whose only cargo is a title. `titlebar` makes the\n bar the drag surface (its controls stay clickable; add `no-drag` to any\n other interactive thing the host mounts); `titlebar-inset` leaves room for\n the traffic lights and is added ONLY on macOS - elsewhere the window keeps\n its native frame and the same bar sits beneath it, identically in every\n app of the family. */\n.topbar.titlebar { -webkit-app-region: drag; }\n.topbar.titlebar :is(button, input, select, a, .no-drag) { -webkit-app-region: no-drag; }\n.topbar.titlebar-inset { padding-left: 84px; }\n\n.panes {\n --nav-open-w: 14rem; --insp-open-w: 22rem;\n --nav-w: var(--nav-open-w); --insp-w: var(--insp-open-w);\n position: relative; flex: 1; min-height: 0;\n display: grid; grid-template-columns: var(--nav-w) minmax(0, 1fr) var(--insp-w);\n transition: grid-template-columns var(--dur-panel) var(--ease-standard);\n}\n.panes.no-nav { --nav-w: 0px; }\n.panes.no-inspector { --insp-w: 0px; }\n\n/* Side panes clip; their inner holds a fixed width so a collapse wipes cleanly\n rather than reflowing while the column animates to 0. */\n.pane { overflow: hidden; min-height: 0; }\n.pane-inner { height: 100%; overflow: auto; }\n.pane-nav .pane-inner { width: var(--nav-open-w); }\n.pane-inspector .pane-inner { width: var(--insp-open-w); }\n.pane-centre { min-width: 0; min-height: 0; overflow: auto; }\n\n.panes > .pane { transition: opacity var(--dur-panel) var(--ease-standard); }\n.panes.no-nav > .pane-nav, .panes.no-inspector > .pane-inspector { opacity: 0; pointer-events: none; }\n\n/* Drag seams over each side pane's inner edge, tracking the grid columns. */\n.pane-resizer { position: absolute; top: 0; bottom: 0; width: 7px; z-index: 6; cursor: col-resize; touch-action: none; }\n.pane-resizer-nav { left: calc(var(--nav-w) - 3px); }\n.pane-resizer-insp { right: calc(var(--insp-w) - 3px); }\n.panes.no-nav .pane-resizer-nav, .panes.no-inspector .pane-resizer-insp { display: none; }\nbody.pane-resizing { cursor: col-resize; user-select: none; }\nbody.pane-resizing .panes { transition: none; } /* 1:1 feel: suspend the grid tween mid-drag */\n\n/* --- the back/forward pair (nav-history.ts) --------------------------------\n VS Code's quietness: two plain chevrons, borderless, greyed where there is\n nowhere to go. They sit to the LEFT of the app's normal navigation (the\n crumb trail here, whatever the host's equivalent is), so they read as part\n of the chrome, not a control demanding attention. */\n.shell-histnav { display: inline-flex; gap: 2px; margin-right: 6px; }\n.shell-histnav-btn { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; padding: 0; border: none; border-radius: var(--radius-sm); background: none; color: var(--muted); font-size: 0.95rem; line-height: 1; cursor: pointer; }\n.shell-histnav-btn:hover:not(:disabled) { color: var(--ink); background: var(--accent-soft); }\n.shell-histnav-btn:disabled { opacity: 0.35; cursor: default; }\n"],"mappings":";AAQA,CAAC;AAAa,QAAM;AAAG,WAAS;AAAM,kBAAgB;AAAQ,cAAY;AAAG;AAE7E,CAAC;AACC,WAAS;AAAM,eAAa;AAAQ,OAAK;AACzC,WAAS,IAAI;AACb,iBAAe,IAAI,MAAM,IAAI,WAAW,EAAE,IAAI;AAC9C,cAAY,IAAI;AAClB;AACA,CAAC;AAAc,WAAS;AAAM,eAAa;AAAQ,OAAK;AAAK,aAAW;AAAG;AAC3E,CAAC;AAAgB,QAAM;AAAG;AAC1B,CAAC;AAAe,WAAS;AAAM,eAAa;AAAQ,OAAK;AAAM;AAC/D,CAAC;AACC,SAAO,IAAI;AAAU,QAAM;AAAS,aAAW;AAC/C,cAAY;AAAM,UAAQ;AAAG,iBAAe,IAAI;AAAc,WAAS,IAAI;AAAK,UAAQ;AAC1F;AACA,CAJC,WAIW;AAAS,SAAO,IAAI;AAAW;AAY3C,CAzBC,MAyBM,CAAC;AAAW,sBAAoB;AAAM;AAC7C,CA1BC,MA0BM,CADC,SACS,IAAI,QAAQ,OAAO,QAAQ,GAAG,CAAC;AAAW,sBAAoB;AAAS;AACxF,CA3BC,MA2BM,CAAC;AAAiB,gBAAc;AAAM;AAE7C,CAAC;AACC,gBAAc;AAAO,iBAAe;AACpC,WAAS,IAAI;AAAe,YAAU,IAAI;AAC1C,YAAU;AAAU,QAAM;AAAG,cAAY;AACzC,WAAS;AAAM,yBAAuB,IAAI,SAAS,OAAO,CAAC,EAAE,KAAK,IAAI;AACtE,cAAY,sBAAsB,IAAI,aAAa,IAAI;AACzD;AACA,CAPC,KAOK,CAAC;AAAS,WAAS;AAAK;AAC9B,CARC,KAQK,CAAC;AAAe,YAAU;AAAK;AAIrC,CAAC;AAAO,YAAU;AAAQ,cAAY;AAAG;AACzC,CAAC;AAAa,UAAQ;AAAM,YAAU;AAAM;AAC5C,CAAC,SAAS,CADT;AACuB,SAAO,IAAI;AAAe;AAClD,CAAC,eAAe,CAFf;AAE6B,SAAO,IAAI;AAAgB;AACzD,CAAC;AAAc,aAAW;AAAG,cAAY;AAAG,YAAU;AAAM;AAE5D,CAlBC,MAkBM,EAAE,CANR;AAMgB,cAAY,QAAQ,IAAI,aAAa,IAAI;AAAkB;AAC5E,CAnBC,KAmBK,CAZC,OAYO,EAAE,CALf;AAK0B,CAnB1B,KAmBgC,CAX1B,aAWwC,EAAE,CAJhD;AAIkE,WAAS;AAAG,kBAAgB;AAAM;AAGrG,CAAC;AAAe,YAAU;AAAU,OAAK;AAAG,UAAQ;AAAG,SAAO;AAAK,WAAS;AAAG,UAAQ;AAAY,gBAAc;AAAM;AACvH,CAAC;AAAmB,QAAM,KAAK,IAAI,SAAS,EAAE;AAAM;AACpD,CAAC;AAAoB,SAAO,KAAK,IAAI,UAAU,EAAE;AAAM;AACvD,CAzBC,KAyBK,CAlBC,OAkBO,CAFb;AAEgC,CAzBhC,KAyBsC,CAjBhC,aAiB8C,CADpD;AACyE,WAAS;AAAM;AACzF,IAAI,CAAC;AAAgB,UAAQ;AAAY,eAAa;AAAM;AAC5D,IAAI,CADC,cACc,CA3BlB;AA2B2B,cAAY;AAAM;AAO9C,CAAC;AAAgB,WAAS;AAAa,OAAK;AAAK,gBAAc;AAAK;AACpE,CAAC;AAAoB,WAAS;AAAa,eAAa;AAAQ,mBAAiB;AAAQ,SAAO;AAAM,UAAQ;AAAM,WAAS;AAAG,UAAQ;AAAM,iBAAe,IAAI;AAAc,cAAY;AAAM,SAAO,IAAI;AAAU,aAAW;AAAS,eAAa;AAAG,UAAQ;AAAS;AAC3Q,CADC,iBACiB,MAAM,KAAK;AAAa,SAAO,IAAI;AAAQ,cAAY,IAAI;AAAgB;AAC7F,CAFC,iBAEiB;AAAY,WAAS;AAAM,UAAQ;AAAS;","names":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wildwinter/app-shell",
3
- "version": "0.34.0",
3
+ "version": "0.34.1",
4
4
  "description": "The shared shell for the editor family (Patterpad, Storylet Studio): the app-agnostic design-token grammar, the per-entity colour hash, and the vanilla-TS DOM primitive. Two palettes, one grammar - each app supplies its own palette/fonts over these tokens.",
5
5
  "type": "module",
6
6
  "license": "MIT",