shineout 1.12.2 → 1.12.3

package/esm/Progress/styles/progress.less

@@ -0,0 +1,119 @@
+@import '../../styles/variables.less';
+@import '../../styles/themes/@{so-theme}.less';
+
+@progress-prefix: ~'@{so-prefix}-progress';
+@popup-height: 38px;
+
+.@{progress-prefix} {
+  &-rtl {
+    direction: rtl;
+    text-align: right;
+  }
+  &-line {
+    display: flex;
+    align-items: center;
+
+    .@{progress-prefix}-background {
+      position: relative;
+      overflow: hidden;
+      flex: 1;
+      background: @progress-bg-color;
+    }
+
+    .@{progress-prefix}-content {
+      margin-left: 8px;
+      .@{progress-prefix}-rtl&  {
+        margin-right: 8px;
+        margin-left: 0;
+      }
+    }
+
+    .@{progress-prefix}-front {
+      position: absolute;
+      top: 0;
+      left: 0;
+      height: 100%;
+      background: @colors-primary;
+      transition: width 0.32s linear;
+      .@{progress-prefix}-rtl&  {
+        left: auto;
+        right: 0;
+      }
+    }
+    &-popup {
+      padding-top: @popup-height;
+      position: relative;
+    }
+    .@{progress-prefix}-popup {
+      display: inline-block;
+      position: absolute;
+      transition: all 0.32s linear;
+      top: 0;
+      background: #fff;
+      padding: 4px 8px;
+      border-radius: 2px;
+      box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12),0 6px 16px rgba(0, 0, 0, 0.08),0 9px 28px 8px rgba(0, 0, 0, 0.05);
+      .@{progress-prefix}-arrow {
+        background: #fff;
+        position: absolute;
+        display: block;
+        width: 6px;
+        height: 6px;
+        left: 50%;
+        bottom: 0;
+        transform: translateX(-50%) translateY(50%) rotate(45deg);
+      }
+    }
+  }
+
+  &-circle {
+    position: relative;
+    display: inline-block;
+
+    svg {
+      transform: rotate(270deg);
+    }
+
+    .@{progress-prefix}-background {
+      stroke: @progress-bg-color;
+    }
+
+    .@{progress-prefix}-front {
+      stroke: @colors-primary;
+      transition: stroke-dashoffset 0.32s ease 0s, stroke-dasharray 0.32s ease 0s, stroke 0.32s,
+        stroke-width 0.06s ease 0.32s;
+    }
+
+    .@{progress-prefix}-content {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+    }
+  }
+
+  &-success &-front {
+    background: @colors-success;
+    stroke: @colors-success;
+  }
+
+  &-success .@{so-prefix}-progress-content {
+    color: @colors-success;
+  }
+
+  &-info &-front {
+    background: @colors-info;
+    stroke: @colors-info;
+  }
+
+  &-warning &-front {
+    background: @colors-warning;
+    stroke: @colors-warning;
+  }
+
+  &-error &-front,
+  &-danger &-front {
+    background: @colors-danger;
+    stroke: @colors-danger;
+  }
+}

package/esm/Radio/Group.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { PureComponent } from '../component';
+import { BaseRadioGroupProps } from './Props';
+import { CheckValueType } from '../Checkbox/Props';
+declare class RadioGroup<DataItem, Value> extends PureComponent<BaseRadioGroupProps<DataItem, Value>, {}> {
+    static defaultProps: {
+        renderItem: (d: any) => any;
+    };
+    handleUpdate: () => void;
+    constructor(props: BaseRadioGroupProps<DataItem, Value>);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    getContent(d: DataItem, index: number): React.ReactNode;
+    handleClick(_val: any, _checked: CheckValueType, index: number): void;
+    handleRawChange(value: DataItem): void;
+    render(): JSX.Element;
+}
+export default RadioGroup;

package/esm/Radio/Group.js

@@ -0,0 +1,119 @@
+import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import React from 'react';
+import classnames from 'classnames';
+import { PureComponent } from '../component';
+import { getKey } from '../utils/uid';
+import { CHANGE_TOPIC } from '../Datum/types';
+import { Provider } from '../Checkbox/context';
+import { checkinputClass } from '../Checkbox/styles';
+import Radio from './Radio';
+import { isRTL } from '../config';
+
+var RadioGroup =
+/*#__PURE__*/
+function (_PureComponent) {
+  _inheritsLoose(RadioGroup, _PureComponent);
+
+  function RadioGroup(props) {
+    var _this;
+
+    _this = _PureComponent.call(this, props) || this;
+
+    _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "handleUpdate", void 0);
+
+    _this.handleClick = _this.handleClick.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.handleUpdate = _this.forceUpdate.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.handleRawChange = _this.handleRawChange.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    return _this;
+  }
+
+  var _proto = RadioGroup.prototype;
+
+  _proto.componentDidMount = function componentDidMount() {
+    _PureComponent.prototype.componentDidMount.call(this);
+
+    this.props.datum.subscribe(CHANGE_TOPIC, this.handleUpdate);
+  };
+
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    _PureComponent.prototype.componentWillUnmount.call(this);
+
+    this.props.datum.unsubscribe(CHANGE_TOPIC, this.handleUpdate);
+  };
+
+  _proto.getContent = function getContent(d, index) {
+    var renderItem = this.props.renderItem;
+
+    if (typeof renderItem === 'string') {
+      return d[renderItem];
+    }
+
+    if (typeof renderItem === 'function') {
+      return renderItem(d, index);
+    }
+
+    return '';
+  };
+
+  _proto.handleClick = function handleClick(_val, _checked, index) {
+    var _this$props = this.props,
+        data = _this$props.data,
+        datum = _this$props.datum;
+    datum.set(data[index]);
+  };
+
+  _proto.handleRawChange = function handleRawChange(value) {
+    this.props.datum.set(value);
+  };
+
+  _proto.render = function render() {
+    var _this2 = this;
+
+    var _this$props2 = this.props,
+        block = _this$props2.block,
+        data = _this$props2.data,
+        datum = _this$props2.datum,
+        keygen = _this$props2.keygen,
+        children = _this$props2.children,
+        button = _this$props2.button,
+        size = _this$props2.size;
+    var rtl = isRTL();
+    var className = classnames(checkinputClass('group', block && 'block', button && 'button', button === 'outline' && 'outline', button && size, rtl && 'rtl'), this.props.className);
+
+    if (data === undefined) {
+      return React.createElement("div", {
+        className: className
+      }, React.createElement(Provider, {
+        value: {
+          onRawChange: this.handleRawChange,
+          checked: datum.check.bind(datum)
+        }
+      }, children));
+    }
+
+    return React.createElement("div", {
+      className: className
+    }, data.map(function (d, i) {
+      return React.createElement(Radio, {
+        checked: datum.check(d),
+        disabled: datum.disabled(d),
+        key: getKey(d, keygen, i),
+        htmlValue: i,
+        index: i,
+        onChange: _this2.handleClick
+      }, _this2.getContent(d, i));
+    }), children);
+  };
+
+  return RadioGroup;
+}(PureComponent);
+
+_defineProperty(RadioGroup, "defaultProps", {
+  renderItem: function renderItem(d) {
+    return d;
+  }
+});
+
+export default RadioGroup;

package/esm/Radio/Props.d.ts

@@ -0,0 +1,39 @@
+import * as React from 'react';
+import { GetInputableProps } from '../Form/Props';
+import { GetDatumListProps } from '../Datum/Props';
+import { LiteralUnion, RegularAttributes } from '../@types/common';
+import { SimpleRadioProps } from '../Checkbox/Props';
+import { KeygenType, StandardProps } from '../@types/common';
+import ListDatum from '../Datum/List';
+export interface BaseRadioGroupProps<DataItem, Value> extends StandardProps {
+    /**
+     * When it is a string, return d[string]. When it is a function, return the result of the function.
+     *
+     * 为 string 时，返回 d[string]。 为 function 时，返回函数结果
+     *
+     * default: d => d
+     */
+    renderItem?: LiteralUnion<DataItem> | ((data: DataItem, index?: number) => React.ReactNode);
+    keygen: KeygenType<DataItem>;
+    block?: boolean;
+    button?: boolean | 'outline';
+    datum: ListDatum<DataItem, Value>;
+    data?: DataItem[];
+    size?: RegularAttributes.Size;
+    onChange: (value: Value, Data: DataItem) => void;
+    value: Value;
+}
+export declare type RadioProps = SimpleRadioProps;
+export declare type GroupDatumArgsType = 'disabled' | 'format' | 'prediction';
+export declare type InputRadioGroupPropsWidthDatum<DataItem, Value> = GetDatumListProps<BaseRadioGroupProps<DataItem, Value>, DataItem, Value, GroupDatumArgsType>;
+export declare type InputRadioGroupPropsWidthInputable<DataItem, Value> = GetInputableProps<InputRadioGroupPropsWidthDatum<DataItem, Value>, Value>;
+export declare type InputRadioGroupProps<DataItem, Value> = InputRadioGroupPropsWidthInputable<DataItem, Value>;
+export declare type RadioGroupProps<DataItem, Value> = InputRadioGroupProps<DataItem, Value>;
+export declare class RadioGroup<DataItem, Value> extends React.Component<RadioGroupProps<DataItem, Value>, {}> {
+    render(): JSX.Element;
+}
+export declare class Radio extends React.Component<RadioProps, {}> {
+    static Group: typeof RadioGroup;
+    render(): JSX.Element;
+}
+export declare type RadioType = typeof Radio;

package/esm/Radio/Props.js

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

package/esm/Radio/Radio.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const _default: import("react").ComponentClass<import("../Checkbox/Props").SimpleRadioProps, any>;
+export default _default;

package/esm/Radio/Radio.js

@@ -0,0 +1,2 @@
+import checkItem from '../Checkbox/CheckItem';
+export default checkItem('radio');

package/esm/Radio/index.d.ts

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

package/esm/Radio/index.js

@@ -0,0 +1,15 @@
+import { compose } from '../utils/func';
+import inputable from '../Form/inputable';
+import Datum from '../Datum';
+import { consumer } from '../Checkbox/context';
+import Group from './Group';
+import Radio from './Radio';
+var exports = consumer(Radio);
+exports.Group = compose(inputable, Datum.hoc({
+  limit: 1,
+  bindProps: ['disabled', 'format', 'prediction'],
+  pure: false
+}))(Group);
+exports.displayName = 'ShineoutRadio';
+exports.Group.displayName = 'ShineoutRadioGroup';
+export default exports;

package/esm/Radio/interface.d.ts

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

package/esm/Radio/interface.js

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

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

@@ -0,0 +1 @@
+import '../../styles/normalize.less';

package/esm/Radio/styles/index.js

@@ -0,0 +1 @@
+import '../../styles/normalize.less';

package/esm/Rate/Props.d.ts

@@ -0,0 +1,96 @@
+import { ReactElement, ReactNode } from 'react';
+import { StandardProps } from '../@types/common';
+import { GetInputableProps } from '../Form/Props';
+export declare interface OriginRateProps extends ArgProps, StandardProps {
+    /**
+     * Whether to allow semi selection
+     *
+     * 是否允许半选
+     *
+     * default: false
+     */
+    allowHalf?: boolean;
+    /**
+     * whether to allow clear when click again
+     *
+     * 是否允许再次点击后清除
+     *
+     * default: false
+     */
+    clearable?: boolean;
+    /**
+     * read-only
+     *
+     * 是否只读
+     *
+     * default: false
+     */
+    disabled?: boolean;
+    /**
+     * The maximum value of the option, integer
+     *
+     * 选项最大值，整数
+     *
+     * default: 5
+     */
+    max?: number;
+    /**
+     * When repeat is true, display item is a copy of the item corresponding to the current value
+     *
+     * 为 true 时，显示的选项为当前分值对应选项的复制
+     *
+     * default: true
+     */
+    repeat?: boolean;
+    /**
+     * the size of the icon
+     *
+     * 图标大小
+     *
+     * default: 20
+     */
+    size?: number | string;
+    /**
+     * Text
+     *
+     * 附加文字
+     *
+     * default: -
+     */
+    text?: Array<ReactNode>;
+    /**
+     * Selected key (controlled)
+     *
+     * 选中的 key （受控)
+     *
+     * default: -
+     */
+    value: number;
+    /**
+     * value change callback
+     *
+     * 值改变回调
+     *
+     * default: -
+     */
+    onChange: (value: number) => void;
+}
+export interface ArgProps {
+    /**
+     * Unselected element background
+     *
+     * 未选中元素背景
+     *
+     * default: -
+     */
+    background?: ReactElement | string | Array<string | ReactElement>;
+    /**
+     * selected element background
+     *
+     * 选中元素背景
+     *
+     * default: -
+     */
+    front?: ReactElement | string | Array<string | ReactElement>;
+}
+export declare type RateProps = GetInputableProps<Omit<OriginRateProps, keyof ArgProps>, string>;

package/esm/Rate/Props.js

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

package/esm/Rate/Rate.d.ts

@@ -0,0 +1,36 @@
+/// <reference types="node" />
+import React, { ReactNode } from 'react';
+import { PureComponent } from '../component';
+import { OriginRateProps } from './Props';
+interface RateState {
+    hover: number;
+    highlight: number;
+}
+declare class Rate extends PureComponent<OriginRateProps, RateState> {
+    static defaultProps: {
+        repeat: boolean;
+        max: number;
+        size: number;
+        text: never[];
+        value: number;
+        className: string;
+        style: React.CSSProperties;
+        type: string;
+    };
+    highlightTimer: NodeJS.Timeout;
+    constructor(props: OriginRateProps);
+    getValue(): number;
+    getStyle(): React.CSSProperties | undefined;
+    getScale(): {
+        transform: string;
+    } | undefined;
+    getIcon(icons: ReactNode | ReactNode[], i: number, isBg?: boolean): {} | null | undefined;
+    handleClick(value: number, e: React.MouseEvent): void;
+    handleHover(hover: number): void;
+    handleMove(hover: number, e: React.MouseEvent<HTMLSpanElement>): void;
+    renderBackground(): JSX.Element;
+    renderRate(): JSX.Element;
+    renderStatic(): JSX.Element;
+    render(): JSX.Element;
+}
+export default Rate;