spaday-regular-layout 0.2.2__tar.gz → 0.2.3__tar.gz

{spaday_regular_layout-0.2.2 → spaday_regular_layout-0.2.3}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.5
 Name: spaday-regular-layout
-Version: 0.2.2
+Version: 0.2.3
 Summary: regular-layout for spaday
 Project-URL: Repository, https://github.com/1kbgz/spaday-regular-layout
 Project-URL: Homepage, https://github.com/1kbgz/spaday-regular-layout

{spaday_regular_layout-0.2.2 → spaday_regular_layout-0.2.3}/js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "spaday-regular-layout",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "description": "regular-layout for spaday",
   "repository": "git@github.com:1kbgz/spaday-regular-layout.git",
   "author": "1kbgz <dev@1kbgz.com>",

{spaday_regular_layout-0.2.2 → spaday_regular_layout-0.2.3}/js/src/css/spa.css

@@ -29,6 +29,19 @@ spaday-regular-layout.spa {
   --spa-rl-shadow: rgba(0, 0, 0, 0.05);
 }
 
+/* Structural, theme-independent (deliberately not gated on `.spa`): the engine's frame is
+ * a column flexbox whose titlebar (height: 24px, shrinkable) loses to the container's
+ * min-content floor when panel content is taller than the frame — the tabs collapse to
+ * zero height and the content paints where they were. Pin the titlebar and let the
+ * container shrink so tall content overflows inside the panel instead. */
+spaday-regular-layout regular-layout-frame::part(titlebar) {
+  flex-shrink: 0;
+}
+
+spaday-regular-layout regular-layout-frame::part(container) {
+  min-height: 0;
+}
+
 spaday-regular-layout.spa regular-layout-frame {
   --rl-tab-width: 200px;
 }
@@ -36,6 +49,7 @@ spaday-regular-layout.spa regular-layout-frame {
 /* Panel content chrome (only the selected frame's container is rendered). */
 spaday-regular-layout.spa regular-layout-frame::part(container) {
   box-sizing: border-box;
+  overflow: auto;
   margin: 0 3px 3px 3px;
   padding: 8px;
   /* Square top-left so the tab strip sits flush; rounded elsewhere. */

{spaday_regular_layout-0.2.2 → spaday_regular_layout-0.2.3}/js/tests/index.spec.js

@@ -285,3 +285,39 @@ test("locked layouts select tabs but do not drag-rearrange", async ({
   );
   expect(unlocked).not.toBe(before); // the same gesture rearranges once unlocked
 });
+
+test("tall panel content cannot crush the tab titlebar", async ({ page }) => {
+  await page.goto("/dist/index.html");
+  await page.evaluate(() => {
+    const layout = document.createElement("spaday-regular-layout");
+    layout.id = "tall-rig";
+    layout.className = "spa";
+    layout.style.cssText = "width:800px;height:300px";
+    const frame = document.createElement("regular-layout-frame");
+    frame.setAttribute("name", "chart");
+    const tall = document.createElement("div");
+    tall.style.cssText = "height:5000px";
+    frame.appendChild(tall);
+    layout.appendChild(frame);
+    layout.layout = { type: "tab-layout", tabs: ["chart"] };
+    document.body.appendChild(layout);
+  });
+  await expect(
+    page.locator('regular-layout-frame[name="chart"]'),
+  ).toBeVisible();
+  const r = await page.evaluate(() => {
+    const frame = document.querySelector('regular-layout-frame[name="chart"]');
+    const titlebar = frame.shadowRoot.querySelector('[part~="titlebar"]');
+    const container = frame.shadowRoot.querySelector('[part~="container"]');
+    const cr = container.getBoundingClientRect();
+    return {
+      titlebarHeight: titlebar.getBoundingClientRect().height,
+      containerBottom: cr.bottom,
+      frameBottom: frame.getBoundingClientRect().bottom,
+      scrolls: container.scrollHeight > container.clientHeight,
+    };
+  });
+  expect(r.titlebarHeight).toBe(24); // the min-content floor must not crush the tabs
+  expect(r.containerBottom).toBeLessThanOrEqual(r.frameBottom + 1);
+  expect(r.scrolls).toBe(true); // tall content scrolls inside the panel
+});

{spaday_regular_layout-0.2.2 → spaday_regular_layout-0.2.3}/pyproject.toml

@@ -13,7 +13,7 @@ authors = [
 description = "regular-layout for spaday"
 readme = "README.md"
 license = { text = "Apache-2.0" }
-version = "0.2.2"
+version = "0.2.3"
 requires-python = ">=3.11"
 keywords = []
 
@@ -75,7 +75,7 @@ Repository = "https://github.com/1kbgz/spaday-regular-layout"
 Homepage = "https://github.com/1kbgz/spaday-regular-layout"
 
 [tool.bumpversion]
-current_version = "0.2.2"
+current_version = "0.2.3"
 commit = true
 tag = true
 commit_args = "-s"

{spaday_regular_layout-0.2.2 → spaday_regular_layout-0.2.3}/spaday_regular_layout/__init__.py

@@ -4,7 +4,7 @@ from spaday import ComponentPackage
 
 from .components import RegularLayoutFrame, SpadayRegularLayout
 
-__version__ = "0.2.2"
+__version__ = "0.2.3"
 
 package = ComponentPackage(
     name="regular-layout",

spaday_regular_layout-0.2.3/spaday_regular_layout/extension/css/spa.css

@@ -0,0 +1 @@
+spaday-regular-layout.spa{--spa-rl-surface:var(--spa-surface,#fff);--spa-rl-surface-2:var(--spa-surface-2,#fafafa);--spa-rl-border:var(--spa-border,#e6e6e6);--spa-rl-muted:var(--spa-muted,#666);--spa-rl-shadow:#0000000d}:where(.wa-dark) spaday-regular-layout.spa{--spa-rl-surface:var(--spa-surface,#15191e);--spa-rl-surface-2:var(--spa-surface-2,#1d232b);--spa-rl-border:var(--spa-border,#333b45);--spa-rl-muted:var(--spa-muted,#9aa3ad);--spa-rl-shadow:#00000059}:where(.wa-light) spaday-regular-layout.spa{--spa-rl-surface:var(--spa-surface,#fff);--spa-rl-surface-2:var(--spa-surface-2,#fafafa);--spa-rl-border:var(--spa-border,#e6e6e6);--spa-rl-muted:var(--spa-muted,#666);--spa-rl-shadow:#0000000d}spaday-regular-layout regular-layout-frame::part(titlebar){flex-shrink:0}spaday-regular-layout regular-layout-frame::part(container){min-height:0}spaday-regular-layout.spa regular-layout-frame{--rl-tab-width:200px}spaday-regular-layout.spa regular-layout-frame::part(container){box-sizing:border-box;border:1px solid var(--spa-rl-border);background:var(--spa-rl-surface);box-shadow:0 1px 2px var(--spa-rl-shadow);border-radius:0 8px 8px;margin:0 3px 3px;padding:8px;overflow:auto}spaday-regular-layout.spa regular-layout-frame::part(titlebar){align-items:end;margin:3px 6px 0 3px}spaday-regular-layout.spa regular-layout-frame::part(tab){box-sizing:border-box;cursor:pointer;border:1px solid var(--spa-rl-border);background:var(--spa-rl-surface-2);color:var(--spa-rl-muted);border-bottom:none;border-radius:8px 8px 0 0;justify-content:center;align-items:center;margin-right:2px;padding:0 10px;font-size:12px}spaday-regular-layout.spa regular-layout-frame::part(title){text-overflow:ellipsis;white-space:nowrap;overflow:hidden}spaday-regular-layout.spa regular-layout-frame::part(active-tab){background:var(--spa-rl-surface);color:inherit}spaday-regular-layout.spa regular-layout-frame::part(close){color:var(--spa-rl-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;align-self:center;width:16px;height:14px;padding:0;font-size:13px;line-height:13px}spaday-regular-layout.spa regular-layout-frame::part(close):before{content:"×"}spaday-regular-layout.spa regular-layout-frame::part(close):hover{background-color:var(--spa-rl-surface-2);transition:background-color .2s}spaday-regular-layout.spa:has(.overlay)>*{opacity:.6}spaday-regular-layout.spa:has(.overlay)>.overlay{opacity:1}spaday-regular-layout.spa regular-layout-frame.overlay{background:var(--spa-rl-surface-2);border:1px dashed var(--spa-rl-border);border-radius:8px;transition:top .1s ease-in-out,height .1s ease-in-out,width .1s ease-in-out,left .1s ease-in-out}

spaday_regular_layout-0.2.2/spaday_regular_layout/extension/css/spa.css

@@ -1 +0,0 @@
-spaday-regular-layout.spa{--spa-rl-surface:var(--spa-surface,#fff);--spa-rl-surface-2:var(--spa-surface-2,#fafafa);--spa-rl-border:var(--spa-border,#e6e6e6);--spa-rl-muted:var(--spa-muted,#666);--spa-rl-shadow:#0000000d}:where(.wa-dark) spaday-regular-layout.spa{--spa-rl-surface:var(--spa-surface,#15191e);--spa-rl-surface-2:var(--spa-surface-2,#1d232b);--spa-rl-border:var(--spa-border,#333b45);--spa-rl-muted:var(--spa-muted,#9aa3ad);--spa-rl-shadow:#00000059}:where(.wa-light) spaday-regular-layout.spa{--spa-rl-surface:var(--spa-surface,#fff);--spa-rl-surface-2:var(--spa-surface-2,#fafafa);--spa-rl-border:var(--spa-border,#e6e6e6);--spa-rl-muted:var(--spa-muted,#666);--spa-rl-shadow:#0000000d}spaday-regular-layout.spa regular-layout-frame{--rl-tab-width:200px}spaday-regular-layout.spa regular-layout-frame::part(container){box-sizing:border-box;border:1px solid var(--spa-rl-border);background:var(--spa-rl-surface);box-shadow:0 1px 2px var(--spa-rl-shadow);border-radius:0 8px 8px;margin:0 3px 3px;padding:8px}spaday-regular-layout.spa regular-layout-frame::part(titlebar){align-items:end;margin:3px 6px 0 3px}spaday-regular-layout.spa regular-layout-frame::part(tab){box-sizing:border-box;cursor:pointer;border:1px solid var(--spa-rl-border);background:var(--spa-rl-surface-2);color:var(--spa-rl-muted);border-bottom:none;border-radius:8px 8px 0 0;justify-content:center;align-items:center;margin-right:2px;padding:0 10px;font-size:12px}spaday-regular-layout.spa regular-layout-frame::part(title){text-overflow:ellipsis;white-space:nowrap;overflow:hidden}spaday-regular-layout.spa regular-layout-frame::part(active-tab){background:var(--spa-rl-surface);color:inherit}spaday-regular-layout.spa regular-layout-frame::part(close){color:var(--spa-rl-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;align-self:center;width:16px;height:14px;padding:0;font-size:13px;line-height:13px}spaday-regular-layout.spa regular-layout-frame::part(close):before{content:"×"}spaday-regular-layout.spa regular-layout-frame::part(close):hover{background-color:var(--spa-rl-surface-2);transition:background-color .2s}spaday-regular-layout.spa:has(.overlay)>*{opacity:.6}spaday-regular-layout.spa:has(.overlay)>.overlay{opacity:1}spaday-regular-layout.spa regular-layout-frame.overlay{background:var(--spa-rl-surface-2);border:1px dashed var(--spa-rl-border);border-radius:8px;transition:top .1s ease-in-out,height .1s ease-in-out,width .1s ease-in-out,left .1s ease-in-out}