Release (#18)

doc/docs/advanced/get-token-value.mdx

@@ -0,0 +1,30 @@
+---
+sidebar_position: 1
+---
+
+# Get token value with useSxToken
+
+To get individual token values for a theme, you can use the `useSxToken` hook.
+
+This is useful when it is cumbersome to get the style by passing `SxProps` to the `useSx` hook or when individual token values are needed.
+
+```tsx
+const MyView = (
+  {
+    disabled,
+    readonly
+  }:{
+    disabled?: boolean;
+    readonly?: boolean;
+  }) => {
+  const backgroundColor = useSxToken('colors', readonly || disabled ? 'gray500' : 'gray200');
+g
+  return <View style={{ backgroundColor }} />
+}
+```
+
+:::info
+To operate properly, you must use it in the Context inside `StyledSystemProvider` or pass the theme object as an option.
+
+Additionally, `undefined` is returned when attempting to reference a key that does not exist.
+:::

doc/docs/advanced/global-theme-value.mdx

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 1
+sidebar_position: 2
 title: Get Theme value in global
 ---
 

doc/i18n/ko/docusaurus-plugin-content-docs/current/advanced/get-token-value.mdx

@@ -0,0 +1,30 @@
+---
+sidebar_position: 1
+---
+
+# useSxToken를 이용해 토큰값 얻기
+
+테마의 개별적인 토큰 값을 얻으려면 `useSxToken` 훅을 사용할 수 있습니다.
+
+이는 `SxProps`를 `useSx` 훅에 전달해 style을 얻기 번거롭거나 개별적인 토큰 값이 필요할 때 유용합니다.
+
+```tsx
+const MyView = (
+  {
+    disabled,
+    readonly
+  }:{
+    disabled?: boolean;
+    readonly?: boolean;
+  }) => {
+  const backgroundColor = useSxToken('colors', readonly || disabled ? 'gray500' : 'gray200');
+
+  return <View style={{ backgroundColor }} />
+}
+```
+
+:::info
+`StyledSystemProvider`내부의 Context에서 사용하거나 옵션으로 테마 객체를 전달해야 정상적으로 동작합니다.
+
+또한, 존재하지 않는 키를 참조하려고 할 시에도 `undefined`가 반환됩니다.
+:::

package.json

@@ -67,13 +67,15 @@
   "source": "src/index.ts",
   "module": "lib/module/index.js",
   "react-native-builder-bob": {
+    "declarationMap": false,
     "source": "src",
     "output": "lib",
     "targets": [
       "commonjs",
       "module",
       "typescript"
-    ]
+    ],
+    "exclude": ["**/{__tests__,__fixtures__,__mocks__}/**", "**/*.test.*"]
   },
   "config": {
     "commitizen": {

tsconfig.json

@@ -15,5 +15,6 @@
     "rootDir": "src",
     "skipLibCheck": true
   },
-  "include": ["src/**/*.ts", "src/**/*.tsx"]
+  "include": ["src/**/*.ts", "src/**/*.tsx"],
+  "exclude": ["**/*.test.*", "node_modules"]
 }