@douyinfe/semi-ui 2.1.4 → 2.2.0-beta.1

package/lib/es/locale/source/es.js

@@ -0,0 +1,157 @@
+import { es } from 'date-fns/locale';
+/**
+ * [i18n-Spanish(es)]
+ *
+ */
+
+const locale = {
+  code: 'es',
+  dateFnsLocale: es,
+  Pagination: {
+    item: 'objeto',
+    pageSize: ' objetos / página',
+    page: ' páginas',
+    total: '',
+    jumpTo: 'Ir a'
+  },
+  Modal: {
+    confirm: 'Aceptar',
+    cancel: 'Cancelar'
+  },
+  TimePicker: {
+    placeholder: {
+      time: 'Seleccionar hora',
+      timeRange: 'Seleccionar rango de tiempo'
+    },
+    begin: 'Hora inicial',
+    end: 'Hora final',
+    hour: '',
+    minute: '',
+    second: '',
+    AM: 'AM',
+    PM: 'PM'
+  },
+  DatePicker: {
+    placeholder: {
+      date: 'Seleccionar fecha',
+      dateTime: 'Seleccionar hora y fecha',
+      dateRange: ['Fecha inicial', 'Fecha final'],
+      dateTimeRange: ['Fecha inicial', 'Fecha final']
+    },
+    footer: {
+      confirm: 'Aceptar',
+      cancel: 'Cancelar'
+    },
+    selectDate: 'Seleccionar fecha',
+    selectTime: 'Seleccionar hora',
+    year: 'año',
+    month: 'mes',
+    day: 'día',
+    monthText: '${month} ${year}',
+    months: {
+      1: 'Ene',
+      2: 'Feb',
+      3: 'Mar',
+      4: 'Abr',
+      5: 'May',
+      6: 'Jun',
+      7: 'Jul',
+      8: 'Ago',
+      9: 'Sep',
+      10: 'Oct',
+      11: 'Nov',
+      12: 'Dic'
+    },
+    fullMonths: {
+      1: 'Enero',
+      2: 'Febrero',
+      3: 'Marzo',
+      4: 'Abril',
+      5: 'Mayo',
+      6: 'Junio',
+      7: 'Julio',
+      8: 'Agosto',
+      9: 'Septiembre',
+      10: 'Octubre',
+      11: 'Noviembre',
+      12: 'Diciembre'
+    },
+    weeks: {
+      Mon: 'Lun',
+      Tue: 'Mar',
+      Wed: 'Mie',
+      Thu: 'Jue',
+      Fri: 'Vie',
+      Sat: 'Sab',
+      Sun: 'Dom'
+    },
+    localeFormatToken: {
+      FORMAT_SWITCH_DATE: 'yyyy-MM-dd'
+    }
+  },
+  Popconfirm: {
+    confirm: 'Aceptar',
+    cancel: 'Cancelar'
+  },
+  Navigation: {
+    collapseText: 'Contraer barra lateral',
+    expandText: 'Expandir barra lateral'
+  },
+  Table: {
+    emptyText: 'Sin resultados',
+    pageText: 'Mostrando del ${currentStart} al ${currentEnd} de ${total}'
+  },
+  Select: {
+    emptyText: 'Sin resultados',
+    createText: 'Crear'
+  },
+  Tree: {
+    emptyText: 'Sin resultados',
+    searchPlaceholder: 'Búsqueda'
+  },
+  Cascader: {
+    emptyText: 'Sin resultados'
+  },
+  List: {
+    emptyText: 'Sin resultados'
+  },
+  Calendar: {
+    allDay: 'Todo el día',
+    AM: '${time} AM',
+    PM: '${time} PM',
+    datestring: '',
+    remaining: '${remained} mas'
+  },
+  Upload: {
+    mainText: 'Clic aquí para cargar archivo o arrastre aquí el archivo',
+    illegalTips: 'Este tipo de archivo no es compatible',
+    legalTips: 'Suelte y comience a cargar',
+    retry: 'Reintentar',
+    replace: 'Reemplazar archivo',
+    clear: 'Limpiar',
+    selectedFiles: 'Archivos seleccionados',
+    illegalSize: 'Tamaño de archivo inválido',
+    fail: 'Error al cargar'
+  },
+  TreeSelect: {
+    searchPlaceholder: 'Búsqueda'
+  },
+  Typography: {
+    copy: 'Copiar',
+    copied: 'Copiado',
+    expand: 'Expandir',
+    collapse: 'Contraer'
+  },
+  Transfer: {
+    emptyLeft: 'Sin datos',
+    emptySearch: 'Sin resultados de búsqueda',
+    emptyRight: 'Sin contenido, verifique desde la izquierda',
+    placeholder: 'Búsqueda',
+    clear: 'Limpiar',
+    selectAll: 'Seleccionar todo',
+    clearSelectAll: 'Deseleccionar todo',
+    total: 'Total ${total} objetos',
+    selected: '${total} objetos seleccionados'
+  }
+};
+export default locale;

package/lib/es/modal/Modal.d.ts

@@ -30,8 +30,8 @@ declare class Modal extends BaseComponent<ModalReactProps, ModalState> {
         closable: PropTypes.Requireable<boolean>;
         centered: PropTypes.Requireable<boolean>;
         visible: PropTypes.Requireable<boolean>;
-        width: PropTypes.Requireable<number>;
-        height: PropTypes.Requireable<number>;
+        width: PropTypes.Requireable<string | number>;
+        height: PropTypes.Requireable<string | number>;
         confirmLoading: PropTypes.Requireable<boolean>;
         cancelLoading: PropTypes.Requireable<boolean>;
         okText: PropTypes.Requireable<string>;

package/lib/es/modal/Modal.js

@@ -304,8 +304,8 @@ Modal.propTypes = {
   closable: PropTypes.bool,
   centered: PropTypes.bool,
   visible: PropTypes.bool,
-  width: PropTypes.number,
-  height: PropTypes.number,
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
   confirmLoading: PropTypes.bool,
   cancelLoading: PropTypes.bool,
   okText: PropTypes.string,

package/lib/es/modal/confirm.d.ts

@@ -30,7 +30,7 @@ export declare function withInfo(props: ModalReactProps): {
     confirmLoading?: boolean;
     cancelLoading?: boolean;
     hasCancel?: boolean;
-    height?: number;
+    height?: string | number;
     mask?: boolean;
     maskClosable?: boolean;
     maskFixed?: boolean;
@@ -38,7 +38,7 @@ export declare function withInfo(props: ModalReactProps): {
     okText?: string;
     okType?: import("@douyinfe/semi-foundation/lib/es/modal/modalFoundation").OKType;
     visible?: boolean;
-    width?: number;
+    width?: string | number;
     zIndex?: number;
     getPopupContainer?: () => HTMLElement;
     closeOnEsc?: boolean;
@@ -71,7 +71,7 @@ export declare function withSuccess(props: ModalReactProps): {
     confirmLoading?: boolean;
     cancelLoading?: boolean;
     hasCancel?: boolean;
-    height?: number;
+    height?: string | number;
     mask?: boolean;
     maskClosable?: boolean;
     maskFixed?: boolean;
@@ -79,7 +79,7 @@ export declare function withSuccess(props: ModalReactProps): {
     okText?: string;
     okType?: import("@douyinfe/semi-foundation/lib/es/modal/modalFoundation").OKType;
     visible?: boolean;
-    width?: number;
+    width?: string | number;
     zIndex?: number;
     getPopupContainer?: () => HTMLElement;
     closeOnEsc?: boolean;
@@ -112,7 +112,7 @@ export declare function withWarning(props: ModalReactProps): {
     confirmLoading?: boolean;
     cancelLoading?: boolean;
     hasCancel?: boolean;
-    height?: number;
+    height?: string | number;
     mask?: boolean;
     maskClosable?: boolean;
     maskFixed?: boolean;
@@ -120,7 +120,7 @@ export declare function withWarning(props: ModalReactProps): {
     okText?: string;
     okType?: import("@douyinfe/semi-foundation/lib/es/modal/modalFoundation").OKType;
     visible?: boolean;
-    width?: number;
+    width?: string | number;
     zIndex?: number;
     getPopupContainer?: () => HTMLElement;
     closeOnEsc?: boolean;
@@ -153,7 +153,7 @@ export declare function withError(props: ModalReactProps): {
     confirmLoading?: boolean;
     cancelLoading?: boolean;
     hasCancel?: boolean;
-    height?: number;
+    height?: string | number;
     mask?: boolean;
     maskClosable?: boolean;
     maskFixed?: boolean;
@@ -161,7 +161,7 @@ export declare function withError(props: ModalReactProps): {
     okText?: string;
     okType?: import("@douyinfe/semi-foundation/lib/es/modal/modalFoundation").OKType;
     visible?: boolean;
-    width?: number;
+    width?: string | number;
     zIndex?: number;
     getPopupContainer?: () => HTMLElement;
     closeOnEsc?: boolean;
@@ -194,7 +194,7 @@ export declare function withConfirm(props: ModalReactProps): {
     confirmLoading?: boolean;
     cancelLoading?: boolean;
     hasCancel?: boolean;
-    height?: number;
+    height?: string | number;
     mask?: boolean;
     maskClosable?: boolean;
     maskFixed?: boolean;
@@ -202,7 +202,7 @@ export declare function withConfirm(props: ModalReactProps): {
     okText?: string;
     okType?: import("@douyinfe/semi-foundation/lib/es/modal/modalFoundation").OKType;
     visible?: boolean;
-    width?: number;
+    width?: string | number;
     zIndex?: number;
     getPopupContainer?: () => HTMLElement;
     closeOnEsc?: boolean;

package/lib/es/navigation/index.d.ts

@@ -36,8 +36,8 @@ export interface NavProps extends BaseProps {
     defaultIsCollapsed?: boolean;
     defaultOpenKeys?: React.ReactText[];
     defaultSelectedKeys?: React.ReactText[];
-    footer?: React.ReactNode | NavHeaderProps;
-    header?: React.ReactNode | NavFooterProps;
+    footer?: React.ReactNode | NavFooterProps;
+    header?: React.ReactNode | NavHeaderProps;
     isCollapsed?: boolean;
     items?: NavItems;
     limitIndent?: boolean;

package/lib/es/pagination/index.js

@@ -15,6 +15,7 @@ import { cssClasses, numbers } from '@douyinfe/semi-foundation/lib/es/pagination
 import '@douyinfe/semi-foundation/lib/es/pagination/pagination.css';
 import { numbers as popoverNumbers } from '@douyinfe/semi-foundation/lib/es/popover/constants';
 import { IconChevronLeft, IconChevronRight } from '@douyinfe/semi-icons';
+import warning from '@douyinfe/semi-foundation/lib/es/utils/warning';
 import ConfigContext from '../configProvider/context';
 import LocaleConsumer from '../locale/localeConsumer';
 import Select from '../select/index';
@@ -45,6 +46,7 @@ export default class Pagination extends BaseComponent {
     this.foundation = new PaginationFoundation(this.adapter);
     this.renderDefaultPage = _bindInstanceProperty(_context = this.renderDefaultPage).call(_context, this);
     this.renderSmallPage = _bindInstanceProperty(_context2 = this.renderSmallPage).call(_context2, this);
+    warning(Boolean(props.showSizeChanger && props.hideOnSinglePage), '[Semi Pagination] You should not use showSizeChanger and hideOnSinglePage in ths same time. At this time, hideOnSinglePage no longer takes effect, otherwise there may be a problem that the switch entry disappears');
   }
 
   get adapter() {
@@ -338,7 +340,8 @@ export default class Pagination extends BaseComponent {
       className,
       style,
       hideOnSinglePage,
-      hoverShowPageSelect
+      hoverShowPageSelect,
+      showSizeChanger
     } = this.props;
     const paginationCls = classNames("".concat(prefixCls, "-small"), prefixCls, className);
     const {
@@ -348,7 +351,7 @@ export default class Pagination extends BaseComponent {
     } = this.state;
     const totalPageNum = Math.ceil(total / pageSize);
 
-    if (totalPageNum < 2 && hideOnSinglePage) {
+    if (totalPageNum < 2 && hideOnSinglePage && !showSizeChanger) {
       return null;
     }
 
@@ -377,13 +380,14 @@ export default class Pagination extends BaseComponent {
       showTotal,
       className,
       style,
-      hideOnSinglePage
+      hideOnSinglePage,
+      showSizeChanger
     } = this.props;
     const paginationCls = classNames(className, "".concat(prefixCls));
     const showTotalCls = "".concat(prefixCls, "-total");
     const totalPageNum = Math.ceil(total / pageSize);
 
-    if (totalPageNum < 2 && hideOnSinglePage) {
+    if (totalPageNum < 2 && hideOnSinglePage && !showSizeChanger) {
       return null;
     }
 

package/lib/es/rating/item.js

@@ -71,7 +71,7 @@ export default class Item extends PureComponent {
       height: size,
       fontSize: size
     } : {};
-    const iconSize = size === 'small' ? 'default' : 'extra-large';
+    const iconSize = isCustomSize ? 'inherit' : size === 'small' ? 'default' : 'extra-large';
     const content = character ? character : /*#__PURE__*/React.createElement(IconStar, {
       size: iconSize
     });

package/lib/es/select/index.d.ts

@@ -2,13 +2,20 @@ import React, { MouseEvent } from 'react';
 import PropTypes from 'prop-types';
 import SelectFoundation, { SelectAdapter } from '@douyinfe/semi-foundation/lib/es/select/foundation';
 import BaseComponent, { ValidateStatus } from '../_base/baseComponent';
+import { InputProps } from '../input/index';
 import Option, { OptionProps } from './option';
 import OptionGroup from './optionGroup';
+import { Subtract } from 'utility-types';
 import '@douyinfe/semi-foundation/lib/es/select/select.css';
 import { Position, TooltipProps } from '../tooltip';
 export { OptionProps } from './option';
 export { OptionGroupProps } from './optionGroup';
 export { VirtualRowProps } from './virtualRow';
+declare type ExcludeInputType = {
+    value?: InputProps['value'];
+    onFocus?: InputProps['onFocus'];
+    onChange?: InputProps['onChange'];
+};
 export interface optionRenderProps {
     key?: any;
     label?: string | React.ReactNode | number;
@@ -48,6 +55,7 @@ export declare type RenderMultipleSelectedItemFn = (optionNode: Record<string, a
 };
 export declare type RenderSelectedItemFn = RenderSingleSelectedItemFn | RenderMultipleSelectedItemFn;
 export declare type SelectProps = {
+    id?: string;
     autoFocus?: boolean;
     arrowIcon?: React.ReactNode;
     defaultValue?: string | number | any[] | Record<string, any>;
@@ -84,6 +92,7 @@ export declare type SelectProps = {
     suffix?: React.ReactNode;
     prefix?: React.ReactNode;
     insetLabel?: React.ReactNode;
+    inputProps?: Subtract<InputProps, ExcludeInputType>;
     showClear?: boolean;
     showArrow?: boolean;
     renderSelectedItem?: RenderSelectedItemFn;
@@ -150,6 +159,7 @@ declare class Select extends BaseComponent<SelectProps, SelectState> {
         dropdownStyle: PropTypes.Requireable<object>;
         outerTopSlot: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         innerTopSlot: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        inputProps: PropTypes.Requireable<object>;
         outerBottomSlot: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         innerBottomSlot: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         optionList: PropTypes.Requireable<any[]>;

package/lib/es/select/index.js

@@ -342,39 +342,44 @@ class Select extends BaseComponent {
     const {
       size,
       multiple,
-      disabled
+      disabled,
+      inputProps
     } = this.props;
+
+    const inputPropsCls = _get(inputProps, 'className');
+
     const inputcls = cls("".concat(prefixcls, "-input"), {
       ["".concat(prefixcls, "-input-single")]: !multiple,
       ["".concat(prefixcls, "-input-multiple")]: multiple
-    });
+    }, inputPropsCls);
     const {
       inputValue
     } = this.state;
-    const inputProps = {
+
+    const selectInputProps = _Object$assign({
       value: inputValue,
       disabled,
       className: inputcls,
       onChange: this.handleInputChange
-    };
+    }, inputProps);
+
     let style = {}; // Multiple choice mode
 
     if (multiple) {
       style = {
         width: inputValue ? "".concat(inputValue.length * 16, "px") : '2px'
       };
-      inputProps.style = style;
+      selectInputProps.style = style;
     }
 
     return /*#__PURE__*/React.createElement(Input, _Object$assign({
       ref: this.inputRef,
-      size: size
-    }, inputProps, {
+      size: size,
       onFocus: e => {
         // prevent event bubbling which will fire trigger onFocus event
         e.stopPropagation(); // e.nativeEvent.stopImmediatePropagation();
       }
-    }));
+    }, selectInputProps));
   }
 
   close() {
@@ -704,7 +709,9 @@ class Select extends BaseComponent {
           key: value
         }), content);
       } else {
-        return content;
+        return /*#__PURE__*/React.createElement(Fragment, {
+          key: value
+        }, content);
       }
     });
 
@@ -818,6 +825,7 @@ class Select extends BaseComponent {
       multiple,
       filter,
       style,
+      id,
       size,
       className,
       validateStatus,
@@ -891,6 +899,7 @@ class Select extends BaseComponent {
       ref: ref => this.triggerRef.current = ref,
       onClick: e => this.foundation.handleClick(e),
       style: style,
+      id: id,
       tabIndex: tabIndex,
       onMouseEnter: this.onMouseEnter,
       onMouseLeave: this.onMouseLeave,
@@ -976,6 +985,7 @@ Select.propTypes = {
   dropdownStyle: PropTypes.object,
   outerTopSlot: PropTypes.node,
   innerTopSlot: PropTypes.node,
+  inputProps: PropTypes.object,
   outerBottomSlot: PropTypes.node,
   innerBottomSlot: PropTypes.node,
   optionList: PropTypes.array,

package/lib/es/timeline/item.d.ts

@@ -3,28 +3,31 @@ import PropTypes from 'prop-types';
 import '@douyinfe/semi-foundation/lib/es/timeline/timeline.css';
 export interface TimelineItemProps {
     color?: string;
-    time?: string;
+    time?: React.ReactNode;
     type?: 'default' | 'ongoing' | 'success' | 'warning' | 'error';
     dot?: React.ReactNode;
     extra?: React.ReactNode;
     position?: 'left' | 'right';
     className?: string;
     style?: React.CSSProperties;
+    onClick?: React.MouseEventHandler<HTMLLIElement>;
 }
 export default class Item extends PureComponent<TimelineItemProps> {
     static propTypes: {
         color: PropTypes.Requireable<string>;
-        time: PropTypes.Requireable<string>;
+        time: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         type: PropTypes.Requireable<string>;
         dot: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         extra: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         position: PropTypes.Requireable<string>;
         className: PropTypes.Requireable<string>;
         style: PropTypes.Requireable<object>;
+        onClick: PropTypes.Requireable<(...args: any[]) => any>;
     };
     static defaultProps: {
         type: string;
         time: string;
+        onClick: (...args: any[]) => void;
     };
     render(): JSX.Element;
 }

package/lib/es/timeline/item.js

@@ -1,3 +1,4 @@
+import _noop from "lodash/noop";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
 import _Object$assign from "@babel/runtime-corejs3/core-js-stable/object/assign";
 import React, { PureComponent } from 'react';
@@ -18,7 +19,8 @@ export default class Item extends PureComponent {
       type,
       style,
       time,
-      extra
+      extra,
+      onClick
     } = this.props;
     const itemCls = cls(prefixCls, className);
     const dotCls = cls({
@@ -33,16 +35,17 @@ export default class Item extends PureComponent {
     } : null;
     return /*#__PURE__*/React.createElement("li", {
       className: itemCls,
-      style: style
+      style: style,
+      onClick: onClick
     }, /*#__PURE__*/React.createElement("div", {
       className: "".concat(prefixCls, "-tail")
     }), /*#__PURE__*/React.createElement("div", _Object$assign({
       className: dotCls
     }, dotStyle), dot), /*#__PURE__*/React.createElement("div", {
       className: "".concat(prefixCls, "-content")
-    }, children, extra ? /*#__PURE__*/React.createElement("div", {
+    }, children, extra && /*#__PURE__*/React.createElement("div", {
       className: "".concat(prefixCls, "-content-extra")
-    }, extra) : null, /*#__PURE__*/React.createElement("div", {
+    }, extra), time && /*#__PURE__*/React.createElement("div", {
       className: "".concat(prefixCls, "-content-time")
     }, time)));
   }
@@ -50,15 +53,17 @@ export default class Item extends PureComponent {
 }
 Item.propTypes = {
   color: PropTypes.string,
-  time: PropTypes.string,
+  time: PropTypes.node,
   type: PropTypes.oneOf(strings.ITEM_TYPE),
   dot: PropTypes.node,
   extra: PropTypes.node,
   position: PropTypes.oneOf(strings.ITEM_POS),
   className: PropTypes.string,
-  style: PropTypes.object
+  style: PropTypes.object,
+  onClick: PropTypes.func
 };
 Item.defaultProps = {
   type: 'default',
-  time: ''
+  time: '',
+  onClick: _noop
 };

package/lib/es/tree/treeNode.js

@@ -64,8 +64,6 @@ export default class TreeNode extends PureComponent {
       const {
         onNodeRightClick
       } = this.context;
-      e.stopPropagation();
-      e.nativeEvent.stopImmediatePropagation();
       onNodeRightClick(e, this.props);
     };
 

package/lib/es/upload/fileCard.d.ts

@@ -26,6 +26,7 @@ declare class FileCard extends PureComponent<FileCardProps> {
         style: PropTypes.Requireable<object>;
         url: PropTypes.Requireable<string>;
         validateMessage: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        index: PropTypes.Requireable<number>;
     };
     static defaultProps: {
         listType: "list";
@@ -39,6 +40,7 @@ declare class FileCard extends PureComponent<FileCardProps> {
     renderValidateMessage(): ReactNode;
     renderPicValidateMsg(): ReactNode;
     renderPic(locale: Locale['Upload']): ReactNode;
+    renderFile(locale: Locale["Upload"]): JSX.Element;
     onRemove(e: MouseEvent): void;
     onReplace(e: MouseEvent): void;
     onRetry(e: MouseEvent): void;