@simplybusiness/mobius 3.3.1 → 3.4.0

package/dist/cjs/components/Chopin/TradeSelector/types.d.ts

@@ -1,5 +1,9 @@
 import { Ref, RefAttributes } from "react";
 import { DOMProps } from "@react-types/shared";
+export type DialogRef = HTMLDialogElement;
+export type InputRef = HTMLInputElement;
+export type TradeSelectorSearchScope = "all_verticals" | "current_and_supported_verticals" | "current_vertical" | "except_current_vertical" | "usa_contractors" | "commercial_landlord_business_types" | "contractors_combined" | "supported_for_current_vertical" | "commercial_combined_manufacturer" | "commercial_combined_wholesaler" | "commercial_combined_all";
+export type TradeSelectorVertical = string;
 export type TradeProps = {
     value: string;
     vertical: string;
@@ -10,11 +14,6 @@ export type TradeProps = {
     trade_type: string | null;
     blocked: boolean;
 };
-export type GroupedTradeProps = {
-    name: string;
-    title: string;
-    children: TradeProps[];
-};
 export type LabelProps = {
     input: string;
     exact: string;
@@ -35,12 +34,15 @@ export type TradeSelectorCommonProps = {
     urls: UrlProps;
     onTradeSelected?: (trade: TradeProps | string) => void;
     initialTrade?: string;
+    vertical?: TradeSelectorVertical;
+    searchScope?: TradeSelectorSearchScope;
 };
 export type TradeSelectorElementType = HTMLDivElement;
 export interface TradeSelectorProps extends Partial<TradeSelectorCommonProps>, DOMProps, RefAttributes<TradeSelectorElementType> {
     /** Custom class name for setting specific CSS */
     className?: string;
     elementType?: string | React.ElementType;
+    onTradeSelected?: (trade: TradeProps | string) => void;
     labels?: LabelProps;
     hideLabel?: boolean;
 }

package/dist/cjs/components/Chopin/TradeSelector/useFetchTrades/index.d.ts

@@ -0,0 +1 @@
+export * from "./useFetchTrades";

package/dist/cjs/components/Chopin/TradeSelector/{SelectedTrade → useFetchTrades}/index.js

@@ -14,5 +14,5 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./SelectedTrade"), exports);
+__exportStar(require("./useFetchTrades"), exports);
 //# sourceMappingURL=index.js.map

package/dist/cjs/components/Chopin/TradeSelector/useFetchTrades/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/Chopin/TradeSelector/useFetchTrades/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,mDAAiC"}

package/dist/cjs/components/Chopin/TradeSelector/useFetchTrades/useFetchTrades.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { TradeProps } from "../types";
+export declare const useFetchTrades: (endpoint: URL, debounceInMs: number) => {
+    isLoading: boolean;
+    error: Error | null;
+    trades: TradeProps[] | null;
+    fetchTrades: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+};

package/dist/cjs/components/Chopin/TradeSelector/useFetchTrades/useFetchTrades.js

@@ -0,0 +1,62 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFetchTrades = void 0;
+const react_1 = require("react");
+const lodash_debounce_1 = __importDefault(require("lodash.debounce"));
+const useFetchTrades = (endpoint, debounceInMs) => {
+    const [isLoading, setIsLoading] = (0, react_1.useState)(false);
+    const [error, setError] = (0, react_1.useState)(null);
+    const [trades, setTrades] = (0, react_1.useState)(null);
+    const [fetchTrades, setFetchTrades] = (0, react_1.useState)(false);
+    const getTrades = (0, react_1.useCallback)(
+    // eslint-disable-next-line consistent-return
+    async (signal) => {
+        try {
+            const response = await fetch(endpoint, {
+                signal,
+            });
+            const json = await response.json();
+            setIsLoading(false);
+            if (!response.ok) {
+                throw new Error(json.message || json.statusText);
+            }
+            setError(null);
+            return setTrades(json.results);
+        }
+        catch (err) {
+            if (err instanceof Error && err.name !== "AbortError") {
+                // eslint-disable-next-line no-console
+                console.error(err);
+                setError(err);
+            }
+        }
+    }, [endpoint]);
+    (0, react_1.useEffect)(() => {
+        const controller = new AbortController();
+        if (fetchTrades) {
+            setIsLoading(true);
+            const fetchData = (0, lodash_debounce_1.default)(async () => {
+                const { signal } = controller;
+                await getTrades(signal);
+            }, debounceInMs);
+            fetchData();
+        }
+        return () => controller.abort();
+    }, [getTrades, debounceInMs, fetchTrades]);
+    (0, react_1.useEffect)(() => {
+        if (!isLoading) {
+            setFetchTrades(false);
+        }
+    }, [isLoading]);
+    return {
+        isLoading,
+        error,
+        trades,
+        fetchTrades: setFetchTrades,
+    };
+};
+exports.useFetchTrades = useFetchTrades;
+//# sourceMappingURL=useFetchTrades.js.map

package/dist/cjs/components/Chopin/TradeSelector/useFetchTrades/useFetchTrades.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFetchTrades.js","sourceRoot":"","sources":["../../../../../../src/components/Chopin/TradeSelector/useFetchTrades/useFetchTrades.ts"],"names":[],"mappings":";;;;;;AAAA,iCAAyD;AACzD,sEAAuC;AAGhC,MAAM,cAAc,GAAG,CAAC,QAAa,EAAE,YAAoB,EAAE,EAAE;IACpE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAU,KAAK,CAAC,CAAC;IAC3D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAe,IAAI,CAAC,CAAC;IACvD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAsB,IAAI,CAAC,CAAC;IAChE,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,IAAA,gBAAQ,EAAU,KAAK,CAAC,CAAC;IAE/D,MAAM,SAAS,GAAG,IAAA,mBAAW;IAC3B,6CAA6C;IAC7C,KAAK,EAAE,MAAmB,EAAE,EAAE;QAC5B,IAAI;YACF,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,QAAQ,EAAE;gBACrC,MAAM;aACP,CAAC,CAAC;YACH,MAAM,IAAI,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;YACnC,YAAY,CAAC,KAAK,CAAC,CAAC;YAEpB,IAAI,CAAC,QAAQ,CAAC,EAAE,EAAE;gBAChB,MAAM,IAAI,KAAK,CAAC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,UAAU,CAAC,CAAC;aAClD;YAED,QAAQ,CAAC,IAAI,CAAC,CAAC;YACf,OAAO,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;SAChC;QAAC,OAAO,GAAG,EAAE;YACZ,IAAI,GAAG,YAAY,KAAK,IAAI,GAAG,CAAC,IAAI,KAAK,YAAY,EAAE;gBACrD,sCAAsC;gBACtC,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;gBACnB,QAAQ,CAAC,GAAG,CAAC,CAAC;aACf;SACF;IACH,CAAC,EACD,CAAC,QAAQ,CAAC,CACX,CAAC;IAEF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,UAAU,GAAG,IAAI,eAAe,EAAE,CAAC;QAEzC,IAAI,WAAW,EAAE;YACf,YAAY,CAAC,IAAI,CAAC,CAAC;YAEnB,MAAM,SAAS,GAAG,IAAA,yBAAQ,EAAC,KAAK,IAAI,EAAE;gBACpC,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC;gBAC9B,MAAM,SAAS,CAAC,MAAM,CAAC,CAAC;YAC1B,CAAC,EAAE,YAAY,CAAC,CAAC;YAEjB,SAAS,EAAE,CAAC;SACb;QAED,OAAO,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;IAClC,CAAC,EAAE,CAAC,SAAS,EAAE,YAAY,EAAE,WAAW,CAAC,CAAC,CAAC;IAE3C,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,SAAS,EAAE;YACd,cAAc,CAAC,KAAK,CAAC,CAAC;SACvB;IACH,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,OAAO;QACL,SAAS;QACT,KAAK;QACL,MAAM;QACN,WAAW,EAAE,cAAc;KAC5B,CAAC;AACJ,CAAC,CAAC;AA9DW,QAAA,cAAc,kBA8DzB"}

package/dist/cjs/components/Chopin/TradeSelector/useTradeSelectorUrl/index.d.ts

@@ -0,0 +1 @@
+export * from "./useTradeSelectorUrl";

package/dist/cjs/components/Chopin/TradeSelector/useTradeSelectorUrl/index.js

@@ -0,0 +1,18 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./useTradeSelectorUrl"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Chopin/TradeSelector/{useTradeSelector → useTradeSelectorUrl}/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/Chopin/TradeSelector/useTradeSelector/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,qDAAmC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/Chopin/TradeSelector/useTradeSelectorUrl/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,wDAAsC"}

package/dist/cjs/components/Chopin/TradeSelector/useTradeSelectorUrl/useTradeSelectorUrl.d.ts

@@ -0,0 +1,6 @@
+export type TradeSelectorUrlOptions = {
+    vertical?: string;
+    searchScope?: string;
+    site?: string;
+};
+export declare function useTradeSelectorUrl(tradeApi: string, userInput: string, { vertical, searchScope, site }?: TradeSelectorUrlOptions): URL;

package/dist/cjs/components/Chopin/TradeSelector/useTradeSelectorUrl/useTradeSelectorUrl.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTradeSelectorUrl = void 0;
+const react_1 = require("react");
+function addQueryParam(url, key, value) {
+    if (value)
+        url.searchParams.set(key, value);
+}
+function useTradeSelectorUrl(tradeApi, userInput, { vertical, searchScope, site } = {}) {
+    return (0, react_1.useMemo)(() => {
+        const url = new URL(tradeApi);
+        addQueryParam(url, "q", userInput);
+        addQueryParam(url, "vertical", vertical);
+        addQueryParam(url, "search_scope", searchScope);
+        addQueryParam(url, "site", site);
+        return url;
+    }, [tradeApi, userInput, vertical, searchScope, site]);
+}
+exports.useTradeSelectorUrl = useTradeSelectorUrl;
+//# sourceMappingURL=useTradeSelectorUrl.js.map

package/dist/cjs/components/Chopin/TradeSelector/useTradeSelectorUrl/useTradeSelectorUrl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTradeSelectorUrl.js","sourceRoot":"","sources":["../../../../../../src/components/Chopin/TradeSelector/useTradeSelectorUrl/useTradeSelectorUrl.ts"],"names":[],"mappings":";;;AAAA,iCAAgC;AAQhC,SAAS,aAAa,CAAC,GAAQ,EAAE,GAAW,EAAE,KAAc;IAC1D,IAAI,KAAK;QAAE,GAAG,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;AAC9C,CAAC;AAED,SAAgB,mBAAmB,CACjC,QAAgB,EAChB,SAAiB,EACjB,EAAE,QAAQ,EAAE,WAAW,EAAE,IAAI,KAA8B,EAAE;IAE7D,OAAO,IAAA,eAAO,EAAC,GAAG,EAAE;QAClB,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,QAAQ,CAAC,CAAC;QAC9B,aAAa,CAAC,GAAG,EAAE,GAAG,EAAE,SAAS,CAAC,CAAC;QACnC,aAAa,CAAC,GAAG,EAAE,UAAU,EAAE,QAAQ,CAAC,CAAC;QACzC,aAAa,CAAC,GAAG,EAAE,cAAc,EAAE,WAAW,CAAC,CAAC;QAChD,aAAa,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,CAAC,CAAC;QACjC,OAAO,GAAG,CAAC;IACb,CAAC,EAAE,CAAC,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,EAAE,IAAI,CAAC,CAAC,CAAC;AACzD,CAAC;AAbD,kDAaC"}

package/dist/cjs/components/Chopin/TradeSelector/useTradeSelectorUrl/useTradeSelectorUrl.test.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("@testing-library/react");
+const useTradeSelectorUrl_1 = require("./useTradeSelectorUrl");
+describe("useTradeSelectorUrl", () => {
+    it("should return a url", () => {
+        const { result } = (0, react_1.renderHook)(() => (0, useTradeSelectorUrl_1.useTradeSelectorUrl)("https://trade-api.example.com/search", "foo"));
+        expect(result.current).toBeInstanceOf(URL);
+    });
+    it("should return a url with the correct query params", () => {
+        const { result } = (0, react_1.renderHook)(() => (0, useTradeSelectorUrl_1.useTradeSelectorUrl)("https://trade-api.example.com/search", "foo", {
+            vertical: "bar",
+            searchScope: "baz",
+        }));
+        expect(result.current.searchParams.get("q")).toEqual("foo");
+        expect(result.current.searchParams.get("vertical")).toEqual("bar");
+        expect(result.current.searchParams.get("search_scope")).toEqual("baz");
+    });
+    it("should return a new url when the input changes", () => {
+        const { result, rerender } = (0, react_1.renderHook)(({ userInput }) => (0, useTradeSelectorUrl_1.useTradeSelectorUrl)("https://trade-api.example.com/search", userInput), {
+            initialProps: { userInput: "foo" },
+        });
+        const firstUrl = result.current;
+        rerender({ userInput: "bar" });
+        const secondUrl = result.current;
+        expect(firstUrl).not.toEqual(secondUrl);
+    });
+});
+//# sourceMappingURL=useTradeSelectorUrl.test.js.map

package/dist/cjs/components/Chopin/TradeSelector/useTradeSelectorUrl/useTradeSelectorUrl.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTradeSelectorUrl.test.js","sourceRoot":"","sources":["../../../../../../src/components/Chopin/TradeSelector/useTradeSelectorUrl/useTradeSelectorUrl.test.ts"],"names":[],"mappings":";;AAAA,kDAAoD;AACpD,+DAA4D;AAE5D,QAAQ,CAAC,qBAAqB,EAAE,GAAG,EAAE;IACnC,EAAE,CAAC,qBAAqB,EAAE,GAAG,EAAE;QAC7B,MAAM,EAAE,MAAM,EAAE,GAAG,IAAA,kBAAU,EAAC,GAAG,EAAE,CACjC,IAAA,yCAAmB,EAAC,sCAAsC,EAAE,KAAK,CAAC,CACnE,CAAC;QACF,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;IAC7C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,mDAAmD,EAAE,GAAG,EAAE;QAC3D,MAAM,EAAE,MAAM,EAAE,GAAG,IAAA,kBAAU,EAAC,GAAG,EAAE,CACjC,IAAA,yCAAmB,EAAC,sCAAsC,EAAE,KAAK,EAAE;YACjE,QAAQ,EAAE,KAAK;YACf,WAAW,EAAE,KAAK;SACnB,CAAC,CACH,CAAC;QACF,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QAC5D,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,YAAY,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QACnE,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,YAAY,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IACzE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,gDAAgD,EAAE,GAAG,EAAE;QACxD,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAA,kBAAU,EACrC,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,CAChB,IAAA,yCAAmB,EAAC,sCAAsC,EAAE,SAAS,CAAC,EACxE;YACE,YAAY,EAAE,EAAE,SAAS,EAAE,KAAK,EAAE;SACnC,CACF,CAAC;QACF,MAAM,QAAQ,GAAG,MAAM,CAAC,OAAO,CAAC;QAChC,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,CAAC;QAC/B,MAAM,SAAS,GAAG,MAAM,CAAC,OAAO,CAAC;QACjC,MAAM,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;IAC1C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/cjs/components/Chopin/index.d.ts

@@ -1,10 +1,10 @@
+export * from "./Actions";
+export * from "./Footer";
+export * from "./Header";
 export * from "./PercentageTotalsQuestion";
 export * from "./Question";
 export * from "./QuestionGroup";
-export * from "./Steps";
 export * from "./Section";
-export * from "./TradeSelector";
-export * from "./Footer";
-export * from "./Header";
-export * from "./Actions";
+export * from "./Steps";
 export * from "./Testimonial";
+export * from "./TradeSelector";

package/dist/cjs/components/Chopin/index.js

@@ -14,14 +14,14 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Actions"), exports);
+__exportStar(require("./Footer"), exports);
+__exportStar(require("./Header"), exports);
 __exportStar(require("./PercentageTotalsQuestion"), exports);
 __exportStar(require("./Question"), exports);
 __exportStar(require("./QuestionGroup"), exports);
-__exportStar(require("./Steps"), exports);
 __exportStar(require("./Section"), exports);
-__exportStar(require("./TradeSelector"), exports);
-__exportStar(require("./Footer"), exports);
-__exportStar(require("./Header"), exports);
-__exportStar(require("./Actions"), exports);
+__exportStar(require("./Steps"), exports);
 __exportStar(require("./Testimonial"), exports);
+__exportStar(require("./TradeSelector"), exports);
 //# sourceMappingURL=index.js.map

package/dist/cjs/components/Chopin/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Chopin/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,6DAA2C;AAC3C,6CAA2B;AAC3B,kDAAgC;AAChC,0CAAwB;AACxB,4CAA0B;AAC1B,kDAAgC;AAChC,2CAAyB;AACzB,2CAAyB;AACzB,4CAA0B;AAC1B,gDAA8B"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Chopin/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,4CAA0B;AAC1B,2CAAyB;AACzB,2CAAyB;AACzB,6DAA2C;AAC3C,6CAA2B;AAC3B,kDAAgC;AAChC,4CAA0B;AAC1B,0CAAwB;AACxB,gDAA8B;AAC9B,kDAAgC"}

package/dist/cjs/components/PasswordField/PasswordField.js

@@ -26,12 +26,12 @@ exports.PasswordField = (0, react_1.forwardRef)((_a, ref) => {
     const [show, setShow] = (0, react_1.useState)(false);
     const type = show ? "text" : "password";
     const classNames = (0, clsx_1.default)("mobius/PasswordField", className);
-    const localRef = (0, react_1.useRef)();
+    const localRef = (0, react_1.useRef)(null);
     const handleShowHideButtonClick = () => {
         var _a;
         setShow(oldShow => !oldShow);
         (_a = localRef.current) === null || _a === void 0 ? void 0 : _a.focus();
     };
-    return ((0, jsx_runtime_1.jsx)(TextField_1.TextField, Object.assign({ ref: (0, mergeRefs_1.mergeRefs)([localRef, ref]), type: type, className: classNames }, props, { children: (0, jsx_runtime_1.jsx)(ShowHideButton_1.ShowHideButton, { onClick: handleShowHideButtonClick, show: show }) })));
+    return ((0, jsx_runtime_1.jsx)(TextField_1.TextField, Object.assign({ ref: (0, mergeRefs_1.mergeRefs)([localRef, ref]), className: classNames }, props, { type: type }, { children: (0, jsx_runtime_1.jsx)(ShowHideButton_1.ShowHideButton, { onClick: handleShowHideButtonClick, show: show }) })));
 });
 //# sourceMappingURL=PasswordField.js.map

package/dist/cjs/components/PasswordField/PasswordField.js.map

@@ -1 +1 @@
-{"version":3,"file":"PasswordField.js","sourceRoot":"","sources":["../../../../src/components/PasswordField/PasswordField.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,gDAAwB;AACxB,iCAAqD;AACrD,qDAAkD;AAClD,4CAKsB;AACtB,qDAAkD;AAMrC,QAAA,aAAa,GAAG,IAAA,kBAAU,EACrC,CAAC,EAA2C,EAAE,GAAiB,EAAE,EAAE;QAAlE,EAAE,SAAS,OAAgC,EAA3B,KAAK,cAArB,aAAuB,CAAF;IACpB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IACxC,MAAM,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC;IACxC,MAAM,UAAU,GAAG,IAAA,cAAI,EAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC;IAC3D,MAAM,QAAQ,GAAG,IAAA,cAAM,GAAwB,CAAC;IAEhD,MAAM,yBAAyB,GAAG,GAAG,EAAE;;QACrC,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC;QAC7B,MAAA,QAAQ,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;IAC5B,CAAC,CAAC;IAEF,OAAO,CACL,uBAAC,qBAAS,kBACR,GAAG,EAAE,IAAA,qBAAS,EAAC,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,EAC/B,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,UAAU,IACjB,KAAK,cAET,uBAAC,+BAAc,IAAC,OAAO,EAAE,yBAAyB,EAAE,IAAI,EAAE,IAAI,GAAI,IACxD,CACb,CAAC;AACJ,CAAC,CACF,CAAC"}
+{"version":3,"file":"PasswordField.js","sourceRoot":"","sources":["../../../../src/components/PasswordField/PasswordField.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,gDAAwB;AACxB,iCAAqD;AACrD,qDAAkD;AAClD,4CAKsB;AACtB,qDAAkD;AAMrC,QAAA,aAAa,GAAG,IAAA,kBAAU,EACrC,CAAC,EAA2C,EAAE,GAAiB,EAAE,EAAE;QAAlE,EAAE,SAAS,OAAgC,EAA3B,KAAK,cAArB,aAAuB,CAAF;IACpB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IACxC,MAAM,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC;IACxC,MAAM,UAAU,GAAG,IAAA,cAAI,EAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC;IAC3D,MAAM,QAAQ,GAAG,IAAA,cAAM,EAAuB,IAAI,CAAC,CAAC;IAEpD,MAAM,yBAAyB,GAAG,GAAG,EAAE;;QACrC,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC;QAC7B,MAAA,QAAQ,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;IAC5B,CAAC,CAAC;IAEF,OAAO,CACL,uBAAC,qBAAS,kBACR,GAAG,EAAE,IAAA,qBAAS,EAAC,CAAC,QAAQ,EAAE,GAAG,CAAC,CAAC,EAC/B,SAAS,EAAE,UAAU,IACjB,KAAK,IACT,IAAI,EAAE,IAAI,gBAEV,uBAAC,+BAAc,IAAC,OAAO,EAAE,yBAAyB,EAAE,IAAI,EAAE,IAAI,GAAI,IACxD,CACb,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/cjs/hooks/useOnClickOutside/index.d.ts

@@ -0,0 +1 @@
+export * from "./useOnClickOutside";

package/dist/cjs/hooks/useOnClickOutside/index.js

@@ -0,0 +1,18 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./useOnClickOutside"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/hooks/useOnClickOutside/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/hooks/useOnClickOutside/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,sDAAoC"}

package/dist/cjs/hooks/useOnClickOutside/useOnClickOutside.d.ts

@@ -0,0 +1,2 @@
+import { RefObject } from "react";
+export declare const useOnClickOutside: (ref: RefObject<HTMLElement>, handler: (event: MouseEvent | TouchEvent) => void) => void;

package/dist/cjs/hooks/useOnClickOutside/useOnClickOutside.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useOnClickOutside = void 0;
+const react_1 = require("react");
+const useOnClickOutside = (ref, handler) => {
+    (0, react_1.useEffect)(() => {
+        const listener = (event) => {
+            // Do nothing if clicking ref's element or descendent elements
+            if (!ref.current || ref.current.contains(event.target)) {
+                return;
+            }
+            handler(event);
+        };
+        document.addEventListener("mousedown", listener);
+        document.addEventListener("touchstart", listener);
+        return () => {
+            document.removeEventListener("mousedown", listener);
+            document.removeEventListener("touchstart", listener);
+        };
+    }, [ref, handler]);
+};
+exports.useOnClickOutside = useOnClickOutside;
+//# sourceMappingURL=useOnClickOutside.js.map

package/dist/cjs/hooks/useOnClickOutside/useOnClickOutside.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOnClickOutside.js","sourceRoot":"","sources":["../../../../src/hooks/useOnClickOutside/useOnClickOutside.ts"],"names":[],"mappings":";;;AAAA,iCAA6C;AAEtC,MAAM,iBAAiB,GAAG,CAC/B,GAA2B,EAC3B,OAAiD,EACjD,EAAE;IACF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,QAAQ,GAAG,CAAC,KAA8B,EAAE,EAAE;YAClD,8DAA8D;YAC9D,IAAI,CAAC,GAAG,CAAC,OAAO,IAAI,GAAG,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAqB,CAAC,EAAE;gBACrE,OAAO;aACR;YACD,OAAO,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC,CAAC;QACF,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;QACjD,QAAQ,CAAC,gBAAgB,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;QAElD,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;YACpD,QAAQ,CAAC,mBAAmB,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;QACvD,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC,CAAC;AACrB,CAAC,CAAC;AApBW,QAAA,iBAAiB,qBAoB5B"}

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

@@ -1,7 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
 import { useFocusRing } from "@react-aria/focus";
 import clsx from "clsx";
-import { useEffect, useState, useRef, useCallback } from "react";
+import { useEffect, useState, useRef } from "react";
+import { useOnClickOutside } from "../../../hooks/useOnClickOutside";
 import { useWindowEvent } from "../../../hooks/useWindowEvent";
 export function QuestionHelp({ openedLabel = "Close Help", closedLabel = "Open Help", children, onChange = () => { }, isDesktop, closeHelpOnOutsideClick = false, }) {
     const [isOpen, setIsOpen] = useState(false);
@@ -12,20 +13,14 @@ export function QuestionHelp({ openedLabel = "Close Help", closedLabel = "Open H
             setIsOpen(false);
         }
     });
-    const handleClickOutside = useCallback((event) => {
-        if (ref.current &&
-            !ref.current.contains(event.target) &&
-            closeHelpOnOutsideClick) {
+    useOnClickOutside(ref, () => {
+        if (closeHelpOnOutsideClick) {
             setIsOpen(false);
         }
-    }, [setIsOpen, closeHelpOnOutsideClick]);
+    });
     useEffect(() => {
         onChange(isOpen);
-        window.addEventListener("click", handleClickOutside, {
-            passive: true,
-        });
-        return () => window.removeEventListener("click", handleClickOutside);
-    }, [onChange, isOpen, handleClickOutside]);
+    }, [onChange, isOpen]);
     const className = clsx("chopin/QuestionHelp", {
         "--is-open": isOpen,
         "--is-closed": !isOpen,

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

@@ -1 +1 @@
-{"version":3,"file":"QuestionHelp.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/QuestionHelp/QuestionHelp.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAa,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC5E,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAW/D,MAAM,UAAU,YAAY,CAAC,EAC3B,WAAW,GAAG,YAAY,EAC1B,WAAW,GAAG,WAAW,EACzB,QAAQ,EACR,QAAQ,GAAG,GAAG,EAAE,GAAE,CAAC,EACnB,SAAS,EACT,uBAAuB,GAAG,KAAK,GACb;IAClB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,MAAM,EAAE,UAAU,EAAE,cAAc,EAAE,GAAG,YAAY,CAAC,EAAE,CAAC,CAAC;IAExD,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,EAAE;QAC5B,IAAI,MAAM,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,EAAE;YAChC,SAAS,CAAC,KAAK,CAAC,CAAC;SAClB;IACH,CAAC,CAAC,CAAC;IAEH,MAAM,kBAAkB,GAAG,WAAW,CACpC,CAAC,KAAiB,EAAE,EAAE;QACpB,IACE,GAAG,CAAC,OAAO;YACX,CAAC,GAAG,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAwB,CAAC;YACrD,uBAAuB,EACvB;YACA,SAAS,CAAC,KAAK,CAAC,CAAC;SAClB;IACH,CAAC,EACD,CAAC,SAAS,EAAE,uBAAuB,CAAC,CACrC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,QAAQ,CAAC,MAAM,CAAC,CAAC;QAEjB,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,kBAAkB,EAAE;YACnD,OAAO,EAAE,IAAI;SACd,CAAC,CAAC;QAEH,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,OAAO,EAAE,kBAAkB,CAAC,CAAC;IACvE,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAE3C,MAAM,SAAS,GAAG,IAAI,CACpB,qBAAqB,EACrB;QACE,WAAW,EAAE,MAAM;QACnB,aAAa,EAAE,CAAC,MAAM;KACvB,EACD,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAChC,CAAC;IAEF,MAAM,gBAAgB,GAAG,IAAI,CAAC,4BAA4B,EAAE;QAC1D,cAAc,EAAE,cAAc;KAC/B,CAAC,CAAC;IAEH,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,iBACjC,+BACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,EACjC,SAAS,EAAE,gBAAgB,IACvB,UAAU,cAEd,yBAAO,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,GAAQ,IAC1C,EACT,4BACE,SAAS,EAAC,4BAA4B,iBAC1B,MAAM,eACR,QAAQ,EAClB,IAAI,EAAC,SAAS,iBACD,CAAC,MAAM,gBAEnB,QAAQ,IACL,KACF,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"QuestionHelp.js","sourceRoot":"","sources":["../../../../../src/components/Chopin/QuestionHelp/QuestionHelp.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAa,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAC;AACrE,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAW/D,MAAM,UAAU,YAAY,CAAC,EAC3B,WAAW,GAAG,YAAY,EAC1B,WAAW,GAAG,WAAW,EACzB,QAAQ,EACR,QAAQ,GAAG,GAAG,EAAE,GAAE,CAAC,EACnB,SAAS,EACT,uBAAuB,GAAG,KAAK,GACb;IAClB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,MAAM,EAAE,UAAU,EAAE,cAAc,EAAE,GAAG,YAAY,CAAC,EAAE,CAAC,CAAC;IAExD,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,EAAE;QAC5B,IAAI,MAAM,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,EAAE;YAChC,SAAS,CAAC,KAAK,CAAC,CAAC;SAClB;IACH,CAAC,CAAC,CAAC;IAEH,iBAAiB,CAAC,GAAG,EAAE,GAAG,EAAE;QAC1B,IAAI,uBAAuB,EAAE;YAC3B,SAAS,CAAC,KAAK,CAAC,CAAC;SAClB;IACH,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,QAAQ,CAAC,MAAM,CAAC,CAAC;IACnB,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC,CAAC;IAEvB,MAAM,SAAS,GAAG,IAAI,CACpB,qBAAqB,EACrB;QACE,WAAW,EAAE,MAAM;QACnB,aAAa,EAAE,CAAC,MAAM;KACvB,EACD,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAChC,CAAC;IAEF,MAAM,gBAAgB,GAAG,IAAI,CAAC,4BAA4B,EAAE;QAC1D,cAAc,EAAE,cAAc;KAC/B,CAAC,CAAC;IAEH,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,iBACjC,+BACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,EACjC,SAAS,EAAE,gBAAgB,IACvB,UAAU,cAEd,yBAAO,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,WAAW,GAAQ,IAC1C,EACT,4BACE,SAAS,EAAC,4BAA4B,iBAC1B,MAAM,eACR,QAAQ,EAClB,IAAI,EAAC,SAAS,iBACD,CAAC,MAAM,gBAEnB,QAAQ,IACL,KACF,CACP,CAAC;AACJ,CAAC"}

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

@@ -0,0 +1,10 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import { Label } from "../../../Label";
+import { Text } from "../../../Text";
+export const Header = (props) => {
+    const { isOpen, labelProps, labels } = props;
+    if (!isOpen)
+        return null;
+    return (_jsxs(_Fragment, { children: [_jsx(Label, Object.assign({}, labelProps, { className: "chopin/TradeSelectorLabel", "aria-hidden": true }, { children: labels.input })), labels.description && (_jsx(Text, Object.assign({ className: "chopin/TradeSelectorDescription", variant: "caption" }, { children: labels.description })))] }));
+};
+//# sourceMappingURL=Header.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../../../../src/components/Chopin/TradeSelector/Header/Header.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAWrC,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAAkB,EAAE,EAAE;IAC3C,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAE7C,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IAEzB,OAAO,CACL,8BACE,KAAC,KAAK,oBAAK,UAAU,IAAE,SAAS,EAAC,2BAA2B,qCACzD,MAAM,CAAC,KAAK,IACP,EACP,MAAM,CAAC,WAAW,IAAI,CACrB,KAAC,IAAI,kBAAC,SAAS,EAAC,iCAAiC,EAAC,OAAO,EAAC,SAAS,gBAChE,MAAM,CAAC,WAAW,IACd,CACR,IACA,CACJ,CAAC;AACJ,CAAC,CAAC"}

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

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

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

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

package/dist/esm/components/Chopin/TradeSelector/Listing/Listing.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
+import clsx from "clsx";
+import { ListingItem } from "./ListingItem";
+export const Listing = (props) => {
+    const { title, trades, resultRefs, refCountStart = 0, selectedId, className, onClick, } = props;
+    const listClasses = clsx("chopin/TradeSelectorList", className);
+    return (_jsxs("nav", Object.assign({ "aria-label": title }, { children: [_jsx("header", Object.assign({ className: "chopin/TradeSelectorListTitle" }, { children: title })), _jsx("ul", Object.assign({ className: listClasses }, { children: trades.map((trade, i) => {
+                    const id = refCountStart + i;
+                    const selected = selectedId === id;
+                    return (_jsx(ListingItem, { trade: trade, ref: el => {
+                            if (!el || !resultRefs)
+                                return;
+                            resultRefs.current[id] = el;
+                        }, onClick: onClick, selected: selected }, trade.value));
+                }) }))] })));
+};
+//# sourceMappingURL=Listing.js.map

package/dist/esm/components/Chopin/TradeSelector/Listing/Listing.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Listing.js","sourceRoot":"","sources":["../../../../../../src/components/Chopin/TradeSelector/Listing/Listing.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAGxB,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAY5C,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,KAAmB,EAAE,EAAE;IAC7C,MAAM,EACJ,KAAK,EACL,MAAM,EACN,UAAU,EACV,aAAa,GAAG,CAAC,EACjB,UAAU,EACV,SAAS,EACT,OAAO,GACR,GAAG,KAAK,CAAC;IACV,MAAM,WAAW,GAAG,IAAI,CAAC,0BAA0B,EAAE,SAAS,CAAC,CAAC;IAEhE,OAAO,CACL,2CAAiB,KAAK,iBACpB,+BAAQ,SAAS,EAAC,+BAA+B,gBAAE,KAAK,IAAU,EAClE,2BAAI,SAAS,EAAE,WAAW,gBACvB,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;oBACvB,MAAM,EAAE,GAAG,aAAa,GAAG,CAAC,CAAC;oBAC7B,MAAM,QAAQ,GAAG,UAAU,KAAK,EAAE,CAAC;oBACnC,OAAO,CACL,KAAC,WAAW,IAEV,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,EAAE,CAAC,EAAE;4BACR,IAAI,CAAC,EAAE,IAAI,CAAC,UAAU;gCAAE,OAAO;4BAC/B,UAAU,CAAC,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC;wBAC9B,CAAC,EACD,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,IAPb,KAAK,CAAC,KAAK,CAQhB,CACH,CAAC;gBACJ,CAAC,CAAC,IACC,KACD,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/esm/components/Chopin/TradeSelector/Listing/Listing.test.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import React, { useRef } from "react";
+import { fireEvent, render, screen } from "@testing-library/react";
+import { mockTrade } from "../mockApiResults";
+import { Listing } from "./Listing";
+jest.mock("react", () => (Object.assign(Object.assign({}, jest.requireActual("react")), { useRef: jest.fn() })));
+describe("Listing", () => {
+    it("renders a list of trades", () => {
+        jest.spyOn(React, "useRef").mockReturnValue({
+            current: {},
+        });
+        const title = "Exact matches for your search";
+        const trades = [mockTrade];
+        const resultRefs = useRef([]);
+        const onClick = jest.fn();
+        const selectedId = 0;
+        render(_jsx(Listing, { title: title, trades: trades, resultRefs: resultRefs, onClick: onClick, selectedId: selectedId }));
+        const header = screen.getByText(title);
+        const trade = screen.getByText("Landlord");
+        expect(header).toBeInTheDocument();
+        expect(trade).toBeInTheDocument();
+        fireEvent.click(trade);
+        expect(onClick).toHaveBeenCalled();
+    });
+});
+//# sourceMappingURL=Listing.test.js.map

package/dist/esm/components/Chopin/TradeSelector/Listing/Listing.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Listing.test.js","sourceRoot":"","sources":["../../../../../../src/components/Chopin/TradeSelector/Listing/Listing.test.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,iCACpB,IAAI,CAAC,aAAa,CAAe,OAAO,CAAC,KAC5C,MAAM,EAAE,IAAI,CAAC,EAAE,EAAE,IACjB,CAAC,CAAC;AAEJ,QAAQ,CAAC,SAAS,EAAE,GAAG,EAAE;IACvB,EAAE,CAAC,0BAA0B,EAAE,GAAG,EAAE;QAClC,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,eAAe,CAAC;YAC1C,OAAO,EAAE,EAAE;SACZ,CAAC,CAAC;QAEH,MAAM,KAAK,GAAG,+BAA+B,CAAC;QAC9C,MAAM,MAAM,GAAG,CAAC,SAAS,CAAC,CAAC;QAC3B,MAAM,UAAU,GAAG,MAAM,CAAC,EAAE,CAAC,CAAC;QAC9B,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAC1B,MAAM,UAAU,GAAG,CAAC,CAAC;QAErB,MAAM,CACJ,KAAC,OAAO,IACN,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,GACtB,CACH,CAAC;QAEF,MAAM,MAAM,GAAG,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;QACvC,MAAM,KAAK,GAAG,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;QAE3C,MAAM,CAAC,MAAM,CAAC,CAAC,iBAAiB,EAAE,CAAC;QACnC,MAAM,CAAC,KAAK,CAAC,CAAC,iBAAiB,EAAE,CAAC;QAElC,SAAS,CAAC,KAAK,CAAC,KAAM,CAAC,CAAC;QACxB,MAAM,CAAC,OAAO,CAAC,CAAC,gBAAgB,EAAE,CAAC;IACrC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/esm/components/Chopin/TradeSelector/Listing/ListingItem.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { useFocusRing } from "@react-aria/focus";
+import { useHover } from "@react-aria/interactions";
+import clsx from "clsx";
+import { forwardRef } from "react";
+export const ListingItem = forwardRef((props, ref) => {
+    const { trade, selected, onClick } = props;
+    const { isFocusVisible, focusProps } = useFocusRing({
+        within: false,
+    });
+    const { hoverProps, isHovered } = useHover({});
+    const classes = clsx("chopin/TradeSelectorButton", "chopin/TradeSelectorOption", {
+        "--is-focused": isFocusVisible || selected,
+        "--is-hovered": isHovered,
+    });
+    const handleClick = () => onClick(trade);
+    return (_jsx("li", Object.assign({ className: "chopin/TradeSelectorListItem" }, { children: _jsx("button", Object.assign({ ref: ref, type: "button", onClick: handleClick, 
+            // eslint-disable-next-line react/no-danger
+            dangerouslySetInnerHTML: { __html: trade.label }, className: classes, "data-key": trade.value }, hoverProps, focusProps)) })));
+});
+//# sourceMappingURL=ListingItem.js.map

package/dist/esm/components/Chopin/TradeSelector/Listing/ListingItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListingItem.js","sourceRoot":"","sources":["../../../../../../src/components/Chopin/TradeSelector/Listing/ListingItem.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACpD,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAY,UAAU,EAAE,MAAM,OAAO,CAAC;AAY7C,MAAM,CAAC,MAAM,WAAW,GAAG,UAAU,CACnC,CAAC,KAAuB,EAAE,GAAgC,EAAE,EAAE;IAC5D,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC;IAC3C,MAAM,EAAE,cAAc,EAAE,UAAU,EAAE,GAAG,YAAY,CAAC;QAClD,MAAM,EAAE,KAAK;KACd,CAAC,CAAC;IACH,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC/C,MAAM,OAAO,GAAG,IAAI,CAClB,4BAA4B,EAC5B,4BAA4B,EAC5B;QACE,cAAc,EAAE,cAAc,IAAI,QAAQ;QAC1C,cAAc,EAAE,SAAS;KAC1B,CACF,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAEzC,OAAO,CACL,2BAAI,SAAS,EAAC,8BAA8B,gBAC1C,+BACE,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,WAAW;YACpB,2CAA2C;YAC3C,uBAAuB,EAAE,EAAE,MAAM,EAAE,KAAK,CAAC,KAAK,EAAE,EAChD,SAAS,EAAE,OAAO,cACR,KAAK,CAAC,KAAK,IACjB,UAAU,EACV,UAAU,EACd,IACC,CACN,CAAC;AACJ,CAAC,CACF,CAAC"}

package/dist/esm/components/Chopin/TradeSelector/Listing/ListingItem.test.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+import { fireEvent, render } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { mockTrade } from "../mockApiResults";
+import { ListingItem } from "./ListingItem";
+describe("ListingItem", () => {
+    it("renders trade", () => {
+        const onClick = jest.fn();
+        const { container } = render(_jsx(ListingItem, { trade: mockTrade, onClick: onClick, selected: false }));
+        const button = container.querySelector("button");
+        expect(button).toHaveAttribute("data-key", "Landlord");
+        expect(button).toHaveTextContent("Landlord");
+    });
+    it("sets classes for interaction states", async () => {
+        const onClick = jest.fn();
+        const { container } = render(_jsx(ListingItem, { trade: mockTrade, onClick: onClick, selected: false }));
+        const button = container.querySelector("button");
+        fireEvent.mouseEnter(button);
+        expect(button).toHaveClass("--is-hovered");
+        await userEvent.tab();
+        expect(button).toHaveClass("--is-focused");
+    });
+    it("sets interaction class when selected prop is true", () => {
+        const onClick = jest.fn();
+        const { container } = render(_jsx(ListingItem, { trade: mockTrade, onClick: onClick, selected: true }));
+        const button = container.querySelector("button");
+        expect(button).toHaveClass("--is-focused");
+    });
+    it("calls onClick", () => {
+        const onClick = jest.fn();
+        const { container } = render(_jsx(ListingItem, { trade: mockTrade, onClick: onClick, selected: false }));
+        const button = container.querySelector("button");
+        fireEvent.click(button);
+        expect(onClick).toHaveBeenCalled();
+    });
+});
+//# sourceMappingURL=ListingItem.test.js.map

package/dist/esm/components/Chopin/TradeSelector/Listing/ListingItem.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListingItem.test.js","sourceRoot":"","sources":["../../../../../../src/components/Chopin/TradeSelector/Listing/ListingItem.test.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,SAAS,MAAM,6BAA6B,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,QAAQ,CAAC,aAAa,EAAE,GAAG,EAAE;IAC3B,EAAE,CAAC,eAAe,EAAE,GAAG,EAAE;QACvB,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAC1B,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,KAAC,WAAW,IAAC,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,GAAI,CACrE,CAAC;QAEF,MAAM,MAAM,GAAG,SAAS,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QAEjD,MAAM,CAAC,MAAM,CAAC,CAAC,eAAe,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;QACvD,MAAM,CAAC,MAAM,CAAC,CAAC,iBAAiB,CAAC,UAAU,CAAC,CAAC;IAC/C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,qCAAqC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAC1B,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,KAAC,WAAW,IAAC,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,GAAI,CACrE,CAAC;QAEF,MAAM,MAAM,GAAG,SAAS,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QAEjD,SAAS,CAAC,UAAU,CAAC,MAAO,CAAC,CAAC;QAC9B,MAAM,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;QAE3C,MAAM,SAAS,CAAC,GAAG,EAAE,CAAC;QACtB,MAAM,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;IAC7C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,mDAAmD,EAAE,GAAG,EAAE;QAC3D,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAC1B,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,KAAC,WAAW,IAAC,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,SAAG,CAC7D,CAAC;QAEF,MAAM,MAAM,GAAG,SAAS,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QACjD,MAAM,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC;IAC7C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,eAAe,EAAE,GAAG,EAAE;QACvB,MAAM,OAAO,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAC1B,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAC1B,KAAC,WAAW,IAAC,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,GAAI,CACrE,CAAC;QAEF,MAAM,MAAM,GAAG,SAAS,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QACjD,SAAS,CAAC,KAAK,CAAC,MAAO,CAAC,CAAC;QACzB,MAAM,CAAC,OAAO,CAAC,CAAC,gBAAgB,EAAE,CAAC;IACrC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/esm/components/Chopin/TradeSelector/Listing/index.js

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

package/dist/esm/components/Chopin/TradeSelector/Listing/index.js.map

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