diginet-core-ui 1.3.24 → 1.3.29

package/components/modal/body.js

@@ -1,5 +1,3 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 /** @jsxRuntime classic */
 
 /** @jsx jsx */
@@ -43,13 +41,13 @@ const ModalBody = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   useEffect(() => {
     !!refs && refs(ref);
   }, []);
-  const Body = useMemo(() => jsx("div", _extends({
+  const Body = useMemo(() => jsx("div", {
     css: ModalBodyBox,
-    className: 'DGN-UI-Modal-Body ' + className
-  }, props, {
+    className: 'DGN-UI-Modal-Body ' + className,
+    ...props,
     style: style,
     ref: ref
-  }), children), [children, style]);
+  }, children), [children, style]);
   return Body;
 }));
 ModalBody.defaultProps = {

package/components/modal/footer.js

@@ -1,5 +1,3 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 /** @jsxRuntime classic */
 
 /** @jsx jsx */
@@ -35,13 +33,13 @@ const ModalFooter = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   useEffect(() => {
     !!refs && refs(ref);
   }, []);
-  const Footer = useMemo(() => jsx("div", _extends({
+  const Footer = useMemo(() => jsx("div", {
     css: ModalFooterBox,
-    className: 'DGN-UI-Modal-Footer ' + className
-  }, props, {
+    className: 'DGN-UI-Modal-Footer ' + className,
+    ...props,
     style: style,
     ref: ref
-  }), children), [children, style]);
+  }, children), [children, style]);
   return Footer;
 }));
 ModalFooter.defaultProps = {

package/components/modal/header.js

@@ -1,5 +1,3 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 /** @jsxRuntime classic */
 
 /** @jsx jsx */
@@ -8,8 +6,7 @@ import PropTypes from 'prop-types';
 import { jsx, css } from '@emotion/core';
 import ModalContext from './context';
 import { brand22 } from '../../styles/colors';
-import { Typography } from '../';
-import Icon from '../../icons';
+import { ButtonIcon, Typography } from '../';
 const ModalHeader = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   title,
   className,
@@ -57,14 +54,14 @@ const ModalHeader = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   useEffect(() => {
     !!refs && refs(ref);
   }, []);
-  const Header = useMemo(() => jsx("div", _extends({
+  const Header = useMemo(() => jsx("div", {
     css: ModalHeaderBox,
-    className: 'DGN-UI-Modal-Header ' + className
-  }, props, {
+    className: 'DGN-UI-Modal-Header ' + className,
+    ...props,
     style: style,
     onMouseDown: modal.onMoveModal,
     ref: ref
-  }), jsx("div", {
+  }, jsx("div", {
     css: HeaderTitle
   }, jsx(Typography, {
     type: 'h3',
@@ -75,13 +72,10 @@ const ModalHeader = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
     }
   }, children ? children : title)), jsx("div", {
     css: ClearIconBox
-  }, jsx(Icon, {
+  }, jsx(ButtonIcon, {
+    viewType: 'ghost',
     name: 'close',
-    viewBox: true,
-    onClick: modal.close,
-    style: {
-      padding: 0
-    }
+    onClick: modal.close
   }))), [children, title, style]);
   return Header;
 }));

package/components/modal/index.js

@@ -1,5 +1,3 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React, { memo, useEffect, useRef, forwardRef } from 'react';
 import PropTypes from 'prop-types';
 import Modal from './modal';
@@ -24,10 +22,11 @@ const ModalSample = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   useEffect(() => {
     if (refs) refs(ref);
   }, []);
-  return /*#__PURE__*/React.createElement(Modal, _extends({
+  return /*#__PURE__*/React.createElement(Modal, {
     ref: ref,
-    style: style
-  }, props), /*#__PURE__*/React.createElement(Header, {
+    style: style,
+    ...props
+  }, /*#__PURE__*/React.createElement(Header, {
     style: headerStyle
   }, title), /*#__PURE__*/React.createElement(Body, {
     style: bodyStyle

package/components/modal/modal.js

@@ -1,5 +1,3 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 /** @jsxRuntime classic */
 
 /** @jsx jsx */
@@ -8,12 +6,7 @@ import { createPortal } from 'react-dom';
 import PropTypes from 'prop-types';
 import { jsx, css, keyframes } from '@emotion/core';
 import ModalContext from './context';
-import { useTheme } from '../../theme';
-const {
-  typography: {
-    fontFamily
-  }
-} = useTheme();
+import { typography } from '../../styles/typography';
 const Modal = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   open,
   type,
@@ -83,7 +76,7 @@ const Modal = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
         flex-direction: column;
         position: relative;
         background-color: white;
-        font-family: ${fontFamily};
+        ${typography.paragraph1};
         height: max-content;
         max-height: calc(100% - ${isNaN(top) ? top : +top + 'px'});
         min-width: 150px;
@@ -258,13 +251,13 @@ const Modal = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
       }, jsx("div", {
         css: ModalContainer,
         ref: ref
-      }, jsx("div", _extends({
+      }, jsx("div", {
         css: ModalBox,
-        ref: modalBoxRef
-      }, props, {
+        ref: modalBoxRef,
+        ...props,
         onMouseDown: moveable && dragAnyWhere ? dragMouseDown : null,
         style: style
-      }), jsx(ModalContext.Provider, {
+      }, jsx(ModalContext.Provider, {
         value: {
           show: onShowModal,
           close: onCloseModal,

package/components/others/extra/index.js

@@ -1,5 +1,3 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 /** @jsxRuntime classic */
 
 /** @jsx jsx */
@@ -7,6 +5,7 @@ import { memo, useState, useEffect, useMemo, useRef } from 'react';
 import PropTypes from 'prop-types';
 import { jsx, css } from '@emotion/core';
 import { brand, dark11, dark6, blue13 } from '../../../styles/colors';
+import { typography } from '../../../styles/typography';
 const icons = {
   expand: `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
         <path fillRule="evenodd" clip-rule="evenodd" d="M11.9999 12.0001C11.7729 12.0001 11.5449 11.9231 11.3599 11.7681L5.35989 6.76807C4.93589 6.41407 4.87889 5.78407 5.23189 5.36007C5.58589 4.93507 6.21489 4.87907 6.63989 5.23207L12.0109 9.70707L17.3729 5.39307C17.8029 5.04707 18.4339 5.11507 18.7789 5.54507C19.1259 5.97507 19.0569 6.60407 18.6269 6.95107L12.6269 11.7791C12.4439 11.9261 12.2219 12.0001 11.9999 12.0001ZM12.011 16.7076L17.373 12.3926C17.803 12.0476 18.434 12.1156 18.779 12.5446C19.125 12.9756 19.057 13.6046 18.627 13.9516L12.627 18.7796C12.444 18.9266 12.222 18.9996 12 18.9996C11.772 18.9996 11.545 18.9226 11.36 18.7676L5.35999 13.7676C4.93499 13.4146 4.87799 12.7846 5.23199 12.3596C5.58499 11.9356 6.21499 11.8776 6.63999 12.2316L12.011 16.7076Z" fill="currentColor"/>
@@ -35,10 +34,7 @@ const Extra = ({
     `;
   const extraText = css`
         margin-left: 9px;
-        font-family: sans-serif;
-        font-style: normal;
-        font-weight: bold;
-        font-size: 14px;
+        ${typography.heading4};
         color: ${dark6};
     `;
   const extra = css`
@@ -104,12 +100,12 @@ const Extra = ({
   }, displayText), []);
   /* End component */
 
-  return jsx("div", _extends({}, props, {
+  return jsx("div", { ...props,
     ref: extraRef,
     css: extra,
     onClick: handleClick,
     style: style
-  }), iconComp, textComp);
+  }, iconComp, textComp);
 };
 
 Extra.defaultProps = {

package/components/others/option-wrapper/index.js

@@ -0,0 +1,57 @@
+/** @jsxRuntime classic */
+
+/** @jsx jsx */
+import { useRef, useEffect, useState, forwardRef, useImperativeHandle } from 'react';
+import { jsx } from '@emotion/core';
+
+const OptionWrapper = WrappedComponent => {
+  return /*#__PURE__*/forwardRef((props, ref) => {
+    if (!ref) {
+      ref = useRef(null);
+    }
+
+    const [options, setOptions] = useState(props);
+    const componentRef = useRef(null);
+
+    const option = (option, optionValue) => {
+      if (typeof option === 'undefined') {
+        return options;
+      } else if (typeof option === 'string') {
+        if (typeof optionValue === 'undefined') return options[option];else setOptions({ ...options,
+          ...{
+            [option]: optionValue
+          }
+        });
+      } else if (typeof option === 'object') {
+        setOptions({ ...options,
+          ...option
+        });
+      }
+    };
+
+    useImperativeHandle(ref, () => {
+      var _componentRef$current;
+
+      const currentRef = componentRef.current || {};
+      const _instance = { ...componentRef.current.instance,
+        ...{
+          option
+        }
+      }; // methods
+
+      _instance.__proto__ = { ...((_componentRef$current = componentRef.current.instance) === null || _componentRef$current === void 0 ? void 0 : _componentRef$current.__proto__)
+      }; // hidden methods
+
+      currentRef.instance = _instance;
+      return currentRef;
+    });
+    useEffect(() => setOptions({ ...options,
+      ...props
+    }), [props]);
+    return jsx(WrappedComponent, { ...options,
+      ref: componentRef
+    });
+  });
+};
+
+export default OptionWrapper;

package/components/others/scrollbar/index.js

@@ -1,5 +1,3 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 /** @jsxRuntime classic */
 
 /** @jsx jsx */
@@ -66,12 +64,13 @@ const scrollbar = ({
 					}` : ''}
 		${getPosition[position]}
 	`;
-  return jsx("div", _extends({
+  return jsx("div", {
     css: Scrollbar,
     custom: custom,
     position: position,
-    style: style
-  }, props), children);
+    style: style,
+    ...props
+  }, children);
 };
 
 scrollbar.defaultProps = {