@xaypay/tui 0.2.25 → 0.2.27

package/dist/index.es.js

@@ -48,7 +48,7 @@ var native = {
 };
 
 function v4(options, buf, offset) {
-  if (native.randomUUID && true && !options) {
+  if (native.randomUUID && !buf && !options) {
     return native.randomUUID();
   }
 
@@ -58,6 +58,16 @@ function v4(options, buf, offset) {
   rnds[6] = rnds[6] & 0x0f | 0x40;
   rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
 
+  if (buf) {
+    offset = offset || 0;
+
+    for (let i = 0; i < 16; ++i) {
+      buf[offset + i] = rnds[i];
+    }
+
+    return buf;
+  }
+
   return unsafeStringify(rnds);
 }
 
@@ -487,22 +497,19 @@ var img$3 = "data:image/svg+xml,%3csvg width='16' height='16' viewBox='0 0 16 16
 var img$2 = "data:image/svg+xml,%3csvg width='16' height='2' viewBox='0 0 16 2' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M1 1H15' stroke='%23009B8B' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e";
 
 // import React from 'react'
-// import info from './src/assetsTMP/info.png';
-// import error from './src/assetsTMP/error.png';
-// import close from './src/assetsTMP/close.svg';
-// import warn from './src/assetsTMP/warning.png';
-// import success from './src/assetsTMP/success.png';
 const boxSizing = 'border-box';
 const fontStyle = 'normal';
 const fontFamily = 'Arial';
 const fontWeight = 500;
 const transparent = 'transparent';
 const presetColors = {
+  info: '#F24C4C',
   dark: '#3C393E',
   light: '#EEEEEE',
   extraLight: '#FBFBFB',
   danger: '#EE0000',
   success: '#0DA574',
+  warning: '#FECD29',
   secondary: '#D1D1D1',
   primary: '#051942',
   primarySecond: '#00236A'
@@ -1070,6 +1077,7 @@ var packageResult = {
     timeForRemoveError: 4000,
     extentionsRowMarginTop: '40px',
     extentionsTextColor: 'black',
+    extentionsTextDots: false,
     border: {
       width: '2px',
       style: 'dashed',
@@ -1083,7 +1091,9 @@ var packageResult = {
       backgroundHidden: 'rgba(60, 57, 62, 0.4)'
     },
     label: {
+      showMore: false,
       useTooltip: false,
+      showMoreTextColor: '#2C46C1',
       color: '#4A4A4D',
       font: {
         ...fontObject
@@ -1178,6 +1188,7 @@ var packageResult = {
     maxHeight: '95vh',
     minHeight: '200px',
     radius: '14px',
+    noScroll: false,
     padding: '20px 20px 20px',
     className: '',
     alignItems: 'center',
@@ -1232,6 +1243,7 @@ var packageResult = {
   SWIPEMODAL: {
     width: '300px',
     height: '100vh',
+    noScroll: false,
     titleStyle: {
       color: '#1C212D',
       textAlign: 'left',
@@ -1810,8 +1822,8 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z$c = ".file-module_small-file-component__nlpcW>svg{max-height:77%!important}";
-var styles$b = {"small-file-component":"file-module_small-file-component__nlpcW"};
+var css_248z$c = ".file-module_small-file-component__nlpcW>svg{max-height:77%!important}.file-module_show-more-text__WIGLx{align-self:self-end;cursor:pointer}";
+var styles$b = {"small-file-component":"file-module_small-file-component__nlpcW","show-more-text":"file-module_show-more-text__WIGLx"};
 styleInject(css_248z$c);
 
 // eslint-disable-next-line react/display-name
@@ -1845,6 +1857,10 @@ const File = /*#__PURE__*/forwardRef(({
   labelStyle,
   labelWeight,
   labelFamily,
+  lableShowMore,
+  labelShowLessText,
+  labelShowMoreText,
+  showMoreTextColor,
   useLabelTooltip,
   labelTooltipColor,
   labelTooltipPadding,
@@ -1923,6 +1939,7 @@ const File = /*#__PURE__*/forwardRef(({
   maxCHoosenLengthErrorHideTime,
   textAlignLeftInSmallComponent,
   showPreviewIconInSmallComponent,
+  extentionsTextDots,
   extentionsTextColor,
   maxSize = 10,
   preview = true,
@@ -1936,6 +1953,7 @@ const File = /*#__PURE__*/forwardRef(({
   const [error, setError] = useState('');
   const [removeID, setRemoveID] = useState('');
   const [isHover, setIsHover] = useState(false);
+  const [showMore, setShowMore] = useState(false);
   const [classProps, setClassProps] = useState({});
   const [singleFile, setSingleFile] = useState(null);
   const [configStyles, setConfigStyles] = useState({});
@@ -2291,6 +2309,21 @@ const File = /*#__PURE__*/forwardRef(({
     }
     setRemoveID(() => '');
   };
+  const handleCheckTextWidth = () => {
+    if (labelRef.current) {
+      const rect = labelRef.current.getBoundingClientRect();
+      const elementWidth = rect.width;
+      const textWidth = getRenderedTextWidth(labelRef.current);
+      if (textWidth > Math.ceil(elementWidth)) {
+        return 'more';
+      } else {
+        return 'less';
+      }
+    }
+  };
+  const handleChangeShowMore = () => {
+    setShowMore(() => !showMore);
+  };
   useImperativeHandle(ref, () => ({
     handleReset() {
       setError('');
@@ -2346,6 +2379,15 @@ const File = /*#__PURE__*/forwardRef(({
   useEffect(() => {
     className && setClassProps(() => classnames(className ?? configStyles.FILE.className));
   }, [className]);
+  useEffect(() => {
+    if ((useLabelTooltip || configStyles.FILE?.label?.useTooltip) && (lableShowMore || configStyles.FILE?.label?.showMore)) {
+      alert(`
+                        Please use one of this props or config,
+                        use ( useLabelTooltip / configStyles.FILE.label.useTooltip )
+                        or ( lableShowMore / configStyles.FILE.label.showMore )
+                    `);
+    }
+  }, [lableShowMore, useLabelTooltip, configStyles.FILE?.label?.useTooltip, configStyles.FILE?.label?.showMore]);
   useEffect(() => {
     configStylesPromise.then(data => {
       setClassProps(() => classnames(className ?? data.FILE.className));
@@ -2375,14 +2417,15 @@ const File = /*#__PURE__*/forwardRef(({
       display: 'flex',
       marginBottom: '6px',
       alignItems: 'center',
-      justifyContent: label ? 'space-between' : 'flex-end'
+      justifyContent: label ? 'space-between' : 'flex-end',
+      width: deleteComponent && useLabelTooltip && handleCheckTextWidth() === 'more' ? 'calc(100% - 26px)' : '100%'
     }
   }, label && /*#__PURE__*/React__default.createElement("div", {
     style: {
       display: 'flex',
       maxWidth: '100%',
-      width: 'fit-content',
       columnGap: '4px',
+      width: 'fit-content',
       justifyContent: 'flex-start'
     }
   }, /*#__PURE__*/React__default.createElement("label", {
@@ -2394,13 +2437,23 @@ const File = /*#__PURE__*/forwardRef(({
       fontStyle: labelStyle ?? configStyles.FILE.label.font.style,
       fontWeight: labelWeight ?? configStyles.FILE.label.font.weight,
       fontFamily: labelFamily ?? configStyles.FILE.label.font.family,
-      whiteSpace: (useLabelTooltip ? useLabelTooltip : (useLabelTooltip === null || useLabelTooltip === undefined) && configStyles.FILE.label.useTooltip) ? 'nowrap' : 'normal',
-      overflow: (useLabelTooltip ? useLabelTooltip : (useLabelTooltip === null || useLabelTooltip === undefined) && configStyles.FILE.label.useTooltip) ? 'hidden' : 'visible',
-      textOverflow: (useLabelTooltip ? useLabelTooltip : (useLabelTooltip === null || useLabelTooltip === undefined) && configStyles.FILE.label.useTooltip) ? 'ellipsis' : ''
+      whiteSpace: (useLabelTooltip ? useLabelTooltip : (useLabelTooltip === null || useLabelTooltip === undefined) && configStyles.FILE.label.useTooltip) || (lableShowMore ? lableShowMore : (lableShowMore === null || lableShowMore === undefined) && configStyles.FILE.label.showMore) && !showMore ? 'nowrap' : 'normal',
+      overflow: (useLabelTooltip ? useLabelTooltip : (useLabelTooltip === null || useLabelTooltip === undefined) && configStyles.FILE.label.useTooltip) || (lableShowMore ? lableShowMore : (lableShowMore === null || lableShowMore === undefined) && configStyles.FILE.label.showMore) && !showMore ? 'hidden' : 'visible',
+      textOverflow: (useLabelTooltip ? useLabelTooltip : (useLabelTooltip === null || useLabelTooltip === undefined) && configStyles.FILE.label.useTooltip) || (lableShowMore ? lableShowMore : (lableShowMore === null || lableShowMore === undefined) && configStyles.FILE.label.showMore) && !showMore ? 'ellipsis' : ''
     },
-    onMouseEnter: (useLabelTooltip ? useLabelTooltip : (useLabelTooltip === null || useLabelTooltip === undefined) && configStyles.FILE.label.useTooltip) ? handleLabelMouseEnter : _ => _,
-    onMouseLeave: (useLabelTooltip ? useLabelTooltip : (useLabelTooltip === null || useLabelTooltip === undefined) && configStyles.FILE.label.useTooltip) ? handleLabelMouseLeave : _ => _
-  }, label), required && /*#__PURE__*/React__default.createElement("sup", null, iconRequired ? iconRequired : configStyles.FILE.icon.required ? configStyles.FILE.icon.required : /*#__PURE__*/React__default.createElement(SvgRequired, null))), deleteComponent && /*#__PURE__*/React__default.createElement("span", {
+    onMouseEnter: (useLabelTooltip ? useLabelTooltip : (useLabelTooltip === null || useLabelTooltip === undefined) && configStyles.FILE.label.useTooltip) && !lableShowMore && !configStyles.FILE.label.showMore ? handleLabelMouseEnter : _ => _,
+    onMouseLeave: (useLabelTooltip ? useLabelTooltip : (useLabelTooltip === null || useLabelTooltip === undefined) && configStyles.FILE.label.useTooltip) && !lableShowMore && !configStyles.FILE.label.showMore ? handleLabelMouseLeave : _ => _
+  }, label), required && /*#__PURE__*/React__default.createElement("sup", null, iconRequired ? iconRequired : configStyles.FILE.icon.required ? configStyles.FILE.icon.required : /*#__PURE__*/React__default.createElement(SvgRequired, null)), lableShowMore || configStyles.FILE.label.showMore ? /*#__PURE__*/React__default.createElement("span", {
+    className: styles$b['show-more-text'],
+    style: {
+      fontSize: labelSize ?? configStyles.FILE.label.font.size,
+      fontStyle: labelStyle ?? configStyles.FILE.label.font.style,
+      fontWeight: labelWeight ?? configStyles.FILE.label.font.weight,
+      fontFamily: labelFamily ?? configStyles.FILE.label.font.family,
+      color: showMoreTextColor ?? configStyles.FILE.label.showMoreTextColor
+    },
+    onClick: handleChangeShowMore
+  }, showMore ? labelShowLessText ? labelShowLessText : '' : labelShowMoreText ? labelShowMoreText : '') : ''), deleteComponent && /*#__PURE__*/React__default.createElement("span", {
     style: {
       cursor: 'pointer'
     },
@@ -2470,15 +2523,23 @@ const File = /*#__PURE__*/forwardRef(({
     }
   }, upload ?? configStyles.FILE.upload))), /*#__PURE__*/React__default.createElement("div", {
     style: {
+      maxWidth: '100%',
       marginTop: extentionsRowMarginTop ?? configStyles.FILE.extentionsRowMarginTop
     }
   }, /*#__PURE__*/React__default.createElement("p", {
     style: {
       margin: '0px',
       padding: '0px 10px',
+      color: color ?? configStyles.FILE.color,
+      whiteSpace: extentionsTextDots || configStyles.FILE.extentionsTextDots ? 'nowrap' : 'normal',
+      overflow: extentionsTextDots || configStyles.FILE.extentionsTextDots ? 'hidden' : 'visible',
+      textOverflow: extentionsTextDots || configStyles.FILE.extentionsTextDots ? 'ellipsis' : ''
+    }
+  }, /*#__PURE__*/React__default.createElement(React__default.Fragment, null, fileSizeText ?? configStyles.FILE.sizeText, " ", maxSize, " \u0544\u0532", /*#__PURE__*/React__default.createElement("span", {
+    style: {
       color: extentionsTextColor ?? configStyles.FILE.extentionsTextColor
     }
-  }, fileSizeText ?? configStyles.FILE.sizeText, " ", maxSize, " \u0544\u0532 (", ' ', fileExtensions.toString().split(',').join(', '), " )"))) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
+  }, "(", ' ', " ", fileExtensions.toString().split(',').join(', '), ")"))))) : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
     className: styles$b['small-file-component'],
     style: {
       width: '100%',
@@ -2518,13 +2579,16 @@ const File = /*#__PURE__*/forwardRef(({
     style: {
       margin: '0px',
       padding: '0px 10px',
-      color: extentionsTextColor ?? configStyles.FILE.extentionsTextColor
+      color: color ?? configStyles.FILE.color,
+      whiteSpace: extentionsTextDots || configStyles.FILE.extentionsTextDots ? 'nowrap' : 'normal',
+      overflow: extentionsTextDots || configStyles.FILE.extentionsTextDots ? 'hidden' : 'visible',
+      textOverflow: extentionsTextDots || configStyles.FILE.extentionsTextDots ? 'ellipsis' : ''
     }
-  }, singleFile && singleFile[`${0}`] ? singleFile[`${0}`].name : /*#__PURE__*/React__default.createElement("span", {
+  }, singleFile && singleFile[`${0}`] ? singleFile[`${0}`].name : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, fileSizeText ?? configStyles.FILE.sizeText, " ", maxSize, " \u0544\u0532", /*#__PURE__*/React__default.createElement("span", {
     style: {
-      color: color ?? configStyles.FILE.color
+      color: extentionsTextColor ?? configStyles.FILE.extentionsTextColor
     }
-  }, fileSizeText ?? configStyles.FILE.sizeText, " ", maxSize, " \u0544\u0532 (", ' ', fileExtensions.toString().split(',').join(', '), " )"))))), /*#__PURE__*/React__default.createElement("div", {
+  }, "(", ' ', " ", fileExtensions.toString().split(',').join(', '), ")")))))), /*#__PURE__*/React__default.createElement("div", {
     style: {
       position: 'absolute',
       top: '0px',
@@ -2632,6 +2696,10 @@ File.propTypes = {
   labelWeight: PropTypes.string,
   labelFamily: PropTypes.string,
   labelColor: PropTypes.string,
+  lableShowMore: PropTypes.bool,
+  labelShowLessText: PropTypes.string,
+  labelShowMoreText: PropTypes.string,
+  showMoreTextColor: PropTypes.string,
   useLabelTooltip: PropTypes.bool,
   labelTooltipColor: PropTypes.string,
   labelTooltipPadding: PropTypes.string,
@@ -2711,6 +2779,7 @@ File.propTypes = {
   textAlignLeftInSmallComponent: PropTypes.bool,
   showPreviewIconInSmallComponent: PropTypes.bool,
   fileExtensions: PropTypes.arrayOf(PropTypes.string),
+  extentionsTextDots: PropTypes.bool,
   extentionsTextColor: PropTypes.string
 };
 
@@ -2748,7 +2817,11 @@ const handleUtilsCheckTypeTel = (val, prevVal) => {
   return val;
 };
 const handleUtilsCheckTypeNumber = (val, prevVal, maxLength, floatToFix, maxNumSize, withoutDot, innerMinNumSize, numberMaxLength, cardNumber) => {
-  {
+  if (maxLength && maxLength > 0) {
+    if (val.length > maxLength) {
+      val = val.substr(0, maxLength);
+    }
+  } else {
     const regNum = floatToFix && floatToFix >= 0 ? /^\d+(\.|\․|\.|\,)?(\d+)?$/ : /^\d+$/;
     if (cardNumber) {
       if (val.length > 19 && !val.includes('.')) {
@@ -4259,7 +4332,7 @@ const Table = ({
   }, body.map((item, index) => {
     return /*#__PURE__*/React__default.createElement("tr", {
       onDragOver: e => e.preventDefault(),
-      onDrop: e => handleDrop(e, index),
+      onDrop: draggable ? e => handleDrop(e, index) : _ => _,
       key: `${item}_${index}`,
       style: {
         backgroundColor: tableRowBGColor ?? configStyles.TABLE.body.row.colors.background,
@@ -4272,12 +4345,12 @@ const Table = ({
       return /*#__PURE__*/React__default.createElement(TD, {
         index: index,
         item: innerItem,
-        dragged: handleDrag,
+        dragged: draggable ? handleDrag : _ => _,
         hideBorder: hideBorder,
         innerIndex: innerIndex,
-        dragEnd: handleDragEnd,
+        dragEnd: draggable ? handleDragEnd : _ => _,
         row: Object.values(item),
-        dragStart: handleDragStart,
+        dragStart: draggable ? handleDragStart : _ => _,
         id: item.id ? item.id : '',
         handleCheckDots: handleCheckDots,
         key: `${innerItem}_${index}_${innerIndex}`,
@@ -4329,11 +4402,11 @@ const Table = ({
   }, draggedItem.map((innerItem, innerIndex) => {
     return /*#__PURE__*/React__default.createElement(TD, {
       item: innerItem,
-      dragged: handleDrag,
+      dragged: draggable ? handleDrag : _ => _,
       hideBorder: hideBorder,
       innerIndex: innerIndex,
       row: Object.values(draggedItem),
-      dragStart: handleDragStart,
+      dragStart: draggable ? handleDragStart : _ => _,
       handleCheckDots: handleCheckDots,
       key: `${innerItem}__${innerIndex}`,
       openListColor: openListColor ?? configStyles.TABLE.openList.color,
@@ -4411,8 +4484,8 @@ Table.propTypes = {
   clickableRowColumnTd: PropTypes.bool
 };
 
-var css_248z$a = ".modal-module_animation__modal__3mt48{animation:modal-module_show-popup__WrH7a .15s;-webkit-animation:modal-module_show-popup__WrH7a .15s}@keyframes modal-module_show-popup__WrH7a{0%{transform:translate3d(0,-50%,0);-webkit-transform:translate3d(0,-50%,0);-moz-transform:translate3d(0,-50%,0);-ms-transform:translate3d(0,-50%,0);-o-transform:translate3d(0,-50%,0)}to{opacity:1;transform:translateZ(0);-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0)}}";
-var styles$9 = {"animation__modal":"modal-module_animation__modal__3mt48"};
+var css_248z$a = "body.modal-module_tui-no-srcoll-class__gZjNK,html.modal-module_tui-no-srcoll-class__gZjNK{height:100%;overflow:hidden!important}.modal-module_animation__modal__3mt48{animation:modal-module_show-popup__WrH7a .15s;-webkit-animation:modal-module_show-popup__WrH7a .15s}@keyframes modal-module_show-popup__WrH7a{0%{transform:translate3d(0,-50%,0);-webkit-transform:translate3d(0,-50%,0);-moz-transform:translate3d(0,-50%,0);-ms-transform:translate3d(0,-50%,0);-o-transform:translate3d(0,-50%,0)}to{opacity:1;transform:translateZ(0);-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0)}}";
+var styles$9 = {"tui-no-srcoll-class":"modal-module_tui-no-srcoll-class__gZjNK","animation__modal":"modal-module_animation__modal__3mt48","show-popup":"modal-module_show-popup__WrH7a"};
 styleInject(css_248z$a);
 
 const SvgNext = ({
@@ -4661,11 +4734,22 @@ const Modal = ({
     className && setClassProps(() => classnames(className ?? configStyles.MODAL.className));
   }, [className]);
   useEffect(() => {
+    let newConfigStyles = {};
+    const style = document.createElement('style');
     document.addEventListener('keydown', e => {
       handleESC(e);
       handleNavigateArrow(e);
     }, false);
     configStylesPromise.then(data => {
+      newConfigStyles = {
+        ...data
+      };
+      if (newConfigStyles.MODAL && hasOwnerProperty(newConfigStyles.MODAL, 'noScroll') && newConfigStyles.MODAL.noScroll) {
+        style.textContent = `.tui-no-srcoll-class{overflow:hidden!important;}`;
+        document.head.appendChild(style);
+        document.body.classList.add('tui-no-srcoll-class');
+        document.documentElement.classList.add('tui-no-srcoll-class');
+      }
       setClassProps(() => classnames(className ?? data.MODAL.className));
       setConfigStyles(() => {
         return {
@@ -4678,6 +4762,14 @@ const Modal = ({
     return () => {
       setSelect(0);
       setInnerData([]);
+      if (newConfigStyles.MODAL && hasOwnerProperty(newConfigStyles.MODAL, 'noScroll') && newConfigStyles.MODAL.noScroll) {
+        const noScrllable = document.getElementsByClassName('tui-no-srcoll-class');
+        if (noScrllable) {
+          style.remove();
+          document.body.classList.remove('tui-no-srcoll-class');
+          document.documentElement.classList.remove('tui-no-srcoll-class');
+        }
+      }
       document.removeEventListener('keydown', e => {
         handleESC(e);
         handleNavigateArrow(e);
@@ -4711,14 +4803,14 @@ const Modal = ({
     style: {
       position: 'relative',
       boxSizing: 'border-box',
-      display: type === 'content' ? 'grid' : 'block',
       width: width ?? configStyles.MODAL.width,
-      overflow: type === 'content' ? 'auto' : 'hidden',
       height: height ?? configStyles.MODAL.height,
-      gridTemplateRows: type === 'content' ? 'auto 10fr' : '',
+      display: type === 'content' ? 'grid' : 'block',
+      overflow: type === 'content' ? 'auto' : 'hidden',
       borderRadius: radius ?? configStyles.MODAL.radius,
       maxWidth: mMaxWidth ?? configStyles.MODAL.maxWidth,
       maxHeight: mMaxHeight ?? configStyles.MODAL.maxHeight,
+      gridTemplateRows: type === 'content' ? 'auto 10fr' : '',
       minWidth: type === 'content' ? minWidth ?? configStyles.MODAL.minWidth : '',
       backgroundColor: backgroundColor ?? configStyles.MODAL.colors.background,
       minHeight: type === 'content' ? minHeight ?? configStyles.MODAL.minHeight : ''
@@ -5290,7 +5382,7 @@ const NumberInput = ({
 };
 
 var css_248z$9 = ".input-module_input-wrap__NunrE{position:relative;width:100%}.input-module_input-content__kP7lZ{appearance:none!important;-webkit-appearance:none!important;display:flex;width:100%}input:-webkit-autofill,input:-webkit-autofill:active,input:-webkit-autofill:focus,input:-webkit-autofill:hover{background-color:inherit!important}input::-ms-clear,input::-ms-reveal{display:none}.input-module_error-message-show__OrVSo{animation-fill-mode:forwards;animation-name:input-module_error-show__9MP6k}.input-module_inp-num__vH7HL::-webkit-inner-spin-button,.input-module_inp-num__vH7HL::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.input-module_inp-num__vH7HL[type=number]{-moz-appearance:textfield}@keyframes input-module_error-show__9MP6k{to{bottom:-20px;transform:scaleX(1);-webkit-transform:scaleX(1);-moz-transform:scaleX(1);-ms-transform:scaleX(1);-o-transform:scaleX(1)}}";
-var styles$8 = {"input-wrap":"input-module_input-wrap__NunrE","input-content":"input-module_input-content__kP7lZ","inp-num":"input-module_inp-num__vH7HL"};
+var styles$8 = {"input-wrap":"input-module_input-wrap__NunrE","input-content":"input-module_input-content__kP7lZ","error-message-show":"input-module_error-message-show__OrVSo","error-show":"input-module_error-show__9MP6k","inp-num":"input-module_inp-num__vH7HL"};
 styleInject(css_248z$9);
 
 const InputTypes = {
@@ -6078,7 +6170,7 @@ const SvgArrow = ({
 }));
 
 var css_248z$8 = ".select-module_select-content__GCMDX{-webkit-appearance:none;display:flex;flex-direction:column;position:relative}.select-module_select-content-top__Aw-fB{align-items:center;-webkit-appearance:none;display:flex;flex-direction:row;flex-wrap:nowrap}.select-module_select-content-bottom__ueZCR{animation:select-module_select-show__391hQ .64s linear forwards;-webkit-animation:select-module_select-show__391hQ .64s linear forwards;left:0;max-height:0;overflow:hidden;position:absolute;width:100%;z-index:99999999999}.select-module_select-content-bottom-inner__NWy2X{display:flex;flex-direction:column;max-height:234px;overflow-x:hidden;overflow-y:auto}.select-module_select-content-top-icon__MBrGK{align-items:center;box-sizing:border-box;display:flex;flex:0 0 auto}.select-module_select-content-top-icon__MBrGK>div{align-items:center;display:flex;height:fit-content;justify-content:center;max-height:30px;max-width:30px;min-height:14px;min-width:14px;width:fit-content}.select-module_close-icon__SFNaJ{border-right:1px solid #eee;box-sizing:content-box;padding-right:9px}.select-module_arrow-icon__rjHt-{margin-left:9px;transform-origin:center;transition:all .64s ease;-webkit-transition:all .64s ease;-moz-transition:all .64s ease;-ms-transition:all .64s ease;-o-transition:all .64s ease}.select-module_select-content-bottom-row__eKq5L{align-items:center;display:flex;transition:background-color .24s,color .24s;-webkit-transition:background-color .24s,color .24s;-moz-transition:background-color .24s,color .24s;-ms-transition:background-color .24s,color .24s;-o-transition:background-color .24s,color .24s}.select-module_select-content-bottom-row__eKq5L:last-child{margin-bottom:0}.select-module_ellipsis__uNgol{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes select-module_select-show__391hQ{to{max-height:234px}}";
-var styles$7 = {"select-content":"select-module_select-content__GCMDX","select-content-top":"select-module_select-content-top__Aw-fB","select-content-bottom":"select-module_select-content-bottom__ueZCR","select-content-bottom-inner":"select-module_select-content-bottom-inner__NWy2X","select-content-top-icon":"select-module_select-content-top-icon__MBrGK","close-icon":"select-module_close-icon__SFNaJ","arrow-icon":"select-module_arrow-icon__rjHt-","select-content-bottom-row":"select-module_select-content-bottom-row__eKq5L","ellipsis":"select-module_ellipsis__uNgol"};
+var styles$7 = {"select-content":"select-module_select-content__GCMDX","select-content-top":"select-module_select-content-top__Aw-fB","select-content-bottom":"select-module_select-content-bottom__ueZCR","select-show":"select-module_select-show__391hQ","select-content-bottom-inner":"select-module_select-content-bottom-inner__NWy2X","select-content-top-icon":"select-module_select-content-top-icon__MBrGK","close-icon":"select-module_close-icon__SFNaJ","arrow-icon":"select-module_arrow-icon__rjHt-","select-content-bottom-row":"select-module_select-content-bottom-row__eKq5L","ellipsis":"select-module_ellipsis__uNgol"};
 styleInject(css_248z$8);
 
 const Select = ({
@@ -8293,7 +8385,6 @@ Accordion.propTypes = {
 };
 
 // import React from 'react';
-
 const Swipe = ({
   id,
   title,
@@ -8371,14 +8462,11 @@ const Swipe = ({
   }, child));
 };
 
-var css_248z$2 = ".swipe-module_to-top__lrHfG{bottom:0}.swipe-module_to-left__kgLsE{right:0}.swipe-module_to-right__Xu3Ul{left:0}.swipe-module_to-bottom__94M7H{top:0}.swipe-module_visible__---aC{visibility:visible!important}.swipe-module_swipe-block__Yv1B3{-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.swipe-module_move-top__m6t2O{-webkit-animation-name:swipe-module_slideTop__-Bbap;animation-name:swipe-module_slideTop__-Bbap}.swipe-module_move-left__4TDLs{-webkit-animation-name:swipe-module_slideLeft__i24cS;animation-name:swipe-module_slideLeft__i24cS}.swipe-module_move-right__FrYo0{-webkit-animation-name:swipe-module_slideRight__swgSY;animation-name:swipe-module_slideRight__swgSY}.swipe-module_move-bottom__eYDx6{-webkit-animation-name:swipe-module_slideBottom__TBoZo;animation-name:swipe-module_slideBottom__TBoZo}.swipe-module_back-top__gJZv0{-webkit-animation-name:swipe-module_backTop__32loc;animation-name:swipe-module_backTop__32loc}.swipe-module_back-left__Wd3aY{-webkit-animation-name:swipe-module_backLeft__q89ub;animation-name:swipe-module_backLeft__q89ub}.swipe-module_back-right__Lgwz7{-webkit-animation-name:swipe-module_backRight__8t5Dm;animation-name:swipe-module_backRight__8t5Dm}.swipe-module_back-bottom__JRN-7{-webkit-animation-name:swipe-module_backBottom__lwR8B;animation-name:swipe-module_backBottom__lwR8B}@keyframes swipe-module_slideTop__-Bbap{0%{bottom:-100%}to{bottom:0}}@keyframes swipe-module_slideLeft__i24cS{0%{right:-100%}to{right:0}}@keyframes swipe-module_slideRight__swgSY{0%{left:-100%}to{left:0}}@keyframes swipe-module_slideBottom__TBoZo{0%{top:-100%}to{top:0}}@keyframes swipe-module_backTop__32loc{0%{bottom:0}to{bottom:-100%}}@keyframes swipe-module_backLeft__q89ub{0%{right:0}to{right:-100%}}@keyframes swipe-module_backRight__8t5Dm{0%{left:0}to{left:-100%}}@keyframes swipe-module_backBottom__lwR8B{0%{top:0}to{top:-100%}}";
-var styles$2 = {"to-top":"swipe-module_to-top__lrHfG","to-left":"swipe-module_to-left__kgLsE","to-right":"swipe-module_to-right__Xu3Ul","to-bottom":"swipe-module_to-bottom__94M7H","visible":"swipe-module_visible__---aC","swipe-block":"swipe-module_swipe-block__Yv1B3","move-top":"swipe-module_move-top__m6t2O","move-left":"swipe-module_move-left__4TDLs","move-right":"swipe-module_move-right__FrYo0","move-bottom":"swipe-module_move-bottom__eYDx6","back-top":"swipe-module_back-top__gJZv0","back-left":"swipe-module_back-left__Wd3aY","back-right":"swipe-module_back-right__Lgwz7","back-bottom":"swipe-module_back-bottom__JRN-7"};
+var css_248z$2 = "body.swipe-module_tui-no-srcoll-class__YS9cI,html.swipe-module_tui-no-srcoll-class__YS9cI{height:100%;overflow:hidden!important}.swipe-module_to-top__lrHfG{bottom:0}.swipe-module_to-left__kgLsE{right:0}.swipe-module_to-right__Xu3Ul{left:0}.swipe-module_to-bottom__94M7H{top:0}.swipe-module_visible__---aC{visibility:visible!important}.swipe-module_swipe-block__Yv1B3{-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.swipe-module_move-top__m6t2O{-webkit-animation-name:swipe-module_slideTop__-Bbap;animation-name:swipe-module_slideTop__-Bbap}.swipe-module_move-left__4TDLs{-webkit-animation-name:swipe-module_slideLeft__i24cS;animation-name:swipe-module_slideLeft__i24cS}.swipe-module_move-right__FrYo0{-webkit-animation-name:swipe-module_slideRight__swgSY;animation-name:swipe-module_slideRight__swgSY}.swipe-module_move-bottom__eYDx6{-webkit-animation-name:swipe-module_slideBottom__TBoZo;animation-name:swipe-module_slideBottom__TBoZo}.swipe-module_back-top__gJZv0{-webkit-animation-name:swipe-module_backTop__32loc;animation-name:swipe-module_backTop__32loc}.swipe-module_back-left__Wd3aY{-webkit-animation-name:swipe-module_backLeft__q89ub;animation-name:swipe-module_backLeft__q89ub}.swipe-module_back-right__Lgwz7{-webkit-animation-name:swipe-module_backRight__8t5Dm;animation-name:swipe-module_backRight__8t5Dm}.swipe-module_back-bottom__JRN-7{-webkit-animation-name:swipe-module_backBottom__lwR8B;animation-name:swipe-module_backBottom__lwR8B}@keyframes swipe-module_slideTop__-Bbap{0%{bottom:-100%}to{bottom:0}}@keyframes swipe-module_slideLeft__i24cS{0%{right:-100%}to{right:0}}@keyframes swipe-module_slideRight__swgSY{0%{left:-100%}to{left:0}}@keyframes swipe-module_slideBottom__TBoZo{0%{top:-100%}to{top:0}}@keyframes swipe-module_backTop__32loc{0%{bottom:0}to{bottom:-100%}}@keyframes swipe-module_backLeft__q89ub{0%{right:0}to{right:-100%}}@keyframes swipe-module_backRight__8t5Dm{0%{left:0}to{left:-100%}}@keyframes swipe-module_backBottom__lwR8B{0%{top:0}to{top:-100%}}";
+var styles$2 = {"tui-no-srcoll-class":"swipe-module_tui-no-srcoll-class__YS9cI","to-top":"swipe-module_to-top__lrHfG","to-left":"swipe-module_to-left__kgLsE","to-right":"swipe-module_to-right__Xu3Ul","to-bottom":"swipe-module_to-bottom__94M7H","visible":"swipe-module_visible__---aC","swipe-block":"swipe-module_swipe-block__Yv1B3","move-top":"swipe-module_move-top__m6t2O","slideTop":"swipe-module_slideTop__-Bbap","move-left":"swipe-module_move-left__4TDLs","slideLeft":"swipe-module_slideLeft__i24cS","move-right":"swipe-module_move-right__FrYo0","slideRight":"swipe-module_slideRight__swgSY","move-bottom":"swipe-module_move-bottom__eYDx6","slideBottom":"swipe-module_slideBottom__TBoZo","back-top":"swipe-module_back-top__gJZv0","backTop":"swipe-module_backTop__32loc","back-left":"swipe-module_back-left__Wd3aY","backLeft":"swipe-module_backLeft__q89ub","back-right":"swipe-module_back-right__Lgwz7","backRight":"swipe-module_backRight__8t5Dm","back-bottom":"swipe-module_back-bottom__JRN-7","backBottom":"swipe-module_backBottom__lwR8B"};
 styleInject(css_248z$2);
 
 // import React, { useEffect, useRef } from 'react';
-// import ReactDOM from 'react-dom/client';
-// import PropTypes from 'prop-types';
-
 let swipeCount = 0;
 const createElem = (id, title, child, props, swipeBlock, innerConfigStyles) => {
   const {
@@ -8477,22 +8565,45 @@ const handleNavigationChange = () => {
     return result;
   };
 })(window.history);
+const style = document.createElement('style');
 const swipe = {
   open: (title = '', id, child, props) => {
-    if (id === undefined || id === null && (typeof id !== 'string' || typeof id !== 'number')) {
-      alert('Please pass valid id prop (string / number)  when call swipe.open function');
-      return;
-    }
-    if (swipeCount === 0) {
-      window.addEventListener('popstate', handleNavigationChange);
-      window.addEventListener('navigationchange', handleNavigationChange);
-    }
-    let swipable = document.getElementById('swipable');
-    swipeCount += 1;
-    createSwipe(id, title, child, props, swipable);
-    return Promise.resolve(id);
+    let newConfigStyles = {};
+    configStylesPromise.then(data => {
+      newConfigStyles = {
+        ...data
+      };
+      if (id === undefined || id === null && (typeof id !== 'string' || typeof id !== 'number')) {
+        alert('Please pass valid id prop (string / number)  when call swipe.open function');
+        return;
+      }
+      if (swipeCount === 0) {
+        if (newConfigStyles.SWIPEMODAL && hasOwnerProperty(newConfigStyles.SWIPEMODAL, 'noScroll') && newConfigStyles.SWIPEMODAL.noScroll) {
+          style.textContent = `.tui-no-srcoll-class{overflow:hidden!important;}`;
+          document.head.appendChild(style);
+          document.body.classList.add('tui-no-srcoll-class');
+          document.documentElement.classList.add('tui-no-srcoll-class');
+        }
+        window.addEventListener('popstate', handleNavigationChange);
+        window.addEventListener('navigationchange', handleNavigationChange);
+      }
+      let swipable = document.getElementById('swipable');
+      swipeCount += 1;
+      createSwipe(id, title, child, props, swipable);
+      return Promise.resolve(id);
+    }, error => {
+      console.error(error);
+    });
   },
   close: id => {
+    let newConfigStyles = {};
+    configStylesPromise.then(data => {
+      newConfigStyles = {
+        ...data
+      };
+    }, error => {
+      console.error(error);
+    });
     if (id === undefined || id === null && (typeof id !== 'string' || typeof id !== 'number')) {
       alert('Please pass valid id prop (string / number)  when call swipe.close function');
       return;
@@ -8511,6 +8622,14 @@ const swipe = {
             window.removeEventListener('popstate', handleNavigationChange);
             window.removeEventListener('navigationchange', handleNavigationChange);
             document.body.removeChild(swipable);
+            if (newConfigStyles.SWIPEMODAL && hasOwnerProperty(newConfigStyles.SWIPEMODAL, 'noScroll') && newConfigStyles.SWIPEMODAL.noScroll) {
+              const noScrllable = document.getElementsByClassName('tui-no-srcoll-class');
+              if (noScrllable) {
+                style.remove();
+                document.body.classList.remove('tui-no-srcoll-class');
+                document.documentElement.classList.remove('tui-no-srcoll-class');
+              }
+            }
           }
         }, 200);
       } else {
@@ -8519,6 +8638,25 @@ const swipe = {
           window.removeEventListener('popstate', handleNavigationChange);
           window.removeEventListener('navigationchange', handleNavigationChange);
           document.body.removeChild(swipable);
+          if (newConfigStyles.SWIPEMODAL && hasOwnerProperty(newConfigStyles.SWIPEMODAL, 'noScroll') && newConfigStyles.SWIPEMODAL.noScroll) {
+            const noScrllable = document.getElementsByClassName('tui-no-srcoll-class');
+            if (noScrllable) {
+              style.remove();
+              document.body.classList.remove('tui-no-srcoll-class');
+              document.documentElement.classList.remove('tui-no-srcoll-class');
+            }
+          }
+        }
+      }
+    }
+  },
+  updateTitle: (title, id) => {
+    const elem = document.getElementById(id);
+    const titleElem = elem.querySelector('h1');
+    if (elem) {
+      if (titleElem) {
+        if (title) {
+          titleElem.innerText = title;
         }
       }
     }
@@ -8716,7 +8854,7 @@ const SvgNextarrow = ({
 }));
 
 var css_248z$1 = ".pagination-module_listItem__b1-WN:focus{background-color:#4caf50;color:#fff}.pagination-module_listItem__b1-WN:hover:not(.pagination-module_active__KwBDp){background-color:#ddd}.pagination-module_pagination-bar__MrtYT>ul{display:flex;flex-direction:row;flex-wrap:nowrap;gap:8px;justify-content:center}.pagination-module_pagination-btn__w8Yh8{align-items:center;border:none;cursor:pointer;display:flex;justify-content:center;outline:none}.pagination-module_pagination-item__t3emS,.pagination-module_pagination-jump-next__LAb9Z{align-items:center;cursor:pointer;display:flex;flex:0 0 auto;justify-content:center;position:relative;transition:background-color .24s}.pagination-module_pagination-item__t3emS:hover{background-color:#eee}.pagination-module_pagination-item__t3emS.pagination-module_selected__EXzCA{background-color:#00236a;color:#fff}.pagination-module_pagination-jump-next-arrow__aEVD8,.pagination-module_pagination-jump-next-txt__e7nFj{align-items:center;bottom:0;display:flex;font-size:12px;justify-content:center;left:0;line-height:14px;margin:auto;position:absolute;right:0;top:0;transition:opacity .24s,color .24s}.pagination-module_pagination-jump-next-arrow__aEVD8{opacity:0}.pagination-module_pagination-jump-next__LAb9Z:hover .pagination-module_pagination-jump-next-arrow__aEVD8{opacity:1}.pagination-module_pagination-jump-next__LAb9Z:hover .pagination-module_pagination-jump-next-txt__e7nFj{opacity:0}.pagination-module_show-offset-block__ksPGm{height:34px;margin-left:10px!important;margin-right:4px!important;width:91px}i{color:#3c393e;font-size:12px;line-height:12px}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}";
-var styles$1 = {"pagination-bar":"pagination-module_pagination-bar__MrtYT","pagination-btn":"pagination-module_pagination-btn__w8Yh8","pagination-item":"pagination-module_pagination-item__t3emS","pagination-jump-next":"pagination-module_pagination-jump-next__LAb9Z","pagination-jump-next-txt":"pagination-module_pagination-jump-next-txt__e7nFj","pagination-jump-next-arrow":"pagination-module_pagination-jump-next-arrow__aEVD8"};
+var styles$1 = {"listItem":"pagination-module_listItem__b1-WN","active":"pagination-module_active__KwBDp","pagination-bar":"pagination-module_pagination-bar__MrtYT","pagination-btn":"pagination-module_pagination-btn__w8Yh8","pagination-item":"pagination-module_pagination-item__t3emS","pagination-jump-next":"pagination-module_pagination-jump-next__LAb9Z","selected":"pagination-module_selected__EXzCA","pagination-jump-next-txt":"pagination-module_pagination-jump-next-txt__e7nFj","pagination-jump-next-arrow":"pagination-module_pagination-jump-next-arrow__aEVD8","show-offset-block":"pagination-module_show-offset-block__ksPGm"};
 styleInject(css_248z$1);
 
 const Pagination = ({