tntd 2.8.0-beta.2 → 2.8.0-beta.3

package/es/cascader/style/index.less

@@ -0,0 +1,227 @@
+@import '../../style/themes/index';
+@import '../../style/mixins/index';
+@import '../../input/style/mixin';
+
+@cascader-prefix-cls: ~'@{ant-prefix}-cascader';
+
+.@{cascader-prefix-cls} {
+  .reset-component;
+
+  &-input.@{ant-prefix}-input {
+    // Keep it static for https://github.com/ant-design/ant-design/issues/16738
+    position: static;
+    width: 100%;
+    // https://github.com/ant-design/ant-design/issues/17582
+    padding-right: 24px;
+    // Add important to fix https://github.com/ant-design/ant-design/issues/5078
+    // because input.less will compile after cascader.less
+    background-color: transparent !important;
+    cursor: pointer;
+  }
+
+  &-picker-show-search &-input.@{ant-prefix}-input {
+    position: relative;
+  }
+
+  &-picker {
+    .reset-component;
+
+    position: relative;
+    display: inline-block;
+    background-color: @component-background;
+    border-radius: @border-radius-base;
+    outline: 0;
+    cursor: pointer;
+    transition: color 0.3s;
+
+    &-with-value &-label {
+      color: transparent;
+    }
+
+    &-disabled {
+      color: @disabled-color;
+      background: @input-disabled-bg;
+      cursor: not-allowed;
+      .@{cascader-prefix-cls}-input {
+        cursor: not-allowed;
+      }
+    }
+
+    &:focus .@{cascader-prefix-cls}-input {
+      .active;
+    }
+
+    &-show-search&-focused {
+      color: @disabled-color;
+    }
+
+    &-label {
+      position: absolute;
+      top: 50%;
+      left: 0;
+      width: 100%;
+      height: 20px;
+      margin-top: -10px;
+      padding: 0 20px 0 @control-padding-horizontal;
+      overflow: hidden;
+      line-height: 20px;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
+
+    &-clear {
+      position: absolute;
+      top: 50%;
+      right: @control-padding-horizontal;
+      z-index: 2;
+      width: 12px;
+      height: 12px;
+      margin-top: -6px;
+      color: @disabled-color;
+      font-size: @font-size-sm;
+      line-height: 12px;
+      background: @component-background;
+      cursor: pointer;
+      opacity: 0;
+      transition: color 0.3s ease, opacity 0.15s ease;
+      &:hover {
+        color: @text-color-secondary;
+      }
+    }
+
+    &:hover &-clear {
+      opacity: 1;
+    }
+
+    // arrow
+    &-arrow {
+      position: absolute;
+      top: 50%;
+      right: @control-padding-horizontal;
+      z-index: 1;
+      width: 12px;
+      height: 12px;
+      margin-top: -6px;
+      color: @disabled-color;
+      font-size: 12px;
+      line-height: 12px;
+      transition: transform 0.2s;
+      &&-expand {
+        transform: rotate(180deg);
+      }
+    }
+  }
+
+  // https://github.com/ant-design/ant-design/pull/12407#issuecomment-424657810
+  &-picker-label:hover + &-input {
+    .hover;
+  }
+
+  &-picker-small &-picker-clear,
+  &-picker-small &-picker-arrow {
+    right: @control-padding-horizontal-sm;
+  }
+
+  &-menus {
+    position: absolute;
+    z-index: @zindex-dropdown;
+    font-size: @cascader-dropdown-font-size;
+    white-space: nowrap;
+    background: @component-background;
+    border-radius: @border-radius-base;
+    box-shadow: @box-shadow-base;
+
+    ul,
+    ol {
+      margin: 0;
+      list-style: none;
+    }
+
+    &-empty,
+    &-hidden {
+      display: none;
+    }
+    &.slide-up-enter.slide-up-enter-active&-placement-bottomLeft,
+    &.slide-up-appear.slide-up-appear-active&-placement-bottomLeft {
+      animation-name: antSlideUpIn;
+    }
+
+    &.slide-up-enter.slide-up-enter-active&-placement-topLeft,
+    &.slide-up-appear.slide-up-appear-active&-placement-topLeft {
+      animation-name: antSlideDownIn;
+    }
+
+    &.slide-up-leave.slide-up-leave-active&-placement-bottomLeft {
+      animation-name: antSlideUpOut;
+    }
+
+    &.slide-up-leave.slide-up-leave-active&-placement-topLeft {
+      animation-name: antSlideDownOut;
+    }
+  }
+  &-menu {
+    display: inline-block;
+    min-width: 111px;
+    height: 180px;
+    margin: 0;
+    padding: @cascader-dropdown-edge-child-vertical-padding 0;
+    overflow: auto;
+    vertical-align: top;
+    list-style: none;
+    border-right: @border-width-base @border-style-base @border-color-split;
+    -ms-overflow-style: -ms-autohiding-scrollbar; // https://github.com/ant-design/ant-design/issues/11857
+
+    &:first-child {
+      border-radius: @border-radius-base 0 0 @border-radius-base;
+    }
+    &:last-child {
+      margin-right: -1px;
+      border-right-color: transparent;
+      border-radius: 0 @border-radius-base @border-radius-base 0;
+    }
+    &:only-child {
+      border-radius: @border-radius-base;
+    }
+  }
+  &-menu-item {
+    padding: @cascader-dropdown-vertical-padding @control-padding-horizontal;
+    line-height: @cascader-dropdown-line-height;
+    white-space: nowrap;
+    cursor: pointer;
+    transition: all 0.3s;
+    &:hover {
+      background: @item-hover-bg;
+    }
+    &-disabled {
+      color: @disabled-color;
+      cursor: not-allowed;
+      &:hover {
+        background: transparent;
+      }
+    }
+    &-active:not(&-disabled) {
+      &,
+      &:hover {
+        font-weight: @select-item-selected-font-weight;
+        background-color: @background-color-light;
+      }
+    }
+    &-expand {
+      position: relative;
+      padding-right: 24px;
+    }
+
+    &-expand &-expand-icon,
+    &-loading-icon {
+      .iconfont-size-under-12px(10px);
+
+      position: absolute;
+      right: @control-padding-horizontal;
+      color: @text-color-secondary;
+    }
+
+    & &-keyword {
+      color: @highlight-color;
+    }
+  }
+}

package/es/checkbox/index.js

@@ -1,6 +1,6 @@
 import Checkbox from 'antd/es/checkbox';
 import CheckboxGroup from './checkbox-group';
-import 'antd/es/checkbox/style';
+import './style';
 export * from 'antd/es/checkbox';
 // @ts-ignore
 export * from './checkbox-group';

package/es/checkbox/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,kBAAkB,CAAA;AACvC,OAAO,aAAa,MAAM,kBAAkB,CAAA;AAE5C,OAAO,wBAAwB,CAAA;AAE/B,cAAc,kBAAkB,CAAA;AAChC,aAAa;AACb,cAAc,kBAAkB,CAAA;AAEhC,aAAa;AACb,QAAQ,CAAC,KAAK,GAAG,aAAa,CAAA;AAE9B,eAAe,QAAQ,CAAA","sourcesContent":["import Checkbox from 'antd/es/checkbox'\nimport CheckboxGroup from './checkbox-group'\n\nimport 'antd/es/checkbox/style'\n\nexport * from 'antd/es/checkbox'\n// @ts-ignore\nexport * from './checkbox-group'\n\n// @ts-ignore\nCheckbox.Group = CheckboxGroup\n\nexport default Checkbox\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,kBAAkB,CAAA;AACvC,OAAO,aAAa,MAAM,kBAAkB,CAAA;AAE5C,OAAO,SAAS,CAAA;AAEhB,cAAc,kBAAkB,CAAA;AAChC,aAAa;AACb,cAAc,kBAAkB,CAAA;AAEhC,aAAa;AACb,QAAQ,CAAC,KAAK,GAAG,aAAa,CAAA;AAE9B,eAAe,QAAQ,CAAA","sourcesContent":["import Checkbox from 'antd/es/checkbox'\nimport CheckboxGroup from './checkbox-group'\n\nimport './style'\n\nexport * from 'antd/es/checkbox'\n// @ts-ignore\nexport * from './checkbox-group'\n\n// @ts-ignore\nCheckbox.Group = CheckboxGroup\n\nexport default Checkbox\n"]}

package/es/checkbox/style/index.js

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

package/es/checkbox/style/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/checkbox/style/index.tsx"],"names":[],"mappings":"AAAA,OAAO,wBAAwB,CAAA;AAC/B,OAAO,cAAc,CAAA","sourcesContent":["import '../../style/index.less'\nimport './index.less'\n"]}

package/es/checkbox/style/index.less

@@ -0,0 +1,4 @@
+@import '../../style/themes/index';
+@import './mixin';
+
+.antCheckboxFn();

package/es/checkbox/style/mixin.less

@@ -0,0 +1,220 @@
+@import '../../style/mixins/index';
+
+.antCheckboxFn(@checkbox-prefix-cls: ~'@{ant-prefix}-checkbox') {
+  @checkbox-inner-prefix-cls: ~'@{checkbox-prefix-cls}-inner';
+  // 一般状态
+  .@{checkbox-prefix-cls} {
+    .reset-component;
+
+    position: relative;
+    top: -0.09em;
+    display: inline-block;
+    line-height: 1;
+    white-space: nowrap;
+    vertical-align: middle;
+    outline: none;
+    cursor: pointer;
+
+    .@{checkbox-prefix-cls}-wrapper:hover &-inner,
+    &:hover &-inner,
+    &-input:focus + &-inner {
+      border-color: @checkbox-color;
+    }
+
+    &-checked::after {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      border: 1px solid @checkbox-color;
+      border-radius: @border-radius-sm;
+      visibility: hidden;
+      animation: antCheckboxEffect 0.36s ease-in-out;
+      animation-fill-mode: backwards;
+      content: '';
+    }
+
+    &:hover::after,
+    .@{checkbox-prefix-cls}-wrapper:hover &::after {
+      visibility: visible;
+    }
+
+    &-inner {
+      position: relative;
+      top: 0;
+      left: 0;
+      display: block;
+      width: @checkbox-size;
+      height: @checkbox-size;
+      background-color: @checkbox-check-color;
+      border: @checkbox-border-width @border-style-base @border-color-base;
+      border-radius: @border-radius-sm;
+      // Fix IE checked style
+      // https://github.com/ant-design/ant-design/issues/12597
+      border-collapse: separate;
+      transition: all 0.3s;
+
+      &::after {
+        @check-width: calc((@checkbox-size / 14) * 5);
+        @check-height: calc((@checkbox-size / 14) * 8);
+
+        position: absolute;
+        top: 50%;
+        left: 22%;
+        display: table;
+        width: @check-width;
+        height: @check-height;
+        border: 2px solid @checkbox-check-color;
+        border-top: 0;
+        border-left: 0;
+        transform: rotate(45deg) scale(0) translate(-50%, -50%);
+        opacity: 0;
+        transition: all 0.1s @ease-in-back, opacity 0.1s;
+        content: ' ';
+      }
+    }
+
+    &-input {
+      position: absolute;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      z-index: 1;
+      width: 100%;
+      height: 100%;
+      cursor: pointer;
+      opacity: 0;
+    }
+  }
+
+  // 选中状态
+  .@{checkbox-prefix-cls}-checked .@{checkbox-inner-prefix-cls}::after {
+    position: absolute;
+    display: table;
+    border: 2px solid @checkbox-check-color;
+    border-top: 0;
+    border-left: 0;
+    transform: rotate(45deg) scale(1) translate(-50%, -50%);
+    opacity: 1;
+    transition: all 0.2s @ease-out-back 0.1s;
+    content: ' ';
+  }
+
+  .@{checkbox-prefix-cls}-checked {
+    .@{checkbox-inner-prefix-cls} {
+      background-color: @checkbox-color;
+      border-color: @checkbox-color;
+    }
+  }
+
+  .@{checkbox-prefix-cls}-disabled {
+    cursor: not-allowed;
+
+    &.@{checkbox-prefix-cls}-checked {
+      .@{checkbox-inner-prefix-cls}::after {
+        border-color: @disabled-color;
+        animation-name: none;
+      }
+    }
+
+    .@{checkbox-prefix-cls}-input {
+      cursor: not-allowed;
+    }
+
+    .@{checkbox-inner-prefix-cls} {
+      background-color: @input-disabled-bg;
+      border-color: @border-color-base !important;
+      &::after {
+        border-color: @input-disabled-bg;
+        border-collapse: separate;
+        animation-name: none;
+      }
+    }
+
+    & + span {
+      color: @disabled-color;
+      cursor: not-allowed;
+    }
+
+    // Not show highlight border of checkbox when disabled
+    &:hover::after,
+    .@{checkbox-prefix-cls}-wrapper:hover &::after {
+      visibility: hidden;
+    }
+  }
+
+  .@{checkbox-prefix-cls}-wrapper {
+    .reset-component;
+
+    display: inline-block;
+    line-height: unset;
+    cursor: pointer;
+    &.@{checkbox-prefix-cls}-wrapper-disabled {
+      cursor: not-allowed;
+    }
+    & + & {
+      margin-left: 8px;
+    }
+  }
+
+  .@{checkbox-prefix-cls} + span {
+    padding-right: 8px;
+    padding-left: 8px;
+  }
+
+  .@{checkbox-prefix-cls}-group {
+    .reset-component;
+
+    display: inline-block;
+    &-item {
+      display: inline-block;
+      margin-right: 8px;
+      &:last-child {
+        margin-right: 0;
+      }
+    }
+    &-item + &-item {
+      margin-left: 0;
+    }
+  }
+
+  // 半选状态
+  .@{checkbox-prefix-cls}-indeterminate {
+    .@{checkbox-inner-prefix-cls} {
+      background-color: @component-background;
+      border-color: @border-color-base;
+    }
+    .@{checkbox-inner-prefix-cls}::after {
+      @indeterminate-width: calc(@checkbox-size - 8px);
+      @indeterminate-height: calc(@checkbox-size - 8px);
+
+      top: 50%;
+      left: 50%;
+      width: @indeterminate-width;
+      height: @indeterminate-height;
+      background-color: @checkbox-color;
+      border: 0;
+      transform: translate(-50%, -50%) scale(1);
+      opacity: 1;
+      content: ' ';
+    }
+
+    &.@{checkbox-prefix-cls}-disabled .@{checkbox-inner-prefix-cls}::after {
+      background-color: @disabled-color;
+      border-color: @disabled-color;
+    }
+  }
+}
+
+@keyframes antCheckboxEffect {
+  0% {
+    transform: scale(1);
+    opacity: 0.5;
+  }
+  100% {
+    transform: scale(1.6);
+    opacity: 0;
+  }
+}

package/es/col/index.js

@@ -1,4 +1,4 @@
 import Col from 'antd/es/col';
-import 'antd/es/col/style';
+import './style';
 export * from 'antd/es/col';
 export default Col;

package/es/col/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/col/index.ts"],"names":[],"mappings":"AAAA,OAAO,GAAG,MAAM,aAAa,CAAA;AAE7B,OAAO,mBAAmB,CAAA;AAE1B,cAAc,aAAa,CAAA;AAE3B,eAAe,GAAG,CAAA","sourcesContent":["import Col from 'antd/es/col'\n\nimport 'antd/es/col/style'\n\nexport * from 'antd/es/col'\n\nexport default Col\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/col/index.ts"],"names":[],"mappings":"AAAA,OAAO,GAAG,MAAM,aAAa,CAAA;AAE7B,OAAO,SAAS,CAAA;AAEhB,cAAc,aAAa,CAAA;AAE3B,eAAe,GAAG,CAAA","sourcesContent":["import Col from 'antd/es/col'\n\nimport './style'\n\nexport * from 'antd/es/col'\n\nexport default Col\n"]}

package/es/col/style/index.js

@@ -0,0 +1,4 @@
+import '../../style/index.less';
+// style dependencies
+// deps-lint-skip: grid
+import '../../grid/style';

package/es/col/style/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/col/style/index.tsx"],"names":[],"mappings":"AAAA,OAAO,wBAAwB,CAAA;AAE/B,qBAAqB;AACrB,uBAAuB;AACvB,OAAO,kBAAkB,CAAA","sourcesContent":["import '../../style/index.less'\n\n// style dependencies\n// deps-lint-skip: grid\nimport '../../grid/style'\n"]}

package/es/collapse/index.js

@@ -7,7 +7,7 @@
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
 import Collapse from 'antd/es/collapse';
-import 'antd/es/collapse/style';
+import './style';
 import './collapse.less';
 export * from 'antd/es/collapse';
 export default Collapse;

package/es/collapse/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/collapse/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,QAAQ,MAAM,kBAAkB,CAAA;AAEvC,OAAO,wBAAwB,CAAA;AAC/B,OAAO,iBAAiB,CAAA;AACxB,cAAc,kBAAkB,CAAA;AAEhC,eAAe,QAAQ,CAAA","sourcesContent":["/*\n * @Author: 周泽飞 zefei.zhou@tongdun.net\n * @Date: 2023-02-06 10:52:41\n * @LastEditors: 周泽飞 zefei.zhou@tongdun.net\n * @LastEditTime: 2023-02-08 15:38:40\n * @FilePath: /tntd/packages/tntd/src/collapse/index.ts\n * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE\n */\nimport Collapse from 'antd/es/collapse'\n\nimport 'antd/es/collapse/style'\nimport './collapse.less'\nexport * from 'antd/es/collapse'\n\nexport default Collapse\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/collapse/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,QAAQ,MAAM,kBAAkB,CAAA;AAEvC,OAAO,SAAS,CAAA;AAChB,OAAO,iBAAiB,CAAA;AACxB,cAAc,kBAAkB,CAAA;AAEhC,eAAe,QAAQ,CAAA","sourcesContent":["/*\n * @Author: 周泽飞 zefei.zhou@tongdun.net\n * @Date: 2023-02-06 10:52:41\n * @LastEditors: 周泽飞 zefei.zhou@tongdun.net\n * @LastEditTime: 2023-02-08 15:38:40\n * @FilePath: /tntd/packages/tntd/src/collapse/index.ts\n * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE\n */\nimport Collapse from 'antd/es/collapse'\n\nimport './style'\nimport './collapse.less'\nexport * from 'antd/es/collapse'\n\nexport default Collapse\n"]}

package/es/collapse/style/index.js

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

package/es/collapse/style/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/collapse/style/index.tsx"],"names":[],"mappings":"AAAA,OAAO,wBAAwB,CAAA;AAC/B,OAAO,cAAc,CAAA","sourcesContent":["import '../../style/index.less'\nimport './index.less'\n"]}

package/es/collapse/style/index.less

@@ -0,0 +1,134 @@
+@import '../../style/themes/index';
+@import '../../style/mixins/index';
+
+@collapse-prefix-cls: ~'@{ant-prefix}-collapse';
+
+.@{collapse-prefix-cls} {
+  .reset-component;
+
+  background-color: @collapse-header-bg;
+  border: @border-width-base @border-style-base @border-color-base;
+  border-bottom: 0;
+  border-radius: @collapse-panel-border-radius;
+
+  & > &-item {
+    border-bottom: @border-width-base @border-style-base @border-color-base;
+
+    &:last-child {
+      &,
+      & > .@{collapse-prefix-cls}-header {
+        border-radius: 0 0 @collapse-panel-border-radius @collapse-panel-border-radius;
+      }
+    }
+
+    > .@{collapse-prefix-cls}-header {
+      position: relative;
+      padding: @collapse-header-padding;
+      padding-left: @collapse-header-padding-extra;
+      color: @heading-color;
+      line-height: 22px;
+      cursor: pointer;
+      transition: all 0.3s;
+
+      .@{collapse-prefix-cls}-arrow {
+        .iconfont-mixin();
+
+        position: absolute;
+        top: 50%;
+        left: @padding-md;
+        display: inline-block;
+        font-size: @font-size-sm;
+        transform: translateY(-50%);
+
+        & svg {
+          transition: transform 0.24s;
+        }
+      }
+
+      .@{collapse-prefix-cls}-extra {
+        float: right;
+      }
+
+      &:focus {
+        outline: none;
+      }
+    }
+
+    &.@{collapse-prefix-cls}-no-arrow {
+      > .@{collapse-prefix-cls}-header {
+        padding-left: 12px;
+      }
+    }
+  }
+
+  // Expand Icon right
+  &-icon-position-right {
+    & > .@{collapse-prefix-cls}-item {
+      > .@{collapse-prefix-cls}-header {
+        padding: @collapse-header-padding;
+        padding-right: @collapse-header-padding-extra;
+
+        .@{collapse-prefix-cls}-arrow {
+          right: @padding-md;
+          left: auto;
+        }
+      }
+    }
+  }
+
+  &-anim-active {
+    transition: height 0.2s @ease-out;
+  }
+
+  &-content {
+    overflow: hidden;
+    color: @text-color;
+    background-color: @collapse-content-bg;
+    border-top: @border-width-base @border-style-base @border-color-base;
+
+    & > &-box {
+      padding: @collapse-content-padding;
+    }
+
+    &-inactive {
+      display: none;
+    }
+  }
+
+  &-item:last-child {
+    > .@{collapse-prefix-cls}-content {
+      border-radius: 0 0 @collapse-panel-border-radius @collapse-panel-border-radius;
+    }
+  }
+
+  &-borderless {
+    background-color: @collapse-header-bg;
+    border: 0;
+  }
+
+  &-borderless > &-item {
+    border-bottom: 1px solid @border-color-base;
+  }
+
+  &-borderless > &-item:last-child,
+  &-borderless > &-item:last-child &-header {
+    border-radius: 0;
+  }
+
+  &-borderless > &-item > &-content {
+    background-color: transparent;
+    border-top: 0;
+  }
+
+  &-borderless > &-item > &-content > &-content-box {
+    padding-top: 4px;
+  }
+
+  & &-item-disabled > &-header {
+    &,
+    & > .arrow {
+      color: @disabled-color;
+      cursor: not-allowed;
+    }
+  }
+}

package/es/color-picker/ColorPicker.js

@@ -60,9 +60,10 @@ export default function ColorPicker(_a) {
       size,
       placeholder,
       placement = 'bottomLeft',
-      locale
+      locale,
+      simple
     } = _a,
-    otherProps = __rest(_a, ["value", "onChange", "visible", "allowClear", "disabled", "className", "mode", "style", "size", "placeholder", "placement", "locale"]);
+    otherProps = __rest(_a, ["value", "onChange", "visible", "allowClear", "disabled", "className", "mode", "style", "size", "placeholder", "placement", "locale", "simple"]);
   const [visible, setVisible] = useState(vs);
   const [value, setValue] = useState(_value);
   useEffect(() => {
@@ -106,6 +107,7 @@ export default function ColorPicker(_a) {
       [`${prefixCls}-selected`]: !!value,
       [`${prefixCls}-disabled`]: disabled,
       [`${prefixCls}-active`]: visible && !disabled,
+      [`${prefixCls}-simple`]: simple,
       [`${prefixCls}-sm`]: size === 'small',
       [`${prefixCls}-lg`]: size === 'large'
     }),