npm - @spectrum-web-components/split-view - Versions diffs - 0.4.7 → 0.4.10 - Mend

@spectrum-web-components/split-view 0.4.7 → 0.4.10

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.

Files changed (5) hide show

package/custom-elements.json CHANGED Viewed

@@ -574,69 +574,6 @@
           }
         }
       ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./SplitView.js"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/spectrum-split-view.css.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "styles",
-          "default": "css`\n:host{--spectrum-splitview-vertical-width:100%;--spectrum-splitview-vertical-gripper-width:50%;--spectrum-splitview-vertical-gripper-outer-width:100%;--spectrum-splitview-vertical-gripper-reset:0}:host{display:flex;overflow:hidden}::slotted(*){height:100%}:host([dir=ltr]) #gripper{left:calc((var(\n--spectrum-dragbar-gripper-width,\nvar(--spectrum-global-dimension-static-size-50)\n) + 2*var(--spectrum-dragbar-gripper-border-width-horizontal, 3px) - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n))/2*-1)}:host([dir=rtl]) #gripper{right:calc((var(\n--spectrum-dragbar-gripper-width,\nvar(--spectrum-global-dimension-static-size-50)\n) + 2*var(--spectrum-dragbar-gripper-border-width-horizontal, 3px) - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n))/2*-1)}#gripper{border-radius:var(\n--spectrum-dragbar-gripper-border-radius,var(--spectrum-alias-border-radius-small)\n);border-style:solid;border-width:var(--spectrum-dragbar-gripper-border-width-vertical,4px) var(--spectrum-dragbar-gripper-border-width-horizontal,3px);content:\"\";display:block;height:var(\n--spectrum-dragbar-gripper-height,var(--spectrum-global-dimension-static-size-200)\n);position:absolute;top:50%;transform:translateY(-50%);width:var(\n--spectrum-dragbar-gripper-width,var(--spectrum-global-dimension-static-size-50)\n)}#splitter{height:100%;position:relative;-webkit-user-select:none;user-select:none;width:var(\n--spectrum-dragbar-handle-width,var(--spectrum-global-dimension-static-size-25)\n);z-index:1}:host([dir=ltr]) #splitter.is-collapsed-end #gripper:before,:host([dir=ltr]) #splitter.is-collapsed-start #gripper:before{left:calc(50% - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n)/2)}:host([dir=rtl]) #splitter.is-collapsed-end #gripper:before,:host([dir=rtl]) #splitter.is-collapsed-start #gripper:before{right:calc(50% - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n)/2)}#splitter.is-collapsed-end #gripper:before,#splitter.is-collapsed-start #gripper:before{content:\"\";height:100%;position:absolute;top:0;width:var(\n--spectrum-dragbar-handle-width,var(--spectrum-global-dimension-static-size-25)\n)}:host([dir=ltr]) #splitter.is-collapsed-start #gripper{left:0}:host([dir=rtl]) #splitter.is-collapsed-start #gripper{right:0}:host([dir=ltr]) #splitter.is-collapsed-end #gripper{right:0}:host([dir=rtl]) #splitter.is-collapsed-end #gripper{left:0}:host([dir=ltr]) #splitter.is-collapsed-end #gripper{left:auto}:host([dir=rtl]) #splitter.is-collapsed-end #gripper{right:auto}:host([vertical]){flex-direction:column}:host([vertical]) ::slotted(*){height:auto;width:var(--spectrum-splitview-vertical-width)}:host([dir=ltr][vertical]) #gripper{left:var(\n--spectrum-splitview-vertical-gripper-width\n)}:host([dir=rtl][vertical]) #gripper{right:var(\n--spectrum-splitview-vertical-gripper-width\n)}:host([vertical]) #gripper{border-width:var(--spectrum-dragbar-gripper-border-width-horizontal,3px) var(--spectrum-dragbar-gripper-border-width-vertical,4px);height:var(\n--spectrum-dragbar-gripper-width,var(--spectrum-global-dimension-static-size-50)\n);top:calc((var(\n--spectrum-dragbar-gripper-width,\nvar(--spectrum-global-dimension-static-size-50)\n) + 2*var(--spectrum-dragbar-gripper-border-width-horizontal, 3px) - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n))/2*-1);transform:translate(calc(var(--spectrum-splitview-vertical-gripper-width)*-1));width:var(\n--spectrum-dragbar-gripper-height,var(--spectrum-global-dimension-static-size-200)\n)}:host([vertical]) #splitter{height:var(\n--spectrum-dragbar-handle-width,var(--spectrum-global-dimension-static-size-25)\n);width:var(\n--spectrum-splitview-vertical-width\n)}:host([dir=ltr][vertical]) #splitter.is-collapsed-end #gripper,:host([dir=ltr][vertical]) #splitter.is-collapsed-start #gripper{left:var(\n--spectrum-splitview-vertical-gripper-width\n)}:host([dir=rtl][vertical]) #splitter.is-collapsed-end #gripper,:host([dir=rtl][vertical]) #splitter.is-collapsed-start #gripper{right:var(\n--spectrum-splitview-vertical-gripper-width\n)}:host([dir=ltr][vertical]) #splitter.is-collapsed-end #gripper:before,:host([dir=ltr][vertical]) #splitter.is-collapsed-start #gripper:before{left:var(\n--spectrum-splitview-vertical-gripper-reset\n)}:host([dir=rtl][vertical]) #splitter.is-collapsed-end #gripper:before,:host([dir=rtl][vertical]) #splitter.is-collapsed-start #gripper:before{right:var(\n--spectrum-splitview-vertical-gripper-reset\n)}:host([vertical]) #splitter.is-collapsed-end #gripper:before,:host([vertical]) #splitter.is-collapsed-start #gripper:before{height:var(\n--spectrum-dragbar-handle-width,var(--spectrum-global-dimension-static-size-25)\n);top:calc(var(--spectrum-splitview-vertical-gripper-width) - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n)/2);width:var(--spectrum-splitview-vertical-gripper-outer-width)}:host([vertical]) #splitter.is-collapsed-start #gripper{top:var(\n--spectrum-splitview-vertical-gripper-reset\n)}:host([vertical]) #splitter.is-collapsed-end #gripper{bottom:var(--spectrum-splitview-vertical-gripper-reset);top:auto}::slotted(*){background-color:var(\n--spectrum-panel-s-background-color,var(--spectrum-alias-toolbar-background-color)\n)}#splitter{background-color:var(\n--spectrum-dragbar-handle-background-color,var(--spectrum-global-color-gray-300)\n)}#gripper{border-color:var(\n--spectrum-dragbar-handle-background-color,var(--spectrum-global-color-gray-300)\n)}#gripper:before{background-color:var(\n--spectrum-dragbar-handle-background-color,var(--spectrum-global-color-gray-300)\n)}:host([resizable]) #splitter.is-hovered,:host([resizable]) #splitter:hover{background-color:var(\n--spectrum-dragbar-handle-background-color-hover,var(--spectrum-global-color-gray-400)\n)}:host([resizable]) #splitter.is-hovered #gripper,:host([resizable]) #splitter:hover #gripper{border-color:var(\n--spectrum-dragbar-handle-background-color-hover,var(--spectrum-global-color-gray-400)\n)}:host([resizable]) #splitter.is-hovered #gripper:before,:host([resizable]) #splitter:hover #gripper:before{background-color:var(\n--spectrum-dragbar-handle-background-color-hover,var(--spectrum-global-color-gray-400)\n)}:host([resizable]) #splitter.is-active,:host([resizable]) #splitter:active{background-color:var(\n--spectrum-dragbar-handle-background-color-down,var(--spectrum-global-color-gray-800)\n)}:host([resizable]) #splitter.is-active #gripper,:host([resizable]) #splitter:active #gripper{border-color:var(\n--spectrum-dragbar-handle-background-color-down,var(--spectrum-global-color-gray-800)\n)}:host([resizable]) #splitter.is-active #gripper:before,:host([resizable]) #splitter:active #gripper:before{background-color:var(\n--spectrum-dragbar-handle-background-color-down,var(--spectrum-global-color-gray-800)\n)}:host([resizable]) #splitter:focus{outline:none}:host([resizable]) #splitter.focus-visible{background-color:var(\n--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400)\n)}:host([resizable]) #splitter:focus-visible{background-color:var(\n--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400)\n)}:host([resizable]) #splitter.focus-visible #gripper{border-color:var(\n--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400)\n);box-shadow:0 0 0 1px var(--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400))}:host([resizable]) #splitter:focus-visible #gripper{border-color:var(\n--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400)\n);box-shadow:0 0 0 1px var(--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400))}:host([resizable]) #splitter.focus-visible #gripper:before{background-color:var(\n--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400)\n)}:host([resizable]) #splitter:focus-visible #gripper:before{background-color:var(\n--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400)\n)}\n`"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "styles",
-            "module": "src/spectrum-split-view.css.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/split-view.css.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "styles",
-          "default": "css`\n:host{--spectrum-splitview-vertical-width:100%;--spectrum-splitview-vertical-gripper-width:50%;--spectrum-splitview-vertical-gripper-outer-width:100%;--spectrum-splitview-vertical-gripper-reset:0}:host{display:flex;overflow:hidden}::slotted(*){height:100%}:host([dir=ltr]) #gripper{left:calc((var(\n--spectrum-dragbar-gripper-width,\nvar(--spectrum-global-dimension-static-size-50)\n) + 2*var(--spectrum-dragbar-gripper-border-width-horizontal, 3px) - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n))/2*-1)}:host([dir=rtl]) #gripper{right:calc((var(\n--spectrum-dragbar-gripper-width,\nvar(--spectrum-global-dimension-static-size-50)\n) + 2*var(--spectrum-dragbar-gripper-border-width-horizontal, 3px) - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n))/2*-1)}#gripper{border-radius:var(\n--spectrum-dragbar-gripper-border-radius,var(--spectrum-alias-border-radius-small)\n);border-style:solid;border-width:var(--spectrum-dragbar-gripper-border-width-vertical,4px) var(--spectrum-dragbar-gripper-border-width-horizontal,3px);content:\"\";display:block;height:var(\n--spectrum-dragbar-gripper-height,var(--spectrum-global-dimension-static-size-200)\n);position:absolute;top:50%;transform:translateY(-50%);width:var(\n--spectrum-dragbar-gripper-width,var(--spectrum-global-dimension-static-size-50)\n)}#splitter{height:100%;position:relative;-webkit-user-select:none;user-select:none;width:var(\n--spectrum-dragbar-handle-width,var(--spectrum-global-dimension-static-size-25)\n);z-index:1}:host([dir=ltr]) #splitter.is-collapsed-end #gripper:before,:host([dir=ltr]) #splitter.is-collapsed-start #gripper:before{left:calc(50% - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n)/2)}:host([dir=rtl]) #splitter.is-collapsed-end #gripper:before,:host([dir=rtl]) #splitter.is-collapsed-start #gripper:before{right:calc(50% - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n)/2)}#splitter.is-collapsed-end #gripper:before,#splitter.is-collapsed-start #gripper:before{content:\"\";height:100%;position:absolute;top:0;width:var(\n--spectrum-dragbar-handle-width,var(--spectrum-global-dimension-static-size-25)\n)}:host([dir=ltr]) #splitter.is-collapsed-start #gripper{left:0}:host([dir=rtl]) #splitter.is-collapsed-start #gripper{right:0}:host([dir=ltr]) #splitter.is-collapsed-end #gripper{right:0}:host([dir=rtl]) #splitter.is-collapsed-end #gripper{left:0}:host([dir=ltr]) #splitter.is-collapsed-end #gripper{left:auto}:host([dir=rtl]) #splitter.is-collapsed-end #gripper{right:auto}:host([vertical]){flex-direction:column}:host([vertical]) ::slotted(*){height:auto;width:var(--spectrum-splitview-vertical-width)}:host([dir=ltr][vertical]) #gripper{left:var(\n--spectrum-splitview-vertical-gripper-width\n)}:host([dir=rtl][vertical]) #gripper{right:var(\n--spectrum-splitview-vertical-gripper-width\n)}:host([vertical]) #gripper{border-width:var(--spectrum-dragbar-gripper-border-width-horizontal,3px) var(--spectrum-dragbar-gripper-border-width-vertical,4px);height:var(\n--spectrum-dragbar-gripper-width,var(--spectrum-global-dimension-static-size-50)\n);top:calc((var(\n--spectrum-dragbar-gripper-width,\nvar(--spectrum-global-dimension-static-size-50)\n) + 2*var(--spectrum-dragbar-gripper-border-width-horizontal, 3px) - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n))/2*-1);transform:translate(calc(var(--spectrum-splitview-vertical-gripper-width)*-1));width:var(\n--spectrum-dragbar-gripper-height,var(--spectrum-global-dimension-static-size-200)\n)}:host([vertical]) #splitter{height:var(\n--spectrum-dragbar-handle-width,var(--spectrum-global-dimension-static-size-25)\n);width:var(\n--spectrum-splitview-vertical-width\n)}:host([dir=ltr][vertical]) #splitter.is-collapsed-end #gripper,:host([dir=ltr][vertical]) #splitter.is-collapsed-start #gripper{left:var(\n--spectrum-splitview-vertical-gripper-width\n)}:host([dir=rtl][vertical]) #splitter.is-collapsed-end #gripper,:host([dir=rtl][vertical]) #splitter.is-collapsed-start #gripper{right:var(\n--spectrum-splitview-vertical-gripper-width\n)}:host([dir=ltr][vertical]) #splitter.is-collapsed-end #gripper:before,:host([dir=ltr][vertical]) #splitter.is-collapsed-start #gripper:before{left:var(\n--spectrum-splitview-vertical-gripper-reset\n)}:host([dir=rtl][vertical]) #splitter.is-collapsed-end #gripper:before,:host([dir=rtl][vertical]) #splitter.is-collapsed-start #gripper:before{right:var(\n--spectrum-splitview-vertical-gripper-reset\n)}:host([vertical]) #splitter.is-collapsed-end #gripper:before,:host([vertical]) #splitter.is-collapsed-start #gripper:before{height:var(\n--spectrum-dragbar-handle-width,var(--spectrum-global-dimension-static-size-25)\n);top:calc(var(--spectrum-splitview-vertical-gripper-width) - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n)/2);width:var(--spectrum-splitview-vertical-gripper-outer-width)}:host([vertical]) #splitter.is-collapsed-start #gripper{top:var(\n--spectrum-splitview-vertical-gripper-reset\n)}:host([vertical]) #splitter.is-collapsed-end #gripper{bottom:var(--spectrum-splitview-vertical-gripper-reset);top:auto}::slotted(*){background-color:var(\n--spectrum-panel-s-background-color,var(--spectrum-alias-toolbar-background-color)\n)}#splitter{background-color:var(\n--spectrum-dragbar-handle-background-color,var(--spectrum-global-color-gray-300)\n)}#gripper{border-color:var(\n--spectrum-dragbar-handle-background-color,var(--spectrum-global-color-gray-300)\n)}#gripper:before{background-color:var(\n--spectrum-dragbar-handle-background-color,var(--spectrum-global-color-gray-300)\n)}:host([resizable]) #splitter.is-hovered,:host([resizable]) #splitter:hover{background-color:var(\n--spectrum-dragbar-handle-background-color-hover,var(--spectrum-global-color-gray-400)\n)}:host([resizable]) #splitter.is-hovered #gripper,:host([resizable]) #splitter:hover #gripper{border-color:var(\n--spectrum-dragbar-handle-background-color-hover,var(--spectrum-global-color-gray-400)\n)}:host([resizable]) #splitter.is-hovered #gripper:before,:host([resizable]) #splitter:hover #gripper:before{background-color:var(\n--spectrum-dragbar-handle-background-color-hover,var(--spectrum-global-color-gray-400)\n)}:host([resizable]) #splitter.is-active,:host([resizable]) #splitter:active{background-color:var(\n--spectrum-dragbar-handle-background-color-down,var(--spectrum-global-color-gray-800)\n)}:host([resizable]) #splitter.is-active #gripper,:host([resizable]) #splitter:active #gripper{border-color:var(\n--spectrum-dragbar-handle-background-color-down,var(--spectrum-global-color-gray-800)\n)}:host([resizable]) #splitter.is-active #gripper:before,:host([resizable]) #splitter:active #gripper:before{background-color:var(\n--spectrum-dragbar-handle-background-color-down,var(--spectrum-global-color-gray-800)\n)}:host([resizable]) #splitter:focus{outline:none}:host([resizable]) #splitter.focus-visible{background-color:var(\n--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400)\n)}:host([resizable]) #splitter:focus-visible{background-color:var(\n--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400)\n)}:host([resizable]) #splitter.focus-visible #gripper{border-color:var(\n--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400)\n);box-shadow:0 0 0 1px var(--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400))}:host([resizable]) #splitter:focus-visible #gripper{border-color:var(\n--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400)\n);box-shadow:0 0 0 1px var(--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400))}:host([resizable]) #splitter.focus-visible #gripper:before{background-color:var(\n--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400)\n)}:host([resizable]) #splitter:focus-visible #gripper:before{background-color:var(\n--spectrum-alias-focus-color,var(--spectrum-global-color-blue-400)\n)}:host{--spectrum-split-view-first-pane-size:50%}::slotted(*){overflow:auto}::slotted(:first-child){order:1}:host(:not([vertical])) ::slotted(:first-child:not(:last-child)){width:var(--spectrum-split-view-first-pane-size)}:host([vertical]) ::slotted(:first-child:not(:last-child)){height:var(--spectrum-split-view-first-pane-size)}::slotted(:nth-child(2)){flex:1;order:3}::slotted(:nth-child(n+3)){display:none}#splitter{height:auto;order:2}:host([resizable]) #splitter{background-clip:content-box;cursor:ew-resize;margin:0 calc(var(--spectrum-global-dimension-static-size-125)*-1);padding:0 var(--spectrum-global-dimension-static-size-125)}:host([vertical][resizable]) #splitter{background-clip:content-box;cursor:ns-resize;margin:calc(var(--spectrum-global-dimension-static-size-125)*-1) 0;padding:var(--spectrum-global-dimension-static-size-125) 0}:host([resizable][dir=ltr]) #splitter.is-resized-start,:host([resizable][dir=rtl]) #splitter.is-resized-end{cursor:e-resize}:host([resizable][dir=ltr]) #splitter.is-resized-end,:host([resizable][dir=rtl]) #splitter.is-resized-start{cursor:w-resize}:host([vertical][resizable]) #splitter.is-resized-start{cursor:s-resize}:host([vertical][resizable]) #splitter.is-resized-end{cursor:n-resize}:host([resizable][collapsible]) #splitter.is-resized-end,:host([resizable][collapsible]) #splitter.is-resized-start{cursor:ew-resize}:host([resizable][dir=ltr][collapsible]) #splitter.is-collapsed-start,:host([resizable][dir=rtl][collapsible]) #splitter.is-collapsed-end{cursor:e-resize}:host([resizable][dir=ltr][collapsible]) #splitter.is-collapsed-end,:host([resizable][dir=rtl][collapsible]) #splitter.is-collapsed-start{cursor:w-resize}:host([vertical][resizable][collapsible]) #splitter.is-collapsed-start{cursor:s-resize}:host([vertical][resizable][collapsible]) #splitter.is-collapsed-end{cursor:n-resize}:host([vertical][resizable][collapsible]) #splitter.is-resized-end,:host([vertical][resizable][collapsible]) #splitter.is-resized-start{cursor:ns-resize}:host([dir=ltr][resizable]) #gripper{left:calc(var(--spectrum-global-dimension-static-size-125) + (var(\n--spectrum-dragbar-gripper-width,\nvar(--spectrum-global-dimension-static-size-50)\n) + 2*var(--spectrum-dragbar-gripper-border-width-horizontal, 3px) - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n))/2*-1)}:host([dir=rtl][resizable]) #gripper{right:calc(var(--spectrum-global-dimension-static-size-125) + (var(\n--spectrum-dragbar-gripper-width,\nvar(--spectrum-global-dimension-static-size-50)\n) + 2*var(--spectrum-dragbar-gripper-border-width-horizontal, 3px) - var(\n--spectrum-dragbar-handle-width,\nvar(--spectrum-global-dimension-static-size-25)\n))/2*-1)}:host([vertical][resizable]) #gripper{left:50%;margin-top:var(--spectrum-global-dimension-static-size-125);right:50%}:host([dir=ltr][resizable]) #splitter.is-collapsed-start #gripper{left:var(--spectrum-global-dimension-static-size-125)}:host([dir=rtl][resizable]) #splitter.is-collapsed-start #gripper{right:var(--spectrum-global-dimension-static-size-125)}:host([vertical][resizable]) #splitter.is-collapsed-start #gripper{left:50%;right:50%}:host([dir=ltr][resizable]) #splitter.is-collapsed-end #gripper{left:var(--spectrum-global-dimension-static-size-25)}:host([dir=rtl][resizable]) #splitter.is-collapsed-end #gripper{right:var(--spectrum-global-dimension-static-size-25)}:host([vertical][resizable]) #splitter.is-collapsed-end #gripper{left:50%;margin-top:0;right:50%;top:var(--spectrum-global-dimension-static-size-25)}\n`"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "styles",
-            "module": "src/split-view.css.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/types.ts",
-      "declarations": [],
-      "exports": []
     }
   ]
 }

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/split-view",
-    "version": "0.4.7",
+    "version": "0.4.10",
     "publishConfig": {
         "access": "public"
     },
@@ -44,16 +44,16 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.5.6",
+        "@spectrum-web-components/base": "^0.5.8",
         "tslib": "^2.0.0"
     },
     "devDependencies": {
-        "@spectrum-css/splitview": "^3.0.20"
+        "@spectrum-css/splitview": "^3.0.22"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
     "sideEffects": [
         "./sp-*.js"
     ],
-    "gitHead": "32e049a0da090ffc1a54cfe3234be4d5efc73339"
+    "gitHead": "3be62133721efba844cd7032566a2c49ed6d9875"
 }

package/src/SplitView.d.ts CHANGED Viewed

@@ -61,6 +61,5 @@ export declare class SplitView extends SpectrumElement {
     private getLimitedPosition;
     private calcStartPos;
     private dispatchChangeEvent;
-    protected firstUpdated(changed: PropertyValues): void;
-    protected updated(changed: PropertyValues): void;
+    protected willUpdate(changed: PropertyValues): void;
 }

package/src/SplitView.js CHANGED Viewed

@@ -290,13 +290,8 @@ export class SplitView extends SpectrumElement {
         });
         this.dispatchEvent(changeEvent);
     }
-    firstUpdated(changed) {
-        super.firstUpdated(changed);
-        this.checkResize();
-    }
-    updated(changed) {
-        super.updated(changed);
-        if (changed.has('primarySize')) {
+    willUpdate(changed) {
+        if (!this.hasUpdated || changed.has('primarySize')) {
             this.splitterPos = undefined;
             this.checkResize();
         }

package/src/SplitView.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SplitView.js","sourceRoot":"","sources":["SplitView.ts"],"names":[],"mappings":"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","sourcesContent":["/\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n/\n\nimport {\n CSSResultArray,\n html,\n LitElement,\n nothing,\n PropertyValues,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n classMap,\n ifDefined,\n} from '@spectrum-web-components/base/src/directives.js';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport { streamingListener } from '@spectrum-web-components/base/src/streaming-listener.js';\n\nimport { WithSWCResizeObserver } from './types';\n\nimport styles from './split-view.css.js';\n\nconst DEFAULT_MAX_SIZE = 3840;\n\nconst SPLITTERSIZE = 2;\n\nconst ARROW_KEY_CHANGE_VALUE = 10;\n\nconst PAGEUPDOWN_KEY_CHANGE_VALUE = 50;\n\nconst COLLAPSE_THREASHOLD = 50;\n\n/*\n @element sp-split-view\n \n @slot Two sibling elements to be sized by the element attritubes\n /\nexport class SplitView extends SpectrumElement {\n public static get styles(): CSSResultArray {\n return [styles];\n }\n\n @property({ type: Boolean, reflect: true })\n public vertical = false;\n\n @property({ type: Boolean, reflect: true })\n public resizable = false;\n\n @property({ type: Boolean, reflect: true })\n public collapsible = false;\n\n /* The minimum size of the primary pane /\n @property({ type: Number, attribute: 'primary-min' })\n public primaryMin = 0;\n\n /* The maximum size of the primary pane /\n @property({ type: Number, attribute: 'primary-max' })\n public primaryMax = DEFAULT_MAX_SIZE;\n\n /\n The start size of the primary pane, can be a real pixel number\|string, percentage or \"auto\"\n * For example: \"100\", \"120px\", \"75%\" or \"auto\" are valid values\n * @type {number \| number + \"px\" \| number + \"%\" \| \"auto\"}\n * @attr\n /\n @property({ type: String, attribute: 'primary-size' })\n public primarySize?: string;\n\n /* The minimum size of the secondary pane /\n @property({ type: Number, attribute: 'secondary-min' })\n public secondaryMin = 0;\n\n /* The maximum size of the secondary pane /\n @property({ type: Number, attribute: 'secondary-max' })\n public secondaryMax = DEFAULT_MAX_SIZE;\n\n /* The current splitter position of split-view /\n @property({ type: Number, reflect: true, attribute: 'splitter-pos' })\n public splitterPos?: number;\n\n /* The current size of first pane of split-view /\n @property({ type: String, attribute: false })\n private firstPaneSize = 'auto';\n\n @property()\n public label?: string;\n\n @property({ type: Boolean, attribute: false })\n private enoughChildren = false;\n\n @property({ type: Number })\n private viewSize = 0;\n\n @query('slot')\n private paneSlot!: HTMLSlotElement;\n\n @query('#splitter')\n private splitter!: HTMLDivElement;\n\n private offset = 0;\n\n private minPos = 0;\n\n private maxPos = DEFAULT_MAX_SIZE;\n\n private observer?: WithSWCResizeObserver['ResizeObserver'];\n\n private rect?: DOMRect;\n\n private _splitterSize?: number;\n\n public constructor() {\n super();\n const RO = (window as unknown as WithSWCResizeObserver).ResizeObserver;\n if (RO) {\n this.observer = new RO(() => {\n this.rect = undefined;\n this.updateMinMax();\n });\n }\n }\n\n public connectedCallback(): void {\n super.connectedCallback();\n this.observer?.observe(this);\n }\n\n public disconnectedCallback(): void {\n this.observer?.unobserve(this);\n super.disconnectedCallback();\n }\n\n /\n @private\n */\n public get splitterSize(): number {\n if (!this._splitterSize) {\n this._splitterSize =\n (this.splitter &&\n Math.round(\n parseFloat(\n window\n .getComputedStyle(this.splitter)\n .getPropertyValue(\n this.vertical ? 'height' : 'width'\n )\n )\n )) \|\|\n SPLITTERSIZE;\n }\n return this._splitterSize;\n }\n\n protected render(): TemplateResult {\n const splitterClasses = {\n 'is-resized-start': this.splitterPos === this.minPos,\n 'is-resized-end': (this.splitterPos &&\n this.splitterPos > this.splitterSize &&\n this.splitterPos === this.maxPos) as boolean,\n 'is-collapsed-start': this.splitterPos === 0,\n 'is-collapsed-end': (this.splitterPos &&\n this.splitterPos >=\n Math.max(\n this.splitterSize,\n this.viewSize - this.splitterSize\n )) as boolean,\n };\n return html`\n <slot\n @slotchange=${this.onContentSlotChange}\n style=\"--spectrum-split-view-first-pane-size: ${this\n .firstPaneSize}\"\n ></slot>\n ${this.enoughChildren\n ? html`\n <div\n id=\"splitter\"\n class=${classMap(splitterClasses)}\n role=\"separator\"\n aria-label=${ifDefined(this.label \|\| undefined)}\n tabindex=${ifDefined(\n this.resizable ? '0' : undefined\n )}\n @keydown=${this.onKeydown}\n ${streamingListener({\n start: ['pointerdown', this.onPointerdown],\n streamInside: ['pointermove', this.onPointermove],\n end: [\n [\n 'pointerup',\n 'pointercancel',\n 'pointerleave',\n ],\n this.onPointerup,\n ],\n })}\n >\n ${this.resizable\n ? html`\n <div id=\"gripper\"></div>\n `\n : html``}\n </div>\n `\n : nothing}\n `;\n }\n\n private onContentSlotChange(): void {\n this.enoughChildren = this.children.length > 1;\n this.checkResize();\n }\n\n private onPointerdown(event: PointerEvent): void {\n if (!this.resizable \|\| (event.button && event.button !== 0)) {\n event.preventDefault();\n return;\n }\n this.splitter.setPointerCapture(event.pointerId);\n this.offset = this.getOffset();\n }\n\n private onPointermove(event: PointerEvent): void {\n event.preventDefault();\n let pos =\n this.vertical \|\| this.isLTR\n ? this.getPosition(event) - this.offset\n : this.offset - this.getPosition(event);\n if (this.collapsible && pos < this.minPos - COLLAPSE_THREASHOLD) {\n pos = 0;\n }\n if (this.collapsible && pos > this.maxPos + COLLAPSE_THREASHOLD) {\n pos = this.viewSize - this.splitterSize;\n }\n this.updatePosition(pos);\n }\n\n private onPointerup(event: PointerEvent): void {\n this.splitter.releasePointerCapture(event.pointerId);\n }\n\n private getOffset(): number {\n if (!this.rect) {\n this.rect = this.getBoundingClientRect();\n }\n const offsetX = this.isLTR ? this.rect.left : this.rect.right;\n return this.vertical ? this.rect.top : offsetX;\n }\n\n private getPosition(event: PointerEvent): number {\n return this.vertical ? event.clientY : event.clientX;\n }\n\n private movePosition(event: KeyboardEvent, offset: number): void {\n event.preventDefault();\n if (this.splitterPos !== undefined) {\n this.updatePosition(this.splitterPos + offset);\n }\n }\n\n private onKeydown(event: KeyboardEvent): void {\n if (!this.resizable) {\n return;\n }\n let direction = 0;\n const isLTRorVertical = this.isLTR \|\| this.vertical;\n switch (event.key) {\n case 'Home':\n event.preventDefault();\n this.updatePosition(this.collapsible ? 0 : this.minPos);\n return;\n case 'End':\n event.preventDefault();\n this.updatePosition(\n this.collapsible\n ? this.viewSize - this.splitterSize\n : this.maxPos\n );\n return;\n case 'ArrowLeft':\n direction = isLTRorVertical ? -1 : 1;\n break;\n case 'ArrowRight':\n direction = isLTRorVertical ? 1 : -1;\n break;\n case 'ArrowUp':\n direction = this.vertical ? -1 : 1;\n break;\n case 'ArrowDown':\n direction = this.vertical ? 1 : -1;\n break;\n case 'PageUp':\n direction = this.vertical ? -1 : 1;\n break;\n case 'PageDown':\n direction = this.vertical ? 1 : -1;\n break;\n }\n if (direction !== 0) {\n const moveBy = event.key.startsWith('Page')\n ? PAGEUPDOWN_KEY_CHANGE_VALUE\n : ARROW_KEY_CHANGE_VALUE;\n this.movePosition(event, moveBy direction);\n }\n }\n\n private async checkResize(): Promise<void> {\n if (!this.enoughChildren) {\n return;\n }\n this.updateMinMax();\n if (this.splitterPos === undefined) {\n const startPos = await this.calcStartPos();\n this.updatePosition(startPos);\n }\n }\n\n private updateMinMax(): void {\n this.viewSize = this.vertical ? this.offsetHeight : this.offsetWidth;\n this.minPos = Math.max(\n this.primaryMin,\n this.viewSize - this.secondaryMax\n );\n this.maxPos = Math.min(\n this.primaryMax,\n this.viewSize - Math.max(this.secondaryMin, this.splitterSize)\n );\n }\n\n private updatePosition(x: number): void {\n let pos = this.getLimitedPosition(x);\n if (this.collapsible && x <= 0) {\n pos = 0;\n }\n if (\n this.collapsible &&\n x > this.maxPos &&\n x >= this.viewSize - this.splitterSize\n ) {\n pos = this.viewSize - this.splitterSize;\n }\n if (pos !== this.splitterPos) {\n this.splitterPos = pos;\n this.dispatchChangeEvent();\n }\n }\n\n private getLimitedPosition(input: number): number {\n if (input <= this.minPos) {\n return this.minPos;\n }\n if (input >= this.maxPos) {\n return this.maxPos;\n }\n return Math.max(this.minPos, Math.min(this.maxPos, input));\n }\n\n private async calcStartPos(): Promise<number> {\n if (\n this.primarySize !== undefined &&\n /^\\d+(px)?$/.test(this.primarySize)\n ) {\n return parseInt(this.primarySize, 10);\n }\n if (this.primarySize !== undefined && /^\\d+%$/.test(this.primarySize)) {\n return (parseInt(this.primarySize, 10) * this.viewSize) / 100;\n }\n if (this.primarySize === 'auto') {\n this.firstPaneSize = 'auto';\n const nodes = this.paneSlot.assignedNodes({ flatten: true });\n const firstEl = nodes.find(\n (node) => node instanceof HTMLElement\n ) as LitElement;\n if (typeof firstEl.updateComplete !== 'undefined') {\n await firstEl.updateComplete;\n }\n if (firstEl) {\n const size = window\n .getComputedStyle(firstEl)\n .getPropertyValue(this.vertical ? 'height' : 'width');\n const size_i = parseFloat(size);\n if (!isNaN(size_i)) {\n return this.getLimitedPosition(Math.ceil(size_i));\n }\n }\n }\n return this.viewSize / 2;\n }\n\n private dispatchChangeEvent(): void {\n const changeEvent = new Event('change', {\n bubbles: true,\n composed: true,\n });\n this.dispatchEvent(changeEvent);\n }\n\n protected firstUpdated(changed: PropertyValues): void {\n super.firstUpdated(changed);\n this.checkResize();\n }\n\n protected updated(changed: PropertyValues): void {\n super.updated(changed);\n if (changed.has('primarySize')) {\n this.splitterPos = undefined;\n this.checkResize();\n }\n if (\n changed.has('splitterPos') &&\n this.splitterPos !== undefined &&\n this.enoughChildren\n ) {\n this.firstPaneSize = `${Math.round(this.splitterPos)}px`;\n }\n }\n}\n"]}
1	+ {"version":3,"file":"SplitView.js","sourceRoot":"","sources":["SplitView.ts"],"names":[],"mappings":"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","sourcesContent":["/\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n/\n\nimport {\n CSSResultArray,\n html,\n LitElement,\n nothing,\n PropertyValues,\n SpectrumElement,\n TemplateResult,\n} from '@spectrum-web-components/base';\nimport {\n classMap,\n ifDefined,\n} from '@spectrum-web-components/base/src/directives.js';\nimport {\n property,\n query,\n} from '@spectrum-web-components/base/src/decorators.js';\nimport { streamingListener } from '@spectrum-web-components/base/src/streaming-listener.js';\n\nimport { WithSWCResizeObserver } from './types';\n\nimport styles from './split-view.css.js';\n\nconst DEFAULT_MAX_SIZE = 3840;\n\nconst SPLITTERSIZE = 2;\n\nconst ARROW_KEY_CHANGE_VALUE = 10;\n\nconst PAGEUPDOWN_KEY_CHANGE_VALUE = 50;\n\nconst COLLAPSE_THREASHOLD = 50;\n\n/*\n @element sp-split-view\n \n @slot Two sibling elements to be sized by the element attritubes\n /\nexport class SplitView extends SpectrumElement {\n public static override get styles(): CSSResultArray {\n return [styles];\n }\n\n @property({ type: Boolean, reflect: true })\n public vertical = false;\n\n @property({ type: Boolean, reflect: true })\n public resizable = false;\n\n @property({ type: Boolean, reflect: true })\n public collapsible = false;\n\n /* The minimum size of the primary pane /\n @property({ type: Number, attribute: 'primary-min' })\n public primaryMin = 0;\n\n /* The maximum size of the primary pane /\n @property({ type: Number, attribute: 'primary-max' })\n public primaryMax = DEFAULT_MAX_SIZE;\n\n /\n The start size of the primary pane, can be a real pixel number\|string, percentage or \"auto\"\n * For example: \"100\", \"120px\", \"75%\" or \"auto\" are valid values\n * @type {number \| number + \"px\" \| number + \"%\" \| \"auto\"}\n * @attr\n /\n @property({ type: String, attribute: 'primary-size' })\n public primarySize?: string;\n\n /* The minimum size of the secondary pane /\n @property({ type: Number, attribute: 'secondary-min' })\n public secondaryMin = 0;\n\n /* The maximum size of the secondary pane /\n @property({ type: Number, attribute: 'secondary-max' })\n public secondaryMax = DEFAULT_MAX_SIZE;\n\n /* The current splitter position of split-view /\n @property({ type: Number, reflect: true, attribute: 'splitter-pos' })\n public splitterPos?: number;\n\n /* The current size of first pane of split-view /\n @property({ type: String, attribute: false })\n private firstPaneSize = 'auto';\n\n @property()\n public label?: string;\n\n @property({ type: Boolean, attribute: false })\n private enoughChildren = false;\n\n @property({ type: Number })\n private viewSize = 0;\n\n @query('slot')\n private paneSlot!: HTMLSlotElement;\n\n @query('#splitter')\n private splitter!: HTMLDivElement;\n\n private offset = 0;\n\n private minPos = 0;\n\n private maxPos = DEFAULT_MAX_SIZE;\n\n private observer?: WithSWCResizeObserver['ResizeObserver'];\n\n private rect?: DOMRect;\n\n private _splitterSize?: number;\n\n public constructor() {\n super();\n const RO = (window as unknown as WithSWCResizeObserver).ResizeObserver;\n if (RO) {\n this.observer = new RO(() => {\n this.rect = undefined;\n this.updateMinMax();\n });\n }\n }\n\n public override connectedCallback(): void {\n super.connectedCallback();\n this.observer?.observe(this);\n }\n\n public override disconnectedCallback(): void {\n this.observer?.unobserve(this);\n super.disconnectedCallback();\n }\n\n /\n @private\n */\n public get splitterSize(): number {\n if (!this._splitterSize) {\n this._splitterSize =\n (this.splitter &&\n Math.round(\n parseFloat(\n window\n .getComputedStyle(this.splitter)\n .getPropertyValue(\n this.vertical ? 'height' : 'width'\n )\n )\n )) \|\|\n SPLITTERSIZE;\n }\n return this._splitterSize;\n }\n\n protected override render(): TemplateResult {\n const splitterClasses = {\n 'is-resized-start': this.splitterPos === this.minPos,\n 'is-resized-end': (this.splitterPos &&\n this.splitterPos > this.splitterSize &&\n this.splitterPos === this.maxPos) as boolean,\n 'is-collapsed-start': this.splitterPos === 0,\n 'is-collapsed-end': (this.splitterPos &&\n this.splitterPos >=\n Math.max(\n this.splitterSize,\n this.viewSize - this.splitterSize\n )) as boolean,\n };\n return html`\n <slot\n @slotchange=${this.onContentSlotChange}\n style=\"--spectrum-split-view-first-pane-size: ${this\n .firstPaneSize}\"\n ></slot>\n ${this.enoughChildren\n ? html`\n <div\n id=\"splitter\"\n class=${classMap(splitterClasses)}\n role=\"separator\"\n aria-label=${ifDefined(this.label \|\| undefined)}\n tabindex=${ifDefined(\n this.resizable ? '0' : undefined\n )}\n @keydown=${this.onKeydown}\n ${streamingListener({\n start: ['pointerdown', this.onPointerdown],\n streamInside: ['pointermove', this.onPointermove],\n end: [\n [\n 'pointerup',\n 'pointercancel',\n 'pointerleave',\n ],\n this.onPointerup,\n ],\n })}\n >\n ${this.resizable\n ? html`\n <div id=\"gripper\"></div>\n `\n : html``}\n </div>\n `\n : nothing}\n `;\n }\n\n private onContentSlotChange(): void {\n this.enoughChildren = this.children.length > 1;\n this.checkResize();\n }\n\n private onPointerdown(event: PointerEvent): void {\n if (!this.resizable \|\| (event.button && event.button !== 0)) {\n event.preventDefault();\n return;\n }\n this.splitter.setPointerCapture(event.pointerId);\n this.offset = this.getOffset();\n }\n\n private onPointermove(event: PointerEvent): void {\n event.preventDefault();\n let pos =\n this.vertical \|\| this.isLTR\n ? this.getPosition(event) - this.offset\n : this.offset - this.getPosition(event);\n if (this.collapsible && pos < this.minPos - COLLAPSE_THREASHOLD) {\n pos = 0;\n }\n if (this.collapsible && pos > this.maxPos + COLLAPSE_THREASHOLD) {\n pos = this.viewSize - this.splitterSize;\n }\n this.updatePosition(pos);\n }\n\n private onPointerup(event: PointerEvent): void {\n this.splitter.releasePointerCapture(event.pointerId);\n }\n\n private getOffset(): number {\n if (!this.rect) {\n this.rect = this.getBoundingClientRect();\n }\n const offsetX = this.isLTR ? this.rect.left : this.rect.right;\n return this.vertical ? this.rect.top : offsetX;\n }\n\n private getPosition(event: PointerEvent): number {\n return this.vertical ? event.clientY : event.clientX;\n }\n\n private movePosition(event: KeyboardEvent, offset: number): void {\n event.preventDefault();\n if (this.splitterPos !== undefined) {\n this.updatePosition(this.splitterPos + offset);\n }\n }\n\n private onKeydown(event: KeyboardEvent): void {\n if (!this.resizable) {\n return;\n }\n let direction = 0;\n const isLTRorVertical = this.isLTR \|\| this.vertical;\n switch (event.key) {\n case 'Home':\n event.preventDefault();\n this.updatePosition(this.collapsible ? 0 : this.minPos);\n return;\n case 'End':\n event.preventDefault();\n this.updatePosition(\n this.collapsible\n ? this.viewSize - this.splitterSize\n : this.maxPos\n );\n return;\n case 'ArrowLeft':\n direction = isLTRorVertical ? -1 : 1;\n break;\n case 'ArrowRight':\n direction = isLTRorVertical ? 1 : -1;\n break;\n case 'ArrowUp':\n direction = this.vertical ? -1 : 1;\n break;\n case 'ArrowDown':\n direction = this.vertical ? 1 : -1;\n break;\n case 'PageUp':\n direction = this.vertical ? -1 : 1;\n break;\n case 'PageDown':\n direction = this.vertical ? 1 : -1;\n break;\n }\n if (direction !== 0) {\n const moveBy = event.key.startsWith('Page')\n ? PAGEUPDOWN_KEY_CHANGE_VALUE\n : ARROW_KEY_CHANGE_VALUE;\n this.movePosition(event, moveBy direction);\n }\n }\n\n private async checkResize(): Promise<void> {\n if (!this.enoughChildren) {\n return;\n }\n this.updateMinMax();\n if (this.splitterPos === undefined) {\n const startPos = await this.calcStartPos();\n this.updatePosition(startPos);\n }\n }\n\n private updateMinMax(): void {\n this.viewSize = this.vertical ? this.offsetHeight : this.offsetWidth;\n this.minPos = Math.max(\n this.primaryMin,\n this.viewSize - this.secondaryMax\n );\n this.maxPos = Math.min(\n this.primaryMax,\n this.viewSize - Math.max(this.secondaryMin, this.splitterSize)\n );\n }\n\n private updatePosition(x: number): void {\n let pos = this.getLimitedPosition(x);\n if (this.collapsible && x <= 0) {\n pos = 0;\n }\n if (\n this.collapsible &&\n x > this.maxPos &&\n x >= this.viewSize - this.splitterSize\n ) {\n pos = this.viewSize - this.splitterSize;\n }\n if (pos !== this.splitterPos) {\n this.splitterPos = pos;\n this.dispatchChangeEvent();\n }\n }\n\n private getLimitedPosition(input: number): number {\n if (input <= this.minPos) {\n return this.minPos;\n }\n if (input >= this.maxPos) {\n return this.maxPos;\n }\n return Math.max(this.minPos, Math.min(this.maxPos, input));\n }\n\n private async calcStartPos(): Promise<number> {\n if (\n this.primarySize !== undefined &&\n /^\\d+(px)?$/.test(this.primarySize)\n ) {\n return parseInt(this.primarySize, 10);\n }\n if (this.primarySize !== undefined && /^\\d+%$/.test(this.primarySize)) {\n return (parseInt(this.primarySize, 10) * this.viewSize) / 100;\n }\n if (this.primarySize === 'auto') {\n this.firstPaneSize = 'auto';\n const nodes = this.paneSlot.assignedNodes({ flatten: true });\n const firstEl = nodes.find(\n (node) => node instanceof HTMLElement\n ) as LitElement;\n if (typeof firstEl.updateComplete !== 'undefined') {\n await firstEl.updateComplete;\n }\n if (firstEl) {\n const size = window\n .getComputedStyle(firstEl)\n .getPropertyValue(this.vertical ? 'height' : 'width');\n const size_i = parseFloat(size);\n if (!isNaN(size_i)) {\n return this.getLimitedPosition(Math.ceil(size_i));\n }\n }\n }\n return this.viewSize / 2;\n }\n\n private dispatchChangeEvent(): void {\n const changeEvent = new Event('change', {\n bubbles: true,\n composed: true,\n });\n this.dispatchEvent(changeEvent);\n }\n\n protected override willUpdate(changed: PropertyValues): void {\n if (!this.hasUpdated \|\| changed.has('primarySize')) {\n this.splitterPos = undefined;\n this.checkResize();\n }\n if (\n changed.has('splitterPos') &&\n this.splitterPos !== undefined &&\n this.enoughChildren\n ) {\n this.firstPaneSize = `${Math.round(this.splitterPos)}px`;\n }\n }\n}\n"]}