@spectrum-web-components/split-view 1.12.0-next.20260216160808 → 1.12.0-next.20260218153607

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 (18) hide show
  1. package/README.md +113 -118
  2. package/package.json +74 -74
  3. package/sp-split-view.dev.js +1 -1
  4. package/sp-split-view.dev.js.map +2 -2
  5. package/sp-split-view.js +1 -1
  6. package/sp-split-view.js.map +3 -3
  7. package/src/SplitView.dev.js +30 -43
  8. package/src/SplitView.dev.js.map +2 -2
  9. package/src/SplitView.js +24 -24
  10. package/src/SplitView.js.map +3 -3
  11. package/src/spectrum-split-view.css.dev.js +1 -1
  12. package/src/spectrum-split-view.css.dev.js.map +1 -1
  13. package/src/spectrum-split-view.css.js +1 -1
  14. package/src/spectrum-split-view.css.js.map +1 -1
  15. package/src/split-view.css.dev.js +1 -1
  16. package/src/split-view.css.dev.js.map +1 -1
  17. package/src/split-view.css.js +1 -1
  18. package/src/split-view.css.js.map +1 -1
package/README.md CHANGED
@@ -66,8 +66,8 @@ Horizontal is the default orientation for the split view and does not require an
66
66
 
67
67
  ```html demo
68
68
  <sp-split-view>
69
- <div>Left panel</div>
70
- <div>Right panel</div>
69
+ <div>Left panel</div>
70
+ <div>Right panel</div>
71
71
  </sp-split-view>
72
72
  ```
73
73
 
@@ -77,26 +77,25 @@ Horizontal is the default orientation for the split view and does not require an
77
77
 
78
78
  ```html demo
79
79
  <sp-split-view
80
- resizable
81
- primary-min="50"
82
- secondary-min="50"
83
- primary-size="100"
84
- label="Resize the horizontal panels"
80
+ resizable
81
+ primary-min="50"
82
+ secondary-min="50"
83
+ primary-size="100"
84
+ label="Resize the horizontal panels"
85
85
  >
86
- <div>
87
- <h1>Left panel</h1>
88
- <p>
89
- Lorem Ipsum is simply dummy text of the printing and typesetting
90
- industry.
91
- </p>
92
- </div>
93
- <div>
94
- <h2>Right panel</h2>
95
- <p>
96
- It is a long established fact that a reader will be distracted by
97
- the readable content of a page when looking at its layout.
98
- </p>
99
- </div>
86
+ <div>
87
+ <h1>Left panel</h1>
88
+ <p>
89
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry.
90
+ </p>
91
+ </div>
92
+ <div>
93
+ <h2>Right panel</h2>
94
+ <p>
95
+ It is a long established fact that a reader will be distracted by the
96
+ readable content of a page when looking at its layout.
97
+ </p>
98
+ </div>
100
99
  </sp-split-view>
101
100
  ```
102
101
 
@@ -106,24 +105,23 @@ Horizontal is the default orientation for the split view and does not require an
106
105
 
107
106
  ```html demo
108
107
  <sp-split-view
109
- resizable
110
- collapsible
111
- label="Resize the horizontal collapsible panels"
108
+ resizable
109
+ collapsible
110
+ label="Resize the horizontal collapsible panels"
112
111
  >
113
- <div>
114
- <h1>Left panel</h1>
115
- <p>
116
- Lorem Ipsum is simply dummy text of the printing and typesetting
117
- industry.
118
- </p>
119
- </div>
120
- <div>
121
- <h2>Right panel</h2>
122
- <p>
123
- It is a long established fact that a reader will be distracted by
124
- the readable content of a page when looking at its layout.
125
- </p>
126
- </div>
112
+ <div>
113
+ <h1>Left panel</h1>
114
+ <p>
115
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry.
116
+ </p>
117
+ </div>
118
+ <div>
119
+ <h2>Right panel</h2>
120
+ <p>
121
+ It is a long established fact that a reader will be distracted by the
122
+ readable content of a page when looking at its layout.
123
+ </p>
124
+ </div>
127
125
  </sp-split-view>
128
126
  ```
129
127
 
@@ -140,8 +138,8 @@ Vertical split view requires the `vertical` attribute to be set.
140
138
 
141
139
  ```html demo
142
140
  <sp-split-view vertical>
143
- <div>Top panel</div>
144
- <div>Bottom panel</div>
141
+ <div>Top panel</div>
142
+ <div>Bottom panel</div>
145
143
  </sp-split-view>
146
144
  ```
147
145
 
@@ -151,27 +149,26 @@ Vertical split view requires the `vertical` attribute to be set.
151
149
 
152
150
  ```html demo
153
151
  <sp-split-view
154
- vertical
155
- resizable
156
- primary-min="50"
157
- primary-max="150"
158
- secondary-min="50"
159
- label="Resize the vertical panels"
152
+ vertical
153
+ resizable
154
+ primary-min="50"
155
+ primary-max="150"
156
+ secondary-min="50"
157
+ label="Resize the vertical panels"
160
158
  >
161
- <div>
162
- <h1>Top panel</h1>
163
- <p>
164
- Lorem Ipsum is simply dummy text of the printing and typesetting
165
- industry.
166
- </p>
167
- </div>
168
- <div>
169
- <h2>Bottom panel</h2>
170
- <p>
171
- It is a long established fact that a reader will be distracted by
172
- the readable content of a page when looking at its layout.
173
- </p>
174
- </div>
159
+ <div>
160
+ <h1>Top panel</h1>
161
+ <p>
162
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry.
163
+ </p>
164
+ </div>
165
+ <div>
166
+ <h2>Bottom panel</h2>
167
+ <p>
168
+ It is a long established fact that a reader will be distracted by the
169
+ readable content of a page when looking at its layout.
170
+ </p>
171
+ </div>
175
172
  </sp-split-view>
176
173
  ```
177
174
 
@@ -181,26 +178,25 @@ Vertical split view requires the `vertical` attribute to be set.
181
178
 
182
179
  ```html demo
183
180
  <sp-split-view
184
- vertical
185
- resizable
186
- collapsible
187
- style="height: 300px;"
188
- label="Resize the vertical collapsible panels"
181
+ vertical
182
+ resizable
183
+ collapsible
184
+ style="height: 300px;"
185
+ label="Resize the vertical collapsible panels"
189
186
  >
190
- <div>
191
- <h1>Top panel</h1>
192
- <p>
193
- Lorem Ipsum is simply dummy text of the printing and typesetting
194
- industry.
195
- </p>
196
- </div>
197
- <div>
198
- <h2>Bottom panel</h2>
199
- <p>
200
- It is a long established fact that a reader will be distracted by
201
- the readable content of a page when looking at its layout.
202
- </p>
203
- </div>
187
+ <div>
188
+ <h1>Top panel</h1>
189
+ <p>
190
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry.
191
+ </p>
192
+ </div>
193
+ <div>
194
+ <h2>Bottom panel</h2>
195
+ <p>
196
+ It is a long established fact that a reader will be distracted by the
197
+ readable content of a page when looking at its layout.
198
+ </p>
199
+ </div>
204
200
  </sp-split-view>
205
201
  ```
206
202
 
@@ -211,48 +207,47 @@ Vertical split view requires the `vertical` attribute to be set.
211
207
 
212
208
  ```html demo
213
209
  <sp-split-view
214
- resizable
215
- primary-min="50"
216
- primary-max="200"
217
- secondary-min="50"
218
- style="height: 400px; width: 600px;"
210
+ resizable
211
+ primary-min="50"
212
+ primary-max="200"
213
+ secondary-min="50"
214
+ style="height: 400px; width: 600px;"
219
215
  >
220
- <div>
221
- <h1>First panel - Level 1</h1>
216
+ <div>
217
+ <h1>First panel - Level 1</h1>
218
+ <p>
219
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry.
220
+ Lorem Ipsum has been the industry's standard dummy text ever since the
221
+ 1500s, when an unknown printer took a galley of type and scrambled it to
222
+ make a type specimen book.
223
+ </p>
224
+ </div>
225
+ <div>
226
+ <h2>Second panel - Level 1</h2>
227
+ <sp-split-view
228
+ vertical
229
+ resizable
230
+ primary-min="50"
231
+ primary-size="100"
232
+ secondary-min="50"
233
+ style="height: 300px;"
234
+ >
235
+ <div>
236
+ <h3>First panel - Level 2</h3>
237
+ <p>
238
+ Lorem Ipsum is simply dummy text of the printing and typesetting
239
+ industry.
240
+ </p>
241
+ </div>
242
+ <div>
243
+ <h4>Second panel - Level 2</h4>
222
244
  <p>
223
- Lorem Ipsum is simply dummy text of the printing and typesetting
224
- industry. Lorem Ipsum has been the industry's standard dummy text
225
- ever since the 1500s, when an unknown printer took a galley of type
226
- and scrambled it to make a type specimen book.
245
+ It is a long established fact that a reader will be distracted by the
246
+ readable content of a page when looking at its layout.
227
247
  </p>
228
- </div>
229
- <div>
230
- <h2>Second panel - Level 1</h2>
231
- <sp-split-view
232
- vertical
233
- resizable
234
- primary-min="50"
235
- primary-size="100"
236
- secondary-min="50"
237
- style="height: 300px;"
238
- >
239
- <div>
240
- <h3>First panel - Level 2</h3>
241
- <p>
242
- Lorem Ipsum is simply dummy text of the printing and
243
- typesetting industry.
244
- </p>
245
- </div>
246
- <div>
247
- <h4>Second panel - Level 2</h4>
248
- <p>
249
- It is a long established fact that a reader will be
250
- distracted by the readable content of a page when looking at
251
- its layout.
252
- </p>
253
- </div>
254
- </sp-split-view>
255
- </div>
248
+ </div>
249
+ </sp-split-view>
250
+ </div>
256
251
  </sp-split-view>
257
252
  ```
258
253
 
package/package.json CHANGED
@@ -1,80 +1,80 @@
1
1
  {
2
- "name": "@spectrum-web-components/split-view",
3
- "version": "1.12.0-next.20260216160808",
4
- "publishConfig": {
5
- "access": "public"
2
+ "name": "@spectrum-web-components/split-view",
3
+ "version": "1.12.0-next.20260218153607",
4
+ "description": "",
5
+ "license": "Apache-2.0",
6
+ "author": "Adobe",
7
+ "homepage": "https://opensource.adobe.com/spectrum-web-components/components/split-view",
8
+ "repository": {
9
+ "directory": "1st-gen/packages/split-view",
10
+ "type": "git",
11
+ "url": "https://github.com/adobe/spectrum-web-components.git"
12
+ },
13
+ "bugs": {
14
+ "url": "https://github.com/adobe/spectrum-web-components/issues"
15
+ },
16
+ "type": "module",
17
+ "exports": {
18
+ ".": {
19
+ "development": "./src/index.dev.js",
20
+ "default": "./src/index.js"
6
21
  },
7
- "description": "",
8
- "license": "Apache-2.0",
9
- "repository": {
10
- "type": "git",
11
- "url": "https://github.com/adobe/spectrum-web-components.git",
12
- "directory": "1st-gen/packages/split-view"
22
+ "./package.json": "./package.json",
23
+ "./sp-split-view.js": {
24
+ "development": "./sp-split-view.dev.js",
25
+ "default": "./sp-split-view.js"
13
26
  },
14
- "author": "Adobe",
15
- "homepage": "https://opensource.adobe.com/spectrum-web-components/components/split-view",
16
- "bugs": {
17
- "url": "https://github.com/adobe/spectrum-web-components/issues"
27
+ "./src/SplitView.js": {
28
+ "development": "./src/SplitView.dev.js",
29
+ "default": "./src/SplitView.js"
18
30
  },
19
- "main": "./src/index.js",
20
- "module": "./src/index.js",
21
- "type": "module",
22
- "exports": {
23
- ".": {
24
- "development": "./src/index.dev.js",
25
- "default": "./src/index.js"
26
- },
27
- "./package.json": "./package.json",
28
- "./src/SplitView.js": {
29
- "development": "./src/SplitView.dev.js",
30
- "default": "./src/SplitView.js"
31
- },
32
- "./src/index.js": {
33
- "development": "./src/index.dev.js",
34
- "default": "./src/index.js"
35
- },
36
- "./src/split-view-overrides.css.js": "./src/split-view-overrides.css.js",
37
- "./src/split-view.css.js": "./src/split-view.css.js",
38
- "./src/types.js": {
39
- "development": "./src/types.dev.js",
40
- "default": "./src/types.js"
41
- },
42
- "./sp-split-view.js": {
43
- "development": "./sp-split-view.dev.js",
44
- "default": "./sp-split-view.js"
45
- }
31
+ "./src/index.js": {
32
+ "development": "./src/index.dev.js",
33
+ "default": "./src/index.js"
46
34
  },
47
- "scripts": {
48
- "test": "echo \"Error: run tests from mono-repo root.\" && exit 1"
49
- },
50
- "files": [
51
- "**/*.d.ts",
52
- "**/*.js",
53
- "**/*.js.map",
54
- "custom-elements.json",
55
- "!stories/",
56
- "!test/"
57
- ],
58
- "keywords": [
59
- "design-system",
60
- "spectrum",
61
- "adobe",
62
- "adobe-spectrum",
63
- "web components",
64
- "web-components",
65
- "lit-element",
66
- "lit-html",
67
- "component",
68
- "css"
69
- ],
70
- "dependencies": {
71
- "@spectrum-web-components/base": "1.12.0-next.20260216160808",
72
- "@spectrum-web-components/shared": "1.12.0-next.20260216160808"
73
- },
74
- "types": "./src/index.d.ts",
75
- "customElements": "custom-elements.json",
76
- "sideEffects": [
77
- "./sp-*.js",
78
- "./**/*.dev.js"
79
- ]
35
+ "./src/split-view-overrides.css.js": "./src/split-view-overrides.css.js",
36
+ "./src/split-view.css.js": "./src/split-view.css.js",
37
+ "./src/types.js": {
38
+ "development": "./src/types.dev.js",
39
+ "default": "./src/types.js"
40
+ }
41
+ },
42
+ "main": "./src/index.js",
43
+ "module": "./src/index.js",
44
+ "files": [
45
+ "**/*.d.ts",
46
+ "**/*.js",
47
+ "**/*.js.map",
48
+ "custom-elements.json",
49
+ "!stories/",
50
+ "!test/"
51
+ ],
52
+ "scripts": {
53
+ "test": "echo \"Error: run tests from mono-repo root.\" && exit 1"
54
+ },
55
+ "sideEffects": [
56
+ "./sp-*.js",
57
+ "./**/*.dev.js"
58
+ ],
59
+ "types": "./src/index.d.ts",
60
+ "dependencies": {
61
+ "@spectrum-web-components/base": "1.12.0-next.20260218153607",
62
+ "@spectrum-web-components/shared": "1.12.0-next.20260218153607"
63
+ },
64
+ "keywords": [
65
+ "design-system",
66
+ "spectrum",
67
+ "adobe",
68
+ "adobe-spectrum",
69
+ "web components",
70
+ "web-components",
71
+ "lit-element",
72
+ "lit-html",
73
+ "component",
74
+ "css"
75
+ ],
76
+ "publishConfig": {
77
+ "access": "public"
78
+ },
79
+ "customElements": "custom-elements.json"
80
80
  }
package/sp-split-view.dev.js CHANGED
@@ -1,5 +1,5 @@
1
1
  "use strict";
2
- import { SplitView } from "./src/SplitView.dev.js";
3
2
  import { defineElement } from "@spectrum-web-components/base/src/define-element.js";
3
+ import { SplitView } from "./src/SplitView.dev.js";
4
4
  defineElement("sp-split-view", SplitView);
5
5
  //# sourceMappingURL=sp-split-view.dev.js.map
package/sp-split-view.dev.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["sp-split-view.ts"],
4
- "sourcesContent": ["/**\n * Copyright 2025 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { SplitView } from './src/SplitView.dev.js'\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\n\ndefineElement('sp-split-view', SplitView);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-split-view': SplitView;\n }\n}\n"],
5
- "mappings": ";AAYA,SAAS,iBAAiB;AAC1B,SAAS,qBAAqB;AAE9B,cAAc,iBAAiB,SAAS;",
4
+ "sourcesContent": ["/**\n * Copyright 2025 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\n\nimport { SplitView } from './src/SplitView.dev.js'\n\ndefineElement('sp-split-view', SplitView);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-split-view': SplitView;\n }\n}\n"],
5
+ "mappings": ";AAYA,SAAS,qBAAqB;AAE9B,SAAS,iBAAiB;AAE1B,cAAc,iBAAiB,SAAS;",
6
6
  "names": []
7
7
  }
package/sp-split-view.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";import{SplitView as e}from"./src/SplitView.js";import{defineElement as i}from"@spectrum-web-components/base/src/define-element.js";i("sp-split-view",e);
1
+ "use strict";import{defineElement as e}from"@spectrum-web-components/base/src/define-element.js";import{SplitView as i}from"./src/SplitView.js";e("sp-split-view",i);
2
2
  //# sourceMappingURL=sp-split-view.js.map
package/sp-split-view.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["sp-split-view.ts"],
4
- "sourcesContent": ["/**\n * Copyright 2025 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { SplitView } from './src/SplitView.js';\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\n\ndefineElement('sp-split-view', SplitView);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-split-view': SplitView;\n }\n}\n"],
5
- "mappings": "aAYA,OAAS,aAAAA,MAAiB,qBAC1B,OAAS,iBAAAC,MAAqB,sDAE9BA,EAAc,gBAAiBD,CAAS",
6
- "names": ["SplitView", "defineElement"]
4
+ "sourcesContent": ["/**\n * Copyright 2025 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { defineElement } from '@spectrum-web-components/base/src/define-element.js';\n\nimport { SplitView } from './src/SplitView.js';\n\ndefineElement('sp-split-view', SplitView);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'sp-split-view': SplitView;\n }\n}\n"],
5
+ "mappings": "aAYA,OAAS,iBAAAA,MAAqB,sDAE9B,OAAS,aAAAC,MAAiB,qBAE1BD,EAAc,gBAAiBC,CAAS",
6
+ "names": ["defineElement", "SplitView"]
7
7
  }
package/src/SplitView.dev.js CHANGED
@@ -14,15 +14,15 @@ import {
14
14
  nothing,
15
15
  SpectrumElement
16
16
  } from "@spectrum-web-components/base";
17
- import {
18
- classMap,
19
- ifDefined
20
- } from "@spectrum-web-components/base/src/directives.js";
21
17
  import {
22
18
  property,
23
19
  query,
24
20
  state
25
21
  } from "@spectrum-web-components/base/src/decorators.js";
22
+ import {
23
+ classMap,
24
+ ifDefined
25
+ } from "@spectrum-web-components/base/src/directives.js";
26
26
  import { streamingListener } from "@spectrum-web-components/base/src/streaming-listener.js";
27
27
  import { randomID } from "@spectrum-web-components/shared/src/random-id.js";
28
28
  import styles from "./split-view.css.js";
@@ -76,9 +76,7 @@ export class SplitView extends SpectrumElement {
76
76
  if (!this._splitterSize) {
77
77
  this._splitterSize = this.splitter && Math.round(
78
78
  parseFloat(
79
- window.getComputedStyle(this.splitter).getPropertyValue(
80
- this.vertical ? "height" : "width"
81
- )
79
+ window.getComputedStyle(this.splitter).getPropertyValue(this.vertical ? "height" : "width")
82
80
  )
83
81
  ) || SPLITTERSIZE;
84
82
  }
@@ -97,49 +95,41 @@ export class SplitView extends SpectrumElement {
97
95
  };
98
96
  const label = this.resizable ? this.label || "Resize the panels" : void 0;
99
97
  return html`
100
- <slot
101
- id=${ifDefined(
102
- this.resizable ? (_a = this.controlledEl) == null ? void 0 : _a.id : void 0
103
- )}
104
- @slotchange=${this.onContentSlotChange}
105
- style="--spectrum-split-view-first-pane-size: ${this.firstPaneSize}"
106
- ></slot>
107
- ${this.enoughChildren ? html`
108
- <div
109
- id="splitter"
110
- class=${classMap(splitterClasses)}
111
- role="separator"
112
- aria-controls=${ifDefined(
98
+ <slot
99
+ id=${ifDefined(this.resizable ? (_a = this.controlledEl) == null ? void 0 : _a.id : void 0)}
100
+ @slotchange=${this.onContentSlotChange}
101
+ style="--spectrum-split-view-first-pane-size: ${this.firstPaneSize}"
102
+ ></slot>
103
+ ${this.enoughChildren ? html`
104
+ <div
105
+ id="splitter"
106
+ class=${classMap(splitterClasses)}
107
+ role="separator"
108
+ aria-controls=${ifDefined(
113
109
  this.resizable ? (_b = this.controlledEl) == null ? void 0 : _b.id : void 0
114
110
  )}
115
- aria-label=${ifDefined(label)}
116
- aria-orientation=${this.vertical ? "horizontal" : "vertical"}
117
- aria-valuenow=${Math.round(
111
+ aria-label=${ifDefined(label)}
112
+ aria-orientation=${this.vertical ? "horizontal" : "vertical"}
113
+ aria-valuenow=${Math.round(
118
114
  parseFloat(this.firstPaneSize) / this.viewSize * 100
119
115
  )}
120
- tabindex=${ifDefined(
121
- this.resizable ? "0" : void 0
122
- )}
123
- @keydown=${this.onKeydown}
124
- ${streamingListener({
116
+ tabindex=${ifDefined(this.resizable ? "0" : void 0)}
117
+ @keydown=${this.onKeydown}
118
+ ${streamingListener({
125
119
  start: ["pointerdown", this.onPointerdown],
126
120
  streamInside: ["pointermove", this.onPointermove],
127
121
  end: [
128
- [
129
- "pointerup",
130
- "pointercancel",
131
- "pointerleave"
132
- ],
122
+ ["pointerup", "pointercancel", "pointerleave"],
133
123
  this.onPointerup
134
124
  ]
135
125
  })}
136
- >
137
- ${this.resizable ? html`
138
- <div id="gripper"></div>
139
- ` : nothing}
140
- </div>
126
+ >
127
+ ${this.resizable ? html`
128
+ <div id="gripper"></div>
141
129
  ` : nothing}
142
- `;
130
+ </div>
131
+ ` : nothing}
132
+ `;
143
133
  }
144
134
  onContentSlotChange(event) {
145
135
  if (this.controlledEl && this.controlledElIDApplied) {
@@ -245,10 +235,7 @@ export class SplitView extends SpectrumElement {
245
235
  }
246
236
  updateMinMax() {
247
237
  this.viewSize = this.vertical ? this.offsetHeight : this.offsetWidth;
248
- this.minPos = Math.max(
249
- this.primaryMin,
250
- this.viewSize - this.secondaryMax
251
- );
238
+ this.minPos = Math.max(this.primaryMin, this.viewSize - this.secondaryMax);
252
239
  this.maxPos = Math.min(
253
240
  this.primaryMax,
254
241
  this.viewSize - Math.max(this.secondaryMin, this.splitterSize)