dtable-ui-component 6.0.24-beta1 → 6.0.25

package/lib/Radio/index.css

@@ -0,0 +1,90 @@
+.am-radio {
+  position: relative;
+  display: inline-block;
+  vertical-align: middle;
+  width: 15px;
+  height: 15px;
+}
+
+.am-radio-inner {
+  position: absolute;
+  right: 0;
+  width: 15px;
+  height: 15px;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+  -webkit-transform: rotate(0deg);
+  -ms-transform: rotate(0deg);
+  transform: rotate(0deg);
+}
+
+.am-radio-inner:after {
+  position: absolute;
+  display: none;
+  top: -2.5px;
+  right: 5px;
+  z-index: 999;
+  width: 7px;
+  height: 14px;
+  border-style: solid;
+  border-width: 0 1.5px 1.5px 0;
+  content: '\0020';
+  -webkit-transform: rotate(45deg);
+  -ms-transform: rotate(45deg);
+  transform: rotate(45deg);
+}
+
+.am-radio-input {
+  position: absolute;
+  top: 0;
+  left: 0;
+  opacity: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 2;
+  border: 0 none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+
+.am-radio.am-radio-checked .am-radio-inner {
+  border-width: 0;
+}
+
+.am-radio.am-radio-checked .am-radio-inner:after {
+  display: block;
+  border-color: #108ee9;
+}
+
+.am-radio.am-radio-disabled.am-radio-checked .am-radio-inner:after {
+  display: block;
+  border-color: #bbb;
+}
+
+.am-list .am-list-item.am-radio-item .am-list-line .am-list-extra {
+  -webkit-box-flex: 0;
+  -webkit-flex: 0;
+  -ms-flex: 0;
+  flex: 0;
+}
+
+.am-list .am-list-item.am-radio-item .am-list-line .am-list-extra .am-radio {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  width: 100%;
+  height: 44px;
+  overflow: visible;
+}
+
+.am-list .am-list-item.am-radio-item .am-list-line .am-list-extra .am-radio-inner {
+  right: 15px;
+  top: 15px;
+}
+
+.am-list .am-list-item.am-radio-item.am-radio-item-disabled .am-list-content {
+  color: #bbb;
+}

package/lib/Radio/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _Radio = _interopRequireDefault(require("./Radio"));
+var _RadioItem = _interopRequireDefault(require("./RadioItem"));
+require("./index.css");
+_Radio.default.RadioItem = _RadioItem.default;
+var _default = exports.default = _Radio.default;

package/lib/TabBar/Tab.js

@@ -0,0 +1,76 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _Badge = _interopRequireDefault(require("../Badge"));
+class Tab extends React.PureComponent {
+  constructor() {
+    super(...arguments);
+    this.renderIcon = () => {
+      const {
+        dot,
+        badge,
+        selected,
+        selectedIcon,
+        icon,
+        title,
+        prefixCls
+      } = this.props;
+      const iconRes = selected ? selectedIcon : icon;
+      const iconDom = /*#__PURE__*/React.isValidElement(iconRes) ? iconRes : /*#__PURE__*/React.createElement("img", {
+        className: "".concat(prefixCls, "-image"),
+        src: iconRes ? iconRes.uri : iconRes,
+        alt: title
+      });
+      if (badge) {
+        return /*#__PURE__*/React.createElement(_Badge.default, {
+          text: badge,
+          className: "".concat(prefixCls, "-badge tab-badge")
+        }, ' ', iconDom, ' ');
+      }
+      if (dot) {
+        return /*#__PURE__*/React.createElement(_Badge.default, {
+          dot: true,
+          className: "".concat(prefixCls, "-badge tab-dot")
+        }, iconDom);
+      }
+      return iconDom;
+    };
+    this.onClick = () => {
+      const onClick = this.props.onClick;
+      if (onClick) {
+        onClick();
+      }
+    };
+  }
+  render() {
+    const {
+      title,
+      prefixCls,
+      selected,
+      unselectedTintColor,
+      tintColor
+    } = this.props;
+    const iconColor = selected ? tintColor : unselectedTintColor;
+    return /*#__PURE__*/React.createElement("div", Object.assign({}, this.props.dataAttrs, {
+      onClick: this.onClick,
+      className: "".concat(prefixCls)
+    }), /*#__PURE__*/React.createElement("div", {
+      className: "".concat(prefixCls, "-icon"),
+      style: {
+        color: iconColor
+      }
+    }, this.renderIcon()), /*#__PURE__*/React.createElement("p", {
+      className: "".concat(prefixCls, "-title"),
+      style: {
+        color: selected ? tintColor : unselectedTintColor
+      }
+    }, title));
+  }
+}
+var _default = exports.default = Tab;

package/lib/TabBar/index.css

@@ -0,0 +1,138 @@
+.am-tab-bar {
+  height: 100%;
+  overflow: hidden;
+}
+
+.am-tab-bar-bar {
+  position: relative;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+  height: 50px;
+  border-top: 1PX solid #ddd;
+  width: 100%;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-transition-duration: .2s;
+  transition-duration: .2s;
+  -webkit-transition-property: height bottom;
+  transition-property: height bottom;
+  z-index: 100;
+  -webkit-justify-content: space-around;
+  -ms-flex-pack: distribute;
+  justify-content: space-around;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  bottom: 0;
+}
+
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
+  html:not([data-scale]) .am-tab-bar-bar {
+    border-top: none;
+  }
+
+  html:not([data-scale]) .am-tab-bar-bar::before {
+    content: '';
+    position: absolute;
+    background-color: #ddd;
+    display: block;
+    z-index: 1;
+    top: 0;
+    right: auto;
+    bottom: auto;
+    left: 0;
+    width: 100%;
+    height: 1PX;
+    -webkit-transform-origin: 50% 50%;
+    -ms-transform-origin: 50% 50%;
+    transform-origin: 50% 50%;
+    -webkit-transform: scaleY(0.5);
+    -ms-transform: scaleY(0.5);
+    transform: scaleY(0.5);
+  }
+}
+
+@media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) {
+  html:not([data-scale]) .am-tab-bar-bar::before {
+    -webkit-transform: scaleY(0.33);
+    -ms-transform: scaleY(0.33);
+    transform: scaleY(0.33);
+  }
+}
+
+.am-tab-bar-bar-hidden-top {
+  bottom: 50px;
+  height: 0;
+}
+
+.am-tab-bar-bar-hidden-bottom {
+  bottom: -50px;
+  height: 0;
+}
+
+.am-tab-bar-bar .am-tab-bar-tab {
+  -webkit-box-flex: 1;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  text-align: center;
+  width: 100%;
+}
+
+.am-tab-bar-bar .am-tab-bar-tab-image {
+  width: 22px;
+  height: 22px;
+  vertical-align: middle;
+}
+
+.am-tab-bar-bar .am-tab-bar-tab-title {
+  font-size: 10px;
+  margin: 3px 0 0 0;
+  line-height: 1;
+  text-align: center;
+}
+
+.am-tab-bar-bar .am-tab-bar-tab-icon {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+}
+
+.am-tab-bar-bar .am-tab-bar-tab-icon .tab-badge :last-child {
+  margin-top: 4px;
+  left: 22px;
+}
+
+.am-tab-bar-bar .am-tab-bar-tab-icon .tab-dot :last-child {
+  margin-top: 4px;
+  left: 22px;
+}
+
+.am-tab-bar-item {
+  height: 100%;
+}

package/lib/TabBar/index.js

@@ -0,0 +1,128 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Item = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _getDataAttr = _interopRequireDefault(require("../_util/getDataAttr"));
+var _Tabs = _interopRequireDefault(require("../Tabs"));
+var _Tab = _interopRequireDefault(require("./Tab"));
+class Item extends React.Component {
+  render() {
+    const {
+      prefixCls,
+      style
+    } = this.props;
+    return /*#__PURE__*/React.createElement("div", {
+      className: prefixCls,
+      style: style
+    }, this.props.children);
+  }
+}
+exports.Item = Item;
+Item.defaultProps = {
+  prefixCls: 'am-tab-bar-item',
+  title: ''
+};
+class AntTabBar extends React.Component {
+  constructor() {
+    super(...arguments);
+    this.getTabs = () => {
+      const tabs = [];
+      React.Children.forEach(this.props.children, c => {
+        if (c) {
+          tabs.push({
+            ...c.props
+          });
+        }
+      });
+      return tabs;
+    };
+    this.renderTabBar = () => {
+      const {
+        barTintColor,
+        prefixCls,
+        tintColor,
+        unselectedTintColor,
+        hidden,
+        tabBarPosition
+      } = this.props;
+      const tabsData = this.getTabs();
+      const content = Array.isArray(tabsData) ? tabsData.map((cProps, index) => {
+        return /*#__PURE__*/React.createElement(_Tab.default, {
+          key: index,
+          prefixCls: "".concat(this.props.prefixCls, "-tab"),
+          badge: cProps.badge,
+          dot: cProps.dot,
+          selected: cProps.selected,
+          icon: cProps.icon,
+          selectedIcon: cProps.selectedIcon,
+          title: cProps.title,
+          tintColor: tintColor,
+          unselectedTintColor: unselectedTintColor,
+          dataAttrs: (0, _getDataAttr.default)(cProps),
+          onClick: () => cProps.onPress && cProps.onPress()
+        });
+      }) : null;
+      let cls = "".concat(prefixCls, "-bar");
+      if (hidden) {
+        cls += " ".concat(prefixCls, "-bar-hidden-").concat(tabBarPosition);
+      }
+      return /*#__PURE__*/React.createElement("div", {
+        className: cls,
+        style: {
+          backgroundColor: barTintColor
+        }
+      }, content);
+    };
+  }
+  render() {
+    const {
+      prefixCls,
+      children,
+      animated,
+      swipeable,
+      noRenderContent,
+      prerenderingSiblingsNumber,
+      tabBarPosition
+    } = this.props;
+    const tabs = this.getTabs();
+    let activeIndex = 0;
+    if (Array.isArray(tabs)) {
+      tabs.forEach((tab, index) => {
+        if (tab.selected) {
+          activeIndex = index;
+        }
+      });
+    }
+    return /*#__PURE__*/React.createElement("div", {
+      className: prefixCls
+    }, /*#__PURE__*/React.createElement(_Tabs.default, {
+      tabs: tabs,
+      renderTabBar: this.renderTabBar,
+      tabBarPosition: tabBarPosition,
+      page: activeIndex < 0 ? undefined : activeIndex,
+      animated: animated,
+      swipeable: swipeable,
+      noRenderContent: noRenderContent,
+      prerenderingSiblingsNumber: prerenderingSiblingsNumber
+    }, children));
+  }
+}
+AntTabBar.defaultProps = {
+  prefixCls: 'am-tab-bar',
+  barTintColor: 'white',
+  tintColor: '#108ee9',
+  hidden: false,
+  unselectedTintColor: '#888',
+  placeholder: '正在加载',
+  animated: false,
+  swipeable: false,
+  prerenderingSiblingsNumber: 1,
+  tabBarPosition: 'bottom'
+};
+AntTabBar.Item = Item;
+var _default = exports.default = AntTabBar;