etudes 2.5.0 → 2.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (88) hide show
  1. package/lib/Accordion.d.ts +16 -7
  2. package/lib/Accordion.js +36 -11
  3. package/lib/Accordion.js.map +1 -1
  4. package/lib/BurgerButton.d.ts +2 -2
  5. package/lib/BurgerButton.js +1 -1
  6. package/lib/BurgerButton.js.map +1 -1
  7. package/lib/Conditional.d.ts +1 -1
  8. package/lib/Conditional.js.map +1 -1
  9. package/lib/DebugConsole.d.ts +1 -1
  10. package/lib/DebugConsole.js.map +1 -1
  11. package/lib/Dial.d.ts +1 -1
  12. package/lib/Dial.js.map +1 -1
  13. package/lib/Dropdown.d.ts +13 -4
  14. package/lib/Dropdown.js +36 -15
  15. package/lib/Dropdown.js.map +1 -1
  16. package/lib/Each.d.ts +1 -1
  17. package/lib/Each.js.map +1 -1
  18. package/lib/ExtractChild.d.ts +1 -1
  19. package/lib/ExtractChild.js.map +1 -1
  20. package/lib/ExtractChildren.d.ts +1 -1
  21. package/lib/ExtractChildren.js.map +1 -1
  22. package/lib/FlatSVG.d.ts +1 -1
  23. package/lib/FlatSVG.js.map +1 -1
  24. package/lib/List.d.ts +1 -1
  25. package/lib/List.js.map +1 -1
  26. package/lib/MasonryGrid.d.ts +1 -1
  27. package/lib/MasonryGrid.js +10 -10
  28. package/lib/MasonryGrid.js.map +1 -1
  29. package/lib/Panorama.d.ts +15 -15
  30. package/lib/Panorama.js.map +1 -1
  31. package/lib/PanoramaSlider.d.ts +8 -8
  32. package/lib/PanoramaSlider.js +6 -6
  33. package/lib/PanoramaSlider.js.map +1 -1
  34. package/lib/RangeSlider.d.ts +1 -1
  35. package/lib/RangeSlider.js.map +1 -1
  36. package/lib/Repeat.d.ts +1 -1
  37. package/lib/Repeat.js.map +1 -1
  38. package/lib/RotatingGallery.d.ts +5 -5
  39. package/lib/RotatingGallery.js +2 -2
  40. package/lib/RotatingGallery.js.map +1 -1
  41. package/lib/SelectableButton.d.ts +1 -1
  42. package/lib/SelectableButton.js.map +1 -1
  43. package/lib/Slider.d.ts +11 -11
  44. package/lib/Slider.js +4 -4
  45. package/lib/Slider.js.map +1 -1
  46. package/lib/StepwiseSlider.d.ts +18 -18
  47. package/lib/StepwiseSlider.js +9 -9
  48. package/lib/StepwiseSlider.js.map +1 -1
  49. package/lib/SwipeContainer.d.ts +1 -1
  50. package/lib/SwipeContainer.js.map +1 -1
  51. package/lib/TextField.d.ts +1 -1
  52. package/lib/TextField.js.map +1 -1
  53. package/lib/Video.d.ts +1 -1
  54. package/lib/Video.js.map +1 -1
  55. package/lib/WithTooltip.d.ts +1 -1
  56. package/lib/WithTooltip.js.map +1 -1
  57. package/lib/hooks/useDragEffect.d.ts +15 -15
  58. package/lib/hooks/useDragEffect.js +6 -6
  59. package/lib/hooks/useDragEffect.js.map +1 -1
  60. package/lib/hooks/useElementRect.d.ts +2 -2
  61. package/lib/hooks/useElementRect.js +1 -1
  62. package/lib/hooks/useElementRect.js.map +1 -1
  63. package/lib/hooks/useInterval.d.ts +5 -5
  64. package/lib/hooks/useInterval.js +4 -4
  65. package/lib/hooks/useInterval.js.map +1 -1
  66. package/lib/hooks/useLoadImageEffect.d.ts +6 -6
  67. package/lib/hooks/useLoadImageEffect.js +3 -3
  68. package/lib/hooks/useLoadImageEffect.js.map +1 -1
  69. package/lib/hooks/usePrevious.d.ts +1 -1
  70. package/lib/hooks/usePrevious.js +1 -1
  71. package/lib/hooks/usePrevious.js.map +1 -1
  72. package/lib/hooks/useResizeEffect.d.ts +5 -5
  73. package/lib/hooks/useResizeEffect.js +3 -3
  74. package/lib/hooks/useResizeEffect.js.map +1 -1
  75. package/lib/hooks/useSearchParamState.d.ts +7 -7
  76. package/lib/hooks/useSearchParamState.js +3 -3
  77. package/lib/hooks/useSearchParamState.js.map +1 -1
  78. package/lib/providers/ScrollPositionProvider.d.ts +1 -1
  79. package/lib/providers/ScrollPositionProvider.js.map +1 -1
  80. package/lib/utils/asComponentDict.d.ts +1 -1
  81. package/lib/utils/asComponentDict.js.map +1 -1
  82. package/lib/utils/asStyleDict.d.ts +1 -1
  83. package/lib/utils/asStyleDict.js.map +1 -1
  84. package/lib/utils/cloneStyledElement.d.ts +6 -6
  85. package/lib/utils/cloneStyledElement.js.map +1 -1
  86. package/lib/utils/styles.d.ts +1 -1
  87. package/lib/utils/styles.js.map +1 -1
  88. package/package.json +12 -12
package/lib/Panorama.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import React, { HTMLAttributes } from 'react';
1
+ import React, { type HTMLAttributes } from 'react';
2
2
  import { Size } from 'spase';
3
3
  export type PanoramaProps = Omit<HTMLAttributes<HTMLDivElement>, 'onResize'> & {
4
4
  /**
@@ -26,8 +26,8 @@ export type PanoramaProps = Omit<HTMLAttributes<HTMLDivElement>, 'onResize'> & {
26
26
  * Handler invoked when the positionchanges. This can either be invoked from
27
27
  * the `angle` prop being changed or from the image being dragged.
28
28
  *
29
- * @param position - The current position.
30
- * @param isDragging - Specifies if the position change is due to dragging.
29
+ * @param position The current position.
30
+ * @param isDragging Specifies if the position change is due to dragging.
31
31
  */
32
32
  onPositionChange?: (position: number, isDragging: boolean) => void;
33
33
  /**
@@ -36,8 +36,8 @@ export type PanoramaProps = Omit<HTMLAttributes<HTMLDivElement>, 'onResize'> & {
36
36
  * being double-binded, ensure that the value is only being set by this
37
37
  * handler when `isDragging` is `true` to avoid potential update overflow.
38
38
  *
39
- * @param angle - The current angle.
40
- * @param isDragging - Specifies if the angle change is due to dragging.
39
+ * @param angle The current angle.
40
+ * @param isDragging Specifies if the angle change is due to dragging.
41
41
  */
42
42
  onAngleChange?: (angle: number, isDragging: boolean) => void;
43
43
  /**
@@ -55,7 +55,7 @@ export type PanoramaProps = Omit<HTMLAttributes<HTMLDivElement>, 'onResize'> & {
55
55
  /**
56
56
  * Handler invoked when the image is done loading.
57
57
  *
58
- * @param imageElement - The loaded image element.
58
+ * @param imageElement The loaded image element.
59
59
  */
60
60
  onImageLoadComplete?: (imageElement: HTMLImageElement) => void;
61
61
  /**
@@ -66,14 +66,14 @@ export type PanoramaProps = Omit<HTMLAttributes<HTMLDivElement>, 'onResize'> & {
66
66
  * Handler invoked when the image size changes. This is the actual size of the
67
67
  * loaded image. When no images are loaded yet, the size is `undefined`.
68
68
  *
69
- * @param size - The actual size of the loaded iamge. If no images are loaded
69
+ * @param size The actual size of the loaded iamge. If no images are loaded
70
70
  * yet, the size is `undefined`.
71
71
  */
72
72
  onImageSizeChange?: (size?: Size) => void;
73
73
  /**
74
74
  * Handler invoked when the size of this component changes.
75
75
  *
76
- * @param size - The size of this component.
76
+ * @param size The size of this component.
77
77
  */
78
78
  onResize?: (size: Size) => void;
79
79
  };
@@ -107,8 +107,8 @@ declare const _default: React.ForwardRefExoticComponent<Omit<React.HTMLAttribute
107
107
  * Handler invoked when the positionchanges. This can either be invoked from
108
108
  * the `angle` prop being changed or from the image being dragged.
109
109
  *
110
- * @param position - The current position.
111
- * @param isDragging - Specifies if the position change is due to dragging.
110
+ * @param position The current position.
111
+ * @param isDragging Specifies if the position change is due to dragging.
112
112
  */
113
113
  onPositionChange?: ((position: number, isDragging: boolean) => void) | undefined;
114
114
  /**
@@ -117,8 +117,8 @@ declare const _default: React.ForwardRefExoticComponent<Omit<React.HTMLAttribute
117
117
  * being double-binded, ensure that the value is only being set by this
118
118
  * handler when `isDragging` is `true` to avoid potential update overflow.
119
119
  *
120
- * @param angle - The current angle.
121
- * @param isDragging - Specifies if the angle change is due to dragging.
120
+ * @param angle The current angle.
121
+ * @param isDragging Specifies if the angle change is due to dragging.
122
122
  */
123
123
  onAngleChange?: ((angle: number, isDragging: boolean) => void) | undefined;
124
124
  /**
@@ -136,7 +136,7 @@ declare const _default: React.ForwardRefExoticComponent<Omit<React.HTMLAttribute
136
136
  /**
137
137
  * Handler invoked when the image is done loading.
138
138
  *
139
- * @param imageElement - The loaded image element.
139
+ * @param imageElement The loaded image element.
140
140
  */
141
141
  onImageLoadComplete?: ((imageElement: HTMLImageElement) => void) | undefined;
142
142
  /**
@@ -147,14 +147,14 @@ declare const _default: React.ForwardRefExoticComponent<Omit<React.HTMLAttribute
147
147
  * Handler invoked when the image size changes. This is the actual size of the
148
148
  * loaded image. When no images are loaded yet, the size is `undefined`.
149
149
  *
150
- * @param size - The actual size of the loaded iamge. If no images are loaded
150
+ * @param size The actual size of the loaded iamge. If no images are loaded
151
151
  * yet, the size is `undefined`.
152
152
  */
153
153
  onImageSizeChange?: ((size?: Size | undefined) => void) | undefined;
154
154
  /**
155
155
  * Handler invoked when the size of this component changes.
156
156
  *
157
- * @param size - The size of this component.
157
+ * @param size The size of this component.
158
158
  */
159
159
  onResize?: ((size: Size) => void) | undefined;
160
160
  } & React.RefAttributes<HTMLDivElement>>;
@@ -1 +1 @@
1
- {"version":3,"file":"Panorama.js","sourceRoot":"/","sources":["Panorama.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { forwardRef, HTMLAttributes, useEffect, useRef, useState } from 'react'\nimport { Size } from 'spase'\nimport useDragEffect from './hooks/useDragEffect'\nimport useLoadImageEffect from './hooks/useLoadImageEffect'\nimport useResizeEffect from './hooks/useResizeEffect'\nimport asStyleDict from './utils/asStyleDict'\n\nexport type PanoramaProps = Omit<HTMLAttributes<HTMLDivElement>, 'onResize'> & {\n /**\n * The current angle in degrees, 0.0 - 360.0, inclusive. When angle is 0 or\n * 360, the left bound of the image is at the center of the component.\n */\n angle?: number\n\n /**\n * The panning speed. This is a multiplier to the number of pixels dragged,\n * i.e. when set to 1, the image will shift the same amount of pixels that\n * were dragged.\n */\n speed?: number\n\n /**\n * The source URL of the image.\n */\n src?: string\n\n /**\n * A decimal percentage of the component width indicating where 0° should be,\n * i.e. if `zeroAnchor` is `0`, the `angle` would be 0° when the left edge of\n * the image is at the left edge of the component.\n */\n zeroAnchor?: number\n\n /**\n * Handler invoked when the positionchanges. This can either be invoked from\n * the `angle` prop being changed or from the image being dragged.\n *\n * @param position - The current 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 the angle changes. This can either be invoked from the\n * `angle` prop being changed or from the image being dragged. When `angle` is\n * being double-binded, ensure that the value is only being set by this\n * handler when `isDragging` is `true` to avoid potential update overflow.\n *\n * @param angle - The current angle.\n * @param isDragging - Specifies if the angle change is due to dragging.\n */\n onAngleChange?: (angle: number, isDragging: boolean) => void\n\n /**\n * Handler invoked when dragging starts.\n */\n onDragStart?: () => void\n\n /**\n * Handler invoked when dragging ends.\n */\n onDragEnd?: () => void\n\n /**\n * Handler invoked when the image begins loading.\n */\n onImageLoadStart?: () => void\n\n /**\n * Handler invoked when the image is done loading.\n *\n * @param imageElement - The loaded image element.\n */\n onImageLoadComplete?: (imageElement: HTMLImageElement) => void\n\n /**\n * Handler invoked when there is an error loading the image.\n */\n onImageLoadError?: () => void\n\n /**\n * Handler invoked when the image size changes. This is the actual size of the\n * loaded image. When no images are loaded yet, the size is `undefined`.\n *\n * @param size - The actual size of the loaded iamge. If no images are loaded\n * yet, the size is `undefined`.\n */\n onImageSizeChange?: (size?: Size) => void\n\n /**\n * Handler invoked when the size of this component changes.\n *\n * @param size - The size of this component.\n */\n onResize?: (size: Size) => void\n}\n\n/**\n * A component containing a pannable 360° panorama image. The angle supports\n * two-way binding.\n */\nexport default forwardRef<HTMLDivElement, PanoramaProps>(({\n angle: externalAngle = 0,\n speed = 1,\n src,\n zeroAnchor = 0,\n onAngleChange,\n onPositionChange,\n onDragStart,\n onDragEnd,\n onImageLoadStart,\n onImageLoadComplete,\n onImageLoadError,\n onImageSizeChange,\n onResize,\n ...props\n}, ref) => {\n const mapDragPositionToDisplacement = (currentPosition: number, dx: number, dy: number): number => {\n const newDisplacement = currentPosition - dx * speed\n\n return newDisplacement\n }\n\n const bodyRef = useRef<HTMLDivElement>(null)\n const [size] = useResizeEffect(bodyRef, { onResize })\n const [angle, setAngle] = useState(externalAngle)\n\n const { isLoading: [isLoading], imageSize: [imageSize] } = useLoadImageEffect(src, {\n onImageLoadComplete,\n onImageLoadError,\n onImageSizeChange,\n })\n\n const { isDragging: [isDragging], value: [displacement, setDisplacement] } = useDragEffect(bodyRef, {\n initialValue: 0,\n transform: mapDragPositionToDisplacement,\n onDragStart,\n onDragEnd,\n })\n\n useEffect(() => {\n if (isDragging || isLoading || !imageSize) return\n\n const newDisplacement = getDisplacementFromAngle(externalAngle, imageSize, size, zeroAnchor)\n\n if (newDisplacement !== displacement) {\n setDisplacement(newDisplacement)\n }\n\n if (externalAngle !== angle) {\n setAngle(externalAngle)\n }\n }, [externalAngle, isLoading, imageSize, size, zeroAnchor])\n\n useEffect(() => {\n if (!isDragging || !imageSize) return\n\n const newAngle = getAngleFromDisplacement(displacement, imageSize, size, zeroAnchor)\n\n if (angle !== newAngle) {\n setAngle(newAngle)\n }\n }, [displacement, imageSize, size, zeroAnchor])\n\n useEffect(() => {\n onAngleChange?.(angle, isDragging)\n onPositionChange?.(angle / 360, isDragging)\n }, [angle])\n\n const fixedStyles = asStyleDict({\n body: {\n backgroundImage: `url(${src})`,\n backgroundPositionX: `${-displacement}px`,\n backgroundRepeat: 'repeat',\n backgroundSize: 'auto 100%',\n height: '100%',\n touchAction: 'none',\n width: '100%',\n },\n })\n\n return (\n <div {...props} ref={ref}>\n <div ref={bodyRef} style={fixedStyles.body}/>\n </div>\n )\n})\n\nfunction getFilledImageSize(originalSize: Size, sizeToFill: Size): Size {\n const { width: originalWidth, height: originalHeight } = originalSize\n const { height: filledHeignt } = sizeToFill\n\n if (originalHeight <= 0) return new Size()\n\n const aspectRatio = filledHeignt / originalHeight\n const filledWidth = aspectRatio * originalWidth\n\n return new Size([filledWidth, filledHeignt])\n}\n\nfunction getDisplacementFromAngle(angle: number, originalImageSize: Size, componentSize: Size, zeroAnchor: number): number {\n const { width: imageWidth } = getFilledImageSize(originalImageSize, componentSize)\n const { width: componentWidth } = componentSize\n const offset = componentWidth * zeroAnchor\n\n return angle / 360 * imageWidth - offset\n}\n\nfunction getAngleFromDisplacement(displacement: number, originalImageSize: Size, componentSize: Size, zeroAnchor: number): number {\n const { width: imageWidth } = getFilledImageSize(originalImageSize, componentSize)\n const { width: componentWidth } = componentSize\n const offset = componentWidth * zeroAnchor\n\n let angle = (displacement + offset) % imageWidth / imageWidth * 360\n while (angle < 0) angle += 360\n\n return angle\n}\n"]}
1
+ {"version":3,"file":"Panorama.js","sourceRoot":"/","sources":["Panorama.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { forwardRef, useEffect, useRef, useState, type HTMLAttributes } from 'react'\nimport { Size } from 'spase'\nimport useDragEffect from './hooks/useDragEffect'\nimport useLoadImageEffect from './hooks/useLoadImageEffect'\nimport useResizeEffect from './hooks/useResizeEffect'\nimport asStyleDict from './utils/asStyleDict'\n\nexport type PanoramaProps = Omit<HTMLAttributes<HTMLDivElement>, 'onResize'> & {\n /**\n * The current angle in degrees, 0.0 - 360.0, inclusive. When angle is 0 or\n * 360, the left bound of the image is at the center of the component.\n */\n angle?: number\n\n /**\n * The panning speed. This is a multiplier to the number of pixels dragged,\n * i.e. when set to 1, the image will shift the same amount of pixels that\n * were dragged.\n */\n speed?: number\n\n /**\n * The source URL of the image.\n */\n src?: string\n\n /**\n * A decimal percentage of the component width indicating where 0° should be,\n * i.e. if `zeroAnchor` is `0`, the `angle` would be 0° when the left edge of\n * the image is at the left edge of the component.\n */\n zeroAnchor?: number\n\n /**\n * Handler invoked when the positionchanges. This can either be invoked from\n * the `angle` prop being changed or from the image being dragged.\n *\n * @param position The current 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 the angle changes. This can either be invoked from the\n * `angle` prop being changed or from the image being dragged. When `angle` is\n * being double-binded, ensure that the value is only being set by this\n * handler when `isDragging` is `true` to avoid potential update overflow.\n *\n * @param angle The current angle.\n * @param isDragging Specifies if the angle change is due to dragging.\n */\n onAngleChange?: (angle: number, isDragging: boolean) => void\n\n /**\n * Handler invoked when dragging starts.\n */\n onDragStart?: () => void\n\n /**\n * Handler invoked when dragging ends.\n */\n onDragEnd?: () => void\n\n /**\n * Handler invoked when the image begins loading.\n */\n onImageLoadStart?: () => void\n\n /**\n * Handler invoked when the image is done loading.\n *\n * @param imageElement The loaded image element.\n */\n onImageLoadComplete?: (imageElement: HTMLImageElement) => void\n\n /**\n * Handler invoked when there is an error loading the image.\n */\n onImageLoadError?: () => void\n\n /**\n * Handler invoked when the image size changes. This is the actual size of the\n * loaded image. When no images are loaded yet, the size is `undefined`.\n *\n * @param size The actual size of the loaded iamge. If no images are loaded\n * yet, the size is `undefined`.\n */\n onImageSizeChange?: (size?: Size) => void\n\n /**\n * Handler invoked when the size of this component changes.\n *\n * @param size The size of this component.\n */\n onResize?: (size: Size) => void\n}\n\n/**\n * A component containing a pannable 360° panorama image. The angle supports\n * two-way binding.\n */\nexport default forwardRef<HTMLDivElement, PanoramaProps>(({\n angle: externalAngle = 0,\n speed = 1,\n src,\n zeroAnchor = 0,\n onAngleChange,\n onPositionChange,\n onDragStart,\n onDragEnd,\n onImageLoadStart,\n onImageLoadComplete,\n onImageLoadError,\n onImageSizeChange,\n onResize,\n ...props\n}, ref) => {\n const mapDragPositionToDisplacement = (currentPosition: number, dx: number, dy: number): number => {\n const newDisplacement = currentPosition - dx * speed\n\n return newDisplacement\n }\n\n const bodyRef = useRef<HTMLDivElement>(null)\n const [size] = useResizeEffect(bodyRef, { onResize })\n const [angle, setAngle] = useState(externalAngle)\n\n const { isLoading: [isLoading], imageSize: [imageSize] } = useLoadImageEffect(src, {\n onImageLoadComplete,\n onImageLoadError,\n onImageSizeChange,\n })\n\n const { isDragging: [isDragging], value: [displacement, setDisplacement] } = useDragEffect(bodyRef, {\n initialValue: 0,\n transform: mapDragPositionToDisplacement,\n onDragStart,\n onDragEnd,\n })\n\n useEffect(() => {\n if (isDragging || isLoading || !imageSize) return\n\n const newDisplacement = getDisplacementFromAngle(externalAngle, imageSize, size, zeroAnchor)\n\n if (newDisplacement !== displacement) {\n setDisplacement(newDisplacement)\n }\n\n if (externalAngle !== angle) {\n setAngle(externalAngle)\n }\n }, [externalAngle, isLoading, imageSize, size, zeroAnchor])\n\n useEffect(() => {\n if (!isDragging || !imageSize) return\n\n const newAngle = getAngleFromDisplacement(displacement, imageSize, size, zeroAnchor)\n\n if (angle !== newAngle) {\n setAngle(newAngle)\n }\n }, [displacement, imageSize, size, zeroAnchor])\n\n useEffect(() => {\n onAngleChange?.(angle, isDragging)\n onPositionChange?.(angle / 360, isDragging)\n }, [angle])\n\n const fixedStyles = asStyleDict({\n body: {\n backgroundImage: `url(${src})`,\n backgroundPositionX: `${-displacement}px`,\n backgroundRepeat: 'repeat',\n backgroundSize: 'auto 100%',\n height: '100%',\n touchAction: 'none',\n width: '100%',\n },\n })\n\n return (\n <div {...props} ref={ref}>\n <div ref={bodyRef} style={fixedStyles.body}/>\n </div>\n )\n})\n\nfunction getFilledImageSize(originalSize: Size, sizeToFill: Size): Size {\n const { width: originalWidth, height: originalHeight } = originalSize\n const { height: filledHeignt } = sizeToFill\n\n if (originalHeight <= 0) return new Size()\n\n const aspectRatio = filledHeignt / originalHeight\n const filledWidth = aspectRatio * originalWidth\n\n return new Size([filledWidth, filledHeignt])\n}\n\nfunction getDisplacementFromAngle(angle: number, originalImageSize: Size, componentSize: Size, zeroAnchor: number): number {\n const { width: imageWidth } = getFilledImageSize(originalImageSize, componentSize)\n const { width: componentWidth } = componentSize\n const offset = componentWidth * zeroAnchor\n\n return angle / 360 * imageWidth - offset\n}\n\nfunction getAngleFromDisplacement(displacement: number, originalImageSize: Size, componentSize: Size, zeroAnchor: number): number {\n const { width: imageWidth } = getFilledImageSize(originalImageSize, componentSize)\n const { width: componentWidth } = componentSize\n const offset = componentWidth * zeroAnchor\n\n let angle = (displacement + offset) % imageWidth / imageWidth * 360\n while (angle < 0) angle += 360\n\n return angle\n}\n"]}
@@ -1,6 +1,6 @@
1
- import React, { HTMLAttributes, PropsWithChildren } from 'react';
2
- import { Size } from 'spase';
3
- import { PanoramaProps } from './Panorama';
1
+ import React, { type HTMLAttributes, type PropsWithChildren } from 'react';
2
+ import { type Size } from 'spase';
3
+ import { type PanoramaProps } from './Panorama';
4
4
  export type PanoramaSliderProps = HTMLAttributes<HTMLDivElement> & PanoramaProps & PropsWithChildren<{
5
5
  /**
6
6
  * Field-of-view (0.0 - 360.0 degrees, inclusive) that represents the size of
@@ -27,11 +27,11 @@ export type PanoramaSliderProps = HTMLAttributes<HTMLDivElement> & PanoramaProps
27
27
  /**
28
28
  * A slider for a {@link Panorama} component.
29
29
  *
30
- * @exports PanoramaSliderIndicator - The indicator that appears when the slider
31
- * is being dragged.
32
- * @exports PanoramaSliderReticle - The reticle that indicates the FOV of the
33
- * backing {@link Panorama}.
34
- * @exports PanoramaSliderTrack - The slide track.
30
+ * @exports PanoramaSliderIndicator The indicator that appears when the slider
31
+ * is being dragged.
32
+ * @exports PanoramaSliderReticle The reticle that indicates the FOV of the
33
+ * backing {@link Panorama}.
34
+ * @exports PanoramaSliderTrack The slide track.
35
35
  */
36
36
  declare const _default: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & Omit<React.HTMLAttributes<HTMLDivElement>, "onResize"> & {
37
37
  angle?: number | undefined;
@@ -67,8 +67,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
67
67
  exports.PanoramaSliderIndicator = exports.PanoramaSliderReticle = exports.PanoramaSliderTrack = void 0;
68
68
  var classnames_1 = __importDefault(require("classnames"));
69
69
  var react_1 = __importStar(require("react"));
70
- var useResizeEffect_1 = __importDefault(require("./hooks/useResizeEffect"));
71
70
  var Panorama_1 = __importDefault(require("./Panorama"));
71
+ var useResizeEffect_1 = __importDefault(require("./hooks/useResizeEffect"));
72
72
  var asClassNameDict_1 = __importDefault(require("./utils/asClassNameDict"));
73
73
  var asComponentDict_1 = __importDefault(require("./utils/asComponentDict"));
74
74
  var asStyleDict_1 = __importDefault(require("./utils/asStyleDict"));
@@ -77,11 +77,11 @@ var styles_1 = __importDefault(require("./utils/styles"));
77
77
  /**
78
78
  * A slider for a {@link Panorama} component.
79
79
  *
80
- * @exports PanoramaSliderIndicator - The indicator that appears when the slider
81
- * is being dragged.
82
- * @exports PanoramaSliderReticle - The reticle that indicates the FOV of the
83
- * backing {@link Panorama}.
84
- * @exports PanoramaSliderTrack - The slide track.
80
+ * @exports PanoramaSliderIndicator The indicator that appears when the slider
81
+ * is being dragged.
82
+ * @exports PanoramaSliderReticle The reticle that indicates the FOV of the
83
+ * backing {@link Panorama}.
84
+ * @exports PanoramaSliderTrack The slide track.
85
85
  */
86
86
  exports.default = (0, react_1.forwardRef)(function (_a, ref) {
87
87
  var _b, _c, _d, _e;
@@ -1 +1 @@
1
- {"version":3,"file":"PanoramaSlider.js","sourceRoot":"/","sources":["PanoramaSlider.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames'\nimport React, { forwardRef, HTMLAttributes, PropsWithChildren, useRef, useState } from 'react'\nimport { Size } from 'spase'\nimport useResizeEffect from './hooks/useResizeEffect'\nimport Panorama, { PanoramaProps } from './Panorama'\nimport asClassNameDict from './utils/asClassNameDict'\nimport asComponentDict from './utils/asComponentDict'\nimport asStyleDict from './utils/asStyleDict'\nimport cloneStyledElement from './utils/cloneStyledElement'\nimport styles from './utils/styles'\n\nexport type PanoramaSliderProps = HTMLAttributes<HTMLDivElement> & 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/**\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 default forwardRef<HTMLDivElement, PanoramaSliderProps>(({\n className,\n style,\n angle = 0,\n autoDimension = 'width',\n children,\n fov,\n speed = 1,\n src,\n viewportSize,\n zeroAnchor = 0,\n onAngleChange,\n onDragEnd,\n onDragStart,\n onImageLoadComplete,\n onImageLoadError,\n onImageLoadStart,\n onImageSizeChange,\n onPositionChange,\n onResize,\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 size.width * (deg / 360)\n }\n\n const getAdjustedZeroAnchor = () => {\n if (size.width <= 0) return zeroAnchor\n\n return ((size.width - reticleWidth) * 0.5 + zeroAnchor * reticleWidth) / size.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\n const [imageSize, setImageSize] = useState<Size | undefined>(undefined)\n const [isDragging, setIsDragging] = useState(false)\n\n const [size] = useResizeEffect(panoramaRef, { onResize })\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 fixedClassNames = asClassNameDict({\n root: classNames({\n dragging: isDragging,\n }),\n track: classNames({\n dragging: isDragging,\n }),\n reticle: classNames({\n dragging: isDragging,\n }),\n indicator: classNames({\n dragging: isDragging,\n }),\n })\n\n const fixedStyles = asStyleDict({\n root: {\n ...autoDimension === 'width' ? {\n width: `${size.height * aspectRatio}px`,\n } : {\n height: `${size.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 const defaultStyles = 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 return (\n <div\n {...props}\n ref={ref}\n className={classNames(className, fixedClassNames.root)}\n style={styles(style, fixedStyles.root)}\n >\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 onImageLoadComplete={onImageLoadComplete}\n onImageLoadError={onImageLoadError}\n onImageLoadStart={onImageLoadStart}\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 className: classNames(fixedClassNames.track),\n style: styles(fixedStyles.track),\n })}\n {cloneStyledElement(components.reticle ?? <PanoramaSliderReticle style={defaultStyles.reticle}/>, {\n className: classNames(fixedClassNames.reticle),\n style: styles(fixedStyles.reticle),\n })}\n {cloneStyledElement(components.track ?? <PanoramaSliderTrack style={defaultStyles.track}/>, {\n className: classNames(fixedClassNames.track),\n style: styles(fixedStyles.track),\n })}\n </div>\n </div>\n {cloneStyledElement(components.indicator ?? <PanoramaSliderIndicator style={defaultStyles.indicator}/>, {\n className: classNames(fixedClassNames.indicator),\n style: styles(fixedStyles.indicator),\n })}\n </div>\n )\n})\n\nexport const PanoramaSliderTrack = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n\nexport const PanoramaSliderReticle = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n\nexport const PanoramaSliderIndicator = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n"]}
1
+ {"version":3,"file":"PanoramaSlider.js","sourceRoot":"/","sources":["PanoramaSlider.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames'\nimport React, { forwardRef, useRef, useState, type HTMLAttributes, type PropsWithChildren } from 'react'\nimport { type Size } from 'spase'\nimport Panorama, { type PanoramaProps } from './Panorama'\nimport useResizeEffect from './hooks/useResizeEffect'\nimport asClassNameDict from './utils/asClassNameDict'\nimport asComponentDict from './utils/asComponentDict'\nimport asStyleDict from './utils/asStyleDict'\nimport cloneStyledElement from './utils/cloneStyledElement'\nimport styles from './utils/styles'\n\nexport type PanoramaSliderProps = HTMLAttributes<HTMLDivElement> & 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/**\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 default forwardRef<HTMLDivElement, PanoramaSliderProps>(({\n className,\n style,\n angle = 0,\n autoDimension = 'width',\n children,\n fov,\n speed = 1,\n src,\n viewportSize,\n zeroAnchor = 0,\n onAngleChange,\n onDragEnd,\n onDragStart,\n onImageLoadComplete,\n onImageLoadError,\n onImageLoadStart,\n onImageSizeChange,\n onPositionChange,\n onResize,\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 size.width * (deg / 360)\n }\n\n const getAdjustedZeroAnchor = () => {\n if (size.width <= 0) return zeroAnchor\n\n return ((size.width - reticleWidth) * 0.5 + zeroAnchor * reticleWidth) / size.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\n const [imageSize, setImageSize] = useState<Size | undefined>(undefined)\n const [isDragging, setIsDragging] = useState(false)\n\n const [size] = useResizeEffect(panoramaRef, { onResize })\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 fixedClassNames = asClassNameDict({\n root: classNames({\n dragging: isDragging,\n }),\n track: classNames({\n dragging: isDragging,\n }),\n reticle: classNames({\n dragging: isDragging,\n }),\n indicator: classNames({\n dragging: isDragging,\n }),\n })\n\n const fixedStyles = asStyleDict({\n root: {\n ...autoDimension === 'width' ? {\n width: `${size.height * aspectRatio}px`,\n } : {\n height: `${size.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 const defaultStyles = 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 return (\n <div\n {...props}\n ref={ref}\n className={classNames(className, fixedClassNames.root)}\n style={styles(style, fixedStyles.root)}\n >\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 onImageLoadComplete={onImageLoadComplete}\n onImageLoadError={onImageLoadError}\n onImageLoadStart={onImageLoadStart}\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 className: classNames(fixedClassNames.track),\n style: styles(fixedStyles.track),\n })}\n {cloneStyledElement(components.reticle ?? <PanoramaSliderReticle style={defaultStyles.reticle}/>, {\n className: classNames(fixedClassNames.reticle),\n style: styles(fixedStyles.reticle),\n })}\n {cloneStyledElement(components.track ?? <PanoramaSliderTrack style={defaultStyles.track}/>, {\n className: classNames(fixedClassNames.track),\n style: styles(fixedStyles.track),\n })}\n </div>\n </div>\n {cloneStyledElement(components.indicator ?? <PanoramaSliderIndicator style={defaultStyles.indicator}/>, {\n className: classNames(fixedClassNames.indicator),\n style: styles(fixedStyles.indicator),\n })}\n </div>\n )\n})\n\nexport const PanoramaSliderTrack = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n\nexport const PanoramaSliderReticle = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n\nexport const PanoramaSliderIndicator = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n"]}
@@ -1,4 +1,4 @@
1
- import React, { HTMLAttributes, PropsWithChildren } from 'react';
1
+ import React, { type HTMLAttributes, type PropsWithChildren } from 'react';
2
2
  type Orientation = 'horizontal' | 'vertical';
3
3
  type Range = [number, number];
4
4
  export type RangeSliderProps = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{
@@ -1 +1 @@
1
- {"version":3,"file":"RangeSlider.js","sourceRoot":"/","sources":["RangeSlider.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames'\nimport isEqual from 'fast-deep-equal'\nimport React, { forwardRef, HTMLAttributes, PropsWithChildren, useEffect, useRef, useState } from 'react'\nimport useDragEffect from './hooks/useDragEffect'\nimport useResizeEffect from './hooks/useResizeEffect'\nimport asClassNameDict from './utils/asClassNameDict'\nimport asComponentDict from './utils/asComponentDict'\nimport asStyleDict from './utils/asStyleDict'\nimport cloneStyledElement from './utils/cloneStyledElement'\nimport styles from './utils/styles'\n\ntype Orientation = 'horizontal' | 'vertical'\n\ntype Range = [number, number]\n\nexport type RangeSliderProps = HTMLAttributes<HTMLDivElement> & 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 onRangeChange?: (range: Range) => void\n}>\n\nexport default forwardRef<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 onRangeChange,\n ...props\n}, ref) => {\n const getPositionByValue = (value: number) => (value - minValue) / (maxValue - minValue)\n const getPositionByDisplacement = (displacement: number) => displacement / (orientation === 'horizontal' ? size.width : size.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' ? size.width : size.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 startKnobRef = useRef<HTMLDivElement>(null)\n const endKnobRef = useRef<HTMLDivElement>(null)\n\n const [size] = useResizeEffect(bodyRef)\n\n const [range, setRange] = useState<Range>(externalRange ?? [minValue, maxValue])\n\n const { isDragging: [isDraggingStartKnob], isReleasing: [isReleasingStartKnob], value: [startValue, setStartValue] } = useDragEffect(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, size, range[1]])\n\n const { isDragging: [isDraggingEndKnob], isReleasing: [isReleasingEndKnob], value: [endValue, setEndValue] } = useDragEffect(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, size, 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 || isEqual(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 fixedClassNames = asClassNameDict({\n root: classNames(orientation),\n gutter: classNames(orientation),\n highlight: classNames(orientation),\n knob: classNames(orientation),\n label: classNames(orientation),\n })\n\n const fixedStyles = 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 const defaultStyles = 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 return (\n <div {...props} ref={ref} className={classNames(className, fixedClassNames.root)}>\n <div ref={bodyRef} style={fixedStyles.body}>\n {cloneStyledElement(components.gutter ?? <RangeSliderGutter style={defaultStyles.gutter}/>, {\n className: classNames(fixedClassNames.gutter),\n style: styles(fixedStyles.gutter),\n })}\n {cloneStyledElement(components.highlight ?? <RangeSliderHighlight style={defaultStyles.highlight}/>, {\n className: classNames(fixedClassNames.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: isEqual([startValue, endValue], [maxValue, maxValue]),\n className: classNames(fixedClassNames.knob, {\n dragging: isDraggingStartKnob,\n releasing: isReleasingStartKnob,\n }),\n style: styles(fixedStyles.knob, {\n pointerEvents: isEqual([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: classNames(fixedClassNames.label, {\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: isEqual([startValue, endValue], [maxValue, maxValue]),\n className: classNames(fixedClassNames.knob, {\n dragging: isDraggingEndKnob,\n releasing: isDraggingEndKnob,\n }),\n style: styles(fixedStyles.knob, {\n pointerEvents: isEqual([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: classNames(fixedClassNames.label, {\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\nexport const RangeSliderGutter = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n\nexport const RangeSliderLabel = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n\nexport const RangeSliderHighlight = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n\nexport const RangeSliderKnob = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref}/>)\n"]}
1
+ {"version":3,"file":"RangeSlider.js","sourceRoot":"/","sources":["RangeSlider.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames'\nimport isEqual from 'fast-deep-equal'\nimport React, { forwardRef, useEffect, useRef, useState, type HTMLAttributes, type PropsWithChildren } from 'react'\nimport useDragEffect from './hooks/useDragEffect'\nimport useResizeEffect from './hooks/useResizeEffect'\nimport asClassNameDict from './utils/asClassNameDict'\nimport asComponentDict from './utils/asComponentDict'\nimport asStyleDict from './utils/asStyleDict'\nimport cloneStyledElement from './utils/cloneStyledElement'\nimport styles from './utils/styles'\n\ntype Orientation = 'horizontal' | 'vertical'\n\ntype Range = [number, number]\n\nexport type RangeSliderProps = HTMLAttributes<HTMLDivElement> & 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 onRangeChange?: (range: Range) => void\n}>\n\nexport default forwardRef<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 onRangeChange,\n ...props\n}, ref) => {\n const getPositionByValue = (value: number) => (value - minValue) / (maxValue - minValue)\n const getPositionByDisplacement = (displacement: number) => displacement / (orientation === 'horizontal' ? size.width : size.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' ? size.width : size.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 startKnobRef = useRef<HTMLDivElement>(null)\n const endKnobRef = useRef<HTMLDivElement>(null)\n\n const [size] = useResizeEffect(bodyRef)\n\n const [range, setRange] = useState<Range>(externalRange ?? [minValue, maxValue])\n\n const { isDragging: [isDraggingStartKnob], isReleasing: [isReleasingStartKnob], value: [startValue, setStartValue] } = useDragEffect(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, size, range[1]])\n\n const { isDragging: [isDraggingEndKnob], isReleasing: [isReleasingEndKnob], value: [endValue, setEndValue] } = useDragEffect(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, size, 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 || isEqual(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 fixedClassNames = asClassNameDict({\n root: classNames(orientation),\n gutter: classNames(orientation),\n highlight: classNames(orientation),\n knob: classNames(orientation),\n label: classNames(orientation),\n })\n\n const fixedStyles = 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 const defaultStyles = 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 return (\n <div {...props} ref={ref} className={classNames(className, fixedClassNames.root)}>\n <div ref={bodyRef} style={fixedStyles.body}>\n {cloneStyledElement(components.gutter ?? <RangeSliderGutter style={defaultStyles.gutter}/>, {\n className: classNames(fixedClassNames.gutter),\n style: styles(fixedStyles.gutter),\n })}\n {cloneStyledElement(components.highlight ?? <RangeSliderHighlight style={defaultStyles.highlight}/>, {\n className: classNames(fixedClassNames.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: isEqual([startValue, endValue], [maxValue, maxValue]),\n className: classNames(fixedClassNames.knob, {\n dragging: isDraggingStartKnob,\n releasing: isReleasingStartKnob,\n }),\n style: styles(fixedStyles.knob, {\n pointerEvents: isEqual([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: classNames(fixedClassNames.label, {\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: isEqual([startValue, endValue], [maxValue, maxValue]),\n className: classNames(fixedClassNames.knob, {\n dragging: isDraggingEndKnob,\n releasing: isDraggingEndKnob,\n }),\n style: styles(fixedStyles.knob, {\n pointerEvents: isEqual([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: classNames(fixedClassNames.label, {\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\nexport const RangeSliderGutter = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n\nexport const RangeSliderLabel = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n\nexport const RangeSliderHighlight = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n\nexport const RangeSliderKnob = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(({ ...props }, ref) => <div {...props} ref={ref}/>)\n"]}
package/lib/Repeat.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import React, { ReactNode } from 'react';
1
+ import React, { type ReactNode } from 'react';
2
2
  export type RepeatProps = {
3
3
  children?: ReactNode | ((index: number) => ReactNode);
4
4
  count?: number;
package/lib/Repeat.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Repeat.js","sourceRoot":"/","sources":["Repeat.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAkD;AAQlD;;;GAGG;AACH,SAAwB,MAAM,CAAC,EAIjB;QAHZ,aAAS,EAAT,KAAK,mBAAG,CAAC,KAAA,EACT,QAAQ,cAAA,EACR,MAAM,YAAA;IAEN,OAAO,CACL,8DACG,yBAAI,KAAK,CAAC,KAAK,CAAC,UAAE,GAAG,CAAC,UAAC,CAAC,EAAE,CAAC,IAAK,OAAA,CAC/B,8BAAC,gBAAQ,IAAC,GAAG,EAAE,kBAAW,CAAC,CAAE,IAC1B,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CACpE,CACZ,EAJgC,CAIhC,CAAC,CACD,CACJ,CAAA;AACH,CAAC;AAdD,yBAcC","sourcesContent":["import React, { Fragment, ReactNode } from 'react'\n\nexport type RepeatProps = {\n children?: ReactNode | ((index: number) => ReactNode)\n count?: number\n render?: (index: number) => ReactNode\n}\n\n/**\n * A tag-less component that repeats its children, automatically assigning each\n * a unique key.\n */\nexport default function Repeat({\n count = 1,\n children,\n render,\n}: RepeatProps) {\n return (\n <>\n {[...Array(count)].map((v, i) => (\n <Fragment key={`element-${i}`}>\n {render ? render(i) : typeof children === 'function' ? children(i) : children}\n </Fragment>\n ))}\n </>\n )\n}\n"]}
1
+ {"version":3,"file":"Repeat.js","sourceRoot":"/","sources":["Repeat.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAuD;AAQvD;;;GAGG;AACH,SAAwB,MAAM,CAAC,EAIjB;QAHZ,aAAS,EAAT,KAAK,mBAAG,CAAC,KAAA,EACT,QAAQ,cAAA,EACR,MAAM,YAAA;IAEN,OAAO,CACL,8DACG,yBAAI,KAAK,CAAC,KAAK,CAAC,UAAE,GAAG,CAAC,UAAC,CAAC,EAAE,CAAC,IAAK,OAAA,CAC/B,8BAAC,gBAAQ,IAAC,GAAG,EAAE,kBAAW,CAAC,CAAE,IAC1B,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,QAAQ,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CACpE,CACZ,EAJgC,CAIhC,CAAC,CACD,CACJ,CAAA;AACH,CAAC;AAdD,yBAcC","sourcesContent":["import React, { Fragment, type ReactNode } from 'react'\n\nexport type RepeatProps = {\n children?: ReactNode | ((index: number) => ReactNode)\n count?: number\n render?: (index: number) => ReactNode\n}\n\n/**\n * A tag-less component that repeats its children, automatically assigning each\n * a unique key.\n */\nexport default function Repeat({\n count = 1,\n children,\n render,\n}: RepeatProps) {\n return (\n <>\n {[...Array(count)].map((v, i) => (\n <Fragment key={`element-${i}`}>\n {render ? render(i) : typeof children === 'function' ? children(i) : children}\n </Fragment>\n ))}\n </>\n )\n}\n"]}
@@ -1,4 +1,4 @@
1
- import React, { HTMLAttributes, PropsWithChildren } from 'react';
1
+ import React, { type HTMLAttributes, type PropsWithChildren } from 'react';
2
2
  export type RotatingGalleryProps = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{
3
3
  /**
4
4
  * Current image index. An error is thrown if the index is invalid (must be
@@ -23,15 +23,15 @@ export type RotatingGalleryProps = HTMLAttributes<HTMLDivElement> & PropsWithChi
23
23
  /**
24
24
  * Handler invoked when the image index changes.
25
25
  *
26
- * @param index - The current image index.
26
+ * @param index The current image index.
27
27
  */
28
28
  onIndexChange?: (index: number) => void;
29
29
  }>;
30
30
  /**
31
31
  * A component displaying rotating images.
32
32
  *
33
- * @exports RotatingGalleryImage - Component for each rotating image, classes:
34
- * `entering`, `entered`, `exiting`, `exited`.
33
+ * @exports RotatingGalleryImage Component for each rotating image, classes:
34
+ * `entering`, `entered`, `exiting`, `exited`.
35
35
  */
36
36
  declare const _default: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
37
37
  /**
@@ -57,7 +57,7 @@ declare const _default: React.ForwardRefExoticComponent<React.HTMLAttributes<HTM
57
57
  /**
58
58
  * Handler invoked when the image index changes.
59
59
  *
60
- * @param index - The current image index.
60
+ * @param index The current image index.
61
61
  */
62
62
  onIndexChange?: ((index: number) => void) | undefined;
63
63
  } & {
@@ -77,8 +77,8 @@ var styles_1 = __importDefault(require("./utils/styles"));
77
77
  /**
78
78
  * A component displaying rotating images.
79
79
  *
80
- * @exports RotatingGalleryImage - Component for each rotating image, classes:
81
- * `entering`, `entered`, `exiting`, `exited`.
80
+ * @exports RotatingGalleryImage Component for each rotating image, classes:
81
+ * `entering`, `entered`, `exiting`, `exited`.
82
82
  */
83
83
  exports.default = (0, react_1.forwardRef)(function (_a, ref) {
84
84
  var children = _a.children, _b = _a.index, externalIndex = _b === void 0 ? 0 : _b, rotationDuration = _a.rotationDuration, _c = _a.srcs, srcs = _c === void 0 ? [] : _c, _d = _a.transitionDuration, transitionDuration = _d === void 0 ? 500 : _d, onIndexChange = _a.onIndexChange, props = __rest(_a, ["children", "index", "rotationDuration", "srcs", "transitionDuration", "onIndexChange"]);
@@ -1 +1 @@
1
- {"version":3,"file":"RotatingGallery.js","sourceRoot":"/","sources":["RotatingGallery.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames'\nimport React, { forwardRef, HTMLAttributes, PropsWithChildren, useEffect, useState } from 'react'\nimport { Transition } from 'react-transition-group'\nimport Each from './Each'\nimport useInterval from './hooks/useInterval'\nimport asComponentDict from './utils/asComponentDict'\nimport asStyleDict from './utils/asStyleDict'\nimport cloneStyledElement from './utils/cloneStyledElement'\nimport styles from './utils/styles'\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 * An array of image paths.\n */\n srcs?: string[]\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 * The duration of an image transition in milliseconds.\n */\n transitionDuration?: number\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/**\n * A component displaying rotating images.\n *\n * @exports RotatingGalleryImage - Component for each rotating image, classes:\n * `entering`, `entered`, `exiting`, `exited`.\n */\nexport default forwardRef<HTMLDivElement, RotatingGalleryProps>(({\n children,\n index: externalIndex = 0,\n rotationDuration,\n srcs = [],\n transitionDuration = 500,\n onIndexChange,\n ...props\n}, ref) => {\n const [index, setIndex] = useState(externalIndex)\n\n useInterval(() => {\n setIndex((index + 1) % srcs.length)\n }, rotationDuration, undefined, [index])\n\n useEffect(() => {\n if (externalIndex === index) return\n setIndex(externalIndex)\n }, [externalIndex])\n\n useEffect(() => {\n onIndexChange?.(index)\n }, [index])\n\n const components = asComponentDict(children, {\n image: RotatingGalleryImage,\n })\n\n const fixedStyles = asStyleDict({\n image: {\n backgroundRepeat: 'no-repeat',\n backgroundSize: 'cover',\n height: '100%',\n left: '0',\n position: 'absolute',\n top: '0',\n width: '100%',\n transitionDuration: `${transitionDuration}ms`,\n },\n })\n\n const defaultStyles = asStyleDict({\n image: {\n transitionProperty: 'opacity',\n transitionTimingFunction: 'ease-out',\n },\n })\n\n return (\n <div {...props} ref={ref}>\n <Each in={srcs}>\n {(src, idx) => (\n <Transition in={idx === index} timeout={transitionDuration}>\n {state => cloneStyledElement(components.image ?? <RotatingGalleryImage style={styles(\n defaultStyles.image,\n state === 'entering' && { opacity: '1' },\n state === 'exiting' && { opacity: '0' },\n )}/>, {\n className: classNames(state),\n style: styles(fixedStyles.image, {\n backgroundImage: `url(${src})`,\n }),\n })}\n </Transition>\n )}\n </Each>\n </div>\n )\n})\n\nexport const RotatingGalleryImage = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n"]}
1
+ {"version":3,"file":"RotatingGallery.js","sourceRoot":"/","sources":["RotatingGallery.tsx"],"names":[],"mappings":"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","sourcesContent":["import classNames from 'classnames'\nimport React, { forwardRef, useEffect, useState, type HTMLAttributes, type PropsWithChildren } from 'react'\nimport { Transition } from 'react-transition-group'\nimport Each from './Each'\nimport useInterval from './hooks/useInterval'\nimport asComponentDict from './utils/asComponentDict'\nimport asStyleDict from './utils/asStyleDict'\nimport cloneStyledElement from './utils/cloneStyledElement'\nimport styles from './utils/styles'\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 * An array of image paths.\n */\n srcs?: string[]\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 * The duration of an image transition in milliseconds.\n */\n transitionDuration?: number\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/**\n * A component displaying rotating images.\n *\n * @exports RotatingGalleryImage Component for each rotating image, classes:\n * `entering`, `entered`, `exiting`, `exited`.\n */\nexport default forwardRef<HTMLDivElement, RotatingGalleryProps>(({\n children,\n index: externalIndex = 0,\n rotationDuration,\n srcs = [],\n transitionDuration = 500,\n onIndexChange,\n ...props\n}, ref) => {\n const [index, setIndex] = useState(externalIndex)\n\n useInterval(() => {\n setIndex((index + 1) % srcs.length)\n }, rotationDuration, undefined, [index])\n\n useEffect(() => {\n if (externalIndex === index) return\n setIndex(externalIndex)\n }, [externalIndex])\n\n useEffect(() => {\n onIndexChange?.(index)\n }, [index])\n\n const components = asComponentDict(children, {\n image: RotatingGalleryImage,\n })\n\n const fixedStyles = asStyleDict({\n image: {\n backgroundRepeat: 'no-repeat',\n backgroundSize: 'cover',\n height: '100%',\n left: '0',\n position: 'absolute',\n top: '0',\n width: '100%',\n transitionDuration: `${transitionDuration}ms`,\n },\n })\n\n const defaultStyles = asStyleDict({\n image: {\n transitionProperty: 'opacity',\n transitionTimingFunction: 'ease-out',\n },\n })\n\n return (\n <div {...props} ref={ref}>\n <Each in={srcs}>\n {(src, idx) => (\n <Transition in={idx === index} timeout={transitionDuration}>\n {state => cloneStyledElement(components.image ?? <RotatingGalleryImage style={styles(\n defaultStyles.image,\n state === 'entering' && { opacity: '1' },\n state === 'exiting' && { opacity: '0' },\n )}/>, {\n className: classNames(state),\n style: styles(fixedStyles.image, {\n backgroundImage: `url(${src})`,\n }),\n })}\n </Transition>\n )}\n </Each>\n </div>\n )\n})\n\nexport const RotatingGalleryImage = ({ ...props }: HTMLAttributes<HTMLDivElement>) => <div {...props}/>\n"]}
@@ -1,4 +1,4 @@
1
- import React, { HTMLAttributes, ReactNode } from 'react';
1
+ import React, { type HTMLAttributes, type ReactNode } from 'react';
2
2
  export type SelectableButtonProps = Omit<HTMLAttributes<HTMLButtonElement>, 'children'> & {
3
3
  children?: (props: Pick<SelectableButtonProps, 'isDeselectable' | 'isDisabled' | 'isSelected' | 'label'>) => ReactNode;
4
4
  isDeselectable?: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"SelectableButton.js","sourceRoot":"/","sources":["SelectableButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAyF;AAYzF,kBAAe,IAAA,kBAAU,EAA2C,UAAC,EASpE,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,cAR2D,6FASpE,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;YACd,IAAI,CAAC,cAAc;gBAAE,OAAM;YAC3B,aAAa,CAAC,KAAK,CAAC,CAAA;YACpB,UAAU,aAAV,UAAU,uBAAV,UAAU,EAAI,CAAA;SACf;aACI;YACH,aAAa,CAAC,IAAI,CAAC,CAAA;YACnB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,EAAI,CAAA;SACb;IACH,CAAC,CAAA;IAED,IAAA,iBAAS,EAAC;QACR,aAAa,CAAC,kBAAkB,CAAC,CAAA;IACnC,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAA;IAExB,OAAO,CACL,qDACM,KAAK,IACT,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,cAAM,OAAA,eAAe,EAAE,EAAjB,CAAiB,EAAE,QAAQ,EAAE,UAAU,IAAI,UAAU,IAAI,CAAC,cAAc,KAEtF,MAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,EAAE,cAAc,gBAAA,EAAE,UAAU,YAAA,EAAE,UAAU,YAAA,EAAE,KAAK,OAAA,EAAE,CAAC,mCAAI,KAAK,CAChE,CACV,CAAA;AACH,CAAC,CAAC,CAAA","sourcesContent":["import React, { forwardRef, HTMLAttributes, ReactNode, useEffect, useState } 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 default 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 onClick={() => toggleSelection()} disabled={isDisabled || isSelected && !isDeselectable}\n >\n {children?.({ isDeselectable, isDisabled, isSelected, label }) ?? label}\n </button>\n )\n})\n"]}
1
+ {"version":3,"file":"SelectableButton.js","sourceRoot":"/","sources":["SelectableButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAAmG;AAYnG,kBAAe,IAAA,kBAAU,EAA2C,UAAC,EASpE,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,cAR2D,6FASpE,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;YACd,IAAI,CAAC,cAAc;gBAAE,OAAM;YAC3B,aAAa,CAAC,KAAK,CAAC,CAAA;YACpB,UAAU,aAAV,UAAU,uBAAV,UAAU,EAAI,CAAA;SACf;aACI;YACH,aAAa,CAAC,IAAI,CAAC,CAAA;YACnB,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,EAAI,CAAA;SACb;IACH,CAAC,CAAA;IAED,IAAA,iBAAS,EAAC;QACR,aAAa,CAAC,kBAAkB,CAAC,CAAA;IACnC,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAA;IAExB,OAAO,CACL,qDACM,KAAK,IACT,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,cAAM,OAAA,eAAe,EAAE,EAAjB,CAAiB,EAAE,QAAQ,EAAE,UAAU,IAAI,UAAU,IAAI,CAAC,cAAc,KAEtF,MAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,EAAE,cAAc,gBAAA,EAAE,UAAU,YAAA,EAAE,UAAU,YAAA,EAAE,KAAK,OAAA,EAAE,CAAC,mCAAI,KAAK,CAChE,CACV,CAAA;AACH,CAAC,CAAC,CAAA","sourcesContent":["import React, { 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 default 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 onClick={() => toggleSelection()} disabled={isDisabled || isSelected && !isDeselectable}\n >\n {children?.({ isDeselectable, isDisabled, isSelected, label }) ?? label}\n </button>\n )\n})\n"]}
package/lib/Slider.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import React, { HTMLAttributes, PropsWithChildren } from 'react';
1
+ import React, { type HTMLAttributes, type PropsWithChildren } from 'react';
2
2
  type Orientation = 'horizontal' | 'vertical';
3
3
  export type SliderProps = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{
4
4
  /**
@@ -40,7 +40,7 @@ export type SliderProps = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{
40
40
  * A function that returns the label to be displayed at a given slider
41
41
  * position.
42
42
  *
43
- * @param position - The current slider position.
43
+ * @param position The current slider position.
44
44
  *
45
45
  * @returns The label.
46
46
  */
@@ -52,8 +52,8 @@ export type SliderProps = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{
52
52
  * `onlyDispatchesOnDragEnd` set to `true`, the `isDragging` parameter here is
53
53
  * still `true`.
54
54
  *
55
- * @param position - The current slider position.
56
- * @param isDragging - Specifies if the position change is due to dragging.
55
+ * @param position The current slider position.
56
+ * @param isDragging Specifies if the position change is due to dragging.
57
57
  */
58
58
  onPositionChange?: (position: number, isDragging: boolean) => void;
59
59
  /**
@@ -74,10 +74,10 @@ export type SliderProps = HTMLAttributes<HTMLDivElement> & PropsWithChildren<{
74
74
  * width and height of the knob are set via props (`knobWidth` and `knobHeight`,
75
75
  * respectively). The size of the knob does not impact the size of the slider.
76
76
  *
77
- * @exports SliderKnob - The component for the knob.
78
- * @exports SliderLabel - The component for the label on the knob.
79
- * @exports SliderTrack - The component for the slide track on either side of
80
- * the knob.
77
+ * @exports SliderKnob The component for the knob.
78
+ * @exports SliderLabel The component for the label on the knob.
79
+ * @exports SliderTrack The component for the slide track on either side of the
80
+ * knob.
81
81
  */
82
82
  declare const _default: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
83
83
  /**
@@ -119,7 +119,7 @@ declare const _default: React.ForwardRefExoticComponent<React.HTMLAttributes<HTM
119
119
  * A function that returns the label to be displayed at a given slider
120
120
  * position.
121
121
  *
122
- * @param position - The current slider position.
122
+ * @param position The current slider position.
123
123
  *
124
124
  * @returns The label.
125
125
  */
@@ -131,8 +131,8 @@ declare const _default: React.ForwardRefExoticComponent<React.HTMLAttributes<HTM
131
131
  * `onlyDispatchesOnDragEnd` set to `true`, the `isDragging` parameter here is
132
132
  * still `true`.
133
133
  *
134
- * @param position - The current slider position.
135
- * @param isDragging - Specifies if the position change is due to dragging.
134
+ * @param position The current slider position.
135
+ * @param isDragging Specifies if the position change is due to dragging.
136
136
  */
137
137
  onPositionChange?: ((position: number, isDragging: boolean) => void) | undefined;
138
138
  /**
package/lib/Slider.js CHANGED
@@ -83,10 +83,10 @@ var styles_1 = __importDefault(require("./utils/styles"));
83
83
  * width and height of the knob are set via props (`knobWidth` and `knobHeight`,
84
84
  * respectively). The size of the knob does not impact the size of the slider.
85
85
  *
86
- * @exports SliderKnob - The component for the knob.
87
- * @exports SliderLabel - The component for the label on the knob.
88
- * @exports SliderTrack - The component for the slide track on either side of
89
- * the knob.
86
+ * @exports SliderKnob The component for the knob.
87
+ * @exports SliderLabel The component for the label on the knob.
88
+ * @exports SliderTrack The component for the slide track on either side of the
89
+ * knob.
90
90
  */
91
91
  exports.default = (0, react_1.forwardRef)(function (_a, ref) {
92
92
  var _b, _c, _d, _e;