增加选择器对于额外配置样式的支持。
This commit is contained in:
		| @@ -8,9 +8,15 @@ type HSegmentedControlProps = { | ||||
|   options?: Option[]; | ||||
|   value?: Option['value']; | ||||
|   onChange?: (value: Option['value']) => void; | ||||
|   extendClassName?: HTMLDivElement['className']; | ||||
| }; | ||||
|  | ||||
| export function HSegmentedControl({ options = [], value, onChange }: HSegmentedControlProps) { | ||||
| export function HSegmentedControl({ | ||||
|   options = [], | ||||
|   value, | ||||
|   onChange, | ||||
|   extendClassName, | ||||
| }: HSegmentedControlProps) { | ||||
|   const [selected, setSelected] = useState(value ?? options[0].value ?? null); | ||||
|   const [sliderPosition, setSliderPosition] = useState(0); | ||||
|   const [sliderWidth, setSliderWidth] = useState(0); | ||||
| @@ -28,7 +34,7 @@ export function HSegmentedControl({ options = [], value, onChange }: HSegmentedC | ||||
|   }, []); | ||||
|  | ||||
|   return ( | ||||
|     <div className={styles.segmented_control}> | ||||
|     <div className={cx(styles.segmented_control, extendClassName)}> | ||||
|       <div className={styles.options}> | ||||
|         {options.map((option, index) => ( | ||||
|           <div | ||||
|   | ||||
| @@ -8,9 +8,15 @@ type VSegmentedControlProps = { | ||||
|   options?: Option[]; | ||||
|   value?: Option['value']; | ||||
|   onChange?: (value: Option['value']) => void; | ||||
|   extendClassName?: HTMLDivElement['className']; | ||||
| }; | ||||
|  | ||||
| export function VSegmentedControl({ options = [], value, onChange }: VSegmentedControlProps) { | ||||
| export function VSegmentedControl({ | ||||
|   options = [], | ||||
|   value, | ||||
|   onChange, | ||||
|   extendClassName, | ||||
| }: VSegmentedControlProps) { | ||||
|   const [selected, setSelected] = useState(value ?? options[0].value ?? null); | ||||
|   const [sliderPosition, setSliderPosition] = useState(0); | ||||
|   const [sliderHeight, setSliderHeight] = useState(0); | ||||
| @@ -28,7 +34,7 @@ export function VSegmentedControl({ options = [], value, onChange }: VSegmentedC | ||||
|   }, []); | ||||
|  | ||||
|   return ( | ||||
|     <div className={styles.segmented_control}> | ||||
|     <div className={cx(styles.segmented_control, extendClassName)}> | ||||
|       <div className={styles.options}> | ||||
|         {options.map((option, index) => ( | ||||
|           <div | ||||
|   | ||||
		Reference in New Issue
	
	Block a user