1 files changed, 42 insertions, 0 deletions
diff --git a/toolkit/components/reader/moz-slider.stories.mjs b/toolkit/components/reader/moz-slider.stories.mjs
new file mode 100644
index 0000000000..3f4083439c
--- /dev/null
+++ b/toolkit/components/reader/moz-slider.stories.mjs
@@ -0,0 +1,42 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+import { html } from "../../content/widgets/vendor/lit.all.mjs";
+// eslint-disable-next-line import/no-unassigned-import
+import "chrome://global/content/reader/moz-slider.mjs";
+
+export default {
+  title: "Domain-specific UI Widgets/Reader View/Slider",
+  component: "moz-slider",
+  argTypes: {},
+  parameters: {
+    status: "stable",
+    fluent: `moz-slider-label =
+      .label = Slider test
+      `,
+  },
+};
+
+const Template = ({ min, max, value, ticks, labelL10nId, sliderIcon }) => html`
+  <moz-slider
+    min=${min}
+    max=${max}
+    value=${value}
+    ticks=${ticks}
+    tick-labels='["Narrow", "Wide"]'
+    data-l10n-id=${labelL10nId}
+    data-l10n-attrs="label"
+    slider-icon=${sliderIcon}
+  ></moz-slider>
+`;
+
+export const Default = Template.bind({});
+Default.args = {
+  min: 0,
+  max: 4,
+  value: 2,
+  ticks: 9,
+  labelL10nId: "moz-slider-label",
+  sliderIcon: "chrome://global/skin/icons/defaultFavicon.svg",
+};