Setting API

해당 api를 사용할 경우 설정 -> 외부서비스 설정 하위의 설정 페이지를 만들고 유저가 입력한 값을 조회할 수 있습니다

Types

PluginInputType

플러그인 입력 타입을 나타내는 유니온 타입입니다.

type PluginInputType =
  | 'text'
  | 'password'
  | 'radio'
  | 'checkbox'
  | 'toggle'
  | 'slider';

BaseInput

모든 입력 타입의 기본 속성을 정의하는 객체입니다.

type BaseInput = {
  label: string; // 입력 필드 라벨
  required: boolean; // 필수 입력 여부
  id: string; // 입력 필드 ID
};

TextInput

텍스트 입력 필드를 정의하는 타입입니다.

export type TextInput = BaseInput & {
  type: 'text';
  default: string; // 기본값
  placeholder?: string; // 플레이스홀더
};

필드	타입	필수	설명	예시
label	string	필수	입력 필드 라벨	'API 키'
required	boolean	필수	필수 입력 여부	true
id	string	필수	입력 필드 ID	'api_key'
type	'text'	필수	입력 타입	'text'
default	string	필수	기본값	'default_value'
placeholder	string	선택	플레이스홀더	'API 키를 입력하세요'

PasswordInput

비밀번호 입력 필드를 정의하는 타입입니다.

export type PasswordInput = BaseInput & {
  type: 'password';
  default: string; // 기본값
  placeholder?: string; // 플레이스홀더
};

필드	타입	필수	설명	예시
label	string	필수	입력 필드 라벨	'비밀번호'
required	boolean	필수	필수 입력 여부	true
id	string	필수	입력 필드 ID	'password'
type	'password'	필수	입력 타입	'password'
default	string	필수	기본값	''
placeholder	string	선택	플레이스홀더	'비밀번호를 입력하세요'

InputValue

선택 옵션의 값을 정의하는 타입입니다.

type InputValue = {
  id: string; // 옵션 ID
  label: string; // 옵션 라벨
};

RadioInput

라디오 버튼 입력 필드를 정의하는 타입입니다.

type RadioInput = Omit<BaseInput, 'placeholder'> & {
  type: 'radio';
  default: string; // 선택된 value의 id
  values: InputValue[]; // 선택 옵션 목록
};

필드	타입	필수	설명	예시
label	string	필수	입력 필드 라벨	'결제 방식'
required	boolean	필수	필수 입력 여부	true
id	string	필수	입력 필드 ID	'payment_method'
type	'radio'	필수	입력 타입	'radio'
default	string	필수	선택된 value의 id	'card'
values	InputValue[]	필수	선택 옵션 목록	[{ id: 'card', label: '카드' }]

CheckBoxInput

체크박스 입력 필드를 정의하는 타입입니다.

type CheckBoxInput = Omit<BaseInput, 'placeholder'> & {
  type: 'checkbox';
  default: string[]; // 선택된 value의 id의 배열
  values: InputValue[]; // 선택 옵션 목록
};

필드	타입	필수	설명	예시
label	string	필수	입력 필드 라벨	'알림 설정'
required	boolean	필수	필수 입력 여부	false
id	string	필수	입력 필드 ID	'notification_settings'
type	'checkbox'	필수	입력 타입	'checkbox'
default	string[]	필수	선택된 value의 id의 배열	['email', 'sms']
values	InputValue[]	필수	선택 옵션 목록	[{ id: 'email', label: '이메일' }]

ToggleInput

토글 입력 필드를 정의하는 타입입니다.

type ToggleInput = Omit<BaseInput, 'placeholder'> & {
  type: 'toggle';
  default: boolean; // 기본값
};

필드	타입	필수	설명	예시
label	string	필수	입력 필드 라벨	'자동 저장'
required	boolean	필수	필수 입력 여부	false
id	string	필수	입력 필드 ID	'auto_save'
type	'toggle'	필수	입력 타입	'toggle'
default	boolean	필수	기본값	true

SliderInput

슬라이더 입력 필드를 정의하는 타입입니다.

type SliderInput = Omit<BaseInput, 'placeholder'> & {
  type: 'slider';
  default: number; // 기본값
  min: number; // 최소값
  max: number; // 최대값
  step: number; // 단계값
};

필드	타입	필수	설명	예시
label	string	필수	입력 필드 라벨	'음량'
required	boolean	필수	필수 입력 여부	false
id	string	필수	입력 필드 ID	'volume'
type	'slider'	필수	입력 타입	'slider'
default	number	필수	기본값	50
min	number	필수	최소값	0
max	number	필수	최대값	100
step	number	필수	단계값	5

PluginInputs

플러그인 설정 입력 필드의 유니온 타입입니다.

export type PluginInputs<T extends PluginInputType = any> = Extract<
  | TextInput
  | PasswordInput
  | RadioInput
  | CheckBoxInput
  | ToggleInput
  | SliderInput,
  { type: T }
>;

SettingInputs

플러그인 설정 입력 필드들의 집합을 나타내는 객체입니다.

type SettingInputs = Record<string, PluginInputs>;

Methods

setInputs

input을 이용해 설정화면을 만듭니다

import { posPluginSdk } from '@tossplace/pos-plugin-sdk';

await posPluginSdk.setting.setInputs([
  {
    label: 'ID',
    type: 'text',
    required: true,
    placeholder: 'ID',
    default: '',
    id: 'id',
  },
  {
    label: '비밀번호',
    type: 'password',
    required: true,
    placeholder: '비밀번호',
    default: '',
    id: 'password',
  },
]);

getValues

setInputs를 이용해 설정화면을 만들고 유저가 입력한 값을 불러옵니다

import { posPluginSdk } from '@tossplace/pos-plugin-sdk';

const values = await posPluginSdk.setting.getValues();
console.log('id', values.id);
console.log('password', values.password);