@pega/cosmos-react-wss 4.0.0 → 4.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/lib/components/AppShell/AppShell.styles.d.ts.map +1 -1
  2. package/lib/components/AppShell/AppShell.styles.js +1 -0
  3. package/lib/components/AppShell/AppShell.styles.js.map +1 -1
  4. package/package.json +6 -6
package/lib/components/AppShell/AppShell.styles.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AppShell.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":";AAgBA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKjD,eAAO,MAAM,SAAS,yGAUrB,CAAC;AAEF,eAAO,MAAM,eAAe;iBAAgC,aAAa,CAAC,aAAa,CAAC;SAyCvF,CAAC;AAIF,eAAO,MAAM,iBAAiB,0GAY5B,CAAC;AAIH,eAAO,MAAM,iBAAiB;YAAwB,OAAO;SAO3D,CAAC;AAEH,eAAO,MAAM,UAAU,uGAwCrB,CAAC;AAIH,eAAO,MAAM,UAAU;iBAA8B,aAAa,CAAC,aAAa,CAAC;SAehF,CAAC;AAIF,eAAO,MAAM,mBAAmB,4GAI9B,CAAC;AAIH,eAAO,MAAM,eAAe,yGAK1B,CAAC;AAIH,eAAO,MAAM,gBAAgB,uGAmC3B,CAAC;AAIH,eAAO,MAAM,iBAAiB,yGAE7B,CAAC;AAEF,eAAO,MAAM,qBAAqB,yGAGjC,CAAC;AAEF,eAAO,MAAM,eAAe,yGAU1B,CAAC;AAIH,eAAO,MAAM,uBAAuB,0GAEnC,CAAC;AAEF,eAAO,MAAM,eAAe,0GAkB3B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;SAW9B,CAAC;AAIH,eAAO,MAAM,sBAAsB,wGAQjC,CAAC;AAIH,eAAO,MAAM,kBAAkB,0QA0B7B,CAAC;AAIH,eAAO,MAAM,wBAAwB;;SAiBnC,CAAC;AAIH,eAAO,MAAM,yBAAyB;;SAMpC,CAAC;AAIH,eAAO,MAAM,2BAA2B;;SAUvC,CAAC"}
1
+ {"version":3,"file":"AppShell.styles.d.ts","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":";AAgBA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKjD,eAAO,MAAM,SAAS,yGAUrB,CAAC;AAEF,eAAO,MAAM,eAAe;iBAAgC,aAAa,CAAC,aAAa,CAAC;SAyCvF,CAAC;AAIF,eAAO,MAAM,iBAAiB,0GAY5B,CAAC;AAIH,eAAO,MAAM,iBAAiB;YAAwB,OAAO;SAO3D,CAAC;AAEH,eAAO,MAAM,UAAU,uGAyCrB,CAAC;AAIH,eAAO,MAAM,UAAU;iBAA8B,aAAa,CAAC,aAAa,CAAC;SAehF,CAAC;AAIF,eAAO,MAAM,mBAAmB,4GAI9B,CAAC;AAIH,eAAO,MAAM,eAAe,yGAK1B,CAAC;AAIH,eAAO,MAAM,gBAAgB,uGAmC3B,CAAC;AAIH,eAAO,MAAM,iBAAiB,yGAE7B,CAAC;AAEF,eAAO,MAAM,qBAAqB,yGAGjC,CAAC;AAEF,eAAO,MAAM,eAAe,yGAU1B,CAAC;AAIH,eAAO,MAAM,uBAAuB,0GAEnC,CAAC;AAEF,eAAO,MAAM,eAAe,0GAkB3B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;SAW9B,CAAC;AAIH,eAAO,MAAM,sBAAsB,wGAQjC,CAAC;AAIH,eAAO,MAAM,kBAAkB,0QA0B7B,CAAC;AAIH,eAAO,MAAM,wBAAwB;;SAiBnC,CAAC;AAIH,eAAO,MAAM,yBAAyB;;SAMpC,CAAC;AAIH,eAAO,MAAM,2BAA2B;;SAUvC,CAAC"}
package/lib/components/AppShell/AppShell.styles.js CHANGED
@@ -87,6 +87,7 @@ export const StyledLink = styled.a(({ theme }) => {
87
87
  position: relative;
88
88
  height: 100%;
89
89
  display: flex;
90
+ align-items: center;
90
91
 
91
92
  &:last-of-type {
92
93
  margin-inline-end: ${theme.base.spacing};
package/lib/components/AppShell/AppShell.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AppShell.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { lighten, mix } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport {\n calculateFontSize,\n defaultThemeProp,\n StyledFlex,\n StyledImage,\n StyledText,\n StyledVisual,\n tryCatch\n} from '@pega/cosmos-react-core';\nimport { StyledAppHeaderOperator } from '@pega/cosmos-react-core/lib/components/AppShell/AppHeader.styles';\nimport { StyledAlert } from '@pega/cosmos-react-core/lib/components/Badges/Alert';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\n\nimport { AppShellProps } from './AppShell.types';\n\nconst headerHeight = '3rem';\nconst tallHeaderHeight = '6rem';\n\nexport const StyledNav = styled.nav`\n white-space: nowrap;\n overflow: visible;\n visibility: hidden;\n height: 100%;\n\n a:hover,\n button:hover {\n text-decoration: none;\n }\n`;\n\nexport const StyledAppHeader = styled.header<{ navPosition: AppShellProps['navPosition'] }>(\n ({ navPosition, theme }) => {\n return css`\n position: sticky;\n inset-block-start: 0;\n height: ${navPosition === 'below' ? tallHeaderHeight : headerHeight};\n width: 100%;\n background-color: ${theme.base.palette['primary-background']};\n z-index: calc(${theme.base['z-index'].popover} + 1);\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n\n ${StyledImage} {\n height: 1.625rem;\n }\n\n & > ${StyledFlex} {\n height: ${headerHeight};\n\n ${StyledAppHeaderOperator} {\n margin: ${theme.base.spacing};\n }\n\n & > a,\n & > button {\n cursor: pointer;\n text-decoration: none;\n user-select: none;\n -webkit-user-select: none;\n min-height: ${headerHeight};\n\n &:focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n }\n }\n\n & > ${StyledNav} {\n height: calc(${tallHeaderHeight} - ${headerHeight});\n }\n `;\n }\n);\n\nStyledAppHeader.defaultProps = defaultThemeProp;\n\nexport const StyledPrimaryName = styled.span(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n color: ${theme.base.palette['foreground-color']};\n font-size: ${fontSize.xxl};\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: block;\n max-width: 50ch;\n `;\n});\n\nStyledPrimaryName.defaultProps = defaultThemeProp;\n\nexport const StyledEndNavBlock = styled.div<{ mobile: boolean }>(({ mobile }) => {\n return (\n mobile &&\n css`\n margin-inline-start: auto;\n `\n );\n});\n\nexport const StyledLink = styled.a(({ theme }) => {\n const hoverColor = lighten(0.2, theme.base.palette.interactive);\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n margin: 0 calc(0.5 * ${theme.base.spacing});\n padding: 0 calc(0.5 * ${theme.base.spacing});\n font-size: ${fontSize.m};\n position: relative;\n height: 100%;\n display: flex;\n\n &:last-of-type {\n margin-inline-end: ${theme.base.spacing};\n }\n\n &[aria-current='page'] {\n ::after {\n content: '';\n position: absolute;\n inset-inline-start: 0;\n inset-block-end: 0;\n background-color: ${theme.base.palette.interactive};\n height: 0.125rem;\n width: 100%;\n }\n }\n\n &:hover {\n ::after {\n content: '';\n position: absolute;\n inset-inline-start: 0;\n inset-block-end: 0;\n background-color: ${hoverColor};\n height: 0.125rem;\n width: 100%;\n }\n }\n `;\n});\n\nStyledLink.defaultProps = defaultThemeProp;\n\nexport const StyledMain = styled.main<{ navPosition: AppShellProps['navPosition'] }>(\n ({ navPosition, theme }) => {\n const calculatedHeaderHeight = navPosition === 'below' ? tallHeaderHeight : headerHeight;\n return css`\n --appshell-offset: ${calculatedHeaderHeight};\n --appshell-horizontal-offset: 0;\n position: relative;\n min-height: calc(100vh - ${calculatedHeaderHeight});\n background-color: ${theme.base.palette['primary-background']};\n\n :focus {\n outline: none;\n }\n `;\n }\n);\n\nStyledMain.defaultProps = defaultThemeProp;\n\nexport const StyledHamburgerMenu = styled.button(({ theme }) => {\n return css`\n margin: ${theme.base.spacing};\n `;\n});\n\nStyledHamburgerMenu.defaultProps = defaultThemeProp;\n\nexport const StyledMobileNav = styled.nav(({ theme }) => {\n return css`\n height: 100vh;\n background-color: ${theme.base.palette['primary-background']};\n `;\n});\n\nStyledMobileNav.defaultProps = defaultThemeProp;\n\nexport const StyledMobileLink = styled.a(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n const activeColor = tryCatch(() =>\n mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n\n const hoverColor = tryCatch(() =>\n mix(0.95, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n\n return css`\n font-size: ${fontSize.m};\n padding: ${theme.base.spacing} calc(3 * ${theme.base.spacing});\n background-color: ${theme.base.palette['primary-background']};\n\n & + & {\n margin-inline-start: 0;\n }\n\n &:hover,\n &:focus {\n background-color: ${hoverColor};\n text-decoration: none;\n }\n\n &[aria-current='page'] {\n font-weight: ${theme.base['font-weight']['semi-bold']};\n background-color: ${activeColor};\n }\n\n @media (pointer: coarse) {\n height: ${theme.base['hit-area'].finger};\n }\n `;\n});\n\nStyledMobileLink.defaultProps = defaultThemeProp;\n\nexport const StyledLinkSection = styled.div`\n overflow: auto;\n`;\n\nexport const StyledOperatorSection = styled.div`\n position: sticky;\n bottom: 0;\n`;\n\nexport const HorizontalBreak = styled.div(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['border-line']};\n height: 0.0625rem;\n margin: ${theme.base.spacing} calc(6 * ${theme.base.spacing}) 0 calc(3 * ${theme.base.spacing});\n\n & + ${StyledFlex} {\n margin-inline-start: calc(3 * ${theme.base.spacing});\n }\n `;\n});\n\nHorizontalBreak.defaultProps = defaultThemeProp;\n\nexport const StyledNotificationCount = styled.span`\n flex-shrink: 0;\n`;\n\nexport const StyledCountIcon = styled.span(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n position: absolute;\n inset-inline-start: calc(2 * ${spacing});\n inset-block-start: calc(-0.25 * ${spacing});\n padding: 0 calc(0.5 * ${spacing});\n\n @media (pointer: coarse) {\n inset-inline-start: calc(2.5 * ${spacing});\n inset-block-start: calc(0.5 * ${spacing});\n }\n `;\n }\n);\n\nexport const StyledNotifications = styled.div<{ popover?: boolean }>(({ popover, theme }) => {\n return css`\n min-height: ${popover ? '10rem' : '100vh'};\n max-height: ${popover ? '50vh' : '100vh'};\n background-color: ${theme.base.palette['primary-background']};\n\n ${popover &&\n css`\n max-width: 80ch;\n `}\n `;\n});\n\nStyledNotifications.defaultProps = defaultThemeProp;\n\nexport const StyledNotificationList = styled.ul(({ theme }) => {\n return css`\n overflow: auto;\n\n & > li:not(:last-of-type) {\n border-bottom: solid 0.0625rem ${theme.base.palette['border-line']};\n }\n `;\n});\n\nStyledNotificationList.defaultProps = defaultThemeProp;\n\nexport const StyledNotification = styled(BareButton)(({ theme }) => {\n const hoverColor = lighten(0.55, theme.base.palette.interactive);\n\n return css`\n width: 100%;\n padding: calc(2 * ${theme.base.spacing}) calc(3 * ${theme.base.spacing});\n background-color: ${theme.base.palette['primary-background']};\n text-decoration: none;\n cursor: pointer;\n text-align: start;\n white-space: normal;\n\n &:hover,\n &:focus {\n background-color: ${hoverColor};\n }\n\n &:focus {\n outline: none;\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n\n ${StyledVisual} {\n align-self: flex-start;\n }\n `;\n});\n\nStyledNotification.defaultProps = defaultThemeProp;\n\nexport const StyledNotificationVisual = styled.span<{ unread?: boolean }>(({ theme, unread }) => {\n return css`\n position: relative;\n ${StyledAlert} {\n position: absolute;\n inset-inline-start: 0.375rem;\n inset-block-start: 1.625rem;\n background-color: ${theme.base.palette.interactive};\n height: 0.75rem;\n width: 0.75rem;\n\n ${!unread &&\n css`\n display: none;\n `}\n }\n `;\n});\n\nStyledNotificationVisual.defaultProps = defaultThemeProp;\n\nexport const StyledNotificationPrimary = styled.span<{ unread?: boolean }>(({ theme, unread }) => {\n return css`\n font-weight: ${unread\n ? theme.base['font-weight'].bold\n : theme.base['font-weight']['semi-bold']};\n `;\n});\n\nStyledNotificationPrimary.defaultProps = defaultThemeProp;\n\nexport const StyledNotificationSecondary = styled.span<{ unread?: boolean }>(\n ({ theme, unread }) => {\n return css`\n ${StyledText} {\n opacity: ${unread\n ? theme.base.transparency['transparent-1']\n : theme.base.transparency['transparent-3']};\n }\n `;\n }\n);\n\nStyledNotificationSecondary.defaultProps = defaultThemeProp;\n"]}
1
+ {"version":3,"file":"AppShell.styles.js","sourceRoot":"","sources":["../../../src/components/AppShell/AppShell.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import { lighten, mix } from 'polished';\nimport styled, { css } from 'styled-components';\n\nimport {\n calculateFontSize,\n defaultThemeProp,\n StyledFlex,\n StyledImage,\n StyledText,\n StyledVisual,\n tryCatch\n} from '@pega/cosmos-react-core';\nimport { StyledAppHeaderOperator } from '@pega/cosmos-react-core/lib/components/AppShell/AppHeader.styles';\nimport { StyledAlert } from '@pega/cosmos-react-core/lib/components/Badges/Alert';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\n\nimport { AppShellProps } from './AppShell.types';\n\nconst headerHeight = '3rem';\nconst tallHeaderHeight = '6rem';\n\nexport const StyledNav = styled.nav`\n white-space: nowrap;\n overflow: visible;\n visibility: hidden;\n height: 100%;\n\n a:hover,\n button:hover {\n text-decoration: none;\n }\n`;\n\nexport const StyledAppHeader = styled.header<{ navPosition: AppShellProps['navPosition'] }>(\n ({ navPosition, theme }) => {\n return css`\n position: sticky;\n inset-block-start: 0;\n height: ${navPosition === 'below' ? tallHeaderHeight : headerHeight};\n width: 100%;\n background-color: ${theme.base.palette['primary-background']};\n z-index: calc(${theme.base['z-index'].popover} + 1);\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n\n ${StyledImage} {\n height: 1.625rem;\n }\n\n & > ${StyledFlex} {\n height: ${headerHeight};\n\n ${StyledAppHeaderOperator} {\n margin: ${theme.base.spacing};\n }\n\n & > a,\n & > button {\n cursor: pointer;\n text-decoration: none;\n user-select: none;\n -webkit-user-select: none;\n min-height: ${headerHeight};\n\n &:focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n }\n }\n\n & > ${StyledNav} {\n height: calc(${tallHeaderHeight} - ${headerHeight});\n }\n `;\n }\n);\n\nStyledAppHeader.defaultProps = defaultThemeProp;\n\nexport const StyledPrimaryName = styled.span(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n color: ${theme.base.palette['foreground-color']};\n font-size: ${fontSize.xxl};\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: block;\n max-width: 50ch;\n `;\n});\n\nStyledPrimaryName.defaultProps = defaultThemeProp;\n\nexport const StyledEndNavBlock = styled.div<{ mobile: boolean }>(({ mobile }) => {\n return (\n mobile &&\n css`\n margin-inline-start: auto;\n `\n );\n});\n\nexport const StyledLink = styled.a(({ theme }) => {\n const hoverColor = lighten(0.2, theme.base.palette.interactive);\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n margin: 0 calc(0.5 * ${theme.base.spacing});\n padding: 0 calc(0.5 * ${theme.base.spacing});\n font-size: ${fontSize.m};\n position: relative;\n height: 100%;\n display: flex;\n align-items: center;\n\n &:last-of-type {\n margin-inline-end: ${theme.base.spacing};\n }\n\n &[aria-current='page'] {\n ::after {\n content: '';\n position: absolute;\n inset-inline-start: 0;\n inset-block-end: 0;\n background-color: ${theme.base.palette.interactive};\n height: 0.125rem;\n width: 100%;\n }\n }\n\n &:hover {\n ::after {\n content: '';\n position: absolute;\n inset-inline-start: 0;\n inset-block-end: 0;\n background-color: ${hoverColor};\n height: 0.125rem;\n width: 100%;\n }\n }\n `;\n});\n\nStyledLink.defaultProps = defaultThemeProp;\n\nexport const StyledMain = styled.main<{ navPosition: AppShellProps['navPosition'] }>(\n ({ navPosition, theme }) => {\n const calculatedHeaderHeight = navPosition === 'below' ? tallHeaderHeight : headerHeight;\n return css`\n --appshell-offset: ${calculatedHeaderHeight};\n --appshell-horizontal-offset: 0;\n position: relative;\n min-height: calc(100vh - ${calculatedHeaderHeight});\n background-color: ${theme.base.palette['primary-background']};\n\n :focus {\n outline: none;\n }\n `;\n }\n);\n\nStyledMain.defaultProps = defaultThemeProp;\n\nexport const StyledHamburgerMenu = styled.button(({ theme }) => {\n return css`\n margin: ${theme.base.spacing};\n `;\n});\n\nStyledHamburgerMenu.defaultProps = defaultThemeProp;\n\nexport const StyledMobileNav = styled.nav(({ theme }) => {\n return css`\n height: 100vh;\n background-color: ${theme.base.palette['primary-background']};\n `;\n});\n\nStyledMobileNav.defaultProps = defaultThemeProp;\n\nexport const StyledMobileLink = styled.a(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n const activeColor = tryCatch(() =>\n mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n\n const hoverColor = tryCatch(() =>\n mix(0.95, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n\n return css`\n font-size: ${fontSize.m};\n padding: ${theme.base.spacing} calc(3 * ${theme.base.spacing});\n background-color: ${theme.base.palette['primary-background']};\n\n & + & {\n margin-inline-start: 0;\n }\n\n &:hover,\n &:focus {\n background-color: ${hoverColor};\n text-decoration: none;\n }\n\n &[aria-current='page'] {\n font-weight: ${theme.base['font-weight']['semi-bold']};\n background-color: ${activeColor};\n }\n\n @media (pointer: coarse) {\n height: ${theme.base['hit-area'].finger};\n }\n `;\n});\n\nStyledMobileLink.defaultProps = defaultThemeProp;\n\nexport const StyledLinkSection = styled.div`\n overflow: auto;\n`;\n\nexport const StyledOperatorSection = styled.div`\n position: sticky;\n bottom: 0;\n`;\n\nexport const HorizontalBreak = styled.div(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['border-line']};\n height: 0.0625rem;\n margin: ${theme.base.spacing} calc(6 * ${theme.base.spacing}) 0 calc(3 * ${theme.base.spacing});\n\n & + ${StyledFlex} {\n margin-inline-start: calc(3 * ${theme.base.spacing});\n }\n `;\n});\n\nHorizontalBreak.defaultProps = defaultThemeProp;\n\nexport const StyledNotificationCount = styled.span`\n flex-shrink: 0;\n`;\n\nexport const StyledCountIcon = styled.span(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n position: absolute;\n inset-inline-start: calc(2 * ${spacing});\n inset-block-start: calc(-0.25 * ${spacing});\n padding: 0 calc(0.5 * ${spacing});\n\n @media (pointer: coarse) {\n inset-inline-start: calc(2.5 * ${spacing});\n inset-block-start: calc(0.5 * ${spacing});\n }\n `;\n }\n);\n\nexport const StyledNotifications = styled.div<{ popover?: boolean }>(({ popover, theme }) => {\n return css`\n min-height: ${popover ? '10rem' : '100vh'};\n max-height: ${popover ? '50vh' : '100vh'};\n background-color: ${theme.base.palette['primary-background']};\n\n ${popover &&\n css`\n max-width: 80ch;\n `}\n `;\n});\n\nStyledNotifications.defaultProps = defaultThemeProp;\n\nexport const StyledNotificationList = styled.ul(({ theme }) => {\n return css`\n overflow: auto;\n\n & > li:not(:last-of-type) {\n border-bottom: solid 0.0625rem ${theme.base.palette['border-line']};\n }\n `;\n});\n\nStyledNotificationList.defaultProps = defaultThemeProp;\n\nexport const StyledNotification = styled(BareButton)(({ theme }) => {\n const hoverColor = lighten(0.55, theme.base.palette.interactive);\n\n return css`\n width: 100%;\n padding: calc(2 * ${theme.base.spacing}) calc(3 * ${theme.base.spacing});\n background-color: ${theme.base.palette['primary-background']};\n text-decoration: none;\n cursor: pointer;\n text-align: start;\n white-space: normal;\n\n &:hover,\n &:focus {\n background-color: ${hoverColor};\n }\n\n &:focus {\n outline: none;\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n\n ${StyledVisual} {\n align-self: flex-start;\n }\n `;\n});\n\nStyledNotification.defaultProps = defaultThemeProp;\n\nexport const StyledNotificationVisual = styled.span<{ unread?: boolean }>(({ theme, unread }) => {\n return css`\n position: relative;\n ${StyledAlert} {\n position: absolute;\n inset-inline-start: 0.375rem;\n inset-block-start: 1.625rem;\n background-color: ${theme.base.palette.interactive};\n height: 0.75rem;\n width: 0.75rem;\n\n ${!unread &&\n css`\n display: none;\n `}\n }\n `;\n});\n\nStyledNotificationVisual.defaultProps = defaultThemeProp;\n\nexport const StyledNotificationPrimary = styled.span<{ unread?: boolean }>(({ theme, unread }) => {\n return css`\n font-weight: ${unread\n ? theme.base['font-weight'].bold\n : theme.base['font-weight']['semi-bold']};\n `;\n});\n\nStyledNotificationPrimary.defaultProps = defaultThemeProp;\n\nexport const StyledNotificationSecondary = styled.span<{ unread?: boolean }>(\n ({ theme, unread }) => {\n return css`\n ${StyledText} {\n opacity: ${unread\n ? theme.base.transparency['transparent-1']\n : theme.base.transparency['transparent-3']};\n }\n `;\n }\n);\n\nStyledNotificationSecondary.defaultProps = defaultThemeProp;\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pega/cosmos-react-wss",
3
- "version": "4.0.0",
3
+ "version": "4.1.0",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "https://github.com/pegasystems/cosmos-react.git",
@@ -20,11 +20,11 @@
20
20
  "build": "tsc -b"
21
21
  },
22
22
  "dependencies": {
23
- "@pega/cosmos-react-core": "4.0.0",
24
- "@pega/cosmos-react-social": "4.0.0",
25
- "@pega/cosmos-react-work": "4.0.0",
26
- "@types/react": "^16.14.24 || ^17.0.38",
27
- "@types/react-dom": "^16.9.14 || ^17.0.11",
23
+ "@pega/cosmos-react-core": "4.1.0",
24
+ "@pega/cosmos-react-social": "4.1.0",
25
+ "@pega/cosmos-react-work": "4.1.0",
26
+ "@types/react": "^16.14.43 || ^17.0.62",
27
+ "@types/react-dom": "^16.9.19 || ^17.0.20",
28
28
  "@types/styled-components": "^5.1.26",
29
29
  "polished": "^4.1.0",
30
30
  "react": "^16.14.0 || ^17.0.0",