@titaui/pc 1.7.21 → 1.7.22

package/lib/components/cascader/index.css

@@ -16,39 +16,66 @@
   color: #3F4755;
 }
 
-.titaui-cascader .tu-icon-caret-down {
-  font-size: 16px;
-  transform: scale(0.5);
-}
-
-.rc-cascader-dropdown {
+.titaui-cascader-popup {
   z-index: 2000;
   box-shadow: 0px 4px 12px 0px rgba(127, 145, 180, 0.2);
   border: 1px solid #F0F2F5;
+  border-radius: 12px;
+  overflow: hidden;
 }
 
-.rc-cascader-menu {
+.titaui-cascader-popup .rc-cascader-menu {
   width: 139px;
   box-sizing: border-box;
   border: 1px solid #F0F2F5;
-  padding: 16px 6px;
+  padding: 16px 0 16px 6px;
+}
+
+.titaui-cascader-popup .rc-cascader-menu::-webkit-scrollbar {
+  width: 6px !important;
 }
 
-.rc-cascader-menu-item-active {
+.titaui-cascader-popup .rc-cascader-menu-item-active {
   background: unset;
   color: #2879ff;
 }
 
-.rc-cascader-menu-item {
+.titaui-cascader-popup .rc-cascader-menu-item {
   box-sizing: border-box;
   cursor: pointer;
   padding: 0 6px;
   height: 36px;
   align-items: center;
+  color: #3F4755;
 }
 
-.rc-cascader-menu-item:hover {
+.titaui-cascader-popup .rc-cascader-menu-item:hover {
   color: #2879ff;
   background: #F7F8FA;
   border-radius: 8px;
 }
+
+.titaui-cascader-popup .rc-cascader-menu-item-disabled {
+  opacity: 1;
+  cursor: auto;
+}
+
+.titaui-cascader-popup .rc-cascader-menu-item-disabled:hover {
+  color: #3F4755;
+  background: #FFFFFF;
+  border-radius: 8px;
+}
+
+.titaui-cascader-popup .rc-cascader-menu-item-expand-icon {
+  display: none;
+}
+
+.titaui-cascader .tu-icon-caret-down {
+  font-size: 16px;
+  transform: scale(0.5);
+}
+
+.titaui-cascader-time-popup .rc-cascader-menu {
+  width: 80px;
+  text-align: center;
+}

package/lib/components/cascader/index.js

@@ -11,11 +11,13 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _rcCascader = _interopRequireDefault(require("rc-cascader"));
 
+var _time = _interopRequireDefault(require("./time"));
+
 require("rc-cascader/assets/index.less");
 
 require("./index.css");
 
-var _excluded = ["value", "initText", "options", "onChange", "style", "placeholder", "splitSymbol"];
+var _excluded = ["value", "initText", "options", "onChange", "style", "placeholder", "splitSymbol", "popupClassName"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
@@ -57,6 +59,8 @@ var Cascader = function Cascader(_ref) {
       placeholder = _ref$placeholder === void 0 ? "请选择" : _ref$placeholder,
       _ref$splitSymbol = _ref.splitSymbol,
       splitSymbol = _ref$splitSymbol === void 0 ? "" : _ref$splitSymbol,
+      _ref$popupClassName = _ref.popupClassName,
+      popupClassName = _ref$popupClassName === void 0 ? "" : _ref$popupClassName,
       restProps = _objectWithoutProperties(_ref, _excluded);
 
   var _useState = (0, _react.useState)(value),
@@ -70,7 +74,6 @@ var Cascader = function Cascader(_ref) {
       setInputValue = _useState4[1];
 
   var handleChange = function handleChange(value, selectedOptions) {
-    console.log(value, selectedOptions);
     onChange && onChange(value, selectedOptions);
     setSelectValue(value);
     var str = selectedOptions.map(function (o) {
@@ -82,10 +85,11 @@ var Cascader = function Cascader(_ref) {
   (0, _react.useEffect)(function () {
     setSelectValue(value);
   }, [value]);
-  return /*#__PURE__*/_react["default"].createElement(_react.Fragment, null, /*#__PURE__*/_react["default"].createElement(_rcCascader["default"], _extends({
+  return /*#__PURE__*/_react["default"].createElement(_rcCascader["default"], _extends({
     options: options,
     onChange: handleChange,
-    value: selectValue
+    value: selectValue,
+    popupClassName: "".concat(preCls, "-popup ").concat(popupClassName)
   }, restProps), /*#__PURE__*/_react["default"].createElement("div", {
     className: preCls,
     style: style
@@ -93,8 +97,9 @@ var Cascader = function Cascader(_ref) {
     className: "".concat(preCls, "-text")
   }, inputValue ? inputValue : placeholder), /*#__PURE__*/_react["default"].createElement("span", {
     className: "tu-icon-caret-down"
-  }))));
+  })));
 };
 
+Cascader.TimeCascader = _time["default"];
 var _default = Cascader;
 exports["default"] = _default;

package/lib/components/cascader/time.js

@@ -0,0 +1,31 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _index = _interopRequireDefault(require("./index"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+var TimeCascader = function TimeCascader(_ref) {
+  var restProps = _extends({}, _ref);
+
+  return /*#__PURE__*/_react["default"].createElement(_react.Fragment, null, /*#__PURE__*/_react["default"].createElement(_index["default"], _extends({
+    popupClassName: ' titaui-cascader-time-popup'
+  }, restProps)));
+};
+
+var _default = TimeCascader;
+exports["default"] = _default;

package/lib/components/form/form-fields/group/index.js

@@ -26,12 +26,13 @@ var FieldGroup = function FieldGroup(props, ref) {
       label = _props$label === void 0 ? "" : _props$label,
       _props$direction = props.direction,
       direction = _props$direction === void 0 ? "vertical" : _props$direction,
+      className = props.className,
       children = props.children;
   (0, _react.useImperativeHandle)(ref, function () {
     return {};
   });
   return /*#__PURE__*/_react["default"].createElement("div", {
-    className: (0, _classnames["default"])(precls, "".concat(precls, "--").concat(direction))
+    className: (0, _classnames["default"])(precls, className, "".concat(precls, "--").concat(direction))
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: "".concat(precls, "__label")
   }, label), /*#__PURE__*/_react["default"].createElement("div", {

package/lib/components/scrollbar/index.js

@@ -13,19 +13,29 @@ var _simplebarReact = _interopRequireDefault(require("./simplebar-react"));
 
 require("./index.css");
 
+var _excluded = ["children", "style"];
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
 var preCls = 'titaui-scrollbar';
 
 var _default = function _default(props) {
   var children = props.children,
-      style = props.style; // @ts-ignore
+      style = props.style,
+      restProps = _objectWithoutProperties(props, _excluded); // @ts-ignore
+
 
-  return /*#__PURE__*/_react["default"].createElement(_simplebarReact["default"], {
+  return /*#__PURE__*/_react["default"].createElement(_simplebarReact["default"], _extends({
     className: (0, _classnames["default"])(preCls),
     timeout: 800,
     style: style
-  }, children);
+  }, restProps), children);
 };
 
 exports["default"] = _default;

package/lib/components/select-tags/index.css

@@ -1,35 +1,39 @@
-.titaui-select .rc-select-single:not(.rc-select-customize-input) .rc-select-selector {
+.titaui-select-tags {
+  display: flex;
+}
+
+.titaui-select-tags .rc-select-single:not(.rc-select-customize-input) .rc-select-selector {
   border: 1px solid #DFE3EA;
 }
 
-.titaui-select .rc-select-focused .rc-select-selector {
+.titaui-select-tags .rc-select-focused .rc-select-selector {
   border: 1px solid #DFE3EA !important;
 }
 
-.titaui-select .rc-select-selection-item-remove {
+.titaui-select-tags .rc-select-selection-item-remove {
   display: flex;
   align-items: center;
 }
 
-.titaui-select .rc-select-multiple .rc-select-selector .rc-select-selection-search-input {
+.titaui-select-tags .rc-select-multiple .rc-select-selector .rc-select-selection-search-input {
   display: none;
 }
 
-.titaui-select .rc-select-single:not(.rc-select-customize-input) .rc-select-selector .rc-select-selection-search-input {
+.titaui-select-tags .rc-select-single:not(.rc-select-customize-input) .rc-select-selector .rc-select-selection-search-input {
   display: none;
 }
 
-.titaui-select .rc-select-single .rc-select-selector .rc-select-selection-item,
-.titaui-select .rc-select-single .rc-select-selector .rc-select-selection-placeholder {
+.titaui-select-tags .rc-select-single .rc-select-selector .rc-select-selection-item,
+  .titaui-select-tags .rc-select-single .rc-select-selector .rc-select-selection-placeholder {
   top: unset;
   left: 12px;
 }
 
-.titaui-select .rc-select-single .rc-select-selector {
+.titaui-select-tags .rc-select-single .rc-select-selector {
   align-items: center;
 }
 
-.titaui-select .rc-select-selector {
+.titaui-select-tags .rc-select-selector {
   cursor: pointer;
   padding: 0 12px;
   background: #FFFFFF;
@@ -39,30 +43,30 @@
   box-sizing: border-box;
 }
 
-.titaui-select .rc-select-multiple .rc-select-selector {
+.titaui-select-tags .rc-select-multiple .rc-select-selector {
   height: unset;
   padding: 7px 12px 0;
   border: 1px solid #DFE3EA;
 }
 
-.titaui-select .rc-select-multiple .rc-select-selector .rc-select-selection-overflow-item {
+.titaui-select-tags .rc-select-multiple .rc-select-selector .rc-select-selection-overflow-item {
   display: flex;
   align-items: center;
   margin-bottom: 7px;
 }
 
-.titaui-select .rc-select-multiple .rc-select-selector .rc-select-selection-placeholder {
+.titaui-select-tags .rc-select-multiple .rc-select-selector .rc-select-selection-placeholder {
   line-height: 1;
   margin-bottom: 7px;
   position: relative;
   top: -2px;
 }
 
-.titaui-select .rc-select-selection-item-content {
+.titaui-select-tags .rc-select-selection-item-content {
   margin-right: 8px;
 }
 
-.titaui-select .rc-select-multiple .rc-select-selector .rc-select-selection-item {
+.titaui-select-tags .rc-select-multiple .rc-select-selector .rc-select-selection-item {
   font-size: 12px;
   flex: none;
   height: 20px;
@@ -74,24 +78,24 @@
   padding: 0 5px 0 10px;
 }
 
-.titaui-select .rc-select-multiple .rc-select-selector .rc-select-selection-item .tu-icon-cross {
+.titaui-select-tags .rc-select-multiple .rc-select-selector .rc-select-selection-item .tu-icon-cross {
   cursor: pointer;
   color: #a4acB9;
   font-size: 14px;
 }
 
-.titaui-select .titaui-select-noborder .rc-select-selector {
+.titaui-select-tags .titaui-select-noborder .rc-select-selector {
   border: none !important;
   height: 22px;
   line-height: 1;
 }
 
-.titaui-select .rc-select-arrow {
+.titaui-select-tags .rc-select-arrow {
   font-size: 16px;
   transform: scale(0.5);
 }
 
-.titaui-select .rc-select-show-arrow .rc-select-arrow {
+.titaui-select-tags .rc-select-show-arrow .rc-select-arrow {
   top: 0;
   bottom: 0;
   margin: auto;

package/lib/components/select-tags/index.js

@@ -45,7 +45,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-var preCls = "titaui-select";
+var preCls = "titaui-select-tags";
 
 var SelectTags = function SelectTags(_ref) {
   var _ref$selected = _ref.selected,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@titaui/pc",
-  "version": "1.7.21",
+  "version": "1.7.22",
   "nameCN": "",
   "description": "",
   "main": "src/index.js",

package/src/components/cascader/index.scss

@@ -13,37 +13,60 @@
     font-size: 14px;
     color: #3F4755;
   }
+  &-popup{
+    z-index: 2000;
+    box-shadow: 0px 4px 12px 0px rgba(127, 145, 180, 0.2);
+    border: 1px solid #F0F2F5;
+    border-radius: 12px;
+    overflow: hidden;
+    .rc-cascader-menu{
+      width: 139px;
+      box-sizing: border-box;
+      border: 1px solid #F0F2F5;
+      padding: 16px 0 16px 6px;
+      &::-webkit-scrollbar{
+        width: 6px !important;
+      }
+    
+    }
+    .rc-cascader-menu-item-active{
+      background: unset;
+      color: #2879ff;
+    }
+    .rc-cascader-menu-item{
+      box-sizing: border-box;
+      cursor: pointer;
+      padding: 0 6px;
+      height: 36px;
+      align-items: center;
+      color: #3F4755;
+      &:hover{
+        color: #2879ff;
+        background: #F7F8FA;
+        border-radius: 8px;
+      }
+    }
+    .rc-cascader-menu-item-disabled{
+      opacity:1;
+      cursor: auto;
+      &:hover{
+        color: #3F4755;
+        background: #FFFFFF;
+        border-radius: 8px;
+      }
+    }
+    .rc-cascader-menu-item-expand-icon{
+      display: none;
+    }
+  }
   .tu-icon-caret-down{
     font-size: 16px;
     transform: scale(0.5);
   }
 }
-.rc-cascader-dropdown{
-  z-index: 2000;
-  box-shadow: 0px 4px 12px 0px rgba(127, 145, 180, 0.2);
-  border: 1px solid #F0F2F5;
-
-}
-.rc-cascader-menu{
-  width: 139px;
-  box-sizing: border-box;
-  border: 1px solid #F0F2F5;
-  padding: 16px 6px;
-
-}
-.rc-cascader-menu-item-active{
-  background: unset;
-  color: #2879ff;
-}
-.rc-cascader-menu-item{
-  box-sizing: border-box;
-  cursor: pointer;
-  padding: 0 6px;
-  height: 36px;
-  align-items: center;
-  &:hover{
-    color: #2879ff;
-    background: #F7F8FA;
-    border-radius: 8px;
+.titaui-cascader-time-popup{
+  .rc-cascader-menu{
+    width: 80px;
+    text-align: center;
   }
 }

package/src/components/cascader/index.tsx

@@ -1,5 +1,6 @@
-import React, { useState, useEffect, Fragment, useRef } from "react";
+import React, { useState, useEffect } from "react";
 import Rccascader from "rc-cascader";
+import TimeCascader from "./time";
 import "rc-cascader/assets/index.less";
 import "./index.scss";
 
@@ -10,6 +11,7 @@ interface Props {
   placeholder?: any;
   initText?: any; //想要默认值输入框的值就传进来，不要问组件里为什么不做这个事情，优化算法
   style?: any;
+  popupClassName?: any;
   splitSymbol?: string;
 }
 
@@ -23,13 +25,13 @@ const Cascader = ({
   style = { width: "100px" },
   placeholder = "请选择",
   splitSymbol = "",
+  popupClassName = "",
   ...restProps
 }: Props) => {
   const [selectValue, setSelectValue] = useState(value);
   const [inputValue, setInputValue] = useState(initText);
 
   const handleChange = (value, selectedOptions) => {
-    console.log(value, selectedOptions);
     onChange && onChange(value, selectedOptions);
     setSelectValue(value);
     let str = selectedOptions.map((o) => o.label).join(splitSymbol);
@@ -41,22 +43,22 @@ const Cascader = ({
   }, [value]);
 
   return (
-    <Fragment>
-      <Rccascader
-        options={options}
-        onChange={handleChange}
-        value={selectValue}
-        {...restProps}
-      >
-        <div className={preCls} style={style}>
-          <div className={`${preCls}-text`}>
-            {inputValue ? inputValue : placeholder}
-          </div>
-          <span className="tu-icon-caret-down" />
+    <Rccascader
+      options={options}
+      onChange={handleChange}
+      value={selectValue}
+      popupClassName={`${preCls}-popup ${popupClassName}`}
+      {...restProps}
+    >
+      <div className={preCls} style={style}>
+        <div className={`${preCls}-text`}>
+          {inputValue ? inputValue : placeholder}
         </div>
-      </Rccascader>
-    </Fragment>
+        <span className="tu-icon-caret-down" />
+      </div>
+    </Rccascader>
   );
 };
 
+Cascader.TimeCascader = TimeCascader;
 export default Cascader;

package/src/components/cascader/time.js

@@ -0,0 +1,13 @@
+import React, { FC,Fragment } from "react";
+import Cascader from './index'
+
+const TimeCascader = ({...restProps})=>{
+  return <Fragment>
+    <Cascader
+      popupClassName={' titaui-cascader-time-popup'}
+      {...restProps}
+    />
+  </Fragment>
+}
+
+export default TimeCascader

package/src/components/form/form-fields/group/index.tsx

@@ -11,6 +11,7 @@ interface IProps {
   require?: boolean;
   width?: number;
   children?: ReactElement;
+  className?: any;
   direction?: "horizontal" | "vertical";
 }
 
@@ -18,15 +19,14 @@ const FieldGroup = (props: IProps, ref) => {
   const {
     label = "",
     direction = "vertical",
-    // onChange,
-    // values,
+    className,
     children,
   } = props;
 
   useImperativeHandle(ref, () => ({}));
 
   return (
-    <div className={classNames(precls, `${precls}--${direction}`)}>
+    <div className={classNames(precls,className, `${precls}--${direction}`)}>
       <div className={`${precls}__label`}>{label}</div>
       <div className={`${precls}__content`}>
         {React.Children.map(children, (child) => {

package/src/components/scrollbar/index.tsx

@@ -11,13 +11,14 @@ interface Props {
 }
 
 export default (props: Props) => {
-  const { children, style } = props;
+  const { children, style,...restProps } = props;
 
   // @ts-ignore
   return <SimpleBar
     className={classNames(preCls)}
     timeout={800}
     style={style}
+    {...restProps}
   >
     {children}
   </SimpleBar>

package/src/components/select-tags/index.scss

@@ -1,4 +1,5 @@
-.titaui-select {
+.titaui-select-tags {
+  display: flex;
   .rc-select-single:not(.rc-select-customize-input) .rc-select-selector {
     border: 1px solid #DFE3EA;
   }

package/src/components/select-tags/index.tsx

@@ -22,7 +22,7 @@ interface Props {
   suffix?:string;
 }
 
-const preCls = "titaui-select";
+const preCls = "titaui-select-tags";
 
 const SelectTags: FC<Props> = ({
   selected = [],