SegmentedControl组件更名为HSegmentedControl。

src/components/ColorStand.tsx

@@ -5,8 +5,8 @@ import { useCopyToClipboard } from 'react-use';
 import NoColor from '../assets/NoColor.svg';
 import { useColorFunction } from '../ColorFunctionContext';
 import styles from './ColorStand.module.css';
+import { HSegmentedControl } from './HSegmentedControl';
 import { NotificationType, useNotification } from './Notifications';
-import { SegmentedControl } from './SegmentedControl';
 
 type ColorValueProps = {
   value: string | null;
@@ -102,7 +102,7 @@ export function ColorStand({ title, color }: ColorStandProps) {
         </div>
       </div>
       <div className={styles.color_describe}>
-        <SegmentedControl
+        <HSegmentedControl
           options={[
             { label: 'HEX', value: 'hex' },
             { label: 'RGB', value: 'rgb' },

src/components/HSegmentedControl.tsx

@@ -1,7 +1,7 @@
 import cx from 'clsx';
 import { isEqual, isNil } from 'lodash-es';
 import { useCallback, useRef, useState } from 'react';
-import styles from './SegmentedControl.module.css';
+import styles from './HSegmentedControl.module.css';
 
 type Option = {
   label: string;
@@ -14,7 +14,7 @@ type SegmentedConttrolProps = {
   onChange?: (value: Option['value']) => void;
 };
 
-export function SegmentedControl({ options = [], value, onChange }: SegmentedConttrolProps) {
+export function HSegmentedControl({ options = [], value, onChange }: SegmentedConttrolProps) {
   const [selected, setSelected] = useState(value ?? options[0].value ?? null);
   const [sliderPosition, setSliderPosition] = useState(0);
   const [sliderWidth, setSliderWidth] = useState(0);