@vonage/vivid 5.7.0 → 5.9.0

package/rich-text-view/definition.cjs

@@ -0,0 +1,159 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const vividElement = require('../unbundled/vivid-element.cjs');
+const fastElement = require('@microsoft/fast-element');
+const feature = require('../unbundled/feature.cjs');
+
+const styles = ":host{display:contents}.content{display:contents}";
+
+var __defProp = Object.defineProperty;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = void 0 ;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (decorator(target, key, result) ) || result;
+  if (result) __defProp(target, key, result);
+  return result;
+};
+class RichTextView extends vividElement.VividElement {
+  constructor() {
+    super(...arguments);
+    this._slotCounter = 0;
+    this._slottedChildren = /* @__PURE__ */ new Set();
+    /**
+     * @internal
+     */
+    this._contentElement = null;
+  }
+  /**
+   * @internal
+   */
+  viewChanged(oldView, newView) {
+    if (oldView) {
+      this._removeStyles();
+    }
+    if (newView) {
+      this._addStyles(newView);
+    }
+    this._updateView();
+  }
+  _addStyles(view) {
+    const config = view[feature.impl].config[feature.impl];
+    this._styles = new fastElement.ElementStyles(
+      feature.sortedContributions(config.features.flatMap((f) => f.getStyles()))
+    );
+    this._styles.addStylesTo(this.shadowRoot);
+  }
+  _removeStyles() {
+    if (this._styles) {
+      this._styles.removeStylesFrom(this.shadowRoot);
+      this._styles = void 0;
+    }
+  }
+  _cleanupLightDom() {
+    for (const el of this._slottedChildren) {
+      this.removeChild(el);
+    }
+    this._slottedChildren.clear();
+    this._slotCounter = 0;
+  }
+  _updateView() {
+    if (!this._contentElement) {
+      return;
+    }
+    this._contentElement.innerHTML = "";
+    this._cleanupLightDom();
+    if (this.view) {
+      this._contentElement.appendChild(this._renderView(this.view));
+    }
+  }
+  _renderView(rteView) {
+    const ctx = rteView[feature.impl];
+    if (rteView.type === "node" && rteView.node.type === "doc") {
+      rteView = rteView.children;
+    }
+    if (rteView.type === "fragment") {
+      const frag = document.createDocumentFragment();
+      for (const child of rteView.content) {
+        frag.appendChild(this._renderView(child));
+      }
+      return frag;
+    }
+    const customRenderedView = ctx.options.renderChildView?.(rteView) ?? false;
+    if (customRenderedView) {
+      return this._handleCustomRender(rteView, customRenderedView);
+    } else {
+      return this._renderDefault(rteView);
+    }
+  }
+  _handleCustomRender(rteView, customResult) {
+    const { dom, contentDom = dom } = customResult;
+    const slotName = `view-${this._slotCounter++}`;
+    const slot = document.createElement("slot");
+    slot.setAttribute("name", slotName);
+    const nestedView = document.createElement(this.tagName);
+    nestedView.view = rteView.children;
+    contentDom.appendChild(nestedView);
+    dom.setAttribute("slot", slotName);
+    this.appendChild(dom);
+    this._slottedChildren.add(dom);
+    return slot;
+  }
+  _renderDefault(view) {
+    const ctx = view[feature.impl];
+    const config = ctx.config[feature.impl];
+    const schema = config.schema;
+    if (view.type === "node" && view.node.type === "text") {
+      return document.createTextNode(view.node.text);
+    }
+    const item = view.type === "node" ? view.node : view.mark;
+    const pmItem = view.type === "node" ? feature.Node.fromJSON(schema, item) : feature.Mark.fromJSON(schema, item);
+    const spec = pmItem instanceof feature.Node ? pmItem.type.spec.toDOM(pmItem) : pmItem.type.spec.toDOM(pmItem, true);
+    const { dom, contentDOM = dom } = feature.DOMSerializer.renderSpec(document, spec);
+    const childrenRendered = this._renderView(view.children);
+    contentDOM.appendChild(childrenRendered);
+    return dom;
+  }
+  /**
+   * @internal
+   */
+  connectedCallback() {
+    super.connectedCallback();
+    this._updateView();
+  }
+  /**
+   * @internal
+   */
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this._removeStyles();
+    this._cleanupLightDom();
+  }
+}
+__decorateClass([
+  fastElement.observable
+], RichTextView.prototype, "view");
+
+const RichTextViewTemplate = () => fastElement.html`<div class="content rich-text" ${fastElement.ref("_contentElement")}></div>`;
+
+const richTextViewDefinition = vividElement.defineVividComponent(
+  "rich-text-view",
+  RichTextView,
+  RichTextViewTemplate,
+  [],
+  {
+    styles,
+    shadowOptions: {
+      delegatesFocus: true
+    }
+  }
+);
+const registerRichTextView = vividElement.createRegisterFunction(
+  richTextViewDefinition
+);
+
+exports.VwcRichTextViewElement = RichTextView;
+exports.registerRichTextView = registerRichTextView;
+exports.richTextViewDefinition = richTextViewDefinition;

package/rich-text-view/definition.js

@@ -0,0 +1,153 @@
+import { V as VividElement, d as defineVividComponent, c as createRegisterFunction } from '../unbundled/vivid-element.js';
+import { ElementStyles, observable, ref, html } from '@microsoft/fast-element';
+import { i as impl, s as sortedContributions, N as Node, M as Mark, D as DOMSerializer } from '../unbundled/feature.js';
+
+const styles = ":host{display:contents}.content{display:contents}";
+
+var __defProp = Object.defineProperty;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = void 0 ;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (decorator(target, key, result) ) || result;
+  if (result) __defProp(target, key, result);
+  return result;
+};
+class RichTextView extends VividElement {
+  constructor() {
+    super(...arguments);
+    this._slotCounter = 0;
+    this._slottedChildren = /* @__PURE__ */ new Set();
+    /**
+     * @internal
+     */
+    this._contentElement = null;
+  }
+  /**
+   * @internal
+   */
+  viewChanged(oldView, newView) {
+    if (oldView) {
+      this._removeStyles();
+    }
+    if (newView) {
+      this._addStyles(newView);
+    }
+    this._updateView();
+  }
+  _addStyles(view) {
+    const config = view[impl].config[impl];
+    this._styles = new ElementStyles(
+      sortedContributions(config.features.flatMap((f) => f.getStyles()))
+    );
+    this._styles.addStylesTo(this.shadowRoot);
+  }
+  _removeStyles() {
+    if (this._styles) {
+      this._styles.removeStylesFrom(this.shadowRoot);
+      this._styles = void 0;
+    }
+  }
+  _cleanupLightDom() {
+    for (const el of this._slottedChildren) {
+      this.removeChild(el);
+    }
+    this._slottedChildren.clear();
+    this._slotCounter = 0;
+  }
+  _updateView() {
+    if (!this._contentElement) {
+      return;
+    }
+    this._contentElement.innerHTML = "";
+    this._cleanupLightDom();
+    if (this.view) {
+      this._contentElement.appendChild(this._renderView(this.view));
+    }
+  }
+  _renderView(rteView) {
+    const ctx = rteView[impl];
+    if (rteView.type === "node" && rteView.node.type === "doc") {
+      rteView = rteView.children;
+    }
+    if (rteView.type === "fragment") {
+      const frag = document.createDocumentFragment();
+      for (const child of rteView.content) {
+        frag.appendChild(this._renderView(child));
+      }
+      return frag;
+    }
+    const customRenderedView = ctx.options.renderChildView?.(rteView) ?? false;
+    if (customRenderedView) {
+      return this._handleCustomRender(rteView, customRenderedView);
+    } else {
+      return this._renderDefault(rteView);
+    }
+  }
+  _handleCustomRender(rteView, customResult) {
+    const { dom, contentDom = dom } = customResult;
+    const slotName = `view-${this._slotCounter++}`;
+    const slot = document.createElement("slot");
+    slot.setAttribute("name", slotName);
+    const nestedView = document.createElement(this.tagName);
+    nestedView.view = rteView.children;
+    contentDom.appendChild(nestedView);
+    dom.setAttribute("slot", slotName);
+    this.appendChild(dom);
+    this._slottedChildren.add(dom);
+    return slot;
+  }
+  _renderDefault(view) {
+    const ctx = view[impl];
+    const config = ctx.config[impl];
+    const schema = config.schema;
+    if (view.type === "node" && view.node.type === "text") {
+      return document.createTextNode(view.node.text);
+    }
+    const item = view.type === "node" ? view.node : view.mark;
+    const pmItem = view.type === "node" ? Node.fromJSON(schema, item) : Mark.fromJSON(schema, item);
+    const spec = pmItem instanceof Node ? pmItem.type.spec.toDOM(pmItem) : pmItem.type.spec.toDOM(pmItem, true);
+    const { dom, contentDOM = dom } = DOMSerializer.renderSpec(document, spec);
+    const childrenRendered = this._renderView(view.children);
+    contentDOM.appendChild(childrenRendered);
+    return dom;
+  }
+  /**
+   * @internal
+   */
+  connectedCallback() {
+    super.connectedCallback();
+    this._updateView();
+  }
+  /**
+   * @internal
+   */
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this._removeStyles();
+    this._cleanupLightDom();
+  }
+}
+__decorateClass([
+  observable
+], RichTextView.prototype, "view");
+
+const RichTextViewTemplate = () => html`<div class="content rich-text" ${ref("_contentElement")}></div>`;
+
+const richTextViewDefinition = defineVividComponent(
+  "rich-text-view",
+  RichTextView,
+  RichTextViewTemplate,
+  [],
+  {
+    styles,
+    shadowOptions: {
+      delegatesFocus: true
+    }
+  }
+);
+const registerRichTextView = createRegisterFunction(
+  richTextViewDefinition
+);
+
+export { RichTextView as VwcRichTextViewElement, registerRichTextView, richTextViewDefinition };

package/rich-text-view/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("../bundled/vivid-element.cjs"),r=require("../bundled/feature.cjs"),_=require("../bundled/ref.cjs"),f=":host{display:contents}.content{display:contents}";var y=Object.defineProperty,C=(l,e,n,s)=>{for(var t=void 0,o=l.length-1,i;o>=0;o--)(i=l[o])&&(t=i(e,n,t)||t);return t&&y(e,n,t),t};class h extends c.VividElement{constructor(){super(...arguments),this._slotCounter=0,this._slottedChildren=new Set,this._contentElement=null}viewChanged(e,n){e&&this._removeStyles(),n&&this._addStyles(n),this._updateView()}_addStyles(e){const n=e[r.impl].config[r.impl];this._styles=new c.ElementStyles(r.sortedContributions(n.features.flatMap(s=>s.getStyles()))),this._styles.addStylesTo(this.shadowRoot)}_removeStyles(){this._styles&&(this._styles.removeStylesFrom(this.shadowRoot),this._styles=void 0)}_cleanupLightDom(){for(const e of this._slottedChildren)this.removeChild(e);this._slottedChildren.clear(),this._slotCounter=0}_updateView(){this._contentElement&&(this._contentElement.innerHTML="",this._cleanupLightDom(),this.view&&this._contentElement.appendChild(this._renderView(this.view)))}_renderView(e){const n=e[r.impl];if(e.type==="node"&&e.node.type==="doc"&&(e=e.children),e.type==="fragment"){const t=document.createDocumentFragment();for(const o of e.content)t.appendChild(this._renderView(o));return t}const s=n.options.renderChildView?.(e)??!1;return s?this._handleCustomRender(e,s):this._renderDefault(e)}_handleCustomRender(e,n){const{dom:s,contentDom:t=s}=n,o=`view-${this._slotCounter++}`,i=document.createElement("slot");i.setAttribute("name",o);const d=document.createElement(this.tagName);return d.view=e.children,t.appendChild(d),s.setAttribute("slot",o),this.appendChild(s),this._slottedChildren.add(s),i}_renderDefault(e){const t=e[r.impl].config[r.impl].schema;if(e.type==="node"&&e.node.type==="text")return document.createTextNode(e.node.text);const o=e.type==="node"?e.node:e.mark,i=e.type==="node"?r.Node.fromJSON(t,o):r.Mark.fromJSON(t,o),d=i instanceof r.Node?i.type.spec.toDOM(i):i.type.spec.toDOM(i,!0),{dom:a,contentDOM:p=a}=r.DOMSerializer.renderSpec(document,d),u=this._renderView(e.children);return p.appendChild(u),a}connectedCallback(){super.connectedCallback(),this._updateView()}disconnectedCallback(){super.disconnectedCallback(),this._removeStyles(),this._cleanupLightDom()}}C([c.observable],h.prototype,"view");const g=()=>c.html`<div class="content rich-text" ${_.ref("_contentElement")}></div>`,v=c.defineVividComponent("rich-text-view",h,g,[],{styles:f,shadowOptions:{delegatesFocus:!0}}),m=c.createRegisterFunction(v);m();exports.RichTextView=h;exports.registerRichTextView=m;

package/rich-text-view/index.js

@@ -0,0 +1,95 @@
+import { V as u, w as _, o as f, h as y, c as C, d as g } from "../bundled/vivid-element.js";
+import { i as r, s as v, N as a, M as x, D as S } from "../bundled/feature.js";
+import { r as D } from "../bundled/ref.js";
+const b = ":host{display:contents}.content{display:contents}";
+var R = Object.defineProperty, E = (d, e, n, s) => {
+  for (var t = void 0, o = d.length - 1, i; o >= 0; o--)
+    (i = d[o]) && (t = i(e, n, t) || t);
+  return t && R(e, n, t), t;
+};
+class h extends u {
+  constructor() {
+    super(...arguments), this._slotCounter = 0, this._slottedChildren = /* @__PURE__ */ new Set(), this._contentElement = null;
+  }
+  /**
+   * @internal
+   */
+  viewChanged(e, n) {
+    e && this._removeStyles(), n && this._addStyles(n), this._updateView();
+  }
+  _addStyles(e) {
+    const n = e[r].config[r];
+    this._styles = new _(
+      v(n.features.flatMap((s) => s.getStyles()))
+    ), this._styles.addStylesTo(this.shadowRoot);
+  }
+  _removeStyles() {
+    this._styles && (this._styles.removeStylesFrom(this.shadowRoot), this._styles = void 0);
+  }
+  _cleanupLightDom() {
+    for (const e of this._slottedChildren)
+      this.removeChild(e);
+    this._slottedChildren.clear(), this._slotCounter = 0;
+  }
+  _updateView() {
+    this._contentElement && (this._contentElement.innerHTML = "", this._cleanupLightDom(), this.view && this._contentElement.appendChild(this._renderView(this.view)));
+  }
+  _renderView(e) {
+    const n = e[r];
+    if (e.type === "node" && e.node.type === "doc" && (e = e.children), e.type === "fragment") {
+      const t = document.createDocumentFragment();
+      for (const o of e.content)
+        t.appendChild(this._renderView(o));
+      return t;
+    }
+    const s = n.options.renderChildView?.(e) ?? !1;
+    return s ? this._handleCustomRender(e, s) : this._renderDefault(e);
+  }
+  _handleCustomRender(e, n) {
+    const { dom: s, contentDom: t = s } = n, o = `view-${this._slotCounter++}`, i = document.createElement("slot");
+    i.setAttribute("name", o);
+    const c = document.createElement(this.tagName);
+    return c.view = e.children, t.appendChild(c), s.setAttribute("slot", o), this.appendChild(s), this._slottedChildren.add(s), i;
+  }
+  _renderDefault(e) {
+    const t = e[r].config[r].schema;
+    if (e.type === "node" && e.node.type === "text")
+      return document.createTextNode(e.node.text);
+    const o = e.type === "node" ? e.node : e.mark, i = e.type === "node" ? a.fromJSON(t, o) : x.fromJSON(t, o), c = i instanceof a ? i.type.spec.toDOM(i) : i.type.spec.toDOM(i, !0), { dom: l, contentDOM: m = l } = S.renderSpec(document, c), p = this._renderView(e.children);
+    return m.appendChild(p), l;
+  }
+  /**
+   * @internal
+   */
+  connectedCallback() {
+    super.connectedCallback(), this._updateView();
+  }
+  /**
+   * @internal
+   */
+  disconnectedCallback() {
+    super.disconnectedCallback(), this._removeStyles(), this._cleanupLightDom();
+  }
+}
+E([
+  f
+], h.prototype, "view");
+const w = () => y`<div class="content rich-text" ${D("_contentElement")}></div>`, M = g(
+  "rich-text-view",
+  h,
+  w,
+  [],
+  {
+    styles: b,
+    shadowOptions: {
+      delegatesFocus: !0
+    }
+  }
+), O = C(
+  M
+);
+O();
+export {
+  h as RichTextView,
+  O as registerRichTextView
+};

package/select/definition.cjs

@@ -124,18 +124,21 @@ class Select extends mixins.WithLightDOMFeedback(
    * @internal
    */
   checkFirstOption(preserveChecked) {
+    const firstSelectableIndex = this.getNextSelectableIndex(0);
+    if (firstSelectableIndex === -1) {
+      return;
+    }
     if (preserveChecked) {
-      /* v8 ignore else -- @preserve */
       if (this.rangeStartIndex === -1) {
-        this.rangeStartIndex = this.activeIndex + 1;
+        this.rangeStartIndex = this.activeIndex;
       }
       this.options.forEach((o, i) => {
-        o.checked = fastWebUtilities.inRange(i, this.rangeStartIndex);
+        o.checked = fastWebUtilities.inRange(i, firstSelectableIndex, this.rangeStartIndex + 1) && !o.disabled;
       });
     } else {
       this.uncheckAllOptions();
     }
-    this.activeIndex = 0;
+    this.activeIndex = firstSelectableIndex;
     this.checkActiveIndex();
   }
   /**
@@ -149,18 +152,23 @@ class Select extends mixins.WithLightDOMFeedback(
    * @internal
    */
   checkLastOption(preserveChecked) {
+    const lastSelectableIndex = this.getPreviousSelectableIndex(
+      this.length - 1
+    );
+    if (lastSelectableIndex === -1) {
+      return;
+    }
     if (preserveChecked) {
-      /* v8 ignore else -- @preserve */
       if (this.rangeStartIndex === -1) {
         this.rangeStartIndex = this.activeIndex;
       }
       this.options.forEach((o, i) => {
-        o.checked = fastWebUtilities.inRange(i, this.rangeStartIndex, this.length);
+        o.checked = fastWebUtilities.inRange(i, this.rangeStartIndex, lastSelectableIndex + 1) && !o.disabled;
       });
     } else {
       this.uncheckAllOptions();
     }
-    this.activeIndex = this.length - 1;
+    this.activeIndex = lastSelectableIndex;
     this.checkActiveIndex();
   }
   /**
@@ -174,18 +182,21 @@ class Select extends mixins.WithLightDOMFeedback(
    * @internal
    */
   checkNextOption(preserveChecked) {
+    const nextIndex = this.getNextSelectableIndex(this.activeIndex + 1);
+    if (nextIndex === -1) {
+      return;
+    }
     if (preserveChecked) {
-      /* v8 ignore else -- @preserve */
       if (this.rangeStartIndex === -1) {
         this.rangeStartIndex = this.activeIndex;
       }
       this.options.forEach((o, i) => {
-        o.checked = fastWebUtilities.inRange(i, this.rangeStartIndex, this.activeIndex + 1);
+        o.checked = fastWebUtilities.inRange(i, this.rangeStartIndex, nextIndex + 1) && !o.disabled;
       });
     } else {
       this.uncheckAllOptions();
     }
-    this.activeIndex += this.activeIndex < this.length - 1 ? 1 : 0;
+    this.activeIndex = nextIndex;
     this.checkActiveIndex();
   }
   /**
@@ -199,22 +210,24 @@ class Select extends mixins.WithLightDOMFeedback(
    * @internal
    */
   checkPreviousOption(preserveChecked) {
+    const previousIndex = this.getPreviousSelectableIndex(this.activeIndex - 1);
+    if (previousIndex === -1) {
+      return;
+    }
     if (preserveChecked) {
-      /* v8 ignore else -- @preserve */
       if (this.rangeStartIndex === -1) {
         this.rangeStartIndex = this.activeIndex;
       }
-      /* v8 ignore else -- @preserve */
       if (this.checkedOptions.length === 1) {
         this.rangeStartIndex += 1;
       }
       this.options.forEach((o, i) => {
-        o.checked = fastWebUtilities.inRange(i, this.activeIndex, this.rangeStartIndex);
+        o.checked = fastWebUtilities.inRange(i, previousIndex, this.rangeStartIndex + 1) && !o.disabled;
       });
     } else {
       this.uncheckAllOptions();
     }
-    this.activeIndex -= this.activeIndex > 0 ? 1 : 0;
+    this.activeIndex = previousIndex;
     this.checkActiveIndex();
   }
   /**
@@ -847,7 +860,6 @@ function ifNotFromFeedback(handler) {
 const SelectTemplate = (context) => {
   return fastElement.html`
 		<template
-			class="base"
 			${hostSemantics.applyHostSemantics({
     role: "combobox",
     ariaLabel: (x) => x.ariaLabel ?? x.label,

package/select/definition.js

@@ -120,18 +120,21 @@ class Select extends WithLightDOMFeedback(
    * @internal
    */
   checkFirstOption(preserveChecked) {
+    const firstSelectableIndex = this.getNextSelectableIndex(0);
+    if (firstSelectableIndex === -1) {
+      return;
+    }
     if (preserveChecked) {
-      /* v8 ignore else -- @preserve */
       if (this.rangeStartIndex === -1) {
-        this.rangeStartIndex = this.activeIndex + 1;
+        this.rangeStartIndex = this.activeIndex;
       }
       this.options.forEach((o, i) => {
-        o.checked = inRange(i, this.rangeStartIndex);
+        o.checked = inRange(i, firstSelectableIndex, this.rangeStartIndex + 1) && !o.disabled;
       });
     } else {
       this.uncheckAllOptions();
     }
-    this.activeIndex = 0;
+    this.activeIndex = firstSelectableIndex;
     this.checkActiveIndex();
   }
   /**
@@ -145,18 +148,23 @@ class Select extends WithLightDOMFeedback(
    * @internal
    */
   checkLastOption(preserveChecked) {
+    const lastSelectableIndex = this.getPreviousSelectableIndex(
+      this.length - 1
+    );
+    if (lastSelectableIndex === -1) {
+      return;
+    }
     if (preserveChecked) {
-      /* v8 ignore else -- @preserve */
       if (this.rangeStartIndex === -1) {
         this.rangeStartIndex = this.activeIndex;
       }
       this.options.forEach((o, i) => {
-        o.checked = inRange(i, this.rangeStartIndex, this.length);
+        o.checked = inRange(i, this.rangeStartIndex, lastSelectableIndex + 1) && !o.disabled;
       });
     } else {
       this.uncheckAllOptions();
     }
-    this.activeIndex = this.length - 1;
+    this.activeIndex = lastSelectableIndex;
     this.checkActiveIndex();
   }
   /**
@@ -170,18 +178,21 @@ class Select extends WithLightDOMFeedback(
    * @internal
    */
   checkNextOption(preserveChecked) {
+    const nextIndex = this.getNextSelectableIndex(this.activeIndex + 1);
+    if (nextIndex === -1) {
+      return;
+    }
     if (preserveChecked) {
-      /* v8 ignore else -- @preserve */
       if (this.rangeStartIndex === -1) {
         this.rangeStartIndex = this.activeIndex;
       }
       this.options.forEach((o, i) => {
-        o.checked = inRange(i, this.rangeStartIndex, this.activeIndex + 1);
+        o.checked = inRange(i, this.rangeStartIndex, nextIndex + 1) && !o.disabled;
       });
     } else {
       this.uncheckAllOptions();
     }
-    this.activeIndex += this.activeIndex < this.length - 1 ? 1 : 0;
+    this.activeIndex = nextIndex;
     this.checkActiveIndex();
   }
   /**
@@ -195,22 +206,24 @@ class Select extends WithLightDOMFeedback(
    * @internal
    */
   checkPreviousOption(preserveChecked) {
+    const previousIndex = this.getPreviousSelectableIndex(this.activeIndex - 1);
+    if (previousIndex === -1) {
+      return;
+    }
     if (preserveChecked) {
-      /* v8 ignore else -- @preserve */
       if (this.rangeStartIndex === -1) {
         this.rangeStartIndex = this.activeIndex;
       }
-      /* v8 ignore else -- @preserve */
       if (this.checkedOptions.length === 1) {
         this.rangeStartIndex += 1;
       }
       this.options.forEach((o, i) => {
-        o.checked = inRange(i, this.activeIndex, this.rangeStartIndex);
+        o.checked = inRange(i, previousIndex, this.rangeStartIndex + 1) && !o.disabled;
       });
     } else {
       this.uncheckAllOptions();
     }
-    this.activeIndex -= this.activeIndex > 0 ? 1 : 0;
+    this.activeIndex = previousIndex;
     this.checkActiveIndex();
   }
   /**
@@ -843,7 +856,6 @@ function ifNotFromFeedback(handler) {
 const SelectTemplate = (context) => {
   return html`
 		<template
-			class="base"
 			${applyHostSemantics({
     role: "combobox",
     ariaLabel: (x) => x.ariaLabel ?? x.label,

package/shared/foundation/listbox/listbox.d.ts

@@ -8,7 +8,6 @@ export declare class Listbox extends VividElement {
     selectedIndex: number;
     selectedOptions: ListboxOption[];
     static slottedOptionFilter: (n: HTMLElement) => boolean;
-    protected getNextSelectableIndex(fromIndex: number): number;
     protected _validSelectedIndex(index: number): number;
     selectFirstOption(): void;
     protected _newDefaultSelectedIndex(prev: ListboxOption[], next: ListboxOption[], currentSelectedIndex: number): number | null;

package/shared/localization/Locale.d.ts

@@ -26,6 +26,7 @@ import type { ToggletipLocale } from '../../lib/toggletip/locale';
 import type { SimpleColorPickerLocale } from '../../lib/simple-color-picker/locale';
 import type { ColorPickerLocale } from '../../lib/color-picker/locale';
 import type { BaseColorPickerLocale } from '../color-picker/locale';
+import type { PopoverLocale } from '../../lib/popover/locale';
 type ConnotationAnnoncementLocale = {
     [key in Connotation as `${key}Icon`]: string;
 };
@@ -62,5 +63,6 @@ export interface Locale {
     baseColorPicker: BaseColorPickerLocale;
     simpleColorPicker: SimpleColorPickerLocale;
     colorPicker: ColorPickerLocale;
+    popover: PopoverLocale;
 }
 export {};