@pega/cosmos-react-demos 6.6.0 → 6.6.1

package/jsx/core/Dialog/FormDialog.mocks.d.ts

@@ -1,27 +0,0 @@
-/// <reference types="react" />
-import type { FormDialogProps } from '@pega/cosmos-react-core';
-export type MockCategory = `Category ${number}`;
-export interface MockItem {
-    readonly id: string;
-    name: string;
-    category: MockCategory;
-}
-export type MockReducerPayload = {
-    type: 'add';
-    item: Pick<MockItem, 'name' | 'category'>;
-} | {
-    type: 'edit';
-    item: MockItem;
-} | {
-    type: 'remove';
-    item: Pick<MockItem, 'id'>;
-};
-export interface MockItemDialogProps extends Pick<FormDialogProps, 'target'> {
-    item: MockItem | null;
-    dispatch: (fieldValues: Pick<MockItem, 'name' | 'category'>) => void;
-    onComplete: () => void;
-}
-export declare const useMockItems: () => [MockItem[], import("react").Dispatch<MockReducerPayload>];
-export declare const ItemDialog: ({ target, item: itemProp, dispatch, onComplete }: MockItemDialogProps) => import("react").JSX.Element;
-export declare const FormDialogMock: () => import("react").JSX.Element;
-//# sourceMappingURL=FormDialog.mocks.d.ts.map

package/jsx/core/Dialog/FormDialog.mocks.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormDialog.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Dialog/FormDialog.mocks.tsx"],"names":[],"mappings":";AAYA,OAAO,KAAK,EAAE,eAAe,EAAmB,MAAM,yBAAyB,CAAC;AAIhF,MAAM,MAAM,YAAY,GAAG,YAAY,MAAM,EAAE,CAAC;AAEhD,MAAM,WAAW,QAAQ;IACvB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,YAAY,CAAC;CACxB;AAED,MAAM,MAAM,kBAAkB,GAC1B;IACE,IAAI,EAAE,KAAK,CAAC;IACZ,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,UAAU,CAAC,CAAC;CAC3C,GACD;IACE,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,QAAQ,CAAC;CAChB,GACD;IACE,IAAI,EAAE,QAAQ,CAAC;IACf,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC;CAC5B,CAAC;AAEN,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,eAAe,EAAE,QAAQ,CAAC;IAC1E,IAAI,EAAE,QAAQ,GAAG,IAAI,CAAC;IACtB,QAAQ,EAAE,CAAC,WAAW,EAAE,IAAI,CAAC,QAAQ,EAAE,MAAM,GAAG,UAAU,CAAC,KAAK,IAAI,CAAC;IACrE,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AA8CD,eAAO,MAAM,YAAY,kEAExB,CAAC;AAEF,eAAO,MAAM,UAAU,qDAKpB,mBAAmB,gCAuIrB,CAAC;AAEF,eAAO,MAAM,cAAc,mCA0E1B,CAAC"}

package/jsx/core/Dialog/FormDialog.mocks.jsx

@@ -1,194 +0,0 @@
-import { useEffect, useReducer, useState } from 'react';
-import { ComboBox, createUID, Flex, FormDialog, Input, SummaryList, Text } from '@pega/cosmos-react-core';
-import { loadingTimeoutMS } from '../Progress/Progress.mocks';
-const errorText = 'Cannot be blank';
-const categories = Array.from({ length: 5 }, (_, i) => `Category ${i + 1}`);
-const initialItems = Array.from({ length: 3 }, (_, i) => {
-    return {
-        id: createUID(),
-        name: `Editable item ${i + 1}`,
-        category: categories[i]
-    };
-});
-const itemReducer = (items, payload) => {
-    switch (payload.type) {
-        case 'add': {
-            return [...items, { ...payload.item, id: createUID() }];
-        }
-        case 'edit': {
-            return items.map(item => {
-                return item.id === payload.item.id
-                    ? { ...item, name: payload.item.name, category: payload.item.category }
-                    : item;
-            });
-        }
-        case 'remove': {
-            const itemIndex = items.findIndex(item => item.id === payload.item.id);
-            if (itemIndex === -1)
-                return items;
-            items.splice(itemIndex, 1);
-            return [...items];
-        }
-        default: {
-            return items;
-        }
-    }
-};
-const progressStates = {
-    loading: 'Loading...',
-    submitting: 'Submitting...'
-};
-export const useMockItems = () => {
-    return useReducer(itemReducer, undefined, () => initialItems);
-};
-export const ItemDialog = ({ target, item: itemProp, dispatch, onComplete }) => {
-    const [nameField, setNameField] = useState(() => {
-        return {
-            value: itemProp?.name ?? null,
-            error: null,
-            errorOnPriorBlur: false
-        };
-    });
-    const [categoryField, setCategoryField] = useState(() => {
-        return {
-            value: itemProp?.category ?? null,
-            error: null
-        };
-    });
-    const [progress, setProgress] = useState(progressStates.loading);
-    useEffect(() => {
-        let timerId;
-        if (progress === progressStates.loading) {
-            timerId = window.setTimeout(() => {
-                setProgress(false);
-            }, loadingTimeoutMS);
-        }
-        else if (progress === progressStates.submitting) {
-            timerId = window.setTimeout(() => {
-                setProgress(false);
-                dispatch({ name: nameField.value, category: categoryField.value });
-                onComplete();
-            }, loadingTimeoutMS);
-        }
-        return () => {
-            window.clearTimeout(timerId);
-        };
-    }, [progress]);
-    return (<FormDialog target={target} heading={`${itemProp ? 'Edit' : 'Add'} item`} progress={progress} onCancel={{
-            disabled: progress === progressStates.submitting,
-            handler: () => {
-                setProgress(false);
-                onComplete();
-            }
-        }} onSubmit={{
-            disabled: !!progress || [nameField, categoryField].some(field => !field.value || field.error),
-            handler: () => {
-                setProgress(progressStates.submitting);
-            }
-        }}>
-      {(!progress || progress !== progressStates.loading) && (<Flex container={{ direction: 'column', gap: 2 }}>
-          <Input required label='Name' value={nameField.value ?? ''} onChange={(e) => {
-                setNameField(cur => ({
-                    ...cur,
-                    value: e.target.value,
-                    error: !e.target.value && cur.errorOnPriorBlur ? errorText : null
-                }));
-            }} onBlur={(e) => {
-                if (!e.target.value) {
-                    setNameField(cur => ({
-                        ...cur,
-                        error: errorText,
-                        errorOnPriorBlur: true
-                    }));
-                }
-                else if (nameField.errorOnPriorBlur) {
-                    setNameField(cur => ({ ...cur, errorOnPriorBlur: false }));
-                }
-            }} status={nameField.error ? 'error' : undefined} info={nameField.error}/>
-          <ComboBox required label='Category' selected={categoryField.value
-                ? {
-                    items: {
-                        id: categoryField.value,
-                        text: categoryField.value
-                    }
-                }
-                : undefined} menu={{
-                mode: 'single-select',
-                onItemClick: category => {
-                    setCategoryField({
-                        value: category,
-                        error: null
-                    });
-                },
-                items: categories.map(category => {
-                    return {
-                        id: category,
-                        primary: category,
-                        selected: category === categoryField.value
-                    };
-                })
-            }} onBlur={selected => {
-                if (!selected) {
-                    setCategoryField(cur => ({ ...cur, error: errorText }));
-                }
-            }} status={categoryField.error ? 'error' : undefined} info={categoryField.error}/>
-        </Flex>)}
-    </FormDialog>);
-};
-export const FormDialogMock = () => {
-    const [dialogTarget, setDialogTarget] = useState(null);
-    const [editItem, setEditItem] = useState(null);
-    const [items, dispatch] = useMockItems();
-    return (<>
-      <SummaryList name='Editable items' icon='list' count={items.length} actions={[
-            {
-                id: 'Add',
-                text: 'Add',
-                icon: 'plus',
-                onClick: (_, e) => {
-                    setDialogTarget(e.currentTarget);
-                }
-            }
-        ]} items={items.map(({ id, name, category }) => {
-            return {
-                id,
-                primary: name,
-                secondary: <Text variant='secondary'>{category}</Text>,
-                actions: [
-                    {
-                        id: 'Edit',
-                        text: 'Edit',
-                        icon: 'pencil',
-                        onClick: (_, e, menuButton) => {
-                            if (menuButton)
-                                setDialogTarget(menuButton);
-                            setEditItem({
-                                id,
-                                name,
-                                category
-                            });
-                        }
-                    },
-                    {
-                        id: 'Remove',
-                        text: 'Remove',
-                        icon: 'trash',
-                        onClick: () => {
-                            dispatch({ type: 'remove', item: { id } });
-                        }
-                    }
-                ]
-            };
-        })}/>
-
-      {dialogTarget && (<ItemDialog target={dialogTarget} item={editItem} dispatch={fields => {
-                dispatch(editItem
-                    ? { type: 'edit', item: { id: editItem.id, ...fields } }
-                    : { type: 'add', item: { ...fields } });
-            }} onComplete={() => {
-                setDialogTarget(null);
-                setEditItem(null);
-            }}/>)}
-    </>);
-};
-//# sourceMappingURL=FormDialog.mocks.jsx.map

package/jsx/core/Dialog/FormDialog.mocks.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormDialog.mocks.jsx","sourceRoot":"","sources":["../../../src/core/Dialog/FormDialog.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useReducer, useState } from 'react';\nimport type { ChangeEvent, FocusEvent } from 'react';\n\nimport {\n  ComboBox,\n  createUID,\n  Flex,\n  FormDialog,\n  Input,\n  SummaryList,\n  Text\n} from '@pega/cosmos-react-core';\nimport type { FormDialogProps, SummaryListItem } from '@pega/cosmos-react-core';\n\nimport { loadingTimeoutMS } from '../Progress/Progress.mocks';\n\nexport type MockCategory = `Category ${number}`;\n\nexport interface MockItem {\n  readonly id: string;\n  name: string;\n  category: MockCategory;\n}\n\nexport type MockReducerPayload =\n  | {\n      type: 'add';\n      item: Pick<MockItem, 'name' | 'category'>;\n    }\n  | {\n      type: 'edit';\n      item: MockItem;\n    }\n  | {\n      type: 'remove';\n      item: Pick<MockItem, 'id'>;\n    };\n\nexport interface MockItemDialogProps extends Pick<FormDialogProps, 'target'> {\n  item: MockItem | null;\n  dispatch: (fieldValues: Pick<MockItem, 'name' | 'category'>) => void;\n  onComplete: () => void;\n}\n\nconst errorText = 'Cannot be blank';\n\nconst categories = Array.from({ length: 5 }, (_, i): MockCategory => `Category ${i + 1}`);\n\nconst initialItems: MockItem[] = Array.from({ length: 3 }, (_, i) => {\n  return {\n    id: createUID(),\n    name: `Editable item ${i + 1}`,\n    category: categories[i]\n  };\n});\n\nconst itemReducer = (items: MockItem[], payload: MockReducerPayload) => {\n  switch (payload.type) {\n    case 'add': {\n      return [...items, { ...payload.item, id: createUID() }];\n    }\n\n    case 'edit': {\n      return items.map(item => {\n        return item.id === payload.item.id\n          ? { ...item, name: payload.item.name, category: payload.item.category }\n          : item;\n      });\n    }\n\n    case 'remove': {\n      const itemIndex = items.findIndex(item => item.id === payload.item.id);\n      if (itemIndex === -1) return items;\n      items.splice(itemIndex, 1);\n      return [...items];\n    }\n\n    default: {\n      return items;\n    }\n  }\n};\n\nconst progressStates = {\n  loading: 'Loading...',\n  submitting: 'Submitting...'\n} as const;\n\nexport const useMockItems = () => {\n  return useReducer(itemReducer, undefined, () => initialItems);\n};\n\nexport const ItemDialog = ({\n  target,\n  item: itemProp,\n  dispatch,\n  onComplete\n}: MockItemDialogProps) => {\n  const [nameField, setNameField] = useState<{\n    value: string | null;\n    error: typeof errorText | null;\n    errorOnPriorBlur: boolean;\n  }>(() => {\n    return {\n      value: itemProp?.name ?? null,\n      error: null,\n      errorOnPriorBlur: false\n    };\n  });\n\n  const [categoryField, setCategoryField] = useState<{\n    value: MockCategory | null;\n    error: typeof errorText | null;\n  }>(() => {\n    return {\n      value: itemProp?.category ?? null,\n      error: null\n    };\n  });\n\n  const [progress, setProgress] = useState<\n    (typeof progressStates)[keyof typeof progressStates] | false\n  >(progressStates.loading);\n\n  useEffect(() => {\n    let timerId: number;\n\n    if (progress === progressStates.loading) {\n      timerId = window.setTimeout(() => {\n        setProgress(false);\n      }, loadingTimeoutMS);\n    } else if (progress === progressStates.submitting) {\n      timerId = window.setTimeout(() => {\n        setProgress(false);\n        dispatch({ name: nameField.value!, category: categoryField.value! });\n        onComplete();\n      }, loadingTimeoutMS);\n    }\n\n    return () => {\n      window.clearTimeout(timerId);\n    };\n  }, [progress]);\n\n  return (\n    <FormDialog\n      target={target}\n      heading={`${itemProp ? 'Edit' : 'Add'} item`}\n      progress={progress}\n      onCancel={{\n        disabled: progress === progressStates.submitting,\n        handler: () => {\n          setProgress(false);\n          onComplete();\n        }\n      }}\n      onSubmit={{\n        disabled:\n          !!progress || [nameField, categoryField].some(field => !field.value || field.error),\n        handler: () => {\n          setProgress(progressStates.submitting);\n        }\n      }}\n    >\n      {(!progress || progress !== progressStates.loading) && (\n        <Flex container={{ direction: 'column', gap: 2 }}>\n          <Input\n            required\n            label='Name'\n            value={nameField.value ?? ''}\n            onChange={(e: ChangeEvent<HTMLInputElement>) => {\n              setNameField(cur => ({\n                ...cur,\n                value: e.target.value,\n                error: !e.target.value && cur.errorOnPriorBlur ? errorText : null\n              }));\n            }}\n            onBlur={(e: FocusEvent<HTMLInputElement>) => {\n              if (!e.target.value) {\n                setNameField(cur => ({\n                  ...cur,\n                  error: errorText,\n                  errorOnPriorBlur: true\n                }));\n              } else if (nameField.errorOnPriorBlur) {\n                setNameField(cur => ({ ...cur, errorOnPriorBlur: false }));\n              }\n            }}\n            status={nameField.error ? 'error' : undefined}\n            info={nameField.error}\n          />\n          <ComboBox\n            required\n            label='Category'\n            selected={\n              categoryField.value\n                ? {\n                    items: {\n                      id: categoryField.value,\n                      text: categoryField.value\n                    }\n                  }\n                : undefined\n            }\n            menu={{\n              mode: 'single-select',\n              onItemClick: category => {\n                setCategoryField({\n                  value: category as MockCategory,\n                  error: null\n                });\n              },\n              items: categories.map(category => {\n                return {\n                  id: category,\n                  primary: category,\n                  selected: category === categoryField.value\n                };\n              })\n            }}\n            onBlur={selected => {\n              if (!selected) {\n                setCategoryField(cur => ({ ...cur, error: errorText }));\n              }\n            }}\n            status={categoryField.error ? 'error' : undefined}\n            info={categoryField.error}\n          />\n        </Flex>\n      )}\n    </FormDialog>\n  );\n};\n\nexport const FormDialogMock = () => {\n  const [dialogTarget, setDialogTarget] = useState<MockItemDialogProps['target'] | null>(null);\n  const [editItem, setEditItem] = useState<MockItem | null>(null);\n  const [items, dispatch] = useMockItems();\n\n  return (\n    <>\n      <SummaryList\n        name='Editable items'\n        icon='list'\n        count={items.length}\n        actions={[\n          {\n            id: 'Add',\n            text: 'Add',\n            icon: 'plus',\n            onClick: (_, e) => {\n              setDialogTarget(e.currentTarget);\n            }\n          }\n        ]}\n        items={items.map<SummaryListItem>(({ id, name, category }) => {\n          return {\n            id,\n            primary: name,\n            secondary: <Text variant='secondary'>{category}</Text>,\n            actions: [\n              {\n                id: 'Edit',\n                text: 'Edit',\n                icon: 'pencil',\n                onClick: (_, e, menuButton) => {\n                  if (menuButton) setDialogTarget(menuButton);\n\n                  setEditItem({\n                    id,\n                    name,\n                    category\n                  });\n                }\n              },\n              {\n                id: 'Remove',\n                text: 'Remove',\n                icon: 'trash',\n                onClick: () => {\n                  dispatch({ type: 'remove', item: { id } });\n                }\n              }\n            ]\n          };\n        })}\n      />\n\n      {dialogTarget && (\n        <ItemDialog\n          target={dialogTarget}\n          item={editItem}\n          // Wrap dispatch so the dialog can only affect the item it creates or updates.\n          dispatch={fields => {\n            dispatch(\n              editItem\n                ? { type: 'edit', item: { id: editItem.id, ...fields } }\n                : { type: 'add', item: { ...fields } }\n            );\n          }}\n          onComplete={() => {\n            setDialogTarget(null);\n            setEditItem(null);\n          }}\n        />\n      )}\n    </>\n  );\n};\n"]}

package/jsx/core/Dialog/InfoDialog.mocks.d.ts

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-export declare const InfoDialogMock: () => import("react").JSX.Element;
-export declare const InfoDialogProgressMock: () => import("react").JSX.Element;
-//# sourceMappingURL=InfoDialog.mocks.d.ts.map

package/jsx/core/Dialog/InfoDialog.mocks.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"InfoDialog.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Dialog/InfoDialog.mocks.tsx"],"names":[],"mappings":";AAuBA,eAAO,MAAM,cAAc,mCAqB1B,CAAC;AAEF,eAAO,MAAM,sBAAsB,mCAmDlC,CAAC"}

package/jsx/core/Dialog/InfoDialog.mocks.jsx

@@ -1,64 +0,0 @@
-import { useState } from 'react';
-import { useElement, useAfterInitialEffect } from '@pega/cosmos-react-core/lib/hooks';
-import { Avatar, Button, Flex, InfoDialog, Text } from '@pega/cosmos-react-core';
-import { FieldValueListDemo } from '../FieldValueList/FieldValueList.stories';
-import { loadingTimeoutMS } from '../Progress/Progress.mocks';
-const mockContent = (<Flex container={{ direction: 'column', gap: 2 }}>
-    <Text as='p'>
-      Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
-      labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
-      laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
-      voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
-      non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-    </Text>
-    <FieldValueListDemo name='Demo field' value='demo value'/>
-  </Flex>);
-export const InfoDialogMock = () => {
-    const [target, setTarget] = useElement(null);
-    return (<>
-      <Button variant='secondary' onClick={(e) => {
-            setTarget(e.currentTarget);
-        }}>
-        Open dialog
-      </Button>
-
-      {target ? (<InfoDialog heading='General information' target={target} onDismiss={() => setTarget(null)}>
-          {mockContent}
-        </InfoDialog>) : null}
-    </>);
-};
-export const InfoDialogProgressMock = () => {
-    const [target, setTarget] = useElement(null);
-    const [heading, setHeading] = useState();
-    const [content, setContent] = useState(null);
-    useAfterInitialEffect(() => {
-        if (!target) {
-            setHeading(undefined);
-            setContent(null);
-            return;
-        }
-        const timeout = window.setTimeout(() => {
-            setHeading({
-                primary: 'Primary heading',
-                secondary: 'Secondary info',
-                visual: <Avatar name='Info Dialog'/>
-            });
-            setContent(mockContent);
-        }, loadingTimeoutMS);
-        return () => {
-            window.clearTimeout(timeout);
-        };
-    }, [target]);
-    return (<>
-      <Button variant='secondary' onClick={(e) => {
-            setTarget(e.currentTarget);
-        }}>
-        Open dialog
-      </Button>
-
-      {target && (<InfoDialog heading={heading} target={target} onDismiss={() => setTarget(null)} progress={!content}>
-          {content}
-        </InfoDialog>)}
-    </>);
-};
-//# sourceMappingURL=InfoDialog.mocks.jsx.map

package/jsx/core/Dialog/InfoDialog.mocks.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"InfoDialog.mocks.jsx","sourceRoot":"","sources":["../../../src/core/Dialog/InfoDialog.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState } from 'react';\nimport type { MouseEvent } from 'react';\n\nimport { useElement, useAfterInitialEffect } from '@pega/cosmos-react-core/lib/hooks';\nimport { Avatar, Button, Flex, InfoDialog, Text } from '@pega/cosmos-react-core';\nimport type { InfoDialogProps } from '@pega/cosmos-react-core/lib/components/Dialog/Dialog.types';\n\nimport { FieldValueListDemo } from '../FieldValueList/FieldValueList.stories';\nimport { loadingTimeoutMS } from '../Progress/Progress.mocks';\n\nconst mockContent = (\n  <Flex container={{ direction: 'column', gap: 2 }}>\n    <Text as='p'>\n      Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut\n      labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco\n      laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in\n      voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat\n      non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.\n    </Text>\n    <FieldValueListDemo name='Demo field' value='demo value' />\n  </Flex>\n);\n\nexport const InfoDialogMock = () => {\n  const [target, setTarget] = useElement<HTMLButtonElement>(null);\n\n  return (\n    <>\n      <Button\n        variant='secondary'\n        onClick={(e: MouseEvent<HTMLButtonElement>) => {\n          setTarget(e.currentTarget);\n        }}\n      >\n        Open dialog\n      </Button>\n\n      {target ? (\n        <InfoDialog heading='General information' target={target} onDismiss={() => setTarget(null)}>\n          {mockContent}\n        </InfoDialog>\n      ) : null}\n    </>\n  );\n};\n\nexport const InfoDialogProgressMock = () => {\n  const [target, setTarget] = useElement<HTMLButtonElement>(null);\n  const [heading, setHeading] = useState<InfoDialogProps['heading']>();\n  const [content, setContent] = useState<InfoDialogProps['children']>(null);\n\n  useAfterInitialEffect(() => {\n    if (!target) {\n      setHeading(undefined);\n      setContent(null);\n      return;\n    }\n\n    // Mocking a network request to fetch data\n    const timeout = window.setTimeout(() => {\n      setHeading({\n        primary: 'Primary heading',\n        secondary: 'Secondary info',\n        visual: <Avatar name='Info Dialog' />\n      });\n\n      setContent(mockContent);\n    }, loadingTimeoutMS);\n\n    return () => {\n      window.clearTimeout(timeout);\n    };\n  }, [target]);\n\n  return (\n    <>\n      <Button\n        variant='secondary'\n        onClick={(e: MouseEvent<HTMLButtonElement>) => {\n          setTarget(e.currentTarget);\n        }}\n      >\n        Open dialog\n      </Button>\n\n      {target && (\n        <InfoDialog\n          heading={heading}\n          target={target}\n          onDismiss={() => setTarget(null)}\n          progress={!content}\n        >\n          {content}\n        </InfoDialog>\n      )}\n    </>\n  );\n};\n"]}

package/jsx/core/Drawer/Drawer.stories.d.ts

@@ -1,7 +0,0 @@
-import type { StoryFn } from '@storybook/react';
-import type { DrawerProps } from '@pega/cosmos-react-core';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
-export default _default;
-export declare const ContainedDrawer: StoryFn<DrawerProps>;
-export declare const ViewportDrawer: StoryFn<DrawerProps>;
-//# sourceMappingURL=Drawer.stories.d.ts.map

package/jsx/core/Drawer/Drawer.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Drawer.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Drawer/Drawer.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAItD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;;AAI3D,wBAWU;AAEV,eAAO,MAAM,eAAe,EAAE,OAAO,CAAC,WAAW,CAuDhD,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,OAAO,CAAC,WAAW,CAuD/C,CAAC"}

package/jsx/core/Drawer/Drawer.stories.jsx

@@ -1,98 +0,0 @@
-import { useState } from 'react';
-import { Button, Card, Drawer, Flex, Text, useTheme } from '@pega/cosmos-react-core';
-import { StyledDrawerContent } from './Drawer.styles';
-export default {
-    title: 'Core/Drawer',
-    component: Drawer,
-    args: {
-        placement: 'right',
-        transitionSpeed: '0.25s'
-    },
-    argTypes: {
-        placement: { options: ['top', 'right', 'bottom', 'left'], control: { type: 'select' } },
-        transitionSpeed: { control: { type: 'text' } }
-    }
-};
-export const ContainedDrawer = (args) => {
-    const [open, setOpen] = useState(false);
-    const theme = useTheme();
-    const drawer = (<Drawer open={open} nullWhenClosed onOuterClick={() => {
-            setOpen(false);
-        }} position='absolute' size='100%' placement={args.placement} transitionSpeed={args.transitionSpeed}>
-      <Flex as={StyledDrawerContent} container={{
-            direction: 'column',
-            justify: 'center',
-            alignItems: 'center',
-            gap: 2,
-            pad: 4
-        }}>
-        <Text variant='h1'>This is a Drawer</Text>
-        <Text>
-          You can close this Drawer by clicking anywhere in the area outside of it, or by clicking
-          the Button below.
-        </Text>
-        <Button onClick={() => setOpen(false)}>Close Drawer</Button>
-      </Flex>
-    </Drawer>);
-    return (<Card style={{
-            position: 'relative',
-            overflow: 'hidden',
-            height: '20rem',
-            width: '100%',
-            border: `${theme.base.spacing} solid ${theme.base.colors.gray.light}`,
-            backgroundColor: `${theme.base.colors.blue['extra-light']}`,
-            justifyContent: 'center',
-            alignItems: 'center'
-        }}>
-      <Button variant='primary' onClick={() => setOpen(true)}>
-        Open Drawer
-      </Button>
-      {drawer}
-    </Card>);
-};
-export const ViewportDrawer = (args) => {
-    const [open, setOpen] = useState(false);
-    const theme = useTheme();
-    const drawer = (<Drawer open={open} onOuterClick={() => {
-            setOpen(false);
-        }} position='fixed' size={args.size} placement={args.placement} transitionSpeed={args.transitionSpeed} shadow={args.shadow}>
-      <Flex as={StyledDrawerContent} container={{
-            direction: 'column',
-            justify: 'center',
-            alignItems: 'center',
-            gap: 2,
-            pad: 4
-        }}>
-        <Text variant='h1'>This is a Drawer</Text>
-        <Text>
-          You can close this Drawer by clicking anywhere in the area outside of it, or by clicking
-          the Button below.
-        </Text>
-        <Button onClick={() => setOpen(false)}>Close Drawer</Button>
-      </Flex>
-    </Drawer>);
-    return (<Card style={{
-            position: 'relative',
-            overflow: 'hidden',
-            height: '20rem',
-            width: '100%',
-            border: `${theme.base.spacing} solid ${theme.base.colors.gray.light}`,
-            backgroundColor: `${theme.base.colors.blue['extra-light']}`,
-            justifyContent: 'center',
-            alignItems: 'center'
-        }}>
-      <Button variant='primary' onClick={() => setOpen(true)}>
-        Open Drawer
-      </Button>
-      {drawer}
-    </Card>);
-};
-ViewportDrawer.args = {
-    size: '30rem',
-    shadow: false
-};
-ViewportDrawer.argTypes = {
-    size: { control: { type: 'text' } },
-    shadow: { control: { type: 'boolean' } }
-};
-//# sourceMappingURL=Drawer.stories.jsx.map

package/jsx/core/Drawer/Drawer.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"Drawer.stories.jsx","sourceRoot":"","sources":["../../../src/core/Drawer/Drawer.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useState } from 'react';\n\nimport { Button, Card, Drawer, Flex, Text, useTheme } from '@pega/cosmos-react-core';\nimport type { DrawerProps } from '@pega/cosmos-react-core';\n\nimport { StyledDrawerContent } from './Drawer.styles';\n\nexport default {\n  title: 'Core/Drawer',\n  component: Drawer,\n  args: {\n    placement: 'right',\n    transitionSpeed: '0.25s'\n  },\n  argTypes: {\n    placement: { options: ['top', 'right', 'bottom', 'left'], control: { type: 'select' } },\n    transitionSpeed: { control: { type: 'text' } }\n  }\n} as Meta;\n\nexport const ContainedDrawer: StoryFn<DrawerProps> = (args: DrawerProps) => {\n  const [open, setOpen] = useState(false);\n  const theme = useTheme();\n\n  const drawer = (\n    <Drawer\n      open={open}\n      nullWhenClosed\n      onOuterClick={() => {\n        setOpen(false);\n      }}\n      position='absolute'\n      size='100%'\n      placement={args.placement}\n      transitionSpeed={args.transitionSpeed}\n    >\n      <Flex\n        as={StyledDrawerContent}\n        container={{\n          direction: 'column',\n          justify: 'center',\n          alignItems: 'center',\n          gap: 2,\n          pad: 4\n        }}\n      >\n        <Text variant='h1'>This is a Drawer</Text>\n        <Text>\n          You can close this Drawer by clicking anywhere in the area outside of it, or by clicking\n          the Button below.\n        </Text>\n        <Button onClick={() => setOpen(false)}>Close Drawer</Button>\n      </Flex>\n    </Drawer>\n  );\n\n  return (\n    <Card\n      style={{\n        position: 'relative',\n        overflow: 'hidden',\n        height: '20rem',\n        width: '100%',\n        border: `${theme.base.spacing} solid ${theme.base.colors.gray.light}`,\n        backgroundColor: `${theme.base.colors.blue['extra-light']}`,\n        justifyContent: 'center',\n        alignItems: 'center'\n      }}\n    >\n      <Button variant='primary' onClick={() => setOpen(true)}>\n        Open Drawer\n      </Button>\n      {drawer}\n    </Card>\n  );\n};\n\nexport const ViewportDrawer: StoryFn<DrawerProps> = (args: DrawerProps) => {\n  const [open, setOpen] = useState(false);\n  const theme = useTheme();\n\n  const drawer = (\n    <Drawer\n      open={open}\n      onOuterClick={() => {\n        setOpen(false);\n      }}\n      position='fixed'\n      size={args.size}\n      placement={args.placement}\n      transitionSpeed={args.transitionSpeed}\n      shadow={args.shadow}\n    >\n      <Flex\n        as={StyledDrawerContent}\n        container={{\n          direction: 'column',\n          justify: 'center',\n          alignItems: 'center',\n          gap: 2,\n          pad: 4\n        }}\n      >\n        <Text variant='h1'>This is a Drawer</Text>\n        <Text>\n          You can close this Drawer by clicking anywhere in the area outside of it, or by clicking\n          the Button below.\n        </Text>\n        <Button onClick={() => setOpen(false)}>Close Drawer</Button>\n      </Flex>\n    </Drawer>\n  );\n\n  return (\n    <Card\n      style={{\n        position: 'relative',\n        overflow: 'hidden',\n        height: '20rem',\n        width: '100%',\n        border: `${theme.base.spacing} solid ${theme.base.colors.gray.light}`,\n        backgroundColor: `${theme.base.colors.blue['extra-light']}`,\n        justifyContent: 'center',\n        alignItems: 'center'\n      }}\n    >\n      <Button variant='primary' onClick={() => setOpen(true)}>\n        Open Drawer\n      </Button>\n      {drawer}\n    </Card>\n  );\n};\n\nViewportDrawer.args = {\n  size: '30rem',\n  shadow: false\n};\n\nViewportDrawer.argTypes = {\n  size: { control: { type: 'text' } },\n  shadow: { control: { type: 'boolean' } }\n};\n"]}

package/jsx/core/Drawer/Drawer.styles.d.ts

@@ -1,2 +0,0 @@
-export declare const StyledDrawerContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-//# sourceMappingURL=Drawer.styles.d.ts.map

package/jsx/core/Drawer/Drawer.styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Drawer.styles.d.ts","sourceRoot":"","sources":["../../../src/core/Drawer/Drawer.styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,mBAAmB,yGAS9B,CAAC"}

package/jsx/core/Drawer/Drawer.styles.js

@@ -1,11 +0,0 @@
-import styled, { css } from 'styled-components';
-import { defaultThemeProp } from '@pega/cosmos-react-core';
-export const StyledDrawerContent = styled.div(props => {
-    const { theme: { base } } = props;
-    return css `
-    height: 100%;
-    background-color: ${base.palette['primary-background']};
-  `;
-});
-StyledDrawerContent.defaultProps = defaultThemeProp;
-//# sourceMappingURL=Drawer.styles.js.map

package/jsx/core/Drawer/Drawer.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Drawer.styles.js","sourceRoot":"","sources":["../../../src/core/Drawer/Drawer.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3D,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;IACpD,MAAM,EACJ,KAAK,EAAE,EAAE,IAAI,EAAE,EAChB,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;;wBAEY,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;GACvD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '@pega/cosmos-react-core';\n\nexport const StyledDrawerContent = styled.div(props => {\n  const {\n    theme: { base }\n  } = props;\n\n  return css`\n    height: 100%;\n    background-color: ${base.palette['primary-background']};\n  `;\n});\n\nStyledDrawerContent.defaultProps = defaultThemeProp;\n"]}

package/jsx/core/Email/EmailDisplay.stories.d.ts

@@ -1,6 +0,0 @@
-import type { StoryFn } from '@storybook/react';
-import type { EmailDisplayProps } from '@pega/cosmos-react-core';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
-export default _default;
-export declare const EmailDisplayDemo: StoryFn<EmailDisplayProps>;
-//# sourceMappingURL=EmailDisplay.stories.d.ts.map

package/jsx/core/Email/EmailDisplay.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"EmailDisplay.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Email/EmailDisplay.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAGtD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;;AAEjE,wBAGU;AAEV,eAAO,MAAM,gBAAgB,EAAE,OAAO,CAAC,iBAAiB,CAEvD,CAAC"}

package/jsx/core/Email/EmailDisplay.stories.jsx

@@ -1,19 +0,0 @@
-import { EmailDisplay } from '@pega/cosmos-react-core';
-export default {
-    title: 'Core/Email',
-    component: EmailDisplay
-};
-export const EmailDisplayDemo = (args) => {
-    return <EmailDisplay value={args.value} displayText={args.displayText} variant={args.variant}/>;
-};
-EmailDisplayDemo.args = {
-    value: 'email@example.com',
-    displayText: 'Example Email',
-    variant: 'link'
-};
-EmailDisplayDemo.argTypes = {
-    value: { control: { type: 'text' } },
-    displayText: { control: { type: 'text' } },
-    variant: { options: ['link', 'text'], control: { type: 'select' } }
-};
-//# sourceMappingURL=EmailDisplay.stories.jsx.map

package/jsx/core/Email/EmailDisplay.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"EmailDisplay.stories.jsx","sourceRoot":"","sources":["../../../src/core/Email/EmailDisplay.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAGvD,eAAe;IACb,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,YAAY;CAChB,CAAC;AAEV,MAAM,CAAC,MAAM,gBAAgB,GAA+B,CAAC,IAAuB,EAAE,EAAE;IACtF,OAAO,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,EAAG,CAAC;AACnG,CAAC,CAAC;AAEF,gBAAgB,CAAC,IAAI,GAAG;IACtB,KAAK,EAAE,mBAAmB;IAC1B,WAAW,EAAE,eAAe;IAC5B,OAAO,EAAE,MAAM;CAChB,CAAC;AAEF,gBAAgB,CAAC,QAAQ,GAAG;IAC1B,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACpC,WAAW,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAC1C,OAAO,EAAE,EAAE,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;CACpE,CAAC","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\n\nimport { EmailDisplay } from '@pega/cosmos-react-core';\nimport type { EmailDisplayProps } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Email',\n  component: EmailDisplay\n} as Meta;\n\nexport const EmailDisplayDemo: StoryFn<EmailDisplayProps> = (args: EmailDisplayProps) => {\n  return <EmailDisplay value={args.value} displayText={args.displayText} variant={args.variant} />;\n};\n\nEmailDisplayDemo.args = {\n  value: 'email@example.com',\n  displayText: 'Example Email',\n  variant: 'link'\n};\n\nEmailDisplayDemo.argTypes = {\n  value: { control: { type: 'text' } },\n  displayText: { control: { type: 'text' } },\n  variant: { options: ['link', 'text'], control: { type: 'select' } }\n};\n"]}

package/jsx/core/EmojiPicker/EmojiPicker.stories.d.ts

@@ -1,8 +0,0 @@
-import type { StoryFn } from '@storybook/react';
-import type { EmojiPickerProps } from '@pega/cosmos-react-core';
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
-export default _default;
-export declare const EmojiPickerDemo: StoryFn<EmojiPickerProps>;
-export declare const EmojiPickerExcludeDemo: StoryFn<EmojiPickerProps>;
-export declare const CustomEmojiSet: StoryFn<EmojiPickerProps>;
-//# sourceMappingURL=EmojiPicker.stories.d.ts.map

package/jsx/core/EmojiPicker/EmojiPicker.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"EmojiPicker.stories.d.ts","sourceRoot":"","sources":["../../../src/core/EmojiPicker/EmojiPicker.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAKtD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;;AAEhE,wBAaU;AAEV,eAAO,MAAM,eAAe,EAAE,OAAO,CAAC,gBAAgB,CAkBrD,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,OAAO,CAAC,gBAAgB,CAmB5D,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,OAAO,CAAC,gBAAgB,CA8BpD,CAAC"}

package/jsx/core/EmojiPicker/EmojiPicker.stories.jsx

@@ -1,53 +0,0 @@
-import { useMemo, useState } from 'react';
-import { EmojiPicker, EmojiContext, Flex, Input } from '@pega/cosmos-react-core';
-export default {
-    title: 'Core/EmojiPicker',
-    component: EmojiPicker,
-    args: {
-        showFooter: false,
-        emojiSize: 24,
-        perLine: 9
-    },
-    argTypes: {
-        showFooter: { control: { type: 'boolean' } },
-        emojiSize: { control: { type: 'number' } },
-        perLine: { control: { type: 'number' } }
-    }
-};
-export const EmojiPickerDemo = (args) => {
-    const [value, setValue] = useState('');
-    const onEmojiSelect = (emoji) => {
-        setValue(curr => `${curr}${emoji.native}`);
-    };
-    return (<Flex container={{ direction: 'column' }}>
-      <Input value={value}/>
-      <EmojiPicker showFooter={args.showFooter} emojiSize={args.emojiSize} perLine={args.perLine} onSelect={onEmojiSelect}/>
-    </Flex>);
-};
-export const EmojiPickerExcludeDemo = (args) => {
-    const [value, setValue] = useState('');
-    const onEmojiSelect = (emoji) => {
-        setValue(curr => `${curr}${emoji.native}`);
-    };
-    return (<Flex container={{ direction: 'column' }}>
-      <Input value={value}/>
-      <EmojiPicker exclude={['recent', 'people', 'foods', 'activity', 'flags']} showFooter={args.showFooter} emojiSize={args.emojiSize} perLine={args.perLine} onSelect={onEmojiSelect}/>
-    </Flex>);
-};
-export const CustomEmojiSet = (args) => {
-    const [value, setValue] = useState('');
-    const onEmojiSelect = (emoji) => {
-        setValue(curr => `${curr}${emoji.native}`);
-    };
-    const ctx = useMemo(() => ({
-        set: 'google',
-        spriteSrcResolver: () => 'https://unpkg.com/emoji-datasource-google@5.0.1/img/google/sheets-clean/32.png'
-    }), []);
-    return (<EmojiContext.Provider value={ctx}>
-      <Flex container={{ direction: 'column' }}>
-        <Input value={value}/>
-        <EmojiPicker showFooter={args.showFooter} emojiSize={args.emojiSize} perLine={args.perLine} onSelect={onEmojiSelect}/>
-      </Flex>
-    </EmojiContext.Provider>);
-};
-//# sourceMappingURL=EmojiPicker.stories.jsx.map

package/jsx/core/EmojiPicker/EmojiPicker.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"EmojiPicker.stories.jsx","sourceRoot":"","sources":["../../../src/core/EmojiPicker/EmojiPicker.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useMemo, useState } from 'react';\nimport type { BaseEmoji } from 'emoji-mart';\n\nimport { EmojiPicker, EmojiContext, Flex, Input } from '@pega/cosmos-react-core';\nimport type { EmojiPickerProps } from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/EmojiPicker',\n  component: EmojiPicker,\n  args: {\n    showFooter: false,\n    emojiSize: 24,\n    perLine: 9\n  },\n  argTypes: {\n    showFooter: { control: { type: 'boolean' } },\n    emojiSize: { control: { type: 'number' } },\n    perLine: { control: { type: 'number' } }\n  }\n} as Meta;\n\nexport const EmojiPickerDemo: StoryFn<EmojiPickerProps> = (args: EmojiPickerProps) => {\n  const [value, setValue] = useState<string>('');\n\n  const onEmojiSelect = (emoji: BaseEmoji) => {\n    setValue(curr => `${curr}${emoji.native}`);\n  };\n\n  return (\n    <Flex container={{ direction: 'column' }}>\n      <Input value={value} />\n      <EmojiPicker\n        showFooter={args.showFooter}\n        emojiSize={args.emojiSize}\n        perLine={args.perLine}\n        onSelect={onEmojiSelect}\n      />\n    </Flex>\n  );\n};\n\nexport const EmojiPickerExcludeDemo: StoryFn<EmojiPickerProps> = (args: EmojiPickerProps) => {\n  const [value, setValue] = useState<string>('');\n\n  const onEmojiSelect = (emoji: BaseEmoji) => {\n    setValue(curr => `${curr}${emoji.native}`);\n  };\n\n  return (\n    <Flex container={{ direction: 'column' }}>\n      <Input value={value} />\n      <EmojiPicker\n        exclude={['recent', 'people', 'foods', 'activity', 'flags']}\n        showFooter={args.showFooter}\n        emojiSize={args.emojiSize}\n        perLine={args.perLine}\n        onSelect={onEmojiSelect}\n      />\n    </Flex>\n  );\n};\n\nexport const CustomEmojiSet: StoryFn<EmojiPickerProps> = (args: EmojiPickerProps) => {\n  const [value, setValue] = useState<string>('');\n\n  const onEmojiSelect = (emoji: BaseEmoji) => {\n    setValue(curr => `${curr}${emoji.native}`);\n  };\n\n  const ctx = useMemo(\n    () =>\n      ({\n        set: 'google',\n        spriteSrcResolver: () =>\n          'https://unpkg.com/emoji-datasource-google@5.0.1/img/google/sheets-clean/32.png'\n      } as const),\n    []\n  );\n\n  return (\n    <EmojiContext.Provider value={ctx}>\n      <Flex container={{ direction: 'column' }}>\n        <Input value={value} />\n        <EmojiPicker\n          showFooter={args.showFooter}\n          emojiSize={args.emojiSize}\n          perLine={args.perLine}\n          onSelect={onEmojiSelect}\n        />\n      </Flex>\n    </EmojiContext.Provider>\n  );\n};\n"]}