toolkit/components/reader/moz-slider.stories.mjs

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this
   3  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 import { html } from "../../content/widgets/vendor/lit.all.mjs";
   6 import "chrome://global/content/reader/moz-slider.mjs";
   7
   8 export default {
   9   title: "Domain-specific UI Widgets/Reader View/Slider",
  10   component: "moz-slider",
  11   argTypes: {},
  12   parameters: {
  13     status: "stable",
  14     fluent: `moz-slider-label =
  15       .label = Slider test
  16       `,
  17   },
  18 };
  19
  20 const Template = ({ min, max, value, ticks, labelL10nId, sliderIcon }) => html`
  21   <moz-slider
  22     min=${min}
  23     max=${max}
  24     value=${value}
  25     ticks=${ticks}
  26     tick-labels='["Narrow", "Wide"]'
  27     data-l10n-id=${labelL10nId}
  28     data-l10n-attrs="label"
  29     slider-icon=${sliderIcon}
  30   ></moz-slider>
  31 `;
  32
  33 export const Default = Template.bind({});
  34 Default.args = {
  35   min: 0,
  36   max: 4,
  37   value: 2,
  38   ticks: 9,
  39   labelL10nId: "moz-slider-label",
  40   sliderIcon: "chrome://global/skin/icons/defaultFavicon.svg",
  41 };