oasis-chat 0.2.5 → 0.2.7
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 +31 -11
- package/dist/index.cjs.js +5 -5
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.es.js +562 -546
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +5 -5
- package/dist/index.umd.js.map +1 -1
- package/dist/react/index.cjs.js +6 -6
- package/dist/react/index.cjs.js.map +1 -1
- package/dist/react/index.es.js +571 -555
- package/dist/react/index.es.js.map +1 -1
- package/dist/vue/index.cjs.js +6 -6
- package/dist/vue/index.cjs.js.map +1 -1
- package/dist/vue/index.es.js +573 -557
- package/dist/vue/index.es.js.map +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
# Oasis
|
|
1
|
+
# Oasis Chat
|
|
2
2
|
|
|
3
|
-
`createButton`을 제공하는 가벼운 바닐라 JS 버튼 컴포넌트입니다. React와 Vue를 위한 wrapper 컴포넌트도 제공됩니다.
|
|
3
|
+
`createButton`을 제공하는 가벼운 바닐라 JS 채팅 버튼 컴포넌트입니다. React와 Vue를 위한 wrapper 컴포넌트도 제공됩니다.
|
|
4
4
|
|
|
5
5
|
## 설치
|
|
6
6
|
|
|
@@ -82,7 +82,13 @@ React 프로젝트에서 사용할 때는 wrapper 컴포넌트를 사용하면 C
|
|
|
82
82
|
import { OasisButton } from 'oasis-chat/react';
|
|
83
83
|
|
|
84
84
|
function App() {
|
|
85
|
-
return
|
|
85
|
+
return (
|
|
86
|
+
<OasisButton
|
|
87
|
+
account_id="your-account-id"
|
|
88
|
+
password="your-password"
|
|
89
|
+
assistant_uuid="your-assistant-uuid"
|
|
90
|
+
/>
|
|
91
|
+
);
|
|
86
92
|
}
|
|
87
93
|
```
|
|
88
94
|
|
|
@@ -93,14 +99,14 @@ Vue 프로젝트에서 사용할 때도 wrapper 컴포넌트를 사용하면 CSS
|
|
|
93
99
|
```vue
|
|
94
100
|
<script setup>
|
|
95
101
|
import { OasisButton } from 'oasis-chat/vue';
|
|
96
|
-
|
|
97
|
-
const handleClick = () => {
|
|
98
|
-
alert('hello');
|
|
99
|
-
};
|
|
100
102
|
</script>
|
|
101
103
|
|
|
102
104
|
<template>
|
|
103
|
-
<OasisButton
|
|
105
|
+
<OasisButton
|
|
106
|
+
account_id="your-account-id"
|
|
107
|
+
password="your-password"
|
|
108
|
+
assistant_uuid="your-assistant-uuid"
|
|
109
|
+
/>
|
|
104
110
|
</template>
|
|
105
111
|
```
|
|
106
112
|
|
|
@@ -113,8 +119,9 @@ import { createButton } from 'oasis-chat';
|
|
|
113
119
|
import 'oasis-chat/style.css'; // CSS 파일 import 필요
|
|
114
120
|
|
|
115
121
|
const btn = createButton({
|
|
116
|
-
|
|
117
|
-
|
|
122
|
+
account_id: 'your-account-id',
|
|
123
|
+
password: 'your-password',
|
|
124
|
+
assistant_uuid: 'your-assistant-uuid',
|
|
118
125
|
});
|
|
119
126
|
|
|
120
127
|
document.body.appendChild(btn);
|
|
@@ -122,13 +129,26 @@ document.body.appendChild(btn);
|
|
|
122
129
|
|
|
123
130
|
**참고**: React나 Vue wrapper를 사용할 때는 CSS를 별도로 import할 필요가 없습니다. wrapper 컴포넌트 내부에서 자동으로 CSS가 포함됩니다.
|
|
124
131
|
|
|
132
|
+
## Props
|
|
133
|
+
|
|
134
|
+
- `account_id` (string, 필수): 로그인에 사용할 계정 ID
|
|
135
|
+
- `password` (string, 필수): 로그인에 사용할 비밀번호
|
|
136
|
+
- `assistant_uuid` (string, 필수): 어시스턴트 UUID
|
|
137
|
+
|
|
125
138
|
## 개발/빌드
|
|
126
139
|
|
|
127
140
|
```bash
|
|
128
141
|
npm run dev # 데모 앱 실행 (Vite)
|
|
129
|
-
npm run build:lib # 라이브러리 빌드 (
|
|
142
|
+
npm run build:lib # 라이브러리 빌드 (Vanilla JS, React, Vue 모두 빌드)
|
|
130
143
|
```
|
|
131
144
|
|
|
145
|
+
빌드 후 `dist/` 폴더에 다음 파일들이 생성됩니다:
|
|
146
|
+
|
|
147
|
+
- `index.*.js` - Vanilla JS 버전
|
|
148
|
+
- `react/index.*.js` - React wrapper 버전
|
|
149
|
+
- `vue/index.*.js` - Vue wrapper 버전
|
|
150
|
+
- `oasis-chat.css` - 스타일시트
|
|
151
|
+
|
|
132
152
|
## 라이선스
|
|
133
153
|
|
|
134
154
|
MIT
|