@aloudata/aloudata-design 0.2.0-beta.7 → 0.2.1

package/lib/Table/react-table-config.d.ts

@@ -46,7 +46,7 @@ import {
   UseSortByHooks,
   UseSortByInstanceProps,
   UseSortByOptions,
-  UseSortByState
+  UseSortByState,
 } from 'react-table';
 
 declare module 'react-table' {
@@ -54,69 +54,69 @@ declare module 'react-table' {
 
   export interface TableOptions<D extends Record<string, unknown>>
     extends UseExpandedOptions<D>,
-    UseFiltersOptions<D>,
-    UseGlobalFiltersOptions<D>,
-    UseGroupByOptions<D>,
-    UsePaginationOptions<D>,
-    UseResizeColumnsOptions<D>,
-    UseRowSelectOptions<D>,
-    UseRowStateOptions<D>,
-    UseSortByOptions<D>,
-    // note that having Record here allows you to add anything to the options, this matches the spirit of the
-    // underlying js library, but might be cleaner if it's replaced by a more specific type that matches your
-    // feature set, this is a safe default.
-    Record<string, unknown> {}
+      UseFiltersOptions<D>,
+      UseGlobalFiltersOptions<D>,
+      UseGroupByOptions<D>,
+      UsePaginationOptions<D>,
+      UseResizeColumnsOptions<D>,
+      UseRowSelectOptions<D>,
+      UseRowStateOptions<D>,
+      UseSortByOptions<D>,
+      // note that having Record here allows you to add anything to the options, this matches the spirit of the
+      // underlying js library, but might be cleaner if it's replaced by a more specific type that matches your
+      // feature set, this is a safe default.
+      Record<string, unknown> {}
 
   export interface Hooks<D extends Record<string, unknown> = Record<string, unknown>>
     extends UseExpandedHooks<D>,
-    UseGroupByHooks<D>,
-    UseRowSelectHooks<D>,
-    UseSortByHooks<D> {}
+      UseGroupByHooks<D>,
+      UseRowSelectHooks<D>,
+      UseSortByHooks<D> {}
 
   export interface TableInstance<D extends Record<string, unknown> = Record<string, unknown>>
     extends UseColumnOrderInstanceProps<D>,
-    UseExpandedInstanceProps<D>,
-    UseFiltersInstanceProps<D>,
-    UseGlobalFiltersInstanceProps<D>,
-    UseGroupByInstanceProps<D>,
-    UsePaginationInstanceProps<D>,
-    UseRowSelectInstanceProps<D>,
-    UseRowStateInstanceProps<D>,
-    UseSortByInstanceProps<D> {}
+      UseExpandedInstanceProps<D>,
+      UseFiltersInstanceProps<D>,
+      UseGlobalFiltersInstanceProps<D>,
+      UseGroupByInstanceProps<D>,
+      UsePaginationInstanceProps<D>,
+      UseRowSelectInstanceProps<D>,
+      UseRowStateInstanceProps<D>,
+      UseSortByInstanceProps<D> {}
 
   export interface TableState<D extends Record<string, unknown> = Record<string, unknown>>
     extends UseColumnOrderState<D>,
-    UseExpandedState<D>,
-    UseFiltersState<D>,
-    UseGlobalFiltersState<D>,
-    UseGroupByState<D>,
-    UsePaginationState<D>,
-    UseResizeColumnsState<D>,
-    UseRowSelectState<D>,
-    UseRowStateState<D>,
-    UseSortByState<D> {}
+      UseExpandedState<D>,
+      UseFiltersState<D>,
+      UseGlobalFiltersState<D>,
+      UseGroupByState<D>,
+      UsePaginationState<D>,
+      UseResizeColumnsState<D>,
+      UseRowSelectState<D>,
+      UseRowStateState<D>,
+      UseSortByState<D> {}
 
   export interface ColumnInterface<D extends Record<string, unknown> = Record<string, unknown>>
     extends UseFiltersColumnOptions<D>,
-    UseGlobalFiltersColumnOptions<D>,
-    UseGroupByColumnOptions<D>,
-    UseResizeColumnsColumnOptions<D>,
-    UseSortByColumnOptions<D> {}
+      UseGlobalFiltersColumnOptions<D>,
+      UseGroupByColumnOptions<D>,
+      UseResizeColumnsColumnOptions<D>,
+      UseSortByColumnOptions<D> {}
 
   export interface ColumnInstance<D extends Record<string, unknown> = Record<string, unknown>>
     extends UseFiltersColumnProps<D>,
-    UseGroupByColumnProps<D>,
-    UseResizeColumnsColumnProps<D>,
-    UseSortByColumnProps<D> {}
+      UseGroupByColumnProps<D>,
+      UseResizeColumnsColumnProps<D>,
+      UseSortByColumnProps<D> {}
 
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   export interface Cell<D extends Record<string, unknown> = Record<string, unknown>, V = unknown>
     extends UseGroupByCellProps<D>,
-    UseRowStateCellProps<D> {}
+      UseRowStateCellProps<D> {}
 
   export interface Row<D extends Record<string, unknown> = Record<string, unknown>>
     extends UseExpandedRowProps<D>,
-    UseGroupByRowProps<D>,
-    UseRowSelectRowProps<D>,
-    UseRowStateRowProps<D> {}
-}
+      UseGroupByRowProps<D>,
+      UseRowSelectRowProps<D>,
+      UseRowStateRowProps<D> {}
+}

package/lib/Table/style/index.less

@@ -1,37 +1,86 @@
 @import '../../style/index.less';
 
-@ald-prefix:ant;
-@ald-iconfont-css-prefix:anticon;
-@table-row-height:40px;
-.@{ald-prefix}-block-table {
+@ald-prefix: ant;
+@ald-iconfont-css-prefix: anticon;
+@table-row-height: 40px;
+
+.ant-block-table {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
   overflow: hidden;
 
+  &-page-loading {
+    opacity: 0;
+  }
+
+  &-table-wrap {
+    display: flex;
+    flex: 1;
+    flex-direction: column;
+    overflow: hidden;
+  }
+
+  &-cell {
+    flex-grow: 1;
+    height: unset;
+    padding: 12px;
+    color: @NL0;
+    line-height: 16px;
+    text-align: left;
+    word-break: break-all;
+    border-bottom: 1px solid @NL95;
+
+    &-content {
+      flex: 1;
+    }
+  }
+
+  &-row {
+    max-width: 100%;
+    height: 40px;
+
+    &-ellipsis {
+      .ant-block-table-cell {
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+      }
+    }
+  }
+
   &-thead {
-    .@{ald-prefix}-block-table-cell {
+    .ant-block-table-cell {
       position: relative;
       color: @NL50;
 
       &-sorting {
         color: @B40;
       }
-      // border: 1px solid red;
 
-      .@{ald-prefix}-block-table-bar {
-        display: inline-block;
-        background: blue;
-        width: 1px;
-        height: 12px;
+      .ant-block-table-bar {
         position: absolute;
         top: 50%;
-        right: 0;
-        transform: translateY(-50%);
+        right: -12px;
         z-index: 1;
+        display: inline-block;
+        width: 12px;
+        height: 12px;
+        transform: translateY(-50%);
         touch-action: none;
-        background-color: @NL95;
+
+        &::after {
+          display: block;
+          width: 1px;
+          height: 100%;
+          background-color: @NL95;
+          content: '';
+        }
       }
 
       &:last-child {
-        .@{ald-prefix}-block-table-bar {
+        .ant-block-table-bar {
           display: none;
         }
       }
@@ -39,13 +88,16 @@
   }
 
   &-tbody {
+    flex: 1;
     overflow: hidden;
 
-    &-scroll {
-      overflow-y: scroll;
-      overflow-y: overlay;
+    .ant-empty {
+      display: flex;
+      justify-content: center;
+      padding-top: 80px;
     }
-    .@{ald-prefix}-block-table-row {
+
+    .ant-block-table-row {
       &:hover {
         background-color: @NL97;
       }
@@ -57,85 +109,91 @@
           background-color: @BBG97;
         }
       }
-
-      &:last-of-type {
-        .@{ald-prefix}-block-table-cell {
-          border-bottom: 1px solid transparent;
-        }
-      }
     }
   }
 
-  &-row {
-    max-width: 100%;
-  }
-
-  &-cell {
-    padding: 0 12px;
-    height: @table-row-height;
-    line-height: @table-row-height;
-    border-bottom: 1px solid @NL95;
-    text-align: left;
-    color: @NL0;
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    flex-grow: 1;
-  }
-
   &-loading {
-    text-align: center;
-    line-height: @table-row-height;
     color: @NL80;
+    line-height: @table-row-height;
+    text-align: center;
   }
 
   &-header {
     display: flex;
-    justify-content: space-between;
-    padding: 0 10px;
     align-items: center;
+    justify-content: space-between;
     margin-bottom: 24px;
 
     &-left {
+      color: @NL0;
       font-weight: 500;
       font-size: 14px;
-      color: @NL0;
     }
 
     &-right {
       display: flex;
-      height: 28px;
       align-items: center;
-      font-size: 14px;
+      justify-content: flex-end;
+      height: 28px;
       color: @NL0;
+      font-size: 14px;
     }
   }
 
-  &-list {
+  /* stylelint-disable-next-line selector-class-pattern */
+  &-list&-innerScroll {
+    height: 100%;
     overflow: overlay !important;
   }
 
+  // 当出现多行的时候 会顶出一个滚动条 通过复写三方库的样式覆盖
+  &-list&-canNotInnerScroll {
+    overflow: hidden !important;
+  }
+
+  &-list {
+    &::-webkit-scrollbar-thumb {
+      background: @NL90;
+      background-clip: padding-box;
+      border: 3px solid transparent;
+      border-radius: 6px;
+    }
+
+    &::-webkit-scrollbar {
+      width: 12px;
+      height: 12px;
+      min-height: 12px;
+      background-color: transparent;
+    }
+  }
+
   &-sortIcon {
-    margin-left: 4px;
     margin-top: -2px;
+    margin-left: 4px;
   }
 
   &-column-resizable {
     overflow: overlay;
-    .@{ald-prefix}-block-table {
-      &-cell {
-        flex: none;
-      }
 
-      &-thead {
-        &::-webkit-scrollbar {
-          display: none;
+    .ant-block-table-thead,
+    .ant-block-table-tbody {
+      .ant-block-table-row {
+        .ant-block-table {
+          &-cell {
+            flex: none;
+          }
+
+          &-thead {
+            &::-webkit-scrollbar {
+              display: none;
+            }
+          }
+
+          &-tbody {
+            overflow: initial;
+          }
         }
       }
-
-      &-tbody {
-        overflow: initial;
-      }
     }
   }
-}
+}

package/lib/Tabs/index.d.ts

@@ -31,6 +31,11 @@ export interface ITabsProps {
      * @default false
      */
     adaptHeight?: boolean;
+    /**
+     * @description tab的位置
+     * @default -
+     */
+    tabPosition?: 'left' | 'right' | 'top' | 'bottom';
     className?: string;
     children?: React.ReactNode;
 }

package/lib/Tabs/index.js

@@ -5,9 +5,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = Tabs;
 
-var _react = _interopRequireDefault(require("react"));
+require("antd/es/tabs/style");
+
+var _tabs = _interopRequireDefault(require("antd/es/tabs"));
 
-var _tabs = _interopRequireDefault(require("antd/lib/tabs"));
+var _react = _interopRequireDefault(require("react"));
 
 var _Icon = _interopRequireDefault(require("../Icon"));
 
@@ -48,7 +50,8 @@ function Tabs(props) {
     }),
     tabBarGutter: 24,
     className: (0, _classnames.default)('ald-tabs', className, {
-      'ald-adapt-height': adaptHeight
+      'ald-adapt-height': adaptHeight,
+      'ald-tabs-default': size !== 'large'
     })
   }, tabsProps));
 }

package/lib/Tabs/style/index.d.ts

@@ -1,2 +1,3 @@
+import 'antd/lib/tabs/style';
 import '../../style';
 import './index.less';

package/lib/Tabs/style/index.js

@@ -1,5 +1,7 @@
 "use strict";
 
+require("antd/lib/tabs/style");
+
 require("../../style");
 
 require("./index.less");

package/lib/Tabs/style/index.less

@@ -1,6 +1,6 @@
 @import '../../style/index.less';
 
-.ald-tabs {
+.ant-tabs.ald-tabs {
   &.ant-tabs {
     color: @NL30;
   }
@@ -30,6 +30,13 @@
     }
   }
 
+  &.ald-tabs-default {
+    .ant-tabs-tab {
+      font-size: 14px;
+      line-height: 20px;
+    }
+  }
+
   .ant-tabs-nav-more {
     margin: 0 !important;
   }
@@ -58,4 +65,4 @@
       border-color: @NL90;
     }
   }
-}
+}

package/lib/Tooltip/style/index.less

@@ -3,9 +3,9 @@
 .ald-tooltip-overlay {
   .ant-tooltip-inner {
     padding: 6px 12px;
+    background: @BG10;
     border-radius: @border-radius-base;
     box-shadow: none;
-    background: @BG10;
   }
 
   .ant-tooltip-arrow-content {

package/lib/Tree/index.d.ts

@@ -0,0 +1,5 @@
+import Tree from 'antd/es/tree';
+export { DataNode, EventDataNode } from 'antd/es/tree';
+export { TreeProps, AntTreeNode, AntTreeNodeMouseEvent, AntTreeNodeExpandedEvent, AntTreeNodeCheckedEvent, AntTreeNodeSelectedEvent, AntdTreeNodeAttribute, AntTreeNodeProps, } from 'antd/es/tree/Tree';
+export { ExpandAction as DirectoryTreeExpandAction, DirectoryTreeProps, } from 'antd/es/tree/DirectoryTree';
+export default Tree;

package/lib/Tree/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _tree = _interopRequireDefault(require("antd/es/tree"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _default = _tree.default;
+exports.default = _default;

package/lib/Tree/style/index.d.ts

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

package/lib/Tree/style/index.js

@@ -0,0 +1,5 @@
+"use strict";
+
+require("../../style");
+
+require("./index.less");

package/lib/Tree/style/index.less

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

package/lib/Typography/index.d.ts

@@ -0,0 +1,3 @@
+import { Typography, TypographyProps } from 'antd';
+export type { TypographyProps };
+export default Typography;

package/lib/Typography/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("antd/es/typography/style");
+
+var _typography = _interopRequireDefault(require("antd/es/typography"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _default = _typography.default;
+exports.default = _default;

package/lib/Typography/style/index.d.ts

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

package/lib/Typography/style/index.js

@@ -0,0 +1,5 @@
+"use strict";
+
+require("../../style");
+
+require("./index.less");

package/lib/Typography/style/index.less

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

package/lib/Upload/index.d.ts

@@ -0,0 +1,4 @@
+import { Upload } from 'antd';
+export type { UploadProps, UploadListProps, UploadChangeParam, RcFile, } from 'antd/es/upload/interface';
+export type { DraggerProps } from 'antd/es/upload/Dragger';
+export default Upload;

package/lib/Upload/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("antd/es/upload/style");
+
+var _upload = _interopRequireDefault(require("antd/es/upload"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _default = _upload.default;
+exports.default = _default;

package/lib/Upload/style/index.d.ts

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

package/lib/Upload/style/index.js

@@ -0,0 +1,5 @@
+"use strict";
+
+require("../../style");
+
+require("./index.less");

package/lib/Upload/style/index.less

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

package/lib/_utils/hooks/useControlledState.d.ts

@@ -1,2 +1,2 @@
-declare const useControlledState: <T>(outterState: T | (() => T) | undefined, defaultOutterState: T, callback?: ((state: T | (() => T)) => void) | undefined) => [T, (state: T | (() => T), force?: boolean | undefined) => void];
+declare const useControlledState: <T>(outerState: T | (() => T) | undefined, defaultOuterState: T, callback?: ((state: T | (() => T)) => void) | undefined) => [T, (state: T | (() => T), force?: boolean | undefined) => void];
 export default useControlledState;

package/lib/_utils/hooks/useControlledState.js

@@ -24,18 +24,18 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function format(_ref) {
   var _ref2 = _slicedToArray(_ref, 2),
       innerState = _ref2[0],
-      outterState = _ref2[1];
+      outerState = _ref2[1];
 
-  var isControlled = (0, _lodash.isUndefined)(outterState) ? 'uncontrolled' : 'controlled';
-  var value = (0, _lodash.isUndefined)(outterState) ? innerState : outterState;
+  var isControlled = (0, _lodash.isUndefined)(outerState) ? 'uncontrolled' : 'controlled';
+  var value = (0, _lodash.isUndefined)(outerState) ? innerState : outerState;
   return "State is ".concat(isControlled, " | Value is ").concat(value);
 }
 
-var useControlledState = function useControlledState(outterState, defaultOutterState, callback) {
-  // if (outterState === undefined && defaultOutterState === undefined) {
+var useControlledState = function useControlledState(outerState, defaultOuterState, callback) {
+  // if (outerState === undefined && defaultOuterState === undefined) {
   //   throw new TypeError('Either "value" or "defaultValue" variable must be set. Now both are undefined');
   // }
-  var _useState = (0, _react.useState)((0, _lodash.isUndefined)(outterState) ? defaultOutterState : outterState),
+  var _useState = (0, _react.useState)((0, _lodash.isUndefined)(outerState) ? defaultOuterState : outerState),
       _useState2 = _slicedToArray(_useState, 2),
       innerState = _useState2[0],
       setInnerState = _useState2[1];
@@ -43,19 +43,19 @@ var useControlledState = function useControlledState(outterState, defaultOutterS
   var setState = (0, _react.useRef)(function (state) {
     var force = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
 
-    if ((0, _lodash.isUndefined)(outterState) || force) {
+    if ((0, _lodash.isUndefined)(outerState) || force) {
       setInnerState(state);
     }
 
     callback === null || callback === void 0 ? void 0 : callback(state);
   }).current; // @ts-ignore
 
-  (0, _react.useDebugValue)([innerState, outterState], format);
+  (0, _react.useDebugValue)([innerState, outerState], format);
   (0, _react.useEffect)(function () {
-    if (!(0, _lodash.isUndefined)(outterState)) {
-      setInnerState(outterState);
+    if (!(0, _lodash.isUndefined)(outerState)) {
+      setInnerState(outerState);
     }
-  }, [outterState]);
+  }, [outerState]);
   return [innerState, setState];
 };