@odoo/o-spreadsheet 16.4.0-alpha.1 → 16.4.0-alpha.2

package/dist/o-spreadsheet.esm.js

@@ -2214,249 +2214,6 @@ function splitReference(ref) {
     return { sheetName, xc };
 }
 
-class RangeImpl {
-    getSheetSize;
-    _zone;
-    parts;
-    invalidXc;
-    prefixSheet = false;
-    sheetId; // the sheet on which the range is defined
-    invalidSheetName; // the name of any sheet that is invalid
-    constructor(args, getSheetSize) {
-        this.getSheetSize = getSheetSize;
-        this._zone = args.zone;
-        this.parts = args.parts;
-        this.prefixSheet = args.prefixSheet;
-        this.invalidXc = args.invalidXc;
-        this.sheetId = args.sheetId;
-        this.invalidSheetName = args.invalidSheetName;
-    }
-    static fromRange(range, getters) {
-        if (range instanceof RangeImpl) {
-            return range;
-        }
-        return new RangeImpl(range, getters.getSheetSize);
-    }
-    get unboundedZone() {
-        return this._zone;
-    }
-    get zone() {
-        const { left, top, bottom, right } = this._zone;
-        if (right !== undefined && bottom !== undefined)
-            return { left, top, right, bottom };
-        else if (bottom === undefined && right !== undefined) {
-            return { right, top, left, bottom: this.getSheetSize(this.sheetId).numberOfRows - 1 };
-        }
-        else if (right === undefined && bottom !== undefined) {
-            return { bottom, left, top, right: this.getSheetSize(this.sheetId).numberOfCols - 1 };
-        }
-        throw new Error(_lt("Bad zone format"));
-    }
-    static getRangeParts(xc, zone) {
-        const parts = xc.split(":").map((p) => {
-            const isFullRow = isRowReference(p);
-            return {
-                colFixed: isFullRow ? false : p.startsWith("$"),
-                rowFixed: isFullRow ? p.startsWith("$") : p.includes("$", 1),
-            };
-        });
-        const isFullCol = zone.bottom === undefined;
-        const isFullRow = zone.right === undefined;
-        if (isFullCol) {
-            parts[0].rowFixed = parts[0].rowFixed || parts[1].rowFixed;
-            parts[1].rowFixed = parts[0].rowFixed || parts[1].rowFixed;
-            if (zone.left === zone.right) {
-                parts[0].colFixed = parts[0].colFixed || parts[1].colFixed;
-                parts[1].colFixed = parts[0].colFixed || parts[1].colFixed;
-            }
-        }
-        if (isFullRow) {
-            parts[0].colFixed = parts[0].colFixed || parts[1].colFixed;
-            parts[1].colFixed = parts[0].colFixed || parts[1].colFixed;
-            if (zone.top === zone.bottom) {
-                parts[0].rowFixed = parts[0].rowFixed || parts[1].rowFixed;
-                parts[1].rowFixed = parts[0].rowFixed || parts[1].rowFixed;
-            }
-        }
-        return parts;
-    }
-    get isFullCol() {
-        return this._zone.bottom === undefined;
-    }
-    get isFullRow() {
-        return this._zone.right === undefined;
-    }
-    get rangeData() {
-        return {
-            _zone: this._zone,
-            _sheetId: this.sheetId,
-        };
-    }
-    /**
-     * Check that a zone is valid regarding the order of top-bottom and left-right.
-     * Left should be smaller than right, top should be smaller than bottom.
-     * If it's not the case, simply invert them, and invert the linked parts
-     */
-    orderZone() {
-        const zone = { ...this._zone };
-        let parts = this.parts;
-        if (zone.right !== undefined && zone.right < zone.left) {
-            let right = zone.right;
-            zone.right = zone.left;
-            zone.left = right;
-            parts = [
-                {
-                    colFixed: parts[1]?.colFixed || false,
-                    rowFixed: parts[0]?.rowFixed || false,
-                },
-                {
-                    colFixed: parts[0]?.colFixed || false,
-                    rowFixed: parts[1]?.rowFixed || false,
-                },
-            ];
-        }
-        if (zone.bottom !== undefined && zone.bottom < zone.top) {
-            let bottom = zone.bottom;
-            zone.bottom = zone.top;
-            zone.top = bottom;
-            parts = [
-                {
-                    colFixed: parts[0]?.colFixed || false,
-                    rowFixed: parts[1]?.rowFixed || false,
-                },
-                {
-                    colFixed: parts[1]?.colFixed || false,
-                    rowFixed: parts[0]?.rowFixed || false,
-                },
-            ];
-        }
-        return this.clone({ zone, parts });
-    }
-    /**
-     *
-     * @param rangeParams optional, values to put in the cloned range instead of the current values of the range
-     */
-    clone(rangeParams) {
-        return new RangeImpl({
-            zone: rangeParams?.zone ? rangeParams.zone : { ...this._zone },
-            sheetId: rangeParams?.sheetId ? rangeParams.sheetId : this.sheetId,
-            invalidSheetName: rangeParams && "invalidSheetName" in rangeParams // 'attr in obj' instead of just 'obj.attr' because we accept undefined values
-                ? rangeParams.invalidSheetName
-                : this.invalidSheetName,
-            invalidXc: rangeParams && "invalidXc" in rangeParams ? rangeParams.invalidXc : this.invalidXc,
-            parts: rangeParams?.parts
-                ? rangeParams.parts
-                : this.parts.map((part) => {
-                    return { rowFixed: part.rowFixed, colFixed: part.colFixed };
-                }),
-            prefixSheet: rangeParams?.prefixSheet ? rangeParams.prefixSheet : this.prefixSheet,
-        }, this.getSheetSize);
-    }
-}
-/**
- * Copy a range. If the range is on the sheetIdFrom, the range will target
- * sheetIdTo.
- */
-function copyRangeWithNewSheetId(sheetIdFrom, sheetIdTo, range) {
-    const sheetId = range.sheetId === sheetIdFrom ? sheetIdTo : range.sheetId;
-    return range.clone({ sheetId });
-}
-/**
- * Create a range from a xc. If the xc is empty, this function returns undefined.
- */
-function createRange(getters, sheetId, range) {
-    return range ? getters.getRangeFromSheetXC(sheetId, range) : undefined;
-}
-
-/** Methods from Odoo Web Utils  */
-/**
- * This function computes a score that represent the fact that the
- * string contains the pattern, or not
- *
- * - If the score is 0, the string does not contain the letters of the pattern in
- *   the correct order.
- * - if the score is > 0, it actually contains the letters.
- *
- * Better matches will get a higher score: consecutive letters are better,
- * and a match closer to the beginning of the string is also scored higher.
- */
-function fuzzyMatch(pattern, str) {
-    pattern = pattern.toLocaleLowerCase();
-    str = str.toLocaleLowerCase();
-    let totalScore = 0;
-    let currentScore = 0;
-    let len = str.length;
-    let patternIndex = 0;
-    for (let i = 0; i < len; i++) {
-        if (str[i] === pattern[patternIndex]) {
-            patternIndex++;
-            currentScore += 100 + currentScore - i / 200;
-        }
-        else {
-            currentScore = 0;
-        }
-        totalScore = totalScore + currentScore;
-    }
-    return patternIndex === pattern.length ? totalScore : 0;
-}
-/**
- * Return a list of things that matches a pattern, ordered by their 'score' (
- * higher score first). An higher score means that the match is better. For
- * example, consecutive letters are considered a better match.
- */
-function fuzzyLookup(pattern, list, fn) {
-    const results = [];
-    list.forEach((data) => {
-        const score = fuzzyMatch(pattern, fn(data));
-        if (score > 0) {
-            results.push({ score, elem: data });
-        }
-    });
-    // we want better matches first
-    results.sort((a, b) => b.score - a.score);
-    return results.map((r) => r.elem);
-}
-
-function createDefaultRows(rowNumber) {
-    const rows = [];
-    for (let i = 0; i < rowNumber; i++) {
-        const row = {
-            cells: {},
-        };
-        rows.push(row);
-    }
-    return rows;
-}
-
-/*
- * https://stackoverflow.com/questions/105034/create-guid-uuid-in-javascript
- * */
-class UuidGenerator {
-    isFastIdStrategy = false;
-    fastIdStart = 0;
-    setIsFastStrategy(isFast) {
-        this.isFastIdStrategy = isFast;
-    }
-    uuidv4() {
-        if (this.isFastIdStrategy) {
-            this.fastIdStart++;
-            return String(this.fastIdStart);
-            //@ts-ignore
-        }
-        else if (window.crypto && window.crypto.getRandomValues) {
-            //@ts-ignore
-            return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, (c) => (c ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (c / 4)))).toString(16));
-        }
-        else {
-            // mainly for jest and other browsers that do not have the crypto functionality
-            return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (c) {
-                var r = (Math.random() * 16) | 0, v = c == "x" ? r : (r & 0x3) | 0x8;
-                return v.toString(16);
-            });
-        }
-    }
-}
-
 /**
  * Convert from a cartesian reference to a Zone
  * The range boundaries will be kept in the same order as the
@@ -3063,6 +2820,287 @@ function getZonesRows(zones) {
     return set;
 }
 
+class RangeImpl {
+    getSheetSize;
+    _zone;
+    parts;
+    invalidXc;
+    prefixSheet = false;
+    sheetId; // the sheet on which the range is defined
+    invalidSheetName; // the name of any sheet that is invalid
+    constructor(args, getSheetSize) {
+        this.getSheetSize = getSheetSize;
+        this._zone = args.zone;
+        this.parts = args.parts;
+        this.prefixSheet = args.prefixSheet;
+        this.invalidXc = args.invalidXc;
+        this.sheetId = args.sheetId;
+        this.invalidSheetName = args.invalidSheetName;
+    }
+    static fromRange(range, getters) {
+        if (range instanceof RangeImpl) {
+            return range;
+        }
+        return new RangeImpl(range, getters.getSheetSize);
+    }
+    get unboundedZone() {
+        return this._zone;
+    }
+    get zone() {
+        const { left, top, bottom, right } = this._zone;
+        if (right !== undefined && bottom !== undefined)
+            return { left, top, right, bottom };
+        else if (bottom === undefined && right !== undefined) {
+            return { right, top, left, bottom: this.getSheetSize(this.sheetId).numberOfRows - 1 };
+        }
+        else if (right === undefined && bottom !== undefined) {
+            return { bottom, left, top, right: this.getSheetSize(this.sheetId).numberOfCols - 1 };
+        }
+        throw new Error(_lt("Bad zone format"));
+    }
+    static getRangeParts(xc, zone) {
+        const parts = xc.split(":").map((p) => {
+            const isFullRow = isRowReference(p);
+            return {
+                colFixed: isFullRow ? false : p.startsWith("$"),
+                rowFixed: isFullRow ? p.startsWith("$") : p.includes("$", 1),
+            };
+        });
+        const isFullCol = zone.bottom === undefined;
+        const isFullRow = zone.right === undefined;
+        if (isFullCol) {
+            parts[0].rowFixed = parts[0].rowFixed || parts[1].rowFixed;
+            parts[1].rowFixed = parts[0].rowFixed || parts[1].rowFixed;
+            if (zone.left === zone.right) {
+                parts[0].colFixed = parts[0].colFixed || parts[1].colFixed;
+                parts[1].colFixed = parts[0].colFixed || parts[1].colFixed;
+            }
+        }
+        if (isFullRow) {
+            parts[0].colFixed = parts[0].colFixed || parts[1].colFixed;
+            parts[1].colFixed = parts[0].colFixed || parts[1].colFixed;
+            if (zone.top === zone.bottom) {
+                parts[0].rowFixed = parts[0].rowFixed || parts[1].rowFixed;
+                parts[1].rowFixed = parts[0].rowFixed || parts[1].rowFixed;
+            }
+        }
+        return parts;
+    }
+    get isFullCol() {
+        return this._zone.bottom === undefined;
+    }
+    get isFullRow() {
+        return this._zone.right === undefined;
+    }
+    get rangeData() {
+        return {
+            _zone: this._zone,
+            _sheetId: this.sheetId,
+        };
+    }
+    /**
+     * Check that a zone is valid regarding the order of top-bottom and left-right.
+     * Left should be smaller than right, top should be smaller than bottom.
+     * If it's not the case, simply invert them, and invert the linked parts
+     */
+    orderZone() {
+        const zone = { ...this._zone };
+        let parts = this.parts;
+        if (zone.right !== undefined && zone.right < zone.left) {
+            let right = zone.right;
+            zone.right = zone.left;
+            zone.left = right;
+            parts = [
+                {
+                    colFixed: parts[1]?.colFixed || false,
+                    rowFixed: parts[0]?.rowFixed || false,
+                },
+                {
+                    colFixed: parts[0]?.colFixed || false,
+                    rowFixed: parts[1]?.rowFixed || false,
+                },
+            ];
+        }
+        if (zone.bottom !== undefined && zone.bottom < zone.top) {
+            let bottom = zone.bottom;
+            zone.bottom = zone.top;
+            zone.top = bottom;
+            parts = [
+                {
+                    colFixed: parts[0]?.colFixed || false,
+                    rowFixed: parts[1]?.rowFixed || false,
+                },
+                {
+                    colFixed: parts[1]?.colFixed || false,
+                    rowFixed: parts[0]?.rowFixed || false,
+                },
+            ];
+        }
+        return this.clone({ zone, parts });
+    }
+    /**
+     *
+     * @param rangeParams optional, values to put in the cloned range instead of the current values of the range
+     */
+    clone(rangeParams) {
+        return new RangeImpl({
+            zone: rangeParams?.zone ? rangeParams.zone : { ...this._zone },
+            sheetId: rangeParams?.sheetId ? rangeParams.sheetId : this.sheetId,
+            invalidSheetName: rangeParams && "invalidSheetName" in rangeParams // 'attr in obj' instead of just 'obj.attr' because we accept undefined values
+                ? rangeParams.invalidSheetName
+                : this.invalidSheetName,
+            invalidXc: rangeParams && "invalidXc" in rangeParams ? rangeParams.invalidXc : this.invalidXc,
+            parts: rangeParams?.parts
+                ? rangeParams.parts
+                : this.parts.map((part) => {
+                    return { rowFixed: part.rowFixed, colFixed: part.colFixed };
+                }),
+            prefixSheet: rangeParams?.prefixSheet ? rangeParams.prefixSheet : this.prefixSheet,
+        }, this.getSheetSize);
+    }
+}
+/**
+ * Copy a range. If the range is on the sheetIdFrom, the range will target
+ * sheetIdTo.
+ */
+function copyRangeWithNewSheetId(sheetIdFrom, sheetIdTo, range) {
+    const sheetId = range.sheetId === sheetIdFrom ? sheetIdTo : range.sheetId;
+    return range.clone({ sheetId });
+}
+/**
+ * Create a range from a xc. If the xc is empty, this function returns undefined.
+ */
+function createRange(getters, sheetId, range) {
+    return range ? getters.getRangeFromSheetXC(sheetId, range) : undefined;
+}
+/**
+ * Spread multiple colrows zone to one row/col zone and add a many new input range as needed.
+ * For example, A1:B4 will become [A1:A4, B1:B4]
+ */
+function spreadRange(ranges) {
+    const postProcessedRanges = [];
+    for (const range of ranges) {
+        const { sheetName } = splitReference(range);
+        const sheetPrefix = sheetName ? `${sheetName}!` : "";
+        const zone = toUnboundedZone(range);
+        if (zone.bottom !== zone.top && zone.left != zone.right) {
+            if (zone.right) {
+                for (let j = zone.left; j <= zone.right; ++j) {
+                    postProcessedRanges.push(`${sheetPrefix}${zoneToXc({
+                        left: j,
+                        right: j,
+                        top: zone.top,
+                        bottom: zone.bottom,
+                    })}`);
+                }
+            }
+            else {
+                for (let j = zone.top; j <= zone.bottom; ++j) {
+                    postProcessedRanges.push(`${sheetPrefix}${zoneToXc({
+                        left: zone.left,
+                        right: zone.right,
+                        top: j,
+                        bottom: j,
+                    })}`);
+                }
+            }
+        }
+        else {
+            postProcessedRanges.push(range);
+        }
+    }
+    return postProcessedRanges;
+}
+
+/** Methods from Odoo Web Utils  */
+/**
+ * This function computes a score that represent the fact that the
+ * string contains the pattern, or not
+ *
+ * - If the score is 0, the string does not contain the letters of the pattern in
+ *   the correct order.
+ * - if the score is > 0, it actually contains the letters.
+ *
+ * Better matches will get a higher score: consecutive letters are better,
+ * and a match closer to the beginning of the string is also scored higher.
+ */
+function fuzzyMatch(pattern, str) {
+    pattern = pattern.toLocaleLowerCase();
+    str = str.toLocaleLowerCase();
+    let totalScore = 0;
+    let currentScore = 0;
+    let len = str.length;
+    let patternIndex = 0;
+    for (let i = 0; i < len; i++) {
+        if (str[i] === pattern[patternIndex]) {
+            patternIndex++;
+            currentScore += 100 + currentScore - i / 200;
+        }
+        else {
+            currentScore = 0;
+        }
+        totalScore = totalScore + currentScore;
+    }
+    return patternIndex === pattern.length ? totalScore : 0;
+}
+/**
+ * Return a list of things that matches a pattern, ordered by their 'score' (
+ * higher score first). An higher score means that the match is better. For
+ * example, consecutive letters are considered a better match.
+ */
+function fuzzyLookup(pattern, list, fn) {
+    const results = [];
+    list.forEach((data) => {
+        const score = fuzzyMatch(pattern, fn(data));
+        if (score > 0) {
+            results.push({ score, elem: data });
+        }
+    });
+    // we want better matches first
+    results.sort((a, b) => b.score - a.score);
+    return results.map((r) => r.elem);
+}
+
+function createDefaultRows(rowNumber) {
+    const rows = [];
+    for (let i = 0; i < rowNumber; i++) {
+        const row = {
+            cells: {},
+        };
+        rows.push(row);
+    }
+    return rows;
+}
+
+/*
+ * https://stackoverflow.com/questions/105034/create-guid-uuid-in-javascript
+ * */
+class UuidGenerator {
+    isFastIdStrategy = false;
+    fastIdStart = 0;
+    setIsFastStrategy(isFast) {
+        this.isFastIdStrategy = isFast;
+    }
+    uuidv4() {
+        if (this.isFastIdStrategy) {
+            this.fastIdStart++;
+            return String(this.fastIdStart);
+            //@ts-ignore
+        }
+        else if (window.crypto && window.crypto.getRandomValues) {
+            //@ts-ignore
+            return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, (c) => (c ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (c / 4)))).toString(16));
+        }
+        else {
+            // mainly for jest and other browsers that do not have the crypto functionality
+            return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (c) {
+                var r = (Math.random() * 16) | 0, v = c == "x" ? r : (r & 0x3) | 0x8;
+                return v.toString(16);
+            });
+        }
+    }
+}
+
 class ChartJsComponent extends Component {
     static template = "o-spreadsheet-ChartJsComponent";
     canvas = useRef("graphContainer");
@@ -17642,50 +17680,51 @@ const uuidGenerator$1 = new UuidGenerator();
 css /* scss */ `
   .o-selection {
     .o-selection-input {
-      display: flex;
-      flex-direction: row;
+      padding: 2px 0px;
 
       input {
         padding: 4px 6px;
         border-radius: 4px;
         box-sizing: border-box;
-        flex-grow: 2;
       }
       input:focus {
         outline: none;
       }
       input.o-required,
       input.o-focused {
-        border-width: 2px;
-        padding: 3px 5px;
+        border: 1px solid;
       }
       input.o-focused {
-        border-color: ${SELECTION_BORDER_COLOR};
+        border-width: 2px;
+        padding: 3px 5px;
       }
       input.o-invalid {
-        border-color: red;
+        /* The background-color is similar to the bootstrap alert-danger class but, because of the commit 0358a76d,
+         * which avoids being parasitized by the dark-mode in spreadsheet, we cannot use this class.
+         * TODO: Replace with the bootstrap alert-danger class when we support dark mode
+         */
+        background-color: #ffdddd;
+        border-width: 2px;
       }
       button.o-btn {
-        background: transparent;
-        border: none;
         color: #333;
-        cursor: pointer;
       }
       button.o-btn-action {
         margin: 8px 1px;
         border-radius: 4px;
-        background: transparent;
         border: 1px solid #dadce0;
         color: #188038;
-        font-weight: bold;
         font-size: 14px;
         height: 25px;
       }
+      .error-icon {
+        right: 7px;
+        top: 7px;
+      }
     }
     /** Make the character a bit bigger
     compared to its neighbor INPUT box  */
     .o-remove-selection {
-      font-weight: bold;
       font-size: calc(100% + 4px);
     }
   }
@@ -17701,7 +17740,7 @@ css /* scss */ `
 class SelectionInput extends Component {
     static template = "o-spreadsheet-SelectionInput";
     id = uuidGenerator$1.uuidv4();
-    previousRanges = this.props.ranges || [];
+    previousRanges = this.props.ranges() || [];
     originSheet = this.env.model.getters.getActiveSheetId();
     state = useState({
         isMissing: false,
@@ -17709,11 +17748,11 @@ class SelectionInput extends Component {
     });
     focusedInput = useRef("focusedInput");
     get ranges() {
-        const existingSelectionRange = this.env.model.getters.getSelectionInput(this.id);
-        const ranges = existingSelectionRange.length
-            ? existingSelectionRange
-            : this.props.ranges
-                ? this.props.ranges.map((xc, id) => ({
+        const existingSelectionRanges = this.env.model.getters.getSelectionInput(this.id);
+        const ranges = existingSelectionRanges.length
+            ? existingSelectionRanges
+            : this.props.ranges()
+                ? this.props.ranges().map((xc, id) => ({
                     xc,
                     id,
                     isFocused: false,
@@ -17733,6 +17772,12 @@ class SelectionInput extends Component {
     get isInvalid() {
         return this.props.isInvalid || this.state.isMissing;
     }
+    get isConfirmable() {
+        return this.hasFocus && this.ranges.every((range) => range.isValidRange);
+    }
+    get isResettable() {
+        return this.previousRanges.join() !== this.ranges.map((r) => r.xc).join();
+    }
     setup() {
         useEffect(() => this.focusedInput.el?.focus(), () => [this.focusedInput.el]);
         onMounted(() => this.enableNewSelectionInput());
@@ -17742,7 +17787,7 @@ class SelectionInput extends Component {
     enableNewSelectionInput() {
         this.env.model.dispatch("ENABLE_NEW_SELECTION_INPUT", {
             id: this.id,
-            initialRanges: this.props.ranges,
+            initialRanges: this.props.ranges(),
             hasSingleRange: this.props.hasSingleRange,
         });
     }
@@ -17751,7 +17796,8 @@ class SelectionInput extends Component {
     }
     checkChange() {
         const value = this.env.model.getters.getSelectionInputValue(this.id);
-        if (this.previousRanges.join() !== value.join()) {
+        const valid = !this.isInvalid && this.ranges.every((range) => range.isValidRange);
+        if (valid && this.previousRanges.join() !== value.join()) {
             this.triggerChange();
         }
     }
@@ -17762,7 +17808,6 @@ class SelectionInput extends Component {
     triggerChange() {
         const ranges = this.env.model.getters.getSelectionInputValue(this.id);
         this.props.onSelectionChanged?.(ranges);
-        this.previousRanges = ranges;
     }
     onKeydown(ev) {
         if (ev.key === "F2") {
@@ -17812,10 +17857,37 @@ class SelectionInput extends Component {
         });
         this.triggerChange();
     }
+    reset() {
+        const existingSelectionRanges = this.env.model.getters.getSelectionInput(this.id);
+        for (const range of existingSelectionRanges) {
+            this.env.model.dispatch("REMOVE_RANGE", {
+                id: this.id,
+                rangeId: range.id,
+            });
+        }
+        for (const range of this.previousRanges) {
+            this.env.model.dispatch("ADD_RANGE", { id: this.id, value: range });
+        }
+        this.confirm();
+    }
     confirm() {
-        this.env.model.dispatch("UNFOCUS_SELECTION_INPUT");
-        const ranges = this.env.model.getters.getSelectionInputValue(this.id);
-        if (this.props.required && ranges.length === 0) {
+        let anyValidInput = false;
+        const existingSelectionRanges = this.env.model.getters.getSelectionInput(this.id);
+        const existingSelectionXcs = [];
+        for (const range of existingSelectionRanges) {
+            if (range.xc === "") {
+                this.env.model.dispatch("REMOVE_RANGE", {
+                    id: this.id,
+                    rangeId: range.id,
+                });
+                continue;
+            }
+            existingSelectionXcs.push(range.xc);
+            if (this.env.model.getters.isRangeValid(range.xc)) {
+                anyValidInput = true;
+            }
+        }
+        if (this.props.required && !anyValidInput) {
             this.state.isMissing = true;
         }
         const activeSheetId = this.env.model.getters.getActiveSheetId();
@@ -17825,11 +17897,17 @@ class SelectionInput extends Component {
                 sheetIdTo: this.originSheet,
             });
         }
+        this.props.onSelectionChanged?.(existingSelectionXcs);
         this.props.onSelectionConfirmed?.();
+        this.previousRanges = this.props.ranges();
+        if (existingSelectionXcs.join() !== this.previousRanges.join()) {
+            this.enableNewSelectionInput();
+        }
+        this.env.model.dispatch("UNFOCUS_SELECTION_INPUT");
     }
 }
 SelectionInput.props = {
-    ranges: Array,
+    ranges: Function,
     hasSingleRange: { type: Boolean, optional: true },
     required: { type: Boolean, optional: true },
     isInvalid: { type: Boolean, optional: true },
@@ -17877,10 +17955,14 @@ class LineBarPieConfigPanel extends Component {
         this.dataSeriesRanges = ranges;
     }
     onDataSeriesConfirmed() {
+        this.dataSeriesRanges = spreadRange(this.dataSeriesRanges);
         this.state.datasetDispatchResult = this.props.updateChart({
             dataSets: this.dataSeriesRanges,
         });
     }
+    getDataSeriesRanges() {
+        return this.dataSeriesRanges;
+    }
     /**
      * Change the local labelRange. The model should be updated when the
      * button "confirm" is clicked
@@ -17893,6 +17975,9 @@ class LineBarPieConfigPanel extends Component {
             labelRange: this.labelRange,
         });
     }
+    getLabelRange() {
+        return this.labelRange || "";
+    }
     onUpdateAggregated(ev) {
         this.props.updateChart({
             aggregated: ev.target.checked,
@@ -18313,6 +18398,9 @@ class GaugeChartConfigPanel extends Component {
             dataRange: this.dataRange,
         });
     }
+    getDataRange() {
+        return this.dataRange || "";
+    }
 }
 GaugeChartConfigPanel.props = {
     figureId: String,
@@ -18511,6 +18599,9 @@ class ScorecardChartConfigPanel extends Component {
             keyValue: this.keyValue,
         });
     }
+    getKeyValueRange() {
+        return this.keyValue || "";
+    }
     onBaselineRangeChanged(ranges) {
         this.baseline = ranges[0];
     }
@@ -18519,6 +18610,9 @@ class ScorecardChartConfigPanel extends Component {
             baseline: this.baseline,
         });
     }
+    getBaselineRange() {
+        return this.baseline || "";
+    }
     updateBaselineMode(ev) {
         this.props.updateChart({ baselineMode: ev.target.value });
     }
@@ -28851,11 +28945,9 @@ class BasePlugin {
  */
 class CorePlugin extends BasePlugin {
     getters;
-    range;
     uuidGenerator;
     constructor({ getters, stateObserver, range, dispatch, uuidGenerator }) {
         super(stateObserver, dispatch);
-        this.range = range;
         range.addRangeProvider(this.adaptRanges.bind(this));
         this.getters = getters;
         this.uuidGenerator = uuidGenerator;
@@ -38618,6 +38710,7 @@ class SelectionInputPlugin extends UIPlugin {
     // ---------------------------------------------------------------------------
     allowDispatch(cmd) {
         switch (cmd.type) {
+            case "ADD_RANGE":
             case "ADD_EMPTY_RANGE":
                 if (this.inputHasSingleRange && this.ranges.length === 1) {
                     return 30 /* CommandResult.MaximumRangesReached */;
@@ -38662,6 +38755,10 @@ class SelectionInputPlugin extends UIPlugin {
                 this.insertNewRange(this.ranges.length, [""]);
                 this.focusLast();
                 break;
+            case "ADD_RANGE":
+                this.insertNewRange(this.ranges.length, [cmd.value]);
+                this.focusLast();
+                break;
             case "REMOVE_RANGE":
                 const index = this.getIndex(cmd.rangeId);
                 if (index !== null) {
@@ -38873,6 +38970,7 @@ class SelectionInputsManagerPlugin extends UIPlugin {
             case "UNFOCUS_SELECTION_INPUT":
                 this.unfocus();
                 break;
+            case "ADD_RANGE":
             case "ADD_EMPTY_RANGE":
             case "REMOVE_RANGE":
                 if (cmd.id !== this.focusedInputId) {
@@ -38886,9 +38984,11 @@ class SelectionInputsManagerPlugin extends UIPlugin {
                 if (cmd.id !== this.focusedInputId) {
                     const input = this.inputs[cmd.id];
                     const range = input.ranges.find((range) => range.id === cmd.rangeId);
-                    const sheetId = this.getters.getActiveSheetId();
-                    const zone = this.getters.getRangeFromSheetXC(sheetId, range?.xc || "A1").zone;
-                    this.selection.capture(input, { cell: { col: zone.left, row: zone.top }, zone }, { handleEvent: input.handleEvent.bind(input) });
+                    if (this.isRangeValid(range?.xc || "A1")) {
+                        const sheetId = this.getters.getActiveSheetId();
+                        const zone = this.getters.getRangeFromSheetXC(sheetId, range?.xc || "A1").zone;
+                        this.selection.capture(input, { cell: { col: zone.left, row: zone.top }, zone }, { handleEvent: input.handleEvent.bind(input) });
+                    }
                     this.focusedInputId = cmd.id;
                 }
                 break;
@@ -48167,9 +48267,9 @@ function addFunction(functionName, functionDescription) {
     functionRegistry.add(functionName, functionDescription);
 }
 
-export { AbstractChart, CommandResult, CorePlugin, DispatchResult, EvaluationError, Model, Registry, Revision, SPREADSHEET_DIMENSIONS, Spreadsheet, UIPlugin, __info__, addFunction, astToFormula, compile, components, convertAstNodes, coreTypes, findCellInNewZone, functionCache, helpers, invalidateEvaluationCommands, links, load, parse, readonlyAllowedCommands, registries, setDefaultSheetViewSize, setTranslationMethod, tokenize };
+export { AbstractChart, CommandResult, CorePlugin, DispatchResult, EvaluationError, Model, Registry, Revision, SPREADSHEET_DIMENSIONS, Spreadsheet, UIPlugin, __info__, addFunction, astToFormula, compile, components, convertAstNodes, coreTypes, findCellInNewZone, functionCache, helpers, invalidateCFEvaluationCommands, invalidateDependenciesCommands, invalidateEvaluationCommands, links, load, parse, readonlyAllowedCommands, registries, setDefaultSheetViewSize, setTranslationMethod, tokenize };
 
 
-__info__.version = '16.4.0-alpha.1';
-__info__.date = '2023-05-25T13:00:14.133Z';
-__info__.hash = '564c094';
+__info__.version = '16.4.0-alpha.2';
+__info__.date = '2023-05-26T13:40:49.561Z';
+__info__.hash = '82328ad';