@mgdis/mg-components 5.19.3 → 5.21.0

package/dist/collection/utils/e2e.test.utils.js

@@ -12,11 +12,11 @@ export const darkBackground = (condition, html) => `${condition ? '<span style="
  * @returns formated inline attributed. ex: 'status="visible"'
  */
 export const renderAttributes = (args) => (typeof args === 'object' &&
-  Object.keys(args)
-    .filter(key => ![null, undefined, false].includes(args[key]) && typeof args[key] !== 'object')
-    .map(key => `${key.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase()}="${args[key]}"`)
-    .join(' ')) ||
-  '';
+    Object.keys(args)
+        .filter(key => ![null, undefined, false].includes(args[key]) && typeof args[key] !== 'object')
+        .map(key => `${key.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase()}="${args[key]}"`)
+        .join(' ')) ||
+    '';
 /**
  * Render properties from props objects.
  * Insert return value in <script></script> element
@@ -25,22 +25,22 @@ export const renderAttributes = (args) => (typeof args === 'object' &&
  * @returns stringified properties script
  */
 export const renderProperties = (args, selector) => {
-  // has generated id selector starting with "#" create charcters (ex: '#0j3xzw4w7m') make test crashed sometime with "querySelector"
-  // we use "getElementById" document query
-  const query = selector.startsWith('#') ? 'getElementById' : 'querySelector';
-  if (query === 'getElementById')
-    selector = selector.replace('#', '');
-  return typeof args === 'object'
-    ? `
+    // has generated id selector starting with "#" create charcters (ex: '#0j3xzw4w7m') make test crashed sometime with "querySelector"
+    // we use "getElementById" document query
+    const query = selector.startsWith('#') ? 'getElementById' : 'querySelector';
+    if (query === 'getElementById')
+        selector = selector.replace('#', '');
+    return typeof args === 'object'
+        ? `
   ${Object.keys(args)
-      .filter(key => typeof args[key] === 'object')
-      .map(key => `document.${query}('${selector}').${key}=${JSON.stringify(args[key], (_key, val) => (typeof val === 'function' ? `<fn>${val}</fn>` : val))}`) // stringify json AND keep function values
-      .join(';\n') // create string
-      .split('"<fn>') // remove fn start decorator
-      .join('')
-      .split('</fn>"')
-      .join('') // remove fn end decorator
-    }`
-    : '';
+            .filter(key => typeof args[key] === 'object')
+            .map(key => `document.${query}('${selector}').${key}=${JSON.stringify(args[key], (_key, val) => (typeof val === 'function' ? `<fn>${val}</fn>` : val))}`) // stringify json AND keep function values
+            .join(';\n') // create string
+            .split('"<fn>') // remove fn start decorator
+            .join('')
+            .split('</fn>"')
+            .join('') // remove fn end decorator
+        }`
+        : '';
 };
 //# sourceMappingURL=e2e.test.utils.js.map

package/dist/collection/utils/e2e.test.utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"e2e.test.utils.js","sourceRoot":"","sources":["../../src/utils/e2e.test.utils.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,SAAkB,EAAE,IAAY,EAAU,EAAE,CACzE,GAAG,SAAS,CAAC,CAAC,CAAC,sDAAsD,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;AAEnH;;;;GAIG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAa,EAAU,EAAE,CACxD,CAAC,OAAO,IAAI,KAAK,QAAQ;EACvB,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;KACd,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,OAAO,IAAI,CAAC,GAAG,CAAC,KAAK,QAAQ,CAAC;KAC7F,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,GAAG,CAAC,OAAO,CAAC,iBAAiB,EAAE,OAAO,CAAC,CAAC,WAAW,EAAE,KAAK,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC;KACrF,IAAI,CAAC,GAAG,CAAC,CAAC;EACf,EAAE,CAAC;AAEL;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAa,EAAE,QAAgB,EAAU,EAAE;EAC1E,mIAAmI;EACnI,yCAAyC;EACzC,MAAM,KAAK,GAAuC,QAAQ,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,eAAe,CAAC;EAChH,IAAI,KAAK,KAAK,gBAAgB;IAAE,QAAQ,GAAG,QAAQ,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;EAErE,OAAO,OAAO,IAAI,KAAK,QAAQ;IAC7B,CAAC,CAAC;IAEF,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;OACd,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,OAAO,IAAI,CAAC,GAAG,CAAC,KAAK,QAAQ,CAAC;OAC5C,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,YAAY,KAAK,KAAK,QAAQ,MAAM,GAAG,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC,CAAC,OAAO,GAAG,KAAK,UAAU,CAAC,CAAC,CAAC,OAAO,GAAG,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,0CAA0C;OACnM,IAAI,CAAC,KAAK,CAAC,CAAC,gBAAgB;OAC5B,KAAK,CAAC,OAAO,CAAC,CAAC,4BAA4B;OAC3C,IAAI,CAAC,EAAE,CAAC;OACR,KAAK,CAAC,QAAQ,CAAC;OACf,IAAI,CAAC,EAAE,CAAC,CAAC,0BAA0B;IACxC,EAAE;IACA,CAAC,CAAC,EAAE,CAAC;AACT,CAAC,CAAC","sourcesContent":["/**\n * Add a darker background\n * usefull for light rendered element\n * @param condition - condition to add darker background\n * @param html - html to update\n * @returns html to render\n */\nexport const darkBackground = (condition: boolean, html: string): string =>\n  `${condition ? '<span style=\"background:#999;display:inline-block;\">' : ''}${html}${condition ? '</span>' : ''}`;\n\n/**\n * Render attributes from props objects\n * @param args - argument to render as string. ex: `{status: 'visible'}`\n * @returns formated inline attributed. ex: 'status=\"visible\"'\n */\nexport const renderAttributes = (args: unknown): string =>\n  (typeof args === 'object' &&\n    Object.keys(args)\n      .filter(key => ![null, undefined, false].includes(args[key]) && typeof args[key] !== 'object')\n      .map(key => `${key.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase()}=\"${args[key]}\"`)\n      .join(' ')) ||\n  '';\n\n/**\n * Render properties from props objects.\n * Insert return value in <script></script> element\n * @param args - argument to render as script. ex: `{status: 'visible'}`\n * @param selector - querySelector get targetted element and bind properties on it\n * @returns stringified properties script\n */\nexport const renderProperties = (args: unknown, selector: string): string => {\n  // has generated id selector starting with \"#\" create charcters (ex: '#0j3xzw4w7m') make test crashed sometime with \"querySelector\"\n  // we use \"getElementById\" document query\n  const query: 'querySelector' | 'getElementById' = selector.startsWith('#') ? 'getElementById' : 'querySelector';\n  if (query === 'getElementById') selector = selector.replace('#', '');\n\n  return typeof args === 'object'\n    ? `\n  ${\n    Object.keys(args)\n      .filter(key => typeof args[key] === 'object')\n      .map(key => `document.${query}('${selector}').${key}=${JSON.stringify(args[key], (_key, val) => (typeof val === 'function' ? `<fn>${val}</fn>` : val))}`) // stringify json AND keep function values\n      .join(';\\n') // create string\n      .split('\"<fn>') // remove fn start decorator\n      .join('')\n      .split('</fn>\"')\n      .join('') // remove fn end decorator\n  }`\n    : '';\n};\n"]}
+{"version":3,"file":"e2e.test.utils.js","sourceRoot":"","sources":["../../src/utils/e2e.test.utils.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,SAAkB,EAAE,IAAY,EAAU,EAAE,CACzE,GAAG,SAAS,CAAC,CAAC,CAAC,sDAAsD,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;AAEnH;;;;GAIG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAa,EAAU,EAAE,CACxD,CAAC,OAAO,IAAI,KAAK,QAAQ;IACvB,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;SACd,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,OAAO,IAAI,CAAC,GAAG,CAAC,KAAK,QAAQ,CAAC;SAC7F,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,GAAG,CAAC,OAAO,CAAC,iBAAiB,EAAE,OAAO,CAAC,CAAC,WAAW,EAAE,KAAK,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC;SACrF,IAAI,CAAC,GAAG,CAAC,CAAC;IACf,EAAE,CAAC;AAEL;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAa,EAAE,QAAgB,EAAU,EAAE;IAC1E,mIAAmI;IACnI,yCAAyC;IACzC,MAAM,KAAK,GAAuC,QAAQ,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,eAAe,CAAC;IAChH,IAAI,KAAK,KAAK,gBAAgB;QAAE,QAAQ,GAAG,QAAQ,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;IAErE,OAAO,OAAO,IAAI,KAAK,QAAQ;QAC7B,CAAC,CAAC;IAEF,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;aACd,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,OAAO,IAAI,CAAC,GAAG,CAAC,KAAK,QAAQ,CAAC;aAC5C,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,YAAY,KAAK,KAAK,QAAQ,MAAM,GAAG,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,EAAE,CAAC,CAAC,OAAO,GAAG,KAAK,UAAU,CAAC,CAAC,CAAC,OAAO,GAAG,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,0CAA0C;aACnM,IAAI,CAAC,KAAK,CAAC,CAAC,gBAAgB;aAC5B,KAAK,CAAC,OAAO,CAAC,CAAC,4BAA4B;aAC3C,IAAI,CAAC,EAAE,CAAC;aACR,KAAK,CAAC,QAAQ,CAAC;aACf,IAAI,CAAC,EAAE,CAAC,CAAC,0BAA0B;QACxC,EAAE;QACA,CAAC,CAAC,EAAE,CAAC;AACT,CAAC,CAAC","sourcesContent":["/**\n * Add a darker background\n * usefull for light rendered element\n * @param condition - condition to add darker background\n * @param html - html to update\n * @returns html to render\n */\nexport const darkBackground = (condition: boolean, html: string): string =>\n  `${condition ? '<span style=\"background:#999;display:inline-block;\">' : ''}${html}${condition ? '</span>' : ''}`;\n\n/**\n * Render attributes from props objects\n * @param args - argument to render as string. ex: `{status: 'visible'}`\n * @returns formated inline attributed. ex: 'status=\"visible\"'\n */\nexport const renderAttributes = (args: unknown): string =>\n  (typeof args === 'object' &&\n    Object.keys(args)\n      .filter(key => ![null, undefined, false].includes(args[key]) && typeof args[key] !== 'object')\n      .map(key => `${key.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase()}=\"${args[key]}\"`)\n      .join(' ')) ||\n  '';\n\n/**\n * Render properties from props objects.\n * Insert return value in <script></script> element\n * @param args - argument to render as script. ex: `{status: 'visible'}`\n * @param selector - querySelector get targetted element and bind properties on it\n * @returns stringified properties script\n */\nexport const renderProperties = (args: unknown, selector: string): string => {\n  // has generated id selector starting with \"#\" create charcters (ex: '#0j3xzw4w7m') make test crashed sometime with \"querySelector\"\n  // we use \"getElementById\" document query\n  const query: 'querySelector' | 'getElementById' = selector.startsWith('#') ? 'getElementById' : 'querySelector';\n  if (query === 'getElementById') selector = selector.replace('#', '');\n\n  return typeof args === 'object'\n    ? `\n  ${\n    Object.keys(args)\n      .filter(key => typeof args[key] === 'object')\n      .map(key => `document.${query}('${selector}').${key}=${JSON.stringify(args[key], (_key, val) => (typeof val === 'function' ? `<fn>${val}</fn>` : val))}`) // stringify json AND keep function values\n      .join(';\\n') // create string\n      .split('\"<fn>') // remove fn start decorator\n      .join('')\n      .split('</fn>\"')\n      .join('') // remove fn end decorator\n  }`\n    : '';\n};\n"]}

package/dist/collection/utils/locale.utils.js

@@ -6,7 +6,7 @@
  * @returns formatted currency
  */
 export const localeCurrency = (number, locale, currency) => {
-  return new Intl.NumberFormat(locale, { style: 'currency', currency }).format(number);
+    return new Intl.NumberFormat(locale, { style: 'currency', currency }).format(number);
 };
 /**
  * Format number to locale
@@ -15,7 +15,7 @@ export const localeCurrency = (number, locale, currency) => {
  * @returns formatted number
  */
 export const localeNumber = (number, locale) => {
-  return new Intl.NumberFormat(locale).format(number);
+    return new Intl.NumberFormat(locale).format(number);
 };
 /**
  * Date RegExp
@@ -28,10 +28,10 @@ export const dateRegExp = /^\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[12]\d|3[01])$/;
  * @returns formatted date
  */
 export const localeDate = (date, locale) => {
-  if (typeof date !== 'string' || date === '' || !dateRegExp.test(date)) {
-    return '';
-  }
-  return new Intl.DateTimeFormat(locale).format(new Date(date));
+    if (typeof date !== 'string' || date === '' || !dateRegExp.test(date)) {
+        return '';
+    }
+    return new Intl.DateTimeFormat(locale).format(new Date(date));
 };
 /**
  * Get locale and messages
@@ -42,16 +42,16 @@ export const localeDate = (date, locale) => {
  * @returns messages object
  */
 export const getLocaleMessages = (element, messages, defaultLocale) => {
-  // Get local
-  const closestLangAttribute = element.closest('[lang]');
-  const closestLang = Intl.NumberFormat.supportedLocalesOf(closestLangAttribute === null || closestLangAttribute === void 0 ? void 0 : closestLangAttribute.lang);
-  const locale = closestLang.length > 0 ? closestLang[0] : navigator.language || defaultLocale;
-  // Only keep first subtag
-  const localeSubtag = locale.split('-').shift();
-  // Return
-  return {
-    locale,
-    messages: messages[localeSubtag] || messages[defaultLocale],
-  };
+    // Get local
+    const closestLangAttribute = element.closest('[lang]');
+    const closestLang = Intl.NumberFormat.supportedLocalesOf(closestLangAttribute === null || closestLangAttribute === void 0 ? void 0 : closestLangAttribute.lang);
+    const locale = closestLang.length > 0 ? closestLang[0] : navigator.language || defaultLocale;
+    // Only keep first subtag
+    const localeSubtag = locale.split('-').shift();
+    // Return
+    return {
+        locale,
+        messages: messages[localeSubtag] || messages[defaultLocale],
+    };
 };
 //# sourceMappingURL=locale.utils.js.map

package/dist/collection/utils/locale.utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"locale.utils.js","sourceRoot":"","sources":["../../src/utils/locale.utils.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,MAAc,EAAE,MAAc,EAAE,QAAgB,EAAU,EAAE;EACzF,OAAO,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;AACvF,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,MAAc,EAAE,MAAc,EAAU,EAAE;EACrE,OAAO,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;AACtD,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,+CAA+C,CAAC;AAE1E;;;;;GAKG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,IAAY,EAAE,MAAc,EAAU,EAAE;EACjE,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;IACrE,OAAO,EAAE,CAAC;GACX;EACD,OAAO,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;AAChE,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,OAAoB,EAAE,QAAiB,EAAE,aAAqB,EAAyD,EAAE;EACzJ,YAAY;EACZ,MAAM,oBAAoB,GAAgB,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;EACpE,MAAM,WAAW,GAAa,IAAI,CAAC,YAAY,CAAC,kBAAkB,CAAC,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,IAAI,CAAC,CAAC;EAC/F,MAAM,MAAM,GAAG,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,IAAI,aAAa,CAAC;EAC7F,yBAAyB;EACzB,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC;EAC/C,SAAS;EACT,OAAO;IACL,MAAM;IACN,QAAQ,EAAE,QAAQ,CAAC,YAAY,CAAC,IAAI,QAAQ,CAAC,aAAa,CAAC;GAC5D,CAAC;AACJ,CAAC,CAAC","sourcesContent":["/**\n * Format number to the locale currency\n * @param number - number to format\n * @param locale - locale to apply\n * @param currency - currency to apply\n * @returns formatted currency\n */\nexport const localeCurrency = (number: number, locale: string, currency: string): string => {\n  return new Intl.NumberFormat(locale, { style: 'currency', currency }).format(number);\n};\n\n/**\n * Format number to locale\n * @param number - number to format\n * @param locale - locale to apply\n * @returns formatted number\n */\nexport const localeNumber = (number: number, locale: string): string => {\n  return new Intl.NumberFormat(locale).format(number);\n};\n\n/**\n * Date RegExp\n */\nexport const dateRegExp = /^\\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[12]\\d|3[01])$/;\n\n/**\n * Locale date format\n * @param date - date to format\n * @param locale - locale to apply\n * @returns formatted date\n */\nexport const localeDate = (date: string, locale: string): string => {\n  if (typeof date !== 'string' || date === '' || !dateRegExp.test(date)) {\n    return '';\n  }\n  return new Intl.DateTimeFormat(locale).format(new Date(date));\n};\n\n/**\n * Get locale and messages\n * We load the defined locale but for now we only support the first subtag for messages\n * @param element - element we need to get the language\n * @param messages - messages to use\n * @param defaultLocale - default messages locale\n * @returns messages object\n */\nexport const getLocaleMessages = (element: HTMLElement, messages: unknown, defaultLocale: string): { locale: string; messages: Record<string, unknown> } => {\n  // Get local\n  const closestLangAttribute: HTMLElement = element.closest('[lang]');\n  const closestLang: string[] = Intl.NumberFormat.supportedLocalesOf(closestLangAttribute?.lang);\n  const locale = closestLang.length > 0 ? closestLang[0] : navigator.language || defaultLocale;\n  // Only keep first subtag\n  const localeSubtag = locale.split('-').shift();\n  // Return\n  return {\n    locale,\n    messages: messages[localeSubtag] || messages[defaultLocale],\n  };\n};\n"]}
+{"version":3,"file":"locale.utils.js","sourceRoot":"","sources":["../../src/utils/locale.utils.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,MAAc,EAAE,MAAc,EAAE,QAAgB,EAAU,EAAE;IACzF,OAAO,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;AACvF,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,MAAc,EAAE,MAAc,EAAU,EAAE;IACrE,OAAO,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;AACtD,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,+CAA+C,CAAC;AAE1E;;;;;GAKG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,IAAY,EAAE,MAAc,EAAU,EAAE;IACjE,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE;QACrE,OAAO,EAAE,CAAC;KACX;IACD,OAAO,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;AAChE,CAAC,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,OAAoB,EAAE,QAAiB,EAAE,aAAqB,EAAyD,EAAE;IACzJ,YAAY;IACZ,MAAM,oBAAoB,GAAgB,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IACpE,MAAM,WAAW,GAAa,IAAI,CAAC,YAAY,CAAC,kBAAkB,CAAC,oBAAoB,aAApB,oBAAoB,uBAApB,oBAAoB,CAAE,IAAI,CAAC,CAAC;IAC/F,MAAM,MAAM,GAAG,WAAW,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,IAAI,aAAa,CAAC;IAC7F,yBAAyB;IACzB,MAAM,YAAY,GAAG,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC;IAC/C,SAAS;IACT,OAAO;QACL,MAAM;QACN,QAAQ,EAAE,QAAQ,CAAC,YAAY,CAAC,IAAI,QAAQ,CAAC,aAAa,CAAC;KAC5D,CAAC;AACJ,CAAC,CAAC","sourcesContent":["/**\n * Format number to the locale currency\n * @param number - number to format\n * @param locale - locale to apply\n * @param currency - currency to apply\n * @returns formatted currency\n */\nexport const localeCurrency = (number: number, locale: string, currency: string): string => {\n  return new Intl.NumberFormat(locale, { style: 'currency', currency }).format(number);\n};\n\n/**\n * Format number to locale\n * @param number - number to format\n * @param locale - locale to apply\n * @returns formatted number\n */\nexport const localeNumber = (number: number, locale: string): string => {\n  return new Intl.NumberFormat(locale).format(number);\n};\n\n/**\n * Date RegExp\n */\nexport const dateRegExp = /^\\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[12]\\d|3[01])$/;\n\n/**\n * Locale date format\n * @param date - date to format\n * @param locale - locale to apply\n * @returns formatted date\n */\nexport const localeDate = (date: string, locale: string): string => {\n  if (typeof date !== 'string' || date === '' || !dateRegExp.test(date)) {\n    return '';\n  }\n  return new Intl.DateTimeFormat(locale).format(new Date(date));\n};\n\n/**\n * Get locale and messages\n * We load the defined locale but for now we only support the first subtag for messages\n * @param element - element we need to get the language\n * @param messages - messages to use\n * @param defaultLocale - default messages locale\n * @returns messages object\n */\nexport const getLocaleMessages = (element: HTMLElement, messages: unknown, defaultLocale: string): { locale: string; messages: Record<string, unknown> } => {\n  // Get local\n  const closestLangAttribute: HTMLElement = element.closest('[lang]');\n  const closestLang: string[] = Intl.NumberFormat.supportedLocalesOf(closestLangAttribute?.lang);\n  const locale = closestLang.length > 0 ? closestLang[0] : navigator.language || defaultLocale;\n  // Only keep first subtag\n  const localeSubtag = locale.split('-').shift();\n  // Return\n  return {\n    locale,\n    messages: messages[localeSubtag] || messages[defaultLocale],\n  };\n};\n"]}

package/dist/collection/utils/locale.utils.spec.js

@@ -2,51 +2,51 @@ import { localeCurrency, localeNumber, localeDate, getLocaleMessages } from "./l
 import messagesEn from "../locales/en/messages.json";
 import messagesFr from "../locales/fr/messages.json";
 describe('locale.utils', () => {
-  describe.each(['en', 'fr'])('locale.utils: %s', locale => {
-    describe('localeCurrency', () => {
-      test('Should Format number to the locale currency', () => {
-        const formatedCurrency = localeCurrency(1234567890.12, locale, 'EUR');
-        expect(formatedCurrency).toEqual(locale === 'en' ? '€1,234,567,890.12' : '1 234 567 890,12\xa0€');
-      });
+    describe.each(['en', 'fr'])('locale.utils: %s', locale => {
+        describe('localeCurrency', () => {
+            test('Should Format number to the locale currency', () => {
+                const formatedCurrency = localeCurrency(1234567890.12, locale, 'EUR');
+                expect(formatedCurrency).toEqual(locale === 'en' ? '€1,234,567,890.12' : '1 234 567 890,12\xa0€');
+            });
+        });
+        describe('localeNumber', () => {
+            test('Should Format number to the locale', () => {
+                const formatedCurrency = localeNumber(1234567890.12, locale);
+                expect(formatedCurrency).toEqual(locale === 'en' ? '1,234,567,890.12' : '1 234 567 890,12');
+            });
+        });
+        describe('localeDate', () => {
+            test.each([undefined, '', 'blu'])('Should return empty string: %s', date => {
+                const formatedDate = localeDate(date, locale);
+                expect(formatedDate).toEqual('');
+            });
+            test('Should return formated date', () => {
+                const formatedDate = localeDate('2022-06-02', locale);
+                expect(formatedDate).toEqual(locale === 'en' ? '6/2/2022' : '02/06/2022');
+            });
+        });
+        describe('getLocaleMessages', () => {
+            const messages = { en: messagesEn, fr: messagesFr };
+            test('Should return default locale', () => {
+                const locales = getLocaleMessages(document.createElement('div'), messages, 'en');
+                expect(locales.locale).toEqual('en');
+                expect(locales.messages).toMatchObject(messagesEn);
+            });
+            test('Should return matching locale', () => {
+                const div = document.createElement('div');
+                div.lang = 'fr-FR';
+                const locales = getLocaleMessages(div, messages, 'en');
+                expect(locales.locale).toEqual(div.lang);
+                expect(locales.messages).toMatchObject(messagesFr);
+            });
+            test('Should return default locale messages when requested does not exist', () => {
+                const div = document.createElement('div');
+                div.lang = 'ca';
+                const locales = getLocaleMessages(div, messages, 'en');
+                expect(locales.locale).toEqual(div.lang);
+                expect(locales.messages).toMatchObject(messagesEn);
+            });
+        });
     });
-    describe('localeNumber', () => {
-      test('Should Format number to the locale', () => {
-        const formatedCurrency = localeNumber(1234567890.12, locale);
-        expect(formatedCurrency).toEqual(locale === 'en' ? '1,234,567,890.12' : '1 234 567 890,12');
-      });
-    });
-    describe('localeDate', () => {
-      test.each([undefined, '', 'blu'])('Should return empty string: %s', date => {
-        const formatedDate = localeDate(date, locale);
-        expect(formatedDate).toEqual('');
-      });
-      test('Should return formated date', () => {
-        const formatedDate = localeDate('2022-06-02', locale);
-        expect(formatedDate).toEqual(locale === 'en' ? '6/2/2022' : '02/06/2022');
-      });
-    });
-    describe('getLocaleMessages', () => {
-      const messages = { en: messagesEn, fr: messagesFr };
-      test('Should return default locale', () => {
-        const locales = getLocaleMessages(document.createElement('div'), messages, 'en');
-        expect(locales.locale).toEqual('en');
-        expect(locales.messages).toMatchObject(messagesEn);
-      });
-      test('Should return matching locale', () => {
-        const div = document.createElement('div');
-        div.lang = 'fr-FR';
-        const locales = getLocaleMessages(div, messages, 'en');
-        expect(locales.locale).toEqual(div.lang);
-        expect(locales.messages).toMatchObject(messagesFr);
-      });
-      test('Should return default locale messages when requested does not exist', () => {
-        const div = document.createElement('div');
-        div.lang = 'ca';
-        const locales = getLocaleMessages(div, messages, 'en');
-        expect(locales.locale).toEqual(div.lang);
-        expect(locales.messages).toMatchObject(messagesEn);
-      });
-    });
-  });
 });
 //# sourceMappingURL=locale.utils.spec.js.map

package/dist/collection/utils/locale.utils.spec.js.map

@@ -1 +1 @@
-{"version":3,"file":"locale.utils.spec.js","sourceRoot":"","sources":["../../src/utils/locale.utils.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { localeCurrency, localeNumber, localeDate, getLocaleMessages } from './locale.utils';\nimport messagesEn from '../locales/en/messages.json';\nimport messagesFr from '../locales/fr/messages.json';\n\ndescribe('locale.utils', () => {\n  describe.each(['en', 'fr'])('locale.utils: %s', locale => {\n    describe('localeCurrency', () => {\n      test('Should Format number to the locale currency', () => {\n        const formatedCurrency = localeCurrency(1234567890.12, locale, 'EUR');\n        expect(formatedCurrency).toEqual(locale === 'en' ? '€1,234,567,890.12' : '1 234 567 890,12\\xa0€');\n      });\n    });\n\n    describe('localeNumber', () => {\n      test('Should Format number to the locale', () => {\n        const formatedCurrency = localeNumber(1234567890.12, locale);\n        expect(formatedCurrency).toEqual(locale === 'en' ? '1,234,567,890.12' : '1 234 567 890,12');\n      });\n    });\n\n    describe('localeDate', () => {\n      test.each([undefined, '', 'blu'])('Should return empty string: %s', date => {\n        const formatedDate = localeDate(date, locale);\n        expect(formatedDate).toEqual('');\n      });\n\n      test('Should return formated date', () => {\n        const formatedDate = localeDate('2022-06-02', locale);\n        expect(formatedDate).toEqual(locale === 'en' ? '6/2/2022' : '02/06/2022');\n      });\n    });\n\n    describe('getLocaleMessages', () => {\n      const messages = { en: messagesEn, fr: messagesFr };\n      test('Should return default locale', () => {\n        const locales = getLocaleMessages(document.createElement('div'), messages, 'en');\n        expect(locales.locale).toEqual('en');\n        expect(locales.messages).toMatchObject(messagesEn);\n      });\n\n      test('Should return matching locale', () => {\n        const div = document.createElement('div');\n        div.lang = 'fr-FR';\n        const locales = getLocaleMessages(div, messages, 'en');\n        expect(locales.locale).toEqual(div.lang);\n        expect(locales.messages).toMatchObject(messagesFr);\n      });\n\n      test('Should return default locale messages when requested does not exist', () => {\n        const div = document.createElement('div');\n        div.lang = 'ca';\n        const locales = getLocaleMessages(div, messages, 'en');\n        expect(locales.locale).toEqual(div.lang);\n        expect(locales.messages).toMatchObject(messagesEn);\n      });\n    });\n  });\n});\n"]}
+{"version":3,"file":"locale.utils.spec.js","sourceRoot":"","sources":["../../src/utils/locale.utils.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { localeCurrency, localeNumber, localeDate, getLocaleMessages } from './locale.utils';\nimport messagesEn from '../locales/en/messages.json';\nimport messagesFr from '../locales/fr/messages.json';\n\ndescribe('locale.utils', () => {\n  describe.each(['en', 'fr'])('locale.utils: %s', locale => {\n    describe('localeCurrency', () => {\n      test('Should Format number to the locale currency', () => {\n        const formatedCurrency = localeCurrency(1234567890.12, locale, 'EUR');\n        expect(formatedCurrency).toEqual(locale === 'en' ? '€1,234,567,890.12' : '1 234 567 890,12\\xa0€');\n      });\n    });\n\n    describe('localeNumber', () => {\n      test('Should Format number to the locale', () => {\n        const formatedCurrency = localeNumber(1234567890.12, locale);\n        expect(formatedCurrency).toEqual(locale === 'en' ? '1,234,567,890.12' : '1 234 567 890,12');\n      });\n    });\n\n    describe('localeDate', () => {\n      test.each([undefined, '', 'blu'])('Should return empty string: %s', date => {\n        const formatedDate = localeDate(date, locale);\n        expect(formatedDate).toEqual('');\n      });\n\n      test('Should return formated date', () => {\n        const formatedDate = localeDate('2022-06-02', locale);\n        expect(formatedDate).toEqual(locale === 'en' ? '6/2/2022' : '02/06/2022');\n      });\n    });\n\n    describe('getLocaleMessages', () => {\n      const messages = { en: messagesEn, fr: messagesFr };\n      test('Should return default locale', () => {\n        const locales = getLocaleMessages(document.createElement('div'), messages, 'en');\n        expect(locales.locale).toEqual('en');\n        expect(locales.messages).toMatchObject(messagesEn);\n      });\n\n      test('Should return matching locale', () => {\n        const div = document.createElement('div');\n        div.lang = 'fr-FR';\n        const locales = getLocaleMessages(div, messages, 'en');\n        expect(locales.locale).toEqual(div.lang);\n        expect(locales.messages).toMatchObject(messagesFr);\n      });\n\n      test('Should return default locale messages when requested does not exist', () => {\n        const div = document.createElement('div');\n        div.lang = 'ca';\n        const locales = getLocaleMessages(div, messages, 'en');\n        expect(locales.locale).toEqual(div.lang);\n        expect(locales.messages).toMatchObject(messagesEn);\n      });\n    });\n  });\n});\n"]}

package/dist/collection/utils/playwright.e2e.test.utils.js

@@ -9,24 +9,24 @@ import { join } from "path";
  * @param html - html to load in page
  */
 export const setPageContent = async (page, html, viewportSize) => {
-  // We need to add mg-components to the e2e page
-  // Those solutions wasn't working to add the CSS
-  // await page.addStyleTag({ url: 'http://localhost:3333/build/mg-components.css' });
-  // CSS
-  const css = await readFile(join(__dirname, '../../www/build/mg-components.css'), { encoding: 'utf8' });
-  await page.addStyleTag({ content: css });
-  // JS
-  await page.addScriptTag({ url: 'http://localhost:3333/build/mg-components.esm.js', type: 'module' });
-  // Set page size before style setting to prevent "resize" event to be triggered
-  if (viewportSize !== undefined)
-    await page.setViewportSize(viewportSize);
-  // Set page content
-  // Added the `e2e-screenshot` class to be able to do the screenshot on this specific one with
-  // `await expect(page.locator('.e2e-screenshot')).toHaveScreenshot();`
-  await page.setContent(`<style>${css} .e2e-screenshot { display: inline-block; }</style><span class="e2e-screenshot">${html}</span>`);
-  // Make sure everything is loaded
-  await page.waitForLoadState('networkidle');
-  await page.waitForSelector('html.hydrated');
+    // We need to add mg-components to the e2e page
+    // Those solutions wasn't working to add the CSS
+    // await page.addStyleTag({ url: 'http://localhost:3333/build/mg-components.css' });
+    // CSS
+    const css = await readFile(join(__dirname, '../../www/build/mg-components.css'), { encoding: 'utf8' });
+    await page.addStyleTag({ content: css });
+    // JS
+    await page.addScriptTag({ url: 'http://localhost:3333/build/mg-components.esm.js', type: 'module' });
+    // Set page size before style setting to prevent "resize" event to be triggered
+    if (viewportSize !== undefined)
+        await page.setViewportSize(viewportSize);
+    // Set page content
+    // Added the `e2e-screenshot` class to be able to do the screenshot on this specific one with
+    // `await expect(page.locator('.e2e-screenshot')).toHaveScreenshot();`
+    await page.setContent(`<style>${css} .e2e-screenshot { display: inline-block; }</style><span class="e2e-screenshot">${html}</span>`);
+    // Make sure everything is loaded
+    await page.waitForLoadState('networkidle');
+    await page.waitForSelector('html.hydrated');
 };
 /**
  * playwright 'expect' function definition
@@ -57,14 +57,14 @@ const valueToString = (value) => (typeof value === 'object' ? JSON.stringify(val
  * @returns describe iteration
  */
 export const describeEach = (array, option) => (title, cb) => {
-  array.forEach(value => {
-    const displayTitle = title.replace('%s', valueToString(value));
-    const fn = () => cb(value);
-    if (Boolean(option))
-      describe[option](displayTitle, fn);
-    else
-      describe(displayTitle, fn);
-  });
+    array.forEach(value => {
+        const displayTitle = title.replace('%s', valueToString(value));
+        const fn = () => cb(value);
+        if (Boolean(option))
+            describe[option](displayTitle, fn);
+        else
+            describe(displayTitle, fn);
+    });
 };
 /**
  * repeat test over array
@@ -73,14 +73,14 @@ export const describeEach = (array, option) => (title, cb) => {
  * @returns test iteration
  */
 export const testEach = (array, option) => (title, cb) => {
-  array.forEach(value => {
-    const displayTitle = title.replace('%s', valueToString(value));
-    const fn = async ({ page }) => cb(page, value);
-    if (Boolean(option))
-      test[option](displayTitle, fn);
-    else
-      test(displayTitle, fn);
-  });
+    array.forEach(value => {
+        const displayTitle = title.replace('%s', valueToString(value));
+        const fn = async ({ page }) => cb(page, value);
+        if (Boolean(option))
+            test[option](displayTitle, fn);
+        else
+            test(displayTitle, fn);
+    });
 };
 /**
  * Update .e2e-screenshot style for screenshot needs
@@ -89,12 +89,12 @@ export const testEach = (array, option) => (title, cb) => {
  * @returns class style definition
  */
 export const updateScreenshotClass = async (page, params) => page.evaluate(params => {
-  const css = `.e2e-screenshot { ${Object.keys(params)
-    .map(key => `${key}: ${typeof params[key] === 'string' ? params[key] : ''}`)
-    .join(';')} }`;
-  const body = document.getElementsByTagName('body')[0];
-  const style = document.createElement('style');
-  body.appendChild(style);
-  style.appendChild(document.createTextNode(css));
+    const css = `.e2e-screenshot { ${Object.keys(params)
+        .map(key => `${key}: ${typeof params[key] === 'string' ? params[key] : ''}`)
+        .join(';')} }`;
+    const body = document.getElementsByTagName('body')[0];
+    const style = document.createElement('style');
+    body.appendChild(style);
+    style.appendChild(document.createTextNode(css));
 }, params);
 //# sourceMappingURL=playwright.e2e.test.utils.js.map

package/dist/collection/utils/playwright.e2e.test.utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"playwright.e2e.test.utils.js","sourceRoot":"","sources":["../../src/utils/playwright.e2e.test.utils.ts"],"names":[],"mappings":"AAAA,uDAAuD;AACvD,OAAO,EAA2B,IAAI,IAAI,cAAc,EAAE,MAAM,IAAI,gBAAgB,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAC7I,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,IAAI,EAAE,MAAM,MAAM,CAAC;AAE5B;;;;;GAKG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,KAAK,EAAE,IAAU,EAAE,IAAY,EAAE,YAA2B,EAAiB,EAAE;EAC3G,+CAA+C;EAC/C,gDAAgD;EAChD,oFAAoF;EAEpF,MAAM;EACN,MAAM,GAAG,GAAG,MAAM,QAAQ,CAAC,IAAI,CAAC,SAAS,EAAE,mCAAmC,CAAC,EAAE,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC,CAAC;EACvG,MAAM,IAAI,CAAC,WAAW,CAAC,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC;EAEzC,KAAK;EACL,MAAM,IAAI,CAAC,YAAY,CAAC,EAAE,GAAG,EAAE,kDAAkD,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;EAErG,+EAA+E;EAC/E,IAAI,YAAY,KAAK,SAAS;IAAE,MAAM,IAAI,CAAC,eAAe,CAAC,YAAY,CAAC,CAAC;EAEzE,mBAAmB;EACnB,6FAA6F;EAC7F,sEAAsE;EACtE,MAAM,IAAI,CAAC,UAAU,CAAC,UAAU,GAAG,mFAAmF,IAAI,SAAS,CAAC,CAAC;EAErI,iCAAiC;EACjC,MAAM,IAAI,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC;EAC3C,MAAM,IAAI,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;AAC9C,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,gBAAgB,CAAC;AAEvC;;GAEG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,cAAc,CAAC,QAAQ,CAAC;AAEhD;;GAEG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,cAAc,CAAC;AAEnC;;GAEG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,iBAAiB,CAAC;AAEzC;;;;GAIG;AACH,MAAM,aAAa,GAAG,CAAC,KAAc,EAAU,EAAE,CAAC,CAAC,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,KAAK,EAAE,CAAC,CAAC;AAOnH;;;;;GAKG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAAsB,EAAE,MAAwB,EAAE,EAAE,CAAC,CAAC,KAAa,EAAE,EAA4B,EAAE,EAAE;EAChI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;IACpB,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC;IAC/D,MAAM,EAAE,GAAG,GAAG,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;IAC3B,IAAI,OAAO,CAAC,MAAM,CAAC;MAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;;MACnD,QAAQ,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;EAClC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAsB,EAAE,MAAwB,EAAE,EAAE,CAAC,CAAC,KAAa,EAAE,EAAqD,EAAE,EAAE;EACrJ,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;IACpB,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC;IAC/D,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IAC/C,IAAI,OAAO,CAAC,MAAM,CAAC;MAAE,IAAI,CAAC,MAAM,CAAC,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;;MAC/C,IAAI,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;EAC9B,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,KAAK,EAAE,IAAU,EAAE,MAAe,EAAiB,EAAE,CACxF,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;EACrB,MAAM,GAAG,GAAG,qBAAqB,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC;KACjD,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,GAAG,KAAK,OAAO,MAAM,CAAC,GAAG,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;KAC3E,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC;EACjB,MAAM,IAAI,GAAG,QAAQ,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;EACtD,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;EAC9C,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;EACxB,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,CAAC;AAClD,CAAC,EAAE,MAAM,CAAC,CAAC","sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { type Page, ViewportSize, test as playwrightTest, expect as playwrightExpect, devices as playwrightDevices } from '@playwright/test';\nimport { readFile } from 'fs/promises';\nimport { join } from 'path';\n\n/**\n * Add mg-components to browser page\n *\n * @param page - browser page\n * @param html - html to load in page\n */\nexport const setPageContent = async (page: Page, html: string, viewportSize?: ViewportSize): Promise<void> => {\n  // We need to add mg-components to the e2e page\n  // Those solutions wasn't working to add the CSS\n  // await page.addStyleTag({ url: 'http://localhost:3333/build/mg-components.css' });\n\n  // CSS\n  const css = await readFile(join(__dirname, '../../www/build/mg-components.css'), { encoding: 'utf8' });\n  await page.addStyleTag({ content: css });\n\n  // JS\n  await page.addScriptTag({ url: 'http://localhost:3333/build/mg-components.esm.js', type: 'module' });\n\n  // Set page size before style setting to prevent \"resize\" event to be triggered\n  if (viewportSize !== undefined) await page.setViewportSize(viewportSize);\n\n  // Set page content\n  // Added the `e2e-screenshot` class to be able to do the screenshot on this specific one with\n  // `await expect(page.locator('.e2e-screenshot')).toHaveScreenshot();`\n  await page.setContent(`<style>${css} .e2e-screenshot { display: inline-block; }</style><span class=\"e2e-screenshot\">${html}</span>`);\n\n  // Make sure everything is loaded\n  await page.waitForLoadState('networkidle');\n  await page.waitForSelector('html.hydrated');\n};\n\n/**\n * playwright 'expect' function definition\n */\nexport const expect = playwrightExpect;\n\n/**\n * playwright 'describe' function definition\n */\nexport const describe = playwrightTest.describe;\n\n/**\n * playwright 'test' function definition\n */\nexport const test = playwrightTest;\n\n/**\n * playwright 'devices' definition\n */\nexport const devices = playwrightDevices;\n\n/**\n * Value to get in string\n * @param value - valut to stringify\n * @returns stringified value\n */\nconst valueToString = (value: unknown): string => (typeof value === 'object' ? JSON.stringify(value) : `${value}`);\n\n/**\n * Declare page type\n */\nexport type PageType = Page;\n\n/**\n * repeat test over array\n * @param array - array of test\n * @param option - test runner option\n * @returns describe iteration\n */\nexport const describeEach = (array: unknown[] | any, option?: 'skip' | 'only') => (title: string, cb: (param: unknown) => void) => {\n  array.forEach(value => {\n    const displayTitle = title.replace('%s', valueToString(value));\n    const fn = () => cb(value);\n    if (Boolean(option)) describe[option](displayTitle, fn);\n    else describe(displayTitle, fn);\n  });\n};\n\n/**\n * repeat test over array\n * @param array - array of test\n * @param option - test runner option\n * @returns test iteration\n */\nexport const testEach = (array: unknown[] | any, option?: 'skip' | 'only') => (title: string, cb: (page: PageType, param: unknown) => Promise<void>) => {\n  array.forEach(value => {\n    const displayTitle = title.replace('%s', valueToString(value));\n    const fn = async ({ page }) => cb(page, value);\n    if (Boolean(option)) test[option](displayTitle, fn);\n    else test(displayTitle, fn);\n  });\n};\n\n/**\n * Update .e2e-screenshot style for screenshot needs\n * @param page - playwright Page\n * @param params - css properties to apply\n * @returns class style definition\n */\nexport const updateScreenshotClass = async (page: Page, params: unknown): Promise<void> =>\n  page.evaluate(params => {\n    const css = `.e2e-screenshot { ${Object.keys(params)\n      .map(key => `${key}: ${typeof params[key] === 'string' ? params[key] : ''}`)\n      .join(';')} }`;\n    const body = document.getElementsByTagName('body')[0];\n    const style = document.createElement('style');\n    body.appendChild(style);\n    style.appendChild(document.createTextNode(css));\n  }, params);\n"]}
+{"version":3,"file":"playwright.e2e.test.utils.js","sourceRoot":"","sources":["../../src/utils/playwright.e2e.test.utils.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { type Page, ViewportSize, test as playwrightTest, expect as playwrightExpect, devices as playwrightDevices } from '@playwright/test';\nimport { readFile } from 'fs/promises';\nimport { join } from 'path';\n\n/**\n * Add mg-components to browser page\n *\n * @param page - browser page\n * @param html - html to load in page\n */\nexport const setPageContent = async (page: Page, html: string, viewportSize?: ViewportSize): Promise<void> => {\n  // We need to add mg-components to the e2e page\n  // Those solutions wasn't working to add the CSS\n  // await page.addStyleTag({ url: 'http://localhost:3333/build/mg-components.css' });\n\n  // CSS\n  const css = await readFile(join(__dirname, '../../www/build/mg-components.css'), { encoding: 'utf8' });\n  await page.addStyleTag({ content: css });\n\n  // JS\n  await page.addScriptTag({ url: 'http://localhost:3333/build/mg-components.esm.js', type: 'module' });\n\n  // Set page size before style setting to prevent \"resize\" event to be triggered\n  if (viewportSize !== undefined) await page.setViewportSize(viewportSize);\n\n  // Set page content\n  // Added the `e2e-screenshot` class to be able to do the screenshot on this specific one with\n  // `await expect(page.locator('.e2e-screenshot')).toHaveScreenshot();`\n  await page.setContent(`<style>${css} .e2e-screenshot { display: inline-block; }</style><span class=\"e2e-screenshot\">${html}</span>`);\n\n  // Make sure everything is loaded\n  await page.waitForLoadState('networkidle');\n  await page.waitForSelector('html.hydrated');\n};\n\n/**\n * playwright 'expect' function definition\n */\nexport const expect = playwrightExpect;\n\n/**\n * playwright 'describe' function definition\n */\nexport const describe = playwrightTest.describe;\n\n/**\n * playwright 'test' function definition\n */\nexport const test = playwrightTest;\n\n/**\n * playwright 'devices' definition\n */\nexport const devices = playwrightDevices;\n\n/**\n * Value to get in string\n * @param value - valut to stringify\n * @returns stringified value\n */\nconst valueToString = (value: unknown): string => (typeof value === 'object' ? JSON.stringify(value) : `${value}`);\n\n/**\n * Declare page type\n */\nexport type PageType = Page;\n\n/**\n * repeat test over array\n * @param array - array of test\n * @param option - test runner option\n * @returns describe iteration\n */\nexport const describeEach = (array: unknown[] | any, option?: 'skip' | 'only') => (title: string, cb: (param: unknown) => void) => {\n  array.forEach(value => {\n    const displayTitle = title.replace('%s', valueToString(value));\n    const fn = () => cb(value);\n    if (Boolean(option)) describe[option](displayTitle, fn);\n    else describe(displayTitle, fn);\n  });\n};\n\n/**\n * repeat test over array\n * @param array - array of test\n * @param option - test runner option\n * @returns test iteration\n */\nexport const testEach = (array: unknown[] | any, option?: 'skip' | 'only') => (title: string, cb: (page: PageType, param: unknown) => Promise<void>) => {\n  array.forEach(value => {\n    const displayTitle = title.replace('%s', valueToString(value));\n    const fn = async ({ page }) => cb(page, value);\n    if (Boolean(option)) test[option](displayTitle, fn);\n    else test(displayTitle, fn);\n  });\n};\n\n/**\n * Update .e2e-screenshot style for screenshot needs\n * @param page - playwright Page\n * @param params - css properties to apply\n * @returns class style definition\n */\nexport const updateScreenshotClass = async (page: Page, params: unknown): Promise<void> =>\n  page.evaluate(params => {\n    const css = `.e2e-screenshot { ${Object.keys(params)\n      .map(key => `${key}: ${typeof params[key] === 'string' ? params[key] : ''}`)\n      .join(';')} }`;\n    const body = document.getElementsByTagName('body')[0];\n    const style = document.createElement('style');\n    body.appendChild(style);\n    style.appendChild(document.createTextNode(css));\n  }, params);\n"]}

package/dist/collection/utils/playwright.fixture.js

@@ -0,0 +1,24 @@
+import { test as base } from "@playwright/test";
+export const test = base.extend({
+    page: async ({ page }, use) => {
+        // Override setContent method to keep style and script tags
+        page.setContent = async (html) => {
+            await page.evaluate((html) => {
+                // Add content to the body
+                document.body.innerHTML = `<span class="e2e-screenshot">${html}</span>`;
+            }, html);
+        };
+        // Add lib JS
+        await page.addScriptTag({ url: 'http://localhost:3333/build/mg-components.esm.js', type: 'module' });
+        // Add lib CSS
+        await page.addStyleTag({ url: 'http://localhost:3333/build/mg-components.css' });
+        // Add screenshot CSS
+        await page.addStyleTag({ content: '.e2e-screenshot{display:inline-block}' });
+        // Make sure everything is loaded
+        await page.waitForLoadState('networkidle');
+        await page.waitForSelector('html.hydrated');
+        // Use extended page
+        await use(page);
+    },
+});
+//# sourceMappingURL=playwright.fixture.js.map

package/dist/collection/utils/playwright.fixture.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"playwright.fixture.js","sourceRoot":"","sources":["../../src/utils/playwright.fixture.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,IAAI,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAEhD,MAAM,CAAC,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,CAAiB;IAC9C,IAAI,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,GAAG,EAAE,EAAE;QAC5B,2DAA2D;QAC3D,IAAI,CAAC,UAAU,GAAG,KAAK,EAAE,IAAY,EAAE,EAAE;YACvC,MAAM,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAY,EAAE,EAAE;gBACnC,0BAA0B;gBAC1B,QAAQ,CAAC,IAAI,CAAC,SAAS,GAAG,gCAAgC,IAAI,SAAS,CAAC;YAC1E,CAAC,EAAE,IAAI,CAAC,CAAC;QACX,CAAC,CAAC;QACF,aAAa;QACb,MAAM,IAAI,CAAC,YAAY,CAAC,EAAE,GAAG,EAAE,kDAAkD,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;QACrG,cAAc;QACd,MAAM,IAAI,CAAC,WAAW,CAAC,EAAE,GAAG,EAAE,+CAA+C,EAAE,CAAC,CAAC;QACjF,qBAAqB;QACrB,MAAM,IAAI,CAAC,WAAW,CAAC,EAAE,OAAO,EAAE,uCAAuC,EAAE,CAAC,CAAC;QAC7E,iCAAiC;QACjC,MAAM,IAAI,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC;QAC3C,MAAM,IAAI,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;QAC5C,oBAAoB;QACpB,MAAM,GAAG,CAAC,IAAI,CAAC,CAAC;IAClB,CAAC;CACF,CAAC,CAAC","sourcesContent":["import { test as base } from '@playwright/test';\n\nexport const test = base.extend<{ page: void }>({\n  page: async ({ page }, use) => {\n    // Override setContent method to keep style and script tags\n    page.setContent = async (html: string) => {\n      await page.evaluate((html: string) => {\n        // Add content to the body\n        document.body.innerHTML = `<span class=\"e2e-screenshot\">${html}</span>`;\n      }, html);\n    };\n    // Add lib JS\n    await page.addScriptTag({ url: 'http://localhost:3333/build/mg-components.esm.js', type: 'module' });\n    // Add lib CSS\n    await page.addStyleTag({ url: 'http://localhost:3333/build/mg-components.css' });\n    // Add screenshot CSS\n    await page.addStyleTag({ content: '.e2e-screenshot{display:inline-block}' });\n    // Make sure everything is loaded\n    await page.waitForLoadState('networkidle');\n    await page.waitForSelector('html.hydrated');\n    // Use extended page\n    await use(page);\n  },\n});\n"]}

package/dist/collection/utils/unit.test.utils.js

@@ -7,22 +7,22 @@ import { MockCustomEvent } from "@stencil/core/mock-doc";
  */
 export const cloneDeep = (obj) => JSON.parse(JSON.stringify(obj));
 export const setupMutationObserverMock = ({ disconnect, observe, takeRecords }) => {
-  class MockMutationObserver {
-    constructor(fn) {
-      this.disconnect = disconnect;
-      this.observe = observe;
-      this.takeRecords = takeRecords;
-      this.cb = fn;
+    class MockMutationObserver {
+        constructor(fn) {
+            this.disconnect = disconnect;
+            this.observe = observe;
+            this.takeRecords = takeRecords;
+            this.cb = fn;
+        }
     }
-  }
-  [window, global].forEach(element => {
-    Object.defineProperty(element, 'MutationObserver', {
-      writable: true,
-      configurable: true,
-      value: MockMutationObserver,
+    [window, global].forEach(element => {
+        Object.defineProperty(element, 'MutationObserver', {
+            writable: true,
+            configurable: true,
+            value: MockMutationObserver,
+        });
     });
-  });
-  return MockMutationObserver;
+    return MockMutationObserver;
 };
 /**
  * Utility function that mocks the `ResizeObserver` API. Recommended to execute inside `beforeEach`.
@@ -51,21 +51,21 @@ export const setupMutationObserverMock = ({ disconnect, observe, takeRecords })
  * ```
  */
 export const setupResizeObserverMock = ({ disconnect, observe }) => {
-  class MockResizeObserver {
-    constructor(fn) {
-      this.disconnect = disconnect;
-      this.observe = observe;
-      this.cb = fn;
+    class MockResizeObserver {
+        constructor(fn) {
+            this.disconnect = disconnect;
+            this.observe = observe;
+            this.cb = fn;
+        }
     }
-  }
-  [window, global].forEach(element => {
-    Object.defineProperty(element, 'ResizeObserver', {
-      writable: true,
-      configurable: true,
-      value: MockResizeObserver,
+    [window, global].forEach(element => {
+        Object.defineProperty(element, 'ResizeObserver', {
+            writable: true,
+            configurable: true,
+            value: MockResizeObserver,
+        });
     });
-  });
-  return MockResizeObserver;
+    return MockResizeObserver;
 };
 /**
  * Utility function that mocks the `SubmitEvent` API. Recommended to execute inside `beforeEach`.
@@ -76,16 +76,16 @@ export const setupResizeObserverMock = ({ disconnect, observe }) => {
  * @returns custom event mock
  */
 export const setupSubmitEventMock = () => {
-  class SubmitEvent extends MockCustomEvent {
-  }
-  [window, global].forEach(element => {
-    Object.defineProperty(element, 'SubmitEvent', {
-      writable: true,
-      configurable: true,
-      value: SubmitEvent,
+    class SubmitEvent extends MockCustomEvent {
+    }
+    [window, global].forEach(element => {
+        Object.defineProperty(element, 'SubmitEvent', {
+            writable: true,
+            configurable: true,
+            value: SubmitEvent,
+        });
     });
-  });
-  return SubmitEvent;
+    return SubmitEvent;
 };
 /**
  * force popover id when component use randomed identifier
@@ -94,11 +94,11 @@ export const setupSubmitEventMock = () => {
  * @param interactiveElement - element where attribute 'aria-controls' is set
  */
 export const forcePopoverId = (component, id, interactiveElement = 'button') => {
-  const popover = component.shadowRoot.querySelector('mg-popover');
-  if (popover !== null) {
-    popover.querySelector('mg-popover-content').setAttribute('id', id);
-    component.shadowRoot.querySelector(interactiveElement).setAttribute('aria-controls', id);
-  }
+    const popover = component.shadowRoot.querySelector('mg-popover');
+    if (popover !== null) {
+        popover.querySelector('mg-popover-content').setAttribute('id', id);
+        component.shadowRoot.querySelector(interactiveElement).setAttribute('aria-controls', id);
+    }
 };
 /**
  * fix popper console.error in test
@@ -108,20 +108,20 @@ export const forcePopoverId = (component, id, interactiveElement = 'button') =>
  * so we only override the console.error side effect for this error
  */
 export const mockConsoleError = () => {
-  const errorFunction = console.error;
-  const mock = jest.spyOn(console, 'error');
-  mock.mockImplementation(error => {
-    if (!error.includes('Popper'))
-      errorFunction(error);
-  });
+    const errorFunction = console.error;
+    const mock = jest.spyOn(console, 'error');
+    mock.mockImplementation(error => {
+        if (!error.includes('Popper'))
+            errorFunction(error);
+    });
 };
 /**
  * Add missing window.frames property to test context
  * usefull for component with iframe listeners, ex: mg-popover
  */
 export const mockWindowFrames = () => {
-  Object.defineProperty(window, 'frames', {
-    value: { length: 0 },
-  });
+    Object.defineProperty(window, 'frames', {
+        value: { length: 0 },
+    });
 };
 //# sourceMappingURL=unit.test.utils.js.map