@talxis/base-controls 0.0.1

package/dist/components/Lookup/Lookup.js

@@ -0,0 +1,222 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { useLookup } from './hooks/useLookup.js';
+import { useRef, useMemo, useState, useEffect } from 'react';
+import { ThemeProvider } from '@fluentui/react';
+import { TagPicker } from '@talxis/react-components';
+import { TargetSelector } from './components/TargetSelector.js';
+import { useMouseOver } from '../../hooks/useMouseOver.js';
+import { getLookupStyles, getSuggestionsCalloutStyles } from './styles.js';
+import { RecordCreator } from './components/RecordCreator.js';
+import { useFocusIn } from '../../hooks/useFocusIn.js';
+import { useControlSizing } from '../../hooks/useControlSizing.js';
+import dayjs from 'dayjs';
+
+const Lookup = (props) => {
+    const context = props.context;
+    const ref = useRef(null);
+    const componentRef = useRef(null);
+    const itemLimit = props.parameters.MultipleEnabled?.raw === true ? Infinity : 1;
+    const { height } = useControlSizing(props.context.mode);
+    const [value, entities, labels, records, selectEntity, getSearchResults, theme] = useLookup(props);
+    const styles = getLookupStyles(theme, itemLimit === 1, height);
+    const suggestionsCalloutTheme = props.context.fluentDesignLanguage?.applicationTheme ?? theme;
+    const suggestionsCalloutStyles = useMemo(() => getSuggestionsCalloutStyles(suggestionsCalloutTheme), [suggestionsCalloutTheme]);
+    const mouseOver = useMouseOver(ref);
+    const isFocused = useFocusIn(ref, 100);
+    const firstRenderRef = useRef(true);
+    const shouldFocusRef = useRef(false);
+    const [placeholder, setPlaceholder] = useState('---');
+    const onOverrideComponentProps = props.onOverrideComponentProps ?? ((props) => props);
+    useEffect(() => {
+        if (firstRenderRef.current) {
+            firstRenderRef.current = false;
+            return;
+        }
+        //@ts-ignore
+        if (componentRef.current.state.suggestionsVisible) {
+            //if the suggestions callout is open and the selected target changes, refresh the results
+            forceSearch();
+        }
+    }, [entities]);
+    useEffect(() => {
+        const onKeyPress = (ev) => {
+            if (context.mode.isControlDisabled) {
+                return;
+            }
+            if (ev.key === 'Backspace') {
+                const picker = ref.current?.querySelector('[class*="TALXIS__tag-picker__root"]');
+                if ((document.activeElement === picker) && value.length === 1) {
+                    records.select(undefined);
+                    setTimeout(() => {
+                        componentRef.current?.focusInput();
+                    }, 200);
+                }
+            }
+        };
+        document.addEventListener('keydown', onKeyPress);
+        return () => {
+            document.removeEventListener('keydown', onKeyPress);
+        };
+    }, [value]);
+    useEffect(() => {
+        if (props.parameters.AutoFocus?.raw === true) {
+            focus();
+        }
+    }, []);
+    const focus = () => {
+        if (componentRef.current?.items?.length === itemLimit) {
+            const el = ref.current?.querySelector(':scope>div');
+            el?.click();
+            el?.focus();
+            return;
+        }
+        componentRef.current?.focusInput();
+    };
+    const forceSearch = async () => {
+        //@ts-ignore - We need to use internal methods to show and fill the suggestions on entity change
+        componentRef.current.suggestionStore.updateSuggestions([]);
+        //@ts-ignore - ^^same as above
+        componentRef.current.setState({
+            suggestionsVisible: true,
+            suggestionsLoading: true,
+        });
+        //@ts-ignore - ^^same as above
+        const results = await onResolveSuggestions(componentRef.current.input.current.value);
+        //@ts-ignore - ^^same as above
+        componentRef.current.updateSuggestionsList(results);
+        //@ts-ignore - ^^same above
+        componentRef.current.setState({
+            isMostRecentlyUsedVisible: false,
+            suggestionsVisible: true,
+            moreSuggestionsAvailable: false,
+        });
+    };
+    const isComponentActive = () => {
+        return mouseOver || isFocused;
+    };
+    const getSecondaryName = (result, metadata) => {
+        //polymorphic, selected all
+        if (!entities.find(x => x.selected)) {
+            return metadata?.DisplayName;
+        }
+        else {
+            let text = result.entityData[result.layout?.Rows?.[0]?.Cells?.[1]?.Name];
+            const dateRegex = /\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}Z/;
+            if (typeof text === 'string' && text.match(dateRegex)) {
+                text = props.context.formatting.formatTime(dayjs(text).toDate(), 1);
+            }
+            return text;
+        }
+    };
+    const onResolveSuggestions = async (filter, selectedItems) => {
+        //TODO: onResolveSuggestions gets called when the record gets selected resulting in unnecessary call
+        const results = await getSearchResults(filter);
+        const suggestions = [];
+        for (const result of results) {
+            if (selectedItems?.find(x => x.key === result.id)) {
+                continue;
+            }
+            const metadata = await entities.find(x => x.entityName === result.entityType)?.metadata;
+            suggestions.push({
+                key: result.id,
+                text: result.name,
+                secondaryText: getSecondaryName(result, metadata),
+                'data-entity': result.entityType
+            });
+        }
+        return suggestions;
+    };
+    const componentProps = onOverrideComponentProps({
+        ref: componentRef,
+        readOnly: context.mode.isControlDisabled,
+        resolveDelay: 200,
+        stackItems: itemLimit === 1,
+        errorMessage: props.parameters.value.errorMessage,
+        hideErrorMessage: !props.parameters.ShowErrorMessage?.raw,
+        pickerCalloutProps: {
+            layerProps: {
+                eventBubblingEnabled: true
+            },
+            className: suggestionsCalloutStyles.suggestionsCallout,
+            theme: suggestionsCalloutTheme,
+        },
+        inputProps: {
+            placeholder: placeholder,
+            onMouseEnter: () => {
+                if (context.mode.isControlDisabled) {
+                    return;
+                }
+                setPlaceholder(`${labels.placeholder()} ${props.parameters.value.attributes.DisplayName}`);
+            },
+            onMouseLeave: () => {
+                setPlaceholder("---");
+            }
+        },
+        pickerSuggestionsProps: {
+            loadingText: labels.searching(),
+            theme: suggestionsCalloutTheme,
+            noResultsFoundText: labels.noRecordsFound(),
+            className: suggestionsCalloutStyles.suggestionsContainer,
+            // @ts-ignore
+            suggestionsHeaderText: (jsxs(Fragment, { children: [props.parameters.IsInlineNewEnabled?.raw !== false && (jsx(RecordCreator, { labels: labels, entities: entities, onCreateRecord: records.create })), props.parameters.value.attributes.Targets.length > 1 && (jsx(TargetSelector, { labels: labels, entities: entities, onEntitySelected: (entityName) => {
+                            selectEntity(entityName);
+                        } }))] }))
+        },
+        transparent: itemLimit === 1,
+        onChange: (items) => {
+            records.select(items?.map((item) => {
+                return {
+                    entityType: item['data-entity'],
+                    id: item.key,
+                    name: item.text
+                };
+            }));
+        },
+        searchBtnProps: {
+            key: 'search',
+            iconProps: {
+                iconName: 'Search'
+            },
+            showOnlyOnHover: true
+        },
+        selectedItems: value.map((lookup) => {
+            return {
+                key: lookup.id,
+                text: lookup.name || labels.noName(),
+                'data-entity': lookup.entityType,
+                'data-navigation-enabled': props.parameters.EnableNavigation?.raw !== false,
+                onClick: () => {
+                    if (props.parameters.EnableNavigation?.raw === false) {
+                        return;
+                    }
+                    context.navigation.openForm({
+                        entityName: lookup.entityType,
+                        entityId: lookup.id
+                    });
+                },
+                deleteButtonProps: isComponentActive() || itemLimit > 1
+                    ? {
+                        key: 'delete',
+                        iconProps: {
+                            iconName: 'Cancel',
+                        },
+                        onClick: () => {
+                            shouldFocusRef.current = false;
+                            records.deselect(lookup);
+                            setTimeout(() => {
+                                focus();
+                            }, 200);
+                        }
+                    }
+                    : undefined
+            };
+        }),
+        itemLimit: itemLimit,
+        onEmptyResolveSuggestions: !context.mode.isControlDisabled ? (selectedItems) => onResolveSuggestions("", selectedItems) : undefined,
+        onResolveSuggestions: onResolveSuggestions,
+    });
+    return (jsx(ThemeProvider, { applyTo: "none", theme: theme, className: `talxis__lookupControl ${styles.root}`, ref: ref, children: jsx(TagPicker, { ...componentProps }) }));
+};
+
+export { Lookup };
+//# sourceMappingURL=Lookup.js.map

package/dist/components/Lookup/Lookup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Lookup.js","sources":["../../../src/components/Lookup/Lookup.tsx"],"sourcesContent":["\nimport { ILayout, ILookup, IMetadata } from \"./interfaces\";\nimport { useLookup } from \"./hooks/useLookup\";\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport { ThemeProvider } from \"@fluentui/react\";\nimport { IItemProps, TagPicker } from \"@talxis/react-components\";\nimport { TargetSelector } from \"./components/TargetSelector\";\nimport { useMouseOver } from \"../../hooks/useMouseOver\";\nimport { getLookupStyles, getSuggestionsCalloutStyles } from \"./styles\";\nimport { IBasePicker } from \"@fluentui/react/lib/components/pickers/BasePicker.types\";\nimport { ITag } from \"@fluentui/react/lib/components/pickers/TagPicker/TagPicker.types\";\nimport { RecordCreator } from \"./components/RecordCreator\";\nimport { useFocusIn } from \"../../hooks/useFocusIn\";\nimport { useControlSizing } from \"../../hooks/useControlSizing\";\nimport dayjs from \"dayjs\";\n\nexport const Lookup = (props: ILookup) => {\n    const context = props.context;\n    const ref = useRef<HTMLDivElement>(null);\n    const componentRef = useRef<IBasePicker<ITag>>(null);\n    const itemLimit = props.parameters.MultipleEnabled?.raw === true ? Infinity : 1\n    const { height } = useControlSizing(props.context.mode);\n    const [value, entities, labels, records, selectEntity, getSearchResults, theme] = useLookup(props);\n    const styles = getLookupStyles(theme, itemLimit === 1, height);\n    const suggestionsCalloutTheme = props.context.fluentDesignLanguage?.applicationTheme ?? theme;\n    const suggestionsCalloutStyles = useMemo(() => getSuggestionsCalloutStyles(suggestionsCalloutTheme), [suggestionsCalloutTheme])\n    const mouseOver = useMouseOver(ref);\n    const isFocused = useFocusIn(ref, 100);\n    const firstRenderRef = useRef(true);\n    const shouldFocusRef = useRef(false);\n    const [placeholder, setPlaceholder] = useState('---');\n    const onOverrideComponentProps = props.onOverrideComponentProps ?? ((props) => props);\n\n\n    useEffect(() => {\n        if (firstRenderRef.current) {\n            firstRenderRef.current = false;\n            return;\n        }\n        //@ts-ignore\n        if (componentRef.current.state.suggestionsVisible) {\n            //if the suggestions callout is open and the selected target changes, refresh the results\n            forceSearch();\n        }\n    }, [entities])\n\n    useEffect(() => {\n        const onKeyPress = (ev: KeyboardEvent) => {\n            if (context.mode.isControlDisabled) {\n                return;\n            }\n            if (ev.key === 'Backspace') {\n                const picker = ref.current?.querySelector('[class*=\"TALXIS__tag-picker__root\"]');\n                if ((document.activeElement === picker) && value.length === 1) {\n                    records.select(undefined);\n                    setTimeout(() => {\n                        componentRef.current?.focusInput()\n                    }, 200)\n                }\n            }\n        }\n        document.addEventListener('keydown', onKeyPress)\n        return () => {\n            document.removeEventListener('keydown', onKeyPress);\n        }\n    }, [value]);\n\n    useEffect(() => {\n        if (props.parameters.AutoFocus?.raw === true) {\n            focus();\n        }\n    }, []);\n\n    const focus = () => {\n        if (componentRef.current?.items?.length === itemLimit) {\n            const el = ref.current?.querySelector(':scope>div') as HTMLDivElement;\n            el?.click();\n            el?.focus();\n            return;\n        }\n        componentRef.current?.focusInput();\n    }\n\n    const forceSearch = async () => {\n        //@ts-ignore - We need to use internal methods to show and fill the suggestions on entity change\n        componentRef.current.suggestionStore.updateSuggestions([]);\n        //@ts-ignore - ^^same as above\n        componentRef.current.setState({\n            suggestionsVisible: true,\n            suggestionsLoading: true,\n        });\n        //@ts-ignore - ^^same as above\n        const results = await onResolveSuggestions(componentRef.current.input.current.value)\n        //@ts-ignore - ^^same as above\n        componentRef.current.updateSuggestionsList(results);\n        //@ts-ignore - ^^same above\n        componentRef.current.setState({\n            isMostRecentlyUsedVisible: false,\n            suggestionsVisible: true,\n            moreSuggestionsAvailable: false,\n        });\n    }\n\n    const isComponentActive = () => {\n        return mouseOver || isFocused;\n    }\n\n    const getSecondaryName = (result: ComponentFramework.LookupValue & {\n        entityData: {\n            [key: string]: any;\n        };\n        layout: ILayout;\n    }, metadata?: IMetadata) => {\n        //polymorphic, selected all\n        if (!entities.find(x => x.selected)) {\n            return metadata?.DisplayName;\n        }\n        else {\n            let text: string | undefined = result.entityData[result.layout?.Rows?.[0]?.Cells?.[1]?.Name];\n            const dateRegex = /\\d{4}-\\d{2}-\\d{2}T\\d{2}:\\d{2}:\\d{2}Z/;\n            if (typeof text === 'string' && text.match(dateRegex)) {\n                text = props.context.formatting.formatTime(dayjs(text).toDate(), 1);\n            }\n            return text;\n        }\n    }\n\n    const onResolveSuggestions = async (filter: string, selectedItems?: IItemProps[] | undefined): Promise<IItemProps[]> => {\n        //TODO: onResolveSuggestions gets called when the record gets selected resulting in unnecessary call\n        const results = await getSearchResults(filter);\n        const suggestions: IItemProps[] = [];\n        for (const result of results) {\n            if (selectedItems?.find(x => x.key === result.id)) {\n                continue;\n            }\n            const metadata = await entities.find(x => x.entityName === result.entityType)?.metadata;\n            suggestions.push({\n                key: result.id,\n                text: result.name,\n                secondaryText: getSecondaryName(result, metadata),\n                'data-entity': result.entityType\n            })\n        }\n        return suggestions;\n    }\n\n    const componentProps = onOverrideComponentProps({\n        ref: componentRef,\n        readOnly: context.mode.isControlDisabled,\n        resolveDelay: 200,\n        stackItems: itemLimit === 1,\n        errorMessage: props.parameters.value.errorMessage,\n        hideErrorMessage: !props.parameters.ShowErrorMessage?.raw,\n        pickerCalloutProps: {\n            layerProps: {\n                eventBubblingEnabled: true\n            },\n            className: suggestionsCalloutStyles.suggestionsCallout,\n            theme: suggestionsCalloutTheme,\n        },\n        inputProps: {\n            placeholder: placeholder,\n            onMouseEnter: () => {\n                if (context.mode.isControlDisabled) {\n                    return;\n                }\n                setPlaceholder(`${labels.placeholder()} ${props.parameters.value.attributes.DisplayName}`);\n            },\n            onMouseLeave: () => {\n                setPlaceholder(\"---\");\n            }\n\n        },\n        pickerSuggestionsProps: {\n            loadingText: labels.searching(),\n            theme: suggestionsCalloutTheme,\n            noResultsFoundText: labels.noRecordsFound(),\n            className: suggestionsCalloutStyles.suggestionsContainer,\n            // @ts-ignore\n            suggestionsHeaderText: (\n                <>\n                    {props.parameters.IsInlineNewEnabled?.raw !== false && (\n                        <RecordCreator labels={labels} entities={entities} onCreateRecord={records.create} />\n                    )}\n                    {props.parameters.value.attributes.Targets.length > 1 && (\n                        <TargetSelector\n                            labels={labels}\n                            entities={entities}\n                            onEntitySelected={(entityName) => {\n                                selectEntity(entityName);\n                            }}\n                        />\n                    )}\n                </>\n            )\n        },\n        transparent: itemLimit === 1,\n        onChange: (items) => {\n            records.select(\n                items?.map((item) => {\n                    return {\n                        entityType: item['data-entity'],\n                        id: item.key,\n                        name: item.text\n                    };\n                })\n            );\n        },\n        searchBtnProps: {\n            key: 'search',\n            iconProps: {\n                iconName: 'Search'\n            },\n            showOnlyOnHover: true\n        },\n        selectedItems: value.map((lookup) => {\n            return {\n                key: lookup.id,\n                text: lookup.name || labels.noName(),\n                'data-entity': lookup.entityType,\n                'data-navigation-enabled': props.parameters.EnableNavigation?.raw !== false,\n                onClick: () => {\n                    if (props.parameters.EnableNavigation?.raw === false) {\n                        return;\n                    }\n                    context.navigation.openForm({\n                        entityName: lookup.entityType,\n                        entityId: lookup.id\n                    });\n                },\n                deleteButtonProps:\n                    isComponentActive() || itemLimit > 1\n                        ? {\n                            key: 'delete',\n                            iconProps: {\n                                iconName: 'Cancel',\n                            },\n                            onClick: () => {\n                                shouldFocusRef.current = false;\n                                records.deselect(lookup);\n                                setTimeout(() => {\n                                    focus();\n                                }, 200);\n                            }\n                        }\n                        : undefined\n            };\n        }),\n        itemLimit: itemLimit,\n        onEmptyResolveSuggestions: !context.mode.isControlDisabled ? (selectedItems) => onResolveSuggestions(\"\", selectedItems as IItemProps[]) as any : undefined,\n        onResolveSuggestions: onResolveSuggestions,\n    });\n\n    return (\n        <ThemeProvider applyTo=\"none\" theme={theme} className={`talxis__lookupControl ${styles.root}`} ref={ref}>\n            <TagPicker {...componentProps} />\n        </ThemeProvider>\n    );\n};"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}

package/dist/components/Lookup/components/RecordCreator.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { IEntity, ILookupTranslations } from "../interfaces";
+import { StringProps } from '../../../types';
+interface IRecordCreator {
+    labels: Required<StringProps<ILookupTranslations>>;
+    entities: IEntity[];
+    onCreateRecord: (entityName: string) => void;
+}
+export declare const RecordCreator: (props: IRecordCreator) => JSX.Element;
+export {};

package/dist/components/Lookup/components/RecordCreator.js

@@ -0,0 +1,37 @@
+import { jsx } from 'react/jsx-runtime';
+import { useTheme, CommandBarButton, ContextualMenuItemType } from '@fluentui/react';
+import { getLookupStyles } from '../styles.js';
+import { useLoadedEntities } from '../hooks/useLoadedEntities.js';
+
+const RecordCreator = (props) => {
+    const { labels, entities, onCreateRecord } = { ...props };
+    const [loadedEntities] = useLoadedEntities(entities);
+    const theme = useTheme();
+    const styles = getLookupStyles(theme, 0);
+    const selectedEntity = entities.find(x => x.selected);
+    return (jsx(CommandBarButton, { className: styles.createRecordBtn, iconProps: {
+            iconName: 'Add'
+        }, onClick: selectedEntity ? () => onCreateRecord(selectedEntity.entityName) : undefined, menuProps: !selectedEntity ? {
+            calloutProps: {
+                coverTarget: false
+            },
+            isBeakVisible: true,
+            items: loadedEntities ? (() => {
+                const items = [{
+                        key: 'header',
+                        itemType: ContextualMenuItemType.Header,
+                        text: 'Vyberte tabulku'
+                    }];
+                return [...items, ...loadedEntities.map(entity => {
+                        return {
+                            key: entity.entityName,
+                            text: entity.metadata.DisplayName,
+                            onClick: () => onCreateRecord(entity.entityName)
+                        };
+                    })];
+            })() : []
+        } : undefined, text: labels.newRecord() }));
+};
+
+export { RecordCreator };
+//# sourceMappingURL=RecordCreator.js.map

package/dist/components/Lookup/components/RecordCreator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RecordCreator.js","sources":["../../../../src/components/Lookup/components/RecordCreator.tsx"],"sourcesContent":["\n//@ts-nocheck - typescript\nimport { ContextualMenuItemType, IContextualMenuItem, useTheme } from \"@fluentui/react\";\nimport { CommandBarButton } from \"@fluentui/react\";\nimport { IEntity, ILookupTranslations } from \"../interfaces\";\nimport { getLookupStyles } from \"../styles\";\nimport { StringProps } from '../../../types';\nimport { useLoadedEntities } from \"../hooks/useLoadedEntities\";\nimport React from 'react';\n\ninterface IRecordCreator {\n    labels: Required<StringProps<ILookupTranslations>>,\n    entities: IEntity[];\n    onCreateRecord: (entityName: string) => void;\n}\n\nexport const RecordCreator = (props: IRecordCreator) => {\n    const {labels, entities, onCreateRecord} = {...props};\n    const [loadedEntities] = useLoadedEntities(entities);\n    const theme = useTheme();\n    const styles = getLookupStyles(theme, 0)\n    const selectedEntity = entities.find(x => x.selected);\n\n    return (\n        <CommandBarButton\n            className={styles.createRecordBtn}\n            iconProps={{\n                iconName: 'Add'\n            }}\n            onClick={selectedEntity ? () => onCreateRecord(selectedEntity.entityName) : undefined}\n            menuProps={!selectedEntity ? {\n                calloutProps: {\n                    coverTarget: false  \n                },\n                isBeakVisible: true,\n                items: loadedEntities ? (() => {\n                    const items: IContextualMenuItem[] = [{\n                        key: 'header',\n                        itemType: ContextualMenuItemType.Header,\n                        text: 'Vyberte tabulku'\n                       }]\n                       return [...items, ...loadedEntities.map(entity => {\n                           return {\n                               key: entity.entityName,\n                               text: entity.metadata.DisplayName,\n                               onClick: () => onCreateRecord(entity.entityName)\n                           }\n                       })];\n                })() : []\n            }: undefined} \n            text={labels.newRecord()} />\n    )\n}"],"names":["_jsx"],"mappings":";;;;;AAgBa,MAAA,aAAa,GAAG,CAAC,KAAqB,KAAI;AACnD,IAAA,MAAM,EAAC,MAAM,EAAE,QAAQ,EAAE,cAAc,EAAC,GAAG,EAAC,GAAG,KAAK,EAAC,CAAC;IACtD,MAAM,CAAC,cAAc,CAAC,GAAG,iBAAiB,CAAC,QAAQ,CAAC,CAAC;AACrD,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,MAAM,GAAG,eAAe,CAAC,KAAK,EAAE,CAAC,CAAC,CAAA;AACxC,IAAA,MAAM,cAAc,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,CAAC;IAEtD,QACIA,GAAC,CAAA,gBAAgB,EACb,EAAA,SAAS,EAAE,MAAM,CAAC,eAAe,EACjC,SAAS,EAAE;AACP,YAAA,QAAQ,EAAE,KAAK;SAClB,EACD,OAAO,EAAE,cAAc,GAAG,MAAM,cAAc,CAAC,cAAc,CAAC,UAAU,CAAC,GAAG,SAAS,EACrF,SAAS,EAAE,CAAC,cAAc,GAAG;AACzB,YAAA,YAAY,EAAE;AACV,gBAAA,WAAW,EAAE,KAAK;AACrB,aAAA;AACD,YAAA,aAAa,EAAE,IAAI;AACnB,YAAA,KAAK,EAAE,cAAc,GAAG,CAAC,MAAK;gBAC1B,MAAM,KAAK,GAA0B,CAAC;AAClC,wBAAA,GAAG,EAAE,QAAQ;wBACb,QAAQ,EAAE,sBAAsB,CAAC,MAAM;AACvC,wBAAA,IAAI,EAAE,iBAAiB;AACvB,qBAAA,CAAC,CAAA;gBACF,OAAO,CAAC,GAAG,KAAK,EAAE,GAAG,cAAc,CAAC,GAAG,CAAC,MAAM,IAAG;wBAC7C,OAAO;4BACH,GAAG,EAAE,MAAM,CAAC,UAAU;AACtB,4BAAA,IAAI,EAAE,MAAM,CAAC,QAAQ,CAAC,WAAW;4BACjC,OAAO,EAAE,MAAM,cAAc,CAAC,MAAM,CAAC,UAAU,CAAC;yBACnD,CAAA;qBACJ,CAAC,CAAC,CAAC;AACX,aAAC,GAAG,GAAG,EAAE;AACZ,SAAA,GAAE,SAAS,EACZ,IAAI,EAAE,MAAM,CAAC,SAAS,EAAE,EAAI,CAAA,EACnC;AACL;;;;"}

package/dist/components/Lookup/components/TargetSelector.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { IEntity } from '../interfaces';
+interface ITargetSelector {
+    labels: any;
+    entities: IEntity[];
+    onEntitySelected: (entityName: string | null) => void;
+}
+export declare const TargetSelector: (props: ITargetSelector) => JSX.Element;
+export {};

package/dist/components/Lookup/components/TargetSelector.js

@@ -0,0 +1,19 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { Text } from '@fluentui/react/lib/Text';
+import { useTheme, Link } from '@fluentui/react';
+import { getTargetSelectorStyles } from '../styles.js';
+import { useLoadedEntities } from '../hooks/useLoadedEntities.js';
+
+const TargetSelector = (props) => {
+    const { labels, entities, onEntitySelected } = { ...props };
+    const [loadedEntities] = useLoadedEntities(entities);
+    const theme = useTheme();
+    const styles = getTargetSelectorStyles(theme);
+    return (jsxs("div", { className: styles.targetSelector, children: [jsxs(Text, { variant: 'small', children: [labels.resultsFrom(), " "] }), jsxs("div", { className: styles.targetSelectorLinks, children: [jsx(Link, { onClick: () => onEntitySelected(null), className: styles.targetSelectorLink, "data-selected": !entities.find(x => x.selected), children: "All" }), loadedEntities &&
+                        jsx(Fragment, { children: loadedEntities.map((entity) => {
+                                return jsx(Link, { className: styles.targetSelectorLink, "data-selected": entity.selected, onClick: () => onEntitySelected(entity.entityName), children: entity.metadata.DisplayName });
+                            }) })] })] }));
+};
+
+export { TargetSelector };
+//# sourceMappingURL=TargetSelector.js.map

package/dist/components/Lookup/components/TargetSelector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TargetSelector.js","sources":["../../../../src/components/Lookup/components/TargetSelector.tsx"],"sourcesContent":["import React from 'react';\nimport { IEntity } from '../interfaces';\nimport { Text } from '@fluentui/react/lib/Text';\nimport { Link, useTheme } from '@fluentui/react';\nimport { getTargetSelectorStyles } from '../styles';\nimport { useLoadedEntities } from '../hooks/useLoadedEntities';\n\ninterface ITargetSelector {\n    labels: any;\n    entities: IEntity[];\n    onEntitySelected: (entityName: string | null) => void;\n}\n\n\nexport const TargetSelector = (props: ITargetSelector) => {\n    const { labels, entities, onEntitySelected } = { ...props };\n    const [loadedEntities] = useLoadedEntities(entities);\n    const theme = useTheme();\n    const styles = getTargetSelectorStyles(theme);\n\n    return (\n        <div className={styles.targetSelector}>\n            <Text variant='small'>{labels.resultsFrom()} </Text>\n            <div className={styles.targetSelectorLinks}>\n                <Link\n                    onClick={() => onEntitySelected(null)}\n                    className={styles.targetSelectorLink}\n                    data-selected={!entities.find(x => x.selected)}>All</Link>\n                {loadedEntities &&\n                    <>\n                        {loadedEntities.map((entity) => {\n                            return <Link\n                                className={styles.targetSelectorLink}\n                                data-selected={entity.selected}\n                                onClick={() => onEntitySelected(entity.entityName)}>{entity.metadata.DisplayName}</Link>\n                        })}\n                    </>\n                }\n            </div>\n        </div>\n    )\n}"],"names":["_jsxs","_jsx","_Fragment"],"mappings":";;;;;;AAca,MAAA,cAAc,GAAG,CAAC,KAAsB,KAAI;AACrD,IAAA,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,gBAAgB,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,CAAC;IAC5D,MAAM,CAAC,cAAc,CAAC,GAAG,iBAAiB,CAAC,QAAQ,CAAC,CAAC;AACrD,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;AACzB,IAAA,MAAM,MAAM,GAAG,uBAAuB,CAAC,KAAK,CAAC,CAAC;AAE9C,IAAA,QACIA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,cAAc,EAAA,QAAA,EAAA,CACjCA,IAAC,CAAA,IAAI,EAAC,EAAA,OAAO,EAAC,OAAO,EAAE,QAAA,EAAA,CAAA,MAAM,CAAC,WAAW,EAAE,EAAA,GAAA,CAAA,EAAA,CAAS,EACpDA,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,mBAAmB,EAAA,QAAA,EAAA,CACtCC,IAAC,IAAI,EAAA,EACD,OAAO,EAAE,MAAM,gBAAgB,CAAC,IAAI,CAAC,EACrC,SAAS,EAAE,MAAM,CAAC,kBAAkB,EAAA,eAAA,EACrB,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,EAAA,QAAA,EAAA,KAAA,EAAA,CAAY,EAC7D,cAAc;AACX,wBAAAA,GAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EACK,cAAc,CAAC,GAAG,CAAC,CAAC,MAAM,KAAI;AAC3B,gCAAA,OAAOD,GAAC,CAAA,IAAI,EACR,EAAA,SAAS,EAAE,MAAM,CAAC,kBAAkB,EACrB,eAAA,EAAA,MAAM,CAAC,QAAQ,EAC9B,OAAO,EAAE,MAAM,gBAAgB,CAAC,MAAM,CAAC,UAAU,CAAC,EAAG,QAAA,EAAA,MAAM,CAAC,QAAQ,CAAC,WAAW,GAAQ,CAAA;AAChG,6BAAC,CAAC,EAAA,CACH,CAEL,EAAA,CAAA,CAAA,EAAA,CACJ,EACT;AACL;;;;"}

package/dist/components/Lookup/hooks/useFetchXml.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="@types/powerapps-component-framework" />
+import { IEntity } from "../interfaces";
+export declare const useFetchXml: (context: ComponentFramework.Context<any>) => [(viewId: string) => Promise<{
+    fetchxml: string;
+    layoutjson: string;
+}>, (entity: IEntity, fetchXml: string, query: string) => Promise<string>];

package/dist/components/Lookup/hooks/useFetchXml.js

@@ -0,0 +1,52 @@
+import { useRef } from 'react';
+import { FetchXmlBuilder } from '@talxis/client-libraries';
+
+const useFetchXml = (context) => {
+    const cachedFetchXml = useRef({});
+    const get = async (viewId) => {
+        if (!cachedFetchXml.current[viewId]) {
+            cachedFetchXml.current[viewId] = context.webAPI.retrieveRecord('savedquery', viewId, '?$select=fetchxml,layoutjson');
+        }
+        return cachedFetchXml.current[viewId];
+    };
+    const applyLookupQuery = async (entity, fetchXml, query) => {
+        const parser = new DOMParser();
+        const parsedFetchXml = parser.parseFromString(fetchXml, "application/xml");
+        const conditions = parsedFetchXml.getElementsByTagName("condition");
+        const placeholderConditions = [];
+        for (const cond of conditions) {
+            if (cond.getAttribute('value') === "{0}") {
+                if (query) {
+                    cond.setAttribute('value', `%${query}%`);
+                }
+                placeholderConditions.push(cond);
+            }
+        }
+        if (!query) {
+            for (const cond of placeholderConditions) {
+                const parentFilter = cond.parentElement;
+                parentFilter?.removeChild(cond);
+                if (parentFilter?.children.length === 0) {
+                    const grandParent = parentFilter.parentElement;
+                    grandParent?.removeChild(parentFilter);
+                }
+            }
+            return new XMLSerializer().serializeToString(parsedFetchXml);
+        }
+        if (placeholderConditions.length > 0) {
+            return new XMLSerializer().serializeToString(parsedFetchXml);
+        }
+        else {
+            const metadata = await entity.metadata;
+            const xmlObject = FetchXmlBuilder.fetch.fromXml(fetchXml);
+            xmlObject.entity.addFilter(new FetchXmlBuilder.filter(FetchXmlBuilder.FilterType.Or, [
+                new FetchXmlBuilder.condition(metadata.PrimaryNameAttribute, FetchXmlBuilder.Operator.Like, [new FetchXmlBuilder.value(`%${query}%`)])
+            ]));
+            return xmlObject.toXml();
+        }
+    };
+    return [get, applyLookupQuery];
+};
+
+export { useFetchXml };
+//# sourceMappingURL=useFetchXml.js.map

package/dist/components/Lookup/hooks/useFetchXml.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFetchXml.js","sources":["../../../../src/components/Lookup/hooks/useFetchXml.ts"],"sourcesContent":["import { useRef } from \"react\"\nimport { IEntity } from \"../interfaces\";\nimport { FetchXmlBuilder } from \"@talxis/client-libraries\";\n\nexport const useFetchXml = (context: ComponentFramework.Context<any>): [\n    (viewId: string) => Promise<{ fetchxml: string, layoutjson: string }>,\n    (entity: IEntity, fetchXml: string, query: string) => Promise<string>\n] => {\n    const cachedFetchXml = useRef<{\n        [viewId: string]: Promise<any>\n    }>({});\n\n    const get = async (viewId: string): Promise<{ fetchxml: string, layoutjson: string }> => {\n        if (!cachedFetchXml.current[viewId]) {\n            cachedFetchXml.current[viewId] = context.webAPI.retrieveRecord('savedquery', viewId, '?$select=fetchxml,layoutjson');\n        }\n\n        return cachedFetchXml.current[viewId];\n    }\n    const applyLookupQuery = async (entity: IEntity, fetchXml: string, query: string): Promise<string> => {\n        const parser = new DOMParser();\n        const parsedFetchXml = parser.parseFromString(fetchXml, \"application/xml\");\n        const conditions = parsedFetchXml.getElementsByTagName(\"condition\");\n        const placeholderConditions: Element[] = [];\n        for (const cond of conditions) {\n            if (cond.getAttribute('value') === \"{0}\") {\n                if(query) {\n                    cond.setAttribute('value', `%${query}%`);\n                }\n                placeholderConditions.push(cond);\n            }\n        }\n        if (!query) {\n            for (const cond of placeholderConditions) {\n                const parentFilter = cond.parentElement;\n                parentFilter?.removeChild(cond);\n                if(parentFilter?.children.length === 0) {\n                    const grandParent = parentFilter.parentElement;\n                    grandParent?.removeChild(parentFilter);\n                }\n            }\n            return new XMLSerializer().serializeToString(parsedFetchXml);\n        }\n        if (placeholderConditions.length > 0) {\n            return new XMLSerializer().serializeToString(parsedFetchXml);\n        }\n        else {\n            const metadata = await entity.metadata;\n            const xmlObject = FetchXmlBuilder.fetch.fromXml(fetchXml);\n            xmlObject.entity.addFilter(new FetchXmlBuilder.filter(FetchXmlBuilder.FilterType.Or, [\n                new FetchXmlBuilder.condition(metadata.PrimaryNameAttribute, FetchXmlBuilder.Operator.Like, [new FetchXmlBuilder.value(`%${query}%`)])\n            ]))\n            return xmlObject.toXml();\n        }\n    }\n    return [get, applyLookupQuery]\n}"],"names":[],"mappings":";;;AAIa,MAAA,WAAW,GAAG,CAAC,OAAwC,KAGhE;AACA,IAAA,MAAM,cAAc,GAAG,MAAM,CAE1B,EAAE,CAAC,CAAC;AAEP,IAAA,MAAM,GAAG,GAAG,OAAO,MAAc,KAAuD;AACpF,QAAA,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;AACjC,YAAA,cAAc,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,OAAO,CAAC,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,MAAM,EAAE,8BAA8B,CAAC,CAAC;AACxH,SAAA;AAED,QAAA,OAAO,cAAc,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;AAC1C,KAAC,CAAA;IACD,MAAM,gBAAgB,GAAG,OAAO,MAAe,EAAE,QAAgB,EAAE,KAAa,KAAqB;AACjG,QAAA,MAAM,MAAM,GAAG,IAAI,SAAS,EAAE,CAAC;QAC/B,MAAM,cAAc,GAAG,MAAM,CAAC,eAAe,CAAC,QAAQ,EAAE,iBAAiB,CAAC,CAAC;QAC3E,MAAM,UAAU,GAAG,cAAc,CAAC,oBAAoB,CAAC,WAAW,CAAC,CAAC;QACpE,MAAM,qBAAqB,GAAc,EAAE,CAAC;AAC5C,QAAA,KAAK,MAAM,IAAI,IAAI,UAAU,EAAE;YAC3B,IAAI,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,KAAK,KAAK,EAAE;AACtC,gBAAA,IAAG,KAAK,EAAE;oBACN,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,CAAI,CAAA,EAAA,KAAK,CAAG,CAAA,CAAA,CAAC,CAAC;AAC5C,iBAAA;AACD,gBAAA,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AACpC,aAAA;AACJ,SAAA;QACD,IAAI,CAAC,KAAK,EAAE;AACR,YAAA,KAAK,MAAM,IAAI,IAAI,qBAAqB,EAAE;AACtC,gBAAA,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC;AACxC,gBAAA,YAAY,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC;AAChC,gBAAA,IAAG,YAAY,EAAE,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE;AACpC,oBAAA,MAAM,WAAW,GAAG,YAAY,CAAC,aAAa,CAAC;AAC/C,oBAAA,WAAW,EAAE,WAAW,CAAC,YAAY,CAAC,CAAC;AAC1C,iBAAA;AACJ,aAAA;YACD,OAAO,IAAI,aAAa,EAAE,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC;AAChE,SAAA;AACD,QAAA,IAAI,qBAAqB,CAAC,MAAM,GAAG,CAAC,EAAE;YAClC,OAAO,IAAI,aAAa,EAAE,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC;AAChE,SAAA;AACI,aAAA;AACD,YAAA,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,QAAQ,CAAC;YACvC,MAAM,SAAS,GAAG,eAAe,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;AAC1D,YAAA,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,eAAe,CAAC,MAAM,CAAC,eAAe,CAAC,UAAU,CAAC,EAAE,EAAE;gBACjF,IAAI,eAAe,CAAC,SAAS,CAAC,QAAQ,CAAC,oBAAoB,EAAE,eAAe,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC,IAAI,eAAe,CAAC,KAAK,CAAC,CAAA,CAAA,EAAI,KAAK,CAAA,CAAA,CAAG,CAAC,CAAC,CAAC;AACzI,aAAA,CAAC,CAAC,CAAA;AACH,YAAA,OAAO,SAAS,CAAC,KAAK,EAAE,CAAC;AAC5B,SAAA;AACL,KAAC,CAAA;AACD,IAAA,OAAO,CAAC,GAAG,EAAE,gBAAgB,CAAC,CAAA;AAClC;;;;"}

package/dist/components/Lookup/hooks/useLoadedEntities.d.ts

@@ -0,0 +1,6 @@
+import { IEntity, IMetadata } from "../interfaces";
+interface ILoadedEntity extends Omit<IEntity, 'metadata'> {
+    metadata: IMetadata;
+}
+export declare const useLoadedEntities: (entities: IEntity[]) => [ILoadedEntity[] | null];
+export {};

package/dist/components/Lookup/hooks/useLoadedEntities.js

@@ -0,0 +1,20 @@
+import { useState, useEffect } from 'react';
+
+const useLoadedEntities = (entities) => {
+    const [loadedEntities, setLoadedEntities] = useState(null);
+    useEffect(() => {
+        (async () => {
+            setLoadedEntities(await Promise.all(entities.map(async (entity) => {
+                return {
+                    entityName: entity.entityName,
+                    selected: entity.selected,
+                    metadata: await entity.metadata
+                };
+            })));
+        })();
+    }, [entities]);
+    return [loadedEntities];
+};
+
+export { useLoadedEntities };
+//# sourceMappingURL=useLoadedEntities.js.map

package/dist/components/Lookup/hooks/useLoadedEntities.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLoadedEntities.js","sources":["../../../../src/components/Lookup/hooks/useLoadedEntities.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { IEntity, IMetadata } from \"../interfaces\";\n\ninterface ILoadedEntity extends Omit<IEntity, 'metadata'> {\n    metadata: IMetadata\n}\n\nexport const useLoadedEntities = (entities: IEntity[]): [ILoadedEntity[] | null] => {\n    const [loadedEntities, setLoadedEntities] = useState<ILoadedEntity[] | null>(null);\n    useEffect(() => {\n        (async () => {\n            setLoadedEntities(await Promise.all(entities.map(async entity => {\n                return {\n                    entityName: entity.entityName,\n                    selected: entity.selected,\n                    metadata: await entity.metadata\n                }\n            })))\n        })();\n    }, [entities]);\n\n    return [loadedEntities]\n}"],"names":[],"mappings":";;AAOa,MAAA,iBAAiB,GAAG,CAAC,QAAmB,KAA8B;IAC/E,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAyB,IAAI,CAAC,CAAC;IACnF,SAAS,CAAC,MAAK;QACX,CAAC,YAAW;AACR,YAAA,iBAAiB,CAAC,MAAM,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,GAAG,CAAC,OAAM,MAAM,KAAG;gBAC5D,OAAO;oBACH,UAAU,EAAE,MAAM,CAAC,UAAU;oBAC7B,QAAQ,EAAE,MAAM,CAAC,QAAQ;AACzB,oBAAA,QAAQ,EAAE,MAAM,MAAM,CAAC,QAAQ;iBAClC,CAAA;aACJ,CAAC,CAAC,CAAC,CAAA;SACP,GAAG,CAAC;AACT,KAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,OAAO,CAAC,cAAc,CAAC,CAAA;AAC3B;;;;"}

package/dist/components/Lookup/hooks/useLookup.d.ts

@@ -0,0 +1,43 @@
+/// <reference types="@types/powerapps-component-framework" />
+import { ITranslation } from "../../../hooks";
+import { IEntity, ILayout, ILookup } from "../interfaces";
+import { ITheme } from "@talxis/react-components";
+export declare const useLookup: (props: ILookup) => [ComponentFramework.LookupValue[], IEntity[], ITranslation<Partial<import("../../..").ITranslations<{
+    search: {
+        1033: string;
+        1029: string;
+    };
+    newRecord: {
+        1033: string;
+        1029: string;
+    };
+    searching: {
+        1033: string;
+        1029: string;
+    };
+    noRecordsFound: {
+        1033: string;
+        1029: string;
+    };
+    resultsFrom: {
+        1033: string;
+        1029: string;
+    };
+    noName: {
+        1033: string;
+        1029: string;
+    };
+    placeholder: {
+        1033: string;
+        1029: string;
+    };
+}>>>, {
+    create: (entityName: string) => void;
+    select: (record: ComponentFramework.LookupValue[] | undefined) => void;
+    deselect: (record: ComponentFramework.LookupValue) => void;
+}, (entityName: string | null) => void, (query: string) => Promise<(ComponentFramework.LookupValue & {
+    entityData: {
+        [key: string]: any;
+    };
+    layout: ILayout;
+})[]>, ITheme];

package/dist/components/Lookup/hooks/useLookup.js

@@ -0,0 +1,120 @@
+import { useState } from 'react';
+import { lookupTranslations } from '../translations.js';
+import { useFetchXml } from './useFetchXml.js';
+import { useControl } from '../../../hooks/useControl.js';
+
+const useLookup = (props) => {
+    const targets = props.parameters.value.attributes.Targets;
+    const boundValue = props.parameters.value.raw;
+    const context = props.context;
+    const { labels, theme, onNotifyOutputChanged } = useControl('Lookup', props, lookupTranslations);
+    const [getFetchXml, applyLookupQuery] = useFetchXml(context);
+    const [entities, setEntities] = useState(() => {
+        return targets.map(target => {
+            return {
+                entityName: target,
+                selected: targets.length === 1 ? true : false,
+                metadata: props.context.utils.getEntityMetadata(target, []),
+            };
+        });
+    });
+    const selectedEntity = entities.find(x => x.selected);
+    const selectEntity = (entityName) => {
+        setEntities([...entities].map(entity => {
+            return {
+                entityName: entity.entityName,
+                metadata: entity.metadata,
+                selected: entity.entityName === entityName
+            };
+        }));
+    };
+    const selectRecords = (records) => {
+        onNotifyOutputChanged({
+            value: records
+        });
+    };
+    const getSearchFetchXml = async (entityName, query, viewIdCallBack) => {
+        const response = (await props.parameters.value.getAllViews(entityName)).find(x => x.isDefault);
+        if (!response?.viewId) {
+            throw new Error(`Entity ${entityName} does not have a default view id!`);
+        }
+        viewIdCallBack(response.viewId);
+        let fetchXml = response?.fetchXml;
+        if (!fetchXml) {
+            fetchXml = (await getFetchXml(response.viewId)).fetchxml;
+        }
+        return applyLookupQuery(entities.find(x => x.entityName === entityName), fetchXml, query);
+    };
+    const getSearchResults = async (query) => {
+        if (props.onSearch) {
+            return props.onSearch(selectedEntity ? [selectedEntity?.entityName] : targets, query);
+        }
+        const fetchXmlMap = new Map();
+        const entityViewIdMap = new Map();
+        if (selectedEntity) {
+            fetchXmlMap.set(selectedEntity.entityName, getSearchFetchXml(selectedEntity.entityName, query, (viewId) => entityViewIdMap.set(selectedEntity.entityName, viewId)));
+        }
+        else {
+            for (const entity of targets) {
+                fetchXmlMap.set(entity, getSearchFetchXml(entity, query, (viewId) => entityViewIdMap.set(entity, viewId)));
+            }
+        }
+        await Promise.all(fetchXmlMap.values());
+        const responsePromiseMap = new Map();
+        for (const [entityName, fetchXml] of fetchXmlMap) {
+            responsePromiseMap.set(entityName, context.webAPI.retrieveMultipleRecords(entityName, `?$top=25&fetchXml=${encodeURIComponent((await fetchXml))}`));
+        }
+        await Promise.all(responsePromiseMap.values());
+        const result = [];
+        for (const [entityName, response] of responsePromiseMap) {
+            const layout = JSON.parse((await getFetchXml(entityViewIdMap.get(entityName))).layoutjson ?? "{}");
+            for (const entity of (await response).entities) {
+                const entityMetadata = await entities.find(x => x.entityName === entityName).metadata;
+                result.push({
+                    entityType: entityName,
+                    id: entity[entityMetadata.PrimaryIdAttribute],
+                    name: entity[layout.Rows?.[0]?.Cells?.[0]?.Name] ?? entity[entityMetadata.PrimaryNameAttribute] ?? labels.noName(),
+                    entityData: entity,
+                    layout: layout
+                });
+            }
+        }
+        return result;
+    };
+    const createRecord = async (entityName) => {
+        const formParameters = props.onGetOnCreateFormParameters?.(entityName);
+        const result = await context.navigation.openForm({
+            entityName: entityName,
+            useQuickCreateForm: true
+        }, formParameters);
+        if (!result.savedEntityReference) {
+            return;
+        }
+        onNotifyOutputChanged({
+            value: [
+                ...boundValue,
+                ...result.savedEntityReference
+            ]
+        });
+    };
+    const deselectRecord = (record) => {
+        const map = new Map(boundValue.map(value => [value.id, value]));
+        map.delete(record.id);
+        onNotifyOutputChanged({
+            value: [...map.values()]
+        });
+    };
+    return [
+        boundValue, entities, labels, {
+            create: createRecord,
+            deselect: deselectRecord,
+            select: selectRecords
+        },
+        selectEntity,
+        getSearchResults,
+        theme
+    ];
+};
+
+export { useLookup };
+//# sourceMappingURL=useLookup.js.map