@pareto-engineering/design-system 3.0.0-alpha.29 → 4.0.0-alpha.13

package/dist/cjs/a/AppContext/useTheme.js

@@ -6,14 +6,14 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = require("react");
 var _default = function _default(initialTheme) {
-  var storageKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'theme';
-  var isClient = typeof window === 'object';
-  var [preferredTheme, setPreferredTheme] = (0, _react.useState)(initialTheme);
-  var [userTheme, setUserTheme] = (0, _react.useState)();
+  let storageKey = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'theme';
+  const isClient = typeof window === 'object';
+  const [preferredTheme, setPreferredTheme] = (0, _react.useState)(initialTheme);
+  const [userTheme, setUserTheme] = (0, _react.useState)();
   (0, _react.useEffect)(() => {
-    var storage = window.localStorage;
+    const storage = window.localStorage;
     if (isClient) {
-      var storedTheme = window.localStorage.getItem(storageKey);
+      const storedTheme = window.localStorage.getItem(storageKey);
       // console.log(storedTheme, storedTheme != userTheme)
       if (storedTheme && storedTheme !== userTheme) {
         // console.warn('Theme load')
@@ -32,7 +32,7 @@ var _default = function _default(initialTheme) {
       setUserTheme('light');
     }
   }, [preferredTheme, isClient]);
-  var isTheme = (0, _react.useCallback)(theme => userTheme === theme || undefined, [userTheme]);
+  const isTheme = (0, _react.useCallback)(theme => userTheme === theme || undefined, [userTheme]);
   return {
     userTheme,
     preferredTheme,

package/dist/cjs/a/ContentTree/ContentTree.js

@@ -9,16 +9,16 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
 var _common = require("./common");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-var baseClassName = _exports.default.base;
-var componentClassName = 'content-tree';
+const baseClassName = _exports.default.base;
+const componentClassName = 'content-tree';
 
 /**
  * This is the component description.
  */
-var ContentTree = _ref => {
-  var {
+const ContentTree = _ref => {
+  let {
     id,
     className: userClassName,
     style,
@@ -26,10 +26,10 @@ var ContentTree = _ref => {
     selectors
     // ...otherProps
   } = _ref;
-  (0, React.useLayoutEffect)(() => {
+  (0, React.useInsertionEffect)(() => {
     Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
   }, []);
-  var contentTree = (0, _common.useContentTree)(target, selectors);
+  const contentTree = (0, _common.useContentTree)(target, selectors);
   return /*#__PURE__*/React.createElement("div", {
     id: id,
     className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
@@ -60,7 +60,7 @@ ContentTree.propTypes = {
    * The reference to the parent element.
    */
   target: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
-    current: _propTypes.default.instanceOf(Element)
+    current: _propTypes.default.node
   })])
 };
 ContentTree.defaultProps = {

package/dist/cjs/a/ContentTree/common/Tree/Tree.js

@@ -9,20 +9,20 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
 var _useFirstVisibleNode = _interopRequireDefault(require("../useFirstVisibleNode"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 /* @pareto-engineering/generator-front 1.0.12 */
 
 // Local Definitions
 
-var baseClassName = _exports.default.base;
-var componentClassName = 'tree';
+const baseClassName = _exports.default.base;
+const componentClassName = 'tree';
 
 /**
  * This is the component description.
  */
-var Tree = _ref => {
-  var {
+const Tree = _ref => {
+  let {
     id,
     className: userClassName,
     style,
@@ -31,20 +31,20 @@ var Tree = _ref => {
     // ...otherProps
   } = _ref;
   // The nodeIds to be used to get the first visible node
-  var [nodeIds, setNodeIds] = (0, React.useState)([]);
+  const [nodeIds, setNodeIds] = (0, React.useState)([]);
 
   // current visible nodeId
-  var visibleNodeId = (0, _useFirstVisibleNode.default)(nodeIds);
+  const visibleNodeId = (0, _useFirstVisibleNode.default)(nodeIds);
   (0, React.useEffect)(() => {
-    var node = document.getElementsByClassName(visibleNodeId)[0];
-    node === null || node === void 0 ? void 0 : node.classList.add(_exports.default.modifierActive);
+    const node = document.getElementsByClassName(visibleNodeId)[0];
+    node?.classList.add(_exports.default.modifierActive);
     return () => {
-      node === null || node === void 0 ? void 0 : node.classList.remove(_exports.default.modifierActive);
+      node?.classList.remove(_exports.default.modifierActive);
     };
   }, [visibleNodeId]);
 
   // Generate the tree structure from the content tree data depending on the display depth
-  var getNestedTree = (node, depth) => {
+  const getNestedTree = (node, depth) => {
     setNodeIds(prev => [...prev, node.id]);
     if (depth <= 1) {
       return /*#__PURE__*/React.createElement("li", {
@@ -61,7 +61,7 @@ var Tree = _ref => {
       className: node.id
     }, node.text)), node.children.length > 0 && /*#__PURE__*/React.createElement("ul", null, node.children.map(child => getNestedTree(child, depth - 1))));
   };
-  var ContentTree = (0, React.useMemo)(() => tree.map(node => getNestedTree(node, displayDepth)), [tree]);
+  const ContentTree = (0, React.useMemo)(() => tree.map(node => getNestedTree(node, displayDepth)), [tree]);
   return /*#__PURE__*/React.createElement("ul", {
     id: id,
     className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),

package/dist/cjs/a/ContentTree/common/Tree/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "Tree", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _Tree.default;
   }
 });

package/dist/cjs/a/ContentTree/common/index.js

@@ -5,19 +5,19 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "Tree", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _Tree.Tree;
   }
 });
 Object.defineProperty(exports, "useContentTree", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _useContentTree.default;
   }
 });
 Object.defineProperty(exports, "useFirstVisibleNode", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _useFirstVisibleNode.default;
   }
 });

package/dist/cjs/a/ContentTree/common/useContentTree.js

@@ -5,38 +5,38 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = require("react");
-var useContentTree = (target, selectors) => {
-  var [contentTree, setContentTree] = (0, _react.useState)([]);
-  var getNodes = (0, _react.useCallback)(parentTag => {
-    var nodeList = parentTag.querySelectorAll(selectors.join(', '));
-    var nodes = [];
+const useContentTree = (target, selectors) => {
+  const [contentTree, setContentTree] = (0, _react.useState)([]);
+  const getNodes = (0, _react.useCallback)(parentTag => {
+    const nodeList = parentTag.querySelectorAll(selectors.join(', '));
+    const nodes = [];
     nodeList.forEach(nodeNode => {
-      var {
+      const {
         id,
         innerText,
         tagName
       } = nodeNode;
       nodes.push({
-        id: "#".concat(id),
+        id: `#${id}`,
         text: innerText,
         level: selectors.indexOf(tagName.toLowerCase())
       });
     });
     return nodes;
   }, [selectors]);
-  var buildTree = (0, _react.useCallback)(nodes => {
+  const buildTree = (0, _react.useCallback)(nodes => {
     // Track the nodes we've seen so far in the same level
-    var currentSameLevelNodes = [];
+    const currentSameLevelNodes = [];
     // Track nodes of the next level which will be children of the current node
-    var nextLevelNodes = [];
+    let nextLevelNodes = [];
     // Track the current node level
-    var lastLevel = -1;
+    let lastLevel = -1;
 
     // If the nodes are empty, return an empty tree
     if (nodes.length === 0) {
       return [];
     }
-    var buildSubTree = () => {
+    const buildSubTree = () => {
       if (nextLevelNodes.length > 0) {
         currentSameLevelNodes[currentSameLevelNodes.length - 1].children.push(...buildTree(nextLevelNodes));
       }
@@ -69,8 +69,8 @@ var useContentTree = (target, selectors) => {
   }, []);
   (0, _react.useEffect)(() => {
     if (target.current) {
-      var nodes = getNodes(target.current);
-      var tree = buildTree(nodes);
+      const nodes = getNodes(target.current);
+      const tree = buildTree(nodes);
       setContentTree(tree);
     }
   }, [target.current]);

package/dist/cjs/a/ContentTree/common/useFirstVisibleNode.js

@@ -7,28 +7,27 @@ exports.default = void 0;
 var _react = require("react");
 var _debounce = _interopRequireDefault(require("lodash/debounce"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var useFirstVisibleNode = (nodeIds, config) => {
-  var [visibleNodeId, setVisibleNodeId] = (0, _react.useState)(null);
-  var {
+const useFirstVisibleNode = (nodeIds, config) => {
+  const [visibleNodeId, setVisibleNodeId] = (0, _react.useState)(null);
+  const {
     debounceMs = 25
   } = config || {};
 
   // get headlines nodes - Should only be recalculated when the ids change
-  var nodes = (0, _react.useMemo)(() => {
-    if ((nodeIds === null || nodeIds === void 0 ? void 0 : nodeIds.length) > 0) {
+  const nodes = (0, _react.useMemo)(() => {
+    if (nodeIds?.length > 0) {
       return Array.from(document.querySelectorAll(nodeIds.join(',')));
     }
     return [];
   }, [nodeIds]);
-  var getVisibleNodeId = (0, _react.useCallback)((0, _debounce.default)(() => {
-    var _visibleNode$node;
+  const getVisibleNodeId = (0, _react.useCallback)((0, _debounce.default)(() => {
     // Get the top postion of each headline node relative to the viewport
-    var topOffsets = nodes.map(node => node.getBoundingClientRect().top);
+    const topOffsets = nodes.map(node => node.getBoundingClientRect().top);
 
     // Get the node closer to zero (the top of the viewport)
     // We have the default offset as Infinity so it's always greater that the first node Y position
-    var visibleNode = topOffsets.reduce((prev, currentOffset, currentIndex) => {
-      var node = Math.abs(currentOffset - 0) < Math.abs(prev.offset - 0) ? {
+    const visibleNode = topOffsets.reduce((prev, currentOffset, currentIndex) => {
+      const node = Math.abs(currentOffset - 0) < Math.abs(prev.offset - 0) ? {
         node: nodes[currentIndex],
         offset: currentOffset
       } : prev;
@@ -39,7 +38,7 @@ var useFirstVisibleNode = (nodeIds, config) => {
     });
 
     // Set the visible node id
-    setVisibleNodeId("#".concat(visibleNode === null || visibleNode === void 0 ? void 0 : (_visibleNode$node = visibleNode.node) === null || _visibleNode$node === void 0 ? void 0 : _visibleNode$node.id));
+    setVisibleNodeId(`#${visibleNode?.node?.id}`);
   }, debounceMs), [nodes]);
 
   // Recalculate the visible node id when the page is scrolled

package/dist/cjs/a/ContentTree/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "ContentTree", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _ContentTree.default;
   }
 });

package/dist/cjs/a/ContentTree/styles.scss

@@ -1,33 +1,33 @@
 /* @pareto-engineering/generator-front 1.0.12 */
+
 @use "@pareto-engineering/bem";
 
 $default-margin: 1em;
 $default-padding: 1em;
 
-.#{bem.$base}.content-tree{
+.#{bem.$base}.content-tree {
+  ul {
+    list-style: none;
+  }
+
+  .#{bem.$base}.tree {
+    padding: 0;
+    position: sticky;
+    top: 0;
 
-    ul {
-        list-style: none;
+    .#{bem.$modifier-active} {
+      color: var(--main2);
+      transition: color .2s;
     }
 
-    .#{bem.$base}.tree {
-       position: sticky;
-       top: 0;
-       padding: 0;
-
-       .#{bem.$modifier-active} {
-         color: var(--main2);
-         transition: color 0.2s;
-       }
-
-       li:not(:last-child) {
-           margin-bottom: $default-margin;
-           ul {
-               padding-left: $default-padding;
-           }
-       }
+    li:not(:last-child) {
+      margin-bottom: $default-margin;
+
+      ul {
+        padding-left: $default-padding;
+      }
     }
+  }
 }
 
 
-

package/dist/cjs/a/Conversation/Context.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var React = _interopRequireWildcard(require("react"));
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 var _default = /*#__PURE__*/React.createContext({});
 exports.default = _default;

package/dist/cjs/a/Conversation/Conversation.js

@@ -10,16 +10,16 @@ var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports")
 var _common = require("./common");
 var _Context = _interopRequireDefault(require("./Context"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-var baseClassName = _exports.default.base;
-var componentClassName = 'conversation';
+const baseClassName = _exports.default.base;
+const componentClassName = 'conversation';
 
 /**
  * This is the component description.
  */
-var Conversation = _ref => {
-  var {
+const Conversation = _ref => {
+  let {
     id,
     className: userClassName,
     style,
@@ -30,7 +30,7 @@ var Conversation = _ref => {
     hasTriangle
     // ...otherProps
   } = _ref;
-  (0, React.useLayoutEffect)(() => {
+  (0, React.useInsertionEffect)(() => {
     Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
   }, []);
   return /*#__PURE__*/React.createElement(_Context.default.Provider, {
@@ -40,7 +40,7 @@ var Conversation = _ref => {
     }
   }, /*#__PURE__*/React.createElement("div", {
     id: id,
-    className: [baseClassName, componentClassName, userClassName, hasTriangle && 'has-triangle', "y-".concat(backgroundColor), 'u1'].filter(e => e).join(' '),
+    className: [baseClassName, componentClassName, userClassName, hasTriangle && 'has-triangle', `y-${backgroundColor}`, 'u1'].filter(e => e).join(' '),
     style: style
   }, children));
 };

package/dist/cjs/a/Conversation/common/Message/Message.js

@@ -9,20 +9,20 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
 var _useConversation = _interopRequireDefault(require("../../useConversation"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 /* @pareto-engineering/generator-front 1.0.12 */
 
 // Local Definitions
 
-var baseClassName = _exports.default.base;
-var componentClassName = 'message';
+const baseClassName = _exports.default.base;
+const componentClassName = 'message';
 
 /**
  * This is the component description.
  */
-var Message = _ref => {
-  var {
+const Message = _ref => {
+  let {
     id,
     className: userClassName,
     style,
@@ -34,20 +34,20 @@ var Message = _ref => {
     attachmentColor
     // ...otherProps
   } = _ref;
-  var {
+  const {
     ourColor,
     theirColor
   } = (0, _useConversation.default)();
   return /*#__PURE__*/React.createElement("div", {
     id: id,
-    className: [baseClassName, componentClassName, userClassName, "x-".concat(from === 'ours' ? ourColor : theirColor), from === 'ours' && 'ours', 'v1'].filter(e => e).join(' '),
+    className: [baseClassName, componentClassName, userClassName, `x-${from === 'ours' ? ourColor : theirColor}`, from === 'ours' && 'ours', 'v1'].filter(e => e).join(' '),
     style: style
   }, /*#__PURE__*/React.createElement("div", {
     className: _exports.default.elementContent
   }, /*#__PURE__*/React.createElement("p", {
     className: "sender v25 mb-v s-1"
   }, sender, ":"), /*#__PURE__*/React.createElement("p", null, message), attachment && /*#__PURE__*/React.createElement("div", {
-    className: "attachment y-".concat(attachmentColor)
+    className: `attachment y-${attachmentColor}`
   }, /*#__PURE__*/React.createElement("span", {
     className: "f-icons"
   }, attachmentIcon), /*#__PURE__*/React.createElement("p", {

package/dist/cjs/a/Conversation/common/Message/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "Message", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _Message.default;
   }
 });

package/dist/cjs/a/Conversation/common/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "Message", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _Message.Message;
   }
 });

package/dist/cjs/a/Conversation/index.js

@@ -5,19 +5,19 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "Conversation", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _Conversation.default;
   }
 });
 Object.defineProperty(exports, "ConversationContext", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _Context.default;
   }
 });
 Object.defineProperty(exports, "useConversation", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _useConversation.default;
   }
 });

package/dist/cjs/a/Conversation/styles.scss

@@ -1,4 +1,5 @@
 /* @pareto-engineering/generator-front 1.0.12 */
+/* stylelint-disable selector-max-compound-selectors -- exception */
 
 @use "@pareto-engineering/bem";
 @use "@pareto-engineering/styles/src/mixins";

package/dist/cjs/a/DotInfo/DotInfo.js

@@ -8,23 +8,18 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 // Local Definitions
 
-var baseClassName = _exports.default.base;
-var componentClassName = 'dot-info';
+const baseClassName = _exports.default.base;
+const componentClassName = 'dot-info';
 
 /**
  * This is the component description.
  */
-var DotInfo = _ref => {
-  var {
+const DotInfo = _ref => {
+  let {
     id,
     className: userClassName,
     style,
@@ -35,15 +30,16 @@ var DotInfo = _ref => {
     colorEmpty
     // ...otherProps
   } = _ref;
-  (0, React.useLayoutEffect)(() => {
+  (0, React.useInsertionEffect)(() => {
     Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
   }, []);
   return /*#__PURE__*/React.createElement("div", {
     id: id,
-    className: [baseClassName, booleanValue === false && "x-".concat(colorFalse), booleanValue === true && "x-".concat(colorTrue), [null, undefined].includes(booleanValue) && "empty x-".concat(colorEmpty), componentClassName, userClassName].filter(e => e).join(' '),
-    style: _objectSpread({
-      '--height': height
-    }, style)
+    className: [baseClassName, booleanValue === false && `x-${colorFalse}`, booleanValue === true && `x-${colorTrue}`, [null, undefined].includes(booleanValue) && `empty x-${colorEmpty}`, componentClassName, userClassName].filter(e => e).join(' '),
+    style: {
+      '--height': height,
+      ...style
+    }
   });
 };
 DotInfo.propTypes = {

package/dist/cjs/a/DotInfo/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "DotInfo", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _DotInfo.default;
   }
 });

package/dist/cjs/a/Figure/Figure.js

@@ -8,18 +8,18 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _exports = _interopRequireDefault(require("@pareto-engineering/bem/exports"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 // Local Definitions
 
-var baseClassName = _exports.default.base;
-var componentClassName = 'photo-card';
+const baseClassName = _exports.default.base;
+const componentClassName = 'photo-card';
 
 /**
  * This is the component description.
  */
-var Figure = _ref => {
-  var {
+const Figure = _ref => {
+  let {
     id,
     className: userClassName,
     style,
@@ -27,7 +27,7 @@ var Figure = _ref => {
     alt,
     caption
   } = _ref;
-  (0, React.useLayoutEffect)(() => {
+  (0, React.useInsertionEffect)(() => {
     Promise.resolve().then(() => _interopRequireWildcard(require("./styles.scss")));
   }, []);
   return /*#__PURE__*/React.createElement("div", {

package/dist/cjs/a/Figure/index.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "Figure", {
   enumerable: true,
-  get: function get() {
+  get: function () {
     return _Figure.default;
   }
 });