@basiln/utils 0.1.4 → 0.1.6

package/src/Flex.tsx

@@ -1,51 +0,0 @@
-import { memo, type CSSProperties, type HTMLAttributes } from 'react';
-import { styled } from 'styled-components';
-
-import { coerceCssPixelValue, type CSSPixelValue } from './coerceCssPixelValue';
-
-type Justify = CSSProperties['justifyContent'];
-type Align = CSSProperties['alignItems'];
-type Direction = CSSProperties['flexDirection'];
-
-export type FlexProps = HTMLAttributes<HTMLDivElement> & {
-  gap?: CSSPixelValue;
-  justify?: Justify;
-  align?: Align;
-  direction?: Direction;
-};
-
-export const Flex = memo(function Flex(props: FlexProps) {
-  const {
-    gap = 0,
-    justify = 'center',
-    align = 'center',
-    direction = 'row',
-    children,
-    ...restProps
-  } = props;
-
-  return (
-    <Container
-      $gap={gap}
-      $justify={justify}
-      $align={align}
-      $direction={direction}
-      {...restProps}
-    >
-      {children}
-    </Container>
-  );
-});
-
-export const Container = styled.div<{
-  $gap: CSSPixelValue;
-  $justify: Justify;
-  $align: Align;
-  $direction: Direction;
-}>`
-  display: flex;
-  flex-direction: ${({ $direction }) => $direction};
-  gap: ${({ $gap }) => coerceCssPixelValue($gap)};
-  align-items: ${({ $align }) => $align};
-  justify-content: ${({ $justify }) => $justify};
-`;

package/src/Format.ts

@@ -1,54 +0,0 @@
-type Value = number | string;
-
-export const Format = {
-  phone: formatPhoneNumber,
-  removeHyphen,
-  commaize: formatCommaizeNumber,
-  padTime,
-};
-
-/**
- * 숫자를 전화번호 형식으로 변환합니다.
- * @example Format.phone('01012345678') // '010-1234-5678'
- */
-function formatPhoneNumber(phoneNumber: string) {
-  return phoneNumber
-    .replace(/[^0-9]/g, '')
-    .replace(/^(\d{0,3})(\d{0,4})(\d{0,4})$/g, '$1-$2-$3')
-    .replace(/(-{1,2})$/g, '');
-}
-
-/**
- * 하이픈을 제거합니다.
- * @example Format.removeHyphen('01012345678') // '01012345678'
- */
-function removeHyphen(value: string) {
-  return value.replaceAll('-', '');
-}
-
-/**
- * 숫자를 콤마로 구분합니다.
- * https://www.slash.page/ko/libraries/common/utils/src/Numbers_commaizeNumber.i18n
- *
- * @example
- * Format.commaize('123456') // '123,456'
- * Format.commaize(123456) // '123,456'
- */
-function formatCommaizeNumber(value: Value) {
-  const numStr = String(value);
-  const decimalPointIndex = numStr.indexOf('.');
-  const commaizeRegExp = /(\d)(?=(\d\d\d)+(?!\d))/g;
-
-  return decimalPointIndex > -1
-    ? numStr.slice(0, decimalPointIndex).replace(commaizeRegExp, '$1,') +
-        numStr.slice(decimalPointIndex)
-    : numStr.replace(commaizeRegExp, '$1,');
-}
-
-/**
- * 숫자를 2자리 수 형태로 변환합니다.
- * @example Format.padTime(9) // '09'
- */
-function padTime(value: Value) {
-  return String(value).padStart(2, '0');
-}

package/src/If.tsx

@@ -1,12 +0,0 @@
-import { type ReactNode } from 'react';
-
-export type IfProps = {
-  condition: boolean;
-  children: ReactNode;
-};
-
-export function If(props: IfProps) {
-  const { condition, children } = props;
-
-  return condition ? <>{children}</> : null;
-}

package/src/SafeArea.tsx

@@ -1,46 +0,0 @@
-import React, {
-  memo,
-  type ComponentPropsWithoutRef,
-  type ReactNode,
-} from 'react';
-
-import { Spacing } from './Spacing';
-import { useSafeArea } from './useSafeArea';
-
-export type SafeAreaProps<T extends React.ElementType = 'div'> = {
-  as?: T;
-  children: ReactNode;
-} & ComponentPropsWithoutRef<T>;
-
-export const SafeArea = <T extends React.ElementType = 'div'>({
-  as,
-  children,
-  ...props
-}: SafeAreaProps<T>) => {
-  const Component = as || 'div';
-
-  return (
-    <Component {...props}>
-      <SafeAreaTop />
-      {children}
-      <SafeAreaBottom />
-    </Component>
-  );
-};
-
-const SafeAreaTop = memo(function SafeAreaTop(
-  props: Omit<ComponentPropsWithoutRef<typeof Spacing>, 'size'>
-) {
-  const { top } = useSafeArea();
-  return <Spacing {...props} size={top} />;
-});
-
-const SafeAreaBottom = memo(function SafeAreaBottom(
-  props: Omit<ComponentPropsWithoutRef<typeof Spacing>, 'size'>
-) {
-  const { bottom } = useSafeArea();
-  return <Spacing {...props} size={bottom} />;
-});
-
-SafeArea.Top = SafeAreaTop;
-SafeArea.Bottom = SafeAreaBottom;

package/src/Spacing.tsx

@@ -1,30 +0,0 @@
-import { memo, type HTMLAttributes } from 'react';
-import { styled } from 'styled-components';
-
-import { coerceCssPixelValue, type CSSPixelValue } from './coerceCssPixelValue';
-
-type AxisDirection = 'vertical' | 'horizontal';
-
-export type SpacingProps = Omit<HTMLAttributes<HTMLDivElement>, 'children'> & {
-  direction?: AxisDirection;
-  size: CSSPixelValue;
-};
-
-export const Spacing = memo(function Spacing(props: SpacingProps) {
-  const { direction = 'vertical', size, ...restProps } = props;
-
-  return (
-    <SpacingContainer $direction={direction} $size={size} {...restProps} />
-  );
-});
-
-const SpacingContainer = styled.div<{
-  $direction: SpacingProps['direction'];
-  $size: SpacingProps['size'];
-}>`
-  flex: none;
-  width: ${({ $direction, $size }) =>
-    $direction === 'horizontal' ? coerceCssPixelValue($size) : undefined};
-  height: ${({ $direction, $size }) =>
-    $direction === 'vertical' ? coerceCssPixelValue($size) : undefined};
-`;

package/src/Validate.ts

@@ -1,25 +0,0 @@
-/**
- *
- * @see 이메일 주소가 RFC 5322 표준을 따르는지 검사합니다.  {@link https://emailregex.com/}
- */
-function isEmail(email: string) {
-  const regExp =
-    /^(([^<>()\[\]\\.,;:\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,}))$/;
-  return regExp.test(email);
-}
-
-function isPhoneNumber(phoneNumber: string) {
-  // 하이픈 있는 형식
-  const regExpWithHyphen = /^01([0|1|6|7|8|9])-([0-9]{3,4})-([0-9]{4})$/;
-  // 하이픈 없는 형식
-  const regExpWithoutHyphen = /^01([0|1|6|7|8|9])([0-9]{3,4})([0-9]{4})$/;
-
-  return (
-    regExpWithHyphen.test(phoneNumber) || regExpWithoutHyphen.test(phoneNumber)
-  );
-}
-
-export const Validate = {
-  email: isEmail,
-  phoneNumber: isPhoneNumber,
-};

package/src/coerceCssPixelValue.ts

@@ -1,5 +0,0 @@
-export type CSSPixelValue = string | number;
-
-export function coerceCssPixelValue(value: CSSPixelValue): string {
-  return typeof value === 'string' ? value : `${value}px`;
-}

package/src/composeEventHandlers.ts

@@ -1,18 +0,0 @@
-// @see https://github.com/radix-ui/primitives/blob/main/packages/core/primitive/src/primitive.tsx
-
-export function composeEventHandlers<E>(
-  originalEventHandler?: (event: E) => void,
-  ourEventHandler?: (event: E) => void,
-  { checkForDefaultPrevented = true } = {}
-) {
-  return function handleEvent(event: E) {
-    originalEventHandler?.(event);
-
-    if (
-      checkForDefaultPrevented === false ||
-      !(event as unknown as Event).defaultPrevented
-    ) {
-      return ourEventHandler?.(event);
-    }
-  };
-}

package/src/constants/josa.ts

@@ -1,72 +0,0 @@
-export const COMPLETE_HANGUL_START_CHARCODE = '가'.charCodeAt(0);
-export const COMPLETE_HANGUL_END_CHARCODE = '힣'.charCodeAt(0);
-
-export const NUMBER_OF_JONGSEONG = 28;
-export const NUMBER_OF_JUNGSEONG = 21;
-
-const DISASSEMBLED_CONSONANTS_BY_CONSONANT = {
-  '': '',
-  ㄱ: 'ㄱ',
-  ㄲ: 'ㄲ',
-  ㄳ: 'ㄱㅅ',
-  ㄴ: 'ㄴ',
-  ㄵ: 'ㄴㅈ',
-  ㄶ: 'ㄴㅎ',
-  ㄷ: 'ㄷ',
-  ㄸ: 'ㄸ',
-  ㄹ: 'ㄹ',
-  ㄺ: 'ㄹㄱ',
-  ㄻ: 'ㄹㅁ',
-  ㄼ: 'ㄹㅂ',
-  ㄽ: 'ㄹㅅ',
-  ㄾ: 'ㄹㅌ',
-  ㄿ: 'ㄹㅍ',
-  ㅀ: 'ㄹㅎ',
-  ㅁ: 'ㅁ',
-  ㅂ: 'ㅂ',
-  ㅃ: 'ㅃ',
-  ㅄ: 'ㅂㅅ',
-  ㅅ: 'ㅅ',
-  ㅆ: 'ㅆ',
-  ㅇ: 'ㅇ',
-  ㅈ: 'ㅈ',
-  ㅉ: 'ㅉ',
-  ㅊ: 'ㅊ',
-  ㅋ: 'ㅋ',
-  ㅌ: 'ㅌ',
-  ㅍ: 'ㅍ',
-  ㅎ: 'ㅎ',
-} as const;
-
-export const JONGSEONGS = (
-  [
-    '',
-    'ㄱ',
-    'ㄲ',
-    'ㄳ',
-    'ㄴ',
-    'ㄵ',
-    'ㄶ',
-    'ㄷ',
-    'ㄹ',
-    'ㄺ',
-    'ㄻ',
-    'ㄼ',
-    'ㄽ',
-    'ㄾ',
-    'ㄿ',
-    'ㅀ',
-    'ㅁ',
-    'ㅂ',
-    'ㅄ',
-    'ㅅ',
-    'ㅆ',
-    'ㅇ',
-    'ㅈ',
-    'ㅊ',
-    'ㅋ',
-    'ㅌ',
-    'ㅍ',
-    'ㅎ',
-  ] as const
-).map((consonant) => DISASSEMBLED_CONSONANTS_BY_CONSONANT[consonant]);

package/src/createContext.tsx

@@ -1,40 +0,0 @@
-import {
-  useMemo,
-  createContext as createContextRaw,
-  useContext as useContextRaw,
-  type PropsWithChildren,
-} from 'react';
-
-export function createContext<ContextValueType extends object | null>(
-  rootComponentName: string,
-  defaultContext?: ContextValueType
-) {
-  const Context = createContextRaw<ContextValueType | undefined>(
-    defaultContext
-  );
-
-  function Provider(props: PropsWithChildren<ContextValueType>) {
-    const { children, ...contextValues } = props;
-
-    const value = useMemo(
-      () => contextValues,
-      [contextValues]
-    ) as ContextValueType;
-
-    return <Context.Provider value={value}>{children}</Context.Provider>;
-  }
-
-  function useContext(consumerName: string) {
-    const context = useContextRaw(Context);
-    if (context == null) {
-      throw new Error(
-        `${consumerName}은 ${rootComponentName}하위에서 사용해야 합니다.`
-      );
-    }
-
-    return context;
-  }
-
-  Provider.displayName = `${rootComponentName}Provider`;
-  return [Provider, useContext] as const;
-}

package/src/debounce.ts

@@ -1,84 +0,0 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-
-export type DebouncedFunction<F extends (...args: any[]) => void> = {
-  (...args: Parameters<F>): void;
-
-  /**
-   * 디바운스된 함수의 모든 예약된 실행을 취소합니다.
-   * 이 메서드는 활성 타이머를 제거하고 저장된 컨텍스트나 인수를 재설정합니다.
-   */
-  cancel: () => void;
-
-  /**
-   * 예약된 실행이 있는 경우 디바운스된 함수를 즉시 호출합니다.
-   * 이 메서드는 현재 타이머를 취소하여 함수가 즉시 실행되도록 합니다.
-   */
-  flush: () => void;
-};
-
-/**
- * @example
- * const debouncedFunction = debounce(() => {
- *   console.log('Function executed');
- * }, 1000);
- *
- */
-export function debounce<F extends (...args: any[]) => void>(
-  func: F,
-  debounceMs: number
-): DebouncedFunction<F> {
-  let pendingCall: { thisArg: any; args: Parameters<F> } | null = null;
-
-  const invoke = () => {
-    if (pendingCall !== null) {
-      const { thisArg, args } = pendingCall;
-      func.apply(thisArg, args);
-      pendingCall = null;
-    }
-  };
-
-  const onTimerEnd = () => {
-    invoke();
-    cancel();
-  };
-
-  let timeoutId: ReturnType<typeof setTimeout> | null = null;
-
-  const schedule = () => {
-    if (timeoutId != null) {
-      clearTimeout(timeoutId);
-    }
-
-    timeoutId = setTimeout(() => {
-      timeoutId = null;
-      onTimerEnd();
-    }, debounceMs);
-  };
-
-  const cancelTimer = () => {
-    if (timeoutId !== null) {
-      clearTimeout(timeoutId);
-      timeoutId = null;
-    }
-  };
-
-  const cancel = () => {
-    cancelTimer();
-    pendingCall = null;
-  };
-
-  const flush = () => {
-    cancelTimer();
-    invoke();
-  };
-
-  const debounced = function (this: any, ...args: Parameters<F>) {
-    pendingCall = { thisArg: this, args };
-    schedule();
-  };
-
-  debounced.cancel = cancel;
-  debounced.flush = flush;
-
-  return debounced;
-}

package/src/ellipsis.ts

@@ -1,19 +0,0 @@
-import { css } from 'styled-components';
-
-export type MultiLineEllipsisProps = {
-  line: number;
-};
-
-export const ellipsis = css`
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-`;
-
-export const multiLineEllipsis = ({ line }: MultiLineEllipsisProps) => css`
-  display: -webkit-box;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  -webkit-line-clamp: ${line};
-  -webkit-box-orient: vertical;
-`;

package/src/getVar.ts

@@ -1,9 +0,0 @@
-export type VariableType = `--${string}`;
-
-export function getVar(variable: VariableType, defaultValue?: string) {
-  if (defaultValue) {
-    return `var(${variable}, ${defaultValue})`;
-  }
-
-  return `var(${variable})`;
-}

package/src/hasBatchim.ts

@@ -1,31 +0,0 @@
-import {
-  COMPLETE_HANGUL_END_CHARCODE,
-  COMPLETE_HANGUL_START_CHARCODE,
-  NUMBER_OF_JONGSEONG,
-} from './constants/josa';
-
-/**
- * 한글 음절의 받침 유무를 확인합니다.
- * @param str - 검사할 문자열
- * @returns 받침이 있으면 true, 없으면 false
- */
-export function hasBatchim(str: string): boolean {
-  const lastChar = str[str.length - 1];
-  if (!lastChar) return false;
-
-  const charCode = lastChar.charCodeAt(0);
-
-  // 한글 완성형 문자인지 확인
-  if (
-    charCode < COMPLETE_HANGUL_START_CHARCODE ||
-    charCode > COMPLETE_HANGUL_END_CHARCODE
-  ) {
-    return false;
-  }
-
-  // 받침 코드 계산
-  const batchimCode =
-    (charCode - COMPLETE_HANGUL_START_CHARCODE) % NUMBER_OF_JONGSEONG;
-
-  return batchimCode > 0; // 받침이 있으면 true
-}

package/src/hexToRgba.ts

@@ -1,45 +0,0 @@
-export type HexToRgbaProps = { hex: string; alpha?: number };
-
-function parseHexToDecimal(hex: string): number {
-  return parseInt(hex, 16);
-}
-
-function validateHex(hex: string): string {
-  const match = /^#?([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/.exec(hex);
-  if (!match) {
-    throw new Error(
-      `Invalid hex value: "${hex}". Expected formats: "#RGB", "RGB", "#RRGGBB", or "RRGGBB".`
-    );
-  }
-  return match[1];
-}
-
-function expandHex(hex: string): string {
-  return hex.length === 3
-    ? hex
-        .split('')
-        .map((char) => char + char)
-        .join('')
-    : hex;
-}
-
-function isValidAlpha(alpha: number): boolean {
-  return alpha >= 0 && alpha <= 1;
-}
-
-export function hexToRgba({ hex, alpha = 1 }: HexToRgbaProps): string {
-  if (!isValidAlpha(alpha)) {
-    throw new Error(
-      `Invalid alpha value. Must be between 0 and 1, received: ${alpha}`
-    );
-  }
-
-  const validatedHex = validateHex(hex);
-  const expandedHex = expandHex(validatedHex);
-
-  const r = parseHexToDecimal(expandedHex.slice(0, 2));
-  const g = parseHexToDecimal(expandedHex.slice(2, 4));
-  const b = parseHexToDecimal(expandedHex.slice(4, 6));
-
-  return `rgba(${r},${g},${b},${alpha})`;
-}

package/src/index.ts

@@ -1,38 +0,0 @@
-export {
-  Choose,
-  type ChooseWhenProps,
-  type ChooseProps,
-  type ChooseOtherwiseProps,
-} from './Choose';
-
-export { composeEventHandlers } from './composeEventHandlers';
-
-export { createContext } from './createContext';
-
-export { getVar, type VariableType } from './getVar';
-
-export { If, type IfProps } from './If';
-
-export { Flex, type FlexProps } from './Flex';
-
-export {
-  ellipsis,
-  multiLineEllipsis,
-  type MultiLineEllipsisProps,
-} from './ellipsis';
-
-export { hexToRgba, type HexToRgbaProps } from './hexToRgba';
-
-export { josa, type JosaProps } from './josa';
-
-export { Validate } from './Validate';
-
-export { Spacing, type SpacingProps } from './Spacing';
-
-export { useSafeArea, type SafeAreaCssValueProps } from './useSafeArea';
-
-export { SafeArea, type SafeAreaProps } from './SafeArea';
-
-export { queryString } from './queryString';
-
-export { debounce, type DebouncedFunction } from './debounce';

package/src/josa.ts

@@ -1,50 +0,0 @@
-import { hasBatchim } from './hasBatchim';
-
-type JosaOption = '이/가' | '을/를' | '은/는';
-
-type ExtractJosaOption<T> = T extends `${infer A}/${infer B}` ? A | B : never;
-
-export type JosaProps<U extends JosaOption> = {
-  word: string;
-  josa: U;
-};
-
-/**
- * 주어진 단어와 조사 옵션을 기반으로 올바른 조사를 반환합니다.
- * @returns 단어와 올바른 조사가 결합된 문자열
- */
-export function josa<U extends JosaOption>(
-  props: JosaProps<U>
-): `${JosaProps<U>['word']}${ExtractJosaOption<U>}` {
-  const { word, josa } = props;
-
-  if (!word) {
-    return word as `${JosaProps<U>['word']}${ExtractJosaOption<U>}`;
-  }
-
-  return `${word}${josaPicker({
-    word,
-    josa,
-  })}` as `${JosaProps<U>['word']}${ExtractJosaOption<U>}`;
-}
-
-/**
- * 주어진 단어와 조사 옵션을 기반으로 올바른 조사를 선택합니다.
- * @returns 올바른 조사
- */
-function josaPicker<U extends JosaOption>(
-  props: JosaProps<U>
-): ExtractJosaOption<U> {
-  const { word, josa } = props;
-
-  if (!word) {
-    return josa.split('/')[0] as ExtractJosaOption<U>;
-  }
-
-  const has받침 = hasBatchim(word);
-  const index = has받침 ? 0 : 1;
-
-  return josa.split('/')[index] as ExtractJosaOption<U>;
-}
-
-josa.pick = josaPicker;