@everymatrix/player-elevate-level 1.44.0 → 1.45.2

package/dist/components/player-elevate-card-data2.js

@@ -1,635 +0,0 @@
-import { proxyCustomElement, HTMLElement, createEvent } from '@stencil/core/internal/client';
-
-const DEFAULT_LANGUAGE = 'en';
-const SUPPORTED_LANGUAGES = ['ro', 'en'];
-const TRANSLATIONS = {
-  en: {
-    redeem: 'Redeem',
-    expireOn: 'Expire on ',
-    pointsToBeExpired: '${expirationPoints} points to expire in ${expireDay} days',
-    pointsToBeExpiredDay: '${expirationPoints} points to expire in ${expireDay} day',
-    pointsToBeExpiredHours: '${expirationPoints} points to expire in ${expireDay} hours',
-    pointsToBeExpiredHour: '${expirationPoints} points to expire in ${expireDay} hour',
-    tipsForNextLevel: 'Need ${pointsToReach} to reach ${levelName}',
-    spendablePoints: 'Spendable Points:',
-    details: 'Details',
-    earningRules: 'Earning Rules',
-    xp: 'XP',
-    sp: 'Coins',
-    termAndConditions: 'Term & Conditions',
-  },
-  'zh-hk': {
-    redeem: '兑奖',
-    expireOn: 'Expire on ',
-    pointsToBeExpired: '${expirationPoints} points to expire in ${expireDay} days',
-    pointsToBeExpiredDay: '${expirationPoints} points to expire in ${expireDay} day',
-    pointsToBeExpiredHours: '${expirationPoints} points to expire in ${expireDay} hours',
-    pointsToBeExpiredHour: '${expirationPoints} points to expire in ${expireDay} hour',
-    tipsForNextLevel: 'Need ${pointsToReach} to reach ${levelName}',
-    spendablePoints: 'Spendable Points:',
-    details: '明细',
-    earningRules: 'Earning Rules',
-    xp: 'XP',
-    sp: 'Coins',
-    termAndConditions: 'Term & Conditions',
-  },
-  de: {
-    redeem: 'Redeem',
-    expireOn: 'Expire on ',
-    pointsToBeExpired: '${expirationPoints} points to expire in ${expireDay} days',
-    pointsToBeExpiredDay: '${expirationPoints} points to expire in ${expireDay} day',
-    pointsToBeExpiredHours: '${expirationPoints} points to expire in ${expireDay} hours',
-    pointsToBeExpiredHour: '${expirationPoints} points to expire in ${expireDay} hour',
-    tipsForNextLevel: 'Need ${pointsToReach} to reach ${levelName}',
-    spendablePoints: 'Spendable Points:',
-    details: 'Details',
-    earningRules: 'Earning Rules',
-    xp: 'XP',
-    sp: 'Coins',
-    termAndConditions: 'Term & Conditions',
-  },
-  it: {
-    redeem: 'Redeem',
-    expireOn: 'Expire on ',
-    pointsToBeExpired: '${expirationPoints} points to expire in ${expireDay} days',
-    pointsToBeExpiredDay: '${expirationPoints} points to expire in ${expireDay} day',
-    pointsToBeExpiredHours: '${expirationPoints} points to expire in ${expireDay} hours',
-    pointsToBeExpiredHour: '${expirationPoints} points to expire in ${expireDay} hour',
-    tipsForNextLevel: 'Need ${pointsToReach} to reach ${levelName}',
-    spendablePoints: 'Spendable Points:',
-    details: 'Details',
-    earningRules: 'Earning Rules',
-    xp: 'XP',
-    sp: 'Coins',
-    termAndConditions: 'Term & Conditions',
-  },
-  fr: {
-    redeem: 'Redeem',
-    expireOn: 'Expire on ',
-    pointsToBeExpired: '${expirationPoints} points to expire in ${expireDay} days',
-    pointsToBeExpiredDay: '${expirationPoints} points to expire in ${expireDay} day',
-    pointsToBeExpiredHours: '${expirationPoints} points to expire in ${expireDay} hours',
-    pointsToBeExpiredHour: '${expirationPoints} points to expire in ${expireDay} hour',
-    tipsForNextLevel: 'Need ${pointsToReach} to reach ${levelName}',
-    spendablePoints: 'Spendable Points:',
-    details: 'Details',
-    earningRules: 'Earning Rules',
-    xp: 'XP',
-    sp: 'Coins',
-    termAndConditions: 'Term & Conditions',
-  },
-  es: {
-    redeem: 'Redeem'
-  },
-  tr: {
-    redeem: 'Redeem'
-  },
-  ru: {
-    redeem: 'Redeem'
-  },
-  ro: {
-    redeem: 'Redeem'
-  },
-  hr: {
-    redeem: 'Otkupiti',
-    expireOn: 'Istječe',
-    pointsToBeExpired: '${expirationPoints} bodova ističe za ${expireDay} dana',
-    tipsForNextLevel: 'Trebate ${pointsToReach} da dosegnete razinu ${levelName}',
-    spendablePoints: 'Bodovi za potrošit:',
-    details: 'Detalji',
-    xp: 'XP',
-  },
-  hu: {
-    redeem: 'Redeem'
-  },
-  pl: {
-    redeem: 'Redeem'
-  },
-  pt: {
-    redeem: 'Redeem'
-  },
-  sl: {
-    redeem: 'Redeem'
-  },
-  sr: {
-    redeem: 'Redeem'
-  }
-};
-const translate = (key, customLang) => {
-  const lang = customLang;
-  return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
-};
-const translateWithParams = (key, params) => {
-  const lang = params['lang'];
-  let templateString = TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
-  if (!params) {
-    return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
-  }
-  Object.keys(params).forEach((paramName) => {
-    templateString = templateString.replace(new RegExp('\\$\{' + paramName + '\}', 'gm'), params[paramName]);
-  });
-  return templateString;
-};
-
-function _typeof(o) {
-  "@babel/helpers - typeof";
-
-  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
-    return typeof o;
-  } : function (o) {
-    return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
-  }, _typeof(o);
-}
-
-function requiredArgs(required, args) {
-  if (args.length < required) {
-    throw new TypeError(required + ' argument' + (required > 1 ? 's' : '') + ' required, but only ' + args.length + ' present');
-  }
-}
-
-/**
- * @name toDate
- * @category Common Helpers
- * @summary Convert the given argument to an instance of Date.
- *
- * @description
- * Convert the given argument to an instance of Date.
- *
- * If the argument is an instance of Date, the function returns its clone.
- *
- * If the argument is a number, it is treated as a timestamp.
- *
- * If the argument is none of the above, the function returns Invalid Date.
- *
- * **Note**: *all* Date arguments passed to any *date-fns* function is processed by `toDate`.
- *
- * @param {Date|Number} argument - the value to convert
- * @returns {Date} the parsed date in the local time zone
- * @throws {TypeError} 1 argument required
- *
- * @example
- * // Clone the date:
- * const result = toDate(new Date(2014, 1, 11, 11, 30, 30))
- * //=> Tue Feb 11 2014 11:30:30
- *
- * @example
- * // Convert the timestamp to date:
- * const result = toDate(1392098430000)
- * //=> Tue Feb 11 2014 11:30:30
- */
-function toDate(argument) {
-  requiredArgs(1, arguments);
-  var argStr = Object.prototype.toString.call(argument);
-
-  // Clone the date
-  if (argument instanceof Date || _typeof(argument) === 'object' && argStr === '[object Date]') {
-    // Prevent the date to lose the milliseconds when passed to new Date() in IE10
-    return new Date(argument.getTime());
-  } else if (typeof argument === 'number' || argStr === '[object Number]') {
-    return new Date(argument);
-  } else {
-    if ((typeof argument === 'string' || argStr === '[object String]') && typeof console !== 'undefined') {
-      // eslint-disable-next-line no-console
-      console.warn("Starting with v2.0.0-beta.1 date-fns doesn't accept strings as date arguments. Please use `parseISO` to parse strings. See: https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#string-arguments");
-      // eslint-disable-next-line no-console
-      console.warn(new Error().stack);
-    }
-    return new Date(NaN);
-  }
-}
-
-/**
- * Google Chrome as of 67.0.3396.87 introduced timezones with offset that includes seconds.
- * They usually appear for dates that denote time before the timezones were introduced
- * (e.g. for 'Europe/Prague' timezone the offset is GMT+00:57:44 before 1 October 1891
- * and GMT+01:00:00 after that date)
- *
- * Date#getTimezoneOffset returns the offset in minutes and would return 57 for the example above,
- * which would lead to incorrect calculations.
- *
- * This function returns the timezone offset in milliseconds that takes seconds in account.
- */
-function getTimezoneOffsetInMilliseconds(date) {
-  var utcDate = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds(), date.getMilliseconds()));
-  utcDate.setUTCFullYear(date.getFullYear());
-  return date.getTime() - utcDate.getTime();
-}
-
-/**
- * @name startOfDay
- * @category Day Helpers
- * @summary Return the start of a day for the given date.
- *
- * @description
- * Return the start of a day for the given date.
- * The result will be in the local timezone.
- *
- * @param {Date|Number} date - the original date
- * @returns {Date} the start of a day
- * @throws {TypeError} 1 argument required
- *
- * @example
- * // The start of a day for 2 September 2014 11:55:00:
- * const result = startOfDay(new Date(2014, 8, 2, 11, 55, 0))
- * //=> Tue Sep 02 2014 00:00:00
- */
-function startOfDay(dirtyDate) {
-  requiredArgs(1, arguments);
-  var date = toDate(dirtyDate);
-  date.setHours(0, 0, 0, 0);
-  return date;
-}
-
-var MILLISECONDS_IN_DAY = 86400000;
-
-/**
- * @name differenceInCalendarDays
- * @category Day Helpers
- * @summary Get the number of calendar days between the given dates.
- *
- * @description
- * Get the number of calendar days between the given dates. This means that the times are removed
- * from the dates and then the difference in days is calculated.
- *
- * @param {Date|Number} dateLeft - the later date
- * @param {Date|Number} dateRight - the earlier date
- * @returns {Number} the number of calendar days
- * @throws {TypeError} 2 arguments required
- *
- * @example
- * // How many calendar days are between
- * // 2 July 2011 23:00:00 and 2 July 2012 00:00:00?
- * const result = differenceInCalendarDays(
- *   new Date(2012, 6, 2, 0, 0),
- *   new Date(2011, 6, 2, 23, 0)
- * )
- * //=> 366
- * // How many calendar days are between
- * // 2 July 2011 23:59:00 and 3 July 2011 00:01:00?
- * const result = differenceInCalendarDays(
- *   new Date(2011, 6, 3, 0, 1),
- *   new Date(2011, 6, 2, 23, 59)
- * )
- * //=> 1
- */
-function differenceInCalendarDays(dirtyDateLeft, dirtyDateRight) {
-  requiredArgs(2, arguments);
-  var startOfDayLeft = startOfDay(dirtyDateLeft);
-  var startOfDayRight = startOfDay(dirtyDateRight);
-  var timestampLeft = startOfDayLeft.getTime() - getTimezoneOffsetInMilliseconds(startOfDayLeft);
-  var timestampRight = startOfDayRight.getTime() - getTimezoneOffsetInMilliseconds(startOfDayRight);
-
-  // Round the number of days to the nearest integer
-  // because the number of milliseconds in a day is not constant
-  // (e.g. it's different in the day of the daylight saving time clock shift)
-  return Math.round((timestampLeft - timestampRight) / MILLISECONDS_IN_DAY);
-}
-
-/**
- * Days in 1 week.
- *
- * @name daysInWeek
- * @constant
- * @type {number}
- * @default
- */
-
-/**
- * Milliseconds in 1 hour
- *
- * @name millisecondsInHour
- * @constant
- * @type {number}
- * @default
- */
-var millisecondsInHour = 3600000;
-
-/**
- * @name differenceInMilliseconds
- * @category Millisecond Helpers
- * @summary Get the number of milliseconds between the given dates.
- *
- * @description
- * Get the number of milliseconds between the given dates.
- *
- * @param {Date|Number} dateLeft - the later date
- * @param {Date|Number} dateRight - the earlier date
- * @returns {Number} the number of milliseconds
- * @throws {TypeError} 2 arguments required
- *
- * @example
- * // How many milliseconds are between
- * // 2 July 2014 12:30:20.600 and 2 July 2014 12:30:21.700?
- * const result = differenceInMilliseconds(
- *   new Date(2014, 6, 2, 12, 30, 21, 700),
- *   new Date(2014, 6, 2, 12, 30, 20, 600)
- * )
- * //=> 1100
- */
-function differenceInMilliseconds(dateLeft, dateRight) {
-  requiredArgs(2, arguments);
-  return toDate(dateLeft).getTime() - toDate(dateRight).getTime();
-}
-
-var roundingMap = {
-  ceil: Math.ceil,
-  round: Math.round,
-  floor: Math.floor,
-  trunc: function trunc(value) {
-    return value < 0 ? Math.ceil(value) : Math.floor(value);
-  } // Math.trunc is not supported by IE
-};
-
-var defaultRoundingMethod = 'trunc';
-function getRoundingMethod(method) {
-  return method ? roundingMap[method] : roundingMap[defaultRoundingMethod];
-}
-
-/**
- * @name differenceInHours
- * @category Hour Helpers
- * @summary Get the number of hours between the given dates.
- *
- * @description
- * Get the number of hours between the given dates.
- *
- * @param {Date|Number} dateLeft - the later date
- * @param {Date|Number} dateRight - the earlier date
- * @param {Object} [options] - an object with options.
- * @param {String} [options.roundingMethod='trunc'] - a rounding method (`ceil`, `floor`, `round` or `trunc`)
- * @returns {Number} the number of hours
- * @throws {TypeError} 2 arguments required
- *
- * @example
- * // How many hours are between 2 July 2014 06:50:00 and 2 July 2014 19:00:00?
- * const result = differenceInHours(
- *   new Date(2014, 6, 2, 19, 0),
- *   new Date(2014, 6, 2, 6, 50)
- * )
- * //=> 12
- */
-function differenceInHours(dateLeft, dateRight, options) {
-  requiredArgs(2, arguments);
-  var diff = differenceInMilliseconds(dateLeft, dateRight) / millisecondsInHour;
-  return getRoundingMethod(options === null || options === void 0 ? void 0 : options.roundingMethod)(diff);
-}
-
-/**
- * @name isBefore
- * @category Common Helpers
- * @summary Is the first date before the second one?
- *
- * @description
- * Is the first date before the second one?
- *
- * @param {Date|Number} date - the date that should be before the other one to return true
- * @param {Date|Number} dateToCompare - the date to compare with
- * @returns {Boolean} the first date is before the second date
- * @throws {TypeError} 2 arguments required
- *
- * @example
- * // Is 10 July 1989 before 11 February 1987?
- * const result = isBefore(new Date(1989, 6, 10), new Date(1987, 1, 11))
- * //=> false
- */
-function isBefore(dirtyDate, dirtyDateToCompare) {
-  requiredArgs(2, arguments);
-  var date = toDate(dirtyDate);
-  var dateToCompare = toDate(dirtyDateToCompare);
-  return date.getTime() < dateToCompare.getTime();
-}
-
-function updateProgressSvg(progressElementRef, percent) {
-  const svgElement = progressElementRef.querySelector('#total_level');
-  const endLockWidth = 17, pointR = 6.5;
-  //Total Widget of the progress
-  const barWidth = svgElement.getBBox().width;
-  //The filled width according to current progress
-  const levelPercent = percent > 1 ? 1 : percent;
-  const widthOnBar = (levelPercent * barWidth - endLockWidth) < 0 ? 0 : levelPercent * barWidth - endLockWidth;
-  //update bar's width, widthOnBar
-  const levelBar = progressElementRef.querySelector('#current_level');
-  //update filters, x = widthOnBar
-  const levelFilter = progressElementRef.querySelector('#filter_current_level');
-  //update circle, widthOnBar+10
-  const levelCircle = progressElementRef.querySelector('#circle_current_level');
-  svgElement.setAttribute('viewbox', `0 0 ${widthOnBar} 28`);
-  levelBar.setAttribute('width', `${widthOnBar}`);
-  levelCircle.setAttribute('cx', `${(widthOnBar < pointR ? pointR : widthOnBar)}`);
-  levelFilter.setAttribute('x', `${widthOnBar - 8}`);
-  //update lock location
-  const endLockElement = progressElementRef.querySelector('#lock');
-  // wrapper of endLock, include ball and heatfilter1_d_305_23
-  const filter1 = progressElementRef.querySelector('#filter_heart_ball');
-  // ball in endlockfilter2_i_305_23
-  const filter2 = progressElementRef.querySelector('#filter_ball');
-  // heart in endlockfilter3_d_305_23
-  const filter3 = progressElementRef.querySelector('#filter_heart');
-  //wrapper of lockfilter4_d_305_23
-  const filterLock = progressElementRef.querySelector('#filter_lock');
-  // shadow of ball paint0_linear_305_23
-  const paint0 = progressElementRef.querySelector('#paint0_linear_ball');
-  //paint in lockpaint1_linear_305_23
-  const paint1 = progressElementRef.querySelector('#paint1_linear_lock');
-  // box of lock and heart, for move position dynamically
-  const lockBox = progressElementRef.querySelector('#lock_box');
-  const heartBox = progressElementRef.querySelector('#heart_box');
-  const rightPaddingOfLockWidth = 10, cxOfEndLockEle = barWidth - rightPaddingOfLockWidth;
-  //set cx of lockElement
-  endLockElement.setAttribute('cx', `${cxOfEndLockEle}`);
-  //set cx of sub Elements
-  paint1.setAttribute('x1', `${cxOfEndLockEle}`);
-  paint1.setAttribute('x2', `${cxOfEndLockEle}`);
-  paint0.setAttribute('x1', `${cxOfEndLockEle - 6}`);
-  paint0.setAttribute('x2', `${cxOfEndLockEle - 6 + 11.2}`);
-  filterLock.setAttribute('x', `${cxOfEndLockEle - 6}`);
-  filter3.setAttribute('x', `${cxOfEndLockEle - 6 - 2}`);
-  filter2.setAttribute('x', `${cxOfEndLockEle - 6 - 2 - 2}`);
-  filter1.setAttribute('x', `${cxOfEndLockEle - 6 - 2 - 2 - 4}`);
-  lockBox.setAttribute('x', `${cxOfEndLockEle - 6}`);
-  heartBox.setAttribute('x', `${cxOfEndLockEle - 6}`);
-  svgElement.parentElement.style.opacity = '1';
-}
-
-const playerElevateCardDataCss = ":host {\n  display: block;\n  width: 360px;\n  height: 230px;\n}\n\n.ElevateCardWrapper {\n  contain: layout inline-size;\n  width: 100%;\n  height: fit-content;\n  min-height: 218px;\n}\n\n.Outer {\n  container-type: inline-size;\n  font-size: 12px;\n  background-size: cover;\n  background-repeat: no-repeat;\n  line-height: initial;\n  width: 100%;\n  height: 100%;\n}\n\n.Dark {\n  color: var(--emfe-w-color-gray150, #efefef);\n}\n\n.Light {\n  color: var(--emfe-w-color-black, #0e0e0e);\n}\n\n@container (min-width: 381px) {\n  .Outer {\n    background-size: cover;\n  }\n  .Outer .OuterCover {\n    min-height: 190px;\n  }\n}\n@container (min-width: 260px) {\n  .Outer {\n    background-size: contain;\n  }\n}\n.OuterCover {\n  width: 100%;\n  height: 100%;\n  content: \"\";\n  background-repeat: no-repeat;\n  background-size: cover;\n  border-radius: 15px;\n}\n\n.Inner {\n  display: flex;\n  flex-direction: column;\n  min-height: 158px;\n}\n.Inner .Content {\n  padding: 15px;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n.Inner .Row {\n  display: flex;\n  flex-direction: row;\n}\n.Inner .CardCell {\n  display: flex;\n}\n.Inner .LevelProgress svg {\n  transition: opacity 0.4s;\n}\n.Inner .LevelInfo {\n  display: flex;\n  flex-direction: column;\n}\n.Inner .LevelInfo .ElevateLevel .LevelName {\n  height: 28px;\n  border-radius: 5px;\n  line-height: 28px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.Inner .LevelInfo.Level0 .ElevateLevel .LevelName {\n  box-shadow: -2px -2px 7px 0px var(--emfe-w-elevate-color-level0button-shadow, rgba(191, 84, 6, 0.75));\n  background: linear-gradient(180deg, var(--emfe-w-elevate-color-level0-bg0, #E2792C) 0%, var(--emfe-w-elevate-color-level0-bg1, rgba(242, 151, 99, 0)) 100%);\n}\n.Inner .LevelInfo.Level1 .ElevateLevel .LevelName {\n  box-shadow: -2px -2px 7px 0px var(--emfe-w-elevate-color-level1button-shadow, rgba(151, 151, 151, 0.75));\n  background: linear-gradient(180deg, var(--emfe-w-elevate-color-level1-bg0, #BEBFED) 0%, var(--emfe-w-elevate-color-level1-bg1, rgba(216, 217, 233, 0)) 100%);\n}\n.Inner .LevelInfo.Level2 .ElevateLevel .LevelName {\n  box-shadow: -2px -2px 7px 0px var(--emfe-w-elevate-color-level2button-shadow, rgba(191, 120, 6, 0.75));\n  background: linear-gradient(180deg, var(--emfe-w-elevate-color-level2-bg0, #FCC410) 0%, var(--emfe-w-elevate-color-level2-bg1, rgba(255, 189, 43, 0)) 100%);\n}\n.Inner .LevelInfo.Level3 .ElevateLevel .LevelName {\n  box-shadow: -2px -2px 7px 0px var(--emfe-w-elevate-color-level3button-shadow, rgba(65, 6, 191, 0.75));\n  background: linear-gradient(180deg, var(--emfe-w-elevate-color-level3-bg0, #B1A2DB) 0%, var(--emfe-w-elevate-color-level3-bg1, rgba(203, 202, 245, 0)) 100%);\n}\n.Inner .LevelInfo.Level4 .ElevateLevel .LevelName {\n  box-shadow: -2px -2px 7px 0px var(--emfe-w-elevate-color-level4button-shadow, rgba(65, 6, 191, 0.75));\n  background: linear-gradient(180deg, var(--emfe-w-elevate-color-level4-bg0, #B1A2DB) 0%, var(--emfe-w-elevate-color-level4-bg1, rgba(203, 202, 245, 0)) 100%);\n}\n.Inner .LevelInfo .ElevateLevel {\n  display: flex;\n}\n.Inner .LevelInfo {\n  flex: 1;\n  flex-grow: 1;\n  min-width: 150px;\n}\n.Inner .PlayerImg {\n  width: 29%;\n  margin: auto;\n  max-width: 100px;\n  min-width: 30px;\n  order: 0;\n}\n.Inner .PlayerAvatar {\n  max-width: 100px;\n  flex-basis: 100px;\n  height: auto;\n  margin: auto;\n  padding-top: 10px;\n}\n.Inner .PlayerAvatar .Avatar, .Inner .PlayerAvatar .Badge {\n  width: 100%;\n  height: 100%;\n}\n.Inner .PlayerAvatar .Avatar {\n  border-radius: 50%;\n  background-size: contain;\n  background-repeat: no-repeat;\n}\n.Inner .ElevateLevel .ExpirationDate {\n  max-width: 138px;\n  min-width: 118px;\n}\n.Inner .PlayerName, .Inner .RedeemButton, .Inner .ElevateLevel {\n  text-transform: capitalize;\n  width: 100%;\n}\n.Inner .PlayerName {\n  font-size: 16px;\n}\n.Inner .Row .PointsInfo {\n  display: table;\n  font-weight: 600;\n}\n.Inner .Row .Redeem {\n  justify-content: flex-end;\n  margin-left: auto;\n}\n.Inner .Row .Redeem:hover {\n  color: var(--emfe-w-elevate-color-redeem-hover, #00ABA4);\n  cursor: pointer;\n}\n.Inner .Row .RedeemButton:hover span {\n  color: var(emfe-w-elevate-color-redeem-text-hover, #f1f1f1);\n  font-weight: bold;\n}\n.Inner .Row .RedeemButton {\n  width: 95px;\n  height: 35px;\n  display: flex;\n  align-items: center;\n  border-radius: 10px;\n  background: var(--emfe-w-elevate-color-redeem-bg, linear-gradient(0deg, #26CC37, #26CC37)), linear-gradient(117.99deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.89%), linear-gradient(283.85deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.47%), linear-gradient(268.18deg, rgba(255, 255, 255, 0.6) -17.36%, rgba(239, 239, 239, 0) 15.78%);\n  box-shadow: 0px 4px 4px 0px #00000040;\n}\n.Inner .Row .RedeemButton span {\n  color: var(--emfe-w-color-white, #fff);\n  line-height: 18px;\n  font-size: 15px;\n  text-align: center;\n  width: 100%;\n}\n.Inner .Row .Points {\n  font-size: large;\n  vertical-align: middle;\n}\n.Inner .Row .Points .XP {\n  font-size: x-small;\n}\n.Inner .Row .ExpirationPoints {\n  font-size: small;\n  text-align: right;\n  font-weight: bold;\n  color: var(--emfe-w-color-red, #9e595f);\n}";
-
-const PlayerElevateCardData = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.playerElevateLeveLoaded = createEvent(this, "playerElevateLeveLoaded", 7);
-  }
-  handleWindowResizs() {
-    this.initLevelProgressbar();
-  }
-  onParamsChanged() {
-    this.loadElevateInfo();
-  }
-  redeemGiftButtonHandler() {
-    this.loadElevateInfo();
-  }
-  onRedeemClick() {
-    window.postMessage({ type: 'BEERedeemClicked' }, window.location.href);
-  }
-  loadLevels() {
-    let url = new URL(`${this.params.endpoint}/v1/elevate/levels?language=${this.params.language}`);
-    return new Promise((resolve, reject) => {
-      return fetch(url.href, {
-        method: 'GET',
-      })
-        .then((res) => res.json())
-        .then((res) => {
-        this.levels = res.data;
-        resolve(true);
-      })
-        .catch((err) => {
-        reject(err);
-      });
-    });
-  }
-  calcuatePointsToBeExpired(walletTotalInfo) {
-    let pointExpireInfoAsString = '';
-    if (!walletTotalInfo || !walletTotalInfo.aboutToExpire ||
-      walletTotalInfo.aboutToExpire.length == 0 ||
-      walletTotalInfo.aboutToExpire[0].points <= 0) {
-      return pointExpireInfoAsString;
-    }
-    walletTotalInfo.aboutToExpire.sort((expire1, expire2) => {
-      return isBefore(new Date(expire1.expireTime), new Date(expire2.expireTime))
-        ? -1
-        : 1;
-    });
-    const aboutToExpire = walletTotalInfo.aboutToExpire[0];
-    const daysToExpried = differenceInCalendarDays(new Date(aboutToExpire.expireTime), new Date());
-    let hoursToExpired = 0, expiredTranslationKey = daysToExpried === 0 ? 'pointsToBeExpiredDay' : 'pointsToBeExpired';
-    if (daysToExpried == 0) {
-      hoursToExpired = differenceInHours(new Date(aboutToExpire.expireTime), new Date());
-      expiredTranslationKey = hoursToExpired > 1 ? 'pointsToBeExpiredHours' : 'pointsToBeExpiredHour';
-    }
-    pointExpireInfoAsString = translateWithParams(expiredTranslationKey, {
-      expirationPoints: aboutToExpire.points,
-      expireDay: daysToExpried,
-    });
-    return pointExpireInfoAsString;
-  }
-  loadPlayerLevelInfo() {
-    let url = new URL(`${this.params.endpoint}/v1/elevate/playerInfo?language=${this.params.language}`);
-    return new Promise((resolve, reject) => {
-      return fetch(url.href, {
-        method: 'GET',
-        headers: {
-          'X-Sessionid': this.params.session,
-          'Content-Type': 'application/json',
-        },
-      })
-        .then((res) => res.json())
-        .then((res) => {
-        var _a, _b, _c;
-        if (!res.success) {
-          console.error('Exception when fetch user elevateinfo, ', res.errorCode, res.errorMessage);
-          reject(true);
-          return;
-        }
-        let playerElevateInfo = res.data;
-        this.playerElevateLevel = playerElevateInfo.level;
-        this.playerElevateLevel.name = this.playerElevateLevel.presentation.displayName || this.playerElevateLevel.name;
-        this.playerElevateLevel.spendablePoints = ((_a = playerElevateInfo.spendableWallet) === null || _a === void 0 ? void 0 : _a.total.points) || 0;
-        this.playerElevateLeveLoaded.emit({ elevateLevel: this.playerElevateLevel });
-        const spendableTotal = (_b = res.data.spendableWallet) === null || _b === void 0 ? void 0 : _b.total;
-        const loyaltyWalletTotal = (_c = res.data.loyaltyWallet) === null || _c === void 0 ? void 0 : _c.total;
-        this.playerElevateLeveLoaded.emit({
-          elevateLevelWalletTotal: spendableTotal,
-          loyaltyWalletTotal
-        });
-        let spExpireInfoAsString = this.calcuatePointsToBeExpired(spendableTotal);
-        let xpExpireInfoAsString = this.calcuatePointsToBeExpired(loyaltyWalletTotal);
-        if (spExpireInfoAsString || xpExpireInfoAsString) {
-          this.playerElevateLeveLoaded.emit({
-            pointExpireString: spExpireInfoAsString,
-            xpExpireString: xpExpireInfoAsString
-          });
-        }
-        resolve(this.playerElevateLevel);
-      })
-        .catch((err) => {
-        console.log('error ', err);
-        reject(true);
-      });
-    });
-  }
-  setLoyaltyProgress(percent) {
-    updateProgressSvg(this.loyaltyProgressEle, percent);
-  }
-  initLevelProgressbar() {
-    setTimeout(() => {
-      this.loyaltyProgressEle =
-        this.elevateCardRef.parentElement.querySelector('#LevelProgress');
-      if (!this.loyaltyProgressEle) {
-        return;
-      }
-      this.setLoyaltyProgress(!this.playerElevateLevel.nextLevel
-        ? 1 : (this.playerElevateLevel.loyaltyPoints / this.playerElevateLevel.nextLevel.entryPoints));
-      this.params['playerElevateLevel'] = this.playerElevateLevel;
-    }, 80);
-  }
-  componentDidRender() {
-    this.initLevelProgressbar();
-  }
-  loadElevateInfo() {
-    if (!this.params.endpoint || !this.params.session) {
-      return;
-    }
-    const promises = [];
-    promises.push(this.loadPlayerLevelInfo());
-    if (this.params.calculateLevelFlag) {
-      promises.push(this.loadLevels());
-    }
-    Promise.all(promises).then((res) => {
-      console.log('elevate-init', res);
-      this.initLevelProgressbar();
-      if (!this.levels) {
-        return;
-      }
-      this.levels.sort((level1, level2) => {
-        return level1.firstEntryPoints > level2.firstEntryPoints ? 1 : -1;
-      });
-      const playerPoints = this.playerElevateLevel.loyaltyPoints;
-      let playerLevelNumber = 0;
-      this.levels.forEach((elevateLevel, idx) => {
-        if (playerPoints > elevateLevel.firstEntryPoints) {
-          playerLevelNumber = idx;
-        }
-      });
-      this.playerElevateLeveLoaded.emit({
-        calculatedLevelFlag: playerLevelNumber,
-      });
-    });
-  }
-  componentWillLoad() {
-    this.loadElevateInfo();
-  }
-  get elevateCardRef() { return this; }
-  static get watchers() { return {
-    "params": ["onParamsChanged"]
-  }; }
-  static get style() { return playerElevateCardDataCss; }
-}, [0, "player-elevate-card-data", {
-    "params": [8],
-    "playerElevateLevel": [32],
-    "pointExpireString": [32]
-  }, [[9, "resize", "handleWindowResizs"], [8, "redeemGiftButton", "redeemGiftButtonHandler"]]]);
-function defineCustomElement() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["player-elevate-card-data"];
-  components.forEach(tagName => { switch (tagName) {
-    case "player-elevate-card-data":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, PlayerElevateCardData);
-      }
-      break;
-  } });
-}
-
-export { PlayerElevateCardData as P, TRANSLATIONS as T, _typeof as _, translate as a, translateWithParams as b, defineCustomElement as d, getTimezoneOffsetInMilliseconds as g, requiredArgs as r, toDate as t };