@iyulab/editor-components 0.3.3 → 0.5.0

package/CHANGELOG.md

@@ -1,5 +1,106 @@
 # Changelog
 
+## [0.5.0] - 2026-09-13
+
+### Changed
+
+- **`u-text-editor`'s height is now owned by the host box, like `u-code-editor`'s.** A CSS
+  `height` or `max-height` on the host keeps the header fixed and gives the editing area the
+  rest; `height: 100%` fills a parent. The `height` property remains as the editing area's
+  default when the host has no constraint, so a plain `<u-text-editor>` renders exactly as
+  before. Previously the property was the only way to size the editor and host CSS was ignored
+  — the two editors had opposite contracts, and a layout that worked on one silently broke on
+  the other. Floating Quill UI (pickers, the link tooltip) still escapes the box; nothing clips.
+
+- **`monaco-editor` peer range moves to `^0.56.0`** (was `^0.55.1`). 0.56 added an `exports` map
+  that rewrites every subpath to `./esm/vs/*.js`, which broke both things this component used to
+  resolve from the consumer's install: the worker entry points (`monaco-editor/esm/vs/...` now
+  resolves to `esm/vs/esm/vs/...`) and the structural stylesheet
+  (`monaco-editor/min/vs/editor/editor.main.css` is still on disk but can no longer be named).
+  The two versions need different specifiers, so one package cannot serve both — this release
+  follows the current monaco.
+  - Workers are loaded through the 0.56 form (`monaco-editor/editor/editor.worker.js`,
+    `monaco-editor/language/<lang>/<lang>.worker.js`).
+  - **The structural CSS is now baked into this package at build time** instead of being resolved
+    from the consumer's monaco. A consumer no longer resolves any monaco path on this package's
+    behalf; in exchange, the baked structure belongs to the monaco this package was built with,
+    which is why the peer range is one minor wide. Theme and token rules are unaffected — monaco
+    injects those into the shadow root itself.
+  - Nothing changes in the component's API, events or rendered contract; the eight browser
+    contract tests pass unchanged against 0.56.
+
+## [0.4.0] - 2026-09-10
+
+### Changed
+
+- **The rich text editor's colour swatches and link tooltip actions are now large enough to hit**
+  (WCAG 2.2 SC 2.5.8, 24×24 CSS px). Quill draws them at 16×16 (swatches) and 19px tall (*Edit* and
+  *Remove* in the link tooltip); the component now overrides both — swatches are 24×24, which makes
+  the colour palette wider (206px), and the tooltip actions are laid out as blocks so their 26px
+  line height is their real height. What you see is the editor this package ships, so its targets
+  follow this package's rules even where a dependency drew them.
+
+- **Fallback literals for `--u-txt-color-weak` follow `@iyulab/components` 1.40.0.** They are
+  only used when that stylesheet is not loaded; with it, nothing changes here.
+
+- **`monaco-editor` moved from `dependencies` to `peerDependencies`, narrowed to `^0.55.1`.**
+  Install it alongside this package:
+
+  ```
+  npm install monaco-editor@^0.55.1
+  ```
+
+  Two reasons, and the second one was a live break.
+
+  **The declared range crossed a breaking change in monaco's own `exports` map.** Up to 0.55.1
+  that map was the identity `"./*": "./*"`, so a subpath resolved to the file it names. 0.56.0
+  rewrites every subpath to `./esm/vs/<name>.js`, which sends
+  `monaco-editor/min/vs/editor/editor.main.css?inline` to a `.js` file that does not exist and
+  leaves no reachable path to the stylesheet at all — the `esm/` tree contains no `.css`. This
+  package needs the stylesheet as *text*, because the editor renders into a shadow root. The old
+  range `^0.55.1 || ^0.56.0` admitted both, and a fresh install picks the highest match, so any
+  consumer installing today got 0.56.0 and a build that could not resolve the import. Nothing in
+  this package's own build caught it: monaco is external, so the imports are passed through to
+  the consumer's bundler untouched.
+
+  **An editor engine has to be a single copy.** Monaco owns global state — its language and
+  theme registries — so two copies in one application do not compose. Declaring it as a peer
+  lets the consumer own the version, and makes a conflicting one an install-time error instead
+  of a silent second copy. `@iyulab/components` in this package, and `@iyulab/flex-table` and
+  `@iyulab/enterprise` in the same repo, already follow that convention.
+
+  Support for 0.56 and later is not abandoned — it needs a different way to obtain the
+  stylesheet text, which is tracked separately.
+
+- **`@iyulab/components` moved from `dependencies` to `peerDependencies` (`>=1.15.0`).** Same
+  reasoning as above and the same convention as the sibling packages: the component library
+  registers custom elements and owns module-level singletons (theme, toasts, overlay
+  stacking), so a second copy in one application does not compose — the copy that wins the
+  element registry is undefined, and the singletons split in two. Consumers already installing
+  `@iyulab/components` are unaffected; the declaration now says out loud that this package uses
+  the one they installed rather than fetching its own.
+
+### Fixed
+
+- **The text editor's editing area no longer slides out of the component when the toolbar
+  wraps.** The editing area was sized as `height` minus a fixed 42px for the toolbar, but the
+  default toolbar wraps onto two or more rows in narrower editors (88px at 480px wide), which
+  pushed the bottom of the editing area — and its scrollbar — outside the component, where it
+  was cut off. The toolbar and the editing area now share `height` by layout: the editing area
+  is whatever the toolbar leaves, at any width.
+
+- **The text editor's dropdowns and link tooltip are no longer cut off at the component's
+  edge.** The component clipped everything outside its box, so in a short editor the link
+  tooltip (open, Edit, Remove) and the lower rows of the color pickers could be neither seen
+  nor clicked. They now extend past the component like any popup. The rounded corners are kept
+  by the header — or the toolbar when `headless` — rounding its own top corners.
+
+- **The code editor now uses its full height.** The editing area was sized as the component's
+  height minus a fixed 32px for the header, but the header is 24px tall, so 8px along the bottom
+  was never used. The header and the editing area now divide the height by layout, so the editing
+  area is whatever the header leaves — at any header size. The component's overall size is
+  unchanged; only the editor inside it grows.
+
 ## [0.3.3] - 2026-08-25
 
 ### Added

package/README.md

@@ -50,6 +50,12 @@ Monaco Editor 기반 코드 에디터 컴포넌트입니다.
 | `fontSize` | `number` | `14` | 폰트 크기(px) |
 | `value` | `string` | `""` | 에디터 내용 |
 
+**크기:** **호스트 상자가 크기를 정합니다** — `:host` 가 `width: 100%; height: 100%` 이고 편집 영역은 머리글을 뺀 나머지입니다(Monaco 가 `automaticLayout` 으로 따라옵니다). `height` 프로퍼티는 없으니 요소나 부모에 CSS 로 높이를 주세요.
+
+⚠**부모에 자기 높이가 없으면 `height: 100%` 가 무효가 되어 편집 영역이 몇 px 로 붕괴합니다** — 오류도 콘솔 경고도 없이 머리글과 빈 띠만 남습니다. 부모에 높이를 주거나 요소에 직접 주세요. `headless` 면 머리글이 없어 편집 영역이 호스트 상자 전체입니다.
+
+`u-text-editor` 도 같은 계약입니다(0.5.0 부터) — 호스트 상자가 높이를 정하고, 그쪽의 `height` 프로퍼티는 호스트에 높이가 없을 때의 기본값입니다. 한쪽의 레이아웃을 다른 쪽에 그대로 옮길 수 있습니다.
+
 ### `u-text-editor` (UTextEditor)
 
 Quill.js 기반 리치 텍스트(WYSIWYG) 에디터 컴포넌트입니다.
@@ -74,9 +80,15 @@ Quill.js 기반 리치 텍스트(WYSIWYG) 에디터 컴포넌트입니다.
 | `readOnly` | `boolean` | `false` | 읽기 전용 모드 |
 | `placeholder` | `string` | `"Start writing..."` | 플레이스홀더 텍스트 |
 | `value` | `string` | `""` | 에디터 HTML 내용 |
-| `height` | `number` | `300` | 에디터 높이(px) |
+| `height` | `number` | `300` | 호스트에 높이 제약이 **없을 때의** 편집 영역 높이(px) — 아래 「크기」 참조 |
 | `toolbar` | `string[][]` | 기본 툴바 | 커스텀 툴바 설정 |
 
+**크기:** **호스트 상자가 높이를 정합니다**(0.5.0 부터 — `u-code-editor` 와 같은 계약). 호스트에 CSS `height`/`max-height` 를 주면 머리글은 그대로이고 편집 영역이 나머지를 채웁니다 — 부모를 채우려면 `height: 100%` 로 주세요. 호스트에 높이가 없으면 편집 영역은 `height` 프로퍼티(기본 300px)로 서고 호스트는 그 합만큼 자랍니다(`height="300"` → 약 349px = 헤더 48 + 300 + 테두리 · `headless` 면 헤더 없음).
+
+호스트는 넘치는 것을 자르지 않습니다 — Quill 의 떠 있는 UI(선택기 목록·링크 툴팁)는 상자를 벗어날 수 있어야 하기 때문입니다. ⚠0.4.x 까지는 반대였습니다(`height` 프로퍼티가 주인이고 호스트 CSS 높이는 상자만 바꿨습니다) — 호스트 CSS 로 편집 영역을 «못 바꾸던» 것에 기대던 레이아웃이 있다면 CHANGELOG 0.5.0 을 보세요.
+
+`u-code-editor` 도 같은 계약입니다 — 호스트 상자를 채우며, `height` 프로퍼티만 없습니다(기본 높이가 필요하면 CSS 로).
+
 **Methods:**
 
 - `getHTML()` / `getText()` / `getDelta()`: HTML / 플레인 텍스트 / Quill Delta 형식으로 내용 반환
@@ -97,6 +109,7 @@ Quill.js 기반 리치 텍스트(WYSIWYG) 에디터 컴포넌트입니다.
 ## 개발
 
 ```bash
-npm test         # Vite 개발 서버 (컴포넌트 프리뷰)
-npm run build    # 프로덕션 빌드 (eslint + vite)
+npm run preview  # Vite 개발 서버 (컴포넌트 프리뷰)
+npm test         # 테스트 (vitest — 브라우저 프로젝트, Chromium)
+npm run build    # 프로덕션 빌드 (typecheck + eslint + vite)
 ```

package/dist/_virtual/{_@oxc-project_runtime@0.147.0 → _@oxc-project_runtime@0.149.0}/helpers/esm/decorate.js

@@ -1,4 +1,4 @@
-//#region \0@oxc-project+runtime@0.147.0/helpers/esm/decorate.js
+//#region \0@oxc-project+runtime@0.149.0/helpers/esm/decorate.js
 function __decorate(decorators, target, key, desc) {
 	var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
 	if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);

package/dist/_virtual/{_@oxc-project_runtime@0.147.0 → _@oxc-project_runtime@0.149.0}/helpers/esm/decorateMetadata.js

@@ -1,4 +1,4 @@
-//#region \0@oxc-project+runtime@0.147.0/helpers/esm/decorateMetadata.js
+//#region \0@oxc-project+runtime@0.149.0/helpers/esm/decorateMetadata.js
 function __decorateMetadata(k, v) {
 	if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 }