quicksnack 3.32.0 → 3.34.0

package/dist/form/ScaffoldForm/ScaffoldFormProvider.js

@@ -1,13 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ScaffoldFormProvider = exports.ScaffoldFormContext = void 0;
-var react_1 = __importDefault(require("react"));
-exports.ScaffoldFormContext = react_1.default.createContext({ factory: undefined });
-var ScaffoldFormProvider = function (_a) {
-    var factory = _a.factory, children = _a.children;
-    return (react_1.default.createElement(exports.ScaffoldFormContext.Provider, { value: { factory: factory } }, children));
-};
-exports.ScaffoldFormProvider = ScaffoldFormProvider;

package/dist/form/ScaffoldForm/hooks/useScaffoldFormContext.js

@@ -1,7 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useScaffoldFormContext = void 0;
-var react_1 = require("react");
-var ScaffoldFormProvider_1 = require("../ScaffoldFormProvider");
-var useScaffoldFormContext = function () { return (0, react_1.useContext)(ScaffoldFormProvider_1.ScaffoldFormContext); };
-exports.useScaffoldFormContext = useScaffoldFormContext;

package/dist/form/ScaffoldForm/scaffoldFormProps.js

@@ -1,91 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.scaffoldFormProps = void 0;
-var FormPositioner_1 = require("./utils/FormPositioner");
-exports.scaffoldFormProps = new FormPositioner_1.FormPositioner({
-    firstName: {
-        type: "TextField",
-        props: {
-            label: "First name",
-        }
-    },
-    prefix: {
-        type: "TextField",
-        props: {
-            label: "Last name",
-            isRequired: true,
-            hint: "Integer posuere erat a ante venenatis dapibus posuere velit aliquet.",
-        }
-    },
-    lastName: {
-        type: "TextField",
-        props: {
-            label: "Last name",
-            hint: "Donec sed odio dui.",
-            error: "Something went wrong!",
-        }
-    },
-    avatar: {
-        type: "FileField",
-        props: {
-            label: "Avatar",
-            placeholder: "Please choose a file",
-        }
-    },
-    description: {
-        type: "TextField",
-        props: {
-            label: "Description",
-            multiline: true
-        }
-    },
-    toppings: {
-        type: "Checkbox",
-        props: {
-            label: "Toppings",
-            error: "Something went wrong!",
-            options: {
-                tomato: "Tomato sauce",
-                cheese: "Cheese",
-                pineapple: "Pineapple",
-                pepperoni: "Pepperoni",
-            }
-        }
-    },
-    crust: {
-        type: "Select",
-        props: {
-            label: "Crust",
-            // error: "Something went wrong!",
-            options: {
-                plain: "Plain",
-                wholeWheat: "Whole wheat",
-                cheese: "Cheese",
-            }
-        }
-    },
-    terms: {
-        type: "Checkbox",
-        props: {
-            options: { agree: "I agree to the terms of usage" }
-        }
-    },
-    submit: {
-        type: "Button",
-        props: {
-            children: "Submit",
-            variant: "primary"
-        }
-    }
-})
-    .setVertical('mobile')
-    .setGrid('tablet', '1fr 1fr', [
-    ['firstName', 'lastName'],
-    ['description', 'avatar'],
-    ['description', 'prefix'],
-    ['description', 'toppings'],
-    ['description', 'crust'],
-    ['terms', 'terms'],
-    ['submit']
-])
-    .getScaffoldProps();

package/dist/form/ScaffoldForm/scaffoldPasswordProps.js

@@ -1,22 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.scaffoldPasswordProps = void 0;
-var FormPositioner_1 = require("./utils/FormPositioner");
-exports.scaffoldPasswordProps = new FormPositioner_1.FormPositioner({
-    password: {
-        type: "PasswordStrengthField",
-        props: {
-            type: 'password',
-            label: "Password",
-        }
-    },
-    prefix: {
-        type: "TextField",
-        props: {
-            type: 'password',
-            label: "Repeat password",
-        }
-    },
-})
-    .setVertical('mobile')
-    .getScaffoldProps();

package/dist/form/ScaffoldForm/types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dist/form/ScaffoldForm/utils/FormPositioner.js

@@ -1,102 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FormPositioner = void 0;
-var immer_1 = __importDefault(require("immer"));
-var lodash_chunk_1 = __importDefault(require("lodash.chunk"));
-var Grid_1 = require("./Grid");
-var assertGridIsValid_1 = require("./assertGridIsValid");
-var responsiveProps_1 = require("../../../responsiveness/responsiveProps");
-var equalColumns_1 = require("./equalColumns");
-var FormPositioner = /** @class */ (function () {
-    function FormPositioner(fields, columns // -> ignore property, its used to pass along internally.
-    ) {
-        if (columns === void 0) { columns = {}; }
-        this.fields = fields;
-        this.columns = columns;
-    }
-    /**
-     * Position form elements responsively in a grid.
-     * Example usage:
-     *
-     *
-     * .setGrid("laptop", [                               // Breakpoint from laptop to bigger
-     *    ["title",   "title",        "title"],           // NOTE: title has a colspan of 3
-     *    ["street",  "number",       "city"],
-     *    ["code",    "description",  "description"],     // NOTE: description has a colspan of 2, and a rowspan of 2
-     *    ["status",  "description",  "description"]
-     * ])
-     * .setVertical("mobileS", 1)                         // NOTE: align everything in a single column for mobileS until laptop
-     *
-     */
-    FormPositioner.prototype.setGrid = function (breakPoint, columns, arrayGrid) {
-        var _this = this;
-        // We save the columns setting in a different prop.
-        if (typeof this.columns === "object") {
-            this.columns[breakPoint] = columns;
-        }
-        // Wrap array grid in a Grid object.
-        // It has some nice utility functions to work with.
-        var grid = new Grid_1.Grid(arrayGrid);
-        // Make sure the given grid is a valid grid:
-        (0, assertGridIsValid_1.assertGridIsValid)(Object.keys(this.fields), grid);
-        // Update position attributes for the given fields:
-        var fields = (0, immer_1.default)(this.fields, function (draftState) {
-            Object
-                .keys(_this.fields)
-                .forEach(function (key) {
-                var fieldProps = draftState[key].props;
-                var _a = grid.getCoordinatesForValue(key), topLeft = _a.topLeft, bottomRight = _a.bottomRight;
-                if (fieldProps.position === undefined) {
-                    fieldProps.position = {};
-                }
-                if (!(0, responsiveProps_1.isResponsiveObject)(fieldProps.position)) {
-                    // When there already was a position set, but it wasn't marked responsive,
-                    // We set that value to the lowest breakpoint:
-                    fieldProps.position = { mobile: fieldProps.position };
-                }
-                // Set values to breakpoint.
-                // @ts-ignore
-                fieldProps.position[breakPoint] = {
-                    column: topLeft.x,
-                    columnSpan: bottomRight.x - topLeft.x + 1,
-                    row: topLeft.y,
-                    rowSpan: bottomRight.y - topLeft.y + 1
-                };
-            });
-        });
-        // Return a new formPositioner.
-        // It allows us to chain, while still being immutable.
-        return new FormPositioner(fields, this.columns);
-    };
-    /**
-     * Aligns all input-fields vertically.
-     */
-    FormPositioner.prototype.setVertical = function (breakPoint, numColumns, columns) {
-        if (numColumns === void 0) { numColumns = 1; }
-        return this.setGrid(breakPoint, columns !== null && columns !== void 0 ? columns : (0, equalColumns_1.equalColumns)(numColumns, false), (0, lodash_chunk_1.default)(Object.keys(this.fields), numColumns));
-    };
-    /**
-     * Aligns all input-fields horizontally.
-     */
-    FormPositioner.prototype.setHorizontal = function (breakPoint, columns) {
-        var keys = Object.keys(this.fields);
-        return this.setGrid(breakPoint, columns !== null && columns !== void 0 ? columns : (0, equalColumns_1.equalColumns)(keys.length, false), [keys]);
-    };
-    FormPositioner.prototype.getColumns = function () {
-        return this.columns;
-    };
-    FormPositioner.prototype.getFields = function () {
-        return this.fields;
-    };
-    FormPositioner.prototype.getScaffoldProps = function () {
-        return {
-            fields: this.fields,
-            columns: this.columns
-        };
-    };
-    return FormPositioner;
-}());
-exports.FormPositioner = FormPositioner;

package/dist/form/ScaffoldForm/utils/Grid.js

@@ -1,64 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Grid = void 0;
-/**
- * Two dimensional array grid.
- * Useful to position elements with.
- *
- * Example:
- *
- * new Grid([
- *  [1,2,3],
- *  [4,5,6],
- *  [7,8,9]
- * ])
- *
- */
-var Grid = /** @class */ (function () {
-    function Grid(grid) {
-        this.grid = grid;
-    }
-    Grid.prototype.getValues = function () {
-        return this.grid;
-    };
-    /**
-     * Returns an array of distinct values in this grid
-     */
-    Grid.prototype.getDistinctValues = function () {
-        var values = [];
-        this.grid.forEach(function (row) {
-            row.forEach(function (item) {
-                if (!values.includes(item)) {
-                    values.push(item);
-                }
-            });
-        });
-        return values;
-    };
-    Grid.prototype.sliceArea = function (topLeft, bottomRight) {
-        if (topLeft.x > bottomRight.x || topLeft.y > bottomRight.y) {
-            throw new Error("Coordinates are mixed up. Please ensure topLeft is actually in the top-left corner. And bottomRight is actually in the bottom-right corner");
-        }
-        return new Grid(this.grid
-            .slice(topLeft.y, bottomRight.y + 1)
-            .map(function (row) { return row.slice(topLeft.x, bottomRight.x + 1); }));
-    };
-    Grid.prototype.getCoordinatesForValue = function (value) {
-        var x = [];
-        var y = [];
-        this.grid.forEach(function (row, yIndex) {
-            row.forEach(function (item, xIndex) {
-                if (item === value) {
-                    x.push(xIndex);
-                    y.push(yIndex);
-                }
-            });
-        });
-        return {
-            topLeft: { x: Math.min.apply(Math, x), y: Math.min.apply(Math, y) },
-            bottomRight: { x: Math.max.apply(Math, x), y: Math.max.apply(Math, y) }
-        };
-    };
-    return Grid;
-}());
-exports.Grid = Grid;

package/dist/form/ScaffoldForm/utils/Grid.test.js

@@ -1,40 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var Grid_1 = require("./Grid");
-describe("Grid", function () {
-    var grid = new Grid_1.Grid([
-        ["one", "two", "two"],
-        ["three", "two", "two"],
-        ["four", "four", "four"],
-    ]);
-    it("should return all distinct values", function () {
-        expect(grid.getDistinctValues())
-            .toEqual(["one", "two", "three", "four"]);
-    });
-    it("should slice a new grid based on given coordinates", function () {
-        var twos = grid.sliceArea({ x: 1, y: 0 }, { x: 2, y: 1 });
-        expect(twos.getValues()).toEqual([
-            ["two", "two"],
-            ["two", "two"],
-        ]);
-        var fours = grid.sliceArea({ x: 0, y: 2 }, { x: 2, y: 2 });
-        expect(fours.getValues()).toEqual([
-            ["four", "four", "four"],
-        ]);
-        var slicedArea = grid.sliceArea({ x: 0, y: 1 }, { x: 1, y: 2 });
-        expect(slicedArea.getValues()).toEqual([
-            ["three", "two"],
-            ["four", "four"],
-        ]);
-    });
-    it("get coordinates for values", function () {
-        expect(grid.getCoordinatesForValue("one"))
-            .toEqual({ topLeft: { x: 0, y: 0 }, bottomRight: { x: 0, y: 0 } });
-        expect(grid.getCoordinatesForValue("two"))
-            .toEqual({ topLeft: { x: 1, y: 0 }, bottomRight: { x: 2, y: 1 } });
-        expect(grid.getCoordinatesForValue("three"))
-            .toEqual({ topLeft: { x: 0, y: 1 }, bottomRight: { x: 0, y: 1 } });
-        expect(grid.getCoordinatesForValue("four"))
-            .toEqual({ topLeft: { x: 0, y: 2 }, bottomRight: { x: 2, y: 2 } });
-    });
-});

package/dist/form/ScaffoldForm/utils/assertGridIsValid.js

@@ -1,37 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.assertGridIsValid = void 0;
-var lodash_difference_1 = __importDefault(require("lodash.difference"));
-/**
- * Makes sure all values in the grid have a rectangular shape.
- * We don't support Tetris types.
- */
-var assertGridIsValid = function (availableKeys, grid) {
-    var distinctValues = grid.getDistinctValues();
-    // Check if all `availableKeys` have a place in the given grid
-    if (distinctValues.length < availableKeys.length) {
-        throw new Error("Not all given fields are present in the grid. Please add these fields ".concat((0, lodash_difference_1.default)(distinctValues, availableKeys).map(function (_) { return "\"".concat(_, "\""); }).join(", ")));
-    }
-    // We don't support tetris-shaped values:
-    // E.g:
-    // [
-    //  [1,1,1],
-    //  [0,1,0]
-    // ]
-    distinctValues.forEach(function (value) {
-        if (!availableKeys.includes(value)) {
-            throw new Error("".concat(value, " is not an existing field. Existing fields are ").concat(availableKeys.map(function (_) { return "\"".concat(_, "\""); }).join(", "), "."));
-        }
-        var coordinates = grid.getCoordinatesForValue(value);
-        var subGrid = grid.sliceArea(coordinates.topLeft, coordinates.bottomRight);
-        var subGridDistinctValues = subGrid.getDistinctValues();
-        if (subGridDistinctValues.length !== 1 || subGridDistinctValues[0] !== value) {
-            throw new Error("Grid contains an unsupported shape. Please make sure \"".concat(value, "\" has a rectangular shape."));
-        }
-    });
-    return true;
-};
-exports.assertGridIsValid = assertGridIsValid;

package/dist/form/ScaffoldForm/utils/assertGridIsValid.test.js

@@ -1,55 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var Grid_1 = require("./Grid");
-var assertGridIsValid_1 = require("./assertGridIsValid");
-describe("isGridValid", function () {
-    var availableKeys = ["one", "two", "three", "four"];
-    describe("when given a valid grid", function () {
-        var grid = new Grid_1.Grid([
-            ["one", "two", "two"],
-            ["three", "two", "two"],
-            ["four", "four", "four"],
-        ]);
-        it("should return true", function () {
-            expect((0, assertGridIsValid_1.assertGridIsValid)(availableKeys, grid)).toEqual(true);
-        });
-    });
-    describe("when given an empty grid", function () {
-        // Two is not rectangular shaped:
-        var grid = new Grid_1.Grid([]);
-        it("should throw an error", function () {
-            expect(function () { return (0, assertGridIsValid_1.assertGridIsValid)(availableKeys, grid); }).toThrowError(expect.anything());
-        });
-    });
-    describe("when not given all available fields", function () {
-        // Two is not rectangular shaped:
-        var grid = new Grid_1.Grid([
-            ["one", "two", "three"],
-        ]);
-        it("should throw an error", function () {
-            expect(function () { return (0, assertGridIsValid_1.assertGridIsValid)(availableKeys, grid); }).toThrowError(expect.anything());
-        });
-    });
-    describe("when given a tetris shaped area in the grid", function () {
-        // Two is not rectangular shaped:
-        var grid = new Grid_1.Grid([
-            ["one", "two", "two"],
-            ["three", "two", "five"],
-            ["four", "four", "four"],
-        ]);
-        it("should throw an error", function () {
-            expect(function () { return (0, assertGridIsValid_1.assertGridIsValid)(availableKeys, grid); }).toThrowError(expect.anything());
-        });
-    });
-    describe("when given an unknown key", function () {
-        // Two is not rectangular shaped:
-        var grid = new Grid_1.Grid([
-            ["one_unknown", "two", "two"],
-            ["three", "two", "two"],
-            ["four", "four", "four"],
-        ]);
-        it("should throw an error", function () {
-            expect(function () { return (0, assertGridIsValid_1.assertGridIsValid)(availableKeys, grid); }).toThrowError(expect.anything());
-        });
-    });
-});

package/dist/form/ScaffoldForm/utils/equalColumns.js

@@ -1,20 +0,0 @@
-"use strict";
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.equalColumns = void 0;
-var equalColumns = function (num, buttonGutter) {
-    var fractions = __spreadArray([], Array(num), true).map(function (_) { return "1fr"; });
-    if (buttonGutter) {
-        fractions.push("auto");
-    }
-    return fractions.join(" ");
-};
-exports.equalColumns = equalColumns;

package/dist/form/Select/Select.js

@@ -1,51 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Select = void 0;
-var react_1 = __importDefault(require("react"));
-var styled_components_1 = __importDefault(require("styled-components"));
-var is_prop_valid_1 = __importDefault(require("@emotion/is-prop-valid"));
-var Wrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n"], ["\n  position: relative;\n"])));
-var StyledSelect = styled_components_1.default.select.withConfig({ shouldForwardProp: is_prop_valid_1.default })(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 100%;\n\n  padding: .67857143em 1em;\n  line-height: 1.21428571em;\n  border-radius: 4px;\n  border: 1px solid rgba(34,36,38,.15);  \n  \n  color: ", ";\n  font-family: Lato, \"Helvetica Neue\", Arial, Helvetica, sans-serif;\n  \n  font-size: 1em;\n  outline: none; \n  \n  appearance: none;\n  \n  &.error {\n    background: #fff6f6;\n    border-color: #e0b4b4;\n    color: #9f3a38;\n  }\n  \n  &.error~div {\n    color: #9f3a38;\n  }    \n"], ["\n  width: 100%;\n\n  padding: .67857143em 1em;\n  line-height: 1.21428571em;\n  border-radius: 4px;\n  border: 1px solid rgba(34,36,38,.15);  \n  \n  color: ", ";\n  font-family: Lato, \"Helvetica Neue\", Arial, Helvetica, sans-serif;\n  \n  font-size: 1em;\n  outline: none; \n  \n  appearance: none;\n  \n  &.error {\n    background: #fff6f6;\n    border-color: #e0b4b4;\n    color: #9f3a38;\n  }\n  \n  &.error~div {\n    color: #9f3a38;\n  }    \n"])), function (props) { return props.theme.palette.common.black; });
-var PaddingOverlay = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  pointer-events: none;\n  padding: 0 1em;\n  position:absolute;  \n  height: 100%;\n  top: 0;\n  right: 0; \n  font-size: 17px;\n  line-height: 40px;\n"], ["\n  pointer-events: none;\n  padding: 0 1em;\n  position:absolute;  \n  height: 100%;\n  top: 0;\n  right: 0; \n  font-size: 17px;\n  line-height: 40px;\n"])));
-exports.Select = react_1.default.forwardRef(function (_a, ref) {
-    var options = _a.options, props = __rest(_a, ["options"]);
-    var optionsArray = Array.isArray(options)
-        ? options
-        : Object.entries(options);
-    return (react_1.default.createElement(Wrapper, null,
-        react_1.default.createElement(StyledSelect, __assign({ ref: ref }, props), optionsArray.map(function (_a) {
-            var value = _a[0], label = _a[1];
-            return (react_1.default.createElement("option", { key: value, value: value }, label));
-        })),
-        react_1.default.createElement(PaddingOverlay, null, "\u25BE")));
-});
-var templateObject_1, templateObject_2, templateObject_3;

package/dist/form/TextField/TextField.js

@@ -1,68 +0,0 @@
-"use strict";
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextField = void 0;
-var react_1 = __importDefault(require("react"));
-var styled_components_1 = __importStar(require("styled-components"));
-var is_prop_valid_1 = __importDefault(require("@emotion/is-prop-valid"));
-var sharedStyles = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding: .67857143em 1em;\n  line-height: 1.21428571em;\n  border-radius: 4px;\n  border: 1px solid rgba(34,36,38,.15);  \n  \n  color: ", ";\n  font-family: Lato, \"Helvetica Neue\", Arial, Helvetica, sans-serif;\n  \n  font-size: 1em;\n  outline: none;\n  \n  &:disabled, &:read-only {\n    background-color: #FAFAFA;\n  }\n  \n  &:focus {\n    color: rgba(0,0,0,.95);\n    border-color: #85b7d9;    \n    background: #fff;\n    box-shadow: 0 0 0 0 rgba(34,36,38,.35) inset;\n  }\n    \n  &.error {\n    background: #fff6f6;\n    border-color: #e0b4b4;\n    color: #9f3a38;\n  }  \n  \n  &.error:focus {\n    background: #fff6f6;\n  }\n     \n  &:focus::placeholder {\n    color:rgba(115,115,115,.87) \n  }\n  \n  &::placeholder {\n    color:rgba(191,191,191,.87); \n  }\n  \n  &.error::placeholder {\n    color: #e7bdbc;\n  }\n  \n  &.error:focus::placeholder {\n    color: #da9796;\n  }        \n"], ["\n  padding: .67857143em 1em;\n  line-height: 1.21428571em;\n  border-radius: 4px;\n  border: 1px solid rgba(34,36,38,.15);  \n  \n  color: ", ";\n  font-family: Lato, \"Helvetica Neue\", Arial, Helvetica, sans-serif;\n  \n  font-size: 1em;\n  outline: none;\n  \n  &:disabled, &:read-only {\n    background-color: #FAFAFA;\n  }\n  \n  &:focus {\n    color: rgba(0,0,0,.95);\n    border-color: #85b7d9;    \n    background: #fff;\n    box-shadow: 0 0 0 0 rgba(34,36,38,.35) inset;\n  }\n    \n  &.error {\n    background: #fff6f6;\n    border-color: #e0b4b4;\n    color: #9f3a38;\n  }  \n  \n  &.error:focus {\n    background: #fff6f6;\n  }\n     \n  &:focus::placeholder {\n    color:rgba(115,115,115,.87) \n  }\n  \n  &::placeholder {\n    color:rgba(191,191,191,.87); \n  }\n  \n  &.error::placeholder {\n    color: #e7bdbc;\n  }\n  \n  &.error:focus::placeholder {\n    color: #da9796;\n  }        \n"])), function (props) { return props.theme.palette.common.black; });
-var Input = styled_components_1.default.input.withConfig({ shouldForwardProp: is_prop_valid_1.default })(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), sharedStyles);
-var Textarea = styled_components_1.default.textarea.withConfig({ shouldForwardProp: is_prop_valid_1.default })(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  ", "\n  height: 100%;\n"], ["\n  ", "\n  height: 100%;\n"])), sharedStyles);
-exports.TextField = react_1.default.forwardRef(function (_a, ref) {
-    var _b = _a.multiline, multiline = _b === void 0 ? false : _b, restProps = __rest(_a, ["multiline"]);
-    return multiline
-        ? react_1.default.createElement(Textarea, __assign({ ref: ref }, restProps))
-        : react_1.default.createElement(Input, __assign({ ref: ref, type: "text" }, restProps));
-});
-var templateObject_1, templateObject_2, templateObject_3;