# 2026-04-01 작업일지
## 오늘 작업
- 대시보드 카드 위젯과 샘플 구성을 보강
- WMS/TMS 대시보드 콘텐츠 배치와 차트 표현을 조정
- 대시보드 공통 표현 컴포넌트 `progress`, `multiProgress` 구조를 정리
- `src/data` 아래로 대시보드 프리셋 데이터를 분리
- 메인 화면을 좌측 메뉴 기반 API 스타일 구조로 정리
- `popup` 입력 컴포넌트를 추가하고 UI 스타일을 보강
- `select` 입력 컴포넌트를 추가
- `checkCombo` 입력 컴포넌트를 추가
- `package.json`에 Nexus `publishConfig` 추가
- 버전을 `0.1.0-alpha.0`로 조정하고 publish용 `private` 설정을 해제
- 메인 화면을 `src/views/main` 아래로 임시 분리
- Nexus 인증 방식을 `username / _password(base64)` 형식으로 재구성
- Nexus에 `ai-code-app@0.1.0-alpha.0` 배포 성공
- 메인 화면 구조를 `src/app/main` 기준으로 다시 정리하고 export 경로를 보강
- 콘텐츠 영역 바깥 여백을 줄여 카드 중심 레이아웃으로 정리
- 버튼 클릭 시에만 편집 가능한 `buttonEditableInput` 컴포넌트를 추가
- `buttonEditableInput`의 readonly 음영과 확인 버튼 편집 완료 동작을 보정
## 이슈 및 메모
- `npm publish`는 alpha 버전 배포 시 `--tag alpha`가 필요
- Nexus는 토큰 방식보다 `username / _password(base64)` 방식에서 인증이 정상 동작함
- popup 입력은 스타일 보강 과정에서 입력/버튼/readonly 영역의 경계와 톤을 반복 조정
- 대시보드 카드 높이와 콘텐츠 간격 조정은 과도한 고정값을 피하고 점진적으로 조정하는 편이 안정적
- 버튼 기반 편집 입력은 blur, Enter, 버튼 클릭 확정 타이밍을 함께 맞춰야 UX가 안정적
## 결정 사항
- 재사용 가능한 샘플/프리셋 데이터는 `src/data`에서 관리
- 대시보드 공통 표현은 `src/components/dashboard`, 카드 조합은 `src/widgets/dashboard-report-card`로 분리
- 신규 입력 컴포넌트도 `UI / plugins / samples / types` 구조를 동일하게 적용
- 메인 화면은 임시로 `views/main` 아래에 `header / sidebar / content` 단위로 분리
- 배포는 `npm publish --tag alpha` 기준으로 진행
- 메인 화면 엔트리는 `src/app/main` 기준으로 정리하고 패키지 루트 export를 함께 관리
- 버튼 편집 입력은 기본 readonly 상태를 유지하고 검증 실패 시 이전 값으로 복원
## 상세 작업 내역
- 대시보드 위젯, 입력 컴포넌트, 메인 화면 구조 변경이 동시에 진행되며 앱 성격이 샘플 갤러리 중심으로 이동
- Nexus 배포 설정과 인증 방식을 실사용 기준으로 정리해 alpha 배포 경로를 실제로 검증
- `popup`, `select`, `checkCombo`, `buttonEditableInput`을 추가하며 입력 UI 패키지 확장 패턴을 구체화
- 메인 화면을 `src/app/main`으로 재정리하면서 이후 헤더/사이드바/콘텐츠 분리 작업의 기반을 마련
## 스크린샷







## 소스
- `src/components/dashboard/progress/ProgressUI.tsx`, `src/components/dashboard/multiProgress/MultiProgressUI.tsx`: 대시보드 진행률 표현을 컴포넌트화해 카드/샘플/위젯에서 공통으로 쓰게 정리했습니다.
- `src/components/inputs/popup/PopupUI.tsx`, `src/components/inputs/select/SelectUI.tsx`, `src/components/inputs/checkCombo/CheckComboUI.tsx`: 신규 입력군을 같은 패키지 규칙으로 추가해 선택형 입력 범위를 넓혔습니다.
- `src/components/inputs/specialized/buttonEditableInput/ButtonEditableInputUI.tsx`: readonly 상태와 편집 확정 버튼을 가진 클릭 편집 입력을 도입했습니다.
- `src/app/main/MainContent.tsx`: 메인 콘텐츠를 `Docs / APIs` 기준 카드 레이아웃으로 나눠 현재 앱 성격에 맞는 메인 화면으로 재정리했습니다.
```diff
diff --git a/src/components/inputs/specialized/buttonEditableInput/ButtonEditableInputUI.tsx b/src/components/inputs/specialized/buttonEditableInput/ButtonEditableInputUI.tsx
+ const [isEditing, setIsEditing] = useState(false);
...
+ readOnly={!isEditing}
+ commitPlugins={mergedCommitPlugins}
...
+ {isEditing ? confirmButtonLabel : editButtonLabel}
diff --git a/src/app/main/MainContent.tsx b/src/app/main/MainContent.tsx
+ {activeTopMenu === 'docs' ? (
+
+
+ {selectedDocs.map((document) => (
+
+ ))}
```
## 변경 파일 (전체, 중복 제거, KST 기준)
- A app-dist/assets/2026-03-30-C4SD1FRx.js
- A app-dist/assets/2026-03-31-DwLJWvh2.js
- A app-dist/assets/2026-04-01-D5gI7Q4h.js
- A app-dist/assets/AntdIcon-Byo_R91X.js
- A app-dist/assets/CloseOutlined-B6nrJF3-.js
- A app-dist/assets/InputUI-DAmC5DJh.js
- A app-dist/assets/MultiProgressUI--uB5kqTr.js
- A app-dist/assets/ProgressUI-C91UL-oJ.js
- A app-dist/assets/README-CI9EVrw_.js
- A app-dist/assets/README-O9_O-4tf2.js
- A app-dist/assets/Sample-6Ml90fMj.js
- A app-dist/assets/Sample-BJxnglT1.js
- A app-dist/assets/Sample-BPCdH5hH.js
- A app-dist/assets/Sample-CLup9Uwo.js
- A app-dist/assets/Sample-CeT4nPqx.js
- A app-dist/assets/Sample-DKoCtyPX.js
- A app-dist/assets/Sample-DMEGMJwT.js
- A app-dist/assets/Sample-Dyso1eHr.js
- A app-dist/assets/Sample-E6V4D3Du.js
- A app-dist/assets/Sample-LB0lRdor.js
- A app-dist/assets/Sample-xgRr-oUd.js
- A app-dist/assets/SearchOutlined-Civ7xtmP.js
- A app-dist/assets/TmsDeliveryFlowSample-BHeS93-n.js
- A app-dist/assets/TmsDeliveryMetricsSample-BQV5az65.js
- A app-dist/assets/ValidInputSample-C9pl9si5.js
- A app-dist/assets/WidgetShell-DhXCYrC8.js
- A app-dist/assets/WmsInboundOutboundSample-BZCM3_0V.js
- A app-dist/assets/WmsInventoryTrendSample-DvxPBjgx.js
- A app-dist/assets/card-BpKFEf6A.js
- A app-dist/assets/check-combo-Bz7kGmN1.js
- A app-dist/assets/clsx-CzIxj0DI.js
- A app-dist/assets/component-plugin-BjxKibxS.js
- A app-dist/assets/dashboard-report-presets-Bh8duNGL.js
- A app-dist/assets/feature-template-D3D0o1kc.js
- A app-dist/assets/index-BQsYfbAI.js
- A app-dist/assets/index-CaXbpawn.css
- A app-dist/assets/input-B6oA1SZJ.js
- A app-dist/assets/input.plugin-ulF_zEvq.js
- A app-dist/assets/jsx-runtime-CNArSbpp.js
- A app-dist/assets/overview-DgYaz2rW.js
- A app-dist/assets/popup-BGFdvx2z.js
- A app-dist/assets/project-setup-jU8Nv-E8.js
- A app-dist/assets/select-DYfkmyn8.js
- A app-dist/assets/select-kIZVYgkF.js
- A app-dist/assets/status-badge-1fx0opaz.js
- A app-dist/assets/wave-DQjt-ubw.js
- A app-dist/assets/worklog-template-DE_f72dx.js
- A app-dist/index.html
- A docker-compose.yml
- M docs/worklogs/2026-04-01.md
- M package-lock.json
- M package.json
- M src/App.tsx
- A src/app/main/MainContent.tsx
- A src/app/main/MainHeader.tsx
- R src/views/main/MainSidebar.tsx -> src/app/main/MainSidebar.tsx
- R src/views/main/MainView.tsx -> src/app/main/MainView.tsx
- R src/views/main/index.ts -> src/app/main/index.ts
- R src/views/main/types.ts -> src/app/main/types.ts
- A src/app/manifests/docs.manifest.ts
- A src/app/manifests/samples.manifest.ts
- M src/components/inputs/primitives/input/index.ts
- A src/components/inputs/specialized/buttonEditableInput/ButtonEditableInputUI.css
- A src/components/inputs/specialized/buttonEditableInput/ButtonEditableInputUI.tsx
- A src/components/inputs/specialized/buttonEditableInput/index.ts
- A src/components/inputs/specialized/buttonEditableInput/samples/Sample.tsx
- M src/components/markdownPreview/MarkdownPreviewList.tsx
- M src/components/markdownPreview/index.ts
- M src/components/markdownPreview/registry.ts
- M src/components/status-badge/index.ts
- M src/features/layout/component-sample-gallery/ComponentSamplesLayout.tsx
- M src/features/layout/dashboard-report-gallery/DashboardReportGalleryLayout.tsx
- M src/features/layout/docs-markdown-preview/DocsMarkdownPreviewLayout.tsx
- M src/features/layout/feature-markdown-preview/FeatureMarkdownPreviewListLayout.tsx
- M src/features/layout/widget-sample-gallery/SampleWidgetsLayout.tsx
- A src/index.ts
- M src/samples/registry.ts
- M src/styles.css
- M src/views/main/MainContent.tsx
- D src/views/main/MainHeader.tsx
- A tsconfig.lib.json
- M README.md
- M docs/README.md
- M docs/features/project-setup.md
- A src/views/main/MainContent.tsx
- A src/views/main/MainHeader.tsx
- A src/views/main/MainSidebar.tsx
- A src/views/main/MainView.tsx
- A src/views/main/index.ts
- A src/views/main/types.ts
- A docs/components/check-combo.md
- A docs/components/popup.md
- A docs/components/select.md
- A docs/worklogs/2026-04-01.md
- A src/components/dashboard/multiProgress/MultiProgressUI.tsx
- A src/components/dashboard/multiProgress/index.ts
- A src/components/dashboard/multiProgress/plugins/index.ts
- A src/components/dashboard/multiProgress/plugins/multi-progress.plugin.ts
- A src/components/dashboard/multiProgress/samples/Sample.tsx
- A src/components/dashboard/multiProgress/types/index.ts
- A src/components/dashboard/multiProgress/types/multi-progress.ts
- A src/components/dashboard/progress/ProgressUI.tsx
- A src/components/dashboard/progress/index.ts
- A src/components/dashboard/progress/plugins/index.ts
- A src/components/dashboard/progress/plugins/progress.plugin.ts
- A src/components/dashboard/progress/samples/Sample.tsx
- A src/components/dashboard/progress/types/index.ts
- A src/components/dashboard/progress/types/progress.ts
- A src/components/inputs/checkCombo/CheckComboUI.tsx
- A src/components/inputs/checkCombo/index.ts
- A src/components/inputs/checkCombo/plugins/check-combo.plugin.ts
- A src/components/inputs/checkCombo/plugins/index.ts
- A src/components/inputs/checkCombo/samples/Sample.tsx
- A src/components/inputs/checkCombo/types/check-combo.ts
- A src/components/inputs/checkCombo/types/index.ts
- A src/components/inputs/popup/PopupUI.tsx
- A src/components/inputs/popup/index.ts
- A src/components/inputs/popup/plugins/index.ts
- A src/components/inputs/popup/plugins/popup.plugin.ts
- A src/components/inputs/popup/samples/Sample.tsx
- A src/components/inputs/popup/types/index.ts
- A src/components/inputs/popup/types/popup.ts
- A src/components/inputs/select/SelectUI.tsx
- A src/components/inputs/select/index.ts
- A src/components/inputs/select/plugins/index.ts
- A src/components/inputs/select/plugins/select.plugin.ts
- A src/components/inputs/select/samples/Sample.tsx
- A src/components/inputs/select/types/index.ts
- A src/components/inputs/select/types/select.ts
- A src/components/navigation/SectionMenuLayout.tsx
- M src/components/navigation/index.ts
- A src/data/dashboard-report-presets.ts
- A src/features/dashboard/TmsDashboardFeatureSamples.tsx
- A src/features/dashboard/WmsDashboardFeatureSamples.tsx
- A src/features/layout/dashboard-feature-gallery/DashboardFeatureGalleryLayout.tsx
- A src/features/layout/dashboard-feature-gallery/index.ts
- A src/features/layout/dashboard-report-gallery/DashboardReportGalleryLayout.tsx
- A src/features/layout/dashboard-report-gallery/index.ts
- M src/widgets/core/WidgetShell.tsx
- A src/widgets/dashboard-report-card/DashboardReportCardWidget.tsx
- A src/widgets/dashboard-report-card/index.ts
- A src/widgets/dashboard-report-card/samples/TmsDeliveryFlowSample.tsx
- A src/widgets/dashboard-report-card/samples/TmsDeliveryMetricsSample.tsx
- A src/widgets/dashboard-report-card/samples/WmsInboundOutboundSample.tsx
- A src/widgets/dashboard-report-card/samples/WmsInventoryTrendSample.tsx
- M src/widgets/registry.ts
## 실행 커맨드
```bash
npm run build
npm publish --tag alpha
npm run capture:component -- --date 2026-04-01 --name check-combo-input
npm run capture:component -- --date 2026-04-01 --name select-input
npm run capture:component -- --date 2026-04-01 --name popup-input
npm run capture:fullscreen -- --date 2026-04-01
```
## 변경 파일
- `docs/worklogs/2026-04-01.md`
- `package.json`
- `src/components/dashboard/progress/ProgressUI.tsx`
- `src/components/dashboard/multiProgress/MultiProgressUI.tsx`
- `src/components/inputs/popup/PopupUI.tsx`
- `src/components/inputs/select/SelectUI.tsx`
- `src/components/inputs/checkCombo/CheckComboUI.tsx`
- `src/components/inputs/specialized/buttonEditableInput/ButtonEditableInputUI.tsx`
- `src/app/main/MainContent.tsx`
- `src/styles.css`