@bloom-housing/ui-components 7.1.0 → 7.2.0

package/dist/src/forms/DateField.d.ts

@@ -0,0 +1,34 @@
+import React from "react";
+import { UseFormMethods, FieldError, DeepMap } from "react-hook-form";
+export declare type DateFieldValues = {
+    day: string;
+    month: string;
+    year: string;
+};
+export interface DateFieldProps {
+    defaultDate?: DateFieldValues;
+    disabled?: boolean;
+    error?: DeepMap<DateFieldValues, FieldError>;
+    errorMessage?: string;
+    id?: string;
+    label: React.ReactNode;
+    labelClass?: string;
+    name?: string;
+    note?: string;
+    readerOnly?: boolean;
+    register: UseFormMethods["register"];
+    required?: boolean;
+    watch: UseFormMethods["watch"];
+    dataTestId?: string;
+    strings?: {
+        dateError?: string;
+        day?: string;
+        dayPlaceholder?: string;
+        month?: string;
+        monthPlaceholder?: string;
+        year?: string;
+        yearPlaceholder?: string;
+    };
+}
+declare const DateField: (props: DateFieldProps) => JSX.Element;
+export { DateField as default, DateField };

package/dist/src/forms/DateField.js

@@ -0,0 +1,64 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DateField = exports.default = void 0;
+var react_1 = __importDefault(require("react"));
+var translator_1 = require("../helpers/translator");
+var Field_1 = require("./Field");
+var dayjs_1 = __importDefault(require("dayjs"));
+var DateField = function (props) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
+    var defaultDate = props.defaultDate, error = props.error, register = props.register, name = props.name, id = props.id, errorMessage = props.errorMessage;
+    var getFieldName = function (baseName) {
+        // Append overall date field name to individual date field name
+        return [name, baseName].filter(function (item) { return item; }).join(".");
+    };
+    var labelClasses = ["field-label", props.labelClass];
+    if (props.readerOnly)
+        labelClasses.push("sr-only");
+    return (react_1.default.createElement("fieldset", { id: id },
+        react_1.default.createElement("legend", { className: labelClasses.join(" ") }, props.label),
+        react_1.default.createElement("div", { className: "field-group--date" },
+            react_1.default.createElement(Field_1.Field, { name: getFieldName("month"), label: (_b = (_a = props.strings) === null || _a === void 0 ? void 0 : _a.month) !== null && _b !== void 0 ? _b : (0, translator_1.t)("t.month"), disabled: props.disabled, readerOnly: true, placeholder: (_d = (_c = props.strings) === null || _c === void 0 ? void 0 : _c.monthPlaceholder) !== null && _d !== void 0 ? _d : (0, translator_1.t)("account.settings.placeholders.month"), defaultValue: (_e = defaultDate === null || defaultDate === void 0 ? void 0 : defaultDate.month) !== null && _e !== void 0 ? _e : "", error: (error === null || error === void 0 ? void 0 : error.month) !== undefined, validation: {
+                    required: props.required,
+                    validate: {
+                        monthRange: function (value) {
+                            if (!props.required && !(value === null || value === void 0 ? void 0 : value.length))
+                                return true;
+                            return parseInt(value) > 0 && parseInt(value) <= 12;
+                        },
+                    },
+                }, inputProps: { maxLength: 2 }, register: register, dataTestId: props.dataTestId ? "".concat(props.dataTestId, "-month") : undefined }),
+            react_1.default.createElement(Field_1.Field, { name: getFieldName("day"), label: (_g = (_f = props.strings) === null || _f === void 0 ? void 0 : _f.day) !== null && _g !== void 0 ? _g : (0, translator_1.t)("t.day"), disabled: props.disabled, readerOnly: true, placeholder: (_j = (_h = props.strings) === null || _h === void 0 ? void 0 : _h.dayPlaceholder) !== null && _j !== void 0 ? _j : (0, translator_1.t)("account.settings.placeholders.day"), defaultValue: (_k = defaultDate === null || defaultDate === void 0 ? void 0 : defaultDate.day) !== null && _k !== void 0 ? _k : "", error: (error === null || error === void 0 ? void 0 : error.day) !== undefined, validation: {
+                    required: props.required,
+                    validate: {
+                        dayRange: function (value) {
+                            if (!props.required && !(value === null || value === void 0 ? void 0 : value.length))
+                                return true;
+                            return parseInt(value) > 0 && parseInt(value) <= 31;
+                        },
+                    },
+                }, inputProps: { maxLength: 2 }, register: register, dataTestId: props.dataTestId ? "".concat(props.dataTestId, "-day") : undefined }),
+            react_1.default.createElement(Field_1.Field, { name: getFieldName("year"), label: (_m = (_l = props.strings) === null || _l === void 0 ? void 0 : _l.year) !== null && _m !== void 0 ? _m : (0, translator_1.t)("t.year"), disabled: props.disabled, readerOnly: true, placeholder: (_p = (_o = props.strings) === null || _o === void 0 ? void 0 : _o.yearPlaceholder) !== null && _p !== void 0 ? _p : (0, translator_1.t)("account.settings.placeholders.year"), defaultValue: (_q = defaultDate === null || defaultDate === void 0 ? void 0 : defaultDate.year) !== null && _q !== void 0 ? _q : "", error: (error === null || error === void 0 ? void 0 : error.year) !== undefined, validation: {
+                    required: props.required,
+                    validate: {
+                        yearRange: function (value) {
+                            if (props.required && value && parseInt(value) < 1900)
+                                return false;
+                            if (props.required && value && parseInt(value) > (0, dayjs_1.default)().year() + 10)
+                                return false;
+                            if (!props.required && !(value === null || value === void 0 ? void 0 : value.length))
+                                return true;
+                            return true;
+                        },
+                    },
+                }, inputProps: { maxLength: 4 }, register: register, dataTestId: props.dataTestId ? "".concat(props.dataTestId, "-year") : undefined })),
+        props.note && react_1.default.createElement("p", { className: "field-note mb-2 mt-4" }, props.note),
+        ((error === null || error === void 0 ? void 0 : error.month) || (error === null || error === void 0 ? void 0 : error.day) || (error === null || error === void 0 ? void 0 : error.year)) && (react_1.default.createElement("div", { className: "field error" },
+            react_1.default.createElement("span", { id: "".concat(id, "-error"), className: "error-message" }, errorMessage ? errorMessage : (_s = (_r = props.strings) === null || _r === void 0 ? void 0 : _r.dateError) !== null && _s !== void 0 ? _s : (0, translator_1.t)("errors.dateError"))))));
+};
+exports.default = DateField;
+exports.DateField = DateField;
+//# sourceMappingURL=DateField.js.map

package/dist/src/forms/DateField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateField.js","sourceRoot":"","sources":["../../../src/forms/DateField.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAAyB;AACzB,oDAAyC;AACzC,iCAA+B;AAC/B,gDAAyB;AAmCzB,IAAM,SAAS,GAAG,UAAC,KAAqB;;IAC9B,IAAA,WAAW,GAA8C,KAAK,YAAnD,EAAE,KAAK,GAAuC,KAAK,MAA5C,EAAE,QAAQ,GAA6B,KAAK,SAAlC,EAAE,IAAI,GAAuB,KAAK,KAA5B,EAAE,EAAE,GAAmB,KAAK,GAAxB,EAAE,YAAY,GAAK,KAAK,aAAV,CAAU;IAEtE,IAAM,YAAY,GAAG,UAAC,QAAgB;QACpC,+DAA+D;QAC/D,OAAO,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,MAAM,CAAC,UAAC,IAAI,IAAK,OAAA,IAAI,EAAJ,CAAI,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;IAC1D,CAAC,CAAA;IAED,IAAM,YAAY,GAAG,CAAC,aAAa,EAAE,KAAK,CAAC,UAAU,CAAC,CAAA;IACtD,IAAI,KAAK,CAAC,UAAU;QAAE,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;IAElD,OAAO,CACL,4CAAU,EAAE,EAAE,EAAE;QACd,0CAAQ,SAAS,EAAE,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,IAAG,KAAK,CAAC,KAAK,CAAU;QACjE,uCAAK,SAAS,EAAC,mBAAmB;YAChC,8BAAC,aAAK,IACJ,IAAI,EAAE,YAAY,CAAC,OAAO,CAAC,EAC3B,KAAK,EAAE,MAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,KAAK,mCAAI,IAAA,cAAC,EAAC,SAAS,CAAC,EAC3C,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,UAAU,EAAE,IAAI,EAChB,WAAW,EAAE,MAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,gBAAgB,mCAAI,IAAA,cAAC,EAAC,qCAAqC,CAAC,EACxF,YAAY,EAAE,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,KAAK,mCAAI,EAAE,EACtC,KAAK,EAAE,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,MAAK,SAAS,EACjC,UAAU,EAAE;oBACV,QAAQ,EAAE,KAAK,CAAC,QAAQ;oBACxB,QAAQ,EAAE;wBACR,UAAU,EAAE,UAAC,KAAa;4BACxB,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,CAAA;gCAAE,OAAO,IAAI,CAAA;4BAClD,OAAO,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,QAAQ,CAAC,KAAK,CAAC,IAAI,EAAE,CAAA;wBACrD,CAAC;qBACF;iBACF,EACD,UAAU,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,EAC5B,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,UAAG,KAAK,CAAC,UAAU,WAAQ,CAAC,CAAC,CAAC,SAAS,GACtE;YACF,8BAAC,aAAK,IACJ,IAAI,EAAE,YAAY,CAAC,KAAK,CAAC,EACzB,KAAK,EAAE,MAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,GAAG,mCAAI,IAAA,cAAC,EAAC,OAAO,CAAC,EACvC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,UAAU,EAAE,IAAI,EAChB,WAAW,EAAE,MAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,cAAc,mCAAI,IAAA,cAAC,EAAC,mCAAmC,CAAC,EACpF,YAAY,EAAE,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,GAAG,mCAAI,EAAE,EACpC,KAAK,EAAE,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,GAAG,MAAK,SAAS,EAC/B,UAAU,EAAE;oBACV,QAAQ,EAAE,KAAK,CAAC,QAAQ;oBACxB,QAAQ,EAAE;wBACR,QAAQ,EAAE,UAAC,KAAa;4BACtB,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,CAAA;gCAAE,OAAO,IAAI,CAAA;4BAClD,OAAO,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,QAAQ,CAAC,KAAK,CAAC,IAAI,EAAE,CAAA;wBACrD,CAAC;qBACF;iBACF,EACD,UAAU,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,EAC5B,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,UAAG,KAAK,CAAC,UAAU,SAAM,CAAC,CAAC,CAAC,SAAS,GACpE;YACF,8BAAC,aAAK,IACJ,IAAI,EAAE,YAAY,CAAC,MAAM,CAAC,EAC1B,KAAK,EAAE,MAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,IAAI,mCAAI,IAAA,cAAC,EAAC,QAAQ,CAAC,EACzC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,UAAU,EAAE,IAAI,EAChB,WAAW,EAAE,MAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,eAAe,mCAAI,IAAA,cAAC,EAAC,oCAAoC,CAAC,EACtF,YAAY,EAAE,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,IAAI,mCAAI,EAAE,EACrC,KAAK,EAAE,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,MAAK,SAAS,EAChC,UAAU,EAAE;oBACV,QAAQ,EAAE,KAAK,CAAC,QAAQ;oBACxB,QAAQ,EAAE;wBACR,SAAS,EAAE,UAAC,KAAa;4BACvB,IAAI,KAAK,CAAC,QAAQ,IAAI,KAAK,IAAI,QAAQ,CAAC,KAAK,CAAC,GAAG,IAAI;gCAAE,OAAO,KAAK,CAAA;4BACnE,IAAI,KAAK,CAAC,QAAQ,IAAI,KAAK,IAAI,QAAQ,CAAC,KAAK,CAAC,GAAG,IAAA,eAAK,GAAE,CAAC,IAAI,EAAE,GAAG,EAAE;gCAAE,OAAO,KAAK,CAAA;4BAClF,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,CAAA;gCAAE,OAAO,IAAI,CAAA;4BAClD,OAAO,IAAI,CAAA;wBACb,CAAC;qBACF;iBACF,EACD,UAAU,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,EAC5B,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,UAAG,KAAK,CAAC,UAAU,UAAO,CAAC,CAAC,CAAC,SAAS,GACrE,CACE;QACL,KAAK,CAAC,IAAI,IAAI,qCAAG,SAAS,EAAC,sBAAsB,IAAE,KAAK,CAAC,IAAI,CAAK;QAElE,CAAC,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,MAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,GAAG,CAAA,KAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,IAAI,CAAA,CAAC,IAAI,CAC9C,uCAAK,SAAS,EAAC,aAAa;YAC1B,wCAAM,EAAE,EAAE,UAAG,EAAE,WAAQ,EAAE,SAAS,EAAC,eAAe,IAC/C,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,MAAA,MAAA,KAAK,CAAC,OAAO,0CAAE,SAAS,mCAAI,IAAA,cAAC,EAAC,kBAAkB,CAAC,CAC3E,CACH,CACP,CACQ,CACZ,CAAA;AACH,CAAC,CAAA;AAEqB,4BAAO;AAAE,8BAAS"}

package/dist/src/forms/DateField.stories.d.ts

@@ -0,0 +1,6 @@
+declare const _default: {
+    title: string;
+    decorators: ((storyFn: any) => JSX.Element)[];
+};
+export default _default;
+export declare const Default: () => JSX.Element;

package/dist/src/forms/DateField.stories.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Default = void 0;
+var react_1 = __importDefault(require("react"));
+var DateField_1 = require("./DateField");
+var react_hook_form_1 = require("react-hook-form");
+exports.default = {
+    title: "Forms/Date Field",
+    decorators: [function (storyFn) { return react_1.default.createElement("div", { style: { padding: "1rem" } }, storyFn()); }],
+};
+var Default = function () {
+    var _a = (0, react_hook_form_1.useForm)({ mode: "onChange" }), register = _a.register, watch = _a.watch, errors = _a.errors;
+    return (react_1.default.createElement(DateField_1.DateField, { id: "appDueDate", name: "appDueDate", label: "Application Due Date", required: true, register: register, watch: watch, error: errors === null || errors === void 0 ? void 0 : errors.appDueDate }));
+};
+exports.Default = Default;
+//# sourceMappingURL=DateField.stories.js.map

package/dist/src/forms/DateField.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateField.stories.js","sourceRoot":"","sources":["../../../src/forms/DateField.stories.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAAyB;AACzB,yCAAuC;AACvC,mDAAyC;AAEzC,kBAAe;IACb,KAAK,EAAE,kBAAkB;IACzB,UAAU,EAAE,CAAC,UAAC,OAAY,IAAK,OAAA,uCAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,IAAG,OAAO,EAAE,CAAO,EAAlD,CAAkD,CAAC;CACnF,CAAA;AAEM,IAAM,OAAO,GAAG;IACf,IAAA,KAA8B,IAAA,yBAAO,EAAC,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,EAAzD,QAAQ,cAAA,EAAE,KAAK,WAAA,EAAE,MAAM,YAAkC,CAAA;IAEjE,OAAO,CACL,8BAAC,qBAAS,IACR,EAAE,EAAC,YAAY,EACf,IAAI,EAAC,YAAY,EACjB,KAAK,EAAC,sBAAsB,EAC5B,QAAQ,EAAE,IAAI,EACd,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,UAAU,GACzB,CACH,CAAA;AACH,CAAC,CAAA;AAdY,QAAA,OAAO,WAcnB"}

package/dist/src/forms/Dropzone.d.ts

@@ -0,0 +1,19 @@
+import "./Dropzone.scss";
+interface DropzoneProps {
+    uploader: (file: File) => void;
+    id: string;
+    label: string;
+    helptext?: string;
+    accept?: string | string[];
+    progress?: number;
+    className?: string;
+    maxFiles?: number;
+    strings?: {
+        chooseFromFolder?: string;
+        dragHere?: string;
+        dropHere?: string;
+        orString?: string;
+    };
+}
+declare const Dropzone: (props: DropzoneProps) => JSX.Element;
+export { Dropzone as default, Dropzone };

package/dist/src/forms/Dropzone.js

@@ -0,0 +1,77 @@
+"use strict";
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Dropzone = exports.default = void 0;
+var react_1 = __importStar(require("react"));
+var react_dropzone_1 = require("react-dropzone");
+var translator_1 = require("../helpers/translator");
+require("./Dropzone.scss");
+var Dropzone = function (props) {
+    var _a, _b, _c, _d, _e, _f, _g, _h;
+    var uploader = props.uploader;
+    var classNames = ["field"];
+    if (props.className)
+        classNames.push(props.className);
+    var maxFiles = props.maxFiles || 1;
+    var onDrop = (0, react_1.useCallback)(function (acceptedFiles) {
+        acceptedFiles.forEach(function (file) { return uploader(file); });
+    }, [uploader]);
+    var _j = (0, react_dropzone_1.useDropzone)({
+        onDrop: onDrop,
+        accept: props.accept,
+        maxFiles: maxFiles > 1 ? maxFiles : undefined,
+        multiple: maxFiles > 1,
+    }), getRootProps = _j.getRootProps, getInputProps = _j.getInputProps, isDragActive = _j.isDragActive;
+    var dropzoneClasses = ["dropzone", "control"];
+    if (isDragActive)
+        dropzoneClasses.push("is-active");
+    // Three states:
+    // * File dropzone by default
+    // * Progress > 0 and < 100 shows a progress bar
+    // * Progress 100 doesn't show progress bar or dropzone
+    return (react_1.default.createElement("div", { className: classNames.join(" ") },
+        react_1.default.createElement("label", { htmlFor: props.id, className: "label" }, props.label),
+        props.helptext && react_1.default.createElement("p", { className: "dropzone__helptext" }, props.helptext),
+        props.progress && props.progress === 100 ? (react_1.default.createElement(react_1.default.Fragment, null)) : props.progress && props.progress > 0 ? (react_1.default.createElement("progress", { className: "dropzone__progress", max: "100", value: props.progress })) : (react_1.default.createElement("div", __assign({ className: dropzoneClasses.join(" ") }, getRootProps()),
+            react_1.default.createElement("input", __assign({ id: props.id }, getInputProps(), { "data-test-id": "dropzone-input" })),
+            isDragActive ? (react_1.default.createElement("p", null, (_b = (_a = props.strings) === null || _a === void 0 ? void 0 : _a.dropHere) !== null && _b !== void 0 ? _b : (0, translator_1.t)("t.dropFilesHere"))) : (react_1.default.createElement("p", null, (_d = (_c = props.strings) === null || _c === void 0 ? void 0 : _c.dragHere) !== null && _d !== void 0 ? _d : (0, translator_1.t)("t.dragFilesHere"),
+                " ", (_f = (_e = props.strings) === null || _e === void 0 ? void 0 : _e.orString) !== null && _f !== void 0 ? _f : (0, translator_1.t)("t.or"),
+                " ",
+                react_1.default.createElement("u", { className: "text-primary" }, (_h = (_g = props.strings) === null || _g === void 0 ? void 0 : _g.chooseFromFolder) !== null && _h !== void 0 ? _h : (0, translator_1.t)("t.chooseFromFolder").toLowerCase())))))));
+};
+exports.default = Dropzone;
+exports.Dropzone = Dropzone;
+//# sourceMappingURL=Dropzone.js.map

package/dist/src/forms/Dropzone.js.map

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

package/dist/src/forms/Dropzone.stories.d.ts

@@ -0,0 +1,6 @@
+declare const _default: {
+    title: string;
+    decorators: ((...args: any) => any)[];
+};
+export default _default;
+export declare const defaultDropzone: () => JSX.Element;

package/dist/src/forms/Dropzone.stories.js

@@ -0,0 +1,60 @@
+"use strict";
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultDropzone = void 0;
+var React = __importStar(require("react"));
+var addon_knobs_1 = require("@storybook/addon-knobs");
+var CloudinaryUpload_1 = require("./CloudinaryUpload");
+var Dropzone_1 = require("./Dropzone");
+exports.default = {
+    title: "Forms/Dropzone",
+    decorators: [function (storyFn) { return React.createElement("div", { style: { padding: "1rem" } }, storyFn()); }, addon_knobs_1.withKnobs],
+};
+var defaultDropzone = function () {
+    var _a = React.useState(0), progressValue = _a[0], setProgressValue = _a[1];
+    var _b = React.useState(""), cloudinaryImage = _b[0], setCloudinaryImage = _b[1];
+    var cloudName = (0, addon_knobs_1.text)("Cloudinary Cloud", "");
+    var uploadPreset = (0, addon_knobs_1.text)("Upload Preset", "");
+    var exampleUploader = function (file) {
+        (0, CloudinaryUpload_1.CloudinaryUpload)({
+            file: file,
+            onUploadProgress: function (progress) {
+                setProgressValue(progress);
+            },
+            cloudName: cloudName,
+            uploadPreset: uploadPreset,
+        }).then(function (response) {
+            setProgressValue(100);
+            var imgUrl = "https://res.cloudinary.com/".concat(cloudName, "/image/upload/w_400,c_limit,q_65/").concat(response.data.public_id, ".jpg");
+            setCloudinaryImage(imgUrl);
+        });
+    };
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Dropzone_1.Dropzone, { id: "test-uploading", label: "Upload File", helptext: "Select JPEG or PNG files", uploader: exampleUploader, accept: "image/*", progress: progressValue }),
+        progressValue == 0 && (React.createElement("p", { className: "mt-16" }, "(Provide Cloudinary credentials via the Knobs below.)")),
+        React.createElement("img", { src: cloudinaryImage, style: { width: "200px" }, role: cloudinaryImage ? undefined : "none", alt: cloudinaryImage && "uploaded file" })));
+};
+exports.defaultDropzone = defaultDropzone;
+//# sourceMappingURL=Dropzone.stories.js.map

package/dist/src/forms/Dropzone.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropzone.stories.js","sourceRoot":"","sources":["../../../src/forms/Dropzone.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAC9B,sDAAwD;AACxD,uDAAqD;AACrD,uCAAqC;AAErC,kBAAe;IACb,KAAK,EAAE,gBAAgB;IACvB,UAAU,EAAE,CAAC,UAAC,OAAY,IAAK,OAAA,6BAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,IAAG,OAAO,EAAE,CAAO,EAAlD,CAAkD,EAAE,uBAAS,CAAC;CAC9F,CAAA;AAEM,IAAM,eAAe,GAAG;IACvB,IAAA,KAAoC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,EAApD,aAAa,QAAA,EAAE,gBAAgB,QAAqB,CAAA;IACrD,IAAA,KAAwC,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAzD,eAAe,QAAA,EAAE,kBAAkB,QAAsB,CAAA;IAChE,IAAM,SAAS,GAAG,IAAA,kBAAI,EAAC,kBAAkB,EAAE,EAAE,CAAC,CAAA;IAC9C,IAAM,YAAY,GAAG,IAAA,kBAAI,EAAC,eAAe,EAAE,EAAE,CAAC,CAAA;IAE9C,IAAM,eAAe,GAAG,UAAC,IAAU;QACjC,IAAA,mCAAgB,EAAC;YACf,IAAI,EAAE,IAAI;YACV,gBAAgB,EAAE,UAAC,QAAQ;gBACzB,gBAAgB,CAAC,QAAQ,CAAC,CAAA;YAC5B,CAAC;YACD,SAAS,WAAA;YACT,YAAY,cAAA;SACb,CAAC,CAAC,IAAI,CAAC,UAAC,QAAQ;YACf,gBAAgB,CAAC,GAAG,CAAC,CAAA;YACrB,IAAM,MAAM,GAAG,qCAA8B,SAAS,8CAAoC,QAAQ,CAAC,IAAI,CAAC,SAAS,SAAM,CAAA;YACvH,kBAAkB,CAAC,MAAM,CAAC,CAAA;QAC5B,CAAC,CAAC,CAAA;IACJ,CAAC,CAAA;IAED,OAAO,CACL;QACE,oBAAC,mBAAQ,IACP,EAAE,EAAC,gBAAgB,EACnB,KAAK,EAAC,aAAa,EACnB,QAAQ,EAAC,0BAA0B,EACnC,QAAQ,EAAE,eAAe,EACzB,MAAM,EAAC,SAAS,EAChB,QAAQ,EAAE,aAAa,GACvB;QACD,aAAa,IAAI,CAAC,IAAI,CACrB,2BAAG,SAAS,EAAC,OAAO,4DAA0D,CAC/E;QACD,6BACE,GAAG,EAAE,eAAe,EACpB,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,EACzB,IAAI,EAAE,eAAe,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,EAC1C,GAAG,EAAE,eAAe,IAAI,eAAe,GACvC,CACD,CACJ,CAAA;AACH,CAAC,CAAA;AA1CY,QAAA,eAAe,mBA0C3B"}

package/dist/src/forms/Field.d.ts

@@ -0,0 +1,35 @@
+import React from "react";
+import { UseFormMethods, RegisterOptions } from "react-hook-form";
+export interface FieldProps {
+    error?: boolean;
+    errorMessage?: string;
+    className?: string;
+    controlClassName?: string;
+    caps?: boolean;
+    primary?: boolean;
+    readerOnly?: boolean;
+    type?: string;
+    id?: string;
+    name: string;
+    note?: string | JSX.Element;
+    subNote?: string;
+    label?: string;
+    defaultValue?: string | number;
+    onDrop?: (e: React.DragEvent<HTMLElement>) => boolean;
+    onPaste?: (e: React.ClipboardEvent) => boolean;
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    placeholder?: string;
+    register?: UseFormMethods["register"];
+    validation?: RegisterOptions;
+    disabled?: boolean;
+    prepend?: string;
+    inputProps?: Record<string, unknown>;
+    describedBy?: string;
+    getValues?: UseFormMethods["getValues"];
+    setValue?: UseFormMethods["setValue"];
+    dataTestId?: string;
+    hidden?: boolean;
+    bordered?: boolean;
+}
+declare const Field: (props: FieldProps) => JSX.Element;
+export { Field as default, Field };

package/dist/src/forms/Field.js

@@ -0,0 +1,116 @@
+"use strict";
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Field = exports.default = void 0;
+var react_1 = __importStar(require("react"));
+var ErrorMessage_1 = require("../notifications/ErrorMessage");
+var Field = function (props) {
+    var classes = ["field"];
+    if (props.error) {
+        classes.push("error");
+    }
+    if (props.className) {
+        classes.push(props.className);
+    }
+    var controlClasses = [];
+    if (props.type !== "checkbox") {
+        controlClasses.push("control");
+    }
+    if (props.controlClassName) {
+        controlClasses.push(props.controlClassName);
+    }
+    if (props.bordered && (props.type === "radio" || props.type === "checkbox"))
+        controlClasses.push("field-border");
+    var formatValue = function (focused) {
+        if (focused === void 0) { focused = false; }
+        if (props.getValues && props.setValue) {
+            var currencyValue = props.getValues(props.name);
+            var numericIncome = parseFloat(currencyValue);
+            if (focused && currencyValue) {
+                props.setValue(props.name, parseFloat(currencyValue.replaceAll(",", "")));
+            }
+            else if (isNaN(numericIncome)) {
+                props.setValue(props.name, "");
+            }
+            else {
+                props.setValue(props.name, numericIncome.toLocaleString("en-US", { minimumFractionDigits: 2 }));
+            }
+        }
+    };
+    var filterNumbers = function (e) {
+        if (props.setValue) {
+            props.setValue(props.name, e.target.value.replace(/[a-z]|[A-Z]/g, "").match(/^\d*\.?\d?\d?/g));
+        }
+    };
+    var inputProps = __assign({}, props.inputProps);
+    if (props.type === "currency") {
+        inputProps = __assign(__assign({}, inputProps), { onBlur: function () { return formatValue(); }, onFocus: function () { return formatValue(true); }, onChange: filterNumbers });
+    }
+    var type = (props.type === "currency" && "text") || props.type || "text";
+    var isRadioOrCheckbox = ["radio", "checkbox"].includes(type);
+    var label = (0, react_1.useMemo)(function () {
+        var labelClasses = ["label"];
+        if (props.caps)
+            labelClasses.push("text__caps-spaced");
+        if (props.primary)
+            labelClasses.push("text-primary");
+        if (props.readerOnly)
+            labelClasses.push("sr-only");
+        if (props.type === "radio") {
+            labelClasses.push("font-semibold");
+        }
+        if (props.error)
+            labelClasses.push("text-alert");
+        return (react_1.default.createElement("label", { className: labelClasses.join(" "), htmlFor: props.id || props.name }, props.label));
+    }, [props.caps, props.primary, props.readerOnly, props.type, props.id, props.name, props.label]);
+    var idOrName = props.id || props.name;
+    var note = react_1.default.createElement(react_1.default.Fragment, null);
+    if (props.note) {
+        note = react_1.default.createElement("p", { className: "field-note mb-4" }, props.note);
+    }
+    return (react_1.default.createElement("div", { className: classes.join(" ") },
+        !isRadioOrCheckbox && !props.hidden && label,
+        note,
+        react_1.default.createElement("div", { className: controlClasses.join(" ") },
+            props.prepend && react_1.default.createElement("span", { className: "prepend" }, props.prepend),
+            react_1.default.createElement("input", __assign({ "aria-describedby": props.describedBy ? props.describedBy : "".concat(idOrName), "aria-invalid": !!props.error || false, className: "input", type: type, id: idOrName, name: props.name, defaultValue: props.defaultValue, placeholder: props.placeholder, ref: props.register && props.register(props.validation), disabled: props.disabled, onPaste: props.onPaste, onDrop: props.onDrop, onChange: props.onChange, "data-test-id": props.dataTestId }, inputProps, { hidden: props.hidden })),
+            isRadioOrCheckbox && label),
+        props.subNote && react_1.default.createElement("p", { className: "field-sub-note" }, props.subNote),
+        props.errorMessage && (react_1.default.createElement(ErrorMessage_1.ErrorMessage, { id: "".concat(idOrName, "-error"), error: props.error }, props.errorMessage))));
+};
+exports.default = Field;
+exports.Field = Field;
+//# sourceMappingURL=Field.js.map

package/dist/src/forms/Field.js.map

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

package/dist/src/forms/Field.stories.d.ts

@@ -0,0 +1,13 @@
+declare const _default: {
+    title: string;
+    decorators: ((storyFn: any) => JSX.Element)[];
+};
+export default _default;
+export declare const FieldDefault: () => JSX.Element;
+export declare const TextFieldError: () => JSX.Element;
+export declare const CurrencyField: () => JSX.Element;
+export declare const CurrencyFieldError: () => JSX.Element;
+export declare const checkboxDefault: () => JSX.Element;
+export declare const checkboxBordered: () => JSX.Element;
+export declare const radioDefault: () => JSX.Element;
+export declare const radioBordered: () => JSX.Element;

package/dist/src/forms/Field.stories.js

@@ -0,0 +1,54 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.radioBordered = exports.radioDefault = exports.checkboxBordered = exports.checkboxDefault = exports.CurrencyFieldError = exports.CurrencyField = exports.TextFieldError = exports.FieldDefault = void 0;
+var react_1 = __importDefault(require("react"));
+var react_hook_form_1 = require("react-hook-form");
+var Field_1 = require("./Field");
+exports.default = {
+    title: "Forms/Field",
+    decorators: [function (storyFn) { return react_1.default.createElement("div", { style: { padding: "1rem" } }, storyFn()); }],
+};
+var FieldDefault = function () {
+    var register = (0, react_hook_form_1.useForm)({ mode: "onChange" }).register;
+    return react_1.default.createElement(Field_1.Field, { register: register, name: "Test Input", label: "Custom label" });
+};
+exports.FieldDefault = FieldDefault;
+var TextFieldError = function () {
+    var register = (0, react_hook_form_1.useForm)({ mode: "onChange" }).register;
+    return (react_1.default.createElement(Field_1.Field, { register: register, name: "Test Input", label: "Custom label", type: "text", error: true, errorMessage: "Custom error message" }));
+};
+exports.TextFieldError = TextFieldError;
+var CurrencyField = function () {
+    var _a = (0, react_hook_form_1.useForm)({ mode: "onChange" }), register = _a.register, getValues = _a.getValues, setValue = _a.setValue;
+    return (react_1.default.createElement(Field_1.Field, { register: register, name: "Test Input", className: "custom-class", controlClassName: "custom-control-class", describedBy: "Test Input", label: "Test Input Custom", type: "currency", getValues: getValues, setValue: setValue, prepend: "$" }));
+};
+exports.CurrencyField = CurrencyField;
+var CurrencyFieldError = function () {
+    var _a = (0, react_hook_form_1.useForm)({ mode: "onChange" }), register = _a.register, getValues = _a.getValues, setValue = _a.setValue;
+    return (react_1.default.createElement(Field_1.Field, { register: register, name: "Test Input", error: true, errorMessage: "Custom error message", className: "custom-class", controlClassName: "custom-control-class", describedBy: "Test Input", label: "Test Input Custom", type: "currency", getValues: getValues, setValue: setValue, prepend: "$" }));
+};
+exports.CurrencyFieldError = CurrencyFieldError;
+var checkboxDefault = function () {
+    var _a = (0, react_hook_form_1.useForm)({ mode: "onChange" }), register = _a.register, getValues = _a.getValues, setValue = _a.setValue;
+    return (react_1.default.createElement(Field_1.Field, { register: register, name: "Test Input", describedBy: "Test Input", label: "Test Input", type: "checkbox" }));
+};
+exports.checkboxDefault = checkboxDefault;
+var checkboxBordered = function () {
+    var _a = (0, react_hook_form_1.useForm)({ mode: "onChange" }), register = _a.register, getValues = _a.getValues, setValue = _a.setValue;
+    return (react_1.default.createElement(Field_1.Field, { register: register, name: "Test Input", describedBy: "Test Input", label: "Test Input", type: "checkbox", bordered: true }));
+};
+exports.checkboxBordered = checkboxBordered;
+var radioDefault = function () {
+    var _a = (0, react_hook_form_1.useForm)({ mode: "onChange" }), register = _a.register, getValues = _a.getValues, setValue = _a.setValue;
+    return (react_1.default.createElement(Field_1.Field, { register: register, name: "Test Input", describedBy: "Test Input", label: "Test Input", type: "radio" }));
+};
+exports.radioDefault = radioDefault;
+var radioBordered = function () {
+    var _a = (0, react_hook_form_1.useForm)({ mode: "onChange" }), register = _a.register, getValues = _a.getValues, setValue = _a.setValue;
+    return (react_1.default.createElement(Field_1.Field, { register: register, name: "Test Input", describedBy: "Test Input", label: "Test Input", type: "radio", bordered: true }));
+};
+exports.radioBordered = radioBordered;
+//# sourceMappingURL=Field.stories.js.map

package/dist/src/forms/Field.stories.js.map

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

package/dist/src/forms/FieldGroup.d.ts

@@ -0,0 +1,41 @@
+import React from "react";
+import { UseFormMethods, RegisterOptions } from "react-hook-form";
+export interface FieldSingle {
+    additionalText?: boolean;
+    dataTestId?: string;
+    defaultChecked?: boolean;
+    defaultText?: string;
+    description?: React.ReactNode;
+    disabled?: boolean;
+    id: string;
+    inputProps?: Record<string, unknown>;
+    label: string;
+    uniqueName?: boolean;
+    note?: string;
+    subFields?: FieldSingle[];
+    type?: string;
+    value?: string;
+}
+interface FieldGroupProps {
+    dataTestId?: string;
+    error?: boolean;
+    errorMessage?: string;
+    fieldClassName?: string;
+    fieldGroupClassName?: string;
+    fieldLabelClassName?: string;
+    fields?: FieldSingle[];
+    groupLabel?: string;
+    groupNote?: string;
+    groupSubNote?: string;
+    name: string;
+    register: UseFormMethods["register"];
+    type?: string;
+    validation?: RegisterOptions;
+    strings?: {
+        description?: string;
+        readLess?: string;
+        readMore?: string;
+    };
+}
+declare const FieldGroup: ({ name, groupLabel, fields, type, validation, error, errorMessage, groupNote, register, fieldGroupClassName, fieldClassName, fieldLabelClassName, groupSubNote, dataTestId, strings, }: FieldGroupProps) => JSX.Element;
+export { FieldGroup as default, FieldGroup };