spaday-regular-layout 0.2.3__tar.gz → 0.2.4__tar.gz
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.
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/PKG-INFO +1 -1
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/package.json +1 -1
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/src/ts/index.ts +9 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/tests/index.spec.js +29 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/pyproject.toml +2 -2
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/spaday_regular_layout/__init__.py +1 -1
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/spaday_regular_layout/components.cem.json +35 -4
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/spaday_regular_layout/extension/cdn/index.js +5 -5
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/spaday_regular_layout/extension/cdn/index.js.map +3 -3
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/.gitignore +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/LICENSE +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/README.md +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/.oxfmtrc.json +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/.oxlintrc.json +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/build.mjs +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/playwright.config.js +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/pnpm-lock.yaml +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/pnpm-workspace.yaml +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/src/css/index.css +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/src/css/spa.css +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/src/html/index.html +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/src/ts/css.d.ts +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/src/ts/define-guard.ts +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/tools/bundle.mjs +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/tools/css.mjs +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/tools/externals.mjs +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/tools/getarg.mjs +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/tools/html.mjs +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/js/tsconfig.json +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/spaday_regular_layout/components.py +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/spaday_regular_layout/example.py +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/spaday_regular_layout/extension/css/index.css +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/spaday_regular_layout/extension/css/lorax.css +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/spaday_regular_layout/extension/css/spa.css +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/spaday_regular_layout/extension/index.html +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/spaday_regular_layout/tests/test_all.py +0 -0
- {spaday_regular_layout-0.2.3 → spaday_regular_layout-0.2.4}/spaday_regular_layout/tests/test_example.py +0 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
Metadata-Version: 2.5
|
|
2
2
|
Name: spaday-regular-layout
|
|
3
|
-
Version: 0.2.
|
|
3
|
+
Version: 0.2.4
|
|
4
4
|
Summary: regular-layout for spaday
|
|
5
5
|
Project-URL: Repository, https://github.com/1kbgz/spaday-regular-layout
|
|
6
6
|
Project-URL: Homepage, https://github.com/1kbgz/spaday-regular-layout
|
|
@@ -59,6 +59,15 @@ export class SpadayRegularLayout extends BaseRegularLayout {
|
|
|
59
59
|
return this.save();
|
|
60
60
|
}
|
|
61
61
|
|
|
62
|
+
/** Insert `name` if it is not laid out yet, then select it — the one-call "open this tab",
|
|
63
|
+
* made for spaday's `Invoke` action:
|
|
64
|
+
* `Invoke(by_id("layout"), "openPanel", event_prop("currentTarget.dataset.tab"))`. */
|
|
65
|
+
async openPanel(name: string): Promise<void> {
|
|
66
|
+
if (!name) return;
|
|
67
|
+
if (this.calculatePath(name) === null) await this.insertPanel(name);
|
|
68
|
+
await this.select(name);
|
|
69
|
+
}
|
|
70
|
+
|
|
62
71
|
set layout(value: Layout | null) {
|
|
63
72
|
if (!value) return;
|
|
64
73
|
if (this.isConnected) {
|
|
@@ -321,3 +321,32 @@ test("tall panel content cannot crush the tab titlebar", async ({ page }) => {
|
|
|
321
321
|
expect(r.containerBottom).toBeLessThanOrEqual(r.frameBottom + 1);
|
|
322
322
|
expect(r.scrolls).toBe(true); // tall content scrolls inside the panel
|
|
323
323
|
});
|
|
324
|
+
|
|
325
|
+
test("openPanel inserts a missing panel and selects an existing one", async ({
|
|
326
|
+
page,
|
|
327
|
+
}) => {
|
|
328
|
+
await page.goto("/dist/index.html");
|
|
329
|
+
const r = await page.evaluate(async () => {
|
|
330
|
+
const layout = document.createElement("spaday-regular-layout");
|
|
331
|
+
layout.style.cssText = "width:600px;height:300px";
|
|
332
|
+
for (const name of ["home", "extra"]) {
|
|
333
|
+
const frame = document.createElement("regular-layout-frame");
|
|
334
|
+
frame.setAttribute("name", name);
|
|
335
|
+
frame.textContent = name;
|
|
336
|
+
layout.appendChild(frame);
|
|
337
|
+
}
|
|
338
|
+
layout.layout = { type: "tab-layout", tabs: ["home"] };
|
|
339
|
+
document.body.appendChild(layout);
|
|
340
|
+
await new Promise((resolve) => requestAnimationFrame(resolve));
|
|
341
|
+
|
|
342
|
+
await layout.openPanel("extra"); // not laid out yet: inserted, then selected
|
|
343
|
+
const afterInsert = layout.save();
|
|
344
|
+
await layout.openPanel("home"); // already present: selected only, no duplicate
|
|
345
|
+
const afterSelect = layout.save();
|
|
346
|
+
return { afterInsert, afterSelect };
|
|
347
|
+
});
|
|
348
|
+
expect([...r.afterInsert.tabs].sort()).toEqual(["extra", "home"]);
|
|
349
|
+
expect(r.afterInsert.tabs[r.afterInsert.selected]).toBe("extra"); // inserted and selected
|
|
350
|
+
expect([...r.afterSelect.tabs].sort()).toEqual(["extra", "home"]); // no duplicate insert
|
|
351
|
+
expect(r.afterSelect.tabs[r.afterSelect.selected]).toBe("home"); // selected only
|
|
352
|
+
});
|
|
@@ -13,7 +13,7 @@ authors = [
|
|
|
13
13
|
description = "regular-layout for spaday"
|
|
14
14
|
readme = "README.md"
|
|
15
15
|
license = { text = "Apache-2.0" }
|
|
16
|
-
version = "0.2.
|
|
16
|
+
version = "0.2.4"
|
|
17
17
|
requires-python = ">=3.11"
|
|
18
18
|
keywords = []
|
|
19
19
|
|
|
@@ -75,7 +75,7 @@ Repository = "https://github.com/1kbgz/spaday-regular-layout"
|
|
|
75
75
|
Homepage = "https://github.com/1kbgz/spaday-regular-layout"
|
|
76
76
|
|
|
77
77
|
[tool.bumpversion]
|
|
78
|
-
current_version = "0.2.
|
|
78
|
+
current_version = "0.2.4"
|
|
79
79
|
commit = true
|
|
80
80
|
tag = true
|
|
81
81
|
commit_args = "-s"
|
|
@@ -13,11 +13,36 @@
|
|
|
13
13
|
"attributes": [
|
|
14
14
|
{
|
|
15
15
|
"name": "layout",
|
|
16
|
-
"type": {
|
|
16
|
+
"type": {
|
|
17
|
+
"text": "unknown"
|
|
18
|
+
},
|
|
17
19
|
"description": "Serializable regular-layout split/tab tree."
|
|
18
20
|
}
|
|
19
21
|
],
|
|
20
|
-
"slots": [
|
|
22
|
+
"slots": [
|
|
23
|
+
{
|
|
24
|
+
"name": ""
|
|
25
|
+
}
|
|
26
|
+
],
|
|
27
|
+
"methods": [
|
|
28
|
+
{
|
|
29
|
+
"name": "openPanel",
|
|
30
|
+
"description": "Insert `name` if it is not laid out yet, then select it \u2014 the one-call \"open this tab\", made for spaday's Invoke action.",
|
|
31
|
+
"parameters": [
|
|
32
|
+
{
|
|
33
|
+
"name": "name",
|
|
34
|
+
"type": {
|
|
35
|
+
"text": "string"
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
],
|
|
39
|
+
"return": {
|
|
40
|
+
"type": {
|
|
41
|
+
"text": "Promise<void>"
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
]
|
|
21
46
|
},
|
|
22
47
|
{
|
|
23
48
|
"kind": "class",
|
|
@@ -28,11 +53,17 @@
|
|
|
28
53
|
"attributes": [
|
|
29
54
|
{
|
|
30
55
|
"name": "name",
|
|
31
|
-
"type": {
|
|
56
|
+
"type": {
|
|
57
|
+
"text": "string"
|
|
58
|
+
},
|
|
32
59
|
"description": "Panel name referenced by the layout tree."
|
|
33
60
|
}
|
|
34
61
|
],
|
|
35
|
-
"slots": [
|
|
62
|
+
"slots": [
|
|
63
|
+
{
|
|
64
|
+
"name": ""
|
|
65
|
+
}
|
|
66
|
+
]
|
|
36
67
|
}
|
|
37
68
|
]
|
|
38
69
|
}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
var $=customElements.define.bind(customElements);customElements.define=(t,e,i)=>{customElements.get(t)||$(t,e,i)};function U(){customElements.define=$}var
|
|
2
|
-
`)}let s=a=>a.slice(0,-1).map((h,p)=>a[p+1]-h).map(h=>`${i.SHOULD_ROUND?Math.round(h*100):h*100}fr`).join(" "),r=I(t,"horizontal",0,1,i),n=s(r),o=I(t,"vertical",0,1,i),l=s(o),c=(a,h)=>h-a===1?`${a+1}`:`${a+1} / ${h+1}`,u=
|
|
1
|
+
var $=customElements.define.bind(customElements);customElements.define=(t,e,i)=>{customElements.get(t)||$(t,e,i)};function U(){customElements.define=$}var P={type:"split-layout",orientation:"horizontal",sizes:[],children:[]},g=Object.freeze({CUSTOM_EVENT_NAME_PREFIX:"regular-layout",CHILD_ATTRIBUTE_NAME:"name",MIN_DRAG_DISTANCE:10,SHOULD_ROUND:!1,OVERLAY_CLASSNAME:"overlay",MINIMUM_REDISTRIBUTION_SIZE_THRESHOLD:.15,SPLIT_EDGE_TOLERANCE:.33,SPLIT_ROOT_EDGE_TOLERANCE:.03,GRID_TRACK_COLLAPSE_TOLERANCE:.001,OVERLAY_DEFAULT:"absolute",GRID_DIVIDER_SIZE:6,GRID_DIVIDER_CHECK_TARGET:!0});function X(t,e,i){return(e.length===0||Math.abs(i-e[e.length-1])>t.GRID_TRACK_COLLAPSE_TOLERANCE)&&e.push(i),e}function K(t,e){return e.sort((i,s)=>i-s).reduce(X.bind(void 0,t),[])}function I(t,e,i,s,r){if(t.type==="tab-layout")return[i,s];let n=[i,s];if(t.orientation===e){let o=i,l=s-i;for(let c=0;c<t.children.length;c++){let u=t.sizes[c],d=o+u*l;n.push(...I(t.children[c],e,o,d,r)),o=d}}else for(let o of t.children)n.push(...I(o,e,i,s,r));return K(r,n)}function m(t,e,i){let s=e.findIndex(r=>Math.abs(r-i)<t.GRID_TRACK_COLLAPSE_TOLERANCE);return s===-1?0:s}function z(t,e,i,s,r,n,o,l){if(t.type==="tab-layout"){let f=t.selected??0,E=m(l,e,s),b=m(l,e,r),D=m(l,i,n),V=m(l,i,o);return t.tabs.map((j,q)=>({child:j,colStart:E,colEnd:b,rowStart:D,rowEnd:V,zIndex:t.tabs.length>1&&q===f?1:void 0}))}let{children:c,sizes:u,orientation:d}=t,a=d==="horizontal",h=a?s:n,p=a?r-s:o-n,y=[];for(let f=0;f<c.length;f++){let E=h+u[f]*p;a?y.push(...z(c[f],e,i,h,E,n,o,l)):y.push(...z(c[f],e,i,s,r,h,E,l)),h=E}return y}var O=(t,e)=>`:host ::slotted(*){display:none}:host{display:grid;grid-template-rows:${t};grid-template-columns:${e}}`,C=(t,e,i,s,r)=>`:host ::slotted([${t.CHILD_ATTRIBUTE_NAME}="${e}"]){display:flex;grid-column:${s};grid-row:${i}${r===void 0?"":`;z-index:${r}`}}`;function v(t,e,i=g){if(t.type==="tab-layout"){let a=t.selected??0,h=t.tabs.length>1;return[O("100%","100%"),...t.tabs.map((p,y)=>C(i,p,"1","1",h&&y===a?1:void 0))].join(`
|
|
2
|
+
`)}let s=a=>a.slice(0,-1).map((h,p)=>a[p+1]-h).map(h=>`${i.SHOULD_ROUND?Math.round(h*100):h*100}fr`).join(" "),r=I(t,"horizontal",0,1,i),n=s(r),o=I(t,"vertical",0,1,i),l=s(o),c=(a,h)=>h-a===1?`${a+1}`:`${a+1} / ${h+1}`,u=z(t,r,o,0,1,0,1,i),d=[O(l,n)];for(let a of u){let h=c(a.colStart,a.colEnd),p=c(a.rowStart,a.rowEnd);d.push(C(i,a.child,p,h,a.zIndex)),a.child===e?.[1]&&(d.push(C(i,e[0],p,h)),d.push(`:host ::slotted([${i.CHILD_ATTRIBUTE_NAME}=${e[0]}]){z-index:2}`))}return d.join(`
|
|
3
3
|
`)}function Y(t,e=g){return[O("100%","100%"),C(e,t,"1","1")].join(`
|
|
4
|
-
`)}var Z={row_start:0,row_end:1,col_start:0,col_end:1};function _(t,e,i,s=null){return H(t,e,i,s)}function H(t,e,i,s,r=null,n=structuredClone(Z),o=[]){if(t<0||e<0||t>1||e>1)return null;if(i.type==="tab-layout"){let y=i.selected??0,f=n.col_end-n.col_start,E=n.row_end-n.row_start;return{type:"layout-path",layout:i,slot:i.tabs[y],path:o,view_window:n,is_edge:!1,column:t,row:e,column_offset:(t-n.col_start)/f,row_offset:(e-n.row_start)/E,orientation:r||"horizontal"}}let l=i.orientation==="vertical",c=l?e:t,u=l?"row_start":"col_start",d=l?"row_end":"col_end",a=l?s?.rect?.height:s?.rect?.width,h=n[u],p=n[d]-n[u];for(let y=0;y<i.children.length;y++){let f=h+p*i.sizes[y];if(s&&a){let E=s.size/a;if(Math.abs(c-f)<E)return{path:[...o,y],type:i.orientation,view_window:{...n,[u]:h,[d]:f}}}if(c>=h&&(c<f||y===i.children.length-1))return H(t,e,i.children[y],s,i.orientation,{...n,[u]:h,[d]:f},[...o,y]);h=f}return null}function R(t,e){if(t.type==="tab-layout"){if(t.tabs.includes(e)){let o=t.tabs.filter(l=>l!==e);return o.length===0?structuredClone(
|
|
5
|
-
`))}},p);let y=`${r.physics.CUSTOM_EVENT_NAME_PREFIX}-before-update`,f=new CustomEvent(y,{detail:n});r.dispatchEvent(f)}async clear(t,{slot:e,layout:i},s=this.d.physics.OVERLAY_CLASSNAME){let r=this.d,n=R(r.panel,e),o=`:scope > [${r.physics.CHILD_ATTRIBUTE_NAME}="${e}"]`,l=r.querySelector(o);if(t===null){await r.restore(i);return}let[c,u,d]=r.relativeCoordinates(t,!1),a=_(c,u,n);if(a&&(a=G(c,u,n,e,a,d,r.physics)),a){let h=a?.is_edge?a.orientation:void 0,p=w(n,e,a.path,h);await r.restore(p)}else await r.restore(i);l&&l.classList.remove(s)}},N=class extends HTMLElement{i;t;s;u;h;l;r;e;c;_;p;E;constructor(){super(),this.e=g,this.t=structuredClone(
|
|
4
|
+
`)}var Z={row_start:0,row_end:1,col_start:0,col_end:1};function _(t,e,i,s=null){return H(t,e,i,s)}function H(t,e,i,s,r=null,n=structuredClone(Z),o=[]){if(t<0||e<0||t>1||e>1)return null;if(i.type==="tab-layout"){let y=i.selected??0,f=n.col_end-n.col_start,E=n.row_end-n.row_start;return{type:"layout-path",layout:i,slot:i.tabs[y],path:o,view_window:n,is_edge:!1,column:t,row:e,column_offset:(t-n.col_start)/f,row_offset:(e-n.row_start)/E,orientation:r||"horizontal"}}let l=i.orientation==="vertical",c=l?e:t,u=l?"row_start":"col_start",d=l?"row_end":"col_end",a=l?s?.rect?.height:s?.rect?.width,h=n[u],p=n[d]-n[u];for(let y=0;y<i.children.length;y++){let f=h+p*i.sizes[y];if(s&&a){let E=s.size/a;if(Math.abs(c-f)<E)return{path:[...o,y],type:i.orientation,view_window:{...n,[u]:h,[d]:f}}}if(c>=h&&(c<f||y===i.children.length-1))return H(t,e,i.children[y],s,i.orientation,{...n,[u]:h,[d]:f},[...o,y]);h=f}return null}function R(t,e){if(t.type==="tab-layout"){if(t.tabs.includes(e)){let o=t.tabs.filter(l=>l!==e);return o.length===0?structuredClone(P):{type:"tab-layout",tabs:o}}return structuredClone(t)}let i=structuredClone(t),s=i.children.findIndex(o=>o.type==="tab-layout"?o.tabs.includes(e):!1);if(s!==-1){let o=i.children[s];if(o.tabs.length===1){let l=i.children.filter((u,d)=>d!==s),c=Q(i.sizes,s);if(l.length===1)return l[0];i.children=l,i.sizes=c}else o.tabs.splice(o.tabs.indexOf(e),1),o.selected&&o.selected>=o.tabs.length&&o.selected--;return i}let r=!1,n=i.children.map(o=>{if(o.type==="split-layout"){let l=R(o,e);return l!==o&&(r=!0),l}return o});return r&&(i.children=n),i}function Q(t,e){let i=[],s=t[e],r=0;for(let n=0;n<t.length;n++)n!==e&&(r+=t[n]);for(let n=0;n<t.length;n++)if(n!==e){let o=t[n]/r;i.push(t[n]+s*o)}return i}function w(t,e,i,s){let r=a=>({type:"tab-layout",tabs:[a]});if(i.length===0){if(t.type==="tab-layout")return{type:"tab-layout",tabs:[e,...t.tabs]};if(s)return{type:"split-layout",orientation:s,children:[r(e),t],sizes:[.5,.5]};{let a=[...t.children,r(e)],h=[...t.sizes,1/(a.length-1)];return{...t,children:a,sizes:T(h)}}}let[n,...o]=i;if(s&&o.length===0){if(t.type==="split-layout"&&t.orientation===s){let h=[...t.children];h.splice(n,0,r(e));let p=[...t.sizes];return p.splice(n,0,1/(h.length-1)),{...t,children:h,sizes:T(p)}}let a=n===0?[r(e),t]:[t,r(e)];return{type:"split-layout",orientation:s,children:a,sizes:[.5,.5]}}if(t.type==="tab-layout"){if(o.length===0&&s===void 0&&n>=0&&n<=t.tabs.length){let a=[...t.tabs];return a.splice(n,0,e),{...t,tabs:a}}return w({type:"split-layout",orientation:s||"horizontal",children:[t],sizes:[1]},e,i,s)}if(o.length===0||n===t.children.length){if(s&&t.children[n]){let p={type:"split-layout",orientation:s,children:[r(e),t.children[n]],sizes:[.5,.5]},y=[...t.children];return y[n]=p,{...t,children:y,sizes:T(t.sizes)}}let a=[...t.children];a.splice(n,0,r(e));let h=[...t.sizes];return h.splice(n,0,1/(a.length-1)),{...t,children:a,sizes:T(h)}}let l=t.children[n],c=l.type==="tab-layout"&&o.length>0&&s!==void 0?t.orientation==="horizontal"?"vertical":"horizontal":s,u=w(l,e,o,c),d=[...t.children];return d[n]=u,{...t,children:d}}function T(t){let e=t.reduce((i,s)=>i+s,0);return t.map(i=>i/e)}function A(t,e,i,s=g){let r=structuredClone(t),n=r,o={horizontal:i||0,vertical:i||0};for(let l=0;l<e.length-1;l++)n.type==="split-layout"&&(o[n.orientation]/=n.sizes[e[l]],n=n.children[e[l]]);if(n.type==="split-layout")if(i===void 0)n.sizes=n.sizes.map(l=>1/n.sizes.length);else{let l=o[n.orientation],c=e[e.length-1];c<n.sizes.length-1&&(n.sizes=J(s,n.sizes,c,l))}return r}function J(t,e,i,s){let r=[...e],n=0;for(let l=0;l<=i;l++)n+=e[l];let o=0;for(let l=i+1;l<e.length;l++)o+=e[l];s=Math.sign(s)*Math.min(Math.abs(s),(1-t.MINIMUM_REDISTRIBUTION_SIZE_THRESHOLD)*(s>0?n:o));for(let l=0;l<=i;l++){let c=e[l]/n;r[l]=e[l]-s*c}for(let l=i+1;l<e.length;l++){let c=e[l]/o;r[l]=e[l]+s*c}return r}function k(t,e,i,s){let r=parseFloat(i.paddingLeft),n=parseFloat(i.paddingTop),o=e.width-r-parseFloat(i.paddingRight),l=e.height-n-parseFloat(i.paddingBottom),c=r+t.col_start*o,u=n+t.row_start*l,d=(t.col_end-t.col_start)*o,a=(t.row_end-t.row_start)*l;if(s){let h=parseFloat(s.marginTop),p=parseFloat(s.marginRight),y=parseFloat(s.marginBottom),f=parseFloat(s.marginLeft);d-=f+p,a-=h+y}return{x:c,y:u,width:d,height:a}}function W(t,e,i,s,r=g,n){if(!s)return`:host ::slotted([${r.CHILD_ATTRIBUTE_NAME}="${t}"]){display:none;}`;let o=k(s.view_window,e,i,n),l=`display:flex;position:absolute!important;z-index:2;top:${o.y}px;left:${o.x}px;height:${o.height}px;width:${o.width}px;`;return`::slotted([${r.CHILD_ATTRIBUTE_NAME}="${t}"]){${l}}`}function M(t){if(t.type==="tab-layout")return t.selected=t.selected||0,t;let e=[],i=[];for(let s=0;s<t.children.length;s++){let r=t.children[s],n=t.sizes[s],o=M(r);if(o.type==="split-layout"&&o.orientation===t.orientation)for(let l=0;l<o.children.length;l++)e.push(o.children[l]),i.push(o.sizes[l]*n);else e.push(o),i.push(n)}return e.length===1?e[0]:{type:"split-layout",orientation:t.orientation,children:e,sizes:i}}function tt(t,e){return F(t,e,[])}function F(t,e,i){if(e.type==="tab-layout")return e.tabs.includes(t)?i:null;for(let s=0;s<e.children.length;s++){let r=F(t,e.children[s],[...i,s]);if(r)return r}return null}function et(t){let e={};return B(t,e,[],null,{row_start:0,row_end:1,col_start:0,col_end:1}),e}function B(t,e,i,s,r){if(t.type==="tab-layout"){let d=t.selected??0,a=t.tabs[d],h=(r.col_start+r.col_end)/2,p=(r.row_start+r.row_end)/2;e[a]={type:"layout-path",layout:t,slot:a,path:i,view_window:r,is_edge:!1,column:h,row:p,column_offset:.5,row_offset:.5,orientation:s||"horizontal"};return}let n=t.orientation==="vertical",o=n?"row_start":"col_start",l=n?"row_end":"col_end",c=r[o],u=r[l]-r[o];for(let d=0;d<t.children.length;d++){let a=c+u*t.sizes[d],h={...r,[o]:c,[l]:a};B(t.children[d],e,[...i,d],t.orientation,h),c=a}}var it=class{constructor(t,e,i){this.S=t,this.T=e,this.g=i}#e=!1;#t=null;#i=null;async run(t,e,i){if(this.#e){this.#t={layout:t,fn:e,overlay:i};return}this.#e=!0;try{for(await this.#s(t,e,i);this.#t;){let{layout:s,fn:r,overlay:n}=this.#t;this.#t=null,await this.#s(s,r,n)}}finally{this.#e=!1}}resume(){if(this.#i){let t=this.#i;this.#i=null,t()}}async#s(t,e,i){this.g?.();let s={calculatePresizePaths:()=>et(t),overlay:i},r=new CustomEvent(this.T,{cancelable:!0,detail:s});this.S.dispatchEvent(r)||await new Promise(n=>{this.#i=n}),e()}};function G(t,e,i,s,r,n,o=g){if(t<o.SPLIT_ROOT_EDGE_TOLERANCE)return L(i,s,r,[0],!0,"horizontal");if(t>1-o.SPLIT_ROOT_EDGE_TOLERANCE)return L(i,s,r,r.path.length>0?r.path:[1],!1,"horizontal");if(e<o.SPLIT_ROOT_EDGE_TOLERANCE)return L(i,s,r,[0],!0,"vertical");if(e>1-o.SPLIT_ROOT_EDGE_TOLERANCE)return L(i,s,r,r.path.length>0?r.path:[1],!1,"vertical");let l=r.column_offset<o.SPLIT_EDGE_TOLERANCE||r.column_offset>1-o.SPLIT_EDGE_TOLERANCE,c=r.row_offset<o.SPLIT_EDGE_TOLERANCE||r.row_offset>1-o.SPLIT_EDGE_TOLERANCE;if(l&&c){let u=Math.abs(r.column_offset-.5),d=Math.abs(r.row_offset-.5),a=(n?.width||1)*(r.view_window.col_end-r.view_window.col_start),h=(n?.height||1)*(r.view_window.row_end-r.view_window.row_start),p=a/2-u*a<h/2-d*h;return S(i,s,r,p?r.column_offset<o.SPLIT_EDGE_TOLERANCE:r.row_offset<o.SPLIT_EDGE_TOLERANCE,p?"horizontal":"vertical")}return l?S(i,s,r,r.column_offset<o.SPLIT_EDGE_TOLERANCE,"horizontal"):c?S(i,s,r,r.row_offset<o.SPLIT_EDGE_TOLERANCE,"vertical"):{...r,path:[...r.path,0]}}function L(t,e,i,s,r,n){return S(t,e,{...i,path:s,orientation:n},r,n)}function S(t,e,i,s,r){let n;if(i.orientation===r)if(i.path.length===0)n=[s?0:1];else{let c=i.path[i.path.length-1];n=[...i.path.slice(0,-1),s?c:c+1]}else n=[...i.path,s?0:1];let o=w(t,e,n,r),l=st(o,n);return{...i,path:n,slot:i.slot,is_edge:!0,orientation:r,view_window:l}}function st(t,e){let i={row_start:0,row_end:1,col_start:0,col_end:1},s=t;for(let r of e){if(s.type==="tab-layout")break;let n=Math.min(r,s.children.length-1),o=s.orientation==="vertical",l=o?"row_start":"col_start",c=o?"row_end":"col_end",u=i[c]-i[l],d=s.sizes.slice(0,n).reduce((a,h)=>a+h*u,i[l]);i={...i,[l]:d,[c]:d+u*s.sizes[n]},s=s.children[n]}return i}var rt=class{constructor(t){this.d=t}async set(t,{slot:e},i=this.d.physics.OVERLAY_CLASSNAME,s=this.d.physics.OVERLAY_DEFAULT){let r=this.d,n=R(r.panel,e),o=`:scope > [${r.physics.CHILD_ATTRIBUTE_NAME}="${e}"]`,l=r.querySelector(o);l&&l.classList.add(i);let[c,u,d,a]=r.relativeCoordinates(t,!0),h=_(c,u,n);h&&(h=G(c,u,n,e,h,d,r.physics));let p=h?{slot:e,path:h}:null;await r.presizeQueue.run(n,()=>{if(s==="grid"&&h){let E=[e,h?.slot],b=v(n,E,r.physics);r.stylesheet.replaceSync(b)}else if(s==="absolute"){let E=v(n,void 0,r.physics);for(;l?.tagName==="SLOT"&&l;)l=l.assignedElements()[0];let b=l?getComputedStyle(l):void 0,D=W(e,d,a,h,r.physics,b);r.stylesheet.replaceSync([E,D].join(`
|
|
5
|
+
`))}},p);let y=`${r.physics.CUSTOM_EVENT_NAME_PREFIX}-before-update`,f=new CustomEvent(y,{detail:n});r.dispatchEvent(f)}async clear(t,{slot:e,layout:i},s=this.d.physics.OVERLAY_CLASSNAME){let r=this.d,n=R(r.panel,e),o=`:scope > [${r.physics.CHILD_ATTRIBUTE_NAME}="${e}"]`,l=r.querySelector(o);if(t===null){await r.restore(i);return}let[c,u,d]=r.relativeCoordinates(t,!1),a=_(c,u,n);if(a&&(a=G(c,u,n,e,a,d,r.physics)),a){let h=a?.is_edge?a.orientation:void 0,p=w(n,e,a.path,h);await r.restore(p)}else await r.restore(i);l&&l.classList.remove(s)}},N=class extends HTMLElement{i;t;s;u;h;l;r;e;c;_;p;E;constructor(){super(),this.e=g,this.t=structuredClone(P),this.i=this.attachShadow({mode:"open"}),this.i.innerHTML="<slot></slot>",this.s=new CSSStyleSheet,this.u=new CSSStyleSheet,this.l=!1;let t=`${this.e.CUSTOM_EVENT_NAME_PREFIX}-before-resize`;this.c=new it(this,t,()=>{this.r=void 0}),this._=new rt(this.create_overlay_host()),this.i.adoptedStyleSheets=[this.s,this.u]}connectedCallback(){this.E??=new ResizeObserver(()=>{this.r=void 0}),this.E.observe(this),this.addEventListener("dblclick",this.onDblClick),this.addEventListener("pointerdown",this.onPointerDown),this.addEventListener("pointerup",this.onPointerUp),this.addEventListener("pointermove",this.onPointerMove)}disconnectedCallback(){this.E?.disconnect(),this.removeEventListener("dblclick",this.onDblClick),this.removeEventListener("pointerdown",this.onPointerDown),this.removeEventListener("pointerup",this.onPointerUp),this.removeEventListener("pointermove",this.onPointerMove)}calculateIntersect=t=>{let[e,i,s]=this.relativeCoordinates(t,!1);return _(e,i,this.t)};calculatePath=t=>tt(t,this.t);setOverlayState=async(t,e,i,s)=>{await this._.set(t,e,i,s)};clearOverlayState=async(t,e,i)=>{await this._.clear(t,e,i)};insertPanel=async(t,e=[],i)=>{let s;typeof i=="boolean"&&i?s="horizontal":typeof i=="string"&&(s=i),await this.restore(w(this.t,t,e,s))};removePanel=async t=>{await this.restore(R(this.t,t))};select=async t=>{let e=this.save(),i=this.getPanel(t,e);if(!i)return;let s=i.tabs.indexOf(t);s!==-1&&i.selected!==s&&(i.selected=s,await this.restore(e));let r=`${this.e.CUSTOM_EVENT_NAME_PREFIX}-select`;this.dispatchEvent(new CustomEvent(r,{detail:{name:t}}))};getPanel=(t,e=this.t)=>{if(e.type==="tab-layout")return e.tabs.includes(t)?e:null;for(let i of e.children){let s=this.getPanel(t,i);if(s)return s}return null};clear=async()=>{await this.restore(P)};maximize=async t=>{if(!this.getPanel(t))return;let e={type:"tab-layout",tabs:[t],selected:0};await this.c.run(e,()=>{this.p=t,this.s.replaceSync(Y(t,this.e))})};minimize=async()=>{this.p!==void 0&&await this.c.run(this.t,()=>{this.p=void 0,this.s.replaceSync(v(this.t,void 0,this.e))})};restoreSync=(t,e=!1)=>{this.r=void 0,this.p=void 0,this.t=e?t:M(t);let i=v(this.t,void 0,this.e);this.s.replaceSync(i);let s=`${this.e.CUSTOM_EVENT_NAME_PREFIX}-update`,r=new CustomEvent(s,{detail:this.t});this.dispatchEvent(r)};restore=async(t,e=!1)=>{let i=e?t:M(t);await this.c.run(i,()=>{this.p=void 0,this.t=i;let s=v(this.t,void 0,this.e);this.s.replaceSync(s);let r=`${this.e.CUSTOM_EVENT_NAME_PREFIX}-update`,n=new CustomEvent(r,{detail:this.t});this.dispatchEvent(n)})};resumeResize=()=>{this.c.resume()};save=()=>structuredClone(this.t);restorePhysics(t){this.e=Object.freeze({...this.e,...t})}savePhysics(){return this.e}relativeCoordinates=(t,e=!0)=>{(e||!this.r)&&(this.r={box:this.getBoundingClientRect(),style:getComputedStyle(this)});let i=this.r.box,s=this.r.style,r=parseFloat(s.paddingLeft),n=parseFloat(s.paddingTop),o=i.width-r-parseFloat(s.paddingRight),l=i.height-n-parseFloat(s.paddingBottom),c=t.clientX-i.left-r,u=t.clientY-i.top-n,d=Math.max(0,Math.min(1,c/o)),a=Math.max(0,Math.min(1,u/l));return[d,a,i,s]};realCoordinates=(t,e)=>{this.r||(this.r={box:this.getBoundingClientRect(),style:getComputedStyle(this)});let i=this.r.box,s=this.r.style,r;e&&(r=getComputedStyle(e));let n=k(t,i,s,r);return new DOMRect(i.left+n.x,i.top+n.y,n.width,n.height)};diffCoordinates=(t,e)=>{let[i,s,r]=this.relativeCoordinates(t,!1),n=(i-e.column)*r.width,o=(s-e.row)*r.height;return Math.sqrt(n**2+o**2)};create_overlay_host(){let t=this;return{get panel(){return t.t},get physics(){return t.e},get stylesheet(){return t.s},get presizeQueue(){return t.c},relativeCoordinates:(e,i)=>t.relativeCoordinates(e,i),restore:(e,i)=>t.restore(e,i),querySelector:e=>t.querySelector(e),dispatchEvent:e=>t.dispatchEvent(e)}}onDblClick=async t=>{let[e,i,s]=this.relativeCoordinates(t,!1),r=_(e,i,this.t,{rect:s,size:this.e.GRID_DIVIDER_SIZE});if(r?.type==="horizontal"||r?.type==="vertical"){let n=A(this.t,r.path,void 0);await this.restore(n,!0)}};onPointerDown=t=>{if(t.button===0&&(!this.e.GRID_DIVIDER_CHECK_TARGET||t.target===this)){let[e,i,s]=this.relativeCoordinates(t),r=this.e.GRID_DIVIDER_SIZE,n=_(e,i,this.t,{rect:s,size:r});n&&n.type!=="layout-path"&&(this.h=[n,e,i],this.setPointerCapture(t.pointerId),t.preventDefault())}};onPointerMove=async t=>{if(this.h){let[n,o]=this.relativeCoordinates(t,!1),[{path:l,type:c},u,d]=this.h,a=c==="horizontal"?u-n:d-o,h=A(this.t,l,a);await this.c.run(h,()=>{this.s.replaceSync(v(h,void 0,this.e))})}if(this.e.GRID_DIVIDER_CHECK_TARGET&&t.target!==this){this.l&&(this.l=!1,this.u.replaceSync(""));return}let[e,i,s]=this.relativeCoordinates(t,!1),r=_(e,i,this.t,{rect:s,size:this.e.GRID_DIVIDER_SIZE});r?.type==="vertical"?(this.u.replaceSync(":host{cursor:row-resize"),this.l=!0):r?.type==="horizontal"?(this.u.replaceSync(":host{cursor:col-resize"),this.l=!0):this.l&&(this.l=!1,this.u.replaceSync(""))};onPointerUp=async t=>{if(this.h){this.releasePointerCapture(t.pointerId);let[e,i]=this.relativeCoordinates(t,!1),[{path:s,type:r},n,o]=this.h,l=r==="horizontal"?n-e:o-i,c=A(this.t,s,l);await this.restore(c,!0),this.h=void 0}}},nt=`
|
|
6
6
|
:host{box-sizing:border-box;flex-direction:column;pointer-events:none}
|
|
7
7
|
[part~="titlebar"]{height:24px;user-select:none;overflow:hidden}
|
|
8
8
|
[part~="container"]{flex:1 1 auto;pointer-events:auto}
|
|
@@ -17,5 +17,5 @@ var $=customElements.define.bind(customElements);customElements.define=(t,e,i)=>
|
|
|
17
17
|
<div part="container"><slot></slot></div>
|
|
18
18
|
`,lt=t=>`"${t.replace(/[\\"\n]/g,e=>e===`
|
|
19
19
|
`?"\\A ":`\\${e}`)}"`,at=t=>`--regular-layout-${globalThis.CSS.escape(t)}--title`,ht=class extends HTMLElement{i;L;v;n;m;b;o=null;connectedCallback(){this.L??=new CSSStyleSheet,this.L.replaceSync(nt),this.v??=new CSSStyleSheet,this.i??=this.attachShadow({mode:"open"}),this.i.adoptedStyleSheets=[this.L,this.v],this.i.innerHTML=ot,this.n=this.parentElement,this.m=this.i.children[0],this.b=this.m.querySelector("regular-layout-tab"),this.m.addEventListener("pointerdown",this.onPointerDown),this.addEventListener("pointermove",this.onPointerMove),this.addEventListener("pointerup",this.onPointerUp),this.addEventListener("pointercancel",this.onPointerCancel),this.addEventListener("lostpointercapture",this.onPointerLost),this.n.addEventListener("regular-layout-update",this.drawTabs),this.n.addEventListener("regular-layout-before-update",this.drawTabs)}disconnectedCallback(){this.m.removeEventListener("pointerdown",this.onPointerDown),this.removeEventListener("pointermove",this.onPointerMove),this.removeEventListener("pointerup",this.onPointerUp),this.removeEventListener("pointercancel",this.onPointerUp),this.removeEventListener("lostpointercapture",this.onPointerLost),this.n.removeEventListener("regular-layout-update",this.drawTabs),this.n.removeEventListener("regular-layout-before-update",this.drawTabs)}onPointerDown=t=>{if(t.button===0&&t.target.part.contains("tab")){let e=this.getAttribute(this.n.savePhysics().CHILD_ATTRIBUTE_NAME),i=this.n.calculateIntersect(t);i&&e?(this.o={path:{...i,slot:e}},this.setPointerCapture(t.pointerId),t.preventDefault()):this.o=null}};onPointerMove=t=>{if(this.o){let e=this.n.savePhysics();if(!this.o.moved&&this.n.diffCoordinates(t,this.o.path)<=e.MIN_DRAG_DISTANCE)return;this.o.moved=!0,this.n.setOverlayState(t,this.o.path)}};onPointerUp=t=>{this.o?.moved&&this.n.clearOverlayState(t,this.o.path)};onPointerCancel=t=>{this.o?.moved&&this.n.clearOverlayState(null,this.o.path)};onPointerLost=t=>{this.releasePointerCapture(t.pointerId),this.o=null};drawTabs=t=>{let e=this.n.savePhysics().CHILD_ATTRIBUTE_NAME,i=this.getAttribute(e);if(!i)return;let s=this.n.getPanel(i,t.detail);s||(s={type:"tab-layout",tabs:[i],selected:0});let r=s.tabs.indexOf(i),n=(s.selected??0)===r;this.toggleAttribute("inactive",!n),this.b.populate(this.n,s,r),this.drawTab(i,r,s.tabs.length)};drawTab=(t,e,i)=>{this.v.replaceSync([`.tabs{grid-template-columns:repeat(${i},var(--rl-tab-width,1fr))}`,`.tabs slot[name="tab"]{grid-column:${e+1}}`,`[part~="title"]::before{content:var(${at(t)}, ${lt(t)})}`].join(`
|
|
20
|
-
`))}},ct=class extends HTMLElement{n;a;f;populate=(t,e,i)=>{if(this.setAttribute(t.savePhysics().CHILD_ATTRIBUTE_NAME,e.tabs[i]),this.a)(i===e.selected!=(i===this.a?.selected)||this.a?.tabs[i]!==e.tabs[i])&&(e.selected===i?(this.children[1].part.add("active-close"),this.part.add("active-tab")):(this.children[1].part.remove("active-close"),this.part.remove("active-tab")));else{let s=e.selected===i,r=s?"active-close close":"close";this.innerHTML=`<div part="title"></div><button part="${r}"></button>`,s?this.part.add("tab","active-tab"):this.part.add("tab"),this.addEventListener("pointerdown",this.onTabClick),this.children[1].addEventListener("pointerdown",this.onTabClose)}this.a=e,this.n=t,this.f=i};onTabClose=t=>{t instanceof PointerEvent&&t?.button!==0||this.a!==void 0&&this.f!==void 0&&this.n?.removePanel(this.a.tabs[this.f])};onTabClick=t=>{t.button===0&&this.a!==void 0&&this.f!==void 0&&this.n?.select(this.a.tabs[this.f])}};customElements.define("regular-layout",N);customElements.define("regular-layout-frame",ht);customElements.define("regular-layout-tab",ct);U();var x=class extends N{#e=null;#t=0;constructor(){super();let e=this.setOverlayState,i=this.clearOverlayState;this.setOverlayState=async(...s)=>{if(!this.locked)return e(...s)},this.clearOverlayState=async(...s)=>{if(!this.locked)return i(...s)}}get locked(){return this.hasAttribute("locked")}set locked(e){this.toggleAttribute("locked",!!e)}connectedCallback(){this.#t+=1,super.connectedCallback(),queueMicrotask(()=>{try{if(!this.isConnected||!this.#e)return;this.restoreSync(this.#e),this.#e=null}finally{this.#t-=1}})}get restoring(){return this.#t>0}get layout(){return this.save()}set layout(e){e&&(this.isConnected?(this.#t+=1,this.restore(e).finally(()=>{this.#t-=1})):this.#e=e)}};customElements.get("spaday-regular-layout")||customElements.define("spaday-regular-layout",x);export{x as SpadayRegularLayout};
|
|
20
|
+
`))}},ct=class extends HTMLElement{n;a;f;populate=(t,e,i)=>{if(this.setAttribute(t.savePhysics().CHILD_ATTRIBUTE_NAME,e.tabs[i]),this.a)(i===e.selected!=(i===this.a?.selected)||this.a?.tabs[i]!==e.tabs[i])&&(e.selected===i?(this.children[1].part.add("active-close"),this.part.add("active-tab")):(this.children[1].part.remove("active-close"),this.part.remove("active-tab")));else{let s=e.selected===i,r=s?"active-close close":"close";this.innerHTML=`<div part="title"></div><button part="${r}"></button>`,s?this.part.add("tab","active-tab"):this.part.add("tab"),this.addEventListener("pointerdown",this.onTabClick),this.children[1].addEventListener("pointerdown",this.onTabClose)}this.a=e,this.n=t,this.f=i};onTabClose=t=>{t instanceof PointerEvent&&t?.button!==0||this.a!==void 0&&this.f!==void 0&&this.n?.removePanel(this.a.tabs[this.f])};onTabClick=t=>{t.button===0&&this.a!==void 0&&this.f!==void 0&&this.n?.select(this.a.tabs[this.f])}};customElements.define("regular-layout",N);customElements.define("regular-layout-frame",ht);customElements.define("regular-layout-tab",ct);U();var x=class extends N{#e=null;#t=0;constructor(){super();let e=this.setOverlayState,i=this.clearOverlayState;this.setOverlayState=async(...s)=>{if(!this.locked)return e(...s)},this.clearOverlayState=async(...s)=>{if(!this.locked)return i(...s)}}get locked(){return this.hasAttribute("locked")}set locked(e){this.toggleAttribute("locked",!!e)}connectedCallback(){this.#t+=1,super.connectedCallback(),queueMicrotask(()=>{try{if(!this.isConnected||!this.#e)return;this.restoreSync(this.#e),this.#e=null}finally{this.#t-=1}})}get restoring(){return this.#t>0}get layout(){return this.save()}async openPanel(e){e&&(this.calculatePath(e)===null&&await this.insertPanel(e),await this.select(e))}set layout(e){e&&(this.isConnected?(this.#t+=1,this.restore(e).finally(()=>{this.#t-=1})):this.#e=e)}};customElements.get("spaday-regular-layout")||customElements.define("spaday-regular-layout",x);export{x as SpadayRegularLayout};
|
|
21
21
|
//# sourceMappingURL=index.js.map
|