슬라이더

특정 숫자를 슬라이더를 통해 선택할 수 있습니다.

프로퍼티

프로퍼티	타입	설명
이름 (name)	string	슬라이더 컴포넌트의 고유 이름
레이블 (label)	string	슬라이더 컴포넌트 좌측에 표기되는 텍스트
최소값/최대값 (minValue/maxValue)	string (number)	선택할 수 있는 최소값과 최대값
단계 (step)	string (number)	선택할 수 있는 값의 단계
기본값 (defaultValue)	string (number)	슬라이더 컴포넌트의 기본값
그룹 스타일 (variant)	SliderVariant	슬라이더의 스타일
컴포넌트 비활성화 (isDisabled)	boolean	슬라이더 컴포넌트 비활성화 여부
컴포넌트 숨김 (isHidden)	boolean	배포된 페이지에서 슬라이더 컴포넌트 숨김 여부
너비 (display)	Display	슬라이더 컴포넌트의 너비 차지 방식
너비 (px) (contentWidth)	string (number)	슬라이더 컴포넌트의 고정 너비
레이블 길이 (labelWidth)	string	슬라이더에서 좌측 레이블이 차지하는 길이

이름 (name)

슬라이더 컴포넌트의 고유 이름을 입력할 수 있는 프로퍼티입니다. 이름 규칙을 참고해주세요.

레이블 (label)

슬라이더 컴포넌트 좌측에 표기되는 텍스트를 입력할 수 있는 프로퍼티입니다. (템플릿 텍스트 입력 가능)

최소값/최대값 (minValue/maxValue)

선택할 수 있는 최소값과 최대값을 지정할 수 있습니다.

단계 (step)

슬라이더 값의 단계를 설정할 수 있습니다.

기본값 (defaultValue)

워크플로우의 실행 결과로 기본값을 설정하거나, 직접 값을 입력하여 기본값을 설정할 수 있습니다.

그룹 스타일 (variant)

슬라이더의 스타일을 바꿀 수 있습니다.

컴포넌트 비활성화 (isDisabled)

컴포넌트의 비활성화 상태를 입력하는 프로퍼티입니다.
워크플로우의 실행 결과를 사용하거나 직접 값을 입력하여 컴포넌트 비활성화 상태를 설정할 수 있습니다. 값을 true로 설정할 경우, 해당 컴포넌트가 비활성화 상태로 변경됩니다.

컴포넌트 숨김 (isHidden)

컴포넌트의 숨김 상태를 입력하는 프로퍼티입니다.
워크플로우의 실행 결과를 사용하거나 직접 값을 입력하여 컴포넌트 숨김 상태를 설정할 수 있습니다.
값을 true로 설정할 경우, 배포된 상태에서는 컴포넌트가 숨겨지고 편집 상태에서는 불투명한 상태로 편집이 가능합니다.

너비 (display)

컴포넌트가 너비를 차지하는 방식을 선택할 수 있는 프로퍼티입니다.
'블록' 선택시 컴포넌트가 한 줄 전체를 차지합니다.
'고정 너비' 선택시 너비(px)를 입력할 수 있습니다. 앞 뒤로 고정 너비 방식의 컴포넌트를 배치할 수 있습니다.

레이블 길이 (labelWidth)

레이블 길이를 입력할 수 있는 프로퍼티입니다. px 또는 % 단위에 맞게 값을 입력하면 해당 값에 따라 레이블의 길이가 조정됩니다.

상태

프로퍼티	타입	설명
값 (value)	'number' | 'undefined'	선택한 값

타입 정의

type SliderVariant = 'outlined' | 'filled' | 'soft' | 'plain';