npm - @pega/cosmos-react-work - Versions diffs - 4.0.0-dev.1.2 → 4.0.0-dev.10.1 - Mend

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

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

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 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 &: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 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 ${aboveMD\n ? css`\n position: sticky;\n `\n : css`\n @media (min-height: ${theme.base.breakpoints.sm}) {\n position: sticky;\n }\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 CardContent,\n defaultThemeProp,\n StyledBreadcrumbs,\n StyledButton,\n StyledFieldValue,\n StyledStackedFieldValue,\n StyledIcon,\n StyledPopover,\n StyledText,\n StyledTooltip,\n tryCatch,\n FontSize,\n FieldValueList\n} from '@pega/cosmos-react-core';\nimport { StyledMenu } from '@pega/cosmos-react-core/lib/components/Menu/Menu.styles';\nimport { colCountChWidth } from '@pega/cosmos-react-work/lib/components/Details/Details.styles';\n\nimport { useCaseViewContext } from './CaseView.context';\n\nconst labelChWidth = 16;\n\nexport const StyledCaseSummaryFields = styled.div(({ theme }) => {\n return css`\n padding-block: calc(1.5 * ${theme.base.spacing});\n padding-inline: calc(2 * ${theme.base.spacing});\n `;\n});\n\nStyledCaseSummaryFields.defaultProps = defaultThemeProp;\n\nexport const StyledSummaryPrimaryList = styled(FieldValueList)(({ theme }) => {\n const fontSizes = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n grid-template-columns: ${labelChWidth}ch 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\nStyledSummaryPrimaryList.defaultProps = defaultThemeProp;\n\nexport const StyledSummarySecondaryList = styled(FieldValueList)(() => {\n return css`\n ${StyledStackedFieldValue} {\n grid-column: 1 / -1;\n }\n `;\n});\n\nexport const StyledSummaryTabContent = styled(CardContent)(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n const containerWidthCh = colCountChWidth[1].containerWidth;\n const containerWidthMinusLabel = `${containerWidthCh - labelChWidth}ch`;\n\n return css`\n ${StyledCaseSummaryFields} {\n padding: 0;\n }\n\n ${StyledSummarySecondaryList} {\n > ${StyledStackedFieldValue} {\n max-width: ${containerWidthCh}ch;\n }\n\n > ${StyledFieldValue} {\n max-width: calc(${containerWidthMinusLabel} - 2 * ${spacing});\n }\n }\n `;\n});\n\nStyledSummaryTabContent.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 h1:focus-visible {\n outline: transparent;\n box-shadow: ${theme.base.shadow.focus};\n }\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};\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};\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 &: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 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 ${aboveMD\n ? css`\n position: sticky;\n `\n : css`\n @media (min-height: ${theme.base.breakpoints.sm}) {\n position: sticky;\n }\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

@@ -1,5 +1,12 @@
 import { ReactElement, ReactNode, MouseEvent } from 'react';
-import { Tab, NoChildrenProp, ForwardProps, MenuItemProps, Action, BaseProps } from '@pega/cosmos-react-core';
+import { Tab, NoChildrenProp, FieldValueListItemProps, ForwardProps, MenuItemProps, Action, BaseProps, OmitStrict, RequireAtLeastOne } from '@pega/cosmos-react-core';
+export interface SummaryField extends OmitStrict<FieldValueListItemProps, 'value'> {
+    value: FieldValueListItemProps['value'];
+}
+export type CaseSummaryFieldsProps = RequireAtLeastOne<{
+    primary?: SummaryField[];
+    secondary?: SummaryField[];
+}>;
 export interface CaseViewProps extends NoChildrenProp, BaseProps {
     /** A unique identifier for the case instance. */
     caseId: string;
@@ -25,8 +32,8 @@ export interface CaseViewProps extends NoChildrenProp, BaseProps {
     promotedActions?: Action[];
     /** A callback for when the edit button is clicked */
     onEdit?: () => void;
-    /** A region to display any summary information about the CaseView. */
-    summary: ReactNode;
+    /** Field data to render in summary areas. */
+    summaryFields: CaseSummaryFieldsProps;
     /**
      * Determines the layout state of the summary region.
      * @default true
@@ -79,22 +86,9 @@ export interface CaseViewProps extends NoChildrenProp, BaseProps {
      */
     onToggleUtilities?: () => void;
 }
-export interface CaseSummaryFieldsProps {
-    /** The primary summary fields to display above secondary fields. */
-    primaryFields: {
-        id?: string;
-        name: string;
-        value: ReactNode;
-    }[];
-    /** The secondary summary fields to display below primary fields. */
-    secondaryFields: {
-        id?: string;
-        name: string;
-        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' | 'intelligentGuidance'> {
+export interface CaseViewContextValue extends Pick<CaseViewProps, 'caseId' | 'heading' | 'subheading' | 'caseLink' | 'parentCases' | 'icon' | 'followed' | 'onFollowedChange' | 'actions' | 'promotedActions' | 'onEdit' | 'tabs' | 'summaryExpanded' | 'onToggleSummary' | 'utilitiesExpanded' | 'persistentUtility' | 'intelligentGuidance'> {
     summaryId: string;
+    summary: ReactNode;
     aboveMD: boolean;
     aboveLG: boolean;
     aboveXL: 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;~~IAC1D~~;;OAEG;IACH,mBAAmB,CAAC,EAAE,SAAS,CAAC;IAEhC,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,GACnB,qBAAqB,CACxB;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 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"]}
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 FieldValueListItemProps,\n ForwardProps,\n MenuItemProps,\n Action,\n BaseProps,\n OmitStrict,\n RequireAtLeastOne\n} from '@pega/cosmos-react-core';\n\nexport interface SummaryField extends OmitStrict<FieldValueListItemProps, 'value'> {\n value: FieldValueListItemProps['value'];\n}\n\nexport type CaseSummaryFieldsProps = RequireAtLeastOne<{\n primary?: SummaryField[];\n secondary?: SummaryField[];\n}>;\n\nexport interface CaseViewProps extends NoChildrenProp, BaseProps {\n /** A unique identifier for the case instance. /\n caseId: string;\n\n /* Text to quickly identify a case instance. /\n heading: string;\n\n /* Supplemental text to identify a case instance. /\n subheading?: string;\n\n /* A set of props including an href that will be forwarded to the case heading and caseId. /\n caseLink?: { href: string } & ForwardProps;\n\n /* A set of Link props representing the case parents, rendered as Breadcrumbs. /\n parentCases?: MenuItemProps[];\n\n /* An icon to serve as a visual for the CaseView. /\n icon?: ReactElement;\n\n /* Indicates if the current user is following the case. This should be updated based on onFollowedChange. /\n followed?: boolean;\n\n /* Called when user chooses to follow or unfollow the case. Use this to update followed. /\n onFollowedChange?: (following: boolean) => void;\n\n /* Case level actions available in an action menu. /\n actions?: Action[];\n\n /* Visually promoted case level actions available outside the menu. /\n promotedActions?: Action[];\n\n /* A callback for when the edit button is clicked /\n onEdit?: () => void;\n\n /* Field data to render in summary areas. /\n summaryFields: CaseSummaryFieldsProps;\n\n /\n Determines the layout state of the summary region.\n * @default true\n /\n summaryExpanded?: boolean;\n\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\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\n /* A region to hold a Tasks component. /\n tasks?: ReactNode;\n\n /* A region above the center column to display banners. /\n banners?: ReactNode;\n\n /* A region to the right reserved for persistent utilities. /\n persistentUtility?: { content: ReactNode; title: string };\n\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\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 /\n Callback to toggle the utilities.\n /\n onToggleUtilities?: () => void;\n\n /\n Indicates CaseView is rendered within a CasePreview.\n * @internal\n */\n isPreview?: boolean;\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 \| 'tabs'\n \| 'summaryExpanded'\n \| 'onToggleSummary'\n \| 'utilitiesExpanded'\n \| 'persistentUtility'\n \| 'intelligentGuidance'\n > {\n summaryId: string;\n summary: ReactNode;\n aboveMD: boolean;\n aboveLG: boolean;\n aboveXL: boolean;\n isPreview: boolean;\n}\n"]}

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

@@ -18,7 +18,7 @@ const UtilitiesSummary = ({ items = [], onClick }) => {
                     direction: 'column',
                     alignItems: 'center',
                     gap: 0.5
-                }, item: { grow: 1 }, children: [_jsx(Icon, { name: item.iconName }), item.count !== undefined && _jsx(Count, { variant: 'default', children: item.count })] }, item.iconName));
+                }, item: { grow: 1 }, children: [_jsx(Icon, { name: item.iconName }), item.count !== undefined && _jsx(Count, { children: item.count })] }, item.iconName));
         }) })) : null;
 };
 export default UtilitiesSummary;

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

	@@ -1 +1 @@
1	- {"version":3,"file":"UtilitiesSummary.js","sourceRoot":"","sources":["../../../src/components/CaseView/UtilitiesSummary.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAS3E,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC7D,OAAO,GAAG,CAAA;;eAEG,KAAK,CAAC,IAAI,CAAC,OAAO;;GAE9B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,gBAAgB,GAA6C,CAAC,EAAE,KAAK,GAAG,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE;IAC7F,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CACpB,KAAC,IAAI,IACH,WAAW,QACX,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,gBACpD,GAAG,CAAC,CAAC,mBAAmB,CAAC,KAAK,CAAC,CAAC,wBAAwB,CAAC,EAAE,EACvE,EAAE,EAAE,sBAAsB,EAC1B,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,CAAC,CAAgC,EAAE,EAAE;YAC9C,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO;gBAAE,OAAO,EAAE,EAAE,CAAC;QACtD,CAAC,YAEA,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YAChB,OAAO,CACL,MAAC,IAAI,IACH,SAAS,EAAE;oBACT,SAAS,EAAE,QAAQ;oBACnB,UAAU,EAAE,QAAQ;oBACpB,GAAG,EAAE,GAAG;iBACT,EACD,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,aAGjB,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,GAAI,EAC5B,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,KAAC,KAAK,~~IAAC~~,~~OAAO,EAAC,SAAS,YAAE,~~IAAI,CAAC,KAAK,GAAS,~~KAHrE~~,IAAI,CAAC,QAAQ,CAIb,CACR,CAAC;QACJ,CAAC,CAAC,GACG,CACR,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { FunctionComponent, KeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Card, Count, Flex, Icon, useI18n } from '@pega/cosmos-react-core';\n\nimport { CaseViewProps } from './CaseView.types';\n\nexport interface UtilitiesSummaryProps {\n items?: CaseViewProps['utilitiesSummaryItems'];\n onClick?: () => void;\n}\n\nexport const StyledUtilitiesSummary = styled.div(({ theme }) => {\n return css`\n width: 2.75rem;\n padding: ${theme.base.spacing} 0;\n cursor: pointer;\n `;\n});\n\nconst UtilitiesSummary: FunctionComponent<UtilitiesSummaryProps> = ({ items = [], onClick }) => {\n const t = useI18n();\n return items.length ? (\n <Card\n interactive\n tabIndex={0}\n role='button'\n container={{ direction: 'column', alignItems: 'center', gap: 3 }}\n aria-label={`${t('utilities_summary')}. ${t('expand_utilities_panel')}`}\n as={StyledUtilitiesSummary}\n onClick={onClick}\n onKeyDown={(e: KeyboardEvent<HTMLDivElement>) => {\n if (e.key === ' ' \|\| e.key === 'Enter') onClick?.();\n }}\n >\n {items.map(item => {\n return (\n <Flex\n container={{\n direction: 'column',\n alignItems: 'center',\n gap: 0.5\n }}\n item={{ grow: 1 }}\n key={item.iconName}\n >\n <Icon name={item.iconName} />\n {item.count !== undefined && <Count ~~variant='default'~~>{item.count}</Count>}\n </Flex>\n );\n })}\n </Card>\n ) : null;\n};\n\nexport default UtilitiesSummary;\n"]}
1	+ {"version":3,"file":"UtilitiesSummary.js","sourceRoot":"","sources":["../../../src/components/CaseView/UtilitiesSummary.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAS3E,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC7D,OAAO,GAAG,CAAA;;eAEG,KAAK,CAAC,IAAI,CAAC,OAAO;;GAE9B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,gBAAgB,GAA6C,CAAC,EAAE,KAAK,GAAG,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE;IAC7F,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CACpB,KAAC,IAAI,IACH,WAAW,QACX,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,gBACpD,GAAG,CAAC,CAAC,mBAAmB,CAAC,KAAK,CAAC,CAAC,wBAAwB,CAAC,EAAE,EACvE,EAAE,EAAE,sBAAsB,EAC1B,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,CAAC,CAAgC,EAAE,EAAE;YAC9C,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO;gBAAE,OAAO,EAAE,EAAE,CAAC;QACtD,CAAC,YAEA,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YAChB,OAAO,CACL,MAAC,IAAI,IACH,SAAS,EAAE;oBACT,SAAS,EAAE,QAAQ;oBACnB,UAAU,EAAE,QAAQ;oBACpB,GAAG,EAAE,GAAG;iBACT,EACD,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,aAGjB,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,CAAC,QAAQ,GAAI,EAC5B,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,KAAC,KAAK,cAAE,IAAI,CAAC,KAAK,GAAS,KAHnD,IAAI,CAAC,QAAQ,CAIb,CACR,CAAC;QACJ,CAAC,CAAC,GACG,CACR,CAAC,CAAC,CAAC,IAAI,CAAC;AACX,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { FunctionComponent, KeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Card, Count, Flex, Icon, useI18n } from '@pega/cosmos-react-core';\n\nimport { CaseViewProps } from './CaseView.types';\n\nexport interface UtilitiesSummaryProps {\n items?: CaseViewProps['utilitiesSummaryItems'];\n onClick?: () => void;\n}\n\nexport const StyledUtilitiesSummary = styled.div(({ theme }) => {\n return css`\n width: 2.75rem;\n padding: ${theme.base.spacing} 0;\n cursor: pointer;\n `;\n});\n\nconst UtilitiesSummary: FunctionComponent<UtilitiesSummaryProps> = ({ items = [], onClick }) => {\n const t = useI18n();\n return items.length ? (\n <Card\n interactive\n tabIndex={0}\n role='button'\n container={{ direction: 'column', alignItems: 'center', gap: 3 }}\n aria-label={`${t('utilities_summary')}. ${t('expand_utilities_panel')}`}\n as={StyledUtilitiesSummary}\n onClick={onClick}\n onKeyDown={(e: KeyboardEvent<HTMLDivElement>) => {\n if (e.key === ' ' \|\| e.key === 'Enter') onClick?.();\n }}\n >\n {items.map(item => {\n return (\n <Flex\n container={{\n direction: 'column',\n alignItems: 'center',\n gap: 0.5\n }}\n item={{ grow: 1 }}\n key={item.iconName}\n >\n <Icon name={item.iconName} />\n {item.count !== undefined && <Count>{item.count}</Count>}\n </Flex>\n );\n })}\n </Card>\n ) : null;\n};\n\nexport default UtilitiesSummary;\n"]}

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

	@@ -1 +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,~~CAyHnF~~,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
1	+ {"version":3,"file":"IntelligentGuidance.d.ts","sourceRoot":"","sources":["../../../src/components/IntelligentGuidance/IntelligentGuidance.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAMlB,MAAM,OAAO,CAAC;AAEf,OAAO,EACL,YAAY,EAQb,MAAM,yBAAyB,CAAC;AAQjC,OAAO,KAAK,wBAAwB,MAAM,6BAA6B,CAAC;AAIxE,QAAA,MAAM,mBAAmB,EAAE,iBAAiB,CAAC,wBAAwB,GAAG,YAAY,CAgHnF,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

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

@@ -1,25 +1,14 @@
 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 { forwardRef, useLayoutEffect, useRef, useState } from 'react';
+import { Icon, registerIcon, useI18n, Count, useBreakpoint, 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 IntelligentGuidance = forwardRef(({ items, heading, isCollapsed, onExpandCollapse, ...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,
@@ -74,14 +63,10 @@ const IntelligentGuidance = forwardRef(({ items, heading, ...restProps }, ref) =
                     'aria-label': isCollapsed
                         ? t('expand_noun', [heading])
                         : t('collapse_noun', [heading]),
-                    onClick() {
-                        setIsCollapsed(prevState => !prevState);
-                    },
+                    onClick: onExpandCollapse,
                     ref: toggleButtonRef
                 }
-            ], EmptyStateText: t('no_recommendations'), style: { '--headerHeight': `${headerHeight}px` } })) : (_jsxs(StyledIntelligentGuidanceButton, { variant: 'simple', "aria-label": isCollapsed ? t('expand_noun', [heading]) : t('collapse_noun', [heading]), icon: true, onClick: () => {
-                setIsCollapsed(false);
-            }, children: [_jsx(Icon, { name: 'polaris-solid' }), _jsx(Count, { children: items.length })] })) }));
+            ], EmptyStateText: t('no_recommendations'), style: { '--headerHeight': `${headerHeight}px` } })) : (_jsxs(StyledIntelligentGuidanceButton, { variant: 'simple', "aria-label": isCollapsed ? t('expand_noun', [heading]) : t('collapse_noun', [heading]), icon: true, onClick: onExpandCollapse, 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 CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IntelligentGuidance.js","sourceRoot":"","sources":["../../../src/components/IntelligentGuidance/IntelligentGuidance.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EAIV,~~SAAS,EACT,~~eAAe,EACf,MAAM,EACN,QAAQ,EACT,MAAM,OAAO,CAAC;AAEf,OAAO,EAEL,IAAI,EACJ,YAAY,EAEZ,OAAO,EACP,KAAK,EACL,aAAa,EACb,~~WAAW,EACX,~~qBAAqB,EACtB,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,gBAAgB,MAAM,sEAAsE,CAAC;AAEzG,OAAO,EACL,6BAA6B,EAC7B,yBAAyB,EACzB,+BAA+B,EAChC,MAAM,8BAA8B,CAAC;AAGtC,YAAY,CAAC,gBAAgB,CAAC,CAAC;AAE/B,MAAM,mBAAmB,GAA+D,UAAU,CAChG,CACE,~~EAAE~~,KAAK,~~EAAE~~,OAAO,~~EAAE~~,GAAG,SAAS,~~EAA6C~~,~~EAC3E~~,GAAoC,EACpC,EAAE;IACF,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,eAAe,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC;IAC5C,MAAM,~~CAAC,WAAW,EAAE,~~cAAc,~~CAAC,~~GAAG,~~QAAQ,CAAC,IAAI,CAAC,CAAC;IACrD,~~MAAM,~~aAAa,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IACzC,MAAM,cAAc,GAAG,MAAM,~~CAAc,IAAI,CAAC,CAAC;IACjD,MAAM,eAAe,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAExD,~~SAAS,CAAC,GAAG,EAAE;QACb,~~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~~;wBACL~~,~~cAAc,CAAC,SAAS,CAAC,~~EAAE,~~CAAC,CAAC,SAAS,CAAC,CAAC~~;~~oBAC1C~~,~~CAAC;oBACD,~~GAAG,EAAE,eAAe;iBACrB;aACF,EACD,cAAc,EAAE,CAAC,CAAC,oBAAoB,CAAC,EACvC,KAAK,EAAE,EAAE,gBAAgB,EAAE,GAAG,YAAY,IAAI,EAAE,GAChD,CACH,CAAC,CAAC,CAAC,CACF,MAAC,+BAA+B,IAC9B,OAAO,EAAC,QAAQ,gBACJ,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,aAAa,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,eAAe,EAAE,CAAC,OAAO,CAAC,CAAC,EACrF,IAAI,QACJ,OAAO,EAAE,~~GAAG~~,~~EAAE;gBACZ~~,~~cAAc,CAAC,KAAK,CAAC,CAAC;YACxB,CAAC,aAED,~~KAAC,IAAI,IAAC,IAAI,EAAC,eAAe,GAAG,EAC7B,KAAC,KAAK,cAAE,KAAK,CAAC,MAAM,GAAS,IACG,CACnC,GACyB,CAC7B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,mBAAmB,CAAC","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(isCollapsed ? 'expand' : 'collapse'),\n id: 'IntelligentGuidanceButton',\n icon: 'caret-down',\n 'aria-label': isCollapsed\n ? t('expand_noun', [heading])\n : t('collapse_noun', [heading]),\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={isCollapsed ? t('expand_noun', [heading]) : t('collapse_noun', [heading])}\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"]}
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 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 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 {\n items,\n heading,\n isCollapsed,\n onExpandCollapse,\n ...restProps\n }: PropsWithoutRef<IntelligentGuidanceProps>,\n ref: IntelligentGuidanceProps['ref']\n ) => {\n const t = useI18n();\n const isMediumOrAbove = useBreakpoint('md');\n const summaryListRef = useRef<HTMLElement>(null);\n const toggleButtonRef = useRef<HTMLButtonElement>(null);\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(isCollapsed ? 'expand' : 'collapse'),\n id: 'IntelligentGuidanceButton',\n icon: 'caret-down',\n 'aria-label': isCollapsed\n ? t('expand_noun', [heading])\n : t('collapse_noun', [heading]),\n onClick: onExpandCollapse,\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={isCollapsed ? t('expand_noun', [heading]) : t('collapse_noun', [heading])}\n icon\n onClick={onExpandCollapse}\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.js CHANGED Viewed

@@ -39,7 +39,7 @@ export const StyledIntelligentGuidanceList = styled(SummaryList)(({ theme }) =>
       }
     }
     ${StyledButton}:enabled:focus {
-      box-shadow: ${theme.base.shadow['focus-inverted']};
+      box-shadow: ${theme.base.shadow.focus};
     }
     ${StyledSummaryItem} {
       padding: ${theme.base.spacing};
@@ -69,7 +69,7 @@ export const StyledIntelligentGuidanceList = styled(SummaryList)(({ theme }) =>
       }
       &:enabled:focus,
       &:not([disabled]):focus {
-        box-shadow: inset ${theme.base.shadow['focus-inverted']};
+        box-shadow: ${theme.base.shadow['focus-inset']};
       }
     }
     ${StyledEmptyState} {

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

	@@ -1 +1 @@
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"]}
1	+ {"version":3,"file":"IntelligentGuidance.styles.js","sourceRoot":"","sources":["../../../src/components/IntelligentGuidance/IntelligentGuidance.styles.ts"],"names":[],"mappings":"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","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};\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: ${theme.base.shadow['focus-inset']};\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 CHANGED Viewed

@@ -25,6 +25,10 @@ export default interface IntelligentGuidanceProps extends BaseProps, NoChildrenP
     items: IntelligentGuidanceItemProps[];
     /** Header text. */
     heading: string;
+    /** Flag that indicates if intelligent guidance is collapsed */
+    isCollapsed: boolean;
+    /** Callback when expand/collapse button is clicked */
+    onExpandCollapse: () => void;
     /** Ref for the wrapping element. */
     ref?: Ref<HTMLDivElement>;
 }

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

	@@ -1 +1 @@
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"}
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,+DAA+D;IAC/D,WAAW,EAAE,OAAO,CAAC;IACrB,sDAAsD;IACtD,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B"}

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

	@@ -1 +1 @@
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"]}
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 /* Flag that indicates if intelligent guidance is collapsed /\n isCollapsed: boolean;\n /* Callback when expand/collapse button is clicked /\n onExpandCollapse: () => void;\n /* Ref for the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n"]}

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

@@ -50,8 +50,8 @@ export interface TextFilterProps extends BaseFilterProps {
      */
     placeholder?: string;
 }
-export declare type FilterProps = SelectFilterProps;
-export declare type ActiveFilters = ActiveSelectFilter;
+export type FilterProps = SelectFilterProps;
+export type ActiveFilters = ActiveSelectFilter;
 export interface SearchResultProps {
     /** The id of the search result to be displayed. */
     id: string;
@@ -73,7 +73,7 @@ interface SelectFilterEvent extends BaseFilterEvent {
     type: 'select';
     value: SelectFilterItemProps;
 }
-export declare type FilterEvent = SelectFilterEvent;
+export type FilterEvent = SelectFilterEvent;
 export interface SearchResultsProps extends NoChildrenProp {
     /** A set of results to render for a given search. */
     results: SearchResultProps[];

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchResults.types.d.ts","sourceRoot":"","sources":["../../../src/components/SearchResults/SearchResults.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,OAAO,EACL,SAAS,EACT,aAAa,EACb,cAAc,EACd,UAAU,EACV,eAAe,EACf,gBAAgB,EACjB,MAAM,yBAAyB,CAAC;AAEjC,UAAU,eAAe;IACvB,8BAA8B;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,qBAAqB;IACpC,oCAAoC;IACpC,EAAE,EAAE,WAAW,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC;IACvC,uCAAuC;IACvC,KAAK,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;IAChC,wDAAwD;IACxD,OAAO,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;IACpC,kFAAkF;IAClF,IAAI,EAAE,WAAW,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC,CAAC;CAC5C;AAED,MAAM,WAAW,iBAAkB,SAAQ,eAAe;IACxD,gEAAgE;IAChE,IAAI,EAAE,QAAQ,CAAC;IACf,yCAAyC;IACzC,KAAK,EAAE,qBAAqB,EAAE,CAAC;IAC/B;;;OAGG;IACH,UAAU,CAAC,EAAE,eAAe,GAAG,cAAc,CAAC;CAC/C;AAED,MAAM,WAAW,kBAAkB;IACjC,EAAE,EAAE,qBAAqB,CAAC,IAAI,CAAC,CAAC;IAChC,IAAI,EAAE,qBAAqB,CAAC,MAAM,CAAC,CAAC;IACpC,UAAU,EAAE,qBAAqB,GAAG;QAAE,OAAO,EAAE,KAAK,CAAA;KAAE,CAAC;IACvD,SAAS,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC;IACrC,IAAI,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC;CACjC;AAED,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,8DAA8D;IAC9D,IAAI,EAAE,MAAM,CAAC;IACb,+BAA+B;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAGD,~~oBAAY~~,WAAW,GAAG,iBAAiB,CAAC;AAE5C,~~oBAAY~~,aAAa,GAAG,kBAAkB,CAAC;AAE/C,MAAM,WAAW,iBAAiB;IAChC,mDAAmD;IACnD,EAAE,EAAE,MAAM,CAAC;IACX,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,kCAAkC;IAClC,IAAI,EAAE,UAAU,CAAC,SAAS,EAAE,UAAU,GAAG,SAAS,GAAG,MAAM,CAAC,CAAC;IAC7D,2CAA2C;IAC3C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mFAAmF;IACnF,IAAI,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IAC9B,kEAAkE;IAClE,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,UAAU,eAAe;IACvB,IAAI,EAAE,MAAM,CAAC;CACd;AACD,UAAU,iBAAkB,SAAQ,eAAe;IACjD,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,qBAAqB,CAAC;CAC9B;AAGD,~~oBAAY~~,WAAW,GAAG,iBAAiB,CAAC;AAE5C,MAAM,WAAW,kBAAmB,SAAQ,cAAc;IACxD,qDAAqD;IACrD,OAAO,EAAE,iBAAiB,EAAE,CAAC;IAC7B,wCAAwC;IACxC,gBAAgB,EAAE,gBAAgB,CAAC;IACnC,6DAA6D;IAC7D,KAAK,EAAE,MAAM,CAAC;IACd,oEAAoE;IACpE,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,iEAAiE;IACjE,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IAC/C,mEAAmE;IACnE,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC/B,+EAA+E;IAC/E,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,eAAe,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACxD,0HAA0H;IAC1H,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,uCAAuC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,sCAAsC;IACtC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B"}
1	+ {"version":3,"file":"SearchResults.types.d.ts","sourceRoot":"","sources":["../../../src/components/SearchResults/SearchResults.types.ts"],"names":[],"mappings":"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"}

package/lib/components/Stages/StageGlimpse.d.ts CHANGED Viewed

@@ -1,9 +1,7 @@
 import { FunctionComponent } from 'react';
-import { Action } from '@pega/cosmos-react-core';
 import { StageProps } from './Stages.types';
 export interface StageGlimpseProps {
     stage: StageProps;
-    actions?: Action[];
 }
 declare const StageGlimpse: FunctionComponent<StageGlimpseProps>;
 export default StageGlimpse;

package/lib/components/Stages/StageGlimpse.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StageGlimpse.d.ts","sourceRoot":"","sources":["../../../src/components/Stages/StageGlimpse.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;~~AAE1C~~,OAAO,~~EAEL,MAAM,EAOP,MAAM,yBAAyB,CAAC;AAGjC,OAAO,~~EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;~~AAU5C~~,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,UAAU,CAAC;~~IAClB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC~~;~~CACpB;~~AAED,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,~~CAoCtD~~,CAAC;AAEF,eAAe,YAAY,CAAC"}
1	+ {"version":3,"file":"StageGlimpse.d.ts","sourceRoot":"","sources":["../../../src/components/Stages/StageGlimpse.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAK1C,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAK5C,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,UAAU,CAAC;CACnB;AAED,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CA6BtD,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/components/Stages/StageGlimpse.js CHANGED Viewed

@@ -1,11 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Icon, Actions, Flex, registerIcon, Text, useI18n, StyledIcon } from '@pega/cosmos-react-core';
+import { Icon, Flex, registerIcon, Text, useI18n, StyledIcon } from '@pega/cosmos-react-core';
 import * as checkIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/check.icon';
-import { StyledDateTimeDisplay, StyledStep, StyledStepsContainer, StyledStageGlimpse } from './Stages.styles';
+import { StyledDateTimeDisplay, StyledStep, StyledStepsContainer } from './Stages.styles';
 registerIcon(checkIcon);
-const StageGlimpse = ({ stage, actions }) => {
+const StageGlimpse = ({ stage }) => {
     const t = useI18n();
-    return (_jsxs(_Fragment, { children: [_jsxs(Flex, { as: StyledStageGlimpse, container: { justify: 'between', alignItems: 'start' }, children: [_jsxs("div", { children: [_jsx(Text, { variant: 'h2', children: stage.name }), stage.date ? (_jsx(StyledDateTimeDisplay, { value: stage.date, variant: 'relative', format: 'short' })) : (_jsx(Text, { variant: 'secondary', children: t('not_started') }))] }), actions && actions.length > 0 && _jsx(Actions, { items: actions, iconOnly: true })] }), stage.steps && (_jsx(StyledStepsContainer, { children: stage.steps.map(({ id, name, completed }) => (_jsxs(Flex, { as: StyledStep, container: { gap: 0.5 }, completed: completed, children: [completed ? (_jsx(Icon, { name: 'check' })) : (_jsx(StyledIcon, { as: 'span', role: 'presentation', "aria-hidden": 'true', children: "\u2022" })), _jsx("div", { children: name })] }, id))) }))] }));
+    return (_jsxs(_Fragment, { children: [_jsx("div", { children: stage.date ? (_jsx(StyledDateTimeDisplay, { value: stage.date, variant: 'relative', format: 'short' })) : (_jsx(Text, { variant: 'secondary', children: t('not_started') })) }), stage.steps && (_jsx(StyledStepsContainer, { children: stage.steps.map(({ id, name, completed }) => (_jsxs(Flex, { as: StyledStep, container: { gap: 0.5 }, completed: completed, children: [completed ? (_jsx(Icon, { name: 'check' })) : (_jsx(StyledIcon, { as: 'span', role: 'presentation', "aria-hidden": 'true', children: "\u2022" })), _jsx("div", { children: name })] }, id))) }))] }));
 };
 export default StageGlimpse;
 //# sourceMappingURL=StageGlimpse.js.map

package/lib/components/Stages/StageGlimpse.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StageGlimpse.js","sourceRoot":"","sources":["../../../src/components/Stages/StageGlimpse.tsx"],"names":[],"mappings":";AAEA,OAAO,~~EACL~~,IAAI,~~EAEJ~~,~~OAAO,EACP,~~IAAI,~~EACJ~~,YAAY,~~EACZ~~,IAAI,~~EACJ~~,OAAO,~~EACP~~,UAAU,~~EACX~~,MAAM,yBAAyB,CAAC;~~AACjC~~,OAAO,KAAK,SAAS,MAAM,8DAA8D,CAAC;AAG1F,OAAO,~~EACL~~,qBAAqB,~~EACrB~~,UAAU,~~EACV~~,oBAAoB,~~EACpB~~,~~kBAAkB,EACnB,~~MAAM,iBAAiB,CAAC;~~AAEzB~~,YAAY,CAAC,SAAS,CAAC,CAAC;~~AAOxB~~,MAAM,YAAY,GAAyC,CAAC,~~EAC1D~~,KAAK,~~EACL~~,~~OAAO,EACW,~~EAAE,EAAE;~~IACtB~~,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,CACL,8BACE,~~MAAC~~,~~IAAI,IAAC,EAAE,EAAE,kBAAkB,EAAE,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,aAClF,0BACE,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,~~KAAK,CAAC,IAAI,~~GAAQ,EACrC,KAAK,~~CAAC,~~IAAI,~~CAAC,CAAC,~~CAAC,~~CACZ,KAAC,qBAAqB,IAAC,KAAK,EAAE,KAAK,CAAC,IAAI,EAAE,OAAO,EAAC,UAAU,EAAC,MAAM,EAAC,OAAO,GAAG,CAC/E,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IAAC,OAAO,EAAC,WAAW,YAAE,CAAC,CAAC,aAAa,CAAC,GAAQ,CACpD,~~IACG~~,EACL,~~OAAO,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,KAAC,OAAO,IAAC,~~KAAK,~~EAAE,OAAO,EAAE,QAAQ,SAAG,IACjE,EACN,KAAK,~~CAAC,KAAK,IAAI,CACd,KAAC,oBAAoB,cAClB,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,CAC5C,MAAC,IAAI,IAAC,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,EAAW,SAAS,EAAE,SAAS,aACzE,SAAS,CAAC,CAAC,CAAC,CACX,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,CACtB,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,IAAC,EAAE,EAAC,MAAM,EAAC,IAAI,EAAC,cAAc,iBAAa,MAAM,uBAE/C,CACd,EACD,wBAAM,IAAI,GAAO,KARiC,EAAE,CAS/C,CACR,CAAC,GACmB,CACxB,IACA,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { FunctionComponent } from 'react';\n\nimport {\n Icon~~,\n Action,\n Actions,\n~~ Flex~~,\n~~ registerIcon~~,\n~~ Text~~,\n~~ useI18n~~,\n~~ StyledIcon\n} from '@pega/cosmos-react-core';\nimport * as checkIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/check.icon';\n\nimport { StageProps } from './Stages.types';\nimport {\n StyledDateTimeDisplay~~,\n~~ StyledStep~~,\n~~ StyledStepsContainer~~,\n StyledStageGlimpse\n~~} from './Stages.styles';\n\nregisterIcon(checkIcon);\n\nexport interface StageGlimpseProps {\n stage: StageProps;\n ~~actions?: Action[];\n~~}\n\nconst StageGlimpse: FunctionComponent<StageGlimpseProps> = ({\n stage~~,\n actions\n~~}: StageGlimpseProps) => {\n const t = useI18n();\n return (\n <>\n <~~Flex as={StyledStageGlimpse} container={{ justify: 'between', alignItems: 'start' }}~~>\n ~~<div>\n <Text variant='h2'>~~{stage.~~name}</Text>\n {stage.~~date ? (\n <StyledDateTimeDisplay value={stage.date} variant='relative' format='short' />\n ) : (\n <Text variant='secondary'>{t('not_started')}</Text>\n )}\n </div>\n ~~{actions && actions.length > 0 && <Actions items={actions} iconOnly />}\n~~ ~~</Flex>\n~~ {stage.steps && (\n <StyledStepsContainer>\n {stage.steps.map(({ id, name, completed }) => (\n <Flex as={StyledStep} container={{ gap: 0.5 }} key={id} completed={completed}>\n {completed ? (\n <Icon name='check' />\n ) : (\n <StyledIcon as='span' role='presentation' aria-hidden='true'>\n •\n </StyledIcon>\n )}\n <div>{name}</div>\n </Flex>\n ))}\n </StyledStepsContainer>\n )}\n </>\n );\n};\n\nexport default StageGlimpse;\n"]}
1	+ {"version":3,"file":"StageGlimpse.js","sourceRoot":"","sources":["../../../src/components/Stages/StageGlimpse.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAC9F,OAAO,KAAK,SAAS,MAAM,8DAA8D,CAAC;AAG1F,OAAO,EAAE,qBAAqB,EAAE,UAAU,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAE1F,YAAY,CAAC,SAAS,CAAC,CAAC;AAMxB,MAAM,YAAY,GAAyC,CAAC,EAAE,KAAK,EAAqB,EAAE,EAAE;IAC1F,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,CACL,8BACE,wBACG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CACZ,KAAC,qBAAqB,IAAC,KAAK,EAAE,KAAK,CAAC,IAAI,EAAE,OAAO,EAAC,UAAU,EAAC,MAAM,EAAC,OAAO,GAAG,CAC/E,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IAAC,OAAO,EAAC,WAAW,YAAE,CAAC,CAAC,aAAa,CAAC,GAAQ,CACpD,GACG,EACL,KAAK,CAAC,KAAK,IAAI,CACd,KAAC,oBAAoB,cAClB,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,CAC5C,MAAC,IAAI,IAAC,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,EAAW,SAAS,EAAE,SAAS,aACzE,SAAS,CAAC,CAAC,CAAC,CACX,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,CACtB,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,IAAC,EAAE,EAAC,MAAM,EAAC,IAAI,EAAC,cAAc,iBAAa,MAAM,uBAE/C,CACd,EACD,wBAAM,IAAI,GAAO,KARiC,EAAE,CAS/C,CACR,CAAC,GACmB,CACxB,IACA,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { FunctionComponent } from 'react';\n\nimport { Icon, Flex, registerIcon, Text, useI18n, StyledIcon } from '@pega/cosmos-react-core';\nimport * as checkIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/check.icon';\n\nimport { StageProps } from './Stages.types';\nimport { StyledDateTimeDisplay, StyledStep, StyledStepsContainer } from './Stages.styles';\n\nregisterIcon(checkIcon);\n\nexport interface StageGlimpseProps {\n stage: StageProps;\n}\n\nconst StageGlimpse: FunctionComponent<StageGlimpseProps> = ({ stage }: StageGlimpseProps) => {\n const t = useI18n();\n return (\n <>\n <div>\n {stage.date ? (\n <StyledDateTimeDisplay value={stage.date} variant='relative' format='short' />\n ) : (\n <Text variant='secondary'>{t('not_started')}</Text>\n )}\n </div>\n {stage.steps && (\n <StyledStepsContainer>\n {stage.steps.map(({ id, name, completed }) => (\n <Flex as={StyledStep} container={{ gap: 0.5 }} key={id} completed={completed}>\n {completed ? (\n <Icon name='check' />\n ) : (\n <StyledIcon as='span' role='presentation' aria-hidden='true'>\n •\n </StyledIcon>\n )}\n <div>{name}</div>\n </Flex>\n ))}\n </StyledStepsContainer>\n )}\n </>\n );\n};\n\nexport default StageGlimpse;\n"]}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Stages.d.ts","sourceRoot":"","sources":["../../../src/components/Stages/Stages.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAQlB,MAAM,OAAO,CAAC;AAGf,OAAO,EAIL,YAAY,~~EAiBb~~,MAAM,yBAAyB,CAAC;~~AAIjC~~,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;~~AAYlD~~,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,~~CAiMzD~~,CAAC;AAEF,eAAe,MAAM,CAAC"}
1	+ {"version":3,"file":"Stages.d.ts","sourceRoot":"","sources":["../../../src/components/Stages/Stages.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAQlB,MAAM,OAAO,CAAC;AAGf,OAAO,EAIL,YAAY,EAab,MAAM,yBAAyB,CAAC;AAGjC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAMlD,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAgKzD,CAAC;AAEF,eAAe,MAAM,CAAC"}