[FIX] composer: overflow on composer at end of screen

The button to close the composer's formula assistant would overflow
for the viewport and make an additional scrollbar appear when it's
at the end of the screen (eg. standalone composer in the CF color
scale panel).

This was due to two things:
1) there was a comment with `//`, which is invalid css and disabled
the `width` property of the button
2) we were using a `CLOSE_ICON_RADIUS` to compote the position of the
formula assistant. But this constant wasn't actually used in the CSS,
so the button could have an arbitrary width unrelated to the constant.
(in practice it was 18.4px vs 18px, but this would change if we changed
the font size).

Task: 4315958

src/components/composer/composer/composer.ts

@@ -92,10 +92,10 @@ css/* scss */ `
     }
 
     .fa-stack {
-      // reset stack size which is doubled by default
-      width: 1em;
-      height: 1em;
-      line-height: 1em;
+      /* reset stack size which is doubled by default */
+      width: ${CLOSE_ICON_RADIUS * 2}px;
+      height: ${CLOSE_ICON_RADIUS * 2}px;
+      line-height: ${CLOSE_ICON_RADIUS * 2}px;
     }
 
     .force-open-assistant {
@@ -496,22 +496,22 @@ export class Composer extends Component<CellComposerProps, SpreadsheetChildEnv>
   }
 
   onBlur(ev: FocusEvent) {
-    if (this.props.composerStore.editionMode === "inactive") {
-      return;
-    }
-    const target = ev.relatedTarget;
-    if (!target || !(target instanceof HTMLElement)) {
-      this.props.composerStore.stopEdition();
-      return;
-    }
-    if (target.attributes.getNamedItem("composerFocusableElement")) {
-      this.contentHelper.el.focus();
-      return;
-    }
-    if (target.classList.contains("o-composer")) {
-      return;
-    }
-    this.props.composerStore.stopEdition();
+    // if (this.props.composerStore.editionMode === "inactive") {
+    //   return;
+    // }
+    // const target = ev.relatedTarget;
+    // if (!target || !(target instanceof HTMLElement)) {
+    //   this.props.composerStore.stopEdition();
+    //   return;
+    // }
+    // if (target.attributes.getNamedItem("composerFocusableElement")) {
+    //   this.contentHelper.el.focus();
+    //   return;
+    // }
+    // if (target.classList.contains("o-composer")) {
+    //   return;
+    // }
+    // this.props.composerStore.stopEdition();
   }
 
   updateAutoCompleteIndex(index: number) {

src/components/spreadsheet/spreadsheet.ts

@@ -450,6 +450,16 @@ export class Spreadsheet extends Component<SpreadsheetProps, SpreadsheetChildEnv
       this.checkViewportSize();
       stores.on("store-updated", this, render);
       resizeObserver.observe(this.spreadsheetRef.el!);
+      this.env.model.selection.selectZone(
+        {
+          cell: { col: 6, row: 2 },
+          zone: { top: 2, bottom: 2, left: 6, right: 6 },
+        },
+        { scrollIntoView: false }
+      );
+      this.sidePanel.open("ConditionalFormatting", {
+        selection: this.env.model.getters.getSelectedZones(),
+      });
     });
     onWillUnmount(() => {
       this.unbindModelEvents();