@vscode-elements/elements 1.14.1-pre.0 → 1.14.1-pre.2
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.
- package/custom-elements.json +1422 -1113
- package/dist/bundled.js +253 -244
- package/dist/includes/VscElement.js +1 -1
- package/dist/includes/VscElement.js.map +1 -1
- package/dist/includes/vscode-select/styles.d.ts.map +1 -1
- package/dist/includes/vscode-select/styles.js +46 -10
- package/dist/includes/vscode-select/styles.js.map +1 -1
- package/dist/includes/vscode-select/vscode-select-base.d.ts +11 -2
- package/dist/includes/vscode-select/vscode-select-base.d.ts.map +1 -1
- package/dist/includes/vscode-select/vscode-select-base.js +241 -65
- package/dist/includes/vscode-select/vscode-select-base.js.map +1 -1
- package/dist/vscode-multi-select/vscode-multi-select.d.ts +8 -3
- package/dist/vscode-multi-select/vscode-multi-select.d.ts.map +1 -1
- package/dist/vscode-multi-select/vscode-multi-select.js +86 -124
- package/dist/vscode-multi-select/vscode-multi-select.js.map +1 -1
- package/dist/vscode-single-select/vscode-single-select.d.ts +9 -4
- package/dist/vscode-single-select/vscode-single-select.d.ts.map +1 -1
- package/dist/vscode-single-select/vscode-single-select.js +27 -69
- package/dist/vscode-single-select/vscode-single-select.js.map +1 -1
- package/package.json +2 -1
- package/vscode.css-custom-data.json +7 -7
- package/vscode.html-custom-data.json +15 -13
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VscElement.js","sourceRoot":"","sources":["../../src/includes/VscElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAC,MAAM,KAAK,CAAC;AAE/B,MAAM,OAAO,GAAG,cAAc,CAAC;AAC/B,MAAM,UAAU,GAAG,2CAA2C,CAAC;AAE/D,MAAM,OAAO,UAAW,SAAQ,UAAU;IACxC,8BAA8B;IAC9B,IAAI,OAAO;QACT,OAAO,OAAO,CAAC;IACjB,CAAC;CACF;AASD;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,OAAe,EAAE,EAAE;IAC/C,OAAO,CAAC,aAAiC,EAAE,EAAE;QAC3C,MAAM,kBAAkB,GAAG,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;QAEvD,IAAI,CAAC,kBAAkB,EAAE,CAAC;YACxB,cAAc,CAAC,MAAM,CAAC,OAAO,EAAE,aAAyC,CAAC,CAAC;YAC1E,OAAO;QACT,CAAC;QAED,IAAI,UAAU,IAAI,MAAM,EAAE,CAAC;YACzB,OAAO;QACT,CAAC;QAED,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QAC3C,MAAM,cAAc,GAAI,EAAiB,EAAE,OAAO,CAAC;QACnD,IAAI,OAAO,GAAG,EAAE,CAAC;QAEjB,IAAI,CAAC,cAAc,EAAE,CAAC;YACpB,OAAO,CAAC,IAAI,CACV,OAAO,EACP,mEAAmE,CACpE,CAAC;YACF,OAAO;gBACL,mEAAmE,CAAC;QACxE,CAAC;aAAM,IAAI,cAAc,KAAK,OAAO,EAAE,CAAC;YACtC,OAAO;gBACL,mEAAmE,CAAC;YACtE,OAAO,IAAI,oBAAoB,OAAO,8BAA8B,cAAc,IAAI,CAAC;QACzF,CAAC;aAAM,CAAC;YACN,OAAO;gBACL,gEAAgE,CAAC;QACrE,CAAC;QAED,OAAO,CAAC,IAAI,CACV,qBAAqB,OAAO,IAAI,OAAO,0CAA0C,UAAU,UAAU,CACtG,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {LitElement} from 'lit';\n\nconst VERSION = '1.14.1-pre.
|
|
1
|
+
{"version":3,"file":"VscElement.js","sourceRoot":"","sources":["../../src/includes/VscElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAC,MAAM,KAAK,CAAC;AAE/B,MAAM,OAAO,GAAG,cAAc,CAAC;AAC/B,MAAM,UAAU,GAAG,2CAA2C,CAAC;AAE/D,MAAM,OAAO,UAAW,SAAQ,UAAU;IACxC,8BAA8B;IAC9B,IAAI,OAAO;QACT,OAAO,OAAO,CAAC;IACjB,CAAC;CACF;AASD;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,OAAe,EAAE,EAAE;IAC/C,OAAO,CAAC,aAAiC,EAAE,EAAE;QAC3C,MAAM,kBAAkB,GAAG,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;QAEvD,IAAI,CAAC,kBAAkB,EAAE,CAAC;YACxB,cAAc,CAAC,MAAM,CAAC,OAAO,EAAE,aAAyC,CAAC,CAAC;YAC1E,OAAO;QACT,CAAC;QAED,IAAI,UAAU,IAAI,MAAM,EAAE,CAAC;YACzB,OAAO;QACT,CAAC;QAED,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QAC3C,MAAM,cAAc,GAAI,EAAiB,EAAE,OAAO,CAAC;QACnD,IAAI,OAAO,GAAG,EAAE,CAAC;QAEjB,IAAI,CAAC,cAAc,EAAE,CAAC;YACpB,OAAO,CAAC,IAAI,CACV,OAAO,EACP,mEAAmE,CACpE,CAAC;YACF,OAAO;gBACL,mEAAmE,CAAC;QACxE,CAAC;aAAM,IAAI,cAAc,KAAK,OAAO,EAAE,CAAC;YACtC,OAAO;gBACL,mEAAmE,CAAC;YACtE,OAAO,IAAI,oBAAoB,OAAO,8BAA8B,cAAc,IAAI,CAAC;QACzF,CAAC;aAAM,CAAC;YACN,OAAO;gBACL,gEAAgE,CAAC;QACrE,CAAC;QAED,OAAO,CAAC,IAAI,CACV,qBAAqB,OAAO,IAAI,OAAO,0CAA0C,UAAU,UAAU,CACtG,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import {LitElement} from 'lit';\n\nconst VERSION = '1.14.1-pre.2';\nconst CONFIG_KEY = '__vscodeElements_disableRegistryWarning__';\n\nexport class VscElement extends LitElement {\n /** VSCode Elements version */\n get version(): string {\n return VERSION;\n }\n}\n\ntype CustomElementClass = Omit<typeof HTMLElement, 'new'>;\n\nexport type Constructor<T> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n new (...args: any[]): T;\n};\n\n/**\n * Own implementation of Lit's customElement decorator.\n */\nexport const customElement = (tagName: string) => {\n return (classOrTarget: CustomElementClass) => {\n const customElementClass = customElements.get(tagName);\n\n if (!customElementClass) {\n customElements.define(tagName, classOrTarget as CustomElementConstructor);\n return;\n }\n\n if (CONFIG_KEY in window) {\n return;\n }\n\n const el = document.createElement(tagName);\n const anotherVersion = (el as VscElement)?.version;\n let message = '';\n\n if (!anotherVersion) {\n console.warn(\n tagName,\n 'is already registered by an unknown custom element handler class.'\n );\n message +=\n 'is already registered by an unknown custom element handler class.';\n } else if (anotherVersion !== VERSION) {\n message +=\n 'is already registered by a different version of VSCode Elements. ';\n message += `This version is \"${VERSION}\", while the other one is \"${anotherVersion}\".`;\n } else {\n message +=\n 'is already registered by the same version of VSCode Elements. ';\n }\n\n console.warn(\n `[VSCode Elements] ${tagName} ${message}\\nTo suppress this warning, set window.${CONFIG_KEY} to true`\n );\n };\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/includes/vscode-select/styles.ts"],"names":[],"mappings":";AAGA,
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/includes/vscode-select/styles.ts"],"names":[],"mappings":";AAGA,wBAyXE"}
|
|
@@ -183,19 +183,22 @@ export default [
|
|
|
183
183
|
|
|
184
184
|
.option {
|
|
185
185
|
align-items: center;
|
|
186
|
+
box-sizing: border-box;
|
|
186
187
|
color: var(--vscode-foreground, #cccccc);
|
|
187
188
|
cursor: pointer;
|
|
188
189
|
display: flex;
|
|
189
190
|
font-family: var(--vscode-font-family, sans-serif);
|
|
190
191
|
font-size: var(--vscode-font-size, 13px);
|
|
191
192
|
font-weight: var(--vscode-font-weight, normal);
|
|
193
|
+
height: 22px;
|
|
192
194
|
line-height: 18px;
|
|
193
195
|
min-height: calc(var(--vscode-font-size) * 1.3);
|
|
194
196
|
padding: 1px 3px;
|
|
195
197
|
user-select: none;
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
198
|
+
outline-color: transparent;
|
|
199
|
+
outline-offset: -1px;
|
|
200
|
+
outline-style: solid;
|
|
201
|
+
outline-width: 1px;
|
|
199
202
|
}
|
|
200
203
|
|
|
201
204
|
.option b {
|
|
@@ -215,8 +218,9 @@ export default [
|
|
|
215
218
|
.option:hover,
|
|
216
219
|
:host-context(body[data-vscode-theme-kind='vscode-high-contrast-light'])
|
|
217
220
|
.option:hover {
|
|
218
|
-
|
|
219
|
-
|
|
221
|
+
outline-style: dotted;
|
|
222
|
+
outline-color: var(--vscode-list-focusOutline, #0078d4);
|
|
223
|
+
outline-width: 1px;
|
|
220
224
|
}
|
|
221
225
|
|
|
222
226
|
.option.disabled {
|
|
@@ -228,17 +232,49 @@ export default [
|
|
|
228
232
|
.option.active:hover {
|
|
229
233
|
background-color: var(--vscode-list-activeSelectionBackground, #04395e);
|
|
230
234
|
color: var(--vscode-list-activeSelectionForeground, #ffffff);
|
|
231
|
-
|
|
235
|
+
outline-color: var(--vscode-list-activeSelectionBackground, #04395e);
|
|
236
|
+
outline-style: solid;
|
|
237
|
+
outline-width: 1px;
|
|
238
|
+
}
|
|
239
|
+
|
|
240
|
+
.no-options {
|
|
241
|
+
align-items: center;
|
|
242
|
+
border-color: transparent;
|
|
232
243
|
border-style: solid;
|
|
233
244
|
border-width: 1px;
|
|
245
|
+
color: var(--vscode-foreground, #cccccc);
|
|
246
|
+
cursor: default;
|
|
247
|
+
display: flex;
|
|
248
|
+
font-family: var(--vscode-font-family, sans-serif);
|
|
249
|
+
font-size: var(--vscode-font-size, 13px);
|
|
250
|
+
font-weight: var(--vscode-font-weight, normal);
|
|
251
|
+
line-height: 18px;
|
|
252
|
+
min-height: calc(var(--vscode-font-size) * 1.3);
|
|
253
|
+
opacity: 0.85;
|
|
254
|
+
padding: 1px 3px;
|
|
255
|
+
user-select: none;
|
|
256
|
+
}
|
|
257
|
+
|
|
258
|
+
.placeholder {
|
|
259
|
+
overflow: hidden;
|
|
260
|
+
text-overflow: ellipsis;
|
|
261
|
+
white-space: nowrap;
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
.placeholder span {
|
|
265
|
+
font-weight: bold;
|
|
266
|
+
}
|
|
267
|
+
|
|
268
|
+
.placeholder:not(.disabled):hover {
|
|
269
|
+
color: var(--vscode-list-activeSelectionForeground, #ffffff);
|
|
234
270
|
}
|
|
235
271
|
|
|
236
272
|
:host-context(body[data-vscode-theme-kind='vscode-high-contrast'])
|
|
237
273
|
.option.active,
|
|
238
274
|
:host-context(body[data-vscode-theme-kind='vscode-high-contrast-light'])
|
|
239
275
|
.option.active:hover {
|
|
240
|
-
|
|
241
|
-
|
|
276
|
+
outline-color: var(--vscode-list-focusOutline, #0078d4);
|
|
277
|
+
outline-style: dashed;
|
|
242
278
|
}
|
|
243
279
|
|
|
244
280
|
.option-label {
|
|
@@ -249,13 +285,13 @@ export default [
|
|
|
249
285
|
|
|
250
286
|
.dropdown.multiple .option.selected {
|
|
251
287
|
background-color: var(--vscode-list-hoverBackground, #2a2d2e);
|
|
252
|
-
|
|
288
|
+
outline-color: var(--vscode-list-hoverBackground, #2a2d2e);
|
|
253
289
|
}
|
|
254
290
|
|
|
255
291
|
.dropdown.multiple .option.selected.active {
|
|
256
292
|
background-color: var(--vscode-list-activeSelectionBackground, #04395e);
|
|
257
293
|
color: var(--vscode-list-activeSelectionForeground, #ffffff);
|
|
258
|
-
|
|
294
|
+
outline-color: var(--vscode-list-activeSelectionBackground, #04395e);
|
|
259
295
|
}
|
|
260
296
|
|
|
261
297
|
.checkbox-icon {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/includes/vscode-select/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,OAAO,aAAa,MAAM,sBAAsB,CAAC;AAEjD,eAAe;IACb,aAAa;IACb,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkVF;CACF,CAAC","sourcesContent":["import {css} from 'lit';\nimport defaultStyles from '../default.styles.js';\n\nexport default [\n defaultStyles,\n css`\n :host {\n display: inline-block;\n max-width: 100%;\n outline: none;\n position: relative;\n width: 320px;\n }\n\n .main-slot {\n display: none;\n }\n\n .select-face,\n .combobox-face {\n background-color: var(--vscode-settings-dropdownBackground, #313131);\n border-color: var(--vscode-settings-dropdownBorder, #3c3c3c);\n border-radius: 2px;\n border-style: solid;\n border-width: 1px;\n box-sizing: border-box;\n color: var(--vscode-settings-dropdownForeground, #cccccc);\n font-family: var(--vscode-font-family, sans-serif);\n font-size: var(--vscode-font-size, 13px);\n font-weight: var(--vscode-font-weight, normal);\n line-height: 18px;\n position: relative;\n user-select: none;\n width: 100%;\n }\n\n :host([invalid]) .select-face,\n :host(:invalid) .select-face,\n :host([invalid]) .combobox-face,\n :host(:invalid) .combobox-face {\n background-color: var(--vscode-inputValidation-errorBackground, #5a1d1d);\n border-color: var(--vscode-inputValidation-errorBorder, #be1100);\n }\n\n .select-face {\n cursor: pointer;\n display: block;\n padding: 3px 4px;\n }\n\n .select-face .text {\n display: block;\n height: 18px;\n overflow: hidden;\n }\n\n .select-face.multiselect {\n padding: 0;\n }\n\n .select-face-badge {\n background-color: var(--vscode-badge-background, #616161);\n border-radius: 2px;\n color: var(--vscode-badge-foreground, #f8f8f8);\n display: inline-block;\n flex-shrink: 0;\n font-size: 11px;\n line-height: 16px;\n margin: 2px;\n padding: 2px 3px;\n text-transform: uppercase;\n white-space: nowrap;\n }\n\n .select-face-badge.no-item {\n background-color: transparent;\n color: inherit;\n }\n\n .combobox-face {\n display: flex;\n }\n\n :host(:focus) .select-face,\n :host(:focus) .combobox-face,\n :host([focused]) .select-face,\n :host([focused]) .combobox-face {\n border-color: var(--vscode-focusBorder, #0078d4);\n outline: none;\n }\n\n .combobox-input {\n background-color: transparent;\n box-sizing: border-box;\n border: 0;\n color: var(--vscode-foreground, #cccccc);\n display: block;\n font-family: var(--vscode-font-family, sans-serif);\n font-size: var(--vscode-font-size, 13px);\n line-height: 16px;\n padding: 4px;\n width: 100%;\n }\n\n .combobox-input:focus {\n outline: none;\n }\n\n .combobox-button {\n background-color: transparent;\n border: 0;\n color: var(--vscode-foreground, #cccccc);\n cursor: pointer;\n flex-shrink: 0;\n height: 24px;\n margin: 0;\n padding: 0;\n width: 30px;\n }\n\n .combobox-button:focus,\n .combobox-button:hover {\n background-color: var(--vscode-list-hoverBackground, #2a2d2e);\n }\n\n .combobox-button:focus {\n outline: 0;\n }\n\n .icon {\n color: var(--vscode-foreground, #cccccc);\n display: block;\n height: 14px;\n pointer-events: none;\n position: absolute;\n right: 8px;\n top: 5px;\n width: 14px;\n }\n\n .icon svg {\n color: var(--vscode-foreground, #cccccc);\n height: 100%;\n width: 100%;\n }\n\n .dropdown {\n background-color: var(--vscode-settings-dropdownBackground, #313131);\n border-color: var(--vscode-settings-dropdownListBorder, #454545);\n border-radius: 0 0 3px 3px;\n border-style: solid;\n border-width: 1px;\n box-sizing: border-box;\n left: 0;\n padding-bottom: 2px;\n position: absolute;\n top: 100%;\n width: 100%;\n z-index: var(--dropdown-z-index, 2);\n }\n\n :host([position='above']) .dropdown {\n border-radius: 3px 3px 0 0;\n bottom: 26px;\n padding-bottom: 0;\n padding-top: 2px;\n top: auto;\n }\n\n :host(:focus) .dropdown,\n :host([focused]) .dropdown {\n border-color: var(--vscode-focusBorder, #0078d4);\n }\n\n .options {\n box-sizing: border-box;\n cursor: pointer;\n list-style: none;\n margin: 0;\n max-height: 222px;\n overflow: auto;\n padding: 1px;\n }\n\n .option {\n align-items: center;\n color: var(--vscode-foreground, #cccccc);\n cursor: pointer;\n display: flex;\n font-family: var(--vscode-font-family, sans-serif);\n font-size: var(--vscode-font-size, 13px);\n font-weight: var(--vscode-font-weight, normal);\n line-height: 18px;\n min-height: calc(var(--vscode-font-size) * 1.3);\n padding: 1px 3px;\n user-select: none;\n border-width: 1px;\n border-style: solid;\n border-color: transparent;\n }\n\n .option b {\n color: var(--vscode-list-highlightForeground, #2aaaff);\n }\n\n .option.active b {\n color: var(--vscode-list-focusHighlightForeground, #2aaaff);\n }\n\n .option:not(.disabled):hover {\n background-color: var(--vscode-list-hoverBackground, #2a2d2e);\n color: var(--vscode-list-hoverForeground, #ffffff);\n }\n\n :host-context(body[data-vscode-theme-kind='vscode-high-contrast'])\n .option:hover,\n :host-context(body[data-vscode-theme-kind='vscode-high-contrast-light'])\n .option:hover {\n border-style: dotted;\n border-color: var(--vscode-list-focusOutline, #0078d4);\n }\n\n .option.disabled {\n cursor: not-allowed;\n opacity: 0.4;\n }\n\n .option.active,\n .option.active:hover {\n background-color: var(--vscode-list-activeSelectionBackground, #04395e);\n color: var(--vscode-list-activeSelectionForeground, #ffffff);\n border-color: var(--vscode-list-activeSelectionBackground, #04395e);\n border-style: solid;\n border-width: 1px;\n }\n\n :host-context(body[data-vscode-theme-kind='vscode-high-contrast'])\n .option.active,\n :host-context(body[data-vscode-theme-kind='vscode-high-contrast-light'])\n .option.active:hover {\n border-color: var(--vscode-list-focusOutline, #0078d4);\n border-style: dashed;\n }\n\n .option-label {\n display: block;\n pointer-events: none;\n width: 100%;\n }\n\n .dropdown.multiple .option.selected {\n background-color: var(--vscode-list-hoverBackground, #2a2d2e);\n border-color: var(--vscode-list-hoverBackground, #2a2d2e);\n }\n\n .dropdown.multiple .option.selected.active {\n background-color: var(--vscode-list-activeSelectionBackground, #04395e);\n color: var(--vscode-list-activeSelectionForeground, #ffffff);\n border-color: var(--vscode-list-activeSelectionBackground, #04395e);\n }\n\n .checkbox-icon {\n background-color: var(--vscode-settings-checkboxBackground, #313131);\n border: 1px solid currentColor;\n border-radius: 2px;\n box-sizing: border-box;\n height: 14px;\n margin-right: 5px;\n overflow: hidden;\n position: relative;\n width: 14px;\n }\n\n .checkbox-icon.checked:before,\n .checkbox-icon.checked:after {\n content: '';\n display: block;\n height: 5px;\n position: absolute;\n transform: rotate(-45deg);\n width: 10px;\n }\n\n .checkbox-icon.checked:before {\n background-color: var(--vscode-foreground, #cccccc);\n left: 1px;\n top: 2.5px;\n }\n\n .checkbox-icon.checked:after {\n background-color: var(--vscode-settings-checkboxBackground, #313131);\n left: 1px;\n top: -0.5px;\n }\n\n .dropdown-controls {\n display: flex;\n justify-content: flex-end;\n padding: 4px;\n }\n\n .dropdown-controls :not(:last-child) {\n margin-right: 4px;\n }\n\n .action-icon {\n align-items: center;\n background-color: transparent;\n border: 0;\n color: var(--vscode-foreground, #cccccc);\n cursor: pointer;\n display: flex;\n height: 24px;\n justify-content: center;\n padding: 0;\n width: 24px;\n }\n\n .action-icon:focus {\n outline: none;\n }\n\n .action-icon:focus-visible {\n outline: 1px solid var(--vscode-focusBorder, #0078d4);\n outline-offset: -1px;\n }\n\n .description {\n border-color: var(--vscode-settings-dropdownBorder, #3c3c3c);\n border-style: solid;\n border-width: 1px 0 0;\n color: var(--vscode-foreground, #cccccc);\n font-family: var(--vscode-font-family, sans-serif);\n font-size: var(--vscode-font-size, 13px);\n font-weight: var(--vscode-font-weight, normal);\n line-height: 1.3;\n padding: 6px 4px;\n word-wrap: break-word;\n }\n\n :host([position='above']) .description {\n border-width: 0 0 1px;\n }\n `,\n];\n"]}
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/includes/vscode-select/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,OAAO,aAAa,MAAM,sBAAsB,CAAC;AAEjD,eAAe;IACb,aAAa;IACb,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsXF;CACF,CAAC","sourcesContent":["import {css} from 'lit';\nimport defaultStyles from '../default.styles.js';\n\nexport default [\n defaultStyles,\n css`\n :host {\n display: inline-block;\n max-width: 100%;\n outline: none;\n position: relative;\n width: 320px;\n }\n\n .main-slot {\n display: none;\n }\n\n .select-face,\n .combobox-face {\n background-color: var(--vscode-settings-dropdownBackground, #313131);\n border-color: var(--vscode-settings-dropdownBorder, #3c3c3c);\n border-radius: 2px;\n border-style: solid;\n border-width: 1px;\n box-sizing: border-box;\n color: var(--vscode-settings-dropdownForeground, #cccccc);\n font-family: var(--vscode-font-family, sans-serif);\n font-size: var(--vscode-font-size, 13px);\n font-weight: var(--vscode-font-weight, normal);\n line-height: 18px;\n position: relative;\n user-select: none;\n width: 100%;\n }\n\n :host([invalid]) .select-face,\n :host(:invalid) .select-face,\n :host([invalid]) .combobox-face,\n :host(:invalid) .combobox-face {\n background-color: var(--vscode-inputValidation-errorBackground, #5a1d1d);\n border-color: var(--vscode-inputValidation-errorBorder, #be1100);\n }\n\n .select-face {\n cursor: pointer;\n display: block;\n padding: 3px 4px;\n }\n\n .select-face .text {\n display: block;\n height: 18px;\n overflow: hidden;\n }\n\n .select-face.multiselect {\n padding: 0;\n }\n\n .select-face-badge {\n background-color: var(--vscode-badge-background, #616161);\n border-radius: 2px;\n color: var(--vscode-badge-foreground, #f8f8f8);\n display: inline-block;\n flex-shrink: 0;\n font-size: 11px;\n line-height: 16px;\n margin: 2px;\n padding: 2px 3px;\n text-transform: uppercase;\n white-space: nowrap;\n }\n\n .select-face-badge.no-item {\n background-color: transparent;\n color: inherit;\n }\n\n .combobox-face {\n display: flex;\n }\n\n :host(:focus) .select-face,\n :host(:focus) .combobox-face,\n :host([focused]) .select-face,\n :host([focused]) .combobox-face {\n border-color: var(--vscode-focusBorder, #0078d4);\n outline: none;\n }\n\n .combobox-input {\n background-color: transparent;\n box-sizing: border-box;\n border: 0;\n color: var(--vscode-foreground, #cccccc);\n display: block;\n font-family: var(--vscode-font-family, sans-serif);\n font-size: var(--vscode-font-size, 13px);\n line-height: 16px;\n padding: 4px;\n width: 100%;\n }\n\n .combobox-input:focus {\n outline: none;\n }\n\n .combobox-button {\n background-color: transparent;\n border: 0;\n color: var(--vscode-foreground, #cccccc);\n cursor: pointer;\n flex-shrink: 0;\n height: 24px;\n margin: 0;\n padding: 0;\n width: 30px;\n }\n\n .combobox-button:focus,\n .combobox-button:hover {\n background-color: var(--vscode-list-hoverBackground, #2a2d2e);\n }\n\n .combobox-button:focus {\n outline: 0;\n }\n\n .icon {\n color: var(--vscode-foreground, #cccccc);\n display: block;\n height: 14px;\n pointer-events: none;\n position: absolute;\n right: 8px;\n top: 5px;\n width: 14px;\n }\n\n .icon svg {\n color: var(--vscode-foreground, #cccccc);\n height: 100%;\n width: 100%;\n }\n\n .dropdown {\n background-color: var(--vscode-settings-dropdownBackground, #313131);\n border-color: var(--vscode-settings-dropdownListBorder, #454545);\n border-radius: 0 0 3px 3px;\n border-style: solid;\n border-width: 1px;\n box-sizing: border-box;\n left: 0;\n padding-bottom: 2px;\n position: absolute;\n top: 100%;\n width: 100%;\n z-index: var(--dropdown-z-index, 2);\n }\n\n :host([position='above']) .dropdown {\n border-radius: 3px 3px 0 0;\n bottom: 26px;\n padding-bottom: 0;\n padding-top: 2px;\n top: auto;\n }\n\n :host(:focus) .dropdown,\n :host([focused]) .dropdown {\n border-color: var(--vscode-focusBorder, #0078d4);\n }\n\n .options {\n box-sizing: border-box;\n cursor: pointer;\n list-style: none;\n margin: 0;\n max-height: 222px;\n overflow: auto;\n padding: 1px;\n }\n\n .option {\n align-items: center;\n box-sizing: border-box;\n color: var(--vscode-foreground, #cccccc);\n cursor: pointer;\n display: flex;\n font-family: var(--vscode-font-family, sans-serif);\n font-size: var(--vscode-font-size, 13px);\n font-weight: var(--vscode-font-weight, normal);\n height: 22px;\n line-height: 18px;\n min-height: calc(var(--vscode-font-size) * 1.3);\n padding: 1px 3px;\n user-select: none;\n outline-color: transparent;\n outline-offset: -1px;\n outline-style: solid;\n outline-width: 1px;\n }\n\n .option b {\n color: var(--vscode-list-highlightForeground, #2aaaff);\n }\n\n .option.active b {\n color: var(--vscode-list-focusHighlightForeground, #2aaaff);\n }\n\n .option:not(.disabled):hover {\n background-color: var(--vscode-list-hoverBackground, #2a2d2e);\n color: var(--vscode-list-hoverForeground, #ffffff);\n }\n\n :host-context(body[data-vscode-theme-kind='vscode-high-contrast'])\n .option:hover,\n :host-context(body[data-vscode-theme-kind='vscode-high-contrast-light'])\n .option:hover {\n outline-style: dotted;\n outline-color: var(--vscode-list-focusOutline, #0078d4);\n outline-width: 1px;\n }\n\n .option.disabled {\n cursor: not-allowed;\n opacity: 0.4;\n }\n\n .option.active,\n .option.active:hover {\n background-color: var(--vscode-list-activeSelectionBackground, #04395e);\n color: var(--vscode-list-activeSelectionForeground, #ffffff);\n outline-color: var(--vscode-list-activeSelectionBackground, #04395e);\n outline-style: solid;\n outline-width: 1px;\n }\n\n .no-options {\n align-items: center;\n border-color: transparent;\n border-style: solid;\n border-width: 1px;\n color: var(--vscode-foreground, #cccccc);\n cursor: default;\n display: flex;\n font-family: var(--vscode-font-family, sans-serif);\n font-size: var(--vscode-font-size, 13px);\n font-weight: var(--vscode-font-weight, normal);\n line-height: 18px;\n min-height: calc(var(--vscode-font-size) * 1.3);\n opacity: 0.85;\n padding: 1px 3px;\n user-select: none;\n }\n\n .placeholder {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .placeholder span {\n font-weight: bold;\n }\n\n .placeholder:not(.disabled):hover {\n color: var(--vscode-list-activeSelectionForeground, #ffffff);\n }\n\n :host-context(body[data-vscode-theme-kind='vscode-high-contrast'])\n .option.active,\n :host-context(body[data-vscode-theme-kind='vscode-high-contrast-light'])\n .option.active:hover {\n outline-color: var(--vscode-list-focusOutline, #0078d4);\n outline-style: dashed;\n }\n\n .option-label {\n display: block;\n pointer-events: none;\n width: 100%;\n }\n\n .dropdown.multiple .option.selected {\n background-color: var(--vscode-list-hoverBackground, #2a2d2e);\n outline-color: var(--vscode-list-hoverBackground, #2a2d2e);\n }\n\n .dropdown.multiple .option.selected.active {\n background-color: var(--vscode-list-activeSelectionBackground, #04395e);\n color: var(--vscode-list-activeSelectionForeground, #ffffff);\n outline-color: var(--vscode-list-activeSelectionBackground, #04395e);\n }\n\n .checkbox-icon {\n background-color: var(--vscode-settings-checkboxBackground, #313131);\n border: 1px solid currentColor;\n border-radius: 2px;\n box-sizing: border-box;\n height: 14px;\n margin-right: 5px;\n overflow: hidden;\n position: relative;\n width: 14px;\n }\n\n .checkbox-icon.checked:before,\n .checkbox-icon.checked:after {\n content: '';\n display: block;\n height: 5px;\n position: absolute;\n transform: rotate(-45deg);\n width: 10px;\n }\n\n .checkbox-icon.checked:before {\n background-color: var(--vscode-foreground, #cccccc);\n left: 1px;\n top: 2.5px;\n }\n\n .checkbox-icon.checked:after {\n background-color: var(--vscode-settings-checkboxBackground, #313131);\n left: 1px;\n top: -0.5px;\n }\n\n .dropdown-controls {\n display: flex;\n justify-content: flex-end;\n padding: 4px;\n }\n\n .dropdown-controls :not(:last-child) {\n margin-right: 4px;\n }\n\n .action-icon {\n align-items: center;\n background-color: transparent;\n border: 0;\n color: var(--vscode-foreground, #cccccc);\n cursor: pointer;\n display: flex;\n height: 24px;\n justify-content: center;\n padding: 0;\n width: 24px;\n }\n\n .action-icon:focus {\n outline: none;\n }\n\n .action-icon:focus-visible {\n outline: 1px solid var(--vscode-focusBorder, #0078d4);\n outline-offset: -1px;\n }\n\n .description {\n border-color: var(--vscode-settings-dropdownBorder, #3c3c3c);\n border-style: solid;\n border-width: 1px 0 0;\n color: var(--vscode-foreground, #cccccc);\n font-family: var(--vscode-font-family, sans-serif);\n font-size: var(--vscode-font-size, 13px);\n font-weight: var(--vscode-font-weight, normal);\n line-height: 1.3;\n padding: 6px 4px;\n word-wrap: break-word;\n }\n\n :host([position='above']) .description {\n border-width: 0 0 1px;\n }\n `,\n];\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { TemplateResult } from 'lit';
|
|
1
|
+
import { nothing, TemplateResult } from 'lit';
|
|
2
2
|
import '../../vscode-button/index.js';
|
|
3
3
|
import '../../vscode-option/index.js';
|
|
4
4
|
import type { InternalOption, Option, SearchMethod } from './types.js';
|
|
@@ -9,6 +9,7 @@ import { VscElement } from '../VscElement.js';
|
|
|
9
9
|
export declare class VscodeSelectBase extends VscElement {
|
|
10
10
|
/** @internal */
|
|
11
11
|
ariaExpanded: string;
|
|
12
|
+
creatable: boolean;
|
|
12
13
|
/**
|
|
13
14
|
* Options can be filtered by typing into a text input field.
|
|
14
15
|
*/
|
|
@@ -69,6 +70,7 @@ export declare class VscodeSelectBase extends VscElement {
|
|
|
69
70
|
protected _value: string;
|
|
70
71
|
protected _values: string[];
|
|
71
72
|
protected _listScrollTop: number;
|
|
73
|
+
protected _isPlaceholderOptionActive: boolean;
|
|
72
74
|
private _listElement;
|
|
73
75
|
/** @internal */
|
|
74
76
|
protected _multiple: boolean;
|
|
@@ -84,9 +86,12 @@ export declare class VscodeSelectBase extends VscElement {
|
|
|
84
86
|
private _disabled;
|
|
85
87
|
private _originalTabIndex;
|
|
86
88
|
protected get _currentOptions(): InternalOption[];
|
|
89
|
+
protected get _isSuggestedOptionVisible(): boolean;
|
|
87
90
|
protected _setStateFromSlottedElements(): void;
|
|
88
91
|
protected _toggleDropdown(visible: boolean): Promise<void>;
|
|
92
|
+
protected _createSuggestedOption(): number;
|
|
89
93
|
protected _dispatchChangeEvent(): void;
|
|
94
|
+
protected _createAndSelectSuggestedOption(): Promise<void>;
|
|
90
95
|
protected _onFaceClick(): void;
|
|
91
96
|
private _onClickOutside;
|
|
92
97
|
private _onMouseMove;
|
|
@@ -94,7 +99,8 @@ export declare class VscodeSelectBase extends VscElement {
|
|
|
94
99
|
protected _onComboboxButtonClick(): void;
|
|
95
100
|
protected _onComboboxButtonKeyDown(ev: KeyboardEvent): void;
|
|
96
101
|
protected _onOptionMouseOver(ev: MouseEvent): void;
|
|
97
|
-
protected
|
|
102
|
+
protected _onPlaceholderOptionMouseOut(): void;
|
|
103
|
+
protected _onEnterKeyDown(ev: KeyboardEvent): void;
|
|
98
104
|
private _onSpaceKeyDown;
|
|
99
105
|
private _scrollActiveElementToTop;
|
|
100
106
|
private _adjustOptionListScrollPos;
|
|
@@ -107,9 +113,12 @@ export declare class VscodeSelectBase extends VscElement {
|
|
|
107
113
|
protected _onComboboxInputFocus(ev: FocusEvent): void;
|
|
108
114
|
protected _onComboboxInputInput(ev: InputEvent): void;
|
|
109
115
|
protected _onComboboxInputClick(): void;
|
|
116
|
+
protected _onOptionClick(_ev: MouseEvent): void;
|
|
110
117
|
protected _renderOptions(): TemplateResult | TemplateResult[];
|
|
118
|
+
protected _renderPlaceholderOption(isListEmpty: boolean): TemplateResult<1> | typeof nothing;
|
|
111
119
|
private _renderDescription;
|
|
112
120
|
protected _renderSelectFace(): TemplateResult;
|
|
121
|
+
private _renderMultiSelectLabel;
|
|
113
122
|
protected _renderComboboxFace(): TemplateResult;
|
|
114
123
|
protected _renderDropdownControls(): TemplateResult;
|
|
115
124
|
private _renderDropdown;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"vscode-select-base.d.ts","sourceRoot":"","sources":["../../../src/includes/vscode-select/vscode-select-base.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"vscode-select-base.d.ts","sourceRoot":"","sources":["../../../src/includes/vscode-select/vscode-select-base.ts"],"names":[],"mappings":"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"}
|