@sellmate/design-system-vue 0.0.47 → 0.0.49
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 +78 -78
- package/dist/components.js +2 -0
- package/lib/components.ts +2 -0
- package/lib/index.ts +2 -2
- package/lib/plugin.ts +10 -10
- package/package.json +54 -55
package/README.md
CHANGED
|
@@ -1,78 +1,78 @@
|
|
|
1
|
-
# Sellmate Design System - Vue
|
|
2
|
-
|
|
3
|
-
Vue 3 component wrappers for Sellmate Design System built with Stencil web components.
|
|
4
|
-
|
|
5
|
-
## Installation
|
|
6
|
-
|
|
7
|
-
```bash
|
|
8
|
-
npm install @sellmate/design-system-vue
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
or
|
|
12
|
-
|
|
13
|
-
```bash
|
|
14
|
-
yarn add @sellmate/design-system-vue
|
|
15
|
-
```
|
|
16
|
-
|
|
17
|
-
## Setup
|
|
18
|
-
|
|
19
|
-
### Vue 3
|
|
20
|
-
|
|
21
|
-
```ts
|
|
22
|
-
import { createApp } from 'vue';
|
|
23
|
-
import { defineCustomElementsDesignSystem } from '@sellmate/design-system-vue/loader';
|
|
24
|
-
import App from './App.vue';
|
|
25
|
-
|
|
26
|
-
const app = createApp(App);
|
|
27
|
-
|
|
28
|
-
// Define custom elements
|
|
29
|
-
defineCustomElementsDesignSystem();
|
|
30
|
-
|
|
31
|
-
app.mount('#app');
|
|
32
|
-
```
|
|
33
|
-
|
|
34
|
-
## Quick Start
|
|
35
|
-
|
|
36
|
-
### Basic Component Usage
|
|
37
|
-
|
|
38
|
-
```vue
|
|
39
|
-
<template>
|
|
40
|
-
<div>
|
|
41
|
-
<SdButton @click="handleClick">
|
|
42
|
-
Click me
|
|
43
|
-
</SdButton>
|
|
44
|
-
</div>
|
|
45
|
-
</template>
|
|
46
|
-
|
|
47
|
-
<script setup lang="ts">
|
|
48
|
-
import { SdButton } from '@sellmate/design-system-vue';
|
|
49
|
-
|
|
50
|
-
const handleClick = () => {
|
|
51
|
-
console.log('Button clicked');
|
|
52
|
-
};
|
|
53
|
-
</script>
|
|
54
|
-
```
|
|
55
|
-
|
|
56
|
-
## Available Components
|
|
57
|
-
|
|
58
|
-
- `SdButton` - Button component
|
|
59
|
-
- `SdInput` - Input component
|
|
60
|
-
- `SdCheckbox` - Checkbox component
|
|
61
|
-
- `SdSelect` - Select dropdown component
|
|
62
|
-
- `SdTable` - Table component
|
|
63
|
-
- `SdTag` - Tag component
|
|
64
|
-
- `SdIcon` - Icon component
|
|
65
|
-
- `SdTooltip` - Tooltip component
|
|
66
|
-
- `SdPopover` - Popover component
|
|
67
|
-
- `SdDatePicker` - Date picker component
|
|
68
|
-
- `SdDateRangePicker` - Date range picker component
|
|
69
|
-
- `SdPagination` - Pagination component
|
|
70
|
-
|
|
71
|
-
## Requirements
|
|
72
|
-
|
|
73
|
-
- Vue 3.0.0 or higher
|
|
74
|
-
- @sellmate/design-system (peer dependency)
|
|
75
|
-
|
|
76
|
-
## License
|
|
77
|
-
|
|
78
|
-
MIT
|
|
1
|
+
# Sellmate Design System - Vue
|
|
2
|
+
|
|
3
|
+
Vue 3 component wrappers for Sellmate Design System built with Stencil web components.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @sellmate/design-system-vue
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
or
|
|
12
|
+
|
|
13
|
+
```bash
|
|
14
|
+
yarn add @sellmate/design-system-vue
|
|
15
|
+
```
|
|
16
|
+
|
|
17
|
+
## Setup
|
|
18
|
+
|
|
19
|
+
### Vue 3
|
|
20
|
+
|
|
21
|
+
```ts
|
|
22
|
+
import { createApp } from 'vue';
|
|
23
|
+
import { defineCustomElementsDesignSystem } from '@sellmate/design-system-vue/loader';
|
|
24
|
+
import App from './App.vue';
|
|
25
|
+
|
|
26
|
+
const app = createApp(App);
|
|
27
|
+
|
|
28
|
+
// Define custom elements
|
|
29
|
+
defineCustomElementsDesignSystem();
|
|
30
|
+
|
|
31
|
+
app.mount('#app');
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
## Quick Start
|
|
35
|
+
|
|
36
|
+
### Basic Component Usage
|
|
37
|
+
|
|
38
|
+
```vue
|
|
39
|
+
<template>
|
|
40
|
+
<div>
|
|
41
|
+
<SdButton @click="handleClick">
|
|
42
|
+
Click me
|
|
43
|
+
</SdButton>
|
|
44
|
+
</div>
|
|
45
|
+
</template>
|
|
46
|
+
|
|
47
|
+
<script setup lang="ts">
|
|
48
|
+
import { SdButton } from '@sellmate/design-system-vue';
|
|
49
|
+
|
|
50
|
+
const handleClick = () => {
|
|
51
|
+
console.log('Button clicked');
|
|
52
|
+
};
|
|
53
|
+
</script>
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
## Available Components
|
|
57
|
+
|
|
58
|
+
- `SdButton` - Button component
|
|
59
|
+
- `SdInput` - Input component
|
|
60
|
+
- `SdCheckbox` - Checkbox component
|
|
61
|
+
- `SdSelect` - Select dropdown component
|
|
62
|
+
- `SdTable` - Table component
|
|
63
|
+
- `SdTag` - Tag component
|
|
64
|
+
- `SdIcon` - Icon component
|
|
65
|
+
- `SdTooltip` - Tooltip component
|
|
66
|
+
- `SdPopover` - Popover component
|
|
67
|
+
- `SdDatePicker` - Date picker component
|
|
68
|
+
- `SdDateRangePicker` - Date range picker component
|
|
69
|
+
- `SdPagination` - Pagination component
|
|
70
|
+
|
|
71
|
+
## Requirements
|
|
72
|
+
|
|
73
|
+
- Vue 3.0.0 or higher
|
|
74
|
+
- @sellmate/design-system (peer dependency)
|
|
75
|
+
|
|
76
|
+
## License
|
|
77
|
+
|
|
78
|
+
MIT
|
package/dist/components.js
CHANGED
|
@@ -301,12 +301,14 @@ export const SdTableBackup = /*@__PURE__*/ defineContainer('sd-table-backup', un
|
|
|
301
301
|
'noDataLabel',
|
|
302
302
|
'isLoading',
|
|
303
303
|
'pagination',
|
|
304
|
+
'headerCellRenderer',
|
|
304
305
|
'bodyCellRenderer',
|
|
305
306
|
'useInternalPagination',
|
|
306
307
|
'useRowsPerPageSelect',
|
|
307
308
|
'rowsPerPageOption',
|
|
308
309
|
'useVirtualScroll',
|
|
309
310
|
'virtualRowHeight',
|
|
311
|
+
'virtualColumnWidth',
|
|
310
312
|
'virtualBufferSize',
|
|
311
313
|
'sdSelectChange',
|
|
312
314
|
'sdPageChange',
|
package/lib/components.ts
CHANGED
|
@@ -352,12 +352,14 @@ export const SdTableBackup: StencilVueComponent<JSX.SdTableBackup> = /*@__PURE__
|
|
|
352
352
|
'noDataLabel',
|
|
353
353
|
'isLoading',
|
|
354
354
|
'pagination',
|
|
355
|
+
'headerCellRenderer',
|
|
355
356
|
'bodyCellRenderer',
|
|
356
357
|
'useInternalPagination',
|
|
357
358
|
'useRowsPerPageSelect',
|
|
358
359
|
'rowsPerPageOption',
|
|
359
360
|
'useVirtualScroll',
|
|
360
361
|
'virtualRowHeight',
|
|
362
|
+
'virtualColumnWidth',
|
|
361
363
|
'virtualBufferSize',
|
|
362
364
|
'sdSelectChange',
|
|
363
365
|
'sdPageChange',
|
package/lib/index.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export * from "./components";
|
|
2
|
-
export * from "./plugin";
|
|
1
|
+
export * from "./components";
|
|
2
|
+
export * from "./plugin";
|
package/lib/plugin.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { defineCustomElements } from '@sellmate/design-system/loader';
|
|
2
|
-
import type { App } from 'vue';
|
|
3
|
-
|
|
4
|
-
export const StencilTestVuePlugin = {
|
|
5
|
-
install(_app: App) {
|
|
6
|
-
defineCustomElements();
|
|
7
|
-
},
|
|
8
|
-
};
|
|
9
|
-
|
|
10
|
-
export default StencilTestVuePlugin;
|
|
1
|
+
import { defineCustomElements } from '@sellmate/design-system/loader';
|
|
2
|
+
import type { App } from 'vue';
|
|
3
|
+
|
|
4
|
+
export const StencilTestVuePlugin = {
|
|
5
|
+
install(_app: App) {
|
|
6
|
+
defineCustomElements();
|
|
7
|
+
},
|
|
8
|
+
};
|
|
9
|
+
|
|
10
|
+
export default StencilTestVuePlugin;
|
package/package.json
CHANGED
|
@@ -1,55 +1,54 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@sellmate/design-system-vue",
|
|
3
|
-
"version": "0.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": "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": "^0.0.
|
|
49
|
-
"@stencil/vue-output-target": "^0.11.8"
|
|
50
|
-
},
|
|
51
|
-
"peerDependencies": {
|
|
52
|
-
"vue": ">=3.0.0"
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "@sellmate/design-system-vue",
|
|
3
|
+
"version": "0.0.49",
|
|
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": "^0.0.48",
|
|
49
|
+
"@stencil/vue-output-target": "^0.11.8"
|
|
50
|
+
},
|
|
51
|
+
"peerDependencies": {
|
|
52
|
+
"vue": ">=3.0.0"
|
|
53
|
+
}
|
|
54
|
+
}
|