shineout 1.12.2 → 1.12.3

package/esm/Divider/index.js

@@ -0,0 +1,50 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import React, { PureComponent } from 'react';
+import classnames from 'classnames';
+import { dividerClass } from './styles';
+
+var Divider =
+/*#__PURE__*/
+function (_PureComponent) {
+  _inheritsLoose(Divider, _PureComponent);
+
+  function Divider() {
+    return _PureComponent.apply(this, arguments) || this;
+  }
+
+  var _proto = Divider.prototype;
+
+  _proto.showText = function showText() {
+    var _this$props = this.props,
+        children = _this$props.children,
+        mode = _this$props.mode;
+    return children && mode === 'horizontal';
+  };
+
+  _proto.render = function render() {
+    var _this$props2 = this.props,
+        className = _this$props2.className,
+        children = _this$props2.children,
+        mode = _this$props2.mode,
+        orientation = _this$props2.orientation,
+        restProps = _objectWithoutPropertiesLoose(_this$props2, ["className", "children", "mode", "orientation"]);
+
+    var mc = classnames(dividerClass('_', mode, children && 'with-text', orientation && "with-text-" + orientation), className);
+    return React.createElement("div", _extends({}, restProps, {
+      className: mc
+    }), this.showText() && React.createElement("span", {
+      className: dividerClass('inner-text')
+    }, children));
+  };
+
+  return Divider;
+}(PureComponent);
+
+_defineProperty(Divider, "defaultProps", {
+  mode: 'horizontal'
+});
+
+export default Divider;

package/esm/Divider/interface.d.ts

@@ -0,0 +1 @@
+export { DividerProps as Props } from './Props';

package/esm/Divider/interface.js

@@ -0,0 +1 @@
+export {};

package/esm/Divider/styles/divider.less

@@ -0,0 +1,83 @@
+@import '../../styles/variables.less';
+@import '../../styles/themes/@{so-theme}.less';
+
+@divider-prefix: ~"@{so-prefix}-divider";
+
+.@{divider-prefix} {
+    margin: 0;
+    padding: 0;
+    font-size: @font-size-base;
+    border-top: 1px solid @divider-color;
+
+    &-vertical {
+        position: relative;
+        top: -0.06em;
+        display: inline-block;
+        height: 0.9em;
+        margin: 0 8px;
+        vertical-align: middle;
+        border-top: 0;
+        border-left: @divider-width-base solid @divider-color;
+    }
+
+    &-horizontal {
+        display: flex;
+        clear: both;
+        width: 100%;
+        min-width: 100%;
+        margin: 24px 0;
+    }
+
+    &-horizontal&-with-text {
+        display: flex;
+        margin: 16px 0;
+        color: @text-color;
+        white-space: nowrap;
+        text-align: center;
+        border-top: 0;
+        border-top-color: @divider-color;
+
+        &::before,
+        &::after {
+            position: relative;
+            top: 50%;
+            width: 50%;
+            border-top: @divider-width-base solid transparent;
+            // Chrome not accept `inherit` in `border-top`
+            border-top-color: inherit;
+            border-bottom: 0;
+            transform: translateY(50%);
+            content: '';
+        }
+    }
+
+    &-horizontal&-with-text-left {
+        &::before {
+            top: 50%;
+            width: @divider-orientation-margin;
+        }
+
+        &::after {
+            top: 50%;
+            width: 100% - @divider-orientation-margin;
+        }
+    }
+
+    &-horizontal&-with-text-right {
+        &::before {
+            top: 50%;
+            width: 100% - @divider-orientation-margin;
+        }
+
+        &::after {
+            top: 50%;
+            width: @divider-orientation-margin;
+        }
+    }
+
+    &-inner-text {
+        display: inline-block;
+        padding: 0 @divider-text-padding;
+    }
+
+}

package/esm/Divider/styles/index.d.ts

@@ -0,0 +1,2 @@
+import '../../styles/normalize.less';
+export declare const dividerClass: (...args: any) => string;

package/esm/Divider/styles/index.js

@@ -0,0 +1,4 @@
+import '../../styles/normalize.less';
+import dividerLess from './divider.less';
+import genaration from '../../utils/classname';
+export var dividerClass = genaration(dividerLess, 'divider');

package/esm/Drawer/index.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { ModalProps } from '../Modal/Props';
+declare const Drawer: {
+    (props: ModalProps): JSX.Element;
+    defaultProps: {
+        position: string;
+        width: string;
+    };
+    displayName: string;
+    Submit: typeof import("../Card/Props").Submit;
+};
+export default Drawer;

package/esm/Drawer/index.js

@@ -0,0 +1,17 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import Modal from '../Modal';
+
+var Drawer = function Drawer(props) {
+  return React.createElement(Modal, _extends({}, props, {
+    drawer: true
+  }));
+};
+
+Drawer.defaultProps = {
+  position: 'right',
+  width: 'auto'
+};
+Drawer.displayName = 'ShineoutDrawer';
+Drawer.Submit = Modal.Submit;
+export default Drawer;

package/esm/Drawer/interface.d.ts

@@ -0,0 +1 @@
+export { ModalProps as Props } from '../Modal/Props';

package/esm/Drawer/interface.js

@@ -0,0 +1 @@
+export {};

package/esm/Dropdown/Item.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { ItemProps } from './Props';
+declare class Item extends React.PureComponent<ItemProps> {
+    static defaultProps: {
+        data: {};
+        renderItem: string;
+        className: string;
+        size: import("../@types/common").RegularAttributes.Size;
+        style: React.CSSProperties;
+        type: string;
+    };
+    constructor(props: ItemProps);
+    handleClick(): void;
+    render(): JSX.Element;
+}
+export default Item;

package/esm/Dropdown/Item.js

@@ -0,0 +1,73 @@
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectSpread from "@babel/runtime/helpers/objectSpread";
+import React, { isValidElement, cloneElement } from 'react';
+import { defaultProps } from '../utils/proptypes';
+
+var DefaultProps = _objectSpread({}, defaultProps, {
+  data: {},
+  renderItem: 'content'
+});
+
+var Item =
+/*#__PURE__*/
+function (_React$PureComponent) {
+  _inheritsLoose(Item, _React$PureComponent);
+
+  function Item(props) {
+    var _this;
+
+    _this = _React$PureComponent.call(this, props) || this;
+    _this.handleClick = _this.handleClick.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    return _this;
+  }
+
+  var _proto = Item.prototype;
+
+  _proto.handleClick = function handleClick() {
+    if (!this.props.onClick) return;
+    this.props.onClick(this.props.data);
+  };
+
+  _proto.render = function render() {
+    var _this$props = this.props,
+        data = _this$props.data,
+        itemClassName = _this$props.itemClassName,
+        renderItem = _this$props.renderItem,
+        width = _this$props.width,
+        columns = _this$props.columns;
+    var aWidth = width && columns ? (width - 2) / columns : undefined;
+    var props = {
+      disabled: data.disabled,
+      onClick: this.handleClick,
+      className: itemClassName,
+      target: data.target,
+      style: aWidth ? {
+        display: 'inline-block',
+        width: aWidth
+      } : null
+    };
+    if (data.url) props.href = data.url;
+    var content;
+
+    if (isValidElement(data)) {
+      content = data;
+    } else {
+      // @ts-ignore
+      content = typeof renderItem === 'string' ? data[renderItem] : renderItem(data);
+    }
+
+    if (isValidElement(content)) {
+      return cloneElement(content, Object.assign(props, content.props));
+    }
+
+    return React.createElement("a", props, content);
+  };
+
+  return Item;
+}(React.PureComponent);
+
+_defineProperty(Item, "defaultProps", DefaultProps);
+
+export default Item;

package/esm/Dropdown/Props.d.ts

@@ -0,0 +1,164 @@
+import React from 'react';
+import { StandardProps, RegularAttributes } from '../@types/common';
+import { GetTableConsumerProps } from '../Table/Props';
+import { AbsoluteProps } from '../AnimationList/Props';
+export declare type TriggerType = 'click' | 'hover';
+export declare type DropdownItem = DropdownNode | React.ReactNode;
+export interface DropdownNode {
+    /**
+     * url属性不为空时，render为一个链接
+     *
+     * When the url is not empty, a url will be rendered.
+     *
+     * default: -
+     */
+    url?: string;
+    /**
+     * url 不为空时有效
+     *
+     * It is valid when the url is not empty.
+     *
+     * default: -
+     */
+    target?: string;
+    /**
+     * 禁用
+     *
+     * Disabled
+     *
+     * default: -
+     */
+    disabled?: boolean;
+    /**
+     * 默认从content获取内容
+     *
+     * element
+     *
+     * default: -
+     */
+    content?: React.ReactNode;
+    children?: DropdownNode[];
+    onClick?: (data: DropdownNode) => void;
+    [key: string]: any;
+}
+export interface ItemProps {
+    data: DropdownItem;
+    itemClassName: string;
+    width: DropdownProps['width'];
+    onClick: DropdownProps['onClick'];
+    columns: DropdownProps['columns'];
+    renderItem: ((data: any) => React.ReactNode) | string;
+}
+export interface SimpleDropdownProps extends StandardProps, Pick<AbsoluteProps, 'absolute'> {
+    isSub?: boolean;
+    /**
+     * Display multiple elements on the page. This property depends on the width attribute. Please set the number of columns and width appropriately.
+     *
+     * 页面多元素展示,此属性需要依赖width属性,请合理的设置列数和宽度
+     *
+     * default: -
+     */
+    columns?: number;
+    /**
+     * same as Button
+     *
+     * 同 Button
+     *
+     * default: -
+     */
+    outline?: boolean;
+    /**
+     * Specifies the dropdown should be disabled
+     *
+     * 禁用
+     *
+     * default: false
+     */
+    disabled?: boolean;
+    /**
+     * Specifies the dropdown should be disabled
+     *
+     * 是否开启动画
+     *
+     * default: true
+     */
+    animation?: boolean;
+    /**
+     * data of dropdown
+     *
+     * 下拉数据
+     *
+     * default: []
+     */
+    data: DropdownItem[];
+    /**
+     * Toggle mode
+     *
+     * 触发方式
+     *
+     * default: 'click'
+     */
+    trigger?: TriggerType;
+    /**
+     * Displayed content of the button
+     *
+     * 按钮显示内容
+     *
+     * default: -
+     */
+    placeholder?: React.ReactNode;
+    /**
+     * same as Button
+     *
+     * 同 Button
+     *
+     * default: 'default'
+     */
+    size?: RegularAttributes.Size;
+    /**
+     * type of Dropdown
+     *
+     * 类型
+     *
+     * default: -
+     */
+    type?: RegularAttributes.Type | 'link';
+    /**
+     * The click event. The parameter is the rendered data. <br /> Note: if the onClick is set in the data, this method will be ignored and data.onclick will be called.
+     *
+     * 点击事件。参数为渲染的数据,注: 如果数据内设置了onClick，会忽略此方法，调用data.onClick
+     *
+     * default: -
+     */
+    onClick?: (data: any) => void;
+    /**
+     * The width of the pop-up option layer
+     *
+     * 弹出选项层的宽度
+     *
+     * default: -
+     */
+    width?: number;
+    /**
+     * Set position property can control the direction and position of the drop-down menu
+     *
+     * 弹出的方向和位置
+     *
+     * default: 'auto'
+     */
+    position?: 'left-top' | 'left-bottom' | 'right-top' | 'right-bottom' | 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' | 'auto';
+    /**
+     * Set the displayed content. If it is a string,  the corresponding value will be displayed.
+     * If it is a function, the return value will be displayed and its parameter is the current data.
+     *
+     * 设置显示的内容,如果是字符串,则为对应的值。如果是函数,则返回值为显示的内容,参数为当条数据
+     *
+     * default: 'auto'
+     */
+    renderItem?: ((data: any) => React.ReactNode) | string;
+}
+export declare type DropdownProps = GetTableConsumerProps<SimpleDropdownProps>;
+export declare class DropdownClass extends React.Component<DropdownProps, {}> {
+    render(): JSX.Element;
+}
+export declare type DropdownType = typeof DropdownClass;

package/esm/Dropdown/Props.js

@@ -0,0 +1 @@
+import React from 'react';

package/esm/Dropdown/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: typeof import("./Props").DropdownClass;
+export default _default;