@aloudata/aloudata-design 0.2.0-beta.2 → 0.2.0-beta.5

package/lib/Select/style/index.less

@@ -1,532 +0,0 @@
-// @import './variables.less';
-@import '../../style/index.less';
-
-// @component-prefix:ant-;
-.font(@style: normal, @weight: 400, @size: @size-font-base) {
-  font-weight: @weight;
-  font-size: @size;
-  font-family: @font-family-primary;
-  font-style: @style;
-}
-
-// The prefix to use for components classes
-@component-prefix: ant;
-@ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
-// vertical margins
-@margin-lg: 24px; // containers
-@margin-md: 16px; // small containers and buttons
-@margin-sm: 12px; // Form controls and items
-@margin-xs: 8px; // small items
-@margin-xss: 4px; // more small
-
-@border-color-base: #a3adc8;
-@border-color-split: hsv(0, 0, 94%); // split border inside a component
-@border-color-inverse: #fff;
-@border-width-base: 1px; // width of the border for a component
-@border-style-base: solid; // style of a components border
-@border-color-disabled: #dfe2ed;
-@select-option-height-lg: @height-lg;
-@select-option-line-height-lg:16px;
-@select-option-height-base:@height-base;
-@select-option-height-sm:@height-sm;
-@line-height-base: 1.5715;
-// @mode: compact;
-
-// Base Text
-// @text-color-base: #313e75;
-// @text-color-disabled: #313e75;
-@text-font-size-base: 14px;
-// @text-lint-height-base: 22px;
-
-//Background Color
-// @background-color-base: #fff;
-// @background-color-disabled: #f7f8fc;
-
-@ald-prefix: ~'@{component-prefix}';
-@select-prefix-cls-legacy: ~'@{component-prefix}-select-legacy';
-@select-input-fontSize: @text-font-size-base;
-@select-input-fontSize-sm: @text-font-size-base - 2px;
-// @color-font-list-primary-normal: @palette-black-6; // $color-black-6
-// @color-box-shadow-focused: #c0c4d3;
-// @color-background-matchHeight: #ffcf3c;
-.@{select-prefix-cls-legacy} {
-  position: relative;
-  display: inline-block;
-  min-width: 120px;
-  overflow: hidden;
-  border: 1px solid transparent;
-  border-radius: @border-radius-base;
-  padding: 0 36px 0 12px;
-  outline: none;
-  transition: all 0.2s;
-  cursor: pointer;
-  user-select: none;
-
-  &-selector-wrap {
-    display: flex;
-    align-items: center;
-  }
-
-  &-selector {
-    box-sizing: border-box;
-    width: 100%;
-    min-height: @height-base;
-    max-height: @height-base * 3.5px;
-    overflow-x: hidden;
-    overflow-y: auto;
-    border-radius: @border-radius-base;
-    transition: all 0.2s;
-
-    &::-webkit-scrollbar {
-      width: 2px;
-      background-color: transparent;
-    }
-
-    // &::-webkit-scrollbar-thumb {
-    //   // background: @palette-gray-3;
-    // }
-  }
-
-  &-selector-label {
-    height: @height-base;
-    display: flex;
-    align-items: center;
-    line-height: @height-base;
-    font-size: @select-input-fontSize;
-    color: @NL30;
-    margin-right: @select-label-margin-right;
-    max-width: 50%;
-    overflow: hidden;
-    flex-shrink: 0;
-  }
-
-  &-values-wrapper {
-    position: relative;
-    width: 100%;
-    line-height: @height-base;
-    color: @NL0;
-  }
-
-  &-bordered {
-    border: 1px solid @NL90;
-  }
-
-  &-bordered:not(&-disabled):not(&-focused):hover {
-    border: 1px solid @B40;
-  }
-
-  // &:not(&-bordered):not(&-disabled):hover {
-  //   // background-color: @palette-gray-2;
-  //   // border: 1px solid transparent;
-  // }
-
-  &-focused:not(&-bordered):not(&-disabled) {
-    // background-color: @color-background-tree-normal;
-    // border: 1px solid @color-background-button-primary-hover;
-    border-radius: 4px;
-  }
-
-  &-focused {
-    // box-shadow: 0 0 6px 0 @color-box-shadow-focused;
-
-    .@{select-prefix-cls-legacy} {
-      &-item-all,
-      &-item {
-        opacity: 0.5;
-      }
-    }
-  }
-
-  &-arrow,
-  &-close {
-    position: absolute;
-    top: 0;
-    right: 12px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 100%;
-    // color: @color-text-table-empty;
-    // transition: all 0.2s;
-
-    &-focused {
-      transform: rotate(-180deg);
-    }
-  }
-
-  &-item {
-    max-width: 100%;
-    overflow: hidden;
-    font-size: @select-input-fontSize;
-    transition: margin 0.2s;
-
-    &-text {
-      overflow: hidden;
-      font-size: 14px;
-      line-height: 22px;
-      white-space: nowrap;
-      text-overflow: ellipsis;
-      color: @NL0;
-    }
-  }
-
-  &-tag-item {
-    max-width: 100%;
-    margin-right: 8px;
-    margin-bottom: 5px;
-  }
-
-  &-item-all {
-    display: inline-flex;
-    width: 100%;
-    font-size: @select-input-fontSize;
-    transition: margin 0.2s;
-    .@{select-prefix-cls-legacy}-overflow-item {
-      white-space: nowrap;
-
-      &:not(:first-child)::before {
-        content: ',';
-      }
-
-      &-rest {
-        &::before {
-          content: '' !important;
-        }
-      }
-    }
-
-    &-text {
-      overflow: hidden;
-      font-size: 14px;
-      line-height: 22px;
-      white-space: nowrap;
-      text-overflow: ellipsis;
-    }
-  }
-
-  &-placeholder {
-    position: absolute;
-    top: 0;
-    left: 0;
-    color: @select-placeholder-color;
-  }
-
-  &-input {
-    position: absolute;
-    top: 9px;
-    left: 0;
-    box-sizing: content-box;
-    padding: 0;
-    background: none;
-    border: none;
-    outline: none;
-  }
-
-  &-input-tags {
-    position: relative;
-    top: 0;
-  }
-
-  &-input-reference {
-    position: absolute;
-    top: 0;
-    left: 0;
-    z-index: -1;
-    visibility: hidden;
-  }
-
-  &-small {
-    border-radius: @border-radius-sm;
-    .@{select-prefix-cls-legacy} {
-      &-selector {
-        min-height: @height-sm;
-        max-height: @height-sm * 3.5px;
-        border-radius: @border-radius-sm;
-      }
-
-      &-selector-label {
-        height: @height-sm;
-        line-height: @height-sm;
-        font-size: @select-input-fontSize-sm;
-        color: @NL30;
-      }
-
-      &-values-wrapper {
-        line-height: @height-sm;
-        font-size: @select-input-fontSize-sm;
-      }
-
-      &-item-all {
-        font-size: @select-input-fontSize-sm;
-
-        &-text {
-          font-size: @select-input-fontSize-sm;
-        }
-      }
-
-      &-placeholder {
-        font-size: @select-input-fontSize-sm;
-      }
-
-      &-tag-item {
-        margin-bottom: 2px;
-      }
-
-      &-input {
-        top: 6px;
-      }
-
-      &-input-tags {
-        top: 0;
-      }
-    }
-  }
-
-  &-large {
-    .@{select-prefix-cls-legacy} {
-      &-selector {
-        min-height: @height-lg;
-        max-height: @height-lg * 3.5px;
-      }
-
-      &-selector-label {
-        height: @height-lg;
-        line-height: @height-lg;
-        font-size: @select-input-fontSize;
-      }
-
-      &-values-wrapper {
-        line-height: @height-lg;
-      }
-
-      &-tag-item {
-        margin-bottom: 7px;
-      }
-
-      &-input {
-        top: 11px;
-      }
-
-      &-input-tags {
-        top: 0;
-      }
-    }
-  }
-
-  &-disabled {
-    color: @NL80;
-    text-shadow: none;
-    background: @NL95;
-    cursor: not-allowed !important;
-    .@{select-prefix-cls-legacy} {
-      &-selector-label {
-        color: inherit;
-      }
-
-      &-values-wrapper {
-        color: inherit;
-      }
-
-      &-placeholder {
-        color: inherit;
-      }
-    }
-  }
-
-  &-bordered&-disabled {
-    border-color: @NL90;
-  }
-
-  // &-focused&-bordered {
-  //   // border: 1px solid @color-border-input-active;
-  // }
-
-  // &-focused:not(&-bordered) {
-  //   background-color: @palette-gray-2;
-  // }
-
-  &-single {
-    .@{select-prefix-cls-legacy} {
-      &-item {
-        display: inline-flex;
-      }
-    }
-  }
-
-  // rc-trigger
-  &-dropdown {
-    position: absolute;
-    background: @BG100;
-    border: 1px solid @NL90;
-    box-shadow: @shadow-actionsheet;
-    border-radius: @border-radius-base;
-    padding: 4px 0;
-    &.@{select-prefix-cls-legacy}-hidden {
-      display: none;
-    }
-  }
-
-  // &-search-highlight {
-  //   // background-color: @color-background-matchHeight;
-  // }
-
-  &-not-found {
-    width: 100%;
-    // color: @color-text-table-empty;
-    text-align: center;
-
-    &-icon {
-      margin-bottom: 40px;
-    }
-  }
-
-  &-gap-10 {
-    width: 10px;
-  }
-
-  &-gap-10 + div {
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-  }
-
-  &-button {
-    margin-right: 8px;
-  }
-
-  // &-button-active {
-  //   color: @color-text-button-text-hover;
-  //   background: @palette-gray-4;
-  //   border-color: @palette-gray-4;
-  // }
-}
-
-.@{select-prefix-cls-legacy}-list {
-  box-sizing: border-box;
-  // min-width: 160px;
-  // padding: 16px 0 16px 8px;
-  outline: none;
-}
-
-.@{select-prefix-cls-legacy}-list-option {
-  position: relative;
-  display: flex;
-  align-items: center;
-  box-sizing: border-box;
-  max-width: 100%;
-  user-select: none;
-  // margin-top: 4px;
-  padding: 8px 12px 8px 36px;
-  overflow: hidden;
-  color: @NL0;
-  font-size: 12px;
-  height: @select-option-height-lg;
-  line-height: @select-option-line-height-lg;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  cursor: pointer;
-  transition: background-color 0.3s ease;
-
-  &-icon,
-  &-all-icon {
-    position: absolute;
-    top: 50%;
-    transform: translateY(-50%);
-    left: 12px;
-    color: @B40;
-
-    &-checkbox {
-      .@{component-prefix}-checkbox-inner {
-        border-color: @NL90;
-        // background-color: @BG100;
-        border-radius: 4px;
-
-        // &::after {
-        //   // border-color: @B40;
-        // }
-      }
-    }
-    // .@{component-prefix}-checkbox-indeterminate {
-    //   .@{component-prefix}-checkbox-inner {
-    //     &::after {
-    //       border-color: green;
-    //     }
-    //   }
-    // }
-  }
-
-  &-isHover {
-    background-color: @NL97;
-  }
-
-  &-nomargin {
-    margin-top: 0;
-  }
-
-  &-disabled {
-    color: @NL80;
-    text-shadow: none;
-    background-color: @white;
-    cursor: not-allowed !important;
-  }
-
-  &-isSelected,
-  &-all-isSelected {
-    color: @NL0;
-    font-weight: normal;
-    // background-color: @NL97;
-  }
-}
-
-.@{select-prefix-cls-legacy}-list-option-all {
-  position: relative;
-  display: flex;
-  align-items: center;
-  box-sizing: border-box;
-  max-width: 100%;
-  // margin-right: 8px;
-  padding: 8px 12px 8px 36px;
-  overflow: hidden;
-  color: @NL0;
-  font-size: 12px;
-  height: @select-option-height-lg;
-  line-height: @select-option-line-height-lg;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  cursor: pointer;
-  transition: background-color 0.3s ease;
-  user-select: none;
-
-  &:not(&-disabled):hover {
-    background-color: @NL97;
-  }
-}
-
-.@{select-prefix-cls-legacy}-footer-button-group {
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-  box-sizing: border-box;
-  width: 100%;
-  height: 52px;
-  margin-top: 4px;
-  padding: 0 20px;
-}
-
-.@{select-prefix-cls-legacy}-footer-button-group:first-child button {
-  margin-right: 8px;
-}
-
-.@{select-prefix-cls-legacy}-list-search-bar {
-  box-sizing: border-box;
-  max-width: 100%;
-  padding: 0 20px 16px 12px;
-}
-
-.@{select-prefix-cls-legacy}-list-group {
-  padding: 6px 12px;
-  // color: @color-background-button-primary-hover;
-  font-weight: normal;
-  font-size: 12px;
-  line-height: 20px;
-}

package/lib/Table/demo/basic/createData.d.ts

@@ -1,9 +0,0 @@
-declare function makeData(length: number): {
-    firstName: string;
-    lastName: string;
-    age: number;
-    visits: number;
-    progress: number;
-    status: string;
-}[];
-export { makeData };

package/lib/Table/demo/basic/createData.js

@@ -1,23 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.makeData = makeData;
-
-function makeData(length) {
-  var data = [];
-
-  for (var i = 0; i < length; i++) {
-    data.push({
-      firstName: 'supermarket',
-      lastName: 'charity',
-      age: i + 1,
-      visits: 47,
-      progress: 41,
-      status: 'relationship'
-    });
-  }
-
-  return data;
-}

package/lib/Table/demo/basic/index.d.ts

@@ -1,2 +0,0 @@
-declare const _default: () => JSX.Element;
-export default _default;

package/lib/Table/demo/basic/index.js

@@ -1,80 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-require("antd/es/radio/style");
-
-var _radio = _interopRequireDefault(require("antd/es/radio"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _aloudataDesign = require("@aloudata/aloudata-design");
-
-var _createData = require("./createData");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
-// import Table from '../../Example'
-var columns = [{
-  Header: 'First Name',
-  accessor: 'firstName',
-  width: 150
-}, {
-  Header: 'Last Name',
-  accessor: 'lastName'
-}, {
-  Header: 'Age',
-  accessor: 'age'
-}, {
-  Header: 'Visits',
-  accessor: 'visits'
-}, {
-  Header: 'Status',
-  accessor: 'status'
-}, {
-  Header: 'Profile Progress',
-  accessor: 'progress'
-}];
-
-var _default = function _default() {
-  var _React$useState = _react.default.useState(0),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      scrollY = _React$useState2[0],
-      setScrollY = _React$useState2[1];
-
-  var handleChange = function handleChange(e) {
-    setScrollY(e.target.value);
-  };
-
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: "ald-table-demo"
-  }, /*#__PURE__*/_react.default.createElement(_radio.default.Group, {
-    value: scrollY,
-    onChange: handleChange
-  }, /*#__PURE__*/_react.default.createElement(_radio.default.Button, {
-    value: 0
-  }, "\u65E0\u6EDA\u52A8"), /*#__PURE__*/_react.default.createElement(_radio.default.Button, {
-    value: 200
-  }, "\u5185\u90E8\u6EDA\u52A8")), /*#__PURE__*/_react.default.createElement(_aloudataDesign.Table, {
-    columns: columns,
-    scrollY: scrollY,
-    data: (0, _createData.makeData)(10)
-  }));
-};
-
-exports.default = _default;

package/lib/Table/demo/editCell/index.d.ts

@@ -1,2 +0,0 @@
-declare const _default: () => JSX.Element;
-export default _default;

package/lib/Table/demo/editCell/index.js

@@ -1,54 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _aloudataDesign = require("@aloudata/aloudata-design");
-
-var _createData = require("../basic/createData");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-// import Table from '../../Example'
-var columns = [{
-  Header: 'First Name',
-  accessor: 'firstName',
-  width: 150
-}, {
-  Header: 'Last Name',
-  accessor: 'lastName'
-}, {
-  Header: 'Age',
-  accessor: 'age'
-}, {
-  Header: 'Visits',
-  accessor: 'visits'
-}, {
-  Header: 'Status',
-  accessor: 'status'
-}, {
-  Header: 'Profile Progress',
-  accessor: 'progress',
-  Cell: function Cell(row) {
-    return /*#__PURE__*/_react.default.createElement("div", {
-      style: {
-        color: 'red'
-      }
-    }, "\u8FDB\u5EA6\uFF1A", row.progress);
-  }
-}];
-
-var _default = function _default() {
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: "ald-table-demo"
-  }, /*#__PURE__*/_react.default.createElement(_aloudataDesign.Table, {
-    columns: columns,
-    data: (0, _createData.makeData)(10)
-  }));
-};
-
-exports.default = _default;

package/lib/Table/demo/renderHeaderRight/index.d.ts

@@ -1,2 +0,0 @@
-declare const _default: () => JSX.Element;
-export default _default;