npm - @pega/cosmos-react-work - Versions diffs - 3.0.0-rc.3 → 3.0.0-rc.5 - Mend

@pega/cosmos-react-work 3.0.0-rc.3 → 3.0.0-rc.5

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 (33) hide show

package/lib/components/CaseView/CaseView.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CaseView.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAyD,MAAM,OAAO,CAAC;AAElF,OAAO,EAUL,YAAY,EASb,MAAM,yBAAyB,CAAC;AAiBjC,OAAO,EAAwB,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKvE,QAAA,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,GAAG,YAAY,~~CAwc9C~~,CAAC;AAEF,eAAe,QAAQ,CAAC"}
1	+ {"version":3,"file":"CaseView.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAyD,MAAM,OAAO,CAAC;AAElF,OAAO,EAUL,YAAY,EASb,MAAM,yBAAyB,CAAC;AAiBjC,OAAO,EAAwB,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKvE,QAAA,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,GAAG,YAAY,CAid9C,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/lib/components/CaseView/CaseView.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEffect, useMemo, useRef, useLayoutEffect, useState } from 'react';
 import { Button, Flex, Grid, Icon, registerIcon, TabPanel, useBreakpoint, useScrollStick, useElement, Card, Drawer, useI18n, useDirection, Tabs, useAfterInitialEffect, windowIsAvailable } from '@pega/cosmos-react-core';
 import * as moveRightSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/move-right-solid.icon';
@@ -20,7 +20,7 @@ banners, stages, tasks, tabContent: tabContentProp = [],
 // Utilities content and state props
 utilities, utilitiesSummaryItems, utilitiesExpanded: utilitiesExpandedProp = true, onToggleUtilities,
 // Etc...
-persistentUtility, isPreview = false, ...restProps }) => {
+persistentUtility, intelligentGuidance, isPreview = false, ...restProps }) => {
     // General util hooks
     const t = useI18n();
     const direction = useDirection();
@@ -247,6 +247,7 @@ persistentUtility, isPreview = false, ...restProps }) => {
             currentTabId
         },
         persistentUtility,
+        intelligentGuidance,
         summaryId,
         summaryExpanded,
         utilitiesExpanded,
@@ -257,31 +258,31 @@ persistentUtility, isPreview = false, ...restProps }) => {
         aboveXL: xlOrAbove
     };
     // Here we go...
-    return (_jsx(CaseViewContext.Provider, { value: ctxValue, children: _jsxs(Grid, { as: StyledCaseView, ref: caseViewRef, container: caseViewGridContainer, item: { area: 'case-view' }, ...restProps, children: [_jsx(Grid
-                // Used for aria-controls on the toggle button
-                , {
-                    // Used for aria-controls on the toggle button
-                    id: summaryId, as: StyledSummary, item: { area: 'summary' }, desktop: mdOrAbove && (!persistentUtility || xlOrAbove) && !summaryExpanded, isLargeOrAbove: lgOrAbove, ref: summaryRef, children: _jsx(CaseSummary, {}) }), _jsxs(Flex, { container: {
-                        direction: 'column',
-                        alignContent: 'start',
-                        rowGap: 2
-                    }, as: StyledWorkArea, persistentUtility: Boolean(persistentUtility), children: [banners && _jsx("div", { children: banners }), stages && _jsx("div", { children: stages }), tasks && _jsx("div", { children: tasks }), (!mdOrAbove || (persistentUtility && !xlOrAbove) || !summaryExpanded) && (_jsx(Tabs, { tabs: tabItems, onTabClick: onTabClick, currentTabId: currentTabId })), _jsx("div", { ref: setTabContentEl, children: tabContent?.map(({ id, content }) => (_jsx(TabPanel, { currentTabId: currentTabId, tabId: id, children: content }, id))) })] }), persistentUtility && mdOrAbove && (_jsx(Grid, { as: StyledPersistentUtility, item: { area: 'persistentUtility' }, children: persistentUtility.content })), utilities && mdOrAbove && !lgOrAbove && utilitiesExpanded && (_jsx(Drawer, { as: StyledCaseDrawer, open: utilitiesExpanded, position: 'fixed', placement: direction.end, shadow: true, nullWhenClosed: true, hasPersistentUtility: !!persistentUtility, children: _jsxs(Flex, { as: StyledCaseDrawerContent, container: { direction: 'column', gap: 2 }, id: utilitiesDrawerId, children: [_jsx(Flex, { container: { justify: 'end' }, children: _jsx(Button, { "aria-expanded": utilitiesExpanded ? 'true' : 'false', "aria-controls": utilitiesDrawerId, variant: 'simple', icon: true, onClick: onToggleUtilities, as: StyledUtilToggle, label: t('collapse_utilities_panel'), children: _jsx(Icon, { name: `move-${direction.end}-solid` }) }) }), utilities] }) })), utilities && mdOrAbove && (_jsxs(Grid, { ref: (el) => {
-                        if (el)
-                            (scrollStickOptions.current?.elements).push(el);
-                    }, as: StyledUtilities, container: {
-                        cols: 'minmax(0, 1fr)',
-                        rowGap: 2,
-                        pad: [2, 0, 2]
-                    }, item: {
-                        area: 'utilities'
-                    }, children: [_jsx(Flex, { container: { justify: utilitiesExpanded ? 'end' : 'center' }, children: _jsx(Button, { "aria-expanded": utilitiesExpanded ? 'true' : 'false', "aria-controls": lgOrAbove ? utilitiesId : utilitiesDrawerId, variant: 'simple', icon: true, onClick: () => {
-                                    if (!obeyUtilitiesExpandedProp && utilitiesExpandedProp) {
-                                        setObeyUtilitiesExpandedProp(true);
-                                    }
-                                    else {
-                                        onToggleUtilities?.();
-                                    }
-                                }, as: StyledUtilToggle, label: t(utilitiesExpanded ? 'collapse_utilities_panel' : 'expand_utilities_panel'), children: _jsx(Icon, { name: `move-${utilitiesExpanded ? direction.end : direction.start}-solid` }) }) }), lgOrAbove && utilitiesExpanded && (_jsx(Flex, { container: { direction: 'column', gap: 2 }, id: utilitiesId, children: utilities })), (!utilitiesExpanded || (mdOrAbove && !lgOrAbove)) && (_jsx(UtilitiesSummary, { items: utilitiesSummaryItems, onClick: onToggleUtilities, "aria-expanded": utilitiesExpanded ? 'true' : 'false', "aria-controls": lgOrAbove ? utilitiesId : utilitiesDrawerId }))] }))] }) }));
+    return (_jsxs(_Fragment, { children: [_jsx(CaseViewContext.Provider, { value: ctxValue, children: _jsxs(Grid, { as: StyledCaseView, ref: caseViewRef, container: caseViewGridContainer, item: { area: 'case-view' }, ...restProps, children: [_jsx(Grid
+                        // Used for aria-controls on the toggle button
+                        , {
+                            // Used for aria-controls on the toggle button
+                            id: summaryId, as: StyledSummary, item: { area: 'summary' }, desktop: mdOrAbove && (!persistentUtility || xlOrAbove) && !summaryExpanded, isLargeOrAbove: lgOrAbove, ref: summaryRef, children: _jsx(CaseSummary, {}) }), _jsxs(Flex, { container: {
+                                direction: 'column',
+                                alignContent: 'start',
+                                rowGap: 2
+                            }, as: StyledWorkArea, persistentUtility: Boolean(persistentUtility), children: [banners && _jsx("div", { children: banners }), stages && _jsx("div", { children: stages }), tasks && _jsx("div", { children: tasks }), (!mdOrAbove || (persistentUtility && !xlOrAbove) || !summaryExpanded) && (_jsx(Tabs, { tabs: tabItems, onTabClick: onTabClick, currentTabId: currentTabId })), _jsx("div", { ref: setTabContentEl, children: tabContent?.map(({ id, content }) => (_jsx(TabPanel, { currentTabId: currentTabId, tabId: id, children: content }, id))) })] }), persistentUtility && mdOrAbove && (_jsx(Grid, { as: StyledPersistentUtility, item: { area: 'persistentUtility' }, children: persistentUtility.content })), utilities && mdOrAbove && !lgOrAbove && utilitiesExpanded && (_jsx(Drawer, { as: StyledCaseDrawer, open: utilitiesExpanded, position: 'fixed', placement: direction.end, shadow: true, nullWhenClosed: true, hasPersistentUtility: !!persistentUtility, children: _jsxs(Flex, { as: StyledCaseDrawerContent, container: { direction: 'column', gap: 2 }, id: utilitiesDrawerId, children: [_jsx(Flex, { container: { justify: 'end' }, children: _jsx(Button, { "aria-expanded": utilitiesExpanded ? 'true' : 'false', "aria-controls": utilitiesDrawerId, variant: 'simple', icon: true, onClick: onToggleUtilities, as: StyledUtilToggle, label: t('collapse_utilities_panel'), children: _jsx(Icon, { name: `move-${direction.end}-solid` }) }) }), utilities] }) })), utilities && mdOrAbove && (_jsxs(Grid, { ref: (el) => {
+                                if (el)
+                                    (scrollStickOptions.current?.elements).push(el);
+                            }, as: StyledUtilities, container: {
+                                cols: 'minmax(0, 1fr)',
+                                rowGap: 2,
+                                pad: [2, 0, 2]
+                            }, item: {
+                                area: 'utilities'
+                            }, children: [_jsx(Flex, { container: { justify: utilitiesExpanded ? 'end' : 'center' }, children: _jsx(Button, { "aria-expanded": utilitiesExpanded ? 'true' : 'false', "aria-controls": lgOrAbove ? utilitiesId : utilitiesDrawerId, variant: 'simple', icon: true, onClick: () => {
+                                            if (!obeyUtilitiesExpandedProp && utilitiesExpandedProp) {
+                                                setObeyUtilitiesExpandedProp(true);
+                                            }
+                                            else {
+                                                onToggleUtilities?.();
+                                            }
+                                        }, as: StyledUtilToggle, label: t(utilitiesExpanded ? 'collapse_utilities_panel' : 'expand_utilities_panel'), children: _jsx(Icon, { name: `move-${utilitiesExpanded ? direction.end : direction.start}-solid` }) }) }), lgOrAbove && utilitiesExpanded && (_jsx(Flex, { container: { direction: 'column', gap: 2 }, id: utilitiesId, children: utilities })), (!utilitiesExpanded || (mdOrAbove && !lgOrAbove)) && (_jsx(UtilitiesSummary, { items: utilitiesSummaryItems, onClick: onToggleUtilities, "aria-expanded": utilitiesExpanded ? 'true' : 'false', "aria-controls": lgOrAbove ? utilitiesId : utilitiesDrawerId }))] }))] }) }), intelligentGuidance] }));
 };
 export default CaseView;
 //# sourceMappingURL=CaseView.js.map

package/lib/components/CaseView/CaseView.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CaseView.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, useEffect, useMemo, useRef, useLayoutEffect, useState } from 'react';\n\nimport {\n Button,\n Flex,\n Grid,\n Icon,\n registerIcon,\n TabPanel,\n useBreakpoint,\n useScrollStick,\n useElement,\n ForwardProps,\n Card,\n Drawer,\n useI18n,\n useDirection,\n Tabs,\n TabsProps,\n useAfterInitialEffect,\n windowIsAvailable\n} from '@pega/cosmos-react-core';\nimport { ScrollStickOptions } from '@pega/cosmos-react-core/lib/hooks/useScrollStick';\nimport * as moveRightSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/move-right-solid.icon';\nimport * as moveLeftSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/move-left-solid.icon';\n\nimport CaseSummary from './CaseSummary';\nimport UtilitiesSummary from './UtilitiesSummary';\nimport {\n StyledCaseDrawer,\n StyledCaseDrawerContent,\n StyledCaseView,\n StyledWorkArea,\n StyledPersistentUtility,\n StyledSummary,\n StyledUtilities,\n StyledUtilToggle\n} from './CaseView.styles';\nimport { CaseViewContextValue, CaseViewProps } from './CaseView.types';\nimport CaseViewContext from './CaseView.context';\n\nregisterIcon(moveRightSolidIcon, moveLeftSolidIcon);\n\nconst CaseView: FC<CaseViewProps & ForwardProps> = ({\n // Case data mostly visually related to the case header\n caseId,\n heading,\n subheading,\n caseLink,\n parentCases,\n icon,\n followed,\n onFollowedChange,\n onEdit,\n actions,\n promotedActions,\n\n // Summary content and state props\n summary,\n summaryExpanded: summaryExpandedProp = true,\n onToggleSummary,\n\n // Case tabs\n tabs: { currentTabId, items: tabItemsProp, onClick: onTabClick },\n\n // Workarea related content props\n banners,\n stages,\n tasks,\n tabContent: tabContentProp = [],\n\n // Utilities content and state props\n utilities,\n utilitiesSummaryItems,\n utilitiesExpanded: utilitiesExpandedProp = true,\n onToggleUtilities,\n\n // Etc...\n persistentUtility,\n isPreview = false,\n ...restProps\n}: CaseViewProps) => {\n // General util hooks\n const t = useI18n();\n const direction = useDirection();\n\n // Element refs\n const caseViewRef = useRef<HTMLDivElement>(null);\n const summaryRef = useRef<HTMLDivElement>(null);\n\n // Tab content\n const [tabContentEl, setTabContentEl] = useElement<HTMLElement>(null);\n\n // Breakpoint booleans\n const mdOrAbove = useBreakpoint('md', { breakpointRef: caseViewRef });\n const lgOrAbove = useBreakpoint('lg', { breakpointRef: caseViewRef });\n const xlOrAbove = useBreakpoint('xl', { breakpointRef: caseViewRef });\n\n // DOM ids\n const summaryTabId = `summary-${caseId}`;\n const utilitiesTabId = `utilities-${caseId}`;\n const persistentUtilityTabId = `persistent-utility-${caseId}`;\n const summaryId = `summary-${caseId}`;\n const utilitiesId = `utilities-${caseId}`;\n const utilitiesDrawerId = `utilities-drawer-${caseId}`;\n\n // Summary state handling\n let summaryExpanded = !!summaryExpandedProp;\n if (persistentUtility) {\n summaryExpanded = xlOrAbove;\n }\n\n // Utilities state handling\n\n // Used in coordination with a layoutEffect below to determine the utilities state on initial render.\n // Attempted with a ref but it did not work. Using state and enforcing a render in addition to the change render for lgOrAbove seems to fix...\n const [obeyUtilitiesExpandedProp, setObeyUtilitiesExpandedProp] = useState(lgOrAbove);\n\n // Allow the utilitiesExpandedProp to drive the utilities' state after the initial render\n useLayoutEffect(() => {\n if (lgOrAbove) setObeyUtilitiesExpandedProp(true);\n }, [lgOrAbove]);\n\n // Tracks whether a resize forced the onToggleUtilities to close the utilities when it's a drawer\n const utilitiesToggledByResize = useRef(false);\n\n // If the initial render is within the MD size, where the utility drawer renders, it must begin collapsed\n const utilitiesExpanded = obeyUtilitiesExpandedProp ? utilitiesExpandedProp : false;\n\n // Handles utilities state based on breakpoint changes.\n useAfterInitialEffect(() => {\n // If we change into the MD breakpoint range and the utilities state is expanded call the toggle prop to collapse it with controlled state\n if (mdOrAbove && !lgOrAbove && utilitiesExpandedProp) {\n onToggleUtilities?.();\n utilitiesToggledByResize.current = true;\n }\n\n if (lgOrAbove) {\n if (utilitiesToggledByResize.current && !utilitiesExpandedProp) {\n onToggleUtilities?.();\n }\n\n utilitiesToggledByResize.current = false;\n }\n // Purposely not listing utilitiesExpanded as a dependency as it is not a trigger and will be captured when BPs change\n }, [mdOrAbove, lgOrAbove]);\n\n // Generate the tab items based on props and viewport conditions\n const tabItems: TabsProps['tabs'] = useMemo(() => {\n const summaryTab = { id: summaryTabId, name: 'Summary' };\n if (mdOrAbove) {\n return !summaryExpanded \|\| (persistentUtility && !xlOrAbove)\n ? [summaryTab, ...tabItemsProp]\n : tabItemsProp;\n }\n const utilityTabs = [];\n if (utilities) utilityTabs.push({ id: utilitiesTabId, name: 'Utilities' });\n if (persistentUtility && !mdOrAbove) {\n utilityTabs.push({ id: persistentUtilityTabId, name: persistentUtility.title });\n }\n\n return [summaryTab, ...tabItemsProp, ...utilityTabs];\n }, [\n mdOrAbove,\n xlOrAbove,\n summaryTabId,\n utilitiesTabId,\n persistentUtilityTabId,\n utilities,\n persistentUtility,\n tabItemsProp,\n summaryExpanded\n ]);\n\n // Setup tab content\n const tabContent = useMemo(() => {\n const summaryTabContent = { id: summaryTabId, content: <Card>{summary}</Card> };\n\n if (mdOrAbove) {\n return !summaryExpanded \|\| (persistentUtility && !xlOrAbove)\n ? [summaryTabContent, ...tabContentProp]\n : tabContentProp;\n }\n\n const utilityTabs = [];\n\n if (utilities) {\n utilityTabs.push({\n id: utilitiesTabId,\n content: <Flex container={{ direction: 'column', gap: 2 }}>{utilities}</Flex>\n });\n }\n\n if (persistentUtility) {\n utilityTabs.push({ id: persistentUtilityTabId, content: persistentUtility?.content });\n }\n\n return [summaryTabContent, ...tabContentProp, ...utilityTabs];\n }, [\n summaryTabId,\n summary,\n mdOrAbove,\n summaryExpanded,\n persistentUtility,\n xlOrAbove,\n tabContentProp,\n utilities,\n utilitiesTabId,\n persistentUtilityTabId\n ]);\n\n // Grid layout props\n let caseViewGridContainer = {\n cols: 'minmax(0, 1fr)',\n colGap: 0,\n rows: 'minmax(0, max-content) auto',\n areas: `\n \"summary\"\n \"work-area\"\n `\n };\n\n const sharedGridProps = {\n colGap: 2,\n rows: caseViewGridContainer.rows\n };\n\n if (persistentUtility) {\n if (xlOrAbove) {\n caseViewGridContainer = {\n ...sharedGridProps,\n cols: 'minmax(0, max-content) minmax(0, 1fr) repeat(2, minmax(0, max-content))',\n areas: '\"summary work-area persistentUtility utilities\"'\n };\n } else if (mdOrAbove) {\n caseViewGridContainer = {\n ...sharedGridProps,\n cols: 'minmax(0, 1fr) repeat(2, minmax(0, max-content))',\n areas: `\n \"summary summary summary\"\n \"work-area persistentUtility utilities\"\n `\n };\n }\n } else if (summaryExpanded) {\n if (mdOrAbove) {\n caseViewGridContainer = {\n ...sharedGridProps,\n cols: 'minmax(0, max-content) minmax(0, 1fr) minmax(0, max-content)',\n areas: '\"summary work-area utilities\"'\n };\n }\n } else if (mdOrAbove) {\n caseViewGridContainer = {\n ...sharedGridProps,\n cols: 'minmax(0, 1fr) minmax(0, max-content)',\n areas: `\n \"summary summary\"\n \"work-area utilities\"\n `\n };\n }\n\n // Apply sticky columns\n const scrollStickOptions = useRef<ScrollStickOptions & { elements: HTMLElement[] }>({\n elements: []\n });\n\n const stickOffset = useMemo(() => {\n if (windowIsAvailable && caseViewRef.current) {\n return parseFloat(\n window.getComputedStyle(caseViewRef.current).getPropertyValue('--appshell-offset')\n );\n }\n\n return 0;\n }, [caseViewRef.current]);\n\n useScrollStick(\n // isMediumOrAbove means side by side columns \| \| \|\n mdOrAbove ? { ...scrollStickOptions.current, offset: stickOffset } : undefined\n );\n\n useEffect(() => {\n if (\n mdOrAbove &&\n summaryExpanded &&\n !persistentUtility &&\n (currentTabId === summaryTabId \|\| currentTabId === utilitiesTabId)\n ) {\n onTabClick(tabItemsProp[0]?.id);\n }\n }, [mdOrAbove, summaryExpanded]);\n\n useEffect(() => {\n if (persistentUtility && currentTabId === persistentUtilityTabId) onTabClick(summaryTabId);\n }, [persistentUtility]);\n\n // Handles scrolling to tab content for newly clicked tab\n useEffect(() => {\n if (!tabContentEl) return;\n const scrollPos = window.scrollY;\n const windowHeight = document.documentElement.clientHeight;\n const bottomPos = scrollPos + windowHeight * 0.8;\n const tabContentPos = tabContentEl.offsetTop;\n if (tabContentPos > bottomPos) {\n const top = tabContentPos - windowHeight * 0.2;\n window.scrollTo({ top, behavior: 'smooth' });\n }\n }, [currentTabId]);\n\n // We need a css variable for the height of the case summary when it is collapsed into a header like layout\n useLayoutEffect(() => {\n if (!caseViewRef.current \|\| !summaryRef.current) return;\n\n caseViewRef.current.style.setProperty(\n '--summary-height',\n `${!summaryExpanded ? summaryRef.current.offsetHeight : 0}px`\n );\n }, [summaryExpanded]);\n\n // CaseView context value\n // Choosing not to memo for now due to extent of deps and how often they change. Optimize as needed.\n const ctxValue: CaseViewContextValue = {\n caseId,\n heading,\n subheading,\n caseLink,\n parentCases,\n icon,\n followed,\n onFollowedChange,\n actions,\n promotedActions,\n onEdit,\n summary,\n tabs: {\n items: tabItems,\n onClick: onTabClick,\n currentTabId\n },\n persistentUtility,\n summaryId,\n summaryExpanded,\n utilitiesExpanded,\n onToggleSummary,\n isPreview,\n aboveMD: mdOrAbove,\n aboveLG: lgOrAbove,\n aboveXL: xlOrAbove\n };\n\n // Here we go...\n return (\n <CaseViewContext.Provider value={ctxValue}>\n {/* Root element /}\n <Grid\n as={StyledCaseView}\n ref={caseViewRef}\n container={caseViewGridContainer}\n item={{ area: 'case-view' }}\n {...restProps}\n >\n {/ Summary /}\n <Grid\n // Used for aria-controls on the toggle button\n id={summaryId}\n as={StyledSummary}\n item={{ area: 'summary' }}\n desktop={mdOrAbove && (!persistentUtility \|\| xlOrAbove) && !summaryExpanded}\n isLargeOrAbove={lgOrAbove}\n ref={summaryRef}\n >\n <CaseSummary />\n </Grid>\n\n {/ Work area /}\n <Flex\n container={{\n direction: 'column',\n alignContent: 'start',\n rowGap: 2\n }}\n as={StyledWorkArea}\n persistentUtility={Boolean(persistentUtility)}\n >\n {banners && <div>{banners}</div>}\n {stages && <div>{stages}</div>}\n {tasks && <div>{tasks}</div>}\n\n {(!mdOrAbove \|\| (persistentUtility && !xlOrAbove) \|\| !summaryExpanded) && (\n <Tabs tabs={tabItems} onTabClick={onTabClick} currentTabId={currentTabId} />\n )}\n\n <div ref={setTabContentEl}>\n {tabContent?.map(({ id, content }) => (\n <TabPanel currentTabId={currentTabId} tabId={id} key={id}>\n {content}\n </TabPanel>\n ))}\n </div>\n </Flex>\n\n {/ Persistent utility column /}\n {persistentUtility && mdOrAbove && (\n <Grid as={StyledPersistentUtility} item={{ area: 'persistentUtility' }}>\n {persistentUtility.content}\n </Grid>\n )}\n\n {/ Utility drawer /}\n {utilities && mdOrAbove && !lgOrAbove && utilitiesExpanded && (\n <Drawer\n as={StyledCaseDrawer}\n open={utilitiesExpanded}\n position='fixed'\n placement={direction.end}\n shadow\n nullWhenClosed\n hasPersistentUtility={!!persistentUtility}\n >\n <Flex\n as={StyledCaseDrawerContent}\n container={{ direction: 'column', gap: 2 }}\n id={utilitiesDrawerId}\n >\n <Flex container={{ justify: 'end' }}>\n <Button\n aria-expanded={utilitiesExpanded ? 'true' : 'false'}\n aria-controls={utilitiesDrawerId}\n variant='simple'\n icon\n onClick={onToggleUtilities}\n as={StyledUtilToggle}\n label={t('collapse_utilities_panel')}\n >\n <Icon name={`move-${direction.end}-solid`} />\n </Button>\n </Flex>\n {utilities}\n </Flex>\n </Drawer>\n )}\n\n {/ Utilities */}\n {utilities && mdOrAbove && (\n <Grid\n ref={(el: HTMLDivElement) => {\n if (el) (scrollStickOptions.current?.elements).push(el);\n }}\n as={StyledUtilities}\n container={{\n cols: 'minmax(0, 1fr)',\n rowGap: 2,\n pad: [2, 0, 2]\n }}\n item={{\n area: 'utilities'\n }}\n >\n <Flex container={{ justify: utilitiesExpanded ? 'end' : 'center' }}>\n <Button\n aria-expanded={utilitiesExpanded ? 'true' : 'false'}\n aria-controls={lgOrAbove ? utilitiesId : utilitiesDrawerId}\n variant='simple'\n icon\n onClick={() => {\n if (!obeyUtilitiesExpandedProp && utilitiesExpandedProp) {\n setObeyUtilitiesExpandedProp(true);\n } else {\n onToggleUtilities?.();\n }\n }}\n as={StyledUtilToggle}\n label={t(utilitiesExpanded ? 'collapse_utilities_panel' : 'expand_utilities_panel')}\n >\n <Icon name={`move-${utilitiesExpanded ? direction.end : direction.start}-solid`} />\n </Button>\n </Flex>\n\n {lgOrAbove && utilitiesExpanded && (\n <Flex container={{ direction: 'column', gap: 2 }} id={utilitiesId}>\n {utilities}\n </Flex>\n )}\n\n {(!utilitiesExpanded \|\| (mdOrAbove && !lgOrAbove)) && (\n <UtilitiesSummary\n items={utilitiesSummaryItems}\n onClick={onToggleUtilities}\n aria-expanded={utilitiesExpanded ? 'true' : 'false'}\n aria-controls={lgOrAbove ? utilitiesId : utilitiesDrawerId}\n />\n )}\n </Grid>\n )}\n </Grid>\n </CaseViewContext.Provider>\n );\n};\n\nexport default CaseView;\n"]}
1	+ {"version":3,"file":"CaseView.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, useEffect, useMemo, useRef, useLayoutEffect, useState } from 'react';\n\nimport {\n Button,\n Flex,\n Grid,\n Icon,\n registerIcon,\n TabPanel,\n useBreakpoint,\n useScrollStick,\n useElement,\n ForwardProps,\n Card,\n Drawer,\n useI18n,\n useDirection,\n Tabs,\n TabsProps,\n useAfterInitialEffect,\n windowIsAvailable\n} from '@pega/cosmos-react-core';\nimport { ScrollStickOptions } from '@pega/cosmos-react-core/lib/hooks/useScrollStick';\nimport * as moveRightSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/move-right-solid.icon';\nimport * as moveLeftSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/move-left-solid.icon';\n\nimport CaseSummary from './CaseSummary';\nimport UtilitiesSummary from './UtilitiesSummary';\nimport {\n StyledCaseDrawer,\n StyledCaseDrawerContent,\n StyledCaseView,\n StyledWorkArea,\n StyledPersistentUtility,\n StyledSummary,\n StyledUtilities,\n StyledUtilToggle\n} from './CaseView.styles';\nimport { CaseViewContextValue, CaseViewProps } from './CaseView.types';\nimport CaseViewContext from './CaseView.context';\n\nregisterIcon(moveRightSolidIcon, moveLeftSolidIcon);\n\nconst CaseView: FC<CaseViewProps & ForwardProps> = ({\n // Case data mostly visually related to the case header\n caseId,\n heading,\n subheading,\n caseLink,\n parentCases,\n icon,\n followed,\n onFollowedChange,\n onEdit,\n actions,\n promotedActions,\n\n // Summary content and state props\n summary,\n summaryExpanded: summaryExpandedProp = true,\n onToggleSummary,\n\n // Case tabs\n tabs: { currentTabId, items: tabItemsProp, onClick: onTabClick },\n\n // Workarea related content props\n banners,\n stages,\n tasks,\n tabContent: tabContentProp = [],\n\n // Utilities content and state props\n utilities,\n utilitiesSummaryItems,\n utilitiesExpanded: utilitiesExpandedProp = true,\n onToggleUtilities,\n\n // Etc...\n persistentUtility,\n intelligentGuidance,\n isPreview = false,\n ...restProps\n}: CaseViewProps) => {\n // General util hooks\n const t = useI18n();\n const direction = useDirection();\n\n // Element refs\n const caseViewRef = useRef<HTMLDivElement>(null);\n const summaryRef = useRef<HTMLDivElement>(null);\n\n // Tab content\n const [tabContentEl, setTabContentEl] = useElement<HTMLElement>(null);\n\n // Breakpoint booleans\n const mdOrAbove = useBreakpoint('md', { breakpointRef: caseViewRef });\n const lgOrAbove = useBreakpoint('lg', { breakpointRef: caseViewRef });\n const xlOrAbove = useBreakpoint('xl', { breakpointRef: caseViewRef });\n\n // DOM ids\n const summaryTabId = `summary-${caseId}`;\n const utilitiesTabId = `utilities-${caseId}`;\n const persistentUtilityTabId = `persistent-utility-${caseId}`;\n const summaryId = `summary-${caseId}`;\n const utilitiesId = `utilities-${caseId}`;\n const utilitiesDrawerId = `utilities-drawer-${caseId}`;\n\n // Summary state handling\n let summaryExpanded = !!summaryExpandedProp;\n if (persistentUtility) {\n summaryExpanded = xlOrAbove;\n }\n\n // Utilities state handling\n\n // Used in coordination with a layoutEffect below to determine the utilities state on initial render.\n // Attempted with a ref but it did not work. Using state and enforcing a render in addition to the change render for lgOrAbove seems to fix...\n const [obeyUtilitiesExpandedProp, setObeyUtilitiesExpandedProp] = useState(lgOrAbove);\n\n // Allow the utilitiesExpandedProp to drive the utilities' state after the initial render\n useLayoutEffect(() => {\n if (lgOrAbove) setObeyUtilitiesExpandedProp(true);\n }, [lgOrAbove]);\n\n // Tracks whether a resize forced the onToggleUtilities to close the utilities when it's a drawer\n const utilitiesToggledByResize = useRef(false);\n\n // If the initial render is within the MD size, where the utility drawer renders, it must begin collapsed\n const utilitiesExpanded = obeyUtilitiesExpandedProp ? utilitiesExpandedProp : false;\n\n // Handles utilities state based on breakpoint changes.\n useAfterInitialEffect(() => {\n // If we change into the MD breakpoint range and the utilities state is expanded call the toggle prop to collapse it with controlled state\n if (mdOrAbove && !lgOrAbove && utilitiesExpandedProp) {\n onToggleUtilities?.();\n utilitiesToggledByResize.current = true;\n }\n\n if (lgOrAbove) {\n if (utilitiesToggledByResize.current && !utilitiesExpandedProp) {\n onToggleUtilities?.();\n }\n\n utilitiesToggledByResize.current = false;\n }\n // Purposely not listing utilitiesExpanded as a dependency as it is not a trigger and will be captured when BPs change\n }, [mdOrAbove, lgOrAbove]);\n\n // Generate the tab items based on props and viewport conditions\n const tabItems: TabsProps['tabs'] = useMemo(() => {\n const summaryTab = { id: summaryTabId, name: 'Summary' };\n if (mdOrAbove) {\n return !summaryExpanded \|\| (persistentUtility && !xlOrAbove)\n ? [summaryTab, ...tabItemsProp]\n : tabItemsProp;\n }\n const utilityTabs = [];\n if (utilities) utilityTabs.push({ id: utilitiesTabId, name: 'Utilities' });\n if (persistentUtility && !mdOrAbove) {\n utilityTabs.push({ id: persistentUtilityTabId, name: persistentUtility.title });\n }\n\n return [summaryTab, ...tabItemsProp, ...utilityTabs];\n }, [\n mdOrAbove,\n xlOrAbove,\n summaryTabId,\n utilitiesTabId,\n persistentUtilityTabId,\n utilities,\n persistentUtility,\n tabItemsProp,\n summaryExpanded\n ]);\n\n // Setup tab content\n const tabContent = useMemo(() => {\n const summaryTabContent = { id: summaryTabId, content: <Card>{summary}</Card> };\n\n if (mdOrAbove) {\n return !summaryExpanded \|\| (persistentUtility && !xlOrAbove)\n ? [summaryTabContent, ...tabContentProp]\n : tabContentProp;\n }\n\n const utilityTabs = [];\n\n if (utilities) {\n utilityTabs.push({\n id: utilitiesTabId,\n content: <Flex container={{ direction: 'column', gap: 2 }}>{utilities}</Flex>\n });\n }\n\n if (persistentUtility) {\n utilityTabs.push({ id: persistentUtilityTabId, content: persistentUtility?.content });\n }\n\n return [summaryTabContent, ...tabContentProp, ...utilityTabs];\n }, [\n summaryTabId,\n summary,\n mdOrAbove,\n summaryExpanded,\n persistentUtility,\n xlOrAbove,\n tabContentProp,\n utilities,\n utilitiesTabId,\n persistentUtilityTabId\n ]);\n\n // Grid layout props\n let caseViewGridContainer = {\n cols: 'minmax(0, 1fr)',\n colGap: 0,\n rows: 'minmax(0, max-content) auto',\n areas: `\n \"summary\"\n \"work-area\"\n `\n };\n\n const sharedGridProps = {\n colGap: 2,\n rows: caseViewGridContainer.rows\n };\n\n if (persistentUtility) {\n if (xlOrAbove) {\n caseViewGridContainer = {\n ...sharedGridProps,\n cols: 'minmax(0, max-content) minmax(0, 1fr) repeat(2, minmax(0, max-content))',\n areas: '\"summary work-area persistentUtility utilities\"'\n };\n } else if (mdOrAbove) {\n caseViewGridContainer = {\n ...sharedGridProps,\n cols: 'minmax(0, 1fr) repeat(2, minmax(0, max-content))',\n areas: `\n \"summary summary summary\"\n \"work-area persistentUtility utilities\"\n `\n };\n }\n } else if (summaryExpanded) {\n if (mdOrAbove) {\n caseViewGridContainer = {\n ...sharedGridProps,\n cols: 'minmax(0, max-content) minmax(0, 1fr) minmax(0, max-content)',\n areas: '\"summary work-area utilities\"'\n };\n }\n } else if (mdOrAbove) {\n caseViewGridContainer = {\n ...sharedGridProps,\n cols: 'minmax(0, 1fr) minmax(0, max-content)',\n areas: `\n \"summary summary\"\n \"work-area utilities\"\n `\n };\n }\n\n // Apply sticky columns\n const scrollStickOptions = useRef<ScrollStickOptions & { elements: HTMLElement[] }>({\n elements: []\n });\n\n const stickOffset = useMemo(() => {\n if (windowIsAvailable && caseViewRef.current) {\n return parseFloat(\n window.getComputedStyle(caseViewRef.current).getPropertyValue('--appshell-offset')\n );\n }\n\n return 0;\n }, [caseViewRef.current]);\n\n useScrollStick(\n // isMediumOrAbove means side by side columns \| \| \|\n mdOrAbove ? { ...scrollStickOptions.current, offset: stickOffset } : undefined\n );\n\n useEffect(() => {\n if (\n mdOrAbove &&\n summaryExpanded &&\n !persistentUtility &&\n (currentTabId === summaryTabId \|\| currentTabId === utilitiesTabId)\n ) {\n onTabClick(tabItemsProp[0]?.id);\n }\n }, [mdOrAbove, summaryExpanded]);\n\n useEffect(() => {\n if (persistentUtility && currentTabId === persistentUtilityTabId) onTabClick(summaryTabId);\n }, [persistentUtility]);\n\n // Handles scrolling to tab content for newly clicked tab\n useEffect(() => {\n if (!tabContentEl) return;\n const scrollPos = window.scrollY;\n const windowHeight = document.documentElement.clientHeight;\n const bottomPos = scrollPos + windowHeight * 0.8;\n const tabContentPos = tabContentEl.offsetTop;\n if (tabContentPos > bottomPos) {\n const top = tabContentPos - windowHeight * 0.2;\n window.scrollTo({ top, behavior: 'smooth' });\n }\n }, [currentTabId]);\n\n // We need a css variable for the height of the case summary when it is collapsed into a header like layout\n useLayoutEffect(() => {\n if (!caseViewRef.current \|\| !summaryRef.current) return;\n\n caseViewRef.current.style.setProperty(\n '--summary-height',\n `${!summaryExpanded ? summaryRef.current.offsetHeight : 0}px`\n );\n }, [summaryExpanded]);\n\n // CaseView context value\n // Choosing not to memo for now due to extent of deps and how often they change. Optimize as needed.\n const ctxValue: CaseViewContextValue = {\n caseId,\n heading,\n subheading,\n caseLink,\n parentCases,\n icon,\n followed,\n onFollowedChange,\n actions,\n promotedActions,\n onEdit,\n summary,\n tabs: {\n items: tabItems,\n onClick: onTabClick,\n currentTabId\n },\n persistentUtility,\n intelligentGuidance,\n summaryId,\n summaryExpanded,\n utilitiesExpanded,\n onToggleSummary,\n isPreview,\n aboveMD: mdOrAbove,\n aboveLG: lgOrAbove,\n aboveXL: xlOrAbove\n };\n\n // Here we go...\n return (\n <>\n <CaseViewContext.Provider value={ctxValue}>\n {/* Root element /}\n <Grid\n as={StyledCaseView}\n ref={caseViewRef}\n container={caseViewGridContainer}\n item={{ area: 'case-view' }}\n {...restProps}\n >\n {/ Summary /}\n <Grid\n // Used for aria-controls on the toggle button\n id={summaryId}\n as={StyledSummary}\n item={{ area: 'summary' }}\n desktop={mdOrAbove && (!persistentUtility \|\| xlOrAbove) && !summaryExpanded}\n isLargeOrAbove={lgOrAbove}\n ref={summaryRef}\n >\n <CaseSummary />\n </Grid>\n\n {/ Work area /}\n <Flex\n container={{\n direction: 'column',\n alignContent: 'start',\n rowGap: 2\n }}\n as={StyledWorkArea}\n persistentUtility={Boolean(persistentUtility)}\n >\n {banners && <div>{banners}</div>}\n {stages && <div>{stages}</div>}\n {tasks && <div>{tasks}</div>}\n\n {(!mdOrAbove \|\| (persistentUtility && !xlOrAbove) \|\| !summaryExpanded) && (\n <Tabs tabs={tabItems} onTabClick={onTabClick} currentTabId={currentTabId} />\n )}\n\n <div ref={setTabContentEl}>\n {tabContent?.map(({ id, content }) => (\n <TabPanel currentTabId={currentTabId} tabId={id} key={id}>\n {content}\n </TabPanel>\n ))}\n </div>\n </Flex>\n\n {/ Persistent utility column /}\n {persistentUtility && mdOrAbove && (\n <Grid as={StyledPersistentUtility} item={{ area: 'persistentUtility' }}>\n {persistentUtility.content}\n </Grid>\n )}\n\n {/ Utility drawer /}\n {utilities && mdOrAbove && !lgOrAbove && utilitiesExpanded && (\n <Drawer\n as={StyledCaseDrawer}\n open={utilitiesExpanded}\n position='fixed'\n placement={direction.end}\n shadow\n nullWhenClosed\n hasPersistentUtility={!!persistentUtility}\n >\n <Flex\n as={StyledCaseDrawerContent}\n container={{ direction: 'column', gap: 2 }}\n id={utilitiesDrawerId}\n >\n <Flex container={{ justify: 'end' }}>\n <Button\n aria-expanded={utilitiesExpanded ? 'true' : 'false'}\n aria-controls={utilitiesDrawerId}\n variant='simple'\n icon\n onClick={onToggleUtilities}\n as={StyledUtilToggle}\n label={t('collapse_utilities_panel')}\n >\n <Icon name={`move-${direction.end}-solid`} />\n </Button>\n </Flex>\n {utilities}\n </Flex>\n </Drawer>\n )}\n\n {/ Utilities */}\n {utilities && mdOrAbove && (\n <Grid\n ref={(el: HTMLDivElement) => {\n if (el) (scrollStickOptions.current?.elements).push(el);\n }}\n as={StyledUtilities}\n container={{\n cols: 'minmax(0, 1fr)',\n rowGap: 2,\n pad: [2, 0, 2]\n }}\n item={{\n area: 'utilities'\n }}\n >\n <Flex container={{ justify: utilitiesExpanded ? 'end' : 'center' }}>\n <Button\n aria-expanded={utilitiesExpanded ? 'true' : 'false'}\n aria-controls={lgOrAbove ? utilitiesId : utilitiesDrawerId}\n variant='simple'\n icon\n onClick={() => {\n if (!obeyUtilitiesExpandedProp && utilitiesExpandedProp) {\n setObeyUtilitiesExpandedProp(true);\n } else {\n onToggleUtilities?.();\n }\n }}\n as={StyledUtilToggle}\n label={t(\n utilitiesExpanded ? 'collapse_utilities_panel' : 'expand_utilities_panel'\n )}\n >\n <Icon\n name={`move-${utilitiesExpanded ? direction.end : direction.start}-solid`}\n />\n </Button>\n </Flex>\n\n {lgOrAbove && utilitiesExpanded && (\n <Flex container={{ direction: 'column', gap: 2 }} id={utilitiesId}>\n {utilities}\n </Flex>\n )}\n\n {(!utilitiesExpanded \|\| (mdOrAbove && !lgOrAbove)) && (\n <UtilitiesSummary\n items={utilitiesSummaryItems}\n onClick={onToggleUtilities}\n aria-expanded={utilitiesExpanded ? 'true' : 'false'}\n aria-controls={lgOrAbove ? utilitiesId : utilitiesDrawerId}\n />\n )}\n </Grid>\n )}\n </Grid>\n </CaseViewContext.Provider>\n {intelligentGuidance}\n </>\n );\n};\n\nexport default CaseView;\n"]}

package/lib/components/CaseView/CaseView.styles.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CaseView.styles.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.styles.ts"],"names":[],"mappings":"AAsBA,eAAO,MAAM,uBAAuB,yGAelC,CAAC;AAIH,eAAO,MAAM,gBAAgB,4GAc3B,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAkB7B,CAAC;AAIH,eAAO,MAAM,oBAAoB,2GAShC,CAAC;AAIF,eAAO,MAAM,gBAAgB,uGAAa,CAAC;AAI3C,eAAO,MAAM,oBAAoB,4GA0C/B,CAAC;AAIH,eAAO,MAAM,qBAAqB,yGAIhC,CAAC;AAIH,eAAO,MAAM,qBAAqB,~~yGAKhC~~,CAAC;AAIH,eAAO,MAAM,0BAA0B,qOA0BrC,CAAC;AAIH,eAAO,MAAM,iBAAiB,yGAqC5B,CAAC;AAIH,eAAO,MAAM,cAAc,~~yGAiBzB~~,CAAC;AAIH,eAAO,MAAM,gBAAgB,4GAM3B,CAAC;AAIH,eAAO,MAAM,eAAe,yGAY1B,CAAC;AAIH,eAAO,MAAM,aAAa,yGAgBxB,CAAC;AAIH,eAAO,MAAM,gBAAgB,yGAU3B,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAOlC,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAUlC,CAAC;AAIH,eAAO,MAAM,WAAW,yGAGvB,CAAC;AAEF,eAAO,MAAM,cAAc,yGAiBzB,CAAC"}
1	+ {"version":3,"file":"CaseView.styles.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.styles.ts"],"names":[],"mappings":"AAsBA,eAAO,MAAM,uBAAuB,yGAelC,CAAC;AAIH,eAAO,MAAM,gBAAgB,4GAc3B,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAkB7B,CAAC;AAIH,eAAO,MAAM,oBAAoB,2GAShC,CAAC;AAIF,eAAO,MAAM,gBAAgB,uGAAa,CAAC;AAI3C,eAAO,MAAM,oBAAoB,4GA0C/B,CAAC;AAIH,eAAO,MAAM,qBAAqB,yGAIhC,CAAC;AAIH,eAAO,MAAM,qBAAqB,yGAYhC,CAAC;AAIH,eAAO,MAAM,0BAA0B,qOA0BrC,CAAC;AAIH,eAAO,MAAM,iBAAiB,yGAqC5B,CAAC;AAIH,eAAO,MAAM,cAAc,yGA6BzB,CAAC;AAIH,eAAO,MAAM,gBAAgB,4GAM3B,CAAC;AAIH,eAAO,MAAM,eAAe,yGAY1B,CAAC;AAIH,eAAO,MAAM,aAAa,yGAgBxB,CAAC;AAIH,eAAO,MAAM,gBAAgB,yGAU3B,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAOlC,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAUlC,CAAC;AAIH,eAAO,MAAM,WAAW,yGAGvB,CAAC;AAEF,eAAO,MAAM,cAAc,yGAiBzB,CAAC"}

package/lib/components/CaseView/CaseView.styles.js CHANGED Viewed

@@ -115,9 +115,15 @@ export const StyledPromotedActions = styled.div(({ theme }) => {
 });
 StyledPromotedActions.defaultProps = defaultThemeProp;
 export const StyledCaseSummaryInfo = styled.div(() => {
+    const { intelligentGuidance } = useCaseViewContext();
     return css `
     overflow: auto;
     flex: 1;
+    ${intelligentGuidance &&
+        css `
+      /* Accounts for collapsed intelligentGuidance list covering summary panel content when fully scrolled. */
+      padding-block-end: 4rem;
+    `}
   `;
 });
 StyledCaseSummaryInfo.defaultProps = defaultThemeProp;
@@ -133,7 +139,7 @@ export const StyledExpandCollapseButton = styled(Button)(({ theme }) => {
     border: none;
     opacity: 0;
-    /* Disbales core Button transition causing button to slide on toggle. */
+    /* Disables core Button transition causing button to slide on toggle. */
     transition: none;
     &:focus {
@@ -187,7 +193,11 @@ export const StyledCaseSummary = styled.div(() => {
 });
 StyledCaseSummary.defaultProps = defaultThemeProp;
 export const StyledWorkArea = styled.div(({ theme }) => {
-    const { summaryExpanded, aboveMD } = useCaseViewContext();
+    const { summaryExpanded, aboveMD, intelligentGuidance } = useCaseViewContext();
+    let pbeRem = 0;
+    if (intelligentGuidance) {
+        pbeRem = aboveMD && !summaryExpanded ? 4 : 6;
+    }
     return css `
     grid-area: work-area;
     padding: calc(2 * ${theme.base.spacing});
@@ -201,6 +211,13 @@ export const StyledWorkArea = styled.div(({ theme }) => {
         margin-inline-start: calc(2 * ${theme.base.spacing});
       `}
     `}
+    /* Order of style here is necessary for overriding styles above. */
+    ${pbeRem > 0 &&
+        css `
+      /* Accounts for collapsed intelligentGuidance bubble covering work area content when fully scrolled. */
+      padding-block-end: ${pbeRem}rem;
+    `}
   `;
 });
 StyledWorkArea.defaultProps = defaultThemeProp;

package/lib/components/CaseView/CaseView.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CaseView.styles.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { hideVisually, parseToHsl, readableColor, transparentize } from 'polished';\n\nimport {\n Button,\n calculateFontSize,\n defaultThemeProp,\n StyledBreadcrumbs,\n StyledButton,\n StyledFieldValue,\n StyledFieldValueList,\n StyledIcon,\n StyledPopover,\n StyledText,\n StyledTooltip,\n tryCatch,\n FontSize\n} from '@pega/cosmos-react-core';\nimport { StyledMenu } from '@pega/cosmos-react-core/lib/components/Menu/Menu.styles';\n\nimport { useCaseViewContext } from './CaseView.context';\n\nexport const StyledCaseSummaryFields = styled.div(({ theme }) => {\n const fontSizes = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n padding: calc(2 * ${theme.base.spacing});\n\n > ${StyledFieldValueList}:first-child {\n grid-template-columns: 16ch auto;\n\n ${StyledFieldValue} {\n font-size: ${fontSizes[theme.components.text.h1['font-size'] as FontSize]};\n font-weight: ${theme.components.text.h1['font-weight']};\n }\n }\n `;\n});\n\nStyledCaseSummaryFields.defaultProps = defaultThemeProp;\n\nexport const StyledCaseHeader = styled.header(({ theme }) => {\n const color = tryCatch(() => readableColor(theme.base.palette['brand-primary']));\n\n return css`\n background-color: ${theme.base.palette['brand-primary']};\n color: ${color};\n padding: calc(2 * ${theme.base.spacing});\n position: relative;\n\n ${StyledMenu} {\n color: ${theme.base.palette['foreground-color']};\n z-index: ${theme.base['z-index'].popover + 1};\n }\n `;\n});\n\nStyledCaseHeader.defaultProps = defaultThemeProp;\n\nexport const StyledCaseIconWrap = styled.div(({ theme }) => {\n const spacing = theme.base.spacing;\n const borderRadius = theme.base['border-radius'];\n const backgroundColor = tryCatch(() => {\n const { lightness } = parseToHsl(theme.base.palette['brand-primary']);\n return lightness > 0.35 ? 'rgba(0, 0, 0, 0.2)' : 'rgba(255, 255, 255, 0.2)';\n });\n\n return css`\n background: ${backgroundColor};\n border-radius: calc(${borderRadius} / 2);\n width: calc(5 * ${spacing});\n height: calc(5 * ${spacing});\n ${StyledIcon} {\n font-size: calc(3 * ${spacing});\n margin: auto;\n }\n `;\n});\n\nStyledCaseIconWrap.defaultProps = defaultThemeProp;\n\nexport const StyledFollowIconWrap = styled.label`\n font-size: 1.25rem;\n input {\n ${hideVisually}\n }\n\n input:focus + svg {\n box-shadow: ${({ theme }) => theme.base.shadow['focus-inverted']};\n }\n`;\n\nStyledFollowIconWrap.defaultProps = defaultThemeProp;\n\nexport const StyledSubheading = styled.p``;\n\nStyledSubheading.defaultProps = defaultThemeProp;\n\nexport const StyledCaseHeaderText = styled.hgroup(({ theme }) => {\n const color = readableColor(theme.base.palette['brand-primary']);\n const transparentColor = tryCatch(() => transparentize(0.1, color));\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n const idStyle = css`\n color: ${transparentColor};\n font-size: ${fontSize.s};\n font-weight: normal;\n `;\n\n return css`\n word-break: break-word;\n\n ${StyledSubheading} {\n ${idStyle}\n }\n\n ${StyledBreadcrumbs} {\n > a,\n > span,\n > button,\n > svg {\n ${idStyle}\n }\n\n > a,\n > button {\n &:focus {\n box-shadow: ${theme.base.shadow['focus-inverted']};\n }\n }\n\n ${StyledPopover}:not(${StyledTooltip}) {\n color: ${theme.base.palette['foreground-color']};\n }\n }\n\n > ${StyledText} > ${StyledButton} {\n color: ${color};\n }\n `;\n});\n\nStyledCaseHeaderText.defaultProps = defaultThemeProp;\n\nexport const StyledPromotedActions = styled.div(({ theme }) => {\n return css`\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n `;\n});\n\nStyledPromotedActions.defaultProps = defaultThemeProp;\n\nexport const StyledCaseSummaryInfo = styled.div(() => {\n return css`\n overflow: auto;\n flex: 1;\n `;\n});\n\nStyledCaseSummaryInfo.defaultProps = defaultThemeProp;\n\nexport const StyledExpandCollapseButton = styled(Button)(({ theme }) => {\n const { summaryExpanded } = useCaseViewContext();\n\n return css`\n position: absolute;\n z-index: 1;\n bottom: 0;\n inset-inline-start: ${summaryExpanded ? 'calc(100% - 0.75rem)' : '0'};\n border-radius: ${summaryExpanded ? '1.5rem' : '0 1.5rem 1.5rem 0'};\n box-shadow: ${theme.base.shadow.low};\n border: none;\n opacity: 0;\n\n /* Disbales core Button transition causing button to slide on toggle. /\n transition: none;\n\n &:focus {\n opacity: 1;\n }\n\n ${StyledIcon} {\n width: 1.5rem;\n height: 1.5rem;\n transform: rotate(${summaryExpanded ? 0 : css`180deg`});\n }\n `;\n});\n\nStyledExpandCollapseButton.defaultProps = defaultThemeProp;\n\nexport const StyledCaseSummary = styled.div(() => {\n const { summaryExpanded, aboveMD, aboveLG } = useCaseViewContext();\n\n return css`\n position: relative;\n height: 100%;\n\n ${aboveMD &&\n css`\n ${summaryExpanded\n ? css`\n width: ${aboveLG ? css`25rem` : css`22rem`};\n\n &:focus-within,\n &:hover {\n &::after {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n inset-inline-start: 100%;\n width: 0.75rem;\n }\n\n ${StyledExpandCollapseButton} {\n opacity: 1;\n }\n }\n `\n : css`\n width: 100%;\n ${StyledExpandCollapseButton} {\n opacity: 1;\n }\n `}\n `}\n `;\n});\n\nStyledCaseSummary.defaultProps = defaultThemeProp;\n\nexport const StyledWorkArea = styled.div(({ theme }) => {\n const { summaryExpanded, aboveMD } = useCaseViewContext();\n\n return css`\n grid-area: work-area;\n padding: calc(2 ${theme.base.spacing});\n\n ${aboveMD &&\n css`\n padding: calc(2 * ${theme.base.spacing}) 0;\n\n ${!summaryExpanded &&\n css`\n margin-inline-start: calc(2 * ${theme.base.spacing});\n `}\n `}\n `;\n});\n\nStyledWorkArea.defaultProps = defaultThemeProp;\n\nexport const StyledUtilToggle = styled.button(({ theme }) => {\n return css`\n align-self: flex-end;\n color: ${theme.base.palette['foreground-color']};\n margin-inline-end: 0.375rem;\n `;\n});\n\nStyledUtilToggle.defaultProps = defaultThemeProp;\n\nexport const StyledUtilities = styled.div(() => {\n const { utilitiesExpanded, aboveLG } = useCaseViewContext();\n\n return css`\n height: max-content;\n\n ${aboveLG &&\n utilitiesExpanded &&\n css`\n width: 25rem;\n `}\n `;\n});\n\nStyledUtilities.defaultProps = defaultThemeProp;\n\nexport const StyledSummary = styled.div(({ theme }) => {\n const { summaryExpanded, aboveMD } = useCaseViewContext();\n\n return css`\n position: sticky;\n top: ${summaryExpanded ? 'var(--top-offset)' : 'var(--appshell-offset, 0)'};\n width: 100%;\n background-color: ${theme.base.palette['primary-background']};\n z-index: ${theme.base['z-index'].popover};\n\n ${aboveMD &&\n summaryExpanded &&\n css`\n height: var(--case-view-height);\n `}\n `;\n});\n\nStyledSummary.defaultProps = defaultThemeProp;\n\nexport const StyledCaseDrawer = styled.div(({ theme }) => {\n return css`\n min-width: 21.875rem;\n max-width: 31.25rem;\n width: calc((100vw - 31.25rem) / 10 + 21.875rem);\n background-color: ${theme.base.palette['primary-background']};\n height: var(--case-view-height);\n top: var(--top-offset);\n z-index: ${theme.base['z-index'].drawer - 1};\n `;\n});\n\nStyledCaseDrawer.defaultProps = defaultThemeProp;\n\nexport const StyledCaseDrawerContent = styled.div(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['app-background']};\n padding: calc(2 * ${theme.base.spacing});\n height: 100%;\n overflow: auto;\n `;\n});\n\nStyledCaseDrawerContent.defaultProps = defaultThemeProp;\n\nexport const StyledPersistentUtility = styled.div(({ theme }) => {\n return css`\n min-width: ${theme.base['content-width'].sm};\n max-width: ${theme.base['content-width'].md};\n overflow: auto;\n position: sticky;\n z-index: 1;\n height: var(--case-view-height);\n top: var(--top-offset);\n `;\n});\n\nStyledPersistentUtility.defaultProps = defaultThemeProp;\n\nexport const ScrollStick = styled.div`\n position: sticky;\n top: 0;\n`;\n\nexport const StyledCaseView = styled.div(({ theme }) => {\n const { aboveMD } = useCaseViewContext();\n\n return css`\n --top-offset: calc(var(--appshell-offset, 0rem) + var(--summary-height));\n --case-view-height: calc(100vh - var(--top-offset));\n position: relative;\n min-height: var(--case-view-height);\n background-color: ${theme.base.palette['app-background']};\n\n ${aboveMD &&\n css`\n ${StyledUtilities}:last-child {\n margin-inline-end: calc(2 * ${theme.base.spacing});\n }\n `}\n `;\n});\n\nStyledCaseView.defaultProps = defaultThemeProp;\n"]}
1	+ {"version":3,"file":"CaseView.styles.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { hideVisually, parseToHsl, readableColor, transparentize } from 'polished';\n\nimport {\n Button,\n calculateFontSize,\n defaultThemeProp,\n StyledBreadcrumbs,\n StyledButton,\n StyledFieldValue,\n StyledFieldValueList,\n StyledIcon,\n StyledPopover,\n StyledText,\n StyledTooltip,\n tryCatch,\n FontSize\n} from '@pega/cosmos-react-core';\nimport { StyledMenu } from '@pega/cosmos-react-core/lib/components/Menu/Menu.styles';\n\nimport { useCaseViewContext } from './CaseView.context';\n\nexport const StyledCaseSummaryFields = styled.div(({ theme }) => {\n const fontSizes = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n padding: calc(2 * ${theme.base.spacing});\n\n > ${StyledFieldValueList}:first-child {\n grid-template-columns: 16ch auto;\n\n ${StyledFieldValue} {\n font-size: ${fontSizes[theme.components.text.h1['font-size'] as FontSize]};\n font-weight: ${theme.components.text.h1['font-weight']};\n }\n }\n `;\n});\n\nStyledCaseSummaryFields.defaultProps = defaultThemeProp;\n\nexport const StyledCaseHeader = styled.header(({ theme }) => {\n const color = tryCatch(() => readableColor(theme.base.palette['brand-primary']));\n\n return css`\n background-color: ${theme.base.palette['brand-primary']};\n color: ${color};\n padding: calc(2 * ${theme.base.spacing});\n position: relative;\n\n ${StyledMenu} {\n color: ${theme.base.palette['foreground-color']};\n z-index: ${theme.base['z-index'].popover + 1};\n }\n `;\n});\n\nStyledCaseHeader.defaultProps = defaultThemeProp;\n\nexport const StyledCaseIconWrap = styled.div(({ theme }) => {\n const spacing = theme.base.spacing;\n const borderRadius = theme.base['border-radius'];\n const backgroundColor = tryCatch(() => {\n const { lightness } = parseToHsl(theme.base.palette['brand-primary']);\n return lightness > 0.35 ? 'rgba(0, 0, 0, 0.2)' : 'rgba(255, 255, 255, 0.2)';\n });\n\n return css`\n background: ${backgroundColor};\n border-radius: calc(${borderRadius} / 2);\n width: calc(5 * ${spacing});\n height: calc(5 * ${spacing});\n ${StyledIcon} {\n font-size: calc(3 * ${spacing});\n margin: auto;\n }\n `;\n});\n\nStyledCaseIconWrap.defaultProps = defaultThemeProp;\n\nexport const StyledFollowIconWrap = styled.label`\n font-size: 1.25rem;\n input {\n ${hideVisually}\n }\n\n input:focus + svg {\n box-shadow: ${({ theme }) => theme.base.shadow['focus-inverted']};\n }\n`;\n\nStyledFollowIconWrap.defaultProps = defaultThemeProp;\n\nexport const StyledSubheading = styled.p``;\n\nStyledSubheading.defaultProps = defaultThemeProp;\n\nexport const StyledCaseHeaderText = styled.hgroup(({ theme }) => {\n const color = readableColor(theme.base.palette['brand-primary']);\n const transparentColor = tryCatch(() => transparentize(0.1, color));\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n const idStyle = css`\n color: ${transparentColor};\n font-size: ${fontSize.s};\n font-weight: normal;\n `;\n\n return css`\n word-break: break-word;\n\n ${StyledSubheading} {\n ${idStyle}\n }\n\n ${StyledBreadcrumbs} {\n > a,\n > span,\n > button,\n > svg {\n ${idStyle}\n }\n\n > a,\n > button {\n &:focus {\n box-shadow: ${theme.base.shadow['focus-inverted']};\n }\n }\n\n ${StyledPopover}:not(${StyledTooltip}) {\n color: ${theme.base.palette['foreground-color']};\n }\n }\n\n > ${StyledText} > ${StyledButton} {\n color: ${color};\n }\n `;\n});\n\nStyledCaseHeaderText.defaultProps = defaultThemeProp;\n\nexport const StyledPromotedActions = styled.div(({ theme }) => {\n return css`\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n `;\n});\n\nStyledPromotedActions.defaultProps = defaultThemeProp;\n\nexport const StyledCaseSummaryInfo = styled.div(() => {\n const { intelligentGuidance } = useCaseViewContext();\n\n return css`\n overflow: auto;\n flex: 1;\n ${intelligentGuidance &&\n css`\n /* Accounts for collapsed intelligentGuidance list covering summary panel content when fully scrolled. /\n padding-block-end: 4rem;\n `}\n `;\n});\n\nStyledCaseSummaryInfo.defaultProps = defaultThemeProp;\n\nexport const StyledExpandCollapseButton = styled(Button)(({ theme }) => {\n const { summaryExpanded } = useCaseViewContext();\n\n return css`\n position: absolute;\n z-index: 1;\n bottom: 0;\n inset-inline-start: ${summaryExpanded ? 'calc(100% - 0.75rem)' : '0'};\n border-radius: ${summaryExpanded ? '1.5rem' : '0 1.5rem 1.5rem 0'};\n box-shadow: ${theme.base.shadow.low};\n border: none;\n opacity: 0;\n\n / Disables core Button transition causing button to slide on toggle. /\n transition: none;\n\n &:focus {\n opacity: 1;\n }\n\n ${StyledIcon} {\n width: 1.5rem;\n height: 1.5rem;\n transform: rotate(${summaryExpanded ? 0 : css`180deg`});\n }\n `;\n});\n\nStyledExpandCollapseButton.defaultProps = defaultThemeProp;\n\nexport const StyledCaseSummary = styled.div(() => {\n const { summaryExpanded, aboveMD, aboveLG } = useCaseViewContext();\n\n return css`\n position: relative;\n height: 100%;\n\n ${aboveMD &&\n css`\n ${summaryExpanded\n ? css`\n width: ${aboveLG ? css`25rem` : css`22rem`};\n\n &:focus-within,\n &:hover {\n &::after {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n inset-inline-start: 100%;\n width: 0.75rem;\n }\n\n ${StyledExpandCollapseButton} {\n opacity: 1;\n }\n }\n `\n : css`\n width: 100%;\n ${StyledExpandCollapseButton} {\n opacity: 1;\n }\n `}\n `}\n `;\n});\n\nStyledCaseSummary.defaultProps = defaultThemeProp;\n\nexport const StyledWorkArea = styled.div(({ theme }) => {\n const { summaryExpanded, aboveMD, intelligentGuidance } = useCaseViewContext();\n let pbeRem = 0;\n\n if (intelligentGuidance) {\n pbeRem = aboveMD && !summaryExpanded ? 4 : 6;\n }\n\n return css`\n grid-area: work-area;\n padding: calc(2 ${theme.base.spacing});\n\n ${aboveMD &&\n css`\n padding: calc(2 * ${theme.base.spacing}) 0;\n\n ${!summaryExpanded &&\n css`\n margin-inline-start: calc(2 * ${theme.base.spacing});\n `}\n `}\n\n /* Order of style here is necessary for overriding styles above. /\n ${pbeRem > 0 &&\n css`\n / Accounts for collapsed intelligentGuidance bubble covering work area content when fully scrolled. /\n padding-block-end: ${pbeRem}rem;\n `}\n `;\n});\n\nStyledWorkArea.defaultProps = defaultThemeProp;\n\nexport const StyledUtilToggle = styled.button(({ theme }) => {\n return css`\n align-self: flex-end;\n color: ${theme.base.palette['foreground-color']};\n margin-inline-end: 0.375rem;\n `;\n});\n\nStyledUtilToggle.defaultProps = defaultThemeProp;\n\nexport const StyledUtilities = styled.div(() => {\n const { utilitiesExpanded, aboveLG } = useCaseViewContext();\n\n return css`\n height: max-content;\n\n ${aboveLG &&\n utilitiesExpanded &&\n css`\n width: 25rem;\n `}\n `;\n});\n\nStyledUtilities.defaultProps = defaultThemeProp;\n\nexport const StyledSummary = styled.div(({ theme }) => {\n const { summaryExpanded, aboveMD } = useCaseViewContext();\n\n return css`\n position: sticky;\n top: ${summaryExpanded ? 'var(--top-offset)' : 'var(--appshell-offset, 0)'};\n width: 100%;\n background-color: ${theme.base.palette['primary-background']};\n z-index: ${theme.base['z-index'].popover};\n\n ${aboveMD &&\n summaryExpanded &&\n css`\n height: var(--case-view-height);\n `}\n `;\n});\n\nStyledSummary.defaultProps = defaultThemeProp;\n\nexport const StyledCaseDrawer = styled.div(({ theme }) => {\n return css`\n min-width: 21.875rem;\n max-width: 31.25rem;\n width: calc((100vw - 31.25rem) / 10 + 21.875rem);\n background-color: ${theme.base.palette['primary-background']};\n height: var(--case-view-height);\n top: var(--top-offset);\n z-index: ${theme.base['z-index'].drawer - 1};\n `;\n});\n\nStyledCaseDrawer.defaultProps = defaultThemeProp;\n\nexport const StyledCaseDrawerContent = styled.div(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['app-background']};\n padding: calc(2 ${theme.base.spacing});\n height: 100%;\n overflow: auto;\n `;\n});\n\nStyledCaseDrawerContent.defaultProps = defaultThemeProp;\n\nexport const StyledPersistentUtility = styled.div(({ theme }) => {\n return css`\n min-width: ${theme.base['content-width'].sm};\n max-width: ${theme.base['content-width'].md};\n overflow: auto;\n position: sticky;\n z-index: 1;\n height: var(--case-view-height);\n top: var(--top-offset);\n `;\n});\n\nStyledPersistentUtility.defaultProps = defaultThemeProp;\n\nexport const ScrollStick = styled.div`\n position: sticky;\n top: 0;\n`;\n\nexport const StyledCaseView = styled.div(({ theme }) => {\n const { aboveMD } = useCaseViewContext();\n\n return css`\n --top-offset: calc(var(--appshell-offset, 0rem) + var(--summary-height));\n --case-view-height: calc(100vh - var(--top-offset));\n position: relative;\n min-height: var(--case-view-height);\n background-color: ${theme.base.palette['app-background']};\n\n ${aboveMD &&\n css`\n ${StyledUtilities}:last-child {\n margin-inline-end: calc(2 * ${theme.base.spacing});\n }\n `}\n `;\n});\n\nStyledCaseView.defaultProps = defaultThemeProp;\n"]}

package/lib/components/CaseView/CaseView.types.d.ts CHANGED Viewed

@@ -58,6 +58,10 @@ export interface CaseViewProps extends NoChildrenProp, BaseProps {
         content: ReactNode;
         title: string;
     };
+    /**
+     * Provide an instance of IntelligentGuidance to be rendered for a case.
+     */
+    intelligentGuidance?: ReactNode;
     /** A region for case widgets. */
     utilities?: ReactNode;
     /** An indicator of case widgets when the utilities are collapsed. */
@@ -89,7 +93,7 @@ export interface CaseSummaryFieldsProps {
         value: ReactNode;
     }[];
 }
-export interface CaseViewContextValue extends Pick<CaseViewProps, 'caseId' | 'heading' | 'subheading' | 'caseLink' | 'parentCases' | 'icon' | 'followed' | 'onFollowedChange' | 'actions' | 'promotedActions' | 'onEdit' | 'summary' | 'tabs' | 'summaryExpanded' | 'onToggleSummary' | 'utilitiesExpanded' | 'persistentUtility'> {
+export interface CaseViewContextValue extends Pick<CaseViewProps, 'caseId' | 'heading' | 'subheading' | 'caseLink' | 'parentCases' | 'icon' | 'followed' | 'onFollowedChange' | 'actions' | 'promotedActions' | 'onEdit' | 'summary' | 'tabs' | 'summaryExpanded' | 'onToggleSummary' | 'utilitiesExpanded' | 'persistentUtility' | 'intelligentGuidance'> {
     summaryId: string;
     aboveMD: boolean;
     aboveLG: boolean;

package/lib/components/CaseView/CaseView.types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CaseView.types.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE5D,OAAO,EACL,GAAG,EACH,cAAc,EACd,YAAY,EACZ,aAAa,EACb,MAAM,EACN,SAAS,EACV,MAAM,yBAAyB,CAAC;AAEjC,MAAM,WAAW,aAAc,SAAQ,cAAc,EAAE,SAAS;IAC9D,iDAAiD;IACjD,MAAM,EAAE,MAAM,CAAC;IACf,gDAAgD;IAChD,OAAO,EAAE,MAAM,CAAC;IAChB,qDAAqD;IACrD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,8FAA8F;IAC9F,QAAQ,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,GAAG,YAAY,CAAC;IAC3C,kFAAkF;IAClF,WAAW,CAAC,EAAE,aAAa,EAAE,CAAC;IAC9B,qDAAqD;IACrD,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,8GAA8G;IAC9G,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,4FAA4F;IAC5F,gBAAgB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,sDAAsD;IACtD,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,uEAAuE;IACvE,eAAe,CAAC,EAAE,MAAM,EAAE,CAAC;IAC3B,qDAAqD;IACrD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IAEpB,sEAAsE;IACtE,OAAO,EAAE,SAAS,CAAC;IACnB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAE7B,qFAAqF;IACrF,IAAI,EAAE;QACJ,KAAK,EAAE,GAAG,EAAE,CAAC;QACb,OAAO,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,UAAU,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,KAAK,IAAI,CAAC;QACzF,YAAY,EAAE,MAAM,CAAC;KACtB,CAAC;IACF,mFAAmF;IACnF,UAAU,CAAC,EAAE;QAAE,OAAO,EAAE,SAAS,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAElD,2CAA2C;IAC3C,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,0CAA0C;IAC1C,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,2DAA2D;IAC3D,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,+DAA+D;IAC/D,iBAAiB,CAAC,EAAE;QAAE,OAAO,EAAE,SAAS,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;~~IAE1D~~,iCAAiC;IACjC,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,qEAAqE;IACrE,qBAAqB,CAAC,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IAE/D;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;CAMhC;AAED,MAAM,WAAW,sBAAsB;IACrC,oEAAoE;IACpE,aAAa,EAAE;QACb,EAAE,CAAC,EAAE,MAAM,CAAC;QACZ,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,SAAS,CAAC;KAClB,EAAE,CAAC;IACJ,oEAAoE;IACpE,eAAe,EAAE;QACf,EAAE,CAAC,EAAE,MAAM,CAAC;QACZ,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,SAAS,CAAC;KAClB,EAAE,CAAC;CACL;AAED,MAAM,WAAW,oBACf,SAAQ,IAAI,CACV,aAAa,EACX,QAAQ,GACR,SAAS,GACT,YAAY,GACZ,UAAU,GACV,aAAa,GACb,MAAM,GACN,UAAU,GACV,kBAAkB,GAClB,SAAS,GACT,iBAAiB,GACjB,QAAQ,GACR,SAAS,GACT,MAAM,GACN,iBAAiB,GACjB,iBAAiB,GACjB,mBAAmB,GACnB,mBAAmB,~~CACtB~~;IACD,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,OAAO,CAAC;CACpB"}
1	+ {"version":3,"file":"CaseView.types.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.types.ts"],"names":[],"mappings":"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"}

package/lib/components/CaseView/CaseView.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CaseView.types.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ReactElement, ReactNode, MouseEvent } from 'react';\n\nimport {\n Tab,\n NoChildrenProp,\n ForwardProps,\n MenuItemProps,\n Action,\n BaseProps\n} from '@pega/cosmos-react-core';\n\nexport interface CaseViewProps extends NoChildrenProp, BaseProps {\n /** A unique identifier for the case instance. /\n caseId: string;\n /* Text to quickly identify a case instance. /\n heading: string;\n /* Supplemental text to identify a case instance. /\n subheading?: string;\n /* A set of props including an href that will be forwarded to the case heading and caseId. /\n caseLink?: { href: string } & ForwardProps;\n /* A set of Link props representing the case parents, rendered as Breadcrumbs. /\n parentCases?: MenuItemProps[];\n /* An icon to serve as a visual for the CaseView. /\n icon?: ReactElement;\n /* Indicates if the current user is following the case. This should be updated based on onFollowedChange. /\n followed?: boolean;\n /* Called when user chooses to follow or unfollow the case. Use this to update followed. /\n onFollowedChange?: (following: boolean) => void;\n /* Case level actions available in an action menu. /\n actions?: Action[];\n /* Visually promoted case level actions available outside the menu. /\n promotedActions?: Action[];\n /* A callback for when the edit button is clicked /\n onEdit?: () => void;\n\n /* A region to display any summary information about the CaseView. /\n summary: ReactNode;\n /\n Determines the layout state of the summary region.\n * @default true\n /\n summaryExpanded?: boolean;\n /\n Callback to toggle the case summary's layout.\n /\n onToggleSummary?: () => void;\n\n /* An object handling the rendering and functionality of the Tabs in CaseSummary. /\n tabs: {\n items: Tab[];\n onClick: (id: string, event?: MouseEvent<HTMLAnchorElement \| HTMLButtonElement>) => void;\n currentTabId: string;\n };\n /* A region within the center column that is controlled by tabs in CaseSummary. /\n tabContent?: { content: ReactNode; id: string }[];\n\n /* A region to hold a Stages component. /\n stages?: ReactNode;\n /* A region to hold a Tasks component. /\n tasks?: ReactNode;\n /* A region above the center column to display banners. /\n banners?: ReactNode;\n /* A region to the right reserved for persistent utilities. /\n persistentUtility?: { content: ReactNode; title: string };\n\n /* A region for case widgets. /\n utilities?: ReactNode;\n /* An indicator of case widgets when the utilities are collapsed. /\n utilitiesSummaryItems?: { iconName: string; count?: number }[];\n\n /\n Determines the layout state of the utilities.\n * @default true\n /\n utilitiesExpanded?: boolean;\n /\n Callback to toggle the utilities.\n /\n onToggleUtilities?: () => void;\n /\n Indicates CaseView is rendered within a CasePreview.\n * @internal\n /\n isPreview?: boolean;\n}\n\nexport interface CaseSummaryFieldsProps {\n /* The primary summary fields to display above secondary fields. /\n primaryFields: {\n id?: string;\n name: string;\n value: ReactNode;\n }[];\n /* The secondary summary fields to display below primary fields. */\n secondaryFields: {\n id?: string;\n name: string;\n value: ReactNode;\n }[];\n}\n\nexport interface CaseViewContextValue\n extends Pick<\n CaseViewProps,\n \| 'caseId'\n \| 'heading'\n \| 'subheading'\n \| 'caseLink'\n \| 'parentCases'\n \| 'icon'\n \| 'followed'\n \| 'onFollowedChange'\n \| 'actions'\n \| 'promotedActions'\n \| 'onEdit'\n \| 'summary'\n \| 'tabs'\n \| 'summaryExpanded'\n \| 'onToggleSummary'\n \| 'utilitiesExpanded'\n \| 'persistentUtility'\n > {\n summaryId: string;\n aboveMD: boolean;\n aboveLG: boolean;\n aboveXL: boolean;\n isPreview: boolean;\n}\n"]}
1	+ {"version":3,"file":"CaseView.types.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ReactElement, ReactNode, MouseEvent } from 'react';\n\nimport {\n Tab,\n NoChildrenProp,\n ForwardProps,\n MenuItemProps,\n Action,\n BaseProps\n} from '@pega/cosmos-react-core';\n\nexport interface CaseViewProps extends NoChildrenProp, BaseProps {\n /** A unique identifier for the case instance. /\n caseId: string;\n /* Text to quickly identify a case instance. /\n heading: string;\n /* Supplemental text to identify a case instance. /\n subheading?: string;\n /* A set of props including an href that will be forwarded to the case heading and caseId. /\n caseLink?: { href: string } & ForwardProps;\n /* A set of Link props representing the case parents, rendered as Breadcrumbs. /\n parentCases?: MenuItemProps[];\n /* An icon to serve as a visual for the CaseView. /\n icon?: ReactElement;\n /* Indicates if the current user is following the case. This should be updated based on onFollowedChange. /\n followed?: boolean;\n /* Called when user chooses to follow or unfollow the case. Use this to update followed. /\n onFollowedChange?: (following: boolean) => void;\n /* Case level actions available in an action menu. /\n actions?: Action[];\n /* Visually promoted case level actions available outside the menu. /\n promotedActions?: Action[];\n /* A callback for when the edit button is clicked /\n onEdit?: () => void;\n\n /* A region to display any summary information about the CaseView. /\n summary: ReactNode;\n /\n Determines the layout state of the summary region.\n * @default true\n /\n summaryExpanded?: boolean;\n /\n Callback to toggle the case summary's layout.\n /\n onToggleSummary?: () => void;\n\n /* An object handling the rendering and functionality of the Tabs in CaseSummary. /\n tabs: {\n items: Tab[];\n onClick: (id: string, event?: MouseEvent<HTMLAnchorElement \| HTMLButtonElement>) => void;\n currentTabId: string;\n };\n /* A region within the center column that is controlled by tabs in CaseSummary. /\n tabContent?: { content: ReactNode; id: string }[];\n\n /* A region to hold a Stages component. /\n stages?: ReactNode;\n /* A region to hold a Tasks component. /\n tasks?: ReactNode;\n /* A region above the center column to display banners. /\n banners?: ReactNode;\n /* A region to the right reserved for persistent utilities. /\n persistentUtility?: { content: ReactNode; title: string };\n /\n Provide an instance of IntelligentGuidance to be rendered for a case.\n /\n intelligentGuidance?: ReactNode;\n\n /* A region for case widgets. /\n utilities?: ReactNode;\n /* An indicator of case widgets when the utilities are collapsed. /\n utilitiesSummaryItems?: { iconName: string; count?: number }[];\n\n /\n Determines the layout state of the utilities.\n * @default true\n /\n utilitiesExpanded?: boolean;\n /\n Callback to toggle the utilities.\n /\n onToggleUtilities?: () => void;\n /\n Indicates CaseView is rendered within a CasePreview.\n * @internal\n /\n isPreview?: boolean;\n}\n\nexport interface CaseSummaryFieldsProps {\n /* The primary summary fields to display above secondary fields. /\n primaryFields: {\n id?: string;\n name: string;\n value: ReactNode;\n }[];\n /* The secondary summary fields to display below primary fields. */\n secondaryFields: {\n id?: string;\n name: string;\n value: ReactNode;\n }[];\n}\n\nexport interface CaseViewContextValue\n extends Pick<\n CaseViewProps,\n \| 'caseId'\n \| 'heading'\n \| 'subheading'\n \| 'caseLink'\n \| 'parentCases'\n \| 'icon'\n \| 'followed'\n \| 'onFollowedChange'\n \| 'actions'\n \| 'promotedActions'\n \| 'onEdit'\n \| 'summary'\n \| 'tabs'\n \| 'summaryExpanded'\n \| 'onToggleSummary'\n \| 'utilitiesExpanded'\n \| 'persistentUtility'\n \| 'intelligentGuidance'\n > {\n summaryId: string;\n aboveMD: boolean;\n aboveLG: boolean;\n aboveXL: boolean;\n isPreview: boolean;\n}\n"]}

package/lib/components/ConfigurableLayout/ConfigurableLayout.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConfigurableLayout.d.ts","sourceRoot":"","sources":["../../../src/components/ConfigurableLayout/ConfigurableLayout.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,4BAA4B,CAAC;AA+B1E,QAAA,MAAM,kBAAkB,~~iHAsFvB~~,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
1	+ {"version":3,"file":"ConfigurableLayout.d.ts","sourceRoot":"","sources":["../../../src/components/ConfigurableLayout/ConfigurableLayout.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,4BAA4B,CAAC;AA+B1E,QAAA,MAAM,kBAAkB,iHA8EvB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/lib/components/ConfigurableLayout/ConfigurableLayout.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useState, useEffect, useRef, useMemo } from 'react';
+import { forwardRef, useRef, useMemo } from 'react';
 import styled, { css } from 'styled-components';
 import { Flex, defaultThemeProp } from '@pega/cosmos-react-core';
 import { containerMinWidth, cellGap } from './defaults';
@@ -28,31 +28,24 @@ const StyledContainerRuler = styled.div(({ theme }) => {
 });
 StyledContainerRuler.defaultProps = defaultThemeProp;
 const ConfigurableLayout = forwardRef(({ items, arrangement }, ref) => {
-    const [renderMode, setRenderMode] = useState('direct');
     const containerRulerRef = useRef(null);
-    // Update render mode when arrangement wraps
-    useEffect(() => {
+    const renderMode = useMemo(() => {
         const activeArrangement = arrangement?.hasWrapped !== undefined && !arrangement.hasWrapped;
         if (activeArrangement) {
             switch (arrangement.size) {
                 case 'main':
-                    setRenderMode('direct');
-                    break;
+                    return 'direct';
                 case 'half':
-                    setRenderMode('double');
-                    break;
+                    return 'double';
                 case 'narrow':
-                    setRenderMode('full');
-                    break;
+                    return 'full';
                 default:
-                    setRenderMode('direct');
-                    break;
+                    return 'direct';
             }
-            return;
         }
         // Use direct by default
-        setRenderMode('direct');
-    }, [arrangement?.hasWrapped]);
+        return 'direct';
+    }, [arrangement]);
     const content = useMemo(() => {
         if (items && !!items.length) {
             return items.map(itemConfig => {
@@ -82,7 +75,7 @@ const ConfigurableLayout = forwardRef(({ items, arrangement }, ref) => {
                             break;
                     }
                 }
-                return _jsx(LayoutCell, { config: config }, `${itemConfig.id}--${renderMode}`);
+                return _jsx(LayoutCell, { config: config }, `${itemConfig.id}`);
             });
         }
         return null;

package/lib/components/ConfigurableLayout/ConfigurableLayout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConfigurableLayout.js","sourceRoot":"","sources":["../../../src/components/ConfigurableLayout/ConfigurableLayout.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAwB,~~QAAQ,EAAE,SAAS,EAAE,~~MAAM,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;~~AAC/F~~,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAGjE,OAAO,EAAE,iBAAiB,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAExD,OAAO,UAAU,MAAM,cAAc,CAAC;AAEtC,MAAM,wBAAwB,GAAG,MAAM,CAAC,GAAG,CAAC,GAAG,EAAE;IAC/C,OAAO,GAAG,CAAA;;GAET,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC9C,OAAO,GAAG,CAAA;;;yBAGa,OAAO,GAAG,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,OAAO;6BAC/B,OAAO,GAAG,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,OAAO;0BACtC,OAAO,MAAM,KAAK,CAAC,IAAI,CAAC,OAAO;kCACvB,OAAO,MAAM,KAAK,CAAC,IAAI,CAAC,OAAO;GAC9D,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/C,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACpD,OAAO,GAAG,CAAA;0BACc,OAAO,MAAM,KAAK,CAAC,IAAI,CAAC,OAAO;yBAChC,OAAO,GAAG,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,OAAO;GACzD,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,MAAM,kBAAkB,GAAG,UAAU,CACnC,CAAC,EAAE,KAAK,EAAE,WAAW,EAA4C,EAAE,GAAqB,EAAE,EAAE;IAC1F,MAAM,~~CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAA+B,QAAQ,CAAC,CAAC;IACrF,MAAM,~~iBAAiB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEvD,~~4CAA4C;IAC5C~~,~~SAAS~~,CAAC,GAAG,EAAE;~~QACb~~,MAAM,iBAAiB,GAAG,WAAW,EAAE,UAAU,KAAK,SAAS,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC;QAE3F,IAAI,iBAAiB,EAAE;YACrB,QAAQ,WAAW,CAAC,IAAI,EAAE;gBACxB,KAAK,MAAM;oBACT,~~aAAa~~,~~CAAC,~~QAAQ,CAAC~~,CAAC~~;~~oBACxB~~,~~MAAM;gBACR,~~KAAK,MAAM;oBACT,~~aAAa~~,~~CAAC,~~QAAQ,CAAC~~,CAAC~~;~~oBACxB~~,~~MAAM;gBACR,~~KAAK,QAAQ;oBACX,~~aAAa~~,~~CAAC,~~MAAM,CAAC~~,CAAC~~;~~oBACtB,MAAM~~;~~gBACR;~~oBACE,~~aAAa~~,~~CAAC,~~QAAQ,CAAC~~,CAAC~~;~~oBACxB,MAAM~~;~~aACT~~;~~YAED,OAAO;SACR;~~QAED,wBAAwB;QACxB,~~aAAa~~,~~CAAC,~~QAAQ,CAAC~~,CAAC~~;~~IAC1B~~,CAAC,EAAE,CAAC,WAAW,~~EAAE,UAAU,~~CAAC,CAAC,CAAC;~~IAE9B~~,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3B,IAAI,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,EAAE;YAC3B,OAAO,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE;gBAC5B,MAAM,MAAM,GAAG;oBACb,GAAG,UAAU;oBACb,YAAY,EAAE,EAAE,GAAG,UAAU,CAAC,YAAY,EAAE;iBAC7C,CAAC;gBAEF,IAAI,UAAU,KAAK,QAAQ,EAAE;oBAC3B,QAAQ,UAAU,EAAE;wBAClB,KAAK,QAAQ,CAAC,CAAC;4BACb,MAAM,WAAW,GAAuD;gCACtE,KAAK,EAAE,KAAK;gCACZ,KAAK,EAAE,KAAK;gCACZ,KAAK,EAAE,MAAM;gCACb,KAAK,EAAE,MAAM;gCACb,KAAK,EAAE,MAAM;gCACb,IAAI,EAAE,MAAM;6BACb,CAAC;4BAEF,MAAM,CAAC,YAAY,CAAC,KAAK,GAAG,WAAW,CAAC,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;4BAEnE,MAAM;yBACP;wBACD,KAAK,MAAM;4BACT,MAAM,CAAC,YAAY,CAAC,KAAK,GAAG,MAAM,CAAC;4BACnC,MAAM;wBACR;4BACE,MAAM,CAAC,YAAY,CAAC,KAAK,GAAG,MAAM,CAAC;4BACnC,MAAM;qBACT;iBACF;gBAED,OAAO,KAAC,UAAU,~~IAAyC~~,MAAM,EAAE,MAAM,~~IAAjD~~,GAAG,UAAU,CAAC,EAAE,~~KAAK,UAAU,~~EAAE,CAAoB,CAAC;~~YAChF~~,CAAC,CAAC,CAAC;SACJ;QAED,OAAO,IAAI,CAAC;IACd,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC;IAExB,OAAO,CACL,KAAC,wBAAwB,cACvB,MAAC,IAAI,IACH,EAAE,EAAE,cAAc,EAClB,SAAS,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,EACtE,IAAI,EAAE,EAAE,KAAK,EAAE,iBAAiB,EAAE,IAAI,EAAE,CAAC,EAAE,EAC3C,GAAG,EAAE,GAAG,aAER,KAAC,oBAAoB,IAAC,GAAG,EAAE,iBAAiB,GAAI,EAC/C,OAAO,IACH,GACkB,CAC5B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import { forwardRef, PropsWithoutRef, Ref, ~~useState, useEffect,~~ useRef, useMemo } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Flex, defaultThemeProp } from '@pega/cosmos-react-core';\n\nimport type { ConfigurableLayoutProps } from './ConfigurableLayout.types';\nimport { containerMinWidth, cellGap } from './defaults';\nimport widthConfigOptions from './options';\nimport LayoutCell from './LayoutCell';\n\nconst StyledConfigurableLayout = styled.div(() => {\n return css`\n overflow: hidden;\n `;\n});\n\nconst StyledCellGrid = styled.div(({ theme }) => {\n return css`\n /* Note: inset position used to negate \"column\" inline margin on items /\n position: relative;\n width: calc(100% + ${cellGap 2} * ${theme.base.spacing});\n max-width: calc(100% + ${cellGap * 2} * ${theme.base.spacing});\n inset-inline: calc(-${cellGap} * ${theme.base.spacing});\n margin-block-end: calc(-2 * ${cellGap} * ${theme.base.spacing});\n `;\n});\nStyledCellGrid.defaultProps = defaultThemeProp;\n\nconst StyledContainerRuler = styled.div(({ theme }) => {\n return css`\n margin-inline: calc(${cellGap} * ${theme.base.spacing});\n width: calc(100% - ${cellGap * 2} * ${theme.base.spacing});\n `;\n});\nStyledContainerRuler.defaultProps = defaultThemeProp;\n\nconst ConfigurableLayout = forwardRef(\n ({ items, arrangement }: PropsWithoutRef<ConfigurableLayoutProps>, ref: Ref<HTMLElement>) => {\n const ~~[renderMode, setRenderMode] = useState<'direct' \| 'double' \| 'full'>('direct');\n const~~ containerRulerRef = useRef<HTMLDivElement>(null);\n\n // ~~Update~~ ~~render~~ ~~mode when arrangement wraps\n useEffect~~(() => {\n const activeArrangement = arrangement?.hasWrapped !== undefined && !arrangement.hasWrapped;\n\n if (activeArrangement) {\n switch (arrangement.size) {\n case 'main':\n ~~setRenderMode(~~'direct');\n ~~break;\n~~ case 'half':\n ~~setRenderMode(~~'double');\n ~~break;\n~~ case 'narrow':\n ~~setRenderMode(~~'full');\n ~~break;\n~~ default:\n ~~setRenderMode(~~'direct');\n ~~break;\n~~ }\n~~\n return;\n~~ }\n\n // Use direct by default\n ~~setRenderMode(~~'direct');\n }, [arrangement~~?.hasWrapped~~]);\n\n const content = useMemo(() => {\n if (items && !!items.length) {\n return items.map(itemConfig => {\n const config = {\n ...itemConfig,\n layoutConfig: { ...itemConfig.layoutConfig }\n };\n\n if (renderMode !== 'direct') {\n switch (renderMode) {\n case 'double': {\n const doubleWidth: { [key: string]: keyof typeof widthConfigOptions } = {\n '1/4': '1/2',\n '1/3': '2/3',\n '1/2': 'full',\n '2/3': 'full',\n '3/4': 'full',\n full: 'full'\n };\n\n config.layoutConfig.width = doubleWidth[config.layoutConfig.width];\n\n break;\n }\n case 'full':\n config.layoutConfig.width = 'full';\n break;\n default:\n config.layoutConfig.width = 'full';\n break;\n }\n }\n\n return <LayoutCell key={`${itemConfig.id}~~--${renderMode}~~`} config={config} />;\n });\n }\n\n return null;\n }, [items, renderMode]);\n\n return (\n <StyledConfigurableLayout>\n <Flex\n as={StyledCellGrid}\n container={{ wrap: 'wrap', justify: 'stretch', alignItems: 'stretch' }}\n item={{ basis: containerMinWidth, grow: 1 }}\n ref={ref}\n >\n <StyledContainerRuler ref={containerRulerRef} />\n {content}\n </Flex>\n </StyledConfigurableLayout>\n );\n }\n);\n\nexport default ConfigurableLayout;\n"]}
1	+ {"version":3,"file":"ConfigurableLayout.js","sourceRoot":"","sources":["../../../src/components/ConfigurableLayout/ConfigurableLayout.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, PropsWithoutRef, Ref, useRef, useMemo } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Flex, defaultThemeProp } from '@pega/cosmos-react-core';\n\nimport type { ConfigurableLayoutProps } from './ConfigurableLayout.types';\nimport { containerMinWidth, cellGap } from './defaults';\nimport widthConfigOptions from './options';\nimport LayoutCell from './LayoutCell';\n\nconst StyledConfigurableLayout = styled.div(() => {\n return css`\n overflow: hidden;\n `;\n});\n\nconst StyledCellGrid = styled.div(({ theme }) => {\n return css`\n /* Note: inset position used to negate \"column\" inline margin on items /\n position: relative;\n width: calc(100% + ${cellGap 2} * ${theme.base.spacing});\n max-width: calc(100% + ${cellGap * 2} * ${theme.base.spacing});\n inset-inline: calc(-${cellGap} * ${theme.base.spacing});\n margin-block-end: calc(-2 * ${cellGap} * ${theme.base.spacing});\n `;\n});\nStyledCellGrid.defaultProps = defaultThemeProp;\n\nconst StyledContainerRuler = styled.div(({ theme }) => {\n return css`\n margin-inline: calc(${cellGap} * ${theme.base.spacing});\n width: calc(100% - ${cellGap * 2} * ${theme.base.spacing});\n `;\n});\nStyledContainerRuler.defaultProps = defaultThemeProp;\n\nconst ConfigurableLayout = forwardRef(\n ({ items, arrangement }: PropsWithoutRef<ConfigurableLayoutProps>, ref: Ref<HTMLElement>) => {\n const containerRulerRef = useRef<HTMLDivElement>(null);\n\n const renderMode = useMemo(() => {\n const activeArrangement = arrangement?.hasWrapped !== undefined && !arrangement.hasWrapped;\n\n if (activeArrangement) {\n switch (arrangement.size) {\n case 'main':\n return 'direct';\n case 'half':\n return 'double';\n case 'narrow':\n return 'full';\n default:\n return 'direct';\n }\n }\n\n // Use direct by default\n return 'direct';\n }, [arrangement]);\n\n const content = useMemo(() => {\n if (items && !!items.length) {\n return items.map(itemConfig => {\n const config = {\n ...itemConfig,\n layoutConfig: { ...itemConfig.layoutConfig }\n };\n\n if (renderMode !== 'direct') {\n switch (renderMode) {\n case 'double': {\n const doubleWidth: { [key: string]: keyof typeof widthConfigOptions } = {\n '1/4': '1/2',\n '1/3': '2/3',\n '1/2': 'full',\n '2/3': 'full',\n '3/4': 'full',\n full: 'full'\n };\n\n config.layoutConfig.width = doubleWidth[config.layoutConfig.width];\n\n break;\n }\n case 'full':\n config.layoutConfig.width = 'full';\n break;\n default:\n config.layoutConfig.width = 'full';\n break;\n }\n }\n\n return <LayoutCell key={`${itemConfig.id}`} config={config} />;\n });\n }\n\n return null;\n }, [items, renderMode]);\n\n return (\n <StyledConfigurableLayout>\n <Flex\n as={StyledCellGrid}\n container={{ wrap: 'wrap', justify: 'stretch', alignItems: 'stretch' }}\n item={{ basis: containerMinWidth, grow: 1 }}\n ref={ref}\n >\n <StyledContainerRuler ref={containerRulerRef} />\n {content}\n </Flex>\n </StyledConfigurableLayout>\n );\n }\n);\n\nexport default ConfigurableLayout;\n"]}

package/lib/components/IntelligentGuidance/IntelligentGuidance.d.ts ADDED Viewed

@@ -0,0 +1,6 @@
+import { FunctionComponent } from 'react';
+import { ForwardProps } from '@pega/cosmos-react-core';
+import type IntelligentGuidanceProps from './IntelligentGuidance.types';
+declare const IntelligentGuidance: FunctionComponent<IntelligentGuidanceProps & ForwardProps>;
+export default IntelligentGuidance;
+//# sourceMappingURL=IntelligentGuidance.d.ts.map

package/lib/components/IntelligentGuidance/IntelligentGuidance.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"IntelligentGuidance.d.ts","sourceRoot":"","sources":["../../../src/components/IntelligentGuidance/IntelligentGuidance.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAEf,OAAO,EACL,YAAY,EASb,MAAM,yBAAyB,CAAC;AAQjC,OAAO,KAAK,wBAAwB,MAAM,6BAA6B,CAAC;AAIxE,QAAA,MAAM,mBAAmB,EAAE,iBAAiB,CAAC,wBAAwB,GAAG,YAAY,CA0HnF,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/lib/components/IntelligentGuidance/IntelligentGuidance.js ADDED Viewed

@@ -0,0 +1,86 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useEffect, useLayoutEffect, useRef, useState } from 'react';
+import { Icon, registerIcon, useI18n, Count, useBreakpoint, usePrevious, useAfterInitialEffect } from '@pega/cosmos-react-core';
+import * as polarisSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/polaris-solid.icon';
+import { StyledIntelligentGuidanceList, StyledIntelligentGuidance, StyledIntelligentGuidanceButton } from './IntelligentGuidance.styles';
+registerIcon(polarisSolidIcon);
+const IntelligentGuidance = forwardRef(({ items, heading, ...restProps }, ref) => {
+    const t = useI18n();
+    const isMediumOrAbove = useBreakpoint('md');
+    const [isCollapsed, setIsCollapsed] = useState(true);
+    const previousItems = usePrevious(items);
+    const summaryListRef = useRef(null);
+    const toggleButtonRef = useRef(null);
+    useEffect(() => {
+        const previousItemsCount = previousItems?.length || 0;
+        if (previousItemsCount < items.length) {
+            setIsCollapsed(false);
+        }
+        else if (previousItemsCount && !items.length) {
+            setIsCollapsed(true);
+        }
+    }, [previousItems, items]);
+    const listItems = items.map(item => {
+        return {
+            id: item.id,
+            visual: _jsx(Icon, { name: item.icon }),
+            primary: item.label,
+            secondary: item.type,
+            actions: item.onDismiss
+                ? [
+                    {
+                        text: t('dismiss_label_a11y', [item.label]),
+                        id: item.id,
+                        icon: 'times',
+                        onClick: (id, e) => {
+                            e.stopPropagation();
+                            item.onDismiss?.(id, e);
+                        }
+                    }
+                ]
+                : undefined,
+            container: { colGap: 1 },
+            role: 'button',
+            tabIndex: 0,
+            'aria-label': t('continue_label_a11y', [item.label]),
+            onClick: item.onClick,
+            onKeyDown: (e) => {
+                if (e.key === 'Enter') {
+                    item.onClick(e);
+                }
+            }
+        };
+    });
+    const [headerHeight, setHeaderHeight] = useState(0);
+    useLayoutEffect(() => {
+        if (summaryListRef.current) {
+            setHeaderHeight(summaryListRef.current.querySelector('header')?.offsetHeight || 0);
+        }
+    }, [summaryListRef.current]);
+    // FIXME: This is a hack to get the Tooltip to reset its position when the list is toggled.
+    useAfterInitialEffect(() => {
+        if (toggleButtonRef.current && toggleButtonRef.current === document.activeElement) {
+            toggleButtonRef.current.blur();
+            setTimeout(() => {
+                toggleButtonRef.current?.focus();
+            }, 1000);
+        }
+    }, [isCollapsed]);
+    return (_jsx(StyledIntelligentGuidance, { ...restProps, ref: ref, role: 'region', "aria-live": 'polite', "aria-relevant": 'all', isCollapsed: isCollapsed, hasItems: !!items.length, children: isMediumOrAbove || !isCollapsed ? (_jsx(StyledIntelligentGuidanceList, { ref: summaryListRef, icon: 'polaris-solid', name: heading, count: items.length, items: listItems, actions: [
+                {
+                    text: t(isCollapsed
+                        ? 'expand_intelligent_guidance_button_a11y'
+                        : 'collapse_intelligent_guidance_button_a11y'),
+                    id: 'IntelligentGuidanceButton',
+                    icon: 'caret-down',
+                    onClick() {
+                        setIsCollapsed(prevState => !prevState);
+                    },
+                    ref: toggleButtonRef
+                }
+            ], EmptyStateText: t('no_recommendations'), style: { '--headerHeight': `${headerHeight}px` } })) : (_jsxs(StyledIntelligentGuidanceButton, { variant: 'simple', "aria-label": t('expand_intelligent_guidance_button_a11y'), icon: true, onClick: () => {
+                setIsCollapsed(false);
+            }, children: [_jsx(Icon, { name: 'polaris-solid' }), _jsx(Count, { children: items.length })] })) }));
+});
+export default IntelligentGuidance;
+//# sourceMappingURL=IntelligentGuidance.js.map

package/lib/components/IntelligentGuidance/IntelligentGuidance.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"IntelligentGuidance.js","sourceRoot":"","sources":["../../../src/components/IntelligentGuidance/IntelligentGuidance.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n KeyboardEvent,\n PropsWithoutRef,\n useEffect,\n useLayoutEffect,\n useRef,\n useState\n} from 'react';\n\nimport {\n ForwardProps,\n Icon,\n registerIcon,\n SummaryListItem,\n useI18n,\n Count,\n useBreakpoint,\n usePrevious,\n useAfterInitialEffect\n} from '@pega/cosmos-react-core';\nimport * as polarisSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/polaris-solid.icon';\n\nimport {\n StyledIntelligentGuidanceList,\n StyledIntelligentGuidance,\n StyledIntelligentGuidanceButton\n} from './IntelligentGuidance.styles';\nimport type IntelligentGuidanceProps from './IntelligentGuidance.types';\n\nregisterIcon(polarisSolidIcon);\n\nconst IntelligentGuidance: FunctionComponent<IntelligentGuidanceProps & ForwardProps> = forwardRef(\n (\n { items, heading, ...restProps }: PropsWithoutRef<IntelligentGuidanceProps>,\n ref: IntelligentGuidanceProps['ref']\n ) => {\n const t = useI18n();\n const isMediumOrAbove = useBreakpoint('md');\n const [isCollapsed, setIsCollapsed] = useState(true);\n const previousItems = usePrevious(items);\n const summaryListRef = useRef<HTMLElement>(null);\n const toggleButtonRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n const previousItemsCount = previousItems?.length || 0;\n if (previousItemsCount < items.length) {\n setIsCollapsed(false);\n } else if (previousItemsCount && !items.length) {\n setIsCollapsed(true);\n }\n }, [previousItems, items]);\n\n const listItems: SummaryListItem[] = items.map(item => {\n return {\n id: item.id,\n visual: <Icon name={item.icon} />,\n primary: item.label,\n secondary: item.type,\n actions: item.onDismiss\n ? [\n {\n text: t('dismiss_label_a11y', [item.label]),\n id: item.id,\n icon: 'times',\n onClick: (id, e) => {\n e.stopPropagation();\n item.onDismiss?.(id, e);\n }\n }\n ]\n : undefined,\n container: { colGap: 1 },\n role: 'button',\n tabIndex: 0,\n 'aria-label': t('continue_label_a11y', [item.label]),\n onClick: item.onClick,\n onKeyDown: (e: KeyboardEvent) => {\n if (e.key === 'Enter') {\n item.onClick(e);\n }\n }\n };\n });\n\n const [headerHeight, setHeaderHeight] = useState(0);\n\n useLayoutEffect(() => {\n if (summaryListRef.current) {\n setHeaderHeight(summaryListRef.current.querySelector('header')?.offsetHeight || 0);\n }\n }, [summaryListRef.current]);\n\n // FIXME: This is a hack to get the Tooltip to reset its position when the list is toggled.\n useAfterInitialEffect(() => {\n if (toggleButtonRef.current && toggleButtonRef.current === document.activeElement) {\n toggleButtonRef.current.blur();\n setTimeout(() => {\n toggleButtonRef.current?.focus();\n }, 1000);\n }\n }, [isCollapsed]);\n\n return (\n <StyledIntelligentGuidance\n {...restProps}\n ref={ref}\n role='region'\n aria-live='polite'\n aria-relevant='all'\n isCollapsed={isCollapsed}\n hasItems={!!items.length}\n >\n {isMediumOrAbove || !isCollapsed ? (\n <StyledIntelligentGuidanceList\n ref={summaryListRef}\n icon='polaris-solid'\n name={heading}\n count={items.length}\n items={listItems}\n actions={[\n {\n text: t(\n isCollapsed\n ? 'expand_intelligent_guidance_button_a11y'\n : 'collapse_intelligent_guidance_button_a11y'\n ),\n id: 'IntelligentGuidanceButton',\n icon: 'caret-down',\n onClick() {\n setIsCollapsed(prevState => !prevState);\n },\n ref: toggleButtonRef\n }\n ]}\n EmptyStateText={t('no_recommendations')}\n style={{ '--headerHeight': `${headerHeight}px` }}\n />\n ) : (\n <StyledIntelligentGuidanceButton\n variant='simple'\n aria-label={t('expand_intelligent_guidance_button_a11y')}\n icon\n onClick={() => {\n setIsCollapsed(false);\n }}\n >\n <Icon name='polaris-solid' />\n <Count>{items.length}</Count>\n </StyledIntelligentGuidanceButton>\n )}\n </StyledIntelligentGuidance>\n );\n }\n);\n\nexport default IntelligentGuidance;\n"]}

package/lib/components/IntelligentGuidance/IntelligentGuidance.styles.d.ts ADDED Viewed

@@ -0,0 +1,8 @@
+export declare const StyledIntelligentGuidanceList: import("styled-components").StyledComponent<import("react").FC<import("@pega/cosmos-react-core").SummaryListProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledIntelligentGuidanceButton: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").ButtonProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
+export interface StyledIntelligentGuidanceProps {
+    isCollapsed: boolean;
+    hasItems: boolean;
+}
+export declare const StyledIntelligentGuidance: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, StyledIntelligentGuidanceProps, never>;
+//# sourceMappingURL=IntelligentGuidance.styles.d.ts.map

package/lib/components/IntelligentGuidance/IntelligentGuidance.styles.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"IntelligentGuidance.styles.d.ts","sourceRoot":"","sources":["../../../src/components/IntelligentGuidance/IntelligentGuidance.styles.ts"],"names":[],"mappings":"AAuBA,eAAO,MAAM,6BAA6B,2NA8ExC,CAAC;AAIH,eAAO,MAAM,+BAA+B,qOAiB1C,CAAC;AAaH,MAAM,WAAW,8BAA8B;IAC7C,WAAW,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,yBAAyB,qIAgCrC,CAAC"}

package/lib/components/IntelligentGuidance/IntelligentGuidance.styles.js ADDED Viewed

@@ -0,0 +1,143 @@
+import styled, { css, keyframes } from 'styled-components';
+import { lighten } from 'polished';
+import { Button, defaultThemeProp, StyledButton, StyledCard, StyledFlex, StyledIcon, StyledEmptyState, SummaryList, StyledText, tryCatch, StyledSummaryItem, StyledVisual } from '@pega/cosmos-react-core';
+import { StyledCount } from '@pega/cosmos-react-core/lib/components/Badges/Count';
+import { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';
+import { StyledSummaryListContent } from '@pega/cosmos-react-core/lib/components/SummaryList/SummaryList';
+const itemIconSize = '2rem';
+export const StyledIntelligentGuidanceList = styled(SummaryList)(({ theme }) => {
+    const borderColor = tryCatch(() => lighten(0.1, theme.components['app-shell'].nav['background-color']));
+    const hoverColor = tryCatch(() => lighten(0.05, theme.components['app-shell'].nav['background-color']));
+    return css `
+    min-width: 20rem;
+    max-width: 20rem;
+    color: ${theme.base.palette.light};
+    overflow: hidden;
+    box-shadow: ${theme.base.shadow.low};
+    @media (min-width: ${theme.base.breakpoints.lg}) {
+      min-width: 23rem;
+      max-width: 23rem;
+    }
+    &:not(& &) {
+      background-color: ${theme.components['app-shell'].nav['background-color']};
+    }
+    ${StyledCardHeader} {
+      &:not(${StyledCard} ${StyledCard} > &) {
+        padding: ${theme.base.spacing};
+      }
+      ${StyledFlex} > ${StyledIcon} {
+        width: ${itemIconSize};
+        height: ${itemIconSize};
+        padding: calc(0.75 * ${theme.base.spacing});
+        border-radius: calc(3 * ${theme.base['border-radius']});
+        background-color: ${theme.base.palette.success};
+      }
+    }
+    ${StyledSummaryListContent} {
+      &:not(${StyledCard} ${StyledCard} > &) {
+        padding: 0;
+      }
+    }
+    ${StyledButton}:enabled:focus {
+      box-shadow: ${theme.base.shadow['focus-inverted']};
+    }
+    ${StyledSummaryItem} {
+      padding: ${theme.base.spacing};
+      border-top: ${theme.components.button['border-width']} solid ${borderColor};
+      outline: none;
+      ${StyledVisual} ${StyledIcon} {
+        width: ${itemIconSize};
+        height: ${itemIconSize};
+        padding: calc(0.75 * ${theme.base.spacing});
+      }
+      ${StyledButton} {
+        visibility: hidden;
+      }
+      &:not(:last-child) {
+        border-bottom: none;
+      }
+      &:hover {
+        background-color: ${hoverColor};
+        cursor: pointer;
+      }
+      &:hover,
+      &:focus,
+      &:focus-within {
+        ${StyledButton} {
+          visibility: visible;
+        }
+      }
+      &:enabled:focus,
+      &:not([disabled]):focus {
+        box-shadow: inset ${theme.base.shadow['focus-inverted']};
+      }
+    }
+    ${StyledEmptyState} {
+      padding-bottom: ${theme.base.spacing};
+      ${StyledIcon}, ${StyledText} {
+        color: ${theme.base.palette.light};
+      }
+    }
+  `;
+});
+StyledIntelligentGuidanceList.defaultProps = defaultThemeProp;
+export const StyledIntelligentGuidanceButton = styled(Button)(({ theme }) => {
+    return css `
+    box-shadow: ${theme.base.shadow.low};
+    color: ${theme.base.palette.light};
+    background-color: ${theme.base.palette.success};
+    width: 4rem;
+    height: 4rem;
+    svg {
+      width: 2.25rem;
+      height: 2.25rem;
+    }
+    ${StyledCount} {
+      position: absolute;
+      right: 0;
+      top: 0;
+    }
+  `;
+});
+StyledIntelligentGuidanceButton.defaultProps = defaultThemeProp;
+const slideIn = keyframes `
+  0% {
+    transform: translateY(100%);
+  }
+  100% {
+    transform: translateY(0);
+  }
+`;
+export const StyledIntelligentGuidance = styled.div(({ theme, isCollapsed }) => {
+    return css `
+      position: fixed;
+      inset-inline-start: calc(2 * ${theme.base.spacing} + var(--appshell-horizontal-offset, 0rem));
+      transition: inset-inline-start ${theme.base.animation.speed}
+        ${theme.base.animation.timing.ease};
+      bottom: ${isCollapsed ? `calc(2 * ${theme.base.spacing}) ` : 0};
+      @media (min-width: ${theme.base.breakpoints.md}) {
+        bottom: 0;
+      }
+      z-index: ${theme.base['z-index'].popover};
+      ${StyledIntelligentGuidanceList}:not(${StyledIntelligentGuidanceList} ${StyledIntelligentGuidanceList}) {
+        border-bottom-left-radius: 0;
+        border-bottom-right-radius: 0;
+        transition: transform calc(4 * ${theme.base.animation.speed})
+          ${theme.base.animation.timing.ease};
+        ${isCollapsed &&
+        css `
+          transform: translateY(calc(100% - var(--headerHeight)));
+        `}
+        ${StyledCardHeader} ${StyledButton} {
+          transition: transform calc(2 * ${theme.base.animation.speed})
+            ${theme.base.animation.timing.ease};
+          transform: ${isCollapsed ? 'rotate(-180deg)' : 'rotate(0)'};
+        }
+      }
+      ${StyledIntelligentGuidanceButton} {
+        animation: ${slideIn} calc(4 * ${theme.base.animation.speed});
+      }
+    `;
+});
+StyledIntelligentGuidance.defaultProps = defaultThemeProp;
+//# sourceMappingURL=IntelligentGuidance.styles.js.map

package/lib/components/IntelligentGuidance/IntelligentGuidance.styles.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"IntelligentGuidance.styles.js","sourceRoot":"","sources":["../../../src/components/IntelligentGuidance/IntelligentGuidance.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAEnC,OAAO,EACL,MAAM,EACN,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACV,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,QAAQ,EACR,iBAAiB,EACjB,YAAY,EACb,MAAM,yBAAyB,CAAC;AACjC,OAAO,EAAE,WAAW,EAAE,MAAM,qDAAqD,CAAC;AAClF,OAAO,EAAE,gBAAgB,EAAE,MAAM,wDAAwD,CAAC;AAC1F,OAAO,EAAE,wBAAwB,EAAE,MAAM,gEAAgE,CAAC;AAE1G,MAAM,YAAY,GAAG,MAAM,CAAC;AAE5B,MAAM,CAAC,MAAM,6BAA6B,GAAG,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC7E,MAAM,WAAW,GAAG,QAAQ,CAAC,GAAG,EAAE,CAChC,OAAO,CAAC,GAAG,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC,CACpE,CAAC;IACF,MAAM,UAAU,GAAG,QAAQ,CAAC,GAAG,EAAE,CAC/B,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC,CACrE,CAAC;IACF,OAAO,GAAG,CAAA;;;aAGC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK;;kBAEnB,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG;yBACd,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE;;;;;0BAKxB,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,kBAAkB,CAAC;;MAEzE,gBAAgB;cACR,UAAU,IAAI,UAAU;mBACnB,KAAK,CAAC,IAAI,CAAC,OAAO;;QAE7B,UAAU,MAAM,UAAU;iBACjB,YAAY;kBACX,YAAY;+BACC,KAAK,CAAC,IAAI,CAAC,OAAO;kCACf,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;4BACjC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO;;;MAGhD,wBAAwB;cAChB,UAAU,IAAI,UAAU;;;;MAIhC,YAAY;oBACE,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC;;MAEjD,iBAAiB;iBACN,KAAK,CAAC,IAAI,CAAC,OAAO;oBACf,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,cAAc,CAAC,UAAU,WAAW;;QAExE,YAAY,IAAI,UAAU;iBACjB,YAAY;kBACX,YAAY;+BACC,KAAK,CAAC,IAAI,CAAC,OAAO;;QAEzC,YAAY;;;;;;;4BAOQ,UAAU;;;;;;UAM5B,YAAY;;;;;;4BAMM,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC;;;MAGzD,gBAAgB;wBACE,KAAK,CAAC,IAAI,CAAC,OAAO;QAClC,UAAU,KAAK,UAAU;iBAChB,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK;;;GAGtC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,6BAA6B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE9D,MAAM,CAAC,MAAM,+BAA+B,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC1E,OAAO,GAAG,CAAA;kBACM,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG;aAC1B,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK;wBACb,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO;;;;;;;MAO5C,WAAW;;;;;GAKd,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,+BAA+B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEhE,MAAM,OAAO,GAAG,SAAS,CAAA;;;;;;;CAOxB,CAAC;AAOF,MAAM,CAAC,MAAM,yBAAyB,GAAG,MAAM,CAAC,GAAG,CACjD,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,EAAE,EAAE;IACzB,OAAO,GAAG,CAAA;;qCAEuB,KAAK,CAAC,IAAI,CAAC,OAAO;uCAChB,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;UACvD,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;gBAC1B,WAAW,CAAC,CAAC,CAAC,YAAY,KAAK,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC,CAAC;2BACzC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE;;;iBAGnC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,OAAO;QACtC,6BAA6B,QAAQ,6BAA6B,IAAI,6BAA6B;;;yCAGlE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;YACvD,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;UAClC,WAAW;QACb,GAAG,CAAA;;SAEF;UACC,gBAAgB,IAAI,YAAY;2CACC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;cACvD,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI;uBACvB,WAAW,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,WAAW;;;QAG5D,+BAA+B;qBAClB,OAAO,aAAa,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK;;KAE9D,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,yBAAyB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css, keyframes } from 'styled-components';\nimport { lighten } from 'polished';\n\nimport {\n Button,\n defaultThemeProp,\n StyledButton,\n StyledCard,\n StyledFlex,\n StyledIcon,\n StyledEmptyState,\n SummaryList,\n StyledText,\n tryCatch,\n StyledSummaryItem,\n StyledVisual\n} from '@pega/cosmos-react-core';\nimport { StyledCount } from '@pega/cosmos-react-core/lib/components/Badges/Count';\nimport { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';\nimport { StyledSummaryListContent } from '@pega/cosmos-react-core/lib/components/SummaryList/SummaryList';\n\nconst itemIconSize = '2rem';\n\nexport const StyledIntelligentGuidanceList = styled(SummaryList)(({ theme }) => {\n const borderColor = tryCatch(() =>\n lighten(0.1, theme.components['app-shell'].nav['background-color'])\n );\n const hoverColor = tryCatch(() =>\n lighten(0.05, theme.components['app-shell'].nav['background-color'])\n );\n return css`\n min-width: 20rem;\n max-width: 20rem;\n color: ${theme.base.palette.light};\n overflow: hidden;\n box-shadow: ${theme.base.shadow.low};\n @media (min-width: ${theme.base.breakpoints.lg}) {\n min-width: 23rem;\n max-width: 23rem;\n }\n &:not(& &) {\n background-color: ${theme.components['app-shell'].nav['background-color']};\n }\n ${StyledCardHeader} {\n &:not(${StyledCard} ${StyledCard} > &) {\n padding: ${theme.base.spacing};\n }\n ${StyledFlex} > ${StyledIcon} {\n width: ${itemIconSize};\n height: ${itemIconSize};\n padding: calc(0.75 * ${theme.base.spacing});\n border-radius: calc(3 * ${theme.base['border-radius']});\n background-color: ${theme.base.palette.success};\n }\n }\n ${StyledSummaryListContent} {\n &:not(${StyledCard} ${StyledCard} > &) {\n padding: 0;\n }\n }\n ${StyledButton}:enabled:focus {\n box-shadow: ${theme.base.shadow['focus-inverted']};\n }\n ${StyledSummaryItem} {\n padding: ${theme.base.spacing};\n border-top: ${theme.components.button['border-width']} solid ${borderColor};\n outline: none;\n ${StyledVisual} ${StyledIcon} {\n width: ${itemIconSize};\n height: ${itemIconSize};\n padding: calc(0.75 * ${theme.base.spacing});\n }\n ${StyledButton} {\n visibility: hidden;\n }\n &:not(:last-child) {\n border-bottom: none;\n }\n &:hover {\n background-color: ${hoverColor};\n cursor: pointer;\n }\n &:hover,\n &:focus,\n &:focus-within {\n ${StyledButton} {\n visibility: visible;\n }\n }\n &:enabled:focus,\n &:not([disabled]):focus {\n box-shadow: inset ${theme.base.shadow['focus-inverted']};\n }\n }\n ${StyledEmptyState} {\n padding-bottom: ${theme.base.spacing};\n ${StyledIcon}, ${StyledText} {\n color: ${theme.base.palette.light};\n }\n }\n `;\n});\n\nStyledIntelligentGuidanceList.defaultProps = defaultThemeProp;\n\nexport const StyledIntelligentGuidanceButton = styled(Button)(({ theme }) => {\n return css`\n box-shadow: ${theme.base.shadow.low};\n color: ${theme.base.palette.light};\n background-color: ${theme.base.palette.success};\n width: 4rem;\n height: 4rem;\n svg {\n width: 2.25rem;\n height: 2.25rem;\n }\n ${StyledCount} {\n position: absolute;\n right: 0;\n top: 0;\n }\n `;\n});\n\nStyledIntelligentGuidanceButton.defaultProps = defaultThemeProp;\n\nconst slideIn = keyframes`\n 0% {\n transform: translateY(100%);\n }\n 100% {\n transform: translateY(0);\n }\n`;\n\nexport interface StyledIntelligentGuidanceProps {\n isCollapsed: boolean;\n hasItems: boolean;\n}\n\nexport const StyledIntelligentGuidance = styled.div<StyledIntelligentGuidanceProps>(\n ({ theme, isCollapsed }) => {\n return css`\n position: fixed;\n inset-inline-start: calc(2 * ${theme.base.spacing} + var(--appshell-horizontal-offset, 0rem));\n transition: inset-inline-start ${theme.base.animation.speed}\n ${theme.base.animation.timing.ease};\n bottom: ${isCollapsed ? `calc(2 * ${theme.base.spacing}) ` : 0};\n @media (min-width: ${theme.base.breakpoints.md}) {\n bottom: 0;\n }\n z-index: ${theme.base['z-index'].popover};\n ${StyledIntelligentGuidanceList}:not(${StyledIntelligentGuidanceList} ${StyledIntelligentGuidanceList}) {\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n transition: transform calc(4 * ${theme.base.animation.speed})\n ${theme.base.animation.timing.ease};\n ${isCollapsed &&\n css`\n transform: translateY(calc(100% - var(--headerHeight)));\n `}\n ${StyledCardHeader} ${StyledButton} {\n transition: transform calc(2 * ${theme.base.animation.speed})\n ${theme.base.animation.timing.ease};\n transform: ${isCollapsed ? 'rotate(-180deg)' : 'rotate(0)'};\n }\n }\n ${StyledIntelligentGuidanceButton} {\n animation: ${slideIn} calc(4 * ${theme.base.animation.speed});\n }\n `;\n }\n);\n\nStyledIntelligentGuidance.defaultProps = defaultThemeProp;\n"]}

package/lib/components/IntelligentGuidance/IntelligentGuidance.types.d.ts ADDED Viewed

@@ -0,0 +1,31 @@
+import { MouseEvent, KeyboardEvent, Ref } from 'react';
+import { BaseProps, IconProps, NoChildrenProp } from '@pega/cosmos-react-core';
+export interface IntelligentGuidanceItemProps {
+    /** Unique id for item */
+    id: string;
+    /** The label text of the item. */
+    label: string;
+    /**
+     * Name of the icon (to be selected from default Pega icon set)
+     */
+    icon: IconProps['name'];
+    /** Represents the type of task */
+    type: string;
+    /**
+     * Click handler for the action button.
+     */
+    onClick: (e: MouseEvent | KeyboardEvent) => void;
+    /**
+     * Dismiss handler for the action button.
+     */
+    onDismiss?: (id: IntelligentGuidanceItemProps['id'], e: MouseEvent<HTMLButtonElement | HTMLAnchorElement | HTMLInputElement>) => void;
+}
+export default interface IntelligentGuidanceProps extends BaseProps, NoChildrenProp {
+    /** List of guidance items. */
+    items: IntelligentGuidanceItemProps[];
+    /** Header text. */
+    heading: string;
+    /** Ref for the wrapping element. */
+    ref?: Ref<HTMLDivElement>;
+}
+//# sourceMappingURL=IntelligentGuidance.types.d.ts.map

package/lib/components/IntelligentGuidance/IntelligentGuidance.types.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"IntelligentGuidance.types.d.ts","sourceRoot":"","sources":["../../../src/components/IntelligentGuidance/IntelligentGuidance.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAEvD,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAE/E,MAAM,WAAW,4BAA4B;IAC3C,yBAAyB;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,kCAAkC;IAClC,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IACxB,kCAAkC;IAClC,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,OAAO,EAAE,CAAC,CAAC,EAAE,UAAU,GAAG,aAAa,KAAK,IAAI,CAAC;IACjD;;OAEG;IACH,SAAS,CAAC,EAAE,CACV,EAAE,EAAE,4BAA4B,CAAC,IAAI,CAAC,EACtC,CAAC,EAAE,UAAU,CAAC,iBAAiB,GAAG,iBAAiB,GAAG,gBAAgB,CAAC,KACpE,IAAI,CAAC;CACX;AAED,MAAM,CAAC,OAAO,WAAW,wBAAyB,SAAQ,SAAS,EAAE,cAAc;IACjF,8BAA8B;IAC9B,KAAK,EAAE,4BAA4B,EAAE,CAAC;IACtC,mBAAmB;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B"}

package/lib/components/IntelligentGuidance/IntelligentGuidance.types.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export {};
2	+ //# sourceMappingURL=IntelligentGuidance.types.js.map

package/lib/components/IntelligentGuidance/IntelligentGuidance.types.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"IntelligentGuidance.types.js","sourceRoot":"","sources":["../../../src/components/IntelligentGuidance/IntelligentGuidance.types.ts"],"names":[],"mappings":"","sourcesContent":["import { MouseEvent, KeyboardEvent, Ref } from 'react';\n\nimport { BaseProps, IconProps, NoChildrenProp } from '@pega/cosmos-react-core';\n\nexport interface IntelligentGuidanceItemProps {\n /** Unique id for item */\n id: string;\n /** The label text of the item. */\n label: string;\n /**\n * Name of the icon (to be selected from default Pega icon set)\n */\n icon: IconProps['name'];\n /** Represents the type of task */\n type: string;\n /**\n * Click handler for the action button.\n */\n onClick: (e: MouseEvent | KeyboardEvent) => void;\n /**\n * Dismiss handler for the action button.\n */\n onDismiss?: (\n id: IntelligentGuidanceItemProps['id'],\n e: MouseEvent<HTMLButtonElement | HTMLAnchorElement | HTMLInputElement>\n ) => void;\n}\n\nexport default interface IntelligentGuidanceProps extends BaseProps, NoChildrenProp {\n /** List of guidance items. */\n items: IntelligentGuidanceItemProps[];\n /** Header text. */\n heading: string;\n /** Ref for the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n"]}

package/lib/components/IntelligentGuidance/index.d.ts ADDED Viewed

@@ -0,0 +1,3 @@
+export { default } from './IntelligentGuidance';
+export { default as IntelligentGuidanceProps } from './IntelligentGuidance.types';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/IntelligentGuidance/index.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/IntelligentGuidance/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,6BAA6B,CAAC"}

package/lib/components/IntelligentGuidance/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export { default } from './IntelligentGuidance';
2	+ //# sourceMappingURL=index.js.map

package/lib/components/IntelligentGuidance/index.js.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/IntelligentGuidance/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC","sourcesContent":["export { default } from './IntelligentGuidance';\nexport { default as IntelligentGuidanceProps } from './IntelligentGuidance.types';\n"]}

package/lib/index.d.ts CHANGED Viewed

@@ -12,6 +12,8 @@ export { default as Details } from './components/Details';
 export * from './components/Details';
 export { default as Glimpse } from './components/Glimpse';
 export * from './components/Glimpse';
+export { default as IntelligentGuidance } from './components/IntelligentGuidance';
+export * from './components/IntelligentGuidance';
 export { default as SearchResults } from './components/SearchResults';
 export * from './components/SearchResults';
 export { default as Stages } from './components/Stages';

package/lib/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC1E,cAAc,8BAA8B,CAAC;AAC7C,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,cAAc,0BAA0B,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,cAAc,uBAAuB,CAAC;AACtC,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAChF,cAAc,iCAAiC,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACpE,cAAc,2BAA2B,CAAC;AAC1C,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AACtE,cAAc,4BAA4B,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,qBAAqB,CAAC;AACxD,cAAc,qBAAqB,CAAC;AACpC,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACpE,cAAc,2BAA2B,CAAC;AAC1C,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACpD,cAAc,mBAAmB,CAAC;AAClC,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,oBAAoB,CAAC;AACtD,cAAc,oBAAoB,CAAC;AACnC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,cAAc,uBAAuB,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC1E,cAAc,8BAA8B,CAAC;AAC7C,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,cAAc,0BAA0B,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,cAAc,uBAAuB,CAAC;AACtC,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAChF,cAAc,iCAAiC,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACpE,cAAc,2BAA2B,CAAC;AAC1C,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAClF,cAAc,kCAAkC,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AACtE,cAAc,4BAA4B,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,qBAAqB,CAAC;AACxD,cAAc,qBAAqB,CAAC;AACpC,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACpE,cAAc,2BAA2B,CAAC;AAC1C,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACpD,cAAc,mBAAmB,CAAC;AAClC,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,oBAAoB,CAAC;AACtD,cAAc,oBAAoB,CAAC;AACnC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,cAAc,uBAAuB,CAAC"}

package/lib/index.js CHANGED Viewed

@@ -13,6 +13,8 @@ export { default as Details } from './components/Details';
 export * from './components/Details';
 export { default as Glimpse } from './components/Glimpse';
 export * from './components/Glimpse';
+export { default as IntelligentGuidance } from './components/IntelligentGuidance';
+export * from './components/IntelligentGuidance';
 export { default as SearchResults } from './components/SearchResults';
 export * from './components/SearchResults';
 export { default as Stages } from './components/Stages';

package/lib/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,+DAA+D;AAC/D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC1E,cAAc,8BAA8B,CAAC;AAC7C,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,cAAc,0BAA0B,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,cAAc,uBAAuB,CAAC;AACtC,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAChF,cAAc,iCAAiC,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACpE,cAAc,2BAA2B,CAAC;AAC1C,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AACtE,cAAc,4BAA4B,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,qBAAqB,CAAC;AACxD,cAAc,qBAAqB,CAAC;AACpC,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACpE,cAAc,2BAA2B,CAAC;AAC1C,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACpD,cAAc,mBAAmB,CAAC;AAClC,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,oBAAoB,CAAC;AACtD,cAAc,oBAAoB,CAAC;AACnC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,cAAc,uBAAuB,CAAC","sourcesContent":["// This file is autogenerated. Any changes will be overwritten.\nexport { default as AppAnnouncement } from './components/AppAnnouncement';\nexport * from './components/AppAnnouncement';\nexport { default as CasePreview } from './components/CasePreview';\nexport * from './components/CasePreview';\nexport { default as CaseView } from './components/CaseView';\nexport * from './components/CaseView';\nexport { default as ConfigurableLayout } from './components/ConfigurableLayout';\nexport * from './components/ConfigurableLayout';\nexport { default as Confirmation } from './components/Confirmation';\nexport * from './components/Confirmation';\nexport { default as Details } from './components/Details';\nexport * from './components/Details';\nexport { default as Glimpse } from './components/Glimpse';\nexport * from './components/Glimpse';\nexport { default as SearchResults } from './components/SearchResults';\nexport * from './components/SearchResults';\nexport { default as Stages } from './components/Stages';\nexport * from './components/Stages';\nexport { default as Stakeholders } from './components/Stakeholders';\nexport * from './components/Stakeholders';\nexport { default as Tags } from './components/Tags';\nexport * from './components/Tags';\nexport { default as Tasks } from './components/Tasks';\nexport * from './components/Tasks';\nexport { default as Timeline } from './components/Timeline';\nexport * from './components/Timeline';\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,+DAA+D;AAC/D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC1E,cAAc,8BAA8B,CAAC;AAC7C,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,cAAc,0BAA0B,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,cAAc,uBAAuB,CAAC;AACtC,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAChF,cAAc,iCAAiC,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACpE,cAAc,2BAA2B,CAAC;AAC1C,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC1D,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAClF,cAAc,kCAAkC,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AACtE,cAAc,4BAA4B,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,qBAAqB,CAAC;AACxD,cAAc,qBAAqB,CAAC;AACpC,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACpE,cAAc,2BAA2B,CAAC;AAC1C,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACpD,cAAc,mBAAmB,CAAC;AAClC,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,oBAAoB,CAAC;AACtD,cAAc,oBAAoB,CAAC;AACnC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,cAAc,uBAAuB,CAAC","sourcesContent":["// This file is autogenerated. Any changes will be overwritten.\nexport { default as AppAnnouncement } from './components/AppAnnouncement';\nexport * from './components/AppAnnouncement';\nexport { default as CasePreview } from './components/CasePreview';\nexport * from './components/CasePreview';\nexport { default as CaseView } from './components/CaseView';\nexport * from './components/CaseView';\nexport { default as ConfigurableLayout } from './components/ConfigurableLayout';\nexport * from './components/ConfigurableLayout';\nexport { default as Confirmation } from './components/Confirmation';\nexport * from './components/Confirmation';\nexport { default as Details } from './components/Details';\nexport * from './components/Details';\nexport { default as Glimpse } from './components/Glimpse';\nexport * from './components/Glimpse';\nexport { default as IntelligentGuidance } from './components/IntelligentGuidance';\nexport * from './components/IntelligentGuidance';\nexport { default as SearchResults } from './components/SearchResults';\nexport * from './components/SearchResults';\nexport { default as Stages } from './components/Stages';\nexport * from './components/Stages';\nexport { default as Stakeholders } from './components/Stakeholders';\nexport * from './components/Stakeholders';\nexport { default as Tags } from './components/Tags';\nexport * from './components/Tags';\nexport { default as Tasks } from './components/Tasks';\nexport * from './components/Tasks';\nexport { default as Timeline } from './components/Timeline';\nexport * from './components/Timeline';\n"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@pega/cosmos-react-work",
-  "version": "3.0.0-rc.3",
+  "version": "3.0.0-rc.5",
   "author": "Pegasystems",
   "license": "SEE LICENSE IN LICENSE",
   "repository": {
@@ -20,7 +20,7 @@
     "build": "tsc -b"
   },
   "dependencies": {
-    "@pega/cosmos-react-core": "3.0.0-rc.3",
+    "@pega/cosmos-react-core": "3.0.0-rc.5",
     "@types/react": "^16.14.24 || ^17.0.38",
     "@types/react-dom": "^16.9.14 || ^17.0.11",
     "@types/styled-components": "^5.1.7",
@@ -38,10 +38,8 @@
     "@storybook/react": "^6.4.19",
     "@storybook/testing-react": "^1.2.4",
     "@storybook/theming": "^6.4.19",
-    "@testing-library/jest-dom": "^5.16.2",
     "@testing-library/react": "^12.1.3",
     "@testing-library/user-event": "^13.5.0",
-    "enzyme": "^3.11.0",
     "typescript": "~4.7.2"
   }
 }