@pega/cosmos-react-core 4.1.1 → 4.1.2
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.
|
@@ -193,7 +193,7 @@ const HTML = forwardRef(function HTML({ content, customTags, ...restProps }, ref
|
|
|
193
193
|
return mounted
|
|
194
194
|
? dompurify.sanitize(content, {
|
|
195
195
|
CUSTOM_ELEMENT_HANDLING: {
|
|
196
|
-
tagNameCheck: customTags ? tagName => customTags.includes(tagName) :
|
|
196
|
+
tagNameCheck: customTags ? tagName => customTags.includes(tagName) : undefined
|
|
197
197
|
}
|
|
198
198
|
})
|
|
199
199
|
: '';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HTML.js","sourceRoot":"","sources":["../../../src/components/HTML/HTML.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n useState,\n useEffect,\n useMemo\n} from 'react';\nimport styled, { css, DefaultTheme } from 'styled-components';\nimport dompurify from 'dompurify';\n\nimport { StyledPopover } from '../Popover';\nimport { defaultThemeProp } from '../../theme';\nimport { calculateFontSize, FontSize } from '../../styles';\nimport { BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport { sameOrigin } from '../../utils';\n\nexport interface HTMLProps extends BaseProps, NoChildrenProp {\n content: string;\n customTags?: string[];\n ref?: Ref<HTMLDivElement>;\n}\n\nexport const listStyles = css`\n ul,\n ol {\n padding-inline-start: 2.5rem;\n }\n\n li {\n margin: 0.5rem 0;\n }\n\n ul li {\n ul {\n margin-inline-start: 1rem;\n list-style-type: circle;\n }\n\n ul ul {\n margin-inline-start: 2rem;\n list-style-type: square;\n }\n\n ul ul ul {\n margin-inline-start: 3rem;\n list-style-type: disc;\n }\n }\n\n ol li {\n ol {\n margin-inline-start: 1rem;\n list-style-type: lower-alpha;\n }\n\n ol ol {\n margin-inline-start: 2rem;\n list-style-type: lower-roman;\n }\n\n ol ol ol {\n margin-inline-start: 3rem;\n list-style-type: decimal;\n }\n }\n`;\n\nexport const getTableStyles = (theme: DefaultTheme) => css`\n border-collapse: collapse;\n\n td {\n border: 0.0625rem solid ${theme.base.palette['border-line']};\n min-width: 6.25rem;\n }\n\n tr:first-child {\n td:first-child {\n border-top-left-radius: 0.125rem;\n }\n\n td:last-child {\n border-top-right-radius: 0.125rem;\n }\n }\n\n tr:last-child {\n td:first-child {\n border-bottom-left-radius: 0.125rem;\n }\n\n td:last-child {\n border-bottom-right-radius: 0.125rem;\n }\n }\n`;\n\nexport const getHtmlStyles = (theme: DefaultTheme) => {\n const {\n base: { 'font-size': baseFontSize, 'font-scale': baseFontScale, palette },\n components: { text }\n } = theme;\n const fontSize = calculateFontSize(baseFontSize, baseFontScale);\n return `\n ${listStyles}\n table {\n ${getTableStyles(theme)}\n }\n img {\n max-width: 100%;\n height: auto;\n border-radius: 0.25rem;\n }\n a {\n color: ${palette.interactive};\n }\n pre {\n white-space: break-spaces;\n }\n p {\n min-height: ${fontSize[text.primary['font-size'] as FontSize]};\n }\n h1 {\n font-size: ${fontSize[text.h1['font-size'] as FontSize]};\n font-weight: ${text.h1['font-weight']};\n min-height: ${fontSize[text.h1['font-size'] as FontSize]};\n }\n h2 {\n font-size: ${fontSize[text.h2['font-size'] as FontSize]};\n font-weight: ${text.h2['font-weight']};\n min-height: ${fontSize[text.h2['font-size'] as FontSize]};\n }\n h3 {\n font-size: ${fontSize[text.h3['font-size'] as FontSize]};\n font-weight: ${text.h3['font-weight']};\n min-height: ${fontSize[text.h3['font-size'] as FontSize]};\n }\n h4 {\n font-size: ${fontSize[text.h4['font-size'] as FontSize]};\n font-weight: ${text.h4['font-weight']};\n min-height: ${fontSize[text.h4['font-size'] as FontSize]};\n }\n h5 {\n font-size: ${fontSize[text.h5['font-size'] as FontSize]};\n font-weight: ${text.h5['font-weight']};\n min-height: ${fontSize[text.h5['font-size'] as FontSize]};\n }\n h6 {\n font-size: ${fontSize[text.h6['font-size'] as FontSize]};\n font-weight: ${text.h6['font-weight']};\n min-height: ${fontSize[text.h6['font-size'] as FontSize]};\n }\n `;\n};\n\nexport const StyledHTML = styled.div(({ theme }) => {\n return css`\n width: 100%;\n overflow-x: auto;\n overflow-wrap: break-word;\n ${getHtmlStyles(theme)}\n\n ${StyledPopover} ul {\n ul {\n padding-inline-start: 0;\n }\n ol {\n padding-inline-start: 0;\n }\n }\n\n ${StyledPopover} li {\n margin: 0;\n }\n `;\n});\n\nStyledHTML.defaultProps = defaultThemeProp;\n\nconst targetBlankSet = new WeakSet<HTMLAnchorElement>();\n\ndompurify.addHook('beforeSanitizeAttributes', node => {\n // Can be passed text nodes\n if (!(node instanceof HTMLElement || node instanceof SVGElement)) return;\n\n node.removeAttribute('class');\n\n if (\n node.tagName === 'A' &&\n node.hasAttribute('href') &&\n node.getAttribute('target') === '_blank'\n ) {\n targetBlankSet.add(node as HTMLAnchorElement);\n }\n});\n\ndompurify.addHook('afterSanitizeAttributes', node => {\n if (node.tagName === 'A' && node.hasAttribute('href')) {\n const href = node.getAttribute('href')!;\n\n let fullURL: URL;\n try {\n fullURL = new URL(href, window.location.href);\n } catch (e) {\n return;\n }\n\n if (!sameOrigin(window.location, fullURL)) {\n node.setAttribute('target', '_blank');\n node.setAttribute('rel', 'noopener');\n } else if (targetBlankSet.has(node as HTMLAnchorElement)) {\n node.setAttribute('target', '_blank');\n targetBlankSet.delete(node as HTMLAnchorElement);\n }\n }\n});\n\nconst HTML: FunctionComponent<HTMLProps & ForwardProps> = forwardRef(function HTML(\n { content, customTags, ...restProps }: PropsWithoutRef<HTMLProps>,\n ref: HTMLProps['ref']\n) {\n const [mounted, setMounted] = useState(false);\n const sanitizedHtml = useMemo(() => {\n // Don't render content on the server at all.\n return mounted\n ? dompurify.sanitize(content, {\n CUSTOM_ELEMENT_HANDLING: {\n tagNameCheck: customTags ? tagName => customTags.includes(tagName) : null\n }\n })\n : '';\n }, [content, customTags, mounted]);\n\n useEffect(() => {\n setMounted(true);\n }, []);\n\n return (\n <StyledHTML {...restProps} dangerouslySetInnerHTML={{ __html: sanitizedHtml }} ref={ref} />\n );\n});\n\nexport default HTML;\n"]}
|
|
1
|
+
{"version":3,"file":"HTML.js","sourceRoot":"","sources":["../../../src/components/HTML/HTML.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n useState,\n useEffect,\n useMemo\n} from 'react';\nimport styled, { css, DefaultTheme } from 'styled-components';\nimport dompurify from 'dompurify';\n\nimport { StyledPopover } from '../Popover';\nimport { defaultThemeProp } from '../../theme';\nimport { calculateFontSize, FontSize } from '../../styles';\nimport { BaseProps, ForwardProps, NoChildrenProp } from '../../types';\nimport { sameOrigin } from '../../utils';\n\nexport interface HTMLProps extends BaseProps, NoChildrenProp {\n content: string;\n customTags?: string[];\n ref?: Ref<HTMLDivElement>;\n}\n\nexport const listStyles = css`\n ul,\n ol {\n padding-inline-start: 2.5rem;\n }\n\n li {\n margin: 0.5rem 0;\n }\n\n ul li {\n ul {\n margin-inline-start: 1rem;\n list-style-type: circle;\n }\n\n ul ul {\n margin-inline-start: 2rem;\n list-style-type: square;\n }\n\n ul ul ul {\n margin-inline-start: 3rem;\n list-style-type: disc;\n }\n }\n\n ol li {\n ol {\n margin-inline-start: 1rem;\n list-style-type: lower-alpha;\n }\n\n ol ol {\n margin-inline-start: 2rem;\n list-style-type: lower-roman;\n }\n\n ol ol ol {\n margin-inline-start: 3rem;\n list-style-type: decimal;\n }\n }\n`;\n\nexport const getTableStyles = (theme: DefaultTheme) => css`\n border-collapse: collapse;\n\n td {\n border: 0.0625rem solid ${theme.base.palette['border-line']};\n min-width: 6.25rem;\n }\n\n tr:first-child {\n td:first-child {\n border-top-left-radius: 0.125rem;\n }\n\n td:last-child {\n border-top-right-radius: 0.125rem;\n }\n }\n\n tr:last-child {\n td:first-child {\n border-bottom-left-radius: 0.125rem;\n }\n\n td:last-child {\n border-bottom-right-radius: 0.125rem;\n }\n }\n`;\n\nexport const getHtmlStyles = (theme: DefaultTheme) => {\n const {\n base: { 'font-size': baseFontSize, 'font-scale': baseFontScale, palette },\n components: { text }\n } = theme;\n const fontSize = calculateFontSize(baseFontSize, baseFontScale);\n return `\n ${listStyles}\n table {\n ${getTableStyles(theme)}\n }\n img {\n max-width: 100%;\n height: auto;\n border-radius: 0.25rem;\n }\n a {\n color: ${palette.interactive};\n }\n pre {\n white-space: break-spaces;\n }\n p {\n min-height: ${fontSize[text.primary['font-size'] as FontSize]};\n }\n h1 {\n font-size: ${fontSize[text.h1['font-size'] as FontSize]};\n font-weight: ${text.h1['font-weight']};\n min-height: ${fontSize[text.h1['font-size'] as FontSize]};\n }\n h2 {\n font-size: ${fontSize[text.h2['font-size'] as FontSize]};\n font-weight: ${text.h2['font-weight']};\n min-height: ${fontSize[text.h2['font-size'] as FontSize]};\n }\n h3 {\n font-size: ${fontSize[text.h3['font-size'] as FontSize]};\n font-weight: ${text.h3['font-weight']};\n min-height: ${fontSize[text.h3['font-size'] as FontSize]};\n }\n h4 {\n font-size: ${fontSize[text.h4['font-size'] as FontSize]};\n font-weight: ${text.h4['font-weight']};\n min-height: ${fontSize[text.h4['font-size'] as FontSize]};\n }\n h5 {\n font-size: ${fontSize[text.h5['font-size'] as FontSize]};\n font-weight: ${text.h5['font-weight']};\n min-height: ${fontSize[text.h5['font-size'] as FontSize]};\n }\n h6 {\n font-size: ${fontSize[text.h6['font-size'] as FontSize]};\n font-weight: ${text.h6['font-weight']};\n min-height: ${fontSize[text.h6['font-size'] as FontSize]};\n }\n `;\n};\n\nexport const StyledHTML = styled.div(({ theme }) => {\n return css`\n width: 100%;\n overflow-x: auto;\n overflow-wrap: break-word;\n ${getHtmlStyles(theme)}\n\n ${StyledPopover} ul {\n ul {\n padding-inline-start: 0;\n }\n ol {\n padding-inline-start: 0;\n }\n }\n\n ${StyledPopover} li {\n margin: 0;\n }\n `;\n});\n\nStyledHTML.defaultProps = defaultThemeProp;\n\nconst targetBlankSet = new WeakSet<HTMLAnchorElement>();\n\ndompurify.addHook('beforeSanitizeAttributes', node => {\n // Can be passed text nodes\n if (!(node instanceof HTMLElement || node instanceof SVGElement)) return;\n\n node.removeAttribute('class');\n\n if (\n node.tagName === 'A' &&\n node.hasAttribute('href') &&\n node.getAttribute('target') === '_blank'\n ) {\n targetBlankSet.add(node as HTMLAnchorElement);\n }\n});\n\ndompurify.addHook('afterSanitizeAttributes', node => {\n if (node.tagName === 'A' && node.hasAttribute('href')) {\n const href = node.getAttribute('href')!;\n\n let fullURL: URL;\n try {\n fullURL = new URL(href, window.location.href);\n } catch (e) {\n return;\n }\n\n if (!sameOrigin(window.location, fullURL)) {\n node.setAttribute('target', '_blank');\n node.setAttribute('rel', 'noopener');\n } else if (targetBlankSet.has(node as HTMLAnchorElement)) {\n node.setAttribute('target', '_blank');\n targetBlankSet.delete(node as HTMLAnchorElement);\n }\n }\n});\n\nconst HTML: FunctionComponent<HTMLProps & ForwardProps> = forwardRef(function HTML(\n { content, customTags, ...restProps }: PropsWithoutRef<HTMLProps>,\n ref: HTMLProps['ref']\n) {\n const [mounted, setMounted] = useState(false);\n const sanitizedHtml = useMemo(() => {\n // Don't render content on the server at all.\n return mounted\n ? dompurify.sanitize(content, {\n CUSTOM_ELEMENT_HANDLING: {\n tagNameCheck: customTags ? tagName => customTags.includes(tagName) : undefined\n }\n })\n : '';\n }, [content, customTags, mounted]);\n\n useEffect(() => {\n setMounted(true);\n }, []);\n\n return (\n <StyledHTML {...restProps} dangerouslySetInnerHTML={{ __html: sanitizedHtml }} ref={ref} />\n );\n});\n\nexport default HTML;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-core",
|
|
3
|
-
"version": "4.1.
|
|
3
|
+
"version": "4.1.2",
|
|
4
4
|
"description": "Cosmos is a visual design system and UI component collection. Its goal is to empower application developers in their pursuit to create engaging and rewarding user experiences.",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
},
|
|
27
27
|
"dependencies": {
|
|
28
28
|
"@popperjs/core": "^2.11.6",
|
|
29
|
-
"@types/dompurify": "^3.0.
|
|
29
|
+
"@types/dompurify": "^3.0.5",
|
|
30
30
|
"@types/emoji-mart": "^3.0.4",
|
|
31
31
|
"@types/emoji-regex": "^8.0.0",
|
|
32
32
|
"@types/google.maps": "^3.49.2",
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
"@types/styled-components": "^5.1.26",
|
|
37
37
|
"bignumber.js": "^9.0.1",
|
|
38
38
|
"credit-card-type": "^9.1.0",
|
|
39
|
-
"dompurify": "^3.0.
|
|
39
|
+
"dompurify": "^3.0.7",
|
|
40
40
|
"emoji-mart": "^3.0.1",
|
|
41
41
|
"emoji-regex": "^9.2.0",
|
|
42
42
|
"libphonenumber-js": "^1.9.9",
|