Intro
-
+
- @nf-team/core
- @nf-team/react
- @nf-team/eslint-config diff --git a/docs/core.html b/docs/core.html index fe9566e0..2ac42096 100644 --- a/docs/core.html +++ b/docs/core.html @@ -2,19 +2,19 @@ - +
- eslint-config-airbnb
- eslint-config-airbnb-typescript @@ -26,12 +26,12 @@
- hooks
- components -
Intro
@nf-team/core
+@nf-team/core
Check out our @nf-team/core libraries docs.
-🐛 Bug reporting
+🐛 Bug reporting
-🔒 LICENSE
-This libraries is MIT licensed.
🔒 LICENSE
+This libraries is MIT licensed.
@nf-team/core - v2.0.3
Functions
-checkEmpty
+@nf-team/core - v2.0.3
Functions
+checkEmpty
▸ checkEmpty<T>(value?): T[]
Type parameters
+Type parameters
| Name |
|---|
T |
Parameters
+Parameters
| Name | Type |
|---|---|
value? | T[] |
Returns
+Returns
T[]
Defined in
- +Defined in
+-
checkNumber
+checkNumber
▸ checkNumber(value?): number
Parameters
+Parameters
| Name | Type |
|---|---|
value? | null | number |
Returns
+Returns
number
Defined in
- +Defined in
+-
emptyAThenB
+emptyAThenB
▸ emptyAThenB(b, a?): string
Parameters
+Parameters
| Name | Type |
|---|---|
b | string |
a? | null | string |
Returns
+Returns
string
Defined in
- +Defined in
+-
generateArrayOfNumber
+generateArrayOfNumber
▸ generateArrayOfNumber(length): number[]
Parameters
+Parameters
| Name | Type |
|---|---|
length | number |
Returns
+Returns
number[]
Defined in
- +Defined in
+-
isEmpty
+isEmpty
▸ isEmpty<T>(value?): boolean
Type parameters
+Type parameters
| Name |
|---|
T |
Parameters
+Parameters
| Name | Type |
|---|---|
value? | T[] |
Returns
+Returns
boolean
Defined in
- +Defined in
+-
removeNullable
+removeNullable
▸ removeNullable(value?, replacementValue?): string
Parameters
+Parameters
| Name | Type | Description |
|---|---|---|
value? | null | string | 첫 번째 인자 string | null | undefined |
replacementValue? | string | 두 번째 인자에 값이 존재하는 경우 첫 번째 인자가 null 또는 undefined인 경우 두번째 인자로 문자열 대체 |
Returns
+Returns
string
Description
null이나 undefined값이 존재하는 경우 빈문자열로 대체하거나 새로운 문자열로 대체합니다. (오로지 string 타입으로 반환)
const value = undefined;
const result = removeNullable(value, 'newValue');
Example
console.log(result); // 'newValue';
Defined in
- +Defined in
+-
trueOrFalse
+trueOrFalse
▸ trueOrFalse(value?): boolean
Parameters
+Parameters
| Name | Type |
|---|---|
value? | null | string | number | boolean |
Returns
+Returns
boolean
Defined in
-Defined in
+@nf-team/eslint-config
+@nf-team/eslint-config
-🚀 Quick Overview
+🚀 Quick Overview
Install @nf-team/eslint-config dependency
npm install --save-dev @nf-team/eslint-config
Add @nf-team/eslint-config to extends in your .eslintrc
module.exports = {
// ...
extends: ['@nf-team/eslint-config'],
rules: {
// ...
},
};
🤔 What eslint extensions does @nf-team/eslint-config have?
+🤔 What eslint extensions does @nf-team/eslint-config have?
eslint-plugin-unused-imports
👉 Sort default imports
+👉 Sort default imports
This is the default value for the groups option:
[
// Side effect imports.
['^\\u0000'],
// Node.js builtins. You could also generate this regex if you use a `.js` config.
// For example: `^(${require("module").builtinModules.join("|")})(/|$)`
// OR Node.js builtins prefixed with `node:`.
['^(assert|buffer|child_process|cluster|console|constants|crypto|dgram|dns|domain|events|fs|http|https|module|net|os|path|punycode|querystring|readline|repl|stream|string_decoder|sys|timers|tls|tty|url|util|vm|zlib|freelist|v8|process|async_hooks|http2|perf_hooks)(/.*|$)', '^node:'],
// Packages. `react` related packages
['^react'],
// Packages. Things that start with a letter (or digit or underscore), or `@` followed by a letter.
['^@?\\w'],
// Parent imports. Put `..` last.
['^\\.\\.(?!/?$)', '^\\.\\./?$'],
// Other relative imports. Put same-folder imports and `.` last.
['^\\./(?=.*/)(?!/?$)', '^\\.(?!/?$)', '^\\./?$'],
// Svg file imports.
['^.+\\.svg$'],
// Style imports.
['^.+\\.s?css$'],
]
🐛 Bug reporting
+🐛 Bug reporting
-🔒 LICENSE
-This Project is MIT licensed.
🔒 LICENSE
+This Project is MIT licensed.
@nf-team/react
+@nf-team/react
Check out our @nf-team/react libraries docs.
@@ -16,9 +16,9 @@🐛 Bug reporting
+🐛 Bug reporting
-🔒 LICENSE
-This libraries is MIT licensed.
🔒 LICENSE
+This libraries is MIT licensed.
Module: components
Functions
-ClientOnly
+Module: components
Functions
+ClientOnly
▸ ClientOnly(«destructured»): ReactElement | null
Parameters
+Parameters
| Name | Type |
|---|---|
«destructured» | Object |
› children? | ReactNode |
Returns
+Returns
ReactElement | null
Description
Component의 mount 여부를 확인하여 mount가 된 경우, Component를 render해줍니다. @@ -22,23 +22,23 @@
Returnsfunction ClintOnlyComponent() {
return (
<ClientOnly>
<div>Render only client environment</div>
</ClientOnly>
);
}
function ClintOnlyComponent() {
return (
<ClientOnly>
<div>Render only client environment</div>
</ClientOnly>
);
}
Defined in
-packages/react/src/components/ClientOnly.tsx:22
+Defined in
+packages/react/src/components/ClientOnly.tsx:22
-
DelayRenderComponent
+DelayRenderComponent
▸ DelayRenderComponent(«destructured»): null | Element
Parameters
+Parameters
| Name | Type |
|---|---|
«destructured» | PropsWithChildren<Props> |
Returns
+Returns
null | Element
Defined in
-packages/react/src/components/DelayRenderComponent.tsx:12
+Defined in
+packages/react/src/components/DelayRenderComponent.tsx:12
-
GlobalPortal
+GlobalPortal
▸ GlobalPortal(elementId): null | ReactPortal
Parameters
+Parameters
| Name | Type | Description |
|---|---|---|
elementId | PropsWithChildren<Props> | 부모 엘리먼트가 아닌 다른 DOM 트리의 elementId값 |
Returns
+Returns
null | ReactPortal
Description
부모 컴포넌트의 DOM 외부에 존재하는 DOM 노드에 렌더링 할 수 있게 해주는 @@ -48,7 +48,7 @@
ParametersExample
html<div id="portal-container" />
tsxfunction SampleComponent() {
return (
<GlobalPortal elementId="portal-container">
<div>Render component</div>
</GlobalPortal>
);
}
-Defined in
-
<div id="portal-container" />
function SampleComponent() {
return (
<GlobalPortal elementId="portal-container">
<div>Render component</div>
</GlobalPortal>
);
}
Defined in
+Module: hooks
Functions
-useActionKeyEvent
+Module: hooks
Functions
+useActionKeyEvent
▸ useActionKeyEvent<T, U>(targetKeys, callback?): ActionKeyEvent<T, U>
Type parameters
+Type parameters
| Name | Type |
|---|---|
T | Element |
U | extends unknown[] = [] |
Parameters
+Parameters
| Name | Type |
|---|---|
targetKeys | string | string[] |
callback? | (event: KeyboardEvent<T>, ...args: U) => void |
Returns
+Returns
ActionKeyEvent<T, U>
Defined in
-packages/react/src/hooks/useActionKeyEvent.ts:6
+Defined in
+packages/react/src/hooks/useActionKeyEvent.ts:6
-
useBoolean
+useBoolean
▸ useBoolean(initialValue?): [boolean, () => void, () => void, (nextValue?: boolean) => void]
Parameters
+Parameters
| Name | Type | Default value | Description |
|---|---|---|---|
initialValue | boolean | false | 초기값을 세팅 |
Returns
+Returns
[boolean, () => void, () => void, (nextValue?: boolean) => void]
Description
boolean 타입으로만 반환하는 useState를 쉽게 사용할 수 있는 hook 입니다.
Example
const [isOpen, openModal, closeModal, toggleModal] = useBoolean();
Defined in
-packages/react/src/hooks/useBoolean.ts:13
+Defined in
+packages/react/src/hooks/useBoolean.ts:13
-
useDebounce
+useDebounce
▸ useDebounce<T>(value, delay?): T
Type parameters
+Type parameters
| Name |
|---|
T |
Parameters
+Parameters
| Name | Type |
|---|---|
value | T |
delay? | number |
Returns
+Returns
T
Defined in
-packages/react/src/hooks/useDebounce.ts:3
+Defined in
+packages/react/src/hooks/useDebounce.ts:3
-
useEffectOnce
+useEffectOnce
▸ useEffectOnce(effect): void
Parameters
+Parameters
| Name | Type |
|---|---|
effect | EffectCallback |
Returns
+Returns
void
Defined in
-packages/react/src/hooks/useEffectOnce.ts:3
+Defined in
+packages/react/src/hooks/useEffectOnce.ts:3
-
useGeolocation
+useGeolocation
▸ useGeolocation(): [GeoLocation, () => void]
Returns
+Returns
[GeoLocation, () => void]
Defined in
-packages/react/src/hooks/useGeolocation.ts:15
+Defined in
+packages/react/src/hooks/useGeolocation.ts:15
-
useIsFirstRender
+useIsFirstRender
▸ useIsFirstRender(): boolean
Returns
+Returns
boolean
Defined in
-packages/react/src/hooks/useIsFirstRender.ts:3
+Defined in
+packages/react/src/hooks/useIsFirstRender.ts:3
-
useIsMounted
+useIsMounted
▸ useIsMounted(): boolean
Returns
+Returns
boolean
Description
Component의 mount 여부를 확인하는 hook 입니다.
SSR 환경에서 실제로 컴포넌트가 브라우저에서 mount 된 이후에 어떤 동작을 실행하기 위해서 사용합니다.
Example
const isMounted = useIsMounted();
useEffect(() => {
if (isMounted) {
return;
}
}, [isMounted]);
Defined in
-packages/react/src/hooks/useIsMounted.ts:18
+Defined in
+packages/react/src/hooks/useIsMounted.ts:18
-
useIsomorphicLayoutEffect
+useIsomorphicLayoutEffect
▸ useIsomorphicLayoutEffect(effect, deps?): void
Accepts a function that contains imperative, possibly effectful code.
-Parameters
+Parameters
| Name | Type | Description |
|---|---|---|
effect | EffectCallback | Imperative function that can return a cleanup function |
deps? | DependencyList | If present, effect will only activate if the values in the list change. |
Returns
+Returns
void
Version
16.8.0
See
https://react.dev/reference/react/useEffect
-Defined in
+Defined in
node_modules/@types/react/index.d.ts:2031
-
useLessThenScrollY
+useLessThenScrollY
▸ useLessThenScrollY(targetScrollY?, delay?): boolean
Parameters
+Parameters
| Name | Type | Default value |
|---|---|---|
targetScrollY | number | 0 |
delay | number | 200 |
Returns
+Returns
boolean
Defined in
-packages/react/src/hooks/useLessThenScrollY.ts:5
+Defined in
+packages/react/src/hooks/useLessThenScrollY.ts:5
-
useResizeViewportHeight
+useResizeViewportHeight
▸ useResizeViewportHeight(): void
Returns
+Returns
void
Description
스크롤을 포함한 window의 높이를 가져와 window 크기를 resize해줍니다.
모바일 환경의 웹뷰에서 디바이스 및 브라우저 환경에 따라 크기가 달라져 불필요한 스크롤이 생길 수 있습니다. 이때 이 hook을 사용하면 유용합니다.
Example
function SampleComponent() {
useResizeViewportHeight();
return <div>sample text</div>
}
Defined in
-packages/react/src/hooks/useResizeViewportHeight.ts:17
+Defined in
+packages/react/src/hooks/useResizeViewportHeight.ts:17
-
useThrottleCallback
+useThrottleCallback
▸ useThrottleCallback<U>(callback, dependencyList, delay): (...args: U) => void
Type parameters
+Type parameters
| Name | Type |
|---|---|
U | extends unknown[] = [] |
Parameters
+Parameters
| Name | Type |
|---|---|
callback | (...args: U) => void |
dependencyList | DependencyList |
delay | number |
Returns
+Returns
fn
▸ (...args): void
Parameters
+Parameters
| Name | Type |
|---|---|
...args | U |
Returns
+Returns
void
Defined in
-packages/react/src/hooks/useThrottleCallback.ts:3
+Defined in
+packages/react/src/hooks/useThrottleCallback.ts:3
-
useTimeout
+useTimeout
▸ useTimeout(callback, delay): void
Parameters
+Parameters
| Name | Type |
|---|---|
callback | () => void |
delay | null | number |
Returns
+Returns
void
Defined in
-packages/react/src/hooks/useTimeout.ts:5
+Defined in
+packages/react/src/hooks/useTimeout.ts:5
-
useUnmount
+useUnmount
▸ useUnmount(fn): void
Parameters
+Parameters
| Name | Type |
|---|---|
fn | () => void |
Returns
+Returns
void
Defined in
-packages/react/src/hooks/useUnmount.ts:5
+Defined in
+packages/react/src/hooks/useUnmount.ts:5
-
useUpdateEffect
+useUpdateEffect
▸ useUpdateEffect(effect, deps?): void
Parameters
+Parameters
| Name | Type |
|---|---|
effect | EffectCallback |
deps? | DependencyList |
Returns
+Returns
void
Defined in
-Defined in
+@nf-team/storage
+@nf-team/storage
Check out our @nf-team/storage libraries docs.
-🐛 Bug reporting
+🐛 Bug reporting
-🔒 LICENSE
-This libraries is MIT licensed.
🔒 LICENSE
+This libraries is MIT licensed.
@nf-team/storage - v1.0.1
Functions
-getLocalStorageItem
+@nf-team/storage - v1.0.1
Functions
+getLocalStorageItem
▸ getLocalStorageItem<T>(key): null | T
Type parameters
+Type parameters
| Name |
|---|
T |
Parameters
+Parameters
| Name | Type |
|---|---|
key | string |
Returns
+Returns
null | T
Defined in
- +Defined in
+-
getSessionStorageItem
+getSessionStorageItem
▸ getSessionStorageItem<T>(key): null | T
Type parameters
+Type parameters
| Name |
|---|
T |
Parameters
+Parameters
| Name | Type |
|---|---|
key | string |
Returns
+Returns
null | T
Defined in
- +Defined in
+-
removeLocalStorageItem
+removeLocalStorageItem
▸ removeLocalStorageItem(key): void
Parameters
+Parameters
| Name | Type |
|---|---|
key | string |
Returns
+Returns
void
Defined in
- +Defined in
+-
removeSessionStorageItem
+removeSessionStorageItem
▸ removeSessionStorageItem(key): void
Parameters
+Parameters
| Name | Type |
|---|---|
key | string |
Returns
+Returns
void
Defined in
- +Defined in
+-
setLocalStorageItem
+setLocalStorageItem
▸ setLocalStorageItem(key, value): void
Parameters
+Parameters
| Name | Type |
|---|---|
key | string |
value | unknown |
Returns
+Returns
void
Defined in
- +Defined in
+-
setSessionStorageItem
+setSessionStorageItem
▸ setSessionStorageItem(key, value): void
Parameters
+Parameters
| Name | Type |
|---|---|
key | string |
value | unknown |
Returns
+Returns
void
Defined in
-Defined in
+@nf-team/stylelint-config
+@nf-team/stylelint-config
-🚀 Quick Overview
+🚀 Quick Overview
Install stylelint, @nf-team/stylelint-config dependency
npm install --save-dev stylelint @nf-team/stylelint-config
Add @nf-team/stylelint-config to extends in your .stylelintrc
module.exports = {
extends: ['@nf-team/stylelint-config'],
rules: {
// ...
},
};
🤔 What stylelint extensions does @nf-team/stylelint-config have?
+🤔 What stylelint extensions does @nf-team/stylelint-config have?
-🐛 Bug reporting
+🐛 Bug reporting
-🔒 LICENSE
-This libraries is MIT licensed.
🔒 LICENSE
+This libraries is MIT licensed.
@nf-team/frontend-libraries
@mbti-nf-team 프론트엔드 라이브러리 모음
@nf-team/core
@nf-team/react
@nf-team/storage
@nf-team/eslint-config
@nf-team/stylelint-config
@nf-team/frontend-libraries
@mbti-nf-team 프론트엔드 라이브러리 모음