@ncds/ui-admin 1.8.0 → 1.8.2

package/dist/cjs/src/components/badge/index.js

@@ -13,4 +13,15 @@ Object.keys(_Badge).forEach(function (key) {
       return _Badge[key];
     }
   });
+});
+var _utils = require("./utils");
+Object.keys(_utils).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _utils[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _utils[key];
+    }
+  });
 });

package/dist/cjs/src/components/combo-box/ComboBox.js

@@ -147,6 +147,7 @@ const ComboBox = exports.ComboBox = /*#__PURE__*/(0, _react.forwardRef)((_ref, r
   (0, _react.useImperativeHandle)(ref, () => internalRef.current, []);
   const trailingElement = {
     type: 'custom',
+    placement: 'inside',
     children: (0, _jsxRuntime.jsx)("div", {
       className: "ncua-input__icon-wrap ncua-input__right-icon",
       onClick: showAllItem,

package/dist/cjs/src/components/date-picker/index.js

@@ -14,6 +14,17 @@ Object.keys(_DatePicker).forEach(function (key) {
     }
   });
 });
+var _CustomInput = require("./CustomInput");
+Object.keys(_CustomInput).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _CustomInput[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _CustomInput[key];
+    }
+  });
+});
 var _utils = require("./utils");
 Object.keys(_utils).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/dist/cjs/src/components/image-file-input/components/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _ImagePreview = require("./ImagePreview");
+Object.keys(_ImagePreview).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ImagePreview[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _ImagePreview[key];
+    }
+  });
+});

package/dist/cjs/src/components/image-file-input/index.js

@@ -13,4 +13,15 @@ Object.keys(_ImageFileInput).forEach(function (key) {
       return _ImageFileInput[key];
     }
   });
+});
+var _components = require("./components");
+Object.keys(_components).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _components[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _components[key];
+    }
+  });
 });

package/dist/cjs/src/components/progress-bar/components/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _SegmentBar = require("./SegmentBar");
+Object.keys(_SegmentBar).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _SegmentBar[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _SegmentBar[key];
+    }
+  });
+});
+var _SegmentLabels = require("./SegmentLabels");
+Object.keys(_SegmentLabels).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _SegmentLabels[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _SegmentLabels[key];
+    }
+  });
+});

package/dist/cjs/src/components/progress-bar/hooks/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _useProgressBar = require("./useProgressBar");
+Object.keys(_useProgressBar).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _useProgressBar[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _useProgressBar[key];
+    }
+  });
+});

package/dist/cjs/src/components/progress-bar/index.js

@@ -14,6 +14,28 @@ Object.keys(_ProgressBar).forEach(function (key) {
     }
   });
 });
+var _components = require("./components");
+Object.keys(_components).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _components[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _components[key];
+    }
+  });
+});
+var _hooks = require("./hooks");
+Object.keys(_hooks).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _hooks[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _hooks[key];
+    }
+  });
+});
 var _types = require("./types");
 Object.keys(_types).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -24,4 +46,15 @@ Object.keys(_types).forEach(function (key) {
       return _types[key];
     }
   });
+});
+var _utils = require("./utils");
+Object.keys(_utils).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _utils[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _utils[key];
+    }
+  });
 });

package/dist/cjs/src/components/select/Select.js

@@ -43,7 +43,6 @@ const Select = exports.Select = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref)
         ...props,
         children: [placeholder && (0, _jsxRuntime.jsx)("option", {
           value: "",
-          selected: true,
           disabled: disabledPlaceholder,
           children: placeholder
         }), optionItems?.map(item => (0, _jsxRuntime.jsx)("option", {

package/dist/cjs/src/components/select-dropdown/index.js

@@ -3,10 +3,14 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "SelectDropdown", {
-  enumerable: true,
-  get: function () {
-    return _SelectDropdown.SelectDropdown;
-  }
-});
-var _SelectDropdown = require("./SelectDropdown");
+var _SelectDropdown = require("./SelectDropdown");
+Object.keys(_SelectDropdown).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _SelectDropdown[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _SelectDropdown[key];
+    }
+  });
+});

package/dist/cjs/src/components/switch/index.js

@@ -3,10 +3,14 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "Switch", {
-  enumerable: true,
-  get: function () {
-    return _Switch.Switch;
-  }
-});
-var _Switch = require("./Switch");
+var _Switch = require("./Switch");
+Object.keys(_Switch).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Switch[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Switch[key];
+    }
+  });
+});

package/dist/cjs/src/components/table/Table.js

@@ -10,6 +10,11 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _react = require("react");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 // ──────────────────────────────────────────────
+// $table-header-height 와 동기화 — sticky thead가 차지하는 높이를 maxHeight에 보상
+const TABLE_HEADER_HEIGHT = 40;
+// 스크롤바 트랙 상하 여백 합계 (top 8px + bottom 8px) — SCSS &--fixed-header &__scrollbar 오프셋과 동기화
+const SCROLLBAR_TRACK_OFFSET = 16;
+const SCROLLBAR_THUMB_MIN_HEIGHT = 40;
 // Sort Icons (@ncds/ui-admin-icon)
 // ──────────────────────────────────────────────
 const SORT_ICONS = {
@@ -111,8 +116,18 @@ const Cell = /*#__PURE__*/(0, _react.forwardRef)((_ref5, ref) => {
   let {
     children,
     className,
+    isHeader,
     ...rest
   } = _ref5;
+  if (isHeader) {
+    return (0, _jsxRuntime.jsx)("th", {
+      ref: ref,
+      scope: "row",
+      className: (0, _classnames.default)('ncua-table__cell', className),
+      ...rest,
+      children: children
+    });
+  }
   return (0, _jsxRuntime.jsx)("td", {
     ref: ref,
     className: (0, _classnames.default)('ncua-table__cell', className),
@@ -153,14 +168,13 @@ const ColGroup = _ref8 => {
     return width;
   };
   return (0, _jsxRuntime.jsx)("colgroup", {
-    children: widths.map((width, index) => {
-      const duplicateCount = widths.slice(0, index).filter(v => v === width).length;
-      return (0, _jsxRuntime.jsx)("col", {
-        style: {
-          width: resolveColWidth(width)
-        }
-      }, `col-${width}-${duplicateCount}`);
-    })
+    children: widths.map((width, index) =>
+    // biome-ignore lint/suspicious/noArrayIndexKey: colgroup columns never reorder or change
+    (0, _jsxRuntime.jsx)("col", {
+      style: {
+        width: resolveColWidth(width)
+      }
+    }, index))
   });
 };
 ColGroup.displayName = 'Table.ColGroup';
@@ -189,12 +203,18 @@ const categorizeChild = (child, result) => {
     result.footerContent.push(child);
   } else if (child.type === Pagination) {
     result.paginationContent.push(child);
+  } else if (child.type === Header) {
+    result.headerContent.push(child);
+  } else if (child.type === ColGroup) {
+    result.colGroupContent.push(child);
   } else {
     result.tableContent.push(child);
   }
 };
 const sortChildren = children => {
   const result = {
+    headerContent: [],
+    colGroupContent: [],
     tableContent: [],
     footerContent: [],
     paginationContent: []
@@ -226,17 +246,113 @@ const TableComponent = /*#__PURE__*/(0, _react.forwardRef)((_ref0, ref) => {
     'ncua-table--selectable': selectable
   });
   const {
+    headerContent,
+    colGroupContent,
     tableContent,
     footerContent,
     paginationContent
   } = sortChildren(children);
   const scrollStyle = fixedHeader && maxHeight ? {
-    maxHeight: typeof maxHeight === 'number' ? `${maxHeight}px` : maxHeight
+    maxHeight: typeof maxHeight === 'number' ? `${maxHeight + TABLE_HEADER_HEIGHT}px` : `calc(${maxHeight} + ${TABLE_HEADER_HEIGHT}px)`
   } : undefined;
-  const tableElement = (0, _jsxRuntime.jsx)("table", {
+  // Custom scrollbar refs (used only in fixed-header mode)
+  const scrollContainerRef = (0, _react.useRef)(null);
+  const scrollAreaRef = (0, _react.useRef)(null);
+  const thumbRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(() => {
+    if (!fixedHeader || !maxHeight) return;
+    const scrollEl = scrollContainerRef.current;
+    const thumbEl = thumbRef.current;
+    if (!scrollEl || !thumbEl) return;
+    const update = () => {
+      const {
+        scrollTop,
+        scrollHeight,
+        clientHeight
+      } = scrollEl;
+      if (scrollHeight <= clientHeight) {
+        thumbEl.style.height = '0';
+        return;
+      }
+      const trackHeight = (scrollAreaRef.current?.clientHeight ?? clientHeight) - TABLE_HEADER_HEIGHT - SCROLLBAR_TRACK_OFFSET;
+      const thumbHeight = Math.max(SCROLLBAR_THUMB_MIN_HEIGHT, clientHeight / scrollHeight * trackHeight);
+      const thumbTop = scrollTop / (scrollHeight - clientHeight) * (trackHeight - thumbHeight);
+      thumbEl.style.height = `${thumbHeight}px`;
+      thumbEl.style.transform = `translateY(${thumbTop}px)`;
+    };
+    scrollEl.addEventListener('scroll', update, {
+      passive: true
+    });
+    const observer = new ResizeObserver(update);
+    observer.observe(scrollEl);
+    update();
+    return () => {
+      scrollEl.removeEventListener('scroll', update);
+      observer.disconnect();
+    };
+  }, [fixedHeader, maxHeight]);
+  const handleThumbMouseDown = e => {
+    e.preventDefault();
+    const scrollEl = scrollContainerRef.current;
+    const thumbEl = thumbRef.current;
+    const areaEl = scrollAreaRef.current;
+    if (!scrollEl || !thumbEl) return;
+    areaEl?.setAttribute('data-dragging', '');
+    const startY = e.clientY;
+    const startScrollTop = scrollEl.scrollTop;
+    const {
+      scrollHeight,
+      clientHeight
+    } = scrollEl;
+    const thumbHeight = thumbEl.offsetHeight;
+    const scrollRatio = (scrollHeight - clientHeight) / (clientHeight - thumbHeight);
+    const onMove = ev => {
+      scrollEl.scrollTop = startScrollTop + (ev.clientY - startY) * scrollRatio;
+    };
+    const onUp = () => {
+      areaEl?.removeAttribute('data-dragging');
+      document.removeEventListener('mousemove', onMove);
+      document.removeEventListener('mouseup', onUp);
+    };
+    document.addEventListener('mousemove', onMove);
+    document.addEventListener('mouseup', onUp);
+  };
+  if (fixedHeader && maxHeight) {
+    return (0, _jsxRuntime.jsxs)("div", {
+      ref: ref,
+      className: "ncua-table-wrapper",
+      children: [(0, _jsxRuntime.jsxs)("div", {
+        className: tableClasses,
+        ...rest,
+        children: [(0, _jsxRuntime.jsxs)("div", {
+          ref: scrollAreaRef,
+          className: "ncua-table__scroll-area",
+          children: [(0, _jsxRuntime.jsx)("div", {
+            ref: scrollContainerRef,
+            className: "ncua-table__scroll-container",
+            style: scrollStyle,
+            children: (0, _jsxRuntime.jsxs)("table", {
+              className: "ncua-table__table",
+              role: "table",
+              children: [colGroupContent, headerContent, tableContent]
+            })
+          }), (0, _jsxRuntime.jsx)("div", {
+            className: "ncua-table__scrollbar",
+            "aria-hidden": "true",
+            children: (0, _jsxRuntime.jsx)("div", {
+              ref: thumbRef,
+              className: "ncua-table__scrollbar-thumb",
+              onMouseDown: handleThumbMouseDown
+            })
+          })]
+        }), footerContent]
+      }), paginationContent]
+    });
+  }
+  const tableElement = (0, _jsxRuntime.jsxs)("table", {
     className: "ncua-table__table",
     role: "table",
-    children: tableContent
+    children: [colGroupContent, headerContent, tableContent]
   });
   return (0, _jsxRuntime.jsxs)("div", {
     ref: ref,
@@ -244,11 +360,7 @@ const TableComponent = /*#__PURE__*/(0, _react.forwardRef)((_ref0, ref) => {
     children: [(0, _jsxRuntime.jsxs)("div", {
       className: tableClasses,
       ...rest,
-      children: [fixedHeader && maxHeight ? (0, _jsxRuntime.jsx)("div", {
-        className: "ncua-table__scroll-container",
-        style: scrollStyle,
-        children: tableElement
-      }) : tableElement, footerContent]
+      children: [tableElement, footerContent]
     }), paginationContent]
   });
 });