docs: josa 및 josa.pick 문서에 데모 추가 (#209)

* docs: josa, josa.pick 데모 추가 * chore: changeset 추가
toss · Aug 2, 2024 · c15a9d1 · c15a9d1
1 parent 6321af4
commit c15a9d1
Show file tree

Hide file tree

Showing 5 changed files with 69 additions and 0 deletions.
diff --git a/.changeset/poor-impalas-train.md b/.changeset/poor-impalas-train.md
@@ -0,0 +1,5 @@
+---
+"docs": patch
+---
+
+docs: josa, josa.pick 문서에 demo를 추가합니다.
diff --git a/docs/src/pages/docs/api/josa.en.md → docs/src/pages/docs/api/josa.en.mdx b/docs/src/pages/docs/api/josa.en.md → docs/src/pages/docs/api/josa.en.mdx
@@ -2,6 +2,8 @@
 title: josa
 ---
 
+import { Sandpack } from '@/components/Sandpack';
+
 # josa
 
 Add a particle to a Hangul string. It can support particles like '이/가', '을/를', '은/는', '으로/로', '와/과', '이나/나', '이란/란', '아/야', '이랑/랑', '이에요/예요', '으로서/로서', '으로써/로써', '으로부터/로부터'.
@@ -37,3 +39,17 @@ josa('칫솔', '이/가'); // '칫솔이'
 josa('바깥', '으로/로'); // '바깥으로'
 josa('내부', '으로/로'); // '내부로'
 ```
+
+## Demo
+
+<br />
+
+<Sandpack>
+
+```ts index.ts
+import { josa } from 'es-hangul';
+
+console.log(josa('샴푸', '이/가'));
+```
+
+</Sandpack>
diff --git a/docs/src/pages/docs/api/josa.ko.md → docs/src/pages/docs/api/josa.ko.mdx b/docs/src/pages/docs/api/josa.ko.md → docs/src/pages/docs/api/josa.ko.mdx
@@ -2,6 +2,8 @@
 title: josa
 ---
 
+import { Sandpack } from '@/components/Sandpack';
+
 # josa
 
 한글 문자열에 `'이/가'`, `'을/를'`, `'은/는'`, `'으로/로'`, `'와/과'`, `'이나/나'`, `'이에/에'`, `'이란/란'`, `'아/야'`, `'이랑/랑'`, `'이에요/예요'`, `'으로서/로서'`, `'으로써/로써'`, `'으로부터/로부터'` 와 같은 조사를 붙여줍니다.
@@ -36,3 +38,17 @@ josa('칫솔', '이/가'); // '칫솔이'
 josa('바깥', '으로/로'); // '바깥으로'
 josa('내부', '으로/로'); // '내부로'
 ```
+
+## 사용해보기
+
+<br />
+
+<Sandpack>
+
+```ts index.ts
+import { josa } from 'es-hangul';
+
+console.log(josa('샴푸', '이/가'));
+```
+
+</Sandpack>
diff --git a/docs/src/pages/docs/api/josa.pick.en.md → docs/src/pages/docs/api/josa.pick.en.mdx b/docs/src/pages/docs/api/josa.pick.en.md → docs/src/pages/docs/api/josa.pick.en.mdx
@@ -2,6 +2,8 @@
 title: josa.pick
 ---
 
+import { Sandpack } from '@/components/Sandpack';
+
 # josa.pick
 
 The josa.pick method selects and returns the appropriate Korean particle based on a given Korean string and particle options. This method is used within the [josa](https://es-hangul.slash.page/en/docs/api/josa) function, and the form of the particle is determined by the last character of the string.
@@ -50,3 +52,17 @@ josa.pick('칫솔', '이/가'); // '이'
 josa.pick('바깥', '으로/로'); // '으로'
 josa.pick('내부', '으로/로'); // '로'
 ```
+
+## Demo
+
+<br />
+
+<Sandpack>
+
+```ts index.ts
+import { josa } from 'es-hangul';
+
+console.log(josa.pick('샴푸', '이/가'));
+```
+
+</Sandpack>
diff --git a/docs/src/pages/docs/api/josa.pick.ko.md → docs/src/pages/docs/api/josa.pick.ko.mdx b/docs/src/pages/docs/api/josa.pick.ko.md → docs/src/pages/docs/api/josa.pick.ko.mdx
@@ -2,6 +2,8 @@
 title: josa.pick
 ---
 
+import { Sandpack } from '@/components/Sandpack';
+
 # josa.pick
 
 `josa.pick` 메서드는 주어진 한글 문자열과 조사 옵션에 따라 적절한 조사를 선택하여 반환합니다. 이 메서드는 [josa](https://es-hangul.slash.page/docs/api/josa) 함수 내에서 사용되며, 문자열의 마지막 글자에 따라 조사의 형태가 결정됩니다.
@@ -50,3 +52,17 @@ josa.pick('칫솔', '이/가'); // '이'
 josa.pick('바깥', '으로/로'); // '으로'
 josa.pick('내부', '으로/로'); // '로'
 ```
+
+## 사용해보기
+
+<br />
+
+<Sandpack>
+
+```ts index.ts
+import { josa } from 'es-hangul';
+
+console.log(josa.pick('샴푸', '이/가'));
+```
+
+</Sandpack>