@galaxy-ds/core 1.1.63 → 1.1.66

package/dist/Themes/Desktop/pallette.d.ts

@@ -44,6 +44,7 @@ export declare const pallette: {
 };
 declare const pallettes: {
     blue: {
+        300: string;
         200: string;
         100: string;
         50: string;

package/dist/Themes/Web/pallette.d.ts

@@ -44,6 +44,7 @@ export declare const pallette: {
 };
 declare const pallettes: {
     blue: {
+        300: string;
         200: string;
         100: string;
         50: string;

package/dist/index.esm.js

@@ -5680,7 +5680,7 @@ var Jss =
 function () {
   function Jss(options) {
     this.id = instanceCounter++;
-    this.version = "10.8.0";
+    this.version = "10.8.2";
     this.plugins = new PluginsRegistry();
     this.options = {
       id: {
@@ -33767,7 +33767,7 @@ var typography$1 = {
     h4: {
         fontFamily: ['Open Sans', 'Helvetica', 'Arial'].join(','),
         fontWeight: 500,
-        fontSize: '17px',
+        fontSize: '16px',
         lineHeight: '1.5rem',
         letterSpacing: '0',
     },
@@ -33926,9 +33926,10 @@ var AvatarsGroup = function (props) {
     }
     var clampedMax = props.max < 2 ? 2 : props.max;
     var avatarCount = props.children.length > clampedMax ? props.children.length - clampedMax + 1 : 0;
+    var count = props.children.length >= 2;
     var avatars = props.children.length > 1 ? props.children.slice(0, props.children.length - avatarCount) : props.children;
     return (React__default.createElement(React__default.Fragment, null, tooltip ?
-        React__default.createElement(AvatarGroup$1, __assign$1({}, defaultProps, { spacing: 6, className: clsx(classes.avatarBorder, sizeProp, colorProp) }),
+        React__default.createElement(AvatarGroup$1, __assign$1({}, defaultProps, { spacing: 6, className: clsx(count && classes.avatarBorder, sizeProp, colorProp) }),
             React__default.Children.map(avatars, function (child) {
                 return React__default.cloneElement(child);
             }),
@@ -33936,7 +33937,7 @@ var AvatarsGroup = function (props) {
                 "+",
                 avatarCount)) : null)
         :
-            React__default.createElement(AvatarGroup$1, __assign$1({}, defaultProps, { spacing: 6, className: clsx(classes.avatarBorder, sizeProp, colorProp) }), props.children)));
+            React__default.createElement(AvatarGroup$1, __assign$1({}, defaultProps, { spacing: 6, className: clsx(count && classes.avatarBorder, sizeProp, colorProp) }), props.children)));
 };
 
 var Box = function (props) {
@@ -34303,7 +34304,7 @@ var FormHeader = React__default.forwardRef(function (props, ref) {
         React__default.createElement("div", { className: clsx(classes.root, 'gds-header_accent') },
             React__default.createElement(LawconnectIcon, { size: "260" })),
         React__default.createElement(Box$2, { className: clsx(classes.root, 'gds-header_detail') },
-            React__default.createElement(Grid$2, { item: true, xs: 5 }, props.platformWeb ? (React__default.createElement(Typography, { color: "default", variant: "body2", upperCase: true }, props.title)) : (React__default.createElement(Typography, { color: "primaryLight", variant: "h2", upperCase: true }, props.title))),
+            React__default.createElement(Grid$2, { item: true, xs: 5, className: clsx("gds-toolbar-title") }, props.platformWeb ? (React__default.createElement(Typography, { color: "default", variant: "body2", upperCase: true }, props.title)) : (React__default.createElement(Typography, { variant: "h4", upperCase: true }, props.title))),
             React__default.createElement(Grid$2, { item: true, xs: 7 },
                 React__default.createElement(Grid$2, { container: true, alignItems: "center", justifyContent: "flex-end", className: clsx(classes.root, 'gds-header_info') },
                     props.from ? (React__default.createElement(Typography, { align: "right", variant: "body2" }, props.from)) : null,
@@ -35768,6 +35769,9 @@ var useStyles$a = makeStyles(function (theme) {
             justifyContent: "space-between",
             alignItems: "flex-end",
         }); },
+        toolbarContent: {
+            marginTop: '10px',
+        }
     });
 });
 var HeaderToolbar = function (_a) {
@@ -35776,10 +35780,10 @@ var HeaderToolbar = function (_a) {
     var classes = useStyles$a({ bgColor: bgColor, bgImageURL: bgImageURL, right: right, bgPosition: bgPosition, bgSize: bgSize, titleVisibility: titleVisibility, divider: divider });
     return (React__default.createElement(Toolbar$2, { className: clsx('gds-header-toolbar', classes.bgWrapper, (_b = {}, _b['with-title'] = titleVisibility, _b)) },
         React__default.createElement(Box$2, { className: clsx(classes.toolbarWrap) },
-            React__default.createElement(Box$2, { className: clsx(classes.toolbarContainer) },
+            React__default.createElement(Box$2, { className: clsx(classes.toolbarContainer, "gds-toolbar-title") },
                 title && (tooltip ? (React__default.createElement(Tooltip, { title: title, placement: "bottom-start" },
-                    React__default.createElement(Typography, { gutterBottom: true, variant: "h1", noWrap: true, color: "primary" }, title))) : (React__default.createElement(Typography, { gutterBottom: true, variant: "h1", noWrap: true, color: "primary" }, title))),
-                left),
+                    React__default.createElement(Typography, { gutterBottom: true, variant: "h4", noWrap: true, upperCase: true }, title))) : (React__default.createElement(Typography, { gutterBottom: true, variant: "h4", noWrap: true, upperCase: true }, title))),
+                React__default.createElement(Box$2, { className: clsx(classes.toolbarContent) }, left)),
             right && (React__default.createElement(Box$2, { className: clsx("gds-buttons-w-divider", classes.containerDivider) }, right)))));
 };
 
@@ -36503,10 +36507,10 @@ var startOfDay$1 = /*#__PURE__*/Object.freeze({
 /**
  * @name isSameDay
  * @category Day Helpers
- * @summary Are the given dates in the same day?
+ * @summary Are the given dates in the same day (and year and month)?
  *
  * @description
- * Are the given dates in the same day?
+ * Are the given dates in the same day (and year and month)?
  *
  * ### v2.0.0 breaking changes:
  *
@@ -36514,13 +36518,23 @@ var startOfDay$1 = /*#__PURE__*/Object.freeze({
  *
  * @param {Date|Number} dateLeft - the first date to check
  * @param {Date|Number} dateRight - the second date to check
- * @returns {Boolean} the dates are in the same day
+ * @returns {Boolean} the dates are in the same day (and year and month)
  * @throws {TypeError} 2 arguments required
  *
  * @example
  * // Are 4 September 06:00:00 and 4 September 18:00:00 in the same day?
  * var result = isSameDay(new Date(2014, 8, 4, 6, 0), new Date(2014, 8, 4, 18, 0))
  * //=> true
+ * 
+ * @example
+ * // Are 4 September and 4 October in the same day?
+ * var result = isSameDay(new Date(2014, 8, 4), new Date(2014, 9, 4))
+ * //=> false
+ * 
+ * @example
+ * // Are 4 September, 2014 and 4 September, 2015 in the same day?
+ * var result = isSameDay(new Date(2014, 8, 4), new Date(2015, 8, 4))
+ * //=> false
  */
 
 function isSameDay(dirtyDateLeft, dirtyDateRight) {
@@ -36817,7 +36831,7 @@ function buildLocalizeFn(args) {
       valuesArray = args.values[_width] || args.values[_defaultWidth];
     }
 
-    var index = args.argumentCallback ? args.argumentCallback(dirtyIndex) : dirtyIndex; // @ts-ignore: For some reason TypeScript just don't want to match it, no matter how hard we try. I challange you to try to remove it!
+    var index = args.argumentCallback ? args.argumentCallback(dirtyIndex) : dirtyIndex; // @ts-ignore: For some reason TypeScript just don't want to match it, no matter how hard we try. I challenge you to try to remove it!
 
     return valuesArray[index];
   };
@@ -37236,101 +37250,6 @@ function subMilliseconds(dirtyDate, dirtyAmount) {
   return addMilliseconds(dirtyDate, -amount);
 }
 
-function addLeadingZeros(number, targetLength) {
-  var sign = number < 0 ? '-' : '';
-  var output = Math.abs(number).toString();
-
-  while (output.length < targetLength) {
-    output = '0' + output;
-  }
-
-  return sign + output;
-}
-
-/*
- * |     | Unit                           |     | Unit                           |
- * |-----|--------------------------------|-----|--------------------------------|
- * |  a  | AM, PM                         |  A* |                                |
- * |  d  | Day of month                   |  D  |                                |
- * |  h  | Hour [1-12]                    |  H  | Hour [0-23]                    |
- * |  m  | Minute                         |  M  | Month                          |
- * |  s  | Second                         |  S  | Fraction of second             |
- * |  y  | Year (abs)                     |  Y  |                                |
- *
- * Letters marked by * are not implemented but reserved by Unicode standard.
- */
-
-var formatters$2 = {
-  // Year
-  y: function (date, token) {
-    // From http://www.unicode.org/reports/tr35/tr35-31/tr35-dates.html#Date_Format_tokens
-    // | Year     |     y | yy |   yyy |  yyyy | yyyyy |
-    // |----------|-------|----|-------|-------|-------|
-    // | AD 1     |     1 | 01 |   001 |  0001 | 00001 |
-    // | AD 12    |    12 | 12 |   012 |  0012 | 00012 |
-    // | AD 123   |   123 | 23 |   123 |  0123 | 00123 |
-    // | AD 1234  |  1234 | 34 |  1234 |  1234 | 01234 |
-    // | AD 12345 | 12345 | 45 | 12345 | 12345 | 12345 |
-    var signedYear = date.getUTCFullYear(); // Returns 1 for 1 BC (which is year 0 in JavaScript)
-
-    var year = signedYear > 0 ? signedYear : 1 - signedYear;
-    return addLeadingZeros(token === 'yy' ? year % 100 : year, token.length);
-  },
-  // Month
-  M: function (date, token) {
-    var month = date.getUTCMonth();
-    return token === 'M' ? String(month + 1) : addLeadingZeros(month + 1, 2);
-  },
-  // Day of the month
-  d: function (date, token) {
-    return addLeadingZeros(date.getUTCDate(), token.length);
-  },
-  // AM or PM
-  a: function (date, token) {
-    var dayPeriodEnumValue = date.getUTCHours() / 12 >= 1 ? 'pm' : 'am';
-
-    switch (token) {
-      case 'a':
-      case 'aa':
-        return dayPeriodEnumValue.toUpperCase();
-
-      case 'aaa':
-        return dayPeriodEnumValue;
-
-      case 'aaaaa':
-        return dayPeriodEnumValue[0];
-
-      case 'aaaa':
-      default:
-        return dayPeriodEnumValue === 'am' ? 'a.m.' : 'p.m.';
-    }
-  },
-  // Hour [1-12]
-  h: function (date, token) {
-    return addLeadingZeros(date.getUTCHours() % 12 || 12, token.length);
-  },
-  // Hour [0-23]
-  H: function (date, token) {
-    return addLeadingZeros(date.getUTCHours(), token.length);
-  },
-  // Minute
-  m: function (date, token) {
-    return addLeadingZeros(date.getUTCMinutes(), token.length);
-  },
-  // Second
-  s: function (date, token) {
-    return addLeadingZeros(date.getUTCSeconds(), token.length);
-  },
-  // Fraction of second
-  S: function (date, token) {
-    var numberOfDigits = token.length;
-    var milliseconds = date.getUTCMilliseconds();
-    var fractionalSeconds = Math.floor(milliseconds * Math.pow(10, numberOfDigits - 3));
-    return addLeadingZeros(fractionalSeconds, token.length);
-  }
-};
-var lightFormatters = formatters$2;
-
 var MILLISECONDS_IN_DAY$1 = 86400000; // This function will be a part of public API when UTC function will be implemented.
 // See issue: https://github.com/date-fns/date-fns/issues/376
 
@@ -37433,7 +37352,7 @@ function startOfUTCWeek(dirtyDate, dirtyOptions) {
 
 function getUTCWeekYear(dirtyDate, dirtyOptions) {
   requiredArgs(1, arguments);
-  var date = toDate(dirtyDate, dirtyOptions);
+  var date = toDate(dirtyDate);
   var year = date.getUTCFullYear();
   var options = dirtyOptions || {};
   var locale = options.locale;
@@ -37493,6 +37412,101 @@ function getUTCWeek(dirtyDate, options) {
   return Math.round(diff / MILLISECONDS_IN_WEEK) + 1;
 }
 
+function addLeadingZeros(number, targetLength) {
+  var sign = number < 0 ? '-' : '';
+  var output = Math.abs(number).toString();
+
+  while (output.length < targetLength) {
+    output = '0' + output;
+  }
+
+  return sign + output;
+}
+
+/*
+ * |     | Unit                           |     | Unit                           |
+ * |-----|--------------------------------|-----|--------------------------------|
+ * |  a  | AM, PM                         |  A* |                                |
+ * |  d  | Day of month                   |  D  |                                |
+ * |  h  | Hour [1-12]                    |  H  | Hour [0-23]                    |
+ * |  m  | Minute                         |  M  | Month                          |
+ * |  s  | Second                         |  S  | Fraction of second             |
+ * |  y  | Year (abs)                     |  Y  |                                |
+ *
+ * Letters marked by * are not implemented but reserved by Unicode standard.
+ */
+
+var formatters$2 = {
+  // Year
+  y: function (date, token) {
+    // From http://www.unicode.org/reports/tr35/tr35-31/tr35-dates.html#Date_Format_tokens
+    // | Year     |     y | yy |   yyy |  yyyy | yyyyy |
+    // |----------|-------|----|-------|-------|-------|
+    // | AD 1     |     1 | 01 |   001 |  0001 | 00001 |
+    // | AD 12    |    12 | 12 |   012 |  0012 | 00012 |
+    // | AD 123   |   123 | 23 |   123 |  0123 | 00123 |
+    // | AD 1234  |  1234 | 34 |  1234 |  1234 | 01234 |
+    // | AD 12345 | 12345 | 45 | 12345 | 12345 | 12345 |
+    var signedYear = date.getUTCFullYear(); // Returns 1 for 1 BC (which is year 0 in JavaScript)
+
+    var year = signedYear > 0 ? signedYear : 1 - signedYear;
+    return addLeadingZeros(token === 'yy' ? year % 100 : year, token.length);
+  },
+  // Month
+  M: function (date, token) {
+    var month = date.getUTCMonth();
+    return token === 'M' ? String(month + 1) : addLeadingZeros(month + 1, 2);
+  },
+  // Day of the month
+  d: function (date, token) {
+    return addLeadingZeros(date.getUTCDate(), token.length);
+  },
+  // AM or PM
+  a: function (date, token) {
+    var dayPeriodEnumValue = date.getUTCHours() / 12 >= 1 ? 'pm' : 'am';
+
+    switch (token) {
+      case 'a':
+      case 'aa':
+        return dayPeriodEnumValue.toUpperCase();
+
+      case 'aaa':
+        return dayPeriodEnumValue;
+
+      case 'aaaaa':
+        return dayPeriodEnumValue[0];
+
+      case 'aaaa':
+      default:
+        return dayPeriodEnumValue === 'am' ? 'a.m.' : 'p.m.';
+    }
+  },
+  // Hour [1-12]
+  h: function (date, token) {
+    return addLeadingZeros(date.getUTCHours() % 12 || 12, token.length);
+  },
+  // Hour [0-23]
+  H: function (date, token) {
+    return addLeadingZeros(date.getUTCHours(), token.length);
+  },
+  // Minute
+  m: function (date, token) {
+    return addLeadingZeros(date.getUTCMinutes(), token.length);
+  },
+  // Second
+  s: function (date, token) {
+    return addLeadingZeros(date.getUTCSeconds(), token.length);
+  },
+  // Fraction of second
+  S: function (date, token) {
+    var numberOfDigits = token.length;
+    var milliseconds = date.getUTCMilliseconds();
+    var fractionalSeconds = Math.floor(milliseconds * Math.pow(10, numberOfDigits - 3));
+    return addLeadingZeros(fractionalSeconds, token.length);
+  }
+};
+var lightFormatters = formatters$2;
+
 var dayPeriodEnum = {
   am: 'am',
   pm: 'pm',
@@ -38404,7 +38418,7 @@ function timeLongFormatter(pattern, formatLong) {
 }
 
 function dateTimeLongFormatter(pattern, formatLong) {
-  var matchResult = pattern.match(/(P+)(p+)?/);
+  var matchResult = pattern.match(/(P+)(p+)?/) || [];
   var datePattern = matchResult[1];
   var timePattern = matchResult[2];
 
@@ -38752,7 +38766,7 @@ var unescapedLatinCharacterRegExp$1 = /[a-zA-Z]/;
  * 8. `YY` and `YYYY` tokens represent week-numbering years but they are often confused with years.
  *    You should enable `options.useAdditionalWeekYearTokens` to use them. See: https://git.io/fxCyr
  *
- * 9. `D` and `DD` tokens represent days of the year but they are ofthen confused with days of the month.
+ * 9. `D` and `DD` tokens represent days of the year but they are often confused with days of the month.
  *    You should enable `options.useAdditionalDayOfYearTokens` to use them. See: https://git.io/fxCyr
  *
  * ### v2.0.0 breaking changes:
@@ -41389,7 +41403,7 @@ var parsers = {
       date.setUTCHours(dayPeriodEnumToHours(value), 0, 0, 0);
       return date;
     },
-    incompatibleTokens: ['b', 'B', 'H', 'K', 'k', 't', 'T']
+    incompatibleTokens: ['b', 'B', 'H', 'k', 't', 'T']
   },
   // AM, PM, midnight
   b: {
@@ -41431,7 +41445,7 @@ var parsers = {
       date.setUTCHours(dayPeriodEnumToHours(value), 0, 0, 0);
       return date;
     },
-    incompatibleTokens: ['a', 'B', 'H', 'K', 'k', 't', 'T']
+    incompatibleTokens: ['a', 'B', 'H', 'k', 't', 'T']
   },
   // in the morning, in the afternoon, in the evening, at night
   B: {
@@ -41567,7 +41581,7 @@ var parsers = {
 
       return date;
     },
-    incompatibleTokens: ['a', 'b', 'h', 'H', 'k', 't', 'T']
+    incompatibleTokens: ['h', 'H', 'k', 't', 'T']
   },
   // Hour [1-24]
   k: {
@@ -41925,7 +41939,7 @@ var unescapedLatinCharacterRegExp = /[a-zA-Z]/;
  * |                                 |     | tt      | ...                               | 2     |
  * | Fraction of second              |  30 | S       | 0, 1, ..., 9                      |       |
  * |                                 |     | SS      | 00, 01, ..., 99                   |       |
- * |                                 |     | SSS     | 000, 0001, ..., 999               |       |
+ * |                                 |     | SSS     | 000, 001, ..., 999                |       |
  * |                                 |     | SSSS    | ...                               | 2     |
  * | Milliseconds timestamp          |  20 | T       | 512969520900                      |       |
  * |                                 |     | TT      | ...                               | 2     |
@@ -43534,10 +43548,10 @@ var differenceInDays$1 = /*#__PURE__*/Object.freeze({
 /**
  * @name isSameMonth
  * @category Month Helpers
- * @summary Are the given dates in the same month?
+ * @summary Are the given dates in the same month (and year)?
  *
  * @description
- * Are the given dates in the same month?
+ * Are the given dates in the same month (and year)?
  *
  * ### v2.0.0 breaking changes:
  *
@@ -43545,13 +43559,18 @@ var differenceInDays$1 = /*#__PURE__*/Object.freeze({
  *
  * @param {Date|Number} dateLeft - the first date to check
  * @param {Date|Number} dateRight - the second date to check
- * @returns {Boolean} the dates are in the same month
+ * @returns {Boolean} the dates are in the same month (and year)
  * @throws {TypeError} 2 arguments required
  *
  * @example
  * // Are 2 September 2014 and 25 September 2014 in the same month?
  * var result = isSameMonth(new Date(2014, 8, 2), new Date(2014, 8, 25))
  * //=> true
+ *
+ * @example
+ * // Are 2 September 2014 and 25 September 2015 in the same month?
+ * var result = isSameMonth(new Date(2014, 8, 2), new Date(2015, 8, 25))
+ * //=> false
  */
 
 function isSameMonth(dirtyDateLeft, dirtyDateRight) {
@@ -46892,6 +46911,19 @@ var themeWeb = createTheme({
                 padding: 0,
             },
         },
+        MuiTypography: {
+            root: {
+                "&.MuiTypography-h4": {
+                    ".gds-toolbar-title &": {
+                        textTransform: 'uppercase',
+                        color: pallettes$1.brand.primary.main + " !important",
+                        fontSize: typography$1.h4.fontSize,
+                        fontWeight: typography$1.h4.fontWeight,
+                        lineHeight: typography$1.h4.lineHeight,
+                    }
+                }
+            },
+        },
         MuiAppBar: {
             root: {
                 color: common.brand.neutral.white,
@@ -47640,7 +47672,6 @@ var themeWeb = createTheme({
                 lineHeight: 1.5715,
                 letterSpacing: '0.01rem',
                 padding: '.25rem 1.25rem',
-                '&.gds-startIcon': {},
                 '&:hover': {
                     backgroundColor: pallettes$1.brand.primary.transparent,
                     color: pallettes$1.brand.primary.main,
@@ -48018,6 +48049,9 @@ var themeWeb = createTheme({
                     paddingRight: 16,
                     '& .gds-buttons-w-divider': {
                         paddingLeft: 16,
+                        "& button:last-child": {
+                            marginLeft: '16px'
+                        }
                     },
                     '& .MuiInputBase-root, & .MuiButtonBase-root': {
                         maxHeight: 32,
@@ -48986,14 +49020,26 @@ var themeDesktop = createTheme({
                     backgroundColor: pallettes.brand.utility.accent.dark,
                     color: '#fff',
                     cursor: 'default',
+                    '&:not($selected) svg': {
+                        color: pallettes.brand.primary.contrastText,
+                    },
                 }, '&:hover .MuiListItemText-root .MuiTypography-root': {
                     color: '#fff',
                 }, '&$selected': {
                     backgroundColor: pallettes.brand.background.selected,
                     color: '#fff',
+                    '& svg': {
+                        color: pallettes.grey['50'],
+                    },
+                }, '&.gds-menu-item-checked': {
+                    "&:not($selected) svg": {
+                        color: pallettes.pallette.action.selected,
+                    },
                 }, "&.gds-menu-item-icon": {
+                    paddingLeft: 32,
                     "& .MuiListItemIcon-root": {
-                        display: "none",
+                        position: 'absolute',
+                        left: 8,
                     }
                 }, '.customMultipleList &$selected': {
                     backgroundColor: '#fff',
@@ -49256,6 +49302,12 @@ var themeDesktop = createTheme({
         MuiTypography: {
             root: {
                 color: pallettes.brand.text.main,
+                "&.MuiTypography-h4": {
+                    ".gds-toolbar-title &": {
+                        marginBottom: '0',
+                        color: pallettes.brand.primary.light + " !important",
+                    }
+                }
             },
         },
         MuiTooltip: {