@ebscn/ui 0.0.11 → 1.0.0

package/cjs/utils/undefined-fallback.d.ts

@@ -0,0 +1,3 @@
+export declare function undefinedFallback<T>(a: T | undefined, b: T): T;
+export declare function undefinedFallback<T>(a: T | undefined, b: T | undefined, c: T): T;
+export declare function undefinedFallback<T>(a: T | undefined, b: T | undefined, c: T | undefined, d: T): T;

package/cjs/utils/undefined-fallback.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.undefinedFallback = undefinedFallback;
+function undefinedFallback() {
+  var items = [];
+  for (var _i = 0; _i < arguments.length; _i++) {
+    items[_i] = arguments[_i];
+  }
+  var i;
+  for (i = 0; i < items.length; i++) {
+    if (items[i] !== undefined) break;
+  }
+  return items[i];
+}

package/cjs/utils/use-drag-and-pinch.d.ts

@@ -0,0 +1 @@
+export declare const useDragAndPinch: <Config extends import("@use-gesture/react").UserGestureConfig = import("@use-gesture/react").UserGestureConfig>(_handlers: Partial<import("@use-gesture/react").NativeHandlers<import("@use-gesture/react").EventTypes> & import("@use-gesture/react").UserHandlers<import("@use-gesture/react").EventTypes>>, _config?: Config | undefined) => Config["target"] extends object ? void : (...args: any[]) => import("@use-gesture/react/dist/declarations/src/types").ReactDOMAttributes;

package/cjs/utils/use-drag-and-pinch.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useDragAndPinch = void 0;
+var _react = require("@use-gesture/react");
+var useDragAndPinch = exports.useDragAndPinch = (0, _react.createUseGesture)([_react.dragAction, _react.pinchAction]);

package/cjs/utils/use-initialized.d.ts

@@ -0,0 +1 @@
+export declare function useInitialized(check?: boolean): boolean;

package/cjs/utils/use-initialized.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useInitialized = useInitialized;
+var _react = require("react");
+function useInitialized(check) {
+  var initializedRef = (0, _react.useRef)(check);
+  if (check) {
+    initializedRef.current = true;
+  }
+  return !!initializedRef.current;
+}

package/cjs/utils/use-inner-visible.d.ts

@@ -0,0 +1 @@
+export declare function useInnerVisible(outerVisible: boolean): boolean;

package/cjs/utils/use-inner-visible.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useInnerVisible = useInnerVisible;
+var _react = require("react");
+var _ahooks = require("ahooks");
+function useInnerVisible(outerVisible) {
+  var _a = (0, _react.useState)(outerVisible),
+    innerVisible = _a[0],
+    setInnerVisible = _a[1];
+  (0, _ahooks.useIsomorphicLayoutEffect)(function () {
+    setInnerVisible(outerVisible);
+  }, [outerVisible]);
+  return innerVisible;
+}

package/cjs/utils/use-isomorphic-update-layout-effect.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const useIsomorphicUpdateLayoutEffect: typeof import("react").useEffect | typeof import("react").useLayoutEffect;

package/cjs/utils/use-isomorphic-update-layout-effect.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useIsomorphicUpdateLayoutEffect = void 0;
+var _ahooks = require("ahooks");
+var useIsomorphicUpdateLayoutEffect = exports.useIsomorphicUpdateLayoutEffect = (0, _ahooks.createUpdateEffect)(_ahooks.useIsomorphicLayoutEffect);

package/cjs/utils/use-lock-scroll.d.ts

@@ -0,0 +1,2 @@
+import { RefObject } from 'react';
+export declare function useLockScroll(rootRef: RefObject<HTMLElement>, shouldLock: boolean | 'strict'): void;

package/cjs/utils/use-lock-scroll.js

@@ -0,0 +1,84 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useLockScroll = useLockScroll;
+var _useTouch = require("./use-touch");
+var _react = require("react");
+var _getScrollParent = require("./get-scroll-parent");
+var _supportsPassive = require("./supports-passive");
+var totalLockCount = 0;
+var BODY_LOCK_CLASS = 'adm-overflow-hidden';
+function getScrollableElement(el) {
+  var current = el === null || el === void 0 ? void 0 : el.parentElement;
+  while (current) {
+    if (current.clientHeight < current.scrollHeight) {
+      return current;
+    }
+    current = current.parentElement;
+  }
+  return null;
+}
+// 移植自vant：https://github.com/youzan/vant/blob/HEAD/src/composables/use-lock-scroll.ts
+function useLockScroll(rootRef, shouldLock) {
+  var touch = (0, _useTouch.useTouch)();
+  var onTouchMove = function (event) {
+    touch.move(event);
+    var direction = touch.deltaY.current > 0 ? '10' : '01';
+    var el = (0, _getScrollParent.getScrollParent)(event.target, rootRef.current);
+    if (!el) return;
+    // This has perf cost but we have to compatible with iOS 12
+    if (shouldLock === 'strict') {
+      var scrollableParent = getScrollableElement(event.target);
+      if (scrollableParent === document.body || scrollableParent === document.documentElement) {
+        event.preventDefault();
+        return;
+      }
+    }
+    var scrollHeight = el.scrollHeight,
+      offsetHeight = el.offsetHeight,
+      scrollTop = el.scrollTop;
+    var height = el.getBoundingClientRect().height;
+    var status = '11';
+    if (scrollTop === 0) {
+      status = offsetHeight >= scrollHeight ? '00' : '01';
+    } else if (scrollHeight <= Math.round(height + scrollTop)) {
+      status = '10';
+    }
+    if (status !== '11' && touch.isVertical() && !(parseInt(status, 2) & parseInt(direction, 2))) {
+      if (event.cancelable && _supportsPassive.supportsPassive) {
+        // https://github.com/ant-design/ant-design-mobile/issues/6282
+        event.preventDefault();
+      }
+    }
+  };
+  var lock = function () {
+    document.addEventListener('touchstart', touch.start);
+    document.addEventListener('touchmove', onTouchMove, _supportsPassive.supportsPassive ? {
+      passive: false
+    } : false);
+    if (!totalLockCount) {
+      document.body.classList.add(BODY_LOCK_CLASS);
+    }
+    totalLockCount++;
+  };
+  var unlock = function () {
+    if (totalLockCount) {
+      document.removeEventListener('touchstart', touch.start);
+      document.removeEventListener('touchmove', onTouchMove);
+      totalLockCount--;
+      if (!totalLockCount) {
+        document.body.classList.remove(BODY_LOCK_CLASS);
+      }
+    }
+  };
+  (0, _react.useEffect)(function () {
+    if (shouldLock) {
+      lock();
+      return function () {
+        unlock();
+      };
+    }
+  }, [shouldLock]);
+}

package/cjs/utils/use-mutation-effect.d.ts

@@ -0,0 +1,2 @@
+import { RefObject } from 'react';
+export declare function useMutationEffect(effect: () => void, targetRef: RefObject<HTMLElement>, options: MutationObserverInit): void;

package/cjs/utils/use-mutation-effect.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useMutationEffect = useMutationEffect;
+var _react = require("react");
+var _ahooks = require("ahooks");
+function useMutationEffect(effect, targetRef, options) {
+  var fn = (0, _ahooks.useMemoizedFn)(effect);
+  (0, _react.useEffect)(function () {
+    var observer = new MutationObserver(function () {
+      fn();
+    });
+    if (!targetRef.current) return;
+    observer.observe(targetRef.current, options);
+    return function () {
+      observer.disconnect();
+    };
+  }, [targetRef]);
+}

package/cjs/utils/use-props-value.d.ts

@@ -0,0 +1,8 @@
+import { SetStateAction } from 'react';
+type Options<T> = {
+    value?: T;
+    defaultValue: T;
+    onChange?: (v: T) => void;
+};
+export declare function usePropsValue<T>(options: Options<T>): readonly [T, (v: SetStateAction<T>, forceTrigger?: boolean) => void];
+export {};

package/cjs/utils/use-props-value.js

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.usePropsValue = usePropsValue;
+var _react = require("react");
+var _ahooks = require("ahooks");
+function usePropsValue(options) {
+  var value = options.value,
+    defaultValue = options.defaultValue,
+    onChange = options.onChange;
+  var update = (0, _ahooks.useUpdate)();
+  var stateRef = (0, _react.useRef)(value !== undefined ? value : defaultValue);
+  if (value !== undefined) {
+    stateRef.current = value;
+  }
+  var setState = (0, _ahooks.useMemoizedFn)(function (v, forceTrigger) {
+    if (forceTrigger === void 0) {
+      forceTrigger = false;
+    }
+    // `forceTrigger` means trigger `onChange` even if `v` is the same as `stateRef.current`
+    var nextValue = typeof v === 'function' ? v(stateRef.current) : v;
+    if (!forceTrigger && nextValue === stateRef.current) return;
+    stateRef.current = nextValue;
+    update();
+    return onChange === null || onChange === void 0 ? void 0 : onChange(nextValue);
+  });
+  return [stateRef.current, setState];
+}

package/cjs/utils/use-ref-state.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function useRefState<T>(initialState: T | (() => T)): readonly [T, import("react").Dispatch<import("react").SetStateAction<T>>, import("react").MutableRefObject<T>];

package/cjs/utils/use-ref-state.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useRefState = useRefState;
+var _react = require("react");
+function useRefState(initialState) {
+  var _a = (0, _react.useState)(initialState),
+    state = _a[0],
+    setState = _a[1];
+  var ref = (0, _react.useRef)(state);
+  (0, _react.useEffect)(function () {
+    ref.current = state;
+  }, [state]);
+  return [state, setState, ref];
+}

package/cjs/utils/use-resize-effect.d.ts

@@ -0,0 +1,2 @@
+import { RefObject } from 'react';
+export declare function useResizeEffect<T extends HTMLElement>(effect: (target: T) => void, targetRef: RefObject<T>): void;

package/cjs/utils/use-resize-effect.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useResizeEffect = useResizeEffect;
+var _ahooks = require("ahooks");
+function useResizeEffect(effect, targetRef) {
+  var fn = (0, _ahooks.useMemoizedFn)(effect);
+  (0, _ahooks.useIsomorphicLayoutEffect)(function () {
+    var target = targetRef.current;
+    if (!target) return;
+    if (window.ResizeObserver) {
+      var animationFrame_1;
+      var observer_1 = new ResizeObserver(function () {
+        animationFrame_1 = window.requestAnimationFrame(function () {
+          return fn(target);
+        });
+      });
+      observer_1.observe(target);
+      return function () {
+        window.cancelAnimationFrame(animationFrame_1);
+        observer_1.disconnect();
+      };
+    } else {
+      fn(target);
+    }
+  }, [targetRef]);
+}

package/cjs/utils/use-tab-list-scroll.d.ts

@@ -0,0 +1,5 @@
+import { RefObject } from 'react';
+export declare const useTabListScroll: (targetRef: RefObject<HTMLElement>, activeIndex: number | undefined) => {
+    scrollLeft: import("@react-spring/core").SpringValue<number>;
+    animate: (immediate?: boolean) => void;
+};

package/cjs/utils/use-tab-list-scroll.js

@@ -0,0 +1,67 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useTabListScroll = void 0;
+var _web = require("@react-spring/web");
+var _useMutationEffect = require("./use-mutation-effect");
+var _bound = require("./bound");
+var _ahooks = require("ahooks");
+var _useIsomorphicUpdateLayoutEffect = require("./use-isomorphic-update-layout-effect");
+var useTabListScroll = function (targetRef, activeIndex) {
+  var _a = (0, _web.useSpring)(function () {
+      return {
+        scrollLeft: 0,
+        config: {
+          tension: 300,
+          clamp: true
+        }
+      };
+    }),
+    scrollLeft = _a[0].scrollLeft,
+    api = _a[1];
+  function animate(immediate) {
+    if (immediate === void 0) {
+      immediate = false;
+    }
+    var container = targetRef.current;
+    if (!container) return;
+    if (activeIndex === undefined) return;
+    var activeTabWrapper = container.children.item(activeIndex);
+    var activeTab = activeTabWrapper.children.item(0);
+    var activeTabLeft = activeTab.offsetLeft;
+    var activeTabWidth = activeTab.offsetWidth;
+    var containerWidth = container.offsetWidth;
+    var containerScrollWidth = container.scrollWidth;
+    var containerScrollLeft = container.scrollLeft;
+    var maxScrollDistance = containerScrollWidth - containerWidth;
+    if (maxScrollDistance <= 0) return;
+    var nextScrollLeft = (0, _bound.bound)(activeTabLeft - (containerWidth - activeTabWidth) / 2, 0, containerScrollWidth - containerWidth);
+    api.start({
+      scrollLeft: nextScrollLeft,
+      from: {
+        scrollLeft: containerScrollLeft
+      },
+      immediate: immediate && !scrollLeft.isAnimating
+    });
+  }
+  (0, _ahooks.useIsomorphicLayoutEffect)(function () {
+    animate(true);
+  }, []);
+  (0, _useIsomorphicUpdateLayoutEffect.useIsomorphicUpdateLayoutEffect)(function () {
+    animate();
+  }, [activeIndex]);
+  (0, _useMutationEffect.useMutationEffect)(function () {
+    animate(true);
+  }, targetRef, {
+    subtree: true,
+    childList: true,
+    characterData: true
+  });
+  return {
+    scrollLeft: scrollLeft,
+    animate: animate
+  };
+};
+exports.useTabListScroll = useTabListScroll;

package/cjs/utils/use-touch.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+type Direction = '' | 'vertical' | 'horizontal';
+export declare function useTouch(): {
+    move: EventListener;
+    start: EventListener;
+    reset: () => void;
+    startX: import("react").MutableRefObject<number>;
+    startY: import("react").MutableRefObject<number>;
+    deltaX: import("react").MutableRefObject<number>;
+    deltaY: import("react").MutableRefObject<number>;
+    offsetX: import("react").MutableRefObject<number>;
+    offsetY: import("react").MutableRefObject<number>;
+    direction: import("react").MutableRefObject<Direction>;
+    isVertical: () => boolean;
+    isHorizontal: () => boolean;
+};
+export {};

package/cjs/utils/use-touch.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useTouch = useTouch;
+var _react = require("react");
+var MIN_DISTANCE = 10;
+function getDirection(x, y) {
+  if (x > y && x > MIN_DISTANCE) {
+    return 'horizontal';
+  }
+  if (y > x && y > MIN_DISTANCE) {
+    return 'vertical';
+  }
+  return '';
+}
+function useTouch() {
+  var startX = (0, _react.useRef)(0);
+  var startY = (0, _react.useRef)(0);
+  var deltaX = (0, _react.useRef)(0);
+  var deltaY = (0, _react.useRef)(0);
+  var offsetX = (0, _react.useRef)(0);
+  var offsetY = (0, _react.useRef)(0);
+  var direction = (0, _react.useRef)('');
+  var isVertical = function () {
+    return direction.current === 'vertical';
+  };
+  var isHorizontal = function () {
+    return direction.current === 'horizontal';
+  };
+  var reset = function () {
+    deltaX.current = 0;
+    deltaY.current = 0;
+    offsetX.current = 0;
+    offsetY.current = 0;
+    direction.current = '';
+  };
+  var start = function (event) {
+    reset();
+    startX.current = event.touches[0].clientX;
+    startY.current = event.touches[0].clientY;
+  };
+  var move = function (event) {
+    var touch = event.touches[0];
+    // Fix: Safari back will set clientX to negative number
+    deltaX.current = touch.clientX < 0 ? 0 : touch.clientX - startX.current;
+    deltaY.current = touch.clientY - startY.current;
+    offsetX.current = Math.abs(deltaX.current);
+    offsetY.current = Math.abs(deltaY.current);
+    if (!direction.current) {
+      direction.current = getDirection(offsetX.current, offsetY.current);
+    }
+  };
+  return {
+    move: move,
+    start: start,
+    reset: reset,
+    startX: startX,
+    startY: startY,
+    deltaX: deltaX,
+    deltaY: deltaY,
+    offsetX: offsetX,
+    offsetY: offsetY,
+    direction: direction,
+    isVertical: isVertical,
+    isHorizontal: isHorizontal
+  };
+}

package/cjs/utils/validate.d.ts

@@ -0,0 +1,8 @@
+export declare function isDef<T>(val: T): val is NonNullable<T>;
+export declare function isObject(val: unknown): val is Record<any, any>;
+export declare function isPromise(obj: unknown): obj is Promise<unknown>;
+export declare function isDate(val: unknown): val is Date;
+export declare function isMobile(value: string): boolean;
+export declare function isNumeric(val: string | number): val is string;
+export declare function isAndroid(): boolean;
+export declare function isIOS(): boolean;

package/cjs/utils/validate.js

@@ -0,0 +1,39 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isAndroid = isAndroid;
+exports.isDate = isDate;
+exports.isDef = isDef;
+exports.isIOS = isIOS;
+exports.isMobile = isMobile;
+exports.isNumeric = isNumeric;
+exports.isObject = isObject;
+exports.isPromise = isPromise;
+var _canUseDom = require("./can-use-dom");
+function isDef(val) {
+  return val !== undefined && val !== null;
+}
+function isObject(val) {
+  return val !== null && typeof val === 'object';
+}
+function isPromise(obj) {
+  return !!obj && typeof obj === 'object' && typeof obj.then === 'function';
+}
+function isDate(val) {
+  return Object.prototype.toString.call(val) === '[object Date]' && !Number.isNaN(val.getTime());
+}
+function isMobile(value) {
+  value = value.replace(/[^-|\d]/g, '');
+  return /^((\+86)|(86))?(1)\d{10}$/.test(value) || /^0[0-9-]{10,13}$/.test(value);
+}
+function isNumeric(val) {
+  return typeof val === 'number' || /^\d+(\.\d+)?$/.test(val);
+}
+function isAndroid() {
+  return _canUseDom.canUseDom ? /android/.test(navigator.userAgent.toLowerCase()) : false;
+}
+function isIOS() {
+  return _canUseDom.canUseDom ? /ios|iphone|ipad|ipod/.test(navigator.userAgent.toLowerCase()) : false;
+}

package/cjs/utils/with-cache.d.ts

@@ -0,0 +1 @@
+export declare function withCache<T>(generate: () => T): () => T;

package/cjs/utils/with-cache.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.withCache = withCache;
+function withCache(generate) {
+  var cache = null;
+  return function () {
+    if (cache === null) {
+      cache = generate();
+    }
+    return cache;
+  };
+}

package/cjs/utils/with-default-props.d.ts

@@ -0,0 +1,2 @@
+export declare function mergeProps<A, B>(a: A, b: B): B & A;
+export declare function mergeProps<A, B, C>(a: A, b: B, c: C): C & B & A;

package/cjs/utils/with-default-props.js

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.mergeProps = mergeProps;
+var _assignWith = _interopRequireDefault(require("lodash/assignWith"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var __assign = void 0 && (void 0).__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+function mergeProps() {
+  var items = [];
+  for (var _i = 0; _i < arguments.length; _i++) {
+    items[_i] = arguments[_i];
+  }
+  function customizer(objValue, srcValue) {
+    return srcValue === undefined ? objValue : srcValue;
+  }
+  var ret = __assign({}, items[0]);
+  for (var i = 1; i < items.length; i++) {
+    ret = (0, _assignWith.default)(ret, items[i], customizer);
+  }
+  return ret;
+}

package/cjs/utils/with-func-props.d.ts

@@ -0,0 +1,5 @@
+type Merge<T, P> = {
+    [K in keyof T & keyof P]: P[K] | T[K];
+};
+export declare function mergeFuncProps<T extends Record<string, any>, P extends Record<string, any>>(p1: T, p2: P): Merge<T, P>;
+export {};

package/cjs/utils/with-func-props.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.mergeFuncProps = mergeFuncProps;
+var __spreadArray = void 0 && (void 0).__spreadArray || function (to, from, pack) {
+  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+    if (ar || !(i in from)) {
+      if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+      ar[i] = from[i];
+    }
+  }
+  return to.concat(ar || Array.prototype.slice.call(from));
+};
+function mergeFuncProps(p1, p2) {
+  var p1Keys = Object.keys(p1);
+  var p2Keys = Object.keys(p2);
+  var keys = new Set(__spreadArray(__spreadArray([], p1Keys, true), p2Keys, true));
+  var res = {};
+  keys.forEach(function (key) {
+    var p1Value = p1[key];
+    var p2Value = p2[key];
+    if (typeof p1Value === 'function' && typeof p2Value === 'function') {
+      res[key] = function () {
+        var args = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+          args[_i] = arguments[_i];
+        }
+        p1Value.apply(void 0, args);
+        p2Value.apply(void 0, args);
+      };
+    } else {
+      res[key] = p1Value || p2Value;
+    }
+  });
+  return res;
+}

package/cjs/utils/with-stop-propagation.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { ReactElement } from 'react';
+export type PropagationEvent = 'click';
+export declare function withStopPropagation(events: PropagationEvent[], element: ReactElement): React.ReactElement<any, string | React.JSXElementConstructor<any>>;

package/cjs/utils/with-stop-propagation.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.withStopPropagation = withStopPropagation;
+var _react = _interopRequireDefault(require("react"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var __assign = void 0 && (void 0).__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+var eventToPropRecord = {
+  'click': 'onClick'
+};
+function withStopPropagation(events, element) {
+  var props = __assign({}, element.props);
+  var _loop_1 = function (key) {
+    var prop = eventToPropRecord[key];
+    props[prop] = function (e) {
+      var _a, _b;
+      e.stopPropagation();
+      (_b = (_a = element.props)[prop]) === null || _b === void 0 ? void 0 : _b.call(_a, e);
+    };
+  };
+  for (var _i = 0, events_1 = events; _i < events_1.length; _i++) {
+    var key = events_1[_i];
+    _loop_1(key);
+  }
+  return _react.default.cloneElement(element, props);
+}