trepur_components 1.0.60 → 1.0.61

package/dist/src/lib/components/SocialBlock/style.module.css

@@ -1,75 +1,70 @@
-.hoverClassList {
-
-    border-width: 1px;
-
-    border-style: dashed
+.classList {
+    width:100%;
 }
 
 .dark {
-
-    background-color: var(--color-primary);
-
-    color: var(--color-white)
+    background-color:var(--color-primary);
+    color:var(--color-white);
 }
 
 .dark::placeholder {
-
-    color: var(--color-white)
+    color:var(--color-white);
 }
 
 .light {
-
-    background-color: var(--color-white);
-
-    color: var(--color-black)
+    background-color:var(--color-white);
+    color:var(--color-black);
 }
 
 .light::placeholder {
+    color:var(--color-primary);
+}
 
-    color: var(--color-primary)
+.outside {
+    display:flex;
+    width:100%;
 }
 
-.buttonWrapperClassList {
+.wrapper {
+    margin-left:auto;
+    margin-right:auto;
+    display:inline-block;
+    border-radius:9999px;
+    padding-left:0.5rem;
+    padding-right:0.5rem;
+}
 
-    display: flex;
+.dark .wrapper {
+    background:rgba(255, 255, 255, 0.4);
+}
 
-    flex-wrap: wrap
+.light .wrapper {
+    background:rgba(0, 54, 160, 0.7);
 }
 
-.title {
+.buttonWrapper {
+    display:flex;
+}
 
-    font-size: 22px
+.title {
+    font-size:22px;
 }
 
 @media (min-width: 640px) {
 
     .title {
-
-        font-size: 28px
+        font-size:28px;
     }
 }
 
 .text {
-
-    padding-top: 1rem
-}
-
-.cancelButton {
-
-    margin-top: 1rem;
-
-    margin-left: 1rem
-}
-
-.saveButton {
-
-    margin-top: 1rem
+    padding-top:1rem;
 }
 
 .buttonClasses {
-
-    margin-right: 0.5rem;
-
-    margin-bottom: 0.5rem
+    margin-top:0.5rem;
+    margin-bottom:0.5rem;
+    margin-left:0.25rem;
+    margin-right:0.25rem;
 }
 /*# sourceMappingURL=style.module.css.map */

package/dist/src/lib/components/SocialBlock/style.module.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/lib/components/SocialBlock/style.module.css"],"names":[],"mappings":"AACI;;IAAA,iBAA2B;;IAA3B;AAA2B;;AAI3B;;IAAA,sCAA8C;;IAA9C;AAA8C;;AAA9C;;IAAA;AAA8C;;AAI9C;;IAAA,oCAA8C;;IAA9C;AAA8C;;AAA9C;;IAAA;AAA8C;;AAI9C;;IAAA,aAAqB;;IAArB;AAAqB;;AAIrB;;IAAA;AAAyB;;AAAzB;;IAAA;;QAAA;IAAyB;AAAA;;AAIzB;;IAAA;AAAW;;AAIX;;IAAA,gBAAgB;;IAAhB;AAAgB;;AAIhB;;IAAA;AAAW;;AAIX;;IAAA,oBAAgB;;IAAhB;AAAgB","file":"style.module.css","sourcesContent":[".hoverClassList {\n    @apply border-dashed border;\n}\n\n.dark {\n    @apply placeholder-white bg-primary text-white;\n}\n\n.light {\n    @apply placeholder-primary bg-white text-black;\n}\n\n.buttonWrapperClassList {\n    @apply flex flex-wrap;\n}\n\n.title {\n    @apply text-md sm:text-lg;\n}\n\n.text {\n    @apply pt-4;\n}\n\n.cancelButton {\n    @apply mt-4 ml-4;\n}\n\n.saveButton {\n    @apply mt-4;\n}\n\n.buttonClasses {\n    @apply mr-2 mb-2;\n}"]}
+{"version":3,"sources":["../../../../../src/lib/components/SocialBlock/style.module.css"],"names":[],"mappings":"AACI;IAAA;AAAa;;AAIb;IAAA,qCAA8C;IAA9C;AAA8C;;AAA9C;IAAA;AAA8C;;AAI9C;IAAA,mCAA8C;IAA9C;AAA8C;;AAA9C;IAAA;AAA8C;;AAI9C;IAAA,YAAkB;IAAlB;AAAkB;;AAIlB;IAAA,gBAA6C;IAA7C,iBAA6C;IAA7C,oBAA6C;IAA7C,oBAA6C;IAA7C,mBAA6C;IAA7C;AAA6C;;AAGjD;IACI,mCAAmC;AACvC;;AAEA;IACI,gCAAgC;AACpC;;AAGI;IAAA;AAAW;;AAIX;IAAA;AAAyB;;AAAzB;;IAAA;QAAA;IAAyB;AAAA;;AAIzB;IAAA;AAAW;;AAIX;IAAA,iBAAgB;IAAhB,oBAAgB;IAAhB,mBAAgB;IAAhB;AAAgB","file":"style.module.css","sourcesContent":[".classList {\n    @apply w-full;\n}\n\n.dark {\n    @apply placeholder-white bg-primary text-white;\n}\n\n.light {\n    @apply placeholder-primary bg-white text-black;\n}\n\n.outside {\n    @apply w-full flex;\n}\n\n.wrapper {\n    @apply mx-auto px-2 inline-block rounded-full;\n}\n\n.dark .wrapper {\n    background:rgba(255, 255, 255, 0.4);\n}\n\n.light .wrapper {\n    background:rgba(0, 54, 160, 0.7);\n}\n\n.buttonWrapper {\n    @apply flex;\n}\n\n.title {\n    @apply text-md sm:text-lg;\n}\n\n.text {\n    @apply pt-4;\n}\n\n.buttonClasses {\n    @apply my-2 mx-1;\n}"]}

package/dist/src/lib/components/SocialButton/SocialButton.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import { ThemeTypes, SocialTypes } from '../../utils/controls';
+import React from "react";
+import { ThemeTypes, SocialTypes } from "../../utils/controls";
 export interface Props {
     id?: string;
     className?: string;
@@ -9,5 +9,5 @@ export interface Props {
     openInNewTab?: boolean;
     theme?: ThemeTypes;
 }
-declare const SocialButton: ({ id, className, onClick, type, href, openInNewTab, theme }: Props) => JSX.Element;
+declare const SocialButton: ({ id, className, onClick, type, href, openInNewTab, theme, }: Props) => JSX.Element;
 export default SocialButton;

package/dist/src/lib/components/SocialButton/SocialButton.js

@@ -1,25 +1,24 @@
-import React from 'react';
-import Icon from '../Icon/Icon';
-import classNames from 'classnames';
-import style from './style.module.css';
-const SocialButton = ({ id, className, onClick, type = 'facebook', href, openInNewTab = false, theme = 'theme-rupertbennett' }) => {
+import React from "react";
+import Icon from "../Icon/Icon";
+import classNames from "classnames";
+import style from "./style.module.css";
+const SocialButton = ({ id, className, onClick, type = "facebook", href, openInNewTab = false, theme = "theme-rupertbennett", }) => {
     const getColours = (type) => {
         const typeString = type;
         const colour = `interactive-${typeString}`;
         return colour;
     };
     const classList = classNames(style.classList, style[type], theme, className);
-    const aClassList = classNames(style.aClassList, style.hover);
     const iconType = {
-        facebook: 'facebook',
-        instagram: 'instagram',
-        github: 'github',
-        linkedin: 'linkedin'
+        facebook: "facebook-f",
+        instagram: "instagram",
+        github: "github",
+        linkedin: "linkedin-in",
     };
     const typeString = type.toString();
-    return (React.createElement("div", { id: id, className: classList },
-        React.createElement("a", Object.assign({ className: aClassList, href: href, "aria-label": `view me on ${typeString}`, onClick: onClick }, (openInNewTab && { target: '_blank' })),
-            React.createElement(Icon, { type: iconType[type], size: 3, brand: true, rounded: true, bgColour: type, colour: 'white', hoverBgColour: getColours(type), hoverColour: 'white' }))));
+    return (React.createElement("a", Object.assign({ className: style.anchor, href: href, "aria-label": `view me on ${typeString}`, onClick: onClick }, (openInNewTab && { target: "_blank" })),
+        React.createElement("div", { id: id, className: classList },
+            React.createElement(Icon, { type: iconType[type], className: "mx-auto my-auto", size: 2, brand: true, rounded: true, bgColour: type, colour: "white", hoverBgColour: getColours(type) }))));
 };
 export default SocialButton;
 //# sourceMappingURL=SocialButton.js.map

package/dist/src/lib/components/SocialButton/SocialButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SocialButton.js","sourceRoot":"","sources":["../../../../../src/lib/components/SocialButton/SocialButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,IAAI,MAAM,uBAAuB,CAAA;AACxC,OAAO,UAAU,MAAM,YAAY,CAAA;AAEnC,OAAO,KAAK,MAAM,oBAAoB,CAAA;AAYtC,MAAM,YAAY,GAAG,CAAC,EACpB,EAAE,EACF,SAAS,EACT,OAAO,EACP,IAAI,GAAG,UAAU,EACjB,IAAI,EACJ,YAAY,GAAG,KAAK,EACpB,KAAK,GAAG,qBAAqB,EACvB,EAAe,EAAE;IACvB,MAAM,UAAU,GAAG,CAAC,IAAa,EAAW,EAAE;QAC5C,MAAM,UAAU,GAAW,IAAI,CAAA;QAC/B,MAAM,MAAM,GAAW,eAAe,UAAU,EAAE,CAAA;QAClD,OAAO,MAAiB,CAAA;IAC1B,CAAC,CAAA;IAED,MAAM,SAAS,GAAG,UAAU,CAC1B,KAAK,CAAC,SAAS,EACf,KAAK,CAAC,IAAI,CAAC,EACX,KAAK,EACL,SAAS,CACV,CAAA;IAED,MAAM,UAAU,GAAG,UAAU,CAC3B,KAAK,CAAC,UAAU,EAChB,KAAK,CAAC,KAAK,CACZ,CAAA;IAED,MAAM,QAAQ,GAAG;QACf,QAAQ,EAAE,UAAU;QACpB,SAAS,EAAE,WAAW;QACtB,MAAM,EAAE,QAAQ;QAChB,QAAQ,EAAE,UAAU;KACrB,CAAA;IAED,MAAM,UAAU,GAAW,IAAI,CAAC,QAAQ,EAAE,CAAA;IAC1C,OAAO,CACL,6BACE,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,SAAS;QAEpB,yCACE,SAAS,EAAE,UAAU,EACrB,IAAI,EAAE,IAAI,gBACE,cAAc,UAAU,EAAE,EACtC,OAAO,EAAE,OAAO,IACZ,CAAC,YAAY,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC;YAE1C,oBAAC,IAAI,IACH,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC,EACpB,IAAI,EAAE,CAAC,EACP,KAAK,QACL,OAAO,QACP,QAAQ,EAAE,IAAI,EACd,MAAM,EAAC,OAAO,EACd,aAAa,EAAE,UAAU,CAAC,IAAe,CAAC,EAC1C,WAAW,EAAC,OAAO,GACnB,CACA,CACA,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,YAAY,CAAA"}
+{"version":3,"file":"SocialButton.js","sourceRoot":"","sources":["../../../../../src/lib/components/SocialButton/SocialButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,uBAAuB,CAAC;AACzC,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,KAAK,MAAM,oBAAoB,CAAC;AAYvC,MAAM,YAAY,GAAG,CAAC,EACpB,EAAE,EACF,SAAS,EACT,OAAO,EACP,IAAI,GAAG,UAAU,EACjB,IAAI,EACJ,YAAY,GAAG,KAAK,EACpB,KAAK,GAAG,qBAAqB,GACvB,EAAe,EAAE;IACvB,MAAM,UAAU,GAAG,CAAC,IAAa,EAAW,EAAE;QAC5C,MAAM,UAAU,GAAW,IAAI,CAAC;QAChC,MAAM,MAAM,GAAW,eAAe,UAAU,EAAE,CAAC;QACnD,OAAO,MAAiB,CAAC;IAC3B,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,UAAU,CAAC,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,CAAC;IAE7E,MAAM,QAAQ,GAAG;QACf,QAAQ,EAAE,YAAY;QACtB,SAAS,EAAE,WAAW;QACtB,MAAM,EAAE,QAAQ;QAChB,QAAQ,EAAE,aAAa;KACxB,CAAC;IAEF,MAAM,UAAU,GAAW,IAAI,CAAC,QAAQ,EAAE,CAAC;IAC3C,OAAO,CACL,yCACE,SAAS,EAAE,KAAK,CAAC,MAAM,EACvB,IAAI,EAAE,IAAI,gBACE,cAAc,UAAU,EAAE,EACtC,OAAO,EAAE,OAAO,IACZ,CAAC,YAAY,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC;QAE1C,6BAAK,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS;YAC/B,oBAAC,IAAI,IACH,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC,EACpB,SAAS,EAAC,iBAAiB,EAC3B,IAAI,EAAE,CAAC,EACP,KAAK,QACL,OAAO,QACP,QAAQ,EAAE,IAAI,EACd,MAAM,EAAC,OAAO,EACd,aAAa,EAAE,UAAU,CAAC,IAAe,CAAC,GAC1C,CACE,CACJ,CACL,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/src/lib/components/SocialButton/style.module.css

@@ -1,19 +1,14 @@
 .classList {
-    display: inline-block;
+    display: flex;
+    height: 4rem;
+    width: 4rem;
     transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
     border-radius: 9999px;
     transition-duration: 500ms;
 }
 
-.aClassList {
-    display: inline-block;
-    border-width: 2px;
-    border-color: var(--color-transparent);
-}
-
-.aClassList:focus {
-    border-width: 2px;
-    border-color: var(--color-primary);
+.anchor {
+    border-radius: 9999px;
 }
 
 .facebook {

package/dist/src/lib/components/SocialButton/style.module.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/lib/components/SocialButton/style.module.css"],"names":[],"mappings":"AACI;IAAA,qBAAuD;IAAvD,+LAAuD;IAAvD,qBAAuD;IAAvD;AAAuD;;AAIvD;IAAA,qBAA+C;IAA/C,iBAA+C;IAA/C;AAA+C;;AAI/C;IAAA,iBAA8B;IAA9B;AAA8B;;AAI9B;IAAA;AAAgD;;AAAhD;IAAA;AAAgD;;AAGpD;IACI,6nBAA6nB;AACjoB;;AAEA;IACI,6nBAA6nB;AACjoB;;AAGI;IAAA;AAA4C;;AAA5C;IAAA;AAA4C;;AAI5C;IAAA;AAAgD;;AAAhD;IAAA;AAAgD","file":"style.module.css","sourcesContent":[".classList {\n    @apply duration-500 transform inline-block rounded-full;\n}\n\n.aClassList {\n    @apply inline-block border-2 border-transparent;\n}\n\n.aClassList:focus {\n    @apply border-2 border-primary;\n}\n\n.facebook {\n    @apply bg-facebook hover:bg-interactive-facebook;\n}\n\n.instagram {\n    background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);\n}\n\n.instagram:hover {\n    background: radial-gradient(circle farthest-corner at 95% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);\n}\n\n.github {\n    @apply bg-github hover:bg-interactive-github;\n}\n\n.linkedin {\n    @apply bg-linkedin hover:bg-interactive-linkedin;\n}"]}
+{"version":3,"sources":["../../../../../src/lib/components/SocialButton/style.module.css"],"names":[],"mappings":"AACI;IAAA,aAAyD;IAAzD,YAAyD;IAAzD,WAAyD;IAAzD,+LAAyD;IAAzD,qBAAyD;IAAzD;AAAyD;;AAIzD;IAAA;AAAmB;;AAInB;IAAA;AAAgD;;AAAhD;IAAA;AAAgD;;AAGpD;IACI,6nBAA6nB;AACjoB;;AAEA;IACI,6nBAA6nB;AACjoB;;AAGI;IAAA;AAA4C;;AAA5C;IAAA;AAA4C;;AAI5C;IAAA;AAAgD;;AAAhD;IAAA;AAAgD","file":"style.module.css","sourcesContent":[".classList {\n    @apply duration-500 transform rounded-full flex w-16 h-16;\n}\n\n.anchor {\n    @apply rounded-full;\n}\n\n.facebook {\n    @apply bg-facebook hover:bg-interactive-facebook;\n}\n\n.instagram {\n    background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);\n}\n\n.instagram:hover {\n    background: radial-gradient(circle farthest-corner at 95% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);\n}\n\n.github {\n    @apply bg-github hover:bg-interactive-github;\n}\n\n.linkedin {\n    @apply bg-linkedin hover:bg-interactive-linkedin;\n}"]}

package/dist/src/lib/components/TextAndTitle/TextAndTitle.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
-import { Props as buttonProps } from '../Button/Button';
-import { Colours, ThemeTypes } from '../../utils/controls';
+import React from "react";
+import { Props as buttonProps } from "../Button/Button";
+import { Colours, ThemeTypes } from "../../utils/controls";
 export interface Props {
     id: string;
     className?: string;

package/dist/src/lib/components/TextAndTitle/TextAndTitle.js

@@ -1,22 +1,18 @@
-import React, { useState } from 'react';
-import Input from '../Input/Input';
-import Button from '../Button/Button';
-import classNames from 'classnames';
-import TextArea from '../TextArea/TextArea';
-import style from './style.module.css';
-import Container from '../Container/Container';
-import ComponentWrapper from '../ComponentWrapper/ComponentWrapper';
-const TextAndTitle = ({ id, className, title, description, bgColour, titleClasses, editTitleClasses, editTextClasses, editInputClasses, textClasses, textLineOne, textLineTwo, textLineThree, titleBold, textCenter, titleCenter, withLiveUpdates = false, onSave, saveButtonProps, cancelButtonProps, isHorizontal = true, children, theme = 'theme-rupertbennett' }) => {
+import React, { useState } from "react";
+import classNames from "classnames";
+import style from "./style.module.css";
+import ComponentWrapper from "../ComponentWrapper/ComponentWrapper";
+const TextAndTitle = ({ id, className, title, description, bgColour, titleClasses, editTitleClasses, editTextClasses, editInputClasses, textClasses, textLineOne, textLineTwo, textLineThree, titleBold, textCenter, titleCenter, withLiveUpdates = false, onSave, saveButtonProps, cancelButtonProps, isHorizontal = true, children, theme = "theme-rupertbennett", }) => {
     const getLineHeight = (id) => {
         const element = document.getElementById(id);
         const divHeight = (element === null || element === void 0 ? void 0 : element.offsetHeight) !== undefined ? element.offsetHeight : 0;
-        const lineHeight = (element != null) ? parseFloat(getComputedStyle(element).fontSize) : 1;
-        const pt = (element != null) ? parseFloat(getComputedStyle(element).paddingTop) : 0;
-        const pb = (element != null) ? parseFloat(getComputedStyle(element).paddingBottom) : 0;
-        const mt = (element != null) ? parseFloat(getComputedStyle(element).marginTop) : 0;
-        const mb = (element != null) ? parseFloat(getComputedStyle(element).marginBottom) : 0;
-        const bw = (element != null) ? parseFloat(getComputedStyle(element).borderWidth) : 0;
-        const height = divHeight - mt - mb - pt - pb - (bw * 2);
+        const lineHeight = element != null ? parseFloat(getComputedStyle(element).fontSize) : 1;
+        const pt = element != null ? parseFloat(getComputedStyle(element).paddingTop) : 0;
+        const pb = element != null ? parseFloat(getComputedStyle(element).paddingBottom) : 0;
+        const mt = element != null ? parseFloat(getComputedStyle(element).marginTop) : 0;
+        const mb = element != null ? parseFloat(getComputedStyle(element).marginBottom) : 0;
+        const bw = element != null ? parseFloat(getComputedStyle(element).borderWidth) : 0;
+        const height = divHeight - mt - mb - pt - pb - bw * 2;
         if (isHorizontal) {
             return Math.floor(height / lineHeight) - 1;
         }
@@ -26,7 +22,7 @@ const TextAndTitle = ({ id, className, title, description, bgColour, titleClasse
         title,
         textLineOne,
         textLineTwo,
-        textLineThree
+        textLineThree,
     };
     const [isInEditingMode, setIsInEditingMode] = useState(false);
     const [componentData, setComponentData] = useState(defaultComponentData);
@@ -35,22 +31,21 @@ const TextAndTitle = ({ id, className, title, description, bgColour, titleClasse
     const titleClassList = classNames({
         [style.fontBold]: titleBold,
         [style.textCenter]: titleCenter,
-        [borderClasses]: withLiveUpdates && !isInEditingMode && isHorizontal
+        [borderClasses]: withLiveUpdates && !isInEditingMode && isHorizontal,
     }, titleClasses, style.titleClassList);
     const textClassList = classNames({
         [style.textCenter]: textCenter,
-        [borderClasses]: withLiveUpdates && !isInEditingMode && isHorizontal
+        [borderClasses]: withLiveUpdates && !isInEditingMode && isHorizontal,
     }, textClasses, style.textClassList);
     const toggleEditState = () => {
-        withLiveUpdates &&
-            setIsInEditingMode(!isInEditingMode);
+        withLiveUpdates && setIsInEditingMode(!isInEditingMode);
     };
     const handleButtonSave = () => {
         const arr = [];
-        arr.push({ key: 'title', value: componentData.title });
-        arr.push({ key: 'textLineOne', value: componentData.textLineOne });
-        arr.push({ key: 'textLineTwo', value: componentData.textLineTwo });
-        arr.push({ key: 'textLineThree', value: componentData.textLineThree });
+        arr.push({ key: "title", value: componentData.title });
+        arr.push({ key: "textLineOne", value: componentData.textLineOne });
+        arr.push({ key: "textLineTwo", value: componentData.textLineTwo });
+        arr.push({ key: "textLineThree", value: componentData.textLineThree });
         toggleEditState();
         onSave === null || onSave === void 0 ? void 0 : onSave(arr, id);
     };
@@ -59,43 +54,28 @@ const TextAndTitle = ({ id, className, title, description, bgColour, titleClasse
     };
     const handleChange = (e) => {
         let id = e.target.id;
-        id = id.split('-')[id.split('-').length - 1];
+        id = id.split("-")[id.split("-").length - 1];
         setComponentData(Object.assign(Object.assign({}, componentData), { [id]: e.target.value }));
     };
     const wrapperClassList = classNames({
         [style.horizontalWrapperClassList]: isHorizontal,
         [style.liveUpdatesWrapperClassList]: withLiveUpdates && !isInEditingMode,
-        [style.wrapperClassList]: isHorizontal
+        [style.wrapperClassList]: isHorizontal,
     });
     const titleWrapperClassList = classNames({
-        [style.horizontalTitleWrapperClassList]: isHorizontal
+        [style.horizontalTitleWrapperClassList]: isHorizontal,
     });
     const textWrapperClassList = classNames({
-        [style.horizontalTextWrapperClassList]: isHorizontal
+        [style.horizontalTextWrapperClassList]: isHorizontal,
     });
-    const node = document.getElementById('textLineOne');
-    return (React.createElement(ComponentWrapper, { id: id, className: classList, title: title, description: description, bgColour: bgColour, theme: theme }, withLiveUpdates && isInEditingMode
-        ? (React.createElement(Container, null,
-            React.createElement("div", { className: wrapperClassList },
-                React.createElement("div", { className: titleWrapperClassList }, (componentData === null || componentData === void 0 ? void 0 : componentData.title) !== undefined
-                    ? (React.createElement(Input, { className: editTitleClasses, value: componentData === null || componentData === void 0 ? void 0 : componentData.title, onChange: (e) => handleChange(e), type: 'text', bgColour: bgColour }))
-                    : (React.createElement("div", null, children))),
-                React.createElement("div", { className: textWrapperClassList },
-                    React.createElement(TextArea, { className: editTextClasses, rows: getLineHeight('textLineOne') + 1, onChange: (e) => handleChange(e) }, node === null || node === void 0 ? void 0 : node.innerHTML),
-                    React.createElement(TextArea, { className: editTextClasses, rows: getLineHeight('textLineTwo'), onChange: (e) => handleChange(e) }, componentData.textLineTwo),
-                    React.createElement(TextArea, { className: editTextClasses, rows: getLineHeight('textLineThree'), onChange: (e) => handleChange(e) }, componentData.textLineThree))),
-            React.createElement("div", { className: style.buttonWrapper },
-                React.createElement(Button, { className: saveButtonProps === null || saveButtonProps === void 0 ? void 0 : saveButtonProps.className, onClick: handleButtonSave }, saveButtonProps === null || saveButtonProps === void 0 ? void 0 : saveButtonProps.children),
-                React.createElement(Button, { className: cancelButtonProps === null || cancelButtonProps === void 0 ? void 0 : cancelButtonProps.className, onClick: handleButtonCancel }, cancelButtonProps === null || cancelButtonProps === void 0 ? void 0 : cancelButtonProps.children))))
-        : (React.createElement(Container, null,
-            React.createElement("div", { className: wrapperClassList, onClick: toggleEditState },
-                React.createElement("div", { className: titleWrapperClassList }, children !== undefined && children !== null
-                    ? (children)
-                    : (React.createElement("h1", { className: titleClassList }, componentData.title))),
-                React.createElement("div", { className: textWrapperClassList },
-                    React.createElement("div", { id: 'textLineOne', className: textClassList }, componentData.textLineOne),
-                    React.createElement("div", { id: 'textLineTwo', className: textClassList }, componentData.textLineTwo),
-                    React.createElement("div", { id: 'textLineThree', className: textClassList }, componentData.textLineThree)))))));
+    const node = document.getElementById("textLineOne");
+    return (React.createElement(ComponentWrapper, { id: id, className: classList, title: title, description: description, bgColour: bgColour, theme: theme },
+        React.createElement("div", { className: wrapperClassList, onClick: toggleEditState },
+            React.createElement("div", { className: titleWrapperClassList }, children !== undefined && children !== null ? (children) : (React.createElement("h1", { className: titleClassList }, componentData.title))),
+            React.createElement("div", { className: textWrapperClassList },
+                React.createElement("div", { id: "textLineOne", className: textClassList }, componentData.textLineOne),
+                React.createElement("div", { id: "textLineTwo", className: textClassList }, componentData.textLineTwo),
+                React.createElement("div", { id: "textLineThree", className: textClassList }, componentData.textLineThree)))));
 };
 export default TextAndTitle;
 //# sourceMappingURL=TextAndTitle.js.map

package/dist/src/lib/components/TextAndTitle/TextAndTitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextAndTitle.js","sourceRoot":"","sources":["../../../../../src/lib/components/TextAndTitle/TextAndTitle.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"TextAndTitle.js","sourceRoot":"","sources":["../../../../../src/lib/components/TextAndTitle/TextAndTitle.tsx"],"names":[],"mappings":"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"}

package/dist/src/lib/components/TextArea/TextArea.d.ts

@@ -1,25 +1,28 @@
 /// <reference types="react" />
-import { ThemeTypes } from '../../utils/controls';
+import { Colours, ThemeTypes } from "../../utils/controls";
 export interface Props {
     id?: string;
     className?: string;
-    label?: string;
-    placeholder?: string;
-    name?: string;
+    autoComplete?: string;
     disabled?: boolean;
-    rows?: number;
-    cols?: number;
-    autoFocus?: boolean;
     formId?: string;
     maxLength?: number;
-    readOnly?: boolean;
+    minLength?: number;
     required?: boolean;
+    readOnly?: boolean;
+    label?: string;
+    name?: string;
+    placeholder?: string;
+    withValidation?: boolean;
+    onChange?: (e: any) => void;
     onBlur?: () => void;
     onFocus?: () => void;
-    onChange?: (e: any) => void;
-    children?: any;
-    fullWidth?: boolean;
+    onClick?: () => void;
+    errors?: string[];
+    errorState?: boolean;
+    value?: string;
+    bgColour?: Colours;
     theme?: ThemeTypes;
 }
-declare const TextArea: ({ id, className, label, placeholder, name, disabled, rows, cols, autoFocus, formId, maxLength, readOnly, required, onBlur, onFocus, onChange, children, fullWidth, theme }: Props) => JSX.Element;
+declare const TextArea: ({ id, className, autoComplete, disabled, formId, maxLength, minLength, required, readOnly, label, name, placeholder, onChange, onBlur, onFocus, onClick, withValidation, errors, errorState, value, theme, }: Props) => JSX.Element;
 export default TextArea;

package/dist/src/lib/components/TextArea/TextArea.js

@@ -1,24 +1,29 @@
-import React, { useRef } from 'react';
-import classNames from 'classnames';
-import style from './style.module.css';
-const TextArea = ({ id, className, label, placeholder, name, disabled, rows, cols, autoFocus, formId, maxLength, readOnly, required = false, onBlur, onFocus, onChange, children, fullWidth = false, theme = 'theme-rupertbennett' }) => {
-    const fullWidthClasses = classNames({
-        [style.fullWidth]: fullWidth,
-        [style.notFullWidth]: !fullWidth
-    });
-    const headerClassList = classNames(fullWidthClasses, style.classList, className, theme);
+import React, { useRef } from "react";
+import classNames from "classnames";
+import style from "./style.module.css";
+const TextArea = ({ id, className, autoComplete, disabled, formId, maxLength, minLength, required = false, readOnly, label, name, placeholder, onChange, onBlur, onFocus, onClick, withValidation, errors, errorState = false, value, theme = "theme-rupertbennett", }) => {
+    const newId = id !== undefined ? `-${id}` : "";
+    const valueClassList = classNames({
+        [style.errorState]: errors != null || errorState,
+    }, style.value);
+    const labelClassList = classNames({
+        [style.labelError]: errors != null || errorState,
+    }, style.label);
+    const headerClassList = classNames(style.classList, className, theme);
     const btnRef = useRef(null);
     const handleClick = () => {
         var _a;
         (_a = btnRef.current) === null || _a === void 0 ? void 0 : _a.focus();
     };
-    return (React.createElement("div", { id: id, className: headerClassList, onClick: handleClick },
-        React.createElement("div", { className: style.labelWrapper },
-            React.createElement("p", { className: style.label }, label),
-            required && React.createElement("p", { className: style.required }, "\u00A0*")),
-        React.createElement("textarea", { ref: btnRef, className: style.value, 
-            // autoFocus={autoFocus}
-            form: formId, maxLength: maxLength, readOnly: readOnly, required: required, disabled: disabled, rows: rows, cols: cols, name: name, placeholder: placeholder, onChange: onChange, onFocus: onFocus, onBlur: onBlur, defaultValue: children })));
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { id: id, className: headerClassList, onClick: handleClick },
+            React.createElement("div", { className: style.labelWrapper },
+                React.createElement("p", { className: labelClassList }, label),
+                required && React.createElement("p", { className: style.required }, "\u00A0*")),
+            React.createElement("textarea", { ref: btnRef, id: `input${newId}`, className: valueClassList, autoComplete: autoComplete, disabled: disabled, form: formId, maxLength: maxLength, minLength: minLength, required: required, readOnly: readOnly, name: name, value: value, placeholder: placeholder, onChange: (e) => onChange === null || onChange === void 0 ? void 0 : onChange(e), onBlur: onBlur, onFocus: onFocus, onClick: onClick })),
+        withValidation === true && (React.createElement("div", { id: `errors${newId}`, className: classNames(style.errors, theme) }, errors === null || errors === void 0 ? void 0 : errors.map((error, i) => {
+            return (React.createElement("p", { key: `error-msg-${i + 0}`, className: style.errorText }, error));
+        })))));
 };
 export default TextArea;
 //# sourceMappingURL=TextArea.js.map

package/dist/src/lib/components/TextArea/TextArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../../../../src/lib/components/TextArea/TextArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,KAAK,MAAM,oBAAoB,CAAA;AAyBtC,MAAM,QAAQ,GAAG,CAAC,EAChB,EAAE,EACF,SAAS,EACT,KAAK,EACL,WAAW,EACX,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,IAAI,EACJ,SAAS,EACT,MAAM,EACN,SAAS,EACT,QAAQ,EACR,QAAQ,GAAG,KAAK,EAChB,MAAM,EACN,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,SAAS,GAAG,KAAK,EACjB,KAAK,GAAG,qBAAqB,EACvB,EAAe,EAAE;IACvB,MAAM,gBAAgB,GAAG,UAAU,CAAC;QAClC,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,SAAS;QAC5B,CAAC,KAAK,CAAC,YAAY,CAAC,EAAE,CAAC,SAAS;KACjC,CAAC,CAAA;IAEF,MAAM,eAAe,GACnB,UAAU,CAAC,gBAAgB,EAAE,KAAK,CAAC,SAAS,EAAE,SAAS,EAAE,KAAK,CAAC,CAAA;IAEjE,MAAM,MAAM,GAAG,MAAM,CAAM,IAAI,CAAC,CAAA;IAEhC,MAAM,WAAW,GAAG,GAAS,EAAE;;QAC7B,MAAA,MAAM,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAA;IACzB,CAAC,CAAA;IAED,OAAO,CACL,6BACE,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,eAAe,EAC1B,OAAO,EAAE,WAAW;QAEpB,6BAAK,SAAS,EAAE,KAAK,CAAC,YAAY;YAChC,2BAAG,SAAS,EAAE,KAAK,CAAC,KAAK,IAAG,KAAK,CAAK;YACrC,QAAQ,IAAI,2BAAG,SAAS,EAAE,KAAK,CAAC,QAAQ,cAAa,CAClD;QACN,kCACE,GAAG,EAAE,MAAM,EACX,SAAS,EAAE,KAAK,CAAC,KAAK;YACtB,wBAAwB;YACxB,IAAI,EAAE,MAAM,EACZ,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,YAAY,EAAE,QAAQ,GACtB,CACE,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,QAAQ,CAAA"}
+{"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../../../../src/lib/components/TextArea/TextArea.tsx"],"names":[],"mappings":"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"}