@ncds/ui-admin 0.0.34 → 0.0.36

package/dist/esm/src/components/toggle/Toggle.js

@@ -0,0 +1,66 @@
+var __assign = this && this.__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 = this && this.__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;
+};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import classNames from 'classnames';
+export var Toggle = function (_a) {
+  var _b = _a.size,
+    size = _b === void 0 ? 'md' : _b,
+    _c = _a.text,
+    text = _c === void 0 ? '' : _c,
+    _d = _a.supportText,
+    supportText = _d === void 0 ? '' : _d,
+    _e = _a.disabled,
+    disabled = _e === void 0 ? false : _e,
+    onChange = _a.onChange,
+    className = _a.className,
+    props = __rest(_a, ["size", "text", "supportText", "disabled", "onChange", "className"]);
+  return _jsxs("label", __assign({
+    className: classNames('ncua-toggle', "ncua-toggle--".concat(size), {
+      'ncua-toggle--disabled': disabled
+    }, className)
+  }, {
+    children: [_jsx("input", __assign({
+      type: "checkbox",
+      className: "ncua-toggle__input",
+      checked: props === null || props === void 0 ? void 0 : props.checked,
+      disabled: disabled,
+      onChange: onChange
+    }, props)), _jsx("span", __assign({
+      className: "ncua-toggle__switch"
+    }, {
+      children: _jsx("span", {
+        className: "ncua-toggle__slider"
+      })
+    })), text && _jsx(_Fragment, {
+      children: _jsxs("span", __assign({
+        className: "ncua-toggle__text-wrapper"
+      }, {
+        children: [_jsx("span", __assign({
+          className: "ncua-toggle__text"
+        }, {
+          children: text
+        })), supportText && _jsx("span", __assign({
+          className: "ncua-toggle__support-text"
+        }, {
+          children: supportText
+        }))]
+      }))
+    })]
+  }));
+};

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

@@ -0,0 +1 @@
+export * from './Toggle';

package/dist/esm/src/components/tooltip/Tooltip.js

@@ -0,0 +1,66 @@
+var __assign = this && this.__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);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { HelpCircle, HelpCircleFill } from '@ncds/ui-admin-icon';
+import classNames from 'classnames';
+var tooltipContent = function (_a) {
+  var title = _a.title,
+    content = _a.content,
+    tooltipType = _a.tooltipType,
+    position = _a.position;
+  return _jsxs("span", __assign({
+    className: classNames("ncua-tooltip__bg", "ncua-tooltip__bg--".concat(tooltipType), "ncua-tooltip__bg--".concat(position))
+  }, {
+    children: [title && _jsx("span", __assign({
+      className: "ncua-tooltip__title"
+    }, {
+      children: title
+    })), content && _jsx("span", {
+      className: "ncua-tooltip__content",
+      dangerouslySetInnerHTML: {
+        __html: content
+      }
+    })]
+  }));
+};
+export var Tooltip = function (_a) {
+  var _b = _a.tooltipType,
+    tooltipType = _b === void 0 ? 'black' : _b,
+    _c = _a.iconType,
+    iconType = _c === void 0 ? 'stroke' : _c,
+    _d = _a.position,
+    position = _d === void 0 ? 'top' : _d,
+    _e = _a.size,
+    size = _e === void 0 ? 'sm' : _e,
+    title = _a.title,
+    content = _a.content,
+    _f = _a.hideArrow,
+    hideArrow = _f === void 0 ? false : _f;
+  var iconSize = size === 'sm' ? 14 : 16;
+  return _jsxs("span", __assign({
+    className: classNames('ncua-tooltip', "ncua-tooltip--".concat(size), "".concat(hideArrow ? 'ncua-tooltip--hidden-arrow' : ''), "".concat(iconType === 'stroke' ? 'ncua-tooltip--stroke' : ''))
+  }, {
+    children: [iconType === 'stroke' ? _jsx(HelpCircle, {
+      width: iconSize,
+      height: iconSize,
+      color: "var(--gray-300"
+    }) : _jsx(HelpCircleFill, {
+      width: iconSize,
+      height: iconSize,
+      color: "var(--gray-300)"
+    }), tooltipContent({
+      tooltipType: tooltipType,
+      position: position,
+      title: title,
+      content: content
+    })]
+  }));
+};

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

@@ -0,0 +1 @@
+export * from './Tooltip';

package/dist/esm/src/constant/breakpoint.js

@@ -0,0 +1,6 @@
+export var BREAKPOINT = {
+  mobile: '768px'
+};
+export var MEDIA_QUERY = {
+  mobile: "(max-width: ".concat(BREAKPOINT.mobile, ")")
+};

package/dist/esm/src/constant/date-picker.js

@@ -0,0 +1,57 @@
+export var PERIOD_ITEM = {
+  TODAY: {
+    text: '오늘',
+    period: 0,
+    unit: 'days'
+  },
+  YESTERDAY: {
+    text: '어제',
+    period: 1,
+    unit: 'days'
+  },
+  '3DAYS': {
+    text: '3일',
+    period: 3,
+    unit: 'days'
+  },
+  '7DAYS': {
+    text: '7일',
+    period: 7,
+    unit: 'days'
+  },
+  '1WEEK': {
+    text: '1주일',
+    period: 1,
+    unit: 'week'
+  },
+  '15DAYS': {
+    text: '15일',
+    period: 15,
+    unit: 'days'
+  },
+  '1MONTHS': {
+    text: '1개월',
+    period: 1,
+    unit: 'months'
+  },
+  '3MONTHS': {
+    text: '3개월',
+    period: 3,
+    unit: 'months'
+  },
+  '1YEAR': {
+    text: '1년',
+    period: 1,
+    unit: 'years'
+  },
+  ENTIRE: {
+    text: '전체',
+    period: 0,
+    unit: null
+  },
+  NONE: {
+    text: '',
+    period: 0,
+    unit: null
+  }
+};

package/dist/esm/src/constant/index.js

@@ -0,0 +1,2 @@
+export * from './size';
+export * from './date-picker';

package/dist/esm/src/constant/size.js

@@ -0,0 +1 @@
+export var MINIMUM_PC_SIZE = 768;

package/dist/esm/src/hooks/useMediaQuery.js

@@ -0,0 +1,22 @@
+import { useEffect, useState } from 'react';
+export var useMediaQuery = function (query, options) {
+  var _a = useState(false),
+    matches = _a[0],
+    setMatches = _a[1];
+  useEffect(function () {
+    var mediaQuery = window.matchMedia(query);
+    setMatches(mediaQuery.matches);
+    var handleChange = function (e) {
+      var _a;
+      setMatches(e.matches);
+      if (e.matches) {
+        (_a = options === null || options === void 0 ? void 0 : options.onMatched) === null || _a === void 0 ? void 0 : _a.call(options);
+      }
+    };
+    mediaQuery.addEventListener('change', handleChange);
+    return function () {
+      mediaQuery.removeEventListener('change', handleChange);
+    };
+  }, [query, options === null || options === void 0 ? void 0 : options.onMatched]);
+  return matches;
+};

package/dist/esm/src/utils/date-picker.js

@@ -0,0 +1,17 @@
+import moment from 'moment';
+export function getDateFormat(date) {
+  if (date === void 0) {
+    date = getToday();
+  }
+  return moment(date).format('YYYY-MM-DD');
+}
+export function getToday() {
+  return moment().toDate();
+}
+export function getSubtractDate(_a) {
+  var _b = _a.date,
+    date = _b === void 0 ? getToday() : _b,
+    period = _a.period,
+    unit = _a.unit;
+  return moment(date).subtract(period, unit).toDate();
+}

package/dist/{temp → types}/src/components/date-picker/DatePicker.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import 'flatpickr/dist/flatpickr.css';
 import { Options } from 'flatpickr/dist/types/options';
 import { DateTimePickerProps, DateTimePickerHandle } from 'react-flatpickr';

package/dist/{temp → types}/src/components/date-picker/RangeDatePicker.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { unitOfTime } from 'moment';
 import { DatePickerProps } from './DatePicker';
 export type RangeDatePickerProps = {

package/dist/{temp → types}/src/components/dropdown/Dropdown.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { IconName } from '@ncds/ui-admin-icon';
 export type AvatarTrigger = {
     type: 'avatar';

package/dist/{temp → types}/src/components/input/PasswordInput.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { InputBaseProps } from './InputBase';
 export declare const PasswordInput: import("react").ForwardRefExoticComponent<InputBaseProps & import("react").RefAttributes<HTMLInputElement>>;
 //# sourceMappingURL=PasswordInput.d.ts.map

package/dist/{temp → types}/src/components/shared/hintText/HintText.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface HintTextProps extends React.HTMLAttributes<HTMLDivElement> {
     as?: React.ElementType;
     destructive?: boolean;

package/dist/{temp → types}/src/components/shared/label/Label.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {
     as?: React.ElementType;
     isRequired?: boolean;