@ncds/ui-admin 1.6.4 → 1.7.0

package/dist/esm/src/components/empty-state/EmptyState.js

@@ -18,7 +18,7 @@ var __rest = this && this.__rest || function (s, e) {
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Button } from '../button/Button';
-export var EmptyState = function (_a) {
+var EmptyState = function (_a) {
   var title = _a.title,
     description = _a.description,
     buttons = _a.buttons;
@@ -48,4 +48,5 @@ export var EmptyState = function (_a) {
       })
     }))]
   }));
-};
+};
+export { EmptyState };

package/dist/esm/src/components/featured-icon/FeaturedIcon.js

@@ -25,14 +25,14 @@ var iconSizeMap = {
   lg: 24,
   xl: 28
 };
-export var FeaturedIcon = /*#__PURE__*/forwardRef(function (_a, ref) {
+var FeaturedIcon = /*#__PURE__*/forwardRef(function (_a, ref) {
   var Icon = _a.icon,
     _b = _a.theme,
     theme = _b === void 0 ? 'light-circle' : _b,
     _c = _a.color,
     color = _c === void 0 ? 'neutral' : _c,
     _d = _a.size,
-    size = _d === void 0 ? 'md' : _d,
+    size = _d === void 0 ? 'sm' : _d,
     className = _a.className,
     rest = __rest(_a, ["icon", "theme", "color", "size", "className"]);
   return _jsxs("div", __assign({
@@ -50,4 +50,5 @@ export var FeaturedIcon = /*#__PURE__*/forwardRef(function (_a, ref) {
       height: iconSizeMap[size]
     })]
   }));
-});
+});
+export { FeaturedIcon };

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

@@ -38,7 +38,7 @@ export var FileInputErrorType;
   FileInputErrorType["EXCEED_MAX_FILE_SIZE"] = "EXCEED_MAX_FILE_SIZE";
   FileInputErrorType["EXCEED_MAX_FILE_COUNT"] = "EXCEED_MAX_FILE_COUNT";
 })(FileInputErrorType || (FileInputErrorType = {}));
-export var FileInput = /*#__PURE__*/forwardRef(function (_a, ref) {
+export var FileInput = /*#__PURE__*/forwardRef(function (_a, _ref) {
   var _b = _a.size,
     size = _b === void 0 ? 'xs' : _b,
     accept = _a.accept,
@@ -169,12 +169,12 @@ export var FileInput = /*#__PURE__*/forwardRef(function (_a, ref) {
     return _jsx("ul", __assign({
       className: "ncua-file-input__hint-list"
     }, {
-      children: hintItems.map(function (hint, index) {
+      children: hintItems.map(function (hint) {
         return _jsx("li", __assign({
           className: "ncua-file-input__hint-item"
         }, {
           children: hint
-        }), index);
+        }), hint);
       })
     }));
   };

package/dist/esm/src/components/image-file-input/ImageFileInput.js

@@ -28,7 +28,7 @@ var __spreadArray = this && this.__spreadArray || function (to, from, pack) {
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { HelpCircle, Upload01 } from '@ncds/ui-admin-icon';
 import classNames from 'classnames';
-import { forwardRef, useEffect, useRef, useState } from 'react';
+import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
 import { Button } from '../button';
 import { FileInputErrorType as ImageFileInputErrorType } from '../file-input/FileInput';
 import { HintText, Label } from '../shared';
@@ -66,6 +66,9 @@ export var ImageFileInput = /*#__PURE__*/forwardRef(function (_a, ref) {
     showFileInput = _h === void 0 ? true : _h,
     props = __rest(_a, ["size", "accept", "multiple", "maxFileSize", "maxFileCount", "value", "onChange", "onFileSelect", "onFail", "buttonLabel", "imagePreviewTooltipLabel", "disabled", "label", "hintItems", "validation", "destructive", "isRequired", "showHelpIcon", "hintText", "showFileTagList", "showHintText", "showFileInput"]);
   var fileInputRef = useRef(null);
+  useImperativeHandle(ref, function () {
+    return fileInputRef.current;
+  });
   var _j = useState([]),
     internalFiles = _j[0],
     setInternalFiles = _j[1];
@@ -193,12 +196,12 @@ export var ImageFileInput = /*#__PURE__*/forwardRef(function (_a, ref) {
     return _jsx("ul", __assign({
       className: "ncua-file-input__hint-list"
     }, {
-      children: hintItems.map(function (hint, index) {
+      children: hintItems.map(function (hint) {
         return _jsx("li", __assign({
           className: "ncua-file-input__hint-item"
         }, {
           children: hint
-        }), index);
+        }), hint);
       })
     }));
   };

package/dist/esm/src/components/input/InputBase.js

@@ -31,7 +31,7 @@ var generalSvgSize = {
   xs: 14,
   sm: 20
 };
-export var InputBase = /*#__PURE__*/forwardRef(function (_a, ref) {
+var InputBase = /*#__PURE__*/forwardRef(function (_a, ref) {
   var _b = _a.size,
     size = _b === void 0 ? 'xs' : _b,
     required = _a.required,
@@ -219,4 +219,5 @@ export var InputBase = /*#__PURE__*/forwardRef(function (_a, ref) {
       children: hintText
     }))]
   }));
-});
+});
+export { InputBase };

package/dist/esm/src/components/input/NumberInput.js

@@ -36,7 +36,7 @@ export var NumberInput = /*#__PURE__*/forwardRef(function (_a, ref) {
   var getCurrentValue = useCallback(function () {
     var _a;
     var value = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.value;
-    return value ? parseFloat(value) : 0;
+    return value ? Number.parseFloat(value) : 0;
   }, []);
   var updateValue = useCallback(function (newValue) {
     if (!inputRef.current) return;

package/dist/esm/src/components/modal/Modal.js

@@ -22,7 +22,7 @@ import { useEffect, useRef } from 'react';
 import ReactDOM from 'react-dom';
 import { ButtonCloseX } from '../button/ButtonCloseX';
 import { FeaturedIcon } from '../featured-icon';
-export var Modal = function (_a) {
+var Modal = function (_a) {
   var isOpen = _a.isOpen,
     onClose = _a.onClose,
     children = _a.children,
@@ -189,4 +189,5 @@ Modal.Actions = function (_a) {
       }))]
     }))]
   });
-};
+};
+export { Modal };

package/dist/esm/src/components/notification/FloatingNotification.js

@@ -32,7 +32,7 @@ var iconMap = {
   success: CheckCircle
   // info는 floating에서는 지원하지 않음
 };
-export var FloatingNotification = /*#__PURE__*/forwardRef(function (_a, ref) {
+var FloatingNotification = /*#__PURE__*/forwardRef(function (_a, ref) {
   var title = _a.title,
     supportingText = _a.supportingText,
     _b = _a.color,
@@ -130,4 +130,5 @@ export var FloatingNotification = /*#__PURE__*/forwardRef(function (_a, ref) {
       onClick: onClose
     })]
   }));
-});
+});
+export { FloatingNotification };

package/dist/esm/src/components/notification/FullWidthNotification.js

@@ -35,7 +35,7 @@ var iconColorMap = {
   success: 'green600',
   info: 'violet600'
 };
-export var FullWidthNotification = /*#__PURE__*/forwardRef(function (_a, ref) {
+var FullWidthNotification = /*#__PURE__*/forwardRef(function (_a, ref) {
   var title = _a.title,
     supportingText = _a.supportingText,
     _b = _a.color,
@@ -158,4 +158,5 @@ export var FullWidthNotification = /*#__PURE__*/forwardRef(function (_a, ref) {
       }))
     }))
   }));
-});
+});
+export { FullWidthNotification };

package/dist/esm/src/components/notification/MessageNotification.js

@@ -35,7 +35,7 @@ var iconColorMap = {
   warning: 'orange500',
   success: 'green600'
 };
-export var MessageNotification = /*#__PURE__*/forwardRef(function (_a, ref) {
+var MessageNotification = /*#__PURE__*/forwardRef(function (_a, ref) {
   var title = _a.title,
     supportingText = _a.supportingText,
     Icon = _a.icon,
@@ -126,4 +126,5 @@ export var MessageNotification = /*#__PURE__*/forwardRef(function (_a, ref) {
     }))
   }));
 });
-MessageNotification.displayName = 'MessageNotification';
+MessageNotification.displayName = 'MessageNotification';
+export { MessageNotification };

package/dist/esm/src/components/notification/Notification.js

@@ -21,7 +21,7 @@ import { forwardRef } from 'react';
 import { FloatingNotification } from './FloatingNotification';
 import { FullWidthNotification } from './FullWidthNotification';
 import { MessageNotification } from './MessageNotification';
-export var Notification = /*#__PURE__*/forwardRef(function (_a, ref) {
+var Notification = /*#__PURE__*/forwardRef(function (_a, ref) {
   var _b = _a.type,
     type = _b === void 0 ? 'floating' : _b,
     _c = _a.color,
@@ -50,4 +50,5 @@ export var Notification = /*#__PURE__*/forwardRef(function (_a, ref) {
   }
   return null;
 });
-Notification.displayName = 'Notification';
+Notification.displayName = 'Notification';
+export { Notification };

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

@@ -1,4 +1,4 @@
-export * from './Notification';
 export * from './FloatingNotification';
 export * from './FullWidthNotification';
-export * from './MessageNotification';
+export * from './MessageNotification';
+export * from './Notification';

package/dist/esm/src/components/pagination/NavButton.js

@@ -11,6 +11,8 @@ var __assign = this && this.__assign || function () {
 import { jsx as _jsx } from "react/jsx-runtime";
 import { ArrowLeft, ArrowRight, ChevronLeft, ChevronLeftDouble, ChevronRight, ChevronRightDouble } from '@ncds/ui-admin-icon';
 import { Button } from '../button';
+var ICON_SIZE_PC = 16;
+var ICON_SIZE_MOBILE = 20;
 var NAV_BUTTON_CONFIG = {
   first: {
     label: '처음',
@@ -61,7 +63,7 @@ export var NavButton = function (_a) {
     leadingIcon: {
       type: 'icon',
       icon: config.getIcon(isPC),
-      size: isPC ? 16 : 20,
+      size: isPC ? ICON_SIZE_PC : ICON_SIZE_MOBILE,
       color: disabled ? 'gray200' : 'gray700'
     },
     hierarchy: 'secondary-gray',

package/dist/esm/src/components/pagination/Pagination.js

@@ -66,74 +66,72 @@ export var Pagination = function (_a) {
       setStart(lastGroupStart);
     }
   }, [currentPage]);
-  return _jsx(_Fragment, {
-    children: _jsxs("div", __assign({
-      className: classNames('ncua-pagination', "ncua-pagination--".concat(breakPoint), className)
+  return _jsxs("div", __assign({
+    className: classNames('ncua-pagination', "ncua-pagination--".concat(breakPoint), className)
+  }, {
+    children: [showJumpPageButton && _jsxs(_Fragment, {
+      children: [NavButton({
+        type: 'first',
+        breakPoint: breakPoint,
+        noPrev: noPrev,
+        noNext: noNext,
+        onClick: function () {
+          return handleClickButton(1);
+        }
+      }), NavButton({
+        type: 'prev',
+        breakPoint: breakPoint,
+        noPrev: noPrev,
+        noNext: noNext,
+        onClick: function () {
+          return breakPoint === 'mo' ? handleClickButton(Math.max(currentPage - 1, 1)) : handleClickButton(Math.max(start - pageCount, 1));
+        }
+      })]
+    }), _jsx("ul", __assign({
+      className: "ncua-pagination__list"
     }, {
-      children: [showJumpPageButton && _jsxs(_Fragment, {
-        children: [NavButton({
-          type: 'first',
-          breakPoint: breakPoint,
-          noPrev: noPrev,
-          noNext: noNext,
-          onClick: function () {
-            return handleClickButton(1);
-          }
-        }), NavButton({
-          type: 'prev',
-          breakPoint: breakPoint,
-          noPrev: noPrev,
-          noNext: noNext,
-          onClick: function () {
-            return breakPoint === 'mo' ? handleClickButton(Math.max(currentPage - 1, 1)) : handleClickButton(Math.max(start - pageCount, 1));
-          }
-        })]
-      }), _jsx("ul", __assign({
-        className: "ncua-pagination__list"
-      }, {
-        children: range(start, Math.min(totalPage + 1, start + pageCount)).map(function (pageNumber, i) {
-          return _jsx("li", __assign({
-            className: "ncua-pagination__item"
-          }, {
-            children: _jsx("button", __assign({
-              className: classNames('ncua-pagination__page-num', {
-                'is-current': pageNumber === currentPage
-              }),
-              onClick: function () {
-                return handleClickButton(start + i);
-              }
-            }, restProps, {
-              children: start + i
-            }))
-          }), uniqueId('ncua-pagination__page-num'));
-        })
-      })), _jsxs("p", __assign({
-        className: "ncua-pagination__page-info"
-      }, {
-        children: [_jsx("em", __assign({
-          className: "ncua-pagination__current-num"
+      children: range(start, Math.min(totalPage + 1, start + pageCount)).map(function (pageNumber, i) {
+        return _jsx("li", __assign({
+          className: "ncua-pagination__item"
         }, {
-          children: currentPage
-        })), " / ", totalPage]
-      })), showJumpPageButton && _jsxs(_Fragment, {
-        children: [NavButton({
-          type: 'next',
-          breakPoint: breakPoint,
-          noPrev: noPrev,
-          noNext: noNext,
-          onClick: function () {
-            return breakPoint === 'mo' ? handleClickButton(Math.min(currentPage + 1, totalPage)) : handleClickButton(Math.min(start + pageCount, totalPage));
-          }
-        }), NavButton({
-          type: 'last',
-          breakPoint: breakPoint,
-          noPrev: noPrev,
-          noNext: noNext,
-          onClick: function () {
-            return handleClickButton(totalPage);
-          }
-        })]
+          children: _jsx("button", __assign({
+            className: classNames('ncua-pagination__page-num', {
+              'is-current': pageNumber === currentPage
+            }),
+            onClick: function () {
+              return handleClickButton(start + i);
+            }
+          }, restProps, {
+            children: start + i
+          }))
+        }), uniqueId('ncua-pagination__page-num'));
+      })
+    })), _jsxs("p", __assign({
+      className: "ncua-pagination__page-info"
+    }, {
+      children: [_jsx("em", __assign({
+        className: "ncua-pagination__current-num"
+      }, {
+        children: currentPage
+      })), " / ", totalPage]
+    })), showJumpPageButton && _jsxs(_Fragment, {
+      children: [NavButton({
+        type: 'next',
+        breakPoint: breakPoint,
+        noPrev: noPrev,
+        noNext: noNext,
+        onClick: function () {
+          return breakPoint === 'mo' ? handleClickButton(Math.min(currentPage + 1, totalPage)) : handleClickButton(Math.min(start + pageCount, totalPage));
+        }
+      }), NavButton({
+        type: 'last',
+        breakPoint: breakPoint,
+        noPrev: noPrev,
+        noNext: noNext,
+        onClick: function () {
+          return handleClickButton(totalPage);
+        }
       })]
-    }))
-  });
+    })]
+  }));
 };

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
+    }))]
+  }));
 };