@dpocean/chatui 1.0.0

package/lib/components/Price/index.js

@@ -0,0 +1,99 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Price = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _excluded = ["className", "price", "currency", "locale", "original", "autoFit"];
+/* eslint-disable react/no-array-index-key */
+var canFormat = 'Intl' in window && typeof Intl.NumberFormat.prototype.formatToParts === 'function';
+/**
+ * xl - 60
+ * lg - 48
+ * md - 36
+ * sm - 28
+ */
+function getSize(parts) {
+  var getPartLength = function getPartLength(type) {
+    var _parts$find;
+    return ((_parts$find = parts.find(function (p) {
+      return p.type === type;
+    })) === null || _parts$find === void 0 || (_parts$find = _parts$find.value) === null || _parts$find === void 0 ? void 0 : _parts$find.length) || 0;
+  };
+  var len1 = getPartLength('integer');
+  var len2 = getPartLength('fraction');
+  if (len1 < 2) {
+    return 'xl';
+  }
+  if (len1 === 2) {
+    return len2 ? 'lg' : 'xl';
+  }
+  if (len1 === 3) {
+    return len2 ? len2 > 1 ? 'md' : 'lg' : 'xl';
+  }
+  if (len1 === 4) {
+    return len2 ? len2 > 1 ? 'sm' : 'md' : 'lg';
+  }
+  return len2 ? 'sm' : 'md';
+}
+var Price = exports.Price = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
+  var className = props.className,
+    price = props.price,
+    currency = props.currency,
+    locale = props.locale,
+    original = props.original,
+    autoFit = props.autoFit,
+    other = (0, _objectWithoutProperties2.default)(props, _excluded);
+  var parts = [];
+  if (locale && currency && canFormat) {
+    parts = new Intl.NumberFormat(locale, {
+      style: 'currency',
+      currency: currency,
+      useGrouping: false,
+      minimumFractionDigits: 0
+    }).formatToParts(price);
+  } else {
+    parts = undefined;
+  }
+
+  // 部分 Android 机只返回 `[{ type: 'literal', value: '¥5.88' }]`
+  if (!parts || parts.length < 2) {
+    var decimal = '.';
+    var _split = "".concat(price).split(decimal),
+      _split2 = (0, _slicedToArray2.default)(_split, 2),
+      integer = _split2[0],
+      fraction = _split2[1];
+    parts = [{
+      type: 'currency',
+      value: currency
+    }, {
+      type: 'integer',
+      value: integer
+    }, {
+      type: 'decimal',
+      value: fraction && decimal
+    }, {
+      type: 'fraction',
+      value: fraction
+    }];
+  }
+  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+    className: (0, _clsx.default)('Price', {
+      'Price--original': original
+    }, className),
+    "data-size": autoFit ? getSize(parts) : undefined,
+    ref: ref,
+    "aria-label": "\u4EF7\u683C\uFF1A".concat(price)
+  }, other), parts.map(function (t, i) {
+    return t.value ? /*#__PURE__*/_react.default.createElement("span", {
+      className: "Price-".concat(t.type),
+      key: i
+    }, t.value) : null;
+  }));
+});

package/lib/components/Progress/index.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export type ProgressProps = {
+    className?: string;
+    value: number;
+    status?: 'active' | 'success' | 'error';
+};
+export declare const Progress: React.ForwardRefExoticComponent<ProgressProps & React.RefAttributes<HTMLDivElement>>;

package/lib/components/Progress/index.js

@@ -0,0 +1,32 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Progress = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _excluded = ["className", "value", "status", "children"];
+var Progress = exports.Progress = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
+  var className = props.className,
+    value = props.value,
+    status = props.status,
+    children = props.children,
+    other = (0, _objectWithoutProperties2.default)(props, _excluded);
+  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+    className: (0, _clsx.default)('Progress', status && "Progress--".concat(status), className),
+    ref: ref
+  }, other), /*#__PURE__*/_react.default.createElement("div", {
+    className: "Progress-bar",
+    role: "progressbar",
+    style: {
+      width: "".concat(value, "%")
+    },
+    "aria-valuenow": value,
+    "aria-valuemin": 0,
+    "aria-valuemax": 100
+  }, children));
+});

package/lib/components/PullToRefresh/index.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+type PullToRefreshStatus = 'pending' | 'pull' | 'active' | 'loading';
+export interface PullToRefreshProps {
+    distance?: number;
+    loadingDistance?: number;
+    distanceRatio?: number;
+    loadMoreText?: string;
+    maxDistance?: number;
+    onRefresh?: () => Promise<any>;
+    onScroll?: (event: React.UIEvent<HTMLDivElement, UIEvent>) => void;
+    renderIndicator?: (status: PullToRefreshStatus, distance: number) => React.ReactNode;
+    children: React.ReactNode;
+}
+export interface ScrollToEndOptions {
+    animated?: boolean;
+    force?: boolean;
+}
+interface PTRScrollToOptions extends ScrollToEndOptions {
+    y: number | '100%';
+}
+export interface PullToRefreshHandle {
+    scrollTo: (opts: PTRScrollToOptions) => void;
+    scrollToEnd: (opts?: ScrollToEndOptions) => void;
+    wrapperRef: React.RefObject<HTMLDivElement>;
+}
+export declare const PullToRefresh: React.ForwardRefExoticComponent<PullToRefreshProps & React.RefAttributes<PullToRefreshHandle>>;
+export {};

package/lib/components/PullToRefresh/index.js

@@ -0,0 +1,233 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PullToRefresh = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _style = require("../../utils/style");
+var _Icon = require("../Icon");
+var _Flex = require("../Flex");
+var _Button = require("../Button");
+var _canUse = _interopRequireDefault(require("../../utils/canUse"));
+var _smoothScroll = _interopRequireDefault(require("../../utils/smoothScroll"));
+var _useLatest = require("../../hooks/useLatest");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+var canPassive = (0, _canUse.default)('passiveListener');
+var passiveOpts = canPassive ? {
+  passive: true
+} : false;
+var nonPassiveOpts = canPassive ? {
+  passive: false
+} : false;
+var PullToRefresh = exports.PullToRefresh = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
+  var _props$distance = props.distance,
+    oDistance = _props$distance === void 0 ? 20 : _props$distance,
+    _props$loadingDistanc = props.loadingDistance,
+    loadingDistance = _props$loadingDistanc === void 0 ? 30 : _props$loadingDistanc,
+    _props$maxDistance = props.maxDistance,
+    maxDistance = _props$maxDistance === void 0 ? 60 : _props$maxDistance,
+    _props$distanceRatio = props.distanceRatio,
+    distanceRatio = _props$distanceRatio === void 0 ? 2 : _props$distanceRatio,
+    _props$loadMoreText = props.loadMoreText,
+    loadMoreText = _props$loadMoreText === void 0 ? '点击加载更多' : _props$loadMoreText,
+    children = props.children,
+    onScroll = props.onScroll,
+    onRefresh = props.onRefresh,
+    _props$renderIndicato = props.renderIndicator,
+    renderIndicator = _props$renderIndicato === void 0 ? function (status) {
+      if (status === 'active' || status === 'loading') {
+        return /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
+          className: "PullToRefresh-spinner",
+          type: "spinner",
+          spin: true
+        });
+      }
+      return null;
+    } : _props$renderIndicato;
+  var wrapperRef = (0, _react.useRef)(null);
+  var contentRef = (0, _react.useRef)(null);
+  var onRefreshRef = (0, _useLatest.useLatest)(onRefresh);
+  var _useState = (0, _react.useState)(0),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    distance = _useState2[0],
+    setDistance = _useState2[1];
+  var _useState3 = (0, _react.useState)('pending'),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    status = _useState4[0],
+    setStatus = _useState4[1];
+  var _useState5 = (0, _react.useState)(false),
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    dropped = _useState6[0],
+    setDropped = _useState6[1];
+  var _useState7 = (0, _react.useState)(!props.onRefresh),
+    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+    disabled = _useState8[0],
+    setDisabled = _useState8[1];
+  var sharedRef = (0, _react.useRef)({});
+  var statusRef = (0, _react.useRef)(status);
+  var timer1 = (0, _react.useRef)();
+  var timer2 = (0, _react.useRef)();
+  var useFallback = !(0, _canUse.default)('touch');
+  (0, _react.useEffect)(function () {
+    statusRef.current = status;
+  }, [status]);
+  var setContentStyle = function setContentStyle(y) {
+    var content = contentRef.current;
+    if (content) {
+      (0, _style.setTransform)(content, "translate3d(0px,".concat(y, "px,0)"));
+    }
+  };
+  var scrollTo = function scrollTo(_ref) {
+    var y = _ref.y,
+      _ref$animated = _ref.animated,
+      animated = _ref$animated === void 0 ? true : _ref$animated;
+    var scroller = wrapperRef.current;
+    if (!scroller) return;
+    var offsetTop = y === '100%' ? scroller.scrollHeight - scroller.offsetHeight : y;
+    if (animated) {
+      (0, _smoothScroll.default)({
+        el: scroller,
+        to: offsetTop,
+        x: false
+      });
+    } else {
+      scroller.scrollTop = offsetTop;
+    }
+  };
+  var scrollToEnd = (0, _react.useCallback)(function () {
+    var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      _ref2$animated = _ref2.animated,
+      animated = _ref2$animated === void 0 ? true : _ref2$animated;
+    scrollTo({
+      y: '100%',
+      animated: animated
+    });
+  }, []);
+  var reset = (0, _react.useCallback)(function () {
+    setDistance(0);
+    setStatus('pending');
+    setContentStyle(0);
+  }, []);
+  var handleLoadMore = (0, _react.useCallback)(function () {
+    var scroller = wrapperRef.current;
+    if (!scroller || !onRefreshRef.current) return;
+    setStatus('loading');
+    try {
+      var sh = scroller.scrollHeight;
+      onRefreshRef.current().then(function (res) {
+        var handleOffset = function handleOffset() {
+          scrollTo({
+            y: scroller.scrollHeight - sh - 50,
+            animated: false
+          });
+        };
+        clearTimeout(timer1.current);
+        clearTimeout(timer2.current);
+        handleOffset();
+        timer1.current = setTimeout(handleOffset, 150);
+        timer2.current = setTimeout(handleOffset, 250);
+        reset();
+        if (res && res.noMore) {
+          setDisabled(true);
+        }
+      });
+    } catch (ex) {
+      // eslint-disable-next-line no-console
+      console.error(ex);
+      reset();
+    }
+  }, [onRefreshRef, reset]);
+  var touchStart = function touchStart() {
+    sharedRef.current.startY = 0;
+  };
+  var touchMove = (0, _react.useCallback)(function (e) {
+    var _wrapperRef$current;
+    var currentY = e.touches[0].clientY;
+    var canPull = ((_wrapperRef$current = wrapperRef.current) === null || _wrapperRef$current === void 0 ? void 0 : _wrapperRef$current.scrollTop) <= 0;
+    if (canPull) {
+      if (!sharedRef.current.startY) {
+        sharedRef.current.startY = currentY;
+        setStatus('pull');
+        setDropped(false);
+      }
+    } else {
+      sharedRef.current.startY = 0;
+    }
+    var startY = sharedRef.current.startY;
+    if (!canPull || currentY < startY || statusRef.current === 'loading') return;
+    var dist = (currentY - startY) / distanceRatio;
+    if (maxDistance && dist > maxDistance) {
+      dist = maxDistance;
+    }
+    if (dist > 0) {
+      if (e.cancelable) {
+        e.preventDefault();
+      }
+      e.stopPropagation();
+      setContentStyle(dist);
+      setDistance(dist);
+      setStatus(dist >= oDistance ? 'active' : 'pull');
+    }
+  }, [distanceRatio, maxDistance, oDistance]);
+  var touchEnd = (0, _react.useCallback)(function () {
+    setDropped(true);
+    if (sharedRef.current.startY && statusRef.current === 'active') {
+      handleLoadMore();
+    } else {
+      reset();
+    }
+  }, [handleLoadMore, reset]);
+  (0, _react.useEffect)(function () {
+    var wrapper = wrapperRef.current;
+    if (!wrapper || useFallback) return;
+    if (disabled) {
+      wrapper.removeEventListener('touchstart', touchStart);
+      wrapper.removeEventListener('touchmove', touchMove);
+      wrapper.removeEventListener('touchend', touchEnd);
+      wrapper.removeEventListener('touchcancel', touchEnd);
+    } else {
+      wrapper.addEventListener('touchstart', touchStart, passiveOpts);
+      wrapper.addEventListener('touchmove', touchMove, nonPassiveOpts);
+      wrapper.addEventListener('touchend', touchEnd);
+      wrapper.addEventListener('touchcancel', touchEnd);
+    }
+  }, [disabled, touchEnd, touchMove, useFallback]);
+  (0, _react.useEffect)(function () {
+    if (status === 'loading' && !useFallback) {
+      setContentStyle(loadingDistance);
+    }
+  }, [loadingDistance, status, useFallback]);
+  (0, _react.useImperativeHandle)(ref, function () {
+    return {
+      scrollTo: scrollTo,
+      scrollToEnd: scrollToEnd,
+      wrapperRef: wrapperRef
+    };
+  }, [scrollToEnd]);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "PullToRefresh",
+    ref: wrapperRef,
+    onScroll: onScroll
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "PullToRefresh-inner"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _clsx.default)('PullToRefresh-content', {
+      'PullToRefresh-transition': dropped
+    }),
+    ref: contentRef
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "PullToRefresh-indicator"
+  }, renderIndicator(status, distance)), !disabled && useFallback && /*#__PURE__*/_react.default.createElement(_Flex.Flex, {
+    className: "PullToRefresh-fallback",
+    center: true
+  }, renderIndicator(status, oDistance), /*#__PURE__*/_react.default.createElement(_Button.Button, {
+    className: "PullToRefresh-loadMore",
+    variant: "text",
+    onClick: handleLoadMore
+  }, loadMoreText)), _react.default.Children.only(children))));
+});

package/lib/components/QuickReplies/QuickReplies.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { QuickReplyItemProps } from './QuickReply';
+export interface QuickRepliesProps {
+    items: QuickReplyItemProps[];
+    visible?: boolean;
+    onClick: (item: QuickReplyItemProps, index: number) => void;
+    onScroll?: (event: React.UIEvent<HTMLDivElement, UIEvent>) => void;
+}
+declare const _default: React.MemoExoticComponent<(props: QuickRepliesProps) => React.JSX.Element | null>;
+export default _default;

package/lib/components/QuickReplies/QuickReplies.js

@@ -0,0 +1,59 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _ScrollView = require("../ScrollView/ScrollView");
+var _QuickReply = require("./QuickReply");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+var QuickReplies = function QuickReplies(props) {
+  var _props$items = props.items,
+    items = _props$items === void 0 ? [] : _props$items,
+    _props$visible = props.visible,
+    visible = _props$visible === void 0 ? true : _props$visible,
+    onClick = props.onClick,
+    onScroll = props.onScroll;
+  var scroller = (0, _react.useRef)(null);
+  var _useState = (0, _react.useState)(!!onScroll),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    scrollEvent = _useState2[0],
+    setScrollEvent = _useState2[1];
+  (0, _react.useLayoutEffect)(function () {
+    var timer;
+    if (scroller.current) {
+      setScrollEvent(false);
+      scroller.current.scrollTo({
+        x: 0
+      });
+      timer = setTimeout(function () {
+        setScrollEvent(true);
+      }, 500);
+    }
+    return function () {
+      clearTimeout(timer);
+    };
+  }, [items]);
+  if (!items.length) return null;
+  return /*#__PURE__*/_react.default.createElement(_ScrollView.ScrollView, {
+    className: "QuickReplies",
+    data: items,
+    itemKey: "name",
+    ref: scroller,
+    "data-visible": visible,
+    onScroll: scrollEvent ? onScroll : undefined,
+    renderItem: function renderItem(item, index) {
+      return /*#__PURE__*/_react.default.createElement(_QuickReply.QuickReply, {
+        item: item,
+        index: index,
+        onClick: onClick,
+        key: item.name
+      });
+    }
+  });
+};
+var _default = exports.default = /*#__PURE__*/_react.default.memo(QuickReplies);

package/lib/components/QuickReplies/QuickReply.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+export interface QuickReplyItemProps {
+    name: string;
+    code?: string;
+    icon?: string;
+    img?: string;
+    isNew?: boolean;
+    isHighlight?: boolean;
+}
+export interface QuickReplyProps {
+    item: QuickReplyItemProps;
+    index: number;
+    onClick: (item: QuickReplyItemProps, index: number) => void;
+}
+export declare const QuickReply: (props: QuickReplyProps) => React.JSX.Element;

package/lib/components/QuickReplies/QuickReply.js

@@ -0,0 +1,36 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.QuickReply = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _Icon = require("../Icon");
+var QuickReply = exports.QuickReply = function QuickReply(props) {
+  var item = props.item,
+    index = props.index,
+    onClick = props.onClick;
+  function handleClick() {
+    onClick(item, index);
+  }
+  return /*#__PURE__*/_react.default.createElement("button", {
+    className: (0, _clsx.default)('QuickReply', {
+      new: item.isNew,
+      highlight: item.isHighlight
+    }),
+    type: "button",
+    "data-code": item.code,
+    "aria-label": "\u5FEB\u6377\u77ED\u8BED: ".concat(item.name, "\uFF0C\u53CC\u51FB\u53D1\u9001"),
+    onClick: handleClick
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "QuickReply-inner"
+  }, item.icon && /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
+    type: item.icon
+  }), item.img && /*#__PURE__*/_react.default.createElement("img", {
+    className: "QuickReply-img",
+    src: item.img,
+    alt: ""
+  }), /*#__PURE__*/_react.default.createElement("span", null, item.name)));
+};

package/lib/components/QuickReplies/index.d.ts

@@ -0,0 +1,4 @@
+export { default as QuickReplies } from './QuickReplies';
+export type { QuickRepliesProps } from './QuickReplies';
+export { QuickReply } from './QuickReply';
+export type { QuickReplyProps, QuickReplyItemProps } from './QuickReply';

package/lib/components/QuickReplies/index.js

@@ -0,0 +1,20 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "QuickReplies", {
+  enumerable: true,
+  get: function get() {
+    return _QuickReplies.default;
+  }
+});
+Object.defineProperty(exports, "QuickReply", {
+  enumerable: true,
+  get: function get() {
+    return _QuickReply.QuickReply;
+  }
+});
+var _QuickReplies = _interopRequireDefault(require("./QuickReplies"));
+var _QuickReply = require("./QuickReply");

package/lib/components/Quote/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export interface QuoteProps {
+    className?: string;
+    author?: string;
+    children?: React.ReactNode;
+    onClick?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+}
+export declare const Quote: (props: QuoteProps) => React.JSX.Element;

package/lib/components/Quote/index.js

@@ -0,0 +1,23 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Quote = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var Quote = exports.Quote = function Quote(props) {
+  var className = props.className,
+    author = props.author,
+    children = props.children,
+    onClick = props.onClick;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _clsx.default)('Quote', className),
+    onClick: onClick
+  }, author && /*#__PURE__*/_react.default.createElement("div", {
+    className: "Quote-author"
+  }, author), /*#__PURE__*/_react.default.createElement("div", {
+    className: "Quote-content"
+  }, children));
+};

package/lib/components/Radio/Radio.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export type RadioValue = string | number | undefined;
+export type RadioProps = React.InputHTMLAttributes<HTMLInputElement> & {
+    value?: RadioValue;
+    label?: RadioValue;
+};
+export declare const Radio: (props: RadioProps) => React.JSX.Element;

package/lib/components/Radio/Radio.js

@@ -0,0 +1,34 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Radio = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _excluded = ["className", "label", "checked", "disabled", "onChange"];
+var Radio = exports.Radio = function Radio(props) {
+  var className = props.className,
+    label = props.label,
+    checked = props.checked,
+    disabled = props.disabled,
+    onChange = props.onChange,
+    other = (0, _objectWithoutProperties2.default)(props, _excluded);
+  return /*#__PURE__*/_react.default.createElement("label", {
+    className: (0, _clsx.default)('Radio', className, {
+      'Radio--checked': checked,
+      'Radio--disabled': disabled
+    })
+  }, /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({
+    type: "radio",
+    className: "Radio-input",
+    checked: checked,
+    disabled: disabled,
+    onChange: onChange
+  }, other)), /*#__PURE__*/_react.default.createElement("span", {
+    className: "Radio-text"
+  }, label));
+};

package/lib/components/Radio/RadioGroup.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { RadioProps, RadioValue } from './Radio';
+export type RadioGroupProps = {
+    className?: string;
+    options: RadioProps[];
+    value: RadioValue;
+    name?: string;
+    disabled?: boolean;
+    block?: boolean;
+    align?: 'left' | 'right';
+    maxPerRow?: number;
+    flex?: boolean;
+    onChange: (value: RadioValue, event: React.ChangeEvent<HTMLInputElement>) => void;
+};
+export declare const RadioGroup: (props: RadioGroupProps) => React.JSX.Element;