@pega/cosmos-react-demos 7.11.3 → 7.11.4-10

package/jsx/dnd/StandardDragDropList/SelectionMenu.jsx

@@ -1,104 +0,0 @@
-import { useCallback, useState } from 'react';
-import styled, { css } from 'styled-components';
-import { defaultThemeProp, Flex, Menu, menuHelpers, useElement, useI18n } from '@pega/cosmos-react-core';
-import MultiSelectInput from '@pega/cosmos-react-core/lib/components/ComboBox/MultiSelectInput/MultiSelectInput';
-import { mockQuery } from './mockData';
-import Popover from './Popover';
-const StyledSelectionMenu = styled(Menu)(({ theme }) => {
-    return css `
-    margin-inline: calc(-2 * ${theme.base.spacing});
-  `;
-});
-StyledSelectionMenu.defaultProps = defaultThemeProp;
-const rootMenuItems = [
-    { id: 'fields', primary: 'Fields', items: [] },
-    { id: 'views', primary: 'Views', items: [] }
-];
-const SelectionMenu = ({ target, constraint, onCancel: onClose, onSubmit }) => {
-    const t = useI18n();
-    const [loading, setLoading] = useState(false);
-    const [filterValue, setFilterValue] = useState('');
-    const [inputEl, setInputEl] = useElement(null);
-    const [menuItems, setMenuItems] = useState(() => {
-        if (constraint?.types) {
-            const constrainedTypes = [];
-            if (constraint.types.includes('Field')) {
-                constrainedTypes.push(rootMenuItems[0]);
-            }
-            if (constraint.types.includes('View')) {
-                constrainedTypes.push(rootMenuItems[1]);
-            }
-            return constrainedTypes;
-        }
-        return rootMenuItems;
-    });
-    const [selected, setSelected] = useState(() => []);
-    const onItemExpand = useCallback(async (id) => {
-        const expandedItem = menuHelpers.getItem(menuItems, id);
-        if (!expandedItem || (expandedItem.items && expandedItem.items.length > 0)) {
-            return;
-        }
-        setLoading(true);
-        const subItems = await mockQuery({
-            type: id === 'fields' ? 'Field' : 'View',
-            delay: 1000
-        });
-        const newMenuItems = menuHelpers.mapItem(menuItems, id, item => {
-            return {
-                ...item,
-                items: subItems.map(subItem => ({
-                    id: subItem.id,
-                    primary: subItem.label,
-                    selected: !!selected.find(s => s.id === subItem.id)
-                }))
-            };
-        });
-        setMenuItems(newMenuItems);
-        setLoading(false);
-    }, [menuItems, selected]);
-    const onFilter = useCallback(async (e) => {
-        const val = e.currentTarget.value;
-        setFilterValue(val);
-        if (val) {
-            setLoading(true);
-            setMenuItems([]);
-            const matchedItems = await mockQuery({
-                filter: val,
-                delay: 1000
-            });
-            setMenuItems(matchedItems.map(matchedItem => {
-                return {
-                    id: matchedItem.id,
-                    primary: matchedItem.label,
-                    secondary: [matchedItem.subType ?? matchedItem.type],
-                    selected: !!selected.find(s => s.id === matchedItem.id)
-                };
-            }));
-            setLoading(false);
-            return;
-        }
-        setMenuItems(rootMenuItems);
-    }, []);
-    const onItemClick = useCallback((id) => {
-        setSelected(cur => {
-            if (cur.find(s => s.id === id)) {
-                return cur.filter(sel => sel.id !== id);
-            }
-            return [
-                ...cur,
-                { id, text: menuHelpers.getItem(menuItems, id).primary }
-            ];
-        });
-        setMenuItems(cur => menuHelpers.toggleSelected(cur, id));
-    }, [menuItems]);
-    return (<Popover target={target} heading='Content selection' onCancel={onClose} onSubmit={() => {
-            onSubmit(selected);
-        }}>
-      <Flex container={{ direction: 'column', gap: 2, pad: [1, 0] }}>
-        <MultiSelectInput ref={setInputEl} placeholder={t('search_placeholder_default')} value={filterValue} selected={selected} onChange={onFilter} onRemove={onItemClick}/>
-        <StyledSelectionMenu focusControlEl={inputEl ?? undefined} mode='multi-select' items={menuItems} scrollAt={10} loading={loading} onItemClick={onItemClick} onItemExpand={onItemExpand}/>
-      </Flex>
-    </Popover>);
-};
-export default SelectionMenu;
-//# sourceMappingURL=SelectionMenu.jsx.map

package/jsx/dnd/StandardDragDropList/SelectionMenu.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"SelectionMenu.jsx","sourceRoot":"","sources":["../../../src/dnd/StandardDragDropList/SelectionMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useState } from 'react';\nimport type { ChangeEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n  defaultThemeProp,\n  Flex,\n  Menu,\n  menuHelpers,\n  useElement,\n  useI18n\n} from '@pega/cosmos-react-core';\nimport type { MenuItemProps, PopoverProps } from '@pega/cosmos-react-core';\nimport MultiSelectInput from '@pega/cosmos-react-core/lib/components/ComboBox/MultiSelectInput/MultiSelectInput';\nimport type { MultiSelectInputProps } from '@pega/cosmos-react-core/lib/components/ComboBox/MultiSelectInput/MultiSelectInput.types';\nimport type { FieldType } from '@pega/cosmos-react-build';\n\nimport { mockQuery } from './mockData';\nimport type { ContentType } from './mockData';\nimport Popover from './Popover';\n\nexport interface SelectionMenuProps {\n  target: NonNullable<PopoverProps['target']>;\n  constraint?: {\n    types?: ContentType[];\n    subTypes?: FieldType[];\n  };\n  onCancel: () => void;\n  onSubmit: (selected: NonNullable<MultiSelectInputProps['selected']>) => void;\n}\n\nconst StyledSelectionMenu: typeof Menu = styled(Menu)(({ theme }) => {\n  return css`\n    margin-inline: calc(-2 * ${theme.base.spacing});\n  `;\n});\n\nStyledSelectionMenu.defaultProps = defaultThemeProp;\n\nconst rootMenuItems: MenuItemProps[] = [\n  { id: 'fields', primary: 'Fields', items: [] },\n  { id: 'views', primary: 'Views', items: [] }\n];\n\nconst SelectionMenu = ({ target, constraint, onCancel: onClose, onSubmit }: SelectionMenuProps) => {\n  const t = useI18n();\n  const [loading, setLoading] = useState(false);\n  const [filterValue, setFilterValue] = useState('');\n  const [inputEl, setInputEl] = useElement<HTMLElement>(null);\n\n  const [menuItems, setMenuItems] = useState<MenuItemProps[]>(() => {\n    if (constraint?.types) {\n      const constrainedTypes = [];\n      if (constraint.types.includes('Field')) {\n        constrainedTypes.push(rootMenuItems[0]);\n      }\n      if (constraint.types.includes('View')) {\n        constrainedTypes.push(rootMenuItems[1]);\n      }\n\n      return constrainedTypes;\n    }\n\n    return rootMenuItems;\n  });\n\n  const [selected, setSelected] = useState<NonNullable<MultiSelectInputProps['selected']>>(\n    () => []\n  );\n\n  const onItemExpand = useCallback(\n    async (id: MenuItemProps['id']) => {\n      const expandedItem = menuHelpers.getItem(menuItems, id);\n      if (!expandedItem || (expandedItem.items && expandedItem.items.length > 0)) {\n        return;\n      }\n\n      setLoading(true);\n\n      const subItems = await mockQuery({\n        type: id === 'fields' ? 'Field' : 'View',\n        delay: 1000\n      });\n\n      const newMenuItems = menuHelpers.mapItem(menuItems, id, item => {\n        return {\n          ...item,\n          items: subItems.map(subItem => ({\n            id: subItem.id,\n            primary: subItem.label,\n            selected: !!selected.find(s => s.id === subItem.id)\n          }))\n        };\n      });\n\n      setMenuItems(newMenuItems as MenuItemProps[]);\n      setLoading(false);\n    },\n    [menuItems, selected]\n  );\n\n  const onFilter = useCallback(async (e: ChangeEvent<HTMLInputElement>) => {\n    const val = e.currentTarget.value;\n    setFilterValue(val);\n\n    if (val) {\n      setLoading(true);\n      setMenuItems([]);\n\n      const matchedItems = await mockQuery({\n        filter: val,\n        delay: 1000\n      });\n\n      setMenuItems(\n        matchedItems.map(matchedItem => {\n          return {\n            id: matchedItem.id,\n            primary: matchedItem.label,\n            secondary: [matchedItem.subType ?? matchedItem.type],\n            selected: !!selected.find(s => s.id === matchedItem.id)\n          };\n        })\n      );\n\n      setLoading(false);\n      return;\n    }\n\n    setMenuItems(rootMenuItems);\n  }, []);\n\n  const onItemClick = useCallback(\n    (id: MenuItemProps['id']) => {\n      setSelected(cur => {\n        if (cur.find(s => s.id === id)) {\n          return cur.filter(sel => sel.id !== id);\n        }\n\n        return [\n          ...cur,\n          { id, text: (menuHelpers.getItem(menuItems, id) as MenuItemProps).primary }\n        ];\n      });\n\n      setMenuItems(cur => menuHelpers.toggleSelected(cur, id) as MenuItemProps[]);\n    },\n    [menuItems]\n  );\n\n  return (\n    <Popover\n      target={target}\n      heading='Content selection'\n      onCancel={onClose}\n      onSubmit={() => {\n        onSubmit(selected);\n      }}\n    >\n      <Flex container={{ direction: 'column', gap: 2, pad: [1, 0] }}>\n        <MultiSelectInput\n          ref={setInputEl}\n          placeholder={t('search_placeholder_default')}\n          value={filterValue}\n          selected={selected}\n          onChange={onFilter}\n          onRemove={onItemClick}\n        />\n        <StyledSelectionMenu\n          focusControlEl={inputEl ?? undefined}\n          mode='multi-select'\n          items={menuItems}\n          scrollAt={10}\n          loading={loading}\n          onItemClick={onItemClick}\n          onItemExpand={onItemExpand}\n        />\n      </Flex>\n    </Popover>\n  );\n};\n\nexport default SelectionMenu;\n"]}

package/jsx/dnd/StandardDragDropList/StandardDragDropList.stories.d.ts

@@ -1,9 +0,0 @@
-import type { StoryFn } from '@storybook/react';
-import { type OmitStrict } from '@pega/cosmos-react-core';
-import { type StandardDragDropListDemoProps } from './Demo';
-declare const _default: import("@storybook/csf").ComponentAnnotations<import("@storybook/react/dist/types-a5624094").ReactRenderer, import("@storybook/csf").Args>;
-export default _default;
-interface StandardDragDropListStoryProps extends OmitStrict<StandardDragDropListDemoProps, 'items'> {
-}
-export declare const StandardDragDropListDemo: StoryFn<StandardDragDropListStoryProps>;
-//# sourceMappingURL=StandardDragDropList.stories.d.ts.map

package/jsx/dnd/StandardDragDropList/StandardDragDropList.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"StandardDragDropList.stories.d.ts","sourceRoot":"","sources":["../../../src/dnd/StandardDragDropList/StandardDragDropList.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAGtD,OAAO,EAAQ,KAAK,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAEhE,OAA6B,EAAE,KAAK,6BAA6B,EAAE,MAAM,QAAQ,CAAC;;AAGlF,wBAGU;AAEV,UAAU,8BACR,SAAQ,UAAU,CAAC,6BAA6B,EAAE,OAAO,CAAC;CAAG;AAE/D,eAAO,MAAM,wBAAwB,EAAE,OAAO,CAAC,8BAA8B,CAyB5E,CAAC"}

package/jsx/dnd/StandardDragDropList/StandardDragDropList.stories.jsx

@@ -1,31 +0,0 @@
-import { StandardDragDropList } from '@pega/cosmos-react-dnd';
-import { Flex } from '@pega/cosmos-react-core';
-import StandardListDemoComp, {} from './Demo';
-import { mockFields, mockViews, mockGroups } from './mockData';
-export default {
-    title: 'DnD/StandardDragDropList',
-    component: StandardDragDropList
-};
-export const StandardDragDropListDemo = (args) => {
-    return (<Flex container={{ direction: 'column', gap: 2 }}>
-      <StandardListDemoComp items={[...mockFields.slice(0, 3), ...mockViews.slice(0, 2), mockGroups[0]]} draggable={args.draggable} icons={args.icons} onConfigure={args.onConfigure} onRemove={args.onRemove} onAddTo={args.onAddTo} footer={args.footer}/>
-      <StandardListDemoComp items={[...mockFields.slice(3, 6), ...mockViews.slice(2, 4), mockGroups[1], mockGroups[2]]} draggable={args.draggable} icons={args.icons} onConfigure={args.onConfigure} onRemove={args.onRemove} onAddTo={args.onAddTo} footer={args.footer}/>
-    </Flex>);
-};
-StandardDragDropListDemo.args = {
-    draggable: true,
-    icons: true,
-    onConfigure: true,
-    onRemove: true,
-    onAddTo: true,
-    footer: true
-};
-StandardDragDropListDemo.argTypes = {
-    draggable: { control: { type: 'boolean' } },
-    icons: { control: { type: 'boolean' } },
-    onConfigure: { control: { type: 'boolean' } },
-    onRemove: { control: { type: 'boolean' } },
-    onAddTo: { control: { type: 'boolean' } },
-    footer: { control: { type: 'boolean' } }
-};
-//# sourceMappingURL=StandardDragDropList.stories.jsx.map

package/jsx/dnd/StandardDragDropList/StandardDragDropList.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"StandardDragDropList.stories.jsx","sourceRoot":"","sources":["../../../src/dnd/StandardDragDropList/StandardDragDropList.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,IAAI,EAAmB,MAAM,yBAAyB,CAAC;AAEhE,OAAO,oBAAoB,EAAE,EAAsC,MAAM,QAAQ,CAAC;AAClF,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAE/D,eAAe;IACb,KAAK,EAAE,0BAA0B;IACjC,SAAS,EAAE,oBAAoB;CACxB,CAAC;AAKV,MAAM,CAAC,MAAM,wBAAwB,GAA4C,CAC/E,IAAoC,EACpC,EAAE;IACF,OAAO,CACL,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC,CAC/C;MAAA,CAAC,oBAAoB,CACnB,KAAK,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAC5E,SAAS,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAC1B,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAClB,WAAW,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAC9B,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACxB,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CACtB,MAAM,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,EAEtB;MAAA,CAAC,oBAAoB,CACnB,KAAK,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAC3F,SAAS,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAC1B,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAClB,WAAW,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAC9B,QAAQ,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CACxB,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CACtB,MAAM,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,EAExB;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,wBAAwB,CAAC,IAAI,GAAG;IAC9B,SAAS,EAAE,IAAI;IACf,KAAK,EAAE,IAAI;IACX,WAAW,EAAE,IAAI;IACjB,QAAQ,EAAE,IAAI;IACd,OAAO,EAAE,IAAI;IACb,MAAM,EAAE,IAAI;CACb,CAAC;AAEF,wBAAwB,CAAC,QAAQ,GAAG;IAClC,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC3C,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IACvC,WAAW,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC7C,QAAQ,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC1C,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IACzC,MAAM,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;CACzC,CAAC","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\n\nimport { StandardDragDropList } from '@pega/cosmos-react-dnd';\nimport { Flex, type OmitStrict } from '@pega/cosmos-react-core';\n\nimport StandardListDemoComp, { type StandardDragDropListDemoProps } from './Demo';\nimport { mockFields, mockViews, mockGroups } from './mockData';\n\nexport default {\n  title: 'DnD/StandardDragDropList',\n  component: StandardDragDropList\n} as Meta;\n\ninterface StandardDragDropListStoryProps\n  extends OmitStrict<StandardDragDropListDemoProps, 'items'> {}\n\nexport const StandardDragDropListDemo: StoryFn<StandardDragDropListStoryProps> = (\n  args: StandardDragDropListStoryProps\n) => {\n  return (\n    <Flex container={{ direction: 'column', gap: 2 }}>\n      <StandardListDemoComp\n        items={[...mockFields.slice(0, 3), ...mockViews.slice(0, 2), mockGroups[0]]}\n        draggable={args.draggable}\n        icons={args.icons}\n        onConfigure={args.onConfigure}\n        onRemove={args.onRemove}\n        onAddTo={args.onAddTo}\n        footer={args.footer}\n      />\n      <StandardListDemoComp\n        items={[...mockFields.slice(3, 6), ...mockViews.slice(2, 4), mockGroups[1], mockGroups[2]]}\n        draggable={args.draggable}\n        icons={args.icons}\n        onConfigure={args.onConfigure}\n        onRemove={args.onRemove}\n        onAddTo={args.onAddTo}\n        footer={args.footer}\n      />\n    </Flex>\n  );\n};\n\nStandardDragDropListDemo.args = {\n  draggable: true,\n  icons: true,\n  onConfigure: true,\n  onRemove: true,\n  onAddTo: true,\n  footer: true\n};\n\nStandardDragDropListDemo.argTypes = {\n  draggable: { control: { type: 'boolean' } },\n  icons: { control: { type: 'boolean' } },\n  onConfigure: { control: { type: 'boolean' } },\n  onRemove: { control: { type: 'boolean' } },\n  onAddTo: { control: { type: 'boolean' } },\n  footer: { control: { type: 'boolean' } }\n};\n"]}

package/jsx/dnd/StandardDragDropList/mockData.d.ts

@@ -1,25 +0,0 @@
-import { type IconProps } from '@pega/cosmos-react-core';
-import { type FieldType } from '@pega/cosmos-react-build';
-export type ContentType = 'Field' | 'View' | 'Group';
-export interface MockRawItem {
-    id: string;
-    label: string;
-    type: ContentType;
-    subType?: FieldType;
-    icon?: IconProps;
-    items?: MockRawItem[];
-}
-export interface MockQueryParams {
-    id?: MockRawItem['id'] | MockRawItem['id'][];
-    filter?: string;
-    type?: ContentType;
-    subType?: FieldType;
-    limit?: number;
-    offset?: number;
-    delay?: number;
-}
-export declare const mockFields: MockRawItem[];
-export declare const mockViews: MockRawItem[];
-export declare const mockGroups: MockRawItem[];
-export declare const mockQuery: ({ id, filter, type, subType, limit, offset, delay }?: MockQueryParams) => Promise<MockRawItem[]>;
-//# sourceMappingURL=mockData.d.ts.map

package/jsx/dnd/StandardDragDropList/mockData.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"mockData.d.ts","sourceRoot":"","sources":["../../../src/dnd/StandardDragDropList/mockData.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpE,OAAO,EAAmB,KAAK,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAE3E,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;AAGrD,MAAM,WAAW,WAAW;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,WAAW,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,WAAW,EAAE,CAAC;CACvB;AAGD,MAAM,WAAW,eAAe;IAC9B,EAAE,CAAC,EAAE,WAAW,CAAC,IAAI,CAAC,GAAG,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC;IAC7C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAQD,eAAO,MAAM,UAAU,EAAE,WAAW,EAWlC,CAAC;AAEH,eAAO,MAAM,SAAS,EAAE,WAAW,EAOjC,CAAC;AAEH,eAAO,MAAM,UAAU,EAAE,WAAW,EAQlC,CAAC;AAGH,eAAO,MAAM,SAAS,yDAQnB,eAAe,KAAQ,QAAQ,WAAW,EAAE,CAiC9C,CAAC"}

package/jsx/dnd/StandardDragDropList/mockData.js

@@ -1,67 +0,0 @@
-import { createUID } from '@pega/cosmos-react-core';
-import { typeIconMapping } from '@pega/cosmos-react-build';
-const getRandomInt = (min, max) => {
-    min = Math.ceil(min);
-    max = Math.floor(max);
-    return Math.floor(Math.random() * (max - min + 1)) + min;
-};
-export const mockFields = Array.from({ length: 500 }, (_, i) => {
-    const types = Object.keys(typeIconMapping);
-    const subType = types[getRandomInt(0, types.length - 1)];
-    return {
-        id: createUID(),
-        label: `Field-${i + 1}`,
-        type: 'Field',
-        icon: typeIconMapping[subType],
-        subType
-    };
-});
-export const mockViews = Array.from({ length: 50 }, (_, i) => {
-    return {
-        id: createUID(),
-        label: `View-${i + 1}`,
-        icon: { set: 'streamline', name: 'newspaper' },
-        type: 'View'
-    };
-});
-export const mockGroups = Array.from({ length: 3 }, (_, i) => {
-    return {
-        id: createUID(),
-        label: `Group-${i + 1}`,
-        icon: { set: 'streamline', name: 'box-4' },
-        type: 'Group',
-        items: i === 0 ? mockFields.slice(-3) : mockFields.slice((i + 1) * -3, i * -3)
-    };
-});
-export const mockQuery = ({ id, filter, type, subType, limit = 100, offset = 0, delay = 0 } = {}) => {
-    return new Promise(resolve => {
-        setTimeout(() => {
-            let contentItems = [];
-            if (id) {
-                resolve([...mockFields, ...mockViews, ...mockGroups].filter(item => {
-                    return Array.isArray(id) ? id.includes(item.id) : item.id === id;
-                }));
-                return;
-            }
-            if (type) {
-                if (type === 'Field') {
-                    contentItems = subType ? mockFields.filter(f => f.subType === subType) : mockFields;
-                }
-                else if (type === 'View') {
-                    contentItems = mockViews;
-                }
-                else if (type === 'Group') {
-                    contentItems = mockGroups;
-                }
-            }
-            else {
-                contentItems = [...mockFields, ...mockViews, ...mockGroups];
-            }
-            if (filter) {
-                contentItems = contentItems.filter(item => item.label.includes(filter));
-            }
-            resolve(contentItems.slice(offset, limit));
-        }, delay);
-    });
-};
-//# sourceMappingURL=mockData.js.map

package/jsx/dnd/StandardDragDropList/mockData.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"mockData.js","sourceRoot":"","sources":["../../../src/dnd/StandardDragDropList/mockData.ts"],"names":[],"mappings":"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","sourcesContent":["import { createUID, type IconProps } from '@pega/cosmos-react-core';\nimport { typeIconMapping, type FieldType } from '@pega/cosmos-react-build';\n\nexport type ContentType = 'Field' | 'View' | 'Group';\n\n// A simple mock of an object type before it is transformed to a ContentItem\nexport interface MockRawItem {\n  id: string;\n  label: string;\n  type: ContentType;\n  subType?: FieldType;\n  icon?: IconProps;\n  items?: MockRawItem[];\n}\n\n// Used as the arg type to the simulated query function.\nexport interface MockQueryParams {\n  id?: MockRawItem['id'] | MockRawItem['id'][];\n  filter?: string;\n  type?: ContentType;\n  subType?: FieldType;\n  limit?: number;\n  offset?: number;\n  delay?: number;\n}\n\nconst getRandomInt = (min: number, max: number) => {\n  min = Math.ceil(min);\n  max = Math.floor(max);\n  return Math.floor(Math.random() * (max - min + 1)) + min;\n};\n\nexport const mockFields: MockRawItem[] = Array.from({ length: 500 }, (_, i) => {\n  const types = Object.keys(typeIconMapping) as (keyof typeof typeIconMapping)[];\n  const subType = types[getRandomInt(0, types.length - 1)];\n\n  return {\n    id: createUID(),\n    label: `Field-${i + 1}`,\n    type: 'Field',\n    icon: typeIconMapping[subType],\n    subType\n  };\n});\n\nexport const mockViews: MockRawItem[] = Array.from({ length: 50 }, (_, i) => {\n  return {\n    id: createUID(),\n    label: `View-${i + 1}`,\n    icon: { set: 'streamline', name: 'newspaper' },\n    type: 'View'\n  };\n});\n\nexport const mockGroups: MockRawItem[] = Array.from({ length: 3 }, (_, i) => {\n  return {\n    id: createUID(),\n    label: `Group-${i + 1}`,\n    icon: { set: 'streamline', name: 'box-4' },\n    type: 'Group',\n    items: i === 0 ? mockFields.slice(-3) : mockFields.slice((i + 1) * -3, i * -3)\n  };\n});\n\n// Simulated query functionality to assist with loading states and fetching specifc content item types.\nexport const mockQuery = ({\n  id,\n  filter,\n  type,\n  subType,\n  limit = 100,\n  offset = 0,\n  delay = 0\n}: MockQueryParams = {}): Promise<MockRawItem[]> => {\n  return new Promise(resolve => {\n    setTimeout(() => {\n      let contentItems: MockRawItem[] = [];\n\n      if (id) {\n        resolve(\n          [...mockFields, ...mockViews, ...mockGroups].filter(item => {\n            return Array.isArray(id) ? id.includes(item.id) : item.id === id;\n          })\n        );\n        return;\n      }\n\n      if (type) {\n        if (type === 'Field') {\n          contentItems = subType ? mockFields.filter(f => f.subType === subType) : mockFields;\n        } else if (type === 'View') {\n          contentItems = mockViews;\n        } else if (type === 'Group') {\n          contentItems = mockGroups;\n        }\n      } else {\n        contentItems = [...mockFields, ...mockViews, ...mockGroups];\n      }\n\n      if (filter) {\n        contentItems = contentItems.filter(item => item.label.includes(filter));\n      }\n\n      resolve(contentItems.slice(offset, limit));\n    }, delay);\n  });\n};\n"]}

package/jsx/rte/DynamicContentEditor/DynamicContentEditor.stories.d.ts

@@ -1,8 +0,0 @@
-import type { StoryFn } from '@storybook/react';
-import type { DynamicContentEditorProps } from '@pega/cosmos-react-rte';
-declare const _default: import("@storybook/csf").ComponentAnnotations<import("@storybook/react/dist/types-a5624094").ReactRenderer, import("@storybook/csf").Args>;
-export default _default;
-export interface DynamicContentEditorStoryProps extends DynamicContentEditorProps {
-}
-export declare const DynamicContentEditorDemo: StoryFn<Partial<DynamicContentEditorStoryProps>>;
-//# sourceMappingURL=DynamicContentEditor.stories.d.ts.map

package/jsx/rte/DynamicContentEditor/DynamicContentEditor.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DynamicContentEditor.stories.d.ts","sourceRoot":"","sources":["../../../src/rte/DynamicContentEditor/DynamicContentEditor.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAgBtD,OAAO,KAAK,EAAE,yBAAyB,EAAyB,MAAM,wBAAwB,CAAC;;AAK/F,wBAGU;AAEV,MAAM,WAAW,8BAA+B,SAAQ,yBAAyB;CAAG;AAEpF,eAAO,MAAM,wBAAwB,EAAE,OAAO,CAAC,OAAO,CAAC,8BAA8B,CAAC,CAoIrF,CAAC"}

package/jsx/rte/DynamicContentEditor/DynamicContentEditor.stories.jsx

@@ -1,103 +0,0 @@
-import { useRef, useState, useCallback } from 'react';
-import { action } from '@storybook/addon-actions';
-import { Button, Card, CardContent, CardFooter, Flex, TextArea, useAutoResize, useConsolidatedRef, useI18n } from '@pega/cosmos-react-core';
-import { DynamicContentEditor } from '@pega/cosmos-react-rte';
-import FieldSelector from './FieldSelector';
-export default {
-    title: 'RTE/DynamicContentEditor',
-    component: DynamicContentEditor
-};
-export const DynamicContentEditorDemo = (args) => {
-    const [html, setHtml] = useState('<p>Hi <pega-reference role="button" contenteditable="false" data-rule-type="field" data-rule-id="CustomerName" data-rule-namespace="XCompass">CustomerName</pega-reference><p>please check this <a href="https://google.com">link</a></p></p>');
-    const rteRef = useRef(null);
-    const fieldItems = [
-        {
-            id: 'CustomerName',
-            primary: 'CustomerName',
-            namespace: 'XCompass',
-            items: [
-                {
-                    id: 'Locale',
-                    primary: 'Locale',
-                    namespace: 'XCompass'
-                },
-                {
-                    id: 'Response Type',
-                    primary: 'Response Type',
-                    items: [
-                        {
-                            id: 'B',
-                            label: 'B',
-                            items: [{ id: 'Reply to', primary: 'Reply to' }]
-                        },
-                        { id: 'Forward to', primary: 'Forward to' }
-                    ]
-                }
-            ]
-        },
-        { id: 'Address', primary: 'Address', namespace: 'PegaPlatform' },
-        { id: 'Locality', primary: 'Locality', namespace: 'PegaPlatform' },
-        { id: 'Country', primary: 'Country', namespace: 'XCompass' },
-        { id: 'Region', primary: 'Region', namespace: 'PegaPlatform' },
-        { id: 'Occupation', primary: 'Occupation', namespace: 'PegaPlatform' },
-        { id: 'City', primary: 'City' },
-        { id: 'Colony', primary: 'Colony' },
-        { id: 'Lastname', primary: 'Lastname' },
-        { id: 'Preference', primary: 'Preference' },
-        { id: 'Currency', primary: 'Currency' },
-        { id: 'Iconname', primary: 'Iconname' }
-    ];
-    const onImageAdded = (image, id) => {
-        const src = URL.createObjectURL(image);
-        rteRef.current?.appendImage({ src, alt: image.name }, id);
-    };
-    const [textAreaRef, resizeTextArea] = useAutoResize(undefined, 100);
-    const ref = useRef(null);
-    const consolidatedRef = useConsolidatedRef(textAreaRef, ref);
-    const handleShowHtml = () => {
-        resizeTextArea();
-        setHtml(rteRef.current?.getHtml() || '');
-    };
-    const t = useI18n();
-    const [selectedField, setSelectedField] = useState({
-        id: '',
-        text: ''
-    });
-    const updateSelection = (selectedItem) => {
-        setSelectedField(selectedItem);
-    };
-    const onSubmit = useCallback((insertField) => {
-        insertField(selectedField);
-    }, [selectedField]);
-    const dynamicContentPicker = (<Flex container={{
-            gap: 2,
-            direction: 'column'
-        }}>
-      <FieldSelector itemList={[
-            { id: 'CustomerName', text: 'CustomerName', namespace: 'XCompass' },
-            { id: 'Address', text: 'Address', namespace: 'PegaPlatform' },
-            { id: 'Locality', text: 'Locality', namespace: 'PegaPlatform' },
-            { id: 'Country', text: 'Country', namespace: 'XCompass' },
-            { id: 'Region', text: 'Region', namespace: 'PegaPlatform' },
-            { id: 'Occupation', text: 'Occupation', namespace: 'PegaPlatform' }
-        ]} key={selectedField?.id} label='Field' updateSelection={updateSelection} placeholder={t('select')} defaultSelection={selectedField}/>
-    </Flex>);
-    const onActiveFieldChange = (field) => setSelectedField(field);
-    return (<Flex container={{ direction: 'column', gap: 2 }}>
-      <Card>
-        <CardContent>
-          <TextArea value={html} onChange={e => setHtml(e.target.value)} autoResize ref={consolidatedRef}/>
-        </CardContent>
-        <CardFooter>
-          <Button onClick={() => rteRef.current?.insertHtml(html.trim(), true)}>
-            Overwrite RTE with new HTML
-          </Button>
-        </CardFooter>
-      </Card>
-      <DynamicContentEditor defaultValue={args.defaultValue || html} onImageAdded={onImageAdded} ref={rteRef} label='Dynamic content editor' toolbar={['inline-styling', 'lists', 'indentation', 'links', 'images']} form={args.form || { onSubmit, dynamicContentPicker }} onActiveFieldChange={args.onActiveFieldChange || onActiveFieldChange} fieldItems={args.fieldItems || fieldItems} onBlur={action('Editor onBlur')}/>
-      <Flex container={{ gap: 1 }}>
-        <Button onClick={() => handleShowHtml()}>Show HTML</Button>
-      </Flex>
-    </Flex>);
-};
-//# sourceMappingURL=DynamicContentEditor.stories.jsx.map

package/jsx/rte/DynamicContentEditor/DynamicContentEditor.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"DynamicContentEditor.stories.jsx","sourceRoot":"","sources":["../../../src/rte/DynamicContentEditor/DynamicContentEditor.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useRef, useState, useCallback } from 'react';\nimport { action } from '@storybook/addon-actions';\n\nimport {\n  Button,\n  Card,\n  CardContent,\n  CardFooter,\n  Flex,\n  TextArea,\n  useAutoResize,\n  useConsolidatedRef,\n  useI18n\n} from '@pega/cosmos-react-core';\nimport { DynamicContentEditor } from '@pega/cosmos-react-rte';\nimport type { DynamicContentEditorProps, EditorState, ItemType } from '@pega/cosmos-react-rte';\n\nimport FieldSelector from './FieldSelector';\nimport type { FieldSelectorProps } from './FieldSelector';\n\nexport default {\n  title: 'RTE/DynamicContentEditor',\n  component: DynamicContentEditor\n} as Meta;\n\nexport interface DynamicContentEditorStoryProps extends DynamicContentEditorProps {}\n\nexport const DynamicContentEditorDemo: StoryFn<Partial<DynamicContentEditorStoryProps>> = (\n  args: Partial<DynamicContentEditorStoryProps>\n) => {\n  const [html, setHtml] = useState(\n    '<p>Hi <pega-reference role=\"button\" contenteditable=\"false\" data-rule-type=\"field\" data-rule-id=\"CustomerName\" data-rule-namespace=\"XCompass\">CustomerName</pega-reference><p>please check this <a href=\"https://google.com\">link</a></p></p>'\n  );\n  const rteRef = useRef<EditorState>(null);\n\n  const fieldItems: DynamicContentEditorProps['fieldItems'] = [\n    {\n      id: 'CustomerName',\n      primary: 'CustomerName',\n      namespace: 'XCompass',\n      items: [\n        {\n          id: 'Locale',\n          primary: 'Locale',\n          namespace: 'XCompass'\n        },\n        {\n          id: 'Response Type',\n          primary: 'Response Type',\n          items: [\n            {\n              id: 'B',\n              label: 'B',\n              items: [{ id: 'Reply to', primary: 'Reply to' }]\n            },\n            { id: 'Forward to', primary: 'Forward to' }\n          ]\n        }\n      ]\n    },\n    { id: 'Address', primary: 'Address', namespace: 'PegaPlatform' },\n    { id: 'Locality', primary: 'Locality', namespace: 'PegaPlatform' },\n    { id: 'Country', primary: 'Country', namespace: 'XCompass' },\n    { id: 'Region', primary: 'Region', namespace: 'PegaPlatform' },\n    { id: 'Occupation', primary: 'Occupation', namespace: 'PegaPlatform' },\n    { id: 'City', primary: 'City' },\n    { id: 'Colony', primary: 'Colony' },\n    { id: 'Lastname', primary: 'Lastname' },\n    { id: 'Preference', primary: 'Preference' },\n    { id: 'Currency', primary: 'Currency' },\n    { id: 'Iconname', primary: 'Iconname' }\n  ];\n\n  const onImageAdded = (image: File, id: string) => {\n    const src = URL.createObjectURL(image);\n    rteRef.current?.appendImage({ src, alt: image.name }, id);\n  };\n  const [textAreaRef, resizeTextArea] = useAutoResize<HTMLTextAreaElement>(undefined, 100);\n  const ref = useRef(null);\n  const consolidatedRef = useConsolidatedRef(textAreaRef, ref);\n  const handleShowHtml = () => {\n    resizeTextArea();\n    setHtml(rteRef.current?.getHtml() || '');\n  };\n  const t = useI18n();\n  const [selectedField, setSelectedField] = useState<ItemType>({\n    id: '',\n    text: ''\n  });\n\n  const updateSelection: FieldSelectorProps['updateSelection'] = (selectedItem: ItemType) => {\n    setSelectedField(selectedItem);\n  };\n  const onSubmit = useCallback(\n    (insertField: (selectedField: ItemType) => void) => {\n      insertField(selectedField);\n    },\n    [selectedField]\n  );\n\n  const dynamicContentPicker = (\n    <Flex\n      container={{\n        gap: 2,\n        direction: 'column'\n      }}\n    >\n      <FieldSelector\n        itemList={[\n          { id: 'CustomerName', text: 'CustomerName', namespace: 'XCompass' },\n          { id: 'Address', text: 'Address', namespace: 'PegaPlatform' },\n          { id: 'Locality', text: 'Locality', namespace: 'PegaPlatform' },\n          { id: 'Country', text: 'Country', namespace: 'XCompass' },\n          { id: 'Region', text: 'Region', namespace: 'PegaPlatform' },\n          { id: 'Occupation', text: 'Occupation', namespace: 'PegaPlatform' }\n        ]}\n        key={selectedField?.id}\n        label='Field'\n        updateSelection={updateSelection}\n        placeholder={t('select')}\n        defaultSelection={selectedField}\n      />\n    </Flex>\n  );\n  const onActiveFieldChange = (field: ItemType) => setSelectedField(field);\n\n  return (\n    <Flex container={{ direction: 'column', gap: 2 }}>\n      <Card>\n        <CardContent>\n          <TextArea\n            value={html}\n            onChange={e => setHtml(e.target.value)}\n            autoResize\n            ref={consolidatedRef}\n          />\n        </CardContent>\n        <CardFooter>\n          <Button onClick={() => rteRef.current?.insertHtml(html.trim(), true)}>\n            Overwrite RTE with new HTML\n          </Button>\n        </CardFooter>\n      </Card>\n      <DynamicContentEditor\n        defaultValue={args.defaultValue || html}\n        onImageAdded={onImageAdded}\n        ref={rteRef}\n        label='Dynamic content editor'\n        toolbar={['inline-styling', 'lists', 'indentation', 'links', 'images']}\n        form={args.form || { onSubmit, dynamicContentPicker }}\n        onActiveFieldChange={args.onActiveFieldChange || onActiveFieldChange}\n        fieldItems={args.fieldItems || fieldItems}\n        onBlur={action('Editor onBlur')}\n      />\n      <Flex container={{ gap: 1 }}>\n        <Button onClick={() => handleShowHtml()}>Show HTML</Button>\n      </Flex>\n    </Flex>\n  );\n};\n"]}

package/jsx/rte/DynamicContentEditor/FieldSelector.d.ts

@@ -1,11 +0,0 @@
-import type { FunctionComponent } from 'react';
-import type { ComboBoxProps, NoChildrenProp } from '@pega/cosmos-react-core';
-import type { ItemType } from '@pega/cosmos-react-rte/lib/components/DynamicContentEditor/DynamicContentEditor.types';
-export interface FieldSelectorProps extends NoChildrenProp {
-    itemList: ItemType[];
-    updateSelection: (selectedItem: ItemType, label: ComboBoxProps['label']) => void;
-    defaultSelection?: ItemType;
-}
-declare const FieldSelector: FunctionComponent<FieldSelectorProps & Pick<ComboBoxProps, 'label' | 'mode' | 'required' | 'placeholder'>>;
-export default FieldSelector;
-//# sourceMappingURL=FieldSelector.d.ts.map

package/jsx/rte/DynamicContentEditor/FieldSelector.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FieldSelector.d.ts","sourceRoot":"","sources":["../../../src/rte/DynamicContentEditor/FieldSelector.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAe,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG5D,OAAO,KAAK,EAAE,aAAa,EAAiB,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAC5F,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uFAAuF,CAAC;AAEtH,MAAM,WAAW,kBAAmB,SAAQ,cAAc;IAExD,QAAQ,EAAE,QAAQ,EAAE,CAAC;IAErB,eAAe,EAAE,CAAC,YAAY,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IAEjF,gBAAgB,CAAC,EAAE,QAAQ,CAAC;CAC7B;AAED,QAAA,MAAM,aAAa,EAAE,iBAAiB,CACpC,kBAAkB,GAAG,IAAI,CAAC,aAAa,EAAE,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,aAAa,CAAC,CAmGxF,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/jsx/rte/DynamicContentEditor/FieldSelector.jsx

@@ -1,82 +0,0 @@
-import { useMemo, useState, useCallback } from 'react';
-import { ComboBox, createStringMatcher, useI18n } from '@pega/cosmos-react-core';
-const FieldSelector = ({ itemList, label, mode = 'single-select', required = false, updateSelection, placeholder, defaultSelection }) => {
-    const t = useI18n();
-    const [filterValue, setFilterValue] = useState('');
-    const [items, setItems] = useState(() => {
-        return itemList.map(item => {
-            return {
-                id: item.id,
-                primary: item.text,
-                namespace: item.namespace ?? '',
-                selected: defaultSelection ? defaultSelection.id === item.id : false
-            };
-        });
-    });
-    const filterRegex = createStringMatcher(filterValue, 'contains');
-    const itemsToRender = useMemo(() => {
-        return filterRegex ? items.filter(({ primary }) => filterRegex.test(primary)) : items;
-    }, [filterValue, items]);
-    const clearSelection = () => {
-        setItems(curr => {
-            return curr?.map(item => {
-                return {
-                    ...item,
-                    selected: false
-                };
-            });
-        });
-    };
-    const selectItem = useCallback((id) => {
-        setFilterValue('');
-        setItems(curr => curr?.map(item => {
-            if (item.id === id) {
-                return {
-                    ...item,
-                    selected: true
-                };
-            }
-            return { ...item, selected: false };
-        }));
-        const selectedItem = items?.find(item => item.id === id);
-        if (selectedItem?.id)
-            updateSelection({
-                id: selectedItem.id,
-                text: selectedItem.primary,
-                namespace: selectedItem.namespace
-            }, label);
-    }, [filterValue, items]);
-    const selected = useMemo(() => {
-        return items?.find(item => item.selected);
-    }, [items]);
-    const comboBoxProps = {
-        label,
-        placeholder,
-        mode,
-        value: filterValue,
-        selected: selected
-            ? {
-                items: {
-                    id: selected.id,
-                    text: selected.primary
-                }
-            }
-            : undefined,
-        onChange: (e) => {
-            if (e.target.value)
-                clearSelection();
-            setFilterValue(e.target.value);
-        },
-        onBlur: () => setFilterValue(''),
-        menu: {
-            items: itemsToRender,
-            accent: filterRegex,
-            onItemClick: selectItem,
-            emptyText: t('no_items')
-        },
-        required
-    };
-    return <ComboBox {...comboBoxProps}/>;
-};
-export default FieldSelector;
-//# sourceMappingURL=FieldSelector.jsx.map

package/jsx/rte/DynamicContentEditor/FieldSelector.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"FieldSelector.jsx","sourceRoot":"","sources":["../../../src/rte/DynamicContentEditor/FieldSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, useState, useCallback } from 'react';\nimport type { ChangeEvent, FunctionComponent } from 'react';\n\nimport { ComboBox, createStringMatcher, useI18n } from '@pega/cosmos-react-core';\nimport type { ComboBoxProps, MenuItemProps, NoChildrenProp } from '@pega/cosmos-react-core';\nimport type { ItemType } from '@pega/cosmos-react-rte/lib/components/DynamicContentEditor/DynamicContentEditor.types';\n\nexport interface FieldSelectorProps extends NoChildrenProp {\n  /** Array of values for the combobox options. */\n  itemList: ItemType[];\n  /** Return selected item */\n  updateSelection: (selectedItem: ItemType, label: ComboBoxProps['label']) => void;\n  /** Default selected item */\n  defaultSelection?: ItemType;\n}\n\nconst FieldSelector: FunctionComponent<\n  FieldSelectorProps & Pick<ComboBoxProps, 'label' | 'mode' | 'required' | 'placeholder'>\n> = ({\n  itemList,\n  label,\n  mode = 'single-select',\n  required = false,\n  updateSelection,\n  placeholder,\n  defaultSelection\n}) => {\n  const t = useI18n();\n\n  const [filterValue, setFilterValue] = useState('');\n  const [items, setItems] = useState(() => {\n    return itemList.map(item => {\n      return {\n        id: item.id,\n        primary: item.text,\n        namespace: item.namespace ?? '',\n        selected: defaultSelection ? defaultSelection.id === item.id : false\n      };\n    });\n  });\n\n  const filterRegex = createStringMatcher(filterValue, 'contains');\n  const itemsToRender = useMemo(() => {\n    return filterRegex ? items.filter(({ primary }) => filterRegex.test(primary)) : items;\n  }, [filterValue, items]);\n\n  const clearSelection = () => {\n    setItems(curr => {\n      return curr?.map(item => {\n        return {\n          ...item,\n          selected: false\n        };\n      });\n    });\n  };\n\n  const selectItem = useCallback(\n    (id: MenuItemProps['id']) => {\n      setFilterValue('');\n      setItems(curr =>\n        curr?.map(item => {\n          if (item.id === id) {\n            return {\n              ...item,\n              selected: true\n            };\n          }\n          return { ...item, selected: false };\n        })\n      );\n      const selectedItem = items?.find(item => item.id === id);\n      if (selectedItem?.id)\n        updateSelection(\n          {\n            id: selectedItem.id,\n            text: selectedItem.primary,\n            namespace: selectedItem.namespace\n          },\n          label\n        );\n    },\n    [filterValue, items]\n  );\n\n  const selected = useMemo(() => {\n    return items?.find(item => item.selected);\n  }, [items]);\n\n  const comboBoxProps: ComboBoxProps = {\n    label,\n    placeholder,\n    mode,\n    value: filterValue,\n    selected: selected\n      ? {\n          items: {\n            id: selected.id,\n            text: selected.primary\n          }\n        }\n      : undefined,\n    onChange: (e: ChangeEvent<HTMLInputElement>) => {\n      if (e.target.value) clearSelection();\n      setFilterValue(e.target.value);\n    },\n    onBlur: () => setFilterValue(''),\n    menu: {\n      items: itemsToRender,\n      accent: filterRegex,\n      onItemClick: selectItem,\n      emptyText: t('no_items')\n    },\n    required\n  };\n  return <ComboBox {...comboBoxProps} />;\n};\n\nexport default FieldSelector;\n"]}