@reopt-ai/opt-ui 1.7.0 → 1.9.0

package/dist/meta.js

@@ -1,4 +1,640 @@
 const coreMetas = [
+	{
+		name: "FieldToken",
+		category: "core",
+		description: "필드 타입을 글리프 하나로 표현하는 토큰. 문자열·숫자·날짜·IP·지오 등 분석 스키마 타입마다 고정된 아이콘과 팔레트 슬롯을 부여해 필드 목록·컬럼 헤더·속성 테이블 전역에서 같은 어휘를 쓴다.",
+		slug: "field-token",
+		exports: [
+			"FieldToken",
+			"FIELD_TYPE_TOKENS",
+			"resolveFieldType"
+		],
+		props: { FieldToken: [
+			{
+				name: "type",
+				type: "FieldDataType",
+				required: true,
+				description: "필드 타입. 백엔드 원본 타입은 resolveFieldType으로 변환"
+			},
+			{
+				name: "size",
+				type: "\"xs\" | \"sm\" | \"md\" | \"lg\"",
+				default: "\"sm\"",
+				description: "토큰 크기"
+			},
+			{
+				name: "fill",
+				type: "\"subtle\" | \"solid\" | \"none\"",
+				default: "\"subtle\"",
+				description: "배경 채우기 방식"
+			},
+			{
+				name: "shape",
+				type: "\"square\" | \"circle\"",
+				default: "\"square\"",
+				description: "토큰 모양"
+			},
+			{
+				name: "title",
+				type: "string",
+				description: "접근성 이름. 기본값은 타입 이름"
+			},
+			{
+				name: "decorative",
+				type: "boolean",
+				default: "false",
+				description: "인접 텍스트가 타입을 이미 말할 때 접근성 트리에서 제외"
+			},
+			{
+				name: "className",
+				type: "string",
+				description: "추가 CSS 클래스"
+			}
+		] },
+		ariaRole: "img",
+		testDescribe: "FieldToken"
+	},
+	{
+		name: "Facet",
+		category: "core",
+		description: "필드 값 분포를 카운트와 점유율 막대로 보여주고 그 행 자체가 필터가 되는 패싯. 긴 꼬리는 접어 두고 상위 값부터 읽힌다.",
+		slug: "facet",
+		exports: ["Facet", "FacetGroup"],
+		props: {
+			Facet: [
+				{
+					name: "item",
+					type: "FacetItem",
+					required: true,
+					description: "표시할 값"
+				},
+				{
+					name: "selected",
+					type: "boolean",
+					default: "false",
+					description: "선택 상태"
+				},
+				{
+					name: "onSelect",
+					type: "(id: string) => void",
+					description: "선택 콜백"
+				},
+				{
+					name: "showShare",
+					type: "boolean",
+					default: "true",
+					description: "점유율 막대 표시"
+				},
+				{
+					name: "share",
+					type: "number",
+					description: "0–1 점유율. 그룹이 계산해 내려줌"
+				},
+				{
+					name: "countFormatter",
+					type: "(count: number) => string",
+					description: "카운트 포맷터"
+				},
+				{
+					name: "layout",
+					type: "\"vertical\" | \"horizontal\"",
+					default: "\"vertical\"",
+					description: "배치 방향"
+				},
+				{
+					name: "labels",
+					type: "FacetGroupLabels",
+					description: "지역화 문자열"
+				},
+				{
+					name: "className",
+					type: "string",
+					description: "추가 CSS 클래스"
+				}
+			],
+			FacetGroup: [
+				{
+					name: "items",
+					type: "FacetItem[]",
+					required: true,
+					description: "값 목록"
+				},
+				{
+					name: "selected",
+					type: "string[]",
+					description: "선택된 id. 생략 시 비제어"
+				},
+				{
+					name: "onSelectedChange",
+					type: "(next: string[]) => void",
+					description: "선택 변경 콜백"
+				},
+				{
+					name: "selection",
+					type: "\"single\" | \"multiple\" | \"none\"",
+					default: "\"multiple\"",
+					description: "선택 모드"
+				},
+				{
+					name: "layout",
+					type: "\"vertical\" | \"horizontal\"",
+					default: "\"vertical\"",
+					description: "배치 방향"
+				},
+				{
+					name: "showShare",
+					type: "boolean",
+					default: "true",
+					description: "점유율 막대 표시"
+				},
+				{
+					name: "countFormatter",
+					type: "(count: number) => string",
+					description: "카운트 포맷터"
+				},
+				{
+					name: "max",
+					type: "number",
+					description: "접기 전 표시 행 수"
+				},
+				{
+					name: "total",
+					type: "number",
+					description: "점유율 분모. 생략 시 카운트 합"
+				},
+				{
+					name: "loading",
+					type: "boolean",
+					default: "false",
+					description: "로딩 상태"
+				},
+				{
+					name: "emptyState",
+					type: "ReactNode",
+					description: "빈 상태 렌더"
+				},
+				{
+					name: "labels",
+					type: "FacetGroupLabels",
+					description: "지역화 문자열"
+				},
+				{
+					name: "className",
+					type: "string",
+					description: "추가 CSS 클래스"
+				},
+				{
+					name: "aria-label",
+					type: "string",
+					description: "그룹 접근성 이름"
+				}
+			]
+		},
+		ariaRole: "group",
+		testDescribe: "Facet"
+	},
+	{
+		name: "Expression",
+		category: "core",
+		description: "조건을 폼이 아니라 문장으로 쓰고 그 자리에서 편집하는 표현식 절. 알림 규칙·세그먼트 필터처럼 읽어서 검증해야 하는 조건에 쓴다.",
+		slug: "expression",
+		exports: ["Expression", "ExpressionGroup"],
+		props: {
+			Expression: [
+				{
+					name: "description",
+					type: "ReactNode",
+					required: true,
+					description: "고정되는 절반 (WHEN, IS ABOVE …)"
+				},
+				{
+					name: "value",
+					type: "ReactNode",
+					description: "편집되는 절반"
+				},
+				{
+					name: "tone",
+					type: "ExpressionTone",
+					default: "\"accent\"",
+					description: "의미별 색상"
+				},
+				{
+					name: "active",
+					type: "boolean",
+					default: "false",
+					description: "편집기 열림 상태"
+				},
+				{
+					name: "invalid",
+					type: "boolean",
+					default: "false",
+					description: "유효하지 않은 절"
+				},
+				{
+					name: "disabled",
+					type: "boolean",
+					default: "false",
+					description: "비활성"
+				},
+				{
+					name: "onClick",
+					type: "() => void",
+					description: "편집기 열기"
+				},
+				{
+					name: "display",
+					type: "\"inline\" | \"stacked\"",
+					default: "\"inline\"",
+					description: "문장 흐름 유지 vs 값 아래 배치"
+				},
+				{
+					name: "aria-label",
+					type: "string",
+					description: "접근성 이름"
+				},
+				{
+					name: "className",
+					type: "string",
+					description: "추가 CSS 클래스"
+				}
+			],
+			ExpressionGroup: [
+				{
+					name: "children",
+					type: "ReactNode",
+					required: true,
+					description: "절들"
+				},
+				{
+					name: "display",
+					type: "\"sentence\" | \"columns\"",
+					default: "\"sentence\"",
+					description: "문장 배치 vs 컬럼 정렬"
+				},
+				{
+					name: "className",
+					type: "string",
+					description: "추가 CSS 클래스"
+				},
+				{
+					name: "aria-label",
+					type: "string",
+					description: "그룹 접근성 이름"
+				}
+			]
+		},
+		ariaRole: "group",
+		testDescribe: "Expression"
+	},
+	{
+		name: "TextTruncate",
+		category: "core",
+		description: "실제 폰트로 실제 가용 폭을 측정해 문자열의 식별력이 가장 낮은 부분을 잘라내는 생략. CSS가 못 하는 앞·중간·양끝 생략을 지원하고 전체 문자열은 접근성 트리에 남는다.",
+		slug: "text-truncate",
+		exports: ["TextTruncate"],
+		props: { TextTruncate: [
+			{
+				name: "text",
+				type: "string",
+				required: true,
+				description: "전체 문자열"
+			},
+			{
+				name: "truncation",
+				type: "TruncationSide",
+				default: "\"startEnd\"",
+				description: "생략 위치: end | start | middle | startEnd"
+			},
+			{
+				name: "ellipsis",
+				type: "string",
+				default: "\"…\"",
+				description: "생략 기호"
+			},
+			{
+				name: "width",
+				type: "number",
+				description: "고정 폭(px). 생략 시 컨테이너 측정"
+			},
+			{
+				name: "children",
+				type: "(truncated: string) => React.ReactNode",
+				description: "잘린 문자열을 직접 렌더"
+			},
+			{
+				name: "className",
+				type: "string",
+				description: "추가 CSS 클래스"
+			}
+		] },
+		testDescribe: "TextTruncate"
+	},
+	{
+		name: "Highlight",
+		category: "core",
+		description: "검색어에 해당하는 구간을 <mark>로 표시. 긴 항목 우선 매칭이라 겹치는 검색어도 조각나지 않는다.",
+		slug: "highlight",
+		exports: ["Highlight"],
+		props: { Highlight: [
+			{
+				name: "text",
+				type: "string",
+				required: true,
+				description: "전체 텍스트"
+			},
+			{
+				name: "search",
+				type: "string | string[]",
+				required: true,
+				description: "검색어 하나 또는 여러 개"
+			},
+			{
+				name: "caseSensitive",
+				type: "boolean",
+				default: "false",
+				description: "대소문자 구분"
+			},
+			{
+				name: "firstOnly",
+				type: "boolean",
+				default: "false",
+				description: "첫 일치만 표시"
+			},
+			{
+				name: "className",
+				type: "string",
+				description: "추가 CSS 클래스"
+			},
+			{
+				name: "markClassName",
+				type: "string",
+				description: "mark 요소 추가 클래스"
+			}
+		] },
+		testDescribe: "Highlight"
+	},
+	{
+		name: "LiveRegion",
+		category: "core",
+		description: "라이브 뷰의 변화를 스크린 리더에 읽어 주는 영역. 스로틀로 폭주를 요약하고 두 노드를 번갈아 써서 같은 문구도 다시 읽힌다.",
+		slug: "live-region",
+		exports: ["LiveRegion"],
+		props: { LiveRegion: [
+			{
+				name: "message",
+				type: "string",
+				required: true,
+				description: "안내할 문구"
+			},
+			{
+				name: "nonce",
+				type: "string | number",
+				description: "문구가 같아도 다시 읽히게 하는 값 (카운터·배치 id)"
+			},
+			{
+				name: "politeness",
+				type: "\"polite\" | \"assertive\"",
+				default: "\"polite\"",
+				description: "끼어들기 여부"
+			},
+			{
+				name: "throttleMs",
+				type: "number",
+				default: "0",
+				description: "안내 병합 간격(ms)"
+			},
+			{
+				name: "muted",
+				type: "boolean",
+				default: "false",
+				description: "안내 일시 중단"
+			}
+		] },
+		ariaRole: "status",
+		testDescribe: "LiveRegion"
+	},
+	{
+		name: "ColorPalette",
+		category: "core",
+		description: "시각화 색 팔레트를 그 팔레트의 모습 그대로 보여 주고 고르게 하는 컴포넌트. 범주형은 블록, 순차·발산형은 그라디언트로 그려 데이터 종류를 그림이 말한다.",
+		slug: "color-palette",
+		exports: [
+			"ColorPaletteDisplay",
+			"ColorPalettePicker",
+			"THEME_PALETTES"
+		],
+		props: {
+			ColorPaletteDisplay: [
+				{
+					name: "palette",
+					type: "ColorPalette",
+					required: true,
+					description: "표시할 팔레트"
+				},
+				{
+					name: "render",
+					type: "\"stops\" | \"gradient\"",
+					description: "블록 vs 그라디언트. 기본은 palette.kind에서 결정"
+				},
+				{
+					name: "size",
+					type: "\"xs\" | \"sm\" | \"md\" | \"lg\"",
+					default: "\"sm\"",
+					description: "스와치 높이"
+				},
+				{
+					name: "aria-label",
+					type: "string",
+					description: "접근성 이름"
+				},
+				{
+					name: "className",
+					type: "string",
+					description: "추가 CSS 클래스"
+				}
+			],
+			ColorPalettePicker: [
+				{
+					name: "palettes",
+					type: "ColorPalette[]",
+					required: true,
+					description: "선택지"
+				},
+				{
+					name: "value",
+					type: "string",
+					description: "선택된 팔레트 id"
+				},
+				{
+					name: "onValueChange",
+					type: "(id: string) => void",
+					description: "선택 콜백"
+				},
+				{
+					name: "label",
+					type: "string",
+					default: "\"Colour palette\"",
+					description: "레이블"
+				},
+				{
+					name: "hideLabel",
+					type: "boolean",
+					default: "false",
+					description: "레이블 시각적 숨김"
+				},
+				{
+					name: "size",
+					type: "\"xs\" | \"sm\" | \"md\" | \"lg\"",
+					default: "\"sm\"",
+					description: "스와치 높이"
+				},
+				{
+					name: "disabled",
+					type: "boolean",
+					default: "false",
+					description: "비활성"
+				},
+				{
+					name: "className",
+					type: "string",
+					description: "추가 CSS 클래스"
+				}
+			]
+		},
+		testDescribe: "ColorPalette"
+	},
+	{
+		name: "InlineEdit",
+		category: "core",
+		description: "대시보드 제목·지표 이름처럼 읽히는 횟수가 훨씬 많은 값을 그 자리에서 고치는 편집. Enter 확정, Escape 되돌리기, 거절된 저장은 입력을 유지한다.",
+		slug: "inline-edit",
+		exports: ["InlineEdit"],
+		props: { InlineEdit: [
+			{
+				name: "value",
+				type: "string",
+				required: true,
+				description: "현재 값"
+			},
+			{
+				name: "onSave",
+				type: "(next: string) => boolean | void | Promise<boolean | void>",
+				required: true,
+				description: "저장. false를 반환하면 거절하고 편집을 유지"
+			},
+			{
+				name: "as",
+				type: "\"span\" | \"h1\" | \"h2\" | \"h3\" | \"h4\"",
+				default: "\"span\"",
+				description: "읽기 모드 요소"
+			},
+			{
+				name: "size",
+				type: "\"sm\" | \"md\" | \"lg\" | \"xl\"",
+				default: "\"md\"",
+				description: "타이포 크기"
+			},
+			{
+				name: "placeholder",
+				type: "string",
+				description: "입력 자리표시자"
+			},
+			{
+				name: "emptyText",
+				type: "string",
+				default: "\"Untitled\"",
+				description: "빈 값 표시"
+			},
+			{
+				name: "disabled",
+				type: "boolean",
+				default: "false",
+				description: "편집 불가"
+			},
+			{
+				name: "maxLength",
+				type: "number",
+				description: "최대 길이"
+			},
+			{
+				name: "suffix",
+				type: "ReactNode",
+				description: "읽기 모드 텍스트 뒤 요소"
+			},
+			{
+				name: "labels",
+				type: "InlineEditLabels",
+				description: "지역화 문자열"
+			},
+			{
+				name: "className",
+				type: "string",
+				description: "추가 CSS 클래스"
+			}
+		] },
+		testDescribe: "InlineEdit"
+	},
+	{
+		name: "KeyPadMenu",
+		category: "core",
+		description: "이름보다 그림으로 알아보기 쉬운 선택지를 타일로 고르는 메뉴. 내부는 실제 radio·checkbox라 키보드와 스크린 리더가 그대로 동작한다.",
+		slug: "key-pad-menu",
+		exports: ["KeyPadMenu"],
+		props: { KeyPadMenu: [
+			{
+				name: "items",
+				type: "KeyPadItem[]",
+				required: true,
+				description: "타일 목록"
+			},
+			{
+				name: "label",
+				type: "string",
+				required: true,
+				description: "그룹 레이블"
+			},
+			{
+				name: "selection",
+				type: "\"single\" | \"multiple\"",
+				default: "\"single\"",
+				description: "선택 모드. value·onValueChange의 형태를 결정"
+			},
+			{
+				name: "value",
+				type: "string | string[]",
+				description: "선택된 id"
+			},
+			{
+				name: "onValueChange",
+				type: "((next: string) => void) | ((next: string[]) => void)",
+				description: "선택 콜백. value의 형태를 그대로 받는다"
+			},
+			{
+				name: "columns",
+				type: "number | \"auto\"",
+				default: "\"auto\"",
+				description: "행당 타일 수"
+			},
+			{
+				name: "size",
+				type: "\"sm\" | \"md\"",
+				default: "\"md\"",
+				description: "타일 크기"
+			},
+			{
+				name: "hideLabel",
+				type: "boolean",
+				default: "false",
+				description: "레전드 시각적 숨김"
+			},
+			{
+				name: "className",
+				type: "string",
+				description: "추가 CSS 클래스"
+			}
+		] },
+		testDescribe: "KeyPadMenu"
+	},
 	{
 		name: "Text",
 		category: "core",
@@ -7775,6 +8411,11 @@ const messages = [
 				type: "(action: LogCellAction) => void",
 				description: "셀 값 포함/제외 필터"
 			},
+			{
+				name: "highlightTerms",
+				type: "string[]",
+				description: "셀 텍스트에서 표시할 검색어. 쿼리의 자유 텍스트만 넘긴다"
+			},
 			{
 				name: "density",
 				type: "\"compact\" | \"normal\" | \"comfortable\"",