npm - @vscode-elements/elements - Versions diffs - 1.16.1 → 1.17.0 - Mend

@vscode-elements/elements 1.16.1 → 1.17.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 (51) hide show

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

@@ -13,17 +13,67 @@ import styles from './vscode-scrollable.styles.js';
 /**
  * @tag vscode-scrollable
  *
- * @cssprop [--min-thumb-height=20px] - Scrollbar thumb minimum height
+ * @cssprop --min-thumb-height - (@deprecated) This css property is deprecated. Use the `minThumbSize` property instead.
  * @cssprop [--vscode-scrollbar-shadow=#000000]
  * @cssprop [--vscode-scrollbarSlider-background=rgba(121, 121, 121, 0.4)]
  * @cssprop [--vscode-scrollbarSlider-hoverBackground=rgba(100, 100, 100, 0.7)]
  * @cssprop [--vscode-scrollbarSlider-activeBackground=rgba(191, 191, 191, 0.4)]
  */
 let VscodeScrollable = class VscodeScrollable extends VscElement {
+    /**
+     * Scroll position.
+     */
+    set scrollPos(val) {
+        this._scrollPos = val;
+        this._updateScrollbar();
+        this._updateThumbPosition();
+        this.requestUpdate();
+    }
+    get scrollPos() {
+        return this._scrollPos;
+    }
+    /**
+     * The maximum amount of the `scrollPos`.
+     */
+    get scrollMax() {
+        if (!this._scrollableContainer) {
+            return 0;
+        }
+        return this._scrollableContainer.scrollHeight;
+    }
     constructor() {
-        super(...arguments);
+        super();
+        /**
+         * By default, the scrollbar appears only when the cursor hovers over the
+         * component. With this option, the scrollbar will always be visible.
+         */
+        this.alwaysVisible = false;
+        /**
+         * Scrolling speed multiplier when pressing `Alt`. This property is designed to use the value of
+         * `editor.fastScrollSensitivity`, `workbench.list.fastScrollSensitivity` or
+         * `terminal.integrated.fastScrollSensitivity` depending on the context.
+         */
+        this.fastScrollSensitivity = 5;
+        /**
+         * This setting defines the scrollbar's minimum size when the component contains a large amount of content.
+         */
+        this.minThumbSize = 20;
+        /**
+         * A multiplier to be used on the `deltaY` of the mouse wheel scroll events. This property is
+         * designed to use the value of `editor.mouseWheelScrollSensitivity`,
+         * `workbench.list.mouseWheelScrollSensitivity` or
+         * `terminal.integrated.mouseWheelScrollSensitivity` depending on the context.
+         */
+        this.mouseWheelScrollSensitivity = 1;
+        /**
+         * Controls shadow visibility when content overflows.
+         */
         this.shadow = true;
+        /**
+         * It's true when `scrollPos` greater than 0
+         */
         this.scrolled = false;
+        this._scrollPos = 0;
         this._isDragging = false;
         this._thumbHeight = 0;
         this._thumbY = 0;
@@ -36,29 +86,63 @@ let VscodeScrollable = class VscodeScrollable extends VscElement {
         this._scrollbarTrackZ = 0;
         this._resizeObserverCallback = () => {
             this._updateScrollbar();
+            this._updateThumbPosition();
         };
-        this._onSlotChange = () => {
+        //#region event handlers
+        this._handleSlotChange = () => {
+            this._updateScrollbar();
+            this._updateThumbPosition();
             this._zIndexFix();
         };
-        this._onScrollThumbMouseMoveBound = this._onScrollThumbMouseMove.bind(this);
-        this._onScrollThumbMouseUpBound = this._onScrollThumbMouseUp.bind(this);
-        this._onComponentMouseOverBound = this._onComponentMouseOver.bind(this);
-        this._onComponentMouseOutBound = this._onComponentMouseOut.bind(this);
-    }
-    set scrollPos(val) {
-        this._scrollableContainer.scrollTop = val;
-    }
-    get scrollPos() {
-        if (!this._scrollableContainer) {
-            return 0;
-        }
-        return this._scrollableContainer.scrollTop;
-    }
-    get scrollMax() {
-        if (!this._scrollableContainer) {
-            return 0;
-        }
-        return this._scrollableContainer.scrollHeight;
+        this._handleScrollThumbMouseMove = (event) => {
+            const rawThumbPos = this._scrollThumbStartY + (event.screenY - this._mouseStartY);
+            this._thumbY = this._limitThumbPos(rawThumbPos);
+            this.scrollPos = this._calculateScrollPosFromThumbPos(this._thumbY);
+            this.dispatchEvent(new CustomEvent('vsc-scrollable-scroll', {
+                detail: this.scrollPos,
+            }));
+        };
+        this._handleScrollThumbMouseUp = (event) => {
+            this._isDragging = false;
+            this._thumbActive = false;
+            const cr = this.getBoundingClientRect();
+            const { x, y, width, height } = cr;
+            const { pageX, pageY } = event;
+            if (pageX > x + width || pageX < x || pageY > y + height || pageY < y) {
+                this._thumbFade = true;
+                this._thumbVisible = false;
+            }
+            document.removeEventListener('mousemove', this._handleScrollThumbMouseMove);
+            document.removeEventListener('mouseup', this._handleScrollThumbMouseUp);
+        };
+        this._handleComponentMouseOver = () => {
+            this._thumbVisible = true;
+            this._thumbFade = false;
+        };
+        this._handleComponentMouseOut = () => {
+            if (!this._thumbActive) {
+                this._thumbVisible = false;
+                this._thumbFade = true;
+            }
+        };
+        this._handleComponentWheel = (ev) => {
+            ev.preventDefault();
+            const multiplier = ev.altKey
+                ? this.mouseWheelScrollSensitivity * this.fastScrollSensitivity
+                : this.mouseWheelScrollSensitivity;
+            this.scrollPos = this._limitScrollPos(this.scrollPos + ev.deltaY * multiplier);
+            this.dispatchEvent(new CustomEvent('vsc-scrollable-scroll', {
+                detail: this.scrollPos,
+            }));
+        };
+        this._handleScrollableContainerScroll = (ev) => {
+            if (ev.currentTarget) {
+                this.scrollPos = ev.currentTarget.scrollTop;
+            }
+        };
+        this.addEventListener('mouseover', this._handleComponentMouseOver);
+        this.addEventListener('mouseout', this._handleComponentMouseOut);
+        this.addEventListener('wheel', this._handleComponentWheel);
     }
     connectedCallback() {
         super.connectedCallback();
@@ -66,12 +150,10 @@ let VscodeScrollable = class VscodeScrollable extends VscElement {
         this._contentResizeObserver = new ResizeObserver(this._resizeObserverCallback);
         this.requestUpdate();
         this.updateComplete.then(() => {
-            this._scrollableContainer.addEventListener('scroll', this._onScrollableContainerScroll.bind(this));
             this._hostResizeObserver.observe(this);
             this._contentResizeObserver.observe(this._contentElement);
+            this._updateThumbPosition();
         });
-        this.addEventListener('mouseover', this._onComponentMouseOverBound);
-        this.addEventListener('mouseout', this._onComponentMouseOutBound);
     }
     disconnectedCallback() {
         super.disconnectedCallback();
@@ -79,18 +161,25 @@ let VscodeScrollable = class VscodeScrollable extends VscElement {
         this._hostResizeObserver.disconnect();
         this._contentResizeObserver.unobserve(this._contentElement);
         this._contentResizeObserver.disconnect();
-        this.removeEventListener('mouseover', this._onComponentMouseOverBound);
-        this.removeEventListener('mouseout', this._onComponentMouseOutBound);
+    }
+    firstUpdated(_changedProperties) {
+        this._updateThumbPosition();
+    }
+    _calcThumbHeight() {
+        const componentHeight = this.offsetHeight;
+        const contentHeight = this._contentElement?.offsetHeight ?? 0;
+        const proposedSize = componentHeight * (componentHeight / contentHeight);
+        return Math.max(this.minThumbSize, proposedSize);
     }
     _updateScrollbar() {
-        const compCr = this.getBoundingClientRect();
-        const contentCr = this._contentElement.getBoundingClientRect();
-        if (compCr.height >= contentCr.height) {
+        const contentHeight = this._contentElement?.offsetHeight ?? 0;
+        const componentHeight = this.offsetHeight;
+        if (componentHeight >= contentHeight) {
             this._scrollbarVisible = false;
         }
         else {
             this._scrollbarVisible = true;
-            this._thumbHeight = compCr.height * (compCr.height / contentCr.height);
+            this._thumbHeight = this._calcThumbHeight();
         }
         this.requestUpdate();
     }
@@ -111,68 +200,69 @@ let VscodeScrollable = class VscodeScrollable extends VscElement {
         this._scrollbarTrackZ = highestZ + 1;
         this.requestUpdate();
     }
-    _onScrollThumbMouseDown(event) {
-        const cmpCr = this.getBoundingClientRect();
-        const thCr = this._scrollThumbElement.getBoundingClientRect();
-        this._mouseStartY = event.screenY;
-        this._scrollThumbStartY = thCr.top - cmpCr.top;
-        this._isDragging = true;
-        this._thumbActive = true;
-        document.addEventListener('mousemove', this._onScrollThumbMouseMoveBound);
-        document.addEventListener('mouseup', this._onScrollThumbMouseUpBound);
+    _updateThumbPosition() {
+        if (!this._scrollableContainer) {
+            return;
+        }
+        const scrollTop = this._scrollPos;
+        this.scrolled = scrollTop > 0;
+        const componentH = this.offsetHeight;
+        const thumbH = this._thumbHeight;
+        const contentH = this._contentElement.offsetHeight;
+        const overflown = contentH - componentH;
+        const ratio = scrollTop / overflown;
+        const thumbYMax = componentH - thumbH;
+        this._thumbY = Math.min(ratio * (componentH - thumbH), thumbYMax);
     }
-    _onScrollThumbMouseMove(event) {
-        const predictedPos = this._scrollThumbStartY + (event.screenY - this._mouseStartY);
-        let nextPos = 0;
+    _calculateScrollPosFromThumbPos(scrollPos) {
         const cmpH = this.getBoundingClientRect().height;
         const thumbH = this._scrollThumbElement.getBoundingClientRect().height;
         const contentH = this._contentElement.getBoundingClientRect().height;
-        if (predictedPos < 0) {
-            nextPos = 0;
+        const rawScrollPos = (scrollPos / (cmpH - thumbH)) * (contentH - cmpH);
+        return this._limitScrollPos(rawScrollPos);
+    }
+    _limitScrollPos(newPos) {
+        if (newPos < 0) {
+            return 0;
         }
-        else if (predictedPos > cmpH - thumbH) {
-            nextPos = cmpH - thumbH;
+        else if (newPos > this.scrollMax) {
+            return this.scrollMax;
         }
         else {
-            nextPos = predictedPos;
+            return newPos;
         }
-        this._thumbY = nextPos;
-        this._scrollableContainer.scrollTop =
-            (nextPos / (cmpH - thumbH)) * (contentH - cmpH);
     }
-    _onScrollThumbMouseUp(event) {
-        this._isDragging = false;
-        this._thumbActive = false;
-        const cr = this.getBoundingClientRect();
-        const { x, y, width, height } = cr;
-        const { pageX, pageY } = event;
-        if (pageX > x + width || pageX < x || pageY > y + height || pageY < y) {
-            this._thumbFade = true;
-            this._thumbVisible = false;
-        }
-        document.removeEventListener('mousemove', this._onScrollThumbMouseMoveBound);
-        document.removeEventListener('mouseup', this._onScrollThumbMouseUpBound);
-    }
-    _onScrollableContainerScroll() {
-        const scrollTop = this._scrollableContainer.scrollTop;
-        this.scrolled = scrollTop > 0;
+    _limitThumbPos(newPos) {
         const cmpH = this.getBoundingClientRect().height;
         const thumbH = this._scrollThumbElement.getBoundingClientRect().height;
-        const contentH = this._contentElement.getBoundingClientRect().height;
-        const overflown = contentH - cmpH;
-        const ratio = scrollTop / overflown;
-        this._thumbY = ratio * (cmpH - thumbH);
+        if (newPos < 0) {
+            return 0;
+        }
+        else if (newPos > cmpH - thumbH) {
+            return cmpH - thumbH;
+        }
+        else {
+            return newPos;
+        }
     }
-    _onComponentMouseOver() {
-        this._thumbVisible = true;
-        this._thumbFade = false;
+    _handleScrollThumbMouseDown(event) {
+        const cmpCr = this.getBoundingClientRect();
+        const thCr = this._scrollThumbElement.getBoundingClientRect();
+        this._mouseStartY = event.screenY;
+        this._scrollThumbStartY = thCr.top - cmpCr.top;
+        this._isDragging = true;
+        this._thumbActive = true;
+        document.addEventListener('mousemove', this._handleScrollThumbMouseMove);
+        document.addEventListener('mouseup', this._handleScrollThumbMouseUp);
     }
-    _onComponentMouseOut() {
-        if (!this._thumbActive) {
-            this._thumbVisible = false;
-            this._thumbFade = true;
+    _handleScrollbarTrackPress(ev) {
+        if (ev.target !== ev.currentTarget) {
+            return;
         }
+        this._thumbY = ev.offsetY - this._thumbHeight / 2;
+        this.scrollPos = this._calculateScrollPosFromThumbPos(this._thumbY);
     }
+    //#endregion
     render() {
         return html `
       <div
@@ -180,6 +270,8 @@ let VscodeScrollable = class VscodeScrollable extends VscElement {
         .style=${stylePropertyMap({
             userSelect: this._isDragging ? 'none' : 'auto',
         })}
+        .scrollTop=${this._scrollPos}
+        @scroll=${this._handleScrollableContainerScroll}
       >
         <div
           class=${classMap({ shadow: true, visible: this.scrolled })}
@@ -195,29 +287,42 @@ let VscodeScrollable = class VscodeScrollable extends VscElement {
             'scrollbar-track': true,
             hidden: !this._scrollbarVisible,
         })}
+          @mousedown=${this._handleScrollbarTrackPress}
         >
           <div
             class=${classMap({
             'scrollbar-thumb': true,
-            visible: this._thumbVisible,
-            fade: this._thumbFade,
+            visible: this.alwaysVisible ? true : this._thumbVisible,
+            fade: this.alwaysVisible ? false : this._thumbFade,
             active: this._thumbActive,
         })}
             .style=${stylePropertyMap({
             height: `${this._thumbHeight}px`,
             top: `${this._thumbY}px`,
         })}
-            @mousedown=${this._onScrollThumbMouseDown}
+            @mousedown=${this._handleScrollThumbMouseDown}
           ></div>
         </div>
         <div class="content">
-          <slot @slotchange=${this._onSlotChange}></slot>
+          <slot @slotchange=${this._handleSlotChange}></slot>
         </div>
       </div>
     `;
     }
 };
 VscodeScrollable.styles = styles;
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: 'always-visible' })
+], VscodeScrollable.prototype, "alwaysVisible", void 0);
+__decorate([
+    property({ type: Number, attribute: 'fast-scroll-sensitivity' })
+], VscodeScrollable.prototype, "fastScrollSensitivity", void 0);
+__decorate([
+    property({ type: Number, attribute: 'min-thumb-size' })
+], VscodeScrollable.prototype, "minThumbSize", void 0);
+__decorate([
+    property({ type: Number, attribute: 'mouse-wheel-scroll-sensitivity' })
+], VscodeScrollable.prototype, "mouseWheelScrollSensitivity", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], VscodeScrollable.prototype, "shadow", void 0);

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

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-scrollable.js","sourceRoot":"","sources":["../../src/vscode-scrollable/vscode-scrollable.ts"],"names":[],"mappings":"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","sourcesContent":["import {html, nothing, TemplateResult} from 'lit';\nimport {property, query, queryAssignedElements, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {customElement, VscElement} from '../includes/VscElement.js';\nimport {stylePropertyMap} from '../includes/style-property-map.js';\nimport styles from './vscode-scrollable.styles.js';\n\n/*\n @tag vscode-scrollable\n \n @cssprop [--min-thumb-height=20px] - Scrollbar thumb minimum height\n * @cssprop [--vscode-scrollbar-shadow=#000000]\n * @cssprop [--vscode-scrollbarSlider-background=rgba(121, 121, 121, 0.4)]\n * @cssprop [--vscode-scrollbarSlider-hoverBackground=rgba(100, 100, 100, 0.7)]\n * @cssprop [--vscode-scrollbarSlider-activeBackground=rgba(191, 191, 191, 0.4)]\n /\n@customElement('vscode-scrollable')\nexport class VscodeScrollable extends VscElement {\n static override styles = styles;\n\n @property({type: Boolean, reflect: true})\n shadow = true;\n\n @property({type: Boolean, reflect: true})\n scrolled = false;\n\n @property({type: Number, attribute: 'scroll-pos'})\n set scrollPos(val: number) {\n this._scrollableContainer.scrollTop = val;\n }\n get scrollPos(): number {\n if (!this._scrollableContainer) {\n return 0;\n }\n\n return this._scrollableContainer.scrollTop;\n }\n\n @property({type: Number, attribute: 'scroll-max'})\n get scrollMax(): number {\n if (!this._scrollableContainer) {\n return 0;\n }\n\n return this._scrollableContainer.scrollHeight;\n }\n\n @state()\n private _isDragging = false;\n\n @state()\n private _thumbHeight = 0;\n\n @state()\n private _thumbY = 0;\n\n @state()\n private _thumbVisible = false;\n\n @state()\n private _thumbFade = false;\n\n @state()\n private _thumbActive = false;\n\n @query('.content')\n private _contentElement!: HTMLDivElement;\n\n @query('.scrollbar-thumb', true)\n private _scrollThumbElement!: HTMLDivElement;\n\n @query('.scrollable-container')\n private _scrollableContainer!: HTMLDivElement;\n\n @queryAssignedElements()\n private _assignedElements!: NodeList;\n\n private _hostResizeObserver!: ResizeObserver;\n private _contentResizeObserver!: ResizeObserver;\n private _scrollThumbStartY = 0;\n private _mouseStartY = 0;\n private _scrollbarVisible = true;\n private _scrollbarTrackZ = 0;\n\n override connectedCallback(): void {\n super.connectedCallback();\n\n this._hostResizeObserver = new ResizeObserver(this._resizeObserverCallback);\n this._contentResizeObserver = new ResizeObserver(\n this._resizeObserverCallback\n );\n\n this.requestUpdate();\n\n this.updateComplete.then(() => {\n this._scrollableContainer.addEventListener(\n 'scroll',\n this._onScrollableContainerScroll.bind(this)\n );\n this._hostResizeObserver.observe(this);\n this._contentResizeObserver.observe(this._contentElement);\n });\n\n this.addEventListener('mouseover', this._onComponentMouseOverBound);\n this.addEventListener('mouseout', this._onComponentMouseOutBound);\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n\n this._hostResizeObserver.unobserve(this);\n this._hostResizeObserver.disconnect();\n this._contentResizeObserver.unobserve(this._contentElement);\n this._contentResizeObserver.disconnect();\n\n this.removeEventListener('mouseover', this._onComponentMouseOverBound);\n this.removeEventListener('mouseout', this._onComponentMouseOutBound);\n }\n\n private _resizeObserverCallback = () => {\n this._updateScrollbar();\n };\n\n private _updateScrollbar() {\n const compCr = this.getBoundingClientRect();\n const contentCr = this._contentElement.getBoundingClientRect();\n\n if (compCr.height >= contentCr.height) {\n this._scrollbarVisible = false;\n } else {\n this._scrollbarVisible = true;\n this._thumbHeight = compCr.height (compCr.height / contentCr.height);\n }\n\n this.requestUpdate();\n }\n\n private _zIndexFix() {\n let highestZ = 0;\n\n this._assignedElements.forEach((n) => {\n if ('style' in n) {\n const computedZIndex = window.getComputedStyle(n as HTMLElement).zIndex;\n const isNumber = /([0-9-])+/g.test(computedZIndex);\n\n if (isNumber) {\n highestZ =\n Number(computedZIndex) > highestZ\n ? Number(computedZIndex)\n : highestZ;\n }\n }\n });\n\n this._scrollbarTrackZ = highestZ + 1;\n this.requestUpdate();\n }\n\n private _onSlotChange = () => {\n this._zIndexFix();\n };\n\n private _onScrollThumbMouseDown(event: MouseEvent) {\n const cmpCr = this.getBoundingClientRect();\n const thCr = this._scrollThumbElement.getBoundingClientRect();\n\n this._mouseStartY = event.screenY;\n this._scrollThumbStartY = thCr.top - cmpCr.top;\n this._isDragging = true;\n this._thumbActive = true;\n\n document.addEventListener('mousemove', this._onScrollThumbMouseMoveBound);\n document.addEventListener('mouseup', this._onScrollThumbMouseUpBound);\n }\n\n private _onScrollThumbMouseMove(event: MouseEvent) {\n const predictedPos =\n this._scrollThumbStartY + (event.screenY - this._mouseStartY);\n let nextPos = 0;\n const cmpH = this.getBoundingClientRect().height;\n const thumbH = this._scrollThumbElement.getBoundingClientRect().height;\n const contentH = this._contentElement.getBoundingClientRect().height;\n\n if (predictedPos < 0) {\n nextPos = 0;\n } else if (predictedPos > cmpH - thumbH) {\n nextPos = cmpH - thumbH;\n } else {\n nextPos = predictedPos;\n }\n\n this._thumbY = nextPos;\n this._scrollableContainer.scrollTop =\n (nextPos / (cmpH - thumbH)) * (contentH - cmpH);\n }\n\n private _onScrollThumbMouseMoveBound =\n this._onScrollThumbMouseMove.bind(this);\n\n private _onScrollThumbMouseUp(event: MouseEvent) {\n this._isDragging = false;\n this._thumbActive = false;\n\n const cr = this.getBoundingClientRect();\n const {x, y, width, height} = cr;\n const {pageX, pageY} = event;\n\n if (pageX > x + width \|\| pageX < x \|\| pageY > y + height \|\| pageY < y) {\n this._thumbFade = true;\n this._thumbVisible = false;\n }\n\n document.removeEventListener(\n 'mousemove',\n this._onScrollThumbMouseMoveBound\n );\n document.removeEventListener('mouseup', this._onScrollThumbMouseUpBound);\n }\n\n private _onScrollThumbMouseUpBound = this._onScrollThumbMouseUp.bind(this);\n\n private _onScrollableContainerScroll() {\n const scrollTop = this._scrollableContainer.scrollTop;\n this.scrolled = scrollTop > 0;\n\n const cmpH = this.getBoundingClientRect().height;\n const thumbH = this._scrollThumbElement.getBoundingClientRect().height;\n const contentH = this._contentElement.getBoundingClientRect().height;\n\n const overflown = contentH - cmpH;\n const ratio = scrollTop / overflown;\n\n this._thumbY = ratio * (cmpH - thumbH);\n }\n\n private _onComponentMouseOver() {\n this._thumbVisible = true;\n this._thumbFade = false;\n }\n\n private _onComponentMouseOverBound = this._onComponentMouseOver.bind(this);\n\n private _onComponentMouseOut() {\n if (!this._thumbActive) {\n this._thumbVisible = false;\n this._thumbFade = true;\n }\n }\n\n private _onComponentMouseOutBound = this._onComponentMouseOut.bind(this);\n\n override render(): TemplateResult {\n return html`\n <div\n class=\"scrollable-container\"\n .style=${stylePropertyMap({\n userSelect: this._isDragging ? 'none' : 'auto',\n })}\n >\n <div\n class=${classMap({shadow: true, visible: this.scrolled})}\n .style=${stylePropertyMap({\n zIndex: String(this._scrollbarTrackZ),\n })}\n ></div>\n ${this._isDragging\n ? html`<div class=\"prevent-interaction\"></div>`\n : nothing}\n <div\n class=${classMap({\n 'scrollbar-track': true,\n hidden: !this._scrollbarVisible,\n })}\n >\n <div\n class=${classMap({\n 'scrollbar-thumb': true,\n visible: this._thumbVisible,\n fade: this._thumbFade,\n active: this._thumbActive,\n })}\n .style=${stylePropertyMap({\n height: `${this._thumbHeight}px`,\n top: `${this._thumbY}px`,\n })}\n @mousedown=${this._onScrollThumbMouseDown}\n ></div>\n </div>\n <div class=\"content\">\n <slot @slotchange=${this._onSlotChange}></slot>\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-scrollable': VscodeScrollable;\n }\n}\n"]}
1	+ {"version":3,"file":"vscode-scrollable.js","sourceRoot":"","sources":["../../src/vscode-scrollable/vscode-scrollable.ts"],"names":[],"mappings":"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","sourcesContent":["import {html, nothing, PropertyValues, TemplateResult} from 'lit';\nimport {property, query, queryAssignedElements, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {customElement, VscElement} from '../includes/VscElement.js';\nimport {stylePropertyMap} from '../includes/style-property-map.js';\nimport styles from './vscode-scrollable.styles.js';\n\nexport type VscScrollableScrollEvent = CustomEvent<number>;\n\n/*\n @tag vscode-scrollable\n \n @cssprop --min-thumb-height - (@deprecated) This css property is deprecated. Use the `minThumbSize` property instead.\n * @cssprop [--vscode-scrollbar-shadow=#000000]\n * @cssprop [--vscode-scrollbarSlider-background=rgba(121, 121, 121, 0.4)]\n * @cssprop [--vscode-scrollbarSlider-hoverBackground=rgba(100, 100, 100, 0.7)]\n * @cssprop [--vscode-scrollbarSlider-activeBackground=rgba(191, 191, 191, 0.4)]\n /\n@customElement('vscode-scrollable')\nexport class VscodeScrollable extends VscElement {\n static override styles = styles;\n\n /\n By default, the scrollbar appears only when the cursor hovers over the\n * component. With this option, the scrollbar will always be visible.\n /\n @property({type: Boolean, reflect: true, attribute: 'always-visible'})\n alwaysVisible = false;\n\n /\n Scrolling speed multiplier when pressing `Alt`. This property is designed to use the value of\n * `editor.fastScrollSensitivity`, `workbench.list.fastScrollSensitivity` or\n * `terminal.integrated.fastScrollSensitivity` depending on the context.\n /\n @property({type: Number, attribute: 'fast-scroll-sensitivity'})\n fastScrollSensitivity = 5;\n\n /\n This setting defines the scrollbar's minimum size when the component contains a large amount of content.\n /\n @property({type: Number, attribute: 'min-thumb-size'})\n minThumbSize = 20;\n\n /\n A multiplier to be used on the `deltaY` of the mouse wheel scroll events. This property is\n * designed to use the value of `editor.mouseWheelScrollSensitivity`,\n * `workbench.list.mouseWheelScrollSensitivity` or\n * `terminal.integrated.mouseWheelScrollSensitivity` depending on the context.\n /\n @property({type: Number, attribute: 'mouse-wheel-scroll-sensitivity'})\n mouseWheelScrollSensitivity = 1;\n\n /\n Controls shadow visibility when content overflows.\n /\n @property({type: Boolean, reflect: true})\n shadow = true;\n\n /\n It's true when `scrollPos` greater than 0\n /\n @property({type: Boolean, reflect: true})\n scrolled = false;\n\n /\n Scroll position.\n /\n @property({type: Number, attribute: 'scroll-pos'})\n set scrollPos(val: number) {\n this._scrollPos = val;\n this._updateScrollbar();\n this._updateThumbPosition();\n this.requestUpdate();\n }\n get scrollPos(): number {\n return this._scrollPos;\n }\n\n private _scrollPos = 0;\n\n /\n The maximum amount of the `scrollPos`.\n /\n @property({type: Number, attribute: 'scroll-max'})\n get scrollMax(): number {\n if (!this._scrollableContainer) {\n return 0;\n }\n\n return this._scrollableContainer.scrollHeight;\n }\n\n @state()\n private _isDragging = false;\n\n @state()\n private _thumbHeight = 0;\n\n @state()\n private _thumbY = 0;\n\n @state()\n private _thumbVisible = false;\n\n @state()\n private _thumbFade = false;\n\n @state()\n private _thumbActive = false;\n\n @query('.content')\n private _contentElement!: HTMLDivElement;\n\n @query('.scrollbar-thumb', true)\n private _scrollThumbElement!: HTMLDivElement;\n\n @query('.scrollable-container')\n private _scrollableContainer!: HTMLDivElement;\n\n @queryAssignedElements()\n private _assignedElements!: NodeList;\n\n private _hostResizeObserver!: ResizeObserver;\n private _contentResizeObserver!: ResizeObserver;\n private _scrollThumbStartY = 0;\n private _mouseStartY = 0;\n private _scrollbarVisible = true;\n private _scrollbarTrackZ = 0;\n\n constructor() {\n super();\n this.addEventListener('mouseover', this._handleComponentMouseOver);\n this.addEventListener('mouseout', this._handleComponentMouseOut);\n this.addEventListener('wheel', this._handleComponentWheel);\n }\n\n override connectedCallback(): void {\n super.connectedCallback();\n\n this._hostResizeObserver = new ResizeObserver(this._resizeObserverCallback);\n this._contentResizeObserver = new ResizeObserver(\n this._resizeObserverCallback\n );\n\n this.requestUpdate();\n\n this.updateComplete.then(() => {\n this._hostResizeObserver.observe(this);\n this._contentResizeObserver.observe(this._contentElement);\n this._updateThumbPosition();\n });\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n\n this._hostResizeObserver.unobserve(this);\n this._hostResizeObserver.disconnect();\n this._contentResizeObserver.unobserve(this._contentElement);\n this._contentResizeObserver.disconnect();\n }\n\n protected override firstUpdated(_changedProperties: PropertyValues): void {\n this._updateThumbPosition();\n }\n\n private _resizeObserverCallback = () => {\n this._updateScrollbar();\n this._updateThumbPosition();\n };\n\n private _calcThumbHeight() {\n const componentHeight = this.offsetHeight;\n const contentHeight = this._contentElement?.offsetHeight ?? 0;\n const proposedSize = componentHeight (componentHeight / contentHeight);\n\n return Math.max(this.minThumbSize, proposedSize);\n }\n\n private _updateScrollbar() {\n const contentHeight = this._contentElement?.offsetHeight ?? 0;\n const componentHeight = this.offsetHeight;\n\n if (componentHeight >= contentHeight) {\n this._scrollbarVisible = false;\n } else {\n this._scrollbarVisible = true;\n this._thumbHeight = this._calcThumbHeight();\n }\n\n this.requestUpdate();\n }\n\n private _zIndexFix() {\n let highestZ = 0;\n\n this._assignedElements.forEach((n) => {\n if ('style' in n) {\n const computedZIndex = window.getComputedStyle(n as HTMLElement).zIndex;\n const isNumber = /([0-9-])+/g.test(computedZIndex);\n\n if (isNumber) {\n highestZ =\n Number(computedZIndex) > highestZ\n ? Number(computedZIndex)\n : highestZ;\n }\n }\n });\n\n this._scrollbarTrackZ = highestZ + 1;\n this.requestUpdate();\n }\n\n private _updateThumbPosition() {\n if (!this._scrollableContainer) {\n return;\n }\n\n const scrollTop = this._scrollPos;\n this.scrolled = scrollTop > 0;\n\n const componentH = this.offsetHeight;\n const thumbH = this._thumbHeight;\n const contentH = this._contentElement.offsetHeight;\n\n const overflown = contentH - componentH;\n const ratio = scrollTop / overflown;\n const thumbYMax = componentH - thumbH;\n\n this._thumbY = Math.min(ratio * (componentH - thumbH), thumbYMax);\n }\n\n private _calculateScrollPosFromThumbPos(scrollPos: number) {\n const cmpH = this.getBoundingClientRect().height;\n const thumbH = this._scrollThumbElement.getBoundingClientRect().height;\n const contentH = this._contentElement.getBoundingClientRect().height;\n const rawScrollPos = (scrollPos / (cmpH - thumbH)) * (contentH - cmpH);\n\n return this._limitScrollPos(rawScrollPos);\n }\n\n private _limitScrollPos(newPos: number) {\n if (newPos < 0) {\n return 0;\n } else if (newPos > this.scrollMax) {\n return this.scrollMax;\n } else {\n return newPos;\n }\n }\n\n private _limitThumbPos(newPos: number) {\n const cmpH = this.getBoundingClientRect().height;\n const thumbH = this._scrollThumbElement.getBoundingClientRect().height;\n\n if (newPos < 0) {\n return 0;\n } else if (newPos > cmpH - thumbH) {\n return cmpH - thumbH;\n } else {\n return newPos;\n }\n }\n\n //#region event handlers\n private _handleSlotChange = () => {\n this._updateScrollbar();\n this._updateThumbPosition();\n this._zIndexFix();\n };\n\n private _handleScrollThumbMouseDown(event: MouseEvent) {\n const cmpCr = this.getBoundingClientRect();\n const thCr = this._scrollThumbElement.getBoundingClientRect();\n\n this._mouseStartY = event.screenY;\n this._scrollThumbStartY = thCr.top - cmpCr.top;\n this._isDragging = true;\n this._thumbActive = true;\n\n document.addEventListener('mousemove', this._handleScrollThumbMouseMove);\n document.addEventListener('mouseup', this._handleScrollThumbMouseUp);\n }\n\n private _handleScrollThumbMouseMove = (event: MouseEvent) => {\n const rawThumbPos =\n this._scrollThumbStartY + (event.screenY - this._mouseStartY);\n this._thumbY = this._limitThumbPos(rawThumbPos);\n this.scrollPos = this._calculateScrollPosFromThumbPos(this._thumbY);\n\n this.dispatchEvent(\n new CustomEvent('vsc-scrollable-scroll', {\n detail: this.scrollPos,\n })\n );\n };\n\n private _handleScrollThumbMouseUp = (event: MouseEvent) => {\n this._isDragging = false;\n this._thumbActive = false;\n\n const cr = this.getBoundingClientRect();\n const {x, y, width, height} = cr;\n const {pageX, pageY} = event;\n\n if (pageX > x + width \|\| pageX < x \|\| pageY > y + height \|\| pageY < y) {\n this._thumbFade = true;\n this._thumbVisible = false;\n }\n\n document.removeEventListener('mousemove', this._handleScrollThumbMouseMove);\n document.removeEventListener('mouseup', this._handleScrollThumbMouseUp);\n };\n\n private _handleComponentMouseOver = () => {\n this._thumbVisible = true;\n this._thumbFade = false;\n };\n\n private _handleComponentMouseOut = () => {\n if (!this._thumbActive) {\n this._thumbVisible = false;\n this._thumbFade = true;\n }\n };\n\n private _handleComponentWheel = (ev: WheelEvent) => {\n ev.preventDefault();\n\n const multiplier = ev.altKey\n ? this.mouseWheelScrollSensitivity * this.fastScrollSensitivity\n : this.mouseWheelScrollSensitivity;\n\n this.scrollPos = this._limitScrollPos(\n this.scrollPos + ev.deltaY * multiplier\n );\n this.dispatchEvent(\n new CustomEvent('vsc-scrollable-scroll', {\n detail: this.scrollPos,\n })\n );\n };\n\n private _handleScrollbarTrackPress(ev: PointerEvent) {\n if (ev.target !== ev.currentTarget) {\n return;\n }\n\n this._thumbY = ev.offsetY - this._thumbHeight / 2;\n this.scrollPos = this._calculateScrollPosFromThumbPos(this._thumbY);\n }\n\n private _handleScrollableContainerScroll = (ev: Event) => {\n if (ev.currentTarget) {\n this.scrollPos = (ev.currentTarget as HTMLDivElement).scrollTop;\n }\n };\n\n //#endregion\n\n override render(): TemplateResult {\n return html`\n <div\n class=\"scrollable-container\"\n .style=${stylePropertyMap({\n userSelect: this._isDragging ? 'none' : 'auto',\n })}\n .scrollTop=${this._scrollPos}\n @scroll=${this._handleScrollableContainerScroll}\n >\n <div\n class=${classMap({shadow: true, visible: this.scrolled})}\n .style=${stylePropertyMap({\n zIndex: String(this._scrollbarTrackZ),\n })}\n ></div>\n ${this._isDragging\n ? html`<div class=\"prevent-interaction\"></div>`\n : nothing}\n <div\n class=${classMap({\n 'scrollbar-track': true,\n hidden: !this._scrollbarVisible,\n })}\n @mousedown=${this._handleScrollbarTrackPress}\n >\n <div\n class=${classMap({\n 'scrollbar-thumb': true,\n visible: this.alwaysVisible ? true : this._thumbVisible,\n fade: this.alwaysVisible ? false : this._thumbFade,\n active: this._thumbActive,\n })}\n .style=${stylePropertyMap({\n height: `${this._thumbHeight}px`,\n top: `${this._thumbY}px`,\n })}\n @mousedown=${this._handleScrollThumbMouseDown}\n ></div>\n </div>\n <div class=\"content\">\n <slot @slotchange=${this._handleSlotChange}></slot>\n </div>\n </div>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'vscode-scrollable': VscodeScrollable;\n }\n\n interface GlobalEventHandlersEventMap {\n 'vsc-scrollable-scroll': VscScrollableScrollEvent;\n }\n}\n"]}

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

@@ -57,8 +57,6 @@ export declare class VscodeSingleSelect extends VscodeSelectBase implements Asso
     /** @internal */
     static formAssociated: boolean;
     defaultValue: string;
-    /** @internal */
-    role: string;
     name: string | undefined;
     set selectedIndex(val: number);
     get selectedIndex(): number;
@@ -88,13 +86,15 @@ export declare class VscodeSingleSelect extends VscodeSelectBase implements Asso
      */
     private _requestedValueToSetLater;
     protected _createAndSelectSuggestedOption(): Promise<void>;
+    protected _dispatchChangeEvent(): void;
+    protected _setStateFromSlottedElements(): void;
     protected _onSlotChange(): void;
-    protected _onArrowUpKeyDown(): void;
-    protected _onArrowDownKeyDown(): void;
     protected _onEnterKeyDown(ev: KeyboardEvent): void;
     protected _onOptionClick(ev: MouseEvent): void;
     protected _manageRequired(): void;
     protected _renderSelectFace(): TemplateResult;
+    protected _renderComboboxFace(): TemplateResult;
+    render(): TemplateResult;
 }
 declare global {
     interface HTMLElementTagNameMap {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"vscode-single-select.d.ts","sourceRoot":"","sources":["../../src/vscode-single-select/vscode-single-select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,cAAc,EAAC,MAAM,KAAK,CAAC;~~AAIrD~~,OAAO,EAAC,gBAAgB,EAAC,MAAM,iDAAiD,CAAC;~~AAEjF~~,OAAO,EAAC,qBAAqB,EAAC,MAAM,sCAAsC,CAAC;~~AAM3E~~,MAAM,MAAM,gCAAgC,GAAG,WAAW,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAC,CAAC,CAAC;AAE5E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AACH,qBACa,kBACX,SAAQ,gBACR,YAAW,qBAAqB;IAEhC,OAAgB,MAAM,4BAAU;IAEhC,gBAAgB;IAChB,OAAgB,iBAAiB,EAAE,cAAc,CAG/C;IAEF,gBAAgB;IAChB,MAAM,CAAC,cAAc,UAAQ;IAG7B,YAAY,SAAM;~~IAElB~~,~~gBAAgB;IAEP,~~IAAI,~~SAAa;IAG1B,IAAI,~~EAAE,MAAM,GAAG,SAAS,CAAa;IAErC,IACI,aAAa,CAAC,GAAG,EAAE,MAAM,~~EAa5B~~;IACD,IAAI,aAAa,IAAI,MAAM,CAE1B;IAED,IACI,KAAK,CAAC,GAAG,EAAE,MAAM,~~EAkBpB~~;IACD,IAAI,KAAK,IAAI,MAAM,~~CAMlB~~;IAGD,QAAQ,UAAS;IAEjB,IAAI,QAAQ,IAAI,aAAa,CAE5B;IAED,IAAI,iBAAiB,IAAI,MAAM,CAE9B;IAED,IAAI,YAAY,YAEf;IAED,aAAa,IAAI,OAAO;IAIxB,cAAc,IAAI,OAAO;IAKzB,OAAO,CAAC,KAAK,CAAkB;IAE/B,OAAO,CAAC,UAAU,CAAmB;IAErC,OAAO,CAAC,gBAAgB;;~~IAuBf~~,iBAAiB,IAAI,IAAI;IAQlC,gBAAgB;IAChB,iBAAiB,IAAI,IAAI;IAIzB,gBAAgB;IAChB,wBAAwB,CACtB,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,SAAS,GAAG,cAAc,GAChC,IAAI;IAMP,gBAAgB;IAChB,IAAI,IAAI,IAAI,YAAY,CAEvB;IAED,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAED;;;OAGG;IACH,OAAO,CAAC,yBAAyB,CAAM;cAEd,+BAA+B;cAgBrC,~~aAAa~~,IAAI,IAAI;~~cAwBrB~~,~~iBAAiB~~,IAAI,IAAI;~~cAmBzB~~,~~mBAAmB~~,IAAI,IAAI;~~cAmB3B~~,eAAe,CAAC,EAAE,EAAE,aAAa,GAAG,IAAI;~~cAQxC~~,cAAc,CAAC,EAAE,EAAE,UAAU;cAkC7B,eAAe;~~cAaf~~,iBAAiB,IAAI,cAAc;~~CAavD~~;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,kBAAkB,CAAC;KAC5C;IAED,UAAU,2BAA2B;QACnC,iCAAiC,EAAE,gCAAgC,CAAC;KACrE;CACF"}
1	+ {"version":3,"file":"vscode-single-select.d.ts","sourceRoot":"","sources":["../../src/vscode-single-select/vscode-single-select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,cAAc,EAAC,MAAM,KAAK,CAAC;AAKrD,OAAO,EAAC,gBAAgB,EAAC,MAAM,iDAAiD,CAAC;AACjF,OAAO,EAAC,qBAAqB,EAAC,MAAM,sCAAsC,CAAC;AAG3E,MAAM,MAAM,gCAAgC,GAAG,WAAW,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAC,CAAC,CAAC;AAE5E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AACH,qBACa,kBACX,SAAQ,gBACR,YAAW,qBAAqB;IAEhC,OAAgB,MAAM,4BAAU;IAEhC,gBAAgB;IAChB,OAAgB,iBAAiB,EAAE,cAAc,CAG/C;IAEF,gBAAgB;IAChB,MAAM,CAAC,cAAc,UAAQ;IAG7B,YAAY,SAAM;IAGlB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAa;IAErC,IACI,aAAa,CAAC,GAAG,EAAE,MAAM,EAe5B;IACD,IAAI,aAAa,IAAI,MAAM,CAE1B;IAED,IACI,KAAK,CAAC,GAAG,EAAE,MAAM,EAWpB;IACD,IAAI,KAAK,IAAI,MAAM,CAElB;IAGD,QAAQ,UAAS;IAEjB,IAAI,QAAQ,IAAI,aAAa,CAE5B;IAED,IAAI,iBAAiB,IAAI,MAAM,CAE9B;IAED,IAAI,YAAY,YAEf;IAED,aAAa,IAAI,OAAO;IAIxB,cAAc,IAAI,OAAO;IAKzB,OAAO,CAAC,KAAK,CAAkB;IAE/B,OAAO,CAAC,UAAU,CAAmB;IAErC,OAAO,CAAC,gBAAgB;;IAqBf,iBAAiB,IAAI,IAAI;IAQlC,gBAAgB;IAChB,iBAAiB,IAAI,IAAI;IAIzB,gBAAgB;IAChB,wBAAwB,CACtB,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,SAAS,GAAG,cAAc,GAChC,IAAI;IAMP,gBAAgB;IAChB,IAAI,IAAI,IAAI,YAAY,CAEvB;IAED,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAED;;;OAGG;IACH,OAAO,CAAC,yBAAyB,CAAM;cAEd,+BAA+B;cAgBrC,oBAAoB,IAAI,IAAI;cAc5B,4BAA4B,IAAI,IAAI;cASpC,aAAa,IAAI,IAAI;cAwBrB,eAAe,CAAC,EAAE,EAAE,aAAa,GAAG,IAAI;cAoCxC,cAAc,CAAC,EAAE,EAAE,UAAU;cAkC7B,eAAe;cAcf,iBAAiB,IAAI,cAAc;cAuBnC,mBAAmB,IAAI,cAAc;IAiD/C,MAAM,IAAI,cAAc;CAUlC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,kBAAkB,CAAC;KAC5C;IAED,UAAU,2BAA2B;QACnC,iCAAiC,EAAE,gCAAgC,CAAC;KACrE;CACF"}