npm - @vscode-elements/elements - Versions diffs - 1.10.0 → 1.11.1-pre.0 - Mend

@vscode-elements/elements 1.10.0 → 1.11.1-pre.0

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 (153) hide show

package/dist/vscode-divider/vscode-divider.js CHANGED Viewed

@@ -8,6 +8,9 @@ import { html } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import { VscElement } from '../includes/VscElement.js';
 import styles from './vscode-divider.styles.js';
+/**
+ * @tag vscode-divider
+ */
 let VscodeDivider = class VscodeDivider extends VscElement {
     constructor() {
         super(...arguments);

package/dist/vscode-divider/vscode-divider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-divider.js","sourceRoot":"","sources":["../../src/vscode-divider/vscode-divider.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAiB,IAAI,EAAC,MAAM,KAAK,CAAC;AACzC,OAAO,EAAC,aAAa,EAAE,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,MAAM,MAAM,4BAA4B,CAAC;~~AAGzC~~,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAAtC;;QAIL,SAAI,GAAiC,WAAW,CAAC;IAKnD,CAAC;IAHC,MAAM;QACJ,OAAO,IAAI,CAAA,EAAE,CAAC;IAChB,CAAC;;AAPM,oBAAM,GAAG,MAAM,AAAT,CAAU;AAGvB;IADC,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;2CACuB;AAJtC,aAAa;IADzB,aAAa,CAAC,gBAAgB,CAAC;GACnB,aAAa,CASzB","sourcesContent":["import {TemplateResult, html} from 'lit';\nimport {customElement, property} from 'lit/decorators.js';\nimport {VscElement} from '../includes/VscElement.js';\nimport styles from './vscode-divider.styles.js';\n\n@customElement('vscode-divider')\nexport class VscodeDivider extends VscElement {\n static styles = styles;\n\n @property({reflect: true})\n role: 'separator' \| 'presentation' = 'separator';\n\n render(): TemplateResult {\n return html``;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-divider': VscodeDivider;\n }\n}\n"]}
1	+ {"version":3,"file":"vscode-divider.js","sourceRoot":"","sources":["../../src/vscode-divider/vscode-divider.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAiB,IAAI,EAAC,MAAM,KAAK,CAAC;AACzC,OAAO,EAAC,aAAa,EAAE,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,MAAM,MAAM,4BAA4B,CAAC;AAEhD;;GAEG;AAEI,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAAtC;;QAIL,SAAI,GAAiC,WAAW,CAAC;IAKnD,CAAC;IAHC,MAAM;QACJ,OAAO,IAAI,CAAA,EAAE,CAAC;IAChB,CAAC;;AAPM,oBAAM,GAAG,MAAM,AAAT,CAAU;AAGvB;IADC,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;2CACuB;AAJtC,aAAa;IADzB,aAAa,CAAC,gBAAgB,CAAC;GACnB,aAAa,CASzB","sourcesContent":["import {TemplateResult, html} from 'lit';\nimport {customElement, property} from 'lit/decorators.js';\nimport {VscElement} from '../includes/VscElement.js';\nimport styles from './vscode-divider.styles.js';\n\n/*\n @tag vscode-divider\n */\n@customElement('vscode-divider')\nexport class VscodeDivider extends VscElement {\n static styles = styles;\n\n @property({reflect: true})\n role: 'separator' \| 'presentation' = 'separator';\n\n render(): TemplateResult {\n return html``;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-divider': VscodeDivider;\n }\n}\n"]}

package/dist/vscode-form-container/vscode-form-container.d.ts CHANGED Viewed

@@ -1,5 +1,8 @@
 import { TemplateResult } from 'lit';
 import { VscElement } from '../includes/VscElement.js';
+/**
+ * @tag vscode-form-container
+ */
 export declare class VscodeFormContainer extends VscElement {
     static styles: import("lit").CSSResultGroup;
     set responsive(isResponsive: boolean);

package/dist/vscode-form-container/vscode-form-container.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-form-container.d.ts","sourceRoot":"","sources":["../../src/vscode-form-container/vscode-form-container.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAC,MAAM,KAAK,CAAC;AAOzC,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AA8CrD,qBACa,mBAAoB,SAAQ,UAAU;IACjD,MAAM,CAAC,MAAM,+BAAU;IAEvB,IACI,UAAU,CAAC,YAAY,EAAE,OAAO,EAUnC;IACD,IAAI,UAAU,IAAI,OAAO,CAExB;IAGD,UAAU,SAAO;IAEjB,6DAA6D;IAC7D,IACI,IAAI,IAAI;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,CAAA;KAAC,CAE7C;IAED,OAAO,CAAC,eAAe,CAAyB;IAGhD,OAAO,CAAC,eAAe,CAAW;IAGlC,OAAO,CAAC,mBAAmB,CAAqB;IAEhD,OAAO,CAAC,WAAW,CAAS;IAE5B,OAAO,CAAC,oBAAoB,CAAS;IAErC,OAAO,CAAC,uBAAuB,CAAmB;IAElD,OAAO,CAAC,gBAAgB;IA+CxB,OAAO,CAAC,oBAAoB;IAqC5B,OAAO,CAAC,uBAAuB;IAkB/B,OAAO,CAAC,4BAA4B,CACM;IAE1C,OAAO,CAAC,yBAAyB;IAOjC,OAAO,CAAC,yBAAyB;IAKjC,YAAY,IAAI,IAAI;IAQpB,MAAM,IAAI,cAAc;CAOzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,uBAAuB,EAAE,mBAAmB,CAAC;KAC9C;CACF"}
1	+ {"version":3,"file":"vscode-form-container.d.ts","sourceRoot":"","sources":["../../src/vscode-form-container/vscode-form-container.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAC,MAAM,KAAK,CAAC;AAOzC,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AA8CrD;;GAEG;AACH,qBACa,mBAAoB,SAAQ,UAAU;IACjD,MAAM,CAAC,MAAM,+BAAU;IAEvB,IACI,UAAU,CAAC,YAAY,EAAE,OAAO,EAUnC;IACD,IAAI,UAAU,IAAI,OAAO,CAExB;IAGD,UAAU,SAAO;IAEjB,6DAA6D;IAC7D,IACI,IAAI,IAAI;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,CAAA;KAAC,CAE7C;IAED,OAAO,CAAC,eAAe,CAAyB;IAGhD,OAAO,CAAC,eAAe,CAAW;IAGlC,OAAO,CAAC,mBAAmB,CAAqB;IAEhD,OAAO,CAAC,WAAW,CAAS;IAE5B,OAAO,CAAC,oBAAoB,CAAS;IAErC,OAAO,CAAC,uBAAuB,CAAmB;IAElD,OAAO,CAAC,gBAAgB;IA+CxB,OAAO,CAAC,oBAAoB;IAqC5B,OAAO,CAAC,uBAAuB;IAkB/B,OAAO,CAAC,4BAA4B,CACM;IAE1C,OAAO,CAAC,yBAAyB;IAOjC,OAAO,CAAC,yBAAyB;IAKjC,YAAY,IAAI,IAAI;IAQpB,MAAM,IAAI,cAAc;CAOzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,uBAAuB,EAAE,mBAAmB,CAAC;KAC9C;CACF"}

package/dist/vscode-form-container/vscode-form-container.js CHANGED Viewed

@@ -28,6 +28,9 @@ const isCheckbox = (el) => {
 const isRadio = (el) => {
     return el.tagName.toLocaleLowerCase() === 'vscode-radio';
 };
+/**
+ * @tag vscode-form-container
+ */
 let VscodeFormContainer = class VscodeFormContainer extends VscElement {
     constructor() {
         super(...arguments);

package/dist/vscode-form-container/vscode-form-container.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-form-container.js","sourceRoot":"","sources":["../../src/vscode-form-container/vscode-form-container.ts"],"names":[],"mappings":"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","sourcesContent":["import {html, TemplateResult} from 'lit';\nimport {\n customElement,\n property,\n query,\n queryAssignedElements,\n} from 'lit/decorators.js';\nimport {VscElement} from '../includes/VscElement.js';\nimport {VscodeCheckbox} from '../vscode-checkbox/index.js';\nimport {VscodeCheckboxGroup} from '../vscode-checkbox-group/index.js';\nimport {VscodeFormGroup, FormGroupVariant} from '../vscode-form-group/index.js';\nimport {VscodeMultiSelect} from '../vscode-multi-select/index.js';\nimport {VscodeRadio} from '../vscode-radio/index.js';\nimport {VscodeRadioGroup} from '../vscode-radio-group/index.js';\nimport {VscodeSingleSelect} from '../vscode-single-select/index.js';\nimport styles from './vscode-form-container.styles.js';\nimport {VscodeTextarea, VscodeTextfield} from '../main.js';\n\nenum FormGroupLayout {\n HORIZONTAL = 'horizontal',\n VERTICAL = 'vertical',\n}\n\ntype CheckboxOrRadioGroup = VscodeRadioGroup \| VscodeCheckboxGroup;\n\ntype VscFormWidget =\n \| VscodeSingleSelect\n \| VscodeMultiSelect\n \| VscodeCheckbox\n \| VscodeRadio;\n\nconst isTextInput = (el: Element): el is VscodeTextarea \| VscodeTextfield => {\n return ['vscode-textfield', 'vscode-textarea'].includes(\n el.tagName.toLocaleLowerCase()\n );\n};\n\nconst isSingleSelect = (el: Element): el is VscodeSingleSelect => {\n return el.tagName.toLocaleLowerCase() === 'vscode-single-select';\n};\n\nconst isMultiSelect = (el: Element): el is VscodeMultiSelect => {\n return el.tagName.toLocaleLowerCase() === 'vscode-multi-select';\n};\n\nconst isCheckbox = (el: Element): el is VscodeCheckbox => {\n return el.tagName.toLocaleLowerCase() === 'vscode-checkbox';\n};\n\nconst isRadio = (el: Element): el is VscodeRadio => {\n return el.tagName.toLocaleLowerCase() === 'vscode-radio';\n};\n\n@customElement('vscode-form-container')\nexport class VscodeFormContainer extends VscElement {\n static styles = styles;\n\n @property({type: Boolean, reflect: true})\n set responsive(isResponsive: boolean) {\n this._responsive = isResponsive;\n\n if (this._firstUpdateComplete) {\n if (isResponsive) {\n this._activateResponsiveLayout();\n } else {\n this._deactivateResizeObserver();\n }\n }\n }\n get responsive(): boolean {\n return this._responsive;\n }\n\n @property({type: Number})\n breakpoint = 490;\n\n /** @deprecated - Use the native `<form>` element instead. */\n @property({type: Object})\n get data(): {[key: string]: string \| string[]} {\n return this._collectFormData();\n }\n\n private _resizeObserver!: ResizeObserver \| null;\n\n @query('.wrapper')\n private _wrapperElement!: Element;\n\n @queryAssignedElements({selector: 'vscode-form-group'})\n private _assignedFormGroups!: VscodeFormGroup[];\n\n private _responsive = false;\n\n private _firstUpdateComplete = false;\n\n private _currentFormGroupLayout!: FormGroupLayout;\n\n private _collectFormData() {\n const query = [\n 'vscode-textfield',\n 'vscode-textarea',\n 'vscode-single-select',\n 'vscode-multi-select',\n 'vscode-checkbox',\n 'vscode-radio',\n ].join(',');\n const vscFormWidgets = this.querySelectorAll(\n query\n ) as NodeListOf<VscFormWidget>;\n const data: {[key: string]: string \| string[]} = {};\n\n vscFormWidgets.forEach((widget) => {\n if (!widget.hasAttribute('name')) {\n return;\n }\n\n const name = widget.getAttribute('name') as string;\n\n if (!name) {\n return;\n }\n\n if (isCheckbox(widget) && widget.checked) {\n data[name] = Array.isArray(data[name])\n ? [...data[name], widget.value as string]\n : [widget.value as string];\n } else if (isMultiSelect(widget)) {\n data[name] = widget.value;\n } else if (isCheckbox(widget) && !widget.checked) {\n data[name] = Array.isArray(data[name]) ? data[name] : [];\n } else if (\n (isRadio(widget) && widget.checked) \|\|\n isTextInput(widget) \|\|\n isSingleSelect(widget)\n ) {\n data[name] = widget.value;\n } else if (isRadio(widget) && !widget.checked) {\n data[name] = data[name] ? data[name] : '';\n }\n });\n\n return data;\n }\n\n private _toggleCompactLayout(layout: FormGroupLayout) {\n this._assignedFormGroups.forEach((group) => {\n if (!group.dataset.originalVariant) {\n group.dataset.originalVariant = group.variant;\n }\n\n const oVariant = group.dataset.originalVariant as FormGroupVariant;\n\n if (layout === FormGroupLayout.VERTICAL && oVariant === 'horizontal') {\n group.variant = 'vertical';\n } else {\n group.variant = oVariant;\n }\n\n const checkboxOrRadioGroup = group.querySelectorAll(\n 'vscode-checkbox-group, vscode-radio-group'\n ) as NodeListOf<CheckboxOrRadioGroup>;\n\n checkboxOrRadioGroup.forEach((widgetGroup) => {\n if (!widgetGroup.dataset.originalVariant) {\n widgetGroup.dataset.originalVariant = widgetGroup.variant;\n }\n\n const originalVariant = widgetGroup.dataset.originalVariant;\n\n if (\n layout === FormGroupLayout.HORIZONTAL &&\n originalVariant === FormGroupLayout.HORIZONTAL\n ) {\n widgetGroup.variant = 'horizontal';\n } else {\n widgetGroup.variant = 'vertical';\n }\n });\n });\n }\n\n private _resizeObserverCallback(entries: ResizeObserverEntry[]) {\n let wrapperWidth = 0;\n\n for (const entry of entries) {\n wrapperWidth = entry.contentRect.width;\n }\n\n const nextLayout: FormGroupLayout =\n wrapperWidth < this.breakpoint\n ? FormGroupLayout.VERTICAL\n : FormGroupLayout.HORIZONTAL;\n\n if (nextLayout !== this._currentFormGroupLayout) {\n this._toggleCompactLayout(nextLayout);\n this._currentFormGroupLayout = nextLayout;\n }\n }\n\n private _resizeObserverCallbackBound =\n this._resizeObserverCallback.bind(this);\n\n private _activateResponsiveLayout() {\n this._resizeObserver = new ResizeObserver(\n this._resizeObserverCallbackBound\n );\n this._resizeObserver.observe(this._wrapperElement);\n }\n\n private _deactivateResizeObserver() {\n this._resizeObserver?.disconnect();\n this._resizeObserver = null;\n }\n\n firstUpdated(): void {\n this._firstUpdateComplete = true;\n\n if (this._responsive) {\n this._activateResponsiveLayout();\n }\n }\n\n render(): TemplateResult {\n return html`\n <div class=\"wrapper\">\n <slot></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-form-container': VscodeFormContainer;\n }\n}\n"]}
1	+ {"version":3,"file":"vscode-form-container.js","sourceRoot":"","sources":["../../src/vscode-form-container/vscode-form-container.ts"],"names":[],"mappings":"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","sourcesContent":["import {html, TemplateResult} from 'lit';\nimport {\n customElement,\n property,\n query,\n queryAssignedElements,\n} from 'lit/decorators.js';\nimport {VscElement} from '../includes/VscElement.js';\nimport {VscodeCheckbox} from '../vscode-checkbox/index.js';\nimport {VscodeCheckboxGroup} from '../vscode-checkbox-group/index.js';\nimport {VscodeFormGroup, FormGroupVariant} from '../vscode-form-group/index.js';\nimport {VscodeMultiSelect} from '../vscode-multi-select/index.js';\nimport {VscodeRadio} from '../vscode-radio/index.js';\nimport {VscodeRadioGroup} from '../vscode-radio-group/index.js';\nimport {VscodeSingleSelect} from '../vscode-single-select/index.js';\nimport styles from './vscode-form-container.styles.js';\nimport {VscodeTextarea, VscodeTextfield} from '../main.js';\n\nenum FormGroupLayout {\n HORIZONTAL = 'horizontal',\n VERTICAL = 'vertical',\n}\n\ntype CheckboxOrRadioGroup = VscodeRadioGroup \| VscodeCheckboxGroup;\n\ntype VscFormWidget =\n \| VscodeSingleSelect\n \| VscodeMultiSelect\n \| VscodeCheckbox\n \| VscodeRadio;\n\nconst isTextInput = (el: Element): el is VscodeTextarea \| VscodeTextfield => {\n return ['vscode-textfield', 'vscode-textarea'].includes(\n el.tagName.toLocaleLowerCase()\n );\n};\n\nconst isSingleSelect = (el: Element): el is VscodeSingleSelect => {\n return el.tagName.toLocaleLowerCase() === 'vscode-single-select';\n};\n\nconst isMultiSelect = (el: Element): el is VscodeMultiSelect => {\n return el.tagName.toLocaleLowerCase() === 'vscode-multi-select';\n};\n\nconst isCheckbox = (el: Element): el is VscodeCheckbox => {\n return el.tagName.toLocaleLowerCase() === 'vscode-checkbox';\n};\n\nconst isRadio = (el: Element): el is VscodeRadio => {\n return el.tagName.toLocaleLowerCase() === 'vscode-radio';\n};\n\n/*\n @tag vscode-form-container\n /\n@customElement('vscode-form-container')\nexport class VscodeFormContainer extends VscElement {\n static styles = styles;\n\n @property({type: Boolean, reflect: true})\n set responsive(isResponsive: boolean) {\n this._responsive = isResponsive;\n\n if (this._firstUpdateComplete) {\n if (isResponsive) {\n this._activateResponsiveLayout();\n } else {\n this._deactivateResizeObserver();\n }\n }\n }\n get responsive(): boolean {\n return this._responsive;\n }\n\n @property({type: Number})\n breakpoint = 490;\n\n /* @deprecated - Use the native `<form>` element instead. */\n @property({type: Object})\n get data(): {[key: string]: string \| string[]} {\n return this._collectFormData();\n }\n\n private _resizeObserver!: ResizeObserver \| null;\n\n @query('.wrapper')\n private _wrapperElement!: Element;\n\n @queryAssignedElements({selector: 'vscode-form-group'})\n private _assignedFormGroups!: VscodeFormGroup[];\n\n private _responsive = false;\n\n private _firstUpdateComplete = false;\n\n private _currentFormGroupLayout!: FormGroupLayout;\n\n private _collectFormData() {\n const query = [\n 'vscode-textfield',\n 'vscode-textarea',\n 'vscode-single-select',\n 'vscode-multi-select',\n 'vscode-checkbox',\n 'vscode-radio',\n ].join(',');\n const vscFormWidgets = this.querySelectorAll(\n query\n ) as NodeListOf<VscFormWidget>;\n const data: {[key: string]: string \| string[]} = {};\n\n vscFormWidgets.forEach((widget) => {\n if (!widget.hasAttribute('name')) {\n return;\n }\n\n const name = widget.getAttribute('name') as string;\n\n if (!name) {\n return;\n }\n\n if (isCheckbox(widget) && widget.checked) {\n data[name] = Array.isArray(data[name])\n ? [...data[name], widget.value as string]\n : [widget.value as string];\n } else if (isMultiSelect(widget)) {\n data[name] = widget.value;\n } else if (isCheckbox(widget) && !widget.checked) {\n data[name] = Array.isArray(data[name]) ? data[name] : [];\n } else if (\n (isRadio(widget) && widget.checked) \|\|\n isTextInput(widget) \|\|\n isSingleSelect(widget)\n ) {\n data[name] = widget.value;\n } else if (isRadio(widget) && !widget.checked) {\n data[name] = data[name] ? data[name] : '';\n }\n });\n\n return data;\n }\n\n private _toggleCompactLayout(layout: FormGroupLayout) {\n this._assignedFormGroups.forEach((group) => {\n if (!group.dataset.originalVariant) {\n group.dataset.originalVariant = group.variant;\n }\n\n const oVariant = group.dataset.originalVariant as FormGroupVariant;\n\n if (layout === FormGroupLayout.VERTICAL && oVariant === 'horizontal') {\n group.variant = 'vertical';\n } else {\n group.variant = oVariant;\n }\n\n const checkboxOrRadioGroup = group.querySelectorAll(\n 'vscode-checkbox-group, vscode-radio-group'\n ) as NodeListOf<CheckboxOrRadioGroup>;\n\n checkboxOrRadioGroup.forEach((widgetGroup) => {\n if (!widgetGroup.dataset.originalVariant) {\n widgetGroup.dataset.originalVariant = widgetGroup.variant;\n }\n\n const originalVariant = widgetGroup.dataset.originalVariant;\n\n if (\n layout === FormGroupLayout.HORIZONTAL &&\n originalVariant === FormGroupLayout.HORIZONTAL\n ) {\n widgetGroup.variant = 'horizontal';\n } else {\n widgetGroup.variant = 'vertical';\n }\n });\n });\n }\n\n private _resizeObserverCallback(entries: ResizeObserverEntry[]) {\n let wrapperWidth = 0;\n\n for (const entry of entries) {\n wrapperWidth = entry.contentRect.width;\n }\n\n const nextLayout: FormGroupLayout =\n wrapperWidth < this.breakpoint\n ? FormGroupLayout.VERTICAL\n : FormGroupLayout.HORIZONTAL;\n\n if (nextLayout !== this._currentFormGroupLayout) {\n this._toggleCompactLayout(nextLayout);\n this._currentFormGroupLayout = nextLayout;\n }\n }\n\n private _resizeObserverCallbackBound =\n this._resizeObserverCallback.bind(this);\n\n private _activateResponsiveLayout() {\n this._resizeObserver = new ResizeObserver(\n this._resizeObserverCallbackBound\n );\n this._resizeObserver.observe(this._wrapperElement);\n }\n\n private _deactivateResizeObserver() {\n this._resizeObserver?.disconnect();\n this._resizeObserver = null;\n }\n\n firstUpdated(): void {\n this._firstUpdateComplete = true;\n\n if (this._responsive) {\n this._activateResponsiveLayout();\n }\n }\n\n render(): TemplateResult {\n return html`\n <div class=\"wrapper\">\n <slot></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-form-container': VscodeFormContainer;\n }\n}\n"]}

package/dist/vscode-form-group/vscode-form-group.d.ts CHANGED Viewed

@@ -2,6 +2,8 @@ import { TemplateResult } from 'lit';
 import { VscElement } from '../includes/VscElement.js';
 export type FormGroupVariant = 'horizontal' | 'vertical' | 'settings-group';
 /**
+ * @tag vscode-form-group
+ *
  * @cssprop [--label-width=150px] - The width of the label in horizontal mode
  * @cssprop [--label-right-margin=14px] - The right margin of the label in horizontal mode
  */

package/dist/vscode-form-group/vscode-form-group.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-form-group.d.ts","sourceRoot":"","sources":["../../src/vscode-form-group/vscode-form-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAC,MAAM,KAAK,CAAC;AAEzC,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AAGrD,MAAM,MAAM,gBAAgB,GAAG,YAAY,GAAG,UAAU,GAAG,gBAAgB,CAAC;AAE5E~~;;;GAGG~~;AACH,qBACa,eAAgB,SAAQ,UAAU;IAC7C,MAAM,CAAC,MAAM,+BAAU;IAGvB,OAAO,EAAE,gBAAgB,CAAgB;IAEzC,MAAM,IAAI,cAAc;CAOzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,eAAe,CAAC;KACtC;CACF"}
1	+ {"version":3,"file":"vscode-form-group.d.ts","sourceRoot":"","sources":["../../src/vscode-form-group/vscode-form-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAC,MAAM,KAAK,CAAC;AAEzC,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AAGrD,MAAM,MAAM,gBAAgB,GAAG,YAAY,GAAG,UAAU,GAAG,gBAAgB,CAAC;AAE5E;;;;;GAKG;AACH,qBACa,eAAgB,SAAQ,UAAU;IAC7C,MAAM,CAAC,MAAM,+BAAU;IAGvB,OAAO,EAAE,gBAAgB,CAAgB;IAEzC,MAAM,IAAI,cAAc;CAOzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,eAAe,CAAC;KACtC;CACF"}

package/dist/vscode-form-group/vscode-form-group.js CHANGED Viewed

@@ -9,6 +9,8 @@ import { customElement, property } from 'lit/decorators.js';
 import { VscElement } from '../includes/VscElement.js';
 import styles from './vscode-form-group.styles.js';
 /**
+ * @tag vscode-form-group
+ *
  * @cssprop [--label-width=150px] - The width of the label in horizontal mode
  * @cssprop [--label-right-margin=14px] - The right margin of the label in horizontal mode
  */

package/dist/vscode-form-group/vscode-form-group.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-form-group.js","sourceRoot":"","sources":["../../src/vscode-form-group/vscode-form-group.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAC,IAAI,EAAiB,MAAM,KAAK,CAAC;AACzC,OAAO,EAAC,aAAa,EAAE,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,MAAM,MAAM,+BAA+B,CAAC;AAInD~~;;;GAGG~~;AAEI,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,UAAU;IAAxC;;QAIL,YAAO,GAAqB,YAAY,CAAC;IAS3C,CAAC;IAPC,MAAM;QACJ,OAAO,IAAI,CAAA;;;;KAIV,CAAC;IACJ,CAAC;;AAXM,sBAAM,GAAG,MAAM,AAAT,CAAU;AAGvB;IADC,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;gDACe;AAJ9B,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CAa3B","sourcesContent":["import {html, TemplateResult} from 'lit';\nimport {customElement, property} from 'lit/decorators.js';\nimport {VscElement} from '../includes/VscElement.js';\nimport styles from './vscode-form-group.styles.js';\n\nexport type FormGroupVariant = 'horizontal' \| 'vertical' \| 'settings-group';\n\n/*\n @cssprop [--label-width=150px] - The width of the label in horizontal mode\n * @cssprop [--label-right-margin=14px] - The right margin of the label in horizontal mode\n */\n@customElement('vscode-form-group')\nexport class VscodeFormGroup extends VscElement {\n static styles = styles;\n\n @property({reflect: true})\n variant: FormGroupVariant = 'horizontal';\n\n render(): TemplateResult {\n return html`\n <div class=\"wrapper\">\n <slot></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-form-group': VscodeFormGroup;\n }\n}\n"]}
1	+ {"version":3,"file":"vscode-form-group.js","sourceRoot":"","sources":["../../src/vscode-form-group/vscode-form-group.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAC,IAAI,EAAiB,MAAM,KAAK,CAAC;AACzC,OAAO,EAAC,aAAa,EAAE,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,MAAM,MAAM,+BAA+B,CAAC;AAInD;;;;;GAKG;AAEI,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,UAAU;IAAxC;;QAIL,YAAO,GAAqB,YAAY,CAAC;IAS3C,CAAC;IAPC,MAAM;QACJ,OAAO,IAAI,CAAA;;;;KAIV,CAAC;IACJ,CAAC;;AAXM,sBAAM,GAAG,MAAM,AAAT,CAAU;AAGvB;IADC,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;gDACe;AAJ9B,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CAa3B","sourcesContent":["import {html, TemplateResult} from 'lit';\nimport {customElement, property} from 'lit/decorators.js';\nimport {VscElement} from '../includes/VscElement.js';\nimport styles from './vscode-form-group.styles.js';\n\nexport type FormGroupVariant = 'horizontal' \| 'vertical' \| 'settings-group';\n\n/*\n @tag vscode-form-group\n \n @cssprop [--label-width=150px] - The width of the label in horizontal mode\n * @cssprop [--label-right-margin=14px] - The right margin of the label in horizontal mode\n */\n@customElement('vscode-form-group')\nexport class VscodeFormGroup extends VscElement {\n static styles = styles;\n\n @property({reflect: true})\n variant: FormGroupVariant = 'horizontal';\n\n render(): TemplateResult {\n return html`\n <div class=\"wrapper\">\n <slot></slot>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-form-group': VscodeFormGroup;\n }\n}\n"]}

package/dist/vscode-form-helper/vscode-form-helper.d.ts CHANGED Viewed

@@ -3,6 +3,8 @@ import { VscElement } from '../includes/VscElement.js';
 /**
  * Adds more detailed description to a [FromGroup](https://bendera.github.io/vscode-webview-elements/components/vscode-form-group/)
  *
+ * @tag vscode-form-helper
+ *
  * @cssprop --vsc-foreground-translucent - Default text color. 90% transparency version of `--vscode-foreground` by default.
  */
 export declare class VscodeFormHelper extends VscElement {

package/dist/vscode-form-helper/vscode-form-helper.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-form-helper.d.ts","sourceRoot":"","sources":["../../src/vscode-form-helper/vscode-form-helper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAC,MAAM,KAAK,CAAC;AAGzC,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AAGrD~~;;;;GAIG~~;AACH,qBACa,gBAAiB,SAAQ,UAAU;IAC9C,MAAM,CAAC,MAAM,+BAAU;;IAOvB,MAAM,IAAI,cAAc;CAGzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,oBAAoB,EAAE,gBAAgB,CAAC;KACxC;CACF"}
1	+ {"version":3,"file":"vscode-form-helper.d.ts","sourceRoot":"","sources":["../../src/vscode-form-helper/vscode-form-helper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAC,MAAM,KAAK,CAAC;AAGzC,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AAGrD;;;;;;GAMG;AACH,qBACa,gBAAiB,SAAQ,UAAU;IAC9C,MAAM,CAAC,MAAM,+BAAU;;IAOvB,MAAM,IAAI,cAAc;CAGzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,oBAAoB,EAAE,gBAAgB,CAAC;KACxC;CACF"}

package/dist/vscode-form-helper/vscode-form-helper.js CHANGED Viewed

@@ -12,6 +12,8 @@ import styles from './vscode-form-helper.styles.js';
 /**
  * Adds more detailed description to a [FromGroup](https://bendera.github.io/vscode-webview-elements/components/vscode-form-group/)
  *
+ * @tag vscode-form-helper
+ *
  * @cssprop --vsc-foreground-translucent - Default text color. 90% transparency version of `--vscode-foreground` by default.
  */
 let VscodeFormHelper = class VscodeFormHelper extends VscElement {

package/dist/vscode-form-helper/vscode-form-helper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-form-helper.js","sourceRoot":"","sources":["../../src/vscode-form-helper/vscode-form-helper.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAC,IAAI,EAAiB,MAAM,KAAK,CAAC;AACzC,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAC,mBAAmB,EAAC,MAAM,6BAA6B,CAAC;AAChE,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,MAAM,MAAM,gCAAgC,CAAC;AAEpD~~;;;;GAIG~~;AAEI,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,UAAU;IAG9C;QACE,KAAK,EAAE,CAAC;QACR,mBAAmB,EAAE,CAAC;IACxB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AATM,uBAAM,GAAG,MAAM,AAAT,CAAU;AADZ,gBAAgB;IAD5B,aAAa,CAAC,oBAAoB,CAAC;GACvB,gBAAgB,CAW5B","sourcesContent":["import {html, TemplateResult} from 'lit';\nimport {customElement} from 'lit/decorators.js';\nimport {applyForegroundRGBA} from '../includes/themeHelpers.js';\nimport {VscElement} from '../includes/VscElement.js';\nimport styles from './vscode-form-helper.styles.js';\n\n/*\n Adds more detailed description to a [FromGroup](https://bendera.github.io/vscode-webview-elements/components/vscode-form-group/)\n \n @cssprop --vsc-foreground-translucent - Default text color. 90% transparency version of `--vscode-foreground` by default.\n */\n@customElement('vscode-form-helper')\nexport class VscodeFormHelper extends VscElement {\n static styles = styles;\n\n constructor() {\n super();\n applyForegroundRGBA();\n }\n\n render(): TemplateResult {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-form-helper': VscodeFormHelper;\n }\n}\n"]}
1	+ {"version":3,"file":"vscode-form-helper.js","sourceRoot":"","sources":["../../src/vscode-form-helper/vscode-form-helper.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAC,IAAI,EAAiB,MAAM,KAAK,CAAC;AACzC,OAAO,EAAC,aAAa,EAAC,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAC,mBAAmB,EAAC,MAAM,6BAA6B,CAAC;AAChE,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,MAAM,MAAM,gCAAgC,CAAC;AAEpD;;;;;;GAMG;AAEI,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,UAAU;IAG9C;QACE,KAAK,EAAE,CAAC;QACR,mBAAmB,EAAE,CAAC;IACxB,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AATM,uBAAM,GAAG,MAAM,AAAT,CAAU;AADZ,gBAAgB;IAD5B,aAAa,CAAC,oBAAoB,CAAC;GACvB,gBAAgB,CAW5B","sourcesContent":["import {html, TemplateResult} from 'lit';\nimport {customElement} from 'lit/decorators.js';\nimport {applyForegroundRGBA} from '../includes/themeHelpers.js';\nimport {VscElement} from '../includes/VscElement.js';\nimport styles from './vscode-form-helper.styles.js';\n\n/*\n Adds more detailed description to a [FromGroup](https://bendera.github.io/vscode-webview-elements/components/vscode-form-group/)\n \n @tag vscode-form-helper\n \n @cssprop --vsc-foreground-translucent - Default text color. 90% transparency version of `--vscode-foreground` by default.\n */\n@customElement('vscode-form-helper')\nexport class VscodeFormHelper extends VscElement {\n static styles = styles;\n\n constructor() {\n super();\n applyForegroundRGBA();\n }\n\n render(): TemplateResult {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-form-helper': VscodeFormHelper;\n }\n}\n"]}

package/dist/vscode-icon/vscode-icon.d.ts CHANGED Viewed

@@ -1,10 +1,12 @@
-import { TemplateResult } from 'lit';
+import { PropertyValues, TemplateResult } from 'lit';
 import { VscElement } from '../includes/VscElement.js';
 /**
  * Display a [Codicon](https://microsoft.github.io/vscode-codicons/dist/codicon.html).
  * In "action-icon" mode it behaves like a button. In this case, it is
  * recommended that a meaningful label is specified with the `label` property.
  *
+ * @tag vscode-icon
+ *
  * @cssprop --vscode-icon-foreground
  * @cssprop --vscode-toolbar-hoverBackground - Hover state background color in `active-icon` mode
  * @cssprop --vscode-toolbar-activeBackground - Active state background color in `active-icon` mode
@@ -39,6 +41,7 @@ export declare class VscodeIcon extends VscElement {
     private static stylesheetHref;
     private static nonce;
     connectedCallback(): void;
+    protected willUpdate(changedProperties: PropertyValues): void;
     /**
      * For using web fonts in web components, the font stylesheet must be included
      * twice: on the page and in the web component. This function looks for the

package/dist/vscode-icon/vscode-icon.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-icon.d.ts","sourceRoot":"","sources":["../../src/vscode-icon/vscode-icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAC,MAAM,KAAK,CAAC;~~AAKzC~~,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AAGrD~~;;;;;;;;;GASG~~;AACH,qBACa,UAAW,SAAQ,UAAU;IACxC,MAAM,CAAC,MAAM,+BAAU;IACvB;;OAEG;IAEH,KAAK,SAAM;IAEX;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,IAAI,UAAS;IAEb;;OAEG;IAEH,YAAY,SAAO;IAEnB;;OAEG;IAEH,UAAU,UAAS;IAEnB,OAAO,CAAC,MAAM,CAAC,cAAc,CAA0B;IAEvD,OAAO,CAAC,MAAM,CAAC,KAAK,CAA0B;IAE9C,iBAAiB,IAAI,IAAI;IASzB;;;;;OAKG;IACH,OAAO,CAAC,oBAAoB;~~IAW5B~~,OAAO,CAAC,cAAc,CAIpB;IAEF,MAAM,IAAI,cAAc;~~CAsCzB~~;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}
1	+ {"version":3,"file":"vscode-icon.d.ts","sourceRoot":"","sources":["../../src/vscode-icon/vscode-icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAE,cAAc,EAAC,MAAM,KAAK,CAAC;AAIzD,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AAGrD;;;;;;;;;;;GAWG;AACH,qBACa,UAAW,SAAQ,UAAU;IACxC,MAAM,CAAC,MAAM,+BAAU;IACvB;;OAEG;IAEH,KAAK,SAAM;IAEX;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,IAAI,SAAM;IAEV;;OAEG;IAEH,IAAI,UAAS;IAEb;;OAEG;IAEH,YAAY,SAAO;IAEnB;;OAEG;IAEH,UAAU,UAAS;IAEnB,OAAO,CAAC,MAAM,CAAC,cAAc,CAA0B;IAEvD,OAAO,CAAC,MAAM,CAAC,KAAK,CAA0B;IAE9C,iBAAiB,IAAI,IAAI;IASzB,SAAS,CAAC,UAAU,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;IAU7D;;;;;OAKG;IACH,OAAO,CAAC,oBAAoB;IAkB5B,OAAO,CAAC,cAAc,CAIpB;IAEF,MAAM,IAAI,cAAc;CAgCzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}

package/dist/vscode-icon/vscode-icon.js CHANGED Viewed

@@ -8,7 +8,6 @@ var VscodeIcon_1;
 import { html } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
-import { styleMap } from 'lit/directives/style-map.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { VscElement } from '../includes/VscElement.js';
 import styles from './vscode-icon.styles.js';
@@ -17,6 +16,8 @@ import styles from './vscode-icon.styles.js';
  * In "action-icon" mode it behaves like a button. In this case, it is
  * recommended that a meaningful label is specified with the `label` property.
  *
+ * @tag vscode-icon
+ *
  * @cssprop --vscode-icon-foreground
  * @cssprop --vscode-toolbar-hoverBackground - Hover state background color in `active-icon` mode
  * @cssprop --vscode-toolbar-activeBackground - Active state background color in `active-icon` mode
@@ -59,6 +60,14 @@ let VscodeIcon = VscodeIcon_1 = class VscodeIcon extends VscElement {
         VscodeIcon_1.stylesheetHref = href;
         VscodeIcon_1.nonce = nonce;
     }
+    willUpdate(changedProperties) {
+        if (changedProperties.has('size')) {
+            this.style.setProperty('--size', `${this.size}px`);
+        }
+        if (changedProperties.has('spinDuration')) {
+            this.style.setProperty('--spin-duration', `${this.spinDuration}s`);
+        }
+    }
     /**
      * For using web fonts in web components, the font stylesheet must be included
      * twice: on the page and in the web component. This function looks for the
@@ -69,22 +78,21 @@ let VscodeIcon = VscodeIcon_1 = class VscodeIcon extends VscElement {
         const linkElement = document.getElementById('vscode-codicon-stylesheet');
         const href = linkElement?.getAttribute('href') || undefined;
         const nonce = linkElement?.getAttribute('nonce') || undefined;
+        if (!linkElement) {
+            let msg = '[VSCode Elements] To use the Icon component, the codicons.css file must be included in the page with the id `vscode-codicon-stylesheet`! ';
+            msg += 'See https://vscode-elements.github.io/components/icon/ for more details.';
+            console.warn(msg);
+        }
         return { nonce, href };
     }
     render() {
         const { stylesheetHref, nonce } = VscodeIcon_1;
         const content = html `<span
-      class="${classMap({
+      class=${classMap({
             codicon: true,
             ['codicon-' + this.name]: true,
             spin: this.spin,
-        })}"
-      style="${styleMap({
-            animationDuration: String(this.spinDuration) + 's',
-            fontSize: this.size + 'px',
-            height: this.size + 'px',
-            width: this.size + 'px',
-        })}"
+        })}
     ></span>`;
         const wrapped = this.actionIcon
             ? html ` <button
@@ -100,7 +108,7 @@ let VscodeIcon = VscodeIcon_1 = class VscodeIcon extends VscElement {
         return html `
       <link
         rel="stylesheet"
-        href="${ifDefined(stylesheetHref)}"
+        href=${ifDefined(stylesheetHref)}
         nonce=${ifDefined(nonce)}
       />
       ${wrapped}

package/dist/vscode-icon/vscode-icon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-icon.js","sourceRoot":"","sources":["../../src/vscode-icon/vscode-icon.ts"],"names":[],"mappings":";;;;;;;AAAA,OAAO,EAAC,IAAI,~~EAAiB~~,MAAM,KAAK,CAAC;~~AACzC~~,OAAO,EAAC,aAAa,EAAE,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AACrD,OAAO,EAAC,~~QAAQ,EAAC,MAAM,6BAA6B,CAAC;AACrD,OAAO,EAAC,~~SAAS,EAAC,MAAM,8BAA8B,CAAC;AACvD,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,MAAM,MAAM,yBAAyB,CAAC;AAE7C~~;;;;;;;;;GASG~~;AAEI,IAAM,UAAU,kBAAhB,MAAM,UAAW,SAAQ,UAAU;IAAnC;;QAEL;;WAEG;QAEH,UAAK,GAAG,EAAE,CAAC;QAEX;;WAEG;QAEH,SAAI,GAAG,EAAE,CAAC;QAEV;;WAEG;QAEH,SAAI,GAAG,EAAE,CAAC;QAEV;;WAEG;QAEH,SAAI,GAAG,KAAK,CAAC;QAEb;;WAEG;QAEH,iBAAY,GAAG,GAAG,CAAC;QAEnB;;WAEG;QAEH,eAAU,GAAG,KAAK,CAAC;~~QAgCX~~,mBAAc,GAAG,CAAC,EAAc,EAAE,EAAE;YAC1C,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,WAAW,EAAE,EAAC,MAAM,EAAE,EAAC,aAAa,EAAE,EAAE,EAAC,EAAC,CAAC,CAC5D,CAAC;QACJ,CAAC,CAAC;~~IAwCJ~~,CAAC;~~IAtEC~~,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,MAAM,EAAC,IAAI,EAAE,KAAK,EAAC,GAAG,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAElD,YAAU,CAAC,cAAc,GAAG,IAAI,CAAC;QACjC,YAAU,CAAC,KAAK,GAAG,KAAK,CAAC;IAC3B,CAAC;IAED;;;;;OAKG;IACK,oBAAoB;QAI1B,MAAM,WAAW,GAAG,QAAQ,CAAC,cAAc,CAAC,2BAA2B,CAAC,CAAC;QACzE,MAAM,IAAI,GAAG,WAAW,EAAE,YAAY,CAAC,MAAM,CAAC,IAAI,SAAS,CAAC;QAC5D,MAAM,KAAK,GAAG,WAAW,EAAE,YAAY,CAAC,OAAO,CAAC,IAAI,SAAS,CAAC;QAE9D,OAAO,EAAC,KAAK,EAAE,IAAI,EAAC,CAAC;IACvB,CAAC;IAQD,MAAM;QACJ,MAAM,EAAC,cAAc,EAAE,KAAK,EAAC,GAAG,YAAU,CAAC;QAE3C,MAAM,OAAO,GAAG,IAAI,CAAA;~~eACT~~,QAAQ,CAAC;~~YAChB~~,OAAO,EAAE,IAAI;YACb,CAAC,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI;YAC9B,IAAI,EAAE,IAAI,CAAC,IAAI;SAChB,CAAC;eACO,QAAQ,CAAC;YAChB,iBAAiB,EAAE,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,GAAG,GAAG;YAClD,QAAQ,EAAE,IAAI,CAAC,IAAI,GAAG,IAAI;YAC1B,MAAM,EAAE,IAAI,CAAC,IAAI,GAAG,IAAI;YACxB,KAAK,EAAE,IAAI,CAAC,IAAI,GAAG,IAAI;SACxB,CAAC;aACK,CAAC;QAEV,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU;YAC7B,CAAC,CAAC,IAAI,CAAA;;mBAEO,IAAI,CAAC,cAAc;uBACf,IAAI,CAAC,KAAK;;YAErB,OAAO;kBACD;YACZ,CAAC,CAAC,IAAI,CAAA;aACC,OAAO;UACV,CAAC;QAEP,OAAO,IAAI,CAAA;;;~~gBAGC~~,SAAS,CAAC,cAAc,CAAC;~~gBACzB~~,SAAS,CAAC,KAAK,CAAC;;QAExB,OAAO;KACV,CAAC;IACJ,CAAC;;~~AA9GM~~,iBAAM,GAAG,MAAM,AAAT,CAAU;AAqCR,yBAAc,GAAuB,EAAE,AAAzB,CAA0B;AAExC,gBAAK,GAAuB,EAAE,AAAzB,CAA0B;AAlC9C;IADC,QAAQ,EAAE;yCACA;AAMX;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;wCACf;AAMV;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;wCACf;AAMV;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;wCAC5B;AAMb;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe,EAAC,CAAC;gDAClC;AAMnB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,aAAa,EAAC,CAAC;8CAChD;AApCR,UAAU;IADtB,aAAa,CAAC,aAAa,CAAC;GAChB,UAAU,~~CAgHtB~~","sourcesContent":["import {html, TemplateResult} from 'lit';\nimport {customElement, property} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {~~styleMap} from 'lit/directives/style-map.js';\nimport {~~ifDefined} from 'lit/directives/if-defined.js';\nimport {VscElement} from '../includes/VscElement.js';\nimport styles from './vscode-icon.styles.js';\n\n/*\n Display a [Codicon](https://microsoft.github.io/vscode-codicons/dist/codicon.html).\n * In \"action-icon\" mode it behaves like a button. In this case, it is\n * recommended that a meaningful label is specified with the `label` property.\n \n @cssprop --vscode-icon-foreground\n * @cssprop --vscode-toolbar-hoverBackground - Hover state background color in `active-icon` mode\n * @cssprop --vscode-toolbar-activeBackground - Active state background color in `active-icon` mode\n * @cssprop --vscode-focusBorder\n /\n@customElement('vscode-icon')\nexport class VscodeIcon extends VscElement {\n static styles = styles;\n /\n Set a meaningful label in `action-icon` mode for the screen readers\n /\n @property()\n label = '';\n\n /\n [Codicon](https://microsoft.github.io/vscode-codicons/dist/codicon.html) icon name.\n /\n @property({type: String})\n name = '';\n\n /\n Icon size in pixels\n /\n @property({type: Number})\n size = 16;\n\n /\n Enable rotation animation\n /\n @property({type: Boolean, reflect: true})\n spin = false;\n\n /\n Animation duration in seconds\n /\n @property({type: Number, attribute: 'spin-duration'})\n spinDuration = 1.5;\n\n /\n Behaves like a button\n /\n @property({type: Boolean, reflect: true, attribute: 'action-icon'})\n actionIcon = false;\n\n private static stylesheetHref: string \| undefined = '';\n\n private static nonce: string \| undefined = '';\n\n connectedCallback(): void {\n super.connectedCallback();\n\n const {href, nonce} = this._getStylesheetConfig();\n\n VscodeIcon.stylesheetHref = href;\n VscodeIcon.nonce = nonce;\n }\n\n /\n For using web fonts in web components, the font stylesheet must be included\n * twice: on the page and in the web component. This function looks for the\n * font stylesheet on the page and returns the stylesheet URL and the nonce\n * id.\n */\n private _getStylesheetConfig(): {\n href: string \| undefined;\n nonce: string \| undefined;\n } {\n const linkElement = document.getElementById('vscode-codicon-stylesheet');\n const href = linkElement?.getAttribute('href') \|\| undefined;\n const nonce = linkElement?.getAttribute('nonce') \|\| undefined;\n\n return {nonce, href};\n }\n\n private _onButtonClick = (ev: MouseEvent) => {\n this.dispatchEvent(\n new CustomEvent('vsc-click', {detail: {originalEvent: ev}})\n );\n };\n\n render(): TemplateResult {\n const {stylesheetHref, nonce} = VscodeIcon;\n\n const content = html`<span\n class~~=\"$~~{classMap({\n codicon: true,\n ['codicon-' + this.name]: true,\n spin: this.spin,\n })}\"\n style=\"${styleMap({\n animationDuration: String(this.spinDuration) + 's',\n fontSize: this.size + 'px',\n height: this.size + 'px',\n width: this.size + 'px',\n })}\"\n ></span>`;\n\n const wrapped = this.actionIcon\n ? html` <button\n class=\"button\"\n @click=${this._onButtonClick}\n aria-label=${this.label}\n >\n ${content}\n </button>`\n : html` <span class=\"icon\" aria-hidden=\"true\" role=\"presentation\"\n >${content}</span\n >`;\n\n return html`\n <link\n rel=\"stylesheet\"\n href~~=\"$~~{ifDefined(stylesheetHref)}\"\n nonce=${ifDefined(nonce)}\n />\n ${wrapped}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-icon': VscodeIcon;\n }\n}\n"]}
1	+ {"version":3,"file":"vscode-icon.js","sourceRoot":"","sources":["../../src/vscode-icon/vscode-icon.ts"],"names":[],"mappings":"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","sourcesContent":["import {html, PropertyValues, TemplateResult} from 'lit';\nimport {customElement, property} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {ifDefined} from 'lit/directives/if-defined.js';\nimport {VscElement} from '../includes/VscElement.js';\nimport styles from './vscode-icon.styles.js';\n\n/*\n Display a [Codicon](https://microsoft.github.io/vscode-codicons/dist/codicon.html).\n * In \"action-icon\" mode it behaves like a button. In this case, it is\n * recommended that a meaningful label is specified with the `label` property.\n \n @tag vscode-icon\n \n @cssprop --vscode-icon-foreground\n * @cssprop --vscode-toolbar-hoverBackground - Hover state background color in `active-icon` mode\n * @cssprop --vscode-toolbar-activeBackground - Active state background color in `active-icon` mode\n * @cssprop --vscode-focusBorder\n /\n@customElement('vscode-icon')\nexport class VscodeIcon extends VscElement {\n static styles = styles;\n /\n Set a meaningful label in `action-icon` mode for the screen readers\n /\n @property()\n label = '';\n\n /\n [Codicon](https://microsoft.github.io/vscode-codicons/dist/codicon.html) icon name.\n /\n @property({type: String})\n name = '';\n\n /\n Icon size in pixels\n /\n @property({type: Number})\n size = 16;\n\n /\n Enable rotation animation\n /\n @property({type: Boolean, reflect: true})\n spin = false;\n\n /\n Animation duration in seconds\n /\n @property({type: Number, attribute: 'spin-duration'})\n spinDuration = 1.5;\n\n /\n Behaves like a button\n /\n @property({type: Boolean, reflect: true, attribute: 'action-icon'})\n actionIcon = false;\n\n private static stylesheetHref: string \| undefined = '';\n\n private static nonce: string \| undefined = '';\n\n connectedCallback(): void {\n super.connectedCallback();\n\n const {href, nonce} = this._getStylesheetConfig();\n\n VscodeIcon.stylesheetHref = href;\n VscodeIcon.nonce = nonce;\n }\n\n protected willUpdate(changedProperties: PropertyValues): void {\n if (changedProperties.has('size')) {\n this.style.setProperty('--size', `${this.size}px`);\n }\n\n if (changedProperties.has('spinDuration')) {\n this.style.setProperty('--spin-duration', `${this.spinDuration}s`);\n }\n }\n\n /\n For using web fonts in web components, the font stylesheet must be included\n * twice: on the page and in the web component. This function looks for the\n * font stylesheet on the page and returns the stylesheet URL and the nonce\n * id.\n */\n private _getStylesheetConfig(): {\n href: string \| undefined;\n nonce: string \| undefined;\n } {\n const linkElement = document.getElementById('vscode-codicon-stylesheet');\n const href = linkElement?.getAttribute('href') \|\| undefined;\n const nonce = linkElement?.getAttribute('nonce') \|\| undefined;\n\n if (!linkElement) {\n let msg = '[VSCode Elements] To use the Icon component, the codicons.css file must be included in the page with the id `vscode-codicon-stylesheet`! ';\n msg += 'See https://vscode-elements.github.io/components/icon/ for more details.';\n\n console.warn(msg);\n }\n\n return {nonce, href};\n }\n\n private _onButtonClick = (ev: MouseEvent) => {\n this.dispatchEvent(\n new CustomEvent('vsc-click', {detail: {originalEvent: ev}})\n );\n };\n\n render(): TemplateResult {\n const {stylesheetHref, nonce} = VscodeIcon;\n\n const content = html`<span\n class=${classMap({\n codicon: true,\n ['codicon-' + this.name]: true,\n spin: this.spin,\n })}\n ></span>`;\n\n const wrapped = this.actionIcon\n ? html` <button\n class=\"button\"\n @click=${this._onButtonClick}\n aria-label=${this.label}\n >\n ${content}\n </button>`\n : html` <span class=\"icon\" aria-hidden=\"true\" role=\"presentation\"\n >${content}</span\n >`;\n\n return html`\n <link\n rel=\"stylesheet\"\n href=${ifDefined(stylesheetHref)}\n nonce=${ifDefined(nonce)}\n />\n ${wrapped}\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-icon': VscodeIcon;\n }\n}\n"]}

package/dist/vscode-icon/vscode-icon.styles.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-icon.styles.d.ts","sourceRoot":"","sources":["../../src/vscode-icon/vscode-icon.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAM,cAAc,EAAC,MAAM,KAAK,CAAC;AAGxC,QAAA,MAAM,MAAM,EAAE,~~cAyDb~~,CAAC;AAEF,eAAe,MAAM,CAAC"}
1	+ {"version":3,"file":"vscode-icon.styles.d.ts","sourceRoot":"","sources":["../../src/vscode-icon/vscode-icon.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAM,cAAc,EAAC,MAAM,KAAK,CAAC;AAGxC,QAAA,MAAM,MAAM,EAAE,cA6Db,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/vscode-icon/vscode-icon.styles.js CHANGED Viewed

@@ -9,7 +9,11 @@ const styles = [
     }
     .codicon[class*='codicon-'] {
+      animation-duration: var(--spin-duration) !important;
       display: block;
+      font-size: var(--size);
+      height: var(--size);
+      width: var(--size);
     }
     .icon,

package/dist/vscode-icon/vscode-icon.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-icon.styles.js","sourceRoot":"","sources":["../../src/vscode-icon/vscode-icon.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAiB,MAAM,KAAK,CAAC;AACxC,OAAO,aAAa,MAAM,+BAA+B,CAAC;AAE1D,MAAM,MAAM,GAAmB;IAC7B,aAAa;IACb,GAAG,CAAA~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsDF~~;CACF,CAAC;AAEF,eAAe,MAAM,CAAC","sourcesContent":["import {css, CSSResultGroup} from 'lit';\nimport defaultStyles from '../includes/default.styles.js';\n\nconst styles: CSSResultGroup = [\n defaultStyles,\n css`\n :host {\n color: var(--vscode-icon-foreground);\n display: inline-block;\n }\n\n .codicon[class*='codicon-'] {\n display: block;\n }\n\n .icon,\n .button {\n background-color: transparent;\n display: block;\n padding: 0;\n }\n\n .button {\n border-color: transparent;\n border-style: solid;\n border-width: 1px;\n border-radius: 5px;\n color: currentColor;\n cursor: pointer;\n padding: 2px;\n }\n\n .button:hover {\n background-color: var(--vscode-toolbar-hoverBackground);\n }\n\n .button:active {\n background-color: var(--vscode-toolbar-activeBackground);\n }\n\n .button:focus {\n outline: none;\n }\n\n .button:focus-visible {\n border-color: var(--vscode-focusBorder);\n }\n\n @keyframes icon-spin {\n 100% {\n transform: rotate(360deg);\n }\n }\n\n .spin {\n animation-name: icon-spin;\n animation-timing-function: linear;\n animation-iteration-count: infinite;\n }\n `,\n];\n\nexport default styles;\n"]}
1	+ {"version":3,"file":"vscode-icon.styles.js","sourceRoot":"","sources":["../../src/vscode-icon/vscode-icon.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAiB,MAAM,KAAK,CAAC;AACxC,OAAO,aAAa,MAAM,+BAA+B,CAAC;AAE1D,MAAM,MAAM,GAAmB;IAC7B,aAAa;IACb,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0DF;CACF,CAAC;AAEF,eAAe,MAAM,CAAC","sourcesContent":["import {css, CSSResultGroup} from 'lit';\nimport defaultStyles from '../includes/default.styles.js';\n\nconst styles: CSSResultGroup = [\n defaultStyles,\n css`\n :host {\n color: var(--vscode-icon-foreground);\n display: inline-block;\n }\n\n .codicon[class*='codicon-'] {\n animation-duration: var(--spin-duration) !important;\n display: block;\n font-size: var(--size);\n height: var(--size);\n width: var(--size);\n }\n\n .icon,\n .button {\n background-color: transparent;\n display: block;\n padding: 0;\n }\n\n .button {\n border-color: transparent;\n border-style: solid;\n border-width: 1px;\n border-radius: 5px;\n color: currentColor;\n cursor: pointer;\n padding: 2px;\n }\n\n .button:hover {\n background-color: var(--vscode-toolbar-hoverBackground);\n }\n\n .button:active {\n background-color: var(--vscode-toolbar-activeBackground);\n }\n\n .button:focus {\n outline: none;\n }\n\n .button:focus-visible {\n border-color: var(--vscode-focusBorder);\n }\n\n @keyframes icon-spin {\n 100% {\n transform: rotate(360deg);\n }\n }\n\n .spin {\n animation-name: icon-spin;\n animation-timing-function: linear;\n animation-iteration-count: infinite;\n }\n `,\n];\n\nexport default styles;\n"]}

package/dist/vscode-label/vscode-label.d.ts CHANGED Viewed

@@ -1,6 +1,8 @@
 import { TemplateResult } from 'lit';
 import { VscElement } from '../includes/VscElement.js';
 /**
+ * @tag vscode-label
+ *
  * @cssprop --vscode-font-family
  * @cssprop --vscode-font-size
  * @cssprop --vscode-foreground

package/dist/vscode-label/vscode-label.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-label.d.ts","sourceRoot":"","sources":["../../src/vscode-label/vscode-label.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAC,MAAM,KAAK,CAAC;AAIzC,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AAWrD~~;;;;GAIG~~;AACH,qBACa,WAAY,SAAQ,UAAU;IACzC,MAAM,CAAC,MAAM,+BAAU;IAEvB,IACI,OAAO,CAAC,GAAG,EAAE,MAAM,EAOtB;IAED,IAAI,OAAO,IAAI,MAAM,CAEpB;IAED,IACI,EAAE,CAAC,GAAG,EAAE,MAAM,EAEjB;IAED,IAAI,EAAE,IAAI,MAAM,CAEf;IAGD,QAAQ,UAAS;IAEjB,wBAAwB,CACtB,IAAI,EAAE,MAAM,EACZ,GAAG,EAAE,MAAM,GAAG,IAAI,EAClB,KAAK,EAAE,MAAM,GACZ,IAAI;IAIP,iBAAiB,IAAI,IAAI;IAazB,OAAO,CAAC,GAAG,CAAM;IAEjB,OAAO,CAAC,QAAQ,CAAM;IAEtB,OAAO,CAAC,UAAU,CAAS;IAE3B,OAAO,CAAC,UAAU;YAcJ,kBAAkB;IAuBhC,OAAO,CAAC,YAAY;IAQpB,MAAM,IAAI,cAAc;CASzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAC;KAC7B;CACF"}
1	+ {"version":3,"file":"vscode-label.d.ts","sourceRoot":"","sources":["../../src/vscode-label/vscode-label.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAC,MAAM,KAAK,CAAC;AAIzC,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AAWrD;;;;;;GAMG;AACH,qBACa,WAAY,SAAQ,UAAU;IACzC,MAAM,CAAC,MAAM,+BAAU;IAEvB,IACI,OAAO,CAAC,GAAG,EAAE,MAAM,EAOtB;IAED,IAAI,OAAO,IAAI,MAAM,CAEpB;IAED,IACI,EAAE,CAAC,GAAG,EAAE,MAAM,EAEjB;IAED,IAAI,EAAE,IAAI,MAAM,CAEf;IAGD,QAAQ,UAAS;IAEjB,wBAAwB,CACtB,IAAI,EAAE,MAAM,EACZ,GAAG,EAAE,MAAM,GAAG,IAAI,EAClB,KAAK,EAAE,MAAM,GACZ,IAAI;IAIP,iBAAiB,IAAI,IAAI;IAazB,OAAO,CAAC,GAAG,CAAM;IAEjB,OAAO,CAAC,QAAQ,CAAM;IAEtB,OAAO,CAAC,UAAU,CAAS;IAE3B,OAAO,CAAC,UAAU;YAcJ,kBAAkB;IAuBhC,OAAO,CAAC,YAAY;IAQpB,MAAM,IAAI,cAAc;CASzB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,WAAW,CAAC;KAC7B;CACF"}

package/dist/vscode-label/vscode-label.js CHANGED Viewed

@@ -15,6 +15,8 @@ import { VscodeTextarea } from '../vscode-textarea/index.js';
 import { VscodeTextfield } from '../vscode-textfield/index.js';
 import styles from './vscode-label.styles.js';
 /**
+ * @tag vscode-label
+ *
  * @cssprop --vscode-font-family
  * @cssprop --vscode-font-size
  * @cssprop --vscode-foreground
@@ -89,7 +91,7 @@ let VscodeLabel = class VscodeLabel extends VscElement {
     render() {
         return html `
       <label
-        class="${classMap({ wrapper: true, required: this.required })}"
+        class=${classMap({ wrapper: true, required: this.required })}
         @click=${this._handleClick}
         ><slot></slot
       ></label>

package/dist/vscode-label/vscode-label.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-label.js","sourceRoot":"","sources":["../../src/vscode-label/vscode-label.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAC,IAAI,EAAiB,MAAM,KAAK,CAAC;AACzC,OAAO,EAAC,aAAa,EAAE,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AACrD,OAAO,QAAQ,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAC,UAAU,EAAC,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAC,mBAAmB,EAAC,MAAM,mCAAmC,CAAC;AACtE,OAAO,EAAC,gBAAgB,EAAC,MAAM,gCAAgC,CAAC;AAChE,OAAO,EAAC,cAAc,EAAC,MAAM,6BAA6B,CAAC;AAC3D,OAAO,EAAC,eAAe,EAAC,MAAM,8BAA8B,CAAC;AAC7D,OAAO,MAAM,MAAM,0BAA0B,CAAC;AAM9C~~;;;;GAIG~~;AAEI,IAAM,WAAW,GAAjB,MAAM,WAAY,SAAQ,UAAU;IAApC;;QA2BL,aAAQ,GAAG,KAAK,CAAC;QAuBT,QAAG,GAAG,EAAE,CAAC;QAET,aAAQ,GAAG,EAAE,CAAC;QAEd,eAAU,GAAG,KAAK,CAAC;IAwD7B,CAAC;IA1GC,IAAI,OAAO,CAAC,GAAW;QACrB,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC;QACpB,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAE9B,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC5B,CAAC;IACH,CAAC;IAED,IAAI,OAAO;QACT,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAGD,IAAI,EAAE,CAAC,GAAW;QAChB,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;IACjB,CAAC;IAED,IAAI,EAAE;QACJ,OAAO,IAAI,CAAC,GAAG,CAAC;IAClB,CAAC;IAKD,wBAAwB,CACtB,IAAY,EACZ,GAAkB,EAClB,KAAa;QAEb,KAAK,CAAC,wBAAwB,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,CAAC,CAAC;IACnD,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QAEvB,IAAI,IAAI,CAAC,GAAG,KAAK,EAAE,EAAE,CAAC;YACpB,IAAI,CAAC,GAAG,GAAG,QAAQ,CAAC,eAAe,CAAC,CAAC;YACrC,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;QACpC,CAAC;QAED,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAC5B,CAAC;IAQO,UAAU;QAChB,IAAI,MAAM,GAAuB,IAAI,CAAC;QAEtC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,CAAC,EAAC,QAAQ,EAAE,KAAK,EAAC,CAA0B,CAAC;YAE1E,IAAI,IAAI,EAAE,CAAC;gBACT,MAAM,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC;YACnD,CAAC;QACH,CAAC;QAED,OAAO,MAAM,CAAC;IAChB,CAAC;IAEO,KAAK,CAAC,kBAAkB;QAC9B,MAAM,IAAI,CAAC,cAAc,CAAC;QAE1B,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QAEjC,IACE,MAAM,YAAY,gBAAgB;YAClC,MAAM,YAAY,mBAAmB,EACrC,CAAC;YACD,MAAM,CAAC,YAAY,CAAC,iBAAiB,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;QACnD,CAAC;QAED,IAAI,KAAK,GAAG,EAAE,CAAC;QAEf,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACrB,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;QAClC,CAAC;QAED,IAAI,MAAM,YAAY,eAAe,IAAI,MAAM,YAAY,cAAc,EAAE,CAAC;YAC1E,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC;QACvB,CAAC;IACH,CAAC;IAEO,YAAY;QAClB,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QAEjC,IAAI,MAAM,IAAI,OAAO,IAAI,MAAM,EAAE,CAAC;YAC/B,MAA2B,CAAC,KAAK,EAAE,CAAC;QACvC,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;~~iBAEE~~,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAC,CAAC;~~iBAClD~~,IAAI,CAAC,YAAY;;;KAG7B,CAAC;IACJ,CAAC;;AA5GM,kBAAM,GAAG,MAAM,AAAT,CAAU;AAGvB;IADC,QAAQ,CAAC,EAAC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAC,CAAC;0CAQ3C;AAOD;IADC,QAAQ,EAAE;qCAGV;AAOD;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC;6CACxB;AA3BN,WAAW;IADvB,aAAa,CAAC,cAAc,CAAC;GACjB,WAAW,CA8GvB","sourcesContent":["import {html, TemplateResult} from 'lit';\nimport {customElement, property} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport uniqueId from '../includes/uniqueId.js';\nimport {VscElement} from '../includes/VscElement.js';\nimport {VscodeCheckboxGroup} from '../vscode-checkbox-group/index.js';\nimport {VscodeRadioGroup} from '../vscode-radio-group/index.js';\nimport {VscodeTextarea} from '../vscode-textarea/index.js';\nimport {VscodeTextfield} from '../vscode-textfield/index.js';\nimport styles from './vscode-label.styles.js';\n\ninterface FocusableElement extends Element {\n focus: () => void;\n}\n\n/*\n @cssprop --vscode-font-family\n * @cssprop --vscode-font-size\n * @cssprop --vscode-foreground\n */\n@customElement('vscode-label')\nexport class VscodeLabel extends VscElement {\n static styles = styles;\n\n @property({reflect: true, attribute: 'for'})\n set htmlFor(val: string) {\n this._htmlFor = val;\n this.setAttribute('for', val);\n\n if (this._connected) {\n this._connectWithTarget();\n }\n }\n\n get htmlFor(): string {\n return this._htmlFor;\n }\n\n @property()\n set id(val: string) {\n this._id = val;\n }\n\n get id(): string {\n return this._id;\n }\n\n @property({type: Boolean, reflect: true})\n required = false;\n\n attributeChangedCallback(\n name: string,\n old: string \| null,\n value: string\n ): void {\n super.attributeChangedCallback(name, old, value);\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n\n this._connected = true;\n\n if (this._id === '') {\n this._id = uniqueId('vscode-label-');\n this.setAttribute('id', this._id);\n }\n\n this._connectWithTarget();\n }\n\n private _id = '';\n\n private _htmlFor = '';\n\n private _connected = false;\n\n private _getTarget() {\n let target: HTMLElement \| null = null;\n\n if (this._htmlFor) {\n const root = this.getRootNode({composed: false}) as Document \| ShadowRoot;\n\n if (root) {\n target = root.querySelector(`#${this._htmlFor}`);\n }\n }\n\n return target;\n }\n\n private async _connectWithTarget() {\n await this.updateComplete;\n\n const target = this._getTarget();\n\n if (\n target instanceof VscodeRadioGroup \|\|\n target instanceof VscodeCheckboxGroup\n ) {\n target.setAttribute('aria-labelledby', this._id);\n }\n\n let label = '';\n\n if (this.textContent) {\n label = this.textContent.trim();\n }\n\n if (target instanceof VscodeTextfield \|\| target instanceof VscodeTextarea) {\n target.label = label;\n }\n }\n\n private _handleClick() {\n const target = this._getTarget();\n\n if (target && 'focus' in target) {\n (target as FocusableElement).focus();\n }\n }\n\n render(): TemplateResult {\n return html`\n <label\n class~~=\"$~~{classMap({wrapper: true, required: this.required})}\"\n @click=${this._handleClick}\n ><slot></slot\n ></label>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-label': VscodeLabel;\n }\n}\n"]}
1	+ {"version":3,"file":"vscode-label.js","sourceRoot":"","sources":["../../src/vscode-label/vscode-label.ts"],"names":[],"mappings":"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","sourcesContent":["import {html, TemplateResult} from 'lit';\nimport {customElement, property} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport uniqueId from '../includes/uniqueId.js';\nimport {VscElement} from '../includes/VscElement.js';\nimport {VscodeCheckboxGroup} from '../vscode-checkbox-group/index.js';\nimport {VscodeRadioGroup} from '../vscode-radio-group/index.js';\nimport {VscodeTextarea} from '../vscode-textarea/index.js';\nimport {VscodeTextfield} from '../vscode-textfield/index.js';\nimport styles from './vscode-label.styles.js';\n\ninterface FocusableElement extends Element {\n focus: () => void;\n}\n\n/*\n @tag vscode-label\n \n @cssprop --vscode-font-family\n * @cssprop --vscode-font-size\n * @cssprop --vscode-foreground\n */\n@customElement('vscode-label')\nexport class VscodeLabel extends VscElement {\n static styles = styles;\n\n @property({reflect: true, attribute: 'for'})\n set htmlFor(val: string) {\n this._htmlFor = val;\n this.setAttribute('for', val);\n\n if (this._connected) {\n this._connectWithTarget();\n }\n }\n\n get htmlFor(): string {\n return this._htmlFor;\n }\n\n @property()\n set id(val: string) {\n this._id = val;\n }\n\n get id(): string {\n return this._id;\n }\n\n @property({type: Boolean, reflect: true})\n required = false;\n\n attributeChangedCallback(\n name: string,\n old: string \| null,\n value: string\n ): void {\n super.attributeChangedCallback(name, old, value);\n }\n\n connectedCallback(): void {\n super.connectedCallback();\n\n this._connected = true;\n\n if (this._id === '') {\n this._id = uniqueId('vscode-label-');\n this.setAttribute('id', this._id);\n }\n\n this._connectWithTarget();\n }\n\n private _id = '';\n\n private _htmlFor = '';\n\n private _connected = false;\n\n private _getTarget() {\n let target: HTMLElement \| null = null;\n\n if (this._htmlFor) {\n const root = this.getRootNode({composed: false}) as Document \| ShadowRoot;\n\n if (root) {\n target = root.querySelector(`#${this._htmlFor}`);\n }\n }\n\n return target;\n }\n\n private async _connectWithTarget() {\n await this.updateComplete;\n\n const target = this._getTarget();\n\n if (\n target instanceof VscodeRadioGroup \|\|\n target instanceof VscodeCheckboxGroup\n ) {\n target.setAttribute('aria-labelledby', this._id);\n }\n\n let label = '';\n\n if (this.textContent) {\n label = this.textContent.trim();\n }\n\n if (target instanceof VscodeTextfield \|\| target instanceof VscodeTextarea) {\n target.label = label;\n }\n }\n\n private _handleClick() {\n const target = this._getTarget();\n\n if (target && 'focus' in target) {\n (target as FocusableElement).focus();\n }\n }\n\n render(): TemplateResult {\n return html`\n <label\n class=${classMap({wrapper: true, required: this.required})}\n @click=${this._handleClick}\n ><slot></slot\n ></label>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-label': VscodeLabel;\n }\n}\n"]}

package/dist/vscode-multi-select/vscode-multi-select.d.ts CHANGED Viewed

@@ -7,6 +7,8 @@ import { AssociatedFormControl } from '../includes/AssociatedFormControl.js';
  * When participating in a form, it supports the `:invalid` pseudo class. Otherwise the error styles
  * can be applied through the `invalid` property.
  *
+ * @tag vscode-multi-select
+ *
  * @prop {boolean} invalid
  * @attr {boolean} invalid
  * @attr name - Name which is used as a variable name in the data of the form-container.

package/dist/vscode-multi-select/vscode-multi-select.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-multi-select.d.ts","sourceRoot":"","sources":["../../src/vscode-multi-select/vscode-multi-select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,cAAc,EAAC,MAAM,KAAK,CAAC;AAKrD,OAAO,EAAC,gBAAgB,EAAC,MAAM,iDAAiD,CAAC;AAEjF,OAAO,EAAC,qBAAqB,EAAC,MAAM,sCAAsC,CAAC;AAG3E~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG~~;AACH,qBACa,iBACX,SAAQ,gBACR,YAAW,qBAAqB;IAEhC,MAAM,CAAC,MAAM,4BAAU;IAEvB,gBAAgB;IAChB,OAAgB,iBAAiB,EAAE,cAAc,CAG/C;IAEF,MAAM,CAAC,cAAc,UAAQ;IAG7B,YAAY,EAAE,MAAM,EAAE,CAAM;IAG5B,QAAQ,UAAS;IAGjB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAa;IAErC,IACI,eAAe,CAAC,GAAG,EAAE,MAAM,EAAE,EAEhC;IACD,IAAI,eAAe,IAAI,MAAM,EAAE,CAE9B;IAED,IACI,KAAK,CAAC,GAAG,EAAE,MAAM,EAAE,GAAG,MAAM,EA4B/B;IACD,IAAI,KAAK,IAAI,MAAM,EAAE,CAEpB;IAED,IAAI,IAAI,2BAEP;IAED,gBAAgB;IAChB,IAAI,IAAI,WAEP;IAED,IAAI,QAAQ,IAAI,aAAa,CAE5B;IAED,IAAI,iBAAiB,IAAI,MAAM,CAE9B;IAED,IAAI,YAAY,YAEf;IAED,aAAa,IAAI,OAAO;IAIxB,cAAc,IAAI,OAAO;IAIzB,OAAO,CAAC,UAAU,CAAmB;;IASrC,iBAAiB,IAAI,IAAI;IASzB,gBAAgB;IAChB,iBAAiB,IAAI,IAAI;IAMzB,gBAAgB;IAChB,wBAAwB,CACtB,KAAK,EAAE,QAAQ,EACf,KAAK,EAAE,SAAS,GAAG,cAAc,GAChC,IAAI;IASP,OAAO,CAAC,YAAY,CAAkB;IAEtC,OAAO,CAAC,gBAAgB;IAOxB,OAAO,CAAC,eAAe;IAevB,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,yBAAyB,CAAgB;IAEjD,SAAS,CAAC,aAAa,IAAI,IAAI;IAgB/B,OAAO,CAAC,cAAc;~~IAmCtB~~,OAAO,CAAC,mBAAmB;IAI3B,OAAO,CAAC,wBAAwB;IAQhC,OAAO,CAAC,sBAAsB;IAc9B,OAAO,CAAC,YAAY;IAepB,SAAS,CAAC,iBAAiB,IAAI,cAAc;IAY7C,SAAS,CAAC,mBAAmB,IAAI,cAAc;IA4B/C,SAAS,CAAC,cAAc,IAAI,cAAc;~~IA4C1C~~,SAAS,CAAC,uBAAuB,IAAI,cAAc;CA6BpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,iBAAiB,CAAC;KAC1C;CACF"}
1	+ {"version":3,"file":"vscode-multi-select.d.ts","sourceRoot":"","sources":["../../src/vscode-multi-select/vscode-multi-select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,cAAc,EAAC,MAAM,KAAK,CAAC;AAKrD,OAAO,EAAC,gBAAgB,EAAC,MAAM,iDAAiD,CAAC;AAEjF,OAAO,EAAC,qBAAqB,EAAC,MAAM,sCAAsC,CAAC;AAG3E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,qBACa,iBACX,SAAQ,gBACR,YAAW,qBAAqB;IAEhC,MAAM,CAAC,MAAM,4BAAU;IAEvB,gBAAgB;IAChB,OAAgB,iBAAiB,EAAE,cAAc,CAG/C;IAEF,MAAM,CAAC,cAAc,UAAQ;IAG7B,YAAY,EAAE,MAAM,EAAE,CAAM;IAG5B,QAAQ,UAAS;IAGjB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAa;IAErC,IACI,eAAe,CAAC,GAAG,EAAE,MAAM,EAAE,EAEhC;IACD,IAAI,eAAe,IAAI,MAAM,EAAE,CAE9B;IAED,IACI,KAAK,CAAC,GAAG,EAAE,MAAM,EAAE,GAAG,MAAM,EA4B/B;IACD,IAAI,KAAK,IAAI,MAAM,EAAE,CAEpB;IAED,IAAI,IAAI,2BAEP;IAED,gBAAgB;IAChB,IAAI,IAAI,WAEP;IAED,IAAI,QAAQ,IAAI,aAAa,CAE5B;IAED,IAAI,iBAAiB,IAAI,MAAM,CAE9B;IAED,IAAI,YAAY,YAEf;IAED,aAAa,IAAI,OAAO;IAIxB,cAAc,IAAI,OAAO;IAIzB,OAAO,CAAC,UAAU,CAAmB;;IASrC,iBAAiB,IAAI,IAAI;IASzB,gBAAgB;IAChB,iBAAiB,IAAI,IAAI;IAMzB,gBAAgB;IAChB,wBAAwB,CACtB,KAAK,EAAE,QAAQ,EACf,KAAK,EAAE,SAAS,GAAG,cAAc,GAChC,IAAI;IASP,OAAO,CAAC,YAAY,CAAkB;IAEtC,OAAO,CAAC,gBAAgB;IAOxB,OAAO,CAAC,eAAe;IAevB,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,yBAAyB,CAAgB;IAEjD,SAAS,CAAC,aAAa,IAAI,IAAI;IAgB/B,OAAO,CAAC,cAAc;IAuCtB,OAAO,CAAC,mBAAmB;IAI3B,OAAO,CAAC,wBAAwB;IAQhC,OAAO,CAAC,sBAAsB;IAc9B,OAAO,CAAC,YAAY;IAepB,SAAS,CAAC,iBAAiB,IAAI,cAAc;IAY7C,SAAS,CAAC,mBAAmB,IAAI,cAAc;IA4B/C,SAAS,CAAC,cAAc,IAAI,cAAc;IA6C1C,SAAS,CAAC,uBAAuB,IAAI,cAAc;CA6BpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,iBAAiB,CAAC;KAC1C;CACF"}

package/dist/vscode-multi-select/vscode-multi-select.js CHANGED Viewed

@@ -18,6 +18,8 @@ import { highlightRanges } from '../includes/vscode-select/helpers.js';
  * When participating in a form, it supports the `:invalid` pseudo class. Otherwise the error styles
  * can be applied through the `invalid` property.
  *
+ * @tag vscode-multi-select
+ *
  * @prop {boolean} invalid
  * @attr {boolean} invalid
  * @attr name - Name which is used as a variable name in the data of the form-container.
@@ -183,6 +185,9 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
         }
         const index = Number(optEl.dataset.index);
         if (this._options[index]) {
+            if (this._options[index].disabled) {
+                return;
+            }
             this._options[index].selected = !this._options[index].selected;
         }
         this._selectedIndexes = [];
@@ -237,8 +242,8 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
         return html `
       <div
         class="select-face face multiselect"
-        @click="${this._onFaceClick}"
-        tabindex="${this.tabIndex > -1 ? 0 : -1}"
+        @click=${this._onFaceClick}
+        tabindex=${this.tabIndex > -1 ? 0 : -1}
       >
         ${this._renderLabel()} ${chevronDownIcon}
       </div>
@@ -253,16 +258,16 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
           class="combobox-input"
           spellcheck="false"
           type="text"
-          .value="${inputVal}"
-          @focus="${this._onComboboxInputFocus}"
-          @input="${this._onComboboxInputInput}"
-          @click="${this._onComboboxInputClick}"
+          .value=${inputVal}
+          @focus=${this._onComboboxInputFocus}
+          @input=${this._onComboboxInputInput}
+          @click=${this._onComboboxInputClick}
         />
         <button
           class="combobox-button"
           type="button"
-          @click="${this._onComboboxButtonClick}"
-          @keydown="${this._onComboboxButtonKeyDown}"
+          @click=${this._onComboboxButtonClick}
+          @keydown=${this._onComboboxButtonKeyDown}
         >
           ${chevronDownIcon}
         </button>
@@ -274,15 +279,16 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
         return html `
       <ul
         class="options"
-        @click="${this._onOptionClick}"
-        @mouseover="${this._onOptionMouseOver}"
+        @click=${this._onOptionClick}
+        @mouseover=${this._onOptionMouseOver}
       >
         ${repeat(list, (op) => op.index, (op, index) => {
             const selected = this._selectedIndexes.includes(op.index);
             const optionClasses = classMap({
-                active: index === this._activeIndex,
+                active: index === this._activeIndex && !op.disabled,
                 option: true,
                 selected,
+                disabled: op.disabled,
             });
             const checkboxClasses = classMap({
                 'checkbox-icon': true,
@@ -290,11 +296,11 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
             });
             return html `
               <li
-                class="${optionClasses}"
-                data-index="${op.index}"
-                data-filtered-index="${index}"
+                class=${optionClasses}
+                data-index=${op.index}
+                data-filtered-index=${index}
               >
-                <span class="${checkboxClasses}"></span>
+                <span class=${checkboxClasses}></span>
                 <span class="option-label"
                   >${(op.ranges?.length ?? 0 > 0)
                 ? highlightRanges(op.label, op.ranges ?? [])
@@ -311,7 +317,7 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
       <div class="dropdown-controls">
         <button
           type="button"
-          @click="${this._onMultiSelectAllClick}"
+          @click=${this._onMultiSelectAllClick}
           title="Select all"
           class="action-icon"
           id="select-all"
@@ -320,7 +326,7 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
         </button>
         <button
           type="button"
-          @click="${this._onMultiDeselectAllClick}"
+          @click=${this._onMultiDeselectAllClick}
           title="Deselect all"
           class="action-icon"
           id="select-none"
@@ -329,7 +335,7 @@ let VscodeMultiSelect = class VscodeMultiSelect extends VscodeSelectBase {
         </button>
         <vscode-button
           class="button-accept"
-          @click="${this._onMultiAcceptClick}"
+          @click=${this._onMultiAcceptClick}
           >OK</vscode-button
         >
       </div>