etudes 5.0.0 → 5.2.0

package/components/PanoramaSlider.d.ts

@@ -1,4 +1,4 @@
-import React, { type PropsWithChildren } from 'react';
+import { type HTMLAttributes, type PropsWithChildren } from 'react';
 import { type Size } from 'spase';
 import { type PanoramaProps } from './Panorama';
 export type PanoramaSliderProps = PanoramaProps & PropsWithChildren<{
@@ -37,35 +37,35 @@ export type PanoramaSliderProps = PanoramaProps & PropsWithChildren<{
  *                                backing {@link Panorama}.
  * @exports PanoramaSliderTrack The slide track.
  */
-export declare const PanoramaSlider: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & PanoramaProps & {
+export declare const PanoramaSlider: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & PanoramaProps & {
     /**
      * Field-of-view (0.0 - 360.0 degrees, inclusive) that represents the size of
      * the reticle. 360 indicates the reticle covers the entire image. If this is
      * unspecified, the component will attempt to automatically calculate the FOV
      * using the `viewportSize` prop.
      */
-    fov?: number | undefined;
+    fov?: number;
     /**
      * Specifies which length (width or height) should be automatically
      * calculated. The counterpart must be known (if `width` is specified here,
      * the component's height must be known, i.e. it is specified in the CSS).
      * Defaults to `width`.
      */
-    autoDimension?: "width" | "height" | undefined;
+    autoDimension?: "width" | "height";
     /**
      * Size of the viewport that this component is controlling. A viewport can be
      * thought of as a DOM element containing an aspect-filled image. This is used
      * to automatically calculate the FOV if `fov` prop is not specified. If it
      * is, this prop is ignored.
      */
-    viewportSize?: Size | undefined;
+    viewportSize?: Size;
     /**
      * Specifies if the component should use default styles.
      */
-    usesDefaultStyles?: boolean | undefined;
+    usesDefaultStyles?: boolean;
 } & {
-    children?: React.ReactNode;
-} & React.RefAttributes<HTMLDivElement>>;
-export declare const PanoramaSliderTrack: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-export declare const PanoramaSliderReticle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-export declare const PanoramaSliderIndicator: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+    children?: import("react").ReactNode | undefined;
+} & import("react").RefAttributes<HTMLDivElement>>;
+export declare const PanoramaSliderTrack: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const PanoramaSliderReticle: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const PanoramaSliderIndicator: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;

package/components/PanoramaSlider.js

@@ -10,29 +10,6 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -65,8 +42,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PanoramaSliderIndicator = exports.PanoramaSliderReticle = exports.PanoramaSliderTrack = exports.PanoramaSlider = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
 var clsx_1 = __importDefault(require("clsx"));
-var react_1 = __importStar(require("react"));
+var react_1 = require("react");
 var spase_1 = require("spase");
 var useRect_1 = require("../hooks/useRect");
 var utils_1 = require("../utils");
@@ -122,35 +100,28 @@ exports.PanoramaSlider = (0, react_1.forwardRef)(function (_a, ref) {
     });
     var fixedStyles = getFixedStyles({ autoDimension: autoDimension, panoramaRect: panoramaRect, aspectRatio: aspectRatio, reticleWidth: reticleWidth });
     var defaultStyles = usesDefaultStyles ? getDefaultStyles({ isDragging: isDragging }) : undefined;
-    return (react_1.default.createElement("div", __assign({}, props, { ref: ref, className: (0, clsx_1.default)(className, { dragging: isDragging }), style: (0, utils_1.styles)(style, fixedStyles.root), "data-component": 'panorama-slider' }),
-        react_1.default.createElement(Panorama_1.Panorama, { angle: angle, ref: panoramaRef, speed: speed, src: src, style: fixedStyles.panorama, zeroAnchor: adjustedZeroAnchor, onAngleChange: onAngleChange, onDragEnd: dragEndHandler, onDragStart: dragStartHandler, onLoadImageComplete: onLoadImageComplete, onLoadImageError: onLoadImageError, onLoadImageStart: onLoadImageStart, onImageSizeChange: setImageSize, onPositionChange: onPositionChange }),
-        react_1.default.createElement("div", { style: fixedStyles.body },
-            react_1.default.createElement("div", { style: fixedStyles.controls },
-                (0, utils_1.cloneStyledElement)((_b = components.track) !== null && _b !== void 0 ? _b : react_1.default.createElement(exports.PanoramaSliderTrack, { style: defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.track }), {
-                    style: (0, utils_1.styles)(fixedStyles.track),
-                }),
-                (0, utils_1.cloneStyledElement)((_c = components.reticle) !== null && _c !== void 0 ? _c : react_1.default.createElement(exports.PanoramaSliderReticle, { style: defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.reticle }), {
-                    style: (0, utils_1.styles)(fixedStyles.reticle),
-                }),
-                (0, utils_1.cloneStyledElement)((_d = components.track) !== null && _d !== void 0 ? _d : react_1.default.createElement(exports.PanoramaSliderTrack, { style: defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.track }), {
-                    style: (0, utils_1.styles)(fixedStyles.track),
-                }))),
-        (0, utils_1.cloneStyledElement)((_e = components.indicator) !== null && _e !== void 0 ? _e : react_1.default.createElement(exports.PanoramaSliderIndicator, { style: defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.indicator }), {
-            style: (0, utils_1.styles)(fixedStyles.indicator),
-        })));
+    return ((0, jsx_runtime_1.jsxs)("div", __assign({}, props, { ref: ref, className: (0, clsx_1.default)(className, { dragging: isDragging }), "data-component": 'panorama-slider', style: (0, utils_1.styles)(style, fixedStyles.root), children: [(0, jsx_runtime_1.jsx)(Panorama_1.Panorama, { ref: panoramaRef, angle: angle, speed: speed, src: src, style: fixedStyles.panorama, zeroAnchor: adjustedZeroAnchor, onAngleChange: onAngleChange, onDragEnd: dragEndHandler, onDragStart: dragStartHandler, onImageSizeChange: setImageSize, onLoadImageComplete: onLoadImageComplete, onLoadImageError: onLoadImageError, onLoadImageStart: onLoadImageStart, onPositionChange: onPositionChange }), (0, jsx_runtime_1.jsx)("div", { style: fixedStyles.body, children: (0, jsx_runtime_1.jsxs)("div", { style: fixedStyles.controls, children: [(0, utils_1.cloneStyledElement)((_b = components.track) !== null && _b !== void 0 ? _b : (0, jsx_runtime_1.jsx)(exports.PanoramaSliderTrack, { style: defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.track }), {
+                            style: (0, utils_1.styles)(fixedStyles.track),
+                        }), (0, utils_1.cloneStyledElement)((_c = components.reticle) !== null && _c !== void 0 ? _c : (0, jsx_runtime_1.jsx)(exports.PanoramaSliderReticle, { style: defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.reticle }), {
+                            style: (0, utils_1.styles)(fixedStyles.reticle),
+                        }), (0, utils_1.cloneStyledElement)((_d = components.track) !== null && _d !== void 0 ? _d : (0, jsx_runtime_1.jsx)(exports.PanoramaSliderTrack, { style: defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.track }), {
+                            style: (0, utils_1.styles)(fixedStyles.track),
+                        })] }) }), (0, utils_1.cloneStyledElement)((_e = components.indicator) !== null && _e !== void 0 ? _e : (0, jsx_runtime_1.jsx)(exports.PanoramaSliderIndicator, { style: defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.indicator }), {
+                style: (0, utils_1.styles)(fixedStyles.indicator),
+            })] })));
 });
 Object.defineProperty(exports.PanoramaSlider, 'displayName', { value: 'PanoramaSlider', writable: false });
 exports.PanoramaSliderTrack = (0, react_1.forwardRef)(function (_a, ref) {
     var props = __rest(_a, []);
-    return react_1.default.createElement("div", __assign({}, props, { ref: ref, "data-child": 'track' }));
+    return (0, jsx_runtime_1.jsx)("div", __assign({}, props, { ref: ref, "data-child": 'track' }));
 });
 exports.PanoramaSliderReticle = (0, react_1.forwardRef)(function (_a, ref) {
     var props = __rest(_a, []);
-    return react_1.default.createElement("div", __assign({}, props, { ref: ref, "data-child": 'reticle' }));
+    return (0, jsx_runtime_1.jsx)("div", __assign({}, props, { ref: ref, "data-child": 'reticle' }));
 });
 exports.PanoramaSliderIndicator = (0, react_1.forwardRef)(function (_a, ref) {
     var props = __rest(_a, []);
-    return react_1.default.createElement("div", __assign({}, props, { ref: ref, "data-child": 'indicator' }));
+    return (0, jsx_runtime_1.jsx)("div", __assign({}, props, { ref: ref, "data-child": 'indicator' }));
 });
 function getDefaultStyles(_a) {
     var _b = _a.isDragging, isDragging = _b === void 0 ? false : _b;

package/components/PanoramaSlider.js.map

@@ -1 +1 @@
-{"version":3,"file":"PanoramaSlider.js","sourceRoot":"/","sources":["components/PanoramaSlider.tsx"],"names":[],"mappings":"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","sourcesContent":["import clsx from 'clsx'\nimport React, { forwardRef, useRef, useState, type HTMLAttributes, type PropsWithChildren } from 'react'\nimport { Rect, type Size } from 'spase'\nimport { useRect } from '../hooks/useRect'\nimport { asComponentDict, asStyleDict, cloneStyledElement, styles } from '../utils'\nimport { Panorama, type PanoramaProps } from './Panorama'\n\nexport type PanoramaSliderProps = PanoramaProps & PropsWithChildren<{\n  /**\n   * Field-of-view (0.0 - 360.0 degrees, inclusive) that represents the size of\n   * the reticle. 360 indicates the reticle covers the entire image. If this is\n   * unspecified, the component will attempt to automatically calculate the FOV\n   * using the `viewportSize` prop.\n   */\n  fov?: number\n\n  /**\n   * Specifies which length (width or height) should be automatically\n   * calculated. The counterpart must be known (if `width` is specified here,\n   * the component's height must be known, i.e. it is specified in the CSS).\n   * Defaults to `width`.\n   */\n  autoDimension?: 'width' | 'height'\n\n  /**\n   * Size of the viewport that this component is controlling. A viewport can be\n   * thought of as a DOM element containing an aspect-filled image. This is used\n   * to automatically calculate the FOV if `fov` prop is not specified. If it\n   * is, this prop is ignored.\n   */\n  viewportSize?: Size\n\n  /**\n   * Specifies if the component should use default styles.\n   */\n  usesDefaultStyles?: boolean\n}>\n\n/**\n * A slider for a {@link Panorama} component.\n *\n * @exports PanoramaSliderIndicator The indicator that appears when the slider\n *                                  is being dragged.\n * @exports PanoramaSliderReticle The reticle that indicates the FOV of the\n *                                backing {@link Panorama}.\n * @exports PanoramaSliderTrack The slide track.\n */\nexport const PanoramaSlider = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement> & PanoramaSliderProps>(({\n  className,\n  style,\n  angle = 0,\n  autoDimension = 'width',\n  children,\n  fov,\n  speed = 1,\n  src,\n  usesDefaultStyles = false,\n  viewportSize,\n  zeroAnchor = 0,\n  onAngleChange,\n  onDragEnd,\n  onDragStart,\n  onLoadImageComplete,\n  onLoadImageError,\n  onLoadImageStart,\n  onImageSizeChange,\n  onPositionChange,\n  ...props\n}, ref) => {\n  const getAspectRatio = () => {\n    if (!imageSize) return 0\n    const { width, height } = imageSize\n    if (height === 0) return 0\n\n    return width / height\n  }\n\n  const getReticleWidth = () => {\n    const deg = Math.min(360, Math.max(0, fov ?? (viewportSize ? viewportSize.width / (viewportSize.height * aspectRatio) * 360 : 0)))\n\n    return panoramaRect.width * (deg / 360)\n  }\n\n  const getAdjustedZeroAnchor = () => {\n    if (panoramaRect.width <= 0) return zeroAnchor\n\n    return ((panoramaRect.width - reticleWidth) * 0.5 + zeroAnchor * reticleWidth) / panoramaRect.width\n  }\n\n  const dragStartHandler = () => {\n    setIsDragging(true)\n    onDragStart?.()\n  }\n\n  const dragEndHandler = () => {\n    setIsDragging(false)\n    onDragEnd?.()\n  }\n\n  const panoramaRef = useRef<HTMLDivElement>(null)\n  const panoramaRect = useRect(panoramaRef)\n\n  const [imageSize, setImageSize] = useState<Size | undefined>()\n  const [isDragging, setIsDragging] = useState(false)\n\n  const aspectRatio = getAspectRatio()\n  const reticleWidth = getReticleWidth()\n  const adjustedZeroAnchor = getAdjustedZeroAnchor()\n\n  const components = asComponentDict(children, {\n    track: PanoramaSliderTrack,\n    reticle: PanoramaSliderReticle,\n    indicator: PanoramaSliderIndicator,\n  })\n\n  const fixedStyles = getFixedStyles({ autoDimension, panoramaRect, aspectRatio, reticleWidth })\n  const defaultStyles = usesDefaultStyles ? getDefaultStyles({ isDragging }) : undefined\n\n  return (\n    <div {...props} ref={ref} className={clsx(className, { dragging: isDragging })} style={styles(style, fixedStyles.root)} data-component='panorama-slider'>\n      <Panorama\n        angle={angle}\n        ref={panoramaRef}\n        speed={speed}\n        src={src}\n        style={fixedStyles.panorama}\n        zeroAnchor={adjustedZeroAnchor}\n        onAngleChange={onAngleChange}\n        onDragEnd={dragEndHandler}\n        onDragStart={dragStartHandler}\n        onLoadImageComplete={onLoadImageComplete}\n        onLoadImageError={onLoadImageError}\n        onLoadImageStart={onLoadImageStart}\n        onImageSizeChange={setImageSize}\n        onPositionChange={onPositionChange}\n      />\n      <div style={fixedStyles.body}>\n        <div style={fixedStyles.controls}>\n          {cloneStyledElement(components.track ?? <PanoramaSliderTrack style={defaultStyles?.track}/>, {\n            style: styles(fixedStyles.track),\n          })}\n          {cloneStyledElement(components.reticle ?? <PanoramaSliderReticle style={defaultStyles?.reticle}/>, {\n            style: styles(fixedStyles.reticle),\n          })}\n          {cloneStyledElement(components.track ?? <PanoramaSliderTrack style={defaultStyles?.track}/>, {\n            style: styles(fixedStyles.track),\n          })}\n        </div>\n      </div>\n      {cloneStyledElement(components.indicator ?? <PanoramaSliderIndicator style={defaultStyles?.indicator}/>, {\n        style: styles(fixedStyles.indicator),\n      })}\n    </div>\n  )\n})\n\nObject.defineProperty(PanoramaSlider, 'displayName', { value: 'PanoramaSlider', writable: false })\n\nexport const PanoramaSliderTrack = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='track'/>)\n\nexport const PanoramaSliderReticle = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='reticle'/>)\n\nexport const PanoramaSliderIndicator = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='indicator'/>)\n\nfunction getDefaultStyles({ isDragging = false }) {\n  return asStyleDict({\n    track: {\n      background: 'rgba(0, 0, 0, .7)',\n      height: '100%',\n    },\n    reticle: {\n      background: `rgba(0, 0, 0, ${isDragging ? 0 : 0.3})`,\n      flex: '0 0 auto',\n      height: '100%',\n      transitionDuration: '100ms',\n      transitionProperty: 'background',\n      transitionTimingFunction: 'ease-out',\n    },\n    indicator: {\n      background: '#fff',\n      borderRadius: '2px',\n      bottom: '-10px',\n      boxSizing: 'border-box',\n      display: 'block',\n      height: '2px',\n      left: '0',\n      margin: '0 auto',\n      opacity: isDragging ? 1 : 0,\n      position: 'absolute',\n      right: '0',\n      transition: 'opacity .3s ease-out',\n    },\n  })\n}\n\nfunction getFixedStyles({ autoDimension = 'width', panoramaRect = new Rect(), aspectRatio = 0, reticleWidth = 0 }) {\n  return asStyleDict({\n    root: {\n      ...autoDimension === 'width' ? {\n        width: `${panoramaRect.height * aspectRatio}px`,\n      } : {\n        height: `${panoramaRect.width / aspectRatio}px`,\n      },\n    },\n    body: {\n      height: '100%',\n      left: '0',\n      overflow: 'hidden',\n      pointerEvents: 'none',\n      position: 'absolute',\n      top: '0',\n      width: '100%',\n    },\n    panorama: {\n      height: '100%',\n      width: '100%',\n    },\n    controls: {\n      alignItems: 'center',\n      display: 'flex',\n      height: '100%',\n      justifyContent: 'flex-start',\n      left: '0',\n      overflow: 'visible',\n      position: 'absolute',\n      top: '0',\n      width: '100%',\n    },\n    track: {\n      flex: '1 0 auto',\n    },\n    reticle: {\n      width: `${reticleWidth}px`,\n    },\n    indicator: {\n      width: `${reticleWidth}px`,\n    },\n  })\n}\n"]}
+{"version":3,"file":"PanoramaSlider.js","sourceRoot":"/","sources":["components/PanoramaSlider.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,8CAAuB;AACvB,+BAAiG;AACjG,+BAAuC;AACvC,4CAA0C;AAC1C,kCAAmF;AACnF,uCAAyD;AAiCzD;;;;;;;;GAQG;AACU,QAAA,cAAc,GAAG,IAAA,kBAAU,EAAuE,UAAC,EAqB/G,EAAE,GAAG;;IApBJ,IAAA,SAAS,eAAA,EACT,KAAK,WAAA,EACL,aAAS,EAAT,KAAK,mBAAG,CAAC,KAAA,EACT,qBAAuB,EAAvB,aAAa,mBAAG,OAAO,KAAA,EACvB,QAAQ,cAAA,EACR,GAAG,SAAA,EACH,aAAS,EAAT,KAAK,mBAAG,CAAC,KAAA,EACT,GAAG,SAAA,EACH,yBAAyB,EAAzB,iBAAiB,mBAAG,KAAK,KAAA,EACzB,YAAY,kBAAA,EACZ,kBAAc,EAAd,UAAU,mBAAG,CAAC,KAAA,EACd,aAAa,mBAAA,EACb,SAAS,eAAA,EACT,WAAW,iBAAA,EACX,mBAAmB,yBAAA,EACnB,gBAAgB,sBAAA,EAChB,gBAAgB,sBAAA,EAChB,iBAAiB,uBAAA,EACjB,gBAAgB,sBAAA,EACb,KAAK,cApBsG,2RAqB/G,CADS;IAER,IAAM,cAAc,GAAG;QACrB,IAAI,CAAC,SAAS;YAAE,OAAO,CAAC,CAAA;QAChB,IAAA,KAAK,GAAa,SAAS,MAAtB,EAAE,MAAM,GAAK,SAAS,OAAd,CAAc;QACnC,IAAI,MAAM,KAAK,CAAC;YAAE,OAAO,CAAC,CAAA;QAE1B,OAAO,KAAK,GAAG,MAAM,CAAA;IACvB,CAAC,CAAA;IAED,IAAM,eAAe,GAAG;QACtB,IAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,aAAH,GAAG,cAAH,GAAG,GAAI,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,KAAK,GAAG,CAAC,YAAY,CAAC,MAAM,GAAG,WAAW,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;QAElI,OAAO,YAAY,CAAC,KAAK,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,CAAA;IACzC,CAAC,CAAA;IAED,IAAM,qBAAqB,GAAG;QAC5B,IAAI,YAAY,CAAC,KAAK,IAAI,CAAC;YAAE,OAAO,UAAU,CAAA;QAE9C,OAAO,CAAC,CAAC,YAAY,CAAC,KAAK,GAAG,YAAY,CAAC,GAAG,GAAG,GAAG,UAAU,GAAG,YAAY,CAAC,GAAG,YAAY,CAAC,KAAK,CAAA;IACrG,CAAC,CAAA;IAED,IAAM,gBAAgB,GAAG;QACvB,aAAa,CAAC,IAAI,CAAC,CAAA;QACnB,WAAW,aAAX,WAAW,uBAAX,WAAW,EAAI,CAAA;IACjB,CAAC,CAAA;IAED,IAAM,cAAc,GAAG;QACrB,aAAa,CAAC,KAAK,CAAC,CAAA;QACpB,SAAS,aAAT,SAAS,uBAAT,SAAS,EAAI,CAAA;IACf,CAAC,CAAA;IAED,IAAM,WAAW,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAA;IAChD,IAAM,YAAY,GAAG,IAAA,iBAAO,EAAC,WAAW,CAAC,CAAA;IAEnC,IAAA,KAAA,OAA4B,IAAA,gBAAQ,GAAoB,IAAA,EAAvD,SAAS,QAAA,EAAE,YAAY,QAAgC,CAAA;IACxD,IAAA,KAAA,OAA8B,IAAA,gBAAQ,EAAC,KAAK,CAAC,IAAA,EAA5C,UAAU,QAAA,EAAE,aAAa,QAAmB,CAAA;IAEnD,IAAM,WAAW,GAAG,cAAc,EAAE,CAAA;IACpC,IAAM,YAAY,GAAG,eAAe,EAAE,CAAA;IACtC,IAAM,kBAAkB,GAAG,qBAAqB,EAAE,CAAA;IAElD,IAAM,UAAU,GAAG,IAAA,uBAAe,EAAC,QAAQ,EAAE;QAC3C,KAAK,EAAE,2BAAmB;QAC1B,OAAO,EAAE,6BAAqB;QAC9B,SAAS,EAAE,+BAAuB;KACnC,CAAC,CAAA;IAEF,IAAM,WAAW,GAAG,cAAc,CAAC,EAAE,aAAa,eAAA,EAAE,YAAY,cAAA,EAAE,WAAW,aAAA,EAAE,YAAY,cAAA,EAAE,CAAC,CAAA;IAC9F,IAAM,aAAa,GAAG,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,CAAC,EAAE,UAAU,YAAA,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAAA;IAEtF,OAAO,CACL,4CAAS,KAAK,IAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAA,cAAI,EAAC,SAAS,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC,oBAAiB,iBAAiB,EAAC,KAAK,EAAE,IAAA,cAAM,EAAC,KAAK,EAAE,WAAW,CAAC,IAAI,CAAC,aACrJ,uBAAC,mBAAQ,IACP,GAAG,EAAE,WAAW,EAChB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,WAAW,CAAC,QAAQ,EAC3B,UAAU,EAAE,kBAAkB,EAC9B,aAAa,EAAE,aAAa,EAC5B,SAAS,EAAE,cAAc,EACzB,WAAW,EAAE,gBAAgB,EAC7B,iBAAiB,EAAE,YAAY,EAC/B,mBAAmB,EAAE,mBAAmB,EACxC,gBAAgB,EAAE,gBAAgB,EAClC,gBAAgB,EAAE,gBAAgB,EAClC,gBAAgB,EAAE,gBAAgB,GAClC,EACF,gCAAK,KAAK,EAAE,WAAW,CAAC,IAAI,YAC1B,iCAAK,KAAK,EAAE,WAAW,CAAC,QAAQ,aAC7B,IAAA,0BAAkB,EAAC,MAAA,UAAU,CAAC,KAAK,mCAAI,uBAAC,2BAAmB,IAAC,KAAK,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,KAAK,GAAG,EAAE;4BAC3F,KAAK,EAAE,IAAA,cAAM,EAAC,WAAW,CAAC,KAAK,CAAC;yBACjC,CAAC,EACD,IAAA,0BAAkB,EAAC,MAAA,UAAU,CAAC,OAAO,mCAAI,uBAAC,6BAAqB,IAAC,KAAK,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,OAAO,GAAG,EAAE;4BACjG,KAAK,EAAE,IAAA,cAAM,EAAC,WAAW,CAAC,OAAO,CAAC;yBACnC,CAAC,EACD,IAAA,0BAAkB,EAAC,MAAA,UAAU,CAAC,KAAK,mCAAI,uBAAC,2BAAmB,IAAC,KAAK,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,KAAK,GAAG,EAAE;4BAC3F,KAAK,EAAE,IAAA,cAAM,EAAC,WAAW,CAAC,KAAK,CAAC;yBACjC,CAAC,IACE,GACF,EACL,IAAA,0BAAkB,EAAC,MAAA,UAAU,CAAC,SAAS,mCAAI,uBAAC,+BAAuB,IAAC,KAAK,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,SAAS,GAAG,EAAE;gBACvG,KAAK,EAAE,IAAA,cAAM,EAAC,WAAW,CAAC,SAAS,CAAC;aACrC,CAAC,KACE,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,CAAC,cAAc,CAAC,sBAAc,EAAE,aAAa,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAA;AAErF,QAAA,mBAAmB,GAAG,IAAA,kBAAU,EAAiD,UAAC,EAAY,EAAE,GAAG;QAAZ,KAAK,cAAV,EAAY,CAAF;IAAY,OAAA,2CAAS,KAAK,IAAE,GAAG,EAAE,GAAG,gBAAa,OAAO,IAAE,CAAA;CAAA,CAAC,CAAA;AAEvJ,QAAA,qBAAqB,GAAG,IAAA,kBAAU,EAAiD,UAAC,EAAY,EAAE,GAAG;QAAZ,KAAK,cAAV,EAAY,CAAF;IAAY,OAAA,2CAAS,KAAK,IAAE,GAAG,EAAE,GAAG,gBAAa,SAAS,IAAE,CAAA;CAAA,CAAC,CAAA;AAE3J,QAAA,uBAAuB,GAAG,IAAA,kBAAU,EAAiD,UAAC,EAAY,EAAE,GAAG;QAAZ,KAAK,cAAV,EAAY,CAAF;IAAY,OAAA,2CAAS,KAAK,IAAE,GAAG,EAAE,GAAG,gBAAa,WAAW,IAAE,CAAA;CAAA,CAAC,CAAA;AAE5K,SAAS,gBAAgB,CAAC,EAAsB;QAApB,kBAAkB,EAAlB,UAAU,mBAAG,KAAK,KAAA;IAC5C,OAAO,IAAA,mBAAW,EAAC;QACjB,KAAK,EAAE;YACL,UAAU,EAAE,mBAAmB;YAC/B,MAAM,EAAE,MAAM;SACf;QACD,OAAO,EAAE;YACP,UAAU,EAAE,wBAAiB,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,MAAG;YACpD,IAAI,EAAE,UAAU;YAChB,MAAM,EAAE,MAAM;YACd,kBAAkB,EAAE,OAAO;YAC3B,kBAAkB,EAAE,YAAY;YAChC,wBAAwB,EAAE,UAAU;SACrC;QACD,SAAS,EAAE;YACT,UAAU,EAAE,MAAM;YAClB,YAAY,EAAE,KAAK;YACnB,MAAM,EAAE,OAAO;YACf,SAAS,EAAE,YAAY;YACvB,OAAO,EAAE,OAAO;YAChB,MAAM,EAAE,KAAK;YACb,IAAI,EAAE,GAAG;YACT,MAAM,EAAE,QAAQ;YAChB,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAC3B,QAAQ,EAAE,UAAU;YACpB,KAAK,EAAE,GAAG;YACV,UAAU,EAAE,sBAAsB;SACnC;KACF,CAAC,CAAA;AACJ,CAAC;AAED,SAAS,cAAc,CAAC,EAAyF;QAAvF,qBAAuB,EAAvB,aAAa,mBAAG,OAAO,KAAA,EAAE,oBAAyB,EAAzB,YAAY,mBAAG,IAAI,YAAI,EAAE,KAAA,EAAE,mBAAe,EAAf,WAAW,mBAAG,CAAC,KAAA,EAAE,oBAAgB,EAAhB,YAAY,mBAAG,CAAC,KAAA;IAC7G,OAAO,IAAA,mBAAW,EAAC;QACjB,IAAI,eACC,aAAa,KAAK,OAAO,CAAC,CAAC,CAAC;YAC7B,KAAK,EAAE,UAAG,YAAY,CAAC,MAAM,GAAG,WAAW,OAAI;SAChD,CAAC,CAAC,CAAC;YACF,MAAM,EAAE,UAAG,YAAY,CAAC,KAAK,GAAG,WAAW,OAAI;SAChD,CACF;QACD,IAAI,EAAE;YACJ,MAAM,EAAE,MAAM;YACd,IAAI,EAAE,GAAG;YACT,QAAQ,EAAE,QAAQ;YAClB,aAAa,EAAE,MAAM;YACrB,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,GAAG;YACR,KAAK,EAAE,MAAM;SACd;QACD,QAAQ,EAAE;YACR,MAAM,EAAE,MAAM;YACd,KAAK,EAAE,MAAM;SACd;QACD,QAAQ,EAAE;YACR,UAAU,EAAE,QAAQ;YACpB,OAAO,EAAE,MAAM;YACf,MAAM,EAAE,MAAM;YACd,cAAc,EAAE,YAAY;YAC5B,IAAI,EAAE,GAAG;YACT,QAAQ,EAAE,SAAS;YACnB,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,GAAG;YACR,KAAK,EAAE,MAAM;SACd;QACD,KAAK,EAAE;YACL,IAAI,EAAE,UAAU;SACjB;QACD,OAAO,EAAE;YACP,KAAK,EAAE,UAAG,YAAY,OAAI;SAC3B;QACD,SAAS,EAAE;YACT,KAAK,EAAE,UAAG,YAAY,OAAI;SAC3B;KACF,CAAC,CAAA;AACJ,CAAC","sourcesContent":["import clsx from 'clsx'\nimport { forwardRef, useRef, useState, type HTMLAttributes, type PropsWithChildren } from 'react'\nimport { Rect, type Size } from 'spase'\nimport { useRect } from '../hooks/useRect'\nimport { asComponentDict, asStyleDict, cloneStyledElement, styles } from '../utils'\nimport { Panorama, type PanoramaProps } from './Panorama'\n\nexport type PanoramaSliderProps = PanoramaProps & PropsWithChildren<{\n  /**\n   * Field-of-view (0.0 - 360.0 degrees, inclusive) that represents the size of\n   * the reticle. 360 indicates the reticle covers the entire image. If this is\n   * unspecified, the component will attempt to automatically calculate the FOV\n   * using the `viewportSize` prop.\n   */\n  fov?: number\n\n  /**\n   * Specifies which length (width or height) should be automatically\n   * calculated. The counterpart must be known (if `width` is specified here,\n   * the component's height must be known, i.e. it is specified in the CSS).\n   * Defaults to `width`.\n   */\n  autoDimension?: 'width' | 'height'\n\n  /**\n   * Size of the viewport that this component is controlling. A viewport can be\n   * thought of as a DOM element containing an aspect-filled image. This is used\n   * to automatically calculate the FOV if `fov` prop is not specified. If it\n   * is, this prop is ignored.\n   */\n  viewportSize?: Size\n\n  /**\n   * Specifies if the component should use default styles.\n   */\n  usesDefaultStyles?: boolean\n}>\n\n/**\n * A slider for a {@link Panorama} component.\n *\n * @exports PanoramaSliderIndicator The indicator that appears when the slider\n *                                  is being dragged.\n * @exports PanoramaSliderReticle The reticle that indicates the FOV of the\n *                                backing {@link Panorama}.\n * @exports PanoramaSliderTrack The slide track.\n */\nexport const PanoramaSlider = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement> & PanoramaSliderProps>(({\n  className,\n  style,\n  angle = 0,\n  autoDimension = 'width',\n  children,\n  fov,\n  speed = 1,\n  src,\n  usesDefaultStyles = false,\n  viewportSize,\n  zeroAnchor = 0,\n  onAngleChange,\n  onDragEnd,\n  onDragStart,\n  onLoadImageComplete,\n  onLoadImageError,\n  onLoadImageStart,\n  onImageSizeChange,\n  onPositionChange,\n  ...props\n}, ref) => {\n  const getAspectRatio = () => {\n    if (!imageSize) return 0\n    const { width, height } = imageSize\n    if (height === 0) return 0\n\n    return width / height\n  }\n\n  const getReticleWidth = () => {\n    const deg = Math.min(360, Math.max(0, fov ?? (viewportSize ? viewportSize.width / (viewportSize.height * aspectRatio) * 360 : 0)))\n\n    return panoramaRect.width * (deg / 360)\n  }\n\n  const getAdjustedZeroAnchor = () => {\n    if (panoramaRect.width <= 0) return zeroAnchor\n\n    return ((panoramaRect.width - reticleWidth) * 0.5 + zeroAnchor * reticleWidth) / panoramaRect.width\n  }\n\n  const dragStartHandler = () => {\n    setIsDragging(true)\n    onDragStart?.()\n  }\n\n  const dragEndHandler = () => {\n    setIsDragging(false)\n    onDragEnd?.()\n  }\n\n  const panoramaRef = useRef<HTMLDivElement>(null)\n  const panoramaRect = useRect(panoramaRef)\n\n  const [imageSize, setImageSize] = useState<Size | undefined>()\n  const [isDragging, setIsDragging] = useState(false)\n\n  const aspectRatio = getAspectRatio()\n  const reticleWidth = getReticleWidth()\n  const adjustedZeroAnchor = getAdjustedZeroAnchor()\n\n  const components = asComponentDict(children, {\n    track: PanoramaSliderTrack,\n    reticle: PanoramaSliderReticle,\n    indicator: PanoramaSliderIndicator,\n  })\n\n  const fixedStyles = getFixedStyles({ autoDimension, panoramaRect, aspectRatio, reticleWidth })\n  const defaultStyles = usesDefaultStyles ? getDefaultStyles({ isDragging }) : undefined\n\n  return (\n    <div {...props} ref={ref} className={clsx(className, { dragging: isDragging })} data-component='panorama-slider' style={styles(style, fixedStyles.root)}>\n      <Panorama\n        ref={panoramaRef}\n        angle={angle}\n        speed={speed}\n        src={src}\n        style={fixedStyles.panorama}\n        zeroAnchor={adjustedZeroAnchor}\n        onAngleChange={onAngleChange}\n        onDragEnd={dragEndHandler}\n        onDragStart={dragStartHandler}\n        onImageSizeChange={setImageSize}\n        onLoadImageComplete={onLoadImageComplete}\n        onLoadImageError={onLoadImageError}\n        onLoadImageStart={onLoadImageStart}\n        onPositionChange={onPositionChange}\n      />\n      <div style={fixedStyles.body}>\n        <div style={fixedStyles.controls}>\n          {cloneStyledElement(components.track ?? <PanoramaSliderTrack style={defaultStyles?.track}/>, {\n            style: styles(fixedStyles.track),\n          })}\n          {cloneStyledElement(components.reticle ?? <PanoramaSliderReticle style={defaultStyles?.reticle}/>, {\n            style: styles(fixedStyles.reticle),\n          })}\n          {cloneStyledElement(components.track ?? <PanoramaSliderTrack style={defaultStyles?.track}/>, {\n            style: styles(fixedStyles.track),\n          })}\n        </div>\n      </div>\n      {cloneStyledElement(components.indicator ?? <PanoramaSliderIndicator style={defaultStyles?.indicator}/>, {\n        style: styles(fixedStyles.indicator),\n      })}\n    </div>\n  )\n})\n\nObject.defineProperty(PanoramaSlider, 'displayName', { value: 'PanoramaSlider', writable: false })\n\nexport const PanoramaSliderTrack = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='track'/>)\n\nexport const PanoramaSliderReticle = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='reticle'/>)\n\nexport const PanoramaSliderIndicator = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='indicator'/>)\n\nfunction getDefaultStyles({ isDragging = false }) {\n  return asStyleDict({\n    track: {\n      background: 'rgba(0, 0, 0, .7)',\n      height: '100%',\n    },\n    reticle: {\n      background: `rgba(0, 0, 0, ${isDragging ? 0 : 0.3})`,\n      flex: '0 0 auto',\n      height: '100%',\n      transitionDuration: '100ms',\n      transitionProperty: 'background',\n      transitionTimingFunction: 'ease-out',\n    },\n    indicator: {\n      background: '#fff',\n      borderRadius: '2px',\n      bottom: '-10px',\n      boxSizing: 'border-box',\n      display: 'block',\n      height: '2px',\n      left: '0',\n      margin: '0 auto',\n      opacity: isDragging ? 1 : 0,\n      position: 'absolute',\n      right: '0',\n      transition: 'opacity .3s ease-out',\n    },\n  })\n}\n\nfunction getFixedStyles({ autoDimension = 'width', panoramaRect = new Rect(), aspectRatio = 0, reticleWidth = 0 }) {\n  return asStyleDict({\n    root: {\n      ...autoDimension === 'width' ? {\n        width: `${panoramaRect.height * aspectRatio}px`,\n      } : {\n        height: `${panoramaRect.width / aspectRatio}px`,\n      },\n    },\n    body: {\n      height: '100%',\n      left: '0',\n      overflow: 'hidden',\n      pointerEvents: 'none',\n      position: 'absolute',\n      top: '0',\n      width: '100%',\n    },\n    panorama: {\n      height: '100%',\n      width: '100%',\n    },\n    controls: {\n      alignItems: 'center',\n      display: 'flex',\n      height: '100%',\n      justifyContent: 'flex-start',\n      left: '0',\n      overflow: 'visible',\n      position: 'absolute',\n      top: '0',\n      width: '100%',\n    },\n    track: {\n      flex: '1 0 auto',\n    },\n    reticle: {\n      width: `${reticleWidth}px`,\n    },\n    indicator: {\n      width: `${reticleWidth}px`,\n    },\n  })\n}\n"]}

package/components/RangeSlider.d.ts

@@ -1,4 +1,4 @@
-import React, { type PropsWithChildren } from 'react';
+import { type HTMLAttributes, type PropsWithChildren } from 'react';
 type Orientation = 'horizontal' | 'vertical';
 type Range = [number, number];
 export type RangeSliderProps = PropsWithChildren<{
@@ -13,22 +13,22 @@ export type RangeSliderProps = PropsWithChildren<{
     usesDefaultStyles?: boolean;
     onRangeChange?: (range: Range) => void;
 }>;
-export declare const RangeSlider: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
-    areLabelsVisible?: boolean | undefined;
-    decimalPlaces?: number | undefined;
-    knobPadding?: number | undefined;
+export declare const RangeSlider: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
+    areLabelsVisible?: boolean;
+    decimalPlaces?: number;
+    knobPadding?: number;
     max: number;
     min: number;
-    orientation?: Orientation | undefined;
-    range?: Range | undefined;
-    steps?: number | undefined;
-    usesDefaultStyles?: boolean | undefined;
-    onRangeChange?: ((range: Range) => void) | undefined;
+    orientation?: Orientation;
+    range?: Range;
+    steps?: number;
+    usesDefaultStyles?: boolean;
+    onRangeChange?: (range: Range) => void;
 } & {
-    children?: React.ReactNode;
-} & React.RefAttributes<HTMLDivElement>>;
-export declare const RangeSliderGutter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-export declare const RangeSliderLabel: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-export declare const RangeSliderHighlight: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
-export declare const RangeSliderKnob: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+    children?: import("react").ReactNode | undefined;
+} & import("react").RefAttributes<HTMLDivElement>>;
+export declare const RangeSliderGutter: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const RangeSliderLabel: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const RangeSliderHighlight: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const RangeSliderKnob: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
 export {};

package/components/RangeSlider.js

@@ -10,29 +10,6 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -74,9 +51,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RangeSliderKnob = exports.RangeSliderHighlight = exports.RangeSliderLabel = exports.RangeSliderGutter = exports.RangeSlider = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
 var clsx_1 = __importDefault(require("clsx"));
 var react_1 = __importDefault(require("fast-deep-equal/react"));
-var react_2 = __importStar(require("react"));
+var react_2 = require("react");
 var useDragValueEffect_1 = require("../hooks/useDragValueEffect");
 var useRect_1 = require("../hooks/useRect");
 var utils_1 = require("../utils");
@@ -166,32 +144,27 @@ exports.RangeSlider = (0, react_2.forwardRef)(function (_a, ref) {
     });
     var fixedStyles = getFixedStyles({ orientation: orientation, highlightLength: highlightLength, start: start, knobPadding: knobPadding });
     var defaultStyles = usesDefaultStyles ? getDefaultStyles({ isReleasingStartKnob: isReleasingStartKnob, isReleasingEndKnob: isReleasingEndKnob, orientation: orientation }) : undefined;
-    return (react_2.default.createElement("div", __assign({}, props, { ref: ref, className: (0, clsx_1.default)(className, orientation), "data-component": 'range-slider' }),
-        react_2.default.createElement("div", { ref: bodyRef, style: fixedStyles.body },
-            (0, utils_1.cloneStyledElement)((_d = components.gutter) !== null && _d !== void 0 ? _d : react_2.default.createElement(exports.RangeSliderGutter, { style: defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.gutter }), {
-                style: (0, utils_1.styles)(fixedStyles.gutter),
-            }),
-            (0, utils_1.cloneStyledElement)((_e = components.highlight) !== null && _e !== void 0 ? _e : react_2.default.createElement(exports.RangeSliderHighlight, { style: defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.highlight }), {
-                style: (0, utils_1.styles)(fixedStyles.highlight),
-            }),
-            (0, utils_1.cloneStyledElement)((_f = components.knob) !== null && _f !== void 0 ? _f : react_2.default.createElement(exports.RangeSliderKnob, { style: (0, utils_1.styles)(defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.knob, {
-                    transitionProperty: isReleasingStartKnob ? 'opacity, transform' : 'opacity',
-                }) }), {
-                ref: startKnobRef,
-                disabled: (0, react_1.default)([startValue, endValue], [maxValue, maxValue]),
-                className: (0, clsx_1.default)({
-                    dragging: isDraggingStartKnob,
-                    releasing: isReleasingStartKnob,
-                }),
-                style: (0, utils_1.styles)(fixedStyles.knob, {
-                    pointerEvents: (0, react_1.default)([startValue, endValue], [minValue, minValue]) ? 'none' : 'auto',
-                }, orientation === 'horizontal' ? {
-                    marginLeft: "".concat(start, "px"),
-                } : {
-                    marginTop: "".concat(start, "px"),
-                }),
-            }, react_2.default.createElement("div", { style: fixedStyles.knobHitbox }), areLabelsVisible &&
-                (0, utils_1.cloneStyledElement)((_g = components.label) !== null && _g !== void 0 ? _g : react_2.default.createElement(exports.RangeSliderLabel, { style: (0, utils_1.styles)(defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.label, {
+    return ((0, jsx_runtime_1.jsx)("div", __assign({}, props, { ref: ref, className: (0, clsx_1.default)(className, orientation), "data-component": 'range-slider', children: (0, jsx_runtime_1.jsxs)("div", { ref: bodyRef, style: fixedStyles.body, children: [(0, utils_1.cloneStyledElement)((_d = components.gutter) !== null && _d !== void 0 ? _d : (0, jsx_runtime_1.jsx)(exports.RangeSliderGutter, { style: defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.gutter }), {
+                    style: (0, utils_1.styles)(fixedStyles.gutter),
+                }), (0, utils_1.cloneStyledElement)((_e = components.highlight) !== null && _e !== void 0 ? _e : (0, jsx_runtime_1.jsx)(exports.RangeSliderHighlight, { style: defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.highlight }), {
+                    style: (0, utils_1.styles)(fixedStyles.highlight),
+                }), (0, utils_1.cloneStyledElement)((_f = components.knob) !== null && _f !== void 0 ? _f : (0, jsx_runtime_1.jsx)(exports.RangeSliderKnob, { style: (0, utils_1.styles)(defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.knob, {
+                        transitionProperty: isReleasingStartKnob ? 'opacity, transform' : 'opacity',
+                    }) }), {
+                    ref: startKnobRef,
+                    disabled: (0, react_1.default)([startValue, endValue], [maxValue, maxValue]),
+                    className: (0, clsx_1.default)({
+                        dragging: isDraggingStartKnob,
+                        releasing: isReleasingStartKnob,
+                    }),
+                    style: (0, utils_1.styles)(fixedStyles.knob, {
+                        pointerEvents: (0, react_1.default)([startValue, endValue], [minValue, minValue]) ? 'none' : 'auto',
+                    }, orientation === 'horizontal' ? {
+                        marginLeft: "".concat(start, "px"),
+                    } : {
+                        marginTop: "".concat(start, "px"),
+                    }),
+                }, (0, jsx_runtime_1.jsx)("div", { style: fixedStyles.knobHitbox }), areLabelsVisible && (0, utils_1.cloneStyledElement)((_g = components.label) !== null && _g !== void 0 ? _g : (0, jsx_runtime_1.jsx)(exports.RangeSliderLabel, { style: (0, utils_1.styles)(defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.label, {
                         transitionProperty: isReleasingStartKnob ? 'opacity, transform' : 'opacity',
                     }) }), {
                     className: (0, clsx_1.default)({
@@ -199,25 +172,23 @@ exports.RangeSlider = (0, react_2.forwardRef)(function (_a, ref) {
                         releasing: isReleasingStartKnob || isReleasingEndKnob,
                     }),
                     style: (0, utils_1.styles)(fixedStyles.label),
-                }, Number(startValue.toFixed(decimalPlaces)).toLocaleString())),
-            (0, utils_1.cloneStyledElement)((_h = components.knob) !== null && _h !== void 0 ? _h : react_2.default.createElement(exports.RangeSliderKnob, { style: (0, utils_1.styles)(defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.knob, {
-                    transitionProperty: isReleasingEndKnob ? 'opacity, transform' : 'opacity',
-                }) }), {
-                ref: endKnobRef,
-                disabled: (0, react_1.default)([startValue, endValue], [maxValue, maxValue]),
-                className: (0, clsx_1.default)({
-                    dragging: isDraggingEndKnob,
-                    releasing: isDraggingEndKnob,
-                }),
-                style: (0, utils_1.styles)(fixedStyles.knob, {
-                    pointerEvents: (0, react_1.default)([startValue, endValue], [maxValue, maxValue]) ? 'none' : 'auto',
-                }, orientation === 'horizontal' ? {
-                    marginLeft: "".concat(end, "px"),
-                } : {
-                    marginTop: "".concat(end, "px"),
-                }),
-            }, react_2.default.createElement("div", { style: fixedStyles.knobHitbox }), areLabelsVisible &&
-                (0, utils_1.cloneStyledElement)((_j = components.label) !== null && _j !== void 0 ? _j : react_2.default.createElement(exports.RangeSliderLabel, { style: (0, utils_1.styles)(defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.label, {
+                }, Number(startValue.toFixed(decimalPlaces)).toLocaleString())), (0, utils_1.cloneStyledElement)((_h = components.knob) !== null && _h !== void 0 ? _h : (0, jsx_runtime_1.jsx)(exports.RangeSliderKnob, { style: (0, utils_1.styles)(defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.knob, {
+                        transitionProperty: isReleasingEndKnob ? 'opacity, transform' : 'opacity',
+                    }) }), {
+                    ref: endKnobRef,
+                    disabled: (0, react_1.default)([startValue, endValue], [maxValue, maxValue]),
+                    className: (0, clsx_1.default)({
+                        dragging: isDraggingEndKnob,
+                        releasing: isDraggingEndKnob,
+                    }),
+                    style: (0, utils_1.styles)(fixedStyles.knob, {
+                        pointerEvents: (0, react_1.default)([startValue, endValue], [maxValue, maxValue]) ? 'none' : 'auto',
+                    }, orientation === 'horizontal' ? {
+                        marginLeft: "".concat(end, "px"),
+                    } : {
+                        marginTop: "".concat(end, "px"),
+                    }),
+                }, (0, jsx_runtime_1.jsx)("div", { style: fixedStyles.knobHitbox }), areLabelsVisible && (0, utils_1.cloneStyledElement)((_j = components.label) !== null && _j !== void 0 ? _j : (0, jsx_runtime_1.jsx)(exports.RangeSliderLabel, { style: (0, utils_1.styles)(defaultStyles === null || defaultStyles === void 0 ? void 0 : defaultStyles.label, {
                         transitionProperty: isReleasingEndKnob ? 'opacity, transform' : 'opacity',
                     }) }), {
                     className: (0, clsx_1.default)({
@@ -225,24 +196,24 @@ exports.RangeSlider = (0, react_2.forwardRef)(function (_a, ref) {
                         releasing: isReleasingEndKnob,
                     }),
                     style: (0, utils_1.styles)(fixedStyles.label),
-                }, Number(endValue.toFixed(decimalPlaces)).toLocaleString())))));
+                }, Number(endValue.toFixed(decimalPlaces)).toLocaleString()))] }) })));
 });
 Object.defineProperty(exports.RangeSlider, 'displayName', { value: 'RangeSlider', writable: false });
 exports.RangeSliderGutter = (0, react_2.forwardRef)(function (_a, ref) {
     var props = __rest(_a, []);
-    return react_2.default.createElement("div", __assign({}, props, { ref: ref, "data-child": 'gutter' }));
+    return (0, jsx_runtime_1.jsx)("div", __assign({}, props, { ref: ref, "data-child": 'gutter' }));
 });
 exports.RangeSliderLabel = (0, react_2.forwardRef)(function (_a, ref) {
     var props = __rest(_a, []);
-    return react_2.default.createElement("div", __assign({}, props, { ref: ref, "data-child": 'label' }));
+    return (0, jsx_runtime_1.jsx)("div", __assign({}, props, { ref: ref, "data-child": 'label' }));
 });
 exports.RangeSliderHighlight = (0, react_2.forwardRef)(function (_a, ref) {
     var props = __rest(_a, []);
-    return react_2.default.createElement("div", __assign({}, props, { ref: ref, "data-child": 'highlight' }));
+    return (0, jsx_runtime_1.jsx)("div", __assign({}, props, { ref: ref, "data-child": 'highlight' }));
 });
 exports.RangeSliderKnob = (0, react_2.forwardRef)(function (_a, ref) {
     var props = __rest(_a, []);
-    return react_2.default.createElement("div", __assign({}, props, { ref: ref, "data-child": 'knob' }));
+    return (0, jsx_runtime_1.jsx)("div", __assign({}, props, { ref: ref, "data-child": 'knob' }));
 });
 function getFixedStyles(_a) {
     var _b = _a.orientation, orientation = _b === void 0 ? 'horizontal' : _b, _c = _a.highlightLength, highlightLength = _c === void 0 ? 0 : _c, _d = _a.start, start = _d === void 0 ? 0 : _d, _e = _a.knobPadding, knobPadding = _e === void 0 ? 0 : _e;

package/components/RangeSlider.js.map

@@ -1 +1 @@
-{"version":3,"file":"RangeSlider.js","sourceRoot":"/","sources":["components/RangeSlider.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,8CAAuB;AACvB,gEAA+C;AAC/C,6CAAmH;AACnH,kEAAgE;AAChE,4CAA0C;AAC1C,kCAAmF;AAmBtE,QAAA,WAAW,GAAG,IAAA,kBAAU,EAAoE,UAAC,EAczG,EAAE,GAAG;;IAbJ,IAAA,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,wBAAuB,EAAvB,gBAAgB,mBAAG,IAAI,KAAA,EACvB,qBAAiB,EAAjB,aAAa,mBAAG,CAAC,KAAA,EACjB,mBAAgB,EAAhB,WAAW,mBAAG,EAAE,KAAA,EACX,QAAQ,SAAA,EACR,QAAQ,SAAA,EACb,mBAAwB,EAAxB,WAAW,mBAAG,UAAU,KAAA,EACjB,aAAa,WAAA,EACpB,aAAU,EAAV,KAAK,mBAAG,CAAC,CAAC,KAAA,EACV,yBAAyB,EAAzB,iBAAiB,mBAAG,KAAK,KAAA,EACzB,aAAa,mBAAA,EACV,KAAK,cAbgG,kKAczG,CADS;IAER,IAAM,kBAAkB,GAAG,UAAC,KAAa,IAAK,OAAA,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ,CAAC,EAA1C,CAA0C,CAAA;IACxF,IAAM,yBAAyB,GAAG,UAAC,YAAoB,IAAK,OAAA,YAAY,GAAG,CAAC,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAhF,CAAgF,CAAA;IAC5I,IAAM,kBAAkB,GAAG,UAAC,QAAgB,IAAK,OAAA,QAAQ,GAAG,CAAC,QAAQ,GAAG,QAAQ,CAAC,GAAG,QAAQ,EAA3C,CAA2C,CAAA;IAC5F,IAAM,sBAAsB,GAAG,UAAC,YAAoB,IAAK,OAAA,kBAAkB,CAAC,yBAAyB,CAAC,YAAY,CAAC,CAAC,EAA3D,CAA2D,CAAA;IACpH,IAAM,yBAAyB,GAAG,UAAC,QAAgB,IAAK,OAAA,QAAQ,GAAG,CAAC,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,EAA5E,CAA4E,CAAA;IACpI,IAAM,sBAAsB,GAAG,UAAC,KAAa,IAAK,OAAA,yBAAyB,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,EAApD,CAAoD,CAAA;IAEtG,IAAM,sBAAsB,GAAG,UAAC,KAAa;QAC3C,IAAM,CAAC,GAAG,WAAW,CAAC,MAAM,CAAA;QAC5B,IAAI,GAAG,GAAG,CAAC,CAAA;QACX,IAAI,IAAI,GAAG,QAAQ,CAAA;QAEnB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;YAC3B,IAAM,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,CAAA;YACxB,IAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC,CAAA;YAE7B,IAAI,CAAC,GAAG,IAAI,EAAE,CAAC;gBACb,IAAI,GAAG,CAAC,CAAA;gBACR,GAAG,GAAG,CAAC,CAAA;YACT,CAAC;QACH,CAAC;QAED,OAAO,WAAW,CAAC,GAAG,CAAC,CAAA;IACzB,CAAC,CAAA;IAED,IAAM,OAAO,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAA;IAC5C,IAAM,QAAQ,GAAG,IAAA,iBAAO,EAAC,OAAO,CAAC,CAAA;IACjC,IAAM,YAAY,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAA;IACjD,IAAM,UAAU,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAA;IACzC,IAAA,KAAA,OAAoB,IAAA,gBAAQ,EAAQ,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,IAAA,EAAzE,KAAK,QAAA,EAAE,QAAQ,QAA0D,CAAA;IAE1E,IAAA,KAAiH,IAAA,uCAAkB,EAAC,YAAY,EAAE;QACtJ,YAAY,EAAE,MAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,CAAC,CAAC,mCAAI,QAAQ;QAC5C,SAAS,EAAE,UAAC,KAAa,EAAE,EAAU,EAAE,EAAU;YAC/C,IAAM,KAAK,GAAG,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAA;YACpD,IAAM,IAAI,GAAG,sBAAsB,CAAC,QAAQ,CAAC,CAAA;YAC7C,IAAM,IAAI,GAAG,sBAAsB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAA;YAC7C,IAAM,KAAK,GAAG,sBAAsB,CAAC,KAAK,CAAC,GAAG,KAAK,CAAA;YAEnD,OAAO,sBAAsB,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,CAAA;QACtE,CAAC;KACF,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,EAVxE,KAAA,wBAAiC,EAApB,mBAAmB,QAAA,EAAG,KAAA,yBAAmC,EAArB,oBAAoB,QAAA,EAAG,KAAA,mBAAkC,EAA1B,UAAU,QAAA,EAAE,aAAa,QAUjC,CAAA;IAE1E,IAAA,KAAyG,IAAA,uCAAkB,EAAC,UAAU,EAAE;QAC5I,YAAY,EAAE,MAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,CAAC,CAAC,mCAAI,QAAQ;QAC5C,SAAS,EAAE,UAAC,KAAa,EAAE,EAAU,EAAE,EAAU;YAC/C,IAAM,KAAK,GAAG,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAA;YACpD,IAAM,IAAI,GAAG,sBAAsB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAA;YAC7C,IAAM,IAAI,GAAG,sBAAsB,CAAC,QAAQ,CAAC,CAAA;YAC7C,IAAM,KAAK,GAAG,sBAAsB,CAAC,KAAK,CAAC,GAAG,KAAK,CAAA;YAEnD,OAAO,sBAAsB,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,CAAA;QACtE,CAAC;KACF,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,EAVxE,KAAA,wBAA+B,EAAlB,iBAAiB,QAAA,EAAG,KAAA,yBAAiC,EAAnB,kBAAkB,QAAA,EAAG,KAAA,mBAA8B,EAAtB,QAAQ,QAAA,EAAE,WAAW,QAUzB,CAAA;IAEhF,IAAM,WAAW,gCAAI,QAAQ,UAAK,yBAAI,KAAK,CAAC,KAAK,CAAC,UAAE,GAAG,CAAC,UAAC,CAAC,EAAE,CAAC,IAAK,OAAA,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,QAAQ,GAAG,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAG,KAAK,CAAC,EAAxD,CAAwD,CAAC,YAAE,QAAQ,SAAC,CAAA;IAChI,IAAA,KAAA,OAAe,KAAK,CAAC,GAAG,CAAC,sBAAsB,CAAC,IAAA,EAA/C,KAAK,QAAA,EAAE,GAAG,QAAqC,CAAA;IACtD,IAAM,eAAe,GAAG,GAAG,GAAG,KAAK,CAAA;IAEnC,IAAA,iBAAS,EAAC;QACR,IAAI,KAAK,CAAC,CAAC,CAAC,KAAK,UAAU;YAAE,OAAM;QACnC,QAAQ,CAAC,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;QAChC,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,KAAK,CAAC,CAAA;IACxB,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAA;IAEhB,IAAA,iBAAS,EAAC;QACR,IAAI,KAAK,CAAC,CAAC,CAAC,KAAK,QAAQ;YAAE,OAAM;QACjC,QAAQ,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAA;QAC9B,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,KAAK,CAAC,CAAA;IACxB,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAA;IAEd,IAAA,iBAAS,EAAC;QACR,IAAI,mBAAmB,IAAI,iBAAiB,IAAI,IAAA,eAAW,EAAC,aAAa,EAAE,KAAK,CAAC;YAAE,OAAM;QACzF,QAAQ,CAAC,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAA;IACjD,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAA;IAEnB,IAAA,iBAAS,EAAC;QACR,IAAI,KAAK,GAAG,CAAC;YAAE,OAAM;QACrB,aAAa,CAAC,sBAAsB,CAAC,UAAU,CAAC,CAAC,CAAA;IACnD,CAAC,EAAE,CAAC,oBAAoB,CAAC,CAAC,CAAA;IAE1B,IAAA,iBAAS,EAAC;QACR,IAAI,KAAK,GAAG,CAAC,IAAI,CAAC,kBAAkB;YAAE,OAAM;QAC5C,WAAW,CAAC,sBAAsB,CAAC,QAAQ,CAAC,CAAC,CAAA;IAC/C,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAA;IAExB,IAAM,UAAU,GAAG,IAAA,uBAAe,EAAC,QAAQ,EAAE;QAC3C,MAAM,EAAE,yBAAiB;QACzB,SAAS,EAAE,4BAAoB;QAC/B,IAAI,EAAE,uBAAe;QACrB,KAAK,EAAE,wBAAgB;KACxB,CAAC,CAAA;IAEF,IAAM,WAAW,GAAG,cAAc,CAAC,EAAE,WAAW,aAAA,EAAE,eAAe,iBAAA,EAAE,KAAK,OAAA,EAAE,WAAW,aAAA,EAAE,CAAC,CAAA;IACxF,IAAM,aAAa,GAAG,iBAAiB,CAAC,CAAC,CAAC,gBAAgB,CAAC,EAAE,oBAAoB,sBAAA,EAAE,kBAAkB,oBAAA,EAAE,WAAW,aAAA,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAAA;IAEjI,OAAO,CACL,kDAAS,KAAK,IAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAA,cAAI,EAAC,SAAS,EAAE,WAAW,CAAC,oBAAiB,cAAc;QAC9F,uCAAK,GAAG,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,CAAC,IAAI;YACvC,IAAA,0BAAkB,EAAC,MAAA,UAAU,CAAC,MAAM,mCAAI,8BAAC,yBAAiB,IAAC,KAAK,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,MAAM,GAAG,EAAE;gBAC3F,KAAK,EAAE,IAAA,cAAM,EAAC,WAAW,CAAC,MAAM,CAAC;aAClC,CAAC;YACD,IAAA,0BAAkB,EAAC,MAAA,UAAU,CAAC,SAAS,mCAAI,8BAAC,4BAAoB,IAAC,KAAK,EAAE,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,SAAS,GAAG,EAAE;gBACpG,KAAK,EAAE,IAAA,cAAM,EAAC,WAAW,CAAC,SAAS,CAAC;aACrC,CAAC;YACD,IAAA,0BAAkB,EAAC,MAAA,UAAU,CAAC,IAAI,mCAAI,8BAAC,uBAAe,IAAC,KAAK,EAAE,IAAA,cAAM,EAAC,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,IAAI,EAAE;oBACzF,kBAAkB,EAAE,oBAAoB,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,SAAS;iBAC5E,CAAC,GAAG,EAAE;gBACL,GAAG,EAAE,YAAY;gBACjB,QAAQ,EAAE,IAAA,eAAW,EAAC,CAAC,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;gBACnE,SAAS,EAAE,IAAA,cAAI,EAAC;oBACd,QAAQ,EAAE,mBAAmB;oBAC7B,SAAS,EAAE,oBAAoB;iBAChC,CAAC;gBACF,KAAK,EAAE,IAAA,cAAM,EAAC,WAAW,CAAC,IAAI,EAAE;oBAC9B,aAAa,EAAE,IAAA,eAAW,EAAC,CAAC,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;iBAC3F,EAAE,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC;oBAChC,UAAU,EAAE,UAAG,KAAK,OAAI;iBACzB,CAAC,CAAC,CAAC;oBACF,SAAS,EAAE,UAAG,KAAK,OAAI;iBACxB,CAAC;aACH,EAAE,uCAAK,KAAK,EAAE,WAAW,CAAC,UAAU,GAAG,EAAE,gBAAgB;gBACxD,IAAA,0BAAkB,EAAC,MAAA,UAAU,CAAC,KAAK,mCAAI,8BAAC,wBAAgB,IAAC,KAAK,EAAE,IAAA,cAAM,EAAC,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,KAAK,EAAE;wBAC3F,kBAAkB,EAAE,oBAAoB,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,SAAS;qBAC5E,CAAC,GAAG,EAAE;oBACL,SAAS,EAAE,IAAA,cAAI,EAAC;wBACd,QAAQ,EAAE,mBAAmB,IAAI,iBAAiB;wBAClD,SAAS,EAAE,oBAAoB,IAAI,kBAAkB;qBACtD,CAAC;oBACF,KAAK,EAAE,IAAA,cAAM,EAAC,WAAW,CAAC,KAAK,CAAC;iBACjC,EAAE,MAAM,CAAC,UAAU,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC,cAAc,EAAE,CAAC,CAC/D;YACA,IAAA,0BAAkB,EAAC,MAAA,UAAU,CAAC,IAAI,mCAAI,8BAAC,uBAAe,IAAC,KAAK,EAAE,IAAA,cAAM,EAAC,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,IAAI,EAAE;oBACzF,kBAAkB,EAAE,kBAAkB,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,SAAS;iBAC1E,CAAC,GAAG,EAAE;gBACL,GAAG,EAAE,UAAU;gBACf,QAAQ,EAAE,IAAA,eAAW,EAAC,CAAC,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;gBACnE,SAAS,EAAE,IAAA,cAAI,EAAC;oBACd,QAAQ,EAAE,iBAAiB;oBAC3B,SAAS,EAAE,iBAAiB;iBAC7B,CAAC;gBACF,KAAK,EAAE,IAAA,cAAM,EAAC,WAAW,CAAC,IAAI,EAAE;oBAC9B,aAAa,EAAE,IAAA,eAAW,EAAC,CAAC,UAAU,EAAE,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;iBAC3F,EAAE,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC;oBAChC,UAAU,EAAE,UAAG,GAAG,OAAI;iBACvB,CAAC,CAAC,CAAC;oBACF,SAAS,EAAE,UAAG,GAAG,OAAI;iBACtB,CAAC;aACH,EAAE,uCAAK,KAAK,EAAE,WAAW,CAAC,UAAU,GAAG,EAAE,gBAAgB;gBACxD,IAAA,0BAAkB,EAAC,MAAA,UAAU,CAAC,KAAK,mCAAI,8BAAC,wBAAgB,IAAC,KAAK,EAAE,IAAA,cAAM,EAAC,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,KAAK,EAAE;wBAC3F,kBAAkB,EAAE,kBAAkB,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,SAAS;qBAC1E,CAAC,GAAG,EAAE;oBACL,SAAS,EAAE,IAAA,cAAI,EAAC;wBACd,QAAQ,EAAE,iBAAiB;wBAC3B,SAAS,EAAE,kBAAkB;qBAC9B,CAAC;oBACF,KAAK,EAAE,IAAA,cAAM,EAAC,WAAW,CAAC,KAAK,CAAC;iBACjC,EAAE,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC,cAAc,EAAE,CAAC,CAC7D,CACG,CACF,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,CAAC,cAAc,CAAC,mBAAW,EAAE,aAAa,EAAE,EAAE,KAAK,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAA;AAE/E,QAAA,iBAAiB,GAAG,IAAA,kBAAU,EAAiD,UAAC,EAAY,EAAE,GAAG;QAAZ,KAAK,cAAV,EAAY,CAAF;IAAY,OAAA,kDAAS,KAAK,IAAE,GAAG,EAAE,GAAG,gBAAa,QAAQ,IAAE,CAAA;CAAA,CAAC,CAAA;AAEtJ,QAAA,gBAAgB,GAAG,IAAA,kBAAU,EAAiD,UAAC,EAAY,EAAE,GAAG;QAAZ,KAAK,cAAV,EAAY,CAAF;IAAY,OAAA,kDAAS,KAAK,IAAE,GAAG,EAAE,GAAG,gBAAa,OAAO,IAAE,CAAA;CAAA,CAAC,CAAA;AAEpJ,QAAA,oBAAoB,GAAG,IAAA,kBAAU,EAAiD,UAAC,EAAY,EAAE,GAAG;QAAZ,KAAK,cAAV,EAAY,CAAF;IAAY,OAAA,kDAAS,KAAK,IAAE,GAAG,EAAE,GAAG,gBAAa,WAAW,IAAE,CAAA;CAAA,CAAC,CAAA;AAE5J,QAAA,eAAe,GAAG,IAAA,kBAAU,EAAiD,UAAC,EAAY,EAAE,GAAG;QAAZ,KAAK,cAAV,EAAY,CAAF;IAAY,OAAA,kDAAS,KAAK,IAAE,GAAG,EAAE,GAAG,gBAAa,MAAM,IAAE,CAAA;CAAA,CAAC,CAAA;AAE/J,SAAS,cAAc,CAAC,EAA+E;QAA7E,mBAA0B,EAA1B,WAAW,mBAAG,YAAY,KAAA,EAAE,uBAAmB,EAAnB,eAAe,mBAAG,CAAC,KAAA,EAAE,aAAS,EAAT,KAAK,mBAAG,CAAC,KAAA,EAAE,mBAAe,EAAf,WAAW,mBAAG,CAAC,KAAA;IACnG,OAAO,IAAA,mBAAW,EAAC;QACjB,IAAI,EAAE;YACJ,MAAM,EAAE,MAAM;YACd,KAAK,EAAE,MAAM;SACd;QACD,MAAM,EAAE;YACN,OAAO,EAAE,OAAO;YAChB,GAAG,EAAE,GAAG;YACR,IAAI,EAAE,GAAG;YACT,QAAQ,EAAE,UAAU;YACpB,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;SACf;QACD,SAAS,aACP,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,GAAG,EACT,QAAQ,EAAE,UAAU,EACpB,GAAG,EAAE,GAAG,IACL,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC;YAChC,KAAK,EAAE,UAAG,eAAe,OAAI;YAC7B,SAAS,EAAE,sBAAe,KAAK,cAAW;SAC3C,CAAC,CAAC,CAAC;YACF,MAAM,EAAE,UAAG,eAAe,OAAI;YAC9B,SAAS,EAAE,yBAAkB,KAAK,WAAQ;SAC3C,CACF;QACD,IAAI,EAAE;YACJ,MAAM,EAAE,GAAG;YACX,IAAI,EAAE,GAAG;YACT,MAAM,EAAE,MAAM;YACd,QAAQ,EAAE,UAAU;YACpB,KAAK,EAAE,GAAG;YACV,GAAG,EAAE,GAAG;YACR,WAAW,EAAE,MAAM;YACnB,MAAM,EAAE,GAAG;SACZ;QACD,UAAU,EAAE;YACV,UAAU,EAAE,aAAa;YACzB,MAAM,EAAE,sBAAe,WAAW,GAAG,CAAC,QAAK;YAC3C,IAAI,EAAE,WAAI,WAAW,OAAI;YACzB,OAAO,EAAE,UAAG,WAAW,OAAI;YAC3B,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,WAAI,WAAW,OAAI;YACxB,KAAK,EAAE,sBAAe,WAAW,GAAG,CAAC,QAAK;SAC3C;QACD,KAAK,EAAE;YACL,aAAa,EAAE,MAAM;YACrB,QAAQ,EAAE,UAAU;YACpB,UAAU,EAAE,MAAM;SACnB;KACF,CAAC,CAAA;AACJ,CAAC;AAED,SAAS,gBAAgB,CAAC,EAAwF;QAAtF,4BAA4B,EAA5B,oBAAoB,mBAAG,KAAK,KAAA,EAAE,0BAA0B,EAA1B,kBAAkB,mBAAG,KAAK,KAAA,EAAE,mBAA0B,EAA1B,WAAW,mBAAG,YAAY,KAAA;IAC9G,OAAO,IAAA,mBAAW,EAAC;QACjB,MAAM,EAAE;YACN,UAAU,EAAE,yBAAyB;SACtC;QACD,SAAS,EAAE;YACT,UAAU,EAAE,MAAM;YAClB,kBAAkB,EAAE,OAAO;YAC3B,kBAAkB,EAAE,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC,SAAS;YAC/H,wBAAwB,EAAE,UAAU;SACrC;QACD,IAAI,EAAE;YACJ,UAAU,EAAE,QAAQ;YACpB,UAAU,EAAE,MAAM;YAClB,YAAY,EAAE,MAAM;YACpB,SAAS,EAAE,YAAY;YACvB,OAAO,EAAE,MAAM;YACf,MAAM,EAAE,MAAM;YACd,cAAc,EAAE,QAAQ;YACxB,kBAAkB,EAAE,OAAO;YAC3B,wBAAwB,EAAE,UAAU;YACpC,KAAK,EAAE,MAAM;SACd;QACD,KAAK,aACH,UAAU,EAAE,aAAa,EACzB,KAAK,EAAE,MAAM,EACb,SAAS,EAAE,QAAQ,EACnB,kBAAkB,EAAE,OAAO,EAC3B,wBAAwB,EAAE,UAAU,IACjC,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC;YAChC,GAAG,EAAE,mBAAmB;SACzB,CAAC,CAAC,CAAC;YACF,IAAI,EAAE,mBAAmB;SAC1B,CACF;KACF,CAAC,CAAA;AACJ,CAAC","sourcesContent":["import clsx from 'clsx'\nimport isDeepEqual from 'fast-deep-equal/react'\nimport React, { forwardRef, useEffect, useRef, useState, type HTMLAttributes, type PropsWithChildren } from 'react'\nimport { useDragValueEffect } from '../hooks/useDragValueEffect'\nimport { useRect } from '../hooks/useRect'\nimport { asComponentDict, asStyleDict, cloneStyledElement, styles } from '../utils'\n\ntype Orientation = 'horizontal' | 'vertical'\n\ntype Range = [number, number]\n\nexport type RangeSliderProps = PropsWithChildren<{\n  areLabelsVisible?: boolean\n  decimalPlaces?: number\n  knobPadding?: number\n  max: number\n  min: number\n  orientation?: Orientation\n  range?: Range\n  steps?: number\n  usesDefaultStyles?: boolean\n  onRangeChange?: (range: Range) => void\n}>\n\nexport const RangeSlider = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement> & RangeSliderProps>(({\n  children,\n  className,\n  areLabelsVisible = true,\n  decimalPlaces = 2,\n  knobPadding = 20,\n  max: maxValue,\n  min: minValue,\n  orientation = 'vertical',\n  range: externalRange,\n  steps = -1,\n  usesDefaultStyles = false,\n  onRangeChange,\n  ...props\n}, ref) => {\n  const getPositionByValue = (value: number) => (value - minValue) / (maxValue - minValue)\n  const getPositionByDisplacement = (displacement: number) => displacement / (orientation === 'horizontal' ? bodyRect.width : bodyRect.height)\n  const getValueByPosition = (position: number) => position * (maxValue - minValue) + minValue\n  const getValueByDisplacement = (displacement: number) => getValueByPosition(getPositionByDisplacement(displacement))\n  const getDisplacementByPosition = (position: number) => position * (orientation === 'horizontal' ? bodyRect.width : bodyRect.height)\n  const getDisplacementByValue = (value: number) => getDisplacementByPosition(getPositionByValue(value))\n\n  const getClosestSteppedValue = (value: number) => {\n    const n = breakpoints.length\n    let idx = 0\n    let diff = Infinity\n\n    for (let i = 0; i < n; i++) {\n      const t = breakpoints[i]\n      const d = Math.abs(value - t)\n\n      if (d < diff) {\n        diff = d\n        idx = i\n      }\n    }\n\n    return breakpoints[idx]\n  }\n\n  const bodyRef = useRef<HTMLDivElement>(null)\n  const bodyRect = useRect(bodyRef)\n  const startKnobRef = useRef<HTMLDivElement>(null)\n  const endKnobRef = useRef<HTMLDivElement>(null)\n  const [range, setRange] = useState<Range>(externalRange ?? [minValue, maxValue])\n\n  const { isDragging: [isDraggingStartKnob], isReleasing: [isReleasingStartKnob], value: [startValue, setStartValue] } = useDragValueEffect(startKnobRef, {\n    initialValue: externalRange?.[0] ?? minValue,\n    transform: (value: number, dx: number, dy: number) => {\n      const delta = orientation === 'horizontal' ? dx : dy\n      const dMin = getDisplacementByValue(minValue)\n      const dMax = getDisplacementByValue(range[1])\n      const dCurr = getDisplacementByValue(value) + delta\n\n      return getValueByDisplacement(Math.max(dMin, Math.min(dMax, dCurr)))\n    },\n  }, [minValue, orientation, bodyRect.size.width, bodyRect.size.height, range[1]])\n\n  const { isDragging: [isDraggingEndKnob], isReleasing: [isReleasingEndKnob], value: [endValue, setEndValue] } = useDragValueEffect(endKnobRef, {\n    initialValue: externalRange?.[1] ?? maxValue,\n    transform: (value: number, dx: number, dy: number) => {\n      const delta = orientation === 'horizontal' ? dx : dy\n      const dMin = getDisplacementByValue(range[0])\n      const dMax = getDisplacementByValue(maxValue)\n      const dCurr = getDisplacementByValue(value) + delta\n\n      return getValueByDisplacement(Math.max(dMin, Math.min(dMax, dCurr)))\n    },\n  }, [maxValue, orientation, bodyRect.size.width, bodyRect.size.height, range[0]])\n\n  const breakpoints = [minValue, ...[...Array(steps)].map((v, i) => minValue + (i + 1) * (maxValue - minValue) / (1 + steps)), maxValue]\n  const [start, end] = range.map(getDisplacementByValue)\n  const highlightLength = end - start\n\n  useEffect(() => {\n    if (range[0] === startValue) return\n    setRange([startValue, range[1]])\n    onRangeChange?.(range)\n  }, [startValue])\n\n  useEffect(() => {\n    if (range[1] === endValue) return\n    setRange([range[0], endValue])\n    onRangeChange?.(range)\n  }, [endValue])\n\n  useEffect(() => {\n    if (isDraggingStartKnob || isDraggingEndKnob || isDeepEqual(externalRange, range)) return\n    setRange(externalRange ?? [minValue, maxValue])\n  }, [externalRange])\n\n  useEffect(() => {\n    if (steps < 0) return\n    setStartValue(getClosestSteppedValue(startValue))\n  }, [isReleasingStartKnob])\n\n  useEffect(() => {\n    if (steps < 0 || !isReleasingEndKnob) return\n    setEndValue(getClosestSteppedValue(endValue))\n  }, [isReleasingEndKnob])\n\n  const components = asComponentDict(children, {\n    gutter: RangeSliderGutter,\n    highlight: RangeSliderHighlight,\n    knob: RangeSliderKnob,\n    label: RangeSliderLabel,\n  })\n\n  const fixedStyles = getFixedStyles({ orientation, highlightLength, start, knobPadding })\n  const defaultStyles = usesDefaultStyles ? getDefaultStyles({ isReleasingStartKnob, isReleasingEndKnob, orientation }) : undefined\n\n  return (\n    <div {...props} ref={ref} className={clsx(className, orientation)} data-component='range-slider'>\n      <div ref={bodyRef} style={fixedStyles.body}>\n        {cloneStyledElement(components.gutter ?? <RangeSliderGutter style={defaultStyles?.gutter}/>, {\n          style: styles(fixedStyles.gutter),\n        })}\n        {cloneStyledElement(components.highlight ?? <RangeSliderHighlight style={defaultStyles?.highlight}/>, {\n          style: styles(fixedStyles.highlight),\n        })}\n        {cloneStyledElement(components.knob ?? <RangeSliderKnob style={styles(defaultStyles?.knob, {\n          transitionProperty: isReleasingStartKnob ? 'opacity, transform' : 'opacity',\n        })}/>, {\n          ref: startKnobRef,\n          disabled: isDeepEqual([startValue, endValue], [maxValue, maxValue]),\n          className: clsx({\n            dragging: isDraggingStartKnob,\n            releasing: isReleasingStartKnob,\n          }),\n          style: styles(fixedStyles.knob, {\n            pointerEvents: isDeepEqual([startValue, endValue], [minValue, minValue]) ? 'none' : 'auto',\n          }, orientation === 'horizontal' ? {\n            marginLeft: `${start}px`,\n          } : {\n            marginTop: `${start}px`,\n          }),\n        }, <div style={fixedStyles.knobHitbox}/>, areLabelsVisible &&\n          cloneStyledElement(components.label ?? <RangeSliderLabel style={styles(defaultStyles?.label, {\n            transitionProperty: isReleasingStartKnob ? 'opacity, transform' : 'opacity',\n          })}/>, {\n            className: clsx({\n              dragging: isDraggingStartKnob || isDraggingEndKnob,\n              releasing: isReleasingStartKnob || isReleasingEndKnob,\n            }),\n            style: styles(fixedStyles.label),\n          }, Number(startValue.toFixed(decimalPlaces)).toLocaleString())\n        )}\n        {cloneStyledElement(components.knob ?? <RangeSliderKnob style={styles(defaultStyles?.knob, {\n          transitionProperty: isReleasingEndKnob ? 'opacity, transform' : 'opacity',\n        })}/>, {\n          ref: endKnobRef,\n          disabled: isDeepEqual([startValue, endValue], [maxValue, maxValue]),\n          className: clsx({\n            dragging: isDraggingEndKnob,\n            releasing: isDraggingEndKnob,\n          }),\n          style: styles(fixedStyles.knob, {\n            pointerEvents: isDeepEqual([startValue, endValue], [maxValue, maxValue]) ? 'none' : 'auto',\n          }, orientation === 'horizontal' ? {\n            marginLeft: `${end}px`,\n          } : {\n            marginTop: `${end}px`,\n          }),\n        }, <div style={fixedStyles.knobHitbox}/>, areLabelsVisible &&\n          cloneStyledElement(components.label ?? <RangeSliderLabel style={styles(defaultStyles?.label, {\n            transitionProperty: isReleasingEndKnob ? 'opacity, transform' : 'opacity',\n          })}/>, {\n            className: clsx({\n              dragging: isDraggingEndKnob,\n              releasing: isReleasingEndKnob,\n            }),\n            style: styles(fixedStyles.label),\n          }, Number(endValue.toFixed(decimalPlaces)).toLocaleString())\n        )}\n      </div>\n    </div>\n  )\n})\n\nObject.defineProperty(RangeSlider, 'displayName', { value: 'RangeSlider', writable: false })\n\nexport const RangeSliderGutter = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='gutter'/>)\n\nexport const RangeSliderLabel = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='label'/>)\n\nexport const RangeSliderHighlight = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='highlight'/>)\n\nexport const RangeSliderKnob = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='knob'/>)\n\nfunction getFixedStyles({ orientation = 'horizontal', highlightLength = 0, start = 0, knobPadding = 0 }) {\n  return asStyleDict({\n    body: {\n      height: '100%',\n      width: '100%',\n    },\n    gutter: {\n      display: 'block',\n      top: '0',\n      left: '0',\n      position: 'absolute',\n      width: '100%',\n      height: '100%',\n    },\n    highlight: {\n      height: '100%',\n      left: '0',\n      position: 'absolute',\n      top: '0',\n      ...orientation === 'horizontal' ? {\n        width: `${highlightLength}px`,\n        transform: `translate3d(${start}px, 0, 0)`,\n      } : {\n        height: `${highlightLength}px`,\n        transform: `translate3d(0, ${start}px, 0)`,\n      },\n    },\n    knob: {\n      bottom: '0',\n      left: '0',\n      margin: 'auto',\n      position: 'absolute',\n      right: '0',\n      top: '0',\n      touchAction: 'none',\n      zIndex: '1',\n    },\n    knobHitbox: {\n      background: 'transparent',\n      height: `calc(100% + ${knobPadding * 2}px)`,\n      left: `-${knobPadding}px`,\n      padding: `${knobPadding}px`,\n      position: 'absolute',\n      top: `-${knobPadding}px`,\n      width: `calc(100% + ${knobPadding * 2}px)`,\n    },\n    label: {\n      pointerEvents: 'none',\n      position: 'relative',\n      userSelect: 'none',\n    },\n  })\n}\n\nfunction getDefaultStyles({ isReleasingStartKnob = false, isReleasingEndKnob = false, orientation = 'horizontal' }) {\n  return asStyleDict({\n    gutter: {\n      background: 'rgba(255, 255, 255, .2)',\n    },\n    highlight: {\n      background: '#fff',\n      transitionDuration: '100ms',\n      transitionProperty: (isReleasingStartKnob ? !isReleasingEndKnob : isReleasingEndKnob) ? 'opacity, width, transform' : 'opacity',\n      transitionTimingFunction: 'ease-out',\n    },\n    knob: {\n      alignItems: 'center',\n      background: '#fff',\n      borderRadius: '10px',\n      boxSizing: 'border-box',\n      display: 'flex',\n      height: '20px',\n      justifyContent: 'center',\n      transitionDuration: '100ms',\n      transitionTimingFunction: 'ease-out',\n      width: '20px',\n    },\n    label: {\n      background: 'transparent',\n      color: '#fff',\n      textAlign: 'center',\n      transitionDuration: '100ms',\n      transitionTimingFunction: 'ease-out',\n      ...orientation === 'horizontal' ? {\n        top: 'calc(100% + 10px)',\n      } : {\n        left: 'calc(100% + 10px)',\n      },\n    },\n  })\n}\n"]}
+{"version":3,"file":"RangeSlider.js","sourceRoot":"/","sources":["components/RangeSlider.tsx"],"names":[],"mappings":"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","sourcesContent":["import clsx from 'clsx'\nimport isDeepEqual from 'fast-deep-equal/react'\nimport { forwardRef, useEffect, useRef, useState, type HTMLAttributes, type PropsWithChildren } from 'react'\nimport { useDragValueEffect } from '../hooks/useDragValueEffect'\nimport { useRect } from '../hooks/useRect'\nimport { asComponentDict, asStyleDict, cloneStyledElement, styles } from '../utils'\n\ntype Orientation = 'horizontal' | 'vertical'\n\ntype Range = [number, number]\n\nexport type RangeSliderProps = PropsWithChildren<{\n  areLabelsVisible?: boolean\n  decimalPlaces?: number\n  knobPadding?: number\n  max: number\n  min: number\n  orientation?: Orientation\n  range?: Range\n  steps?: number\n  usesDefaultStyles?: boolean\n  onRangeChange?: (range: Range) => void\n}>\n\nexport const RangeSlider = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement> & RangeSliderProps>(({\n  children,\n  className,\n  areLabelsVisible = true,\n  decimalPlaces = 2,\n  knobPadding = 20,\n  max: maxValue,\n  min: minValue,\n  orientation = 'vertical',\n  range: externalRange,\n  steps = -1,\n  usesDefaultStyles = false,\n  onRangeChange,\n  ...props\n}, ref) => {\n  const getPositionByValue = (value: number) => (value - minValue) / (maxValue - minValue)\n  const getPositionByDisplacement = (displacement: number) => displacement / (orientation === 'horizontal' ? bodyRect.width : bodyRect.height)\n  const getValueByPosition = (position: number) => position * (maxValue - minValue) + minValue\n  const getValueByDisplacement = (displacement: number) => getValueByPosition(getPositionByDisplacement(displacement))\n  const getDisplacementByPosition = (position: number) => position * (orientation === 'horizontal' ? bodyRect.width : bodyRect.height)\n  const getDisplacementByValue = (value: number) => getDisplacementByPosition(getPositionByValue(value))\n\n  const getClosestSteppedValue = (value: number) => {\n    const n = breakpoints.length\n    let idx = 0\n    let diff = Infinity\n\n    for (let i = 0; i < n; i++) {\n      const t = breakpoints[i]\n      const d = Math.abs(value - t)\n\n      if (d < diff) {\n        diff = d\n        idx = i\n      }\n    }\n\n    return breakpoints[idx]\n  }\n\n  const bodyRef = useRef<HTMLDivElement>(null)\n  const bodyRect = useRect(bodyRef)\n  const startKnobRef = useRef<HTMLDivElement>(null)\n  const endKnobRef = useRef<HTMLDivElement>(null)\n  const [range, setRange] = useState<Range>(externalRange ?? [minValue, maxValue])\n\n  const { isDragging: [isDraggingStartKnob], isReleasing: [isReleasingStartKnob], value: [startValue, setStartValue] } = useDragValueEffect(startKnobRef, {\n    initialValue: externalRange?.[0] ?? minValue,\n    transform: (value: number, dx: number, dy: number) => {\n      const delta = orientation === 'horizontal' ? dx : dy\n      const dMin = getDisplacementByValue(minValue)\n      const dMax = getDisplacementByValue(range[1])\n      const dCurr = getDisplacementByValue(value) + delta\n\n      return getValueByDisplacement(Math.max(dMin, Math.min(dMax, dCurr)))\n    },\n  }, [minValue, orientation, bodyRect.size.width, bodyRect.size.height, range[1]])\n\n  const { isDragging: [isDraggingEndKnob], isReleasing: [isReleasingEndKnob], value: [endValue, setEndValue] } = useDragValueEffect(endKnobRef, {\n    initialValue: externalRange?.[1] ?? maxValue,\n    transform: (value: number, dx: number, dy: number) => {\n      const delta = orientation === 'horizontal' ? dx : dy\n      const dMin = getDisplacementByValue(range[0])\n      const dMax = getDisplacementByValue(maxValue)\n      const dCurr = getDisplacementByValue(value) + delta\n\n      return getValueByDisplacement(Math.max(dMin, Math.min(dMax, dCurr)))\n    },\n  }, [maxValue, orientation, bodyRect.size.width, bodyRect.size.height, range[0]])\n\n  const breakpoints = [minValue, ...[...Array(steps)].map((v, i) => minValue + (i + 1) * (maxValue - minValue) / (1 + steps)), maxValue]\n  const [start, end] = range.map(getDisplacementByValue)\n  const highlightLength = end - start\n\n  useEffect(() => {\n    if (range[0] === startValue) return\n    setRange([startValue, range[1]])\n    onRangeChange?.(range)\n  }, [startValue])\n\n  useEffect(() => {\n    if (range[1] === endValue) return\n    setRange([range[0], endValue])\n    onRangeChange?.(range)\n  }, [endValue])\n\n  useEffect(() => {\n    if (isDraggingStartKnob || isDraggingEndKnob || isDeepEqual(externalRange, range)) return\n    setRange(externalRange ?? [minValue, maxValue])\n  }, [externalRange])\n\n  useEffect(() => {\n    if (steps < 0) return\n    setStartValue(getClosestSteppedValue(startValue))\n  }, [isReleasingStartKnob])\n\n  useEffect(() => {\n    if (steps < 0 || !isReleasingEndKnob) return\n    setEndValue(getClosestSteppedValue(endValue))\n  }, [isReleasingEndKnob])\n\n  const components = asComponentDict(children, {\n    gutter: RangeSliderGutter,\n    highlight: RangeSliderHighlight,\n    knob: RangeSliderKnob,\n    label: RangeSliderLabel,\n  })\n\n  const fixedStyles = getFixedStyles({ orientation, highlightLength, start, knobPadding })\n  const defaultStyles = usesDefaultStyles ? getDefaultStyles({ isReleasingStartKnob, isReleasingEndKnob, orientation }) : undefined\n\n  return (\n    <div {...props} ref={ref} className={clsx(className, orientation)} data-component='range-slider'>\n      <div ref={bodyRef} style={fixedStyles.body}>\n        {cloneStyledElement(components.gutter ?? <RangeSliderGutter style={defaultStyles?.gutter}/>, {\n          style: styles(fixedStyles.gutter),\n        })}\n        {cloneStyledElement(components.highlight ?? <RangeSliderHighlight style={defaultStyles?.highlight}/>, {\n          style: styles(fixedStyles.highlight),\n        })}\n        {cloneStyledElement(components.knob ?? <RangeSliderKnob\n          style={styles(defaultStyles?.knob, {\n            transitionProperty: isReleasingStartKnob ? 'opacity, transform' : 'opacity',\n          })}\n        />, {\n          ref: startKnobRef,\n          disabled: isDeepEqual([startValue, endValue], [maxValue, maxValue]),\n          className: clsx({\n            dragging: isDraggingStartKnob,\n            releasing: isReleasingStartKnob,\n          }),\n          style: styles(fixedStyles.knob, {\n            pointerEvents: isDeepEqual([startValue, endValue], [minValue, minValue]) ? 'none' : 'auto',\n          }, orientation === 'horizontal' ? {\n            marginLeft: `${start}px`,\n          } : {\n            marginTop: `${start}px`,\n          }),\n        }, <div style={fixedStyles.knobHitbox}/>, areLabelsVisible && cloneStyledElement(components.label ?? <RangeSliderLabel\n          style={styles(defaultStyles?.label, {\n            transitionProperty: isReleasingStartKnob ? 'opacity, transform' : 'opacity',\n          })}\n        />, {\n          className: clsx({\n            dragging: isDraggingStartKnob || isDraggingEndKnob,\n            releasing: isReleasingStartKnob || isReleasingEndKnob,\n          }),\n          style: styles(fixedStyles.label),\n        }, Number(startValue.toFixed(decimalPlaces)).toLocaleString()))}\n        {cloneStyledElement(components.knob ?? <RangeSliderKnob\n          style={styles(defaultStyles?.knob, {\n            transitionProperty: isReleasingEndKnob ? 'opacity, transform' : 'opacity',\n          })}\n        />, {\n          ref: endKnobRef,\n          disabled: isDeepEqual([startValue, endValue], [maxValue, maxValue]),\n          className: clsx({\n            dragging: isDraggingEndKnob,\n            releasing: isDraggingEndKnob,\n          }),\n          style: styles(fixedStyles.knob, {\n            pointerEvents: isDeepEqual([startValue, endValue], [maxValue, maxValue]) ? 'none' : 'auto',\n          }, orientation === 'horizontal' ? {\n            marginLeft: `${end}px`,\n          } : {\n            marginTop: `${end}px`,\n          }),\n        }, <div style={fixedStyles.knobHitbox}/>, areLabelsVisible && cloneStyledElement(components.label ?? <RangeSliderLabel\n          style={styles(defaultStyles?.label, {\n            transitionProperty: isReleasingEndKnob ? 'opacity, transform' : 'opacity',\n          })}\n        />, {\n          className: clsx({\n            dragging: isDraggingEndKnob,\n            releasing: isReleasingEndKnob,\n          }),\n          style: styles(fixedStyles.label),\n        }, Number(endValue.toFixed(decimalPlaces)).toLocaleString()))}\n      </div>\n    </div>\n  )\n})\n\nObject.defineProperty(RangeSlider, 'displayName', { value: 'RangeSlider', writable: false })\n\nexport const RangeSliderGutter = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='gutter'/>)\n\nexport const RangeSliderLabel = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='label'/>)\n\nexport const RangeSliderHighlight = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='highlight'/>)\n\nexport const RangeSliderKnob = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref} data-child='knob'/>)\n\nfunction getFixedStyles({ orientation = 'horizontal', highlightLength = 0, start = 0, knobPadding = 0 }) {\n  return asStyleDict({\n    body: {\n      height: '100%',\n      width: '100%',\n    },\n    gutter: {\n      display: 'block',\n      top: '0',\n      left: '0',\n      position: 'absolute',\n      width: '100%',\n      height: '100%',\n    },\n    highlight: {\n      height: '100%',\n      left: '0',\n      position: 'absolute',\n      top: '0',\n      ...orientation === 'horizontal' ? {\n        width: `${highlightLength}px`,\n        transform: `translate3d(${start}px, 0, 0)`,\n      } : {\n        height: `${highlightLength}px`,\n        transform: `translate3d(0, ${start}px, 0)`,\n      },\n    },\n    knob: {\n      bottom: '0',\n      left: '0',\n      margin: 'auto',\n      position: 'absolute',\n      right: '0',\n      top: '0',\n      touchAction: 'none',\n      zIndex: '1',\n    },\n    knobHitbox: {\n      background: 'transparent',\n      height: `calc(100% + ${knobPadding * 2}px)`,\n      left: `-${knobPadding}px`,\n      padding: `${knobPadding}px`,\n      position: 'absolute',\n      top: `-${knobPadding}px`,\n      width: `calc(100% + ${knobPadding * 2}px)`,\n    },\n    label: {\n      pointerEvents: 'none',\n      position: 'relative',\n      userSelect: 'none',\n    },\n  })\n}\n\nfunction getDefaultStyles({ isReleasingStartKnob = false, isReleasingEndKnob = false, orientation = 'horizontal' }) {\n  return asStyleDict({\n    gutter: {\n      background: 'rgba(255, 255, 255, .2)',\n    },\n    highlight: {\n      background: '#fff',\n      transitionDuration: '100ms',\n      transitionProperty: (isReleasingStartKnob ? !isReleasingEndKnob : isReleasingEndKnob) ? 'opacity, width, transform' : 'opacity',\n      transitionTimingFunction: 'ease-out',\n    },\n    knob: {\n      alignItems: 'center',\n      background: '#fff',\n      borderRadius: '10px',\n      boxSizing: 'border-box',\n      display: 'flex',\n      height: '20px',\n      justifyContent: 'center',\n      transitionDuration: '100ms',\n      transitionTimingFunction: 'ease-out',\n      width: '20px',\n    },\n    label: {\n      background: 'transparent',\n      color: '#fff',\n      textAlign: 'center',\n      transitionDuration: '100ms',\n      transitionTimingFunction: 'ease-out',\n      ...orientation === 'horizontal' ? {\n        top: 'calc(100% + 10px)',\n      } : {\n        left: 'calc(100% + 10px)',\n      },\n    },\n  })\n}\n"]}