@bspk/ui 1.1.34 → 1.3.0

package/dist/components/Skeleton/Skeleton.js

@@ -33,29 +33,12 @@ import { cssWithVars } from '../../utils/cwv';
  * @exampleDescription This example shows a skeleton loading state for an image but can be used for any element.
  *
  * @name Skeleton
- * @phase DesignReview
+ * @phase UXReview
  */
-function Skeleton({ width = 100, height = 100, variant = 'rectangular', children = null }) {
+export function Skeleton({ width = 100, height = 100, variant = 'rectangular', children = null }) {
     return children !== null && children !== undefined && children !== false ? (children) : (_jsx("div", { "aria-busy": "true", "aria-label": "Loading", "data-bspk": "skeleton", "data-variant": variant, role: "status", style: cssWithVars({
             '--height': typeof height === 'number' ? `${height}px` : height,
             '--width': typeof width === 'number' ? `${width}px` : width,
         }) }));
 }
-Skeleton.bspkName = 'Skeleton';
-function SkeletonCircular(props) {
-    return _jsx(Skeleton, { ...props, variant: "circular" });
-}
-function SkeletonPhoto(props) {
-    return _jsx(Skeleton, { ...props, variant: "photo" });
-}
-function SkeletonProfile(props) {
-    return _jsx(Skeleton, { ...props, variant: "profile" });
-}
-function SkeletonRectangular(props) {
-    return _jsx(Skeleton, { ...props, variant: "rectangular" });
-}
-function SkeletonThumbnail(props) {
-    return _jsx(Skeleton, { ...props, variant: "thumbnail" });
-}
-export { Skeleton, SkeletonCircular, SkeletonPhoto, SkeletonProfile, SkeletonRectangular, SkeletonThumbnail };
 //# sourceMappingURL=Skeleton.js.map

package/dist/components/Skeleton/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.js","sourceRoot":"","sources":["../../../src/components/Skeleton/Skeleton.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAiC1C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,SAAS,QAAQ,CAAC,EAAE,KAAK,GAAG,GAAG,EAAE,MAAM,GAAG,GAAG,EAAE,OAAO,GAAG,aAAa,EAAE,QAAQ,GAAG,IAAI,EAAiB;IACpG,OAAO,QAAQ,KAAK,IAAI,IAAI,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,KAAK,CAAC,CAAC,CAAC,CACvE,QAAQ,CACX,CAAC,CAAC,CAAC,CACA,2BACc,MAAM,gBACL,SAAS,eACV,UAAU,kBACN,OAAO,EACrB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,WAAW,CAAC;YACf,UAAU,EAAE,OAAO,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,MAAM,IAAI,CAAC,CAAC,CAAC,MAAM;YAC/D,SAAS,EAAE,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,CAAC,KAAK;SAC9D,CAAC,GACJ,CACL,CAAC;AACN,CAAC;AAED,QAAQ,CAAC,QAAQ,GAAG,UAAU,CAAC;AAE/B,SAAS,gBAAgB,CAAC,KAA8C;IACpE,OAAO,KAAC,QAAQ,OAAK,KAAK,EAAE,OAAO,EAAC,UAAU,GAAG,CAAC;AACtD,CAAC;AAED,SAAS,aAAa,CAAC,KAA8C;IACjE,OAAO,KAAC,QAAQ,OAAK,KAAK,EAAE,OAAO,EAAC,OAAO,GAAG,CAAC;AACnD,CAAC;AAED,SAAS,eAAe,CAAC,KAA8C;IACnE,OAAO,KAAC,QAAQ,OAAK,KAAK,EAAE,OAAO,EAAC,SAAS,GAAG,CAAC;AACrD,CAAC;AAED,SAAS,mBAAmB,CAAC,KAA8C;IACvE,OAAO,KAAC,QAAQ,OAAK,KAAK,EAAE,OAAO,EAAC,aAAa,GAAG,CAAC;AACzD,CAAC;AAED,SAAS,iBAAiB,CAAC,KAA8C;IACrE,OAAO,KAAC,QAAQ,OAAK,KAAK,EAAE,OAAO,EAAC,WAAW,GAAG,CAAC;AACvD,CAAC;AAED,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAE,aAAa,EAAE,eAAe,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,CAAC"}
+{"version":3,"file":"Skeleton.js","sourceRoot":"","sources":["../../../src/components/Skeleton/Skeleton.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAmC1C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,MAAM,UAAU,QAAQ,CAAC,EAAE,KAAK,GAAG,GAAG,EAAE,MAAM,GAAG,GAAG,EAAE,OAAO,GAAG,aAAa,EAAE,QAAQ,GAAG,IAAI,EAAiB;IAC3G,OAAO,QAAQ,KAAK,IAAI,IAAI,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,KAAK,CAAC,CAAC,CAAC,CACvE,QAAQ,CACX,CAAC,CAAC,CAAC,CACA,2BACc,MAAM,gBACL,SAAS,eACV,UAAU,kBACN,OAAO,EACrB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,WAAW,CAAC;YACf,UAAU,EAAE,OAAO,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,MAAM,IAAI,CAAC,CAAC,CAAC,MAAM;YAC/D,SAAS,EAAE,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,CAAC,KAAK;SAC9D,CAAC,GACJ,CACL,CAAC;AACN,CAAC"}

package/dist/components/Skeleton/SkeletonExample.d.ts

@@ -1,3 +1,4 @@
-import { ComponentExample } from '../../utils/demo';
 import { SkeletonProps } from '.';
+import { ComponentExample, Preset } from '-/utils/demo';
+export declare const presets: Preset<SkeletonProps>[];
 export declare const SkeletonExample: ComponentExample<SkeletonProps>;

package/dist/components/Skeleton/SkeletonExample.js

@@ -1,31 +1,35 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-/* eslint-disable @cspell/spellchecker */ import { useState, useEffect } from 'react';
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from 'react';
 import { Avatar } from '../Avatar';
 import { ExamplePlaceholder } from '../ExamplePlaceholder';
 import { useTimeout } from '../../hooks/useTimeout';
+export const presets = [
+    {
+        label: 'Loading Transition',
+        propState: {
+            width: '100px',
+            height: '100px',
+        },
+    },
+];
 export const SkeletonExample = {
     render: ({ props, preset, Component }) => {
         if (preset?.label === 'Loading Transition')
-            return _jsx(SkeletonTransition, { ...props, Component: Component });
+            return _jsx(SkeletonTransition, { Component: Component, props: props });
         return _jsx(Component, { ...props });
     },
-    presets: [
-        {
-            label: 'Loading Transition',
-            propState: {
-                width: '100px',
-                height: '100px',
-            },
-        },
-    ],
+    presets,
 };
-function SkeletonTransition({ Component, ...props }) {
-    const loadingTimeout = useTimeout();
+function SkeletonTransition({ Component, props, }) {
     const [loaded, setLoaded] = useState(false);
-    useEffect(() => {
-        setLoaded(false);
-        loadingTimeout.set(() => setLoaded(true), 3000);
-    }, [loadingTimeout, props.variant]);
-    return (_jsx(Component, { ...props, children: loaded && (_jsxs(_Fragment, { children: [props.variant === 'rectangular' && (_jsx(ExamplePlaceholder, { height: props.height, width: props.width })), props.variant === 'circular' && (_jsx(ExamplePlaceholder, { height: props.height, style: { borderRadius: '100%' }, width: props.width })), props.variant === 'photo' && (_jsx(ExamplePlaceholder, { height: props.height, width: props.width, children: "Loaded" })), props.variant === 'profile' && _jsx(Avatar, { color: "red", name: "Bob Boberson" }), props.variant === 'thumbnail' && _jsx(ExamplePlaceholder, { height: props.height, width: props.width })] })) }));
+    useTimeout(() => setLoaded(true), 3000);
+    return (_jsx(Component, { ...props, children: loaded && _jsx(_Fragment, { children: PROP_VARIANT_CHILDREN[props.variant] }) }));
 }
+const PROP_VARIANT_CHILDREN = {
+    rectangular: _jsx(ExamplePlaceholder, { height: "100px", width: "100px" }),
+    circular: _jsx(ExamplePlaceholder, { height: "100px", style: { borderRadius: '100%' }, width: "100px" }),
+    photo: (_jsx(ExamplePlaceholder, { height: "100px", width: "100px", children: "Loaded" })),
+    profile: _jsx(Avatar, { color: "red", name: "Bob Robertson" }),
+    thumbnail: _jsx(ExamplePlaceholder, { height: "100px", width: "100px" }),
+};
 //# sourceMappingURL=SkeletonExample.js.map

package/dist/components/Skeleton/SkeletonExample.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonExample.js","sourceRoot":"","sources":["../../../src/components/Skeleton/SkeletonExample.tsx"],"names":[],"mappings":";AAAA,yCAAyC,CAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtF,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAKhD,MAAM,CAAC,MAAM,eAAe,GAAoC;IAC5D,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,EAAE;QACrC,IAAI,MAAM,EAAE,KAAK,KAAK,oBAAoB;YAAE,OAAO,KAAC,kBAAkB,OAAK,KAAK,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC;QAC3G,OAAO,KAAC,SAAS,OAAK,KAAK,GAAI,CAAC;IACpC,CAAC;IACD,OAAO,EAAE;QACL;YACI,KAAK,EAAE,oBAAoB;YAC3B,SAAS,EAAE;gBACP,KAAK,EAAE,OAAO;gBACd,MAAM,EAAE,OAAO;aAClB;SACJ;KACJ;CACJ,CAAC;AAEF,SAAS,kBAAkB,CAAC,EACxB,SAAS,EACT,GAAG,KAAK,EACwD;IAChE,MAAM,cAAc,GAAG,UAAU,EAAE,CAAC;IACpC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,SAAS,CAAC,GAAG,EAAE;QACX,SAAS,CAAC,KAAK,CAAC,CAAC;QACjB,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,CAAC,CAAC;IACpD,CAAC,EAAE,CAAC,cAAc,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAEpC,OAAO,CACH,KAAC,SAAS,OAAK,KAAK,YACf,MAAM,IAAI,CACP,8BACK,KAAK,CAAC,OAAO,KAAK,aAAa,IAAI,CAChC,KAAC,kBAAkB,IAAC,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,GAAI,CACnE,EACA,KAAK,CAAC,OAAO,KAAK,UAAU,IAAI,CAC7B,KAAC,kBAAkB,IACf,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE,EAC/B,KAAK,EAAE,KAAK,CAAC,KAAK,GACpB,CACL,EACA,KAAK,CAAC,OAAO,KAAK,OAAO,IAAI,CAC1B,KAAC,kBAAkB,IAAC,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,uBAEvC,CACxB,EACA,KAAK,CAAC,OAAO,KAAK,SAAS,IAAI,KAAC,MAAM,IAAC,KAAK,EAAC,KAAK,EAAC,IAAI,EAAC,cAAc,GAAG,EACzE,KAAK,CAAC,OAAO,KAAK,WAAW,IAAI,KAAC,kBAAkB,IAAC,MAAM,EAAE,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,GAAI,IACnG,CACN,GACO,CACf,CAAC;AACN,CAAC"}
+{"version":3,"file":"SkeletonExample.js","sourceRoot":"","sources":["../../../src/components/Skeleton/SkeletonExample.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGhD,MAAM,CAAC,MAAM,OAAO,GAA4B;IAC5C;QACI,KAAK,EAAE,oBAAoB;QAC3B,SAAS,EAAE;YACP,KAAK,EAAE,OAAO;YACd,MAAM,EAAE,OAAO;SAClB;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAoC;IAC5D,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,EAAE;QACrC,IAAI,MAAM,EAAE,KAAK,KAAK,oBAAoB;YAAE,OAAO,KAAC,kBAAkB,IAAC,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,GAAI,CAAC;QAE9G,OAAO,KAAC,SAAS,OAAK,KAAK,GAAI,CAAC;IACpC,CAAC;IACD,OAAO;CACV,CAAC;AAEF,SAAS,kBAAkB,CAAC,EACxB,SAAS,EACT,KAAK,GACiE;IACtE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,UAAU,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,CAAC,CAAC;IAExC,OAAO,CACH,KAAC,SAAS,OAAK,KAAK,YAAG,MAAM,IAAI,4BAAG,qBAAqB,CAAC,KAAM,CAAC,OAA0B,CAAC,GAAI,GAAa,CAChH,CAAC;AACN,CAAC;AAED,MAAM,qBAAqB,GAAuD;IAC9E,WAAW,EAAE,KAAC,kBAAkB,IAAC,MAAM,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,GAAG;IAChE,QAAQ,EAAE,KAAC,kBAAkB,IAAC,MAAM,EAAC,OAAO,EAAC,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE,EAAE,KAAK,EAAC,OAAO,GAAG;IAC9F,KAAK,EAAE,CACH,KAAC,kBAAkB,IAAC,MAAM,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,uBAE3B,CACxB;IACD,OAAO,EAAE,KAAC,MAAM,IAAC,KAAK,EAAC,KAAK,EAAC,IAAI,EAAC,eAAe,GAAG;IACpD,SAAS,EAAE,KAAC,kBAAkB,IAAC,MAAM,EAAC,OAAO,EAAC,KAAK,EAAC,OAAO,GAAG;CACjE,CAAC"}

package/dist/components/Skeleton/Thumbnail.d.ts

@@ -0,0 +1,2 @@
+import { SkeletonProps } from './Skeleton';
+export declare function SkeletonThumbnail(props: Pick<SkeletonProps, 'height' | 'width'>): import("react/jsx-runtime").JSX.Element;

package/dist/components/Skeleton/Thumbnail.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Skeleton } from './Skeleton';
+export function SkeletonThumbnail(props) {
+    return _jsx(Skeleton, { ...props, variant: "thumbnail" });
+}
+//# sourceMappingURL=Thumbnail.js.map

package/dist/components/Skeleton/Thumbnail.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Thumbnail.js","sourceRoot":"","sources":["../../../src/components/Skeleton/Thumbnail.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAiB,MAAM,YAAY,CAAC;AAErD,MAAM,UAAU,iBAAiB,CAAC,KAA8C;IAC5E,OAAO,KAAC,QAAQ,OAAK,KAAK,EAAE,OAAO,EAAC,WAAW,GAAG,CAAC;AACvD,CAAC"}

package/dist/components/Skeleton/index.d.ts

@@ -1 +1,6 @@
 export * from './Skeleton';
+export * from './Circular';
+export * from './Photo';
+export * from './Profile';
+export * from './Rectangular';
+export * from './Thumbnail';

package/dist/components/Skeleton/index.js

@@ -1,2 +1,7 @@
 export * from './Skeleton';
+export * from './Circular';
+export * from './Photo';
+export * from './Profile';
+export * from './Rectangular';
+export * from './Thumbnail';
 //# sourceMappingURL=index.js.map

package/dist/components/Skeleton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Skeleton/index.tsx"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Skeleton/index.tsx"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC"}

package/dist/components/SkeletonText/SkeletonText.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { TxtVariant } from '../../utils/txtVariants';
+import { TxtVariant } from '-/utils/txtVariants';
 export type SkeletonTextProps = {
     /**
      * The variant of the text being loaded.
@@ -42,11 +42,7 @@ export type SkeletonTextProps = {
  * @exampleDescription This example shows a skeleton loading state for some text but can be used for any element.
  *
  * @name SkeletonText
- * @phase DesignReview
+ * @phase UXReview
  */
-declare function SkeletonText({ lines, variant, children }: SkeletonTextProps): string | number | true | Iterable<ReactNode> | import("react/jsx-runtime").JSX.Element;
-declare namespace SkeletonText {
-    var bspkName: string;
-}
-export { SkeletonText };
+export declare function SkeletonText({ lines, variant, children }: SkeletonTextProps): string | number | true | Iterable<ReactNode> | import("react/jsx-runtime").JSX.Element;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/SkeletonText/SkeletonText.js

@@ -19,14 +19,12 @@ import { cssWithVars } from '../../utils/cwv';
  * @exampleDescription This example shows a skeleton loading state for some text but can be used for any element.
  *
  * @name SkeletonText
- * @phase DesignReview
+ * @phase UXReview
  */
-function SkeletonText({ lines = 3, variant, children = null }) {
+export function SkeletonText({ lines = 3, variant, children = null }) {
     return children !== null && children !== undefined && children !== false ? (children) : (_jsx("div", { "aria-busy": "true", "aria-label": "Loading", "data-bspk": "skeleton-text", role: "status", style: cssWithVars({
             '--text-height': `var(--${variant}-size)`,
             '--text-margin': `calc(var(--${variant}-line-height) - var(--${variant}-size))`,
         }), children: [...Array(Math.max(1, lines || 0))].map((_, index) => (_jsx("div", { "data-line": true }, index))) }));
 }
-SkeletonText.bspkName = 'SkeletonText';
-export { SkeletonText };
 //# sourceMappingURL=SkeletonText.js.map

package/dist/components/SkeletonText/SkeletonText.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonText.js","sourceRoot":"","sources":["../../../src/components/SkeletonText/SkeletonText.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AA2B1C;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,SAAS,YAAY,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,OAAO,EAAE,QAAQ,GAAG,IAAI,EAAqB;IAC5E,OAAO,QAAQ,KAAK,IAAI,IAAI,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,KAAK,CAAC,CAAC,CAAC,CACvE,QAAQ,CACX,CAAC,CAAC,CAAC,CACA,2BACc,MAAM,gBACL,SAAS,eACV,eAAe,EACzB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,WAAW,CAAC;YACf,eAAe,EAAE,SAAS,OAAO,QAAQ;YACzC,eAAe,EAAE,cAAc,OAAO,yBAAyB,OAAO,SAAS;SAClF,CAAC,YAED,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CACnD,mCAAoB,KAAK,CAAI,CAChC,CAAC,GACA,CACT,CAAC;AACN,CAAC;AAED,YAAY,CAAC,QAAQ,GAAG,cAAc,CAAC;AAEvC,OAAO,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"SkeletonText.js","sourceRoot":"","sources":["../../../src/components/SkeletonText/SkeletonText.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AA2B1C;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,UAAU,YAAY,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,OAAO,EAAE,QAAQ,GAAG,IAAI,EAAqB;IACnF,OAAO,QAAQ,KAAK,IAAI,IAAI,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,KAAK,CAAC,CAAC,CAAC,CACvE,QAAQ,CACX,CAAC,CAAC,CAAC,CACA,2BACc,MAAM,gBACL,SAAS,eACV,eAAe,EACzB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAE,WAAW,CAAC;YACf,eAAe,EAAE,SAAS,OAAO,QAAQ;YACzC,eAAe,EAAE,cAAc,OAAO,yBAAyB,OAAO,SAAS;SAClF,CAAC,YAED,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CACnD,mCAAoB,KAAK,CAAI,CAChC,CAAC,GACA,CACT,CAAC;AACN,CAAC"}

package/dist/components/SkeletonText/SkeletonTextExample.d.ts

@@ -1,3 +1,4 @@
-import { ComponentExample } from '../../utils/demo';
 import { SkeletonTextProps } from '.';
+import { ComponentExample, Preset } from '-/utils/demo';
+export declare const presets: Preset<SkeletonTextProps>[];
 export declare const SkeletonTextExample: ComponentExample<SkeletonTextProps>;

package/dist/components/SkeletonText/SkeletonTextExample.js

@@ -1,21 +1,22 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-/* eslint-disable @cspell/spellchecker */ import { useState, useEffect } from 'react';
+import { useState, useEffect } from 'react';
 import { useTimeout } from '../../hooks/useTimeout';
+export const presets = [
+    {
+        label: 'Loading Transition',
+        propState: {
+            variant: 'body-base',
+            lines: 3,
+        },
+    },
+];
 export const SkeletonTextExample = {
     render: ({ props, preset, Component }) => {
         if (preset?.label === 'Loading Transition')
             return _jsx(SkeletonTextTransition, { ...props, Component: Component });
         return _jsx(Component, { ...props });
     },
-    presets: [
-        {
-            label: 'Loading Transition',
-            propState: {
-                variant: 'body-base',
-                lines: 3,
-            },
-        },
-    ],
+    presets,
 };
 function SkeletonTextTransition({ Component, ...props }) {
     const loadingTimeout = useTimeout();
@@ -23,6 +24,6 @@ function SkeletonTextTransition({ Component, ...props }) {
     useEffect(() => {
         loadingTimeout.set(() => setLoaded(true), 3000);
     }, [loadingTimeout]);
-    return (_jsx(Component, { ...props, children: loaded && (_jsx("p", { children: "Synergestic actionables turn the ship, or vertical integration, offerings locked and loaded, so get buy-in." })) }));
+    return (_jsx(Component, { ...props, children: loaded && (_jsx("p", { children: "Synergetic actionables turn the ship, or vertical integration, offerings locked and loaded, so get buy-in." })) }));
 }
 //# sourceMappingURL=SkeletonTextExample.js.map

package/dist/components/SkeletonText/SkeletonTextExample.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonTextExample.js","sourceRoot":"","sources":["../../../src/components/SkeletonText/SkeletonTextExample.tsx"],"names":[],"mappings":";AAAA,yCAAyC,CAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEtF,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAKhD,MAAM,CAAC,MAAM,mBAAmB,GAAwC;IACpE,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,EAAE;QACrC,IAAI,MAAM,EAAE,KAAK,KAAK,oBAAoB;YAAE,OAAO,KAAC,sBAAsB,OAAK,KAAK,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC;QAC/G,OAAO,KAAC,SAAS,OAAK,KAAK,GAAI,CAAC;IACpC,CAAC;IACD,OAAO,EAAE;QACL;YACI,KAAK,EAAE,oBAAoB;YAC3B,SAAS,EAAE;gBACP,OAAO,EAAE,WAAW;gBACpB,KAAK,EAAE,CAAC;aACX;SACJ;KACJ;CACJ,CAAC;AAEF,SAAS,sBAAsB,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EAGX;IACG,MAAM,cAAc,GAAG,UAAU,EAAE,CAAC;IACpC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,SAAS,CAAC,GAAG,EAAE;QACX,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,CAAC,CAAC;IACpD,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IACrB,OAAO,CACH,KAAC,SAAS,OAAK,KAAK,YACf,MAAM,IAAI,CACP,sIAGI,CACP,GACO,CACf,CAAC;AACN,CAAC"}
+{"version":3,"file":"SkeletonTextExample.js","sourceRoot":"","sources":["../../../src/components/SkeletonText/SkeletonTextExample.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGhD,MAAM,CAAC,MAAM,OAAO,GAAgC;IAChD;QACI,KAAK,EAAE,oBAAoB;QAC3B,SAAS,EAAE;YACP,OAAO,EAAE,WAA2C;YACpD,KAAK,EAAE,CAAC;SACX;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAwC;IACpE,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,EAAE;QACrC,IAAI,MAAM,EAAE,KAAK,KAAK,oBAAoB;YAAE,OAAO,KAAC,sBAAsB,OAAK,KAAK,EAAE,SAAS,EAAE,SAAS,GAAI,CAAC;QAC/G,OAAO,KAAC,SAAS,OAAK,KAAK,GAAI,CAAC;IACpC,CAAC;IACD,OAAO;CACV,CAAC;AAEF,SAAS,sBAAsB,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EAGX;IACG,MAAM,cAAc,GAAG,UAAU,EAAE,CAAC;IACpC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,SAAS,CAAC,GAAG,EAAE;QACX,cAAc,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,CAAC,CAAC;IACpD,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IACrB,OAAO,CACH,KAAC,SAAS,OAAK,KAAK,YACf,MAAM,IAAI,CACP,qIAGI,CACP,GACO,CACf,CAAC;AACN,CAAC"}

package/dist/components/Slider/Slider.d.ts

@@ -0,0 +1,80 @@
+import './slider.scss';
+import { CommonPropsLibrary } from '-/types/common';
+export type SliderValue = number | [number, number];
+export type SliderProps<Value> = Pick<CommonPropsLibrary, 'disabled' | 'readOnly'> & {
+    /**
+     * The label of the slider.
+     *
+     * @required
+     */
+    label: string;
+    /**
+     * The numerical value of the slider.
+     *
+     * Providing an array of two numbers will create a **range slider**.
+     *
+     * @required
+     */
+    value: Value;
+    /**
+     * Invoked with the new value when value changes.
+     *
+     * @required
+     */
+    onChange: (newValue: Value) => void;
+    /**
+     * The minimum value of the slider.
+     *
+     * @required
+     */
+    min: number;
+    /**
+     * The maximum value of the slider.;
+     *
+     * @required
+     */
+    max: number;
+    /**
+     * Indicates if marks should be displayed on the slider.
+     *
+     * @default false
+     */
+    marks?: boolean;
+    /**
+     * The number that specifies the granularity that the value must adhere to
+     *
+     * @default 1
+     */
+    step?: number;
+    /**
+     * Optional function to format the display of each number.
+     *
+     * Useful for currency, percentages, etc.
+     */
+    formatNumber?: (value: number, context?: 'max' | 'min' | 'rangeEnd' | 'rangeStart') => string;
+    /**
+     * The name of the slider input, useful for form submissions.
+     *
+     * @required
+     */
+    name: string;
+};
+/**
+ * A control element that allows customers to select a value or adjust a setting by moving the handle along a horizontal
+ * track.
+ *
+ * @example
+ *     import { Slider } from '@bspk/ui/Slider';
+ *     import { useState } from 'react';
+ *
+ *     function Example() {
+ *         const [value, setValue] = useState(50);
+ *
+ *         return <Slider value={value} min={0} max={100} label="Slider Example" onChange={setValue} />;
+ *     }
+ *
+ * @name Slider
+ * @phase UXReview
+ */
+export declare function Slider<V = SliderValue>({ value: valueProp, onChange, min, max, label, marks, step, disabled, readOnly, name, formatNumber: formatNumberProp, }: SliderProps<V>): import("react/jsx-runtime").JSX.Element;
+/** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/Slider/Slider.js

@@ -0,0 +1,131 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import './slider.css.js';
+import { useEffect, useRef } from 'react';
+import { SliderIntervalDots } from './SliderIntervalDots';
+import { useNormalizeSliderValue } from './useNormalizeSliderValue';
+import { Txt } from '../Txt';
+/**
+ * A control element that allows customers to select a value or adjust a setting by moving the handle along a horizontal
+ * track.
+ *
+ * @example
+ *     import { Slider } from '@bspk/ui/Slider';
+ *     import { useState } from 'react';
+ *
+ *     function Example() {
+ *         const [value, setValue] = useState(50);
+ *
+ *         return <Slider value={value} min={0} max={100} label="Slider Example" onChange={setValue} />;
+ *     }
+ *
+ * @name Slider
+ * @phase UXReview
+ */
+export function Slider({ value: valueProp, onChange, min, max, label, marks = false, step = 1, disabled = false, readOnly = false, name, formatNumber: formatNumberProp, }) {
+    const value = valueProp || min;
+    const formatNumber = (rawValue, context) => formatNumberProp?.(rawValue, context) || rawValue.toString();
+    const sliderRef = useRef(null);
+    const isDraggingRef = useRef(null);
+    const { normalizeSliderValue } = useNormalizeSliderValue({ min, max, step });
+    const isRange = Array.isArray(value);
+    let val0 = isRange ? value[0] : value;
+    let val1 = isRange ? value[1] : value;
+    // Always show the lower value first
+    if (isRange && val0 > val1) {
+        [val0, val1] = [val1, val0];
+    }
+    const displayValue = isRange
+        ? [formatNumber(val0, 'rangeStart'), formatNumber(val1, 'rangeEnd')].join(' - ')
+        : formatNumber(val0, 'rangeStart');
+    const percent0 = Math.min(Math.max(((val0 - min) / (max - min)) * 100, 0), 100);
+    const percent1 = Math.min(Math.max(((val1 - min) / (max - min)) * 100, 0), 100);
+    const getValueFromPosition = (clientX) => {
+        const slider = sliderRef.current;
+        if (!slider)
+            return min;
+        const { left, width } = slider.getBoundingClientRect();
+        let percent = (clientX - left) / width;
+        percent = Math.max(0, Math.min(1, percent));
+        return normalizeSliderValue(min + percent * (max - min));
+    };
+    const handleMouseMove = (e) => {
+        if (isDraggingRef.current === null || disabled || readOnly)
+            return;
+        const newValue = getValueFromPosition(e.clientX);
+        const normalValue = normalizeSliderValue(newValue);
+        let nextValue = normalValue;
+        if (isRange)
+            nextValue = isDraggingRef.current === 0 ? [normalValue, val1] : [val0, normalValue];
+        onChange(nextValue);
+    };
+    const handleMouseUp = () => {
+        isDraggingRef.current = null;
+        window.removeEventListener('mousemove', handleMouseMove);
+        window.removeEventListener('mouseup', handleMouseUp);
+    };
+    const handleTrackClick = (e) => {
+        if (disabled || readOnly)
+            return;
+        const clickValue = getValueFromPosition(e.clientX);
+        let nextValue = normalizeSliderValue(clickValue);
+        if (isRange) {
+            if (Math.abs(clickValue - val0) < Math.abs(clickValue - val1)) {
+                nextValue = [clickValue, val1];
+                isDraggingRef.current = 0;
+            }
+            else {
+                nextValue = [val0, clickValue];
+                isDraggingRef.current = 1;
+            }
+        }
+        onChange(nextValue);
+    };
+    const handleKnobMouseDown = (knobIndex) => (e) => {
+        if (disabled || readOnly)
+            return;
+        e.stopPropagation();
+        isDraggingRef.current = knobIndex;
+        window.addEventListener('mousemove', handleMouseMove);
+        window.addEventListener('mouseup', handleMouseUp);
+    };
+    const handleKnobKeyDown = (knobIndex) => (e) => {
+        if (disabled || readOnly)
+            return;
+        let newValue = knobIndex === 0 ? val0 : val1;
+        if (e.key === 'ArrowLeft')
+            newValue -= step;
+        else if (e.key === 'ArrowRight')
+            newValue += step;
+        else
+            return;
+        newValue = normalizeSliderValue(newValue);
+        let nextValue = newValue;
+        if (isRange) {
+            if (knobIndex === 0)
+                nextValue = [newValue, val1];
+            else
+                nextValue = [val0, newValue];
+        }
+        onChange(nextValue);
+    };
+    useEffect(() => {
+        return () => {
+            window.removeEventListener('mousemove', handleMouseMove);
+            window.removeEventListener('mouseup', handleMouseUp);
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    return (_jsxs("div", { "data-bspk": "slider", "data-disabled": disabled || undefined, "data-readonly": readOnly || undefined, children: [_jsx("input", { name: name, type: "hidden", value: isRange ? `${val0},${val1}` : val0 }), _jsxs("div", { "data-top-labels": true, children: [_jsx(Txt, { variant: "labels-small", children: label }), _jsx(Txt, { "data-value-label": true, children: displayValue })] }), _jsxs("div", { "data-slider-parent": true, children: [_jsxs("div", { "aria-disabled": disabled || undefined, "aria-label": label, "aria-readonly": readOnly || undefined, "aria-valuemax": max, "aria-valuemin": min, "aria-valuenow": val0, "aria-valuetext": displayValue, "data-slider-body": true, onClick: handleTrackClick, onKeyDown: (e) => {
+                            if (disabled || readOnly)
+                                return;
+                            if (e.key === 'ArrowLeft' || e.key === 'ArrowRight') {
+                                if (!isRange) {
+                                    handleKnobKeyDown(0)(e);
+                                }
+                            }
+                        }, ref: sliderRef, role: "slider", tabIndex: disabled ? -1 : 0, children: [_jsx("div", { "data-slider-background": true }), _jsx("div", { "data-slider-fill": true, style: {
+                                    left: isRange ? `${percent0}%` : '0%',
+                                    width: isRange ? `${percent1 - percent0}%` : `${percent0}%`,
+                                } }), marks && (_jsx(SliderIntervalDots, { max: max, min: min, step: step, value: isRange ? [val0, val1] : val0 }))] }), isRange && (_jsx("div", { "aria-label": `${label} start`, "aria-valuemax": max, "aria-valuemin": min, "aria-valuenow": val0, "aria-valuetext": val0.toString(), "data-slider-knob": true, onKeyDown: handleKnobKeyDown(0), onMouseDown: handleKnobMouseDown(0), role: "slider", style: { left: `calc(${percent0}% - 8px)` }, tabIndex: disabled ? -1 : 0 })), _jsx("div", { "aria-label": isRange ? `${label} end` : label, "aria-valuemax": max, "aria-valuemin": min, "aria-valuenow": val1, "aria-valuetext": val1?.toString(), "data-slider-knob": true, onKeyDown: handleKnobKeyDown(isRange ? 1 : 0), onMouseDown: handleKnobMouseDown(isRange ? 1 : 0), role: "slider", style: { left: `calc(${percent1}% - 8px)` }, tabIndex: disabled ? -1 : 0 })] }), _jsxs("div", { "data-bottom-labels": true, children: [_jsx(Txt, { "data-min-label": true, variant: "body-small", children: formatNumber(min, 'min') }), _jsx(Txt, { "data-max-label": true, variant: "body-small", children: formatNumber(max, 'max') })] })] }));
+}
+//# sourceMappingURL=Slider.js.map

package/dist/components/Slider/Slider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"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"}

package/dist/components/Slider/SliderExample.d.ts

@@ -0,0 +1,3 @@
+import { SliderProps } from './Slider';
+import { ComponentExample } from '-/utils/demo';
+export declare const SliderExample: ComponentExample<SliderProps<number | [number, number]>>;

package/dist/components/Slider/SliderExample.js

@@ -0,0 +1,62 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+export const SliderExample = {
+    // containerStyle: { width: '100%' },
+    render: ({ props, Component }) => {
+        const SliderDemo = (sliderProps) => {
+            const initialValue = Array.isArray(sliderProps.value)
+                ? sliderProps.value
+                : typeof sliderProps.value === 'number'
+                    ? sliderProps.value
+                    : 0;
+            const [value, setValue] = useState(initialValue);
+            return _jsx(Component, { ...sliderProps, onChange: setValue, value: value });
+        };
+        return _jsx(SliderDemo, { ...props, max: props.max || 100, min: props.min || 0, value: props.value || 50 });
+    },
+    presets: [
+        {
+            label: 'Basic Slider',
+            propState: {
+                label: 'Basic option',
+                min: 20,
+                max: 80,
+                step: 1,
+                value: 30,
+                formatNumber: (num) => `$${num}`,
+                name: 'basic-slider',
+            },
+        },
+        {
+            label: 'Range Slider',
+            propState: {
+                label: 'Range option',
+                min: 0,
+                max: 100,
+                step: 1,
+                value: [70, 80],
+                formatNumber: (num) => {
+                    return `${num}%`;
+                },
+                name: 'range-slider',
+            },
+        },
+        {
+            label: 'Undefined Value',
+            propState: {
+                label: 'undefined',
+                min: 50,
+                max: 150,
+                step: 1,
+                value: null,
+                formatNumber: (num, context) => {
+                    if (context === 'max')
+                        return `${num}% Passing`;
+                    return `${num}%`;
+                },
+                name: 'undefined-slider',
+            },
+        },
+    ],
+};
+//# sourceMappingURL=SliderExample.js.map

package/dist/components/Slider/SliderExample.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderExample.js","sourceRoot":"","sources":["../../../src/components/Slider/SliderExample.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAKjC,MAAM,CAAC,MAAM,aAAa,GAA6D;IACnF,qCAAqC;IACrC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;QAC7B,MAAM,UAAU,GAAG,CAAC,WAAmD,EAAE,EAAE;YACvE,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,KAAK,CAAC;gBACjD,CAAC,CAAC,WAAW,CAAC,KAAK;gBACnB,CAAC,CAAC,OAAO,WAAW,CAAC,KAAK,KAAK,QAAQ;oBACrC,CAAC,CAAC,WAAW,CAAC,KAAK;oBACnB,CAAC,CAAC,CAAC,CAAC;YAEV,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;YAEjD,OAAO,KAAC,SAAS,OAAK,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,GAAI,CAAC;QAC5E,CAAC,CAAC;QAEF,OAAO,KAAC,UAAU,OAAK,KAAK,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,IAAI,GAAG,EAAE,GAAG,EAAE,KAAK,CAAC,GAAG,IAAI,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,IAAI,EAAE,GAAI,CAAC;IAC3G,CAAC;IACD,OAAO,EAAE;QACL;YACI,KAAK,EAAE,cAAc;YACrB,SAAS,EAAE;gBACP,KAAK,EAAE,cAAc;gBACrB,GAAG,EAAE,EAAE;gBACP,GAAG,EAAE,EAAE;gBACP,IAAI,EAAE,CAAC;gBACP,KAAK,EAAE,EAAE;gBACT,YAAY,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,GAAG,EAAE;gBAChC,IAAI,EAAE,cAAc;aACvB;SACJ;QACD;YACI,KAAK,EAAE,cAAc;YACrB,SAAS,EAAE;gBACP,KAAK,EAAE,cAAc;gBACrB,GAAG,EAAE,CAAC;gBACN,GAAG,EAAE,GAAG;gBACR,IAAI,EAAE,CAAC;gBACP,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC;gBACf,YAAY,EAAE,CAAC,GAAG,EAAE,EAAE;oBAClB,OAAO,GAAG,GAAG,GAAG,CAAC;gBACrB,CAAC;gBACD,IAAI,EAAE,cAAc;aACvB;SACJ;QACD;YACI,KAAK,EAAE,iBAAiB;YACxB,SAAS,EAAE;gBACP,KAAK,EAAE,WAAW;gBAClB,GAAG,EAAE,EAAE;gBACP,GAAG,EAAE,GAAG;gBACR,IAAI,EAAE,CAAC;gBACP,KAAK,EAAE,IAAmC;gBAC1C,YAAY,EAAE,CAAC,GAAG,EAAE,OAAO,EAAE,EAAE;oBAC3B,IAAI,OAAO,KAAK,KAAK;wBAAE,OAAO,GAAG,GAAG,WAAW,CAAC;oBAChD,OAAO,GAAG,GAAG,GAAG,CAAC;gBACrB,CAAC;gBACD,IAAI,EAAE,kBAAkB;aAC3B;SACJ;KACJ;CACJ,CAAC"}

package/dist/components/Slider/SliderIntervalDots.d.ts

@@ -0,0 +1,6 @@
+import { SliderProps, SliderValue } from './Slider';
+type IntervalDotProps = Pick<SliderProps<SliderValue>, 'max' | 'min' | 'value'> & {
+    step: number;
+};
+export declare function SliderIntervalDots({ step, max, min, value }: IntervalDotProps): import("react/jsx-runtime").JSX.Element[] | null;
+export {};

package/dist/components/Slider/SliderIntervalDots.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export function SliderIntervalDots({ step, max, min, value }) {
+    if (step <= 0)
+        return null;
+    const count = Math.floor((max - min) / step);
+    const dots = [];
+    for (let i = 1; i < count; i++) {
+        const pointValue = i * step;
+        const percent = (pointValue / (max - min)) * 100;
+        dots.push(_jsx("div", { "data-filled-section": typeof value === 'number'
+                ? pointValue < value
+                    ? ''
+                    : undefined
+                : pointValue < value[0]
+                    ? ''
+                    : undefined, "data-interval-dot": true, style: { left: `${percent}%` } }, i));
+    }
+    return dots;
+}
+//# sourceMappingURL=SliderIntervalDots.js.map

package/dist/components/Slider/SliderIntervalDots.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SliderIntervalDots.js","sourceRoot":"","sources":["../../../src/components/Slider/SliderIntervalDots.tsx"],"names":[],"mappings":";AAMA,MAAM,UAAU,kBAAkB,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAoB;IAC1E,IAAI,IAAI,IAAI,CAAC;QAAE,OAAO,IAAI,CAAC;IAE3B,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,IAAI,CAAC,CAAC;IAC7C,MAAM,IAAI,GAAG,EAAE,CAAC;IAEhB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC;QAC7B,MAAM,UAAU,GAAG,CAAC,GAAG,IAAI,CAAC;QAC5B,MAAM,OAAO,GAAG,CAAC,UAAU,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC,GAAG,GAAG,CAAC;QACjD,IAAI,CAAC,IAAI,CACL,qCAEQ,OAAO,KAAK,KAAK,QAAQ;gBACrB,CAAC,CAAC,UAAU,GAAG,KAAK;oBAChB,CAAC,CAAC,EAAE;oBACJ,CAAC,CAAC,SAAS;gBACf,CAAC,CAAC,UAAU,GAAG,KAAK,CAAC,CAAC,CAAC;oBACrB,CAAC,CAAC,EAAE;oBACJ,CAAC,CAAC,SAAS,6BAIrB,KAAK,EAAE,EAAE,IAAI,EAAE,GAAG,OAAO,GAAG,EAAE,IADzB,CAAC,CAER,CACL,CAAC;IACN,CAAC;IAED,OAAO,IAAI,CAAC;AAChB,CAAC"}

package/dist/components/Slider/index.d.ts

@@ -0,0 +1 @@
+export * from './Slider';

package/dist/components/Slider/index.js

@@ -0,0 +1,2 @@
+export * from './Slider';
+//# sourceMappingURL=index.js.map

package/dist/components/Slider/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Slider/index.tsx"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}