@statistikzh/leu 0.23.0 → 0.24.1

package/.github/workflows/ci.yml

@@ -7,10 +7,10 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v6
 
       - name: Use Node.js
-        uses: actions/setup-node@v4
+        uses: actions/setup-node@v6
         with:
           node-version-file: ".nvmrc"
           cache: "npm"
@@ -25,10 +25,10 @@ jobs:
     needs: lint
 
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v6
 
       - name: Use Node.js
-        uses: actions/setup-node@v4
+        uses: actions/setup-node@v6
         with:
           node-version-file: ".nvmrc"
           cache: "npm"
@@ -47,10 +47,10 @@ jobs:
 
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v6
 
       - name: Use Node.js
-        uses: actions/setup-node@v4
+        uses: actions/setup-node@v6
         with:
           node-version-file: ".nvmrc"
           cache: "npm"
@@ -62,7 +62,7 @@ jobs:
         run: npx playwright install
 
       - name: Cache Playwright binaries
-        uses: actions/cache@v4
+        uses: actions/cache@v5
         with:
           path: ~/.cache/ms-playwright
           key: ${{ runner.os }}-playwright-${{ hashFiles('**/package-lock.json') }}
@@ -75,7 +75,7 @@ jobs:
       - name: Run tests
         run: npm test
 
-      - uses: actions/upload-artifact@v4
+      - uses: actions/upload-artifact@v6
         with:
           name: coverage
           path: coverage/

package/.github/workflows/deploy-github-pages.yaml

@@ -18,10 +18,10 @@ jobs:
     # Job steps
     steps:
       # Manual Checkout
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v6
 
       # Set up Node
-      - uses: actions/setup-node@v4
+      - uses: actions/setup-node@v6
         with:
           node-version-file: ".nvmrc"
           cache: "npm"

package/.github/workflows/publish.yml

@@ -0,0 +1,37 @@
+name: Publish Package to npm
+
+on:
+  workflow_dispatch:
+  push:
+    tags:
+      - "leu-v*"
+
+permissions:
+  id-token: write # Required for OIDC
+  contents: read
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v6
+
+      - uses: actions/setup-node@v6
+        with:
+          node-version-file: ".nvmrc"
+          cache: "npm"
+          registry-url: "https://registry.npmjs.org"
+
+      - name: Clear auth token for OIDC
+        run: echo "NODE_AUTH_TOKEN=" >> $GITHUB_ENV
+
+      - name: Upgrade npm for OIDC
+        run: npm install -g npm@latest
+
+      - run: npm --version
+      - run: npm ci
+      - run: npm run build
+      - name: Publish to npm
+        env:
+          NPM_CONFIG_PROVENANCE: true
+        run: npm publish

package/.github/workflows/release-please.yml

@@ -4,11 +4,10 @@ on:
       - main
 
 permissions:
-  id-token: write
   contents: write
   pull-requests: write
 
-name: Create release and publish to npm
+name: Create release
 
 jobs:
   release-please:
@@ -18,20 +17,3 @@ jobs:
         id: release
         with:
           token: ${{ secrets.RELEASE_PLEASE_TOKEN }}
-      # The logic below handles the npm publication:
-      - uses: actions/checkout@v4
-        # these if statements ensure that a publication only occurs when
-        # a new release is created:
-        if: ${{ steps.release.outputs.release_created }}
-      - uses: actions/setup-node@v4
-        with:
-          node-version-file: ".nvmrc"
-          cache: "npm"
-          registry-url: "https://registry.npmjs.org"
-        if: ${{ steps.release.outputs.release_created }}
-      - run: npm ci
-        if: ${{ steps.release.outputs.release_created }}
-      - run: npm run build
-        if: ${{ steps.release.outputs.release_created }}
-      - run: npm publish --access public
-        if: ${{ steps.release.outputs.release_created }}

package/.release-please-manifest.json

@@ -1,3 +1,3 @@
 {
-  ".": "0.23.0"
+  ".": "0.24.1"
 }

package/CHANGELOG.md

@@ -1,5 +1,31 @@
 # Changelog
 
+## [0.24.1](https://github.com/statistikZH/leu/compare/leu-v0.24.0...leu-v0.24.1) (2026-02-12)
+
+
+### Bug Fixes
+
+* **file-input:** fix import location to avoid circular dependency and ensure lazy registration ([2586597](https://github.com/statistikZH/leu/commit/2586597ecd541bda68e530bbddb559b5cdc71d6d))
+* **range:** move the value state to the component itself ([#330](https://github.com/statistikZH/leu/issues/330)) ([20cca8d](https://github.com/statistikZH/leu/commit/20cca8da00b87d55f71b2aa48eeb3ab3f7abbf05))
+
+## [0.24.0](https://github.com/statistikZH/leu/compare/leu-v0.23.0...leu-v0.24.0) (2026-02-09)
+
+
+### ⚠ BREAKING CHANGES
+
+* **range:** The height of the element changed. When the label was empty it still rendered an empty element. This is now removed. Also the height of the range element was reduced by 4px to match the design specification.
+
+### Features
+
+* **range:** add `hide-label` option to visually hide the label ([b344fa8](https://github.com/statistikZH/leu/commit/b344fa8f47b6b8c221211c5a7f84089762e29092))
+* **range:** add `prefix`, `suffix` and `valueFormatter` properties to customize the value formatting ([b344fa8](https://github.com/statistikZH/leu/commit/b344fa8f47b6b8c221211c5a7f84089762e29092))
+* **range:** add `show-ticks` and `show-range-labels` options to display ticks and the range value labels ([b344fa8](https://github.com/statistikZH/leu/commit/b344fa8f47b6b8c221211c5a7f84089762e29092))
+
+
+### Documentation
+
+* **range:** rename story file to match convention ([b344fa8](https://github.com/statistikZH/leu/commit/b344fa8f47b6b8c221211c5a7f84089762e29092))
+
 ## [0.23.0](https://github.com/statistikZH/leu/compare/leu-v0.22.1...leu-v0.23.0) (2026-01-20)
 
 

package/dist/Accordion.js

@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, nothing } from 'lit';
 import { unsafeStatic, html } from 'lit/static-html.js';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 
 var css_248z = css`:host {
   --accordion-font-regular: var(--leu-font-family-regular);

package/dist/Button.js

@@ -4,7 +4,7 @@ import { classMap } from 'lit/directives/class-map.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { property } from 'lit/decorators.js';
 import { LeuIcon } from './Icon.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { H as HasSlotController } from './hasSlotController-Bm2tipvG.js';
 
 /**

package/dist/ButtonGroup.js

@@ -1,5 +1,5 @@
 import { css, html } from 'lit';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { LeuButton } from './Button.js';
 import './_tslib-CNEFicEt.js';
 import 'lit/directives/class-map.js';

package/dist/ChartWrapper.js

@@ -1,7 +1,7 @@
 import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, nothing, html } from 'lit';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { H as HasSlotController } from './hasSlotController-Bm2tipvG.js';
 import { LeuSpinner } from './Spinner.js';
 

package/dist/Checkbox.js

@@ -1,7 +1,7 @@
 import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, html } from 'lit';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { LeuIcon } from './Icon.js';
 
 var css_248z = css`:host {

package/dist/CheckboxGroup.js

@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, html } from 'lit';
 import { classMap } from 'lit/directives/class-map.js';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { LeuCheckbox } from './Checkbox.js';
 import './Icon.js';
 

package/dist/Chip.js

@@ -1,6 +1,6 @@
 import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { css } from 'lit';
 
 var css_248z = css`:host *::before,

package/dist/ChipGroup.js

@@ -1,7 +1,7 @@
 import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { unsafeStatic, html } from 'lit/static-html.js';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { css } from 'lit';
 import { LeuChipSelectable } from './ChipSelectable.js';
 import './Chip.js';

package/dist/ChipLink.js

@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { html } from 'lit';
 import { property } from 'lit/decorators.js';
 import { LeuChipBase } from './Chip.js';
-import './LeuElement-CWseJvWv.js';
+import './LeuElement-jrR2M5pZ.js';
 
 /**
  * @tagname leu-chip-link

package/dist/ChipRemovable.js

@@ -3,7 +3,7 @@ import { html } from 'lit';
 import { property } from 'lit/decorators.js';
 import { LeuChipBase } from './Chip.js';
 import { LeuIcon } from './Icon.js';
-import './LeuElement-CWseJvWv.js';
+import './LeuElement-jrR2M5pZ.js';
 
 /**
  * @slot - The content of the chip

package/dist/ChipSelectable.js

@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { html } from 'lit';
 import { property } from 'lit/decorators.js';
 import { LeuChipBase } from './Chip.js';
-import './LeuElement-CWseJvWv.js';
+import './LeuElement-jrR2M5pZ.js';
 
 /**
  * A chip component that can be selected.

package/dist/Dialog.js

@@ -3,7 +3,7 @@ import { css, nothing, html } from 'lit';
 import { createRef, ref } from 'lit/directives/ref.js';
 import { classMap } from 'lit/directives/class-map.js';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { H as HasSlotController } from './hasSlotController-Bm2tipvG.js';
 import { LeuIcon } from './Icon.js';
 

package/dist/Dropdown.js

@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, nothing, html } from 'lit';
 import { createRef, ref } from 'lit/directives/ref.js';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { H as HasSlotController } from './hasSlotController-Bm2tipvG.js';
 import { LeuButton } from './Button.js';
 import { LeuMenu } from './Menu.js';

package/dist/FileInput.d.ts

@@ -5,7 +5,6 @@ import { L as LeuElement } from './LeuElement.d-BevHqLUu.js';
 import { LeuButton } from './Button.js';
 import { L as LeuIcon } from './Icon.d-itcQ94ym.js';
 import { LeuVisuallyHidden } from './VisuallyHidden.js';
-import './leu-icon.js';
 
 /**
  * @todo Pluralize text when multiple files are allowed

package/dist/FileInput.js

@@ -3,45 +3,11 @@ import { css, html, nothing } from 'lit';
 import { property, state, query } from 'lit/decorators.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { classMap } from 'lit/directives/class-map.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
-import './Accordion.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { LeuButton } from './Button.js';
-import './ButtonGroup.js';
-import './ChartWrapper.js';
-import './Checkbox.js';
-import './CheckboxGroup.js';
-import './ChipGroup.js';
-import './ChipLink.js';
-import './ChipRemovable.js';
-import './ChipSelectable.js';
-import './Dialog.js';
-import './Dropdown.js';
 import { LeuIcon } from './Icon.js';
-import './Input.js';
-import './Menu.js';
-import './MenuItem.js';
-import './Message.js';
-import './Pagination.js';
-import './Placeholder.js';
-import './Popup.js';
-import './ProgressBar.js';
-import './Radio.js';
-import './RadioGroup.js';
-import './Range.js';
-import './ScrollTop.js';
-import './Select.js';
-import './Spinner.js';
-import './Table.js';
-import './Tag.js';
 import { LeuVisuallyHidden } from './VisuallyHidden.js';
-import './leu-icon.js';
-import 'lit/static-html.js';
 import './hasSlotController-Bm2tipvG.js';
-import './Chip.js';
-import 'lit/directives/ref.js';
-import '@floating-ui/dom';
-import 'lit/directives/live.js';
-import 'lit/directive.js';
 
 var css_248z = css`:host {
   --file-input-font-regular: var(--leu-font-family-regular);

package/dist/Icon.js

@@ -1,7 +1,7 @@
 import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, html, svg } from 'lit';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 
 var css_248z = css`:host {
   display: contents;

package/dist/Input.js

@@ -5,7 +5,7 @@ import { ifDefined } from 'lit/directives/if-defined.js';
 import { live } from 'lit/directives/live.js';
 import { createRef, ref } from 'lit/directives/ref.js';
 import { property, state } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { LeuIcon } from './Icon.js';
 
 var css_248z = css`:host {

package/dist/{LeuElement-CWseJvWv.js → LeuElement-jrR2M5pZ.js}

@@ -35,7 +35,7 @@ class LeuElement extends LitElement {
         }
     }
 }
-LeuElement.version = "0.23.0";
+LeuElement.version = "0.24.1";
 LeuElement.dependencies = {};
 LeuElement.styles = css_248z;
 

package/dist/Menu.js

@@ -1,7 +1,7 @@
 import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, html } from 'lit';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { LeuMenuItem } from './MenuItem.js';
 import 'lit/directives/if-defined.js';
 import './Icon.js';

package/dist/MenuItem.js

@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, html, nothing } from 'lit';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { LeuIcon } from './Icon.js';
 
 var css_248z = css`:host {

package/dist/Message.js

@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, html, nothing } from 'lit';
 import { property } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { LeuIcon } from './Icon.js';
 import { H as HasSlotController } from './hasSlotController-Bm2tipvG.js';
 

package/dist/Pagination.js

@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, html } from 'lit';
 import { live } from 'lit/directives/live.js';
 import { property, state } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { LeuButton } from './Button.js';
 import { LeuVisuallyHidden } from './VisuallyHidden.js';
 import { LeuIcon } from './Icon.js';

package/dist/Placeholder.js

@@ -1,5 +1,5 @@
 import { css, html } from 'lit';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 
 var css_248z = css`:host {
   --placeholder-font-regular: var(--leu-font-family-regular);

package/dist/Popup.js

@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, html } from 'lit';
 import { property } from 'lit/decorators.js';
 import { autoUpdate, offset, size, flip, shift, computePosition } from '@floating-ui/dom';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 
 var css_248z = css`:host {
   --popup-font-regular: var(--leu-font-family-regular);

package/dist/ProgressBar.js

@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, nothing, html } from 'lit';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 
 var css_248z = css`/* :host {
   --progress-bar-font-regular: var(--leu-font-family-regular);

package/dist/Radio.js

@@ -1,7 +1,7 @@
 import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, html } from 'lit';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 
 var css_248z = css`:host {
   --radio-color: var(--leu-color-black-40);

package/dist/RadioGroup.js

@@ -2,7 +2,7 @@ import { _ as __decorate } from './_tslib-CNEFicEt.js';
 import { css, html } from 'lit';
 import { classMap } from 'lit/directives/class-map.js';
 import { property } from 'lit/decorators.js';
-import { L as LeuElement } from './LeuElement-CWseJvWv.js';
+import { L as LeuElement } from './LeuElement-jrR2M5pZ.js';
 import { LeuRadio } from './Radio.js';
 
 var css_248z = css`:host {

package/dist/Range.d.ts

@@ -1,7 +1,9 @@
 import * as lit_html from 'lit-html';
 import * as lit from 'lit';
+import { PropertyValues, nothing } from 'lit';
 import { L as LeuElement } from './LeuElement.d-BevHqLUu.js';
 
+type InternalRangeValue = [number, number] | [number];
 /**
  * @tagname leu-range
  */
@@ -15,41 +17,102 @@ declare class LeuRange extends LeuElement {
         customElements?: CustomElementRegistry;
         registry?: CustomElementRegistry;
     };
+    /**
+     * The default value of the range slider.
+     * String input is parsed as a comma-separated list of numbers.
+     */
     defaultValue: number[];
+    /**
+     * The minimum value of the range slider.
+     */
     min: number;
+    /**
+     * The maximum value of the range slider.
+     */
     max: number;
+    /**
+     * The step size of the range slider.
+     */
     step: number;
     name: string;
+    /**
+     * The label of the range slider.
+     */
     label: string;
+    /**
+     * Whether to hide the label of the range slider.
+     * If true, the label will still be available for screen readers
+     * and is only visually hidden.
+     */
+    hideLabel: boolean;
+    /**
+     * Whether the range slider is disabled.
+     */
     disabled: boolean;
+    /**
+     * Whether to use a range with two handles.
+     */
     multiple: boolean;
+    /**
+     * Wheter to show tick marks below the range slider.
+     * One tick mark per step will be rendered.
+     */
+    showTicks: boolean;
+    /**
+     * Whether to show the min and max labels below the range slider.
+     */
+    showRangeLabels: boolean;
+    /**
+     * A prefix to display before the value in the output element(s).
+     * Is ignored if a custom valueFormatter is provided.
+     */
+    prefix: string;
+    /**
+     * A suffix to display after the value in the output element(s).
+     * Is ignored if a custom valueFormatter is provided.
+     */
+    suffix: string;
+    /**
+     * A custom function to format the value displayed in the output element(s).
+     * If provided, the prefix and suffix properties will be ignored.
+     */
+    valueFormatter?: (value: number) => string;
+    protected _value: InternalRangeValue;
+    /**
+     * The value of the range slider.
+     * String input is parsed as a comma-separated list of numbers.
+     * In multiple mode, if only a single value is provided, the second handle will be set to the minimum value.
+     * In single mode, only the first value will be used.
+     */
+    set value(value: string | number | Array<string | number>);
+    get value(): string;
+    get valueAsArray(): InternalRangeValue;
+    get valueLow(): number;
+    get valueHigh(): number;
+    protected container: HTMLDivElement;
+    protected inputBase: HTMLInputElement;
+    protected inputGhost: HTMLInputElement | null;
+    protected outputBase: HTMLOutputElement;
+    protected outputGhost: HTMLOutputElement | null;
     updated(): void;
-    protected get _inputs(): HTMLInputElement[];
-    protected _updateStyles(): void;
-    get value(): string | Array<string>;
-    /**
-     * Sets the value of the underlying input element(s).
-     * The value has to be an array if "multiple" range is used.
-     * Otherwise it has to be a string.
-     */
-    set value(value: string | Array<string>);
-    get valueAsArray(): number[];
-    get valueLow(): string | number;
-    get valueHigh(): string | number;
-    protected _getBaseInput(): HTMLInputElement;
-    protected _getGhostInput(): HTMLInputElement;
-    protected _handleInput(_index: number, _e: InputEvent & {
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
+    protected updateStyles(): void;
+    protected clampAndRoundValue(value: number): number;
+    protected handleInput(e: Event & {
         target: HTMLInputElement;
     }): void;
-    protected _getNormalizedValue(value: number): number;
-    protected _getNormalizedRange(): number[];
+    protected getNormalizedValue(value: number): number;
+    protected getNormalizedRange(): number[];
     /**
-     * Determine if the "click" (pointer event) is closer the
-     * the value of the other input element. Swap the values if this is the case.
+     * This event handler is only applied to the "base" input element and only when in "multiple" mode.
+     * It handles pointer events on the *track* and the thumb.
+     * This method determines if the interaction was closer to the base or the ghost input.
      */
-    protected _handlePointerDown(e: PointerEvent & {
+    protected handlePointerDown(e: PointerEvent & {
         target: HTMLInputElement;
     }): void;
+    protected formatValue(value: number): string;
+    protected renderTicks(): typeof nothing | lit_html.TemplateResult<1>;
     render(): lit_html.TemplateResult<1>;
 }