shineout 1.10.5 → 1.10.8-beta.1

package/css/Button/Button.js

@@ -31,6 +31,8 @@ var _styles = require("./styles");
 
 var _config = require("../config");
 
+var _classname = _interopRequireDefault(require("../utils/classname"));
+
 var Button =
 /*#__PURE__*/
 function (_PureComponent) {
@@ -102,7 +104,7 @@ function (_PureComponent) {
         type: htmlType,
         className: className
       }), loading && _react.default.createElement("span", {
-        className: (0, _styles.buttonClass)('spin')
+        className: (0, _styles.buttonClass)((0, _classname.default)('spin'))
       }, _react.default.createElement(_Spin.default, {
         size: 12,
         name: "ring",

package/css/Button/styles/button.css

@@ -27,10 +27,10 @@
 .so-button-spin {
   display: inline-block;
 }
-.so-button-spin:not(.so-button-rtl *) {
+.so-button-spin-ltr {
   margin-right: var(--button-spin-margin, 8px);
 }
-.so-button-rtl .so-button-spin {
+.so-button-spin-rtl {
   margin-left: var(--button-spin-margin, 8px);
 }
 .so-button:hover,

package/css/Card/index.d.ts

@@ -1,122 +1,168 @@
 import * as React from 'react'
 import { ButtonProps } from '../Button/index'
 import { RegularAttributes, StandardProps } from '../@types/common'
+import { ReactNode } from "react"
 
 export interface CardProps extends StandardProps {
 
   /**
    * Whether can be collapsed，'bottom' can collaps on bottom
-   * 
+   *
    * 是否可折叠，'bottom' 表示从下方点击折叠
-   * 
+   *
    * default: false
    */
   collapsible?: boolean | 'bottom';
 
   /**
    * Whether to be collapsed.
-   * 
+   *
    * 是否折叠，用于受控状态
-   * 
+   *
    * default: -
    */
   collapsed?: boolean;
 
   /**
    * Initial collapsed state
-   * 
+   *
    * 初始折叠状态（仅在 collapsible 为 true 时有效）
-   * 
+   *
    * default: true
    */
   defaultCollapsed?: boolean;
 
   /**
    * Callback when collapsed state changed
-   * 
+   *
    * 折叠状态改变时回调事件
-   * 
+   *
    * default: -
    */
   onCollapse?: () => void;
 
   /**
    * Whether to show the shadow.'hover' - Display it when the mouse is over the element.true - Always show, false - Never show
-   * 
+   *
    * 是否显示阴影。'hover' - 鼠标移到元素上显示。true - 总是显示, false - 从不显示
-   * 
+   *
    * default: false
    */
   shadow?: true | false | 'hover';
 
   /**
    * Card.Accordion expand controlled key
-   * 
+   *
    * 手风琴下控制展开的值
-   * 
+   *
    * default: none
    */
   id?: any;
 
+  /**
+   * children
+   *
+   * 子元素
+   *
+   * default: -
+   */
+  children?: ReactNode;
+
+
 }
 
 export interface CardHeaderProps extends StandardProps {
 
   /**
    * align
-   * 
+   *
    * 对齐方式
-   * 
+   *
    * default: none
    */
   align?: RegularAttributes.Align;
 
+  /**
+   * children
+   *
+   * 子元素
+   *
+   * default: -
+   */
+  children?: ReactNode;
+
 }
 
-export interface CardBodyProps extends StandardProps {}
+export interface CardBodyProps extends StandardProps {
+  /**
+   * children
+   *
+   * 子元素
+   *
+   * default: -
+   */
+  children?: ReactNode;
+}
 
 export interface CardFooterProps extends StandardProps {
 
   /**
    * align
-   * 
+   *
    * 对齐方式
-   * 
+   *
    * default: none
    */
   align?: RegularAttributes.Align;
 
+  /**
+   * children
+   *
+   * 子元素
+   *
+   * default: none
+   */
+  children?: ReactNode;
+
 }
 
 export interface CardAccordionProps<T> {
 
   /**
    * Active value. It is -1 when fully closed. Used in controlled state. be id while Card.id setted
-   * 
+   *
    * 打开的值，全关闭时为 null，用于受控状态。默认为索引，若Card设置id后则为id。
-   * 
+   *
    * default: none
    */
   active?: T;
 
   /**
    * The default active value for uncontrolled state, be id while Card.id setted
-   * 
+   *
    * 默认打开的值，用于非受控状态。默认为索引，若Card设置id后则为id。
-   * 
+   *
    * default: 0
    */
   defaultActive?: T;
 
   /**
    * The callback function when the panel is opened
-   * 
+   *
    * 面板打开回调
-   * 
+   *
    * default: none
    */
   onChange?: () => void;
 
+  /**
+   * children
+   *
+   * 子元素
+   *
+   * default: none
+   */
+  children?: ReactNode;
 }
 
 export interface CardSubmitProps extends ButtonProps {

package/css/CardGroup/index.d.ts

@@ -8,36 +8,36 @@ export interface CardGroupProps extends StandardProps {
 
   /**
    * group height
-   * 
+   *
    * 卡片组高度
-   * 
+   *
    * default: none
    */
   height?: number;
-  
+
   /**
    * card min width
    *
-   * 卡片最小宽度 
-   * 
+   * 卡片最小宽度
+   *
    * default: none
    */
   cardWidth?: number;
 
   /**
    * items count each row, not work while cardWidth setted
-   * 
+   *
    * 列数，设置 cardWidth 后该属性将失效
-   * 
+   *
    * default: 3
    */
   columns?: number;
 
   /**
    * grid style
-   * 
+   *
    * 卡片网格样式
-   * 
+   *
    * default: none
    */
   gridStyle?: React.CSSProperties;
@@ -45,71 +45,89 @@ export interface CardGroupProps extends StandardProps {
 
   /**
    * gutter width horizontal and vertical, if diff shoud set gridStyle
-   * 
+   *
    * 卡片横向纵向间距，如果两个间距相互独立可以通过 gridStyle 调整
-   * 
+   *
    * default: 16
    */
   gutter?: number;
+
+  /**
+   * children
+   *
+   * 子元素
+   *
+   * default: -
+   */
+  children?: ReactNode;
 }
 
 
 export interface CardGroupItemProps<T> extends StandardProps {
-  
+
     /**
      * desc: lazy load placeholder, enable lazy load while set
-     * 
+     *
      * 懒加载占位元素，设置后卡片将开启懒加载
-     * 
+     *
      * default: none
      */
     placeholder?: ReactNode;
-  
+
     /**
      * desc: checked status, hide while not set
-     * 
+     *
      * checked 表示选中状态，不设置则不显示选择框
-     * 
+     *
      * default: -
      */
     checked?: boolean | undefined;
-  
+
     /**
      * desc: disable checkbox
-     * 
+     *
      * 是否禁用选择框
-     * 
+     *
      * default: false
      */
     disabled?: boolean;
-  
+
     /**
      * desc: Specifies the result
-     * 
+     *
      * 选中时返回值
-     * 
+     *
      * default: true
      */
     value?: T;
-  
+
     /**
      * desc: check changed, value is the value props
-     * 
+     *
      * 选中状态变化事件，checked表示选中状态，value代表对应的值
-     * 
+     *
      * default: -
      */
     onChange?: (checked: boolean, value: T) => void;
-  
+
+    /**
+     * children
+     *
+     * 子元素
+     *
+     * default: -
+     */
+    children?: ReactNode;
+
 }
 
 
-declare class CardGroupItem<T = any> extends React.Component<CardGroupItemProps<T>, {}> { 
+declare class CardGroupItem<T = any> extends React.Component<CardGroupItemProps<T>, {}> {
   render(): JSX.Element;
 }
 
 
-declare class CardGroup extends React.Component<CardGroupProps, {}> { 
+declare class CardGroup extends React.Component<CardGroupProps, {}> {
   static Item: typeof CardGroupItem
 
   render(): JSX.Element;

package/css/Carousel/index.d.ts

@@ -7,48 +7,57 @@ export interface CarouselProps extends StandardProps {
 
     /**
      * animation effects, options: <br />slide - horizontal sliding<br />slide-y - vertical sliding<br />fade - fading
-     * 
+     *
      * 动画效果，可选值为 slide - 横向滑动 ，slide-y - 垂直滑动 ，fade - 淡入淡出
-     * 
+     *
      * default: 'slide'
      */
      animation?: string;
-  
+
      /**
       * the position of indicator
-      * 
+      *
       * 指示标示位置
-      * 
+      *
       * default: 'center'
       */
      indicatorPosition?: 'left' | 'center' | 'right';
-   
+
      /**
       * the style of indicator, string options: ['circle', 'number', 'line'], using function for custom styles
-      * 
+      *
       * 指示标示样式，字符串可以是：['circle', 'number', 'line']，函数则可以自定义样式: (current, moveTo) => (<Component />)
-      * 
+      *
       * default: 'circle'
       */
      indicatorType?: ((current: number, moveTo: () => void) => ReactNode) | string;
-   
+
      /**
       * the interval of animation, When it is not 0, play automatically
-      * 
+      *
       * 动画间隔时间，为 0 时，不自动播放
-      * 
+      *
       * default: 0
       */
      interval?: number;
 
      /**
       * move callback
-      * 
+      *
       * 轮播后的回调
-      * 
+      *
       * default: none
       */
      onMove?: (current: number, extra: { prev: number, direction: 'forward' | 'backward', moveTo: (n: number) => void}) => void;
+
+    /**
+     * children
+     *
+     * 子元素
+     *
+     * default: -
+     */
+    children?: ReactNode;
 }
 
 
@@ -56,4 +65,4 @@ declare class Carousel extends React.Component<CarouselProps> {
   render(): JSX.Element
 }
 
-export default Carousel
+export default Carousel

package/css/Cascader/List.js

@@ -25,6 +25,8 @@ var _Node = _interopRequireDefault(require("./Node"));
 
 var _locale = require("../locale");
 
+var _classname = require("../utils/classname");
+
 var List =
 /*#__PURE__*/
 function (_Component) {
@@ -64,7 +66,7 @@ function (_Component) {
       className: (0, _styles.cascaderClass)('no-data')
     }, this.getText('noData'));
     return _react.default.createElement("div", {
-      className: (0, _styles.cascaderClass)('list')
+      className: (0, _styles.cascaderClass)((0, _classname.getDirectionClass)('list'))
     }, data.map(function (d, i) {
       var id = _this2.getKey(d, i);
 

package/css/Cascader/Node.js

@@ -15,6 +15,8 @@ var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
+var _classname = require("../utils/classname");
+
 var _component = require("../component");
 
 var _Checkbox = _interopRequireDefault(require("../Checkbox"));
@@ -161,7 +163,7 @@ function (_PureComponent) {
     }
 
     var caret = _react.default.createElement("span", {
-      className: (0, _styles.cascaderClass)('caret')
+      className: (0, _styles.cascaderClass)((0, _classname.getDirectionClass)('caret'))
     }, _react.default.createElement(_Caret.default, null));
 
     if ((0, _config.isRTL)() && checkBoxStyle.marginRight !== 0) {

package/css/Cascader/Result.js

@@ -41,6 +41,8 @@ var _types = require("../Datum/types");
 
 var _Caret = _interopRequireDefault(require("../icons/Caret"));
 
+var _classname = require("../utils/classname");
+
 // eslint-disable-next-line react/prop-types
 function Item(_ref) {
   var children = _ref.children,
@@ -59,10 +61,10 @@ function Item(_ref) {
   } : undefined;
   return _react.default.createElement("a", {
     tabIndex: -1,
-    className: (0, _classnames.default)((0, _styles3.cascaderClass)('item', only && 'item-only'), className),
+    className: (0, _classnames.default)((0, _styles3.cascaderClass)((0, _classname.getDirectionClass)('item'), only && 'item-only'), className),
     onClick: onClick
   }, children, singleRemove && _react.default.createElement("span", {
-    className: (0, _styles3.cascaderClass)('single-remove'),
+    className: (0, _styles3.cascaderClass)((0, _classname.getDirectionClass)('single-remove')),
     onClick: onClose
   }, _icons.default.Close));
 }
@@ -170,7 +172,7 @@ function (_PureComponent) {
     var _this2 = this;
 
     var singleRemove = this.props.singleRemove;
-    var removeContainerClassName = (0, _styles3.cascaderClass)(singleRemove && 'remove-container');
+    var removeContainerClassName = (0, _styles3.cascaderClass)(singleRemove && (0, _classname.getDirectionClass)('remove-container'));
     return nodes.map(function (n, i) {
       return _this2.renderItem({
         className: removeContainerClassName,
@@ -207,7 +209,7 @@ function (_PureComponent) {
         value = _this$props2.value,
         disabled = _this$props2.disabled,
         onClear = _this$props2.onClear;
-    var className = (0, _classnames.default)((0, _styles2.selectClass)('indicator', 'close'), (0, _styles3.cascaderClass)('close'));
+    var className = (0, _classnames.default)((0, _styles2.selectClass)('indicator', 'close'), (0, _styles3.cascaderClass)((0, _classname.getDirectionClass)('close')));
 
     if (clearable && value.length > 0 && !disabled) {
       /* eslint-disable */
@@ -230,7 +232,6 @@ function (_PureComponent) {
         className = _ref3.className,
         options = (0, _objectWithoutPropertiesLoose2.default)(_ref3, ["index", "render", "data", "raw", "className"]);
     var singleRemove = this.props.singleRemove;
-    var itemClassName = (0, _classnames.default)(className, (0, _styles3.cascaderClass)(singleRemove && 'remove-container'));
     var res = data && render(data, raw);
     if (!res) return null;
     var more = this.state.more;
@@ -239,7 +240,7 @@ function (_PureComponent) {
       only: more === 1
     }, options, {
       data: data,
-      className: itemClassName,
+      className: className,
       singleRemove: singleRemove,
       close: this.removeTargetNode,
       isPopover: true,
@@ -256,7 +257,7 @@ function (_PureComponent) {
     return [_react.default.createElement(_More.default, {
       key: "more",
       data: list,
-      className: (0, _styles3.cascaderClass)('item', 'item-compressed'),
+      className: (0, _styles3.cascaderClass)((0, _classname.getDirectionClass)('item'), 'item-compressed'),
       popoverClassName: (0, _styles3.cascaderClass)('popover'),
       contentClassName: (0, _styles3.cascaderClass)('result', size),
       dataId: selectId,

package/css/Cascader/styles/cascader.css

@@ -40,12 +40,12 @@
   text-overflow: ellipsis;
   position: relative;
 }
-.so-cascader-result > span:not(.so-input-rtl *),
-.so-cascader-result .so-cascader-item:not(.so-input-rtl *) {
+.so-cascader-result > span-ltr,
+.so-cascader-result .so-cascader-item-ltr {
   margin-right: var(--select-result-padding-horizontal, 4px);
 }
-.so-input-rtl .so-cascader-result > span,
-.so-input-rtl .so-cascader-result .so-cascader-item {
+.so-cascader-result > span-rtl,
+.so-cascader-result .so-cascader-item-rtl {
   margin-left: var(--select-result-padding-horizontal, 4px);
 }
 .so-cascader-result > span-compressed,
@@ -66,12 +66,12 @@
 .so-cascader-result .so-cascader-item:after {
   content: '\feff ';
 }
-.so-cascader-result > span.so-cascader-remove-container:not(.so-input-rtl *),
-.so-cascader-result .so-cascader-item.so-cascader-remove-container:not(.so-input-rtl *) {
+.so-cascader-result > span.so-cascader-remove-container-ltr,
+.so-cascader-result .so-cascader-item.so-cascader-remove-container-ltr {
   padding-right: 16px;
 }
-.so-input-rtl .so-cascader-result > span.so-cascader-remove-container,
-.so-input-rtl .so-cascader-result .so-cascader-item.so-cascader-remove-container {
+.so-cascader-result > span.so-cascader-remove-container-rtl,
+.so-cascader-result .so-cascader-item.so-cascader-remove-container-rtl {
   padding-left: 16px;
 }
 .so-cascader-result > span.so-cascader-remove-container:after,
@@ -87,15 +87,15 @@
   margin: 0;
   padding: 0;
 }
-.so-cascader-result > span .so-cascader-single-remove:not(.so-input-rtl *),
-.so-cascader-result .so-cascader-item .so-cascader-single-remove:not(.so-input-rtl *) {
+.so-cascader-result > span .so-cascader-single-remove-ltr,
+.so-cascader-result .so-cascader-item .so-cascader-single-remove-ltr {
   right: 8px;
   -webkit-transform: translate(50%, -50%);
       -ms-transform: translate(50%, -50%);
           transform: translate(50%, -50%);
 }
-.so-input-rtl .so-cascader-result > span .so-cascader-single-remove,
-.so-input-rtl .so-cascader-result .so-cascader-item .so-cascader-single-remove {
+.so-cascader-result > span .so-cascader-single-remove-rtl,
+.so-cascader-result .so-cascader-item .so-cascader-single-remove-rtl {
   left: 8px;
   -webkit-transform: translate(-50%, -50%);
       -ms-transform: translate(-50%, -50%);
@@ -163,10 +163,10 @@
 .so-cascader:not(.so-cascader-disabled) .so-cascader-result-clearable:hover .so-select-multi {
   visibility: hidden;
 }
-.so-cascader-multiple .so-cascader-close:not(.so-input-rtl *) {
+.so-cascader-multiple .so-cascader-close-ltr {
   right: 19px;
 }
-.so-input-rtl .so-cascader-multiple .so-cascader-close {
+.so-cascader-multiple .so-cascader-close-rtl {
   left: 19px;
 }
 div.so-cascader-options {
@@ -218,10 +218,10 @@ div.so-cascader-options {
 .so-cascader-result.so-cascader-compressed .so-cascader-input {
   white-space: nowrap;
 }
-.so-cascader-result.so-cascader-compressed .so-cascader-close:not(.so-input-rtl *) {
+.so-cascader-result.so-cascader-compressed .so-cascader-close-ltr {
   right: 9px;
 }
-.so-input-rtl .so-cascader-result.so-cascader-compressed .so-cascader-close {
+.so-cascader-result.so-cascader-compressed .so-cascader-close-rtl {
   left: 9px;
 }
 .so-cascader-no-data {
@@ -255,11 +255,10 @@ div.so-cascader-options {
   overflow-y: auto;
   vertical-align: top;
 }
-.so-cascader-list:not(.so-input-rtl *):not(.so-list-rtl *) {
+.so-cascader-list-ltr {
   border-right: solid 1px var(--gray-200, #e9ecef);
 }
-.so-input-rtl .so-cascader-list,
-.so-list-rtl .so-cascader-list {
+.so-cascader-list-rtl {
   border-left: solid 1px var(--gray-200, #e9ecef);
 }
 .so-cascader-node {
@@ -300,17 +299,15 @@ div.so-cascader-options {
   position: absolute;
   top: 50%;
 }
-.so-cascader-has-children .so-cascader-caret:not(.so-cascader-rtl *):not(.so-list-rtl *),
-.so-cascader-may-be-children .so-cascader-caret:not(.so-cascader-rtl *):not(.so-list-rtl *) {
+.so-cascader-has-children .so-cascader-caret-ltr,
+.so-cascader-may-be-children .so-cascader-caret-ltr {
   right: 12px;
   -webkit-transform: translateY(-50%) rotate(-90deg);
       -ms-transform: translateY(-50%) rotate(-90deg);
           transform: translateY(-50%) rotate(-90deg);
 }
-.so-input-rtl .so-cascader-has-children .so-cascader-caret,
-.so-input-rtl .so-cascader-may-be-children .so-cascader-caret,
-.so-list-rtl .so-cascader-has-children .so-cascader-caret,
-.so-list-rtl .so-cascader-may-be-children .so-cascader-caret {
+.so-cascader-has-children .so-cascader-caret-rtl,
+.so-cascader-may-be-children .so-cascader-caret-rtl {
   left: 12px;
   -webkit-transform: translateY(-50%) rotate(90deg);
       -ms-transform: translateY(-50%) rotate(90deg);

package/css/Checkbox/CheckItem.js

@@ -25,6 +25,8 @@ var _proptypes = require("../utils/proptypes");
 
 var _uid = require("../utils/uid");
 
+var _classname = require("../utils/classname");
+
 var _is = require("../utils/is");
 
 var _Input = _interopRequireDefault(require("../Input"));
@@ -187,7 +189,7 @@ function _default(type) {
         onChange: this.handleInputChange,
         value: value
       }), isSwitch && _react.default.createElement("span", {
-        className: (0, _styles.checkinputClass)('switch-indicator')
+        className: (0, _styles.checkinputClass)((0, _classname.getDirectionClass)('switch-indicator'))
       }));
     };