npm - @pega/cosmos-react-demos - Versions diffs - 2.1.4 → 3.0.0-dev.10.0 - Mend

@pega/cosmos-react-demos 2.1.4 → 3.0.0-dev.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1161) hide show

package/lib/core/MenuButton/MenuButton.stories.js CHANGED Viewed

@@ -37,7 +37,7 @@ export const MenuButtonAction = (args) => {
         return menuHelpers.mapTree(items, item => {
             return {
                 ...item,
-                visual: args.showItemVisual ? _jsx(Avatar, { name: item.primary }, void 0) : undefined,
+                visual: args.showItemVisual ? _jsx(Avatar, { name: item.primary }) : undefined,
                 secondary: args.showItemSecondary ? item.secondary : undefined
             };
         });
@@ -53,7 +53,7 @@ export const MenuButtonAction = (args) => {
             mode: 'action',
             items: itemsToRender,
             onItemClick: () => { }
-        } }, void 0));
+        } }));
 };
 MenuButtonAction.args = {
     text: 'Actions'
@@ -74,7 +74,7 @@ export const MenuButtonSingleSelect = (args) => {
         return menuHelpers.mapTree(items, item => {
             return {
                 ...item,
-                visual: args.showItemVisual ? _jsx(Avatar, { name: item.primary }, void 0) : undefined,
+                visual: args.showItemVisual ? _jsx(Avatar, { name: item.primary }) : undefined,
                 secondary: args.showItemSecondary ? item.secondary : undefined
             };
         });
@@ -94,7 +94,7 @@ export const MenuButtonSingleSelect = (args) => {
             mode: 'single-select',
             items: itemsToRender,
             onItemClick: handleMenuItemClick
-        } }, void 0));
+        } }));
 };
 MenuButtonSingleSelect.args = {
     text: 'Select an item'
@@ -115,7 +115,7 @@ export const MenuButtonMultiSelect = (args) => {
         return menuHelpers.mapTree(items, item => {
             return {
                 ...item,
-                visual: args.showItemVisual ? _jsx(Avatar, { name: item.primary }, void 0) : undefined,
+                visual: args.showItemVisual ? _jsx(Avatar, { name: item.primary }) : undefined,
                 secondary: args.showItemSecondary ? item.secondary : undefined
             };
         });
@@ -141,8 +141,8 @@ export const MenuButtonMultiSelect = (args) => {
                                 };
                             });
                         });
-                    }, children: "Clear" }, void 0) }, void 0))
-        } }, void 0));
+                    }, children: "Clear" }) }))
+        } }));
 };
 MenuButtonMultiSelect.args = {
     text: 'Select items'
@@ -160,7 +160,7 @@ export const MenuButtonDisabledItems = (args) => {
         return menuHelpers.mapTree(items, (item, index) => {
             return {
                 ...item,
-                visual: args.showItemVisual ? _jsx(Avatar, { name: item.primary }, void 0) : undefined,
+                visual: args.showItemVisual ? _jsx(Avatar, { name: item.primary }) : undefined,
                 secondary: args.showItemSecondary ? item.secondary : undefined,
                 disabled: (index + 1) % 2 === 0
             };
@@ -177,7 +177,7 @@ export const MenuButtonDisabledItems = (args) => {
             mode: 'action',
             items: itemsToRender,
             onItemClick: () => { }
-        } }, void 0));
+        } }));
 };
 MenuButtonDisabledItems.args = {
     text: 'Actions'

package/lib/core/MenuButton/MenuButton.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MenuButton.stories.js","sourceRoot":"","sources":["../../../src/core/MenuButton/MenuButton.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState, useMemo, useEffect } from 'react';\n\nimport {\n Avatar,\n Button,\n Flex,\n MenuButton,\n MenuButtonProps,\n menuHelpers,\n MenuItemProps,\n MenuProps\n} from '@pega/cosmos-react-core';\n\nexport default {\n title: 'Core/MenuButton',\n component: MenuButton,\n args: {\n variant: 'secondary',\n showIcon: true,\n iconOnly: false,\n showItemVisual: true,\n showItemSecondary: true,\n showItemCount: true\n },\n argTypes: {\n text: { control: { type: 'text' } },\n variant: {\n options: ['primary', 'secondary', 'simple', 'link', 'text'],\n control: { type: 'select' }\n },\n showIcon: { control: { type: 'boolean' } },\n iconOnly: { control: { type: 'boolean' } },\n showItemVisual: { control: { type: 'boolean' } },\n showItemSecondary: { control: { type: 'boolean' } },\n showItemCount: { control: { type: 'boolean' } }\n }\n} as Meta;\n\ninterface MenuButtonStoryProps extends MenuButtonProps {\n showIcon: boolean;\n showItemVisual: boolean;\n showItemSecondary: boolean;\n showItemCount: boolean;\n}\n\nexport const MenuButtonAction: Story<MenuButtonStoryProps> = (args: MenuButtonStoryProps) => {\n const [items, setItems] = useState<MenuProps['items']>(() =>\n Array.from({ length: 10 }, (_, i) => {\n return {\n id: `${i}`,\n primary: `Item ${i + 1}`,\n secondary: ['Meta A', 'Meta B', 'Meta C']\n };\n })\n );\n\n const itemsToRender = useMemo(() => {\n return menuHelpers.mapTree(items, item => {\n return {\n ...item,\n visual: args.showItemVisual ? <Avatar name={item.primary} /> : undefined,\n secondary: args.showItemSecondary ? item.secondary : undefined\n };\n });\n }, [items, args.showItemVisual, args.showItemSecondary]);\n\n useEffect(() => {\n setItems(cur => {\n return menuHelpers.mapTree(cur, item => {\n return { ...item, count: args.showItemCount ? Math.ceil(Math.random() * 10) : undefined };\n });\n });\n }, [args.showItemCount]);\n\n return (\n <MenuButton\n text={args.text}\n variant={args.variant}\n icon={args.showIcon ? 'user-list-solid' : undefined}\n iconOnly={args.iconOnly}\n menu={{\n mode: 'action',\n items: itemsToRender,\n onItemClick: () => {}\n }}\n />\n );\n};\n\nMenuButtonAction.args = {\n text: 'Actions'\n};\n\nexport const MenuButtonSingleSelect: Story<MenuButtonStoryProps> = (args: MenuButtonStoryProps) => {\n const [items, setItems] = useState<MenuProps['items']>(() =>\n Array.from({ length: 10 }, (_, i) => {\n return {\n id: `${i}`,\n primary: `Item ${i + 1}`,\n secondary: ['Meta A', 'Meta B', 'Meta C'],\n selected: false\n };\n })\n );\n const handleMenuItemClick = (id: MenuItemProps['id']) => {\n setItems(cur => menuHelpers.toggleSelected(cur, id, 'single-select'));\n };\n\n const itemsToRender = useMemo(() => {\n return menuHelpers.mapTree(items, item => {\n return {\n ...item,\n visual: args.showItemVisual ? <Avatar name={item.primary} /> : undefined,\n secondary: args.showItemSecondary ? item.secondary : undefined\n };\n });\n }, [items, args.showItemVisual, args.showItemSecondary]);\n\n const buttonText = useMemo(() => {\n const selected = menuHelpers.getSelected(items)[0];\n return selected ? selected.primary : args.text;\n }, [items]);\n\n useEffect(() => {\n setItems(cur => {\n return menuHelpers.mapTree(cur, item => {\n return { ...item, count: args.showItemCount ? Math.ceil(Math.random() * 10) : undefined };\n });\n });\n }, [args.showItemCount]);\n\n return (\n <MenuButton\n text={buttonText}\n variant={args.variant}\n icon={args.showIcon ? 'user-list-solid' : undefined}\n iconOnly={args.iconOnly}\n menu={{\n mode: 'single-select',\n items: itemsToRender,\n onItemClick: handleMenuItemClick\n }}\n />\n );\n};\n\nMenuButtonSingleSelect.args = {\n text: 'Select an item'\n};\n\nexport const MenuButtonMultiSelect: Story<MenuButtonStoryProps> = (args: MenuButtonStoryProps) => {\n const [items, setItems] = useState<MenuProps['items']>(() =>\n Array.from({ length: 10 }, (_, i) => {\n return {\n id: `${i}`,\n primary: `Item ${i + 1}`,\n secondary: ['Meta A', 'Meta B', 'Meta C'],\n selected: false\n };\n })\n );\n\n const handleMenuItemClick = (id: MenuItemProps['id']) => {\n setItems(cur => menuHelpers.toggleSelected(cur, id, 'multi-select'));\n };\n\n const itemsToRender = useMemo(() => {\n return menuHelpers.mapTree(items, item => {\n return {\n ...item,\n visual: args.showItemVisual ? <Avatar name={item.primary} /> : undefined,\n secondary: args.showItemSecondary ? item.secondary : undefined\n };\n });\n }, [items, args.showItemVisual, args.showItemSecondary]);\n\n const selectionCount = useMemo(() => menuHelpers.getSelected(items).length, [items]);\n\n useEffect(() => {\n setItems(cur => {\n return menuHelpers.mapTree(cur, item => {\n return { ...item, count: args.showItemCount ? Math.ceil(Math.random() * 10) : undefined };\n });\n });\n }, [args.showItemCount]);\n\n return (\n <MenuButton\n text={args.text}\n variant={args.variant}\n icon={args.showIcon ? 'user-list-solid' : undefined}\n iconOnly={args.iconOnly}\n count={selectionCount}\n menu={{\n mode: 'multi-select',\n items: itemsToRender,\n onItemClick: handleMenuItemClick,\n footer: (\n <Flex container={{ justify: 'center' }}>\n <Button\n variant='link'\n disabled={selectionCount <= 0}\n onClick={() => {\n setItems(cur => {\n return menuHelpers.mapTree(cur, item => {\n return {\n ...item,\n selected: false\n };\n });\n });\n }}\n >\n Clear\n </Button>\n </Flex>\n )\n }}\n />\n );\n};\n\nMenuButtonMultiSelect.args = {\n text: 'Select items'\n};\n\nexport const MenuButtonDisabledItems: Story<MenuButtonStoryProps> = (\n args: MenuButtonStoryProps\n) => {\n const [items, setItems] = useState<MenuProps['items']>(() =>\n Array.from({ length: 10 }, (_, i) => {\n return {\n id: `${i}`,\n primary: `Item ${i + 1}`,\n secondary: ['Meta A', 'Meta B', 'Meta C'],\n selected: false\n };\n })\n );\n\n const itemsToRender = useMemo(() => {\n return menuHelpers.mapTree(items, (item, index) => {\n return {\n ...item,\n visual: args.showItemVisual ? <Avatar name={item.primary} /> : undefined,\n secondary: args.showItemSecondary ? item.secondary : undefined,\n disabled: (index + 1) % 2 === 0\n };\n });\n }, [items, args.showItemVisual, args.showItemSecondary]);\n\n useEffect(() => {\n setItems(cur => {\n return menuHelpers.mapTree(cur, item => {\n return { ...item, count: args.showItemCount ? Math.ceil(Math.random() * 10) : undefined };\n });\n });\n }, [args.showItemCount]);\n\n return (\n <MenuButton\n text={args.text}\n variant={args.variant}\n icon={args.showIcon ? 'user-list-solid' : undefined}\n iconOnly={args.iconOnly}\n menu={{\n mode: 'action',\n items: itemsToRender,\n onItemClick: () => {}\n }}\n />\n );\n};\n\nMenuButtonDisabledItems.args = {\n text: 'Actions'\n};\n"]}
1	+ {"version":3,"file":"MenuButton.stories.js","sourceRoot":"","sources":["../../../src/core/MenuButton/MenuButton.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState, useMemo, useEffect } from 'react';\n\nimport {\n Avatar,\n Button,\n Flex,\n MenuButton,\n MenuButtonProps,\n menuHelpers,\n MenuItemProps,\n MenuProps\n} from '@pega/cosmos-react-core';\n\nexport default {\n title: 'Core/MenuButton',\n component: MenuButton,\n args: {\n variant: 'secondary',\n showIcon: true,\n iconOnly: false,\n showItemVisual: true,\n showItemSecondary: true,\n showItemCount: true\n },\n argTypes: {\n text: { control: { type: 'text' } },\n variant: {\n options: ['primary', 'secondary', 'simple', 'link', 'text'],\n control: { type: 'select' }\n },\n showIcon: { control: { type: 'boolean' } },\n iconOnly: { control: { type: 'boolean' } },\n showItemVisual: { control: { type: 'boolean' } },\n showItemSecondary: { control: { type: 'boolean' } },\n showItemCount: { control: { type: 'boolean' } }\n }\n} as Meta;\n\ntype MenuButtonStoryProps = MenuButtonProps & {\n showIcon?: boolean;\n showItemVisual?: boolean;\n showItemSecondary?: boolean;\n showItemCount?: boolean;\n};\n\nexport const MenuButtonAction: Story<MenuButtonStoryProps> = (args: MenuButtonStoryProps) => {\n const [items, setItems] = useState<MenuProps['items']>(() =>\n Array.from({ length: 10 }, (_, i) => {\n return {\n id: `${i}`,\n primary: `Item ${i + 1}`,\n secondary: ['Meta A', 'Meta B', 'Meta C']\n };\n })\n );\n\n const itemsToRender = useMemo(() => {\n return menuHelpers.mapTree(items, item => {\n return {\n ...item,\n visual: args.showItemVisual ? <Avatar name={item.primary} /> : undefined,\n secondary: args.showItemSecondary ? item.secondary : undefined\n };\n });\n }, [items, args.showItemVisual, args.showItemSecondary]);\n\n useEffect(() => {\n setItems(cur => {\n return menuHelpers.mapTree(cur, item => {\n return { ...item, count: args.showItemCount ? Math.ceil(Math.random() * 10) : undefined };\n });\n });\n }, [args.showItemCount]);\n\n return (\n <MenuButton\n text={args.text}\n variant={args.variant}\n icon={args.showIcon ? 'user-list-solid' : undefined}\n iconOnly={args.iconOnly}\n menu={{\n mode: 'action',\n items: itemsToRender,\n onItemClick: () => {}\n }}\n />\n );\n};\n\nMenuButtonAction.args = {\n text: 'Actions'\n};\n\nexport const MenuButtonSingleSelect: Story<MenuButtonStoryProps> = (args: MenuButtonStoryProps) => {\n const [items, setItems] = useState<MenuProps['items']>(() =>\n Array.from({ length: 10 }, (_, i) => {\n return {\n id: `${i}`,\n primary: `Item ${i + 1}`,\n secondary: ['Meta A', 'Meta B', 'Meta C'],\n selected: false\n };\n })\n );\n const handleMenuItemClick = (id: MenuItemProps['id']) => {\n setItems(cur => menuHelpers.toggleSelected(cur, id, 'single-select'));\n };\n\n const itemsToRender = useMemo(() => {\n return menuHelpers.mapTree(items, item => {\n return {\n ...item,\n visual: args.showItemVisual ? <Avatar name={item.primary} /> : undefined,\n secondary: args.showItemSecondary ? item.secondary : undefined\n };\n });\n }, [items, args.showItemVisual, args.showItemSecondary]);\n\n const buttonText = useMemo(() => {\n const selected = menuHelpers.getSelected(items)[0];\n return selected ? selected.primary : args.text;\n }, [items]);\n\n useEffect(() => {\n setItems(cur => {\n return menuHelpers.mapTree(cur, item => {\n return { ...item, count: args.showItemCount ? Math.ceil(Math.random() * 10) : undefined };\n });\n });\n }, [args.showItemCount]);\n\n return (\n <MenuButton\n text={buttonText}\n variant={args.variant}\n icon={args.showIcon ? 'user-list-solid' : undefined}\n iconOnly={args.iconOnly}\n menu={{\n mode: 'single-select',\n items: itemsToRender,\n onItemClick: handleMenuItemClick\n }}\n />\n );\n};\n\nMenuButtonSingleSelect.args = {\n text: 'Select an item'\n};\n\nexport const MenuButtonMultiSelect: Story<MenuButtonStoryProps> = (args: MenuButtonStoryProps) => {\n const [items, setItems] = useState<MenuProps['items']>(() =>\n Array.from({ length: 10 }, (_, i) => {\n return {\n id: `${i}`,\n primary: `Item ${i + 1}`,\n secondary: ['Meta A', 'Meta B', 'Meta C'],\n selected: false\n };\n })\n );\n\n const handleMenuItemClick = (id: MenuItemProps['id']) => {\n setItems(cur => menuHelpers.toggleSelected(cur, id, 'multi-select'));\n };\n\n const itemsToRender = useMemo(() => {\n return menuHelpers.mapTree(items, item => {\n return {\n ...item,\n visual: args.showItemVisual ? <Avatar name={item.primary} /> : undefined,\n secondary: args.showItemSecondary ? item.secondary : undefined\n };\n });\n }, [items, args.showItemVisual, args.showItemSecondary]);\n\n const selectionCount = useMemo(() => menuHelpers.getSelected(items).length, [items]);\n\n useEffect(() => {\n setItems(cur => {\n return menuHelpers.mapTree(cur, item => {\n return { ...item, count: args.showItemCount ? Math.ceil(Math.random() * 10) : undefined };\n });\n });\n }, [args.showItemCount]);\n\n return (\n <MenuButton\n text={args.text}\n variant={args.variant}\n icon={args.showIcon ? 'user-list-solid' : undefined}\n iconOnly={args.iconOnly}\n count={selectionCount}\n menu={{\n mode: 'multi-select',\n items: itemsToRender,\n onItemClick: handleMenuItemClick,\n footer: (\n <Flex container={{ justify: 'center' }}>\n <Button\n variant='link'\n disabled={selectionCount <= 0}\n onClick={() => {\n setItems(cur => {\n return menuHelpers.mapTree(cur, item => {\n return {\n ...item,\n selected: false\n };\n });\n });\n }}\n >\n Clear\n </Button>\n </Flex>\n )\n }}\n />\n );\n};\n\nMenuButtonMultiSelect.args = {\n text: 'Select items'\n};\n\nexport const MenuButtonDisabledItems: Story<MenuButtonStoryProps> = (\n args: MenuButtonStoryProps\n) => {\n const [items, setItems] = useState<MenuProps['items']>(() =>\n Array.from({ length: 10 }, (_, i) => {\n return {\n id: `${i}`,\n primary: `Item ${i + 1}`,\n secondary: ['Meta A', 'Meta B', 'Meta C'],\n selected: false\n };\n })\n );\n\n const itemsToRender = useMemo(() => {\n return menuHelpers.mapTree(items, (item, index) => {\n return {\n ...item,\n visual: args.showItemVisual ? <Avatar name={item.primary} /> : undefined,\n secondary: args.showItemSecondary ? item.secondary : undefined,\n disabled: (index + 1) % 2 === 0\n };\n });\n }, [items, args.showItemVisual, args.showItemSecondary]);\n\n useEffect(() => {\n setItems(cur => {\n return menuHelpers.mapTree(cur, item => {\n return { ...item, count: args.showItemCount ? Math.ceil(Math.random() * 10) : undefined };\n });\n });\n }, [args.showItemCount]);\n\n return (\n <MenuButton\n text={args.text}\n variant={args.variant}\n icon={args.showIcon ? 'user-list-solid' : undefined}\n iconOnly={args.iconOnly}\n menu={{\n mode: 'action',\n items: itemsToRender,\n onItemClick: () => {}\n }}\n />\n );\n};\n\nMenuButtonDisabledItems.args = {\n text: 'Actions'\n};\n"]}

package/lib/core/MetaList/MetaList.stories.js CHANGED Viewed

@@ -7,9 +7,9 @@ export default {
 export const MetaListDemo = (args) => {
     return (_jsx(MetaList, { wrapItems: args.wrapItems, items: [
             'email@example.com',
-            _jsx(Status, { variant: 'success', children: "Verified" }, void 0),
-            _jsxs(_Fragment, { children: ["Go to", ' ', _jsx(Link, { href: 'https://www.pega.com', target: '_blank', children: "Pega.com" }, void 0)] }, void 0)
-        ] }, void 0));
+            _jsx(Status, { variant: 'success', children: "Verified" }),
+            _jsxs(_Fragment, { children: ["Go to", ' ', _jsx(Link, { href: 'https://www.pega.com', target: '_blank', children: "Pega.com" })] })
+        ] }));
 };
 MetaListDemo.args = {
     wrapItems: true

package/lib/core/MetaList/MetaList.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MetaList.stories.js","sourceRoot":"","sources":["../../../src/core/MetaList/MetaList.stories.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAiB,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEhF,eAAe;IACb,KAAK,EAAE,eAAe;IACtB,SAAS,EAAE,QAAQ;CACZ,CAAC;AAMV,MAAM,CAAC,MAAM,YAAY,GAA8B,CAAC,IAAwB,EAAE,EAAE;IAClF,OAAO,CACL,KAAC,QAAQ,IACP,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,KAAK,EAAE;YACL,mBAAmB;YACnB,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,~~iCAAkB~~;YAC3C,uCACQ,GAAG,EACT,KAAC,IAAI,IAAC,IAAI,EAAC,sBAAsB,EAAC,MAAM,EAAC,QAAQ,~~iCAE1C~~,~~YACN~~;SACJ,~~WACD~~,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,YAAY,CAAC,IAAI,GAAG;IAClB,SAAS,EAAE,IAAI;CAChB,CAAC;AAEF,YAAY,CAAC,QAAQ,GAAG;IACtB,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;CAC5C,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { Link, MetaList, MetaListProps, Status } from '@pega/cosmos-react-core';\n\nexport default {\n title: 'Core/MetaList',\n component: MetaList\n} as Meta;\n\ninterface MetaListStoryProps {\n wrapItems?: MetaListProps['wrapItems'];\n}\n\nexport const MetaListDemo: Story<MetaListStoryProps> = (args: MetaListStoryProps) => {\n return (\n <MetaList\n wrapItems={args.wrapItems}\n items={[\n 'email@example.com',\n <Status variant='success'>Verified</Status>,\n <>\n Go to{' '}\n <Link href='https://www.pega.com' target='_blank'>\n Pega.com\n </Link>\n </>\n ]}\n />\n );\n};\n\nMetaListDemo.args = {\n wrapItems: true\n};\n\nMetaListDemo.argTypes = {\n wrapItems: { control: { type: 'boolean' } }\n};\n"]}
1	+ {"version":3,"file":"MetaList.stories.js","sourceRoot":"","sources":["../../../src/core/MetaList/MetaList.stories.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAiB,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEhF,eAAe;IACb,KAAK,EAAE,eAAe;IACtB,SAAS,EAAE,QAAQ;CACZ,CAAC;AAMV,MAAM,CAAC,MAAM,YAAY,GAA8B,CAAC,IAAwB,EAAE,EAAE;IAClF,OAAO,CACL,KAAC,QAAQ,IACP,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,KAAK,EAAE;YACL,mBAAmB;YACnB,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,yBAAkB;YAC3C,uCACQ,GAAG,EACT,KAAC,IAAI,IAAC,IAAI,EAAC,sBAAsB,EAAC,MAAM,EAAC,QAAQ,yBAE1C,IACN;SACJ,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,YAAY,CAAC,IAAI,GAAG;IAClB,SAAS,EAAE,IAAI;CAChB,CAAC;AAEF,YAAY,CAAC,QAAQ,GAAG;IACtB,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;CAC5C,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\n\nimport { Link, MetaList, MetaListProps, Status } from '@pega/cosmos-react-core';\n\nexport default {\n title: 'Core/MetaList',\n component: MetaList\n} as Meta;\n\ninterface MetaListStoryProps {\n wrapItems?: MetaListProps['wrapItems'];\n}\n\nexport const MetaListDemo: Story<MetaListStoryProps> = (args: MetaListStoryProps) => {\n return (\n <MetaList\n wrapItems={args.wrapItems}\n items={[\n 'email@example.com',\n <Status variant='success'>Verified</Status>,\n <>\n Go to{' '}\n <Link href='https://www.pega.com' target='_blank'>\n Pega.com\n </Link>\n </>\n ]}\n />\n );\n};\n\nMetaListDemo.args = {\n wrapItems: true\n};\n\nMetaListDemo.argTypes = {\n wrapItems: { control: { type: 'boolean' } }\n};\n"]}

package/lib/core/Modal/Modal.mocks.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Modal/Modal.mocks.tsx"],"names":[],"mappings":";~~AAOA~~,oBAAY,YAAY,GACpB,YAAY,GACZ,WAAW,GACX,OAAO,GACP,OAAO,GACP,iBAAiB,GACjB,iBAAiB,GACjB,iBAAiB,GACjB,QAAQ,CAAC;AAab,eAAO,MAAM,UAAU,gBAAiB,YAAY,wBAAwB,OAAO,gBAiClF,CAAC"}
1	+ {"version":3,"file":"Modal.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Modal/Modal.mocks.tsx"],"names":[],"mappings":";AAQA,oBAAY,YAAY,GACpB,YAAY,GACZ,WAAW,GACX,OAAO,GACP,OAAO,GACP,iBAAiB,GACjB,iBAAiB,GACjB,iBAAiB,GACjB,QAAQ,CAAC;AAab,eAAO,MAAM,UAAU,gBAAiB,YAAY,wBAAwB,OAAO,gBAiClF,CAAC"}

package/lib/core/Modal/Modal.mocks.js CHANGED Viewed

@@ -1,8 +1,8 @@
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { Flex, Text } from '@pega/cosmos-react-core';
-import { ImageDemo } from '@pega/cosmos-react-demos/lib/core/Image/Image.stories';
-import { TableDemo } from '@pega/cosmos-react-demos/lib/core/Table/Table.stories';
-import { FormContent } from '@pega/cosmos-react-demos/lib/core/Form/Form.mocks';
+import { ImageDemo } from '../Image/Image.stories';
+import { TableDemo } from '../Table/Table.stories';
+import { FormContent } from '../Form/Form.mocks';
 const getRandomContentType = (contentType) => {
     const contentMap = {
         text: ['short text', 'long text'],
@@ -15,22 +15,22 @@ const getRandomContentType = (contentType) => {
 export const getContent = (contentType, formColumnWidthFixed) => {
     switch (contentType) {
         case 'random':
-            return (_jsxs(Flex, { container: { direction: 'column', gap: 4 }, children: [getContent(getRandomContentType('text'), false), getContent(getRandomContentType('meta'), false), getContent(getRandomContentType('form'), formColumnWidthFixed)] }, void 0));
+            return (_jsxs(Flex, { container: { direction: 'column', gap: 4 }, children: [getContent(getRandomContentType('text'), false), getContent(getRandomContentType('meta'), false), getContent(getRandomContentType('form'), formColumnWidthFixed)] }));
         case 'image':
-            return _jsx(ImageDemo, {}, void 0);
+            return _jsx(ImageDemo, {});
         case 'table':
-            return _jsx(TableDemo, {}, void 0);
+            return _jsx(TableDemo, {});
         case 'form (1 column)':
-            return _jsx(FormContent, { cols: 1, showActions: false }, void 0);
+            return _jsx(FormContent, { cols: 1, showActions: false });
         case 'form (2 column)':
-            return _jsx(FormContent, { cols: 2, showActions: false }, void 0);
+            return _jsx(FormContent, { cols: 2, showActions: false });
         case 'form (3 column)':
-            return _jsx(FormContent, { cols: 3, showActions: false }, void 0);
+            return _jsx(FormContent, { cols: 3, showActions: false });
         case 'long text':
-            return (_jsx(Text, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fermentum ipsum ipsum, nec sodales risus finibus eget. Proin ornare, ante ac convallis sollicitudin, elit turpis venenatis lorem, vitae viverra eros magna non lectus. Duis ac auctor sapien. Donec malesuada eros ut libero sodales, malesuada ullamcorper lacus eleifend." }, void 0));
+            return (_jsx(Text, { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fermentum ipsum ipsum, nec sodales risus finibus eget. Proin ornare, ante ac convallis sollicitudin, elit turpis venenatis lorem, vitae viverra eros magna non lectus. Duis ac auctor sapien. Donec malesuada eros ut libero sodales, malesuada ullamcorper lacus eleifend." }));
         case 'short text':
         default:
-            return _jsx(Text, { children: "Lorem ipsum dolor sit amet." }, void 0);
+            return _jsx(Text, { children: "Lorem ipsum dolor sit amet." });
     }
 };
 //# sourceMappingURL=Modal.mocks.js.map

package/lib/core/Modal/Modal.mocks.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.mocks.js","sourceRoot":"","sources":["../../../src/core/Modal/Modal.mocks.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;~~AACrD~~,OAAO,EAAE,SAAS,EAAE,MAAM,~~uDAAuD~~,CAAC;~~AAClF~~,OAAO,EAAE,SAAS,EAAE,MAAM,~~uDAAuD~~,CAAC;~~AAClF~~,OAAO,EAAE,WAAW,EAAE,MAAM,~~mDAAmD~~,CAAC;~~AAchF~~,MAAM,oBAAoB,GAAG,CAAC,WAA4B,EAAgB,EAAE;IAC1E,MAAM,UAAU,GAA4C;QAC1D,IAAI,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC;QACjC,IAAI,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC;QACxB,IAAI,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,EAAE,iBAAiB,CAAC;KAChE,CAAC;IACF,MAAM,OAAO,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IAExC,OAAO,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;AAC7D,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,WAAyB,EAAE,oBAA6B,EAAE,EAAE;IACrF,QAAQ,WAAW,EAAE;QACnB,KAAK,QAAQ;YACX,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC7C,UAAU,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,EAC/C,UAAU,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,EAC/C,UAAU,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,oBAAoB,CAAC,~~YAC1D~~,CACR,CAAC;QACJ,KAAK,OAAO;YACV,OAAO,KAAC,SAAS,~~aAAG~~,CAAC;QACvB,KAAK,OAAO;YACV,OAAO,KAAC,SAAS,~~aAAG~~,CAAC;QACvB,KAAK,iBAAiB;YACpB,OAAO,KAAC,WAAW,IAAC,IAAI,EAAE,CAAC,EAAE,WAAW,EAAE,KAAK,~~WAAI~~,CAAC;QACtD,KAAK,iBAAiB;YACpB,OAAO,KAAC,WAAW,IAAC,IAAI,EAAE,CAAC,EAAE,WAAW,EAAE,KAAK,~~WAAI~~,CAAC;QACtD,KAAK,iBAAiB;YACpB,OAAO,KAAC,WAAW,IAAC,IAAI,EAAE,CAAC,EAAE,WAAW,EAAE,KAAK,~~WAAI~~,CAAC;QACtD,KAAK,WAAW;YACd,OAAO,CACL,KAAC,IAAI,~~qWAKE~~,CACR,CAAC;QACJ,KAAK,YAAY,CAAC;QAClB;YACE,OAAO,KAAC,IAAI,~~sDAAmC~~,CAAC;KACnD;AACH,CAAC,CAAC","sourcesContent":["import { Flex, Text } from '@pega/cosmos-react-core';\nimport { ImageDemo } from '~~@pega/cosmos-react-demos/lib/core/~~Image/Image.stories';\nimport { TableDemo } from '~~@pega/cosmos-react-demos/lib/core/~~Table/Table.stories';\nimport { FormContent } from '~~@pega/cosmos-react-demos/lib/core/~~Form/Form.mocks';\n\ntype ContentSections = 'text' \| 'meta' \| 'form';\n\nexport type ContentTypes =\n \| 'short text'\n \| 'long text'\n \| 'image'\n \| 'table'\n \| 'form (1 column)'\n \| 'form (2 column)'\n \| 'form (3 column)'\n \| 'random';\n\nconst getRandomContentType = (contentType: ContentSections): ContentTypes => {\n const contentMap: Record<ContentSections, ContentTypes[]> = {\n text: ['short text', 'long text'],\n meta: ['image', 'table'],\n form: ['form (1 column)', 'form (2 column)', 'form (3 column)']\n };\n const options = contentMap[contentType];\n\n return options[Math.floor(Math.random() * options.length)];\n};\n\nexport const getContent = (contentType: ContentTypes, formColumnWidthFixed: boolean) => {\n switch (contentType) {\n case 'random':\n return (\n <Flex container={{ direction: 'column', gap: 4 }}>\n {getContent(getRandomContentType('text'), false)}\n {getContent(getRandomContentType('meta'), false)}\n {getContent(getRandomContentType('form'), formColumnWidthFixed)}\n </Flex>\n );\n case 'image':\n return <ImageDemo />;\n case 'table':\n return <TableDemo />;\n case 'form (1 column)':\n return <FormContent cols={1} showActions={false} />;\n case 'form (2 column)':\n return <FormContent cols={2} showActions={false} />;\n case 'form (3 column)':\n return <FormContent cols={3} showActions={false} />;\n case 'long text':\n return (\n <Text>\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fermentum ipsum ipsum, nec\n sodales risus finibus eget. Proin ornare, ante ac convallis sollicitudin, elit turpis\n venenatis lorem, vitae viverra eros magna non lectus. Duis ac auctor sapien. Donec\n malesuada eros ut libero sodales, malesuada ullamcorper lacus eleifend.\n </Text>\n );\n case 'short text':\n default:\n return <Text>Lorem ipsum dolor sit amet.</Text>;\n }\n};\n"]}
1	+ {"version":3,"file":"Modal.mocks.js","sourceRoot":"","sources":["../../../src/core/Modal/Modal.mocks.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAErD,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAcjD,MAAM,oBAAoB,GAAG,CAAC,WAA4B,EAAgB,EAAE;IAC1E,MAAM,UAAU,GAA4C;QAC1D,IAAI,EAAE,CAAC,YAAY,EAAE,WAAW,CAAC;QACjC,IAAI,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC;QACxB,IAAI,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,EAAE,iBAAiB,CAAC;KAChE,CAAC;IACF,MAAM,OAAO,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IAExC,OAAO,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;AAC7D,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,WAAyB,EAAE,oBAA6B,EAAE,EAAE;IACrF,QAAQ,WAAW,EAAE;QACnB,KAAK,QAAQ;YACX,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC7C,UAAU,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,EAC/C,UAAU,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,EAC/C,UAAU,CAAC,oBAAoB,CAAC,MAAM,CAAC,EAAE,oBAAoB,CAAC,IAC1D,CACR,CAAC;QACJ,KAAK,OAAO;YACV,OAAO,KAAC,SAAS,KAAG,CAAC;QACvB,KAAK,OAAO;YACV,OAAO,KAAC,SAAS,KAAG,CAAC;QACvB,KAAK,iBAAiB;YACpB,OAAO,KAAC,WAAW,IAAC,IAAI,EAAE,CAAC,EAAE,WAAW,EAAE,KAAK,GAAI,CAAC;QACtD,KAAK,iBAAiB;YACpB,OAAO,KAAC,WAAW,IAAC,IAAI,EAAE,CAAC,EAAE,WAAW,EAAE,KAAK,GAAI,CAAC;QACtD,KAAK,iBAAiB;YACpB,OAAO,KAAC,WAAW,IAAC,IAAI,EAAE,CAAC,EAAE,WAAW,EAAE,KAAK,GAAI,CAAC;QACtD,KAAK,WAAW;YACd,OAAO,CACL,KAAC,IAAI,6VAKE,CACR,CAAC;QACJ,KAAK,YAAY,CAAC;QAClB;YACE,OAAO,KAAC,IAAI,8CAAmC,CAAC;KACnD;AACH,CAAC,CAAC","sourcesContent":["import { Flex, Text } from '@pega/cosmos-react-core';\n\nimport { ImageDemo } from '../Image/Image.stories';\nimport { TableDemo } from '../Table/Table.stories';\nimport { FormContent } from '../Form/Form.mocks';\n\ntype ContentSections = 'text' \| 'meta' \| 'form';\n\nexport type ContentTypes =\n \| 'short text'\n \| 'long text'\n \| 'image'\n \| 'table'\n \| 'form (1 column)'\n \| 'form (2 column)'\n \| 'form (3 column)'\n \| 'random';\n\nconst getRandomContentType = (contentType: ContentSections): ContentTypes => {\n const contentMap: Record<ContentSections, ContentTypes[]> = {\n text: ['short text', 'long text'],\n meta: ['image', 'table'],\n form: ['form (1 column)', 'form (2 column)', 'form (3 column)']\n };\n const options = contentMap[contentType];\n\n return options[Math.floor(Math.random() * options.length)];\n};\n\nexport const getContent = (contentType: ContentTypes, formColumnWidthFixed: boolean) => {\n switch (contentType) {\n case 'random':\n return (\n <Flex container={{ direction: 'column', gap: 4 }}>\n {getContent(getRandomContentType('text'), false)}\n {getContent(getRandomContentType('meta'), false)}\n {getContent(getRandomContentType('form'), formColumnWidthFixed)}\n </Flex>\n );\n case 'image':\n return <ImageDemo />;\n case 'table':\n return <TableDemo />;\n case 'form (1 column)':\n return <FormContent cols={1} showActions={false} />;\n case 'form (2 column)':\n return <FormContent cols={2} showActions={false} />;\n case 'form (3 column)':\n return <FormContent cols={3} showActions={false} />;\n case 'long text':\n return (\n <Text>\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec fermentum ipsum ipsum, nec\n sodales risus finibus eget. Proin ornare, ante ac convallis sollicitudin, elit turpis\n venenatis lorem, vitae viverra eros magna non lectus. Duis ac auctor sapien. Donec\n malesuada eros ut libero sodales, malesuada ullamcorper lacus eleifend.\n </Text>\n );\n case 'short text':\n default:\n return <Text>Lorem ipsum dolor sit amet.</Text>;\n }\n};\n"]}

package/lib/core/Modal/Modal.stories.d.ts CHANGED Viewed

@@ -3,11 +3,16 @@ import { ModalProps } from '@pega/cosmos-react-core';
 import { ContentTypes } from './Modal.mocks';
 declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
-export declare const ModalDemo: Story<ModalProps>;
-export declare const ModalUpdates: Story<ModalProps>;
-export declare const AlertModal: Story<ModalProps>;
-export declare const ProgressState: Story<ModalProps>;
-export declare const MinimizableModal: Story<ModalProps>;
+interface ModalDemoProps {
+    autoWidth: ModalProps['autoWidth'];
+    center: ModalProps['center'];
+    stretch: ModalProps['stretch'];
+}
+export declare const ModalDemo: Story<ModalDemoProps>;
+export declare const ModalUpdates: Story<ModalDemoProps>;
+export declare const AlertModal: Story<ModalDemoProps>;
+export declare const ProgressState: Story;
+export declare const MinimizableModal: Story<ModalDemoProps>;
 export declare const DockedModal: Story;
 interface AutoWidthModalContentProps {
     autoWidth: boolean;

package/lib/core/Modal/Modal.stories.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Modal/Modal.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAY/C,OAAO,~~EAQL~~,UAAU,~~EAKX~~,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,YAAY,EAAc,MAAM,eAAe,CAAC;;AAEzD,wBAgBU;AAEV,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,~~UAAU~~,~~CA+BvC~~,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,~~UAAU~~,~~CAkE1C~~,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,~~UAAU~~,~~CAgGxC~~,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,~~KAAK~~,CAAC~~,UAAU,CA2F3C,CAAC~~;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,~~UAAU~~,~~CAkC9C~~,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,~~KAiCzB~~,CAAC;AAQF,UAAU,0BAA0B;IAClC,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,YAAY,CAAC;IACtB,oBAAoB,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;CAChB;AAED,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,0BAA0B,~~CAgEnE~~,CAAC"}
1	+ {"version":3,"file":"Modal.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Modal/Modal.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAY/C,OAAO,EAOL,UAAU,EAIX,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,YAAY,EAAc,MAAM,eAAe,CAAC;;AAEzD,wBAgBU;AAEV,UAAU,cAAc;IACtB,SAAS,EAAE,UAAU,CAAC,WAAW,CAAC,CAAC;IACnC,MAAM,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;IAC7B,OAAO,EAAE,UAAU,CAAC,SAAS,CAAC,CAAC;CAChC;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,cAAc,CA6B3C,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,cAAc,CAgE9C,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,cAAc,CAkG5C,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KA2F3B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,cAAc,CAgClD,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KA+BzB,CAAC;AAQF,UAAU,0BAA0B;IAClC,SAAS,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,YAAY,CAAC;IACtB,oBAAoB,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;CAChB;AAED,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,0BAA0B,CA8DnE,CAAC"}

package/lib/core/Modal/Modal.stories.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useContext, useEffect, useMemo, useRef, useState } from 'react';
-import { Button, Configuration, Flex, Input, Modal, ModalManagerContext, Text, ToasterContext, WorkTheme, cap } from '@pega/cosmos-react-core';
+import { Button, Flex, Input, Modal, ModalManagerContext, Text, ToasterContext, cap } from '@pega/cosmos-react-core';
 import { getContent } from './Modal.mocks';
 export default {
     title: 'Core/Modal',
@@ -21,15 +21,15 @@ export default {
 };
 export const ModalDemo = (args) => {
     const MyModal = () => {
-        return (_jsx(Configuration, { theme: WorkTheme, children: _jsx(Modal, { heading: 'This is the Modal heading', autoWidth: args.autoWidth, center: args.center, stretch: args.stretch, children: _jsx(Text, { children: "This is the content of the Modal." }, void 0) }, void 0) }, void 0));
+        return (_jsx(Modal, { heading: 'This is the Modal heading', autoWidth: args.autoWidth, center: args.center, stretch: args.stretch, children: _jsx(Text, { children: "This is the content of the Modal." }) }));
     };
     const ModalButton = () => {
         const { create } = useContext(ModalManagerContext);
         return (_jsx(Button, { onClick: () => {
                 create(MyModal);
-            }, children: "Open Modal" }, void 0));
+            }, children: "Open Modal" }));
     };
-    return _jsx(ModalButton, {}, void 0);
+    return _jsx(ModalButton, {});
 };
 export const ModalUpdates = (args) => {
     const MyModal = props => {
@@ -39,8 +39,8 @@ export const ModalUpdates = (args) => {
                     update({
                         content: 'This Modal has been updated a second time from within the Modal!'
                     });
-                }, children: "Update Modal" }, void 0) }, void 0));
-        return (_jsx(Configuration, { theme: WorkTheme, children: _jsx(Modal, { heading: props.heading, actions: actions, autoWidth: args.autoWidth, center: args.center, stretch: args.stretch, children: _jsx(Text, { children: props.content }, void 0) }, void 0) }, void 0));
+                }, children: "Update Modal" }) }));
+        return (_jsx(Modal, { heading: props.heading, actions: actions, autoWidth: args.autoWidth, center: args.center, stretch: args.stretch, children: _jsx(Text, { children: props.content }) }));
     };
     const ModalButton = () => {
         const { create } = useContext(ModalManagerContext);
@@ -59,21 +59,21 @@ export const ModalUpdates = (args) => {
                 });
             }, 2000);
         };
-        return _jsx(Button, { onClick: openModal, children: "Open Modal" }, void 0);
+        return _jsx(Button, { onClick: openModal, children: "Open Modal" });
     };
-    return _jsx(ModalButton, {}, void 0);
+    return _jsx(ModalButton, {});
 };
 export const AlertModal = (args) => {
     const MyAlert = (props) => {
         const { ModalContext } = useContext(ModalManagerContext);
         const { dismiss } = useContext(ModalContext);
         const actions = useMemo(() => {
-            return (_jsxs(_Fragment, { children: [_jsx(Button, { onClick: dismiss, children: "No" }, void 0), _jsx(Button, { variant: 'primary', onClick: () => {
+            return (_jsxs(_Fragment, { children: [_jsx(Button, { onClick: dismiss, children: "No" }), _jsx(Button, { variant: 'primary', onClick: () => {
                             dismiss();
                             props.closeInitialModal();
-                        }, children: "Yes" }, void 0)] }, void 0));
+                        }, children: "Yes" })] }));
         }, [dismiss]);
-        return (_jsx(Configuration, { theme: WorkTheme, children: _jsx(Modal, { heading: 'You have unsaved changes!', actions: actions, center: args.center, stretch: args.stretch, children: _jsx(Text, { children: "Are you sure you want to close without saving?" }, void 0) }, void 0) }, void 0));
+        return (_jsx(Modal, { heading: 'You have unsaved changes!', actions: actions, center: args.center, stretch: args.stretch, children: _jsx(Text, { children: "Are you sure you want to close without saving?" }) }));
     };
     const MyModal = () => {
         const [name, setName] = useState('');
@@ -87,20 +87,25 @@ export const AlertModal = (args) => {
                             else {
                                 dismiss();
                             }
-                        }, children: "Close" }, void 0), _jsx(Button, { variant: 'primary', onClick: dismiss, disabled: name === '', children: "Save" }, void 0)] }, void 0));
+                        }, children: "Close" }), _jsx(Button, { variant: 'primary', onClick: dismiss, disabled: name === '', children: "Save" })] }));
         }, [dismiss, name]);
         const onNameChange = (e) => {
             setName(e.target.value);
         };
-        return (_jsx(Configuration, { theme: WorkTheme, children: _jsx(Modal, { actions: actions, heading: 'Close the Modal without saving any data to invoke the alert', autoWidth: args.autoWidth, center: args.center, stretch: args.stretch, children: _jsx(Input, { label: 'Name', name: 'name', onChange: onNameChange, value: name, required: true }, void 0) }, void 0) }, void 0));
+        return (_jsx(Modal, { actions: actions, heading: 'Close the Modal without saving any data to invoke the alert', autoWidth: args.autoWidth, center: args.center, stretch: args.stretch, onRequestDismiss: () => {
+                if (name !== '') {
+                    create(MyAlert, { closeInitialModal: dismiss }, { alert: true });
+                    return false;
+                }
+            }, children: _jsx(Input, { label: 'Name', name: 'name', onChange: onNameChange, value: name, required: true }) }));
     };
     const ModalButton = () => {
         const { create } = useContext(ModalManagerContext);
         return (_jsx(Button, { onClick: () => {
                 create(MyModal);
-            }, children: "Open Modal" }, void 0));
+            }, children: "Open Modal" }));
     };
-    return _jsx(ModalButton, {}, void 0);
+    return _jsx(ModalButton, {});
 };
 export const ProgressState = () => {
     const LoadingStateModal = () => {
@@ -111,9 +116,9 @@ export const ProgressState = () => {
                         if (transientState !== 'submitting') {
                             dismiss();
                         }
-                    }, children: "Cancel" }, void 0), _jsx(Button, { disabled: !!transientState, variant: 'primary', onClick: () => {
+                    }, children: "Cancel" }), _jsx(Button, { disabled: !!transientState, variant: 'primary', onClick: () => {
                         setTransientState('submitting');
-                    }, children: "Submit" }, void 0)] }, void 0));
+                    }, children: "Submit" })] }));
         useEffect(() => {
             let timerID;
             if (transientState === 'loading' || transientState === 'submitting') {
@@ -136,34 +141,34 @@ export const ProgressState = () => {
                         message: `${cap(transientState)}…`
                     };
                 }
-            }, [transientState]), heading: 'Modal progress demo', actions: actions, onRequestDismiss: () => transientState !== 'submitting', children: transientState !== 'loading' && (_jsx(Flex, { container: { direction: 'column', gap: 2 }, children: Array.from({ length: 5 }, (_, i) => (_jsx(Input, { label: `Field-${i + 1}` }, i))) }, void 0)) }, void 0));
+            }, [transientState]), heading: 'Modal progress demo', actions: actions, onRequestDismiss: () => transientState !== 'submitting', children: transientState !== 'loading' && (_jsx(Flex, { container: { direction: 'column', gap: 2 }, children: Array.from({ length: 5 }, (_, i) => (_jsx(Input, { label: `Field-${i + 1}` }, i))) })) }));
     };
     const ModalButton = () => {
         const { create } = useContext(ModalManagerContext);
         return (_jsx(Button, { onClick: () => {
                 create(LoadingStateModal);
-            }, children: "Open Modal" }, void 0));
+            }, children: "Open Modal" }));
     };
-    return _jsx(ModalButton, {}, void 0);
+    return _jsx(ModalButton, {});
 };
 export const MinimizableModal = (args) => {
     const [count, setCount] = useState(1);
     const MyModal = () => {
-        return (_jsx(Configuration, { theme: WorkTheme, children: _jsx(Modal, { heading: `Modal #${count}`, autoWidth: args.autoWidth, center: args.center, stretch: args.stretch, children: _jsx(Text, { children: "This Modal can be minimized by clicking the minimize button above." }, void 0) }, void 0) }, void 0));
+        return (_jsx(Modal, { heading: `Modal #${count}`, autoWidth: args.autoWidth, center: args.center, stretch: args.stretch, children: _jsx(Text, { children: "This Modal can be minimized by clicking the minimize button above." }) }));
     };
     const ModalButton = () => {
         const { create } = useContext(ModalManagerContext);
         return (_jsx(Button, { onClick: () => {
                 setCount(count + 1);
                 create(MyModal, undefined, { minimizable: true });
-            }, children: "Open Modal" }, void 0));
+            }, children: "Open Modal" }));
     };
-    return _jsx(ModalButton, {}, void 0);
+    return _jsx(ModalButton, {});
 };
 export const DockedModal = () => {
     const [count, setCount] = useState(1);
     const MyModal = () => {
-        return (_jsx(Configuration, { theme: WorkTheme, children: _jsx(Modal, { heading: `Modal #${count}`, children: _jsx(Text, { children: "This Modal can be minimized by clicking the minimize button above." }, void 0) }, void 0) }, void 0));
+        return (_jsx(Modal, { heading: `Modal #${count}`, children: _jsx(Text, { children: "This Modal can be minimized by clicking the minimize button above." }) }));
     };
     const ModalButton = () => {
         const { create } = useContext(ModalManagerContext);
@@ -174,9 +179,9 @@ export const DockedModal = () => {
                     maximizable: true,
                     dockable: true
                 });
-            }, children: "Open Modal" }, void 0));
+            }, children: "Open Modal" }));
     };
-    return _jsx(ModalButton, {}, void 0);
+    return _jsx(ModalButton, {});
 };
 DockedModal.argTypes = {
     autoWidth: { table: { disable: true } },
@@ -188,13 +193,13 @@ export const AutoWidthModalContent = (args) => {
     const MyModal = ({ content }) => {
         const { ModalContext } = useContext(ModalManagerContext);
         const { dismiss } = useContext(ModalContext);
-        return (_jsx(Configuration, { theme: WorkTheme, children: _jsx(Modal, { heading: `Modal ${args.autoWidth ? 'with' : 'without'} autoWidth`, autoWidth: args.autoWidth, actions: args.content.includes('form') || args.content === 'random' ? (_jsxs(_Fragment, { children: [_jsx(Button, { name: 'Cancel', variant: 'secondary', onClick: () => {
-                                dismiss();
-                                push({ content: 'Form cancelled!' });
-                            }, children: "Cancel" }, void 0), _jsx(Button, { name: 'Submit', variant: 'primary', onClick: () => {
-                                dismiss();
-                                push({ content: 'Form submitted!' });
-                            }, children: "Submit" }, void 0)] }, void 0)) : undefined, children: content }, void 0) }, void 0));
+        return (_jsx(Modal, { heading: `Modal ${args.autoWidth ? 'with' : 'without'} autoWidth`, autoWidth: args.autoWidth, actions: args.content.includes('form') || args.content === 'random' ? (_jsxs(_Fragment, { children: [_jsx(Button, { name: 'Cancel', variant: 'secondary', onClick: () => {
+                            dismiss();
+                            push({ content: 'Form cancelled!' });
+                        }, children: "Cancel" }), _jsx(Button, { name: 'Submit', variant: 'primary', onClick: () => {
+                            dismiss();
+                            push({ content: 'Form submitted!' });
+                        }, children: "Submit" })] })) : undefined, children: content }));
     };
     const ModalButton = () => {
         const { create } = useContext(ModalManagerContext);
@@ -202,9 +207,9 @@ export const AutoWidthModalContent = (args) => {
                 create(MyModal, {
                     content: getContent(args.content, args.formColumnWidthFixed)
                 });
-            }, children: "Open Modal" }, void 0));
+            }, children: "Open Modal" }));
     };
-    return _jsx(ModalButton, {}, void 0);
+    return _jsx(ModalButton, {});
 };
 AutoWidthModalContent.args = {
     autoWidth: true,

package/lib/core/Modal/Modal.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.stories.js","sourceRoot":"","sources":["../../../src/core/Modal/Modal.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport {\n FC,\n ChangeEvent,\n ReactNode,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState\n} from 'react';\n\nimport {\n Button,\n Configuration,\n Flex,\n Input,\n Modal,\n ModalManagerContext,\n ModalMethods,\n ModalProps,\n Text,\n ToasterContext,\n WorkTheme,\n cap\n} from '@pega/cosmos-react-core';\n\nimport { ContentTypes, getContent } from './Modal.mocks';\n\nexport default {\n title: 'Core/Modal',\n component: Modal,\n parameters: {\n layout: 'centered'\n },\n args: {\n autoWidth: false,\n stretch: false,\n center: false\n },\n argTypes: {\n autoWidth: { control: { type: 'boolean' } },\n stretch: { control: { type: 'boolean' } },\n center: { control: { type: 'boolean' } }\n }\n} as Meta;\n\nexport const ModalDemo: Story<ModalProps> = (args: ModalProps) => {\n const MyModal = () => {\n return (\n <Configuration theme={WorkTheme}>\n <Modal\n heading='This is the Modal heading'\n autoWidth={args.autoWidth}\n center={args.center}\n stretch={args.stretch}\n >\n <Text>This is the content of the Modal.</Text>\n </Modal>\n </Configuration>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n\n return (\n <Button\n onClick={() => {\n create(MyModal);\n }}\n >\n Open Modal\n </Button>\n );\n };\n\n return <ModalButton />;\n};\n\nexport const ModalUpdates: Story<ModalProps> = (args: ModalProps) => {\n interface ModalUpdatesProps {\n content: string;\n disableButton: boolean;\n heading: string;\n }\n\n const MyModal: FC<ModalUpdatesProps> = props => {\n const { ModalContext } = useContext(ModalManagerContext);\n const { update } = useContext(ModalContext);\n\n const actions = (\n <>\n <Button\n variant='primary'\n disabled={props.disableButton}\n onClick={() => {\n update({\n content: 'This Modal has been updated a second time from within the Modal!'\n });\n }}\n >\n Update Modal\n </Button>\n </>\n );\n\n return (\n <Configuration theme={WorkTheme}>\n <Modal\n heading={props.heading}\n actions={actions}\n autoWidth={args.autoWidth}\n center={args.center}\n stretch={args.stretch}\n >\n <Text>{props.content}</Text>\n </Modal>\n </Configuration>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n const modalMethods = useRef<ModalMethods<ModalUpdatesProps>>();\n\n const openModal = () => {\n modalMethods.current = create(MyModal, {\n heading: 'This is the Modal heading',\n content: 'This Modal will automatically update in a few seconds.',\n disableButton: true\n });\n\n setTimeout(() => {\n modalMethods.current?.update({\n heading: 'This is the updated Modal heading',\n content: 'This Modal has been updated from its parent!',\n disableButton: false\n });\n }, 2000);\n };\n\n return <Button onClick={openModal}>Open Modal</Button>;\n };\n\n return <ModalButton />;\n};\n\nexport const AlertModal: Story<ModalProps> = (args: ModalProps) => {\n const MyAlert = (props: { closeInitialModal: () => void }) => {\n const { ModalContext } = useContext(ModalManagerContext);\n const { dismiss } = useContext(ModalContext);\n\n const actions = useMemo(() => {\n return (\n <>\n <Button onClick={dismiss}>No</Button>\n <Button\n variant='primary'\n onClick={() => {\n dismiss();\n props.closeInitialModal();\n }}\n >\n Yes\n </Button>\n </>\n );\n }, [dismiss]);\n\n return (\n <Configuration theme={WorkTheme}>\n <Modal\n heading='You have unsaved changes!'\n actions={actions}\n center={args.center}\n stretch={args.stretch}\n >\n <Text>Are you sure you want to close without saving?</Text>\n </Modal>\n </Configuration>\n );\n };\n\n const MyModal = () => {\n const [name, setName] = useState('');\n const { ModalContext, create } = useContext(ModalManagerContext);\n const { dismiss } = useContext(ModalContext);\n\n const actions = useMemo(() => {\n return (\n <>\n <Button\n onClick={() => {\n if (name !== '') {\n create(MyAlert, { closeInitialModal: dismiss }, { alert: true });\n } else {\n dismiss();\n }\n }}\n >\n Close\n </Button>\n <Button variant='primary' onClick={dismiss} disabled={name === ''}>\n Save\n </Button>\n </>\n );\n }, [dismiss, name]);\n\n const onNameChange = (e: ChangeEvent<HTMLInputElement>) => {\n setName(e.target.value);\n };\n\n return (\n <Configuration theme={WorkTheme}>\n <Modal\n actions={actions}\n heading='Close the Modal without saving any data to invoke the alert'\n autoWidth={args.autoWidth}\n center={args.center}\n stretch={args.stretch}\n >\n <Input label='Name' name='name' onChange={onNameChange} value={name} required />\n </Modal>\n </Configuration>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n\n return (\n <Button\n onClick={() => {\n create(MyModal);\n }}\n >\n Open Modal\n </Button>\n );\n };\n\n return <ModalButton />;\n};\n\nexport const ProgressState: Story<ModalProps> = () => {\n const LoadingStateModal = () => {\n const { ModalContext } = useContext(ModalManagerContext);\n const { dismiss } = useContext(ModalContext);\n\n const [transientState, setTransientState] = useState<'loading' \| 'submitting' \| null>(\n 'loading'\n );\n\n const actions =\n transientState === 'loading' ? null : (\n <>\n <Button\n disabled={!!transientState}\n onClick={() => {\n if (transientState !== 'submitting') {\n dismiss();\n }\n }}\n >\n Cancel\n </Button>\n <Button\n disabled={!!transientState}\n variant='primary'\n onClick={() => {\n setTransientState('submitting');\n }}\n >\n Submit\n </Button>\n </>\n );\n\n useEffect(() => {\n let timerID: number;\n\n if (transientState === 'loading' \|\| transientState === 'submitting') {\n timerID = window.setTimeout(() => {\n if (transientState === 'loading') {\n setTransientState(null);\n } else {\n dismiss();\n }\n }, 3000);\n }\n\n return () => {\n window.clearTimeout(timerID);\n };\n }, [transientState]);\n\n return (\n <Modal\n progress={useMemo(() => {\n if (transientState) {\n return {\n message: `${cap(transientState)}…`\n };\n }\n }, [transientState])}\n heading='Modal progress demo'\n actions={actions}\n onRequestDismiss={() => transientState !== 'submitting'}\n >\n {transientState !== 'loading' && (\n <Flex container={{ direction: 'column', gap: 2 }}>\n {Array.from({ length: 5 }, (_, i) => (\n <Input key={i} label={`Field-${i + 1}`} />\n ))}\n </Flex>\n )}\n </Modal>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n\n return (\n <Button\n onClick={() => {\n create(LoadingStateModal);\n }}\n >\n Open Modal\n </Button>\n );\n };\n\n return <ModalButton />;\n};\n\nexport const MinimizableModal: Story<ModalProps> = (args: ModalProps) => {\n const [count, setCount] = useState(1);\n\n const MyModal = () => {\n return (\n <Configuration theme={WorkTheme}>\n <Modal\n heading={`Modal #${count}`}\n autoWidth={args.autoWidth}\n center={args.center}\n stretch={args.stretch}\n >\n <Text>This Modal can be minimized by clicking the minimize button above.</Text>\n </Modal>\n </Configuration>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n\n return (\n <Button\n onClick={() => {\n setCount(count + 1);\n create(MyModal, undefined, { minimizable: true });\n }}\n >\n Open Modal\n </Button>\n );\n };\n\n return <ModalButton />;\n};\n\nexport const DockedModal: Story = () => {\n const [count, setCount] = useState(1);\n\n const MyModal = () => {\n return (\n <Configuration theme={WorkTheme}>\n <Modal heading={`Modal #${count}`}>\n <Text>This Modal can be minimized by clicking the minimize button above.</Text>\n </Modal>\n </Configuration>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n\n return (\n <Button\n onClick={() => {\n setCount(count + 1);\n create(MyModal, undefined, {\n minimizable: true,\n maximizable: true,\n dockable: true\n });\n }}\n >\n Open Modal\n </Button>\n );\n };\n\n return <ModalButton />;\n};\n\nDockedModal.argTypes = {\n autoWidth: { table: { disable: true } },\n stretch: { table: { disable: true } },\n center: { table: { disable: true } }\n};\n\ninterface AutoWidthModalContentProps {\n autoWidth: boolean;\n content: ContentTypes;\n formColumnWidthFixed: boolean;\n stretch?: never;\n center?: never;\n}\n\nexport const AutoWidthModalContent: Story<AutoWidthModalContentProps> = (\n args: AutoWidthModalContentProps\n) => {\n const { push } = useContext(ToasterContext);\n\n const MyModal = ({ content }: { content: ReactNode }) => {\n const { ModalContext } = useContext(ModalManagerContext);\n const { dismiss } = useContext(ModalContext);\n\n return (\n <Configuration theme={WorkTheme}>\n <Modal\n heading={`Modal ${args.autoWidth ? 'with' : 'without'} autoWidth`}\n autoWidth={args.autoWidth}\n actions={\n args.content.includes('form') \|\| args.content === 'random' ? (\n <>\n <Button\n name='Cancel'\n variant='secondary'\n onClick={() => {\n dismiss();\n push({ content: 'Form cancelled!' });\n }}\n >\n Cancel\n </Button>\n <Button\n name='Submit'\n variant='primary'\n onClick={() => {\n dismiss();\n push({ content: 'Form submitted!' });\n }}\n >\n Submit\n </Button>\n </>\n ) : undefined\n }\n >\n {content}\n </Modal>\n </Configuration>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n\n return (\n <Button\n onClick={() => {\n create(MyModal, {\n content: getContent(args.content, args.formColumnWidthFixed)\n });\n }}\n >\n Open Modal\n </Button>\n );\n };\n\n return <ModalButton />;\n};\n\nAutoWidthModalContent.args = {\n autoWidth: true,\n content: 'short text',\n formColumnWidthFixed: false\n};\n\nAutoWidthModalContent.argTypes = {\n stretch: { table: { disable: true } },\n center: { table: { disable: true } },\n content: {\n options: [\n 'short text',\n 'long text',\n 'image',\n 'table',\n 'form (1 column)',\n 'form (2 column)',\n 'form (3 column)',\n 'random'\n ],\n control: { type: 'select' }\n },\n formColumnWidthFixed: { control: { type: 'boolean' } }\n};\n"]}
1	+ {"version":3,"file":"Modal.stories.js","sourceRoot":"","sources":["../../../src/core/Modal/Modal.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport {\n FC,\n ChangeEvent,\n ReactNode,\n useContext,\n useEffect,\n useMemo,\n useRef,\n useState\n} from 'react';\n\nimport {\n Button,\n Flex,\n Input,\n Modal,\n ModalManagerContext,\n ModalMethods,\n ModalProps,\n Text,\n ToasterContext,\n cap\n} from '@pega/cosmos-react-core';\n\nimport { ContentTypes, getContent } from './Modal.mocks';\n\nexport default {\n title: 'Core/Modal',\n component: Modal,\n parameters: {\n layout: 'centered'\n },\n args: {\n autoWidth: false,\n stretch: false,\n center: false\n },\n argTypes: {\n autoWidth: { control: { type: 'boolean' } },\n stretch: { control: { type: 'boolean' } },\n center: { control: { type: 'boolean' } }\n }\n} as Meta;\n\ninterface ModalDemoProps {\n autoWidth: ModalProps['autoWidth'];\n center: ModalProps['center'];\n stretch: ModalProps['stretch'];\n}\n\nexport const ModalDemo: Story<ModalDemoProps> = (args: ModalDemoProps) => {\n const MyModal = () => {\n return (\n <Modal\n heading='This is the Modal heading'\n autoWidth={args.autoWidth}\n center={args.center}\n stretch={args.stretch}\n >\n <Text>This is the content of the Modal.</Text>\n </Modal>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n\n return (\n <Button\n onClick={() => {\n create(MyModal);\n }}\n >\n Open Modal\n </Button>\n );\n };\n\n return <ModalButton />;\n};\n\nexport const ModalUpdates: Story<ModalDemoProps> = (args: ModalDemoProps) => {\n interface ModalUpdatesProps {\n content: string;\n disableButton: boolean;\n heading: string;\n }\n\n const MyModal: FC<ModalUpdatesProps> = props => {\n const { ModalContext } = useContext(ModalManagerContext);\n const { update } = useContext(ModalContext);\n\n const actions = (\n <>\n <Button\n variant='primary'\n disabled={props.disableButton}\n onClick={() => {\n update({\n content: 'This Modal has been updated a second time from within the Modal!'\n });\n }}\n >\n Update Modal\n </Button>\n </>\n );\n\n return (\n <Modal\n heading={props.heading}\n actions={actions}\n autoWidth={args.autoWidth}\n center={args.center}\n stretch={args.stretch}\n >\n <Text>{props.content}</Text>\n </Modal>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n const modalMethods = useRef<ModalMethods<ModalUpdatesProps>>();\n\n const openModal = () => {\n modalMethods.current = create(MyModal, {\n heading: 'This is the Modal heading',\n content: 'This Modal will automatically update in a few seconds.',\n disableButton: true\n });\n\n setTimeout(() => {\n modalMethods.current?.update({\n heading: 'This is the updated Modal heading',\n content: 'This Modal has been updated from its parent!',\n disableButton: false\n });\n }, 2000);\n };\n\n return <Button onClick={openModal}>Open Modal</Button>;\n };\n\n return <ModalButton />;\n};\n\nexport const AlertModal: Story<ModalDemoProps> = (args: ModalDemoProps) => {\n const MyAlert = (props: { closeInitialModal: () => void }) => {\n const { ModalContext } = useContext(ModalManagerContext);\n const { dismiss } = useContext(ModalContext);\n\n const actions = useMemo(() => {\n return (\n <>\n <Button onClick={dismiss}>No</Button>\n <Button\n variant='primary'\n onClick={() => {\n dismiss();\n props.closeInitialModal();\n }}\n >\n Yes\n </Button>\n </>\n );\n }, [dismiss]);\n\n return (\n <Modal\n heading='You have unsaved changes!'\n actions={actions}\n center={args.center}\n stretch={args.stretch}\n >\n <Text>Are you sure you want to close without saving?</Text>\n </Modal>\n );\n };\n\n const MyModal = () => {\n const [name, setName] = useState('');\n const { ModalContext, create } = useContext(ModalManagerContext);\n const { dismiss } = useContext(ModalContext);\n\n const actions = useMemo(() => {\n return (\n <>\n <Button\n onClick={() => {\n if (name !== '') {\n create(MyAlert, { closeInitialModal: dismiss }, { alert: true });\n } else {\n dismiss();\n }\n }}\n >\n Close\n </Button>\n <Button variant='primary' onClick={dismiss} disabled={name === ''}>\n Save\n </Button>\n </>\n );\n }, [dismiss, name]);\n\n const onNameChange = (e: ChangeEvent<HTMLInputElement>) => {\n setName(e.target.value);\n };\n\n return (\n <Modal\n actions={actions}\n heading='Close the Modal without saving any data to invoke the alert'\n autoWidth={args.autoWidth}\n center={args.center}\n stretch={args.stretch}\n onRequestDismiss={() => {\n if (name !== '') {\n create(MyAlert, { closeInitialModal: dismiss }, { alert: true });\n return false;\n }\n }}\n >\n <Input label='Name' name='name' onChange={onNameChange} value={name} required />\n </Modal>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n\n return (\n <Button\n onClick={() => {\n create(MyModal);\n }}\n >\n Open Modal\n </Button>\n );\n };\n\n return <ModalButton />;\n};\n\nexport const ProgressState: Story = () => {\n const LoadingStateModal = () => {\n const { ModalContext } = useContext(ModalManagerContext);\n const { dismiss } = useContext(ModalContext);\n\n const [transientState, setTransientState] = useState<'loading' \| 'submitting' \| null>(\n 'loading'\n );\n\n const actions =\n transientState === 'loading' ? null : (\n <>\n <Button\n disabled={!!transientState}\n onClick={() => {\n if (transientState !== 'submitting') {\n dismiss();\n }\n }}\n >\n Cancel\n </Button>\n <Button\n disabled={!!transientState}\n variant='primary'\n onClick={() => {\n setTransientState('submitting');\n }}\n >\n Submit\n </Button>\n </>\n );\n\n useEffect(() => {\n let timerID: number;\n\n if (transientState === 'loading' \|\| transientState === 'submitting') {\n timerID = window.setTimeout(() => {\n if (transientState === 'loading') {\n setTransientState(null);\n } else {\n dismiss();\n }\n }, 3000);\n }\n\n return () => {\n window.clearTimeout(timerID);\n };\n }, [transientState]);\n\n return (\n <Modal\n progress={useMemo(() => {\n if (transientState) {\n return {\n message: `${cap(transientState)}…`\n };\n }\n }, [transientState])}\n heading='Modal progress demo'\n actions={actions}\n onRequestDismiss={() => transientState !== 'submitting'}\n >\n {transientState !== 'loading' && (\n <Flex container={{ direction: 'column', gap: 2 }}>\n {Array.from({ length: 5 }, (_, i) => (\n <Input key={i} label={`Field-${i + 1}`} />\n ))}\n </Flex>\n )}\n </Modal>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n\n return (\n <Button\n onClick={() => {\n create(LoadingStateModal);\n }}\n >\n Open Modal\n </Button>\n );\n };\n\n return <ModalButton />;\n};\n\nexport const MinimizableModal: Story<ModalDemoProps> = (args: ModalDemoProps) => {\n const [count, setCount] = useState(1);\n\n const MyModal = () => {\n return (\n <Modal\n heading={`Modal #${count}`}\n autoWidth={args.autoWidth}\n center={args.center}\n stretch={args.stretch}\n >\n <Text>This Modal can be minimized by clicking the minimize button above.</Text>\n </Modal>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n\n return (\n <Button\n onClick={() => {\n setCount(count + 1);\n create(MyModal, undefined, { minimizable: true });\n }}\n >\n Open Modal\n </Button>\n );\n };\n\n return <ModalButton />;\n};\n\nexport const DockedModal: Story = () => {\n const [count, setCount] = useState(1);\n\n const MyModal = () => {\n return (\n <Modal heading={`Modal #${count}`}>\n <Text>This Modal can be minimized by clicking the minimize button above.</Text>\n </Modal>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n\n return (\n <Button\n onClick={() => {\n setCount(count + 1);\n create(MyModal, undefined, {\n minimizable: true,\n maximizable: true,\n dockable: true\n });\n }}\n >\n Open Modal\n </Button>\n );\n };\n\n return <ModalButton />;\n};\n\nDockedModal.argTypes = {\n autoWidth: { table: { disable: true } },\n stretch: { table: { disable: true } },\n center: { table: { disable: true } }\n};\n\ninterface AutoWidthModalContentProps {\n autoWidth: boolean;\n content: ContentTypes;\n formColumnWidthFixed: boolean;\n stretch?: never;\n center?: never;\n}\n\nexport const AutoWidthModalContent: Story<AutoWidthModalContentProps> = (\n args: AutoWidthModalContentProps\n) => {\n const { push } = useContext(ToasterContext);\n\n const MyModal = ({ content }: { content: ReactNode }) => {\n const { ModalContext } = useContext(ModalManagerContext);\n const { dismiss } = useContext(ModalContext);\n\n return (\n <Modal\n heading={`Modal ${args.autoWidth ? 'with' : 'without'} autoWidth`}\n autoWidth={args.autoWidth}\n actions={\n args.content.includes('form') \|\| args.content === 'random' ? (\n <>\n <Button\n name='Cancel'\n variant='secondary'\n onClick={() => {\n dismiss();\n push({ content: 'Form cancelled!' });\n }}\n >\n Cancel\n </Button>\n <Button\n name='Submit'\n variant='primary'\n onClick={() => {\n dismiss();\n push({ content: 'Form submitted!' });\n }}\n >\n Submit\n </Button>\n </>\n ) : undefined\n }\n >\n {content}\n </Modal>\n );\n };\n\n const ModalButton = () => {\n const { create } = useContext(ModalManagerContext);\n\n return (\n <Button\n onClick={() => {\n create(MyModal, {\n content: getContent(args.content, args.formColumnWidthFixed)\n });\n }}\n >\n Open Modal\n </Button>\n );\n };\n\n return <ModalButton />;\n};\n\nAutoWidthModalContent.args = {\n autoWidth: true,\n content: 'short text',\n formColumnWidthFixed: false\n};\n\nAutoWidthModalContent.argTypes = {\n stretch: { table: { disable: true } },\n center: { table: { disable: true } },\n content: {\n options: [\n 'short text',\n 'long text',\n 'image',\n 'table',\n 'form (1 column)',\n 'form (2 column)',\n 'form (3 column)',\n 'random'\n ],\n control: { type: 'select' }\n },\n formColumnWidthFixed: { control: { type: 'boolean' } }\n};\n"]}

package/lib/core/MultiStep/MultiStep.stories.d.ts CHANGED Viewed

@@ -1,6 +1,5 @@
-/// <reference types="react" />
-import { Meta } from '@storybook/react';
+import { Meta, Story } from '@storybook/react';
 declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
-export declare const MultiStepDemo: () => JSX.Element;
+export declare const MultiStepDemo: Story;
 //# sourceMappingURL=MultiStep.stories.d.ts.map

package/lib/core/MultiStep/MultiStep.stories.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MultiStep.stories.d.ts","sourceRoot":"","sources":["../../../src/core/MultiStep/MultiStep.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;;~~AAKxC~~,wBAGU;AAEV,eAAO,MAAM,aAAa,~~mBAoEzB~~,CAAC"}
1	+ {"version":3,"file":"MultiStep.stories.d.ts","sourceRoot":"","sources":["../../../src/core/MultiStep/MultiStep.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAK/C,wBAGU;AAEV,eAAO,MAAM,aAAa,EAAE,KAoE3B,CAAC"}