@widergy/energy-ui 3.123.1 → 3.125.0

package/dist/components/UTLabel/constants.js

@@ -3,10 +3,8 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.WEIGHTS = exports.VARIANTS_SIZES = exports.VARIANTS_LINE_HEIGHT = exports.VARIANTS = exports.MARKDOWN_RENDERERS = exports.DEFAULT_PROPS = void 0;
-var _react = _interopRequireDefault(require("react"));
+exports.WEIGHTS = exports.VARIANTS_SIZES = exports.VARIANTS_LINE_HEIGHT = exports.VARIANTS = exports.DEFAULT_PROPS = void 0;
 var _Palette = require("../../constants/Palette");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const VARIANTS = exports.VARIANTS = {
   title1: 'h1',
   title2: 'h2',
@@ -54,23 +52,11 @@ const WEIGHTS = exports.WEIGHTS = {
   extrabold: 800,
   black: 900
 };
-const MARKDOWN_RENDERERS = exports.MARKDOWN_RENDERERS = {
-  a: _ref => {
-    let {
-      href,
-      children
-    } = _ref;
-    return /*#__PURE__*/_react.default.createElement("a", {
-      href: href,
-      rel: "noopener noreferrer",
-      target: "_blank"
-    }, children);
-  }
-};
 const DEFAULT_PROPS = exports.DEFAULT_PROPS = {
   colorTheme: _Palette.COLOR_THEMES.dark,
   field: {},
-  markdownRenderers: MARKDOWN_RENDERERS,
+  markdownExtended: false,
+  markdownRenderers: {},
   variant: 'body',
   weight: 'regular',
   withMarkdown: false

package/dist/components/UTLabel/index.js

@@ -6,20 +6,16 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = require("prop-types");
-var _reactMarkdown = _interopRequireDefault(require("react-markdown"));
-var _remarkBreaks = _interopRequireDefault(require("remark-breaks"));
-var _rehypeRaw = _interopRequireDefault(require("rehype-raw"));
 var _classesUtils = require("../../utils/classesUtils");
 var _componentUtils = require("../../utils/componentUtils");
 var _UTSkeleton = _interopRequireDefault(require("../UTSkeleton"));
 var _WithTheme = _interopRequireDefault(require("../WithTheme"));
+var _Markdown = _interopRequireDefault(require("./components/Markdown"));
 var _constants = require("./constants");
 var _theme = require("./theme");
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-/* eslint-disable react/no-children-prop */
-
 const UTLabel = _ref => {
   let {
     align,
@@ -27,6 +23,7 @@ const UTLabel = _ref => {
     className,
     classes: theme,
     dataTestId,
+    markdownExtended,
     markdownRenderers,
     title,
     variant,
@@ -37,19 +34,16 @@ const UTLabel = _ref => {
   const classes = (0, _react.useMemo)(() => (0, _classesUtils.mergeClasses)(theme, {
     className
   }), [theme, className]);
+  const componentClassname = "".concat(classes.root, " ").concat(withMarkdown ? classes.markdown : '', " ").concat(_stylesModule.default["".concat(align, "Alignment")] || '', " ").concat(classes.className);
   return /*#__PURE__*/_react.default.createElement(_UTSkeleton.default, null, /*#__PURE__*/_react.default.createElement(Component, {
-    className: "".concat(classes.root, " ").concat(_stylesModule.default["".concat(align, "Alignment")] || '', " ").concat(classes.className).trim(),
+    className: componentClassname.trim(),
     "data-testid": dataTestId,
     title: title
-  }, withMarkdown && /*#__PURE__*/_react.default.createElement(_reactMarkdown.default, {
-    children: children,
-    components: markdownRenderers,
-    disallowedElements: ['p', 'blockquote'],
-    rehypePlugins: [_rehypeRaw.default],
-    remarkPlugins: [_remarkBreaks.default],
-    skipHtml: false,
-    unwrapDisallowed: true
-  }) || children));
+  }, withMarkdown && /*#__PURE__*/_react.default.createElement(_Markdown.default, {
+    classes: classes,
+    markdownExtended: markdownExtended,
+    markdownRenderers: markdownRenderers
+  }, children) || children));
 };
 UTLabel.defaultProps = _constants.DEFAULT_PROPS;
 UTLabel.propTypes = {
@@ -57,6 +51,7 @@ UTLabel.propTypes = {
   classes: (0, _propTypes.objectOf)(_propTypes.string),
   className: _propTypes.string,
   dataTestId: _propTypes.string,
+  markdownExtended: _propTypes.bool,
   markdownRenderers: (0, _propTypes.objectOf)(_propTypes.func),
   title: _propTypes.string,
   variant: _propTypes.string,

package/dist/components/UTLabel/theme.js

@@ -19,7 +19,7 @@ const variantsColorTheme = (colorTheme, shade, theme) => {
 const linkColor = (theme, colorTheme) => {
   var _theme$Palette;
   const actionPaletteColors = ((_theme$Palette = theme.Palette) === null || _theme$Palette === void 0 ? void 0 : _theme$Palette.actions) || theme.Palette;
-  const color = colorTheme === _Palette.COLOR_THEMES.light ? actionPaletteColors.negative[_Palette.COLOR_SHADES.shade05] : colorTheme === _Palette.COLOR_THEMES.error ? actionPaletteColors.error[_Palette.COLOR_SHADES.shade05] : actionPaletteColors.neutral[_Palette.COLOR_SHADES.shade05];
+  const color = colorTheme === _Palette.COLOR_THEMES.light ? actionPaletteColors[_Palette.COLOR_THEMES.negative][_Palette.COLOR_SHADES.shade05] : colorTheme === _Palette.COLOR_THEMES.error ? actionPaletteColors[_Palette.COLOR_THEMES.error][_Palette.COLOR_SHADES.shade05] : actionPaletteColors[_Palette.COLOR_THEMES.accent][_Palette.COLOR_SHADES.shade05];
   return color;
 };
 const getFontStyles = _ref => {
@@ -51,6 +51,8 @@ const retrieveStyle = _ref2 => {
     weight,
     variantsSizes
   } = _ref2;
+  const darkTextColor = colorTheme === _Palette.COLOR_THEMES.light ? theme.Palette[_Palette.COLOR_THEMES.light][_Palette.COLOR_SHADES.shade01] : theme.Palette[_Palette.COLOR_THEMES.dark][_Palette.COLOR_SHADES.shade05];
+  const grayTextColor = colorTheme === _Palette.COLOR_THEMES.light ? theme.Palette[_Palette.COLOR_THEMES.light][_Palette.COLOR_SHADES.shade01] : theme.Palette[_Palette.COLOR_THEMES.gray][_Palette.COLOR_SHADES.shade04];
   return {
     root: {
       color: variantsColorTheme((_field$configuration$ = field === null || field === void 0 || (_field$configuration = field.configuration) === null || _field$configuration === void 0 ? void 0 : _field$configuration.colorTheme) !== null && _field$configuration$ !== void 0 ? _field$configuration$ : colorTheme, (_field$configuration$2 = field === null || field === void 0 || (_field$configuration2 = field.configuration) === null || _field$configuration2 === void 0 ? void 0 : _field$configuration2.shade) !== null && _field$configuration$2 !== void 0 ? _field$configuration$2 : shade, theme),
@@ -60,10 +62,158 @@ const retrieveStyle = _ref2 => {
         weight: (_field$configuration$4 = field === null || field === void 0 || (_field$configuration4 = field.configuration) === null || _field$configuration4 === void 0 ? void 0 : _field$configuration4.weight) !== null && _field$configuration$4 !== void 0 ? _field$configuration$4 : weight,
         variantsSizes
       }),
-      margin: 0,
-      '& > a': {
+      margin: 0
+    },
+    markdown: {
+      '& a': {
         color: linkColor(theme, colorTheme)
+      },
+      '& h1, & h2, & h3, & h4, & h5, & h6': {
+        color: darkTextColor,
+        fontWeight: _constants.WEIGHTS.medium,
+        lineHeight: 1,
+        margin: '0 0 8px 0'
+      },
+      '& h1': {
+        fontSize: '1.875em'
+      },
+      '& h2': {
+        fontSize: '1.5em'
+      },
+      '& h3': {
+        fontSize: '1.375em'
+      },
+      '& h4': {
+        fontSize: '1.125em'
+      },
+      '& h5': {
+        fontSize: '1em',
+        margin: '0 0 12px 0'
+      },
+      '& h6': {
+        color: grayTextColor,
+        fontSize: '1em',
+        margin: '0 0 12px 0'
+      },
+      '& table': {
+        border: "1px solid ".concat(theme.Palette[_Palette.COLOR_THEMES.light][_Palette.COLOR_SHADES.shade04]),
+        borderCollapse: 'collapse',
+        margin: '0 0 24px 0',
+        width: '100%'
+      },
+      '& th, & td': {
+        border: "1px solid ".concat(theme.Palette[_Palette.COLOR_THEMES.light][_Palette.COLOR_SHADES.shade04]),
+        padding: '8px 12px',
+        textAlign: 'left'
+      },
+      '& th': {
+        backgroundColor: (theme.Palette.actions || theme.Palette)[_Palette.COLOR_THEMES.negative][_Palette.COLOR_SHADES.shade01],
+        color: grayTextColor,
+        fontWeight: _constants.WEIGHTS.medium
+      },
+      '& p': {
+        margin: '0 0 12px 0'
+      },
+      '& ol': {
+        paddingLeft: 24,
+        textAlign: 'start'
+      },
+      '& ul, & ol': {
+        margin: '0 0 24px 0'
+      },
+      '& ul:not(.contains-task-list)': {
+        paddingLeft: 24,
+        textAlign: 'start'
+      },
+      '& pre': {
+        backgroundColor: theme.Palette[_Palette.COLOR_THEMES.light][_Palette.COLOR_SHADES.shade03],
+        borderRadius: 8,
+        fontSize: '0.875em',
+        lineHeight: '1.25em',
+        margin: '0 0 24px 0',
+        padding: '12px 16px',
+        whiteSpace: 'pre-wrap'
+      },
+      '& dl': {
+        margin: '0 0 24px 0'
+      },
+      '& dd': {
+        fontSize: 'inherit',
+        margin: 0
+      },
+      '& dt': {
+        color: grayTextColor,
+        fontSize: _constants.VARIANTS_SIZES.small,
+        fontWeight: _constants.WEIGHTS.semibold
+      },
+      '& dl + dl': {
+        marginTop: -12
+      },
+      '& dt + dt, & dt + dd, & dd + dd': {
+        marginTop: 12
+      },
+      '& hr': {
+        borderColor: theme.Palette[_Palette.COLOR_THEMES.gray][_Palette.COLOR_SHADES.shade01],
+        borderTop: 0,
+        margin: '8px 0 24px'
+      },
+      '& li + li': {
+        marginTop: 12
+      },
+      '& li > ul': {
+        marginTop: 8
+      },
+      '& li::marker': {
+        color: theme.Palette[_Palette.COLOR_THEMES.gray][_Palette.COLOR_SHADES.shade01]
+      },
+      '& li > ul > li + li': {
+        marginTop: 8
+      },
+      '& li p': {
+        margin: 0
+      },
+      '& sup': {
+        fontSize: 'inherit'
+      },
+      '& sup > a': {
+        fontSize: '0.75em'
+      },
+      '& img, & video, & audio': {
+        borderRadius: 8,
+        margin: '0 0 24px 0'
+      },
+      '& .contains-task-list': {
+        display: 'flex',
+        flexDirection: 'column',
+        gridGap: '12px',
+        margin: '0 0 24px 0',
+        paddingLeft: 0,
+        '& li': {
+          margin: 0
+        }
+      },
+      '& :last-child': {
+        marginBottom: '0'
       }
+    },
+    blockquote: {
+      color: grayTextColor,
+      '&::before': {
+        background: theme.Palette[_Palette.COLOR_THEMES.gray][_Palette.COLOR_SHADES.shade01]
+      }
+    },
+    citationGroup: {
+      '&::-webkit-scrollbar-thumb': {
+        backgroundColor: theme.Palette[_Palette.COLOR_THEMES.gray][_Palette.COLOR_SHADES.shade04]
+      }
+    },
+    customFootnotes: {
+      '& span': {
+        color: grayTextColor
+      }
+    },
+    taskItemIconUnchecked: {
+      borderColor: theme.Palette[_Palette.COLOR_THEMES.gray][_Palette.COLOR_SHADES.shade01]
     }
   };
 };

package/dist/components/UTRadioGroup/versions/V1/components/Radio/theme.js

@@ -109,11 +109,7 @@ const retrieveStyle = _ref => {
         [_constants.SPACING.SMALL]: '8px',
         [_constants.SPACING.MEDIUM]: '16px'
       }[spacing],
-      minHeight: {
-        [_constants2.RADIO_VARIANTS.CARD]: '48px',
-        [_constants2.RADIO_VARIANTS.BUTTON]: '24px',
-        [_constants2.RADIO_VARIANTS.DEFAULT]: '24px'
-      }[variant],
+      minHeight: '24px',
       overflow: 'hidden',
       padding: '12px 16px',
       ...(disabled ? disabledTheme : selected ? selectedTheme : baseTheme)

package/dist/index.js

@@ -87,6 +87,12 @@ Object.defineProperty(exports, "UTCBUInput", {
     return _UTCBUInput.default;
   }
 });
+Object.defineProperty(exports, "UTCalendar", {
+  enumerable: true,
+  get: function () {
+    return _UTCalendar.default;
+  }
+});
 Object.defineProperty(exports, "UTCaptcha", {
   enumerable: true,
   get: function () {
@@ -598,4 +604,5 @@ var _WithLoading = _interopRequireDefault(require("./components/WithLoading"));
 var _WithTouch = _interopRequireDefault(require("./components/WithTouch"));
 var _stylesDeduplicationUtils = _interopRequireDefault(require("./utils/stylesDeduplicationUtils"));
 var _useScrollBasedMenu = _interopRequireDefault(require("./utils/hooks/use-scroll-based-menu"));
+var _UTCalendar = _interopRequireDefault(require("./components/UTCalendar"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@widergy/energy-ui",
-  "version": "3.123.1",
+  "version": "3.125.0",
   "description": "Widergy Web Components",
   "author": "widergy",
   "license": "MIT",
@@ -31,6 +31,7 @@
   },
   "dependencies": {
     "@babel/eslint-parser": "^7.23.10",
+    "@date-io/date-fns": "^1.3.11",
     "@date-io/dayjs": "1.x",
     "@material-ui/core": "^4.4.0",
     "@material-ui/icons": "^3.0.1",
@@ -46,6 +47,7 @@
     "babel-plugin-inline-react-svg": "^2.0.2",
     "babel-plugin-named-asset-import": "^0.3.2",
     "d3": "^7.0.1",
+    "date-fns": "2.30.0",
     "dayjs": "^1.10.7",
     "downloadjs": "^1.4.7",
     "emojilib": "^3.0.10",
@@ -67,9 +69,11 @@
     "react-window": "^1.8.5",
     "rehype-raw": "^6.1.0",
     "remark-breaks": "^3.0.2",
+    "remark-gfm": "^3.0.1",
     "sass-loader": "^10.0.5",
     "sass": "^1.80.4",
-    "seamless-immutable": "^7.1.4"
+    "seamless-immutable": "^7.1.4",
+    "unist-util-visit": "^4.0.0"
   },
   "devDependencies": {
     "@babel/cli": "^7.2.3",