igniteui-webcomponents 4.7.0 → 4.8.0

package/components/slider/range-slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"range-slider.js","sourceRoot":"","sources":["../../../src/components/slider/range-slider.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { styleMap } from 'lit/directives/style-map.js';\n\nimport { IgcSliderBaseComponent } from './slider-base.js';\nimport IgcSliderLabelComponent from './slider-label.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\n\n/* blazorSuppress */\nexport interface IgcRangeSliderValue {\n  lower: number;\n  upper: number;\n}\n\nexport interface IgcRangeSliderEventMap {\n  /**\n   * Emitted when a value is changed via thumb drag or keyboard interaction.\n   */\n  igcInput: CustomEvent<IgcRangeSliderValue>;\n  /**\n   * Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n   */\n  igcChange: CustomEvent<IgcRangeSliderValue>;\n}\n\n/**\n * A range slider component used to select two numeric values within a range.\n *\n * @element igc-range-slider\n *\n * @fires igcInput - Emitted when a value is changed via thumb drag or keyboard interaction.\n * @fires igcChange - Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n *\n * @csspart base - The base wrapper of the slider.\n * @csspart ticks - The ticks container.\n * @csspart tick-group - The tick group container.\n * @csspart tick - The tick element.\n * @csspart tick-label - The tick label element.\n * @csspart tick-label-inner - The inner element of the tick label.\n * @csspart thumbs - The thumbs container.\n * @csspart thumb - The thumb element.\n * @csspart thumb-label - The thumb tooltip label container.\n * @csspart thumb-label-inner - The thumb tooltip label inner element.\n * @csspart track - The track container.\n * @csspart steps - The track steps element.\n * @csspart inactive - The inactive element of the track.\n * @csspart fill - The filled part of the track.\n */\nexport default class IgcRangeSliderComponent extends EventEmitterMixin<\n  IgcRangeSliderEventMap,\n  Constructor<IgcSliderBaseComponent>\n>(IgcSliderBaseComponent) {\n  public static readonly tagName = 'igc-range-slider';\n\n  public static register() {\n    registerComponent(this, IgcSliderLabelComponent);\n  }\n\n  @query(`#thumbFrom`)\n  private thumbFrom!: HTMLElement;\n\n  @query(`#thumbTo`)\n  private thumbTo!: HTMLElement;\n\n  private _lower = 0;\n  private _upper = 0;\n\n  public set lower(val: number) {\n    const oldVal = this._lower;\n    this._lower = this.validateValue(val);\n    this.requestUpdate('lower', oldVal);\n  }\n\n  /**\n   * The current value of the lower thumb.\n   * @attr\n   */\n  @property({ type: Number })\n  public get lower(): number {\n    return this._lower;\n  }\n\n  public set upper(val: number) {\n    const oldVal = this._upper;\n    this._upper = this.validateValue(val);\n    this.requestUpdate('upper', oldVal);\n  }\n\n  /**\n   * The current value of the upper thumb.\n   * @attr\n   */\n  @property({ type: Number })\n  public get upper(): number {\n    return this._upper;\n  }\n\n  /**\n   * The aria label of the lower thumb.\n   * @attr aria-label-lower\n   */\n  @property({ attribute: 'aria-label-lower' })\n  public ariaLabelLower!: string;\n\n  /**\n   * The aria label of the upper thumb.\n   * @attr aria-label-upper\n   */\n  @property({ attribute: 'aria-label-upper' })\n  public ariaLabelUpper!: string;\n\n  protected override get activeValue(): number {\n    return this.activeThumb === this.thumbFrom ? this.lower : this.upper;\n  }\n\n  protected override normalizeValue(): void {\n    this._lower = this.validateValue(this._lower);\n    this._upper = this.validateValue(this._upper);\n  }\n\n  protected override getTrackStyle() {\n    const toPosition = this.valueToFraction(this.upper);\n    const fromPosition = this.valueToFraction(this.lower);\n    const positionGap = toPosition - fromPosition;\n\n    const filledTrackStyle = {\n      width: `${positionGap * 100}%`,\n      insetInlineStart: `${fromPosition * 100}%`,\n    };\n\n    return filledTrackStyle;\n  }\n\n  private closestTo(goal: number, positions: number[]): number {\n    return positions.reduce((previous, current) =>\n      Math.abs(goal - current) < Math.abs(goal - previous) ? current : previous\n    );\n  }\n\n  protected override closestHandle(event: PointerEvent): HTMLElement {\n    const fromOffset =\n      this.thumbFrom.offsetLeft + this.thumbFrom.offsetWidth / 2;\n    const toOffset = this.thumbTo.offsetLeft + this.thumbTo.offsetWidth / 2;\n    const xPointer = event.clientX - this.getBoundingClientRect().left;\n    const match = this.closestTo(xPointer, [fromOffset, toOffset]);\n\n    if (fromOffset === toOffset && toOffset < xPointer) {\n      return this.thumbTo;\n    } else if (fromOffset === toOffset && toOffset > xPointer) {\n      return this.thumbFrom;\n    } else if (match === fromOffset) {\n      return this.thumbFrom;\n    } else {\n      return this.thumbTo;\n    }\n  }\n\n  protected override updateValue(increment: number) {\n    const oldValue = this.activeValue;\n\n    let lower = this.lower;\n    let upper = this.upper;\n\n    if (this.activeThumb === this.thumbFrom) {\n      lower += increment;\n    } else {\n      upper += increment;\n    }\n\n    if (lower >= upper) {\n      this.swapValues(lower, upper);\n      this.toggleActiveThumb();\n    } else {\n      if (this.activeThumb === this.thumbFrom) {\n        this.lower = lower;\n      } else {\n        this.upper = upper;\n      }\n    }\n\n    if (oldValue === this.activeValue) {\n      return false;\n    }\n\n    this.emitInputEvent();\n    return true;\n  }\n\n  protected override emitInputEvent() {\n    this.emitEvent('igcInput', {\n      detail: { lower: this.lower, upper: this.upper },\n    });\n  }\n\n  protected override emitChangeEvent() {\n    this.emitEvent('igcChange', {\n      detail: { lower: this.lower, upper: this.upper },\n    });\n  }\n\n  private swapValues(lower: number, upper: number) {\n    this.lower = upper;\n    this.upper = lower;\n  }\n\n  private toggleActiveThumb() {\n    const thumb =\n      this.activeThumb === this.thumbFrom ? this.thumbTo : this.thumbFrom;\n    thumb.focus();\n  }\n\n  private handleFocus(ev: Event) {\n    this.activeThumb = ev.target as HTMLElement;\n    const thumbId = this.activeThumb?.id;\n    const thumbs = this.shadowRoot?.querySelectorAll('div[part=\"thumb\"]');\n\n    thumbs?.forEach((t) => {\n      if (t.id !== thumbId) {\n        const activeThumbVal = parseFloat(this.activeThumb!.ariaValueNow!);\n        const thumbVal = parseFloat(t.ariaValueNow!);\n        const rangeFrom = Math.min(activeThumbVal, thumbVal);\n        const rangeTo = Math.max(activeThumbVal, thumbVal);\n\n        this.activeThumb?.setAttribute(\n          'aria-valuetext',\n          `${this.formatValue(rangeFrom)} - ${this.formatValue(rangeTo)}`\n        );\n      }\n    });\n  }\n\n  protected override renderThumb(\n    value: number,\n    ariaLabel?: string,\n    thumbId?: string\n  ) {\n    const percent = `${this.valueToFraction(value) * 100}%`;\n    const ariaValueText =\n      thumbId === 'thumbFrom' ? `min ${this.lower}` : `max ${this.upper}`;\n\n    const textValue = this.labels\n      ? this.labels[value]\n      : this.valueFormat || this.valueFormatOptions\n        ? this.formatValue(value)\n        : ariaValueText;\n\n    return html`\n      <div\n        part=\"thumb\"\n        id=${ifDefined(thumbId)}\n        tabindex=${this.disabled ? -1 : 0}\n        style=${styleMap({ insetInlineStart: percent })}\n        role=\"slider\"\n        aria-valuemin=${this.actualMin}\n        aria-valuemax=${this.actualMax}\n        aria-valuenow=${value}\n        aria-valuetext=${ifDefined(textValue)}\n        aria-label=${ifDefined(ariaLabel)}\n        aria-disabled=${this.disabled ? 'true' : 'false'}\n        @pointerenter=${this.handleThumbPointerEnter}\n        @pointerleave=${this.handleThumbPointerLeave}\n        @focus=${(ev: Event) => this.handleFocus(ev)}\n        @blur=${() => (\n          this.activeThumb?.part.remove('focused'),\n          (this.activeThumb = undefined)\n        )}\n      ></div>\n      ${this.hideTooltip\n        ? html``\n        : html`\n            <div\n              part=\"thumb-label\"\n              style=${styleMap({\n                opacity: this.thumbLabelsVisible ? '1' : '0',\n                insetInlineStart: percent,\n              })}\n            >\n              <div part=\"thumb-label-inner\">\n                ${this.labels ? this.labels[value] : this.formatValue(value)}\n              </div>\n            </div>\n          `}\n    `;\n  }\n\n  protected override renderThumbs() {\n    return html`${this.renderThumb(\n      this.lower,\n      this.ariaLabelLower,\n      'thumbFrom'\n    )}\n    ${this.renderThumb(this.upper, this.ariaLabelUpper, 'thumbTo')}`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-range-slider': IgcRangeSliderComponent;\n  }\n}\n"]}
+{"version":3,"file":"range-slider.js","sourceRoot":"","sources":["../../../src/components/slider/range-slider.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { styleMap } from 'lit/directives/style-map.js';\n\nimport { IgcSliderBaseComponent } from './slider-base.js';\nimport IgcSliderLabelComponent from './slider-label.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { asNumber, asPercent } from '../common/util.js';\n\n/* blazorSuppress */\nexport interface IgcRangeSliderValue {\n  lower: number;\n  upper: number;\n}\n\nexport interface IgcRangeSliderEventMap {\n  /**\n   * Emitted when a value is changed via thumb drag or keyboard interaction.\n   */\n  igcInput: CustomEvent<IgcRangeSliderValue>;\n  /**\n   * Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n   */\n  igcChange: CustomEvent<IgcRangeSliderValue>;\n}\n\n/**\n * A range slider component used to select two numeric values within a range.\n *\n * @element igc-range-slider\n *\n * @fires igcInput - Emitted when a value is changed via thumb drag or keyboard interaction.\n * @fires igcChange - Emitted when a value change is committed on a thumb drag end or keyboard interaction.\n *\n * @csspart base - The base wrapper of the slider.\n * @csspart ticks - The ticks container.\n * @csspart tick-group - The tick group container.\n * @csspart tick - The tick element.\n * @csspart tick-label - The tick label element.\n * @csspart tick-label-inner - The inner element of the tick label.\n * @csspart thumbs - The thumbs container.\n * @csspart thumb - The thumb element.\n * @csspart thumb-label - The thumb tooltip label container.\n * @csspart thumb-label-inner - The thumb tooltip label inner element.\n * @csspart track - The track container.\n * @csspart steps - The track steps element.\n * @csspart inactive - The inactive element of the track.\n * @csspart fill - The filled part of the track.\n */\nexport default class IgcRangeSliderComponent extends EventEmitterMixin<\n  IgcRangeSliderEventMap,\n  Constructor<IgcSliderBaseComponent>\n>(IgcSliderBaseComponent) {\n  public static readonly tagName = 'igc-range-slider';\n\n  /* blazorSuppress */\n  public static register() {\n    registerComponent(this, IgcSliderLabelComponent);\n  }\n\n  @query(`#thumbFrom`)\n  private thumbFrom!: HTMLElement;\n\n  @query(`#thumbTo`)\n  private thumbTo!: HTMLElement;\n\n  private _lower = 0;\n  private _upper = 0;\n\n  /**\n   * The current value of the lower thumb.\n   * @attr\n   */\n  @property({ type: Number })\n  public set lower(val: number) {\n    this._lower = this.validateValue(asNumber(val, this._lower));\n  }\n\n  public get lower(): number {\n    return this._lower;\n  }\n\n  /**\n   * The current value of the upper thumb.\n   * @attr\n   */\n  @property({ type: Number })\n  public set upper(val: number) {\n    this._upper = this.validateValue(asNumber(val, this._upper));\n  }\n\n  public get upper(): number {\n    return this._upper;\n  }\n\n  /**\n   * The aria label for the lower thumb.\n   * @attr thumb-label-lower\n   */\n  @property({ attribute: 'thumb-label-lower' })\n  public thumbLabelLower!: string;\n\n  /**\n   * The aria label for the upper thumb.\n   * @attr thumb-label-upper\n   */\n  @property({ attribute: 'thumb-label-upper' })\n  public thumbLabelUpper!: string;\n\n  /**\n   * The aria label of the lower thumb.\n   * @attr aria-label-lower\n   *\n   * @deprecated since v4.8.0. Use the `thumbLabelLower` property instead.\n   */\n  @property({ attribute: 'aria-label-lower' })\n  public set ariaLabelLower(value: string) {\n    this.thumbLabelLower = value;\n  }\n\n  public get ariaLabelLower() {\n    return this.thumbLabelLower;\n  }\n\n  /**\n   * The aria label of the upper thumb.\n   * @attr aria-label-upper\n   *\n   * @deprecated since v4.8.0. Use the `thumbLabelUpper` property instead.\n   */\n  @property({ attribute: 'aria-label-upper' })\n  public set ariaLabelUpper(value: string) {\n    this.thumbLabelUpper = value;\n  }\n\n  public get ariaLabelUpper() {\n    return this.thumbLabelUpper;\n  }\n\n  protected override get activeValue(): number {\n    return this.activeThumb === this.thumbFrom ? this.lower : this.upper;\n  }\n\n  protected override normalizeValue(): void {\n    this._lower = this.validateValue(this._lower);\n    this._upper = this.validateValue(this._upper);\n  }\n\n  protected override getTrackStyle() {\n    const start = asPercent(this.lower - this.min, this.distance);\n    return {\n      insetInlineStart: `${start}%`,\n      width: `${asPercent(this.upper - this.min, this.distance) - start}%`,\n    };\n  }\n\n  private closestTo(goal: number, positions: number[]): number {\n    return positions.reduce((previous, current) =>\n      Math.abs(goal - current) < Math.abs(goal - previous) ? current : previous\n    );\n  }\n\n  protected override closestHandle(event: PointerEvent): HTMLElement {\n    const fromOffset =\n      this.thumbFrom.offsetLeft + this.thumbFrom.offsetWidth / 2;\n    const toOffset = this.thumbTo.offsetLeft + this.thumbTo.offsetWidth / 2;\n    const xPointer = event.clientX - this.getBoundingClientRect().left;\n    const match = this.closestTo(xPointer, [fromOffset, toOffset]);\n\n    if (fromOffset === toOffset && toOffset < xPointer) {\n      return this.thumbTo;\n    } else if (fromOffset === toOffset && toOffset > xPointer) {\n      return this.thumbFrom;\n    } else if (match === fromOffset) {\n      return this.thumbFrom;\n    } else {\n      return this.thumbTo;\n    }\n  }\n\n  protected override updateValue(increment: number) {\n    const oldValue = this.activeValue;\n    const isThumbFromActive = this.activeThumb === this.thumbFrom;\n    let [lower, upper] = [this.lower, this.upper];\n\n    isThumbFromActive ? (lower += increment) : (upper += increment);\n\n    if (lower >= upper) {\n      [this.lower, this.upper] = [upper, lower];\n      this.toggleActiveThumb();\n    } else {\n      isThumbFromActive ? (this.lower = lower) : (this.upper = upper);\n    }\n\n    if (oldValue === this.activeValue) {\n      return false;\n    }\n\n    this.emitInputEvent();\n    return true;\n  }\n\n  protected override emitInputEvent() {\n    this.emitEvent('igcInput', {\n      detail: { lower: this.lower, upper: this.upper },\n    });\n  }\n\n  protected override emitChangeEvent() {\n    this.emitEvent('igcChange', {\n      detail: { lower: this.lower, upper: this.upper },\n    });\n  }\n\n  private toggleActiveThumb() {\n    const thumb =\n      this.activeThumb === this.thumbFrom ? this.thumbTo : this.thumbFrom;\n    thumb.focus();\n  }\n\n  private handleFocus(event: FocusEvent) {\n    this.activeThumb = event.target as HTMLElement;\n    const id = this.activeThumb.id;\n\n    for (const thumb of [this.thumbFrom, this.thumbTo]) {\n      if (thumb.id === id) continue;\n      const [activeValue, thumbVal] = [\n        asNumber(this.activeThumb.ariaValueNow),\n        asNumber(thumb.ariaValueNow),\n      ];\n\n      this.activeThumb.ariaValueText = `${this.formatValue(Math.min(activeValue, thumbVal))} - ${this.formatValue(Math.max(activeValue, thumbVal))}`;\n    }\n  }\n\n  protected override renderThumb(\n    value: number,\n    ariaLabel?: string,\n    thumbId?: string\n  ) {\n    const percent = `${asPercent(value - this.min, this.distance)}%`;\n    const thumbStyles = { insetInlineStart: percent };\n    const tooltipStyles = {\n      insetInlineStart: percent,\n      opacity: this.thumbLabelsVisible ? 1 : 0,\n    };\n    const ariaValueText =\n      thumbId === 'thumbFrom' ? `min ${this.lower}` : `max ${this.upper}`;\n\n    const textValue = this.hasLabels\n      ? this.labels[value]\n      : this.valueFormat || this.valueFormatOptions\n        ? this.formatValue(value)\n        : ariaValueText;\n\n    return html`\n      <div\n        part=\"thumb\"\n        id=${ifDefined(thumbId)}\n        tabindex=${this.disabled ? -1 : 0}\n        style=${styleMap(thumbStyles)}\n        role=\"slider\"\n        aria-valuemin=${this.lowerBound}\n        aria-valuemax=${this.upperBound}\n        aria-valuenow=${value}\n        aria-valuetext=${ifDefined(textValue)}\n        aria-label=${ifDefined(ariaLabel)}\n        aria-disabled=${this.disabled ? 'true' : 'false'}\n        @pointerenter=${this.showThumbLabels}\n        @pointerleave=${this.hideThumbLabels}\n        @focus=${this.handleFocus}\n        @blur=${this.handleThumbBlur}\n      ></div>\n      ${this.hideTooltip\n        ? nothing\n        : html`\n            <div part=\"thumb-label\" style=${styleMap(tooltipStyles)}>\n              <div part=\"thumb-label-inner\">\n                ${this.hasLabels ? this.labels[value] : this.formatValue(value)}\n              </div>\n            </div>\n          `}\n    `;\n  }\n\n  protected override renderThumbs() {\n    return html`${this.renderThumb(\n      this.lower,\n      this.thumbLabelLower,\n      'thumbFrom'\n    )}\n    ${this.renderThumb(this.upper, this.thumbLabelUpper, 'thumbTo')}`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-range-slider': IgcRangeSliderComponent;\n  }\n}\n"]}

package/components/slider/slider-base.d.ts

@@ -1,44 +1,62 @@
 import { LitElement, TemplateResult } from 'lit';
 import { StyleInfo } from 'lit/directives/style-map.js';
 export declare class IgcSliderBaseComponent extends LitElement {
-    static styles: import("lit").CSSResult;
+    static styles: import("lit").CSSResult[];
     protected thumb: HTMLElement;
+    protected base: HTMLDivElement;
     private labelElements;
-    private _lowerBound?;
-    private _upperBound?;
     private _min;
     private _max;
+    private _lowerBound?;
+    private _upperBound?;
     private _step;
     private startValue?;
     private pointerCaptured;
     private thumbHoverTimer;
     protected activeThumb?: HTMLElement;
     protected thumbLabelsVisible: boolean;
-    protected labels?: string[];
-    set min(value: number);
+    protected labels: string[];
+    protected get hasLabels(): boolean;
+    protected get distance(): number;
     /**
      * The minimum value of the slider scale. Defaults to 0.
+     *
+     * If `min` is greater than `max` the call is a no-op.
+     *
+     * If `labels` are provided (projected), then `min` is always set to 0.
+     *
+     * If `lowerBound` ends up being less than than the current `min` value,
+     * it is automatically assigned the new `min` value.
      * @attr
      */
+    set min(value: number);
     get min(): number;
-    set max(value: number);
     /**
      * The maximum value of the slider scale. Defaults to 100.
+     *
+     * If `max` is less than `min` the call is a no-op.
+     *
+     * If `labels` are provided (projected), then `max` is always set to
+     * the number of labels.
+     *
+     * If `upperBound` ends up being greater than than the current `max` value,
+     * it is automatically assigned the new `max` value.
      * @attr
      */
+    set max(value: number);
     get max(): number;
-    set lowerBound(value: number | undefined);
     /**
      * The lower bound of the slider value. If not set, the `min` value is applied.
      * @attr lower-bound
      */
-    get lowerBound(): number | undefined;
-    set upperBound(value: number | undefined);
+    set lowerBound(value: number);
+    get lowerBound(): number;
     /**
      * The upper bound of the slider value. If not set, the `max` value is applied.
      * @attr upper-bound
      */
-    get upperBound(): number | undefined;
+    set upperBound(value: number);
+    get upperBound(): number;
     /**
      * Disables the UI interactions of the slider.
      * @attr
@@ -55,12 +73,15 @@ export declare class IgcSliderBaseComponent extends LitElement {
      * @attr hide-tooltip
      */
     hideTooltip: boolean;
-    set step(value: number);
     /**
      * Specifies the granularity that the value must adhere to.
+     *
      * If set to 0 no stepping is implied and any value in the range is allowed.
+     * If `labels` are provided (projected) then the step is always assumed to be 1 since it is a discrete slider.
+     *
      * @attr
      */
+    set step(value: number);
     get step(): number;
     /**
      * The number of primary ticks. It defaults to 0 which means no primary ticks are displayed.
@@ -107,13 +128,12 @@ export declare class IgcSliderBaseComponent extends LitElement {
      */
     tickLabelRotation: 0 | 90 | -90;
     protected constraintsChange(): void;
-    protected labelsChange(): void;
     constructor();
     private handleArrowKeys;
     private handlePageKeys;
     private handleKeyboardIncrement;
+    private handleKeyUp;
     connectedCallback(): void;
-    protected handleKeyUp(): void;
     protected handleSlotChange(): void;
     protected get activeValue(): number;
     protected normalizeValue(): void;
@@ -122,8 +142,6 @@ export declare class IgcSliderBaseComponent extends LitElement {
     protected renderThumbs(): TemplateResult<1>;
     protected emitInputEvent(): void;
     protected emitChangeEvent(): void;
-    protected get actualMin(): number;
-    protected get actualMax(): number;
     protected validateValue(value: number): number;
     protected formatValue(value: number): string;
     private normalizeByStep;
@@ -131,18 +149,17 @@ export declare class IgcSliderBaseComponent extends LitElement {
     private totalTickCount;
     private tickValue;
     private isPrimary;
-    private showThumbLabels;
-    private hideThumbLabels;
-    private valueInRange;
-    protected valueToFraction(value: number): number;
+    protected showThumbLabels(): void;
+    protected hideThumbLabels(): void;
     private calculateTrackUpdate;
     private updateSlider;
     private pointerDown;
     private pointerMove;
     private lostPointerCapture;
-    protected handleThumbPointerEnter: () => void;
-    protected handleThumbPointerLeave: () => void;
-    protected renderTicks(): TemplateResult<1>[];
+    protected handleThumbFocus(event: FocusEvent): void;
+    protected handleThumbBlur(): void;
+    protected _renderTicks(): Generator<TemplateResult<1>, void, unknown>;
+    protected renderTicks(): TemplateResult<1>;
     protected renderThumb(value: number, ariaLabel?: string, thumbId?: string): TemplateResult<1>;
     private renderSteps;
     protected render(): TemplateResult<1>;