npm - @pega/cosmos-react-work - Versions diffs - 7.0.0-build.30.4 → 7.0.0-build.31.1 - Mend

@pega/cosmos-react-work 7.0.0-build.30.4 → 7.0.0-build.31.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 (14) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"GenAICoach.d.ts","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAICoach.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAe,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAwD5D,OAAO,EAAyC,KAAK,eAAe,EAAE,MAAM,GAAG,CAAC;;;;~~AA6kBhF~~,wBAA6D"}
1	+ {"version":3,"file":"GenAICoach.d.ts","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAICoach.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAe,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAwD5D,OAAO,EAAyC,KAAK,eAAe,EAAE,MAAM,GAAG,CAAC;;;;AAgnBhF,wBAA6D"}

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

@@ -30,6 +30,7 @@ const GenAICoach = ({ testId, coachOptions: coachOptionsProps, onCoachChange: on
     const previousMessages = usePrevious(messages);
     const testIds = useTestIds(testId, getGenAICoachTestIds);
     const { announcePolite } = useLiveLog();
+    const latestMessage = messages.at(-1);
     const onCoachChange = (id) => {
         setCoachOptions(cur => {
             return cur.map(coach => {
@@ -130,19 +131,22 @@ const GenAICoach = ({ testId, coachOptions: coachOptionsProps, onCoachChange: on
         const prevFilteredMsgs = previousMessages?.filter(item => !hasProp(item, 'loading')) ?? [];
         const currentFilteredMsgs = messages?.filter(item => !hasProp(item, 'loading')) ?? [];
         if (prevFilteredMsgs.length < currentFilteredMsgs.length ||
-            (messages.length > 0 && hasProp(messages[messages.length - 1], 'loading'))) {
+            (latestMessage && hasProp(latestMessage, 'loading'))) {
             setTimeout(() => {
                 conversationRef.current?.lastElementChild?.scrollIntoView({
                     behavior: 'smooth',
                     block: 'nearest'
                 });
             }, 0);
-            if (isUserMessage(messages[messages.length - 1])) {
+            if (latestMessage && isUserMessage(latestMessage)) {
                 textAreaRef.current?.focus();
                 setLastFocusableElement();
                 elementRef.current = null;
                 setArrowKey(null);
             }
+            else if (latestMessage?.loading) {
+                announcePolite({ message: t('generating_response') });
+            }
             else {
                 announcePolite({ message: t('coach', [`${t('new_message')} ${t('from')}`]) });
             }
@@ -257,7 +261,12 @@ const GenAICoach = ({ testId, coachOptions: coachOptionsProps, onCoachChange: on
                         ((isInUtilities(variant) &&
                             variant.state !== 'docked' &&
                             variant.state !== 'minimized') ||
-                            !isInUtilities(variant)) && (_jsx(Flex, { container: { direction: 'column' }, as: StyledInputContainer, children: guidedMode ? (_jsx(_Fragment, { children: suggestions && messages.length > 0 && (_jsxs(_Fragment, { children: [_jsx(Configuration, { theme: {
+                            !isInUtilities(variant)) && (_jsx(Flex, { container: { direction: 'column' }, as: StyledInputContainer, children: guidedMode ? (_jsx(_Fragment, { children: suggestions && messages.length > 0 && (_jsxs(_Fragment, { children: [latestMessage && isCoachMessage(latestMessage) && latestMessage.loading ? (_jsxs(Flex, { container: {
+                                            gap: 1,
+                                            justify: 'center',
+                                            alignItems: 'center',
+                                            pad: 1
+                                        }, children: [t('generating_response'), _jsx(Progress, { placement: 'inline' })] })) : (_jsx(Configuration, { theme: {
                                             components: {
                                                 button: {
                                                     color: theme.base.palette.ai,
@@ -275,7 +284,12 @@ const GenAICoach = ({ testId, coachOptions: coachOptionsProps, onCoachChange: on
                                                             message: selected.primary
                                                         });
                                                 }
-                                            } }) }), _jsx(StyledDisclaimerText, { children: t('ai_disclaimer') })] })) })) : (_jsxs(_Fragment, { children: [_jsx(TextArea, { ref: textAreaRef, label: t('message_pega_gen_ai_coach', [selectedCoach ?? '']), value: message, onKeyDown: handleEnterKeyDown, onChange: handleTextAreaChange, autoResize: false }), _jsxs(Flex, { container: {
+                                            } }) })), _jsx(StyledDisclaimerText, { children: t('ai_disclaimer') })] })) })) : (_jsxs(_Fragment, { children: [_jsx(TextArea, { ref: textAreaRef, label: t('message_pega_gen_ai_coach', [selectedCoach ?? '']), value: message, onKeyDown: handleEnterKeyDown, onChange: handleTextAreaChange, autoResize: false }), latestMessage && isCoachMessage(latestMessage) && latestMessage.loading ? (_jsxs(Flex, { container: {
+                                        gap: 1,
+                                        justify: 'end',
+                                        alignItems: 'center',
+                                        pad: 1
+                                    }, children: [t('generating_response'), _jsx(Progress, { placement: 'inline' })] })) : (_jsxs(Flex, { container: {
                                         gap: 2,
                                         justify: 'end',
                                         pad: 1
@@ -297,7 +311,7 @@ const GenAICoach = ({ testId, coachOptions: coachOptionsProps, onCoachChange: on
                                                     });
                                                     setMessage('');
                                                 }
-                                                : undefined, children: t('send') })] }), _jsx(StyledDisclaimerText, { children: t('ai_disclaimer') })] })) })), !loading &&
+                                                : undefined, children: t('send') })] })), _jsx(StyledDisclaimerText, { children: t('ai_disclaimer') })] })) })), !loading &&
                         !error &&
                         messages.length === 0 &&
                         ((isInUtilities(variant) && variant.state === 'minimized') || starterMessage) && (_jsx(StyledChatButton, { icon: true, onClick: () => {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"GenAICoach.js","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAICoach.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { ChangeEvent, FunctionComponent } from 'react';\n\nimport {\n Button,\n Flex,\n Icon,\n MenuButton,\n Progress,\n Text,\n TextArea,\n createUID,\n menuHelpers,\n useBreakpoint,\n useI18n,\n useTestIds,\n useTheme,\n withTestIds,\n Card,\n registerIcon,\n usePrevious,\n getFocusables,\n isMenuGroupProps,\n ErrorState,\n Tooltip,\n useElement,\n useArrows,\n focusableSelector,\n useLiveLog,\n useOuterEvent,\n Configuration,\n hasProp\n} from '@pega/cosmos-react-core';\nimport type { MenuItemProps, MenuProps } from '@pega/cosmos-react-core';\nimport * as caretUpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-up.icon';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\nimport * as caretDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-down.icon';\nimport * as minusIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/minus.icon';\nimport * as polarisSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/polaris-solid.icon';\n\nimport { getGenAICoachTestIds } from './GenAICoach.test-ids';\nimport { isCoachMessage, isInUtilities, isUserMessage } from './GenAICoach.utils';\nimport {\n StyledChatButton,\n StyledCloseButton,\n StyledMessagesContainer,\n StyledDisclaimerText,\n StyledGenAICoachContainer,\n StyledGenAIOptionsMenu,\n StyledInitialMessageContainer,\n StyledInputContainer,\n StyledStarterMessage,\n StyledSuggestions,\n StyledStarterMessageCard,\n StyledMessagesList\n} from './GenAICoach.styles';\n\nimport { GenAIMessage, InitialSuggestedMessage, type GenAICoachProps } from '.';\n\nregisterIcon(caretUpIcon, timesIcon, caretDownIcon, minusIcon, polarisSolidIcon);\n\nconst GenAICoach: FunctionComponent<GenAICoachProps> = ({\n testId,\n coachOptions: coachOptionsProps,\n onCoachChange: onCoachChangeProp,\n messages = [],\n onSend,\n initialSuggestedMessages,\n suggestions,\n loading,\n error,\n starterMessage,\n variant,\n onOpen,\n guidedMode = false,\n ...restProps\n}) => {\n const theme = useTheme();\n const t = useI18n();\n const elementRef = useRef<HTMLElement \| null>(null);\n const conversationRef = useRef<HTMLUListElement>(null);\n const genAICoachRef = useRef<HTMLElement>(null);\n const [starterMessageElement, setStarterMessageElement] = useElement<HTMLDivElement>(null);\n const focusInMessageListRef = useRef(false);\n const lastFocusedMessageRef = useRef<HTMLElement \| null>(null);\n const initialFocusedElementRef = useRef<HTMLElement \| null>(null);\n const messageContainerRef = useRef<HTMLDivElement>(null);\n const textAreaRef = useRef<HTMLTextAreaElement>(null);\n\n const [message, setMessage] = useState('');\n const [coachOptions, setCoachOptions] = useState<MenuProps['items']>(coachOptionsProps);\n const [arrowKey, setArrowKey] = useState<\n 'ArrowRight' \| 'ArrowLeft' \| 'ArrowUp' \| 'ArrowDown' \| null\n >(null);\n\n const mdOrAbove = useBreakpoint('md');\n const previousMessages = usePrevious(messages);\n const testIds = useTestIds(testId, getGenAICoachTestIds);\n const { announcePolite } = useLiveLog();\n\n const onCoachChange = (id: MenuItemProps['id']) => {\n setCoachOptions(cur => {\n return cur.map(coach => {\n return {\n ...coach,\n selected: coach.id === id\n };\n });\n });\n onCoachChangeProp?.(id);\n };\n\n const selectedCoach = useMemo(() => {\n const selected = menuHelpers.getSelected(coachOptions)[0];\n if (selected) return selected.primary;\n\n if (coachOptions[0]) {\n if (isMenuGroupProps(coachOptions[0])) {\n return coachOptions[0].items[0].primary;\n }\n return coachOptions[0].primary;\n }\n }, [coachOptions]);\n\n const handleEnterKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n onSend({\n id: createUID(),\n message\n });\n setMessage('');\n e.preventDefault();\n e.stopPropagation();\n }\n },\n [message]\n );\n\n const handleTextAreaChange = useCallback(\n (e: ChangeEvent<HTMLTextAreaElement>) => {\n setMessage(e.currentTarget.value);\n },\n [setMessage]\n );\n\n const renderCoachOptions = useMemo(() => {\n if (coachOptions.length === 0 \|\| !selectedCoach) {\n return null;\n }\n if (coachOptions.length === 1) {\n return (\n <Flex container={{ gap: 1 }}>\n <Icon name='polaris-solid' color={theme.base.palette.ai} />\n <Text variant='h3'>{selectedCoach}</Text>\n </Flex>\n );\n }\n return (\n <MenuButton\n text={selectedCoach}\n variant='text'\n as={StyledGenAIOptionsMenu}\n icon='polaris-solid'\n menu={{\n mode: 'single-select',\n items: coachOptions,\n onItemClick: onCoachChange\n }}\n />\n );\n }, [coachOptions, selectedCoach]);\n\n const headerContent = useMemo(() => {\n return isInUtilities(variant) && variant.state === 'docked' ? (\n <>\n <Flex container={{ gap: 1 }}>\n <Icon name='polaris-solid' color={theme.base.palette.ai} />\n <Text variant='h3'>{selectedCoach}</Text>\n </Flex>\n <Flex container={{ alignItems: 'center' }}>\n <Button\n icon\n label={t('maximize')}\n aria-label={t('maximize_gen_ai', [t('coach', ['Pega Gen AI'])])}\n variant='simple'\n onClick={() => variant.onStateChange('maximized')}\n >\n <Icon name='caret-up' />\n </Button>\n </Flex>\n </>\n ) : (\n <>\n {renderCoachOptions}\n\n {isInUtilities(variant) && (\n <Button\n icon\n label={t('minimize')}\n aria-label={t('minimize_gen_ai', [t('coach', ['Pega Gen AI'])])}\n variant='simple'\n onClick={() => variant.onStateChange('docked')}\n >\n <Icon name='minus' />\n </Button>\n )}\n {variant.placement === 'dialog' && (\n <Button\n icon\n label={t('close')}\n aria-label={t('close_gen_ai', [t('coach', ['Pega Gen AI'])])}\n variant='simple'\n onClick={variant.onClose}\n >\n <Icon name='times' />\n </Button>\n )}\n </>\n );\n }, [variant, coachOptions]);\n\n const setLastFocusableElement = () => {\n focusInMessageListRef.current = false;\n lastFocusedMessageRef.current = conversationRef?.current?.querySelector(':focus') \|\| null;\n if (\n lastFocusedMessageRef.current &&\n lastFocusedMessageRef.current?.tagName.toLowerCase() !== 'li'\n ) {\n lastFocusedMessageRef.current = lastFocusedMessageRef.current.closest('li[type=\"message\"]');\n }\n };\n\n const onResize = () => {\n if (genAICoachRef.current && isInUtilities(variant)) {\n const height = genAICoachRef.current.clientHeight;\n variant.setGenAIHeight?.(height);\n }\n };\n\n useEffect(() => {\n if (isInUtilities(variant)) {\n onResize();\n }\n if (variant.placement !== 'fullpage') {\n textAreaRef.current?.focus();\n elementRef.current = null;\n }\n }, [variant]);\n\n useEffect(() => {\n onResize();\n if (mdOrAbove) {\n textAreaRef.current?.focus();\n }\n if (\n isInUtilities(variant) &&\n (variant.state === 'docked' \|\| (guidedMode && variant.state === 'maximized')) &&\n getFocusables(genAICoachRef).length > 0\n ) {\n getFocusables(genAICoachRef)[0].focus();\n }\n }, [mdOrAbove, variant]);\n\n useEffect(() => {\n onOpen?.();\n window.addEventListener('resize', onResize);\n\n return () => {\n window.removeEventListener('resize', onResize);\n };\n }, []);\n\n useEffect(() => {\n if (isInUtilities(variant) && variant.state !== 'maximized' && messages.length > 0) {\n variant.onStateChange('maximized');\n }\n\n const prevFilteredMsgs = previousMessages?.filter(item => !hasProp(item, 'loading')) ?? [];\n const currentFilteredMsgs = messages?.filter(item => !hasProp(item, 'loading')) ?? [];\n\n if (\n prevFilteredMsgs.length < currentFilteredMsgs.length \|\|\n (messages.length > 0 && hasProp(messages[messages.length - 1], 'loading'))\n ) {\n setTimeout(() => {\n conversationRef.current?.lastElementChild?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest'\n });\n }, 0);\n if (isUserMessage(messages[messages.length - 1])) {\n textAreaRef.current?.focus();\n setLastFocusableElement();\n elementRef.current = null;\n setArrowKey(null);\n } else {\n announcePolite({ message: t('coach', [`${t('new_message')} ${t('from')}`]) });\n }\n }\n }, [messages]);\n\n /** Supports arrow key behaviors /\n useEffect(() => {\n const focusables = getFocusables(elementRef);\n if (arrowKey === 'ArrowRight') {\n focusables[0]?.focus();\n } else if (arrowKey === 'ArrowLeft') {\n focusables[focusables.length - 1]?.focus();\n }\n }, [arrowKey, elementRef.current]);\n\n useArrows(\n conversationRef,\n {\n cycle: true,\n selector: ':scope > li',\n dir: 'up-down',\n allowTabFocus: true,\n initialFocusElement: initialFocusedElementRef.current\n },\n [messages, initialFocusedElementRef.current]\n );\n\n useArrows(\n elementRef,\n {\n cycle: true,\n selector: `li ${focusableSelector}`,\n dir: 'left-right',\n allowTabFocus: true,\n updateTabIndex: false\n },\n [messages, elementRef.current, arrowKey]\n );\n\n useOuterEvent('mousedown', [conversationRef.current], () => {\n setArrowKey(null);\n focusInMessageListRef.current = false;\n });\n\n return (\n <Flex\n container={{ direction: 'column' }}\n as={StyledGenAICoachContainer}\n data-testid={testIds.root}\n variant={variant}\n starterMessage={starterMessage}\n ref={genAICoachRef}\n {...restProps}\n >\n <Flex container={{ justify: 'between', alignItems: 'center', pad: 1 }}>{headerContent}</Flex>\n {((isInUtilities(variant) && variant.state !== 'docked') \|\| !isInUtilities(variant)) && (\n <>\n <Flex\n as={StyledMessagesContainer}\n ref={messageContainerRef}\n container={\n starterMessage \|\| loading \|\| error\n ? { direction: 'column', pad: [0, 2], justify: 'center' }\n : { direction: 'column', pad: [0, 2] }\n }\n item={{ grow: 1 }}\n >\n {loading \|\| error ? (\n <Flex container={{ justify: 'center', alignItems: 'center' }}>\n {loading ? (\n <Progress\n variant='ring'\n placement='block'\n message={typeof loading === 'string' ? loading : t('loading')}\n />\n ) : (\n <ErrorState message={error} />\n )}\n </Flex>\n ) : (\n <>\n {messages.length === 0 ? (\n <>\n {starterMessage ? (\n <Card\n container={{ alignItems: 'center', pad: 1, justify: 'between' }}\n item={{ grow: 0 }}\n as={StyledStarterMessageCard}\n >\n <StyledStarterMessage ref={setStarterMessageElement}>\n {starterMessage.message}\n </StyledStarterMessage>\n {starterMessage.message && starterMessageElement && (\n <Tooltip target={starterMessageElement} smart>\n {starterMessage.message}\n </Tooltip>\n )}\n\n <StyledCloseButton\n icon\n label={t('close')}\n aria-label={`${t('close')} ${t('starter_message')}`}\n variant='simple'\n onClick={starterMessage.onClose}\n >\n <Icon name='times' />\n </StyledCloseButton>\n </Card>\n ) : (\n <Flex\n as={StyledInitialMessageContainer}\n container={{\n justify: 'center',\n direction: 'column',\n gap: 8\n }}\n item={{ grow: 1 }}\n >\n {((isInUtilities(variant) && variant.state === 'maximized') \|\|\n !isInUtilities(variant)) && (\n <Flex container={{ direction: 'column', alignItems: 'center', gap: 2 }}>\n <Icon name='polaris-solid' size='l' color={theme.base.palette.ai} />\n <Text variant='h2'>{t('welcome_text')}</Text>\n </Flex>\n )}\n <Flex container={{ direction: 'column', gap: 1.5 }}>\n {initialSuggestedMessages?.map(initialSuggestedMessage => (\n <InitialSuggestedMessage\n {...initialSuggestedMessage}\n onSend={initialMessage => {\n onSend(initialMessage);\n }}\n testId={initialSuggestedMessage.id}\n />\n ))}\n </Flex>\n </Flex>\n )}\n </>\n ) : (\n <Flex\n as={StyledMessagesList}\n ref={conversationRef}\n container={{ direction: 'column' }}\n onFocus={() => {\n if (!focusInMessageListRef.current) {\n if (lastFocusedMessageRef.current) {\n lastFocusedMessageRef.current.focus();\n } else {\n /* Focus on the latest message if the chat message list was never focused */\n const lastChild =\n conversationRef.current && conversationRef.current.lastElementChild;\n if (lastChild instanceof HTMLElement) {\n lastChild.focus();\n }\n }\n }\n focusInMessageListRef.current = true;\n setArrowKey(null);\n }}\n onKeyDown={(e: KeyboardEvent) => {\n if (e.key === 'ArrowUp' \|\| e.key === 'ArrowDown') {\n setArrowKey(e.key);\n elementRef.current = null;\n } else if (e.key === 'ArrowRight' \|\| e.key === 'ArrowLeft') {\n const currentElement = conversationRef.current?.querySelector('li:focus');\n if (currentElement && currentElement instanceof HTMLElement) {\n elementRef.current = currentElement;\n } else {\n elementRef.current =\n conversationRef.current\n ?.querySelector(':focus')\n ?.closest('li[type=\"message\"]') \|\| null;\n }\n initialFocusedElementRef.current = elementRef.current;\n\n if (currentElement && getFocusables(currentElement).length > 0) {\n setArrowKey(e.key);\n }\n } else if (e.key === 'Tab') {\n setLastFocusableElement();\n if (e.shiftKey) {\n const prevElement =\n conversationRef.current?.parentElement?.previousElementSibling;\n if (prevElement) {\n const focusables = getFocusables(prevElement);\n if (focusables.length) {\n e.preventDefault();\n focusables[focusables.length - 1].focus();\n }\n }\n } else {\n const nextElement =\n conversationRef.current?.parentElement?.nextElementSibling;\n if (nextElement) {\n const focusables = getFocusables(nextElement);\n if (focusables.length) {\n e.preventDefault();\n focusables[0].focus();\n }\n }\n }\n setArrowKey(null);\n }\n }}\n >\n {messages.map(item => {\n const messageProps = isCoachMessage(item)\n ? {\n ...item,\n onSend\n }\n : item;\n\n return <GenAIMessage {...messageProps} testId={item.id} />;\n })}\n </Flex>\n )}\n </>\n )}\n </Flex>\n\n {!starterMessage &&\n ((isInUtilities(variant) &&\n variant.state !== 'docked' &&\n variant.state !== 'minimized') \|\|\n !isInUtilities(variant)) && (\n <Flex container={{ direction: 'column' }} as={StyledInputContainer}>\n {guidedMode ? (\n <>\n {suggestions && messages.length > 0 && (\n <>\n <Configuration\n theme={{\n components: {\n button: {\n color: theme.base.palette.ai,\n 'secondary-color': theme.base.palette.ai,\n 'secondary-fill-style': 'outline'\n }\n }\n }}\n >\n <MenuButton\n text={t('ask_coach', [selectedCoach ?? ''])}\n icon='polaris-solid'\n menu={{\n items: suggestions,\n onItemClick: id => {\n const selected = menuHelpers.getItem(suggestions, id);\n if (selected)\n onSend({\n id: selected.id,\n message: selected.primary\n });\n }\n }}\n />\n </Configuration>\n <StyledDisclaimerText>{t('ai_disclaimer')}</StyledDisclaimerText>\n </>\n )}\n </>\n ) : (\n <>\n <TextArea\n ref={textAreaRef}\n label={t('message_pega_gen_ai_coach', [selectedCoach ?? ''])}\n value={message}\n onKeyDown={handleEnterKeyDown}\n onChange={handleTextAreaChange}\n autoResize={false}\n />\n <Flex\n container={{\n gap: 2,\n justify: 'end',\n pad: 1\n }}\n >\n {suggestions && (\n <MenuButton\n text={t('suggestions')}\n variant='text'\n icon='polaris-solid'\n as={StyledSuggestions}\n menu={{\n items: suggestions,\n onItemClick: id => {\n const selected = menuHelpers.getItem(suggestions, id);\n if (selected)\n onSend({\n id: selected.id,\n message: selected.primary\n });\n }\n }}\n />\n )}\n <Button\n variant='primary'\n onClick={\n message\n ? () => {\n onSend({\n id: createUID(),\n message\n });\n setMessage('');\n }\n : undefined\n }\n >\n {t('send')}\n </Button>\n </Flex>\n <StyledDisclaimerText>{t('ai_disclaimer')}</StyledDisclaimerText>\n </>\n )}\n </Flex>\n )}\n {!loading &&\n !error &&\n messages.length === 0 &&\n ((isInUtilities(variant) && variant.state === 'minimized') \|\| starterMessage) && (\n <StyledChatButton\n icon\n onClick={() => {\n if (isInUtilities(variant)) variant.onStateChange('maximized');\n if (starterMessage && starterMessage.message) {\n onSend({\n id: starterMessage.id,\n message: starterMessage.message\n });\n }\n }}\n >\n <Flex container={{ alignItems: 'center', gap: 1 }}>\n <Icon name='polaris-solid' />\n {t('start_chat')}\n </Flex>\n </StyledChatButton>\n )}\n </>\n )}\n </Flex>\n );\n};\n\nexport default withTestIds(GenAICoach, getGenAICoachTestIds);\n"]}
1	+ {"version":3,"file":"GenAICoach.js","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAICoach.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { ChangeEvent, FunctionComponent } from 'react';\n\nimport {\n Button,\n Flex,\n Icon,\n MenuButton,\n Progress,\n Text,\n TextArea,\n createUID,\n menuHelpers,\n useBreakpoint,\n useI18n,\n useTestIds,\n useTheme,\n withTestIds,\n Card,\n registerIcon,\n usePrevious,\n getFocusables,\n isMenuGroupProps,\n ErrorState,\n Tooltip,\n useElement,\n useArrows,\n focusableSelector,\n useLiveLog,\n useOuterEvent,\n Configuration,\n hasProp\n} from '@pega/cosmos-react-core';\nimport type { MenuItemProps, MenuProps } from '@pega/cosmos-react-core';\nimport * as caretUpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-up.icon';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\nimport * as caretDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-down.icon';\nimport * as minusIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/minus.icon';\nimport * as polarisSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/polaris-solid.icon';\n\nimport { getGenAICoachTestIds } from './GenAICoach.test-ids';\nimport { isCoachMessage, isInUtilities, isUserMessage } from './GenAICoach.utils';\nimport {\n StyledChatButton,\n StyledCloseButton,\n StyledMessagesContainer,\n StyledDisclaimerText,\n StyledGenAICoachContainer,\n StyledGenAIOptionsMenu,\n StyledInitialMessageContainer,\n StyledInputContainer,\n StyledStarterMessage,\n StyledSuggestions,\n StyledStarterMessageCard,\n StyledMessagesList\n} from './GenAICoach.styles';\n\nimport { GenAIMessage, InitialSuggestedMessage, type GenAICoachProps } from '.';\n\nregisterIcon(caretUpIcon, timesIcon, caretDownIcon, minusIcon, polarisSolidIcon);\n\nconst GenAICoach: FunctionComponent<GenAICoachProps> = ({\n testId,\n coachOptions: coachOptionsProps,\n onCoachChange: onCoachChangeProp,\n messages = [],\n onSend,\n initialSuggestedMessages,\n suggestions,\n loading,\n error,\n starterMessage,\n variant,\n onOpen,\n guidedMode = false,\n ...restProps\n}) => {\n const theme = useTheme();\n const t = useI18n();\n const elementRef = useRef<HTMLElement \| null>(null);\n const conversationRef = useRef<HTMLUListElement>(null);\n const genAICoachRef = useRef<HTMLElement>(null);\n const [starterMessageElement, setStarterMessageElement] = useElement<HTMLDivElement>(null);\n const focusInMessageListRef = useRef(false);\n const lastFocusedMessageRef = useRef<HTMLElement \| null>(null);\n const initialFocusedElementRef = useRef<HTMLElement \| null>(null);\n const messageContainerRef = useRef<HTMLDivElement>(null);\n const textAreaRef = useRef<HTMLTextAreaElement>(null);\n\n const [message, setMessage] = useState('');\n const [coachOptions, setCoachOptions] = useState<MenuProps['items']>(coachOptionsProps);\n const [arrowKey, setArrowKey] = useState<\n 'ArrowRight' \| 'ArrowLeft' \| 'ArrowUp' \| 'ArrowDown' \| null\n >(null);\n\n const mdOrAbove = useBreakpoint('md');\n const previousMessages = usePrevious(messages);\n const testIds = useTestIds(testId, getGenAICoachTestIds);\n const { announcePolite } = useLiveLog();\n\n const latestMessage = messages.at(-1);\n\n const onCoachChange = (id: MenuItemProps['id']) => {\n setCoachOptions(cur => {\n return cur.map(coach => {\n return {\n ...coach,\n selected: coach.id === id\n };\n });\n });\n onCoachChangeProp?.(id);\n };\n\n const selectedCoach = useMemo(() => {\n const selected = menuHelpers.getSelected(coachOptions)[0];\n if (selected) return selected.primary;\n\n if (coachOptions[0]) {\n if (isMenuGroupProps(coachOptions[0])) {\n return coachOptions[0].items[0].primary;\n }\n return coachOptions[0].primary;\n }\n }, [coachOptions]);\n\n const handleEnterKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n onSend({\n id: createUID(),\n message\n });\n setMessage('');\n e.preventDefault();\n e.stopPropagation();\n }\n },\n [message]\n );\n\n const handleTextAreaChange = useCallback(\n (e: ChangeEvent<HTMLTextAreaElement>) => {\n setMessage(e.currentTarget.value);\n },\n [setMessage]\n );\n\n const renderCoachOptions = useMemo(() => {\n if (coachOptions.length === 0 \|\| !selectedCoach) {\n return null;\n }\n if (coachOptions.length === 1) {\n return (\n <Flex container={{ gap: 1 }}>\n <Icon name='polaris-solid' color={theme.base.palette.ai} />\n <Text variant='h3'>{selectedCoach}</Text>\n </Flex>\n );\n }\n return (\n <MenuButton\n text={selectedCoach}\n variant='text'\n as={StyledGenAIOptionsMenu}\n icon='polaris-solid'\n menu={{\n mode: 'single-select',\n items: coachOptions,\n onItemClick: onCoachChange\n }}\n />\n );\n }, [coachOptions, selectedCoach]);\n\n const headerContent = useMemo(() => {\n return isInUtilities(variant) && variant.state === 'docked' ? (\n <>\n <Flex container={{ gap: 1 }}>\n <Icon name='polaris-solid' color={theme.base.palette.ai} />\n <Text variant='h3'>{selectedCoach}</Text>\n </Flex>\n <Flex container={{ alignItems: 'center' }}>\n <Button\n icon\n label={t('maximize')}\n aria-label={t('maximize_gen_ai', [t('coach', ['Pega Gen AI'])])}\n variant='simple'\n onClick={() => variant.onStateChange('maximized')}\n >\n <Icon name='caret-up' />\n </Button>\n </Flex>\n </>\n ) : (\n <>\n {renderCoachOptions}\n\n {isInUtilities(variant) && (\n <Button\n icon\n label={t('minimize')}\n aria-label={t('minimize_gen_ai', [t('coach', ['Pega Gen AI'])])}\n variant='simple'\n onClick={() => variant.onStateChange('docked')}\n >\n <Icon name='minus' />\n </Button>\n )}\n {variant.placement === 'dialog' && (\n <Button\n icon\n label={t('close')}\n aria-label={t('close_gen_ai', [t('coach', ['Pega Gen AI'])])}\n variant='simple'\n onClick={variant.onClose}\n >\n <Icon name='times' />\n </Button>\n )}\n </>\n );\n }, [variant, coachOptions]);\n\n const setLastFocusableElement = () => {\n focusInMessageListRef.current = false;\n lastFocusedMessageRef.current = conversationRef?.current?.querySelector(':focus') \|\| null;\n if (\n lastFocusedMessageRef.current &&\n lastFocusedMessageRef.current?.tagName.toLowerCase() !== 'li'\n ) {\n lastFocusedMessageRef.current = lastFocusedMessageRef.current.closest('li[type=\"message\"]');\n }\n };\n\n const onResize = () => {\n if (genAICoachRef.current && isInUtilities(variant)) {\n const height = genAICoachRef.current.clientHeight;\n variant.setGenAIHeight?.(height);\n }\n };\n\n useEffect(() => {\n if (isInUtilities(variant)) {\n onResize();\n }\n if (variant.placement !== 'fullpage') {\n textAreaRef.current?.focus();\n elementRef.current = null;\n }\n }, [variant]);\n\n useEffect(() => {\n onResize();\n if (mdOrAbove) {\n textAreaRef.current?.focus();\n }\n if (\n isInUtilities(variant) &&\n (variant.state === 'docked' \|\| (guidedMode && variant.state === 'maximized')) &&\n getFocusables(genAICoachRef).length > 0\n ) {\n getFocusables(genAICoachRef)[0].focus();\n }\n }, [mdOrAbove, variant]);\n\n useEffect(() => {\n onOpen?.();\n window.addEventListener('resize', onResize);\n\n return () => {\n window.removeEventListener('resize', onResize);\n };\n }, []);\n\n useEffect(() => {\n if (isInUtilities(variant) && variant.state !== 'maximized' && messages.length > 0) {\n variant.onStateChange('maximized');\n }\n\n const prevFilteredMsgs = previousMessages?.filter(item => !hasProp(item, 'loading')) ?? [];\n const currentFilteredMsgs = messages?.filter(item => !hasProp(item, 'loading')) ?? [];\n\n if (\n prevFilteredMsgs.length < currentFilteredMsgs.length \|\|\n (latestMessage && hasProp(latestMessage, 'loading'))\n ) {\n setTimeout(() => {\n conversationRef.current?.lastElementChild?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest'\n });\n }, 0);\n if (latestMessage && isUserMessage(latestMessage)) {\n textAreaRef.current?.focus();\n setLastFocusableElement();\n elementRef.current = null;\n setArrowKey(null);\n } else if (latestMessage?.loading) {\n announcePolite({ message: t('generating_response') });\n } else {\n announcePolite({ message: t('coach', [`${t('new_message')} ${t('from')}`]) });\n }\n }\n }, [messages]);\n\n /** Supports arrow key behaviors /\n useEffect(() => {\n const focusables = getFocusables(elementRef);\n if (arrowKey === 'ArrowRight') {\n focusables[0]?.focus();\n } else if (arrowKey === 'ArrowLeft') {\n focusables[focusables.length - 1]?.focus();\n }\n }, [arrowKey, elementRef.current]);\n\n useArrows(\n conversationRef,\n {\n cycle: true,\n selector: ':scope > li',\n dir: 'up-down',\n allowTabFocus: true,\n initialFocusElement: initialFocusedElementRef.current\n },\n [messages, initialFocusedElementRef.current]\n );\n\n useArrows(\n elementRef,\n {\n cycle: true,\n selector: `li ${focusableSelector}`,\n dir: 'left-right',\n allowTabFocus: true,\n updateTabIndex: false\n },\n [messages, elementRef.current, arrowKey]\n );\n\n useOuterEvent('mousedown', [conversationRef.current], () => {\n setArrowKey(null);\n focusInMessageListRef.current = false;\n });\n\n return (\n <Flex\n container={{ direction: 'column' }}\n as={StyledGenAICoachContainer}\n data-testid={testIds.root}\n variant={variant}\n starterMessage={starterMessage}\n ref={genAICoachRef}\n {...restProps}\n >\n <Flex container={{ justify: 'between', alignItems: 'center', pad: 1 }}>{headerContent}</Flex>\n {((isInUtilities(variant) && variant.state !== 'docked') \|\| !isInUtilities(variant)) && (\n <>\n <Flex\n as={StyledMessagesContainer}\n ref={messageContainerRef}\n container={\n starterMessage \|\| loading \|\| error\n ? { direction: 'column', pad: [0, 2], justify: 'center' }\n : { direction: 'column', pad: [0, 2] }\n }\n item={{ grow: 1 }}\n >\n {loading \|\| error ? (\n <Flex container={{ justify: 'center', alignItems: 'center' }}>\n {loading ? (\n <Progress\n variant='ring'\n placement='block'\n message={typeof loading === 'string' ? loading : t('loading')}\n />\n ) : (\n <ErrorState message={error} />\n )}\n </Flex>\n ) : (\n <>\n {messages.length === 0 ? (\n <>\n {starterMessage ? (\n <Card\n container={{ alignItems: 'center', pad: 1, justify: 'between' }}\n item={{ grow: 0 }}\n as={StyledStarterMessageCard}\n >\n <StyledStarterMessage ref={setStarterMessageElement}>\n {starterMessage.message}\n </StyledStarterMessage>\n {starterMessage.message && starterMessageElement && (\n <Tooltip target={starterMessageElement} smart>\n {starterMessage.message}\n </Tooltip>\n )}\n\n <StyledCloseButton\n icon\n label={t('close')}\n aria-label={`${t('close')} ${t('starter_message')}`}\n variant='simple'\n onClick={starterMessage.onClose}\n >\n <Icon name='times' />\n </StyledCloseButton>\n </Card>\n ) : (\n <Flex\n as={StyledInitialMessageContainer}\n container={{\n justify: 'center',\n direction: 'column',\n gap: 8\n }}\n item={{ grow: 1 }}\n >\n {((isInUtilities(variant) && variant.state === 'maximized') \|\|\n !isInUtilities(variant)) && (\n <Flex container={{ direction: 'column', alignItems: 'center', gap: 2 }}>\n <Icon name='polaris-solid' size='l' color={theme.base.palette.ai} />\n <Text variant='h2'>{t('welcome_text')}</Text>\n </Flex>\n )}\n <Flex container={{ direction: 'column', gap: 1.5 }}>\n {initialSuggestedMessages?.map(initialSuggestedMessage => (\n <InitialSuggestedMessage\n {...initialSuggestedMessage}\n onSend={initialMessage => {\n onSend(initialMessage);\n }}\n testId={initialSuggestedMessage.id}\n />\n ))}\n </Flex>\n </Flex>\n )}\n </>\n ) : (\n <Flex\n as={StyledMessagesList}\n ref={conversationRef}\n container={{ direction: 'column' }}\n onFocus={() => {\n if (!focusInMessageListRef.current) {\n if (lastFocusedMessageRef.current) {\n lastFocusedMessageRef.current.focus();\n } else {\n /* Focus on the latest message if the chat message list was never focused */\n const lastChild =\n conversationRef.current && conversationRef.current.lastElementChild;\n if (lastChild instanceof HTMLElement) {\n lastChild.focus();\n }\n }\n }\n focusInMessageListRef.current = true;\n setArrowKey(null);\n }}\n onKeyDown={(e: KeyboardEvent) => {\n if (e.key === 'ArrowUp' \|\| e.key === 'ArrowDown') {\n setArrowKey(e.key);\n elementRef.current = null;\n } else if (e.key === 'ArrowRight' \|\| e.key === 'ArrowLeft') {\n const currentElement = conversationRef.current?.querySelector('li:focus');\n if (currentElement && currentElement instanceof HTMLElement) {\n elementRef.current = currentElement;\n } else {\n elementRef.current =\n conversationRef.current\n ?.querySelector(':focus')\n ?.closest('li[type=\"message\"]') \|\| null;\n }\n initialFocusedElementRef.current = elementRef.current;\n\n if (currentElement && getFocusables(currentElement).length > 0) {\n setArrowKey(e.key);\n }\n } else if (e.key === 'Tab') {\n setLastFocusableElement();\n if (e.shiftKey) {\n const prevElement =\n conversationRef.current?.parentElement?.previousElementSibling;\n if (prevElement) {\n const focusables = getFocusables(prevElement);\n if (focusables.length) {\n e.preventDefault();\n focusables[focusables.length - 1].focus();\n }\n }\n } else {\n const nextElement =\n conversationRef.current?.parentElement?.nextElementSibling;\n if (nextElement) {\n const focusables = getFocusables(nextElement);\n if (focusables.length) {\n e.preventDefault();\n focusables[0].focus();\n }\n }\n }\n setArrowKey(null);\n }\n }}\n >\n {messages.map(item => {\n const messageProps = isCoachMessage(item)\n ? {\n ...item,\n onSend\n }\n : item;\n\n return <GenAIMessage {...messageProps} testId={item.id} />;\n })}\n </Flex>\n )}\n </>\n )}\n </Flex>\n\n {!starterMessage &&\n ((isInUtilities(variant) &&\n variant.state !== 'docked' &&\n variant.state !== 'minimized') \|\|\n !isInUtilities(variant)) && (\n <Flex container={{ direction: 'column' }} as={StyledInputContainer}>\n {guidedMode ? (\n <>\n {suggestions && messages.length > 0 && (\n <>\n {latestMessage && isCoachMessage(latestMessage) && latestMessage.loading ? (\n <Flex\n container={{\n gap: 1,\n justify: 'center',\n alignItems: 'center',\n pad: 1\n }}\n >\n {t('generating_response')}\n <Progress placement='inline' />\n </Flex>\n ) : (\n <Configuration\n theme={{\n components: {\n button: {\n color: theme.base.palette.ai,\n 'secondary-color': theme.base.palette.ai,\n 'secondary-fill-style': 'outline'\n }\n }\n }}\n >\n <MenuButton\n text={t('ask_coach', [selectedCoach ?? ''])}\n icon='polaris-solid'\n menu={{\n items: suggestions,\n onItemClick: id => {\n const selected = menuHelpers.getItem(suggestions, id);\n if (selected)\n onSend({\n id: selected.id,\n message: selected.primary\n });\n }\n }}\n />\n </Configuration>\n )}\n\n <StyledDisclaimerText>{t('ai_disclaimer')}</StyledDisclaimerText>\n </>\n )}\n </>\n ) : (\n <>\n <TextArea\n ref={textAreaRef}\n label={t('message_pega_gen_ai_coach', [selectedCoach ?? ''])}\n value={message}\n onKeyDown={handleEnterKeyDown}\n onChange={handleTextAreaChange}\n autoResize={false}\n />\n\n {latestMessage && isCoachMessage(latestMessage) && latestMessage.loading ? (\n <Flex\n container={{\n gap: 1,\n justify: 'end',\n alignItems: 'center',\n pad: 1\n }}\n >\n {t('generating_response')}\n <Progress placement='inline' />\n </Flex>\n ) : (\n <Flex\n container={{\n gap: 2,\n justify: 'end',\n pad: 1\n }}\n >\n {suggestions && (\n <MenuButton\n text={t('suggestions')}\n variant='text'\n icon='polaris-solid'\n as={StyledSuggestions}\n menu={{\n items: suggestions,\n onItemClick: id => {\n const selected = menuHelpers.getItem(suggestions, id);\n if (selected)\n onSend({\n id: selected.id,\n message: selected.primary\n });\n }\n }}\n />\n )}\n <Button\n variant='primary'\n onClick={\n message\n ? () => {\n onSend({\n id: createUID(),\n message\n });\n setMessage('');\n }\n : undefined\n }\n >\n {t('send')}\n </Button>\n </Flex>\n )}\n\n <StyledDisclaimerText>{t('ai_disclaimer')}</StyledDisclaimerText>\n </>\n )}\n </Flex>\n )}\n {!loading &&\n !error &&\n messages.length === 0 &&\n ((isInUtilities(variant) && variant.state === 'minimized') \|\| starterMessage) && (\n <StyledChatButton\n icon\n onClick={() => {\n if (isInUtilities(variant)) variant.onStateChange('maximized');\n if (starterMessage && starterMessage.message) {\n onSend({\n id: starterMessage.id,\n message: starterMessage.message\n });\n }\n }}\n >\n <Flex container={{ alignItems: 'center', gap: 1 }}>\n <Icon name='polaris-solid' />\n {t('start_chat')}\n </Flex>\n </StyledChatButton>\n )}\n </>\n )}\n </Flex>\n );\n};\n\nexport default withTestIds(GenAICoach, getGenAICoachTestIds);\n"]}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"GenAICoach.styles.d.ts","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAICoach.styles.ts"],"names":[],"mappings":";~~AAiBA~~,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAG1D,eAAO,MAAM,oBAAoB,wGAAc,CAAC;AAEhD,eAAO,MAAM,yBAAyB;aAC3B,eAAe,CAAC,SAAS,CAAC;oBACnB,eAAe,CAAC,gBAAgB,CAAC;SAwElD,CAAC;AAIF,eAAO,MAAM,sBAAsB;;uDAqBjC,CAAC;AAIH,eAAO,MAAM,iBAAiB;;uDAc5B,CAAC;AAIH,eAAO,MAAM,oBAAoB,mOAW/B,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAWnC,CAAC;AAIF,eAAO,MAAM,wBAAwB,yGAWpC,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAEhC,CAAC;AAEF,eAAO,MAAM,iBAAiB,qOAE7B,CAAC;AAIF,eAAO,MAAM,6BAA6B,yGAUzC,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAWhC,CAAC;AAIF,eAAO,MAAM,gBAAgB,qOAuB3B,CAAC;AAIH,eAAO,MAAM,gBAAgB,qOAa3B,CAAC;AAIH,eAAO,MAAM,0BAA0B,yGAUtC,CAAC;AAIF,eAAO,MAAM,eAAe,mOAK1B,CAAC;AAIH,eAAO,MAAM,aAAa,uGAQxB,CAAC;AAIH,eAAO,MAAM,sBAAsB,~~yGAcjC~~,CAAC;AAIH,eAAO,MAAM,kBAAkB,wGAkB9B,CAAC"}
1	+ {"version":3,"file":"GenAICoach.styles.d.ts","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAICoach.styles.ts"],"names":[],"mappings":";AAkBA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAG1D,eAAO,MAAM,oBAAoB,wGAAc,CAAC;AAEhD,eAAO,MAAM,yBAAyB;aAC3B,eAAe,CAAC,SAAS,CAAC;oBACnB,eAAe,CAAC,gBAAgB,CAAC;SAwElD,CAAC;AAIF,eAAO,MAAM,sBAAsB;;uDAqBjC,CAAC;AAIH,eAAO,MAAM,iBAAiB;;uDAc5B,CAAC;AAIH,eAAO,MAAM,oBAAoB,mOAW/B,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAWnC,CAAC;AAIF,eAAO,MAAM,wBAAwB,yGAWpC,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAEhC,CAAC;AAEF,eAAO,MAAM,iBAAiB,qOAE7B,CAAC;AAIF,eAAO,MAAM,6BAA6B,yGAUzC,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAWhC,CAAC;AAIF,eAAO,MAAM,gBAAgB,qOAuB3B,CAAC;AAIH,eAAO,MAAM,gBAAgB,qOAa3B,CAAC;AAIH,eAAO,MAAM,0BAA0B,yGAUtC,CAAC;AAIF,eAAO,MAAM,eAAe,mOAK1B,CAAC;AAIH,eAAO,MAAM,aAAa,uGAQxB,CAAC;AAIH,eAAO,MAAM,sBAAsB,yGAkBjC,CAAC;AAIH,eAAO,MAAM,kBAAkB,wGAkB9B,CAAC"}

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

@@ -1,6 +1,7 @@
 import styled, { css } from 'styled-components';
 import { useContext } from 'react';
 import { AppShellContext, Button, MenuButton, StyledIcon, StyledText, Text, calculateFontSize, defaultThemeProp, getHoverColors } from '@pega/cosmos-react-core';
+import { StyledCardContent } from '@pega/cosmos-react-core/lib/components/Card/CardContent';
 import { lineClamp } from '@pega/cosmos-react-core/lib/styles/mixins';
 import { StyledEditorContainer } from '@pega/cosmos-react-rte/lib/components/RichTextEditor/RichTextEditor.styles';
 import { isInUtilities } from './GenAICoach.utils';
@@ -197,6 +198,10 @@ export const StyledSuggestedMessage = styled.div(({ theme }) => {
     &:focus {
       border: 0.0625rem solid ${theme.base.palette.interactive};
     }
+    ${StyledCardContent} {
+      padding-inline: calc(2 * ${theme.base.spacing});
+      padding-block: calc(1.5 * ${theme.base.spacing});
+    }
   `;
 });
 StyledSuggestedMessage.defaultProps = defaultThemeProp;

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

	@@ -1 +1 @@
1	- {"version":3,"file":"GenAICoach.styles.js","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAICoach.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { useContext } from 'react';\n\nimport {\n AppShellContext,\n Button,\n MenuButton,\n StyledIcon,\n StyledText,\n Text,\n calculateFontSize,\n defaultThemeProp,\n getHoverColors\n} from '@pega/cosmos-react-core';\nimport { lineClamp } from '@pega/cosmos-react-core/lib/styles/mixins';\nimport { StyledEditorContainer } from '@pega/cosmos-react-rte/lib/components/RichTextEditor/RichTextEditor.styles';\n\nimport type { GenAICoachProps } from './GenAICoach.types';\nimport { isInUtilities } from './GenAICoach.utils';\n\nexport const StyledMessageWrapper = styled.li``;\n\nexport const StyledGenAICoachContainer = styled.div<{\n variant: GenAICoachProps['variant'];\n starterMessage: GenAICoachProps['starterMessage'];\n}>(\n ({\n theme: {\n base: { palette, 'z-index': zIndex, spacing, breakpoints },\n components: {\n card: { 'border-radius': borderRadius }\n }\n },\n variant,\n starterMessage\n }) => {\n const { previewActive } = useContext(AppShellContext);\n return css`\n background: ${palette['primary-background']};\n min-width: var(--utilities-drawer-min-width);\n border-radius: ${borderRadius};\n ${isInUtilities(variant) &&\n css`\n min-height: 3rem;\n max-width: 31.25rem;\n box-shadow: 0 -1rem 1rem ${palette['app-background']};\n position: fixed;\n inset-block-end: calc(2 * ${spacing});\n inset-inline-end: calc(2 * ${spacing});\n z-index: calc(${zIndex.drawer} + 1);\n width: 25rem;\n\n ${previewActive &&\n css`\n @media (min-width: ${breakpoints.xl}) {\n margin-inline-end: clamp(21.875rem, (100vw - 31.25rem) / 10 + 21.875rem, 31.25rem);\n }\n `}\n\n ${(variant.state === 'minimized' \|\| starterMessage) &&\n css`\n max-height: 20rem;\n height: 20rem;\n `}\n\n ${variant.state === 'docked' &&\n css`\n height: 3rem;\n `}\n\n\n &::after {\n content: '';\n height: calc(2 * ${spacing});\n width: 100%;\n background: ${palette['app-background']};\n position: fixed;\n inset-block-end: 0;\n z-index: calc(${zIndex.drawer} + 1);\n }\n `}\n\n /\n ~85% of Utilities height and fixed height if screen size less than md and devices with coarse pointer\n FIXME: This is a stopgap to address issue in Android web views via React Native where VH units do not work\n /\n ${!starterMessage &&\n ((isInUtilities(variant) && variant.state === 'maximized') \|\| !isInUtilities(variant)) &&\n css`\n height: calc(0.85 * var(--case-view-height, 95vh));\n @media (pointer: coarse) and (max-width: ${breakpoints.md}) {\n height: 40rem;\n }\n `}\n `;\n }\n);\n\nStyledGenAICoachContainer.defaultProps = defaultThemeProp;\n\nexport const StyledGenAIOptionsMenu = styled(MenuButton)(({\n theme: {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n 'font-weight': fontWeight,\n palette: { ai }\n }\n }\n}) => {\n const { l } = calculateFontSize(fontSize, fontScale);\n return css`\n color: inherit;\n ${StyledIcon}:first-child {\n color: ${ai};\n }\n ${StyledText} {\n font-weight: ${fontWeight['semi-bold']};\n font-size: ${l};\n }\n `;\n});\n\nStyledGenAIOptionsMenu.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestions = styled(MenuButton)(({\n theme: {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n palette: { ai }\n }\n }\n}) => {\n const { xxs: buttonFontSize } = calculateFontSize(fontSize, fontScale);\n return css`\n color: ${ai};\n font-size: ${buttonFontSize};\n `;\n});\n\nStyledSuggestions.defaultProps = defaultThemeProp;\n\nexport const StyledDisclaimerText = styled(Text)(({\n theme: {\n base: { 'font-size': fontSize, 'font-scale': fontScale, spacing }\n }\n}) => {\n const systemFontSize = calculateFontSize(fontSize, fontScale).xs;\n return css`\n font-size: ${systemFontSize};\n margin-block-start: calc(2 * ${spacing});\n opacity: 0.7;\n `;\n});\n\nStyledDisclaimerText.defaultProps = defaultThemeProp;\n\nexport const StyledMessagesContainer = styled.div(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n margin-block-end: calc(2 * ${spacing});\n overflow-y: auto;\n `;\n }\n);\n\nStyledMessagesContainer.defaultProps = defaultThemeProp;\n\nexport const StyledStarterMessageCard = styled.div(\n ({\n theme: {\n base: { palette, 'border-radius': borderRadius }\n }\n }) => {\n return css`\n border: 0.0625rem solid ${palette['border-line']};\n border-radius: calc(0.5 * ${borderRadius});\n `;\n }\n);\n\nStyledStarterMessageCard.defaultProps = defaultThemeProp;\n\nexport const StyledStarterMessage = styled.div`\n ${lineClamp(10)}\n`;\n\nexport const StyledCloseButton = styled(Button)`\n align-self: flex-start;\n`;\n\nStyledCloseButton.defaultProps = defaultThemeProp;\n\nexport const StyledInitialMessageContainer = styled.div(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n margin-block: calc(2 * ${spacing});\n `;\n }\n);\n\nStyledInitialMessageContainer.defaultProps = defaultThemeProp;\n\nexport const StyledInputContainer = styled.div(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n margin-block-end: calc(2 * ${spacing});\n margin-inline: calc(2 * ${spacing});\n `;\n }\n);\n\nStyledInputContainer.defaultProps = defaultThemeProp;\n\nexport const StyledChatButton = styled(Button)(({\n theme: {\n base: {\n palette: { ai, 'primary-background': primaryBackground },\n spacing\n }\n }\n}) => {\n const hoverColors = getHoverColors(ai);\n return css`\n background-color: ${ai};\n color: ${primaryBackground};\n border: none;\n margin: ${spacing};\n &:hover {\n background-color: ${hoverColors.background};\n color: ${hoverColors.foreground};\n border: none;\n }\n &:focus {\n border: none;\n }\n `;\n});\n\nStyledChatButton.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestion = styled(Button)(({\n theme: {\n base: { spacing }\n }\n}) => {\n return css`\n width: fit-content;\n & + & {\n margin-inline-start: 0;\n text-align: left;\n padding: ${spacing};\n }\n `;\n});\n\nStyledSuggestion.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestionsContainer = styled.div(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n margin-block-start: calc(1.5 * ${spacing});\n `;\n }\n);\n\nStyledSuggestionsContainer.defaultProps = defaultThemeProp;\n\nexport const StyledTimeStamp = styled(Text)(() => {\n return css`\n display: flex;\n align-items: center;\n `;\n});\n\nStyledTimeStamp.defaultProps = defaultThemeProp;\n\nexport const StyledMessage = styled.p(({ theme }) => {\n return css`\n margin-block-start: calc(0.5 * ${theme.base.spacing});\n overflow-wrap: break-word;\n ${StyledEditorContainer} {\n padding: 0;\n }\n `;\n});\n\nStyledMessage.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestedMessage = styled.div(({ theme }) => {\n return css`\n column-gap: calc(2 * ${theme.base.spacing});\n min-height: 2rem;\n text-align: left;\n border: 0.0625rem solid ${theme.base.palette['border-line']};\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n padding-inline-end: calc(2 * ${theme.base.spacing});\n cursor: pointer;\n &:hover,\n &:focus {\n border: 0.0625rem solid ${theme.base.palette.interactive};\n }\n `;\n});\n\nStyledSuggestedMessage.defaultProps = defaultThemeProp;\n\nexport const StyledMessagesList = styled.ul(\n ({\n theme: {\n base: { shadow, spacing }\n }\n }) => {\n return css`\n padding-block-start: ${spacing};\n list-style-type: none;\n & > li[type='message'] {\n &:focus-visible {\n outline: none;\n box-shadow: ${shadow.focus};\n }\n margin-block-end: ${spacing};\n }\n `;\n }\n);\n\nStyledMessagesList.defaultProps = defaultThemeProp;\n"]}
1	+ {"version":3,"file":"GenAICoach.styles.js","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAICoach.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { useContext } from 'react';\n\nimport {\n AppShellContext,\n Button,\n MenuButton,\n StyledIcon,\n StyledText,\n Text,\n calculateFontSize,\n defaultThemeProp,\n getHoverColors\n} from '@pega/cosmos-react-core';\nimport { StyledCardContent } from '@pega/cosmos-react-core/lib/components/Card/CardContent';\nimport { lineClamp } from '@pega/cosmos-react-core/lib/styles/mixins';\nimport { StyledEditorContainer } from '@pega/cosmos-react-rte/lib/components/RichTextEditor/RichTextEditor.styles';\n\nimport type { GenAICoachProps } from './GenAICoach.types';\nimport { isInUtilities } from './GenAICoach.utils';\n\nexport const StyledMessageWrapper = styled.li``;\n\nexport const StyledGenAICoachContainer = styled.div<{\n variant: GenAICoachProps['variant'];\n starterMessage: GenAICoachProps['starterMessage'];\n}>(\n ({\n theme: {\n base: { palette, 'z-index': zIndex, spacing, breakpoints },\n components: {\n card: { 'border-radius': borderRadius }\n }\n },\n variant,\n starterMessage\n }) => {\n const { previewActive } = useContext(AppShellContext);\n return css`\n background: ${palette['primary-background']};\n min-width: var(--utilities-drawer-min-width);\n border-radius: ${borderRadius};\n ${isInUtilities(variant) &&\n css`\n min-height: 3rem;\n max-width: 31.25rem;\n box-shadow: 0 -1rem 1rem ${palette['app-background']};\n position: fixed;\n inset-block-end: calc(2 * ${spacing});\n inset-inline-end: calc(2 * ${spacing});\n z-index: calc(${zIndex.drawer} + 1);\n width: 25rem;\n\n ${previewActive &&\n css`\n @media (min-width: ${breakpoints.xl}) {\n margin-inline-end: clamp(21.875rem, (100vw - 31.25rem) / 10 + 21.875rem, 31.25rem);\n }\n `}\n\n ${(variant.state === 'minimized' \|\| starterMessage) &&\n css`\n max-height: 20rem;\n height: 20rem;\n `}\n\n ${variant.state === 'docked' &&\n css`\n height: 3rem;\n `}\n\n\n &::after {\n content: '';\n height: calc(2 * ${spacing});\n width: 100%;\n background: ${palette['app-background']};\n position: fixed;\n inset-block-end: 0;\n z-index: calc(${zIndex.drawer} + 1);\n }\n `}\n\n /\n ~85% of Utilities height and fixed height if screen size less than md and devices with coarse pointer\n FIXME: This is a stopgap to address issue in Android web views via React Native where VH units do not work\n /\n ${!starterMessage &&\n ((isInUtilities(variant) && variant.state === 'maximized') \|\| !isInUtilities(variant)) &&\n css`\n height: calc(0.85 * var(--case-view-height, 95vh));\n @media (pointer: coarse) and (max-width: ${breakpoints.md}) {\n height: 40rem;\n }\n `}\n `;\n }\n);\n\nStyledGenAICoachContainer.defaultProps = defaultThemeProp;\n\nexport const StyledGenAIOptionsMenu = styled(MenuButton)(({\n theme: {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n 'font-weight': fontWeight,\n palette: { ai }\n }\n }\n}) => {\n const { l } = calculateFontSize(fontSize, fontScale);\n return css`\n color: inherit;\n ${StyledIcon}:first-child {\n color: ${ai};\n }\n ${StyledText} {\n font-weight: ${fontWeight['semi-bold']};\n font-size: ${l};\n }\n `;\n});\n\nStyledGenAIOptionsMenu.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestions = styled(MenuButton)(({\n theme: {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n palette: { ai }\n }\n }\n}) => {\n const { xxs: buttonFontSize } = calculateFontSize(fontSize, fontScale);\n return css`\n color: ${ai};\n font-size: ${buttonFontSize};\n `;\n});\n\nStyledSuggestions.defaultProps = defaultThemeProp;\n\nexport const StyledDisclaimerText = styled(Text)(({\n theme: {\n base: { 'font-size': fontSize, 'font-scale': fontScale, spacing }\n }\n}) => {\n const systemFontSize = calculateFontSize(fontSize, fontScale).xs;\n return css`\n font-size: ${systemFontSize};\n margin-block-start: calc(2 * ${spacing});\n opacity: 0.7;\n `;\n});\n\nStyledDisclaimerText.defaultProps = defaultThemeProp;\n\nexport const StyledMessagesContainer = styled.div(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n margin-block-end: calc(2 * ${spacing});\n overflow-y: auto;\n `;\n }\n);\n\nStyledMessagesContainer.defaultProps = defaultThemeProp;\n\nexport const StyledStarterMessageCard = styled.div(\n ({\n theme: {\n base: { palette, 'border-radius': borderRadius }\n }\n }) => {\n return css`\n border: 0.0625rem solid ${palette['border-line']};\n border-radius: calc(0.5 * ${borderRadius});\n `;\n }\n);\n\nStyledStarterMessageCard.defaultProps = defaultThemeProp;\n\nexport const StyledStarterMessage = styled.div`\n ${lineClamp(10)}\n`;\n\nexport const StyledCloseButton = styled(Button)`\n align-self: flex-start;\n`;\n\nStyledCloseButton.defaultProps = defaultThemeProp;\n\nexport const StyledInitialMessageContainer = styled.div(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n margin-block: calc(2 * ${spacing});\n `;\n }\n);\n\nStyledInitialMessageContainer.defaultProps = defaultThemeProp;\n\nexport const StyledInputContainer = styled.div(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n margin-block-end: calc(2 * ${spacing});\n margin-inline: calc(2 * ${spacing});\n `;\n }\n);\n\nStyledInputContainer.defaultProps = defaultThemeProp;\n\nexport const StyledChatButton = styled(Button)(({\n theme: {\n base: {\n palette: { ai, 'primary-background': primaryBackground },\n spacing\n }\n }\n}) => {\n const hoverColors = getHoverColors(ai);\n return css`\n background-color: ${ai};\n color: ${primaryBackground};\n border: none;\n margin: ${spacing};\n &:hover {\n background-color: ${hoverColors.background};\n color: ${hoverColors.foreground};\n border: none;\n }\n &:focus {\n border: none;\n }\n `;\n});\n\nStyledChatButton.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestion = styled(Button)(({\n theme: {\n base: { spacing }\n }\n}) => {\n return css`\n width: fit-content;\n & + & {\n margin-inline-start: 0;\n text-align: left;\n padding: ${spacing};\n }\n `;\n});\n\nStyledSuggestion.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestionsContainer = styled.div(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n margin-block-start: calc(1.5 * ${spacing});\n `;\n }\n);\n\nStyledSuggestionsContainer.defaultProps = defaultThemeProp;\n\nexport const StyledTimeStamp = styled(Text)(() => {\n return css`\n display: flex;\n align-items: center;\n `;\n});\n\nStyledTimeStamp.defaultProps = defaultThemeProp;\n\nexport const StyledMessage = styled.p(({ theme }) => {\n return css`\n margin-block-start: calc(0.5 * ${theme.base.spacing});\n overflow-wrap: break-word;\n ${StyledEditorContainer} {\n padding: 0;\n }\n `;\n});\n\nStyledMessage.defaultProps = defaultThemeProp;\n\nexport const StyledSuggestedMessage = styled.div(({ theme }) => {\n return css`\n column-gap: calc(2 * ${theme.base.spacing});\n min-height: 2rem;\n text-align: left;\n border: 0.0625rem solid ${theme.base.palette['border-line']};\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n padding-inline-end: calc(2 * ${theme.base.spacing});\n cursor: pointer;\n &:hover,\n &:focus {\n border: 0.0625rem solid ${theme.base.palette.interactive};\n }\n ${StyledCardContent} {\n padding-inline: calc(2 * ${theme.base.spacing});\n padding-block: calc(1.5 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledSuggestedMessage.defaultProps = defaultThemeProp;\n\nexport const StyledMessagesList = styled.ul(\n ({\n theme: {\n base: { shadow, spacing }\n }\n }) => {\n return css`\n padding-block-start: ${spacing};\n list-style-type: none;\n & > li[type='message'] {\n &:focus-visible {\n outline: none;\n box-shadow: ${shadow.focus};\n }\n margin-block-end: ${spacing};\n }\n `;\n }\n);\n\nStyledMessagesList.defaultProps = defaultThemeProp;\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":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAA+B,MAAM,OAAO,CAAC;~~AAqB5E~~,OAAO,KAAK,EAAE,YAAY,EAAgB,MAAM,yBAAyB,CAAC;AAG1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;~~AAclD~~,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAkMxD,CAAC;AAEH,eAAe,MAAM,CAAC"}
1	+ {"version":3,"file":"Stages.d.ts","sourceRoot":"","sources":["../../../src/components/Stages/Stages.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAA+B,MAAM,OAAO,CAAC;AAoB5E,OAAO,KAAK,EAAE,YAAY,EAAgB,MAAM,yBAAyB,CAAC;AAG1E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAelD,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAkMxD,CAAC;AAEH,eAAe,MAAM,CAAC"}

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

@@ -1,10 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState, useRef, useEffect, forwardRef, Fragment } from 'react';
 import { remToPx } from 'polished';
-import { Icon, Text, registerIcon, Flex, useI18n, Button, Modal, useBreakpoint, debounce, useModalManager, useConsolidatedRef, useUID, InfoDialog, useArrows, useAfterInitialEffect, VisuallyHiddenText } from '@pega/cosmos-react-core';
+import { Icon, registerIcon, Flex, useI18n, Button, Modal, useBreakpoint, debounce, useModalManager, useConsolidatedRef, useUID, InfoDialog, useArrows, useAfterInitialEffect, VisuallyHiddenText } from '@pega/cosmos-react-core';
 import * as checkIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/check.icon';
 import StageGlimpse from './StageGlimpse';
-import { StyledInnerStage, StyledStageCompleteIcon, StyledStage, StyledStageContainer, StyledStageGlimpse, StyledStages, StyledStagesDescription } from './Stages.styles';
+import { StyledInnerStage, StyledStageCompleteIcon, StyledStage, StyledStageContainer, StyledStageGlimpse, StyledStages, StyledStagesDescription, StyledStageText } from './Stages.styles';
 registerIcon(checkIcon);
 const Stages = forwardRef(function Stages({ current, stages, caseTitle, onLoadStage, ...restProps }, ref) {
     const t = useI18n();
@@ -64,7 +64,7 @@ const Stages = forwardRef(function Stages({ current, stages, caseTitle, onLoadSt
                 ? t('stages_case_lifecycle', [caseTitle])
                 : t('stages_default_case_lifecycle'),
             progress: stagesToLoad.length > 0,
-            children: stages.map(stage => (_jsxs(Fragment, { children: [_jsxs(Flex, { container: { alignItems: 'start', gap: 0.5 }, children: [stage.completed && _jsx(StyledStageCompleteIcon, { name: 'check' }), _jsxs(Text, { variant: 'h2', children: [stage.name, stage.completed && _jsx(VisuallyHiddenText, { children: `- ${t('completed')}` })] })] }), _jsx(StageGlimpse, { stage: stage })] }, stage.id))),
+            children: stages.map(stage => (_jsxs(Fragment, { children: [_jsxs(Flex, { container: { alignItems: 'start', gap: 0.5 }, children: [stage.completed && _jsx(StyledStageCompleteIcon, { name: 'check' }), _jsxs(StyledStageText, { variant: 'h2', isCurrent: stage.id === current, children: [stage.name, stage.completed && _jsx(VisuallyHiddenText, { children: `- ${t('completed')}` })] })] }), _jsx(StageGlimpse, { stage: stage })] }, stage.id))),
             onBeforeClose: () => {
                 setShowModal(false);
                 target?.focus();
@@ -76,7 +76,7 @@ const Stages = forwardRef(function Stages({ current, stages, caseTitle, onLoadSt
     useAfterInitialEffect(() => {
         modalMethods.current?.update({
             progress: stagesToLoad.length > 0,
-            children: stages.map(stage => (_jsxs(Fragment, { children: [_jsxs(Flex, { container: { alignItems: 'start', gap: 0.5 }, children: [stage.completed && _jsx(StyledStageCompleteIcon, { name: 'check' }), _jsxs(Text, { variant: 'h2', children: [stage.name, stage.completed && _jsx(VisuallyHiddenText, { children: `- ${t('completed')}` })] })] }), _jsx(StageGlimpse, { stage: stage })] }, stage.id)))
+            children: stages.map(stage => (_jsxs(Fragment, { children: [_jsxs(Flex, { container: { alignItems: 'start', gap: 0.5 }, children: [stage.completed && _jsx(StyledStageCompleteIcon, { name: 'check' }), _jsxs(StyledStageText, { variant: 'h2', isCurrent: stage.id === current, children: [stage.name, stage.completed && _jsx(VisuallyHiddenText, { children: `- ${t('completed')}` })] })] }), _jsx(StageGlimpse, { stage: stage })] }, stage.id)))
         });
     }, [stagesToLoad.length]);
     return (_jsxs(_Fragment, { children: [_jsx(Flex, { ...restProps, container: true, as: StyledStages, ref: stagesRef, "aria-orientation": 'horizontal', "aria-label": t('stages_label'), "aria-describedby": descriptionId, children: stages.map((stage, index) => {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Stages.js","sourceRoot":"","sources":["../../../src/components/Stages/Stages.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useRef, useEffect, forwardRef, Fragment } from 'react';\nimport type { FunctionComponent, MouseEvent, PropsWithoutRef } from 'react';\nimport { remToPx } from 'polished';\n\nimport {\n Icon,\n Text,\n registerIcon,\n Flex,\n useI18n,\n Button,\n Modal,\n useBreakpoint,\n debounce,\n useModalManager,\n useConsolidatedRef,\n useUID,\n InfoDialog,\n useArrows,\n useAfterInitialEffect,\n VisuallyHiddenText\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps, ModalMethods } from '@pega/cosmos-react-core';\nimport * as checkIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/check.icon';\n\nimport type { StagesProps } from './Stages.types';\nimport StageGlimpse from './StageGlimpse';\nimport {\n StyledInnerStage,\n StyledStageCompleteIcon,\n StyledStage,\n StyledStageContainer,\n StyledStageGlimpse,\n StyledStages,\n StyledStagesDescription\n} from './Stages.styles';\n\nregisterIcon(checkIcon);\n\nconst Stages: FunctionComponent<StagesProps & ForwardProps> = forwardRef(function Stages(\n { current, stages, caseTitle, onLoadStage, ...restProps }: PropsWithoutRef<StagesProps>,\n ref: StagesProps['ref']\n) {\n const t = useI18n();\n\n const stagesRef = useConsolidatedRef(ref);\n const stagesRefs = useRef<HTMLButtonElement[]>([]);\n\n const [target, setTarget] = useState<HTMLButtonElement \| null>(null);\n\n const { create: createModal } = useModalManager();\n const modalMethods = useRef<ModalMethods>();\n const [showModal, setShowModal] = useState(false);\n\n const isSmallOrAbove = useBreakpoint('sm');\n const [compressedView, setCompressedView] = useState(false);\n const [minExpandedWidth, setMinExpandedWidth] = useState(0);\n\n useArrows(stagesRef, {\n selector: ':scope > li > button:not([aria-expanded])',\n dir: 'left-right',\n initialFocusElement: stagesRefs.current.find(stage => stage.ariaCurrent)\n });\n\n const dialogId = useUID();\n const descriptionId = useUID();\n\n useEffect(() => {\n if (stagesRef.current) {\n if (compressedView) {\n const resizeObserver = new ResizeObserver(\n debounce((entries: ResizeObserverEntry[]) => {\n if (entries[0].contentRect.width > minExpandedWidth) {\n setCompressedView(false);\n }\n }, 100)\n );\n resizeObserver.observe(stagesRef.current);\n return () => resizeObserver.disconnect();\n }\n\n const intersectionObserver = new IntersectionObserver(\n entries => {\n if (!entries[0].isIntersecting) {\n setCompressedView(true);\n if (entries[0].rootBounds) setMinExpandedWidth(entries[0].rootBounds.width);\n }\n },\n {\n root: stagesRef.current,\n rootMargin: remToPx(0.0625),\n threshold: 1\n }\n );\n\n if (stagesRef.current.lastElementChild) {\n intersectionObserver.observe(stagesRef.current.lastElementChild);\n return () => intersectionObserver.disconnect();\n }\n }\n }, [minExpandedWidth, compressedView, stages.length]);\n\n const stagesToLoad = onLoadStage\n ? stages.filter(stage => !Array.isArray(stage.steps)).map(stage => stage.id)\n : [];\n\n const openModal = () => {\n setShowModal(true);\n if (stagesToLoad.length > 0) onLoadStage?.(stagesToLoad);\n modalMethods.current = createModal(Modal, {\n heading: caseTitle\n ? t('stages_case_lifecycle', [caseTitle])\n : t('stages_default_case_lifecycle'),\n progress: stagesToLoad.length > 0,\n children: stages.map(stage => (\n <Fragment key={stage.id}>\n <Flex container={{ alignItems: 'start', gap: 0.5 }}>\n {stage.completed && <StyledStageCompleteIcon name='check' />}\n <Text variant='h2'>\n {stage.name}\n {stage.completed && <VisuallyHiddenText>{`- ${t('completed')}`}</VisuallyHiddenText>}\n </Text>\n </Flex>\n <StageGlimpse stage={stage} />\n </Fragment>\n )),\n onBeforeClose: () => {\n setShowModal(false);\n target?.focus();\n setTarget(null);\n modalMethods.current = undefined;\n }\n });\n };\n\n useAfterInitialEffect(() => {\n modalMethods.current?.update({\n progress: stagesToLoad.length > 0,\n children: stages.map(stage => (\n <Fragment key={stage.id}>\n <Flex container={{ alignItems: 'start', gap: 0.5 }}>\n {stage.completed && <StyledStageCompleteIcon name='check' />}\n <Text variant='h2'>\n {stage.name}\n {stage.completed && <VisuallyHiddenText>{`- ${t('completed')}`}</VisuallyHiddenText>}\n </Text>\n </Flex>\n <StageGlimpse stage={stage} />\n </Fragment>\n ))\n });\n }, [stagesToLoad.length]);\n\n return (\n <>\n <Flex\n {...restProps}\n container\n as={StyledStages}\n ref={stagesRef}\n aria-orientation='horizontal'\n aria-label={t('stages_label')}\n aria-describedby={descriptionId}\n >\n {stages.map((stage, index) => {\n const isCurrent = stage.id === current;\n let stageStatusText = t(stage.completed ? 'completed' : 'not_started');\n if (isCurrent) stageStatusText = t('current');\n const hasToLoad = stagesToLoad.includes(stage.id);\n return (\n <Fragment key={stage.id}>\n <Flex as={StyledStageContainer} item={{ grow: 1, shrink: 0 }}>\n <Flex\n container={{ justify: 'center', alignItems: 'center' }}\n as={StyledStage}\n item={{\n grow: compressedView && !isCurrent ? 0 : 1,\n shrink: compressedView && isCurrent ? 1 : 0\n }}\n aria-current={isCurrent ? 'step' : undefined}\n aria-label={t('stages_stage_label', [stage.name, stageStatusText])}\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n if (isSmallOrAbove) {\n if (hasToLoad) onLoadStage?.([stage.id]);\n setTarget(e.currentTarget);\n } else {\n openModal();\n }\n }}\n ref={(el: HTMLButtonElement) => {\n stagesRefs.current[index] = el;\n }}\n aria-expanded={target && isSmallOrAbove}\n aria-controls={target ? dialogId : undefined}\n aria-haspopup\n >\n {stage.completed && <Icon name='check' />}\n {(!compressedView \|\| isCurrent \|\| !stage.completed) && (\n <StyledInnerStage ellipsis={isCurrent && compressedView}>\n {!isCurrent && compressedView ? index + 1 : stage.name}\n </StyledInnerStage>\n )}\n </Flex>\n </Flex>\n {target && stagesRefs.current[index] === target && isSmallOrAbove && !showModal && (\n <InfoDialog\n heading={stage.name}\n target={target}\n progress={hasToLoad ? t('loading') : undefined}\n onDismiss={() => {\n setTarget(null);\n }}\n placement='bottom-start'\n >\n {!hasToLoad && (\n <StyledStageGlimpse>\n <StageGlimpse stage={stage} />\n <Button variant='secondary' onClick={openModal}>\n {t('stages_see_full_lifecycle')}\n </Button>\n </StyledStageGlimpse>\n )}\n </InfoDialog>\n )}\n </Fragment>\n );\n })}\n </Flex>\n <StyledStagesDescription id={descriptionId}>\n {t('stages_description')}\n </StyledStagesDescription>\n </>\n );\n});\n\nexport default Stages;\n"]}
1	+ {"version":3,"file":"Stages.js","sourceRoot":"","sources":["../../../src/components/Stages/Stages.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useRef, useEffect, forwardRef, Fragment } from 'react';\nimport type { FunctionComponent, MouseEvent, PropsWithoutRef } from 'react';\nimport { remToPx } from 'polished';\n\nimport {\n Icon,\n registerIcon,\n Flex,\n useI18n,\n Button,\n Modal,\n useBreakpoint,\n debounce,\n useModalManager,\n useConsolidatedRef,\n useUID,\n InfoDialog,\n useArrows,\n useAfterInitialEffect,\n VisuallyHiddenText\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps, ModalMethods } from '@pega/cosmos-react-core';\nimport * as checkIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/check.icon';\n\nimport type { StagesProps } from './Stages.types';\nimport StageGlimpse from './StageGlimpse';\nimport {\n StyledInnerStage,\n StyledStageCompleteIcon,\n StyledStage,\n StyledStageContainer,\n StyledStageGlimpse,\n StyledStages,\n StyledStagesDescription,\n StyledStageText\n} from './Stages.styles';\n\nregisterIcon(checkIcon);\n\nconst Stages: FunctionComponent<StagesProps & ForwardProps> = forwardRef(function Stages(\n { current, stages, caseTitle, onLoadStage, ...restProps }: PropsWithoutRef<StagesProps>,\n ref: StagesProps['ref']\n) {\n const t = useI18n();\n\n const stagesRef = useConsolidatedRef(ref);\n const stagesRefs = useRef<HTMLButtonElement[]>([]);\n\n const [target, setTarget] = useState<HTMLButtonElement \| null>(null);\n\n const { create: createModal } = useModalManager();\n const modalMethods = useRef<ModalMethods>();\n const [showModal, setShowModal] = useState(false);\n\n const isSmallOrAbove = useBreakpoint('sm');\n const [compressedView, setCompressedView] = useState(false);\n const [minExpandedWidth, setMinExpandedWidth] = useState(0);\n\n useArrows(stagesRef, {\n selector: ':scope > li > button:not([aria-expanded])',\n dir: 'left-right',\n initialFocusElement: stagesRefs.current.find(stage => stage.ariaCurrent)\n });\n\n const dialogId = useUID();\n const descriptionId = useUID();\n\n useEffect(() => {\n if (stagesRef.current) {\n if (compressedView) {\n const resizeObserver = new ResizeObserver(\n debounce((entries: ResizeObserverEntry[]) => {\n if (entries[0].contentRect.width > minExpandedWidth) {\n setCompressedView(false);\n }\n }, 100)\n );\n resizeObserver.observe(stagesRef.current);\n return () => resizeObserver.disconnect();\n }\n\n const intersectionObserver = new IntersectionObserver(\n entries => {\n if (!entries[0].isIntersecting) {\n setCompressedView(true);\n if (entries[0].rootBounds) setMinExpandedWidth(entries[0].rootBounds.width);\n }\n },\n {\n root: stagesRef.current,\n rootMargin: remToPx(0.0625),\n threshold: 1\n }\n );\n\n if (stagesRef.current.lastElementChild) {\n intersectionObserver.observe(stagesRef.current.lastElementChild);\n return () => intersectionObserver.disconnect();\n }\n }\n }, [minExpandedWidth, compressedView, stages.length]);\n\n const stagesToLoad = onLoadStage\n ? stages.filter(stage => !Array.isArray(stage.steps)).map(stage => stage.id)\n : [];\n\n const openModal = () => {\n setShowModal(true);\n if (stagesToLoad.length > 0) onLoadStage?.(stagesToLoad);\n modalMethods.current = createModal(Modal, {\n heading: caseTitle\n ? t('stages_case_lifecycle', [caseTitle])\n : t('stages_default_case_lifecycle'),\n progress: stagesToLoad.length > 0,\n children: stages.map(stage => (\n <Fragment key={stage.id}>\n <Flex container={{ alignItems: 'start', gap: 0.5 }}>\n {stage.completed && <StyledStageCompleteIcon name='check' />}\n <StyledStageText variant='h2' isCurrent={stage.id === current}>\n {stage.name}\n {stage.completed && <VisuallyHiddenText>{`- ${t('completed')}`}</VisuallyHiddenText>}\n </StyledStageText>\n </Flex>\n <StageGlimpse stage={stage} />\n </Fragment>\n )),\n onBeforeClose: () => {\n setShowModal(false);\n target?.focus();\n setTarget(null);\n modalMethods.current = undefined;\n }\n });\n };\n\n useAfterInitialEffect(() => {\n modalMethods.current?.update({\n progress: stagesToLoad.length > 0,\n children: stages.map(stage => (\n <Fragment key={stage.id}>\n <Flex container={{ alignItems: 'start', gap: 0.5 }}>\n {stage.completed && <StyledStageCompleteIcon name='check' />}\n <StyledStageText variant='h2' isCurrent={stage.id === current}>\n {stage.name}\n {stage.completed && <VisuallyHiddenText>{`- ${t('completed')}`}</VisuallyHiddenText>}\n </StyledStageText>\n </Flex>\n <StageGlimpse stage={stage} />\n </Fragment>\n ))\n });\n }, [stagesToLoad.length]);\n\n return (\n <>\n <Flex\n {...restProps}\n container\n as={StyledStages}\n ref={stagesRef}\n aria-orientation='horizontal'\n aria-label={t('stages_label')}\n aria-describedby={descriptionId}\n >\n {stages.map((stage, index) => {\n const isCurrent = stage.id === current;\n let stageStatusText = t(stage.completed ? 'completed' : 'not_started');\n if (isCurrent) stageStatusText = t('current');\n const hasToLoad = stagesToLoad.includes(stage.id);\n return (\n <Fragment key={stage.id}>\n <Flex as={StyledStageContainer} item={{ grow: 1, shrink: 0 }}>\n <Flex\n container={{ justify: 'center', alignItems: 'center' }}\n as={StyledStage}\n item={{\n grow: compressedView && !isCurrent ? 0 : 1,\n shrink: compressedView && isCurrent ? 1 : 0\n }}\n aria-current={isCurrent ? 'step' : undefined}\n aria-label={t('stages_stage_label', [stage.name, stageStatusText])}\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n if (isSmallOrAbove) {\n if (hasToLoad) onLoadStage?.([stage.id]);\n setTarget(e.currentTarget);\n } else {\n openModal();\n }\n }}\n ref={(el: HTMLButtonElement) => {\n stagesRefs.current[index] = el;\n }}\n aria-expanded={target && isSmallOrAbove}\n aria-controls={target ? dialogId : undefined}\n aria-haspopup\n >\n {stage.completed && <Icon name='check' />}\n {(!compressedView \|\| isCurrent \|\| !stage.completed) && (\n <StyledInnerStage ellipsis={isCurrent && compressedView}>\n {!isCurrent && compressedView ? index + 1 : stage.name}\n </StyledInnerStage>\n )}\n </Flex>\n </Flex>\n {target && stagesRefs.current[index] === target && isSmallOrAbove && !showModal && (\n <InfoDialog\n heading={stage.name}\n target={target}\n progress={hasToLoad ? t('loading') : undefined}\n onDismiss={() => {\n setTarget(null);\n }}\n placement='bottom-start'\n >\n {!hasToLoad && (\n <StyledStageGlimpse>\n <StageGlimpse stage={stage} />\n <Button variant='secondary' onClick={openModal}>\n {t('stages_see_full_lifecycle')}\n </Button>\n </StyledStageGlimpse>\n )}\n </InfoDialog>\n )}\n </Fragment>\n );\n })}\n </Flex>\n <StyledStagesDescription id={descriptionId}>\n {t('stages_description')}\n </StyledStagesDescription>\n </>\n );\n});\n\nexport default Stages;\n"]}

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

@@ -5,6 +5,9 @@ export declare const StyledInnerStage: import("styled-components").StyledCompone
 }, never>;
 export declare const StyledStage: import("styled-components").StyledComponent<"button", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledStageCompleteIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@pega/cosmos-react-core").IconProps>, import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledStageText: import("styled-components").StyledComponent<import("react").FunctionComponent<import("@pega/cosmos-react-core").TextProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {
+    isCurrent?: boolean | undefined;
+}, never>;
 export declare const StyledStageContainer: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledStepsContainer: import("styled-components").StyledComponent<"ol", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledStep: import("styled-components").StyledComponent<"li", import("styled-components").DefaultTheme, {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Stages.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Stages/Stages.styles.ts"],"names":[],"mappings":";~~AAaA~~,eAAO,MAAM,YAAY,wGAYvB,CAAC;AAIH,eAAO,MAAM,gBAAgB;;SAW3B,CAAC;AAEH,eAAO,MAAM,WAAW,4GAgJvB,CAAC;AAIF,eAAO,MAAM,uBAAuB,0LAQlC,CAAC;~~AAIH~~,eAAO,MAAM,oBAAoB,wGAoDhC,CAAC;AAIF,eAAO,MAAM,oBAAoB,wGAS/B,CAAC;AAIH,eAAO,MAAM,UAAU;eAA0B,OAAO;SAyBtD,CAAC;AAIH,eAAO,MAAM,qBAAqB,8OAMhC,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAI7B,CAAC;AAIH,eAAO,MAAM,uBAAuB,uGAEnC,CAAC"}
1	+ {"version":3,"file":"Stages.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Stages/Stages.styles.ts"],"names":[],"mappings":";AAcA,eAAO,MAAM,YAAY,wGAYvB,CAAC;AAIH,eAAO,MAAM,gBAAgB;;SAW3B,CAAC;AAEH,eAAO,MAAM,WAAW,4GAgJvB,CAAC;AAIF,eAAO,MAAM,uBAAuB,0LAQlC,CAAC;AAEH,eAAO,MAAM,eAAe;;SAI3B,CAAC;AAMF,eAAO,MAAM,oBAAoB,wGAoDhC,CAAC;AAIF,eAAO,MAAM,oBAAoB,wGAS/B,CAAC;AAIH,eAAO,MAAM,UAAU;eAA0B,OAAO;SAyBtD,CAAC;AAIH,eAAO,MAAM,qBAAqB,8OAMhC,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAI7B,CAAC;AAIH,eAAO,MAAM,uBAAuB,uGAEnC,CAAC"}

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

@@ -1,6 +1,6 @@
 import styled, { css } from 'styled-components';
 import { rgba } from 'polished';
-import { calculateFontSize, DateTimeDisplay, defaultThemeProp, Icon, StyledIcon, tryCatch, useDirection } from '@pega/cosmos-react-core';
+import { calculateFontSize, DateTimeDisplay, defaultThemeProp, Icon, Text, StyledIcon, tryCatch, useDirection } from '@pega/cosmos-react-core';
 export const StyledStages = styled.ol(({ theme }) => {
     return css `
     background-color: ${theme.base.palette['primary-background']};
@@ -27,7 +27,7 @@ export const StyledInnerStage = styled.span(props => {
     `}
   `;
 });
-export const StyledStage = styled.button(({ theme: { base: { spacing, palette, 'hit-area': hitArea, transparency } } }) => {
+export const StyledStage = styled.button(({ theme: { base: { spacing, palette, 'hit-area': hitArea, transparency, 'font-weight': fontWeight } } }) => {
     const thinBorderWidth = '0.0625rem';
     const thickBorderWidth = '0.125rem';
     const { rtl } = useDirection();
@@ -132,7 +132,7 @@ export const StyledStage = styled.button(({ theme: { base: { spacing, palette, '
       &[aria-current] {
         ${StyledInnerStage} {
-          font-weight: bold;
+          font-weight: ${fontWeight.bold};
           opacity: 1;
         }
@@ -171,6 +171,10 @@ export const StyledStageCompleteIcon = styled(Icon)(({ theme: { base: { palette
     color: ${palette.success};
   `;
 });
+export const StyledStageText = styled(Text)(({ theme, isCurrent }) => css `
+    font-weight: ${isCurrent ? theme.base['font-weight'].bold : theme.base['font-weight'].normal};
+  `);
+StyledStageText.defaultProps = defaultThemeProp;
 StyledStageCompleteIcon.defaultProps = defaultThemeProp;
 export const StyledStageContainer = styled.li(({ theme: { base: { spacing, 'border-radius': borderRadius } } }) => {
     const thinBorderWidth = '0.0625rem';

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Stages.styles.js","sourceRoot":"","sources":["../../../src/components/Stages/Stages.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { rgba } from 'polished';\n\nimport {\n calculateFontSize,\n DateTimeDisplay,\n defaultThemeProp,\n Icon,\n StyledIcon,\n tryCatch,\n useDirection\n} from '@pega/cosmos-react-core';\n\nexport const StyledStages = styled.ol(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['primary-background']};\n border-radius: ${theme.base['border-radius']};\n width: 100%;\n overflow: hidden;\n list-style: none;\n\n &:has(:focus-visible) {\n box-shadow: ${theme.base.shadow['focus-group']};\n }\n `;\n});\n\nStyledStages.defaultProps = defaultThemeProp;\n\nexport const StyledInnerStage = styled.span<{ ellipsis?: boolean }>(props => {\n return css`\n display: inline-block;\n text-align: center;\n white-space: nowrap;\n ${props.ellipsis &&\n css`\n overflow: hidden;\n text-overflow: ellipsis;\n `}\n `;\n});\n\nexport const StyledStage = styled.button(\n ({\n theme: {\n base: { spacing, palette, 'hit-area': hitArea, transparency }\n }\n }) => {\n const thinBorderWidth = '0.0625rem';\n const thickBorderWidth = '0.125rem';\n const { rtl } = useDirection();\n const borderShadow = tryCatch(() => rgba(palette['border-line'], 1));\n\n return css`\n background-color: inherit;\n color: ${palette['foreground-color']};\n outline: none;\n border-color: transparent;\n border-width: ${thinBorderWidth} 0;\n border-style: solid;\n position: relative;\n height: calc(4 * ${spacing});\n padding-inline-start: calc(2 * ${spacing});\n padding-inline-end: ${spacing};\n width: 100%;\n\n ::before,\n ::after {\n content: '';\n position: absolute;\n display: block;\n width: calc(2.25 * ${spacing});\n height: calc(2.25 * ${spacing});\n border-style: solid;\n border-color: ${palette['border-line']};\n border-inline-end-width: ${thinBorderWidth};\n border-inline-start-width: 0;\n border-top-width: ${rtl ? 0 : thinBorderWidth};\n border-bottom-width: ${rtl ? thinBorderWidth : 0};\n transform: rotateZ(45deg) skew(15deg, 15deg);\n\n @media (pointer: coarse) {\n width: calc(2.875 * ${spacing});\n height: calc(2.875 * ${spacing});\n transform: rotateZ(45deg) skew(20deg, 20deg);\n }\n }\n\n ::before {\n inset-inline-start: calc(-1.125 * ${spacing});\n\n @media (pointer: coarse) {\n inset-inline-start: calc(-1.375 * ${spacing});\n }\n }\n\n ::after {\n inset-inline-end: calc(-1.125 * ${spacing});\n z-index: 1;\n\n @media (pointer: coarse) {\n inset-inline-end: calc(-1.375 * ${spacing});\n }\n }\n\n &:hover,\n &:hover::before,\n &:hover::after {\n border-color: ${palette['border-line']};\n }\n\n &:focus,\n &:active,\n &:focus::before,\n &:active::before,\n &:focus::after,\n &:active::after {\n border-color: ${palette.interactive};\n }\n\n &:focus {\n border-width: ${thickBorderWidth} 0;\n }\n\n &:focus::before,\n &:focus::after {\n z-index: 1;\n border-inline-end-width: ${thickBorderWidth};\n border-top-width: ${rtl ? 0 : thickBorderWidth};\n border-bottom-width: ${rtl ? thickBorderWidth : 0};\n }\n\n &:focus::before {\n pointer-events: none;\n }\n\n &:active {\n border-width: ${thinBorderWidth} 0;\n\n ${StyledInnerStage} {\n opacity: ${transparency['transparent-3']};\n }\n }\n\n &:active::before,\n &:active::after {\n border-inline-end-width: ${thinBorderWidth};\n border-top-width: ${rtl ? 0 : thinBorderWidth};\n border-bottom-width: ${rtl ? thinBorderWidth : 0};\n }\n\n &[aria-current] {\n ${StyledInnerStage} {\n font-weight: bold;\n opacity: 1;\n }\n\n :hover {\n ${StyledInnerStage} {\n opacity: ${transparency['transparent-2']};\n }\n }\n\n ::after {\n filter: drop-shadow(0.0625rem -0.0625rem 0.125rem ${borderShadow});\n }\n }\n\n @media (pointer: coarse) {\n height: ${hitArea['finger-min']};\n padding-inline-start: calc(2.25 * ${spacing});\n }\n\n ${StyledIcon} {\n color: ${palette.success};\n\n & ~ ${StyledInnerStage} {\n margin-inline-start: 0.25rem;\n }\n }\n\n ${StyledInnerStage} {\n opacity: ${transparency['transparent-2']};\n }\n `;\n }\n);\n\nStyledStage.defaultProps = defaultThemeProp;\n\nexport const StyledStageCompleteIcon = styled(Icon)(({\n theme: {\n base: { palette }\n }\n}) => {\n return css`\n color: ${palette.success};\n `;\n});\n\nStyledStageCompleteIcon.defaultProps = defaultThemeProp;\n\nexport const StyledStageContainer = styled.li(\n ({\n theme: {\n base: { spacing, 'border-radius': borderRadius }\n }\n }) => {\n const thinBorderWidth = '0.0625rem';\n const thickBorderWidth = '0.125rem';\n\n return css`\n &:first-of-type > ${StyledStage} {\n border-start-start-radius: ${borderRadius};\n border-end-start-radius: ${borderRadius};\n border-inline-start-width: ${thinBorderWidth};\n padding-inline-start: ${spacing};\n\n &:active {\n padding-inline-start: ${spacing};\n }\n\n &:focus {\n border-inline-start-width: ${thickBorderWidth};\n padding-inline-start: calc(${spacing} - ${thickBorderWidth} + ${thinBorderWidth});\n }\n\n ::before {\n display: none;\n }\n }\n\n &:last-of-type > ${StyledStage} {\n border-start-end-radius: ${borderRadius};\n border-end-end-radius: ${borderRadius};\n border-inline-end-width: ${thinBorderWidth};\n padding-inline-end: ${spacing};\n\n &:active {\n border-inline-end-width: ${thinBorderWidth};\n padding-inline-end: ${spacing};\n }\n\n &:focus {\n border-inline-end-width: ${thickBorderWidth};\n padding-inline-end: calc(${spacing} - ${thinBorderWidth});\n }\n\n ::after {\n display: none;\n }\n }\n `;\n }\n);\n\nStyledStageContainer.defaultProps = defaultThemeProp;\n\nexport const StyledStepsContainer = styled.ol(({ theme }) => {\n return css`\n list-style-type: none;\n margin: calc(2 * ${theme.base.spacing}) 0 calc(3 * ${theme.base.spacing});\n\n &:empty {\n margin-block-end: 0;\n }\n `;\n});\n\nStyledStepsContainer.defaultProps = defaultThemeProp;\n\nexport const StyledStep = styled.li<{ completed: boolean }>(({ completed, theme }) => {\n const textOpacity = completed ? theme.base.transparency['transparent-2'] : 1;\n\n return css`\n border-radius: 0;\n margin-block-end: calc(${theme.base.spacing});\n color: ${theme.base.palette['foreground-color']};\n\n &:last-child {\n margin-block-end: 0;\n }\n\n & > ${StyledIcon} {\n text-align: center;\n\n ${completed &&\n css`\n color: ${theme.base.palette.success};\n `}\n }\n\n div {\n opacity: ${textOpacity};\n }\n `;\n});\n\nStyledStep.defaultProps = defaultThemeProp;\n\nexport const StyledDateTimeDisplay = styled(DateTimeDisplay)(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n return css`\n font-size: ${fontSize.xs};\n opacity: ${theme.base.transparency['transparent-2']};\n `;\n});\n\nStyledDateTimeDisplay.defaultProps = defaultThemeProp;\n\nexport const StyledStageGlimpse = styled.div(({ theme }) => {\n return css`\n max-width: ${theme.base['content-width'].sm};\n `;\n});\n\nStyledStageGlimpse.defaultProps = defaultThemeProp;\n\nexport const StyledStagesDescription = styled.p`\n display: none;\n`;\n"]}
1	+ {"version":3,"file":"Stages.styles.js","sourceRoot":"","sources":["../../../src/components/Stages/Stages.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { rgba } from 'polished';\n\nimport {\n calculateFontSize,\n DateTimeDisplay,\n defaultThemeProp,\n Icon,\n Text,\n StyledIcon,\n tryCatch,\n useDirection\n} from '@pega/cosmos-react-core';\n\nexport const StyledStages = styled.ol(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['primary-background']};\n border-radius: ${theme.base['border-radius']};\n width: 100%;\n overflow: hidden;\n list-style: none;\n\n &:has(:focus-visible) {\n box-shadow: ${theme.base.shadow['focus-group']};\n }\n `;\n});\n\nStyledStages.defaultProps = defaultThemeProp;\n\nexport const StyledInnerStage = styled.span<{ ellipsis?: boolean }>(props => {\n return css`\n display: inline-block;\n text-align: center;\n white-space: nowrap;\n ${props.ellipsis &&\n css`\n overflow: hidden;\n text-overflow: ellipsis;\n `}\n `;\n});\n\nexport const StyledStage = styled.button(\n ({\n theme: {\n base: { spacing, palette, 'hit-area': hitArea, transparency, 'font-weight': fontWeight }\n }\n }) => {\n const thinBorderWidth = '0.0625rem';\n const thickBorderWidth = '0.125rem';\n const { rtl } = useDirection();\n const borderShadow = tryCatch(() => rgba(palette['border-line'], 1));\n\n return css`\n background-color: inherit;\n color: ${palette['foreground-color']};\n outline: none;\n border-color: transparent;\n border-width: ${thinBorderWidth} 0;\n border-style: solid;\n position: relative;\n height: calc(4 * ${spacing});\n padding-inline-start: calc(2 * ${spacing});\n padding-inline-end: ${spacing};\n width: 100%;\n\n ::before,\n ::after {\n content: '';\n position: absolute;\n display: block;\n width: calc(2.25 * ${spacing});\n height: calc(2.25 * ${spacing});\n border-style: solid;\n border-color: ${palette['border-line']};\n border-inline-end-width: ${thinBorderWidth};\n border-inline-start-width: 0;\n border-top-width: ${rtl ? 0 : thinBorderWidth};\n border-bottom-width: ${rtl ? thinBorderWidth : 0};\n transform: rotateZ(45deg) skew(15deg, 15deg);\n\n @media (pointer: coarse) {\n width: calc(2.875 * ${spacing});\n height: calc(2.875 * ${spacing});\n transform: rotateZ(45deg) skew(20deg, 20deg);\n }\n }\n\n ::before {\n inset-inline-start: calc(-1.125 * ${spacing});\n\n @media (pointer: coarse) {\n inset-inline-start: calc(-1.375 * ${spacing});\n }\n }\n\n ::after {\n inset-inline-end: calc(-1.125 * ${spacing});\n z-index: 1;\n\n @media (pointer: coarse) {\n inset-inline-end: calc(-1.375 * ${spacing});\n }\n }\n\n &:hover,\n &:hover::before,\n &:hover::after {\n border-color: ${palette['border-line']};\n }\n\n &:focus,\n &:active,\n &:focus::before,\n &:active::before,\n &:focus::after,\n &:active::after {\n border-color: ${palette.interactive};\n }\n\n &:focus {\n border-width: ${thickBorderWidth} 0;\n }\n\n &:focus::before,\n &:focus::after {\n z-index: 1;\n border-inline-end-width: ${thickBorderWidth};\n border-top-width: ${rtl ? 0 : thickBorderWidth};\n border-bottom-width: ${rtl ? thickBorderWidth : 0};\n }\n\n &:focus::before {\n pointer-events: none;\n }\n\n &:active {\n border-width: ${thinBorderWidth} 0;\n\n ${StyledInnerStage} {\n opacity: ${transparency['transparent-3']};\n }\n }\n\n &:active::before,\n &:active::after {\n border-inline-end-width: ${thinBorderWidth};\n border-top-width: ${rtl ? 0 : thinBorderWidth};\n border-bottom-width: ${rtl ? thinBorderWidth : 0};\n }\n\n &[aria-current] {\n ${StyledInnerStage} {\n font-weight: ${fontWeight.bold};\n opacity: 1;\n }\n\n :hover {\n ${StyledInnerStage} {\n opacity: ${transparency['transparent-2']};\n }\n }\n\n ::after {\n filter: drop-shadow(0.0625rem -0.0625rem 0.125rem ${borderShadow});\n }\n }\n\n @media (pointer: coarse) {\n height: ${hitArea['finger-min']};\n padding-inline-start: calc(2.25 * ${spacing});\n }\n\n ${StyledIcon} {\n color: ${palette.success};\n\n & ~ ${StyledInnerStage} {\n margin-inline-start: 0.25rem;\n }\n }\n\n ${StyledInnerStage} {\n opacity: ${transparency['transparent-2']};\n }\n `;\n }\n);\n\nStyledStage.defaultProps = defaultThemeProp;\n\nexport const StyledStageCompleteIcon = styled(Icon)(({\n theme: {\n base: { palette }\n }\n}) => {\n return css`\n color: ${palette.success};\n `;\n});\n\nexport const StyledStageText = styled(Text)<{ isCurrent?: boolean }>(\n ({ theme, isCurrent }) => css`\n font-weight: ${isCurrent ? theme.base['font-weight'].bold : theme.base['font-weight'].normal};\n `\n);\n\nStyledStageText.defaultProps = defaultThemeProp;\n\nStyledStageCompleteIcon.defaultProps = defaultThemeProp;\n\nexport const StyledStageContainer = styled.li(\n ({\n theme: {\n base: { spacing, 'border-radius': borderRadius }\n }\n }) => {\n const thinBorderWidth = '0.0625rem';\n const thickBorderWidth = '0.125rem';\n\n return css`\n &:first-of-type > ${StyledStage} {\n border-start-start-radius: ${borderRadius};\n border-end-start-radius: ${borderRadius};\n border-inline-start-width: ${thinBorderWidth};\n padding-inline-start: ${spacing};\n\n &:active {\n padding-inline-start: ${spacing};\n }\n\n &:focus {\n border-inline-start-width: ${thickBorderWidth};\n padding-inline-start: calc(${spacing} - ${thickBorderWidth} + ${thinBorderWidth});\n }\n\n ::before {\n display: none;\n }\n }\n\n &:last-of-type > ${StyledStage} {\n border-start-end-radius: ${borderRadius};\n border-end-end-radius: ${borderRadius};\n border-inline-end-width: ${thinBorderWidth};\n padding-inline-end: ${spacing};\n\n &:active {\n border-inline-end-width: ${thinBorderWidth};\n padding-inline-end: ${spacing};\n }\n\n &:focus {\n border-inline-end-width: ${thickBorderWidth};\n padding-inline-end: calc(${spacing} - ${thinBorderWidth});\n }\n\n ::after {\n display: none;\n }\n }\n `;\n }\n);\n\nStyledStageContainer.defaultProps = defaultThemeProp;\n\nexport const StyledStepsContainer = styled.ol(({ theme }) => {\n return css`\n list-style-type: none;\n margin: calc(2 * ${theme.base.spacing}) 0 calc(3 * ${theme.base.spacing});\n\n &:empty {\n margin-block-end: 0;\n }\n `;\n});\n\nStyledStepsContainer.defaultProps = defaultThemeProp;\n\nexport const StyledStep = styled.li<{ completed: boolean }>(({ completed, theme }) => {\n const textOpacity = completed ? theme.base.transparency['transparent-2'] : 1;\n\n return css`\n border-radius: 0;\n margin-block-end: calc(${theme.base.spacing});\n color: ${theme.base.palette['foreground-color']};\n\n &:last-child {\n margin-block-end: 0;\n }\n\n & > ${StyledIcon} {\n text-align: center;\n\n ${completed &&\n css`\n color: ${theme.base.palette.success};\n `}\n }\n\n div {\n opacity: ${textOpacity};\n }\n `;\n});\n\nStyledStep.defaultProps = defaultThemeProp;\n\nexport const StyledDateTimeDisplay = styled(DateTimeDisplay)(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n return css`\n font-size: ${fontSize.xs};\n opacity: ${theme.base.transparency['transparent-2']};\n `;\n});\n\nStyledDateTimeDisplay.defaultProps = defaultThemeProp;\n\nexport const StyledStageGlimpse = styled.div(({ theme }) => {\n return css`\n max-width: ${theme.base['content-width'].sm};\n `;\n});\n\nStyledStageGlimpse.defaultProps = defaultThemeProp;\n\nexport const StyledStagesDescription = styled.p`\n display: none;\n`;\n"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@pega/cosmos-react-work",
-  "version": "7.0.0-build.30.4",
+  "version": "7.0.0-build.31.1",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/pegasystems/cosmos-react.git",
@@ -19,8 +19,8 @@
     "build": "tsc -b tsconfig.build.json"
   },
   "dependencies": {
-    "@pega/cosmos-react-core": "7.0.0-build.30.4",
-    "@pega/cosmos-react-rte": "7.0.0-build.30.4",
+    "@pega/cosmos-react-core": "7.0.0-build.31.1",
+    "@pega/cosmos-react-rte": "7.0.0-build.31.1",
     "@types/react": "^17.0.62",
     "@types/react-dom": "^17.0.20",
     "@types/styled-components": "^5.1.26",