[primitives] Slider Component

[healtheloper]

[cos-ui/primitives] Slider

• Primitives 이외에 react 에서 기본 스타일을 입힌 컴포넌트가 필요하다고 생각

• Slider 의 Prev, Next Button 의 disabled 여부를 사용하기 어려움

  • children 이 inherit 받아 사용하면 되지않나? 라고 생각할 수도 있지만.. default 로 색상을 가지고 있는 경우도 있어 상태에 따른 색상 변경도 제공해주는게 맞다고 생각합니다.

Suggestion

1. hook 을 만든다 (useSlider 등으로 return 받아 사용)
2. PrevButton 에 trigger 로 사용할 component 를 받아 PrevButton 내부에서 처리한다

불편했던 예시

<Slider.PrevButton
  css={css`
    position: absolute;
    left: 0;
    top: calc(50% - 25px);
    color: ${({ theme }) => theme.palette.primary};
    &::disabled {
      color: ${({ theme }) => theme.palette.neutral_2};
    }
  `}
>
  <Icon iconName="leftArrow" color="inherit"/>
</Slider.PrevButton>

slideToShow 대응

만약 사용자가 slidesToShow 를 4로 설정했는데, 그 Element 의 width 가 사용자의 화면을 넘어가게 되는 경우의 처리

• 받아온 element 의 width 를 바탕으로 minWidth 지정..?