@talxis/base-controls 1.2501.10 → 1.2503.1

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

@@ -1 +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, 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 } 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 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    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: styles.suggestions\n        },\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        pickerSuggestionsProps: {\n            loadingText: labels.searching(),\n            noResultsFoundText: labels.noRecordsFound(),\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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"}
+{"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    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        },\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/hooks/useFetchXml.d.ts

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

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

@@ -1,4 +1,4 @@
-/// <reference types="powerapps-component-framework" />
+/// <reference types="@types/powerapps-component-framework" />
 import { ITranslation } from "../../../hooks";
 import { IEntity, ILayout, ILookup } from "../interfaces";
 import { ITheme } from "@talxis/react-components";

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

@@ -1,4 +1,4 @@
-/// <reference types="powerapps-component-framework" />
+/// <reference types="@types/powerapps-component-framework" />
 import { ITagPickerProps } from "@talxis/react-components";
 import { ILookupProperty, ITwoOptionsProperty } from "../../interfaces";
 import { IControl, IOutputs, ITranslations } from "../../interfaces/context";

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

@@ -57,13 +57,6 @@ export declare const getLookupStyles: (theme: ITheme, isSingleSelect: boolean, h
             height: string | 0 | undefined;
         };
     };
-    suggestions: {
-        '.ms-Suggestions-title': {
-            padding: number;
-            display: string;
-            flexDirection: string;
-        };
-    };
     createRecordBtn: {
         height: number;
         width: string;
@@ -81,3 +74,22 @@ export declare const getLookupStyles: (theme: ITheme, isSingleSelect: boolean, h
         };
     };
 }>;
+export declare const getSuggestionsCalloutStyles: (theme: ITheme) => import("@fluentui/react").IProcessedStyleSet<{
+    suggestionsCallout: {
+        '.ms-Suggestions-title': {
+            padding: number;
+            display: string;
+            flexDirection: string;
+        };
+    };
+    suggestionsContainer: {
+        '.ms-Suggestions-item': {
+            ':hover': {
+                backgroundColor: string;
+            };
+            '>.ms-Button--command[aria-selected="true"]': {
+                backgroundColor: string;
+            };
+        };
+    };
+}>;

package/dist/components/Lookup/styles.js

@@ -68,13 +68,6 @@ const getLookupStyles = (theme, isSingleSelect, height) => {
                 height: _height && `${_height - 3}px !important`
             }
         },
-        suggestions: {
-            '.ms-Suggestions-title': {
-                padding: 0,
-                display: 'flex',
-                flexDirection: 'column',
-            }
-        },
         createRecordBtn: {
             height: 38,
             width: '100%',
@@ -93,6 +86,27 @@ const getLookupStyles = (theme, isSingleSelect, height) => {
         }
     });
 };
+const getSuggestionsCalloutStyles = (theme) => {
+    return mergeStyleSets({
+        suggestionsCallout: {
+            '.ms-Suggestions-title': {
+                padding: 0,
+                display: 'flex',
+                flexDirection: 'column',
+            }
+        },
+        suggestionsContainer: {
+            '.ms-Suggestions-item': {
+                ':hover': {
+                    backgroundColor: theme.semanticColors.buttonBackgroundHovered
+                },
+                '>.ms-Button--command[aria-selected="true"]': {
+                    backgroundColor: theme.semanticColors.buttonBackgroundPressed
+                }
+            }
+        },
+    });
+};
 
-export { getLookupStyles, getTargetSelectorStyles };
+export { getLookupStyles, getSuggestionsCalloutStyles, getTargetSelectorStyles };
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../src/components/Lookup/styles.ts"],"sourcesContent":["import { ITheme, mergeStyleSets } from \"@fluentui/react\";\n\nexport const getTargetSelectorStyles = (theme: ITheme) => {\n    return mergeStyleSets({\n        targetSelector: {\n            display: 'flex',\n            paddingLeft: 8,\n            paddingRight: 8,\n            paddingBottom: 8,\n            gap: 8,\n            paddingTop: 8,\n            '>span': {\n                lineHeight: 15,\n                minWidth: 'fit-content',\n                color: theme.semanticColors.listText,\n                fontWeight: 600\n            }\n        },\n        targetSelectorLinks: {\n            display: 'flex',\n            gap: 5,\n            flexWrap: 'wrap'\n        },\n        targetSelectorLink: {\n            color: theme.palette.blackTranslucent40,\n            '&[data-selected=\"true\"]': {\n                color: theme.semanticColors.link,\n                fontWeight: 600\n            }\n        },\n    })\n}\n\nconst getHeight = (height?: number) => {\n    if(height === -1 || height === 0) {\n        return undefined;\n    }\n    return height;\n}\n\nexport const getLookupStyles = (theme: ITheme, isSingleSelect: boolean, height?: number) => {\n    const _height = getHeight(height);\n    return mergeStyleSets({\n        displayName: 'talxis__lookupControl',\n        root: {\n            '[data-navigation-enabled=\"true\"]': {\n                '.ms-Button-label': {\n                    color: `${theme.semanticColors.link} !important`,\n                    fontWeight: 600,\n                    marginLeft: 2\n                },\n                ':hover': {\n                    textDecoration: 'underline',\n                    cursor: 'pointer !important'\n                }\n            },\n            '.ms-BasePicker-itemsWrapper .ms-CommandBar.ms-CommandBar': {\n                height: _height && isSingleSelect ? _height - 6 : undefined\n            },\n            '.ms-BasePicker-text': {\n                minHeight: _height ?? 32,\n                height: 'min-content',\n                paddingRight: !isSingleSelect ? 36 : undefined,\n                alignItems: 'baseline',\n\n                'input': {\n                    alignSelf: 'center'\n                },\n            },\n            '.TALXIS__input-buttons__root': {\n                height: _height && `${_height - 3}px !important`\n            }\n        },\n        suggestions: {\n            '.ms-Suggestions-title': {\n                padding: 0,\n                display: 'flex',\n                flexDirection: 'column',\n            }\n        },\n        createRecordBtn: {\n            height: 38,\n            width: '100%',\n            '.ms-Button-menuIcon': {\n                display: 'none'\n            },\n            '>.ms-Button-flexContainer.ms-Button-flexContainer': {\n                justifyContent: 'flex-start'\n            },\n            '.ms-Button-textContainer': {\n                flexGrow: 'initial',\n                '>span': {\n                    fontWeight: 600,\n                }\n            }\n        }\n    });\n}"],"names":[],"mappings":"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"}
+{"version":3,"file":"styles.js","sources":["../../../src/components/Lookup/styles.ts"],"sourcesContent":["import { ITheme, mergeStyleSets } from \"@fluentui/react\";\n\nexport const getTargetSelectorStyles = (theme: ITheme) => {\n    return mergeStyleSets({\n        targetSelector: {\n            display: 'flex',\n            paddingLeft: 8,\n            paddingRight: 8,\n            paddingBottom: 8,\n            gap: 8,\n            paddingTop: 8,\n            '>span': {\n                lineHeight: 15,\n                minWidth: 'fit-content',\n                color: theme.semanticColors.listText,\n                fontWeight: 600\n            }\n        },\n        targetSelectorLinks: {\n            display: 'flex',\n            gap: 5,\n            flexWrap: 'wrap'\n        },\n        targetSelectorLink: {\n            color: theme.palette.blackTranslucent40,\n            '&[data-selected=\"true\"]': {\n                color: theme.semanticColors.link,\n                fontWeight: 600\n            }\n        },\n    })\n}\n\nconst getHeight = (height?: number) => {\n    if(height === -1 || height === 0) {\n        return undefined;\n    }\n    return height;\n}\n\nexport const getLookupStyles = (theme: ITheme, isSingleSelect: boolean, height?: number) => {\n    const _height = getHeight(height);\n    return mergeStyleSets({\n        displayName: 'talxis__lookupControl',\n        root: {\n            '[data-navigation-enabled=\"true\"]': {\n                '.ms-Button-label': {\n                    color: `${theme.semanticColors.link} !important`,\n                    fontWeight: 600,\n                    marginLeft: 2\n                },\n                ':hover': {\n                    textDecoration: 'underline',\n                    cursor: 'pointer !important'\n                }\n            },\n            '.ms-BasePicker-itemsWrapper .ms-CommandBar.ms-CommandBar': {\n                height: _height && isSingleSelect ? _height - 6 : undefined\n            },\n            '.ms-BasePicker-text': {\n                minHeight: _height ?? 32,\n                height: 'min-content',\n                paddingRight: !isSingleSelect ? 36 : undefined,\n                alignItems: 'baseline',\n\n                'input': {\n                    alignSelf: 'center'\n                },\n            },\n            '.TALXIS__input-buttons__root': {\n                height: _height && `${_height - 3}px !important`\n            }\n        },\n        createRecordBtn: {\n            height: 38,\n            width: '100%',\n            '.ms-Button-menuIcon': {\n                display: 'none'\n            },\n            '>.ms-Button-flexContainer.ms-Button-flexContainer': {\n                justifyContent: 'flex-start'\n            },\n            '.ms-Button-textContainer': {\n                flexGrow: 'initial',\n                '>span': {\n                    fontWeight: 600,\n                }\n            }\n        }\n    });\n}\n\nexport const getSuggestionsCalloutStyles = (theme: ITheme) => {\n    return mergeStyleSets({\n        suggestionsCallout: {\n            '.ms-Suggestions-title': {\n                padding: 0,\n                display: 'flex',\n                flexDirection: 'column',\n            }\n        },\n        suggestionsContainer: {\n            '.ms-Suggestions-item': {\n                ':hover': {\n                    backgroundColor: theme.semanticColors.buttonBackgroundHovered\n                },\n                '>.ms-Button--command[aria-selected=\"true\"]': {\n                    backgroundColor: theme.semanticColors.buttonBackgroundPressed\n                }\n            }\n        },\n    })\n}   "],"names":[],"mappings":"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"}

package/dist/components/MultiSelectOptionSet/MultiSelectOptionSet.js

@@ -11,6 +11,8 @@ const MultiSelectOptionSet = (props) => {
     const componentRef = useRef(null);
     const { Options } = parameters.value.attributes;
     const context = props.context;
+    const applicationTheme = props.context.fluentDesignLanguage?.applicationTheme;
+    const onOverrideComponentProps = props.onOverrideComponentProps ?? ((props) => props);
     const comboBoxOptions = Options.map(option => ({
         key: option.Value.toString(),
         text: option.Label,
@@ -40,34 +42,55 @@ const MultiSelectOptionSet = (props) => {
             componentRef.current?.focus(true);
         }
     }, []);
-    return (jsx(ThemeProvider, { theme: theme, applyTo: "none", children: jsx(ComboBox, { componentRef: componentRef, options: comboBoxOptions, allowFreeInput: true, multiSelect: true, autoComplete: "on", theme: theme, autofill: parameters.AutoFocus?.raw === true ? {
-                autoFocus: true
-            } : undefined, readOnly: context.mode.isControlDisabled, errorMessage: boundValue.errorMessage, selectedKey: boundValue.raw ? boundValue.raw.map(key => key.toString()) : null, useComboBoxAsMenuWidth: true, hideErrorMessage: !parameters.ShowErrorMessage?.raw, styles: {
-                root: {
-                    height: sizing.height,
-                    width: sizing.width,
-                    display: 'flex',
-                    alignItems: 'center',
-                },
-                callout: {
-                    maxHeight: '300px !important'
-                }
-            }, clickToCopyProps: parameters.EnableCopyButton?.raw === true ? {
-                key: 'copy',
-                showOnlyOnHover: true,
-                iconProps: {
-                    iconName: 'Copy'
-                }
-            } : undefined, deleteButtonProps: props.parameters.EnableDeleteButton?.raw === true ? {
-                key: 'delete',
-                showOnlyOnHover: true,
-                iconProps: {
-                    iconName: 'Cancel'
-                },
-                onClick: (e, value) => {
-                    handleChange(null);
-                }
-            } : undefined, onChange: (e, option) => handleChange(option) }) }));
+    const componentProps = onOverrideComponentProps({
+        componentRef: componentRef,
+        options: comboBoxOptions,
+        allowFreeInput: true,
+        multiSelect: true,
+        autoComplete: "on",
+        autofill: parameters.AutoFocus?.raw === true ? {
+            autoFocus: true
+        } : undefined,
+        onRenderContainer: (containerProps, defaultRender) => jsx(ThemeProvider, { theme: props.context.fluentDesignLanguage?.applicationTheme, children: defaultRender?.(containerProps) }),
+        calloutProps: applicationTheme ? {
+            theme: applicationTheme
+        } : undefined,
+        readOnly: context.mode.isControlDisabled,
+        errorMessage: boundValue.errorMessage,
+        selectedKey: boundValue.raw ? boundValue.raw.map(key => key.toString()) : null,
+        useComboBoxAsMenuWidth: true,
+        hideErrorMessage: !parameters.ShowErrorMessage?.raw,
+        styles: {
+            root: {
+                height: sizing.height,
+                width: sizing.width,
+                display: 'flex',
+                alignItems: 'center',
+            },
+            callout: {
+                maxHeight: '300px !important'
+            }
+        },
+        clickToCopyProps: parameters.EnableCopyButton?.raw === true ? {
+            key: 'copy',
+            showOnlyOnHover: true,
+            iconProps: {
+                iconName: 'Copy'
+            }
+        } : undefined,
+        deleteButtonProps: parameters.EnableDeleteButton?.raw === true ? {
+            key: 'delete',
+            showOnlyOnHover: true,
+            iconProps: {
+                iconName: 'Cancel'
+            },
+            onClick: (e, value) => {
+                handleChange(null);
+            }
+        } : undefined,
+        onChange: (e, option) => handleChange(option),
+    });
+    return (jsx(ThemeProvider, { theme: theme, applyTo: "none", children: jsx(ComboBox, { ...componentProps }) }));
 };
 
 export { MultiSelectOptionSet };

package/dist/components/MultiSelectOptionSet/MultiSelectOptionSet.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelectOptionSet.js","sources":["../../../src/components/MultiSelectOptionSet/MultiSelectOptionSet.tsx"],"sourcesContent":["\nimport { IMultiSelectOptionSet } from './interfaces';\nimport { useControl } from '../../hooks';\nimport { ComboBox } from \"@talxis/react-components\";\nimport { IComboBox, IComboBoxOption, ThemeProvider } from '@fluentui/react';\nimport React, { useEffect, useRef } from 'react';\n\nexport const MultiSelectOptionSet = (props: IMultiSelectOptionSet) => {\n    const { sizing, onNotifyOutputChanged, theme } = useControl('MultiSelectOptionSet', props);\n    const parameters = props.parameters;\n    const boundValue = parameters.value;\n    const componentRef = useRef<IComboBox>(null);\n    const { Options } = parameters.value.attributes;\n    const context = props.context;\n    const comboBoxOptions: IComboBoxOption[] = Options.map(option => ({\n        key: option.Value.toString(),\n        text: option.Label,\n    }));\n\n    const handleChange = (option?: IComboBoxOption | null): void => {\n        if (!option) {\n            onNotifyOutputChanged({\n                value: undefined\n            });\n            return;\n        }\n        const optionKey = option.key.toString();\n        const updatedSelectedKeys = new Set(boundValue.raw || []);\n        if (option.selected) {\n            updatedSelectedKeys.add(+optionKey);\n        } else {\n            updatedSelectedKeys.delete(+optionKey);\n        }\n        const updatedSelectedKeysArray = Array.from(updatedSelectedKeys);\n\n        onNotifyOutputChanged({\n            value: updatedSelectedKeysArray.map(key => +key)\n        });\n    };\n\n    useEffect(() => {\n        if (parameters.AutoFocus?.raw) {\n            componentRef.current?.focus(true);\n        }\n    }, []);\n\n    return (\n        <ThemeProvider theme={theme} applyTo=\"none\">\n            <ComboBox\n                componentRef={componentRef}\n                options={comboBoxOptions}\n                allowFreeInput={true}\n                multiSelect\n                autoComplete=\"on\"\n                theme={theme}\n                autofill={parameters.AutoFocus?.raw === true ? {\n                    autoFocus: true\n                } : undefined}\n                readOnly={context.mode.isControlDisabled}\n                errorMessage={boundValue.errorMessage}\n                selectedKey={boundValue.raw ? boundValue.raw.map(key => key.toString()) : null}\n                useComboBoxAsMenuWidth\n                hideErrorMessage={!parameters.ShowErrorMessage?.raw}\n                styles={{\n                    root: {\n                        height: sizing.height,\n                        width: sizing.width,\n                        display: 'flex',\n                        alignItems: 'center',\n                    },\n                    callout: {\n                        maxHeight: '300px !important'\n                    }\n                }}\n                clickToCopyProps={parameters.EnableCopyButton?.raw === true ? {\n                    key: 'copy',\n                    showOnlyOnHover: true,\n                    iconProps: {\n                        iconName: 'Copy'\n                    }\n                } : undefined}\n                deleteButtonProps={props.parameters.EnableDeleteButton?.raw === true ? {\n                    key: 'delete',\n                    showOnlyOnHover: true,\n                    iconProps: {\n                        iconName: 'Cancel'\n                    },\n                    onClick: (e, value) => {\n                        handleChange(null);\n                    }\n                } : undefined}\n                onChange={(e, option) => handleChange(option)} />\n        </ThemeProvider>\n    );\n};\n"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"MultiSelectOptionSet.js","sources":["../../../src/components/MultiSelectOptionSet/MultiSelectOptionSet.tsx"],"sourcesContent":["\nimport { IMultiSelectOptionSet } from './interfaces';\nimport { useControl } from '../../hooks';\nimport { ComboBox } from \"@talxis/react-components\";\nimport { IComboBox, IComboBoxOption, ThemeProvider } from '@fluentui/react';\nimport React, { useEffect, useRef } from 'react';\n\nexport const MultiSelectOptionSet = (props: IMultiSelectOptionSet) => {\n    const { sizing, onNotifyOutputChanged, theme } = useControl('MultiSelectOptionSet', props);\n    const parameters = props.parameters;\n    const boundValue = parameters.value;\n    const componentRef = useRef<IComboBox>(null);\n    const { Options } = parameters.value.attributes;\n    const context = props.context;\n    const applicationTheme = props.context.fluentDesignLanguage?.applicationTheme;\n    const onOverrideComponentProps = props.onOverrideComponentProps ?? ((props) => props);\n\n    const comboBoxOptions: IComboBoxOption[] = Options.map(option => ({\n        key: option.Value.toString(),\n        text: option.Label,\n    }));\n\n    const handleChange = (option?: IComboBoxOption | null): void => {\n        if (!option) {\n            onNotifyOutputChanged({\n                value: undefined\n            });\n            return;\n        }\n        const optionKey = option.key.toString();\n        const updatedSelectedKeys = new Set(boundValue.raw || []);\n        if (option.selected) {\n            updatedSelectedKeys.add(+optionKey);\n        } else {\n            updatedSelectedKeys.delete(+optionKey);\n        }\n        const updatedSelectedKeysArray = Array.from(updatedSelectedKeys);\n\n        onNotifyOutputChanged({\n            value: updatedSelectedKeysArray.map(key => +key)\n        });\n    };\n\n    useEffect(() => {\n        if (parameters.AutoFocus?.raw) {\n            componentRef.current?.focus(true);\n        }\n    }, []);\n\n    const componentProps = onOverrideComponentProps({\n        componentRef: componentRef,\n        options: comboBoxOptions,\n        allowFreeInput: true,\n        multiSelect: true,\n        autoComplete: \"on\",\n        autofill: parameters.AutoFocus?.raw === true ? {\n            autoFocus: true\n        } : undefined,\n        onRenderContainer: (containerProps, defaultRender) => <ThemeProvider theme={props.context.fluentDesignLanguage?.applicationTheme}>{defaultRender?.(containerProps)}</ThemeProvider>,\n        calloutProps: applicationTheme ? {\n            theme: applicationTheme\n        } : undefined,\n        readOnly: context.mode.isControlDisabled,\n        errorMessage: boundValue.errorMessage,\n        selectedKey: boundValue.raw ? boundValue.raw.map(key => key.toString()) : null,\n        useComboBoxAsMenuWidth: true,\n        hideErrorMessage: !parameters.ShowErrorMessage?.raw,\n        styles: {\n            root: {\n                height: sizing.height,\n                width: sizing.width,\n                display: 'flex',\n                alignItems: 'center',\n            },\n            callout: {\n                maxHeight: '300px !important'\n            }\n        },\n        clickToCopyProps: parameters.EnableCopyButton?.raw === true ? {\n            key: 'copy',\n            showOnlyOnHover: true,\n            iconProps: {\n                iconName: 'Copy'\n            }\n        } : undefined,\n        deleteButtonProps: parameters.EnableDeleteButton?.raw === true ? {\n            key: 'delete',\n            showOnlyOnHover: true,\n            iconProps: {\n                iconName: 'Cancel'\n            },\n            onClick: (e, value) => {\n                handleChange(null);\n            }\n        } : undefined,\n        onChange: (e, option) => handleChange(option),\n    });\n\n    return (\n        <ThemeProvider theme={theme} applyTo=\"none\">\n            <ComboBox {...componentProps}/>\n        </ThemeProvider>\n    );\n};\n"],"names":["_jsx"],"mappings":"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"}

package/dist/components/NestedControlRenderer/NestedControl.d.ts

@@ -0,0 +1,86 @@
+/// <reference types="@types/powerapps-component-framework" />
+import { IControl, IParameters, IProperty } from "../../interfaces";
+import { IBinding, IControlStates } from "./interfaces";
+export interface IOptions {
+    onGetBindings: () => {
+        [key: string]: IBinding;
+    };
+    /**
+    * PCF Context of parent control using this class. It will be used as base for nested control PCF context.
+    */
+    parentPcfContext: ComponentFramework.Context<any, any>;
+    /**
+     * Custom PCF to be rendered, if not provided you will get Base Control props.
+     */
+    /**
+* Container element into which the control will be rendered in.
+*/
+    onGetContainerElement?: () => HTMLDivElement;
+    onGetControlName?: () => string;
+    callbacks?: {
+        onInit?: (instance: NestedControl) => void;
+        onGetControlStates?: () => IControlStates | undefined;
+        onNotifyOutputChanged?: (ouputs: any) => void;
+        /**
+         * Triggers when the control changes a state that should be visible in control renderer UI (for example loading)
+         */
+        onControlStateChanged?: () => void;
+    };
+    overrides?: {
+        onGetProps?: (props: IControl<any, any, any, any>) => IControl<any, any, any, any>;
+        onRender?: (control: NestedControl, defaultRender: () => Promise<void>) => void;
+        onUnmount?: (control: NestedControl, defaultUnmount: () => void) => void;
+    };
+}
+export declare class NestedControl {
+    private _options;
+    private _pendingInitialRender;
+    private _errorMessage;
+    private _properties;
+    private _lastRenderedControlName;
+    private _hasCustomPcfBeenMounted;
+    private _customControlInstance;
+    private _customControlId;
+    private _manifest;
+    private _loading;
+    private _props;
+    private _mutationObserver;
+    private _destroyed;
+    private _initialized;
+    private _container;
+    private _hasControlBeenPatched;
+    constructor(options: IOptions);
+    getProps(): IControl<IParameters, any, any, any>;
+    refreshProps(): any;
+    getParameters(): {
+        [name: string]: IProperty;
+    };
+    isLoading(): boolean;
+    setLoading(loading: boolean): void;
+    getOptions(): IOptions;
+    render(): Promise<void>;
+    unmount(softUnmount?: boolean): void;
+    getErrorMessage(): string;
+    setError(message?: string): void;
+    isMountedPcfComponent(): boolean;
+    getContainer(): HTMLDivElement;
+    getControlName(): string;
+    getBindings(): {
+        [key: string]: IBinding;
+    };
+    getCustomControlId(): string;
+    private _overrideDecorator;
+    private _unmount;
+    private _render;
+    private _getCustomControlNameWithoutPrefix;
+    private _checkIfControlLoadedToDom;
+    private _getPropertiesFromBindings;
+    private _getPropertyInstance;
+    private _getPrimaryBindingName;
+    private _getManifestPrimaryBinding;
+    private _getManifest;
+    private _getCustomControlParameters;
+    private _patchUpdateView;
+    private _patchContext;
+    private _getFluentDesignLanguage;
+}