@iyulab/chat-components 0.11.8 → 0.12.0

package/dist/react/UCodeBlock.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { UCodeBlock as UCodeBlockElement } from '../components/blocks/UCodeBlock';
+import { UCodeBlock as UCodeBlockElement } from '@iyulab/chat-components/dist/components/blocks/UCodeBlock.js';
 
 export declare const UCodeBlock: React.ForwardRefExoticComponent<
   Omit<Partial<UCodeBlockElement>, keyof React.HTMLAttributes<UCodeBlockElement>>

package/dist/react/UCodeBlock.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { UCodeBlock as UCodeBlockElement } from '../components/blocks/UCodeBlock.js';
+import { UCodeBlock as UCodeBlockElement } from '@iyulab/chat-components/dist/components/blocks/UCodeBlock.js';
 
 export const UCodeBlock = createComponent({
   react: React,

package/dist/react/UElementBlock.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { UElementBlock as UElementBlockElement } from '../components/blocks/UElementBlock';
+import { UElementBlock as UElementBlockElement } from '@iyulab/chat-components/dist/components/blocks/UElementBlock.js';
 
 export declare const UElementBlock: React.ForwardRefExoticComponent<
   Omit<Partial<UElementBlockElement>, keyof React.HTMLAttributes<UElementBlockElement>>

package/dist/react/UElementBlock.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { UElementBlock as UElementBlockElement } from '../components/blocks/UElementBlock.js';
+import { UElementBlock as UElementBlockElement } from '@iyulab/chat-components/dist/components/blocks/UElementBlock.js';
 
 export const UElementBlock = createComponent({
   react: React,

package/dist/react/UFileBlock.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { UFileBlock as UFileBlockElement } from '../components/blocks/UFileBlock';
+import { UFileBlock as UFileBlockElement } from '@iyulab/chat-components/dist/components/blocks/UFileBlock.js';
 
 export declare const UFileBlock: React.ForwardRefExoticComponent<
   Omit<Partial<UFileBlockElement>, keyof React.HTMLAttributes<UFileBlockElement>>

package/dist/react/UFileBlock.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { UFileBlock as UFileBlockElement } from '../components/blocks/UFileBlock.js';
+import { UFileBlock as UFileBlockElement } from '@iyulab/chat-components/dist/components/blocks/UFileBlock.js';
 
 export const UFileBlock = createComponent({
   react: React,

package/dist/react/UImagesBlock.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { UImagesBlock as UImagesBlockElement } from '../components-extra/UImagesBlock';
+import { UImagesBlock as UImagesBlockElement } from '@iyulab/chat-components/dist/components-extra/UImagesBlock.js';
 
 export declare const UImagesBlock: React.ForwardRefExoticComponent<
   Omit<Partial<UImagesBlockElement>, keyof React.HTMLAttributes<UImagesBlockElement>>

package/dist/react/UImagesBlock.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { UImagesBlock as UImagesBlockElement } from '../components-extra/UImagesBlock.js';
+import { UImagesBlock as UImagesBlockElement } from '@iyulab/chat-components/dist/components-extra/UImagesBlock.js';
 
 export const UImagesBlock = createComponent({
   react: React,

package/dist/react/UMapBlock.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { UMapBlock as UMapBlockElement } from '../components-extra/UMapBlock';
+import { UMapBlock as UMapBlockElement } from '@iyulab/chat-components/dist/components-extra/UMapBlock.js';
 
 export declare const UMapBlock: React.ForwardRefExoticComponent<
   Omit<Partial<UMapBlockElement>, keyof React.HTMLAttributes<UMapBlockElement>>

package/dist/react/UMapBlock.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { UMapBlock as UMapBlockElement } from '../components-extra/UMapBlock.js';
+import { UMapBlock as UMapBlockElement } from '@iyulab/chat-components/dist/components-extra/UMapBlock.js';
 
 export const UMapBlock = createComponent({
   react: React,

package/dist/react/UMarkedBlock.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { UMarkedBlock as UMarkedBlockElement } from '../components/blocks/UMarkedBlock';
+import { UMarkedBlock as UMarkedBlockElement } from '@iyulab/chat-components/dist/components/blocks/UMarkedBlock.js';
 
 export declare const UMarkedBlock: React.ForwardRefExoticComponent<
   Omit<Partial<UMarkedBlockElement>, keyof React.HTMLAttributes<UMarkedBlockElement>>

package/dist/react/UMarkedBlock.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { UMarkedBlock as UMarkedBlockElement } from '../components/blocks/UMarkedBlock.js';
+import { UMarkedBlock as UMarkedBlockElement } from '@iyulab/chat-components/dist/components/blocks/UMarkedBlock.js';
 
 export const UMarkedBlock = createComponent({
   react: React,

package/dist/react/UMessage.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { UMessage as UMessageElement } from '../components/message/UMessage';
+import { UMessage as UMessageElement } from '@iyulab/chat-components/dist/components/message/UMessage.js';
 
 export declare const UMessage: React.ForwardRefExoticComponent<
   Omit<Partial<UMessageElement>, keyof React.HTMLAttributes<UMessageElement>>

package/dist/react/UMessage.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { UMessage as UMessageElement } from '../components/message/UMessage.js';
+import { UMessage as UMessageElement } from '@iyulab/chat-components/dist/components/message/UMessage.js';
 
 export const UMessage = createComponent({
   react: React,

package/dist/react/UPrompt.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { UPrompt as UPromptElement } from '../components/prompt/UPrompt';
-import { type StopEventDetail } from '../events/StopEvent';
-import { type SendEventDetail } from '../events/SendEvent';
+import { UPrompt as UPromptElement } from '@iyulab/chat-components/dist/components/prompt/UPrompt.js';
+import { type StopEventDetail } from '@iyulab/chat-components/dist/events/StopEvent.js';
+import { type SendEventDetail } from '@iyulab/chat-components/dist/events/SendEvent.js';
 
 export declare const UPrompt: React.ForwardRefExoticComponent<
   Omit<Partial<UPromptElement>, keyof React.HTMLAttributes<UPromptElement>>

package/dist/react/UPrompt.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { UPrompt as UPromptElement } from '../components/prompt/UPrompt.js';
+import { UPrompt as UPromptElement } from '@iyulab/chat-components/dist/components/prompt/UPrompt.js';
 
 export const UPrompt = createComponent({
   react: React,

package/dist/react/URefBlock.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { URefBlock as URefBlockElement } from '../components/blocks/URefBlock';
+import { URefBlock as URefBlockElement } from '@iyulab/chat-components/dist/components/blocks/URefBlock.js';
 
 export declare const URefBlock: React.ForwardRefExoticComponent<
   Omit<Partial<URefBlockElement>, keyof React.HTMLAttributes<URefBlockElement>>

package/dist/react/URefBlock.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { URefBlock as URefBlockElement } from '../components/blocks/URefBlock.js';
+import { URefBlock as URefBlockElement } from '@iyulab/chat-components/dist/components/blocks/URefBlock.js';
 
 export const URefBlock = createComponent({
   react: React,

package/dist/react/URefCard.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { URefCard as URefCardElement } from '../components/references/URefCard';
+import { URefCard as URefCardElement } from '@iyulab/chat-components/dist/components/references/URefCard.js';
 
 export declare const URefCard: React.ForwardRefExoticComponent<
   Omit<Partial<URefCardElement>, keyof React.HTMLAttributes<URefCardElement>>

package/dist/react/URefCard.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { URefCard as URefCardElement } from '../components/references/URefCard.js';
+import { URefCard as URefCardElement } from '@iyulab/chat-components/dist/components/references/URefCard.js';
 
 export const URefCard = createComponent({
   react: React,

package/dist/react/URefCardGroup.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { URefCardGroup as URefCardGroupElement } from '../components/references/URefCardGroup';
+import { URefCardGroup as URefCardGroupElement } from '@iyulab/chat-components/dist/components/references/URefCardGroup.js';
 
 export declare const URefCardGroup: React.ForwardRefExoticComponent<
   Omit<Partial<URefCardGroupElement>, keyof React.HTMLAttributes<URefCardGroupElement>>

package/dist/react/URefCardGroup.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { URefCardGroup as URefCardGroupElement } from '../components/references/URefCardGroup.js';
+import { URefCardGroup as URefCardGroupElement } from '@iyulab/chat-components/dist/components/references/URefCardGroup.js';
 
 export const URefCardGroup = createComponent({
   react: React,

package/dist/react/URefTag.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { URefTag as URefTagElement } from '../components/references/URefTag';
+import { URefTag as URefTagElement } from '@iyulab/chat-components/dist/components/references/URefTag.js';
 
 export declare const URefTag: React.ForwardRefExoticComponent<
   Omit<Partial<URefTagElement>, keyof React.HTMLAttributes<URefTagElement>>

package/dist/react/URefTag.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { URefTag as URefTagElement } from '../components/references/URefTag.js';
+import { URefTag as URefTagElement } from '@iyulab/chat-components/dist/components/references/URefTag.js';
 
 export const URefTag = createComponent({
   react: React,

package/dist/react/UTableBlock.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { UTableBlock as UTableBlockElement } from '../components/blocks/UTableBlock';
+import { UTableBlock as UTableBlockElement } from '@iyulab/chat-components/dist/components/blocks/UTableBlock.js';
 
 export declare const UTableBlock: React.ForwardRefExoticComponent<
   Omit<Partial<UTableBlockElement>, keyof React.HTMLAttributes<UTableBlockElement>>

package/dist/react/UTableBlock.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { UTableBlock as UTableBlockElement } from '../components/blocks/UTableBlock.js';
+import { UTableBlock as UTableBlockElement } from '@iyulab/chat-components/dist/components/blocks/UTableBlock.js';
 
 export const UTableBlock = createComponent({
   react: React,

package/dist/react/UTextBlock.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { UTextBlock as UTextBlockElement } from '../components/blocks/UTextBlock';
+import { UTextBlock as UTextBlockElement } from '@iyulab/chat-components/dist/components/blocks/UTextBlock.js';
 
 export declare const UTextBlock: React.ForwardRefExoticComponent<
   Omit<Partial<UTextBlockElement>, keyof React.HTMLAttributes<UTextBlockElement>>

package/dist/react/UTextBlock.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { UTextBlock as UTextBlockElement } from '../components/blocks/UTextBlock.js';
+import { UTextBlock as UTextBlockElement } from '@iyulab/chat-components/dist/components/blocks/UTextBlock.js';
 
 export const UTextBlock = createComponent({
   react: React,

package/dist/react/UVideoBlock.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { UVideoBlock as UVideoBlockElement } from '../components-extra/UVideoBlock';
+import { UVideoBlock as UVideoBlockElement } from '@iyulab/chat-components/dist/components-extra/UVideoBlock.js';
 
 export declare const UVideoBlock: React.ForwardRefExoticComponent<
   Omit<Partial<UVideoBlockElement>, keyof React.HTMLAttributes<UVideoBlockElement>>

package/dist/react/UVideoBlock.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { createComponent } from '@lit/react';
-import { UVideoBlock as UVideoBlockElement } from '../components-extra/UVideoBlock.js';
+import { UVideoBlock as UVideoBlockElement } from '@iyulab/chat-components/dist/components-extra/UVideoBlock.js';
 
 export const UVideoBlock = createComponent({
   react: React,

package/dist/utilities/HtmlPlaceholder.d.ts

@@ -1,11 +1,28 @@
 /**
  * Marked 파싱 중 HTML이 GFM에 의해 오염되는 것을 방지하기 위해
- * HTML을 주석 플레이스홀더로 치환하고, 나중에 원래 HTML로 복원하는 유틸입니다.
+ * HTML을 센티널로 치환하고, 나중에 원래 HTML로 복원하는 유틸입니다.
  */
+/**
+ * 문자열에서 ref 플레이스홀더 센티널을 제거합니다.
+ *
+ * 코드블록처럼 **복원 대상이 아닌** 경로에서 쓴다 — 거기서는 ref 태그를 렌더하지 않고
+ * 원문을 그대로 보여야 하므로, 남은 센티널은 지운다(안 지우면 PUA 문자가 두부로 보인다).
+ * 형태를 아는 곳이 이 파일 하나뿐이도록 함수로 내보낸다 — 패턴을 호출부에 복제하면
+ * 종전처럼 한쪽만 바뀌어 어긋난다.
+ */
+export declare function stripRefPlaceholders(value: string): string;
 export declare class HtmlPlaceholder {
     private map;
     private idx;
     reset(): void;
     store(html: string): string;
+    /**
+     * 파싱 결과에서 센티널을 원래 HTML로 되돌립니다.
+     *
+     * ⚠**아무것도 보관하지 않았으면 손대지 않는다**(`idx === 0`). 그 경우 문자열에 센티널이
+     * 있다면 그것은 **작성자가 직접 쓴 글자**이지 우리가 넣은 것이 아니므로, 지우는 것이
+     * 오히려 콘텐츠 손실이다. 보관분이 있을 때 매칭되지 않는 키는 빈 문자열로 지운다 —
+     * 우리 것이 아닌 센티널이 화면에 두부로 남는 것을 막는다.
+     */
     restore(html: string): string;
 }

package/dist/utilities/HtmlPlaceholder.js

@@ -1,8 +1,55 @@
 //#region src/utilities/HtmlPlaceholder.ts
 /**
 * Marked 파싱 중 HTML이 GFM에 의해 오염되는 것을 방지하기 위해
-* HTML을 주석 플레이스홀더로 치환하고, 나중에 원래 HTML로 복원하는 유틸입니다.
+* HTML을 센티널로 치환하고, 나중에 원래 HTML로 복원하는 유틸입니다.
 */
+/**
+* 센티널 경계 문자 — Unicode **Private Use Area**(U+E000..U+F8FF).
+*
+* ⚠**이 선택이 이 유틸의 계약 전부다.** 센티널은 marked 의 토크나이저를 **통과**해야 하고
+* (그래야 `restore()` 가 출력에서 되찾는다), 동시에 marked 가 **HTML로 분류하지 않아야**
+* 한다 — 분류되는 순간 `html` 토큰이 되어 소비자의 sanitizing 렌더러 손에 들어가고,
+* 거기서 형태가 바뀌면 `restore()` 는 자기가 넣은 것을 더 이상 알아보지 못한다.
+*
+* 🔴**종전 판은 HTML 주석(`<!--ref:N-->`)이었고 바로 그 이유로 깨졌다.** marked 는 주석을
+* `html` 토큰으로 잡고(실측: `text, html, text`), `UMarkedBlock` 의 XSS 하드닝 렌더러가
+* 그것을 escape 하면 `&lt;!--ref:N--&gt;` 가 되어 복원 패턴에 걸리지 않는다 — 플레이스홀더가
+* 화면에 **글자 그대로** 남는다. 「주석은 건드려지지 않는다」는 전제가 하드닝과 함께 깨진
+* 것이고, ***전제를 고치는 대신 하드닝에 예외를 두면 다음 하드닝에서 같은 자리가 다시 깨진다.***
+*
+* PUA 문자는 마크다운 문법에서 아무 의미가 없어 **평문 텍스트로만** 토큰화되고(실측),
+* `escapeHtmlText` 의 대상 문자(`& < > " '`)도 아니라 **escape 가 no-op** 이다. 코드블록·
+* 테이블 셀·강조 안에서도 원형이 보존되는 것을 확인했다. ⇒ ***어떤 sanitizing 렌더러가***
+* ***나중에 추가돼도 이 왕복은 깨지지 않는다.***
+*
+* ⚠**소스에는 escape 표기로 적는다** — 원시 PUA 문자를 파일에 두면 에디터·터미널·diff 에서
+* 두부(tofu)나 빈칸으로 보여 「거기 무엇이 있는지」를 읽을 수 없다.
+*/
+var SENTINEL_OPEN = "";
+var SENTINEL_CLOSE = "";
+/**
+* 센티널 매칭 패턴.
+*
+* `lastIndex` 상태를 공유하지 않도록 **매번 새로 만든다** — `g` 플래그가 붙은 정규식을
+* 모듈 상수로 두고 `test()`/`replace()` 에 섞어 쓰면 호출 순서에 따라 조용히 빗나간다.
+*
+* ⚠**정규식 «리터럴»로 적고 문자열로 조립하지 않는다.** 템플릿 리터럴로 `new RegExp(...)`
+* 을 만들면 백슬래시가 리터럴 단계에서 한 번 소비돼 숫자가 아니라 **글자 d 를 찾는** 정규식이
+* 조용히 만들어진다(이 파일을 쓰다 실제로 한 번 만들었다). 경계 문자를 위 상수와
+* 같은 값으로 두 번 적는 대가를 치르되, 두 자리가 **같은 파일 안**에 있고 회귀 테스트가 둘의 일치를 고정한다.
+*/
+var sentinelPattern = () => /\u{E000}\d+\u{E001}/gu;
+/**
+* 문자열에서 ref 플레이스홀더 센티널을 제거합니다.
+*
+* 코드블록처럼 **복원 대상이 아닌** 경로에서 쓴다 — 거기서는 ref 태그를 렌더하지 않고
+* 원문을 그대로 보여야 하므로, 남은 센티널은 지운다(안 지우면 PUA 문자가 두부로 보인다).
+* 형태를 아는 곳이 이 파일 하나뿐이도록 함수로 내보낸다 — 패턴을 호출부에 복제하면
+* 종전처럼 한쪽만 바뀌어 어긋난다.
+*/
+function stripRefPlaceholders(value) {
+	return value.replace(sentinelPattern(), "");
+}
 var HtmlPlaceholder = class {
 	constructor() {
 		this.map = {};
@@ -13,14 +60,22 @@ var HtmlPlaceholder = class {
 		this.idx = 0;
 	}
 	store(html) {
-		const key = `<!--ref:${this.idx++}-->`;
+		const key = `${SENTINEL_OPEN}${this.idx++}${SENTINEL_CLOSE}`;
 		this.map[key] = html;
 		return key;
 	}
+	/**
+	* 파싱 결과에서 센티널을 원래 HTML로 되돌립니다.
+	*
+	* ⚠**아무것도 보관하지 않았으면 손대지 않는다**(`idx === 0`). 그 경우 문자열에 센티널이
+	* 있다면 그것은 **작성자가 직접 쓴 글자**이지 우리가 넣은 것이 아니므로, 지우는 것이
+	* 오히려 콘텐츠 손실이다. 보관분이 있을 때 매칭되지 않는 키는 빈 문자열로 지운다 —
+	* 우리 것이 아닌 센티널이 화면에 두부로 남는 것을 막는다.
+	*/
 	restore(html) {
 		if (this.idx === 0) return html;
-		return html.replace(/<!--ref:\d+-->/g, (key) => this.map[key] ?? "");
+		return html.replace(sentinelPattern(), (key) => this.map[key] ?? "");
 	}
 };
 //#endregion
-export { HtmlPlaceholder };
+export { HtmlPlaceholder, stripRefPlaceholders };

package/dist/utilities/markedKatex.d.ts

@@ -0,0 +1,10 @@
+import { KatexOptions } from 'katex';
+import { MarkedExtension } from 'marked';
+/** `marked` 확장이 받는 옵션 — `displayMode` 는 구분자가 정하므로 소비자가 줄 수 없다. */
+export type MarkedKatexOptions = Omit<KatexOptions, "displayMode">;
+/**
+ * `marked.use()` 에 넘길 수식 확장을 만든다.
+ *
+ * @param options KaTeX 렌더 옵션(`displayMode` 제외 — 구분자가 정한다).
+ */
+export declare function markedKatex(options?: MarkedKatexOptions): MarkedExtension;

package/dist/utilities/markedKatex.js

@@ -0,0 +1,106 @@
+import katex from "../node_modules/katex/dist/katex.js";
+//#region src/utilities/markedKatex.ts
+/**
+* `marked` 에 TeX 수식 렌더를 붙이는 확장.
+*
+* 알고리즘(구분자 규칙과 토크나이저 구성)은 `marked-katex-extension`(MIT, © 2021 @markedjs)에서
+* 왔고, 타입·옵션 표면은 이 패키지의 필요에 맞춰 다시 썼다.
+*
+* ## 두 가지 «모드»가 있고, 서로 다른 축이다
+*
+* - **`displayMode`** — KaTeX 에게 *"큰 조판으로 그려라"* 라고 말하는 것(`$$…$$`).
+* - **블록 배치** — 수식이 문단 «밖»에 서는 것. `$$` 가 **자기 줄에 혼자** 있을 때만 일어난다.
+*
+* ⚠**둘은 함께 가지 않는다**: 한 줄 안의 `$$x$$` 는 `displayMode` 이면서 문단 «안»에 남는다.
+* 두 축을 하나로 합치면 기존 문서의 조판이 바뀐다.
+*
+* ## 구분자 규칙
+*
+* - 인라인 `$…$` / `$$…$$` — 여는 구분자 뒤에 `$` 가 바로 오지 않아야 하고(빈 수식 방지),
+*   내용은 **줄을 넘지 못하며**, 닫는 구분자 뒤에는 공백·구두점·문장 끝이 와야 한다.
+* - 블록 `$$\n…\n$$` — 여는·닫는 `$$` 가 각각 자기 줄에 있을 때.
+*
+* 🔴**«수식이 아닌 것을 수식으로 만들지 않는 것»이 이 규칙의 목적이다.** 가장 흔한 오탐
+* 경로는 통화 표기 둘(`from $5 to $10`)이고, 그것을 막는 것이 ⑴내용에서 개행을 배제하고
+* ⑵닫는 구분자 뒤 문맥을 요구하는 두 조건이다. 규칙을 느슨하게 하면 본문이 통째로 한
+* 수식으로 삼켜진다.
+*/
+/** 여는 구분자 뒤에 `$` 가 오지 않고, 내용이 줄을 넘지 않으며, 닫는 뒤가 공백·구두점·끝. */
+var INLINE_RULE = /^(\${1,2})(?!\$)((?:\\.|[^\\\n])*?(?:\\.|[^\\\n$]))\1(?=[\s?!.,:？！。，：]|$)/;
+/** `$$` 가 각각 자기 줄에 있는 형태. */
+var BLOCK_RULE = /^(\${1,2})\n((?:\\[^]|[^\\])+?)\n\1(?:\n|$)/;
+function render(options, token, newlineAfter) {
+	const html = katex.renderToString(token.text, {
+		...options,
+		displayMode: token.displayMode
+	});
+	return newlineAfter ? `${html}\n` : html;
+}
+function inlineKatex(options) {
+	return {
+		name: "inlineKatex",
+		level: "inline",
+		/**
+		* `marked` 가 «인라인 텍스트를 어디서 끊을지» 고르는 힌트.
+		*
+		* ⚠**이것은 규칙이 아니라 힌트다** — 여기서 걸러도 토크나이저는 그 뒤 위치에서 다시
+		* 호출되므로, 여는 `$` 앞에 공백이 없는 `a$x$` 도 결국 파싱된다. 문서의 조판을 바꾸지
+		* 않으려면 이 성질을 그대로 두어야 한다.
+		*/
+		start(src) {
+			let indexSrc = src;
+			let consumed = 0;
+			while (indexSrc) {
+				const index = indexSrc.indexOf("$");
+				if (index === -1) return;
+				if ((index === 0 || indexSrc.charAt(index - 1) === " ") && INLINE_RULE.test(indexSrc.substring(index))) return consumed + index;
+				const skipped = indexSrc.substring(index + 1);
+				const trimmed = skipped.replace(/^\$+/, "");
+				consumed += index + 1 + (skipped.length - trimmed.length);
+				indexSrc = trimmed;
+			}
+		},
+		tokenizer(src) {
+			const match = src.match(INLINE_RULE);
+			if (!match) return void 0;
+			return {
+				type: "inlineKatex",
+				raw: match[0],
+				text: match[2].trim(),
+				displayMode: match[1].length === 2
+			};
+		},
+		renderer(token) {
+			return render(options, token, false);
+		}
+	};
+}
+function blockKatex(options) {
+	return {
+		name: "blockKatex",
+		level: "block",
+		tokenizer(src) {
+			const match = src.match(BLOCK_RULE);
+			if (!match) return void 0;
+			return {
+				type: "blockKatex",
+				raw: match[0],
+				text: match[2].trim(),
+				displayMode: match[1].length === 2
+			};
+		},
+		renderer(token) {
+			return render(options, token, true);
+		}
+	};
+}
+/**
+* `marked.use()` 에 넘길 수식 확장을 만든다.
+*
+* @param options KaTeX 렌더 옵션(`displayMode` 제외 — 구분자가 정한다).
+*/
+function markedKatex(options = {}) {
+	return { extensions: [inlineKatex(options), blockKatex(options)] };
+}
+//#endregion
+export { markedKatex };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@iyulab/chat-components",
   "description": "llm chat components for building chat interfaces",
-  "version": "0.11.8",
+  "version": "0.12.0",
   "author": "iyulab",
   "license": "MIT",
   "keywords": [
@@ -61,14 +61,13 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@iyulab/components": "^1.23.0",
     "highlight.js": "^11.11.1",
-    "katex": "^0.17.0",
+    "katex": "^0.18.7",
     "lit": "^3.3.3",
-    "marked": "^18.0.6",
-    "marked-katex-extension": "5.1.10"
+    "marked": "^18.0.6"
   },
   "peerDependencies": {
+    "@iyulab/components": ">=1.23.0",
     "@lit/react": ">=1.0.8",
     "chart.js": ">=4.5.1",
     "react": ">=18.0.0"
@@ -85,16 +84,16 @@
     }
   },
   "devDependencies": {
-    "@eslint/js": "^9.39.4",
+    "@eslint/js": "^10.0.1",
     "@types/node": "^26.1.1",
     "@vitest/browser-playwright": "^4.1.10",
     "chart.js": "^4.5.1",
-    "eslint": "^9.39.4",
+    "eslint": "^10.1.0",
     "eslint-plugin-lit": "^2.3.1",
     "glob": "^13.0.6",
     "globals": "^17.7.0",
     "openai": "^6.47.0",
-    "typescript": "^5.9.3",
+    "typescript": "^6.0.2",
     "typescript-eslint": "^8.64.0",
     "vite": "^8.1.4",
     "vite-plugin-dts": "^5.0.3",

package/skills/iyulab-chat-components/references/components/chart-block.md

@@ -48,6 +48,23 @@ LLM output example (`block-json` code fence, rendered via `u-element-block`):
 
 ---
 
+## Sizing
+
+Content-sized by default: the toolbar plus the chart area. Measured at 600px wide with a small
+bar chart, that is ~368px.
+
+**A `max-height` (or `height`) on the host wins.** The toolbar keeps its height and the chart area
+takes the rest, so nothing is clipped away:
+
+```css
+u-chart-block { max-height: 200px; }
+```
+
+Before this was fixed, the chart area kept its own height regardless — against a 120px host, 248px
+of it was clipped by the block's `overflow: hidden` with no scrollbar left to reach it.
+
+There is no size property or custom property for this — the host is the lever.
+
 ## Properties
 
 | Property | Type | Default | Description |

package/skills/iyulab-chat-components/references/components/code-block.md

@@ -23,6 +23,18 @@ Syntax-highlighted code block powered by Highlight.js. Shows a language label an
 
 ---
 
+## Sizing
+
+**There is no vertical cap.** Long code grows to its content rather than folding — measured: 200
+lines render about 4,100px tall, with no vertical scrollbar of its own. Only long *lines* scroll,
+horizontally, inside the code area.
+
+That is deliberate, and it differs from [`u-table-block`](table-block.md), which caps at 480px:
+folded code cannot be read, and the conversation the block sits in already scrolls.
+
+Fenced code inside [`u-marked-block`](marked-block.md) renders as a nested `u-code-block`, so it
+follows this same contract.
+
 ## Properties
 
 | Property | Type | Default | Reflect | Description |

package/skills/iyulab-chat-components/references/components/images-block.md

@@ -38,6 +38,16 @@ LLM output example (`block-json` code fence):
 
 ---
 
+## Sizing
+
+Height comes from width: each slide is `4 / 3`, so the block is as tall as its column is wide.
+Measured at 600px wide, that is ~222px.
+
+⚠**A `max-height` on the host does *not* shrink the images, and that is deliberate.** Squeezing them
+vertically would break the aspect ratio and distort the picture, so the block overflows **visibly**
+instead — it never clips, and nothing becomes unreachable. To make it shorter, give it a narrower
+column rather than a shorter host.
+
 ## Properties
 
 | Property | Type | Default | Description |

package/skills/iyulab-chat-components/references/components/map-block.md

@@ -41,6 +41,21 @@ LLM output example (`block-json` code fence, rendered via `u-element-block`):
 
 ---
 
+## Sizing
+
+The map is **300px tall when nothing constrains it** — that is a default, not a fixed height.
+
+**A `max-height` (or `height`) on the host wins**, and the map frame shrinks to fit it:
+
+```css
+u-map-block { max-height: 200px; }
+```
+
+Before this was fixed, the frame stayed at 300px regardless — against a 120px host, 180px of the map
+was clipped by the block's `overflow: hidden` with no scrollbar left to reach it.
+
+There is no size property or custom property for this — the host is the lever.
+
 ## Properties
 
 | Property | Type | Default | Description |