@warp-ds/elements 2.10.0-next.15 → 2.10.0-next.18

package/dist/packages/slider/slider.react.stories.d.ts

@@ -1,6 +1,6 @@
-import { StoryObj } from '@storybook/react';
-import React from 'react';
-import { Slider } from './react';
+import { StoryObj } from "@storybook/react";
+import React from "react";
+import { Slider } from "./react";
 declare const _default: {
     title: string;
     component: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<import("./slider").WarpSlider>, "fieldset" | "label" | "disabled" | "invalid" | "helpText" | "max" | "min" | "required" | "step" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "updated" | "render" | "renderOptions" | "suffix" | "error" | "openEnded" | "markers" | "valueFormatter" | "tooltipFormatter" | "labelFormatter" | "hiddenTextfield" | "_invalidMessage" | "_hasInternalError" | "_showError" | "_tabbableElements" | "edgeMin" | "edgeMax" | "componentHasError" | "errorText"> & {} & Partial<Omit<import("./slider").WarpSlider, keyof HTMLElement>> & React.RefAttributes<import("./slider").WarpSlider>, "ref">, "help-text" | "open-ended" | "hidden-textfield"> & {

package/dist/packages/slider/slider.react.stories.js

@@ -1,11 +1,11 @@
-import React, { useState } from 'react';
-import { Slider, SliderThumb } from './react';
-const locale = 'nb';
+import React, { useState } from "react";
+import { Slider, SliderThumb } from "./react";
+const locale = "nb";
 const getNumberFormatter = (locale, opts = {}) => {
     return (value) => new Intl.NumberFormat(locale, { maximumFractionDigits: 0, ...opts }).format(value);
 };
 export default {
-    title: 'Forms/Slider and Range Slider',
+    title: "Forms/Slider and Range Slider",
     component: Slider,
 };
 export const Single = {
@@ -24,7 +24,7 @@ export const Range = {
 // Take a suffix attribute on `<Slider>` I think, have `<SliderThumb>` get from that.
 export const SuffixSquareMeters = {
     args: {
-        suffix: 'm²',
+        suffix: "m²",
     },
     render({ suffix }) {
         return (React.createElement(Slider, { label: "Apartment size", min: "0", max: "250", suffix: suffix },
@@ -34,14 +34,14 @@ export const SuffixSquareMeters = {
 };
 export const SuffixCurrency = {
     args: {
-        suffix: 'kr',
+        suffix: "kr",
     },
     render({ suffix }) {
         const numberFormatter = getNumberFormatter(locale);
-        const min = '0';
-        const max = '250000';
+        const min = "0";
+        const max = "250000";
         return (React.createElement(Slider, { label: "Price", min: min, max: max, suffix: suffix, labelFormatter: (slot) => {
-                if (slot === 'from') {
+                if (slot === "from") {
                     return min;
                 }
                 return numberFormatter(max);
@@ -52,14 +52,14 @@ export const SuffixCurrency = {
 };
 export const SuffixKilometers = {
     args: {
-        suffix: 'km',
+        suffix: "km",
     },
     render({ suffix }) {
         const numberFormatter = getNumberFormatter(locale);
-        const min = '0';
-        const max = '250000';
+        const min = "0";
+        const max = "250000";
         return (React.createElement(Slider, { label: "Distance", min: "0", max: "250000", suffix: suffix, labelFormatter: (slot) => {
-                if (slot === 'from') {
+                if (slot === "from") {
                     return min;
                 }
                 return numberFormatter(max);
@@ -69,10 +69,7 @@ export const SuffixKilometers = {
     },
 };
 export const Marks = {
-    args: {
-        suffix: 'km',
-    },
-    render({ suffix }) {
+    render() {
         return (React.createElement(React.Fragment, null,
             React.createElement(Slider, { label: "Single", min: "0", max: "100", markers: 5, step: 5 },
                 React.createElement(SliderThumb, { name: "value" }))));
@@ -89,33 +86,33 @@ export const Step = {
 };
 export const OpenEnded = {
     render() {
-        const [openEndedFrom, setOpenEndedFrom] = useState('');
-        const [openEndedTo, setOpenEndedTo] = useState('');
+        const [openEndedFrom, setOpenEndedFrom] = useState("");
+        const [openEndedTo, setOpenEndedTo] = useState("");
         return (React.createElement(React.Fragment, null,
             React.createElement("form", { id: "openEnded", style: { marginBottom: 16 }, lang: "nb", onInput: (val) => {
                     const formData = new FormData(val.currentTarget);
-                    setOpenEndedFrom(formData.get('from'));
-                    setOpenEndedTo(formData.get('to'));
+                    setOpenEndedFrom(formData.get("from"));
+                    setOpenEndedTo(formData.get("to"));
                 } },
                 React.createElement(Slider, { label: "Produksjons\u00E5r", min: "1950", max: "2025", "data-testid": "overunder", labelFormatter: (slot) => {
-                        if (slot === 'from') {
-                            return 'Før 1950';
+                        if (slot === "from") {
+                            return "Før 1950";
                         }
-                        return '2025 +';
+                        return "2025 +";
                     }, valueFormatter: (value, slot) => {
-                        if (slot === 'from' && value === '') {
-                            return 'Min';
+                        if (slot === "from" && value === "") {
+                            return "Min";
                         }
-                        if (slot === 'to' && value === '') {
-                            return 'Max';
+                        if (slot === "to" && value === "") {
+                            return "Max";
                         }
                         return value;
                     } },
                     React.createElement(SliderThumb, { slot: "from", "aria-label": "Fra \u00E5r", name: "from", value: openEndedFrom }),
                     React.createElement(SliderThumb, { slot: "to", "aria-label": "Til \u00E5r", name: "to", value: openEndedTo })),
                 React.createElement("button", { type: "button", onClick: () => {
-                        setOpenEndedFrom('');
-                        setOpenEndedTo('');
+                        setOpenEndedFrom("");
+                        setOpenEndedTo("");
                     } }, "What's button type reset lol")),
             React.createElement("p", null, "Drag the slider to show the value below. See the Code tab for how to format the labels."),
             React.createElement("output", null,
@@ -143,13 +140,13 @@ export const RangeError = {
 };
 export const TestCase = {
     render() {
-        const [fromValue, setFromValue] = useState('0');
-        const [toValue, setToValue] = useState('150000');
+        const [fromValue, setFromValue] = useState("0");
+        const [toValue, setToValue] = useState("150000");
         return (React.createElement(React.Fragment, null,
             React.createElement("form", { id: "overunder", style: { marginBottom: 16 }, lang: "nb", onInput: (val) => {
                     const formData = new FormData(val.currentTarget);
-                    setFromValue(formData.get('from'));
-                    setToValue(formData.get('to'));
+                    setFromValue(formData.get("from"));
+                    setToValue(formData.get("to"));
                 } },
                 React.createElement(Slider, { label: "Pris", min: "0", max: "700000" },
                     React.createElement(SliderThumb, { slot: "from", "aria-label": "Fra pris", name: "from", value: fromValue }),

package/dist/packages/slider/slider.react.test.js

@@ -1,7 +1,7 @@
-import { describeReactSsrAttributeMapping } from '../../tests/react-ssr-attributes';
-import { Slider } from './react.js';
-describeReactSsrAttributeMapping('Slider', Slider, [
-    { propName: 'openEnded', attrName: 'open-ended' },
-    { propName: 'helpText', attrName: 'help-text', value: 'Help text' },
-    { propName: 'hiddenTextfield', attrName: 'hidden-textfield' },
+import { describeReactSsrAttributeMapping } from "../../tests/react-ssr-attributes";
+import { Slider } from "./react.js";
+describeReactSsrAttributeMapping("Slider", Slider, [
+    { propName: "openEnded", attrName: "open-ended" },
+    { propName: "helpText", attrName: "help-text", value: "Help text" },
+    { propName: "hiddenTextfield", attrName: "hidden-textfield" },
 ]);

package/dist/packages/slider/slider.stories.d.ts

@@ -1,10 +1,10 @@
-import type { Meta, StoryObj } from '@storybook/web-components-vite';
-import 'virtual:uno.css';
-import '../affix/affix.js';
-import '../attention/attention.js';
-import '../textfield/textfield.js';
-import './slider.js';
-import '../slider-thumb/slider-thumb.js';
+import type { Meta, StoryObj } from "@storybook/web-components-vite";
+import "virtual:uno.css";
+import "../affix/affix.js";
+import "../attention/attention.js";
+import "../textfield/textfield.js";
+import "./slider.js";
+import "../slider-thumb/slider-thumb.js";
 declare const meta: Meta;
 export default meta;
 type Story = StoryObj;