blockly 9.0.0-beta.0 → 9.0.0-beta.1

package/core/renderers/geras/info.ts

@@ -1,450 +0,0 @@
-/**
- * @license
- * Copyright 2019 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * @fileoverview Old (compatibility) renderer.
- * Geras: spirit of old age.
- */
-
-/**
- * Old (compatibility) renderer.
- * Geras: spirit of old age.
- * @class
- */
-import * as goog from '../../../closure/goog/goog.js';
-goog.declareModuleId('Blockly.geras.RenderInfo');
-
-import type {BlockSvg} from '../../block_svg.js';
-import type {Input} from '../../input.js';
-import {inputTypes} from '../../input_types.js';
-import {RenderInfo as BaseRenderInfo} from '../common/info.js';
-import type {Measurable} from '../measurables/base.js';
-import type {BottomRow} from '../measurables/bottom_row.js';
-import {ExternalValueInput} from '../measurables/external_value_input.js';
-import type {Field} from '../measurables/field.js';
-import {InRowSpacer} from '../measurables/in_row_spacer.js';
-import type {InputRow} from '../measurables/input_row.js';
-import type {Row} from '../measurables/row.js';
-import type {TopRow} from '../measurables/top_row.js';
-import {Types} from '../measurables/types.js';
-
-import type {ConstantProvider} from './constants.js';
-import {InlineInput} from './measurables/inline_input.js';
-import {StatementInput} from './measurables/statement_input.js';
-import type {Renderer} from './renderer.js';
-
-
-/**
- * An object containing all sizing information needed to draw this block.
- *
- * This measure pass does not propagate changes to the block (although fields
- * may choose to rerender when getSize() is called).  However, calling it
- * repeatedly may be expensive.
- * @alias Blockly.geras.RenderInfo
- */
-export class RenderInfo extends BaseRenderInfo {
-  // TODO(b/109816955): remove '!', see go/strict-prop-init-fix.
-  override constants_!: ConstantProvider;
-
-  protected override readonly renderer_: Renderer;
-
-  /**
-   * @param renderer The renderer in use.
-   * @param block The block to measure.
-   * @internal
-   */
-  constructor(renderer: Renderer, block: BlockSvg) {
-    super(renderer, block);
-    this.renderer_ = renderer;
-  }
-
-  /**
-   * Get the block renderer in use.
-   * @return The block renderer in use.
-   * @internal
-   */
-  override getRenderer(): Renderer {
-    return this.renderer_;
-  }
-
-  override populateBottomRow_() {
-    super.populateBottomRow_();
-
-    const followsStatement = this.block_.inputList.length &&
-        this.block_.inputList[this.block_.inputList.length - 1].type ===
-            inputTypes.STATEMENT;
-    // The minimum height of the bottom row is smaller in Geras than in other
-    // renderers, because the dark path adds a pixel.
-    // If one of the row's elements has a greater height this will be
-    // overwritten in the compute pass.
-    if (!followsStatement) {
-      this.bottomRow.minHeight =
-          this.constants_.MEDIUM_PADDING - this.constants_.DARK_PATH_OFFSET;
-    }
-  }
-
-  override addInput_(input: Input, activeRow: Row) {
-    // Non-dummy inputs have visual representations onscreen.
-    if (this.isInline && input.type === inputTypes.VALUE) {
-      activeRow.elements.push(new InlineInput(this.constants_, input));
-      activeRow.hasInlineInput = true;
-    } else if (input.type === inputTypes.STATEMENT) {
-      activeRow.elements.push(new StatementInput(this.constants_, input));
-      activeRow.hasStatement = true;
-    } else if (input.type === inputTypes.VALUE) {
-      activeRow.elements.push(new ExternalValueInput(this.constants_, input));
-      activeRow.hasExternalInput = true;
-    } else if (input.type === inputTypes.DUMMY) {
-      // Dummy inputs have no visual representation, but the information is
-      // still important.
-      activeRow.minHeight =
-          Math.max(activeRow.minHeight, this.constants_.DUMMY_INPUT_MIN_HEIGHT);
-      activeRow.hasDummyInput = true;
-    }
-    // Ignore row alignment if inline.
-    if (!this.isInline && activeRow.align === null) {
-      activeRow.align = input.align;
-    }
-  }
-
-  override addElemSpacing_() {
-    let hasExternalInputs = false;
-    for (let i = 0, row; row = this.rows[i]; i++) {
-      if (row.hasExternalInput) {
-        hasExternalInputs = true;
-      }
-    }
-    for (let i = 0, row; row = this.rows[i]; i++) {
-      const oldElems = row.elements;
-      row.elements = [];
-      // No spacing needed before the corner on the top row or the bottom row.
-      if (row.startsWithElemSpacer()) {
-        // There's a spacer before the first element in the row.
-        row.elements.push(new InRowSpacer(
-            this.constants_, this.getInRowSpacing_(null, oldElems[0])));
-      }
-      if (!oldElems.length) {
-        continue;
-      }
-      for (let e = 0; e < oldElems.length - 1; e++) {
-        row.elements.push(oldElems[e]);
-        const spacing = this.getInRowSpacing_(oldElems[e], oldElems[e + 1]);
-        row.elements.push(new InRowSpacer(this.constants_, spacing));
-      }
-      row.elements.push(oldElems[oldElems.length - 1]);
-      if (row.endsWithElemSpacer()) {
-        let spacing =
-            this.getInRowSpacing_(oldElems[oldElems.length - 1], null);
-        if (hasExternalInputs && row.hasDummyInput) {
-          spacing += this.constants_.TAB_WIDTH;
-        }
-        // There's a spacer after the last element in the row.
-        row.elements.push(new InRowSpacer(this.constants_, spacing));
-      }
-    }
-  }
-
-  override getInRowSpacing_(prev: Measurable|null, next: Measurable|null) {
-    if (!prev) {
-      // Between an editable field and the beginning of the row.
-      if (next && Types.isField(next) && (next as Field).isEditable) {
-        return this.constants_.MEDIUM_PADDING;
-      }
-      // Inline input at the beginning of the row.
-      if (next && Types.isInlineInput(next)) {
-        return this.constants_.MEDIUM_LARGE_PADDING;
-      }
-      if (next && Types.isStatementInput(next)) {
-        return this.constants_.STATEMENT_INPUT_PADDING_LEFT;
-      }
-      // Anything else at the beginning of the row.
-      return this.constants_.LARGE_PADDING;
-    }
-
-    // Spacing between a non-input and the end of the row or a statement input.
-    if (!Types.isInput(prev) && (!next || Types.isStatementInput(next))) {
-      // Between an editable field and the end of the row.
-      if (Types.isField(prev) && (prev as Field).isEditable) {
-        return this.constants_.MEDIUM_PADDING;
-      }
-      // Padding at the end of an icon-only row to make the block shape clearer.
-      if (Types.isIcon(prev)) {
-        return this.constants_.LARGE_PADDING * 2 + 1;
-      }
-      if (Types.isHat(prev)) {
-        return this.constants_.NO_PADDING;
-      }
-      // Establish a minimum width for a block with a previous or next
-      // connection.
-      if (Types.isPreviousOrNextConnection(prev)) {
-        return this.constants_.LARGE_PADDING;
-      }
-      // Between rounded corner and the end of the row.
-      if (Types.isLeftRoundedCorner(prev)) {
-        return this.constants_.MIN_BLOCK_WIDTH;
-      }
-      // Between a jagged edge and the end of the row.
-      if (Types.isJaggedEdge(prev)) {
-        return this.constants_.NO_PADDING;
-      }
-      // Between noneditable fields and icons and the end of the row.
-      return this.constants_.LARGE_PADDING;
-    }
-
-    // Between inputs and the end of the row.
-    if (Types.isInput(prev) && !next) {
-      if (Types.isExternalInput(prev)) {
-        return this.constants_.NO_PADDING;
-      } else if (Types.isInlineInput(prev)) {
-        return this.constants_.LARGE_PADDING;
-      } else if (Types.isStatementInput(prev)) {
-        return this.constants_.NO_PADDING;
-      }
-    }
-
-    // Spacing between a non-input and an input.
-    if (!Types.isInput(prev) && next && Types.isInput(next)) {
-      // Between an editable field and an input.
-      if (Types.isField(prev) && (prev as Field).isEditable) {
-        if (Types.isInlineInput(next)) {
-          return this.constants_.SMALL_PADDING;
-        } else if (Types.isExternalInput(next)) {
-          return this.constants_.SMALL_PADDING;
-        }
-      } else {
-        if (Types.isInlineInput(next)) {
-          return this.constants_.MEDIUM_LARGE_PADDING;
-        } else if (Types.isExternalInput(next)) {
-          return this.constants_.MEDIUM_LARGE_PADDING;
-        } else if (Types.isStatementInput(next)) {
-          return this.constants_.LARGE_PADDING;
-        }
-      }
-      return this.constants_.LARGE_PADDING - 1;
-    }
-
-    // Spacing between an icon and an icon or field.
-    if (Types.isIcon(prev) && next && !Types.isInput(next)) {
-      return this.constants_.LARGE_PADDING;
-    }
-    // Spacing between an inline input and a field.
-    if (Types.isInlineInput(prev) && next && Types.isField(next)) {
-      // Editable field after inline input.
-      if ((next as Field).isEditable) {
-        return this.constants_.MEDIUM_PADDING;
-      } else {
-        // Noneditable field after inline input.
-        return this.constants_.LARGE_PADDING;
-      }
-    }
-
-    if (Types.isLeftSquareCorner(prev) && next) {
-      // Spacing between a hat and a corner
-      if (Types.isHat(next)) {
-        return this.constants_.NO_PADDING;
-      }
-      // Spacing between a square corner and a previous or next connection
-      if (Types.isPreviousConnection(next)) {
-        return next.notchOffset;
-      } else if (Types.isNextConnection(next)) {
-        // Next connections are shifted slightly to the left (in both LTR and
-        // RTL) to make the dark path under the previous connection show
-        // through.
-        const offset =
-            (this.RTL ? 1 : -1) * this.constants_.DARK_PATH_OFFSET / 2;
-        return next.notchOffset + offset;
-      }
-    }
-
-    // Spacing between a rounded corner and a previous or next connection.
-    if (Types.isLeftRoundedCorner(prev) && next) {
-      if (Types.isPreviousConnection(next)) {
-        return next.notchOffset - this.constants_.CORNER_RADIUS;
-      } else if (Types.isNextConnection(next)) {
-        // Next connections are shifted slightly to the left (in both LTR and
-        // RTL) to make the dark path under the previous connection show
-        // through.
-        const offset =
-            (this.RTL ? 1 : -1) * this.constants_.DARK_PATH_OFFSET / 2;
-        return next.notchOffset - this.constants_.CORNER_RADIUS + offset;
-      }
-    }
-
-    // Spacing between two fields of the same editability.
-    if (Types.isField(prev) && next && Types.isField(next) &&
-        (prev as Field).isEditable === (next as Field).isEditable) {
-      return this.constants_.LARGE_PADDING;
-    }
-
-    // Spacing between anything and a jagged edge.
-    if (next && Types.isJaggedEdge(next)) {
-      return this.constants_.LARGE_PADDING;
-    }
-
-    return this.constants_.MEDIUM_PADDING;
-  }
-
-  override getSpacerRowHeight_(prev: Row, next: Row) {
-    // If we have an empty block add a spacer to increase the height.
-    if (Types.isTopRow(prev) && Types.isBottomRow(next)) {
-      return this.constants_.EMPTY_BLOCK_SPACER_HEIGHT;
-    }
-    // Top and bottom rows act as a spacer so we don't need any extra padding.
-    if (Types.isTopRow(prev) || Types.isBottomRow(next)) {
-      return this.constants_.NO_PADDING;
-    }
-    if (prev.hasExternalInput && next.hasExternalInput) {
-      return this.constants_.LARGE_PADDING;
-    }
-    if (!prev.hasStatement && next.hasStatement) {
-      return this.constants_.BETWEEN_STATEMENT_PADDING_Y;
-    }
-    if (prev.hasStatement && next.hasStatement) {
-      return this.constants_.LARGE_PADDING;
-    }
-    if (!prev.hasStatement && next.hasDummyInput) {
-      return this.constants_.LARGE_PADDING;
-    }
-    if (prev.hasDummyInput) {
-      return this.constants_.LARGE_PADDING;
-    }
-    return this.constants_.MEDIUM_PADDING;
-  }
-
-  override getElemCenterline_(row: Row, elem: Measurable) {
-    if (Types.isSpacer(elem)) {
-      return row.yPos + elem.height / 2;
-    }
-    if (Types.isBottomRow(row)) {
-      const bottomRow = row as BottomRow;
-      const baseline =
-          bottomRow.yPos + bottomRow.height - bottomRow.descenderHeight;
-      if (Types.isNextConnection(elem)) {
-        return baseline + elem.height / 2;
-      }
-      return baseline - elem.height / 2;
-    }
-    if (Types.isTopRow(row)) {
-      const topRow = row as TopRow;
-      if (Types.isHat(elem)) {
-        return topRow.capline - elem.height / 2;
-      }
-      return topRow.capline + elem.height / 2;
-    }
-
-    let result = row.yPos;
-    if (Types.isField(elem) || Types.isIcon(elem)) {
-      result += elem.height / 2;
-      if ((row.hasInlineInput || row.hasStatement) &&
-          elem.height + this.constants_.TALL_INPUT_FIELD_OFFSET_Y <=
-              row.height) {
-        result += this.constants_.TALL_INPUT_FIELD_OFFSET_Y;
-      }
-    } else if (Types.isInlineInput(elem)) {
-      result += elem.height / 2;
-    } else {
-      result += row.height / 2;
-    }
-    return result;
-  }
-
-  override alignRowElements_() {
-    if (!this.isInline) {
-      super.alignRowElements_();
-      return;
-    }
-    // Walk backgrounds through rows on the block, keeping track of the right
-    // input edge.
-    let nextRightEdge = 0;
-    const rowNextRightEdges = new WeakMap();
-    let prevInput = null;
-    for (let i = this.rows.length - 1, row; row = this.rows[i]; i--) {
-      rowNextRightEdges.set(row, nextRightEdge);
-      if (Types.isInputRow(row)) {
-        if (row.hasStatement) {
-          this.alignStatementRow_(row as InputRow);
-        }
-        if (prevInput && prevInput.hasStatement &&
-            row.width < prevInput.width) {
-          rowNextRightEdges.set(row, prevInput.width);
-        } else {
-          nextRightEdge = row.width;
-        }
-        prevInput = row;
-      }
-    }
-    // Walk down each row from the top, comparing the prev and next right input
-    // edges and setting the desired width to the max of the two.
-    let prevRightEdge = 0;
-    for (let i = 0, row; row = this.rows[i]; i++) {
-      if (row.hasStatement) {
-        prevRightEdge = this.getDesiredRowWidth_(row);
-      } else if (Types.isSpacer(row)) {
-        // Set the spacer row to the max of the prev or next input width.
-        row.width = Math.max(prevRightEdge, rowNextRightEdges.get(row));
-      } else {
-        const currentWidth = row.width;
-        const desiredWidth =
-            Math.max(prevRightEdge, rowNextRightEdges.get(row));
-        const missingSpace = desiredWidth - currentWidth;
-        if (missingSpace > 0) {
-          this.addAlignmentPadding_(row, missingSpace);
-        }
-        prevRightEdge = row.width;
-      }
-    }
-  }
-
-  override getDesiredRowWidth_(row: Row) {
-    // Limit the width of a statement row when a block is inline.
-    if (this.isInline && row.hasStatement) {
-      return this.statementEdge + this.constants_.MAX_BOTTOM_WIDTH +
-          this.startX;
-    }
-    return super.getDesiredRowWidth_(row);
-  }
-
-  override finalize_() {
-    // Performance note: this could be combined with the draw pass, if the time
-    // that this takes is excessive.  But it shouldn't be, because it only
-    // accesses and sets properties that already exist on the objects.
-    let widestRowWithConnectedBlocks = 0;
-    let yCursor = 0;
-    for (let i = 0, row; row = this.rows[i]; i++) {
-      row.yPos = yCursor;
-      row.xPos = this.startX;
-      yCursor += row.height;
-
-      widestRowWithConnectedBlocks =
-          Math.max(widestRowWithConnectedBlocks, row.widthWithConnectedBlocks);
-      // Add padding to the bottom row if block height is less than minimum
-      const heightWithoutHat = yCursor - this.topRow.ascenderHeight;
-      if (row === this.bottomRow &&
-          heightWithoutHat < this.constants_.MIN_BLOCK_HEIGHT) {
-        // But the hat height shouldn't be part of this.
-        const diff = this.constants_.MIN_BLOCK_HEIGHT - heightWithoutHat;
-        this.bottomRow.height += diff;
-        yCursor += diff;
-      }
-      this.recordElemPositions_(row);
-    }
-    if (this.outputConnection && this.block_.nextConnection &&
-        this.block_.nextConnection.isConnected()) {
-      // Include width of connected block in value to stack width measurement.
-      widestRowWithConnectedBlocks = Math.max(
-          widestRowWithConnectedBlocks,
-          this.block_.nextConnection.targetBlock().getHeightWidth().width -
-              this.constants_.DARK_PATH_OFFSET);
-    }
-
-    this.bottomRow.baseline = yCursor - this.bottomRow.descenderHeight;
-    this.widthWithChildren = widestRowWithConnectedBlocks + this.startX +
-        this.constants_.DARK_PATH_OFFSET;
-    this.width += this.constants_.DARK_PATH_OFFSET;
-    this.height = yCursor + this.constants_.DARK_PATH_OFFSET;
-    this.startY = this.topRow.capline;
-  }
-}

package/core/renderers/geras/measurables/inline_input.ts

@@ -1,51 +0,0 @@
-/**
- * @license
- * Copyright 2019 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * @fileoverview Objects representing inline inputs with connections on a
- * rendered block.
- */
-
-/**
- * Objects representing inline inputs with connections on a
- * rendered block.
- * @class
- */
-import * as goog from '../../../../closure/goog/goog.js';
-goog.declareModuleId('Blockly.geras.InlineInput');
-
-/* eslint-disable-next-line no-unused-vars */
-import type {Input} from '../../../input.js';
-import type {ConstantProvider as BaseConstantProvider} from '../../../renderers/common/constants.js';
-import {InlineInput as BaseInlineInput} from '../../../renderers/measurables/inline_input.js';
-import type {ConstantProvider as GerasConstantProvider} from '../constants.js';
-
-
-/**
- * An object containing information about the space an inline input takes up
- * during rendering.
- * @alias Blockly.geras.InlineInput
- */
-export class InlineInput extends BaseInlineInput {
-  override constants_: GerasConstantProvider;
-
-  /**
-   * @param constants The rendering constants provider.
-   * @param input The inline input to measure and store information for.
-   * @internal
-   */
-  constructor(constants: BaseConstantProvider, input: Input) {
-    super(constants, input);
-    this.constants_ = constants as GerasConstantProvider;
-
-    if (this.connectedBlock) {
-      // We allow the dark path to show on the parent block so that the child
-      // block looks embossed.  This takes up an extra pixel in both x and y.
-      this.width += this.constants_.DARK_PATH_OFFSET;
-      this.height += this.constants_.DARK_PATH_OFFSET;
-    }
-  }
-}

package/core/renderers/geras/measurables/statement_input.ts

@@ -1,50 +0,0 @@
-/**
- * @license
- * Copyright 2019 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * @fileoverview Objects representing statement inputs with connections on a
- * rendered block.
- */
-
-/**
- * Objects representing statement inputs with connections on a
- * rendered block.
- * @class
- */
-import * as goog from '../../../../closure/goog/goog.js';
-goog.declareModuleId('Blockly.geras.StatementInput');
-
-/* eslint-disable-next-line no-unused-vars */
-import type {Input} from '../../../input.js';
-import type {ConstantProvider as BaseConstantProvider} from '../../../renderers/common/constants.js';
-import {StatementInput as BaseStatementInput} from '../../../renderers/measurables/statement_input.js';
-import type {ConstantProvider as GerasConstantProvider} from '../constants.js';
-
-
-/**
- * An object containing information about the space a statement input takes up
- * during rendering.
- * @alias Blockly.geras.StatementInput
- */
-export class StatementInput extends BaseStatementInput {
-  override constants_: GerasConstantProvider;
-
-  /**
-   * @param constants The rendering constants provider.
-   * @param input The statement input to measure and store information for.
-   * @internal
-   */
-  constructor(constants: BaseConstantProvider, input: Input) {
-    super(constants, input);
-    this.constants_ = constants as GerasConstantProvider;
-
-    if (this.connectedBlock) {
-      // We allow the dark path to show on the parent block so that the child
-      // block looks embossed.  This takes up an extra pixel in both x and y.
-      this.height += this.constants_.DARK_PATH_OFFSET;
-    }
-  }
-}

package/core/renderers/geras/path_object.ts

@@ -1,138 +0,0 @@
-/**
- * @license
- * Copyright 2019 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * @fileoverview An object that owns a block's rendering SVG elements.
- */
-
-/**
- * An object that owns a block's rendering SVG elements.
- * @class
- */
-import * as goog from '../../../closure/goog/goog.js';
-goog.declareModuleId('Blockly.geras.PathObject');
-
-/* eslint-disable-next-line no-unused-vars */
-// Unused import preserved for side-effects. Remove if unneeded.
-// import '../../theme.js';
-
-import type {BlockSvg} from '../../block_svg.js';
-import type {BlockStyle} from '../../theme.js';
-import * as colour from '../../utils/colour.js';
-import * as dom from '../../utils/dom.js';
-import {Svg} from '../../utils/svg.js';
-import {PathObject as BasePathObject} from '../common/path_object.js';
-
-import type {ConstantProvider} from './constants.js';
-
-
-/**
- * An object that handles creating and setting each of the SVG elements
- * used by the renderer.
- * @alias Blockly.geras.PathObject
- */
-export class PathObject extends BasePathObject {
-  /** @internal */
-  svgPathDark: SVGElement;
-  /** @internal */
-  svgPathLight: SVGElement;
-
-  /**
-   * The colour of the dark path on the block in '#RRGGBB' format.
-   * @internal
-   */
-  colourDark = '#000000';
-  override style: AnyDuringMigration;
-
-  /**
-   * @param root The root SVG element.
-   * @param style The style object to use for colouring.
-   * @param constants The renderer's constants.
-   * @internal
-   */
-  constructor(
-      root: SVGElement, style: BlockStyle,
-      public override constants: ConstantProvider) {
-    super(root, style, constants);
-
-    /** The dark path of the block. */
-    this.svgPathDark = dom.createSvgElement(
-        Svg.PATH, {'class': 'blocklyPathDark', 'transform': 'translate(1,1)'});
-    // SVG draw order is based on the order of elements (top most = back most)
-    // So we need to insert the dark path before the base path to make sure it
-    // gets drawn first.
-    this.svgRoot.insertBefore(this.svgPathDark, this.svgPath);
-
-    /** The light path of the block. */
-    this.svgPathLight = dom.createSvgElement(
-        Svg.PATH, {'class': 'blocklyPathLight'}, this.svgRoot);
-  }
-
-  override setPath(mainPath: string) {
-    this.svgPath.setAttribute('d', mainPath);
-    this.svgPathDark.setAttribute('d', mainPath);
-  }
-
-  /**
-   * Set the highlight path generated by the renderer onto the SVG element.
-   * @param highlightPath The highlight path.
-   * @internal
-   */
-  setHighlightPath(highlightPath: string) {
-    this.svgPathLight.setAttribute('d', highlightPath);
-  }
-
-  override flipRTL() {
-    // Mirror the block's path.
-    this.svgPath.setAttribute('transform', 'scale(-1 1)');
-    this.svgPathLight.setAttribute('transform', 'scale(-1 1)');
-    this.svgPathDark.setAttribute('transform', 'translate(1,1) scale(-1 1)');
-  }
-
-  override applyColour(block: BlockSvg) {
-    this.svgPathLight.style.display = '';
-    this.svgPathDark.style.display = '';
-    this.svgPathLight.setAttribute('stroke', this.style.colourTertiary);
-    this.svgPathDark.setAttribute('fill', this.colourDark);
-
-    super.applyColour(block);
-
-    this.svgPath.setAttribute('stroke', 'none');
-  }
-
-  override setStyle(blockStyle: BlockStyle) {
-    this.style = blockStyle;
-    this.colourDark =
-        colour.blend('#000', this.style.colourPrimary, 0.2) || this.colourDark;
-  }
-
-  override updateHighlighted(highlighted: boolean) {
-    if (highlighted) {
-      this.svgPath.setAttribute(
-          'filter', 'url(#' + this.constants.embossFilterId + ')');
-      this.svgPathLight.style.display = 'none';
-    } else {
-      this.svgPath.setAttribute('filter', 'none');
-      this.svgPathLight.style.display = 'inline';
-    }
-  }
-
-  override updateShadow_(shadow: boolean) {
-    if (shadow) {
-      this.svgPathLight.style.display = 'none';
-      this.svgPathDark.setAttribute('fill', this.style.colourSecondary);
-      this.svgPath.setAttribute('stroke', 'none');
-      this.svgPath.setAttribute('fill', this.style.colourSecondary);
-    }
-  }
-
-  override updateDisabled_(disabled: boolean) {
-    super.updateDisabled_(disabled);
-    if (disabled) {
-      this.svgPath.setAttribute('stroke', 'none');
-    }
-  }
-}