@sellmate/design-system-vue 1.0.77 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -17,15 +17,18 @@ npm install @sellmate/design-system-vue
17
17
  **1. CSS 전역 import + 플러그인 등록** — `src/main.ts`
18
18
 
19
19
  ```ts
20
- import { createApp } from 'vue';
21
- import '@sellmate/design-system/styles.css';
22
- import { StencilVuePlugin, SdModalVuePlugin } from '@sellmate/design-system-vue';
23
- import App from './App.vue';
20
+ import { createApp } from "vue";
21
+ import "@sellmate/design-system/styles.css";
22
+ import {
23
+ StencilVuePlugin,
24
+ SdModalVuePlugin,
25
+ } from "@sellmate/design-system-vue";
26
+ import App from "./App.vue";
24
27
 
25
28
  createApp(App)
26
- .use(StencilVuePlugin) // 커스텀 엘리먼트 전역 등록 (필수)
27
- .use(SdModalVuePlugin) // sdModal.create Vue 컴포넌트 지원 (필수)
28
- .mount('#app');
29
+ .use(StencilVuePlugin) // 커스텀 엘리먼트 전역 등록 (필수)
30
+ .use(SdModalVuePlugin) // sdModal.create Vue 컴포넌트 지원 (필수)
31
+ .mount("#app");
29
32
  ```
30
33
 
31
34
  > **`StencilVuePlugin`은 필수입니다.** React와 달리 Vue 래퍼 컴포넌트는 import 시점에 커스텀 엘리먼트를 자동 등록하지 않으므로, 플러그인을 통한 명시적 등록이 필요합니다.
@@ -41,7 +44,7 @@ createApp(App)
41
44
  </template>
42
45
 
43
46
  <script setup lang="ts">
44
- import { SdModalContainer } from '@sellmate/design-system-vue';
47
+ import { SdModalContainer } from "@sellmate/design-system-vue";
45
48
  </script>
46
49
  ```
47
50
 
@@ -54,16 +57,16 @@ import { SdModalContainer } from '@sellmate/design-system-vue';
54
57
  Vue 컴포넌트를 모달로 열 수 있는 Vue-aware 버전입니다.
55
58
 
56
59
  ```ts
57
- import { sdModal } from '@sellmate/design-system-vue';
60
+ import { sdModal } from "@sellmate/design-system-vue";
58
61
 
59
62
  // Confirm 모달
60
63
  sdModal
61
64
  .confirm({
62
- type: 'positive' | 'negative' | 'default',
63
- title: '제목',
64
- topMessage: ['메시지'],
65
- mainButtonLabel: '확인',
66
- subButtonLabel: '취소',
65
+ type: "positive" | "negative" | "default",
66
+ title: "제목",
67
+ topMessage: ["메시지"],
68
+ mainButtonLabel: "확인",
69
+ subButtonLabel: "취소",
67
70
  persistent: false, // true 시 ESC/백드롭으로 닫기 불가
68
71
  })
69
72
  .onOk(() => {})
@@ -73,13 +76,13 @@ sdModal
73
76
  // Vue 컴포넌트를 모달로 열기
74
77
  sdModal.create({
75
78
  component: MyModalComponent,
76
- componentProps: { title: '제목' }, // 컴포넌트에 전달할 props
79
+ componentProps: { title: "제목" }, // 컴포넌트에 전달할 props
77
80
  persistent: true,
78
81
  });
79
82
 
80
83
  // Loading 모달
81
- const dialog = sdModal.loading({ state: 'loading' });
82
- dialog.update({ state: 'error', message: '오류 발생' });
84
+ const dialog = sdModal.loading({ state: "loading" });
85
+ dialog.update({ state: "error", message: "오류 발생" });
83
86
  dialog.close();
84
87
 
85
88
  // 전역 설정
@@ -90,13 +93,13 @@ sdModal.configure({ zIndex: 1000 });
90
93
 
91
94
  ---
92
95
 
93
- ### `sdToast` — `@sellmate/design-system`
96
+ ### `sdToast` — `@sellmate/design-system/utils`
94
97
 
95
98
  ```ts
96
- import { sdToast } from '@sellmate/design-system';
99
+ import { sdToast } from "@sellmate/design-system/utils";
97
100
 
98
101
  // 토스트 생성
99
- await sdToast.create('메시지', 'success' | 'error' | 'warning' | 'info');
102
+ await sdToast.create("메시지", "success" | "error" | "warning" | "info");
100
103
 
101
104
  // 개별/전체 닫기
102
105
  await sdToast.dismiss(id);
@@ -104,7 +107,7 @@ await sdToast.dismissAll();
104
107
 
105
108
  // 전역 설정
106
109
  sdToast.configure({
107
- position: 'top-right',
110
+ position: "top-right",
108
111
  maxVisible: 5,
109
112
  defaultDuration: 3000,
110
113
  zIndex: 9999,
@@ -115,15 +118,15 @@ sdToast.configure({
115
118
 
116
119
  ---
117
120
 
118
- ### `sdLoading` — `@sellmate/design-system`
121
+ ### `sdLoading` — `@sellmate/design-system-vue`
119
122
 
120
123
  ```ts
121
- import { sdLoading } from '@sellmate/design-system';
124
+ import { sdLoading } from "@sellmate/design-system-vue";
122
125
 
123
126
  const hide = sdLoading.show(); // 전체화면 로딩 표시
124
- hide(); // 로딩 숨김
127
+ hide(); // 로딩 숨김
125
128
 
126
- sdLoading.show({ message: '처리 중...' });
129
+ sdLoading.show({ message: "처리 중..." });
127
130
  ```
128
131
 
129
132
  ---
@@ -132,33 +135,28 @@ sdLoading.show({ message: '처리 중...' });
132
135
 
133
136
  ### 입력
134
137
 
135
- | 컴포넌트 | 설명 |
136
- | ----------------------- | -------------------- |
137
- | `SdInput` | 텍스트 입력 |
138
- | `SdNumberInput` | 숫자 입력 |
139
- | `SdTextarea` | 멀티라인 텍스트 입력 |
140
- | `SdBarcodeInput` | 바코드 스캐너 입력 |
141
- | `SdCheckbox` | 체크박스 |
142
- | `SdRadio` | 라디오 버튼 |
143
- | `SdRadioGroup` | 라디오 그룹 |
144
- | `SdRadioButton` | 버튼형 라디오 |
145
- | `SdSwitch` | 스위치 토글 |
146
- | `SdToggle` | 토글 |
147
- | `SdSelect` | 단일 선택 드롭다운 |
148
- | `SdSelectGroup` | 그룹형 단일 선택 |
149
- | `SdSelectMultiple` | 다중 선택 드롭다운 |
150
- | `SdSelectMultipleGroup` | 그룹형 다중 선택 |
151
- | `SdSelectV2` | 단일/다중 선택 V2 |
152
- | `SdDatePicker` | 날짜 선택 |
153
- | `SdDateRangePicker` | 날짜 범위 선택 |
154
- | `SdFilePicker` | 파일 선택 |
138
+ | 컴포넌트 | 설명 |
139
+ | ------------------- | -------------------------- |
140
+ | `SdInput` | 텍스트 입력 |
141
+ | `SdNumberInput` | 숫자 입력 |
142
+ | `SdTextarea` | 멀티라인 텍스트 입력 |
143
+ | `SdBarcodeInput` | 바코드 스캐너 입력 |
144
+ | `SdCheckbox` | 체크박스 |
145
+ | `SdRadio` | 라디오 버튼 |
146
+ | `SdRadioGroup` | 라디오 그룹 |
147
+ | `SdRadioButton` | 버튼형 라디오 |
148
+ | `SdSwitch` | 스위치 토글 |
149
+ | `SdToggle` | 토글 |
150
+ | `SdSelect` | 단일/다중 선택 (그룹 지원) |
151
+ | `SdDatePicker` | 날짜 선택 |
152
+ | `SdDateRangePicker` | 날짜 범위 선택 |
153
+ | `SdFilePicker` | 파일 선택 |
155
154
 
156
155
  ### 버튼
157
156
 
158
157
  | 컴포넌트 | 설명 |
159
158
  | ------------------ | ---------------- |
160
- | `SdButton` | 기본 버튼 |
161
- | `SdButtonV2` | 버튼 V2 |
159
+ | `SdButton` | 기본 버튼 |
162
160
  | `SdGhostButton` | 고스트 버튼 |
163
161
  | `SdDropdownButton` | 드롭다운 버튼 |
164
162
  | `SdTextLink` | 텍스트 링크 버튼 |
@@ -172,7 +170,7 @@ sdLoading.show({ message: '처리 중...' });
172
170
  | `SdIcon` | 아이콘 |
173
171
  | `SdTooltip` | 툴팁 |
174
172
  | `SdPopover` | 팝오버 |
175
- | `SdProgress` | 진행 바 |
173
+ | `SdLinearProgress` | 선형 진행 바 |
176
174
  | `SdCircleProgress` | 원형 진행 바 |
177
175
  | `SdLoadingContainer` | 로딩 오버레이 컨테이너 |
178
176
  | `SdGuide` | 가이드 텍스트 |
@@ -211,14 +209,11 @@ import type {
211
209
  SdTableRow,
212
210
  // Select
213
211
  SelectOption,
214
- SelectOptionGroup,
215
212
  // Radio
216
213
  RadioValue,
217
214
  RadioOption,
218
215
  // Button
219
- ButtonVariant,
220
- ButtonSize,
221
- ButtonV2Name,
216
+ ButtonName,
222
217
  DropdownButtonItem,
223
218
  // Form
224
219
  Rule,
@@ -233,9 +228,7 @@ import type {
233
228
  DateBoxType,
234
229
  // Tabs
235
230
  TabOption,
236
- // sdModal
237
- SdModalCreateOption,
238
- } from '@sellmate/design-system-vue';
231
+ } from "@sellmate/design-system-vue";
239
232
  ```
240
233
 
241
234
  ---
@@ -245,7 +238,7 @@ import type {
245
238
  ### `useSdTableVirtualScroll`
246
239
 
247
240
  ```ts
248
- import { useSdTableVirtualScroll } from '@sellmate/design-system-vue';
241
+ import { useSdTableVirtualScroll } from "@sellmate/design-system-vue";
249
242
 
250
243
  const { virtualRows, totalHeight, scrollToIndex } = useSdTableVirtualScroll({
251
244
  rowCount: data.length,
@@ -4,7 +4,6 @@ export declare const SdActionModal: StencilVueComponent<JSX.SdActionModal>;
4
4
  export declare const SdBadge: StencilVueComponent<JSX.SdBadge>;
5
5
  export declare const SdBarcodeInput: StencilVueComponent<JSX.SdBarcodeInput, JSX.SdBarcodeInput["value"]>;
6
6
  export declare const SdButton: StencilVueComponent<JSX.SdButton>;
7
- export declare const SdButtonV2: StencilVueComponent<JSX.SdButtonV2>;
8
7
  export declare const SdCalendar: StencilVueComponent<JSX.SdCalendar>;
9
8
  export declare const SdCard: StencilVueComponent<JSX.SdCard>;
10
9
  export declare const SdCheckbox: StencilVueComponent<JSX.SdCheckbox, JSX.SdCheckbox["value"]>;
@@ -26,6 +25,7 @@ export declare const SdGhostButton: StencilVueComponent<JSX.SdGhostButton>;
26
25
  export declare const SdGuide: StencilVueComponent<JSX.SdGuide>;
27
26
  export declare const SdIcon: StencilVueComponent<JSX.SdIcon>;
28
27
  export declare const SdInput: StencilVueComponent<JSX.SdInput, JSX.SdInput["value"]>;
28
+ export declare const SdKeyValueTable: StencilVueComponent<JSX.SdKeyValueTable>;
29
29
  export declare const SdLinearProgress: StencilVueComponent<JSX.SdLinearProgress>;
30
30
  export declare const SdLoadingContainer: StencilVueComponent<JSX.SdLoadingContainer>;
31
31
  export declare const SdLoadingModal: StencilVueComponent<JSX.SdLoadingModal>;
@@ -33,6 +33,7 @@ export declare const SdModalContainer: StencilVueComponent<JSX.SdModalContainer>
33
33
  export declare const SdNumberInput: StencilVueComponent<JSX.SdNumberInput, JSX.SdNumberInput["value"]>;
34
34
  export declare const SdPagination: StencilVueComponent<JSX.SdPagination, JSX.SdPagination["currentPage"]>;
35
35
  export declare const SdPopover: StencilVueComponent<JSX.SdPopover>;
36
+ export declare const SdPopup: StencilVueComponent<JSX.SdPopup>;
36
37
  export declare const SdPortal: StencilVueComponent<JSX.SdPortal>;
37
38
  export declare const SdRadio: StencilVueComponent<JSX.SdRadio, JSX.SdRadio["value"]>;
38
39
  export declare const SdRadioButton: StencilVueComponent<JSX.SdRadioButton, JSX.SdRadioButton["value"]>;
@@ -14,8 +14,7 @@ export const SdActionModal = /*@__PURE__*/ defineContainer('sd-action-modal', un
14
14
  'sdOk'
15
15
  ]);
16
16
  export const SdBadge = /*@__PURE__*/ defineContainer('sd-badge', undefined, [
17
- 'color',
18
- 'label'
17
+ 'color'
19
18
  ]);
20
19
  export const SdBarcodeInput = /*@__PURE__*/ defineContainer('sd-barcode-input', undefined, [
21
20
  'value',
@@ -52,23 +51,6 @@ export const SdBarcodeInput = /*@__PURE__*/ defineContainer('sd-barcode-input',
52
51
  'sdBlur'
53
52
  ], 'value', 'sdUpdate', undefined);
54
53
  export const SdButton = /*@__PURE__*/ defineContainer('sd-button', undefined, [
55
- 'variant',
56
- 'size',
57
- 'color',
58
- 'label',
59
- 'disabled',
60
- 'type',
61
- 'icon',
62
- 'iconColor',
63
- 'iconSize',
64
- 'iconRight',
65
- 'noHover',
66
- 'sdClass',
67
- 'sdClick'
68
- ], [
69
- 'sdClick'
70
- ]);
71
- export const SdButtonV2 = /*@__PURE__*/ defineContainer('sd-button-v2', undefined, [
72
54
  'name',
73
55
  'label',
74
56
  'icon',
@@ -259,6 +241,7 @@ export const SdField = /*@__PURE__*/ defineContainer('sd-field', undefined, [
259
241
  'rules',
260
242
  'error',
261
243
  'disabled',
244
+ 'readonly',
262
245
  'hovered',
263
246
  'focused',
264
247
  'status',
@@ -392,6 +375,16 @@ export const SdInput = /*@__PURE__*/ defineContainer('sd-input', undefined, [
392
375
  'sdFocus',
393
376
  'sdBlur'
394
377
  ], 'value', 'sdUpdate', undefined);
378
+ export const SdKeyValueTable = /*@__PURE__*/ defineContainer('sd-key-value-table', undefined, [
379
+ 'fields',
380
+ 'search',
381
+ 'useTop',
382
+ 'sdChange',
383
+ 'sdSearch'
384
+ ], [
385
+ 'sdChange',
386
+ 'sdSearch'
387
+ ]);
395
388
  export const SdLinearProgress = /*@__PURE__*/ defineContainer('sd-linear-progress', undefined, [
396
389
  'indeterminate',
397
390
  'value',
@@ -465,17 +458,30 @@ export const SdPopover = /*@__PURE__*/ defineContainer('sd-popover', undefined,
465
458
  'icon',
466
459
  'iconSize',
467
460
  'label',
468
- 'buttonSize',
469
- 'buttonVariant',
461
+ 'name',
462
+ 'rightIcon',
463
+ 'ariaLabel',
464
+ 'disabled',
465
+ 'type',
470
466
  'menuTitle',
471
467
  'messages',
472
- 'buttons',
468
+ 'leftLink',
469
+ 'button',
473
470
  'menuClass',
474
471
  'useClose',
475
472
  'sdShowChange'
476
473
  ], [
477
474
  'sdShowChange'
478
475
  ]);
476
+ export const SdPopup = /*@__PURE__*/ defineContainer('sd-popup', undefined, [
477
+ 'popupTitle',
478
+ 'type',
479
+ 'useFooter',
480
+ 'submitButtonProps',
481
+ 'sdSubmit'
482
+ ], [
483
+ 'sdSubmit'
484
+ ]);
479
485
  export const SdPortal = /*@__PURE__*/ defineContainer('sd-portal', undefined, [
480
486
  'to',
481
487
  'parentRef',
@@ -613,6 +619,7 @@ export const SdTable = /*@__PURE__*/ defineContainer('sd-table', undefined, [
613
619
  'height',
614
620
  'stickyHeader',
615
621
  'stickyColumn',
622
+ 'radius',
616
623
  'noDataLabel',
617
624
  'isLoading',
618
625
  'pagination',
@@ -658,7 +665,8 @@ export const SdTd = /*@__PURE__*/ defineContainer('sd-td', undefined, [
658
665
  'rowKey',
659
666
  'align',
660
667
  'rowspan',
661
- 'colspan'
668
+ 'colspan',
669
+ 'sdClass'
662
670
  ]);
663
671
  export const SdTextLink = /*@__PURE__*/ defineContainer('sd-text-link', undefined, [
664
672
  'label',
@@ -726,11 +734,14 @@ export const SdToast = /*@__PURE__*/ defineContainer('sd-toast', undefined, [
726
734
  'message',
727
735
  'link',
728
736
  'linkLabel',
737
+ 'buttonLabel',
729
738
  'useClose',
730
739
  'type',
731
- 'sdClose'
740
+ 'sdClose',
741
+ 'sdButtonClick'
732
742
  ], [
733
- 'sdClose'
743
+ 'sdClose',
744
+ 'sdButtonClick'
734
745
  ]);
735
746
  export const SdToastContainer = /*@__PURE__*/ defineContainer('sd-toast-container', undefined, [
736
747
  'position',
@@ -759,9 +770,11 @@ export const SdTooltip = /*@__PURE__*/ defineContainer('sd-tooltip', undefined,
759
770
  'icon',
760
771
  'iconSize',
761
772
  'label',
762
- 'buttonSize',
763
- 'buttonVariant',
764
- 'noHover',
773
+ 'name',
774
+ 'rightIcon',
775
+ 'ariaLabel',
776
+ 'disabled',
777
+ 'type',
765
778
  'sdClass'
766
779
  ]);
767
780
  export const SdTr = /*@__PURE__*/ defineContainer('sd-tr', undefined, [
package/dist/index.d.ts CHANGED
@@ -6,4 +6,4 @@ export type { VirtualRow } from './composables/useSdTableVirtualScroll';
6
6
  export { sdModal, SdModalVuePlugin } from './sdModal';
7
7
  export { sdLoading } from '@sellmate/design-system/utils';
8
8
  export type { SdLoadingShowOptions } from '@sellmate/design-system/utils';
9
- export type { SdTableColumn, Row as SdTableRow, SelectOption, RadioValue, RadioOption, ButtonVariant, ButtonSize, ButtonV2Name, DropdownButtonItem, DropdownButtonName, DropdownButtonSize, DropdownButtonValue, Rule, ValidatableField, SdTooltipProps, TagName, ToastType, CheckedType, Type as DateBoxType, TabOption, } from '@sellmate/design-system';
9
+ export type { SdTableColumn, Row as SdTableRow, SelectOption, RadioValue, RadioOption, ButtonName, DropdownButtonItem, DropdownButtonName, DropdownButtonSize, DropdownButtonValue, Rule, ValidatableField, SdTooltipProps, TagName, ToastType, ToastPosition, CheckedType, Type as DateBoxType, TabOption, } from '@sellmate/design-system';
package/dist/sdModal.js CHANGED
@@ -1,4 +1,4 @@
1
- import { createVNode, render, } from 'vue';
1
+ import { createVNode, render } from 'vue';
2
2
  import { sdModal as coreSdModal, _createSdModalRef, _attachSdModalWithRef, } from '@sellmate/design-system/utils';
3
3
  /**
4
4
  * Vue 플러그인. `app.use(SdModalVuePlugin)` 로 설치하면
package/lib/components.ts CHANGED
@@ -22,8 +22,7 @@ export const SdActionModal: StencilVueComponent<JSX.SdActionModal> = /*@__PURE__
22
22
 
23
23
 
24
24
  export const SdBadge: StencilVueComponent<JSX.SdBadge> = /*@__PURE__*/ defineContainer<JSX.SdBadge>('sd-badge', undefined, [
25
- 'color',
26
- 'label'
25
+ 'color'
27
26
  ]);
28
27
 
29
28
 
@@ -65,25 +64,6 @@ export const SdBarcodeInput: StencilVueComponent<JSX.SdBarcodeInput, JSX.SdBarco
65
64
 
66
65
 
67
66
  export const SdButton: StencilVueComponent<JSX.SdButton> = /*@__PURE__*/ defineContainer<JSX.SdButton>('sd-button', undefined, [
68
- 'variant',
69
- 'size',
70
- 'color',
71
- 'label',
72
- 'disabled',
73
- 'type',
74
- 'icon',
75
- 'iconColor',
76
- 'iconSize',
77
- 'iconRight',
78
- 'noHover',
79
- 'sdClass',
80
- 'sdClick'
81
- ], [
82
- 'sdClick'
83
- ]);
84
-
85
-
86
- export const SdButtonV2: StencilVueComponent<JSX.SdButtonV2> = /*@__PURE__*/ defineContainer<JSX.SdButtonV2>('sd-button-v2', undefined, [
87
67
  'name',
88
68
  'label',
89
69
  'icon',
@@ -306,6 +286,7 @@ export const SdField: StencilVueComponent<JSX.SdField> = /*@__PURE__*/ defineCon
306
286
  'rules',
307
287
  'error',
308
288
  'disabled',
289
+ 'readonly',
309
290
  'hovered',
310
291
  'focused',
311
292
  'status',
@@ -457,6 +438,18 @@ export const SdInput: StencilVueComponent<JSX.SdInput, JSX.SdInput["value"]> = /
457
438
  'value', 'sdUpdate', undefined);
458
439
 
459
440
 
441
+ export const SdKeyValueTable: StencilVueComponent<JSX.SdKeyValueTable> = /*@__PURE__*/ defineContainer<JSX.SdKeyValueTable>('sd-key-value-table', undefined, [
442
+ 'fields',
443
+ 'search',
444
+ 'useTop',
445
+ 'sdChange',
446
+ 'sdSearch'
447
+ ], [
448
+ 'sdChange',
449
+ 'sdSearch'
450
+ ]);
451
+
452
+
460
453
  export const SdLinearProgress: StencilVueComponent<JSX.SdLinearProgress> = /*@__PURE__*/ defineContainer<JSX.SdLinearProgress>('sd-linear-progress', undefined, [
461
454
  'indeterminate',
462
455
  'value',
@@ -544,11 +537,15 @@ export const SdPopover: StencilVueComponent<JSX.SdPopover> = /*@__PURE__*/ defin
544
537
  'icon',
545
538
  'iconSize',
546
539
  'label',
547
- 'buttonSize',
548
- 'buttonVariant',
540
+ 'name',
541
+ 'rightIcon',
542
+ 'ariaLabel',
543
+ 'disabled',
544
+ 'type',
549
545
  'menuTitle',
550
546
  'messages',
551
- 'buttons',
547
+ 'leftLink',
548
+ 'button',
552
549
  'menuClass',
553
550
  'useClose',
554
551
  'sdShowChange'
@@ -557,6 +554,17 @@ export const SdPopover: StencilVueComponent<JSX.SdPopover> = /*@__PURE__*/ defin
557
554
  ]);
558
555
 
559
556
 
557
+ export const SdPopup: StencilVueComponent<JSX.SdPopup> = /*@__PURE__*/ defineContainer<JSX.SdPopup>('sd-popup', undefined, [
558
+ 'popupTitle',
559
+ 'type',
560
+ 'useFooter',
561
+ 'submitButtonProps',
562
+ 'sdSubmit'
563
+ ], [
564
+ 'sdSubmit'
565
+ ]);
566
+
567
+
560
568
  export const SdPortal: StencilVueComponent<JSX.SdPortal> = /*@__PURE__*/ defineContainer<JSX.SdPortal>('sd-portal', undefined, [
561
569
  'to',
562
570
  'parentRef',
@@ -719,6 +727,7 @@ export const SdTable: StencilVueComponent<JSX.SdTable, JSX.SdTable["selected"]>
719
727
  'height',
720
728
  'stickyHeader',
721
729
  'stickyColumn',
730
+ 'radius',
722
731
  'noDataLabel',
723
732
  'isLoading',
724
733
  'pagination',
@@ -774,7 +783,8 @@ export const SdTd: StencilVueComponent<JSX.SdTd> = /*@__PURE__*/ defineContainer
774
783
  'rowKey',
775
784
  'align',
776
785
  'rowspan',
777
- 'colspan'
786
+ 'colspan',
787
+ 'sdClass'
778
788
  ]);
779
789
 
780
790
 
@@ -851,11 +861,14 @@ export const SdToast: StencilVueComponent<JSX.SdToast> = /*@__PURE__*/ defineCon
851
861
  'message',
852
862
  'link',
853
863
  'linkLabel',
864
+ 'buttonLabel',
854
865
  'useClose',
855
866
  'type',
856
- 'sdClose'
867
+ 'sdClose',
868
+ 'sdButtonClick'
857
869
  ], [
858
- 'sdClose'
870
+ 'sdClose',
871
+ 'sdButtonClick'
859
872
  ]);
860
873
 
861
874
 
@@ -891,9 +904,11 @@ export const SdTooltip: StencilVueComponent<JSX.SdTooltip> = /*@__PURE__*/ defin
891
904
  'icon',
892
905
  'iconSize',
893
906
  'label',
894
- 'buttonSize',
895
- 'buttonVariant',
896
- 'noHover',
907
+ 'name',
908
+ 'rightIcon',
909
+ 'ariaLabel',
910
+ 'disabled',
911
+ 'type',
897
912
  'sdClass'
898
913
  ]);
899
914
 
package/lib/index.ts CHANGED
@@ -19,9 +19,7 @@ export type {
19
19
  RadioValue,
20
20
  RadioOption,
21
21
  // Button types
22
- ButtonVariant,
23
- ButtonSize,
24
- ButtonV2Name,
22
+ ButtonName,
25
23
  DropdownButtonItem,
26
24
  DropdownButtonName,
27
25
  DropdownButtonSize,
@@ -35,6 +33,7 @@ export type {
35
33
  TagName,
36
34
  // Toast types
37
35
  ToastType,
36
+ ToastPosition,
38
37
  // Checkbox types
39
38
  CheckedType,
40
39
  // Date types
package/lib/plugin.ts CHANGED
@@ -2,9 +2,9 @@ import { defineCustomElements } from '@sellmate/design-system/loader';
2
2
  import type { App } from 'vue';
3
3
 
4
4
  export const StencilVuePlugin = {
5
- install(_app: App) {
6
- defineCustomElements();
7
- },
5
+ install(_app: App) {
6
+ defineCustomElements();
7
+ },
8
8
  };
9
9
 
10
10
  export default StencilVuePlugin;
package/lib/sdModal.ts CHANGED
@@ -1,10 +1,4 @@
1
- import {
2
- createVNode,
3
- render,
4
- type App,
5
- type AppContext,
6
- type Component,
7
- } from 'vue';
1
+ import { createVNode, render, type App, type AppContext, type Component } from 'vue';
8
2
  import {
9
3
  sdModal as coreSdModal,
10
4
  _createSdModalRef,
@@ -39,8 +33,7 @@ let capturedContext: AppContext | null = null;
39
33
  * 메인 앱 컨텍스트 안에서 렌더한 뒤 core 로 위임합니다.
40
34
  * - `persistent` 는 core 옵션을 그대로 전달합니다.
41
35
  */
42
- export interface SdModalCreateOption
43
- extends Omit<CoreSdModalCreateOption, 'component'> {
36
+ export interface SdModalCreateOption extends Omit<CoreSdModalCreateOption, 'component'> {
44
37
  component: HTMLElement | Component;
45
38
  componentProps?: Record<string, unknown>;
46
39
  }
@@ -68,9 +61,7 @@ function mountVueComponent(
68
61
  const el = host.firstElementChild as HTMLElement | null;
69
62
  if (!el) {
70
63
  render(null, host);
71
- throw new Error(
72
- '[sdModal] 전달한 Vue 컴포넌트의 template 최상위는 단일 요소여야 합니다.',
73
- );
64
+ throw new Error('[sdModal] 전달한 Vue 컴포넌트의 template 최상위는 단일 요소여야 합니다.');
74
65
  }
75
66
 
76
67
  return { el, host };
package/package.json CHANGED
@@ -1,54 +1,56 @@
1
1
  {
2
- "name": "@sellmate/design-system-vue",
3
- "version": "1.0.77",
4
- "description": "Design System - Vue Component Wrappers",
5
- "keywords": [
6
- "vue",
7
- "web-components",
8
- "design-system",
9
- "ui-library"
10
- ],
11
- "homepage": "https://gitlab.corp.sellmate.co.kr/sellmate/frontend/design-system/-/blob/main/README.md?ref_type=heads",
12
- "repository": {
13
- "type": "git",
14
- "url": "https://gitlab.corp.sellmate.co.kr/sellmate/frontend/design-system.git"
15
- },
16
- "bugs": {
17
- "url": "https://gitlab.corp.sellmate.co.kr/sellmate/frontend/design-system/-/issues"
18
- },
19
- "license": "MIT",
20
- "author": {
21
- "name": "MeeKyeong Kim",
22
- "email": "kmeijjing@gmail.com"
23
- },
24
- "main": "dist/index.js",
25
- "types": "dist/index.d.ts",
26
- "directories": {
27
- "lib": "lib",
28
- "test": "__tests__"
29
- },
30
- "files": [
31
- "lib",
32
- "dist"
33
- ],
34
- "publishConfig": {
35
- "access": "public"
36
- },
37
- "scripts": {
38
- "build": "tsc",
39
- "clean": "rm -rf lib",
40
- "dev": "tsc --watch"
41
- },
42
- "devDependencies": {
43
- "@types/node": "^24.9.1",
44
- "typescript": "^5.9.3",
45
- "vue": "^3.4.38"
46
- },
47
- "dependencies": {
48
- "@sellmate/design-system": "^1.0.77",
49
- "@stencil/vue-output-target": "^0.11.8"
50
- },
51
- "peerDependencies": {
52
- "vue": ">=3.0.0"
53
- }
2
+ "name": "@sellmate/design-system-vue",
3
+ "version": "1.1.0",
4
+ "description": "Design System - Vue Component Wrappers",
5
+ "keywords": [
6
+ "vue",
7
+ "web-components",
8
+ "design-system",
9
+ "ui-library"
10
+ ],
11
+ "homepage": "https://gitlab.corp.sellmate.co.kr/sellmate/frontend/design-system/-/blob/main/README.md?ref_type=heads",
12
+ "repository": {
13
+ "type": "git",
14
+ "url": "https://gitlab.corp.sellmate.co.kr/sellmate/frontend/design-system.git"
15
+ },
16
+ "bugs": {
17
+ "url": "https://gitlab.corp.sellmate.co.kr/sellmate/frontend/design-system/-/issues"
18
+ },
19
+ "license": "MIT",
20
+ "author": {
21
+ "name": "MeeKyeong Kim",
22
+ "email": "kmeijjing@gmail.com"
23
+ },
24
+ "main": "dist/index.js",
25
+ "types": "dist/index.d.ts",
26
+ "directories": {
27
+ "lib": "lib",
28
+ "test": "__tests__"
29
+ },
30
+ "files": [
31
+ "lib",
32
+ "dist"
33
+ ],
34
+ "publishConfig": {
35
+ "access": "public"
36
+ },
37
+ "scripts": {
38
+ "build": "tsc",
39
+ "clean": "rimraf lib",
40
+ "dev": "tsc --watch",
41
+ "typecheck": "tsc --noEmit"
42
+ },
43
+ "devDependencies": {
44
+ "@types/node": "^24.9.1",
45
+ "rimraf": "^6.0.1",
46
+ "typescript": "^5.9.3",
47
+ "vue": "^3.4.38"
48
+ },
49
+ "dependencies": {
50
+ "@sellmate/design-system": "^1.1.0",
51
+ "@stencil/vue-output-target": "^0.11.8"
52
+ },
53
+ "peerDependencies": {
54
+ "vue": ">=3.0.0"
55
+ }
54
56
  }