@things-factory/board-ai 10.0.0-beta.108

package/dist-client/server/service/styling/copy-tools.d.ts

@@ -0,0 +1,27 @@
+/**
+ * copyStyle — 한 컴포넌트의 styling 을 다른 컴포넌트들에 복사.
+ *
+ * 자주 쓰는 패턴: "MOTOR1 처럼 다른 모터들도 같게 만들어줘"
+ *   AI: getComponentByRefid(MOTOR1) 또는 getComponentStyle(MOTOR1) → copyStyle(...)
+ *
+ * aspects 인자로 어느 styling 영역만 복사할지 선택 가능 — 부분 통일 (예: 색만 통일).
+ *
+ * 입력 — sourceRefid 의 실제 styling 값을 미리 알 필요 없음. server 가 components
+ * 에서 source 찾아 styling 추출 후 target 들에 patch 생성.
+ */
+import type { BoardEditOp } from '../types';
+export interface CopyStyleInput {
+    sourceRefid: number;
+    targetRefids: number[];
+    aspects?: Array<'fill' | 'stroke' | 'shadow' | 'material' | 'font' | 'opacity' | 'visibility'>;
+}
+export interface OpsResult {
+    ops: BoardEditOp[];
+    errors: string[];
+}
+/**
+ * input + components 배열 → BoardEditOp[].
+ *
+ * components 는 board 의 모든 컴포넌트 (caller 가 전달). source 찾아 styling 추출.
+ */
+export declare function buildCopyStyleOps(input: CopyStyleInput, components: ReadonlyArray<any>): OpsResult;

package/dist-client/server/service/styling/copy-tools.js

@@ -0,0 +1,78 @@
+const ASPECT_FIELDS = {
+    fill: ['fillStyle'],
+    stroke: ['strokeStyle'],
+    shadow: ['shadow'],
+    material: ['material3d'],
+    font: [
+        'fontFamily',
+        'fontSize',
+        'fontWeight',
+        'fontStyle',
+        'fontColor',
+        'textAlign',
+        'textBaseline',
+        'lineHeight'
+    ],
+    opacity: ['alpha'],
+    visibility: ['hidden']
+};
+const DEFAULT_ASPECTS = [
+    'fill',
+    'stroke',
+    'shadow',
+    'material',
+    'font',
+    'opacity'
+    // visibility 는 default 에서 제외 — 의도 없이 hidden 복사 위험
+];
+/**
+ * input + components 배열 → BoardEditOp[].
+ *
+ * components 는 board 의 모든 컴포넌트 (caller 가 전달). source 찾아 styling 추출.
+ */
+export function buildCopyStyleOps(input, components) {
+    if (typeof input.sourceRefid !== 'number') {
+        return { ops: [], errors: ['sourceRefid (number) required'] };
+    }
+    if (!Array.isArray(input.targetRefids) || input.targetRefids.length === 0) {
+        return { ops: [], errors: ['targetRefids must be a non-empty array'] };
+    }
+    const targets = input.targetRefids.filter(n => typeof n === 'number' && Number.isFinite(n) && n !== input.sourceRefid);
+    if (targets.length === 0) {
+        return { ops: [], errors: ['No valid target refids (excluding source)'] };
+    }
+    const source = components.find(c => c && typeof c.refid === 'number' && c.refid === input.sourceRefid);
+    if (!source) {
+        return {
+            ops: [],
+            errors: [`Source component refid=${input.sourceRefid} not found`]
+        };
+    }
+    const aspects = input.aspects && input.aspects.length > 0 ? input.aspects : DEFAULT_ASPECTS;
+    const validAspects = Object.keys(ASPECT_FIELDS);
+    const unknown = aspects.filter(a => !validAspects.includes(a));
+    if (unknown.length > 0) {
+        return {
+            ops: [],
+            errors: [`Unknown aspect(s): ${unknown.join(', ')}. Valid: ${validAspects.join('/')}`]
+        };
+    }
+    // source 에서 aspect 별 필드 추출 → patch 합치기
+    const patch = {};
+    for (const aspect of aspects) {
+        const fields = ASPECT_FIELDS[aspect];
+        for (const field of fields) {
+            if (source[field] !== undefined) {
+                patch[field] = source[field];
+            }
+        }
+    }
+    if (Object.keys(patch).length === 0) {
+        return { ops: [], errors: ['Source has no styling for the requested aspects'] };
+    }
+    return {
+        ops: targets.map(refid => ({ op: 'modify', refid, patch })),
+        errors: []
+    };
+}
+//# sourceMappingURL=copy-tools.js.map

package/dist-client/server/service/styling/copy-tools.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"copy-tools.js","sourceRoot":"","sources":["../../../../server/service/styling/copy-tools.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * copyStyle — 한 컴포넌트의 styling 을 다른 컴포넌트들에 복사.\n *\n * 자주 쓰는 패턴: \"MOTOR1 처럼 다른 모터들도 같게 만들어줘\"\n *   AI: getComponentByRefid(MOTOR1) 또는 getComponentStyle(MOTOR1) → copyStyle(...)\n *\n * aspects 인자로 어느 styling 영역만 복사할지 선택 가능 — 부분 통일 (예: 색만 통일).\n *\n * 입력 — sourceRefid 의 실제 styling 값을 미리 알 필요 없음. server 가 components\n * 에서 source 찾아 styling 추출 후 target 들에 patch 생성.\n */\nimport type { BoardEditOp } from '../types'\n\nexport interface CopyStyleInput {\n  sourceRefid: number\n  targetRefids: number[]\n  aspects?: Array<'fill' | 'stroke' | 'shadow' | 'material' | 'font' | 'opacity' | 'visibility'>\n}\n\nexport interface OpsResult {\n  ops: BoardEditOp[]\n  errors: string[]\n}\n\nconst ASPECT_FIELDS: Record<string, string[]> = {\n  fill: ['fillStyle'],\n  stroke: ['strokeStyle'],\n  shadow: ['shadow'],\n  material: ['material3d'],\n  font: [\n    'fontFamily',\n    'fontSize',\n    'fontWeight',\n    'fontStyle',\n    'fontColor',\n    'textAlign',\n    'textBaseline',\n    'lineHeight'\n  ],\n  opacity: ['alpha'],\n  visibility: ['hidden']\n}\n\nconst DEFAULT_ASPECTS: Array<keyof typeof ASPECT_FIELDS> = [\n  'fill',\n  'stroke',\n  'shadow',\n  'material',\n  'font',\n  'opacity'\n  // visibility 는 default 에서 제외 — 의도 없이 hidden 복사 위험\n]\n\n/**\n * input + components 배열 → BoardEditOp[].\n *\n * components 는 board 의 모든 컴포넌트 (caller 가 전달). source 찾아 styling 추출.\n */\nexport function buildCopyStyleOps(\n  input: CopyStyleInput,\n  components: ReadonlyArray<any>\n): OpsResult {\n  if (typeof input.sourceRefid !== 'number') {\n    return { ops: [], errors: ['sourceRefid (number) required'] }\n  }\n  if (!Array.isArray(input.targetRefids) || input.targetRefids.length === 0) {\n    return { ops: [], errors: ['targetRefids must be a non-empty array'] }\n  }\n  const targets = input.targetRefids.filter(\n    n => typeof n === 'number' && Number.isFinite(n) && n !== input.sourceRefid\n  )\n  if (targets.length === 0) {\n    return { ops: [], errors: ['No valid target refids (excluding source)'] }\n  }\n\n  const source = components.find(\n    c => c && typeof c.refid === 'number' && c.refid === input.sourceRefid\n  )\n  if (!source) {\n    return {\n      ops: [],\n      errors: [`Source component refid=${input.sourceRefid} not found`]\n    }\n  }\n\n  const aspects = input.aspects && input.aspects.length > 0 ? input.aspects : DEFAULT_ASPECTS\n  const validAspects = Object.keys(ASPECT_FIELDS)\n  const unknown = aspects.filter(a => !validAspects.includes(a))\n  if (unknown.length > 0) {\n    return {\n      ops: [],\n      errors: [`Unknown aspect(s): ${unknown.join(', ')}. Valid: ${validAspects.join('/')}`]\n    }\n  }\n\n  // source 에서 aspect 별 필드 추출 → patch 합치기\n  const patch: any = {}\n  for (const aspect of aspects) {\n    const fields = ASPECT_FIELDS[aspect]\n    for (const field of fields) {\n      if (source[field] !== undefined) {\n        patch[field] = source[field]\n      }\n    }\n  }\n\n  if (Object.keys(patch).length === 0) {\n    return { ops: [], errors: ['Source has no styling for the requested aspects'] }\n  }\n\n  return {\n    ops: targets.map(refid => ({ op: 'modify', refid, patch })),\n    errors: []\n  }\n}\n"]}

package/dist-client/server/service/styling/effect-tools.d.ts

@@ -0,0 +1,45 @@
+/**
+ * setShadow / setOpacity / setVisible — 효과 / 가시성 / 투명도.
+ *
+ * setShadow: state.shadow (color/blur/offsetX/offsetY)
+ * setOpacity: state.alpha (컴포넌트 전체 알파, 0..1)
+ * setVisible: state.hidden 토글 (true → 숨김)
+ */
+import type { BoardEditOp } from '../types';
+export interface SetShadowInput {
+    refids: number[];
+    /** synthetic — false 면 blur=0 + color=transparent 매핑 (drawer 가 안 그림). 모델에 enabled 필드 없음. */
+    enabled?: boolean;
+    /** state.shadow.color */
+    color?: string;
+    /** Blur radius (CSS box-shadow 의 blur-radius, Canvas 의 shadowBlur). state.shadow.blur. */
+    blur?: number;
+    /** Horizontal offset (CSS box-shadow 의 offset-x, Canvas 의 shadowOffsetX). state.shadow.offsetX. */
+    offsetX?: number;
+    /** Vertical offset (CSS box-shadow 의 offset-y, Canvas 의 shadowOffsetY). state.shadow.offsetY. */
+    offsetY?: number;
+}
+export interface SetOpacityInput {
+    refids: number[];
+    /** state.alpha 의 canonical 이름. 0..1. */
+    alpha: number;
+}
+export interface SetVisibleInput {
+    refids: number[];
+    visible: boolean;
+}
+export interface OpsResult {
+    ops: BoardEditOp[];
+    errors: string[];
+}
+/**
+ * setShadow — CSS box-shadow / Canvas API 표준 이름 (color/offsetX/offsetY/blur) 그대로
+ * state.shadow 에 set. things-scene drawer 는 옛 이름 (left/top/blurSize) 도
+ * backwards-compat 으로 읽지만 (effect/shadow.ts:36-47), 새 모델은 canonical 만 사용.
+ *
+ * synthetic enabled=false → blur 0 + transparent 매핑 (drawer 가 안 그림).
+ * 모델에 enabled 필드는 없음.
+ */
+export declare function buildSetShadowOps(input: SetShadowInput): OpsResult;
+export declare function buildSetOpacityOps(input: SetOpacityInput): OpsResult;
+export declare function buildSetVisibleOps(input: SetVisibleInput): OpsResult;

package/dist-client/server/service/styling/effect-tools.js

@@ -0,0 +1,85 @@
+import { normalizeColor, validateColor } from './color-utils';
+/**
+ * setShadow — CSS box-shadow / Canvas API 표준 이름 (color/offsetX/offsetY/blur) 그대로
+ * state.shadow 에 set. things-scene drawer 는 옛 이름 (left/top/blurSize) 도
+ * backwards-compat 으로 읽지만 (effect/shadow.ts:36-47), 새 모델은 canonical 만 사용.
+ *
+ * synthetic enabled=false → blur 0 + transparent 매핑 (drawer 가 안 그림).
+ * 모델에 enabled 필드는 없음.
+ */
+export function buildSetShadowOps(input) {
+    if (!Array.isArray(input.refids) || input.refids.length === 0) {
+        return { ops: [], errors: ['refids must be a non-empty array'] };
+    }
+    const refids = input.refids.filter(n => typeof n === 'number' && Number.isFinite(n));
+    if (refids.length === 0)
+        return { ops: [], errors: ['No valid numeric refids'] };
+    const noOp = input.enabled === undefined &&
+        input.color === undefined &&
+        input.blur === undefined &&
+        input.offsetX === undefined &&
+        input.offsetY === undefined;
+    if (noOp)
+        return { ops: [], errors: ['No shadow changes specified'] };
+    if (input.enabled === false) {
+        // synthetic — false 면 blur 0 + transparent 으로 변환 (drawer 가 안 그림)
+        const patch = { shadow: { blur: 0, color: 'transparent' } };
+        return { ops: refids.map(refid => ({ op: 'modify', refid, patch })), errors: [] };
+    }
+    if (input.color !== undefined) {
+        const v = validateColor(input.color);
+        if (!v.valid)
+            return { ops: [], errors: [v.error ?? 'Invalid shadow color'] };
+    }
+    if (input.blur !== undefined && (input.blur < 0 || !Number.isFinite(input.blur))) {
+        return { ops: [], errors: [`Invalid blur: ${input.blur}`] };
+    }
+    if (input.offsetX !== undefined && !Number.isFinite(input.offsetX)) {
+        return { ops: [], errors: [`Invalid offsetX: ${input.offsetX}`] };
+    }
+    if (input.offsetY !== undefined && !Number.isFinite(input.offsetY)) {
+        return { ops: [], errors: [`Invalid offsetY: ${input.offsetY}`] };
+    }
+    // CSS / Canvas 표준 canonical 이름 — rename 없음
+    const sh = {};
+    // validateColor 가 통과한 색만 도달 — normalizeColor 가 여기서 null 반환 안 함
+    if (input.color !== undefined)
+        sh.color = normalizeColor(input.color);
+    if (input.blur !== undefined)
+        sh.blur = input.blur;
+    if (input.offsetX !== undefined)
+        sh.offsetX = input.offsetX;
+    if (input.offsetY !== undefined)
+        sh.offsetY = input.offsetY;
+    const patch = { shadow: sh };
+    return { ops: refids.map(refid => ({ op: 'modify', refid, patch })), errors: [] };
+}
+export function buildSetOpacityOps(input) {
+    if (!Array.isArray(input.refids) || input.refids.length === 0) {
+        return { ops: [], errors: ['refids must be a non-empty array'] };
+    }
+    if (typeof input.alpha !== 'number' || input.alpha < 0 || input.alpha > 1) {
+        return { ops: [], errors: [`alpha must be 0..1: ${input.alpha}`] };
+    }
+    const refids = input.refids.filter(n => typeof n === 'number' && Number.isFinite(n));
+    if (refids.length === 0)
+        return { ops: [], errors: ['No valid numeric refids'] };
+    // canonical 이름 그대로
+    const patch = { alpha: input.alpha };
+    return { ops: refids.map(refid => ({ op: 'modify', refid, patch })), errors: [] };
+}
+export function buildSetVisibleOps(input) {
+    if (!Array.isArray(input.refids) || input.refids.length === 0) {
+        return { ops: [], errors: ['refids must be a non-empty array'] };
+    }
+    if (typeof input.visible !== 'boolean') {
+        return { ops: [], errors: ['visible must be a boolean'] };
+    }
+    const refids = input.refids.filter(n => typeof n === 'number' && Number.isFinite(n));
+    if (refids.length === 0)
+        return { ops: [], errors: ['No valid numeric refids'] };
+    // hidden 은 visible 의 inverse
+    const patch = { hidden: !input.visible };
+    return { ops: refids.map(refid => ({ op: 'modify', refid, patch })), errors: [] };
+}
+//# sourceMappingURL=effect-tools.js.map

package/dist-client/server/service/styling/effect-tools.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"effect-tools.js","sourceRoot":"","sources":["../../../../server/service/styling/effect-tools.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * setShadow / setOpacity / setVisible — 효과 / 가시성 / 투명도.\n *\n * setShadow: state.shadow (color/blur/offsetX/offsetY)\n * setOpacity: state.alpha (컴포넌트 전체 알파, 0..1)\n * setVisible: state.hidden 토글 (true → 숨김)\n */\nimport type { BoardEditOp } from '../types'\nimport { normalizeColor, validateColor } from './color-utils'\n\nexport interface SetShadowInput {\n  refids: number[]\n  /** synthetic — false 면 blur=0 + color=transparent 매핑 (drawer 가 안 그림). 모델에 enabled 필드 없음. */\n  enabled?: boolean\n  /** state.shadow.color */\n  color?: string\n  /** Blur radius (CSS box-shadow 의 blur-radius, Canvas 의 shadowBlur). state.shadow.blur. */\n  blur?: number\n  /** Horizontal offset (CSS box-shadow 의 offset-x, Canvas 의 shadowOffsetX). state.shadow.offsetX. */\n  offsetX?: number\n  /** Vertical offset (CSS box-shadow 의 offset-y, Canvas 의 shadowOffsetY). state.shadow.offsetY. */\n  offsetY?: number\n}\n\nexport interface SetOpacityInput {\n  refids: number[]\n  /** state.alpha 의 canonical 이름. 0..1. */\n  alpha: number\n}\n\nexport interface SetVisibleInput {\n  refids: number[]\n  visible: boolean\n}\n\nexport interface OpsResult {\n  ops: BoardEditOp[]\n  errors: string[]\n}\n\n/**\n * setShadow — CSS box-shadow / Canvas API 표준 이름 (color/offsetX/offsetY/blur) 그대로\n * state.shadow 에 set. things-scene drawer 는 옛 이름 (left/top/blurSize) 도\n * backwards-compat 으로 읽지만 (effect/shadow.ts:36-47), 새 모델은 canonical 만 사용.\n *\n * synthetic enabled=false → blur 0 + transparent 매핑 (drawer 가 안 그림).\n * 모델에 enabled 필드는 없음.\n */\nexport function buildSetShadowOps(input: SetShadowInput): OpsResult {\n  if (!Array.isArray(input.refids) || input.refids.length === 0) {\n    return { ops: [], errors: ['refids must be a non-empty array'] }\n  }\n  const refids = input.refids.filter(n => typeof n === 'number' && Number.isFinite(n))\n  if (refids.length === 0) return { ops: [], errors: ['No valid numeric refids'] }\n\n  const noOp =\n    input.enabled === undefined &&\n    input.color === undefined &&\n    input.blur === undefined &&\n    input.offsetX === undefined &&\n    input.offsetY === undefined\n  if (noOp) return { ops: [], errors: ['No shadow changes specified'] }\n\n  if (input.enabled === false) {\n    // synthetic — false 면 blur 0 + transparent 으로 변환 (drawer 가 안 그림)\n    const patch = { shadow: { blur: 0, color: 'transparent' } }\n    return { ops: refids.map(refid => ({ op: 'modify', refid, patch })), errors: [] }\n  }\n\n  if (input.color !== undefined) {\n    const v = validateColor(input.color)\n    if (!v.valid) return { ops: [], errors: [v.error ?? 'Invalid shadow color'] }\n  }\n  if (input.blur !== undefined && (input.blur < 0 || !Number.isFinite(input.blur))) {\n    return { ops: [], errors: [`Invalid blur: ${input.blur}`] }\n  }\n  if (input.offsetX !== undefined && !Number.isFinite(input.offsetX)) {\n    return { ops: [], errors: [`Invalid offsetX: ${input.offsetX}`] }\n  }\n  if (input.offsetY !== undefined && !Number.isFinite(input.offsetY)) {\n    return { ops: [], errors: [`Invalid offsetY: ${input.offsetY}`] }\n  }\n\n  // CSS / Canvas 표준 canonical 이름 — rename 없음\n  const sh: Record<string, number | string> = {}\n  // validateColor 가 통과한 색만 도달 — normalizeColor 가 여기서 null 반환 안 함\n  if (input.color !== undefined) sh.color = normalizeColor(input.color)!\n  if (input.blur !== undefined) sh.blur = input.blur\n  if (input.offsetX !== undefined) sh.offsetX = input.offsetX\n  if (input.offsetY !== undefined) sh.offsetY = input.offsetY\n\n  const patch = { shadow: sh }\n  return { ops: refids.map(refid => ({ op: 'modify', refid, patch })), errors: [] }\n}\n\nexport function buildSetOpacityOps(input: SetOpacityInput): OpsResult {\n  if (!Array.isArray(input.refids) || input.refids.length === 0) {\n    return { ops: [], errors: ['refids must be a non-empty array'] }\n  }\n  if (typeof input.alpha !== 'number' || input.alpha < 0 || input.alpha > 1) {\n    return { ops: [], errors: [`alpha must be 0..1: ${input.alpha}`] }\n  }\n  const refids = input.refids.filter(n => typeof n === 'number' && Number.isFinite(n))\n  if (refids.length === 0) return { ops: [], errors: ['No valid numeric refids'] }\n\n  // canonical 이름 그대로\n  const patch = { alpha: input.alpha }\n  return { ops: refids.map(refid => ({ op: 'modify', refid, patch })), errors: [] }\n}\n\nexport function buildSetVisibleOps(input: SetVisibleInput): OpsResult {\n  if (!Array.isArray(input.refids) || input.refids.length === 0) {\n    return { ops: [], errors: ['refids must be a non-empty array'] }\n  }\n  if (typeof input.visible !== 'boolean') {\n    return { ops: [], errors: ['visible must be a boolean'] }\n  }\n  const refids = input.refids.filter(n => typeof n === 'number' && Number.isFinite(n))\n  if (refids.length === 0) return { ops: [], errors: ['No valid numeric refids'] }\n\n  // hidden 은 visible 의 inverse\n  const patch = { hidden: !input.visible }\n  return { ops: refids.map(refid => ({ op: 'modify', refid, patch })), errors: [] }\n}\n"]}

package/dist-client/server/service/styling/fill-tools.d.ts

@@ -0,0 +1,60 @@
+/**
+ * setFill — 컴포넌트 배경 (state.fillStyle) 변경.
+ *
+ * 4 modes 지원: none / solid / gradient / pattern.
+ *
+ * 출력 정책 — refid 당 1 op:
+ *   - solid: fillStyle = '#rrggbb' or 'rgba(...)' (string)
+ *   - gradient: fillStyle = { type:'gradient', gradientType, colorStops, rotation, ... }
+ *   - pattern: fillStyle = { type:'pattern', image, ... }
+ *   - none: fillStyle = { type:'none' }
+ *   - mode 미지정 + color 만: 부분 update (string 또는 object 병합)
+ *
+ * things-scene 실제 데이터 형식 (drawer/fill.ts 검증):
+ *   - gradient: { type, gradientType, colorStops: [{position, color}], rotation (라디안) }
+ *   - rotation 은 라디안 — `Math.cos(fRotation)` 직접 사용
+ *
+ * 이전 2-op (null + new) 방식은 중간 null 상태가 onchange / 3D texture
+ * 크래시 유발 → 제거. 정확한 colorStops 출력으로 stale 필드 문제는 자체 해결.
+ */
+import type { BoardEditOp } from '../types';
+export interface SetFillInput {
+    refids: number[];
+    mode?: 'none' | 'solid' | 'gradient' | 'pattern';
+    color?: string;
+    gradientType?: 'linear' | 'radial';
+    /** colorStops — things-scene 의 canonical 필드명 그대로. position 0..1, color hex/rgb/named. */
+    colorStops?: Array<{
+        color: string;
+        position: number;
+    }>;
+    /** 회전 — 입력은 degrees (사용자/AI 친화), 내부 변환 후 things-scene 의 라디안으로 저장. */
+    rotation?: number;
+    image?: string;
+    /** pattern: 영역에 맞춰 비율 조정 (true) vs 원본 크기 사용 (false). */
+    fitPattern?: boolean;
+    /** pattern: 반복 안 함 (true) — 1회만 그림. */
+    noRepeat?: boolean;
+    /** pattern: 정렬. fitPattern=false 일 때만 적용. */
+    align?: 'center' | 'left-top' | 'left-bottom' | 'right-top' | 'right-bottom' | 'left' | 'right' | 'top' | 'bottom';
+    /** pattern: 영역 내 오프셋 (fitPattern=false 일 때). */
+    offsetX?: number;
+    offsetY?: number;
+    /** pattern: 패턴 크기 (기본은 이미지 원본 크기). */
+    patternWidth?: number;
+    patternHeight?: number;
+    opacity?: number;
+}
+export interface SetFillResult {
+    ops: BoardEditOp[];
+    errors: string[];
+}
+/**
+ * setFill 입력 검증 + BoardEditOp[] 생성.
+ *
+ * 기본 정책:
+ *   - refids 비어있거나 mode 도 색도 없으면 에러
+ *   - 색상 입력은 normalizeColor 통과해야 적용
+ *   - mode='gradient' 인데 stops 없으면 자동 생성 (color → 어두운 변형)
+ */
+export declare function buildSetFillOps(input: SetFillInput): SetFillResult;

package/dist-client/server/service/styling/fill-tools.js

@@ -0,0 +1,226 @@
+import { parseColor, normalizeColor, validateColor } from './color-utils';
+/**
+ * setFill 입력 검증 + BoardEditOp[] 생성.
+ *
+ * 기본 정책:
+ *   - refids 비어있거나 mode 도 색도 없으면 에러
+ *   - 색상 입력은 normalizeColor 통과해야 적용
+ *   - mode='gradient' 인데 stops 없으면 자동 생성 (color → 어두운 변형)
+ */
+export function buildSetFillOps(input) {
+    const errors = [];
+    const ops = [];
+    if (!Array.isArray(input.refids) || input.refids.length === 0) {
+        return { ops: [], errors: ['refids must be a non-empty array of numbers'] };
+    }
+    const refids = input.refids.filter(n => typeof n === 'number' && Number.isFinite(n));
+    if (refids.length === 0) {
+        return { ops: [], errors: ['No valid numeric refids in input'] };
+    }
+    // mode 미지정 + 어떤 styling 인자도 없으면 무의미
+    if (!input.mode &&
+        !input.color &&
+        !input.colorStops &&
+        !input.image &&
+        typeof input.opacity !== 'number') {
+        return {
+            ops: [],
+            errors: ['No fill changes specified. Provide mode and/or color/opacity/etc.']
+        };
+    }
+    // 색상 검증
+    if (input.color !== undefined) {
+        const v = validateColor(input.color);
+        if (!v.valid) {
+            errors.push(v.error ?? `Invalid color: ${input.color}`);
+            return { ops: [], errors };
+        }
+    }
+    // gradient stops 검증
+    if (input.colorStops) {
+        for (const s of input.colorStops) {
+            if (typeof s.position !== 'number' || s.position < 0 || s.position > 1) {
+                errors.push(`Gradient stop position out of [0,1]: ${s.position}`);
+                return { ops: [], errors };
+            }
+            const v = validateColor(s.color);
+            if (!v.valid) {
+                errors.push(`Invalid gradient stop color: ${s.color}`);
+                return { ops: [], errors };
+            }
+        }
+    }
+    // opacity 검증
+    if (typeof input.opacity === 'number') {
+        if (input.opacity < 0 || input.opacity > 1) {
+            errors.push(`Opacity out of [0,1]: ${input.opacity}`);
+            return { ops: [], errors };
+        }
+    }
+    // pattern — image 필수
+    if (input.mode === 'pattern' && !input.image) {
+        errors.push(`Mode 'pattern' requires 'image' (URL or asset ref)`);
+        return { ops: [], errors };
+    }
+    // 각 refid 별 patch 생성
+    const patch = buildFillPatch(input);
+    if (!patch) {
+        return { ops: [], errors: ['Failed to build fill patch'] };
+    }
+    // 단일 op — apply-patch 의 deep merge 가 자연스럽게 처리:
+    //   - 새 fillStyle 이 string (solid) → 기존 object 통째 replace (typeof 매칭 X)
+    //   - 새 fillStyle 이 object → 같은 key (colorStops 배열 등) 는 array replace 됨
+    //   - 기존 부가 필드 (rotation 등) 가 새 patch 에 없으면 유지 — partial update 의도
+    // 이전 2-op (null + new) 방식은 중간 null 상태가 onchange / 3D texture trigger 해
+    // 크래시 유발 → 제거. 정확한 colorStops 출력으로 stale 필드 문제 자체가 해결됐음.
+    for (const refid of refids) {
+        ops.push({ op: 'modify', refid, patch });
+    }
+    return { ops, errors };
+}
+/**
+ * input → fillStyle patch 객체 생성.
+ *
+ * Mode 명시 시: fillStyle 통째 교체 → patch = { fillStyle: {...새 객체} }
+ * Mode 미지정 시: 기존 fillStyle 위에 색/opacity 만 병합 → patch = { fillStyle: { ...덮어쓸 필드 } }
+ *   (apply-patch 의 deep-merge 가 처리. fillStyle 이 객체라면.)
+ *
+ * mode='none' 의 경우 fillStyle 을 falsy 로 — 빈 객체 또는 type:'none' 명시.
+ */
+function buildFillPatch(input) {
+    const { mode } = input;
+    if (mode === 'none') {
+        // fillStyle 제거 의도 — null 시맨틱 활용 (apply-patch 가 키 자체를 delete).
+        // drawer/fill.ts: fillStyle 없으면 falsy → 채우지 않음.
+        return { fillStyle: null };
+    }
+    if (mode === 'solid') {
+        // things-scene drawer/fill.ts:17 — fillStyle 이 string 이면 그대로 색상.
+        // 객체 형식 {type:'solid', color} 은 인터페이스에만 있는 stale.
+        // opacity 는 색상에 alpha 채널로 embedding (rgba).
+        const color = input.color ? normalizeColor(input.color) : undefined;
+        if (!color)
+            return null;
+        let fillStyle = color;
+        if (typeof input.opacity === 'number' && input.opacity < 1) {
+            fillStyle = withAlpha(color, input.opacity);
+        }
+        return { fillStyle: fillStyle };
+    }
+    if (mode === 'gradient') {
+        let stops = input.colorStops;
+        // stops 미지정 시 — color 와 자동 생성 어두운 변형 (간단한 fallback)
+        if ((!stops || stops.length === 0) && input.color) {
+            const hex = normalizeColor(input.color);
+            if (hex) {
+                stops = [
+                    { color: hex, position: 0 },
+                    { color: darken(hex, 0.4), position: 1 }
+                ];
+            }
+        }
+        if (!stops || stops.length < 2) {
+            // gradient 인데 stops 부족 — 호출자가 명시 안 하면 만들어 주지 않음
+            return null;
+        }
+        // things-scene 의 실제 필드: colorStops [{position, color}]
+        const colorStops = stops
+            .map(s => ({ position: s.position, color: normalizeColor(s.color) }))
+            .filter(s => !!s.color);
+        if (colorStops.length < 2)
+            return null;
+        // rotation: 항상 명시 — drawer/fill.ts 가 default 없이 fillStyle.rotation 을 직접
+        // Math.cos / Math.sin 에 넘기므로 undefined 면 NaN → createLinearGradient 크래시.
+        // AI/사용자는 degrees 로 표현, 내부에서 라디안 변환. 미지정 시 0 default.
+        const rotationRad = typeof input.rotation === 'number' ? (input.rotation * Math.PI) / 180 : 0;
+        const fs = {
+            type: 'gradient',
+            gradientType: input.gradientType ?? 'linear',
+            colorStops,
+            rotation: rotationRad
+        };
+        if (typeof input.opacity === 'number')
+            fs.opacity = input.opacity;
+        return { fillStyle: fs };
+    }
+    if (mode === 'pattern') {
+        if (!input.image)
+            return null;
+        // things-scene 의 실제 pattern fillStyle (drawer/fill.ts:95~)
+        const fs = { type: 'pattern', image: input.image };
+        if (input.color) {
+            const c = normalizeColor(input.color);
+            if (c)
+                fs.color = c; // 패턴 뒤 배경색 (drawer 가 사용)
+        }
+        if (input.fitPattern !== undefined)
+            fs.fitPattern = input.fitPattern;
+        if (input.noRepeat !== undefined)
+            fs.noRepeat = input.noRepeat;
+        if (input.align)
+            fs.align = input.align;
+        if (typeof input.offsetX === 'number')
+            fs.offsetX = input.offsetX;
+        if (typeof input.offsetY === 'number')
+            fs.offsetY = input.offsetY;
+        if (typeof input.patternWidth === 'number')
+            fs.width = input.patternWidth;
+        if (typeof input.patternHeight === 'number')
+            fs.height = input.patternHeight;
+        if (typeof input.opacity === 'number')
+            fs.opacity = input.opacity;
+        return { fillStyle: fs };
+    }
+    // mode 미지정 — 부분 update.
+    // things-scene 의 fillStyle 은 string (solid) 또는 object (gradient/pattern).
+    // 부분 update 에서 색만 들어오면 solid string 으로 통째 set (가장 흔한 케이스).
+    // (gradient 의 부분 update 는 mode='gradient' 명시 사용 — 모드 명시 시 full replace.)
+    if (input.color) {
+        const c = normalizeColor(input.color);
+        if (!c)
+            return null;
+        const fillStyle = typeof input.opacity === 'number' && input.opacity < 1 ? withAlpha(c, input.opacity) : c;
+        return { fillStyle: fillStyle };
+    }
+    // color 없이 opacity 만 — 부분 update 어려움 (string 인지 object 인지 모름).
+    // 명확한 의도가 있으면 mode 명시 권장. 일단 무동작 (null).
+    return null;
+}
+/**
+ * hex / 명명 색 + alpha (0..1) → rgba(r,g,b,a) 문자열.
+ * Canvas API 의 fillStyle 은 rgba string 그대로 사용 가능.
+ */
+function withAlpha(hexOrName, alpha) {
+    // transparent
+    if (hexOrName === 'transparent')
+        return 'rgba(0,0,0,0)';
+    // hex 예상 (#rrggbb)
+    if (hexOrName.startsWith('#') && hexOrName.length === 7) {
+        const r = parseInt(hexOrName.slice(1, 3), 16);
+        const g = parseInt(hexOrName.slice(3, 5), 16);
+        const b = parseInt(hexOrName.slice(5, 7), 16);
+        return `rgba(${r},${g},${b},${alpha})`;
+    }
+    // 다른 형식이면 색을 그대로 두고 alpha 무시 (nullable 안전)
+    return hexOrName;
+}
+/**
+ * 단순 hex 색상 어둡게 — gradient 자동 생성 시 fallback 두 번째 stop 용.
+ * lightness 기반 정확도 < HSL 변환이 정확하지만 의존성 줄이려 RGB linear blend 로 대체.
+ */
+function darken(hex, amount) {
+    const p = parseColor(hex);
+    if (!p || p.hex === 'transparent')
+        return hex;
+    const h = p.hex.slice(1); // remove #
+    const r = parseInt(h.slice(0, 2), 16);
+    const g = parseInt(h.slice(2, 4), 16);
+    const b = parseInt(h.slice(4, 6), 16);
+    const factor = 1 - Math.max(0, Math.min(1, amount));
+    const r2 = Math.round(r * factor);
+    const g2 = Math.round(g * factor);
+    const b2 = Math.round(b * factor);
+    const toHex = (n) => n.toString(16).padStart(2, '0');
+    return `#${toHex(r2)}${toHex(g2)}${toHex(b2)}`;
+}
+//# sourceMappingURL=fill-tools.js.map

package/dist-client/server/service/styling/fill-tools.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fill-tools.js","sourceRoot":"","sources":["../../../../server/service/styling/fill-tools.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * setFill — 컴포넌트 배경 (state.fillStyle) 변경.\n *\n * 4 modes 지원: none / solid / gradient / pattern.\n *\n * 출력 정책 — refid 당 1 op:\n *   - solid: fillStyle = '#rrggbb' or 'rgba(...)' (string)\n *   - gradient: fillStyle = { type:'gradient', gradientType, colorStops, rotation, ... }\n *   - pattern: fillStyle = { type:'pattern', image, ... }\n *   - none: fillStyle = { type:'none' }\n *   - mode 미지정 + color 만: 부분 update (string 또는 object 병합)\n *\n * things-scene 실제 데이터 형식 (drawer/fill.ts 검증):\n *   - gradient: { type, gradientType, colorStops: [{position, color}], rotation (라디안) }\n *   - rotation 은 라디안 — `Math.cos(fRotation)` 직접 사용\n *\n * 이전 2-op (null + new) 방식은 중간 null 상태가 onchange / 3D texture\n * 크래시 유발 → 제거. 정확한 colorStops 출력으로 stale 필드 문제는 자체 해결.\n */\nimport type { BoardEditOp } from '../types'\nimport { parseColor, normalizeColor, validateColor } from './color-utils'\n\nexport interface SetFillInput {\n  refids: number[]\n  mode?: 'none' | 'solid' | 'gradient' | 'pattern'\n  // solid\n  color?: string\n  // gradient\n  gradientType?: 'linear' | 'radial'\n  /** colorStops — things-scene 의 canonical 필드명 그대로. position 0..1, color hex/rgb/named. */\n  colorStops?: Array<{ color: string; position: number }>\n  /** 회전 — 입력은 degrees (사용자/AI 친화), 내부 변환 후 things-scene 의 라디안으로 저장. */\n  rotation?: number\n  // pattern (drawer/fill.ts:95~ 검증)\n  image?: string\n  /** pattern: 영역에 맞춰 비율 조정 (true) vs 원본 크기 사용 (false). */\n  fitPattern?: boolean\n  /** pattern: 반복 안 함 (true) — 1회만 그림. */\n  noRepeat?: boolean\n  /** pattern: 정렬. fitPattern=false 일 때만 적용. */\n  align?:\n    | 'center'\n    | 'left-top'\n    | 'left-bottom'\n    | 'right-top'\n    | 'right-bottom'\n    | 'left'\n    | 'right'\n    | 'top'\n    | 'bottom'\n  /** pattern: 영역 내 오프셋 (fitPattern=false 일 때). */\n  offsetX?: number\n  offsetY?: number\n  /** pattern: 패턴 크기 (기본은 이미지 원본 크기). */\n  patternWidth?: number\n  patternHeight?: number\n  // 공통\n  opacity?: number  // 0..1\n}\n\nexport interface SetFillResult {\n  ops: BoardEditOp[]\n  errors: string[]  // refid 별 에러 (성공한 것은 op 만 발사)\n}\n\n/**\n * setFill 입력 검증 + BoardEditOp[] 생성.\n *\n * 기본 정책:\n *   - refids 비어있거나 mode 도 색도 없으면 에러\n *   - 색상 입력은 normalizeColor 통과해야 적용\n *   - mode='gradient' 인데 stops 없으면 자동 생성 (color → 어두운 변형)\n */\nexport function buildSetFillOps(input: SetFillInput): SetFillResult {\n  const errors: string[] = []\n  const ops: BoardEditOp[] = []\n\n  if (!Array.isArray(input.refids) || input.refids.length === 0) {\n    return { ops: [], errors: ['refids must be a non-empty array of numbers'] }\n  }\n  const refids = input.refids.filter(n => typeof n === 'number' && Number.isFinite(n))\n  if (refids.length === 0) {\n    return { ops: [], errors: ['No valid numeric refids in input'] }\n  }\n\n  // mode 미지정 + 어떤 styling 인자도 없으면 무의미\n  if (\n    !input.mode &&\n    !input.color &&\n    !input.colorStops &&\n    !input.image &&\n    typeof input.opacity !== 'number'\n  ) {\n    return {\n      ops: [],\n      errors: ['No fill changes specified. Provide mode and/or color/opacity/etc.']\n    }\n  }\n\n  // 색상 검증\n  if (input.color !== undefined) {\n    const v = validateColor(input.color)\n    if (!v.valid) {\n      errors.push(v.error ?? `Invalid color: ${input.color}`)\n      return { ops: [], errors }\n    }\n  }\n\n  // gradient stops 검증\n  if (input.colorStops) {\n    for (const s of input.colorStops) {\n      if (typeof s.position !== 'number' || s.position < 0 || s.position > 1) {\n        errors.push(`Gradient stop position out of [0,1]: ${s.position}`)\n        return { ops: [], errors }\n      }\n      const v = validateColor(s.color)\n      if (!v.valid) {\n        errors.push(`Invalid gradient stop color: ${s.color}`)\n        return { ops: [], errors }\n      }\n    }\n  }\n\n  // opacity 검증\n  if (typeof input.opacity === 'number') {\n    if (input.opacity < 0 || input.opacity > 1) {\n      errors.push(`Opacity out of [0,1]: ${input.opacity}`)\n      return { ops: [], errors }\n    }\n  }\n\n  // pattern — image 필수\n  if (input.mode === 'pattern' && !input.image) {\n    errors.push(`Mode 'pattern' requires 'image' (URL or asset ref)`)\n    return { ops: [], errors }\n  }\n\n  // 각 refid 별 patch 생성\n  const patch = buildFillPatch(input)\n  if (!patch) {\n    return { ops: [], errors: ['Failed to build fill patch'] }\n  }\n\n  // 단일 op — apply-patch 의 deep merge 가 자연스럽게 처리:\n  //   - 새 fillStyle 이 string (solid) → 기존 object 통째 replace (typeof 매칭 X)\n  //   - 새 fillStyle 이 object → 같은 key (colorStops 배열 등) 는 array replace 됨\n  //   - 기존 부가 필드 (rotation 등) 가 새 patch 에 없으면 유지 — partial update 의도\n  // 이전 2-op (null + new) 방식은 중간 null 상태가 onchange / 3D texture trigger 해\n  // 크래시 유발 → 제거. 정확한 colorStops 출력으로 stale 필드 문제 자체가 해결됐음.\n  for (const refid of refids) {\n    ops.push({ op: 'modify', refid, patch })\n  }\n  return { ops, errors }\n}\n\n/**\n * input → fillStyle patch 객체 생성.\n *\n * Mode 명시 시: fillStyle 통째 교체 → patch = { fillStyle: {...새 객체} }\n * Mode 미지정 시: 기존 fillStyle 위에 색/opacity 만 병합 → patch = { fillStyle: { ...덮어쓸 필드 } }\n *   (apply-patch 의 deep-merge 가 처리. fillStyle 이 객체라면.)\n *\n * mode='none' 의 경우 fillStyle 을 falsy 로 — 빈 객체 또는 type:'none' 명시.\n */\nfunction buildFillPatch(input: SetFillInput): { fillStyle: any } | null {\n  const { mode } = input\n\n  if (mode === 'none') {\n    // fillStyle 제거 의도 — null 시맨틱 활용 (apply-patch 가 키 자체를 delete).\n    // drawer/fill.ts: fillStyle 없으면 falsy → 채우지 않음.\n    return { fillStyle: null as any }\n  }\n\n  if (mode === 'solid') {\n    // things-scene drawer/fill.ts:17 — fillStyle 이 string 이면 그대로 색상.\n    // 객체 형식 {type:'solid', color} 은 인터페이스에만 있는 stale.\n    // opacity 는 색상에 alpha 채널로 embedding (rgba).\n    const color = input.color ? normalizeColor(input.color) : undefined\n    if (!color) return null\n    let fillStyle: string = color\n    if (typeof input.opacity === 'number' && input.opacity < 1) {\n      fillStyle = withAlpha(color, input.opacity)\n    }\n    return { fillStyle: fillStyle as any }\n  }\n\n  if (mode === 'gradient') {\n    let stops = input.colorStops\n    // stops 미지정 시 — color 와 자동 생성 어두운 변형 (간단한 fallback)\n    if ((!stops || stops.length === 0) && input.color) {\n      const hex = normalizeColor(input.color)\n      if (hex) {\n        stops = [\n          { color: hex, position: 0 },\n          { color: darken(hex, 0.4), position: 1 }\n        ]\n      }\n    }\n    if (!stops || stops.length < 2) {\n      // gradient 인데 stops 부족 — 호출자가 명시 안 하면 만들어 주지 않음\n      return null\n    }\n    // things-scene 의 실제 필드: colorStops [{position, color}]\n    const colorStops = stops\n      .map(s => ({ position: s.position, color: normalizeColor(s.color)! }))\n      .filter(s => !!s.color)\n    if (colorStops.length < 2) return null\n    // rotation: 항상 명시 — drawer/fill.ts 가 default 없이 fillStyle.rotation 을 직접\n    // Math.cos / Math.sin 에 넘기므로 undefined 면 NaN → createLinearGradient 크래시.\n    // AI/사용자는 degrees 로 표현, 내부에서 라디안 변환. 미지정 시 0 default.\n    const rotationRad =\n      typeof input.rotation === 'number' ? (input.rotation * Math.PI) / 180 : 0\n    const fs: any = {\n      type: 'gradient',\n      gradientType: input.gradientType ?? 'linear',\n      colorStops,\n      rotation: rotationRad\n    }\n    if (typeof input.opacity === 'number') fs.opacity = input.opacity\n    return { fillStyle: fs }\n  }\n\n  if (mode === 'pattern') {\n    if (!input.image) return null\n    // things-scene 의 실제 pattern fillStyle (drawer/fill.ts:95~)\n    const fs: any = { type: 'pattern', image: input.image }\n    if (input.color) {\n      const c = normalizeColor(input.color)\n      if (c) fs.color = c // 패턴 뒤 배경색 (drawer 가 사용)\n    }\n    if (input.fitPattern !== undefined) fs.fitPattern = input.fitPattern\n    if (input.noRepeat !== undefined) fs.noRepeat = input.noRepeat\n    if (input.align) fs.align = input.align\n    if (typeof input.offsetX === 'number') fs.offsetX = input.offsetX\n    if (typeof input.offsetY === 'number') fs.offsetY = input.offsetY\n    if (typeof input.patternWidth === 'number') fs.width = input.patternWidth\n    if (typeof input.patternHeight === 'number') fs.height = input.patternHeight\n    if (typeof input.opacity === 'number') fs.opacity = input.opacity\n    return { fillStyle: fs }\n  }\n\n  // mode 미지정 — 부분 update.\n  // things-scene 의 fillStyle 은 string (solid) 또는 object (gradient/pattern).\n  // 부분 update 에서 색만 들어오면 solid string 으로 통째 set (가장 흔한 케이스).\n  // (gradient 의 부분 update 는 mode='gradient' 명시 사용 — 모드 명시 시 full replace.)\n  if (input.color) {\n    const c = normalizeColor(input.color)\n    if (!c) return null\n    const fillStyle =\n      typeof input.opacity === 'number' && input.opacity < 1 ? withAlpha(c, input.opacity) : c\n    return { fillStyle: fillStyle as any }\n  }\n  // color 없이 opacity 만 — 부분 update 어려움 (string 인지 object 인지 모름).\n  // 명확한 의도가 있으면 mode 명시 권장. 일단 무동작 (null).\n  return null\n}\n\n/**\n * hex / 명명 색 + alpha (0..1) → rgba(r,g,b,a) 문자열.\n * Canvas API 의 fillStyle 은 rgba string 그대로 사용 가능.\n */\nfunction withAlpha(hexOrName: string, alpha: number): string {\n  // transparent\n  if (hexOrName === 'transparent') return 'rgba(0,0,0,0)'\n  // hex 예상 (#rrggbb)\n  if (hexOrName.startsWith('#') && hexOrName.length === 7) {\n    const r = parseInt(hexOrName.slice(1, 3), 16)\n    const g = parseInt(hexOrName.slice(3, 5), 16)\n    const b = parseInt(hexOrName.slice(5, 7), 16)\n    return `rgba(${r},${g},${b},${alpha})`\n  }\n  // 다른 형식이면 색을 그대로 두고 alpha 무시 (nullable 안전)\n  return hexOrName\n}\n\n/**\n * 단순 hex 색상 어둡게 — gradient 자동 생성 시 fallback 두 번째 stop 용.\n * lightness 기반 정확도 < HSL 변환이 정확하지만 의존성 줄이려 RGB linear blend 로 대체.\n */\nfunction darken(hex: string, amount: number): string {\n  const p = parseColor(hex)\n  if (!p || p.hex === 'transparent') return hex\n  const h = p.hex.slice(1) // remove #\n  const r = parseInt(h.slice(0, 2), 16)\n  const g = parseInt(h.slice(2, 4), 16)\n  const b = parseInt(h.slice(4, 6), 16)\n  const factor = 1 - Math.max(0, Math.min(1, amount))\n  const r2 = Math.round(r * factor)\n  const g2 = Math.round(g * factor)\n  const b2 = Math.round(b * factor)\n  const toHex = (n: number) => n.toString(16).padStart(2, '0')\n  return `#${toHex(r2)}${toHex(g2)}${toHex(b2)}`\n}\n"]}

package/dist-client/server/service/styling/material-tools.d.ts

@@ -0,0 +1,32 @@
+/**
+ * setMaterial / setShadowProperties — 3D PBR 재질 + 그림자 동작.
+ *
+ * Material3D (`things-scene/src/threed/material-3d.ts`) 와 1:1 매핑.
+ * preset 만 줘도 변경 가능 (resolveMaterial3d 가 default 위 override 적용).
+ */
+import type { BoardEditOp } from '../types';
+declare const MATERIAL_PRESETS: readonly ["default", "metal", "glass", "plastic", "wood", "ceramic", "rubber", "custom"];
+declare const SIDE_VALUES: readonly ["double", "front", "back"];
+export interface SetMaterialInput {
+    refids: number[];
+    preset?: typeof MATERIAL_PRESETS[number];
+    metalness?: number;
+    roughness?: number;
+    emissive?: string;
+    emissiveIntensity?: number;
+    opacity?: number;
+    envMapIntensity?: number;
+    side?: typeof SIDE_VALUES[number];
+}
+export interface SetShadowPropertiesInput {
+    refids: number[];
+    castShadow?: boolean;
+    receiveShadow?: boolean;
+}
+export interface OpsResult {
+    ops: BoardEditOp[];
+    errors: string[];
+}
+export declare function buildSetMaterialOps(input: SetMaterialInput): OpsResult;
+export declare function buildSetShadowPropertiesOps(input: SetShadowPropertiesInput): OpsResult;
+export {};