tntd 2.8.0-beta.3 → 3.0.0-beta

package/lib/segmented/index.less

@@ -1,138 +1,152 @@
 .tntd-segmented {
-    box-sizing: border-box;
-    margin: 0;
-    padding: 0;
-    color: rgba(0,0,0,.65);
-    font-size: 14px;
-    line-height: 1.5715;
-    list-style: none;
-
-    display: inline-block;
-    padding: 2px;
-    color: rgba(0,0,0,.65);
-    background-color: rgba(0,0,0,.04);
-    border-radius: 2px;
-    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
-    font-family: initial;
-
-    .tntd-segmented-group {
+  box-sizing: border-box;
+  margin: 0;
+  font-size: 14px;
+  line-height: 1.5715;
+  list-style: none;
+
+  display: inline-block;
+  padding: 2px;
+  color: #17233D;
+  text-overflow: ellipsis;
+  // background-color: rgba(0,0,0,.04);
+  // border-radius: 2px;
+  border-radius: var(---, 8px);
+  background: var(---, #F8F9FB);
+  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  font-family: initial;
+  font-weight: 400;
+
+  .tntd-segmented-group {
+      position: relative;
+      display: flex;
+      align-items: stretch;
+      justify-items: flex-start;
+      width: 100%;
+    }
+
+    // item styles
+    .tntd-segmented-item {
+      position: relative;
+      text-align: center;
+      cursor: pointer;
+      transition: color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+      border-radius: var(---, 8px);
+      &-selected {
+        background-color: #fff;
+        border-radius: var(---, 8px);
+        box-shadow: 0 2px 8px -2px rgba(0,0,0,.05), 0 1px 4px -1px rgba(0,0,0,.07),
+          0 0 1px rgba(0,0,0,.08);
+        color: #262626;
         position: relative;
-        display: flex;
-        align-items: stretch;
-        justify-items: flex-start;
-        width: 100%;
+        z-index: 20;
       }
 
-      // item styles
-      .tntd-segmented-item {
-        position: relative;
-        text-align: center;
-        cursor: pointer;
-        transition: color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
-
-        &-selected {
-          background-color: #fff;
-          border-radius: 2px;
-          box-shadow: 0 2px 8px -2px rgba(0,0,0,.05), 0 1px 4px -1px rgba(0,0,0,.07),
-            0 0 1px rgba(0,0,0,.08);
-          color: #262626;
-        }
-
-        &:hover,
-        &:focus {
-          color: #262626;
-        }
-
-        &-label {
-          min-height: 28px;
-          padding: 0 12px;
-          line-height: 28px;
-          overflow: hidden;
-          white-space: nowrap;
-          text-overflow: ellipsis;
-          word-break: keep-all;
-        }
-
-        // syntactic sugar to add `icon` for Segmented Item
-        &-icon + * {
-          margin-left: 6px;
-        }
-
-        &-input {
-          position: absolute;
-          top: 0;
-          left: 0;
-          width: 0;
-          height: 0;
-          opacity: 0;
-          pointer-events: none;
-        }
+
+      &:hover:not(&-selected),
+      &:focus:not(&-selected) {
+        background: var(---, #E9EDF3);      
       }
 
-      // disabled styles
-      .tntd-segmented-item-disabled {
-        &,
-        &:hover,
-        &:focus {
-          color: rgba(0,0,0,.25);
-          cursor: not-allowed;
-        }
+      &:active:not(&-selected) {
+        background: var(---300, #E1E6EE);       
+      }
+      &-label {
+        min-height: 28px;
+        padding: 0 12px;
+        line-height: 28px;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        word-break: keep-all;
       }
 
-      // thumb styles
-      .tntd-segmented-thumb {
-        background-color: #fff;
-        border-radius: 2px;
-        box-shadow: 0 2px 8px -2px rgba(0,0,0,.05), 0 1px 4px -1px rgba(0,0,0,.07),
-            0 0 1px rgba(0,0,0,.08);
+      // syntactic sugar to add `icon` for Segmented Item
+      &-icon + * {
+        margin-left: 6px;
+      }
 
+      &-input {
         position: absolute;
         top: 0;
         left: 0;
         width: 0;
-        height: 100%;
-        padding: 4px 0;
-      }
-
-      // transition effect when `appear-active`
-      .tntd-segmented-thumb-motion-appear-active {
-        transition: transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
-        transition-property: all !important;
-        will-change: transform, width;
+        height: 0;
+        opacity: 0;
+        pointer-events: none;
       }
+    }
 
-    // hover/focus styles
-    &:not(&-disabled) {
+    // disabled styles
+    .tntd-segmented-item-disabled {
+      &,
       &:hover,
       &:focus {
-        background-color: rgba(0,0,0,.06);
+        cursor: not-allowed;
+        background-color: transparent !important;
+        color: #BABDC5;
       }
     }
-  }
-
-  .tntd-segmented-block {
-    display: flex;
 
-    .tntd-segmented-item {
-        flex: 1;
-        min-width: 0;
+    // thumb styles
+    .tntd-segmented-thumb {
+      background-color: #fff; 
+      border-radius: var(---, 8px);
+      box-shadow: 0 2px 8px -2px rgba(0,0,0,.05), 0 1px 4px -1px rgba(0,0,0,.07),
+          0 0 1px rgba(0,0,0,.08);
+
+      position: absolute;
+      inset-block-start: 0;
+      inset-inline-start: 0;
+      top: 0;
+      left: 0;
+      width: 0;
+      height: 100%;
+      padding: 4px 0;
+      ~.tntd-segmented-item:not(.tntd-segmented-item-selected):not(.tntd-segmented-item-disabled) {
+        background-color: transparent;       
+      }
     }
-  }
 
-  // size styles
-  .tntd-segmented-lg {
-    .tntd-segmented-item-label {
-        min-height: 36px;
-        padding: 0 12px;
-        font-size: 16px;
-        line-height: 36px;
+    // transition effect when `appear-active`
+    .tntd-segmented-thumb-motion-appear-active {
+      transition: transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), width 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+      transition-property: all !important;
+      will-change: transform, width;
     }
+
+  // hover/focus styles
+  // &:not(&-disabled) {
+  //   &:hover,
+  //   &:focus {
+  //     background-color: rgba(0,0,0,.06);
+  //   }
+  // }
+}
+
+.tntd-segmented-block {
+  display: flex;
+
+  .tntd-segmented-item {
+      flex: 1;
+      min-width: 0;
+  }
+}
+
+// size styles
+.tntd-segmented-lg {
+  .tntd-segmented-item-label {
+      min-height: 36px;
+      padding: 0 12px;
+      font-size: 16px;
+      line-height: 36px;
   }
+}
 
-  .tntd-segmented-sm {
-    .tntd-segmented-item-label {
-        min-height: 22px;
-        line-height: 22px;
-        padding: 0 7px;
-    }
+.tntd-segmented-sm {
+  .tntd-segmented-item-label {
+      min-height: 22px;
+      line-height: 22px;
+      padding: 0 7px;
   }
+}

package/lib/select/index.d.ts

@@ -1,7 +1,7 @@
+import { Select, SelectProps } from './select';
 import './style';
 import './select.less';
 export * from 'antd/lib/select';
-import { Select, SelectProps } from './select';
 export { SelectProps };
 export default Select;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/select/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,eAAe,CAAA;AAEtB,cAAc,gBAAgB,CAAA;AAE9B,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAE9C,OAAO,EAAE,WAAW,EAAE,CAAA;AACtB,eAAe,MAAM,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/select/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAC9C,OAAO,SAAS,CAAA;AAChB,OAAO,eAAe,CAAA;AAEtB,cAAc,gBAAgB,CAAA;AAC9B,OAAO,EAAE,WAAW,EAAE,CAAA;AACtB,eAAe,MAAM,CAAA"}

package/lib/select/index.js

@@ -5,19 +5,19 @@ Object.defineProperty(exports, "__esModule", {
 });
 var _exportNames = {};
 exports["default"] = void 0;
+var _select = require("./select");
 require("./style");
 require("./select.less");
-var _select2 = require("antd/lib/select");
-Object.keys(_select2).forEach(function (key) {
+var _select3 = require("antd/lib/select");
+Object.keys(_select3).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _select2[key]) return;
+  if (key in exports && exports[key] === _select3[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _select2[key];
+      return _select3[key];
     }
   });
 });
-var _select3 = require("./select");
-var _default = exports["default"] = _select3.Select;
+var _default = exports["default"] = _select.Select;

package/lib/select/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/select/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,mBAAgB;AAChB,yBAAsB;AAEtB,iDAA8B;AAE9B,qCAA8C;AAG9C,kBAAe,eAAM,CAAA","sourcesContent":["import './style'\nimport './select.less'\n\nexport * from 'antd/lib/select'\n\nimport { Select, SelectProps } from './select'\n\nexport { SelectProps }\nexport default Select\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/select/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,qCAA8C;AAC9C,mBAAgB;AAChB,yBAAsB;AAEtB,iDAA8B;AAE9B,kBAAe,eAAM,CAAA","sourcesContent":["import { Select, SelectProps } from './select'\nimport './style'\nimport './select.less'\n\nexport * from 'antd/lib/select'\nexport { SelectProps }\nexport default Select\n"]}

package/lib/select/select.d.ts

@@ -2,7 +2,7 @@ import React, { ReactNode } from 'react';
 import { default as AntdSelect } from 'antd/lib/select';
 import type { SelectProps as AntdSelectProps } from 'antd/lib/select';
 export interface SelectProps extends AntdSelectProps {
-    borderStyle?: 'outline';
+    borderStyle?: 'outline' | 'fill';
     children?: ReactNode;
     options?: Array<string | number | {
         label: string;

package/lib/select/select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../src/select/select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAc,MAAM,OAAO,CAAA;AACpD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAEtD,OAAO,KAAK,EAAE,WAAW,IAAI,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAMpE,MAAM,WAAW,WAAY,SAAQ,eAAe;IAElD,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,OAAO,CAAC,EAAE,KAAK,CACX,MAAM,GACN,MAAM,GACN;QACE,KAAK,EAAE,MAAM,CAAA;QACb,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;QACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;KACnB,CACJ,CAAA;IACD,UAAU,CAAC,EAAE;QACX,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,OAAO,CAAC,EAAE,MAAM,CAAA;KACjB,CAAA;IACD,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,UAAU,eACR,SAAQ,KAAK,CAAC,yBAAyB,CAAC,WAAW,GAAG,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACtF,QAAQ,EAAE,OAAO,UAAU,CAAC,QAAQ,CAAA;IACpC,MAAM,EAAE,OAAO,UAAU,CAAC,MAAM,CAAA;CACjC;AAID,eAAO,MAAM,cAAc,iBAyCP,CAAA;AAEpB,eAAO,MAAM,MAAM,iBAGC,CAAA"}
+{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../src/select/select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAc,MAAM,OAAO,CAAA;AACpD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAEtD,OAAO,KAAK,EAAE,WAAW,IAAI,eAAe,EAAE,MAAM,gBAAgB,CAAA;AAMpE,MAAM,WAAW,WAAY,SAAQ,eAAe;IAElD,WAAW,CAAC,EAAE,SAAS,GAAG,MAAM,CAAA;IAChC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,OAAO,CAAC,EAAE,KAAK,CACX,MAAM,GACN,MAAM,GACN;QACE,KAAK,EAAE,MAAM,CAAA;QACb,KAAK,EAAE,MAAM,GAAG,MAAM,CAAA;QACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;KACnB,CACJ,CAAA;IACD,UAAU,CAAC,EAAE;QACX,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,OAAO,CAAC,EAAE,MAAM,CAAA;KACjB,CAAA;IACD,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,UAAU,eACR,SAAQ,KAAK,CAAC,yBAAyB,CAAC,WAAW,GAAG,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACtF,QAAQ,EAAE,OAAO,UAAU,CAAC,QAAQ,CAAA;IACpC,MAAM,EAAE,OAAO,UAAU,CAAC,MAAM,CAAA;CACjC;AAMD,eAAO,MAAM,cAAc,iBAwCP,CAAA;AAEpB,eAAO,MAAM,MAAM,iBAGC,CAAA"}

package/lib/select/select.js

@@ -28,6 +28,7 @@ var __rest = void 0 && (void 0).__rest || function (s, e) {
   return t;
 };
 var Option = _select["default"].Option;
+var tntPrefixCls = 'tnt-select';
 var InternalSelect = exports.InternalSelect = (0, _react.forwardRef)(function (_a, ref) {
   var className = _a.className,
     borderStyle = _a.borderStyle,
@@ -35,12 +36,10 @@ var InternalSelect = exports.InternalSelect = (0, _react.forwardRef)(function (_
     fieldNames = _a.fieldNames,
     children = _a.children,
     props = __rest(_a, ["className", "borderStyle", "options", "fieldNames", "children"]);
-  return _react["default"].createElement(_configProvider.ConfigConsumer, null, function (_ref) {
-    var getPrefixCls = _ref.getPrefixCls;
-    var prefixCls = getPrefixCls('select');
+  return _react["default"].createElement(_configProvider.ConfigConsumer, null, function () {
     return _react["default"].createElement(_select["default"], Object.assign({}, props, {
       placeholder: (0, _utils.capitalizeFirstLetter)(props === null || props === void 0 ? void 0 : props.placeholder, props === null || props === void 0 ? void 0 : props.capitalize),
-      className: (0, _classnames["default"])(className, _defineProperty({}, "".concat(prefixCls, "-outline"), borderStyle === 'outline')),
+      className: (0, _classnames["default"])(className, tntPrefixCls, _defineProperty(_defineProperty({}, "".concat(tntPrefixCls, "-outline"), borderStyle === 'outline'), "".concat(tntPrefixCls, "-fill"), borderStyle === 'fill')),
       ref: ref
     }), children ? children : options === null || options === void 0 ? void 0 : options.map(function (option) {
       if (_typeof(option) === 'object') {

package/lib/select/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","sourceRoot":"","sources":["../../src/select/select.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAoD;AACpD,4DAAsD;AACtD,6DAAwD;AAExD,4DAAmC;AACnC,mCAA4B;AAC5B,wCAAqD;AACrD,mEAAyC;AACzC,oCAAgD;AA4BhD,MAAM,EAAE,MAAM,EAAE,GAAG,gBAAU,CAAA;AAEhB,QAAA,cAAc,GAAG,IAAA,kBAAU,EACtC,CAAC,EAAmE,EAAE,GAAG,EAAE,EAAE;QAA5E,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,OAAY,EAAP,KAAK,cAAjE,iEAAmE,CAAF;IAAY,OAAA,CAC5E,8BAAC,gCAAc,QACZ,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE;QACpB,MAAM,SAAS,GAAG,YAAY,CAAC,QAAQ,CAAC,CAAA;QAExC,OAAO,CACL,8BAAC,gBAAU,oBACL,KAAK,IACT,WAAW,EAAE,IAAA,6BAAqB,EAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,WAAW,EAAE,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,UAAU,CAAC,EACzE,SAAS,EAAE,IAAA,oBAAU,EAAC,SAAS,EAAE;gBAC/B,CAAC,GAAG,SAAS,UAAU,CAAC,EAAE,WAAW,KAAK,SAAS;aACpD,CAAC,EACF,GAAG,EAAE,GAAG,KAEP,QAAQ;YACP,CAAC,CAAC,QAAQ;YACV,CAAC,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;gBACtB,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE;oBAC9B,OAAO,CACL,8BAAC,MAAM,IACL,GAAG,EAAE,IAAA,YAAG,EAAC,MAAM,EAAE,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,KAAK,KAAI,OAAO,CAAC,EAC9C,KAAK,EAAE,IAAA,YAAG,EAAC,MAAM,EAAE,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,KAAK,KAAI,OAAO,CAAC,EAChD,QAAQ,EAAE,CAAC,CAAC,MAAM,CAAC,QAAQ,IAE1B,IAAA,YAAG,EAAC,MAAM,EAAE,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,KAAK,KAAI,OAAO,CAAC,CACnC,CACV,CAAA;iBACF;gBAED,OAAO,CACL,8BAAC,MAAM,IAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,IAC/B,MAAM,CACA,CACV,CAAA;YACH,CAAC,CAAC,CACK,CACd,CAAA;IACH,CAAC,CACc,CAClB,CAAA;CAAA,CACiB,CAAA;AAEP,QAAA,MAAM,GAAG,IAAA,kCAAwB,EAC5C,sBAAc,EACd,sBAAW,CAAC,MAAM,CACA,CAAA;AAEpB,cAAM,CAAC,QAAQ,GAAG,gBAAU,CAAC,QAAQ,CAAA;AACrC,cAAM,CAAC,MAAM,GAAG,gBAAU,CAAC,MAAM,CAAA","sourcesContent":["import React, { ReactNode, forwardRef } from 'react'\nimport { default as AntdSelect } from 'antd/lib/select'\nimport { ConfigConsumer } from 'antd/lib/config-provider'\nimport type { SelectProps as AntdSelectProps } from 'antd/lib/select'\nimport classNames from 'classnames'\nimport { get } from 'lodash'\nimport { connectReadonlyComponent } from '../connect'\nimport PreviewText from '../preview-text'\nimport { capitalizeFirstLetter } from '../utils'\nexport interface SelectProps extends AntdSelectProps {\n  // 线框风格\n  borderStyle?: 'outline'\n  children?: ReactNode\n  options?: Array<\n    | string\n    | number\n    | {\n        label: string\n        value: string | number\n        disabled?: boolean\n      }\n  >\n  fieldNames?: {\n    label?: string\n    value?: string\n    options?: string\n  }\n  readonly?: boolean\n}\n\ninterface SelectComponent\n  extends React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<AntdSelect>> {\n  OptGroup: typeof AntdSelect.OptGroup\n  Option: typeof AntdSelect.Option\n}\n\nconst { Option } = AntdSelect\n\nexport const InternalSelect = forwardRef<AntdSelect, SelectProps & { capitalize?: boolean }>(\n  ({ className, borderStyle, options, fieldNames, children, ...props }, ref) => (\n    <ConfigConsumer>\n      {({ getPrefixCls }) => {\n        const prefixCls = getPrefixCls('select')\n\n        return (\n          <AntdSelect\n            {...props}\n            placeholder={capitalizeFirstLetter(props?.placeholder, props?.capitalize)}\n            className={classNames(className, {\n              [`${prefixCls}-outline`]: borderStyle === 'outline',\n            })}\n            ref={ref}\n          >\n            {children\n              ? children\n              : options?.map((option) => {\n                  if (typeof option === 'object') {\n                    return (\n                      <Option\n                        key={get(option, fieldNames?.value || 'value')}\n                        value={get(option, fieldNames?.value || 'value')}\n                        disabled={!!option.disabled}\n                      >\n                        {get(option, fieldNames?.label || 'label')}\n                      </Option>\n                    )\n                  }\n\n                  return (\n                    <Option key={option} value={option}>\n                      {option}\n                    </Option>\n                  )\n                })}\n          </AntdSelect>\n        )\n      }}\n    </ConfigConsumer>\n  )\n) as SelectComponent\n\nexport const Select = connectReadonlyComponent(\n  InternalSelect,\n  PreviewText.Select\n) as SelectComponent\n\nSelect.OptGroup = AntdSelect.OptGroup\nSelect.Option = AntdSelect.Option\n"]}
+{"version":3,"file":"select.js","sourceRoot":"","sources":["../../src/select/select.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAoD;AACpD,4DAAsD;AACtD,6DAAwD;AAExD,4DAAmC;AACnC,mCAA4B;AAC5B,wCAAqD;AACrD,mEAAyC;AACzC,oCAAgD;AA4BhD,MAAM,EAAE,MAAM,EAAE,GAAG,gBAAU,CAAA;AAE7B,MAAM,YAAY,GAAG,YAAY,CAAA;AAEpB,QAAA,cAAc,GAAG,IAAA,kBAAU,EACtC,CAAC,EAAmE,EAAE,GAAG,EAAE,EAAE;QAA5E,EAAE,SAAS,EAAE,WAAW,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,OAAY,EAAP,KAAK,cAAjE,iEAAmE,CAAF;IAAY,OAAA,CAC5E,8BAAC,gCAAc,QACZ,GAAG,EAAE;QACJ,OAAO,CACL,8BAAC,gBAAU,oBACL,KAAK,IACT,WAAW,EAAE,IAAA,6BAAqB,EAAC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,WAAW,EAAE,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,UAAU,CAAC,EACzE,SAAS,EAAE,IAAA,oBAAU,EAAC,SAAS,EAAE,YAAY,EAAE;gBAC7C,CAAC,GAAG,YAAY,UAAU,CAAC,EAAE,WAAW,KAAK,SAAS;gBACtD,CAAC,GAAG,YAAY,OAAO,CAAC,EAAE,WAAW,KAAK,MAAM;aACjD,CAAC,EACF,GAAG,EAAE,GAAG,KAEP,QAAQ;YACP,CAAC,CAAC,QAAQ;YACV,CAAC,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;gBACtB,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE;oBAC9B,OAAO,CACL,8BAAC,MAAM,IACL,GAAG,EAAE,IAAA,YAAG,EAAC,MAAM,EAAE,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,KAAK,KAAI,OAAO,CAAC,EAC9C,KAAK,EAAE,IAAA,YAAG,EAAC,MAAM,EAAE,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,KAAK,KAAI,OAAO,CAAC,EAChD,QAAQ,EAAE,CAAC,CAAC,MAAM,CAAC,QAAQ,IAE1B,IAAA,YAAG,EAAC,MAAM,EAAE,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,KAAK,KAAI,OAAO,CAAC,CACnC,CACV,CAAA;iBACF;gBAED,OAAO,CACL,8BAAC,MAAM,IAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,IAC/B,MAAM,CACA,CACV,CAAA;YACH,CAAC,CAAC,CACK,CACd,CAAA;IACH,CAAC,CACc,CAClB,CAAA;CAAA,CACiB,CAAA;AAEP,QAAA,MAAM,GAAG,IAAA,kCAAwB,EAC5C,sBAAc,EACd,sBAAW,CAAC,MAAM,CACA,CAAA;AAEpB,cAAM,CAAC,QAAQ,GAAG,gBAAU,CAAC,QAAQ,CAAA;AACrC,cAAM,CAAC,MAAM,GAAG,gBAAU,CAAC,MAAM,CAAA","sourcesContent":["import React, { ReactNode, forwardRef } from 'react'\nimport { default as AntdSelect } from 'antd/lib/select'\nimport { ConfigConsumer } from 'antd/lib/config-provider'\nimport type { SelectProps as AntdSelectProps } from 'antd/lib/select'\nimport classNames from 'classnames'\nimport { get } from 'lodash'\nimport { connectReadonlyComponent } from '../connect'\nimport PreviewText from '../preview-text'\nimport { capitalizeFirstLetter } from '../utils'\nexport interface SelectProps extends AntdSelectProps {\n  // 线框风格\n  borderStyle?: 'outline' | 'fill'\n  children?: ReactNode\n  options?: Array<\n    | string\n    | number\n    | {\n        label: string\n        value: string | number\n        disabled?: boolean\n      }\n  >\n  fieldNames?: {\n    label?: string\n    value?: string\n    options?: string\n  }\n  readonly?: boolean\n}\n\ninterface SelectComponent\n  extends React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<AntdSelect>> {\n  OptGroup: typeof AntdSelect.OptGroup\n  Option: typeof AntdSelect.Option\n}\n\nconst { Option } = AntdSelect\n\nconst tntPrefixCls = 'tnt-select'\n\nexport const InternalSelect = forwardRef<AntdSelect, SelectProps & { capitalize?: boolean }>(\n  ({ className, borderStyle, options, fieldNames, children, ...props }, ref) => (\n    <ConfigConsumer>\n      {() => {\n        return (\n          <AntdSelect\n            {...props}\n            placeholder={capitalizeFirstLetter(props?.placeholder, props?.capitalize)}\n            className={classNames(className, tntPrefixCls, {\n              [`${tntPrefixCls}-outline`]: borderStyle === 'outline',\n              [`${tntPrefixCls}-fill`]: borderStyle === 'fill',\n            })}\n            ref={ref}\n          >\n            {children\n              ? children\n              : options?.map((option) => {\n                  if (typeof option === 'object') {\n                    return (\n                      <Option\n                        key={get(option, fieldNames?.value || 'value')}\n                        value={get(option, fieldNames?.value || 'value')}\n                        disabled={!!option.disabled}\n                      >\n                        {get(option, fieldNames?.label || 'label')}\n                      </Option>\n                    )\n                  }\n\n                  return (\n                    <Option key={option} value={option}>\n                      {option}\n                    </Option>\n                  )\n                })}\n          </AntdSelect>\n        )\n      }}\n    </ConfigConsumer>\n  )\n) as SelectComponent\n\nexport const Select = connectReadonlyComponent(\n  InternalSelect,\n  PreviewText.Select\n) as SelectComponent\n\nSelect.OptGroup = AntdSelect.OptGroup\nSelect.Option = AntdSelect.Option\n"]}

package/lib/select/select.less

@@ -1,11 +1,85 @@
-@empty-prefix-cls: ~'@{ant-prefix}-select';
-
-.@{empty-prefix-cls}-outline {
-  .@{empty-prefix-cls}-selection {
-    border-top: none;
-    border-left: none;
-    border-right: none;
-    border-radius: 0;
-    box-shadow: none;
+@import '../style/mixins/index.less';
+@import '../input/style/mixin.less';
+
+@select-prefix-cls: ~'@{ant-prefix}-select';
+
+.tnt-select,
+.@{select-prefix-cls} {
+  .@{select-prefix-cls}-arrow {
+    color: @input-color;
+  }
+  &-disabled {
+    .@{select-prefix-cls}-arrow {
+      color: @text-color-tertiary;
+    }
+  }
+  // 线框风格
+  &-outline {
+    .@{select-prefix-cls}-selection {
+      border-top: none;
+      border-left: none;
+      border-right: none;
+      border-radius: 0;
+      box-shadow: none;
+    }
+
+    &.@{select-prefix-cls}-focused &,
+    &.@{select-prefix-cls}-selection:focus,
+    &.@{select-prefix-cls}-selection:active {
+      .active;
+      box-shadow: none;
+    }
+  }
+  // 填充风格
+  &-fill {
+    .@{select-prefix-cls}-selection {
+      border-color: @fill-color-quaternary;
+      background-color: @fill-color-quaternary;
+
+      &:hover {
+        .hover;
+      }
+
+      &.@{select-prefix-cls}-focused &,
+      &.@{select-prefix-cls}-selection:focus,
+      &.@{select-prefix-cls}-selection:active {
+        .active;
+      }
+    }
+
+    &.@{select-prefix-cls}-disabled {
+      .@{select-prefix-cls}-selection {
+        background-color: @input-disabled-bg !important;
+        border-color: @input-disabled-bg !important;
+        box-shadow: none !important;
+      }
+    }
+  }
+
+  // 未选择值的时候的样式
+  .@{select-prefix-cls}-selection {
+    &__clear {
+      right: 14px;
+      color: @bg-color-spotilight-tint-50;
+    }
+    &:not(:has(.ant-select-selection-selected-value, .ant-select-selection__choice)) {
+      .@{select-prefix-cls}-arrow {
+        color: @input-placeholder-color;
+      }
+
+      &:hover {
+        .@{select-prefix-cls}-arrow {
+          color: @input-color;
+        }
+      }
+    }
+  }
+
+  .@{select-prefix-cls}-selection__choice {
+    border-radius: @border-radius-base;
+    border-color: @bg-grey-default;
+    .tntd-anticon {
+      font-size: 12px;
+    }
   }
 }

package/lib/steps/assets/background_left.svg

@@ -0,0 +1,12 @@
+<svg width="162" height="77" viewBox="0 0 162 77" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Ellipse 27" filter="url(#filter0_f_5274_1997)">
+    <ellipse class="test" cx="36.5" cy="-21.5" rx="78.5" ry="51.5" fill="#126BFB" fill-opacity="0.15"/>
+</g>
+<defs>
+<filter id="filter0_f_5274_1997" x="-89" y="-120" width="251" height="197" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="23.5" result="effect1_foregroundBlur_5274_1997"/>
+</filter>
+</defs>
+</svg>

package/lib/steps/assets/background_right.svg

@@ -0,0 +1,12 @@
+<svg width="131" height="80" viewBox="0 0 131 80" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Ellipse 28" filter="url(#filter0_f_5274_1888)">
+<circle cx="118" cy="100" r="71" fill="#126BFB" fill-opacity="0.08"/>
+</g>
+<defs>
+<filter id="filter0_f_5274_1888" x="0" y="-18" width="236" height="236" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="23.5" result="effect1_foregroundBlur_5274_1888"/>
+</filter>
+</defs>
+</svg>

package/lib/steps/assets/horizontal_line.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="8" height="2" viewBox="0 0 6 2" fill="none">
+    <path class="t1" d="M1.5 1H206" stroke="#C9D2DD"  stroke-width="2" stroke-linecap="round" stroke-dasharray="2 7"/>
+</svg>

package/lib/steps/assets/vertical_line.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="2" height="10" viewBox="0 0 2 6" fill="none">
+<path d="M1 1L0.999999 25" stroke="#C9D2DD" stroke-width="2" stroke-linecap="round" stroke-dasharray="4 6"/>
+</svg>

package/lib/steps/index.d.ts

@@ -1,7 +1,6 @@
 import './style';
-import { Steps } from './steps';
-import './style/index.less';
 import './stepStyle/index.less';
+import { Steps } from './steps';
 export * from './steps';
 export default Steps;
 //# sourceMappingURL=index.d.ts.map

package/lib/steps/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/steps/index.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,oBAAoB,CAAA;AAC3B,OAAO,wBAAwB,CAAA;AAE/B,cAAc,SAAS,CAAA;AAEvB,eAAe,KAAK,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/steps/index.ts"],"names":[],"mappings":"AAQA,OAAO,SAAS,CAAA;AAChB,OAAO,wBAAwB,CAAA;AAC/B,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAE/B,cAAc,SAAS,CAAA;AAEvB,eAAe,KAAK,CAAA"}

package/lib/steps/index.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 var _exportNames = {};
 exports["default"] = void 0;
 require("./style");
+require("./stepStyle/index.less");
 var _steps = require("./steps");
 Object.keys(_steps).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -18,6 +19,12 @@ Object.keys(_steps).forEach(function (key) {
     }
   });
 });
-require("./style/index.less");
-require("./stepStyle/index.less");
+/*
+ * @Author: 周泽飞 zefei.zhou@tongdun.net
+ * @Date: 2024-03-15 11:12:18
+ * @LastEditors: 周泽飞 zefei.zhou@tongdun.net
+ * @LastEditTime: 2024-03-21 13:58:42
+ * @FilePath: /tntd/packages/tntd/src/steps/index.ts
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
 var _default = exports["default"] = _steps.Steps;

package/lib/steps/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/steps/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,mBAAgB;AAChB,mCAA+B;AAC/B,8BAA2B;AAC3B,kCAA+B;AAE/B,0CAAuB;AAEvB,kBAAe,aAAK,CAAA","sourcesContent":["import './style'\nimport { Steps } from './steps'\nimport './style/index.less'\nimport './stepStyle/index.less'\n\nexport * from './steps'\n\nexport default Steps\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/steps/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;GAOG;AACH,mBAAgB;AAChB,kCAA+B;AAC/B,mCAA+B;AAE/B,0CAAuB;AAEvB,kBAAe,aAAK,CAAA","sourcesContent":["/*\n * @Author: 周泽飞 zefei.zhou@tongdun.net\n * @Date: 2024-03-15 11:12:18\n * @LastEditors: 周泽飞 zefei.zhou@tongdun.net\n * @LastEditTime: 2024-03-21 13:58:42\n * @FilePath: /tntd/packages/tntd/src/steps/index.ts\n * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE\n */\nimport './style'\nimport './stepStyle/index.less'\nimport { Steps } from './steps'\n\nexport * from './steps'\n\nexport default Steps\n"]}

package/lib/steps/stepStyle/icon.less

@@ -0,0 +1,51 @@
+.@{tnt-steps-cls}:not(.@{steps-prefix-cls}-dot).@{steps-prefix-cls}{
+    .@{steps-prefix-cls}-item{
+        &-icon{
+            border: none;
+            font-weight: 500;
+            margin: 2px 12px 2px 0;
+            width: @td-steps-icon-size;
+            height: @td-steps-icon-size;
+            line-height: @td-steps-icon-size;
+            border-radius:@td-steps-icon-size;
+            >.@{steps-prefix-cls}-icon{
+                top:0;
+                i{
+                    font-size: @td-steps-icon-size;
+                    font-weight: normal;
+                }
+            }
+        }
+        &-finish.@{step-prefix-cls}-default-icon,
+        &-error.@{step-prefix-cls}-default-icon {
+            .@{steps-prefix-cls}-item-icon {
+                background-color: transparent;
+            }
+        }
+
+        &-wait.@{step-prefix-cls}-default-icon {
+            .@{steps-prefix-cls}-item-icon {
+                background-color: @fill-color-tertiary;
+            }
+        }
+    }
+
+   
+
+    &-small {
+        .@{steps-prefix-cls}-item{
+            &-icon{
+                width: @td-steps-small-icon-size;
+                height: @td-steps-small-icon-size;
+                line-height: @td-steps-small-icon-size;
+                border-radius:@td-steps-small-icon-size;
+                >.@{steps-prefix-cls}-icon{
+                    i{
+                        font-size: @td-steps-small-icon-size;
+                    }
+                }
+            }
+        }
+    }
+}
+