@ncds/ui-admin 1.6.4 → 1.8.0

package/dist/cjs/assets/scripts/tooltip/const/icons.js

@@ -5,11 +5,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.SVG_ICONS = void 0;
 // SVG 아이콘들
-var SVG_ICONS = exports.SVG_ICONS = {
-  'help-circle-stroke': function (size) {
-    return "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"".concat(size, "\" height=\"").concat(size, "\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"none\">\n      <path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3m.08 4h.01M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10\"></path>\n    </svg>");
-  },
-  'help-circle-fill': function (size) {
-    return "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"".concat(size, "\" height=\"").concat(size, "\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"none\">\n      <path fill=\"currentColor\" fill-rule=\"evenodd\" d=\"M12 1C5.925 1 1 5.925 1 12s4.925 11 11 11 11-4.925 11-11S18.075 1 12 1m-1.093 7.271a2 2 0 0 1 3.013 1.727V10c0 .47-.365.958-1.055 1.418a6 6 0 0 1-1.262.634 1 1 0 0 0 .633 1.897l.169-.061a8.05 8.05 0 0 0 1.57-.806c.81-.54 1.944-1.55 1.945-3.081a4 4 0 0 0-7.773-1.333 1 1 0 0 0 1.886.664 2 2 0 0 1 .874-1.06M12 16a1 1 0 1 0 0 2h.01a1 1 0 0 0 0-2z\" clip-rule=\"evenodd\"></path>\n    </svg>");
-  }
+const SVG_ICONS = exports.SVG_ICONS = {
+  'help-circle-stroke': size => `<svg xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" fill="none" viewBox="0 0 24 24" stroke="none">
+      <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3m.08 4h.01M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10"></path>
+    </svg>`,
+  'help-circle-fill': size => `<svg xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" fill="none" viewBox="0 0 24 24" stroke="none">
+      <path fill="currentColor" fill-rule="evenodd" d="M12 1C5.925 1 1 5.925 1 12s4.925 11 11 11 11-4.925 11-11S18.075 1 12 1m-1.093 7.271a2 2 0 0 1 3.013 1.727V10c0 .47-.365.958-1.055 1.418a6 6 0 0 1-1.262.634 1 1 0 0 0 .633 1.897l.169-.061a8.05 8.05 0 0 0 1.57-.806c.81-.54 1.944-1.55 1.945-3.081a4 4 0 0 0-7.773-1.333 1 1 0 0 0 1.886.664 2 2 0 0 1 .874-1.06M12 16a1 1 0 1 0 0 2h.01a1 1 0 0 0 0-2z" clip-rule="evenodd"></path>
+    </svg>`
 };

package/dist/cjs/assets/scripts/tooltip/const/templates.js

@@ -9,41 +9,58 @@ var _constants = require("./constants");
  * 툴팁 관련 CSS 및 HTML 템플릿
  */
 // CSS 템플릿
-var CSS_TEMPLATES = exports.CSS_TEMPLATES = {
+const CSS_TEMPLATES = exports.CSS_TEMPLATES = {
   // 레이어 컨테이너 스타일 (클릭 통과)
-  LAYER_CONTAINER: function (zIndex) {
-    return "\n    position: fixed;\n    inset: 0;\n    pointer-events: none;\n    z-index: ".concat(zIndex, ";\n    display: block;\n  ");
-  },
+  LAYER_CONTAINER: zIndex => `
+    position: fixed;
+    inset: 0;
+    pointer-events: none;
+    z-index: ${zIndex};
+    display: block;
+  `,
   // 툴팁 패널 스타일 (클릭 허용)
-  TOOLTIP_PANEL: function (zIndex) {
-    return "\n    position: fixed;\n    left: ".concat(_constants.OFFSCREEN_POSITION, "; \n    top: ").concat(_constants.OFFSCREEN_POSITION, ";\n    opacity: 0;\n    transition: opacity ").concat(_constants.TRANSITION_DURATION, " ease;\n    pointer-events: auto;\n    z-index: ").concat(zIndex, ";\n    right: auto;\n    bottom: auto;\n    transform: none;\n  ");
-  },
+  TOOLTIP_PANEL: zIndex => `
+    position: fixed;
+    left: ${_constants.OFFSCREEN_POSITION}; 
+    top: ${_constants.OFFSCREEN_POSITION};
+    opacity: 0;
+    transition: opacity ${_constants.TRANSITION_DURATION} ease;
+    pointer-events: auto;
+    z-index: ${zIndex};
+    right: auto;
+    bottom: auto;
+    transform: none;
+  `,
   // 앵커 래퍼 스타일
-  ANCHOR_WRAPPER: "\n    display: inline-flex;\n    vertical-align: middle;\n    margin: 0 4px;\n  ",
+  ANCHOR_WRAPPER: `
+    display: inline-flex;
+    vertical-align: middle;
+    margin: 0 4px;
+  `,
   // Shadow DOM 기본 스타일
-  SHADOW_DOM_HOST: "\n    :host { \n      all: unset; \n      display: block; \n      font-family: system-ui; \n      color: black; \n    }\n  "
+  SHADOW_DOM_HOST: `
+    :host { 
+      all: unset; 
+      display: block; 
+      font-family: system-ui; 
+      color: black; 
+    }
+  `
 };
 // HTML 템플릿
-var HTML_TEMPLATES = exports.HTML_TEMPLATES = {
+const HTML_TEMPLATES = exports.HTML_TEMPLATES = {
   // 아이콘 래퍼
-  ICON_WRAPPER: function (className, iconSvg) {
-    return "<span class=\"".concat(className, "\">").concat(iconSvg, "</span>");
-  },
+  ICON_WRAPPER: (className, iconSvg) => `<span class="${className}">${iconSvg}</span>`,
   // 툴팁 제목
-  TOOLTIP_TITLE: function (className, title) {
-    return "<span class=\"".concat(className, "\">").concat(title, "</span>");
-  },
+  TOOLTIP_TITLE: (className, title) => `<span class="${className}">${title}</span>`,
   // 툴팁 콘텐츠 (일반)
-  TOOLTIP_CONTENT: function (className, content) {
-    return "<span class=\"".concat(className, "\">").concat(content, "</span>");
-  },
+  TOOLTIP_CONTENT: (className, content) => `<span class="${className}">${content}</span>`,
   // 툴팁 콘텐츠 (Shadow DOM)
-  TOOLTIP_CONTENT_SHADOW: function (className) {
-    return "<span class=\"".concat(className, "\" data-shadow-content></span>");
-  }
+  TOOLTIP_CONTENT_SHADOW: className => `<span class="${className}" data-shadow-content></span>`
 };
 // 폴백 아이콘 SVG
-var FALLBACK_ICON_SVG = function (size) {
-  return "<svg width=\"".concat(size, "\" height=\"").concat(size, "\" viewBox=\"0 0 16 16\" aria-hidden=\"true\">\n    <circle cx=\"8\" cy=\"8\" r=\"7\" stroke=\"currentColor\" fill=\"none\"/>\n    <text x=\"8\" y=\"11\" font-size=\"8\" text-anchor=\"middle\" fill=\"currentColor\">?</text>\n  </svg>");
-};
+const FALLBACK_ICON_SVG = size => `<svg width="${size}" height="${size}" viewBox="0 0 16 16" aria-hidden="true">
+    <circle cx="8" cy="8" r="7" stroke="currentColor" fill="none"/>
+    <text x="8" y="11" font-size="8" text-anchor="middle" fill="currentColor">?</text>
+  </svg>`;
 exports.FALLBACK_ICON_SVG = FALLBACK_ICON_SVG;

package/dist/cjs/assets/scripts/tooltip/utils.js

@@ -5,33 +5,32 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.calculateOptimalPosition = calculateOptimalPosition;
 var _const = require("./const");
-function calculateOptimalPosition(triggerElement, tooltipElement, preferredPosition) {
-  if (preferredPosition === void 0) {
-    preferredPosition = 'bottom';
-  }
-  var triggerRect = triggerElement.getBoundingClientRect();
-  var tooltipRect = tooltipElement.getBoundingClientRect();
-  var viewportWidth = window.innerWidth,
-    viewportHeight = window.innerHeight;
-  var spaces = {
+function calculateOptimalPosition(triggerElement, tooltipElement) {
+  let preferredPosition = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'bottom';
+  const triggerRect = triggerElement.getBoundingClientRect();
+  const tooltipRect = tooltipElement.getBoundingClientRect();
+  const {
+    innerWidth: viewportWidth,
+    innerHeight: viewportHeight
+  } = window;
+  const spaces = {
     top: triggerRect.top,
     bottom: viewportHeight - triggerRect.bottom,
     left: triggerRect.left,
     right: viewportWidth - triggerRect.right
   };
-  var tooltipWidth = tooltipRect.width || _const.DEFAULT_TOOLTIP_WIDTH;
-  var tooltipHeight = tooltipRect.height || _const.DEFAULT_TOOLTIP_HEIGHT;
-  for (var _i = 0, POSITION_PRIORITY_1 = _const.POSITION_PRIORITY; _i < POSITION_PRIORITY_1.length; _i++) {
-    var position = POSITION_PRIORITY_1[_i];
-    var hasSpace = position === 'bottom' || position === 'top' ? spaces[position] >= tooltipHeight + _const.MARGIN : spaces[position] >= tooltipWidth + _const.MARGIN;
+  const tooltipWidth = tooltipRect.width || _const.DEFAULT_TOOLTIP_WIDTH;
+  const tooltipHeight = tooltipRect.height || _const.DEFAULT_TOOLTIP_HEIGHT;
+  for (const position of _const.POSITION_PRIORITY) {
+    const hasSpace = position === 'bottom' || position === 'top' ? spaces[position] >= tooltipHeight + _const.MARGIN : spaces[position] >= tooltipWidth + _const.MARGIN;
     if (hasSpace) {
       if (position === 'bottom' || position === 'top') {
-        var centerX = triggerRect.left + triggerRect.width / 2;
-        var tooltipHalfWidth = tooltipWidth / 2;
+        const centerX = triggerRect.left + triggerRect.width / 2;
+        const tooltipHalfWidth = tooltipWidth / 2;
         if (centerX - tooltipHalfWidth < _const.MARGIN) {
-          return "".concat(position, "-left");
+          return `${position}-left`;
         } else if (centerX + tooltipHalfWidth > viewportWidth - _const.MARGIN) {
-          return "".concat(position, "-right");
+          return `${position}-right`;
         }
       }
       return position;

package/dist/cjs/assets/scripts/utils/debounce.js

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.debounce = debounce;
+/**
+ * 디바운스 유틸리티
+ * 마지막 호출 후 지정된 시간이 지나야 콜백이 실행됨
+ */
+function debounce(fn, ms) {
+  let timer;
+  const debounced = function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    if (timer !== undefined) {
+      clearTimeout(timer);
+    }
+    timer = window.setTimeout(() => {
+      timer = undefined;
+      fn(...args);
+    }, ms);
+  };
+  debounced.cancel = () => {
+    if (timer !== undefined) {
+      clearTimeout(timer);
+      timer = undefined;
+    }
+  };
+  return debounced;
+}