@bbl-digital/snorre 2.2.8 → 2.2.9

package/dist/bundle.js

@@ -24515,12 +24515,32 @@
   });
 
   const CustomTooltip = ({
+    lineConfig,
+    barConfig,
     active,
     payload,
     label
   }) => {
     const theme = react.useTheme();
 
+    const configHasProperty = config => config?.length && config.findIndex(v => v?.hasOwnProperty('shortName')) !== -1;
+
+    const payloadItemHasProperty = (config, payloadItem) => config.findIndex(v => v.name === payloadItem.name && v.shortName) !== -1;
+
+    const getTooltipItemName = payloadItem => {
+      if (!lineConfig && !barConfig) return payloadItem.name;
+
+      if (lineConfig && configHasProperty(lineConfig) && payloadItemHasProperty(lineConfig, payloadItem)) {
+        return lineConfig?.find(v => v.name === payloadItem.name)?.shortName;
+      }
+
+      if (barConfig && configHasProperty(barConfig) && payloadItemHasProperty(barConfig, payloadItem)) {
+        return barConfig?.find(v => v.name === payloadItem.name)?.shortName;
+      }
+
+      return payloadItem.name;
+    };
+
     const TooltipPayload = () => {
       return active && payload?.length && payload.map(item => /*#__PURE__*/jsxRuntime.jsxs(TooltipPayloadWrapper, {
         children: [/*#__PURE__*/jsxRuntime.jsxs(ItemNameGroup, {
@@ -24547,7 +24567,7 @@
               fill: item.color
             })
           }), /*#__PURE__*/jsxRuntime.jsxs(Text, {
-            children: [item.name, ":"]
+            children: [getTooltipItemName(item), ":"]
           })]
         }), /*#__PURE__*/jsxRuntime.jsx(Text, {
           children: getFormattedPrice(item.value, 2)
@@ -24574,19 +24594,19 @@
   } : {
     target: "eba3ez51",
     label: "LegendsContainer"
-  })(props => /*#__PURE__*/react.css("display:flex;flex-direction:row;margin:", `${props?.margin?.top}px ${props?.margin?.left}px ${props?.margin?.bottom}px ${props?.margin?.right}px`, ";>:first-of-type{margin-left:2rem;}" + (process.env.NODE_ENV === "production" ? "" : ";label:LegendsContainer;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLeUQiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRzQ29udGFpbmVyID0gc3R5bGVkLmRpdihcclxuICAocHJvcHM6IHsgbWFyZ2luOiBQYXJ0aWFsPE1hcmdpbj4gfCB1bmRlZmluZWQgfSkgPT4gY3NzYFxyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XHJcbiAgICBtYXJnaW46ICR7YCR7cHJvcHM/Lm1hcmdpbj8udG9wfXB4ICR7cHJvcHM/Lm1hcmdpbj8ubGVmdH1weCAke3Byb3BzPy5tYXJnaW4/LmJvdHRvbX1weCAke3Byb3BzPy5tYXJnaW4/LnJpZ2h0fXB4YH07XHJcbiAgICA+IDpmaXJzdC1vZi10eXBlIHtcclxuICAgICAgbWFyZ2luLWxlZnQ6IDJyZW07XHJcbiAgICB9XHJcbiAgYFxyXG4pXHJcblxyXG5leHBvcnQgY29uc3QgTGVnZW5kV3JhcHBlciA9IHN0eWxlZC5kaXZgXHJcbiAgZGlzcGxheTogZmxleDtcclxuICBhbGlnbi1pdGVtczogY2VudGVyO1xyXG4gIHRleHQtYWxpZ246IGNlbnRlcjtcclxuICBtYXJnaW46IDAgMXJlbTtcclxuICA+IHN2ZyB7XHJcbiAgICBtYXJnaW4tcmlnaHQ6IDVweDtcclxuICB9XHJcbmBcclxuIl19 */"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFJZ0MiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRzQ29udGFpbmVyID0gc3R5bGVkLmRpdihcclxuICAocHJvcHM6IHsgbWFyZ2luOiBQYXJ0aWFsPE1hcmdpbj4gfCB1bmRlZmluZWQgfSkgPT4gY3NzYFxyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XHJcbiAgICBtYXJnaW46ICR7YCR7cHJvcHM/Lm1hcmdpbj8udG9wfXB4ICR7cHJvcHM/Lm1hcmdpbj8ubGVmdH1weCAke3Byb3BzPy5tYXJnaW4/LmJvdHRvbX1weCAke3Byb3BzPy5tYXJnaW4/LnJpZ2h0fXB4YH07XHJcbiAgICA+IDpmaXJzdC1vZi10eXBlIHtcclxuICAgICAgbWFyZ2luLWxlZnQ6IDJyZW07XHJcbiAgICB9XHJcbiAgYFxyXG4pXHJcblxyXG5leHBvcnQgY29uc3QgTGVnZW5kV3JhcHBlciA9IHN0eWxlZC5kaXZgXHJcbiAgZGlzcGxheTogZmxleDtcclxuICBhbGlnbi1pdGVtczogY2VudGVyO1xyXG4gIHRleHQtYWxpZ246IGNlbnRlcjtcclxuICBtYXJnaW46IDAgMXJlbTtcclxuICA+IHN2ZyB7XHJcbiAgICBtYXJnaW4tcmlnaHQ6IDVweDtcclxuICB9XHJcbmBcclxuIl19 */");
+  })(props => /*#__PURE__*/react.css("display:grid;grid-template-columns:", props.columns ? `repeat(${props.columns}, minmax(min-content, max-content))` : 'auto', ";justify-items:start;grid-column-gap:1em;margin:", `${props?.margin?.top}px ${props?.margin?.left}px ${props?.margin?.bottom}px ${props?.margin?.right}px`, ";@media screen and (max-width: ", bp.medium, "){grid-template-columns:auto;grid-template-rows:", props.columns ? `repeat(${props.columns}, 30px)` : 'auto', ";align-items:flex-start;justify-content:start;justify-items:start;}" + (process.env.NODE_ENV === "production" ? "" : ";label:LegendsContainer;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNMkUiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuaW1wb3J0IGJwIGZyb20gJy4uLy4uLy4uL2dsb2JhbHMvc3R5bGVzL2JyZWFrcG9pbnRzJ1xyXG5cclxuZXhwb3J0IGNvbnN0IExlZ2VuZHNDb250YWluZXIgPSBzdHlsZWQuZGl2KFxyXG4gIChwcm9wczogeyBtYXJnaW46IFBhcnRpYWw8TWFyZ2luPiB8IHVuZGVmaW5lZDsgY29sdW1ucz86IG51bWJlciB9KSA9PiBjc3NgXHJcbiAgICBkaXNwbGF5OiBncmlkO1xyXG4gICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiAke3Byb3BzLmNvbHVtbnNcclxuICAgICAgPyBgcmVwZWF0KCR7cHJvcHMuY29sdW1uc30sIG1pbm1heChtaW4tY29udGVudCwgbWF4LWNvbnRlbnQpKWBcclxuICAgICAgOiAnYXV0byd9O1xyXG4gICAganVzdGlmeS1pdGVtczogc3RhcnQ7XHJcbiAgICBncmlkLWNvbHVtbi1nYXA6IDFlbTtcclxuICAgIG1hcmdpbjogJHtgJHtwcm9wcz8ubWFyZ2luPy50b3B9cHggJHtwcm9wcz8ubWFyZ2luPy5sZWZ0fXB4ICR7cHJvcHM/Lm1hcmdpbj8uYm90dG9tfXB4ICR7cHJvcHM/Lm1hcmdpbj8ucmlnaHR9cHhgfTtcclxuXHJcbiAgICBAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAke2JwLm1lZGl1bX0pIHtcclxuICAgICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiBhdXRvO1xyXG4gICAgICBncmlkLXRlbXBsYXRlLXJvd3M6ICR7cHJvcHMuY29sdW1uc1xyXG4gICAgICAgID8gYHJlcGVhdCgke3Byb3BzLmNvbHVtbnN9LCAzMHB4KWBcclxuICAgICAgICA6ICdhdXRvJ307XHJcbiAgICAgIGFsaWduLWl0ZW1zOiBmbGV4LXN0YXJ0O1xyXG4gICAgICBqdXN0aWZ5LWNvbnRlbnQ6IHN0YXJ0O1xyXG4gICAgICBqdXN0aWZ5LWl0ZW1zOiBzdGFydDtcclxuICAgIH1cclxuICBgXHJcbilcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRXcmFwcGVyID0gc3R5bGVkLmRpdmBcclxuICBkaXNwbGF5OiBmbGV4O1xyXG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XHJcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xyXG4gID4gc3ZnIHtcclxuICAgIG1hcmdpbi1yaWdodDogNXB4O1xyXG4gIH1cclxuYFxyXG4iXX0= */"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLZ0MiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuaW1wb3J0IGJwIGZyb20gJy4uLy4uLy4uL2dsb2JhbHMvc3R5bGVzL2JyZWFrcG9pbnRzJ1xyXG5cclxuZXhwb3J0IGNvbnN0IExlZ2VuZHNDb250YWluZXIgPSBzdHlsZWQuZGl2KFxyXG4gIChwcm9wczogeyBtYXJnaW46IFBhcnRpYWw8TWFyZ2luPiB8IHVuZGVmaW5lZDsgY29sdW1ucz86IG51bWJlciB9KSA9PiBjc3NgXHJcbiAgICBkaXNwbGF5OiBncmlkO1xyXG4gICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiAke3Byb3BzLmNvbHVtbnNcclxuICAgICAgPyBgcmVwZWF0KCR7cHJvcHMuY29sdW1uc30sIG1pbm1heChtaW4tY29udGVudCwgbWF4LWNvbnRlbnQpKWBcclxuICAgICAgOiAnYXV0byd9O1xyXG4gICAganVzdGlmeS1pdGVtczogc3RhcnQ7XHJcbiAgICBncmlkLWNvbHVtbi1nYXA6IDFlbTtcclxuICAgIG1hcmdpbjogJHtgJHtwcm9wcz8ubWFyZ2luPy50b3B9cHggJHtwcm9wcz8ubWFyZ2luPy5sZWZ0fXB4ICR7cHJvcHM/Lm1hcmdpbj8uYm90dG9tfXB4ICR7cHJvcHM/Lm1hcmdpbj8ucmlnaHR9cHhgfTtcclxuXHJcbiAgICBAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAke2JwLm1lZGl1bX0pIHtcclxuICAgICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiBhdXRvO1xyXG4gICAgICBncmlkLXRlbXBsYXRlLXJvd3M6ICR7cHJvcHMuY29sdW1uc1xyXG4gICAgICAgID8gYHJlcGVhdCgke3Byb3BzLmNvbHVtbnN9LCAzMHB4KWBcclxuICAgICAgICA6ICdhdXRvJ307XHJcbiAgICAgIGFsaWduLWl0ZW1zOiBmbGV4LXN0YXJ0O1xyXG4gICAgICBqdXN0aWZ5LWNvbnRlbnQ6IHN0YXJ0O1xyXG4gICAgICBqdXN0aWZ5LWl0ZW1zOiBzdGFydDtcclxuICAgIH1cclxuICBgXHJcbilcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRXcmFwcGVyID0gc3R5bGVkLmRpdmBcclxuICBkaXNwbGF5OiBmbGV4O1xyXG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XHJcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xyXG4gID4gc3ZnIHtcclxuICAgIG1hcmdpbi1yaWdodDogNXB4O1xyXG4gIH1cclxuYFxyXG4iXX0= */");
   const LegendWrapper = _styled__default['default']("div", process.env.NODE_ENV === "production" ? {
     target: "eba3ez50"
   } : {
     target: "eba3ez50",
     label: "LegendWrapper"
   })(process.env.NODE_ENV === "production" ? {
-    name: "1060gwv",
-    styles: "display:flex;align-items:center;text-align:center;margin:0 1rem;>svg{margin-right:5px;}"
+    name: "bdj8j3",
+    styles: "display:flex;align-items:center;text-align:center;>svg{margin-right:5px;}"
   } : {
-    name: "1060gwv",
-    styles: "display:flex;align-items:center;text-align:center;margin:0 1rem;>svg{margin-right:5px;}",
-    map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFldUMiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRzQ29udGFpbmVyID0gc3R5bGVkLmRpdihcclxuICAocHJvcHM6IHsgbWFyZ2luOiBQYXJ0aWFsPE1hcmdpbj4gfCB1bmRlZmluZWQgfSkgPT4gY3NzYFxyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XHJcbiAgICBtYXJnaW46ICR7YCR7cHJvcHM/Lm1hcmdpbj8udG9wfXB4ICR7cHJvcHM/Lm1hcmdpbj8ubGVmdH1weCAke3Byb3BzPy5tYXJnaW4/LmJvdHRvbX1weCAke3Byb3BzPy5tYXJnaW4/LnJpZ2h0fXB4YH07XHJcbiAgICA+IDpmaXJzdC1vZi10eXBlIHtcclxuICAgICAgbWFyZ2luLWxlZnQ6IDJyZW07XHJcbiAgICB9XHJcbiAgYFxyXG4pXHJcblxyXG5leHBvcnQgY29uc3QgTGVnZW5kV3JhcHBlciA9IHN0eWxlZC5kaXZgXHJcbiAgZGlzcGxheTogZmxleDtcclxuICBhbGlnbi1pdGVtczogY2VudGVyO1xyXG4gIHRleHQtYWxpZ246IGNlbnRlcjtcclxuICBtYXJnaW46IDAgMXJlbTtcclxuICA+IHN2ZyB7XHJcbiAgICBtYXJnaW4tcmlnaHQ6IDVweDtcclxuICB9XHJcbmBcclxuIl19 */",
+    name: "bdj8j3",
+    styles: "display:flex;align-items:center;text-align:center;>svg{margin-right:5px;}",
+    map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQnVDIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xyXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcclxuaW1wb3J0IHsgTWFyZ2luIH0gZnJvbSAncmVjaGFydHMnXHJcbmltcG9ydCBicCBmcm9tICcuLi8uLi8uLi9nbG9iYWxzL3N0eWxlcy9icmVha3BvaW50cydcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRzQ29udGFpbmVyID0gc3R5bGVkLmRpdihcclxuICAocHJvcHM6IHsgbWFyZ2luOiBQYXJ0aWFsPE1hcmdpbj4gfCB1bmRlZmluZWQ7IGNvbHVtbnM/OiBudW1iZXIgfSkgPT4gY3NzYFxyXG4gICAgZGlzcGxheTogZ3JpZDtcclxuICAgIGdyaWQtdGVtcGxhdGUtY29sdW1uczogJHtwcm9wcy5jb2x1bW5zXHJcbiAgICAgID8gYHJlcGVhdCgke3Byb3BzLmNvbHVtbnN9LCBtaW5tYXgobWluLWNvbnRlbnQsIG1heC1jb250ZW50KSlgXHJcbiAgICAgIDogJ2F1dG8nfTtcclxuICAgIGp1c3RpZnktaXRlbXM6IHN0YXJ0O1xyXG4gICAgZ3JpZC1jb2x1bW4tZ2FwOiAxZW07XHJcbiAgICBtYXJnaW46ICR7YCR7cHJvcHM/Lm1hcmdpbj8udG9wfXB4ICR7cHJvcHM/Lm1hcmdpbj8ubGVmdH1weCAke3Byb3BzPy5tYXJnaW4/LmJvdHRvbX1weCAke3Byb3BzPy5tYXJnaW4/LnJpZ2h0fXB4YH07XHJcblxyXG4gICAgQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogJHticC5tZWRpdW19KSB7XHJcbiAgICAgIGdyaWQtdGVtcGxhdGUtY29sdW1uczogYXV0bztcclxuICAgICAgZ3JpZC10ZW1wbGF0ZS1yb3dzOiAke3Byb3BzLmNvbHVtbnNcclxuICAgICAgICA/IGByZXBlYXQoJHtwcm9wcy5jb2x1bW5zfSwgMzBweClgXHJcbiAgICAgICAgOiAnYXV0byd9O1xyXG4gICAgICBhbGlnbi1pdGVtczogZmxleC1zdGFydDtcclxuICAgICAganVzdGlmeS1jb250ZW50OiBzdGFydDtcclxuICAgICAganVzdGlmeS1pdGVtczogc3RhcnQ7XHJcbiAgICB9XHJcbiAgYFxyXG4pXHJcblxyXG5leHBvcnQgY29uc3QgTGVnZW5kV3JhcHBlciA9IHN0eWxlZC5kaXZgXHJcbiAgZGlzcGxheTogZmxleDtcclxuICBhbGlnbi1pdGVtczogY2VudGVyO1xyXG4gIHRleHQtYWxpZ246IGNlbnRlcjtcclxuICA+IHN2ZyB7XHJcbiAgICBtYXJnaW4tcmlnaHQ6IDVweDtcclxuICB9XHJcbmBcclxuIl19 */",
     toString: _EMOTION_STRINGIFIED_CSS_ERROR__$x
   });
 
@@ -24596,6 +24616,7 @@
     } = props;
     return /*#__PURE__*/jsxRuntime.jsx(LegendsContainer, {
       margin: margin && margin,
+      columns: props?.payload?.length,
       children: props?.payload?.length && props.payload.map(legend => /*#__PURE__*/jsxRuntime.jsxs(LegendWrapper, {
         children: [/*#__PURE__*/jsxRuntime.jsxs("svg", {
           width: "16",
@@ -24678,7 +24699,7 @@
             align: legendHAlign && legendHAlign,
             content: /*#__PURE__*/jsxRuntime.jsx(CustomLegend, {}),
             wrapperStyle: {
-              paddingLeft: legendPadding?.left ? legendPadding.left : '27px',
+              paddingLeft: legendPadding?.left ? legendPadding.left : '55px',
               paddingTop: legendPadding?.top ? legendPadding.top : '10px',
               paddingBottom: legendPadding?.bottom ? legendPadding.bottom : '0',
               paddingRight: legendPadding?.right ? legendPadding.right : '0'
@@ -24731,7 +24752,7 @@
           data: data && data,
           margin: {
             top: 10,
-            right: 27,
+            right: 50,
             bottom: 0,
             left: 0,
             ...margin
@@ -24759,7 +24780,10 @@
             type: layout === 'vertical' ? 'category' : 'number',
             tickFormatter: formatAxisPrice
           }), /*#__PURE__*/jsxRuntime.jsx(recharts.Tooltip, {
-            content: /*#__PURE__*/jsxRuntime.jsx(CustomTooltip, {})
+            content: /*#__PURE__*/jsxRuntime.jsx(CustomTooltip, {
+              barConfig: bars && bars,
+              lineConfig: lines && lines
+            })
           }), /*#__PURE__*/jsxRuntime.jsx(recharts.Legend, {
             verticalAlign: legendVAlign && legendVAlign,
             align: legendHAlign && legendHAlign,
@@ -29646,7 +29670,7 @@
             align: legendHAlign && legendHAlign,
             content: /*#__PURE__*/jsxRuntime.jsx(CustomLegend, {}),
             wrapperStyle: {
-              paddingLeft: legendPadding?.left ? legendPadding.left : '20px',
+              paddingLeft: legendPadding?.left ? legendPadding.left : '50px',
               paddingTop: legendPadding?.top ? legendPadding.top : '10px',
               paddingBottom: legendPadding?.bottom ? legendPadding.bottom : '0',
               paddingRight: legendPadding?.right ? legendPadding.right : '0'

package/esm/core/BarAndLineComposedChart/index.js

@@ -35,7 +35,7 @@ const BarAndLineComposedChart = ({
         data: data && data,
         margin: {
           top: 10,
-          right: 27,
+          right: 50,
           bottom: 0,
           left: 0,
           ...margin
@@ -63,7 +63,10 @@ const BarAndLineComposedChart = ({
           type: layout === 'vertical' ? 'category' : 'number',
           tickFormatter: formatAxisPrice
         }), /*#__PURE__*/_jsx(Tooltip, {
-          content: /*#__PURE__*/_jsx(CustomTooltip, {})
+          content: /*#__PURE__*/_jsx(CustomTooltip, {
+            barConfig: bars && bars,
+            lineConfig: lines && lines
+          })
         }), /*#__PURE__*/_jsx(Legend, {
           verticalAlign: legendVAlign && legendVAlign,
           align: legendHAlign && legendHAlign,

package/esm/core/SimpleBarChart/index.js

@@ -63,7 +63,7 @@ const SimpleBarChart = ({
           align: legendHAlign && legendHAlign,
           content: /*#__PURE__*/_jsx(CustomLegend, {}),
           wrapperStyle: {
-            paddingLeft: legendPadding?.left ? legendPadding.left : '27px',
+            paddingLeft: legendPadding?.left ? legendPadding.left : '55px',
             paddingTop: legendPadding?.top ? legendPadding.top : '10px',
             paddingBottom: legendPadding?.bottom ? legendPadding.bottom : '0',
             paddingRight: legendPadding?.right ? legendPadding.right : '0'

package/esm/core/SimpleLineChart/index.js

@@ -60,7 +60,7 @@ const SimpleLineChart = ({
           align: legendHAlign && legendHAlign,
           content: /*#__PURE__*/_jsx(CustomLegend, {}),
           wrapperStyle: {
-            paddingLeft: legendPadding?.left ? legendPadding.left : '20px',
+            paddingLeft: legendPadding?.left ? legendPadding.left : '50px',
             paddingTop: legendPadding?.top ? legendPadding.top : '10px',
             paddingBottom: legendPadding?.bottom ? legendPadding.bottom : '0',
             paddingRight: legendPadding?.right ? legendPadding.right : '0'

package/esm/shared/recharts/CustomLegend/index.js

@@ -9,6 +9,7 @@ export const CustomLegend = props => {
   } = props;
   return /*#__PURE__*/_jsx(LegendsContainer, {
     margin: margin && margin,
+    columns: props?.payload?.length,
     children: props?.payload?.length && props.payload.map(legend => /*#__PURE__*/_jsxs(LegendWrapper, {
       children: [/*#__PURE__*/_jsxs("svg", {
         width: "16",

package/esm/shared/recharts/CustomLegend/styles.js

@@ -3,23 +3,24 @@ import _styled from "@emotion/styled/base";
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 
 import { css } from '@emotion/react';
+import bp from '../../../globals/styles/breakpoints';
 export const LegendsContainer = _styled("div", process.env.NODE_ENV === "production" ? {
   target: "eba3ez51"
 } : {
   target: "eba3ez51",
   label: "LegendsContainer"
-})(props => /*#__PURE__*/css("display:flex;flex-direction:row;margin:", `${props?.margin?.top}px ${props?.margin?.left}px ${props?.margin?.bottom}px ${props?.margin?.right}px`, ";>:first-of-type{margin-left:2rem;}" + (process.env.NODE_ENV === "production" ? "" : ";label:LegendsContainer;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLeUQiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRzQ29udGFpbmVyID0gc3R5bGVkLmRpdihcclxuICAocHJvcHM6IHsgbWFyZ2luOiBQYXJ0aWFsPE1hcmdpbj4gfCB1bmRlZmluZWQgfSkgPT4gY3NzYFxyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XHJcbiAgICBtYXJnaW46ICR7YCR7cHJvcHM/Lm1hcmdpbj8udG9wfXB4ICR7cHJvcHM/Lm1hcmdpbj8ubGVmdH1weCAke3Byb3BzPy5tYXJnaW4/LmJvdHRvbX1weCAke3Byb3BzPy5tYXJnaW4/LnJpZ2h0fXB4YH07XHJcbiAgICA+IDpmaXJzdC1vZi10eXBlIHtcclxuICAgICAgbWFyZ2luLWxlZnQ6IDJyZW07XHJcbiAgICB9XHJcbiAgYFxyXG4pXHJcblxyXG5leHBvcnQgY29uc3QgTGVnZW5kV3JhcHBlciA9IHN0eWxlZC5kaXZgXHJcbiAgZGlzcGxheTogZmxleDtcclxuICBhbGlnbi1pdGVtczogY2VudGVyO1xyXG4gIHRleHQtYWxpZ246IGNlbnRlcjtcclxuICBtYXJnaW46IDAgMXJlbTtcclxuICA+IHN2ZyB7XHJcbiAgICBtYXJnaW4tcmlnaHQ6IDVweDtcclxuICB9XHJcbmBcclxuIl19 */"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFJZ0MiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRzQ29udGFpbmVyID0gc3R5bGVkLmRpdihcclxuICAocHJvcHM6IHsgbWFyZ2luOiBQYXJ0aWFsPE1hcmdpbj4gfCB1bmRlZmluZWQgfSkgPT4gY3NzYFxyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XHJcbiAgICBtYXJnaW46ICR7YCR7cHJvcHM/Lm1hcmdpbj8udG9wfXB4ICR7cHJvcHM/Lm1hcmdpbj8ubGVmdH1weCAke3Byb3BzPy5tYXJnaW4/LmJvdHRvbX1weCAke3Byb3BzPy5tYXJnaW4/LnJpZ2h0fXB4YH07XHJcbiAgICA+IDpmaXJzdC1vZi10eXBlIHtcclxuICAgICAgbWFyZ2luLWxlZnQ6IDJyZW07XHJcbiAgICB9XHJcbiAgYFxyXG4pXHJcblxyXG5leHBvcnQgY29uc3QgTGVnZW5kV3JhcHBlciA9IHN0eWxlZC5kaXZgXHJcbiAgZGlzcGxheTogZmxleDtcclxuICBhbGlnbi1pdGVtczogY2VudGVyO1xyXG4gIHRleHQtYWxpZ246IGNlbnRlcjtcclxuICBtYXJnaW46IDAgMXJlbTtcclxuICA+IHN2ZyB7XHJcbiAgICBtYXJnaW4tcmlnaHQ6IDVweDtcclxuICB9XHJcbmBcclxuIl19 */");
+})(props => /*#__PURE__*/css("display:grid;grid-template-columns:", props.columns ? `repeat(${props.columns}, minmax(min-content, max-content))` : 'auto', ";justify-items:start;grid-column-gap:1em;margin:", `${props?.margin?.top}px ${props?.margin?.left}px ${props?.margin?.bottom}px ${props?.margin?.right}px`, ";@media screen and (max-width: ", bp.medium, "){grid-template-columns:auto;grid-template-rows:", props.columns ? `repeat(${props.columns}, 30px)` : 'auto', ";align-items:flex-start;justify-content:start;justify-items:start;}" + (process.env.NODE_ENV === "production" ? "" : ";label:LegendsContainer;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNMkUiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuaW1wb3J0IGJwIGZyb20gJy4uLy4uLy4uL2dsb2JhbHMvc3R5bGVzL2JyZWFrcG9pbnRzJ1xyXG5cclxuZXhwb3J0IGNvbnN0IExlZ2VuZHNDb250YWluZXIgPSBzdHlsZWQuZGl2KFxyXG4gIChwcm9wczogeyBtYXJnaW46IFBhcnRpYWw8TWFyZ2luPiB8IHVuZGVmaW5lZDsgY29sdW1ucz86IG51bWJlciB9KSA9PiBjc3NgXHJcbiAgICBkaXNwbGF5OiBncmlkO1xyXG4gICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiAke3Byb3BzLmNvbHVtbnNcclxuICAgICAgPyBgcmVwZWF0KCR7cHJvcHMuY29sdW1uc30sIG1pbm1heChtaW4tY29udGVudCwgbWF4LWNvbnRlbnQpKWBcclxuICAgICAgOiAnYXV0byd9O1xyXG4gICAganVzdGlmeS1pdGVtczogc3RhcnQ7XHJcbiAgICBncmlkLWNvbHVtbi1nYXA6IDFlbTtcclxuICAgIG1hcmdpbjogJHtgJHtwcm9wcz8ubWFyZ2luPy50b3B9cHggJHtwcm9wcz8ubWFyZ2luPy5sZWZ0fXB4ICR7cHJvcHM/Lm1hcmdpbj8uYm90dG9tfXB4ICR7cHJvcHM/Lm1hcmdpbj8ucmlnaHR9cHhgfTtcclxuXHJcbiAgICBAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAke2JwLm1lZGl1bX0pIHtcclxuICAgICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiBhdXRvO1xyXG4gICAgICBncmlkLXRlbXBsYXRlLXJvd3M6ICR7cHJvcHMuY29sdW1uc1xyXG4gICAgICAgID8gYHJlcGVhdCgke3Byb3BzLmNvbHVtbnN9LCAzMHB4KWBcclxuICAgICAgICA6ICdhdXRvJ307XHJcbiAgICAgIGFsaWduLWl0ZW1zOiBmbGV4LXN0YXJ0O1xyXG4gICAgICBqdXN0aWZ5LWNvbnRlbnQ6IHN0YXJ0O1xyXG4gICAgICBqdXN0aWZ5LWl0ZW1zOiBzdGFydDtcclxuICAgIH1cclxuICBgXHJcbilcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRXcmFwcGVyID0gc3R5bGVkLmRpdmBcclxuICBkaXNwbGF5OiBmbGV4O1xyXG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XHJcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xyXG4gID4gc3ZnIHtcclxuICAgIG1hcmdpbi1yaWdodDogNXB4O1xyXG4gIH1cclxuYFxyXG4iXX0= */"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLZ0MiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuaW1wb3J0IGJwIGZyb20gJy4uLy4uLy4uL2dsb2JhbHMvc3R5bGVzL2JyZWFrcG9pbnRzJ1xyXG5cclxuZXhwb3J0IGNvbnN0IExlZ2VuZHNDb250YWluZXIgPSBzdHlsZWQuZGl2KFxyXG4gIChwcm9wczogeyBtYXJnaW46IFBhcnRpYWw8TWFyZ2luPiB8IHVuZGVmaW5lZDsgY29sdW1ucz86IG51bWJlciB9KSA9PiBjc3NgXHJcbiAgICBkaXNwbGF5OiBncmlkO1xyXG4gICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiAke3Byb3BzLmNvbHVtbnNcclxuICAgICAgPyBgcmVwZWF0KCR7cHJvcHMuY29sdW1uc30sIG1pbm1heChtaW4tY29udGVudCwgbWF4LWNvbnRlbnQpKWBcclxuICAgICAgOiAnYXV0byd9O1xyXG4gICAganVzdGlmeS1pdGVtczogc3RhcnQ7XHJcbiAgICBncmlkLWNvbHVtbi1nYXA6IDFlbTtcclxuICAgIG1hcmdpbjogJHtgJHtwcm9wcz8ubWFyZ2luPy50b3B9cHggJHtwcm9wcz8ubWFyZ2luPy5sZWZ0fXB4ICR7cHJvcHM/Lm1hcmdpbj8uYm90dG9tfXB4ICR7cHJvcHM/Lm1hcmdpbj8ucmlnaHR9cHhgfTtcclxuXHJcbiAgICBAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAke2JwLm1lZGl1bX0pIHtcclxuICAgICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiBhdXRvO1xyXG4gICAgICBncmlkLXRlbXBsYXRlLXJvd3M6ICR7cHJvcHMuY29sdW1uc1xyXG4gICAgICAgID8gYHJlcGVhdCgke3Byb3BzLmNvbHVtbnN9LCAzMHB4KWBcclxuICAgICAgICA6ICdhdXRvJ307XHJcbiAgICAgIGFsaWduLWl0ZW1zOiBmbGV4LXN0YXJ0O1xyXG4gICAgICBqdXN0aWZ5LWNvbnRlbnQ6IHN0YXJ0O1xyXG4gICAgICBqdXN0aWZ5LWl0ZW1zOiBzdGFydDtcclxuICAgIH1cclxuICBgXHJcbilcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRXcmFwcGVyID0gc3R5bGVkLmRpdmBcclxuICBkaXNwbGF5OiBmbGV4O1xyXG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XHJcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xyXG4gID4gc3ZnIHtcclxuICAgIG1hcmdpbi1yaWdodDogNXB4O1xyXG4gIH1cclxuYFxyXG4iXX0= */");
 export const LegendWrapper = _styled("div", process.env.NODE_ENV === "production" ? {
   target: "eba3ez50"
 } : {
   target: "eba3ez50",
   label: "LegendWrapper"
 })(process.env.NODE_ENV === "production" ? {
-  name: "1060gwv",
-  styles: "display:flex;align-items:center;text-align:center;margin:0 1rem;>svg{margin-right:5px;}"
+  name: "bdj8j3",
+  styles: "display:flex;align-items:center;text-align:center;>svg{margin-right:5px;}"
 } : {
-  name: "1060gwv",
-  styles: "display:flex;align-items:center;text-align:center;margin:0 1rem;>svg{margin-right:5px;}",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFldUMiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRzQ29udGFpbmVyID0gc3R5bGVkLmRpdihcclxuICAocHJvcHM6IHsgbWFyZ2luOiBQYXJ0aWFsPE1hcmdpbj4gfCB1bmRlZmluZWQgfSkgPT4gY3NzYFxyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XHJcbiAgICBtYXJnaW46ICR7YCR7cHJvcHM/Lm1hcmdpbj8udG9wfXB4ICR7cHJvcHM/Lm1hcmdpbj8ubGVmdH1weCAke3Byb3BzPy5tYXJnaW4/LmJvdHRvbX1weCAke3Byb3BzPy5tYXJnaW4/LnJpZ2h0fXB4YH07XHJcbiAgICA+IDpmaXJzdC1vZi10eXBlIHtcclxuICAgICAgbWFyZ2luLWxlZnQ6IDJyZW07XHJcbiAgICB9XHJcbiAgYFxyXG4pXHJcblxyXG5leHBvcnQgY29uc3QgTGVnZW5kV3JhcHBlciA9IHN0eWxlZC5kaXZgXHJcbiAgZGlzcGxheTogZmxleDtcclxuICBhbGlnbi1pdGVtczogY2VudGVyO1xyXG4gIHRleHQtYWxpZ246IGNlbnRlcjtcclxuICBtYXJnaW46IDAgMXJlbTtcclxuICA+IHN2ZyB7XHJcbiAgICBtYXJnaW4tcmlnaHQ6IDVweDtcclxuICB9XHJcbmBcclxuIl19 */",
+  name: "bdj8j3",
+  styles: "display:flex;align-items:center;text-align:center;>svg{margin-right:5px;}",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQnVDIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xyXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcclxuaW1wb3J0IHsgTWFyZ2luIH0gZnJvbSAncmVjaGFydHMnXHJcbmltcG9ydCBicCBmcm9tICcuLi8uLi8uLi9nbG9iYWxzL3N0eWxlcy9icmVha3BvaW50cydcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRzQ29udGFpbmVyID0gc3R5bGVkLmRpdihcclxuICAocHJvcHM6IHsgbWFyZ2luOiBQYXJ0aWFsPE1hcmdpbj4gfCB1bmRlZmluZWQ7IGNvbHVtbnM/OiBudW1iZXIgfSkgPT4gY3NzYFxyXG4gICAgZGlzcGxheTogZ3JpZDtcclxuICAgIGdyaWQtdGVtcGxhdGUtY29sdW1uczogJHtwcm9wcy5jb2x1bW5zXHJcbiAgICAgID8gYHJlcGVhdCgke3Byb3BzLmNvbHVtbnN9LCBtaW5tYXgobWluLWNvbnRlbnQsIG1heC1jb250ZW50KSlgXHJcbiAgICAgIDogJ2F1dG8nfTtcclxuICAgIGp1c3RpZnktaXRlbXM6IHN0YXJ0O1xyXG4gICAgZ3JpZC1jb2x1bW4tZ2FwOiAxZW07XHJcbiAgICBtYXJnaW46ICR7YCR7cHJvcHM/Lm1hcmdpbj8udG9wfXB4ICR7cHJvcHM/Lm1hcmdpbj8ubGVmdH1weCAke3Byb3BzPy5tYXJnaW4/LmJvdHRvbX1weCAke3Byb3BzPy5tYXJnaW4/LnJpZ2h0fXB4YH07XHJcblxyXG4gICAgQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogJHticC5tZWRpdW19KSB7XHJcbiAgICAgIGdyaWQtdGVtcGxhdGUtY29sdW1uczogYXV0bztcclxuICAgICAgZ3JpZC10ZW1wbGF0ZS1yb3dzOiAke3Byb3BzLmNvbHVtbnNcclxuICAgICAgICA/IGByZXBlYXQoJHtwcm9wcy5jb2x1bW5zfSwgMzBweClgXHJcbiAgICAgICAgOiAnYXV0byd9O1xyXG4gICAgICBhbGlnbi1pdGVtczogZmxleC1zdGFydDtcclxuICAgICAganVzdGlmeS1jb250ZW50OiBzdGFydDtcclxuICAgICAganVzdGlmeS1pdGVtczogc3RhcnQ7XHJcbiAgICB9XHJcbiAgYFxyXG4pXHJcblxyXG5leHBvcnQgY29uc3QgTGVnZW5kV3JhcHBlciA9IHN0eWxlZC5kaXZgXHJcbiAgZGlzcGxheTogZmxleDtcclxuICBhbGlnbi1pdGVtczogY2VudGVyO1xyXG4gIHRleHQtYWxpZ246IGNlbnRlcjtcclxuICA+IHN2ZyB7XHJcbiAgICBtYXJnaW4tcmlnaHQ6IDVweDtcclxuICB9XHJcbmBcclxuIl19 */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });

package/esm/shared/recharts/CustomTooltip/index.js

@@ -7,12 +7,32 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 
 const CustomTooltip = ({
+  lineConfig,
+  barConfig,
   active,
   payload,
   label
 }) => {
   const theme = useTheme();
 
+  const configHasProperty = config => config?.length && config.findIndex(v => v?.hasOwnProperty('shortName')) !== -1;
+
+  const payloadItemHasProperty = (config, payloadItem) => config.findIndex(v => v.name === payloadItem.name && v.shortName) !== -1;
+
+  const getTooltipItemName = payloadItem => {
+    if (!lineConfig && !barConfig) return payloadItem.name;
+
+    if (lineConfig && configHasProperty(lineConfig) && payloadItemHasProperty(lineConfig, payloadItem)) {
+      return lineConfig?.find(v => v.name === payloadItem.name)?.shortName;
+    }
+
+    if (barConfig && configHasProperty(barConfig) && payloadItemHasProperty(barConfig, payloadItem)) {
+      return barConfig?.find(v => v.name === payloadItem.name)?.shortName;
+    }
+
+    return payloadItem.name;
+  };
+
   const TooltipPayload = () => {
     return active && payload?.length && payload.map(item => /*#__PURE__*/_jsxs(TooltipPayloadWrapper, {
       children: [/*#__PURE__*/_jsxs(ItemNameGroup, {
@@ -39,7 +59,7 @@ const CustomTooltip = ({
             fill: item.color
           })
         }), /*#__PURE__*/_jsxs(Text, {
-          children: [item.name, ":"]
+          children: [getTooltipItemName(item), ":"]
         })]
       }), /*#__PURE__*/_jsx(Text, {
         children: getFormattedPrice(item.value, 2)

package/lib/core/BarAndLineComposedChart/index.d.ts

@@ -8,6 +8,7 @@ interface IProps extends Partial<ComposedChart> {
         name: string;
         dataKey: string;
         fill: string;
+        shortName?: string;
     }[];
     /** Array of each line in the ComposedChart: e.g [{ name:"Akkumulert", dataKey: "akkumulert",	stroke: theme.secondary. type:"monotone"}]. Value of dataKey correlates to a property in the data source. Stroke sets the color of the line. */
     lines: {
@@ -15,6 +16,7 @@ interface IProps extends Partial<ComposedChart> {
         dataKey: string;
         stroke: string;
         type: LineType;
+        shortName?: string;
     }[];
     /** xAxisDataKey: Looks at a property in the data source which will provide a name for each entry in the chart */
     xAxisDataKey: string;
@@ -36,7 +38,7 @@ interface IProps extends Partial<ComposedChart> {
     legendHAlign?: 'left' | 'center' | 'right';
     /**legendVAlign: vertical position of the caption for the content. Default is bottom */
     legendVAlign?: 'top' | 'middle' | 'bottom';
-    /** legendPadding: Sets padding for the Legend. Default is top: 10px, right: 27px, left: 0, bottom: 0 */
+    /** legendPadding: Sets padding for the Legend. Default is top: 10px, right: 50px, left: 0, bottom: 0 */
     margin?: Margin;
     /** legendPadding: Sets padding for the Legend. Default is top: 10px, right: 0, left: 5px, bottom: 0 */
     legendPadding?: {

package/lib/core/BarAndLineComposedChart/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/packages/core/BarAndLineComposedChart/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAGL,aAAa,EAGb,QAAQ,EACR,MAAM,EAMP,MAAM,UAAU,CAAA;AAKjB,UAAU,MAAO,SAAQ,OAAO,CAAC,aAAa,CAAC;IAC7C,wFAAwF;IACxF,IAAI,EAAE,GAAG,EAAE,CAAA;IACX,6MAA6M;IAC7M,IAAI,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,EAAE,CAAA;IACvD,6OAA6O;IAC7O,KAAK,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,QAAQ,CAAA;KAAE,EAAE,CAAA;IAC1E,iHAAiH;IACjH,YAAY,EAAE,MAAM,CAAA;IACpB,gHAAgH;IAChH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,+BAA+B;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,8BAA8B;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,sEAAsE;IACtE,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,qEAAqE;IACrE,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,uFAAuF;IACvF,YAAY,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;IAC1C,uFAAuF;IACvF,YAAY,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;IAC1C,wGAAwG;IACxG,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,uGAAuG;IACvG,aAAa,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAA;IAC5E,sEAAsE;IACtE,MAAM,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IAClC,uEAAuE;IACvE,eAAe,CAAC,EAAE,MAAM,CAAA;CACzB;AACD,QAAA,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,MAAM,CA2F7C,CAAA;AAED,eAAe,uBAAuB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/packages/core/BarAndLineComposedChart/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAGL,aAAa,EAGb,QAAQ,EACR,MAAM,EAMP,MAAM,UAAU,CAAA;AAKjB,UAAU,MAAO,SAAQ,OAAO,CAAC,aAAa,CAAC;IAC7C,wFAAwF;IACxF,IAAI,EAAE,GAAG,EAAE,CAAA;IACX,6MAA6M;IAC7M,IAAI,EAAE;QACJ,IAAI,EAAE,MAAM,CAAA;QACZ,OAAO,EAAE,MAAM,CAAA;QACf,IAAI,EAAE,MAAM,CAAA;QAEZ,SAAS,CAAC,EAAE,MAAM,CAAA;KACnB,EAAE,CAAA;IACH,6OAA6O;IAC7O,KAAK,EAAE;QACL,IAAI,EAAE,MAAM,CAAA;QACZ,OAAO,EAAE,MAAM,CAAA;QACf,MAAM,EAAE,MAAM,CAAA;QACd,IAAI,EAAE,QAAQ,CAAA;QAEd,SAAS,CAAC,EAAE,MAAM,CAAA;KACnB,EAAE,CAAA;IACH,iHAAiH;IACjH,YAAY,EAAE,MAAM,CAAA;IACpB,gHAAgH;IAChH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,+BAA+B;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,8BAA8B;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,sEAAsE;IACtE,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,qEAAqE;IACrE,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,uFAAuF;IACvF,YAAY,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;IAC1C,uFAAuF;IACvF,YAAY,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;IAC1C,wGAAwG;IACxG,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,uGAAuG;IACvG,aAAa,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAA;IAC5E,sEAAsE;IACtE,MAAM,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;IAClC,uEAAuE;IACvE,eAAe,CAAC,EAAE,MAAM,CAAA;CACzB;AACD,QAAA,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,MAAM,CAkG7C,CAAA;AAED,eAAe,uBAAuB,CAAA"}

package/lib/core/BarAndLineComposedChart/index.js

@@ -35,7 +35,7 @@ const BarAndLineComposedChart = ({
         data: data && data,
         margin: {
           top: 10,
-          right: 27,
+          right: 50,
           bottom: 0,
           left: 0,
           ...margin
@@ -63,7 +63,10 @@ const BarAndLineComposedChart = ({
           type: layout === 'vertical' ? 'category' : 'number',
           tickFormatter: formatAxisPrice
         }), /*#__PURE__*/_jsx(Tooltip, {
-          content: /*#__PURE__*/_jsx(CustomTooltip, {})
+          content: /*#__PURE__*/_jsx(CustomTooltip, {
+            barConfig: bars && bars,
+            lineConfig: lines && lines
+          })
         }), /*#__PURE__*/_jsx(Legend, {
           verticalAlign: legendVAlign && legendVAlign,
           align: legendHAlign && legendHAlign,

package/lib/core/SimpleBarChart/index.d.ts

@@ -31,7 +31,7 @@ interface IProps extends Partial<Bar> {
     legendVAlign?: 'top' | 'middle' | 'bottom';
     /** margin: Margins for the BarChart. Default is { top: 0, right: 0, left: 0, bottom: 0 }  */
     margin?: Margin;
-    /** legendPadding: Sets padding for the Legend. Default is top: 10px, right: 27px, left: 0, bottom: 0 */
+    /** legendPadding: Sets padding for the Legend. Default is top: 10px, right: 0, left: 55px, bottom: 0 */
     legendPadding?: {
         top: number;
         right: number;

package/lib/core/SimpleBarChart/index.js

@@ -63,7 +63,7 @@ const SimpleBarChart = ({
           align: legendHAlign && legendHAlign,
           content: /*#__PURE__*/_jsx(CustomLegend, {}),
           wrapperStyle: {
-            paddingLeft: legendPadding?.left ? legendPadding.left : '27px',
+            paddingLeft: legendPadding?.left ? legendPadding.left : '55px',
             paddingTop: legendPadding?.top ? legendPadding.top : '10px',
             paddingBottom: legendPadding?.bottom ? legendPadding.bottom : '0',
             paddingRight: legendPadding?.right ? legendPadding.right : '0'

package/lib/core/SimpleLineChart/index.d.ts

@@ -33,7 +33,7 @@ interface IProps extends Partial<Line> {
     legendVAlign?: 'top' | 'middle' | 'bottom';
     /** margin: Margins for the BarChart. Default is { top: 0, right: 0, left: 0, bottom: 0 }  */
     margin?: Margin;
-    /** legendPadding: Sets padding for the Legend. Default is top: 10px, right: 0, left: 20px, bottom: 0 */
+    /** legendPadding: Sets padding for the Legend. Default is top: 10px, right: 0, left: 50px, bottom: 0 */
     legendPadding?: {
         top: number;
         right: number;

package/lib/core/SimpleLineChart/index.js

@@ -60,7 +60,7 @@ const SimpleLineChart = ({
           align: legendHAlign && legendHAlign,
           content: /*#__PURE__*/_jsx(CustomLegend, {}),
           wrapperStyle: {
-            paddingLeft: legendPadding?.left ? legendPadding.left : '20px',
+            paddingLeft: legendPadding?.left ? legendPadding.left : '50px',
             paddingTop: legendPadding?.top ? legendPadding.top : '10px',
             paddingBottom: legendPadding?.bottom ? legendPadding.bottom : '0',
             paddingRight: legendPadding?.right ? legendPadding.right : '0'

package/lib/shared/recharts/CustomLegend/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/packages/shared/recharts/CustomLegend/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AACtC,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA+B9C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/packages/shared/recharts/CustomLegend/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AACtC,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAkC9C,CAAA"}

package/lib/shared/recharts/CustomLegend/index.js

@@ -9,6 +9,7 @@ export const CustomLegend = props => {
   } = props;
   return /*#__PURE__*/_jsx(LegendsContainer, {
     margin: margin && margin,
+    columns: props?.payload?.length,
     children: props?.payload?.length && props.payload.map(legend => /*#__PURE__*/_jsxs(LegendWrapper, {
       children: [/*#__PURE__*/_jsxs("svg", {
         width: "16",

package/lib/shared/recharts/CustomLegend/styles.d.ts

@@ -5,6 +5,7 @@ export declare const LegendsContainer: import("@emotion/styled").StyledComponent
     as?: import("react").ElementType<any> | undefined;
 } & {
     margin: Partial<Margin> | undefined;
+    columns?: number | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const LegendWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;

package/lib/shared/recharts/CustomLegend/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/packages/shared/recharts/CustomLegend/styles.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,eAAO,MAAM,gBAAgB;;;;YACT,QAAQ,MAAM,CAAC,GAAG,SAAS;yGAQ9C,CAAA;AAED,eAAO,MAAM,aAAa;;;yGAQzB,CAAA"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/packages/shared/recharts/CustomLegend/styles.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAGjC,eAAO,MAAM,gBAAgB;;;;YACT,QAAQ,MAAM,CAAC,GAAG,SAAS;;yGAmB9C,CAAA;AAED,eAAO,MAAM,aAAa;;;yGAOzB,CAAA"}

package/lib/shared/recharts/CustomLegend/styles.js

@@ -3,23 +3,24 @@ import _styled from "@emotion/styled/base";
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 
 import { css } from '@emotion/react';
+import bp from '../../../globals/styles/breakpoints';
 export const LegendsContainer = _styled("div", process.env.NODE_ENV === "production" ? {
   target: "eba3ez51"
 } : {
   target: "eba3ez51",
   label: "LegendsContainer"
-})(props => /*#__PURE__*/css("display:flex;flex-direction:row;margin:", `${props?.margin?.top}px ${props?.margin?.left}px ${props?.margin?.bottom}px ${props?.margin?.right}px`, ";>:first-of-type{margin-left:2rem;}" + (process.env.NODE_ENV === "production" ? "" : ";label:LegendsContainer;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLeUQiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRzQ29udGFpbmVyID0gc3R5bGVkLmRpdihcclxuICAocHJvcHM6IHsgbWFyZ2luOiBQYXJ0aWFsPE1hcmdpbj4gfCB1bmRlZmluZWQgfSkgPT4gY3NzYFxyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XHJcbiAgICBtYXJnaW46ICR7YCR7cHJvcHM/Lm1hcmdpbj8udG9wfXB4ICR7cHJvcHM/Lm1hcmdpbj8ubGVmdH1weCAke3Byb3BzPy5tYXJnaW4/LmJvdHRvbX1weCAke3Byb3BzPy5tYXJnaW4/LnJpZ2h0fXB4YH07XHJcbiAgICA+IDpmaXJzdC1vZi10eXBlIHtcclxuICAgICAgbWFyZ2luLWxlZnQ6IDJyZW07XHJcbiAgICB9XHJcbiAgYFxyXG4pXHJcblxyXG5leHBvcnQgY29uc3QgTGVnZW5kV3JhcHBlciA9IHN0eWxlZC5kaXZgXHJcbiAgZGlzcGxheTogZmxleDtcclxuICBhbGlnbi1pdGVtczogY2VudGVyO1xyXG4gIHRleHQtYWxpZ246IGNlbnRlcjtcclxuICBtYXJnaW46IDAgMXJlbTtcclxuICA+IHN2ZyB7XHJcbiAgICBtYXJnaW4tcmlnaHQ6IDVweDtcclxuICB9XHJcbmBcclxuIl19 */"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFJZ0MiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRzQ29udGFpbmVyID0gc3R5bGVkLmRpdihcclxuICAocHJvcHM6IHsgbWFyZ2luOiBQYXJ0aWFsPE1hcmdpbj4gfCB1bmRlZmluZWQgfSkgPT4gY3NzYFxyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XHJcbiAgICBtYXJnaW46ICR7YCR7cHJvcHM/Lm1hcmdpbj8udG9wfXB4ICR7cHJvcHM/Lm1hcmdpbj8ubGVmdH1weCAke3Byb3BzPy5tYXJnaW4/LmJvdHRvbX1weCAke3Byb3BzPy5tYXJnaW4/LnJpZ2h0fXB4YH07XHJcbiAgICA+IDpmaXJzdC1vZi10eXBlIHtcclxuICAgICAgbWFyZ2luLWxlZnQ6IDJyZW07XHJcbiAgICB9XHJcbiAgYFxyXG4pXHJcblxyXG5leHBvcnQgY29uc3QgTGVnZW5kV3JhcHBlciA9IHN0eWxlZC5kaXZgXHJcbiAgZGlzcGxheTogZmxleDtcclxuICBhbGlnbi1pdGVtczogY2VudGVyO1xyXG4gIHRleHQtYWxpZ246IGNlbnRlcjtcclxuICBtYXJnaW46IDAgMXJlbTtcclxuICA+IHN2ZyB7XHJcbiAgICBtYXJnaW4tcmlnaHQ6IDVweDtcclxuICB9XHJcbmBcclxuIl19 */");
+})(props => /*#__PURE__*/css("display:grid;grid-template-columns:", props.columns ? `repeat(${props.columns}, minmax(min-content, max-content))` : 'auto', ";justify-items:start;grid-column-gap:1em;margin:", `${props?.margin?.top}px ${props?.margin?.left}px ${props?.margin?.bottom}px ${props?.margin?.right}px`, ";@media screen and (max-width: ", bp.medium, "){grid-template-columns:auto;grid-template-rows:", props.columns ? `repeat(${props.columns}, 30px)` : 'auto', ";align-items:flex-start;justify-content:start;justify-items:start;}" + (process.env.NODE_ENV === "production" ? "" : ";label:LegendsContainer;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFNMkUiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuaW1wb3J0IGJwIGZyb20gJy4uLy4uLy4uL2dsb2JhbHMvc3R5bGVzL2JyZWFrcG9pbnRzJ1xyXG5cclxuZXhwb3J0IGNvbnN0IExlZ2VuZHNDb250YWluZXIgPSBzdHlsZWQuZGl2KFxyXG4gIChwcm9wczogeyBtYXJnaW46IFBhcnRpYWw8TWFyZ2luPiB8IHVuZGVmaW5lZDsgY29sdW1ucz86IG51bWJlciB9KSA9PiBjc3NgXHJcbiAgICBkaXNwbGF5OiBncmlkO1xyXG4gICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiAke3Byb3BzLmNvbHVtbnNcclxuICAgICAgPyBgcmVwZWF0KCR7cHJvcHMuY29sdW1uc30sIG1pbm1heChtaW4tY29udGVudCwgbWF4LWNvbnRlbnQpKWBcclxuICAgICAgOiAnYXV0byd9O1xyXG4gICAganVzdGlmeS1pdGVtczogc3RhcnQ7XHJcbiAgICBncmlkLWNvbHVtbi1nYXA6IDFlbTtcclxuICAgIG1hcmdpbjogJHtgJHtwcm9wcz8ubWFyZ2luPy50b3B9cHggJHtwcm9wcz8ubWFyZ2luPy5sZWZ0fXB4ICR7cHJvcHM/Lm1hcmdpbj8uYm90dG9tfXB4ICR7cHJvcHM/Lm1hcmdpbj8ucmlnaHR9cHhgfTtcclxuXHJcbiAgICBAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAke2JwLm1lZGl1bX0pIHtcclxuICAgICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiBhdXRvO1xyXG4gICAgICBncmlkLXRlbXBsYXRlLXJvd3M6ICR7cHJvcHMuY29sdW1uc1xyXG4gICAgICAgID8gYHJlcGVhdCgke3Byb3BzLmNvbHVtbnN9LCAzMHB4KWBcclxuICAgICAgICA6ICdhdXRvJ307XHJcbiAgICAgIGFsaWduLWl0ZW1zOiBmbGV4LXN0YXJ0O1xyXG4gICAgICBqdXN0aWZ5LWNvbnRlbnQ6IHN0YXJ0O1xyXG4gICAgICBqdXN0aWZ5LWl0ZW1zOiBzdGFydDtcclxuICAgIH1cclxuICBgXHJcbilcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRXcmFwcGVyID0gc3R5bGVkLmRpdmBcclxuICBkaXNwbGF5OiBmbGV4O1xyXG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XHJcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xyXG4gID4gc3ZnIHtcclxuICAgIG1hcmdpbi1yaWdodDogNXB4O1xyXG4gIH1cclxuYFxyXG4iXX0= */"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLZ0MiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuaW1wb3J0IGJwIGZyb20gJy4uLy4uLy4uL2dsb2JhbHMvc3R5bGVzL2JyZWFrcG9pbnRzJ1xyXG5cclxuZXhwb3J0IGNvbnN0IExlZ2VuZHNDb250YWluZXIgPSBzdHlsZWQuZGl2KFxyXG4gIChwcm9wczogeyBtYXJnaW46IFBhcnRpYWw8TWFyZ2luPiB8IHVuZGVmaW5lZDsgY29sdW1ucz86IG51bWJlciB9KSA9PiBjc3NgXHJcbiAgICBkaXNwbGF5OiBncmlkO1xyXG4gICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiAke3Byb3BzLmNvbHVtbnNcclxuICAgICAgPyBgcmVwZWF0KCR7cHJvcHMuY29sdW1uc30sIG1pbm1heChtaW4tY29udGVudCwgbWF4LWNvbnRlbnQpKWBcclxuICAgICAgOiAnYXV0byd9O1xyXG4gICAganVzdGlmeS1pdGVtczogc3RhcnQ7XHJcbiAgICBncmlkLWNvbHVtbi1nYXA6IDFlbTtcclxuICAgIG1hcmdpbjogJHtgJHtwcm9wcz8ubWFyZ2luPy50b3B9cHggJHtwcm9wcz8ubWFyZ2luPy5sZWZ0fXB4ICR7cHJvcHM/Lm1hcmdpbj8uYm90dG9tfXB4ICR7cHJvcHM/Lm1hcmdpbj8ucmlnaHR9cHhgfTtcclxuXHJcbiAgICBAbWVkaWEgc2NyZWVuIGFuZCAobWF4LXdpZHRoOiAke2JwLm1lZGl1bX0pIHtcclxuICAgICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiBhdXRvO1xyXG4gICAgICBncmlkLXRlbXBsYXRlLXJvd3M6ICR7cHJvcHMuY29sdW1uc1xyXG4gICAgICAgID8gYHJlcGVhdCgke3Byb3BzLmNvbHVtbnN9LCAzMHB4KWBcclxuICAgICAgICA6ICdhdXRvJ307XHJcbiAgICAgIGFsaWduLWl0ZW1zOiBmbGV4LXN0YXJ0O1xyXG4gICAgICBqdXN0aWZ5LWNvbnRlbnQ6IHN0YXJ0O1xyXG4gICAgICBqdXN0aWZ5LWl0ZW1zOiBzdGFydDtcclxuICAgIH1cclxuICBgXHJcbilcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRXcmFwcGVyID0gc3R5bGVkLmRpdmBcclxuICBkaXNwbGF5OiBmbGV4O1xyXG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XHJcbiAgdGV4dC1hbGlnbjogY2VudGVyO1xyXG4gID4gc3ZnIHtcclxuICAgIG1hcmdpbi1yaWdodDogNXB4O1xyXG4gIH1cclxuYFxyXG4iXX0= */");
 export const LegendWrapper = _styled("div", process.env.NODE_ENV === "production" ? {
   target: "eba3ez50"
 } : {
   target: "eba3ez50",
   label: "LegendWrapper"
 })(process.env.NODE_ENV === "production" ? {
-  name: "1060gwv",
-  styles: "display:flex;align-items:center;text-align:center;margin:0 1rem;>svg{margin-right:5px;}"
+  name: "bdj8j3",
+  styles: "display:flex;align-items:center;text-align:center;>svg{margin-right:5px;}"
 } : {
-  name: "1060gwv",
-  styles: "display:flex;align-items:center;text-align:center;margin:0 1rem;>svg{margin-right:5px;}",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFldUMiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL3BhY2thZ2VzL3NoYXJlZC9yZWNoYXJ0cy9DdXN0b21MZWdlbmQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnXHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xyXG5pbXBvcnQgeyBNYXJnaW4gfSBmcm9tICdyZWNoYXJ0cydcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRzQ29udGFpbmVyID0gc3R5bGVkLmRpdihcclxuICAocHJvcHM6IHsgbWFyZ2luOiBQYXJ0aWFsPE1hcmdpbj4gfCB1bmRlZmluZWQgfSkgPT4gY3NzYFxyXG4gICAgZGlzcGxheTogZmxleDtcclxuICAgIGZsZXgtZGlyZWN0aW9uOiByb3c7XHJcbiAgICBtYXJnaW46ICR7YCR7cHJvcHM/Lm1hcmdpbj8udG9wfXB4ICR7cHJvcHM/Lm1hcmdpbj8ubGVmdH1weCAke3Byb3BzPy5tYXJnaW4/LmJvdHRvbX1weCAke3Byb3BzPy5tYXJnaW4/LnJpZ2h0fXB4YH07XHJcbiAgICA+IDpmaXJzdC1vZi10eXBlIHtcclxuICAgICAgbWFyZ2luLWxlZnQ6IDJyZW07XHJcbiAgICB9XHJcbiAgYFxyXG4pXHJcblxyXG5leHBvcnQgY29uc3QgTGVnZW5kV3JhcHBlciA9IHN0eWxlZC5kaXZgXHJcbiAgZGlzcGxheTogZmxleDtcclxuICBhbGlnbi1pdGVtczogY2VudGVyO1xyXG4gIHRleHQtYWxpZ246IGNlbnRlcjtcclxuICBtYXJnaW46IDAgMXJlbTtcclxuICA+IHN2ZyB7XHJcbiAgICBtYXJnaW4tcmlnaHQ6IDVweDtcclxuICB9XHJcbmBcclxuIl19 */",
+  name: "bdj8j3",
+  styles: "display:flex;align-items:center;text-align:center;>svg{margin-right:5px;}",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQnVDIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9wYWNrYWdlcy9zaGFyZWQvcmVjaGFydHMvQ3VzdG9tTGVnZW5kL3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0J1xyXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCdcclxuaW1wb3J0IHsgTWFyZ2luIH0gZnJvbSAncmVjaGFydHMnXHJcbmltcG9ydCBicCBmcm9tICcuLi8uLi8uLi9nbG9iYWxzL3N0eWxlcy9icmVha3BvaW50cydcclxuXHJcbmV4cG9ydCBjb25zdCBMZWdlbmRzQ29udGFpbmVyID0gc3R5bGVkLmRpdihcclxuICAocHJvcHM6IHsgbWFyZ2luOiBQYXJ0aWFsPE1hcmdpbj4gfCB1bmRlZmluZWQ7IGNvbHVtbnM/OiBudW1iZXIgfSkgPT4gY3NzYFxyXG4gICAgZGlzcGxheTogZ3JpZDtcclxuICAgIGdyaWQtdGVtcGxhdGUtY29sdW1uczogJHtwcm9wcy5jb2x1bW5zXHJcbiAgICAgID8gYHJlcGVhdCgke3Byb3BzLmNvbHVtbnN9LCBtaW5tYXgobWluLWNvbnRlbnQsIG1heC1jb250ZW50KSlgXHJcbiAgICAgIDogJ2F1dG8nfTtcclxuICAgIGp1c3RpZnktaXRlbXM6IHN0YXJ0O1xyXG4gICAgZ3JpZC1jb2x1bW4tZ2FwOiAxZW07XHJcbiAgICBtYXJnaW46ICR7YCR7cHJvcHM/Lm1hcmdpbj8udG9wfXB4ICR7cHJvcHM/Lm1hcmdpbj8ubGVmdH1weCAke3Byb3BzPy5tYXJnaW4/LmJvdHRvbX1weCAke3Byb3BzPy5tYXJnaW4/LnJpZ2h0fXB4YH07XHJcblxyXG4gICAgQG1lZGlhIHNjcmVlbiBhbmQgKG1heC13aWR0aDogJHticC5tZWRpdW19KSB7XHJcbiAgICAgIGdyaWQtdGVtcGxhdGUtY29sdW1uczogYXV0bztcclxuICAgICAgZ3JpZC10ZW1wbGF0ZS1yb3dzOiAke3Byb3BzLmNvbHVtbnNcclxuICAgICAgICA/IGByZXBlYXQoJHtwcm9wcy5jb2x1bW5zfSwgMzBweClgXHJcbiAgICAgICAgOiAnYXV0byd9O1xyXG4gICAgICBhbGlnbi1pdGVtczogZmxleC1zdGFydDtcclxuICAgICAganVzdGlmeS1jb250ZW50OiBzdGFydDtcclxuICAgICAganVzdGlmeS1pdGVtczogc3RhcnQ7XHJcbiAgICB9XHJcbiAgYFxyXG4pXHJcblxyXG5leHBvcnQgY29uc3QgTGVnZW5kV3JhcHBlciA9IHN0eWxlZC5kaXZgXHJcbiAgZGlzcGxheTogZmxleDtcclxuICBhbGlnbi1pdGVtczogY2VudGVyO1xyXG4gIHRleHQtYWxpZ246IGNlbnRlcjtcclxuICA+IHN2ZyB7XHJcbiAgICBtYXJnaW4tcmlnaHQ6IDVweDtcclxuICB9XHJcbmBcclxuIl19 */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });

package/lib/shared/recharts/CustomTooltip/index.d.ts

@@ -1,5 +1,9 @@
 import React from 'react';
 import { TooltipProps } from 'recharts';
-declare const CustomTooltip: React.FC<TooltipProps | any>;
+interface IProps extends TooltipProps {
+    lineConfig?: any[];
+    barConfig?: any[];
+}
+declare const CustomTooltip: React.FC<IProps>;
 export default CustomTooltip;
 //# sourceMappingURL=index.d.ts.map

package/lib/shared/recharts/CustomTooltip/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/packages/shared/recharts/CustomTooltip/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAKvC,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,GAAG,GAAG,CAkD/C,CAAA;AAED,eAAe,aAAa,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/packages/shared/recharts/CustomTooltip/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAIvC,UAAU,MAAO,SAAQ,YAAY;IACnC,UAAU,CAAC,EAAE,GAAG,EAAE,CAAA;IAClB,SAAS,CAAC,EAAE,GAAG,EAAE,CAAA;CAClB;AACD,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,MAAM,CA8EnC,CAAA;AAED,eAAe,aAAa,CAAA"}

package/lib/shared/recharts/CustomTooltip/index.js

@@ -7,12 +7,32 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 
 const CustomTooltip = ({
+  lineConfig,
+  barConfig,
   active,
   payload,
   label
 }) => {
   const theme = useTheme();
 
+  const configHasProperty = config => config?.length && config.findIndex(v => v?.hasOwnProperty('shortName')) !== -1;
+
+  const payloadItemHasProperty = (config, payloadItem) => config.findIndex(v => v.name === payloadItem.name && v.shortName) !== -1;
+
+  const getTooltipItemName = payloadItem => {
+    if (!lineConfig && !barConfig) return payloadItem.name;
+
+    if (lineConfig && configHasProperty(lineConfig) && payloadItemHasProperty(lineConfig, payloadItem)) {
+      return lineConfig?.find(v => v.name === payloadItem.name)?.shortName;
+    }
+
+    if (barConfig && configHasProperty(barConfig) && payloadItemHasProperty(barConfig, payloadItem)) {
+      return barConfig?.find(v => v.name === payloadItem.name)?.shortName;
+    }
+
+    return payloadItem.name;
+  };
+
   const TooltipPayload = () => {
     return active && payload?.length && payload.map(item => /*#__PURE__*/_jsxs(TooltipPayloadWrapper, {
       children: [/*#__PURE__*/_jsxs(ItemNameGroup, {
@@ -39,7 +59,7 @@ const CustomTooltip = ({
             fill: item.color
           })
         }), /*#__PURE__*/_jsxs(Text, {
-          children: [item.name, ":"]
+          children: [getTooltipItemName(item), ":"]
         })]
       }), /*#__PURE__*/_jsx(Text, {
         children: getFormattedPrice(item.value, 2)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbl-digital/snorre",
-  "version": "2.2.8",
+  "version": "2.2.9",
   "description": "Design library for BBL Digital",
   "license": "MIT",
   "main": "./lib/index.js",