@pega/cosmos-react-demos 4.0.0-dev.1.2 → 4.0.0-dev.10.1

package/jsx/work/Stages/Stages.mocks.jsx

@@ -1,17 +1,17 @@
 import { Link } from '@pega/cosmos-react-core';
 export const defaultStageNames = [
-    'Initial',
-    'Plan',
-    'Development',
-    'Accessibility',
-    'Review',
+    'Initiate',
+    'Identify customer',
+    'Eligibility',
+    'Intake',
+    'Process requests',
     'Merge'
 ];
 export const createStages = (stageNames, current) => {
     const now = new Date();
     return stageNames.map((stageName, i) => {
         const stageDate = new Date(now);
-        const completed = i + 1 < current;
+        const completed = i + 1 <= current;
         if (completed)
             stageDate.setDate(now.getDate() + i - current);
         return {

package/jsx/work/Stages/Stages.mocks.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"Stages.mocks.jsx","sourceRoot":"","sources":["../../../src/work/Stages/Stages.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE/C,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,SAAS;IACT,MAAM;IACN,aAAa;IACb,eAAe;IACf,QAAQ;IACR,OAAO;CACR,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,UAAoB,EAAE,OAAe,EAAE,EAAE;IACpE,MAAM,GAAG,GAAG,IAAI,IAAI,EAAE,CAAC;IACvB,OAAO,UAAU,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,CAAC,EAAE,EAAE;QACrC,MAAM,SAAS,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC;QAChC,MAAM,SAAS,GAAG,CAAC,GAAG,CAAC,GAAG,OAAO,CAAC;QAClC,IAAI,SAAS;YAAE,SAAS,CAAC,OAAO,CAAC,GAAG,CAAC,OAAO,EAAE,GAAG,CAAC,GAAG,OAAO,CAAC,CAAC;QAC9D,OAAO;YACL,IAAI,EAAE,SAAS;YACf,EAAE,EAAE,SAAS,CAAC,GAAG,CAAC,EAAE;YACpB,IAAI,EAAE,SAAS,IAAI,CAAC,GAAG,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;YAC5D,SAAS;SACV,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,iBAAyB,EAAE,UAAkB,EAAE,EAAE;IACxE,OAAO;QACL,YAAY;QACZ,2EAA2E;QAC3E,CAAC,IAAI,CAAC,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAAC,QAAQ,CAC/C;;IACF,EAAE,IAAI,CAAC;KACR,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE;QAChB,OAAO;YACL,IAAI,EAAE,IAAI;YACV,SAAS,EAAE,UAAU,GAAG,iBAAiB,IAAI,CAAC,UAAU,KAAK,iBAAiB,IAAI,CAAC,KAAK,CAAC,CAAC;YAC1F,EAAE,EAAE,QAAQ,CAAC,GAAG,CAAC,EAAE;SACpB,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC,CAAC","sourcesContent":["import { Link } from '@pega/cosmos-react-core';\n\nexport const defaultStageNames = [\n  'Initial',\n  'Plan',\n  'Development',\n  'Accessibility',\n  'Review',\n  'Merge'\n];\n\nexport const createStages = (stageNames: string[], current: number) => {\n  const now = new Date();\n  return stageNames.map((stageName, i) => {\n    const stageDate = new Date(now);\n    const completed = i + 1 < current;\n    if (completed) stageDate.setDate(now.getDate() + i - current);\n    return {\n      name: stageName,\n      id: `stage-${i + 1}`,\n      date: completed || i + 1 === current ? stageDate : undefined,\n      completed\n    };\n  });\n};\n\nexport const getSteps = (currentStageIndex: number, stageIndex: number) => {\n  return [\n    'First step',\n    'Second step that contains much more text to demonstrate overflow handling',\n    <Link href='https://www.pega.com' target='_blank'>\n      Steps can be links as well\n    </Link>\n  ].map((step, i) => {\n    return {\n      name: step,\n      completed: stageIndex < currentStageIndex || (stageIndex === currentStageIndex && i === 0),\n      id: `step-${i + 1}`\n    };\n  });\n};\n"]}
+{"version":3,"file":"Stages.mocks.jsx","sourceRoot":"","sources":["../../../src/work/Stages/Stages.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE/C,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,UAAU;IACV,mBAAmB;IACnB,aAAa;IACb,QAAQ;IACR,kBAAkB;IAClB,OAAO;CACR,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,UAAoB,EAAE,OAAe,EAAE,EAAE;IACpE,MAAM,GAAG,GAAG,IAAI,IAAI,EAAE,CAAC;IACvB,OAAO,UAAU,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,CAAC,EAAE,EAAE;QACrC,MAAM,SAAS,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC;QAChC,MAAM,SAAS,GAAG,CAAC,GAAG,CAAC,IAAI,OAAO,CAAC;QACnC,IAAI,SAAS;YAAE,SAAS,CAAC,OAAO,CAAC,GAAG,CAAC,OAAO,EAAE,GAAG,CAAC,GAAG,OAAO,CAAC,CAAC;QAC9D,OAAO;YACL,IAAI,EAAE,SAAS;YACf,EAAE,EAAE,SAAS,CAAC,GAAG,CAAC,EAAE;YACpB,IAAI,EAAE,SAAS,IAAI,CAAC,GAAG,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;YAC5D,SAAS;SACV,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,iBAAyB,EAAE,UAAkB,EAAE,EAAE;IACxE,OAAO;QACL,YAAY;QACZ,2EAA2E;QAC3E,CAAC,IAAI,CAAC,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAAC,QAAQ,CAC/C;;IACF,EAAE,IAAI,CAAC;KACR,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE;QAChB,OAAO;YACL,IAAI,EAAE,IAAI;YACV,SAAS,EAAE,UAAU,GAAG,iBAAiB,IAAI,CAAC,UAAU,KAAK,iBAAiB,IAAI,CAAC,KAAK,CAAC,CAAC;YAC1F,EAAE,EAAE,QAAQ,CAAC,GAAG,CAAC,EAAE;SACpB,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC,CAAC","sourcesContent":["import { Link } from '@pega/cosmos-react-core';\n\nexport const defaultStageNames = [\n  'Initiate',\n  'Identify customer',\n  'Eligibility',\n  'Intake',\n  'Process requests',\n  'Merge'\n];\n\nexport const createStages = (stageNames: string[], current: number) => {\n  const now = new Date();\n  return stageNames.map((stageName, i) => {\n    const stageDate = new Date(now);\n    const completed = i + 1 <= current;\n    if (completed) stageDate.setDate(now.getDate() + i - current);\n    return {\n      name: stageName,\n      id: `stage-${i + 1}`,\n      date: completed || i + 1 === current ? stageDate : undefined,\n      completed\n    };\n  });\n};\n\nexport const getSteps = (currentStageIndex: number, stageIndex: number) => {\n  return [\n    'First step',\n    'Second step that contains much more text to demonstrate overflow handling',\n    <Link href='https://www.pega.com' target='_blank'>\n      Steps can be links as well\n    </Link>\n  ].map((step, i) => {\n    return {\n      name: step,\n      completed: stageIndex < currentStageIndex || (stageIndex === currentStageIndex && i === 0),\n      id: `step-${i + 1}`\n    };\n  });\n};\n"]}

package/jsx/work/Stages/Stages.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Stages.stories.d.ts","sourceRoot":"","sources":["../../../src/work/Stages/Stages.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAU,WAAW,EAAE,MAAM,yBAAyB,CAAC;;AAI9D,wBAMU;AAEV,UAAU,gBAAgB;IACxB,SAAS,CAAC,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IACrC,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,gBAAgB,CAyB9C,CAAC"}
+{"version":3,"file":"Stages.stories.d.ts","sourceRoot":"","sources":["../../../src/work/Stages/Stages.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAU,WAAW,EAAE,MAAM,yBAAyB,CAAC;;AAI9D,wBAMU;AAEV,UAAU,gBAAgB;IACxB,SAAS,CAAC,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IACrC,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,gBAAgB,CAoC9C,CAAC"}

package/jsx/work/Stages/Stages.stories.jsx

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import { Stages } from '@pega/cosmos-react-work';
 import { defaultStageNames as stageNames, createStages, getSteps } from './Stages.mocks';
 export default {
@@ -10,14 +10,28 @@ export default {
 };
 export const StagesDemo = (args) => {
     const [stages, setStages] = useState(createStages(args.stageNames ?? stageNames, args.currentStage ?? 0));
+    const timerRef = useRef();
+    const mountedRef = useRef(false);
+    useEffect(() => {
+        mountedRef.current = true;
+        return () => {
+            mountedRef.current = false;
+        };
+    }, []);
     return (<Stages stages={stages} current={`stage-${args.currentStage}`} caseTitle={args.caseTitle} onLoadStage={ids => {
-            setTimeout(() => setStages(prevStages => {
-                return prevStages.map((stage, i) => {
-                    return ids.includes(stage.id)
-                        ? { ...stage, steps: getSteps((args.currentStage || 0) - 1, i) }
-                        : stage;
-                });
-            }), 1500);
+            if (timerRef.current)
+                clearTimeout(timerRef.current);
+            timerRef.current = setTimeout(() => {
+                if (mountedRef.current) {
+                    setStages(prevStages => {
+                        return prevStages.map((stage, i) => {
+                            return ids.includes(stage.id)
+                                ? { ...stage, steps: getSteps((args.currentStage ?? 0) - 1, i) }
+                                : stage;
+                        });
+                    });
+                }
+            }, 1500);
         }}/>);
 };
 StagesDemo.args = {

package/jsx/work/Stages/Stages.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"Stages.stories.jsx","sourceRoot":"","sources":["../../../src/work/Stages/Stages.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,MAAM,EAAe,MAAM,yBAAyB,CAAC;AAE9D,OAAO,EAAE,iBAAiB,IAAI,UAAU,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAEzF,eAAe;IACb,KAAK,EAAE,aAAa;IACpB,SAAS,EAAE,MAAM;IACjB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;KACnB;CACM,CAAC;AAQV,MAAM,CAAC,MAAM,UAAU,GAA4B,CAAC,IAAsB,EAAE,EAAE;IAC5E,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAClC,YAAY,CAAC,IAAI,CAAC,UAAU,IAAI,UAAU,EAAE,IAAI,CAAC,YAAY,IAAI,CAAC,CAAC,CACpE,CAAC;IAEF,OAAO,CACL,CAAC,MAAM,CACL,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,OAAO,CAAC,CAAC,SAAS,IAAI,CAAC,YAAY,EAAE,CAAC,CACtC,SAAS,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAC1B,WAAW,CAAC,CAAC,GAAG,CAAC,EAAE;YACjB,UAAU,CACR,GAAG,EAAE,CACH,SAAS,CAAC,UAAU,CAAC,EAAE;gBACrB,OAAO,UAAU,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;oBACjC,OAAO,GAAG,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC;wBAC3B,CAAC,CAAC,EAAE,GAAG,KAAK,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,EAAE;wBAChE,CAAC,CAAC,KAAK,CAAC;gBACZ,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,EACJ,IAAI,CACL,CAAC;QACJ,CAAC,CAAC,EACF,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,UAAU,CAAC,IAAI,GAAG;IAChB,SAAS,EAAE,MAAM;IACjB,YAAY,EAAE,CAAC;CAChB,CAAC;AAEF,UAAU,CAAC,QAAQ,GAAG;IACpB,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACxC,YAAY,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;CAC9C,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState } from 'react';\n\nimport { Stages, StagesProps } from '@pega/cosmos-react-work';\n\nimport { defaultStageNames as stageNames, createStages, getSteps } from './Stages.mocks';\n\nexport default {\n  title: 'Work/Stages',\n  component: Stages,\n  parameters: {\n    layout: 'centered'\n  }\n} as Meta;\n\ninterface StagesStoryProps {\n  caseTitle?: StagesProps['caseTitle'];\n  stageNames?: string[];\n  currentStage?: number;\n}\n\nexport const StagesDemo: Story<StagesStoryProps> = (args: StagesStoryProps) => {\n  const [stages, setStages] = useState(\n    createStages(args.stageNames ?? stageNames, args.currentStage ?? 0)\n  );\n\n  return (\n    <Stages\n      stages={stages}\n      current={`stage-${args.currentStage}`}\n      caseTitle={args.caseTitle}\n      onLoadStage={ids => {\n        setTimeout(\n          () =>\n            setStages(prevStages => {\n              return prevStages.map((stage, i) => {\n                return ids.includes(stage.id)\n                  ? { ...stage, steps: getSteps((args.currentStage || 0) - 1, i) }\n                  : stage;\n              });\n            }),\n          1500\n        );\n      }}\n    />\n  );\n};\n\nStagesDemo.args = {\n  caseTitle: 'Demo',\n  currentStage: 3\n};\n\nStagesDemo.argTypes = {\n  caseTitle: { control: { type: 'text' } },\n  currentStage: { control: { type: 'number' } }\n};\n"]}
+{"version":3,"file":"Stages.stories.jsx","sourceRoot":"","sources":["../../../src/work/Stages/Stages.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,MAAM,EAAe,MAAM,yBAAyB,CAAC;AAE9D,OAAO,EAAE,iBAAiB,IAAI,UAAU,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAEzF,eAAe;IACb,KAAK,EAAE,aAAa;IACpB,SAAS,EAAE,MAAM;IACjB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;KACnB;CACM,CAAC;AAQV,MAAM,CAAC,MAAM,UAAU,GAA4B,CAAC,IAAsB,EAAE,EAAE;IAC5E,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAClC,YAAY,CAAC,IAAI,CAAC,UAAU,IAAI,UAAU,EAAE,IAAI,CAAC,YAAY,IAAI,CAAC,CAAC,CACpE,CAAC;IAEF,MAAM,QAAQ,GAAG,MAAM,EAAiC,CAAC;IAEzD,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IACjC,SAAS,CAAC,GAAG,EAAE;QACb,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC;QAC1B,OAAO,GAAG,EAAE;YACV,UAAU,CAAC,OAAO,GAAG,KAAK,CAAC;QAC7B,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,CAAC,MAAM,CACL,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,OAAO,CAAC,CAAC,SAAS,IAAI,CAAC,YAAY,EAAE,CAAC,CACtC,SAAS,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAC1B,WAAW,CAAC,CAAC,GAAG,CAAC,EAAE;YACjB,IAAI,QAAQ,CAAC,OAAO;gBAAE,YAAY,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;YACrD,QAAQ,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;gBACjC,IAAI,UAAU,CAAC,OAAO,EAAE;oBACtB,SAAS,CAAC,UAAU,CAAC,EAAE;wBACrB,OAAO,UAAU,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;4BACjC,OAAO,GAAG,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC;gCAC3B,CAAC,CAAC,EAAE,GAAG,KAAK,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,IAAI,CAAC,YAAY,IAAI,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,EAAE;gCAChE,CAAC,CAAC,KAAK,CAAC;wBACZ,CAAC,CAAC,CAAC;oBACL,CAAC,CAAC,CAAC;iBACJ;YACH,CAAC,EAAE,IAAI,CAAC,CAAC;QACX,CAAC,CAAC,EACF,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,UAAU,CAAC,IAAI,GAAG;IAChB,SAAS,EAAE,MAAM;IACjB,YAAY,EAAE,CAAC;CAChB,CAAC;AAEF,UAAU,CAAC,QAAQ,GAAG;IACpB,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACxC,YAAY,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;CAC9C,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useEffect, useRef, useState } from 'react';\n\nimport { Stages, StagesProps } from '@pega/cosmos-react-work';\n\nimport { defaultStageNames as stageNames, createStages, getSteps } from './Stages.mocks';\n\nexport default {\n  title: 'Work/Stages',\n  component: Stages,\n  parameters: {\n    layout: 'centered'\n  }\n} as Meta;\n\ninterface StagesStoryProps {\n  caseTitle?: StagesProps['caseTitle'];\n  stageNames?: string[];\n  currentStage?: number;\n}\n\nexport const StagesDemo: Story<StagesStoryProps> = (args: StagesStoryProps) => {\n  const [stages, setStages] = useState(\n    createStages(args.stageNames ?? stageNames, args.currentStage ?? 0)\n  );\n\n  const timerRef = useRef<ReturnType<typeof setTimeout>>();\n\n  const mountedRef = useRef(false);\n  useEffect(() => {\n    mountedRef.current = true;\n    return () => {\n      mountedRef.current = false;\n    };\n  }, []);\n\n  return (\n    <Stages\n      stages={stages}\n      current={`stage-${args.currentStage}`}\n      caseTitle={args.caseTitle}\n      onLoadStage={ids => {\n        if (timerRef.current) clearTimeout(timerRef.current);\n        timerRef.current = setTimeout(() => {\n          if (mountedRef.current) {\n            setStages(prevStages => {\n              return prevStages.map((stage, i) => {\n                return ids.includes(stage.id)\n                  ? { ...stage, steps: getSteps((args.currentStage ?? 0) - 1, i) }\n                  : stage;\n              });\n            });\n          }\n        }, 1500);\n      }}\n    />\n  );\n};\n\nStagesDemo.args = {\n  caseTitle: 'Demo',\n  currentStage: 3\n};\n\nStagesDemo.argTypes = {\n  caseTitle: { control: { type: 'text' } },\n  currentStage: { control: { type: 'number' } }\n};\n"]}

package/jsx/work/Tasks/Tasks.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tasks.stories.d.ts","sourceRoot":"","sources":["../../../src/work/Tasks/Tasks.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AA0B/C,OAAO,EAAS,UAAU,EAAiB,MAAM,yBAAyB,CAAC;;AAE3E,wBAGU;AAEV,UAAU,eAAe;IACvB,UAAU,CAAC,EAAE,UAAU,CAAC,YAAY,CAAC,CAAC;IACtC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,eAAe,CA2I5C,CAAC"}
+{"version":3,"file":"Tasks.stories.d.ts","sourceRoot":"","sources":["../../../src/work/Tasks/Tasks.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AA2B/C,OAAO,EAAS,UAAU,EAAiB,MAAM,yBAAyB,CAAC;;AAE3E,wBAGU;AAEV,UAAU,eAAe;IACvB,UAAU,CAAC,EAAE,UAAU,CAAC,YAAY,CAAC,CAAC;IACtC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,eAAe,CA6I5C,CAAC"}

package/jsx/work/Tasks/Tasks.stories.jsx

@@ -1,5 +1,5 @@
 import { useMemo, useState } from 'react';
-import { Avatar, Button, MenuButton, MetaList, Text, Form, Input, TextArea, RadioCheckGroup, RadioButton, Checkbox, DateInput, NumberInput, FileInput, menuHelpers, Status, Link, DateTimeDisplay, EmptyState } from '@pega/cosmos-react-core';
+import { Avatar, Button, MenuButton, MetaList, Text, Form, Input, TextArea, RadioCheckGroup, RadioButton, Checkbox, DateInput, NumberInput, FileInput, menuHelpers, Status, Link, DateTimeDisplay, EmptyState, Flex } from '@pega/cosmos-react-core';
 import { Tasks } from '@pega/cosmos-react-work';
 export default {
     title: 'Work/Tasks',
@@ -15,18 +15,20 @@ export const TasksDemo = (args) => {
               Submit
             </Button>
           </>}>
-        <Input label='Text field 1' required/>
-        <Input label='Text field 2'/>
-        <NumberInput onChange={() => { }} label='Number field'/>
-        <Checkbox label='Boolean field' required/>
-        <RadioCheckGroup label='Picklist options' name='picklist-1'>
-          <RadioButton label='option 1' defaultChecked/>
-          <RadioButton label='option 2'/>
-          <RadioButton label='option 3'/>
-        </RadioCheckGroup>
-        <TextArea label='Text paragraph field' required/>
-        <FileInput label='File field'/>
-        <DateInput label='Datetime field'/>
+        <Flex container={{ direction: 'column', itemGap: 2 }}>
+          <Input label='Text field 1' required/>
+          <Input label='Text field 2'/>
+          <NumberInput onChange={() => { }} label='Number field'/>
+          <Checkbox label='Boolean field' required/>
+          <RadioCheckGroup label='Picklist options' name='picklist-1'>
+            <RadioButton label='option 1' defaultChecked/>
+            <RadioButton label='option 2'/>
+            <RadioButton label='option 3'/>
+          </RadioCheckGroup>
+          <TextArea label='Text paragraph field' required/>
+          <FileInput label='File field'/>
+          <DateInput label='Datetime field'/>
+        </Flex>
       </Form>);
     };
     const [workGroups, setWorkGroups] = useState(() => {

package/jsx/work/Tasks/Tasks.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"Tasks.stories.jsx","sourceRoot":"","sources":["../../../src/work/Tasks/Tasks.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useMemo, useState } from 'react';\n\nimport {\n  Avatar,\n  Button,\n  MenuButton,\n  MenuProps,\n  MetaList,\n  Text,\n  Form,\n  Input,\n  TextArea,\n  RadioCheckGroup,\n  RadioButton,\n  Checkbox,\n  DateInput,\n  NumberInput,\n  FileInput,\n  menuHelpers,\n  Status,\n  Link,\n  DateTimeDisplay,\n  StatusProps,\n  EmptyState\n} from '@pega/cosmos-react-core';\nimport { Tasks, TasksProps, TaskItemProps } from '@pega/cosmos-react-work';\n\nexport default {\n  title: 'Work/Tasks',\n  component: Tasks\n} as Meta;\n\ninterface TasksStoryProps {\n  headerText?: TasksProps['headerText'];\n  showHeaderVisual?: boolean;\n  showHeaderSecondary?: boolean;\n  count?: TasksProps['count'];\n  openableTasks?: boolean;\n}\n\nexport const TasksDemo: Story<TasksStoryProps> = (args: TasksStoryProps) => {\n  const [isLimited, setIsLimited] = useState(true);\n  const [hasOpenTask, setHasOpenTask] = useState(false);\n\n  const DemoTaskForm = ({ onSubmit, onCancel }: { onSubmit: () => void; onCancel: () => void }) => {\n    return (\n      <Form\n        actions={\n          <>\n            <Button onClick={onCancel}>Cancel</Button>\n            <Button variant='primary' onClick={onSubmit}>\n              Submit\n            </Button>\n          </>\n        }\n      >\n        <Input label='Text field 1' required />\n        <Input label='Text field 2' />\n        <NumberInput onChange={() => {}} label='Number field' />\n        <Checkbox label='Boolean field' required />\n        <RadioCheckGroup label='Picklist options' name='picklist-1'>\n          <RadioButton label='option 1' defaultChecked />\n          <RadioButton label='option 2' />\n          <RadioButton label='option 3' />\n        </RadioCheckGroup>\n        <TextArea label='Text paragraph field' required />\n        <FileInput label='File field' />\n        <DateInput label='Datetime field' />\n      </Form>\n    );\n  };\n\n  const [workGroups, setWorkGroups] = useState<MenuProps['items']>(() => {\n    return Array.from({ length: 10 }, (_, i) => {\n      return {\n        id: `${i + 1}`,\n        primary: `Workgroup ${i + 1}`,\n        count: typeof args.count === 'number' ? args.count : Math.floor(Math.random() * 10),\n        selected: i === 0,\n        visual: <Avatar size='l' name={`Team ${i + 1}`} />\n      };\n    });\n  });\n\n  const activeGroup = useMemo(() => menuHelpers.getSelected(workGroups)[0], [workGroups]);\n  const activeGroupTaskCount = activeGroup?.count ?? 0;\n\n  const groupSelection = useMemo(() => {\n    return (\n      <MenuButton\n        variant='text'\n        text={activeGroup.primary}\n        menu={{\n          mode: 'single-select',\n          items: workGroups,\n          onItemClick: id => {\n            setWorkGroups(currentWorkGroups => {\n              return menuHelpers.mapTree(currentWorkGroups, group => {\n                if (id === group.id || group.selected) {\n                  return { ...group, selected: id === group.id };\n                }\n\n                return group;\n              });\n            });\n          }\n        }}\n      />\n    );\n  }, [activeGroup.primary, workGroups]);\n\n  const taskArray: TaskItemProps[] = useMemo(\n    () =>\n      Array.from(\n        { length: isLimited ? Math.min(3, activeGroupTaskCount) : activeGroupTaskCount },\n        (_, i) => {\n          const dueIn = 86400000 * i;\n          let status: StatusProps['variant'] = 'info';\n\n          if (i === 0) {\n            status = 'urgent';\n          } else if (i === 1) {\n            status = 'warn';\n          }\n\n          return {\n            id: `${i}`,\n            name: `Task ${i + 1}`,\n            processName: i % 2 ? 'Demo process' : undefined,\n            meta: (\n              <MetaList\n                items={[\n                  <Status variant={status}>{status}</Status>,\n                  <Text variant='secondary'>\n                    Due <DateTimeDisplay variant='relative' value={Date.now() + dueIn} />\n                  </Text>,\n                  <Link href='#demo'>Parent case link</Link>\n                ]}\n              />\n            ),\n            onOpen:\n              args.openableTasks !== false\n                ? () => {\n                    setHasOpenTask(true);\n                  }\n                : undefined,\n            content: hasOpenTask ? (\n              <DemoTaskForm\n                onSubmit={() => {\n                  setHasOpenTask(false);\n                }}\n                onCancel={() => {\n                  setHasOpenTask(false);\n                }}\n              />\n            ) : null\n          };\n        }\n      ),\n    [isLimited, activeGroupTaskCount, args.openableTasks, hasOpenTask]\n  );\n\n  return (\n    <Tasks\n      headerText={args.headerText || 'Tasks'}\n      count={activeGroupTaskCount}\n      items={taskArray}\n      headerVisual={\n        args.showHeaderVisual && activeGroup ? (\n          <Avatar size='l' name={activeGroup.primary} />\n        ) : undefined\n      }\n      headerSecondary={args.showHeaderSecondary ? groupSelection : undefined}\n      emptyPlaceholder={<EmptyState />}\n      onExpandToggle={() => {\n        setIsLimited(cur => !cur);\n      }}\n    />\n  );\n};\n\nTasksDemo.args = {\n  headerText: 'Tasks',\n  showHeaderVisual: true,\n  showHeaderSecondary: true,\n  count: undefined,\n  openableTasks: true\n};\n\nTasksDemo.argTypes = {\n  headerText: { control: { type: 'text' } },\n  showHeaderVisual: { control: { type: 'boolean' } },\n  showHeaderSecondary: { control: { type: 'boolean' } },\n  count: { control: { type: 'number' } },\n  openableTasks: { control: { type: 'boolean' } }\n};\n"]}
+{"version":3,"file":"Tasks.stories.jsx","sourceRoot":"","sources":["../../../src/work/Tasks/Tasks.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useMemo, useState } from 'react';\n\nimport {\n  Avatar,\n  Button,\n  MenuButton,\n  MenuProps,\n  MetaList,\n  Text,\n  Form,\n  Input,\n  TextArea,\n  RadioCheckGroup,\n  RadioButton,\n  Checkbox,\n  DateInput,\n  NumberInput,\n  FileInput,\n  menuHelpers,\n  Status,\n  Link,\n  DateTimeDisplay,\n  StatusProps,\n  EmptyState,\n  Flex\n} from '@pega/cosmos-react-core';\nimport { Tasks, TasksProps, TaskItemProps } from '@pega/cosmos-react-work';\n\nexport default {\n  title: 'Work/Tasks',\n  component: Tasks\n} as Meta;\n\ninterface TasksStoryProps {\n  headerText?: TasksProps['headerText'];\n  showHeaderVisual?: boolean;\n  showHeaderSecondary?: boolean;\n  count?: TasksProps['count'];\n  openableTasks?: boolean;\n}\n\nexport const TasksDemo: Story<TasksStoryProps> = (args: TasksStoryProps) => {\n  const [isLimited, setIsLimited] = useState(true);\n  const [hasOpenTask, setHasOpenTask] = useState(false);\n\n  const DemoTaskForm = ({ onSubmit, onCancel }: { onSubmit: () => void; onCancel: () => void }) => {\n    return (\n      <Form\n        actions={\n          <>\n            <Button onClick={onCancel}>Cancel</Button>\n            <Button variant='primary' onClick={onSubmit}>\n              Submit\n            </Button>\n          </>\n        }\n      >\n        <Flex container={{ direction: 'column', itemGap: 2 }}>\n          <Input label='Text field 1' required />\n          <Input label='Text field 2' />\n          <NumberInput onChange={() => {}} label='Number field' />\n          <Checkbox label='Boolean field' required />\n          <RadioCheckGroup label='Picklist options' name='picklist-1'>\n            <RadioButton label='option 1' defaultChecked />\n            <RadioButton label='option 2' />\n            <RadioButton label='option 3' />\n          </RadioCheckGroup>\n          <TextArea label='Text paragraph field' required />\n          <FileInput label='File field' />\n          <DateInput label='Datetime field' />\n        </Flex>\n      </Form>\n    );\n  };\n\n  const [workGroups, setWorkGroups] = useState<MenuProps['items']>(() => {\n    return Array.from({ length: 10 }, (_, i) => {\n      return {\n        id: `${i + 1}`,\n        primary: `Workgroup ${i + 1}`,\n        count: typeof args.count === 'number' ? args.count : Math.floor(Math.random() * 10),\n        selected: i === 0,\n        visual: <Avatar size='l' name={`Team ${i + 1}`} />\n      };\n    });\n  });\n\n  const activeGroup = useMemo(() => menuHelpers.getSelected(workGroups)[0], [workGroups]);\n  const activeGroupTaskCount = activeGroup?.count ?? 0;\n\n  const groupSelection = useMemo(() => {\n    return (\n      <MenuButton\n        variant='text'\n        text={activeGroup.primary}\n        menu={{\n          mode: 'single-select',\n          items: workGroups,\n          onItemClick: id => {\n            setWorkGroups(currentWorkGroups => {\n              return menuHelpers.mapTree(currentWorkGroups, group => {\n                if (id === group.id || group.selected) {\n                  return { ...group, selected: id === group.id };\n                }\n\n                return group;\n              });\n            });\n          }\n        }}\n      />\n    );\n  }, [activeGroup.primary, workGroups]);\n\n  const taskArray: TaskItemProps[] = useMemo(\n    () =>\n      Array.from(\n        { length: isLimited ? Math.min(3, activeGroupTaskCount) : activeGroupTaskCount },\n        (_, i) => {\n          const dueIn = 86400000 * i;\n          let status: StatusProps['variant'] = 'info';\n\n          if (i === 0) {\n            status = 'urgent';\n          } else if (i === 1) {\n            status = 'warn';\n          }\n\n          return {\n            id: `${i}`,\n            name: `Task ${i + 1}`,\n            processName: i % 2 ? 'Demo process' : undefined,\n            meta: (\n              <MetaList\n                items={[\n                  <Status variant={status}>{status}</Status>,\n                  <Text variant='secondary'>\n                    Due <DateTimeDisplay variant='relative' value={Date.now() + dueIn} />\n                  </Text>,\n                  <Link href='#demo'>Parent case link</Link>\n                ]}\n              />\n            ),\n            onOpen:\n              args.openableTasks !== false\n                ? () => {\n                    setHasOpenTask(true);\n                  }\n                : undefined,\n            content: hasOpenTask ? (\n              <DemoTaskForm\n                onSubmit={() => {\n                  setHasOpenTask(false);\n                }}\n                onCancel={() => {\n                  setHasOpenTask(false);\n                }}\n              />\n            ) : null\n          };\n        }\n      ),\n    [isLimited, activeGroupTaskCount, args.openableTasks, hasOpenTask]\n  );\n\n  return (\n    <Tasks\n      headerText={args.headerText || 'Tasks'}\n      count={activeGroupTaskCount}\n      items={taskArray}\n      headerVisual={\n        args.showHeaderVisual && activeGroup ? (\n          <Avatar size='l' name={activeGroup.primary} />\n        ) : undefined\n      }\n      headerSecondary={args.showHeaderSecondary ? groupSelection : undefined}\n      emptyPlaceholder={<EmptyState />}\n      onExpandToggle={() => {\n        setIsLimited(cur => !cur);\n      }}\n    />\n  );\n};\n\nTasksDemo.args = {\n  headerText: 'Tasks',\n  showHeaderVisual: true,\n  showHeaderSecondary: true,\n  count: undefined,\n  openableTasks: true\n};\n\nTasksDemo.argTypes = {\n  headerText: { control: { type: 'text' } },\n  showHeaderVisual: { control: { type: 'boolean' } },\n  showHeaderSecondary: { control: { type: 'boolean' } },\n  count: { control: { type: 'number' } },\n  openableTasks: { control: { type: 'boolean' } }\n};\n"]}

package/jsx/work/Timeline/Timeline.stories.jsx

@@ -58,7 +58,7 @@ export const TimelineToolbarDemo = () => {
     }, []);
     return (<Card>
       <CardHeader>
-        <TimelineToolbar heading='Timeline Demo' search={{ onSearchSubmit, onSearchChange, value: searchValue }} count={{ total: items.length }} sort={{
+        <TimelineToolbar name='Timeline Demo' search={{ onSearchSubmit, onSearchChange, value: searchValue }} count={{ total: items.length }} sort={{
             selected: sortOrder,
             onItemClick: (id) => {
                 setSortOrder(id);

package/jsx/work/Timeline/Timeline.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"Timeline.stories.jsx","sourceRoot":"","sources":["../../../src/work/Timeline/Timeline.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useCallback, useEffect, useState } from 'react';\n\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n  OmitStrict,\n  SearchInputProps\n} from '@pega/cosmos-react-core';\nimport { Timeline, TimelineProps, TimelineToolbar } from '@pega/cosmos-react-work';\nimport {\n  TimelineGroupBy,\n  TimelineSortOrder\n} from '@pega/cosmos-react-work/lib/components/Timeline/Timeline.types';\n\nimport { activity } from './Timeline.mocks';\n\nexport default {\n  title: 'Work/Timeline',\n  component: Timeline\n} as Meta;\n\ninterface TimelineDemoStoryProps extends TimelineProps {\n  lazyLoading?: boolean;\n}\n\nexport const TimelineDemo: Story<OmitStrict<TimelineDemoStoryProps, 'activity' | 'currentTime'>> = (\n  args: OmitStrict<TimelineDemoStoryProps, 'activity' | 'currentTime'>\n) => {\n  const INITIAL_CHUNK_SIZE = 7;\n  const APPEND_CHUNK_SIZE = 3;\n\n  const [loading, setLoading] = useState(false);\n  const [hasMore, setHasMore] = useState(true);\n  const [items, setItems] = useState<TimelineProps['activity']>([]);\n\n  useEffect(() => {\n    const newItems = args.lazyLoading ? () => activity.slice(0, INITIAL_CHUNK_SIZE) : activity;\n    setHasMore(newItems.length < activity.length);\n    setItems(newItems);\n  }, [args.lazyLoading]);\n\n  const loadMore = useCallback(() => {\n    if (!loading) {\n      setLoading(true);\n      setTimeout(() => {\n        setLoading(false);\n\n        setItems(prevItems => {\n          const previousItemsLength = prevItems.length;\n          const newItems = activity.slice(\n            previousItemsLength,\n            previousItemsLength + APPEND_CHUNK_SIZE\n          );\n\n          if (newItems.length === 0) {\n            setHasMore(false);\n          }\n\n          return [...prevItems, ...newItems];\n        });\n      }, 2000);\n    }\n  }, [loading]);\n\n  return (\n    <Timeline\n      activity={items}\n      currentTime={new Date()}\n      sortOrder={args.sortOrder}\n      groupBy={args.groupBy}\n      loading={loading}\n      loadMore={hasMore ? loadMore : undefined}\n    />\n  );\n};\n\nTimelineDemo.args = {\n  sortOrder: 'descending',\n  groupBy: 'date',\n  lazyLoading: false\n};\n\nTimelineDemo.argTypes = {\n  sortOrder: { options: ['ascending', 'descending'], control: { type: 'select' } },\n  groupBy: {\n    options: ['date', 'monthyear', 'quarteryear', 'year', 'none'],\n    control: { type: 'select' }\n  },\n  lazyLoading: { control: { type: 'boolean' } }\n};\n\nexport const TimelineToolbarDemo: Story = () => {\n  const [sortOrder, setSortOrder] = useState<TimelineSortOrder>();\n  const [groupBy, setGroupBy] = useState<TimelineGroupBy>();\n  const [items, setItems] = useState<TimelineProps['activity']>(activity);\n  const [searchValue, onSearchChange] = useState<SearchInputProps['value']>('');\n\n  const onSearchSubmit = useCallback((value: string) => {\n    setItems(activity.filter(item => JSON.stringify(item.title).includes(value)));\n  }, []);\n\n  return (\n    <Card>\n      <CardHeader>\n        <TimelineToolbar\n          heading='Timeline Demo'\n          search={{ onSearchSubmit, onSearchChange, value: searchValue }}\n          count={{ total: items.length }}\n          sort={{\n            selected: sortOrder,\n            onItemClick: (id: TimelineProps['sortOrder']) => {\n              setSortOrder(id);\n            }\n          }}\n          group={{\n            selected: groupBy,\n            onItemClick: (id: TimelineProps['groupBy']) => {\n              setGroupBy(id);\n            }\n          }}\n        />\n      </CardHeader>\n      <CardContent>\n        <Timeline\n          activity={items}\n          currentTime={new Date()}\n          sortOrder={sortOrder}\n          groupBy={groupBy}\n        />\n      </CardContent>\n    </Card>\n  );\n};\n"]}
+{"version":3,"file":"Timeline.stories.jsx","sourceRoot":"","sources":["../../../src/work/Timeline/Timeline.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useCallback, useEffect, useState } from 'react';\n\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n  OmitStrict,\n  SearchInputProps\n} from '@pega/cosmos-react-core';\nimport { Timeline, TimelineProps, TimelineToolbar } from '@pega/cosmos-react-work';\nimport {\n  TimelineGroupBy,\n  TimelineSortOrder\n} from '@pega/cosmos-react-work/lib/components/Timeline/Timeline.types';\n\nimport { activity } from './Timeline.mocks';\n\nexport default {\n  title: 'Work/Timeline',\n  component: Timeline\n} as Meta;\n\ninterface TimelineDemoStoryProps extends TimelineProps {\n  lazyLoading?: boolean;\n}\n\nexport const TimelineDemo: Story<OmitStrict<TimelineDemoStoryProps, 'activity' | 'currentTime'>> = (\n  args: OmitStrict<TimelineDemoStoryProps, 'activity' | 'currentTime'>\n) => {\n  const INITIAL_CHUNK_SIZE = 7;\n  const APPEND_CHUNK_SIZE = 3;\n\n  const [loading, setLoading] = useState(false);\n  const [hasMore, setHasMore] = useState(true);\n  const [items, setItems] = useState<TimelineProps['activity']>([]);\n\n  useEffect(() => {\n    const newItems = args.lazyLoading ? () => activity.slice(0, INITIAL_CHUNK_SIZE) : activity;\n    setHasMore(newItems.length < activity.length);\n    setItems(newItems);\n  }, [args.lazyLoading]);\n\n  const loadMore = useCallback(() => {\n    if (!loading) {\n      setLoading(true);\n      setTimeout(() => {\n        setLoading(false);\n\n        setItems(prevItems => {\n          const previousItemsLength = prevItems.length;\n          const newItems = activity.slice(\n            previousItemsLength,\n            previousItemsLength + APPEND_CHUNK_SIZE\n          );\n\n          if (newItems.length === 0) {\n            setHasMore(false);\n          }\n\n          return [...prevItems, ...newItems];\n        });\n      }, 2000);\n    }\n  }, [loading]);\n\n  return (\n    <Timeline\n      activity={items}\n      currentTime={new Date()}\n      sortOrder={args.sortOrder}\n      groupBy={args.groupBy}\n      loading={loading}\n      loadMore={hasMore ? loadMore : undefined}\n    />\n  );\n};\n\nTimelineDemo.args = {\n  sortOrder: 'descending',\n  groupBy: 'date',\n  lazyLoading: false\n};\n\nTimelineDemo.argTypes = {\n  sortOrder: { options: ['ascending', 'descending'], control: { type: 'select' } },\n  groupBy: {\n    options: ['date', 'monthyear', 'quarteryear', 'year', 'none'],\n    control: { type: 'select' }\n  },\n  lazyLoading: { control: { type: 'boolean' } }\n};\n\nexport const TimelineToolbarDemo: Story = () => {\n  const [sortOrder, setSortOrder] = useState<TimelineSortOrder>();\n  const [groupBy, setGroupBy] = useState<TimelineGroupBy>();\n  const [items, setItems] = useState<TimelineProps['activity']>(activity);\n  const [searchValue, onSearchChange] = useState<SearchInputProps['value']>('');\n\n  const onSearchSubmit = useCallback((value: string) => {\n    setItems(activity.filter(item => JSON.stringify(item.title).includes(value)));\n  }, []);\n\n  return (\n    <Card>\n      <CardHeader>\n        <TimelineToolbar\n          name='Timeline Demo'\n          search={{ onSearchSubmit, onSearchChange, value: searchValue }}\n          count={{ total: items.length }}\n          sort={{\n            selected: sortOrder,\n            onItemClick: (id: TimelineProps['sortOrder']) => {\n              setSortOrder(id);\n            }\n          }}\n          group={{\n            selected: groupBy,\n            onItemClick: (id: TimelineProps['groupBy']) => {\n              setGroupBy(id);\n            }\n          }}\n        />\n      </CardHeader>\n      <CardContent>\n        <Timeline\n          activity={items}\n          currentTime={new Date()}\n          sortOrder={sortOrder}\n          groupBy={groupBy}\n        />\n      </CardContent>\n    </Card>\n  );\n};\n"]}

package/jsx/wss/AppShell/AppShell.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppShell.stories.d.ts","sourceRoot":"","sources":["../../../src/wss/AppShell/AppShell.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAY,aAAa,EAAoB,MAAM,wBAAwB,CAAC;;AAInF,wBAMU;AAEV,UAAU,iBAAiB;IACzB,OAAO,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC;IAC9C,QAAQ,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC,UAAU,CAAC,CAAC;IAChD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IAC7C,WAAW,CAAC,EAAE,aAAa,CAAC,aAAa,CAAC,CAAC;IAC3C,YAAY,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC;IAC3D,aAAa,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,CAAC;IACnD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,WAAW,CAAC,EAAE,SAAS,CAAC;CACzB;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,iBAAiB,CA6DjD,CAAC"}
+{"version":3,"file":"AppShell.stories.d.ts","sourceRoot":"","sources":["../../../src/wss/AppShell/AppShell.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAY,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAY,aAAa,EAAoB,MAAM,wBAAwB,CAAC;;AAKnF,wBAMU;AAEV,UAAU,iBAAiB;IACzB,OAAO,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC;IAC9C,QAAQ,CAAC,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC,UAAU,CAAC,CAAC;IAChD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC;IAC7C,WAAW,CAAC,EAAE,aAAa,CAAC,aAAa,CAAC,CAAC;IAC3C,YAAY,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC;IAC3D,aAAa,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,CAAC;IACnD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,WAAW,CAAC,EAAE,SAAS,CAAC;CACzB;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,iBAAiB,CAiFjD,CAAC"}

package/jsx/wss/AppShell/AppShell.stories.jsx

@@ -1,5 +1,6 @@
 import { useState } from 'react';
 import { AppShell } from '@pega/cosmos-react-wss';
+import { Icon } from '@pega/cosmos-react-core';
 import { DefaultMainContent, notificationItems, defaultAppDemoProps } from './AppShell.mocks';
 export default {
     title: 'Web Self Service/AppShell',
@@ -19,10 +20,27 @@ export const AppShellDemo = (args) => {
             ...item
         })));
     };
+    const [contexts, setContexts] = useState([
+        {
+            id: '1',
+            primary: 'Medical',
+            selected: true,
+            visual: <Icon name='heart-pulse-solid'/>
+        },
+        {
+            id: '2',
+            primary: 'Vision',
+            selected: false,
+            visual: <Icon name='glasses-solid'/>
+        }
+    ]);
     return (<AppShell main={args.mainContent ?? <DefaultMainContent content={mainContent}/>} appInfo={{
             appName: args.appName ?? defaultAppDemoProps.appName,
             imageSrc: args.imageSrc ?? defaultAppDemoProps.imageSrc,
             onClick: () => setMainContent('Home')
+        }} contextSwitcher={{
+            contexts,
+            onContextClick: (id) => setContexts(cur => cur.map(ctx => ({ ...ctx, selected: id === ctx.id })))
         }} navLinks={Array.from({
             length: args.numberOfNavLinks ?? defaultAppDemoProps.numberOfNavLinks
         }).map((_, index) => {

package/jsx/wss/AppShell/AppShell.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"AppShell.stories.jsx","sourceRoot":"","sources":["../../../src/wss/AppShell/AppShell.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { ReactNode, useState } from 'react';\n\nimport { AppShell, AppShellProps, NotificationItem } from '@pega/cosmos-react-wss';\n\nimport { DefaultMainContent, notificationItems, defaultAppDemoProps } from './AppShell.mocks';\n\nexport default {\n  title: 'Web Self Service/AppShell',\n  component: AppShell,\n  parameters: {\n    layout: 'fullscreen'\n  }\n} as Meta;\n\ninterface AppShellDemoProps {\n  appName?: AppShellProps['appInfo']['appName'];\n  imageSrc?: AppShellProps['appInfo']['imageSrc'];\n  numberOfNavLinks?: number;\n  navAlignment?: AppShellProps['navAlignment'];\n  navPosition?: AppShellProps['navPosition'];\n  operatorName?: AppShellProps['operator']['avatar']['name'];\n  operatorTitle?: AppShellProps['operator']['title'];\n  notificationsEmpty?: boolean;\n  notificationsLoading?: boolean;\n  mainContent?: ReactNode;\n}\n\nexport const AppShellDemo: Story<AppShellDemoProps> = (args: AppShellDemoProps) => {\n  const [mainContent, setMainContent] = useState('Home');\n  const [notifications, setNotifications] = useState<NotificationItem[]>(notificationItems);\n  const [numNewNotifications, setNumNewNotifications] = useState(\n    notifications.filter(x => x.unread).length\n  );\n\n  const handleNotificationClick = (passedId: string) => {\n    setNotifications(cur =>\n      cur.map(({ id, unread, ...item }) => ({\n        id,\n        unread: passedId === id ? false : unread,\n        ...item\n      }))\n    );\n  };\n\n  return (\n    <AppShell\n      main={args.mainContent ?? <DefaultMainContent content={mainContent} />}\n      appInfo={{\n        appName: args.appName ?? defaultAppDemoProps.appName,\n        imageSrc: args.imageSrc ?? defaultAppDemoProps.imageSrc,\n        onClick: () => setMainContent('Home')\n      }}\n      navLinks={Array.from({\n        length: args.numberOfNavLinks ?? defaultAppDemoProps.numberOfNavLinks\n      }).map((_, index) => {\n        const navName = `Navigation ${index + 1}`;\n\n        return {\n          id: `nav-${index + 1}`,\n          text: navName,\n          href: '#',\n          onClick: () => setMainContent(navName),\n          current: navName === mainContent\n        };\n      })}\n      operator={{\n        avatar: { name: args.operatorName ?? defaultAppDemoProps.operatorName },\n        title: args.operatorTitle ?? defaultAppDemoProps.operatorTitle,\n        actions: [\n          { id: 'profile', primary: 'My profile', href: '#' },\n          { id: 'settings', primary: 'Settings', href: '#' },\n          { id: 'logOut', primary: 'Log out', href: '#' }\n        ]\n      }}\n      notifications={{\n        title: 'Notifications',\n        count: numNewNotifications,\n        items: args.notificationsEmpty ? [] : notifications,\n        onItemClick: handleNotificationClick,\n        loading: args.notificationsLoading ?? defaultAppDemoProps.notificationsLoading,\n        onNotificationsOpen: () => {\n          setNumNewNotifications(0);\n        }\n      }}\n      navAlignment={args.navAlignment}\n      navPosition={args.navPosition}\n    />\n  );\n};\n\nAppShellDemo.args = defaultAppDemoProps;\n\n// eslint-disable-next-line demo-patterns/args-match-types\nAppShellDemo.argTypes = {\n  imageSrc: { control: { type: 'text' } },\n  appName: { control: { type: 'text' } },\n  numberOfNavLinks: { control: { type: 'number' } },\n  navAlignment: { options: ['start', 'center', 'end'], control: { type: 'select' } },\n  navPosition: { options: ['inline', 'below'], control: { type: 'select' } },\n  operatorName: { control: { type: 'text' } },\n  operatorTitle: { control: { type: 'text' } },\n  notificationsEmpty: { control: { type: 'boolean' } },\n  notificationsLoading: { control: { type: 'boolean' } }\n};\n"]}
+{"version":3,"file":"AppShell.stories.jsx","sourceRoot":"","sources":["../../../src/wss/AppShell/AppShell.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { ReactNode, useState } from 'react';\n\nimport { AppShell, AppShellProps, NotificationItem } from '@pega/cosmos-react-wss';\nimport { ContextSwitcherProps, Icon } from '@pega/cosmos-react-core';\n\nimport { DefaultMainContent, notificationItems, defaultAppDemoProps } from './AppShell.mocks';\n\nexport default {\n  title: 'Web Self Service/AppShell',\n  component: AppShell,\n  parameters: {\n    layout: 'fullscreen'\n  }\n} as Meta;\n\ninterface AppShellDemoProps {\n  appName?: AppShellProps['appInfo']['appName'];\n  imageSrc?: AppShellProps['appInfo']['imageSrc'];\n  numberOfNavLinks?: number;\n  navAlignment?: AppShellProps['navAlignment'];\n  navPosition?: AppShellProps['navPosition'];\n  operatorName?: AppShellProps['operator']['avatar']['name'];\n  operatorTitle?: AppShellProps['operator']['title'];\n  notificationsEmpty?: boolean;\n  notificationsLoading?: boolean;\n  mainContent?: ReactNode;\n}\n\nexport const AppShellDemo: Story<AppShellDemoProps> = (args: AppShellDemoProps) => {\n  const [mainContent, setMainContent] = useState('Home');\n  const [notifications, setNotifications] = useState<NotificationItem[]>(notificationItems);\n  const [numNewNotifications, setNumNewNotifications] = useState(\n    notifications.filter(x => x.unread).length\n  );\n\n  const handleNotificationClick = (passedId: string) => {\n    setNotifications(cur =>\n      cur.map(({ id, unread, ...item }) => ({\n        id,\n        unread: passedId === id ? false : unread,\n        ...item\n      }))\n    );\n  };\n\n  const [contexts, setContexts] = useState<ContextSwitcherProps['contexts']>([\n    {\n      id: '1',\n      primary: 'Medical',\n      selected: true,\n      visual: <Icon name='heart-pulse-solid' />\n    },\n    {\n      id: '2',\n      primary: 'Vision',\n      selected: false,\n      visual: <Icon name='glasses-solid' />\n    }\n  ]);\n\n  return (\n    <AppShell\n      main={args.mainContent ?? <DefaultMainContent content={mainContent} />}\n      appInfo={{\n        appName: args.appName ?? defaultAppDemoProps.appName,\n        imageSrc: args.imageSrc ?? defaultAppDemoProps.imageSrc,\n        onClick: () => setMainContent('Home')\n      }}\n      contextSwitcher={{\n        contexts,\n        onContextClick: (id: string) =>\n          setContexts(cur => cur!.map(ctx => ({ ...ctx, selected: id === ctx.id })))\n      }}\n      navLinks={Array.from({\n        length: args.numberOfNavLinks ?? defaultAppDemoProps.numberOfNavLinks\n      }).map((_, index) => {\n        const navName = `Navigation ${index + 1}`;\n\n        return {\n          id: `nav-${index + 1}`,\n          text: navName,\n          href: '#',\n          onClick: () => setMainContent(navName),\n          current: navName === mainContent\n        };\n      })}\n      operator={{\n        avatar: { name: args.operatorName ?? defaultAppDemoProps.operatorName },\n        title: args.operatorTitle ?? defaultAppDemoProps.operatorTitle,\n        actions: [\n          { id: 'profile', primary: 'My profile', href: '#' },\n          { id: 'settings', primary: 'Settings', href: '#' },\n          { id: 'logOut', primary: 'Log out', href: '#' }\n        ]\n      }}\n      notifications={{\n        title: 'Notifications',\n        count: numNewNotifications,\n        items: args.notificationsEmpty ? [] : notifications,\n        onItemClick: handleNotificationClick,\n        loading: args.notificationsLoading ?? defaultAppDemoProps.notificationsLoading,\n        onNotificationsOpen: () => {\n          setNumNewNotifications(0);\n        }\n      }}\n      navAlignment={args.navAlignment}\n      navPosition={args.navPosition}\n    />\n  );\n};\n\nAppShellDemo.args = defaultAppDemoProps;\n\n// eslint-disable-next-line demo-patterns/args-match-types\nAppShellDemo.argTypes = {\n  imageSrc: { control: { type: 'text' } },\n  appName: { control: { type: 'text' } },\n  numberOfNavLinks: { control: { type: 'number' } },\n  navAlignment: { options: ['start', 'center', 'end'], control: { type: 'select' } },\n  navPosition: { options: ['inline', 'below'], control: { type: 'select' } },\n  operatorName: { control: { type: 'text' } },\n  operatorTitle: { control: { type: 'text' } },\n  notificationsEmpty: { control: { type: 'boolean' } },\n  notificationsLoading: { control: { type: 'boolean' } }\n};\n"]}

package/jsx/wss/CaseView/CaseView.stories.jsx

@@ -27,7 +27,7 @@ export const CaseViewDemo = (args) => {
                 : undefined} summary={args.showSummaryRegion
                 ? {
                     label: 'Summary',
-                    content: (<CaseSummaryFields primaryFields={casePreviewPrimaryFields} secondaryFields={casePreviewSecondaryFields}/>)
+                    content: (<CaseSummaryFields primary={casePreviewPrimaryFields} secondary={casePreviewSecondaryFields}/>)
                 }
                 : undefined} feed={args.showPulseRegion ? { label: 'Feed', content: <FeedPostDemo /> } : undefined} utility={args.showUtilitiesRegion
                 ? { label: 'Utility', content: <AttachmentsMock /> }

package/jsx/wss/CaseView/CaseView.stories.jsx.map

@@ -1 +1 @@
-{"version":3,"file":"CaseView.stories.jsx","sourceRoot":"","sources":["../../../src/wss/CaseView/CaseView.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState } from 'react';\n\nimport { AppShell, CaseView } from '@pega/cosmos-react-wss';\nimport { CaseSummaryFields, Stages } from '@pega/cosmos-react-work';\n\nimport { AttachmentsMock } from '../../work/CaseView/Attachments.mocks';\nimport { FeedPostDemo } from '../../social/Feed/FeedPost.stories';\nimport {\n  casePreviewPrimaryFields,\n  casePreviewSecondaryFields\n} from '../../work/CaseView/CaseView.mocks';\nimport { TasksDemo } from '../../work/Tasks/Tasks.stories';\nimport { defaultAppDemoProps } from '../AppShell/AppShell.mocks';\n\nexport default {\n  title: 'Web Self Service/CaseView',\n  component: CaseView,\n  parameters: {\n    layout: 'fullscreen'\n  }\n} as Meta;\n\ninterface CaseViewDemoProps {\n  showStagesRegion?: boolean;\n  showUtilitiesRegion?: boolean;\n  showSummaryRegion?: boolean;\n  showTasksRegion?: boolean;\n  showPulseRegion?: boolean;\n}\n\nexport const CaseViewDemo: Story<CaseViewDemoProps> = (args: CaseViewDemoProps) => {\n  const [, setMainContent] = useState('Home');\n\n  return (\n    <AppShell\n      caseId='1234'\n      main={\n        <CaseView\n          heading='I have an issue that is impacting my work and I need help'\n          actions={[{ id: '1', text: 'Some text' }]}\n          tasks={{ label: 'Tasks', content: <TasksDemo /> }}\n          stages={\n            args.showStagesRegion\n              ? {\n                  label: 'Stages',\n                  content: (\n                    <Stages\n                      stages={[\n                        { name: 'Create', id: '1', completed: true },\n                        { name: 'Troubleshoot', id: '2', completed: false },\n                        { name: 'Resolve', id: '3', completed: false }\n                      ]}\n                      current=''\n                    />\n                  )\n                }\n              : undefined\n          }\n          summary={\n            args.showSummaryRegion\n              ? {\n                  label: 'Summary',\n                  content: (\n                    <CaseSummaryFields\n                      primaryFields={casePreviewPrimaryFields}\n                      secondaryFields={casePreviewSecondaryFields}\n                    />\n                  )\n                }\n              : undefined\n          }\n          feed={args.showPulseRegion ? { label: 'Feed', content: <FeedPostDemo /> } : undefined}\n          utility={\n            args.showUtilitiesRegion\n              ? { label: 'Utility', content: <AttachmentsMock /> }\n              : undefined\n          }\n        />\n      }\n      appInfo={{\n        appName: 'App name',\n        imageSrc: 'https://www.pega.com/themes/custom/pegawww_theme/images/pega-logo.svg'\n      }}\n      navLinks={Array.from({\n        length: defaultAppDemoProps.numberOfNavLinks\n      }).map((_, index) => {\n        const navName = `Navigation ${index + 1}`;\n\n        return {\n          id: `nav-${index + 1}`,\n          text: navName,\n          href: '#',\n          onClick: () => setMainContent(navName)\n        };\n      })}\n      operator={{\n        avatar: { name: 'hello' },\n        title: 'title',\n        actions: [\n          { id: 'profile', primary: 'My profile', href: '#' },\n          { id: 'settings', primary: 'Settings', href: '#' },\n          { id: 'logOut', primary: 'Log out', href: '#' }\n        ]\n      }}\n    />\n  );\n};\n\nCaseViewDemo.args = {\n  showStagesRegion: true,\n  showUtilitiesRegion: true,\n  showSummaryRegion: true,\n  showPulseRegion: true\n};\n\nCaseViewDemo.argTypes = {\n  showStagesRegion: { control: { type: 'boolean' } },\n  showUtilitiesRegion: { control: { type: 'boolean' } },\n  showSummaryRegion: { control: { type: 'boolean' } },\n  showPulseRegion: { control: { type: 'boolean' } }\n};\n"]}
+{"version":3,"file":"CaseView.stories.jsx","sourceRoot":"","sources":["../../../src/wss/CaseView/CaseView.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState } from 'react';\n\nimport { AppShell, CaseView } from '@pega/cosmos-react-wss';\nimport { CaseSummaryFields, Stages } from '@pega/cosmos-react-work';\n\nimport { AttachmentsMock } from '../../work/CaseView/Attachments.mocks';\nimport { FeedPostDemo } from '../../social/Feed/FeedPost.stories';\nimport {\n  casePreviewPrimaryFields,\n  casePreviewSecondaryFields\n} from '../../work/CaseView/CaseView.mocks';\nimport { TasksDemo } from '../../work/Tasks/Tasks.stories';\nimport { defaultAppDemoProps } from '../AppShell/AppShell.mocks';\n\nexport default {\n  title: 'Web Self Service/CaseView',\n  component: CaseView,\n  parameters: {\n    layout: 'fullscreen'\n  }\n} as Meta;\n\ninterface CaseViewDemoProps {\n  showStagesRegion?: boolean;\n  showUtilitiesRegion?: boolean;\n  showSummaryRegion?: boolean;\n  showTasksRegion?: boolean;\n  showPulseRegion?: boolean;\n}\n\nexport const CaseViewDemo: Story<CaseViewDemoProps> = (args: CaseViewDemoProps) => {\n  const [, setMainContent] = useState('Home');\n\n  return (\n    <AppShell\n      caseId='1234'\n      main={\n        <CaseView\n          heading='I have an issue that is impacting my work and I need help'\n          actions={[{ id: '1', text: 'Some text' }]}\n          tasks={{ label: 'Tasks', content: <TasksDemo /> }}\n          stages={\n            args.showStagesRegion\n              ? {\n                  label: 'Stages',\n                  content: (\n                    <Stages\n                      stages={[\n                        { name: 'Create', id: '1', completed: true },\n                        { name: 'Troubleshoot', id: '2', completed: false },\n                        { name: 'Resolve', id: '3', completed: false }\n                      ]}\n                      current=''\n                    />\n                  )\n                }\n              : undefined\n          }\n          summary={\n            args.showSummaryRegion\n              ? {\n                  label: 'Summary',\n                  content: (\n                    <CaseSummaryFields\n                      primary={casePreviewPrimaryFields}\n                      secondary={casePreviewSecondaryFields}\n                    />\n                  )\n                }\n              : undefined\n          }\n          feed={args.showPulseRegion ? { label: 'Feed', content: <FeedPostDemo /> } : undefined}\n          utility={\n            args.showUtilitiesRegion\n              ? { label: 'Utility', content: <AttachmentsMock /> }\n              : undefined\n          }\n        />\n      }\n      appInfo={{\n        appName: 'App name',\n        imageSrc: 'https://www.pega.com/themes/custom/pegawww_theme/images/pega-logo.svg'\n      }}\n      navLinks={Array.from({\n        length: defaultAppDemoProps.numberOfNavLinks\n      }).map((_, index) => {\n        const navName = `Navigation ${index + 1}`;\n\n        return {\n          id: `nav-${index + 1}`,\n          text: navName,\n          href: '#',\n          onClick: () => setMainContent(navName)\n        };\n      })}\n      operator={{\n        avatar: { name: 'hello' },\n        title: 'title',\n        actions: [\n          { id: 'profile', primary: 'My profile', href: '#' },\n          { id: 'settings', primary: 'Settings', href: '#' },\n          { id: 'logOut', primary: 'Log out', href: '#' }\n        ]\n      }}\n    />\n  );\n};\n\nCaseViewDemo.args = {\n  showStagesRegion: true,\n  showUtilitiesRegion: true,\n  showSummaryRegion: true,\n  showPulseRegion: true\n};\n\nCaseViewDemo.argTypes = {\n  showStagesRegion: { control: { type: 'boolean' } },\n  showUtilitiesRegion: { control: { type: 'boolean' } },\n  showSummaryRegion: { control: { type: 'boolean' } },\n  showPulseRegion: { control: { type: 'boolean' } }\n};\n"]}

package/lib/build/AppShell/AppShell.mocks.d.ts

@@ -1,69 +1,32 @@
 import { FC } from 'react';
+import { NavProps } from '@pega/cosmos-react-build';
 export interface TabbedPageStoryProps {
-    pageContent: PageContentProps;
+    pageContent: {
+        template: 'tabbed';
+        title: string;
+        breadcrumbsPath: string;
+        tabs: string[];
+    };
     showBreadcrumbs: boolean;
 }
+export interface ShowcasePageStoryProps {
+    template: 'showcase';
+    title: string;
+    description: string;
+    actionLabel: string;
+    imageSrc: string;
+}
 export interface PageContentProps {
     id: string;
-    data: {
-        pageTitle: string;
-        breadcrumbsPath: string;
-        tabs: string[];
-    };
+    data: TabbedPageStoryProps['pageContent'] | ShowcasePageStoryProps;
 }
 export declare const getPath: (args: TabbedPageStoryProps) => {
     id: string;
     primary: string;
     href: string | undefined;
 }[] | undefined;
-export declare const appExplorerMenuList: {
-    id: string;
-    label: string;
-    nodes: ({
-        id: string;
-        label: string;
-        nodes?: undefined;
-    } | {
-        id: string;
-        label: string;
-        nodes: {
-            id: string;
-            label: string;
-        }[];
-    })[];
-}[];
-export declare const branchesMenuList: {
-    icon: string;
-    id: string;
-    label: string;
-}[];
-export declare const contents: {
-    id: string;
-    data: {
-        pageTitle: string;
-        breadcrumbsPath: string;
-        tabs: string[];
-    };
-}[];
-export declare const recordMenuList: {
-    id: string;
-    label: string;
-    nodes: {
-        id: string;
-        label: string;
-    }[];
-}[];
-export declare const treeList: ({
-    id: string;
-    label: string;
-    nodes?: undefined;
-} | {
-    id: string;
-    label: string;
-    nodes: {
-        id: string;
-        label: string;
-    }[];
-})[];
+export declare const defaultNavItems: NavProps['items'];
+export declare const contents: PageContentProps[];
 export declare const TabbedPageComp: FC<TabbedPageStoryProps>;
+export declare const ShowcasePageComp: FC<ShowcasePageStoryProps>;
 //# sourceMappingURL=AppShell.mocks.d.ts.map

package/lib/build/AppShell/AppShell.mocks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppShell.mocks.d.ts","sourceRoot":"","sources":["../../../src/build/AppShell/AppShell.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAK3B,MAAM,WAAW,oBAAoB;IACnC,WAAW,EAAE,gBAAgB,CAAC;IAC9B,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,gBAAgB;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE;QACJ,SAAS,EAAE,MAAM,CAAC;QAClB,eAAe,EAAE,MAAM,CAAC;QACxB,IAAI,EAAE,MAAM,EAAE,CAAC;KAChB,CAAC;CACH;AAED,eAAO,MAAM,OAAO,SAAU,oBAAoB;;;;eAqBjD,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;GA2D/B,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;GAqB5B,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;;;GAkSpB,CAAC;AAEF,eAAO,MAAM,cAAc;;;;;;;GAiC1B,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;;;;;;;;IA+FpB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,oBAAoB,CAwBnD,CAAC"}
+{"version":3,"file":"AppShell.mocks.d.ts","sourceRoot":"","sources":["../../../src/build/AppShell/AppShell.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAG3B,OAAO,EAAE,QAAQ,EAAgB,MAAM,0BAA0B,CAAC;AAKlE,MAAM,WAAW,oBAAoB;IACnC,WAAW,EAAE;QACX,QAAQ,EAAE,QAAQ,CAAC;QACnB,KAAK,EAAE,MAAM,CAAC;QACd,eAAe,EAAE,MAAM,CAAC;QACxB,IAAI,EAAE,MAAM,EAAE,CAAC;KAChB,CAAC;IACF,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,sBAAsB;IACrC,QAAQ,EAAE,UAAU,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,gBAAgB;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,oBAAoB,CAAC,aAAa,CAAC,GAAG,sBAAsB,CAAC;CACpE;AAED,eAAO,MAAM,OAAO,SAAU,oBAAoB;;;;eAmBjD,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,QAAQ,CAAC,OAAO,CAiH7C,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,gBAAgB,EA6PtC,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,oBAAoB,CAyBnD,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,sBAAsB,CAwBvD,CAAC"}