@pega/cosmos-react-work 5.0.0-dev.4.8 → 5.0.0-dev.5.0

package/lib/components/CaseView/CaseHeader/Summary.js

@@ -0,0 +1,182 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+import { Flex, getEdge, registerIcon, StyledStackedFieldValue, StyledLabel, StyledFieldName, useDirection, useChToPxConversionFactor, NoValue } from '@pega/cosmos-react-core';
+import * as pencilIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/pencil.icon';
+import * as moreIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/more.icon';
+import { StyledHeaderSummary, StyledHeaderSummaryValue, StyledHeaderSummaryBlock } from '../CaseView.styles';
+import { useCaseViewContext } from '../CaseView.context';
+registerIcon(pencilIcon, moreIcon);
+const Field = ({ item, primary, truncate }) => {
+    const { name, value, simpleValue } = item;
+    const displayValue = simpleValue ?? value ?? _jsx(NoValue, {});
+    return (_jsxs(StyledStackedFieldValue, { children: [_jsx(StyledLabel, { as: StyledFieldName, children: name }), _jsx(StyledHeaderSummaryValue, { bold: primary, truncate: truncate, children: displayValue })] }));
+};
+const Summary = ({ siblingRef }) => {
+    const { ltr } = useDirection();
+    const { summaryFields } = useCaseViewContext();
+    const chToPxConversionFactor = useChToPxConversionFactor();
+    const containerRef = useRef(null);
+    const listRef = useRef(null);
+    const primaryItems = summaryFields?.primary ?? [];
+    const secondaryItems = summaryFields?.secondary ?? [];
+    const items = [...primaryItems, ...secondaryItems];
+    const [displayCount, setDisplayCount] = useState(items.length);
+    const [truncatedIndices, setTruncatedIndices] = useState(items.map((_, i) => i));
+    const priorTrailingEdgeStack = useRef([]);
+    const priorAvailableSpace = useRef(null);
+    const evalItemAddition = ({ nextSiblingLeadingEdge }) => {
+        const indicesToTruncate = truncatedIndices ? [...truncatedIndices] : [];
+        let nextDisplayCount = displayCount;
+        const reversedTrailingEdgeStack = [...priorTrailingEdgeStack.current].reverse();
+        for (let i = 0; i < reversedTrailingEdgeStack.length; i += 1) {
+            const priorEdge = reversedTrailingEdgeStack[i];
+            const shouldRender = ltr
+                ? priorEdge < nextSiblingLeadingEdge
+                : priorEdge > nextSiblingLeadingEdge;
+            if (shouldRender) {
+                priorTrailingEdgeStack.current.pop();
+                if (!indicesToTruncate.includes(nextDisplayCount)) {
+                    indicesToTruncate.push(nextDisplayCount);
+                }
+                nextDisplayCount += 1;
+            }
+            else {
+                break;
+            }
+        }
+        return { indicesToTruncate, nextDisplayCount };
+    };
+    const evalTruncationReduction = ({ listChildren, availableSpace }) => {
+        const indicesToTruncate = [];
+        let hasAvailableSpace = availableSpace;
+        listChildren.forEach((item, index) => {
+            const valueEl = item.lastChild;
+            const truncatedSpace = Math.floor(valueEl.scrollWidth - valueEl.offsetWidth);
+            const shouldTruncate = truncatedSpace === 0 ? false : hasAvailableSpace - truncatedSpace <= 0;
+            if (shouldTruncate) {
+                if (!truncatedIndices?.includes(index)) {
+                    hasAvailableSpace += truncatedSpace;
+                }
+                indicesToTruncate.push(index);
+            }
+            else if (truncatedIndices?.includes(index)) {
+                hasAvailableSpace -= truncatedSpace;
+            }
+        });
+        return { indicesToTruncate };
+    };
+    const evalTruncationIncrease = ({ listChildren, availableSpace }) => {
+        const indicesToTruncate = [];
+        const lastIndex = listChildren.length - 1;
+        let hasAvailableSpace = availableSpace;
+        [...listChildren].reverse().forEach((item, index) => {
+            if (truncatedIndices?.includes(lastIndex - index)) {
+                indicesToTruncate.push(lastIndex - index);
+            }
+            else if (hasAvailableSpace < 0) {
+                const truncatedElMaxWidth = 20 * chToPxConversionFactor;
+                const valueEl = item.lastChild;
+                const spaceToTruncate = Math.max(Math.floor(valueEl.offsetWidth - truncatedElMaxWidth), 0);
+                if (spaceToTruncate) {
+                    indicesToTruncate.push(lastIndex - index);
+                    hasAvailableSpace += spaceToTruncate;
+                }
+            }
+        });
+        return { indicesToTruncate, availableSpace: hasAvailableSpace };
+    };
+    const evalItemRemoval = ({ listChildren, availableSpace, nextSiblingLeadingEdge }) => {
+        let nextDisplayCount = displayCount;
+        let hasAvailableSpace = availableSpace;
+        let lastChildIndex = listChildren.length - 1;
+        do {
+            const itemTrailingEdge = getEdge({
+                el: listChildren[lastChildIndex],
+                side: 'trailing',
+                ltr
+            });
+            hasAvailableSpace = Math.floor(ltr ? nextSiblingLeadingEdge - itemTrailingEdge : itemTrailingEdge - nextSiblingLeadingEdge);
+            if (hasAvailableSpace < 0) {
+                priorTrailingEdgeStack.current = [...priorTrailingEdgeStack.current, itemTrailingEdge];
+                nextDisplayCount -= 1;
+                lastChildIndex -= 1;
+            }
+        } while (hasAvailableSpace < 0 && lastChildIndex > -1);
+        return { displayCount: nextDisplayCount };
+    };
+    const evaluateSummaryDisplay = () => {
+        const containerEl = containerRef.current;
+        if (!containerEl)
+            return;
+        const listChildren = Array.from(listRef.current?.children ?? []);
+        const lastSummaryItem = listChildren.length ? listChildren[listChildren.length - 1] : undefined;
+        const nextSibling = siblingRef?.current ?? document.body;
+        const nextSiblingLeadingEdge = getEdge({
+            el: nextSibling,
+            side: 'leading',
+            ltr
+        });
+        const testEdge = lastSummaryItem
+            ? getEdge({ el: lastSummaryItem, side: 'trailing', ltr })
+            : getEdge({ el: containerEl, side: 'leading', ltr });
+        let availableSpace = Math.floor(ltr ? nextSiblingLeadingEdge - testEdge : testEdge - nextSiblingLeadingEdge);
+        if (availableSpace === priorAvailableSpace.current)
+            return;
+        priorAvailableSpace.current = availableSpace;
+        let indicesToTruncate;
+        let nextDisplayCount = displayCount;
+        if (availableSpace >= 0) {
+            if (displayCount !== items.length) {
+                const additionsConfig = evalItemAddition({ nextSiblingLeadingEdge });
+                indicesToTruncate = additionsConfig.indicesToTruncate;
+                nextDisplayCount = additionsConfig.nextDisplayCount;
+            }
+            else if (truncatedIndices?.length) {
+                const truncationConfig = evalTruncationReduction({
+                    listChildren,
+                    availableSpace
+                });
+                indicesToTruncate = truncationConfig.indicesToTruncate;
+            }
+        }
+        else if (listChildren) {
+            const truncationConfig = evalTruncationIncrease({
+                listChildren,
+                availableSpace
+            });
+            indicesToTruncate = truncationConfig.indicesToTruncate;
+            availableSpace = truncationConfig.availableSpace;
+            if (availableSpace < 0) {
+                const removalConfig = evalItemRemoval({
+                    listChildren,
+                    availableSpace,
+                    nextSiblingLeadingEdge
+                });
+                nextDisplayCount = removalConfig.displayCount;
+            }
+        }
+        setDisplayCount(nextDisplayCount);
+        if (indicesToTruncate) {
+            setTruncatedIndices(indicesToTruncate);
+        }
+    };
+    // Initial display evaluation
+    useEffect(() => {
+        evaluateSummaryDisplay();
+    }, []);
+    // Overflow resize observer
+    useEffect(() => {
+        const resizeObserver = new ResizeObserver(evaluateSummaryDisplay);
+        if (containerRef.current) {
+            resizeObserver.observe(containerRef.current, { box: 'border-box' });
+        }
+        return () => {
+            resizeObserver.disconnect();
+        };
+    }, [evaluateSummaryDisplay]);
+    return (_jsx(Flex, { as: StyledHeaderSummaryBlock, item: { grow: 1, shrink: 1 }, container: { pad: [0.5, 0], alignItems: 'center' }, ref: containerRef, hasItems: displayCount > 0, children: _jsx(Flex, { as: StyledHeaderSummary, container: { gap: 4 }, ref: listRef, children: items.slice(0, displayCount).map((item, index) => {
+                return (_jsx(Field, { item: item, primary: !!primaryItems?.length && index < primaryItems.length, truncate: !!truncatedIndices?.includes(index) }, item.name));
+            }) }) }));
+};
+export default Summary;
+//# sourceMappingURL=Summary.js.map

package/lib/components/CaseView/CaseHeader/Summary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Summary.js","sourceRoot":"","sources":["../../../../src/components/CaseView/CaseHeader/Summary.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAa,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,EACL,IAAI,EACJ,OAAO,EACP,YAAY,EACZ,uBAAuB,EACvB,WAAW,EACX,eAAe,EACf,YAAY,EACZ,yBAAyB,EACzB,OAAO,EACR,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,UAAU,MAAM,+DAA+D,CAAC;AAC5F,OAAO,KAAK,QAAQ,MAAM,6DAA6D,CAAC;AAExF,OAAO,EACL,mBAAmB,EACnB,wBAAwB,EACxB,wBAAwB,EACzB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAGzD,YAAY,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;AAEnC,MAAM,KAAK,GAAG,CAAC,EACb,IAAI,EACJ,OAAO,EACP,QAAQ,EAKT,EAAE,EAAE;IACH,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC;IAC1C,MAAM,YAAY,GAAG,WAAW,IAAI,KAAK,IAAI,KAAC,OAAO,KAAG,CAAC;IAEzD,OAAO,CACL,MAAC,uBAAuB,eACtB,KAAC,WAAW,IAAC,EAAE,EAAE,eAAe,YAAG,IAAI,GAAe,EACtD,KAAC,wBAAwB,IAAC,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,QAAQ,YACxD,YAAY,GACY,IACH,CAC3B,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,OAAO,GAAG,CAAC,EAAE,UAAU,EAA6C,EAAE,EAAE;IAC5E,MAAM,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IAC/B,MAAM,EAAE,aAAa,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAC/C,MAAM,sBAAsB,GAAG,yBAAyB,EAAE,CAAC;IAE3D,MAAM,YAAY,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAClD,MAAM,OAAO,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAE/C,MAAM,YAAY,GAAG,aAAa,EAAE,OAAO,IAAI,EAAE,CAAC;IAClD,MAAM,cAAc,GAAG,aAAa,EAAE,SAAS,IAAI,EAAE,CAAC;IACtD,MAAM,KAAK,GAAG,CAAC,GAAG,YAAY,EAAE,GAAG,cAAc,CAAC,CAAC;IAEnD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IAC/D,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CACtD,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CACvB,CAAC;IAEF,MAAM,sBAAsB,GAAG,MAAM,CAAW,EAAE,CAAC,CAAC;IACpD,MAAM,mBAAmB,GAAG,MAAM,CAAgB,IAAI,CAAC,CAAC;IAExD,MAAM,gBAAgB,GAAG,CAAC,EACxB,sBAAsB,EAGvB,EAGC,EAAE;QACF,MAAM,iBAAiB,GAAa,gBAAgB,CAAC,CAAC,CAAC,CAAC,GAAG,gBAAgB,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;QAClF,IAAI,gBAAgB,GAAG,YAAY,CAAC;QAEpC,MAAM,yBAAyB,GAAG,CAAC,GAAG,sBAAsB,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,CAAC;QAChF,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,yBAAyB,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,EAAE;YAC5D,MAAM,SAAS,GAAG,yBAAyB,CAAC,CAAC,CAAC,CAAC;YAE/C,MAAM,YAAY,GAAG,GAAG;gBACtB,CAAC,CAAC,SAAS,GAAG,sBAAsB;gBACpC,CAAC,CAAC,SAAS,GAAG,sBAAsB,CAAC;YAEvC,IAAI,YAAY,EAAE;gBAChB,sBAAsB,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC;gBAErC,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,gBAAgB,CAAC,EAAE;oBACjD,iBAAiB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;iBAC1C;gBAED,gBAAgB,IAAI,CAAC,CAAC;aACvB;iBAAM;gBACL,MAAM;aACP;SACF;QAED,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,CAAC;IACjD,CAAC,CAAC;IAEF,MAAM,uBAAuB,GAAG,CAAC,EAC/B,YAAY,EACZ,cAAc,EAIf,EAEC,EAAE;QACF,MAAM,iBAAiB,GAAa,EAAE,CAAC;QACvC,IAAI,iBAAiB,GAAG,cAAc,CAAC;QAEvC,YAAY,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YACnC,MAAM,OAAO,GAAG,IAAI,CAAC,SAAwB,CAAC;YAC9C,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC;YAC7E,MAAM,cAAc,GAAG,cAAc,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,iBAAiB,GAAG,cAAc,IAAI,CAAC,CAAC;YAE9F,IAAI,cAAc,EAAE;gBAClB,IAAI,CAAC,gBAAgB,EAAE,QAAQ,CAAC,KAAK,CAAC,EAAE;oBACtC,iBAAiB,IAAI,cAAc,CAAC;iBACrC;gBAED,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;aAC/B;iBAAM,IAAI,gBAAgB,EAAE,QAAQ,CAAC,KAAK,CAAC,EAAE;gBAC5C,iBAAiB,IAAI,cAAc,CAAC;aACrC;QACH,CAAC,CAAC,CAAC;QAEH,OAAO,EAAE,iBAAiB,EAAE,CAAC;IAC/B,CAAC,CAAC;IAEF,MAAM,sBAAsB,GAAG,CAAC,EAC9B,YAAY,EACZ,cAAc,EAIf,EAGC,EAAE;QACF,MAAM,iBAAiB,GAAa,EAAE,CAAC;QACvC,MAAM,SAAS,GAAG,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC;QAC1C,IAAI,iBAAiB,GAAG,cAAc,CAAC;QAEvC,CAAC,GAAG,YAAY,CAAC,CAAC,OAAO,EAAE,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YAClD,IAAI,gBAAgB,EAAE,QAAQ,CAAC,SAAS,GAAG,KAAK,CAAC,EAAE;gBACjD,iBAAiB,CAAC,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,CAAC;aAC3C;iBAAM,IAAI,iBAAiB,GAAG,CAAC,EAAE;gBAChC,MAAM,mBAAmB,GAAG,EAAE,GAAG,sBAAsB,CAAC;gBACxD,MAAM,OAAO,GAAG,IAAI,CAAC,SAAwB,CAAC;gBAC9C,MAAM,eAAe,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,WAAW,GAAG,mBAAmB,CAAC,EAAE,CAAC,CAAC,CAAC;gBAE3F,IAAI,eAAe,EAAE;oBACnB,iBAAiB,CAAC,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,CAAC;oBAC1C,iBAAiB,IAAI,eAAe,CAAC;iBACtC;aACF;QACH,CAAC,CAAC,CAAC;QAEH,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,iBAAiB,EAAE,CAAC;IAClE,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,EACvB,YAAY,EACZ,cAAc,EACd,sBAAsB,EAKvB,EAA4B,EAAE;QAC7B,IAAI,gBAAgB,GAAG,YAAY,CAAC;QACpC,IAAI,iBAAiB,GAAG,cAAc,CAAC;QACvC,IAAI,cAAc,GAAG,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC;QAE7C,GAAG;YACD,MAAM,gBAAgB,GAAG,OAAO,CAAC;gBAC/B,EAAE,EAAE,YAAY,CAAC,cAAc,CAAC;gBAChC,IAAI,EAAE,UAAU;gBAChB,GAAG;aACJ,CAAC,CAAC;YACH,iBAAiB,GAAG,IAAI,CAAC,KAAK,CAC5B,GAAG,CAAC,CAAC,CAAC,sBAAsB,GAAG,gBAAgB,CAAC,CAAC,CAAC,gBAAgB,GAAG,sBAAsB,CAC5F,CAAC;YAEF,IAAI,iBAAiB,GAAG,CAAC,EAAE;gBACzB,sBAAsB,CAAC,OAAO,GAAG,CAAC,GAAG,sBAAsB,CAAC,OAAO,EAAE,gBAAgB,CAAC,CAAC;gBAEvF,gBAAgB,IAAI,CAAC,CAAC;gBACtB,cAAc,IAAI,CAAC,CAAC;aACrB;SACF,QAAQ,iBAAiB,GAAG,CAAC,IAAI,cAAc,GAAG,CAAC,CAAC,EAAE;QAEvD,OAAO,EAAE,YAAY,EAAE,gBAAgB,EAAE,CAAC;IAC5C,CAAC,CAAC;IAEF,MAAM,sBAAsB,GAAG,GAAG,EAAE;QAClC,MAAM,WAAW,GAAG,YAAY,CAAC,OAAO,CAAC;QACzC,IAAI,CAAC,WAAW;YAAE,OAAO;QAEzB,MAAM,YAAY,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,EAAE,QAAQ,IAAI,EAAE,CAAC,CAAC;QACjE,MAAM,eAAe,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,YAAY,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;QAChG,MAAM,WAAW,GAAG,UAAU,EAAE,OAAO,IAAI,QAAQ,CAAC,IAAI,CAAC;QACzD,MAAM,sBAAsB,GAAG,OAAO,CAAC;YACrC,EAAE,EAAE,WAAW;YACf,IAAI,EAAE,SAAS;YACf,GAAG;SACJ,CAAC,CAAC;QACH,MAAM,QAAQ,GAAG,eAAe;YAC9B,CAAC,CAAC,OAAO,CAAC,EAAE,EAAE,EAAE,eAAe,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,EAAE,CAAC;YACzD,CAAC,CAAC,OAAO,CAAC,EAAE,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,CAAC;QACvD,IAAI,cAAc,GAAG,IAAI,CAAC,KAAK,CAC7B,GAAG,CAAC,CAAC,CAAC,sBAAsB,GAAG,QAAQ,CAAC,CAAC,CAAC,QAAQ,GAAG,sBAAsB,CAC5E,CAAC;QACF,IAAI,cAAc,KAAK,mBAAmB,CAAC,OAAO;YAAE,OAAO;QAE3D,mBAAmB,CAAC,OAAO,GAAG,cAAc,CAAC;QAE7C,IAAI,iBAAuC,CAAC;QAC5C,IAAI,gBAAgB,GAAG,YAAY,CAAC;QAEpC,IAAI,cAAc,IAAI,CAAC,EAAE;YACvB,IAAI,YAAY,KAAK,KAAK,CAAC,MAAM,EAAE;gBACjC,MAAM,eAAe,GAAG,gBAAgB,CAAC,EAAE,sBAAsB,EAAE,CAAC,CAAC;gBAErE,iBAAiB,GAAG,eAAe,CAAC,iBAAiB,CAAC;gBACtD,gBAAgB,GAAG,eAAe,CAAC,gBAAgB,CAAC;aACrD;iBAAM,IAAI,gBAAgB,EAAE,MAAM,EAAE;gBACnC,MAAM,gBAAgB,GAAG,uBAAuB,CAAC;oBAC/C,YAAY;oBACZ,cAAc;iBACf,CAAC,CAAC;gBAEH,iBAAiB,GAAG,gBAAgB,CAAC,iBAAiB,CAAC;aACxD;SACF;aAAM,IAAI,YAAY,EAAE;YACvB,MAAM,gBAAgB,GAAG,sBAAsB,CAAC;gBAC9C,YAAY;gBACZ,cAAc;aACf,CAAC,CAAC;YAEH,iBAAiB,GAAG,gBAAgB,CAAC,iBAAiB,CAAC;YACvD,cAAc,GAAG,gBAAgB,CAAC,cAAc,CAAC;YAEjD,IAAI,cAAc,GAAG,CAAC,EAAE;gBACtB,MAAM,aAAa,GAAG,eAAe,CAAC;oBACpC,YAAY;oBACZ,cAAc;oBACd,sBAAsB;iBACvB,CAAC,CAAC;gBAEH,gBAAgB,GAAG,aAAa,CAAC,YAAY,CAAC;aAC/C;SACF;QAED,eAAe,CAAC,gBAAgB,CAAC,CAAC;QAElC,IAAI,iBAAiB,EAAE;YACrB,mBAAmB,CAAC,iBAAiB,CAAC,CAAC;SACxC;IACH,CAAC,CAAC;IAEF,6BAA6B;IAC7B,SAAS,CAAC,GAAG,EAAE;QACb,sBAAsB,EAAE,CAAC;IAC3B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,2BAA2B;IAC3B,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,cAAc,GAAG,IAAI,cAAc,CAAC,sBAAsB,CAAC,CAAC;QAElE,IAAI,YAAY,CAAC,OAAO,EAAE;YACxB,cAAc,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,EAAE,EAAE,GAAG,EAAE,YAAY,EAAE,CAAC,CAAC;SACrE;QAED,OAAO,GAAG,EAAE;YACV,cAAc,CAAC,UAAU,EAAE,CAAC;QAC9B,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,sBAAsB,CAAC,CAAC,CAAC;IAE7B,OAAO,CACL,KAAC,IAAI,IACH,EAAE,EAAE,wBAAwB,EAC5B,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,EAC5B,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,EAClD,GAAG,EAAE,YAAY,EACjB,QAAQ,EAAE,YAAY,GAAG,CAAC,YAE1B,KAAC,IAAI,IAAC,EAAE,EAAE,mBAAmB,EAAE,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,OAAO,YAC/D,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,YAAY,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;gBAChD,OAAO,CACL,KAAC,KAAK,IACJ,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,CAAC,CAAC,YAAY,EAAE,MAAM,IAAI,KAAK,GAAG,YAAY,CAAC,MAAM,EAC9D,QAAQ,EAAE,CAAC,CAAC,gBAAgB,EAAE,QAAQ,CAAC,KAAK,CAAC,IACxC,IAAI,CAAC,IAAI,CACd,CACH,CAAC;YACJ,CAAC,CAAC,GACG,GACF,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["import { RefObject, useEffect, useRef, useState } from 'react';\n\nimport {\n  Flex,\n  getEdge,\n  registerIcon,\n  StyledStackedFieldValue,\n  StyledLabel,\n  StyledFieldName,\n  useDirection,\n  useChToPxConversionFactor,\n  NoValue\n} from '@pega/cosmos-react-core';\nimport * as pencilIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/pencil.icon';\nimport * as moreIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/more.icon';\n\nimport {\n  StyledHeaderSummary,\n  StyledHeaderSummaryValue,\n  StyledHeaderSummaryBlock\n} from '../CaseView.styles';\nimport { useCaseViewContext } from '../CaseView.context';\nimport { SummaryField } from '../CaseView.types';\n\nregisterIcon(pencilIcon, moreIcon);\n\nconst Field = ({\n  item,\n  primary,\n  truncate\n}: {\n  item: SummaryField;\n  primary: boolean;\n  truncate: boolean;\n}) => {\n  const { name, value, simpleValue } = item;\n  const displayValue = simpleValue ?? value ?? <NoValue />;\n\n  return (\n    <StyledStackedFieldValue>\n      <StyledLabel as={StyledFieldName}>{name}</StyledLabel>\n      <StyledHeaderSummaryValue bold={primary} truncate={truncate}>\n        {displayValue}\n      </StyledHeaderSummaryValue>\n    </StyledStackedFieldValue>\n  );\n};\n\nconst Summary = ({ siblingRef }: { siblingRef: RefObject<HTMLDivElement> }) => {\n  const { ltr } = useDirection();\n  const { summaryFields } = useCaseViewContext();\n  const chToPxConversionFactor = useChToPxConversionFactor();\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const listRef = useRef<HTMLDListElement>(null);\n\n  const primaryItems = summaryFields?.primary ?? [];\n  const secondaryItems = summaryFields?.secondary ?? [];\n  const items = [...primaryItems, ...secondaryItems];\n\n  const [displayCount, setDisplayCount] = useState(items.length);\n  const [truncatedIndices, setTruncatedIndices] = useState<number[] | undefined>(\n    items.map((_, i) => i)\n  );\n\n  const priorTrailingEdgeStack = useRef<number[]>([]);\n  const priorAvailableSpace = useRef<number | null>(null);\n\n  const evalItemAddition = ({\n    nextSiblingLeadingEdge\n  }: {\n    nextSiblingLeadingEdge: number;\n  }): {\n    indicesToTruncate: number[];\n    nextDisplayCount: number;\n  } => {\n    const indicesToTruncate: number[] = truncatedIndices ? [...truncatedIndices] : [];\n    let nextDisplayCount = displayCount;\n\n    const reversedTrailingEdgeStack = [...priorTrailingEdgeStack.current].reverse();\n    for (let i = 0; i < reversedTrailingEdgeStack.length; i += 1) {\n      const priorEdge = reversedTrailingEdgeStack[i];\n\n      const shouldRender = ltr\n        ? priorEdge < nextSiblingLeadingEdge\n        : priorEdge > nextSiblingLeadingEdge;\n\n      if (shouldRender) {\n        priorTrailingEdgeStack.current.pop();\n\n        if (!indicesToTruncate.includes(nextDisplayCount)) {\n          indicesToTruncate.push(nextDisplayCount);\n        }\n\n        nextDisplayCount += 1;\n      } else {\n        break;\n      }\n    }\n\n    return { indicesToTruncate, nextDisplayCount };\n  };\n\n  const evalTruncationReduction = ({\n    listChildren,\n    availableSpace\n  }: {\n    listChildren: Element[];\n    availableSpace: number;\n  }): {\n    indicesToTruncate: number[];\n  } => {\n    const indicesToTruncate: number[] = [];\n    let hasAvailableSpace = availableSpace;\n\n    listChildren.forEach((item, index) => {\n      const valueEl = item.lastChild as HTMLElement;\n      const truncatedSpace = Math.floor(valueEl.scrollWidth - valueEl.offsetWidth);\n      const shouldTruncate = truncatedSpace === 0 ? false : hasAvailableSpace - truncatedSpace <= 0;\n\n      if (shouldTruncate) {\n        if (!truncatedIndices?.includes(index)) {\n          hasAvailableSpace += truncatedSpace;\n        }\n\n        indicesToTruncate.push(index);\n      } else if (truncatedIndices?.includes(index)) {\n        hasAvailableSpace -= truncatedSpace;\n      }\n    });\n\n    return { indicesToTruncate };\n  };\n\n  const evalTruncationIncrease = ({\n    listChildren,\n    availableSpace\n  }: {\n    listChildren: Element[];\n    availableSpace: number;\n  }): {\n    indicesToTruncate: number[];\n    availableSpace: number;\n  } => {\n    const indicesToTruncate: number[] = [];\n    const lastIndex = listChildren.length - 1;\n    let hasAvailableSpace = availableSpace;\n\n    [...listChildren].reverse().forEach((item, index) => {\n      if (truncatedIndices?.includes(lastIndex - index)) {\n        indicesToTruncate.push(lastIndex - index);\n      } else if (hasAvailableSpace < 0) {\n        const truncatedElMaxWidth = 20 * chToPxConversionFactor;\n        const valueEl = item.lastChild as HTMLElement;\n        const spaceToTruncate = Math.max(Math.floor(valueEl.offsetWidth - truncatedElMaxWidth), 0);\n\n        if (spaceToTruncate) {\n          indicesToTruncate.push(lastIndex - index);\n          hasAvailableSpace += spaceToTruncate;\n        }\n      }\n    });\n\n    return { indicesToTruncate, availableSpace: hasAvailableSpace };\n  };\n\n  const evalItemRemoval = ({\n    listChildren,\n    availableSpace,\n    nextSiblingLeadingEdge\n  }: {\n    listChildren: Element[];\n    availableSpace: number;\n    nextSiblingLeadingEdge: number;\n  }): { displayCount: number } => {\n    let nextDisplayCount = displayCount;\n    let hasAvailableSpace = availableSpace;\n    let lastChildIndex = listChildren.length - 1;\n\n    do {\n      const itemTrailingEdge = getEdge({\n        el: listChildren[lastChildIndex],\n        side: 'trailing',\n        ltr\n      });\n      hasAvailableSpace = Math.floor(\n        ltr ? nextSiblingLeadingEdge - itemTrailingEdge : itemTrailingEdge - nextSiblingLeadingEdge\n      );\n\n      if (hasAvailableSpace < 0) {\n        priorTrailingEdgeStack.current = [...priorTrailingEdgeStack.current, itemTrailingEdge];\n\n        nextDisplayCount -= 1;\n        lastChildIndex -= 1;\n      }\n    } while (hasAvailableSpace < 0 && lastChildIndex > -1);\n\n    return { displayCount: nextDisplayCount };\n  };\n\n  const evaluateSummaryDisplay = () => {\n    const containerEl = containerRef.current;\n    if (!containerEl) return;\n\n    const listChildren = Array.from(listRef.current?.children ?? []);\n    const lastSummaryItem = listChildren.length ? listChildren[listChildren.length - 1] : undefined;\n    const nextSibling = siblingRef?.current ?? document.body;\n    const nextSiblingLeadingEdge = getEdge({\n      el: nextSibling,\n      side: 'leading',\n      ltr\n    });\n    const testEdge = lastSummaryItem\n      ? getEdge({ el: lastSummaryItem, side: 'trailing', ltr })\n      : getEdge({ el: containerEl, side: 'leading', ltr });\n    let availableSpace = Math.floor(\n      ltr ? nextSiblingLeadingEdge - testEdge : testEdge - nextSiblingLeadingEdge\n    );\n    if (availableSpace === priorAvailableSpace.current) return;\n\n    priorAvailableSpace.current = availableSpace;\n\n    let indicesToTruncate: number[] | undefined;\n    let nextDisplayCount = displayCount;\n\n    if (availableSpace >= 0) {\n      if (displayCount !== items.length) {\n        const additionsConfig = evalItemAddition({ nextSiblingLeadingEdge });\n\n        indicesToTruncate = additionsConfig.indicesToTruncate;\n        nextDisplayCount = additionsConfig.nextDisplayCount;\n      } else if (truncatedIndices?.length) {\n        const truncationConfig = evalTruncationReduction({\n          listChildren,\n          availableSpace\n        });\n\n        indicesToTruncate = truncationConfig.indicesToTruncate;\n      }\n    } else if (listChildren) {\n      const truncationConfig = evalTruncationIncrease({\n        listChildren,\n        availableSpace\n      });\n\n      indicesToTruncate = truncationConfig.indicesToTruncate;\n      availableSpace = truncationConfig.availableSpace;\n\n      if (availableSpace < 0) {\n        const removalConfig = evalItemRemoval({\n          listChildren,\n          availableSpace,\n          nextSiblingLeadingEdge\n        });\n\n        nextDisplayCount = removalConfig.displayCount;\n      }\n    }\n\n    setDisplayCount(nextDisplayCount);\n\n    if (indicesToTruncate) {\n      setTruncatedIndices(indicesToTruncate);\n    }\n  };\n\n  // Initial display evaluation\n  useEffect(() => {\n    evaluateSummaryDisplay();\n  }, []);\n\n  // Overflow resize observer\n  useEffect(() => {\n    const resizeObserver = new ResizeObserver(evaluateSummaryDisplay);\n\n    if (containerRef.current) {\n      resizeObserver.observe(containerRef.current, { box: 'border-box' });\n    }\n\n    return () => {\n      resizeObserver.disconnect();\n    };\n  }, [evaluateSummaryDisplay]);\n\n  return (\n    <Flex\n      as={StyledHeaderSummaryBlock}\n      item={{ grow: 1, shrink: 1 }}\n      container={{ pad: [0.5, 0], alignItems: 'center' }}\n      ref={containerRef}\n      hasItems={displayCount > 0}\n    >\n      <Flex as={StyledHeaderSummary} container={{ gap: 4 }} ref={listRef}>\n        {items.slice(0, displayCount).map((item, index) => {\n          return (\n            <Field\n              item={item}\n              primary={!!primaryItems?.length && index < primaryItems.length}\n              truncate={!!truncatedIndices?.includes(index)}\n              key={item.name}\n            />\n          );\n        })}\n      </Flex>\n    </Flex>\n  );\n};\n\nexport default Summary;\n"]}

package/lib/components/CaseView/CaseSummary.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+declare const CaseSummary: FC;
+export default CaseSummary;
+//# sourceMappingURL=CaseSummary.d.ts.map

package/lib/components/CaseView/CaseSummary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaseSummary.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/CaseSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAW,MAAM,OAAO,CAAC;AAgBpC,QAAA,MAAM,WAAW,EAAE,EA6BlB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/lib/components/CaseView/CaseSummary.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { Flex, Tabs, registerIcon } from '@pega/cosmos-react-core';
+import * as arrowMicroLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/arrow-micro-left.icon';
+import CaseHeader from './CaseHeader/CaseHeader';
+import { StyledCaseSummary, StyledCaseSummaryInfo, StyledCaseSummaryContainer } from './CaseView.styles';
+import { useCaseViewContext } from './CaseView.context';
+import CaseSummaryFields from './CaseSummaryFields';
+registerIcon(arrowMicroLeftIcon);
+const CaseSummary = () => {
+    const { testIds, summaryFields, summaryExpanded, tabs, aboveMD, isPreview } = useCaseViewContext();
+    const summary = useMemo(() => {
+        return _jsx(CaseSummaryFields, { ...summaryFields, inSummaryPanel: true });
+    }, [summaryFields]);
+    return (_jsxs(Flex, { as: StyledCaseSummary, container: { direction: 'column' }, item: { shrink: 0 }, children: [_jsx(CaseHeader, {}), aboveMD && !isPreview && summaryExpanded && (summary || tabs.items.length > 1) && (_jsxs(StyledCaseSummaryInfo, { children: [_jsx(StyledCaseSummaryContainer, { children: summary }), tabs.items.length > 1 && (_jsx(Tabs, { "data-testid": testIds.tabs, type: 'vertical', tabs: tabs.items, onTabClick: tabs.onClick, currentTabId: tabs.currentTabId }))] }))] }));
+};
+export default CaseSummary;
+//# sourceMappingURL=CaseSummary.js.map

package/lib/components/CaseView/CaseSummary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaseSummary.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseSummary.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,OAAO,EAAE,MAAM,OAAO,CAAC;AAEpC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AACnE,OAAO,KAAK,kBAAkB,MAAM,yEAAyE,CAAC;AAE9G,OAAO,UAAU,MAAM,yBAAyB,CAAC;AACjD,OAAO,EACL,iBAAiB,EACjB,qBAAqB,EACrB,0BAA0B,EAC3B,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,iBAAiB,MAAM,qBAAqB,CAAC;AAEpD,YAAY,CAAC,kBAAkB,CAAC,CAAC;AAEjC,MAAM,WAAW,GAAO,GAAG,EAAE;IAC3B,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,GACzE,kBAAkB,EAAE,CAAC;IAEvB,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3B,OAAO,KAAC,iBAAiB,OAAK,aAAa,EAAE,cAAc,SAAG,CAAC;IACjE,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,OAAO,CACL,MAAC,IAAI,IAAC,EAAE,EAAE,iBAAiB,EAAE,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,aAClF,KAAC,UAAU,KAAG,EAEb,OAAO,IAAI,CAAC,SAAS,IAAI,eAAe,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,CACjF,MAAC,qBAAqB,eACpB,KAAC,0BAA0B,cAAE,OAAO,GAA8B,EAEjE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,CACxB,KAAC,IAAI,mBACU,OAAO,CAAC,IAAI,EACzB,IAAI,EAAC,UAAU,EACf,IAAI,EAAE,IAAI,CAAC,KAAK,EAChB,UAAU,EAAE,IAAI,CAAC,OAAO,EACxB,YAAY,EAAE,IAAI,CAAC,YAAY,GAC/B,CACH,IACqB,CACzB,IACI,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { FC, useMemo } from 'react';\n\nimport { Flex, Tabs, registerIcon } from '@pega/cosmos-react-core';\nimport * as arrowMicroLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/arrow-micro-left.icon';\n\nimport CaseHeader from './CaseHeader/CaseHeader';\nimport {\n  StyledCaseSummary,\n  StyledCaseSummaryInfo,\n  StyledCaseSummaryContainer\n} from './CaseView.styles';\nimport { useCaseViewContext } from './CaseView.context';\nimport CaseSummaryFields from './CaseSummaryFields';\n\nregisterIcon(arrowMicroLeftIcon);\n\nconst CaseSummary: FC = () => {\n  const { testIds, summaryFields, summaryExpanded, tabs, aboveMD, isPreview } =\n    useCaseViewContext();\n\n  const summary = useMemo(() => {\n    return <CaseSummaryFields {...summaryFields} inSummaryPanel />;\n  }, [summaryFields]);\n\n  return (\n    <Flex as={StyledCaseSummary} container={{ direction: 'column' }} item={{ shrink: 0 }}>\n      <CaseHeader />\n\n      {aboveMD && !isPreview && summaryExpanded && (summary || tabs.items.length > 1) && (\n        <StyledCaseSummaryInfo>\n          <StyledCaseSummaryContainer>{summary}</StyledCaseSummaryContainer>\n\n          {tabs.items.length > 1 && (\n            <Tabs\n              data-testid={testIds.tabs}\n              type='vertical'\n              tabs={tabs.items}\n              onTabClick={tabs.onClick}\n              currentTabId={tabs.currentTabId}\n            />\n          )}\n        </StyledCaseSummaryInfo>\n      )}\n    </Flex>\n  );\n};\n\nexport default CaseSummary;\n"]}

package/lib/components/CaseView/CaseSummaryFields.d.ts

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

package/lib/components/CaseView/CaseSummaryFields.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaseSummaryFields.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/CaseSummaryFields.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAA2B,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAQ,YAAY,EAA0B,MAAM,yBAAyB,CAAC;AAOrF,OAAO,EAAE,sBAAsB,EAAE,MAAM,kBAAkB,CAAC;AAG1D,QAAA,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,GAAG,YAAY,CAsChE,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/lib/components/CaseView/CaseSummaryFields.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef } from 'react';
+import { Grid, useI18n, useBreakpoint } from '@pega/cosmos-react-core';
+import { StyledCaseSummaryFields, StyledSummaryPrimaryList, StyledSummarySecondaryList } from './CaseView.styles';
+import { useCaseViewContext } from './CaseView.context';
+const CaseSummaryFields = ({ primary, secondary, inSummaryPanel }) => {
+    const t = useI18n();
+    const { testIds } = useCaseViewContext();
+    const containerRef = useRef(null);
+    const isSMContentWidthOrAbove = useBreakpoint('sm', {
+        breakpointRef: containerRef,
+        themeProp: 'content-width'
+    });
+    const wrapped = !inSummaryPanel && !isSMContentWidthOrAbove;
+    return (_jsxs(Grid, { "data-testid": testIds.summaryFields, as: StyledCaseSummaryFields, container: { rowGap: 2 }, ref: containerRef, children: [primary && (_jsx(StyledSummaryPrimaryList, { variant: 'stacked', fields: primary, "aria-label": t('primary_summary_fields'), wrapped: wrapped })), secondary && (_jsx(StyledSummarySecondaryList, { variant: wrapped ? 'stacked' : 'inline', fields: secondary, "aria-label": t('summary_fields') }))] }));
+};
+export default CaseSummaryFields;
+//# sourceMappingURL=CaseSummaryFields.js.map

package/lib/components/CaseView/CaseSummaryFields.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaseSummaryFields.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseSummaryFields.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAuB,MAAM,EAAE,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,IAAI,EAAgB,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAErF,OAAO,EACL,uBAAuB,EACvB,wBAAwB,EACxB,0BAA0B,EAC3B,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAExD,MAAM,iBAAiB,GAA8C,CAAC,EACpE,OAAO,EACP,SAAS,EACT,cAAc,EAC0B,EAAE,EAAE;IAC5C,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,EAAE,OAAO,EAAE,GAAG,kBAAkB,EAAE,CAAC;IACzC,MAAM,YAAY,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAClD,MAAM,uBAAuB,GAAG,aAAa,CAAC,IAAI,EAAE;QAClD,aAAa,EAAE,YAAY;QAC3B,SAAS,EAAE,eAAe;KAC3B,CAAC,CAAC;IACH,MAAM,OAAO,GAAG,CAAC,cAAc,IAAI,CAAC,uBAAuB,CAAC;IAE5D,OAAO,CACL,MAAC,IAAI,mBACU,OAAO,CAAC,aAAa,EAClC,EAAE,EAAE,uBAAuB,EAC3B,SAAS,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EACxB,GAAG,EAAE,YAAY,aAEhB,OAAO,IAAI,CACV,KAAC,wBAAwB,IACvB,OAAO,EAAC,SAAS,EACjB,MAAM,EAAE,OAAO,gBACH,CAAC,CAAC,wBAAwB,CAAC,EACvC,OAAO,EAAE,OAAO,GAChB,CACH,EACA,SAAS,IAAI,CACZ,KAAC,0BAA0B,IACzB,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,EACvC,MAAM,EAAE,SAAS,gBACL,CAAC,CAAC,gBAAgB,CAAC,GAC/B,CACH,IACI,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import { FC, PropsWithoutRef, useRef } from 'react';\n\nimport { Grid, ForwardProps, useI18n, useBreakpoint } from '@pega/cosmos-react-core';\n\nimport {\n  StyledCaseSummaryFields,\n  StyledSummaryPrimaryList,\n  StyledSummarySecondaryList\n} from './CaseView.styles';\nimport { CaseSummaryFieldsProps } from './CaseView.types';\nimport { useCaseViewContext } from './CaseView.context';\n\nconst CaseSummaryFields: FC<CaseSummaryFieldsProps & ForwardProps> = ({\n  primary,\n  secondary,\n  inSummaryPanel\n}: PropsWithoutRef<CaseSummaryFieldsProps>) => {\n  const t = useI18n();\n  const { testIds } = useCaseViewContext();\n  const containerRef = useRef<HTMLDivElement>(null);\n  const isSMContentWidthOrAbove = useBreakpoint('sm', {\n    breakpointRef: containerRef,\n    themeProp: 'content-width'\n  });\n  const wrapped = !inSummaryPanel && !isSMContentWidthOrAbove;\n\n  return (\n    <Grid\n      data-testid={testIds.summaryFields}\n      as={StyledCaseSummaryFields}\n      container={{ rowGap: 2 }}\n      ref={containerRef}\n    >\n      {primary && (\n        <StyledSummaryPrimaryList\n          variant='stacked'\n          fields={primary}\n          aria-label={t('primary_summary_fields')}\n          wrapped={wrapped}\n        />\n      )}\n      {secondary && (\n        <StyledSummarySecondaryList\n          variant={wrapped ? 'stacked' : 'inline'}\n          fields={secondary}\n          aria-label={t('summary_fields')}\n        />\n      )}\n    </Grid>\n  );\n};\n\nexport default CaseSummaryFields;\n"]}

package/lib/components/CaseView/CaseView.context.d.ts

@@ -0,0 +1,5 @@
+import { CaseViewContextValue } from './CaseView.types';
+declare const CaseViewContext: import("react").Context<CaseViewContextValue>;
+export declare const useCaseViewContext: () => CaseViewContextValue;
+export default CaseViewContext;
+//# sourceMappingURL=CaseView.context.d.ts.map

package/lib/components/CaseView/CaseView.context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaseView.context.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.context.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAExD,QAAA,MAAM,eAAe,+CAAkE,CAAC;AAExF,eAAO,MAAM,kBAAkB,4BAAoC,CAAC;AAEpE,eAAe,eAAe,CAAC"}

package/lib/components/CaseView/CaseView.context.js

@@ -0,0 +1,5 @@
+import { createContext, useContext } from 'react';
+const CaseViewContext = createContext({});
+export const useCaseViewContext = () => useContext(CaseViewContext);
+export default CaseViewContext;
+//# sourceMappingURL=CaseView.context.js.map

package/lib/components/CaseView/CaseView.context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaseView.context.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAIlD,MAAM,eAAe,GAAG,aAAa,CAAuB,EAA0B,CAAC,CAAC;AAExF,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,eAAe,CAAC,CAAC;AAEpE,eAAe,eAAe,CAAC","sourcesContent":["import { createContext, useContext } from 'react';\n\nimport { CaseViewContextValue } from './CaseView.types';\n\nconst CaseViewContext = createContext<CaseViewContextValue>({} as CaseViewContextValue);\n\nexport const useCaseViewContext = () => useContext(CaseViewContext);\n\nexport default CaseViewContext;\n"]}

package/lib/components/CaseView/CaseView.d.ts

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+import { ForwardProps } from '@pega/cosmos-react-core';
+import { CaseViewProps } from './CaseView.types';
+declare const _default: FC<CaseViewProps & ForwardProps> & {
+    getTestIds: (testIdProp?: string | undefined) => import("@pega/cosmos-react-core").TestIdsRecord<readonly ["header", "heading", "subheading", "icon", "edit", "actions", "promoted-actions", "summary-fields", "banners", "stages", "tasks", "tabs", "tab-content", "utilities"]>;
+};
+export default _default;
+//# sourceMappingURL=CaseView.d.ts.map

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

@@ -0,0 +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,EASL,YAAY,EAYb,MAAM,yBAAyB,CAAC;AAmBjC,OAAO,EAAwB,aAAa,EAAE,MAAM,kBAAkB,CAAC;;;;AAupBvE,wBAAyD"}