@wipco/sdui 0.9.0 → 0.10.0

package/dist/{chunk-JONNWN6N.js → chunk-FDVI3PWQ.js}

@@ -45,6 +45,7 @@ function describeParseError(err, text) {
 function JsonFieldImpl({
   value,
   onChange,
+  emptyAsNull = false,
   rows = 6,
   invalid = false,
   disabled = false,
@@ -67,6 +68,10 @@ function JsonFieldImpl({
     focusedRef.current = false;
     if (text.trim() === "") {
       setParseError(null);
+      if (emptyAsNull) {
+        lastFormattedRef.current = "";
+        onChange?.(null);
+      }
       return;
     }
     try {
@@ -79,7 +84,7 @@ function JsonFieldImpl({
     } catch (err) {
       setParseError(describeParseError(err, text));
     }
-  }, [text, onChange]);
+  }, [text, onChange, emptyAsNull]);
   return /* @__PURE__ */ jsxs(
     "div",
     {

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 SduiAction, a as SduiPropValue, b as SduiRule, c as SduiPage } from './types-Dl4rPyan.js';
-export { d as SduiCalcRef, e as SduiChild, f as SduiIndexRef, g as SduiItemRef, h as SduiNode, i as SduiPageQuery, j as SduiScalar, k as SduiStateRef } from './types-Dl4rPyan.js';
+import { S as SduiAction, a as SduiPropValue, b as SduiRule, c as SduiPage } from './types-DO8_hC6A.js';
+export { d as SduiCalcRef, e as SduiChild, f as SduiIndexRef, g as SduiItemRef, h as SduiNode, i as SduiPageQuery, j as SduiScalar, k as SduiStateRef } from './types-DO8_hC6A.js';
 import { S as SduiBoxProps, a as SduiContainerLayoutProps, b as SduiColumnsScale, c as SduiGapScale, d as SduiWeightScale, e as SduiTextAlignScale } from './layout-B1QrIBm6.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-B1QrIBm6.js';
 import { D as DatePickerProps, a as DateRangePickerProps } from './DatePicker-BndreCPl.js';

package/dist/index.js

@@ -688,47 +688,52 @@ function SearchResults({
     }
     return entries;
   }, [leftFilters, rightFilters, searchParams]);
+  const hasAllRows = item.data.length >= item.total;
   const processed = useMemo(() => {
     const cell = (row, key) => row[key];
     let rows = item.data;
-    if (appliedSearch) {
-      rows = rows.filter(
-        (row) => includesLooseSearch(
-          Object.values(row).filter((v) => typeof v === "string" || typeof v === "number").join(" "),
-          appliedSearch
-        )
-      );
-    }
-    for (const { key, values } of activeFilters) {
-      rows = rows.filter((row) => values.includes(String(cell(row, key))));
-    }
-    for (const field of advancedSearchFields) {
-      if (field.type === "select") {
-        const wanted = splitMultiValue(advancedValues[field.key] ?? "");
-        if (wanted.length > 0) rows = rows.filter((row) => wanted.includes(String(cell(row, field.key))));
-      } else if (field.type === "cascading") {
-        const wanted = splitMultiValue(advancedValues[field.key] ?? "");
-        if (wanted.length > 0) {
-          const lineages = cascadingValuePaths(field.options);
-          rows = rows.filter((row) => {
-            const own = String(cell(row, field.key));
-            const lineage = lineages.get(own) ?? [own];
-            return lineage.some((value) => wanted.includes(value));
-          });
+    if (hasAllRows) {
+      if (appliedSearch) {
+        rows = rows.filter(
+          (row) => includesLooseSearch(
+            Object.values(row).filter((v) => typeof v === "string" || typeof v === "number").join(" "),
+            appliedSearch
+          )
+        );
+      }
+      for (const { key, values } of activeFilters) {
+        rows = rows.filter((row) => values.includes(String(cell(row, key))));
+      }
+      for (const field of advancedSearchFields) {
+        if (field.type === "select") {
+          const wanted = splitMultiValue(advancedValues[field.key] ?? "");
+          if (wanted.length > 0) rows = rows.filter((row) => wanted.includes(String(cell(row, field.key))));
+        } else if (field.type === "cascading") {
+          const wanted = splitMultiValue(advancedValues[field.key] ?? "");
+          if (wanted.length > 0) {
+            const lineages = cascadingValuePaths(field.options);
+            rows = rows.filter((row) => {
+              const own = String(cell(row, field.key));
+              const lineage = lineages.get(own) ?? [own];
+              return lineage.some((value) => wanted.includes(value));
+            });
+          }
+        } else if (field.type === "dateRange") {
+          const from = advancedValues[field.fromKey ?? `${field.key}From`];
+          const to = advancedValues[field.toKey ?? `${field.key}To`];
+          const datePart = (v) => String(v ?? "").slice(0, 10);
+          if (from) rows = rows.filter((row) => datePart(cell(row, field.key)) >= from.slice(0, 10));
+          if (to) rows = rows.filter((row) => datePart(cell(row, field.key)) <= to.slice(0, 10));
+        } else if (field.type === "numberRange") {
+          const min = numericValue(advancedValues[field.fromKey ?? `${field.key}Min`]);
+          const max = numericValue(advancedValues[field.toKey ?? `${field.key}Max`]);
+          if (min !== null) rows = rows.filter((row) => (numericValue(cell(row, field.key)) ?? -Infinity) >= min);
+          if (max !== null) rows = rows.filter((row) => (numericValue(cell(row, field.key)) ?? Infinity) <= max);
+        } else {
+          const keyword = advancedValues[field.key];
+          const baseKey = field.key.endsWith("Contains") ? field.key.slice(0, -"Contains".length) : field.key;
+          if (keyword) rows = rows.filter((row) => includesLooseSearch(String(cell(row, baseKey) ?? ""), keyword));
         }
-      } else if (field.type === "dateRange") {
-        const from = advancedValues[field.fromKey ?? `${field.key}From`];
-        const to = advancedValues[field.toKey ?? `${field.key}To`];
-        if (from) rows = rows.filter((row) => String(cell(row, field.key) ?? "") >= from);
-        if (to) rows = rows.filter((row) => String(cell(row, field.key) ?? "") <= to);
-      } else if (field.type === "numberRange") {
-        const min = numericValue(advancedValues[field.fromKey ?? `${field.key}Min`]);
-        const max = numericValue(advancedValues[field.toKey ?? `${field.key}Max`]);
-        if (min !== null) rows = rows.filter((row) => (numericValue(cell(row, field.key)) ?? -Infinity) >= min);
-        if (max !== null) rows = rows.filter((row) => (numericValue(cell(row, field.key)) ?? Infinity) <= max);
-      } else {
-        const keyword = advancedValues[field.key];
-        if (keyword) rows = rows.filter((row) => includesLooseSearch(String(cell(row, field.key) ?? ""), keyword));
       }
     }
     if (sort) {
@@ -746,8 +751,8 @@ function SearchResults({
       });
     }
     return rows;
-  }, [item.data, appliedSearch, activeFilters, advancedSearchFields, advancedValues, sort, columns]);
-  const clientPaginated = item.data.length >= item.total;
+  }, [item.data, hasAllRows, appliedSearch, activeFilters, advancedSearchFields, advancedValues, sort, columns]);
+  const clientPaginated = hasAllRows;
   const totalCount = clientPaginated ? processed.length : item.total;
   const pageCount = Math.max(1, Math.ceil(totalCount / pageSize));
   const safePage = Math.min(Math.max(1, page), pageCount);
@@ -1808,8 +1813,11 @@ function validatePageData(data, issues) {
     if (raw.select !== void 0 && typeof raw.select !== "string") {
       issues.push({ path: `${path}.select`, message: "select\uB294 \uBB38\uC790\uC5F4 \uACBD\uB85C\uC5EC\uC57C \uD569\uB2C8\uB2E4" });
     }
+    if (raw.debounceMs !== void 0 && typeof raw.debounceMs !== "number") {
+      issues.push({ path: `${path}.debounceMs`, message: "debounceMs\uB294 \uC22B\uC790(ms)\uC5EC\uC57C \uD569\uB2C8\uB2E4" });
+    }
     for (const [k, v] of Object.entries(raw)) {
-      if (k === "endpoint" || k === "select") continue;
+      if (k === "endpoint" || k === "select" || k === "debounceMs") continue;
       if (k !== "when" && k !== "fallback") {
         issues.push({ path: `${path}.${k}`, message: `\uC54C \uC218 \uC5C6\uB294 \uD56D\uBAA9: ${k}` });
         continue;
@@ -1960,12 +1968,14 @@ function planPageData(data, resolve) {
     const resolved = resolve(query.endpoint);
     const endpoint = typeof resolved === "string" ? resolved.trim() : "";
     const enabled = "when" in query ? Boolean(resolve(query.when)) : true;
+    const debounceMs = typeof query.debounceMs === "number" && Number.isFinite(query.debounceMs) && query.debounceMs > 0 ? query.debounceMs : void 0;
     plans.push({
       key,
       endpoint,
       enabled,
       select: typeof query.select === "string" ? query.select : void 0,
-      fallback: query.fallback
+      fallback: query.fallback,
+      debounceMs
     });
   }
   return plans;
@@ -2185,6 +2195,8 @@ function SduiNodeRenderer({
       props[name] = (arg) => actions.forEach(
         (a) => dispatch(resolveValue(a, scope), arg)
       );
+    } else if (name === "rowClick" && (isAction(raw) || isActionList(raw))) {
+      props[name] = raw;
     } else {
       let resolved = resolveValue(raw, scope);
       if (resolved === null) {
@@ -2456,12 +2468,18 @@ function SduiRenderer({
     if (runnable.length === 0) return;
     const controller = new AbortController();
     let cancelled = false;
+    const timers = [];
     setEntries(
       Object.fromEntries(runnable.map((plan) => [`${plan.key}.$loading`, true]))
     );
+    const afterDebounce = (plan) => plan.debounceMs === void 0 ? Promise.resolve() : new Promise((resolveWait) => {
+      timers.push(setTimeout(resolveWait, plan.debounceMs));
+    });
     void Promise.all(
       runnable.map(async (plan) => {
         try {
+          await afterDebounce(plan);
+          if (cancelled) return;
           const response = await hostRef.current.fetch(plan.endpoint, {
             method: "GET",
             signal: controller.signal
@@ -2494,12 +2512,17 @@ function SduiRenderer({
     return () => {
       cancelled = true;
       controller.abort();
+      timers.forEach(clearTimeout);
     };
   }, [dataPlanKey, dataEpochKey, setEntries]);
   const dispatchRef = useRef(() => {
   });
   const dispatch = useCallback(
-    (action, arg) => {
+    (rawAction, arg) => {
+      const action = resolveValue(
+        rawAction,
+        EMPTY_SCOPE
+      );
       switch (action.action) {
         case "navigate":
           if (!isSafeNavigationTarget(action.to)) {
@@ -2668,7 +2691,7 @@ function SduiRenderer({
           break;
       }
     },
-    [pushToast, onCustomAction, customValidators, setEntries]
+    [pushToast, onCustomAction, customValidators, setEntries, resolveValue]
   );
   dispatchRef.current = dispatch;
   const engine = useMemo(

package/dist/meta.d.ts

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

package/dist/meta.js

@@ -3308,6 +3308,15 @@ var JsonFieldMeta = {
     { name: "rows", kind: "number", label: "\uC904 \uC218", default: 6, group: "appearance" },
     { name: "placeholder", kind: "string", label: "\uC548\uB0B4 \uBB38\uAD6C", default: "JSON\uC744 \uC785\uB825\uD558\uC138\uC694", group: "content" },
     { name: "invalid", kind: "boolean", label: "\uC624\uB958 \uD45C\uC2DC", default: false, bindable: true, group: "validation" },
+    {
+      name: "emptyAsNull",
+      kind: "boolean",
+      label: "\uBE44\uC6B0\uBA74 null \uC800\uC7A5",
+      default: false,
+      description: "\uBE48 \uD14D\uC2A4\uD2B8\uB85C blur \uD558\uBA74 onChange(null) \u2014 \uC9C0\uC6CC\uC11C \uAC12\uC744 \uC0AD\uC81C\uD558\uB294 \uD3FC\uC5D0\uC11C \uCF20\uB2E4.",
+      group: "behavior",
+      advanced: true
+    },
     { name: "disabled", kind: "boolean", label: "\uBE44\uD65C\uC131", default: false, bindable: true, group: "behavior" }
   ],
   children: { accepts: false },

package/dist/{types-Dl4rPyan.d.ts → types-DO8_hC6A.d.ts}

@@ -216,6 +216,12 @@ interface SduiPageQuery {
     when?: SduiPropValue;
     /** 실패했거나 아직 조회 전일 때 상태에 들어갈 값. 생략하면 `undefined`. */
     fallback?: SduiPropValue;
+    /**
+     * 경로가 바뀐 뒤 이 시간(ms)만큼 조용해야 조회를 낸다. 경로가 입력값을 참조하는
+     * 조회(관리번호 실시간 검증 등)가 키 입력마다 GET 을 내는 것을 막는 자리다 —
+     * v2 는 400ms 를 썼다. 생략하면 즉시.
+     */
+    debounceMs?: number;
 }
 interface SduiPage {
     version: 1;

package/dist/widgets/JsonField.d.ts

@@ -14,6 +14,13 @@ interface JsonFieldProps {
     /** 객체 또는 JSON 문자열 */
     value?: unknown;
     onChange?: (parsed: unknown) => void;
+    /**
+     * 빈 텍스트로 blur 하면 onChange(null) 을 낸다 — "지워서 값 삭제"용.
+     * 기본은 종전대로 무동작이다: 빈 칸이 곧 null 저장이 되면, 잠깐 지우고 다시 쓰려던
+     * 사용자의 미완성 상태가 그대로 저장 후보가 되기 때문에 옵트인으로 둔다.
+     * (ERP 유닛 수정의 '옵션 비우기 (null 저장)' 버튼이 이 옵션으로 대체된다.)
+     */
+    emptyAsNull?: boolean;
     /** 기본 6 */
     rows?: number;
     invalid?: boolean;

package/dist/widgets/JsonField.js

@@ -1,3 +1,3 @@
-export { JsonField } from '../chunk-JONNWN6N.js';
+export { JsonField } from '../chunk-FDVI3PWQ.js';
 import '../chunk-B5JTXYDB.js';
 import '../chunk-SAN4IX6N.js';

package/dist/widgets/index.js

@@ -22,8 +22,8 @@ import { ImageLightbox } from '../chunk-3PYMVHL3.js';
 export { ImageLightbox } from '../chunk-3PYMVHL3.js';
 import { InlineEdit } from '../chunk-7AHNAX6T.js';
 export { InlineEdit } from '../chunk-7AHNAX6T.js';
-import { JsonField } from '../chunk-JONNWN6N.js';
-export { JsonField } from '../chunk-JONNWN6N.js';
+import { JsonField } from '../chunk-FDVI3PWQ.js';
+export { JsonField } from '../chunk-FDVI3PWQ.js';
 import { LiveClock } from '../chunk-Z3WGIFJP.js';
 export { LiveClock } from '../chunk-Z3WGIFJP.js';
 import { OrgChart } from '../chunk-BT4HC3WR.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wipco/sdui",
-  "version": "0.9.0",
+  "version": "0.10.0",
   "description": "WIPCO 서버 주도 UI(SDUI) 렌더러 — JSON 페이지 스펙을 React 컴포넌트로 렌더링",
   "keywords": [
     "sdui",