@ncds/ui-admin 1.7.0 → 1.8.0

package/dist/cjs/src/components/file-input/FileInput.js

@@ -12,183 +12,140 @@ var _button = require("../button");
 var _shared = require("../shared");
 var _Tag = require("../tag/Tag");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-var __assign = void 0 && (void 0).__assign || function () {
-  __assign = Object.assign || function (t) {
-    for (var s, i = 1, n = arguments.length; i < n; i++) {
-      s = arguments[i];
-      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-    }
-    return t;
-  };
-  return __assign.apply(this, arguments);
-};
-var __rest = void 0 && (void 0).__rest || function (s, e) {
-  var t = {};
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
-  }
-  return t;
-};
-var __spreadArray = void 0 && (void 0).__spreadArray || function (to, from, pack) {
-  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-    if (ar || !(i in from)) {
-      if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-      ar[i] = from[i];
-    }
-  }
-  return to.concat(ar || Array.prototype.slice.call(from));
-};
 var FileInputErrorType;
 (function (FileInputErrorType) {
   FileInputErrorType["ALREADY_UPLOADED"] = "ALREADY_UPLOADED";
   FileInputErrorType["EXCEED_MAX_FILE_SIZE"] = "EXCEED_MAX_FILE_SIZE";
   FileInputErrorType["EXCEED_MAX_FILE_COUNT"] = "EXCEED_MAX_FILE_COUNT";
 })(FileInputErrorType || (exports.FileInputErrorType = FileInputErrorType = {}));
-var FileInput = exports.FileInput = /*#__PURE__*/(0, _react.forwardRef)(function (_a, _ref) {
-  var _b = _a.size,
-    size = _b === void 0 ? 'xs' : _b,
-    accept = _a.accept,
-    _c = _a.multiple,
-    multiple = _c === void 0 ? false : _c,
-    maxFileSize = _a.maxFileSize,
-    maxFileCount = _a.maxFileCount,
-    value = _a.value,
-    onChange = _a.onChange,
-    onFileSelect = _a.onFileSelect,
-    onFail = _a.onFail,
-    _d = _a.buttonLabel,
-    buttonLabel = _d === void 0 ? '파일 찾기' : _d,
-    disabled = _a.disabled,
-    label = _a.label,
-    hintItems = _a.hintItems,
-    validation = _a.validation,
-    destructive = _a.destructive,
-    isRequired = _a.isRequired,
-    showHelpIcon = _a.showHelpIcon,
-    hintText = _a.hintText,
-    props = __rest(_a, ["size", "accept", "multiple", "maxFileSize", "maxFileCount", "value", "onChange", "onFileSelect", "onFail", "buttonLabel", "disabled", "label", "hintItems", "validation", "destructive", "isRequired", "showHelpIcon", "hintText"]);
-  var fileInputRef = (0, _react.useRef)(null);
-  var _e = (0, _react.useState)([]),
-    internalFiles = _e[0],
-    setInternalFiles = _e[1];
+const FileInput = exports.FileInput = /*#__PURE__*/(0, _react.forwardRef)((_ref2, _ref) => {
+  let {
+    size = 'xs',
+    accept,
+    multiple = false,
+    maxFileSize,
+    maxFileCount,
+    value,
+    onChange,
+    onFileSelect,
+    onFail,
+    buttonLabel = '파일 찾기',
+    disabled,
+    label,
+    hintItems,
+    validation,
+    destructive,
+    isRequired,
+    showHelpIcon,
+    hintText,
+    ...props
+  } = _ref2;
+  const fileInputRef = (0, _react.useRef)(null);
+  const [internalFiles, setInternalFiles] = (0, _react.useState)([]);
   // Determine if component is controlled or uncontrolled
-  var isControlled = value !== undefined;
-  var files = isControlled ? value : internalFiles;
+  const isControlled = value !== undefined;
+  const files = isControlled ? value : internalFiles;
   // Sync internal state with controlled value
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     if (isControlled && value) {
       setInternalFiles(value);
     }
   }, [isControlled, value]);
-  var updateFiles = function (newFiles) {
+  const updateFiles = newFiles => {
     if (isControlled) {
-      onChange === null || onChange === void 0 ? void 0 : onChange(newFiles);
+      onChange?.(newFiles);
     } else {
       setInternalFiles(newFiles);
-      onFileSelect === null || onFileSelect === void 0 ? void 0 : onFileSelect(newFiles);
+      onFileSelect?.(newFiles);
     }
   };
-  var handleFileChange = function (event) {
-    var selectedFiles = event.target.files;
+  const handleFileChange = event => {
+    const selectedFiles = event.target.files;
     if (!selectedFiles || selectedFiles.length === 0) return;
-    var _a = validateFiles(Array.from(selectedFiles)),
-      validFiles = _a.validFiles,
-      invalidFiles = _a.invalidFiles;
-    var nextFiles = __spreadArray(__spreadArray([], files, true), validFiles, true);
+    const {
+      validFiles,
+      invalidFiles
+    } = validateFiles(Array.from(selectedFiles));
+    const nextFiles = [...files, ...validFiles];
     updateFiles(nextFiles);
     if (onFail && invalidFiles.length > 0) {
       onFail(invalidFiles);
     }
   };
-  var validateFiles = function (fileList) {
-    var validFiles = [];
-    var invalidFiles = [];
-    var _loop_1 = function (file) {
-      if (files.some(function (f) {
-        return f.name === file.name && f.size === file.size;
-      })) {
-        invalidFiles.push(__assign(__assign({}, file), {
+  const validateFiles = fileList => {
+    const validFiles = [];
+    const invalidFiles = [];
+    for (const file of fileList) {
+      if (files.some(f => f.name === file.name && f.size === file.size)) {
+        invalidFiles.push({
+          ...file,
           errorType: FileInputErrorType.ALREADY_UPLOADED
-        }));
-        return "continue";
+        });
+        continue;
       }
       if (!!maxFileSize && file.size > maxFileSize) {
-        invalidFiles.push(__assign(__assign({}, file), {
+        invalidFiles.push({
+          ...file,
           errorType: FileInputErrorType.EXCEED_MAX_FILE_SIZE
-        }));
-        return "continue";
+        });
+        continue;
       }
       if (!!maxFileCount && files.length + validFiles.length >= maxFileCount) {
-        invalidFiles.push(__assign(__assign({}, file), {
+        invalidFiles.push({
+          ...file,
           errorType: FileInputErrorType.EXCEED_MAX_FILE_COUNT
-        }));
-        return "continue";
+        });
+        continue;
       }
       validFiles.push(file);
-    };
-    for (var _i = 0, fileList_1 = fileList; _i < fileList_1.length; _i++) {
-      var file = fileList_1[_i];
-      _loop_1(file);
     }
     return {
-      validFiles: validFiles,
-      invalidFiles: invalidFiles
+      validFiles,
+      invalidFiles
     };
   };
-  var handleBrowseClick = function () {
+  const handleBrowseClick = () => {
     if (fileInputRef.current && !disabled) {
       fileInputRef.current.click();
     }
   };
-  var handleRemoveFile = function (index) {
-    var newFiles = __spreadArray([], files, true);
+  const handleRemoveFile = index => {
+    const newFiles = [...files];
     newFiles.splice(index, 1);
     updateFiles(newFiles);
   };
-  var renderFileTagList = function () {
+  const renderFileTagList = () => {
     if (files.length === 0) return null;
-    return (0, _jsxRuntime.jsx)("div", __assign({
-      className: "ncua-file-input__file-tags"
-    }, {
-      children: files.map(function (file, index) {
-        return (0, _jsxRuntime.jsxs)("div", __assign({
-          className: "ncua-file-input__file-tag-container"
-        }, {
-          children: [(0, _jsxRuntime.jsx)(_Tag.Tag, {
-            text: file.name,
-            size: size === 'xs' ? 'sm' : 'md',
-            close: true,
-            onButtonClick: function () {
-              return handleRemoveFile(index);
-            }
-          }), file.type.startsWith('image/') && (0, _jsxRuntime.jsx)("img", {
-            className: "ncua-file-input__file-image",
-            src: URL.createObjectURL(file),
-            alt: file.name
-          })]
-        }), "".concat(file.name, "-").concat(index));
-      })
-    }));
+    return (0, _jsxRuntime.jsx)("div", {
+      className: "ncua-file-input__file-tags",
+      children: files.map((file, index) => (0, _jsxRuntime.jsxs)("div", {
+        className: "ncua-file-input__file-tag-container",
+        children: [(0, _jsxRuntime.jsx)(_Tag.Tag, {
+          text: file.name,
+          size: size === 'xs' ? 'sm' : 'md',
+          close: true,
+          onButtonClick: () => handleRemoveFile(index)
+        }), file.type.startsWith('image/') && (0, _jsxRuntime.jsx)("img", {
+          className: "ncua-file-input__file-image",
+          src: URL.createObjectURL(file),
+          alt: file.name
+        })]
+      }, `${file.name}-${index}`))
+    });
   };
-  var renderHintList = function () {
+  const renderHintList = () => {
     if (!hintItems || hintItems.length === 0) return null;
-    return (0, _jsxRuntime.jsx)("ul", __assign({
-      className: "ncua-file-input__hint-list"
-    }, {
-      children: hintItems.map(function (hint) {
-        return (0, _jsxRuntime.jsx)("li", __assign({
-          className: "ncua-file-input__hint-item"
-        }, {
-          children: hint
-        }), hint);
-      })
-    }));
+    return (0, _jsxRuntime.jsx)("ul", {
+      className: "ncua-file-input__hint-list",
+      children: hintItems.map(hint => (0, _jsxRuntime.jsx)("li", {
+        className: "ncua-file-input__hint-item",
+        children: hint
+      }, hint))
+    });
   };
-  return (0, _jsxRuntime.jsxs)("div", __assign({
-    className: (0, _classnames.default)('ncua-file-input', "ncua-file-input--".concat(size))
-  }, {
-    children: [(0, _jsxRuntime.jsx)("input", __assign({
+  return (0, _jsxRuntime.jsxs)("div", {
+    className: (0, _classnames.default)('ncua-file-input', `ncua-file-input--${size}`),
+    children: [(0, _jsxRuntime.jsx)("input", {
       hidden: true,
       ref: fileInputRef,
       type: "file",
@@ -196,21 +153,19 @@ var FileInput = exports.FileInput = /*#__PURE__*/(0, _react.forwardRef)(function
       multiple: multiple,
       onChange: handleFileChange,
       tabIndex: -1,
-      "aria-hidden": "true"
-    }, props)), (0, _jsxRuntime.jsxs)("div", __assign({
-      className: "ncua-file-input__input-container"
-    }, {
-      children: [(0, _jsxRuntime.jsxs)("div", __assign({
-        className: "ncua-file-input__label"
-      }, {
-        children: [(0, _jsxRuntime.jsx)(_shared.Label, __assign({
-          isRequired: isRequired
-        }, {
+      "aria-hidden": "true",
+      ...props
+    }), (0, _jsxRuntime.jsxs)("div", {
+      className: "ncua-file-input__input-container",
+      children: [(0, _jsxRuntime.jsxs)("div", {
+        className: "ncua-file-input__label",
+        children: [(0, _jsxRuntime.jsx)(_shared.Label, {
+          isRequired: isRequired,
           children: label
-        })), showHelpIcon && (0, _jsxRuntime.jsx)(_uiAdminIcon.HelpCircle, {
+        }), showHelpIcon && (0, _jsxRuntime.jsx)(_uiAdminIcon.HelpCircle, {
           className: "ncua-input__help-icon"
         })]
-      })), (0, _jsxRuntime.jsx)(_button.Button, {
+      }), (0, _jsxRuntime.jsx)(_button.Button, {
         size: size,
         onClick: handleBrowseClick,
         disabled: disabled,
@@ -219,11 +174,10 @@ var FileInput = exports.FileInput = /*#__PURE__*/(0, _react.forwardRef)(function
           icon: _uiAdminIcon.Upload01
         },
         label: buttonLabel
-      }), hintText && (0, _jsxRuntime.jsx)(_shared.HintText, __assign({
-        destructive: destructive
-      }, {
+      }), hintText && (0, _jsxRuntime.jsx)(_shared.HintText, {
+        destructive: destructive,
         children: hintText
-      }))]
-    })), renderHintList(), renderFileTagList()]
-  }));
+      })]
+    }), renderHintList(), renderFileTagList()]
+  });
 });

package/dist/cjs/src/components/horizontal-tab/HorizontalTab.js

@@ -0,0 +1,53 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HorizontalTab = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _lodashEs = require("lodash-es");
+var _react = require("swiper/react");
+var _TabButton = require("../tab/TabButton");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const UNDERLINE_GAP = 16;
+const DEFAULT_GAP = 8;
+const HorizontalTab = _ref => {
+  let {
+    type = 'button-primary',
+    size = 'sm',
+    activeTab,
+    fullWidth = false,
+    menus = [],
+    className
+  } = _ref;
+  const getTabGap = type => {
+    const gap = {
+      underline: UNDERLINE_GAP
+    };
+    return gap[type] ?? DEFAULT_GAP;
+  };
+  if (!menus.length) return null;
+  return (0, _jsxRuntime.jsx)("div", {
+    className: (0, _classnames.default)('ncua-horizontal-tab', `ncua-horizontal-tab--${type}`, `ncua-horizontal-tab--${size}`, {
+      'full-width': fullWidth
+    }, className),
+    children: (0, _jsxRuntime.jsx)(_react.Swiper, {
+      slidesPerView: "auto",
+      spaceBetween: getTabGap(type),
+      children: menus.map(menu => {
+        const isActive = 'href' in menu && menu.href ? menu.href === activeTab : menu.id === activeTab;
+        return (0, _jsxRuntime.jsx)(_react.SwiperSlide, {
+          className: "ncua-horizontal-tab__item",
+          children: (0, _jsxRuntime.jsx)(_TabButton.TabButton, {
+            ...menu,
+            isActive: isActive,
+            tabButtonType: type,
+            size: size
+          })
+        }, (0, _lodashEs.uniqueId)('horizontal-tab'));
+      })
+    })
+  });
+};
+exports.HorizontalTab = HorizontalTab;

package/dist/cjs/src/components/horizontal-tab/index.js

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