@aloudata/aloudata-design 0.3.1 → 0.3.2

package/README.md

@@ -221,8 +221,18 @@ api展示为表格形势，可以使用**API**标签，如：
 
 请在./public/style/common.css 中自定义修改样式
 
-## 组件开发踩过的坑(持续更新中)
-
-1. 组件未暴露className
-2. 组件未暴露ref
-3. 组件未打包出ts校验类型
+## 按需引用
+
+```js
+[
+    'import',
+    {
+      libraryName: '@aloudata/aloudata-design',
+      libraryDirectory: 'es',
+      style:(name)=>{
+        return `${name}/style/index.less`
+      },
+      camel2DashComponentName: false,
+    },
+]
+```

package/es/Card/index.d.ts

@@ -0,0 +1,3 @@
+import { Card } from 'antd';
+export { CardProps } from 'antd/lib/card';
+export default Card;

package/es/Card/index.js

@@ -0,0 +1,3 @@
+import "antd/es/card/style";
+import _Card from "antd/es/card";
+export default _Card;

package/es/Card/style/index.d.ts

@@ -0,0 +1,2 @@
+import '../../style';
+import './index.less';

package/es/Card/style/index.js

@@ -0,0 +1,2 @@
+import '../../style';
+import './index.less';

package/es/Card/style/index.less

@@ -0,0 +1 @@
+@import '../../style/index.less';

package/es/Dropdown/Button.js

@@ -9,7 +9,7 @@ import Button from '../Button';
 import '../Button/style'; // eslint-disable-next-line import/no-cycle
 
 import Dropdown from './index';
-import Icon from '../Icon';
+import ArrowsDownLine from '../Icon/icons/ArrowsDownLine';
 export default function DropdownButton(props) {
   var children = props.children,
       overlay = props.overlay,
@@ -27,7 +27,7 @@ export default function DropdownButton(props) {
     visible: visible,
     disabled: disabled,
     onVisibleChange: onVisibleChange
-  }, /*#__PURE__*/React.createElement(Button, Object.assign({}, buttonProps), children, /*#__PURE__*/React.createElement(Icon, {
-    type: "arrows-down-line"
+  }, /*#__PURE__*/React.createElement(Button, Object.assign({}, buttonProps), children, /*#__PURE__*/React.createElement(ArrowsDownLine, {
+    fill: "currentColor"
   })));
 }

package/es/Icon/icons/CheckLine.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface IconProps extends React.SVGProps<SVGSVGElement> {
+    size?: string | number;
+    width?: string | number;
+    height?: string | number;
+    spin?: boolean;
+    rtl?: boolean;
+    color?: string;
+    fill?: string;
+    stroke?: string;
+}
+export default function CheckLine(props: IconProps): JSX.Element;
+export {};

package/es/Icon/icons/CheckLine.js

@@ -0,0 +1,73 @@
+var _excluded = ["size", "width", "height", "spin", "rtl", "color", "fill", "stroke", "className"];
+
+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; }
+
+import React, { useEffect, useRef } from 'react';
+import styles from './style.css';
+export default function CheckLine(props) {
+  var root = useRef(null);
+
+  var _props$size = props.size,
+      size = _props$size === void 0 ? '1em' : _props$size,
+      width = props.width,
+      height = props.height,
+      spin = props.spin,
+      rtl = props.rtl,
+      color = props.color,
+      fill = props.fill,
+      stroke = props.stroke,
+      className = props.className,
+      rest = _objectWithoutProperties(props, _excluded);
+
+  var _width = width || size;
+
+  var _height = height || size;
+
+  var _stroke = stroke || color;
+
+  var _fill = fill || color;
+
+  useEffect(function () {
+    if (!_fill) {
+      var _root$current;
+
+      (_root$current = root.current) === null || _root$current === void 0 ? void 0 : _root$current.querySelectorAll('[data-follow-fill]').forEach(function (item) {
+        item.setAttribute('fill', item.getAttribute('data-follow-fill') || '');
+      });
+    }
+
+    if (!_stroke) {
+      var _root$current2;
+
+      (_root$current2 = root.current) === null || _root$current2 === void 0 ? void 0 : _root$current2.querySelectorAll('[data-follow-stroke]').forEach(function (item) {
+        item.setAttribute('stroke', item.getAttribute('data-follow-stroke') || '');
+      });
+    }
+  }, [stroke, color, fill]);
+  return /*#__PURE__*/React.createElement("svg", Object.assign({
+    ref: root,
+    width: _width,
+    height: _height,
+    viewBox: "0 0 24 24",
+    preserveAspectRatio: "xMidYMid meet",
+    fill: "none",
+    role: "presentation",
+    xmlns: "http://www.w3.org/2000/svg",
+    className: "".concat(className || '', " ").concat(spin ? styles.spin : '', " ").concat(rtl ? styles.rtl : '').trim()
+  }, rest), /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("g", {
+    clipPath: "url(#650c5__a)"
+  }, /*#__PURE__*/React.createElement("path", {
+    "data-follow-fill": "#001A33",
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M23.646 2.237a1 1 0 0 1 .117 1.41L9.023 21.051l-.002.003a2.69 2.69 0 0 1-.942.705 2.727 2.727 0 0 1-2.313-.036 2.684 2.684 0 0 1-.931-.749L.218 15.183a1 1 0 0 1 1.564-1.247l4.623 5.8a.684.684 0 0 0 .238.19.727.727 0 0 0 .615.01.688.688 0 0 0 .24-.179H7.5L22.237 2.353a1 1 0 0 1 1.41-.117Z",
+    fill: _fill
+  })), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
+    id: "650c5__a"
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M0 0h24v24H0z",
+    fill: "#fff"
+  })))));
+}

package/es/Modal/index.js

@@ -12,6 +12,8 @@ import confirm, { withWarn, withInfo, withSuccess, withError, withConfirm, modal
 import classNames from 'classnames';
 import Button from '../Button';
 import CloseLine from '../Icon/icons/CloseLine';
+import LocaleReceiver from '../locale-provider/LocaleReceiver';
+import { getConfirmLocale } from './locale';
 export var destroyFns = [];
 
 function modalWarn(props) {
@@ -34,15 +36,20 @@ var OriginModal = function OriginModal(props) {
       closeIcon = props.closeIcon,
       restProps = _objectWithoutProperties(props, _excluded);
 
-  var Footer = /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
-    size: "large",
-    onClick: onCancel
-  }, cancelText || '取消'), /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    loading: confirmLoading,
-    size: "large",
-    onClick: onOk
-  }, okText || '确定'));
+  var Footer = /*#__PURE__*/React.createElement(LocaleReceiver, {
+    componentName: "Modal",
+    defaultLocale: getConfirmLocale()
+  }, function (locale) {
+    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Button, {
+      size: "large",
+      onClick: onCancel
+    }, cancelText || (locale === null || locale === void 0 ? void 0 : locale.cancelText)), /*#__PURE__*/React.createElement(Button, {
+      type: "primary",
+      loading: confirmLoading,
+      size: "large",
+      onClick: onOk
+    }, okText || (locale === null || locale === void 0 ? void 0 : locale.okText)));
+  });
   return /*#__PURE__*/React.createElement(_Modal, Object.assign({}, restProps, {
     onCancel: onCancel,
     footer: footer !== undefined ? footer : Footer,

package/es/Modal/locale.d.ts

@@ -0,0 +1,7 @@
+export interface IModalLocale {
+    okText: string;
+    cancelText: string;
+    justOkText: string;
+}
+export declare function changeConfirmLocale(newLocale?: IModalLocale): void;
+export declare function getConfirmLocale(): IModalLocale;

package/es/Modal/locale.js

@@ -0,0 +1,20 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+import defaultLocale from '../locale/default';
+
+var runtimeLocale = _objectSpread({}, defaultLocale.Modal);
+
+export function changeConfirmLocale(newLocale) {
+  if (newLocale) {
+    runtimeLocale = _objectSpread(_objectSpread({}, runtimeLocale), newLocale);
+  } else {
+    runtimeLocale = _objectSpread({}, defaultLocale.Modal);
+  }
+}
+export function getConfirmLocale() {
+  return runtimeLocale;
+}

package/es/Navigator/components/MenuItem/index.d.ts

@@ -7,7 +7,7 @@ export interface IMenuItem {
     groupTitle: string | null;
     children: IMenuItemContentProps[];
 }
-interface IMenuItemContentProps {
+export interface IMenuItemContentProps {
     menuIcon: React.ReactNode;
     content: string | React.ReactNode;
     key: string;

package/es/Navigator/index.d.ts

@@ -47,5 +47,5 @@ export interface INavigatorProps {
     }) => void;
 }
 export type { IMenuItem } from './components/Menu';
-export type { ISelectedMenuInfo } from './components/MenuItem';
+export type { ISelectedMenuInfo, IMenuItemContentProps } from './components/MenuItem';
 export default Navigator;

package/es/Select/rc-select/OptionList.js

@@ -39,7 +39,7 @@ import { isPlatformMac } from './utils/platformUtil';
 import useBaseProps from './hooks/useBaseProps';
 import SelectContext from './SelectContext';
 import Checkbox from '../../Checkbox';
-import Icon from '../../Icon';
+import CheckLine from '../../Icon/icons/CheckLine';
 import colors from '../../style/themes/default/themeColor.module.less';
 
 function isTitleType(content) {
@@ -382,10 +382,9 @@ var OptionList = function OptionList(_, ref) {
       style: style
     }), !multiple && /*#__PURE__*/React.createElement("div", {
       className: 'ald-select-single-check'
-    }, selected && /*#__PURE__*/React.createElement(Icon, {
+    }, selected && /*#__PURE__*/React.createElement(CheckLine, {
       color: colors.B60,
-      size: '1em',
-      type: "check"
+      size: '1em'
     })), multiple && /*#__PURE__*/React.createElement(Checkbox, {
       className: 'ald-select-multiple-checkbox',
       checked: selected,

package/es/Select/rc-select/Selector/MultipleSelector.js

@@ -48,7 +48,8 @@ var SelectSelector = function SelectSelector(props) {
       removeIcon = props.removeIcon,
       _props$maxTagCount = props.maxTagCount,
       maxTagCount = _props$maxTagCount === void 0 ? "responsive" : _props$maxTagCount,
-      maxTagTextLength = props.maxTagTextLength,
+      _props$maxTagTextLeng = props.maxTagTextLength,
+      maxTagTextLength = _props$maxTagTextLeng === void 0 ? 10 : _props$maxTagTextLeng,
       _props$maxTagPlacehol = props.maxTagPlaceholder,
       maxTagPlaceholder = _props$maxTagPlacehol === void 0 ? function (omittedValues) {
     return "\u7B49".concat(omittedValues.length, "\u9879");
@@ -160,6 +161,15 @@ var SelectSelector = function SelectSelector(props) {
   }
 
   function renderRest(omittedValues) {
+    if (omittedValues.length === values.length && omittedValues.length) {
+      var length = values.length;
+
+      var _content = "\u5DF2\u9009".concat(length, "\u9879");
+
+      return defaultRenderSelector(_content, _content, false);
+      ;
+    }
+
     var content = typeof maxTagPlaceholder === 'function' ? maxTagPlaceholder(omittedValues) : maxTagPlaceholder;
     return defaultRenderSelector(content, content, false);
   } // >>> Input Node

package/es/Select/style/index.less

@@ -143,6 +143,12 @@
         line-height: @selector-lineHeight-large;
       }
     }
+
+    &.ant-select-show-arrow {
+      .ant-select-selector {
+        padding-right: @selector-paddingHorizontal-large + @selector-fontSize-large;
+      }
+    }
   }
 
   &.ald-select-middle {
@@ -166,6 +172,12 @@
         line-height: @selector-lineHeight-middle;
       }
     }
+
+    &.ant-select-show-arrow {
+      .ant-select-selector {
+        padding-right: @selector-paddingHorizontal-middle + @selector-fontSize-middle;
+      }
+    }
   }
 
   &.ald-select-small {
@@ -189,6 +201,12 @@
         line-height: @selector-lineHeight-small;
       }
     }
+
+    &.ant-select-show-arrow {
+      .ant-select-selector {
+        padding-right: @selector-paddingHorizontal-small + @selector-fontSize-small;
+      }
+    }
   }
 
   &.ald-select-mini {
@@ -212,6 +230,12 @@
         line-height: @selector-lineHeight-mini;
       }
     }
+
+    &.ant-select-show-arrow {
+      .ant-select-selector {
+        padding-right: @selector-paddingHorizontal-mini + @selector-fontSize-mini;
+      }
+    }
   }
 
   &.ant-select-multiple {

package/es/Select/utils/iconUtil.d.ts

@@ -18,7 +18,7 @@ export default function getIcons({ suffixIcon, clearIcon, menuItemSelectedIcon,
         open: boolean;
         showSearch: boolean;
     }) => JSX.Element);
-    itemIcon: {} | null;
-    removeIcon: {} | null;
+    itemIcon: number | boolean | JSX.Element | React.ReactFragment | ((props: any) => React.ReactNode) | null;
+    removeIcon: number | boolean | JSX.Element | React.ReactFragment | ((props: any) => React.ReactNode) | null;
 };
 export {};

package/es/Select/utils/iconUtil.js

@@ -2,7 +2,9 @@ import * as React from 'react';
 import LoadingOutlined from '@ant-design/icons/LoadingOutlined';
 import CheckOutlined from '@ant-design/icons/CheckOutlined';
 import CloseCircleFilled from '@ant-design/icons/CloseCircleFilled';
-import Icon from '../../Icon';
+import CancelFill from '../../Icon/icons/CancelFill';
+import Color from '../../style/themes/default/themeColor.module.less';
+import ArrowsDownLine from '../../Icon/icons/ArrowsDownLine';
 export default function getIcons(_ref) {
   var suffixIcon = _ref.suffixIcon,
       clearIcon = _ref.clearIcon,
@@ -44,8 +46,8 @@ export default function getIcons(_ref) {
       // if (open && showSearch) {
       //   return getSuffixIconNode(<SearchOutlined className={iconCls} />);
       // }
-      return getSuffixIconNode( /*#__PURE__*/React.createElement(Icon, {
-        type: "arrows-down-line",
+      return getSuffixIconNode( /*#__PURE__*/React.createElement(ArrowsDownLine, {
+        color: Color.NL50,
         className: iconCls
       }));
     };
@@ -67,8 +69,8 @@ export default function getIcons(_ref) {
   if (removeIcon !== undefined) {
     mergedRemoveIcon = removeIcon;
   } else {
-    mergedRemoveIcon = /*#__PURE__*/React.createElement(Icon, {
-      type: 'close',
+    mergedRemoveIcon = /*#__PURE__*/React.createElement(CancelFill, {
+      color: Color.NL50,
       size: '1em'
     });
   }

package/es/Table/Table.js

@@ -402,7 +402,7 @@ function Table(props, ref) {
         }), row.cells.map(function (cell) {
           return /*#__PURE__*/React.createElement("div", Object.assign({}, cell.getCellProps(), {
             className: classnames("".concat(prefixCls, "-cell"))
-          }), cell.render('Cell'));
+          }), /*#__PURE__*/React.createElement(React.Fragment, null, cell.render('Cell')));
         }));
       });
     };
@@ -456,9 +456,9 @@ function Table(props, ref) {
         style: {
           width: '100%'
         }
-      }), column.render('Header'), /*#__PURE__*/React.createElement(SortIcons, {
+      }), /*#__PURE__*/React.createElement(React.Fragment, null, column.render('Header'), /*#__PURE__*/React.createElement(SortIcons, {
         id: column.id
-      })), /*#__PURE__*/React.createElement("div", Object.assign({}, barPorps, {
+      }))), /*#__PURE__*/React.createElement("div", Object.assign({}, barPorps, {
         className: classnames(_defineProperty({}, "".concat(prefixCls, "-dragBar"), resizeColumn), "".concat(prefixCls, "-bar"))
       })));
     }));

package/es/Tabs/index.js

@@ -14,8 +14,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 import React from 'react'; // import AntdTabs, { TabsProps } from 'antd/lib/tabs';
 
-import Icon from '../Icon';
-import Button from '../Button';
+import More from '../Icon/icons/More';
 import TabPane from './TabPane';
 import classNames from 'classnames';
 export default function Tabs(props) {
@@ -32,13 +31,11 @@ export default function Tabs(props) {
   }
 
   return /*#__PURE__*/React.createElement(_Tabs, Object.assign({
-    moreIcon: /*#__PURE__*/React.createElement(Button, {
-      size: "default",
-      type: "text",
-      icon: /*#__PURE__*/React.createElement(Icon, {
-        type: "more"
-      })
-    }),
+    moreIcon: /*#__PURE__*/React.createElement("div", {
+      className: "ald-tabs-moreIcon"
+    }, /*#__PURE__*/React.createElement(More, {
+      color: "currentColor"
+    })),
     tabBarGutter: 24,
     popupClassName: classNames(popupClassName, 'ald-tabs-dropdown'),
     className: classNames('ald-tabs', className, {

package/es/Tabs/style/index.less

@@ -1,3 +1,4 @@
+/* stylelint-disable no-descending-specificity */
 @import '../../style/index.less';
 @import '../../Button/style/index.less';
 //status- default
@@ -60,6 +61,12 @@
     .ant-tabs-ink-bar {
       height: @Tabs-ink-link-bar-height-large;
     }
+
+    .ald-tabs-moreIcon {
+      width: 36px;
+      height: 36px;
+      border-radius: 8px;
+    }
   }
 
   &.ald-tabs-default {
@@ -67,10 +74,35 @@
       font-size: @Tabs-fontSize;
       line-height: @Tabs-lineHeight;
     }
+
+    .ald-tabs-moreIcon {
+      width: 32px;
+      height: 32px;
+      border-radius: 6px;
+    }
   }
 
   .ant-tabs-nav-more {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
     margin: 0 !important;
+    padding: 2px;
+
+    .ald-tabs-moreIcon {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: inherit;
+      font-size: inherit;
+    }
+
+    &.ant-tabs-dropdown-open {
+      .ald-tabs-moreIcon {
+        color: @B60;
+        background-color: @NL97;
+      }
+    }
   }
 
   /* body自适应高度 */

package/es/index.d.ts

@@ -20,6 +20,8 @@ export { default as Navigator } from './Navigator';
 export type { INavigatorProps as NavigatorProps, IMenuItem as NavigatorMenu, ISelectedMenuInfo as SelectedMenuInfo, } from './Navigator';
 export { default as Alert } from './Alert';
 export type { AlertProps } from './Alert';
+export { default as Card } from './Card';
+export type { CardProps } from './Card';
 export { default as Col } from './Col';
 export type { ColProps } from './Col';
 export type { TypographyProps } from './Typography';

package/es/index.js

@@ -9,6 +9,7 @@ export { default as Select } from './Select';
 export { default as Table } from './Table';
 export { default as Navigator } from './Navigator';
 export { default as Alert } from './Alert';
+export { default as Card } from './Card';
 export { default as Col } from './Col';
 export { default as Typography } from './Typography';
 export { default as Upload } from './Upload';

package/es/locale/default.d.ts

@@ -0,0 +1,2 @@
+import defaultLocale from './zh_CN';
+export default defaultLocale;

package/es/locale/default.js

@@ -0,0 +1,2 @@
+import defaultLocale from './zh_CN';
+export default defaultLocale;

package/es/locale/en_US.d.ts

@@ -0,0 +1,3 @@
+import type { Locale } from '../locale-provider';
+declare const localeValues: Locale;
+export default localeValues;

package/es/locale/en_US.js

@@ -0,0 +1,132 @@
+/* eslint-disable no-template-curly-in-string */
+import Pagination from 'rc-pagination/lib/locale/en_US';
+import Calendar from 'antd/es/calendar/locale/en_US';
+import DatePicker from 'antd/es/date-picker/locale/en_US';
+import TimePicker from 'antd/es/time-picker/locale/en_US';
+var typeTemplate = '${label} is not a valid ${type}';
+var localeValues = {
+  locale: 'en',
+  Pagination: Pagination,
+  DatePicker: DatePicker,
+  TimePicker: TimePicker,
+  Calendar: Calendar,
+  global: {
+    placeholder: 'Please select'
+  },
+  Table: {
+    filterTitle: 'Filter menu',
+    filterConfirm: 'OK',
+    filterReset: 'Reset',
+    filterEmptyText: 'No filters',
+    filterCheckall: 'Select all items',
+    filterSearchPlaceholder: 'Search in filters',
+    emptyText: 'No data',
+    selectAll: 'Select current page',
+    selectInvert: 'Invert current page',
+    selectNone: 'Clear all data',
+    selectionAll: 'Select all data',
+    sortTitle: 'Sort',
+    expand: 'Expand row',
+    collapse: 'Collapse row',
+    triggerDesc: 'Click to sort descending',
+    triggerAsc: 'Click to sort ascending',
+    cancelSort: 'Click to cancel sorting'
+  },
+  Modal: {
+    okText: 'OK',
+    cancelText: 'Cancel',
+    justOkText: 'OK'
+  },
+  Popconfirm: {
+    okText: 'OK',
+    cancelText: 'Cancel'
+  },
+  Transfer: {
+    titles: ['', ''],
+    searchPlaceholder: 'Search here',
+    itemUnit: 'item',
+    itemsUnit: 'items',
+    remove: 'Remove',
+    selectCurrent: 'Select current page',
+    removeCurrent: 'Remove current page',
+    selectAll: 'Select all data',
+    removeAll: 'Remove all data',
+    selectInvert: 'Invert current page'
+  },
+  Upload: {
+    uploading: 'Uploading...',
+    removeFile: 'Remove file',
+    uploadError: 'Upload error',
+    previewFile: 'Preview file',
+    downloadFile: 'Download file'
+  },
+  Empty: {
+    description: 'No Data'
+  },
+  Icon: {
+    icon: 'icon'
+  },
+  Text: {
+    edit: 'Edit',
+    copy: 'Copy',
+    copied: 'Copied',
+    expand: 'Expand'
+  },
+  PageHeader: {
+    back: 'Back'
+  },
+  Form: {
+    optional: '(optional)',
+    defaultValidateMessages: {
+      default: 'Field validation error for ${label}',
+      required: 'Please enter ${label}',
+      enum: '${label} must be one of [${enum}]',
+      whitespace: '${label} cannot be a blank character',
+      date: {
+        format: '${label} date format is invalid',
+        parse: '${label} cannot be converted to a date',
+        invalid: '${label} is an invalid date'
+      },
+      types: {
+        string: typeTemplate,
+        method: typeTemplate,
+        array: typeTemplate,
+        object: typeTemplate,
+        number: typeTemplate,
+        date: typeTemplate,
+        boolean: typeTemplate,
+        integer: typeTemplate,
+        float: typeTemplate,
+        regexp: typeTemplate,
+        email: typeTemplate,
+        url: typeTemplate,
+        hex: typeTemplate
+      },
+      string: {
+        len: '${label} must be ${len} characters',
+        min: '${label} must be at least ${min} characters',
+        max: '${label} must be up to ${max} characters',
+        range: '${label} must be between ${min}-${max} characters'
+      },
+      number: {
+        len: '${label} must be equal to ${len}',
+        min: '${label} must be minimum ${min}',
+        max: '${label} must be maximum ${max}',
+        range: '${label} must be between ${min}-${max}'
+      },
+      array: {
+        len: 'Must be ${len} ${label}',
+        min: 'At least ${min} ${label}',
+        max: 'At most ${max} ${label}',
+        range: 'The amount of ${label} must be between ${min}-${max}'
+      },
+      pattern: {
+        mismatch: '${label} does not match the pattern ${pattern}'
+      }
+    }
+  },
+  Image: {
+    preview: 'Preview'
+  }
+};
+export default localeValues;