├── .circleci └── config.yml ├── .editorconfig ├── .eslintignore ├── .eslintrc.js ├── .gitattributes ├── .github ├── CODEOWNERS ├── CODE_OF_CONDUCT.md ├── CONTRIBUTING.md ├── ISSUE_TEMPLATE │ ├── bug_report.md │ └── feature_request.md └── PULL_REQUEST_TEMPLATE.md ├── .gitignore ├── .nvmrc ├── .pnp.cjs ├── .pnp.loader.mjs ├── .prettierrc ├── .scripts └── check-peer.sh ├── .vscode ├── extensions.json └── settings.json ├── .yarn ├── patches │ ├── @lerna │ │ ├── npm-publish.patch │ │ ├── pack-directory.patch │ │ ├── package-graph.patch │ │ ├── package.patch │ │ └── version.patch │ └── documentation-npm-14.0.0-c422c3490f.patch ├── plugins │ └── @yarnpkg │ │ └── plugin-workspace-since.cjs ├── releases │ └── yarn-4.1.1.cjs └── sdks │ ├── eslint │ ├── bin │ │ └── eslint.js │ ├── lib │ │ └── api.js │ └── package.json │ ├── integrations.yml │ ├── prettier │ ├── bin-prettier.js │ ├── index.js │ └── package.json │ └── typescript │ ├── bin │ ├── tsc │ └── tsserver │ ├── lib │ ├── tsc.js │ ├── tsserver.js │ ├── tsserverlibrary.js │ └── typescript.js │ └── package.json ├── .yarnrc ├── .yarnrc.yml ├── LICENSE ├── README-ko_kr.md ├── README.md ├── babel.config.js ├── configs ├── jest │ ├── CHANGELOG.md │ ├── package.json │ └── src │ │ ├── config.js │ │ └── index.js └── rollup │ ├── CHANGELOG.md │ ├── LICENSE │ ├── package.json │ └── src │ └── index.js ├── docs ├── .gitignore ├── CHANGELOG.md ├── babel.config.js ├── docusaurus.config.js ├── i18n │ ├── en │ │ ├── code.json │ │ ├── docusaurus-plugin-content-blog │ │ │ └── options.json │ │ ├── docusaurus-plugin-content-docs │ │ │ └── current.json │ │ └── docusaurus-theme-classic │ │ │ ├── footer.json │ │ │ └── navbar.json │ └── ko │ │ ├── code.json │ │ ├── docusaurus-plugin-content-blog │ │ └── options.json │ │ ├── docusaurus-plugin-content-docs │ │ ├── .gitignore │ │ └── current.json │ │ ├── docusaurus-plugin-content-pages │ │ └── index.md │ │ └── docusaurus-theme-classic │ │ ├── footer.json │ │ └── navbar.json ├── package.json ├── pages │ └── index.md ├── scripts │ ├── build-docs │ │ ├── constants.ts │ │ ├── generate-docs-from-jsdoc.ts │ │ ├── generate-docs-from-md.ts │ │ └── index.ts │ └── webpack5-compat.js ├── sidebars.libraries.js ├── static │ ├── banner.png │ └── img │ │ ├── github-dark.svg │ │ └── github.svg ├── styles.css └── tsconfig.json ├── jest.config.js ├── lerna.json ├── netlify.toml ├── package.json ├── packages ├── common │ ├── assert │ │ ├── .npmignore │ │ ├── CHANGELOG.md │ │ ├── LICENSE │ │ ├── babel.config.js │ │ ├── jest.config.js │ │ ├── jest.setup.ts │ │ ├── package.json │ │ ├── rollup.config.js │ │ ├── src │ │ │ ├── assert.en.md │ │ │ ├── assert.ko.md │ │ │ ├── assert.test.ts │ │ │ ├── assert.ts │ │ │ ├── assertNonEmptyArray.en.md │ │ │ ├── assertNonEmptyArray.ko.md │ │ │ ├── assertNonEmptyArray.ts │ │ │ └── index.ts │ │ ├── tsconfig.build.json │ │ ├── tsconfig.esm.json │ │ └── tsconfig.json │ ├── crypto │ │ ├── CHANGELOG.md │ │ ├── LICENSE │ │ ├── babel.config.js │ │ ├── jest.config.js │ │ ├── package.json │ │ ├── rollup.config.js │ │ ├── src │ │ │ ├── index.ts │ │ │ ├── pkcs1 │ │ │ │ ├── encrypt.en.md │ │ │ │ ├── encrypt.ko.md │ │ │ │ ├── encrypt.ts │ │ │ │ ├── index.ts │ │ │ │ └── utils.ts │ │ │ ├── utils.en.md │ │ │ ├── utils.ko.md │ │ │ └── utils.ts │ │ ├── tsconfig.build.json │ │ └── tsconfig.json │ ├── date │ │ ├── .vscode │ │ │ └── settings.json │ │ ├── CHANGELOG.md │ │ ├── LICENSE │ │ ├── README.ko.md │ │ ├── README.md │ │ ├── babel.config.js │ │ ├── jest.config.js │ │ ├── package.json │ │ ├── rollup.config.js │ │ ├── src │ │ │ ├── date.spec.ts │ │ │ ├── date.ts │ │ │ ├── docs │ │ │ │ ├── DateFnsDateType.en.md │ │ │ │ ├── DateFnsDateType.ko.md │ │ │ │ ├── getDateDistance.en.md │ │ │ │ ├── getDateDistance.ko.md │ │ │ │ ├── getDateDistanceText.en.md │ │ │ │ ├── getDateDistanceText.ko.md │ │ │ │ ├── isEqualOrAfter.en.md │ │ │ │ ├── isEqualOrAfter.ko.md │ │ │ │ ├── isEqualOrBefore.en.md │ │ │ │ ├── isEqualOrBefore.ko.md │ │ │ │ ├── kstFormat.en.md │ │ │ │ ├── kstFormat.ko.md │ │ │ │ ├── parseYYYYMMDD.en.md │ │ │ │ ├── parseYYYYMMDD.ko.md │ │ │ │ ├── roundUpHoursInDays.en.md │ │ │ │ └── roundUpHoursInDays.ko.md │ │ │ └── index.ts │ │ ├── tsconfig.build.json │ │ ├── tsconfig.esm.json │ │ └── tsconfig.json │ ├── hangul │ │ ├── .npmignore │ │ ├── .vscode │ │ │ └── settings.json │ │ ├── CHANGELOG.md │ │ ├── LICENSE │ │ ├── README.ko.md │ │ ├── README.md │ │ ├── babel.config.js │ │ ├── jest.config.js │ │ ├── jest.setup.ts │ │ ├── package.json │ │ ├── rollup.config.js │ │ ├── src │ │ │ ├── chosungIncludes.en.md │ │ │ ├── chosungIncludes.ko.md │ │ │ ├── chosungIncludes.ts │ │ │ ├── constants.ts │ │ │ ├── disassemble.en.md │ │ │ ├── disassemble.ko.md │ │ │ ├── disassemble.ts │ │ │ ├── disassembleCompleteHangulCharacter.spec.ts │ │ │ ├── disassembleCompleteHangulCharacter.ts │ │ │ ├── hangulIncludes.en.md │ │ │ ├── hangulIncludes.ko.md │ │ │ ├── hangulIncludes.ts │ │ │ ├── index.ts │ │ │ ├── josa.en.md │ │ │ ├── josa.ko.md │ │ │ ├── josa.ts │ │ │ └── utils.ts │ │ ├── tsconfig.build.json │ │ ├── tsconfig.esm.json │ │ └── tsconfig.json │ ├── ky │ │ ├── .vscode │ │ │ └── settings.json │ │ ├── CHANGELOG.md │ │ ├── LICENSE │ │ ├── README.ko.md │ │ ├── README.md │ │ ├── babel.config.js │ │ ├── built │ │ │ ├── index.browser.js │ │ │ ├── index.browser.mjs │ │ │ ├── index.server.d.mts │ │ │ ├── index.server.d.ts │ │ │ ├── index.server.js │ │ │ └── index.server.mjs │ │ ├── jest.config.js │ │ ├── jest.setup.ts │ │ ├── package.json │ │ ├── scripts │ │ │ └── build.sh │ │ ├── src │ │ │ ├── index.browser.ts │ │ │ └── index.server.ts │ │ ├── tsconfig.esm.json │ │ ├── tsconfig.json │ │ └── tsup.config.ts │ ├── sentry │ │ ├── .vscode │ │ │ └── settings.json │ │ ├── CHANGELOG.md │ │ ├── LICENSE │ │ ├── README.ko.md │ │ ├── README.md │ │ ├── babel.config.js │ │ ├── jest.config.js │ │ ├── jest.setup.ts │ │ ├── nextjs.d.ts │ │ ├── package.json │ │ ├── src │ │ │ ├── browser │ │ │ │ ├── index.ts │ │ │ │ └── utils │ │ │ │ │ ├── build-sentry.ts │ │ │ │ │ └── get-sentry.ts │ │ │ ├── index.browser.mts │ │ │ ├── index.nextjs.ts │ │ │ ├── index.node.mts │ │ │ ├── index.node.spec.ts │ │ │ ├── index.node.ts │ │ │ ├── testing │ │ │ │ ├── constants.ts │ │ │ │ ├── index.mts │ │ │ │ ├── index.ts │ │ │ │ └── mock.ts │ │ │ └── types.ts │ │ ├── tsconfig.esm.json │ │ └── tsconfig.json │ ├── storage │ │ ├── .vscode │ │ │ └── settings.json │ │ ├── CHANGELOG.md │ │ ├── LICENSE │ │ ├── README.ko.md │ │ ├── README.md │ │ ├── babel.config.js │ │ ├── jest.config.js │ │ ├── package.json │ │ ├── rollup.config.js │ │ ├── scripts │ │ │ └── build.sh │ │ ├── src │ │ │ ├── generateSessionStorage.en.md │ │ │ ├── generateSessionStorage.ko.md │ │ │ ├── generateStorage.en.md │ │ │ ├── generateStorage.ko.md │ │ │ ├── index.ts │ │ │ ├── safeLocalStorage.en.md │ │ │ ├── safeLocalStorage.ko.md │ │ │ ├── safeSessionStorage.en.md │ │ │ ├── safeSessionStorage.ko.md │ │ │ ├── storage.ts │ │ │ └── typed │ │ │ │ ├── createTypedLocalStorage.en.md │ │ │ │ ├── createTypedLocalStorage.ko.md │ │ │ │ ├── createTypedSessionStorage.en.md │ │ │ │ ├── createTypedSessionStorage.ko.md │ │ │ │ ├── factory.spec.ts │ │ │ │ ├── factory.ts │ │ │ │ ├── index.ts │ │ │ │ └── storages │ │ │ │ ├── NumberTypedStorage.en.md │ │ │ │ ├── NumberTypedStorage.ko.md │ │ │ │ ├── NumberTypedStorage.spec.ts │ │ │ │ ├── NumberTypedStorage.ts │ │ │ │ ├── TypedStorage.en.md │ │ │ │ ├── TypedStorage.ko.md │ │ │ │ ├── TypedStorage.spec.ts │ │ │ │ ├── TypedStorage.ts │ │ │ │ └── index.ts │ │ ├── tsconfig.build.json │ │ ├── tsconfig.esm.json │ │ ├── tsconfig.json │ │ └── typed.d.ts │ ├── utility-types │ │ ├── .vscode │ │ │ └── settings.json │ │ ├── CHANGELOG.md │ │ ├── LICENSE │ │ ├── package.json │ │ ├── src │ │ │ ├── Serializable.en.md │ │ │ ├── Serializable.ko.md │ │ │ ├── elementType.en.md │ │ │ ├── elementType.ko.md │ │ │ ├── elementType.ts │ │ │ ├── index.ts │ │ │ └── serializable.ts │ │ ├── tsconfig.build.json │ │ ├── tsconfig.esm.json │ │ └── tsconfig.json │ ├── utils │ │ ├── .npmignore │ │ ├── .vscode │ │ │ └── settings.json │ │ ├── CHANGELOG.md │ │ ├── LICENSE │ │ ├── README.ko.md │ │ ├── README.md │ │ ├── babel.config.js │ │ ├── jest.config.js │ │ ├── package.json │ │ ├── rollup.config.js │ │ ├── src │ │ │ ├── Masker.en.md │ │ │ ├── Masker.ko.md │ │ │ ├── Masker.spec.ts │ │ │ ├── Masker.ts │ │ │ ├── Numbers.spec.ts │ │ │ ├── Numbers.ts │ │ │ ├── Numbers_ceilToUnit.en.md │ │ │ ├── Numbers_ceilToUnit.ko.md │ │ │ ├── Numbers_commaizeNumber.en.md │ │ │ ├── Numbers_commaizeNumber.ko.md │ │ │ ├── Numbers_decommaizeNumber.en.md │ │ │ ├── Numbers_decommaizeNumber.ko.md │ │ │ ├── Numbers_floorAndFormatNumber.en.md │ │ │ ├── Numbers_floorAndFormatNumber.ko.md │ │ │ ├── Numbers_floorToUnit.en.md │ │ │ ├── Numbers_floorToUnit.ko.md │ │ │ ├── Numbers_formatBusinessRegistrationNumber.en.md │ │ │ ├── Numbers_formatBusinessRegistrationNumber.ko.md │ │ │ ├── Numbers_formatPhoneNumber.en.md │ │ │ ├── Numbers_formatPhoneNumber.ko.md │ │ │ ├── Numbers_formatToKRW.en.md │ │ │ ├── Numbers_formatToKRW.ko.md │ │ │ ├── Numbers_formatToKoreanNumber.en.md │ │ │ ├── Numbers_formatToKoreanNumber.ko.md │ │ │ ├── Numbers_roundToUnit.en.md │ │ │ ├── Numbers_roundToUnit.ko.md │ │ │ ├── array │ │ │ │ ├── NonEmptyArray.en.md │ │ │ │ ├── NonEmptyArray.ko.md │ │ │ │ ├── NonEmptyArray.ts │ │ │ │ ├── arrayIncludes.en.md │ │ │ │ ├── arrayIncludes.ko.md │ │ │ │ ├── arrayIncludes.spec.ts │ │ │ │ ├── arrayIncludes.ts │ │ │ │ ├── index.ts │ │ │ │ ├── isDifferentArray.en.md │ │ │ │ ├── isDifferentArray.ko.md │ │ │ │ ├── isDifferentArray.spec.ts │ │ │ │ ├── isDifferentArray.ts │ │ │ │ ├── isNonEmptyArray.en.md │ │ │ │ ├── isNonEmptyArray.ko.md │ │ │ │ ├── isNonEmptyArray.spec.ts │ │ │ │ ├── isNonEmptyArray.ts │ │ │ │ ├── last.en.md │ │ │ │ ├── last.ko.md │ │ │ │ ├── last.spec.ts │ │ │ │ ├── last.ts │ │ │ │ ├── sample.en.md │ │ │ │ ├── sample.ko.md │ │ │ │ ├── sample.spec.ts │ │ │ │ └── sample.ts │ │ │ ├── batchRequestsOf.en.md │ │ │ ├── batchRequestsOf.ko.md │ │ │ ├── batchRequestsOf.spec.ts │ │ │ ├── batchRequestsOf.ts │ │ │ ├── chunk.en.md │ │ │ ├── chunk.ko.md │ │ │ ├── chunk.spec.ts │ │ │ ├── chunk.ts │ │ │ ├── clamp.en.md │ │ │ ├── clamp.ko.md │ │ │ ├── clamp.spec.ts │ │ │ ├── clamp.ts │ │ │ ├── clipboard.en.md │ │ │ ├── clipboard.ko.md │ │ │ ├── clipboard.spec.ts │ │ │ ├── clipboard.ts │ │ │ ├── copyToClipboard.spec.ts │ │ │ ├── copyToClipboard.ts │ │ │ ├── createMapByKey.en.md │ │ │ ├── createMapByKey.ko.md │ │ │ ├── createMapByKey.spec.ts │ │ │ ├── createMapByKey.ts │ │ │ ├── delay.en.md │ │ │ ├── delay.ko.md │ │ │ ├── delay.spec.ts │ │ │ ├── delay.ts │ │ │ ├── device │ │ │ │ ├── getOSByUserAgent.en.md │ │ │ │ ├── getOSByUserAgent.ko.md │ │ │ │ ├── getOSByUserAgent.spec.ts │ │ │ │ ├── getOSByUserAgent.ts │ │ │ │ ├── index.ts │ │ │ │ ├── isAndroid.en.md │ │ │ │ ├── isAndroid.ko.md │ │ │ │ ├── isAndroid.spec.ts │ │ │ │ ├── isAndroid.ts │ │ │ │ ├── isClient.en.md │ │ │ │ ├── isClient.ko.md │ │ │ │ ├── isClient.spec.ts │ │ │ │ ├── isClient.ts │ │ │ │ ├── isIE.en.md │ │ │ │ ├── isIE.ko.md │ │ │ │ ├── isIE.ts │ │ │ │ ├── isIOS.en.md │ │ │ │ ├── isIOS.ko.md │ │ │ │ ├── isIOS.spec.ts │ │ │ │ ├── isIOS.ts │ │ │ │ ├── isMacOS.en.md │ │ │ │ ├── isMacOS.ko.md │ │ │ │ ├── isMacOS.spec.ts │ │ │ │ ├── isMacOS.ts │ │ │ │ ├── isMobileWeb.en.md │ │ │ │ ├── isMobileWeb.ko.md │ │ │ │ ├── isMobileWeb.spec.ts │ │ │ │ ├── isMobileWeb.ts │ │ │ │ ├── isServer.en.md │ │ │ │ ├── isServer.ko.md │ │ │ │ └── isServer.ts │ │ │ ├── difference.en.md │ │ │ ├── difference.ko.md │ │ │ ├── difference.spec.ts │ │ │ ├── difference.ts │ │ │ ├── differenceWith.en.md │ │ │ ├── differenceWith.ko.md │ │ │ ├── escapeHTML.en.md │ │ │ ├── escapeHTML.ko.md │ │ │ ├── escapeHTML.spec.ts │ │ │ ├── escapeHTML.ts │ │ │ ├── generateID.en.md │ │ │ ├── generateID.ko.md │ │ │ ├── generateID.spec.ts │ │ │ ├── generateID.ts │ │ │ ├── get-set.spec.ts │ │ │ ├── get-set.ts │ │ │ ├── get-set_get.en.md │ │ │ ├── get-set_get.ko.md │ │ │ ├── get-set_set.en.md │ │ │ ├── get-set_set.ko.md │ │ │ ├── getScrollDiffFromBottom.en.md │ │ │ ├── getScrollDiffFromBottom.ko.md │ │ │ ├── getScrollDiffFromBottom.spec.ts │ │ │ ├── getScrollDiffFromBottom.ts │ │ │ ├── getScrollPercent.en.md │ │ │ ├── getScrollPercent.ko.md │ │ │ ├── getScrollPercent.spec.ts │ │ │ ├── getScrollPercent.ts │ │ │ ├── getScrollYOffset.en.md │ │ │ ├── getScrollYOffset.ko.md │ │ │ ├── getScrollYOffset.ts │ │ │ ├── getViewportSize.en.md │ │ │ ├── getViewportSize.ko.md │ │ │ ├── getViewportSize.spec.ts │ │ │ ├── getViewportSize.ts │ │ │ ├── groupBy.en.md │ │ │ ├── groupBy.ko.md │ │ │ ├── groupBy.spec.ts │ │ │ ├── groupBy.ts │ │ │ ├── hexToRgba.spec.ts │ │ │ ├── hexToRgba.ts │ │ │ ├── hexToRgba_hexToRgba.en.md │ │ │ ├── hexToRgba_hexToRgba.ko.md │ │ │ ├── hexToRgba_isAlphaValue.en.md │ │ │ ├── hexToRgba_isAlphaValue.ko.md │ │ │ ├── hexToRgba_isRGBDecimalValue.en.md │ │ │ ├── hexToRgba_isRGBDecimalValue.ko.md │ │ │ ├── identity.en.md │ │ │ ├── identity.ko.md │ │ │ ├── identity.spec.ts │ │ │ ├── identity.ts │ │ │ ├── index.ts │ │ │ ├── isNil.en.md │ │ │ ├── isNil.ko.md │ │ │ ├── isNil.spec.ts │ │ │ ├── isNil.ts │ │ │ ├── isNotNil.en.md │ │ │ ├── isNotNil.ko.md │ │ │ ├── isNotNil.spec.ts │ │ │ ├── isNotNil.ts │ │ │ ├── loadScript.en.md │ │ │ ├── loadScript.ko.md │ │ │ ├── loadScript.spec.ts │ │ │ ├── loadScript.ts │ │ │ ├── mapValues.en.md │ │ │ ├── mapValues.ko.md │ │ │ ├── mapValues.spec.ts │ │ │ ├── mapValues.ts │ │ │ ├── maskName.en.md │ │ │ ├── maskName.ko.md │ │ │ ├── maskName.spec.ts │ │ │ ├── maskName.ts │ │ │ ├── maxBy.en.md │ │ │ ├── maxBy.ko.md │ │ │ ├── maxBy.spec.ts │ │ │ ├── maxBy.ts │ │ │ ├── minBy.en.md │ │ │ ├── minBy.ko.md │ │ │ ├── minBy.spec.ts │ │ │ ├── minBy.ts │ │ │ ├── noop.spec.ts │ │ │ ├── noop.ts │ │ │ ├── noop_asyncNoop.en.md │ │ │ ├── noop_asyncNoop.ko.md │ │ │ ├── noop_noop.en.md │ │ │ ├── noop_noop.ko.md │ │ │ ├── object │ │ │ │ ├── index.ts │ │ │ │ ├── object-entries.en.md │ │ │ │ ├── object-entries.ko.md │ │ │ │ ├── object-entries.spec.ts │ │ │ │ ├── object-entries.ts │ │ │ │ ├── object-keys.en.md │ │ │ │ ├── object-keys.ko.md │ │ │ │ ├── object-keys.spec.ts │ │ │ │ ├── object-keys.ts │ │ │ │ ├── object-values.en.md │ │ │ │ ├── object-values.ko.md │ │ │ │ ├── object-values.spec.ts │ │ │ │ ├── object-values.ts │ │ │ │ ├── omit.en.md │ │ │ │ ├── omit.ko.md │ │ │ │ ├── omit.spec.ts │ │ │ │ ├── omit.ts │ │ │ │ ├── pick.en.md │ │ │ │ ├── pick.ko.md │ │ │ │ ├── pick.spec.ts │ │ │ │ └── pick.ts │ │ │ ├── parseName.en.md │ │ │ ├── parseName.ko.md │ │ │ ├── parseName.spec.ts │ │ │ ├── parseName.ts │ │ │ ├── partition.en.md │ │ │ ├── partition.ko.md │ │ │ ├── partition.spec.ts │ │ │ ├── partition.ts │ │ │ ├── queryString.en.md │ │ │ ├── queryString.ko.md │ │ │ ├── queryString.spec.ts │ │ │ ├── queryString.ts │ │ │ ├── range.en.md │ │ │ ├── range.ko.md │ │ │ ├── range.spec.ts │ │ │ ├── range.ts │ │ │ ├── retryRequestOf.en.md │ │ │ ├── retryRequestOf.ko.md │ │ │ ├── retryRequestsOf.spec.ts │ │ │ ├── retryRequestsOf.ts │ │ │ ├── reverseKeyValue.en.md │ │ │ ├── reverseKeyValue.ko.md │ │ │ ├── reverseKeyValue.spec.ts │ │ │ ├── reverseKeyValue.ts │ │ │ ├── safeScrollTo.en.md │ │ │ ├── safeScrollTo.ko.md │ │ │ ├── safeScrollTo.ts │ │ │ ├── scrollRestoration.en.md │ │ │ ├── scrollRestoration.ko.md │ │ │ ├── scrollRestoration.spec.ts │ │ │ ├── scrollRestoration.ts │ │ │ ├── setFocusTimeout.en.md │ │ │ ├── setFocusTimeout.ko.md │ │ │ ├── setFocusTimeout.spec.ts │ │ │ ├── setFocusTimeout.ts │ │ │ ├── shuffle.en.md │ │ │ ├── shuffle.ko.md │ │ │ ├── shuffle.spec.ts │ │ │ ├── shuffle.ts │ │ │ ├── sum.en.md │ │ │ ├── sum.ko.md │ │ │ ├── sum.spec.ts │ │ │ ├── sum.ts │ │ │ ├── toInsuranceAge.spec.ts │ │ │ ├── toInsuranceAge.ts │ │ │ ├── toInternationalAge.spec.ts │ │ │ ├── toInternationalAge.ts │ │ │ ├── uniq.en.md │ │ │ ├── uniq.ko.md │ │ │ ├── uniq.spec.ts │ │ │ ├── uniq.ts │ │ │ ├── uniqBy.en.md │ │ │ ├── uniqBy.ko.md │ │ │ ├── uniqBy.spec.ts │ │ │ ├── uniqBy.ts │ │ │ ├── uniqWith.en.md │ │ │ ├── uniqWith.ko.md │ │ │ ├── uniqWith.spec.ts │ │ │ ├── uniqWith.ts │ │ │ ├── zip.en.md │ │ │ ├── zip.ko.md │ │ │ ├── zip.spec.ts │ │ │ └── zip.ts │ │ ├── tsconfig.build.json │ │ └── tsconfig.json │ └── validators │ │ ├── .vscode │ │ └── settings.json │ │ ├── CHANGELOG.md │ │ ├── LICENSE │ │ ├── babel.config.js │ │ ├── jest.config.js │ │ ├── jest.setup.ts │ │ ├── package.json │ │ ├── rollup.config.js │ │ ├── src │ │ ├── index.ts │ │ └── validators │ │ │ ├── is-age.en.md │ │ │ ├── is-age.ko.md │ │ │ ├── is-age.spec.ts │ │ │ ├── is-age.ts │ │ │ ├── is-birth-date-6.en.md │ │ │ ├── is-birth-date-6.ko.md │ │ │ ├── is-birth-date-6.spec.ts │ │ │ ├── is-birth-date-6.ts │ │ │ ├── is-email.en.md │ │ │ ├── is-email.ko.md │ │ │ ├── is-email.spec.ts │ │ │ ├── is-email.ts │ │ │ ├── is-home-phone.en.md │ │ │ ├── is-home-phone.ko.md │ │ │ ├── is-home-phone.spec.ts │ │ │ ├── is-home-phone.ts │ │ │ ├── is-mobile-phone.en.md │ │ │ ├── is-mobile-phone.ko.md │ │ │ ├── is-mobile-phone.spec.ts │ │ │ ├── is-mobile-phone.ts │ │ │ ├── is-rrn.en.md │ │ │ ├── is-rrn.ko.md │ │ │ ├── is-rrn.spec.ts │ │ │ ├── is-rrn.ts │ │ │ ├── is-사업자번호.en.md │ │ │ ├── is-사업자번호.ko.md │ │ │ ├── is-사업자번호.spec.ts │ │ │ └── is-사업자번호.ts │ │ ├── tsconfig.build.json │ │ ├── tsconfig.esm.json │ │ └── tsconfig.json └── react │ ├── a11y │ ├── .vscode │ │ └── settings.json │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── jest.config.js │ ├── jest.setup.ts │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── ScreenReaderOnly │ │ │ ├── ScreenReaderOnly.spec.tsx │ │ │ ├── ScreenReaderOnly.tsx │ │ │ ├── index.en.md │ │ │ ├── index.ko.md │ │ │ └── index.ts │ │ └── index.ts │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── async-boundary │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── jest.setup.ts │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── AsyncBoundary.en.md │ │ ├── AsyncBoundary.ko.md │ │ ├── AsyncBoundary.tsx │ │ ├── hooks │ │ │ └── useResetError.ts │ │ ├── index.ts │ │ ├── provider │ │ │ ├── AsyncBoundaryProvider.en.md │ │ │ ├── AsyncBoundaryProvider.ko.md │ │ │ └── AsyncBoundaryProvider.tsx │ │ ├── withAsyncBoundary.en.md │ │ ├── withAsyncBoundary.ko.md │ │ └── withAsyncBoundary.tsx │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── async-stylesheet │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── AsyncStylesheet.tsx │ │ ├── index.en.md │ │ ├── index.ko.md │ │ └── index.ts │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── emotion-utils │ ├── .vscode │ │ └── settings.json │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── jest.config.js │ ├── jest.setup.ts │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── FullHeight.spec.tsx │ │ ├── FullHeight.tsx │ │ ├── Fullheight.en.md │ │ ├── Fullheight.ko.md │ │ ├── SafeArea.en.md │ │ ├── SafeArea.ko.md │ │ ├── SafeArea.test.tsx │ │ ├── SafeArea.tsx │ │ ├── Stack.en.md │ │ ├── Stack.ko.md │ │ ├── Stack.test.tsx │ │ ├── Stack.tsx │ │ ├── box-spacing.test.tsx │ │ ├── box-spacing.ts │ │ ├── box-spacing_margin.en.md │ │ ├── box-spacing_margin.ko.md │ │ ├── box-spacing_padding.en.md │ │ ├── box-spacing_padding.ko.md │ │ ├── coerceCssPixelValue.en.md │ │ ├── coerceCssPixelValue.ko.md │ │ ├── coerceCssPixelValue.spec.tsx │ │ ├── coerceCssPixelValue.ts │ │ ├── flex.en.md │ │ ├── flex.ko.md │ │ ├── flex.test.tsx │ │ ├── flex.tsx │ │ ├── gutter.en.md │ │ ├── gutter.ko.md │ │ ├── gutter.test.tsx │ │ ├── gutter.ts │ │ ├── index.ts │ │ ├── mediaQuery.en.md │ │ ├── mediaQuery.ko.md │ │ ├── mediaQuery.ts │ │ ├── spacing.en.md │ │ ├── spacing.ko.md │ │ ├── spacing.spec.tsx │ │ ├── spacing.tsx │ │ ├── types.ts │ │ └── utils │ │ │ ├── block.ts │ │ │ ├── ellipsis.ts │ │ │ ├── height.ts │ │ │ ├── index.ts │ │ │ ├── position.test.tsx │ │ │ ├── position.ts │ │ │ ├── resetAnchor.ts │ │ │ ├── resetButton.ts │ │ │ ├── resetList.ts │ │ │ ├── resetSearchTypeInput.ts │ │ │ ├── safeArea.ts │ │ │ ├── size.ts │ │ │ ├── touchable.ts │ │ │ ├── visuallyHidden.ts │ │ │ └── width.ts │ ├── tsconfig.build.json │ └── tsconfig.json │ ├── error-boundary │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── jest.config.js │ ├── jest.setup.ts │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── ErrorBoundary.en.md │ │ ├── ErrorBoundary.ko.md │ │ ├── ErrorBoundary.spec.tsx │ │ ├── ErrorBoundary.tsx │ │ ├── ErrorBoundaryGroup.en.md │ │ ├── ErrorBoundaryGroup.ko.md │ │ ├── ErrorBoundaryGroup.spec.tsx │ │ ├── ErrorBoundaryGroup.tsx │ │ ├── hooks │ │ │ ├── index.ts │ │ │ ├── useIsChanged.ts │ │ │ └── useKey.ts │ │ ├── index.ts │ │ ├── types │ │ │ └── index.ts │ │ ├── withErrorBoundaryGroup.en.md │ │ ├── withErrorBoundaryGroup.ko.md │ │ └── withErrorBoundaryGroup.tsx │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── framer-motion │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── jest.config.js │ ├── jest.setup.ts │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── index.ts │ │ ├── motion.en.md │ │ ├── motion.ko.md │ │ └── motion.ts │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── impression-area │ ├── .vscode │ │ └── settings.json │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── jest.config.js │ ├── jest.setup.ts │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── ImpressionArea.en.md │ │ ├── ImpressionArea.ko.md │ │ ├── ImpressionArea.spec.tsx │ │ ├── ImpressionArea.tsx │ │ ├── index.ts │ │ ├── testing │ │ │ ├── index.ts │ │ │ ├── mockIntersectionObserver.spec.ts │ │ │ ├── mockIntersectionObserver.ts │ │ │ ├── mockViewport.spec.tsx │ │ │ ├── mockViewport.ts │ │ │ ├── mockVisibility.spec.tsx │ │ │ └── mockVisibility.ts │ │ ├── useImpressionRef.en.md │ │ ├── useImpressionRef.ko.md │ │ └── useImpressionRef.tsx │ ├── testing.d.ts │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── lottie │ ├── .vscode │ │ └── settings.json │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── AnimationChain.ts │ │ ├── AnimationData.ts │ │ ├── AnimationPlayer.ts │ │ ├── Asset.ts │ │ ├── BaseLottie.tsx │ │ ├── Lottie.en.md │ │ ├── Lottie.ko.md │ │ ├── Lottie.tsx │ │ ├── LottieRef.ts │ │ ├── SuspendedLottie.tsx │ │ ├── importLottie.ts │ │ └── index.ts │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── react-query │ ├── .vscode │ │ └── settings.json │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── hooks │ │ │ ├── index.ts │ │ │ ├── useQuery.en.md │ │ │ ├── useQuery.ko.md │ │ │ ├── useQuery.spec.ts │ │ │ ├── useQuery.ts │ │ │ ├── useSuspendedInfiniteQuery.en.md │ │ │ ├── useSuspendedInfiniteQuery.ko.md │ │ │ ├── useSuspendedInfiniteQuery.test-d.ts │ │ │ ├── useSuspendedInfiniteQuery.ts │ │ │ ├── useSuspendedQuery.en.md │ │ │ ├── useSuspendedQuery.ko.md │ │ │ ├── useSuspendedQuery.test-d.ts │ │ │ └── useSuspendedQuery.ts │ │ ├── index.ts │ │ └── utils │ │ │ ├── index.ts │ │ │ ├── isQueryKey │ │ │ └── index.ts │ │ │ └── parseQueryArgs │ │ │ └── index.ts │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── react │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── jest.config.js │ ├── jest.setup.ts │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── components │ │ │ ├── ClickArea │ │ │ │ ├── ClickArea.en.md │ │ │ │ ├── ClickArea.ko.md │ │ │ │ ├── ClickArea.tsx │ │ │ │ ├── index.test.tsx │ │ │ │ └── index.ts │ │ │ ├── DebounceClick │ │ │ │ ├── DebounceClick.en.md │ │ │ │ ├── DebounceClick.ko.md │ │ │ │ ├── DebounceClick.spec.tsx │ │ │ │ ├── DebounceClick.tsx │ │ │ │ └── index.ts │ │ │ ├── HiddenHeading │ │ │ │ ├── HiddenHeading.en.md │ │ │ │ ├── HiddenHeading.ko.md │ │ │ │ ├── HiddenHeading.tsx │ │ │ │ ├── index.spec.tsx │ │ │ │ └── index.ts │ │ │ ├── OpenGraph │ │ │ │ ├── OpenGraph.en.md │ │ │ │ ├── OpenGraph.ko.md │ │ │ │ ├── OpenGraph.tsx │ │ │ │ ├── index.spec.tsx │ │ │ │ └── index.ts │ │ │ ├── OutsideClick │ │ │ │ ├── OutsideClick.en.md │ │ │ │ ├── OutsideClick.ko.md │ │ │ │ ├── OutsideClick.test.tsx │ │ │ │ ├── OutsideClick.tsx │ │ │ │ └── index.ts │ │ │ ├── Separated │ │ │ │ ├── Separated.tsx │ │ │ │ ├── Seperated.en.md │ │ │ │ ├── Seperated.ko.md │ │ │ │ ├── index.spec.tsx │ │ │ │ └── index.ts │ │ │ ├── SwitchCase │ │ │ │ ├── SwitchCase.en.md │ │ │ │ ├── SwitchCase.ko.md │ │ │ │ ├── SwitchCase.tsx │ │ │ │ ├── index.test.tsx │ │ │ │ └── index.tsx │ │ │ └── index.ts │ │ ├── hooks │ │ │ ├── index.ts │ │ │ ├── useBodyClass.en.md │ │ │ ├── useBodyClass.ko.md │ │ │ ├── useBodyClass.spec.ts │ │ │ ├── useBodyClass.ts │ │ │ ├── useBooleanState.en.md │ │ │ ├── useBooleanState.ko.md │ │ │ ├── useBooleanState.spec.ts │ │ │ ├── useBooleanState.ts │ │ │ ├── useCallbackOnce.en.md │ │ │ ├── useCallbackOnce.ko.md │ │ │ ├── useCallbackOnce.spec.tsx │ │ │ ├── useCallbackOnce.ts │ │ │ ├── useCheckList.en.md │ │ │ ├── useCheckList.ko.md │ │ │ ├── useCheckList.spec.ts │ │ │ ├── useCheckList.ts │ │ │ ├── useCombinedRefs.en.md │ │ │ ├── useCombinedRefs.ko.md │ │ │ ├── useCombinedRefs.spec.tsx │ │ │ ├── useCombinedRefs.ts │ │ │ ├── useDebounce.en.md │ │ │ ├── useDebounce.ko.md │ │ │ ├── useDebounce.spec.tsx │ │ │ ├── useDebounce.ts │ │ │ ├── useDidUpdate.en.md │ │ │ ├── useDidUpdate.ko.md │ │ │ ├── useDidUpdate.spec.tsx │ │ │ ├── useDidUpdate.ts │ │ │ ├── useForceUpdate.en.md │ │ │ ├── useForceUpdate.ko.md │ │ │ ├── useForceUpdate.spec.tsx │ │ │ ├── useForceUpdate.ts │ │ │ ├── useHotjarTracker.en.md │ │ │ ├── useHotjarTracker.ko.md │ │ │ ├── useHotjarTracker.ts │ │ │ ├── useInputState.en.md │ │ │ ├── useInputState.ko.md │ │ │ ├── useInputState.spec.ts │ │ │ ├── useInputState.ts │ │ │ ├── useInterval.en.md │ │ │ ├── useInterval.ko.md │ │ │ ├── useInterval.spec.tsx │ │ │ ├── useInterval.ts │ │ │ ├── useIsMounted.en.md │ │ │ ├── useIsMounted.ko.md │ │ │ ├── useIsMounted.spec.tsx │ │ │ ├── useIsMounted.ts │ │ │ ├── useIsMountedRef.en.md │ │ │ ├── useIsMountedRef.ko.md │ │ │ ├── useIsMountedRef.spec.ts │ │ │ ├── useIsMountedRef.ts │ │ │ ├── useIsomorphicLayoutEffect.en.md │ │ │ ├── useIsomorphicLayoutEffect.ko.md │ │ │ ├── useIsomorphicLayoutEffect.ts │ │ │ ├── useLiveAnnouncer.en.md │ │ │ ├── useLiveAnnouncer.ko.md │ │ │ ├── useLiveAnnouncer.ts │ │ │ ├── useLocalStorageChangeDetector.en.md │ │ │ ├── useLocalStorageChangeDetector.ko.md │ │ │ ├── useLocalStorageChangeDetector.spec.tsx │ │ │ ├── useLocalStorageChangeDetector.ts │ │ │ ├── useOutsideClickEffect.en.md │ │ │ ├── useOutsideClickEffect.ko.md │ │ │ ├── useOutsideClickEffect.spec.tsx │ │ │ ├── useOutsideClickEffect.ts │ │ │ ├── usePreservedCallback.en.md │ │ │ ├── usePreservedCallback.ko.md │ │ │ ├── usePreservedCallback.spec.ts │ │ │ ├── usePreservedCallback.ts │ │ │ ├── usePreservedReference.en.md │ │ │ ├── usePreservedReference.ko.md │ │ │ ├── usePreservedReference.spec.tsx │ │ │ ├── usePreservedReference.ts │ │ │ ├── usePrevious.en.md │ │ │ ├── usePrevious.ko.md │ │ │ ├── usePrevious.spec.ts │ │ │ ├── usePrevious.ts │ │ │ ├── useRefEffect.en.md │ │ │ ├── useRefEffect.ko.md │ │ │ ├── useRefEffect.spec.tsx │ │ │ ├── useRefEffect.ts │ │ │ ├── useResizeObserver.en.md │ │ │ ├── useResizeObserver.ko.md │ │ │ ├── useResizeObserver.ts │ │ │ ├── useStorageState.en.md │ │ │ ├── useStorageState.ko.md │ │ │ ├── useStorageState.spec.ts │ │ │ ├── useStorageState.ts │ │ │ ├── useStyleSheetInjection.en.md │ │ │ ├── useStyleSheetInjection.ko.md │ │ │ ├── useStyleSheetInjection.ts │ │ │ ├── useThrottle.en.md │ │ │ ├── useThrottle.ko.md │ │ │ ├── useThrottle.ts │ │ │ ├── useTimeout.en.md │ │ │ ├── useTimeout.ko.md │ │ │ ├── useTimeout.spec.tsx │ │ │ ├── useTimeout.ts │ │ │ ├── useTimeoutQueue.en.md │ │ │ ├── useTimeoutQueue.ko.md │ │ │ ├── useTimeoutQueue.spec.ts │ │ │ ├── useTimeoutQueue.ts │ │ │ ├── useToggleState.en.md │ │ │ ├── useToggleState.ko.md │ │ │ ├── useToggleState.spec.tsx │ │ │ ├── useToggleState.ts │ │ │ ├── useVisibilityEvent.en.md │ │ │ ├── useVisibilityEvent.ko.md │ │ │ ├── useVisibilityEvent.spec.tsx │ │ │ └── useVisibilityEvent.ts │ │ ├── index.ts │ │ └── utils │ │ │ ├── Style.test.tsx │ │ │ ├── Style.tsx │ │ │ ├── buildContext.en.md │ │ │ ├── buildContext.ko.md │ │ │ ├── buildContext.test.tsx │ │ │ ├── buildContext.tsx │ │ │ ├── convertNewlineToJSX.en.md │ │ │ ├── convertNewlineToJSX.ko.md │ │ │ ├── convertNewlineToJSX.test.tsx │ │ │ ├── convertNewlineToJSX.tsx │ │ │ └── index.ts │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── recoil │ ├── .vscode │ │ └── settings.json │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── jest.config.js │ ├── jest.setup.ts │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── index.ts │ │ └── utils │ │ │ ├── clearRecoilCache.en.md │ │ │ ├── clearRecoilCache.ko.md │ │ │ ├── clearRecoilCache.spec.tsx │ │ │ ├── clearRecoilCache.ts │ │ │ └── index.ts │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── redirect │ ├── .vscode │ │ └── settings.json │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── jest.config.js │ ├── jest.setup.ts │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── base │ │ │ ├── boundary │ │ │ │ ├── RedirectionBoundary.en.md │ │ │ │ ├── RedirectionBoundary.ko.md │ │ │ │ ├── RedirectionBoundary.tsx │ │ │ │ ├── index.test.tsx │ │ │ │ └── index.ts │ │ │ ├── index.ts │ │ │ └── model │ │ │ │ ├── Redirection.en.md │ │ │ │ ├── Redirection.ko.md │ │ │ │ ├── Redirection.ts │ │ │ │ └── index.ts │ │ └── index.ts │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── scroll-animation │ ├── CHANGELOG.md │ ├── LICENSE │ ├── README.ko.md │ ├── README.md │ ├── babel.config.js │ ├── jest.config.js │ ├── jest.setup.ts │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── components │ │ │ ├── ScrollProgressController.tsx │ │ │ ├── ScrollRevealAnimation.tsx │ │ │ └── index.ts │ │ ├── contexts │ │ │ ├── ScrollProgressContext.ts │ │ │ └── index.ts │ │ ├── hooks │ │ │ ├── index.ts │ │ │ ├── useScrollEventListener.ts │ │ │ ├── useScrollProgress.ts │ │ │ └── useWindowScrollPosition.ts │ │ ├── index.ts │ │ ├── types │ │ │ ├── WindowScrollPosition.ts │ │ │ └── index.ts │ │ └── utils │ │ │ ├── clipProgress.ts │ │ │ ├── getValueWithoutUnit.ts │ │ │ ├── index.ts │ │ │ └── sliceProgress.ts │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── use-funnel │ ├── .vscode │ │ └── settings.json │ ├── CHANGELOG.md │ ├── LICENSE │ ├── README.ko.md │ ├── README.md │ ├── babel.config.js │ ├── jest.config.js │ ├── jest.setup.ts │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── Funnel.tsx │ │ ├── index.ts │ │ ├── models.ts │ │ ├── useFunnel.spec.tsx │ │ └── useFunnel.tsx │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── use-loading │ ├── .vscode │ │ └── settings.json │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── jest.config.js │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── index.ts │ │ ├── useLoading.en.md │ │ ├── useLoading.ko.md │ │ ├── useLoading.spec.ts │ │ └── useLoading.ts │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ ├── use-overlay │ ├── .npmignore │ ├── CHANGELOG.md │ ├── LICENSE │ ├── babel.config.js │ ├── jest.config.js │ ├── jest.setup.js │ ├── package.json │ ├── rollup.config.js │ ├── src │ │ ├── OverlayController.tsx │ │ ├── OverlayProvider.tsx │ │ ├── index.ts │ │ ├── tests │ │ │ ├── close-reference.spec.tsx │ │ │ ├── exit.spec.tsx │ │ │ ├── options.spec.tsx │ │ │ └── utils.tsx │ │ ├── types.tsx │ │ ├── useOverlay.en.md │ │ ├── useOverlay.ko.md │ │ └── useOverlay.tsx │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json │ └── use-query-param │ ├── CHANGELOG.md │ ├── LICENSE │ ├── README.ko.md │ ├── README.md │ ├── babel.config.js │ ├── jest.config.js │ ├── jest.setup.ts │ ├── package.json │ ├── rollup.config.js │ ├── src │ ├── hooks │ │ ├── index.ts │ │ ├── useNextRouter.en.md │ │ ├── useNextRouter.ko.md │ │ ├── useNextRouter.spec.ts │ │ ├── useNextRouter.ts │ │ ├── useQueryParam.en.md │ │ ├── useQueryParam.ko.md │ │ ├── useQueryParam.spec.ts │ │ ├── useQueryParam.ts │ │ ├── useQueryParams.en.md │ │ ├── useQueryParams.ko.md │ │ ├── useQueryParams.spec.ts │ │ └── useQueryParams.ts │ ├── index.ts │ └── utils │ │ ├── index.ts │ │ ├── renderWithSuspense.tsx │ │ └── waitForRouterReady.ts │ ├── tsconfig.build.json │ ├── tsconfig.esm.json │ └── tsconfig.json ├── tsconfig.build.json ├── tsconfig.eslint.json ├── tsconfig.esm.json ├── tsconfig.json └── yarn.lock /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | end_of_line = lf 5 | insert_final_newline = true 6 | 7 | [*.{js,json,yml}] 8 | charset = utf-8 9 | indent_style = space 10 | indent_size = 2 11 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | dist 2 | esm 3 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | # Force git to use LF 2 | * text=auto eol=lf 3 | 4 | # Mark .pnp.* files as binary to prevent git from trying to merge them 5 | /.pnp.* binary linguist-generated 6 | 7 | # Hide .yarn and docs from GitHub's language detection 8 | /.yarn/** linguist-vendored 9 | /docs/** linguist-documentation 10 | -------------------------------------------------------------------------------- /.github/CODEOWNERS: -------------------------------------------------------------------------------- 1 | # global reviewers 2 | @raon0211 @evan-moon @BasixKOR 3 | 4 | # @toss/hangul reviewers 5 | /packages/common/hangul @okinawaa 6 | 7 | -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | ## Overview 2 | 3 | 6 | 7 | ## PR Checklist 8 | 9 | - [ ] I read and included theses actions below 10 | 11 | 1. I have read the [Contributing Guide](https://github.com/toss/slash/blob/main/.github/CONTRIBUTING.md) 12 | 2. I have written documents and tests, if needed. 13 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .yarn/* 2 | !.yarn/patches 3 | !.yarn/plugins 4 | !.yarn/releases 5 | !.yarn/sdks 6 | !.yarn/versions 7 | 8 | # Swap the comments on the following lines if you don't wish to use zero-installs 9 | # Documentation here: https://yarnpkg.com/features/zero-installs 10 | !.yarn/cache 11 | #.pnp.* 12 | 13 | dist 14 | esm 15 | 16 | *.tsbuildinfo 17 | *.tgz 18 | *.map 19 | *.log 20 | *.DS_Store 21 | 22 | node_modules 23 | junit.xml 24 | *.tossdocs.md 25 | coverage -------------------------------------------------------------------------------- /.nvmrc: -------------------------------------------------------------------------------- 1 | 18 2 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "arrowParens": "avoid", 3 | "bracketSameLine": false, 4 | "bracketSpacing": true, 5 | "endOfLine": "lf", 6 | "jsxSingleQuote": false, 7 | "printWidth": 120, 8 | "proseWrap": "preserve", 9 | "quoteProps": "as-needed", 10 | "semi": true, 11 | "singleQuote": true, 12 | "tabWidth": 2, 13 | "trailingComma": "es5" 14 | } -------------------------------------------------------------------------------- /.scripts/check-peer.sh: -------------------------------------------------------------------------------- 1 | OUT=$(yarn | grep -E "(YN0002|YN0059|YN0060)" | grep -E $1) 2 | if [ -z "$OUT" ]; then 3 | echo "No Peer Dependency Errors Found." 4 | else 5 | echo "$OUT" 6 | echo "Some peer dependencies are incorrectly met; run yarn explain peer-requirements for details, where is the six-letter p-prefixed code" 7 | exit 1 8 | fi 9 | -------------------------------------------------------------------------------- /.vscode/extensions.json: -------------------------------------------------------------------------------- 1 | { 2 | "recommendations": [ 3 | "arcanis.vscode-zipfs", 4 | "dbaeumer.vscode-eslint", 5 | "esbenp.prettier-vscode" 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /.yarn/sdks/eslint/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "eslint", 3 | "version": "7.32.0-sdk", 4 | "main": "./lib/api.js", 5 | "type": "commonjs", 6 | "bin": { 7 | "eslint": "./bin/eslint.js" 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /.yarn/sdks/integrations.yml: -------------------------------------------------------------------------------- 1 | # This file is automatically generated by @yarnpkg/sdks. 2 | # Manual changes might be lost! 3 | 4 | integrations: 5 | - vscode 6 | -------------------------------------------------------------------------------- /.yarn/sdks/prettier/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "prettier", 3 | "version": "2.7.1-sdk", 4 | "main": "./index.js", 5 | "type": "commonjs", 6 | "bin": "./bin-prettier.js" 7 | } 8 | -------------------------------------------------------------------------------- /.yarn/sdks/typescript/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "typescript", 3 | "version": "4.7.4-sdk", 4 | "main": "./lib/typescript.js", 5 | "type": "commonjs", 6 | "bin": { 7 | "tsc": "./bin/tsc", 8 | "tsserver": "./bin/tsserver" 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /.yarnrc: -------------------------------------------------------------------------------- 1 | yarn-path: .yarn/releases/yarn-3.2.3.cjs 2 | -------------------------------------------------------------------------------- /configs/jest/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | ## 0.2.1 (2024-10-24) 7 | 8 | **Note:** Version bump only for package @toss/jest 9 | -------------------------------------------------------------------------------- /configs/jest/src/index.js: -------------------------------------------------------------------------------- 1 | const config = require('./config'); 2 | 3 | module.exports = { config }; 4 | -------------------------------------------------------------------------------- /docs/.gitignore: -------------------------------------------------------------------------------- 1 | # Dependencies 2 | /node_modules 3 | 4 | # Built docs 5 | /docs 6 | 7 | # Production 8 | /build 9 | 10 | # Generated files 11 | .docusaurus 12 | .cache-loader 13 | 14 | # Misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | .yarn 25 | -------------------------------------------------------------------------------- /docs/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [require.resolve('@docusaurus/core/lib/babel/preset')], 3 | }; 4 | -------------------------------------------------------------------------------- /docs/i18n/en/docusaurus-plugin-content-blog/options.json: -------------------------------------------------------------------------------- 1 | { 2 | "title": { 3 | "message": "Blog", 4 | "description": "The title for the blog used in SEO" 5 | }, 6 | "description": { 7 | "message": "Blog", 8 | "description": "The description for the blog used in SEO" 9 | }, 10 | "sidebar.title": { 11 | "message": "Recent posts", 12 | "description": "The label for the left sidebar" 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /docs/i18n/en/docusaurus-theme-classic/navbar.json: -------------------------------------------------------------------------------- 1 | { 2 | "title": { 3 | "message": "Slash libraries", 4 | "description": "The title in the navbar" 5 | }, 6 | "item.label.Docs": { 7 | "message": "Docs", 8 | "description": "Navbar item with label Docs" 9 | }, 10 | "item.label.GitHub": { 11 | "message": "GitHub", 12 | "description": "Navbar item with label GitHub" 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /docs/i18n/ko/docusaurus-plugin-content-blog/options.json: -------------------------------------------------------------------------------- 1 | { 2 | "title": { 3 | "message": "블로그", 4 | "description": "The title for the blog used in SEO" 5 | }, 6 | "description": { 7 | "message": "블로그", 8 | "description": "The description for the blog used in SEO" 9 | }, 10 | "sidebar.title": { 11 | "message": "새로운 글", 12 | "description": "The label for the left sidebar" 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /docs/i18n/ko/docusaurus-plugin-content-docs/.gitignore: -------------------------------------------------------------------------------- 1 | *.md 2 | -------------------------------------------------------------------------------- /docs/i18n/ko/docusaurus-theme-classic/navbar.json: -------------------------------------------------------------------------------- 1 | { 2 | "title": { 3 | "message": "Slash 라이브러리", 4 | "description": "The title in the navbar" 5 | }, 6 | "item.label.Docs": { 7 | "message": "문서", 8 | "description": "Navbar item with label Docs" 9 | }, 10 | "item.label.GitHub": { 11 | "message": "GitHub", 12 | "description": "Navbar item with label GitHub" 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /docs/scripts/build-docs/constants.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | 3 | export const PROJECT_ROOT = path.resolve(__dirname, '..', '..', '..'); 4 | export const PACKAGES_ROOT = path.resolve(PROJECT_ROOT, 'packages'); 5 | export const DOCUSAURUS_ROOT = path.resolve(PROJECT_ROOT, 'docs'); 6 | export const DOCS_ROOT = path.resolve(DOCUSAURUS_ROOT, 'docs'); 7 | -------------------------------------------------------------------------------- /docs/scripts/build-docs/index.ts: -------------------------------------------------------------------------------- 1 | import { generateDocsFromJSDoc } from './generate-docs-from-jsdoc'; 2 | import { generateDocsFromMD } from './generate-docs-from-md'; 3 | 4 | async function main() { 5 | await Promise.all([generateDocsFromJSDoc(), generateDocsFromMD()]); 6 | } 7 | 8 | main().catch(error => { 9 | console.error(error.stack); 10 | process.exit(1); 11 | }); 12 | -------------------------------------------------------------------------------- /docs/static/banner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/toss/slash/570759f2edbc9c6f413cb2ee6ab828073f61402a/docs/static/banner.png -------------------------------------------------------------------------------- /docs/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.build.json", 3 | "include": ["scripts", "pages"] 4 | } 5 | -------------------------------------------------------------------------------- /lerna.json: -------------------------------------------------------------------------------- 1 | { 2 | "version": "independent", 3 | "npmClient": "yarn", 4 | "useWorkspaces": true, 5 | "command": { 6 | "version": { 7 | "message": "chore(release): Publish libraries [skip ci]", 8 | "registry": "https://registry.npmjs.org/" 9 | }, 10 | "publish": { 11 | "graphType": "all", 12 | "registry": "https://registry.npmjs.org/" 13 | } 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /netlify.toml: -------------------------------------------------------------------------------- 1 | [build] 2 | publish = "docs/build" 3 | command = "cd docs && yarn prepare:docs && yarn build" 4 | 5 | [build.environment] 6 | NETLIFY_USE_YARN="true" 7 | -------------------------------------------------------------------------------- /packages/common/assert/.npmignore: -------------------------------------------------------------------------------- 1 | *.md 2 | -------------------------------------------------------------------------------- /packages/common/assert/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/common/assert/jest.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-var-requires */ 2 | module.exports = require('@toss/jest').config({ 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/common/assert/jest.setup.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/toss/slash/570759f2edbc9c6f413cb2ee6ab828073f61402a/packages/common/assert/jest.setup.ts -------------------------------------------------------------------------------- /packages/common/assert/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/common/assert/src/assert.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export function assert(condition: unknown, error: Error | string = new Error()): asserts condition { 3 | if (!condition) { 4 | if (typeof error === 'string') { 5 | throw new Error(error); 6 | } else { 7 | throw error; 8 | } 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /packages/common/assert/src/assertNonEmptyArray.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { NonEmptyArray } from '@toss/utils'; 3 | 4 | export function assertNonEmptyArray( 5 | arr: T[], 6 | error: Error | string = new Error('AssertionError: EmptyArray') 7 | ): asserts arr is NonEmptyArray { 8 | if (arr.length < 1) { 9 | if (typeof error === 'string') { 10 | throw new Error(error); 11 | } else { 12 | throw error; 13 | } 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /packages/common/assert/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './assert'; 3 | export * from './assertNonEmptyArray'; 4 | -------------------------------------------------------------------------------- /packages/common/assert/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/assert/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/assert/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/crypto/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/common/crypto/jest.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-var-requires */ 2 | module.exports = require('@toss/jest').config({ 3 | testEnvironment: 'node', 4 | rootDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/common/crypto/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/common/crypto/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './pkcs1'; 3 | export * from './utils'; 4 | -------------------------------------------------------------------------------- /packages/common/crypto/src/pkcs1/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './encrypt'; 3 | -------------------------------------------------------------------------------- /packages/common/crypto/src/utils.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export function byteToHex(encrypted: Uint8Array) { 3 | return Array.from(encrypted) 4 | .map(x => x.toString(16).padStart(2, '0')) 5 | .join(''); 6 | } 7 | -------------------------------------------------------------------------------- /packages/common/crypto/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/crypto/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/date/README.ko.md: -------------------------------------------------------------------------------- 1 | # @toss/date 2 | 3 | Date 연산 유틸들을 제공하는 라이브러리입니다. 4 | 5 | `date-fns` 라이브러리에 기반합니다. 6 | -------------------------------------------------------------------------------- /packages/common/date/README.md: -------------------------------------------------------------------------------- 1 | # @toss/date 2 | 3 | A library which provides `Date` calculation functions. It is based on the `date-fns` library. 4 | -------------------------------------------------------------------------------- /packages/common/date/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/common/date/jest.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-var-requires */ 2 | module.exports = require('@toss/jest').config({ 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/common/date/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/common/date/src/docs/DateFnsDateType.en.md: -------------------------------------------------------------------------------- 1 | # DateFnsDateType 2 | 3 | A `Date` type which is used in the `date-fns` library. (`number | Date`) 4 | -------------------------------------------------------------------------------- /packages/common/date/src/docs/DateFnsDateType.ko.md: -------------------------------------------------------------------------------- 1 | # DateFnsDateType 2 | 3 | `date-fns` 라이브러리에서 사용하는 `Date`의 타입입니다. (`number | Date`) 4 | -------------------------------------------------------------------------------- /packages/common/date/src/docs/parseYYYYMMDD.en.md: -------------------------------------------------------------------------------- 1 | # parseYYYYMMDD 2 | 3 | Converts a string to a date. If the conversion failed, it throws `new Error('Invalid date format')`. 4 | 5 | ## Example 6 | 7 | ```typescript 8 | parseYYYYMMDD('2022-09-10'); 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/date/src/docs/parseYYYYMMDD.ko.md: -------------------------------------------------------------------------------- 1 | # parseYYYYMMDD 2 | 3 | 입력받은 문자열을 Date로 변환합니다. Date로 바꾸는데 실패할 경우, `new Error('Invalid date format')` 을 throw 합니다. 4 | 5 | ## Example 6 | 7 | ```typescript 8 | parseYYYYMMDD('2022-09-10'); 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/date/src/docs/roundUpHoursInDays.en.md: -------------------------------------------------------------------------------- 1 | # roundUpHoursInDays 2 | 3 | Rounds up hours by the unit of `24` (one day, 24 hours). 4 | 5 | ## Example 6 | 7 | ```typescript 8 | roundUpHoursInDays(48); // 48 9 | roundUpHoursInDays(35); // 48 10 | roundUpHoursInDays(8); // 24 11 | roundUpHoursInDays(0); // 0 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/common/date/src/docs/roundUpHoursInDays.ko.md: -------------------------------------------------------------------------------- 1 | # roundUpHoursInDays 2 | 3 | 24시간 단위로 올림합니다. 4 | 5 | ## Example 6 | 7 | ```typescript 8 | roundUpHoursInDays(48); // 48 9 | roundUpHoursInDays(35); // 48 10 | roundUpHoursInDays(8); // 24 11 | roundUpHoursInDays(0); // 0 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/common/date/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './date'; 3 | -------------------------------------------------------------------------------- /packages/common/date/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/date/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/date/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/hangul/.npmignore: -------------------------------------------------------------------------------- 1 | *.md 2 | -------------------------------------------------------------------------------- /packages/common/hangul/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "eslint.nodePath": "../../../.yarn/sdks", 3 | "prettier.prettierPath": "../../../.yarn/sdks/prettier/index.js", 4 | "typescript.tsdk": "../../../.yarn/sdks/typescript/lib", 5 | "typescript.enablePromptUseWorkspaceTsdk": true, 6 | "search.exclude": { 7 | "**/.yarn": true, 8 | "**/.pnp.*": true, 9 | "**/.next": true 10 | }, 11 | "prettier.configPath": "../../../.prettierrc" 12 | } 13 | -------------------------------------------------------------------------------- /packages/common/hangul/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/common/hangul/jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('@toss/jest').config({ 2 | testEnvironment: 'jsdom', 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/common/hangul/jest.setup.ts: -------------------------------------------------------------------------------- 1 | import '@testing-library/jest-dom'; 2 | -------------------------------------------------------------------------------- /packages/common/hangul/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/common/hangul/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './disassemble'; 3 | export * from './hangulIncludes'; 4 | export * from './chosungIncludes'; 5 | export * from './josa'; 6 | export * from './utils'; 7 | -------------------------------------------------------------------------------- /packages/common/hangul/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/hangul/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "module": "esnext", 5 | "outDir": "./esm" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /packages/common/hangul/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "target": "es6", 5 | "module": "commonjs", 6 | "declaration": true, 7 | "noUncheckedIndexedAccess": true, 8 | "outDir": "./dist" 9 | }, 10 | "include": ["src"], 11 | "exclude": ["jest.setup.ts"] 12 | } 13 | -------------------------------------------------------------------------------- /packages/common/ky/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "eslint.nodePath": "../../../.yarn/sdks", 3 | "prettier.prettierPath": "../../../.yarn/sdks/prettier/index.js", 4 | "typescript.tsdk": "../../../.yarn/sdks/typescript/lib", 5 | "typescript.enablePromptUseWorkspaceTsdk": true, 6 | "search.exclude": { 7 | "**/.yarn": true, 8 | "**/.pnp.*": true, 9 | "**/.next": true 10 | }, 11 | "prettier.configPath": "../../../.prettierrc" 12 | } 13 | -------------------------------------------------------------------------------- /packages/common/ky/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/common/ky/built/index.server.d.mts: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | 3 | export * from "ky"; 4 | export { default } from "ky"; 5 | -------------------------------------------------------------------------------- /packages/common/ky/built/index.server.d.ts: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | 3 | import ky__default from 'ky'; 4 | export * from 'ky'; 5 | export { default } from 'ky'; 6 | 7 | /** 8 | * NOTE(@raon0211): 9 | * ky-universal은 top-level await을 사용하고 있어서 바로 CJS로 변환할 수 없습니다. 10 | * 이에 어쩔 수 없이 index.server.ts 파일을 별도로 만들고, ky-universal의 구현을 require() 만 쓰도록 하여 옮겨옵니다. 11 | * 12 | * @see https://github.com/sindresorhus/ky-universal/blob/main/index.js#L30 13 | */ 14 | -------------------------------------------------------------------------------- /packages/common/ky/jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('@toss/jest').config({ 2 | testEnvironment: 'jsdom', 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/common/ky/jest.setup.ts: -------------------------------------------------------------------------------- 1 | import '@testing-library/jest-dom'; 2 | -------------------------------------------------------------------------------- /packages/common/ky/scripts/build.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | 3 | tsup ./src/*.ts --clean 4 | 5 | echo -e 'export * from "ky";\nexport { default } from "ky";' > ./built/index.server.d.mts 6 | 7 | for f in ./built/*; do 8 | contents=$(cat $f) 9 | echo -e "/* eslint-disable */\n" > $f 10 | echo "$contents" >> $f 11 | done 12 | -------------------------------------------------------------------------------- /packages/common/ky/src/index.browser.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /* eslint-disable @typescript-eslint/ban-ts-comment */ 3 | // @ts-ignore 4 | import ky from 'ky'; 5 | // @ts-ignore 6 | export * from 'ky'; 7 | export default ky; 8 | -------------------------------------------------------------------------------- /packages/common/ky/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/ky/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./built" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/sentry/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "eslint.nodePath": "../../../.yarn/sdks", 3 | "prettier.prettierPath": "../../../.yarn/sdks/prettier/index.js", 4 | "typescript.tsdk": "../../../.yarn/sdks/typescript/lib", 5 | "typescript.enablePromptUseWorkspaceTsdk": true, 6 | "search.exclude": { 7 | "**/.yarn": true, 8 | "**/.pnp.*": true, 9 | "**/.next": true 10 | }, 11 | "prettier.configPath": "../../../.prettierrc" 12 | } 13 | -------------------------------------------------------------------------------- /packages/common/sentry/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/common/sentry/jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('@toss/jest').config({ 2 | rootDir: __dirname, 3 | }); 4 | -------------------------------------------------------------------------------- /packages/common/sentry/jest.setup.ts: -------------------------------------------------------------------------------- 1 | require('./src/testing').useFakeSentry(); 2 | -------------------------------------------------------------------------------- /packages/common/sentry/nextjs.d.ts: -------------------------------------------------------------------------------- 1 | export * from './dist/index.nextjs'; 2 | -------------------------------------------------------------------------------- /packages/common/sentry/src/browser/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { buildSentry } from './utils/build-sentry.js'; 3 | 4 | export const Sentry = buildSentry(); 5 | -------------------------------------------------------------------------------- /packages/common/sentry/src/browser/utils/get-sentry.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { Sentry } from '../../types.js'; 3 | 4 | declare const window: Window & { 5 | Sentry?: Sentry; 6 | }; 7 | 8 | export function getSentry() { 9 | if (window.Sentry == null && process.env.NODE_ENV !== 'production') { 10 | console.warn( 11 | `window에 Sentry 객체가 없습니다. toss-frontend에서 Next.js로 개발하고 계시다면, _document.tsx에서 TossDocument를 사용하고 있는지 확인해주세요.` 12 | ); 13 | } 14 | 15 | return window.Sentry; 16 | } 17 | -------------------------------------------------------------------------------- /packages/common/sentry/src/index.browser.mts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export { Sentry } from './browser/index.js'; 3 | -------------------------------------------------------------------------------- /packages/common/sentry/src/index.nextjs.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import * as Sentry from '@sentry/nextjs'; 3 | 4 | const withSentryConfig = Sentry.withSentryConfig; 5 | 6 | export { Sentry, withSentryConfig }; 7 | -------------------------------------------------------------------------------- /packages/common/sentry/src/index.node.mts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import * as Sentry from '@sentry/node'; 3 | 4 | export { Sentry }; 5 | -------------------------------------------------------------------------------- /packages/common/sentry/src/index.node.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import * as Sentry from '@sentry/node'; 3 | 4 | export { Sentry }; 5 | -------------------------------------------------------------------------------- /packages/common/sentry/src/testing/constants.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export const FAKE_DSN = 'https://79d2d2708531404999a445044c504814@o89496.ingest.sentry.io/1330329'; 3 | -------------------------------------------------------------------------------- /packages/common/sentry/src/testing/index.mts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './mock.js'; 3 | export * from './constants.js'; 4 | -------------------------------------------------------------------------------- /packages/common/sentry/src/testing/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './mock'; 3 | export * from './constants'; 4 | -------------------------------------------------------------------------------- /packages/common/sentry/src/types.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import * as SentryType from '@sentry/browser'; 3 | 4 | export type Sentry = typeof SentryType; 5 | -------------------------------------------------------------------------------- /packages/common/sentry/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/sentry/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/storage/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "eslint.nodePath": "../../../.yarn/sdks", 3 | "prettier.prettierPath": "../../../.yarn/sdks/prettier/index.js", 4 | "typescript.tsdk": "../../../.yarn/sdks/typescript/lib", 5 | "typescript.enablePromptUseWorkspaceTsdk": true, 6 | "search.exclude": { 7 | "**/.yarn": true, 8 | "**/.pnp.*": true, 9 | "**/.next": true 10 | }, 11 | "prettier.configPath": "../../../.prettierrc" 12 | } 13 | -------------------------------------------------------------------------------- /packages/common/storage/README.ko.md: -------------------------------------------------------------------------------- 1 | # @toss/storage 2 | 3 | 브라우저의 시크릿 모드나 테스트 환경과 같이 Web Storage를 쓸 수 없는 환경에서 `localStorage`나 `sessionStorage` 등에 접근하려고 하면 에러가 발생합니다. 4 | 5 | `@toss/storage` 패키지는 그런 환경에서도 에러 없이 Web Storage를 쓸 수 있도록 돕는 라이브러리입니다. `@toss/storage/typed`를 쓰면 타입 안전하게 스토리지의 값을 다룰 수 있습니다. 6 | -------------------------------------------------------------------------------- /packages/common/storage/README.md: -------------------------------------------------------------------------------- 1 | # @toss/storage 2 | 3 | Web Storage is not available in some browser's incognito mode, test environment, etc. When you access `window.localStorage` or `window.sessionStorage` in one of those cases, an error would be thrown. 4 | 5 | A library `@toss/storage` provides a safe Web Storage accessor for those cases. And a subpath exported module `@toss/storage/typed` makes Web Storage type-safe. 6 | -------------------------------------------------------------------------------- /packages/common/storage/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/common/storage/jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('@toss/jest').config({ 2 | testEnvironment: 'jsdom', 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/common/storage/src/generateStorage.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: generateStorage 3 | --- 4 | 5 | # generateStorage 6 | 7 | Generates a safe local storage accessor. If `window.localStorage` isn't available, generates in-memory local storage. 8 | 9 | ## Example 10 | 11 | ```typescript 12 | import { generateStorage } from '@toss/storage'; 13 | 14 | const safeLocalStorage = generateStorage(); 15 | 16 | safeLocalStorage.set('key', 'value'); 17 | 18 | safeLocalStorage.get('key'); // 'value' 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/storage/src/generateStorage.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: generateStorage 3 | --- 4 | 5 | # generateStorage 6 | 7 | 안전한 local storage accessor를 생성합니다. local storage를 사용할 수 없는 환경인 경우, inmemory storage를 생성합니다. 8 | 9 | ## Examples 10 | 11 | ```typescript 12 | import { generateStorage } from '@toss/storage'; 13 | 14 | const safeLocalStorage = generateStorage(); 15 | 16 | safeLocalStorage.set('key', 'value'); 17 | 18 | safeLocalStorage.get('key'); // 'value' 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/storage/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './storage'; 3 | -------------------------------------------------------------------------------- /packages/common/storage/src/safeLocalStorage.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: safeLocalStorage 3 | --- 4 | 5 | # safeLocalStorage 6 | 7 | A local storage accessor generated by [generateStorage](https://slash.page/libraries/common/storage/src/generatestorage.i18n). 8 | 9 | ## Examples 10 | 11 | ```typescript 12 | import { safeLocalStorage } from '@toss/storage'; 13 | 14 | safeLocalStorage.set('key', 'value'); 15 | 16 | safeLocalStorage.get('key'); // 'value' 17 | ``` 18 | -------------------------------------------------------------------------------- /packages/common/storage/src/safeLocalStorage.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: safeLocalStorage 3 | --- 4 | 5 | # safeLocalStorage 6 | 7 | [generateStorage](https://slash.page/ko/libraries/common/storage/src/generateStorage.i18n)로 생성된 local storage accessor 입니다. 8 | 9 | ## Examples 10 | 11 | ```typescript 12 | import { safeLocalStorage } from '@toss/storage'; 13 | 14 | safeLocalStorage.set('key', 'value'); 15 | 16 | safeLocalStorage.get('key'); // 'value' 17 | ``` 18 | -------------------------------------------------------------------------------- /packages/common/storage/src/safeSessionStorage.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: safeSessionStorage 3 | --- 4 | 5 | # safeSessionStorage 6 | 7 | A session storage accessor generated by [generateSessionStorage](https://slash.page/libraries/common/storage/src/generatesessionstorage.i18n). 8 | 9 | ## Examples 10 | 11 | ```typescript 12 | import { safeSessionStorage } from '@toss/storage'; 13 | 14 | safeSessionStorage.set('key', 'value'); 15 | 16 | safeSessionStorage.get('key'); // 'value' 17 | ``` 18 | -------------------------------------------------------------------------------- /packages/common/storage/src/safeSessionStorage.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: safeSessionStorage 3 | --- 4 | 5 | # safeSessionStorage 6 | 7 | [generateSessionStorage](https://slash.page/ko/libraries/common/storage/src/generateSessionStorage.i18n)로 생성된 session storage accessor 입니다. 8 | 9 | ## Examples 10 | 11 | ```typescript 12 | import { safeSessionStorage } from '@toss/storage'; 13 | 14 | safeSessionStorage.set('key', 'value'); 15 | 16 | safeSessionStorage.get('key'); // 'value' 17 | ``` 18 | -------------------------------------------------------------------------------- /packages/common/storage/src/typed/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './factory'; 3 | export * from './storages'; 4 | -------------------------------------------------------------------------------- /packages/common/storage/src/typed/storages/NumberTypedStorage.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { TypedStorage } from './TypedStorage'; 3 | 4 | export class NumberTypedStorage extends TypedStorage { 5 | public increase(offset: number = 1): void { 6 | const value = this.get() ?? 0; 7 | this.set(value + offset); 8 | } 9 | 10 | public decrease(offset: number = 1): void { 11 | const value = this.get() ?? 0; 12 | this.set(value - offset); 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /packages/common/storage/src/typed/storages/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './TypedStorage'; 3 | export * from './NumberTypedStorage'; 4 | -------------------------------------------------------------------------------- /packages/common/storage/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/storage/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "module": "esnext", 5 | "outDir": "./esm" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /packages/common/storage/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "target": "es6", 5 | "module": "commonjs", 6 | "declaration": true, 7 | "noUncheckedIndexedAccess": true, 8 | "outDir": "./dist" 9 | }, 10 | "include": ["src"], 11 | "exclude": ["jest.setup.ts"] 12 | } 13 | -------------------------------------------------------------------------------- /packages/common/storage/typed.d.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './dist/typed'; 3 | -------------------------------------------------------------------------------- /packages/common/utility-types/src/Serializable.en.md: -------------------------------------------------------------------------------- 1 | # Serializable 2 | 3 | Indicates types that can be serialized as JSON. 4 | 5 | - undefined 6 | - null 7 | - boolean 8 | - number 9 | - symbol 10 | - string 11 | - Date 12 | - an object has `toJSON` method 13 | - an array and objects has all the things above 14 | -------------------------------------------------------------------------------- /packages/common/utility-types/src/Serializable.ko.md: -------------------------------------------------------------------------------- 1 | # Serializable 2 | 3 | JSON으로 직렬화 가능한 타입을 나타냅니다. (undefined | null | boolean | number | symbol | string, Date, toJSON 메서드를 가지는 것, 그리고 그것들을 값으로 가지는 배열 또는 오브젝트) 4 | -------------------------------------------------------------------------------- /packages/common/utility-types/src/elementType.en.md: -------------------------------------------------------------------------------- 1 | # ElementType 2 | 3 | Indicates the type of elements that make up the array. 4 | 5 | ## Examples 6 | 7 | ```ts 8 | type Foo = ElementType; // Foo is string type 9 | type Bar = ElementType<(string | number)[]>; // Bar is string | number union type 10 | 11 | const EXAMPLE_ARRAY = ['foo', 'bar'] as const; 12 | 13 | type Baz = ElementType; // Baz is "foo" | "bar" union type 14 | ``` 15 | -------------------------------------------------------------------------------- /packages/common/utility-types/src/elementType.ko.md: -------------------------------------------------------------------------------- 1 | # ElementType 2 | 3 | 배열을 구성하고 있는 요소들의 타입을 나타냅니다. 4 | 5 | ## Examples 6 | 7 | ```ts 8 | type Foo = ElementType; // Foo is string type 9 | type Bar = ElementType<(string | number)[]>; // Bar is string | number union type 10 | 11 | const EXAMPLE_ARRAY = ['foo', 'bar'] as const; 12 | 13 | type Baz = ElementType; // Baz is "foo" | "bar" union type 14 | ``` 15 | -------------------------------------------------------------------------------- /packages/common/utility-types/src/elementType.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export type ElementType = Type[number]; 3 | -------------------------------------------------------------------------------- /packages/common/utility-types/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './elementType'; 3 | export * from './serializable'; 4 | -------------------------------------------------------------------------------- /packages/common/utility-types/src/serializable.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | type Primitive = undefined | null | boolean | number | symbol | string; 3 | 4 | export type Serializable = 5 | | Primitive 6 | | Date // Date.toJSON() -> ISOString (serialized) 7 | | { toJSON: () => string } 8 | | readonly Serializable[] 9 | | Readonly<{ [key: string]: Serializable }>; 10 | -------------------------------------------------------------------------------- /packages/common/utility-types/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/utility-types/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/utility-types/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/utils/.npmignore: -------------------------------------------------------------------------------- 1 | *.md 2 | -------------------------------------------------------------------------------- /packages/common/utils/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "eslint.nodePath": "../../../.yarn/sdks", 3 | "prettier.prettierPath": "../../../.yarn/sdks/prettier/index.js", 4 | "typescript.tsdk": "../../../.yarn/sdks/typescript/lib", 5 | "typescript.enablePromptUseWorkspaceTsdk": true, 6 | "search.exclude": { 7 | "**/.yarn": true, 8 | "**/.pnp.*": true, 9 | "**/.next": true 10 | }, 11 | "prettier.configPath": "../../../.prettierrc" 12 | } 13 | -------------------------------------------------------------------------------- /packages/common/utils/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/common/utils/jest.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-var-requires */ 2 | module.exports = require('@toss/jest').config({ 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/common/utils/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_ceilToUnit.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: ceilToUnit 4 | --- 5 | 6 | # ceilToUnit 7 | 8 | Rounds up `value` by `unit`. 9 | 10 | ```typescript 11 | function ceilToUnit(value: number, unit: number): number; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | ceilToUnit(320980, 10000); // 330000 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_ceilToUnit.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: ceilToUnit 4 | --- 5 | 6 | # ceilToUnit 7 | 8 | 주어진 unit 단위로 value를 올림합니다. 9 | 10 | ```typescript 11 | function ceilToUnit(value: number, unit: number): number; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | ceilToUnit(320980, 10000); // 330000 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_commaizeNumber.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: commaizeNumber 4 | --- 5 | 6 | # commaizeNumber 7 | 8 | Separates the given value by comma. 9 | 10 | ```typescript 11 | function commaizeNumber(value: number | string): string; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | commaizeNumber(13209802); // '13,209,802' 18 | commaizeNumber('13209802'); // '13,209,802' 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_commaizeNumber.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: commaizeNumber 4 | --- 5 | 6 | # commaizeNumber 7 | 8 | 주어진 숫자를 콤마로 구분합니다. 9 | 10 | ```typescript 11 | function commaizeNumber(value: number | string): string; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | commaizeNumber(13209802); // => '13,209,802' 18 | commaizeNumber('13209802'); // => '13,209,802' 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_decommaizeNumber.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: decommaizeNumber 4 | --- 5 | 6 | # decommaizeNumber 7 | 8 | Removes commas from [commaized](https://slash.page/libraries/common/utils/src/Numbers_commaizeNumber.i18n) number. 9 | 10 | ```typescript 11 | function decommaizeNumber(numStr: string): number; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | decommaizeNumber('13,209,802'); // 13209802 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_decommaizeNumber.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: decommaizeNumber 4 | --- 5 | 6 | # decommaizeNumber 7 | 8 | [commaize](https://slash.page/ko/libraries/common/utils/src/Numbers_commaizeNumber.i18n)된 숫자에서 콤마를 제거합니다. 9 | 10 | ```typescript 11 | function decommaizeNumber(numStr: string): number; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | decommaizeNumber('13,209,802'); // 13209802 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_floorAndFormatNumber.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: floorAndFormatNumber 4 | --- 5 | 6 | # floorAndFormatNumber 7 | 8 | Rounds the given number and [commaize](https://slash.page/libraries/common/utils/src/Numbers_commaizeNumber.i18n). 9 | 10 | ```typescript 11 | function floorAndFormatNumber(value: number): string; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | floorAndFormatNumber(13209802.1212); // '13,209,802' 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_floorAndFormatNumber.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: floorAndFormatNumber 4 | --- 5 | 6 | # floorAndFormatNumber 7 | 8 | 주어진 숫자를 반올림하고, [commaize](https://slash.page/ko/libraries/common/utils/src/Numbers_commaizeNumber.i18n) 합니다. 9 | 10 | ```typescript 11 | function floorAndFormatNumber(value: number): string; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | floorAndFormatNumber(13209802.1212); // '13,209,802' 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_floorToUnit.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: floorToUnit 4 | --- 5 | 6 | # floorToUnit 7 | 8 | Rounds down `value` by `unit`. 9 | 10 | ```typescript 11 | function floorToUnit(value: number, unit: number): number; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | floorToUnit(320980, 10000); // 320000 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_floorToUnit.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: floorToUnit 4 | --- 5 | 6 | # floorToUnit 7 | 8 | 주어진 unit 단위로 value를 내림합니다. 9 | 10 | ```typescript 11 | function floorToUnit(value: number, unit: number): number; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | floorToUnit(320980, 10000); // 320000 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_formatToKoreanNumber.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: formatToKoreanNumber 4 | --- 5 | 6 | # formatToKoreanNumber 7 | 8 | Converts given number to Korean expression. 9 | 10 | ```typescript 11 | function formatToKoreanNumber(value: number, options?: { floorUnit?: number; formatAllDigits?: boolean }): string; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | formatToKoreanNumber(13209802); // 1,320만 9,802 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_formatToKoreanNumber.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: formatToKoreanNumber 4 | --- 5 | 6 | # formatToKoreanNumber 7 | 8 | 주어진 수를 한국어 표기로 변환합니다. 9 | 10 | ```typescript 11 | function formatToKoreanNumber(value: number, options?: { floorUnit?: number; formatAllDigits?: boolean }): string; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | formatToKoreanNumber(13209802); // 1,320만 9,802 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_roundToUnit.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: roundToUnit 4 | --- 5 | 6 | # roundToUnit 7 | 8 | Rounds `value` by `unit`. 9 | 10 | ```typescript 11 | function roundToUnit(value: number, unit: number): number; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | roundToUnit(320980, 1000); // 321000 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/Numbers_roundToUnit.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: roundToUnit 4 | --- 5 | 6 | # roundToUnit 7 | 8 | 주어진 unit 단위로 value를 반올림합니다. 9 | 10 | ```typescript 11 | function roundToUnit(value: number, unit: number): number; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | roundToUnit(320980, 1000); // 321000 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/array/NonEmptyArray.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export type NonEmptyArray = [T, ...T[]]; 3 | -------------------------------------------------------------------------------- /packages/common/utils/src/array/arrayIncludes.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export function arrayIncludes(array: Type[] | readonly Type[], item: unknown, fromIndex?: number): item is Type { 3 | return array.includes(item as Type, fromIndex); 4 | } 5 | -------------------------------------------------------------------------------- /packages/common/utils/src/array/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './arrayIncludes'; 3 | export * from './isDifferentArray'; 4 | export * from './isNonEmptyArray'; 5 | export * from './last'; 6 | export * from './NonEmptyArray'; 7 | export * from './sample'; 8 | 9 | -------------------------------------------------------------------------------- /packages/common/utils/src/array/isDifferentArray.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export function isDifferentArray(a: unknown[] = [], b: unknown[] = []) { 3 | return a.length !== b.length || a.some((item, index) => !Object.is(item, b[index])); 4 | } 5 | -------------------------------------------------------------------------------- /packages/common/utils/src/array/isNonEmptyArray.en.md: -------------------------------------------------------------------------------- 1 | # isNonEmptyArray 2 | 3 | Checks if an array has one or more elements. 4 | 5 | ## Example 6 | 7 | ```typescript 8 | isNonEmptyArray([]); // false 9 | isNonEmptyArray(['hi']); // true 10 | isNonEmptyArray(['hi', 'hello']); // true 11 | ``` 12 | -------------------------------------------------------------------------------- /packages/common/utils/src/array/isNonEmptyArray.ko.md: -------------------------------------------------------------------------------- 1 | # isNonEmptyArray 2 | 3 | 배열이 최소 1개 이상의 원소를 가지고 있는지 확인합니다. 4 | 5 | ## Example 6 | 7 | ```typescript 8 | isNonEmptyArray([]); // false 9 | isNonEmptyArray(['hi']); // true 10 | isNonEmptyArray(['hi', 'hello']); // true 11 | ``` 12 | -------------------------------------------------------------------------------- /packages/common/utils/src/array/isNonEmptyArray.spec.ts: -------------------------------------------------------------------------------- 1 | import { isNonEmptyArray } from '.'; 2 | 3 | describe('isNonEmptyArray', () => { 4 | it('should return true when array length is equal or bigger than 1', () => { 5 | expect(isNonEmptyArray([1])).toBe(true); 6 | expect(isNonEmptyArray([1, 2])).toBe(true); 7 | }); 8 | it('should return false when array is empty', () => { 9 | expect(isNonEmptyArray([])).toBe(false); 10 | }); 11 | }); 12 | -------------------------------------------------------------------------------- /packages/common/utils/src/array/isNonEmptyArray.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { NonEmptyArray } from './NonEmptyArray'; 3 | 4 | export function isNonEmptyArray(array: T[]): array is NonEmptyArray { 5 | return array.length >= 1; 6 | } 7 | -------------------------------------------------------------------------------- /packages/common/utils/src/array/last.spec.ts: -------------------------------------------------------------------------------- 1 | import { last } from './last'; 2 | 3 | describe('last', () => { 4 | it('should return last element of array.', () => { 5 | expect(last([1, 2, 3])).toEqual(3); 6 | }); 7 | 8 | it('should return undefined when array is empty', () => { 9 | expect(last([])).toEqual(undefined); 10 | }); 11 | }); 12 | -------------------------------------------------------------------------------- /packages/common/utils/src/array/sample.spec.ts: -------------------------------------------------------------------------------- 1 | import { sample } from './sample'; 2 | 3 | describe('sample', () => { 4 | it('should return one of the arbitrary values of the array.', () => { 5 | const value = [1, 2, 3]; 6 | 7 | expect(value).toContain(sample(value)); 8 | }); 9 | 10 | it('should return undefined when array is empty', () => { 11 | expect(sample([])).toEqual(undefined); 12 | }); 13 | }); 14 | -------------------------------------------------------------------------------- /packages/common/utils/src/chunk.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: chunk 3 | --- 4 | 5 | # chunk 6 | 7 | 배열을 주어진 길이보다 작은 배열들로 나눕니다. 8 | 9 | ```typescript 10 | function chunk( 11 | // 나눌 배열 12 | arr: T[], 13 | // 각 내부 배열의 길이 14 | size: number 15 | ): T[][]; 16 | ``` 17 | 18 | ```typescript 19 | chunk([], 3); // --> [] 20 | chunk([1, 2, 3], -1); // --> [] 21 | chunk([1, 2, 3, 4, 5, 6], 3); // --> [[1, 2, 3], [4, 5, 6]] 22 | chunk([1, 2, 3, 4, 5, 6, 7], 2); // --> [[1, 2], [3, 4], [5, 6], [7]] 23 | ``` 24 | -------------------------------------------------------------------------------- /packages/common/utils/src/chunk.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | 3 | /** 4 | * @deprecated This feature is now available in the es-toolkit package. 5 | */ 6 | export function chunk(arr: T[], size: number) { 7 | if (size < 1) { 8 | return []; 9 | } 10 | 11 | return arr.reduce((result, item, index) => { 12 | if (index % size > 0) { 13 | result[result.length - 1]!.push(item); 14 | } else { 15 | result.push([item]); 16 | } 17 | return result; 18 | }, [] as T[][]); 19 | } 20 | -------------------------------------------------------------------------------- /packages/common/utils/src/clamp.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package. 4 | */ 5 | export function clamp(value: number, bound1: number, bound2?: number) { 6 | if (bound2 == null) { 7 | return Math.min(value, bound1); 8 | } 9 | 10 | if (bound2 < bound1) { 11 | throw new Error('The value of bound2 must be a number greater than bound1.'); 12 | } 13 | 14 | return Math.min(Math.max(value, bound1), bound2); 15 | } 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/clipboard.en.md: -------------------------------------------------------------------------------- 1 | # clipboard 2 | 3 | A utility to copy texts to clipboard. Returns if the copy operation succeeded. 4 | 5 | ```tsx 6 | const clipboard = { 7 | writeText: function(text: string): Promise; 8 | } 9 | ``` 10 | 11 | ## Example 12 | 13 | ```typescript 14 | // Copies 'Hello, world!' to clipboard. 15 | const isSuccess = clipboard.writeText('Hello, world!'); 16 | 17 | if (isSuccess) { 18 | window.alert('Copy succeeded!'); 19 | } 20 | ``` 21 | -------------------------------------------------------------------------------- /packages/common/utils/src/clipboard.ko.md: -------------------------------------------------------------------------------- 1 | # clipboard 2 | 3 | 클립보드에 텍스트를 복사하는 유틸입니다. 복사 성공 여부를 리턴합니다. 4 | 5 | ## Example 6 | 7 | ```typescript 8 | // 'Hello, world!' 라는 문자열을 클립보드에 복사해둡니다. 9 | const isSuccess = clipboard.writeText('Hello, world!'); 10 | 11 | if (isSuccess) { 12 | window.alert('복사 성공!'); 13 | } 14 | ``` 15 | -------------------------------------------------------------------------------- /packages/common/utils/src/delay.en.md: -------------------------------------------------------------------------------- 1 | # delay 2 | 3 | Returns a Promise which is resolved after given milliseconds. 4 | 5 | ```typescript 6 | function delay(milliseconds: number): Promise; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```typescript 12 | await delay(3000); 13 | // After 3 seconds 14 | doSomething(); 15 | ``` 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/delay.ko.md: -------------------------------------------------------------------------------- 1 | # delay 2 | 3 | 입력한 밀리초 후에 resolve되는 Promise를 반환하는 유틸입니다. 4 | 5 | ```typescript 6 | function delay(milliseconds: number): Promise; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```typescript 12 | await delay(3000); 13 | // 3초 후 14 | doSomething(); 15 | ``` 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/delay.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package. 4 | */ 5 | export function delay(milliseconds: number) { 6 | return new Promise(resolve => { 7 | setTimeout(resolve, milliseconds); 8 | }); 9 | } 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/getOSByUserAgent.en.md: -------------------------------------------------------------------------------- 1 | # getOSByUserAgent 2 | 3 | Returns the current operating system by the user agent string. 4 | 5 | ```typescript 6 | function getOSByUserAgent(): false | 'ios' | 'android' | 'web'; 7 | ``` 8 | 9 | - Returns: 10 | - `ios` 11 | - `android` 12 | - `web`: Other browser environments 13 | - `false`: Other server environments 14 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/getOSByUserAgent.ko.md: -------------------------------------------------------------------------------- 1 | # getOSByUserAgent 2 | 3 | User-Agent 문자열을 기반으로 OS를 반환합니다. 4 | 5 | ```typescript 6 | function getOSByUserAgent(): false | 'ios' | 'android' | 'web'; 7 | ``` 8 | 9 | - 반환하는 값: 10 | - `ios`: iOS 환경 11 | - `android`: Android 환경 12 | - `web`: 그 외의 브라우저 환경 13 | - `false`: 그 외의 서버 환경 14 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/getOSByUserAgent.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { isAndroid } from './isAndroid'; 3 | import { isIOS } from './isIOS'; 4 | import { isServer } from './isServer'; 5 | 6 | export function getOSByUserAgent() { 7 | if (isServer()) { 8 | return false; 9 | } 10 | 11 | if (isIOS()) { 12 | return 'ios'; 13 | } 14 | 15 | if (isAndroid()) { 16 | return 'android'; 17 | } 18 | 19 | return 'web'; 20 | } 21 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './getOSByUserAgent'; 3 | export * from './isClient'; 4 | export * from './isIE'; 5 | export * from './isMacOS'; 6 | export * from './isMobileWeb'; 7 | export * from './isServer'; 8 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isAndroid.en.md: -------------------------------------------------------------------------------- 1 | # isAndroid 2 | 3 | Checks if the current JavaScript runtime is running on Android device. 4 | 5 | It checks whether `navigator.userAgent` includes `Android`. 6 | 7 | ```typescript 8 | function isAndroid(): boolean; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isAndroid.ko.md: -------------------------------------------------------------------------------- 1 | # isAndroid 2 | 3 | 현재 JS 런타임이 Android 환경에서 실행되었는지 확인합니다. 4 | 5 | `navigator.userAgent`가 `Android` 문자열을 포함하는지 확인합니다. 6 | 7 | ```typescript 8 | function isAndroid(): boolean; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isAndroid.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { isServer } from './isServer'; 3 | 4 | export function isAndroid() { 5 | if (isServer()) { 6 | return false; 7 | } 8 | 9 | return navigator.userAgent.match(/Android/i) !== null; 10 | } 11 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isClient.en.md: -------------------------------------------------------------------------------- 1 | # isClient 2 | 3 | Checks if the current JavaScript runtime is running on the browser. 4 | 5 | Used to run browser-specific logics. 6 | 7 | ## Example 8 | 9 | ```typescript 10 | if (isClient()) { 11 | // Guarantees to be run on the client-side 12 | doSomethingInBrowser(); 13 | } 14 | ``` 15 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isClient.ko.md: -------------------------------------------------------------------------------- 1 | # isClient 2 | 3 | 현재 JS 런타임이 클라이언트 환경(브라우저)인지 확인합니다. 4 | 5 | SSR 환경에서 브라우저에서만 실행되는 로직을 작성할 때 사용합니다. 6 | 7 | ## Example 8 | 9 | ```typescript 10 | if (isClient()) { 11 | // 브라우저 환경임이 보장된다. 12 | doSomethingInBrowser(); 13 | } 14 | ``` 15 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isClient.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { isServer } from './isServer'; 3 | 4 | export function isClient() { 5 | return !isServer(); 6 | } 7 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isIE.en.md: -------------------------------------------------------------------------------- 1 | # isIE 2 | 3 | Checks if the current JavaScript runtime is running on Internet Explorer. 4 | 5 | It checks whether `navigator.userAgent` includes `MSIE` or `Trident`. 6 | 7 | ```typescript 8 | function isIE(): boolean; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isIE.ko.md: -------------------------------------------------------------------------------- 1 | # isIE 2 | 3 | 현재 JS 런타임이 Internet Explorer 환경에서 실행되었는지 확인합니다. 4 | 5 | `navigator.userAgent`가 `MSIE` or `Trident` 문자열을 포함하는지 확인합니다. 6 | 7 | ```typescript 8 | function isIE(): boolean; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isIE.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { isServer } from './isServer'; 3 | 4 | export function isIE() { 5 | if (isServer()) { 6 | return false; 7 | } 8 | 9 | return /MSIE|Trident/i.test(window.navigator.userAgent); 10 | } 11 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isIOS.en.md: -------------------------------------------------------------------------------- 1 | # isIOS 2 | 3 | Checks if the current JavaScript runtime is running on IOS device. 4 | 5 | It checks whether `navigator.userAgent` includes `ipad` or `phone`. 6 | 7 | ```typescript 8 | function isIOS(): boolean; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isIOS.ko.md: -------------------------------------------------------------------------------- 1 | # isIOS 2 | 3 | 현재 JS 런타임이 IOS 환경에서 실행되었는지 확인합니다. 4 | 5 | `navigator.userAgent`가 `ipad` or `iphone` 문자열을 포함하는지 확인합니다. 6 | 7 | ```typescript 8 | function isIOS(): boolean; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isIOS.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { isServer } from './isServer'; 3 | 4 | export function isIOS() { 5 | if (isServer()) { 6 | return false; 7 | } 8 | 9 | return navigator.userAgent.match(/ipad|iphone/i) !== null; 10 | } 11 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isMacOS.en.md: -------------------------------------------------------------------------------- 1 | # isMacOS 2 | 3 | Checks if the current JavaScript runtime is running on macOS. 4 | 5 | It returns if `navigator.platform` includes any of the strings below: 6 | 7 | - Macintosh 8 | - MacIntel 9 | - MacPPC 10 | - Mac68K 11 | 12 | ```typescript 13 | function isMacOS(): boolean; 14 | ``` 15 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isMacOS.ko.md: -------------------------------------------------------------------------------- 1 | # isMacOS 2 | 3 | 현재 JS 런타임이 Mac OS 환경에서 실행되었는지 확인합니다. 4 | 5 | `navigator.platform`이 아래 문자열 중 어느 하나라도 포함하는지 확인합니다. 6 | 7 | - Macintosh 8 | - MacIntel 9 | - MacPPC 10 | - Mac68K 11 | 12 | ```typescript 13 | function isMacOS(): boolean; 14 | ``` 15 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isMacOS.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { isServer } from './isServer'; 3 | 4 | export function isMacOS() { 5 | if (isServer()) { 6 | return false; 7 | } 8 | 9 | return navigator.platform.match(/Macintosh|MacIntel|MacPPC|Mac68K/) !== null; 10 | } 11 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isMobileWeb.en.md: -------------------------------------------------------------------------------- 1 | # isMobileWeb 2 | 3 | Checks if the current JavaScript runtime is running on mobile devices. 4 | 5 | It checks if the user agent includes any of the strings below: 6 | 7 | - ipad 8 | - iphone 9 | - android 10 | 11 | ```typescript 12 | function isMobileWeb(): boolean; 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isMobileWeb.ko.md: -------------------------------------------------------------------------------- 1 | # isMobileWeb 2 | 3 | 현재 JS 런타임이 Mobile Web 환경에서 실행되었는지 확인합니다. 4 | 5 | User Agent에 아래 문자열 중 어느 하나라도 포함하는지 검사합니다. 6 | 7 | - ipad 8 | - iphone 9 | - android 10 | 11 | ```typescript 12 | function isMobileWeb(): boolean; 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isMobileWeb.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { getOSByUserAgent } from './getOSByUserAgent'; 3 | 4 | export function isMobileWeb() { 5 | const userAgent = getOSByUserAgent(); 6 | 7 | if (userAgent === 'ios' || userAgent === 'android') { 8 | return true; 9 | } 10 | return false; 11 | } 12 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isServer.en.md: -------------------------------------------------------------------------------- 1 | # isServer 2 | 3 | ```typescript 4 | function isServer(): boolean; 5 | ``` 6 | 7 | Checks if the current JavaScript runtime is Node.js. 8 | 9 | It can be used to run some logic only in the server, when developing server-side rendered services. 10 | 11 | ## Example 12 | 13 | ```typescript 14 | if (isServer()) { 15 | // Guarantees to be run on the server-side 16 | doSomethingInServer(); 17 | } 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isServer.ko.md: -------------------------------------------------------------------------------- 1 | # isServer 2 | 3 | 현재 JS 런타임이 서버 환경(Node.js)인지 확인합니다. 4 | 5 | SSR 환경에서 서버에서만 실행되는 로직을 작성할 때 사용합니다. 6 | 7 | ## Example 8 | 9 | ```typescript 10 | if (isServer()) { 11 | // Node.js 서버 환경임이 보장된다. 12 | doSomethingInServer(); 13 | } 14 | ``` 15 | -------------------------------------------------------------------------------- /packages/common/utils/src/device/isServer.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | 3 | export function isServer() { 4 | return typeof window === 'undefined' || 'Deno' in globalThis; 5 | } 6 | -------------------------------------------------------------------------------- /packages/common/utils/src/difference.en.md: -------------------------------------------------------------------------------- 1 | # difference 2 | 3 | Returns the values which is included in the first array (`xs`) but not included in the second array (`ys`). 4 | 5 | It checks if two values are equal by triple-equals operator (`===`). 6 | 7 | ```typescript 8 | function difference( 9 | // First array 10 | xs: T[], 11 | // Second aray 12 | ys: T[] 13 | ): T[]; 14 | ``` 15 | 16 | ## Example 17 | 18 | ```typescript 19 | difference([1, 2, 3], [1, 2]); // [3] 20 | ``` 21 | -------------------------------------------------------------------------------- /packages/common/utils/src/difference.ko.md: -------------------------------------------------------------------------------- 1 | # difference 2 | 3 | 첫 번째 배열(`xs`)에서 두 번째 배열(`ys`)에 포함되지 않은 값들을 반환합니다. 4 | 5 | ```typescript 6 | function difference( 7 | // 첫 번째 배열 8 | xs: T[], 9 | // 두 번째 배열 10 | ys: T[] 11 | ): T[]; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | difference([1, 2, 3], [1, 2]); // [3] 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/escapeHTML.en.md: -------------------------------------------------------------------------------- 1 | # escapeHTML 2 | 3 | ```typescript 4 | function escapeHTML(text: string): string; 5 | ``` 6 | 7 | Replaces a special character with an HTML entity. 8 | 9 | - `&` -> `&` 10 | - `<` -> `<` 11 | - `>` -> `>` 12 | - `'` -> `'` 13 | - `"` -> `"` 14 | 15 | ## Example 16 | 17 | ```typescript 18 | escapeHTML('Settings > Notification'); // 'Settings > Notification' 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/utils/src/escapeHTML.ko.md: -------------------------------------------------------------------------------- 1 | # escapeHTML 2 | 3 | ```typescript 4 | function escapeHTML(text: string): string; 5 | ``` 6 | 7 | 특수 문자를 HTML 엔티티로 치환해 줍니다. 8 | 9 | - `&` -> `&` 10 | - `<` -> `<` 11 | - `>` -> `>` 12 | - `'` -> `'` 13 | - `"` -> `"` 14 | 15 | ## Example 16 | 17 | ```typescript 18 | escapeHTML('설정 > 알림'); // '설정 > 알림' 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/utils/src/generateID.en.md: -------------------------------------------------------------------------------- 1 | # generateID 2 | 3 | Generates a unique ID. 4 | 5 | ```typescript 6 | generateID('toss'); // 'toss1' 7 | generateID('toss'); // 'toss2' 8 | generateID('toss'); // 'toss3' 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/generateID.ko.md: -------------------------------------------------------------------------------- 1 | # generateID 2 | 3 | 고유한 ID를 생성합니다. 4 | 5 | ```typescript 6 | generateID('toss'); // 'toss1' 7 | generateID('toss'); // 'toss2' 8 | generateID('toss'); // 'toss3' 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/generateID.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | let nextUniqueId = 0; 3 | 4 | /** 5 | * @deprecated This feature is now available in the es-toolkit package. 6 | */ 7 | export function generateID(prefix = '') { 8 | nextUniqueId = nextUniqueId + 1; 9 | return `${prefix}${nextUniqueId}`; 10 | } 11 | -------------------------------------------------------------------------------- /packages/common/utils/src/get-set_get.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: get 4 | --- 5 | 6 | # get 7 | 8 | Finds the value in `obj` by `path` and returns it. 9 | 10 | ```typescript 11 | function get(obj: Record, path: string, defaultValue?: T): T; 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | get({ a: { b: 1 } }, 'a.b'); // 1 18 | get({ a: { b: 1 } }, 'a.b.c'); // undefined 19 | get({ a: { b: true } }, 'a.b.c', false); // false 20 | ``` 21 | -------------------------------------------------------------------------------- /packages/common/utils/src/get-set_set.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: set 4 | --- 5 | 6 | # set 7 | 8 | Finds the value in `obj` by `path` and replaces it with `value`. 9 | 10 | ```typescript 11 | function set( 12 | // 값을 수정할 객체 13 | obj: Record, 14 | // 수정할 값의 경로 15 | path: string, 16 | // 새로운 값 17 | value: any 18 | ): Record; 19 | ``` 20 | 21 | ## Example 22 | 23 | ```typescript 24 | set({ a: { b: 1 } }, 'a.b', 2); // { a: { b: 2 } } 25 | ``` 26 | -------------------------------------------------------------------------------- /packages/common/utils/src/get-set_set.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: set 4 | --- 5 | 6 | # set 7 | 8 | 객체의 특정 경로에 있는 값을 수정합니다. 9 | 10 | ```typescript 11 | function set( 12 | // 값을 수정할 객체 13 | obj: Record, 14 | // 수정할 값의 경로 15 | path: string, 16 | // 새로운 값 17 | value: any 18 | ): Record; 19 | ``` 20 | 21 | ## Example 22 | 23 | ```typescript 24 | set({ a: { b: 1 } }, 'a.b', 2); // { a: { b: 2 } } 25 | ``` 26 | -------------------------------------------------------------------------------- /packages/common/utils/src/getScrollDiffFromBottom.en.md: -------------------------------------------------------------------------------- 1 | # getScrollDiffFromBottom 2 | 3 | Returns how much pixels you can scroll to bottom. 4 | 5 | If you were on the server-side, It would be `0`. 6 | 7 | ```typescript 8 | function getScrollDiffFromBottom(): number; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/getScrollDiffFromBottom.ko.md: -------------------------------------------------------------------------------- 1 | # getScrollDiffFromBottom 2 | 3 | 스크롤의 맨 아래까지 남은 픽셀 수를 반환합니다. 4 | 5 | Server-side 에서는 결과가 `0` 입니다. 6 | 7 | ```typescript 8 | function getScrollDiffFromBottom(): number; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/getScrollPercent.en.md: -------------------------------------------------------------------------------- 1 | # getScrollPercent 2 | 3 | Returns how much you scrolled in the screen as percentage. 4 | 5 | If you were on the server-side, It would be `0`. 6 | 7 | ```typescript 8 | function getScrollPercent(): number; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/getScrollPercent.ko.md: -------------------------------------------------------------------------------- 1 | # getScrollPercent 2 | 3 | 현재 화면에서 스크롤이 얼마나 되었는지를 퍼센티지로 반환합니다. 4 | 5 | Server-side 에서는 결과가 `0` 입니다. 6 | 7 | ```typescript 8 | function getScrollPercent(): number; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/getScrollYOffset.en.md: -------------------------------------------------------------------------------- 1 | # getScrollYOffset 2 | 3 | Returns how much pixels you scrolled in the Y axis in the screen. 4 | 5 | If you were on the server-side, It would be `0`. 6 | 7 | ```typescript 8 | function getScrollYOffset(): number; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/getScrollYOffset.ko.md: -------------------------------------------------------------------------------- 1 | # getScrollYOffset 2 | 3 | 현재 스크롤된 Y 값을 리턴합니다. 4 | 5 | Server-side 에서는 결과가 `0` 입니다. 6 | 7 | ```typescript 8 | function getScrollYOffset(): number; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/getViewportSize.en.md: -------------------------------------------------------------------------------- 1 | # getViewportSize 2 | 3 | Returns the size of current viewport. 4 | 5 | If you were on the server-side, It would be `{ width: 0, height: 0 }`. 6 | 7 | ```typescript 8 | function getViewportSize(): Readonly<{ width: number; height: number }>; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/getViewportSize.ko.md: -------------------------------------------------------------------------------- 1 | # getViewportSize 2 | 3 | 현재 뷰포트의 크기를 반환합니다. 4 | 5 | Server-side 에서는 결과가 `{ width: 0, height: 0 }` 입니다. 6 | 7 | ```typescript 8 | function getViewportSize(): Readonly<{ width: number; height: number }>; 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/getViewportSize.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { isServer } from './device/index'; 3 | 4 | type ViewportSize = Readonly<{ width: number; height: number }>; 5 | 6 | export function getViewportSize(): ViewportSize { 7 | if (isServer()) { 8 | return { width: 0, height: 0 }; 9 | } 10 | 11 | return { 12 | width: window.innerWidth, 13 | height: window.innerHeight, 14 | }; 15 | } 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/hexToRgba_isAlphaValue.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: isAlphaValue 4 | --- 5 | 6 | # isAlphaValue 7 | 8 | Checks if the given number is between 0 and 1. 9 | 10 | # Example 11 | 12 | ```typescript 13 | isAlphaValue(0); // true 14 | isAlphaValue(1); // true 15 | isAlphaValue(1.1); // false 16 | isAlphaValue(-0.1); // false 17 | isAlphaValue(2); // false 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/hexToRgba_isAlphaValue.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: isAlphaValue 4 | --- 5 | 6 | # isAlphaValue 7 | 8 | 주어진 숫자가 색상의 알파 값의 범위인 0 ~ 1 사이의 값인지 확인합니다. 9 | 10 | # Example 11 | 12 | ```typescript 13 | isAlphaValue(0); // true 14 | isAlphaValue(1); // true 15 | isAlphaValue(1.1); // false 16 | isAlphaValue(-0.1); // false 17 | isAlphaValue(2); // false 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/hexToRgba_isRGBDecimalValue.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: isRGBDecimalValue 4 | --- 5 | 6 | # isRGBDecimalValue 7 | 8 | Checks if the given number is between 0 and 255. 9 | 10 | # Example 11 | 12 | ```typescript 13 | isRGBDecimalValue(0); // true 14 | isRGBDecimalValue(255); // true 15 | isRGBDecimalValue(256); // false 16 | isRGBDecimalValue(-1); // false 17 | ``` 18 | -------------------------------------------------------------------------------- /packages/common/utils/src/hexToRgba_isRGBDecimalValue.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: isRGBDecimalValue 4 | --- 5 | 6 | # isRGBDecimalValue 7 | 8 | 주어진 숫자가 RGB 색상 값의 범위인 0 ~ 255 사이의 값인지 확인합니다. 9 | 10 | # Example 11 | 12 | ```typescript 13 | isRGBDecimalValue(0); // true 14 | isRGBDecimalValue(255); // true 15 | isRGBDecimalValue(256); // false 16 | isRGBDecimalValue(-1); // false 17 | ``` 18 | -------------------------------------------------------------------------------- /packages/common/utils/src/identity.en.md: -------------------------------------------------------------------------------- 1 | # identity 2 | 3 | Returns the given value. 4 | 5 | ```typescript 6 | function identity(value: T): T; 7 | ``` 8 | 9 | # Example 10 | 11 | ```typescript 12 | identity(5); // 5 13 | identity('Hello, world!'); // 'Hello, world!' 14 | identity({ foo: 'bar' }); // { foo:'bar' } 15 | ``` 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/identity.ko.md: -------------------------------------------------------------------------------- 1 | # identity 2 | 3 | 주어진 인자를 그대로 반환합니다. 4 | 5 | ```typescript 6 | function identity(value: T): T; 7 | ``` 8 | 9 | # Example 10 | 11 | ```typescript 12 | identity(5); // 5 13 | identity('Hello, world!'); // 'Hello, world!' 14 | identity({ foo: 'bar' }); // { foo:'bar' } 15 | ``` 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/identity.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package. 4 | */ 5 | export function identity(x: T) { 6 | return x; 7 | } 8 | -------------------------------------------------------------------------------- /packages/common/utils/src/isNil.en.md: -------------------------------------------------------------------------------- 1 | # isNil 2 | 3 | Checks if the given value is `null` or `undefined`; 4 | 5 | ```typescript 6 | function isNil(value: T | null | undefined): value is null | undefined; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```typescript 12 | isNil(null); // true 13 | isNil(undefined); // true 14 | isNil(1); // false 15 | ``` 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/isNil.ko.md: -------------------------------------------------------------------------------- 1 | # isNil 2 | 3 | 주어진 값이 null이나 undefined인지 확인합니다. 4 | 5 | ```typescript 6 | function isNil(value: T | null | undefined): value is null | undefined; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```typescript 12 | isNil(null); // true 13 | isNil(undefined); // true 14 | isNil(1); // false 15 | ``` 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/isNil.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package. 4 | */ 5 | export function isNil(val: T | undefined | null): val is null | undefined { 6 | return val == null; 7 | } 8 | -------------------------------------------------------------------------------- /packages/common/utils/src/isNotNil.en.md: -------------------------------------------------------------------------------- 1 | # isNotNil 2 | 3 | Checks if the given value is not `null` or `undefined`; 4 | 5 | ```typescript 6 | function isNotNil(value: T | null | undefined): value is T; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```typescript 12 | isNotNil(null); // false 13 | isNotNil(undefined); // false 14 | isNotNil(1); // true 15 | ``` 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/isNotNil.ko.md: -------------------------------------------------------------------------------- 1 | # isNotNil 2 | 3 | 주어진 값이 null이나 undefined가 아닌지 확인합니다. 4 | 5 | ```typescript 6 | function isNotNil(value: T | null | undefined): value is T; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```typescript 12 | isNotNil(null); // false 13 | isNotNil(undefined); // false 14 | isNotNil(1); // true 15 | ``` 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/isNotNil.spec.ts: -------------------------------------------------------------------------------- 1 | import { isNotNil } from '.'; 2 | 3 | describe('isNotNil은', () => { 4 | it('null이나 undefined가 아닌 값을 넘기면 true 이다.', () => { 5 | for (const val of [1, 'dasdsa', { foo: 'bar' }, () => {}, Symbol()]) { 6 | expect(isNotNil(val)).toBe(true); 7 | } 8 | }); 9 | 10 | it('null이나 undefined을 넘기면 false 이다.', () => { 11 | for (const val of [null, undefined]) { 12 | expect(isNotNil(val)).toBe(false); 13 | } 14 | }); 15 | }); 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/isNotNil.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package. 4 | */ 5 | export function isNotNil(val: T | undefined | null): val is T { 6 | return val != null; 7 | } 8 | -------------------------------------------------------------------------------- /packages/common/utils/src/loadScript.en.md: -------------------------------------------------------------------------------- 1 | # loadScript 2 | 3 | Loads a script from the given URL dynamically. 4 | 5 | ```typescript 6 | function loadScript(source: string): Promise; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```typescript 12 | loadScript('https://example.com/script.js'); 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/common/utils/src/loadScript.ko.md: -------------------------------------------------------------------------------- 1 | # loadScript 2 | 3 | 주어진 URL의 스크립트를 동적으로 로드합니다. 4 | 5 | ```typescript 6 | function loadScript(source: string): Promise; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```typescript 12 | loadScript('https://example.com/script.js'); 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/common/utils/src/mapValues.en.md: -------------------------------------------------------------------------------- 1 | # mapValues 2 | 3 | Creates new object populated with the results of calling `mapper` on every values of the given object. 4 | 5 | ```typescript 6 | function mapValues, U>( 7 | value: T, 8 | mapper: (value: T[Exclude) => U 9 | ): { [K in Exclude]: U }; 10 | ``` 11 | 12 | ## Example 13 | 14 | ```typescript 15 | mapValues({ foo: 1, bar: 2 }, x => x * 2); // { foo: 2, bar: 4 } 16 | ``` 17 | -------------------------------------------------------------------------------- /packages/common/utils/src/mapValues.ko.md: -------------------------------------------------------------------------------- 1 | # mapValues 2 | 3 | 오브젝트의 값을 map 하는 함수입니다. 4 | 5 | ```typescript 6 | function mapValues, U>( 7 | value: T, 8 | mapper: (value: T[Exclude) => U 9 | ): { [K in Exclude]: U }; 10 | ``` 11 | 12 | ## Example 13 | 14 | ```typescript 15 | mapValues({ foo: 1, bar: 2 }, x => x * 2); // { foo: 2, bar: 4 } 16 | ``` 17 | -------------------------------------------------------------------------------- /packages/common/utils/src/maskName.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: maskName 4 | --- 5 | 6 | # maskName 7 | 8 | Masks `name` with `options.maskChar`. 9 | 10 | ```typescript 11 | function maskName({ 12 | name: string, 13 | options: { 14 | // @default '*' 15 | maskChar?: string; 16 | } 17 | }): string 18 | ``` 19 | 20 | ## Example 21 | 22 | ```typescript 23 | maskName('KIM TO SEU'); // 'K********U' 24 | ``` 25 | -------------------------------------------------------------------------------- /packages/common/utils/src/maxBy.en.md: -------------------------------------------------------------------------------- 1 | # maxBy 2 | 3 | Returns a maximum value in the given array. If the array is empty, it returns `undefined`. 4 | 5 | It receives a function `iteratee`, which specifies a way to calculate the value. 6 | 7 | ```typescript 8 | function maxBy(collection: T[], iteratee: (element: T) => number): T | undefined; 9 | ``` 10 | 11 | ## Example 12 | 13 | ```typescript 14 | maxBy([{ value: 1 }, { value: 3 }, { value: 2 }], ({ value }) => value); // { value: 3 } 15 | ``` 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/maxBy.ko.md: -------------------------------------------------------------------------------- 1 | # maxBy 2 | 3 | 주어진 배열에서 최댓값을 가지는 요소를 반환합니다. `iteratee` 함수로 최댓값을 계산할 방법을 정합니다. 4 | 5 | ```typescript 6 | maxBy( 7 | // 최댓값을 찾을 배열 8 | collection: T[], 9 | // 배열의 값을 계산하는 방법 10 | iteratee: (element: T) => number 11 | // 배열이 비어 있을 경우, undefined를 반환합니다. 12 | ): T | undefined; 13 | ``` 14 | 15 | ## Example 16 | 17 | ```typescript 18 | maxBy([{ value: 1 }, { value: 3 }, { value: 2 }], ({ value }) => value); // { value: 3 } 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/utils/src/maxBy.spec.ts: -------------------------------------------------------------------------------- 1 | import { maxBy } from './maxBy'; 2 | 3 | describe('maxBy 함수는', () => { 4 | it('iteratee 함수의 return value 기준으로 max값을 찾는다.', () => { 5 | expect(maxBy([{ value: 1 }, { value: 3 }, { value: 9 }, { value: 6 }], ({ value }) => value)).toEqual({ value: 9 }); 6 | }); 7 | 8 | it('빈 Array를 넣었을 땐 undefined를 return한다.', () => { 9 | expect(maxBy([], ({ value }) => value)).toBeUndefined(); 10 | }); 11 | }); 12 | -------------------------------------------------------------------------------- /packages/common/utils/src/maxBy.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package. 4 | */ 5 | export function maxBy(collection: T[], iteratee: (element: T) => number): T | undefined { 6 | if (collection.length === 0) { 7 | return undefined; 8 | } 9 | 10 | return collection.reduce(function (a, b) { 11 | return iteratee(a) >= iteratee(b) ? a : b; 12 | }, {} as T); 13 | } 14 | -------------------------------------------------------------------------------- /packages/common/utils/src/minBy.en.md: -------------------------------------------------------------------------------- 1 | # minBy 2 | 3 | Returns a minimum value in the given array. If the array is empty, it returns `undefined`. 4 | 5 | It receives a function `iteratee`, which specifies a way to calculate the value. 6 | 7 | ```typescript 8 | function minBy(collection: T[], iteratee: (element: T) => number): T | undefined; 9 | ``` 10 | 11 | ## Example 12 | 13 | ```typescript 14 | minBy([{ value: 1 }, { value: 3 }, { value: 2 }], ({ value }) => value); // { value: 1 } 15 | ``` 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/minBy.ko.md: -------------------------------------------------------------------------------- 1 | # minBy 2 | 3 | 주어진 배열에서 최솟값을 가지는 요소를 반환합니다. `iteratee` 함수로 최솟값을 계산할 방법을 정합니다. 4 | 5 | ```typescript 6 | minBy( 7 | // 최대값을 찾을 배열 8 | collection: T[], 9 | // 배열의 값을 계산하는 방법 10 | iteratee: (element: T) => number 11 | // 배열이 비어 있을 경우, undefined를 반환합니다. 12 | ): T | undefined; 13 | ``` 14 | 15 | ## Example 16 | 17 | ```typescript 18 | minBy([{ value: 1 }, { value: 3 }, { value: 2 }], ({ value }) => value); // { value: 1 } 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/utils/src/minBy.spec.ts: -------------------------------------------------------------------------------- 1 | import { minBy } from './minBy'; 2 | 3 | describe('minBy 함수는', () => { 4 | it('iteratee 함수의 return value 기준으로 min값을 찾는다.', () => { 5 | expect(minBy([{ value: 1 }, { value: 3 }, { value: 9 }, { value: 6 }], ({ value }) => value)).toEqual({ value: 1 }); 6 | }); 7 | 8 | it('빈 Array를 넣었을 땐 undefined를 return한다.', () => { 9 | expect(minBy([], ({ value }) => value)).toBeUndefined(); 10 | }); 11 | }); 12 | -------------------------------------------------------------------------------- /packages/common/utils/src/minBy.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package. 4 | */ 5 | export function minBy(collection: T[], iteratee: (element: T) => number): T | undefined { 6 | if (collection.length === 0) { 7 | return undefined; 8 | } 9 | 10 | return collection.reduce(function (a, b) { 11 | return iteratee(a) <= iteratee(b) ? a : b; 12 | }, {} as T); 13 | } 14 | -------------------------------------------------------------------------------- /packages/common/utils/src/noop.spec.ts: -------------------------------------------------------------------------------- 1 | import { asyncNoop, noop } from '.'; 2 | 3 | describe('noop functions', () => { 4 | describe('noop', () => { 5 | it('should return undefined', () => { 6 | expect(noop()).toBeUndefined(); 7 | }); 8 | }); 9 | 10 | describe('asyncNoop', () => { 11 | it('should return Promise', () => { 12 | expect(asyncNoop()).toEqual(expect.any(Promise)); 13 | }); 14 | }); 15 | }); 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/noop.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package. 4 | */ 5 | export const noop = () => {}; 6 | 7 | /** 8 | * @deprecated This feature is now available in the es-toolkit package. 9 | */ 10 | export const asyncNoop = async () => {}; 11 | -------------------------------------------------------------------------------- /packages/common/utils/src/noop_asyncNoop.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: asyncNoop 4 | --- 5 | 6 | # asyncNoop 7 | 8 | A async function which does nothing. 9 | 10 | ```typescript 11 | async function asyncNoop(): Promise; 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/common/utils/src/noop_asyncNoop.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: asyncNoop 4 | --- 5 | 6 | # asyncNoop 7 | 8 | 아무 동작도 하지 않는 async 함수입니다. 9 | 10 | ```typescript 11 | async function asyncNoop(): Promise; 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/common/utils/src/noop_noop.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: noop 4 | --- 5 | 6 | # noop 7 | 8 | A function which does nothing. 9 | 10 | ```typescript 11 | function noop(): void; 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/common/utils/src/noop_noop.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: noop 4 | --- 5 | 6 | # noop 7 | 8 | 아무 동작도 하지 않는 함수입니다. 9 | 10 | ```typescript 11 | function noop(): void; 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/common/utils/src/object/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './object-entries'; 3 | export * from './object-keys'; 4 | export * from './object-values'; 5 | export * from './omit'; 6 | export * from './pick'; 7 | -------------------------------------------------------------------------------- /packages/common/utils/src/object/object-entries.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { ObjectKeys } from './object-keys.js'; 3 | 4 | export function objectEntries>( 5 | obj: Type 6 | ): Array<[ObjectKeys, Type[ObjectKeys]]> { 7 | return Object.entries(obj) as Array<[ObjectKeys, Type[ObjectKeys]]>; 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/utils/src/object/object-keys.spec.ts: -------------------------------------------------------------------------------- 1 | import { objectKeys } from '.'; 2 | 3 | describe('objectKeys', () => { 4 | it('should behave identical to Object.Keys()', () => { 5 | const languages = { 6 | rust: 1, 7 | swift: 2, 8 | javascript: 3, 9 | } as const; 10 | 11 | expect(objectKeys(languages)).toStrictEqual(Object.keys(languages)); 12 | 13 | expect(objectKeys(languages)).toStrictEqual(['rust', 'swift', 'javascript']); 14 | }); 15 | }); 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/object/object-keys.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export type ObjectKeys> = `${Exclude}`; 3 | 4 | export function objectKeys>(obj: Type): Array> { 5 | return Object.keys(obj) as Array>; 6 | } 7 | -------------------------------------------------------------------------------- /packages/common/utils/src/object/object-values.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: objectValues 4 | --- 5 | 6 | # objectValues 7 | 8 | A function which behaves identical to [Object.values()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/values). 9 | 10 | ## Example 11 | 12 | ```typescript 13 | const languages = { 14 | rust: 1, 15 | swift: 2, 16 | javascript: 3, 17 | } as const; 18 | 19 | objectValues(languages); // Array<1 | 2 | 3> 20 | ``` 21 | -------------------------------------------------------------------------------- /packages/common/utils/src/object/object-values.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: objectValues 4 | --- 5 | 6 | # objectValues 7 | 8 | [Object.values()](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/values)와 똑같이 동작하는 유틸입니다. 9 | 10 | ## Example 11 | 12 | ```typescript 13 | const languages = { 14 | rust: 1, 15 | swift: 2, 16 | javascript: 3, 17 | } as const; 18 | 19 | objectValues(languages); // Array<1 | 2 | 3> 20 | ``` 21 | -------------------------------------------------------------------------------- /packages/common/utils/src/object/object-values.spec.ts: -------------------------------------------------------------------------------- 1 | import { objectValues } from '.'; 2 | 3 | describe('objectValues', () => { 4 | it('should behave identical to Object.values()', () => { 5 | const languages = { 6 | rust: 1, 7 | swift: 2, 8 | javascript: 3, 9 | } as const; 10 | 11 | expect(objectValues(languages)).toStrictEqual(Object.values(languages)); 12 | 13 | expect(objectValues(languages)).toStrictEqual([1, 2, 3]); 14 | }); 15 | }); 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/object/object-values.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { ObjectKeys } from './object-keys'; 3 | 4 | export function objectValues>(obj: Type): Array]> { 5 | return Object.values(obj) as Array]>; 6 | } 7 | -------------------------------------------------------------------------------- /packages/common/utils/src/object/omit.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: omit 4 | --- 5 | 6 | # omit 7 | 8 | 객체에서 주어진 키들에 해당하는 키-값 쌍들을 제거하여 새로운 객체를 만드는 유틸입니다. 9 | 10 | ## Example 11 | 12 | ```typescript 13 | const country = { 14 | KR: 'KR', 15 | US: 'US', 16 | JP: 'JP', 17 | } as const; 18 | 19 | omit(country, ['CA']); // TS2322: Type '"CA"' is not assignable to type '"KR" | "US" | "JP"' 20 | omit(country, ['KR']); // { US: 'US', JP: 'JP' } 21 | ``` 22 | -------------------------------------------------------------------------------- /packages/common/utils/src/object/pick.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: pick 4 | --- 5 | 6 | # pick 7 | 8 | Creates an object which composed of the given keys. 9 | 10 | ## Example 11 | 12 | ```typescript 13 | const country = { 14 | KR: 'KR', 15 | US: 'US', 16 | JP: 'JP', 17 | } as const; 18 | 19 | pick(country, ['CA']); // TS2322: Type '"CA"' is not assignable to type '"KR" | "US" | "JP"' 20 | pick(country, ['KR']); // { KR: 'KR' } 21 | ``` 22 | -------------------------------------------------------------------------------- /packages/common/utils/src/object/pick.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | hide_title: true 3 | sidebar_label: pick 4 | --- 5 | 6 | # pick 7 | 8 | 지정한 key로만 이루어진 객체를 생성합니다. 9 | 10 | ## Example 11 | 12 | ```typescript 13 | const country = { 14 | KR: 'KR', 15 | US: 'US', 16 | JP: 'JP', 17 | } as const; 18 | 19 | pick(country, ['CA']); // TS2322: Type '"CA"' is not assignable to type '"KR" | "US" | "JP"' 20 | pick(country, ['KR']); // { KR: 'KR' } 21 | ``` 22 | -------------------------------------------------------------------------------- /packages/common/utils/src/parseName.ko.md: -------------------------------------------------------------------------------- 1 | # parseName 2 | 3 | 한글 이름을 `[성, 이름]`으로 분류하는 parser 입니다. 4 | 5 | - 다음과 같은 규칙을 따릅니다: 6 | - 두 글자 이름: `[성, 이름]` 7 | - 세 글자 이름: 8 | - 두 글자 성씨: `['', 풀네임]` 9 | - 한 글자 성씨: `[성, 이름]` 10 | - 그 외: `['', 풀네임]` 11 | 12 | ## Example 13 | 14 | ```typescript 15 | parseName('김토스'); // => ['김', '토스'] 16 | parseName('이도'); // => ['이', '도'] 17 | parseName('김나박이'); // => ['', '김나박이'] 18 | parseName('John Doe'); // => ['', 'John Doe'] 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/utils/src/partition.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package. 4 | */ 5 | export function partition(items: T[], predicate: (item: T) => boolean): [T[], T[]] { 6 | const first: T[] = []; 7 | const second: T[] = []; 8 | 9 | for (const item of items) { 10 | if (predicate(item)) { 11 | first.push(item); 12 | } else { 13 | second.push(item); 14 | } 15 | } 16 | 17 | return [first, second]; 18 | } 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/range.spec.ts: -------------------------------------------------------------------------------- 1 | import { range } from './range'; 2 | 3 | describe('range 함수는', () => { 4 | it('start부터 end-1까지의 범위를 생성합니다.', () => { 5 | expect(range(1, 5)).toEqual([1, 2, 3, 4]); 6 | }); 7 | 8 | it('end를 생략한 경우 start를 0, end를 start로 설정해서 range를 생성합니다.', () => { 9 | expect(range(4)).toEqual([0, 1, 2, 3]); 10 | }); 11 | 12 | it('range를 생성할 때 step으로 간격을 둘 수 있습니다.', () => { 13 | expect(range(1, 11, 3)).toEqual([1, 4, 7, 10]); 14 | }); 15 | }); 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/range.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package. 4 | */ 5 | export function range(start: number, end?: number, step = 1): number[] { 6 | const _start = end === undefined ? 0 : start; 7 | const _end = end === undefined ? start : end; 8 | 9 | const output = []; 10 | let current = _start; 11 | while (current < _end) { 12 | output.push(current); 13 | current += step; 14 | } 15 | return output; 16 | } 17 | -------------------------------------------------------------------------------- /packages/common/utils/src/reverseKeyValue.en.md: -------------------------------------------------------------------------------- 1 | # reverseKeyValue 2 | 3 | Returns an object in the form of { [value]: key } by swapping key and value 4 | 5 | ```typescript 6 | function reverseKeyValue( 7 | obj: Record 8 | ): Record; 9 | ``` 10 | 11 | ## Example 12 | 13 | ```typescript 14 | reverseKeyValue({ jbee: 'eebj' }); 15 | // => { eebj: 'jbee' } 16 | ``` 17 | -------------------------------------------------------------------------------- /packages/common/utils/src/reverseKeyValue.ko.md: -------------------------------------------------------------------------------- 1 | # reverseKeyValue 2 | 3 | key와 value를 바꿔 { [value]: key } 형태의 object를 반환합니다. 4 | 5 | ```typescript 6 | function reverseKeyValue( 7 | obj: Record 8 | ): Record; 9 | ``` 10 | 11 | ## Example 12 | 13 | ```typescript 14 | reverseKeyValue({ jbee: 'eebj' }); 15 | // => { eebj: 'jbee' } 16 | ``` 17 | -------------------------------------------------------------------------------- /packages/common/utils/src/reverseKeyValue.spec.ts: -------------------------------------------------------------------------------- 1 | import { reverseKeyValue } from './reverseKeyValue'; 2 | 3 | describe('reverseKeyValue 함수는', () => { 4 | it('key와 value를 바꿔 { [value]: key } 형태의 object를 반환한다.', () => { 5 | expect(reverseKeyValue({ jbee: 'eebj' })).toEqual({ eebj: 'jbee' }); 6 | }); 7 | }); 8 | -------------------------------------------------------------------------------- /packages/common/utils/src/reverseKeyValue.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package as `invert`. 4 | */ 5 | export function reverseKeyValue(obj: Record) { 6 | return Object.fromEntries(Object.entries(obj).map(([key, value]) => [value, key])) as Record; 7 | } 8 | -------------------------------------------------------------------------------- /packages/common/utils/src/scrollRestoration.en.md: -------------------------------------------------------------------------------- 1 | # scrollRestoration.set 2 | 3 | This is a helper that helps you easily set/clear related to scrollRestoration. 4 | 5 | ## Example 6 | 7 | ```typescript 8 | useEffect(() => { 9 | const clear = scrollRestoration.set('manual'); 10 | return () => clear(); 11 | }, []); 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/common/utils/src/scrollRestoration.ko.md: -------------------------------------------------------------------------------- 1 | # scrollRestoration.set 2 | 3 | scrollRestoration 관련 set/clear를 쉽게 할 수 있도록 도와주는 helper입니다. 4 | 5 | ## Example 6 | 7 | ```typescript 8 | useEffect(() => { 9 | const clear = scrollRestoration.set('manual'); 10 | return () => clear(); 11 | }, []); 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/common/utils/src/setFocusTimeout.spec.ts: -------------------------------------------------------------------------------- 1 | import { setFocusTimeout } from './setFocusTimeout'; 2 | 3 | describe('setFocusTimeout', () => { 4 | it('should focus on the input after the specified delay', async () => { 5 | const input = document.createElement('input'); 6 | document.body.appendChild(input); 7 | 8 | await setFocusTimeout(() => input.focus(), 1000); 9 | 10 | expect(document.activeElement).toBe(input); 11 | document.body.removeChild(input); 12 | }); 13 | }); 14 | -------------------------------------------------------------------------------- /packages/common/utils/src/shuffle.en.md: -------------------------------------------------------------------------------- 1 | # shuffle 2 | 3 | Duplicates the Array passed as an argument, shuffles the order and returns it. 4 | https://stackoverflow.com/questions/2450954/how-to-randomize-shuffle-a-javascript-array 5 | 6 | ```typescript 7 | function shuffle(array: T[]): T[]; 8 | ``` 9 | 10 | ## Example 11 | 12 | ```typescript 13 | shuffle([1, 2, 3]); // [2, 3, 1]... 14 | ``` 15 | -------------------------------------------------------------------------------- /packages/common/utils/src/shuffle.ko.md: -------------------------------------------------------------------------------- 1 | # shuffle 2 | 3 | 인자로 전달받은 Array를 복제하여 순서를 랜덤으로 섞고 리턴합니다. 4 | https://stackoverflow.com/questions/2450954/how-to-randomize-shuffle-a-javascript-array 5 | 6 | ```typescript 7 | function shuffle(array: T[]): T[]; 8 | ``` 9 | 10 | ## Example 11 | 12 | ```typescript 13 | shuffle([1, 2, 3]); // [2, 3, 1]... 14 | ``` 15 | -------------------------------------------------------------------------------- /packages/common/utils/src/sum.en.md: -------------------------------------------------------------------------------- 1 | # sum 2 | 3 | Find the sum of a number. 4 | 5 | ```typescript 6 | function sum(...nums: number[] | number[][]): number; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```typescript 12 | sum(1, 2, 3); // 6 13 | sum(...[1, 2, 3]); // 6 14 | sum([1, 2, 3]); // 6 15 | ``` 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/sum.ko.md: -------------------------------------------------------------------------------- 1 | # sum 2 | 3 | 숫자의 합을 구합니다. 4 | 5 | ```typescript 6 | function sum(...nums: number[] | number[][]): number; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```typescript 12 | sum(1, 2, 3); // 6 13 | sum(...[1, 2, 3]); // 6 14 | sum([1, 2, 3]); // 6 15 | ``` 16 | -------------------------------------------------------------------------------- /packages/common/utils/src/sum.spec.ts: -------------------------------------------------------------------------------- 1 | import { sum } from './sum'; 2 | 3 | describe('sum은', () => { 4 | it('인자로 받은 숫자들의 합을 반환합니다.', () => { 5 | expect(sum(1, 2, 3)).toBe(6); 6 | }); 7 | 8 | it('인자로 받은 배열의 숫자들을 합하여 반환합니다.', () => { 9 | expect(sum([1, 2, 3])).toBe(6); 10 | }); 11 | }); 12 | -------------------------------------------------------------------------------- /packages/common/utils/src/sum.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package. 4 | */ 5 | export function sum(...nums: number[] | number[][]) { 6 | return nums.flat().reduce((acc, curr) => { 7 | return acc + curr; 8 | }, 0); 9 | } 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/uniq.en.md: -------------------------------------------------------------------------------- 1 | # uniq 2 | 3 | Removes duplicates from an array by leaving only one identical value. Same is determined by the [SameValueZero operation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness#same-value-zero_equality). 4 | 5 | ```typescript 6 | uniq( 7 | // Array to remove duplicates from 8 | arr: T[] 9 | ): T[] 10 | ``` 11 | 12 | ## Example 13 | 14 | ```typescript 15 | uniq([1, 2, 2, 3]); // [1, 2, 3] 16 | ``` 17 | -------------------------------------------------------------------------------- /packages/common/utils/src/uniq.ko.md: -------------------------------------------------------------------------------- 1 | # uniq 2 | 3 | 배열에서 동일한 값을 하나만 남겨서 중복을 제거합니다. 동일한지 여부는 [SameValueZero 연산](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness#same-value-zero_equality)로 판단합니다. 4 | 5 | ```typescript 6 | uniq( 7 | // 중복을 제거할 배열 8 | arr: T[] 9 | ): T[] 10 | ``` 11 | 12 | ## Example 13 | 14 | ```typescript 15 | uniq([1, 2, 2, 3]); // [1, 2, 3] 16 | ``` 17 | -------------------------------------------------------------------------------- /packages/common/utils/src/uniq.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package. 4 | */ 5 | export function uniq(arr: T[]): T[] { 6 | return [...new Set(arr)]; 7 | } 8 | -------------------------------------------------------------------------------- /packages/common/utils/src/uniqBy.ko.md: -------------------------------------------------------------------------------- 1 | # uniqBy 2 | 3 | 배열에서 중복을 제거하여, 동일한 값을 하나만 남깁니다. `hasher` 함수의 값을 바탕으로 동일 여부를 판단합니다. 4 | 5 | ```typescript 6 | uniqBy( 7 | // 중복을 제거할 배열 8 | arr: T[], 9 | // 동일한지 여부를 판단할 hash를 생성하는 함수 10 | hasher: (x: T) => unknown 11 | ) 12 | ``` 13 | 14 | ## Example 15 | 16 | ```typescript 17 | uniqBy([{ x: 1 }, { x: 2 }, { x: 1 }], item => item.x); // [{ x: 1 }, { x: 2 }] 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/utils/src/uniqBy.spec.ts: -------------------------------------------------------------------------------- 1 | import { uniqBy } from './uniqBy'; 2 | 3 | describe('uniqBy는', () => { 4 | it('hasher에 맞춰 잘 uniq 연산을 수행한다', () => { 5 | const result = uniqBy([{ key: 1 }, { key: 2 }, { key: 1 }], x => x.key); 6 | 7 | expect(result).toEqual([{ key: 1 }, { key: 2 }]); 8 | }); 9 | }); 10 | -------------------------------------------------------------------------------- /packages/common/utils/src/uniqWith.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * @deprecated This feature is now available in the es-toolkit package. 4 | */ 5 | export function uniqWith(arr: T[], comparator: (x: T, y: T) => boolean) { 6 | const result: T[] = []; 7 | 8 | for (const item of arr) { 9 | if (result.some(x => comparator(x, item))) { 10 | continue; 11 | } 12 | 13 | result.push(item); 14 | } 15 | 16 | return result; 17 | } 18 | -------------------------------------------------------------------------------- /packages/common/utils/src/zip.en.md: -------------------------------------------------------------------------------- 1 | # zip 2 | 3 | Performs a zip operation on an Array. 4 | 5 | ```typescript 6 | zip( 7 | // The array on which the zip operation will be performed 8 | ...arrays: [...T] 9 | ): Zipped 10 | ``` 11 | 12 | ## Example 13 | 14 | ```javascript 15 | zip([1, 2], ['a', 'b']) --> [[1, 'a'], [2, 'b']]; 16 | ``` 17 | -------------------------------------------------------------------------------- /packages/common/utils/src/zip.ko.md: -------------------------------------------------------------------------------- 1 | # zip 2 | 3 | Array의 zip 연산을 수행합니다. 4 | 5 | ```typescript 6 | zip( 7 | // zip 연산이 수행될 배열 8 | ...arrays: [...T] 9 | ): Zipped 10 | ``` 11 | 12 | ## Example 13 | 14 | ```javascript 15 | zip([1, 2], ['a', 'b']) --> [[1, 'a'], [2, 'b']]; 16 | ``` 17 | -------------------------------------------------------------------------------- /packages/common/utils/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/utils/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/validators/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "eslint.nodePath": "../../../.yarn/sdks", 3 | "prettier.prettierPath": "../../../.yarn/sdks/prettier/index.js", 4 | "typescript.tsdk": "../../../.yarn/sdks/typescript/lib", 5 | "typescript.enablePromptUseWorkspaceTsdk": true, 6 | "search.exclude": { 7 | "**/.yarn": true, 8 | "**/.pnp.*": true, 9 | "**/.next": true 10 | }, 11 | "prettier.configPath": "../../../.prettierrc" 12 | } 13 | -------------------------------------------------------------------------------- /packages/common/validators/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/common/validators/jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('@toss/jest').config({ 2 | rootDir: __dirname, 3 | }); 4 | -------------------------------------------------------------------------------- /packages/common/validators/jest.setup.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/toss/slash/570759f2edbc9c6f413cb2ee6ab828073f61402a/packages/common/validators/jest.setup.ts -------------------------------------------------------------------------------- /packages/common/validators/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/common/validators/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './validators/is-age'; 3 | export * from './validators/is-birth-date-6'; 4 | export * from './validators/is-email'; 5 | export * from './validators/is-home-phone'; 6 | export * from './validators/is-mobile-phone'; 7 | export * from './validators/is-rrn'; 8 | export * from './validators/is-사업자번호'; 9 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-age.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: isAge 3 | --- 4 | 5 | # isAge 6 | 7 | Checks whether a given string is a valid age. 8 | 9 | ```typescript 10 | function isAge(ageInput: string): boolean; 11 | ``` 12 | 13 | ## Examples 14 | 15 | ```typescript 16 | isAge('25'); // true 17 | isAge('asd'); // false 18 | isAge('24.3'); // false 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-age.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: isAge 3 | --- 4 | 5 | # isAge 6 | 7 | 주어진 문자열이 유효한 나이인지 검사합니다. 8 | 9 | ```typescript 10 | function isAge(ageInput: string): boolean; 11 | ``` 12 | 13 | ## Examples 14 | 15 | ```typescript 16 | isAge('25'); // true 17 | isAge('asd'); // false 18 | isAge('24.3'); // false 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-age.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export function isAge(ageInput: string): boolean { 3 | if (!/^\d*$/.test(ageInput)) { 4 | return false; 5 | } 6 | 7 | return Number(ageInput) > 0; 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-birth-date-6.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: isBirthDate6 3 | --- 4 | 5 | # isBirthDate6 6 | 7 | Checks that the given string is a valid six digits of the date of birth. 8 | 9 | ```typescript 10 | function isBirthDate6(birthDate: string): boolean; 11 | ``` 12 | 13 | ## Examples 14 | 15 | ```typescript 16 | isBirthDate6('980211'); // true 17 | isBirthDate6('19960729'); // false 18 | isBirthDate6('foobar'); // false 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-birth-date-6.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: isBirthDate6 3 | --- 4 | 5 | # isBirthDate6 6 | 7 | 주어진 문자열이 올바른 생년월일 여섯자리인지 검증합니다. 8 | 9 | ```typescript 10 | function isBirthDate6(birthDate: string): boolean; 11 | ``` 12 | 13 | ## Examples 14 | 15 | ```typescript 16 | isBirthDate6('980211'); // true 17 | isBirthDate6('19960729'); // false 18 | isBirthDate6('foobar'); // false 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-birth-date-6.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { isValid, parse } from 'date-fns'; 3 | 4 | export function isBirthDate6(birthDate: string) { 5 | const parsed = parse(birthDate, 'yyMMdd', new Date()); 6 | 7 | return isValid(parsed); 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-email.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: isEmail 3 | --- 4 | 5 | # isEmail 6 | 7 | Check that the email address complies with the RFC 5322 standard. [RFC 5322](https://emailregex.com/) 8 | 9 | ```typescript 10 | function isEmail(email: string): boolean; 11 | ``` 12 | 13 | ## Examples 14 | 15 | ```typescript 16 | isEmail('johndoe@example.com'); // true 17 | isEmail('johndoe@example.'); // false 18 | isEmail('johndoe@example.com123'); // false 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-email.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: isEmail 3 | --- 4 | 5 | # isEmail 6 | 7 | 이메일 주소가 RFC 5322 표준을 따르는지 검사합니다. [RFC 5322](https://emailregex.com/) 8 | 9 | ```typescript 10 | function isEmail(email: string): boolean; 11 | ``` 12 | 13 | ## Examples 14 | 15 | ```typescript 16 | isEmail('johndoe@example.com'); // true 17 | isEmail('johndoe@example.'); // false 18 | isEmail('johndoe@example.com123'); // false 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-email.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export function isEmail(email: string) { 3 | const re = 4 | /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 5 | return re.test(String(email).toLowerCase()); 6 | } 7 | 8 | export { isEmail as isEmailValid }; 9 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-home-phone.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: isHomePhone 3 | --- 4 | 5 | # isHomePhone 6 | 7 | Check that the given string is a home phone number (or Internet phone, business representative phone). 8 | 9 | ```typescript 10 | function isHomePhone(value: string): boolean; 11 | ``` 12 | 13 | ## Examples 14 | 15 | ```typescript 16 | isHomePhone('0215994905'); // true 17 | isHomePhone('01022223333'); // false 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-home-phone.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: isHomePhone 3 | --- 4 | 5 | # isHomePhone 6 | 7 | 주어진 문자열이 집전화번호 (또는 인터넷 전화, 통신사업자 대표전화) 인지 확인합니다. 8 | 9 | ```typescript 10 | function isHomePhone(value: string): boolean; 11 | ``` 12 | 13 | ## Examples 14 | 15 | ```typescript 16 | isHomePhone('0215994905'); // true 17 | isHomePhone('01022223333'); // false 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-home-phone.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export function isHomePhone(value: string) { 3 | return /^0(2|3[1-3]|4[1-4]|5[1-5]|6[1-4])[ -]?\d{3,4}[ -]?\d{4}$/.test(value); 4 | } 5 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-mobile-phone.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export function isMobilePhone(phone: string) { 3 | const re = /^((\+?82)[ -]?)?0?1([0|1|6|7|8|9]{1})[ -]?\d{3,4}[ -]?\d{4}$/; 4 | return re.test(phone); 5 | } 6 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-사업자번호.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: isBusinessRegNo 3 | --- 4 | 5 | # isBusinessRegNo 6 | 7 | Business number validation 8 | 9 | - https://myhappyman.tistory.com/129 10 | 11 | ```typescript 12 | function isBusinessRegNo(value: string): boolean; 13 | ``` 14 | 15 | ## Examples 16 | 17 | ```typescript 18 | isBusinessRegNo('1231231231'); // true 19 | isBusinessRegNo('12312312312'); // false 20 | ``` 21 | -------------------------------------------------------------------------------- /packages/common/validators/src/validators/is-사업자번호.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: is사업자번호 3 | --- 4 | 5 | # is사업자번호 6 | 7 | 사업자번호 유효성 검사 8 | 9 | - https://myhappyman.tistory.com/129 10 | 11 | ```typescript 12 | function is사업자번호(value: string): boolean; 13 | ``` 14 | 15 | ## Examples 16 | 17 | ```typescript 18 | is사업자번호('1231231231'); // true 19 | is사업자번호('12312312312'); // false 20 | ``` 21 | -------------------------------------------------------------------------------- /packages/common/validators/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/validators/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/common/validators/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/a11y/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/a11y/jest.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-var-requires */ 2 | module.exports = require('@toss/jest').config({ 3 | rootDir: __dirname, 4 | testEnvironment: 'jsdom', 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/a11y/jest.setup.ts: -------------------------------------------------------------------------------- 1 | import '@testing-library/jest-dom'; 2 | -------------------------------------------------------------------------------- /packages/react/a11y/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/a11y/src/ScreenReaderOnly/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './ScreenReaderOnly'; 3 | -------------------------------------------------------------------------------- /packages/react/a11y/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './ScreenReaderOnly'; 3 | -------------------------------------------------------------------------------- /packages/react/a11y/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/a11y/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/a11y/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/async-boundary/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/async-boundary/jest.setup.ts: -------------------------------------------------------------------------------- 1 | import '@testing-library/jest-dom'; 2 | -------------------------------------------------------------------------------- /packages/react/async-boundary/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/async-boundary/src/hooks/useResetError.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { useCallback, useState } from 'react'; 3 | 4 | export default function useResetError() { 5 | const [id, setId] = useState(0); 6 | const refresh = useCallback(() => setId(prev => prev + 1), []); 7 | 8 | return [id, refresh] as const; 9 | } 10 | -------------------------------------------------------------------------------- /packages/react/async-boundary/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import AsyncBoundary from './AsyncBoundary'; 3 | import useResetError from './hooks/useResetError'; 4 | import withAsyncBoundary from './withAsyncBoundary'; 5 | 6 | export * from './provider/AsyncBoundaryProvider'; 7 | export { AsyncBoundary, useResetError, withAsyncBoundary }; 8 | -------------------------------------------------------------------------------- /packages/react/async-boundary/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/async-boundary/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/async-boundary/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/async-stylesheet/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/async-stylesheet/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/async-stylesheet/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export { default } from './AsyncStylesheet'; 3 | -------------------------------------------------------------------------------- /packages/react/async-stylesheet/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/async-stylesheet/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/async-stylesheet/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "eslint.nodePath": "../../../.yarn/sdks", 3 | "prettier.prettierPath": "../../../.yarn/sdks/prettier/index.js", 4 | "typescript.tsdk": "../../../.yarn/sdks/typescript/lib", 5 | "typescript.enablePromptUseWorkspaceTsdk": true, 6 | "search.exclude": { 7 | "**/.yarn": true, 8 | "**/.pnp.*": true, 9 | "**/.next": true 10 | }, 11 | "prettier.configPath": "../../../.prettierrc" 12 | } 13 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: '../../../babel.config.js', 3 | }; 4 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/jest.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-var-requires */ 2 | module.exports = require('@toss/jest').config({ 3 | rootDir: __dirname, 4 | testEnvironment: 'jsdom', 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/jest.setup.ts: -------------------------------------------------------------------------------- 1 | import '@testing-library/jest-dom'; 2 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/Fullheight.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: FullHeight 3 | --- 4 | 5 | # FullHeight 6 | 7 | A div container with a height of `window.innerHeight`. 8 | When CSR, the `height` is specified via `useLayoutEffect`. 9 | 10 | This is useful when implementing pages that fill mobile screens. 11 | 12 | ## Examples 13 | 14 | ```jsx 15 | 16 | 17 | 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/Fullheight.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: FullHeight 3 | --- 4 | 5 | # FullHeight 6 | 7 | height가 `window.innerHeight`인 div 컨테이너입니다. 8 | CSR일 때 `useLayoutEffect`를 통해 `height`가 지정됩니다. 9 | 10 | 모바일 화면을 꽉 채우는 페이지를 구현할 때 유용합니다. 11 | 12 | ## Examples 13 | 14 | ```jsx 15 | 16 | 17 | 18 | ``` 19 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/coerceCssPixelValue.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: coerceCssPixelValue 3 | --- 4 | 5 | # coerceCssPixelValue 6 | 7 | Change CSS value to string value. 8 | 9 | ## Examples 10 | 11 | ```ts 12 | coerceCssPixelValue(4); 13 | // => '4px' 14 | 15 | coerceCssPixelValue('100%'); 16 | // => '100%' 17 | 18 | coerceCssPixelValue('4px'); 19 | // => '4px' 20 | ``` 21 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/coerceCssPixelValue.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: coerceCssPixelValue 3 | --- 4 | 5 | # coerceCssPixelValue 6 | 7 | CSS value를 string value로 변경합니다. 8 | 9 | ## Examples 10 | 11 | ```ts 12 | coerceCssPixelValue(4); 13 | // => '4px' 14 | 15 | coerceCssPixelValue('100%'); 16 | // => '100%' 17 | 18 | coerceCssPixelValue('4px'); 19 | // => '4px' 20 | ``` 21 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/coerceCssPixelValue.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { CSSPixelValue } from './types'; 3 | 4 | export function coerceCssPixelValue(value: CSSPixelValue): string { 5 | return typeof value === 'string' ? value : `${value}px`; 6 | } 7 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './flex'; 3 | export * from './gutter'; 4 | export * from './spacing'; 5 | export * from './Stack'; 6 | export * from './utils'; 7 | export * from './coerceCssPixelValue'; 8 | export * from './box-spacing'; 9 | export * from './types'; 10 | export * from './mediaQuery'; 11 | export * from './SafeArea'; 12 | export * from './FullHeight'; 13 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/mediaQuery.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: mediaQuery 3 | --- 4 | 5 | # mediaQuery 6 | 7 | A utility that makes it easy to write media queries. 8 | 9 | ## Examples 10 | 11 | ```jsx 12 | const ResizableBox = styled.button` 13 | width: 300px; 14 | 15 | ${mediaQuery('(max-width: 500px)')` 16 | width: 100px; 17 | `} 18 | `; 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/mediaQuery.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: mediaQuery 3 | --- 4 | 5 | # mediaQuery 6 | 7 | Media query를 쉽게 작성할 수 있는 유틸리티 입니다. 8 | 9 | ## Examples 10 | 11 | ```jsx 12 | const ResizableBox = styled.button` 13 | width: 300px; 14 | 15 | ${mediaQuery('(max-width: 500px)')` 16 | width: 100px; 17 | `} 18 | `; 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/utils/block.ts: -------------------------------------------------------------------------------- 1 | import { css } from '@emotion/react'; 2 | 3 | /** 4 | * @description display: block 스타일을 위한 유틸리티 5 | * 6 | * ```ts 7 | * const block: SerializedStyles; 8 | * ``` 9 | */ 10 | export const block = css` 11 | display: block; 12 | `; 13 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/utils/height.ts: -------------------------------------------------------------------------------- 1 | import { css } from '@emotion/react'; 2 | 3 | /** 4 | * @name height100 5 | * @description height 100%를 적용하기 위한 유틸리티 6 | * 7 | * ```ts 8 | * const height100: SerializedStyles; 9 | * ``` 10 | */ 11 | export const height100 = css` 12 | height: 100%; 13 | `; 14 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/utils/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './block'; 3 | export * from './ellipsis'; 4 | export * from './height'; 5 | export * from './position'; 6 | export * from './resetAnchor'; 7 | export * from './resetButton'; 8 | export * from './resetList'; 9 | export * from './resetSearchTypeInput'; 10 | export * from './size'; 11 | export * from './touchable'; 12 | export * from './visuallyHidden'; 13 | export * from './width'; 14 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/utils/resetAnchor.ts: -------------------------------------------------------------------------------- 1 | import { css } from '@emotion/react'; 2 | 3 | /** 4 | * @description ``의 기본 스타일을 제거하는 유틸리티입니다. 5 | * 6 | * ```ts 7 | * const resetAnchor: SerializedStyles; 8 | * ``` 9 | */ 10 | export const resetAnchor = css` 11 | text-decoration: none; 12 | `; 13 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/utils/resetList.ts: -------------------------------------------------------------------------------- 1 | import { css } from '@emotion/react'; 2 | 3 | /** 4 | * @name resetButton 5 | * @description list(`
    `, `
      `)의 기본 스타일을 제거하는 유틸리티입니다. 6 | * 7 | * ```ts 8 | * const resetList: SerializedStyles; 9 | * ``` 10 | */ 11 | export const resetList = css` 12 | margin: 0; 13 | margin-block-start: 0; 14 | margin-block-end: 0; 15 | padding-inline-start: 0; 16 | padding-left: 0; 17 | list-style: none; 18 | `; 19 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/utils/touchable.ts: -------------------------------------------------------------------------------- 1 | import { css } from '@emotion/react'; 2 | 3 | /** 4 | * @description 터치가 가능하다는 걸 드러내는 스타일입니다. 5 | * 6 | * ```ts 7 | * const touchable: SerializedStyles; 8 | * ``` 9 | */ 10 | export const touchable = css` 11 | cursor: pointer; 12 | -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1); 13 | `; 14 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/utils/visuallyHidden.ts: -------------------------------------------------------------------------------- 1 | import { css } from '@emotion/react'; 2 | 3 | /** 4 | * @description 시각적으로 보이지 않게 만드는 스타일링 5 | * 6 | * ```ts 7 | * const visuallyHidden: SerializedStyles; 8 | * ``` 9 | */ 10 | export const visuallyHidden = css` 11 | position: absolute; 12 | width: 1px; 13 | height: 1px; 14 | margin: -1px; 15 | padding: 0; 16 | overflow: hidden; 17 | border: 0; 18 | clip: rect(0, 0, 0, 0); 19 | `; 20 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/src/utils/width.ts: -------------------------------------------------------------------------------- 1 | import { css } from '@emotion/react'; 2 | 3 | /** 4 | * @name width100 5 | * @description width 100%를 적용하기 위한 유틸리티 6 | * 7 | * ```ts 8 | * const width100: SerializedStyles; 9 | * ``` 10 | */ 11 | export const width100 = css` 12 | width: 100%; 13 | `; 14 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/emotion-utils/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "jsxImportSource": "@emotion/react", 6 | "outDir": "./dist" 7 | }, 8 | "include": ["src"] 9 | } 10 | -------------------------------------------------------------------------------- /packages/react/error-boundary/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/error-boundary/jest.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-var-requires */ 2 | module.exports = require('@toss/jest').config({ 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/react/error-boundary/jest.setup.ts: -------------------------------------------------------------------------------- 1 | import '@testing-library/jest-dom'; 2 | -------------------------------------------------------------------------------- /packages/react/error-boundary/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/error-boundary/src/hooks/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export { useIsChanged } from './useIsChanged'; 3 | export { useKey } from './useKey'; 4 | -------------------------------------------------------------------------------- /packages/react/error-boundary/src/hooks/useIsChanged.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { usePrevious } from '@toss/react'; 3 | 4 | export const useIsChanged = (value: unknown) => usePrevious(value) !== value; 5 | -------------------------------------------------------------------------------- /packages/react/error-boundary/src/hooks/useKey.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { useCallback, useState } from 'react'; 3 | 4 | export const useKey = (): [number, () => void] => { 5 | const [key, setKey] = useState(0); 6 | const refresh = useCallback(() => setKey(prev => prev + 1), []); 7 | 8 | return [key, refresh]; 9 | }; 10 | -------------------------------------------------------------------------------- /packages/react/error-boundary/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export { ErrorBoundary, useErrorBoundary, withErrorBoundary } from './ErrorBoundary'; 3 | export { ErrorBoundaryGroup, useErrorBoundaryGroup } from './ErrorBoundaryGroup'; 4 | export { withErrorBoundaryGroup } from './withErrorBoundaryGroup'; 5 | -------------------------------------------------------------------------------- /packages/react/error-boundary/src/types/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { ComponentProps, JSXElementConstructor } from 'react'; 3 | 4 | export type ComponentPropsWithoutChildren> = 5 | Omit, 'children'>; 6 | -------------------------------------------------------------------------------- /packages/react/error-boundary/src/withErrorBoundaryGroup.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: withErrorBoundaryGroup 3 | --- 4 | 5 | # withErrorBoundaryGroup 6 | 7 | 주어진 컴포넌트를 `ErrorBoundaryGroup`로 감싸는 Higher-order component 입니다. 8 | 자세한 사용법은 [ErrorBoundaryGroup](https://slash.page/ko/libraries/react/error-boundary/src/ErrorBoundaryGroup.i18n) 에 대한 문서를 참조하세요. 9 | 10 | ## Examples 11 | 12 | ```jsx 13 | const MyComponent = withErrorBoundaryGroup(여러_ErrorBoundary가_포함된_컴포넌트, { 14 | blockOutside: true, 15 | }); 16 | ``` 17 | -------------------------------------------------------------------------------- /packages/react/error-boundary/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/error-boundary/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/error-boundary/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "include": ["src"] 4 | } 5 | -------------------------------------------------------------------------------- /packages/react/framer-motion/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/framer-motion/jest.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-var-requires */ 2 | module.exports = require('@toss/jest').config({ 3 | testEnvironment: 'jsdom', 4 | rootDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/framer-motion/jest.setup.ts: -------------------------------------------------------------------------------- 1 | import '@testing-library/jest-dom'; 2 | -------------------------------------------------------------------------------- /packages/react/framer-motion/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/framer-motion/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './motion'; 3 | -------------------------------------------------------------------------------- /packages/react/framer-motion/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/framer-motion/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/framer-motion/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/impression-area/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "eslint.nodePath": "../../../.yarn/sdks", 3 | "prettier.prettierPath": "../../../.yarn/sdks/prettier/index.js", 4 | "typescript.tsdk": "../../../.yarn/sdks/typescript/lib", 5 | "typescript.enablePromptUseWorkspaceTsdk": true, 6 | "search.exclude": { 7 | "**/.yarn": true, 8 | "**/.pnp.*": true, 9 | "**/.next": true 10 | }, 11 | "prettier.configPath": "../../../.prettierrc" 12 | } 13 | -------------------------------------------------------------------------------- /packages/react/impression-area/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/impression-area/jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('@toss/jest').config({ 2 | testEnvironment: 'jsdom', 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/react/impression-area/jest.setup.ts: -------------------------------------------------------------------------------- 1 | import '@testing-library/jest-dom'; 2 | -------------------------------------------------------------------------------- /packages/react/impression-area/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/impression-area/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './ImpressionArea'; 3 | export * from './useImpressionRef'; 4 | -------------------------------------------------------------------------------- /packages/react/impression-area/src/testing/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './mockViewport'; 3 | export * from './mockVisibility'; 4 | 5 | -------------------------------------------------------------------------------- /packages/react/impression-area/testing.d.ts: -------------------------------------------------------------------------------- 1 | export * from './dist/testing'; 2 | -------------------------------------------------------------------------------- /packages/react/impression-area/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/impression-area/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "module": "esnext", 5 | "outDir": "./esm" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /packages/react/impression-area/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "target": "es6", 5 | "module": "commonjs", 6 | "declaration": true, 7 | "noUncheckedIndexedAccess": true, 8 | "outDir": "./dist" 9 | }, 10 | "include": ["src"], 11 | "exclude": ["jest.setup.ts"] 12 | } 13 | -------------------------------------------------------------------------------- /packages/react/lottie/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/lottie/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/lottie/src/AnimationData.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { Asset } from './Asset'; 3 | 4 | interface JSONAnimationData { 5 | json: string; 6 | assets?: Asset[]; 7 | } 8 | 9 | interface URLAnimationData { 10 | url: string; 11 | assets?: Asset[]; 12 | version?: string | number; 13 | } 14 | 15 | export type AnimationData = JSONAnimationData | URLAnimationData; 16 | 17 | export const SPEED_DEFAULT = 1; 18 | -------------------------------------------------------------------------------- /packages/react/lottie/src/Asset.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export interface Asset { 3 | id: string; 4 | url: string; 5 | } 6 | -------------------------------------------------------------------------------- /packages/react/lottie/src/LottieRef.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export interface LottieRef { 3 | start: () => void; 4 | stop: () => void; 5 | play: () => void; 6 | pause: () => void; 7 | } 8 | -------------------------------------------------------------------------------- /packages/react/lottie/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './AnimationData'; 3 | export * from './importLottie'; 4 | export * from './Lottie'; 5 | export * from './LottieRef'; 6 | -------------------------------------------------------------------------------- /packages/react/lottie/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/lottie/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/lottie/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/react-query/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/react-query/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/react-query/src/hooks/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './useQuery'; 3 | export * from './useSuspendedInfiniteQuery'; 4 | export * from './useSuspendedQuery'; 5 | -------------------------------------------------------------------------------- /packages/react/react-query/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './hooks'; 3 | -------------------------------------------------------------------------------- /packages/react/react-query/src/utils/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './isQueryKey'; 3 | export * from './parseQueryArgs'; 4 | -------------------------------------------------------------------------------- /packages/react/react-query/src/utils/isQueryKey/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { QueryKey } from 'react-query'; 3 | 4 | export function isQueryKey(value: any): value is QueryKey { 5 | return typeof value === 'string' || Array.isArray(value); 6 | } 7 | -------------------------------------------------------------------------------- /packages/react/react-query/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"], 8 | "exclude": ["**/*.test.*", "**/*.spec.*", "**/*.test-d.*"] 9 | } 10 | -------------------------------------------------------------------------------- /packages/react/react-query/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/react-query/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/react/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/react/jest.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-var-requires */ 2 | module.exports = require('@toss/jest').config({ 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/react/react/jest.setup.ts: -------------------------------------------------------------------------------- 1 | import '@testing-library/jest-dom'; 2 | -------------------------------------------------------------------------------- /packages/react/react/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/react/src/components/ClickArea/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './ClickArea'; 3 | -------------------------------------------------------------------------------- /packages/react/react/src/components/DebounceClick/DebounceClick.en.md: -------------------------------------------------------------------------------- 1 | # DebounceClick 2 | 3 | A utility component that allows you to apply a debounce to a click event. 4 | 5 | ## Example 6 | 7 | ```jsx 8 | 9 | 16 | 17 | ``` 18 | -------------------------------------------------------------------------------- /packages/react/react/src/components/DebounceClick/DebounceClick.ko.md: -------------------------------------------------------------------------------- 1 | # DebounceClick 2 | 3 | click event에 debounce를 적용할 수 있는 유틸 컴포넌트입니다. 4 | 5 | ## Example 6 | 7 | ```jsx 8 | 9 | 16 | 17 | ``` 18 | -------------------------------------------------------------------------------- /packages/react/react/src/components/DebounceClick/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './DebounceClick'; 3 | -------------------------------------------------------------------------------- /packages/react/react/src/components/HiddenHeading/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './HiddenHeading'; 3 | -------------------------------------------------------------------------------- /packages/react/react/src/components/OpenGraph/OpenGraph.en.md: -------------------------------------------------------------------------------- 1 | # OpenGraph 2 | 3 | A component that allows you to apply [OpenGraph](https://nowonbun.tistory.com/517) (title, description, image when sharing) to the current page. 4 | 5 | ## Example 6 | 7 | ```jsx 8 | 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/react/react/src/components/OpenGraph/OpenGraph.ko.md: -------------------------------------------------------------------------------- 1 | # OpenGraph 2 | 3 | 현재 페이지에 [OpenGraph](https://nowonbun.tistory.com/517) (공유 시 타이틀, 설명, 이미지) 를 적용할 수 있도록 하는 컴포넌트입니다. 4 | 5 | ## Example 6 | 7 | ```jsx 8 | 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/react/react/src/components/OpenGraph/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './OpenGraph'; 3 | -------------------------------------------------------------------------------- /packages/react/react/src/components/OutsideClick/index.ts: -------------------------------------------------------------------------------- 1 | export * from './OutsideClick'; 2 | -------------------------------------------------------------------------------- /packages/react/react/src/components/Separated/Seperated.en.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Separated 3 | --- 4 | 5 | # Separated 6 | 7 | Used when 8 | 9 | ```tsx 10 | }> 11 | {LIST.map(item => ( 12 |
      item.title
      13 | ))} 14 |       15 | ``` 16 | -------------------------------------------------------------------------------- /packages/react/react/src/components/Separated/Seperated.ko.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Separated 3 | --- 4 | 5 | # Separated 6 | 7 | 각 요소 사이에 반복되는 컴포넌트를 삽입하고자 할 때 사용할 수 있는 편리한 컴포넌트입니다. 8 | 9 | ```tsx 10 | }> 11 | {LIST.map(item => ( 12 |
      item.title
      13 | ))} 14 |       15 | ``` 16 | -------------------------------------------------------------------------------- /packages/react/react/src/components/Separated/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './Separated'; 3 | -------------------------------------------------------------------------------- /packages/react/react/src/components/SwitchCase/SwitchCase.ko.md: -------------------------------------------------------------------------------- 1 | # SwitchCase 2 | 3 | switch-case 구문을 선언적으로 사용할 수 있는 컴포넌트입니다 4 | 5 | ## Example 6 | 7 | ```jsx 8 | , 13 | b: , 14 | c: , 15 | }} 16 | // status 값이 아무것도 해당되지 않는 경우, 이 컴포넌트가 render 됩니다. 17 | defaultComponent={} 18 | /> 19 | ``` 20 | -------------------------------------------------------------------------------- /packages/react/react/src/components/SwitchCase/index.tsx: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './SwitchCase'; 3 | -------------------------------------------------------------------------------- /packages/react/react/src/components/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './ClickArea'; 3 | export * from './DebounceClick'; 4 | export * from './HiddenHeading'; 5 | export * from './OpenGraph'; 6 | export * from './OutsideClick'; 7 | export * from './Separated'; 8 | export * from './SwitchCase'; 9 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useBodyClass.en.md: -------------------------------------------------------------------------------- 1 | # useBodyClass 2 | 3 | You can add className to document.body. 4 | 5 | ```ts 6 | function useBodyClass(className: string): void; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```ts 12 | useBodyClass('foo'); 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useBodyClass.ko.md: -------------------------------------------------------------------------------- 1 | # useBodyClass 2 | 3 | document.body 에 className을 추가할 수 있습니다. 4 | 5 | ```ts 6 | function useBodyClass(className: string): void; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```ts 12 | useBodyClass('foo'); 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useBodyClass.ts: -------------------------------------------------------------------------------- 1 | import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect'; 2 | 3 | /** @tossdocs-ignore */ 4 | export function useBodyClass(className: string) { 5 | useIsomorphicLayoutEffect(() => { 6 | document.body.classList.add(className); 7 | 8 | return () => { 9 | document.body.classList.remove(className); 10 | }; 11 | }, [className]); 12 | } 13 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useBooleanState.en.md: -------------------------------------------------------------------------------- 1 | # useBooleanState 2 | 3 | A hook that makes it easy to use useState as a boolean type. 4 | 5 | ```ts 6 | function useBooleanState(defaultValue = false): readonly [bool, setTrue, setFalse, toggle]; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```ts 12 | const [open, openBottomSheet, closeBottomSheet, toggleBottomSheet] = useBooleanState(false); 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useBooleanState.ko.md: -------------------------------------------------------------------------------- 1 | # useBooleanState 2 | 3 | boolean 타입으로 useState를 쉽게 사용할 수 있는 hook 입니다. 4 | 5 | ```ts 6 | function useBooleanState(defaultValue = false): readonly [bool, setTrue, setFalse, toggle]; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```ts 12 | const [open, openBottomSheet, closeBottomSheet, toggleBottomSheet] = useBooleanState(false); 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useCallbackOnce.en.md: -------------------------------------------------------------------------------- 1 | # useCallbackOnce 2 | 3 | Similar to `useCallback`, but runs the callback only once, the first time. 4 | 5 | Can be used to define an effect to run only on mount. 6 | 7 | ## Example 8 | 9 | ```ts 10 | const openAlert = useCallbackOnce(() => { 11 | alert('This alert is only called once'); 12 | }, []); 13 | 14 | useEffect(() => { 15 | openAlert(); 16 | }, [openAlert]); 17 | ``` 18 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useCallbackOnce.ko.md: -------------------------------------------------------------------------------- 1 | # useCallbackOnce 2 | 3 | `useCallback`과 유사하지만 콜백을 최초 단 1회만 실행합니다. 4 | 5 | mount 시에만 실행할 effect를 정의하는 데에 사용할 수 있습니다. 6 | 7 | ## Example 8 | 9 | ```ts 10 | const openAlert = useCallbackOnce(() => { 11 | alert('이 alert은 1번만 호출돼요'); 12 | }, []); 13 | 14 | useEffect(() => { 15 | openAlert(); 16 | }, [openAlert]); 17 | ``` 18 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useDebounce.en.md: -------------------------------------------------------------------------------- 1 | # useDebounce 2 | 3 | This hook makes it easy to use `lodash/debounce`. 4 | 5 | ## Example 6 | 7 | ```ts 8 | // This function will debounce at 500ms. 9 | const handleClick = useDebounce(() => { 10 | getV2Logger().log(schemaId, parameter); 11 | }, 500); 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useDebounce.ko.md: -------------------------------------------------------------------------------- 1 | # useDebounce 2 | 3 | `lodash/debounce` 를 쉽게 사용할 수 있는 hook 입니다. 4 | 5 | ## Example 6 | 7 | ```ts 8 | // 이 함수는 500ms 기준으로 debounce 됩니다. 9 | const handleClick = useDebounce(() => { 10 | getV2Logger().log(schemaId, parameter); 11 | }, 500); 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useDidUpdate.en.md: -------------------------------------------------------------------------------- 1 | # useDidUpdate 2 | 3 | Execute effect when the values that went into deps have been updated. 4 | 5 | - The effect is not executed on initial mount. 6 | - This is similar to the componentDidUpdate() method. 7 | 8 | ## Example 9 | 10 | ```ts 11 | useDidUpdate(() => { 12 | // Execute when value 'changes' 13 | }, [value]); 14 | ``` 15 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useDidUpdate.ko.md: -------------------------------------------------------------------------------- 1 | # useDidUpdate 2 | 3 | deps로 들어간 값이 업데이트 되었을 때 effect를 실행합니다. 4 | 5 | - 최초 마운트 시에는 effect가 실행되지 않습니다. 6 | - componentDidUpdate() 메소드와 비슷합니다. 7 | 8 | ## Example 9 | 10 | ```ts 11 | useDidUpdate(() => { 12 | // value가 '바뀌면' 실행됨 13 | }, [value]); 14 | ``` 15 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useForceUpdate.en.md: -------------------------------------------------------------------------------- 1 | # useForceUpdate 2 | 3 | Running the returned function will force a re-render. 4 | 5 | ## Example 6 | 7 | ```ts 8 | const forceUpdate = useForceUpdate(); 9 | 10 | const set = useCallback( 11 | (items: T[]) => { 12 | listRef.current = items; 13 | forceUpdate(); 14 | }, 15 | [forceUpdate] 16 | ); 17 | ``` 18 | 19 | ## Note 20 | 21 | https://github.com/streamich/react-use/pull/837 There is an opinion that useReducer is lighter than state. 22 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useForceUpdate.ko.md: -------------------------------------------------------------------------------- 1 | # useForceUpdate 2 | 3 | 반환된 함수를 실행 시 강제로 리렌더가 실행됩니다. 4 | 5 | ## Example 6 | 7 | ```ts 8 | const forceUpdate = useForceUpdate(); 9 | 10 | const set = useCallback( 11 | (items: T[]) => { 12 | listRef.current = items; 13 | forceUpdate(); 14 | }, 15 | [forceUpdate] 16 | ); 17 | ``` 18 | 19 | ## Note 20 | 21 | https://github.com/streamich/react-use/pull/837 useReducer가 state보다 가볍다는 의견이 있습니다. 22 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useForceUpdate.ts: -------------------------------------------------------------------------------- 1 | import { useReducer } from 'react'; 2 | 3 | const updater = (num: number): number => (num + 1) % 1_000_000; 4 | 5 | /** @tossdocs-ignore */ 6 | export function useForceUpdate(): () => void { 7 | const [, forceUpdate] = useReducer(updater, 0); 8 | 9 | return forceUpdate; 10 | } 11 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useHotjarTracker.en.md: -------------------------------------------------------------------------------- 1 | # useHotjarTracker 2 | 3 | A hook to easily add hotjar script tags. 4 | 5 | ## Example 6 | 7 | ```ts 8 | useHotjarTracker({ 9 | id: 1579349, 10 | enable: getOperationalEnvironment() === 'live', 11 | }); 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useHotjarTracker.ko.md: -------------------------------------------------------------------------------- 1 | # useHotjarTracker 2 | 3 | hotjar 관련 script 태그를 쉽게 추가할 수 있는 hook 입니다. 4 | 5 | ## Example 6 | 7 | ```ts 8 | useHotjarTracker({ 9 | id: 1579349, 10 | enable: getOperationalEnvironment() === 'live', 11 | }); 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useInputState.en.md: -------------------------------------------------------------------------------- 1 | # useInputState 2 | 3 | Use when you need a two-way binding to an input. 4 | 5 | ## Example 6 | 7 | ```jsx 8 | const [value, handleInputChange] = useInputState(''); 9 | 10 | return ; 11 | ``` 12 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useInputState.ko.md: -------------------------------------------------------------------------------- 1 | # useInputState 2 | 3 | Input에 two way binding이 필요할 때 사용합니다. 4 | 5 | ## Example 6 | 7 | ```jsx 8 | const [value, handleInputChange] = useInputState(''); 9 | 10 | return ; 11 | ``` 12 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useIsMounted.spec.tsx: -------------------------------------------------------------------------------- 1 | import { renderHook } from '@testing-library/react'; 2 | import { useIsMounted } from './useIsMounted'; 3 | 4 | describe('useIsMounted', () => { 5 | it('should return "true" when mounted', () => { 6 | const { result } = renderHook(() => useIsMounted()); 7 | 8 | expect(result.current).toBe(true); 9 | }); 10 | }); 11 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useIsMounted.ts: -------------------------------------------------------------------------------- 1 | import { useEffect, useState } from 'react'; 2 | 3 | /** @tossdocs-ignore */ 4 | export function useIsMounted() { 5 | const [mounted, setMounted] = useState(false); 6 | useEffect(() => { 7 | setMounted(true); 8 | }, []); 9 | return mounted; 10 | } 11 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useIsMountedRef.ts: -------------------------------------------------------------------------------- 1 | import { useEffect, useRef } from 'react'; 2 | 3 | export function useIsMountedRef() { 4 | const ref = useRef({ isMounted: true }).current; 5 | 6 | useEffect(() => { 7 | ref.isMounted = true; 8 | return () => { 9 | ref.isMounted = false; 10 | }; 11 | }, [ref]); 12 | 13 | return ref; 14 | } 15 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useIsomorphicLayoutEffect.en.md: -------------------------------------------------------------------------------- 1 | # useIsomorphicLayoutEffect 2 | 3 | This hook allows you to use the useLayoutEffect method on the client-side and the useEffect method on the server-side. 4 | 5 | This function is used because using the useLayoutEffect function on the server-side causes a warning error. 6 | 7 | ## Example 8 | 9 | ```ts 10 | useIsomorphicLayoutEffect(() => { 11 | setSwipeRefreshEnabled(false); 12 | }, []); 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useIsomorphicLayoutEffect.ko.md: -------------------------------------------------------------------------------- 1 | # useIsomorphicLayoutEffect 2 | 3 | Client-side에서는 useLayoutEffect 방식을 쓰고, Server-side에서는 useEffect 방식을 쓰도록 하는 hook 입니다. 4 | 5 | Server-side에서는 useLayoutEffect 함수를 사용하면 warning 오류가 발생하기 때문에 사용하는 함수입니다. 6 | 7 | ## Example 8 | 9 | ```ts 10 | useIsomorphicLayoutEffect(() => { 11 | setSwipeRefreshEnabled(false); 12 | }, []); 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useIsomorphicLayoutEffect.ts: -------------------------------------------------------------------------------- 1 | import { isClient } from '@toss/utils'; 2 | import { useEffect, useLayoutEffect } from 'react'; 3 | 4 | /** @tossdocs-ignore */ 5 | export const useIsomorphicLayoutEffect = isClient() ? useLayoutEffect : useEffect; 6 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/usePrevious.ts: -------------------------------------------------------------------------------- 1 | import { useEffect, useRef } from 'react'; 2 | 3 | /** @tossdocs-ignore */ 4 | export function usePrevious(value: T, { defaultValue }: { defaultValue?: T } = {}): T { 5 | const ref = useRef(defaultValue != null ? defaultValue : value); 6 | 7 | useEffect(() => { 8 | ref.current = value; 9 | }, [value]); 10 | 11 | return ref.current; 12 | } 13 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useStyleSheetInjection.en.md: -------------------------------------------------------------------------------- 1 | # useStyleSheetInjection 2 | 3 | A hook that allows you to inject a CSS string. 4 | The style tag form goes into the head tag as appendChild. 5 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useStyleSheetInjection.ko.md: -------------------------------------------------------------------------------- 1 | # useStyleSheetInjection 2 | 3 | css 문자열을 inject 할 수 있는 hook입니다. 4 | style 태그 형태가 head 태그에 appendChild로 들어갑니다. 5 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useThrottle.en.md: -------------------------------------------------------------------------------- 1 | # useThrottle 2 | 3 | This hook makes it easy to use lodash/throttle. 4 | 5 | ## Example 6 | 7 | ```ts 8 | const handleSubmitAnswer = useThrottle(() => { 9 | setSubmitQuizAnswer(); 10 | mutate(); 11 | }, 200); 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useThrottle.ko.md: -------------------------------------------------------------------------------- 1 | # useThrottle 2 | 3 | lodash/throttle 를 쉽게 사용할 수 있는 hook 입니다. 4 | 5 | ## Example 6 | 7 | ```ts 8 | const handle정답제출 = useThrottle(() => { 9 | set퀴즈정답제출(); 10 | mutate(); 11 | }, 200); 12 | ``` 13 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useTimeout.en.md: -------------------------------------------------------------------------------- 1 | # useTimeout 2 | 3 | This hook provides a convenient way to use window.setTimeout. 4 | 5 | ## Example 6 | 7 | ```tsx 8 | function Example() { 9 | const [title, setTitle] = useState(''); 10 | 11 | useTimeout(() => { 12 | setTitle(`I'm looking for a product`); 13 | }, 2000); 14 | 15 | useTimeout(() => { 16 | setTitle(`Almost done`); 17 | }, 4000); 18 | 19 | return
      {title}
      ; 20 | } 21 | ``` 22 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useTimeout.ko.md: -------------------------------------------------------------------------------- 1 | # useTimeout 2 | 3 | window.setTimeout 를 편리하게 이용할 수 있는 hook 입니다. 4 | 5 | ## Example 6 | 7 | ```tsx 8 | function Example() { 9 | const [title, setTitle] = useState(''); 10 | 11 | useTimeout(() => { 12 | setTitle(`상품을 찾고있어요`); 13 | }, 2000); 14 | 15 | useTimeout(() => { 16 | setTitle(`거의 다 끝났어요`); 17 | }, 4000); 18 | 19 | return
      {title}
      ; 20 | } 21 | ``` 22 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useTimeoutQueue.en.md: -------------------------------------------------------------------------------- 1 | # useTimeoutQueue 2 | 3 | Hook to clean up tasks safely deferred by `setTimeout` on component unmount. 4 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useTimeoutQueue.ko.md: -------------------------------------------------------------------------------- 1 | # useTimeoutQueue 2 | 3 | 안전하게 `setTimeout`으로 뒤로 미뤄진 task를 컴포넌트 unmount 시 cleanup 해주는 hook 입니다. 4 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useToggleState.en.md: -------------------------------------------------------------------------------- 1 | # useToggleState 2 | 3 | A hook to easily toggle a boolean type of state. 4 | 5 | ```ts 6 | function useToggleState(defaultValue?: boolean): readonly [boolean, () => void]; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```ts 12 | const [bool, toggle] = useToggleState(false); 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useToggleState.ko.md: -------------------------------------------------------------------------------- 1 | # useToggleState 2 | 3 | boolean 타입의 state를 Toggle로 쉽게 사용할 수 있는 hook 입니다. 4 | 5 | ```ts 6 | function useToggleState(defaultValue?: boolean): readonly [boolean, () => void]; 7 | ``` 8 | 9 | ## Example 10 | 11 | ```ts 12 | const [bool, toggle] = useToggleState(false); 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useToggleState.ts: -------------------------------------------------------------------------------- 1 | import { useCallback, useState } from 'react'; 2 | 3 | /** @tossdocs-ignore */ 4 | export function useToggleState(defaultValue = false): readonly [boolean, () => void] { 5 | const [bool, setBool] = useState(defaultValue); 6 | 7 | const toggle = useCallback(() => { 8 | setBool(prevBool => !prevBool); 9 | }, []); 10 | 11 | return [bool, toggle] as const; 12 | } 13 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useVisibilityEvent.en.md: -------------------------------------------------------------------------------- 1 | # useVisibilityEvent 2 | 3 | Call the callback function when the document's visibilitychange event occurs. 4 | 5 | ## Example 6 | 7 | ```tsx 8 | type VisibilityState = Document['visibilityState']; 9 | 10 | function MyComponent() { 11 | const visibleCallbackFunc = (visibilityState: VisibilityState) => { 12 | alert(visibilityState); 13 | }; 14 | 15 | useVisibilityEvent(visibleCallbackFunc); 16 | } 17 | ``` 18 | -------------------------------------------------------------------------------- /packages/react/react/src/hooks/useVisibilityEvent.ko.md: -------------------------------------------------------------------------------- 1 | # useVisibilityEvent 2 | 3 | document의 visibilitychange 이벤트가 발생하면 callback 함수를 호출합니다. 4 | 5 | ## Example 6 | 7 | ```tsx 8 | type VisibilityState = Document['visibilityState']; 9 | 10 | function MyComponent() { 11 | const visibleCallbackFunc = (visibilityState: VisibilityState) => { 12 | alert(visibilityState); 13 | }; 14 | 15 | useVisibilityEvent(visibleCallbackFunc); 16 | } 17 | ``` 18 | -------------------------------------------------------------------------------- /packages/react/react/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './components'; 3 | export * from './hooks'; 4 | export * from './utils'; 5 | -------------------------------------------------------------------------------- /packages/react/react/src/utils/Style.test.tsx: -------------------------------------------------------------------------------- 1 | import { generateClassNames } from './Style'; 2 | 3 | describe('generateClassNames', () => { 4 | it('인자로 받은 오브젝트의 각 value에 PREFIX를 붙여준다', () => { 5 | expect(generateClassNames({ test: 'test' })).toMatchObject({ test: 'tossteam-react__test' }); 6 | }); 7 | }); 8 | -------------------------------------------------------------------------------- /packages/react/react/src/utils/convertNewlineToJSX.en.md: -------------------------------------------------------------------------------- 1 | # convertNewlineToJSX 2 | 3 | A util function that replaces newlines (`\n`) with `
      `. 4 | 5 | ## Example 6 | 7 | ```jsx 8 | {convertNewlineToJSX('There was a problem trying to sign in.\nplease try again.')} 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/react/react/src/utils/convertNewlineToJSX.ko.md: -------------------------------------------------------------------------------- 1 | # convertNewlineToJSX 2 | 3 | 개행(`\n`)을 `
      ` 으로 바꾸어주는 util 함수입니다. 4 | 5 | ## Example 6 | 7 | ```jsx 8 | {convertNewlineToJSX('로그인 시도 중 문제가 발생했습니다.\n다시 시도해 주세요.')} 9 | ``` 10 | -------------------------------------------------------------------------------- /packages/react/react/src/utils/convertNewlineToJSX.tsx: -------------------------------------------------------------------------------- 1 | /** @jsxImportSource react */ 2 | import { Fragment } from 'react'; 3 | 4 | /** @tossdocs-ignore */ 5 | export function convertNewlineToJSX(str: string) { 6 | const chunks = str.replace(/\\n/g, '\n').split('\n'); 7 | 8 | return chunks.map((line, index) => ( 9 | 10 | {index > 0 ?
      : null} 11 | {line} 12 |       13 | )); 14 | } 15 | -------------------------------------------------------------------------------- /packages/react/react/src/utils/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './buildContext'; 3 | export * from './convertNewlineToJSX'; 4 | -------------------------------------------------------------------------------- /packages/react/react/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/react/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/react/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/recoil/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "eslint.nodePath": "../../../.yarn/sdks", 3 | "prettier.prettierPath": "../../../.yarn/sdks/prettier/index.js", 4 | "typescript.tsdk": "../../../.yarn/sdks/typescript/lib", 5 | "typescript.enablePromptUseWorkspaceTsdk": true, 6 | "search.exclude": { 7 | "**/.yarn": true, 8 | "**/.pnp.*": true, 9 | "**/.next": true 10 | }, 11 | "prettier.configPath": "../../../.prettierrc" 12 | } 13 | -------------------------------------------------------------------------------- /packages/react/recoil/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/recoil/jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('@toss/jest').config({ 2 | testEnvironment: 'jsdom', 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/react/recoil/jest.setup.ts: -------------------------------------------------------------------------------- 1 | import '@testing-library/jest-dom'; 2 | -------------------------------------------------------------------------------- /packages/react/recoil/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/recoil/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './utils'; 3 | -------------------------------------------------------------------------------- /packages/react/recoil/src/utils/clearRecoilCache.en.md: -------------------------------------------------------------------------------- 1 | # clearRecoilCache 2 | 3 | Clear the selector cache in Recoil. Useful when testing with Jest. 4 | 5 | ### Examples 6 | 7 | ```typescript 8 | import { clearRecoilCache } from '@toss/recoil'; 9 | 10 | afterEach(() => { 11 | clearRecoilCache(); 12 | }); 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/react/recoil/src/utils/clearRecoilCache.ko.md: -------------------------------------------------------------------------------- 1 | # clearRecoilCache 2 | 3 | Recoil의 Selector Cache를 초기화합니다. Jest에서 테스트하는 경우에 유용합니다. 4 | 5 | `@toss/recoil` 에서 clearRecoilCache() 를 제공함으로써 beforeEach 등에서 리코일 캐시를 날리도록 합니다. 6 | 7 | ### Examples 8 | 9 | ```typescript 10 | import { clearRecoilCache } from '@toss/recoil'; 11 | 12 | afterEach(() => { 13 | clearRecoilCache(); 14 | }); 15 | ``` 16 | -------------------------------------------------------------------------------- /packages/react/recoil/src/utils/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './clearRecoilCache'; 3 | -------------------------------------------------------------------------------- /packages/react/recoil/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/recoil/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/recoil/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/redirect/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "eslint.nodePath": "../../../.yarn/sdks", 3 | "prettier.prettierPath": "../../../.yarn/sdks/prettier/index.js", 4 | "typescript.tsdk": "../../../.yarn/sdks/typescript/lib", 5 | "typescript.enablePromptUseWorkspaceTsdk": true, 6 | "search.exclude": { 7 | "**/.yarn": true, 8 | "**/.pnp.*": true, 9 | "**/.next": true 10 | }, 11 | "prettier.configPath": "../../../.prettierrc" 12 | } 13 | -------------------------------------------------------------------------------- /packages/react/redirect/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/redirect/jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('@toss/jest').config({ 2 | rootDir: __dirname, 3 | }); 4 | -------------------------------------------------------------------------------- /packages/react/redirect/jest.setup.ts: -------------------------------------------------------------------------------- 1 | import '@testing-library/jest-dom'; 2 | -------------------------------------------------------------------------------- /packages/react/redirect/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/redirect/src/base/boundary/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './RedirectionBoundary'; 3 | -------------------------------------------------------------------------------- /packages/react/redirect/src/base/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './boundary'; 3 | export * from './model'; 4 | -------------------------------------------------------------------------------- /packages/react/redirect/src/base/model/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './Redirection'; 3 | -------------------------------------------------------------------------------- /packages/react/redirect/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './base'; 3 | -------------------------------------------------------------------------------- /packages/react/redirect/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/redirect/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "module": "esnext", 5 | "outDir": "./esm" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /packages/react/redirect/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "target": "es6", 5 | "module": "commonjs", 6 | "declaration": true, 7 | "noUncheckedIndexedAccess": true, 8 | "outDir": "./dist" 9 | }, 10 | "include": ["src"], 11 | "exclude": ["jest.setup.ts"] 12 | } 13 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/jest.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-var-requires */ 2 | module.exports = require('@toss/jest').config({ 3 | testEnvironment: 'jsdom', 4 | rootDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/jest.setup.ts: -------------------------------------------------------------------------------- 1 | import '@testing-library/jest-dom'; 2 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/src/components/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './ScrollProgressController'; 3 | export * from './ScrollRevealAnimation'; 4 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/src/contexts/ScrollProgressContext.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { createContext } from 'react'; 3 | import type { WindowScrollPosition } from '../types'; 4 | 5 | export const ScrollProgressContext = createContext(undefined); 6 | if (process.env.NODE_ENV !== 'production') { 7 | ScrollProgressContext.displayName = 'ScrollProgressContext'; 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/src/contexts/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './ScrollProgressContext'; 3 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/src/hooks/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './useScrollProgress'; 3 | export * from './useWindowScrollPosition'; 4 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export { ScrollProgressController, ScrollRevealAnimation } from './components'; 3 | export { ScrollProgressContext } from './contexts'; 4 | export { useScrollProgress } from './hooks'; 5 | export { clipProgress, sliceProgress } from './utils'; 6 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/src/types/WindowScrollPosition.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export interface WindowScrollPosition { 3 | width: number; 4 | height: number; 5 | scrollX: number; 6 | scrollY: number; 7 | } 8 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/src/types/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './WindowScrollPosition'; 3 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/src/utils/clipProgress.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | /** 3 | * 0~1 사이의 값으로 만드는 함수 4 | */ 5 | export function clipProgress(progress: number) { 6 | return Math.min(Math.max(progress, 0), 1); 7 | } 8 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/src/utils/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './clipProgress'; 3 | export * from './getValueWithoutUnit'; 4 | export * from './sliceProgress'; 5 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/scroll-animation/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/use-funnel/.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "eslint.nodePath": "../../../.yarn/sdks", 3 | "prettier.prettierPath": "../../../.yarn/sdks/prettier/index.js", 4 | "typescript.tsdk": "../../../.yarn/sdks/typescript/lib", 5 | "typescript.enablePromptUseWorkspaceTsdk": true, 6 | "search.exclude": { 7 | "**/.yarn": true, 8 | "**/.pnp.*": true, 9 | "**/.next": true 10 | }, 11 | "prettier.configPath": "../../../.prettierrc" 12 | } 13 | -------------------------------------------------------------------------------- /packages/react/use-funnel/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/use-funnel/jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = require('@toss/jest').config({ 2 | testEnvironment: 'jsdom', 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/react/use-funnel/jest.setup.ts: -------------------------------------------------------------------------------- 1 | import '@testing-library/jest-dom'; 2 | import 'jest-localstorage-mock'; 3 | import { TextEncoder, TextDecoder } from 'util'; 4 | 5 | global.TextEncoder = TextEncoder; 6 | global.TextDecoder = TextDecoder; 7 | -------------------------------------------------------------------------------- /packages/react/use-funnel/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/use-funnel/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './useFunnel'; 3 | -------------------------------------------------------------------------------- /packages/react/use-funnel/src/models.ts: -------------------------------------------------------------------------------- 1 | import { NonEmptyArray } from '@toss/utils'; 2 | 3 | /** @tossdocs-ignore */ 4 | export type StepsType = Readonly>; 5 | -------------------------------------------------------------------------------- /packages/react/use-funnel/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/use-funnel/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "compilerOptions": { 4 | "module": "esnext", 5 | "outDir": "./esm" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /packages/react/use-funnel/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "target": "es6", 5 | "module": "commonjs", 6 | "declaration": true, 7 | "noUncheckedIndexedAccess": true, 8 | "outDir": "./dist" 9 | }, 10 | "include": ["src"], 11 | "exclude": ["jest.setup.ts"] 12 | } 13 | -------------------------------------------------------------------------------- /packages/react/use-loading/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/use-loading/jest.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-var-requires */ 2 | module.exports = require('@toss/jest').config({ 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/react/use-loading/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/use-loading/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export { useLoading } from './useLoading'; 3 | -------------------------------------------------------------------------------- /packages/react/use-loading/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/use-loading/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/use-loading/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/use-overlay/.npmignore: -------------------------------------------------------------------------------- 1 | *.md 2 | -------------------------------------------------------------------------------- /packages/react/use-overlay/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/use-overlay/jest.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-var-requires */ 2 | module.exports = require('@toss/jest').config({ 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/react/use-overlay/jest.setup.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | Object.defineProperty(exports, '__esModule', { value: true }); 3 | require('@testing-library/jest-dom'); 4 | //# sourceMappingURL=jest.setup.js.map 5 | -------------------------------------------------------------------------------- /packages/react/use-overlay/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/use-overlay/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export { OverlayProvider, OverlayContext } from './OverlayProvider'; 3 | export { useOverlay } from './useOverlay'; 4 | -------------------------------------------------------------------------------- /packages/react/use-overlay/src/types.tsx: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export type CreateOverlayElement = (props: { isOpen: boolean; close: () => void; exit: () => void }) => JSX.Element; 3 | -------------------------------------------------------------------------------- /packages/react/use-overlay/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/use-overlay/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/use-overlay/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/use-query-param/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { extends: '../../../babel.config.js' }; 2 | -------------------------------------------------------------------------------- /packages/react/use-query-param/jest.config.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable @typescript-eslint/no-var-requires */ 2 | module.exports = require('@toss/jest').config({ 3 | rootDir: __dirname, 4 | }); 5 | -------------------------------------------------------------------------------- /packages/react/use-query-param/jest.setup.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/toss/slash/570759f2edbc9c6f413cb2ee6ab828073f61402a/packages/react/use-query-param/jest.setup.ts -------------------------------------------------------------------------------- /packages/react/use-query-param/rollup.config.js: -------------------------------------------------------------------------------- 1 | const { generateRollupConfig } = require('@toss/rollup-config'); 2 | 3 | module.exports = generateRollupConfig({ 4 | packageDir: __dirname, 5 | }); 6 | -------------------------------------------------------------------------------- /packages/react/use-query-param/src/hooks/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './useNextRouter'; 3 | export * from './useQueryParam'; 4 | export * from './useQueryParams'; 5 | -------------------------------------------------------------------------------- /packages/react/use-query-param/src/hooks/useNextRouter.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import { useRouter } from 'next/router.js'; 3 | import { waitForRouterReady } from '../utils/waitForRouterReady'; 4 | 5 | interface Options { 6 | suspense?: boolean; 7 | } 8 | 9 | export function useNextRouter(options: Options = { suspense: true }) { 10 | const router = useRouter(); 11 | 12 | if (options.suspense && !router.isReady) { 13 | throw waitForRouterReady(); 14 | } 15 | 16 | return router; 17 | } 18 | -------------------------------------------------------------------------------- /packages/react/use-query-param/src/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | export * from './hooks'; 3 | -------------------------------------------------------------------------------- /packages/react/use-query-param/src/utils/index.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | // ts-prune-ignore-next 3 | export { renderWithSuspense } from './renderWithSuspense'; 4 | -------------------------------------------------------------------------------- /packages/react/use-query-param/src/utils/waitForRouterReady.ts: -------------------------------------------------------------------------------- 1 | /** @tossdocs-ignore */ 2 | import Router from 'next/router.js'; 3 | 4 | export function waitForRouterReady() { 5 | return new Promise(resolve => { 6 | Router.ready(resolve); 7 | }); 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/use-query-param/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.build.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/use-query-param/tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.esm.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./esm" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /packages/react/use-query-param/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../tsconfig.json", 3 | "compilerOptions": { 4 | "rootDir": "./src", 5 | "outDir": "./dist" 6 | }, 7 | "include": ["src"] 8 | } 9 | -------------------------------------------------------------------------------- /tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "exclude": ["**/jest.setup.ts", "**/*.test.*", "**/*.spec.*", "**/*.stories.*", "**/__storybook__/*"] 4 | } 5 | -------------------------------------------------------------------------------- /tsconfig.eslint.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.json", 3 | "include": ["./.eslintrc.js"] 4 | } 5 | -------------------------------------------------------------------------------- /tsconfig.esm.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.build.json", 3 | "compilerOptions": { 4 | "module": "esnext", 5 | } 6 | } 7 | --------------------------------------------------------------------------------