@tipp/ui 2.7.1 → 2.8.0

package/dist/molecules/dynamic-form-editor-field-editor-panel.js

@@ -1,18 +1,20 @@
 import {
   DynamicFormEditorFieldEditorPanel
-} from "../chunk-YSZIV3CU.js";
+} from "../chunk-7XMPNH2X.js";
 import "../chunk-Z7WNKARH.js";
 import "../chunk-5XYPLDI5.js";
 import "../chunk-6NPTJBFE.js";
 import "../chunk-YXMB4MCM.js";
 import "../chunk-7RJYF5L3.js";
 import "../chunk-HF6GNDPV.js";
+import "../chunk-RP2RGCAW.js";
+import "../chunk-ZCGH6TJ3.js";
+import "../chunk-YXFHD2PY.js";
+import "../chunk-LDBWASUA.js";
+import "../chunk-PO2PBAHW.js";
 import "../chunk-25HMMI7R.js";
 import "../chunk-2LCH3PDF.js";
 import "../chunk-LQY4RKWI.js";
-import "../chunk-RP2RGCAW.js";
-import "../chunk-ZCGH6TJ3.js";
-import "../chunk-WYWM2HSZ.js";
 import "../chunk-VOME2TE7.js";
 import "../chunk-JVXATVAC.js";
 import "../chunk-B3VSXNTH.js";
@@ -30,8 +32,7 @@ import "../chunk-YSYJCYHY.js";
 import "../chunk-5OM2H6RI.js";
 import "../chunk-ZUYCXCPW.js";
 import "../chunk-YVFNJE4E.js";
-import "../chunk-GR4PG6HY.js";
-import "../chunk-LDBWASUA.js";
+import "../chunk-WYWM2HSZ.js";
 import "../chunk-VFQD57ZY.js";
 import "../chunk-CRTRMMJ7.js";
 export {

package/dist/molecules/dynamic-form-editor-field-list-panel.cjs

@@ -218,11 +218,17 @@ var mapWithResponsive = (args) => {
   return value;
 };
 
+// src/utils/mono-style.ts
+var MONO_STYLE = {
+  fontFamily: 'var(--code-font-family, ui-monospace, "SF Mono", monospace)',
+  fontVariantNumeric: "tabular-nums"
+};
+
 // src/atoms/typo.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
 var Typo = (0, import_react4.forwardRef)(
   (props, ref) => {
-    const _a = props, { size, variant, children, color, className } = _a, rest = __objRest(_a, ["size", "variant", "children", "color", "className"]);
+    const _a = props, { size, variant, children, color, className, mono, style } = _a, rest = __objRest(_a, ["size", "variant", "children", "color", "className", "mono", "style"]);
     const { color: radixColor, className: colorClassName } = (0, import_react4.useMemo)(
       () => resolveColor(color),
       [color]
@@ -252,6 +258,7 @@ var Typo = (0, import_react4.forwardRef)(
         color: radixColor,
         ref,
         size: radixSize,
+        style: mono ? __spreadValues(__spreadValues({}, MONO_STYLE), style) : style,
         children
       })
     );

package/dist/molecules/dynamic-form-editor-field-list-panel.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/molecules/dynamic-form-editor-field-list-panel.tsx","../../src/atoms/card.tsx","../../src/atoms/flex.tsx","../../src/atoms/select.tsx","../../src/utils/resolve-color.ts","../../src/theme/theme-provider.tsx","../../src/atoms/typo.tsx","../../src/utils/map-with-responsive.ts","../../src/molecules/dynamic-form-editor-utils.ts"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { Box } from '@radix-ui/themes';\nimport { Card } from '@/atoms/card';\nimport { Flex } from '@/atoms/flex';\nimport { Select } from '@/atoms/select';\nimport { Typo } from '@/atoms/typo';\nimport type { DynamicFormFieldSchema } from '@/types/dynamic-form-schema-generated';\nimport { getFieldTypeLabel, type FieldType } from './dynamic-form-editor-utils';\n\nfunction isFieldType(value: string, types: FieldType[]): value is FieldType {\n  return types.some((t) => t === value);\n}\n\nexport interface DynamicFormEditorFieldListPanelProps {\n  fields: DynamicFormFieldSchema[];\n  selectedFieldName: string | null;\n  readonly: boolean;\n  fieldTypes: FieldType[];\n  hasFieldError: (fieldName: string) => boolean;\n  onSelectFieldName: (fieldName: string) => void;\n  onAddField: (type: FieldType) => void;\n}\n\nexport function DynamicFormEditorFieldListPanel(\n  props: DynamicFormEditorFieldListPanelProps\n): React.ReactElement {\n  const {\n    fields,\n    selectedFieldName,\n    readonly,\n    fieldTypes,\n    hasFieldError,\n    onSelectFieldName,\n    onAddField,\n  } = props;\n\n  const isEmpty: boolean = fields.length === 0;\n\n  const triggerPlaceholder: string = useMemo(() => {\n    return readonly ? '추가(읽기 전용)' : '추가';\n  }, [readonly]);\n\n  return (\n    <Card style={{ width: 340, padding: 12 }}>\n      <Flex direction=\"column\" gap=\"3\">\n        <Flex align=\"center\" justify=\"between\">\n          <Typo variant=\"body\">필드</Typo>\n          <Select.Root\n            disabled={readonly}\n            onValueChange={(v: string): void => {\n              if (!isFieldType(v, fieldTypes)) return;\n              onAddField(v);\n            }}\n            value=\"\"\n          >\n            <Select.Trigger placeholder={triggerPlaceholder} />\n            <Select.Content>\n              {fieldTypes.map((t) => (\n                <Select.Item key={t} value={t}>\n                  {getFieldTypeLabel(t)}\n                </Select.Item>\n              ))}\n            </Select.Content>\n          </Select.Root>\n        </Flex>\n\n        <Flex direction=\"column\" gap=\"2\">\n          {isEmpty ? (\n            <Typo color=\"gray\" variant=\"caption\">\n              아직 필드가 없습니다.\n            </Typo>\n          ) : null}\n\n          {fields.map((field) => {\n            const isSelected: boolean = field.name === selectedFieldName;\n            const hasError: boolean = hasFieldError(field.name);\n\n            return (\n              <Card\n                error={isSelected ? hasError : undefined}\n                key={field.name}\n                onClick={(): void => { onSelectFieldName(field.name); }}\n                style={{\n                  padding: 10,\n                  cursor: 'pointer',\n                  opacity: readonly ? 0.8 : 1,\n                  border: isSelected\n                    ? '1px solid var(--accent-9)'\n                    : '1px solid transparent',\n                }}\n              >\n                <Box style={{ minWidth: 0 }}>\n                  <Typo\n                    style={{\n                      whiteSpace: 'nowrap',\n                      overflow: 'hidden',\n                      textOverflow: 'ellipsis',\n                    }}\n                    variant=\"body\"\n                  >\n                    {field.label}\n                  </Typo>\n                  <Typo color=\"gray\" variant=\"caption\">\n                    {field.name} · {field.type}\n                    {field.required ? ' · required' : ''}\n                  </Typo>\n                </Box>\n              </Card>\n            );\n          })}\n        </Flex>\n      </Flex>\n    </Card>\n  );\n}\n\n","import { forwardRef, useMemo } from 'react';\nimport {\n  Card as RadixCard,\n  type CardProps as RadixCardProps,\n} from '@radix-ui/themes';\n\nexport type CardProps = RadixCardProps & {\n  borderRadius?: 'none';\n  borderDisable?: {\n    left?: boolean;\n    right?: boolean;\n    top?: boolean;\n    bottom?: boolean;\n  };\n  error?: boolean;\n};\n\nexport const Card = forwardRef<HTMLDivElement, CardProps>(\n  (props, forwardedRef) => {\n    const { borderDisable, borderRadius, error, ...rest } = props;\n\n    const borderInsetClassName = useMemo(() => {\n      if (!borderDisable) return '';\n      const { left, right, top, bottom } = borderDisable;\n      return [\n        left && 'disable-inset-left',\n        right && 'disable-inset-right',\n        top && 'disable-inset-top',\n        bottom && 'disable-inset-bottom',\n      ]\n        .filter(Boolean)\n        .join(' ');\n    }, [borderDisable]);\n\n    const errorClsName = useMemo(() => {\n      return error ? ' error' : '';\n    }, [error]);\n\n    return (\n      <RadixCard\n        variant=\"surface\"\n        {...rest}\n        className={`${borderInsetClassName}${errorClsName} ${rest.className || ''}`}\n        data-radius={borderRadius}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n\nCard.displayName = 'Card';\n","export { Flex, type FlexProps } from '@radix-ui/themes';\n","import { Select as RadixSelect } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport { createContext, forwardRef, useContext, useMemo } from 'react';\nimport {\n  resolveColor,\n  type DistributiveOmit,\n  type UiColor,\n} from '../utils/resolve-color';\nimport { ThemeAccentContext } from '../theme/theme-provider';\n\nconst SelectContext = createContext<{ error?: boolean; color?: UiColor }>({\n  error: false,\n});\n\nexport type ContentProps = DistributiveOmit<\n  RadixSelect.ContentProps,\n  'color'\n> & {\n  isNavigation?: boolean;\n  color?: UiColor;\n};\n\nconst Content = forwardRef<HTMLDivElement, ContentProps>((props, ref) => {\n  const { className, isNavigation, color, ...rest } = props;\n  const { error, color: contextColor } = useContext(SelectContext);\n  const themeAccent = useContext(ThemeAccentContext);\n\n  // Content는 Portal로 렌더돼 theme의 className override를 못 받으므로, per-instance/Root color가\n  // 없으면 theme custom accent(black)를 fallback으로 적용해 Portal 안에서도 black을 유지한다.\n  const { color: radixColor, className: colorClassName } = useMemo(\n    () => resolveColor(color ?? contextColor ?? themeAccent),\n    [color, contextColor, themeAccent]\n  );\n\n  // custom color(black)는 className override만 사용 — fallback color를 함께 넘기면 자식 Item이\n  // 자기 data-accent-color로 gray를 다시 적용해 override를 덮는다.\n  const appliedColor = colorClassName ? undefined : radixColor;\n\n  const cls = useMemo(() => {\n    const etc = isNavigation ? 'nav-select' : '';\n    const errorCls = error ? 'tipp-error' : '';\n    return clsx(etc, errorCls, colorClassName, className);\n  }, [className, colorClassName, error, isNavigation]);\n\n  return (\n    <RadixSelect.Content\n      position=\"popper\"\n      {...rest}\n      className={cls}\n      color={appliedColor}\n      ref={ref}\n    />\n  );\n});\nContent.displayName = 'Select.Content';\n\nexport type TriggerProps = DistributiveOmit<\n  RadixSelect.TriggerProps,\n  'color'\n> & {\n  color?: UiColor;\n};\n\nconst Trigger = forwardRef<HTMLButtonElement, TriggerProps>((props, ref) => {\n  const { className, color, ...rest } = props;\n  const { error, color: contextColor } = useContext(SelectContext);\n\n  const { color: radixColor, className: colorClassName } = useMemo(\n    () => resolveColor(color ?? contextColor),\n    [color, contextColor]\n  );\n\n  // custom color(black)는 className override만 사용 (위 Content와 동일 이유).\n  const appliedColor = colorClassName ? undefined : radixColor;\n\n  const cls = useMemo(() => {\n    const errorCls = error ? 'error' : '';\n    return clsx(errorCls, colorClassName, className);\n  }, [className, colorClassName, error]);\n\n  return (\n    <RadixSelect.Trigger\n      {...rest}\n      className={cls}\n      color={appliedColor}\n      ref={ref}\n    />\n  );\n});\n\nTrigger.displayName = 'Select.Trigger';\n\nexport type SelectRootProps = RadixSelect.RootProps & {\n  error?: boolean;\n  /** Trigger·Content에 일괄 적용할 color. 각 파트에서 color prop으로 개별 override 가능. */\n  color?: UiColor;\n};\n\nfunction Root(props: SelectRootProps): React.ReactNode {\n  const { error, color, ...rest } = props;\n\n  const value = useMemo(() => ({ error, color }), [error, color]);\n\n  return (\n    <SelectContext.Provider value={value}>\n      <RadixSelect.Root {...rest} />\n    </SelectContext.Provider>\n  );\n}\n\nRoot.displayName = 'Select.Root';\n\nexport const Select = {\n  ...RadixSelect,\n  Root,\n  Trigger,\n  Content,\n};\n","import type { BadgeProps as RadixBadgeProps } from '@radix-ui/themes';\n\n/**\n * Radix Themes가 제공하는 accent color union (gray, red, blue, ...).\n * 모든 color 지원 컴포넌트가 동일한 union을 공유하므로 Badge에서 파생한다.\n */\nexport type RadixColor = NonNullable<RadixBadgeProps['color']>;\n\n/** TIPP 시맨틱 color 별칭. */\nexport type SemanticColor = 'error' | 'accent' | 'neutral' | 'success';\n\n/**\n * Radix accent에 대응이 없어 CSS accent override로 처리하는 커스텀 color.\n * (예: black — `style/black.scss`의 `.tipp-accent-black` 참고)\n */\nexport type CustomColor = 'black';\n\n/** color 지원 컴포넌트가 노출하는 통합 color 타입. */\nexport type UiColor = RadixColor | SemanticColor | CustomColor;\n\n/**\n * union 각 멤버에 분배되는 Omit.\n * Radix의 polymorphic 컴포넌트 props(Text/Heading/Link 등 `as`로 분기되는 union)에서\n * 키를 제거할 때 일반 Omit은 union을 단일 객체로 합쳐 `as` 분기를 무너뜨리므로 이 타입을 쓴다.\n */\nexport type DistributiveOmit<T, K extends PropertyKey> = T extends unknown\n  ? Omit<T, K>\n  : never;\n\nconst SEMANTIC_COLOR_MAP: Record<SemanticColor, RadixColor | undefined> = {\n  error: 'red',\n  neutral: 'gray',\n  success: 'green',\n  accent: undefined,\n};\n\ninterface CustomColorConfig {\n  /**\n   * accent override를 적용할 className.\n   */\n  className: string;\n  /**\n   * Radix에 넘길 fallback color.\n   * Text/Heading/Link 등은 `color` prop이 있어야 `data-accent-color`가 붙어\n   * `--accent-*`를 참조하므로, 유효한 Radix color를 함께 넘긴 뒤 className으로\n   * `--accent-*`를 덮어쓴다. (Badge/Button은 prop 없이도 accent 기반이라 무해)\n   */\n  fallbackColor: RadixColor;\n}\n\nconst CUSTOM_COLOR_MAP: Record<CustomColor, CustomColorConfig> = {\n  black: { className: 'tipp-accent-black', fallbackColor: 'gray' },\n};\n\nconst isSemanticColor = (color?: UiColor): color is SemanticColor =>\n  color !== undefined && color in SEMANTIC_COLOR_MAP;\n\nconst isCustomColor = (color?: UiColor): color is CustomColor =>\n  color !== undefined && color in CUSTOM_COLOR_MAP;\n\nexport interface ResolvedColor {\n  /** Radix 컴포넌트의 `color` prop에 그대로 전달할 값. custom color면 undefined. */\n  color?: RadixColor;\n  /** accent override를 적용하기 위해 요소에 붙일 className. */\n  className?: string;\n}\n\n/**\n * 통합 color 입력을 Radix color prop과 className으로 정규화한다.\n *\n * - custom color(black 등): Radix color는 비우고 accent override className을 반환\n * - semantic color(error/neutral/success/accent): 대응 Radix color로 변환\n * - Radix color: 그대로 pass-through\n */\nexport const resolveColor = (color?: UiColor): ResolvedColor => {\n  if (isCustomColor(color)) {\n    const { className, fallbackColor } = CUSTOM_COLOR_MAP[color];\n    return { color: fallbackColor, className };\n  }\n\n  if (isSemanticColor(color)) {\n    return { color: SEMANTIC_COLOR_MAP[color] };\n  }\n\n  return { color };\n};\n","import React, { createContext } from 'react';\nimport { Theme } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport { resolveColor, type UiColor } from '../utils/resolve-color';\n\ntype ThemeProps = React.ComponentProps<typeof Theme>;\n\n/**\n * 테마 전역 primary가 custom color(black 등)일 때 그 값을 하위로 전달하는 context.\n * Radix는 Portal 컨텐츠(Select 드롭다운 등)에 theme의 accentColor \"값\"(여기선 fallback gray)만\n * 복제하고 `.tipp-accent-black` className은 복제하지 않으므로, Portal 안에서는 accent override가\n * 사라진다. 래핑된 overlay 컴포넌트(Select 등)가 이 context를 최하위 fallback color로 읽어\n * 자기 요소에 className을 직접 부여하면 Portal 내부에서도 black이 유지된다.\n * (custom accent가 아닐 때는 undefined — Radix 네이티브 portal 상속에 맡긴다.)\n */\nexport const ThemeAccentContext = createContext<UiColor | undefined>(undefined);\n\nexport interface ThemeProviderProps extends Omit<ThemeProps, 'accentColor'> {\n  children: React.ReactNode;\n  /**\n   * 전역 primary(accent) color. Radix accent color에 더해 커스텀 `black`을 지원한다.\n   * black이면 Radix에는 fallback `gray`를 넘기고 Theme 루트에 accent override\n   * className을 부여하여 하위 컴포넌트가 color prop 없이도 black을 상속한다.\n   */\n  accentColor?: ThemeProps['accentColor'] | 'black';\n}\n\nexport function ThemeProvider(props: ThemeProviderProps): React.ReactNode {\n  const { accentColor = 'iris', className, ...rest } = props;\n\n  const { color: radixAccent, className: accentClassName } =\n    resolveColor(accentColor);\n\n  // custom accent(className이 생기는 경우 = black)일 때만 Portal 보정용으로 context에 흘린다.\n  const themeAccent = accentClassName ? accentColor : undefined;\n\n  return (\n    <ThemeAccentContext.Provider value={themeAccent}>\n      <Theme\n        accentColor={radixAccent ?? 'iris'}\n        className={clsx(accentClassName, className)}\n        radius=\"medium\"\n        {...rest}\n      />\n    </ThemeAccentContext.Provider>\n  );\n}\n","import type { TextProps as RadixTextProps } from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { Text as RadixText } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport React, { useMemo, forwardRef } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\nimport {\n  resolveColor,\n  type DistributiveOmit,\n  type UiColor,\n} from '../utils/resolve-color';\n\nexport type TypoProps = DistributiveOmit<RadixTextProps, 'color'> & {\n  variant?: Responsive<'body' | 'caption' | 'subtitle'>;\n  color?: UiColor;\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n  (props: TypoProps, ref): React.ReactNode => {\n    const { size, variant, children, color, className, ...rest } = props;\n\n    const { color: radixColor, className: colorClassName } = useMemo(\n      () => resolveColor(color),\n      [color]\n    );\n\n    const radixSize = useMemo<RadixTextProps['size']>(() => {\n      if (size !== undefined) return size;\n\n      if (variant === undefined) return '2';\n\n      return mapWithResponsive({\n        value: variant,\n        mapFn: (variantValue?: 'body' | 'caption' | 'subtitle') => {\n          switch (variantValue) {\n            case 'caption':\n              return '1';\n            case 'subtitle':\n              return '3';\n            case 'body':\n            default:\n              return '2';\n          }\n        },\n      });\n    }, [size, variant]);\n\n    return (\n      <RadixText\n        {...rest}\n        className={clsx(colorClassName, className)}\n        color={radixColor}\n        ref={ref}\n        size={radixSize}\n      >\n        {children}\n      </RadixText>\n    );\n  }\n);\n\nTypo.displayName = 'Typo';\n","import type {  Breakpoint, Responsive } from \"@radix-ui/themes/props\";\n\nexport const mapWithResponsive = <T extends string,K extends string>(\n args:  {value: Responsive<T>, mapFn: (value?:T)=>K |undefined}\n): Responsive<K> | undefined => {\n  const {value, mapFn} = args;\n  if(typeof value === 'string'){\n    return mapFn(value);\n  };\n  \n  if(typeof value === 'object'){\n    const newObj: Partial<Record<Breakpoint, K>> = {};\n    let key: Breakpoint;\n    for(key in value){\n      newObj[key] = mapFn(value[key]);\n    }\n    return newObj;\n  }\n  return value;\n};\n","import type {\n  DynamicFormFieldSchema,\n  DynamicFormSchema,\n  FieldOption,\n  ImageFieldOption,\n  ValidationRule,\n} from '@/types/dynamic-form-schema-generated';\n\nexport type FieldType =\n  | 'short_text'\n  | 'long_text'\n  | 'number'\n  | 'email'\n  | 'dropdown'\n  | 'choice'\n  | 'radio_cards'\n  | 'image_radio_card'\n  | 'choices'\n  | 'yes_no';\n\nexport type SchemaIssueLevel = 'error' | 'warning';\n\nexport interface SchemaIssue {\n  id: string;\n  level: SchemaIssueLevel;\n  message: string;\n  fieldName?: string;\n}\n\nfunction isRecord(value: unknown): value is Record<string, unknown> {\n  return Boolean(value) && typeof value === 'object' && !Array.isArray(value);\n}\n\nfunction isNonEmptyTrimmedString(value: unknown): value is string {\n  return typeof value === 'string' && value.trim().length > 0;\n}\n\nfunction isFiniteNumber(value: unknown): value is number {\n  return typeof value === 'number' && Number.isFinite(value);\n}\n\nfunction canCompileRegExp(pattern: string): boolean {\n  try {\n    // eslint-disable-next-line no-new -- 정규식 컴파일 가능 여부만 확인\n    new RegExp(pattern);\n    return true;\n  } catch {\n    return false;\n  }\n}\n\nexport function getFieldTypes(): FieldType[] {\n  return [\n    'short_text',\n    'long_text',\n    'number',\n    'email',\n    'dropdown',\n    'choice',\n    'radio_cards',\n    'image_radio_card',\n    'choices',\n    'yes_no',\n  ];\n}\n\nexport function getFieldTypeLabel(type: FieldType): string {\n  const map: Record<FieldType, string> = {\n    short_text: '짧은 텍스트',\n    long_text: '긴 텍스트',\n    number: '숫자',\n    email: '이메일',\n    dropdown: '드롭다운',\n    choice: '단일 선택(라디오)',\n    radio_cards: '라디오 카드',\n    image_radio_card: '이미지 라디오 카드',\n    choices: '다중 선택(체크)',\n    yes_no: '동의(체크)',\n  };\n  return map[type];\n}\n\nexport function findFieldIndexByName(\n  fields: DynamicFormFieldSchema[],\n  fieldName: string\n): number {\n  return fields.findIndex((field) => field.name === fieldName);\n}\n\nfunction toCamelFromSnake(value: string): string {\n  const parts: string[] = value.split('_').filter(Boolean);\n  if (parts.length === 0) return 'field';\n  const [first, ...rest] = parts;\n  const firstLower = first.toLowerCase();\n  const restCamel = rest\n    .map((p) => (p.length === 0 ? '' : p[0].toUpperCase() + p.slice(1)))\n    .join('');\n  return `${firstLower}${restCamel}`;\n}\n\nexport function createUniqueFieldName(\n  fields: DynamicFormFieldSchema[],\n  baseName: string\n): string {\n  const used = new Set<string>(fields.map((f) => f.name));\n  if (!used.has(baseName)) return baseName;\n  let i = 2;\n  while (used.has(`${baseName}${i}`)) i += 1;\n  return `${baseName}${i}`;\n}\n\nexport function createDefaultField(\n  type: FieldType,\n  currentFields: DynamicFormFieldSchema[]\n): DynamicFormFieldSchema {\n  const baseName: string = toCamelFromSnake(type);\n  const name: string = createUniqueFieldName(currentFields, baseName);\n  const label: string = getFieldTypeLabel(type);\n\n  if (type === 'short_text') return { name, type, label, placeholder: '' };\n  if (type === 'long_text') return { name, type, label, placeholder: '' };\n  if (type === 'number') return { name, type, label, placeholder: '' };\n  if (type === 'email') return { name, type, label, placeholder: '' };\n  if (type === 'dropdown')\n    return {\n      name,\n      type,\n      label,\n      placeholder: '',\n      options: [{ label: '옵션 1', value: 'option1' }],\n    };\n  if (type === 'choice')\n    return {\n      name,\n      type,\n      label,\n      orientation: 'vertical',\n      options: [{ label: '옵션 1', value: 'option1' }],\n    };\n  if (type === 'radio_cards')\n    return { name, type, label, options: [{ label: '옵션 1', value: 'option1' }] };\n  if (type === 'choices')\n    return {\n      name,\n      type,\n      label,\n      orientation: 'vertical',\n      options: [{ label: '옵션 1', value: 'option1' }],\n    };\n  if (type === 'yes_no') return { name, type, label, description: '' };\n\n  return {\n    name,\n    type,\n    label,\n    gridColumnsCount: 4,\n    gridItemHeight: '160px',\n    gridGap: '2',\n    imageFit: 'cover',\n    options: [\n      {\n        label: '이미지 1',\n        value: 'option1',\n        imageSrc: 'https://placehold.co/300x300/png?text=1',\n      },\n    ],\n  };\n}\n\nexport function normalizeSchema(value: DynamicFormSchema | undefined): DynamicFormSchema {\n  const fallback: DynamicFormSchema = { fields: [] };\n  if (!value) return fallback;\n  if (!Array.isArray(value.fields)) return fallback;\n  return { fields: value.fields };\n}\n\nexport function validateDynamicFormSchema(schema: DynamicFormSchema): SchemaIssue[] {\n  const issues: SchemaIssue[] = [];\n\n  const nameToCount = new Map<string, number>();\n  schema.fields.forEach((field) => {\n    const prev = nameToCount.get(field.name) || 0;\n    nameToCount.set(field.name, prev + 1);\n  });\n\n  schema.fields.forEach((field, index) => {\n    const fieldKey = `${index}:${field.name}`;\n\n    if (!isNonEmptyTrimmedString(field.name)) {\n      issues.push({\n        id: `field.name.required.${fieldKey}`,\n        level: 'error',\n        message: '필드 name은 필수입니다',\n        fieldName: field.name,\n      });\n    } else if (field.name.trim() !== field.name) {\n      issues.push({\n        id: `field.name.trim.${fieldKey}`,\n        level: 'warning',\n        message: '필드 name 앞/뒤 공백은 제거하는 것을 권장합니다',\n        fieldName: field.name,\n      });\n    }\n\n    if (isNonEmptyTrimmedString(field.name)) {\n      const count = nameToCount.get(field.name) || 0;\n      if (count > 1) {\n        issues.push({\n          id: `field.name.duplicate.${fieldKey}`,\n          level: 'error',\n          message: `중복된 name입니다: ${field.name}`,\n          fieldName: field.name,\n        });\n      }\n    }\n\n    if (!isNonEmptyTrimmedString(field.label)) {\n      issues.push({\n        id: `field.label.required.${fieldKey}`,\n        level: 'error',\n        message: '필드 label은 필수입니다',\n        fieldName: field.name,\n      });\n    }\n\n    const type = field.type;\n    const isOptionType =\n      type === 'dropdown' ||\n      type === 'choice' ||\n      type === 'radio_cards' ||\n      type === 'choices';\n\n    if (isOptionType) {\n      const optionsRaw: unknown = field.options;\n      if (!Array.isArray(optionsRaw) || optionsRaw.length === 0) {\n        issues.push({\n          id: `field.options.required.${fieldKey}`,\n          level: 'error',\n          message: 'options는 1개 이상 필요합니다',\n          fieldName: field.name,\n        });\n      }\n    }\n\n    if (type === 'image_radio_card') {\n      const optionsRaw: unknown = field.options;\n      if (!Array.isArray(optionsRaw) || optionsRaw.length === 0) {\n        issues.push({\n          id: `field.imageOptions.required.${fieldKey}`,\n          level: 'error',\n          message: 'options는 1개 이상 필요합니다',\n          fieldName: field.name,\n        });\n      } else {\n        optionsRaw.forEach((opt, optIndex) => {\n          const imageSrc = isRecord(opt) ? opt.imageSrc : undefined;\n          if (!isNonEmptyTrimmedString(imageSrc)) {\n            issues.push({\n              id: `field.imageOptions.imageSrc.required.${fieldKey}.${optIndex}`,\n              level: 'error',\n              message: 'imageSrc는 필수입니다',\n              fieldName: field.name,\n            });\n          }\n        });\n      }\n    }\n\n    const validation: ValidationRule | undefined = field.validation;\n    if (validation) {\n      if (isFiniteNumber(validation.min) && isFiniteNumber(validation.max)) {\n        if (validation.min > validation.max) {\n          issues.push({\n            id: `field.validation.minmax.${fieldKey}`,\n            level: 'error',\n            message: 'validation.min은 validation.max 이하이어야 합니다',\n            fieldName: field.name,\n          });\n        }\n      }\n      if (isNonEmptyTrimmedString(validation.pattern)) {\n        if (!canCompileRegExp(validation.pattern)) {\n          issues.push({\n            id: `field.validation.pattern.${fieldKey}`,\n            level: 'error',\n            message: 'validation.pattern이 올바른 정규식이 아닙니다',\n            fieldName: field.name,\n          });\n        }\n      }\n    }\n  });\n\n  return issues;\n}\n\nexport function hasErrorIssues(issues: SchemaIssue[]): boolean {\n  return issues.some((i) => i.level === 'error');\n}\n\nexport function updateSchemaFields(\n  schema: DynamicFormSchema,\n  nextFields: DynamicFormFieldSchema[]\n): DynamicFormSchema {\n  return { fields: nextFields };\n}\n\nexport function moveField(\n  fields: DynamicFormFieldSchema[],\n  fromIndex: number,\n  toIndex: number\n): DynamicFormFieldSchema[] {\n  if (fromIndex < 0 || fromIndex >= fields.length) return fields;\n  if (toIndex < 0 || toIndex >= fields.length) return fields;\n  if (fromIndex === toIndex) return fields;\n\n  const next: DynamicFormFieldSchema[] = [...fields];\n  const [item] = next.splice(fromIndex, 1);\n  next.splice(toIndex, 0, item);\n  return next;\n}\n\nexport function duplicateField(fields: DynamicFormFieldSchema[], index: number): DynamicFormFieldSchema[] {\n  if (index < 0 || index >= fields.length) return fields;\n  const target = fields[index];\n  const nextName: string = createUniqueFieldName(fields, target.name);\n  const cloned: DynamicFormFieldSchema = { ...target, name: nextName };\n  const next: DynamicFormFieldSchema[] = [...fields];\n  next.splice(index + 1, 0, cloned);\n  return next;\n}\n\nexport function updateFieldCommonProps(\n  field: DynamicFormFieldSchema,\n  next: {\n    name?: string;\n    label?: string;\n    description?: string | undefined;\n    required?: boolean;\n  }\n): DynamicFormFieldSchema {\n  const { name, label, description, required } = next;\n  return {\n    ...field,\n    ...(name !== undefined ? { name } : {}),\n    ...(label !== undefined ? { label } : {}),\n    ...(description !== undefined ? { description } : {}),\n    ...(required !== undefined ? { required } : {}),\n  };\n}\n\nexport function updateFieldValidation(\n  field: DynamicFormFieldSchema,\n  next: ValidationRule | undefined\n): DynamicFormFieldSchema {\n  if (!next) {\n    const { validation: _validation, ...rest } = field;\n    return rest;\n  }\n  return { ...field, validation: next };\n}\n\nexport function updateTextPlaceholder(\n  field: DynamicFormFieldSchema,\n  placeholder: string\n): DynamicFormFieldSchema {\n  const type = field.type;\n  if (type === 'short_text' || type === 'long_text' || type === 'number' || type === 'email' || type === 'dropdown') {\n    return { ...field, placeholder };\n  }\n  return field;\n}\n\nexport function updateOrientation(\n  field: DynamicFormFieldSchema,\n  orientation: 'horizontal' | 'vertical'\n): DynamicFormFieldSchema {\n  const type = field.type;\n  if (type === 'choice' || type === 'choices') return { ...field, orientation };\n  return field;\n}\n\nexport function updateOptions(\n  field: DynamicFormFieldSchema,\n  options: FieldOption[]\n): DynamicFormFieldSchema {\n  const type = field.type;\n  if (type === 'dropdown' || type === 'choice' || type === 'radio_cards' || type === 'choices') {\n    return { ...field, options };\n  }\n  return field;\n}\n\nexport function updateImageOptions(\n  field: DynamicFormFieldSchema,\n  options: ImageFieldOption[]\n): DynamicFormFieldSchema {\n  if (field.type === 'image_radio_card') {\n    return { ...field, options };\n  }\n  return field;\n}\n\nexport function updateImageLayout(\n  field: DynamicFormFieldSchema,\n  next: {\n    gridColumnsCount?: number | undefined;\n    gridItemHeight?: string | undefined;\n    gridColumns?: string | undefined;\n    gridRows?: string | undefined;\n    gridGap?: string | undefined;\n    imageFit?: 'cover' | 'contain' | undefined;\n  }\n): DynamicFormFieldSchema {\n  if (field.type !== 'image_radio_card') return field;\n  return { ...field, ...next };\n}\n\nexport function resetFieldType(\n  field: DynamicFormFieldSchema,\n  nextType: FieldType,\n  allFields: DynamicFormFieldSchema[]\n): DynamicFormFieldSchema {\n  const base: DynamicFormFieldSchema = createDefaultField(nextType, allFields);\n  return {\n    ...base,\n    name: field.name,\n    label: field.label,\n    description: field.description,\n    required: field.required,\n    validation: field.validation,\n  };\n}\n"],"mappings":"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","names":["import_react","import_themes","RadixCard","import_themes","import_themes","import_clsx","import_react","import_react","import_themes","import_jsx_runtime","import_jsx_runtime","_a","RadixSelect","import_themes","import_clsx","import_react","import_jsx_runtime","RadixText","import_jsx_runtime"]}
+{"version":3,"sources":["../../src/molecules/dynamic-form-editor-field-list-panel.tsx","../../src/atoms/card.tsx","../../src/atoms/flex.tsx","../../src/atoms/select.tsx","../../src/utils/resolve-color.ts","../../src/theme/theme-provider.tsx","../../src/atoms/typo.tsx","../../src/utils/map-with-responsive.ts","../../src/utils/mono-style.ts","../../src/molecules/dynamic-form-editor-utils.ts"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { Box } from '@radix-ui/themes';\nimport { Card } from '@/atoms/card';\nimport { Flex } from '@/atoms/flex';\nimport { Select } from '@/atoms/select';\nimport { Typo } from '@/atoms/typo';\nimport type { DynamicFormFieldSchema } from '@/types/dynamic-form-schema-generated';\nimport { getFieldTypeLabel, type FieldType } from './dynamic-form-editor-utils';\n\nfunction isFieldType(value: string, types: FieldType[]): value is FieldType {\n  return types.some((t) => t === value);\n}\n\nexport interface DynamicFormEditorFieldListPanelProps {\n  fields: DynamicFormFieldSchema[];\n  selectedFieldName: string | null;\n  readonly: boolean;\n  fieldTypes: FieldType[];\n  hasFieldError: (fieldName: string) => boolean;\n  onSelectFieldName: (fieldName: string) => void;\n  onAddField: (type: FieldType) => void;\n}\n\nexport function DynamicFormEditorFieldListPanel(\n  props: DynamicFormEditorFieldListPanelProps\n): React.ReactElement {\n  const {\n    fields,\n    selectedFieldName,\n    readonly,\n    fieldTypes,\n    hasFieldError,\n    onSelectFieldName,\n    onAddField,\n  } = props;\n\n  const isEmpty: boolean = fields.length === 0;\n\n  const triggerPlaceholder: string = useMemo(() => {\n    return readonly ? '추가(읽기 전용)' : '추가';\n  }, [readonly]);\n\n  return (\n    <Card style={{ width: 340, padding: 12 }}>\n      <Flex direction=\"column\" gap=\"3\">\n        <Flex align=\"center\" justify=\"between\">\n          <Typo variant=\"body\">필드</Typo>\n          <Select.Root\n            disabled={readonly}\n            onValueChange={(v: string): void => {\n              if (!isFieldType(v, fieldTypes)) return;\n              onAddField(v);\n            }}\n            value=\"\"\n          >\n            <Select.Trigger placeholder={triggerPlaceholder} />\n            <Select.Content>\n              {fieldTypes.map((t) => (\n                <Select.Item key={t} value={t}>\n                  {getFieldTypeLabel(t)}\n                </Select.Item>\n              ))}\n            </Select.Content>\n          </Select.Root>\n        </Flex>\n\n        <Flex direction=\"column\" gap=\"2\">\n          {isEmpty ? (\n            <Typo color=\"gray\" variant=\"caption\">\n              아직 필드가 없습니다.\n            </Typo>\n          ) : null}\n\n          {fields.map((field) => {\n            const isSelected: boolean = field.name === selectedFieldName;\n            const hasError: boolean = hasFieldError(field.name);\n\n            return (\n              <Card\n                error={isSelected ? hasError : undefined}\n                key={field.name}\n                onClick={(): void => { onSelectFieldName(field.name); }}\n                style={{\n                  padding: 10,\n                  cursor: 'pointer',\n                  opacity: readonly ? 0.8 : 1,\n                  border: isSelected\n                    ? '1px solid var(--accent-9)'\n                    : '1px solid transparent',\n                }}\n              >\n                <Box style={{ minWidth: 0 }}>\n                  <Typo\n                    style={{\n                      whiteSpace: 'nowrap',\n                      overflow: 'hidden',\n                      textOverflow: 'ellipsis',\n                    }}\n                    variant=\"body\"\n                  >\n                    {field.label}\n                  </Typo>\n                  <Typo color=\"gray\" variant=\"caption\">\n                    {field.name} · {field.type}\n                    {field.required ? ' · required' : ''}\n                  </Typo>\n                </Box>\n              </Card>\n            );\n          })}\n        </Flex>\n      </Flex>\n    </Card>\n  );\n}\n\n","import { forwardRef, useMemo } from 'react';\nimport {\n  Card as RadixCard,\n  type CardProps as RadixCardProps,\n} from '@radix-ui/themes';\n\nexport type CardProps = RadixCardProps & {\n  borderRadius?: 'none';\n  borderDisable?: {\n    left?: boolean;\n    right?: boolean;\n    top?: boolean;\n    bottom?: boolean;\n  };\n  error?: boolean;\n};\n\nexport const Card = forwardRef<HTMLDivElement, CardProps>(\n  (props, forwardedRef) => {\n    const { borderDisable, borderRadius, error, ...rest } = props;\n\n    const borderInsetClassName = useMemo(() => {\n      if (!borderDisable) return '';\n      const { left, right, top, bottom } = borderDisable;\n      return [\n        left && 'disable-inset-left',\n        right && 'disable-inset-right',\n        top && 'disable-inset-top',\n        bottom && 'disable-inset-bottom',\n      ]\n        .filter(Boolean)\n        .join(' ');\n    }, [borderDisable]);\n\n    const errorClsName = useMemo(() => {\n      return error ? ' error' : '';\n    }, [error]);\n\n    return (\n      <RadixCard\n        variant=\"surface\"\n        {...rest}\n        className={`${borderInsetClassName}${errorClsName} ${rest.className || ''}`}\n        data-radius={borderRadius}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n\nCard.displayName = 'Card';\n","export { Flex, type FlexProps } from '@radix-ui/themes';\n","import { Select as RadixSelect } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport { createContext, forwardRef, useContext, useMemo } from 'react';\nimport {\n  resolveColor,\n  type DistributiveOmit,\n  type UiColor,\n} from '../utils/resolve-color';\nimport { ThemeAccentContext } from '../theme/theme-provider';\n\nconst SelectContext = createContext<{ error?: boolean; color?: UiColor }>({\n  error: false,\n});\n\nexport type ContentProps = DistributiveOmit<\n  RadixSelect.ContentProps,\n  'color'\n> & {\n  isNavigation?: boolean;\n  color?: UiColor;\n};\n\nconst Content = forwardRef<HTMLDivElement, ContentProps>((props, ref) => {\n  const { className, isNavigation, color, ...rest } = props;\n  const { error, color: contextColor } = useContext(SelectContext);\n  const themeAccent = useContext(ThemeAccentContext);\n\n  // Content는 Portal로 렌더돼 theme의 className override를 못 받으므로, per-instance/Root color가\n  // 없으면 theme custom accent(black)를 fallback으로 적용해 Portal 안에서도 black을 유지한다.\n  const { color: radixColor, className: colorClassName } = useMemo(\n    () => resolveColor(color ?? contextColor ?? themeAccent),\n    [color, contextColor, themeAccent]\n  );\n\n  // custom color(black)는 className override만 사용 — fallback color를 함께 넘기면 자식 Item이\n  // 자기 data-accent-color로 gray를 다시 적용해 override를 덮는다.\n  const appliedColor = colorClassName ? undefined : radixColor;\n\n  const cls = useMemo(() => {\n    const etc = isNavigation ? 'nav-select' : '';\n    const errorCls = error ? 'tipp-error' : '';\n    return clsx(etc, errorCls, colorClassName, className);\n  }, [className, colorClassName, error, isNavigation]);\n\n  return (\n    <RadixSelect.Content\n      position=\"popper\"\n      {...rest}\n      className={cls}\n      color={appliedColor}\n      ref={ref}\n    />\n  );\n});\nContent.displayName = 'Select.Content';\n\nexport type TriggerProps = DistributiveOmit<\n  RadixSelect.TriggerProps,\n  'color'\n> & {\n  color?: UiColor;\n};\n\nconst Trigger = forwardRef<HTMLButtonElement, TriggerProps>((props, ref) => {\n  const { className, color, ...rest } = props;\n  const { error, color: contextColor } = useContext(SelectContext);\n\n  const { color: radixColor, className: colorClassName } = useMemo(\n    () => resolveColor(color ?? contextColor),\n    [color, contextColor]\n  );\n\n  // custom color(black)는 className override만 사용 (위 Content와 동일 이유).\n  const appliedColor = colorClassName ? undefined : radixColor;\n\n  const cls = useMemo(() => {\n    const errorCls = error ? 'error' : '';\n    return clsx(errorCls, colorClassName, className);\n  }, [className, colorClassName, error]);\n\n  return (\n    <RadixSelect.Trigger\n      {...rest}\n      className={cls}\n      color={appliedColor}\n      ref={ref}\n    />\n  );\n});\n\nTrigger.displayName = 'Select.Trigger';\n\nexport type SelectRootProps = RadixSelect.RootProps & {\n  error?: boolean;\n  /** Trigger·Content에 일괄 적용할 color. 각 파트에서 color prop으로 개별 override 가능. */\n  color?: UiColor;\n};\n\nfunction Root(props: SelectRootProps): React.ReactNode {\n  const { error, color, ...rest } = props;\n\n  const value = useMemo(() => ({ error, color }), [error, color]);\n\n  return (\n    <SelectContext.Provider value={value}>\n      <RadixSelect.Root {...rest} />\n    </SelectContext.Provider>\n  );\n}\n\nRoot.displayName = 'Select.Root';\n\nexport const Select = {\n  ...RadixSelect,\n  Root,\n  Trigger,\n  Content,\n};\n","import type { BadgeProps as RadixBadgeProps } from '@radix-ui/themes';\n\n/**\n * Radix Themes가 제공하는 accent color union (gray, red, blue, ...).\n * 모든 color 지원 컴포넌트가 동일한 union을 공유하므로 Badge에서 파생한다.\n */\nexport type RadixColor = NonNullable<RadixBadgeProps['color']>;\n\n/** TIPP 시맨틱 color 별칭. */\nexport type SemanticColor = 'error' | 'accent' | 'neutral' | 'success';\n\n/**\n * Radix accent에 대응이 없어 CSS accent override로 처리하는 커스텀 color.\n * (예: black — `style/black.scss`의 `.tipp-accent-black` 참고)\n */\nexport type CustomColor = 'black';\n\n/** color 지원 컴포넌트가 노출하는 통합 color 타입. */\nexport type UiColor = RadixColor | SemanticColor | CustomColor;\n\n/**\n * union 각 멤버에 분배되는 Omit.\n * Radix의 polymorphic 컴포넌트 props(Text/Heading/Link 등 `as`로 분기되는 union)에서\n * 키를 제거할 때 일반 Omit은 union을 단일 객체로 합쳐 `as` 분기를 무너뜨리므로 이 타입을 쓴다.\n */\nexport type DistributiveOmit<T, K extends PropertyKey> = T extends unknown\n  ? Omit<T, K>\n  : never;\n\nconst SEMANTIC_COLOR_MAP: Record<SemanticColor, RadixColor | undefined> = {\n  error: 'red',\n  neutral: 'gray',\n  success: 'green',\n  accent: undefined,\n};\n\ninterface CustomColorConfig {\n  /**\n   * accent override를 적용할 className.\n   */\n  className: string;\n  /**\n   * Radix에 넘길 fallback color.\n   * Text/Heading/Link 등은 `color` prop이 있어야 `data-accent-color`가 붙어\n   * `--accent-*`를 참조하므로, 유효한 Radix color를 함께 넘긴 뒤 className으로\n   * `--accent-*`를 덮어쓴다. (Badge/Button은 prop 없이도 accent 기반이라 무해)\n   */\n  fallbackColor: RadixColor;\n}\n\nconst CUSTOM_COLOR_MAP: Record<CustomColor, CustomColorConfig> = {\n  black: { className: 'tipp-accent-black', fallbackColor: 'gray' },\n};\n\nconst isSemanticColor = (color?: UiColor): color is SemanticColor =>\n  color !== undefined && color in SEMANTIC_COLOR_MAP;\n\nconst isCustomColor = (color?: UiColor): color is CustomColor =>\n  color !== undefined && color in CUSTOM_COLOR_MAP;\n\nexport interface ResolvedColor {\n  /** Radix 컴포넌트의 `color` prop에 그대로 전달할 값. custom color면 undefined. */\n  color?: RadixColor;\n  /** accent override를 적용하기 위해 요소에 붙일 className. */\n  className?: string;\n}\n\n/**\n * 통합 color 입력을 Radix color prop과 className으로 정규화한다.\n *\n * - custom color(black 등): Radix color는 비우고 accent override className을 반환\n * - semantic color(error/neutral/success/accent): 대응 Radix color로 변환\n * - Radix color: 그대로 pass-through\n */\nexport const resolveColor = (color?: UiColor): ResolvedColor => {\n  if (isCustomColor(color)) {\n    const { className, fallbackColor } = CUSTOM_COLOR_MAP[color];\n    return { color: fallbackColor, className };\n  }\n\n  if (isSemanticColor(color)) {\n    return { color: SEMANTIC_COLOR_MAP[color] };\n  }\n\n  return { color };\n};\n","import React, { createContext } from 'react';\nimport { Theme } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport { resolveColor, type UiColor } from '../utils/resolve-color';\n\ntype ThemeProps = React.ComponentProps<typeof Theme>;\n\n/**\n * 테마 전역 primary가 custom color(black 등)일 때 그 값을 하위로 전달하는 context.\n * Radix는 Portal 컨텐츠(Select 드롭다운 등)에 theme의 accentColor \"값\"(여기선 fallback gray)만\n * 복제하고 `.tipp-accent-black` className은 복제하지 않으므로, Portal 안에서는 accent override가\n * 사라진다. 래핑된 overlay 컴포넌트(Select 등)가 이 context를 최하위 fallback color로 읽어\n * 자기 요소에 className을 직접 부여하면 Portal 내부에서도 black이 유지된다.\n * (custom accent가 아닐 때는 undefined — Radix 네이티브 portal 상속에 맡긴다.)\n */\nexport const ThemeAccentContext = createContext<UiColor | undefined>(undefined);\n\nexport interface ThemeProviderProps extends Omit<ThemeProps, 'accentColor'> {\n  children: React.ReactNode;\n  /**\n   * 전역 primary(accent) color. Radix accent color에 더해 커스텀 `black`을 지원한다.\n   * black이면 Radix에는 fallback `gray`를 넘기고 Theme 루트에 accent override\n   * className을 부여하여 하위 컴포넌트가 color prop 없이도 black을 상속한다.\n   */\n  accentColor?: ThemeProps['accentColor'] | 'black';\n}\n\nexport function ThemeProvider(props: ThemeProviderProps): React.ReactNode {\n  const { accentColor = 'iris', className, ...rest } = props;\n\n  const { color: radixAccent, className: accentClassName } =\n    resolveColor(accentColor);\n\n  // custom accent(className이 생기는 경우 = black)일 때만 Portal 보정용으로 context에 흘린다.\n  const themeAccent = accentClassName ? accentColor : undefined;\n\n  return (\n    <ThemeAccentContext.Provider value={themeAccent}>\n      <Theme\n        accentColor={radixAccent ?? 'iris'}\n        className={clsx(accentClassName, className)}\n        radius=\"medium\"\n        {...rest}\n      />\n    </ThemeAccentContext.Provider>\n  );\n}\n","import type { TextProps as RadixTextProps } from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { Text as RadixText } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport React, { useMemo, forwardRef } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\nimport { MONO_STYLE } from '../utils/mono-style';\nimport {\n  resolveColor,\n  type DistributiveOmit,\n  type UiColor,\n} from '../utils/resolve-color';\n\nexport type TypoProps = DistributiveOmit<RadixTextProps, 'color'> & {\n  variant?: Responsive<'body' | 'caption' | 'subtitle'>;\n  color?: UiColor;\n  /** 등폭(monospace) 폰트 + 숫자 고정폭 정렬(tabular-nums). 점수·퍼센트 등 수치 표시에 사용한다. */\n  mono?: boolean;\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n  (props: TypoProps, ref): React.ReactNode => {\n    const { size, variant, children, color, className, mono, style, ...rest } =\n      props;\n\n    const { color: radixColor, className: colorClassName } = useMemo(\n      () => resolveColor(color),\n      [color]\n    );\n\n    const radixSize = useMemo<RadixTextProps['size']>(() => {\n      if (size !== undefined) return size;\n\n      if (variant === undefined) return '2';\n\n      return mapWithResponsive({\n        value: variant,\n        mapFn: (variantValue?: 'body' | 'caption' | 'subtitle') => {\n          switch (variantValue) {\n            case 'caption':\n              return '1';\n            case 'subtitle':\n              return '3';\n            case 'body':\n            default:\n              return '2';\n          }\n        },\n      });\n    }, [size, variant]);\n\n    return (\n      <RadixText\n        {...rest}\n        className={clsx(colorClassName, className)}\n        color={radixColor}\n        ref={ref}\n        size={radixSize}\n        style={mono ? { ...MONO_STYLE, ...style } : style}\n      >\n        {children}\n      </RadixText>\n    );\n  }\n);\n\nTypo.displayName = 'Typo';\n","import type {  Breakpoint, Responsive } from \"@radix-ui/themes/props\";\n\nexport const mapWithResponsive = <T extends string,K extends string>(\n args:  {value: Responsive<T>, mapFn: (value?:T)=>K |undefined}\n): Responsive<K> | undefined => {\n  const {value, mapFn} = args;\n  if(typeof value === 'string'){\n    return mapFn(value);\n  };\n  \n  if(typeof value === 'object'){\n    const newObj: Partial<Record<Breakpoint, K>> = {};\n    let key: Breakpoint;\n    for(key in value){\n      newObj[key] = mapFn(value[key]);\n    }\n    return newObj;\n  }\n  return value;\n};\n","import type { CSSProperties } from 'react';\n\n/**\n * 등폭(monospace) 텍스트 스타일.\n * - `font-family`: 등폭 폰트(`--code-font-family`는 Radix Themes가 제공, 없으면 시스템 등폭으로 폴백)\n * - `font-variant-numeric: tabular-nums`: 숫자를 고정폭으로 정렬해 점수·퍼센트·통계가 자릿수마다 흔들리지 않게 함\n *\n * `Typo`/`Heading`의 `mono` prop 구현에 사용된다.\n */\nexport const MONO_STYLE: CSSProperties = {\n  fontFamily: 'var(--code-font-family, ui-monospace, \"SF Mono\", monospace)',\n  fontVariantNumeric: 'tabular-nums',\n};\n","import type {\n  DynamicFormFieldSchema,\n  DynamicFormSchema,\n  FieldOption,\n  ImageFieldOption,\n  ValidationRule,\n} from '@/types/dynamic-form-schema-generated';\n\nexport type FieldType =\n  | 'short_text'\n  | 'long_text'\n  | 'number'\n  | 'email'\n  | 'dropdown'\n  | 'choice'\n  | 'radio_cards'\n  | 'image_radio_card'\n  | 'choices'\n  | 'yes_no';\n\nexport type SchemaIssueLevel = 'error' | 'warning';\n\nexport interface SchemaIssue {\n  id: string;\n  level: SchemaIssueLevel;\n  message: string;\n  fieldName?: string;\n}\n\nfunction isRecord(value: unknown): value is Record<string, unknown> {\n  return Boolean(value) && typeof value === 'object' && !Array.isArray(value);\n}\n\nfunction isNonEmptyTrimmedString(value: unknown): value is string {\n  return typeof value === 'string' && value.trim().length > 0;\n}\n\nfunction isFiniteNumber(value: unknown): value is number {\n  return typeof value === 'number' && Number.isFinite(value);\n}\n\nfunction canCompileRegExp(pattern: string): boolean {\n  try {\n    // eslint-disable-next-line no-new -- 정규식 컴파일 가능 여부만 확인\n    new RegExp(pattern);\n    return true;\n  } catch {\n    return false;\n  }\n}\n\nexport function getFieldTypes(): FieldType[] {\n  return [\n    'short_text',\n    'long_text',\n    'number',\n    'email',\n    'dropdown',\n    'choice',\n    'radio_cards',\n    'image_radio_card',\n    'choices',\n    'yes_no',\n  ];\n}\n\nexport function getFieldTypeLabel(type: FieldType): string {\n  const map: Record<FieldType, string> = {\n    short_text: '짧은 텍스트',\n    long_text: '긴 텍스트',\n    number: '숫자',\n    email: '이메일',\n    dropdown: '드롭다운',\n    choice: '단일 선택(라디오)',\n    radio_cards: '라디오 카드',\n    image_radio_card: '이미지 라디오 카드',\n    choices: '다중 선택(체크)',\n    yes_no: '동의(체크)',\n  };\n  return map[type];\n}\n\nexport function findFieldIndexByName(\n  fields: DynamicFormFieldSchema[],\n  fieldName: string\n): number {\n  return fields.findIndex((field) => field.name === fieldName);\n}\n\nfunction toCamelFromSnake(value: string): string {\n  const parts: string[] = value.split('_').filter(Boolean);\n  if (parts.length === 0) return 'field';\n  const [first, ...rest] = parts;\n  const firstLower = first.toLowerCase();\n  const restCamel = rest\n    .map((p) => (p.length === 0 ? '' : p[0].toUpperCase() + p.slice(1)))\n    .join('');\n  return `${firstLower}${restCamel}`;\n}\n\nexport function createUniqueFieldName(\n  fields: DynamicFormFieldSchema[],\n  baseName: string\n): string {\n  const used = new Set<string>(fields.map((f) => f.name));\n  if (!used.has(baseName)) return baseName;\n  let i = 2;\n  while (used.has(`${baseName}${i}`)) i += 1;\n  return `${baseName}${i}`;\n}\n\nexport function createDefaultField(\n  type: FieldType,\n  currentFields: DynamicFormFieldSchema[]\n): DynamicFormFieldSchema {\n  const baseName: string = toCamelFromSnake(type);\n  const name: string = createUniqueFieldName(currentFields, baseName);\n  const label: string = getFieldTypeLabel(type);\n\n  if (type === 'short_text') return { name, type, label, placeholder: '' };\n  if (type === 'long_text') return { name, type, label, placeholder: '' };\n  if (type === 'number') return { name, type, label, placeholder: '' };\n  if (type === 'email') return { name, type, label, placeholder: '' };\n  if (type === 'dropdown')\n    return {\n      name,\n      type,\n      label,\n      placeholder: '',\n      options: [{ label: '옵션 1', value: 'option1' }],\n    };\n  if (type === 'choice')\n    return {\n      name,\n      type,\n      label,\n      orientation: 'vertical',\n      options: [{ label: '옵션 1', value: 'option1' }],\n    };\n  if (type === 'radio_cards')\n    return { name, type, label, options: [{ label: '옵션 1', value: 'option1' }] };\n  if (type === 'choices')\n    return {\n      name,\n      type,\n      label,\n      orientation: 'vertical',\n      options: [{ label: '옵션 1', value: 'option1' }],\n    };\n  if (type === 'yes_no') return { name, type, label, description: '' };\n\n  return {\n    name,\n    type,\n    label,\n    gridColumnsCount: 4,\n    gridItemHeight: '160px',\n    gridGap: '2',\n    imageFit: 'cover',\n    options: [\n      {\n        label: '이미지 1',\n        value: 'option1',\n        imageSrc: 'https://placehold.co/300x300/png?text=1',\n      },\n    ],\n  };\n}\n\nexport function normalizeSchema(value: DynamicFormSchema | undefined): DynamicFormSchema {\n  const fallback: DynamicFormSchema = { fields: [] };\n  if (!value) return fallback;\n  if (!Array.isArray(value.fields)) return fallback;\n  return { fields: value.fields };\n}\n\nexport function validateDynamicFormSchema(schema: DynamicFormSchema): SchemaIssue[] {\n  const issues: SchemaIssue[] = [];\n\n  const nameToCount = new Map<string, number>();\n  schema.fields.forEach((field) => {\n    const prev = nameToCount.get(field.name) || 0;\n    nameToCount.set(field.name, prev + 1);\n  });\n\n  schema.fields.forEach((field, index) => {\n    const fieldKey = `${index}:${field.name}`;\n\n    if (!isNonEmptyTrimmedString(field.name)) {\n      issues.push({\n        id: `field.name.required.${fieldKey}`,\n        level: 'error',\n        message: '필드 name은 필수입니다',\n        fieldName: field.name,\n      });\n    } else if (field.name.trim() !== field.name) {\n      issues.push({\n        id: `field.name.trim.${fieldKey}`,\n        level: 'warning',\n        message: '필드 name 앞/뒤 공백은 제거하는 것을 권장합니다',\n        fieldName: field.name,\n      });\n    }\n\n    if (isNonEmptyTrimmedString(field.name)) {\n      const count = nameToCount.get(field.name) || 0;\n      if (count > 1) {\n        issues.push({\n          id: `field.name.duplicate.${fieldKey}`,\n          level: 'error',\n          message: `중복된 name입니다: ${field.name}`,\n          fieldName: field.name,\n        });\n      }\n    }\n\n    if (!isNonEmptyTrimmedString(field.label)) {\n      issues.push({\n        id: `field.label.required.${fieldKey}`,\n        level: 'error',\n        message: '필드 label은 필수입니다',\n        fieldName: field.name,\n      });\n    }\n\n    const type = field.type;\n    const isOptionType =\n      type === 'dropdown' ||\n      type === 'choice' ||\n      type === 'radio_cards' ||\n      type === 'choices';\n\n    if (isOptionType) {\n      const optionsRaw: unknown = field.options;\n      if (!Array.isArray(optionsRaw) || optionsRaw.length === 0) {\n        issues.push({\n          id: `field.options.required.${fieldKey}`,\n          level: 'error',\n          message: 'options는 1개 이상 필요합니다',\n          fieldName: field.name,\n        });\n      }\n    }\n\n    if (type === 'image_radio_card') {\n      const optionsRaw: unknown = field.options;\n      if (!Array.isArray(optionsRaw) || optionsRaw.length === 0) {\n        issues.push({\n          id: `field.imageOptions.required.${fieldKey}`,\n          level: 'error',\n          message: 'options는 1개 이상 필요합니다',\n          fieldName: field.name,\n        });\n      } else {\n        optionsRaw.forEach((opt, optIndex) => {\n          const imageSrc = isRecord(opt) ? opt.imageSrc : undefined;\n          if (!isNonEmptyTrimmedString(imageSrc)) {\n            issues.push({\n              id: `field.imageOptions.imageSrc.required.${fieldKey}.${optIndex}`,\n              level: 'error',\n              message: 'imageSrc는 필수입니다',\n              fieldName: field.name,\n            });\n          }\n        });\n      }\n    }\n\n    const validation: ValidationRule | undefined = field.validation;\n    if (validation) {\n      if (isFiniteNumber(validation.min) && isFiniteNumber(validation.max)) {\n        if (validation.min > validation.max) {\n          issues.push({\n            id: `field.validation.minmax.${fieldKey}`,\n            level: 'error',\n            message: 'validation.min은 validation.max 이하이어야 합니다',\n            fieldName: field.name,\n          });\n        }\n      }\n      if (isNonEmptyTrimmedString(validation.pattern)) {\n        if (!canCompileRegExp(validation.pattern)) {\n          issues.push({\n            id: `field.validation.pattern.${fieldKey}`,\n            level: 'error',\n            message: 'validation.pattern이 올바른 정규식이 아닙니다',\n            fieldName: field.name,\n          });\n        }\n      }\n    }\n  });\n\n  return issues;\n}\n\nexport function hasErrorIssues(issues: SchemaIssue[]): boolean {\n  return issues.some((i) => i.level === 'error');\n}\n\nexport function updateSchemaFields(\n  schema: DynamicFormSchema,\n  nextFields: DynamicFormFieldSchema[]\n): DynamicFormSchema {\n  return { fields: nextFields };\n}\n\nexport function moveField(\n  fields: DynamicFormFieldSchema[],\n  fromIndex: number,\n  toIndex: number\n): DynamicFormFieldSchema[] {\n  if (fromIndex < 0 || fromIndex >= fields.length) return fields;\n  if (toIndex < 0 || toIndex >= fields.length) return fields;\n  if (fromIndex === toIndex) return fields;\n\n  const next: DynamicFormFieldSchema[] = [...fields];\n  const [item] = next.splice(fromIndex, 1);\n  next.splice(toIndex, 0, item);\n  return next;\n}\n\nexport function duplicateField(fields: DynamicFormFieldSchema[], index: number): DynamicFormFieldSchema[] {\n  if (index < 0 || index >= fields.length) return fields;\n  const target = fields[index];\n  const nextName: string = createUniqueFieldName(fields, target.name);\n  const cloned: DynamicFormFieldSchema = { ...target, name: nextName };\n  const next: DynamicFormFieldSchema[] = [...fields];\n  next.splice(index + 1, 0, cloned);\n  return next;\n}\n\nexport function updateFieldCommonProps(\n  field: DynamicFormFieldSchema,\n  next: {\n    name?: string;\n    label?: string;\n    description?: string | undefined;\n    required?: boolean;\n  }\n): DynamicFormFieldSchema {\n  const { name, label, description, required } = next;\n  return {\n    ...field,\n    ...(name !== undefined ? { name } : {}),\n    ...(label !== undefined ? { label } : {}),\n    ...(description !== undefined ? { description } : {}),\n    ...(required !== undefined ? { required } : {}),\n  };\n}\n\nexport function updateFieldValidation(\n  field: DynamicFormFieldSchema,\n  next: ValidationRule | undefined\n): DynamicFormFieldSchema {\n  if (!next) {\n    const { validation: _validation, ...rest } = field;\n    return rest;\n  }\n  return { ...field, validation: next };\n}\n\nexport function updateTextPlaceholder(\n  field: DynamicFormFieldSchema,\n  placeholder: string\n): DynamicFormFieldSchema {\n  const type = field.type;\n  if (type === 'short_text' || type === 'long_text' || type === 'number' || type === 'email' || type === 'dropdown') {\n    return { ...field, placeholder };\n  }\n  return field;\n}\n\nexport function updateOrientation(\n  field: DynamicFormFieldSchema,\n  orientation: 'horizontal' | 'vertical'\n): DynamicFormFieldSchema {\n  const type = field.type;\n  if (type === 'choice' || type === 'choices') return { ...field, orientation };\n  return field;\n}\n\nexport function updateOptions(\n  field: DynamicFormFieldSchema,\n  options: FieldOption[]\n): DynamicFormFieldSchema {\n  const type = field.type;\n  if (type === 'dropdown' || type === 'choice' || type === 'radio_cards' || type === 'choices') {\n    return { ...field, options };\n  }\n  return field;\n}\n\nexport function updateImageOptions(\n  field: DynamicFormFieldSchema,\n  options: ImageFieldOption[]\n): DynamicFormFieldSchema {\n  if (field.type === 'image_radio_card') {\n    return { ...field, options };\n  }\n  return field;\n}\n\nexport function updateImageLayout(\n  field: DynamicFormFieldSchema,\n  next: {\n    gridColumnsCount?: number | undefined;\n    gridItemHeight?: string | undefined;\n    gridColumns?: string | undefined;\n    gridRows?: string | undefined;\n    gridGap?: string | undefined;\n    imageFit?: 'cover' | 'contain' | undefined;\n  }\n): DynamicFormFieldSchema {\n  if (field.type !== 'image_radio_card') return field;\n  return { ...field, ...next };\n}\n\nexport function resetFieldType(\n  field: DynamicFormFieldSchema,\n  nextType: FieldType,\n  allFields: DynamicFormFieldSchema[]\n): DynamicFormFieldSchema {\n  const base: DynamicFormFieldSchema = createDefaultField(nextType, allFields);\n  return {\n    ...base,\n    name: field.name,\n    label: field.label,\n    description: field.description,\n    required: field.required,\n    validation: field.validation,\n  };\n}\n"],"mappings":"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","names":["import_react","import_themes","RadixCard","import_themes","import_themes","import_clsx","import_react","import_react","import_themes","import_jsx_runtime","import_jsx_runtime","_a","RadixSelect","import_themes","import_clsx","import_react","import_jsx_runtime","RadixText","import_jsx_runtime"]}

package/dist/molecules/dynamic-form-editor-field-list-panel.js

@@ -1,13 +1,14 @@
 import {
   DynamicFormEditorFieldListPanel
-} from "../chunk-SEUOHWYL.js";
+} from "../chunk-7NBGSPZU.js";
 import "../chunk-Z7WNKARH.js";
 import "../chunk-YXMB4MCM.js";
-import "../chunk-25HMMI7R.js";
 import "../chunk-RP2RGCAW.js";
-import "../chunk-WYWM2HSZ.js";
-import "../chunk-GR4PG6HY.js";
+import "../chunk-YXFHD2PY.js";
 import "../chunk-LDBWASUA.js";
+import "../chunk-PO2PBAHW.js";
+import "../chunk-25HMMI7R.js";
+import "../chunk-WYWM2HSZ.js";
 import "../chunk-VFQD57ZY.js";
 import "../chunk-CRTRMMJ7.js";
 export {

package/dist/molecules/dynamic-form-editor-issues-panel.cjs

@@ -113,6 +113,12 @@ var mapWithResponsive = (args) => {
   return value;
 };
 
+// src/utils/mono-style.ts
+var MONO_STYLE = {
+  fontFamily: 'var(--code-font-family, ui-monospace, "SF Mono", monospace)',
+  fontVariantNumeric: "tabular-nums"
+};
+
 // src/utils/resolve-color.ts
 var SEMANTIC_COLOR_MAP = {
   error: "red",
@@ -140,7 +146,7 @@ var resolveColor = (color) => {
 var import_jsx_runtime2 = require("react/jsx-runtime");
 var Typo = (0, import_react2.forwardRef)(
   (props, ref) => {
-    const _a = props, { size, variant, children, color, className } = _a, rest = __objRest(_a, ["size", "variant", "children", "color", "className"]);
+    const _a = props, { size, variant, children, color, className, mono, style } = _a, rest = __objRest(_a, ["size", "variant", "children", "color", "className", "mono", "style"]);
     const { color: radixColor, className: colorClassName } = (0, import_react2.useMemo)(
       () => resolveColor(color),
       [color]
@@ -170,6 +176,7 @@ var Typo = (0, import_react2.forwardRef)(
         color: radixColor,
         ref,
         size: radixSize,
+        style: mono ? __spreadValues(__spreadValues({}, MONO_STYLE), style) : style,
         children
       })
     );

package/dist/molecules/dynamic-form-editor-issues-panel.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/molecules/dynamic-form-editor-issues-panel.tsx","../../src/atoms/card.tsx","../../src/atoms/flex.tsx","../../src/atoms/typo.tsx","../../src/utils/map-with-responsive.ts","../../src/utils/resolve-color.ts"],"sourcesContent":["import React from 'react';\nimport { Card } from '@/atoms/card';\nimport { Flex } from '@/atoms/flex';\nimport { Typo } from '@/atoms/typo';\nimport type { SchemaIssue } from './dynamic-form-editor-utils';\n\nexport interface DynamicFormEditorIssuesPanelProps {\n  issues: SchemaIssue[];\n}\n\nexport function DynamicFormEditorIssuesPanel(\n  props: DynamicFormEditorIssuesPanelProps\n): React.ReactElement | null {\n  const { issues } = props;\n  if (issues.length === 0) return null;\n\n  return (\n    <Card style={{ padding: 12 }}>\n      <Flex direction=\"column\" gap=\"2\">\n        <Typo variant=\"caption\">스키마 이슈</Typo>\n        {issues.map((i) => (\n          <Typo\n            color={i.level === 'error' ? 'red' : 'gray'}\n            key={i.id}\n            variant=\"caption\"\n          >\n            [{i.level}] {i.message}\n            {i.fieldName ? ` (field: ${i.fieldName})` : ''}\n          </Typo>\n        ))}\n      </Flex>\n    </Card>\n  );\n}\n\n","import { forwardRef, useMemo } from 'react';\nimport {\n  Card as RadixCard,\n  type CardProps as RadixCardProps,\n} from '@radix-ui/themes';\n\nexport type CardProps = RadixCardProps & {\n  borderRadius?: 'none';\n  borderDisable?: {\n    left?: boolean;\n    right?: boolean;\n    top?: boolean;\n    bottom?: boolean;\n  };\n  error?: boolean;\n};\n\nexport const Card = forwardRef<HTMLDivElement, CardProps>(\n  (props, forwardedRef) => {\n    const { borderDisable, borderRadius, error, ...rest } = props;\n\n    const borderInsetClassName = useMemo(() => {\n      if (!borderDisable) return '';\n      const { left, right, top, bottom } = borderDisable;\n      return [\n        left && 'disable-inset-left',\n        right && 'disable-inset-right',\n        top && 'disable-inset-top',\n        bottom && 'disable-inset-bottom',\n      ]\n        .filter(Boolean)\n        .join(' ');\n    }, [borderDisable]);\n\n    const errorClsName = useMemo(() => {\n      return error ? ' error' : '';\n    }, [error]);\n\n    return (\n      <RadixCard\n        variant=\"surface\"\n        {...rest}\n        className={`${borderInsetClassName}${errorClsName} ${rest.className || ''}`}\n        data-radius={borderRadius}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n\nCard.displayName = 'Card';\n","export { Flex, type FlexProps } from '@radix-ui/themes';\n","import type { TextProps as RadixTextProps } from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { Text as RadixText } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport React, { useMemo, forwardRef } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\nimport {\n  resolveColor,\n  type DistributiveOmit,\n  type UiColor,\n} from '../utils/resolve-color';\n\nexport type TypoProps = DistributiveOmit<RadixTextProps, 'color'> & {\n  variant?: Responsive<'body' | 'caption' | 'subtitle'>;\n  color?: UiColor;\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n  (props: TypoProps, ref): React.ReactNode => {\n    const { size, variant, children, color, className, ...rest } = props;\n\n    const { color: radixColor, className: colorClassName } = useMemo(\n      () => resolveColor(color),\n      [color]\n    );\n\n    const radixSize = useMemo<RadixTextProps['size']>(() => {\n      if (size !== undefined) return size;\n\n      if (variant === undefined) return '2';\n\n      return mapWithResponsive({\n        value: variant,\n        mapFn: (variantValue?: 'body' | 'caption' | 'subtitle') => {\n          switch (variantValue) {\n            case 'caption':\n              return '1';\n            case 'subtitle':\n              return '3';\n            case 'body':\n            default:\n              return '2';\n          }\n        },\n      });\n    }, [size, variant]);\n\n    return (\n      <RadixText\n        {...rest}\n        className={clsx(colorClassName, className)}\n        color={radixColor}\n        ref={ref}\n        size={radixSize}\n      >\n        {children}\n      </RadixText>\n    );\n  }\n);\n\nTypo.displayName = 'Typo';\n","import type {  Breakpoint, Responsive } from \"@radix-ui/themes/props\";\n\nexport const mapWithResponsive = <T extends string,K extends string>(\n args:  {value: Responsive<T>, mapFn: (value?:T)=>K |undefined}\n): Responsive<K> | undefined => {\n  const {value, mapFn} = args;\n  if(typeof value === 'string'){\n    return mapFn(value);\n  };\n  \n  if(typeof value === 'object'){\n    const newObj: Partial<Record<Breakpoint, K>> = {};\n    let key: Breakpoint;\n    for(key in value){\n      newObj[key] = mapFn(value[key]);\n    }\n    return newObj;\n  }\n  return value;\n};\n","import type { BadgeProps as RadixBadgeProps } from '@radix-ui/themes';\n\n/**\n * Radix Themes가 제공하는 accent color union (gray, red, blue, ...).\n * 모든 color 지원 컴포넌트가 동일한 union을 공유하므로 Badge에서 파생한다.\n */\nexport type RadixColor = NonNullable<RadixBadgeProps['color']>;\n\n/** TIPP 시맨틱 color 별칭. */\nexport type SemanticColor = 'error' | 'accent' | 'neutral' | 'success';\n\n/**\n * Radix accent에 대응이 없어 CSS accent override로 처리하는 커스텀 color.\n * (예: black — `style/black.scss`의 `.tipp-accent-black` 참고)\n */\nexport type CustomColor = 'black';\n\n/** color 지원 컴포넌트가 노출하는 통합 color 타입. */\nexport type UiColor = RadixColor | SemanticColor | CustomColor;\n\n/**\n * union 각 멤버에 분배되는 Omit.\n * Radix의 polymorphic 컴포넌트 props(Text/Heading/Link 등 `as`로 분기되는 union)에서\n * 키를 제거할 때 일반 Omit은 union을 단일 객체로 합쳐 `as` 분기를 무너뜨리므로 이 타입을 쓴다.\n */\nexport type DistributiveOmit<T, K extends PropertyKey> = T extends unknown\n  ? Omit<T, K>\n  : never;\n\nconst SEMANTIC_COLOR_MAP: Record<SemanticColor, RadixColor | undefined> = {\n  error: 'red',\n  neutral: 'gray',\n  success: 'green',\n  accent: undefined,\n};\n\ninterface CustomColorConfig {\n  /**\n   * accent override를 적용할 className.\n   */\n  className: string;\n  /**\n   * Radix에 넘길 fallback color.\n   * Text/Heading/Link 등은 `color` prop이 있어야 `data-accent-color`가 붙어\n   * `--accent-*`를 참조하므로, 유효한 Radix color를 함께 넘긴 뒤 className으로\n   * `--accent-*`를 덮어쓴다. (Badge/Button은 prop 없이도 accent 기반이라 무해)\n   */\n  fallbackColor: RadixColor;\n}\n\nconst CUSTOM_COLOR_MAP: Record<CustomColor, CustomColorConfig> = {\n  black: { className: 'tipp-accent-black', fallbackColor: 'gray' },\n};\n\nconst isSemanticColor = (color?: UiColor): color is SemanticColor =>\n  color !== undefined && color in SEMANTIC_COLOR_MAP;\n\nconst isCustomColor = (color?: UiColor): color is CustomColor =>\n  color !== undefined && color in CUSTOM_COLOR_MAP;\n\nexport interface ResolvedColor {\n  /** Radix 컴포넌트의 `color` prop에 그대로 전달할 값. custom color면 undefined. */\n  color?: RadixColor;\n  /** accent override를 적용하기 위해 요소에 붙일 className. */\n  className?: string;\n}\n\n/**\n * 통합 color 입력을 Radix color prop과 className으로 정규화한다.\n *\n * - custom color(black 등): Radix color는 비우고 accent override className을 반환\n * - semantic color(error/neutral/success/accent): 대응 Radix color로 변환\n * - Radix color: 그대로 pass-through\n */\nexport const resolveColor = (color?: UiColor): ResolvedColor => {\n  if (isCustomColor(color)) {\n    const { className, fallbackColor } = CUSTOM_COLOR_MAP[color];\n    return { color: fallbackColor, className };\n  }\n\n  if (isSemanticColor(color)) {\n    return { color: SEMANTIC_COLOR_MAP[color] };\n  }\n\n  return { color };\n};\n"],"mappings":"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","names":["RadixCard","import_themes","import_themes","import_react","import_jsx_runtime","RadixText","import_jsx_runtime"]}
+{"version":3,"sources":["../../src/molecules/dynamic-form-editor-issues-panel.tsx","../../src/atoms/card.tsx","../../src/atoms/flex.tsx","../../src/atoms/typo.tsx","../../src/utils/map-with-responsive.ts","../../src/utils/mono-style.ts","../../src/utils/resolve-color.ts"],"sourcesContent":["import React from 'react';\nimport { Card } from '@/atoms/card';\nimport { Flex } from '@/atoms/flex';\nimport { Typo } from '@/atoms/typo';\nimport type { SchemaIssue } from './dynamic-form-editor-utils';\n\nexport interface DynamicFormEditorIssuesPanelProps {\n  issues: SchemaIssue[];\n}\n\nexport function DynamicFormEditorIssuesPanel(\n  props: DynamicFormEditorIssuesPanelProps\n): React.ReactElement | null {\n  const { issues } = props;\n  if (issues.length === 0) return null;\n\n  return (\n    <Card style={{ padding: 12 }}>\n      <Flex direction=\"column\" gap=\"2\">\n        <Typo variant=\"caption\">스키마 이슈</Typo>\n        {issues.map((i) => (\n          <Typo\n            color={i.level === 'error' ? 'red' : 'gray'}\n            key={i.id}\n            variant=\"caption\"\n          >\n            [{i.level}] {i.message}\n            {i.fieldName ? ` (field: ${i.fieldName})` : ''}\n          </Typo>\n        ))}\n      </Flex>\n    </Card>\n  );\n}\n\n","import { forwardRef, useMemo } from 'react';\nimport {\n  Card as RadixCard,\n  type CardProps as RadixCardProps,\n} from '@radix-ui/themes';\n\nexport type CardProps = RadixCardProps & {\n  borderRadius?: 'none';\n  borderDisable?: {\n    left?: boolean;\n    right?: boolean;\n    top?: boolean;\n    bottom?: boolean;\n  };\n  error?: boolean;\n};\n\nexport const Card = forwardRef<HTMLDivElement, CardProps>(\n  (props, forwardedRef) => {\n    const { borderDisable, borderRadius, error, ...rest } = props;\n\n    const borderInsetClassName = useMemo(() => {\n      if (!borderDisable) return '';\n      const { left, right, top, bottom } = borderDisable;\n      return [\n        left && 'disable-inset-left',\n        right && 'disable-inset-right',\n        top && 'disable-inset-top',\n        bottom && 'disable-inset-bottom',\n      ]\n        .filter(Boolean)\n        .join(' ');\n    }, [borderDisable]);\n\n    const errorClsName = useMemo(() => {\n      return error ? ' error' : '';\n    }, [error]);\n\n    return (\n      <RadixCard\n        variant=\"surface\"\n        {...rest}\n        className={`${borderInsetClassName}${errorClsName} ${rest.className || ''}`}\n        data-radius={borderRadius}\n        ref={forwardedRef}\n      />\n    );\n  }\n);\n\nCard.displayName = 'Card';\n","export { Flex, type FlexProps } from '@radix-ui/themes';\n","import type { TextProps as RadixTextProps } from '@radix-ui/themes';\nimport type { Responsive } from '@radix-ui/themes/props';\nimport { Text as RadixText } from '@radix-ui/themes';\nimport { clsx } from 'clsx';\nimport React, { useMemo, forwardRef } from 'react';\nimport { mapWithResponsive } from '@/utils/map-with-responsive';\nimport { MONO_STYLE } from '../utils/mono-style';\nimport {\n  resolveColor,\n  type DistributiveOmit,\n  type UiColor,\n} from '../utils/resolve-color';\n\nexport type TypoProps = DistributiveOmit<RadixTextProps, 'color'> & {\n  variant?: Responsive<'body' | 'caption' | 'subtitle'>;\n  color?: UiColor;\n  /** 등폭(monospace) 폰트 + 숫자 고정폭 정렬(tabular-nums). 점수·퍼센트 등 수치 표시에 사용한다. */\n  mono?: boolean;\n};\n\nexport const Typo = forwardRef<HTMLSpanElement, TypoProps>(\n  (props: TypoProps, ref): React.ReactNode => {\n    const { size, variant, children, color, className, mono, style, ...rest } =\n      props;\n\n    const { color: radixColor, className: colorClassName } = useMemo(\n      () => resolveColor(color),\n      [color]\n    );\n\n    const radixSize = useMemo<RadixTextProps['size']>(() => {\n      if (size !== undefined) return size;\n\n      if (variant === undefined) return '2';\n\n      return mapWithResponsive({\n        value: variant,\n        mapFn: (variantValue?: 'body' | 'caption' | 'subtitle') => {\n          switch (variantValue) {\n            case 'caption':\n              return '1';\n            case 'subtitle':\n              return '3';\n            case 'body':\n            default:\n              return '2';\n          }\n        },\n      });\n    }, [size, variant]);\n\n    return (\n      <RadixText\n        {...rest}\n        className={clsx(colorClassName, className)}\n        color={radixColor}\n        ref={ref}\n        size={radixSize}\n        style={mono ? { ...MONO_STYLE, ...style } : style}\n      >\n        {children}\n      </RadixText>\n    );\n  }\n);\n\nTypo.displayName = 'Typo';\n","import type {  Breakpoint, Responsive } from \"@radix-ui/themes/props\";\n\nexport const mapWithResponsive = <T extends string,K extends string>(\n args:  {value: Responsive<T>, mapFn: (value?:T)=>K |undefined}\n): Responsive<K> | undefined => {\n  const {value, mapFn} = args;\n  if(typeof value === 'string'){\n    return mapFn(value);\n  };\n  \n  if(typeof value === 'object'){\n    const newObj: Partial<Record<Breakpoint, K>> = {};\n    let key: Breakpoint;\n    for(key in value){\n      newObj[key] = mapFn(value[key]);\n    }\n    return newObj;\n  }\n  return value;\n};\n","import type { CSSProperties } from 'react';\n\n/**\n * 등폭(monospace) 텍스트 스타일.\n * - `font-family`: 등폭 폰트(`--code-font-family`는 Radix Themes가 제공, 없으면 시스템 등폭으로 폴백)\n * - `font-variant-numeric: tabular-nums`: 숫자를 고정폭으로 정렬해 점수·퍼센트·통계가 자릿수마다 흔들리지 않게 함\n *\n * `Typo`/`Heading`의 `mono` prop 구현에 사용된다.\n */\nexport const MONO_STYLE: CSSProperties = {\n  fontFamily: 'var(--code-font-family, ui-monospace, \"SF Mono\", monospace)',\n  fontVariantNumeric: 'tabular-nums',\n};\n","import type { BadgeProps as RadixBadgeProps } from '@radix-ui/themes';\n\n/**\n * Radix Themes가 제공하는 accent color union (gray, red, blue, ...).\n * 모든 color 지원 컴포넌트가 동일한 union을 공유하므로 Badge에서 파생한다.\n */\nexport type RadixColor = NonNullable<RadixBadgeProps['color']>;\n\n/** TIPP 시맨틱 color 별칭. */\nexport type SemanticColor = 'error' | 'accent' | 'neutral' | 'success';\n\n/**\n * Radix accent에 대응이 없어 CSS accent override로 처리하는 커스텀 color.\n * (예: black — `style/black.scss`의 `.tipp-accent-black` 참고)\n */\nexport type CustomColor = 'black';\n\n/** color 지원 컴포넌트가 노출하는 통합 color 타입. */\nexport type UiColor = RadixColor | SemanticColor | CustomColor;\n\n/**\n * union 각 멤버에 분배되는 Omit.\n * Radix의 polymorphic 컴포넌트 props(Text/Heading/Link 등 `as`로 분기되는 union)에서\n * 키를 제거할 때 일반 Omit은 union을 단일 객체로 합쳐 `as` 분기를 무너뜨리므로 이 타입을 쓴다.\n */\nexport type DistributiveOmit<T, K extends PropertyKey> = T extends unknown\n  ? Omit<T, K>\n  : never;\n\nconst SEMANTIC_COLOR_MAP: Record<SemanticColor, RadixColor | undefined> = {\n  error: 'red',\n  neutral: 'gray',\n  success: 'green',\n  accent: undefined,\n};\n\ninterface CustomColorConfig {\n  /**\n   * accent override를 적용할 className.\n   */\n  className: string;\n  /**\n   * Radix에 넘길 fallback color.\n   * Text/Heading/Link 등은 `color` prop이 있어야 `data-accent-color`가 붙어\n   * `--accent-*`를 참조하므로, 유효한 Radix color를 함께 넘긴 뒤 className으로\n   * `--accent-*`를 덮어쓴다. (Badge/Button은 prop 없이도 accent 기반이라 무해)\n   */\n  fallbackColor: RadixColor;\n}\n\nconst CUSTOM_COLOR_MAP: Record<CustomColor, CustomColorConfig> = {\n  black: { className: 'tipp-accent-black', fallbackColor: 'gray' },\n};\n\nconst isSemanticColor = (color?: UiColor): color is SemanticColor =>\n  color !== undefined && color in SEMANTIC_COLOR_MAP;\n\nconst isCustomColor = (color?: UiColor): color is CustomColor =>\n  color !== undefined && color in CUSTOM_COLOR_MAP;\n\nexport interface ResolvedColor {\n  /** Radix 컴포넌트의 `color` prop에 그대로 전달할 값. custom color면 undefined. */\n  color?: RadixColor;\n  /** accent override를 적용하기 위해 요소에 붙일 className. */\n  className?: string;\n}\n\n/**\n * 통합 color 입력을 Radix color prop과 className으로 정규화한다.\n *\n * - custom color(black 등): Radix color는 비우고 accent override className을 반환\n * - semantic color(error/neutral/success/accent): 대응 Radix color로 변환\n * - Radix color: 그대로 pass-through\n */\nexport const resolveColor = (color?: UiColor): ResolvedColor => {\n  if (isCustomColor(color)) {\n    const { className, fallbackColor } = CUSTOM_COLOR_MAP[color];\n    return { color: fallbackColor, className };\n  }\n\n  if (isSemanticColor(color)) {\n    return { color: SEMANTIC_COLOR_MAP[color] };\n  }\n\n  return { color };\n};\n"],"mappings":"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","names":["RadixCard","import_themes","import_themes","import_react","import_jsx_runtime","RadixText","import_jsx_runtime"]}

package/dist/molecules/dynamic-form-editor-issues-panel.js

@@ -1,10 +1,11 @@
 import {
   DynamicFormEditorIssuesPanel
-} from "../chunk-FW2QU4JO.js";
-import "../chunk-25HMMI7R.js";
+} from "../chunk-UILGIMXL.js";
 import "../chunk-RP2RGCAW.js";
-import "../chunk-GR4PG6HY.js";
+import "../chunk-YXFHD2PY.js";
 import "../chunk-LDBWASUA.js";
+import "../chunk-PO2PBAHW.js";
+import "../chunk-25HMMI7R.js";
 import "../chunk-VFQD57ZY.js";
 import "../chunk-CRTRMMJ7.js";
 export {

package/dist/molecules/dynamic-form-editor-preview-panel.cjs

@@ -143,6 +143,12 @@ var mapWithResponsive = (args) => {
   return value;
 };
 
+// src/utils/mono-style.ts
+var MONO_STYLE = {
+  fontFamily: 'var(--code-font-family, ui-monospace, "SF Mono", monospace)',
+  fontVariantNumeric: "tabular-nums"
+};
+
 // src/utils/resolve-color.ts
 var SEMANTIC_COLOR_MAP = {
   error: "red",
@@ -170,7 +176,7 @@ var resolveColor = (color) => {
 var import_jsx_runtime2 = require("react/jsx-runtime");
 var Typo = (0, import_react2.forwardRef)(
   (props, ref) => {
-    const _a = props, { size, variant, children, color, className } = _a, rest = __objRest(_a, ["size", "variant", "children", "color", "className"]);
+    const _a = props, { size, variant, children, color, className, mono, style } = _a, rest = __objRest(_a, ["size", "variant", "children", "color", "className", "mono", "style"]);
     const { color: radixColor, className: colorClassName } = (0, import_react2.useMemo)(
       () => resolveColor(color),
       [color]
@@ -200,6 +206,7 @@ var Typo = (0, import_react2.forwardRef)(
         color: radixColor,
         ref,
         size: radixSize,
+        style: mono ? __spreadValues(__spreadValues({}, MONO_STYLE), style) : style,
         children
       })
     );
@@ -243,7 +250,7 @@ var mapVariant = (variant) => {
   }
 };
 function Heading2(props) {
-  const _a = props, { size, children, variant, color, className } = _a, rest = __objRest(_a, ["size", "children", "variant", "color", "className"]);
+  const _a = props, { size, children, variant, color, className, mono, style } = _a, rest = __objRest(_a, ["size", "children", "variant", "color", "className", "mono", "style"]);
   const { color: radixColor, className: colorClassName } = (0, import_react3.useMemo)(
     () => resolveColor(color),
     [color]
@@ -260,6 +267,7 @@ function Heading2(props) {
       className: (0, import_clsx2.clsx)(colorClassName, className),
       color: radixColor,
       size: radixSize,
+      style: mono ? __spreadValues(__spreadValues({}, MONO_STYLE), style) : style,
       children
     })
   );