import type { Meta, StoryObj } from '@storybook/react-vite'; import { CoreComponentPreview } from './core-component-preview'; import { organizationStylePresets } from '../../packages/org-chart/src/core/style-presets'; const meta = { title: 'OrgChart/Components/Cards', tags: ['internal'], component: CoreComponentPreview, parameters: { layout: 'padded', controls: { disable: true } } } satisfies Meta; export default meta; type Story = StoryObj; function organization(variant: number): Story { const preset = organizationStylePresets[variant]!; return { name: preset.label, args: { kind: 'OrganizationCards', variant }, render: () =>

{preset.label} · 실측 헤더 컬러 {preset.accentColor} · {preset.backgroundImage}

OrgChart 전용 --hm-orgchart-accent / --hm-orgchart-group-background. Workdesk {preset.version}, {preset.observedOn}, {preset.selector}. 직원 정보와 통계는 가상 데이터입니다. 카드 배경은 OrgChart 독립 기본값을 사용합니다.

, }; } export const BusinessManagement = organization(0); export const BusinessPlanning = organization(1); export const TalentGrowth = organization(2); export const IntegratedSystem = organization(3); export const DesignPlanning = organization(4); export const SolutionSales = organization(5); export const TopLeader: Story = { name: '최상위 리더', args: { kind: 'EmployeeCard', cardKind: 'topLeader' } }; export const OrganizationLeader: Story = { name: '조직장', args: { kind: 'EmployeeCard', cardKind: 'leader' } }; export const Employee: Story = { name: '일반 직원', args: { kind: 'EmployeeCard', cardKind: 'employee' } };