174 lines
9.4 KiB
Markdown
Executable File
174 lines
9.4 KiB
Markdown
Executable File
# 2026-03-31 작업일지
|
|
|
|
## 오늘 작업
|
|
|
|
- 입력 컴포넌트 구조를 `primitives / specialized / composite` 계층으로 재정리
|
|
- 기본 입력을 `src/components/inputs/primitives/input` 아래로 이동
|
|
- 이메일 입력을 `src/components/inputs/specialized/emailInput` 구조로 정리
|
|
- 3분할 입력을 `src/components/inputs/composite/multiInput` 구조로 정리
|
|
- 샘플 및 문서 경로를 새 입력 계층 구조에 맞게 갱신
|
|
- 프로젝트 종속 레이아웃을 `src/features/layout` 아래로 이동
|
|
- `basePath` 기반 공통 markdown preview 컴포넌트와 리스트 구성 추가
|
|
- `docs/**/*.md`까지 읽을 수 있도록 markdown registry 범위 확장
|
|
- `docs` 문서를 좌측 폴더/문서 트리 + 우측 markdown 카드 목록 구조로 구성
|
|
- 좌측 문서 바로가기를 공통 `FolderTreeNav` 기반 접기/펼치기 트리로 정리
|
|
- 구조 변경 내용을 커밋하고 원격 `main` 브랜치로 푸시
|
|
|
|
## 이슈 및 메모
|
|
|
|
- 입력 컴포넌트 이름과 패키지명 기준이 중간에 몇 차례 조정됨
|
|
- 샘플 레이아웃과 문서 경로는 구조 변경 시 함께 관리해야 함
|
|
- `src` 기준 glob만 사용하면 프로젝트 루트 `docs/`는 읽히지 않음
|
|
- 빌드는 정상 통과했지만 `antd` 포함 번들로 인해 청크 크기 경고는 계속 발생
|
|
|
|
## 결정 사항
|
|
|
|
- 입력 컴포넌트는 역할 기준으로 `primitives`, `specialized`, `composite`로 분리
|
|
- `InputUI`는 primitive로 관리
|
|
- `EmailInputUI`는 specialized 입력으로 관리
|
|
- `MultiInputUI`는 여러 입력을 조합한 composite 입력으로 관리
|
|
- 프로젝트 종속적인 레이아웃은 `src/features/layout` 아래에서 관리
|
|
- markdown preview는 공통 컴포넌트가 `basePath`를 받아 재사용 가능하게 구성
|
|
- 작업일지는 날짜별 파일로 계속 누적 기록
|
|
|
|
## 상세 작업 내역
|
|
|
|
- 입력 계층 재정리와 동시에 샘플/문서 경로도 같이 옮겨 구조 변경 시 누락 포인트를 줄임
|
|
- `docs` 트리와 markdown preview를 공통화하면서 프로젝트 루트 문서도 읽을 수 있게 범위를 확장
|
|
- 좌측 폴더 트리와 우측 카드 목록 구성을 도입해 문서 탐색 화면의 기본 틀을 완성
|
|
- 구조 개편 후 빌드와 원격 푸시까지 마쳐 문서 기반 화면을 기준선으로 고정
|
|
|
|
## 스크린샷
|
|
|
|
|
|
|
|
|
|
## 소스
|
|
|
|
- `src/components/inputs/primitives/input/InputUI.tsx`: 기본 입력을 primitive 계층으로 고정하고 commit plugin 검증 흐름을 공통 엔트리로 정리했습니다.
|
|
- `src/components/inputs/specialized/emailInput/EmailInputUI.tsx`: 이메일 전용 입력을 primitive 위에 얹어 specialized 계층 규칙을 검증했습니다.
|
|
- `src/components/inputs/composite/multiInput/MultiInputUI.tsx`: 전화번호형 3분할 입력을 추가해 composite 계층과 세그먼트 이동 UX를 구현했습니다.
|
|
- `src/components/markdownPreview/MarkdownPreviewCard.tsx`, `src/features/layout/docs-markdown-preview/DocsMarkdownPreviewLayout.tsx`: 루트 `docs/` 문서를 카드와 폴더 트리로 탐색하는 Docs 미리보기 레이아웃을 추가했습니다.
|
|
|
|
```diff
|
|
diff --git a/src/components/inputs/composite/multiInput/MultiInputUI.tsx b/src/components/inputs/composite/multiInput/MultiInputUI.tsx
|
|
+function splitValue(value?: string): MultiInputParts {
|
|
+ const digits = (value ?? '').replace(/\D/g, '').slice(0, 11);
|
|
+ return [digits.slice(0, 3), digits.slice(3, 7), digits.slice(7, 11)];
|
|
+}
|
|
...
|
|
+ if (event.target.value.length === 3) {
|
|
+ secondRef.current?.focus();
|
|
+ }
|
|
|
|
diff --git a/src/components/inputs/specialized/emailInput/EmailInputUI.tsx b/src/components/inputs/specialized/emailInput/EmailInputUI.tsx
|
|
+ inputMode={inputMode}
|
|
+ placeholder={placeholder}
|
|
+ autoComplete={autoComplete}
|
|
+ commitPlugins={[createEmailValidatorPlugin(), ...commitPlugins]}
|
|
```
|
|
|
|
## 변경 파일 (전체, 중복 제거, KST 기준)
|
|
|
|
- M README.md
|
|
- M docs/README.md
|
|
- M docs/features/project-setup.md
|
|
- A docs/worklogs/2026-03-31.md
|
|
- M src/App.tsx
|
|
- A src/components/markdownPreview/MarkdownPreviewCard.tsx
|
|
- A src/components/markdownPreview/MarkdownPreviewContent.tsx
|
|
- A src/components/markdownPreview/MarkdownPreviewList.tsx
|
|
- A src/components/markdownPreview/index.ts
|
|
- A src/components/markdownPreview/markdown-document.ts
|
|
- A src/components/markdownPreview/registry.ts
|
|
- A src/components/navigation/folder-tree-nav.tsx
|
|
- A src/components/navigation/index.ts
|
|
- A src/features/layout/README.md
|
|
- R src/layouts/component-sample-gallery/ComponentSamplesLayout.tsx -> src/features/layout/component-sample-gallery/ComponentSamplesLayout.tsx
|
|
- R src/layouts/component-sample-gallery/index.ts -> src/features/layout/component-sample-gallery/index.ts
|
|
- A src/features/layout/docs-markdown-preview/DocsMarkdownPreviewLayout.tsx
|
|
- A src/features/layout/docs-markdown-preview/index.ts
|
|
- A src/features/layout/feature-markdown-preview/FeatureMarkdownPreviewListLayout.tsx
|
|
- A src/features/layout/feature-markdown-preview/index.ts
|
|
- R src/layouts/widget-registry-gallery/WidgetRegistryLayout.tsx -> src/features/layout/widget-registry-gallery/WidgetRegistryLayout.tsx
|
|
- R src/layouts/widget-registry-gallery/index.ts -> src/features/layout/widget-registry-gallery/index.ts
|
|
- R src/layouts/widget-sample-gallery/SampleWidgetsLayout.tsx -> src/features/layout/widget-sample-gallery/SampleWidgetsLayout.tsx
|
|
- R src/layouts/widget-sample-gallery/index.ts -> src/features/layout/widget-sample-gallery/index.ts
|
|
- A src/features/markdownPreview/FeatureMarkdownPreviewCard.tsx
|
|
- A src/features/markdownPreview/index.ts
|
|
- A src/features/overview.md
|
|
- M src/styles.css
|
|
- M docs/components/input.md
|
|
- M docs/worklogs/2026-03-30.md
|
|
- A src/components/inputs/composite/multiInput/MultiInputUI.tsx
|
|
- A src/components/inputs/composite/multiInput/index.ts
|
|
- A src/components/inputs/composite/multiInput/plugins/index.ts
|
|
- A src/components/inputs/composite/multiInput/plugins/multi-input.plugin.ts
|
|
- A src/components/inputs/composite/multiInput/samples/Sample.tsx
|
|
- A src/components/inputs/composite/multiInput/types/index.ts
|
|
- A src/components/inputs/composite/multiInput/types/multi-input.ts
|
|
- R src/components/inputs/input/InputUI.tsx -> src/components/inputs/primitives/input/InputUI.tsx
|
|
- R src/components/inputs/input/index.ts -> src/components/inputs/primitives/input/index.ts
|
|
- R src/components/inputs/input/plugins/index.ts -> src/components/inputs/primitives/input/plugins/index.ts
|
|
- R src/components/inputs/input/plugins/input.plugin.ts -> src/components/inputs/primitives/input/plugins/input.plugin.ts
|
|
- R src/components/inputs/input/samples/Sample.tsx -> src/components/inputs/primitives/input/samples/Sample.tsx
|
|
- R src/components/inputs/input/samples/ValidInputSample.tsx -> src/components/inputs/primitives/input/samples/ValidInputSample.tsx
|
|
- R src/components/inputs/input/types/index.ts -> src/components/inputs/primitives/input/types/index.ts
|
|
- R src/components/inputs/input/types/input.ts -> src/components/inputs/primitives/input/types/input.ts
|
|
- A src/components/inputs/specialized/emailInput/EmailInputUI.tsx
|
|
- A src/components/inputs/specialized/emailInput/index.ts
|
|
- A src/components/inputs/specialized/emailInput/plugins/email-input.plugin.ts
|
|
- A src/components/inputs/specialized/emailInput/plugins/index.ts
|
|
- A src/components/inputs/specialized/emailInput/samples/Sample.tsx
|
|
- A src/components/inputs/specialized/emailInput/types/email-input.ts
|
|
- A src/components/inputs/specialized/emailInput/types/index.ts
|
|
- A docs/components/input.md
|
|
- A src/components/inputs/input/InputUI.tsx
|
|
- A src/components/inputs/input/index.ts
|
|
- A src/components/inputs/input/plugins/index.ts
|
|
- A src/components/inputs/input/plugins/input.plugin.ts
|
|
- A src/components/inputs/input/samples/Sample.tsx
|
|
- A src/components/inputs/input/samples/ValidInputSample.tsx
|
|
- A src/components/inputs/input/types/index.ts
|
|
- A src/components/inputs/input/types/input.ts
|
|
- M src/components/status-badge/samples/Sample.tsx
|
|
- A src/layouts/component-sample-gallery/ComponentSamplesLayout.tsx
|
|
- A src/layouts/component-sample-gallery/index.ts
|
|
- A src/layouts/widget-registry-gallery/WidgetRegistryLayout.tsx
|
|
- A src/layouts/widget-registry-gallery/index.ts
|
|
- A src/layouts/widget-sample-gallery/SampleWidgetsLayout.tsx
|
|
- A src/layouts/widget-sample-gallery/index.ts
|
|
- A src/samples/registry.ts
|
|
- A src/vite-env.d.ts
|
|
- A src/widgets/api-sample-card/ApiSampleCardWidget.tsx
|
|
- A src/widgets/api-sample-card/index.ts
|
|
- A src/widgets/api-sample-card/samples/Sample.tsx
|
|
- A src/widgets/core/WidgetShell.tsx
|
|
- A src/widgets/core/index.ts
|
|
- A src/widgets/core/registry/widget-features.ts
|
|
- A src/widgets/core/types/widget.ts
|
|
- A src/widgets/registry.ts
|
|
|
|
## 실행 커맨드
|
|
|
|
```bash
|
|
npm run build
|
|
git add .
|
|
git commit -m "입력 컴포넌트 구조 정리"
|
|
git commit -m "문서 미리보기와 레이아웃 정리"
|
|
git push origin main
|
|
```
|
|
|
|
## 변경 파일
|
|
|
|
- `docs/worklogs/2026-03-31.md`
|
|
- `src/components/inputs/primitives/input/InputUI.tsx`
|
|
- `src/components/inputs/specialized/emailInput/EmailInputUI.tsx`
|
|
- `src/components/inputs/composite/multiInput/MultiInputUI.tsx`
|
|
- `src/components/markdownPreview/MarkdownPreviewCard.tsx`
|
|
- `src/components/markdownPreview/MarkdownPreviewContent.tsx`
|
|
- `src/components/markdownPreview/MarkdownPreviewList.tsx`
|
|
- `src/components/navigation/folder-tree-nav.tsx`
|
|
- `src/features/layout/component-sample-gallery/ComponentSamplesLayout.tsx`
|
|
- `src/styles.css`
|