@sellout/ui 0.0.397 → 0.0.399

package/build/src/components/Input.js

@@ -0,0 +1,182 @@
+import { __makeTemplateObject, __assign } from '../../node_modules/tslib/tslib.es6.js';
+import React, { useState, Fragment } from 'react';
+import styled from 'styled-components';
+import * as Polished from 'polished';
+import { Colors } from '../Colors.js';
+import Icon, { Icons } from './Icon.js';
+import Loader, { LoaderSizes } from './Loader.js';
+import Label from './Label.js';
+import Flex from './Flex.js';
+import MaxLength from './MaxLength.js';
+import ValidationError from './ValidationError.js';
+import { media } from '../utils/MediaQuery.js';
+import SvgRenderer from './SvgRendrer.js';
+
+var InputSizes;
+(function (InputSizes) {
+    InputSizes["Large"] = "Large";
+    InputSizes["Regular"] = "Regular";
+    InputSizes["CustomInputHeight"] = "CustomInputHeight";
+})(InputSizes || (InputSizes = {}));
+var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: ", ";\n  margin: ", ";\n"], ["\n  width: ", ";\n  margin: ", ";\n"])), function (props) { return props.width; }, function (props) { return props.margin; });
+var IncrementButton = styled.button(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  font-size: 22px;\n  padding: 5px 14px;\n  cursor: pointer;\n  border: none;\n  background-color: #f0f0f0;\n"], ["\n  font-size: 22px;\n  padding: 5px 14px;\n  cursor: pointer;\n  border: none;\n  background-color: #f0f0f0;\n"])));
+var Form = styled.form(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  width: ", ";\n  display: flex;\n  flex-direction: row;\n  position: relative;\n  border-radius: 10px;\n  transition: all 0.2s;\n  border: 1px solid\n    ", ";\n\n  border-color: ", ";\n  overflow: hidden;\n  background-color: ", ";\n\n  > * {\n    background-color: ", ";\n  }\n"], ["\n  width: ", ";\n  display: flex;\n  flex-direction: row;\n  position: relative;\n  border-radius: 10px;\n  transition: all 0.2s;\n  border: 1px solid\n    ", ";\n\n  border-color: ", ";\n  overflow: hidden;\n  background-color: ", ";\n\n  > * {\n    background-color: ", ";\n  }\n"])), function (props) { return props.width; }, function (props) {
+    if (props.onFocusedColor && props.focused)
+        return Colors.HeadingSecondary;
+    if (props.focused)
+        return Colors.Grey4;
+    if (props.hovered)
+        return Polished.darken(0.05, Colors.Grey5);
+    return !props.focused && props.onFocusedColor ? Colors.SecondaryStroke : Colors.Grey5;
+}, function (props) { return (props.validationError && props.validationDarkThemeBorderColor ? Colors.ErrorRed : ""); }, function (props) {
+    return props.disabled ? "".concat(Colors.Grey6, " !important") : null;
+}, function (props) {
+    return props.disabled && props.disableDarkThemeBg ? "".concat(Colors.InteractiveBGSecondary, " !important") : (props.disabled ? "".concat(Colors.Grey6, " !important") : null);
+});
+var Button = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  position: absolute;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: ", ";\n  height: ", ";\n  width: ", ";\n  border-radius: 0 10px 10px 0;\n  top: -1px;\n  right: ", ";\n  transition: all 0.2s;\n\n  &:hover {\n    cursor: ", ";\n  }\n\n  &:active {\n    cursor: ", ";\n  }\n"], ["\n  position: absolute;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: ", ";\n  height: ", ";\n  width: ", ";\n  border-radius: 0 10px 10px 0;\n  top: -1px;\n  right: ", ";\n  transition: all 0.2s;\n\n  &:hover {\n    cursor: ", ";\n  }\n\n  &:active {\n    cursor: ", ";\n  }\n"])), Colors.White, function (props) {
+    if (props.size === InputSizes.Large)
+        return "50px";
+    if (props.size === InputSizes.Regular)
+        return "40px";
+    return null;
+}, function (props) {
+    if (props.size === InputSizes.Large)
+        return "50px";
+    if (props.size === InputSizes.Regular)
+        return "40px";
+    return null;
+}, function (props) { return (props.codeApply ? "0px" : "-1px"); }, function (props) { return (props.onClick ? "pointer" : null); }, function (props) { return (props.onClick ? "pointer" : null); });
+var IconContainer = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 18px;\n"], ["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 18px;\n"])));
+var TextContainer = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  color: ", ";\n  font-size: 1.7rem;\n  text-decoration: underline;\n  font-weight: 500;\n"], ["\n  color: ", ";\n  font-size: 1.7rem;\n  text-decoration: underline;\n  font-weight: 500;\n"])), function (props) { return (props.canSubmit ? Colors.Orange : Colors.Orange); });
+var SvgLeftContainer = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding-left: 16px;\n  top: 0px;\n  left: 0px;\n  background-color: ", ";\n"], ["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding-left: 16px;\n  top: 0px;\n  left: 0px;\n  background-color: ", ";\n"])), Colors.SurfaceTertiary);
+var LeftContainer = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-left: 16px;\n  top: 0px;\n  left: 0px;\n  background-color: ", ";\n"], ["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin-left: 16px;\n  top: 0px;\n  left: 0px;\n  background-color: ", ";\n"])), Colors.White);
+var RightContainer = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  position: absolute;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: ", ";\n  width: ", ";\n  top: -1px;\n  right: -1px;\n\n  &:hover {\n    cursor: ", ";\n  }\n"], ["\n  position: absolute;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: ", ";\n  width: ", ";\n  top: -1px;\n  right: -1px;\n\n  &:hover {\n    cursor: ", ";\n  }\n"])), function (props) {
+    if (props.size === InputSizes.Large)
+        return "50px";
+    if (props.size === InputSizes.Regular)
+        return "40px";
+    return null;
+}, function (props) {
+    if (props.size === InputSizes.Large)
+        return "50px";
+    if (props.size === InputSizes.Regular)
+        return "40px";
+    return null;
+}, function (props) { return (props.onClick ? "pointer" : null); });
+var Spacer = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  width: ", ";\n  background-color: ", ";\n"], ["\n  width: ", ";\n  background-color: ", ";\n"])), function (props) { return (props.incrementButton ? "0px" : "50px"); }, Colors.White);
+var InputStyled = styled.input(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  background-color: ", ";\n  color: ", ";\n  outline: none;\n  border: 0px;\n  /* border-radius: 10px; */\n  height: ", ";\n  width: 100%;\n  font-family: \"neue-haas-grotesk-display\", sans-serif;\n  font-weight: 500;\n  padding: 0px;\n  padding-left: ", ";\n  transition: all 0.2s;\n  padding: ", ";\n\n  ::placeholder {\n    color: ", ";\n  }\n\n  ", ";\n\n  ", ";\n"], ["\n  background-color: ", ";\n  color: ", ";\n  outline: none;\n  border: 0px;\n  /* border-radius: 10px; */\n  height: ", ";\n  width: 100%;\n  font-family: \"neue-haas-grotesk-display\", sans-serif;\n  font-weight: 500;\n  padding: 0px;\n  padding-left: ", ";\n  transition: all 0.2s;\n  padding: ", ";\n\n  ::placeholder {\n    color: ", ";\n  }\n\n  ", ";\n\n  ", ";\n"])), function (props) { return props.backgroundColor || Colors.White; }, function (props) {
+    return props.textColor || (props.disabled ? Colors.Grey4 : Colors.Grey1);
+}, function (props) {
+    if (props.inputSize === InputSizes.Large)
+        return "48px";
+    if (props.inputSize === InputSizes.Regular)
+        return "38px";
+    if (props.inputSize === InputSizes.CustomInputHeight)
+        return "56px";
+    return null;
+}, function (props) { return (props.hasIcon ? "8px" : "16px"); }, function (props) { return props.padding; }, function (props) { return props.placeholderColor || Colors.Grey4; }, media.mobile(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  font-size: 1.6rem;\n  "], ["\n  font-size: 1.6rem;\n  "]))), media.desktop(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  font-size: ", "\n"], ["\n  font-size: ", "\n"])), function (props) { return props.mediaDesktopFontSize || "1.4rem"; }));
+function Input(_a, inputRef) {
+    var autoFocus = _a.autoFocus, placeholder = _a.placeholder, value = _a.value, defaultValue = _a.defaultValue, icon = _a.icon, iconColor = _a.iconColor, _b = _a.size, size = _b === void 0 ? InputSizes.Regular : _b, _c = _a.type, type = _c === void 0 ? "text" : _c, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave, onChange = _a.onChange, onFocus = _a.onFocus, onBlur = _a.onBlur, onSubmit = _a.onSubmit, onClear = _a.onClear, _d = _a.canSubmit, canSubmit = _d === void 0 ? true : _d, loading = _a.loading, margin = _a.margin, padding = _a.padding, width = _a.width, onEnter = _a.onEnter, label = _a.label, subLabel = _a.subLabel, tip = _a.tip, maxLength = _a.maxLength, iconConditionalColor = _a.iconConditionalColor, validationError = _a.validationError, _e = _a.disabled, disabled = _e === void 0 ? false : _e, _f = _a.incrementButton, incrementButton = _f === void 0 ? false : _f, handleIncrement = _a.handleIncrement, handleDecrement = _a.handleDecrement, codeApply = _a.codeApply, discountCode = _a.discountCode, bgColor = _a.bgColor, labelColor = _a.labelColor, fontSize = _a.fontSize, fontFamily = _a.fontFamily, fontWeight = _a.fontWeight, marginBottam = _a.marginBottam, placeholderTextColor = _a.placeholderTextColor, iconProps = _a.iconProps, letterSpacing = _a.letterSpacing, onFocusedColor = _a.onFocusedColor, svgIconName = _a.svgIconName, svgWidth = _a.svgWidth, svgHeight = _a.svgHeight, disableDarkThemeBg = _a.disableDarkThemeBg, validationDarkThemeBorderColor = _a.validationDarkThemeBorderColor, mediaDesktopFontSize = _a.mediaDesktopFontSize, maxLengthDisabled = _a.maxLengthDisabled, disableValidationErrorBox = _a.disableValidationErrorBox;
+    var _g = useState(false), hovered = _g[0], setHovered = _g[1];
+    var _h = useState(false), focused = _h[0], setFocused = _h[1];
+    var submit = function (event) {
+        event.preventDefault();
+        if (onSubmit && !loading) {
+            onSubmit();
+        }
+        else if (onEnter && !loading) {
+            onEnter();
+        }
+    };
+    var iconSize = (function () {
+        if (size === InputSizes.Large)
+            return 16;
+        if (size === InputSizes.Regular)
+            return 14;
+        return 14;
+    })();
+    var submitIconSize = (function () {
+        if (size === InputSizes.Large)
+            return 18;
+        if (size === InputSizes.Regular)
+            return 16;
+        return 16;
+    })();
+    return (React.createElement(Container, { width: width, margin: margin },
+        React.createElement(Flex, { justify: "space-between" },
+            label && (React.createElement(Label, { text: label, subText: subLabel, labelColor: labelColor, fontSize: fontSize, fontWeight: fontWeight, fontFamily: fontFamily, marginBottam: marginBottam, letterSpacing: letterSpacing, tip: tip })),
+            maxLength && (React.createElement(MaxLength, { value: value, maxLength: maxLength, maxLengthDisabled: maxLengthDisabled }))),
+        React.createElement(Form, { hovered: hovered, focused: focused, onSubmit: function (event) { return submit(event); }, width: width, disabled: disabled, noValidate // disables default html5 validation
+            : true, validationError: validationError, onFocusedColor: onFocusedColor, disableDarkThemeBg: disableDarkThemeBg, validationDarkThemeBorderColor: validationDarkThemeBorderColor },
+            icon && (React.createElement(LeftContainer, { size: size },
+                React.createElement(IconContainer, null,
+                    React.createElement(Icon, { icon: icon, size: iconSize, color: (function () {
+                            if (iconColor)
+                                return iconColor;
+                            return value
+                                ? iconConditionalColor || Colors.Grey1
+                                : focused
+                                    ? Colors.Grey3
+                                    : Colors.Grey4;
+                        })() })))),
+            svgIconName && (React.createElement(SvgLeftContainer, null,
+                React.createElement(SvgRenderer, { iconName: svgIconName, width: svgWidth, height: svgHeight, style: { margin: '2px 0px' } }))),
+            incrementButton && (React.createElement(IncrementButton, { onClick: handleDecrement }, "-")),
+            React.createElement(InputStyled, { ref: inputRef, disabled: disabled, autoFocus: autoFocus, placeholder: placeholder, value: value, defaultValue: defaultValue, type: type, onChange: function (e) {
+                    if (maxLength && e.currentTarget.value.length > maxLength) ;
+                    else {
+                        onChange(e);
+                    }
+                }, onFocus: function (event) {
+                    setFocused(true);
+                    if (onFocus)
+                        onFocus(event);
+                }, onBlur: function (event) {
+                    setFocused(false);
+                    if (onFocus)
+                        onBlur(event);
+                }, onMouseEnter: function (event) {
+                    setHovered(true);
+                    if (onMouseEnter)
+                        onMouseEnter(event);
+                }, onMouseLeave: function (event) {
+                    setHovered(false);
+                    if (onMouseLeave)
+                        onMouseLeave(event);
+                }, padding: padding, inputSize: size, hasIcon: Boolean(icon), backgroundColor: bgColor, textColor: labelColor, placeholderColor: placeholderTextColor, mediaDesktopFontSize: mediaDesktopFontSize }),
+            incrementButton && (React.createElement(IncrementButton, { onClick: handleIncrement }, "+")),
+            (function () {
+                if (onSubmit) {
+                    return (React.createElement(Fragment, null,
+                        React.createElement(Spacer, { incrementButton: true }),
+                        React.createElement(Button, { canSubmit: canSubmit, onClick: function (event) { return submit(event); }, size: size, codeApply: codeApply }, (function () {
+                            if (loading) {
+                                return (React.createElement(Loader, { size: LoaderSizes.VerySmall, color: Colors.Orange }));
+                            }
+                            var iconstyles = iconProps ? iconProps : {};
+                            return (React.createElement(React.Fragment, null,
+                                !codeApply && (React.createElement(Icon, __assign({ icon: Icons.RightArrowRegular, color: canSubmit ? Colors.Orange : Colors.Grey5, hoverColor: "gray", size: submitIconSize }, iconstyles))),
+                                codeApply && (React.createElement(TextContainer, { canSubmit: canSubmit }, discountCode ? (React.createElement(Icon, { icon: Icons.Cancel, color: Colors.HeadingSecondary, size: "18", marginRight: "8px", padding: "0px 10px", backgroundColor: Colors.SurfaceTertiary, borderRadius: "8px", width: "29px", height: "40px", top: "4px", display: "flex", alignItems: "center", justifyContent: "center" })) : (React.createElement(Icon, { icon: Icons.RightArrowRegular, color: Colors.HeadingSecondary, size: "18", marginRight: "8px", padding: "0px 10px", backgroundColor: validationError ? Colors.ErrorRed : Colors.InteractiveBGPrimary, borderRadius: "8px", width: "29px", height: "40px", top: "4px", display: "flex", alignItems: "center", justifyContent: "center" }))))));
+                        })())));
+                }
+                if (loading) {
+                    return (React.createElement(Fragment, null,
+                        React.createElement(Spacer, { incrementButton: true }),
+                        React.createElement(RightContainer, { size: size },
+                            React.createElement(Loader, { size: LoaderSizes.SuperSmall, color: Colors.Orange }))));
+                }
+                if (Boolean(value) && onClear) {
+                    return (React.createElement(Fragment, null,
+                        React.createElement(Spacer, { incrementButton: true }),
+                        React.createElement(RightContainer, { onClick: function () { return onClear(); }, size: size },
+                            React.createElement(Icon, __assign({ icon: (iconProps === null || iconProps === void 0 ? void 0 : iconProps.icon) ? iconProps.icon : Icons.CancelCircle, color: Colors.Grey4, hoverColor: Colors.Grey3, size: iconSize }, iconProps)))));
+                }
+                return React.createElement(Spacer, { incrementButton: true });
+            })()),
+        validationError && React.createElement(ValidationError, { validationError: validationError, disableValidationErrorBox: disableValidationErrorBox })));
+}
+var Input$1 = React.forwardRef(Input);
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13;
+
+export { InputSizes, InputStyled, Input$1 as default };
+//# sourceMappingURL=Input.js.map

package/build/src/components/Input.js.map

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

package/build/src/components/Label.js

@@ -0,0 +1,23 @@
+import { __makeTemplateObject } from '../../node_modules/tslib/tslib.es6.js';
+import React from 'react';
+import styled from 'styled-components';
+import { Colors } from '../Colors.js';
+import Tip from './Tip.js';
+
+var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  margin: ", ";\n  height: ", ";\n"], ["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  margin: ", ";\n  height: ", ";\n"])), function (props) { return props.margin; }, function (props) { return props.height || "15px"; });
+var Text = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  font-size: ", ";\n  font-weight: ", ";\n  color: ", ";\n  //margin-right: 7px;\n  font-family: ", ";\n  margin-bottom: ", ";\n  letter-spacing: ", ";\n"], ["\n  font-size: ", ";\n  font-weight: ", ";\n  color: ", ";\n  //margin-right: 7px;\n  font-family: ", ";\n  margin-bottom: ", ";\n  letter-spacing: ", ";\n"])), function (props) { return props.fontSize || "1.2rem"; }, function (props) { return props.fontWeight || "600"; }, function (props) { return props.color || Colors.Grey1; }, function (props) { return props.fontFamily; }, function (props) { return props.marginBottam; }, function (props) { return props.letterSpacing; });
+var SubText = styled.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), Colors.Grey3);
+var Label = function (_a) {
+    var text = _a.text, subText = _a.subText, tip = _a.tip, labelColor = _a.labelColor, fontSize = _a.fontSize, fontWeight = _a.fontWeight, fontFamily = _a.fontFamily, marginBottam = _a.marginBottam, _b = _a.margin, margin = _b === void 0 ? "0 0 8px" : _b, letterSpacing = _a.letterSpacing, height = _a.height;
+    return (React.createElement(Container, { margin: margin, height: height },
+        React.createElement(Text, { color: labelColor, fontSize: fontSize, fontWeight: fontWeight, fontFamily: fontFamily, marginBottam: marginBottam, letterSpacing: letterSpacing },
+            text,
+            subText && React.createElement(SubText, null,
+                "\u00A0",
+                subText)),
+        tip && React.createElement(Tip, { tip: tip })));
+};
+var templateObject_1, templateObject_2, templateObject_3;
+
+export { Label as default };
+//# sourceMappingURL=Label.js.map

package/build/src/components/Label.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Label.js","sources":["../../../src/components/Label.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;;AAiBA,IAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAgB,gBAAA,KAAA,gBAAA,GAAA,oBAAA,CAAA,CAAA,gFAAA,EAAA,eAAA,EAAA,KAAA,CAAA,EAAA,CAAA,gFAIhC,EAAuB,eACvB,EAAiC,KAC5C,CAAA,CAAA,CAAA,EAFW,UAAC,KAAK,IAAK,OAAA,KAAK,CAAC,MAAM,CAAZ,EAAY,EACvB,UAAC,KAAK,EAAK,EAAA,OAAA,KAAK,CAAC,MAAM,IAAI,MAAM,CAAtB,EAAsB,CAC5C,CAAC;AAEF,IAAM,IAAI,GAAG,MAAM,CAAC,GAAG,CAAA,gBAAA,KAAA,gBAAA,GAAA,oBAAA,CAAA,CAAA,iBAAA,EAAA,oBAAA,EAAA,cAAA,EAAA,4CAAA,EAAA,sBAAA,EAAA,uBAAA,EAAA,KAAA,CAAA,EAAA,CAAW,iBACnB,EAAqC,oBACnC,EAAoC,cAC1C,EAAsC,4CAEhC,EAA2B,sBACzB,EAA6B,uBAC5B,EAA8B,KACjD,CAPc,CAAA,CAAA,EAAA,UAAC,KAAK,EAAA,EAAK,OAAA,KAAK,CAAC,QAAQ,IAAI,QAAQ,GAAA,EACnC,UAAC,KAAK,EAAA,EAAK,OAAA,KAAK,CAAC,UAAU,IAAI,KAAK,GAAA,EAC1C,UAAC,KAAK,IAAK,OAAA,KAAK,CAAC,KAAK,IAAI,MAAM,CAAC,KAAK,GAAA,EAEhC,UAAC,KAAK,EAAA,EAAK,OAAA,KAAK,CAAC,UAAU,CAAhB,EAAgB,EACzB,UAAC,KAAK,EAAK,EAAA,OAAA,KAAK,CAAC,YAAY,GAAA,EAC5B,UAAC,KAAK,EAAA,EAAK,OAAA,KAAK,CAAC,aAAa,CAAnB,EAAmB,CACjD,CAAC;AAEF,IAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAA,gBAAA,KAAA,gBAAA,GAAA,oBAAA,CAAA,CAAA,aAAA,EAAA,KAAA,CAAA,EAAA,CAAA,aAChB,EAAY,KACtB,CADU,CAAA,CAAA,EAAA,MAAM,CAAC,KAAK,CACtB,CAAC;AAgBI,IAAA,KAAK,GAAyB,UAAC,EAYpC,EAAA;AAXC,IAAA,IAAA,IAAI,GAAA,EAAA,CAAA,IAAA,EACJ,OAAO,GAAA,EAAA,CAAA,OAAA,EACP,GAAG,GAAA,EAAA,CAAA,GAAA,EACH,UAAU,gBAAA,EACV,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,UAAU,GAAA,EAAA,CAAA,UAAA,EACV,YAAY,GAAA,EAAA,CAAA,YAAA,EACZ,cAAkB,EAAlB,MAAM,GAAG,EAAA,KAAA,KAAA,CAAA,GAAA,SAAS,KAAA,EAClB,aAAa,GAAA,EAAA,CAAA,aAAA,EACb,MAAM,GAAA,EAAA,CAAA,MAAA,CAAA;IAEN,QACE,KAAC,CAAA,aAAA,CAAA,SAAS,EAAC,EAAA,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAA;QACvC,KAAC,CAAA,aAAA,CAAA,IAAI,EACH,EAAA,KAAK,EAAE,UAAU,EACjB,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,UAAU,EACtB,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,aAAa,EAAA;YAE3B,IAAI;YACJ,OAAO,IAAI,oBAAC,OAAO,EAAA,IAAA;;AAAQ,gBAAA,OAAO,CAAW,CACzC;QACN,GAAG,IAAI,KAAC,CAAA,aAAA,CAAA,GAAG,EAAC,EAAA,GAAG,EAAE,GAAG,EAAA,CAAI,CACf,EACZ;AACJ,EAAE;;;;;"}

package/build/src/components/Loader.js

@@ -0,0 +1,37 @@
+import { __makeTemplateObject } from '../../node_modules/tslib/tslib.es6.js';
+import React from 'react';
+import styled from 'styled-components';
+import { Colors } from '../Colors.js';
+
+var _a;
+var LoaderSizes;
+(function (LoaderSizes) {
+    LoaderSizes["FuckingTiny"] = "FuckingTiny";
+    LoaderSizes["SuperSmall"] = "SuperSmall";
+    LoaderSizes["VerySmall"] = "VerySmall";
+    LoaderSizes["Small"] = "Small";
+    LoaderSizes["Medium"] = "Medium";
+    LoaderSizes["Large"] = "Large";
+})(LoaderSizes || (LoaderSizes = {}));
+var LoaderSizesMap = (_a = {},
+    _a[LoaderSizes.FuckingTiny] = 14,
+    _a[LoaderSizes.SuperSmall] = 20,
+    _a[LoaderSizes.VerySmall] = 24,
+    _a[LoaderSizes.Small] = 30,
+    _a[LoaderSizes.Medium] = 40,
+    _a[LoaderSizes.Large] = 60,
+    _a);
+var scale = function (size, scale) { return "".concat(size * scale, "px"); };
+var StyledLoader = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  top: 1.5px;\n\n  .lds-ring {\n    display: inline-block;\n    position: relative;\n    width: ", ";\n    height: ", ";\n  }\n  .lds-ring div {\n    box-sizing: border-box;\n    display: block;\n    position: absolute;\n    width: ", ";\n    height: ", ";\n    margin: ", ";\n    border: ", " solid ", ";\n    border-radius: 50%;\n    animation: lds-ring 0.8s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n    border-color: ", " transparent transparent transparent;\n  }\n  .lds-ring div:nth-child(1) {\n    animation-delay: -0.3s;\n  }\n  .lds-ring div:nth-child(2) {\n    animation-delay: -0.2s;\n  }\n  .lds-ring div:nth-child(3) {\n    animation-delay: -0.1s;\n  }\n  @keyframes lds-ring {\n    0% {\n      transform: rotate(0deg);\n    }\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n"], ["\n  position: relative;\n  top: 1.5px;\n\n  .lds-ring {\n    display: inline-block;\n    position: relative;\n    width: ", ";\n    height: ", ";\n  }\n  .lds-ring div {\n    box-sizing: border-box;\n    display: block;\n    position: absolute;\n    width: ", ";\n    height: ", ";\n    margin: ", ";\n    border: ", " solid ", ";\n    border-radius: 50%;\n    animation: lds-ring 0.8s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n    border-color: ", " transparent transparent transparent;\n  }\n  .lds-ring div:nth-child(1) {\n    animation-delay: -0.3s;\n  }\n  .lds-ring div:nth-child(2) {\n    animation-delay: -0.2s;\n  }\n  .lds-ring div:nth-child(3) {\n    animation-delay: -0.1s;\n  }\n  @keyframes lds-ring {\n    0% {\n      transform: rotate(0deg);\n    }\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n"])), function (props) { return scale(props.size, 1); }, function (props) { return scale(props.size, 1); }, function (props) { return scale(props.size, .8); }, function (props) { return scale(props.size, .8); }, function (props) { return scale(props.size, .1); }, function (props) { return scale(props.size, 0.066); }, function (props) { return props.color; }, function (props) { return props.color; });
+function Loader(_a) {
+    var _b = _a.size, size = _b === void 0 ? LoaderSizes.Medium : _b, _c = _a.color, color = _c === void 0 ? Colors.White : _c;
+    return (React.createElement(StyledLoader, { size: LoaderSizesMap[size], color: color },
+        React.createElement("div", { className: "lds-ring" },
+            React.createElement("div", null),
+            React.createElement("div", null),
+            React.createElement("div", null))));
+}
+var templateObject_1;
+
+export { LoaderSizes, Loader as default };
+//# sourceMappingURL=Loader.js.map

package/build/src/components/Loader.js.map

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

package/build/src/components/MaxLength.js

@@ -0,0 +1,20 @@
+import { __makeTemplateObject } from '../../node_modules/tslib/tslib.es6.js';
+import React from 'react';
+import styled from 'styled-components';
+import { Colors } from '../Colors.js';
+
+var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  font-size: 1.2rem;\n  font-weight: 500;\n  color: ", ";\n  margin-bottom: 10px;\n"], ["\n  display: flex;\n  align-items: center;\n  font-size: 1.2rem;\n  font-weight: 500;\n  color: ", ";\n  margin-bottom: 10px;\n"])), function (props) { return (props.isMax ? Colors.Red : Colors.Grey3); });
+var MaxLength = function (_a) {
+    var value = _a.value, maxLength = _a.maxLength, maxLengthDisabled = _a.maxLengthDisabled;
+    if (maxLengthDisabled) {
+        return null;
+    }
+    return (React.createElement(Container, { isMax: (value === null || value === void 0 ? void 0 : value.length) === maxLength }, value === null || value === void 0 ? void 0 :
+        value.length,
+        "/",
+        maxLength));
+};
+var templateObject_1;
+
+export { MaxLength as default };
+//# sourceMappingURL=MaxLength.js.map

package/build/src/components/MaxLength.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MaxLength.js","sources":["../../../src/components/MaxLength.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;;AAQA,IAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAgB,gBAAA,KAAA,gBAAA,GAAA,oBAAA,CAAA,CAAA,kGAAA,EAAA,6BAAA,CAAA,EAAA,CAAA,kGAKjC,EAAoD,6BAE9D,KAFU,UAAC,KAAK,EAAK,EAAA,QAAC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC,GAAG,GAAG,MAAM,CAAC,KAAK,EAAxC,EAAyC,CAE9D,CAAC;AAQI,IAAA,SAAS,GAA6B,UAAC,EAAuC,EAAA;AAArC,IAAA,IAAA,KAAK,WAAA,EAAE,SAAS,GAAA,EAAA,CAAA,SAAA,EAAE,iBAAiB,GAAA,EAAA,CAAA,iBAAA,CAAA;AAChF,IAAA,IAAI,iBAAiB,EAAE;AACrB,QAAA,OAAO,IAAI,CAAC;AACb,KAAA;AACD,IAAA,QACE,KAAC,CAAA,aAAA,CAAA,SAAS,IAAC,KAAK,EAAE,CAAA,KAAK,KAAA,IAAA,IAAL,KAAK,KAAL,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,KAAK,CAAE,MAAM,MAAK,SAAS,EAC1C,EAAA,KAAK,aAAL,KAAK,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA;AAAL,QAAA,KAAK,CAAE,MAAM;;QAAG,SAAS,CAChB,EACZ;AACJ,EAAE;;;;;"}

package/build/src/components/Motion.js

@@ -0,0 +1,40 @@
+import { __rest, __assign } from '../../node_modules/tslib/tslib.es6.js';
+import React from 'react';
+import { motion } from 'framer-motion';
+
+var ErrorPop = function (_a) {
+    _a.duration; var children = _a.children, props = __rest(_a, ["duration", "children"]);
+    return (React.createElement(motion.div, __assign({}, props, { initial: { right: -100 }, animate: { right: 15 }, transition: {
+            // duration: duration as any,
+            type: "spring",
+            stiffness: 400,
+            damping: 20,
+        } }), children));
+};
+var Pop = function (_a) {
+    _a.duration; var children = _a.children, props = __rest(_a, ["duration", "children"]);
+    return (React.createElement(motion.div, __assign({}, props, { initial: { scale: 0.8 }, animate: { scale: 1 }, transition: {
+            // duration,
+            type: "spring",
+            stiffness: 260,
+            damping: 20,
+        } }), children));
+};
+var CardPop = function (_a) {
+    var _b = _a.duration, duration = _b === void 0 ? 0.2 : _b, children = _a.children, props = __rest(_a, ["duration", "children"]);
+    return (React.createElement(motion.div, __assign({}, props, { initial: { scale: 0.9, opacity: 0 }, animate: { scale: 1, opacity: 1 }, transition: {
+            duration: duration,
+            // type: 'spring',
+            stiffness: 260,
+            damping: 20,
+        } }), children));
+};
+var FadeIn = function (_a) {
+    var _b = _a.duration, duration = _b === void 0 ? 0.2 : _b, children = _a.children, props = __rest(_a, ["duration", "children"]);
+    return (React.createElement(motion.div, __assign({}, props, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: {
+            duration: duration,
+        } }), children));
+};
+
+export { CardPop, ErrorPop, FadeIn, Pop };
+//# sourceMappingURL=Motion.js.map

package/build/src/components/Motion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Motion.js","sources":["../../../src/components/Motion.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;AAWO,IAAM,QAAQ,GAA4B,UAAC,EAIjD,EAAA;AAHC,IAAc,EAAA,CAAA,QAAA,CAAA,KACd,QAAQ,GAAA,EAAA,CAAA,QAAA,CAAA,CACL,KAAK,GAAA,MAAA,CAAA,EAAA,EAHwC,wBAIjD,EADS;IAER,QACE,KAAC,CAAA,aAAA,CAAA,MAAM,CAAC,GAAG,EACL,QAAA,CAAA,EAAA,EAAA,KAAK,EACT,EAAA,OAAO,EAAE,EAAE,KAAK,EAAE,CAAC,GAAG,EAAE,EACxB,OAAO,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,EACtB,UAAU,EAAE;;AAEV,YAAA,IAAI,EAAE,QAAQ;AACd,YAAA,SAAS,EAAE,GAAG;AACd,YAAA,OAAO,EAAE,EAAE;SACZ,EAEA,CAAA,EAAA,QAAQ,CACE,EACb;AACJ,EAAE;AAUK,IAAM,GAAG,GAAuB,UAAC,EAIvC,EAAA;AAHC,IAAc,EAAA,CAAA,QAAA,CAAA,KACd,QAAQ,GAAA,EAAA,CAAA,QAAA,CAAA,CACL,KAAK,GAAA,MAAA,CAAA,EAAA,EAH8B,wBAIvC,EADS;IAER,QACE,KAAC,CAAA,aAAA,CAAA,MAAM,CAAC,GAAG,eACL,KAAK,EAAA,EACT,OAAO,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,EACvB,OAAO,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,EACrB,UAAU,EAAE;;AAEV,YAAA,IAAI,EAAE,QAAQ;AACd,YAAA,SAAS,EAAE,GAAG;AACd,YAAA,OAAO,EAAE,EAAE;SACZ,EAEA,CAAA,EAAA,QAAQ,CACE,EACb;AACJ,EAAE;AAUK,IAAM,OAAO,GAA2B,UAAC,EAI/C,EAAA;AAHC,IAAA,IAAA,EAAc,GAAA,EAAA,CAAA,QAAA,EAAd,QAAQ,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,GAAG,GAAA,EAAA,EACd,QAAQ,GAAA,EAAA,CAAA,QAAA,EACL,KAAK,GAAA,MAAA,CAAA,EAAA,EAHsC,wBAI/C,CADS,CAAA;AAER,IAAA,QACE,KAAA,CAAA,aAAA,CAAC,MAAM,CAAC,GAAG,EACL,QAAA,CAAA,EAAA,EAAA,KAAK,EACT,EAAA,OAAO,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,OAAO,EAAE,CAAC,EAAE,EACnC,OAAO,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,EACjC,UAAU,EAAE;AACV,YAAA,QAAQ,EAAA,QAAA;;AAER,YAAA,SAAS,EAAE,GAAG;AACd,YAAA,OAAO,EAAE,EAAE;SACZ,EAEA,CAAA,EAAA,QAAQ,CACE,EACb;AACJ,EAAE;AAUK,IAAM,MAAM,GAA0B,UAAC,EAI7C,EAAA;AAHC,IAAA,IAAA,EAAc,GAAA,EAAA,CAAA,QAAA,EAAd,QAAQ,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,GAAG,GAAA,EAAA,EACd,QAAQ,GAAA,EAAA,CAAA,QAAA,EACL,KAAK,GAAA,MAAA,CAAA,EAAA,EAHoC,wBAI7C,CADS,CAAA;IAER,QACE,KAAC,CAAA,aAAA,CAAA,MAAM,CAAC,GAAG,eACL,KAAK,EAAA,EACT,OAAO,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,EACvB,OAAO,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,EACvB,UAAU,EAAE;AACV,YAAA,QAAQ,EAAA,QAAA;SACT,EAEA,CAAA,EAAA,QAAQ,CACE,EACb;AACJ;;;;"}

package/build/src/components/PhoneNumberInput.js

@@ -0,0 +1,50 @@
+import { __makeTemplateObject } from '../../node_modules/tslib/tslib.es6.js';
+import React from 'react';
+import styled from 'styled-components';
+import PhoneInput from 'react-phone-input-2';
+import 'react-phone-input-2/lib/semantic-ui.css';
+import { Colors } from '../Colors.js';
+import ValidationError from './ValidationError.js';
+import { useMobileMedia } from '../utils/MediaQuery.js';
+import Label from './Label.js';
+
+var PhoneNumberInputSizes;
+(function (PhoneNumberInputSizes) {
+    PhoneNumberInputSizes["Large"] = "Large";
+    PhoneNumberInputSizes["Regular"] = "Regular";
+})(PhoneNumberInputSizes || (PhoneNumberInputSizes = {}));
+var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin: ", ";\n"], ["\n  margin: ", ";\n"])), function (props) { return props.margin; });
+// overwrite the preset style imports
+var InnerContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  .react-tel-input {\n    font-family: \"neue-haas-grotesk-display\", sans-serif;\n    font-size: ", ";\n    position: relative;\n    width: 100%;\n    :disabled {\n      cursor: not-allowed;\n      background-color: ", ";\n    }\n\n    .form-control {\n      font-family: \"neue-haas-grotesk-display\", sans-serif;\n      border-color:", ";\n      text-indent: 15px;\n      transition: all 0.2s;\n      color: ", ";\n      font-weight: 500;\n      position: relative;\n      font-size: ", ";\n      margin-top: 0 !important;\n      margin-bottom: 0 !important;\n      margin-left: 50px;\n      padding-left: 0;\n      background: ", ";\n      border: 1px solid ", ";\n      border-radius: 0px 10px 10px 0px;\n      height: ", ";\n      width: calc(100% - 50px);\n      z-index: 1;\n      outline: none;\n      &:hover {\n        border: 1px solid ", ";\n      }\n      &.invalid-number {\n        border: 1px solid ", ";\n        background-color: ", ";\n        border-left-color: ", ";\n        &:focus {\n          border: 1px solid ", ";\n          border-left-color: ", ";\n          background-color: ", ";\n        }\n      }\n      &.open {\n        border-color: ", ";\n        border-radius: 0px 10px 0 0;\n        /* border-bottom: none; */\n        box-shadow: none;\n      }\n      ::placeholder {\n        color: ", ";\n      }\n      &:focus {\n        border: 1px solid ", ";\n      }\n    }\n\n    .flag-dropdown {\n      outline: none;\n      position: absolute;\n      width: 100%;\n      top: 0;\n      bottom: 0;\n      padding: 0;\n      background-color: ", ";\n      border: 1px solid ", ";\n      border-radius: 10px;\n      border-color:", ";\n\n      &.open {\n        background: ", ";\n        border-radius: 10px 10px 0 0;\n        .selected-flag {\n          background: ", ";\n          border-radius: 10px 0 0 0;\n        }\n      }\n      &:hover, &:focus {\n        cursor: pointer;\n        .selected-flag {\n          background-color:", ";;\n        }\n      }\n    }\n\n    input[disabled] {\n      &+.flag-dropdown {\n        &:hover {\n          cursor: default;\n          .selected-flag {\n            background-color: transparent;\n          }\n        }\n      }\n    }\n\n    .selected-flag {\n      transition: all 0.2s;\n      background: ", ";\n      position: relative;\n      width: 50px;\n      height: 100%;\n      padding: 0 0 0 10px;\n      border-radius: 10px 0 0 10px;\n      .flag {\n        position: absolute;\n        top: 50%;\n        margin-top: -5px;\n      }\n      .arrow {\n        position: relative;\n        top: 50%;\n        margin-top: -2px;\n        left: 25px;\n        width: 0;\n        height: 0;\n        border-left: 3px solid transparent;\n        border-right: 3px solid transparent;\n        border-top: 4px solid #555;\n        &.up {\n          border-top: none;\n          border-bottom: 4px solid #555;\n        }\n      }\n      &.open {\n        z-index: 2;\n      }\n    }\n\n    .country-list {\n      z-index: 2;\n      border-radius: 0 0 10px 10px;\n      border: 1px solid ", ";\n      border-top: none;\n      list-style: none;\n      position: absolute;\n      padding: 0;\n      margin: 0px 0 10px -1px;\n      box-shadow: unset;\n      background-color: ", ";\n      width: calc(100% + 2px);\n      max-height: ", ";\n      overflow-y: scroll;\n      .flag {\n        display: inline-block;\n      }\n      .divider {\n        padding-bottom: 5px;\n        margin-bottom: 5px;\n        border-bottom: 1px solid #ccc;\n      }\n      .country {\n        padding: 7px 9px;\n        .dial-code {\n          color: #6b6b6b;\n        }\n        &:hover {\n          background-color: ", ";\n        }\n        &.highlight {\n          background-color: ", ";\n        }\n      }\n      .flag {\n        margin-right: 7px;\n        margin-top: 2px;\n      }\n      .country-name {\n        margin-right: 6px;\n        color:", ";\n      }\n      .search {\n        position: sticky;\n        top: 0;\n        background-color: ", ";\n        padding: 5px 0 6px 10px;\n      }\n      .search-emoji {\n        display: none;\n        font-size: ", ";\n      }\n      .search-box {\n        border: 1px solid #cacaca;\n        border-radius: 3px;\n        font-size: ", ";\n        line-height: 15px;\n        padding: 3px 8px 5px;\n        outline: none;\n      }\n      .no-entries-message {\n        padding: 7px 10px 11px;\n        opacity: .7;\n      }\n      &::-webkit-scrollbar { width: 12px; }\n      &::-webkit-scrollbar-track { background-color: #e6e6e6; }\n      &::-webkit-scrollbar-thumb { background-color: #c5c5c4; border-radius: 5px; }\n    }\n\n    .invalid-number-message {\n      position: absolute;\n      z-index: 1;\n      font-size: ", ";\n      left: 46px;\n      top: -8px;\n      background: #fff;\n      padding: 0 2px;\n      color: #de0000;\n    }\n  }\n"], ["\n  .react-tel-input {\n    font-family: \"neue-haas-grotesk-display\", sans-serif;\n    font-size: ", ";\n    position: relative;\n    width: 100%;\n    :disabled {\n      cursor: not-allowed;\n      background-color: ", ";\n    }\n\n    .form-control {\n      font-family: \"neue-haas-grotesk-display\", sans-serif;\n      border-color:", ";\n      text-indent: 15px;\n      transition: all 0.2s;\n      color: ", ";\n      font-weight: 500;\n      position: relative;\n      font-size: ", ";\n      margin-top: 0 !important;\n      margin-bottom: 0 !important;\n      margin-left: 50px;\n      padding-left: 0;\n      background: ", ";\n      border: 1px solid ", ";\n      border-radius: 0px 10px 10px 0px;\n      height: ", ";\n      width: calc(100% - 50px);\n      z-index: 1;\n      outline: none;\n      &:hover {\n        border: 1px solid ", ";\n      }\n      &.invalid-number {\n        border: 1px solid ", ";\n        background-color: ", ";\n        border-left-color: ", ";\n        &:focus {\n          border: 1px solid ", ";\n          border-left-color: ", ";\n          background-color: ", ";\n        }\n      }\n      &.open {\n        border-color: ", ";\n        border-radius: 0px 10px 0 0;\n        /* border-bottom: none; */\n        box-shadow: none;\n      }\n      ::placeholder {\n        color: ", ";\n      }\n      &:focus {\n        border: 1px solid ", ";\n      }\n    }\n\n    .flag-dropdown {\n      outline: none;\n      position: absolute;\n      width: 100%;\n      top: 0;\n      bottom: 0;\n      padding: 0;\n      background-color: ", ";\n      border: 1px solid ", ";\n      border-radius: 10px;\n      border-color:", ";\n\n      &.open {\n        background: ", ";\n        border-radius: 10px 10px 0 0;\n        .selected-flag {\n          background: ", ";\n          border-radius: 10px 0 0 0;\n        }\n      }\n      &:hover, &:focus {\n        cursor: pointer;\n        .selected-flag {\n          background-color:", ";;\n        }\n      }\n    }\n\n    input[disabled] {\n      &+.flag-dropdown {\n        &:hover {\n          cursor: default;\n          .selected-flag {\n            background-color: transparent;\n          }\n        }\n      }\n    }\n\n    .selected-flag {\n      transition: all 0.2s;\n      background: ", ";\n      position: relative;\n      width: 50px;\n      height: 100%;\n      padding: 0 0 0 10px;\n      border-radius: 10px 0 0 10px;\n      .flag {\n        position: absolute;\n        top: 50%;\n        margin-top: -5px;\n      }\n      .arrow {\n        position: relative;\n        top: 50%;\n        margin-top: -2px;\n        left: 25px;\n        width: 0;\n        height: 0;\n        border-left: 3px solid transparent;\n        border-right: 3px solid transparent;\n        border-top: 4px solid #555;\n        &.up {\n          border-top: none;\n          border-bottom: 4px solid #555;\n        }\n      }\n      &.open {\n        z-index: 2;\n      }\n    }\n\n    .country-list {\n      z-index: 2;\n      border-radius: 0 0 10px 10px;\n      border: 1px solid ", ";\n      border-top: none;\n      list-style: none;\n      position: absolute;\n      padding: 0;\n      margin: 0px 0 10px -1px;\n      box-shadow: unset;\n      background-color: ", ";\n      width: calc(100% + 2px);\n      max-height: ", ";\n      overflow-y: scroll;\n      .flag {\n        display: inline-block;\n      }\n      .divider {\n        padding-bottom: 5px;\n        margin-bottom: 5px;\n        border-bottom: 1px solid #ccc;\n      }\n      .country {\n        padding: 7px 9px;\n        .dial-code {\n          color: #6b6b6b;\n        }\n        &:hover {\n          background-color: ", ";\n        }\n        &.highlight {\n          background-color: ", ";\n        }\n      }\n      .flag {\n        margin-right: 7px;\n        margin-top: 2px;\n      }\n      .country-name {\n        margin-right: 6px;\n        color:", ";\n      }\n      .search {\n        position: sticky;\n        top: 0;\n        background-color: ", ";\n        padding: 5px 0 6px 10px;\n      }\n      .search-emoji {\n        display: none;\n        font-size: ", ";\n      }\n      .search-box {\n        border: 1px solid #cacaca;\n        border-radius: 3px;\n        font-size: ", ";\n        line-height: 15px;\n        padding: 3px 8px 5px;\n        outline: none;\n      }\n      .no-entries-message {\n        padding: 7px 10px 11px;\n        opacity: .7;\n      }\n      &::-webkit-scrollbar { width: 12px; }\n      &::-webkit-scrollbar-track { background-color: #e6e6e6; }\n      &::-webkit-scrollbar-thumb { background-color: #c5c5c4; border-radius: 5px; }\n    }\n\n    .invalid-number-message {\n      position: absolute;\n      z-index: 1;\n      font-size: ", ";\n      left: 46px;\n      top: -8px;\n      background: #fff;\n      padding: 0 2px;\n      color: #de0000;\n    }\n  }\n"])), function (props) { return (props.isMobile ? "1.6rem" : "1.4rem"); }, function (props) {
+    return props.disabled ? "".concat(Colors.Grey6, " !important") : null;
+}, function (props) { return props.validationError && props.validationDarkThemeBorderColor ? "".concat(Colors.ErrorRed, " !important") : ""; }, function (props) { return props.typeTextColor || Colors.Grey1; }, function (props) { return (props.isMobile ? "1.6rem" : "1.4rem"); }, function (props) { return props.bgColor || Colors.White; }, Colors.Grey5, function (props) {
+    return props.phoneNumberInputSize === PhoneNumberInputSizes.Regular
+        ? "38px"
+        : "48px";
+}, Colors.Grey5, Colors.Grey5, Colors.White, Colors.Grey5, Colors.Grey4, Colors.Grey5, Colors.White, Colors.Grey5, Colors.Grey4, Colors.Grey4, Colors.Grey6, Colors.Grey5, function (props) { return props.validationError && props.validationDarkThemeBorderColor ? Colors.ErrorRed : ""; }, Colors.Grey6, Colors.Grey6, function (props) {
+    return props.selectedflaghover || Colors.White;
+}, function (props) { return props.selectedflagbg || Colors.White; }, Colors.Grey5, function (props) { return props.countryList || Colors.White; }, function (props) { return (props.isMobile ? "180px" : "200px"); }, function (props) { return props.searchColor || "#f1f1f1"; }, function (props) { return props.highlightColor || "#fff"; }, function (props) { return props.countryName || "#6b6b6b"; }, function (props) { return props.searchColor || Colors.Green; }, function (props) { return (props.isMobile ? "1.6rem" : "1.4rem"); }, function (props) { return (props.isMobile ? "1.6rem" : "1.4rem"); }, function (props) { return (props.isMobile ? "1.6rem" : "1.4rem"); });
+var PhoneNumberInput = function (_a) {
+    var value = _a.value, onChange = _a.onChange, onEnter = _a.onEnter, validationError = _a.validationError, phoneNumberInputSize = _a.phoneNumberInputSize, subLabel = _a.subLabel, tip = _a.tip, label = _a.label, margin = _a.margin, autoFocus = _a.autoFocus, _b = _a.disabled, disabled = _b === void 0 ? false : _b, bgColor = _a.bgColor, labeltextColor = _a.labeltextColor, typedTextColor = _a.typedTextColor, selectedflagbg = _a.selectedflagbg, countryList = _a.countryList, countryName = _a.countryName, highlightColor = _a.highlightColor, selectedflaghover = _a.selectedflaghover, searchColor = _a.searchColor, fontWeight = _a.fontWeight, fontFamily = _a.fontFamily, fontSize = _a.fontSize, letterSpacing = _a.letterSpacing, validationDarkThemeBorderColor = _a.validationDarkThemeBorderColor;
+    return (React.createElement(Container, { margin: margin },
+        label && (React.createElement(Label, { text: label, subText: subLabel, tip: tip, labelColor: labeltextColor, fontFamily: fontFamily, fontWeight: fontWeight, fontSize: fontSize, letterSpacing: letterSpacing })),
+        React.createElement(InnerContainer, { isMobile: useMobileMedia(), phoneNumberInputSize: phoneNumberInputSize, disabled: disabled, bgColor: bgColor, selectedflagbg: selectedflagbg, selectedflaghover: selectedflaghover, labelTextColor: labeltextColor, typeTextColor: typedTextColor, countryList: countryList, countryName: countryName, highlightColor: highlightColor, searchColor: searchColor, validationError: validationError, validationDarkThemeBorderColor: validationDarkThemeBorderColor },
+            React.createElement(PhoneInput, { country: "us", disabled: disabled, placeholder: "Enter your mobile phone number", preferredCountries: ["us", "ca"], value: value, onKeyDown: function (e) {
+                    // quick fix for current issue -> https://github.com/bl00mber/react-phone-input-2/issues/222
+                    if ((e.which === 8 || e.which === 46) && value.length <= 1) {
+                        e.preventDefault();
+                    }
+                    else if (e.which === 13 && onEnter) {
+                        onEnter();
+                    }
+                }, onChange: function (value) {
+                    onChange(value);
+                }, countryCodeEditable: false, inputProps: {
+                    autoFocus: autoFocus,
+                } }),
+            validationError && (React.createElement(ValidationError, { validationError: validationError })))));
+};
+var templateObject_1, templateObject_2;
+
+export { PhoneNumberInputSizes, PhoneNumberInput as default };
+//# sourceMappingURL=PhoneNumberInput.js.map

package/build/src/components/PhoneNumberInput.js.map

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

package/build/src/components/Product.js

@@ -0,0 +1,125 @@
+import { __makeTemplateObject } from '../../node_modules/tslib/tslib.es6.js';
+import React, { useState, Fragment } from 'react';
+import styled from 'styled-components';
+import * as Polished from 'polished';
+import PaymentUtil from '@sellout/models/.dist/utils/PaymentUtil';
+import AnimateHeight from 'react-animate-height';
+import { Colors } from '../Colors.js';
+import Counter from './Counter.js';
+import * as PriceUtil from '@sellout/utils/.dist/price';
+import * as Time from '@sellout/utils/.dist/time';
+
+var TicketsEnum;
+(function (TicketsEnum) {
+    TicketsEnum["Tickets"] = "Tickets";
+    TicketsEnum["AddOns"] = "AddOns";
+})(TicketsEnum || (TicketsEnum = {}));
+var FeeAppliedToEnum;
+(function (FeeAppliedToEnum) {
+    FeeAppliedToEnum["Order"] = "Order";
+    FeeAppliedToEnum["Ticket"] = "Ticket";
+    FeeAppliedToEnum["Upgrade"] = "Upgrade";
+    FeeAppliedToEnum["AddOns"] = "Add-Ons";
+})(FeeAppliedToEnum || (FeeAppliedToEnum = {}));
+var AdvanceOptionsEnum;
+(function (AdvanceOptionsEnum) {
+    AdvanceOptionsEnum["ShowLess"] = "Show Less";
+    AdvanceOptionsEnum["ShowMore"] = "Show More";
+    AdvanceOptionsEnum["HideFees"] = "Hide Fees";
+    AdvanceOptionsEnum["ShowFees"] = "Show Fees";
+})(AdvanceOptionsEnum || (AdvanceOptionsEnum = {}));
+var Row = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  justify-content: ", ";\n"], ["\n  display: flex;\n  flex-direction: row;\n  justify-content: ", ";\n"])), function (props) { return props.justify; });
+var Column = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n"], ["\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n"])));
+var LeftWrapper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n"], ["\n  display: flex;\n  flex-direction: column;\n"])));
+var Container = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  background-color: ", ";\n  margin: 0 24px;\n  padding: 24px 0;\n  border-bottom: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n"], ["\n  background-color: ", ";\n  margin: 0 24px;\n  padding: 24px 0;\n  border-bottom: 1px solid ", ";\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n"])), Colors.SurfaceTertiary, Colors.SecondaryStroke);
+var Title = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  font-size: 16px;\n  color: ", ";\n  font-weight: 500;\n  font-family: \"Inter\";\n  line-height: 20px;\n"], ["\n  font-size: 16px;\n  color: ", ";\n  font-weight: 500;\n  font-family: \"Inter\";\n  line-height: 20px;\n"])), Colors.HeadingSecondary);
+var Price = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  font-size: 16px;\n  color: ", ";\n  font-weight: 500;\n  margin: 5px 0;\n  line-height: 90%;\n"], ["\n  font-size: 16px;\n  color: ", ";\n  font-weight: 500;\n  margin: 5px 0;\n  line-height: 90%;\n"])), Colors.HeadingSecondary);
+var Subtitle = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  font-size: 1.2rem;\n  font-weight: 500;\n  line-height: 160%;\n  color: ", ";\n  font-family: \"inter\";\n"], ["\n  font-size: 1.2rem;\n  font-weight: 500;\n  line-height: 160%;\n  color: ", ";\n  font-family: \"inter\";\n"])), Colors.White);
+var Description = styled.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  color: ", ";\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 21px;\n  font-family: \"Inter\";\n  letter-spacing: -0.08px;\n  word-break: break-word;\n  overflow-wrap: break-word;\n  max-width: 88%;\n"], ["\n  color: ", ";\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 21px;\n  font-family: \"Inter\";\n  letter-spacing: -0.08px;\n  word-break: break-word;\n  overflow-wrap: break-word;\n  max-width: 88%;\n"])), Colors.SupportTertiary);
+var Tickets = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  font-size: 1.2rem;\n  font-weight: 500;\n  line-height: 160%;\n  color: ", ";\n  font-family: \"inter\";\n"], ["\n  font-size: 1.2rem;\n  font-weight: 500;\n  line-height: 160%;\n  color: ", ";\n  font-family: \"inter\";\n"])), Colors.SupportTertiary);
+var Tag = styled.div(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n  font-size: 16px;\n  color: ", ";\n  font-weight: 500;\n  margin-bottom: 5px;\n  line-height: 90%;\n"], ["\n  font-size: 16px;\n  color: ", ";\n  font-weight: 500;\n  margin-bottom: 5px;\n  line-height: 90%;\n"])), Colors.HeadingPrimary);
+var Value = styled.div(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n  font-size: 28px;\n  min-width: 20px;\n  color: ", ";\n  line-height: 90%;\n  font-weight: 500;\n"], ["\n  font-size: 28px;\n  min-width: 20px;\n  color: ", ";\n  line-height: 90%;\n  font-weight: 500;\n"])), Colors.HeadingPrimary);
+var Ellipsis = styled.div(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n  display: -webkit-box;\n  -webkit-line-clamp: ", ";\n  -webkit-box-orient: ", ";\n  overflow: hidden;\n  text-overflow: ellipsis;\n"], ["\n  display: -webkit-box;\n  -webkit-line-clamp: ", ";\n  -webkit-box-orient: ", ";\n  overflow: hidden;\n  text-overflow: ellipsis;\n"])), function (props) { return (props.active ? 3 : null); }, function (props) { return (props.active ? "vertical" : null); });
+var ShowMore = styled.div(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n  font-size: 14px;\n  font-weight: 500;\n  line-height: 160%;\n  color: ", ";\n  transition: all 0.2s;\n  font-family: \"Inter\";\n"], ["\n  font-size: 14px;\n  font-weight: 500;\n  line-height: 160%;\n  color: ", ";\n  transition: all 0.2s;\n  font-family: \"Inter\";\n"])), Colors.InteractiveBGPrimary);
+var ShowMoreInner = styled.span(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n  &:hover {\n    cursor: pointer;\n    color: ", ";\n  }\n\n  &:active {\n    color: ", ";\n  }\n"], ["\n  &:hover {\n    cursor: pointer;\n    color: ", ";\n  }\n\n  &:active {\n    color: ", ";\n  }\n"])), Polished.lighten(0.025, Colors.Orange), Polished.darken(0.025, Colors.Orange));
+var RightWrapperCol = styled.div(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  justify-content: space-between;\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-end;\n  justify-content: space-between;\n"])));
+var HideShowContent = styled.div(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n  font-size: 12px;\n  color: #fff;\n  letter-spacing: 0.5px;\n  margin-top: 10px;\n  cursor: pointer;\n  border-bottom: 1px solid #fff;\n  opacity: 0.7;\n  white-space: nowrap;\n"], ["\n  font-size: 12px;\n  color: #fff;\n  letter-spacing: 0.5px;\n  margin-top: 10px;\n  cursor: pointer;\n  border-bottom: 1px solid #fff;\n  opacity: 0.7;\n  white-space: nowrap;\n"])));
+var FeeList = styled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n"], ["\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n"])));
+var FeeItem = styled.div(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  color: ", ";\n  font-size: 14px;\n"], ["\n  display: flex;\n  justify-content: space-between;\n  color: ", ";\n  font-size: 14px;\n"])), Colors.White);
+var Label = styled.span(templateObject_19 || (templateObject_19 = __makeTemplateObject([""], [""])));
+var Amount = styled.span(templateObject_20 || (templateObject_20 = __makeTemplateObject([""], [""])));
+var DateTextWrapper = styled.span(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n  margin: 7px 0px;\n"], ["\n  margin: 7px 0px;\n"])));
+var DateText = styled.span(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n  font-size: 15px;\n  font-weight: 500;\n  color: ", ";\n  margin-bottom: 5px;\n  padding-right: 5px;\n"], ["\n  font-size: 15px;\n  font-weight: 500;\n  color: ", ";\n  margin-bottom: 5px;\n  padding-right: 5px;\n"])), Colors.HeadingSecondary);
+function Product(_a) {
+    var _b = _a.title, title = _b === void 0 ? "" : _b, _c = _a.price, price = _c === void 0 ? 0 : _c, _d = _a.subtitle, subtitle = _d === void 0 ? "" : _d, _e = _a.description, description = _e === void 0 ? "" : _e, _f = _a.isRSVP, isRSVP = _f === void 0 ? false : _f, isTicketScreen = _a.isTicketScreen, 
+    // Counter Props
+    value = _a.value, minValue = _a.minValue, maxValue = _a.maxValue, onIncrement = _a.onIncrement, onDecrement = _a.onDecrement, eventDays = _a.eventDays, isMultiDaysEvent = _a.isMultiDaysEvent, timeZone = _a.timeZone, _g = _a.remainingQty, remainingQty = _g === void 0 ? 0 : _g, isTicketType = _a.isTicketType, isFees = _a.isFees, isUpgradeType = _a.isUpgradeType;
+    var _h = useState(false), showMore = _h[0], setShowMore = _h[1];
+    var _j = useState(true), showEllipsis = _j[0], setShowEllipsis = _j[1];
+    var _k = useState(false), showFees = _k[0], setShowFees = _k[1];
+    var descModified = description;
+    if (descModified.length > 210 && !showMore) {
+        descModified = descModified.substring(0, 210) + "...";
+    }
+    var toggle = function () {
+        setShowEllipsis(!showEllipsis);
+        setShowMore(!showMore);
+    };
+    var toggleFees = function () {
+        setShowFees(!showFees);
+    };
+    var ticketsAddOns = isTicketScreen === TicketsEnum.Tickets
+        ? FeeAppliedToEnum.Ticket
+        : FeeAppliedToEnum.AddOns;
+    var applicableFees = isFees
+        ? PaymentUtil.getApplicableFees({
+            price: price,
+            fees: isFees,
+            isTicketType: isTicketType,
+            isUpgradeType: isUpgradeType,
+        })
+        : [];
+    return (React.createElement(Container, null,
+        React.createElement(Column, null,
+            React.createElement(LeftWrapper, null,
+                React.createElement(Title, null, title),
+                isMultiDaysEvent && (React.createElement(DateTextWrapper, null, eventDays &&
+                    eventDays.length > 0 &&
+                    (eventDays === null || eventDays === void 0 ? void 0 : eventDays.map(function (day, i) {
+                        return (React.createElement(DateText, { key: i },
+                            Time.format(day, "MMM Do", timeZone),
+                            eventDays.length !== i + 1 && ","));
+                    })))),
+                (function () {
+                    if (!description)
+                        return;
+                    return (React.createElement(Fragment, null,
+                        React.createElement(AnimateHeight, { height: "auto" },
+                            React.createElement(Ellipsis, { active: showEllipsis },
+                                React.createElement(Description, null, description))),
+                        descModified.length > 115 ? (React.createElement(ShowMore, null,
+                            React.createElement(ShowMoreInner, { onClick: function () { return toggle(); } }, showMore
+                                ? AdvanceOptionsEnum.ShowLess
+                                : AdvanceOptionsEnum.ShowMore))) : ("")));
+                })()),
+            React.createElement(RightWrapperCol, null,
+                isRSVP ? (PriceUtil.output(price, true) === "0.00" || 0 ? (React.createElement(Price, null, "RSVP")) : (React.createElement(Price, null, "$".concat(PriceUtil.output(price, true)) + " (Ticket value)"))) : (React.createElement(Price, null, "$".concat(PriceUtil.output(price, true)))),
+                (applicableFees === null || applicableFees === void 0 ? void 0 : applicableFees.length) > 0 && (React.createElement(HideShowContent, { onClick: function () { return toggleFees(); } }, showFees
+                    ? AdvanceOptionsEnum.HideFees
+                    : AdvanceOptionsEnum.ShowFees)))),
+        showFees && (applicableFees === null || applicableFees === void 0 ? void 0 : applicableFees.length) > 0 && (React.createElement(FeeList, null, applicableFees === null || applicableFees === void 0 ? void 0 : applicableFees.map(function (fee, idx) { return (React.createElement(FeeItem, { key: idx },
+            React.createElement(Label, null, fee.label),
+            React.createElement(Amount, null,
+                "$",
+                fee.amount.toFixed(2)))); }))),
+        React.createElement(Column, null,
+            React.createElement(Value, null,
+                value,
+                React.createElement(Tickets, null, ticketsAddOns)),
+            remainingQty > 0 ? (React.createElement(Counter, { value: value, minValue: minValue, maxValue: maxValue, onIncrement: onIncrement, onDecrement: onDecrement })) : (React.createElement(Tag, null, " Sold out"))),
+        React.createElement(Row, null, subtitle && React.createElement(Subtitle, null, subtitle))));
+}
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22;
+
+export { AdvanceOptionsEnum, FeeAppliedToEnum, TicketsEnum, Product as default };
+//# sourceMappingURL=Product.js.map