@shopgate/engage 7.30.3 → 7.31.0-alpha.1

package/components/RangeSlider/index.js

@@ -1,265 +1,266 @@
-import _createClass from "@babel/runtime/helpers/createClass";
-import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
-import React, { PureComponent } from 'react';
+import React, { useState, useEffect, useRef, useMemo, useCallback, useReducer, memo } from 'react';
 import PropTypes from 'prop-types';
-import cxs from 'classnames';
-import styles from "./style";
+import { makeStyles } from '@shopgate/engage/styles';
 import Handle from "./components/Handle";
 import { isTouchDevice } from "../../core";
 import { generateLinearEasingCallback, generateExponentialEasingCallback, getRangeStyle, getTouchPositionX, getAbsoluteValue, getRelativeValue } from "./helper";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const useStyles = makeStyles()({
+  outerRange: {
+    minHeight: 1,
+    position: 'relative'
+  },
+  range: {
+    left: 0,
+    right: 0,
+    position: 'absolute'
+  }
+});
+const useMouseEvents = !isTouchDevice();
 
 /**
  * The range slider component.
+ * @param {Object} props Props.
+ * @returns {JSX.Element}
  */
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-let RangeSlider = /*#__PURE__*/function (_PureComponent) {
-  /**
-   * Constructor
-   * @param {Object} props The component properties
-   */
-  function RangeSlider(props) {
-    var _this;
-    _this = _PureComponent.call(this, props) || this;
-    /**
-     * Processes touch start events on handles.
-     * @param {Object} event The touch event
-     * @param {number} index The index of the touched handle.
-     */
-    _this.handleTouchStart = (event, index) => {
-      _this.addEventListeners();
-      _this.draggedHandle = index;
-
-      // Calculate the relative offset to the handles center
-      const handleDOMElement = event.target;
-      // Get the handles bounding rectangle ...
-      const handleRect = handleDOMElement.getBoundingClientRect();
-      // ... and calculate its absolute center.
-      const handleCenterX = handleRect.left + handleDOMElement.offsetWidth / 2;
-      // Store the signed distanced between the current touch offset and the handle center.
-      _this.touchOffset = getTouchPositionX(event) - handleCenterX;
-    };
-    /**
-     * Processes move events on handles.
-     * @param {Object} event The touch event
-     */
-    _this.handleTouchMove = event => {
-      if (_this.props.min === _this.props.max) {
-        return;
-      }
-      if (_this.draggedHandle === null) {
-        return;
-      }
-      const {
-        width: offsetWidth,
-        left: offsetLeft
-      } = _this.domElement.current.getBoundingClientRect();
-
-      // Calculate the absolute offset where the element was touched...
-      let deltaX = getTouchPositionX(event) - offsetLeft - _this.touchOffset;
-
-      // ...and convert it into a relative value between [0...1].
-      deltaX = Math.max(0, Math.min(1, deltaX / offsetWidth));
-      const stateUpdate = {};
-      if (_this.draggedHandle === 1) {
-        // Right handle dragged
-        if (_this.state.rangeMin < deltaX) {
-          stateUpdate.rangeMax = Math.min(1, deltaX);
-          _this.draggedHandlePixelOffset = Math.abs(stateUpdate.rangeMax - _this.state.rangeMax);
-        } else {
-          // Not in valid range, swap handles
-          _this.draggedHandle = 0;
-          stateUpdate.rangeMax = _this.state.rangeMin;
-          stateUpdate.rangeMin = deltaX;
-          _this.draggedHandlePixelOffset = Math.abs(stateUpdate.rangeMin - _this.state.rangeMin);
-        }
-      } else if (_this.draggedHandle === 0) {
-        // Left handle dragged
-        if (_this.state.rangeMax > deltaX) {
-          stateUpdate.rangeMin = Math.max(0, deltaX);
-          _this.draggedHandlePixelOffset = Math.abs(stateUpdate.rangeMin - _this.state.rangeMin);
-        } else {
-          // Not in valid range, swap handles
-          _this.draggedHandle = 1;
-          stateUpdate.rangeMin = _this.state.rangeMax;
-          stateUpdate.rangeMax = deltaX;
-          _this.draggedHandlePixelOffset = Math.abs(stateUpdate.rangeMax - _this.state.rangeMax);
-        }
-      }
-      _this.draggedHandlePixelOffset *= offsetWidth;
-      _this.setState(stateUpdate, _this.triggerChangeCallback);
-    };
-    /**
-     * Processes global touch end events for handles.
-     * @param {Object} e The touch event
-     */
-    _this.handleTouchEnd = () => {
-      _this.removeEventListeners();
-      _this.touchOffset = 0;
-      _this.draggedHandle = null;
-    };
-    /**
-     * Processes outer range touch end events.
-     * @param {Object} event The touch event
-     */
-    _this.handleRangeTouch = event => {
-      const {
-        width: offsetWidth,
-        left: offsetLeft
-      } = _this.domElement.current.getBoundingClientRect();
-      const dx = (getTouchPositionX(event) - offsetLeft) / offsetWidth;
-      const d0 = Math.abs(_this.state.rangeMin - dx);
-      const d1 = Math.abs(_this.state.rangeMax - dx);
-      if (d0 < d1) {
-        _this.draggedHandle = 0;
-      } else {
-        _this.draggedHandle = 1;
-      }
-      _this.handleTouchMove(event);
-    };
-    _this.draggedHandle = null; // 0 for left handle, 1 for right handle or null
-    _this.domElement = /*#__PURE__*/React.createRef();
-    _this.touchOffset = 0;
-    _this.draggedHandlePixelOffset = 0; // The absolute pixel delta of the last handle move event.
-
-    _this.state = _this.getRange(props);
-    _this.useMouseEvents = !isTouchDevice();
-    return _this;
-  }
-
-  /**
-   * Updates the component properties.
-   * @param {Object} newProps The new component properties.
-   */
-  _inheritsLoose(RangeSlider, _PureComponent);
-  var _proto = RangeSlider.prototype;
-  _proto.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(newProps) {
-    this.setState(this.getRange(newProps));
-  }
-
-  /**
-   * Get the easing function.
-   */;
-  /**
-   * Adds event listeners
-   */
-  _proto.addEventListeners = function addEventListeners() {
-    if (this.useMouseEvents) {
-      document.addEventListener('mouseup', this.handleTouchEnd);
-      document.addEventListener('mousemove', this.handleTouchMove);
-    } else {
-      document.addEventListener('touchend', this.handleTouchEnd);
-      document.addEventListener('touchmove', this.handleTouchMove);
-    }
-  }
-
-  /**
-   * Removes event listeners
-   */;
-  _proto.removeEventListeners = function removeEventListeners() {
-    if (this.useMouseEvents) {
-      document.removeEventListener('mouseup', this.handleTouchEnd);
-      document.removeEventListener('mousemove', this.handleTouchMove);
-    } else {
-      document.removeEventListener('touchend', this.handleTouchEnd);
-      document.removeEventListener('touchmove', this.handleTouchMove);
-    }
-  }
-
-  /**
-   * Get range min and max from props.
-   * @param {Object} props The component props.
-   * @returns {Object} The new state
-   */;
-  _proto.getRange = function getRange(props) {
-    const {
+const RangeSlider = ({
+  animationSpeed,
+  classNames,
+  easing,
+  factor,
+  max,
+  min,
+  onChange,
+  resolution,
+  value
+}) => {
+  const {
+    classes,
+    cx
+  } = useStyles();
+  const domElement = useRef(null);
+  const draggedHandle = useRef(null);
+  const touchOffset = useRef(0);
+  const draggedHandlePixelOffset = useRef(0);
+  const stateRef = useRef({
+    rangeMin: 0,
+    rangeMax: 1
+  });
+  const moveRef = useRef(() => {});
+  const endRef = useRef(() => {});
+  const docListenersRef = useRef({
+    onMove: null,
+    onEnd: null
+  });
+  const [, forceActiveRender] = useReducer(x => x + 1, 0);
+  const ease = useMemo(() => ({
+    linear: generateLinearEasingCallback(resolution),
+    exponential: generateExponentialEasingCallback(factor)
+  })[easing], [easing, resolution, factor]);
+  const invertedEase = useMemo(() => ({
+    linear: generateLinearEasingCallback(resolution),
+    exponential: generateExponentialEasingCallback(1 / factor)
+  })[easing], [easing, resolution, factor]);
+  const getRange = useCallback(p => ({
+    rangeMin: invertedEase(getRelativeValue(p.value[0], p.min, p.max)),
+    rangeMax: invertedEase(getRelativeValue(p.value[1], p.min, p.max))
+  }), [invertedEase]);
+  const [state, setState] = useState(() => {
+    const initial = getRange({
       value,
       min,
       max
-    } = props;
-    return {
-      rangeMin: this.invertedEase(getRelativeValue(value[0], min, max)),
-      rangeMax: this.invertedEase(getRelativeValue(value[1], min, max))
-    };
-  };
-  /**
-   * Calls the change callback in case of a state update.
-   */
-  _proto.triggerChangeCallback = function triggerChangeCallback() {
-    const {
+    });
+    stateRef.current = initial;
+    return initial;
+  });
+  useEffect(() => {
+    const next = getRange({
       value,
-      onChange,
       min,
       max
-    } = this.props;
-    if (!onChange) {
+    });
+    stateRef.current = next;
+    setState(next);
+  }, [value, min, max, getRange]);
+  const propsRef = useRef({
+    value,
+    onChange,
+    min,
+    max,
+    ease
+  });
+  propsRef.current = {
+    value,
+    onChange,
+    min,
+    max,
+    ease
+  };
+  const removeEventListeners = useCallback(() => {
+    const {
+      onMove,
+      onEnd
+    } = docListenersRef.current;
+    if (!onMove || !onEnd) {
       return;
     }
-    const newRange = [getAbsoluteValue(this.ease(this.state.rangeMin), min, max, true), getAbsoluteValue(this.ease(this.state.rangeMax), min, max, true)];
-    if (newRange !== value) {
-      onChange(newRange);
+    if (useMouseEvents) {
+      document.removeEventListener('mouseup', onEnd);
+      document.removeEventListener('mousemove', onMove);
+    } else {
+      document.removeEventListener('touchend', onEnd);
+      document.removeEventListener('touchmove', onMove);
     }
-  }
-
-  /**
-   * Renders the component.
-   * @returns {JSX}
-   */;
-  _proto.render = function render() {
+  }, []);
+  const triggerChangeCallback = useCallback(mergedState => {
     const {
-      classNames,
-      animationSpeed
-    } = this.props;
-    const speed = Math.round(1000 / animationSpeed * this.draggedHandlePixelOffset);
-    const rangeStyle = getRangeStyle(this.state.rangeMin, this.state.rangeMax, speed > 10 ? speed : 0);
-    return /*#__PURE__*/_jsx("div", {
-      className: cxs(classNames.container, 'engage__range-slider'),
-      onMouseDown: this.handleRangeTouch,
-      "aria-hidden": true,
-      children: /*#__PURE__*/_jsx("div", {
-        className: cxs(classNames.outerRange, styles.outerRange),
-        ref: this.domElement,
-        children: /*#__PURE__*/_jsxs("div", {
-          className: cxs(classNames.range, styles.range),
-          style: rangeStyle,
-          children: [/*#__PURE__*/_jsx(Handle, {
-            index: 0,
-            onTouchStart: this.handleTouchStart,
-            active: this.draggedHandle === 0,
-            classNames: classNames,
-            useMouseEvents: this.useMouseEvents
-          }), /*#__PURE__*/_jsx(Handle, {
-            index: 1,
-            onTouchStart: this.handleTouchStart,
-            active: this.draggedHandle === 1,
-            classNames: classNames,
-            useMouseEvents: this.useMouseEvents
-          })]
-        })
-      })
+      onChange: oc,
+      value: v,
+      min: mn,
+      max: mx,
+      ease: ez
+    } = propsRef.current;
+    if (!oc) {
+      return;
+    }
+    const newRange = [getAbsoluteValue(ez(mergedState.rangeMin), mn, mx, true), getAbsoluteValue(ez(mergedState.rangeMax), mn, mx, true)];
+    if (newRange !== v) {
+      oc(newRange);
+    }
+  }, []);
+  const handleTouchMove = useCallback(event => {
+    if (min === max) {
+      return;
+    }
+    if (draggedHandle.current === null) {
+      return;
+    }
+    const {
+      width: offsetWidth,
+      left: offsetLeft
+    } = domElement.current.getBoundingClientRect();
+    let deltaX = getTouchPositionX(event) - offsetLeft - touchOffset.current;
+    deltaX = Math.max(0, Math.min(1, deltaX / offsetWidth));
+    const stateUpdate = {};
+    const {
+      rangeMin,
+      rangeMax
+    } = stateRef.current;
+    if (draggedHandle.current === 1) {
+      if (rangeMin < deltaX) {
+        stateUpdate.rangeMax = Math.min(1, deltaX);
+        draggedHandlePixelOffset.current = Math.abs(stateUpdate.rangeMax - rangeMax);
+      } else {
+        draggedHandle.current = 0;
+        stateUpdate.rangeMax = rangeMin;
+        stateUpdate.rangeMin = deltaX;
+        draggedHandlePixelOffset.current = Math.abs(stateUpdate.rangeMin - rangeMin);
+      }
+    } else if (draggedHandle.current === 0) {
+      if (rangeMax > deltaX) {
+        stateUpdate.rangeMin = Math.max(0, deltaX);
+        draggedHandlePixelOffset.current = Math.abs(stateUpdate.rangeMin - rangeMin);
+      } else {
+        draggedHandle.current = 1;
+        stateUpdate.rangeMin = rangeMax;
+        stateUpdate.rangeMax = deltaX;
+        draggedHandlePixelOffset.current = Math.abs(stateUpdate.rangeMax - rangeMax);
+      }
+    }
+    draggedHandlePixelOffset.current *= offsetWidth;
+    setState(prev => {
+      const next = {
+        ...prev,
+        ...stateUpdate
+      };
+      stateRef.current = next;
+      queueMicrotask(() => triggerChangeCallback(next));
+      return next;
     });
-  };
-  return _createClass(RangeSlider, [{
-    key: "ease",
-    get: function () {
-      return {
-        linear: generateLinearEasingCallback(this.props.resolution),
-        exponential: generateExponentialEasingCallback(this.props.factor)
-      }[this.props.easing];
+  }, [triggerChangeCallback, min, max]);
+  const handleTouchEnd = useCallback(() => {
+    removeEventListeners();
+    touchOffset.current = 0;
+    draggedHandle.current = null;
+    forceActiveRender();
+  }, [removeEventListeners]);
+  moveRef.current = handleTouchMove;
+  endRef.current = handleTouchEnd;
+  const addEventListeners = useCallback(() => {
+    if (!docListenersRef.current.onMove) {
+      docListenersRef.current.onMove = e => moveRef.current(e);
+      docListenersRef.current.onEnd = () => endRef.current();
     }
-
-    /**
-     * Get the function to invert an eased value to it's original value.
-     */
-  }, {
-    key: "invertedEase",
-    get: function () {
-      return {
-        linear: generateLinearEasingCallback(this.props.resolution),
-        exponential: generateExponentialEasingCallback(1 / this.props.factor)
-      }[this.props.easing];
+    const {
+      onMove,
+      onEnd
+    } = docListenersRef.current;
+    if (useMouseEvents) {
+      document.addEventListener('mouseup', onEnd);
+      document.addEventListener('mousemove', onMove);
+    } else {
+      document.addEventListener('touchend', onEnd);
+      document.addEventListener('touchmove', onMove);
     }
-  }]);
-}(PureComponent);
+  }, []);
+  const handleTouchStart = useCallback((event, index) => {
+    addEventListeners();
+    draggedHandle.current = index;
+    const handleDOMElement = event.target;
+    const handleRect = handleDOMElement.getBoundingClientRect();
+    const handleCenterX = handleRect.left + handleDOMElement.offsetWidth / 2;
+    touchOffset.current = getTouchPositionX(event) - handleCenterX;
+    forceActiveRender();
+  }, [addEventListeners]);
+  const handleRangeTouch = useCallback(event => {
+    const {
+      width: offsetWidth,
+      left: offsetLeft
+    } = domElement.current.getBoundingClientRect();
+    const dx = (getTouchPositionX(event) - offsetLeft) / offsetWidth;
+    const {
+      rangeMin,
+      rangeMax
+    } = stateRef.current;
+    const d0 = Math.abs(rangeMin - dx);
+    const d1 = Math.abs(rangeMax - dx);
+    if (d0 < d1) {
+      draggedHandle.current = 0;
+    } else {
+      draggedHandle.current = 1;
+    }
+    handleTouchMove(event);
+  }, [handleTouchMove]);
+  const speed = Math.round(1000 / animationSpeed * draggedHandlePixelOffset.current);
+  const rangeStyle = getRangeStyle(state.rangeMin, state.rangeMax, speed > 10 ? speed : 0);
+  return /*#__PURE__*/_jsx("div", {
+    className: cx(classNames.container, 'engage__range-slider', 'common__range-slider'),
+    onMouseDown: handleRangeTouch,
+    "aria-hidden": true,
+    children: /*#__PURE__*/_jsx("div", {
+      className: cx(classes.outerRange, classNames.outerRange),
+      ref: domElement,
+      children: /*#__PURE__*/_jsxs("div", {
+        className: cx(classes.range, classNames.range),
+        style: rangeStyle,
+        children: [/*#__PURE__*/_jsx(Handle, {
+          index: 0,
+          onTouchStart: handleTouchStart,
+          active: draggedHandle.current === 0,
+          classNames: classNames,
+          useMouseEvents: useMouseEvents
+        }), /*#__PURE__*/_jsx(Handle, {
+          index: 1,
+          onTouchStart: handleTouchStart,
+          active: draggedHandle.current === 1,
+          classNames: classNames,
+          useMouseEvents: useMouseEvents
+        })]
+      })
+    })
+  });
+};
 RangeSlider.defaultProps = {
   animationSpeed: 500,
   classNames: {},
@@ -271,4 +272,4 @@ RangeSlider.defaultProps = {
   value: [0, 100],
   onChange: null
 };
-export default RangeSlider;
+export default /*#__PURE__*/memo(RangeSlider);

package/components/RangeSlider/spec.js

@@ -63,8 +63,6 @@ const simulateInputTest = (pxWidth, pxOffset, min, max, value, easing, resolutio
     linear: generateLinearEasingCallback(config.resolution),
     exponential: generateExponentialEasingCallback(config.factor)
   }[config.easing];
-
-  // eslint-disable-next-line require-jsdoc
   const callback = ([from, to]) => {
     const {
       currentTouchDeltaX,
@@ -145,7 +143,7 @@ describe.skip('<RangeSlider />', () => {
     [50, 75],
     // Initial value.
     'linear',
-    // Which wasing should be used.
+    // Which easing should be used.
     0.01,
     // Resolution.
     [
@@ -160,7 +158,7 @@ describe.skip('<RangeSlider />', () => {
     [10, 450],
     // Initial value.
     'exponential',
-    // Which wasing should be used.
+    // Which easing should be used.
     0.01,
     // Resolution.
     [
@@ -168,7 +166,6 @@ describe.skip('<RangeSlider />', () => {
     +10, +10, +10, +10, +10, +10, +10, +10, -10, -10, -10, -10, -10, -10, -10, -10, +3, -15, +17, -80, +104, -23, -12, +67]);
   });
   it('emits onChange if the outer range was touched', () => {
-    // eslint-disable-next-line require-jsdoc
     const callback = value => expect(value).toEqual([-80, 0]);
     const wrapper = mount(/*#__PURE__*/_jsx(RangeSlider, {
       min: -100,

package/components/ResponsiveContainer/ResponsiveContainer.d.ts

@@ -0,0 +1,33 @@
+export default ResponsiveContainer;
+/**
+ * Renders a responsive container that allows to render based on width.
+ * @param {Object} props Component props.
+ * @returns {React.Node}
+ */
+declare function ResponsiveContainer({ breakpoint, webOnly, webAlways, appOnly, appAlways, children, }: Object): React.Node;
+declare namespace ResponsiveContainer {
+    namespace propTypes {
+        let appAlways: PropTypes.Requireable<boolean>;
+        let appOnly: PropTypes.Requireable<boolean>;
+        let breakpoint: PropTypes.Requireable<string>;
+        let children: PropTypes.Requireable<any>;
+        let webAlways: PropTypes.Requireable<boolean>;
+        let webOnly: PropTypes.Requireable<boolean>;
+    }
+    namespace defaultProps {
+        let children_1: null;
+        export { children_1 as children };
+        let breakpoint_1: string;
+        export { breakpoint_1 as breakpoint };
+        let appAlways_1: boolean;
+        export { appAlways_1 as appAlways };
+        let webAlways_1: boolean;
+        export { webAlways_1 as webAlways };
+        let webOnly_1: boolean;
+        export { webOnly_1 as webOnly };
+        let appOnly_1: boolean;
+        export { appOnly_1 as appOnly };
+    }
+}
+import PropTypes from 'prop-types';
+//# sourceMappingURL=ResponsiveContainer.d.ts.map

package/components/ResponsiveContainer/ResponsiveContainer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResponsiveContainer.d.ts","sourceRoot":"","sources":["../../../components/ResponsiveContainer/ResponsiveContainer.jsx"],"names":[],"mappings":";AAGA;;;;GAIG;AACH,wGAHW,MAAM,GACJ,KAAK,CAAC,IAAI,CAiBtB;;;;;;;;;;;;;;;;;;;;;;;;;sBAvBqB,YAAY"}

package/components/ResponsiveContainer/breakpoints.d.ts

@@ -0,0 +1,8 @@
+export function parser(comparators: Object, breakpoint: string, { appAlways, appOnly, webOnly, webAlways, }?: Object): string;
+export default breakpoints;
+declare const breakpoints: {
+    name: string;
+    from: number;
+    to: number;
+}[];
+//# sourceMappingURL=breakpoints.d.ts.map

package/components/ResponsiveContainer/breakpoints.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakpoints.d.ts","sourceRoot":"","sources":["../../../components/ResponsiveContainer/breakpoints.js"],"names":[],"mappings":"AAwBO,oCALI,MAAM,cACN,MAAM,gDACN,MAAM,GACJ,MAAM,CAgClB;;AA9CD;;;;IAME"}

package/components/ResponsiveContainer/condition.d.ts

@@ -0,0 +1,2 @@
+export function responsiveCondition(breakpoint: string, params?: Object): string;
+//# sourceMappingURL=condition.d.ts.map

package/components/ResponsiveContainer/condition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"condition.d.ts","sourceRoot":"","sources":["../../../components/ResponsiveContainer/condition.js"],"names":[],"mappings":"AAgBO,gDAJI,MAAM,WACN,MAAM,GACJ,MAAM,CAKlB"}

package/components/ResponsiveContainer/hooks.d.ts

@@ -0,0 +1,9 @@
+export function useResponsiveValue(breakpoint?: string, options?: {
+    valueMatch?: any;
+    valueMiss?: any;
+    webOnly?: boolean | undefined;
+    webAlways?: boolean | undefined;
+    appOnly?: boolean | undefined;
+    appAlways?: boolean | undefined;
+}): boolean;
+//# sourceMappingURL=hooks.d.ts.map

package/components/ResponsiveContainer/hooks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../../components/ResponsiveContainer/hooks.js"],"names":[],"mappings":"AA6BO,gDAZI,MAAM,YAEd;IAAoB,UAAU,GAAtB,GAAC;IACW,SAAS,GAArB,GAAC;IACiB,OAAO;IACP,SAAS;IAET,OAAO;IACP,SAAS;CAEnC,GAAU,OAAO,CA4CnB"}

package/components/ResponsiveContainer/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./ResponsiveContainer";
+//# sourceMappingURL=index.d.ts.map

package/components/ResponsiveContainer/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/ResponsiveContainer/index.js"],"names":[],"mappings":""}

package/components/ResponsiveContainer/listener.d.ts

@@ -0,0 +1,2 @@
+export function addListener(cb: Function): Function;
+//# sourceMappingURL=listener.d.ts.map

package/components/ResponsiveContainer/listener.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"listener.d.ts","sourceRoot":"","sources":["../../../components/ResponsiveContainer/listener.js"],"names":[],"mappings":"AAUO,oDAKN"}

package/components/ResponsiveContainer/mediaQuery.d.ts

@@ -0,0 +1,2 @@
+export function responsiveMediaQuery(breakpoint: string, params?: Object): string;
+//# sourceMappingURL=mediaQuery.d.ts.map

package/components/ResponsiveContainer/mediaQuery.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mediaQuery.d.ts","sourceRoot":"","sources":["../../../components/ResponsiveContainer/mediaQuery.js"],"names":[],"mappings":"AAgBO,iDAJI,MAAM,WACN,MAAM,GACJ,MAAM,CAelB"}

package/components/ScrollHeader/index.d.ts

@@ -0,0 +1,16 @@
+export default ScrollHeader;
+declare const ScrollHeader: React.ForwardRefExoticComponent<{
+    hideOnScroll?: boolean | undefined;
+    scrollOffset?: number | undefined;
+    onlyShowAtTop?: boolean | undefined;
+    onlyShowAtTopOffset?: number | undefined;
+    onChange?: Function | undefined;
+    className?: string | undefined;
+    classes?: {
+        scrolledIn?: string | undefined;
+        scrolledOut?: string | undefined;
+    } | undefined;
+    children: React.ReactNode;
+} & React.RefAttributes<HTMLDivElement>>;
+import React from 'react';
+//# sourceMappingURL=index.d.ts.map

package/components/ScrollHeader/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../components/ScrollHeader/index.jsx"],"names":[],"mappings":";AAsGA;;;;;;;;;;;cArDW,KAAK,CAAC,SAAS;yCAqDwB;kBAtGK,OAAO"}