shopee-ui-react 0.0.1-security → 2.10.49

package/es/components/progress/Progress.js

@@ -0,0 +1,96 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+
+/* eslint-disable react-hooks/rules-of-hooks */
+import React, { useMemo } from 'react';
+import classNames from 'classnames';
+import Icon from '../icon';
+import ConfigProvider from '../config-provider';
+
+var Progress = function Progress(props) {
+  var customizePrefixCls = props.prefixCls,
+      showText = props.showText,
+      status = props.status,
+      size = props.size,
+      percentage = props.percentage,
+      color = props.color,
+      format = props.format,
+      children = props.children,
+      className = props.className;
+
+  if (percentage < 0 || percentage > 100) {
+    // eslint-disable-next-line no-console
+    console.error('Progres Component, percentage should no less than 0 or greater than 100 ');
+    return null;
+  }
+
+  var _React$useContext = React.useContext(ConfigProvider.ConfigContext),
+      getPrefixCls = _React$useContext.getPrefixCls;
+
+  var prefixCls = getPrefixCls('progress', customizePrefixCls);
+  var progressClassName = useMemo(function () {
+    return classNames(prefixCls, className, {
+      'text-hide': !showText
+    });
+  }, [prefixCls, showText, className]);
+  var barClassName = useMemo(function () {
+    var _classNames;
+
+    return classNames('bar__outer', (_classNames = {}, _defineProperty(_classNames, "is-".concat(status), status), _defineProperty(_classNames, 'is-small', size === 'small'), _classNames));
+  }, [status, size]);
+  var barStyle = useMemo(function () {
+    function getCurrentColor() {
+      if (typeof color === 'function') {
+        return color(percentage) || '';
+      }
+
+      if (typeof color === 'string') {
+        return color;
+      }
+
+      return '';
+    }
+
+    return {
+      width: "".concat(percentage, "%"),
+      backgroundColor: getCurrentColor()
+    };
+  }, [percentage, color]);
+  var content = useMemo(function () {
+    if (typeof format === 'function') {
+      return format(percentage) || '';
+    }
+
+    return "".concat(percentage, "%");
+  }, [format, percentage]);
+  return (
+    /*#__PURE__*/
+    // eslint-disable-next-line jsx-a11y/aria-role
+    React.createElement("div", {
+      className: progressClassName,
+      role: "progress"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "".concat(prefixCls, "-bar")
+    }, /*#__PURE__*/React.createElement("div", {
+      className: barClassName
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "bar__inner",
+      style: barStyle
+    }))), !!showText && /*#__PURE__*/React.createElement("div", {
+      className: "".concat(prefixCls, "-text")
+    }, typeof children === 'function' && children(percentage), status === 'fail' ? /*#__PURE__*/React.createElement(Icon, {
+      className: "icon icon__".concat(status),
+      type: "error-s"
+    }) : /*#__PURE__*/React.createElement("span", {
+      className: "desc"
+    }, content)))
+  );
+};
+
+Progress.defaultProps = {
+  size: 'normal',
+  percentage: 0,
+  status: 'normal',
+  showText: true,
+  color: ''
+};
+export default Progress;

package/es/components/progress/index.d.ts

@@ -0,0 +1,2 @@
+import Progress from './Progress';
+export default Progress;

package/es/components/progress/index.js

@@ -0,0 +1,2 @@
+import Progress from './Progress';
+export default Progress;

package/es/components/progress/types.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+export interface ProgressProps {
+    prefixCls?: string;
+    size: 'normal' | 'small';
+    percentage: number;
+    status: 'normal' | 'fail';
+    showText: boolean;
+    color: string | ((percentage: number) => string);
+    format: (percentage: number) => string;
+    children?: (percentage: number) => React.ReactNode;
+    className?: string;
+}

package/es/components/radio/GroupContext.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const context: import("react").Context<any>;
+export default context;

package/es/components/radio/GroupContext.js

@@ -0,0 +1,3 @@
+import { createContext } from 'react';
+var context = /*#__PURE__*/createContext(null);
+export default context;

package/es/components/radio/Radio.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { RadioProps } from './types';
+declare const Radio: React.FC<RadioProps>;
+export default Radio;

package/es/components/radio/Radio.js

@@ -0,0 +1,95 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+import React from 'react';
+import cx from 'classnames';
+import ConfigProvider from '../config-provider';
+
+function createEvent(e, props) {
+  var event = Object.create(e);
+  event.target = Object.assign(Object.assign({}, props), {
+    type: 'radio',
+    checked: event.target.checked
+  });
+  return event;
+}
+
+var Radio = function Radio(props) {
+  var defaultChecked = props.defaultChecked,
+      checked = props.checked,
+      customizePrefixCls = props.prefixCls,
+      defaultValue = props.defaultValue,
+      value = props.value,
+      disabled = props.disabled,
+      children = props.children,
+      fixWidth = props.fixWidth,
+      className = props.className,
+      style = props.style,
+      onChange = props.onChange,
+      onMouseEnter = props.onMouseEnter,
+      onMouseLeave = props.onMouseLeave,
+      onRadioGroupChange = props.onRadioGroupChange,
+      restProps = __rest(props, ["defaultChecked", "checked", "prefixCls", "defaultValue", "value", "disabled", "children", "fixWidth", "className", "style", "onChange", "onMouseEnter", "onMouseLeave", "onRadioGroupChange"]);
+
+  var handleChange = function handleChange(e) {
+    var event = createEvent(e, props);
+
+    if (!disabled) {
+      if (onChange) {
+        onChange(event);
+      }
+
+      if (onRadioGroupChange) {
+        onRadioGroupChange(event);
+      }
+    }
+  };
+
+  var labelStyle = fixWidth ? {
+    width: "".concat(fixWidth, "px"),
+    maxWidth: "".concat(fixWidth, "px"),
+    minWidth: "".concat(fixWidth, "px")
+  } : null;
+
+  var _React$useContext = React.useContext(ConfigProvider.ConfigContext),
+      getPrefixCls = _React$useContext.getPrefixCls;
+
+  var prefixCls = getPrefixCls('radio', customizePrefixCls);
+  return /*#__PURE__*/React.createElement("label", _extends({}, restProps, {
+    className: cx(prefixCls, className, {
+      disabled: disabled
+    }),
+    style: style,
+    onMouseEnter: onMouseEnter,
+    onMouseLeave: onMouseLeave
+  }), /*#__PURE__*/React.createElement("input", {
+    type: "radio",
+    className: "".concat(prefixCls, "__input"),
+    defaultValue: defaultValue,
+    value: value,
+    defaultChecked: defaultChecked,
+    checked: checked,
+    onChange: handleChange,
+    disabled: disabled
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "".concat(prefixCls, "__indicator")
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "".concat(prefixCls, "__label"),
+    style: labelStyle
+  }, children));
+};
+
+Radio.displayName = 'Radio';
+export default Radio;

package/es/components/radio/RadioGroup.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { RadioGroupProps } from './types';
+declare const RadioGroup: React.FC<RadioGroupProps>;
+export default RadioGroup;

package/es/components/radio/RadioGroup.js

@@ -0,0 +1,67 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+import React from 'react';
+import classNames from 'classnames';
+import ConfigProvider from '../config-provider';
+import Radio from './Radio';
+
+var RadioGroup = function RadioGroup(_a) {
+  var _a$layout = _a.layout,
+      layout = _a$layout === void 0 ? 'horizontal' : _a$layout,
+      customizePrefixCls = _a.prefixCls,
+      value = _a.value,
+      disabled = _a.disabled,
+      style = _a.style,
+      children = _a.children,
+      fixWidth = _a.fixWidth,
+      customClass = _a.className,
+      onChange = _a.onChange,
+      onMouseEnter = _a.onMouseEnter,
+      onMouseLeave = _a.onMouseLeave,
+      restProps = __rest(_a, ["layout", "prefixCls", "value", "disabled", "style", "children", "fixWidth", "className", "onChange", "onMouseEnter", "onMouseLeave"]);
+
+  var _React$useContext = React.useContext(ConfigProvider.ConfigContext),
+      getPrefixCls = _React$useContext.getPrefixCls;
+
+  var prefixCls = getPrefixCls('radio-group', customizePrefixCls);
+  var classes = classNames(prefixCls, customClass, {
+    disabled: disabled,
+    vertical: layout === 'vertical'
+  });
+  return /*#__PURE__*/React.createElement("div", _extends({}, restProps, {
+    className: classes,
+    style: style,
+    onMouseEnter: onMouseEnter,
+    onMouseLeave: onMouseLeave
+  }), React.Children.map(children, function (element) {
+    if (!element) {
+      return null;
+    }
+
+    if (element.type && element.type.name === Radio.name) {
+      return /*#__PURE__*/React.cloneElement(element, Object.assign(Object.assign({}, element.props), {
+        onRadioGroupChange: onChange,
+        disabled: element.props.disabled || disabled,
+        checked: value === element.props.value,
+        fixWidth: fixWidth
+      }));
+    }
+
+    return element;
+  }));
+};
+
+export default RadioGroup;

package/es/components/radio/index.d.ts

@@ -0,0 +1,8 @@
+import Radio from './Radio';
+import RadioGroup from './RadioGroup';
+declare type InternalRadioType = typeof Radio;
+interface ExternalRadioInterface extends InternalRadioType {
+    Group: typeof RadioGroup;
+}
+declare const ExternalRadio: ExternalRadioInterface;
+export default ExternalRadio;

package/es/components/radio/index.js

@@ -0,0 +1,5 @@
+import Radio from './Radio';
+import RadioGroup from './RadioGroup';
+var ExternalRadio = Radio;
+ExternalRadio.Group = RadioGroup;
+export default ExternalRadio;

package/es/components/radio/types.d.ts

@@ -0,0 +1,86 @@
+import React from 'react';
+import { Omit } from 'utility-types';
+export declare type RadioGroupLayouts = 'vertical' | 'horizontal';
+export interface RadioProps {
+    /**
+     * prefix of classname
+     */
+    prefixCls?: string;
+    /**
+     * default value
+     */
+    defaultValue?: string | number | readonly string[];
+    /**
+     * the native value of radio; if absent it will use the inner text of radio instead
+     */
+    value?: string | number | readonly string[];
+    /**
+     * default checked
+     */
+    defaultChecked?: boolean;
+    /**
+     * whether the radio is checked
+     */
+    checked?: boolean;
+    /**
+     * whether the radio is disabled
+     */
+    disabled?: boolean;
+    /**
+     * trigger when the value change
+     */
+    onChange?: (e: RadioEvent) => void;
+    /**
+     * trigger when mouse entered
+     */
+    onMouseEnter?: React.MouseEventHandler<HTMLElement>;
+    /**
+     * trigger when mouse leaved
+     */
+    onMouseLeave?: React.MouseEventHandler<HTMLElement>;
+    /**
+     * trigger when the value change in group
+     */
+    onRadioGroupChange?: (e: RadioEvent) => void;
+    /**
+     * custom class
+     */
+    className?: string;
+    /**
+     * custom style
+     */
+    style?: React.CSSProperties;
+    /**
+     * children node of radio
+     */
+    children?: React.ReactNode;
+    /**
+     * fix radio item label width
+     */
+    fixWidth?: number;
+}
+export interface RadioEvent extends Omit<React.ChangeEvent<HTMLInputElement>, 'target'> {
+    target: {
+        type: 'radio';
+        checked: boolean;
+    } & RadioProps;
+}
+export interface RadioGroupProps {
+    prefixCls?: string;
+    value?: any;
+    disabled?: boolean;
+    layout?: RadioGroupLayouts;
+    onChange?: (e: RadioEvent) => void;
+    className?: string;
+    style?: React.CSSProperties;
+    children?: React.ReactNode;
+    fixWidth?: number;
+    /**
+     * trigger when mouse entered
+     */
+    onMouseEnter?: React.MouseEventHandler<HTMLElement>;
+    /**
+     * trigger when mouse leaved
+     */
+    onMouseLeave?: React.MouseEventHandler<HTMLElement>;
+}

package/es/components/rate/Rate.d.ts

@@ -0,0 +1,20 @@
+import React, { Component } from 'react';
+import { RateProps, RateState, Style } from './types';
+declare class Rate extends Component<RateProps, RateState> {
+    innerValue: number;
+    static contextType: React.Context<import("../config-provider").ConfigConsumerProps>;
+    static defaultProps: {
+        count: number;
+        value: number;
+        disabled: boolean;
+    };
+    constructor(props: RateProps);
+    UNSAFE_componentWillReceiveProps(props: RateProps): void;
+    starStyles: () => Style[];
+    handleMouseleave: () => void;
+    handleMousemove: (value: any, event: any) => void;
+    handleClick: () => void;
+    formatValue: (value: number) => number;
+    render(): JSX.Element;
+}
+export default Rate;

package/es/components/rate/Rate.js

@@ -0,0 +1,209 @@
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+import React, { Component } from 'react';
+import classNames from 'classnames';
+import Icon from '../icon';
+import ConfigProvider from '../config-provider';
+
+var Rate = /*#__PURE__*/function (_Component) {
+  _inherits(Rate, _Component);
+
+  var _super = _createSuper(Rate);
+
+  function Rate(props) {
+    var _this;
+
+    _classCallCheck(this, Rate);
+
+    _this = _super.call(this, props);
+
+    _this.starStyles = function () {
+      var styles = [];
+      var innerValue = _this.state.innerValue;
+      var count = _this.props.count;
+
+      for (var index = 1; index <= count; index += 1) {
+        if (index <= innerValue) {
+          styles.push({
+            width: '100%'
+          });
+        } else if (index < innerValue + 1) {
+          styles.push({
+            width: "".concat((innerValue + 1 - index) * 100, "%")
+          });
+        } else {
+          styles.push({});
+        }
+      }
+
+      return styles;
+    };
+
+    _this.handleMouseleave = function () {
+      var _this$props = _this.props,
+          disabled = _this$props.disabled,
+          value = _this$props.value;
+
+      if (disabled) {
+        return;
+      }
+
+      _this.setState({
+        innerValue: _this.formatValue(value)
+      });
+    };
+
+    _this.handleMousemove = function (value, event) {
+      var _this$props2 = _this.props,
+          disabled = _this$props2.disabled,
+          allowHalf = _this$props2.allowHalf;
+
+      if (disabled) {
+        return;
+      }
+
+      var layerX = event.nativeEvent.layerX || event.nativeEvent.offsetX + 0;
+      var width = event.currentTarget.clientWidth;
+
+      if (allowHalf && layerX < width / 2) {
+        _this.setState({
+          innerValue: value - 0.5
+        });
+      } else {
+        _this.setState({
+          innerValue: value
+        });
+      }
+    };
+
+    _this.handleClick = function () {
+      var _this$props3 = _this.props,
+          onChange = _this$props3.onChange,
+          disabled = _this$props3.disabled;
+      var innerValue = _this.state.innerValue;
+
+      if (disabled) {
+        return;
+      }
+
+      if (onChange) {
+        onChange(innerValue);
+      }
+    };
+
+    _this.formatValue = function (value) {
+      var _this$props4 = _this.props,
+          count = _this$props4.count,
+          disabled = _this$props4.disabled,
+          allowHalf = _this$props4.allowHalf,
+          allowDecimal = _this$props4.allowDecimal;
+      var acValue;
+      var formatValue;
+
+      if (value > count) {
+        acValue = count;
+      } else if (value < 0) {
+        acValue = 0;
+      } else {
+        acValue = value;
+      }
+
+      if (disabled && allowDecimal) {
+        formatValue = acValue;
+      } else if (allowHalf) {
+        formatValue = Math.floor(acValue * 2) / 2;
+      } else {
+        formatValue = Math.floor(acValue);
+      }
+
+      return formatValue;
+    };
+
+    var value = _this.props.value;
+    _this.state = {
+      innerValue: _this.formatValue(value)
+    };
+    return _this;
+  }
+
+  _createClass(Rate, [{
+    key: "UNSAFE_componentWillReceiveProps",
+    value: function UNSAFE_componentWillReceiveProps(props) {
+      var value = this.props.value;
+
+      if (props.value !== value) {
+        this.setState({
+          innerValue: this.formatValue(props.value)
+        });
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var _this$props5 = this.props,
+          customizePrefixCls = _this$props5.prefixCls,
+          value = _this$props5.value,
+          count = _this$props5.count,
+          disabled = _this$props5.disabled,
+          showText = _this$props5.showText,
+          icon = _this$props5.icon,
+          character = _this$props5.character;
+      var getPrefixCls = this.context.getPrefixCls;
+      var prefixCls = getPrefixCls('rate', customizePrefixCls);
+      var stars = [];
+      var starStyle = this.starStyles();
+
+      var _loop = function _loop(i) {
+        stars.push( /*#__PURE__*/React.createElement("div", {
+          className: "".concat(prefixCls, "-star"),
+          key: i,
+          onMouseMove: function onMouseMove(Event) {
+            return _this2.handleMousemove(i + 1, Event);
+          },
+          onClick: function onClick() {
+            return _this2.handleClick();
+          }
+        }, /*#__PURE__*/React.createElement("div", {
+          className: "".concat(prefixCls, "-star__front"),
+          style: starStyle[i]
+        }, icon && /*#__PURE__*/React.createElement(Icon, {
+          type: icon
+        }), !icon && (character || /*#__PURE__*/React.createElement(Icon, {
+          type: "star-s"
+        }))), /*#__PURE__*/React.createElement("div", {
+          className: "".concat(prefixCls, "-star__back")
+        }, icon && /*#__PURE__*/React.createElement(Icon, {
+          type: icon
+        }), !icon && (character || /*#__PURE__*/React.createElement(Icon, {
+          type: "star"
+        })))));
+      };
+
+      for (var i = 0; i < count; i += 1) {
+        _loop(i);
+      }
+
+      var classes = classNames("".concat(prefixCls, "-text"), disabled && "".concat(prefixCls, "-disabled"));
+      return /*#__PURE__*/React.createElement("div", {
+        className: prefixCls,
+        onMouseLeave: this.handleMouseleave
+      }, stars, showText && /*#__PURE__*/React.createElement("div", {
+        className: classes
+      }, value));
+    }
+  }]);
+
+  return Rate;
+}(Component);
+
+Rate.contextType = ConfigProvider.ConfigContext;
+Rate.defaultProps = {
+  count: 5,
+  value: 0,
+  disabled: false
+};
+export default Rate;

package/es/components/rate/index.d.ts

@@ -0,0 +1,2 @@
+import Rate from './Rate';
+export default Rate;

package/es/components/rate/index.js

@@ -0,0 +1,2 @@
+import Rate from './Rate';
+export default Rate;