@pega/cosmos-react-rte 8.1.0 → 8.2.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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToolbarButton.d.ts","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/Toolbar/ToolbarButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,aAAa,EAAE,UAAU,EAAO,MAAM,OAAO,CAAC;AAYhE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAI5D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAEjD,MAAM,WAAW,kBAAkB;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,GAAG,aAAa,KAAK,IAAI,CAAC;CACvD;
|
|
1
|
+
{"version":3,"file":"ToolbarButton.d.ts","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/Toolbar/ToolbarButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,aAAa,EAAE,UAAU,EAAO,MAAM,OAAO,CAAC;AAYhE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAI5D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAEjD,MAAM,WAAW,kBAAkB;IACjC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,GAAG,aAAa,KAAK,IAAI,CAAC;CACvD;AA+DD,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,GAAG,YAAY,CAkCvD,CAAC;AAEH,eAAe,aAAa,CAAC"}
|
|
@@ -9,9 +9,9 @@ const StyledToolbarButton = styled.button(props => {
|
|
|
9
9
|
const size = `calc(4 * ${props.theme.base.spacing})`;
|
|
10
10
|
const activeColor = tryCatch(() => mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive));
|
|
11
11
|
return css `
|
|
12
|
-
background-color:
|
|
12
|
+
background-color: transparent;
|
|
13
13
|
border: none;
|
|
14
|
-
color: ${
|
|
14
|
+
color: ${theme.base.palette['foreground-color']};
|
|
15
15
|
outline: none;
|
|
16
16
|
display: inline-flex;
|
|
17
17
|
line-height: 1;
|
|
@@ -19,9 +19,18 @@ const StyledToolbarButton = styled.button(props => {
|
|
|
19
19
|
justify-content: center;
|
|
20
20
|
height: ${size};
|
|
21
21
|
min-width: ${size};
|
|
22
|
-
opacity:
|
|
22
|
+
opacity: '0.7';
|
|
23
23
|
cursor: pointer;
|
|
24
24
|
|
|
25
|
+
${active &&
|
|
26
|
+
css `
|
|
27
|
+
background-color: ${activeColor};
|
|
28
|
+
color: ${theme.base.palette.interactive};
|
|
29
|
+
opacity: inherit;
|
|
30
|
+
box-shadow: inset 0 -0.125rem 0 0 ${theme.base.palette.interactive};
|
|
31
|
+
border-inline: 0.25rem solid transparent;
|
|
32
|
+
`}
|
|
33
|
+
|
|
25
34
|
&:focus {
|
|
26
35
|
box-shadow: ${theme.base.shadow.focus};
|
|
27
36
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToolbarButton.js","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/Toolbar/ToolbarButton.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE/B,OAAO,EACL,gBAAgB,EAChB,OAAO,EACP,QAAQ,EACR,kBAAkB,EAClB,UAAU,EACV,OAAO,EACR,MAAM,yBAAyB,CAAC;AAGjC,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAa1D,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,CAAqB,KAAK,CAAC,EAAE;IACpE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAC3C,MAAM,IAAI,GAAG,YAAY,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,GAAG,CAAC;IACrD,MAAM,WAAW,GAAG,QAAQ,CAAC,GAAG,EAAE,CAChC,GAAG,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,CACpF,CAAC;IACF,OAAO,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"ToolbarButton.js","sourceRoot":"","sources":["../../../../src/components/RichTextEditor/Toolbar/ToolbarButton.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef } from 'react';\nimport type { FC, KeyboardEvent, MouseEvent, Ref } from 'react';\nimport styled, { css } from 'styled-components';\nimport { mix } from 'polished';\n\nimport {\n defaultThemeProp,\n Tooltip,\n tryCatch,\n useConsolidatedRef,\n useElement,\n useI18n\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps } from '@pega/cosmos-react-core';\n\nimport { useRTEContext } from '../RichTextEditor.context';\n\nimport type { StyleType } from './Toolbar.types';\n\nexport interface ToolBarButtonProps {\n tooltip?: string;\n active?: boolean;\n styleType?: StyleType;\n disabled?: boolean;\n label?: string;\n onMouseDown?: (e: MouseEvent | KeyboardEvent) => void;\n}\n\nconst StyledToolbarButton = styled.button<ToolBarButtonProps>(props => {\n const { active, theme, styleType } = props;\n const size = `calc(4 * ${props.theme.base.spacing})`;\n const activeColor = tryCatch(() =>\n mix(0.85, theme.base.palette['primary-background'], theme.base.palette.interactive)\n );\n return css`\n background-color: transparent;\n border: none;\n color: ${theme.base.palette['foreground-color']};\n outline: none;\n display: inline-flex;\n line-height: 1;\n align-items: center;\n justify-content: center;\n height: ${size};\n min-width: ${size};\n opacity: '0.7';\n cursor: pointer;\n\n ${active &&\n css`\n background-color: ${activeColor};\n color: ${theme.base.palette.interactive};\n opacity: inherit;\n box-shadow: inset 0 -0.125rem 0 0 ${theme.base.palette.interactive};\n border-inline: 0.25rem solid transparent;\n `}\n\n &:focus {\n box-shadow: ${theme.base.shadow.focus};\n }\n\n &:hover {\n opacity: 1;\n }\n\n &:disabled {\n cursor: not-allowed;\n box-shadow: none;\n }\n\n ${styleType === 'BOLD' &&\n css`\n font-weight: bold;\n `}\n\n ${styleType === 'ITALIC' &&\n css`\n font-style: italic;\n `}\n\n ${styleType === 'STRIKE-THROUGH' &&\n css`\n text-decoration: line-through;\n `}\n `;\n});\n\nStyledToolbarButton.defaultProps = defaultThemeProp;\n\nconst ToolbarButton: FC<ToolBarButtonProps & ForwardProps> = forwardRef(function ToolbarButton(\n { tooltip, active, styleType, disabled, label, onMouseDown, ...restProps },\n ref: Ref<HTMLButtonElement>\n) {\n const { disabled: contextDisabled } = useRTEContext();\n const [el, setEl] = useElement();\n const toolBarRef = useConsolidatedRef<HTMLButtonElement>(setEl, ref);\n const t = useI18n();\n return (\n <>\n <StyledToolbarButton\n active={active}\n styleType={styleType}\n ref={toolBarRef}\n disabled={contextDisabled || disabled}\n tabIndex={-1}\n onKeyPress={(e: KeyboardEvent<HTMLButtonElement>) => {\n if (e.key === 'Enter') {\n onMouseDown?.(e);\n }\n }}\n onMouseDown={onMouseDown}\n type='button'\n aria-label={`${label}${active ? ` - ${t('active')}` : ''}`}\n aria-pressed={active}\n {...restProps}\n />\n {el && tooltip && (\n <Tooltip target={el} showDelay='none' hideDelay='none'>\n {tooltip}\n </Tooltip>\n )}\n </>\n );\n});\n\nexport default ToolbarButton;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-rte",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.2.0",
|
|
4
4
|
"license": "SEE LICENSE IN LICENSE",
|
|
5
5
|
"author": "Pegasystems",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
"build": "tsc -b tsconfig.build.json"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@pega/cosmos-react-core": "8.
|
|
17
|
+
"@pega/cosmos-react-core": "8.2.0",
|
|
18
18
|
"@popperjs/core": "^2.11.6",
|
|
19
19
|
"@types/parse5": "^6.0.0",
|
|
20
20
|
"@types/react": "^17.0.62 || ^18.3.3",
|