@dpocean/chatui 1.0.0

package/es/components/ConfigProvider/locales/id.js

@@ -0,0 +1,37 @@
+export default {
+  BackBottom: {
+    newMsgOne: '{n} pesan baru',
+    newMsgOther: '{n} pesan baru',
+    bottom: 'Bawah'
+  },
+  Time: {
+    weekdays: ['Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jumat', 'Sabtu'],
+    formats: {
+      LT: 'HH:mm',
+      lll: 'M/D/YYYY HH:mm',
+      WT: 'dddd HH:mm',
+      YT: 'Kemarin HH:mm'
+    }
+  },
+  Composer: {
+    send: 'Kirim'
+  },
+  SendConfirm: {
+    title: 'Kirim foto',
+    send: 'Kirim',
+    cancel: 'Batalkan'
+  },
+  RateActions: {
+    up: 'Voting up',
+    down: 'Voting down'
+  },
+  Recorder: {
+    hold2talk: 'Tahan untuk Berbicara',
+    release2send: 'Rilis untuk Mengirim',
+    releaseOrSwipe: 'Rilis untuk mengirim, gulir ke atas untuk membatalkan',
+    release2cancel: 'Rilis untuk membatalkan'
+  },
+  Search: {
+    search: 'Cari'
+  }
+};

package/es/components/ConfigProvider/locales/index.js

@@ -0,0 +1,20 @@
+import enUS from './en_US';
+import zhCN from './zh_CN';
+import es from './es';
+import hi from './hi';
+import id from './id';
+import pt from './pt';
+import ur from './ur';
+import vi from './vi';
+export default {
+  'en-US': enUS,
+  // 英语（美式）
+  'zh-CN': zhCN,
+  // 简体中文
+  es: es,
+  hi: hi,
+  id: id,
+  pt: pt,
+  ur: ur,
+  vi: vi
+};

package/es/components/ConfigProvider/locales/pt.js

@@ -0,0 +1,37 @@
+export default {
+  BackBottom: {
+    newMsgOne: '{n} nova mensagem',
+    newMsgOther: '{n} novas mensagens',
+    bottom: 'Bottom'
+  },
+  Time: {
+    weekdays: ['Domingo', 'Segunda-feira', 'Terça-feira', 'Quarta-feira', 'Quinta-feira', 'Sexta-feira', 'Sábado'],
+    formats: {
+      LT: 'HH:mm',
+      lll: 'M/D/YYYY HH:mm',
+      WT: 'dddd HH:mm',
+      YT: 'Ontem HH:mm'
+    }
+  },
+  Composer: {
+    send: 'Enviar'
+  },
+  SendConfirm: {
+    title: 'Enviar foto',
+    send: 'Enviar',
+    cancel: 'Cancelar'
+  },
+  RateActions: {
+    up: 'Up vote',
+    down: 'Down vote'
+  },
+  Recorder: {
+    hold2talk: 'Pressione para falar',
+    release2send: 'Liberar para enviar',
+    releaseOrSwipe: 'Liberar para enviar, deslizar para cima para cancelar',
+    release2cancel: 'Liberação para cancelar'
+  },
+  Search: {
+    search: 'Pesquisa'
+  }
+};

package/es/components/ConfigProvider/locales/ur.js

@@ -0,0 +1,37 @@
+export default {
+  BackBottom: {
+    newMsgOne: '{n} نیا پیغام',
+    newMsgOther: '{n} نئے پیغامات',
+    bottom: 'نیچے'
+  },
+  Time: {
+    weekdays: ['اتوار', 'پیر', 'منگل', 'بدھ', 'جمعرات', 'جمعہ', 'ہفتہ'],
+    formats: {
+      LT: 'HH:mm',
+      lll: 'M/D/YYYY HH:mm',
+      WT: 'dddd HH:mm',
+      YT: 'کل HH:mm'
+    }
+  },
+  Composer: {
+    send: 'بھیجیں'
+  },
+  SendConfirm: {
+    title: 'تصویر بھیجیں',
+    send: 'بھیجیں',
+    cancel: 'منسوخ کریں'
+  },
+  RateActions: {
+    up: 'اپ ووٹ',
+    down: 'ڈاؤن ووٹ'
+  },
+  Recorder: {
+    hold2talk: 'بات کریں',
+    release2send: 'بھیجنے کے لئے آزاد',
+    releaseOrSwipe: 'بھیجنے کے لئے جاری کریں، منسوخ کرنے کے لئے اپ سوئپ کریں',
+    release2cancel: 'منسوخ کرنے کے لئے آزاد'
+  },
+  Search: {
+    search: 'تلاش کریں'
+  }
+};

package/es/components/ConfigProvider/locales/vi.js

@@ -0,0 +1,37 @@
+export default {
+  BackBottom: {
+    newMsgOne: '{n} tin nhắn mới',
+    newMsgOther: '{n} tin nhắn mới',
+    bottom: 'Đầu trang'
+  },
+  Time: {
+    weekdays: ['Chủ nhật', 'Thứ Hai', 'Thứ ba', 'Thứ Tư', 'Thứ Năm', 'Thứ Sáu', 'Thứ Bảy'],
+    formats: {
+      LT: 'HH:mm',
+      lll: 'M/D/YYYY HH:mm',
+      WT: 'dddd HH:mm',
+      YT: 'Hôm qua HH:mm'
+    }
+  },
+  Composer: {
+    send: 'Gửi'
+  },
+  SendConfirm: {
+    title: 'Gửi ảnh',
+    send: 'Gửi',
+    cancel: 'Gửi ảnh'
+  },
+  RateActions: {
+    up: 'Bỏ phiếu thích',
+    down: 'Bỏ phiếu không đồng ý'
+  },
+  Recorder: {
+    hold2talk: 'Giữ để nói chuyện',
+    release2send: 'Release để gửi',
+    releaseOrSwipe: 'Giải phóng để gửi, vuốt lên để hủy',
+    release2cancel: 'Release để hủy'
+  },
+  Search: {
+    search: 'Tìm kiếm'
+  }
+};

package/es/components/ConfigProvider/locales/zh_CN.js

@@ -0,0 +1,40 @@
+export default {
+  BackBottom: {
+    newMsgOne: '{n}条新消息',
+    newMsgOther: '{n}条新消息',
+    bottom: '回到底部'
+  },
+  Time: {
+    weekdays: ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'],
+    formats: {
+      LT: 'HH:mm',
+      // 00:32
+      lll: 'YYYY年M月D日 HH:mm',
+      // 2019年2月22日 00:28
+      WT: 'dddd HH:mm',
+      // 星期一 00:32
+      YT: '昨天 HH:mm' // 昨天 00:32
+    }
+  },
+  Composer: {
+    send: '发送'
+  },
+  SendConfirm: {
+    title: '发送图片',
+    send: '发送',
+    cancel: '取消'
+  },
+  RateActions: {
+    up: '赞同',
+    down: '反对'
+  },
+  Recorder: {
+    hold2talk: '按住 说话',
+    release2send: '松开 发送',
+    releaseOrSwipe: '松开发送，上滑取消',
+    release2cancel: '松开手指，取消发送'
+  },
+  Search: {
+    search: '搜索'
+  }
+};

package/es/components/Countdown/index.js

@@ -0,0 +1,22 @@
+import React from 'react';
+import clsx from 'clsx';
+import useCountdown from '../../hooks/useCountdown';
+import { padZero } from '../../utils/date';
+export var Countdown = function Countdown(_ref) {
+  var className = _ref.className,
+    targetDate = _ref.targetDate,
+    onEnd = _ref.onEnd;
+  var timeLeft = useCountdown({
+    targetDate: targetDate,
+    onEnd: onEnd
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    className: clsx('Countdown', className)
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "Countdown-unit"
+  }, padZero(timeLeft.hours)), /*#__PURE__*/React.createElement("span", null, " : "), /*#__PURE__*/React.createElement("span", {
+    className: "Countdown-unit"
+  }, padZero(timeLeft.minutes)), /*#__PURE__*/React.createElement("span", null, " : "), /*#__PURE__*/React.createElement("span", {
+    className: "Countdown-unit"
+  }, padZero(timeLeft.seconds)));
+};

package/es/components/Countdown/style.less

@@ -0,0 +1,14 @@
+.Countdown {
+  display: inline-block;
+}
+
+.Countdown-unit {
+  display: inline-block;
+  padding: 0 4px;
+  border-radius: 4px;
+  background: rgba(255, 255, 255, 0.25);
+  font-size: 12px;
+  line-height: 15px;
+  font-weight: 500;
+  font-family: 'AlibabaSans', -apple-system, 'Helvetica Neue', Arial, sans-serif;
+}

package/es/components/Coupon/index.js

@@ -0,0 +1,84 @@
+import React from 'react';
+import clsx from 'clsx';
+import { Price } from '../Price';
+import { Button } from '../Button';
+import { Flex, FlexItem } from '../Flex';
+import { Text } from '../Text';
+import { Ribbon } from '../Ribbon';
+import { formatExpireTime } from '../../utils/date';
+var statusLabelMap = {
+  normal: '',
+  nearExpired: '快失效',
+  expired: '已过期',
+  used: '已使用',
+  deleted: '已删除'
+};
+export var Coupon = function Coupon(props) {
+  var className = props.className,
+    value = props.value,
+    discount = props.discount,
+    condition = props.condition,
+    name = props.name,
+    endAt = props.endAt,
+    dateDesc = props.dateDesc,
+    desc = props.desc,
+    _props$status = props.status,
+    status = _props$status === void 0 ? 'normal' : _props$status,
+    _props$inList = props.inList,
+    inList = _props$inList === void 0 ? false : _props$inList,
+    _props$btnText = props.btnText,
+    btnText = _props$btnText === void 0 ? '查看' : _props$btnText,
+    onClick = props.onClick;
+  var statusLabel = statusLabelMap[status] || '';
+  return /*#__PURE__*/React.createElement(Flex, {
+    className: clsx('Coupon', className),
+    "data-status": status,
+    "data-in-list": inList,
+    onClick: inList ? undefined : onClick
+  }, /*#__PURE__*/React.createElement(Flex, {
+    className: "Coupon-object",
+    center: true,
+    direction: "column"
+  }, value ? /*#__PURE__*/React.createElement(Price, {
+    className: "Coupon-value",
+    price: value,
+    currency: "\xA5",
+    autoFit: true
+  }) : discount ? /*#__PURE__*/React.createElement("div", {
+    className: "Coupon-discount Price",
+    "data-size": "xl"
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "Price-integer"
+  }, discount), /*#__PURE__*/React.createElement("span", {
+    className: "Coupon-discount-suffix"
+  }, "\u6298")) : null, /*#__PURE__*/React.createElement(Text, {
+    className: "Coupon-condition",
+    truncate: 2
+  }, condition)), /*#__PURE__*/React.createElement("div", {
+    className: "Coupon-divider"
+  }), /*#__PURE__*/React.createElement(FlexItem, {
+    className: "Coupon-main"
+  }, /*#__PURE__*/React.createElement(Text, {
+    className: "Coupon-name",
+    truncate: true
+  }, name), dateDesc ? /*#__PURE__*/React.createElement(Text, {
+    className: "Coupon-desc",
+    truncate: true
+  }, dateDesc) : endAt ? /*#__PURE__*/React.createElement(Text, {
+    className: "Coupon-desc",
+    truncate: true
+  }, formatExpireTime(endAt)) : null, /*#__PURE__*/React.createElement(Text, {
+    className: "Coupon-desc",
+    truncate: true
+  }, desc)), onClick && /*#__PURE__*/React.createElement(Flex, {
+    className: "Coupon-actions",
+    center: true
+  }, /*#__PURE__*/React.createElement(Button, {
+    className: "Coupon-btn",
+    onClick: inList ? onClick : undefined
+  }, btnText)), statusLabel && /*#__PURE__*/React.createElement(Ribbon, {
+    color: ['expired', 'used', 'deleted'].includes(status) ? 'gray' : 'primary',
+    position: "right",
+    size: "sm"
+  }, statusLabel));
+};

package/es/components/Coupon/style.less

@@ -0,0 +1,145 @@
+.Coupon {
+  --coupon-object-width: 80px;
+  --coupon-height: 80px;
+  --coupon-value-color: var(--red);
+  --coupon-condition-color: rgba(255, 3, 0, 0.5);
+  --coupon-main-text-color: var(--color-text-1);
+  --coupon-name-font-size: 15px;
+  --coupon-desc-color: rgba(255, 3, 0, 0.9);
+  --coupon-desc-font-size: 12px;
+  --coupon-bg: #fff2f2;
+  --coupon-border-color: rgba(232, 16, 0, 0.15);
+
+  --btn-padding: 3px 12px;
+  --btn-bg: var(--red);
+  --btn-active-bg: var(--btn-bg);
+  --btn-hover-bg: var(--btn-bg);
+  --btn-border-color: var(--btn-bg);
+  --btn-color: var(--white);
+  --btn-font-size: 13px;
+
+  position: relative;
+  height: var(--coupon-height);
+  box-sizing: border-box;
+  border: 1px solid var(--coupon-border-color);
+  border-radius: var(--radius-md);
+  background: var(--coupon-bg);
+  color: var(--coupon-main-text-color);
+  mask: radial-gradient(circle at var(--coupon-object-width) top, transparent 4px, #000 0) top left /
+      100% 50% no-repeat,
+    radial-gradient(circle at var(--coupon-object-width) bottom, transparent 4px, #000 0) bottom
+      right / 100% 50% no-repeat;
+
+  .Btn {
+    min-width: 0;
+    margin: 12px;
+  }
+  &[data-status='expired'],
+  &[data-status='used'],
+  &[data-status='deleted'] {
+    --coupon-border-color: var(--color-line-2);
+    --coupon-value-color: var(--color-text-1);
+    --coupon-condition-color: var(--color-text-3);
+    --coupon-main-text-color: var(--color-text-1);
+    --coupon-desc-color: var(--color-text-2);
+    --coupon-bg: var(--color-fill-2);
+
+    --btn-bg: transparent;
+    --btn-border-color: var(--red);
+    --btn-color: var(--red);
+
+    .Coupon-arc {
+      display: none;
+    }
+  }
+  &[data-in-list='false'] {
+    --coupon-width: 70px;
+    --coupon-height: 61px;
+    --coupon-name-font-size: 12px;
+    --coupon-desc-font-size: 10px;
+
+    --btn-padding: 2px 6px;
+    --btn-font-size: 12px;
+
+    &[data-status='expired'],
+    &[data-status='used'],
+    &[data-status='deleted'] {
+      --btn-border-color: var(--color-line-2);
+      --btn-color: var(--color-text-2);
+    }
+  }
+  .Countdown-unit {
+    color: var(--coupon-value-color);
+    background: rgba(255, 3, 0, 0.1);
+  }
+}
+
+.Coupon-object {
+  position: relative;
+  overflow: hidden;
+  width: var(--coupon-object-width);
+  color: var(--coupon-value-color);
+  line-height: 1.15;
+}
+
+.Coupon-discount-suffix {
+  margin-left: 2px;
+  font-size: 0.6em;
+  font-weight: 500;
+}
+
+.Coupon-condition {
+  color: var(--coupon-condition-color);
+  font-size: 10px;
+}
+
+.Coupon-divider {
+  position: relative;
+  height: calc(100% - 16px);
+  border-left: 1px dashed var(--coupon-border-color);
+  margin: 8px 12px 8px -1px;
+}
+
+.Coupon-main {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
+
+.Coupon-name {
+  font-size: var(--coupon-name-font-size);
+  font-weight: 500;
+}
+
+.Coupon-desc {
+  color: var(--coupon-desc-color);
+  font-size: var(--coupon-desc-font-size);
+}
+
+@media (max-width: 374px) {
+  .Coupon .Btn {
+    margin: 0 8px 0 6px;
+  }
+}
+
+@supports (mask-image: url('')) {
+  .Coupon-divider {
+    &:before,
+    &:after {
+      content: '';
+      position: absolute;
+      border: 1px solid var(--coupon-border-color);
+      width: 10px;
+      height: 10px;
+      border-radius: 50%;
+      left: -6px;
+      box-sizing: border-box;
+    }
+    &:before {
+      top: -14px;
+    }
+    &:after {
+      bottom: -14px;
+    }
+  }
+}

package/es/components/Divider/index.js

@@ -0,0 +1,16 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["className", "position", "children"];
+import React from 'react';
+import clsx from 'clsx';
+export var Divider = function Divider(props) {
+  var className = props.className,
+    _props$position = props.position,
+    position = _props$position === void 0 ? 'center' : _props$position,
+    children = props.children,
+    other = _objectWithoutProperties(props, _excluded);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: clsx('Divider', !!children && "Divider--text-".concat(position), className),
+    role: "separator"
+  }, other), children);
+};

package/es/components/Divider/style.less

@@ -0,0 +1,44 @@
+.Divider {
+  display: flex;
+  align-items: center;
+  margin: 12px 0;
+  font-size: @font-size-xs;
+  color: var(--color-text-3);
+
+  &:before,
+  &:after {
+    content: '';
+    display: block;
+    flex: 1;
+    border-top: 1px solid var(--color-line-1);
+
+    @media (hover: none) {
+      & {
+        transform: scaleY(0.5);
+      }
+    }
+  }
+}
+
+.Divider--text-center,
+.Divider--text-left,
+.Divider--text-right {
+  &:before {
+    margin-right: var(--gutter);
+  }
+  &:after {
+    margin-left: var(--gutter);
+  }
+}
+
+.Divider--text-left {
+  &:before {
+    max-width: 10%;
+  }
+}
+
+.Divider--text-right {
+  &:after {
+    max-width: 10%;
+  }
+}

package/es/components/Empty/index.js

@@ -0,0 +1,45 @@
+import React from 'react';
+import clsx from 'clsx';
+import { Flex } from '../Flex';
+import { Image } from '../Image';
+// 根据不同类型设置默认图片
+var getDefaultImage = function getDefaultImage(type) {
+  switch (type) {
+    case 'error':
+      return '//gw.alicdn.com/imgextra/i3/O1CN0189gA291s1P3ribzqY_!!6000000005706-55-tps-280-200.svg';
+    case 'error_permission':
+      return '//gw.alicdn.com/imgextra/i3/O1CN01w3M7wn1sVAnwUCUSN_!!6000000005771-55-tps-280-200.svg';
+    case 'error_system':
+      return '//gw.alicdn.com/imgextra/i2/O1CN01sQpWzK1ynqeLrIzCg_!!6000000006624-55-tps-280-200.svg';
+    case 'order':
+      return '//gw.alicdn.com/imgextra/i1/O1CN011akG1g1sB1NYoqSFz_!!6000000005727-55-tps-280-200.svg';
+    case 'benefit':
+      return '//gw.alicdn.com/imgextra/i2/O1CN01v5pA1d1MctmYWl1jB_!!6000000001456-55-tps-280-200.svg';
+    case 'knowledge':
+      return '//gw.alicdn.com/imgextra/i3/O1CN01hriild1j68c8wCq3S_!!6000000004498-55-tps-280-200.svg';
+    default:
+      return '//gw.alicdn.com/imgextra/i4/O1CN01sK49rS1Wd23TqzNUM_!!6000000002810-55-tps-280-200.svg';
+  }
+};
+export var Empty = function Empty(props) {
+  var className = props.className,
+    _props$type = props.type,
+    type = _props$type === void 0 ? 'search' : _props$type,
+    image = props.image,
+    tip = props.tip,
+    desc = props.desc,
+    children = props.children;
+  var imgUrl = image || getDefaultImage(type);
+  return /*#__PURE__*/React.createElement(Flex, {
+    className: clsx('Empty', className),
+    direction: "column",
+    center: true
+  }, /*#__PURE__*/React.createElement(Image, {
+    className: "Empty-img",
+    src: imgUrl
+  }), tip && /*#__PURE__*/React.createElement("h5", {
+    className: "Empty-tip"
+  }, tip), desc && /*#__PURE__*/React.createElement("p", {
+    className: "Empty-desc"
+  }, desc), children);
+};

package/es/components/Empty/style.less

@@ -0,0 +1,26 @@
+.Empty {
+  padding: 30px;
+  text-align: center;
+
+  .Btn {
+    margin-top: 32px;
+  }
+}
+
+.Empty-img {
+  height: 100px;
+}
+
+.Empty-tip {
+  margin: 6px 0 0;
+  color: var(--color-text-3);
+  font-size: 18px;
+  font-weight: 600;
+}
+
+.Empty-desc {
+  margin: 8px 0;
+  font-size: 15px;
+  color: var(--color-text-2);
+  opacity: 0.6;
+}

package/es/components/ErrorBoundary/index.js

@@ -0,0 +1,58 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+var _excluded = ["FallbackComponent", "children"];
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+import React from 'react';
+export var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
+  function ErrorBoundary(props) {
+    var _this;
+    _classCallCheck(this, ErrorBoundary);
+    _this = _callSuper(this, ErrorBoundary, [props]);
+    _this.state = {
+      error: null,
+      errorInfo: null
+    };
+    return _this;
+  }
+  _inherits(ErrorBoundary, _React$Component);
+  return _createClass(ErrorBoundary, [{
+    key: "componentDidCatch",
+    value: function componentDidCatch(error, errorInfo) {
+      var onError = this.props.onError;
+      if (onError) {
+        onError(error, errorInfo);
+      }
+      this.setState({
+        error: error,
+        errorInfo: errorInfo
+      });
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        FallbackComponent = _this$props.FallbackComponent,
+        children = _this$props.children,
+        rest = _objectWithoutProperties(_this$props, _excluded);
+      var _this$state = this.state,
+        error = _this$state.error,
+        errorInfo = _this$state.errorInfo;
+      if (errorInfo) {
+        if (FallbackComponent) {
+          return /*#__PURE__*/React.createElement(FallbackComponent, _extends({
+            error: error,
+            errorInfo: errorInfo
+          }, rest));
+        }
+        return null;
+      }
+      return children;
+    }
+  }]);
+}(React.Component);