패키지 목록
@hua-labs/utils
v1.0.0
Utilities
TypeScript
공통 유틸리티 함수 모음. 문자열, 유효성 검사, 성능, 포맷터, 새니타이징.
$npm install @hua-labs/utils
유틸리티 카테고리
문자열 유틸
generateIdgenerateUUIDslugifytruncatetoCamelCasetoPascalCasetoSnakeCasetoKebabCasecapitalizetitleCase유효성 검사
validateEmailvalidatePasswordvalidateUrlvalidatePhoneNumbervalidateNumberRangevalidateStringLength성능 유틸
debouncethrottlememoizedelayretry포맷터
formatDateformatNumberformatFileSizeformatTimeAgo핵심 유틸리티: cn
Tailwind CSS 클래스를 안전하게 병합하는 유틸리티. clsx와 tailwind-merge 조합.
typescript
import { cn } from '@hua-labs/utils';
// 기본 사용
cn('px-4 py-2', 'bg-blue-500')
// => 'px-4 py-2 bg-blue-500'
// 조건부 클래스
cn('base-class', isActive && 'active-class', { 'disabled': isDisabled })
// => 'base-class active-class' (조건에 따라)
// Tailwind 충돌 해결
cn('px-4', 'px-6')
// => 'px-6' (tailwind-merge가 중복 해결)
// 컴포넌트에서 사용
function Button({ className, ...props }) {
return (
<button
className={cn('px-4 py-2 rounded bg-primary', className)}
{...props}
/>
);
}사용 예시
문자열 유틸
typescript
import { slugify, truncate, generateId, toCamelCase } from '@hua-labs/utils';
slugify('Hello World!') // 'hello-world'
truncate('Long text here', 8) // 'Long tex...'
generateId() // 'x7k9m2p4'
toCamelCase('hello_world') // 'helloWorld'유효성 검사
typescript
import { validateEmail, validatePassword, validateUrl } from '@hua-labs/utils';
validateEmail('test@example.com') // true
validatePassword('weak') // false
validateUrl('https://example.com') // true성능 유틸
typescript
import { debounce, throttle, retry } from '@hua-labs/utils';
// Debounce - 마지막 호출 후 300ms 대기
const debouncedSearch = debounce((query: string) => {
searchApi(query);
}, 300);
// Throttle - 100ms마다 최대 1회 실행
const throttledScroll = throttle(() => {
updatePosition();
}, 100);
// Retry - 3번까지 재시도
const result = await retry(() => fetchData(), { maxRetries: 3 });새니타이징
typescript
import { sanitizeInput, escapeHtml, maskEmailForLog } from '@hua-labs/utils';
sanitizeInput('<script>alert("xss")</script>')
// => 'alertxss'
escapeHtml('<div>Hello</div>')
// => '<div>Hello</div>'
maskEmailForLog('user@example.com')
// => 'u***@example.com'