feat(org-chart): separate fixed and auto layout previews

packages/org-chart/src/core/render.ts

@@ -4,6 +4,7 @@ import { createEmployeeCard } from './employee-card.js';
 import { applyOrganizationStyle, organizationStylePresets } from './style-presets.js';
 import { getDepartmentCardAsset } from './department-card-assets.js';
 import type { OrgChartOrganizationLinks } from './types.js';
+import type { CompanyColorPreset } from '../company-color-presets.js';
 
 const organizationNames = { root: '최상위 조직', division: '부문', office: '실', div: 'Div', cell: '셀', team: '팀' } as const;
 
@@ -16,6 +17,8 @@ export interface RenderContext {
   /** View-only composition: no collapse controls or diagnostic text are created. */
   readOnly?: boolean;
   organizationLinks?: OrgChartOrganizationLinks;
+  /** Only the Expanded presenter supplies company header colors. */
+  expandedCompanyPreset?: CompanyColorPreset;
 }
 
 export function engineTree(roots: OrganizationTreeNode[], prefix: string, context: RenderContext, startDepth = 0): RenderEngineNode[] {
@@ -61,6 +64,14 @@ export function decorateNode(
   }
   node.dataset.organizationDepth = String(organizationDepth);
   applyOrganizationStyle(node, Number(value.groupVariant));
+  if (context.expandedCompanyPreset) {
+    const preset = context.expandedCompanyPreset;
+    node.dataset.companyId = preset.companyId;
+    node.style.setProperty('--hm-orgchart-current-gradient', preset.primary);
+    node.style.setProperty('--hm-orgchart-expanded-primary', preset.primary);
+    // Preserve every existing secondary value for the later Expanded theme.
+    preset.secondary.forEach((color, index) => node.style.setProperty(`--hm-orgchart-expanded-secondary-${index + 1}`, color));
+  }
   node.dataset.organizationType = organization.type;
   // Header role is styling-only: depth 0-1 are organization titles, deeper nodes are cell/team headers.
   node.dataset.headerRole = (context.readOnly ? organizationDepth : Number(value.depth)) <= 1 ? 'organization' : 'group';