@wipco/sdui 1.6.0 → 1.6.1

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import React__default, { CSSProperties, ReactNode, ComponentType } from 'react';
-import { S as SduiPage, a as SduiAction, b as SduiPropValue, c as SduiRule } from './types-CYfIthux.js';
-export { d as SduiArgRef, e as SduiCalcRef, f as SduiChild, g as SduiIndexRef, h as SduiItemRef, i as SduiNode, j as SduiPageQuery, k as SduiScalar, l as SduiStateRef } from './types-CYfIthux.js';
+import { S as SduiPage, a as SduiAction, b as SduiPropValue, c as SduiRule } from './types-CMikpoN5.js';
+export { d as SduiArgRef, e as SduiCalcRef, f as SduiChild, g as SduiIndexRef, h as SduiItemRef, i as SduiNode, j as SduiPageQuery, k as SduiScalar, l as SduiStateRef } from './types-CMikpoN5.js';
 import { S as SduiBoxProps, a as SduiContainerLayoutProps, b as SduiColumnsScale, c as SduiGapScale, d as SduiWeightScale, e as SduiTextAlignScale } from './layout-DmRikwZb.js';
 export { C as CHILD_LAYOUT_PROPS, L as LAYOUT_CSS, f as SduiAlignScale, g as SduiChildLayoutProps, h as SduiSizeScale, i as SduiSpanScale, j as childLayoutFrom, k as columnsClass, l as containerLayoutStyle, m as joinClass, n as mergeStyle, t as typographyStyle } from './layout-DmRikwZb.js';
 import { D as DatePickerProps, a as DateRangePickerProps, T as TimePickerProps } from './DatePicker-DX9juElE.js';
@@ -461,9 +461,14 @@ interface BadgeProps extends React__default.HTMLAttributes<HTMLSpanElement> {
     /** 선행 5px 점 — 라이브/진행 상태 */
     dot?: boolean;
     size?: 'md' | 'lg';
+    /**
+     * 긴 문구를 칸 폭 안에서 여러 줄로 감싼다(`wp-badge--wrap`, 1.6.1). 기본은 한 줄 고정 높이다.
+     * 예전에는 스펙이 style 로 height:auto·white-space:normal 등을 박아 흉내 냈다.
+     */
+    wrap?: boolean;
     children?: React__default.ReactNode;
 }
-declare function Badge({ tone, dot, size, children, className, ...rest }: BadgeProps): React__default.JSX.Element;
+declare function Badge({ tone, dot, size, wrap, children, className, ...rest }: BadgeProps): React__default.JSX.Element;
 interface TagProps extends React__default.HTMLAttributes<HTMLSpanElement> {
     /** 선행 점의 CSS 색상 */
     color?: string;
@@ -793,7 +798,16 @@ interface ResultTableProps<T extends {
     };
     onSort?: (key: string) => void;
     onRowClick?: (row: T) => void;
+    /** 체크박스로 고른 행 — `aria-selected="true"`(선택 바탕)만 붙는다. SearchResults 의 일괄 선택이 여기로 온다. */
     selectedIds?: string[];
+    /**
+     * 표시 전용 강조 행(1.6.1) — `aria-current="true"` + `wp-row--selected` 클래스. 체크박스 선택과 별개다:
+     * 옆 창에 열어 둔 행처럼 "지금 보고 있는 것"을 가리킬 뿐, 일괄 액션의 대상이 되지 않는다.
+     * 그래서 체크 선택의 `aria-selected` 를 빌리지 않는다 — 같은 속성이면 스크린리더가 둘을 "선택됨"으로
+     * 똑같이 읽는다. 바탕·막대는 클래스가 칠한다(aria-selected 규칙에 기대지 않는다).
+     * SearchResults 의 `selectedIds` 가 이리로 온다. id 비교는 문자열로 한다(행 id 가 숫자인 JSON 도 맞게).
+     */
+    pickedIds?: readonly string[];
     /** rows가 비었을 때 표 대신 렌더 */
     empty?: React__default.ReactNode;
     /** true면 스크롤 창 안에서 보이는 행만 렌더한다 */
@@ -811,7 +825,7 @@ interface ResultTableProps<T extends {
 }
 declare function ResultTable<T extends {
     id: string;
-}>({ columns, rows, sort, onSort, onRowClick, selectedIds, empty, virtual, height, rowHeight, stackable, }: ResultTableProps<T>): React__default.JSX.Element;
+}>({ columns, rows, sort, onSort, onRowClick, selectedIds, pickedIds, empty, virtual, height, rowHeight, stackable, }: ResultTableProps<T>): React__default.JSX.Element;
 interface ResultEmptyStateProps {
     /** 목록 이름 — 기본 문구에 들어간다("대여 이력이 없습니다") */
     title: string;
@@ -1277,6 +1291,17 @@ interface SearchResultsProps<T> {
      * (asset-18). endpoint 목록(RemoteSearchResults)은 이 값을 켠다.
      */
     serverFiltered?: boolean;
+    /**
+     * 표시 전용 강조(1.6.1) — 이 id 의 행(목록 보기)·카드(카드 보기)를 강조한다. 체크박스 선택(`actions`)과
+     * **별개**다: 일괄 액션의 대상이 되지 않고, 선택 바도 세우지 않는다. 옆 창·상세에 열어 둔 행을 목록에서
+     * 가리키는 자리다 — 스펙은 `"selectedIds": [{"$state":"rt.$picked.id"}]` 처럼 준다.
+     *
+     * 행은 `aria-current="true"` + `wp-row--selected`, 카드는 `wp-card--selected` + `is-selected` +
+     * `aria-current="true"` 다. 체크 선택의 `aria-selected` 는 쓰지 않는다 — 스크린리더가 강조와 체크 선택을
+     * 똑같이 "선택됨"으로 읽게 되고, 카드(버튼·일반 상자 역할)는 aria-selected 를 가질 수도 없다. 비교는
+     * 문자열로 하고, 바인딩이 아직 비어 `null`·`undefined` 인 원소는 버린다.
+     */
+    selectedIds?: string[];
 }
 /**
  * 스펙이 준 페이지 크기 목록을 다듬는다 — 양의 정수만, 중복 제거, 오름차순.
@@ -1285,7 +1310,7 @@ interface SearchResultsProps<T> {
 declare function normalizePageSizes(sizes: number[] | undefined): number[] | undefined;
 declare function SearchResults<T extends {
     id: string;
-}>({ item, columns, gridConfig, leftFilters, rightFilters, tabs, summary, initialView, views, pageSizes, className, style, searchParams, onParamsChange, actions, disableGrid, disableList, onRowClick, title, headerActions, isLoading, hideHeader, advancedSearchFields: rawAdvancedSearchFields, searchPlaceholder, virtual, serverUnsortable, primaryKey, emptyTitle, emptyText, serverFiltered, }: SearchResultsProps<T>): React__default.JSX.Element;
+}>({ item, columns, gridConfig, leftFilters, rightFilters, tabs, summary, initialView, views, pageSizes, className, style, searchParams, onParamsChange, actions, disableGrid, disableList, onRowClick, title, headerActions, isLoading, hideHeader, advancedSearchFields: rawAdvancedSearchFields, searchPlaceholder, virtual, serverUnsortable, primaryKey, emptyTitle, emptyText, serverFiltered, selectedIds, }: SearchResultsProps<T>): React__default.JSX.Element;
 
 /**
  * 셀 표현 어휘 — 목록 컬럼의 셀과 카드 행의 값이 **같은 규칙**을 쓴다.
@@ -1577,6 +1602,11 @@ interface SduiSearchCommonProps {
      * 조건이 없으면 빈 문자열. 생략하면 아무것도 적지 않는다.
      */
     queryStateKey?: string;
+    /**
+     * 표시 전용 강조 — 이 id 의 행·카드를 강조한다(체크박스 선택과 별개, 일괄 액션 대상 아님).
+     * 옆 창에 열어 둔 행을 가리키는 자리: `"selectedIds": [{"$state":"rt.$picked.id"}]`. 계약은 SearchResultsProps.selectedIds.
+     */
+    selectedIds?: string[];
 }
 interface SduiSearchResultsProps extends SduiSearchCommonProps {
     data: SearchRow[];

package/dist/index.js

@@ -1,23 +1,23 @@
-export { loadOptionalModule } from './chunk-NWYYNE3Q.js';
-import { useSduiDispatch, SduiDialog, useSduiCan, useSduiRuntime, SduiDirtyRegistryContext, SduiLeaveRegistryContext, SduiFormScopeContext, SduiDispatchContext, SduiRuntimeContext, SduiPermissionProvider } from './chunk-CI5OZ2QT.js';
-export { SduiDialog, SduiPermissionProvider, useSduiCan, useSduiDispatch, useSduiRuntime } from './chunk-CI5OZ2QT.js';
-import { Text, Spacer, Show, Section, Row, PageHead, KeyValueList, Grid, Divider, Col, Actions } from './chunk-LIZTK3HO.js';
-export { Actions, Col, Divider, Grid, KeyValueList, PageHead, Row, Section, Show, Spacer, Text } from './chunk-LIZTK3HO.js';
-import { ImageViewer } from './chunk-AZSLSAJB.js';
-export { ImageViewer } from './chunk-AZSLSAJB.js';
-import { normalizeSearchFields, searchValuesFromParams, splitMultiValue, includesLooseSearch, cascadingValuePaths, SearchToolbar, searchFieldKeys, Popover } from './chunk-4OABUPIU.js';
-export { SearchToolbar, cascadingValuePaths, cleanSearchValues, includesLooseSearch, joinMultiValue, normalizeSearchText, searchFieldKeys, searchValuesFromParams, splitMultiValue } from './chunk-4OABUPIU.js';
-import { parseYmd, YMD_RE, TimePicker, DateRangePicker, DatePicker } from './chunk-X2NIRVLN.js';
-export { DatePicker, DateRangePicker, TimePicker } from './chunk-X2NIRVLN.js';
+export { loadOptionalModule } from './chunk-4YPPL7JK.js';
+import { useSduiDispatch, SduiDialog, useSduiCan, useSduiRuntime, SduiDirtyRegistryContext, SduiLeaveRegistryContext, SduiFormScopeContext, SduiDispatchContext, SduiRuntimeContext, SduiPermissionProvider } from './chunk-VR5MFUD2.js';
+export { SduiDialog, SduiPermissionProvider, useSduiCan, useSduiDispatch, useSduiRuntime } from './chunk-VR5MFUD2.js';
+import { Text, Spacer, Show, Section, Row, PageHead, KeyValueList, Grid, Divider, Col, Actions } from './chunk-UC725BGW.js';
+export { Actions, Col, Divider, Grid, KeyValueList, PageHead, Row, Section, Show, Spacer, Text } from './chunk-UC725BGW.js';
+import { ImageViewer } from './chunk-UZZLMPRW.js';
+export { ImageViewer } from './chunk-UZZLMPRW.js';
+import { normalizeSearchFields, searchValuesFromParams, splitMultiValue, includesLooseSearch, cascadingValuePaths, SearchToolbar, searchFieldKeys, Popover } from './chunk-A57GKV5F.js';
+export { SearchToolbar, cascadingValuePaths, cleanSearchValues, includesLooseSearch, joinMultiValue, normalizeSearchText, searchFieldKeys, searchValuesFromParams, splitMultiValue } from './chunk-A57GKV5F.js';
+import { parseYmd, YMD_RE, TimePicker, DateRangePicker, DatePicker } from './chunk-FP32LNFK.js';
+export { DatePicker, DateRangePicker, TimePicker } from './chunk-FP32LNFK.js';
 import { OverlayContainerContext, OverlayLayer, useAnyModalOpen } from './chunk-BITS7UJY.js';
 export { OverlayContainerContext, OverlayLayer, getOverlayRoot, useAnyModalOpen, useOverlayLayer } from './chunk-BITS7UJY.js';
 import { HoistedStyle } from './chunk-RIZRM7OO.js';
-import { useSduiAdapter, hostFetchOf, isSafeNavigationTarget, useSduiSandbox, resolveAdapter, assetResolverOf, SduiAdapterContext } from './chunk-YNEEJCSZ.js';
-export { defaultAdapter, useSduiAssetResolver, useSduiSandbox } from './chunk-YNEEJCSZ.js';
+import { useSduiAdapter, hostFetchOf, isSafeNavigationTarget, useSduiSandbox, resolveAdapter, assetResolverOf, SduiAdapterContext } from './chunk-JHFA5RDN.js';
+export { defaultAdapter, useSduiAssetResolver, useSduiSandbox } from './chunk-JHFA5RDN.js';
 import { DEV, useIsMobile } from './chunk-GSM664TX.js';
 export { MOBILE_MEDIA_QUERY, useIsMobile } from './chunk-GSM664TX.js';
-import { EmptyState, Button, Checkbox, Select, Tabs, SegmentedControl, Spinner, Pagination, fieldOf, StatCard, isZonedIsoDateTime, formatDateValue, Icon, Card, Badge, ProgressBar, Tag, Toast, Textarea, Table, Switch, Input, IconButton, Field, Alert, warnOnce, isPlainObject, CALC_OPS, evaluateCalc, Dialog, ICON_NODES, toNumber } from './chunk-BLFJMMBW.js';
-export { Alert, Avatar, Badge, Breadcrumb, Button, CALC_OPS, Card, Checkbox, Dialog, EmptyState, Field, Icon, IconButton, Input, Pagination, ProgressBar, Radio, SegmentedControl, Select, SidebarNav, Spinner, StatCard, Switch, Table, Tabs, Tag, Textarea, Toast, Tooltip, formatDateValue, formatDisplayValue, formatNumberValue, isZonedIsoDateTime, parseNumeric } from './chunk-BLFJMMBW.js';
+import { EmptyState, Button, Checkbox, Select, Tabs, SegmentedControl, Spinner, Pagination, fieldOf, StatCard, isZonedIsoDateTime, formatDateValue, Icon, Card, Badge, ProgressBar, Tag, Toast, Textarea, Table, Switch, Input, IconButton, Field, Alert, warnOnce, isPlainObject, CALC_OPS, evaluateCalc, Dialog, ICON_NODES, toNumber } from './chunk-YYAGE733.js';
+export { Alert, Avatar, Badge, Breadcrumb, Button, CALC_OPS, Card, Checkbox, Dialog, EmptyState, Field, Icon, IconButton, Input, Pagination, ProgressBar, Radio, SegmentedControl, Select, SidebarNav, Spinner, StatCard, Switch, Table, Tabs, Tag, Textarea, Toast, Tooltip, formatDateValue, formatDisplayValue, formatNumberValue, isZonedIsoDateTime, parseNumeric } from './chunk-YYAGE733.js';
 import { boxed, LAYOUT_CSS, childLayoutFrom, CHILD_LAYOUT_PROPS } from './chunk-3JTBOABA.js';
 export { CHILD_LAYOUT_PROPS, LAYOUT_CSS, boxed, childLayoutFrom, columnsClass, containerLayoutStyle, joinClass, mergeStyle, typographyStyle } from './chunk-3JTBOABA.js';
 import React9, { createContext, useState, useMemo, useEffect, useRef, useContext, useCallback, useSyncExternalStore } from 'react';
@@ -747,6 +747,7 @@ function ResultTable({
   onSort,
   onRowClick,
   selectedIds,
+  pickedIds,
   empty,
   virtual = false,
   height = 560,
@@ -767,6 +768,7 @@ function ResultTable({
   });
   if (!rows.length && empty) return /* @__PURE__ */ jsx(Fragment, { children: empty });
   const selectedSet = selectedIds && selectedIds.length > 0 ? new Set(selectedIds) : null;
+  const pickedSet = pickedIds && pickedIds.length > 0 ? new Set(pickedIds) : null;
   const unit = measured ?? rowHeight;
   const start = virtual ? Math.max(0, Math.floor(scrollTop / unit) - OVERSCAN) : 0;
   const end = virtual ? Math.min(rows.length, Math.ceil((scrollTop + height) / unit) + OVERSCAN) : rows.length;
@@ -804,11 +806,14 @@ function ResultTable({
           rows.slice(start, end).map((row, offset) => {
             const index = start + offset;
             const selected = selectedSet ? selectedSet.has(row.id) : false;
+            const picked = pickedSet ? pickedSet.has(String(row.id)) : false;
             return /* @__PURE__ */ jsx(
               "tr",
               {
                 ref: offset === 0 ? firstRowRef : void 0,
                 "aria-selected": selected || void 0,
+                "aria-current": picked ? "true" : void 0,
+                className: picked ? "wp-row--selected" : void 0,
                 onClick: onRowClick ? () => onRowClick(row) : void 0,
                 style: onRowClick ? { cursor: "pointer" } : void 0,
                 children: columns.map((column) => {
@@ -868,6 +873,15 @@ function ResultEmptyState({ title, filtered = false, emptyTitle, emptyText, scop
   }
   return /* @__PURE__ */ jsx(EmptyState, { title: emptyTitle || `${scoped ? "" : "\uC544\uC9C1 "}${name}${josaOf(name, "\uC774/\uAC00")} \uC5C6\uC2B5\uB2C8\uB2E4`, tight: true, children: emptyText || void 0 });
 }
+function normalizeSelectedIds(ids) {
+  if (!Array.isArray(ids)) return [];
+  const out = [];
+  for (const id of ids) {
+    if (typeof id === "string" && id !== "") out.push(id);
+    else if (typeof id === "number" && Number.isFinite(id)) out.push(String(id));
+  }
+  return out;
+}
 var EMPTY_FILTERS = [];
 var EMPTY_FIELDS = [];
 var PAGE_SIZE_CHOICES = [10, 20, 50, 100];
@@ -951,10 +965,13 @@ function SearchResults({
   primaryKey,
   emptyTitle,
   emptyText,
-  serverFiltered = false
+  serverFiltered = false,
+  selectedIds
 }) {
   const hasActions = actions.length > 0;
   const isMobile = useIsMobile();
+  const pickedIds = normalizeSelectedIds(selectedIds);
+  const pickedSet = pickedIds.length > 0 ? new Set(pickedIds) : null;
   const advancedSearchFields = useMemo(
     () => normalizeSearchFields(rawAdvancedSearchFields),
     [rawAdvancedSearchFields]
@@ -1364,10 +1381,20 @@ function SearchResults({
         onSort: handleSort,
         onRowClick,
         selectedIds: hasActions ? Array.from(selected) : void 0,
+        pickedIds: pickedSet ? pickedIds : void 0,
         empty,
         virtual: virtualListActive
       }
-    ) : visibleItems.length === 0 ? empty : /* @__PURE__ */ jsx("div", { className: "wp-grid wp-grid--3", children: visibleItems.map((row) => /* @__PURE__ */ jsx(GridCard, { item: row, config: gridConfig, onClick: onRowClick }, row.id)) }),
+    ) : visibleItems.length === 0 ? empty : /* @__PURE__ */ jsx("div", { className: "wp-grid wp-grid--3", children: visibleItems.map((row) => /* @__PURE__ */ jsx(
+      GridCard,
+      {
+        item: row,
+        config: gridConfig,
+        onClick: onRowClick,
+        picked: pickedSet ? pickedSet.has(String(row.id)) : false
+      },
+      row.id
+    )) }),
     virtualListActive && clientPaginated || totalCount === 0 && !isLoading ? null : /* @__PURE__ */ jsxs("div", { className: "wp-row wp-row--between", children: [
       /* @__PURE__ */ jsxs("div", { className: "wp-row", style: { flex: "none" }, children: [
         /* @__PURE__ */ jsx("span", { className: "wp-caption", style: { whiteSpace: "nowrap" }, children: "\uD398\uC774\uC9C0\uB2F9" }),
@@ -1419,7 +1446,8 @@ function resolveRowPart(part, item) {
 function GridCard({
   item,
   config,
-  onClick
+  onClick,
+  picked = false
 }) {
   if (!config) return null;
   const badge = config.badge?.(item) ?? null;
@@ -1436,6 +1464,7 @@ function GridCard({
     Card,
     {
       interactive: Boolean(onClick),
+      ...picked ? { selected: true, className: "is-selected", "aria-current": "true" } : {},
       cover: config.cover?.(item),
       title: config.title(item),
       subtitle: config.subtitle?.(item),
@@ -1627,7 +1656,8 @@ function SduiSearchResultsImpl({
   virtual,
   emptyTitle,
   emptyText,
-  queryStateKey
+  queryStateKey,
+  selectedIds
 }) {
   const dispatch = useSduiDispatch();
   const [params, setParams] = useState(() => new URLSearchParams());
@@ -1656,6 +1686,7 @@ function SduiSearchResultsImpl({
       primaryKey: gridCard?.titleKey,
       emptyTitle,
       emptyText,
+      selectedIds,
       onRowClick: rowClick ? (row) => toList(rowClick).forEach((a) => dispatch(a, row)) : void 0,
       searchParams: params,
       onParamsChange: setParams
@@ -1687,7 +1718,8 @@ function RemoteSearchResultsImpl({
   summary,
   emptyTitle,
   emptyText,
-  queryStateKey
+  queryStateKey,
+  selectedIds
 }) {
   const dispatch = useSduiDispatch();
   const defaultPageSize = normalizePageSizes(pageSizes)?.[0] ?? 10;
@@ -1760,6 +1792,7 @@ function RemoteSearchResultsImpl({
       primaryKey: gridCard?.titleKey,
       emptyTitle,
       emptyText,
+      selectedIds,
       summary: summary ? /* @__PURE__ */ jsx(SearchSummaryCards, { items: summary.items, values: summaryState.values, dispatch }) : void 0,
       onRowClick: rowClick ? (row) => toList(rowClick).forEach((a) => dispatch(a, row)) : void 0,
       searchParams: params,
@@ -3333,6 +3366,24 @@ function urlSeedSettled(state, seeded, baseline) {
     (key) => Object.is(state[key], seeded[key]) || !Object.is(state[key], baseline[key])
   );
 }
+function encodeUrlStateValue(value) {
+  if (value === void 0 || value === null || value === "") return null;
+  if (typeof value !== "string") return JSON.stringify(value);
+  if (/^["[{]/.test(value)) return JSON.stringify(value);
+  try {
+    JSON.parse(value);
+    return JSON.stringify(value);
+  } catch {
+    return value;
+  }
+}
+function decodeUrlStateValue(raw) {
+  try {
+    return JSON.parse(raw);
+  } catch {
+    return raw;
+  }
+}
 function SduiRenderer({
   page,
   registry = defaultRegistry,
@@ -3397,13 +3448,7 @@ function SduiRenderer({
     const seeded = {};
     for (const key of page.urlState) {
       const raw = params.get(key);
-      if (raw !== null) {
-        try {
-          seeded[key] = JSON.parse(raw);
-        } catch {
-          seeded[key] = raw;
-        }
-      }
+      if (raw !== null) seeded[key] = decodeUrlStateValue(raw);
     }
     if (Object.keys(seeded).length > 0) {
       const baseline = {};
@@ -3433,16 +3478,19 @@ function SduiRenderer({
     const params = new URLSearchParams(window.location.search);
     let changed = false;
     for (const key of page.urlState) {
-      const value = state[key];
-      const serialized = value === void 0 || value === null || value === "" ? null : JSON.stringify(value);
+      const serialized = encodeUrlStateValue(state[key]);
+      const current = params.get(key);
       if (serialized === null) {
-        if (params.has(key)) {
+        if (current !== null) {
           params.delete(key);
           changed = true;
         }
-      } else if (params.get(key) !== serialized) {
-        params.set(key, serialized);
-        changed = true;
+      } else {
+        const sameValue = current !== null && (current === serialized || encodeUrlStateValue(decodeUrlStateValue(current)) === serialized);
+        if (!sameValue) {
+          params.set(key, serialized);
+          changed = true;
+        }
       }
     }
     if (changed) {

package/dist/meta.d.ts

@@ -1,4 +1,4 @@
-import { b as SduiPropValue, i as SduiNode } from './types-CYfIthux.js';
+import { b as SduiPropValue, i as SduiNode } from './types-CMikpoN5.js';
 
 /**
  * 시각 빌더용 컴포넌트 메타데이터 스키마.

package/dist/meta.js

@@ -947,6 +947,39 @@ var ButtonMeta = {
       group: "behavior",
       advanced: true
     },
+    {
+      name: "aria-label",
+      kind: "string",
+      label: "\uC811\uADFC\uC131 \uB77C\uBCA8",
+      bindable: true,
+      description: "\uBCF4\uC774\uB294 \uAE00\uC790 \uC5C6\uC774 \uC544\uC774\uCF58\uB9CC \uC788\uB294 \uBC84\uD2BC \uB4F1 \u2014 \uC2A4\uD06C\uB9B0\uB9AC\uB354\uAC00 \uC77D\uC744 \uC774\uB984. \uD589\uB9C8\uB2E4 \uB2E4\uB974\uBA74 $calc/$item \uC73C\uB85C \uC5EE\uB294\uB2E4.",
+      group: "content",
+      advanced: true
+    },
+    {
+      name: "role",
+      kind: "enum",
+      label: "\uC811\uADFC\uC131 \uC5ED\uD560",
+      description: '\uBCF4\uC870\uAE30\uC220\uC5D0 \uBC84\uD2BC\uC744 \uB2E4\uB978 \uC5ED\uD560\uB85C \uC54C\uB9B0\uB2E4(\uB098\uBA38\uC9C0 \uD504\uB86D\uCC98\uB7FC <button>\uC5D0 \uADF8\uB300\uB85C \uC5B9\uD78C\uB2E4). \uB2E8\uC77C \uC120\uD0DD \uBB36\uC74C(Row/Col role="radiogroup") \uC548\uC758 \uC120\uD0DD\uC9C0 \uBC84\uD2BC\uC774 radio \uB2E4 \u2014 \uADF8\uB54C aria-checked \uB97C \uAC19\uC774 \uC900\uB2E4.',
+      options: [
+        { value: "radio", label: "\uB2E8\uC77C \uC120\uD0DD \uD56D\uBAA9(radio)" },
+        { value: "checkbox", label: "\uCF1C\uACE0 \uB044\uB294 \uD56D\uBAA9(checkbox)" },
+        { value: "switch", label: "\uC2A4\uC704\uCE58(switch)" },
+        { value: "tab", label: "\uD0ED(tab)" },
+        { value: "menuitem", label: "\uBA54\uB274 \uD56D\uBAA9(menuitem)" }
+      ],
+      group: "behavior",
+      advanced: true
+    },
+    {
+      name: "aria-checked",
+      kind: "boolean",
+      label: "\uC811\uADFC\uC131: \uC120\uD0DD\uB428",
+      bindable: true,
+      description: 'role \uC774 radio\xB7checkbox\xB7switch \uC77C \uB54C \uC774 \uBC84\uD2BC\uC774 \uACE8\uB77C\uC838 \uC788\uB294\uAC00. \uBCF4\uD1B5 \uC0C1\uD0DC\uC640 \uBE44\uAD50\uD574 \uC5EE\uB294\uB2E4 \u2014 {"$calc":{"op":"eq","args":[{"$item":"key"},{"$state":"filter"}]}}. \uBAA8\uC591\uC740 \uBC14\uAFB8\uC9C0 \uC54A\uC73C\uB2C8 variant \uB3C4 \uAC19\uC774 \uC5EE\uB294\uB2E4.',
+      group: "behavior",
+      advanced: true
+    },
     { name: "onClick", kind: "action", label: "\uD074\uB9AD", group: "behavior" },
     styleProp,
     classNameProp,
@@ -992,6 +1025,15 @@ var CheckboxMeta = {
       group: "data"
     },
     { name: "disabled", kind: "boolean", label: "\uBE44\uD65C\uC131", default: false, bindable: true, group: "behavior" },
+    {
+      name: "aria-label",
+      kind: "string",
+      label: "\uC811\uADFC\uC131 \uB77C\uBCA8",
+      bindable: true,
+      description: "\uBCF4\uC774\uB294 \uB77C\uBCA8 \uC5C6\uC774 \uC0C1\uC790\uB9CC \uB458 \uB54C(\uD45C \uCE78\xB7\uBC18\uBCF5 \uD589) \uC2A4\uD06C\uB9B0\uB9AC\uB354\uAC00 \uC77D\uC744 \uC774\uB984 \u2014 \uC228\uC740 <input>\uC5D0 \uBD99\uB294\uB2E4. \uD589\uB9C8\uB2E4 \uB2E4\uB974\uBA74 $calc/$item \uC73C\uB85C \uC5EE\uB294\uB2E4.",
+      group: "content",
+      advanced: true
+    },
     classNameProp
   ],
   children: { accepts: false },
@@ -1348,6 +1390,15 @@ var IconButtonMeta = {
     },
     { name: "onClick", kind: "action", label: "\uD074\uB9AD", group: "behavior" },
     { name: "disabled", kind: "boolean", label: "\uBE44\uD65C\uC131", default: false, bindable: true, group: "behavior" },
+    {
+      name: "aria-label",
+      kind: "string",
+      label: "\uC811\uADFC\uC131 \uB77C\uBCA8(\uB9CC)",
+      bindable: true,
+      description: "\uD234\uD301(title) \uC5C6\uC774 \uC2A4\uD06C\uB9B0\uB9AC\uB354 \uC774\uB984\uB9CC \uC904 \uB54C. \uBCF4\uD1B5\uC740 label \uD558\uB098\uBA74 \uB41C\uB2E4(aria-label\xB7title \uB458 \uB2E4 \uB41C\uB2E4). \uB458 \uB2E4 \uC8FC\uBA74 aria-label \uC740 \uC774\uCABD\uC774 \uC774\uAE34\uB2E4.",
+      group: "content",
+      advanced: true
+    },
     styleProp,
     classNameProp
   ],
@@ -1414,6 +1465,15 @@ var InputMeta = {
     { name: "max", kind: "number", label: "\uCD5C\uB300\uAC12", description: "type=number/date\uC758 \uC0C1\uD55C", group: "validation" },
     { name: "step", kind: "number", label: "\uC99D\uAC10 \uB2E8\uC704", group: "validation", advanced: true },
     { name: "title", kind: "string", label: "\uD234\uD301", group: "content", advanced: true },
+    {
+      name: "aria-label",
+      kind: "string",
+      label: "\uC811\uADFC\uC131 \uB77C\uBCA8",
+      bindable: true,
+      description: "Field \uB77C\uBCA8\uC774 \uC5C6\uC744 \uB54C(\uD45C \uCE78\xB7\uBC18\uBCF5 \uD589\uC758 \uC785\uB825) \uC2A4\uD06C\uB9B0\uB9AC\uB354\uAC00 \uC77D\uC744 \uC774\uB984. \uD589\uB9C8\uB2E4 \uB2E4\uB974\uBA74 $calc/$item \uC73C\uB85C \uC5EE\uB294\uB2E4.",
+      group: "content",
+      advanced: true
+    },
     {
       name: "trailing",
       kind: "icon",
@@ -1541,6 +1601,15 @@ var SwitchMeta = {
       group: "appearance"
     },
     { name: "disabled", kind: "boolean", label: "\uBE44\uD65C\uC131", default: false, bindable: true, group: "behavior" },
+    {
+      name: "aria-label",
+      kind: "string",
+      label: "\uC811\uADFC\uC131 \uB77C\uBCA8",
+      bindable: true,
+      description: '\uBCF4\uC774\uB294 \uB77C\uBCA8 \uC5C6\uC774 \uD1A0\uAE00\uB9CC \uB458 \uB54C \uC2A4\uD06C\uB9B0\uB9AC\uB354\uAC00 \uC77D\uC744 \uC774\uB984 \u2014 \uC228\uC740 <input role="switch">\uC5D0 \uBD99\uB294\uB2E4.',
+      group: "content",
+      advanced: true
+    },
     classNameProp
   ],
   children: { accepts: false },
@@ -1619,6 +1688,14 @@ var BadgeMeta = {
       ],
       group: "appearance"
     },
+    {
+      name: "wrap",
+      kind: "boolean",
+      label: "\uC904\uBC14\uAFC8",
+      default: false,
+      description: "\uAE34 \uBB38\uAD6C\uB97C \uD55C \uC904\uB85C \uB450\uC9C0 \uC54A\uACE0 \uCE78 \uD3ED \uC548\uC5D0\uC11C \uC5EC\uB7EC \uC904\uB85C \uAC10\uC2FC\uB2E4(\uB192\uC774\uB294 \uAE00\uC5D0 \uB9DE\uCDB0 \uB298\uC5B4\uB09C\uB2E4).",
+      group: "appearance"
+    },
     classNameProp
   ],
   children: { accepts: true, text: true, label: "\uBC30\uC9C0 \uBB38\uAD6C" },
@@ -2425,6 +2502,14 @@ var searchCommonProps = [
     advanced: true
   },
   { name: "rowClick", kind: "action", label: "\uD589 \uD074\uB9AD", eventArg: "\uD589 \uAC1D\uCCB4 \uC804\uCCB4", group: "behavior" },
+  {
+    name: "selectedIds",
+    kind: "binding",
+    label: "\uAC15\uC870\uD560 \uD589 id",
+    bindable: true,
+    description: '\uC774 id \uB4E4\uC758 \uD589(\uBAA9\uB85D)\xB7\uCE74\uB4DC(\uCE74\uB4DC \uBCF4\uAE30)\uB97C \uAC15\uC870\uD55C\uB2E4 \u2014 \uD45C\uC2DC \uC804\uC6A9\uC774\uB77C \uCCB4\uD06C\uBC15\uC2A4 \uC120\uD0DD\xB7\uC77C\uAD04 \uC561\uC158\uACFC \uBB34\uAD00\uD558\uB2E4. \uC606 \uCC3D\uC5D0 \uC5F4\uC5B4 \uB454 \uD589\uC744 \uAC00\uB9AC\uD0AC \uB54C [{"$state":"rt.$picked.id"}]\uCC98\uB7FC \uC900\uB2E4. \uBE44\uC5B4 \uC788\uAC70\uB098 null \uC778 \uC6D0\uC18C\uB294 \uBB34\uC2DC\uD55C\uB2E4.',
+    group: "data"
+  },
   {
     name: "virtual",
     kind: "boolean",
@@ -2432,7 +2517,9 @@ var searchCommonProps = [
     description: "true\uBA74 150\uD589\uBD80\uD130. \uC22B\uC790\uB97C \uC8FC\uBA74 \uADF8 \uAC12\uC774 \uC784\uACC4 \uD589\uC218\uAC00 \uB41C\uB2E4.",
     group: "behavior",
     advanced: true
-  }
+  },
+  // 뿌리 상자(boxed)에 붙는다 — 소비 앱 시트의 옵트인 훅 자리(예: 태블릿에서 data-mobile=hide 열 숨기기).
+  classNameProp
 ];
 var searchSlots = [
   {
@@ -3523,7 +3610,7 @@ var ChartMeta = {
       kind: "boolean",
       label: "x\uCD95 \uB77C\uBCA8 \uBAA8\uB450 \uBCF4\uC774\uAE30",
       default: false,
-      description: "\uB9C9\uB300/\uC120 \uCC28\uD2B8 \uC804\uC6A9. \uAE34 \uBC94\uC8FC \uB77C\uBCA8(\uBCF8\uBD80\uBA85 \uB4F1)\uC744 \uCE78 \uD3ED\uC5D0 \uB9DE\uCDB0 \uCD5C\uB300 3\uC904\uB85C \uC904\uBC14\uAFC8\uD558\uACE0, \uADF8\uB798\uB3C4 \uBAA8\uC790\uB77C\uBA74 45\xB0 \uAE30\uC6B8\uC5EC \uC804\uBD80 \uBCF4\uC778\uB2E4. \uB044\uBA74 \uACB9\uCE58\uB294 \uB77C\uBCA8\uC744 \uAC74\uB108\uB6F4\uB2E4.",
+      description: "\uB9C9\uB300/\uC120 \uCC28\uD2B8 \uC804\uC6A9. \uAE34 \uBC94\uC8FC \uB77C\uBCA8(\uBCF8\uBD80\uBA85 \uB4F1)\uC744 \uCE78 \uD3ED\uC5D0 \uB9DE\uCDB0 \uCD5C\uB300 3\uC904\uB85C \uC904\uBC14\uAFC8\uD558\uACE0, \uADF8\uB798\uB3C4 \uBAA8\uC790\uB77C\uBA74 45\xB0 \uAE30\uC6B8\uC5EC \uC804\uBD80 \uBCF4\uC778\uB2E4(\uAE30\uC6B8\uC774\uBA74 \uCCAB \uB77C\uBCA8\uC774 \uC798\uB9AC\uC9C0 \uC54A\uAC8C \uC67C\uCABD \uC5EC\uBC31\uC744 \uB77C\uBCA8 \uAE38\uC774\uB9CC\uD07C \uB298\uB9B0\uB2E4). \uB044\uBA74 \uACB9\uCE58\uB294 \uB77C\uBCA8\uC744 \uAC74\uB108\uB6F4\uB2E4.",
       group: "appearance"
     }
   ],
@@ -5379,6 +5466,14 @@ var ImageLightboxMeta = {
       description: "\uAE30\uBCF8 \uC378\uB124\uC77C <img>\uC5D0 \uBD99\uB294\uB2E4. \uCEE4\uC2A4\uD140 \uD2B8\uB9AC\uAC70(\uC790\uC2DD)\uB97C \uC8FC\uBA74 \uC4F0\uC774\uC9C0 \uC54A\uB294\uB2E4.",
       group: "layout",
       advanced: true
+    },
+    {
+      name: "thumbStyle",
+      kind: "object",
+      label: "\uC378\uB124\uC77C \uC2A4\uD0C0\uC77C",
+      description: '\uAE30\uBCF8 \uC378\uB124\uC77C <img>\uC5D0 \uC5B9\uB294 CSS \uC18D\uC131 \uAC1D\uCCB4(\uD06C\uAE30\xB7\uB9DE\uCDA4\xB7\uBAA8\uC11C\uB9AC \u2014 \uC608: {"width":96,"height":96,"objectFit":"cover"}). \uCEE4\uC2A4\uD140 \uD2B8\uB9AC\uAC70(\uC790\uC2DD)\uB97C \uC8FC\uBA74 \uC4F0\uC774\uC9C0 \uC54A\uB294\uB2E4. \uCEF4\uD3EC\uB10C\uD2B8 \uC790\uCCB4\uC758 \uD3ED\xB7\uC5EC\uBC31\uC740 \uC790\uAE30 \uCD95(width\xB7marginTop \u2026)\uC73C\uB85C.',
+      group: "layout",
+      advanced: true
     }
   ],
   children: { accepts: true, label: "\uCEE4\uC2A4\uD140 \uD2B8\uB9AC\uAC70 \u2014 \uC0DD\uB7B5\uD558\uBA74 \uAE30\uBCF8 \uC378\uB124\uC77C\uC774 \uADF8\uB824\uC9C4\uB2E4" },
@@ -5775,6 +5870,14 @@ var EventCalendarMeta = {
       description: "\uC8FC\uBA74 \uC81C\uC5B4 \uBAA8\uB4DC\uAC00 \uB41C\uB2E4.",
       group: "data",
       advanced: true
+    },
+    {
+      name: "className",
+      kind: "string",
+      label: "\uCD94\uAC00 \uD074\uB798\uC2A4",
+      description: "\uB2EC\uB825 \uBFCC\uB9AC \uC0C1\uC790\uC5D0 \uB367\uBD99\uB294\uB2E4 \u2014 \uC18C\uBE44 \uC571 \uC2DC\uD2B8\uAC00 \uB2EC\uB825 \uC548\uCABD\uC744 \uB2E4\uB4EC\uB294 \uD6C5 \uC790\uB9AC.",
+      group: "layout",
+      advanced: true
     }
   ],
   children: { accepts: false },
@@ -5964,7 +6067,7 @@ var TreeViewMeta = {
       kind: "string",
       label: "\uC120\uD0DD\uB41C \uB178\uB4DC id",
       bindable: true,
-      description: "\uC8FC\uBA74 \uC81C\uC5B4 \uBAA8\uB4DC\uAC00 \uB41C\uB2E4 \u2014 \uB0B4\uBD80 \uC120\uD0DD \uC0C1\uD0DC\uB97C \uC4F0\uC9C0 \uC54A\uB294\uB2E4.",
+      description: "\uC8FC\uBA74 \uC81C\uC5B4 \uBAA8\uB4DC\uAC00 \uB41C\uB2E4 \u2014 \uB0B4\uBD80 \uC120\uD0DD \uC0C1\uD0DC\uB97C \uC4F0\uC9C0 \uC54A\uB294\uB2E4. \uAC12\uC774 \uBC14\uB00C\uBA74(\uB525\uB9C1\uD06C\xB7\uD558\uC704 \uD45C\uC5D0\uC11C \uB0B4\uB824\uAC10) \uC811\uD78C \uC870\uC0C1\uC744 \uD3BC\uCE58\uACE0 \uADF8 \uD589\uC744 \uD2B8\uB9AC \uC2A4\uD06C\uB864 \uC548\uC73C\uB85C \uAC00\uC838\uC628\uB2E4. \uAC19\uC740 \uC120\uD0DD\uC5D0\uC11C \uC0AC\uC6A9\uC790\uAC00 \uC811\uC740 \uAC83\uC740 \uADF8\uB300\uB85C \uB454\uB2E4.",
       group: "data"
     },
     { name: "onSelect", kind: "action", label: "\uB178\uB4DC \uC120\uD0DD", eventArg: "\uC120\uD0DD\uB41C \uB178\uB4DC id", group: "behavior" },
@@ -6213,7 +6316,16 @@ var SecureScreenMeta = {
       description: "false\uBA74 \uC544\uBB34 \uC81C\uC57D \uC5C6\uC774 \uC790\uC2DD\uC744 \uADF8\uB300\uB85C \uADF8\uB9B0\uB2E4.",
       group: "behavior"
     },
-    { name: "notice", kind: "string", label: "\uAC00\uB9BC\uB9C9 \uBB38\uAD6C", group: "content" }
+    { name: "notice", kind: "string", label: "\uAC00\uB9BC\uB9C9 \uBB38\uAD6C", group: "content" },
+    {
+      name: "documentWideKeys",
+      kind: "boolean",
+      label: "\uBB38\uC11C \uC804\uCCB4 \uB2E8\uCD95\uD0A4 \uCC28\uB2E8",
+      default: true,
+      description: "Ctrl/Cmd+A\xB7C\xB7P\xB7S\xB7U\xB7X \uCC28\uB2E8\uC744 \uBB38\uC11C \uC804\uCCB4\uC5D0 \uAC74\uB2E4(\uB798\uD37C \uBC16\uC5D0\uC11C \uC804\uCCB4\uC120\uD0DD\u2192\uBCF5\uC0AC \uC6B0\uD68C\uB97C \uB9C9\uB294\uB2E4). \uD398\uC774\uC9C0 \uC77C\uBD80\uB9CC \uAC10\uC2F8\uB294 \uD654\uBA74\uC5D0\uC11C \uBCF4\uD638 \uB300\uC0C1 \uC544\uB2CC \uC785\uB825\uC758 \uBCF5\uC0AC\xB7\uC800\uC7A5\uAE4C\uC9C0 \uB9C9\uC9C0 \uC54A\uC73C\uB824\uBA74 \uB048\uB2E4 \u2014 \uADF8\uB54C\uB294 \uB798\uD37C \uC548\uC5D0\uC11C \uB204\uB978 \uC870\uD569\uB9CC \uB9C9\uB294\uB2E4.",
+      group: "behavior",
+      advanced: true
+    }
   ],
   children: { accepts: true, text: true, label: "\uBCF4\uD638\uD560 \uB0B4\uC6A9" },
   dom: { element: "div" },

package/dist/rich/ExcelUploadCard.js

@@ -1,7 +1,7 @@
-import { loadOptionalModule } from '../chunk-NWYYNE3Q.js';
-import { useSduiAdapter, useSduiSandbox, hostFetchOf, defaultAdapter, hostRawFetchOf } from '../chunk-YNEEJCSZ.js';
+import { loadOptionalModule } from '../chunk-4YPPL7JK.js';
+import { useSduiAdapter, useSduiSandbox, hostFetchOf, defaultAdapter, hostRawFetchOf } from '../chunk-JHFA5RDN.js';
 import '../chunk-GSM664TX.js';
-import { Select, Input, Card, Button, Spinner, Icon, Alert, StatCard, Badge, Table, EmptyState } from '../chunk-BLFJMMBW.js';
+import { Select, Input, Card, Button, Spinner, Icon, Alert, StatCard, Badge, Table, EmptyState } from '../chunk-YYAGE733.js';
 import { boxed } from '../chunk-3JTBOABA.js';
 import { useRef, useState, useMemo, useCallback } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';

package/dist/rich.d.ts

@@ -73,7 +73,8 @@ interface ChartProps {
     integer?: boolean;
     /**
      * x축 범주 라벨을 **모두** 보인다. 긴 라벨은 칸 폭에 맞춰 줄을 바꾸고(최대 3줄),
-     * 그래도 모자라면 45° 기울인다. 칸이 그보다도 좁으면 겹치는 라벨만 건너뛴다(기본 동작).
+     * 그래도 모자라면 45° 기울인다(첫 라벨들이 왼쪽 밖으로 잘리지 않게 왼쪽 여백을 늘린다).
+     * 칸이 그보다도 좁으면 겹치는 라벨만 건너뛴다(기본 동작).
      * 끄면(기본) recharts가 겹치는 라벨을 건너뛴다 — 본부명처럼 긴 범주에서 라벨이 사라진다.
      */
     xTickWrap?: boolean;

package/dist/rich.js

@@ -1,10 +1,10 @@
-import { useOptionalModule, DependencyPlaceholder } from './chunk-NWYYNE3Q.js';
-export { DatePicker, DateRangePicker, TimePicker } from './chunk-X2NIRVLN.js';
+import { useOptionalModule, DependencyPlaceholder } from './chunk-4YPPL7JK.js';
+export { DatePicker, DateRangePicker, TimePicker } from './chunk-FP32LNFK.js';
 import './chunk-BITS7UJY.js';
 import { HoistedStyle } from './chunk-RIZRM7OO.js';
-import { useSduiAssetResolver } from './chunk-YNEEJCSZ.js';
+import { useSduiAssetResolver } from './chunk-JHFA5RDN.js';
 import './chunk-GSM664TX.js';
-import { Spinner, EmptyState } from './chunk-BLFJMMBW.js';
+import { Spinner, EmptyState } from './chunk-YYAGE733.js';
 import './chunk-3JTBOABA.js';
 import { useRef, useCallback, useMemo, useState, useEffect, useLayoutEffect } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
@@ -182,6 +182,31 @@ function planXTicks(labels, bandWidth, measure) {
   }
   return { mode: "skip" };
 }
+var ROTATE_EDGE_PAD = 2;
+function rotatedTickInset(widths, axisWidth, span, point = false) {
+  const n = widths.length;
+  if (n === 0 || !(span > 0)) return 0;
+  let inset = 0;
+  widths.forEach((width, i) => {
+    const f = point ? n > 1 ? i / (n - 1) : 0.5 : (i + 0.5) / n;
+    if (f >= 1) return;
+    const reach = (width + TICK_FONT / 2) * Math.SQRT1_2 + ROTATE_EDGE_PAD;
+    const need = (reach - axisWidth - span * f) / (1 - f);
+    if (need > inset) inset = need;
+  });
+  return Math.ceil(inset);
+}
+var ROTATE_MIN_BAND = TICK_FONT * 1.25 / Math.SQRT1_2;
+function planXTicksWithInset(labels, span, axisWidth, measure, point = false) {
+  const count = Math.max(1, labels.length);
+  const plan = planXTicks(labels, span / count, measure);
+  if (plan.mode !== "rotate") return { plan, inset: 0 };
+  const want = rotatedTickInset(labels.map((label) => measure(label)), axisWidth, span, point);
+  const inset = Math.max(0, Math.min(want, Math.floor(span - count * ROTATE_MIN_BAND)));
+  if (inset === 0) return { plan, inset: 0 };
+  const narrowed = planXTicks(labels, (span - inset) / count, measure);
+  return narrowed.mode === "rotate" ? { plan: narrowed, inset } : { plan, inset: 0 };
+}
 var tooltipBoxStyle = {
   background: "var(--wp-surface-card)",
   border: "1px solid var(--wp-border-subtle)",
@@ -614,8 +639,10 @@ function Chart({
   let xTick = {};
   if (xTickWrap && hostBox.width > 0) {
     const labels = rows.map((row) => String((xKey ? row[xKey] : void 0) ?? ""));
-    const plotWidth = hostBox.width - margin.left - margin.right - Y_AXIS_WIDTH * (dual ? 2 : 1);
-    const plan = planXTicks(labels, plotWidth / Math.max(1, labels.length), makeMeasure(hostBox.fontFamily));
+    const measure = makeMeasure(hostBox.fontFamily);
+    const span = hostBox.width - margin.right - Y_AXIS_WIDTH * (dual ? 2 : 1);
+    const { plan, inset } = planXTicksWithInset(labels, span - margin.left, Y_AXIS_WIDTH, measure, !hasBar);
+    margin.left += inset;
     if (plan.mode !== "skip") {
       xTick = { interval: 0, height: plan.height, tick: renderCategoryTick(plan) };
     }