@jects/jds 0.2.1 → 0.2.2

package/dist/tokens.js

@@ -1,8 +1,9 @@
+"use client";
 import {
   globalStyles,
   theme
-} from "./chunk-7WOJLKYD.js";
-import "./chunk-EGRHWZRV.js";
+} from "./chunk-E7NVFJQG.js";
+import "./chunk-NDUODUDN.js";
 export {
   globalStyles,
   theme

package/dist/utils.cjs

@@ -1,3 +1,4 @@
+"use client";
 "use strict";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;

package/dist/utils.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/index.ts","../src/utils/color.ts","../src/utils/cssUnit.ts","../src/utils/environment.ts","../src/utils/interaction.ts","../src/utils/interactionLayer.ts"],"sourcesContent":["export * from \"./color\";\nexport * from \"./cssUnit\";\nexport * from \"./environment\";\nexport * from \"./interaction\";\nexport * from \"./interactionLayer\";\n","/**\n * Hex 색상 코드를 RGBA로 변환하는 함수\n *\n * @param hex - Hex 색상 코드 (예: '#FF5733' 또는 'FF5733') 현재 토큰의 경우 #이 붙여져서 등록되어있음\n * @param alpha - 투명도 (0~1 사이의 값)\n * @returns RGBA 문자열 (예: 'rgba(255, 87, 51, 0.55)')\n *\n * @example\n * hexToRgba('토큰 명(혹은 실제 코드)',투명도)'\n * hexToRgba('#FF5733', 0.55) // 'rgba(255, 87, 51, 0.55)'\n * hexToRgba('FF5733', 1) // 'rgba(255, 87, 51, 1)'\n */\nexport function HexToRgba(hex: string, alpha: number): string {\n  const cleanedHex = hex.replace(\"#\", \"\");\n\n  const r = parseInt(cleanedHex.slice(0, 2), 16);\n  const g = parseInt(cleanedHex.slice(2, 4), 16);\n  const b = parseInt(cleanedHex.slice(4, 6), 16);\n\n  const validAlpha = Math.max(0, Math.min(1, alpha));\n\n  return `rgba(${r}, ${g}, ${b}, ${validAlpha})`;\n}\n","/**\n * px값을 rem 단위로 변환합니다\n * @param pixels - 변환할 px 값\n * @param baseFontSize - 기본 폰트 크기 (px 단위, 기본값: 16)\n * @param precision - 소수점 자릿수 (기본값: 4)\n * @returns rem 값이 포함된 문자열\n */\nexport function pxToRem(pixels: number, baseFontSize: number = 16, precision: number = 4): string {\n  return `${parseFloat((pixels / baseFontSize).toFixed(precision))}rem`;\n}\n\n/**\n * 특정 폰트 크기를 기준으로 스페이싱 값을 em 단위로 변환합니다\n * @param spacing - 변환할 스페이싱 값 (px단위)\n * @param fontSize - 기준이 되는 폰트 크기 (px단위)\n * @param precision - 소수점 자릿수 (기본값: 3)\n * @returns em 값이 포함된 문자열\n */\nexport function spacingToEm(spacing: number, fontSize: number, precision: number = 3): string {\n  return `${parseFloat((spacing / fontSize).toFixed(precision))}em`;\n}\n\n/**\n * px값으로부터 line-height 비율을 계산합니다\n * @param lineHeight - 줄 간격 값 (px단위)\n * @param fontSize - 폰트 크기 (px단위)\n * @param precision - 소수점 자릿수 (기본값: 1)\n * @returns 단위 없는 line-height 비율 문자열\n */\nexport function lineHeightRatio(\n  lineHeight: number,\n  fontSize: number,\n  precision: number = 1,\n): number {\n  return parseFloat((lineHeight / fontSize).toFixed(precision));\n}\n","import type { Theme } from \"@emotion/react\";\nimport type { Depth, Level, Shadow } from \"types\";\n\nexport function depth(theme: Theme, depthToken: Depth) {\n  if (depthToken === \"shallowest\") {\n    return { backgroundColor: theme.color.semantic.surface.shallowest };\n  } else if (depthToken === \"shallower\") {\n    return { backgroundColor: theme.color.semantic.surface.shallower };\n  } else if (depthToken === \"shallow\") {\n    return { backgroundColor: theme.color.semantic.surface.shallow };\n  } else if (depthToken === \"standard\") {\n    return { backgroundColor: theme.color.semantic.surface.standard };\n  } else if (depthToken === \"deep\") {\n    return { backgroundColor: theme.color.semantic.surface.deep };\n  } else if (depthToken === \"deeper\") {\n    return { backgroundColor: theme.color.semantic.surface.deeper };\n  } else if (depthToken === \"deepest\") {\n    return { backgroundColor: theme.color.semantic.surface.deepest };\n  }\n\n  return {};\n}\n\nexport function level(theme: Theme, levelToken: Level) {\n  if (levelToken === \"standard\") {\n    return { zIndex: \"auto\" as const };\n  } else if (levelToken === \"embossed\") {\n    return {\n      zIndex: 100,\n      ...shadow(theme, \"embossed\"),\n    };\n  } else if (levelToken === \"raised\") {\n    return {\n      zIndex: 200,\n      ...shadow(theme, \"raised\"),\n    };\n  } else if (levelToken === \"floated\") {\n    return {\n      zIndex: 300,\n      ...shadow(theme, \"floated\"),\n    };\n  } else if (levelToken === \"overlay\") {\n    return {\n      zIndex: 400,\n      ...shadow(theme, \"overlay\"),\n    };\n  }\n\n  return {};\n}\n\nexport function shadow(theme: Theme, shadowToken: Shadow) {\n  if (shadowToken === \"embossed\") {\n    return {\n      boxShadow: `0 0 ${theme.scheme.semantic.radius[2]} 0 ${theme.colorPrimitive.primitive.shade[2]}, \n                  0 2px ${theme.scheme.semantic.radius[4]} 0 ${theme.colorPrimitive.primitive.shade[4]}`,\n    };\n  } else if (shadowToken === \"raised\") {\n    return {\n      boxShadow: `0 0 ${theme.scheme.semantic.radius[2]} 0 ${theme.colorPrimitive.primitive.shade[6]}, \n                  0 3px ${theme.scheme.semantic.radius[6]} 0 ${theme.colorPrimitive.primitive.shade[12]}`,\n    };\n  } else if (shadowToken === \"floated\") {\n    return {\n      boxShadow: `0 0 ${theme.scheme.semantic.radius[2]} 0 ${theme.colorPrimitive.primitive.shade[4]}, \n                  0 3px ${theme.scheme.semantic.radius[4]} 0 ${theme.colorPrimitive.primitive.shade[8]}, \n                  0 4px ${theme.scheme.semantic.radius[8]} 0 ${theme.colorPrimitive.primitive.shade[12]}`,\n    };\n  } else if (shadowToken === \"overlay\") {\n    return {\n      boxShadow: `0 0 ${theme.scheme.semantic.radius[4]} 0 ${theme.colorPrimitive.primitive.shade[8]},\n                  0 3px ${theme.scheme.semantic.radius[8]} 0 ${theme.colorPrimitive.primitive.shade[12]},\n                  0 8px ${theme.scheme.semantic.radius[16]} 0 ${theme.colorPrimitive.primitive.shade[16]}`,\n    };\n  }\n\n  return {};\n}\n","import type { CSSObject, Theme } from \"@emotion/react\";\nimport type { Density, FillColor, InteractionState, Variant } from \"types\";\n\nexport function Interaction(\n  theme: Theme,\n  variant: Variant,\n  density: Density,\n  fillColor: FillColor,\n  state: InteractionState = \"default\",\n  borderRadius: string = \"inherit\",\n): CSSObject {\n  const createAfter = (backgroundColor: string): CSSObject => {\n    const baseStyle = {\n      position: \"relative\" as const,\n      outline: \"none\" as const,\n    };\n\n    const afterBaseStyle = {\n      content: '\"\"',\n      position: \"absolute\" as const,\n      top: 0,\n      left: 0,\n      width: \"100%\",\n      height: \"100%\",\n      backgroundColor: backgroundColor,\n      borderRadius,\n    };\n\n    if (state === \"locked\") {\n      return {\n        ...baseStyle,\n        \"::after\": { ...afterBaseStyle, opacity: 0.08 },\n      };\n    }\n\n    if (state === \"disabled\") {\n      return {\n        ...baseStyle,\n        \"::after\": { ...afterBaseStyle, opacity: 0.05 },\n      };\n    }\n\n    if (state === \"readonly\") {\n      return {\n        ...baseStyle,\n        \"::after\": { ...afterBaseStyle, opacity: 0 },\n      };\n    }\n\n    return {\n      ...baseStyle,\n      \"::after\": { ...afterBaseStyle, opacity: 0 },\n      \"&:hover::after\": { opacity: 0.08 },\n      \"&:active::after\": { opacity: 0.12 },\n      \"&:focus-visible\": { boxShadow: `0 0 0 3px ${theme.color.semantic.interaction.focus}` },\n    };\n  };\n\n  if (fillColor === \"default\") {\n    if (variant === \"normal\") {\n      if (density === \"bold\") return createAfter(theme.color.semantic.interaction.bold);\n      if (density === \"normal\") return createAfter(theme.color.semantic.interaction.normal);\n      if (density === \"assistive\") return createAfter(theme.color.semantic.interaction.assistive);\n      if (density === \"subtle\") return createAfter(theme.color.semantic.interaction.subtle);\n    } else if (variant === \"accent\") {\n      if (density === \"bold\") return createAfter(theme.color.semantic.accent.bold);\n      if (density === \"normal\") return createAfter(theme.color.semantic.accent.normal);\n      if (density === \"assistive\") return createAfter(theme.color.semantic.accent.neutral);\n      if (density === \"subtle\") return createAfter(theme.color.semantic.accent.alternative);\n    } else if (variant === \"positive\") {\n      if (density === \"bold\") return createAfter(theme.color.semantic.feedback.positive.bold);\n      if (density === \"normal\") return createAfter(theme.color.semantic.feedback.positive.normal);\n      if (density === \"assistive\")\n        return createAfter(theme.color.semantic.feedback.positive.neutral);\n      if (density === \"subtle\")\n        return createAfter(theme.color.semantic.feedback.positive.alternative);\n    } else if (variant === \"destructive\") {\n      if (density === \"bold\") return createAfter(theme.color.semantic.feedback.destructive.bold);\n      if (density === \"normal\")\n        return createAfter(theme.color.semantic.feedback.destructive.normal);\n      if (density === \"assistive\")\n        return createAfter(theme.color.semantic.feedback.destructive.neutral);\n      if (density === \"subtle\")\n        return createAfter(theme.color.semantic.feedback.destructive.alternative);\n    }\n  } else if (fillColor === \"inverse\") {\n    if (variant === \"normal\") {\n      if (density === \"bold\") return createAfter(theme.color.semantic.interaction.inverse.bold);\n      if (density === \"normal\") return createAfter(theme.color.semantic.interaction.inverse.normal);\n      if (density === \"assistive\")\n        return createAfter(theme.color.semantic.interaction.inverse.assistive);\n      if (density === \"subtle\") return createAfter(theme.color.semantic.interaction.inverse.subtle);\n    } else if (variant === \"accent\") {\n      if (density === \"bold\") return createAfter(theme.color.semantic.accent.inverse.bold);\n      if (density === \"normal\") return createAfter(theme.color.semantic.accent.inverse.normal);\n      if (density === \"assistive\") return createAfter(theme.color.semantic.accent.inverse.neutral);\n      if (density === \"subtle\") return createAfter(theme.color.semantic.accent.inverse.alternative);\n    } else if (variant === \"positive\") {\n      if (density === \"bold\")\n        return createAfter(theme.color.semantic.feedback.positive.inverse.bold);\n      if (density === \"normal\")\n        return createAfter(theme.color.semantic.feedback.positive.inverse.normal);\n      if (density === \"assistive\")\n        return createAfter(theme.color.semantic.feedback.positive.inverse.neutral);\n      if (density === \"subtle\")\n        return createAfter(theme.color.semantic.feedback.positive.inverse.alternative);\n    } else if (variant === \"destructive\") {\n      if (density === \"bold\")\n        return createAfter(theme.color.semantic.feedback.destructive.inverse.bold);\n      if (density === \"normal\")\n        return createAfter(theme.color.semantic.feedback.destructive.inverse.normal);\n      if (density === \"assistive\")\n        return createAfter(theme.color.semantic.feedback.destructive.inverse.neutral);\n      if (density === \"subtle\")\n        return createAfter(theme.color.semantic.feedback.destructive.inverse.alternative);\n    }\n  }\n\n  return {};\n}\n","import type { CSSObject, Theme } from \"@emotion/react\";\nimport type { InteractionLayerState, Density, FillColor, Variant } from \"types\";\n\nimport { pxToRem } from \"./cssUnit\";\n\nexport interface InteractionLayerParams {\n  theme: Theme;\n  state: InteractionLayerState;\n  variant: Variant;\n  density: Density;\n  fillColor: FillColor;\n  isReadonly?: boolean;\n  isDisabled?: boolean;\n  isLocked?: boolean;\n  offsetVertical?: number;\n  offsetHorizontal?: number;\n  borderRadius?: number;\n}\n\nconst STATE_OPACITY = {\n  rest: 0,\n  hover: 0.08,\n  active: 0.12,\n  focus: 0,\n} as const;\n\nconst SPECIAL_STATE_OPACITY = {\n  readonly: 0,\n  disabled: 0.05,\n  locked: 0.08,\n} as const;\n\n/**\n * Focus outline width는 px로 고정\n * 이유: 접근성을 위해 명확하고 선명한 outline이 필요하므로 서브픽셀 렌더링 방지\n */\nconst FOCUS_OUTLINE_WIDTH = \"3px\";\n\nconst getBackgroundColor = (\n  theme: Theme,\n  variant: Variant,\n  density: Density,\n  fillColor: FillColor,\n): string => {\n  const colorMap = {\n    normal: {\n      bold: {\n        default: theme.color.semantic.interaction.bold,\n        inverse: theme.color.semantic.interaction.inverse.bold,\n      },\n      normal: {\n        default: theme.color.semantic.interaction.normal,\n        inverse: theme.color.semantic.interaction.inverse.normal,\n      },\n      assistive: {\n        default: theme.color.semantic.interaction.assistive,\n        inverse: theme.color.semantic.interaction.inverse.assistive,\n      },\n      subtle: {\n        default: theme.color.semantic.interaction.subtle,\n        inverse: theme.color.semantic.interaction.inverse.subtle,\n      },\n    },\n    accent: {\n      bold: {\n        default: theme.color.semantic.accent.bold,\n        inverse: theme.color.semantic.accent.inverse.bold,\n      },\n      normal: {\n        default: theme.color.semantic.accent.normal,\n        inverse: theme.color.semantic.accent.inverse.normal,\n      },\n      assistive: {\n        default: theme.color.semantic.accent.neutral,\n        inverse: theme.color.semantic.accent.inverse.neutral,\n      },\n      subtle: {\n        default: theme.color.semantic.accent.alternative,\n        inverse: theme.color.semantic.accent.inverse.alternative,\n      },\n    },\n    positive: {\n      bold: {\n        default: theme.color.semantic.feedback.positive.bold,\n        inverse: theme.color.semantic.feedback.positive.inverse.bold,\n      },\n      normal: {\n        default: theme.color.semantic.feedback.positive.normal,\n        inverse: theme.color.semantic.feedback.positive.inverse.normal,\n      },\n      assistive: {\n        default: theme.color.semantic.feedback.positive.neutral,\n        inverse: theme.color.semantic.feedback.positive.inverse.neutral,\n      },\n      subtle: {\n        default: theme.color.semantic.feedback.positive.alternative,\n        inverse: theme.color.semantic.feedback.positive.inverse.alternative,\n      },\n    },\n    destructive: {\n      bold: {\n        default: theme.color.semantic.feedback.destructive.bold,\n        inverse: theme.color.semantic.feedback.destructive.inverse.bold,\n      },\n      normal: {\n        default: theme.color.semantic.feedback.destructive.normal,\n        inverse: theme.color.semantic.feedback.destructive.inverse.normal,\n      },\n      assistive: {\n        default: theme.color.semantic.feedback.destructive.neutral,\n        inverse: theme.color.semantic.feedback.destructive.inverse.neutral,\n      },\n      subtle: {\n        default: theme.color.semantic.feedback.destructive.alternative,\n        inverse: theme.color.semantic.feedback.destructive.inverse.alternative,\n      },\n    },\n  };\n\n  return colorMap[variant][density][fillColor];\n};\n\nconst getOpacity = (\n  state: InteractionLayerState,\n  isReadonly: boolean,\n  isDisabled: boolean,\n  isLocked: boolean,\n): number => {\n  if (isReadonly) return SPECIAL_STATE_OPACITY.readonly;\n  if (isDisabled) return SPECIAL_STATE_OPACITY.disabled;\n  if (isLocked) return SPECIAL_STATE_OPACITY.locked;\n  return STATE_OPACITY[state];\n};\n\nconst hasSpecialState = (isReadonly: boolean, isDisabled: boolean, isLocked: boolean): boolean => {\n  return isReadonly || isDisabled || isLocked;\n};\n\n/**\n * 인터랙션 레이어 스타일 생성\n *\n * @description\n * Figma 스펙에 맞춰 variant + density + fillColor 조합으로 색상 토큰을 결정합니다.\n * ::after 의사 요소를 사용하여 주어진 state에 대한 스타일만 생성합니다.\n *\n * 중요: 컴포넌트의 실제 인터랙션 상태(hover, active, focus)와\n * InteractionLayer의 state는 독립적으로 설정할 수 있습니다.\n *\n * 예: 컴포넌트 hover 시 InteractionLayer state='rest' 사용 가능\n *\n * @param theme - Emotion 테마 객체\n * @param state - InteractionLayer 시각적 상태 (rest, hover, active, focus)\n * @param variant - 색상 변형 (normal, accent, positive, destructive)\n * @param density - 색상 강도 (bold, normal, assistive, subtle)\n * @param fillColor - 배경 타입 (default, inverse)\n * @param isReadonly - 읽기 전용 상태\n * @param isDisabled - 비활성화 상태\n * @param isLocked - 잠김 상태\n * @param offsetVertical - 상하 방향 오프셋 (px 단위)\n * @param offsetHorizontal - 좌우 방향 오프셋 (px 단위)\n * @param borderRadius - 테두리 둥글기 (px 단위)\n *\n * @example\n * // 일반적인 사용 (컴포넌트 상태 = InteractionLayer 상태)\n * '&:hover': InteractionLayer({ theme, state: 'hover', ... })\n *\n * @example\n * // 독립적인 사용 (컴포넌트 hover 시에도 InteractionLayer는 rest)\n * '&:hover': InteractionLayer({ theme, state: 'rest', ... })\n *\n * @example\n * // offset과 borderRadius를 사용하여 더 큰 터치 영역과 둥근 모서리 제공\n * InteractionLayer({ theme, state: 'hover', ..., offsetVertical: 4, offsetHorizontal: 8, borderRadius: 4 })\n */\nexport function InteractionLayer({\n  theme,\n  state,\n  variant,\n  density,\n  fillColor,\n  isReadonly = false,\n  isDisabled = false,\n  isLocked = false,\n  offsetVertical = 0,\n  offsetHorizontal = 0,\n  borderRadius = 0,\n}: InteractionLayerParams): CSSObject {\n  const backgroundColor = getBackgroundColor(theme, variant, density, fillColor);\n  const opacity = getOpacity(state, isReadonly, isDisabled, isLocked);\n  const isSpecialState = hasSpecialState(isReadonly, isDisabled, isLocked);\n\n  const hasVerticalOffset = offsetVertical > 0;\n  const hasHorizontalOffset = offsetHorizontal > 0;\n\n  const topBottomValue = hasVerticalOffset ? pxToRem(-offsetVertical) : 0;\n  const leftRightValue = hasHorizontalOffset ? pxToRem(-offsetHorizontal) : 0;\n\n  const hasOffset = hasVerticalOffset || hasHorizontalOffset;\n  const isFocusState = state === \"focus\" && !isSpecialState;\n\n  const baseStyle: CSSObject = {\n    position: \"relative\",\n    outline: \"none\",\n    borderRadius: borderRadius > 0 ? `${borderRadius}px` : 0,\n    \"::before\": {\n      content: '\"\"',\n      position: \"absolute\",\n      top: hasOffset ? topBottomValue : 0,\n      right: hasOffset && hasHorizontalOffset ? leftRightValue : undefined,\n      bottom: hasOffset && hasVerticalOffset ? topBottomValue : undefined,\n      left: hasOffset ? leftRightValue : 0,\n      width: hasOffset && hasHorizontalOffset ? \"auto\" : \"100%\",\n      height: hasOffset && hasVerticalOffset ? \"auto\" : \"100%\",\n      borderRadius: borderRadius > 0 ? `${borderRadius}px` : 0,\n      boxShadow: `0 0 0 ${FOCUS_OUTLINE_WIDTH} ${theme.color.semantic.interaction.focus}`,\n      opacity: isFocusState && hasOffset ? 1 : 0,\n      pointerEvents: \"none\",\n    },\n    \"::after\": {\n      content: '\"\"',\n      position: \"absolute\",\n      top: topBottomValue,\n      right: hasHorizontalOffset ? leftRightValue : undefined,\n      bottom: hasVerticalOffset ? topBottomValue : undefined,\n      left: leftRightValue,\n      width: hasHorizontalOffset ? \"auto\" : \"100%\",\n      height: hasVerticalOffset ? \"auto\" : \"100%\",\n      borderRadius: borderRadius > 0 ? `${borderRadius}px` : 0,\n      backgroundColor,\n      opacity,\n      pointerEvents: \"none\",\n    },\n  };\n\n  if (isFocusState && !hasOffset) {\n    baseStyle.boxShadow = `0 0 0 ${FOCUS_OUTLINE_WIDTH} ${theme.color.semantic.interaction.focus}`;\n  }\n\n  return baseStyle;\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/utils/index.ts","../src/utils/color.ts","../src/utils/cssUnit.ts","../src/utils/environment.ts","../src/utils/interaction.ts","../src/utils/interactionLayer.ts"],"sourcesContent":["export * from \"./color\";\nexport * from \"./cssUnit\";\nexport * from \"./environment\";\nexport * from \"./interaction\";\nexport * from \"./interactionLayer\";\n","/**\n * Hex 색상 코드를 RGBA로 변환하는 함수\n *\n * @param hex - Hex 색상 코드 (예: '#FF5733' 또는 'FF5733') 현재 토큰의 경우 #이 붙여져서 등록되어있음\n * @param alpha - 투명도 (0~1 사이의 값)\n * @returns RGBA 문자열 (예: 'rgba(255, 87, 51, 0.55)')\n *\n * @example\n * hexToRgba('토큰 명(혹은 실제 코드)',투명도)'\n * hexToRgba('#FF5733', 0.55) // 'rgba(255, 87, 51, 0.55)'\n * hexToRgba('FF5733', 1) // 'rgba(255, 87, 51, 1)'\n */\nexport function HexToRgba(hex: string, alpha: number): string {\n  const cleanedHex = hex.replace(\"#\", \"\");\n\n  const r = parseInt(cleanedHex.slice(0, 2), 16);\n  const g = parseInt(cleanedHex.slice(2, 4), 16);\n  const b = parseInt(cleanedHex.slice(4, 6), 16);\n\n  const validAlpha = Math.max(0, Math.min(1, alpha));\n\n  return `rgba(${r}, ${g}, ${b}, ${validAlpha})`;\n}\n","/**\n * px값을 rem 단위로 변환합니다\n * @param pixels - 변환할 px 값\n * @param baseFontSize - 기본 폰트 크기 (px 단위, 기본값: 16)\n * @param precision - 소수점 자릿수 (기본값: 4)\n * @returns rem 값이 포함된 문자열\n */\nexport function pxToRem(pixels: number, baseFontSize: number = 16, precision: number = 4): string {\n  return `${parseFloat((pixels / baseFontSize).toFixed(precision))}rem`;\n}\n\n/**\n * 특정 폰트 크기를 기준으로 스페이싱 값을 em 단위로 변환합니다\n * @param spacing - 변환할 스페이싱 값 (px단위)\n * @param fontSize - 기준이 되는 폰트 크기 (px단위)\n * @param precision - 소수점 자릿수 (기본값: 3)\n * @returns em 값이 포함된 문자열\n */\nexport function spacingToEm(spacing: number, fontSize: number, precision: number = 3): string {\n  return `${parseFloat((spacing / fontSize).toFixed(precision))}em`;\n}\n\n/**\n * px값으로부터 line-height 비율을 계산합니다\n * @param lineHeight - 줄 간격 값 (px단위)\n * @param fontSize - 폰트 크기 (px단위)\n * @param precision - 소수점 자릿수 (기본값: 1)\n * @returns 단위 없는 line-height 비율 문자열\n */\nexport function lineHeightRatio(\n  lineHeight: number,\n  fontSize: number,\n  precision: number = 1,\n): number {\n  return parseFloat((lineHeight / fontSize).toFixed(precision));\n}\n","import type { Theme } from \"@emotion/react\";\nimport type { Depth, Level, Shadow } from \"types\";\n\nexport function depth(theme: Theme, depthToken: Depth) {\n  if (depthToken === \"shallowest\") {\n    return { backgroundColor: theme.color.semantic.surface.shallowest };\n  } else if (depthToken === \"shallower\") {\n    return { backgroundColor: theme.color.semantic.surface.shallower };\n  } else if (depthToken === \"shallow\") {\n    return { backgroundColor: theme.color.semantic.surface.shallow };\n  } else if (depthToken === \"standard\") {\n    return { backgroundColor: theme.color.semantic.surface.standard };\n  } else if (depthToken === \"deep\") {\n    return { backgroundColor: theme.color.semantic.surface.deep };\n  } else if (depthToken === \"deeper\") {\n    return { backgroundColor: theme.color.semantic.surface.deeper };\n  } else if (depthToken === \"deepest\") {\n    return { backgroundColor: theme.color.semantic.surface.deepest };\n  }\n\n  return {};\n}\n\nexport function level(theme: Theme, levelToken: Level) {\n  if (levelToken === \"standard\") {\n    return { zIndex: \"auto\" as const };\n  } else if (levelToken === \"embossed\") {\n    return {\n      zIndex: 100,\n      ...shadow(theme, \"embossed\"),\n    };\n  } else if (levelToken === \"raised\") {\n    return {\n      zIndex: 200,\n      ...shadow(theme, \"raised\"),\n    };\n  } else if (levelToken === \"floated\") {\n    return {\n      zIndex: 300,\n      ...shadow(theme, \"floated\"),\n    };\n  } else if (levelToken === \"overlay\") {\n    return {\n      zIndex: 400,\n      ...shadow(theme, \"overlay\"),\n    };\n  }\n\n  return {};\n}\n\nexport function shadow(theme: Theme, shadowToken: Shadow) {\n  if (shadowToken === \"embossed\") {\n    return {\n      boxShadow: `0 0 ${theme.scheme.semantic.radius[2]} 0 ${theme.colorPrimitive.primitive.shade[2]}, \n                  0 2px ${theme.scheme.semantic.radius[4]} 0 ${theme.colorPrimitive.primitive.shade[4]}`,\n    };\n  } else if (shadowToken === \"raised\") {\n    return {\n      boxShadow: `0 0 ${theme.scheme.semantic.radius[2]} 0 ${theme.colorPrimitive.primitive.shade[6]}, \n                  0 3px ${theme.scheme.semantic.radius[6]} 0 ${theme.colorPrimitive.primitive.shade[12]}`,\n    };\n  } else if (shadowToken === \"floated\") {\n    return {\n      boxShadow: `0 0 ${theme.scheme.semantic.radius[2]} 0 ${theme.colorPrimitive.primitive.shade[4]}, \n                  0 3px ${theme.scheme.semantic.radius[4]} 0 ${theme.colorPrimitive.primitive.shade[8]}, \n                  0 4px ${theme.scheme.semantic.radius[8]} 0 ${theme.colorPrimitive.primitive.shade[12]}`,\n    };\n  } else if (shadowToken === \"overlay\") {\n    return {\n      boxShadow: `0 0 ${theme.scheme.semantic.radius[4]} 0 ${theme.colorPrimitive.primitive.shade[8]},\n                  0 3px ${theme.scheme.semantic.radius[8]} 0 ${theme.colorPrimitive.primitive.shade[12]},\n                  0 8px ${theme.scheme.semantic.radius[16]} 0 ${theme.colorPrimitive.primitive.shade[16]}`,\n    };\n  }\n\n  return {};\n}\n","import type { CSSObject, Theme } from \"@emotion/react\";\nimport type { Density, FillColor, InteractionState, Variant } from \"types\";\n\nexport function Interaction(\n  theme: Theme,\n  variant: Variant,\n  density: Density,\n  fillColor: FillColor,\n  state: InteractionState = \"default\",\n  borderRadius: string = \"inherit\",\n): CSSObject {\n  const createAfter = (backgroundColor: string): CSSObject => {\n    const baseStyle = {\n      position: \"relative\" as const,\n      outline: \"none\" as const,\n    };\n\n    const afterBaseStyle = {\n      content: '\"\"',\n      position: \"absolute\" as const,\n      top: 0,\n      left: 0,\n      width: \"100%\",\n      height: \"100%\",\n      backgroundColor: backgroundColor,\n      borderRadius,\n    };\n\n    if (state === \"locked\") {\n      return {\n        ...baseStyle,\n        \"::after\": { ...afterBaseStyle, opacity: 0.08 },\n      };\n    }\n\n    if (state === \"disabled\") {\n      return {\n        ...baseStyle,\n        \"::after\": { ...afterBaseStyle, opacity: 0.05 },\n      };\n    }\n\n    if (state === \"readonly\") {\n      return {\n        ...baseStyle,\n        \"::after\": { ...afterBaseStyle, opacity: 0 },\n      };\n    }\n\n    return {\n      ...baseStyle,\n      \"::after\": { ...afterBaseStyle, opacity: 0 },\n      \"&:hover::after\": { opacity: 0.08 },\n      \"&:active::after\": { opacity: 0.12 },\n      \"&:focus-visible\": { boxShadow: `0 0 0 3px ${theme.color.semantic.interaction.focus}` },\n    };\n  };\n\n  if (fillColor === \"default\") {\n    if (variant === \"normal\") {\n      if (density === \"bold\") return createAfter(theme.color.semantic.interaction.bold);\n      if (density === \"normal\") return createAfter(theme.color.semantic.interaction.normal);\n      if (density === \"assistive\") return createAfter(theme.color.semantic.interaction.assistive);\n      if (density === \"subtle\") return createAfter(theme.color.semantic.interaction.subtle);\n    } else if (variant === \"accent\") {\n      if (density === \"bold\") return createAfter(theme.color.semantic.accent.bold);\n      if (density === \"normal\") return createAfter(theme.color.semantic.accent.normal);\n      if (density === \"assistive\") return createAfter(theme.color.semantic.accent.neutral);\n      if (density === \"subtle\") return createAfter(theme.color.semantic.accent.alternative);\n    } else if (variant === \"positive\") {\n      if (density === \"bold\") return createAfter(theme.color.semantic.feedback.positive.bold);\n      if (density === \"normal\") return createAfter(theme.color.semantic.feedback.positive.normal);\n      if (density === \"assistive\")\n        return createAfter(theme.color.semantic.feedback.positive.neutral);\n      if (density === \"subtle\")\n        return createAfter(theme.color.semantic.feedback.positive.alternative);\n    } else if (variant === \"destructive\") {\n      if (density === \"bold\") return createAfter(theme.color.semantic.feedback.destructive.bold);\n      if (density === \"normal\")\n        return createAfter(theme.color.semantic.feedback.destructive.normal);\n      if (density === \"assistive\")\n        return createAfter(theme.color.semantic.feedback.destructive.neutral);\n      if (density === \"subtle\")\n        return createAfter(theme.color.semantic.feedback.destructive.alternative);\n    }\n  } else if (fillColor === \"inverse\") {\n    if (variant === \"normal\") {\n      if (density === \"bold\") return createAfter(theme.color.semantic.interaction.inverse.bold);\n      if (density === \"normal\") return createAfter(theme.color.semantic.interaction.inverse.normal);\n      if (density === \"assistive\")\n        return createAfter(theme.color.semantic.interaction.inverse.assistive);\n      if (density === \"subtle\") return createAfter(theme.color.semantic.interaction.inverse.subtle);\n    } else if (variant === \"accent\") {\n      if (density === \"bold\") return createAfter(theme.color.semantic.accent.inverse.bold);\n      if (density === \"normal\") return createAfter(theme.color.semantic.accent.inverse.normal);\n      if (density === \"assistive\") return createAfter(theme.color.semantic.accent.inverse.neutral);\n      if (density === \"subtle\") return createAfter(theme.color.semantic.accent.inverse.alternative);\n    } else if (variant === \"positive\") {\n      if (density === \"bold\")\n        return createAfter(theme.color.semantic.feedback.positive.inverse.bold);\n      if (density === \"normal\")\n        return createAfter(theme.color.semantic.feedback.positive.inverse.normal);\n      if (density === \"assistive\")\n        return createAfter(theme.color.semantic.feedback.positive.inverse.neutral);\n      if (density === \"subtle\")\n        return createAfter(theme.color.semantic.feedback.positive.inverse.alternative);\n    } else if (variant === \"destructive\") {\n      if (density === \"bold\")\n        return createAfter(theme.color.semantic.feedback.destructive.inverse.bold);\n      if (density === \"normal\")\n        return createAfter(theme.color.semantic.feedback.destructive.inverse.normal);\n      if (density === \"assistive\")\n        return createAfter(theme.color.semantic.feedback.destructive.inverse.neutral);\n      if (density === \"subtle\")\n        return createAfter(theme.color.semantic.feedback.destructive.inverse.alternative);\n    }\n  }\n\n  return {};\n}\n","import type { CSSObject, Theme } from \"@emotion/react\";\nimport type { InteractionLayerState, Density, FillColor, Variant } from \"types\";\n\nimport { pxToRem } from \"./cssUnit\";\n\nexport interface InteractionLayerParams {\n  theme: Theme;\n  state: InteractionLayerState;\n  variant: Variant;\n  density: Density;\n  fillColor: FillColor;\n  isReadonly?: boolean;\n  isDisabled?: boolean;\n  isLocked?: boolean;\n  offsetVertical?: number;\n  offsetHorizontal?: number;\n  borderRadius?: number;\n}\n\nconst STATE_OPACITY = {\n  rest: 0,\n  hover: 0.08,\n  active: 0.12,\n  focus: 0,\n} as const;\n\nconst SPECIAL_STATE_OPACITY = {\n  readonly: 0,\n  disabled: 0.05,\n  locked: 0.08,\n} as const;\n\n/**\n * Focus outline width는 px로 고정\n * 이유: 접근성을 위해 명확하고 선명한 outline이 필요하므로 서브픽셀 렌더링 방지\n */\nconst FOCUS_OUTLINE_WIDTH = \"3px\";\n\nconst getBackgroundColor = (\n  theme: Theme,\n  variant: Variant,\n  density: Density,\n  fillColor: FillColor,\n): string => {\n  const colorMap = {\n    normal: {\n      bold: {\n        default: theme.color.semantic.interaction.bold,\n        inverse: theme.color.semantic.interaction.inverse.bold,\n      },\n      normal: {\n        default: theme.color.semantic.interaction.normal,\n        inverse: theme.color.semantic.interaction.inverse.normal,\n      },\n      assistive: {\n        default: theme.color.semantic.interaction.assistive,\n        inverse: theme.color.semantic.interaction.inverse.assistive,\n      },\n      subtle: {\n        default: theme.color.semantic.interaction.subtle,\n        inverse: theme.color.semantic.interaction.inverse.subtle,\n      },\n    },\n    accent: {\n      bold: {\n        default: theme.color.semantic.accent.bold,\n        inverse: theme.color.semantic.accent.inverse.bold,\n      },\n      normal: {\n        default: theme.color.semantic.accent.normal,\n        inverse: theme.color.semantic.accent.inverse.normal,\n      },\n      assistive: {\n        default: theme.color.semantic.accent.neutral,\n        inverse: theme.color.semantic.accent.inverse.neutral,\n      },\n      subtle: {\n        default: theme.color.semantic.accent.alternative,\n        inverse: theme.color.semantic.accent.inverse.alternative,\n      },\n    },\n    positive: {\n      bold: {\n        default: theme.color.semantic.feedback.positive.bold,\n        inverse: theme.color.semantic.feedback.positive.inverse.bold,\n      },\n      normal: {\n        default: theme.color.semantic.feedback.positive.normal,\n        inverse: theme.color.semantic.feedback.positive.inverse.normal,\n      },\n      assistive: {\n        default: theme.color.semantic.feedback.positive.neutral,\n        inverse: theme.color.semantic.feedback.positive.inverse.neutral,\n      },\n      subtle: {\n        default: theme.color.semantic.feedback.positive.alternative,\n        inverse: theme.color.semantic.feedback.positive.inverse.alternative,\n      },\n    },\n    destructive: {\n      bold: {\n        default: theme.color.semantic.feedback.destructive.bold,\n        inverse: theme.color.semantic.feedback.destructive.inverse.bold,\n      },\n      normal: {\n        default: theme.color.semantic.feedback.destructive.normal,\n        inverse: theme.color.semantic.feedback.destructive.inverse.normal,\n      },\n      assistive: {\n        default: theme.color.semantic.feedback.destructive.neutral,\n        inverse: theme.color.semantic.feedback.destructive.inverse.neutral,\n      },\n      subtle: {\n        default: theme.color.semantic.feedback.destructive.alternative,\n        inverse: theme.color.semantic.feedback.destructive.inverse.alternative,\n      },\n    },\n  };\n\n  return colorMap[variant][density][fillColor];\n};\n\nconst getOpacity = (\n  state: InteractionLayerState,\n  isReadonly: boolean,\n  isDisabled: boolean,\n  isLocked: boolean,\n): number => {\n  if (isReadonly) return SPECIAL_STATE_OPACITY.readonly;\n  if (isDisabled) return SPECIAL_STATE_OPACITY.disabled;\n  if (isLocked) return SPECIAL_STATE_OPACITY.locked;\n  return STATE_OPACITY[state];\n};\n\nconst hasSpecialState = (isReadonly: boolean, isDisabled: boolean, isLocked: boolean): boolean => {\n  return isReadonly || isDisabled || isLocked;\n};\n\n/**\n * 인터랙션 레이어 스타일 생성\n *\n * @description\n * Figma 스펙에 맞춰 variant + density + fillColor 조합으로 색상 토큰을 결정합니다.\n * ::after 의사 요소를 사용하여 주어진 state에 대한 스타일만 생성합니다.\n *\n * 중요: 컴포넌트의 실제 인터랙션 상태(hover, active, focus)와\n * InteractionLayer의 state는 독립적으로 설정할 수 있습니다.\n *\n * 예: 컴포넌트 hover 시 InteractionLayer state='rest' 사용 가능\n *\n * @param theme - Emotion 테마 객체\n * @param state - InteractionLayer 시각적 상태 (rest, hover, active, focus)\n * @param variant - 색상 변형 (normal, accent, positive, destructive)\n * @param density - 색상 강도 (bold, normal, assistive, subtle)\n * @param fillColor - 배경 타입 (default, inverse)\n * @param isReadonly - 읽기 전용 상태\n * @param isDisabled - 비활성화 상태\n * @param isLocked - 잠김 상태\n * @param offsetVertical - 상하 방향 오프셋 (px 단위)\n * @param offsetHorizontal - 좌우 방향 오프셋 (px 단위)\n * @param borderRadius - 테두리 둥글기 (px 단위)\n *\n * @example\n * // 일반적인 사용 (컴포넌트 상태 = InteractionLayer 상태)\n * '&:hover': InteractionLayer({ theme, state: 'hover', ... })\n *\n * @example\n * // 독립적인 사용 (컴포넌트 hover 시에도 InteractionLayer는 rest)\n * '&:hover': InteractionLayer({ theme, state: 'rest', ... })\n *\n * @example\n * // offset과 borderRadius를 사용하여 더 큰 터치 영역과 둥근 모서리 제공\n * InteractionLayer({ theme, state: 'hover', ..., offsetVertical: 4, offsetHorizontal: 8, borderRadius: 4 })\n */\nexport function InteractionLayer({\n  theme,\n  state,\n  variant,\n  density,\n  fillColor,\n  isReadonly = false,\n  isDisabled = false,\n  isLocked = false,\n  offsetVertical = 0,\n  offsetHorizontal = 0,\n  borderRadius = 0,\n}: InteractionLayerParams): CSSObject {\n  const backgroundColor = getBackgroundColor(theme, variant, density, fillColor);\n  const opacity = getOpacity(state, isReadonly, isDisabled, isLocked);\n  const isSpecialState = hasSpecialState(isReadonly, isDisabled, isLocked);\n\n  const hasVerticalOffset = offsetVertical > 0;\n  const hasHorizontalOffset = offsetHorizontal > 0;\n\n  const topBottomValue = hasVerticalOffset ? pxToRem(-offsetVertical) : 0;\n  const leftRightValue = hasHorizontalOffset ? pxToRem(-offsetHorizontal) : 0;\n\n  const hasOffset = hasVerticalOffset || hasHorizontalOffset;\n  const isFocusState = state === \"focus\" && !isSpecialState;\n\n  const baseStyle: CSSObject = {\n    position: \"relative\",\n    outline: \"none\",\n    borderRadius: borderRadius > 0 ? `${borderRadius}px` : 0,\n    \"::before\": {\n      content: '\"\"',\n      position: \"absolute\",\n      top: hasOffset ? topBottomValue : 0,\n      right: hasOffset && hasHorizontalOffset ? leftRightValue : undefined,\n      bottom: hasOffset && hasVerticalOffset ? topBottomValue : undefined,\n      left: hasOffset ? leftRightValue : 0,\n      width: hasOffset && hasHorizontalOffset ? \"auto\" : \"100%\",\n      height: hasOffset && hasVerticalOffset ? \"auto\" : \"100%\",\n      borderRadius: borderRadius > 0 ? `${borderRadius}px` : 0,\n      boxShadow: `0 0 0 ${FOCUS_OUTLINE_WIDTH} ${theme.color.semantic.interaction.focus}`,\n      opacity: isFocusState && hasOffset ? 1 : 0,\n      pointerEvents: \"none\",\n    },\n    \"::after\": {\n      content: '\"\"',\n      position: \"absolute\",\n      top: topBottomValue,\n      right: hasHorizontalOffset ? leftRightValue : undefined,\n      bottom: hasVerticalOffset ? topBottomValue : undefined,\n      left: leftRightValue,\n      width: hasHorizontalOffset ? \"auto\" : \"100%\",\n      height: hasVerticalOffset ? \"auto\" : \"100%\",\n      borderRadius: borderRadius > 0 ? `${borderRadius}px` : 0,\n      backgroundColor,\n      opacity,\n      pointerEvents: \"none\",\n    },\n  };\n\n  if (isFocusState && !hasOffset) {\n    baseStyle.boxShadow = `0 0 0 ${FOCUS_OUTLINE_WIDTH} ${theme.color.semantic.interaction.focus}`;\n  }\n\n  return baseStyle;\n}\n"],"mappings":"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","names":[]}

package/dist/utils.js

@@ -1,3 +1,4 @@
+"use client";
 import {
   HexToRgba,
   Interaction,
@@ -8,8 +9,8 @@ import {
   pxToRem,
   shadow,
   spacingToEm
-} from "./chunk-4G7IFL4O.js";
-import "./chunk-EGRHWZRV.js";
+} from "./chunk-MSDKBAGM.js";
+import "./chunk-NDUODUDN.js";
 export {
   HexToRgba,
   Interaction,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jects/jds",
-  "version": "0.2.1",
+  "version": "0.2.2",
   "description": "Ject Design System",
   "author": "Ject Team",
   "license": "MIT",

package/dist/chunk-EGRHWZRV.js

@@ -1 +0,0 @@
-//# sourceMappingURL=chunk-EGRHWZRV.js.map