add all frontend files

node_modules/rc-segmented/LICENSE.md

@@ -0,0 +1,9 @@
+The MIT License (MIT)
+
+Copyright (c) 2019-present afc163
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

node_modules/rc-segmented/README.md

@@ -0,0 +1,79 @@
+# rc-segmented
+
+[![NPM version][npm-image]][npm-url] [![npm download][download-image]][download-url] [![dumi](https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square)](https://github.com/umijs/dumi) [![build status][github-actions-image]][github-actions-url] [![Codecov][codecov-image]][codecov-url] [![bundle size][bundlephobia-image]][bundlephobia-url]
+
+[npm-image]: http://img.shields.io/npm/v/rc-segmented.svg?style=flat-square
+[npm-url]: http://npmjs.org/package/rc-segmented
+[github-actions-image]: https://github.com/react-component/segmented/workflows/CI/badge.svg
+[github-actions-url]: https://github.com/react-component/segmented/actions
+[codecov-image]: https://codecov.io/gh/react-component/segmented/branch/master/graph/badge.svg
+[codecov-url]: https://codecov.io/gh/react-component/segmented/branch/master
+[download-image]: https://img.shields.io/npm/dm/rc-segmented.svg?style=flat-square
+[download-url]: https://npmjs.org/package/rc-segmented
+[bundlephobia-url]: https://bundlephobia.com/package/rc-segmented
+[bundlephobia-image]: https://badgen.net/bundlephobia/minzip/rc-segmented
+
+React Segmented Control.
+
+![](https://gw.alipayobjects.com/mdn/rms_50855f/afts/img/A*bmGGQpnWs0oAAAAAAAAAAAAAARQnAQ)
+
+## Live Demo
+
+https://react-component.github.io/segmented/
+
+## Install
+
+[![rc-segmented](https://nodei.co/npm/rc-segmented.png)](https://npmjs.org/package/rc-segmented)
+
+## Usage
+
+```js
+import Segmented from 'rc-segmented';
+import 'rc-segmented/assets/index.css'; // import 'rc-segmented/asssets/index.less';
+import { render } from 'react-dom';
+
+render(
+  <Segmented
+    options={['Antd', 'Antv', 'Egg.js']}
+    onChange={(value) => handleValueChange(value)}
+  />,
+  mountNode,
+);
+```
+
+## API
+
+Please note that **onChange** API
+ changed on v2.0.0+
+
+| Property     | Type                                                           | Default      | Description                        |
+| --------- | --------- | --------- | --------- |
+| prefixCls    | string                                                         | rc-segmented | prefixCls of this component |
+| className    | string                                                         | ''           | additional class name of segmented |
+| style        | React.CSSProperties                                            |              | style properties of segmented      |
+| options      | Array<string \| number \| [SegmentedOption](#SegmentedOption)> | []           | options for choices                |
+| value        | string \| number                                               |              | value of segmented                 |
+| defaultValue | string \| number                                               |              | defaultValue of segmented          |
+| value | string \| number                                               |              | currently selected value of segmented          |
+| onChange     | (value: string \| number) => void                                               |              | defaultValue of segmented          |
+| disabled     | boolean                                                        | false        | disabled status of segmented       |
+
+### SegmentedOption
+
+| Property  | Type      | Default | Description                               |
+| --------- | --------- | --------- | --------- |
+| label     | ReactNode |         | label of segmented option                 |
+| value     | string \| number   |  | value of segmented option |
+| className | string    | ''      | additional class name of segmented option |
+| disabled  | boolean   | false   | disabled status of segmented option       |
+
+## Development
+
+```
+npm install
+npm start
+```
+
+## License
+
+rc-segmented is released under the MIT license.

node_modules/rc-segmented/assets/index.css

@@ -0,0 +1,97 @@
+.rc-segmented {
+  display: inline-block;
+  padding: 2px;
+  background-color: rgba(0, 0, 0, 0.04);
+}
+.rc-segmented-group {
+  position: relative;
+  display: flex;
+  flex-direction: row;
+  align-items: stretch;
+  justify-content: flex-start;
+  width: 100%;
+  border-radius: 2px;
+}
+.rc-segmented-item {
+  position: relative;
+  min-height: 28px;
+  padding: 4px 10px;
+  color: rgba(0, 0, 0, 0.85);
+  text-align: center;
+  cursor: pointer;
+}
+.rc-segmented-item-selected {
+  background-color: white;
+  color: #262626;
+}
+.rc-segmented-item:hover,
+.rc-segmented-item:focus {
+  color: #262626;
+}
+.rc-segmented-item-disabled,
+.rc-segmented-item-disabled:hover,
+.rc-segmented-item-disabled:focus {
+  color: rgba(0, 0, 0, 0.25);
+  cursor: not-allowed;
+}
+.rc-segmented-item-label {
+  z-index: 2;
+  line-height: 24px;
+}
+.rc-segmented-item-input {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 0;
+  height: 0;
+  opacity: 0;
+  pointer-events: none;
+}
+.rc-segmented-thumb {
+  background-color: white;
+  position: absolute;
+  width: 0;
+  height: 100%;
+  padding: 4px 0;
+  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);
+}
+.rc-segmented-vertical .rc-segmented-group {
+  flex-direction: column;
+}
+.rc-segmented-vertical .rc-segmented-item {
+  width: 100%;
+  text-align: left;
+}
+.rc-segmented-vertical .rc-segmented-thumb {
+  width: 100%;
+  height: 0;
+  padding: 0 4px;
+  transition: transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), height 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+.rc-segmented-disabled .rc-segmented-item,
+.rc-segmented-disabled .rc-segmented-item:hover,
+.rc-segmented-disabled .rc-segmented-item:focus,
+.rc-segmented-disabled .rc-segmented-item:hover,
+.rc-segmented-disabled .rc-segmented-item:hover:hover,
+.rc-segmented-disabled .rc-segmented-item:focus:hover,
+.rc-segmented-disabled .rc-segmented-item:focus,
+.rc-segmented-disabled .rc-segmented-item:hover:focus,
+.rc-segmented-disabled .rc-segmented-item:focus:focus {
+  color: rgba(0, 0, 0, 0.25);
+  cursor: not-allowed;
+}
+.rc-segmented-thumb-motion-appear-active,
+.rc-segmented-thumb-motion-enter-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);
+  will-change: transform, width;
+}
+.rc-segmented-rtl {
+  direction: rtl;
+}
+.rc-segmented-item:focus {
+  outline: none;
+}
+.rc-segmented-item-focused {
+  border-radius: 2px;
+  box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
+}

node_modules/rc-segmented/assets/index.less

@@ -0,0 +1,130 @@
+@segmented-prefix-cls: rc-segmented;
+
+@disabled-color: fade(#000, 25%);
+@selected-bg-color: white;
+@text-color: #262626;
+@transition-duration: 0.3s;
+@transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
+
+.segmented-disabled-item() {
+  &,
+  &:hover,
+  &:focus {
+    color: @disabled-color;
+    cursor: not-allowed;
+  }
+}
+
+.segmented-item-selected() {
+  background-color: @selected-bg-color;
+}
+
+.@{segmented-prefix-cls} {
+  display: inline-block;
+  padding: 2px;
+  background-color: rgba(0, 0, 0, 0.04);
+
+  &-group {
+    position: relative;
+    display: flex;
+    flex-direction: row;
+    align-items: stretch;
+    justify-content: flex-start;
+    width: 100%;
+    border-radius: 2px;
+  }
+
+  &-item {
+    position: relative;
+    min-height: 28px;
+    padding: 4px 10px;
+    color: fade(#000, 85%);
+    text-align: center;
+    cursor: pointer;
+
+    &-selected {
+      .segmented-item-selected();
+      color: @text-color;
+    }
+
+    &:hover,
+    &:focus {
+      color: @text-color;
+    }
+
+    &-disabled {
+      .segmented-disabled-item();
+    }
+
+    &-label {
+      z-index: 2;
+      line-height: 24px;
+    }
+
+    &-input {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 0;
+      height: 0;
+      opacity: 0;
+      pointer-events: none;
+    }
+  }
+
+  &-thumb {
+    .segmented-item-selected();
+    position: absolute;
+    width: 0;
+    height: 100%;
+    padding: 4px 0;
+    transition: transform @transition-duration @transition-timing-function,
+      width @transition-duration @transition-timing-function;
+  }
+
+  &-vertical &-group {
+    flex-direction: column;
+  }
+
+  &-vertical &-item {
+    width: 100%;
+    text-align: left;
+  }
+
+  &-vertical &-thumb {
+    width: 100%;
+    height: 0;
+    padding: 0 4px;
+    transition: transform @transition-duration @transition-timing-function,
+      height @transition-duration @transition-timing-function;
+  }
+
+  // disabled styles
+  &-disabled &-item,
+  &-disabled &-item:hover,
+  &-disabled &-item:focus {
+    .segmented-disabled-item();
+  }
+
+  &-thumb-motion-appear-active,
+  &-thumb-motion-enter-active {
+    transition: transform @transition-duration @transition-timing-function,
+      width @transition-duration @transition-timing-function;
+    will-change: transform, width;
+  }
+
+  &-rtl {
+    direction: rtl;
+  }
+}
+
+.rc-segmented-item {
+  &:focus {
+    outline: none;
+  }
+
+  &-focused {
+    border-radius: 2px;
+    box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
+  }
+}

node_modules/rc-segmented/assets/style.less

@@ -0,0 +1,12 @@
+@import './index.less';
+
+// reset
+* {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+.wrapper {
+  margin-bottom: 10px;
+}

node_modules/rc-segmented/es/MotionThumb.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import type { SegmentedValue } from '.';
+export interface MotionThumbInterface {
+    containerRef: React.RefObject<HTMLDivElement>;
+    value: SegmentedValue;
+    getValueIndex: (value: SegmentedValue) => number;
+    prefixCls: string;
+    motionName: string;
+    onMotionStart: VoidFunction;
+    onMotionEnd: VoidFunction;
+    direction?: 'ltr' | 'rtl';
+    vertical?: boolean;
+}
+export default function MotionThumb(props: MotionThumbInterface): React.JSX.Element | null;

node_modules/rc-segmented/es/MotionThumb.js

@@ -0,0 +1,178 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import classNames from 'classnames';
+import CSSMotion from 'rc-motion';
+import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
+import { composeRef } from "rc-util/es/ref";
+import * as React from 'react';
+var calcThumbStyle = function calcThumbStyle(targetElement, vertical) {
+  if (!targetElement) return null;
+  var style = {
+    left: targetElement.offsetLeft,
+    right: targetElement.parentElement.clientWidth - targetElement.clientWidth - targetElement.offsetLeft,
+    width: targetElement.clientWidth,
+    top: targetElement.offsetTop,
+    bottom: targetElement.parentElement.clientHeight - targetElement.clientHeight - targetElement.offsetTop,
+    height: targetElement.clientHeight
+  };
+  if (vertical) {
+    // Adjusts positioning and size for vertical layout by setting horizontal properties to 0 and using vertical properties from the style object.
+    return {
+      left: 0,
+      right: 0,
+      width: 0,
+      top: style.top,
+      bottom: style.bottom,
+      height: style.height
+    };
+  }
+  return {
+    left: style.left,
+    right: style.right,
+    width: style.width,
+    top: 0,
+    bottom: 0,
+    height: 0
+  };
+};
+var toPX = function toPX(value) {
+  return value !== undefined ? "".concat(value, "px") : undefined;
+};
+export default function MotionThumb(props) {
+  var prefixCls = props.prefixCls,
+    containerRef = props.containerRef,
+    value = props.value,
+    getValueIndex = props.getValueIndex,
+    motionName = props.motionName,
+    onMotionStart = props.onMotionStart,
+    onMotionEnd = props.onMotionEnd,
+    direction = props.direction,
+    _props$vertical = props.vertical,
+    vertical = _props$vertical === void 0 ? false : _props$vertical;
+  var thumbRef = React.useRef(null);
+  var _React$useState = React.useState(value),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    prevValue = _React$useState2[0],
+    setPrevValue = _React$useState2[1];
+
+  // =========================== Effect ===========================
+  var findValueElement = function findValueElement(val) {
+    var _containerRef$current;
+    var index = getValueIndex(val);
+    var ele = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.querySelectorAll(".".concat(prefixCls, "-item"))[index];
+    return (ele === null || ele === void 0 ? void 0 : ele.offsetParent) && ele;
+  };
+  var _React$useState3 = React.useState(null),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    prevStyle = _React$useState4[0],
+    setPrevStyle = _React$useState4[1];
+  var _React$useState5 = React.useState(null),
+    _React$useState6 = _slicedToArray(_React$useState5, 2),
+    nextStyle = _React$useState6[0],
+    setNextStyle = _React$useState6[1];
+  useLayoutEffect(function () {
+    if (prevValue !== value) {
+      var prev = findValueElement(prevValue);
+      var next = findValueElement(value);
+      var calcPrevStyle = calcThumbStyle(prev, vertical);
+      var calcNextStyle = calcThumbStyle(next, vertical);
+      setPrevValue(value);
+      setPrevStyle(calcPrevStyle);
+      setNextStyle(calcNextStyle);
+      if (prev && next) {
+        onMotionStart();
+      } else {
+        onMotionEnd();
+      }
+    }
+  }, [value]);
+  var thumbStart = React.useMemo(function () {
+    if (vertical) {
+      var _prevStyle$top;
+      return toPX((_prevStyle$top = prevStyle === null || prevStyle === void 0 ? void 0 : prevStyle.top) !== null && _prevStyle$top !== void 0 ? _prevStyle$top : 0);
+    }
+    if (direction === 'rtl') {
+      return toPX(-(prevStyle === null || prevStyle === void 0 ? void 0 : prevStyle.right));
+    }
+    return toPX(prevStyle === null || prevStyle === void 0 ? void 0 : prevStyle.left);
+  }, [vertical, direction, prevStyle]);
+  var thumbActive = React.useMemo(function () {
+    if (vertical) {
+      var _nextStyle$top;
+      return toPX((_nextStyle$top = nextStyle === null || nextStyle === void 0 ? void 0 : nextStyle.top) !== null && _nextStyle$top !== void 0 ? _nextStyle$top : 0);
+    }
+    if (direction === 'rtl') {
+      return toPX(-(nextStyle === null || nextStyle === void 0 ? void 0 : nextStyle.right));
+    }
+    return toPX(nextStyle === null || nextStyle === void 0 ? void 0 : nextStyle.left);
+  }, [vertical, direction, nextStyle]);
+
+  // =========================== Motion ===========================
+  var onAppearStart = function onAppearStart() {
+    if (vertical) {
+      return {
+        transform: 'translateY(var(--thumb-start-top))',
+        height: 'var(--thumb-start-height)'
+      };
+    }
+    return {
+      transform: 'translateX(var(--thumb-start-left))',
+      width: 'var(--thumb-start-width)'
+    };
+  };
+  var onAppearActive = function onAppearActive() {
+    if (vertical) {
+      return {
+        transform: 'translateY(var(--thumb-active-top))',
+        height: 'var(--thumb-active-height)'
+      };
+    }
+    return {
+      transform: 'translateX(var(--thumb-active-left))',
+      width: 'var(--thumb-active-width)'
+    };
+  };
+  var onVisibleChanged = function onVisibleChanged() {
+    setPrevStyle(null);
+    setNextStyle(null);
+    onMotionEnd();
+  };
+
+  // =========================== Render ===========================
+  // No need motion when nothing exist in queue
+  if (!prevStyle || !nextStyle) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(CSSMotion, {
+    visible: true,
+    motionName: motionName,
+    motionAppear: true,
+    onAppearStart: onAppearStart,
+    onAppearActive: onAppearActive,
+    onVisibleChanged: onVisibleChanged
+  }, function (_ref, ref) {
+    var motionClassName = _ref.className,
+      motionStyle = _ref.style;
+    var mergedStyle = _objectSpread(_objectSpread({}, motionStyle), {}, {
+      '--thumb-start-left': thumbStart,
+      '--thumb-start-width': toPX(prevStyle === null || prevStyle === void 0 ? void 0 : prevStyle.width),
+      '--thumb-active-left': thumbActive,
+      '--thumb-active-width': toPX(nextStyle === null || nextStyle === void 0 ? void 0 : nextStyle.width),
+      '--thumb-start-top': thumbStart,
+      '--thumb-start-height': toPX(prevStyle === null || prevStyle === void 0 ? void 0 : prevStyle.height),
+      '--thumb-active-top': thumbActive,
+      '--thumb-active-height': toPX(nextStyle === null || nextStyle === void 0 ? void 0 : nextStyle.height)
+    });
+
+    // It's little ugly which should be refactor when @umi/test update to latest jsdom
+    var motionProps = {
+      ref: composeRef(thumbRef, ref),
+      style: mergedStyle,
+      className: classNames("".concat(prefixCls, "-thumb"), motionClassName)
+    };
+    if (process.env.NODE_ENV === 'test') {
+      motionProps['data-test-style'] = JSON.stringify(mergedStyle);
+    }
+    return /*#__PURE__*/React.createElement("div", motionProps);
+  });
+}

node_modules/rc-segmented/es/index.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+export type SegmentedValue = string | number;
+export type SegmentedRawOption = SegmentedValue;
+export interface SegmentedLabeledOption<ValueType = SegmentedRawOption> {
+    className?: string;
+    disabled?: boolean;
+    label: React.ReactNode;
+    value: ValueType;
+    /**
+     * html `title` property for label
+     */
+    title?: string;
+}
+type SegmentedOptions<T = SegmentedRawOption> = (T | SegmentedLabeledOption<T>)[];
+export interface SegmentedProps<ValueType = SegmentedValue> extends Omit<React.HTMLProps<HTMLDivElement>, 'defaultValue' | 'value' | 'onChange'> {
+    options: SegmentedOptions<ValueType>;
+    defaultValue?: ValueType;
+    value?: ValueType;
+    onChange?: (value: ValueType) => void;
+    disabled?: boolean;
+    prefixCls?: string;
+    direction?: 'ltr' | 'rtl';
+    motionName?: string;
+    vertical?: boolean;
+    name?: string;
+}
+declare const Segmented: React.ForwardRefExoticComponent<Omit<SegmentedProps<SegmentedValue>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const TypedSegmented: <ValueType>(props: SegmentedProps<ValueType> & {
+    ref?: React.ForwardedRef<HTMLDivElement>;
+}) => ReturnType<typeof Segmented>;
+export default TypedSegmented;

node_modules/rc-segmented/es/index.js

@@ -0,0 +1,227 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+var _excluded = ["prefixCls", "direction", "vertical", "options", "disabled", "defaultValue", "value", "name", "onChange", "className", "motionName"];
+import classNames from 'classnames';
+import useMergedState from "rc-util/es/hooks/useMergedState";
+import omit from "rc-util/es/omit";
+import { composeRef } from "rc-util/es/ref";
+import * as React from 'react';
+import MotionThumb from "./MotionThumb";
+function getValidTitle(option) {
+  if (typeof option.title !== 'undefined') {
+    return option.title;
+  }
+
+  // read `label` when title is `undefined`
+  if (_typeof(option.label) !== 'object') {
+    var _option$label;
+    return (_option$label = option.label) === null || _option$label === void 0 ? void 0 : _option$label.toString();
+  }
+}
+function normalizeOptions(options) {
+  return options.map(function (option) {
+    if (_typeof(option) === 'object' && option !== null) {
+      var validTitle = getValidTitle(option);
+      return _objectSpread(_objectSpread({}, option), {}, {
+        title: validTitle
+      });
+    }
+    return {
+      label: option === null || option === void 0 ? void 0 : option.toString(),
+      title: option === null || option === void 0 ? void 0 : option.toString(),
+      value: option
+    };
+  });
+}
+var InternalSegmentedOption = function InternalSegmentedOption(_ref) {
+  var prefixCls = _ref.prefixCls,
+    className = _ref.className,
+    disabled = _ref.disabled,
+    checked = _ref.checked,
+    label = _ref.label,
+    title = _ref.title,
+    value = _ref.value,
+    name = _ref.name,
+    onChange = _ref.onChange,
+    onFocus = _ref.onFocus,
+    onBlur = _ref.onBlur,
+    onKeyDown = _ref.onKeyDown,
+    onKeyUp = _ref.onKeyUp,
+    onMouseDown = _ref.onMouseDown;
+  var handleChange = function handleChange(event) {
+    if (disabled) {
+      return;
+    }
+    onChange(event, value);
+  };
+  return /*#__PURE__*/React.createElement("label", {
+    className: classNames(className, _defineProperty({}, "".concat(prefixCls, "-item-disabled"), disabled)),
+    onMouseDown: onMouseDown
+  }, /*#__PURE__*/React.createElement("input", {
+    name: name,
+    className: "".concat(prefixCls, "-item-input"),
+    type: "radio",
+    disabled: disabled,
+    checked: checked,
+    onChange: handleChange,
+    onFocus: onFocus,
+    onBlur: onBlur,
+    onKeyDown: onKeyDown,
+    onKeyUp: onKeyUp
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-item-label"),
+    title: title
+  }, label));
+};
+var Segmented = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var _segmentedOptions$;
+  var _props$prefixCls = props.prefixCls,
+    prefixCls = _props$prefixCls === void 0 ? 'rc-segmented' : _props$prefixCls,
+    direction = props.direction,
+    vertical = props.vertical,
+    _props$options = props.options,
+    options = _props$options === void 0 ? [] : _props$options,
+    disabled = props.disabled,
+    defaultValue = props.defaultValue,
+    value = props.value,
+    name = props.name,
+    onChange = props.onChange,
+    _props$className = props.className,
+    className = _props$className === void 0 ? '' : _props$className,
+    _props$motionName = props.motionName,
+    motionName = _props$motionName === void 0 ? 'thumb-motion' : _props$motionName,
+    restProps = _objectWithoutProperties(props, _excluded);
+  var containerRef = React.useRef(null);
+  var mergedRef = React.useMemo(function () {
+    return composeRef(containerRef, ref);
+  }, [containerRef, ref]);
+  var segmentedOptions = React.useMemo(function () {
+    return normalizeOptions(options);
+  }, [options]);
+
+  // Note: We should not auto switch value when value not exist in options
+  // which may break single source of truth.
+  var _useMergedState = useMergedState((_segmentedOptions$ = segmentedOptions[0]) === null || _segmentedOptions$ === void 0 ? void 0 : _segmentedOptions$.value, {
+      value: value,
+      defaultValue: defaultValue
+    }),
+    _useMergedState2 = _slicedToArray(_useMergedState, 2),
+    rawValue = _useMergedState2[0],
+    setRawValue = _useMergedState2[1];
+
+  // ======================= Change ========================
+  var _React$useState = React.useState(false),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    thumbShow = _React$useState2[0],
+    setThumbShow = _React$useState2[1];
+  var handleChange = function handleChange(event, val) {
+    setRawValue(val);
+    onChange === null || onChange === void 0 || onChange(val);
+  };
+  var divProps = omit(restProps, ['children']);
+
+  // ======================= Focus ========================
+  var _React$useState3 = React.useState(false),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    isKeyboard = _React$useState4[0],
+    setIsKeyboard = _React$useState4[1];
+  var _React$useState5 = React.useState(false),
+    _React$useState6 = _slicedToArray(_React$useState5, 2),
+    isFocused = _React$useState6[0],
+    setIsFocused = _React$useState6[1];
+  var handleFocus = function handleFocus() {
+    setIsFocused(true);
+  };
+  var handleBlur = function handleBlur() {
+    setIsFocused(false);
+  };
+  var handleMouseDown = function handleMouseDown() {
+    setIsKeyboard(false);
+  };
+
+  // capture keyboard tab interaction for correct focus style
+  var handleKeyUp = function handleKeyUp(event) {
+    if (event.key === 'Tab') {
+      setIsKeyboard(true);
+    }
+  };
+
+  // ======================= Keyboard ========================
+  var onOffset = function onOffset(offset) {
+    var currentIndex = segmentedOptions.findIndex(function (option) {
+      return option.value === rawValue;
+    });
+    var total = segmentedOptions.length;
+    var nextIndex = (currentIndex + offset + total) % total;
+    var nextOption = segmentedOptions[nextIndex];
+    if (nextOption) {
+      setRawValue(nextOption.value);
+      onChange === null || onChange === void 0 || onChange(nextOption.value);
+    }
+  };
+  var handleKeyDown = function handleKeyDown(event) {
+    switch (event.key) {
+      case 'ArrowLeft':
+      case 'ArrowUp':
+        onOffset(-1);
+        break;
+      case 'ArrowRight':
+      case 'ArrowDown':
+        onOffset(1);
+        break;
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", _extends({
+    role: "radiogroup",
+    "aria-label": "segmented control",
+    tabIndex: disabled ? undefined : 0,
+    "aria-orientation": vertical ? 'vertical' : 'horizontal'
+  }, divProps, {
+    className: classNames(prefixCls, _defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-rtl"), direction === 'rtl'), "".concat(prefixCls, "-disabled"), disabled), "".concat(prefixCls, "-vertical"), vertical), className),
+    ref: mergedRef
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-group")
+  }, /*#__PURE__*/React.createElement(MotionThumb, {
+    vertical: vertical,
+    prefixCls: prefixCls,
+    value: rawValue,
+    containerRef: containerRef,
+    motionName: "".concat(prefixCls, "-").concat(motionName),
+    direction: direction,
+    getValueIndex: function getValueIndex(val) {
+      return segmentedOptions.findIndex(function (n) {
+        return n.value === val;
+      });
+    },
+    onMotionStart: function onMotionStart() {
+      setThumbShow(true);
+    },
+    onMotionEnd: function onMotionEnd() {
+      setThumbShow(false);
+    }
+  }), segmentedOptions.map(function (segmentedOption) {
+    return /*#__PURE__*/React.createElement(InternalSegmentedOption, _extends({}, segmentedOption, {
+      name: name,
+      key: segmentedOption.value,
+      prefixCls: prefixCls,
+      className: classNames(segmentedOption.className, "".concat(prefixCls, "-item"), _defineProperty(_defineProperty({}, "".concat(prefixCls, "-item-selected"), segmentedOption.value === rawValue && !thumbShow), "".concat(prefixCls, "-item-focused"), isFocused && isKeyboard && segmentedOption.value === rawValue)),
+      checked: segmentedOption.value === rawValue,
+      onChange: handleChange,
+      onFocus: handleFocus,
+      onBlur: handleBlur,
+      onKeyDown: handleKeyDown,
+      onKeyUp: handleKeyUp,
+      onMouseDown: handleMouseDown,
+      disabled: !!disabled || !!segmentedOption.disabled
+    }));
+  })));
+});
+if (process.env.NODE_ENV !== 'production') {
+  Segmented.displayName = 'Segmented';
+}
+var TypedSegmented = Segmented;
+export default TypedSegmented;

node_modules/rc-segmented/lib/MotionThumb.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import type { SegmentedValue } from '.';
+export interface MotionThumbInterface {
+    containerRef: React.RefObject<HTMLDivElement>;
+    value: SegmentedValue;
+    getValueIndex: (value: SegmentedValue) => number;
+    prefixCls: string;
+    motionName: string;
+    onMotionStart: VoidFunction;
+    onMotionEnd: VoidFunction;
+    direction?: 'ltr' | 'rtl';
+    vertical?: boolean;
+}
+export default function MotionThumb(props: MotionThumbInterface): React.JSX.Element | null;

node_modules/rc-segmented/lib/MotionThumb.js

@@ -0,0 +1,188 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = MotionThumb;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _rcMotion = _interopRequireDefault(require("rc-motion"));
+var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
+var _ref2 = require("rc-util/lib/ref");
+var React = _interopRequireWildcard(require("react"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var calcThumbStyle = function calcThumbStyle(targetElement, vertical) {
+  if (!targetElement) return null;
+  var style = {
+    left: targetElement.offsetLeft,
+    right: targetElement.parentElement.clientWidth - targetElement.clientWidth - targetElement.offsetLeft,
+    width: targetElement.clientWidth,
+    top: targetElement.offsetTop,
+    bottom: targetElement.parentElement.clientHeight - targetElement.clientHeight - targetElement.offsetTop,
+    height: targetElement.clientHeight
+  };
+  if (vertical) {
+    // Adjusts positioning and size for vertical layout by setting horizontal properties to 0 and using vertical properties from the style object.
+    return {
+      left: 0,
+      right: 0,
+      width: 0,
+      top: style.top,
+      bottom: style.bottom,
+      height: style.height
+    };
+  }
+  return {
+    left: style.left,
+    right: style.right,
+    width: style.width,
+    top: 0,
+    bottom: 0,
+    height: 0
+  };
+};
+var toPX = function toPX(value) {
+  return value !== undefined ? "".concat(value, "px") : undefined;
+};
+function MotionThumb(props) {
+  var prefixCls = props.prefixCls,
+    containerRef = props.containerRef,
+    value = props.value,
+    getValueIndex = props.getValueIndex,
+    motionName = props.motionName,
+    onMotionStart = props.onMotionStart,
+    onMotionEnd = props.onMotionEnd,
+    direction = props.direction,
+    _props$vertical = props.vertical,
+    vertical = _props$vertical === void 0 ? false : _props$vertical;
+  var thumbRef = React.useRef(null);
+  var _React$useState = React.useState(value),
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    prevValue = _React$useState2[0],
+    setPrevValue = _React$useState2[1];
+
+  // =========================== Effect ===========================
+  var findValueElement = function findValueElement(val) {
+    var _containerRef$current;
+    var index = getValueIndex(val);
+    var ele = (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.querySelectorAll(".".concat(prefixCls, "-item"))[index];
+    return (ele === null || ele === void 0 ? void 0 : ele.offsetParent) && ele;
+  };
+  var _React$useState3 = React.useState(null),
+    _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
+    prevStyle = _React$useState4[0],
+    setPrevStyle = _React$useState4[1];
+  var _React$useState5 = React.useState(null),
+    _React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
+    nextStyle = _React$useState6[0],
+    setNextStyle = _React$useState6[1];
+  (0, _useLayoutEffect.default)(function () {
+    if (prevValue !== value) {
+      var prev = findValueElement(prevValue);
+      var next = findValueElement(value);
+      var calcPrevStyle = calcThumbStyle(prev, vertical);
+      var calcNextStyle = calcThumbStyle(next, vertical);
+      setPrevValue(value);
+      setPrevStyle(calcPrevStyle);
+      setNextStyle(calcNextStyle);
+      if (prev && next) {
+        onMotionStart();
+      } else {
+        onMotionEnd();
+      }
+    }
+  }, [value]);
+  var thumbStart = React.useMemo(function () {
+    if (vertical) {
+      var _prevStyle$top;
+      return toPX((_prevStyle$top = prevStyle === null || prevStyle === void 0 ? void 0 : prevStyle.top) !== null && _prevStyle$top !== void 0 ? _prevStyle$top : 0);
+    }
+    if (direction === 'rtl') {
+      return toPX(-(prevStyle === null || prevStyle === void 0 ? void 0 : prevStyle.right));
+    }
+    return toPX(prevStyle === null || prevStyle === void 0 ? void 0 : prevStyle.left);
+  }, [vertical, direction, prevStyle]);
+  var thumbActive = React.useMemo(function () {
+    if (vertical) {
+      var _nextStyle$top;
+      return toPX((_nextStyle$top = nextStyle === null || nextStyle === void 0 ? void 0 : nextStyle.top) !== null && _nextStyle$top !== void 0 ? _nextStyle$top : 0);
+    }
+    if (direction === 'rtl') {
+      return toPX(-(nextStyle === null || nextStyle === void 0 ? void 0 : nextStyle.right));
+    }
+    return toPX(nextStyle === null || nextStyle === void 0 ? void 0 : nextStyle.left);
+  }, [vertical, direction, nextStyle]);
+
+  // =========================== Motion ===========================
+  var onAppearStart = function onAppearStart() {
+    if (vertical) {
+      return {
+        transform: 'translateY(var(--thumb-start-top))',
+        height: 'var(--thumb-start-height)'
+      };
+    }
+    return {
+      transform: 'translateX(var(--thumb-start-left))',
+      width: 'var(--thumb-start-width)'
+    };
+  };
+  var onAppearActive = function onAppearActive() {
+    if (vertical) {
+      return {
+        transform: 'translateY(var(--thumb-active-top))',
+        height: 'var(--thumb-active-height)'
+      };
+    }
+    return {
+      transform: 'translateX(var(--thumb-active-left))',
+      width: 'var(--thumb-active-width)'
+    };
+  };
+  var onVisibleChanged = function onVisibleChanged() {
+    setPrevStyle(null);
+    setNextStyle(null);
+    onMotionEnd();
+  };
+
+  // =========================== Render ===========================
+  // No need motion when nothing exist in queue
+  if (!prevStyle || !nextStyle) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(_rcMotion.default, {
+    visible: true,
+    motionName: motionName,
+    motionAppear: true,
+    onAppearStart: onAppearStart,
+    onAppearActive: onAppearActive,
+    onVisibleChanged: onVisibleChanged
+  }, function (_ref, ref) {
+    var motionClassName = _ref.className,
+      motionStyle = _ref.style;
+    var mergedStyle = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, motionStyle), {}, {
+      '--thumb-start-left': thumbStart,
+      '--thumb-start-width': toPX(prevStyle === null || prevStyle === void 0 ? void 0 : prevStyle.width),
+      '--thumb-active-left': thumbActive,
+      '--thumb-active-width': toPX(nextStyle === null || nextStyle === void 0 ? void 0 : nextStyle.width),
+      '--thumb-start-top': thumbStart,
+      '--thumb-start-height': toPX(prevStyle === null || prevStyle === void 0 ? void 0 : prevStyle.height),
+      '--thumb-active-top': thumbActive,
+      '--thumb-active-height': toPX(nextStyle === null || nextStyle === void 0 ? void 0 : nextStyle.height)
+    });
+
+    // It's little ugly which should be refactor when @umi/test update to latest jsdom
+    var motionProps = {
+      ref: (0, _ref2.composeRef)(thumbRef, ref),
+      style: mergedStyle,
+      className: (0, _classnames.default)("".concat(prefixCls, "-thumb"), motionClassName)
+    };
+    if (process.env.NODE_ENV === 'test') {
+      motionProps['data-test-style'] = JSON.stringify(mergedStyle);
+    }
+    return /*#__PURE__*/React.createElement("div", motionProps);
+  });
+}

node_modules/rc-segmented/lib/index.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+export type SegmentedValue = string | number;
+export type SegmentedRawOption = SegmentedValue;
+export interface SegmentedLabeledOption<ValueType = SegmentedRawOption> {
+    className?: string;
+    disabled?: boolean;
+    label: React.ReactNode;
+    value: ValueType;
+    /**
+     * html `title` property for label
+     */
+    title?: string;
+}
+type SegmentedOptions<T = SegmentedRawOption> = (T | SegmentedLabeledOption<T>)[];
+export interface SegmentedProps<ValueType = SegmentedValue> extends Omit<React.HTMLProps<HTMLDivElement>, 'defaultValue' | 'value' | 'onChange'> {
+    options: SegmentedOptions<ValueType>;
+    defaultValue?: ValueType;
+    value?: ValueType;
+    onChange?: (value: ValueType) => void;
+    disabled?: boolean;
+    prefixCls?: string;
+    direction?: 'ltr' | 'rtl';
+    motionName?: string;
+    vertical?: boolean;
+    name?: string;
+}
+declare const Segmented: React.ForwardRefExoticComponent<Omit<SegmentedProps<SegmentedValue>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const TypedSegmented: <ValueType>(props: SegmentedProps<ValueType> & {
+    ref?: React.ForwardedRef<HTMLDivElement>;
+}) => ReturnType<typeof Segmented>;
+export default TypedSegmented;

node_modules/rc-segmented/lib/index.js

@@ -0,0 +1,237 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof3 = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _useMergedState3 = _interopRequireDefault(require("rc-util/lib/hooks/useMergedState"));
+var _omit = _interopRequireDefault(require("rc-util/lib/omit"));
+var _ref2 = require("rc-util/lib/ref");
+var React = _interopRequireWildcard(require("react"));
+var _MotionThumb = _interopRequireDefault(require("./MotionThumb"));
+var _excluded = ["prefixCls", "direction", "vertical", "options", "disabled", "defaultValue", "value", "name", "onChange", "className", "motionName"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof3(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function getValidTitle(option) {
+  if (typeof option.title !== 'undefined') {
+    return option.title;
+  }
+
+  // read `label` when title is `undefined`
+  if ((0, _typeof2.default)(option.label) !== 'object') {
+    var _option$label;
+    return (_option$label = option.label) === null || _option$label === void 0 ? void 0 : _option$label.toString();
+  }
+}
+function normalizeOptions(options) {
+  return options.map(function (option) {
+    if ((0, _typeof2.default)(option) === 'object' && option !== null) {
+      var validTitle = getValidTitle(option);
+      return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, option), {}, {
+        title: validTitle
+      });
+    }
+    return {
+      label: option === null || option === void 0 ? void 0 : option.toString(),
+      title: option === null || option === void 0 ? void 0 : option.toString(),
+      value: option
+    };
+  });
+}
+var InternalSegmentedOption = function InternalSegmentedOption(_ref) {
+  var prefixCls = _ref.prefixCls,
+    className = _ref.className,
+    disabled = _ref.disabled,
+    checked = _ref.checked,
+    label = _ref.label,
+    title = _ref.title,
+    value = _ref.value,
+    name = _ref.name,
+    onChange = _ref.onChange,
+    onFocus = _ref.onFocus,
+    onBlur = _ref.onBlur,
+    onKeyDown = _ref.onKeyDown,
+    onKeyUp = _ref.onKeyUp,
+    onMouseDown = _ref.onMouseDown;
+  var handleChange = function handleChange(event) {
+    if (disabled) {
+      return;
+    }
+    onChange(event, value);
+  };
+  return /*#__PURE__*/React.createElement("label", {
+    className: (0, _classnames.default)(className, (0, _defineProperty2.default)({}, "".concat(prefixCls, "-item-disabled"), disabled)),
+    onMouseDown: onMouseDown
+  }, /*#__PURE__*/React.createElement("input", {
+    name: name,
+    className: "".concat(prefixCls, "-item-input"),
+    type: "radio",
+    disabled: disabled,
+    checked: checked,
+    onChange: handleChange,
+    onFocus: onFocus,
+    onBlur: onBlur,
+    onKeyDown: onKeyDown,
+    onKeyUp: onKeyUp
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-item-label"),
+    title: title
+  }, label));
+};
+var Segmented = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var _segmentedOptions$;
+  var _props$prefixCls = props.prefixCls,
+    prefixCls = _props$prefixCls === void 0 ? 'rc-segmented' : _props$prefixCls,
+    direction = props.direction,
+    vertical = props.vertical,
+    _props$options = props.options,
+    options = _props$options === void 0 ? [] : _props$options,
+    disabled = props.disabled,
+    defaultValue = props.defaultValue,
+    value = props.value,
+    name = props.name,
+    onChange = props.onChange,
+    _props$className = props.className,
+    className = _props$className === void 0 ? '' : _props$className,
+    _props$motionName = props.motionName,
+    motionName = _props$motionName === void 0 ? 'thumb-motion' : _props$motionName,
+    restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
+  var containerRef = React.useRef(null);
+  var mergedRef = React.useMemo(function () {
+    return (0, _ref2.composeRef)(containerRef, ref);
+  }, [containerRef, ref]);
+  var segmentedOptions = React.useMemo(function () {
+    return normalizeOptions(options);
+  }, [options]);
+
+  // Note: We should not auto switch value when value not exist in options
+  // which may break single source of truth.
+  var _useMergedState = (0, _useMergedState3.default)((_segmentedOptions$ = segmentedOptions[0]) === null || _segmentedOptions$ === void 0 ? void 0 : _segmentedOptions$.value, {
+      value: value,
+      defaultValue: defaultValue
+    }),
+    _useMergedState2 = (0, _slicedToArray2.default)(_useMergedState, 2),
+    rawValue = _useMergedState2[0],
+    setRawValue = _useMergedState2[1];
+
+  // ======================= Change ========================
+  var _React$useState = React.useState(false),
+    _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
+    thumbShow = _React$useState2[0],
+    setThumbShow = _React$useState2[1];
+  var handleChange = function handleChange(event, val) {
+    setRawValue(val);
+    onChange === null || onChange === void 0 || onChange(val);
+  };
+  var divProps = (0, _omit.default)(restProps, ['children']);
+
+  // ======================= Focus ========================
+  var _React$useState3 = React.useState(false),
+    _React$useState4 = (0, _slicedToArray2.default)(_React$useState3, 2),
+    isKeyboard = _React$useState4[0],
+    setIsKeyboard = _React$useState4[1];
+  var _React$useState5 = React.useState(false),
+    _React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
+    isFocused = _React$useState6[0],
+    setIsFocused = _React$useState6[1];
+  var handleFocus = function handleFocus() {
+    setIsFocused(true);
+  };
+  var handleBlur = function handleBlur() {
+    setIsFocused(false);
+  };
+  var handleMouseDown = function handleMouseDown() {
+    setIsKeyboard(false);
+  };
+
+  // capture keyboard tab interaction for correct focus style
+  var handleKeyUp = function handleKeyUp(event) {
+    if (event.key === 'Tab') {
+      setIsKeyboard(true);
+    }
+  };
+
+  // ======================= Keyboard ========================
+  var onOffset = function onOffset(offset) {
+    var currentIndex = segmentedOptions.findIndex(function (option) {
+      return option.value === rawValue;
+    });
+    var total = segmentedOptions.length;
+    var nextIndex = (currentIndex + offset + total) % total;
+    var nextOption = segmentedOptions[nextIndex];
+    if (nextOption) {
+      setRawValue(nextOption.value);
+      onChange === null || onChange === void 0 || onChange(nextOption.value);
+    }
+  };
+  var handleKeyDown = function handleKeyDown(event) {
+    switch (event.key) {
+      case 'ArrowLeft':
+      case 'ArrowUp':
+        onOffset(-1);
+        break;
+      case 'ArrowRight':
+      case 'ArrowDown':
+        onOffset(1);
+        break;
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
+    role: "radiogroup",
+    "aria-label": "segmented control",
+    tabIndex: disabled ? undefined : 0,
+    "aria-orientation": vertical ? 'vertical' : 'horizontal'
+  }, divProps, {
+    className: (0, _classnames.default)(prefixCls, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(prefixCls, "-rtl"), direction === 'rtl'), "".concat(prefixCls, "-disabled"), disabled), "".concat(prefixCls, "-vertical"), vertical), className),
+    ref: mergedRef
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-group")
+  }, /*#__PURE__*/React.createElement(_MotionThumb.default, {
+    vertical: vertical,
+    prefixCls: prefixCls,
+    value: rawValue,
+    containerRef: containerRef,
+    motionName: "".concat(prefixCls, "-").concat(motionName),
+    direction: direction,
+    getValueIndex: function getValueIndex(val) {
+      return segmentedOptions.findIndex(function (n) {
+        return n.value === val;
+      });
+    },
+    onMotionStart: function onMotionStart() {
+      setThumbShow(true);
+    },
+    onMotionEnd: function onMotionEnd() {
+      setThumbShow(false);
+    }
+  }), segmentedOptions.map(function (segmentedOption) {
+    return /*#__PURE__*/React.createElement(InternalSegmentedOption, (0, _extends2.default)({}, segmentedOption, {
+      name: name,
+      key: segmentedOption.value,
+      prefixCls: prefixCls,
+      className: (0, _classnames.default)(segmentedOption.className, "".concat(prefixCls, "-item"), (0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(prefixCls, "-item-selected"), segmentedOption.value === rawValue && !thumbShow), "".concat(prefixCls, "-item-focused"), isFocused && isKeyboard && segmentedOption.value === rawValue)),
+      checked: segmentedOption.value === rawValue,
+      onChange: handleChange,
+      onFocus: handleFocus,
+      onBlur: handleBlur,
+      onKeyDown: handleKeyDown,
+      onKeyUp: handleKeyUp,
+      onMouseDown: handleMouseDown,
+      disabled: !!disabled || !!segmentedOption.disabled
+    }));
+  })));
+});
+if (process.env.NODE_ENV !== 'production') {
+  Segmented.displayName = 'Segmented';
+}
+var TypedSegmented = Segmented;
+var _default = exports.default = TypedSegmented;

node_modules/rc-segmented/package.json

@@ -0,0 +1,94 @@
+{
+  "name": "rc-segmented",
+  "version": "2.7.1",
+  "description": "React segmented controls used in ant.design",
+  "keywords": [
+    "react",
+    "react-component",
+    "react-segmented",
+    "react-segmented-controls",
+    "segmented controls",
+    "antd",
+    "ant-design"
+  ],
+  "main": "./lib/index",
+  "module": "./es/index",
+  "types": "./es/index.d.ts",
+  "files": [
+    "assets/*.css",
+    "assets/*.less",
+    "es",
+    "lib",
+    "dist"
+  ],
+  "homepage": "https://react-component.github.io/segmented",
+  "repository": {
+    "type": "git",
+    "url": "git@github.com:react-component/segmented.git"
+  },
+  "bugs": {
+    "url": "http://github.com/react-component/segmented/issues"
+  },
+  "license": "MIT",
+  "scripts": {
+    "start": "dumi dev",
+    "type:check": "tsc --noEmit",
+    "docs:build": "dumi build",
+    "docs:deploy": "gh-pages -d .doc",
+    "compile": "father build && lessc assets/index.less assets/index.css",
+    "gh-pages": "GH_PAGES=1 npm run docs:build && npm run docs:deploy",
+    "prepublishOnly": "npm run compile && np --yolo --no-publish --branch antd-5.x && npm run gh-pages",
+    "lint": "eslint src/ --ext .ts,.tsx,.jsx,.js,.md",
+    "prettier": "prettier --write \"**/*.{ts,tsx,js,jsx,json,md}\"",
+    "pretty-quick": "pretty-quick",
+    "test": "jest",
+    "coverage": "jest --coverage",
+    "prepare": "husky install"
+  },
+  "dependencies": {
+    "@babel/runtime": "^7.11.1",
+    "classnames": "^2.2.1",
+    "rc-motion": "^2.4.4",
+    "rc-util": "^5.17.0"
+  },
+  "devDependencies": {
+    "@rc-component/father-plugin": "^1.0.1",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^14.2.1",
+    "@testing-library/user-event": "^14.5.2",
+    "@types/classnames": "^2.2.9",
+    "@types/jest": "^29.2.4",
+    "@types/react": "^18.3.11",
+    "@types/react-dom": "^18.3.1",
+    "@umijs/fabric": "^3.0.0",
+    "@umijs/test": "^4.0.36",
+    "coveralls": "^3.0.6",
+    "cross-env": "^7.0.3",
+    "cssstyle": "^2.3.0",
+    "dumi": "^2.1.2",
+    "eslint": "^7.0.0",
+    "father": "^4.1.1",
+    "gh-pages": "^3.1.0",
+    "husky": "^8.0.0",
+    "jest": "^29.3.1",
+    "jest-environment-jsdom": "^29.3.1",
+    "less": "^3.10.3",
+    "np": "^7.0.0",
+    "prettier": "^2.0.5",
+    "pretty-quick": "^3.0.0",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "ts-node": "^10.9.1",
+    "typescript": "^5.3.0"
+  },
+  "peerDependencies": {
+    "react": ">=16.0.0",
+    "react-dom": ">=16.0.0"
+  },
+  "cnpm": {
+    "mode": "npm"
+  },
+  "tnpm": {
+    "mode": "npm"
+  }
+}