@ncds/ui-admin 0.0.9 → 0.0.11

package/dist/ui-admin/assets/styles/style.css

@@ -80,9 +80,9 @@
   --line-heights-sm: 22;
   --line-heights-xs: 18;
   --line-heights-xxs: 14;
-  --font-weights-commerce-sans-0: regular;
-  --font-weights-commerce-sans-1: medium;
-  --font-weights-commerce-sans-2: bold;
+  --font-weights-commerce-sans-0: 400;
+  --font-weights-commerce-sans-1: 500;
+  --font-weights-commerce-sans-2: 700;
   --font-size-xxs: 11px;
   --font-size-xs: 13px;
   --font-size-sm: 14px;
@@ -153,6 +153,22 @@ table {
   border-spacing: 0;
 }
 
+fieldset {
+  border: 0;
+}
+
+input,
+button,
+select,
+textarea {
+  font: inherit;
+  color: inherit;
+}
+
+button {
+  border: 0;
+}
+
 .a11y {
   position: absolute;
   overflow: hidden;
@@ -1287,13 +1303,6 @@ table {
 .ncua-pagination {
   display: flex;
   align-items: center;
-  justify-content: center;
-}
-.ncua-pagination__list {
-  display: flex;
-  align-items: center;
-  margin: 0;
-  padding: 0;
 }
 .ncua-pagination__before {
   margin-inline: 4px 8px;
@@ -1312,6 +1321,8 @@ table {
   height: 32px;
   border-radius: 8px;
   border: 0;
+  background-color: transparent;
+  color: var(--gray-500);
   cursor: pointer;
 }
 .ncua-pagination__page-num:hover, .ncua-pagination__page-num:focus, .ncua-pagination__page-num.is-current {
@@ -1324,33 +1335,41 @@ table {
   outline: none;
   box-shadow: var(--focus-ring-4px-gray-100);
 }
-.ncua-pagination__page-info {
-  display: none;
-}
 .ncua-pagination__next {
   margin-inline: 8px 4px;
 }
-@media (max-width: 768px) {
-  .ncua-pagination {
-    justify-content: space-between;
-  }
-  .ncua-pagination__list {
-    display: none;
-  }
-  .ncua-pagination__first, .ncua-pagination__last {
-    display: none;
-  }
-  .ncua-pagination__page-info {
-    display: flex;
-    align-items: center;
-    margin: 0;
-    font-size: 14px;
-    color: var(--gray-400);
-  }
-  .ncua-pagination__current-num {
-    font-style: normal;
-    color: var(--gray-700);
-  }
+.ncua-pagination--pc {
+  justify-content: center;
+}
+.ncua-pagination--pc .ncua-pagination__list {
+  display: flex;
+  align-items: center;
+  margin: 0;
+  padding: 0;
+}
+.ncua-pagination--pc .ncua-pagination__page-info {
+  display: none;
+}
+.ncua-pagination--mo {
+  justify-content: space-between;
+}
+.ncua-pagination--mo .ncua-pagination__list {
+  display: none;
+}
+.ncua-pagination--mo .ncua-pagination__first,
+.ncua-pagination--mo .ncua-pagination__last {
+  display: none;
+}
+.ncua-pagination--mo .ncua-pagination__page-info {
+  display: flex;
+  align-items: center;
+  margin: 0;
+  font-size: 14px;
+  color: var(--gray-400);
+}
+.ncua-pagination--mo .ncua-pagination__current-num {
+  font-style: normal;
+  color: var(--gray-700);
 }
 
 @keyframes ncua-spinner-rotate {
@@ -1435,4 +1454,175 @@ table {
   height: 100vh;
   background-color: rgba(0, 0, 0, 0.5);
   z-index: 200;
+}
+
+.ncua-date-picker {
+  position: relative;
+}
+.ncua-date-picker .flatpickr-wrapper {
+  border: 1px solid var(--gray-200);
+  border-radius: 6px;
+  font-weight: 400;
+  background: var(--base-white);
+  box-shadow: var(--shadow-xs);
+  color: var(--gray-700);
+}
+.ncua-date-picker .flatpickr-wrapper:focus-within {
+  border-color: var(--gray-400);
+}
+.ncua-date-picker__input {
+  width: 100%;
+  height: 100%;
+  padding: 0;
+  border: 0;
+  outline: none;
+  color: inherit;
+  font: inherit;
+}
+.ncua-date-picker__input::placeholder {
+  color: var(--gray-700);
+}
+.ncua-date-picker__input:disabled {
+  background-color: var(--gray-50);
+  border-color: var(--gray-200);
+  cursor: default;
+}
+.ncua-date-picker__input:disabled::placeholder {
+  color: var(--gray-300);
+}
+.ncua-date-picker__ico {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: auto;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding-right: 12px;
+}
+.ncua-date-picker .flatpickr-calendar {
+  max-height: none;
+  padding-block-start: 12px;
+}
+.ncua-date-picker .flatpickr-current-month .flatpickr-monthDropdown-months,
+.ncua-date-picker .numInputWrapper .cur-year {
+  font-size: var(--font-size-sm);
+  font-weight: 700;
+  line-height: 22px;
+}
+.ncua-date-picker .numInputWrapper .cur-year {
+  margin-inline-start: 4px;
+  transform: translateY(2px);
+}
+.ncua-date-picker .numInputWrapper span {
+  opacity: 1;
+}
+.ncua-date-picker .flatpickr-months {
+  justify-content: space-between;
+  margin-inline: auto;
+  margin-block-end: 12px;
+}
+.ncua-date-picker .flatpickr-months .flatpickr-prev-month,
+.ncua-date-picker .flatpickr-months .flatpickr-next-month {
+  position: initial;
+  width: 36px;
+  height: 36px;
+}
+.ncua-date-picker .flatpickr-months .flatpickr-month {
+  overflow: visible;
+  flex: none;
+}
+.ncua-date-picker .flatpickr-current-month {
+  position: initial;
+  width: auto;
+  display: flex;
+  gap: 4px;
+}
+.ncua-date-picker .flatpickr-monthDropdown-months {
+  margin: 0;
+  padding: 0;
+}
+.ncua-date-picker .flatpickr-innerContainer {
+  justify-content: center;
+}
+.ncua-date-picker .flatpickr-weekdays {
+  margin-inline: auto;
+}
+.ncua-date-picker .dayContainer {
+  row-gap: 4px;
+}
+.ncua-date-picker .flatpickr-days {
+  justify-content: center;
+  padding-block-end: 12px;
+}
+.ncua-date-picker .flatpickr-day:hover {
+  background-color: var(--gray-50);
+  border-color: var(--gray-50);
+}
+.ncua-date-picker .flatpickr-day.selected {
+  background-color: var(--gray-500);
+  border-color: var(--gray-500);
+}
+.ncua-date-picker .flatpickr-day.today {
+  border-color: var(--gray-600);
+}
+.ncua-date-picker--sm .flatpickr-wrapper {
+  width: 138px;
+  height: 28px;
+  padding: 5px 10px;
+  font-size: var(--font-size-xs);
+}
+.ncua-date-picker--md .flatpickr-wrapper {
+  width: 156px;
+  height: 36px;
+  padding: 7px 12px;
+  font-size: var(--font-size-sm);
+}
+.ncua-date-picker--sm .flatpickr-calendar {
+  width: 248px;
+}
+.ncua-date-picker--sm .flatpickr-months,
+.ncua-date-picker--sm .flatpickr-weekdays,
+.ncua-date-picker--sm .flatpickr-days {
+  width: 224px;
+}
+.ncua-date-picker--sm .dayContainer {
+  max-width: 224px;
+  min-width: 224px;
+  column-gap: 0;
+  font-size: 13px;
+}
+.ncua-date-picker--sm .flatpickr-day {
+  max-width: 32px;
+  width: 32px;
+  height: 32px;
+  line-height: 32px;
+}
+.ncua-date-picker--md .flatpickr-calendar {
+  width: 343px;
+}
+.ncua-date-picker--md .flatpickr-months,
+.ncua-date-picker--md .flatpickr-weekdays,
+.ncua-date-picker--md .flatpickr-days {
+  width: 311px;
+}
+.ncua-date-picker--md .dayContainer {
+  max-width: 311px;
+  min-width: 311px;
+  column-gap: 9.83px;
+  font-size: 14px;
+}
+.ncua-date-picker--md .flatpickr-day {
+  max-width: 36px;
+  width: 36px;
+  height: 36px;
+  line-height: 36px;
+}
+.ncua-date-picker--disabled .flatpickr-wrapper,
+.ncua-date-picker--disabled .ncua-date-picker__input {
+  background-color: var(--gray-50);
+}
+.ncua-date-picker--disabled .ncua-date-picker__input {
+  color: var(--gray-300);
 }

package/dist/ui-admin/index.d.ts

@@ -1,5 +1,6 @@
 export * from './src/components/button';
 export * from './src/components/checkbox';
+export * from './src/components/date-picker';
 export * from './src/components/input';
 export * from './src/components/pagination';
 export * from './src/components/radio';

package/dist/ui-admin/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,kCAAkC,CAAC;AACjD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,kCAAkC,CAAC;AACjD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,kBAAkB,CAAC"}

package/dist/ui-admin/index.js

@@ -25,6 +25,17 @@ Object.keys(_checkbox).forEach(function (key) {
     }
   });
 });
+var _datePicker = require("./src/components/date-picker");
+Object.keys(_datePicker).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _datePicker[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _datePicker[key];
+    }
+  });
+});
 var _input = require("./src/components/input");
 Object.keys(_input).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/dist/ui-admin/src/components/date-picker/DatePicker.d.ts

@@ -0,0 +1,13 @@
+import 'flatpickr/dist/flatpickr.css';
+import { Options } from 'flatpickr/dist/types/options';
+import { DateTimePickerProps } from 'react-flatpickr';
+import { Size } from '../../../constant/size';
+export type DatePickerProps = {
+    size?: Extract<Size, 'sm' | 'md'>;
+    shouldFocus?: boolean;
+    currentDate: string;
+    datePickerOptions?: Options;
+    onChangeDate: (date: string) => void;
+} & Omit<DateTimePickerProps, 'size' | 'options' | 'value'>;
+export declare const DatePicker: ({ shouldFocus, currentDate, size, onChangeDate, datePickerOptions, ...attrs }: DatePickerProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DatePicker.d.ts.map

package/dist/ui-admin/src/components/date-picker/DatePicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../../../src/components/date-picker/DatePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,8BAA8B,CAAC;AAEtC,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAC;AAEvD,OAAkB,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAEjE,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,CAAC,EAAE,OAAO,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC,CAAC;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC,GAAG,IAAI,CAAC,mBAAmB,EAAE,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC,CAAC;AAE5D,eAAO,MAAM,UAAU,kFAOpB,eAAe,4CA4CjB,CAAC"}

package/dist/ui-admin/src/components/date-picker/DatePicker.js

@@ -0,0 +1,87 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DatePicker = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var _classnames = _interopRequireDefault(require("classnames"));
+require("flatpickr/dist/flatpickr.css");
+var _ko = require("flatpickr/dist/l10n/ko");
+var _react = require("react");
+var _reactFlatpickr = _interopRequireDefault(require("react-flatpickr"));
+var _color = require("../../../constant/color");
+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 DatePicker = function (_a) {
+  var _b = _a.shouldFocus,
+    shouldFocus = _b === void 0 ? true : _b,
+    currentDate = _a.currentDate,
+    _c = _a.size,
+    size = _c === void 0 ? 'sm' : _c,
+    onChangeDate = _a.onChangeDate,
+    datePickerOptions = _a.datePickerOptions,
+    attrs = __rest(_a, ["shouldFocus", "currentDate", "size", "onChangeDate", "datePickerOptions"]);
+  var ref = (0, _react.useRef)(null);
+  var onChangeDateHandler = function (dateTimeStamp, dateStr) {
+    return onChangeDate(dateStr);
+  };
+  var options = __assign({
+    mode: 'single',
+    static: true,
+    locale: _ko.Korean,
+    dateFormat: 'Y-m-d',
+    clickOpens: true,
+    onChange: onChangeDateHandler,
+    allowInvalidPreload: true
+  }, datePickerOptions);
+  var svgSize = size === 'sm' ? 14 : 16;
+  return (0, _jsxRuntime.jsxs)("div", __assign({
+    className: (0, _classnames.default)('ncua-date-picker', "ncua-date-picker--".concat(size), {
+      'ncua-date-picker--disabled': attrs.disabled
+    })
+  }, {
+    children: [(0, _jsxRuntime.jsx)(_reactFlatpickr.default, __assign({}, attrs, {
+      ref: ref,
+      className: (0, _classnames.default)('ncua-date-picker__input'),
+      options: options,
+      value: currentDate
+    })), (0, _jsxRuntime.jsx)("span", __assign({
+      className: "ncua-date-picker__ico"
+    }, {
+      children: (0, _jsxRuntime.jsx)("svg", __assign({
+        xmlns: "http://www.w3.org/2000/svg",
+        width: svgSize,
+        height: svgSize,
+        viewBox: "0 0 16 16",
+        fill: "none"
+      }, {
+        children: (0, _jsxRuntime.jsx)("path", {
+          d: "M14 6.66671H2M10.6667 1.33337V4.00004M5.33333 1.33337V4.00004M5.2 14.6667H10.8C11.9201 14.6667 12.4802 14.6667 12.908 14.4487C13.2843 14.257 13.5903 13.951 13.782 13.5747C14 13.1469 14 12.5868 14 11.4667V5.86671C14 4.7466 14 4.18655 13.782 3.75873C13.5903 3.3824 13.2843 3.07644 12.908 2.88469C12.4802 2.66671 11.9201 2.66671 10.8 2.66671H5.2C4.0799 2.66671 3.51984 2.66671 3.09202 2.88469C2.71569 3.07644 2.40973 3.3824 2.21799 3.75873C2 4.18655 2 4.7466 2 5.86671V11.4667C2 12.5868 2 13.1469 2.21799 13.5747C2.40973 13.951 2.71569 14.257 3.09202 14.4487C3.51984 14.6667 4.0799 14.6667 5.2 14.6667Z",
+          stroke: attrs.disabled ? _color.COLOR.gray300 : 'black',
+          strokeWidth: "1.33333",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        })
+      }))
+    }))]
+  }));
+};
+exports.DatePicker = DatePicker;

package/dist/ui-admin/src/components/date-picker/index.d.ts

@@ -0,0 +1,2 @@
+export * from './DatePicker';
+//# sourceMappingURL=index.d.ts.map

package/dist/ui-admin/src/components/date-picker/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/date-picker/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/ui-admin/src/components/date-picker/index.js

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

package/dist/ui-admin/src/components/index.d.ts

@@ -1,5 +1,6 @@
 export * from './button';
 export * from './checkbox';
+export * from './date-picker';
 export * from './input';
 export * from './pagination';
 export * from './radio';

package/dist/ui-admin/src/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC"}

package/dist/ui-admin/src/components/index.js

@@ -25,6 +25,17 @@ Object.keys(_checkbox).forEach(function (key) {
     }
   });
 });
+var _datePicker = require("./date-picker");
+Object.keys(_datePicker).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _datePicker[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _datePicker[key];
+    }
+  });
+});
 var _input = require("./input");
 Object.keys(_input).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/dist/ui-admin/src/components/pagination/Pagination.d.ts

@@ -4,6 +4,7 @@ type CommonPaginationProps = {
     itemCountPerPage?: number;
     pageCount?: number;
     currentPage: number;
+    breakPoint?: 'pc' | 'mo';
     onPageChange?: (page: number) => void;
 };
 type PaginationButtonProps = CommonPaginationProps & {
@@ -17,6 +18,6 @@ type PaginationAnchorProps = CommonPaginationProps & {
     target?: string;
 };
 type PaginationProps = PaginationButtonProps | PaginationAnchorProps;
-export declare const Pagination: ({ className, totalCount, itemCountPerPage, pageCount, currentPage, as, onPageChange, ...restProps }: PaginationProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Pagination: ({ className, totalCount, itemCountPerPage, pageCount, currentPage, as, breakPoint, onPageChange, ...restProps }: PaginationProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=Pagination.d.ts.map

package/dist/ui-admin/src/components/pagination/Pagination.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../../../src/components/pagination/Pagination.tsx"],"names":[],"mappings":"AAMA,KAAK,qBAAqB,GAAG;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC,CAAC;AAEF,KAAK,qBAAqB,GAAG,qBAAqB,GAAG;IACnD,EAAE,CAAC,EAAE,QAAQ,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,MAAM,CAAC,EAAE,KAAK,CAAC;CAChB,CAAC;AAEF,KAAK,qBAAqB,GAAG,qBAAqB,GAAG;IACnD,EAAE,EAAE,GAAG,CAAC;IACR,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,KAAK,eAAe,GAAG,qBAAqB,GAAG,qBAAqB,CAAC;AAIrE,eAAO,MAAM,UAAU,wGASpB,eAAe,4CAwHjB,CAAC"}
+{"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../../../src/components/pagination/Pagination.tsx"],"names":[],"mappings":"AAMA,KAAK,qBAAqB,GAAG;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC,CAAC;AAEF,KAAK,qBAAqB,GAAG,qBAAqB,GAAG;IACnD,EAAE,CAAC,EAAE,QAAQ,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,MAAM,CAAC,EAAE,KAAK,CAAC;CAChB,CAAC;AAEF,KAAK,qBAAqB,GAAG,qBAAqB,GAAG;IACnD,EAAE,EAAE,GAAG,CAAC;IACR,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,KAAK,eAAe,GAAG,qBAAqB,GAAG,qBAAqB,CAAC;AAIrE,eAAO,MAAM,UAAU,oHAUpB,eAAe,4CAuHjB,CAAC"}

package/dist/ui-admin/src/components/pagination/Pagination.js

@@ -41,20 +41,21 @@ var Pagination = function (_a) {
     currentPage = _a.currentPage,
     _e = _a.as,
     as = _e === void 0 ? 'button' : _e,
+    _f = _a.breakPoint,
+    breakPoint = _f === void 0 ? 'pc' : _f,
     onPageChange = _a.onPageChange,
-    restProps = __rest(_a, ["className", "totalCount", "itemCountPerPage", "pageCount", "currentPage", "as", "onPageChange"]);
+    restProps = __rest(_a, ["className", "totalCount", "itemCountPerPage", "pageCount", "currentPage", "as", "breakPoint", "onPageChange"]);
   var totalPage = Math.ceil(totalCount / itemCountPerPage);
-  var _f = (0, _react.useState)(1),
-    start = _f[0],
-    setStart = _f[1];
-  var _g = (0, _react.useState)(globalThis.innerWidth > _constant.MINIMUM_PC_SIZE),
-    isPC = _g[0],
-    setIsPC = _g[1];
+  var _g = (0, _react.useState)(1),
+    start = _g[0],
+    setStart = _g[1];
+  var _h = (0, _react.useState)(globalThis.innerWidth > _constant.MINIMUM_PC_SIZE),
+    isPC = _h[0],
+    setIsPC = _h[1];
   var noPrev = start === 1;
   var noNext = start + pageCount - 1 >= totalPage;
   var showJumpPageButton = totalPage > pageCount;
   var handleClickButton = function (pageNum) {
-    (0, _lodashEs.isFunction)(onPageChange);
     if ((0, _lodashEs.isFunction)(onPageChange)) {
       onPageChange(pageNum);
     }
@@ -91,7 +92,7 @@ var Pagination = function (_a) {
   }, []);
   return (0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
     children: (0, _jsxRuntime.jsxs)("div", __assign({
-      className: (0, _classnames.default)('ncua-pagination', className)
+      className: (0, _classnames.default)('ncua-pagination', "ncua-pagination--".concat(breakPoint), className)
     }, {
       children: [showJumpPageButton && (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
         children: [(0, _NavButton.NavButton)({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ncds/ui-admin",
-  "version": "0.0.9",
+  "version": "0.0.11",
   "description": "nhn-commerce의 어드민 디자인 시스템입니다.",
   "scripts": {
     "barrel": "node barrel.js",
@@ -64,6 +64,7 @@
     "@ncds/types-layout": "^1.0.0",
     "@ncds/ui-admin-icon": "0.0.14",
     "classnames": "^2.3.2",
+    "react-flatpickr": "^4.0.10",
     "swiper": "^11.1.1"
   },
   "devDependencies": {
@@ -75,6 +76,7 @@
     "@types/node": "^20.4.5",
     "@types/react": "^18.2.18",
     "@types/react-dom": "^18.2.7",
+    "@types/react-flatpickr": "^3.8.11",
     "babel-loader": "^9.1.3",
     "babel-plugin-named-exports-order": "^0.0.2",
     "const": "*",

package/dist/ui-admin/src/components/input/FileInput.d.ts

@@ -1 +0,0 @@
-//# sourceMappingURL=FileInput.d.ts.map

package/dist/ui-admin/src/components/input/FileInput.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FileInput.d.ts","sourceRoot":"","sources":["../../../../../src/components/input/FileInput.tsx"],"names":[],"mappings":""}

package/dist/ui-admin/src/components/input/FileInput.js

@@ -1 +0,0 @@
-"use strict";