@webiny/app-headless-cms 6.0.0-beta.0 → 6.0.0-rc.0

package/admin/plugins/fieldRenderers/ref/advanced/components/Entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_Image","_ModelName","_Title","_Description","_Status","_CreatedBy","_ModifiedBy","_View","_Select","_Remove","_MoveUp","_MoveDown","_EMOTION_STRINGIFIED_CSS_ERROR__","Container","_base","default","process","env","NODE_ENV","target","label","name","styles","map","toString","ContentContainer","Content","FooterContainer","LeftContainer","display","flexWrap","flexBasis","alignItems","flexShrink","flexGrow","justifyContent","borderBottom","paddingBottom","marginTop","paddingTop","RightContainer","Entry","exports","_ref","model","entry","onChange","onRemove","selected","index","onMoveUpClick","onMoveUp","onMoveDownClick","onMoveDown","placement","useCallback","ev","shiftKey","icon","createElement","Image","title","src","image","ModelName","Title","Description","description","Status","status","CreatedBy","createdBy","createdOn","ModifiedBy","modifiedBy","savedOn","Fragment","MoveUp","className","onClick","MoveDown","View","Select","Remove"],"sources":["Entry.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport styled from \"@emotion/styled\";\nimport {\n    CmsReferenceContentEntry,\n    CmsReferenceValue\n} from \"~/admin/plugins/fieldRenderers/ref/components/types\";\nimport { Image } from \"./entry/Image\";\nimport { ModelName } from \"./entry/ModelName\";\nimport { Title } from \"./entry/Title\";\nimport { Description } from \"./entry/Description\";\nimport { Status } from \"./entry/Status\";\nimport { CreatedBy } from \"./entry/CreatedBy\";\nimport { ModifiedBy } from \"./entry/ModifiedBy\";\nimport { View } from \"./entry/View\";\nimport { Select } from \"./entry/Select\";\nimport { Remove } from \"./entry/Remove\";\nimport { MoveUp } from \"./entry/MoveUp\";\nimport { MoveDown } from \"./entry/MoveDown\";\nimport { CmsModel } from \"~/types\";\n\nconst Container = styled(\"div\")({\n    width: \"100%\",\n    display: \"flex\",\n    backgroundColor: \"#FFF\",\n    flexDirection: \"column\",\n    boxShadow: \"0px 1px 2px rgba(0, 0, 0, 0.3), 0px 1px 3px 1px rgba(0, 0, 0, 0.15)\",\n    marginBottom: \"10px\",\n    boxSizing: \"border-box\"\n});\n\nconst ContentContainer = styled(\"div\")({\n    width: \"100%\",\n    display: \"grid\",\n    gridTemplateColumns: \"166px auto\",\n    borderBottom: \"1px solid var(--mdc-theme-background)\"\n});\n\nconst Content = styled(\"div\")({\n    paddingLeft: \"16px\",\n    paddingTop: \"18px\",\n    paddingBottom: \"10px\"\n});\n\nconst FooterContainer = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"row\",\n    padding: \"10px\",\n    flexWrap: \"wrap-reverse\",\n    justifyContent: \"center\",\n    marginBottom: \"-10px\"\n});\n\nconst LeftContainer = styled(\"div\")({\n    display: \"flex\",\n    flexWrap: \"nowrap\",\n    flexBasis: \"50%\",\n    alignItems: \"center\",\n    flexShrink: 1,\n    flexGrow: 1,\n    justifyContent: \"space-around\",\n    borderBottom: \"1px solid var(--mdc-theme-on-background)\",\n    paddingBottom: 10,\n    marginTop: -10,\n    paddingTop: 15\n});\n\nconst RightContainer = styled(\"div\")({\n    display: \"flex\",\n    flexWrap: \"nowrap\",\n    flexBasis: \"50%\",\n    flexShrink: 1,\n    flexGrow: 1,\n    justifyContent: \"space-around\",\n    borderBottom: \"1px solid var(--mdc-theme-on-background)\",\n    paddingBottom: 10,\n    \">div\": {\n        minWidth: \"100px\"\n    }\n});\n\ninterface EntryProps {\n    model: CmsModel;\n    entry: CmsReferenceContentEntry;\n    onChange: (value: CmsReferenceValue) => void;\n    index?: never;\n    selected: boolean;\n    onMoveUp?: never;\n    onMoveDown?: never;\n    onRemove?: never;\n    placement?: string;\n}\n\ninterface EntryPropsWithRemove {\n    onRemove: (entryId: string) => void;\n    model: CmsModel;\n    entry: CmsReferenceContentEntry;\n    index: number;\n    onMoveUp?: (index: number, toTop: boolean) => void;\n    onMoveDown?: (index: number, toBottom: boolean) => void;\n    onChange?: never;\n    selected?: never;\n    placement?: string;\n}\n\nexport const Entry = ({\n    model,\n    entry,\n    onChange,\n    onRemove,\n    selected,\n    index,\n    onMoveUp: onMoveUpClick,\n    onMoveDown: onMoveDownClick,\n    placement\n}: EntryPropsWithRemove | EntryProps) => {\n    const onMoveUp = useCallback(\n        (ev: React.MouseEvent) => {\n            if (!onMoveUpClick) {\n                return;\n            }\n            onMoveUpClick(index, ev.shiftKey);\n        },\n        [onMoveUpClick, index]\n    );\n    const onMoveDown = useCallback(\n        (ev: React.MouseEvent) => {\n            if (!onMoveDownClick) {\n                return;\n            }\n            onMoveDownClick(index, ev.shiftKey);\n        },\n        [onMoveDownClick, index]\n    );\n\n    const icon = model.icon;\n\n    return (\n        <Container>\n            <ContentContainer>\n                <Image title={entry.title} src={entry.image} icon={icon} />\n                <Content>\n                    <ModelName name={entry.model.name} />\n                    <Title title={entry.title} />\n                    <Description description={entry.description} />\n                </Content>\n            </ContentContainer>\n            <FooterContainer>\n                <LeftContainer>\n                    <Status status={entry.status} />\n                    <CreatedBy createdBy={entry.createdBy} createdOn={entry.createdOn} />\n                    <ModifiedBy modifiedBy={entry.modifiedBy} savedOn={entry.savedOn} />\n                </LeftContainer>\n                <RightContainer>\n                    {placement == \"multiRef\" && (\n                        <>\n                            <MoveUp\n                                className={onMoveUpClick ? \"active\" : \"disabled\"}\n                                onClick={onMoveUp}\n                            />\n                            <MoveDown\n                                className={onMoveDownClick ? \"active\" : \"disabled\"}\n                                onClick={onMoveDown}\n                            />\n                        </>\n                    )}\n                    <View entry={entry} />\n                    {onChange && <Select entry={entry} onChange={onChange} selected={selected} />}\n                    {onRemove && <Remove entry={entry} onRemove={onRemove} />}\n                </RightContainer>\n            </FooterContainer>\n        </Container>\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useCallback","useMemo","Image","Tag","TimeAgo","Text","DropdownMenu","IconButton","Checkbox","cn","ReactComponent","MoreVertIcon","OpenInNewIcon","RemoveIcon","ArrowUp","ArrowDown","useRouter","Routes","Entry","entry","onChange","onRemove","selected","index","onMoveUp","onMoveUpClick","onMoveDown","onMoveDownClick","placement","getLink","onSelect","id","modelId","model","ev","shiftKey","entryStatusLabel","status","charAt","toUpperCase","slice","entryRevision","extractedRevision","split","Number","toString","folderId","wbyAco_location","location","link","ContentEntries","List","createElement","onClick","className","checked","title","src","image","name","createdBy","displayName","datetime","createdOn","content","Fragment","size","variant","disabled","icon","trigger","Link","text","to","target","Item"],"sources":["Entry.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport type {\n    CmsReferenceContentEntry,\n    CmsReferenceValue\n} from \"~/admin/plugins/fieldRenderers/ref/components/types.js\";\nimport { Image } from \"./entry/Image.js\";\nimport type { CmsModel } from \"~/types.js\";\nimport { Tag, TimeAgo, Text, DropdownMenu, IconButton, Checkbox, cn } from \"@webiny/admin-ui\";\nimport { ReactComponent as MoreVertIcon } from \"@webiny/icons/more_vert.svg\";\nimport { ReactComponent as OpenInNewIcon } from \"@webiny/icons/open_in_new.svg\";\nimport { ReactComponent as RemoveIcon } from \"@webiny/icons/close.svg\";\nimport { ReactComponent as ArrowUp } from \"@webiny/icons/arrow_upward.svg\";\nimport { ReactComponent as ArrowDown } from \"@webiny/icons/arrow_downward.svg\";\nimport { useRouter } from \"@webiny/app\";\nimport { Routes } from \"~/routes.js\";\n\ninterface EntryProps {\n    model: CmsModel;\n    entry: CmsReferenceContentEntry;\n    onChange: (value: CmsReferenceValue) => void;\n    index?: never;\n    selected: boolean;\n    onMoveUp?: never;\n    onMoveDown?: never;\n    onRemove?: never;\n    placement?: string;\n}\n\ninterface EntryPropsWithRemove {\n    onRemove: (entryId: string) => void;\n    model: CmsModel;\n    entry: CmsReferenceContentEntry;\n    index: number;\n    onMoveUp?: (index: number, toTop: boolean) => void;\n    onMoveDown?: (index: number, toBottom: boolean) => void;\n    onChange?: never;\n    selected?: never;\n    placement?: string;\n}\n\nexport const Entry = ({\n    entry,\n    onChange,\n    onRemove,\n    selected,\n    index,\n    onMoveUp: onMoveUpClick,\n    onMoveDown: onMoveDownClick,\n    placement\n}: EntryPropsWithRemove | EntryProps) => {\n    const { getLink } = useRouter();\n\n    const onSelect = useCallback(() => {\n        if (onChange) {\n            onChange({\n                id: entry.id,\n                modelId: entry.model.modelId\n            });\n        }\n    }, [onChange, entry.id, entry.model.modelId]);\n\n    const onMoveUp = useCallback(\n        (ev: React.MouseEvent) => {\n            if (!onMoveUpClick) {\n                return;\n            }\n            onMoveUpClick(index, ev.shiftKey);\n        },\n        [onMoveUpClick, index]\n    );\n    const onMoveDown = useCallback(\n        (ev: React.MouseEvent) => {\n            if (!onMoveDownClick) {\n                return;\n            }\n            onMoveDownClick(index, ev.shiftKey);\n        },\n        [onMoveDownClick, index]\n    );\n\n    const entryStatusLabel = entry.status.charAt(0).toUpperCase() + entry.status.slice(1);\n\n    // Did not have `revision` field available in the `getLatestContentEntries`\n    // response, hence the manual extraction from the `id` field.\n    const entryRevision = useMemo(() => {\n        const extractedRevision = entry.id.split(\"#\")[1] || \"0001\";\n\n        // Remove leading zeros for correct padding.\n        return \"v\" + Number(extractedRevision).toString();\n    }, [entry.id]);\n\n    const folderId = entry.wbyAco_location?.folderId || entry.location?.folderId || \"\";\n\n    const link = getLink(Routes.ContentEntries.List, {\n        id: entry.id,\n        modelId: entry.model.modelId,\n        folderId\n    });\n\n    return (\n        <div\n            data-selected={selected}\n            onClick={onSelect}\n            data-role=\"ref-field-entry\"\n            className={cn(\n                \"flex items-center justify-between gap-md w-full rounded-md bg-neutral-light p-sm-extra pr-lg hover:bg-neutral-dimmed border-md border-transparent data-[selected=true]:border-accent-dimmed\",\n                { \"hover:cursor-pointer\": !!onChange }\n            )}\n        >\n            {onChange && (\n                <div>\n                    <Checkbox\n                        checked={selected}\n                        onChange={() => {\n                            // We're not calling the onSelect callback here because\n                            // the parent div already does that on click.\n                        }}\n                    />\n                </div>\n            )}\n            <div\n                className={\n                    \"grid grid-cols-[auto_1fr_auto] items-center gap-lg text-sm text-neutral-muted w-full min-w-0\"\n                }\n            >\n                <Image title={entry.title} src={entry.image} />\n                <div className={\"overflow-hidden\"}>\n                    <div>{entry.model.name}</div>\n\n                    <div\n                        title={entry.title}\n                        className={\n                            \"text-md text-neutral-primary font-semibold mb-sm text-ellipsis overflow-hidden whitespace-nowrap block\"\n                        }\n                    >\n                        {entry.title}\n                    </div>\n\n                    <div>\n                        <span className={\"w-[60px] inline-block\"}>Created:</span>\n                        <span>\n                            {entry.createdBy.displayName}, <TimeAgo datetime={entry.createdOn} />\n                        </span>\n                    </div>\n                    {/* <div>\n                        <span className={\"w-[60px] inline-block\"}>Location:</span>\n                        <span>\n                            Home / Content / Preview / ... / Manage / Retail / Local / Products\n                        </span>\n                    </div>*/}\n                </div>\n                <div className={\"flex items-center gap-sm\"}>\n                    <Tag\n                        content={\n                            <>\n                                {entryStatusLabel}&nbsp;\n                                <Text size={\"sm\"} className={\"text-neutral-muted\"}>\n                                    ({entryRevision})\n                                </Text>\n                            </>\n                        }\n                        variant={\"neutral-base-outline\"}\n                    />\n\n                    {placement == \"multiRef\" && (\n                        <>\n                            <div className={\"flex gap-xs\"}>\n                                <IconButton\n                                    disabled={!onMoveUpClick}\n                                    variant={\"ghost\"}\n                                    size={\"sm\"}\n                                    icon={<ArrowUp />}\n                                    onClick={onMoveUp}\n                                />\n                                <IconButton\n                                    disabled={!onMoveDownClick}\n                                    variant={\"ghost\"}\n                                    size={\"sm\"}\n                                    icon={<ArrowDown />}\n                                    onClick={onMoveDown}\n                                />\n                            </div>\n                        </>\n                    )}\n\n                    <DropdownMenu\n                        trigger={\n                            <IconButton variant={\"ghost\"} size={\"sm\"} icon={<MoreVertIcon />} />\n                        }\n                    >\n                        <DropdownMenu.Link\n                            icon={<OpenInNewIcon />}\n                            text={\"Open in new tab\"}\n                            to={link}\n                            target={\"_blank\"}\n                        />\n\n                        {onRemove && (\n                            <DropdownMenu.Item\n                                icon={<RemoveIcon />}\n                                text={placement === \"multiRef\" ? \"Remove from list\" : \"Remove\"}\n                                onClick={() => onRemove(entry.id)}\n                            />\n                        )}\n                    </DropdownMenu>\n                </div>\n            </div>\n        </div>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/admin/plugins/fieldRenderers/ref/advanced/components/NoEntries.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+interface NoEntriesProps {
+    text?: React.ReactNode;
+}
+declare const NoEntries: ({ text }: NoEntriesProps) => React.JSX.Element;
+export { NoEntries, type NoEntriesProps };

package/admin/plugins/fieldRenderers/ref/advanced/components/NoEntries.js

@@ -0,0 +1,14 @@
+import React from "react";
+import { Text } from "@webiny/admin-ui";
+const NoEntries = ({
+  text = "No records found."
+}) => {
+  return /*#__PURE__*/React.createElement("div", {
+    className: "flex justify-center px-xl py-md-extra bg-neutral-subtle"
+  }, /*#__PURE__*/React.createElement(Text, {
+    size: "sm"
+  }, text));
+};
+export { NoEntries };
+
+//# sourceMappingURL=NoEntries.js.map

package/admin/plugins/fieldRenderers/ref/advanced/components/NoEntries.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Text","NoEntries","text","createElement","className","size"],"sources":["NoEntries.tsx"],"sourcesContent":["import React from \"react\";\nimport { Text } from \"@webiny/admin-ui\";\n\ninterface NoEntriesProps {\n    text?: React.ReactNode;\n}\n\nconst NoEntries = ({ text = \"No records found.\" }: NoEntriesProps) => {\n    return (\n        <div className={\"flex justify-center px-xl py-md-extra bg-neutral-subtle\"}>\n            <Text size={\"sm\"}>{text}</Text>\n        </div>\n    );\n};\n\nexport { NoEntries, type NoEntriesProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,kBAAkB;AAMvC,MAAMC,SAAS,GAAGA,CAAC;EAAEC,IAAI,GAAG;AAAoC,CAAC,KAAK;EAClE,oBACIH,KAAA,CAAAI,aAAA;IAAKC,SAAS,EAAE;EAA0D,gBACtEL,KAAA,CAAAI,aAAA,CAACH,IAAI;IAACK,IAAI,EAAE;EAAK,GAAEH,IAAW,CAC7B,CAAC;AAEd,CAAC;AAED,SAASD,SAAS","ignoreList":[]}

package/admin/plugins/fieldRenderers/ref/advanced/components/Options.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { CmsModel } from "../../../../../../types";
+import type { CmsModel } from "../../../../../../types.js";
 interface OptionsProps {
     models: CmsModel[];
     onNewRecord: (modelId: string) => void;

package/admin/plugins/fieldRenderers/ref/advanced/components/Options.js

@@ -1,115 +1,68 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Options = void 0;
-var _base = _interopRequireDefault(require("@emotion/styled/base"));
-var _react = _interopRequireWildcard(require("react"));
-var _OptionsModelList = require("./options/OptionsModelList");
-var _link = require("./assets/link.svg");
-var _addCircle = require("./assets/add-circle.svg");
-function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
-var Container = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e1k00edo4"
-} : {
-  target: "e1k00edo4",
-  label: "Container"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1vncc1c",
-  styles: "display:flex;flex-direction:row;width:100%"
-} : {
-  name: "1vncc1c",
-  styles: "display:flex;flex-direction:row;width:100%",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk9wdGlvbnMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU9rQiIsImZpbGUiOiJPcHRpb25zLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyB1c2VDYWxsYmFjayB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBDbXNNb2RlbCB9IGZyb20gXCJ+L3R5cGVzXCI7XG5pbXBvcnQgeyBPcHRpb25zTW9kZWxMaXN0IH0gZnJvbSBcIn4vYWRtaW4vcGx1Z2lucy9maWVsZFJlbmRlcmVycy9yZWYvYWR2YW5jZWQvY29tcG9uZW50cy9vcHRpb25zL09wdGlvbnNNb2RlbExpc3RcIjtcbmltcG9ydCB7IFJlYWN0Q29tcG9uZW50IGFzIExpbmtJY29uIH0gZnJvbSBcIi4vYXNzZXRzL2xpbmsuc3ZnXCI7XG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBBZGRJY29uIH0gZnJvbSBcIi4vYXNzZXRzL2FkZC1jaXJjbGUuc3ZnXCI7XG5cbmNvbnN0IENvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKSh7XG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgZmxleERpcmVjdGlvbjogXCJyb3dcIixcbiAgICB3aWR0aDogXCIxMDAlXCJcbn0pO1xuY29uc3QgTmV3UmVjb3JkID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBib3JkZXJSaWdodDogXCIycHggc29saWQgdmFyKC0tbWRjLXRoZW1lLWJhY2tncm91bmQpXCIsXG4gICAgcGFkZGluZzogXCIxMHB4IDE1cHhcIixcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgICBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgXCIgPiBkaXYgXCI6IHtcbiAgICAgICAgZGlzcGxheTogXCJub25lXCJcbiAgICB9LFxuICAgIFwiOmhvdmVyID4gZGl2XCI6IHtcbiAgICAgICAgZGlzcGxheTogXCJibG9ja1wiXG4gICAgfVxufSk7XG5jb25zdCBOZXdSZWNvcmRCdXR0b24gPSBzdHlsZWQoXCJidXR0b25cIikoe1xuICAgIGJhY2tncm91bmQ6IFwidHJhbnNwYXJlbnRcIixcbiAgICBib3JkZXI6IFwibm9uZVwiLFxuICAgIGNvbG9yOiBcInZhcigtLW1kYy10aGVtZS1wcmltYXJ5KVwiLFxuICAgIHBhZGRpbmc6IFwiMnB4IDJweFwiLFxuICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgICBcIj4gc3ZnXCI6IHtcbiAgICAgICAgY29sb3I6IFwidmFyKC0tbWRjLXRoZW1lLXByaW1hcnkpXCIsXG4gICAgICAgIHdpZHRoOiBcIjE2cHhcIixcbiAgICAgICAgaGVpZ2h0OiBcIjE2cHhcIixcbiAgICAgICAgbWFyZ2luUmlnaHQ6IDEwXG4gICAgfVxufSk7XG5jb25zdCBMaW5rRXhpc3RpbmdSZWNvcmQgPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIHBhZGRpbmc6IFwiMTBweCAxNXB4XCIsXG4gICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgICBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiLFxuICAgIFwiID4gZGl2IFwiOiB7XG4gICAgICAgIGRpc3BsYXk6IFwibm9uZVwiXG4gICAgfSxcbiAgICBcIjpob3ZlciA+IGRpdlwiOiB7XG4gICAgICAgIGRpc3BsYXk6IFwiYmxvY2tcIlxuICAgIH1cbn0pO1xuY29uc3QgTGlua0V4aXN0aW5nUmVjb3JkQnV0dG9uID0gc3R5bGVkKFwiYnV0dG9uXCIpKHtcbiAgICBiYWNrZ3JvdW5kOiBcInRyYW5zcGFyZW50XCIsXG4gICAgYm9yZGVyOiBcIm5vbmVcIixcbiAgICBjb2xvcjogXCJ2YXIoLS1tZGMtdGhlbWUtcHJpbWFyeSlcIixcbiAgICBwYWRkaW5nOiBcIjJweCA1cHhcIixcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgXCI+IHN2Z1wiOiB7XG4gICAgICAgIGNvbG9yOiBcInZhcigtLW1kYy10aGVtZS1wcmltYXJ5KVwiLFxuICAgICAgICB3aWR0aDogXCIxNnB4XCIsXG4gICAgICAgIGhlaWdodDogXCIxNnB4XCIsXG4gICAgICAgIG1hcmdpblJpZ2h0OiAxMFxuICAgIH1cbn0pO1xuXG5pbnRlcmZhY2UgT3B0aW9uc1Byb3BzIHtcbiAgICBtb2RlbHM6IENtc01vZGVsW107XG4gICAgb25OZXdSZWNvcmQ6IChtb2RlbElkOiBzdHJpbmcpID0+IHZvaWQ7XG4gICAgb25MaW5rRXhpc3RpbmdSZWNvcmQ6IChtb2RlbElkOiBzdHJpbmcpID0+IHZvaWQ7XG59XG5leHBvcnQgY29uc3QgT3B0aW9ucyA9ICh7IG1vZGVscywgb25OZXdSZWNvcmQsIG9uTGlua0V4aXN0aW5nUmVjb3JkIH06IE9wdGlvbnNQcm9wcykgPT4ge1xuICAgIGNvbnN0IGhhc011bHRpcGxlTW9kZWxzID0gbW9kZWxzLmxlbmd0aCA+IDE7XG4gICAgY29uc3Qgb25TaW5nbGVOZXdSZWNvcmQgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgICAgIGlmIChtb2RlbHMubGVuZ3RoID09PSAwIHx8IGhhc011bHRpcGxlTW9kZWxzKSB7XG4gICAgICAgICAgICByZXR1cm47XG4gICAgICAgIH1cbiAgICAgICAgb25OZXdSZWNvcmQobW9kZWxzWzBdLm1vZGVsSWQpO1xuICAgIH0sIFttb2RlbHNdKTtcblxuICAgIGNvbnN0IG9uU2luZ2xlRXhpc3RpbmdSZWNvcmQgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgICAgIGlmIChtb2RlbHMubGVuZ3RoID09PSAwIHx8IGhhc011bHRpcGxlTW9kZWxzKSB7XG4gICAgICAgICAgICByZXR1cm47XG4gICAgICAgIH1cbiAgICAgICAgb25MaW5rRXhpc3RpbmdSZWNvcmQobW9kZWxzWzBdLm1vZGVsSWQpO1xuICAgIH0sIFttb2RlbHNdKTtcbiAgICByZXR1cm4gKFxuICAgICAgICA8Q29udGFpbmVyPlxuICAgICAgICAgICAgPE5ld1JlY29yZD5cbiAgICAgICAgICAgICAgICA8TmV3UmVjb3JkQnV0dG9uIG9uQ2xpY2s9e29uU2luZ2xlTmV3UmVjb3JkfT5cbiAgICAgICAgICAgICAgICAgICAgPEFkZEljb24gLz4gY3JlYXRlIGEgbmV3IHJlY29yZFxuICAgICAgICAgICAgICAgIDwvTmV3UmVjb3JkQnV0dG9uPlxuICAgICAgICAgICAgICAgIDxPcHRpb25zTW9kZWxMaXN0IG9uQ2xpY2s9e29uTmV3UmVjb3JkfSBtb2RlbHM9e21vZGVsc30gLz5cbiAgICAgICAgICAgIDwvTmV3UmVjb3JkPlxuICAgICAgICAgICAgPExpbmtFeGlzdGluZ1JlY29yZD5cbiAgICAgICAgICAgICAgICA8TGlua0V4aXN0aW5nUmVjb3JkQnV0dG9uIG9uQ2xpY2s9e29uU2luZ2xlRXhpc3RpbmdSZWNvcmR9PlxuICAgICAgICAgICAgICAgICAgICA8TGlua0ljb24gLz4gbGluayBhbiBleGlzdGluZyByZWNvcmRcbiAgICAgICAgICAgICAgICA8L0xpbmtFeGlzdGluZ1JlY29yZEJ1dHRvbj5cbiAgICAgICAgICAgICAgICA8T3B0aW9uc01vZGVsTGlzdCBvbkNsaWNrPXtvbkxpbmtFeGlzdGluZ1JlY29yZH0gbW9kZWxzPXttb2RlbHN9IC8+XG4gICAgICAgICAgICA8L0xpbmtFeGlzdGluZ1JlY29yZD5cbiAgICAgICAgPC9Db250YWluZXI+XG4gICAgKTtcbn07XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var NewRecord = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e1k00edo3"
-} : {
-  target: "e1k00edo3",
-  label: "NewRecord"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1ktsll8",
-  styles: "border-right:2px solid var(--mdc-theme-background);padding:10px 15px;display:flex;position:relative;align-items:center; > div {display:none;}:hover > div{display:block;}"
-} : {
-  name: "1ktsll8",
-  styles: "border-right:2px solid var(--mdc-theme-background);padding:10px 15px;display:flex;position:relative;align-items:center; > div {display:none;}:hover > div{display:block;}",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk9wdGlvbnMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVlrQiIsImZpbGUiOiJPcHRpb25zLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyB1c2VDYWxsYmFjayB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBDbXNNb2RlbCB9IGZyb20gXCJ+L3R5cGVzXCI7XG5pbXBvcnQgeyBPcHRpb25zTW9kZWxMaXN0IH0gZnJvbSBcIn4vYWRtaW4vcGx1Z2lucy9maWVsZFJlbmRlcmVycy9yZWYvYWR2YW5jZWQvY29tcG9uZW50cy9vcHRpb25zL09wdGlvbnNNb2RlbExpc3RcIjtcbmltcG9ydCB7IFJlYWN0Q29tcG9uZW50IGFzIExpbmtJY29uIH0gZnJvbSBcIi4vYXNzZXRzL2xpbmsuc3ZnXCI7XG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBBZGRJY29uIH0gZnJvbSBcIi4vYXNzZXRzL2FkZC1jaXJjbGUuc3ZnXCI7XG5cbmNvbnN0IENvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKSh7XG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgZmxleERpcmVjdGlvbjogXCJyb3dcIixcbiAgICB3aWR0aDogXCIxMDAlXCJcbn0pO1xuY29uc3QgTmV3UmVjb3JkID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBib3JkZXJSaWdodDogXCIycHggc29saWQgdmFyKC0tbWRjLXRoZW1lLWJhY2tncm91bmQpXCIsXG4gICAgcGFkZGluZzogXCIxMHB4IDE1cHhcIixcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgICBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgXCIgPiBkaXYgXCI6IHtcbiAgICAgICAgZGlzcGxheTogXCJub25lXCJcbiAgICB9LFxuICAgIFwiOmhvdmVyID4gZGl2XCI6IHtcbiAgICAgICAgZGlzcGxheTogXCJibG9ja1wiXG4gICAgfVxufSk7XG5jb25zdCBOZXdSZWNvcmRCdXR0b24gPSBzdHlsZWQoXCJidXR0b25cIikoe1xuICAgIGJhY2tncm91bmQ6IFwidHJhbnNwYXJlbnRcIixcbiAgICBib3JkZXI6IFwibm9uZVwiLFxuICAgIGNvbG9yOiBcInZhcigtLW1kYy10aGVtZS1wcmltYXJ5KVwiLFxuICAgIHBhZGRpbmc6IFwiMnB4IDJweFwiLFxuICAgIGN1cnNvcjogXCJwb2ludGVyXCIsXG4gICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgICBcIj4gc3ZnXCI6IHtcbiAgICAgICAgY29sb3I6IFwidmFyKC0tbWRjLXRoZW1lLXByaW1hcnkpXCIsXG4gICAgICAgIHdpZHRoOiBcIjE2cHhcIixcbiAgICAgICAgaGVpZ2h0OiBcIjE2cHhcIixcbiAgICAgICAgbWFyZ2luUmlnaHQ6IDEwXG4gICAgfVxufSk7XG5jb25zdCBMaW5rRXhpc3RpbmdSZWNvcmQgPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIHBhZGRpbmc6IFwiMTBweCAxNXB4XCIsXG4gICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgICBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiLFxuICAgIFwiID4gZGl2IFwiOiB7XG4gICAgICAgIGRpc3BsYXk6IFwibm9uZVwiXG4gICAgfSxcbiAgICBcIjpob3ZlciA+IGRpdlwiOiB7XG4gICAgICAgIGRpc3BsYXk6IFwiYmxvY2tcIlxuICAgIH1cbn0pO1xuY29uc3QgTGlua0V4aXN0aW5nUmVjb3JkQnV0dG9uID0gc3R5bGVkKFwiYnV0dG9uXCIpKHtcbiAgICBiYWNrZ3JvdW5kOiBcInRyYW5zcGFyZW50XCIsXG4gICAgYm9yZGVyOiBcIm5vbmVcIixcbiAgICBjb2xvcjogXCJ2YXIoLS1tZGMtdGhlbWUtcHJpbWFyeSlcIixcbiAgICBwYWRkaW5nOiBcIjJweCA1cHhcIixcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgXCI+IHN2Z1wiOiB7XG4gICAgICAgIGNvbG9yOiBcInZhcigtLW1kYy10aGVtZS1wcmltYXJ5KVwiLFxuICAgICAgICB3aWR0aDogXCIxNnB4XCIsXG4gICAgICAgIGhlaWdodDogXCIxNnB4XCIsXG4gICAgICAgIG1hcmdpblJpZ2h0OiAxMFxuICAgIH1cbn0pO1xuXG5pbnRlcmZhY2UgT3B0aW9uc1Byb3BzIHtcbiAgICBtb2RlbHM6IENtc01vZGVsW107XG4gICAgb25OZXdSZWNvcmQ6IChtb2RlbElkOiBzdHJpbmcpID0+IHZvaWQ7XG4gICAgb25MaW5rRXhpc3RpbmdSZWNvcmQ6IChtb2RlbElkOiBzdHJpbmcpID0+IHZvaWQ7XG59XG5leHBvcnQgY29uc3QgT3B0aW9ucyA9ICh7IG1vZGVscywgb25OZXdSZWNvcmQsIG9uTGlua0V4aXN0aW5nUmVjb3JkIH06IE9wdGlvbnNQcm9wcykgPT4ge1xuICAgIGNvbnN0IGhhc011bHRpcGxlTW9kZWxzID0gbW9kZWxzLmxlbmd0aCA+IDE7XG4gICAgY29uc3Qgb25TaW5nbGVOZXdSZWNvcmQgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgICAgIGlmIChtb2RlbHMubGVuZ3RoID09PSAwIHx8IGhhc011bHRpcGxlTW9kZWxzKSB7XG4gICAgICAgICAgICByZXR1cm47XG4gICAgICAgIH1cbiAgICAgICAgb25OZXdSZWNvcmQobW9kZWxzWzBdLm1vZGVsSWQpO1xuICAgIH0sIFttb2RlbHNdKTtcblxuICAgIGNvbnN0IG9uU2luZ2xlRXhpc3RpbmdSZWNvcmQgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgICAgIGlmIChtb2RlbHMubGVuZ3RoID09PSAwIHx8IGhhc011bHRpcGxlTW9kZWxzKSB7XG4gICAgICAgICAgICByZXR1cm47XG4gICAgICAgIH1cbiAgICAgICAgb25MaW5rRXhpc3RpbmdSZWNvcmQobW9kZWxzWzBdLm1vZGVsSWQpO1xuICAgIH0sIFttb2RlbHNdKTtcbiAgICByZXR1cm4gKFxuICAgICAgICA8Q29udGFpbmVyPlxuICAgICAgICAgICAgPE5ld1JlY29yZD5cbiAgICAgICAgICAgICAgICA8TmV3UmVjb3JkQnV0dG9uIG9uQ2xpY2s9e29uU2luZ2xlTmV3UmVjb3JkfT5cbiAgICAgICAgICAgICAgICAgICAgPEFkZEljb24gLz4gY3JlYXRlIGEgbmV3IHJlY29yZFxuICAgICAgICAgICAgICAgIDwvTmV3UmVjb3JkQnV0dG9uPlxuICAgICAgICAgICAgICAgIDxPcHRpb25zTW9kZWxMaXN0IG9uQ2xpY2s9e29uTmV3UmVjb3JkfSBtb2RlbHM9e21vZGVsc30gLz5cbiAgICAgICAgICAgIDwvTmV3UmVjb3JkPlxuICAgICAgICAgICAgPExpbmtFeGlzdGluZ1JlY29yZD5cbiAgICAgICAgICAgICAgICA8TGlua0V4aXN0aW5nUmVjb3JkQnV0dG9uIG9uQ2xpY2s9e29uU2luZ2xlRXhpc3RpbmdSZWNvcmR9PlxuICAgICAgICAgICAgICAgICAgICA8TGlua0ljb24gLz4gbGluayBhbiBleGlzdGluZyByZWNvcmRcbiAgICAgICAgICAgICAgICA8L0xpbmtFeGlzdGluZ1JlY29yZEJ1dHRvbj5cbiAgICAgICAgICAgICAgICA8T3B0aW9uc01vZGVsTGlzdCBvbkNsaWNrPXtvbkxpbmtFeGlzdGluZ1JlY29yZH0gbW9kZWxzPXttb2RlbHN9IC8+XG4gICAgICAgICAgICA8L0xpbmtFeGlzdGluZ1JlY29yZD5cbiAgICAgICAgPC9Db250YWluZXI+XG4gICAgKTtcbn07XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var NewRecordButton = /*#__PURE__*/(0, _base.default)("button", process.env.NODE_ENV === "production" ? {
-  target: "e1k00edo2"
-} : {
-  target: "e1k00edo2",
-  label: "NewRecordButton"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1mpzhih",
-  styles: "background:transparent;border:none;color:var(--mdc-theme-primary);padding:2px 2px;cursor:pointer;align-items:center;display:flex;> svg{color:var(--mdc-theme-primary);width:16px;height:16px;margin-right:10px;}"
-} : {
-  name: "1mpzhih",
-  styles: "background:transparent;border:none;color:var(--mdc-theme-primary);padding:2px 2px;cursor:pointer;align-items:center;display:flex;> svg{color:var(--mdc-theme-primary);width:16px;height:16px;margin-right:10px;}",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk9wdGlvbnMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXlCd0IiLCJmaWxlIjoiT3B0aW9ucy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgdXNlQ2FsbGJhY2sgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgQ21zTW9kZWwgfSBmcm9tIFwifi90eXBlc1wiO1xuaW1wb3J0IHsgT3B0aW9uc01vZGVsTGlzdCB9IGZyb20gXCJ+L2FkbWluL3BsdWdpbnMvZmllbGRSZW5kZXJlcnMvcmVmL2FkdmFuY2VkL2NvbXBvbmVudHMvb3B0aW9ucy9PcHRpb25zTW9kZWxMaXN0XCI7XG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBMaW5rSWNvbiB9IGZyb20gXCIuL2Fzc2V0cy9saW5rLnN2Z1wiO1xuaW1wb3J0IHsgUmVhY3RDb21wb25lbnQgYXMgQWRkSWNvbiB9IGZyb20gXCIuL2Fzc2V0cy9hZGQtY2lyY2xlLnN2Z1wiO1xuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGZsZXhEaXJlY3Rpb246IFwicm93XCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiXG59KTtcbmNvbnN0IE5ld1JlY29yZCA9IHN0eWxlZChcImRpdlwiKSh7XG4gICAgYm9yZGVyUmlnaHQ6IFwiMnB4IHNvbGlkIHZhcigtLW1kYy10aGVtZS1iYWNrZ3JvdW5kKVwiLFxuICAgIHBhZGRpbmc6IFwiMTBweCAxNXB4XCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgcG9zaXRpb246IFwicmVsYXRpdmVcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIFwiID4gZGl2IFwiOiB7XG4gICAgICAgIGRpc3BsYXk6IFwibm9uZVwiXG4gICAgfSxcbiAgICBcIjpob3ZlciA+IGRpdlwiOiB7XG4gICAgICAgIGRpc3BsYXk6IFwiYmxvY2tcIlxuICAgIH1cbn0pO1xuY29uc3QgTmV3UmVjb3JkQnV0dG9uID0gc3R5bGVkKFwiYnV0dG9uXCIpKHtcbiAgICBiYWNrZ3JvdW5kOiBcInRyYW5zcGFyZW50XCIsXG4gICAgYm9yZGVyOiBcIm5vbmVcIixcbiAgICBjb2xvcjogXCJ2YXIoLS1tZGMtdGhlbWUtcHJpbWFyeSlcIixcbiAgICBwYWRkaW5nOiBcIjJweCAycHhcIixcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgXCI+IHN2Z1wiOiB7XG4gICAgICAgIGNvbG9yOiBcInZhcigtLW1kYy10aGVtZS1wcmltYXJ5KVwiLFxuICAgICAgICB3aWR0aDogXCIxNnB4XCIsXG4gICAgICAgIGhlaWdodDogXCIxNnB4XCIsXG4gICAgICAgIG1hcmdpblJpZ2h0OiAxMFxuICAgIH1cbn0pO1xuY29uc3QgTGlua0V4aXN0aW5nUmVjb3JkID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBwYWRkaW5nOiBcIjEwcHggMTVweFwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgcG9zaXRpb246IFwicmVsYXRpdmVcIixcbiAgICBcIiA+IGRpdiBcIjoge1xuICAgICAgICBkaXNwbGF5OiBcIm5vbmVcIlxuICAgIH0sXG4gICAgXCI6aG92ZXIgPiBkaXZcIjoge1xuICAgICAgICBkaXNwbGF5OiBcImJsb2NrXCJcbiAgICB9XG59KTtcbmNvbnN0IExpbmtFeGlzdGluZ1JlY29yZEJ1dHRvbiA9IHN0eWxlZChcImJ1dHRvblwiKSh7XG4gICAgYmFja2dyb3VuZDogXCJ0cmFuc3BhcmVudFwiLFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgY29sb3I6IFwidmFyKC0tbWRjLXRoZW1lLXByaW1hcnkpXCIsXG4gICAgcGFkZGluZzogXCIycHggNXB4XCIsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIFwiPiBzdmdcIjoge1xuICAgICAgICBjb2xvcjogXCJ2YXIoLS1tZGMtdGhlbWUtcHJpbWFyeSlcIixcbiAgICAgICAgd2lkdGg6IFwiMTZweFwiLFxuICAgICAgICBoZWlnaHQ6IFwiMTZweFwiLFxuICAgICAgICBtYXJnaW5SaWdodDogMTBcbiAgICB9XG59KTtcblxuaW50ZXJmYWNlIE9wdGlvbnNQcm9wcyB7XG4gICAgbW9kZWxzOiBDbXNNb2RlbFtdO1xuICAgIG9uTmV3UmVjb3JkOiAobW9kZWxJZDogc3RyaW5nKSA9PiB2b2lkO1xuICAgIG9uTGlua0V4aXN0aW5nUmVjb3JkOiAobW9kZWxJZDogc3RyaW5nKSA9PiB2b2lkO1xufVxuZXhwb3J0IGNvbnN0IE9wdGlvbnMgPSAoeyBtb2RlbHMsIG9uTmV3UmVjb3JkLCBvbkxpbmtFeGlzdGluZ1JlY29yZCB9OiBPcHRpb25zUHJvcHMpID0+IHtcbiAgICBjb25zdCBoYXNNdWx0aXBsZU1vZGVscyA9IG1vZGVscy5sZW5ndGggPiAxO1xuICAgIGNvbnN0IG9uU2luZ2xlTmV3UmVjb3JkID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgICAgICBpZiAobW9kZWxzLmxlbmd0aCA9PT0gMCB8fCBoYXNNdWx0aXBsZU1vZGVscykge1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9XG4gICAgICAgIG9uTmV3UmVjb3JkKG1vZGVsc1swXS5tb2RlbElkKTtcbiAgICB9LCBbbW9kZWxzXSk7XG5cbiAgICBjb25zdCBvblNpbmdsZUV4aXN0aW5nUmVjb3JkID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgICAgICBpZiAobW9kZWxzLmxlbmd0aCA9PT0gMCB8fCBoYXNNdWx0aXBsZU1vZGVscykge1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9XG4gICAgICAgIG9uTGlua0V4aXN0aW5nUmVjb3JkKG1vZGVsc1swXS5tb2RlbElkKTtcbiAgICB9LCBbbW9kZWxzXSk7XG4gICAgcmV0dXJuIChcbiAgICAgICAgPENvbnRhaW5lcj5cbiAgICAgICAgICAgIDxOZXdSZWNvcmQ+XG4gICAgICAgICAgICAgICAgPE5ld1JlY29yZEJ1dHRvbiBvbkNsaWNrPXtvblNpbmdsZU5ld1JlY29yZH0+XG4gICAgICAgICAgICAgICAgICAgIDxBZGRJY29uIC8+IGNyZWF0ZSBhIG5ldyByZWNvcmRcbiAgICAgICAgICAgICAgICA8L05ld1JlY29yZEJ1dHRvbj5cbiAgICAgICAgICAgICAgICA8T3B0aW9uc01vZGVsTGlzdCBvbkNsaWNrPXtvbk5ld1JlY29yZH0gbW9kZWxzPXttb2RlbHN9IC8+XG4gICAgICAgICAgICA8L05ld1JlY29yZD5cbiAgICAgICAgICAgIDxMaW5rRXhpc3RpbmdSZWNvcmQ+XG4gICAgICAgICAgICAgICAgPExpbmtFeGlzdGluZ1JlY29yZEJ1dHRvbiBvbkNsaWNrPXtvblNpbmdsZUV4aXN0aW5nUmVjb3JkfT5cbiAgICAgICAgICAgICAgICAgICAgPExpbmtJY29uIC8+IGxpbmsgYW4gZXhpc3RpbmcgcmVjb3JkXG4gICAgICAgICAgICAgICAgPC9MaW5rRXhpc3RpbmdSZWNvcmRCdXR0b24+XG4gICAgICAgICAgICAgICAgPE9wdGlvbnNNb2RlbExpc3Qgb25DbGljaz17b25MaW5rRXhpc3RpbmdSZWNvcmR9IG1vZGVscz17bW9kZWxzfSAvPlxuICAgICAgICAgICAgPC9MaW5rRXhpc3RpbmdSZWNvcmQ+XG4gICAgICAgIDwvQ29udGFpbmVyPlxuICAgICk7XG59O1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var LinkExistingRecord = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e1k00edo1"
-} : {
-  target: "e1k00edo1",
-  label: "LinkExistingRecord"
-})(process.env.NODE_ENV === "production" ? {
-  name: "ha1x58",
-  styles: "padding:10px 15px;align-items:center;display:flex;position:relative; > div {display:none;}:hover > div{display:block;}"
-} : {
-  name: "ha1x58",
-  styles: "padding:10px 15px;align-items:center;display:flex;position:relative; > div {display:none;}:hover > div{display:block;}",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk9wdGlvbnMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXdDMkIiLCJmaWxlIjoiT3B0aW9ucy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgdXNlQ2FsbGJhY2sgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgQ21zTW9kZWwgfSBmcm9tIFwifi90eXBlc1wiO1xuaW1wb3J0IHsgT3B0aW9uc01vZGVsTGlzdCB9IGZyb20gXCJ+L2FkbWluL3BsdWdpbnMvZmllbGRSZW5kZXJlcnMvcmVmL2FkdmFuY2VkL2NvbXBvbmVudHMvb3B0aW9ucy9PcHRpb25zTW9kZWxMaXN0XCI7XG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBMaW5rSWNvbiB9IGZyb20gXCIuL2Fzc2V0cy9saW5rLnN2Z1wiO1xuaW1wb3J0IHsgUmVhY3RDb21wb25lbnQgYXMgQWRkSWNvbiB9IGZyb20gXCIuL2Fzc2V0cy9hZGQtY2lyY2xlLnN2Z1wiO1xuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGZsZXhEaXJlY3Rpb246IFwicm93XCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiXG59KTtcbmNvbnN0IE5ld1JlY29yZCA9IHN0eWxlZChcImRpdlwiKSh7XG4gICAgYm9yZGVyUmlnaHQ6IFwiMnB4IHNvbGlkIHZhcigtLW1kYy10aGVtZS1iYWNrZ3JvdW5kKVwiLFxuICAgIHBhZGRpbmc6IFwiMTBweCAxNXB4XCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgcG9zaXRpb246IFwicmVsYXRpdmVcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIFwiID4gZGl2IFwiOiB7XG4gICAgICAgIGRpc3BsYXk6IFwibm9uZVwiXG4gICAgfSxcbiAgICBcIjpob3ZlciA+IGRpdlwiOiB7XG4gICAgICAgIGRpc3BsYXk6IFwiYmxvY2tcIlxuICAgIH1cbn0pO1xuY29uc3QgTmV3UmVjb3JkQnV0dG9uID0gc3R5bGVkKFwiYnV0dG9uXCIpKHtcbiAgICBiYWNrZ3JvdW5kOiBcInRyYW5zcGFyZW50XCIsXG4gICAgYm9yZGVyOiBcIm5vbmVcIixcbiAgICBjb2xvcjogXCJ2YXIoLS1tZGMtdGhlbWUtcHJpbWFyeSlcIixcbiAgICBwYWRkaW5nOiBcIjJweCAycHhcIixcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgXCI+IHN2Z1wiOiB7XG4gICAgICAgIGNvbG9yOiBcInZhcigtLW1kYy10aGVtZS1wcmltYXJ5KVwiLFxuICAgICAgICB3aWR0aDogXCIxNnB4XCIsXG4gICAgICAgIGhlaWdodDogXCIxNnB4XCIsXG4gICAgICAgIG1hcmdpblJpZ2h0OiAxMFxuICAgIH1cbn0pO1xuY29uc3QgTGlua0V4aXN0aW5nUmVjb3JkID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBwYWRkaW5nOiBcIjEwcHggMTVweFwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgcG9zaXRpb246IFwicmVsYXRpdmVcIixcbiAgICBcIiA+IGRpdiBcIjoge1xuICAgICAgICBkaXNwbGF5OiBcIm5vbmVcIlxuICAgIH0sXG4gICAgXCI6aG92ZXIgPiBkaXZcIjoge1xuICAgICAgICBkaXNwbGF5OiBcImJsb2NrXCJcbiAgICB9XG59KTtcbmNvbnN0IExpbmtFeGlzdGluZ1JlY29yZEJ1dHRvbiA9IHN0eWxlZChcImJ1dHRvblwiKSh7XG4gICAgYmFja2dyb3VuZDogXCJ0cmFuc3BhcmVudFwiLFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgY29sb3I6IFwidmFyKC0tbWRjLXRoZW1lLXByaW1hcnkpXCIsXG4gICAgcGFkZGluZzogXCIycHggNXB4XCIsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIFwiPiBzdmdcIjoge1xuICAgICAgICBjb2xvcjogXCJ2YXIoLS1tZGMtdGhlbWUtcHJpbWFyeSlcIixcbiAgICAgICAgd2lkdGg6IFwiMTZweFwiLFxuICAgICAgICBoZWlnaHQ6IFwiMTZweFwiLFxuICAgICAgICBtYXJnaW5SaWdodDogMTBcbiAgICB9XG59KTtcblxuaW50ZXJmYWNlIE9wdGlvbnNQcm9wcyB7XG4gICAgbW9kZWxzOiBDbXNNb2RlbFtdO1xuICAgIG9uTmV3UmVjb3JkOiAobW9kZWxJZDogc3RyaW5nKSA9PiB2b2lkO1xuICAgIG9uTGlua0V4aXN0aW5nUmVjb3JkOiAobW9kZWxJZDogc3RyaW5nKSA9PiB2b2lkO1xufVxuZXhwb3J0IGNvbnN0IE9wdGlvbnMgPSAoeyBtb2RlbHMsIG9uTmV3UmVjb3JkLCBvbkxpbmtFeGlzdGluZ1JlY29yZCB9OiBPcHRpb25zUHJvcHMpID0+IHtcbiAgICBjb25zdCBoYXNNdWx0aXBsZU1vZGVscyA9IG1vZGVscy5sZW5ndGggPiAxO1xuICAgIGNvbnN0IG9uU2luZ2xlTmV3UmVjb3JkID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgICAgICBpZiAobW9kZWxzLmxlbmd0aCA9PT0gMCB8fCBoYXNNdWx0aXBsZU1vZGVscykge1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9XG4gICAgICAgIG9uTmV3UmVjb3JkKG1vZGVsc1swXS5tb2RlbElkKTtcbiAgICB9LCBbbW9kZWxzXSk7XG5cbiAgICBjb25zdCBvblNpbmdsZUV4aXN0aW5nUmVjb3JkID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgICAgICBpZiAobW9kZWxzLmxlbmd0aCA9PT0gMCB8fCBoYXNNdWx0aXBsZU1vZGVscykge1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9XG4gICAgICAgIG9uTGlua0V4aXN0aW5nUmVjb3JkKG1vZGVsc1swXS5tb2RlbElkKTtcbiAgICB9LCBbbW9kZWxzXSk7XG4gICAgcmV0dXJuIChcbiAgICAgICAgPENvbnRhaW5lcj5cbiAgICAgICAgICAgIDxOZXdSZWNvcmQ+XG4gICAgICAgICAgICAgICAgPE5ld1JlY29yZEJ1dHRvbiBvbkNsaWNrPXtvblNpbmdsZU5ld1JlY29yZH0+XG4gICAgICAgICAgICAgICAgICAgIDxBZGRJY29uIC8+IGNyZWF0ZSBhIG5ldyByZWNvcmRcbiAgICAgICAgICAgICAgICA8L05ld1JlY29yZEJ1dHRvbj5cbiAgICAgICAgICAgICAgICA8T3B0aW9uc01vZGVsTGlzdCBvbkNsaWNrPXtvbk5ld1JlY29yZH0gbW9kZWxzPXttb2RlbHN9IC8+XG4gICAgICAgICAgICA8L05ld1JlY29yZD5cbiAgICAgICAgICAgIDxMaW5rRXhpc3RpbmdSZWNvcmQ+XG4gICAgICAgICAgICAgICAgPExpbmtFeGlzdGluZ1JlY29yZEJ1dHRvbiBvbkNsaWNrPXtvblNpbmdsZUV4aXN0aW5nUmVjb3JkfT5cbiAgICAgICAgICAgICAgICAgICAgPExpbmtJY29uIC8+IGxpbmsgYW4gZXhpc3RpbmcgcmVjb3JkXG4gICAgICAgICAgICAgICAgPC9MaW5rRXhpc3RpbmdSZWNvcmRCdXR0b24+XG4gICAgICAgICAgICAgICAgPE9wdGlvbnNNb2RlbExpc3Qgb25DbGljaz17b25MaW5rRXhpc3RpbmdSZWNvcmR9IG1vZGVscz17bW9kZWxzfSAvPlxuICAgICAgICAgICAgPC9MaW5rRXhpc3RpbmdSZWNvcmQ+XG4gICAgICAgIDwvQ29udGFpbmVyPlxuICAgICk7XG59O1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var LinkExistingRecordButton = /*#__PURE__*/(0, _base.default)("button", process.env.NODE_ENV === "production" ? {
-  target: "e1k00edo0"
-} : {
-  target: "e1k00edo0",
-  label: "LinkExistingRecordButton"
-})(process.env.NODE_ENV === "production" ? {
-  name: "yynlqn",
-  styles: "background:transparent;border:none;color:var(--mdc-theme-primary);padding:2px 5px;cursor:pointer;align-items:center;display:flex;> svg{color:var(--mdc-theme-primary);width:16px;height:16px;margin-right:10px;}"
-} : {
-  name: "yynlqn",
-  styles: "background:transparent;border:none;color:var(--mdc-theme-primary);padding:2px 5px;cursor:pointer;align-items:center;display:flex;> svg{color:var(--mdc-theme-primary);width:16px;height:16px;margin-right:10px;}",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk9wdGlvbnMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW9EaUMiLCJmaWxlIjoiT3B0aW9ucy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgdXNlQ2FsbGJhY2sgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgQ21zTW9kZWwgfSBmcm9tIFwifi90eXBlc1wiO1xuaW1wb3J0IHsgT3B0aW9uc01vZGVsTGlzdCB9IGZyb20gXCJ+L2FkbWluL3BsdWdpbnMvZmllbGRSZW5kZXJlcnMvcmVmL2FkdmFuY2VkL2NvbXBvbmVudHMvb3B0aW9ucy9PcHRpb25zTW9kZWxMaXN0XCI7XG5pbXBvcnQgeyBSZWFjdENvbXBvbmVudCBhcyBMaW5rSWNvbiB9IGZyb20gXCIuL2Fzc2V0cy9saW5rLnN2Z1wiO1xuaW1wb3J0IHsgUmVhY3RDb21wb25lbnQgYXMgQWRkSWNvbiB9IGZyb20gXCIuL2Fzc2V0cy9hZGQtY2lyY2xlLnN2Z1wiO1xuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGZsZXhEaXJlY3Rpb246IFwicm93XCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiXG59KTtcbmNvbnN0IE5ld1JlY29yZCA9IHN0eWxlZChcImRpdlwiKSh7XG4gICAgYm9yZGVyUmlnaHQ6IFwiMnB4IHNvbGlkIHZhcigtLW1kYy10aGVtZS1iYWNrZ3JvdW5kKVwiLFxuICAgIHBhZGRpbmc6IFwiMTBweCAxNXB4XCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgcG9zaXRpb246IFwicmVsYXRpdmVcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIFwiID4gZGl2IFwiOiB7XG4gICAgICAgIGRpc3BsYXk6IFwibm9uZVwiXG4gICAgfSxcbiAgICBcIjpob3ZlciA+IGRpdlwiOiB7XG4gICAgICAgIGRpc3BsYXk6IFwiYmxvY2tcIlxuICAgIH1cbn0pO1xuY29uc3QgTmV3UmVjb3JkQnV0dG9uID0gc3R5bGVkKFwiYnV0dG9uXCIpKHtcbiAgICBiYWNrZ3JvdW5kOiBcInRyYW5zcGFyZW50XCIsXG4gICAgYm9yZGVyOiBcIm5vbmVcIixcbiAgICBjb2xvcjogXCJ2YXIoLS1tZGMtdGhlbWUtcHJpbWFyeSlcIixcbiAgICBwYWRkaW5nOiBcIjJweCAycHhcIixcbiAgICBjdXJzb3I6IFwicG9pbnRlclwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgXCI+IHN2Z1wiOiB7XG4gICAgICAgIGNvbG9yOiBcInZhcigtLW1kYy10aGVtZS1wcmltYXJ5KVwiLFxuICAgICAgICB3aWR0aDogXCIxNnB4XCIsXG4gICAgICAgIGhlaWdodDogXCIxNnB4XCIsXG4gICAgICAgIG1hcmdpblJpZ2h0OiAxMFxuICAgIH1cbn0pO1xuY29uc3QgTGlua0V4aXN0aW5nUmVjb3JkID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBwYWRkaW5nOiBcIjEwcHggMTVweFwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgZGlzcGxheTogXCJmbGV4XCIsXG4gICAgcG9zaXRpb246IFwicmVsYXRpdmVcIixcbiAgICBcIiA+IGRpdiBcIjoge1xuICAgICAgICBkaXNwbGF5OiBcIm5vbmVcIlxuICAgIH0sXG4gICAgXCI6aG92ZXIgPiBkaXZcIjoge1xuICAgICAgICBkaXNwbGF5OiBcImJsb2NrXCJcbiAgICB9XG59KTtcbmNvbnN0IExpbmtFeGlzdGluZ1JlY29yZEJ1dHRvbiA9IHN0eWxlZChcImJ1dHRvblwiKSh7XG4gICAgYmFja2dyb3VuZDogXCJ0cmFuc3BhcmVudFwiLFxuICAgIGJvcmRlcjogXCJub25lXCIsXG4gICAgY29sb3I6IFwidmFyKC0tbWRjLXRoZW1lLXByaW1hcnkpXCIsXG4gICAgcGFkZGluZzogXCIycHggNXB4XCIsXG4gICAgY3Vyc29yOiBcInBvaW50ZXJcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIFwiPiBzdmdcIjoge1xuICAgICAgICBjb2xvcjogXCJ2YXIoLS1tZGMtdGhlbWUtcHJpbWFyeSlcIixcbiAgICAgICAgd2lkdGg6IFwiMTZweFwiLFxuICAgICAgICBoZWlnaHQ6IFwiMTZweFwiLFxuICAgICAgICBtYXJnaW5SaWdodDogMTBcbiAgICB9XG59KTtcblxuaW50ZXJmYWNlIE9wdGlvbnNQcm9wcyB7XG4gICAgbW9kZWxzOiBDbXNNb2RlbFtdO1xuICAgIG9uTmV3UmVjb3JkOiAobW9kZWxJZDogc3RyaW5nKSA9PiB2b2lkO1xuICAgIG9uTGlua0V4aXN0aW5nUmVjb3JkOiAobW9kZWxJZDogc3RyaW5nKSA9PiB2b2lkO1xufVxuZXhwb3J0IGNvbnN0IE9wdGlvbnMgPSAoeyBtb2RlbHMsIG9uTmV3UmVjb3JkLCBvbkxpbmtFeGlzdGluZ1JlY29yZCB9OiBPcHRpb25zUHJvcHMpID0+IHtcbiAgICBjb25zdCBoYXNNdWx0aXBsZU1vZGVscyA9IG1vZGVscy5sZW5ndGggPiAxO1xuICAgIGNvbnN0IG9uU2luZ2xlTmV3UmVjb3JkID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgICAgICBpZiAobW9kZWxzLmxlbmd0aCA9PT0gMCB8fCBoYXNNdWx0aXBsZU1vZGVscykge1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9XG4gICAgICAgIG9uTmV3UmVjb3JkKG1vZGVsc1swXS5tb2RlbElkKTtcbiAgICB9LCBbbW9kZWxzXSk7XG5cbiAgICBjb25zdCBvblNpbmdsZUV4aXN0aW5nUmVjb3JkID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgICAgICBpZiAobW9kZWxzLmxlbmd0aCA9PT0gMCB8fCBoYXNNdWx0aXBsZU1vZGVscykge1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9XG4gICAgICAgIG9uTGlua0V4aXN0aW5nUmVjb3JkKG1vZGVsc1swXS5tb2RlbElkKTtcbiAgICB9LCBbbW9kZWxzXSk7XG4gICAgcmV0dXJuIChcbiAgICAgICAgPENvbnRhaW5lcj5cbiAgICAgICAgICAgIDxOZXdSZWNvcmQ+XG4gICAgICAgICAgICAgICAgPE5ld1JlY29yZEJ1dHRvbiBvbkNsaWNrPXtvblNpbmdsZU5ld1JlY29yZH0+XG4gICAgICAgICAgICAgICAgICAgIDxBZGRJY29uIC8+IGNyZWF0ZSBhIG5ldyByZWNvcmRcbiAgICAgICAgICAgICAgICA8L05ld1JlY29yZEJ1dHRvbj5cbiAgICAgICAgICAgICAgICA8T3B0aW9uc01vZGVsTGlzdCBvbkNsaWNrPXtvbk5ld1JlY29yZH0gbW9kZWxzPXttb2RlbHN9IC8+XG4gICAgICAgICAgICA8L05ld1JlY29yZD5cbiAgICAgICAgICAgIDxMaW5rRXhpc3RpbmdSZWNvcmQ+XG4gICAgICAgICAgICAgICAgPExpbmtFeGlzdGluZ1JlY29yZEJ1dHRvbiBvbkNsaWNrPXtvblNpbmdsZUV4aXN0aW5nUmVjb3JkfT5cbiAgICAgICAgICAgICAgICAgICAgPExpbmtJY29uIC8+IGxpbmsgYW4gZXhpc3RpbmcgcmVjb3JkXG4gICAgICAgICAgICAgICAgPC9MaW5rRXhpc3RpbmdSZWNvcmRCdXR0b24+XG4gICAgICAgICAgICAgICAgPE9wdGlvbnNNb2RlbExpc3Qgb25DbGljaz17b25MaW5rRXhpc3RpbmdSZWNvcmR9IG1vZGVscz17bW9kZWxzfSAvPlxuICAgICAgICAgICAgPC9MaW5rRXhpc3RpbmdSZWNvcmQ+XG4gICAgICAgIDwvQ29udGFpbmVyPlxuICAgICk7XG59O1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var Options = exports.Options = function Options(_ref) {
-  var models = _ref.models,
-    onNewRecord = _ref.onNewRecord,
-    onLinkExistingRecord = _ref.onLinkExistingRecord;
-  var hasMultipleModels = models.length > 1;
-  var onSingleNewRecord = (0, _react.useCallback)(function () {
+import React, { useCallback } from "react";
+import { OptionsModelList } from "./options/OptionsModelList.js";
+import { ReactComponent as AddIcon } from "@webiny/icons/add.svg";
+import { ReactComponent as LinkIcon } from "@webiny/icons/link.svg";
+import { Button, DropdownMenu } from "@webiny/admin-ui";
+const CreateNewRecordButton = props => {
+  return /*#__PURE__*/React.createElement(Button, Object.assign({}, props, {
+    variant: "tertiary",
+    text: "Create a new record",
+    icon: /*#__PURE__*/React.createElement(AddIcon, null)
+  }));
+};
+const LinkExistingRecordButton = props => {
+  return /*#__PURE__*/React.createElement(Button, Object.assign({}, props, {
+    variant: "tertiary",
+    text: "Select an existing record",
+    icon: /*#__PURE__*/React.createElement(LinkIcon, null)
+  }));
+};
+export const Options = ({
+  models,
+  onNewRecord,
+  onLinkExistingRecord
+}) => {
+  const hasMultipleModels = models.length > 1;
+  const onSingleNewRecord = useCallback(() => {
     if (models.length === 0 || hasMultipleModels) {
       return;
     }
     onNewRecord(models[0].modelId);
   }, [models]);
-  var onSingleExistingRecord = (0, _react.useCallback)(function () {
+  const onSingleExistingRecord = useCallback(() => {
     if (models.length === 0 || hasMultipleModels) {
       return;
     }
     onLinkExistingRecord(models[0].modelId);
   }, [models]);
-  return /*#__PURE__*/_react.default.createElement(Container, null, /*#__PURE__*/_react.default.createElement(NewRecord, null, /*#__PURE__*/_react.default.createElement(NewRecordButton, {
+  if (hasMultipleModels) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "flex gap-sm"
+    }, /*#__PURE__*/React.createElement(DropdownMenu, {
+      trigger: /*#__PURE__*/React.createElement(Button, {
+        variant: "tertiary",
+        text: "Create a new record",
+        icon: /*#__PURE__*/React.createElement(AddIcon, null)
+      })
+    }, /*#__PURE__*/React.createElement(OptionsModelList, {
+      onClick: onNewRecord,
+      models: models
+    })), /*#__PURE__*/React.createElement(DropdownMenu, {
+      trigger: /*#__PURE__*/React.createElement(Button, {
+        variant: "tertiary",
+        text: "Select an existing record",
+        icon: /*#__PURE__*/React.createElement(LinkIcon, null)
+      })
+    }, /*#__PURE__*/React.createElement(OptionsModelList, {
+      onClick: onLinkExistingRecord,
+      models: models
+    })));
+  }
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CreateNewRecordButton, {
     onClick: onSingleNewRecord
-  }, /*#__PURE__*/_react.default.createElement(_addCircle.ReactComponent, null), " create a new record"), /*#__PURE__*/_react.default.createElement(_OptionsModelList.OptionsModelList, {
-    onClick: onNewRecord,
-    models: models
-  })), /*#__PURE__*/_react.default.createElement(LinkExistingRecord, null, /*#__PURE__*/_react.default.createElement(LinkExistingRecordButton, {
+  }), "\xA0", /*#__PURE__*/React.createElement(LinkExistingRecordButton, {
     onClick: onSingleExistingRecord
-  }, /*#__PURE__*/_react.default.createElement(_link.ReactComponent, null), " link an existing record"), /*#__PURE__*/_react.default.createElement(_OptionsModelList.OptionsModelList, {
-    onClick: onLinkExistingRecord,
-    models: models
-  })));
+  }));
 };
 
 //# sourceMappingURL=Options.js.map

package/admin/plugins/fieldRenderers/ref/advanced/components/Options.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_OptionsModelList","_link","_addCircle","_EMOTION_STRINGIFIED_CSS_ERROR__","Container","_base","default","process","env","NODE_ENV","target","label","name","styles","map","toString","NewRecord","NewRecordButton","LinkExistingRecord","LinkExistingRecordButton","Options","exports","_ref","models","onNewRecord","onLinkExistingRecord","hasMultipleModels","length","onSingleNewRecord","useCallback","modelId","onSingleExistingRecord","createElement","onClick","ReactComponent","OptionsModelList"],"sources":["Options.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { CmsModel } from \"~/types\";\nimport { OptionsModelList } from \"~/admin/plugins/fieldRenderers/ref/advanced/components/options/OptionsModelList\";\nimport { ReactComponent as LinkIcon } from \"./assets/link.svg\";\nimport { ReactComponent as AddIcon } from \"./assets/add-circle.svg\";\n\nconst Container = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"row\",\n    width: \"100%\"\n});\nconst NewRecord = styled(\"div\")({\n    borderRight: \"2px solid var(--mdc-theme-background)\",\n    padding: \"10px 15px\",\n    display: \"flex\",\n    position: \"relative\",\n    alignItems: \"center\",\n    \" > div \": {\n        display: \"none\"\n    },\n    \":hover > div\": {\n        display: \"block\"\n    }\n});\nconst NewRecordButton = styled(\"button\")({\n    background: \"transparent\",\n    border: \"none\",\n    color: \"var(--mdc-theme-primary)\",\n    padding: \"2px 2px\",\n    cursor: \"pointer\",\n    alignItems: \"center\",\n    display: \"flex\",\n    \"> svg\": {\n        color: \"var(--mdc-theme-primary)\",\n        width: \"16px\",\n        height: \"16px\",\n        marginRight: 10\n    }\n});\nconst LinkExistingRecord = styled(\"div\")({\n    padding: \"10px 15px\",\n    alignItems: \"center\",\n    display: \"flex\",\n    position: \"relative\",\n    \" > div \": {\n        display: \"none\"\n    },\n    \":hover > div\": {\n        display: \"block\"\n    }\n});\nconst LinkExistingRecordButton = styled(\"button\")({\n    background: \"transparent\",\n    border: \"none\",\n    color: \"var(--mdc-theme-primary)\",\n    padding: \"2px 5px\",\n    cursor: \"pointer\",\n    alignItems: \"center\",\n    display: \"flex\",\n    \"> svg\": {\n        color: \"var(--mdc-theme-primary)\",\n        width: \"16px\",\n        height: \"16px\",\n        marginRight: 10\n    }\n});\n\ninterface OptionsProps {\n    models: CmsModel[];\n    onNewRecord: (modelId: string) => void;\n    onLinkExistingRecord: (modelId: string) => void;\n}\nexport const Options = ({ models, onNewRecord, onLinkExistingRecord }: OptionsProps) => {\n    const hasMultipleModels = models.length > 1;\n    const onSingleNewRecord = useCallback(() => {\n        if (models.length === 0 || hasMultipleModels) {\n            return;\n        }\n        onNewRecord(models[0].modelId);\n    }, [models]);\n\n    const onSingleExistingRecord = useCallback(() => {\n        if (models.length === 0 || hasMultipleModels) {\n            return;\n        }\n        onLinkExistingRecord(models[0].modelId);\n    }, [models]);\n    return (\n        <Container>\n            <NewRecord>\n                <NewRecordButton onClick={onSingleNewRecord}>\n                    <AddIcon /> create a new record\n                </NewRecordButton>\n                <OptionsModelList onClick={onNewRecord} models={models} />\n            </NewRecord>\n            <LinkExistingRecord>\n                <LinkExistingRecordButton onClick={onSingleExistingRecord}>\n                    <LinkIcon /> link an existing record\n                </LinkExistingRecordButton>\n                <OptionsModelList onClick={onLinkExistingRecord} models={models} />\n            </LinkExistingRecord>\n        </Container>\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useCallback","OptionsModelList","ReactComponent","AddIcon","LinkIcon","Button","DropdownMenu","CreateNewRecordButton","props","createElement","Object","assign","variant","text","icon","LinkExistingRecordButton","Options","models","onNewRecord","onLinkExistingRecord","hasMultipleModels","length","onSingleNewRecord","modelId","onSingleExistingRecord","className","trigger","onClick"],"sources":["Options.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport type { CmsModel } from \"~/types.js\";\nimport { OptionsModelList } from \"~/admin/plugins/fieldRenderers/ref/advanced/components/options/OptionsModelList.js\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\nimport { ReactComponent as LinkIcon } from \"@webiny/icons/link.svg\";\nimport { Button, type ButtonProps, DropdownMenu } from \"@webiny/admin-ui\";\n\nconst CreateNewRecordButton = (props: ButtonProps) => {\n    return <Button {...props} variant={\"tertiary\"} text=\"Create a new record\" icon={<AddIcon />} />;\n};\n\nconst LinkExistingRecordButton = (props: ButtonProps) => {\n    return (\n        <Button\n            {...props}\n            variant={\"tertiary\"}\n            text=\"Select an existing record\"\n            icon={<LinkIcon />}\n        />\n    );\n};\n\ninterface OptionsProps {\n    models: CmsModel[];\n    onNewRecord: (modelId: string) => void;\n    onLinkExistingRecord: (modelId: string) => void;\n}\nexport const Options = ({ models, onNewRecord, onLinkExistingRecord }: OptionsProps) => {\n    const hasMultipleModels = models.length > 1;\n    const onSingleNewRecord = useCallback(() => {\n        if (models.length === 0 || hasMultipleModels) {\n            return;\n        }\n        onNewRecord(models[0].modelId);\n    }, [models]);\n\n    const onSingleExistingRecord = useCallback(() => {\n        if (models.length === 0 || hasMultipleModels) {\n            return;\n        }\n        onLinkExistingRecord(models[0].modelId);\n    }, [models]);\n\n    if (hasMultipleModels) {\n        return (\n            <div className={\"flex gap-sm\"}>\n                <DropdownMenu\n                    trigger={\n                        <Button\n                            variant={\"tertiary\"}\n                            text=\"Create a new record\"\n                            icon={<AddIcon />}\n                        />\n                    }\n                >\n                    <OptionsModelList onClick={onNewRecord} models={models} />\n                </DropdownMenu>\n                <DropdownMenu\n                    trigger={\n                        <Button\n                            variant={\"tertiary\"}\n                            text=\"Select an existing record\"\n                            icon={<LinkIcon />}\n                        />\n                    }\n                >\n                    <OptionsModelList onClick={onLinkExistingRecord} models={models} />\n                </DropdownMenu>\n            </div>\n        );\n    }\n\n    return (\n        <div>\n            <CreateNewRecordButton onClick={onSingleNewRecord} />\n            &nbsp;\n            <LinkExistingRecordButton onClick={onSingleExistingRecord} />\n        </div>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/admin/plugins/fieldRenderers/ref/advanced/components/ReferencesDialog.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import { CmsModelField, CmsModelFieldRendererProps } from "../../../../../../types";
-import { CmsReferenceValue } from "../../components/types";
+import type { CmsModelField, CmsModelFieldRendererProps } from "../../../../../../types.js";
+import type { CmsReferenceValue } from "../../../../../../admin/plugins/fieldRenderers/ref/components/types.js";
 interface ReferencesDialogProps extends CmsModelFieldRendererProps {
     values?: CmsReferenceValue[] | null;
     field: CmsModelField;