@aloudata/aloudata-design 0.3.1 → 0.3.4

package/lib/Radio/components/Group/index.js

@@ -0,0 +1,93 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RadioGroupContext = void 0;
+exports.default = RadioGroup;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _useMergedState3 = _interopRequireDefault(require("rc-util/lib/hooks/useMergedState"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+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; }
+
+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; }
+
+var RadioGroupContext = /*#__PURE__*/(0, _react.createContext)({});
+exports.RadioGroupContext = RadioGroupContext;
+
+function RadioGroup(props) {
+  var children = props.children,
+      _props$radioGroupStyl = props.radioGroupStyle,
+      radioGroupStyle = _props$radioGroupStyl === void 0 ? 'border' : _props$radioGroupStyl,
+      _props$size = props.size,
+      size = _props$size === void 0 ? 'middle' : _props$size,
+      _props$type = props.type,
+      type = _props$type === void 0 ? 'radio' : _props$type,
+      className = props.className; // 滑块的ref
+
+  var sliderRef = (0, _react.useRef)(null); // 该hooks与useState相同，但是当props中有value值时，优先使用value的值
+
+  var _useMergedState = (0, _useMergedState3.default)(props.defaultValue, {
+    value: props === null || props === void 0 ? void 0 : props.value
+  }),
+      _useMergedState2 = _slicedToArray(_useMergedState, 2),
+      value = _useMergedState2[0],
+      setValue = _useMergedState2[1];
+
+  var onRadioChange = function onRadioChange(ev) {
+    var lastValue = value;
+    var val = ev.target.value;
+    setValue(val);
+    var onChange = props.onChange;
+
+    if (onChange && val !== lastValue) {
+      onChange(ev);
+    }
+  };
+
+  var getWrapperClass = function getWrapperClass() {
+    var _classNames;
+
+    var isButton = ['button', 'iconButton'].includes(type);
+    var tempType = type === 'iconButton' ? 'icon-button' : type;
+    return (0, _classnames.default)('ald-radio-group', className, "ald-radio-group-".concat(tempType), (_classNames = {}, _defineProperty(_classNames, "ald-radio-group-".concat(radioGroupStyle), isButton), _defineProperty(_classNames, "ald-radio-group-".concat(size), isButton), _classNames));
+  };
+
+  return /*#__PURE__*/_react.default.createElement(RadioGroupContext.Provider, {
+    value: {
+      onChange: onRadioChange,
+      value: value,
+      radioGroupStyle: radioGroupStyle,
+      size: size,
+      type: type,
+      sliderRef: sliderRef
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: getWrapperClass()
+  }, children, radioGroupStyle === 'filled' && type !== 'radio' ? /*#__PURE__*/_react.default.createElement("div", {
+    className: "ald-radio-filled-slider",
+    ref: sliderRef
+  }) : null));
+}

package/lib/Radio/components/Radio/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { IRadioProps } from '../../interface/radio';
+export default function Radio(props: IRadioProps): JSX.Element;

package/lib/Radio/components/Radio/index.js

@@ -0,0 +1,115 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = Radio;
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _lodash = _interopRequireDefault(require("lodash"));
+
+var _Group = require("../Group");
+
+var _useId = require("../../../_utils/hooks/useId");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+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; }
+
+function Radio(props) {
+  var _props$value;
+
+  var groupContext = (0, _react.useContext)(_Group.RadioGroupContext);
+  var labelRef = (0, _react.useRef)(null);
+  var id = (0, _useId.getUUID)().toString();
+
+  var radioProps = _objectSpread({}, props);
+
+  if (!_lodash.default.isEmpty(groupContext)) {
+    radioProps.disabled = props.disabled;
+    radioProps.checked = !props.disabled && groupContext.value === props.value;
+  } else {
+    radioProps.checked = !('checked' in props) ? props.defaultChecked : radioProps.checked;
+  } // 设置input外层盒子的class
+
+
+  var aldRadioClass = (0, _classnames.default)('ald-radio', {
+    'ald-radio-checked': radioProps.checked,
+    'ald-radio-disabled': radioProps.disabled
+  }); // 根据属性设置最外层的class
+
+  var getWrapperClass = function getWrapperClass() {
+    var otherClass = '';
+
+    if (groupContext.type === 'button') {
+      if (groupContext.radioGroupStyle === 'filled') {
+        otherClass = 'ald-radio-button-wrapper-filled';
+      } else {
+        otherClass = 'ald-radio-button-wrapper-border';
+      }
+    } else if (groupContext.type === 'iconButton') {
+      if (groupContext.radioGroupStyle === 'filled') {
+        otherClass = 'ald-radio-icon-button-wrapper-filled';
+      } else {
+        otherClass = 'ald-radio-icon-button-wrapper-border';
+      }
+    } else {
+      // 当type未设置或者是radio时
+      otherClass = 'ald-radio-wrapper';
+    }
+
+    return (0, _classnames.default)('ald-radio-label', otherClass, {
+      'ald-radio-wrapper-checked': radioProps.checked,
+      'ald-radio-wrapper-disabled': radioProps.disabled
+    });
+  }; // filled button模式下，更改滑块的位置
+
+
+  (0, _react.useEffect)(function () {
+    var _groupContext$sliderR;
+
+    if (radioProps.checked && (groupContext === null || groupContext === void 0 ? void 0 : (_groupContext$sliderR = groupContext.sliderRef) === null || _groupContext$sliderR === void 0 ? void 0 : _groupContext$sliderR.current) && (labelRef === null || labelRef === void 0 ? void 0 : labelRef.current)) {
+      groupContext.sliderRef.current.style.left = "".concat(labelRef.current.offsetLeft, "px");
+      groupContext.sliderRef.current.style.width = "".concat(labelRef.current.offsetWidth, "px");
+    }
+  }, [groupContext.sliderRef, radioProps.checked]);
+
+  var onChange = function onChange(e) {
+    if (groupContext === null || groupContext === void 0 ? void 0 : groupContext.onChange) {
+      groupContext.onChange(e);
+    }
+  };
+
+  return /*#__PURE__*/_react.default.createElement("label", {
+    className: getWrapperClass(),
+    htmlFor: id,
+    ref: labelRef
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: aldRadioClass
+  }, /*#__PURE__*/_react.default.createElement("input", {
+    id: id,
+    type: "radio",
+    className: "ald-radio-input",
+    checked: radioProps.checked,
+    disabled: radioProps.disabled,
+    value: (_props$value = props.value) === null || _props$value === void 0 ? void 0 : _props$value.toString(),
+    onChange: onChange
+  }), /*#__PURE__*/_react.default.createElement("span", {
+    className: "ald-radio-inner"
+  })), /*#__PURE__*/_react.default.createElement("span", {
+    className: "ald-radio-desc"
+  }, props.children));
+}

package/lib/Radio/index.d.ts

@@ -1,3 +1,10 @@
-import { Radio } from 'antd';
-export { RadioGroupButtonStyle, RadioGroupOptionType, RadioGroupProps, RadioGroupContextProps, RadioProps, RadioChangeEventTarget, RadioChangeEvent, } from 'antd/lib/radio';
+/// <reference types="react" />
+import RadioGroup from './components/Group';
+import { IRadioProps } from './interface/radio';
+export type { IRadioProps as RadioProps } from './interface/radio';
+export type { IRadioGroupProps as RadioGroupProps } from './interface/radioGroup';
+interface IRadioType extends React.FC<IRadioProps> {
+    Group: typeof RadioGroup;
+}
+declare const Radio: IRadioType;
 export default Radio;

package/lib/Radio/index.js

@@ -5,11 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-require("antd/es/radio/style");
+var _Radio = _interopRequireDefault(require("./components/Radio"));
 
-var _radio = _interopRequireDefault(require("antd/es/radio"));
+var _Group = _interopRequireDefault(require("./components/Group"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _default = _radio.default;
+var Radio = _Radio.default;
+Radio.Group = _Group.default;
+var _default = Radio;
 exports.default = _default;

package/lib/Radio/interface/radio.d.ts

@@ -0,0 +1,24 @@
+import { ReactNode } from 'react';
+export interface IRadioProps {
+    /**
+     * @description  当前元素是否选中
+     * @default false
+     */
+    checked?: boolean;
+    /**
+     * @description  当前元素是否默认选中
+     * @default false
+     */
+    defaultChecked?: boolean;
+    /**
+     * @description  当前元素是否禁用
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * @description  当前元素的value值，与Group中的value匹配
+     * @default -
+     */
+    value?: string | number | boolean;
+    children?: ReactNode[] | ReactNode;
+}

package/lib/Radio/interface/radio.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/Radio/interface/radioGroup.d.ts

@@ -0,0 +1,42 @@
+import { ReactNode } from 'react';
+export declare type TRadioGroupStyle = 'border' | 'filled';
+export declare type TRadioSize = 'large' | 'middle' | 'small' | 'default';
+export declare type TRadioType = 'radio' | 'button' | 'iconButton';
+export interface IRadioGroupProps {
+    /**
+     * @description 按钮组的样式 'border' ｜ 'filled'
+     * @default  'border'
+     */
+    radioGroupStyle?: TRadioGroupStyle;
+    /**
+     * @description 按钮组的默认选项，按钮组为非受控组件请勿使用value设置默认值
+     * @default -
+     */
+    defaultValue?: string | number | boolean;
+    /**
+     * @description 设置按钮组的大小，有'large' | 'middle'('default') | 'small
+     * @default 'middle'
+     */
+    size?: TRadioSize;
+    /**
+     * @description 当按钮组为受控组件时，设置按钮组的当前选中的值
+     * @default -
+     */
+    value?: string | number | boolean;
+    /**
+     * @description 当按钮组选中值变化时的回调函数
+     * @default -
+     */
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * @description 设置按钮组的类型 'radio' | 'button' | 'iconButton'
+     * @default 'radio'
+     */
+    type?: TRadioType;
+    /**
+     * @description 按钮组最外层盒子的类名
+     * @default -
+     */
+    className?: string;
+    children?: ReactNode[] | ReactNode;
+}

package/lib/Radio/interface/radioGroup.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/Radio/style/index.less

@@ -1 +1,349 @@
 @import '../../style/index.less';
+
+@radio-icon-button-padding-large: 10px;
+@radio-icon-button-padding-middle: 9px;
+@radio-icon-button-padding-small: 8px;
+@radio-group-height-large: 36px;
+@radio-group-height-middle: 32px;
+@radio-group-height-small: 28px;
+@radio-button-padding: 12px;
+
+// Radio组件基础样式
+.ald-radio-wrapper {
+  display: inline-flex;
+  gap: 8px;
+  align-items: center;
+  justify-content: start;
+  height: 20px;
+  padding: 0;
+  cursor: pointer;
+}
+
+.ald-radio {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 20px;
+  height: 20px;
+}
+
+.ald-radio-input {
+  position: absolute;
+  z-index: 1;
+  width: 1px;
+  height: 1px;
+  cursor: pointer;
+  opacity: 0;
+  inset: 0;
+}
+
+.ald-radio-inner {
+  position: relative;
+  display: inline-block;
+  width: 17px;
+  height: 17px;
+  border: 1px solid @NL90;
+  border-radius: 50%;
+}
+
+.ald-radio-desc {
+  z-index: 2;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: @NL0;
+  font-weight: 400;
+}
+// 绘制选中时的圆圈样式
+.ald-radio-checked > .ald-radio-inner {
+  background-color: @B60;
+  border: 0;
+  transform: background 0.5s ease;
+
+  &::after {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    width: 6px;
+    height: 6px;
+    background-color: @ND0;
+    border-radius: 50%;
+    transform: translate(-50%, -50%);
+    content: '';
+  }
+}
+// 禁用状态下的样式
+.ald-radio-disabled > .ald-radio-inner {
+  background-color: @NL90;
+  border: 0;
+}
+
+.ald-radio-disabled.ald-radio-checked > .ald-radio-inner::after {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 6px;
+  height: 6px;
+  background: @NL90;
+  border-radius: 50%;
+  transform: translate(-50%, -50%);
+  content: '';
+}
+// 禁用的样式
+.ald-radio-label.ald-radio-wrapper-disabled {
+  cursor: default;
+
+  .ald-radio-desc {
+    color: @NL60;
+  }
+}
+// RadioGroup基础样式
+.ald-radio-group {
+  position: relative;
+
+  .ald-radio-label .ald-radio-desc {
+    color: @NL30;
+    font-weight: 500;
+    font-size: @font-size-middle;
+    font-style: normal;
+  }
+
+  &.ald-radio-group-radio {
+    .ald-radio-desc {
+      color: @NL0;
+      font-weight: 400;
+    }
+  }
+
+  .ald-radio-wrapper:not(:first-child) {
+    margin-left: 16px;
+  }
+}
+
+// filled填充样式下的滑块样式
+.ald-radio-filled-slider {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 1;
+  width: 0;
+  height: 100%;
+  background: @BG100;
+  border: 1px solid @NL90;
+  border-radius: @border-radius-middle;
+  transition: width, left, height 0.3s, 0.3s, 0.3s ease;
+}
+
+// button状态下的样式
+.ald-radio-group-button,
+.ald-radio-group-icon-button {
+  display: flex;
+  align-items: flex-start;
+  box-sizing: border-box;
+  width: min-content;
+  width: auto;
+  padding: 0;
+  overflow: hidden;
+
+  .ald-radio-label {
+    color: @NL30;
+    font-size: @font-size-middle;
+  }
+  // 按钮样式禁用的文字颜色
+  .ald-radio-wrapper-disabled {
+    .ald-radio-desc {
+      color: @NL80;
+    }
+  }
+  // border的样式
+  .ald-radio-button-wrapper-border {
+    padding: 0 @radio-button-padding - 1;
+  }
+
+  .ald-radio-button-wrapper-border,
+  .ald-radio-icon-button-wrapper-border {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+    background: @BG100;
+    border: 1px solid @NL90;
+    border-right: 1px solid transparent;
+    cursor: pointer;
+
+    &:first-child {
+      border-radius: 6px 0 0 6px;
+    }
+
+    &:last-child {
+      border-right: 1px solid @NL90;
+      border-radius: 0 6px 6px 0;
+    }
+
+    .ald-radio {
+      width: 0;
+
+      .ald-radio-input,
+      .ald-radio-inner {
+        width: 0;
+        border: 0;
+      }
+    }
+
+    .ald-radio-checked > .ald-radio-inner::after {
+      width: 0;
+    }
+  }
+
+  // button选中状态下的样式
+  .ald-radio-wrapper-checked.ald-radio-button-wrapper-border,
+  .ald-radio-wrapper-checked.ald-radio-icon-button-wrapper-border {
+    background: @B98;
+    transition: background 0.5s ease;
+
+    .ald-radio-desc {
+      position: relative;
+      color: @NL0;
+      transition: text-shadow 0.5s ease;
+    }
+  }
+
+  // filled样式的button
+  .ald-radio-button-wrapper-filled {
+    padding: 0 @radio-button-padding;
+  }
+
+  .ald-radio-button-wrapper-filled,
+  .ald-radio-icon-button-wrapper-filled {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+    background-color: @BG90;
+    cursor: pointer;
+
+    &:first-of-type {
+      border-radius: @border-radius-middle 0 0 @border-radius-middle;
+    }
+
+    &:last-of-type {
+      border-radius: 0 @border-radius-middle @border-radius-middle 0;
+    }
+
+    .ald-radio {
+      width: 0;
+
+      .ald-radio-input,
+      .ald-radio-inner {
+        width: 0;
+        border: 0;
+      }
+    }
+
+    .ald-radio-checked > .ald-radio-inner::after {
+      width: 0;
+    }
+  }
+
+  .ald-radio-wrapper-checked.ald-radio-button-wrapper-filled,
+  .ald-radio-wrapper-checked.ald-radio-icon-button-wrapper-filled {
+    position: relative;
+
+    .ald-radio-desc {
+      position: relative;
+      z-index: 2;
+      color: @NL0;
+    }
+  }
+  // 各种大小
+  &.ald-radio-group-middle {
+    height: @radio-group-height-middle;
+
+    .ald-radio-icon-button-wrapper-filled {
+      padding: 0 @radio-icon-button-padding-middle;
+    }
+
+    .ald-radio-icon-button-wrapper-border {
+      padding: 0 @radio-icon-button-padding-middle - 1;
+    }
+
+    .ald-radio-label {
+      .ald-radio-desc {
+        font-size: @font-size-middle;
+      }
+    }
+  }
+
+  &.ald-radio-group-small {
+    height: @radio-group-height-small;
+
+    .ald-radio-icon-button-wrapper-filled {
+      padding: 0 @radio-icon-button-padding-small;
+    }
+
+    .ald-radio-icon-button-wrapper-border {
+      padding: 0 @radio-icon-button-padding-small - 1;
+    }
+
+    .ald-radio-label {
+      .ald-radio-desc {
+        font-size: @font-size-small;
+      }
+    }
+
+    .ald-radio-button-wrapper-border,
+    .ald-radio-icon-button-wrapper-border,
+    .ald-radio-button-wrapper-filled,
+    .ald-radio-icon-button-wrapper-filled {
+      &:first-of-type {
+        border-radius: @border-radius-small 0 0 @border-radius-small;
+      }
+
+      &:last-of-type {
+        border-radius: 0 @border-radius-small 0 @border-radius-small 0;
+      }
+    }
+
+    .ald-radio-filled-slider {
+      border-radius: @border-radius-small;
+    }
+  }
+
+  &.ald-radio-group.ald-radio-group-large {
+    height: @radio-group-height-large;
+
+    .ald-radio-icon-button-wrapper-filled {
+      padding: 0 @radio-icon-button-padding-large;
+    }
+
+    .ald-radio-icon-button-wrapper-border {
+      padding: 0 @radio-icon-button-padding-large - 1;
+    }
+
+    .ald-radio-label {
+      .ald-radio-desc {
+        font-size: @font-size-large;
+      }
+    }
+
+    .ald-radio-button-wrapper-border,
+    .ald-radio-icon-button-wrapper-border,
+    .ald-radio-button-wrapper-filled,
+    .ald-radio-icon-button-wrapper-filled {
+      &:first-of-type {
+        border-radius: @border-radius-large 0 0 @border-radius-large;
+      }
+
+      &:last-of-type {
+        border-radius: 0 @border-radius-large @border-radius-large 0;
+      }
+    }
+
+    .ald-radio-filled-slider {
+      border-radius: @border-radius-large;
+    }
+  }
+}

package/lib/Select/index.js

@@ -27,7 +27,7 @@ var _motion = require("antd/lib/_util/motion");
 
 var _statusUtils = require("antd/lib/_util/statusUtils");
 
-var _defaultRenderEmpty = _interopRequireDefault(require("antd/lib/config-provider/defaultRenderEmpty"));
+var _defaultRenderEmpty = _interopRequireDefault(require("../ConfigProvider/defaultRenderEmpty"));
 
 var _iconUtil = _interopRequireDefault(require("./utils/iconUtil"));