@cashub/ui-elv 1.0.1 → 1.0.3

package/datetimePicker/hooks/index.js

@@ -1,27 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "useChangeNumber", {
-  enumerable: true,
-  get: function () {
-    return _useChangeNumber.default;
-  }
-});
-Object.defineProperty(exports, "useDecrease", {
-  enumerable: true,
-  get: function () {
-    return _useDecrease.default;
-  }
-});
-Object.defineProperty(exports, "useIncrease", {
-  enumerable: true,
-  get: function () {
-    return _useIncrease.default;
-  }
-});
-var _useIncrease = _interopRequireDefault(require("./useIncrease"));
-var _useDecrease = _interopRequireDefault(require("./useDecrease"));
-var _useChangeNumber = _interopRequireDefault(require("./useChangeNumber"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/datetimePicker/hooks/useChangeNumber.js

@@ -1,42 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = require("react");
-var _utils = require("@cashub/utils");
-const useChangeNumber = (min, max, setState, name) => {
-  return (0, _react.useCallback)(number => {
-    let value = String(number);
-
-    // update value when value is a valid value
-    if (value.length > 0) {
-      // if value is not a integer, then remove last char
-      if (!(0, _utils.isInteger)(value)) {
-        value = value.substring(0, value.length - 1);
-      }
-
-      // use min value instead when exceed minimum
-      if (value.length >= String(min).length && value < min) {
-        value = min;
-      }
-
-      // use max value instead when exceed maximum
-      if (value > max) {
-        value = max;
-      }
-    }
-    setState(previous => {
-      if (name && typeof previous === 'object') {
-        const newState = {
-          ...previous
-        };
-        newState[name] = value;
-        return newState;
-      }
-      return value;
-    });
-  }, [min, max, setState, name]);
-};
-var _default = exports.default = useChangeNumber;

package/datetimePicker/hooks/useDecrease.js

@@ -1,38 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = require("react");
-var _pad = _interopRequireDefault(require("../utils/pad"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const useDecrease = function (min, max, setState) {
-  let config = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
-  const {
-    name,
-    length,
-    padString
-  } = config;
-  return (0, _react.useCallback)(() => {
-    setState(previous => {
-      if (name && typeof previous === 'object') {
-        let value = parseInt(previous[name], 10) - 1;
-        if (value < min) {
-          value = max;
-        }
-        const newState = {
-          ...previous
-        };
-        newState[name] = (0, _pad.default)(value, length, padString);
-        return newState;
-      }
-      let value = parseInt(previous, 10) - 1;
-      if (value < min) {
-        value = max;
-      }
-      return (0, _pad.default)(value, length, padString);
-    });
-  }, [min, max, setState, name, length, padString]);
-};
-var _default = exports.default = useDecrease;

package/datetimePicker/hooks/useIncrease.js

@@ -1,38 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = require("react");
-var _pad = _interopRequireDefault(require("../utils/pad"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const useIncrease = function (min, max, setState) {
-  let config = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
-  const {
-    name,
-    length,
-    padString
-  } = config;
-  return (0, _react.useCallback)(() => {
-    setState(previous => {
-      if (name && typeof previous === 'object') {
-        let value = parseInt(previous[name], 10) + 1;
-        if (value > max) {
-          value = min;
-        }
-        const newState = {
-          ...previous
-        };
-        newState[name] = (0, _pad.default)(value, length, padString);
-        return newState;
-      }
-      let value = parseInt(previous, 10) + 1;
-      if (value > max) {
-        value = min;
-      }
-      return (0, _pad.default)(value, length, padString);
-    });
-  }, [min, max, setState, name, length, padString]);
-};
-var _default = exports.default = useIncrease;

package/datetimePicker/subComponent/Accordion.js

@@ -1,373 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = require("react");
-var _md = require("react-icons/md");
-var _io = require("react-icons/io");
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
-var _utils = require("@cashub/utils");
-var _scrollbar = _interopRequireDefault(require("../../styles/mixin/scrollbar"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-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; }
-const monthArr = [{
-  number: '01',
-  name: 'Jan'
-}, {
-  number: '02',
-  name: 'Feb'
-}, {
-  number: '03',
-  name: 'Mar'
-}, {
-  number: '04',
-  name: 'Apr'
-}, {
-  number: '05',
-  name: 'May'
-}, {
-  number: '06',
-  name: 'Jun'
-}, {
-  number: '07',
-  name: 'Jul'
-}, {
-  number: '08',
-  name: 'Aug'
-}, {
-  number: '09',
-  name: 'Sep'
-}, {
-  number: '10',
-  name: 'Oct'
-}, {
-  number: '11',
-  name: 'Nov'
-}, {
-  number: '12',
-  name: 'Dec'
-}];
-const Accordion = _ref => {
-  let {
-    type,
-    handleDisplayAccordionContent,
-    handleChangeTitle,
-    setCurrentDisplayType,
-    currentDisplayType,
-    selectedYear,
-    setSelectedYear,
-    selectedMonth,
-    setSelectedMonth,
-    fixedYear,
-    minDate,
-    maxDate,
-    selectedDay
-  } = _ref;
-  const bodyRef = (0, _react.useRef)(null);
-  const selectedYearRef = (0, _react.useRef)(null);
-  const [display, setDisplay] = (0, _react.useState)(false);
-  const [yearArr, setYearArr] = (0, _react.useState)([]);
-  const minYear = minDate ? new Date(minDate).getFullYear() : 1;
-  const minMonth = minDate ? new Date(minDate).getMonth() : null;
-  const maxYear = maxDate ? new Date(maxDate).getFullYear() : null;
-  const maxMonth = maxDate ? new Date(maxDate).getMonth() : null;
-  const accordionTitle = () => {
-    if (type === 'year') {
-      return selectedYear ? selectedYear : new Date().getFullYear();
-    } else if (type === 'month') {
-      return monthArr[selectedMonth ? selectedMonth : new Date().getMonth()]?.name;
-    }
-  };
-  const handleChangeMonth = (0, _react.useCallback)(month => {
-    setSelectedMonth(month);
-    setCurrentDisplayType(null);
-  }, [setCurrentDisplayType, setSelectedMonth]);
-  const handleChangeYear = (0, _react.useCallback)(year => {
-    setSelectedYear(year);
-    setCurrentDisplayType(null);
-  }, [setCurrentDisplayType, setSelectedYear]);
-  const handleYearItemDisable = (0, _react.useCallback)(year => {
-    if (minDate !== undefined && maxDate !== undefined) {
-      return !(minYear <= year && year <= maxYear);
-    }
-    if (minDate) {
-      return minYear > year;
-    } else if (maxDate) {
-      return maxYear < year;
-    }
-    return false;
-  }, [minYear, maxYear, maxDate, minDate]);
-  const handleMonthItemDisable = (0, _react.useCallback)(month => {
-    const date = (0, _utils.formatDate)(new Date(selectedYear, month, selectedDay));
-    if (minDate !== undefined && maxDate !== undefined) {
-      return !(minDate <= date && date <= maxDate);
-    } else if (minDate) {
-      return !(minDate <= date);
-    } else if (maxDate) {
-      return !(date <= maxDate);
-    }
-    return false;
-  }, [maxDate, minDate, selectedYear, selectedDay]);
-  const handleDisableArrow = (0, _react.useCallback)(arrowType => {
-    if (type === 'year') {
-      if (arrowType === 'previous') {
-        return minYear > selectedYear - 1;
-      } else if (arrowType === 'next') {
-        if (maxYear) {
-          return maxYear < selectedYear + 1;
-        }
-        return false;
-      }
-    } else if (type === 'month') {
-      const date = arrowType === 'previous' ? (0, _utils.formatDate)(new Date(selectedYear, selectedMonth - 1 < 0 ? 11 : selectedMonth - 1, 1)) : (0, _utils.formatDate)(new Date(selectedYear, selectedMonth + 1 > 11 ? 0 : selectedMonth + 1, 1));
-      if (fixedYear) {
-        if (fixedYear && !minDate && !maxDate) {
-          return false;
-        }
-      } else if (!minDate && !maxDate) {
-        return false;
-      } else {
-        const minDate1st = (0, _utils.formatDate)(new Date(minYear, minMonth, 1));
-        const maxDate1st = (0, _utils.formatDate)(new Date(maxYear, maxMonth, 1));
-        if (minDate && !maxDate) {
-          return !(minDate1st <= date);
-        } else if (maxDate && !minDate) {
-          return !(maxDate1st >= date);
-        } else if (minDate && maxDate) {
-          return !(minDate1st <= date && maxDate1st >= date);
-        }
-      }
-    }
-  }, [minDate, selectedYear, selectedMonth, minYear, type, fixedYear, maxDate, maxYear, maxMonth, minMonth]);
-  const MonthContent = (0, _react.useMemo)(() => {
-    return monthArr.map((month, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Item, {
-      selected: selectedMonth === index,
-      onClick: () => {
-        handleChangeMonth(index);
-      },
-      disabled: handleMonthItemDisable(index),
-      children: month.name
-    }, month.number));
-  }, [handleChangeMonth, selectedMonth, handleMonthItemDisable]);
-  const YearContent = (0, _react.useMemo)(() => {
-    return yearArr.map((year, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Item, {
-      ref: selectedYear === year ? selectedYearRef : null,
-      selected: selectedYear === year,
-      onClick: () => {
-        handleChangeYear(year);
-      },
-      disabled: handleYearItemDisable(year),
-      children: year
-    }, index));
-  }, [selectedYear, yearArr, handleChangeYear, handleYearItemDisable]);
-  (0, _react.useEffect)(() => {
-    if (!fixedYear) {
-      const start = selectedYear - 16 ? selectedYear - 16 : 1;
-      const end = selectedYear + 16;
-      const yearRange = (0, _utils.generateRange)(start, end);
-      setYearArr(yearRange);
-    }
-  }, [fixedYear, selectedYear]);
-  const scroll = (0, _react.useCallback)(() => {
-    if (bodyRef?.current && selectedYearRef?.current) {
-      const body = bodyRef.current;
-      if (body.scrollTop < 200) {
-        body.removeEventListener('scroll', scroll);
-        setTimeout(() => {
-          body.scrollTo({
-            top: body.scrollTop + 200
-          });
-        }, 400);
-        setTimeout(() => {
-          setYearArr(previousParams => {
-            body.addEventListener('scroll', scroll);
-            const addYearRange = (0, _utils.generateRange)(previousParams[0] - 15, previousParams[0] - 1);
-            return [...addYearRange, ...previousParams];
-          });
-        }, 400);
-      } else if (body.scrollTop + body.clientHeight >= body.scrollHeight) {
-        body.removeEventListener('scroll', scroll);
-        setTimeout(() => {
-          setYearArr(previousParams => {
-            body.addEventListener('scroll', scroll);
-            const addYearRange = (0, _utils.generateRange)(previousParams[previousParams.length - 1] + 1, previousParams[previousParams.length - 1] + 15);
-            return [...previousParams, ...addYearRange];
-          });
-        }, 400);
-      }
-    }
-  }, []);
-  (0, _react.useEffect)(() => {
-    bodyRef.current.addEventListener('scroll', scroll);
-  }, [scroll]);
-  (0, _react.useEffect)(() => {
-    setDisplay(currentDisplayType === type);
-  }, [currentDisplayType, type]);
-  (0, _react.useEffect)(() => {
-    if (display && bodyRef?.current && currentDisplayType === 'year' && selectedYearRef?.current) {
-      bodyRef.current.scrollTo({
-        top: selectedYearRef.current.offsetTop - bodyRef.current.offsetTop
-      });
-    }
-  }, [currentDisplayType, display]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(Header, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, {
-        onClick: () => {
-          handleChangeTitle('previous');
-        },
-        disabled: handleDisableArrow('previous'),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_md.MdArrowBackIosNew, {})
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        children: accordionTitle()
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, {
-        onClick: () => {
-          handleChangeTitle('next');
-        },
-        disabled: handleDisableArrow('next'),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_md.MdArrowForwardIos, {})
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(IconButton, {
-        $display: display,
-        right: true,
-        onClick: handleDisplayAccordionContent,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_io.IoMdArrowDropup, {})
-      })]
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(Body, {
-      fixedYear: !fixedYear,
-      ref: bodyRef,
-      type: type,
-      $display: display,
-      children: [type === 'month' && MonthContent, type === 'year' && YearContent]
-    })]
-  });
-};
-const IconButton = _styledComponents.default.button`
-  width: 36px;
-  height: 36px;
-  background: var(--color-background1);
-  border: none;
-  color: var(--font-on-background);
-  padding: 0;
-  transition: 0.3s;
-
-  &:hover {
-    color: var(--color-primary);
-  }
-
-  ${_ref2 => {
-  let {
-    disabled
-  } = _ref2;
-  return disabled && (0, _styledComponents.css)`
-      opacity: 0.5;
-
-      &:hover {
-        color: var(--font-on-background);
-      }
-    `;
-}}
-
-  ${_ref3 => {
-  let {
-    right,
-    $display
-  } = _ref3;
-  return right && `
-    position: absolute;
-    right: 0;
-    ${$display && (0, _styledComponents.css)`
-        transform: rotate(180deg);
-      `}
-  `;
-}}
-`;
-const Header = _styledComponents.default.div`
-  display: flex;
-  justify-content: center;
-  align-content: center;
-  position: relative;
-
-  > div {
-    width: 72px;
-    line-height: 36px;
-    text-align: center;
-  }
-
-  &::before {
-    content: '';
-    border-bottom: var(--border-width) solid var(--border-color);
-    position: absolute;
-    width: 300px;
-    bottom: 0;
-    z-index: 1;
-    right: -16px;
-  }
-`;
-const Body = _styledComponents.default.div`
-  flex-wrap: wrap;
-  height: 0;
-  width: 100%;
-  display: ${_ref4 => {
-  let {
-    $display
-  } = _ref4;
-  return $display ? 'flex' : 'none';
-}};
-  ${_ref5 => {
-  let {
-    type,
-    fixedYear
-  } = _ref5;
-  return type && (0, _styledComponents.css)`
-      min-height: ${type === 'year' ? '197' : fixedYear ? '144' : '192'}px};
-      transition: .3s;
-      
-      ${type === 'year' && (0, _styledComponents.css)`
-          overflow-y: scroll;
-          gap: 12px 0;
-          ${_scrollbar.default}
-        `};
-  `;
-}}
-
-  transition: 0.3s;
-`;
-const Item = _styledComponents.default.button`
-  width: 84px;
-  height: 36px;
-  line-height: 36px;
-  text-align: center;
-  border-radius: var(--border-radius-s);
-  padding: 0;
-  border: none;
-  color: var(--font-on-background);
-  background: var(--color-background1);
-
-  &:hover {
-    ${_ref6 => {
-  let {
-    disabled
-  } = _ref6;
-  return !disabled && 'background: var(--color-primary)';
-}}
-  }
-
-  ${_ref7 => {
-  let {
-    disabled
-  } = _ref7;
-  return disabled && 'color: var(--font-on-mute)';
-}}
-
-  ${_ref8 => {
-  let {
-    selected
-  } = _ref8;
-  return selected && 'background: var(--color-hover)';
-}}
-`;
-var _default = exports.default = Accordion;

package/datetimePicker/subComponent/CustomTimeInput.js

@@ -1,47 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = require("react");
-var _jsxRuntime = require("react/jsx-runtime");
-const CustomTimeInput = _ref => {
-  let {
-    date,
-    onCustomChange
-  } = _ref;
-  const [time, setTime] = (0, _react.useState)('');
-  const changeDate = () => {
-    let hh = '';
-    let mm = '';
-    let ss = '';
-    if (time.indexOf(':') !== -1) {
-      [hh, mm, ss] = time.split(':');
-    } else {
-      hh = time.substring(0, 2);
-      mm = time.substring(2, 4);
-      ss = time.substring(4, 6);
-    }
-    const targetDate = date instanceof Date && !isNaN(date) ? date : new Date();
-    targetDate.setHours(Number(hh) || 0, Number(mm) || 0, Number(ss) || 0);
-    onCustomChange(targetDate);
-  };
-  (0, _react.useEffect)(() => {
-    const defaultTime = date instanceof Date && !isNaN(date) ?
-    // Getting time from Date beacuse `value` comes here without seconds
-    date.toLocaleTimeString('it-IT') : '';
-    setTime(defaultTime);
-  }, [date]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
-    value: time,
-    onBlur: changeDate,
-    onKeyUp: event => {
-      if (event.key === 'Enter') {
-        changeDate();
-      }
-    },
-    onChange: event => setTime(event.target.value)
-  });
-};
-var _default = exports.default = CustomTimeInput;

package/jsoneditor/JsonEditor.js

@@ -1,142 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = require("react");
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-var _jsoneditorReact = require("jsoneditor-react");
-var _brace = _interopRequireDefault(require("brace"));
-require("jsoneditor-react/es/editor.min.css");
-require("brace/mode/json");
-require("brace/theme/github");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const JsonEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
-  let {
-    ...props
-  } = _ref;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Wrapper, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsoneditorReact.JsonEditor, {
-      ref: ref,
-      ...props,
-      ace: _brace.default
-    })
-  });
-});
-const Wrapper = _styledComponents.default.div`
-  .jsoneditor {
-    border: 0;
-
-    div.jsoneditor-tree {
-      background: transparent;
-    }
-  }
-
-  div.jsoneditor td.jsoneditor-tree {
-    vertical-align: middle;
-  }
-
-  .jsoneditor-popover,
-  .jsoneditor-schema-error,
-  div.jsoneditor th,
-  div.jsoneditor td,
-  div.jsoneditor textarea,
-  div.jsoneditor select,
-  div.jsoneditor-field,
-  div.jsoneditor-value,
-  pre.jsoneditor-preview {
-    font-size: var(--font-body1);
-    color: var(--font-on-background);
-  }
-
-  div.jsoneditor select {
-    background: var(--color-background1);
-  }
-
-  div {
-    &.jsoneditor-readonly {
-      color: var(--font-on-background);
-    }
-
-    &.jsoneditor-value.jsoneditor-number {
-      color: var(--color-danger);
-    }
-
-    &.jsoneditor-field.jsoneditor-empty::after,
-    &.jsoneditor-value.jsoneditor-empty::after {
-      font-size: var(--font-body1);
-      color: var(--font-on-background);
-    }
-
-    &.jsoneditor-field[contenteditable='true']:focus,
-    &.jsoneditor-field[contenteditable='true']:hover,
-    &.jsoneditor-value[contenteditable='true']:focus,
-    &.jsoneditor-value[contenteditable='true']:hover,
-    &.jsoneditor-field.jsoneditor-highlight,
-    &.jsoneditor-value.jsoneditor-highlight {
-      background-color: transparent;
-      border: var(--border-width) solid var(--border-color);
-    }
-
-    &.jsoneditor-empty {
-      border-color: transparent;
-      border-style: none;
-    }
-
-    &.jsoneditor-tree button.jsoneditor-button {
-      filter: invert(100%) sepia(0%) saturate(2%) hue-rotate(78deg)
-        brightness(104%) contrast(101%);
-    }
-
-    &.jsoneditor-tree button.jsoneditor-button:focus {
-      background-color: transparent;
-    }
-  }
-
-  // ace editor
-  .ace_editor.ace-jsoneditor {
-    border-radius: 8px;
-  }
-
-  .ace_gutter {
-    background: rgb(59, 57, 87) !important;
-    color: #ffffff !important;
-    z-index: 0;
-  }
-
-  .ace-jsoneditor .ace_gutter-active-line {
-    background: #00001d;
-  }
-
-  .ace_content {
-    background: rgb(76, 72, 110);
-    z-index: 0;
-  }
-
-  .ace-jsoneditor .ace_marker-layer .ace_active-line {
-    background: #00001d;
-  }
-
-  .ace-jsoneditor .ace_text-layer {
-    color: #fff;
-  }
-
-  .ace-jsoneditor .ace_variable {
-    color: #fff;
-  }
-
-  .ace-jsoneditor .ace_string {
-    color: #11d8cd;
-  }
-
-  .ace-jsoneditor .ace_cursor {
-    border-left: 2px solid #fff;
-  }
-
-  .ace_hidden-cursors .ace_cursor {
-    opacity: 0.5;
-  }
-`;
-var _default = exports.default = JsonEditor;