@bloom-housing/ui-components 7.1.0 → 7.2.1

package/dist/src/page_components/sign-in/ResendConfirmationModal.js

@@ -0,0 +1,113 @@
+"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;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ResendConfirmationModal = exports.default = void 0;
+var __1 = require("../../..");
+var react_1 = __importStar(require("react"));
+var react_hook_form_1 = require("react-hook-form");
+var ResendConfirmationModal = function (_a) {
+    var isOpen = _a.isOpen, initialEmailValue = _a.initialEmailValue, loading = _a.loading, onClose = _a.onClose, onSubmit = _a.onSubmit;
+    // eslint-disable-next-line @typescript-eslint/unbound-method
+    var _b = (0, react_hook_form_1.useForm)({
+        defaultValues: (0, react_1.useMemo)(function () {
+            return {
+                emailResend: initialEmailValue,
+            };
+        }, [initialEmailValue]),
+    }), register = _b.register, errors = _b.errors, reset = _b.reset, getValues = _b.getValues, trigger = _b.trigger;
+    (0, react_1.useEffect)(function () {
+        reset({
+            emailResend: initialEmailValue,
+        });
+    }, [initialEmailValue, reset]);
+    var onFormSubmit = function () { return __awaiter(void 0, void 0, void 0, function () {
+        var isValid, emailResend;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0: return [4 /*yield*/, trigger()];
+                case 1:
+                    isValid = _a.sent();
+                    if (!isValid)
+                        return [2 /*return*/];
+                    emailResend = getValues().emailResend;
+                    onSubmit(emailResend);
+                    return [2 /*return*/];
+            }
+        });
+    }); };
+    return (react_1.default.createElement(__1.Modal, { open: isOpen, title: (0, __1.t)("authentication.signIn.yourAccountIsNotConfirmed"), ariaDescription: (0, __1.t)("authentication.createAccount.linkExpired"), onClose: function () {
+            onClose();
+            window.scrollTo(0, 0);
+        }, actions: [
+            react_1.default.createElement(__1.Button, { type: "button", styleType: __1.AppearanceStyleType.primary, onClick: function () { return onFormSubmit(); }, loading: loading, size: __1.AppearanceSizeType.small }, (0, __1.t)("authentication.createAccount.resendTheEmail")),
+            react_1.default.createElement(__1.Button, { type: "button", styleType: __1.AppearanceStyleType.alert, onClick: function () {
+                    onClose();
+                    window.scrollTo(0, 0);
+                }, size: __1.AppearanceSizeType.small }, (0, __1.t)("t.cancel")),
+        ] },
+        react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement(__1.Form, null,
+                react_1.default.createElement(__1.Field, { caps: true, type: "email", name: "emailResend", label: (0, __1.t)("authentication.createAccount.resendAnEmailTo"), placeholder: "example@web.com", validation: { required: true, pattern: __1.emailRegex }, error: !!errors.emailResend, errorMessage: (0, __1.t)("authentication.signIn.loginError"), register: register })),
+            react_1.default.createElement("p", { className: "pt-4" }, (0, __1.t)("authentication.createAccount.resendEmailInfo")))));
+};
+exports.default = ResendConfirmationModal;
+exports.ResendConfirmationModal = ResendConfirmationModal;
+//# sourceMappingURL=ResendConfirmationModal.js.map

package/dist/src/page_components/sign-in/ResendConfirmationModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResendConfirmationModal.js","sourceRoot":"","sources":["../../../../src/page_components/sign-in/ResendConfirmationModal.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,8BASkB;AAClB,6CAAkD;AAClD,mDAA0C;AAc1C,IAAM,uBAAuB,GAAG,UAAC,EAMF;QAL7B,MAAM,YAAA,EACN,iBAAiB,uBAAA,EACjB,OAAO,aAAA,EACP,OAAO,aAAA,EACP,QAAQ,cAAA;IAER,6DAA6D;IACvD,IAAA,KAAkD,IAAA,yBAAO,EAAC;QAC9D,aAAa,EAAE,IAAA,eAAO,EAAC;YACrB,OAAO;gBACL,WAAW,EAAE,iBAAiB;aAC/B,CAAC;QACJ,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC;KACxB,CAAC,EANM,QAAQ,cAAA,EAAE,MAAM,YAAA,EAAE,KAAK,WAAA,EAAE,SAAS,eAAA,EAAE,OAAO,aAMjD,CAAC;IAEH,IAAA,iBAAS,EAAC;QACR,KAAK,CAAC;YACJ,WAAW,EAAE,iBAAiB;SAC/B,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,iBAAiB,EAAE,KAAK,CAAC,CAAC,CAAC;IAE/B,IAAM,YAAY,GAAG;;;;wBACH,qBAAM,OAAO,EAAE,EAAA;;oBAAzB,OAAO,GAAG,SAAe;oBAC/B,IAAI,CAAC,OAAO;wBAAE,sBAAO;oBAEb,WAAW,GAAK,SAAS,EAAE,YAAhB,CAAiB;oBACpC,QAAQ,CAAC,WAAW,CAAC,CAAC;;;;SACvB,CAAC;IAEF,OAAO,CACL,8BAAC,SAAK,IACJ,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,IAAA,KAAC,EAAC,iDAAiD,CAAC,EAC3D,eAAe,EAAE,IAAA,KAAC,EAAC,0CAA0C,CAAC,EAC9D,OAAO,EAAE;YACP,OAAO,EAAE,CAAC;YACV,MAAM,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QACxB,CAAC,EACD,OAAO,EAAE;YACP,8BAAC,UAAM,IACL,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,uBAAmB,CAAC,OAAO,EACtC,OAAO,EAAE,cAAM,OAAA,YAAY,EAAE,EAAd,CAAc,EAC7B,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,sBAAkB,CAAC,KAAK,IAE7B,IAAA,KAAC,EAAC,6CAA6C,CAAC,CAC1C;YACT,8BAAC,UAAM,IACL,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,uBAAmB,CAAC,KAAK,EACpC,OAAO,EAAE;oBACP,OAAO,EAAE,CAAC;oBACV,MAAM,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;gBACxB,CAAC,EACD,IAAI,EAAE,sBAAkB,CAAC,KAAK,IAE7B,IAAA,KAAC,EAAC,UAAU,CAAC,CACP;SACV;QAED;YACE,8BAAC,QAAI;gBACH,8BAAC,SAAK,IACJ,IAAI,EAAE,IAAI,EACV,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,aAAa,EAClB,KAAK,EAAE,IAAA,KAAC,EAAC,8CAA8C,CAAC,EACxD,WAAW,EAAC,iBAAiB,EAC7B,UAAU,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,cAAU,EAAE,EACnD,KAAK,EAAE,CAAC,CAAC,MAAM,CAAC,WAAW,EAC3B,YAAY,EAAE,IAAA,KAAC,EAAC,kCAAkC,CAAC,EACnD,QAAQ,EAAE,QAAQ,GAClB,CACG;YAEP,qCAAG,SAAS,EAAC,MAAM,IAChB,IAAA,KAAC,EAAC,8CAA8C,CAAC,CAChD,CACH,CACG,CACT,CAAC;AACJ,CAAC,CAAC;AAEkC,0CAAO;AAAE,0DAAuB"}

package/dist/src/prototypes/AppCard.stories.d.ts

@@ -0,0 +1,8 @@
+import "./AppCard.scss";
+declare const _default: {
+    title: string;
+    decorators: ((storyFn: any) => JSX.Element)[];
+};
+export default _default;
+export declare const AppCard: () => JSX.Element;
+export declare const AppCardEdit: () => JSX.Element;

package/dist/src/prototypes/AppCard.stories.js

@@ -0,0 +1,48 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AppCardEdit = exports.AppCard = void 0;
+var react_1 = __importDefault(require("react"));
+require("./AppCard.scss");
+exports.default = {
+    title: "Prototypes/AppCard",
+    decorators: [function (storyFn) { return react_1.default.createElement("div", { style: { padding: "1rem" } }, storyFn()); }],
+};
+var AppCard = function () { return (react_1.default.createElement("div", { className: "app-card" },
+    react_1.default.createElement("div", { className: "app-card__header border-bottom" },
+        react_1.default.createElement("div", { className: "app-card__back" },
+            react_1.default.createElement("a", { href: "#", className: "lined" }, "Back")),
+        react_1.default.createElement("h2", { className: "app-card__question" }, "Who would you\u2019d like us to contact if we can\u2019t get ahold of you?"),
+        react_1.default.createElement("p", { className: "app-card__note" }, "By providing an alternate contact, you are allowing us to discuss information on your application with them.")),
+    react_1.default.createElement("header", { className: "app-card__sub-header border-top" },
+        react_1.default.createElement("h3", { className: "app-card__sub-title" }, "You")),
+    react_1.default.createElement("div", { className: "app-card__section inset" },
+        react_1.default.createElement("div", { className: "info-item mb-4" },
+            react_1.default.createElement("h4", { className: "info-item__name" }, "Name"),
+            react_1.default.createElement("p", { className: "info-item__value" }, "Laura Smith")),
+        react_1.default.createElement("div", { className: "info-item mb-4" },
+            react_1.default.createElement("p", { className: "info-item__value" }, "Laura Smith"),
+            react_1.default.createElement("h4", { className: "info-item__name" }, "Name"))))); };
+exports.AppCard = AppCard;
+var AppCardEdit = function () { return (react_1.default.createElement("div", { className: "app-card" },
+    react_1.default.createElement("div", { className: "app-card__header border-bottom" },
+        react_1.default.createElement("div", { className: "app-card__back" },
+            react_1.default.createElement("a", { href: "#", className: "lined" }, "Back")),
+        react_1.default.createElement("h2", { className: "app-card__question" }, "Who would you\u2019d like us to contact if we can\u2019t get ahold of you?"),
+        react_1.default.createElement("p", { className: "app-card__note" }, "By providing an alternate contact, you are allowing us to discuss information on your application with them.")),
+    react_1.default.createElement("header", { className: "app-card__sub-header border-top" },
+        react_1.default.createElement("h3", { className: "app-card__sub-title" }, "You"),
+        react_1.default.createElement("a", { className: "edit-link hide-for-print darker", href: "#" }, "Edit")),
+    react_1.default.createElement("div", { className: "app-card__section inset" },
+        react_1.default.createElement("div", { className: "info-item mb-4 pb-4 border-b" },
+            react_1.default.createElement("h4", { className: "info-item__name" }, "Name"),
+            react_1.default.createElement("p", { className: "info-item__value" }, "Laura Smith"),
+            react_1.default.createElement("a", { className: "edit-link info-item__link", href: "#" }, "Edit")),
+        react_1.default.createElement("div", { className: "info-item mb-4 pb-4 border-b" },
+            react_1.default.createElement("p", { className: "info-item__value" }, "Laura Smith"),
+            react_1.default.createElement("h4", { className: "info-item__name" }, "Name"),
+            react_1.default.createElement("a", { className: "edit-link info-item__link", href: "#" }, "Edit"))))); };
+exports.AppCardEdit = AppCardEdit;
+//# sourceMappingURL=AppCard.stories.js.map

package/dist/src/prototypes/AppCard.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppCard.stories.js","sourceRoot":"","sources":["../../../src/prototypes/AppCard.stories.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAAyB;AAEzB,0BAAuB;AAEvB,kBAAe;IACb,KAAK,EAAE,oBAAoB;IAC3B,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,cAAM,OAAA,CAC3B,uCAAK,SAAS,EAAC,UAAU;IACvB,uCAAK,SAAS,EAAC,gCAAgC;QAC7C,uCAAK,SAAS,EAAC,gBAAgB;YAC7B,qCAAG,IAAI,EAAC,GAAG,EAAC,SAAS,EAAC,OAAO,WAEzB,CACA;QACN,sCAAI,SAAS,EAAC,oBAAoB,iFAE7B;QACL,qCAAG,SAAS,EAAC,gBAAgB,mHAGzB,CACA;IACN,0CAAQ,SAAS,EAAC,iCAAiC;QACjD,sCAAI,SAAS,EAAC,qBAAqB,UAAS,CACrC;IACT,uCAAK,SAAS,EAAC,yBAAyB;QACtC,uCAAK,SAAS,EAAC,gBAAgB;YAC7B,sCAAI,SAAS,EAAC,iBAAiB,WAAU;YACzC,qCAAG,SAAS,EAAC,kBAAkB,kBAAgB,CAC3C;QACN,uCAAK,SAAS,EAAC,gBAAgB;YAC7B,qCAAG,SAAS,EAAC,kBAAkB,kBAAgB;YAC/C,sCAAI,SAAS,EAAC,iBAAiB,WAAU,CACrC,CACF,CACF,CACP,EA9B4B,CA8B5B,CAAA;AA9BY,QAAA,OAAO,WA8BnB;AAEM,IAAM,WAAW,GAAG,cAAM,OAAA,CAC/B,uCAAK,SAAS,EAAC,UAAU;IACvB,uCAAK,SAAS,EAAC,gCAAgC;QAC7C,uCAAK,SAAS,EAAC,gBAAgB;YAC7B,qCAAG,IAAI,EAAC,GAAG,EAAC,SAAS,EAAC,OAAO,WAEzB,CACA;QACN,sCAAI,SAAS,EAAC,oBAAoB,iFAE7B;QACL,qCAAG,SAAS,EAAC,gBAAgB,mHAGzB,CACA;IACN,0CAAQ,SAAS,EAAC,iCAAiC;QACjD,sCAAI,SAAS,EAAC,qBAAqB,UAAS;QAC5C,qCAAG,SAAS,EAAC,iCAAiC,EAAC,IAAI,EAAC,GAAG,WAEnD,CACG;IACT,uCAAK,SAAS,EAAC,yBAAyB;QACtC,uCAAK,SAAS,EAAC,8BAA8B;YAC3C,sCAAI,SAAS,EAAC,iBAAiB,WAAU;YACzC,qCAAG,SAAS,EAAC,kBAAkB,kBAAgB;YAC/C,qCAAG,SAAS,EAAC,2BAA2B,EAAC,IAAI,EAAC,GAAG,WAE7C,CACA;QACN,uCAAK,SAAS,EAAC,8BAA8B;YAC3C,qCAAG,SAAS,EAAC,kBAAkB,kBAAgB;YAC/C,sCAAI,SAAS,EAAC,iBAAiB,WAAU;YACzC,qCAAG,SAAS,EAAC,2BAA2B,EAAC,IAAI,EAAC,GAAG,WAE7C,CACA,CACF,CACF,CACP,EAvCgC,CAuChC,CAAA;AAvCY,QAAA,WAAW,eAuCvB"}

package/dist/src/prototypes/Back.stories.d.ts

@@ -0,0 +1,7 @@
+import "./Back.scss";
+declare const _default: {
+    title: string;
+    decorators: ((storyFn: any) => JSX.Element)[];
+};
+export default _default;
+export declare const Back: () => JSX.Element;

package/dist/src/prototypes/Back.stories.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Back = void 0;
+var react_1 = __importDefault(require("react"));
+require("./Back.scss");
+exports.default = {
+    title: "Prototypes/Back",
+    decorators: [function (storyFn) { return react_1.default.createElement("div", { style: { padding: "1rem" } }, storyFn()); }],
+};
+var Back = function () { return (react_1.default.createElement("span", { className: "back" },
+    react_1.default.createElement("a", { href: "#" }, "Back"))); };
+exports.Back = Back;
+//# sourceMappingURL=Back.stories.js.map

package/dist/src/prototypes/Back.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Back.stories.js","sourceRoot":"","sources":["../../../src/prototypes/Back.stories.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAAyB;AAEzB,uBAAoB;AAEpB,kBAAe;IACb,KAAK,EAAE,iBAAiB;IACxB,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,IAAI,GAAG,cAAM,OAAA,CACxB,wCAAM,SAAS,EAAC,MAAM;IACpB,qCAAG,IAAI,EAAC,GAAG,WAAS,CACf,CACR,EAJyB,CAIzB,CAAA;AAJY,QAAA,IAAI,QAIhB"}

package/dist/src/prototypes/ButtonGroup.stories.d.ts

@@ -0,0 +1,8 @@
+import "./ButtonGroup.scss";
+declare const _default: {
+    title: string;
+    decorators: ((storyFn: any) => JSX.Element)[];
+};
+export default _default;
+export declare const ButtonGroup: () => JSX.Element;
+export declare const ButtonGroupStack: () => JSX.Element;

package/dist/src/prototypes/ButtonGroup.stories.js

@@ -0,0 +1,32 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ButtonGroupStack = exports.ButtonGroup = void 0;
+var AppearanceTypes_1 = require("../global/AppearanceTypes");
+var react_1 = __importDefault(require("react"));
+var Button_1 = require("../actions/Button");
+require("./ButtonGroup.scss");
+exports.default = {
+    title: "Prototypes/ButtonGroup",
+    decorators: [function (storyFn) { return react_1.default.createElement("div", { style: { padding: "1rem" } }, storyFn()); }],
+};
+var handleClick = function (e) {
+    alert("You clicked me! Event: ".concat(e.type));
+};
+var ButtonGroup = function () { return (react_1.default.createElement("div", { className: "button-group grid grid-cols-2 gap-2" },
+    react_1.default.createElement("div", { className: "button-group__item" },
+        react_1.default.createElement(Button_1.Button, { size: AppearanceTypes_1.AppearanceSizeType.small, onClick: handleClick }, "Save")),
+    react_1.default.createElement("div", { className: "button-group__item" },
+        react_1.default.createElement(Button_1.Button, { size: AppearanceTypes_1.AppearanceSizeType.small, className: "is-secondary", onClick: handleClick }, "Preview")))); };
+exports.ButtonGroup = ButtonGroup;
+var ButtonGroupStack = function () { return (react_1.default.createElement("div", { className: "button-group grid grid-cols-2 gap-2" },
+    react_1.default.createElement("div", { className: "button-group__item" },
+        react_1.default.createElement(Button_1.Button, { size: AppearanceTypes_1.AppearanceSizeType.small, onClick: handleClick }, "Save")),
+    react_1.default.createElement("div", { className: "button-group__item" },
+        react_1.default.createElement(Button_1.Button, { size: AppearanceTypes_1.AppearanceSizeType.small, className: "is-secondary", onClick: handleClick }, "Preview")),
+    react_1.default.createElement("div", { className: "button-group__item col-span-2" },
+        react_1.default.createElement(Button_1.Button, { size: AppearanceTypes_1.AppearanceSizeType.small, styleType: AppearanceTypes_1.AppearanceStyleType.primary, onClick: handleClick }, "Submit")))); };
+exports.ButtonGroupStack = ButtonGroupStack;
+//# sourceMappingURL=ButtonGroup.stories.js.map

package/dist/src/prototypes/ButtonGroup.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGroup.stories.js","sourceRoot":"","sources":["../../../src/prototypes/ButtonGroup.stories.tsx"],"names":[],"mappings":";;;;;;AAAA,6DAAmF;AACnF,gDAAyB;AACzB,4CAA0C;AAE1C,8BAA2B;AAE3B,kBAAe;IACb,KAAK,EAAE,wBAAwB;IAC/B,UAAU,EAAE,CAAC,UAAC,OAAY,IAAK,OAAA,uCAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,IAAG,OAAO,EAAE,CAAO,EAAlD,CAAkD,CAAC;CACnF,CAAA;AAED,IAAM,WAAW,GAAG,UAAC,CAAmB;IACtC,KAAK,CAAC,iCAA0B,CAAC,CAAC,IAAI,CAAE,CAAC,CAAA;AAC3C,CAAC,CAAA;AAEM,IAAM,WAAW,GAAG,cAAM,OAAA,CAC/B,uCAAK,SAAS,EAAC,qCAAqC;IAClD,uCAAK,SAAS,EAAC,oBAAoB;QACjC,8BAAC,eAAM,IAAC,IAAI,EAAE,oCAAkB,CAAC,KAAK,EAAE,OAAO,EAAE,WAAW,WAEnD,CACL;IACN,uCAAK,SAAS,EAAC,oBAAoB;QACjC,8BAAC,eAAM,IAAC,IAAI,EAAE,oCAAkB,CAAC,KAAK,EAAE,SAAS,EAAC,cAAc,EAAC,OAAO,EAAE,WAAW,cAE5E,CACL,CACF,CACP,EAbgC,CAahC,CAAA;AAbY,QAAA,WAAW,eAavB;AAEM,IAAM,gBAAgB,GAAG,cAAM,OAAA,CACpC,uCAAK,SAAS,EAAC,qCAAqC;IAClD,uCAAK,SAAS,EAAC,oBAAoB;QACjC,8BAAC,eAAM,IAAC,IAAI,EAAE,oCAAkB,CAAC,KAAK,EAAE,OAAO,EAAE,WAAW,WAEnD,CACL;IACN,uCAAK,SAAS,EAAC,oBAAoB;QACjC,8BAAC,eAAM,IAAC,IAAI,EAAE,oCAAkB,CAAC,KAAK,EAAE,SAAS,EAAC,cAAc,EAAC,OAAO,EAAE,WAAW,cAE5E,CACL;IACN,uCAAK,SAAS,EAAC,+BAA+B;QAC5C,8BAAC,eAAM,IACL,IAAI,EAAE,oCAAkB,CAAC,KAAK,EAC9B,SAAS,EAAE,qCAAmB,CAAC,OAAO,EACtC,OAAO,EAAE,WAAW,aAGb,CACL,CACF,CACP,EAtBqC,CAsBrC,CAAA;AAtBY,QAAA,gBAAgB,oBAsB5B"}

package/dist/src/prototypes/ButtonPager.stories.d.ts

@@ -0,0 +1,7 @@
+import "./ButtonPager.scss";
+declare const _default: {
+    title: string;
+    decorators: ((storyFn: any) => JSX.Element)[];
+};
+export default _default;
+export declare const ButtonPager: () => JSX.Element;

package/dist/src/prototypes/ButtonPager.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.ButtonPager = void 0;
+var react_1 = __importDefault(require("react"));
+require("./ButtonPager.scss");
+exports.default = {
+    title: "Prototypes/ButtonPager",
+    decorators: [function (storyFn) { return react_1.default.createElement("div", { style: { padding: "1rem" } }, storyFn()); }],
+};
+var ButtonPager = function () { return (react_1.default.createElement("div", { className: "button-pager" },
+    react_1.default.createElement("div", { className: "button-pager__row primary" },
+        react_1.default.createElement("button", { className: "button is-filled" }, "Next")),
+    react_1.default.createElement("div", { className: "button-pager__row" },
+        react_1.default.createElement("button", { className: "button is-unstyled" }, "Save and Finish Later")))); };
+exports.ButtonPager = ButtonPager;
+//# sourceMappingURL=ButtonPager.stories.js.map

package/dist/src/prototypes/ButtonPager.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonPager.stories.js","sourceRoot":"","sources":["../../../src/prototypes/ButtonPager.stories.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAAyB;AAEzB,8BAA2B;AAE3B,kBAAe;IACb,KAAK,EAAE,wBAAwB;IAC/B,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,WAAW,GAAG,cAAM,OAAA,CAC/B,uCAAK,SAAS,EAAC,cAAc;IAC3B,uCAAK,SAAS,EAAC,2BAA2B;QACxC,0CAAQ,SAAS,EAAC,kBAAkB,WAAc,CAC9C;IACN,uCAAK,SAAS,EAAC,mBAAmB;QAChC,0CAAQ,SAAS,EAAC,oBAAoB,4BAA+B,CACjE,CACF,CACP,EATgC,CAShC,CAAA;AATY,QAAA,WAAW,eASvB"}

package/dist/src/prototypes/FieldSection.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+import "./FieldSection.scss";
+export interface FieldSectionProps {
+    title?: string;
+    className?: string;
+    tinted?: boolean;
+    insetGrid?: boolean;
+    children: React.ReactNode;
+}
+declare const FieldSection: (props: FieldSectionProps) => JSX.Element;
+export { FieldSection as default, FieldSection };

package/dist/src/prototypes/FieldSection.js

@@ -0,0 +1,44 @@
+"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.FieldSection = exports.default = void 0;
+var React = __importStar(require("react"));
+require("./FieldSection.scss");
+var FieldSection = function (props) {
+    var fieldGridClasses = ["field-section__grid"];
+    if (props.tinted)
+        fieldGridClasses.push("is-tinted");
+    if (props.insetGrid)
+        fieldGridClasses.push("is-inset");
+    if (props.className)
+        fieldGridClasses.push(props.className);
+    return (React.createElement("div", { className: "field-section" },
+        props.title && (React.createElement("header", { className: "field-section__header" },
+            React.createElement("h2", { className: "field-section__title" }, props.title))),
+        React.createElement("div", { className: fieldGridClasses.join(" ") }, props.children)));
+};
+exports.default = FieldSection;
+exports.FieldSection = FieldSection;
+//# sourceMappingURL=FieldSection.js.map

package/dist/src/prototypes/FieldSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldSection.js","sourceRoot":"","sources":["../../../src/prototypes/FieldSection.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAC9B,+BAA4B;AAU5B,IAAM,YAAY,GAAG,UAAC,KAAwB;IAC5C,IAAM,gBAAgB,GAAG,CAAC,qBAAqB,CAAC,CAAA;IAChD,IAAI,KAAK,CAAC,MAAM;QAAE,gBAAgB,CAAC,IAAI,CAAC,WAAW,CAAC,CAAA;IACpD,IAAI,KAAK,CAAC,SAAS;QAAE,gBAAgB,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;IACtD,IAAI,KAAK,CAAC,SAAS;QAAE,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAA;IAE3D,OAAO,CACL,6BAAK,SAAS,EAAC,eAAe;QAC3B,KAAK,CAAC,KAAK,IAAI,CACd,gCAAQ,SAAS,EAAC,uBAAuB;YACvC,4BAAI,SAAS,EAAC,sBAAsB,IAAE,KAAK,CAAC,KAAK,CAAM,CAChD,CACV;QAED,6BAAK,SAAS,EAAE,gBAAgB,CAAC,IAAI,CAAC,GAAG,CAAC,IAAG,KAAK,CAAC,QAAQ,CAAO,CAC9D,CACP,CAAA;AACH,CAAC,CAAA;AAEwB,+BAAO;AAAE,oCAAY"}

package/dist/src/prototypes/FieldSection.stories.d.ts

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

package/dist/src/prototypes/FieldSection.stories.js

@@ -0,0 +1,48 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FieldSectionBlank = exports.FieldGroupAddress = exports.FourColumns = void 0;
+var react_1 = __importDefault(require("react"));
+var react_hook_form_1 = require("react-hook-form");
+var FieldSection_1 = require("./FieldSection");
+var GridItem_1 = require("./GridItem");
+var Field_1 = require("../forms/Field");
+exports.default = {
+    title: "Prototypes/FieldSection",
+    decorators: [function (storyFn) { return react_1.default.createElement("div", { style: { padding: "1rem" } }, storyFn()); }],
+};
+var FourColumns = function () {
+    var register = (0, react_hook_form_1.useForm)().register;
+    return (react_1.default.createElement(FieldSection_1.FieldSection, { title: "Section Title", className: "md:grid md:grid-cols-4 md:gap-8" },
+        react_1.default.createElement(Field_1.Field, { label: "Alpha", placeholder: "Enter text", name: "label1", register: register }),
+        react_1.default.createElement(Field_1.Field, { label: "Beta", placeholder: "Enter text", name: "label2", register: register }),
+        react_1.default.createElement(Field_1.Field, { label: "Gamma", placeholder: "Enter text", name: "label3", register: register }),
+        react_1.default.createElement(Field_1.Field, { label: "Delta", placeholder: "Enter text", name: "label4", register: register }),
+        react_1.default.createElement(Field_1.Field, { label: "Epsilon", placeholder: "Enter text", name: "label5", register: register }),
+        react_1.default.createElement(Field_1.Field, { label: "Zeta", placeholder: "Enter text", name: "label6", register: register }),
+        react_1.default.createElement(Field_1.Field, { label: "Eta", placeholder: "Enter text", name: "label7", register: register }),
+        react_1.default.createElement(Field_1.Field, { label: "Theta", placeholder: "Enter text", name: "label8", register: register })));
+};
+exports.FourColumns = FourColumns;
+var FieldGroupAddress = function () {
+    var register = (0, react_hook_form_1.useForm)().register;
+    return (react_1.default.createElement(FieldSection_1.FieldSection, { title: "Section Title", className: "md:grid md:grid-cols-4 md:gap-8" },
+        react_1.default.createElement("div", { className: "field-group md:col-span-3" },
+            react_1.default.createElement("h3", { className: "field-group__title" }, "My Group"),
+            react_1.default.createElement("div", { className: "field-subgrid md:grid md:grid-cols-6 md:gap-8" },
+                react_1.default.createElement(GridItem_1.GridItem, { className: "md:col-span-4" },
+                    react_1.default.createElement(Field_1.Field, { label: "Street Address", placeholder: "Enter text", name: "label1", register: register })),
+                react_1.default.createElement(GridItem_1.GridItem, { className: "md:col-span-2" },
+                    react_1.default.createElement(Field_1.Field, { label: "Address 2", placeholder: "Enter text", name: "label2", register: register })),
+                react_1.default.createElement(GridItem_1.GridItem, { className: "md:col-span-2" },
+                    react_1.default.createElement(Field_1.Field, { label: "City", placeholder: "Enter text", name: "label3", register: register })),
+                react_1.default.createElement(Field_1.Field, { label: "State", placeholder: "Enter text", name: "label4", register: register }),
+                react_1.default.createElement(Field_1.Field, { label: "Zip", placeholder: "Enter text", name: "label5", register: register })))));
+};
+exports.FieldGroupAddress = FieldGroupAddress;
+var FieldSectionBlank = function () { return (react_1.default.createElement(FieldSection_1.FieldSection, { title: "Section Title", tinted: true, insetGrid: true },
+    react_1.default.createElement("button", { className: "button is-small" }, "Add Household Member"))); };
+exports.FieldSectionBlank = FieldSectionBlank;
+//# sourceMappingURL=FieldSection.stories.js.map

package/dist/src/prototypes/FieldSection.stories.js.map

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

package/dist/src/prototypes/GridItem.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+export interface GridItemProps {
+    children: React.ReactNode;
+    className?: string;
+}
+declare const GridItem: (props: GridItemProps) => JSX.Element;
+export { GridItem as default, GridItem };

package/dist/src/prototypes/GridItem.js

@@ -0,0 +1,36 @@
+"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.GridItem = exports.default = void 0;
+var React = __importStar(require("react"));
+var GridItem = function (props) {
+    var gridItemClasses = ["grid-item"];
+    if (props.className)
+        gridItemClasses.push(props.className);
+    return React.createElement("div", { className: gridItemClasses.join(" ") }, props.children);
+};
+exports.default = GridItem;
+exports.GridItem = GridItem;
+//# sourceMappingURL=GridItem.js.map

package/dist/src/prototypes/GridItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridItem.js","sourceRoot":"","sources":["../../../src/prototypes/GridItem.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAO9B,IAAM,QAAQ,GAAG,UAAC,KAAoB;IACpC,IAAM,eAAe,GAAG,CAAC,WAAW,CAAC,CAAA;IACrC,IAAI,KAAK,CAAC,SAAS;QAAE,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAA;IAE1D,OAAO,6BAAK,SAAS,EAAE,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,IAAG,KAAK,CAAC,QAAQ,CAAO,CAAA;AAC1E,CAAC,CAAA;AAEoB,2BAAO;AAAE,4BAAQ"}

package/dist/src/prototypes/GridItem.stories.d.ts

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

package/dist/src/prototypes/GridItem.stories.js

@@ -0,0 +1,27 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TwoColumns = exports.Default = void 0;
+var react_1 = __importDefault(require("react"));
+var react_hook_form_1 = require("react-hook-form");
+var GridItem_1 = require("./GridItem");
+var Field_1 = require("../forms/Field");
+exports.default = {
+    title: "Prototypes/GridItem",
+    decorators: [function (storyFn) { return react_1.default.createElement("div", { style: { padding: "1rem" } }, storyFn()); }],
+};
+var Default = function () {
+    var register = (0, react_hook_form_1.useForm)().register;
+    return (react_1.default.createElement(GridItem_1.GridItem, null,
+        react_1.default.createElement(Field_1.Field, { label: "Alpha", placeholder: "Enter text", name: "label1", register: register })));
+};
+exports.Default = Default;
+var TwoColumns = function () {
+    var register = (0, react_hook_form_1.useForm)().register;
+    return (react_1.default.createElement(GridItem_1.GridItem, { className: "md:col-span-2" },
+        react_1.default.createElement(Field_1.Field, { label: "Alpha", placeholder: "Enter text", name: "label1", register: register })));
+};
+exports.TwoColumns = TwoColumns;
+//# sourceMappingURL=GridItem.stories.js.map

package/dist/src/prototypes/GridItem.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridItem.stories.js","sourceRoot":"","sources":["../../../src/prototypes/GridItem.stories.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAAyB;AACzB,mDAAyC;AACzC,uCAAqC;AACrC,wCAAsC;AAEtC,kBAAe;IACb,KAAK,EAAE,qBAAqB;IAC5B,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;IACb,IAAA,QAAQ,GAAK,IAAA,yBAAO,GAAE,SAAd,CAAc;IAC9B,OAAO,CACL,8BAAC,mBAAQ;QACP,8BAAC,aAAK,IAAC,KAAK,EAAC,OAAO,EAAC,WAAW,EAAC,YAAY,EAAC,IAAI,EAAC,QAAQ,EAAC,QAAQ,EAAE,QAAQ,GAAI,CACzE,CACZ,CAAA;AACH,CAAC,CAAA;AAPY,QAAA,OAAO,WAOnB;AAEM,IAAM,UAAU,GAAG;IAChB,IAAA,QAAQ,GAAK,IAAA,yBAAO,GAAE,SAAd,CAAc;IAC9B,OAAO,CACL,8BAAC,mBAAQ,IAAC,SAAS,EAAC,eAAe;QACjC,8BAAC,aAAK,IAAC,KAAK,EAAC,OAAO,EAAC,WAAW,EAAC,YAAY,EAAC,IAAI,EAAC,QAAQ,EAAC,QAAQ,EAAE,QAAQ,GAAI,CACzE,CACZ,CAAA;AACH,CAAC,CAAA;AAPY,QAAA,UAAU,cAOtB"}

package/dist/src/prototypes/SummaryCard.stories.d.ts

@@ -0,0 +1,8 @@
+import "./SummaryCard.scss";
+declare const _default: {
+    title: string;
+    decorators: ((storyFn: any) => JSX.Element)[];
+};
+export default _default;
+export declare const SummaryCard: () => JSX.Element;
+export declare const SummaryCardHeading: () => JSX.Element;

package/dist/src/prototypes/SummaryCard.stories.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SummaryCardHeading = exports.SummaryCard = void 0;
+var react_1 = __importDefault(require("react"));
+var StandardTable_stories_1 = require("../tables/StandardTable.stories");
+var MinimalTable_1 = require("../tables/MinimalTable");
+require("./SummaryCard.scss");
+exports.default = {
+    title: "Prototypes/SummaryCard",
+    decorators: [function (storyFn) { return react_1.default.createElement("div", { style: { padding: "1rem" } }, storyFn()); }],
+};
+var SummaryCard = function () { return (react_1.default.createElement("div", { className: "summary-card" },
+    react_1.default.createElement("header", { className: "summary-card__header" },
+        react_1.default.createElement("h2", { className: "summary-card__title" },
+            react_1.default.createElement("a", { href: "#" }, "My Property"))),
+    react_1.default.createElement(MinimalTable_1.MinimalTable, { headers: StandardTable_stories_1.mockHeaders, data: StandardTable_stories_1.mockData }))); };
+exports.SummaryCard = SummaryCard;
+var SummaryCardHeading = function () { return (react_1.default.createElement("div", { className: "summary-card" },
+    react_1.default.createElement("header", { className: "summary-card__header bg-gray-100 border-b mb-2" },
+        react_1.default.createElement("h2", { className: "summary-card__title" },
+            react_1.default.createElement("a", { href: "#" }, "My Property")),
+        react_1.default.createElement("p", { className: "text-sm mt-3" },
+            react_1.default.createElement("span", null, "1 Polk St, San Francisco, CA 94102"),
+            react_1.default.createElement("span", { className: "ml-4 pl-4 border-l border-gray-600" }, "Waitlist: 353"))),
+    react_1.default.createElement(MinimalTable_1.MinimalTable, { headers: StandardTable_stories_1.mockHeaders, data: StandardTable_stories_1.mockData }))); };
+exports.SummaryCardHeading = SummaryCardHeading;
+//# sourceMappingURL=SummaryCard.stories.js.map

package/dist/src/prototypes/SummaryCard.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SummaryCard.stories.js","sourceRoot":"","sources":["../../../src/prototypes/SummaryCard.stories.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAAyB;AACzB,yEAAuE;AACvE,uDAAqD;AAErD,8BAA2B;AAE3B,kBAAe;IACb,KAAK,EAAE,wBAAwB;IAC/B,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,WAAW,GAAG,cAAM,OAAA,CAC/B,uCAAK,SAAS,EAAC,cAAc;IAC3B,0CAAQ,SAAS,EAAC,sBAAsB;QACtC,sCAAI,SAAS,EAAC,qBAAqB;YACjC,qCAAG,IAAI,EAAC,GAAG,kBAAgB,CACxB,CACE;IACT,8BAAC,2BAAY,IAAC,OAAO,EAAE,mCAAW,EAAE,IAAI,EAAE,gCAAQ,GAAI,CAClD,CACP,EATgC,CAShC,CAAA;AATY,QAAA,WAAW,eASvB;AAEM,IAAM,kBAAkB,GAAG,cAAM,OAAA,CACtC,uCAAK,SAAS,EAAC,cAAc;IAC3B,0CAAQ,SAAS,EAAC,gDAAgD;QAChE,sCAAI,SAAS,EAAC,qBAAqB;YACjC,qCAAG,IAAI,EAAC,GAAG,kBAAgB,CACxB;QACL,qCAAG,SAAS,EAAC,cAAc;YACzB,iFAA+C;YAC/C,wCAAM,SAAS,EAAC,oCAAoC,oBAAqB,CACvE,CACG;IACT,8BAAC,2BAAY,IAAC,OAAO,EAAE,mCAAW,EAAE,IAAI,EAAE,gCAAQ,GAAI,CAClD,CACP,EAbuC,CAavC,CAAA;AAbY,QAAA,kBAAkB,sBAa9B"}

package/dist/src/prototypes/Swatch.d.ts

@@ -0,0 +1,3 @@
+export declare const Swatch: (props: {
+    colorVar: string;
+}) => JSX.Element;

package/dist/src/prototypes/Swatch.js

@@ -0,0 +1,30 @@
+"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.Swatch = void 0;
+var React = __importStar(require("react"));
+var Swatch = function (props) { return (React.createElement("span", { style: { backgroundColor: "var(".concat(props.colorVar, ")") }, title: props.colorVar, className: "w-6 border border-gray-500 inline-block" }, "\u00A0")); };
+exports.Swatch = Swatch;
+//# sourceMappingURL=Swatch.js.map

package/dist/src/prototypes/Swatch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Swatch.js","sourceRoot":"","sources":["../../../src/prototypes/Swatch.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA8B;AAEvB,IAAM,MAAM,GAAG,UAAC,KAA2B,IAAK,OAAA,CACrD,8BACE,KAAK,EAAE,EAAE,eAAe,EAAE,cAAO,KAAK,CAAC,QAAQ,MAAG,EAAE,EACpD,KAAK,EAAE,KAAK,CAAC,QAAQ,EACrB,SAAS,EAAC,yCAAyC,aAG9C,CACR,EARsD,CAQtD,CAAA;AARY,QAAA,MAAM,UAQlB"}

package/dist/src/sections/ContentSection.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+import "./ContentSection.scss";
+export interface ContentSectionProps {
+    title?: string;
+    subtitle?: string;
+    children: React.ReactNode;
+}
+declare const ContentSection: (props: ContentSectionProps) => JSX.Element;
+export { ContentSection as default, ContentSection };