@talxis/base-controls 1.2604.2 → 1.2605.2-alpha

package/dist/components/TaskGrid/components/grid/lookup-many/LookupMany.js

@@ -0,0 +1,82 @@
+import { jsx, Fragment } from 'react/jsx-runtime';
+import * as React from 'react';
+import { useLocalizationService } from '../../../context.js';
+import { MultiValueRemove } from './components/multi-value-remove/MultiValueRemove.js';
+import { LookupManyComponents } from './components/index.js';
+import { LookupManyPropsContext } from './context.js';
+
+//can be used as base for new lookup (is task grid independent)
+const LookupMany = (props) => {
+    const { dataProvider, selectedRecords = [], isDisabled = false, onRecordSelect, onRecordOpen } = props;
+    const components = { ...LookupManyComponents, ...props.components };
+    const defaultOptionsPromiseRef = React.useRef(null);
+    const defaultOptionsResolveRef = React.useRef(null);
+    const localizationService = useLocalizationService();
+    const hasBeenUnmountedRef = React.useRef(false);
+    const MultiValueContainerComponent = React.useRef(components.onRenderMultiValueContainer);
+    const MultiValueLabel = React.useRef(components.onRenderMultiValueLabel);
+    const Option = React.useRef(components.onRenderOption);
+    const onLoadOptions = async (inputValue) => {
+        if (!defaultOptionsPromiseRef.current) {
+            defaultOptionsPromiseRef.current = new Promise((resolve) => {
+                defaultOptionsResolveRef.current = resolve;
+            });
+        }
+        await defaultOptionsPromiseRef.current;
+        if (hasBeenUnmountedRef.current)
+            return [];
+        dataProvider.setSearchQuery(inputValue);
+        const records = await dataProvider.refresh();
+        return records.map(record => {
+            return {
+                ...record.getNamedReference(),
+                rawData: record.getRawData()
+            };
+        });
+    };
+    //resolve the promise so initial load starts
+    const onFocus = () => {
+        setTimeout(() => {
+            defaultOptionsResolveRef.current?.();
+        }, 0);
+    };
+    React.useEffect(() => {
+        return () => {
+            hasBeenUnmountedRef.current = true;
+            defaultOptionsResolveRef.current?.();
+        };
+    }, []);
+    return jsx(LookupManyPropsContext.Provider, { value: props, children: components.onRenderSelect({
+            isMulti: true,
+            isDisabled: isDisabled,
+            menuPortalTarget: document.body,
+            value: selectedRecords,
+            menuPlacement: 'auto',
+            placeholder: '',
+            isClearable: false,
+            menuShouldScrollIntoView: false,
+            closeMenuOnSelect: false,
+            //@ts-ignore
+            defaultOptions: true,
+            components: {
+                IndicatorSeparator: () => jsx(Fragment, {}),
+                DropdownIndicator: () => jsx(Fragment, {}),
+                LoadingIndicator: () => jsx(Fragment, {}),
+                MultiValueContainer: MultiValueContainerComponent.current,
+                MultiValueRemove: MultiValueRemove,
+                MultiValueLabel: MultiValueLabel.current,
+                Option: Option.current,
+            },
+            noOptionsMessage: () => localizationService.getLocalizedString('noRecordsFound'),
+            loadingMessage: () => localizationService.getLocalizedString('loading'),
+            getOptionValue: (record) => record.id.guid,
+            getOptionLabel: (record) => record.name,
+            onChange: (selectedRecords) => onRecordSelect?.(selectedRecords),
+            onFocus: onFocus,
+            loadOptions: onLoadOptions,
+            onNavigate: onRecordOpen
+        }) });
+};
+
+export { LookupMany };
+//# sourceMappingURL=LookupMany.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/LookupMany.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LookupMany.js","sources":["../../../../../../src/components/TaskGrid/components/grid/lookup-many/LookupMany.tsx"],"sourcesContent":["import { IDataProvider } from '@talxis/client-libraries';\nimport * as React from 'react';\nimport { useLocalizationService } from '../../../context';\nimport { MultiValueRemove } from './components/multi-value-remove/MultiValueRemove';\nimport { LookupManyComponents, ILookupManyComponents } from './components';\nimport { LookupManyPropsContext } from './context';\n\nexport interface ILookupManyProps {\n    dataProvider: IDataProvider;\n    selectedRecordHeight?: number;\n    isDisabled?: boolean;\n    selectedRecords?: ComponentFramework.EntityReference[];\n    components?: Partial<ILookupManyComponents>;\n    onRecordSelect?: (selectedRecords: ComponentFramework.EntityReference[]) => void;\n    onRecordOpen?: (record: ComponentFramework.EntityReference) => void;\n}\n\n//can be used as base for new lookup (is task grid independent)\n\nexport const LookupMany = (props: ILookupManyProps) => {\n    const { dataProvider, selectedRecords = [], isDisabled = false, onRecordSelect, onRecordOpen } = props;\n    const components = { ...LookupManyComponents, ...props.components };\n    const defaultOptionsPromiseRef = React.useRef<Promise<any> | null>(null);\n    const defaultOptionsResolveRef = React.useRef<any>(null);\n    const localizationService = useLocalizationService();\n    const hasBeenUnmountedRef = React.useRef(false);\n    const MultiValueContainerComponent = React.useRef(components.onRenderMultiValueContainer);\n    const MultiValueLabel = React.useRef(components.onRenderMultiValueLabel);\n    const Option = React.useRef(components.onRenderOption);\n\n    const onLoadOptions = async (inputValue: string): Promise<ComponentFramework.EntityReference[]> => {\n        if (!defaultOptionsPromiseRef.current) {\n            defaultOptionsPromiseRef.current = new Promise((resolve) => {\n                defaultOptionsResolveRef.current = resolve;\n            });\n        }\n        await defaultOptionsPromiseRef.current;\n        if(hasBeenUnmountedRef.current) return [];\n        dataProvider.setSearchQuery(inputValue);\n        const records = await dataProvider.refresh();\n        return records.map(record => {\n            return {\n                ...record.getNamedReference(),\n                rawData: record.getRawData()\n            }\n        })\n    }\n\n    //resolve the promise so initial load starts\n    const onFocus = () => {\n        setTimeout(() => {\n            defaultOptionsResolveRef.current?.();\n        }, 0);\n    }\n\n    React.useEffect(() => {\n        return () => {\n            hasBeenUnmountedRef.current = true;\n            defaultOptionsResolveRef.current?.();\n        }\n    }, []);\n\n\n    return <LookupManyPropsContext.Provider value={props}>\n        {components.onRenderSelect({\n            isMulti: true,\n            isDisabled: isDisabled,\n            menuPortalTarget: document.body,\n            value: selectedRecords,\n            menuPlacement: 'auto',\n            placeholder: '',\n            isClearable: false,\n            menuShouldScrollIntoView: false,\n            closeMenuOnSelect: false,\n            //@ts-ignore\n            defaultOptions: true,\n            components: {\n                IndicatorSeparator: () => <></>,\n                DropdownIndicator: () => <></>,\n                LoadingIndicator: () => <></>,\n                MultiValueContainer: MultiValueContainerComponent.current,\n                MultiValueRemove: MultiValueRemove,\n                MultiValueLabel: MultiValueLabel.current,\n                Option: Option.current,\n            },\n\n            noOptionsMessage: () => localizationService.getLocalizedString('noRecordsFound'),\n            loadingMessage: () => localizationService.getLocalizedString('loading'),\n            getOptionValue: (record) => record.id.guid,\n            getOptionLabel: (record) => record.name,\n            onChange: (selectedRecords) => onRecordSelect?.(selectedRecords as ComponentFramework.EntityReference[]),\n            onFocus: onFocus,\n            loadOptions: onLoadOptions,\n            onNavigate: onRecordOpen\n        })}\n    </LookupManyPropsContext.Provider>\n}\n"],"names":["_jsx","_Fragment"],"mappings":"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"}

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/ColorfulLookupMany.d.ts

@@ -0,0 +1,5 @@
+import { ILookupManyProps } from "../LookupMany";
+export interface IColorfulLookupManyProps extends ILookupManyProps {
+    colorPropertyName?: string;
+}
+export declare const ColorfulLookupMany: (props: IColorfulLookupManyProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/ColorfulLookupMany.js

@@ -0,0 +1,12 @@
+import { jsx } from 'react/jsx-runtime';
+import { LookupMany } from '../LookupMany.js';
+import { DEFAULT_TAG_LOOKUP_MANY_COMPONENTS } from './components/index.js';
+import { ColorfulLookupManyPropsContext } from './context.js';
+
+const ColorfulLookupMany = (props) => {
+    const components = { ...DEFAULT_TAG_LOOKUP_MANY_COMPONENTS, ...props.components };
+    return jsx(ColorfulLookupManyPropsContext.Provider, { value: props, children: jsx(LookupMany, { ...props, components: components }) });
+};
+
+export { ColorfulLookupMany };
+//# sourceMappingURL=ColorfulLookupMany.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/ColorfulLookupMany.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorfulLookupMany.js","sources":["../../../../../../../src/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/ColorfulLookupMany.tsx"],"sourcesContent":["import { ILookupManyProps, LookupMany } from \"../LookupMany\";\nimport { DEFAULT_TAG_LOOKUP_MANY_COMPONENTS } from \"./components\";\nimport { ColorfulLookupManyPropsContext } from \"./context\";\n\nexport interface IColorfulLookupManyProps extends ILookupManyProps {\n    colorPropertyName?: string;\n}\n\nexport const ColorfulLookupMany = (props: IColorfulLookupManyProps) => {\n    const components = { ...DEFAULT_TAG_LOOKUP_MANY_COMPONENTS, ...props.components };\n    return <ColorfulLookupManyPropsContext.Provider value={props}>\n        <LookupMany\n            {...props}\n            components={components}\n        />\n    </ColorfulLookupManyPropsContext.Provider>\n}\n"],"names":["_jsx"],"mappings":";;;;;AAQa,MAAA,kBAAkB,GAAG,CAAC,KAA+B,KAAI;IAClE,MAAM,UAAU,GAAG,EAAE,GAAG,kCAAkC,EAAE,GAAG,KAAK,CAAC,UAAU,EAAE,CAAC;AAClF,IAAA,OAAOA,IAAC,8BAA8B,CAAC,QAAQ,EAAC,EAAA,KAAK,EAAE,KAAK,EAAA,QAAA,EACxDA,IAAC,UAAU,EAAA,EAAA,GACH,KAAK,EACT,UAAU,EAAE,UAAU,EAAA,CACxB,GACoC,CAAA;AAC9C;;;;"}

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/index.d.ts

@@ -0,0 +1,2 @@
+import { ILookupManyComponents } from "../../components";
+export declare const DEFAULT_TAG_LOOKUP_MANY_COMPONENTS: ILookupManyComponents;

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/index.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { LookupManyComponents } from '../../components/index.js';
+import { MultiValueContainer } from './multi-value-container/MultiValueContainer.js';
+import { Option } from './option/Option.js';
+
+const DEFAULT_TAG_LOOKUP_MANY_COMPONENTS = {
+    ...LookupManyComponents,
+    onRenderMultiValueContainer: (props) => jsx(MultiValueContainer, { ...props }),
+    onRenderOption: (props) => jsx(Option, { ...props })
+};
+
+export { DEFAULT_TAG_LOOKUP_MANY_COMPONENTS };
+//# sourceMappingURL=index.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../../../src/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/index.tsx"],"sourcesContent":["import { LookupManyComponents, ILookupManyComponents } from \"../../components\";\nimport { MultiValueContainer } from \"./multi-value-container\";\nimport { Option } from \"./option\";\n\nexport const DEFAULT_TAG_LOOKUP_MANY_COMPONENTS: ILookupManyComponents = {\n    ...LookupManyComponents,\n    onRenderMultiValueContainer: (props) => <MultiValueContainer {...props} />,\n    onRenderOption: (props) => <Option {...props} />\n}\n"],"names":["_jsx"],"mappings":";;;;;AAIa,MAAA,kCAAkC,GAA0B;AACrE,IAAA,GAAG,oBAAoB;IACvB,2BAA2B,EAAE,CAAC,KAAK,KAAKA,GAAC,CAAA,mBAAmB,EAAK,EAAA,GAAA,KAAK,EAAI,CAAA;IAC1E,cAAc,EAAE,CAAC,KAAK,KAAKA,GAAC,CAAA,MAAM,EAAK,EAAA,GAAA,KAAK,EAAI,CAAA;;;;;"}

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/multi-value-container/MultiValueContainer.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="@types/powerapps-component-framework" />
+import { MultiValueGenericProps } from 'react-select';
+export declare const MultiValueContainer: (props: MultiValueGenericProps<ComponentFramework.EntityReference, boolean, any>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/multi-value-container/MultiValueContainer.js

@@ -0,0 +1,17 @@
+import { jsx } from 'react/jsx-runtime';
+import { useTheme, ThemeProvider } from '@fluentui/react';
+import { Theming, useThemeGenerator } from '@talxis/react-components';
+import { MultiValueContainer as MultiValueContainer$1 } from '../../../components/multi-value-container/MultiValueContainer.js';
+import { useColorfulLookupManyProps } from '../../context.js';
+
+const MultiValueContainer = (props) => {
+    const theme = useTheme();
+    const { colorPropertyName = 'color' } = useColorfulLookupManyProps();
+    const backgroundColor = props.data.rawData?.[colorPropertyName] ?? theme.palette.neutralLight;
+    const textColor = Theming.GetTextColorForBackground(backgroundColor);
+    const tagTheme = useThemeGenerator(textColor, backgroundColor, textColor);
+    return (jsx(ThemeProvider, { theme: tagTheme, applyTo: 'none', children: jsx(MultiValueContainer$1, { ...props }) }));
+};
+
+export { MultiValueContainer };
+//# sourceMappingURL=MultiValueContainer.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/multi-value-container/MultiValueContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultiValueContainer.js","sources":["../../../../../../../../../src/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/multi-value-container/MultiValueContainer.tsx"],"sourcesContent":["import { ThemeProvider, useTheme } from '@fluentui/react';\nimport { MultiValueGenericProps } from 'react-select';\nimport { Theming, useThemeGenerator } from '@talxis/react-components';\nimport { MultiValueContainer as NativeMultiValueContainer } from '../../../components/multi-value-container/MultiValueContainer';\nimport { useColorfulLookupManyProps } from '../../context';\n\nexport const MultiValueContainer = (props: MultiValueGenericProps<ComponentFramework.EntityReference, boolean, any>) => {\n    const theme = useTheme();\n    const { colorPropertyName = 'color' } = useColorfulLookupManyProps();\n    const backgroundColor = (props.data as any).rawData?.[colorPropertyName] ?? theme.palette.neutralLight;\n    const textColor = Theming.GetTextColorForBackground(backgroundColor);\n    const tagTheme = useThemeGenerator(textColor, backgroundColor, textColor);\n\n    return (\n        <ThemeProvider theme={tagTheme} applyTo='none'>\n            <NativeMultiValueContainer {...props} />\n        </ThemeProvider>\n    );\n};\n"],"names":["_jsx","NativeMultiValueContainer"],"mappings":";;;;;;AAMa,MAAA,mBAAmB,GAAG,CAAC,KAA+E,KAAI;AACnH,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,EAAE,iBAAiB,GAAG,OAAO,EAAE,GAAG,0BAA0B,EAAE,CAAC;AACrE,IAAA,MAAM,eAAe,GAAI,KAAK,CAAC,IAAY,CAAC,OAAO,GAAG,iBAAiB,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC;IACvG,MAAM,SAAS,GAAG,OAAO,CAAC,yBAAyB,CAAC,eAAe,CAAC,CAAC;IACrE,MAAM,QAAQ,GAAG,iBAAiB,CAAC,SAAS,EAAE,eAAe,EAAE,SAAS,CAAC,CAAC;AAE1E,IAAA,QACIA,GAAC,CAAA,aAAa,IAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAC,MAAM,EAAA,QAAA,EAC1CA,IAACC,qBAAyB,EAAA,EAAA,GAAK,KAAK,EAAI,CAAA,EAAA,CAC5B,EAClB;AACN;;;;"}

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/multi-value-container/index.d.ts

@@ -0,0 +1 @@
+export * from './MultiValueContainer';

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/multi-value-container/index.js

@@ -0,0 +1,2 @@
+export { MultiValueContainer } from './MultiValueContainer.js';
+//# sourceMappingURL=index.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/option/Option.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="@types/powerapps-component-framework" />
+import { OptionProps } from 'react-select';
+export declare const Option: (props: OptionProps<ComponentFramework.EntityReference, boolean, any>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/option/Option.js

@@ -0,0 +1,17 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import * as React from 'react';
+import { components } from 'react-select';
+import { useTheme } from '@fluentui/react';
+import { useColorfulLookupManyProps } from '../../context.js';
+import { getOptionStyles } from './styles.js';
+
+const Option = (props) => {
+    const theme = useTheme();
+    const { colorPropertyName = 'color' } = useColorfulLookupManyProps();
+    const color = props.data.rawData?.[colorPropertyName] ?? theme.palette.neutralLight;
+    const styles = React.useMemo(() => getOptionStyles(color), [color]);
+    return (jsx(components.Option, { ...props, children: jsxs("div", { className: styles.container, children: [jsx("span", { className: styles.dot }), props.children] }) }));
+};
+
+export { Option };
+//# sourceMappingURL=Option.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/option/Option.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Option.js","sources":["../../../../../../../../../src/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/option/Option.tsx"],"sourcesContent":["import * as React from 'react';\nimport { components, OptionProps } from 'react-select';\nimport { useTheme } from '@fluentui/react';\nimport { useColorfulLookupManyProps } from '../../context';\nimport { getOptionStyles } from './styles';\n\nexport const Option = (props: OptionProps<ComponentFramework.EntityReference, boolean, any>) => {\n    const theme = useTheme();\n    const { colorPropertyName = 'color' } = useColorfulLookupManyProps();\n    const color = (props.data as any).rawData?.[colorPropertyName] ?? theme.palette.neutralLight\n    const styles = React.useMemo(() => getOptionStyles(color), [color]);\n\n    return (\n        <components.Option {...props}>\n            <div className={styles.container}>\n                <span className={styles.dot} />\n                {props.children}\n            </div>\n        </components.Option>\n    );\n};\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;AAMa,MAAA,MAAM,GAAG,CAAC,KAAoE,KAAI;AAC3F,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,EAAE,iBAAiB,GAAG,OAAO,EAAE,GAAG,0BAA0B,EAAE,CAAC;AACrE,IAAA,MAAM,KAAK,GAAI,KAAK,CAAC,IAAY,CAAC,OAAO,GAAG,iBAAiB,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,YAAY,CAAA;AAC5F,IAAA,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,eAAe,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;AAEpE,IAAA,QACIA,GAAA,CAAC,UAAU,CAAC,MAAM,EAAA,EAAA,GAAK,KAAK,EAAA,QAAA,EACxBC,IAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,SAAS,EAC5B,QAAA,EAAA,CAAAD,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,MAAM,CAAC,GAAG,EAAA,CAAI,EAC9B,KAAK,CAAC,QAAQ,CACb,EAAA,CAAA,EAAA,CACU,EACtB;AACN;;;;"}

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/option/index.d.ts

@@ -0,0 +1 @@
+export * from './Option';

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/option/index.js

@@ -0,0 +1,2 @@
+export { Option } from './Option.js';
+//# sourceMappingURL=index.js.map

package/dist/components/TaskGrid/{data-providers/custom-columns-data-provider → components/grid/lookup-many/colorful-lookup-many/components/option}/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/option/styles.d.ts

@@ -0,0 +1,14 @@
+export declare const getOptionStyles: (color: string) => import("@fluentui/react").IProcessedStyleSet<{
+    container: {
+        display: string;
+        alignItems: string;
+        gap: number;
+    };
+    dot: {
+        width: number;
+        height: number;
+        borderRadius: string;
+        backgroundColor: string;
+        flexShrink: number;
+    };
+}>;

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/option/styles.js

@@ -0,0 +1,21 @@
+import { mergeStyleSets } from '@fluentui/react';
+
+const getOptionStyles = (color) => {
+    return mergeStyleSets({
+        container: {
+            display: 'flex',
+            alignItems: 'center',
+            gap: 8,
+        },
+        dot: {
+            width: 12,
+            height: 12,
+            borderRadius: '50%',
+            backgroundColor: color,
+            flexShrink: 0,
+        },
+    });
+};
+
+export { getOptionStyles };
+//# sourceMappingURL=styles.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/option/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../../../../../../../src/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/components/option/styles.ts"],"sourcesContent":["import { mergeStyleSets } from '@fluentui/react';\n\nexport const getOptionStyles = (color: string) => {\n    return mergeStyleSets({\n        container: {\n            display: 'flex',\n            alignItems: 'center',\n            gap: 8,\n        },\n        dot: {\n            width: 12,\n            height: 12,\n            borderRadius: '50%',\n            backgroundColor: color,\n            flexShrink: 0,\n        },\n    });\n};\n"],"names":[],"mappings":";;AAEa,MAAA,eAAe,GAAG,CAAC,KAAa,KAAI;AAC7C,IAAA,OAAO,cAAc,CAAC;AAClB,QAAA,SAAS,EAAE;AACP,YAAA,OAAO,EAAE,MAAM;AACf,YAAA,UAAU,EAAE,QAAQ;AACpB,YAAA,GAAG,EAAE,CAAC;AACT,SAAA;AACD,QAAA,GAAG,EAAE;AACD,YAAA,KAAK,EAAE,EAAE;AACT,YAAA,MAAM,EAAE,EAAE;AACV,YAAA,YAAY,EAAE,KAAK;AACnB,YAAA,eAAe,EAAE,KAAK;AACtB,YAAA,UAAU,EAAE,CAAC;AAChB,SAAA;AACJ,KAAA,CAAC,CAAC;AACP;;;;"}

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/context.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { IColorfulLookupManyProps } from "./ColorfulLookupMany";
+export declare const ColorfulLookupManyPropsContext: React.Context<IColorfulLookupManyProps>;
+export declare const useColorfulLookupManyProps: () => IColorfulLookupManyProps;

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/context.js

@@ -0,0 +1,9 @@
+import React__default from 'react';
+
+const ColorfulLookupManyPropsContext = React__default.createContext(null);
+const useColorfulLookupManyProps = () => {
+    return React__default.useContext(ColorfulLookupManyPropsContext);
+};
+
+export { ColorfulLookupManyPropsContext, useColorfulLookupManyProps };
+//# sourceMappingURL=context.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","sources":["../../../../../../../src/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/context.ts"],"sourcesContent":["import React from \"react\";\nimport { IColorfulLookupManyProps } from \"./ColorfulLookupMany\";\n\nexport const ColorfulLookupManyPropsContext = React.createContext<IColorfulLookupManyProps>(null as any);\n\nexport const useColorfulLookupManyProps = () => {\n    return React.useContext(ColorfulLookupManyPropsContext);\n}\n"],"names":["React"],"mappings":";;AAGa,MAAA,8BAA8B,GAAGA,cAAK,CAAC,aAAa,CAA2B,IAAW,EAAE;AAElG,MAAM,0BAA0B,GAAG,MAAK;AAC3C,IAAA,OAAOA,cAAK,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC;AAC5D;;;;"}

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/index.d.ts

@@ -0,0 +1 @@
+export * from './ColorfulLookupMany';

package/dist/components/TaskGrid/components/grid/lookup-many/colorful-lookup-many/index.js

@@ -0,0 +1,2 @@
+export { ColorfulLookupMany } from './ColorfulLookupMany.js';
+//# sourceMappingURL=index.js.map

package/dist/components/TaskGrid/{data-providers/saved-query-data-provider → components/grid/lookup-many/colorful-lookup-many}/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/TaskGrid/components/grid/lookup-many/components/index.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="@types/powerapps-component-framework" />
+/// <reference types="react" />
+import { MultiValueGenericProps, OptionProps, Props } from "react-select";
+export interface ILookupManyComponents {
+    onRenderMultiValueContainer: (props: MultiValueGenericProps<ComponentFramework.EntityReference, boolean, any>) => JSX.Element;
+    onRenderMultiValueLabel: (props: MultiValueGenericProps<ComponentFramework.EntityReference, boolean, any>) => JSX.Element;
+    onRenderSelect: (selectProps: Props<ComponentFramework.EntityReference, boolean, any>) => JSX.Element;
+    onRenderOption: (props: OptionProps<ComponentFramework.EntityReference, boolean, any>) => JSX.Element;
+}
+export declare const LookupManyComponents: ILookupManyComponents;

package/dist/components/TaskGrid/components/grid/lookup-many/components/index.js

@@ -0,0 +1,15 @@
+import { jsx } from 'react/jsx-runtime';
+import { components } from 'react-select';
+import AsyncSelect from 'react-select/async';
+import { MultiValueContainer } from './multi-value-container/MultiValueContainer.js';
+import { MultiValueLabel } from './multi-value-label/MultiValueLabel.js';
+
+const LookupManyComponents = {
+    onRenderSelect: (selectProps) => jsx(AsyncSelect, { ...selectProps }),
+    onRenderMultiValueContainer: (props) => jsx(MultiValueContainer, { ...props }),
+    onRenderMultiValueLabel: (props) => jsx(MultiValueLabel, { ...props }),
+    onRenderOption: (props) => jsx(components.Option, { ...props })
+};
+
+export { LookupManyComponents };
+//# sourceMappingURL=index.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../../src/components/TaskGrid/components/grid/lookup-many/components/index.tsx"],"sourcesContent":["import { MultiValueGenericProps, OptionProps, Props, components } from \"react-select\";\nimport AsyncSelect from \"react-select/async\";\nimport { MultiValueLabel } from \"./multi-value-label\";\nimport { MultiValueContainer } from \"./multi-value-container\";\n\nexport interface ILookupManyComponents {\n    onRenderMultiValueContainer: (props: MultiValueGenericProps<ComponentFramework.EntityReference, boolean, any>) => JSX.Element;\n    onRenderMultiValueLabel: (props: MultiValueGenericProps<ComponentFramework.EntityReference, boolean, any>) => JSX.Element;\n    onRenderSelect: (selectProps: Props<ComponentFramework.EntityReference, boolean, any>) => JSX.Element;\n    onRenderOption: (props: OptionProps<ComponentFramework.EntityReference, boolean, any>) => JSX.Element;\n}\n\nexport const LookupManyComponents: ILookupManyComponents = {\n    onRenderSelect: (selectProps) => <AsyncSelect {...selectProps} />,\n    onRenderMultiValueContainer: (props) => <MultiValueContainer {...props} />,\n    onRenderMultiValueLabel: (props) => <MultiValueLabel {...props} />,\n    onRenderOption: (props) => <components.Option {...props} />\n}"],"names":["_jsx"],"mappings":";;;;;;AAYa,MAAA,oBAAoB,GAA0B;IACvD,cAAc,EAAE,CAAC,WAAW,KAAKA,GAAC,CAAA,WAAW,EAAK,EAAA,GAAA,WAAW,EAAI,CAAA;IACjE,2BAA2B,EAAE,CAAC,KAAK,KAAKA,GAAC,CAAA,mBAAmB,EAAK,EAAA,GAAA,KAAK,EAAI,CAAA;IAC1E,uBAAuB,EAAE,CAAC,KAAK,KAAKA,GAAC,CAAA,eAAe,EAAK,EAAA,GAAA,KAAK,EAAI,CAAA;AAClE,IAAA,cAAc,EAAE,CAAC,KAAK,KAAKA,GAAC,CAAA,UAAU,CAAC,MAAM,EAAK,EAAA,GAAA,KAAK,EAAI,CAAA;;;;;"}

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-container/MultiValueContainer.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="@types/powerapps-component-framework" />
+import { MultiValueGenericProps } from 'react-select';
+export declare const MultiValueContainer: ({ children, innerProps, selectProps }: MultiValueGenericProps<ComponentFramework.EntityReference, boolean, any>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-container/MultiValueContainer.js

@@ -0,0 +1,15 @@
+import { jsx } from 'react/jsx-runtime';
+import * as React from 'react';
+import { useTheme } from '@fluentui/react';
+import { getMultiValueContainerStyles } from './styles.js';
+import { useLookupManyProps } from '../../context.js';
+
+const MultiValueContainer = ({ children, innerProps, selectProps }) => {
+    const theme = useTheme();
+    const props = useLookupManyProps();
+    const styles = React.useMemo(() => getMultiValueContainerStyles(theme, selectProps.isDisabled, props.selectedRecordHeight), [theme, selectProps.isDisabled, props.selectedRecordHeight]);
+    return (jsx("div", { ...innerProps, className: styles.root, children: children }));
+};
+
+export { MultiValueContainer };
+//# sourceMappingURL=MultiValueContainer.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-container/MultiValueContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultiValueContainer.js","sources":["../../../../../../../../src/components/TaskGrid/components/grid/lookup-many/components/multi-value-container/MultiValueContainer.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTheme } from '@fluentui/react';\nimport { MultiValueGenericProps } from 'react-select';\nimport { getMultiValueContainerStyles } from './styles';\nimport { useLookupManyProps } from '../../context';\n\nexport const MultiValueContainer = ({ children, innerProps, selectProps }: MultiValueGenericProps<ComponentFramework.EntityReference, boolean, any>) => {\n    const theme = useTheme();\n    const props = useLookupManyProps();\n    const styles = React.useMemo(() => getMultiValueContainerStyles(theme, selectProps.isDisabled, props.selectedRecordHeight), [theme, selectProps.isDisabled, props.selectedRecordHeight]);\n    return (\n        <div {...innerProps} className={styles.root}>\n            {children}\n        </div>\n    );\n};\n"],"names":["_jsx"],"mappings":";;;;;;AAMO,MAAM,mBAAmB,GAAG,CAAC,EAAE,QAAQ,EAAE,UAAU,EAAE,WAAW,EAA4E,KAAI;AACnJ,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;AACzB,IAAA,MAAM,KAAK,GAAG,kBAAkB,EAAE,CAAC;AACnC,IAAA,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,4BAA4B,CAAC,KAAK,EAAE,WAAW,CAAC,UAAU,EAAE,KAAK,CAAC,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,UAAU,EAAE,KAAK,CAAC,oBAAoB,CAAC,CAAC,CAAC;AACzL,IAAA,QACIA,GAAA,CAAA,KAAA,EAAA,EAAA,GAAS,UAAU,EAAE,SAAS,EAAE,MAAM,CAAC,IAAI,EAAA,QAAA,EACtC,QAAQ,EAAA,CACP,EACR;AACN;;;;"}

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-container/index.d.ts

@@ -0,0 +1 @@
+export * from './MultiValueContainer';

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-container/index.js

@@ -0,0 +1,2 @@
+export { MultiValueContainer } from './MultiValueContainer.js';
+//# sourceMappingURL=index.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-container/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-container/styles.d.ts

@@ -0,0 +1,18 @@
+import { ITheme } from '@fluentui/react';
+export declare const getMultiValueContainerStyles: (theme: ITheme, isDisabled?: boolean, height?: number) => import("@fluentui/react").IProcessedStyleSet<{
+    root: {
+        display: string;
+        alignItems: string;
+        backgroundColor: string;
+        border: string;
+        borderRadius: number;
+        margin: string;
+        padding: string;
+        paddingRight: number;
+        fontSize: number;
+        color: string;
+        maxWidth: number;
+        overflow: string;
+        height: number;
+    };
+}>;

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-container/styles.js

@@ -0,0 +1,24 @@
+import { mergeStyleSets } from '@fluentui/react';
+
+const getMultiValueContainerStyles = (theme, isDisabled, height) => {
+    return mergeStyleSets({
+        root: {
+            display: 'inline-flex',
+            alignItems: 'center',
+            backgroundColor: theme.palette.neutralLighter,
+            border: `1px solid ${theme.palette.neutralLight}`,
+            borderRadius: 2,
+            margin: '2px 4px 2px 0',
+            padding: '1px 4px',
+            paddingRight: isDisabled ? 4 : 0,
+            fontSize: 12,
+            color: theme.palette.neutralPrimary,
+            maxWidth: 200,
+            overflow: 'hidden',
+            height: height ?? 20
+        },
+    });
+};
+
+export { getMultiValueContainerStyles };
+//# sourceMappingURL=styles.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-container/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../../../../../../src/components/TaskGrid/components/grid/lookup-many/components/multi-value-container/styles.ts"],"sourcesContent":["import { ITheme, mergeStyleSets } from '@fluentui/react';\n\nexport const getMultiValueContainerStyles = (theme: ITheme, isDisabled?: boolean, height?: number) => {\n    return mergeStyleSets({\n        root: {\n            display: 'inline-flex',\n            alignItems: 'center',\n            backgroundColor: theme.palette.neutralLighter,\n            border: `1px solid ${theme.palette.neutralLight}`,\n            borderRadius: 2,\n            margin: '2px 4px 2px 0',\n            padding: '1px 4px',\n            paddingRight: isDisabled ? 4 : 0,\n            fontSize: 12,\n            color: theme.palette.neutralPrimary,\n            maxWidth: 200,\n            overflow: 'hidden',\n            height: height ?? 20\n        },\n    });\n};\n"],"names":[],"mappings":";;AAEa,MAAA,4BAA4B,GAAG,CAAC,KAAa,EAAE,UAAoB,EAAE,MAAe,KAAI;AACjG,IAAA,OAAO,cAAc,CAAC;AAClB,QAAA,IAAI,EAAE;AACF,YAAA,OAAO,EAAE,aAAa;AACtB,YAAA,UAAU,EAAE,QAAQ;AACpB,YAAA,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc;AAC7C,YAAA,MAAM,EAAE,CAAa,UAAA,EAAA,KAAK,CAAC,OAAO,CAAC,YAAY,CAAE,CAAA;AACjD,YAAA,YAAY,EAAE,CAAC;AACf,YAAA,MAAM,EAAE,eAAe;AACvB,YAAA,OAAO,EAAE,SAAS;YAClB,YAAY,EAAE,UAAU,GAAG,CAAC,GAAG,CAAC;AAChC,YAAA,QAAQ,EAAE,EAAE;AACZ,YAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc;AACnC,YAAA,QAAQ,EAAE,GAAG;AACb,YAAA,QAAQ,EAAE,QAAQ;YAClB,MAAM,EAAE,MAAM,IAAI,EAAE;AACvB,SAAA;AACJ,KAAA,CAAC,CAAC;AACP;;;;"}

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-label/MultiValueLabel.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="@types/powerapps-component-framework" />
+import { MultiValueGenericProps } from 'react-select';
+export declare const MultiValueLabel: (props: MultiValueGenericProps<ComponentFramework.EntityReference, boolean, any>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-label/MultiValueLabel.js

@@ -0,0 +1,21 @@
+import { jsx } from 'react/jsx-runtime';
+import * as React from 'react';
+import { Link } from '@fluentui/react';
+import { getMultiValueLabelStyles } from './styles.js';
+
+const MultiValueLabel = (props) => {
+    const styles = React.useMemo(() => getMultiValueLabelStyles(), []);
+    const { selectProps, data, children } = props;
+    const { onNavigate } = selectProps;
+    const label = jsx("span", { title: data.name, className: styles.root, children: children });
+    if (onNavigate) {
+        return (jsx(Link, { styles: { root: styles.link }, onClick: (e) => {
+                e.preventDefault();
+                onNavigate(data);
+            }, children: label }));
+    }
+    return label;
+};
+
+export { MultiValueLabel };
+//# sourceMappingURL=MultiValueLabel.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-label/MultiValueLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultiValueLabel.js","sources":["../../../../../../../../src/components/TaskGrid/components/grid/lookup-many/components/multi-value-label/MultiValueLabel.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Link } from '@fluentui/react';\nimport { MultiValueGenericProps } from 'react-select';\nimport { getMultiValueLabelStyles } from './styles';\n\nexport const MultiValueLabel = (props: MultiValueGenericProps<ComponentFramework.EntityReference, boolean, any>) => {\n    const styles = React.useMemo(() => getMultiValueLabelStyles(), []);\n    const {selectProps, data, children} = props;\n    const { onNavigate } = selectProps as any;\n\n    const label = <span title={data.name} className={styles.root}>{children}</span>;\n\n    if (onNavigate) {\n        return (\n            <Link\n                styles={{ root: styles.link }}\n                onClick={(e) => {\n                    e.preventDefault();\n                    onNavigate(data);\n                }}\n            >\n                {label}\n            </Link>\n        );\n    }\n    return label;\n};\n"],"names":["_jsx"],"mappings":";;;;;AAKa,MAAA,eAAe,GAAG,CAAC,KAA+E,KAAI;AAC/G,IAAA,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,wBAAwB,EAAE,EAAE,EAAE,CAAC,CAAC;IACnE,MAAM,EAAC,WAAW,EAAE,IAAI,EAAE,QAAQ,EAAC,GAAG,KAAK,CAAC;AAC5C,IAAA,MAAM,EAAE,UAAU,EAAE,GAAG,WAAkB,CAAC;AAE1C,IAAA,MAAM,KAAK,GAAGA,GAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAE,IAAI,CAAC,IAAI,EAAE,SAAS,EAAE,MAAM,CAAC,IAAI,EAAG,QAAA,EAAA,QAAQ,GAAQ,CAAC;AAEhF,IAAA,IAAI,UAAU,EAAE;AACZ,QAAA,QACIA,GAAC,CAAA,IAAI,IACD,MAAM,EAAE,EAAE,IAAI,EAAE,MAAM,CAAC,IAAI,EAAE,EAC7B,OAAO,EAAE,CAAC,CAAC,KAAI;gBACX,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,UAAU,CAAC,IAAI,CAAC,CAAC;AACrB,aAAC,EAEA,QAAA,EAAA,KAAK,EACH,CAAA,EACT;AACL,KAAA;AACD,IAAA,OAAO,KAAK,CAAC;AACjB;;;;"}

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-label/index.d.ts

@@ -0,0 +1 @@
+export * from './MultiValueLabel';

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-label/index.js

@@ -0,0 +1,2 @@
+export { MultiValueLabel } from './MultiValueLabel.js';
+//# sourceMappingURL=index.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-label/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-label/styles.d.ts

@@ -0,0 +1,15 @@
+export declare const getMultiValueLabelStyles: () => import("@fluentui/react").IProcessedStyleSet<{
+    root: {
+        overflow: string;
+        textOverflow: string;
+        whiteSpace: string;
+        fontWeight: number;
+        display: string;
+    };
+    link: {
+        fontWeight: number;
+        pointerEvents: string;
+        overflow: string;
+        display: string;
+    };
+}>;

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-label/styles.js

@@ -0,0 +1,22 @@
+import { mergeStyleSets } from '@fluentui/react';
+
+const getMultiValueLabelStyles = () => {
+    return mergeStyleSets({
+        root: {
+            overflow: 'hidden',
+            textOverflow: 'ellipsis',
+            whiteSpace: 'nowrap',
+            fontWeight: 600,
+            display: 'block',
+        },
+        link: {
+            fontWeight: 600,
+            pointerEvents: 'all',
+            overflow: 'hidden',
+            display: 'block',
+        }
+    });
+};
+
+export { getMultiValueLabelStyles };
+//# sourceMappingURL=styles.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-label/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../../../../../../src/components/TaskGrid/components/grid/lookup-many/components/multi-value-label/styles.ts"],"sourcesContent":["import { mergeStyleSets } from '@fluentui/react';\n\nexport const getMultiValueLabelStyles = () => {\n    return mergeStyleSets({\n        root: {\n            overflow: 'hidden',\n            textOverflow: 'ellipsis',\n            whiteSpace: 'nowrap',\n            fontWeight: 600,\n            display: 'block',\n        },\n        link: {\n            fontWeight: 600,\n            pointerEvents: 'all',\n            overflow: 'hidden',\n            display: 'block',\n        }\n    });\n};\n"],"names":[],"mappings":";;AAEO,MAAM,wBAAwB,GAAG,MAAK;AACzC,IAAA,OAAO,cAAc,CAAC;AAClB,QAAA,IAAI,EAAE;AACF,YAAA,QAAQ,EAAE,QAAQ;AAClB,YAAA,YAAY,EAAE,UAAU;AACxB,YAAA,UAAU,EAAE,QAAQ;AACpB,YAAA,UAAU,EAAE,GAAG;AACf,YAAA,OAAO,EAAE,OAAO;AACnB,SAAA;AACD,QAAA,IAAI,EAAE;AACF,YAAA,UAAU,EAAE,GAAG;AACf,YAAA,aAAa,EAAE,KAAK;AACpB,YAAA,QAAQ,EAAE,QAAQ;AAClB,YAAA,OAAO,EAAE,OAAO;AACnB,SAAA;AACJ,KAAA,CAAC,CAAC;AACP;;;;"}

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-remove/MultiValueRemove.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="@types/powerapps-component-framework" />
+import { MultiValueRemoveProps } from 'react-select';
+export declare const MultiValueRemove: ({ innerProps, selectProps }: MultiValueRemoveProps<ComponentFramework.EntityReference, boolean, any>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-remove/MultiValueRemove.js

@@ -0,0 +1,18 @@
+import { jsx, Fragment } from 'react/jsx-runtime';
+import * as React from 'react';
+import { useTheme, Icon } from '@fluentui/react';
+import { getMultiValueRemoveStyles } from './styles.js';
+import { useLookupManyProps } from '../../context.js';
+
+const MultiValueRemove = ({ innerProps, selectProps }) => {
+    const theme = useTheme();
+    const props = useLookupManyProps();
+    const styles = React.useMemo(() => getMultiValueRemoveStyles(theme, props.selectedRecordHeight), [theme, props.selectedRecordHeight]);
+    if (selectProps.isDisabled) {
+        return jsx(Fragment, {});
+    }
+    return (jsx("div", { ...innerProps, className: styles.root, children: jsx(Icon, { iconName: "Cancel", className: styles.icon }) }));
+};
+
+export { MultiValueRemove };
+//# sourceMappingURL=MultiValueRemove.js.map

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-remove/MultiValueRemove.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultiValueRemove.js","sources":["../../../../../../../../src/components/TaskGrid/components/grid/lookup-many/components/multi-value-remove/MultiValueRemove.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon, useTheme } from '@fluentui/react';\nimport { MultiValueRemoveProps } from 'react-select';\nimport { getMultiValueRemoveStyles } from './styles';\nimport { useLookupManyProps } from '../../context';\n\nexport const MultiValueRemove = ({ innerProps, selectProps }: MultiValueRemoveProps<ComponentFramework.EntityReference, boolean, any>) => {\n    const theme = useTheme();\n    const props = useLookupManyProps();\n    const styles = React.useMemo(() => getMultiValueRemoveStyles(theme, props.selectedRecordHeight), [theme, props.selectedRecordHeight]);\n    if(selectProps.isDisabled) {\n        return <></>\n    }\n    return (\n        <div {...innerProps} className={styles.root}>\n            <Icon iconName=\"Cancel\" className={styles.icon} />\n        </div>\n    );\n};\n"],"names":["_jsx"],"mappings":";;;;;;AAMa,MAAA,gBAAgB,GAAG,CAAC,EAAE,UAAU,EAAE,WAAW,EAA2E,KAAI;AACrI,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;AACzB,IAAA,MAAM,KAAK,GAAG,kBAAkB,EAAE,CAAC;IACnC,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,yBAAyB,CAAC,KAAK,EAAE,KAAK,CAAC,oBAAoB,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,oBAAoB,CAAC,CAAC,CAAC;IACtI,IAAG,WAAW,CAAC,UAAU,EAAE;AACvB,QAAA,OAAOA,iBAAK,CAAA;AACf,KAAA;IACD,QACIA,GAAS,CAAA,KAAA,EAAA,EAAA,GAAA,UAAU,EAAE,SAAS,EAAE,MAAM,CAAC,IAAI,EAAA,QAAA,EACvCA,GAAC,CAAA,IAAI,IAAC,QAAQ,EAAC,QAAQ,EAAC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAA,CAAI,EAChD,CAAA,EACR;AACN;;;;"}

package/dist/components/TaskGrid/components/grid/lookup-many/components/multi-value-remove/styles.d.ts

@@ -0,0 +1,22 @@
+import { ITheme } from '@fluentui/react';
+export declare const getMultiValueRemoveStyles: (theme: ITheme, height?: number) => import("@fluentui/react").IProcessedStyleSet<{
+    root: {
+        display: string;
+        alignItems: string;
+        justifyContent: string;
+        marginLeft: number;
+        padding: number;
+        cursor: string;
+        borderRadius: number;
+        color: string;
+        height: number;
+        width: number;
+        ':hover': {
+            color: string;
+            backgroundColor: string;
+        };
+    };
+    icon: {
+        fontSize: number;
+    };
+}>;