etudes 5.2.0 → 5.3.0

package/components/RotatingGallery.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RotatingGallery.js","sourceRoot":"/","sources":["components/RotatingGallery.tsx"],"names":[],"mappings":"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","sourcesContent":["import clsx from 'clsx'\nimport { forwardRef, useEffect, type ComponentType, type HTMLAttributes, type PropsWithChildren } from 'react'\nimport { useInterval } from '../hooks/useInterval'\nimport { Each } from '../operators/Each'\nimport { asClassNameDict, asStyleDict, styles } from '../utils'\n\nexport type RotatingGalleryImageProps = HTMLAttributes<HTMLElement> & {\n  index: number\n  isVisible: boolean\n  src: string\n}\n\nexport type RotatingGalleryProps = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{\n  /**\n   * Current image index. An error is thrown if the index is invalid (must be\n   * between 0 and length of `srcs` - 1, inclusive). This prop supports two-way\n   * binding.\n   */\n  index?: number\n\n  /**\n   * Specifies if lazy loading of images should be enabled.\n   */\n  lazy?: boolean\n\n  /**\n   * The duration of one rotation in milliseconds (how long one image stays\n   * before transitioning to the next). Specifying `NaN` or a negative number\n   * will prevent the component from automatically rotating.\n   */\n  rotationDuration?: number\n\n  /**\n   * An array of image paths.\n   */\n  srcs?: string[]\n\n  /**\n   * The duration of an image transition in milliseconds.\n   */\n  transitionDuration?: number\n\n  /**\n   * Specifies if the component should use default styles.\n   */\n  usesDefaultStyles?: boolean\n\n  /**\n   * Handler invoked when the image index changes.\n   *\n   * @param index The current image index.\n   */\n  onIndexChange?: (index: number) => void\n\n  /**\n   * Component type for generating images in this collection.\n   */\n  ImageComponent?: ComponentType<RotatingGalleryImageProps>\n}>\n\n/**\n * A component displaying rotating images.\n */\nexport const RotatingGallery = forwardRef<HTMLDivElement, RotatingGalleryProps>(({\n  children,\n  className,\n  index = 0,\n  lazy = true,\n  rotationDuration = 5000,\n  srcs = [],\n  transitionDuration = 500,\n  usesDefaultStyles = true,\n  onIndexChange,\n  ImageComponent,\n  ...props\n}, ref) => {\n  const handleIndexChange = (newValue: number) => {\n    onIndexChange?.(newValue)\n  }\n\n  const fixedClassNames = getFixedClassNames()\n  const fixedStyles = getFixedStyles({ transitionDuration })\n  const defaultStyles = usesDefaultStyles ? getDefaultStyles() : undefined\n\n  useInterval(() => {\n    handleIndexChange((index + 1) % srcs.length)\n  }, rotationDuration, undefined, [JSON.stringify(srcs), index])\n\n  useEffect(() => {\n    onIndexChange?.(index)\n  }, [index])\n\n  return (\n    <div {...props} ref={ref} className={clsx(className, fixedClassNames.root)} data-component='rotating-gallery'>\n      <Each in={srcs}>\n        {(src, idx) => {\n          const isVisible = idx === index\n\n          return ImageComponent ? (\n            <ImageComponent\n              className={clsx(fixedClassNames.image)}\n              data-child='item'\n              index={idx}\n              isVisible={isVisible}\n              src={src}\n              style={styles(\n                fixedStyles.image,\n                defaultStyles?.image,\n                usesDefaultStyles ? {\n                  opacity: isVisible ? '1' : '0',\n                } : {},\n              )}\n            />\n          ) : (\n            <img\n              className={clsx(fixedClassNames.image)}\n              data-child='item'\n              loading={lazy ? 'lazy' : 'eager'}\n              src={src}\n              style={styles(\n                fixedStyles.image,\n                defaultStyles?.image,\n                usesDefaultStyles ? {\n                  opacity: isVisible ? '1' : '0',\n                } : {},\n              )}\n            />\n          )\n        }}\n      </Each>\n    </div>\n  )\n})\n\nObject.defineProperty(RotatingGallery, 'displayName', { value: 'RotatingGallery', writable: false })\n\nfunction getFixedClassNames() {\n  return asClassNameDict({\n    root: clsx('rotating-gallery'),\n    image: clsx('image'),\n  })\n}\n\nfunction getFixedStyles({ transitionDuration = 0 }) {\n  return asStyleDict({\n    image: {\n      height: '100%',\n      left: '0',\n      position: 'absolute',\n      top: '0',\n      width: '100%',\n      transitionDuration: `${transitionDuration}ms`,\n    },\n  })\n}\n\nfunction getDefaultStyles() {\n  return asStyleDict({\n    image: {\n      transitionProperty: 'opacity',\n      transitionTimingFunction: 'linear',\n    },\n  })\n}\n"]}

package/components/SelectableButton.d.ts

@@ -1,19 +0,0 @@
-import { type HTMLAttributes, type ReactNode } from 'react';
-export type SelectableButtonProps = Omit<HTMLAttributes<HTMLButtonElement>, 'children'> & {
-    children?: (props: Pick<SelectableButtonProps, 'isDeselectable' | 'isDisabled' | 'isSelected' | 'label'>) => ReactNode;
-    isDeselectable?: boolean;
-    isDisabled?: boolean;
-    isSelected?: boolean;
-    label?: string;
-    onDeselect?: () => void;
-    onSelect?: () => void;
-};
-export declare const SelectableButton: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLButtonElement>, "children"> & {
-    children?: (props: Pick<SelectableButtonProps, "isDeselectable" | "isDisabled" | "isSelected" | "label">) => ReactNode;
-    isDeselectable?: boolean;
-    isDisabled?: boolean;
-    isSelected?: boolean;
-    label?: string;
-    onDeselect?: () => void;
-    onSelect?: () => void;
-} & import("react").RefAttributes<HTMLButtonElement>>;

package/components/SelectableButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SelectableButton.js","sourceRoot":"/","sources":["components/SelectableButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAA4F;AAY/E,QAAA,gBAAgB,GAAG,IAAA,kBAAU,EAA2C,UAAC,EASrF,EAAE,GAAG;;IARJ,IAAA,QAAQ,cAAA,EACR,sBAAsB,EAAtB,cAAc,mBAAG,KAAK,KAAA,EACtB,kBAAkB,EAAlB,UAAU,mBAAG,KAAK,KAAA,EAClB,kBAAsC,EAA1B,kBAAkB,mBAAG,KAAK,KAAA,EACtC,KAAK,WAAA,EACL,UAAU,gBAAA,EACV,QAAQ,cAAA,EACL,KAAK,cAR4E,6FASrF,CADS;IAEF,IAAA,KAAA,OAA8B,IAAA,gBAAQ,EAAC,kBAAkB,CAAC,IAAA,EAAzD,UAAU,QAAA,EAAE,aAAa,QAAgC,CAAA;IAEhE,IAAM,eAAe,GAAG;QACtB,IAAI,UAAU;YAAE,OAAM;QAEtB,IAAI,UAAU,EAAE,CAAC;YACf,IAAI,CAAC,cAAc;gBAAE,OAAM;YAC3B,aAAa,CAAC,KAAK,CAAC,CAAA;YACpB,UAAU,aAAV,UAAU,uBAAV,UAAU,EAAI,CAAA;QAChB,CAAC;aACI,CAAC;YACJ,aAAa,CAAC,IAAI,CAAC,CAAA;YACnB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,EAAI,CAAA;QACd,CAAC;IACH,CAAC,CAAA;IAED,IAAA,iBAAS,EAAC;QACR,aAAa,CAAC,kBAAkB,CAAC,CAAA;IACnC,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAA;IAExB,OAAO,CACL,8CACM,KAAK,IACT,GAAG,EAAE,GAAG,oBACO,mBAAmB,EAClC,QAAQ,EAAE,UAAU,IAAI,UAAU,IAAI,CAAC,cAAc,EACrD,OAAO,EAAE,cAAM,OAAA,eAAe,EAAE,EAAjB,CAAiB,YAE/B,MAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,EAAE,cAAc,gBAAA,EAAE,UAAU,YAAA,EAAE,UAAU,YAAA,EAAE,KAAK,OAAA,EAAE,CAAC,mCAAI,KAAK,IAChE,CACV,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,CAAC,cAAc,CAAC,wBAAgB,EAAE,aAAa,EAAE,EAAE,KAAK,EAAE,kBAAkB,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAA","sourcesContent":["import { forwardRef, useEffect, useState, type HTMLAttributes, type ReactNode } from 'react'\n\nexport type SelectableButtonProps = Omit<HTMLAttributes<HTMLButtonElement>, 'children'> & {\n  children?: (props: Pick<SelectableButtonProps, 'isDeselectable' | 'isDisabled' | 'isSelected' | 'label'>) => ReactNode\n  isDeselectable?: boolean\n  isDisabled?: boolean\n  isSelected?: boolean\n  label?: string\n  onDeselect?: () => void\n  onSelect?: () => void\n}\n\nexport const SelectableButton = forwardRef<HTMLButtonElement, SelectableButtonProps>(({\n  children,\n  isDeselectable = false,\n  isDisabled = false,\n  isSelected: externalIsSelected = false,\n  label,\n  onDeselect,\n  onSelect,\n  ...props\n}, ref) => {\n  const [isSelected, setIsSelected] = useState(externalIsSelected)\n\n  const toggleSelection = () => {\n    if (isDisabled) return\n\n    if (isSelected) {\n      if (!isDeselectable) return\n      setIsSelected(false)\n      onDeselect?.()\n    }\n    else {\n      setIsSelected(true)\n      onSelect?.()\n    }\n  }\n\n  useEffect(() => {\n    setIsSelected(externalIsSelected)\n  }, [externalIsSelected])\n\n  return (\n    <button\n      {...props}\n      ref={ref}\n      data-component='selectable-button'\n      disabled={isDisabled || isSelected && !isDeselectable}\n      onClick={() => toggleSelection()}\n    >\n      {children?.({ isDeselectable, isDisabled, isSelected, label }) ?? label}\n    </button>\n  )\n})\n\nObject.defineProperty(SelectableButton, 'displayName', { value: 'SelectableButton', writable: false })\n"]}

package/components/Slider.d.ts

@@ -1,160 +0,0 @@
-import { type HTMLAttributes, type PropsWithChildren } from 'react';
-type Orientation = 'horizontal' | 'vertical';
-export type SliderProps = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{
-    /**
-     * By default the position is a value from 0 - 1, 0 being the start of the
-     * slider and 1 being the end. Switching on this flag inverts this behavior,
-     * where 0 becomes the end of the slider and 1 being the start.
-     */
-    isInverted?: boolean;
-    /**
-     * Specifies if the track is clickable to set the position of the knob.
-     */
-    isTrackInteractive?: boolean;
-    /**
-     * Indicates if position change events are dispatched only when dragging ends.
-     * When disabled, aforementioned events are fired repeatedly while dragging.
-     */
-    onlyDispatchesOnDragEnd?: boolean;
-    /**
-     * Padding between the track and the knob in pixels.
-     */
-    trackPadding?: number;
-    /**
-     * Height of the knob in pixels.
-     */
-    knobHeight?: number;
-    /**
-     * Width of the knob in pixels.
-     */
-    knobWidth?: number;
-    /**
-     * Orientation of the slider.
-     */
-    orientation?: Orientation;
-    /**
-     * The current position.
-     */
-    position?: number;
-    /**
-     * A function that returns the label to be displayed at a given slider
-     * position.
-     *
-     * @param position The current slider position.
-     *
-     * @returns The label.
-     */
-    labelProvider?: (position: number) => string;
-    /**
-     * Specifies if the component should use default styles.
-     */
-    usesDefaultStyles?: boolean;
-    /**
-     * Handler invoked when position changes. This can either be invoked from the
-     * `position` prop being changed or from the slider being dragged. Note that
-     * if the event is emitted at the end of dragging due to
-     * `onlyDispatchesOnDragEnd` set to `true`, the `isDragging` parameter here is
-     * still `true`.
-     *
-     * @param position The current slider position.
-     * @param isDragging Specifies if the position change is due to dragging.
-     */
-    onPositionChange?: (position: number, isDragging: boolean) => void;
-    /**
-     * Handler invoked when dragging ends.
-     */
-    onDragEnd?: () => void;
-    /**
-     * Handler invoked when dragging begins.
-     */
-    onDragStart?: () => void;
-}>;
-/**
- * A slider component supporting both horizontal and vertical orientations whose
- * sliding position (a decimal between 0.0 and 1.0, inclusive) can be two-way
- * binded. The component consists of three customizable elements: a draggable
- * knob, a label on the knob, and a scroll track on either side of the knob.
- * While the width and height of the slider is inferred from its CSS rules, the
- * width and height of the knob are set via props (`knobWidth` and `knobHeight`,
- * respectively). The size of the knob does not impact the size of the slider.
- *
- * @exports SliderKnob The component for the knob.
- * @exports SliderLabel The component for the label on the knob.
- * @exports SliderTrack The component for the slide track on either side of the
- *                      knob.
- */
-export declare const Slider: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
-    /**
-     * By default the position is a value from 0 - 1, 0 being the start of the
-     * slider and 1 being the end. Switching on this flag inverts this behavior,
-     * where 0 becomes the end of the slider and 1 being the start.
-     */
-    isInverted?: boolean;
-    /**
-     * Specifies if the track is clickable to set the position of the knob.
-     */
-    isTrackInteractive?: boolean;
-    /**
-     * Indicates if position change events are dispatched only when dragging ends.
-     * When disabled, aforementioned events are fired repeatedly while dragging.
-     */
-    onlyDispatchesOnDragEnd?: boolean;
-    /**
-     * Padding between the track and the knob in pixels.
-     */
-    trackPadding?: number;
-    /**
-     * Height of the knob in pixels.
-     */
-    knobHeight?: number;
-    /**
-     * Width of the knob in pixels.
-     */
-    knobWidth?: number;
-    /**
-     * Orientation of the slider.
-     */
-    orientation?: Orientation;
-    /**
-     * The current position.
-     */
-    position?: number;
-    /**
-     * A function that returns the label to be displayed at a given slider
-     * position.
-     *
-     * @param position The current slider position.
-     *
-     * @returns The label.
-     */
-    labelProvider?: (position: number) => string;
-    /**
-     * Specifies if the component should use default styles.
-     */
-    usesDefaultStyles?: boolean;
-    /**
-     * Handler invoked when position changes. This can either be invoked from the
-     * `position` prop being changed or from the slider being dragged. Note that
-     * if the event is emitted at the end of dragging due to
-     * `onlyDispatchesOnDragEnd` set to `true`, the `isDragging` parameter here is
-     * still `true`.
-     *
-     * @param position The current slider position.
-     * @param isDragging Specifies if the position change is due to dragging.
-     */
-    onPositionChange?: (position: number, isDragging: boolean) => void;
-    /**
-     * Handler invoked when dragging ends.
-     */
-    onDragEnd?: () => void;
-    /**
-     * Handler invoked when dragging begins.
-     */
-    onDragStart?: () => void;
-} & {
-    children?: import("react").ReactNode | undefined;
-} & import("react").RefAttributes<HTMLDivElement>>;
-export declare const SliderTrack: ({ ...props }: HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-export declare const SliderKnob: ({ ...props }: HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-export declare const SliderLabel: ({ ...props }: HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-export {};

package/components/Slider.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Slider.js","sourceRoot":"/","sources":["components/Slider.tsx"],"names":[],"mappings":"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","sourcesContent":["import clsx from 'clsx'\nimport { forwardRef, useEffect, useRef, type HTMLAttributes, type MouseEvent, type PropsWithChildren } from 'react'\nimport { Rect } from 'spase'\nimport { useDragValueEffect } from '../hooks/useDragValueEffect'\nimport { asClassNameDict, asComponentDict, asStyleDict, cloneStyledElement, styles } from '../utils'\n\ntype Orientation = 'horizontal' | 'vertical'\n\nexport type SliderProps = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{\n  /**\n   * By default the position is a value from 0 - 1, 0 being the start of the\n   * slider and 1 being the end. Switching on this flag inverts this behavior,\n   * where 0 becomes the end of the slider and 1 being the start.\n   */\n  isInverted?: boolean\n\n  /**\n   * Specifies if the track is clickable to set the position of the knob.\n   */\n  isTrackInteractive?: boolean\n\n  /**\n   * Indicates if position change events are dispatched only when dragging ends.\n   * When disabled, aforementioned events are fired repeatedly while dragging.\n   */\n  onlyDispatchesOnDragEnd?: boolean\n\n  /**\n   * Padding between the track and the knob in pixels.\n   */\n  trackPadding?: number\n\n  /**\n   * Height of the knob in pixels.\n   */\n  knobHeight?: number\n\n  /**\n   * Width of the knob in pixels.\n   */\n  knobWidth?: number\n\n  /**\n   * Orientation of the slider.\n   */\n  orientation?: Orientation\n\n  /**\n   * The current position.\n   */\n  position?: number\n\n  /**\n   * A function that returns the label to be displayed at a given slider\n   * position.\n   *\n   * @param position The current slider position.\n   *\n   * @returns The label.\n   */\n  labelProvider?: (position: number) => string\n\n  /**\n   * Specifies if the component should use default styles.\n   */\n  usesDefaultStyles?: boolean\n\n  /**\n   * Handler invoked when position changes. This can either be invoked from the\n   * `position` prop being changed or from the slider being dragged. Note that\n   * if the event is emitted at the end of dragging due to\n   * `onlyDispatchesOnDragEnd` set to `true`, the `isDragging` parameter here is\n   * still `true`.\n   *\n   * @param position The current slider position.\n   * @param isDragging Specifies if the position change is due to dragging.\n   */\n  onPositionChange?: (position: number, isDragging: boolean) => void\n\n  /**\n   * Handler invoked when dragging ends.\n   */\n  onDragEnd?: () => void\n\n  /**\n   * Handler invoked when dragging begins.\n   */\n  onDragStart?: () => void\n}>\n\n/**\n * A slider component supporting both horizontal and vertical orientations whose\n * sliding position (a decimal between 0.0 and 1.0, inclusive) can be two-way\n * binded. The component consists of three customizable elements: a draggable\n * knob, a label on the knob, and a scroll track on either side of the knob.\n * While the width and height of the slider is inferred from its CSS rules, the\n * width and height of the knob are set via props (`knobWidth` and `knobHeight`,\n * respectively). The size of the knob does not impact the size of the slider.\n *\n * @exports SliderKnob The component for the knob.\n * @exports SliderLabel The component for the label on the knob.\n * @exports SliderTrack The component for the slide track on either side of the\n *                      knob.\n */\nexport const Slider = forwardRef<HTMLDivElement, SliderProps>(({\n  children,\n  className,\n  isInverted = false,\n  isTrackInteractive = true,\n  knobHeight = 30,\n  knobWidth = 30,\n  labelProvider,\n  onlyDispatchesOnDragEnd = false,\n  orientation = 'vertical',\n  position: externalPosition = 0,\n  trackPadding = 0,\n  usesDefaultStyles = false,\n  onDragEnd,\n  onDragStart,\n  onPositionChange,\n  ...props\n}, ref) => {\n  const mapDragValueToPosition = (value: number, dx: number, dy: number) => {\n    const rect = Rect.from(bodyRef.current) ?? new Rect()\n    const truePosition = isInverted ? 1 - value : value\n    const trueNewPositionX = truePosition * rect.width + dx\n    const trueNewPositionY = truePosition * rect.height + dy\n    const trueNewPosition = orientation === 'vertical' ? Math.max(0, Math.min(1, trueNewPositionY / rect.height)) : Math.max(0, Math.min(1, trueNewPositionX / rect.width))\n    const normalizedPosition = isInverted ? 1 - trueNewPosition : trueNewPosition\n\n    return normalizedPosition\n  }\n\n  const trackClickHandler = (event: MouseEvent) => {\n    if (!isTrackInteractive) return\n\n    const rect = Rect.from(bodyRef.current) ?? new Rect()\n\n    switch (orientation) {\n      case 'horizontal': {\n        const trackPosition = (event.clientX - rect.left) / rect.width\n        const normalizedPosition = isInverted ? 1 - trackPosition : trackPosition\n        setPosition(normalizedPosition)\n        break\n      }\n      case 'vertical': {\n        const trackPosition = (event.clientY - rect.top) / rect.height\n        const normalizedPosition = isInverted ? 1 - trackPosition : trackPosition\n        setPosition(normalizedPosition)\n        break\n      }\n      default: break\n    }\n  }\n\n  const bodyRef = useRef<HTMLDivElement>(null)\n  const knobContainerRef = useRef<HTMLButtonElement>(null)\n\n  const { isDragging: [isDragging], isReleasing: [isReleasing], value: [position, setPosition] } = useDragValueEffect(knobContainerRef, {\n    initialValue: externalPosition,\n    transform: mapDragValueToPosition,\n    onDragStart,\n    onDragEnd,\n  })\n\n  // Natural position is the position affecting internal components accounting\n  // for `isInverted`.\n  const naturalPosition = isInverted ? 1 - position : position\n  const isAtEnd = isInverted ? position === 0 : position === 1\n  const isAtStart = isInverted ? position === 1 : position === 0\n\n  useEffect(() => {\n    if (isDragging || externalPosition === position) return\n    setPosition(externalPosition)\n  }, [externalPosition])\n\n  useEffect(() => {\n    if (isDragging && onlyDispatchesOnDragEnd) return\n    onPositionChange?.(position, isDragging)\n  }, [position])\n\n  useEffect(() => {\n    if (isDragging || !onlyDispatchesOnDragEnd) return\n    onPositionChange?.(position, true)\n  }, [isDragging])\n\n  const components = asComponentDict(children, {\n    knob: SliderKnob,\n    label: SliderLabel,\n    track: SliderTrack,\n  })\n\n  const fixedClassNames = getFixedClassNames({ orientation, isAtEnd, isAtStart, isDragging, isReleasing })\n  const fixedStyles = getFixedStyles({ orientation, isDragging, naturalPosition, knobHeight, knobWidth, isTrackInteractive })\n  const defaultStyles = usesDefaultStyles ? getDefaultStyles({ knobHeight }) : undefined\n\n  return (\n    <div {...props} ref={ref} className={clsx(className, fixedClassNames.root)} data-component='slider'>\n      <div ref={bodyRef} style={fixedStyles.body}>\n        {cloneStyledElement(components.track ?? <SliderTrack style={defaultStyles?.track}/>, {\n          className: clsx('start', fixedClassNames.track),\n          style: styles(fixedStyles.track, orientation === 'vertical' ? {\n            height: `calc(${naturalPosition * 100}% - ${trackPadding <= 0 ? 0 : knobHeight * 0.5}px - ${trackPadding}px)`,\n            top: '0',\n          } : {\n            left: '0',\n            width: `calc(${naturalPosition * 100}% - ${trackPadding <= 0 ? 0 : knobWidth * 0.5}px - ${trackPadding}px)`,\n          }),\n          onClick: trackClickHandler,\n        }, <div style={fixedStyles.trackHitbox}/>)}\n        {cloneStyledElement(components.track ?? <SliderTrack style={defaultStyles?.track}/>, {\n          className: clsx('end', fixedClassNames.track),\n          style: styles(fixedStyles.track, orientation === 'vertical' ? {\n            bottom: '0',\n            height: `calc(${(1 - naturalPosition) * 100}% - ${trackPadding <= 0 ? 0 : knobHeight * 0.5}px - ${trackPadding}px)`,\n          } : {\n            right: '0',\n            width: `calc(${(1 - naturalPosition) * 100}% - ${trackPadding <= 0 ? 0 : knobWidth * 0.5}px - ${trackPadding}px)`,\n          }),\n          onClick: trackClickHandler,\n        }, <div style={fixedStyles.trackHitbox}/>)}\n        <button ref={knobContainerRef} style={fixedStyles.knobContainer}>\n          {cloneStyledElement(components.knob ?? <SliderKnob style={defaultStyles?.knob}/>, {\n            className: clsx(fixedClassNames.knob),\n            style: styles(fixedStyles.knob),\n          }, labelProvider && cloneStyledElement(components.label ?? <SliderLabel style={defaultStyles?.label}/>, {\n            className: clsx(fixedClassNames.label),\n            style: styles(fixedStyles.label),\n          }, labelProvider(position)))}\n        </button>\n      </div>\n    </div>\n  )\n})\n\nObject.defineProperty(Slider, 'displayName', { value: 'Slider', writable: false })\n\nexport const SliderTrack = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props} data-child='track'/>\n\nexport const SliderKnob = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props} data-child='knob'/>\n\nexport const SliderLabel = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props} data-child='label'/>\n\nfunction getFixedClassNames({ orientation = 'vertical', isAtEnd = false, isAtStart = false, isDragging = false, isReleasing = false }) {\n  return asClassNameDict({\n    root: clsx(orientation, {\n      'at-end': isAtEnd,\n      'at-start': isAtStart,\n      'dragging': isDragging,\n      'releasing': isReleasing,\n    }),\n    track: clsx(orientation, {\n      'at-end': isAtEnd,\n      'at-start': isAtStart,\n      'dragging': isDragging,\n      'releasing': isReleasing,\n    }),\n    knob: clsx(orientation, {\n      'at-end': isAtEnd,\n      'at-start': isAtStart,\n      'dragging': isDragging,\n      'releasing': isReleasing,\n    }),\n    label: clsx(orientation, {\n      'at-end': isAtEnd,\n      'at-start': isAtStart,\n      'dragging': isDragging,\n      'releasing': isReleasing,\n    }),\n  })\n}\n\nfunction getFixedStyles({ orientation = 'vertical', isDragging = false, naturalPosition = 0, knobHeight = 0, knobWidth = 0, isTrackInteractive = true }) {\n  return asStyleDict({\n    body: {\n      height: '100%',\n      width: '100%',\n    },\n    knobContainer: {\n      background: 'none',\n      border: 'none',\n      outline: 'none',\n      position: 'absolute',\n      transform: 'translate3d(-50%, -50%, 0)',\n      zIndex: '1',\n      ...orientation === 'vertical' ? {\n        left: '50%',\n        top: `${naturalPosition * 100}%`,\n        transition: isDragging === false ? 'top 100ms ease-out' : 'none',\n      } : {\n        left: `${naturalPosition * 100}%`,\n        top: '50%',\n        transition: isDragging === false ? 'left 100ms ease-out' : 'none',\n      },\n    },\n    knob: {\n      height: `${knobHeight}px`,\n      touchAction: 'none',\n      width: `${knobWidth}px`,\n    },\n    label: {\n      pointerEvents: 'none',\n      userSelect: 'none',\n    },\n    track: {\n      cursor: isTrackInteractive ? 'pointer' : 'auto',\n      pointerEvents: isTrackInteractive ? 'auto' : 'none',\n      position: 'absolute',\n      ...orientation === 'vertical' ? {\n        left: '0',\n        margin: '0 auto',\n        right: '0',\n        width: '100%',\n      } : {\n        bottom: '0',\n        height: '100%',\n        margin: 'auto 0',\n        top: '0',\n      },\n    },\n    trackHitbox: {\n      height: '100%',\n      minHeight: '20px',\n      minWidth: '20px',\n      position: 'absolute',\n      transform: orientation === 'horizontal' ? 'translate3d(0, -50%, 0)' : 'translate3d(-50%, 0, 0)',\n      width: '100%',\n    },\n  })\n}\n\nfunction getDefaultStyles({ knobHeight = 0 }) {\n  return asStyleDict({\n    knob: {\n      alignItems: 'center',\n      background: '#fff',\n      boxSizing: 'border-box',\n      display: 'flex',\n      justifyContent: 'center',\n    },\n    label: {\n      color: '#000',\n      fontSize: '12px',\n      lineHeight: `${knobHeight}px`,\n    },\n    track: {\n      background: '#fff',\n    },\n  })\n}\n"]}

package/components/StepwiseSlider.d.ts

@@ -1,215 +0,0 @@
-import { type HTMLAttributes, type PropsWithChildren } from 'react';
-type Orientation = 'horizontal' | 'vertical';
-export type StepwiseSliderProps = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{
-    /**
-     * By default the position is a value from 0 - 1, 0 being the start of the
-     * slider and 1 being the end. Switching on this flag inverts this behavior,
-     * where 0 becomes the end of the slider and 1 being the start.
-     */
-    isInverted?: boolean;
-    /**
-     * Specifies if the track is clickable to set the position of the knob.
-     */
-    isTrackInteractive?: boolean;
-    /**
-     * Indicates if position/index change events are dispatched only when dragging
-     * ends. When disabled, aforementioned events are fired repeatedly while
-     * dragging.
-     */
-    onlyDispatchesOnDragEnd?: boolean;
-    /**
-     * Padding between the track and the knob in pixels.
-     */
-    trackPadding?: number;
-    /**
-     * Height of the knob in pixels.
-     */
-    knobHeight?: number;
-    /**
-     * Width of the knob in pixels.
-     */
-    knobWidth?: number;
-    /**
-     * Orientation of the slider.
-     */
-    orientation?: Orientation;
-    /**
-     * An array of step descriptors. A step is a position (0 - 1 inclusive) on the
-     * track where the knob should snap to if dragging stops near it. Ensure that
-     * there are at least two steps: one for the start of the track and one for
-     * the end.
-     */
-    steps?: readonly number[];
-    /**
-     * The current index.
-     */
-    index?: number;
-    /**
-     * A function that returns the label to be displayed at a given slider
-     * position and closest step index (if steps are provided).
-     *
-     * @param position The current slider position.
-     * @param index The nearest step index (if steps are provided), or -1 if no
-     *                steps are provided.
-     *
-     * @returns The label.
-     */
-    labelProvider?: (position: number, index: number) => string;
-    /**
-     * Specifies if the component should use default styles.
-     */
-    usesDefaultStyles?: boolean;
-    /**
-     * Handler invoked when index changes. This can either be invoked from the
-     * `index` prop being changed or from the slider being dragged. Note that if
-     * the event is emitted at the end of dragging due to
-     * `onlyDispatchesOnDragEnd` set to `true`, the `isDragging` parameter here is
-     * still `true`. This event is emitted right after `onPositionChange`.
-     *
-     * @param index The current slider index.
-     * @param isDragging Specifies if the index change is due to dragging.
-     */
-    onIndexChange?: (index: number, isDragging: boolean) => void;
-    /**
-     * Handler invoked when position changes. This can either be invoked from the
-     * `index` prop being changed or from the slider being dragged. Note that if
-     * the event is emitted at the end of dragging due to
-     * `onlyDispatchesOnDragEnd` set to `true`, the `isDragging` parameter here is
-     * still `true`. This event is emitted right before `onIndexChange`.
-     *
-     * @param position The current slider position.
-     * @param isDragging Specifies if the position change is due to dragging.
-     */
-    onPositionChange?: (position: number, isDragging: boolean) => void;
-    /**
-     * Handler invoked when dragging ends.
-     */
-    onDragEnd?: () => void;
-    /**
-     * Handler invoked when dragging begins.
-     */
-    onDragStart?: () => void;
-}>;
-/**
- * A "stepwise" slider component supporting both horizontal and vertical
- * orientations that automatically snaps to a set of predefined points on the
- * slider when dragged. These points are referred to as "steps", indexed by an
- * integer referred to as "index". This index can be two-way binded. The
- * component consists of four customizable elements: a draggable knob, a label
- * on the knob, a scroll track before the knob and a scroll track after the
- * knob. While the width and height of the slider is inferred from its CSS
- * rules, the width and height of the knob are set via props (`knobWidth` and
- * `knobHeight`, respectively). The size of the knob does not impact the size of
- * the slider. While dragging, the slider still emits a position change event,
- * where the position is a decimal ranging between 0.0 and 1.0, inclusive.
- *
- * @exports StepwiseSliderKnob The component for the knob.
- * @exports StepwiseSliderLabel The component for the label on the knob.
- * @exports StepwiseSliderTrack The component for the slide track on either side
- *                                of the knob.
- */
-export declare const StepwiseSlider: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
-    /**
-     * By default the position is a value from 0 - 1, 0 being the start of the
-     * slider and 1 being the end. Switching on this flag inverts this behavior,
-     * where 0 becomes the end of the slider and 1 being the start.
-     */
-    isInverted?: boolean;
-    /**
-     * Specifies if the track is clickable to set the position of the knob.
-     */
-    isTrackInteractive?: boolean;
-    /**
-     * Indicates if position/index change events are dispatched only when dragging
-     * ends. When disabled, aforementioned events are fired repeatedly while
-     * dragging.
-     */
-    onlyDispatchesOnDragEnd?: boolean;
-    /**
-     * Padding between the track and the knob in pixels.
-     */
-    trackPadding?: number;
-    /**
-     * Height of the knob in pixels.
-     */
-    knobHeight?: number;
-    /**
-     * Width of the knob in pixels.
-     */
-    knobWidth?: number;
-    /**
-     * Orientation of the slider.
-     */
-    orientation?: Orientation;
-    /**
-     * An array of step descriptors. A step is a position (0 - 1 inclusive) on the
-     * track where the knob should snap to if dragging stops near it. Ensure that
-     * there are at least two steps: one for the start of the track and one for
-     * the end.
-     */
-    steps?: readonly number[];
-    /**
-     * The current index.
-     */
-    index?: number;
-    /**
-     * A function that returns the label to be displayed at a given slider
-     * position and closest step index (if steps are provided).
-     *
-     * @param position The current slider position.
-     * @param index The nearest step index (if steps are provided), or -1 if no
-     *                steps are provided.
-     *
-     * @returns The label.
-     */
-    labelProvider?: (position: number, index: number) => string;
-    /**
-     * Specifies if the component should use default styles.
-     */
-    usesDefaultStyles?: boolean;
-    /**
-     * Handler invoked when index changes. This can either be invoked from the
-     * `index` prop being changed or from the slider being dragged. Note that if
-     * the event is emitted at the end of dragging due to
-     * `onlyDispatchesOnDragEnd` set to `true`, the `isDragging` parameter here is
-     * still `true`. This event is emitted right after `onPositionChange`.
-     *
-     * @param index The current slider index.
-     * @param isDragging Specifies if the index change is due to dragging.
-     */
-    onIndexChange?: (index: number, isDragging: boolean) => void;
-    /**
-     * Handler invoked when position changes. This can either be invoked from the
-     * `index` prop being changed or from the slider being dragged. Note that if
-     * the event is emitted at the end of dragging due to
-     * `onlyDispatchesOnDragEnd` set to `true`, the `isDragging` parameter here is
-     * still `true`. This event is emitted right before `onIndexChange`.
-     *
-     * @param position The current slider position.
-     * @param isDragging Specifies if the position change is due to dragging.
-     */
-    onPositionChange?: (position: number, isDragging: boolean) => void;
-    /**
-     * Handler invoked when dragging ends.
-     */
-    onDragEnd?: () => void;
-    /**
-     * Handler invoked when dragging begins.
-     */
-    onDragStart?: () => void;
-} & {
-    children?: import("react").ReactNode | undefined;
-} & import("react").RefAttributes<HTMLDivElement>>;
-export declare const StepwiseSliderTrack: ({ ...props }: HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-export declare const StepwiseSliderKnob: ({ ...props }: HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-export declare const StepwiseSliderLabel: ({ ...props }: HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-/**
- * Generates a set of steps compatible with this component.
- *
- * @param length The number of steps. This must be at least 2 because you must
- *                 include the starting and ending points.
- *
- * @returns An array of steps.
- */
-export declare function generateSteps(length: number): readonly number[];
-export {};

package/components/StepwiseSlider.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"StepwiseSlider.js","sourceRoot":"/","sources":["components/StepwiseSlider.tsx"],"names":[],"mappings":"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","sourcesContent":["import clsx from 'clsx'\nimport { forwardRef, useEffect, useRef, useState, type HTMLAttributes, type MouseEvent, type PropsWithChildren } from 'react'\nimport { Rect } from 'spase'\nimport { useDragValueEffect } from '../hooks/useDragValueEffect'\nimport { asClassNameDict, asComponentDict, asStyleDict, cloneStyledElement, styles } from '../utils'\n\ntype Orientation = 'horizontal' | 'vertical'\n\nexport type StepwiseSliderProps = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{\n  /**\n   * By default the position is a value from 0 - 1, 0 being the start of the\n   * slider and 1 being the end. Switching on this flag inverts this behavior,\n   * where 0 becomes the end of the slider and 1 being the start.\n   */\n  isInverted?: boolean\n\n  /**\n   * Specifies if the track is clickable to set the position of the knob.\n   */\n  isTrackInteractive?: boolean\n\n  /**\n   * Indicates if position/index change events are dispatched only when dragging\n   * ends. When disabled, aforementioned events are fired repeatedly while\n   * dragging.\n   */\n  onlyDispatchesOnDragEnd?: boolean\n\n  /**\n   * Padding between the track and the knob in pixels.\n   */\n  trackPadding?: number\n\n  /**\n   * Height of the knob in pixels.\n   */\n  knobHeight?: number\n\n  /**\n   * Width of the knob in pixels.\n   */\n  knobWidth?: number\n\n  /**\n   * Orientation of the slider.\n   */\n  orientation?: Orientation\n\n  /**\n   * An array of step descriptors. A step is a position (0 - 1 inclusive) on the\n   * track where the knob should snap to if dragging stops near it. Ensure that\n   * there are at least two steps: one for the start of the track and one for\n   * the end.\n   */\n  steps?: readonly number[]\n\n  /**\n   * The current index.\n   */\n  index?: number\n\n  /**\n   * A function that returns the label to be displayed at a given slider\n   * position and closest step index (if steps are provided).\n   *\n   * @param position The current slider position.\n   * @param index The nearest step index (if steps are provided), or -1 if no\n   *                steps are provided.\n   *\n   * @returns The label.\n   */\n  labelProvider?: (position: number, index: number) => string\n\n  /**\n   * Specifies if the component should use default styles.\n   */\n  usesDefaultStyles?: boolean\n\n  /**\n   * Handler invoked when index changes. This can either be invoked from the\n   * `index` prop being changed or from the slider being dragged. Note that if\n   * the event is emitted at the end of dragging due to\n   * `onlyDispatchesOnDragEnd` set to `true`, the `isDragging` parameter here is\n   * still `true`. This event is emitted right after `onPositionChange`.\n   *\n   * @param index The current slider index.\n   * @param isDragging Specifies if the index change is due to dragging.\n   */\n  onIndexChange?: (index: number, isDragging: boolean) => void\n\n  /**\n   * Handler invoked when position changes. This can either be invoked from the\n   * `index` prop being changed or from the slider being dragged. Note that if\n   * the event is emitted at the end of dragging due to\n   * `onlyDispatchesOnDragEnd` set to `true`, the `isDragging` parameter here is\n   * still `true`. This event is emitted right before `onIndexChange`.\n   *\n   * @param position The current slider position.\n   * @param isDragging Specifies if the position change is due to dragging.\n   */\n  onPositionChange?: (position: number, isDragging: boolean) => void\n\n  /**\n   * Handler invoked when dragging ends.\n   */\n  onDragEnd?: () => void\n\n  /**\n   * Handler invoked when dragging begins.\n   */\n  onDragStart?: () => void\n}>\n\n/**\n * A \"stepwise\" slider component supporting both horizontal and vertical\n * orientations that automatically snaps to a set of predefined points on the\n * slider when dragged. These points are referred to as \"steps\", indexed by an\n * integer referred to as \"index\". This index can be two-way binded. The\n * component consists of four customizable elements: a draggable knob, a label\n * on the knob, a scroll track before the knob and a scroll track after the\n * knob. While the width and height of the slider is inferred from its CSS\n * rules, the width and height of the knob are set via props (`knobWidth` and\n * `knobHeight`, respectively). The size of the knob does not impact the size of\n * the slider. While dragging, the slider still emits a position change event,\n * where the position is a decimal ranging between 0.0 and 1.0, inclusive.\n *\n * @exports StepwiseSliderKnob The component for the knob.\n * @exports StepwiseSliderLabel The component for the label on the knob.\n * @exports StepwiseSliderTrack The component for the slide track on either side\n *                                of the knob.\n */\nexport const StepwiseSlider = forwardRef<HTMLDivElement, StepwiseSliderProps>(({\n  children,\n  className,\n  index: externalIndex = 0,\n  isInverted = false,\n  isTrackInteractive = true,\n  knobHeight = 30,\n  knobWidth = 30,\n  labelProvider,\n  onlyDispatchesOnDragEnd = false,\n  orientation = 'vertical',\n  steps = generateSteps(10),\n  trackPadding = 0,\n  usesDefaultStyles = false,\n  onDragEnd,\n  onDragStart,\n  onIndexChange,\n  onPositionChange,\n  ...props\n}, ref) => {\n  const mapDragValueToPosition = (value: number, dx: number, dy: number) => {\n    const rect = Rect.from(bodyRef.current) ?? new Rect()\n    const truePosition = isInverted ? 1 - value : value\n    const trueNewPositionX = truePosition * rect.width + dx\n    const trueNewPositionY = truePosition * rect.height + dy\n    const trueNewPosition = orientation === 'vertical' ? Math.max(0, Math.min(1, trueNewPositionY / rect.height)) : Math.max(0, Math.min(1, trueNewPositionX / rect.width))\n    const normalizedPosition = isInverted ? 1 - trueNewPosition : trueNewPosition\n\n    return normalizedPosition\n  }\n\n  const trackClickHandler = (event: MouseEvent) => {\n    if (!isTrackInteractive) return\n\n    const rect = Rect.from(bodyRef.current) ?? new Rect()\n\n    switch (orientation) {\n      case 'horizontal': {\n        const trackPosition = (event.clientX - rect.left) / rect.width\n        const normalizedPosition = isInverted ? 1 - trackPosition : trackPosition\n        setPosition(normalizedPosition)\n        break\n      }\n      case 'vertical': {\n        const trackPosition = (event.clientY - rect.top) / rect.height\n        const normalizedPosition = isInverted ? 1 - trackPosition : trackPosition\n        setPosition(normalizedPosition)\n        break\n      }\n      default:\n        break\n    }\n  }\n\n  const bodyRef = useRef<HTMLDivElement>(null)\n  const knobContainerRef = useRef<HTMLButtonElement>(null)\n  const [index, setIndex] = useState(externalIndex)\n\n  const { isDragging: [isDragging], isReleasing: [isReleasing], value: [position, setPosition] } = useDragValueEffect(knobContainerRef, {\n    initialValue: getPositionAt(externalIndex, steps),\n    transform: mapDragValueToPosition,\n    onDragStart,\n    onDragEnd,\n  })\n\n  // Natural position is the position affecting internal components accounting\n  // for `isInverted`.\n  const naturalPosition = isInverted ? 1 - position : position\n  const isAtEnd = isInverted ? position === 0 : position === 1\n  const isAtStart = isInverted ? position === 1 : position === 0\n  const components = asComponentDict(children, {\n    knob: StepwiseSliderKnob,\n    label: StepwiseSliderLabel,\n    track: StepwiseSliderTrack,\n  })\n\n  const fixedClassNames = getFixedClassNames({ orientation, isAtEnd, isAtStart, isDragging, isReleasing })\n  const fixedStyles = getFixedStyles({ orientation, naturalPosition, isDragging, knobHeight, knobWidth, isTrackInteractive })\n  const defaultStyles = usesDefaultStyles ? getDefaultStyles({ knobHeight }) : undefined\n\n  useEffect(() => {\n    if (isDragging) return\n\n    const newPosition = getPositionAt(externalIndex, steps)\n\n    if (position !== newPosition) {\n      setPosition(newPosition)\n    }\n\n    if (externalIndex !== index) {\n      setIndex(externalIndex)\n    }\n  }, [externalIndex])\n\n  useEffect(() => {\n    if (isDragging && onlyDispatchesOnDragEnd) return\n\n    onPositionChange?.(position, isDragging)\n\n    const newIndex = getNearestIndexByPosition(position, steps)\n    if (index !== newIndex) setIndex(newIndex)\n  }, [position])\n\n  useEffect(() => {\n    onIndexChange?.(index, isDragging)\n  }, [index])\n\n  useEffect(() => {\n    if (isDragging) return\n\n    const nearestIndex = getNearestIndexByPosition(position, steps)\n    const nearestPosition = getPositionAt(nearestIndex, steps)\n\n    if (nearestPosition !== position || onlyDispatchesOnDragEnd) {\n      setPosition(nearestPosition)\n      onPositionChange?.(nearestPosition, true)\n    }\n  }, [isDragging])\n\n  return (\n    <div {...props} ref={ref} className={clsx(className, fixedClassNames.root)} data-component='stepwise-slider'>\n      <div ref={bodyRef} style={fixedStyles.body}>\n        {cloneStyledElement(components.track ?? <StepwiseSliderTrack style={defaultStyles?.track}/>, {\n          className: clsx('start', fixedClassNames.track),\n          style: styles(fixedStyles.track, orientation === 'vertical' ? {\n            height: `calc(${naturalPosition * 100}% - ${trackPadding <= 0 ? 0 : knobHeight * 0.5}px - ${trackPadding}px)`,\n            top: '0',\n          } : {\n            left: '0',\n            width: `calc(${naturalPosition * 100}% - ${trackPadding <= 0 ? 0 : knobWidth * 0.5}px - ${trackPadding}px)`,\n          }),\n          onClick: trackClickHandler,\n        }, <div style={fixedStyles.trackHitbox}/>)}\n        {cloneStyledElement(components.track ?? <StepwiseSliderTrack style={defaultStyles?.track}/>, {\n          className: clsx('end', fixedClassNames.track),\n          style: styles(fixedStyles.track, orientation === 'vertical' ? {\n            bottom: '0',\n            height: `calc(${(1 - naturalPosition) * 100}% - ${trackPadding <= 0 ? 0 : knobHeight * 0.5}px - ${trackPadding}px)`,\n          } : {\n            right: '0',\n            width: `calc(${(1 - naturalPosition) * 100}% - ${trackPadding <= 0 ? 0 : knobWidth * 0.5}px - ${trackPadding}px)`,\n          }),\n          onClick: trackClickHandler,\n        }, <div style={fixedStyles.trackHitbox}/>)}\n        <button ref={knobContainerRef} style={fixedStyles.knobContainer}>\n          {cloneStyledElement(components.knob ?? <StepwiseSliderKnob style={defaultStyles?.knob}/>, {\n            className: clsx(fixedClassNames.knob),\n            style: styles(fixedStyles.knob),\n          }, steps && labelProvider && cloneStyledElement(components.label ?? <StepwiseSliderLabel style={defaultStyles?.label}/>, {\n            className: clsx(fixedClassNames.label),\n            style: styles(fixedStyles.label),\n          }, labelProvider(position, getNearestIndexByPosition(position, steps))))}\n        </button>\n      </div>\n    </div>\n  )\n})\n\nObject.defineProperty(StepwiseSlider, 'displayName', { value: 'StepwiseSlider', writable: false })\n\nexport const StepwiseSliderTrack = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props} data-child='track'/>\n\nexport const StepwiseSliderKnob = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props} data-child='knob'/>\n\nexport const StepwiseSliderLabel = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props} data-child='label'/>\n\n/**\n * Generates a set of steps compatible with this component.\n *\n * @param length The number of steps. This must be at least 2 because you must\n *                 include the starting and ending points.\n *\n * @returns An array of steps.\n */\nexport function generateSteps(length: number): readonly number[] {\n  if (length <= 1) throw new Error('`length` value must be greater than or equal to 2')\n  if (Math.round(length) !== length) throw new Error('`length` value must be an integer')\n\n  const interval = 1 / (length - 1)\n\n  return Array(length).fill(null).map((v, i) => {\n    const position = interval * i\n\n    return position\n  })\n}\n\n/**\n * Gets the index of the step of which the specified position is closest to. If\n * for whatever reason the index cannot be computed, -1 is returned.\n *\n * @param position The position (0 1, inclusive).\n * @param steps The steps.\n *\n * @returns The nearest index.\n */\nfunction getNearestIndexByPosition(position: number, steps: readonly number[]): number {\n  let index = -1\n  let minDelta = NaN\n\n  for (let i = 0, n = steps.length; i < n; i++) {\n    const step = getPositionAt(i, steps)\n\n    if (isNaN(step)) continue\n\n    const delta = Math.abs(position - step)\n\n    if (isNaN(minDelta) || delta < minDelta) {\n      minDelta = delta\n      index = i\n    }\n  }\n\n  return index\n}\n\n/**\n * Gets the position by step index. This value ranges between 0 - 1, inclusive.\n *\n * @param index The step index.\n * @param steps The steps.\n *\n * @returns The position. If for whatever reason the position cannot be\n *          determined, `NaN` is returned.\n */\nfunction getPositionAt(index: number, steps: readonly number[]): number {\n  if (index >= steps.length) return NaN\n\n  return steps[index]\n}\n\nfunction getFixedClassNames({ orientation = 'vertical', isAtEnd = false, isAtStart = false, isDragging = false, isReleasing = false }) {\n  return asClassNameDict({\n    root: clsx(orientation, {\n      'at-end': isAtEnd,\n      'at-start': isAtStart,\n      'dragging': isDragging,\n      'releasing': isReleasing,\n    }),\n    track: clsx(orientation, {\n      'at-end': isAtEnd,\n      'at-start': isAtStart,\n      'dragging': isDragging,\n      'releasing': isReleasing,\n    }),\n    knob: clsx(orientation, {\n      'at-end': isAtEnd,\n      'at-start': isAtStart,\n      'dragging': isDragging,\n      'releasing': isReleasing,\n    }),\n    label: clsx(orientation, {\n      'at-end': isAtEnd,\n      'at-start': isAtStart,\n      'dragging': isDragging,\n      'releasing': isReleasing,\n    }),\n  })\n}\n\nfunction getFixedStyles({ orientation = 'vertical', naturalPosition = 0, isDragging = false, knobHeight = 0, knobWidth = 0, isTrackInteractive = false }) {\n  return asStyleDict({\n    body: {\n      height: '100%',\n      width: '100%',\n    },\n    knobContainer: {\n      background: 'none',\n      border: 'none',\n      outline: 'none',\n      position: 'absolute',\n      transform: 'translate3d(-50%, -50%, 0)',\n      zIndex: '1',\n      ...orientation === 'vertical' ? {\n        left: '50%',\n        top: `${naturalPosition * 100}%`,\n        transition: isDragging === false ? 'top 100ms ease-out' : 'none',\n      } : {\n        left: `${naturalPosition * 100}%`,\n        top: '50%',\n        transition: isDragging === false ? 'left 100ms ease-out' : 'none',\n      },\n    },\n    knob: {\n      height: `${knobHeight}px`,\n      touchAction: 'none',\n      width: `${knobWidth}px`,\n    },\n    label: {\n      pointerEvents: 'none',\n      userSelect: 'none',\n    },\n    track: {\n      cursor: isTrackInteractive ? 'pointer' : 'auto',\n      pointerEvents: isTrackInteractive ? 'auto' : 'none',\n      position: 'absolute',\n      ...orientation === 'vertical' ? {\n        left: '0',\n        margin: '0 auto',\n        right: '0',\n        width: '100%',\n      } : {\n        bottom: '0',\n        height: '100%',\n        margin: 'auto 0',\n        top: '0',\n      },\n    },\n    trackHitbox: {\n      height: '100%',\n      minHeight: '20px',\n      minWidth: '20px',\n      position: 'absolute',\n      transform: orientation === 'horizontal' ? 'translate3d(0, -50%, 0)' : 'translate3d(-50%, 0, 0)',\n      width: '100%',\n    },\n  })\n}\n\nfunction getDefaultStyles({ knobHeight = 0 }) {\n  return asStyleDict({\n    knob: {\n      alignItems: 'center',\n      background: '#fff',\n      boxSizing: 'border-box',\n      display: 'flex',\n      justifyContent: 'center',\n    },\n    label: {\n      color: '#000',\n      fontSize: '12px',\n      lineHeight: `${knobHeight}px`,\n    },\n    track: {\n      background: '#fff',\n    },\n  })\n}\n"]}

package/components/SwipeContainer.d.ts

@@ -1,21 +0,0 @@
-import { type HTMLAttributes } from 'react';
-export type SwipeContainerProps = HTMLAttributes<HTMLDivElement> & {
-    isEnabled?: boolean;
-    threshold?: number;
-    onSwipeDown?: () => void;
-    onSwipeLeft?: () => void;
-    onSwipeRight?: () => void;
-    onSwipeUp?: () => void;
-};
-/**
- * An empty component with a backing `<div>` element that detects swipe
- * gestures.
- */
-export declare const SwipeContainer: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
-    isEnabled?: boolean;
-    threshold?: number;
-    onSwipeDown?: () => void;
-    onSwipeLeft?: () => void;
-    onSwipeRight?: () => void;
-    onSwipeUp?: () => void;
-} & import("react").RefAttributes<HTMLDivElement>>;

package/components/SwipeContainer.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"SwipeContainer.js","sourceRoot":"/","sources":["components/SwipeContainer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAAiE;AACjE,+BAA6B;AAW7B;;;GAGG;AACU,QAAA,cAAc,GAAG,IAAA,kBAAU,EAAsC,UAAC,EAS9E,EAAE,GAAG;IARJ,IAAA,QAAQ,cAAA,EACR,iBAAgB,EAAhB,SAAS,mBAAG,IAAI,KAAA,EAChB,iBAAe,EAAf,SAAS,mBAAG,GAAG,KAAA,EACf,WAAW,iBAAA,EACX,WAAW,iBAAA,EACX,YAAY,kBAAA,EACZ,SAAS,eAAA,EACN,KAAK,cARqE,iGAS9E,CADS;IAEF,IAAA,KAAA,OAA4C,IAAA,gBAAQ,EAAoB,SAAS,CAAC,IAAA,EAAjF,iBAAiB,QAAA,EAAE,oBAAoB,QAA0C,CAAA;IAClF,IAAA,KAAA,OAAwC,IAAA,gBAAQ,EAAoB,SAAS,CAAC,IAAA,EAA7E,eAAe,QAAA,EAAE,kBAAkB,QAA0C,CAAA;IAC9E,IAAA,KAAA,OAAoC,IAAA,gBAAQ,EAAC,GAAG,CAAC,IAAA,EAAhD,aAAa,QAAA,EAAE,gBAAgB,QAAiB,CAAA;IAEvD,IAAM,WAAW,GAAG,UAAC,CAAS,EAAE,CAAS;QACvC,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC;YAAE,OAAO,YAAY,EAAE,CAAA;QAC/C,oBAAoB,CAAC,IAAI,aAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;IACzC,CAAC,CAAA;IAED,IAAM,UAAU,GAAG,UAAC,CAAS,EAAE,CAAS;QACtC,IAAM,aAAa,GAAG,iBAAiB,CAAA;QAEvC,IAAI,aAAa,KAAK,SAAS;YAAE,OAAM;QAEvC,IAAM,WAAW,GAAG,aAAa,CAAC,CAAC,KAAK,CAAC,IAAI,aAAa,CAAC,CAAC,KAAK,CAAC,CAAA;QAClE,IAAM,YAAY,GAAG,CAAC,KAAK,CAAC,aAAa,CAAC,CAAA;QAE1C,IAAI,CAAC,WAAW;YAAE,OAAM;QAExB,IAAI,CAAC,YAAY;YAAE,gBAAgB,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAA;QAE/C,kBAAkB,CAAC,IAAI,aAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;IACvC,CAAC,CAAA;IAED,IAAM,SAAS,GAAG;QAChB,IAAM,IAAI,GAAG,aAAa,CAAA;QAC1B,IAAM,aAAa,GAAG,iBAAiB,CAAA;QACvC,IAAM,WAAW,GAAG,eAAe,CAAA;QAEnC,IAAI,KAAK,CAAC,IAAI,CAAC,IAAI,aAAa,KAAK,SAAS,IAAI,WAAW,KAAK,SAAS;YAAE,OAAM;QAEnF,IAAM,EAAE,GAAG,IAAI,CAAC,GAAG,EAAE,GAAG,IAAI,CAAA;QAC5B,IAAM,EAAE,GAAG,WAAW,CAAC,CAAC,GAAG,aAAa,CAAC,CAAC,CAAA;QAC1C,IAAM,EAAE,GAAG,WAAW,CAAC,CAAC,GAAG,aAAa,CAAC,CAAC,CAAA;QAC1C,IAAM,EAAE,GAAG,EAAE,GAAG,EAAE,CAAA;QAClB,IAAM,EAAE,GAAG,EAAE,GAAG,EAAE,CAAA;QAElB,IAAI,SAAS,EAAE,CAAC;YACd,IAAI,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,SAAS,IAAI,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC;gBAC7D,IAAI,EAAE,GAAG,CAAC,EAAE,CAAC;oBACX,YAAY,aAAZ,YAAY,uBAAZ,YAAY,EAAI,CAAA;gBAClB,CAAC;qBACI,CAAC;oBACJ,WAAW,aAAX,WAAW,uBAAX,WAAW,EAAI,CAAA;gBACjB,CAAC;YACH,CAAC;iBACI,IAAI,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,SAAS,IAAI,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC;gBAClE,IAAI,EAAE,GAAG,CAAC,EAAE,CAAC;oBACX,WAAW,aAAX,WAAW,uBAAX,WAAW,EAAI,CAAA;gBACjB,CAAC;qBACI,CAAC;oBACJ,SAAS,aAAT,SAAS,uBAAT,SAAS,EAAI,CAAA;gBACf,CAAC;YACH,CAAC;QACH,CAAC;QAED,YAAY,EAAE,CAAA;IAChB,CAAC,CAAA;IAED,IAAM,YAAY,GAAG;QACnB,oBAAoB,CAAC,SAAS,CAAC,CAAA;QAC/B,kBAAkB,CAAC,SAAS,CAAC,CAAA;QAC7B,gBAAgB,CAAC,GAAG,CAAC,CAAA;IACvB,CAAC,CAAA;IAED,OAAO,CACL,2CACM,KAAK,IACT,GAAG,EAAE,GAAG,oBACO,iBAAiB,EAChC,WAAW,EAAE,UAAA,KAAK,IAAI,OAAA,WAAW,CAAC,KAAK,CAAC,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,EAAzC,CAAyC,EAC/D,YAAY,EAAE,cAAM,OAAA,YAAY,EAAE,EAAd,CAAc,EAClC,WAAW,EAAE,UAAA,KAAK,IAAI,OAAA,UAAU,CAAC,KAAK,CAAC,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,EAAxC,CAAwC,EAC9D,SAAS,EAAE,cAAM,OAAA,SAAS,EAAE,EAAX,CAAW,EAC5B,UAAU,EAAE,cAAM,OAAA,SAAS,EAAE,EAAX,CAAW,EAC7B,WAAW,EAAE,UAAA,KAAK,IAAI,OAAA,UAAU,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,OAAO,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,EAA1E,CAA0E,EAChG,YAAY,EAAE,UAAA,KAAK,IAAI,OAAA,WAAW,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,OAAO,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,EAA3E,CAA2E,YAEjG,QAAQ,IACL,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","sourcesContent":["import { forwardRef, useState, type HTMLAttributes } from 'react'\nimport { Point } from 'spase'\n\nexport type SwipeContainerProps = HTMLAttributes<HTMLDivElement> & {\n  isEnabled?: boolean\n  threshold?: number\n  onSwipeDown?: () => void\n  onSwipeLeft?: () => void\n  onSwipeRight?: () => void\n  onSwipeUp?: () => void\n}\n\n/**\n * An empty component with a backing `<div>` element that detects swipe\n * gestures.\n */\nexport const SwipeContainer = forwardRef<HTMLDivElement, SwipeContainerProps>(({\n  children,\n  isEnabled = true,\n  threshold = 0.5,\n  onSwipeDown,\n  onSwipeLeft,\n  onSwipeRight,\n  onSwipeUp,\n  ...props\n}, ref) => {\n  const [dragStartPosition, setDragStartPosition] = useState<Point | undefined>(undefined)\n  const [dragEndPosition, setDragEndPosition] = useState<Point | undefined>(undefined)\n  const [dragStartTime, setDragStartTime] = useState(NaN)\n\n  const onDragStart = (x: number, y: number) => {\n    if (isNaN(x) || isNaN(y)) return onDragCancel()\n    setDragStartPosition(new Point([x, y]))\n  }\n\n  const onDragMove = (x: number, y: number) => {\n    const startPosition = dragStartPosition\n\n    if (startPosition === undefined) return\n\n    const hasMovement = startPosition.x !== x || startPosition.y !== y\n    const hasStartTime = !isNaN(dragStartTime)\n\n    if (!hasMovement) return\n\n    if (!hasStartTime) setDragStartTime(Date.now())\n\n    setDragEndPosition(new Point([x, y]))\n  }\n\n  const onDragEnd = () => {\n    const time = dragStartTime\n    const startPosition = dragStartPosition\n    const endPosition = dragEndPosition\n\n    if (isNaN(time) || startPosition === undefined || endPosition === undefined) return\n\n    const dt = Date.now() - time\n    const dx = endPosition.x - startPosition.x\n    const dy = endPosition.y - startPosition.y\n    const vx = dx / dt\n    const vy = dy / dt\n\n    if (isEnabled) {\n      if (Math.abs(vx) >= threshold && Math.abs(vx) > Math.abs(vy)) {\n        if (vx > 0) {\n          onSwipeRight?.()\n        }\n        else {\n          onSwipeLeft?.()\n        }\n      }\n      else if (Math.abs(vy) >= threshold && Math.abs(vy) > Math.abs(vx)) {\n        if (vy > 0) {\n          onSwipeDown?.()\n        }\n        else {\n          onSwipeUp?.()\n        }\n      }\n    }\n\n    onDragCancel()\n  }\n\n  const onDragCancel = () => {\n    setDragStartPosition(undefined)\n    setDragEndPosition(undefined)\n    setDragStartTime(NaN)\n  }\n\n  return (\n    <div\n      {...props}\n      ref={ref}\n      data-component='swipe-container'\n      onMouseDown={event => onDragStart(event.clientX, event.clientY)}\n      onMouseLeave={() => onDragCancel()}\n      onMouseMove={event => onDragMove(event.clientX, event.clientY)}\n      onMouseUp={() => onDragEnd()}\n      onTouchEnd={() => onDragEnd()}\n      onTouchMove={event => onDragMove(event.targetTouches[0].clientX, event.targetTouches[0].clientY)}\n      onTouchStart={event => onDragStart(event.targetTouches[0].clientX, event.targetTouches[0].clientY)}\n    >\n      {children}\n    </div>\n  )\n})\n\nObject.defineProperty(SwipeContainer, 'displayName', { value: 'SwipeContainer', writable: false })\n"]}

package/components/TextField.d.ts

@@ -1,21 +0,0 @@
-import { type HTMLAttributes } from 'react';
-export type TextFieldProps = HTMLAttributes<HTMLInputElement> & {
-    emptyValue?: string;
-    isDisabled?: boolean;
-    placeholder?: string;
-    value?: string;
-    formatter?: (prevValue: string, newValue: string) => string;
-    onFocus?: (value: string) => void;
-    onUnfocus?: (value: string) => void;
-    onValueChange?: (value: string) => void;
-};
-export declare const TextField: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLInputElement> & {
-    emptyValue?: string;
-    isDisabled?: boolean;
-    placeholder?: string;
-    value?: string;
-    formatter?: (prevValue: string, newValue: string) => string;
-    onFocus?: (value: string) => void;
-    onUnfocus?: (value: string) => void;
-    onValueChange?: (value: string) => void;
-} & import("react").RefAttributes<HTMLInputElement>>;

package/components/TextField.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TextField.js","sourceRoot":"/","sources":["components/TextField.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAAqG;AACrG,oDAAkD;AAarC,QAAA,SAAS,GAAG,IAAA,kBAAU,EAAmC,UAAC,EAUtE,EAAE,GAAG;IATJ,IAAA,kBAAe,EAAf,UAAU,mBAAG,EAAE,KAAA,EACf,kBAAkB,EAAlB,UAAU,mBAAG,KAAK,KAAA,EAClB,WAAW,iBAAA,EACJ,aAAa,WAAA,EACpB,SAAS,eAAA,EACT,OAAO,aAAA,EACP,SAAS,eAAA,EACT,aAAa,mBAAA,EACV,KAAK,cAT6D,0GAUtE,CADS;IAER,IAAM,iBAAiB,GAAG,UAAC,QAAgB;;QACzC,IAAM,SAAS,GAAG,CAAC,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,MAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAG,KAAK,EAAE,QAAQ,CAAC,mCAAI,QAAQ,CAAC,CAAC,CAAC,CAAC,UAAU,CAAA;QAErG,IAAI,SAAS,KAAK,KAAK;YAAE,OAAM;QAE/B,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,SAAS,CAAC,CAAA;IAC5B,CAAC,CAAA;IAED,IAAM,KAAK,GAAG,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,UAAU,CAAA;IACzC,IAAM,SAAS,GAAG,IAAA,yBAAW,EAAC,KAAK,CAAC,CAAA;IAEpC,IAAA,iBAAS,EAAC;QACR,IAAI,SAAS,KAAK,SAAS;YAAE,OAAM;QAEnC,iBAAiB,CAAC,KAAK,CAAC,CAAA;IAC1B,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,OAAO,CACL,6CACM,KAAK,IACT,GAAG,EAAE,GAAG,oBACO,YAAY,EAC3B,QAAQ,EAAE,UAAU,EACpB,WAAW,EAAE,WAAW,EACxB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,UAAC,EAAwC;gBAAtC,MAAM,YAAA;YAAqC,OAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAG,MAAM,CAAC,KAAK,CAAC;QAAzB,CAAyB,EAC/E,QAAQ,EAAE,UAAC,EAAyC;gBAAvC,MAAM,YAAA;YAAsC,OAAA,iBAAiB,CAAC,MAAM,CAAC,KAAK,CAAC;QAA/B,CAA+B,EACxF,OAAO,EAAE,UAAC,EAAwC;gBAAtC,MAAM,YAAA;YAAqC,OAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,MAAM,CAAC,KAAK,CAAC;QAAvB,CAAuB,IAC9E,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,CAAC,cAAc,CAAC,iBAAS,EAAE,aAAa,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAA","sourcesContent":["import { forwardRef, useEffect, type ChangeEvent, type FocusEvent, type HTMLAttributes } from 'react'\nimport { usePrevious } from '../hooks/usePrevious'\n\nexport type TextFieldProps = HTMLAttributes<HTMLInputElement> & {\n  emptyValue?: string\n  isDisabled?: boolean\n  placeholder?: string\n  value?: string\n  formatter?: (prevValue: string, newValue: string) => string\n  onFocus?: (value: string) => void\n  onUnfocus?: (value: string) => void\n  onValueChange?: (value: string) => void\n}\n\nexport const TextField = forwardRef<HTMLInputElement, TextFieldProps>(({\n  emptyValue = '',\n  isDisabled = false,\n  placeholder,\n  value: externalValue,\n  formatter,\n  onFocus,\n  onUnfocus,\n  onValueChange,\n  ...props\n}, ref) => {\n  const handleValueChange = (newValue: string) => {\n    const formatted = (newValue !== emptyValue) ? (formatter?.(value, newValue) ?? newValue) : emptyValue\n\n    if (formatted === value) return\n\n    onValueChange?.(formatted)\n  }\n\n  const value = externalValue ?? emptyValue\n  const prevValue = usePrevious(value)\n\n  useEffect(() => {\n    if (prevValue === undefined) return\n\n    handleValueChange(value)\n  }, [value])\n\n  return (\n    <input\n      {...props}\n      ref={ref}\n      data-component='text-field'\n      disabled={isDisabled}\n      placeholder={placeholder}\n      type='text'\n      value={value}\n      onBlur={({ target }: FocusEvent<HTMLInputElement>) => onUnfocus?.(target.value)}\n      onChange={({ target }: ChangeEvent<HTMLInputElement>) => handleValueChange(target.value)}\n      onFocus={({ target }: FocusEvent<HTMLInputElement>) => onFocus?.(target.value)}\n    />\n  )\n})\n\nObject.defineProperty(TextField, 'displayName', { value: 'TextField', writable: false })\n"]}