Repository: ionic-team/ionic-framework
File: core/src/components/range/range.tsx (TypeScript)

Code before:

  /**
   * A callback used to format the pin text.
   * By default the pin text is set to `Math.round(value)`.
   */
  @Prop() pinFormatter: PinFormatter = (value: number): number => Math.round(value);

  /**
   * If `true`, the knob snaps to tick marks evenly spaced based
   * on the step property value.
   */
  @Prop() snaps = false;

  /**
   * Specifies the value granularity.
   */
  @Prop() step = 1;

  /**
   * If `true`, tick marks are displayed based on the step value.
   * Only applies when `snaps` is `true`.
   */
  @Prop() ticks = true;

  /**
   * The start position of the range active bar, only available with a single knob (dualKnobs="false").
   * Valid values are between the `min` and `max` values.
   */
  @Prop() barActiveStart?: number;
  @Watch('barActiveStart')
  protected barActiveStartChanged() {
    const { barActiveStart } = this;
    if (barActiveStart !== undefined) {
      if (barActiveStart > this.max) {
        printIonWarning(
          `Range: The value of barActiveStart (${barActiveStart}) is greater than the max (${this.max}). Accepted values are between the min and max values of the range.`,
          this.el
        );
      } else if (barActiveStart < this.min) {
        printIonWarning(
          `Range: The value of barActiveStart (${barActiveStart}) is less than the min (${this.min}). Accepted values are between the min and max values of the range.`,
          this.el
        );
      }
    }
  }

  /**
   * If `true`, the user cannot interact with the range.
   */
  @Prop() disabled = false;

Review comment (suggestion):
```suggestion
   * The start position of the range active bar. This feature is only available with a single knob (dualKnobs="false").
```

Code after:

  /**
   * A callback used to format the pin text.
   * By default the pin text is set to `Math.round(value)`.
   */
  @Prop() pinFormatter: PinFormatter = (value: number): number => Math.round(value);

  /**
   * If `true`, the knob snaps to tick marks evenly spaced based
   * on the step property value.
   */
  @Prop() snaps = false;

  /**
   * Specifies the value granularity.
   */
  @Prop() step = 1;

  /**
   * If `true`, tick marks are displayed based on the step value.
   * Only applies when `snaps` is `true`.
   */
  @Prop() ticks = true;

  /**
   * The start position of the range active bar. This feature is only available with a single knob (dualKnobs="false").
   * Valid values are greater than or equal to the min value and less than or equal to the max value.
   */
  @Prop({ mutable: true }) activeBarStart?: number;
  @Watch('activeBarStart')
  protected activeBarStartChanged() {
    const { activeBarStart } = this;
    if (activeBarStart !== undefined) {
      if (activeBarStart > this.max) {
        printIonWarning(
          `Range: The value of activeBarStart (${activeBarStart}) is greater than the max (${this.max}). Valid values are greater than or equal to the min value and less than or equal to the max value.`,
          this.el
        );
        this.activeBarStart = this.max;
      } else if (activeBarStart < this.min) {
        printIonWarning(
          `Range: The value of activeBarStart (${activeBarStart}) is less than the min (${this.min}). Valid values are greater than or equal to the min value and less than or equal to the max value.`,
          this.el
        );
        this.activeBarStart = this.min;
      }
    }
  }

  /**
   * If `true`, the user cannot interact with the range.