npm - @pega/cosmos-react-demos - Versions diffs - 4.0.0-dev.12.1 → 4.0.0-dev.13.0 - Mend

@pega/cosmos-react-demos 4.0.0-dev.12.1 → 4.0.0-dev.13.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 (133) hide show

package/lib/work/IntelligentGuidance/IntelligentGuidance.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IntelligentGuidance.stories.js","sourceRoot":"","sources":["../../../src/work/IntelligentGuidance/IntelligentGuidance.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGpD,OAAO,EACL,MAAM,EACN,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,YAAY,EACZ,KAAK,EACL,UAAU,EAGV,IAAI,EACL,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAa,MAAM,uBAAuB,CAAC;AACzE,OAAO,EAAE,mBAAmB,EAA4B,MAAM,yBAAyB,CAAC;AACxF,OAAO,KAAK,aAAa,MAAM,mEAAmE,CAAC;AAEnG,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAC5D,OAAO,EAAE,kBAAkB,EAAE,MAAM,wCAAwC,CAAC;AAE5E,YAAY,CAAC,aAAa,CAAC,CAAC;AAE5B,eAAe;IACb,KAAK,EAAE,0BAA0B;IACjC,SAAS,EAAE,mBAAmB;IAC9B,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACM,CAAC;AAEV,MAAM,CAAC,MAAM,uBAAuB,GAAU,GAAG,EAAE;IACjD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAoC;QACpE;YACE,EAAE,EAAE,GAAG;YACP,KAAK,EAAE,gBAAgB;YACvB,IAAI,EAAE,WAAW;YACjB,IAAI,EAAE,MAAM;YACZ,OAAO,EAAE,GAAG,EAAE;gBACZ,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;YACnE,CAAC;YACD,SAAS,EAAE,GAAG,EAAE;gBACd,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;YACnE,CAAC;SACF;QACD;YACE,EAAE,EAAE,GAAG;YACP,KAAK,EAAE,wBAAwB;YAC/B,IAAI,EAAE,UAAU;YAChB,IAAI,EAAE,mBAAmB;YACzB,OAAO,EAAE,GAAG,EAAE;gBACZ,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;YACnE,CAAC;YACD,SAAS,EAAE,GAAG,EAAE;gBACd,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;YACnE,CAAC;SACF;KACF,CAAC,CAAC;IACH,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAErD,OAAO,CACL,KAAC,mBAAmB,IAClB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAC,sBAAsB,EAC9B,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,GAAG,EAAE;YACrB,cAAc,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC;QAC1C,CAAC,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAIF,MAAM,CAAC,MAAM,+BAA+B,GAAU,GAAG,EAAE;IACzD,MAAM,eAAe,GAAG,SAAS,EAAE,CAAC;IACpC,MAAM,sBAAsB,GAAG,SAAS,EAAE,CAAC;IAC3C,MAAM,sBAAsB,GAAG,SAAS,EAAE,CAAC;IAE3C,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAc;QAC5D;YACE,EAAE,EAAE,sBAAsB;YAC1B,IAAI,EAAE,OAAO;YACb,IAAI,EAAE,gBAAgB;YACtB,UAAU,EAAE,IAAI;YAChB,MAAM,EAAE;gBACN,IAAI,EAAE,mBAAmB;gBACzB,OAAO,EAAE,SAAmC;aAC7C;SACF;QACD;YACE,EAAE,EAAE,SAAS,EAAE;YACf,IAAI,EAAE,WAAW;YACjB,IAAI,EAAE,qBAAqB;YAC3B,UAAU,EAAE,KAAK;YACjB,MAAM,EAAE;gBACN,IAAI,EAAE,aAAa;gBACnB,OAAO,EAAE,SAAmC;aAC7C;SACF;QACD;YACE,EAAE,EAAE,sBAAsB;YAC1B,IAAI,EAAE,MAAM;YACZ,IAAI,EAAE,wBAAwB;YAC9B,UAAU,EAAE,KAAK;YACjB,IAAI,EAAE,gBAAgB;SACvB;KACF,CAAC,CAAC;IAEH,MAAM,kBAAkB,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAC3D,MAAM,cAAc,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACpD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAqB,SAAS,CAAC,CAAC;IAChF,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IACnE,MAAM,gBAAgB,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAEzD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,kBAAkB,CAAC,OAAO,EAAE;YAC9B,kBAAkB,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;YACnC,kBAAkB,CAAC,OAAO,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;SAClD;aAAM,IAAI,gBAAgB,CAAC,OAAO,EAAE;YACnC,gBAAgB,CAAC,OAAO,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;SAChD;IACH,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,MAAM,iBAAiB,GAAG,CAAC,MAA0B,EAAE,UAAuB,EAAE,EAAE;QAChF,IAAI,MAAM,KAAK,eAAe,EAAE;YAC9B,IAAI,UAAU,KAAK,QAAQ,IAAI,UAAU,KAAK,QAAQ,EAAE;gBACtD,eAAe,CAAC,SAAS,CAAC,CAAC;aAC5B;iBAAM,IAAI,UAAU,KAAK,QAAQ,EAAE;gBAClC,eAAe,CAAC,eAAe,CAAC,CAAC;aAClC;SACF;aAAM,IAAI,UAAU,KAAK,QAAQ,EAAE;YAClC,eAAe,CAAC,MAAM,CAAC,CAAC;YACxB,eAAe,CAAC,SAAS,CAAC,EAAE;gBAC1B,OAAO,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;oBAC1B,IAAI,IAAI,CAAC,EAAE,KAAK,MAAM,EAAE;wBACtB,OAAO;4BACL,GAAG,IAAI;4BACP,IAAI,EAAE,WAAW;4BACjB,IAAI,EAAE,SAAS;4BACf,MAAM,EAAE;gCACN,OAAO,EAAE,SAAmC;gCAC5C,IAAI,EAAE,aAAa;6BACpB;yBACF,CAAC;qBACH;oBACD,OAAO,IAAI,CAAC;gBACd,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;SACJ;aAAM,IAAI,UAAU,KAAK,QAAQ,EAAE;YAClC,eAAe,CAAC,SAAS,CAAC,CAAC;SAC5B;aAAM,IAAI,UAAU,KAAK,QAAQ,EAAE;YAClC,eAAe,CAAC,SAAS,CAAC,CAAC;YAC3B,eAAe,CAAC,SAAS,CAAC,EAAE;gBAC1B,OAAO,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;oBAC1B,IAAI,IAAI,CAAC,EAAE,KAAK,MAAM,EAAE;wBACtB,OAAO;4BACL,GAAG,IAAI;4BACP,IAAI,EAAE,OAAO;4BACb,UAAU,EAAE,IAAI;4BAChB,MAAM,EAAE;gCACN,OAAO,EAAE,SAAmC;gCAC5C,IAAI,EAAE,mBAAmB;6BAC1B;yBACF,CAAC;qBACH;oBACD,OAAO,IAAI,CAAC;gBACd,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;SACJ;aAAM,IAAI,UAAU,KAAK,SAAS,EAAE;YACnC,eAAe,CAAC,SAAS,CAAC,EAAE;gBAC1B,OAAO,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC;YACtD,CAAC,CAAC,CAAC;SACJ;IACH,CAAC,CAAC;IAEF,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAoC;QACpE;YACE,EAAE,EAAE,GAAG;YACP,KAAK,EAAE,wBAAwB;YAC/B,IAAI,EAAE,MAAM;YACZ,IAAI,EAAE,MAAM;YACZ,OAAO,EAAE,GAAG,EAAE;gBACZ,iBAAiB,CAAC,sBAAsB,EAAE,QAAQ,CAAC,CAAC;gBACpD,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;YACnE,CAAC;YACD,SAAS,EAAE,GAAG,EAAE;gBACd,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;YACnE,CAAC;SACF;QACD;YACE,EAAE,EAAE,GAAG;YACP,KAAK,EAAE,gBAAgB;YACvB,IAAI,EAAE,WAAW;YACjB,IAAI,EAAE,MAAM;YACZ,OAAO,EAAE,GAAG,EAAE;gBACZ,iBAAiB,CAAC,sBAAsB,EAAE,QAAQ,CAAC,CAAC;gBACpD,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;YACnE,CAAC;YACD,SAAS,EAAE,GAAG,EAAE;gBACd,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;YACnE,CAAC;SACF;KACF,CAAC,CAAC;IAEH,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEtD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE;YAC5B,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC;gBACf,GAAG,IAAI;gBACP;oBACE,EAAE,EAAE,GAAG;oBACP,KAAK,EAAE,WAAW;oBAClB,IAAI,EAAE,WAAW;oBACjB,IAAI,EAAE,MAAM;oBACZ,OAAO,EAAE,GAAG,EAAE;wBACZ,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;oBACnE,CAAC;oBACD,SAAS,EAAE,GAAG,EAAE;wBACd,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC;oBACnE,CAAC;iBACF;aACF,CAAC,CAAC;YACH,cAAc,CAAC,KAAK,CAAC,CAAC;QACxB,CAAC,EAAE,IAAI,CAAC,CAAC;QACT,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,WAAW,GAAG,CAAC,UAA2B,EAAE,EAAE;QAClD,MAAM,QAAQ,GAAG,UAAU,CAAC,GAAG,CAAC,CAAC,SAAS,EAAE,CAAC,EAAE,EAAE;YAC/C,MAAM,MAAM,GAAG,SAAS,EAAE,CAAC;YAC3B,IAAI,CAAC,KAAK,CAAC,EAAE;gBACX,OAAO;oBACL,EAAE,EAAE,MAAM;oBACV,IAAI,EAAE,WAAW;oBACjB,IAAI,EAAE,SAAS,CAAC,OAAO;oBACvB,UAAU,EAAE,KAAK;oBACjB,MAAM,EAAE;wBACN,OAAO,EAAE,SAAmC;wBAC5C,IAAI,EAAE,aAAa;qBACpB;iBACF,CAAC;aACH;YACD,OAAO;gBACL,EAAE,EAAE,MAAM;gBACV,IAAI,EAAE,WAAW;gBACjB,IAAI,EAAE,SAAS,CAAC,OAAO;gBACvB,UAAU,EAAE,KAAK;gBACjB,IAAI,EAAE,aAAa;aACpB,CAAC;QACJ,CAAC,CAAC,CAAC;QACH,eAAe,CAAC,SAAS,CAAC,EAAE;YAC1B,OAAO,CAAC,GAAG,QAAQ,EAAE,GAAG,SAAS,CAAC,CAAC;QACrC,CAAC,CAAC,CAAC;QACH,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;YACvB,iBAAiB,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,QAAQ,CAAC,CAAC;SAC7C;IACH,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,CACjB,KAAC,WAAW,IACV,GAAG,EAAE,cAAc,EACnB,KAAK,EAAE,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YAC7B,IAAI,IAAI,CAAC,EAAE,KAAK,YAAY,EAAE;gBAC5B,OAAO;oBACL,GAAG,IAAI;oBACP,MAAM,EAAE,IAAI;iBACb,CAAC;aACH;YACD,OAAO,IAAI,CAAC;QACd,CAAC,CAAC,EACF,SAAS,EAAC,gBAAgB,EAC1B,MAAM,EAAE;YACN,IAAI,EAAE,SAAS;YACf,OAAO,EACL,oGAAoG;SACvG,EACD,YAAY,EAAE,EAAE,CAAC,EAAE;YACjB,iBAAiB,CAAC,EAAE,EAAE,QAAQ,CAAC,CAAC;QAClC,CAAC,EACD,aAAa,EAAE,EAAE,CAAC,EAAE;YAClB,iBAAiB,CAAC,EAAE,EAAE,SAAS,CAAC,CAAC;QACnC,CAAC,EACD,OAAO,EAAE;YACP,KAAK,EAAE,kBAAkB,CAAC,KAAK;YAC/B,KAAK,EAAE,WAAW;SACnB,EACD,MAAM,EAAE;YACN,OAAO,EAAE,aAAa;YACtB,OAAO,EAAE,GAAG,EAAE;gBACZ,iBAAiB,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAC;gBAC7C,gBAAgB,CAAC,IAAI,CAAC,CAAC;YACzB,CAAC;YACD,MAAM,EAAE,YAAY,KAAK,eAAe;SACzC,EACD,IAAI,EACF,KAAC,QAAQ,IACP,MAAM,EACJ,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YACf,YAAY,KAAK,eAAe;oBAC/B,CAAC,CAAC,SAAS;oBACX,CAAC,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,YAAY,CAAC,EAAE,IAAI,GACxD,EAET,OAAO,EACL,KAAC,UAAU,IACT,GAAG,EAAE,kBAAkB,EACvB,IAAI,EAAE;oBACJ,KAAK,EAAE,CAAC,iBAAiB,EAAE,iBAAiB,EAAE,iBAAiB,CAAC,CAAC,GAAG,CAClE,CAAC,IAAY,EAAE,EAAE,CAAC,CAAC;wBACjB,OAAO,EAAE,IAAI;wBACb,EAAE,EAAE,IAAI;wBACR,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;qBAClB,CAAC,CACH;iBACF,EACD,IAAI,EAAC,SAAS,GACd,YAGJ,KAAC,IAAI,IACH,OAAO,EACL,8BACE,KAAC,MAAM,IACL,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE;gCACZ,iBAAiB,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;4BAC5C,CAAC,uBAGM,EACT,0BACE,KAAC,MAAM,IAAC,IAAI,EAAC,MAAM,qBAAc,EACjC,KAAC,MAAM,IACL,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,SAAS,EACjB,OAAO,EAAE,GAAG,EAAE;wCACZ,iBAAiB,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;oCAC5C,CAAC,uBAGM,IACL,IACL,YAGL,KAAC,IAAI,IAAC,SAAS,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,YAC3B,YAAY,KAAK,eAAe,CAAC,CAAC,CAAC,CAClC,KAAC,YAAY,KAAG,CACjB,CAAC,CAAC,CAAC,CACF,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE;wBACtC,MAAM,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC;wBAClB,OAAO,KAAC,KAAK,IAAC,KAAK,EAAE,SAAS,GAAG,EAAE,IAAO,GAAG,CAAI,CAAC;oBACpD,CAAC,CAAC,CACH,GACI,GACF,GACE,GAEb,CACH,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,IACX,OAAO,EAAC,gCAAgC,EACxC,KAAK,EAAE,UAAU,EACjB,mBAAmB,EACjB,KAAC,mBAAmB,IAClB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAC,sBAAsB,EAC9B,WAAW,EAAE,WAAW,EACxB,gBAAgB,EAAE,GAAG,EAAE;gBACrB,cAAc,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC;YAC1C,CAAC,GACD,GAEJ,CACH,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { Meta, Story } from '@storybook/react';\n\nimport {\n Button,\n createUID,\n Form,\n Grid,\n registerIcon,\n Input,\n MenuButton,\n MenuItemProps,\n StatusProps,\n Text\n} from '@pega/cosmos-react-core';\nimport { TaskManager, TaskView, TaskProps } from '@pega/cosmos-react-cs';\nimport { IntelligentGuidance, IntelligentGuidanceProps } from '@pega/cosmos-react-work';\nimport * as userSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/user-solid.icon';\n\nimport { CaseViewDemo } from '../CaseView/CaseView.stories';\nimport { TimelineDemo } from '../Timeline/Timeline.stories';\nimport { TaskPickerMockData } from '../../cs/TaskManager/TaskManager.mocks';\n\nregisterIcon(userSolidIcon);\n\nexport default {\n title: 'Work/IntelligentGuidance',\n component: IntelligentGuidance,\n parameters: {\n layout: 'fullscreen'\n }\n} as Meta;\n\nexport const IntelligentGuidanceDemo: Story = () => {\n const [items, setItems] = useState<IntelligentGuidanceProps['items']>([\n {\n id: '1',\n label: 'Change address',\n icon: 'clipboard',\n type: 'Task',\n onClick: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '1'));\n },\n onDismiss: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '1'));\n }\n },\n {\n id: '2',\n label: 'Update contact profile',\n icon: 'headline',\n type: 'Knowledge Article',\n onClick: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '2'));\n },\n onDismiss: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '2'));\n }\n }\n ]);\n const [isCollapsed, setIsCollapsed] = useState(true);\n\n return (\n <IntelligentGuidance\n items={items}\n heading='Intelligent guidance'\n isCollapsed={isCollapsed}\n onExpandCollapse={() => {\n setIsCollapsed(prevState => !prevState);\n }}\n />\n );\n};\n\ntype TaskActions = 'cancel' \| 'launch' \| 'dismiss' \| 'submit';\n\nexport const CaseViewWithIntelligentGuidance: Story = () => {\n const WRAP_UP_TASK_ID = createUID();\n const CHANGE_ADDRESS_TASK_ID = createUID();\n const UPDATE_PROFILE_TASK_ID = createUID();\n\n const [serviceTasks, setServiceTasks] = useState<TaskProps[]>([\n {\n id: CHANGE_ADDRESS_TASK_ID,\n icon: 'check',\n name: 'Change address',\n isResolved: true,\n status: {\n text: 'Resolve Completed',\n variant: 'success' as StatusProps['variant']\n }\n },\n {\n id: createUID(),\n icon: 'clipboard',\n name: 'Lost or stolen card',\n isResolved: false,\n status: {\n text: 'In Progress',\n variant: 'pending' as StatusProps['variant']\n }\n },\n {\n id: UPDATE_PROFILE_TASK_ID,\n icon: 'bulb',\n name: 'Update contact profile',\n isResolved: false,\n meta: 'Suggested task'\n }\n ]);\n\n const formActionsElemRef = useRef<HTMLButtonElement>(null);\n const taskManagerRef = useRef<HTMLDivElement>(null);\n const [activeTaskId, setActiveTaskId] = useState<string \| undefined>(undefined);\n const [disableWrapUp, setDisableWrapUp] = useState<boolean>(false);\n const addTaskButtonRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (formActionsElemRef.current) {\n formActionsElemRef.current.focus();\n formActionsElemRef.current.scrollIntoView(false);\n } else if (addTaskButtonRef.current) {\n addTaskButtonRef.current.scrollIntoView(false);\n }\n }, [activeTaskId]);\n\n const performTaskAction = (taskId: string \| undefined, taskAction: TaskActions) => {\n if (taskId === WRAP_UP_TASK_ID) {\n if (taskAction === 'cancel' \|\| taskAction === 'submit') {\n setActiveTaskId(undefined);\n } else if (taskAction === 'launch') {\n setActiveTaskId(WRAP_UP_TASK_ID);\n }\n } else if (taskAction === 'launch') {\n setActiveTaskId(taskId);\n setServiceTasks(prevTasks => {\n return prevTasks.map(task => {\n if (task.id === taskId) {\n return {\n ...task,\n icon: 'clipboard',\n meta: undefined,\n status: {\n variant: 'pending' as StatusProps['variant'],\n text: 'In Progress'\n }\n };\n }\n return task;\n });\n });\n } else if (taskAction === 'cancel') {\n setActiveTaskId(undefined);\n } else if (taskAction === 'submit') {\n setActiveTaskId(undefined);\n setServiceTasks(prevTasks => {\n return prevTasks.map(task => {\n if (task.id === taskId) {\n return {\n ...task,\n icon: 'check',\n isResolved: true,\n status: {\n variant: 'success' as StatusProps['variant'],\n text: 'Resolve Completed'\n }\n };\n }\n return task;\n });\n });\n } else if (taskAction === 'dismiss') {\n setServiceTasks(prevTasks => {\n return prevTasks.filter(task => task.id !== taskId);\n });\n }\n };\n\n const [items, setItems] = useState<IntelligentGuidanceProps['items']>([\n {\n id: '1',\n label: 'Update contact profile',\n icon: 'bulb',\n type: 'Task',\n onClick: () => {\n performTaskAction(UPDATE_PROFILE_TASK_ID, 'launch');\n setItems(prevItems => prevItems.filter(item => item.id !== '1'));\n },\n onDismiss: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '1'));\n }\n },\n {\n id: '2',\n label: 'Change address',\n icon: 'clipboard',\n type: 'Task',\n onClick: () => {\n performTaskAction(CHANGE_ADDRESS_TASK_ID, 'launch');\n setItems(prevItems => prevItems.filter(item => item.id !== '2'));\n },\n onDismiss: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '2'));\n }\n }\n ]);\n\n const [isCollapsed, setIsCollapsed] = useState(false);\n\n useEffect(() => {\n const timer = setTimeout(() => {\n setItems(prev => [\n ...prev,\n {\n id: '3',\n label: 'Demo item',\n icon: 'clipboard',\n type: 'Demo',\n onClick: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '3'));\n },\n onDismiss: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '3'));\n }\n }\n ]);\n setIsCollapsed(false);\n }, 5000);\n return () => clearTimeout(timer);\n }, []);\n\n const renderTasks = (selections: MenuItemProps[]) => {\n const newTasks = selections.map((selection, i) => {\n const taskId = createUID();\n if (i === 0) {\n return {\n id: taskId,\n icon: 'clipboard',\n name: selection.primary,\n isResolved: false,\n status: {\n variant: 'pending' as StatusProps['variant'],\n text: 'In Progress'\n }\n };\n }\n return {\n id: taskId,\n icon: 'clipboard',\n name: selection.primary,\n isResolved: false,\n meta: 'Queued task'\n };\n });\n setServiceTasks(prevTasks => {\n return [...newTasks, ...prevTasks];\n });\n if (newTasks.length > 0) {\n performTaskAction(newTasks[0].id, 'launch');\n }\n };\n\n const taskWidget = (\n <TaskManager\n ref={taskManagerRef}\n tasks={serviceTasks.map(task => {\n if (task.id === activeTaskId) {\n return {\n ...task,\n active: true\n };\n }\n return task;\n })}\n emptyText='No tasks added'\n banner={{\n icon: 'headset',\n content:\n 'Hi Ms. Ventura, I see that you are interested in changing your monthly due date, is that correct ?'\n }}\n onTaskLaunch={id => {\n performTaskAction(id, 'launch');\n }}\n onTaskDismiss={id => {\n performTaskAction(id, 'dismiss');\n }}\n addTask={{\n items: TaskPickerMockData.tasks,\n onAdd: renderTasks\n }}\n wrapUp={{\n disable: disableWrapUp,\n onClick: () => {\n performTaskAction(WRAP_UP_TASK_ID, 'launch');\n setDisableWrapUp(true);\n },\n active: activeTaskId === WRAP_UP_TASK_ID\n }}\n main={\n <TaskView\n header={\n <Text variant='h2'>\n {activeTaskId === WRAP_UP_TASK_ID\n ? 'Wrap up'\n : serviceTasks.find(task => task.id === activeTaskId)?.name}\n </Text>\n }\n actions={\n <MenuButton\n ref={formActionsElemRef}\n menu={{\n items: ['Option Number 1', 'Option Number 2', 'Option Number 3'].map(\n (name: string) => ({\n primary: name,\n id: name,\n onClick: () => {}\n })\n )\n }}\n text='Actions'\n />\n }\n >\n <Form\n actions={\n <>\n <Button\n name='Cancel'\n onClick={() => {\n performTaskAction(activeTaskId, 'cancel');\n }}\n >\n Cancel\n </Button>\n <div>\n <Button name='Save'>Save</Button>\n <Button\n name='Submit'\n variant='primary'\n onClick={() => {\n performTaskAction(activeTaskId, 'submit');\n }}\n >\n Submit\n </Button>\n </div>\n </>\n }\n >\n <Grid container={{ rowGap: 2 }}>\n {activeTaskId === WRAP_UP_TASK_ID ? (\n <TimelineDemo />\n ) : (\n Array.from({ length: 15 }, (undef, i) => {\n const idx = i + 1;\n return <Input label={`Field ${idx}`} key={idx} />;\n })\n )}\n </Grid>\n </Form>\n </TaskView>\n }\n />\n );\n\n return (\n <CaseViewDemo\n heading='Intelligent Guidance demo case'\n tasks={taskWidget}\n intelligentGuidance={\n <IntelligentGuidance\n items={items}\n heading='Intelligent guidance'\n isCollapsed={isCollapsed}\n onExpandCollapse={() => {\n setIsCollapsed(prevState => !prevState);\n }}\n />\n }\n />\n );\n};\n"]}
1	+ {"version":3,"file":"IntelligentGuidance.stories.js","sourceRoot":"","sources":["../../../src/work/IntelligentGuidance/IntelligentGuidance.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { Meta, Story } from '@storybook/react';\n\nimport {\n Button,\n createUID,\n Form,\n Grid,\n registerIcon,\n Input,\n MenuButton,\n MenuItemProps,\n StatusProps,\n Text\n} from '@pega/cosmos-react-core';\nimport { TaskManager, TaskView, TaskProps } from '@pega/cosmos-react-cs';\nimport { IntelligentGuidance, IntelligentGuidanceProps } from '@pega/cosmos-react-work';\nimport * as userSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/user-solid.icon';\n\nimport { CaseViewDemo } from '../CaseView/CaseView.stories';\nimport { TimelineDemo } from '../Timeline/Timeline.stories';\nimport { TaskPickerMockData } from '../../cs/TaskManager/TaskManager.mocks';\n\nregisterIcon(userSolidIcon);\n\nexport default {\n title: 'Work/IntelligentGuidance',\n component: IntelligentGuidance,\n parameters: {\n layout: 'fullscreen'\n }\n} as Meta;\n\nexport const IntelligentGuidanceDemo: Story = () => {\n const [items, setItems] = useState<IntelligentGuidanceProps['items']>([\n {\n id: '1',\n label: 'Change address',\n icon: 'clipboard',\n type: 'Task',\n onClick: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '1'));\n },\n onDismiss: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '1'));\n }\n },\n {\n id: '2',\n label: 'Update contact profile',\n icon: 'polaris',\n type: 'Knowledge Article',\n onClick: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '2'));\n },\n onDismiss: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '2'));\n },\n new: true\n }\n ]);\n const [isCollapsed, setIsCollapsed] = useState(true);\n\n return (\n <IntelligentGuidance\n items={items}\n heading='Suggested actions'\n isCollapsed={isCollapsed}\n onExpandCollapse={() => {\n setIsCollapsed(prevState => !prevState);\n }}\n />\n );\n};\n\ntype TaskActions = 'cancel' \| 'launch' \| 'dismiss' \| 'submit';\n\nexport const CaseViewWithIntelligentGuidance: Story = () => {\n const WRAP_UP_TASK_ID = createUID();\n const CHANGE_ADDRESS_TASK_ID = createUID();\n const UPDATE_PROFILE_TASK_ID = createUID();\n\n const [serviceTasks, setServiceTasks] = useState<TaskProps[]>([\n {\n id: CHANGE_ADDRESS_TASK_ID,\n icon: 'check',\n name: 'Change address',\n isResolved: true,\n status: {\n text: 'Resolve Completed',\n variant: 'success' as StatusProps['variant']\n }\n },\n {\n id: createUID(),\n icon: 'clipboard',\n name: 'Lost or stolen card',\n isResolved: false,\n status: {\n text: 'In Progress',\n variant: 'pending' as StatusProps['variant']\n }\n },\n {\n id: UPDATE_PROFILE_TASK_ID,\n icon: 'bulb',\n name: 'Update contact profile',\n isResolved: false,\n meta: 'Suggested task'\n }\n ]);\n\n const formActionsElemRef = useRef<HTMLButtonElement>(null);\n const taskManagerRef = useRef<HTMLDivElement>(null);\n const [activeTaskId, setActiveTaskId] = useState<string \| undefined>(undefined);\n const [disableWrapUp, setDisableWrapUp] = useState<boolean>(false);\n const addTaskButtonRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (formActionsElemRef.current) {\n formActionsElemRef.current.focus();\n formActionsElemRef.current.scrollIntoView(false);\n } else if (addTaskButtonRef.current) {\n addTaskButtonRef.current.scrollIntoView(false);\n }\n }, [activeTaskId]);\n\n const performTaskAction = (taskId: string \| undefined, taskAction: TaskActions) => {\n if (taskId === WRAP_UP_TASK_ID) {\n if (taskAction === 'cancel' \|\| taskAction === 'submit') {\n setActiveTaskId(undefined);\n } else if (taskAction === 'launch') {\n setActiveTaskId(WRAP_UP_TASK_ID);\n }\n } else if (taskAction === 'launch') {\n setActiveTaskId(taskId);\n setServiceTasks(prevTasks => {\n return prevTasks.map(task => {\n if (task.id === taskId) {\n return {\n ...task,\n icon: 'clipboard',\n meta: undefined,\n status: {\n variant: 'pending' as StatusProps['variant'],\n text: 'In Progress'\n }\n };\n }\n return task;\n });\n });\n } else if (taskAction === 'cancel') {\n setActiveTaskId(undefined);\n } else if (taskAction === 'submit') {\n setActiveTaskId(undefined);\n setServiceTasks(prevTasks => {\n return prevTasks.map(task => {\n if (task.id === taskId) {\n return {\n ...task,\n icon: 'check',\n isResolved: true,\n status: {\n variant: 'success' as StatusProps['variant'],\n text: 'Resolve Completed'\n }\n };\n }\n return task;\n });\n });\n } else if (taskAction === 'dismiss') {\n setServiceTasks(prevTasks => {\n return prevTasks.filter(task => task.id !== taskId);\n });\n }\n };\n\n const [items, setItems] = useState<IntelligentGuidanceProps['items']>([\n {\n id: '1',\n label: 'Update contact profile',\n icon: 'bulb',\n type: 'Task',\n onClick: () => {\n performTaskAction(UPDATE_PROFILE_TASK_ID, 'launch');\n setItems(prevItems => prevItems.filter(item => item.id !== '1'));\n },\n onDismiss: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '1'));\n }\n },\n {\n id: '2',\n label: 'Change address',\n icon: 'clipboard',\n type: 'Task',\n onClick: () => {\n performTaskAction(CHANGE_ADDRESS_TASK_ID, 'launch');\n setItems(prevItems => prevItems.filter(item => item.id !== '2'));\n },\n onDismiss: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '2'));\n }\n }\n ]);\n\n const [isCollapsed, setIsCollapsed] = useState(false);\n\n useEffect(() => {\n const timer = setTimeout(() => {\n setItems(prev => [\n ...prev,\n {\n id: '3',\n label: 'Demo item',\n icon: 'clipboard',\n type: 'Demo',\n onClick: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '3'));\n },\n onDismiss: () => {\n setItems(prevItems => prevItems.filter(item => item.id !== '3'));\n }\n }\n ]);\n setIsCollapsed(false);\n }, 5000);\n return () => clearTimeout(timer);\n }, []);\n\n const renderTasks = (selections: MenuItemProps[]) => {\n const newTasks = selections.map((selection, i) => {\n const taskId = createUID();\n if (i === 0) {\n return {\n id: taskId,\n icon: 'clipboard',\n name: selection.primary,\n isResolved: false,\n status: {\n variant: 'pending' as StatusProps['variant'],\n text: 'In Progress'\n }\n };\n }\n return {\n id: taskId,\n icon: 'clipboard',\n name: selection.primary,\n isResolved: false,\n meta: 'Queued task'\n };\n });\n setServiceTasks(prevTasks => {\n return [...newTasks, ...prevTasks];\n });\n if (newTasks.length > 0) {\n performTaskAction(newTasks[0].id, 'launch');\n }\n };\n\n const taskWidget = (\n <TaskManager\n ref={taskManagerRef}\n tasks={serviceTasks.map(task => {\n if (task.id === activeTaskId) {\n return {\n ...task,\n active: true\n };\n }\n return task;\n })}\n emptyText='No tasks added'\n banner={{\n icon: 'headset',\n content:\n 'Hi Ms. Ventura, I see that you are interested in changing your monthly due date, is that correct ?'\n }}\n onTaskLaunch={id => {\n performTaskAction(id, 'launch');\n }}\n onTaskDismiss={id => {\n performTaskAction(id, 'dismiss');\n }}\n addTask={{\n items: TaskPickerMockData.tasks,\n onAdd: renderTasks\n }}\n wrapUp={{\n disable: disableWrapUp,\n onClick: () => {\n performTaskAction(WRAP_UP_TASK_ID, 'launch');\n setDisableWrapUp(true);\n },\n active: activeTaskId === WRAP_UP_TASK_ID\n }}\n main={\n <TaskView\n header={\n <Text variant='h2'>\n {activeTaskId === WRAP_UP_TASK_ID\n ? 'Wrap up'\n : serviceTasks.find(task => task.id === activeTaskId)?.name}\n </Text>\n }\n actions={\n <MenuButton\n ref={formActionsElemRef}\n menu={{\n items: ['Option Number 1', 'Option Number 2', 'Option Number 3'].map(\n (name: string) => ({\n primary: name,\n id: name,\n onClick: () => {}\n })\n )\n }}\n text='Actions'\n />\n }\n >\n <Form\n actions={\n <>\n <Button\n name='Cancel'\n onClick={() => {\n performTaskAction(activeTaskId, 'cancel');\n }}\n >\n Cancel\n </Button>\n <div>\n <Button name='Save'>Save</Button>\n <Button\n name='Submit'\n variant='primary'\n onClick={() => {\n performTaskAction(activeTaskId, 'submit');\n }}\n >\n Submit\n </Button>\n </div>\n </>\n }\n >\n <Grid container={{ rowGap: 2 }}>\n {activeTaskId === WRAP_UP_TASK_ID ? (\n <TimelineDemo />\n ) : (\n Array.from({ length: 15 }, (undef, i) => {\n const idx = i + 1;\n return <Input label={`Field ${idx}`} key={idx} />;\n })\n )}\n </Grid>\n </Form>\n </TaskView>\n }\n />\n );\n\n return (\n <CaseViewDemo\n caseId='C-123'\n heading='Intelligent Guidance demo case'\n tasks={taskWidget}\n intelligentGuidance={\n <IntelligentGuidance\n items={items}\n heading='Intelligent guidance'\n isCollapsed={isCollapsed}\n onExpandCollapse={() => {\n setIsCollapsed(prevState => !prevState);\n }}\n />\n }\n />\n );\n};\n"]}

package/lib/work/Tags/Tags.stories.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tags.stories.d.ts","sourceRoot":"","sources":["../../../src/work/Tags/Tags.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAO/C,wBAGU;AAEV,UAAU,cAAc;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,cAAc,~~CAwD1C~~,CAAC"}
1	+ {"version":3,"file":"Tags.stories.d.ts","sourceRoot":"","sources":["../../../src/work/Tags/Tags.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAO/C,wBAGU;AAEV,UAAU,cAAc;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,cAAc,CA+D1C,CAAC"}

package/lib/work/Tags/Tags.stories.js CHANGED Viewed

@@ -27,9 +27,15 @@ export const TagsDemo = (args) => {
         setAvailableTags(filterValue ? allTags?.filter(tag => tag.startsWith(filterValue)) : []);
     }, [filterValue]);
     useEffect(() => {
+        let mounted = true;
         setTimeout(() => {
-            setLoading(false);
+            // Avoids: Warning: Can't perform a React state update on an unmounted component.
+            if (mounted)
+                setLoading(false);
         }, 1000);
+        return () => {
+            mounted = false;
+        };
     }, []);
     const handleEditTags = (selectedTags) => {
         return new Promise((resolve, reject) => {

package/lib/work/Tags/Tags.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tags.stories.js","sourceRoot":"","sources":["../../../src/work/Tags/Tags.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAE,IAAI,EAA0B,MAAM,yBAAyB,CAAC;AAEvE,OAAO,EAAE,aAAa,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAEnE,eAAe;IACb,KAAK,EAAE,WAAW;IAClB,SAAS,EAAE,IAAI;CACR,CAAC;AAQV,MAAM,CAAC,MAAM,QAAQ,GAA0B,CAAC,IAAoB,EAAE,EAAE;IACtE,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC7C,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,EAA8B,CAAC;IACjF,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACnD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAoB;QAClD,MAAM;QACN,QAAQ;QACR,eAAe;QACf,QAAQ;QACR,OAAO;QACP,MAAM;QACN,OAAO;QACP,OAAO;QACP,OAAO;QACP,SAAS;KACV,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,oBAAoB,EAAE,CAAC;QACvC,gBAAgB,CAAC,WAAW,CAAC,CAAC,CAAC,OAAO,EAAE,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;IAC3F,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,SAAS,CAAC,GAAG,EAAE;QACb,UAAU,CAAC,GAAG,EAAE;YACd,UAAU,CAAC,KAAK,CAAC,CAAC;~~QACpB~~,CAAC,EAAE,IAAI,CAAC,CAAC;~~IACX~~,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,cAAc,GAAG,CAAC,YAA2B,EAAE,EAAE;QACrD,OAAO,IAAI,OAAO,CAAO,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;YAC3C,IAAI,IAAI,CAAC,SAAS,EAAE;gBAClB,MAAM,CAAC,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;aACnC;iBAAM;gBACL,OAAO,CACL,YAAY,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;oBACrB,IAAI,GAAG,CAAC,MAAM,EAAE;wBACd,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;qBACzB;oBACD,OAAO,GAAG,CAAC,IAAI,CAAC;gBAClB,CAAC,CAAC,CACH,CAAC;gBACF,OAAO,EAAE,CAAC;aACX;QACH,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,IAAI,IACH,IAAI,EAAE,IAAI,EACV,aAAa,EAAE,aAAa,EAC5B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,EAClF,QAAQ,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,EAClD,UAAU,EAAE,cAAc,GAC1B,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,QAAQ,CAAC,IAAI,GAAG;IACd,KAAK,EAAE,EAAE;IACT,YAAY,EAAE,KAAK;IACnB,SAAS,EAAE,EAAE;CACd,CAAC;AAEF,QAAQ,CAAC,QAAQ,GAAG;IAClB,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACpC,YAAY,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC9C,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;CACzC,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useEffect, useState } from 'react';\n\nimport { Tags, SelectedTag, TagsProps } from '@pega/cosmos-react-work';\n\nimport { addNewMockTag, getMockAvailableTags } from './Tags.mocks';\n\nexport default {\n title: 'Work/Tags',\n component: Tags\n} as Meta;\n\ninterface TagsStoryProps {\n error?: string;\n displayRetry?: boolean;\n editError?: string;\n}\n\nexport const TagsDemo: Story<TagsStoryProps> = (args: TagsStoryProps) => {\n const [loading, setLoading] = useState(true);\n const [availableTags, setAvailableTags] = useState<TagsProps['availableTags']>();\n const [filterValue, setFilterValue] = useState('');\n const [tags, setTags] = useState<TagsProps['tags']>([\n 'Pega',\n 'Cosmos',\n 'Design_system',\n 'animal',\n 'bread',\n 'hour',\n 'music',\n 'paint',\n 'space',\n 'weather'\n ]);\n\n useEffect(() => {\n const allTags = getMockAvailableTags();\n setAvailableTags(filterValue ? allTags?.filter(tag => tag.startsWith(filterValue)) : []);\n }, [filterValue]);\n\n useEffect(() => {\n setTimeout(() => {\n setLoading(false);\n }, 1000);\n }, []);\n\n const handleEditTags = (selectedTags: SelectedTag[]) => {\n return new Promise<void>((resolve, reject) => {\n if (args.editError) {\n reject(new Error(args.editError));\n } else {\n setTags(\n selectedTags.map(tag => {\n if (tag.newTag) {\n addNewMockTag(tag.text);\n }\n return tag.text;\n })\n );\n resolve();\n }\n });\n };\n\n return (\n <Tags\n tags={tags}\n availableTags={availableTags}\n loading={loading}\n error={args.displayRetry ? { message: args.error, onRetry: () => {} } : args.error}\n onSearch={(query: string) => setFilterValue(query)}\n onEditTags={handleEditTags}\n />\n );\n};\n\nTagsDemo.args = {\n error: '',\n displayRetry: false,\n editError: ''\n};\n\nTagsDemo.argTypes = {\n error: { control: { type: 'text' } },\n displayRetry: { control: { type: 'boolean' } },\n editError: { control: { type: 'text' } }\n};\n"]}
1	+ {"version":3,"file":"Tags.stories.js","sourceRoot":"","sources":["../../../src/work/Tags/Tags.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAE,IAAI,EAA0B,MAAM,yBAAyB,CAAC;AAEvE,OAAO,EAAE,aAAa,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAEnE,eAAe;IACb,KAAK,EAAE,WAAW;IAClB,SAAS,EAAE,IAAI;CACR,CAAC;AAQV,MAAM,CAAC,MAAM,QAAQ,GAA0B,CAAC,IAAoB,EAAE,EAAE;IACtE,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC7C,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,EAA8B,CAAC;IACjF,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACnD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAoB;QAClD,MAAM;QACN,QAAQ;QACR,eAAe;QACf,QAAQ;QACR,OAAO;QACP,MAAM;QACN,OAAO;QACP,OAAO;QACP,OAAO;QACP,SAAS;KACV,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,oBAAoB,EAAE,CAAC;QACvC,gBAAgB,CAAC,WAAW,CAAC,CAAC,CAAC,OAAO,EAAE,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;IAC3F,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,OAAO,GAAG,IAAI,CAAC;QAEnB,UAAU,CAAC,GAAG,EAAE;YACd,iFAAiF;YACjF,IAAI,OAAO;gBAAE,UAAU,CAAC,KAAK,CAAC,CAAC;QACjC,CAAC,EAAE,IAAI,CAAC,CAAC;QAET,OAAO,GAAG,EAAE;YACV,OAAO,GAAG,KAAK,CAAC;QAClB,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,cAAc,GAAG,CAAC,YAA2B,EAAE,EAAE;QACrD,OAAO,IAAI,OAAO,CAAO,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;YAC3C,IAAI,IAAI,CAAC,SAAS,EAAE;gBAClB,MAAM,CAAC,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;aACnC;iBAAM;gBACL,OAAO,CACL,YAAY,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;oBACrB,IAAI,GAAG,CAAC,MAAM,EAAE;wBACd,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;qBACzB;oBACD,OAAO,GAAG,CAAC,IAAI,CAAC;gBAClB,CAAC,CAAC,CACH,CAAC;gBACF,OAAO,EAAE,CAAC;aACX;QACH,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,IAAI,IACH,IAAI,EAAE,IAAI,EACV,aAAa,EAAE,aAAa,EAC5B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,EAClF,QAAQ,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,cAAc,CAAC,KAAK,CAAC,EAClD,UAAU,EAAE,cAAc,GAC1B,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,QAAQ,CAAC,IAAI,GAAG;IACd,KAAK,EAAE,EAAE;IACT,YAAY,EAAE,KAAK;IACnB,SAAS,EAAE,EAAE;CACd,CAAC;AAEF,QAAQ,CAAC,QAAQ,GAAG;IAClB,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACpC,YAAY,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAC9C,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;CACzC,CAAC","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useEffect, useState } from 'react';\n\nimport { Tags, SelectedTag, TagsProps } from '@pega/cosmos-react-work';\n\nimport { addNewMockTag, getMockAvailableTags } from './Tags.mocks';\n\nexport default {\n title: 'Work/Tags',\n component: Tags\n} as Meta;\n\ninterface TagsStoryProps {\n error?: string;\n displayRetry?: boolean;\n editError?: string;\n}\n\nexport const TagsDemo: Story<TagsStoryProps> = (args: TagsStoryProps) => {\n const [loading, setLoading] = useState(true);\n const [availableTags, setAvailableTags] = useState<TagsProps['availableTags']>();\n const [filterValue, setFilterValue] = useState('');\n const [tags, setTags] = useState<TagsProps['tags']>([\n 'Pega',\n 'Cosmos',\n 'Design_system',\n 'animal',\n 'bread',\n 'hour',\n 'music',\n 'paint',\n 'space',\n 'weather'\n ]);\n\n useEffect(() => {\n const allTags = getMockAvailableTags();\n setAvailableTags(filterValue ? allTags?.filter(tag => tag.startsWith(filterValue)) : []);\n }, [filterValue]);\n\n useEffect(() => {\n let mounted = true;\n\n setTimeout(() => {\n // Avoids: Warning: Can't perform a React state update on an unmounted component.\n if (mounted) setLoading(false);\n }, 1000);\n\n return () => {\n mounted = false;\n };\n }, []);\n\n const handleEditTags = (selectedTags: SelectedTag[]) => {\n return new Promise<void>((resolve, reject) => {\n if (args.editError) {\n reject(new Error(args.editError));\n } else {\n setTags(\n selectedTags.map(tag => {\n if (tag.newTag) {\n addNewMockTag(tag.text);\n }\n return tag.text;\n })\n );\n resolve();\n }\n });\n };\n\n return (\n <Tags\n tags={tags}\n availableTags={availableTags}\n loading={loading}\n error={args.displayRetry ? { message: args.error, onRetry: () => {} } : args.error}\n onSearch={(query: string) => setFilterValue(query)}\n onEditTags={handleEditTags}\n />\n );\n};\n\nTagsDemo.args = {\n error: '',\n displayRetry: false,\n editError: ''\n};\n\nTagsDemo.argTypes = {\n error: { control: { type: 'text' } },\n displayRetry: { control: { type: 'boolean' } },\n editError: { control: { type: 'text' } }\n};\n"]}

package/lib/work/Tasks/Tasks.stories.d.ts.map CHANGED Viewed

	@@ -1 +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;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"}
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;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,CAoJ5C,CAAC"}

package/lib/work/Tasks/Tasks.stories.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useMemo, useState } from 'react';
+import { useEffect, useState } from 'react';
 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 {
@@ -23,25 +23,34 @@ export const TasksDemo = (args) => {
             };
         });
     });
-    const activeGroup = useMemo(() => menuHelpers.getSelected(workGroups)[0], [workGroups]);
+    const activeGroup = menuHelpers.getSelected(workGroups)[0];
     const activeGroupTaskCount = activeGroup?.count ?? 0;
-    const groupSelection = useMemo(() => {
-        return (_jsx(MenuButton, { variant: 'text', text: activeGroup.primary, menu: {
-                mode: 'single-select',
-                items: workGroups,
-                onItemClick: id => {
-                    setWorkGroups(currentWorkGroups => {
-                        return menuHelpers.mapTree(currentWorkGroups, group => {
-                            if (id === group.id || group.selected) {
-                                return { ...group, selected: id === group.id };
-                            }
-                            return group;
-                        });
-                    });
+    useEffect(() => {
+        setWorkGroups(cur => {
+            return cur.map(group => {
+                if (group.id === activeGroup.id) {
+                    // Asserting as args.count changes will always be a number in demo
+                    return { ...group, count: args.count };
                 }
-            } }));
-    }, [activeGroup.primary, workGroups]);
-    const taskArray = useMemo(() => Array.from({ length: isLimited ? Math.min(3, activeGroupTaskCount) : activeGroupTaskCount }, (_, i) => {
+                return group;
+            });
+        });
+    }, [args.count]);
+    const groupSelection = (_jsx(MenuButton, { variant: 'text', text: activeGroup.primary, menu: {
+            mode: 'single-select',
+            items: workGroups,
+            onItemClick: id => {
+                setWorkGroups(currentWorkGroups => {
+                    return menuHelpers.mapTree(currentWorkGroups, group => {
+                        if (id === group.id || group.selected) {
+                            return { ...group, selected: id === group.id };
+                        }
+                        return group;
+                    });
+                });
+            }
+        } }));
+    const taskArray = Array.from({ length: isLimited ? Math.min(3, activeGroupTaskCount) : activeGroupTaskCount }, (_, i) => {
         const dueIn = 86400000 * i;
         let status = 'info';
         if (i === 0) {
@@ -70,7 +79,7 @@ export const TasksDemo = (args) => {
                     setHasOpenTask(false);
                 } })) : null
         };
-    }), [isLimited, activeGroupTaskCount, args.openableTasks, hasOpenTask]);
+    });
     return (_jsx(Tasks, { headerText: args.headerText || 'Tasks', count: activeGroupTaskCount, items: taskArray, headerVisual: args.showHeaderVisual && activeGroup ? (_jsx(Avatar, { size: 'l', name: activeGroup.primary })) : undefined, headerSecondary: args.showHeaderSecondary ? groupSelection : undefined, emptyPlaceholder: _jsx(EmptyState, {}), onExpandToggle: () => {
             setIsLimited(cur => !cur);
         } }));

package/lib/work/Tasks/Tasks.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tasks.stories.js","sourceRoot":"","sources":["../../../src/work/Tasks/Tasks.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EACL,MAAM,EACN,MAAM,EACN,UAAU,EAEV,QAAQ,EACR,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,eAAe,EACf,WAAW,EACX,QAAQ,EACR,SAAS,EACT,WAAW,EACX,SAAS,EACT,WAAW,EACX,MAAM,EACN,IAAI,EACJ,eAAe,EAEf,UAAU,EACV,IAAI,EACL,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,KAAK,EAA6B,MAAM,yBAAyB,CAAC;AAE3E,eAAe;IACb,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,KAAK;CACT,CAAC;AAUV,MAAM,CAAC,MAAM,SAAS,GAA2B,CAAC,IAAqB,EAAE,EAAE;IACzE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACjD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEtD,MAAM,YAAY,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAkD,EAAE,EAAE;QAC9F,OAAO,CACL,KAAC,IAAI,IACH,OAAO,EACL,8BACE,KAAC,MAAM,IAAC,OAAO,EAAE,QAAQ,uBAAiB,EAC1C,KAAC,MAAM,IAAC,OAAO,EAAC,SAAS,EAAC,OAAO,EAAE,QAAQ,uBAElC,IACR,YAGL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,EAAE,aAClD,KAAC,KAAK,IAAC,KAAK,EAAC,cAAc,EAAC,QAAQ,SAAG,EACvC,KAAC,KAAK,IAAC,KAAK,EAAC,cAAc,GAAG,EAC9B,KAAC,WAAW,IAAC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,KAAK,EAAC,cAAc,GAAG,EACxD,KAAC,QAAQ,IAAC,KAAK,EAAC,eAAe,EAAC,QAAQ,SAAG,EAC3C,MAAC,eAAe,IAAC,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,YAAY,aACzD,KAAC,WAAW,IAAC,KAAK,EAAC,UAAU,EAAC,cAAc,SAAG,EAC/C,KAAC,WAAW,IAAC,KAAK,EAAC,UAAU,GAAG,EAChC,KAAC,WAAW,IAAC,KAAK,EAAC,UAAU,GAAG,IAChB,EAClB,KAAC,QAAQ,IAAC,KAAK,EAAC,sBAAsB,EAAC,QAAQ,SAAG,EAClD,KAAC,SAAS,IAAC,KAAK,EAAC,YAAY,GAAG,EAChC,KAAC,SAAS,IAAC,KAAK,EAAC,gBAAgB,GAAG,IAC/B,GACF,CACR,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAqB,GAAG,EAAE;QACpE,OAAO,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;YACzC,OAAO;gBACL,EAAE,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE;gBACd,OAAO,EAAE,aAAa,CAAC,GAAG,CAAC,EAAE;gBAC7B,KAAK,EAAE,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC;gBACnF,QAAQ,EAAE,CAAC,KAAK,CAAC;gBACjB,MAAM,EAAE,KAAC,MAAM,IAAC,IAAI,EAAC,GAAG,EAAC,IAAI,EAAE,QAAQ,CAAC,GAAG,CAAC,EAAE,GAAI;aACnD,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,WAAW,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IACxF,MAAM,oBAAoB,GAAG,WAAW,EAAE,KAAK,IAAI,CAAC,CAAC;IAErD,MAAM,cAAc,GAAG,OAAO,CAAC,GAAG,EAAE;QAClC,OAAO,CACL,KAAC,UAAU,IACT,OAAO,EAAC,MAAM,EACd,IAAI,EAAE,WAAW,CAAC,OAAO,EACzB,IAAI,EAAE;gBACJ,IAAI,EAAE,eAAe;gBACrB,KAAK,EAAE,UAAU;gBACjB,WAAW,EAAE,EAAE,CAAC,EAAE;oBAChB,aAAa,CAAC,iBAAiB,CAAC,EAAE;wBAChC,OAAO,WAAW,CAAC,OAAO,CAAC,iBAAiB,EAAE,KAAK,CAAC,EAAE;4BACpD,IAAI,EAAE,KAAK,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,QAAQ,EAAE;gCACrC,OAAO,EAAE,GAAG,KAAK,EAAE,QAAQ,EAAE,EAAE,KAAK,KAAK,CAAC,EAAE,EAAE,CAAC;6BAChD;4BAED,OAAO,KAAK,CAAC;wBACf,CAAC,CAAC,CAAC;oBACL,CAAC,CAAC,CAAC;gBACL,CAAC;aACF,GACD,CACH,CAAC;IACJ,CAAC,EAAE,CAAC,WAAW,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC;IAEtC,MAAM,SAAS,GAAoB,OAAO,CACxC,GAAG,EAAE,CACH,KAAK,CAAC,IAAI,CACR,EAAE,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,oBAAoB,CAAC,CAAC,CAAC,CAAC,oBAAoB,EAAE,EAChF,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;QACP,MAAM,KAAK,GAAG,QAAQ,GAAG,CAAC,CAAC;QAC3B,IAAI,MAAM,GAA2B,MAAM,CAAC;QAE5C,IAAI,CAAC,KAAK,CAAC,EAAE;YACX,MAAM,GAAG,QAAQ,CAAC;SACnB;aAAM,IAAI,CAAC,KAAK,CAAC,EAAE;YAClB,MAAM,GAAG,MAAM,CAAC;SACjB;QAED,OAAO;YACL,EAAE,EAAE,GAAG,CAAC,EAAE;YACV,IAAI,EAAE,QAAQ,CAAC,GAAG,CAAC,EAAE;YACrB,WAAW,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS;YAC/C,IAAI,EAAE,CACJ,KAAC,QAAQ,IACP,KAAK,EAAE;oBACL,KAAC,MAAM,IAAC,OAAO,EAAE,MAAM,YAAG,MAAM,GAAU;oBAC1C,MAAC,IAAI,IAAC,OAAO,EAAC,WAAW,qBACnB,KAAC,eAAe,IAAC,OAAO,EAAC,UAAU,EAAC,KAAK,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,KAAK,GAAI,IAChE;oBACP,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,iCAAwB;iBAC3C,GACD,CACH;YACD,MAAM,EACJ,IAAI,CAAC,aAAa,KAAK,KAAK;gBAC1B,CAAC,CAAC,GAAG,EAAE;oBACH,cAAc,CAAC,IAAI,CAAC,CAAC;gBACvB,CAAC;gBACH,CAAC,CAAC,SAAS;YACf,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CACrB,KAAC,YAAY,IACX,QAAQ,EAAE,GAAG,EAAE;oBACb,cAAc,CAAC,KAAK,CAAC,CAAC;gBACxB,CAAC,EACD,QAAQ,EAAE,GAAG,EAAE;oBACb,cAAc,CAAC,KAAK,CAAC,CAAC;gBACxB,CAAC,GACD,CACH,CAAC,CAAC,CAAC,IAAI;SACT,CAAC;IACJ,CAAC,CACF,EACH,CAAC,SAAS,EAAE,oBAAoB,EAAE,IAAI,CAAC,aAAa,EAAE,WAAW,CAAC,CACnE,CAAC;IAEF,OAAO,CACL,KAAC,KAAK,IACJ,UAAU,EAAE,IAAI,CAAC,UAAU,IAAI,OAAO,EACtC,KAAK,EAAE,oBAAoB,EAC3B,KAAK,EAAE,SAAS,EAChB,YAAY,EACV,IAAI,CAAC,gBAAgB,IAAI,WAAW,CAAC,CAAC,CAAC,CACrC,KAAC,MAAM,IAAC,IAAI,EAAC,GAAG,EAAC,IAAI,EAAE,WAAW,CAAC,OAAO,GAAI,CAC/C,CAAC,CAAC,CAAC,SAAS,EAEf,eAAe,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,EACtE,gBAAgB,EAAE,KAAC,UAAU,KAAG,EAChC,cAAc,EAAE,GAAG,EAAE;YACnB,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;QAC5B,CAAC,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,SAAS,CAAC,IAAI,GAAG;IACf,UAAU,EAAE,OAAO;IACnB,gBAAgB,EAAE,IAAI;IACtB,mBAAmB,EAAE,IAAI;IACzB,KAAK,EAAE,SAAS;IAChB,aAAa,EAAE,IAAI;CACpB,CAAC;AAEF,SAAS,CAAC,QAAQ,GAAG;IACnB,UAAU,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IACzC,gBAAgB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAClD,mBAAmB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IACrD,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IACtC,aAAa,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;CAChD,CAAC","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"]}
1	+ {"version":3,"file":"Tasks.stories.js","sourceRoot":"","sources":["../../../src/work/Tasks/Tasks.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useEffect, 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 = menuHelpers.getSelected(workGroups)[0];\n const activeGroupTaskCount = activeGroup?.count ?? 0;\n\n useEffect(() => {\n setWorkGroups(cur => {\n return cur.map(group => {\n if (group.id === activeGroup.id) {\n // Asserting as args.count changes will always be a number in demo\n return { ...group, count: args.count! };\n }\n\n return group;\n });\n });\n }, [args.count]);\n\n const groupSelection = (\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\n const taskArray: TaskItemProps[] = 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\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/lib/wss/CaseView/CaseView.stories.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CaseView.stories.d.ts","sourceRoot":"","sources":["../../../src/wss/CaseView/CaseView.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;~~AAe~~/C,wBAMU;AAEV,UAAU,iBAAiB;IACzB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,iBAAiB,~~CA4EjD~~,CAAC"}
1	+ {"version":3,"file":"CaseView.stories.d.ts","sourceRoot":"","sources":["../../../src/wss/CaseView/CaseView.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAoB/C,wBAMU;AAEV,UAAU,iBAAiB;IACzB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,iBAAiB,CAqFjD,CAAC"}

package/lib/wss/CaseView/CaseView.stories.js CHANGED Viewed

@@ -1,7 +1,9 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { AppShell, CaseView } from '@pega/cosmos-react-wss';
-import { CaseSummaryFields, Stages } from '@pega/cosmos-react-work';
+import { Stages } from '@pega/cosmos-react-work';
+import { Grid } from '@pega/cosmos-react-core';
+import { StyledSummaryPrimaryList, StyledSummarySecondaryList } from '@pega/cosmos-react-work/lib/components/CaseView/CaseView.styles';
 import { AttachmentsMock } from '../../work/CaseView/Attachments.mocks';
 import { FeedPostDemo } from '../../social/Feed/FeedPost.stories';
 import { casePreviewPrimaryFields, casePreviewSecondaryFields } from '../../work/CaseView/CaseView.mocks';
@@ -28,7 +30,7 @@ export const CaseViewDemo = (args) => {
                 : undefined, summary: args.showSummaryRegion
                 ? {
                     label: 'Summary',
-                    content: (_jsx(CaseSummaryFields, { primary: casePreviewPrimaryFields, secondary: casePreviewSecondaryFields }))
+                    content: (_jsxs(Grid, { container: { rowGap: 2, pad: [1.5, 2] }, children: [_jsx(StyledSummaryPrimaryList, { variant: 'stacked', fields: casePreviewPrimaryFields, "aria-label": 'Primary summary fields' }), _jsx(StyledSummarySecondaryList, { variant: 'inline', fields: casePreviewSecondaryFields, "aria-label": 'Secondary summary fields' })] }))
                 }
                 : undefined, feed: args.showPulseRegion ? { label: 'Feed', content: _jsx(FeedPostDemo, {}) } : undefined, utility: args.showUtilitiesRegion
                 ? { label: 'Utility', content: _jsx(AttachmentsMock, {}) }

package/lib/wss/CaseView/CaseView.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CaseView.stories.js","sourceRoot":"","sources":["../../../src/wss/CaseView/CaseView.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,~~iBAAiB~~,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;~~AAEpE~~,OAAO,EAAE,eAAe,EAAE,MAAM,uCAAuC,CAAC;AACxE,OAAO,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAClE,OAAO,EACL,wBAAwB,EACxB,0BAA0B,EAC3B,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAC3D,OAAO,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAEjE,eAAe;IACb,KAAK,EAAE,2BAA2B;IAClC,SAAS,EAAE,QAAQ;IACnB,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACM,CAAC;AAUV,MAAM,CAAC,MAAM,YAAY,GAA6B,CAAC,IAAuB,EAAE,EAAE;IAChF,MAAM,CAAC,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC;IAE5C,OAAO,CACL,KAAC,QAAQ,IACP,MAAM,EAAC,MAAM,EACb,IAAI,EACF,KAAC,QAAQ,IACP,OAAO,EAAC,2DAA2D,EACnE,OAAO,EAAE,CAAC,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,EACzC,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,KAAC,SAAS,KAAG,EAAE,EACjD,MAAM,EACJ,IAAI,CAAC,gBAAgB;gBACnB,CAAC,CAAC;oBACE,KAAK,EAAE,QAAQ;oBACf,OAAO,EAAE,CACP,KAAC,MAAM,IACL,MAAM,EAAE;4BACN,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,EAAE;4BAC5C,EAAE,IAAI,EAAE,cAAc,EAAE,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE;4BACnD,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE;yBAC/C,EACD,OAAO,EAAC,EAAE,GACV,CACH;iBACF;gBACH,CAAC,CAAC,SAAS,EAEf,OAAO,EACL,IAAI,CAAC,iBAAiB;gBACpB,CAAC,CAAC;oBACE,KAAK,EAAE,SAAS;oBAChB,OAAO,EAAE,CACP,KAAC,~~iBAAiB~~,~~IAChB~~,OAAO,EAAE,wBAAwB,~~EACjC~~,~~SAAS~~,EAAE,0BAA0B,GACrC,~~CACH~~;iBACF;gBACH,CAAC,CAAC,SAAS,EAEf,IAAI,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,KAAC,YAAY,KAAG,EAAE,CAAC,CAAC,CAAC,SAAS,EACrF,OAAO,EACL,IAAI,CAAC,mBAAmB;gBACtB,CAAC,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,KAAC,eAAe,KAAG,EAAE;gBACpD,CAAC,CAAC,SAAS,GAEf,EAEJ,OAAO,EAAE;YACP,OAAO,EAAE,UAAU;YACnB,QAAQ,EAAE,uEAAuE;SAClF,EACD,QAAQ,EAAE,KAAK,CAAC,IAAI,CAAC;YACnB,MAAM,EAAE,mBAAmB,CAAC,gBAAgB;SAC7C,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE;YAClB,MAAM,OAAO,GAAG,cAAc,KAAK,GAAG,CAAC,EAAE,CAAC;YAE1C,OAAO;gBACL,EAAE,EAAE,OAAO,KAAK,GAAG,CAAC,EAAE;gBACtB,IAAI,EAAE,OAAO;gBACb,IAAI,EAAE,GAAG;gBACT,OAAO,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,OAAO,CAAC;aACvC,CAAC;QACJ,CAAC,CAAC,EACF,QAAQ,EAAE;YACR,MAAM,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;YACzB,KAAK,EAAE,OAAO;YACd,OAAO,EAAE;gBACP,EAAE,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,YAAY,EAAE,IAAI,EAAE,GAAG,EAAE;gBACnD,EAAE,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE;gBAClD,EAAE,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,EAAE;aAChD;SACF,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,YAAY,CAAC,IAAI,GAAG;IAClB,gBAAgB,EAAE,IAAI;IACtB,mBAAmB,EAAE,IAAI;IACzB,iBAAiB,EAAE,IAAI;IACvB,eAAe,EAAE,IAAI;CACtB,CAAC;AAEF,YAAY,CAAC,QAAQ,GAAG;IACtB,gBAAgB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IAClD,mBAAmB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IACrD,iBAAiB,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IACnD,eAAe,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;CAClD,CAAC","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"]}
1	+ {"version":3,"file":"CaseView.stories.js","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 { Stages } from '@pega/cosmos-react-work';\nimport { Grid } from '@pega/cosmos-react-core';\nimport {\n StyledSummaryPrimaryList,\n StyledSummarySecondaryList\n} from '@pega/cosmos-react-work/lib/components/CaseView/CaseView.styles';\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 <Grid container={{ rowGap: 2, pad: [1.5, 2] }}>\n <StyledSummaryPrimaryList\n variant='stacked'\n fields={casePreviewPrimaryFields}\n aria-label='Primary summary fields'\n />\n\n <StyledSummarySecondaryList\n variant='inline'\n fields={casePreviewSecondaryFields}\n aria-label='Secondary summary fields'\n />\n </Grid>\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/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@pega/cosmos-react-demos",
-  "version": "4.0.0-dev.12.1",
+  "version": "4.0.0-dev.13.0",
   "author": "Pegasystems",
   "license": "SEE LICENSE IN LICENSE",
   "repository": {
@@ -20,14 +20,14 @@
     "build": "tsc -b"
   },
   "dependencies": {
-    "@pega/cosmos-react-build": "4.0.0-dev.12.1",
-    "@pega/cosmos-react-condition-builder": "4.0.0-dev.12.1",
-    "@pega/cosmos-react-core": "4.0.0-dev.12.1",
-    "@pega/cosmos-react-cs": "4.0.0-dev.12.1",
-    "@pega/cosmos-react-dnd": "4.0.0-dev.12.1",
-    "@pega/cosmos-react-rte": "4.0.0-dev.12.1",
-    "@pega/cosmos-react-social": "4.0.0-dev.12.1",
-    "@pega/cosmos-react-work": "4.0.0-dev.12.1",
+    "@pega/cosmos-react-build": "4.0.0-dev.13.0",
+    "@pega/cosmos-react-condition-builder": "4.0.0-dev.13.0",
+    "@pega/cosmos-react-core": "4.0.0-dev.13.0",
+    "@pega/cosmos-react-cs": "4.0.0-dev.13.0",
+    "@pega/cosmos-react-dnd": "4.0.0-dev.13.0",
+    "@pega/cosmos-react-rte": "4.0.0-dev.13.0",
+    "@pega/cosmos-react-social": "4.0.0-dev.13.0",
+    "@pega/cosmos-react-work": "4.0.0-dev.13.0",
     "@types/emoji-mart": "^3.0.4",
     "@types/react": "^16.14.24 || ^17.0.38",
     "@types/react-dom": "^16.9.14 || ^17.0.11",