@simplybusiness/mobius 3.0.0

package/dist/esm/components/Chopin/Header/ContactDetails.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContactDetails.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Header/ContactDetails.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,EAAE,GAAG,EAAE,MAAM,WAAW,CAAC;AAChC,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAClC,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAClC,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAStC,MAAM,mBAAmB,GAAG,uBAAuB,CAAC;AAEpD,MAAM,cAAc,GAA4B,CAAC,EAC/C,KAAK,EACL,UAAU,EACV,YAAY,GACb,EAAE,EAAE;IACH,MAAM,eAAe,GAAG,GAAG,EAAE,CAAC,CAC5B,KAAC,IAAI,IAAC,SAAS,EAAC,wBAAwB,EAAC,IAAI,EAAE,SAAS,GAAI,CAC7D,CAAC;IAEF,OAAO,CACL,MAAC,IAAI,kBAAC,UAAU,EAAC,QAAQ,iBACtB,UAAU,IAAI,KAAC,GAAG,IAAC,SAAS,EAAC,4BAA4B,GAAG,EAC7D,MAAC,IAAI,kBACH,aAAa,EAAC,QAAQ,EACtB,UAAU,EAAC,KAAK,EAChB,SAAS,EAAC,gCAAgC,iBAE1C,MAAC,GAAG,eACD,eAAe,EAAE,EAClB,+BAAQ,SAAS,EAAC,0BAA0B,gBAAE,KAAK,IAAU,IACzD,EACL,CAAC,UAAU,CAAC,CAAC,CAAC,CACb,KAAC,IAAI,kBACH,SAAS,EAAC,0BAA0B,EACpC,IAAI,EAAC,2CAA2C,gBAE/C,mBAAmB,IACf,CACR,CAAC,CAAC,CAAC,CACF,KAAC,YAAY,kBACX,OAAO,EAAE,KAAC,MAAM,kBAAC,OAAO,EAAC,OAAO,gBAAE,mBAAmB,IAAU,EAC/D,SAAS,EAAC,uBAAuB,gBAEhC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CACpC,KAAC,YAAY,CAAC,IAAI,cAChB;gCACE,2CAA2C;gCAC3C,uBAAuB,EAAE;oCACvB,MAAM,EAAE,GAAG,GAAG,IAAI,YAAY,CAAC,GAAG,CAAC,EAAE;iCACtC,GACD,IANoB,GAAG,CAOP,CACrB,CAAC,IACW,CAChB,KACI,EACP,KAAC,IAAI,kBACH,UAAU,EAAC,QAAQ,EACnB,cAAc,EAAC,QAAQ,EACvB,SAAS,EAAC,+BAA+B,gBAEzC,KAAC,IAAI,gCAAY,UAAU,EAAC,IAAI,EAAE,OAAO,KAAK,EAAE,gBAC7C,eAAe,EAAE,IACb,IACF,KACF,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,OAAO,EAAE,cAAc,EAAE,CAAC"}

package/dist/esm/components/Chopin/Header/Header.js

@@ -0,0 +1,26 @@
+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;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import clsx from "clsx";
+import { Logo } from "./Logo";
+import { ContactDetails } from "./ContactDetails";
+import { Flex } from "../../Flex";
+import { OPENING_HOURS } from "./mockOpeningHoursData";
+export const LOGO_LINK = "https://www.simplybusiness.co.uk/";
+const Header = (_a) => {
+    var { className, whiteLabel = false, url = LOGO_LINK, phone, openingHours = OPENING_HOURS } = _a, otherProps = __rest(_a, ["className", "whiteLabel", "url", "phone", "openingHours"]);
+    const classes = clsx("chopin", "chopin/Header", className);
+    return (_jsx("header", Object.assign({ className: classes }, otherProps, { children: _jsxs(Flex, Object.assign({ alignItems: "center", justifyContent: "space-between", className: "chopin/HeaderContent" }, { children: [_jsx(Logo, { url: url, whiteLabel: whiteLabel }), _jsx(ContactDetails, { phone: phone, whiteLabel: whiteLabel, openingHours: openingHours })] })) })));
+};
+Header.displayName = "Header";
+export { Header };
+//# sourceMappingURL=Header.js.map

package/dist/esm/components/Chopin/Header/Header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Header/Header.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAEA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAClC,OAAO,EAAoB,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAWzE,MAAM,CAAC,MAAM,SAAS,GAAG,mCAAmC,CAAC;AAE7D,MAAM,MAAM,GAAoB,CAAC,EAOhC,EAAE,EAAE;QAP4B,EAC/B,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,GAAG,GAAG,SAAS,EACf,KAAK,EACL,YAAY,GAAG,aAAa,OAE7B,EADI,UAAU,cANkB,2DAOhC,CADc;IAEb,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,EAAE,eAAe,EAAE,SAAS,CAAC,CAAC;IAE3D,OAAO,CACL,+BAAQ,SAAS,EAAE,OAAO,IAAM,UAAU,cACxC,MAAC,IAAI,kBACH,UAAU,EAAC,QAAQ,EACnB,cAAc,EAAC,eAAe,EAC9B,SAAS,EAAC,sBAAsB,iBAEhC,KAAC,IAAI,IAAC,GAAG,EAAE,GAAG,EAAE,UAAU,EAAE,UAAU,GAAI,EAC1C,KAAC,cAAc,IACb,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU,EACtB,YAAY,EAAE,YAAY,GAC1B,KACG,IACA,CACV,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC;AAC9B,OAAO,EAAE,MAAM,EAAE,CAAC"}

package/dist/esm/components/Chopin/Header/Header.test.js

@@ -0,0 +1,86 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { render, screen } from "@testing-library/react";
+import { Header, LOGO_LINK } from ".";
+const HEADER_CLASS_NAME = "chopin/Header";
+const LOGO_CLASS_NAME = "chopin/HeaderLogo";
+const CONTACT_CLASS_NAME = "chopin/HeaderContactLink";
+const PHONE_NUMBER_CLASS_NAME = "chopin/HeaderPhoneNumber";
+const props = {
+    phone: "0333 014 6683",
+};
+describe("Header", () => {
+    it("should render without errors", () => {
+        const component = render(_jsx(Header, Object.assign({}, props)));
+        expect(component).toBeTruthy();
+    });
+    describe("uses correct class names", () => {
+        it("uses Chopin class", () => {
+            render(_jsx(Header, Object.assign({}, props, { "data-testid": "test-id" })));
+            expect(screen.getByTestId("test-id")).toHaveClass("chopin");
+        });
+        it("uses chopin/Header class", () => {
+            render(_jsx(Header, Object.assign({}, props, { "data-testid": "test-id" })));
+            expect(screen.getByTestId("test-id")).toHaveClass(HEADER_CLASS_NAME);
+        });
+        it("includes custom class name", () => {
+            render(_jsx(Header, Object.assign({}, props, { "data-testid": "test-id", className: "my-class" })));
+            expect(screen.getByTestId("test-id")).toHaveClass("my-class");
+            expect(screen.getByTestId("test-id")).toHaveClass(HEADER_CLASS_NAME);
+        });
+        it("uses logo class name", () => {
+            render(_jsx(Header, Object.assign({}, props)));
+            const link = screen.getByRole("link", {
+                name: /simply business - insurance for your business/i,
+            });
+            expect(link).toHaveClass(LOGO_CLASS_NAME);
+        });
+        it("uses contact link class name", () => {
+            render(_jsx(Header, Object.assign({}, props)));
+            const link = screen.getByRole("link", {
+                name: /see our opening hours/i,
+            });
+            expect(link).toHaveClass(CONTACT_CLASS_NAME);
+        });
+        it("uses phone number class name", () => {
+            render(_jsx(Header, Object.assign({}, props)));
+            const phoneNumberEl = screen.getByText(props.phone);
+            expect(phoneNumberEl).toHaveClass(PHONE_NUMBER_CLASS_NAME);
+        });
+    });
+    describe("renders correct elements based on passed props", () => {
+        it("renders passed Phone prop", () => {
+            render(_jsx(Header, Object.assign({}, props)));
+            expect(screen.getByText(props.phone)).toBeInTheDocument();
+        });
+        it("renders Logo element as Link by default", () => {
+            render(_jsx(Header, Object.assign({}, props)));
+            const link = screen.getByRole("link", {
+                name: /simply business - insurance for your business/i,
+            });
+            expect(link).toHaveAttribute("href", LOGO_LINK);
+        });
+        it("doesn't render Logo as Link when whiteLabel prop is true", () => {
+            render(_jsx(Header, Object.assign({}, props, { whiteLabel: true })));
+            expect(screen.queryByRole("link", {
+                name: /simply business - insurance for your business/i,
+            })).not.toBeInTheDocument();
+        });
+        it("renders Opening Hours element as Link by default", () => {
+            render(_jsx(Header, Object.assign({}, props)));
+            const link = screen.getByRole("link", {
+                name: /see our opening hours/i,
+            });
+            expect(link).toHaveAttribute("href", "https://www.simplybusiness.co.uk/support/");
+        });
+        it("renders Opening Hours element as Button when whiteLabel prop is true", () => {
+            render(_jsx(Header, Object.assign({}, props, { whiteLabel: true })));
+            expect(screen.queryByRole("link", {
+                name: /see our opening hours/i,
+            })).not.toBeInTheDocument();
+            expect(screen.getByRole("button", {
+                name: /see our opening hours/i,
+            })).toBeInTheDocument();
+        });
+    });
+});
+//# sourceMappingURL=Header.test.js.map

package/dist/esm/components/Chopin/Header/Header.test.js.map

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

package/dist/esm/components/Chopin/Header/Logo.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { Box } from "../../Box";
+import { Link } from "../../Link";
+import { VisuallyHidden } from "../../VisuallyHidden";
+const Logo = ({ whiteLabel, url }) => {
+    if (!whiteLabel) {
+        return (_jsx(Link, Object.assign({ href: url, className: "chopin/HeaderLogo" }, { children: _jsx(VisuallyHidden, { children: "Simply Business - Insurance for your business" }) })));
+    }
+    return _jsx(Box, { className: "chopin/HeaderLogo" });
+};
+export { Logo };
+//# sourceMappingURL=Logo.js.map

package/dist/esm/components/Chopin/Header/Logo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Logo.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Header/Logo.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,MAAM,WAAW,CAAC;AAChC,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAClC,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAOtD,MAAM,IAAI,GAAkB,CAAC,EAAE,UAAU,EAAE,GAAG,EAAE,EAAE,EAAE;IAClD,IAAI,CAAC,UAAU,EAAE;QACf,OAAO,CACL,KAAC,IAAI,kBAAC,IAAI,EAAE,GAAG,EAAE,SAAS,EAAC,mBAAmB,gBAC5C,KAAC,cAAc,gEAEE,IACZ,CACR,CAAC;KACH;IAED,OAAO,KAAC,GAAG,IAAC,SAAS,EAAC,mBAAmB,GAAG,CAAC;AAC/C,CAAC,CAAC;AAEF,OAAO,EAAE,IAAI,EAAE,CAAC"}

package/dist/esm/components/Chopin/Header/index.js

@@ -0,0 +1,3 @@
+export * from "./Header";
+export * from "./mockOpeningHoursData";
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Chopin/Header/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Header/index.tsx"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,wBAAwB,CAAC"}

package/dist/esm/components/Chopin/Header/mockOpeningHoursData.js

@@ -0,0 +1,10 @@
+export const OPENING_HOURS = {
+    Mon: "8am-8pm",
+    Tue: "8am-8pm",
+    Wed: "8am-8pm",
+    Thu: "8am-8pm",
+    Fri: "8am-8pm",
+    "<strong>Sat</strong>": "<strong>Closed</strong>",
+    "<strong>Sun</strong>": "<strong>Closed</strong>",
+};
+//# sourceMappingURL=mockOpeningHoursData.js.map

package/dist/esm/components/Chopin/Header/mockOpeningHoursData.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mockOpeningHoursData.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Header/mockOpeningHoursData.ts"],"names":[],"mappings":"AAIA,MAAM,CAAC,MAAM,aAAa,GAAqB;IAC7C,GAAG,EAAE,SAAS;IACd,GAAG,EAAE,SAAS;IACd,GAAG,EAAE,SAAS;IACd,GAAG,EAAE,SAAS;IACd,GAAG,EAAE,SAAS;IACd,sBAAsB,EAAE,yBAAyB;IACjD,sBAAsB,EAAE,yBAAyB;CAClD,CAAC"}

package/dist/esm/components/Chopin/PercentageTotalsQuestion/PercentageItem.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { useState } from "react";
+import { NumberField } from "../../NumberField";
+export const PercentageItem = ({ itemLabel, maxRemainder = 1, onChange, }) => {
+    const [val, setVal] = useState(0);
+    const maxValue = Math.round((val + maxRemainder) * 100) / 100;
+    // Prevent any input that would make the overall total > 100
+    const handleChange = (newVal) => {
+        const maxNewVal = Math.min(newVal, maxValue);
+        setVal(maxNewVal);
+        onChange(maxNewVal);
+    };
+    const handleInput = e => {
+        // @ts-ignore: does not identify EventTarget as coming from an input element
+        const currentVal = e.target.value;
+        const cleanVal = currentVal.replace("%", "");
+        const number = +cleanVal / 100 || 0;
+        handleChange(number);
+    };
+    return (_jsxs(_Fragment, { children: [_jsx("label", Object.assign({ htmlFor: itemLabel }, { children: itemLabel })), _jsx(NumberField, { id: itemLabel, defaultValue: 0, value: Number.isNaN(val) ? 0 : val, minValue: 0, maxValue: maxValue, formatOptions: {
+                    style: "percent",
+                }, "aria-label": itemLabel, onChange: handleChange, onInput: handleInput })] }));
+};
+//# sourceMappingURL=PercentageItem.js.map

package/dist/esm/components/Chopin/PercentageTotalsQuestion/PercentageItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PercentageItem.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/PercentageTotalsQuestion/PercentageItem.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAoB,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAQhD,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAC7B,SAAS,EACT,YAAY,GAAG,CAAC,EAChB,QAAQ,GACY,EAAE,EAAE;IACxB,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,GAAG,QAAQ,CAAS,CAAC,CAAC,CAAC;IAC1C,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,YAAY,CAAC,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;IAE9D,4DAA4D;IAC5D,MAAM,YAAY,GAAG,CAAC,MAAc,EAAE,EAAE;QACtC,MAAM,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;QAC7C,MAAM,CAAC,SAAS,CAAC,CAAC;QAClB,QAAQ,CAAC,SAAS,CAAC,CAAC;IACtB,CAAC,CAAC;IAEF,MAAM,WAAW,GAAuC,CAAC,CAAC,EAAE;QAC1D,4EAA4E;QAC5E,MAAM,UAAU,GAAW,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QAC1C,MAAM,QAAQ,GAAG,UAAU,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;QAC7C,MAAM,MAAM,GAAG,CAAC,QAAQ,GAAG,GAAG,IAAI,CAAC,CAAC;QACpC,YAAY,CAAC,MAAM,CAAC,CAAC;IACvB,CAAC,CAAC;IAEF,OAAO,CACL,8BACE,8BAAO,OAAO,EAAE,SAAS,gBAAG,SAAS,IAAS,EAC9C,KAAC,WAAW,IACV,EAAE,EAAE,SAAS,EACb,YAAY,EAAE,CAAC,EACf,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,EAClC,QAAQ,EAAE,CAAC,EACX,QAAQ,EAAE,QAAQ,EAClB,aAAa,EAAE;oBACb,KAAK,EAAE,SAAS;iBACjB,gBACW,SAAS,EACrB,QAAQ,EAAE,YAAY,EACtB,OAAO,EAAE,WAAW,GACpB,IACD,CACJ,CAAC;AACJ,CAAC,CAAC"}

package/dist/esm/components/Chopin/PercentageTotalsQuestion/PercentageTotalsQuestion.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { useState } from "react";
+import clsx from "clsx";
+import { Question } from "../Question";
+import { Alert } from "../../Alert";
+import { PercentageItem } from "./PercentageItem";
+// Question expects a field as a child and as such, passes
+// props that break in the DOM (validationState, errorMessage).
+// Create a thin handler to ignore these props FOR NOW
+const Inner = (props) => {
+    const { children } = props;
+    return _jsx("div", Object.assign({ className: "chopin/PercentageTotalsQuestionInner" }, { children: children }));
+};
+const PercentageTotalsQuestion = (props) => {
+    const { alertText, items, label, className } = props;
+    // Create array with same size as items, filled with zeros
+    const [totals, setTotals] = useState(new Array(items.length).fill(0));
+    const total = Math.round(totals.reduce((a, b) => a + b, 0) * 100) / 100;
+    const maxRemainder = Math.round((1 - total) * 100) / 100; // Max that can be set in any other fields
+    const showTotal = Math.floor(total * 100);
+    const handleChange = (index) => (val) => {
+        setTotals(t => {
+            const newTotals = [...t];
+            newTotals[index] = val;
+            return newTotals;
+        });
+    };
+    const classes = clsx("chopin", "chopin/PercentageTotalsQuestion", className);
+    return (_jsx(Question, Object.assign({ label: label, className: classes }, { children: _jsxs(Inner, { children: [alertText && _jsx(Alert, Object.assign({ variant: "warning" }, { children: alertText })), _jsxs("div", Object.assign({ className: "chopin/PercentageTotalsQuestionItems" }, { children: [items.map((itemLabel, index) => (_jsx(PercentageItem, { itemLabel: itemLabel, maxRemainder: maxRemainder, onChange: handleChange(index) }, itemLabel))), _jsx("div", {}), _jsx("div", Object.assign({ className: "chopin/PercentageTotalsQuestionTotal" }, { children: `Total: ${showTotal}%` }))] }))] }) })));
+};
+PercentageTotalsQuestion.displayName = "PercentageTotalsQuestion";
+export { PercentageTotalsQuestion };
+//# sourceMappingURL=PercentageTotalsQuestion.js.map

package/dist/esm/components/Chopin/PercentageTotalsQuestion/PercentageTotalsQuestion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PercentageTotalsQuestion.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/PercentageTotalsQuestion/PercentageTotalsQuestion.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,QAAQ,EAAiB,MAAM,aAAa,CAAC;AACtD,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAUlD,0DAA0D;AAC1D,+DAA+D;AAC/D,sDAAsD;AACtD,MAAM,KAAK,GAAG,CAAC,KAAoB,EAAE,EAAE;IACrC,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC3B,OAAO,4BAAK,SAAS,EAAC,sCAAsC,gBAAE,QAAQ,IAAO,CAAC;AAChF,CAAC,CAAC;AAEF,MAAM,wBAAwB,GAAG,CAAC,KAAoC,EAAE,EAAE;IACxE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IACrD,0DAA0D;IAC1D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAClC,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAChC,CAAC;IACF,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;IAExE,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC,CAAC,0CAA0C;IACpG,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC,CAAC;IAE1C,MAAM,YAAY,GAAG,CAAC,KAAa,EAAE,EAAE,CAAC,CAAC,GAAW,EAAE,EAAE;QACtD,SAAS,CAAC,CAAC,CAAC,EAAE;YACZ,MAAM,SAAS,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;YACzB,SAAS,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC;YACvB,OAAO,SAAS,CAAC;QACnB,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,EAAE,iCAAiC,EAAE,SAAS,CAAC,CAAC;IAE7E,OAAO,CACL,KAAC,QAAQ,kBAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,gBACxC,MAAC,KAAK,eACH,SAAS,IAAI,KAAC,KAAK,kBAAC,OAAO,EAAC,SAAS,gBAAE,SAAS,IAAS,EAC1D,6BAAK,SAAS,EAAC,sCAAsC,iBAClD,KAAK,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,KAAK,EAAE,EAAE,CAAC,CAC/B,KAAC,cAAc,IAEb,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,QAAQ,EAAE,YAAY,CAAC,KAAK,CAAC,IAHxB,SAAS,CAId,CACH,CAAC,EACF,eAAO,EACP,4BAAK,SAAS,EAAC,sCAAsC,gBAClD,UAAU,SAAS,GAAG,IACnB,KACF,IACA,IACC,CACZ,CAAC;AACJ,CAAC,CAAC;AAEF,wBAAwB,CAAC,WAAW,GAAG,0BAA0B,CAAC;AAClE,OAAO,EAAE,wBAAwB,EAAE,CAAC"}

package/dist/esm/components/Chopin/PercentageTotalsQuestion/PercentageTotalsQuestion.test.js

@@ -0,0 +1,108 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { PercentageTotalsQuestion } from ".";
+const LABEL = "How do you split your time across these items?";
+const THREE_ITEMS = ["Item 1", "Item 2", "Item 3"];
+const FIVE_ITEMS = ["Item 1", "Item 2", "Item 3", "Item 4", "Item 5"];
+describe("PercentageTotalsQuestion", () => {
+    it("should render without errors", () => {
+        const label = "This is my custom label";
+        const { container } = render(_jsx(PercentageTotalsQuestion, { label: label, items: THREE_ITEMS }));
+        expect(screen.getByText(label)).toBeInTheDocument();
+        const items = container.getElementsByClassName("mobius/NumberField");
+        expect(items.length).toBe(3);
+    });
+    it("should display custom alert message", () => {
+        const alertText = "This is my alert!";
+        render(_jsx(PercentageTotalsQuestion, { label: LABEL, alertText: alertText, items: FIVE_ITEMS }));
+        expect(screen.getByText(alertText)).toBeInTheDocument();
+    });
+    it("should render a row for every item", () => {
+        const { container } = render(_jsx(PercentageTotalsQuestion, { label: LABEL, items: FIVE_ITEMS }));
+        const items = container.getElementsByClassName("mobius/NumberField");
+        expect(items.length).toBe(5);
+    });
+    describe("Calculations", () => {
+        it("should correctly total the sum of typed item values", async () => {
+            const { getByLabelText } = render(_jsx(PercentageTotalsQuestion, { label: LABEL, items: THREE_ITEMS }));
+            await userEvent.type(getByLabelText("Item 1"), "25");
+            expect(screen.getByText("Total: 25%")).toBeInTheDocument();
+            await userEvent.type(getByLabelText("Item 2"), "37");
+            expect(screen.getByText("Total: 62%")).toBeInTheDocument();
+            await userEvent.type(getByLabelText("Item 3"), "13");
+            expect(screen.getByText("Total: 75%")).toBeInTheDocument();
+        });
+        it("should prevent any typed input that exceeds a total of 100%", async () => {
+            const { getByLabelText } = render(_jsx(PercentageTotalsQuestion, { label: LABEL, items: THREE_ITEMS }));
+            const inputs = THREE_ITEMS.map(i => screen.getByLabelText(i, { selector: "input" }));
+            await userEvent.type(getByLabelText("Item 1"), "123");
+            expect(inputs[0]).toHaveValue("100%");
+            expect(screen.getByText("Total: 100%")).toBeInTheDocument();
+            await userEvent.type(getByLabelText("Item 2"), "37");
+            expect(inputs[1]).toHaveValue("0%");
+            expect(screen.getByText("Total: 100%")).toBeInTheDocument();
+            await userEvent.type(getByLabelText("Item 3"), "13");
+            expect(inputs[2]).toHaveValue("0%");
+            expect(screen.getByText("Total: 100%")).toBeInTheDocument();
+        });
+        it("supports keyboard navigation and up/down arrows to increase/decrease", async () => {
+            const { getByLabelText } = render(_jsx(PercentageTotalsQuestion, { label: LABEL, items: THREE_ITEMS }));
+            const inputs = THREE_ITEMS.map(i => screen.getByLabelText(i, { selector: "input" }));
+            await userEvent.type(getByLabelText("Item 1"), "30");
+            expect(inputs[0]).toHaveValue("30%");
+            expect(screen.getByText("Total: 30%")).toBeInTheDocument();
+            await userEvent.tab(); // Move focus to Item 2
+            await userEvent.keyboard("[ArrowUp]");
+            await userEvent.keyboard("[ArrowUp]");
+            await userEvent.keyboard("[ArrowUp]");
+            expect(inputs[1]).toHaveValue("3%");
+            expect(screen.getByText("Total: 33%")).toBeInTheDocument();
+            await userEvent.keyboard("[ArrowDown]");
+            expect(inputs[1]).toHaveValue("2%");
+            expect(screen.getByText("Total: 32%")).toBeInTheDocument();
+        });
+        it("should prevent changing any initial value above 100", async () => {
+            const { getByLabelText } = render(_jsx(PercentageTotalsQuestion, { label: LABEL, items: THREE_ITEMS }));
+            const inputs = THREE_ITEMS.map(i => screen.getByLabelText(i, { selector: "input" }));
+            await userEvent.type(getByLabelText("Item 1"), "9");
+            expect(inputs[0]).toHaveValue("9%");
+            expect(screen.getByText("Total: 9%")).toBeInTheDocument();
+            await userEvent.type(getByLabelText("Item 1"), "9");
+            expect(inputs[0]).toHaveValue("99%");
+            expect(screen.getByText("Total: 99%")).toBeInTheDocument();
+            await userEvent.type(getByLabelText("Item 1"), "9");
+            expect(inputs[0]).toHaveValue("100%");
+            expect(screen.getByText("Total: 100%")).toBeInTheDocument();
+        });
+        it("should prevent changing any subsequent value above remaining percentage", async () => {
+            const { getByLabelText } = render(_jsx(PercentageTotalsQuestion, { label: LABEL, items: THREE_ITEMS }));
+            const inputs = THREE_ITEMS.map(i => screen.getByLabelText(i, { selector: "input" }));
+            await userEvent.type(getByLabelText("Item 1"), "75");
+            expect(inputs[0]).toHaveValue("75%");
+            expect(screen.getByText("Total: 75%")).toBeInTheDocument();
+            await userEvent.type(getByLabelText("Item 2"), "40");
+            expect(inputs[1]).toHaveValue("25%");
+            expect(screen.getByText("Total: 100%")).toBeInTheDocument();
+        });
+        it("sets maxValue on each item based upon remaining percentage", async () => {
+            const { getByLabelText } = render(_jsx(PercentageTotalsQuestion, { label: LABEL, items: THREE_ITEMS }));
+            const inputs = THREE_ITEMS.map(i => screen.getByLabelText(i, { selector: "input" }));
+            await userEvent.type(getByLabelText("Item 1"), "98");
+            expect(inputs[0]).toHaveValue("98%");
+            expect(screen.getByText("Total: 98%")).toBeInTheDocument();
+            // Click increment button on second item until it is disabled
+            await userEvent.click(getByLabelText(`Increase ${THREE_ITEMS[1]}`));
+            expect(inputs[1]).toHaveValue("1%");
+            expect(screen.getByText("Total: 99%")).toBeInTheDocument();
+            await userEvent.click(getByLabelText(`Increase ${THREE_ITEMS[1]}`));
+            expect(inputs[1]).toHaveValue("2%");
+            expect(screen.getByText("Total: 100%")).toBeInTheDocument();
+            // All increase buttons should be disabled
+            expect(getByLabelText(`Increase ${THREE_ITEMS[0]}`)).toBeDisabled();
+            expect(getByLabelText(`Increase ${THREE_ITEMS[1]}`)).toBeDisabled();
+            expect(getByLabelText(`Increase ${THREE_ITEMS[2]}`)).toBeDisabled();
+        });
+    });
+});
+//# sourceMappingURL=PercentageTotalsQuestion.test.js.map

package/dist/esm/components/Chopin/PercentageTotalsQuestion/PercentageTotalsQuestion.test.js.map

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

package/dist/esm/components/Chopin/PercentageTotalsQuestion/index.js

@@ -0,0 +1,2 @@
+export * from "./PercentageTotalsQuestion";
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Chopin/PercentageTotalsQuestion/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/PercentageTotalsQuestion/index.tsx"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC"}

package/dist/esm/components/Chopin/Question/Question.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { Children, cloneElement, isValidElement, useState, } from "react";
+import clsx from "clsx";
+import { useId } from "@react-aria/utils";
+import { useBreakpoint } from "../../../hooks";
+import { Label } from "../../Label";
+import { Text } from "../../Text";
+import { QuestionHelp } from "../QuestionHelp/QuestionHelp";
+export function Question({ label, description, children, errorMessage, validationState, help, className, }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const labelId = useId();
+    const descriptionId = useId();
+    const forAttr = useId();
+    const { up } = useBreakpoint();
+    const isDesktop = up("md");
+    const classes = clsx("chopin", "chopin/Question", {
+        "--has-help-open": isOpen,
+    }, isDesktop ? "--is-desktop" : "", className);
+    const handleChange = (state) => {
+        setIsOpen(state);
+    };
+    // Allow for rich html descriptions
+    const DescriptionComponent = isValidElement(description) ? "div" : Text;
+    const labelClasses = clsx("chopin/QuestionLabel", {
+        "--is-valid": validationState === "valid",
+        "--is-invalid": validationState === "invalid",
+    });
+    return (_jsxs("div", Object.assign({ className: classes }, { children: [_jsx(Label, Object.assign({ htmlFor: forAttr, id: labelId, className: labelClasses }, { children: label })), help && (_jsx(QuestionHelp, Object.assign({ onChange: handleChange, isDesktop: isDesktop }, { children: help }))), description && (_jsx(DescriptionComponent, Object.assign({ id: descriptionId, className: "chopin/QuestionDescription" }, { children: description }))), Children.map(children, child => isValidElement(child)
+                ? cloneElement(child, {
+                    errorMessage,
+                    validationState,
+                    id: forAttr,
+                    "aria-labelledby": labelId,
+                    "aria-describedby": description ? descriptionId : undefined,
+                })
+                : child)] })));
+}
+//# sourceMappingURL=Question.js.map

package/dist/esm/components/Chopin/Question/Question.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Question.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Question/Question.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,QAAQ,EACR,YAAY,EACZ,cAAc,EAEd,QAAQ,GAET,MAAM,OAAO,CAAC;AACf,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAY5D,MAAM,UAAU,QAAQ,CAAC,EACvB,KAAK,EACL,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,eAAe,EACf,IAAI,EACJ,SAAS,GACK;IACd,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,OAAO,GAAG,KAAK,EAAE,CAAC;IACxB,MAAM,aAAa,GAAG,KAAK,EAAE,CAAC;IAC9B,MAAM,OAAO,GAAG,KAAK,EAAE,CAAC;IACxB,MAAM,EAAE,EAAE,EAAE,GAAG,aAAa,EAAE,CAAC;IAC/B,MAAM,SAAS,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC;IAE3B,MAAM,OAAO,GAAG,IAAI,CAClB,QAAQ,EACR,iBAAiB,EACjB;QACE,iBAAiB,EAAE,MAAM;KAC1B,EACD,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,EAC/B,SAAS,CACV,CAAC;IAEF,MAAM,YAAY,GAAG,CAAC,KAAc,EAAE,EAAE;QACtC,SAAS,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC,CAAC;IAEF,mCAAmC;IACnC,MAAM,oBAAoB,GAAG,cAAc,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;IAExE,MAAM,YAAY,GAAG,IAAI,CAAC,sBAAsB,EAAE;QAChD,YAAY,EAAE,eAAe,KAAK,OAAO;QACzC,cAAc,EAAE,eAAe,KAAK,SAAS;KAC9C,CAAC,CAAC;IAEH,OAAO,CACL,6BAAK,SAAS,EAAE,OAAO,iBACrB,KAAC,KAAK,kBAAC,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,YAAY,gBAC1D,KAAK,IACA,EACP,IAAI,IAAI,CACP,KAAC,YAAY,kBAAC,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS,gBACvD,IAAI,IACQ,CAChB,EACA,WAAW,IAAI,CACd,KAAC,oBAAoB,kBACnB,EAAE,EAAE,aAAa,EACjB,SAAS,EAAC,4BAA4B,gBAErC,WAAW,IACS,CACxB,EACA,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE,CAC9B,cAAc,CAAC,KAAK,CAAC;gBACnB,CAAC,CAAC,YAAY,CAAC,KAAK,EAAE;oBAClB,YAAY;oBACZ,eAAe;oBACf,EAAE,EAAE,OAAO;oBACX,iBAAiB,EAAE,OAAO;oBAC1B,kBAAkB,EAAE,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS;iBACrD,CAAC;gBACX,CAAC,CAAC,KAAK,CACV,KACG,CACP,CAAC;AACJ,CAAC"}

package/dist/esm/components/Chopin/Question/Question.test.js

@@ -0,0 +1,78 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { render, screen, fireEvent } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { matchers } from "@emotion/jest";
+import { Question } from ".";
+import { TextField } from "../../TextField";
+const WRAPPER_CLASS_NAME = "chopin/Question";
+expect.extend(matchers);
+describe("Question", () => {
+    it("should render without error", () => {
+        const component = render(_jsx(Question, Object.assign({ label: "Question" }, { children: _jsx(TextField, {}) })));
+        expect(component).toBeTruthy();
+    });
+    it("should include accessible description", () => {
+        render(_jsx(Question, Object.assign({ label: "Question", description: "Sample description" }, { children: _jsx(TextField, {}) })));
+        expect(screen.getByLabelText("Question")).toHaveAccessibleDescription("Sample description");
+    });
+    it("should include `id` that matches `for` attribute in `<label>`", () => {
+        render(_jsx(Question, Object.assign({ label: "Question", description: "Sample description" }, { children: _jsx(TextField, {}) })));
+        const label = screen.getByLabelText("Question");
+        const input = screen.getByRole("textbox");
+        expect(label.id).toEqual(input.id);
+    });
+    it("should include accessible description with error", () => {
+        render(_jsx(Question, Object.assign({ label: "Question", description: "Sample description", errorMessage: "Sample error" }, { children: _jsx(TextField, {}) })));
+        expect(screen.getByLabelText("Question")).toHaveAccessibleDescription("Sample error Sample description");
+    });
+    describe("uses correct Question class name", () => {
+        it("uses chopin class", () => {
+            const { container } = render(_jsx(Question, Object.assign({ label: "Question" }, { children: _jsx(TextField, {}) })));
+            expect(container.firstChild).toHaveClass(WRAPPER_CLASS_NAME);
+        });
+        it("includes valid class name", () => {
+            render(_jsx(Question, Object.assign({ label: "Question", validationState: "valid" }, { children: _jsx(TextField, {}) })));
+            expect(screen.getByLabelText("Question")).toHaveClass("--is-valid");
+        });
+        it("includes invalid class name", () => {
+            render(_jsx(Question, Object.assign({ label: "Question", validationState: "invalid", errorMessage: "There is a problem" }, { children: _jsx(TextField, {}) })));
+            expect(screen.getByLabelText("Question")).toHaveClass("--is-invalid");
+        });
+        it("includes custom class name", () => {
+            const { container } = render(_jsx(Question, Object.assign({ label: "Question", validationState: "invalid", errorMessage: "There is a problem", className: "custom-class" }, { children: _jsx(TextField, {}) })));
+            expect(container.firstChild).toHaveClass("custom-class");
+        });
+        it("includes open help class name when toggled", () => {
+            const { container } = render(_jsx(Question, Object.assign({ label: "Question", help: "Help text" }, { children: _jsx(TextField, {}) })));
+            const helpToggle = screen.getByRole("button");
+            fireEvent.click(helpToggle);
+            expect(container.firstChild).toHaveClass("--has-help-open");
+        });
+    });
+    describe("Help", () => {
+        it("should be mouse accessible", async () => {
+            render(_jsx(Question, Object.assign({ label: "Question", help: "This is a help message" }, { children: _jsx(TextField, {}) })));
+            await userEvent.click(screen.getByRole("button", { name: "Open Help" }));
+            expect(screen.queryByRole("tooltip")).toBeInTheDocument();
+            await userEvent.click(screen.getByRole("button", { name: "Close Help" }));
+            expect(screen.queryByRole("tooltip")).not.toBeInTheDocument();
+        });
+        it("should be keyboard accessible", async () => {
+            render(_jsx(Question, Object.assign({ label: "Question", help: "This is a help message" }, { children: _jsx(TextField, {}) })));
+            await userEvent.tab();
+            await userEvent.keyboard("{enter}");
+            expect(screen.queryByRole("tooltip")).toBeInTheDocument();
+            await userEvent.keyboard("{enter}");
+            expect(screen.queryByRole("tooltip")).not.toBeInTheDocument();
+        });
+        it("should close on escape key", async () => {
+            render(_jsx(Question, Object.assign({ label: "Question", help: "This is a help message" }, { children: _jsx(TextField, {}) })));
+            await userEvent.tab();
+            await userEvent.keyboard("{enter}");
+            expect(screen.queryByRole("tooltip")).toBeInTheDocument();
+            await userEvent.keyboard("{escape}");
+            expect(screen.queryByRole("tooltip")).not.toBeInTheDocument();
+        });
+    });
+});
+//# sourceMappingURL=Question.test.js.map

package/dist/esm/components/Chopin/Question/Question.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Question.test.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Question/Question.test.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnE,OAAO,SAAS,MAAM,6BAA6B,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,GAAG,CAAC;AAC7B,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C,MAAM,kBAAkB,GAAG,iBAAiB,CAAC;AAE7C,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;AAExB,QAAQ,CAAC,UAAU,EAAE,GAAG,EAAE;IACxB,EAAE,CAAC,6BAA6B,EAAE,GAAG,EAAE;QACrC,MAAM,SAAS,GAAG,MAAM,CACtB,KAAC,QAAQ,kBAAC,KAAK,EAAC,UAAU,gBACxB,KAAC,SAAS,KAAG,IACJ,CACZ,CAAC;QACF,MAAM,CAAC,SAAS,CAAC,CAAC,UAAU,EAAE,CAAC;IACjC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,uCAAuC,EAAE,GAAG,EAAE;QAC/C,MAAM,CACJ,KAAC,QAAQ,kBAAC,KAAK,EAAC,UAAU,EAAC,WAAW,EAAC,oBAAoB,gBACzD,KAAC,SAAS,KAAG,IACJ,CACZ,CAAC;QACF,MAAM,CAAC,MAAM,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,CAAC,2BAA2B,CACnE,oBAAoB,CACrB,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,+DAA+D,EAAE,GAAG,EAAE;QACvE,MAAM,CACJ,KAAC,QAAQ,kBAAC,KAAK,EAAC,UAAU,EAAC,WAAW,EAAC,oBAAoB,gBACzD,KAAC,SAAS,KAAG,IACJ,CACZ,CAAC;QAEF,MAAM,KAAK,GAAG,MAAM,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC;QAChD,MAAM,KAAK,GAAG,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;QAE1C,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACrC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,kDAAkD,EAAE,GAAG,EAAE;QAC1D,MAAM,CACJ,KAAC,QAAQ,kBACP,KAAK,EAAC,UAAU,EAChB,WAAW,EAAC,oBAAoB,EAChC,YAAY,EAAC,cAAc,gBAE3B,KAAC,SAAS,KAAG,IACJ,CACZ,CAAC;QACF,MAAM,CAAC,MAAM,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,CAAC,2BAA2B,CACnE,iCAAiC,CAClC,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,QAAQ,CAAC,kCAAkC,EAAE,GAAG,EAAE;QAChD,EAAE,CAAC,mBAAmB,EAAE,GAAG,EAAE;YAC3B,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,KAAC,QAAQ,kBAAC,KAAK,EAAC,UAAU,gBACxB,KAAC,SAAS,KAAG,IACJ,CACZ,CAAC;YACF,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC,kBAAkB,CAAC,CAAC;QAC/D,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,2BAA2B,EAAE,GAAG,EAAE;YACnC,MAAM,CACJ,KAAC,QAAQ,kBAAC,KAAK,EAAC,UAAU,EAAC,eAAe,EAAC,OAAO,gBAChD,KAAC,SAAS,KAAG,IACJ,CACZ,CAAC;YACF,MAAM,CAAC,MAAM,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC;QACtE,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,6BAA6B,EAAE,GAAG,EAAE;YACrC,MAAM,CACJ,KAAC,QAAQ,kBACP,KAAK,EAAC,UAAU,EAChB,eAAe,EAAC,SAAS,EACzB,YAAY,EAAC,oBAAoB,gBAEjC,KAAC,SAAS,KAAG,IACJ,CACZ,CAAC;YACF,MAAM,CAAC,MAAM,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;QACxE,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,4BAA4B,EAAE,GAAG,EAAE;YACpC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,KAAC,QAAQ,kBACP,KAAK,EAAC,UAAU,EAChB,eAAe,EAAC,SAAS,EACzB,YAAY,EAAC,oBAAoB,EACjC,SAAS,EAAC,cAAc,gBAExB,KAAC,SAAS,KAAG,IACJ,CACZ,CAAC;YAEF,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;QAC3D,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,4CAA4C,EAAE,GAAG,EAAE;YACpD,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,KAAC,QAAQ,kBAAC,KAAK,EAAC,UAAU,EAAC,IAAI,EAAC,WAAW,gBACzC,KAAC,SAAS,KAAG,IACJ,CACZ,CAAC;YAEF,MAAM,UAAU,GAAG,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;YAE9C,SAAS,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;YAE5B,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;QAC9D,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,QAAQ,CAAC,MAAM,EAAE,GAAG,EAAE;QACpB,EAAE,CAAC,4BAA4B,EAAE,KAAK,IAAI,EAAE;YAC1C,MAAM,CACJ,KAAC,QAAQ,kBAAC,KAAK,EAAC,UAAU,EAAC,IAAI,EAAC,wBAAwB,gBACtD,KAAC,SAAS,KAAG,IACJ,CACZ,CAAC;YACF,MAAM,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,CAAC,CAAC;YACzE,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;YAC1D,MAAM,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC;YAC1E,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,iBAAiB,EAAE,CAAC;QAChE,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,+BAA+B,EAAE,KAAK,IAAI,EAAE;YAC7C,MAAM,CACJ,KAAC,QAAQ,kBAAC,KAAK,EAAC,UAAU,EAAC,IAAI,EAAC,wBAAwB,gBACtD,KAAC,SAAS,KAAG,IACJ,CACZ,CAAC;YACF,MAAM,SAAS,CAAC,GAAG,EAAE,CAAC;YACtB,MAAM,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;YACpC,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;YAC1D,MAAM,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;YACpC,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,iBAAiB,EAAE,CAAC;QAChE,CAAC,CAAC,CAAC;QAEH,EAAE,CAAC,4BAA4B,EAAE,KAAK,IAAI,EAAE;YAC1C,MAAM,CACJ,KAAC,QAAQ,kBAAC,KAAK,EAAC,UAAU,EAAC,IAAI,EAAC,wBAAwB,gBACtD,KAAC,SAAS,KAAG,IACJ,CACZ,CAAC;YACF,MAAM,SAAS,CAAC,GAAG,EAAE,CAAC;YACtB,MAAM,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;YACpC,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;YAC1D,MAAM,SAAS,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC;YACrC,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,iBAAiB,EAAE,CAAC;QAChE,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/esm/components/Chopin/Question/index.js

@@ -0,0 +1,2 @@
+export * from "./Question";
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Chopin/Question/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/Question/index.tsx"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}

package/dist/esm/components/Chopin/QuestionGroup/QuestionGroup.js

@@ -0,0 +1,36 @@
+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;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { forwardRef, Children, isValidElement, cloneElement, } from "react";
+import { useId } from "@react-aria/utils";
+import clsx from "clsx";
+import { useBreakpoint } from "../../../hooks";
+import { QuestionHelp } from "../QuestionHelp/QuestionHelp";
+import { Label } from "../../Label";
+const QuestionGroup = forwardRef((props, ref) => {
+    const { elementType: Element = "div", label, children, help } = props, otherProps = __rest(props, ["elementType", "label", "children", "help"]);
+    const labelId = useId();
+    const { up } = useBreakpoint();
+    const isDesktop = up("md");
+    const classes = clsx("chopin/QuestionGroup", isDesktop ? "--is-desktop" : "", otherProps.className);
+    return (_jsxs(Element, Object.assign({ ref: ref }, otherProps, { className: classes }, { children: [_jsxs("header", Object.assign({ className: "chopin/QuestionGroupHeader" }, { children: [_jsx(Label, Object.assign({ htmlFor: "question-group", id: labelId, className: "chopin/QuestionGroupLabel" }, { children: label })), help && _jsx(QuestionHelp, Object.assign({ isDesktop: isDesktop }, { children: help }))] })), _jsx("ul", Object.assign({ className: "chopin/QuestionGroupList" }, { children: Children.map(children, child => {
+                    if (isValidElement(child)) {
+                        return (_jsx("li", Object.assign({ className: "chopin/QuestionGroupItem" }, { children: cloneElement(child, {
+                                className: "chopin/QuestionGroupQuestion",
+                            }) })));
+                    }
+                    return child;
+                }) }))] })));
+});
+QuestionGroup.displayName = "QuestionGroup";
+export { QuestionGroup };
+//# sourceMappingURL=QuestionGroup.js.map

package/dist/esm/components/Chopin/QuestionGroup/QuestionGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"QuestionGroup.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/QuestionGroup/QuestionGroup.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAEL,UAAU,EAGV,QAAQ,EACR,cAAc,EACd,YAAY,GACb,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAC5D,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAkBpC,MAAM,aAAa,GAGf,UAAU,CAAC,CAAC,KAAyB,EAAE,GAAqB,EAAE,EAAE;IAClE,MAAM,EACJ,WAAW,EAAE,OAAO,GAAG,KAAK,EAC5B,KAAK,EACL,QAAQ,EACR,IAAI,KAEF,KAAK,EADJ,UAAU,UACX,KAAK,EANH,4CAML,CAAQ,CAAC;IACV,MAAM,OAAO,GAAG,KAAK,EAAE,CAAC;IACxB,MAAM,EAAE,EAAE,EAAE,GAAG,aAAa,EAAE,CAAC;IAC/B,MAAM,SAAS,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC;IAE3B,MAAM,OAAO,GAAG,IAAI,CAClB,sBAAsB,EACtB,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,EAC/B,UAAU,CAAC,SAAS,CACrB,CAAC;IAEF,OAAO,CACL,MAAC,OAAO,kBAAC,GAAG,EAAE,GAAG,IAAM,UAAU,IAAE,SAAS,EAAE,OAAO,iBACnD,gCAAQ,SAAS,EAAC,4BAA4B,iBAC5C,KAAC,KAAK,kBACJ,OAAO,EAAC,gBAAgB,EACxB,EAAE,EAAE,OAAO,EACX,SAAS,EAAC,2BAA2B,gBAEpC,KAAK,IACA,EACP,IAAI,IAAI,KAAC,YAAY,kBAAC,SAAS,EAAE,SAAS,gBAAG,IAAI,IAAgB,KAC3D,EACT,2BAAI,SAAS,EAAC,0BAA0B,gBACrC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE;oBAC9B,IAAI,cAAc,CAAC,KAAK,CAAC,EAAE;wBACzB,OAAO,CACL,2BAAI,SAAS,EAAC,0BAA0B,gBACrC,YAAY,CAAC,KAAK,EAAE;gCACnB,SAAS,EAAE,8BAA8B;6BACnC,CAAC,IACN,CACN,CAAC;qBACH;oBAED,OAAO,KAAK,CAAC;gBACf,CAAC,CAAC,IACC,KACG,CACX,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,CAAC"}