@sellout/ui 0.0.109 → 0.0.110

package/build/components/FormattedfullInput.d.ts

@@ -0,0 +1,32 @@
+import React from "react";
+export declare enum InputfullFormats {
+    Price = "Price",
+    Percent = "Percent"
+}
+export declare type InputProps = {
+    inputRef?: React.Ref<HTMLInputElement>;
+    autoFocus?: boolean | undefined;
+    placeholder?: string;
+    value: string;
+    defaultValue?: string;
+    type?: string;
+    format?: InputfullFormats;
+    onMouseEnter?: any;
+    onMouseLeave?: any;
+    onChange?: any;
+    onFocus?: any;
+    onBlur?: any;
+    onSubmit?: Function;
+    canSubmit?: boolean;
+    loading?: boolean;
+    margin?: string;
+    width?: string;
+    onEnter?: Function;
+    label?: string;
+    subLabel?: string;
+    tip?: string;
+    maxLength?: number;
+    validationError?: string;
+    disabled?: boolean;
+};
+export default function Input({ inputRef, autoFocus, placeholder, value, defaultValue, format, type, onMouseEnter, onMouseLeave, onChange, onFocus, onBlur, onSubmit, canSubmit, loading, margin, width, onEnter, label, subLabel, tip, maxLength, validationError, disabled, }: InputProps): JSX.Element;

package/build/components/FormattedfullInput.js

@@ -0,0 +1,85 @@
+import { Colors } from '../Colors.js';
+import { __makeTemplateObject } from '../_virtual/_tslib.js';
+import React, { useState } from 'react';
+import styled from 'styled-components';
+import { darken } from 'polished';
+import Icon, { Icons } from './Icon.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';
+
+var InputfullFormats;
+(function (InputfullFormats) {
+    InputfullFormats["Price"] = "Price";
+    InputfullFormats["Percent"] = "Percent";
+})(InputfullFormats || (InputfullFormats = {}));
+var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: ", ";\n"], ["\n  width: ", ";\n"])), function (props) { return props.width; });
+var Form = styled.form(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  margin: ", ";\n  width: ", ";\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  position: relative;\n  border-radius: 10px;\n  transition: all 0.2s;\n  border: 1px solid\n    ", ";\n  overflow: hidden;\n"], ["\n  margin: ", ";\n  width: ", ";\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  position: relative;\n  border-radius: 10px;\n  transition: all 0.2s;\n  border: 1px solid\n    ",
+    ";\n  overflow: hidden;\n"])), function (props) { return props.margin; }, function (props) { return props.width; }, function (props) {
+    if (props.focused)
+        return Colors.Grey4;
+    if (props.hovered)
+        return darken(0.05, Colors.Grey5);
+    return Colors.Grey5;
+});
+var PriceContainer = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 25px;\n  background-color: ", ";\n"], ["\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 25px;\n  background-color: ", ";\n"])), Colors.Grey5);
+var InputStyled = styled.input(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  background-color: ", ";\n  color: ", ";\n  outline: none;\n  border: 0px;\n  height: 38px;\n  width: 100%;\n  font-family: \"neue-haas-grotesk-display\", sans-serif;\n  font-weight: 500;\n  text-indent: 1px;\n  transition: all 0.2s;\n  padding: 0 16px;\n  text-align: left;\n\n  ", ";\n\n  ", ";\n\n  ::placeholder {\n    color: ", ";\n  }\n"], ["\n  background-color: ",
+    ";\n  color: ", ";\n  outline: none;\n  border: 0px;\n  height: 38px;\n  width: 100%;\n  font-family: \"neue-haas-grotesk-display\", sans-serif;\n  font-weight: 500;\n  text-indent: 1px;\n  transition: all 0.2s;\n  padding: 0 16px;\n  text-align: left;\n\n  ",
+    ";\n\n  ",
+    ";\n\n  ::placeholder {\n    color: ", ";\n  }\n"])), function (props) {
+    return props.disabled ? Colors.Grey6 + " !important" : null;
+}, function (props) { return (props.disabled ? Colors.Grey4 : Colors.Grey1); }, media.mobile(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n    font-size: 1.6rem;\n  "], ["\n    font-size: 1.6rem;\n  "]))), media.desktop(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n    font-size: 1.4rem;\n  "], ["\n    font-size: 1.4rem;\n  "]))), Colors.Grey4);
+var IconText = styled.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  font-size: 1.4rem;\n  font-weight: 600;\n  color: ", ";\n"], ["\n  font-size: 1.4rem;\n  font-weight: 600;\n  color: ", ";\n"])), Colors.Grey3);
+function Input(_a) {
+    var inputRef = _a.inputRef, autoFocus = _a.autoFocus, placeholder = _a.placeholder, value = _a.value, defaultValue = _a.defaultValue, _b = _a.format, format = _b === void 0 ? InputfullFormats.Price : _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, _d = _a.canSubmit, canSubmit = _d === void 0 ? true : _d, loading = _a.loading, margin = _a.margin, width = _a.width, onEnter = _a.onEnter, label = _a.label, subLabel = _a.subLabel, tip = _a.tip, maxLength = _a.maxLength, validationError = _a.validationError, _e = _a.disabled, disabled = _e === void 0 ? false : _e;
+    var _f = useState(false), hovered = _f[0], setHovered = _f[1];
+    var _g = useState(false), focused = _g[0], setFocused = _g[1];
+    var submit = function (event) {
+        event.preventDefault();
+        if (onSubmit && canSubmit && !loading) {
+            onSubmit();
+        }
+        else if (onEnter && !loading) {
+            onEnter();
+        }
+    };
+    return (React.createElement(Container, { width: width },
+        React.createElement(Flex, { justify: "space-between" },
+            label && React.createElement(Label, { text: label, subText: subLabel, tip: tip }),
+            maxLength && React.createElement(MaxLength, { value: value, maxLength: maxLength })),
+        React.createElement(Form, { hovered: hovered, focused: focused, onSubmit: function (event) { return submit(event); }, width: width, margin: margin, noValidate // disables default html5 validation
+            : true, disabled: disabled },
+            format === InputfullFormats.Price && (React.createElement(PriceContainer, null,
+                React.createElement(Icon, { icon: Icons.Dollar, size: 14, color: Colors.Grey3 }))),
+            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);
+                } }),
+            format === InputfullFormats.Percent && (React.createElement(PriceContainer, null,
+                React.createElement(IconText, null, "%")))),
+        validationError && (React.createElement(ValidationError, { validationError: validationError }))));
+}
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
+
+export default Input;
+export { InputfullFormats };

package/build/components/Icons.d.ts

@@ -1,190 +1,190 @@
 export declare const IconEnum: {
-    Amex: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Discover: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    FacebookPlain: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Google: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Mastercard: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Visa: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    AnalyticsLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    BellLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    BoxOfficeLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    BullHornLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CalculatorLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CalendarDayLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CalendarLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CalendarStarLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CancelLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CartLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CheckLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ClipboardLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CopyLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CreditCardFrontLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    EditLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    EnvelopeLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    EnvelopeOpenRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ExportLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    EyeLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    FilterLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    GiftLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    GlobeLinesLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    HelpLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    HomeLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    LinkLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Lock: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    MapPinLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    MetricsLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    MicrophoneLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    MinusCircleLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    MobileLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    OrganizationLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    PhoneLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    PiggyBankLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    PlugLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    PlusCircleLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ReceiptLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ReportLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Scan: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    SearchLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    SeatingLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ShareLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    SortByLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    TeamLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ThumbsDownLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ThumbsUpLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UnlockLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UploadLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UserLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UsersLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    VenueLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    AnalyticsSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CalendarStarSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CreditCardFront: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    FeeSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    KeySolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    LongRightArrow: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    QuestionSquareSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ReportSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    SortBy: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    TeamSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UpgradeSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    AngleDownRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    AngleUpRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    AudienceRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    BoldRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CalculatorRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CalendarDayRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CheckRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Cheers: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Clipboard: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CrownRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    DeleteRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Dollar: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    DownArrow: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    DownloadReport: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Embed: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    FeeRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    FilterRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    FireRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    GiftRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    GlobeLinesRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    GlobeRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    GraphGrowth: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ItalicRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    KeyRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    LeftArrowRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    LeftChevronRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    LinkRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    LongRightArrowRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    OListRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    PlusRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    PrintRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ReportRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    RightArrowRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    RightChevronRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    SearchRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    SettingsRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    SignOut: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    StreamRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    SyncRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    TicketRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UListRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UnderlineRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UnlockRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UpArrow: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Update: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UpgradeRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UsersRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    VerticalEllipsisRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    WarningRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    AngleDownSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    AngleUpSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    AudienceSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    BackArrow: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    BoxOfficeSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    BullhornSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CalculatorSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CalendarDaySolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CalendarWeekSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Cancel: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CancelCircle: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CaretDown: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Cash: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CheckCircle: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ContactSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CopySolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CreditCardBack: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CrownSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Cursor: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    DeleteSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    EnvelopeSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    EyeSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    GlobeLinesSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    GlobeSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    HelpSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    HomeSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    InfotipSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    LeftArrowSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    LeftChevronSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    LockSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Menu: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    MetricsSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    MicrophoneSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    MobileSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    OrganizationSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    PauseSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    PiggyBankSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    PlugSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Plus: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    PlusCircle: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    PrintSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ReceiptSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    RightChevronCircle: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    RightChevronSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    SearchSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    SeatingSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    SettingsSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ShareSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Sort: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    StarSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ThumbsDownSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ThumbsUpSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    TicketSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UploadSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UserCircle: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UserSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UsersSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    VenueSolid: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Warning: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CalendarRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    ChatRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Clock: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CopyRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Edit: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    EyeRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    EyeSlashRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    Help: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    HelpRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    SadTear: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    UserRegular: import("@fortawesome/fontawesome-common-types").IconDefinition;
-    CreditCardBackLight: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    Amex: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Discover: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    FacebookPlain: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Google: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Mastercard: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Visa: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    AnalyticsLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    BellLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    BoxOfficeLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    BullHornLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CalculatorLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CalendarDayLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CalendarLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CalendarStarLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CancelLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CartLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CheckLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ClipboardLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CopyLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CreditCardFrontLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    EditLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    EnvelopeLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    EnvelopeOpenRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ExportLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    EyeLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    FilterLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    GiftLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    GlobeLinesLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    HelpLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    HomeLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    LinkLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Lock: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    MapPinLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    MetricsLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    MicrophoneLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    MinusCircleLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    MobileLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    OrganizationLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    PhoneLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    PiggyBankLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    PlugLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    PlusCircleLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ReceiptLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ReportLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Scan: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    SearchLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    SeatingLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ShareLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    SortByLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    TeamLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ThumbsDownLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ThumbsUpLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UnlockLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UploadLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UserLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UsersLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    VenueLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    AnalyticsSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CalendarStarSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CreditCardFront: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    FeeSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    KeySolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    LongRightArrow: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    QuestionSquareSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ReportSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    SortBy: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    TeamSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UpgradeSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    AngleDownRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    AngleUpRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    AudienceRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    BoldRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CalculatorRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CalendarDayRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CheckRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Cheers: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Clipboard: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CrownRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    DeleteRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Dollar: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    DownArrow: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    DownloadReport: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Embed: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    FeeRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    FilterRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    FireRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    GiftRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    GlobeLinesRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    GlobeRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    GraphGrowth: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ItalicRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    KeyRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    LeftArrowRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    LeftChevronRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    LinkRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    LongRightArrowRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    OListRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    PlusRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    PrintRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ReportRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    RightArrowRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    RightChevronRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    SearchRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    SettingsRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    SignOut: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    StreamRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    SyncRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    TicketRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UListRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UnderlineRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UnlockRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UpArrow: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Update: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UpgradeRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UsersRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    VerticalEllipsisRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    WarningRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    AngleDownSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    AngleUpSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    AudienceSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    BackArrow: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    BoxOfficeSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    BullhornSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CalculatorSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CalendarDaySolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CalendarWeekSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Cancel: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CancelCircle: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CaretDown: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Cash: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CheckCircle: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ContactSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CopySolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CreditCardBack: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CrownSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Cursor: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    DeleteSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    EnvelopeSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    EyeSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    GlobeLinesSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    GlobeSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    HelpSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    HomeSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    InfotipSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    LeftArrowSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    LeftChevronSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    LockSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Menu: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    MetricsSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    MicrophoneSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    MobileSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    OrganizationSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    PauseSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    PiggyBankSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    PlugSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Plus: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    PlusCircle: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    PrintSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ReceiptSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    RightChevronCircle: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    RightChevronSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    SearchSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    SeatingSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    SettingsSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ShareSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Sort: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    StarSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ThumbsDownSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ThumbsUpSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    TicketSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UploadSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UserCircle: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UserSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UsersSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    VenueSolid: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Warning: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CalendarRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    ChatRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Clock: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CopyRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Edit: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    EyeRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    EyeSlashRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    Help: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    HelpRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    SadTear: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    UserRegular: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
+    CreditCardBackLight: import("@fortawesome/pro-regular-svg-icons").IconDefinition;
 };

package/build/index.d.ts

@@ -5,6 +5,7 @@ import Counter from "./components/Counter";
 import Dropdown from "./components/Dropdown";
 import Flex from "./components/Flex";
 import FormattedInput, { InputFormats } from "./components/FormattedInput";
+import FormattedfullInput, { InputfullFormats } from "./components/FormattedfullInput";
 import Icon, { Icons } from "./components/Icon";
 import Input from "./components/Input";
 import Label from "./components/Label";
@@ -24,4 +25,4 @@ import * as ErrorUtil from './utils/ErrorUtil';
 import makeEventHandler from './utils/makeEventHandler';
 import * as MediaQuery from './utils/MediaQuery';
 import * as Validation from './utils/Validation';
-export { Colors, Button, CodeInput, Counter, Dropdown, Flex, FormattedInput, InputFormats, Icon, Icons, Input, Label, MaxLength, Loader, LoaderSizes, Motion, PhoneNumberInput, Product, TextButton, Tip, UserImage, UserInfo, ValidationError, ErrorUtil, makeEventHandler, MediaQuery, Validation, AddressSearchDropdown, SearchDropdown };
+export { Colors, Button, CodeInput, Counter, Dropdown, Flex, FormattedInput, InputFormats, FormattedfullInput, InputfullFormats, Icon, Icons, Input, Label, MaxLength, Loader, LoaderSizes, Motion, PhoneNumberInput, Product, TextButton, Tip, UserImage, UserInfo, ValidationError, ErrorUtil, makeEventHandler, MediaQuery, Validation, AddressSearchDropdown, SearchDropdown };

package/build/index.js

@@ -15,6 +15,7 @@ export { default as ValidationError } from './components/ValidationError.js';
 import * as MediaQuery from './utils/MediaQuery.js';
 export { MediaQuery };
 export { default as FormattedInput, InputFormats } from './components/FormattedInput.js';
+export { default as FormattedfullInput, InputfullFormats } from './components/FormattedfullInput.js';
 export { default as Input } from './components/Input.js';
 export { default as PhoneNumberInput } from './components/PhoneNumberInput.js';
 export { default as Product } from './components/Product.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sellout/ui",
-  "version": "0.0.109",
+  "version": "0.0.110",
   "main": "build/index.js",
   "module": "build/index.es.js",
   "files": [
@@ -56,8 +56,8 @@
     "@hapi/joi": "^17.1.1",
     "@react-pdf/primitives": "^2.0.0",
     "@react-pdf/renderer": "^2.0.20",
-    "@sellout/models": "^0.0.109",
-    "@sellout/utils": "^0.0.109",
+    "@sellout/models": "^0.0.110",
+    "@sellout/utils": "^0.0.110",
     "@types/escape-html": "^1.0.1",
     "@types/hapi__joi": "^16.0.12",
     "@types/react-pdf": "^4.0.6",
@@ -71,7 +71,7 @@
     "shortid": "^2.2.16",
     "use-places-autocomplete": "^1.9.4"
   },
-  "gitHead": "314575a9bae7a664a22b810532633cd53920a78b",
+  "gitHead": "f0424d166bf32ead0bce38f54d5d37caec02cfc6",
   "peerDependencies": {
     "react": "^16.13.0",
     "react-dom": "^16.13.0",

package/build/stories/Button.stories.d.ts

@@ -1,9 +0,0 @@
-declare namespace _default {
-    export const title: string;
-    export { OldButton as component };
-}
-export default _default;
-export function Text(): JSX.Element;
-export function Loading(): JSX.Element;
-export function MaxWidth(): JSX.Element;
-import OldButton from "../components/Button";

package/build/stories/Counter.stories.d.ts

@@ -1,7 +0,0 @@
-declare namespace _default {
-    export const title: string;
-    export { Counter as component };
-}
-export default _default;
-export function Default(): JSX.Element;
-import Counter from "../components/Counter";

package/build/stories/Icon.stories.d.ts

@@ -1,7 +0,0 @@
-declare namespace _default {
-    export const title: string;
-    export { Icon as component };
-}
-export default _default;
-export function Plain(): JSX.Element;
-import Icon from "../components/Icon";

package/build/stories/Input.stories.d.ts

@@ -1,9 +0,0 @@
-declare namespace _default {
-    export const title: string;
-    export { Input as component };
-}
-export default _default;
-export function Clear(): JSX.Element;
-export function Submit(): JSX.Element;
-export function Loading(): JSX.Element;
-import Input from "../components/Input";

package/build/stories/Loader.stories.d.ts

@@ -1,11 +0,0 @@
-declare namespace _default {
-    export const title: string;
-    export { Loader as component };
-}
-export default _default;
-export function VerySmall(): JSX.Element;
-export function Small(): JSX.Element;
-export function Medium(): JSX.Element;
-export function Large(): JSX.Element;
-export function Colored(): JSX.Element;
-import Loader from "../components/Loader";

package/build/stories/Product.stories.d.ts

@@ -1,8 +0,0 @@
-declare namespace _default {
-    export const title: string;
-    export { Product as component };
-}
-export default _default;
-export function Default(): JSX.Element;
-export function Simple(): JSX.Element;
-import Product from "../components/Product";