@via-profit/ui-kit 0.1.0-rc.30 → 0.1.0-rc.32

package/Modal/BaseModal/index.js

@@ -43,14 +43,17 @@ const BaseModal = props => {
         window.document.body.appendChild(newNode);
         return newNode;
     }, []);
-    react_1.default.useEffect(() => () => {
-        if (typeof window !== 'undefined') {
-            const node = window.document.body.querySelector(`#${context_1.PORTAL_ID}`);
-            if (node) {
-                node.remove();
-            }
-        }
-    }, []);
+    // React.useEffect(
+    //   () => () => {
+    //     if (typeof window !== 'undefined') {
+    //       const node = window.document.body.querySelector(`#${PORTAL_ID}`);
+    //       if (node) {
+    //         node.remove();
+    //       }
+    //     }
+    //   },
+    //   [],
+    // );
     return (react_1.default.createElement(NoSSR_1.default, null, domLoaded &&
         portalEl &&
         react_dom_1.default.createPortal(react_1.default.createElement(context_1.ContextProvider, { initialState: {

package/Typography/Base.d.ts

@@ -1,4 +1,8 @@
 /// <reference types="react" />
+/**
+ * @deprecated - Use `Span` instead\
+ * Example: `import Span from '@via-profit/ui-kit/Span'`
+ */
 declare const Base: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;

package/Typography/Base.js

@@ -4,6 +4,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const styled_1 = __importDefault(require("@emotion/styled"));
+/**
+ * @deprecated - Use `Span` instead\
+ * Example: `import Span from '@via-profit/ui-kit/Span'`
+ */
 const Base = styled_1.default.span `
   font-size: 1rem;
   font-weight: 300;

package/Typography/Del.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
-declare const Del: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").DelHTMLAttributes<HTMLModElement>, HTMLModElement>, {}>;
-export default Del;
+import React from 'react';
+export type DelProps = React.DelHTMLAttributes<HTMLModElement>;
+declare const _default: React.ForwardRefExoticComponent<DelProps & React.RefAttributes<HTMLModElement>>;
+export default _default;

package/Typography/Del.js

@@ -1,11 +1,27 @@
 "use strict";
+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;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
-const Del = styled_1.default.del `
+const Styled = styled_1.default.del `
   font-size: 1em;
   color: currentColor;
 `;
-exports.default = Del;
+const Em = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(Styled, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(Em);

package/Typography/Em.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
-declare const Em: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
-export default Em;
+import React from 'react';
+export type EmProps = React.HTMLAttributes<HTMLElement>;
+declare const _default: React.ForwardRefExoticComponent<EmProps & React.RefAttributes<HTMLElement>>;
+export default _default;

package/Typography/Em.js

@@ -1,11 +1,27 @@
 "use strict";
+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;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
-const Em = styled_1.default.em `
+const Styled = styled_1.default.em `
   font-size: 1em;
   color: currentColor;
 `;
-exports.default = Em;
+const Em = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(Styled, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(Em);

package/Typography/H1.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
-declare const H1: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
-export default H1;
+import React from 'react';
+export type H1Props = React.HTMLAttributes<HTMLHeadingElement>;
+declare const _default: React.ForwardRefExoticComponent<H1Props & React.RefAttributes<HTMLHeadingElement>>;
+export default _default;

package/Typography/H1.js

@@ -1,12 +1,28 @@
 "use strict";
+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;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
-const H1 = styled_1.default.h1 `
+const Styled = styled_1.default.h1 `
   font-size: 2rem;
   font-weight: 700;
   color: currentColor;
 `;
-exports.default = H1;
+const H1 = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(Styled, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(H1);

package/Typography/H2.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
-declare const H2: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
-export default H2;
+import React from 'react';
+export type H2Props = React.HTMLAttributes<HTMLHeadingElement>;
+declare const _default: React.ForwardRefExoticComponent<H2Props & React.RefAttributes<HTMLHeadingElement>>;
+export default _default;

package/Typography/H2.js

@@ -1,12 +1,28 @@
 "use strict";
+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;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
-const H2 = styled_1.default.h2 `
+const Styled = styled_1.default.h2 `
   font-size: 1.5rem;
   font-weight: 500;
   color: currentColor;
 `;
-exports.default = H2;
+const H2 = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(Styled, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(H2);

package/Typography/H3.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
-declare const H3: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
-export default H3;
+import React from 'react';
+export type H3Props = React.HTMLAttributes<HTMLHeadingElement>;
+declare const _default: React.ForwardRefExoticComponent<H3Props & React.RefAttributes<HTMLHeadingElement>>;
+export default _default;

package/Typography/H3.js

@@ -1,12 +1,28 @@
 "use strict";
+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;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
-const H3 = styled_1.default.h3 `
+const Styled = styled_1.default.h3 `
   font-size: 1.25rem;
   font-weight: 500;
   color: currentColor;
 `;
-exports.default = H3;
+const H3 = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(Styled, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(H3);

package/Typography/H4.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
-declare const H4: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
-export default H4;
+import React from 'react';
+export type H4Props = React.HTMLAttributes<HTMLHeadingElement>;
+declare const _default: React.ForwardRefExoticComponent<H4Props & React.RefAttributes<HTMLHeadingElement>>;
+export default _default;

package/Typography/H4.js

@@ -1,12 +1,28 @@
 "use strict";
+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;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
-const H4 = styled_1.default.h4 `
+const Styled = styled_1.default.h4 `
   font-size: 1.2rem;
   font-weight: 500;
   color: currentColor;
 `;
-exports.default = H4;
+const H4 = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(Styled, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(H4);

package/Typography/H5.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
-declare const H5: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
-export default H5;
+import React from 'react';
+export type H5Props = React.HTMLAttributes<HTMLHeadingElement>;
+declare const _default: React.ForwardRefExoticComponent<H5Props & React.RefAttributes<HTMLHeadingElement>>;
+export default _default;

package/Typography/H5.js

@@ -1,12 +1,28 @@
 "use strict";
+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;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
-const H5 = styled_1.default.h5 `
+const Styled = styled_1.default.h5 `
   font-size: 1.2rem;
   font-weight: 300;
   color: currentColor;
 `;
-exports.default = H5;
+const H5 = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(Styled, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(H5);

package/Typography/Span.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
-declare const Span: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
-export default Span;
+import React from 'react';
+export type SpanProps = React.HTMLAttributes<HTMLSpanElement>;
+declare const _default: React.ForwardRefExoticComponent<SpanProps & React.RefAttributes<HTMLSpanElement>>;
+export default _default;

package/Typography/Span.js

@@ -1,11 +1,27 @@
 "use strict";
+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;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
-const Span = styled_1.default.span `
+const Styled = styled_1.default.span `
   font-size: 1em;
   color: currentColor;
 `;
-exports.default = Span;
+const Span = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(Styled, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(Span);

package/Typography/Strong.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
-declare const Strong: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
-export default Strong;
+import React from 'react';
+export type StrongProps = React.HTMLAttributes<HTMLElement>;
+declare const _default: React.ForwardRefExoticComponent<StrongProps & React.RefAttributes<HTMLElement>>;
+export default _default;

package/Typography/Strong.js

@@ -1,11 +1,27 @@
 "use strict";
+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;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
-const Strong = styled_1.default.strong `
+const Styled = styled_1.default.strong `
   font-size: 1em;
   color: currentColor;
 `;
-exports.default = Strong;
+const Strong = (props, ref) => {
+    const { children } = props, nativeProps = __rest(props, ["children"]);
+    return (react_1.default.createElement(Styled, Object.assign({}, nativeProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(Strong);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@via-profit/ui-kit",
-  "version": "0.1.0-rc.30",
+  "version": "0.1.0-rc.32",
   "description": "UI Kit",
   "repository": {
     "type": "git",