@ncds/ui-admin 1.6.4-alpha.1 → 1.7.0

package/dist/esm/src/components/progress-bar/ProgressBar.js

@@ -9,9 +9,9 @@ var __assign = this && this.__assign || function () {
   return __assign.apply(this, arguments);
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useProgressBar } from './hooks/useProgressBar';
 import { SegmentBar } from './components/SegmentBar';
 import { SegmentLabels, SingleLabel } from './components/SegmentLabels';
+import { useProgressBar } from './hooks/useProgressBar';
 import { getFillColorClass } from './utils';
 export var ProgressBar = function (_a) {
   var label = _a.label,
@@ -31,11 +31,15 @@ export var ProgressBar = function (_a) {
     segmentCount = _d.segmentCount,
     shouldSpaceOut = _d.shouldSpaceOut;
   var isFloatingLabel = effectiveLabel === 'top-float' || effectiveLabel === 'bottom-float';
+  var containerClassName = "ncua-progress-bar ncua-progress-bar-".concat(effectiveLabel || '');
+  var isRightLabel = effectiveLabel === 'right';
+  var isBottomLabel = effectiveLabel === 'bottom';
+  var isMultiSegment = hasSegments && segmentCount >= 2;
   // segments가 1개일 때는 기존 value 방식과 동일하게 처리
   if (hasSegments && segmentCount === 1) {
     var singleSegment = processedSegments[0];
     return _jsxs("div", __assign({
-      className: "ncua-progress-bar ncua-progress-bar-".concat(effectiveLabel || ''),
+      className: containerClassName,
       style: progressValueStyle
     }, {
       children: [isFloatingLabel && _jsx(SingleLabel, {
@@ -58,13 +62,13 @@ export var ProgressBar = function (_a) {
             "aria-valuemin": 0,
             "aria-valuemax": 100
           })
-        })), effectiveLabel === 'right' && _jsx(SingleLabel, {
+        })), isRightLabel && _jsx(SingleLabel, {
           labelType: "right",
           displayValue: displayValue,
           totalValue: totalValue,
           showZeroLabel: showZeroLabel
         })]
-      })), effectiveLabel === 'bottom' && _jsx(SingleLabel, {
+      })), isBottomLabel && _jsx(SingleLabel, {
         labelType: "bottom",
         displayValue: displayValue,
         totalValue: totalValue,
@@ -73,7 +77,7 @@ export var ProgressBar = function (_a) {
     }));
   }
   return _jsxs("div", __assign({
-    className: "ncua-progress-bar ncua-progress-bar-".concat(effectiveLabel || ''),
+    className: containerClassName,
     style: progressValueStyle
   }, {
     children: [isFloatingLabel && _jsx(SingleLabel, {
@@ -99,21 +103,21 @@ export var ProgressBar = function (_a) {
           "aria-valuemin": 0,
           "aria-valuemax": 100
         })
-      })), effectiveLabel === 'right' && _jsx(SingleLabel, {
+      })), isRightLabel && _jsx(SingleLabel, {
         labelType: "right",
         displayValue: displayValue,
         totalValue: totalValue,
         showZeroLabel: showZeroLabel
       })]
-    })), hasSegments && segmentCount >= 2 ? _jsx(SegmentLabels, {
+    })), isMultiSegment && _jsx(SegmentLabels, {
       segments: processedSegments,
       segmentCount: segmentCount,
       showZeroLabel: showZeroLabel
-    }) : effectiveLabel === 'bottom' ? _jsx(SingleLabel, {
+    }), !isMultiSegment && isBottomLabel && _jsx(SingleLabel, {
       labelType: "bottom",
       displayValue: displayValue,
       totalValue: totalValue,
       showZeroLabel: showZeroLabel
-    }) : null]
+    })]
   }));
 };

package/dist/esm/src/components/progress-bar/components/SegmentBar.js

@@ -12,7 +12,7 @@ export var SegmentBar = function (_a) {
         style: {
           width: "".concat(segment.width, "%")
         }
-      }, index);
+      }, "".concat(segment.color, "-").concat(index));
     })
   });
 };

package/dist/esm/src/components/progress-bar/components/SegmentLabels.js

@@ -10,7 +10,7 @@ var __assign = this && this.__assign || function () {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import { getLabelColorClass } from '../utils';
-export var SegmentLabels = function (_a) {
+var SegmentLabels = function (_a) {
   var segments = _a.segments,
     segmentCount = _a.segmentCount,
     _b = _a.showZeroLabel,
@@ -42,13 +42,13 @@ export var SegmentLabels = function (_a) {
           }
         }, {
           children: "".concat(segment.value.toFixed(0), "%")
-        }), index);
+        }), "".concat(segment.color, "-").concat(index));
       })
     }));
   }
   return null;
 };
-export var SingleLabel = function (_a) {
+var SingleLabel = function (_a) {
   var labelType = _a.labelType,
     displayValue = _a.displayValue,
     totalValue = _a.totalValue,
@@ -63,4 +63,5 @@ export var SingleLabel = function (_a) {
   }, {
     children: displayValue
   }));
-};
+};
+export { SegmentLabels, SingleLabel };

package/dist/esm/src/components/progress-bar/hooks/useProgressBar.js

@@ -10,6 +10,7 @@ var __assign = this && this.__assign || function () {
 };
 import { useMemo } from 'react';
 import { clampValue } from '../utils';
+var MAX_PERCENTAGE = 100;
 /**
  * segments를 처리하여 프로그레스 바에 표시할 데이터를 계산합니다.
  */
@@ -27,7 +28,7 @@ var processSegments = function (segments, segmentCount, valueToPercent) {
       // 각 segment를 합계 대비 비율로 변환 (합계를 100%로 규정)
       segmentsToProcess = segmentsToProcess.map(function (segment) {
         return {
-          value: segment.value / originalTotal_1 * 100,
+          value: segment.value / originalTotal_1 * MAX_PERCENTAGE,
           color: segment.color
         };
       });
@@ -44,7 +45,7 @@ var processSegments = function (segments, segmentCount, valueToPercent) {
   var actualTotal = limitedSegments.reduce(function (sum, seg) {
     return sum + seg.value;
   }, 0);
-  var total = Math.min(actualTotal, 100);
+  var total = Math.min(actualTotal, MAX_PERCENTAGE);
   // 모든 segments를 좌측에서부터 연속적으로 배치 (비율로 계산)
   var processed = limitedSegments.map(function (segment) {
     return __assign(__assign({}, segment), {

package/dist/esm/src/components/progress-bar/utils.js

@@ -1,7 +1,7 @@
 /**
  * 색상 이름을 fill 색상 클래스명으로 변환
  */
-export var getFillColorClass = function (color) {
+var getFillColorClass = function (color) {
   if (!color) return '';
   var normalizedColor = color.toLowerCase().trim();
   return "ncua-progress-bar__fill--color-".concat(normalizedColor);
@@ -9,14 +9,16 @@ export var getFillColorClass = function (color) {
 /**
  * 색상 이름을 label 색상 클래스명으로 변환
  */
-export var getLabelColorClass = function (color) {
+var getLabelColorClass = function (color) {
   if (!color) return '';
   var normalizedColor = color.toLowerCase().trim();
   return "ncua-progress-bar__label--color-".concat(normalizedColor);
 };
+var MAX_PERCENTAGE = 100;
 /**
  * 값을 0-100 범위로 제한
  */
-export var clampValue = function (value) {
-  return Math.min(Math.max(0, value), 100);
-};
+var clampValue = function (value) {
+  return Math.min(Math.max(0, value), MAX_PERCENTAGE);
+};
+export { getFillColorClass, getLabelColorClass, clampValue };

package/dist/esm/src/components/progress-circle/ProgressCircle.js

@@ -9,13 +9,14 @@ var __assign = this && this.__assign || function () {
   return __assign.apply(this, arguments);
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+var MAX_PERCENTAGE = 100;
 export var ProgressCircle = function (_a) {
   var size = _a.size,
     label = _a.label,
     value = _a.value,
     _b = _a.theme,
     theme = _b === void 0 ? 'circle' : _b;
-  var limitedValue = Math.min(Math.max(0, value), 100);
+  var limitedValue = Math.min(Math.max(0, value), MAX_PERCENTAGE);
   if (theme === 'circle') {
     return _jsxs("div", __assign({
       className: "ncua-progress-circle ncua-progress-circle-".concat(size, " ncua-progress-circle-").concat(theme)
@@ -65,50 +66,49 @@ export var ProgressCircle = function (_a) {
         children: label
       }))]
     }));
-  } else {
-    return _jsxs("div", __assign({
-      className: "ncua-progress-circle ncua-progress-circle-".concat(size, " ncua-progress-circle-").concat(theme)
+  }
+  return _jsxs("div", __assign({
+    className: "ncua-progress-circle ncua-progress-circle-".concat(size, " ncua-progress-circle-").concat(theme)
+  }, {
+    children: [_jsxs("div", __assign({
+      className: "ncua-progress-circle__content"
     }, {
-      children: [_jsxs("div", __assign({
-        className: "ncua-progress-circle__content"
+      children: [_jsxs("svg", __assign({
+        className: "ncua-progress-circle__svg",
+        viewBox: "0 0 100 50"
       }, {
-        children: [_jsxs("svg", __assign({
-          className: "ncua-progress-circle__svg",
-          viewBox: "0 0 100 50"
+        children: [_jsx("path", {
+          className: "ncua-progress-circle__background",
+          d: "M 5 50 A 45 45 0 0 1 95 50",
+          strokeWidth: "10",
+          fill: "none",
+          strokeLinecap: "round"
+        }), _jsx("path", {
+          className: "ncua-progress-circle__progress",
+          d: "M 5 50 A 45 45 0 0 1 95 50",
+          strokeWidth: "10",
+          fill: "none",
+          strokeDasharray: "var(--half-circle-circumference)",
+          strokeDashoffset: "calc(var(--half-circle-circumference) * (1 - ".concat(limitedValue, " / 100))"),
+          strokeLinecap: "round"
+        })]
+      })), _jsxs("div", __assign({
+        className: "ncua-progress-circle__label-container"
+      }, {
+        children: [size !== 'xxs' && label && _jsx("div", __assign({
+          className: "ncua-progress-circle__label-text"
         }, {
-          children: [_jsx("path", {
-            className: "ncua-progress-circle__background",
-            d: "M 5 50 A 45 45 0 0 1 95 50",
-            strokeWidth: "10",
-            fill: "none",
-            strokeLinecap: "round"
-          }), _jsx("path", {
-            className: "ncua-progress-circle__progress",
-            d: "M 5 50 A 45 45 0 0 1 95 50",
-            strokeWidth: "10",
-            fill: "none",
-            strokeDasharray: "var(--half-circle-circumference)",
-            strokeDashoffset: "calc(var(--half-circle-circumference) * (1 - ".concat(limitedValue, " / 100))"),
-            strokeLinecap: "round"
-          })]
-        })), _jsxs("div", __assign({
-          className: "ncua-progress-circle__label-container"
+          children: label
+        })), _jsx("div", __assign({
+          className: "ncua-progress-circle__label"
         }, {
-          children: [size !== 'xxs' && label && _jsx("div", __assign({
-            className: "ncua-progress-circle__label-text"
-          }, {
-            children: label
-          })), _jsx("div", __assign({
-            className: "ncua-progress-circle__label"
-          }, {
-            children: "".concat(limitedValue, "%")
-          }))]
+          children: "".concat(limitedValue, "%")
         }))]
-      })), size === 'xxs' && label && _jsx("div", __assign({
-        className: "ncua-progress-circle__outside-label"
-      }, {
-        children: label
       }))]
-    }));
-  }
+    })), size === 'xxs' && label && _jsx("div", __assign({
+      className: "ncua-progress-circle__outside-label"
+    }, {
+      children: label
+    }))]
+  }));
 };

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

@@ -62,12 +62,12 @@ export var Select = /*#__PURE__*/forwardRef(function (_a, ref) {
           disabled: disabledPlaceholder
         }, {
           children: placeholder
-        })), optionItems && optionItems.map(function (item, index) {
+        })), optionItems === null || optionItems === void 0 ? void 0 : optionItems.map(function (item) {
           return _jsx("option", __assign({
             value: item.id
           }, {
             children: item.label
-          }), "option-".concat(index));
+          }), item.id);
         }), children]
       }))
     })), hintText && _jsx(HintText, __assign({

package/dist/esm/src/components/select-dropdown/SelectDropdown.js

@@ -20,7 +20,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import classNames from 'classnames';
 import { forwardRef } from 'react';
 import { Button } from '../button';
-export var SelectDropdown = /*#__PURE__*/forwardRef(function (_a, ref) {
+var SelectDropdown = /*#__PURE__*/forwardRef(function (_a, ref) {
   var isOpen = _a.isOpen,
     _b = _a.direction,
     direction = _b === void 0 ? 'down' : _b,
@@ -146,4 +146,5 @@ export var SelectDropdown = /*#__PURE__*/forwardRef(function (_a, ref) {
     }))]
   }));
 });
-SelectDropdown.displayName = 'SelectDropdown';
+SelectDropdown.displayName = 'SelectDropdown';
+export { SelectDropdown };

package/dist/esm/src/components/selectbox/SelectBox.js

@@ -27,16 +27,65 @@ var __spreadArray = this && this.__spreadArray || function (to, from, pack) {
 };
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { ChevronDown } from '@ncds/ui-admin-icon';
-import { COLOR } from '../../../constant/color';
 import classNames from 'classnames';
 import { forwardRef, useCallback, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from 'react';
+import { COLOR } from '../../../constant/color';
 import { useDropdown, useScrollLock } from '../../hooks/dropdown';
 import { useMultiSelect } from '../../utils/dropdown/multiSelect';
 import { SelectDropdown } from '../select-dropdown';
 import { HintText } from '../shared/hintText/HintText';
 import { Tag } from '../tag';
-export var DEFAULT_MAX_HEIGHT = 275;
-export var SelectBox = /*#__PURE__*/forwardRef(function (_a, ref) {
+var ICON_SIZE_XS = 14;
+var ICON_SIZE_SM = 16;
+var DEFAULT_MAX_HEIGHT = 275;
+function computeNewValue(option, value, multiple) {
+  if (multiple) {
+    var currentValues = Array.isArray(value) ? value : [];
+    if (currentValues.includes(option.id)) {
+      return currentValues.filter(function (v) {
+        return v !== option.id;
+      });
+    }
+    return __spreadArray(__spreadArray([], currentValues, true), [option.id], false);
+  }
+  return option.id;
+}
+function notifyRegister(register, newValue, multiple) {
+  if (!(register === null || register === void 0 ? void 0 : register.onChange)) return;
+  register.onChange({
+    target: {
+      value: multiple ? JSON.stringify(newValue) : newValue,
+      name: register.name
+    }
+  });
+}
+function DisplayValue(_a) {
+  var displayValue = _a.displayValue;
+  if (typeof displayValue === 'string') {
+    return _jsx("span", __assign({
+      className: "ncua-selectbox__value-text"
+    }, {
+      children: displayValue
+    }));
+  }
+  return _jsxs("div", __assign({
+    className: "ncua-selectbox__value-container"
+  }, {
+    children: [displayValue.icon && _jsx("span", __assign({
+      className: "ncua-selectbox__value-icon"
+    }, {
+      children: _jsx(displayValue.icon, {
+        width: 16,
+        height: 16
+      })
+    })), _jsx("span", __assign({
+      className: "ncua-selectbox__value-text"
+    }, {
+      children: displayValue.label
+    }))]
+  }));
+}
+var SelectBox = /*#__PURE__*/forwardRef(function (_a, ref) {
   var _b = _a.placeholder,
     placeholder = _b === void 0 ? '선택하세요' : _b,
     _c = _a.disabledPlaceholder,
@@ -87,29 +136,9 @@ export var SelectBox = /*#__PURE__*/forwardRef(function (_a, ref) {
   }, [multiple, selectedOption, placeholder]);
   var handleOptionSelect = function (option) {
     if (disabled) return;
-    var newValue;
-    if (multiple) {
-      var currentValues = Array.isArray(value) ? value : [];
-      if (currentValues.includes(option.id)) {
-        newValue = currentValues.filter(function (v) {
-          return v !== option.id;
-        });
-      } else {
-        newValue = __spreadArray(__spreadArray([], currentValues, true), [option.id], false);
-      }
-    } else {
-      newValue = option.id;
-    }
+    var newValue = computeNewValue(option, value, multiple);
     onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
-    // react-hook-form 지원
-    if (register === null || register === void 0 ? void 0 : register.onChange) {
-      register.onChange({
-        target: {
-          value: multiple ? JSON.stringify(newValue) : newValue,
-          name: register.name
-        }
-      });
-    }
+    notifyRegister(register, newValue, multiple);
   };
   var _p = useDropdown({
       triggerRef: internalRef,
@@ -216,29 +245,12 @@ export var SelectBox = /*#__PURE__*/forwardRef(function (_a, ref) {
           children: [_jsx("div", __assign({
             className: "ncua-selectbox__value"
           }, {
-            children: typeof displayValue === 'string' ? _jsx("span", __assign({
-              className: "ncua-selectbox__value-text"
-            }, {
-              children: displayValue
-            })) : _jsxs("div", __assign({
-              className: "ncua-selectbox__value-container"
-            }, {
-              children: [displayValue.icon && _jsx("span", __assign({
-                className: "ncua-selectbox__value-icon"
-              }, {
-                children: _jsx(displayValue.icon, {
-                  width: 16,
-                  height: 16
-                })
-              })), _jsx("span", __assign({
-                className: "ncua-selectbox__value-text"
-              }, {
-                children: displayValue.label
-              }))]
-            }))
+            children: _jsx(DisplayValue, {
+              displayValue: displayValue
+            })
           })), _jsx(ChevronDown, {
-            width: size === 'xs' ? 14 : 16,
-            height: size === 'xs' ? 14 : 16,
+            width: size === 'xs' ? ICON_SIZE_XS : ICON_SIZE_SM,
+            height: size === 'xs' ? ICON_SIZE_XS : ICON_SIZE_SM,
             color: disabled ? COLOR.gray300 : COLOR.gray500,
             className: classNames('ncua-selectbox__arrow', {
               'ncua-selectbox__arrow--up': isOpen
@@ -296,4 +308,5 @@ export var SelectBox = /*#__PURE__*/forwardRef(function (_a, ref) {
     }))]
   });
 });
-SelectBox.displayName = 'SelectBox';
+SelectBox.displayName = 'SelectBox';
+export { DEFAULT_MAX_HEIGHT, SelectBox };

package/dist/esm/src/components/spinner/Spinner.js

@@ -24,7 +24,7 @@ export var Spinner = function (_a) {
   var _b = _a.as,
     as = _b === void 0 ? 'p' : _b,
     _c = _a.size,
-    size = _c === void 0 ? 'md' : _c,
+    size = _c === void 0 ? 'sm' : _c,
     children = _a.children,
     _d = _a.backdrop,
     backdrop = _d === void 0 ? false : _d;
@@ -36,10 +36,11 @@ export var Spinner = function (_a) {
     children: _jsx("div", __assign({
       className: "ncua-spinner__content"
     }, {
-      children: children && _jsx(RenderText, {
-        as: as,
+      children: children && _jsx(RenderText, __assign({
+        as: as
+      }, {
         children: children
-      })
+      }))
     }))
   }));
 };

package/dist/esm/src/components/spinner/index.js

@@ -1,2 +1 @@
-export * from './Spinner';
-export * from './index';
+export * from './Spinner';

package/dist/esm/src/components/switch/Switch.js

@@ -10,21 +10,26 @@ var __assign = this && this.__assign || function () {
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import classNames from 'classnames';
-import { forwardRef, useState } from 'react';
-export var Switch = /*#__PURE__*/forwardRef(function (_a, ref) {
-  var _b = _a.size,
-    size = _b === void 0 ? 'xs' : _b,
+import { forwardRef, useImperativeHandle, useRef, useState } from 'react';
+var Switch = /*#__PURE__*/forwardRef(function (_a, ref) {
+  var _b;
+  var _c = _a.size,
+    size = _c === void 0 ? 'xs' : _c,
     left = _a.left,
     right = _a.right,
-    _c = _a.disabled,
-    disabled = _c === void 0 ? false : _c,
+    _d = _a.disabled,
+    disabled = _d === void 0 ? false : _d,
     value = _a.value,
-    _d = _a.defaultValue,
-    defaultValue = _d === void 0 ? left.value : _d,
+    _e = _a.defaultValue,
+    defaultValue = _e === void 0 ? left.value : _e,
     onChange = _a.onChange,
     className = _a.className,
     name = _a.name,
     refs = _a.refs;
+  var leftInputRef = useRef(null);
+  useImperativeHandle(ref, function () {
+    return leftInputRef.current;
+  });
   // 값을 문자열로 정규화하는 함수
   var normalizeValue = function (val) {
     return typeof val === 'boolean' ? String(val) : val;
@@ -44,9 +49,9 @@ export var Switch = /*#__PURE__*/forwardRef(function (_a, ref) {
     return normalizeValue(value);
   };
   var isControlled = getCurrentValue() !== undefined;
-  var _e = useState(normalizeValue(defaultValue)),
-    internalValue = _e[0],
-    setInternalValue = _e[1];
+  var _f = useState(normalizeValue(defaultValue)),
+    internalValue = _f[0],
+    setInternalValue = _f[1];
   var currentValue = isControlled ? getCurrentValue() : internalValue;
   var handleChange = function (newValue) {
     if (!isControlled) {
@@ -74,7 +79,7 @@ export var Switch = /*#__PURE__*/forwardRef(function (_a, ref) {
     }, {
       children: [_jsx("input", {
         type: "radio",
-        ref: refs === null || refs === void 0 ? void 0 : refs[0],
+        ref: (_b = refs === null || refs === void 0 ? void 0 : refs[0]) !== null && _b !== void 0 ? _b : leftInputRef,
         name: name,
         value: normalizeValue(left.value),
         checked: currentValue === normalizeValue(left.value),
@@ -113,4 +118,5 @@ export var Switch = /*#__PURE__*/forwardRef(function (_a, ref) {
     }))]
   }));
 });
-Switch.displayName = 'Switch';
+Switch.displayName = 'Switch';
+export { Switch };

package/dist/esm/src/components/tab/HorizontalTab.js

@@ -8,12 +8,14 @@ var __assign = this && this.__assign || function () {
   };
   return __assign.apply(this, arguments);
 };
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 import classNames from 'classnames';
 import { uniqueId } from 'lodash-es';
 import { Swiper, SwiperSlide } from 'swiper/react';
 import { TabButton } from './TabButton';
-export var HorizontalTab = function (_a) {
+var UNDERLINE_GAP = 16;
+var DEFAULT_GAP = 8;
+var HorizontalTab = function (_a) {
   var _b = _a.type,
     type = _b === void 0 ? 'button-primary' : _b,
     _c = _a.size,
@@ -22,19 +24,20 @@ export var HorizontalTab = function (_a) {
     _d = _a.fullWidth,
     fullWidth = _d === void 0 ? false : _d,
     _e = _a.menus,
-    menus = _e === void 0 ? [] : _e;
+    menus = _e === void 0 ? [] : _e,
+    className = _a.className;
   var getTabGap = function (type) {
     var _a;
     var gap = {
-      underline: 16
+      underline: UNDERLINE_GAP
     };
-    return (_a = gap[type]) !== null && _a !== void 0 ? _a : 8;
+    return (_a = gap[type]) !== null && _a !== void 0 ? _a : DEFAULT_GAP;
   };
-  if (!menus.length) return _jsx(_Fragment, {});
+  if (!menus.length) return null;
   return _jsx("div", __assign({
     className: classNames('ncua-horizontal-tab', "ncua-horizontal-tab--".concat(type), "ncua-horizontal-tab--".concat(size), {
       'ncua-horizontal-tab--fullWidth': fullWidth
-    })
+    }, className)
   }, {
     children: _jsx(Swiper, __assign({
       slidesPerView: "auto",
@@ -54,4 +57,5 @@ export var HorizontalTab = function (_a) {
       })
     }))
   }));
-};
+};
+export { HorizontalTab };

package/dist/esm/src/components/tab/TabButton.js

@@ -20,7 +20,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import { XClose } from '@ncds/ui-admin-icon';
 import classNames from 'classnames';
 import { Badge } from '../badge/Badge';
-export var TabButton = function (_a) {
+var TabButton = function (_a) {
   var id = _a.id,
     label = _a.label,
     _b = _a.size,
@@ -41,7 +41,7 @@ export var TabButton = function (_a) {
       href = _d.href,
       _e = _d.target,
       target = _e === void 0 ? '_self' : _e,
-      onClick_1 = _d.onClick,
+      _onClick = _d.onClick,
       anchorProps = __rest(_d, ["href", "target", "onClick"]);
     return _jsxs("a", __assign({
       className: componentClassName,
@@ -81,4 +81,5 @@ export var TabButton = function (_a) {
       })
     }))]
   });
-};
+};
+export { TabButton };

package/dist/esm/src/components/tag/Tag.js

@@ -50,7 +50,7 @@ var calculateOptimalPosition = function (triggerElement, tooltipElement) {
   var fallbackPosition = hasTopSpace ? 'top-right' : 'bottom-right';
   return fallbackPosition;
 };
-export var Tag = function (_a) {
+var Tag = function (_a) {
   var _b = _a.size,
     size = _b === void 0 ? 'sm' : _b,
     icon = _a.icon,
@@ -155,4 +155,5 @@ export var Tag = function (_a) {
       }))
     }))]
   }));
-};
+};
+export { Tag };