export default function SoloPane()

in packages-demo/demo-rc-elements/src/rc/solo-pane/index.tsx [61:108]

• 47 lines of code
• 2 McCabe index (conditional complexity)

export default function SoloPane({
  children,
  size = 'm',
  demo
}: IProps): JSX.Element {
  const [stateSize, setStateSize] = useState<TSize>(size);
  const [stateBd, setStateBd] = useState<string>('#6d5acf66');
  const [stateBg, setStateBg] = useState<string>('#ffcc0000');
  const width = SIZE_MAPPING[stateSize] || SIZE_MAPPING.m;
  
  return <div {...{
    style: {
      paddingRight: width
    }
  }}>
    <ScAdjustWidth>
      <RadioGroup<TSize> {...{
        label: '宽度',
        items: DATA_SOURCE_SIZE,
        value: stateSize,
        onChange: setStateSize
      }} />
      <div>
        边框色 <InputColor {...{
          value: stateBd,
          onChange: setStateBd
        }} />
      </div>
      <div>
        背景色 <InputColor {...{
          value: stateBg,
          onChange: setStateBg
        }} />
      </div>
      <Hr />
      <>{children}</>
    </ScAdjustWidth>
    <ScRight {...{
      style: {
        width,
        borderColor: stateBd,
        backgroundColor: stateBg
      }
    }}>
      {demo}
    </ScRight>
  </div>;
}