From 3b831268515e165362e0fb6056c98ff2e6746e8f Mon Sep 17 00:00:00 2001 From: Matt Pharoah Date: Mon, 25 Mar 2024 18:22:19 -0400 Subject: [PATCH] Use localization for default tooltip formatter --- src/components/multi-range/multi-range.component.ts | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/components/multi-range/multi-range.component.ts b/src/components/multi-range/multi-range.component.ts index c1f23a33..19ed20ad 100644 --- a/src/components/multi-range/multi-range.component.ts +++ b/src/components/multi-range/multi-range.component.ts @@ -110,7 +110,7 @@ export default class SlMultiRange extends ShoelaceElement implements ShoelaceFor * A function used to format the tooltip's value. The range's value is passed as the first and only argument. The * function should return a string to display in the tooltip. */ - @property({ attribute: false }) tooltipFormatter: (value: number) => string = (value: number) => value.toString(); + @property({ attribute: false }) tooltipFormatter: (value: number) => string; @query('.base') baseDiv: HTMLDivElement; @query('.active-track') activeTrack: HTMLDivElement; @@ -131,6 +131,11 @@ export default class SlMultiRange extends ShoelaceElement implements ShoelaceFor return this.#localize.dir() === 'rtl'; } + constructor() { + super(); + this.tooltipFormatter = this.#localize.number.bind(this.#localize); + } + override render(): unknown { const hasLabel = !!(this.label || this.#hasSlotController.test('label')); const hasHelpText = !!(this.helpText || this.#hasSlotController.test('help-text'));