@ncds/ui-admin 0.0.34 → 0.0.36

package/dist/cjs/src/components/button/Button.js

@@ -0,0 +1,127 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.svgSize = exports.iconOnlySvgSize = exports.dotSize = exports.Button = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _react = require("react");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _uiAdminIcon = _interopRequireDefault(require("@ncds/ui-admin-icon"));
+var _color = require("../../../constant/color");
+var _dot = require("../dot");
+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 svgSize = exports.svgSize = {
+  xxs: 12,
+  xs: 14,
+  sm: 16,
+  md: 20
+};
+var iconOnlySvgSize = exports.iconOnlySvgSize = {
+  xxs: 14,
+  xs: 16,
+  sm: 20,
+  md: 20
+};
+var dotSize = exports.dotSize = {
+  xxs: 'sm',
+  xs: 'sm',
+  sm: 'md',
+  md: 'md'
+};
+var Button = exports.Button = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
+  // NOTE: 엘리먼트 종류에 따라 props의 타입이 달라지므로 분리
+  var _a = props.as,
+    as = _a === void 0 ? 'button' : _a,
+    _b = props.size,
+    size = _b === void 0 ? 'md' : _b,
+    children = props.children,
+    onlyIcon = props.onlyIcon,
+    disabled = props.disabled,
+    className = props.className,
+    _c = props.hierarchy,
+    hierarchy = _c === void 0 ? 'secondary-gray' : _c,
+    label = props.label,
+    leadingIcon = props.leadingIcon,
+    trailingIcon = props.trailingIcon,
+    restProps = __rest(props, ["as", "size", "children", "onlyIcon", "disabled", "className", "hierarchy", "label", "leadingIcon", "trailingIcon"]);
+  var _d = (0, _react.useState)(null),
+    queryParams = _d[0],
+    setQueryParams = _d[1];
+  // Type guard to check if props is an AnchorElementProps
+  var isAnchorProps = function (p) {
+    return p.as === 'a';
+  };
+  var handleClickLink = function (e) {
+    var isRemote = (queryParams === null || queryParams === void 0 ? void 0 : queryParams.get('isRemote')) === 'true';
+    if (isAnchorProps(props) && isRemote) {
+      e.preventDefault();
+      // INFO: 1. 사이트 리모트 페이지(디센/개센): 빌더에서 설정한 타겟(self or blank)에 따라 페이지 호출
+      // 2. 어드민 리모트 페이지: 빌더에서 설정한 타겟에 관계 없이 모두 blank
+      var isBlank = props.target === '_blank';
+      if (!isRemote && !isBlank && window.top) {
+        window.top.location.href = props.href;
+        return;
+      }
+      window.open(props.href);
+    }
+  };
+  var sideSlotRender = function (slot) {
+    var _a, _b, _c;
+    if (slot.type === 'icon') {
+      var iconSize = onlyIcon ? iconOnlySvgSize[size] : svgSize[size];
+      return (0, _jsxRuntime.jsx)(_uiAdminIcon.default, {
+        name: slot.icon,
+        height: (_a = slot.size) !== null && _a !== void 0 ? _a : iconSize,
+        width: (_b = slot.size) !== null && _b !== void 0 ? _b : iconSize,
+        color: slot.color ? _color.COLOR[slot.color] : undefined
+      });
+    }
+    if (slot.type === 'dot') {
+      return (0, _jsxRuntime.jsx)(_dot.Dot, {
+        color: slot.color,
+        size: (_c = slot.size) !== null && _c !== void 0 ? _c : dotSize[size]
+      });
+    }
+    return slot.children;
+  };
+  (0, _react.useEffect)(function () {
+    var _a;
+    setQueryParams(new URLSearchParams(((_a = window === null || window === void 0 ? void 0 : window.location) === null || _a === void 0 ? void 0 : _a.search) || ''));
+  }, []);
+  return /*#__PURE__*/(0, _react.createElement)(as, __assign(__assign({
+    className: (0, _classnames.default)('ncua-btn', "ncua-btn--".concat(size), {
+      'only-icon': onlyIcon,
+      'is-disable': disabled,
+      'has-underline': isAnchorProps(props) ? props.underline : false
+    }, className, hierarchy && "ncua-btn--".concat(hierarchy)),
+    onClick: isAnchorProps(props) ? handleClickLink : undefined,
+    disabled: disabled
+  }, restProps), {
+    ref: ref
+  }), (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [leadingIcon && sideSlotRender(leadingIcon), !onlyIcon && label && (0, _jsxRuntime.jsx)("span", __assign({
+      className: "ncua-btn__label"
+    }, {
+      children: label
+    })), children, trailingIcon && sideSlotRender(trailingIcon)]
+  }));
+});

package/dist/cjs/src/components/button/ButtonCloseX.js

@@ -0,0 +1,44 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ButtonCloseX = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _uiAdminIcon = _interopRequireDefault(require("@ncds/ui-admin-icon"));
+var _classnames = _interopRequireDefault(require("classnames"));
+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 svgSize = {
+  xs: 16,
+  sm: 20,
+  md: 20,
+  lg: 24
+};
+var ButtonCloseX = function (_a) {
+  var size = _a.size,
+    _b = _a.theme,
+    theme = _b === void 0 ? 'light' : _b,
+    className = _a.className,
+    onClick = _a.onClick;
+  return (0, _jsxRuntime.jsx)("button", __assign({
+    className: (0, _classnames.default)('ncua-button-close-x', "ncua-button-close-x--".concat(size), "ncua-button-close-x--".concat(theme), className),
+    onClick: onClick
+  }, {
+    children: (0, _jsxRuntime.jsx)(_uiAdminIcon.default, {
+      name: "x-close",
+      width: svgSize[size],
+      height: svgSize[size]
+    })
+  }));
+};
+exports.ButtonCloseX = ButtonCloseX;

package/dist/cjs/src/components/button/ButtonGroup.js

@@ -0,0 +1,121 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ButtonGroup = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _uiAdminIcon = _interopRequireDefault(require("@ncds/ui-admin-icon"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _react = _interopRequireWildcard(require("react"));
+var _color = require("../../../constant/color");
+var _dot = require("../dot");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+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 svgSize = {
+  xs: 12,
+  sm: 16,
+  md: 16,
+  lg: 20
+};
+var dotSize = {
+  xs: 'sm',
+  sm: 'sm',
+  md: 'md',
+  lg: 'md'
+};
+var ButtonGroup = function (_a) {
+  var children = _a.children,
+    className = _a.className,
+    _b = _a.hasBorder,
+    hasBorder = _b === void 0 ? true : _b,
+    _c = _a.size,
+    size = _c === void 0 ? 'lg' : _c,
+    _d = _a.onlyIcon,
+    onlyIcon = _d === void 0 ? false : _d,
+    _e = _a.disabled,
+    disabled = _e === void 0 ? false : _e;
+  return (0, _jsxRuntime.jsx)("div", __assign({
+    className: (0, _classnames.default)('ncua-button-group', "ncua-button-group--".concat(size), {
+      'has-border': hasBorder
+    }, className)
+  }, {
+    children: _react.default.Children.map(children, function (child) {
+      if (! /*#__PURE__*/_react.default.isValidElement(child)) {
+        return null;
+      }
+      return /*#__PURE__*/_react.default.cloneElement(child, {
+        onlyIcon: onlyIcon,
+        size: size,
+        disabled: disabled || child.props.disabled
+      });
+    })
+  }));
+};
+exports.ButtonGroup = ButtonGroup;
+ButtonGroup.Item = function (_a) {
+  var _b;
+  var _c = _a.as,
+    as = _c === void 0 ? 'button' : _c,
+    label = _a.label,
+    _d = _a.size,
+    size = _d === void 0 ? 'md' : _d,
+    onlyIcon = _a.onlyIcon,
+    icon = _a.icon,
+    disabled = _a.disabled,
+    children = _a.children,
+    isCurrent = _a.isCurrent,
+    props = __rest(_a, ["as", "label", "size", "onlyIcon", "icon", "disabled", "children", "isCurrent"]);
+  var renderIcon = function () {
+    var _a, _b, _c;
+    if (!icon) return null;
+    if (icon.type === 'icon') {
+      return (0, _jsxRuntime.jsx)(_uiAdminIcon.default, {
+        name: icon.icon,
+        width: (_a = icon.size) !== null && _a !== void 0 ? _a : svgSize[size],
+        height: (_b = icon.size) !== null && _b !== void 0 ? _b : svgSize[size],
+        color: icon.color ? _color.COLOR[icon.color] : 'currentColor'
+      });
+    }
+    if (icon.type === 'dot') {
+      return (0, _jsxRuntime.jsx)(_dot.Dot, {
+        color: icon.color,
+        size: (_c = icon.size) !== null && _c !== void 0 ? _c : dotSize[size]
+      });
+    }
+    return icon.children;
+  };
+  var position = (_b = icon === null || icon === void 0 ? void 0 : icon.position) !== null && _b !== void 0 ? _b : 'leading';
+  return /*#__PURE__*/(0, _react.createElement)(as, __assign({
+    className: (0, _classnames.default)('ncua-button-group__item', {
+      'is-disabled': disabled
+    }, {
+      'is-only-icon': onlyIcon
+    }, {
+      'is-current': isCurrent
+    }),
+    disabled: disabled,
+    type: as === 'button' ? 'button' : undefined
+  }, props), (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [position === 'leading' && renderIcon(), !onlyIcon && label, children, position === 'trailing' && renderIcon()]
+  }));
+};

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

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

package/dist/cjs/src/components/carousel/CarouselArrow.js

@@ -0,0 +1,41 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CarouselArrow = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _uiAdminIcon = _interopRequireDefault(require("@ncds/ui-admin-icon"));
+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 CarouselArrow = function (_a) {
+  var _b;
+  var _c = _a.type,
+    type = _c === void 0 ? 'default' : _c,
+    className = _a.className,
+    size = _a.size,
+    chevron = _a.chevron,
+    onClick = _a.onClick;
+  return (0, _jsxRuntime.jsx)("button", __assign({
+    type: "button",
+    className: (0, _classnames.default)('ncua-carousel-arrow', (_b = {}, _b["ncua-carousel-arrow--".concat(type)] = type, _b["ncua-carousel-arrow--".concat(size)] = size, _b["ncua-carousel-arrow--".concat(chevron)] = chevron, _b), className),
+    onClick: onClick
+  }, {
+    children: (0, _jsxRuntime.jsx)(_uiAdminIcon.default, {
+      className: "ncua-carousel-arrow__icon",
+      color: "var(--gray-500)",
+      name: chevron === 'left' ? 'chevron-left' : 'chevron-right'
+    })
+  }));
+};
+exports.CarouselArrow = CarouselArrow;

package/dist/cjs/src/components/carousel/CarouselNumberGroup.js

@@ -0,0 +1,46 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CarouselNumberGroup = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _classnames = _interopRequireDefault(require("classnames"));
+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 CarouselNumberGroup = function (_a) {
+  var _b;
+  var _c = _a.framed,
+    framed = _c === void 0 ? true : _c,
+    _d = _a.size,
+    size = _d === void 0 ? 'sm' : _d,
+    _e = _a.color,
+    color = _e === void 0 ? 'light' : _e,
+    currentPage = _a.currentPage,
+    totalPage = _a.totalPage;
+  return (0, _jsxRuntime.jsxs)("div", __assign({
+    className: (0, _classnames.default)('ncua-carousel-number-group', (_b = {
+      framed: framed
+    }, _b["ncua-carousel-number-group--".concat(color)] = color, _b["ncua-carousel-number-group--".concat(size)] = size, _b))
+  }, {
+    children: [(0, _jsxRuntime.jsx)("span", __assign({
+      className: "ncua-carousel-number-group__number"
+    }, {
+      children: currentPage
+    })), (0, _jsxRuntime.jsxs)("span", __assign({
+      className: "ncua-carousel-number-group__total"
+    }, {
+      children: ["/", totalPage]
+    }))]
+  }));
+};
+exports.CarouselNumberGroup = CarouselNumberGroup;

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

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

package/dist/cjs/src/components/checkbox/Checkbox.js

@@ -0,0 +1,70 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Checkbox = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _CheckboxInput = require("./CheckboxInput");
+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 Checkbox = function (_a) {
+  var _b = _a.size,
+    size = _b === void 0 ? 'sm' : _b,
+    _c = _a.indeterminate,
+    indeterminate = _c === void 0 ? false : _c,
+    text = _a.text,
+    supportText = _a.supportText,
+    disabled = _a.disabled,
+    checked = _a.checked,
+    className = _a.className,
+    checkboxRef = _a.checkboxRef,
+    onChange = _a.onChange,
+    props = __rest(_a, ["size", "indeterminate", "text", "supportText", "disabled", "checked", "className", "checkboxRef", "onChange"]);
+  return (0, _jsxRuntime.jsxs)("label", __assign({
+    className: (0, _classnames.default)('ncua-checkbox-field', "ncua-checkbox-field--".concat(size), {
+      'has-text': text
+    }, className)
+  }, {
+    children: [(0, _jsxRuntime.jsx)(_CheckboxInput.CheckboxInput, __assign({
+      size: size,
+      ref: checkboxRef,
+      checked: checked,
+      indeterminate: indeterminate,
+      disabled: disabled,
+      onChange: onChange,
+      className: "ncua-checkbox-field__input"
+    }, props)), (0, _jsxRuntime.jsx)("span", {
+      children: text && (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+        children: [(0, _jsxRuntime.jsx)("span", __assign({
+          className: "ncua-checkbox-field__text"
+        }, {
+          children: text
+        })), supportText && (0, _jsxRuntime.jsx)("span", __assign({
+          className: "ncua-checkbox-field__support-text"
+        }, {
+          children: supportText
+        }))]
+      })
+    })]
+  }));
+};
+exports.Checkbox = Checkbox;

package/dist/cjs/src/components/checkbox/CheckboxInput.js

@@ -0,0 +1,96 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CheckboxInput = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _react = require("react");
+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;
+};
+/**
+ * 현재 destructive 속성은 현재 디자인 시스템에 존재하지 않으니 사용하지 않는 것을 권장합니다.
+ */
+var CheckboxInput = exports.CheckboxInput = /*#__PURE__*/(0, _react.forwardRef)(function (_a, ref) {
+  var _b = _a.size,
+    size = _b === void 0 ? 'sm' : _b,
+    _c = _a.indeterminate,
+    indeterminate = _c === void 0 ? false : _c,
+    disabled = _a.disabled,
+    className = _a.className,
+    _d = _a.destructive,
+    destructive = _d === void 0 ? false : _d,
+    onChange = _a.onChange,
+    props = __rest(_a, ["size", "indeterminate", "disabled", "className", "destructive", "onChange"]);
+  /**
+   * 체크박스 체크시 나오는 아이콘은 아이콘 컴포넌트와 굵기가 달라 별도로 정의하였습니다.
+   */
+  var checkIcon = (0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: (0, _jsxRuntime.jsx)("svg", __assign({
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "12",
+      height: "12",
+      viewBox: "0 0 12 12",
+      fill: "none"
+    }, {
+      children: (0, _jsxRuntime.jsx)("path", {
+        d: "M10 3L4.5 8.5L2 6",
+        stroke: disabled ? '#D3D4D8' : '#171818',
+        "stroke-width": "1.6666",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round"
+      })
+    }))
+  });
+  var indeterminateIcon = (0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: (0, _jsxRuntime.jsx)("svg", __assign({
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "12",
+      height: "12",
+      viewBox: "0 0 12 12",
+      fill: "none"
+    }, {
+      children: (0, _jsxRuntime.jsx)("path", {
+        d: "M2.5 6H9.5",
+        stroke: disabled ? '#D3D4D8' : '#2F2F30',
+        "stroke-width": "1.66666",
+        "stroke-linecap": "round",
+        "stroke-linejoin": "round"
+      })
+    }))
+  });
+  return (0, _jsxRuntime.jsxs)("span", __assign({
+    className: (0, _classnames.default)('ncua-checkbox-input', "ncua-checkbox-input--".concat(size), {
+      destructive: destructive
+    }, className)
+  }, {
+    children: [(0, _jsxRuntime.jsx)("input", __assign({
+      type: "checkbox",
+      ref: ref,
+      onChange: onChange,
+      disabled: disabled
+    }, props)), (0, _jsxRuntime.jsx)("span", __assign({
+      className: "ncua-checkbox-input__ico"
+    }, {
+      children: !indeterminate ? checkIcon : indeterminateIcon
+    }))]
+  }));
+});

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

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