@saasquatch/mint-components 1.15.0-59 → 1.15.0-60

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (115) hide show
  1. package/dist/cjs/{IndirectTaxDetailsView-82997130.js → IndirectTaxDetailsView-b783411a.js} +2 -2
  2. package/dist/cjs/{ShadowViewAddon-bccd02b4.js → ShadowViewAddon-cb3fc679.js} +1 -1
  3. package/dist/cjs/{global-303a0ed3.js → global-6ee8a4bb.js} +48 -12
  4. package/dist/cjs/loader.cjs.js +1 -1
  5. package/dist/cjs/mint-components.cjs.js +1 -1
  6. package/dist/cjs/sqm-banking-info-form_10.cjs.entry.js +3 -3
  7. package/dist/cjs/sqm-big-stat_42.cjs.entry.js +14 -20
  8. package/dist/cjs/sqm-code-verification.cjs.entry.js +1 -1
  9. package/dist/cjs/sqm-email-verification.cjs.entry.js +1 -1
  10. package/dist/cjs/sqm-empty_4.cjs.entry.js +1 -1
  11. package/dist/cjs/sqm-leaderboard-rank.cjs.entry.js +1 -1
  12. package/dist/cjs/sqm-pagination_3.cjs.entry.js +1 -1
  13. package/dist/cjs/{sqm-portal-email-verification-view-4d4dd884.js → sqm-portal-email-verification-view-d3dccee1.js} +1 -1
  14. package/dist/cjs/sqm-portal-email-verification.cjs.entry.js +2 -2
  15. package/dist/cjs/{sqm-portal-profile-view-ef90b55f.js → sqm-portal-profile-view-153a8ca9.js} +1 -1
  16. package/dist/cjs/sqm-portal-profile.cjs.entry.js +2 -2
  17. package/dist/cjs/sqm-referral-table_11.cjs.entry.js +1 -1
  18. package/dist/cjs/sqm-rewards-table_9.cjs.entry.js +1 -1
  19. package/dist/cjs/sqm-stencilbook.cjs.entry.js +6 -6
  20. package/dist/cjs/sqm-tax-and-cash.cjs.entry.js +2 -2
  21. package/dist/cjs/{utils-055817a8.js → utils-8b6dc3f8.js} +1 -1
  22. package/dist/collection/components/sqm-brand/sqm-brand.js +11 -4
  23. package/dist/collection/global/global.js +8 -6
  24. package/dist/collection/global/styles.js +10 -7
  25. package/dist/collection/global/styles.ts +5 -2
  26. package/dist/collection/insertfont.js +18 -0
  27. package/dist/esm/{IndirectTaxDetailsView-0566ce31.js → IndirectTaxDetailsView-54319d79.js} +2 -2
  28. package/dist/esm/{ShadowViewAddon-67b43814.js → ShadowViewAddon-ff7a4b04.js} +1 -1
  29. package/dist/esm/{global-5cd903e5.js → global-c38fd7a9.js} +48 -13
  30. package/dist/esm/loader.js +1 -1
  31. package/dist/esm/mint-components.js +1 -1
  32. package/dist/esm/sqm-banking-info-form_10.entry.js +3 -3
  33. package/dist/esm/sqm-big-stat_42.entry.js +13 -19
  34. package/dist/esm/sqm-code-verification.entry.js +1 -1
  35. package/dist/esm/sqm-email-verification.entry.js +1 -1
  36. package/dist/esm/sqm-empty_4.entry.js +1 -1
  37. package/dist/esm/sqm-leaderboard-rank.entry.js +1 -1
  38. package/dist/esm/sqm-pagination_3.entry.js +1 -1
  39. package/dist/esm/{sqm-portal-email-verification-view-a4076c61.js → sqm-portal-email-verification-view-cb5b8338.js} +1 -1
  40. package/dist/esm/sqm-portal-email-verification.entry.js +2 -2
  41. package/dist/esm/{sqm-portal-profile-view-d0ac20aa.js → sqm-portal-profile-view-47aafa20.js} +1 -1
  42. package/dist/esm/sqm-portal-profile.entry.js +2 -2
  43. package/dist/esm/sqm-referral-table_11.entry.js +1 -1
  44. package/dist/esm/sqm-rewards-table_9.entry.js +1 -1
  45. package/dist/esm/sqm-stencilbook.entry.js +6 -6
  46. package/dist/esm/sqm-tax-and-cash.entry.js +2 -2
  47. package/dist/esm/{utils-4f44d1ed.js → utils-9c62ea4a.js} +1 -1
  48. package/dist/esm-es5/{IndirectTaxDetailsView-0566ce31.js → IndirectTaxDetailsView-54319d79.js} +1 -1
  49. package/dist/esm-es5/{ShadowViewAddon-67b43814.js → ShadowViewAddon-ff7a4b04.js} +1 -1
  50. package/dist/esm-es5/{global-5cd903e5.js → global-c38fd7a9.js} +4 -4
  51. package/dist/esm-es5/loader.js +1 -1
  52. package/dist/esm-es5/mint-components.js +1 -1
  53. package/dist/esm-es5/sqm-banking-info-form_10.entry.js +1 -1
  54. package/dist/esm-es5/sqm-big-stat_42.entry.js +1 -1
  55. package/dist/esm-es5/sqm-code-verification.entry.js +1 -1
  56. package/dist/esm-es5/sqm-email-verification.entry.js +1 -1
  57. package/dist/esm-es5/sqm-empty_4.entry.js +1 -1
  58. package/dist/esm-es5/sqm-leaderboard-rank.entry.js +1 -1
  59. package/dist/esm-es5/sqm-pagination_3.entry.js +1 -1
  60. package/dist/esm-es5/{sqm-portal-email-verification-view-a4076c61.js → sqm-portal-email-verification-view-cb5b8338.js} +1 -1
  61. package/dist/esm-es5/sqm-portal-email-verification.entry.js +1 -1
  62. package/dist/esm-es5/{sqm-portal-profile-view-d0ac20aa.js → sqm-portal-profile-view-47aafa20.js} +1 -1
  63. package/dist/esm-es5/sqm-portal-profile.entry.js +1 -1
  64. package/dist/esm-es5/sqm-referral-table_11.entry.js +1 -1
  65. package/dist/esm-es5/sqm-rewards-table_9.entry.js +1 -1
  66. package/dist/esm-es5/sqm-stencilbook.entry.js +1 -1
  67. package/dist/esm-es5/sqm-tax-and-cash.entry.js +1 -1
  68. package/dist/esm-es5/{utils-4f44d1ed.js → utils-9c62ea4a.js} +1 -1
  69. package/dist/mint-components/global/styles.ts +5 -2
  70. package/dist/mint-components/mint-components.esm.js +1 -1
  71. package/dist/mint-components/mint-components.js +1 -1
  72. package/dist/mint-components/{p-1fcef6b3.system.js → p-003325f4.system.js} +10 -10
  73. package/dist/mint-components/{p-4e57299e.system.js → p-06a84a39.system.js} +1 -1
  74. package/dist/mint-components/{p-198eea1e.system.js → p-118593a6.system.js} +1 -1
  75. package/dist/mint-components/{p-3d323c4e.entry.js → p-12cb6a87.entry.js} +1 -1
  76. package/dist/mint-components/{p-73d6e64d.js → p-15915f9a.js} +1 -1
  77. package/dist/mint-components/{p-d514fae0.system.entry.js → p-15c04aac.system.entry.js} +1 -1
  78. package/dist/mint-components/{p-09e4b76a.entry.js → p-1870fd94.entry.js} +1 -1
  79. package/dist/mint-components/{p-31b7d857.system.entry.js → p-19c2cfae.system.entry.js} +1 -1
  80. package/dist/mint-components/{p-61e9c1ea.entry.js → p-22d59cba.entry.js} +19 -19
  81. package/dist/mint-components/{p-04b2ea6e.system.entry.js → p-29710406.system.entry.js} +1 -1
  82. package/dist/mint-components/{p-462c53b1.entry.js → p-2a69ccdc.entry.js} +2 -2
  83. package/dist/mint-components/{p-5930ec77.entry.js → p-3a22b54d.entry.js} +1 -1
  84. package/dist/mint-components/{p-96750d1d.js → p-487ca373.js} +1 -1
  85. package/dist/mint-components/{p-4f15ee1e.entry.js → p-4d95a728.entry.js} +1 -1
  86. package/dist/mint-components/{p-bca249f8.system.js → p-50302878.system.js} +1 -1
  87. package/dist/mint-components/{p-84b38f63.system.entry.js → p-5911a34f.system.entry.js} +1 -1
  88. package/dist/mint-components/{p-c9f99a68.js → p-5decae6e.js} +1 -1
  89. package/dist/mint-components/{p-0b71a267.entry.js → p-66b35c5f.entry.js} +1 -1
  90. package/dist/mint-components/{p-0ae14c43.system.entry.js → p-6826e36f.system.entry.js} +1 -1
  91. package/dist/mint-components/{p-c935d40e.entry.js → p-68e277f9.entry.js} +1 -1
  92. package/dist/mint-components/{p-7a772a4a.js → p-7264a34d.js} +1 -1
  93. package/dist/mint-components/{p-7b529db0.entry.js → p-77a73017.entry.js} +1 -1
  94. package/dist/mint-components/p-8c42d0a1.system.entry.js +1 -0
  95. package/dist/mint-components/{p-0e45e635.system.entry.js → p-8c8845f6.system.entry.js} +1 -1
  96. package/dist/mint-components/{p-0d312808.system.entry.js → p-9043b1c3.system.entry.js} +1 -1
  97. package/dist/mint-components/{p-f37a9a51.system.entry.js → p-9759c109.system.entry.js} +1 -1
  98. package/dist/mint-components/{p-229b6ffc.system.js → p-9d8d348d.system.js} +1 -1
  99. package/dist/mint-components/{p-1abbf18d.system.entry.js → p-a6811a96.system.entry.js} +1 -1
  100. package/dist/mint-components/{p-c31f0a37.entry.js → p-a7638e37.entry.js} +1 -1
  101. package/dist/mint-components/{p-d1dde2ac.system.js → p-a889467c.system.js} +1 -1
  102. package/dist/mint-components/{p-c8551945.entry.js → p-aa80d94f.entry.js} +1 -1
  103. package/dist/mint-components/{p-c19a96b5.js → p-c6a39fd3.js} +1 -1
  104. package/dist/mint-components/{p-12beaff4.js → p-cb763814.js} +1 -1
  105. package/dist/mint-components/{p-35b82b34.system.entry.js → p-e5954a23.system.entry.js} +1 -1
  106. package/dist/mint-components/{p-cfcbb76e.entry.js → p-ea0032f2.entry.js} +1 -1
  107. package/dist/mint-components/{p-49d8a962.system.entry.js → p-ee859839.system.entry.js} +1 -1
  108. package/dist/mint-components/{p-a2a2e25b.system.entry.js → p-f1d17cda.system.entry.js} +1 -1
  109. package/dist/mint-components/{p-c4e04f1e.system.js → p-f8af708e.system.js} +1 -1
  110. package/dist/mint-components/{p-c434ade0.entry.js → p-fbef1214.entry.js} +1 -1
  111. package/dist/types/global/styles.d.ts +4 -1
  112. package/dist/types/insertfont.d.ts +1 -0
  113. package/docs/docs.docx +0 -0
  114. package/package.json +1 -1
  115. package/dist/mint-components/p-8c81c2d2.system.entry.js +0 -1
@@ -1,9 +1,9 @@
1
1
  'use strict';
2
2
 
3
3
  const index = require('./index-a43a63b4.js');
4
- const global = require('./global-303a0ed3.js');
4
+ const global = require('./global-6ee8a4bb.js');
5
5
  const JSS = require('./JSS-8503a151.js');
6
- const utils = require('./utils-055817a8.js');
6
+ const utils = require('./utils-8b6dc3f8.js');
7
7
 
8
8
  const style = {
9
9
  Description: {
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  const index = require('./index-a43a63b4.js');
4
- const global = require('./global-303a0ed3.js');
4
+ const global = require('./global-6ee8a4bb.js');
5
5
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
6
6
  const index_module = require('./index.module-4f54e412.js');
7
7
  const cjs = require('./cjs-1066ec21.js');
@@ -25904,6 +25904,37 @@ function createStyleElement() {
25904
25904
  return styleElement;
25905
25905
  }
25906
25906
 
25907
+ /**
25908
+ * Build a font CSS URL using the Google Fonts CSS API
25909
+ *
25910
+ * Docs: https://developers.google.com/fonts/docs/css2
25911
+ *
25912
+ * @param fonts - the font family or families to load
25913
+ * @returns url to a .css file
25914
+ */
25915
+ function buildFontsCssUrl(...fonts) {
25916
+ const queryString = fonts.map(f => `family=${encodeURIComponent(f)}`).join("&");
25917
+ return `https://fonts.googleapis.com/css2?${queryString}`;
25918
+ }
25919
+
25920
+ function insertFont(font) {
25921
+ if (font === undefined) {
25922
+ throw new Error("insert-font: No font was provided");
25923
+ }
25924
+ const container = document.querySelector("head");
25925
+ const url = buildFontsCssUrl(font);
25926
+ const existingLink = container.querySelector(`link#brandFontStylesheet`);
25927
+ if ((existingLink === null || existingLink === void 0 ? void 0 : existingLink.getAttribute("href")) === url)
25928
+ return;
25929
+ if (existingLink)
25930
+ container.removeChild(existingLink);
25931
+ const link = document.createElement("link");
25932
+ link.setAttribute("rel", "stylesheet");
25933
+ link.setAttribute("href", url);
25934
+ link.setAttribute("id", "brandFontStylesheet");
25935
+ container.appendChild(link);
25936
+ }
25937
+
25907
25938
  /* :root {
25908
25939
  --primary-color: #ff8424;
25909
25940
  --primary-hover-color: #da6d17;
@@ -25976,9 +26007,10 @@ function createStyleElement() {
25976
26007
  --teal-6: #0b6270;
25977
26008
  --teal-7: #004551;
25978
26009
  } */
25979
- const getStyles = (config) => {
26010
+ const parseBrandingConfig = (config) => {
25980
26011
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63, _64, _65, _66, _67;
25981
- return `
26012
+ return ({
26013
+ styles: `
25982
26014
  /* vietnamese */
25983
26015
  @font-face {
25984
26016
  font-family: 'Nunito Sans';
@@ -26493,7 +26525,7 @@ html {
26493
26525
  --sqm-primary-button-color: ${((_r = (_q = config === null || config === void 0 ? void 0 : config.primaryButton) === null || _q === void 0 ? void 0 : _q.buttonColor) === null || _r === void 0 ? void 0 : _r.label) || "#FFFFFF"};
26494
26526
  --sqm-primary-button-color-border: ${((_t = (_s = config === null || config === void 0 ? void 0 : config.primaryButton) === null || _s === void 0 ? void 0 : _s.buttonColor) === null || _t === void 0 ? void 0 : _t.border) || "transparent"};
26495
26527
  --sqm-primary-button-radius: ${((_u = config === null || config === void 0 ? void 0 : config.primaryButton) === null || _u === void 0 ? void 0 : _u.borderRadius) ? ((_v = config === null || config === void 0 ? void 0 : config.primaryButton) === null || _v === void 0 ? void 0 : _v.borderRadius) + "px"
26496
- : "4px"};
26528
+ : "4px"};
26497
26529
  --sqm-secondary-button-background: ${((_w = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _w === void 0 ? void 0 : _w.buttonColor) || "transparent"};
26498
26530
  --sqm-secondary-button-background-hover: ${((_y = (_x = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _x === void 0 ? void 0 : _x.buttonHoverColor) === null || _y === void 0 ? void 0 : _y.background) || "#DEF0FC"};
26499
26531
  --sqm-secondary-button-color-hover: ${((_0 = (_z = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _z === void 0 ? void 0 : _z.buttonHoverColor) === null || _0 === void 0 ? void 0 : _0.label) || "#3878DB"};
@@ -26501,13 +26533,13 @@ html {
26501
26533
  --sqm-secondary-button-color: ${((_4 = (_3 = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _3 === void 0 ? void 0 : _3.buttonColor) === null || _4 === void 0 ? void 0 : _4.label) || "#27272A"};
26502
26534
  --sqm-secondary-button-color-border: ${((_6 = (_5 = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _5 === void 0 ? void 0 : _5.buttonColor) === null || _6 === void 0 ? void 0 : _6.border) || "#E4E4E7"};
26503
26535
  --sqm-secondary-button-radius: ${((_7 = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _7 === void 0 ? void 0 : _7.borderRadius) ? ((_8 = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _8 === void 0 ? void 0 : _8.borderRadius) + "px"
26504
- : "4px"};
26536
+ : "4px"};
26505
26537
 
26506
26538
  --sqm-border-radius-normal: ${((_9 = config === null || config === void 0 ? void 0 : config.border) === null || _9 === void 0 ? void 0 : _9.borderRadius) ? ((_10 = config === null || config === void 0 ? void 0 : config.border) === null || _10 === void 0 ? void 0 : _10.borderRadius) + "px" : "4px"};
26507
26539
  --sqm-border-color: ${((_11 = config === null || config === void 0 ? void 0 : config.border) === null || _11 === void 0 ? void 0 : _11.borderColor) || "#E4E4E7"};
26508
26540
 
26509
26541
  --sqm-border-thickness: ${((_12 = config === null || config === void 0 ? void 0 : config.border) === null || _12 === void 0 ? void 0 : _12.borderThickness) ? ((_13 = config === null || config === void 0 ? void 0 : config.border) === null || _13 === void 0 ? void 0 : _13.borderThickness) + "px"
26510
- : "1px"};
26542
+ : "1px"};
26511
26543
 
26512
26544
  --sqm-accent-color-icon: ${((_15 = (_14 = config === null || config === void 0 ? void 0 : config.color) === null || _14 === void 0 ? void 0 : _14.accentColorShades) === null || _15 === void 0 ? void 0 : _15.icon) || "#7ECCF7"};
26513
26545
  --sqm-accent-color-text: ${((_17 = (_16 = config === null || config === void 0 ? void 0 : config.color) === null || _16 === void 0 ? void 0 : _16.accentColorShades) === null || _17 === void 0 ? void 0 : _17.text) || "#3798DF"};
@@ -26537,7 +26569,7 @@ html {
26537
26569
  --sqm-input-background: ${((_55 = (_54 = config === null || config === void 0 ? void 0 : config.formFields) === null || _54 === void 0 ? void 0 : _54.formFieldColor) === null || _55 === void 0 ? void 0 : _55.background) || "#fff"};
26538
26570
  --sqm-input-border-color: ${((_57 = (_56 = config === null || config === void 0 ? void 0 : config.formFields) === null || _56 === void 0 ? void 0 : _56.formFieldColor) === null || _57 === void 0 ? void 0 : _57.border) || "#E4E4E7"};
26539
26571
  --sqm-input-border-radius: ${((_58 = config === null || config === void 0 ? void 0 : config.formFields) === null || _58 === void 0 ? void 0 : _58.borderRadius) ? ((_59 = config === null || config === void 0 ? void 0 : config.formFields) === null || _59 === void 0 ? void 0 : _59.borderRadius) + "px"
26540
- : "4px"};
26572
+ : "4px"};
26541
26573
  --sqm-input-color: ${((_61 = (_60 = config === null || config === void 0 ? void 0 : config.formFields) === null || _60 === void 0 ? void 0 : _60.formFieldColor) === null || _61 === void 0 ? void 0 : _61.inputText) || "#27272A"};
26542
26574
  --sqm-input-label-color: ${((_63 = (_62 = config === null || config === void 0 ? void 0 : config.color) === null || _62 === void 0 ? void 0 : _62.textColorShades) === null || _63 === void 0 ? void 0 : _63.mainText) || "#27272A"};
26543
26575
  --sqm-input-border-color-focus: ${((_64 = config === null || config === void 0 ? void 0 : config.formFields) === null || _64 === void 0 ? void 0 : _64.selectedStateColor) || "#E4E4E7"};
@@ -26827,7 +26859,9 @@ sl-icon::part(base):hover {
26827
26859
 
26828
26860
 
26829
26861
 
26830
- `;
26862
+ `,
26863
+ font: config.main.brandFont,
26864
+ });
26831
26865
  };
26832
26866
 
26833
26867
  index_module.U(domContextHooks_module.l);
@@ -26892,8 +26926,9 @@ try {
26892
26926
  catch (error) {
26893
26927
  debug("components already registered");
26894
26928
  }
26895
- const applyStyles$1 = (css) => {
26929
+ const applyStyles$1 = (css, font) => {
26896
26930
  try {
26931
+ insertFont(font);
26897
26932
  insertCSS(css);
26898
26933
  }
26899
26934
  catch (error) {
@@ -26904,11 +26939,12 @@ if (index_module.getEnvironmentSDK().type === "None") {
26904
26939
  window.addEventListener("message", ({ data }) => {
26905
26940
  if (!(data === null || data === void 0 ? void 0 : data.brandingConfig))
26906
26941
  return;
26907
- const styles = getStyles(data.brandingConfig);
26908
- applyStyles$1(styles);
26942
+ const { styles, font } = parseBrandingConfig(data.brandingConfig);
26943
+ applyStyles$1(styles, font);
26909
26944
  });
26910
26945
  }
26911
- const styles = getStyles(window.SquatchBrandingConfig);
26912
- applyStyles$1(styles);
26946
+ const { styles, font } = parseBrandingConfig(window.SquatchBrandingConfig);
26947
+ applyStyles$1(styles, font);
26913
26948
 
26949
+ exports.buildFontsCssUrl = buildFontsCssUrl;
26914
26950
  exports.intl = intl;
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- require('./global-303a0ed3.js');
6
+ require('./global-6ee8a4bb.js');
7
7
  require('./dom-context-hooks.module-7fa676ae.js');
8
8
  require('./index.module-4f54e412.js');
9
9
 
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  const index = require('./index-a43a63b4.js');
4
- require('./global-303a0ed3.js');
4
+ require('./global-6ee8a4bb.js');
5
5
  require('./dom-context-hooks.module-7fa676ae.js');
6
6
  require('./index.module-4f54e412.js');
7
7
 
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- const global = require('./global-303a0ed3.js');
6
+ const global = require('./global-6ee8a4bb.js');
7
7
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
8
8
  const index_module = require('./index.module-4f54e412.js');
9
9
  const jsonpointer = require('./jsonpointer-11327262.js');
@@ -16,8 +16,8 @@ const reRender = require('./re-render-d516138a.js');
16
16
  const useChildElements = require('./useChildElements-966c9041.js');
17
17
  const luxon = require('./luxon-949beaf2.js');
18
18
  const useReferralTable = require('./useReferralTable-90d4d6e9.js');
19
- const IndirectTaxDetailsView = require('./IndirectTaxDetailsView-82997130.js');
20
- const utils$1 = require('./utils-055817a8.js');
19
+ const IndirectTaxDetailsView = require('./IndirectTaxDetailsView-b783411a.js');
20
+ const utils$1 = require('./utils-8b6dc3f8.js');
21
21
  const data = require('./data-d4339c2e.js');
22
22
  const keys = require('./keys-cff24974.js');
23
23
  const usePayoutStatus = require('./usePayoutStatus-3b34dab1.js');
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- const global = require('./global-303a0ed3.js');
6
+ const global = require('./global-6ee8a4bb.js');
7
7
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
8
8
  const index_module = require('./index.module-4f54e412.js');
9
9
  const jsonpointer = require('./jsonpointer-11327262.js');
@@ -23,7 +23,7 @@ const sqmPortalLoginView = require('./sqm-portal-login-view-bb50304c.js');
23
23
  const usePortalLogin = require('./usePortalLogin-1c022d8d.js');
24
24
  const AsYouType = require('./AsYouType-6788393a.js');
25
25
  const utilities = require('./utilities-9a0c5e91.js');
26
- const ShadowViewAddon = require('./ShadowViewAddon-bccd02b4.js');
26
+ const ShadowViewAddon = require('./ShadowViewAddon-cb3fc679.js');
27
27
  require('./sqm-portal-container-view-07e4343f.js');
28
28
  const usePayoutStatus = require('./usePayoutStatus-3b34dab1.js');
29
29
 
@@ -408,19 +408,6 @@ const BigStat = class {
408
408
  }
409
409
  };
410
410
 
411
- /**
412
- * Build a font CSS URL using the Google Fonts CSS API
413
- *
414
- * Docs: https://developers.google.com/fonts/docs/css2
415
- *
416
- * @param fonts - the font family or families to load
417
- * @returns url to a .css file
418
- */
419
- function buildFontsCssUrl(...fonts) {
420
- const queryString = fonts.map(f => `family=${encodeURIComponent(f)}`).join("&");
421
- return `https://fonts.googleapis.com/css2?${queryString}`;
422
- }
423
-
424
411
  function t(t,n,r){return Math.min(Math.max(t,r),n)}class n extends Error{constructor(t){super(`Failed to parse color: "${t}"`);}}function r(r){if("string"!=typeof r)throw new n(r);if("transparent"===r.trim().toLowerCase())return [0,0,0,0];let e=r.trim();e=u.test(r)?function(t){const r=t.toLowerCase().trim(),e=o[function(t){let n=5381,r=t.length;for(;r;)n=33*n^t.charCodeAt(--r);return (n>>>0)%2341}(r)];if(!e)throw new n(t);return `#${e}`}(r):r;const f=s.exec(e);if(f){const t=Array.from(f).slice(1);return [...t.slice(0,3).map(t=>parseInt(_(t,2),16)),parseInt(_(t[3]||"f",2),16)/255]}const p=i.exec(e);if(p){const t=Array.from(p).slice(1);return [...t.slice(0,3).map(t=>parseInt(t,16)),parseInt(t[3]||"ff",16)/255]}const z=a.exec(e);if(z){const t=Array.from(z).slice(1);return [...t.slice(0,3).map(t=>parseInt(t,10)),parseFloat(t[3]||"1")]}const h=c.exec(e);if(h){const[e,o,_,s]=Array.from(h).slice(1).map(parseFloat);if(t(0,100,o)!==o)throw new n(r);if(t(0,100,_)!==_)throw new n(r);return [...l(e,o,_),s||1]}throw new n(r)}const e=t=>parseInt(t.replace(/_/g,""),36),o="1q29ehhb 1n09sgk7 1kl1ekf_ _yl4zsno 16z9eiv3 1p29lhp8 _bd9zg04 17u0____ _iw9zhe5 _to73___ _r45e31e _7l6g016 _jh8ouiv _zn3qba8 1jy4zshs 11u87k0u 1ro9yvyo 1aj3xael 1gz9zjz0 _3w8l4xo 1bf1ekf_ _ke3v___ _4rrkb__ 13j776yz _646mbhl _nrjr4__ _le6mbhl 1n37ehkb _m75f91n _qj3bzfz 1939yygw 11i5z6x8 _1k5f8xs 1509441m 15t5lwgf _ae2th1n _tg1ugcv 1lp1ugcv 16e14up_ _h55rw7n _ny9yavn _7a11xb_ 1ih442g9 _pv442g9 1mv16xof 14e6y7tu 1oo9zkds 17d1cisi _4v9y70f _y98m8kc 1019pq0v 12o9zda8 _348j4f4 1et50i2o _8epa8__ _ts6senj 1o350i2o 1mi9eiuo 1259yrp0 1ln80gnw _632xcoy 1cn9zldc _f29edu4 1n490c8q _9f9ziet 1b94vk74 _m49zkct 1kz6s73a 1eu9dtog _q58s1rz 1dy9sjiq __u89jo3 _aj5nkwg _ld89jo3 13h9z6wx _qa9z2ii _l119xgq _bs5arju 1hj4nwk9 1qt4nwk9 1ge6wau6 14j9zlcw 11p1edc_ _ms1zcxe _439shk6 _jt9y70f _754zsow 1la40eju _oq5p___ _x279qkz 1fa5r3rv _yd2d9ip _424tcku _8y1di2_ _zi2uabw _yy7rn9h 12yz980_ __39ljp6 1b59zg0x _n39zfzp 1fy9zest _b33k___ _hp9wq92 1il50hz4 _io472ub _lj9z3eo 19z9ykg0 _8t8iu3a 12b9bl4a 1ak5yw0o _896v4ku _tb8k8lv _s59zi6t _c09ze0p 1lg80oqn 1id9z8wb _238nba5 1kq6wgdi _154zssg _tn3zk49 _da9y6tc 1sg7cv4f _r12jvtt 1gq5fmkz 1cs9rvci _lp9jn1c _xw1tdnb 13f9zje6 16f6973h _vo7ir40 _bt5arjf _rc45e4t _hr4e100 10v4e100 _hc9zke2 _w91egv_ _sj2r1kk 13c87yx8 _vqpds__ _ni8ggk8 _tj9yqfb 1ia2j4r4 _7x9b10u 1fc9ld4j 1eq9zldr _5j9lhpx _ez9zl6o _md61fzm".split(" ").reduce((t,n)=>{const r=e(n.substring(0,3)),o=e(n.substring(3)).toString(16);let _="";for(let t=0;t<6-o.length;t++)_+="0";return t[r]=`${_}${o}`,t},{}),_=(t,n)=>Array.from(Array(n)).map(()=>t).join(""),s=new RegExp(`^#${_("([a-f0-9])",3)}([a-f0-9])?$`,"i"),i=new RegExp(`^#${_("([a-f0-9]{2})",3)}([a-f0-9]{2})?$`,"i"),a=new RegExp(`^rgba?\\(\\s*(\\d+)\\s*${_(",\\s*(\\d+)\\s*",2)}(?:,\\s*([\\d.]+))?\\s*\\)$`,"i"),c=/^hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%(?:\s*,\s*([\d.]+))?\s*\)$/i,u=/^[a-z]+$/i,f=t=>Math.round(255*t),l=(t,n,r)=>{let e=r/100;if(0===n)return [e,e,e].map(f);const o=(t%360+360)%360/60,_=(1-Math.abs(2*e-1))*(n/100),s=_*(1-Math.abs(o%2-1));let i=0,a=0,c=0;o>=0&&o<1?(i=_,a=s):o>=1&&o<2?(i=s,a=_):o>=2&&o<3?(a=_,c=s):o>=3&&o<4?(a=s,c=_):o>=4&&o<5?(i=s,c=_):o>=5&&o<6&&(i=_,c=s);const u=e-_/2;return [i+u,a+u,c+u].map(f)};function p(t){const[n,e,o,_]=r(t).map((t,n)=>3===n?t:t/255),s=Math.max(n,e,o),i=Math.min(n,e,o),a=(s+i)/2;if(s===i)return [0,0,a,_];const c=s-i;return [60*(n===s?(e-o)/c+(e<o?6:0):e===s?(o-n)/c+2:(n-e)/c+4),a>.5?c/(2-s-i):c/(s+i),a,_]}function z(n,r,e,o){return `hsla(${(n%360).toFixed()}, ${t(0,100,100*r).toFixed()}%, ${t(0,100,100*e).toFixed()}%, ${parseFloat(t(0,1,o).toFixed(3))})`}
425
412
 
426
413
  const colorScale = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
@@ -479,7 +466,7 @@ const BrandComponent = class {
479
466
  }
480
467
  disconnectedCallback() { }
481
468
  render() {
482
- var _a, _b;
469
+ var _a, _b, _c, _d;
483
470
  function getCss(brandColor) {
484
471
  if (brandColor) {
485
472
  try {
@@ -489,15 +476,17 @@ const BrandComponent = class {
489
476
  }
490
477
  return undefined;
491
478
  }
492
- const css = (_a = getCss(this.brandColor)) !== null && _a !== void 0 ? _a : "";
493
- const sanitizedFont = ((_b = this.brandFont) !== null && _b !== void 0 ? _b : "Nunito Sans").trim() || undefined;
479
+ const brandingConfigFont = (_b = (_a = window.SquatchBrandingConfig) === null || _a === void 0 ? void 0 : _a.main) === null || _b === void 0 ? void 0 : _b.brandFont;
480
+ const css = (_c = getCss(this.brandColor)) !== null && _c !== void 0 ? _c : "";
481
+ const sanitizedFont = ((_d = this.brandFont) !== null && _d !== void 0 ? _d : "Nunito Sans").trim() || undefined;
494
482
  domContextHooks_module.useEffect(() => {
495
- if (!sanitizedFont) {
483
+ if (!sanitizedFont || brandingConfigFont) {
496
484
  // Nothing required in default case.
485
+ // Don't add font if it's set in the global config
497
486
  return;
498
487
  }
499
488
  const sheet = document.createElement("link");
500
- sheet.setAttribute("href", buildFontsCssUrl(sanitizedFont));
489
+ sheet.setAttribute("href", global.buildFontsCssUrl(sanitizedFont));
501
490
  sheet.setAttribute("rel", "stylesheet");
502
491
  document.head.appendChild(sheet);
503
492
  return () => document.head.removeChild(sheet);
@@ -513,6 +502,10 @@ const BrandComponent = class {
513
502
  - resets css variable inheritence for fonts
514
503
 
515
504
  */
505
+
506
+ ${brandingConfigFont
507
+ ? ``
508
+ : `
516
509
  ::slotted(*) {
517
510
  --sl-font-sans: "${font}", arial;
518
511
  --sl-input-font-family: "${font}", arial;
@@ -520,6 +513,7 @@ const BrandComponent = class {
520
513
  font-family: "${font}", arial;
521
514
 
522
515
  ${css}
516
+ `}
523
517
 
524
518
  --sl-focus-ring-color-primary: var(--sl-color-primary-100);
525
519
  --sl-input-border-color-focus: var(--sl-color-primary-500);
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- const global = require('./global-303a0ed3.js');
6
+ const global = require('./global-6ee8a4bb.js');
7
7
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
8
8
  const index_module = require('./index.module-4f54e412.js');
9
9
  const cjs = require('./cjs-1066ec21.js');
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- const global = require('./global-303a0ed3.js');
6
+ const global = require('./global-6ee8a4bb.js');
7
7
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
8
8
  const index_module = require('./index.module-4f54e412.js');
9
9
  const cjs = require('./cjs-1066ec21.js');
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- const global = require('./global-303a0ed3.js');
6
+ const global = require('./global-6ee8a4bb.js');
7
7
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
8
8
  require('./index.module-4f54e412.js');
9
9
  const utils = require('./utils-6847bc06.js');
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- const global = require('./global-303a0ed3.js');
6
+ const global = require('./global-6ee8a4bb.js');
7
7
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
8
8
  const index_module = require('./index.module-4f54e412.js');
9
9
  const cjs = require('./cjs-1066ec21.js');
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- const global = require('./global-303a0ed3.js');
6
+ const global = require('./global-6ee8a4bb.js');
7
7
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
8
8
  const index_module = require('./index.module-4f54e412.js');
9
9
  const cjs = require('./cjs-1066ec21.js');
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  const index = require('./index-a43a63b4.js');
4
- const global = require('./global-303a0ed3.js');
4
+ const global = require('./global-6ee8a4bb.js');
5
5
  const JSS = require('./JSS-8503a151.js');
6
6
  const mixins = require('./mixins-4761d472.js');
7
7
  const sqmTextSpanView = require('./sqm-text-span-view-7a61ae4c.js');
@@ -3,14 +3,14 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- require('./global-303a0ed3.js');
6
+ require('./global-6ee8a4bb.js');
7
7
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
8
8
  const index_module = require('./index.module-4f54e412.js');
9
9
  const cjs = require('./cjs-1066ec21.js');
10
10
  require('./JSS-8503a151.js');
11
11
  require('./mixins-4761d472.js');
12
12
  require('./sqm-text-span-view-7a61ae4c.js');
13
- const sqmPortalEmailVerificationView = require('./sqm-portal-email-verification-view-4d4dd884.js');
13
+ const sqmPortalEmailVerificationView = require('./sqm-portal-email-verification-view-d3dccee1.js');
14
14
 
15
15
  function usePortalEmailVerification(props) {
16
16
  var _a, _b, _c, _d, _e, _f, _g, _h, _j;
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  const index = require('./index-a43a63b4.js');
4
- const global = require('./global-303a0ed3.js');
4
+ const global = require('./global-6ee8a4bb.js');
5
5
  const JSS = require('./JSS-8503a151.js');
6
6
  const sqmTextSpanView = require('./sqm-text-span-view-7a61ae4c.js');
7
7
 
@@ -3,14 +3,14 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- require('./global-303a0ed3.js');
6
+ require('./global-6ee8a4bb.js');
7
7
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
8
8
  const index_module = require('./index.module-4f54e412.js');
9
9
  const cjs = require('./cjs-1066ec21.js');
10
10
  const utils = require('./utils-6847bc06.js');
11
11
  require('./JSS-8503a151.js');
12
12
  require('./sqm-text-span-view-7a61ae4c.js');
13
- const sqmPortalProfileView = require('./sqm-portal-profile-view-ef90b55f.js');
13
+ const sqmPortalProfileView = require('./sqm-portal-profile-view-153a8ca9.js');
14
14
  const utilities = require('./utilities-9a0c5e91.js');
15
15
 
16
16
  const GET_USER = index_module.dist.gql `
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- const global = require('./global-303a0ed3.js');
6
+ const global = require('./global-6ee8a4bb.js');
7
7
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
8
8
  const index_module = require('./index.module-4f54e412.js');
9
9
  const cjs = require('./cjs-1066ec21.js');
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- const global = require('./global-303a0ed3.js');
6
+ const global = require('./global-6ee8a4bb.js');
7
7
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
8
8
  const index_module = require('./index.module-4f54e412.js');
9
9
  const cjs = require('./cjs-1066ec21.js');
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- require('./global-303a0ed3.js');
6
+ require('./global-6ee8a4bb.js');
7
7
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
8
8
  const index_module = require('./index.module-4f54e412.js');
9
9
  require('./cjs-1066ec21.js');
@@ -23,21 +23,21 @@ const sqmLeaderboardRankView = require('./sqm-leaderboard-rank-view-6a1e63de.js'
23
23
  const sqmLogoutCurrentUserView = require('./sqm-logout-current-user-view-b61c8bdf.js');
24
24
  const sqmNavigationSidebarView = require('./sqm-navigation-sidebar-view-50ee8796.js');
25
25
  const sqmNavigationSidebarItemView = require('./sqm-navigation-sidebar-item-view-ec7a5c53.js');
26
- const sqmPortalEmailVerificationView = require('./sqm-portal-email-verification-view-4d4dd884.js');
26
+ const sqmPortalEmailVerificationView = require('./sqm-portal-email-verification-view-d3dccee1.js');
27
27
  const sqmPortalForgotPasswordView = require('./sqm-portal-forgot-password-view-0a8d3243.js');
28
28
  const sqmPortalLoginView = require('./sqm-portal-login-view-bb50304c.js');
29
29
  const sqmBaseRegistrationFormView = require('./sqm-base-registration-form-view-8847804c.js');
30
30
  const sqmPortalRegistrationFormView = require('./sqm-portal-registration-form-view-5a96c2f5.js');
31
- const sqmPortalProfileView = require('./sqm-portal-profile-view-ef90b55f.js');
31
+ const sqmPortalProfileView = require('./sqm-portal-profile-view-153a8ca9.js');
32
32
  require('./utilities-9a0c5e91.js');
33
33
  const sqmPortalResetPasswordView = require('./sqm-portal-reset-password-view-25eb2099.js');
34
34
  const sqmPortalVerifyEmailView = require('./sqm-portal-verify-email-view-1c4e781f.js');
35
35
  const ErrorView = require('./ErrorView-5504c2b6.js');
36
36
  const sqmQrCodeView = require('./sqm-qr-code-view-2cca145e.js');
37
- const ShadowViewAddon = require('./ShadowViewAddon-bccd02b4.js');
37
+ const ShadowViewAddon = require('./ShadowViewAddon-cb3fc679.js');
38
38
  const sqmPortalContainerView = require('./sqm-portal-container-view-07e4343f.js');
39
- const IndirectTaxDetailsView = require('./IndirectTaxDetailsView-82997130.js');
40
- const utils = require('./utils-055817a8.js');
39
+ const IndirectTaxDetailsView = require('./IndirectTaxDetailsView-b783411a.js');
40
+ const utils = require('./utils-8b6dc3f8.js');
41
41
 
42
42
  /**
43
43
  * lodash (Custom Build) <https://lodash.com/>
@@ -3,14 +3,14 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-a43a63b4.js');
6
- require('./global-303a0ed3.js');
6
+ require('./global-6ee8a4bb.js');
7
7
  const domContextHooks_module = require('./dom-context-hooks.module-7fa676ae.js');
8
8
  const index_module = require('./index.module-4f54e412.js');
9
9
  const cjs = require('./cjs-1066ec21.js');
10
10
  const utils$1 = require('./utils-6847bc06.js');
11
11
  require('./JSS-8503a151.js');
12
12
  const ErrorView = require('./ErrorView-5504c2b6.js');
13
- const utils = require('./utils-055817a8.js');
13
+ const utils = require('./utils-8b6dc3f8.js');
14
14
  const extractProps = require('./extractProps-e9c55ba8.js');
15
15
  const data = require('./data-d4339c2e.js');
16
16
 
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  const index = require('./index-a43a63b4.js');
4
- const global = require('./global-303a0ed3.js');
4
+ const global = require('./global-6ee8a4bb.js');
5
5
  const JSS = require('./JSS-8503a151.js');
6
6
 
7
7
  const style = {
@@ -15,7 +15,7 @@ export class BrandComponent {
15
15
  }
16
16
  disconnectedCallback() { }
17
17
  render() {
18
- var _a, _b;
18
+ var _a, _b, _c, _d;
19
19
  function getCss(brandColor) {
20
20
  if (brandColor) {
21
21
  try {
@@ -25,11 +25,13 @@ export class BrandComponent {
25
25
  }
26
26
  return undefined;
27
27
  }
28
- const css = (_a = getCss(this.brandColor)) !== null && _a !== void 0 ? _a : "";
29
- const sanitizedFont = ((_b = this.brandFont) !== null && _b !== void 0 ? _b : "Nunito Sans").trim() || undefined;
28
+ const brandingConfigFont = (_b = (_a = window.SquatchBrandingConfig) === null || _a === void 0 ? void 0 : _a.main) === null || _b === void 0 ? void 0 : _b.brandFont;
29
+ const css = (_c = getCss(this.brandColor)) !== null && _c !== void 0 ? _c : "";
30
+ const sanitizedFont = ((_d = this.brandFont) !== null && _d !== void 0 ? _d : "Nunito Sans").trim() || undefined;
30
31
  useEffect(() => {
31
- if (!sanitizedFont) {
32
+ if (!sanitizedFont || brandingConfigFont) {
32
33
  // Nothing required in default case.
34
+ // Don't add font if it's set in the global config
33
35
  return;
34
36
  }
35
37
  const sheet = document.createElement("link");
@@ -50,6 +52,10 @@ export class BrandComponent {
50
52
  - resets css variable inheritence for fonts
51
53
 
52
54
  */
55
+
56
+ ${brandingConfigFont
57
+ ? ``
58
+ : `
53
59
  ::slotted(*) {
54
60
  --sl-font-sans: "${font}", arial;
55
61
  --sl-input-font-family: "${font}", arial;
@@ -57,6 +63,7 @@ export class BrandComponent {
57
63
  font-family: "${font}", arial;
58
64
 
59
65
  ${css}
66
+ `}
60
67
 
61
68
  --sl-focus-ring-color-primary: var(--sl-color-primary-100);
62
69
  --sl-input-border-color-focus: var(--sl-color-primary-500);
@@ -71,9 +71,11 @@ catch (error) {
71
71
  debug("components already registered");
72
72
  }
73
73
  import { insertCSS } from "../insertcss";
74
- import { getStyles } from "./styles";
75
- const applyStyles = (css) => {
74
+ import { insertFont } from "../insertfont";
75
+ import { parseBrandingConfig } from "./styles";
76
+ const applyStyles = (css, font) => {
76
77
  try {
78
+ insertFont(font);
77
79
  insertCSS(css);
78
80
  }
79
81
  catch (error) {
@@ -84,9 +86,9 @@ if (getEnvironmentSDK().type === "None") {
84
86
  window.addEventListener("message", ({ data }) => {
85
87
  if (!(data === null || data === void 0 ? void 0 : data.brandingConfig))
86
88
  return;
87
- const styles = getStyles(data.brandingConfig);
88
- applyStyles(styles);
89
+ const { styles, font } = parseBrandingConfig(data.brandingConfig);
90
+ applyStyles(styles, font);
89
91
  });
90
92
  }
91
- const styles = getStyles(window.SquatchBrandingConfig);
92
- applyStyles(styles);
93
+ const { styles, font } = parseBrandingConfig(window.SquatchBrandingConfig);
94
+ applyStyles(styles, font);
@@ -70,9 +70,10 @@
70
70
  --teal-6: #0b6270;
71
71
  --teal-7: #004551;
72
72
  } */
73
- export const getStyles = (config) => {
73
+ export const parseBrandingConfig = (config) => {
74
74
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63, _64, _65, _66, _67;
75
- return `
75
+ return ({
76
+ styles: `
76
77
  /* vietnamese */
77
78
  @font-face {
78
79
  font-family: 'Nunito Sans';
@@ -587,7 +588,7 @@ html {
587
588
  --sqm-primary-button-color: ${((_r = (_q = config === null || config === void 0 ? void 0 : config.primaryButton) === null || _q === void 0 ? void 0 : _q.buttonColor) === null || _r === void 0 ? void 0 : _r.label) || "#FFFFFF"};
588
589
  --sqm-primary-button-color-border: ${((_t = (_s = config === null || config === void 0 ? void 0 : config.primaryButton) === null || _s === void 0 ? void 0 : _s.buttonColor) === null || _t === void 0 ? void 0 : _t.border) || "transparent"};
589
590
  --sqm-primary-button-radius: ${((_u = config === null || config === void 0 ? void 0 : config.primaryButton) === null || _u === void 0 ? void 0 : _u.borderRadius) ? ((_v = config === null || config === void 0 ? void 0 : config.primaryButton) === null || _v === void 0 ? void 0 : _v.borderRadius) + "px"
590
- : "4px"};
591
+ : "4px"};
591
592
  --sqm-secondary-button-background: ${((_w = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _w === void 0 ? void 0 : _w.buttonColor) || "transparent"};
592
593
  --sqm-secondary-button-background-hover: ${((_y = (_x = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _x === void 0 ? void 0 : _x.buttonHoverColor) === null || _y === void 0 ? void 0 : _y.background) || "#DEF0FC"};
593
594
  --sqm-secondary-button-color-hover: ${((_0 = (_z = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _z === void 0 ? void 0 : _z.buttonHoverColor) === null || _0 === void 0 ? void 0 : _0.label) || "#3878DB"};
@@ -595,13 +596,13 @@ html {
595
596
  --sqm-secondary-button-color: ${((_4 = (_3 = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _3 === void 0 ? void 0 : _3.buttonColor) === null || _4 === void 0 ? void 0 : _4.label) || "#27272A"};
596
597
  --sqm-secondary-button-color-border: ${((_6 = (_5 = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _5 === void 0 ? void 0 : _5.buttonColor) === null || _6 === void 0 ? void 0 : _6.border) || "#E4E4E7"};
597
598
  --sqm-secondary-button-radius: ${((_7 = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _7 === void 0 ? void 0 : _7.borderRadius) ? ((_8 = config === null || config === void 0 ? void 0 : config.secondaryButton) === null || _8 === void 0 ? void 0 : _8.borderRadius) + "px"
598
- : "4px"};
599
+ : "4px"};
599
600
 
600
601
  --sqm-border-radius-normal: ${((_9 = config === null || config === void 0 ? void 0 : config.border) === null || _9 === void 0 ? void 0 : _9.borderRadius) ? ((_10 = config === null || config === void 0 ? void 0 : config.border) === null || _10 === void 0 ? void 0 : _10.borderRadius) + "px" : "4px"};
601
602
  --sqm-border-color: ${((_11 = config === null || config === void 0 ? void 0 : config.border) === null || _11 === void 0 ? void 0 : _11.borderColor) || "#E4E4E7"};
602
603
 
603
604
  --sqm-border-thickness: ${((_12 = config === null || config === void 0 ? void 0 : config.border) === null || _12 === void 0 ? void 0 : _12.borderThickness) ? ((_13 = config === null || config === void 0 ? void 0 : config.border) === null || _13 === void 0 ? void 0 : _13.borderThickness) + "px"
604
- : "1px"};
605
+ : "1px"};
605
606
 
606
607
  --sqm-accent-color-icon: ${((_15 = (_14 = config === null || config === void 0 ? void 0 : config.color) === null || _14 === void 0 ? void 0 : _14.accentColorShades) === null || _15 === void 0 ? void 0 : _15.icon) || "#7ECCF7"};
607
608
  --sqm-accent-color-text: ${((_17 = (_16 = config === null || config === void 0 ? void 0 : config.color) === null || _16 === void 0 ? void 0 : _16.accentColorShades) === null || _17 === void 0 ? void 0 : _17.text) || "#3798DF"};
@@ -631,7 +632,7 @@ html {
631
632
  --sqm-input-background: ${((_55 = (_54 = config === null || config === void 0 ? void 0 : config.formFields) === null || _54 === void 0 ? void 0 : _54.formFieldColor) === null || _55 === void 0 ? void 0 : _55.background) || "#fff"};
632
633
  --sqm-input-border-color: ${((_57 = (_56 = config === null || config === void 0 ? void 0 : config.formFields) === null || _56 === void 0 ? void 0 : _56.formFieldColor) === null || _57 === void 0 ? void 0 : _57.border) || "#E4E4E7"};
633
634
  --sqm-input-border-radius: ${((_58 = config === null || config === void 0 ? void 0 : config.formFields) === null || _58 === void 0 ? void 0 : _58.borderRadius) ? ((_59 = config === null || config === void 0 ? void 0 : config.formFields) === null || _59 === void 0 ? void 0 : _59.borderRadius) + "px"
634
- : "4px"};
635
+ : "4px"};
635
636
  --sqm-input-color: ${((_61 = (_60 = config === null || config === void 0 ? void 0 : config.formFields) === null || _60 === void 0 ? void 0 : _60.formFieldColor) === null || _61 === void 0 ? void 0 : _61.inputText) || "#27272A"};
636
637
  --sqm-input-label-color: ${((_63 = (_62 = config === null || config === void 0 ? void 0 : config.color) === null || _62 === void 0 ? void 0 : _62.textColorShades) === null || _63 === void 0 ? void 0 : _63.mainText) || "#27272A"};
637
638
  --sqm-input-border-color-focus: ${((_64 = config === null || config === void 0 ? void 0 : config.formFields) === null || _64 === void 0 ? void 0 : _64.selectedStateColor) || "#E4E4E7"};
@@ -921,5 +922,7 @@ sl-icon::part(base):hover {
921
922
 
922
923
 
923
924
 
924
- `;
925
+ `,
926
+ font: config.main.brandFont,
927
+ });
925
928
  };
@@ -79,7 +79,8 @@ declare global {
79
79
  }
80
80
  }
81
81
 
82
- export const getStyles = (config: BrandingConfiguration | null) => `
82
+ export const parseBrandingConfig = (config: BrandingConfiguration | null) => ({
83
+ styles: `
83
84
  /* vietnamese */
84
85
  @font-face {
85
86
  font-family: 'Nunito Sans';
@@ -1014,4 +1015,6 @@ sl-icon::part(base):hover {
1014
1015
 
1015
1016
 
1016
1017
 
1017
- `;
1018
+ `,
1019
+ font: config.main.brandFont,
1020
+ });