diff --git a/CHANGELOG.md b/CHANGELOG.md index 25cc2c2..89d055f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,11 +4,21 @@ All notable changes to this project will be documented in this file. Dates are d Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog). +### [1.2.0](https://github.com/eea/volto-statistic-block/compare/1.1.0...1.2.0) - 22 May 2023 + +#### :rocket: New Features + +- feat: use slate_richtext widget instead of plain text [Miu Razvan - [`98983eb`](https://github.com/eea/volto-statistic-block/commit/98983eb93793c51e7e332ded83c0964fa4f93351)] +- feat: customize slate_richtext widget to add backward compatibility [Miu Razvan - [`aa0ebd2`](https://github.com/eea/volto-statistic-block/commit/aa0ebd2cd8e2c10d3bb5ebb134050423dac2f891)] + +#### :hammer_and_wrench: Others + +- use countup.js@2.5.0 [Miu Razvan - [`9dad099`](https://github.com/eea/volto-statistic-block/commit/9dad099fb6519688752bf4788023712bd9719671)] +- bump version [Miu Razvan - [`e886513`](https://github.com/eea/volto-statistic-block/commit/e886513e63bf480dcdb5c9e0a627b31c6b4e989d)] ### [1.1.0](https://github.com/eea/volto-statistic-block/compare/1.0.1...1.1.0) - 27 March 2023 #### :hammer_and_wrench: Others -- Release 1.1.0 [Alin Voinea - [`f16c776`](https://github.com/eea/volto-statistic-block/commit/f16c776d4f6f1c00243125f33fd1739d8d7fb641)] - test(Jenkins): Run tests and cypress with latest canary @plone/volto [Alin Voinea - [`75e506f`](https://github.com/eea/volto-statistic-block/commit/75e506fd7cf92296871ddf52f9b1c82a053ec931)] ### [1.0.1](https://github.com/eea/volto-statistic-block/compare/1.0.0...1.0.1) - 16 November 2022 diff --git a/Jenkinsfile b/Jenkinsfile index 12cc909..4d7272f 100644 --- a/Jenkinsfile +++ b/Jenkinsfile @@ -4,7 +4,7 @@ pipeline { environment { GIT_NAME = "volto-statistic-block" NAMESPACE = "@eeacms" - SONARQUBE_TAGS = "volto.eea.europa.eu,demo-www.eea.europa.eu,prod-www.eea.europa.eu,circularity.eea.europa.eu,forest.eea.europa.eu,demo-kitkat.dev2aws.eea.europa.eu,clmsdemo.devel6cph.eea.europa.eu,water.europa.eu-marine,biodiversity.europa.eu,climate-adapt.eea.europa.eu,climate-energy.eea.europa.eu,climate-advisory-board.devel4cph.eea.europa.eu,climate-advisory-board.europa.eu,www.eea.europa.eu-ims,www.eea.europa.eu-en" + SONARQUBE_TAGS = "volto.eea.europa.eu,demo-www.eea.europa.eu,circularity.eea.europa.eu,forest.eea.europa.eu,clmsdemo.devel6cph.eea.europa.eu,water.europa.eu-marine,biodiversity.europa.eu,climate-adapt.eea.europa.eu,climate-energy.eea.europa.eu,climate-advisory-board.devel4cph.eea.europa.eu,climate-advisory-board.europa.eu,www.eea.europa.eu-ims,www.eea.europa.eu-en,industry.eea.europa.eu" DEPENDENCIES = "" VOLTO = "" } diff --git a/package.json b/package.json index e049108..701c352 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@eeacms/volto-statistic-block", - "version": "1.1.0", + "version": "1.2.0", "description": "@eeacms/volto-statistic-block: Volto add-on", "main": "src/index.js", "author": "European Environment Agency: IDM2 A-Team", @@ -17,6 +17,9 @@ "url": "git@github.com:eea/volto-statistic-block.git" }, "addons": [], + "resolutions": { + "react-countup/countup.js": "2.5.0" + }, "dependencies": { "react-countup": "6.3.1", "react-visibility-sensor": "5.1.1" diff --git a/src/RichTextWidget.jsx b/src/RichTextWidget.jsx new file mode 100644 index 0000000..6bd0827 --- /dev/null +++ b/src/RichTextWidget.jsx @@ -0,0 +1,79 @@ +/** + * A Slate widget that uses internal JSON representation as its value + * + */ + +import React from 'react'; +import isUndefined from 'lodash/isUndefined'; +import isString from 'lodash/isString'; +import config from '@plone/volto/registry'; +import { FormFieldWrapper } from '@plone/volto/components'; +import SlateEditor from '@plone/volto-slate/editor/SlateEditor'; +import { createEmptyParagraph } from '@plone/volto-slate/utils/blocks'; + +import '@plone/volto-slate/widgets/style.css'; + +function createParagraph(text) { + return { + type: config.settings.slate.defaultBlockType, + children: [{ text }], + }; +} + +const getValue = (value) => { + if (isUndefined(value) || !isUndefined(value?.data)) { + return [createEmptyParagraph()]; + } + // Previously this was a text field + if (isString(value)) { + return [createParagraph(value)]; + } + return value; +}; + +const SlateRichTextWidget = (props) => { + const { + id, + onChange, + value, + focus, + className, + block, + placeholder, + properties, + readOnly = false, + } = props; + const [selected, setSelected] = React.useState(focus); + + return ( + +
{ + setSelected(true); + }} + onKeyDown={() => {}} + > + { + onChange(id, newValue); + }} + block={block} + selected={selected} + properties={properties} + placeholder={placeholder} + /> +
+
+ ); +}; + +export default SlateRichTextWidget; diff --git a/src/StatisticBlock/View.jsx b/src/StatisticBlock/View.jsx index a1f57b2..deab23f 100644 --- a/src/StatisticBlock/View.jsx +++ b/src/StatisticBlock/View.jsx @@ -71,10 +71,10 @@ const View = ({ data, mode }) => { ? { className: 'ui statistic', href: item.href } : {})} > - + {animation.enabled ? ( 0 ? animation.duration : 2} decimals={animation.decimals > 0 ? animation.decimals : 0} prefix={animation.prefix || ''} @@ -83,11 +83,11 @@ const View = ({ data, mode }) => { {(props) => } ) : ( - item.value + serializeText(item.value) )} - - {item.label} + + {serializeText(item.label)}
{serializeText(item.info)} diff --git a/src/StatisticBlock/schema.js b/src/StatisticBlock/schema.js index 5dfeb3a..a7c5eb1 100644 --- a/src/StatisticBlock/schema.js +++ b/src/StatisticBlock/schema.js @@ -13,9 +13,11 @@ const statisticSchema = { properties: { value: { title: 'Value', + widget: 'slate_richtext', }, label: { title: 'Label', + widget: 'slate_richtext', }, info: { title: 'Extra info', diff --git a/src/index.js b/src/index.js index 64b7997..9a5f2ca 100644 --- a/src/index.js +++ b/src/index.js @@ -1,6 +1,10 @@ import installStatisticBlock from './StatisticBlock'; +import RichTextWidget from './RichTextWidget'; const applyConfig = (config) => { + config.widgets.widget.slate = RichTextWidget; + config.widgets.widget.slate_richtext = RichTextWidget; + return [installStatisticBlock].reduce((acc, apply) => apply(acc), config); };