@everymatrix/lottery-tipping-ticket-buy 0.0.1

package/dist/esm/app-tooltip_11.entry.js

@@ -0,0 +1,3985 @@
+import { r as registerInstance, h, g as getElement, c as createEvent, a as getAssetPath } from './index-c24f96b9.js';
+import { r as requiredArgs, t as toDate, a as toInteger, _ as _typeof, s as setClientStyling, b as setClientStylingURL, c as setStreamStyling, p as parseISO, i as isBefore } from './lottery-tipping-ticket-buy-04819204.js';
+export { d as lottery_segmented, L as lottery_tipping_ticket_buy } from './lottery-tipping-ticket-buy-04819204.js';
+
+/**
+ * @name addMilliseconds
+ * @category Millisecond Helpers
+ * @summary Add the specified number of milliseconds to the given date.
+ *
+ * @description
+ * Add the specified number of milliseconds to the given date.
+ *
+ * @param {Date|Number} date - the date to be changed
+ * @param {Number} amount - the amount of milliseconds to be added. Positive decimals will be rounded using `Math.floor`, decimals less than zero will be rounded using `Math.ceil`.
+ * @returns {Date} the new date with the milliseconds added
+ * @throws {TypeError} 2 arguments required
+ *
+ * @example
+ * // Add 750 milliseconds to 10 July 2014 12:45:30.000:
+ * const result = addMilliseconds(new Date(2014, 6, 10, 12, 45, 30, 0), 750)
+ * //=> Thu Jul 10 2014 12:45:30.750
+ */
+function addMilliseconds(dirtyDate, dirtyAmount) {
+  requiredArgs(2, arguments);
+  var timestamp = toDate(dirtyDate).getTime();
+  var amount = toInteger(dirtyAmount);
+  return new Date(timestamp + amount);
+}
+
+var defaultOptions = {};
+function getDefaultOptions() {
+  return defaultOptions;
+}
+
+/**
+ * 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 isDate
+ * @category Common Helpers
+ * @summary Is the given value a date?
+ *
+ * @description
+ * Returns true if the given value is an instance of Date. The function works for dates transferred across iframes.
+ *
+ * @param {*} value - the value to check
+ * @returns {boolean} true if the given value is a date
+ * @throws {TypeError} 1 arguments required
+ *
+ * @example
+ * // For a valid date:
+ * const result = isDate(new Date())
+ * //=> true
+ *
+ * @example
+ * // For an invalid date:
+ * const result = isDate(new Date(NaN))
+ * //=> true
+ *
+ * @example
+ * // For some value:
+ * const result = isDate('2014-02-31')
+ * //=> false
+ *
+ * @example
+ * // For an object:
+ * const result = isDate({})
+ * //=> false
+ */
+function isDate(value) {
+  requiredArgs(1, arguments);
+  return value instanceof Date || _typeof(value) === 'object' && Object.prototype.toString.call(value) === '[object Date]';
+}
+
+/**
+ * @name isValid
+ * @category Common Helpers
+ * @summary Is the given date valid?
+ *
+ * @description
+ * Returns false if argument is Invalid Date and true otherwise.
+ * Argument is converted to Date using `toDate`. See [toDate]{@link https://date-fns.org/docs/toDate}
+ * Invalid Date is a Date, whose time value is NaN.
+ *
+ * Time value of Date: http://es5.github.io/#x15.9.1.1
+ *
+ * @param {*} date - the date to check
+ * @returns {Boolean} the date is valid
+ * @throws {TypeError} 1 argument required
+ *
+ * @example
+ * // For the valid date:
+ * const result = isValid(new Date(2014, 1, 31))
+ * //=> true
+ *
+ * @example
+ * // For the value, convertable into a date:
+ * const result = isValid(1393804800000)
+ * //=> true
+ *
+ * @example
+ * // For the invalid date:
+ * const result = isValid(new Date(''))
+ * //=> false
+ */
+function isValid(dirtyDate) {
+  requiredArgs(1, arguments);
+  if (!isDate(dirtyDate) && typeof dirtyDate !== 'number') {
+    return false;
+  }
+  var date = toDate(dirtyDate);
+  return !isNaN(Number(date));
+}
+
+/**
+ * @name subMilliseconds
+ * @category Millisecond Helpers
+ * @summary Subtract the specified number of milliseconds from the given date.
+ *
+ * @description
+ * Subtract the specified number of milliseconds from the given date.
+ *
+ * @param {Date|Number} date - the date to be changed
+ * @param {Number} amount - the amount of milliseconds to be subtracted. Positive decimals will be rounded using `Math.floor`, decimals less than zero will be rounded using `Math.ceil`.
+ * @returns {Date} the new date with the milliseconds subtracted
+ * @throws {TypeError} 2 arguments required
+ *
+ * @example
+ * // Subtract 750 milliseconds from 10 July 2014 12:45:30.000:
+ * const result = subMilliseconds(new Date(2014, 6, 10, 12, 45, 30, 0), 750)
+ * //=> Thu Jul 10 2014 12:45:29.250
+ */
+function subMilliseconds(dirtyDate, dirtyAmount) {
+  requiredArgs(2, arguments);
+  var amount = toInteger(dirtyAmount);
+  return addMilliseconds(dirtyDate, -amount);
+}
+
+var MILLISECONDS_IN_DAY = 86400000;
+function getUTCDayOfYear(dirtyDate) {
+  requiredArgs(1, arguments);
+  var date = toDate(dirtyDate);
+  var timestamp = date.getTime();
+  date.setUTCMonth(0, 1);
+  date.setUTCHours(0, 0, 0, 0);
+  var startOfYearTimestamp = date.getTime();
+  var difference = timestamp - startOfYearTimestamp;
+  return Math.floor(difference / MILLISECONDS_IN_DAY) + 1;
+}
+
+function startOfUTCISOWeek(dirtyDate) {
+  requiredArgs(1, arguments);
+  var weekStartsOn = 1;
+  var date = toDate(dirtyDate);
+  var day = date.getUTCDay();
+  var diff = (day < weekStartsOn ? 7 : 0) + day - weekStartsOn;
+  date.setUTCDate(date.getUTCDate() - diff);
+  date.setUTCHours(0, 0, 0, 0);
+  return date;
+}
+
+function getUTCISOWeekYear(dirtyDate) {
+  requiredArgs(1, arguments);
+  var date = toDate(dirtyDate);
+  var year = date.getUTCFullYear();
+  var fourthOfJanuaryOfNextYear = new Date(0);
+  fourthOfJanuaryOfNextYear.setUTCFullYear(year + 1, 0, 4);
+  fourthOfJanuaryOfNextYear.setUTCHours(0, 0, 0, 0);
+  var startOfNextYear = startOfUTCISOWeek(fourthOfJanuaryOfNextYear);
+  var fourthOfJanuaryOfThisYear = new Date(0);
+  fourthOfJanuaryOfThisYear.setUTCFullYear(year, 0, 4);
+  fourthOfJanuaryOfThisYear.setUTCHours(0, 0, 0, 0);
+  var startOfThisYear = startOfUTCISOWeek(fourthOfJanuaryOfThisYear);
+  if (date.getTime() >= startOfNextYear.getTime()) {
+    return year + 1;
+  } else if (date.getTime() >= startOfThisYear.getTime()) {
+    return year;
+  } else {
+    return year - 1;
+  }
+}
+
+function startOfUTCISOWeekYear(dirtyDate) {
+  requiredArgs(1, arguments);
+  var year = getUTCISOWeekYear(dirtyDate);
+  var fourthOfJanuary = new Date(0);
+  fourthOfJanuary.setUTCFullYear(year, 0, 4);
+  fourthOfJanuary.setUTCHours(0, 0, 0, 0);
+  var date = startOfUTCISOWeek(fourthOfJanuary);
+  return date;
+}
+
+var MILLISECONDS_IN_WEEK$1 = 604800000;
+function getUTCISOWeek(dirtyDate) {
+  requiredArgs(1, arguments);
+  var date = toDate(dirtyDate);
+  var diff = startOfUTCISOWeek(date).getTime() - startOfUTCISOWeekYear(date).getTime();
+
+  // Round the number of days to the nearest integer
+  // because the number of milliseconds in a week is not constant
+  // (e.g. it's different in the week of the daylight saving time clock shift)
+  return Math.round(diff / MILLISECONDS_IN_WEEK$1) + 1;
+}
+
+function startOfUTCWeek(dirtyDate, options) {
+  var _ref, _ref2, _ref3, _options$weekStartsOn, _options$locale, _options$locale$optio, _defaultOptions$local, _defaultOptions$local2;
+  requiredArgs(1, arguments);
+  var defaultOptions = getDefaultOptions();
+  var weekStartsOn = toInteger((_ref = (_ref2 = (_ref3 = (_options$weekStartsOn = options === null || options === void 0 ? void 0 : options.weekStartsOn) !== null && _options$weekStartsOn !== void 0 ? _options$weekStartsOn : options === null || options === void 0 ? void 0 : (_options$locale = options.locale) === null || _options$locale === void 0 ? void 0 : (_options$locale$optio = _options$locale.options) === null || _options$locale$optio === void 0 ? void 0 : _options$locale$optio.weekStartsOn) !== null && _ref3 !== void 0 ? _ref3 : defaultOptions.weekStartsOn) !== null && _ref2 !== void 0 ? _ref2 : (_defaultOptions$local = defaultOptions.locale) === null || _defaultOptions$local === void 0 ? void 0 : (_defaultOptions$local2 = _defaultOptions$local.options) === null || _defaultOptions$local2 === void 0 ? void 0 : _defaultOptions$local2.weekStartsOn) !== null && _ref !== void 0 ? _ref : 0);
+
+  // Test if weekStartsOn is between 0 and 6 _and_ is not NaN
+  if (!(weekStartsOn >= 0 && weekStartsOn <= 6)) {
+    throw new RangeError('weekStartsOn must be between 0 and 6 inclusively');
+  }
+  var date = toDate(dirtyDate);
+  var day = date.getUTCDay();
+  var diff = (day < weekStartsOn ? 7 : 0) + day - weekStartsOn;
+  date.setUTCDate(date.getUTCDate() - diff);
+  date.setUTCHours(0, 0, 0, 0);
+  return date;
+}
+
+function getUTCWeekYear(dirtyDate, options) {
+  var _ref, _ref2, _ref3, _options$firstWeekCon, _options$locale, _options$locale$optio, _defaultOptions$local, _defaultOptions$local2;
+  requiredArgs(1, arguments);
+  var date = toDate(dirtyDate);
+  var year = date.getUTCFullYear();
+  var defaultOptions = getDefaultOptions();
+  var firstWeekContainsDate = toInteger((_ref = (_ref2 = (_ref3 = (_options$firstWeekCon = options === null || options === void 0 ? void 0 : options.firstWeekContainsDate) !== null && _options$firstWeekCon !== void 0 ? _options$firstWeekCon : options === null || options === void 0 ? void 0 : (_options$locale = options.locale) === null || _options$locale === void 0 ? void 0 : (_options$locale$optio = _options$locale.options) === null || _options$locale$optio === void 0 ? void 0 : _options$locale$optio.firstWeekContainsDate) !== null && _ref3 !== void 0 ? _ref3 : defaultOptions.firstWeekContainsDate) !== null && _ref2 !== void 0 ? _ref2 : (_defaultOptions$local = defaultOptions.locale) === null || _defaultOptions$local === void 0 ? void 0 : (_defaultOptions$local2 = _defaultOptions$local.options) === null || _defaultOptions$local2 === void 0 ? void 0 : _defaultOptions$local2.firstWeekContainsDate) !== null && _ref !== void 0 ? _ref : 1);
+
+  // Test if weekStartsOn is between 1 and 7 _and_ is not NaN
+  if (!(firstWeekContainsDate >= 1 && firstWeekContainsDate <= 7)) {
+    throw new RangeError('firstWeekContainsDate must be between 1 and 7 inclusively');
+  }
+  var firstWeekOfNextYear = new Date(0);
+  firstWeekOfNextYear.setUTCFullYear(year + 1, 0, firstWeekContainsDate);
+  firstWeekOfNextYear.setUTCHours(0, 0, 0, 0);
+  var startOfNextYear = startOfUTCWeek(firstWeekOfNextYear, options);
+  var firstWeekOfThisYear = new Date(0);
+  firstWeekOfThisYear.setUTCFullYear(year, 0, firstWeekContainsDate);
+  firstWeekOfThisYear.setUTCHours(0, 0, 0, 0);
+  var startOfThisYear = startOfUTCWeek(firstWeekOfThisYear, options);
+  if (date.getTime() >= startOfNextYear.getTime()) {
+    return year + 1;
+  } else if (date.getTime() >= startOfThisYear.getTime()) {
+    return year;
+  } else {
+    return year - 1;
+  }
+}
+
+function startOfUTCWeekYear(dirtyDate, options) {
+  var _ref, _ref2, _ref3, _options$firstWeekCon, _options$locale, _options$locale$optio, _defaultOptions$local, _defaultOptions$local2;
+  requiredArgs(1, arguments);
+  var defaultOptions = getDefaultOptions();
+  var firstWeekContainsDate = toInteger((_ref = (_ref2 = (_ref3 = (_options$firstWeekCon = options === null || options === void 0 ? void 0 : options.firstWeekContainsDate) !== null && _options$firstWeekCon !== void 0 ? _options$firstWeekCon : options === null || options === void 0 ? void 0 : (_options$locale = options.locale) === null || _options$locale === void 0 ? void 0 : (_options$locale$optio = _options$locale.options) === null || _options$locale$optio === void 0 ? void 0 : _options$locale$optio.firstWeekContainsDate) !== null && _ref3 !== void 0 ? _ref3 : defaultOptions.firstWeekContainsDate) !== null && _ref2 !== void 0 ? _ref2 : (_defaultOptions$local = defaultOptions.locale) === null || _defaultOptions$local === void 0 ? void 0 : (_defaultOptions$local2 = _defaultOptions$local.options) === null || _defaultOptions$local2 === void 0 ? void 0 : _defaultOptions$local2.firstWeekContainsDate) !== null && _ref !== void 0 ? _ref : 1);
+  var year = getUTCWeekYear(dirtyDate, options);
+  var firstWeek = new Date(0);
+  firstWeek.setUTCFullYear(year, 0, firstWeekContainsDate);
+  firstWeek.setUTCHours(0, 0, 0, 0);
+  var date = startOfUTCWeek(firstWeek, options);
+  return date;
+}
+
+var MILLISECONDS_IN_WEEK = 604800000;
+function getUTCWeek(dirtyDate, options) {
+  requiredArgs(1, arguments);
+  var date = toDate(dirtyDate);
+  var diff = startOfUTCWeek(date, options).getTime() - startOfUTCWeekYear(date, options).getTime();
+
+  // Round the number of days to the nearest integer
+  // because the number of milliseconds in a week is not constant
+  // (e.g. it's different in the week of the daylight saving time clock shift)
+  return Math.round(diff / MILLISECONDS_IN_WEEK) + 1;
+}
+
+function addLeadingZeros(number, targetLength) {
+  var sign = number < 0 ? '-' : '';
+  var output = Math.abs(number).toString();
+  while (output.length < targetLength) {
+    output = '0' + output;
+  }
+  return sign + output;
+}
+
+/*
+ * |     | Unit                           |     | Unit                           |
+ * |-----|--------------------------------|-----|--------------------------------|
+ * |  a  | AM, PM                         |  A* |                                |
+ * |  d  | Day of month                   |  D  |                                |
+ * |  h  | Hour [1-12]                    |  H  | Hour [0-23]                    |
+ * |  m  | Minute                         |  M  | Month                          |
+ * |  s  | Second                         |  S  | Fraction of second             |
+ * |  y  | Year (abs)                     |  Y  |                                |
+ *
+ * Letters marked by * are not implemented but reserved by Unicode standard.
+ */
+var formatters$2 = {
+  // Year
+  y: function y(date, token) {
+    // From http://www.unicode.org/reports/tr35/tr35-31/tr35-dates.html#Date_Format_tokens
+    // | Year     |     y | yy |   yyy |  yyyy | yyyyy |
+    // |----------|-------|----|-------|-------|-------|
+    // | AD 1     |     1 | 01 |   001 |  0001 | 00001 |
+    // | AD 12    |    12 | 12 |   012 |  0012 | 00012 |
+    // | AD 123   |   123 | 23 |   123 |  0123 | 00123 |
+    // | AD 1234  |  1234 | 34 |  1234 |  1234 | 01234 |
+    // | AD 12345 | 12345 | 45 | 12345 | 12345 | 12345 |
+
+    var signedYear = date.getUTCFullYear();
+    // Returns 1 for 1 BC (which is year 0 in JavaScript)
+    var year = signedYear > 0 ? signedYear : 1 - signedYear;
+    return addLeadingZeros(token === 'yy' ? year % 100 : year, token.length);
+  },
+  // Month
+  M: function M(date, token) {
+    var month = date.getUTCMonth();
+    return token === 'M' ? String(month + 1) : addLeadingZeros(month + 1, 2);
+  },
+  // Day of the month
+  d: function d(date, token) {
+    return addLeadingZeros(date.getUTCDate(), token.length);
+  },
+  // AM or PM
+  a: function a(date, token) {
+    var dayPeriodEnumValue = date.getUTCHours() / 12 >= 1 ? 'pm' : 'am';
+    switch (token) {
+      case 'a':
+      case 'aa':
+        return dayPeriodEnumValue.toUpperCase();
+      case 'aaa':
+        return dayPeriodEnumValue;
+      case 'aaaaa':
+        return dayPeriodEnumValue[0];
+      case 'aaaa':
+      default:
+        return dayPeriodEnumValue === 'am' ? 'a.m.' : 'p.m.';
+    }
+  },
+  // Hour [1-12]
+  h: function h(date, token) {
+    return addLeadingZeros(date.getUTCHours() % 12 || 12, token.length);
+  },
+  // Hour [0-23]
+  H: function H(date, token) {
+    return addLeadingZeros(date.getUTCHours(), token.length);
+  },
+  // Minute
+  m: function m(date, token) {
+    return addLeadingZeros(date.getUTCMinutes(), token.length);
+  },
+  // Second
+  s: function s(date, token) {
+    return addLeadingZeros(date.getUTCSeconds(), token.length);
+  },
+  // Fraction of second
+  S: function S(date, token) {
+    var numberOfDigits = token.length;
+    var milliseconds = date.getUTCMilliseconds();
+    var fractionalSeconds = Math.floor(milliseconds * Math.pow(10, numberOfDigits - 3));
+    return addLeadingZeros(fractionalSeconds, token.length);
+  }
+};
+const formatters$3 = formatters$2;
+
+var dayPeriodEnum = {
+  am: 'am',
+  pm: 'pm',
+  midnight: 'midnight',
+  noon: 'noon',
+  morning: 'morning',
+  afternoon: 'afternoon',
+  evening: 'evening',
+  night: 'night'
+};
+/*
+ * |     | Unit                           |     | Unit                           |
+ * |-----|--------------------------------|-----|--------------------------------|
+ * |  a  | AM, PM                         |  A* | Milliseconds in day            |
+ * |  b  | AM, PM, noon, midnight         |  B  | Flexible day period            |
+ * |  c  | Stand-alone local day of week  |  C* | Localized hour w/ day period   |
+ * |  d  | Day of month                   |  D  | Day of year                    |
+ * |  e  | Local day of week              |  E  | Day of week                    |
+ * |  f  |                                |  F* | Day of week in month           |
+ * |  g* | Modified Julian day            |  G  | Era                            |
+ * |  h  | Hour [1-12]                    |  H  | Hour [0-23]                    |
+ * |  i! | ISO day of week                |  I! | ISO week of year               |
+ * |  j* | Localized hour w/ day period   |  J* | Localized hour w/o day period  |
+ * |  k  | Hour [1-24]                    |  K  | Hour [0-11]                    |
+ * |  l* | (deprecated)                   |  L  | Stand-alone month              |
+ * |  m  | Minute                         |  M  | Month                          |
+ * |  n  |                                |  N  |                                |
+ * |  o! | Ordinal number modifier        |  O  | Timezone (GMT)                 |
+ * |  p! | Long localized time            |  P! | Long localized date            |
+ * |  q  | Stand-alone quarter            |  Q  | Quarter                        |
+ * |  r* | Related Gregorian year         |  R! | ISO week-numbering year        |
+ * |  s  | Second                         |  S  | Fraction of second             |
+ * |  t! | Seconds timestamp              |  T! | Milliseconds timestamp         |
+ * |  u  | Extended year                  |  U* | Cyclic year                    |
+ * |  v* | Timezone (generic non-locat.)  |  V* | Timezone (location)            |
+ * |  w  | Local week of year             |  W* | Week of month                  |
+ * |  x  | Timezone (ISO-8601 w/o Z)      |  X  | Timezone (ISO-8601)            |
+ * |  y  | Year (abs)                     |  Y  | Local week-numbering year      |
+ * |  z  | Timezone (specific non-locat.) |  Z* | Timezone (aliases)             |
+ *
+ * Letters marked by * are not implemented but reserved by Unicode standard.
+ *
+ * Letters marked by ! are non-standard, but implemented by date-fns:
+ * - `o` modifies the previous token to turn it into an ordinal (see `format` docs)
+ * - `i` is ISO day of week. For `i` and `ii` is returns numeric ISO week days,
+ *   i.e. 7 for Sunday, 1 for Monday, etc.
+ * - `I` is ISO week of year, as opposed to `w` which is local week of year.
+ * - `R` is ISO week-numbering year, as opposed to `Y` which is local week-numbering year.
+ *   `R` is supposed to be used in conjunction with `I` and `i`
+ *   for universal ISO week-numbering date, whereas
+ *   `Y` is supposed to be used in conjunction with `w` and `e`
+ *   for week-numbering date specific to the locale.
+ * - `P` is long localized date format
+ * - `p` is long localized time format
+ */
+
+var formatters = {
+  // Era
+  G: function G(date, token, localize) {
+    var era = date.getUTCFullYear() > 0 ? 1 : 0;
+    switch (token) {
+      // AD, BC
+      case 'G':
+      case 'GG':
+      case 'GGG':
+        return localize.era(era, {
+          width: 'abbreviated'
+        });
+      // A, B
+      case 'GGGGG':
+        return localize.era(era, {
+          width: 'narrow'
+        });
+      // Anno Domini, Before Christ
+      case 'GGGG':
+      default:
+        return localize.era(era, {
+          width: 'wide'
+        });
+    }
+  },
+  // Year
+  y: function y(date, token, localize) {
+    // Ordinal number
+    if (token === 'yo') {
+      var signedYear = date.getUTCFullYear();
+      // Returns 1 for 1 BC (which is year 0 in JavaScript)
+      var year = signedYear > 0 ? signedYear : 1 - signedYear;
+      return localize.ordinalNumber(year, {
+        unit: 'year'
+      });
+    }
+    return formatters$3.y(date, token);
+  },
+  // Local week-numbering year
+  Y: function Y(date, token, localize, options) {
+    var signedWeekYear = getUTCWeekYear(date, options);
+    // Returns 1 for 1 BC (which is year 0 in JavaScript)
+    var weekYear = signedWeekYear > 0 ? signedWeekYear : 1 - signedWeekYear;
+
+    // Two digit year
+    if (token === 'YY') {
+      var twoDigitYear = weekYear % 100;
+      return addLeadingZeros(twoDigitYear, 2);
+    }
+
+    // Ordinal number
+    if (token === 'Yo') {
+      return localize.ordinalNumber(weekYear, {
+        unit: 'year'
+      });
+    }
+
+    // Padding
+    return addLeadingZeros(weekYear, token.length);
+  },
+  // ISO week-numbering year
+  R: function R(date, token) {
+    var isoWeekYear = getUTCISOWeekYear(date);
+
+    // Padding
+    return addLeadingZeros(isoWeekYear, token.length);
+  },
+  // Extended year. This is a single number designating the year of this calendar system.
+  // The main difference between `y` and `u` localizers are B.C. years:
+  // | Year | `y` | `u` |
+  // |------|-----|-----|
+  // | AC 1 |   1 |   1 |
+  // | BC 1 |   1 |   0 |
+  // | BC 2 |   2 |  -1 |
+  // Also `yy` always returns the last two digits of a year,
+  // while `uu` pads single digit years to 2 characters and returns other years unchanged.
+  u: function u(date, token) {
+    var year = date.getUTCFullYear();
+    return addLeadingZeros(year, token.length);
+  },
+  // Quarter
+  Q: function Q(date, token, localize) {
+    var quarter = Math.ceil((date.getUTCMonth() + 1) / 3);
+    switch (token) {
+      // 1, 2, 3, 4
+      case 'Q':
+        return String(quarter);
+      // 01, 02, 03, 04
+      case 'QQ':
+        return addLeadingZeros(quarter, 2);
+      // 1st, 2nd, 3rd, 4th
+      case 'Qo':
+        return localize.ordinalNumber(quarter, {
+          unit: 'quarter'
+        });
+      // Q1, Q2, Q3, Q4
+      case 'QQQ':
+        return localize.quarter(quarter, {
+          width: 'abbreviated',
+          context: 'formatting'
+        });
+      // 1, 2, 3, 4 (narrow quarter; could be not numerical)
+      case 'QQQQQ':
+        return localize.quarter(quarter, {
+          width: 'narrow',
+          context: 'formatting'
+        });
+      // 1st quarter, 2nd quarter, ...
+      case 'QQQQ':
+      default:
+        return localize.quarter(quarter, {
+          width: 'wide',
+          context: 'formatting'
+        });
+    }
+  },
+  // Stand-alone quarter
+  q: function q(date, token, localize) {
+    var quarter = Math.ceil((date.getUTCMonth() + 1) / 3);
+    switch (token) {
+      // 1, 2, 3, 4
+      case 'q':
+        return String(quarter);
+      // 01, 02, 03, 04
+      case 'qq':
+        return addLeadingZeros(quarter, 2);
+      // 1st, 2nd, 3rd, 4th
+      case 'qo':
+        return localize.ordinalNumber(quarter, {
+          unit: 'quarter'
+        });
+      // Q1, Q2, Q3, Q4
+      case 'qqq':
+        return localize.quarter(quarter, {
+          width: 'abbreviated',
+          context: 'standalone'
+        });
+      // 1, 2, 3, 4 (narrow quarter; could be not numerical)
+      case 'qqqqq':
+        return localize.quarter(quarter, {
+          width: 'narrow',
+          context: 'standalone'
+        });
+      // 1st quarter, 2nd quarter, ...
+      case 'qqqq':
+      default:
+        return localize.quarter(quarter, {
+          width: 'wide',
+          context: 'standalone'
+        });
+    }
+  },
+  // Month
+  M: function M(date, token, localize) {
+    var month = date.getUTCMonth();
+    switch (token) {
+      case 'M':
+      case 'MM':
+        return formatters$3.M(date, token);
+      // 1st, 2nd, ..., 12th
+      case 'Mo':
+        return localize.ordinalNumber(month + 1, {
+          unit: 'month'
+        });
+      // Jan, Feb, ..., Dec
+      case 'MMM':
+        return localize.month(month, {
+          width: 'abbreviated',
+          context: 'formatting'
+        });
+      // J, F, ..., D
+      case 'MMMMM':
+        return localize.month(month, {
+          width: 'narrow',
+          context: 'formatting'
+        });
+      // January, February, ..., December
+      case 'MMMM':
+      default:
+        return localize.month(month, {
+          width: 'wide',
+          context: 'formatting'
+        });
+    }
+  },
+  // Stand-alone month
+  L: function L(date, token, localize) {
+    var month = date.getUTCMonth();
+    switch (token) {
+      // 1, 2, ..., 12
+      case 'L':
+        return String(month + 1);
+      // 01, 02, ..., 12
+      case 'LL':
+        return addLeadingZeros(month + 1, 2);
+      // 1st, 2nd, ..., 12th
+      case 'Lo':
+        return localize.ordinalNumber(month + 1, {
+          unit: 'month'
+        });
+      // Jan, Feb, ..., Dec
+      case 'LLL':
+        return localize.month(month, {
+          width: 'abbreviated',
+          context: 'standalone'
+        });
+      // J, F, ..., D
+      case 'LLLLL':
+        return localize.month(month, {
+          width: 'narrow',
+          context: 'standalone'
+        });
+      // January, February, ..., December
+      case 'LLLL':
+      default:
+        return localize.month(month, {
+          width: 'wide',
+          context: 'standalone'
+        });
+    }
+  },
+  // Local week of year
+  w: function w(date, token, localize, options) {
+    var week = getUTCWeek(date, options);
+    if (token === 'wo') {
+      return localize.ordinalNumber(week, {
+        unit: 'week'
+      });
+    }
+    return addLeadingZeros(week, token.length);
+  },
+  // ISO week of year
+  I: function I(date, token, localize) {
+    var isoWeek = getUTCISOWeek(date);
+    if (token === 'Io') {
+      return localize.ordinalNumber(isoWeek, {
+        unit: 'week'
+      });
+    }
+    return addLeadingZeros(isoWeek, token.length);
+  },
+  // Day of the month
+  d: function d(date, token, localize) {
+    if (token === 'do') {
+      return localize.ordinalNumber(date.getUTCDate(), {
+        unit: 'date'
+      });
+    }
+    return formatters$3.d(date, token);
+  },
+  // Day of year
+  D: function D(date, token, localize) {
+    var dayOfYear = getUTCDayOfYear(date);
+    if (token === 'Do') {
+      return localize.ordinalNumber(dayOfYear, {
+        unit: 'dayOfYear'
+      });
+    }
+    return addLeadingZeros(dayOfYear, token.length);
+  },
+  // Day of week
+  E: function E(date, token, localize) {
+    var dayOfWeek = date.getUTCDay();
+    switch (token) {
+      // Tue
+      case 'E':
+      case 'EE':
+      case 'EEE':
+        return localize.day(dayOfWeek, {
+          width: 'abbreviated',
+          context: 'formatting'
+        });
+      // T
+      case 'EEEEE':
+        return localize.day(dayOfWeek, {
+          width: 'narrow',
+          context: 'formatting'
+        });
+      // Tu
+      case 'EEEEEE':
+        return localize.day(dayOfWeek, {
+          width: 'short',
+          context: 'formatting'
+        });
+      // Tuesday
+      case 'EEEE':
+      default:
+        return localize.day(dayOfWeek, {
+          width: 'wide',
+          context: 'formatting'
+        });
+    }
+  },
+  // Local day of week
+  e: function e(date, token, localize, options) {
+    var dayOfWeek = date.getUTCDay();
+    var localDayOfWeek = (dayOfWeek - options.weekStartsOn + 8) % 7 || 7;
+    switch (token) {
+      // Numerical value (Nth day of week with current locale or weekStartsOn)
+      case 'e':
+        return String(localDayOfWeek);
+      // Padded numerical value
+      case 'ee':
+        return addLeadingZeros(localDayOfWeek, 2);
+      // 1st, 2nd, ..., 7th
+      case 'eo':
+        return localize.ordinalNumber(localDayOfWeek, {
+          unit: 'day'
+        });
+      case 'eee':
+        return localize.day(dayOfWeek, {
+          width: 'abbreviated',
+          context: 'formatting'
+        });
+      // T
+      case 'eeeee':
+        return localize.day(dayOfWeek, {
+          width: 'narrow',
+          context: 'formatting'
+        });
+      // Tu
+      case 'eeeeee':
+        return localize.day(dayOfWeek, {
+          width: 'short',
+          context: 'formatting'
+        });
+      // Tuesday
+      case 'eeee':
+      default:
+        return localize.day(dayOfWeek, {
+          width: 'wide',
+          context: 'formatting'
+        });
+    }
+  },
+  // Stand-alone local day of week
+  c: function c(date, token, localize, options) {
+    var dayOfWeek = date.getUTCDay();
+    var localDayOfWeek = (dayOfWeek - options.weekStartsOn + 8) % 7 || 7;
+    switch (token) {
+      // Numerical value (same as in `e`)
+      case 'c':
+        return String(localDayOfWeek);
+      // Padded numerical value
+      case 'cc':
+        return addLeadingZeros(localDayOfWeek, token.length);
+      // 1st, 2nd, ..., 7th
+      case 'co':
+        return localize.ordinalNumber(localDayOfWeek, {
+          unit: 'day'
+        });
+      case 'ccc':
+        return localize.day(dayOfWeek, {
+          width: 'abbreviated',
+          context: 'standalone'
+        });
+      // T
+      case 'ccccc':
+        return localize.day(dayOfWeek, {
+          width: 'narrow',
+          context: 'standalone'
+        });
+      // Tu
+      case 'cccccc':
+        return localize.day(dayOfWeek, {
+          width: 'short',
+          context: 'standalone'
+        });
+      // Tuesday
+      case 'cccc':
+      default:
+        return localize.day(dayOfWeek, {
+          width: 'wide',
+          context: 'standalone'
+        });
+    }
+  },
+  // ISO day of week
+  i: function i(date, token, localize) {
+    var dayOfWeek = date.getUTCDay();
+    var isoDayOfWeek = dayOfWeek === 0 ? 7 : dayOfWeek;
+    switch (token) {
+      // 2
+      case 'i':
+        return String(isoDayOfWeek);
+      // 02
+      case 'ii':
+        return addLeadingZeros(isoDayOfWeek, token.length);
+      // 2nd
+      case 'io':
+        return localize.ordinalNumber(isoDayOfWeek, {
+          unit: 'day'
+        });
+      // Tue
+      case 'iii':
+        return localize.day(dayOfWeek, {
+          width: 'abbreviated',
+          context: 'formatting'
+        });
+      // T
+      case 'iiiii':
+        return localize.day(dayOfWeek, {
+          width: 'narrow',
+          context: 'formatting'
+        });
+      // Tu
+      case 'iiiiii':
+        return localize.day(dayOfWeek, {
+          width: 'short',
+          context: 'formatting'
+        });
+      // Tuesday
+      case 'iiii':
+      default:
+        return localize.day(dayOfWeek, {
+          width: 'wide',
+          context: 'formatting'
+        });
+    }
+  },
+  // AM or PM
+  a: function a(date, token, localize) {
+    var hours = date.getUTCHours();
+    var dayPeriodEnumValue = hours / 12 >= 1 ? 'pm' : 'am';
+    switch (token) {
+      case 'a':
+      case 'aa':
+        return localize.dayPeriod(dayPeriodEnumValue, {
+          width: 'abbreviated',
+          context: 'formatting'
+        });
+      case 'aaa':
+        return localize.dayPeriod(dayPeriodEnumValue, {
+          width: 'abbreviated',
+          context: 'formatting'
+        }).toLowerCase();
+      case 'aaaaa':
+        return localize.dayPeriod(dayPeriodEnumValue, {
+          width: 'narrow',
+          context: 'formatting'
+        });
+      case 'aaaa':
+      default:
+        return localize.dayPeriod(dayPeriodEnumValue, {
+          width: 'wide',
+          context: 'formatting'
+        });
+    }
+  },
+  // AM, PM, midnight, noon
+  b: function b(date, token, localize) {
+    var hours = date.getUTCHours();
+    var dayPeriodEnumValue;
+    if (hours === 12) {
+      dayPeriodEnumValue = dayPeriodEnum.noon;
+    } else if (hours === 0) {
+      dayPeriodEnumValue = dayPeriodEnum.midnight;
+    } else {
+      dayPeriodEnumValue = hours / 12 >= 1 ? 'pm' : 'am';
+    }
+    switch (token) {
+      case 'b':
+      case 'bb':
+        return localize.dayPeriod(dayPeriodEnumValue, {
+          width: 'abbreviated',
+          context: 'formatting'
+        });
+      case 'bbb':
+        return localize.dayPeriod(dayPeriodEnumValue, {
+          width: 'abbreviated',
+          context: 'formatting'
+        }).toLowerCase();
+      case 'bbbbb':
+        return localize.dayPeriod(dayPeriodEnumValue, {
+          width: 'narrow',
+          context: 'formatting'
+        });
+      case 'bbbb':
+      default:
+        return localize.dayPeriod(dayPeriodEnumValue, {
+          width: 'wide',
+          context: 'formatting'
+        });
+    }
+  },
+  // in the morning, in the afternoon, in the evening, at night
+  B: function B(date, token, localize) {
+    var hours = date.getUTCHours();
+    var dayPeriodEnumValue;
+    if (hours >= 17) {
+      dayPeriodEnumValue = dayPeriodEnum.evening;
+    } else if (hours >= 12) {
+      dayPeriodEnumValue = dayPeriodEnum.afternoon;
+    } else if (hours >= 4) {
+      dayPeriodEnumValue = dayPeriodEnum.morning;
+    } else {
+      dayPeriodEnumValue = dayPeriodEnum.night;
+    }
+    switch (token) {
+      case 'B':
+      case 'BB':
+      case 'BBB':
+        return localize.dayPeriod(dayPeriodEnumValue, {
+          width: 'abbreviated',
+          context: 'formatting'
+        });
+      case 'BBBBB':
+        return localize.dayPeriod(dayPeriodEnumValue, {
+          width: 'narrow',
+          context: 'formatting'
+        });
+      case 'BBBB':
+      default:
+        return localize.dayPeriod(dayPeriodEnumValue, {
+          width: 'wide',
+          context: 'formatting'
+        });
+    }
+  },
+  // Hour [1-12]
+  h: function h(date, token, localize) {
+    if (token === 'ho') {
+      var hours = date.getUTCHours() % 12;
+      if (hours === 0) hours = 12;
+      return localize.ordinalNumber(hours, {
+        unit: 'hour'
+      });
+    }
+    return formatters$3.h(date, token);
+  },
+  // Hour [0-23]
+  H: function H(date, token, localize) {
+    if (token === 'Ho') {
+      return localize.ordinalNumber(date.getUTCHours(), {
+        unit: 'hour'
+      });
+    }
+    return formatters$3.H(date, token);
+  },
+  // Hour [0-11]
+  K: function K(date, token, localize) {
+    var hours = date.getUTCHours() % 12;
+    if (token === 'Ko') {
+      return localize.ordinalNumber(hours, {
+        unit: 'hour'
+      });
+    }
+    return addLeadingZeros(hours, token.length);
+  },
+  // Hour [1-24]
+  k: function k(date, token, localize) {
+    var hours = date.getUTCHours();
+    if (hours === 0) hours = 24;
+    if (token === 'ko') {
+      return localize.ordinalNumber(hours, {
+        unit: 'hour'
+      });
+    }
+    return addLeadingZeros(hours, token.length);
+  },
+  // Minute
+  m: function m(date, token, localize) {
+    if (token === 'mo') {
+      return localize.ordinalNumber(date.getUTCMinutes(), {
+        unit: 'minute'
+      });
+    }
+    return formatters$3.m(date, token);
+  },
+  // Second
+  s: function s(date, token, localize) {
+    if (token === 'so') {
+      return localize.ordinalNumber(date.getUTCSeconds(), {
+        unit: 'second'
+      });
+    }
+    return formatters$3.s(date, token);
+  },
+  // Fraction of second
+  S: function S(date, token) {
+    return formatters$3.S(date, token);
+  },
+  // Timezone (ISO-8601. If offset is 0, output is always `'Z'`)
+  X: function X(date, token, _localize, options) {
+    var originalDate = options._originalDate || date;
+    var timezoneOffset = originalDate.getTimezoneOffset();
+    if (timezoneOffset === 0) {
+      return 'Z';
+    }
+    switch (token) {
+      // Hours and optional minutes
+      case 'X':
+        return formatTimezoneWithOptionalMinutes(timezoneOffset);
+
+      // Hours, minutes and optional seconds without `:` delimiter
+      // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets
+      // so this token always has the same output as `XX`
+      case 'XXXX':
+      case 'XX':
+        // Hours and minutes without `:` delimiter
+        return formatTimezone(timezoneOffset);
+
+      // Hours, minutes and optional seconds with `:` delimiter
+      // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets
+      // so this token always has the same output as `XXX`
+      case 'XXXXX':
+      case 'XXX': // Hours and minutes with `:` delimiter
+      default:
+        return formatTimezone(timezoneOffset, ':');
+    }
+  },
+  // Timezone (ISO-8601. If offset is 0, output is `'+00:00'` or equivalent)
+  x: function x(date, token, _localize, options) {
+    var originalDate = options._originalDate || date;
+    var timezoneOffset = originalDate.getTimezoneOffset();
+    switch (token) {
+      // Hours and optional minutes
+      case 'x':
+        return formatTimezoneWithOptionalMinutes(timezoneOffset);
+
+      // Hours, minutes and optional seconds without `:` delimiter
+      // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets
+      // so this token always has the same output as `xx`
+      case 'xxxx':
+      case 'xx':
+        // Hours and minutes without `:` delimiter
+        return formatTimezone(timezoneOffset);
+
+      // Hours, minutes and optional seconds with `:` delimiter
+      // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets
+      // so this token always has the same output as `xxx`
+      case 'xxxxx':
+      case 'xxx': // Hours and minutes with `:` delimiter
+      default:
+        return formatTimezone(timezoneOffset, ':');
+    }
+  },
+  // Timezone (GMT)
+  O: function O(date, token, _localize, options) {
+    var originalDate = options._originalDate || date;
+    var timezoneOffset = originalDate.getTimezoneOffset();
+    switch (token) {
+      // Short
+      case 'O':
+      case 'OO':
+      case 'OOO':
+        return 'GMT' + formatTimezoneShort(timezoneOffset, ':');
+      // Long
+      case 'OOOO':
+      default:
+        return 'GMT' + formatTimezone(timezoneOffset, ':');
+    }
+  },
+  // Timezone (specific non-location)
+  z: function z(date, token, _localize, options) {
+    var originalDate = options._originalDate || date;
+    var timezoneOffset = originalDate.getTimezoneOffset();
+    switch (token) {
+      // Short
+      case 'z':
+      case 'zz':
+      case 'zzz':
+        return 'GMT' + formatTimezoneShort(timezoneOffset, ':');
+      // Long
+      case 'zzzz':
+      default:
+        return 'GMT' + formatTimezone(timezoneOffset, ':');
+    }
+  },
+  // Seconds timestamp
+  t: function t(date, token, _localize, options) {
+    var originalDate = options._originalDate || date;
+    var timestamp = Math.floor(originalDate.getTime() / 1000);
+    return addLeadingZeros(timestamp, token.length);
+  },
+  // Milliseconds timestamp
+  T: function T(date, token, _localize, options) {
+    var originalDate = options._originalDate || date;
+    var timestamp = originalDate.getTime();
+    return addLeadingZeros(timestamp, token.length);
+  }
+};
+function formatTimezoneShort(offset, dirtyDelimiter) {
+  var sign = offset > 0 ? '-' : '+';
+  var absOffset = Math.abs(offset);
+  var hours = Math.floor(absOffset / 60);
+  var minutes = absOffset % 60;
+  if (minutes === 0) {
+    return sign + String(hours);
+  }
+  var delimiter = dirtyDelimiter || '';
+  return sign + String(hours) + delimiter + addLeadingZeros(minutes, 2);
+}
+function formatTimezoneWithOptionalMinutes(offset, dirtyDelimiter) {
+  if (offset % 60 === 0) {
+    var sign = offset > 0 ? '-' : '+';
+    return sign + addLeadingZeros(Math.abs(offset) / 60, 2);
+  }
+  return formatTimezone(offset, dirtyDelimiter);
+}
+function formatTimezone(offset, dirtyDelimiter) {
+  var delimiter = dirtyDelimiter || '';
+  var sign = offset > 0 ? '-' : '+';
+  var absOffset = Math.abs(offset);
+  var hours = addLeadingZeros(Math.floor(absOffset / 60), 2);
+  var minutes = addLeadingZeros(absOffset % 60, 2);
+  return sign + hours + delimiter + minutes;
+}
+const formatters$1 = formatters;
+
+var dateLongFormatter = function dateLongFormatter(pattern, formatLong) {
+  switch (pattern) {
+    case 'P':
+      return formatLong.date({
+        width: 'short'
+      });
+    case 'PP':
+      return formatLong.date({
+        width: 'medium'
+      });
+    case 'PPP':
+      return formatLong.date({
+        width: 'long'
+      });
+    case 'PPPP':
+    default:
+      return formatLong.date({
+        width: 'full'
+      });
+  }
+};
+var timeLongFormatter = function timeLongFormatter(pattern, formatLong) {
+  switch (pattern) {
+    case 'p':
+      return formatLong.time({
+        width: 'short'
+      });
+    case 'pp':
+      return formatLong.time({
+        width: 'medium'
+      });
+    case 'ppp':
+      return formatLong.time({
+        width: 'long'
+      });
+    case 'pppp':
+    default:
+      return formatLong.time({
+        width: 'full'
+      });
+  }
+};
+var dateTimeLongFormatter = function dateTimeLongFormatter(pattern, formatLong) {
+  var matchResult = pattern.match(/(P+)(p+)?/) || [];
+  var datePattern = matchResult[1];
+  var timePattern = matchResult[2];
+  if (!timePattern) {
+    return dateLongFormatter(pattern, formatLong);
+  }
+  var dateTimeFormat;
+  switch (datePattern) {
+    case 'P':
+      dateTimeFormat = formatLong.dateTime({
+        width: 'short'
+      });
+      break;
+    case 'PP':
+      dateTimeFormat = formatLong.dateTime({
+        width: 'medium'
+      });
+      break;
+    case 'PPP':
+      dateTimeFormat = formatLong.dateTime({
+        width: 'long'
+      });
+      break;
+    case 'PPPP':
+    default:
+      dateTimeFormat = formatLong.dateTime({
+        width: 'full'
+      });
+      break;
+  }
+  return dateTimeFormat.replace('{{date}}', dateLongFormatter(datePattern, formatLong)).replace('{{time}}', timeLongFormatter(timePattern, formatLong));
+};
+var longFormatters = {
+  p: timeLongFormatter,
+  P: dateTimeLongFormatter
+};
+const longFormatters$1 = longFormatters;
+
+var protectedDayOfYearTokens = ['D', 'DD'];
+var protectedWeekYearTokens = ['YY', 'YYYY'];
+function isProtectedDayOfYearToken(token) {
+  return protectedDayOfYearTokens.indexOf(token) !== -1;
+}
+function isProtectedWeekYearToken(token) {
+  return protectedWeekYearTokens.indexOf(token) !== -1;
+}
+function throwProtectedError(token, format, input) {
+  if (token === 'YYYY') {
+    throw new RangeError("Use `yyyy` instead of `YYYY` (in `".concat(format, "`) for formatting years to the input `").concat(input, "`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md"));
+  } else if (token === 'YY') {
+    throw new RangeError("Use `yy` instead of `YY` (in `".concat(format, "`) for formatting years to the input `").concat(input, "`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md"));
+  } else if (token === 'D') {
+    throw new RangeError("Use `d` instead of `D` (in `".concat(format, "`) for formatting days of the month to the input `").concat(input, "`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md"));
+  } else if (token === 'DD') {
+    throw new RangeError("Use `dd` instead of `DD` (in `".concat(format, "`) for formatting days of the month to the input `").concat(input, "`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md"));
+  }
+}
+
+var formatDistanceLocale = {
+  lessThanXSeconds: {
+    one: 'less than a second',
+    other: 'less than {{count}} seconds'
+  },
+  xSeconds: {
+    one: '1 second',
+    other: '{{count}} seconds'
+  },
+  halfAMinute: 'half a minute',
+  lessThanXMinutes: {
+    one: 'less than a minute',
+    other: 'less than {{count}} minutes'
+  },
+  xMinutes: {
+    one: '1 minute',
+    other: '{{count}} minutes'
+  },
+  aboutXHours: {
+    one: 'about 1 hour',
+    other: 'about {{count}} hours'
+  },
+  xHours: {
+    one: '1 hour',
+    other: '{{count}} hours'
+  },
+  xDays: {
+    one: '1 day',
+    other: '{{count}} days'
+  },
+  aboutXWeeks: {
+    one: 'about 1 week',
+    other: 'about {{count}} weeks'
+  },
+  xWeeks: {
+    one: '1 week',
+    other: '{{count}} weeks'
+  },
+  aboutXMonths: {
+    one: 'about 1 month',
+    other: 'about {{count}} months'
+  },
+  xMonths: {
+    one: '1 month',
+    other: '{{count}} months'
+  },
+  aboutXYears: {
+    one: 'about 1 year',
+    other: 'about {{count}} years'
+  },
+  xYears: {
+    one: '1 year',
+    other: '{{count}} years'
+  },
+  overXYears: {
+    one: 'over 1 year',
+    other: 'over {{count}} years'
+  },
+  almostXYears: {
+    one: 'almost 1 year',
+    other: 'almost {{count}} years'
+  }
+};
+var formatDistance = function formatDistance(token, count, options) {
+  var result;
+  var tokenValue = formatDistanceLocale[token];
+  if (typeof tokenValue === 'string') {
+    result = tokenValue;
+  } else if (count === 1) {
+    result = tokenValue.one;
+  } else {
+    result = tokenValue.other.replace('{{count}}', count.toString());
+  }
+  if (options !== null && options !== void 0 && options.addSuffix) {
+    if (options.comparison && options.comparison > 0) {
+      return 'in ' + result;
+    } else {
+      return result + ' ago';
+    }
+  }
+  return result;
+};
+const formatDistance$1 = formatDistance;
+
+function buildFormatLongFn(args) {
+  return function () {
+    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    // TODO: Remove String()
+    var width = options.width ? String(options.width) : args.defaultWidth;
+    var format = args.formats[width] || args.formats[args.defaultWidth];
+    return format;
+  };
+}
+
+var dateFormats = {
+  full: 'EEEE, MMMM do, y',
+  long: 'MMMM do, y',
+  medium: 'MMM d, y',
+  short: 'MM/dd/yyyy'
+};
+var timeFormats = {
+  full: 'h:mm:ss a zzzz',
+  long: 'h:mm:ss a z',
+  medium: 'h:mm:ss a',
+  short: 'h:mm a'
+};
+var dateTimeFormats = {
+  full: "{{date}} 'at' {{time}}",
+  long: "{{date}} 'at' {{time}}",
+  medium: '{{date}}, {{time}}',
+  short: '{{date}}, {{time}}'
+};
+var formatLong = {
+  date: buildFormatLongFn({
+    formats: dateFormats,
+    defaultWidth: 'full'
+  }),
+  time: buildFormatLongFn({
+    formats: timeFormats,
+    defaultWidth: 'full'
+  }),
+  dateTime: buildFormatLongFn({
+    formats: dateTimeFormats,
+    defaultWidth: 'full'
+  })
+};
+const formatLong$1 = formatLong;
+
+var formatRelativeLocale = {
+  lastWeek: "'last' eeee 'at' p",
+  yesterday: "'yesterday at' p",
+  today: "'today at' p",
+  tomorrow: "'tomorrow at' p",
+  nextWeek: "eeee 'at' p",
+  other: 'P'
+};
+var formatRelative = function formatRelative(token, _date, _baseDate, _options) {
+  return formatRelativeLocale[token];
+};
+const formatRelative$1 = formatRelative;
+
+function buildLocalizeFn(args) {
+  return function (dirtyIndex, options) {
+    var context = options !== null && options !== void 0 && options.context ? String(options.context) : 'standalone';
+    var valuesArray;
+    if (context === 'formatting' && args.formattingValues) {
+      var defaultWidth = args.defaultFormattingWidth || args.defaultWidth;
+      var width = options !== null && options !== void 0 && options.width ? String(options.width) : defaultWidth;
+      valuesArray = args.formattingValues[width] || args.formattingValues[defaultWidth];
+    } else {
+      var _defaultWidth = args.defaultWidth;
+      var _width = options !== null && options !== void 0 && options.width ? String(options.width) : args.defaultWidth;
+      valuesArray = args.values[_width] || args.values[_defaultWidth];
+    }
+    var index = args.argumentCallback ? args.argumentCallback(dirtyIndex) : dirtyIndex;
+    // @ts-ignore: For some reason TypeScript just don't want to match it, no matter how hard we try. I challenge you to try to remove it!
+    return valuesArray[index];
+  };
+}
+
+var eraValues = {
+  narrow: ['B', 'A'],
+  abbreviated: ['BC', 'AD'],
+  wide: ['Before Christ', 'Anno Domini']
+};
+var quarterValues = {
+  narrow: ['1', '2', '3', '4'],
+  abbreviated: ['Q1', 'Q2', 'Q3', 'Q4'],
+  wide: ['1st quarter', '2nd quarter', '3rd quarter', '4th quarter']
+};
+
+// Note: in English, the names of days of the week and months are capitalized.
+// If you are making a new locale based on this one, check if the same is true for the language you're working on.
+// Generally, formatted dates should look like they are in the middle of a sentence,
+// e.g. in Spanish language the weekdays and months should be in the lowercase.
+var monthValues = {
+  narrow: ['J', 'F', 'M', 'A', 'M', 'J', 'J', 'A', 'S', 'O', 'N', 'D'],
+  abbreviated: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
+  wide: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']
+};
+var dayValues = {
+  narrow: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
+  short: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
+  abbreviated: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
+  wide: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']
+};
+var dayPeriodValues = {
+  narrow: {
+    am: 'a',
+    pm: 'p',
+    midnight: 'mi',
+    noon: 'n',
+    morning: 'morning',
+    afternoon: 'afternoon',
+    evening: 'evening',
+    night: 'night'
+  },
+  abbreviated: {
+    am: 'AM',
+    pm: 'PM',
+    midnight: 'midnight',
+    noon: 'noon',
+    morning: 'morning',
+    afternoon: 'afternoon',
+    evening: 'evening',
+    night: 'night'
+  },
+  wide: {
+    am: 'a.m.',
+    pm: 'p.m.',
+    midnight: 'midnight',
+    noon: 'noon',
+    morning: 'morning',
+    afternoon: 'afternoon',
+    evening: 'evening',
+    night: 'night'
+  }
+};
+var formattingDayPeriodValues = {
+  narrow: {
+    am: 'a',
+    pm: 'p',
+    midnight: 'mi',
+    noon: 'n',
+    morning: 'in the morning',
+    afternoon: 'in the afternoon',
+    evening: 'in the evening',
+    night: 'at night'
+  },
+  abbreviated: {
+    am: 'AM',
+    pm: 'PM',
+    midnight: 'midnight',
+    noon: 'noon',
+    morning: 'in the morning',
+    afternoon: 'in the afternoon',
+    evening: 'in the evening',
+    night: 'at night'
+  },
+  wide: {
+    am: 'a.m.',
+    pm: 'p.m.',
+    midnight: 'midnight',
+    noon: 'noon',
+    morning: 'in the morning',
+    afternoon: 'in the afternoon',
+    evening: 'in the evening',
+    night: 'at night'
+  }
+};
+var ordinalNumber = function ordinalNumber(dirtyNumber, _options) {
+  var number = Number(dirtyNumber);
+
+  // If ordinal numbers depend on context, for example,
+  // if they are different for different grammatical genders,
+  // use `options.unit`.
+  //
+  // `unit` can be 'year', 'quarter', 'month', 'week', 'date', 'dayOfYear',
+  // 'day', 'hour', 'minute', 'second'.
+
+  var rem100 = number % 100;
+  if (rem100 > 20 || rem100 < 10) {
+    switch (rem100 % 10) {
+      case 1:
+        return number + 'st';
+      case 2:
+        return number + 'nd';
+      case 3:
+        return number + 'rd';
+    }
+  }
+  return number + 'th';
+};
+var localize = {
+  ordinalNumber: ordinalNumber,
+  era: buildLocalizeFn({
+    values: eraValues,
+    defaultWidth: 'wide'
+  }),
+  quarter: buildLocalizeFn({
+    values: quarterValues,
+    defaultWidth: 'wide',
+    argumentCallback: function argumentCallback(quarter) {
+      return quarter - 1;
+    }
+  }),
+  month: buildLocalizeFn({
+    values: monthValues,
+    defaultWidth: 'wide'
+  }),
+  day: buildLocalizeFn({
+    values: dayValues,
+    defaultWidth: 'wide'
+  }),
+  dayPeriod: buildLocalizeFn({
+    values: dayPeriodValues,
+    defaultWidth: 'wide',
+    formattingValues: formattingDayPeriodValues,
+    defaultFormattingWidth: 'wide'
+  })
+};
+const localize$1 = localize;
+
+function buildMatchFn(args) {
+  return function (string) {
+    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var width = options.width;
+    var matchPattern = width && args.matchPatterns[width] || args.matchPatterns[args.defaultMatchWidth];
+    var matchResult = string.match(matchPattern);
+    if (!matchResult) {
+      return null;
+    }
+    var matchedString = matchResult[0];
+    var parsePatterns = width && args.parsePatterns[width] || args.parsePatterns[args.defaultParseWidth];
+    var key = Array.isArray(parsePatterns) ? findIndex(parsePatterns, function (pattern) {
+      return pattern.test(matchedString);
+    }) : findKey(parsePatterns, function (pattern) {
+      return pattern.test(matchedString);
+    });
+    var value;
+    value = args.valueCallback ? args.valueCallback(key) : key;
+    value = options.valueCallback ? options.valueCallback(value) : value;
+    var rest = string.slice(matchedString.length);
+    return {
+      value: value,
+      rest: rest
+    };
+  };
+}
+function findKey(object, predicate) {
+  for (var key in object) {
+    if (object.hasOwnProperty(key) && predicate(object[key])) {
+      return key;
+    }
+  }
+  return undefined;
+}
+function findIndex(array, predicate) {
+  for (var key = 0; key < array.length; key++) {
+    if (predicate(array[key])) {
+      return key;
+    }
+  }
+  return undefined;
+}
+
+function buildMatchPatternFn(args) {
+  return function (string) {
+    var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    var matchResult = string.match(args.matchPattern);
+    if (!matchResult) return null;
+    var matchedString = matchResult[0];
+    var parseResult = string.match(args.parsePattern);
+    if (!parseResult) return null;
+    var value = args.valueCallback ? args.valueCallback(parseResult[0]) : parseResult[0];
+    value = options.valueCallback ? options.valueCallback(value) : value;
+    var rest = string.slice(matchedString.length);
+    return {
+      value: value,
+      rest: rest
+    };
+  };
+}
+
+var matchOrdinalNumberPattern = /^(\d+)(th|st|nd|rd)?/i;
+var parseOrdinalNumberPattern = /\d+/i;
+var matchEraPatterns = {
+  narrow: /^(b|a)/i,
+  abbreviated: /^(b\.?\s?c\.?|b\.?\s?c\.?\s?e\.?|a\.?\s?d\.?|c\.?\s?e\.?)/i,
+  wide: /^(before christ|before common era|anno domini|common era)/i
+};
+var parseEraPatterns = {
+  any: [/^b/i, /^(a|c)/i]
+};
+var matchQuarterPatterns = {
+  narrow: /^[1234]/i,
+  abbreviated: /^q[1234]/i,
+  wide: /^[1234](th|st|nd|rd)? quarter/i
+};
+var parseQuarterPatterns = {
+  any: [/1/i, /2/i, /3/i, /4/i]
+};
+var matchMonthPatterns = {
+  narrow: /^[jfmasond]/i,
+  abbreviated: /^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i,
+  wide: /^(january|february|march|april|may|june|july|august|september|october|november|december)/i
+};
+var parseMonthPatterns = {
+  narrow: [/^j/i, /^f/i, /^m/i, /^a/i, /^m/i, /^j/i, /^j/i, /^a/i, /^s/i, /^o/i, /^n/i, /^d/i],
+  any: [/^ja/i, /^f/i, /^mar/i, /^ap/i, /^may/i, /^jun/i, /^jul/i, /^au/i, /^s/i, /^o/i, /^n/i, /^d/i]
+};
+var matchDayPatterns = {
+  narrow: /^[smtwf]/i,
+  short: /^(su|mo|tu|we|th|fr|sa)/i,
+  abbreviated: /^(sun|mon|tue|wed|thu|fri|sat)/i,
+  wide: /^(sunday|monday|tuesday|wednesday|thursday|friday|saturday)/i
+};
+var parseDayPatterns = {
+  narrow: [/^s/i, /^m/i, /^t/i, /^w/i, /^t/i, /^f/i, /^s/i],
+  any: [/^su/i, /^m/i, /^tu/i, /^w/i, /^th/i, /^f/i, /^sa/i]
+};
+var matchDayPeriodPatterns = {
+  narrow: /^(a|p|mi|n|(in the|at) (morning|afternoon|evening|night))/i,
+  any: /^([ap]\.?\s?m\.?|midnight|noon|(in the|at) (morning|afternoon|evening|night))/i
+};
+var parseDayPeriodPatterns = {
+  any: {
+    am: /^a/i,
+    pm: /^p/i,
+    midnight: /^mi/i,
+    noon: /^no/i,
+    morning: /morning/i,
+    afternoon: /afternoon/i,
+    evening: /evening/i,
+    night: /night/i
+  }
+};
+var match = {
+  ordinalNumber: buildMatchPatternFn({
+    matchPattern: matchOrdinalNumberPattern,
+    parsePattern: parseOrdinalNumberPattern,
+    valueCallback: function valueCallback(value) {
+      return parseInt(value, 10);
+    }
+  }),
+  era: buildMatchFn({
+    matchPatterns: matchEraPatterns,
+    defaultMatchWidth: 'wide',
+    parsePatterns: parseEraPatterns,
+    defaultParseWidth: 'any'
+  }),
+  quarter: buildMatchFn({
+    matchPatterns: matchQuarterPatterns,
+    defaultMatchWidth: 'wide',
+    parsePatterns: parseQuarterPatterns,
+    defaultParseWidth: 'any',
+    valueCallback: function valueCallback(index) {
+      return index + 1;
+    }
+  }),
+  month: buildMatchFn({
+    matchPatterns: matchMonthPatterns,
+    defaultMatchWidth: 'wide',
+    parsePatterns: parseMonthPatterns,
+    defaultParseWidth: 'any'
+  }),
+  day: buildMatchFn({
+    matchPatterns: matchDayPatterns,
+    defaultMatchWidth: 'wide',
+    parsePatterns: parseDayPatterns,
+    defaultParseWidth: 'any'
+  }),
+  dayPeriod: buildMatchFn({
+    matchPatterns: matchDayPeriodPatterns,
+    defaultMatchWidth: 'any',
+    parsePatterns: parseDayPeriodPatterns,
+    defaultParseWidth: 'any'
+  })
+};
+const match$1 = match;
+
+/**
+ * @type {Locale}
+ * @category Locales
+ * @summary English locale (United States).
+ * @language English
+ * @iso-639-2 eng
+ * @author Sasha Koss [@kossnocorp]{@link https://github.com/kossnocorp}
+ * @author Lesha Koss [@leshakoss]{@link https://github.com/leshakoss}
+ */
+var locale = {
+  code: 'en-US',
+  formatDistance: formatDistance$1,
+  formatLong: formatLong$1,
+  formatRelative: formatRelative$1,
+  localize: localize$1,
+  match: match$1,
+  options: {
+    weekStartsOn: 0 /* Sunday */,
+    firstWeekContainsDate: 1
+  }
+};
+const defaultLocale = locale;
+
+// - [yYQqMLwIdDecihHKkms]o matches any available ordinal number token
+//   (one of the certain letters followed by `o`)
+// - (\w)\1* matches any sequences of the same letter
+// - '' matches two quote characters in a row
+// - '(''|[^'])+('|$) matches anything surrounded by two quote characters ('),
+//   except a single quote symbol, which ends the sequence.
+//   Two quote characters do not end the sequence.
+//   If there is no matching single quote
+//   then the sequence will continue until the end of the string.
+// - . matches any single character unmatched by previous parts of the RegExps
+var formattingTokensRegExp = /[yYQqMLwIdDecihHKkms]o|(\w)\1*|''|'(''|[^'])+('|$)|./g;
+
+// This RegExp catches symbols escaped by quotes, and also
+// sequences of symbols P, p, and the combinations like `PPPPPPPppppp`
+var longFormattingTokensRegExp = /P+p+|P+|p+|''|'(''|[^'])+('|$)|./g;
+var escapedStringRegExp = /^'([^]*?)'?$/;
+var doubleQuoteRegExp = /''/g;
+var unescapedLatinCharacterRegExp = /[a-zA-Z]/;
+
+/**
+ * @name format
+ * @category Common Helpers
+ * @summary Format the date.
+ *
+ * @description
+ * Return the formatted date string in the given format. The result may vary by locale.
+ *
+ * > ⚠️ Please note that the `format` tokens differ from Moment.js and other libraries.
+ * > See: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
+ *
+ * The characters wrapped between two single quotes characters (') are escaped.
+ * Two single quotes in a row, whether inside or outside a quoted sequence, represent a 'real' single quote.
+ * (see the last example)
+ *
+ * Format of the string is based on Unicode Technical Standard #35:
+ * https://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table
+ * with a few additions (see note 7 below the table).
+ *
+ * Accepted patterns:
+ * | Unit                            | Pattern | Result examples                   | Notes |
+ * |---------------------------------|---------|-----------------------------------|-------|
+ * | Era                             | G..GGG  | AD, BC                            |       |
+ * |                                 | GGGG    | Anno Domini, Before Christ        | 2     |
+ * |                                 | GGGGG   | A, B                              |       |
+ * | Calendar year                   | y       | 44, 1, 1900, 2017                 | 5     |
+ * |                                 | yo      | 44th, 1st, 0th, 17th              | 5,7   |
+ * |                                 | yy      | 44, 01, 00, 17                    | 5     |
+ * |                                 | yyy     | 044, 001, 1900, 2017              | 5     |
+ * |                                 | yyyy    | 0044, 0001, 1900, 2017            | 5     |
+ * |                                 | yyyyy   | ...                               | 3,5   |
+ * | Local week-numbering year       | Y       | 44, 1, 1900, 2017                 | 5     |
+ * |                                 | Yo      | 44th, 1st, 1900th, 2017th         | 5,7   |
+ * |                                 | YY      | 44, 01, 00, 17                    | 5,8   |
+ * |                                 | YYY     | 044, 001, 1900, 2017              | 5     |
+ * |                                 | YYYY    | 0044, 0001, 1900, 2017            | 5,8   |
+ * |                                 | YYYYY   | ...                               | 3,5   |
+ * | ISO week-numbering year         | R       | -43, 0, 1, 1900, 2017             | 5,7   |
+ * |                                 | RR      | -43, 00, 01, 1900, 2017           | 5,7   |
+ * |                                 | RRR     | -043, 000, 001, 1900, 2017        | 5,7   |
+ * |                                 | RRRR    | -0043, 0000, 0001, 1900, 2017     | 5,7   |
+ * |                                 | RRRRR   | ...                               | 3,5,7 |
+ * | Extended year                   | u       | -43, 0, 1, 1900, 2017             | 5     |
+ * |                                 | uu      | -43, 01, 1900, 2017               | 5     |
+ * |                                 | uuu     | -043, 001, 1900, 2017             | 5     |
+ * |                                 | uuuu    | -0043, 0001, 1900, 2017           | 5     |
+ * |                                 | uuuuu   | ...                               | 3,5   |
+ * | Quarter (formatting)            | Q       | 1, 2, 3, 4                        |       |
+ * |                                 | Qo      | 1st, 2nd, 3rd, 4th                | 7     |
+ * |                                 | QQ      | 01, 02, 03, 04                    |       |
+ * |                                 | QQQ     | Q1, Q2, Q3, Q4                    |       |
+ * |                                 | QQQQ    | 1st quarter, 2nd quarter, ...     | 2     |
+ * |                                 | QQQQQ   | 1, 2, 3, 4                        | 4     |
+ * | Quarter (stand-alone)           | q       | 1, 2, 3, 4                        |       |
+ * |                                 | qo      | 1st, 2nd, 3rd, 4th                | 7     |
+ * |                                 | qq      | 01, 02, 03, 04                    |       |
+ * |                                 | qqq     | Q1, Q2, Q3, Q4                    |       |
+ * |                                 | qqqq    | 1st quarter, 2nd quarter, ...     | 2     |
+ * |                                 | qqqqq   | 1, 2, 3, 4                        | 4     |
+ * | Month (formatting)              | M       | 1, 2, ..., 12                     |       |
+ * |                                 | Mo      | 1st, 2nd, ..., 12th               | 7     |
+ * |                                 | MM      | 01, 02, ..., 12                   |       |
+ * |                                 | MMM     | Jan, Feb, ..., Dec                |       |
+ * |                                 | MMMM    | January, February, ..., December  | 2     |
+ * |                                 | MMMMM   | J, F, ..., D                      |       |
+ * | Month (stand-alone)             | L       | 1, 2, ..., 12                     |       |
+ * |                                 | Lo      | 1st, 2nd, ..., 12th               | 7     |
+ * |                                 | LL      | 01, 02, ..., 12                   |       |
+ * |                                 | LLL     | Jan, Feb, ..., Dec                |       |
+ * |                                 | LLLL    | January, February, ..., December  | 2     |
+ * |                                 | LLLLL   | J, F, ..., D                      |       |
+ * | Local week of year              | w       | 1, 2, ..., 53                     |       |
+ * |                                 | wo      | 1st, 2nd, ..., 53th               | 7     |
+ * |                                 | ww      | 01, 02, ..., 53                   |       |
+ * | ISO week of year                | I       | 1, 2, ..., 53                     | 7     |
+ * |                                 | Io      | 1st, 2nd, ..., 53th               | 7     |
+ * |                                 | II      | 01, 02, ..., 53                   | 7     |
+ * | Day of month                    | d       | 1, 2, ..., 31                     |       |
+ * |                                 | do      | 1st, 2nd, ..., 31st               | 7     |
+ * |                                 | dd      | 01, 02, ..., 31                   |       |
+ * | Day of year                     | D       | 1, 2, ..., 365, 366               | 9     |
+ * |                                 | Do      | 1st, 2nd, ..., 365th, 366th       | 7     |
+ * |                                 | DD      | 01, 02, ..., 365, 366             | 9     |
+ * |                                 | DDD     | 001, 002, ..., 365, 366           |       |
+ * |                                 | DDDD    | ...                               | 3     |
+ * | Day of week (formatting)        | E..EEE  | Mon, Tue, Wed, ..., Sun           |       |
+ * |                                 | EEEE    | Monday, Tuesday, ..., Sunday      | 2     |
+ * |                                 | EEEEE   | M, T, W, T, F, S, S               |       |
+ * |                                 | EEEEEE  | Mo, Tu, We, Th, Fr, Sa, Su        |       |
+ * | ISO day of week (formatting)    | i       | 1, 2, 3, ..., 7                   | 7     |
+ * |                                 | io      | 1st, 2nd, ..., 7th                | 7     |
+ * |                                 | ii      | 01, 02, ..., 07                   | 7     |
+ * |                                 | iii     | Mon, Tue, Wed, ..., Sun           | 7     |
+ * |                                 | iiii    | Monday, Tuesday, ..., Sunday      | 2,7   |
+ * |                                 | iiiii   | M, T, W, T, F, S, S               | 7     |
+ * |                                 | iiiiii  | Mo, Tu, We, Th, Fr, Sa, Su        | 7     |
+ * | Local day of week (formatting)  | e       | 2, 3, 4, ..., 1                   |       |
+ * |                                 | eo      | 2nd, 3rd, ..., 1st                | 7     |
+ * |                                 | ee      | 02, 03, ..., 01                   |       |
+ * |                                 | eee     | Mon, Tue, Wed, ..., Sun           |       |
+ * |                                 | eeee    | Monday, Tuesday, ..., Sunday      | 2     |
+ * |                                 | eeeee   | M, T, W, T, F, S, S               |       |
+ * |                                 | eeeeee  | Mo, Tu, We, Th, Fr, Sa, Su        |       |
+ * | Local day of week (stand-alone) | c       | 2, 3, 4, ..., 1                   |       |
+ * |                                 | co      | 2nd, 3rd, ..., 1st                | 7     |
+ * |                                 | cc      | 02, 03, ..., 01                   |       |
+ * |                                 | ccc     | Mon, Tue, Wed, ..., Sun           |       |
+ * |                                 | cccc    | Monday, Tuesday, ..., Sunday      | 2     |
+ * |                                 | ccccc   | M, T, W, T, F, S, S               |       |
+ * |                                 | cccccc  | Mo, Tu, We, Th, Fr, Sa, Su        |       |
+ * | AM, PM                          | a..aa   | AM, PM                            |       |
+ * |                                 | aaa     | am, pm                            |       |
+ * |                                 | aaaa    | a.m., p.m.                        | 2     |
+ * |                                 | aaaaa   | a, p                              |       |
+ * | AM, PM, noon, midnight          | b..bb   | AM, PM, noon, midnight            |       |
+ * |                                 | bbb     | am, pm, noon, midnight            |       |
+ * |                                 | bbbb    | a.m., p.m., noon, midnight        | 2     |
+ * |                                 | bbbbb   | a, p, n, mi                       |       |
+ * | Flexible day period             | B..BBB  | at night, in the morning, ...     |       |
+ * |                                 | BBBB    | at night, in the morning, ...     | 2     |
+ * |                                 | BBBBB   | at night, in the morning, ...     |       |
+ * | Hour [1-12]                     | h       | 1, 2, ..., 11, 12                 |       |
+ * |                                 | ho      | 1st, 2nd, ..., 11th, 12th         | 7     |
+ * |                                 | hh      | 01, 02, ..., 11, 12               |       |
+ * | Hour [0-23]                     | H       | 0, 1, 2, ..., 23                  |       |
+ * |                                 | Ho      | 0th, 1st, 2nd, ..., 23rd          | 7     |
+ * |                                 | HH      | 00, 01, 02, ..., 23               |       |
+ * | Hour [0-11]                     | K       | 1, 2, ..., 11, 0                  |       |
+ * |                                 | Ko      | 1st, 2nd, ..., 11th, 0th          | 7     |
+ * |                                 | KK      | 01, 02, ..., 11, 00               |       |
+ * | Hour [1-24]                     | k       | 24, 1, 2, ..., 23                 |       |
+ * |                                 | ko      | 24th, 1st, 2nd, ..., 23rd         | 7     |
+ * |                                 | kk      | 24, 01, 02, ..., 23               |       |
+ * | Minute                          | m       | 0, 1, ..., 59                     |       |
+ * |                                 | mo      | 0th, 1st, ..., 59th               | 7     |
+ * |                                 | mm      | 00, 01, ..., 59                   |       |
+ * | Second                          | s       | 0, 1, ..., 59                     |       |
+ * |                                 | so      | 0th, 1st, ..., 59th               | 7     |
+ * |                                 | ss      | 00, 01, ..., 59                   |       |
+ * | Fraction of second              | S       | 0, 1, ..., 9                      |       |
+ * |                                 | SS      | 00, 01, ..., 99                   |       |
+ * |                                 | SSS     | 000, 001, ..., 999                |       |
+ * |                                 | SSSS    | ...                               | 3     |
+ * | Timezone (ISO-8601 w/ Z)        | X       | -08, +0530, Z                     |       |
+ * |                                 | XX      | -0800, +0530, Z                   |       |
+ * |                                 | XXX     | -08:00, +05:30, Z                 |       |
+ * |                                 | XXXX    | -0800, +0530, Z, +123456          | 2     |
+ * |                                 | XXXXX   | -08:00, +05:30, Z, +12:34:56      |       |
+ * | Timezone (ISO-8601 w/o Z)       | x       | -08, +0530, +00                   |       |
+ * |                                 | xx      | -0800, +0530, +0000               |       |
+ * |                                 | xxx     | -08:00, +05:30, +00:00            | 2     |
+ * |                                 | xxxx    | -0800, +0530, +0000, +123456      |       |
+ * |                                 | xxxxx   | -08:00, +05:30, +00:00, +12:34:56 |       |
+ * | Timezone (GMT)                  | O...OOO | GMT-8, GMT+5:30, GMT+0            |       |
+ * |                                 | OOOO    | GMT-08:00, GMT+05:30, GMT+00:00   | 2     |
+ * | Timezone (specific non-locat.)  | z...zzz | GMT-8, GMT+5:30, GMT+0            | 6     |
+ * |                                 | zzzz    | GMT-08:00, GMT+05:30, GMT+00:00   | 2,6   |
+ * | Seconds timestamp               | t       | 512969520                         | 7     |
+ * |                                 | tt      | ...                               | 3,7   |
+ * | Milliseconds timestamp          | T       | 512969520900                      | 7     |
+ * |                                 | TT      | ...                               | 3,7   |
+ * | Long localized date             | P       | 04/29/1453                        | 7     |
+ * |                                 | PP      | Apr 29, 1453                      | 7     |
+ * |                                 | PPP     | April 29th, 1453                  | 7     |
+ * |                                 | PPPP    | Friday, April 29th, 1453          | 2,7   |
+ * | Long localized time             | p       | 12:00 AM                          | 7     |
+ * |                                 | pp      | 12:00:00 AM                       | 7     |
+ * |                                 | ppp     | 12:00:00 AM GMT+2                 | 7     |
+ * |                                 | pppp    | 12:00:00 AM GMT+02:00             | 2,7   |
+ * | Combination of date and time    | Pp      | 04/29/1453, 12:00 AM              | 7     |
+ * |                                 | PPpp    | Apr 29, 1453, 12:00:00 AM         | 7     |
+ * |                                 | PPPppp  | April 29th, 1453 at ...           | 7     |
+ * |                                 | PPPPpppp| Friday, April 29th, 1453 at ...   | 2,7   |
+ * Notes:
+ * 1. "Formatting" units (e.g. formatting quarter) in the default en-US locale
+ *    are the same as "stand-alone" units, but are different in some languages.
+ *    "Formatting" units are declined according to the rules of the language
+ *    in the context of a date. "Stand-alone" units are always nominative singular:
+ *
+ *    `format(new Date(2017, 10, 6), 'do LLLL', {locale: cs}) //=> '6. listopad'`
+ *
+ *    `format(new Date(2017, 10, 6), 'do MMMM', {locale: cs}) //=> '6. listopadu'`
+ *
+ * 2. Any sequence of the identical letters is a pattern, unless it is escaped by
+ *    the single quote characters (see below).
+ *    If the sequence is longer than listed in table (e.g. `EEEEEEEEEEE`)
+ *    the output will be the same as default pattern for this unit, usually
+ *    the longest one (in case of ISO weekdays, `EEEE`). Default patterns for units
+ *    are marked with "2" in the last column of the table.
+ *
+ *    `format(new Date(2017, 10, 6), 'MMM') //=> 'Nov'`
+ *
+ *    `format(new Date(2017, 10, 6), 'MMMM') //=> 'November'`
+ *
+ *    `format(new Date(2017, 10, 6), 'MMMMM') //=> 'N'`
+ *
+ *    `format(new Date(2017, 10, 6), 'MMMMMM') //=> 'November'`
+ *
+ *    `format(new Date(2017, 10, 6), 'MMMMMMM') //=> 'November'`
+ *
+ * 3. Some patterns could be unlimited length (such as `yyyyyyyy`).
+ *    The output will be padded with zeros to match the length of the pattern.
+ *
+ *    `format(new Date(2017, 10, 6), 'yyyyyyyy') //=> '00002017'`
+ *
+ * 4. `QQQQQ` and `qqqqq` could be not strictly numerical in some locales.
+ *    These tokens represent the shortest form of the quarter.
+ *
+ * 5. The main difference between `y` and `u` patterns are B.C. years:
+ *
+ *    | Year | `y` | `u` |
+ *    |------|-----|-----|
+ *    | AC 1 |   1 |   1 |
+ *    | BC 1 |   1 |   0 |
+ *    | BC 2 |   2 |  -1 |
+ *
+ *    Also `yy` always returns the last two digits of a year,
+ *    while `uu` pads single digit years to 2 characters and returns other years unchanged:
+ *
+ *    | Year | `yy` | `uu` |
+ *    |------|------|------|
+ *    | 1    |   01 |   01 |
+ *    | 14   |   14 |   14 |
+ *    | 376  |   76 |  376 |
+ *    | 1453 |   53 | 1453 |
+ *
+ *    The same difference is true for local and ISO week-numbering years (`Y` and `R`),
+ *    except local week-numbering years are dependent on `options.weekStartsOn`
+ *    and `options.firstWeekContainsDate` (compare [getISOWeekYear]{@link https://date-fns.org/docs/getISOWeekYear}
+ *    and [getWeekYear]{@link https://date-fns.org/docs/getWeekYear}).
+ *
+ * 6. Specific non-location timezones are currently unavailable in `date-fns`,
+ *    so right now these tokens fall back to GMT timezones.
+ *
+ * 7. These patterns are not in the Unicode Technical Standard #35:
+ *    - `i`: ISO day of week
+ *    - `I`: ISO week of year
+ *    - `R`: ISO week-numbering year
+ *    - `t`: seconds timestamp
+ *    - `T`: milliseconds timestamp
+ *    - `o`: ordinal number modifier
+ *    - `P`: long localized date
+ *    - `p`: long localized time
+ *
+ * 8. `YY` and `YYYY` tokens represent week-numbering years but they are often confused with years.
+ *    You should enable `options.useAdditionalWeekYearTokens` to use them. See: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
+ *
+ * 9. `D` and `DD` tokens represent days of the year but they are often confused with days of the month.
+ *    You should enable `options.useAdditionalDayOfYearTokens` to use them. See: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
+ *
+ * @param {Date|Number} date - the original date
+ * @param {String} format - the string of tokens
+ * @param {Object} [options] - an object with options.
+ * @param {Locale} [options.locale=defaultLocale] - the locale object. See [Locale]{@link https://date-fns.org/docs/Locale}
+ * @param {0|1|2|3|4|5|6} [options.weekStartsOn=0] - the index of the first day of the week (0 - Sunday)
+ * @param {Number} [options.firstWeekContainsDate=1] - the day of January, which is
+ * @param {Boolean} [options.useAdditionalWeekYearTokens=false] - if true, allows usage of the week-numbering year tokens `YY` and `YYYY`;
+ *   see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
+ * @param {Boolean} [options.useAdditionalDayOfYearTokens=false] - if true, allows usage of the day of year tokens `D` and `DD`;
+ *   see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
+ * @returns {String} the formatted date string
+ * @throws {TypeError} 2 arguments required
+ * @throws {RangeError} `date` must not be Invalid Date
+ * @throws {RangeError} `options.locale` must contain `localize` property
+ * @throws {RangeError} `options.locale` must contain `formatLong` property
+ * @throws {RangeError} `options.weekStartsOn` must be between 0 and 6
+ * @throws {RangeError} `options.firstWeekContainsDate` must be between 1 and 7
+ * @throws {RangeError} use `yyyy` instead of `YYYY` for formatting years using [format provided] to the input [input provided]; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
+ * @throws {RangeError} use `yy` instead of `YY` for formatting years using [format provided] to the input [input provided]; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
+ * @throws {RangeError} use `d` instead of `D` for formatting days of the month using [format provided] to the input [input provided]; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
+ * @throws {RangeError} use `dd` instead of `DD` for formatting days of the month using [format provided] to the input [input provided]; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md
+ * @throws {RangeError} format string contains an unescaped latin alphabet character
+ *
+ * @example
+ * // Represent 11 February 2014 in middle-endian format:
+ * const result = format(new Date(2014, 1, 11), 'MM/dd/yyyy')
+ * //=> '02/11/2014'
+ *
+ * @example
+ * // Represent 2 July 2014 in Esperanto:
+ * import { eoLocale } from 'date-fns/locale/eo'
+ * const result = format(new Date(2014, 6, 2), "do 'de' MMMM yyyy", {
+ *   locale: eoLocale
+ * })
+ * //=> '2-a de julio 2014'
+ *
+ * @example
+ * // Escape string by single quote characters:
+ * const result = format(new Date(2014, 6, 2, 15), "h 'o''clock'")
+ * //=> "3 o'clock"
+ */
+
+function format(dirtyDate, dirtyFormatStr, options) {
+  var _ref, _options$locale, _ref2, _ref3, _ref4, _options$firstWeekCon, _options$locale2, _options$locale2$opti, _defaultOptions$local, _defaultOptions$local2, _ref5, _ref6, _ref7, _options$weekStartsOn, _options$locale3, _options$locale3$opti, _defaultOptions$local3, _defaultOptions$local4;
+  requiredArgs(2, arguments);
+  var formatStr = String(dirtyFormatStr);
+  var defaultOptions = getDefaultOptions();
+  var locale = (_ref = (_options$locale = options === null || options === void 0 ? void 0 : options.locale) !== null && _options$locale !== void 0 ? _options$locale : defaultOptions.locale) !== null && _ref !== void 0 ? _ref : defaultLocale;
+  var firstWeekContainsDate = toInteger((_ref2 = (_ref3 = (_ref4 = (_options$firstWeekCon = options === null || options === void 0 ? void 0 : options.firstWeekContainsDate) !== null && _options$firstWeekCon !== void 0 ? _options$firstWeekCon : options === null || options === void 0 ? void 0 : (_options$locale2 = options.locale) === null || _options$locale2 === void 0 ? void 0 : (_options$locale2$opti = _options$locale2.options) === null || _options$locale2$opti === void 0 ? void 0 : _options$locale2$opti.firstWeekContainsDate) !== null && _ref4 !== void 0 ? _ref4 : defaultOptions.firstWeekContainsDate) !== null && _ref3 !== void 0 ? _ref3 : (_defaultOptions$local = defaultOptions.locale) === null || _defaultOptions$local === void 0 ? void 0 : (_defaultOptions$local2 = _defaultOptions$local.options) === null || _defaultOptions$local2 === void 0 ? void 0 : _defaultOptions$local2.firstWeekContainsDate) !== null && _ref2 !== void 0 ? _ref2 : 1);
+
+  // Test if weekStartsOn is between 1 and 7 _and_ is not NaN
+  if (!(firstWeekContainsDate >= 1 && firstWeekContainsDate <= 7)) {
+    throw new RangeError('firstWeekContainsDate must be between 1 and 7 inclusively');
+  }
+  var weekStartsOn = toInteger((_ref5 = (_ref6 = (_ref7 = (_options$weekStartsOn = options === null || options === void 0 ? void 0 : options.weekStartsOn) !== null && _options$weekStartsOn !== void 0 ? _options$weekStartsOn : options === null || options === void 0 ? void 0 : (_options$locale3 = options.locale) === null || _options$locale3 === void 0 ? void 0 : (_options$locale3$opti = _options$locale3.options) === null || _options$locale3$opti === void 0 ? void 0 : _options$locale3$opti.weekStartsOn) !== null && _ref7 !== void 0 ? _ref7 : defaultOptions.weekStartsOn) !== null && _ref6 !== void 0 ? _ref6 : (_defaultOptions$local3 = defaultOptions.locale) === null || _defaultOptions$local3 === void 0 ? void 0 : (_defaultOptions$local4 = _defaultOptions$local3.options) === null || _defaultOptions$local4 === void 0 ? void 0 : _defaultOptions$local4.weekStartsOn) !== null && _ref5 !== void 0 ? _ref5 : 0);
+
+  // Test if weekStartsOn is between 0 and 6 _and_ is not NaN
+  if (!(weekStartsOn >= 0 && weekStartsOn <= 6)) {
+    throw new RangeError('weekStartsOn must be between 0 and 6 inclusively');
+  }
+  if (!locale.localize) {
+    throw new RangeError('locale must contain localize property');
+  }
+  if (!locale.formatLong) {
+    throw new RangeError('locale must contain formatLong property');
+  }
+  var originalDate = toDate(dirtyDate);
+  if (!isValid(originalDate)) {
+    throw new RangeError('Invalid time value');
+  }
+
+  // Convert the date in system timezone to the same date in UTC+00:00 timezone.
+  // This ensures that when UTC functions will be implemented, locales will be compatible with them.
+  // See an issue about UTC functions: https://github.com/date-fns/date-fns/issues/376
+  var timezoneOffset = getTimezoneOffsetInMilliseconds(originalDate);
+  var utcDate = subMilliseconds(originalDate, timezoneOffset);
+  var formatterOptions = {
+    firstWeekContainsDate: firstWeekContainsDate,
+    weekStartsOn: weekStartsOn,
+    locale: locale,
+    _originalDate: originalDate
+  };
+  var result = formatStr.match(longFormattingTokensRegExp).map(function (substring) {
+    var firstCharacter = substring[0];
+    if (firstCharacter === 'p' || firstCharacter === 'P') {
+      var longFormatter = longFormatters$1[firstCharacter];
+      return longFormatter(substring, locale.formatLong);
+    }
+    return substring;
+  }).join('').match(formattingTokensRegExp).map(function (substring) {
+    // Replace two single quote characters with one single quote character
+    if (substring === "''") {
+      return "'";
+    }
+    var firstCharacter = substring[0];
+    if (firstCharacter === "'") {
+      return cleanEscapedString(substring);
+    }
+    var formatter = formatters$1[firstCharacter];
+    if (formatter) {
+      if (!(options !== null && options !== void 0 && options.useAdditionalWeekYearTokens) && isProtectedWeekYearToken(substring)) {
+        throwProtectedError(substring, dirtyFormatStr, String(dirtyDate));
+      }
+      if (!(options !== null && options !== void 0 && options.useAdditionalDayOfYearTokens) && isProtectedDayOfYearToken(substring)) {
+        throwProtectedError(substring, dirtyFormatStr, String(dirtyDate));
+      }
+      return formatter(utcDate, substring, locale.localize, formatterOptions);
+    }
+    if (firstCharacter.match(unescapedLatinCharacterRegExp)) {
+      throw new RangeError('Format string contains an unescaped latin alphabet character `' + firstCharacter + '`');
+    }
+    return substring;
+  }).join('');
+  return result;
+}
+function cleanEscapedString(input) {
+  var matched = input.match(escapedStringRegExp);
+  if (!matched) {
+    return input;
+  }
+  return matched[1].replace(doubleQuoteRegExp, "'");
+}
+
+const tooltipCss = ":host{display:inline-flex;position:relative}.tooltip-wrapper{position:relative;display:inline-flex}.tooltip-content-wrapper{position:absolute;z-index:10;bottom:125%;left:50%;transform:translateX(-50%);opacity:0;visibility:hidden;transition:opacity 0.2s, visibility 0.2s}.tooltip-content-wrapper.visible{opacity:1;visibility:visible}.tooltip-content{background-color:var(--emw--tooltip-background-color, #000);color:var(--emw--tooltip-text-color, #fff);border-radius:4px;box-shadow:0 2px 8px rgba(0, 0, 0, 0.15);white-space:nowrap;padding:4px}";
+const AppTooltipStyle0 = tooltipCss;
+
+const Tooltip = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.show = () => (this.visible = true);
+        this.hide = () => (this.visible = false);
+        this.visible = false;
+    }
+    componentDidLoad() {
+        this.trigger = this.host.querySelector('[slot="trigger"]');
+        if (this.trigger) {
+            this.trigger.addEventListener('mouseenter', this.show);
+            this.trigger.addEventListener('mouseleave', this.hide);
+            this.trigger.addEventListener('focus', this.show);
+            this.trigger.addEventListener('blur', this.hide);
+        }
+    }
+    disconnectedCallback() {
+        if (this.trigger) {
+            this.trigger.removeEventListener('mouseenter', this.show);
+            this.trigger.removeEventListener('mouseleave', this.hide);
+            this.trigger.removeEventListener('focus', this.show);
+            this.trigger.removeEventListener('blur', this.hide);
+        }
+    }
+    render() {
+        return (h("div", { key: 'e56695ac60fcd7903127179423e9954ef40f05c0', class: "tooltip-wrapper" }, h("slot", { key: '4e2472a395ceeb2b911692739d326c031df07e29', name: "trigger" }), h("div", { key: 'f77bd72da94eb17d12e42ebb86c395c55801b728', class: { 'tooltip-content-wrapper': true, visible: this.visible } }, h("div", { key: '988399e2b42988622d46eaf255f17c6221eb9697', class: "tooltip-content" }, h("slot", { key: '05de0572ab1331d965e61947c5c15775e225197a', name: "content" })))));
+    }
+    get host() { return getElement(this); }
+};
+Tooltip.style = AppTooltipStyle0;
+
+const helperCountDownCss = ":host{display:block}.helper-count-down-container{display:flex;align-items:center}.helper-count-down-prefix{margin-right:4px}.helper-count-down-suffix{margin-left:4px}.helper-count-down-values{display:flex;align-items:center}.helper-count-down-item{display:flex;align-items:center;justify-content:center}.helper-count-down-item-num{font-variant-numeric:tabular-nums}";
+const HelperCountDownStyle0 = helperCountDownCss;
+
+const HelperCountDown = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.countDownChange = createEvent(this, "countDownChange", 7);
+        this.countDownFinish = createEvent(this, "countDownFinish", 7);
+        this.value = undefined;
+        this.format = 'HH:mm:ss';
+        this.prefix = undefined;
+        this.suffix = undefined;
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.endTime = undefined;
+        this.timeObj = {
+            day: { str: '00', unit: '' },
+            hour: { str: '00', unit: '' },
+            minute: { str: '00', unit: '' },
+            second: { str: '00', unit: '' }
+        };
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    handleValueChange(newValue) {
+        this.setEndTime(newValue);
+        if (newValue) {
+            this.startCountDown();
+        }
+        else {
+            this.clearCountDown();
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+        this.setEndTime(this.value);
+        if (this.value)
+            this.startCountDown();
+    }
+    setEndTime(value) {
+        if (typeof value === 'string') {
+            // If it's a string, parse it and get the milliseconds
+            const time = parseISO(value).getTime();
+            this.endTime = isNaN(time) ? null : time;
+        }
+        else {
+            // If it's a number, use it directly
+            this.endTime = value;
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+        this.clearCountDown();
+    }
+    startCountDown() {
+        this.clearCountDown();
+        this.tick();
+        this.timer = setInterval(() => {
+            this.tick();
+        }, 1000);
+    }
+    clearCountDown() {
+        if (this.timer) {
+            clearInterval(this.timer);
+            this.timer = null;
+        }
+    }
+    tick() {
+        if (!this.endTime)
+            return;
+        let leftTime = this.endTime - Date.now();
+        if (leftTime <= 0) {
+            leftTime = 0;
+            this.clearCountDown();
+            this.countDownFinish.emit();
+        }
+        const d = Math.floor(leftTime / (1000 * 60 * 60 * 24));
+        const h = Math.floor((leftTime / (1000 * 60 * 60)) % 24);
+        const m = Math.floor((leftTime / 1000 / 60) % 60);
+        const s = Math.floor((leftTime / 1000) % 60);
+        const pad = (n) => (n < 10 ? `0${n}` : `${n}`);
+        this.timeObj = {
+            day: { str: pad(d), unit: 'd' },
+            hour: { str: pad(h), unit: 'h' },
+            minute: { str: pad(m), unit: 'm' },
+            second: { str: pad(s), unit: 's' }
+        };
+        const formatTime = this.getFormatTime();
+        this.countDownChange.emit({ leftTime, formatTime, legalTime: formatTime });
+    }
+    getFormatTime() {
+        return this.format
+            .replace('DD', this.timeObj.day.str)
+            .replace('HH', this.timeObj.hour.str)
+            .replace('mm', this.timeObj.minute.str)
+            .replace('ss', this.timeObj.second.str);
+    }
+    renderItems() {
+        const regex = /(DD|HH|mm|ss)|([\s\S]+?)(?=(DD|HH|mm|ss)|$)/g;
+        const items = [];
+        let match;
+        while ((match = regex.exec(this.format)) !== null) {
+            if (match[1]) {
+                let val = '';
+                switch (match[1]) {
+                    case 'DD':
+                        val = this.timeObj.day.str;
+                        break;
+                    case 'HH':
+                        val = this.timeObj.hour.str;
+                        break;
+                    case 'mm':
+                        val = this.timeObj.minute.str;
+                        break;
+                    case 'ss':
+                        val = this.timeObj.second.str;
+                        break;
+                }
+                items.push({ val, unit: '' });
+            }
+            else if (match[2]) {
+                if (items.length > 0) {
+                    items[items.length - 1].unit = match[2];
+                }
+            }
+        }
+        return items.map((item, index) => {
+            return (h("div", { key: index + item.unit, class: "helper-count-down-item", part: "item" }, h("div", { class: "helper-count-down-item-num" }, item.val), h("div", { class: "helper-count-down-item-unit" }, item.unit)));
+        });
+    }
+    render() {
+        return (h("div", { key: 'b360412e045020b5ac0263c6ca56458f31eedb2c', class: "helper-count-down-container", ref: (el) => (this.stylingContainer = el) }, h("slot", { key: 'c72bed87fba869c842407b04e0cbfe038e5b7ea8' }), this.prefix && h("div", { key: '8d3ba9d60577421f81bae7bc76f52a774b17e1fe', class: "helper-count-down-prefix" }, this.prefix), h("div", { key: '187edf3b8eb6de85efe1a748fd8ef47a68e19611', class: "helper-count-down-values", part: "values" }, this.renderItems()), this.suffix && h("div", { key: '3a8e5d9561ecd3f52eff423bd43c8b60a261a17c', class: "helper-count-down-suffix" }, this.suffix)));
+    }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"],
+        "value": ["handleValueChange"]
+    }; }
+};
+HelperCountDown.style = HelperCountDownStyle0;
+
+const DEFAULT_LANGUAGE$4 = 'en';
+const SUPPORTED_LANGUAGES$4 = ['ro', 'en', 'fr', 'ar', 'hr'];
+const TRANSLATIONS$4 = {
+    en: {
+        stop: 'Stop',
+        at: 'at',
+        turnover: 'Turnover: ',
+        startIn: 'Sales Start in:',
+    },
+    ro: {
+        stop: 'Oprește',
+        at: 'la'
+    },
+    fr: {
+        stop: 'Arrêtez',
+        at: 'à'
+    },
+    ar: {
+        stop: 'توقف',
+        at: 'في'
+    },
+    hr: {
+        stop: 'Stop',
+        at: 'u'
+    }
+};
+const translate$4 = (key, customLang) => {
+    const lang = customLang;
+    return TRANSLATIONS$4[lang !== undefined && SUPPORTED_LANGUAGES$4.includes(lang) ? lang : DEFAULT_LANGUAGE$4][key];
+};
+const getTranslations$4 = (data) => {
+    Object.keys(data).forEach((item) => {
+        for (let key in data[item]) {
+            TRANSLATIONS$4[item][key] = data[item][key];
+        }
+    });
+};
+const resolveTranslationUrl$3 = async (translationUrl) => {
+    if (translationUrl) {
+        try {
+            const response = await fetch(translationUrl);
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            const translations = await response.json();
+            getTranslations$4(translations);
+        }
+        catch (error) {
+            console.error('Failed to fetch or parse translations from URL:', error);
+        }
+    }
+};
+
+const lotteryBannerCss = ":host {\n  display: block;\n  container-type: inline-size;\n}\n\n.lottery-banner {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--lottery-banner-gap, 0.5rem);\n  padding: var(--lottery-banner-padding, 0px 20px);\n  background: var(--lottery-banner-background, var(--emw--color-primary, #fed275));\n  border-top: var(--lottery-banner-border-width, 2px) var(--lottery-banner-border-style, solid) var(--lottery-banner-border-color, var(--emw--color-primary, #fed275));\n  border-bottom: var(--lottery-banner-border-width, 2px) var(--lottery-banner-border-style, solid) var(--lottery-banner-border-color, var(--emw--color-primary, #fed275));\n  border-left: var(--lottery-banner-border-left, none);\n  border-right: var(--lottery-banner-border-right, none);\n  border-radius: var(--lottery-banner-border-radius, 0);\n  white-space: nowrap;\n  height: var(--lottery-banner-height, 50px);\n  position: relative;\n  box-sizing: border-box;\n}\n\n.lottery-banner__logo-wrapper {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n}\n.lottery-banner__logo-wrapper img {\n  height: 100%;\n  max-width: 32vw;\n  object-fit: var(--lottery-banner-logo-object-fit, contain);\n}\n\n.lottery-banner__item--center {\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n}\n\n.lottery-banner__title {\n  text-align: center;\n  font-size: var(--lottery-banner-title-font-size, 1.5rem);\n  font-weight: 800;\n  font-style: italic;\n  letter-spacing: var(--lottery-banner-title-font-letter-spacing, 0.04em);\n  color: var(--emw--color-typography, #000);\n}\n\n.lottery-banner__info {\n  display: flex;\n  align-items: center;\n  gap: var(--lottery-banner-info-gap, 0.75rem);\n}\n\n.lottery-banner__info-item {\n  font-size: var(--lottery-banner-info-font-size, 0.9rem);\n  color: var(--lottery-banner-info-color, var(--emw--color-typography, #000));\n  display: inline-flex;\n  align-items: center;\n  gap: 0.3rem;\n}\n\n.lottery-banner__info-item-label {\n  color: var(--lottery-banner-info-label-color, var(--emw--color-typography, #000));\n}\n.lottery-banner__info-item-label__strong {\n  font-weight: var(--lottery-banner-info-label-font-weight, 700);\n}\n\n.lottery-banner__info-item-value {\n  font-weight: var(--lottery-banner-info-value-font-weight, inherit);\n  color: var(--lottery-banner-info-value-color, var(--emw--color-typography, #000));\n}\n.lottery-banner__info-item-value__strong {\n  font-weight: var(--lottery-banner-info-label-font-weight, 700);\n}\n\nhelper-count-down::part(values) {\n  gap: 8px;\n}\n\n@container (max-width: 700px) {\n  .lottery-banner {\n    height: auto;\n    padding: var(--lottery-banner-mobile-padding, 0.5rem 0.2rem);\n  }\n  .lottery-banner__title {\n    flex-basis: 100%;\n    text-align: var(--lottery-banner-mobile-title-text-align, left);\n    font-size: var(--emw--font-size-small, 0.875rem);\n  }\n  .lottery-banner__info {\n    flex-direction: column;\n    align-items: flex-start;\n    gap: var(--lottery-banner-mobile-info-gap, 0.1rem);\n  }\n  .lottery-banner__info-item {\n    font-size: var(--emw--font-size-x-small, 0.75rem);\n  }\n}";
+const LotteryBannerStyle0 = lotteryBannerCss;
+
+const LotteryBanner = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.lotteryBannerWagerStarted = createEvent(this, "lotteryBannerWagerStarted", 7);
+        this.handleCountdownFinish = () => {
+            this.isWagerStarted = true;
+            this.lotteryBannerWagerStarted.emit();
+        };
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.translationUrl = '';
+        this.language = 'en';
+        this.logoUrl = undefined;
+        this.stopTime = '';
+        this.startTime = '';
+        this.bannerTitle = undefined;
+        this.turnover = undefined;
+        this.layout = 'logo,title,info';
+        this.isWagerStarted = false;
+        this.formattedStopTime = undefined;
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue !== oldValue) {
+            setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue !== oldValue) {
+            setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue !== oldValue) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    handleTimeChange() {
+        this.checkWagerStatus();
+    }
+    async componentWillLoad() {
+        if (this.translationUrl) {
+            resolveTranslationUrl$3(this.translationUrl);
+        }
+        this.checkWagerStatus();
+    }
+    checkWagerStatus() {
+        if (this.startTime && isBefore(new Date(), parseISO(this.startTime))) {
+            this.isWagerStarted = false;
+        }
+        else {
+            this.isWagerStarted = true;
+        }
+        if (this.stopTime) {
+            this.formattedStopTime = format(parseISO(this.stopTime), 'dd/MM/yyyy HH:mm');
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    renderElement(item, className = '') {
+        const poolGameLogo = getAssetPath('../static/poolGameLogo.webp');
+        switch (item) {
+            case 'logo':
+                return (h("div", { class: `lottery-banner__logo-wrapper ${className}` }, poolGameLogo && h("img", { alt: "logo", src: poolGameLogo, class: "lottery-banner__logo" })));
+            case 'title':
+                return this.bannerTitle && h("div", { class: `lottery-banner__title ${className}` }, this.bannerTitle);
+            case 'info':
+                return (h("div", { class: `lottery-banner__info ${className}` }, !this.isWagerStarted ? (h("div", { class: "lottery-banner__info-item" }, h("span", { class: "lottery-banner__info-item-label" }, h("span", { class: "lottery-banner__info-item-label__strong" }, translate$4('startIn', this.language)), "\u00A0"), h("helper-count-down", { class: "lottery-banner__info-item-value lottery-banner__info-item-value__strong", value: this.startTime, format: "DDD HHH mmM ssS", onCountDownFinish: this.handleCountdownFinish }))) : (h("div", { class: "lottery-banner__info-item" }, h("span", { class: "lottery-banner__info-item-label" }, h("span", { class: "lottery-banner__info-item-label__strong" }, translate$4('stop', this.language)), "\u00A0", translate$4('at', this.language)), h("span", { class: "lottery-banner__info-item-value" }, this.formattedStopTime))), this.isWagerStarted && this.turnover !== null && this.turnover !== undefined && (h("div", { class: "lottery-banner__info-item" }, h("span", { class: "lottery-banner__info-item-label" }, translate$4('turnover', this.language)), h("span", { class: "lottery-banner__info-item-value" }, this.turnover)))));
+            default:
+                return null;
+        }
+    }
+    render() {
+        const layoutItems = this.layout.split(',').map((item) => item.trim());
+        return (h("section", { key: '8714d4136821b8afd6079da769bb9cc94149ed9d', ref: (el) => (this.stylingContainer = el), class: "lottery-banner" }, layoutItems.map((item, index) => {
+            const isMiddle = layoutItems.length === 3 && index === 1;
+            const className = isMiddle ? 'lottery-banner__item--center' : '';
+            return this.renderElement(item, className);
+        })));
+    }
+    static get assetsDirs() { return ["../static"]; }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"],
+        "startTime": ["handleTimeChange"],
+        "stopTime": ["handleTimeChange"]
+    }; }
+};
+LotteryBanner.style = LotteryBannerStyle0;
+
+const DEFAULT_LANGUAGE$3 = 'en';
+const SUPPORTED_LANGUAGES$3 = ['ro', 'en', 'fr', 'ar', 'hr', 'zh'];
+const TRANSLATIONS$3 = {
+    en: {
+        loading: 'Loading'
+    },
+    ro: {},
+    fr: {},
+    ar: {},
+    hr: {}
+};
+const translate$3 = (key, customLang, replacements) => {
+    const lang = customLang;
+    let translation = TRANSLATIONS$3[lang !== undefined && SUPPORTED_LANGUAGES$3.includes(lang) ? lang : DEFAULT_LANGUAGE$3][key];
+    if (replacements) {
+        Object.keys(replacements).forEach((placeholder) => {
+            translation = translation.replace(`{${placeholder}}`, replacements[placeholder]);
+        });
+    }
+    return translation;
+};
+const getTranslations$3 = (data) => {
+    Object.keys(data).forEach((item) => {
+        for (let key in data[item]) {
+            TRANSLATIONS$3[item][key] = data[item][key];
+        }
+    });
+};
+const resolveTranslationUrl$2 = async (translationUrl) => {
+    if (translationUrl) {
+        try {
+            const response = await fetch(translationUrl);
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            const translations = await response.json();
+            getTranslations$3(translations);
+        }
+        catch (error) {
+            console.error('Failed to fetch or parse translations from URL:', error);
+        }
+    }
+};
+
+const lotteryButtonCss = ":host{display:inline-block}.btn{font:inherit;position:relative;display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;border-radius:var(--lottery-button-border-radius, 6px);font-weight:var(--lottery-button-font-weight, 500);cursor:pointer;outline:none;overflow:hidden;transition:var(--lottery-button-transition, background-color 0.2s, border-color 0.2s, color 0.2s, box-shadow 0.2s);user-select:none;-webkit-tap-highlight-color:transparent;box-shadow:var(--lottery-button-box-shadow, 0 2px 4px 0 rgba(0, 0, 0, 0.5))}.btn .content{position:relative;display:inline-flex;align-items:center;gap:var(--lottery-button-content-gap, 0.5em)}.btn .content ::slotted(span){display:inline-flex;align-items:center}.btn:hover:not(:disabled){box-shadow:var(--lottery-button-hover-box-shadow, 0 4px 8px 0 rgba(0, 0, 0, 0.5))}.btn:disabled{cursor:not-allowed;opacity:var(--lottery-button-disabled-opacity, 0.5)}.btn .loading-container{display:flex;align-items:center}.btn--loading{position:relative}.btn .spinner{display:inline-block;width:1em;height:1em;border:var(--lottery-button-spinner-border, 2px solid rgba(255, 255, 255, 0.3));border-radius:50%;border-top-color:var(--lottery-button-spinner-color, white);animation:spin 1s ease-in-out infinite;margin-left:0.5em;vertical-align:middle}.btn--small .spinner{width:0.8em;height:0.8em}.btn--large .spinner{width:1.2em;height:1.2em}@keyframes spin{to{transform:rotate(360deg)}}.btn--primary{background-color:var(--emw--color-primary, #0d196e);color:var(--emw--color-typography-inverse, #fff)}.btn--primary:hover:not(:disabled){background-color:var(--emw--color-primary-variant, #1367e7)}.btn--primary:active:not(:disabled){background-color:var(--lottery-button-primary-active-bg, #08104a)}.btn--outline .spinner,.btn--dashed .spinner,.btn--text .spinner{border-top-color:currentColor;border-color:var(--lottery-button-spinner-inverse-border-color, rgba(0, 0, 0, 0.2))}.btn--outline{background-color:var(--emw--color-background, #fff);border-color:var(--lottery-button-outline-border-color, #dcdcdc);color:var(--emw--color-typography, #000)}.btn--outline:hover:not(:disabled){background-color:var(--emw--color-background-tertiary, #ccc);border-color:var(--lottery-button-outline-hover-border-color, #a6a6a6)}.btn--outline:active:not(:disabled){background-color:var(--lottery-button-outline-active-bg, #e6e6e6)}.btn--dashed{background-color:transparent;border-style:dashed;border-color:var(--lottery-button-dashed-border-color, #dcdcdc);color:var(--lottery-button-dashed-color, #333)}.btn--dashed:hover:not(:disabled){border-color:var(--lottery-button-dashed-hover-border-color, #a6a6a6);color:var(--lottery-button-dashed-hover-color, #0052d9)}.btn--text{background-color:transparent;color:var(--lottery-button-text-color, #0052d9);border-color:transparent}.btn--text:hover:not(:disabled){background-color:var(--lottery-button-text-hover-bg, #f2f2f2)}.btn--text:active:not(:disabled){background-color:var(--lottery-button-text-active-bg, #e6e6e6)}.btn--custom-color:hover:not(:disabled){opacity:var(--lottery-button-custom-hover-opacity, 0.9)}.btn--custom-color:active:not(:disabled){opacity:var(--lottery-button-custom-active-opacity, 0.8)}.btn--small{height:var(--lottery-button-small-height, 28px);font-size:var(--lottery-button-small-font-size, 12px);padding:var(--lottery-button-small-padding, 0 12px)}.btn--medium{height:var(--lottery-button-medium-height, 34px);font-size:var(--lottery-button-medium-font-size, 14px);padding:var(--lottery-button-medium-padding, 0 18px)}.btn--large{height:var(--lottery-button-large-height, 40px);font-size:var(--lottery-button-large-font-size, 16px);padding:var(--lottery-button-large-padding, 0 24px)}.ripple-container{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;pointer-events:none;border-radius:inherit}.ripple{position:absolute;border-radius:50%;background-color:var(--lottery-button-ripple-light, rgba(255, 255, 255, 0.3));transform:scale(0);animation:ripple-animation 600ms linear}.btn--outline .ripple,.btn--dashed .ripple,.btn--text .ripple{background-color:var(--lottery-button-ripple-dark, rgba(0, 0, 0, 0.03))}@keyframes ripple-animation{to{transform:scale(4);opacity:0}}";
+const LotteryButtonStyle0 = lotteryButtonCss;
+
+const LotteryButton = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.handleClick = (event) => {
+            if (this.disabled) {
+                return;
+            }
+            // Get the button element from the shadow root
+            const button = this.host.shadowRoot.querySelector('.btn');
+            if (!button)
+                return;
+            const rect = button.getBoundingClientRect();
+            const size = Math.max(rect.width, rect.height);
+            const top = event.clientY - rect.top - size / 2;
+            const left = event.clientX - rect.left - size / 2;
+            // Add the new ripple to the state, triggering a re-render
+            const newRipple = { top, left, size };
+            this.ripples = [...this.ripples, newRipple];
+            // Set a timeout to clean up the ripple from the state after the animation ends
+            // This prevents the DOM from filling up with old ripple elements
+            setTimeout(() => {
+                this.ripples = this.ripples.filter((r) => r !== newRipple);
+            }, 600); // This duration should match the CSS animation duration
+        };
+        this.variant = 'primary';
+        this.size = 'medium';
+        this.color = undefined;
+        this.disabled = false;
+        this.loading = false;
+        this.text = undefined;
+        this.mbSource = undefined;
+        this.language = 'en';
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.translationUrl = '';
+        this.ripples = [];
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    componentWillLoad() {
+        if (this.translationUrl) {
+            resolveTranslationUrl$2(this.translationUrl);
+        }
+    }
+    render() {
+        const { variant, disabled, size, color } = this;
+        const isDisabled = disabled || this.loading;
+        // Calculate styles based on variant and color
+        const buttonStyles = {};
+        if (color) {
+            switch (variant) {
+                case 'primary':
+                    Object.assign(buttonStyles, {
+                        backgroundColor: color,
+                        borderColor: color
+                    });
+                    break;
+                case 'outline':
+                case 'dashed':
+                    Object.assign(buttonStyles, {
+                        color: color,
+                        borderColor: color
+                    });
+                    break;
+                case 'text':
+                    Object.assign(buttonStyles, {
+                        color: color
+                    });
+                    break;
+                default:
+                    Object.assign(buttonStyles, {
+                        backgroundColor: color,
+                        borderColor: color
+                    });
+            }
+        }
+        return (h("button", { key: 'aa74ad98c90e7548228557bf8a8d26b125d4a83a', class: {
+                btn: true,
+                [`btn--${variant}`]: true,
+                [`btn--${size}`]: true,
+                'btn--loading': this.loading
+            }, style: color ? buttonStyles : undefined, disabled: isDisabled, onClick: this.handleClick, ref: (el) => (this.stylingContainer = el) }, this.loading ? (h("div", { class: "loading-container" }, h("span", { class: "content" }, this.text || translate$3('loading', this.language)), h("span", { class: "spinner" }))) : (h("span", { class: "content" }, h("slot", { name: "icon-left" }), this.text || h("slot", null), h("slot", { name: "icon-right" }))), h("div", { key: '302ea02be395bb24989d4abc040a513e23fa029a', class: "ripple-container" }, this.ripples.map((ripple, index) => (h("span", { key: index, class: "ripple", style: {
+                top: `${ripple.top}px`,
+                left: `${ripple.left}px`,
+                width: `${ripple.size}px`,
+                height: `${ripple.size}px`
+            } }))))));
+    }
+    get host() { return getElement(this); }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"]
+    }; }
+};
+LotteryButton.style = LotteryButtonStyle0;
+
+const generateUUID = () => {
+    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
+        var r = (Math.random() * 16) | 0, v = c == 'x' ? r : (r & 0x3) | 0x8;
+        return v.toString(16);
+    });
+};
+function fetchRequest(url, method = 'GET', body = null, headers = {}) {
+    return new Promise((resolve, reject) => {
+        const uuid = generateUUID();
+        const headersOrigin = Object.assign({ 'Content-Type': 'application/json' }, headers);
+        if (method !== 'GET' && method !== 'HEAD') {
+            headersOrigin['X-Idempotency-Key'] = uuid;
+        }
+        const options = {
+            method,
+            headers: headersOrigin,
+            body: null
+        };
+        if (body && method !== 'GET' && method !== 'HEAD') {
+            options.body = JSON.stringify(body);
+        }
+        else {
+            delete options.body;
+        }
+        fetch(url, options)
+            .then((response) => {
+            if (!response.ok) {
+                return reject(response);
+            }
+            return response.json();
+        })
+            .then((data) => resolve(data))
+            .catch((error) => reject(error));
+    });
+}
+
+var TicketStatus;
+(function (TicketStatus) {
+    TicketStatus["PURCHASED"] = "Purchased";
+    TicketStatus["SETTLED"] = "Settled";
+    TicketStatus["CANCELED"] = "Canceled";
+    TicketStatus["ERROR"] = "Error";
+})(TicketStatus || (TicketStatus = {}));
+
+const lotteryOrderSummaryCss = ":host{width:100%}.order-summary{width:100%;background:var(--emw--color-background, #fff);border-radius:var(--lottery-order-summary-border-radius, 8px);border:var(--lottery-order-summary-border, none);box-shadow:var(--lottery-order-summary-box-shadow, none);box-sizing:border-box}.order-summary__title{margin:var(--lottery-order-summary-title-margin, 0 0 30px 0);text-align:var(--lottery-order-summary-title-text-align, center);color:var(--emw--color-typography, #000);text-transform:uppercase;font-weight:var(--lottery-order-summary-title-font-weight, 700)}.order-summary__ticket-info{display:flex;align-items:center;margin-bottom:var(--lottery-order-summary-row-gap, 16px);gap:var(--lottery-order-summary-col-gap, 10px);color:var(--emw--color-typography, #000)}.order-summary__ticket-label{display:flex;flex-direction:row;align-items:center;width:var(--lottery-order-summary-label-width, 50px);max-width:var(--lottery-order-summary-label-max-width, 100%);flex-shrink:0}.order-summary__colon{margin-left:2px}.order-summary__ticket{font-weight:var(--lottery-order-summary-label-font-weight, 500);color:var(--emw--color-typography, #000);overflow-wrap:break-word}.order-summary__details{display:flex;align-items:center;color:var(--emw--color-typography, #000);font-weight:var(--lottery-order-summary-details-font-weight, 400)}.order-summary__divider{border:none;border-top:var(--lottery-order-summary-divider-border, 1px solid var(--emw--color-gray-100, #e6e6e6));margin:var(--lottery-order-summary-divider-margin, 20px 0)}.order-summary__button-wrapper{display:flex;justify-content:center;margin:var(--lottery-order-summary-button-wrapper-margin, 0);padding:var(--lottery-order-summary-button-wrapper-padding, 0)}";
+const LotteryOrderSummaryStyle0 = lotteryOrderSummaryCss;
+
+const LotteryOrderSummary = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.orderSummarySubmit = createEvent(this, "orderSummarySubmit", 7);
+        this.submitSuccess = createEvent(this, "lotteryTicketSubmitSuccess", 7);
+        this.submitError = createEvent(this, "lotteryTicketSubmitError", 7);
+        this.sessionExpired = createEvent(this, "sessionExpired", 7);
+        this.endpoint = undefined;
+        this.sessionId = undefined;
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.language = 'en';
+        this.orderSummaryTitle = undefined;
+        this.ticketsLabel = undefined;
+        this.totalLabel = undefined;
+        this.showColon = true;
+        this.showDivider = false;
+        this.submitDisabled = false;
+        this.submitButtonText = undefined;
+        this.submitLoading = false;
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    handleLotteryTicketParamsReady(event) {
+        if (event.detail && this.isValidTicketSubmitParam(event.detail)) {
+            this.handleSubmitTickets(event.detail);
+        }
+        else {
+            const errorMessage = 'Invalid ticket data received before submission.';
+            console.error(errorMessage, event.detail);
+            this.submitError.emit({
+                message: errorMessage,
+                dataOrigin: event.detail,
+                status: 400 // Bad Request
+            });
+        }
+    }
+    isValidTicketSubmitParam(detail) {
+        return (detail &&
+            Array.isArray(detail.tickets) &&
+            detail.tickets.length > 0 &&
+            detail.tickets.every((ticket) => this.isValidTicketParam(ticket)));
+    }
+    isValidTicketParam(ticket) {
+        return (ticket &&
+            ticket.gameName !== undefined &&
+            ticket.startingDrawId !== undefined &&
+            ticket.amount !== undefined &&
+            ticket.currency !== undefined &&
+            ticket.selection !== undefined);
+    }
+    async handleSubmitTickets(body) {
+        try {
+            this.submitLoading = true;
+            const res = await fetchRequest(`${this.endpoint}/tickets`, 'POST', body, {
+                Authorization: `Bearer ${this.sessionId}`
+            });
+            if (!res.tickets.every((ticket) => ticket.state === TicketStatus.PURCHASED)) {
+                this.submitError.emit({
+                    message: 'Failed to purchase ticket',
+                    dataOrigin: res,
+                    status: 200
+                });
+            }
+            else {
+                this.submitSuccess.emit({
+                    dataOrigin: res,
+                    status: 200
+                });
+            }
+        }
+        catch (e) {
+            if (e.status === 401) {
+                this.sessionExpired.emit();
+            }
+            if (e.status > 300 || !e.status) {
+                this.submitError.emit({
+                    dataOrigin: e,
+                    status: e.status || 0
+                });
+            }
+        }
+        finally {
+            this.submitLoading = false;
+        }
+    }
+    handleSubmit() {
+        this.orderSummarySubmit.emit();
+    }
+    render() {
+        return (h("div", { key: 'bdab321b9336f47e16057d240b3226d7cba59b97', ref: (el) => (this.stylingContainer = el) }, h("div", { key: 'de7ffcc9f96d8c7cfc7bdb3a3c7225ee78c33483', class: "order-summary" }, h("h3", { key: '9500cd69a6eba0855d4981cdad8eaa91b9c98567', class: "order-summary__title" }, this.orderSummaryTitle), h("div", { key: 'ce29c82eef1d12bc63e94e4fa2d5474700860af2', class: "order-summary__ticket" }, h("div", { key: '9db79da17590c7f847f46c3b3b66489ea9a0e268', class: "order-summary__ticket-info" }, h("div", { key: '4b5a2df807aeb421cf3c1ebf33f410a92f39ccaf', class: "order-summary__ticket-label" }, h("div", { key: 'feb73e9f849d2e3d6b77e4c848657f27e6a82323', class: "order-summary__ticket" }, this.ticketsLabel), h("span", { key: '51f70dcdda2154d8ce97d8e1a7c0f61a6198afbb', class: "order-summary__colon" }, this.showColon ? ':' : null)), h("div", { key: '4fed2d63cd7a881c8844055fe1fde99c8c7aa9fb', class: "order-summary__details" }, h("slot", { key: '6a7969738546ee4aca81a075f6174556e78d2c31', name: "orderSummaryTicketDetail" }))), this.showDivider && h("hr", { key: '029803fa93960d5098a24d5ca18e77e14562b29f', class: "order-summary__divider" }), h("div", { key: '738096c5b605a97851dbf24a972d93d9533ad48b', class: "order-summary__ticket-info" }, h("div", { key: 'acd8a7f3e64c97f58c79f57a90143151c996abf8', class: "order-summary__ticket-label" }, h("div", { key: '44e6b29978ca4fc2b22ca9d95ee4facfc883f292', class: "order-summary__ticket" }, this.totalLabel), h("span", { key: '330a00a4b39e578a1b0d80211d2b68d44c5235c9', class: "order-summary__colon" }, this.showColon ? ':' : null)), h("span", { key: '294046815a62a80366458aade4ec5d5476577a93', class: "order-summary__details" }, h("slot", { key: '02d129ef0caf523ec0c9da34318df46d3b008376', name: "orderSummaryTotalDetail" })))), h("slot", { key: '9395396883f0594ad8db216a9aa9fa0aeff45c10', name: "orderSummaryChoice" }), h("div", { key: '462672abc490cde00fea90ea585f48875ca2ec47', class: "order-summary__button-wrapper" }, h("lottery-button", { key: '1885bee3570ce6b58d4ae1977c635f418485fdbe', onClick: this.handleSubmit.bind(this), loading: this.submitLoading, disabled: this.submitDisabled, text: this.submitButtonText })))));
+    }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"]
+    }; }
+};
+LotteryOrderSummary.style = LotteryOrderSummaryStyle0;
+
+// This icon file is generated automatically.
+var DeleteFilled = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M864 256H736v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zm-200 0H360v-72h304v72z" } }] }, "name": "delete", "theme": "filled" };
+const DeleteFilled$1 = DeleteFilled;
+
+// This icon file is generated automatically.
+var DeleteOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z" } }] }, "name": "delete", "theme": "outlined" };
+const DeleteOutlined$1 = DeleteOutlined;
+
+// This icon file is generated automatically.
+var InfoCircleOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" } }, { "tag": "path", "attrs": { "d": "M464 336a48 48 0 1096 0 48 48 0 10-96 0zm72 112h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V456c0-4.4-3.6-8-8-8z" } }] }, "name": "info-circle", "theme": "outlined" };
+const InfoCircleOutlined$1 = InfoCircleOutlined;
+
+// This icon file is generated automatically.
+var LeftOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M724 218.3V141c0-6.7-7.7-10.4-12.9-6.3L260.3 486.8a31.86 31.86 0 000 50.3l450.8 352.1c5.3 4.1 12.9.4 12.9-6.3v-77.3c0-4.9-2.3-9.6-6.1-12.6l-360-281 360-281.1c3.8-3 6.1-7.7 6.1-12.6z" } }] }, "name": "left", "theme": "outlined" };
+const LeftOutlined$1 = LeftOutlined;
+
+// This icon file is generated automatically.
+var LoadingOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "0 0 1024 1024", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 00-94.3-139.9 437.71 437.71 0 00-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z" } }] }, "name": "loading", "theme": "outlined" };
+const LoadingOutlined$1 = LoadingOutlined;
+
+// This icon file is generated automatically.
+var PlusSquareOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M328 544h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8z" } }, { "tag": "path", "attrs": { "d": "M880 112H144c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32zm-40 728H184V184h656v656z" } }] }, "name": "plus-square", "theme": "outlined" };
+const PlusSquareOutlined$1 = PlusSquareOutlined;
+
+// This icon file is generated automatically.
+var RightOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M765.7 486.8L314.9 134.7A7.97 7.97 0 00302 141v77.3c0 4.9 2.3 9.6 6.1 12.6l360 281.1-360 281.1c-3.9 3-6.1 7.7-6.1 12.6V883c0 6.7 7.7 10.4 12.9 6.3l450.8-352.1a31.96 31.96 0 000-50.4z" } }] }, "name": "right", "theme": "outlined" };
+const RightOutlined$1 = RightOutlined;
+
+var __assign = (undefined && undefined.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var defaultColors = {
+    primaryColor: '#333',
+    secondaryColor: '#E6E6E6'
+};
+function renderIconDefinitionToSVGElement(icond, options) {
+    if (options === void 0) { options = {}; }
+    if (typeof icond.icon === 'function') {
+        // two-tone
+        var placeholders = options.placeholders || defaultColors;
+        return renderAbstractNodeToSVGElement(icond.icon(placeholders.primaryColor, placeholders.secondaryColor), options);
+    }
+    // fill, outline
+    return renderAbstractNodeToSVGElement(icond.icon, options);
+}
+function renderAbstractNodeToSVGElement(node, options) {
+    var targetAttrs = node.tag === 'svg'
+        ? __assign(__assign({}, node.attrs), (options.extraSVGAttrs || {})) : node.attrs;
+    var attrs = Object.keys(targetAttrs).reduce(function (acc, nextKey) {
+        var key = nextKey;
+        var value = targetAttrs[key];
+        var token = "".concat(key, "=\"").concat(value, "\"");
+        acc.push(token);
+        return acc;
+    }, []);
+    var attrsToken = attrs.length ? ' ' + attrs.join(' ') : '';
+    var children = (node.children || [])
+        .map(function (child) { return renderAbstractNodeToSVGElement(child, options); })
+        .join('');
+    if (children && children.length) {
+        return "<".concat(node.tag).concat(attrsToken, ">").concat(children, "</").concat(node.tag, ">");
+    }
+    return "<".concat(node.tag).concat(attrsToken, " />");
+}
+
+// Basic sanitization method for SVG content
+// This is NOT a complete XSS prevention for SVG, but prevents common attacks.
+function sanitizeSvg(svgString) {
+    let sanitized = svgString.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, ''); // Remove <script> tags
+    sanitized = sanitized.replace(/on[a-z]+=[\"'][^\"']*[\"']/gi, ''); // Remove on* attributes
+    sanitized = sanitized.replace(/javascript:/gi, ''); // Remove javascript: URLs
+    return sanitized;
+}
+
+const lotterySelectionCss = ":host{display:inline-block}.lottery-selection__button{display:flex;align-items:center;justify-content:center;width:var(--lottery-selection-width, 32px);height:var(--lottery-selection-height, 32px);padding:var(--lottery-selection-padding, 0);box-sizing:border-box;background:var(--lottery-selection-background, var(--emw--color-background, #fff));border:var(--lottery-selection-border-width, 2px) var(--lottery-selection-border-style, solid) var(--lottery-selection-border-color, var(--emw--color-primary, #0d196e));border-radius:var(--lottery-selection-border-radius, var(--emw--border-radius-medium, 8px));color:var(--lottery-selection-color, var(--emw--color-typography, #000));font-weight:var(--lottery-selection-font-weight, bold);font-size:var(--lottery-selection-font-size, 1em);cursor:pointer;user-select:none;}.lottery-selection__button:hover{background:var(--lottery-selection-hover-background, var(--emw--color-background, #fff));border-color:var(--lottery-selection-hover-border-color, var(--emw--color-primary, #0d196e));color:var(--lottery-selection-hover-color, var(--emw--color-typography, #000))}.lottery-selection__button .lottery-selection__delete-icon{display:none}.lottery-selection__button.isDeleteByIcon:hover .lottery-selection__text{display:none}.lottery-selection__button.isDeleteByIcon:hover .lottery-selection__delete-icon{display:flex;align-items:center;justify-content:center;fill:var(--lottery-selection-delete-icon-color, var(--emw--color-typography, #000));vertical-align:middle}.lottery-selection__button.lottery-selection__button--selected{background-color:var(--lottery-selection-selected-background, var(--emw--color-primary, #0d196e));border-color:var(--lottery-selection-selected-border-color, var(--emw--color-primary, #0d196e));color:var(--lottery-selection-selected-color, var(--emw--color-typography-inverse, #fff))}.lottery-selection__button.lottery-selection__button--disabled{background-color:var(--lottery-selection-disabled-background, var(--emw--color-gray-50, #f5f5f5));border-color:var(--lottery-selection-disabled-border-color, var(--emw--color-gray-100, #e6e6e6));color:var(--lottery-selection-disabled-color, var(--emw--color-gray-150, #6f6f6f));cursor:not-allowed;pointer-events:none;}.lottery-selection__button.lottery-selection__button--no-border{border:none}.lottery-selection__button.lottery-selection__button--no-background{background:transparent}";
+const LotterySelectionStyle0 = lotterySelectionCss;
+
+const LotterySelection = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.lotteryBulletClickHandler = createEvent(this, "lotteryBulletClick", 7);
+        this.value = 0;
+        this.text = undefined;
+        this.idx = undefined;
+        this.type = 'toggle';
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.hasBorder = true;
+        this.hasBackground = true;
+        this.deleteIconSvg = '';
+        this.deleteIconWidth = '16px';
+        this.deleteIconHeight = '16px';
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue !== oldValue) {
+            setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue !== oldValue) {
+            setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue !== oldValue) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    handleClick() {
+        if (this.type === 'disabled' || this.type === 'readonly') {
+            return;
+        }
+        console.log('bullet clicked', this.type, this.idx, this.text, this.value);
+        this.lotteryBulletClickHandler.emit({
+            type: this.type,
+            idx: this.idx,
+            text: this.text,
+            value: this.value
+        });
+    }
+    render() {
+        let iconToRender;
+        if (this.deleteIconSvg) {
+            iconToRender = sanitizeSvg(this.deleteIconSvg);
+        }
+        else {
+            iconToRender = renderIconDefinitionToSVGElement(DeleteFilled$1, {
+                extraSVGAttrs: {
+                    width: this.deleteIconWidth,
+                    height: this.deleteIconHeight,
+                    fill: 'currentColor'
+                }
+            });
+        }
+        return (h("div", { key: '0d1e8aaa80a907a7467410f6b27b4b6175e82299', class: "lottery-selection", ref: (el) => (this.stylingContainer = el) }, h("button", { key: '11a2402abbc290dc877ad95f3433092c3a0d8419', class: {
+                'lottery-selection__button': true,
+                'lottery-selection__button--selected': this.value == 1,
+                'lottery-selection__button--disabled': this.type === 'disabled',
+                'lottery-selection__button--no-border': !this.hasBorder,
+                'lottery-selection__button--no-background': !this.hasBackground,
+                isDeleteByIcon: this.type === 'delete',
+                isCallDialogBtn: this.type === 'input' || this.type === 'readonly'
+            }, onClick: this.handleClick.bind(this), disabled: this.type === 'disabled' }, this.type === 'delete' && h("span", { key: 'f99001d936a8f7bdf8adc5c46e82caf730a9442a', class: "lottery-selection__delete-icon", innerHTML: iconToRender }), h("span", { key: '55775e2492a1fe45cc8a457ac0a0d206744461ab', class: "lottery-selection__text" }, this.text))));
+    }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"]
+    }; }
+};
+LotterySelection.style = LotterySelectionStyle0;
+
+const DEFAULT_LANGUAGE$2 = 'en';
+const SUPPORTED_LANGUAGES$2 = ['ro', 'en', 'fr', 'ar', 'hr', 'zh'];
+const TRANSLATIONS$2 = {
+    en: {
+        noTicketBoard: 'No ticket board available.',
+        selectionCleared: 'Your selection has been cleared.',
+        clearAll: 'Clear All',
+        stopAt: 'Stop at',
+        turnover: 'Turnover: ',
+        pleaseFillIn: 'Please fill in all the selection input!',
+        fillIn: 'Fill in',
+        noBets: 'Sorry. No bets have been placed so far. Check back later!',
+        search: 'Search',
+        clear: 'Clear',
+        oddsChart: 'Odds Chart',
+        ticketSuccess: 'Ticket purchased successfully.',
+        stakePerLine: 'Stake per Line:',
+        lowestOdds: 'Lowest Odds:',
+        highestOdds: 'Highest Odds:',
+        orderSummary: 'ORDER SUMMARY',
+        ticket: 'Ticket',
+        lines: 'Lines',
+        total: 'Total',
+        submit: 'Submit',
+        loading: 'Loading',
+        enterValidNumber: 'Please enter a valid number.',
+        enterNumberBetween: 'Please enter a number between {min} and {max}.',
+        numberAlreadySelected: 'This number has already been selected.',
+        enterScoreUpTo: 'Please enter the score (Up to {maxScore})',
+        enterValue: 'Please enter a value',
+        myChoices: 'My Choices',
+        teams: 'Teams',
+        scores: 'Scores',
+        euro: 'Euro',
+        cancel: 'Cancel',
+        confirm: 'Confirm'
+    },
+    ro: {},
+    fr: {},
+    ar: {},
+    hr: {}
+};
+const translate$2 = (key, customLang, replacements) => {
+    const lang = customLang;
+    let translation = TRANSLATIONS$2[lang !== undefined && SUPPORTED_LANGUAGES$2.includes(lang) ? lang : DEFAULT_LANGUAGE$2][key];
+    if (replacements) {
+        Object.keys(replacements).forEach((placeholder) => {
+            translation = translation.replace(`{${placeholder}}`, replacements[placeholder]);
+        });
+    }
+    return translation;
+};
+const getTranslations$2 = (data) => {
+    Object.keys(data).forEach((item) => {
+        for (let key in data[item]) {
+            TRANSLATIONS$2[item][key] = data[item][key];
+        }
+    });
+};
+
+function getBulletTextsSet(bulletTexts, splitToken) {
+    return new Set(bulletTexts ? bulletTexts.split(splitToken) : []);
+}
+function validateInput({ value, selectedSet, maxValue, minValue, language, type = 'integer' }) {
+    const trimmedValue = value.trim();
+    if (type === 'integer') {
+        // Strict integer check
+        if (!/^-?\d+$/.test(trimmedValue)) {
+            return {
+                valid: false,
+                errorMessage: translate$2('enterValidNumber', language),
+                value
+            };
+        }
+        const numValue = Number(trimmedValue);
+        if (isNaN(numValue)) {
+            return {
+                valid: false,
+                errorMessage: translate$2('enterValidNumber', language),
+                value
+            };
+        }
+        if ((minValue !== undefined && numValue < minValue) || (maxValue !== undefined && numValue > maxValue)) {
+            return {
+                valid: false,
+                errorMessage: translate$2('enterNumberBetween', language, {
+                    min: minValue,
+                    max: maxValue
+                }),
+                value
+            };
+        }
+        // Normalize value (e.g. "05" -> "5") for set check
+        const normalizedValue = String(numValue);
+        if (selectedSet.has(normalizedValue)) {
+            return {
+                valid: false,
+                errorMessage: translate$2('numberAlreadySelected', language),
+                value
+            };
+        }
+    }
+    else {
+        // Text mode validation
+        if (selectedSet.has(trimmedValue)) {
+            return {
+                valid: false,
+                errorMessage: translate$2('numberAlreadySelected', language), // Or generic 'alreadySelected' if available, but reusing key for now
+                value
+            };
+        }
+    }
+    return {
+        valid: true,
+        errorMessage: '',
+        value
+    };
+}
+function removeBulletTexts(text, selectedArr) {
+    return selectedArr.filter((s) => s !== text);
+}
+function addSelectedBulletTexts(text, selectedArr) {
+    return selectedArr.concat([text]);
+}
+function removeAndAddSelectedBulletTexts(text, selectedArr, maxSelectedCount) {
+    return selectedArr.slice(selectedArr.length - (maxSelectedCount - 1)).concat([text]);
+}
+function buildSelectedBulletTextsArr(item, selectedArr, maxSelectedCount) {
+    if (item.type === 'delete') {
+        return removeBulletTexts(item.text, selectedArr);
+    }
+    if (item.type === 'toggle') {
+        if (selectedArr.includes(item.text)) {
+            return removeBulletTexts(item.text, selectedArr);
+        }
+        if (selectedArr.length >= maxSelectedCount) {
+            return removeAndAddSelectedBulletTexts(item.text, selectedArr, maxSelectedCount);
+        }
+        return addSelectedBulletTexts(item.text, selectedArr);
+    }
+    return [];
+}
+
+const lotterySelectionGroupCss = ":host {\n  width: 100%;\n}\n\n.lottery-selection-group {\n  container-type: inline-size;\n  padding: var(--lottery-selection-group-padding, 0);\n  background: var(--lottery-selection-group-background, transparent);\n  border: var(--lottery-selection-group-border, none);\n  border-radius: var(--lottery-selection-group-border-radius, 0);\n}\n.lottery-selection-group__item {\n  display: flex;\n  flex-direction: var(--lottery-selection-group-flex-direction, row);\n  align-items: var(--lottery-selection-group-item-align, center);\n  justify-content: var(--lottery-selection-group-item-justify, flex-start);\n  gap: var(--lottery-selection-group-item-gap, 16px);\n  width: 100%;\n}\n.lottery-selection-group__item--left {\n  width: var(--lottery-selection-group-label-width, 130px);\n  min-width: var(--lottery-selection-group-label-min-width, auto);\n  max-width: var(--lottery-selection-group-label-max-width, none);\n  color: var(--lottery-selection-group-label-color, var(--emw--color-typography, #000));\n  font-size: var(--lottery-selection-group-label-font-size, 1em);\n  font-weight: var(--lottery-selection-group-label-font-weight, bold);\n  text-align: var(--lottery-selection-group-label-align, left);\n  white-space: var(--lottery-selection-group-label-white-space, normal);\n}\n.lottery-selection-group__item--right {\n  flex: 1;\n  display: flex;\n  flex-wrap: var(--lottery-selection-group-bullets-wrap, wrap); /* Allow items to wrap */\n  gap: var(--lottery-selection-group-bullets-gap, 8px); /* Gap between bullets */\n  align-items: var(--lottery-selection-group-bullets-align, center);\n  justify-content: var(--lottery-selection-group-bullets-justify, flex-start); /* Align bullets to start */\n}\n@container (max-width: 320px) {\n  .lottery-selection-group__item--left {\n    width: 100px;\n    max-width: 100px;\n  }\n}\n\n.dialog-input {\n  width: 100%;\n  padding: var(--lottery-selection-group-input-padding, 8px);\n  border: var(--lottery-selection-group-input-border-width, 1px) var(--lottery-selection-group-input-border-style, solid) var(--lottery-selection-group-input-border-color, var(--emw--color-gray-100, #e6e6e6));\n  border-radius: var(--lottery-selection-group-input-radius, 4px);\n  background-color: var(--lottery-selection-group-input-bg, #fff);\n  color: var(--lottery-selection-group-input-color, #000);\n  box-sizing: border-box;\n  margin-top: var(--lottery-selection-group-input-margin-top, 10px);\n  font-size: var(--lottery-selection-group-input-font-size, 1em);\n}\n.dialog-input::placeholder {\n  color: var(--lottery-selection-group-input-placeholder-color, #999);\n}\n\n.dialog-input.invalid,\n.dialog-input.invalid:focus {\n  border-color: var(--emw--color-error, #ff3d00);\n  outline-color: var(--emw--color-error, #ff3d00);\n}\n\n.error-message {\n  color: var(--lottery-selection-group-error-color, var(--emw--color-error, #ff3d00));\n  font-size: var(--lottery-selection-group-error-font-size, 12px);\n  font-weight: var(--lottery-selection-group-error-font-weight, normal);\n  margin-top: 4px;\n}\n\n.addSelectionDialog-title {\n  color: var(--lottery-selection-group-dialog-title-color, var(--emw--color-typography, #000));\n  font-size: var(--lottery-selection-group-dialog-title-font-size, 1.2em);\n  font-weight: var(--lottery-selection-group-dialog-title-font-weight, bold);\n  margin-bottom: var(--lottery-selection-group-dialog-title-margin-bottom, 0);\n}\n.addSelectionDialog-footer {\n  display: flex;\n  justify-content: var(--lottery-selection-group-dialog-footer-justify, flex-end);\n  gap: var(--lottery-selection-group-dialog-footer-gap, 18px);\n  margin-top: var(--lottery-selection-group-dialog-footer-margin-top, 0);\n}";
+const LotterySelectionGroupStyle0 = lotterySelectionGroupCss;
+
+const LotterySelectionGroup = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.bulletGroupUpdateSelectedBulletTexts = createEvent(this, "bulletGroupUpdateSelection", 7);
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.language = 'en';
+        this.translationUrl = '';
+        this.splitToken = ',';
+        this.selectionGroupId = undefined;
+        this.selectionGroupLabel = undefined;
+        this.type = 'bet';
+        this.selectedBulletTexts = null;
+        this.maxSelectedCount = null;
+        this.maxDisplayBulletsCount = 11;
+        this.bulletTexts = null;
+        this.maxIntegerBulletText = null;
+        this.minIntegerBulletText = 0;
+        this.bulletTextType = 'integer';
+        this.hasBorder = true;
+        this.hasBackground = true;
+        this.dialogTitle = undefined;
+        this.dialogInputPlaceholder = undefined;
+        this.disabledBulletTexts = '';
+        this.dialogConfig = {
+            width: '400px',
+            visible: false,
+            onConfirm: () => this.handleFillInAddMore(),
+            onCancel: () => this.handleCloseAddMoreDialog()
+        };
+        this.inputInfo = { valid: true, errorMessage: '', value: '' };
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    componentWillLoad() {
+        if (this.translationUrl) {
+            getTranslations$2(JSON.parse(this.translationUrl));
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    lotteryBulletClickHandler(event) {
+        event.stopPropagation();
+        // if it's input type, open the dialog
+        if (event.detail.type === 'input') {
+            this.dialogConfig = Object.assign(Object.assign({}, this.dialogConfig), { visible: true });
+            return;
+        }
+        if (['delete', 'toggle'].includes(event.detail.type)) {
+            this.bulletGroupUpdateSelectedBulletTexts.emit({
+                newSelectedBulletTexts: buildSelectedBulletTextsArr(event.detail, Array.from(this.selectedSet), this.maxSelectedCount).join(this.splitToken),
+                selectionGroupId: this.selectionGroupId
+            });
+            return;
+        }
+    }
+    get selectedSet() {
+        return getBulletTextsSet(this.selectedBulletTexts, this.splitToken);
+    }
+    get disabledSet() {
+        return getBulletTextsSet(this.disabledBulletTexts, this.splitToken);
+    }
+    get bulletTextsSet() {
+        if (this.bulletTexts)
+            return getBulletTextsSet(this.bulletTexts, this.splitToken);
+        if (this.bulletTextType === 'integer' &&
+            this.maxIntegerBulletText !== null &&
+            this.maxIntegerBulletText !== undefined) {
+            return getBulletTextsSet(Array.from({ length: Number(this.lastDisplayBulletText) - this.minIntegerBulletText + 1 }, (_, index) => this.minIntegerBulletText + index).join(this.splitToken), this.splitToken);
+        }
+        // If neither bulletTexts nor maxIntegerBulletText are provided,
+        return new Set();
+    }
+    // the last bullet text
+    get lastDisplayBulletText() {
+        if (this.bulletTextType === 'integer') {
+            if (this.maxIntegerBulletText !== null && this.maxIntegerBulletText !== undefined) {
+                return Math.min(this.maxIntegerBulletText, this.minIntegerBulletText + this.maxDisplayBulletsCount - 1);
+            }
+            return this.minIntegerBulletText + this.maxDisplayBulletsCount - 1;
+        }
+        // Text mode: return the text at the max display index if available
+        if (this.bulletTextsSet.size > 0) {
+            const texts = Array.from(this.bulletTextsSet);
+            if (texts.length >= this.maxDisplayBulletsCount) {
+                return texts[this.maxDisplayBulletsCount - 1];
+            }
+            return texts[texts.length - 1]; // If fewer than maxDisplayBulletsCount, return the last one
+        }
+        return null;
+    }
+    get isSingleSelectionMode() {
+        return this.maxSelectedCount === 1;
+    }
+    getBulletToRender() {
+        const allBulletTexts = Array.from(this.bulletTextsSet);
+        // Determine which bullets to display based on type and limit
+        let bulletsToRender = allBulletTexts;
+        let showInputButton = false;
+        if (this.bulletTextType === 'text') {
+            // For text, if we have more items than the limit, we need an input button.
+            // The input button takes one slot, so we show (limit - 1) items.
+            if (allBulletTexts.length > this.maxDisplayBulletsCount) {
+                showInputButton = true;
+                bulletsToRender = allBulletTexts.slice(0, this.maxDisplayBulletsCount - 1);
+            }
+            else {
+                bulletsToRender = allBulletTexts;
+            }
+        }
+        else {
+            // For integer, logic is based on maxIntegerBulletText vs displayed range
+            showInputButton =
+                this.maxIntegerBulletText !== null &&
+                    this.maxIntegerBulletText !== undefined &&
+                    this.maxIntegerBulletText > Number(this.lastDisplayBulletText);
+            // Integer bullets generation already respects the count, no slicing needed on the raw set
+            bulletsToRender = allBulletTexts;
+        }
+        return {
+            bulletsToRender,
+            showInputButton
+        };
+    }
+    renderBulletGroup() {
+        let items = [];
+        if (this.type === 'bet') {
+            const isMaxSelected = this.maxSelectedCount !== null && this.selectedSet.size >= this.maxSelectedCount;
+            const { bulletsToRender, showInputButton } = this.getBulletToRender();
+            bulletsToRender.forEach((text, idx) => {
+                let bulletType = 'toggle';
+                if (this.disabledSet.has(String(text))) {
+                    bulletType = 'disabled';
+                }
+                else if (!this.selectedSet.has(String(text)) && isMaxSelected && !this.isSingleSelectionMode) {
+                    bulletType = 'disabled';
+                }
+                items.push({
+                    value: this.selectedSet.has(String(text)) ? 1 : 0,
+                    text: String(text),
+                    idx,
+                    type: bulletType
+                });
+            });
+            if (showInputButton) {
+                let inputBulletType = 'input';
+                if (isMaxSelected && !this.isSingleSelectionMode) {
+                    inputBulletType = 'disabled';
+                }
+                const inputButtonText = this.bulletTextType === 'text' ? '...' : `${this.lastDisplayBulletText}+`;
+                const inputButtonIdx = this.bulletTextType === 'text' ? -1 : Number(this.lastDisplayBulletText) + 1;
+                // Special handling for integer mode:
+                // If the generated set is "full" (size == maxDisplayBulletsCount),
+                // we need to remove the last item to make room for the "N+" button
+                // so the total visual count remains consistent.
+                if (this.bulletTextType === 'integer' && items.length >= this.maxDisplayBulletsCount) {
+                    items.pop();
+                }
+                items.push({
+                    value: 0,
+                    text: inputButtonText,
+                    idx: inputButtonIdx,
+                    type: inputBulletType
+                });
+            }
+        }
+        else if (['choice', 'preview'].includes(this.type)) {
+            // For choice/preview, also respect the visual limit for text mode
+            const { bulletsToRender } = this.getBulletToRender();
+            bulletsToRender.forEach((text, idx) => {
+                let bulletType = 'toggle';
+                if (this.disabledSet.has(String(text))) {
+                    bulletType = 'disabled';
+                }
+                else if (this.type === 'preview') {
+                    bulletType = 'readonly';
+                }
+                else if (this.selectedSet.has(String(text))) {
+                    bulletType = 'delete';
+                }
+                items.push({
+                    value: this.selectedSet.has(String(text)) ? 1 : 0,
+                    text,
+                    idx,
+                    type: bulletType
+                });
+            });
+        }
+        return (h("div", { class: "lottery-selection-group__item--right" }, items.map((item) => {
+            return (h("lottery-selection", { clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl, mbSource: this.mbSource, text: item.text, idx: item.idx, value: item.value, type: item.type, hasBorder: this.hasBorder, hasBackground: this.hasBackground }));
+        })));
+    }
+    handleCloseAddMoreDialog() {
+        this.dialogConfig = Object.assign(Object.assign({}, this.dialogConfig), { visible: false });
+        this.inputInfo = { value: '', errorMessage: '', valid: true };
+    }
+    handleInputChange(e) {
+        const inputElement = e.target;
+        const value = inputElement.value;
+        this.inputInfo = Object.assign(Object.assign({}, this.inputInfo), { value: value });
+        this.inputInfo = validateInput({
+            value,
+            selectedSet: this.selectedSet,
+            maxValue: this.maxIntegerBulletText,
+            minValue: this.bulletTextType === 'integer' ? Number(this.lastDisplayBulletText) + 1 : undefined,
+            language: this.language,
+            type: this.bulletTextType
+        });
+    }
+    handleFillInAddMore() {
+        if (this.inputInfo.valid) {
+            const { value } = this.inputInfo;
+            // Normalize the value (e.g., "05" -> "5") to match validation logic
+            let normalizedValue = value;
+            if (this.bulletTextType === 'integer') {
+                normalizedValue = String(Number(value));
+            }
+            else {
+                normalizedValue = value.trim();
+            }
+            let newSelectedBulletTexts;
+            if (this.isSingleSelectionMode) {
+                newSelectedBulletTexts = normalizedValue;
+            }
+            else {
+                newSelectedBulletTexts = addSelectedBulletTexts(normalizedValue, Array.from(this.selectedSet)).join(this.splitToken);
+            }
+            this.bulletGroupUpdateSelectedBulletTexts.emit({
+                newSelectedBulletTexts,
+                selectionGroupId: this.selectionGroupId
+            });
+            this.handleCloseAddMoreDialog();
+        }
+    }
+    render() {
+        return (h("div", { key: '39225bad75cf435b166269367df570732eff7ef4', class: "lottery-selection-group", ref: (el) => (this.stylingContainer = el) }, h("div", { key: '2bb2bc539c9fc05aeece7145b13f722756bc054e', class: "lottery-selection-group__item" }, this.selectionGroupLabel && (h("div", { key: 'dc15197dca90375bd4eb50e87d96402d1ef694d2', class: "lottery-selection-group__item--left" }, this.selectionGroupLabel)), this.renderBulletGroup()), h("lottery-tipping-dialog", { key: '9526dbb5d1656d6724e6566465febde778437c64', visible: this.dialogConfig.visible, width: this.dialogConfig.width, onCancel: this.dialogConfig.onCancel }, h("div", { key: 'ecf5800430e92be4a2af279f1d8c5075d5965b7e', class: "addSelectionDialog" }, h("div", { key: '3e8a2f445679ef5fe2ada60d4a6832f472f27dfa', class: "addSelectionDialog-title" }, this.dialogTitle ||
+            (this.bulletTextType === 'text'
+                ? translate$2('enterValue', this.language)
+                : translate$2('enterScoreUpTo', this.language, {
+                    maxScore: this.maxIntegerBulletText
+                }))), h("input", { key: '46462ee8f27410639d45970a76fc3d90a03f3a10', type: "text", class: {
+                'dialog-input': true,
+                invalid: !this.inputInfo.valid
+            }, value: this.inputInfo.value, onInput: this.handleInputChange.bind(this), placeholder: this.dialogInputPlaceholder }), h("div", { key: '2e66988e4186f8f4f773ed548fc76e53085be946', class: "error-message" }, this.inputInfo.errorMessage)), h("div", { key: '81dc64f0b7cba422a54af8ecff4734aa19832583', slot: "footer", class: "addSelectionDialog-footer" }, h("lottery-button", { key: '3027240894aef525dc9fc50db79597cf29f9cb99', onClick: this.dialogConfig.onCancel, text: translate$2('cancel', this.language), variant: "outline" }), h("lottery-button", { key: 'ab8c6deed9ab4a7d79d71ed6fe8122b23af5741b', onClick: this.dialogConfig.onConfirm, text: translate$2('confirm', this.language), variant: "primary", disabled: !this.inputInfo.valid || !this.inputInfo.value })))));
+    }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"]
+    }; }
+};
+LotterySelectionGroup.style = LotterySelectionGroupStyle0;
+
+const DEFAULT_LANGUAGE$1 = 'en';
+const SUPPORTED_LANGUAGES$1 = ['ro', 'en', 'fr', 'ar', 'hr'];
+const TRANSLATIONS$1 = {
+    en: {
+        homeTeam: 'Home team:',
+        awayTeam: 'Away team:',
+        loading: 'Loading...',
+        error: 'Error!',
+        noData: 'No data available.',
+        lineInfo: 'Line {currentPage} of {totalPages}',
+        clearAll: 'Clear All'
+    },
+    ro: {
+        homeTeam: 'Echipa gazdă:',
+        awayTeam: 'Echipa oaspete:',
+        selectionCleared: 'Selecția dvs. a fost ștearsă.',
+        selectionOnLineCleared: 'Selecția dvs. de pe această linie va fi ștearsă.',
+        loading: `Se încarcă...',n    error: 'Eroare!`,
+        noData: 'Nu sunt date disponibile.',
+        lineInfo: 'Linia {currentPage} din {totalPages}',
+        clearAll: 'Șterge tot',
+        cancel: 'Anulează',
+        confirm: 'Confirmă'
+    },
+    fr: {
+        homeTeam: 'Équipe à domicile:',
+        awayTeam: `Équipe à l'extérieur:`,
+        selectionCleared: 'Votre sélection a été effacée.',
+        selectionOnLineCleared: 'Votre sélection sur cette ligne sera effacée.',
+        loading: `Chargement...',n    error: 'Erreur!`,
+        noData: 'Aucune donnée disponible.',
+        lineInfo: 'Ligne {currentPage} sur {totalPages}',
+        clearAll: 'Tout effacer',
+        cancel: 'Annuler',
+        confirm: 'Confirmer'
+    },
+    ar: {
+        homeTeam: 'الفريق المضيف:',
+        awayTeam: 'الفريق الضيف:',
+        selectionCleared: 'تم مسح اختيارك.',
+        selectionOnLineCleared: 'سيتم مسح اختيارك في هذا السطر.',
+        loading: `جار التحميل...',n    error: 'خطأ!`,
+        noData: 'لا توجد بيانات متاحة.',
+        lineInfo: 'السطر {currentPage} من {totalPages}',
+        clearAll: 'مسح الكل',
+        cancel: 'إلغاء',
+        confirm: 'تأكيد'
+    },
+    hr: {
+        homeTeam: 'Domaći tim:',
+        awayTeam: 'Gostujući tim:',
+        selectionCleared: 'Vaš odabir je obrisan.',
+        selectionOnLineCleared: 'Vaš odabir na ovoj liniji bit će obrisan.',
+        loading: `Učitavanje...',n    error: 'Greška!`,
+        noData: 'Nema dostupnih podataka.',
+        lineInfo: 'Linija {currentPage} od {totalPages}',
+        clearAll: 'Očisti sve',
+        cancel: 'Odustani',
+        confirm: 'Potvrdi'
+    }
+};
+const translate$1 = (key, customLang, replacements) => {
+    const lang = customLang;
+    let translation = TRANSLATIONS$1[lang !== undefined && SUPPORTED_LANGUAGES$1.includes(lang) ? lang : DEFAULT_LANGUAGE$1][key];
+    if (replacements) {
+        Object.keys(replacements).forEach((placeholder) => {
+            translation = translation.replace(`{${placeholder}}`, replacements[placeholder]);
+        });
+    }
+    return translation;
+};
+const getTranslations$1 = (data) => {
+    Object.keys(data).forEach((item) => {
+        for (let key in data[item]) {
+            TRANSLATIONS$1[item][key] = data[item][key];
+        }
+    });
+};
+const resolveTranslationUrl$1 = async (translationUrl) => {
+    if (translationUrl) {
+        try {
+            const response = await fetch(translationUrl);
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            const translations = await response.json();
+            getTranslations$1(translations);
+        }
+        catch (error) {
+            console.error('Failed to fetch or parse translations from URL:', error);
+        }
+    }
+};
+
+const formatDate = ({ date, type = 'date', format: format$1 }) => {
+    try {
+        const parsedDate = parseISO(date);
+        if (isNaN(parsedDate.getTime())) {
+            throw new Error(`Invalid date: ${date}`);
+        }
+        if (format$1)
+            return format(parsedDate, format$1);
+        let formatStr = 'dd/MM/yyyy';
+        if (type === 'time') {
+            formatStr = 'dd/MM/yyyy HH:mm:ss';
+        }
+        else if (type === 'week') {
+            formatStr = 'ccc dd/MM/yyyy HH:mm:ss';
+        }
+        return format(parsedDate, formatStr);
+    }
+    catch (error) {
+        console.error('Error formatting date:', error.message);
+        return '';
+    }
+};
+
+const lotteryTippingBetSlipCss = ":host {\n  --lottery-button-border-radius: 16px;\n}\n\n.LotteryTippingTicketBet__container {\n  display: block; /* Or inline-block, depending on desired layout flow */\n  font-size: 14px;\n  padding: 12px;\n  border: 1px solid var(--emw--color-gray-100, #e6e6e6);\n  border-radius: var(--emw--button-border-radius, 4px);\n  line-height: 1.5715;\n  color: var(--emw--color-typography, #000);\n  background: var(--emw--color-background, #fff);\n  overflow: hidden;\n  min-width: 300px;\n  container-type: inline-size;\n}\n@container (max-width: 375px) {\n  .LotteryTippingTicketBet__container {\n    font-size: 12px;\n  }\n}\n\n.table-wrapper {\n  overflow-x: auto; /* Handle horizontal scroll if content overflows */\n}\n\n.LotteryTippingTicketBet__main {\n  overflow: hidden;\n}\n\n.table-scroll-wrapper {\n  overflow-x: auto;\n  flex-grow: 1;\n  min-width: 0;\n}\n\n.my-table-component {\n  width: 100%;\n  border-collapse: collapse; /* Important for borders */\n  text-align: left;\n  border-radius: 0.1rem; /* Ant Design like subtle rounding */\n  border-spacing: 0;\n}\n\n/* Header */\n.my-table-component th {\n  background: var(--emw--color-background-secondary, #f5f5f5);\n  color: var(--emw--color-typography, #000);\n  font-weight: 500;\n  padding: 0.4rem 0.5rem;\n  transition: background 0.3s ease;\n}\n@container (max-width: 400px) {\n  .my-table-component th {\n    padding: 0.3rem 0.3rem;\n  }\n}\n\n/* Cells */\n.my-table-component td {\n  padding: 0.4rem 0.5rem;\n  color: var(--emw--color-typography, #000);\n  background: var(--emw--color-background, #fff);\n  transition: background 0.3s;\n}\n@container (max-width: 400px) {\n  .my-table-component td {\n    padding: 0.3rem 0.3rem;\n  }\n}\n\n.my-table-component th:nth-child(1),\n.my-table-component td:nth-child(1) {\n  /* index */\n  min-width: 10px;\n}\n.my-table-component th:nth-child(3),\n.my-table-component td:nth-child(3) {\n  /* startTime */\n  min-width: 60px;\n}\n.my-table-component th:nth-child(4),\n.my-table-component td:nth-child(4) {\n  /* results */\n  min-width: 120px;\n}\n\n.my-table-component.bordered th,\n.my-table-component.bordered td {\n  border-bottom: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n/* Bordered style */\n.my-table-component.grid th,\n.my-table-component.grid td {\n  border: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n.my-table-component.grid th {\n  border-bottom-width: 1px; /* Ensure bottom border is consistent */\n}\n\n.my-table-component.grid {\n  border: 1px solid var(--emw--color-gray-100, #e6e6e6); /* Outer border */\n  border-right-width: 0;\n  border-bottom-width: 0;\n}\n\n.my-table-component.grid th:last-child,\n.my-table-component.grid td:last-child {\n  border-right: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n.my-table-component.grid tr:last-child td {\n  border-bottom: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n/* Striped style */\n.my-table-component.striped tbody tr:nth-child(even) td {\n  background-color: var(--emw--color-background-secondary, #f5f5f5);\n}\n\n/* Hover (optional, but nice) */\n.my-table-component tbody tr:hover td {\n  background-color: var(--emw--color-background-secondary, #f5f5f5);\n}\n\n.flex {\n  display: flex;\n}\n\n.justify-end {\n  justify-content: flex-end;\n}\n\n.gap-1 {\n  gap: 4px;\n}\n\n.justify-between {\n  justify-content: space-between;\n}\n\n.align-center {\n  align-items: center;\n}\n\n.gap-1 {\n  gap: 0.5rem;\n}\n\n.btn {\n  color: var(--emw--color-typography, #000);\n  background: var(--emw--color-background, #fff);\n  font-size: 14px;\n  transition: all 0.2s ease;\n}\n.btn:hover {\n  cursor: pointer;\n}\n\n.btn:hover {\n  background-color: var(--emw--color-gray-100, #e6e6e6);\n}\n\n.btn.disabled {\n  opacity: 0.5;\n  pointer-events: none;\n}\n.btn.disabled:hover {\n  cursor: not-allowed !important;\n}\n\n.LotteryTippingTicketBet__tableToolbar {\n  width: 100%;\n  margin-bottom: 1rem;\n}\n\n.LotteryTippingTicketBet__tableToolbar--item {\n  margin-right: 2rem;\n}\n.LotteryTippingTicketBet__tableToolbar--item.mr-0 {\n  margin-right: 0rem !important;\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup {\n  flex-basis: 2rem;\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  border-radius: 8px;\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 2rem;\n  height: 2rem;\n  background-color: var(--emw--color-background-secondary, #f5f5f5);\n  color: var(--emw--color-typography, #000);\n  border-radius: 8px;\n  border: none;\n  transition: all 0.2s ease-in-out;\n  cursor: pointer;\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item:hover {\n  transform: scale(1.1);\n  box-shadow: 0 6px 14px var(--emw-calender-curday-box-shadow, rgba(0, 0, 0, 0.09));\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item .icon {\n  width: 20px;\n  height: 20px;\n  transition: filter 0.2s ease-in-out;\n  filter: grayscale(0.3);\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item:hover .icon {\n  filter: grayscale(0);\n  transform: rotate(3deg);\n}\n\ndiv.border-line {\n  margin-top: 1rem;\n  height: 1px;\n  width: 100%;\n  box-sizing: border-box;\n  background-color: var(--emw--color-background-secondary, #f5f5f5);\n  transition: all 0.3s ease;\n}\n\n.LotteryTippingTicketBet__footer {\n  padding: 0.5rem;\n}\n\n.my-pagination {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  gap: 1rem;\n  font-size: 0.8rem;\n  color: var(--emw--color-typography-secondary, #333);\n}\n\n.my-pagination span {\n  font-weight: 500;\n  user-select: none;\n}\n\n.my-pagination .btn {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 2rem;\n  height: 2rem;\n  border-radius: 50%;\n  border: none;\n  transition: all 0.3s ease;\n  cursor: pointer;\n  opacity: 0.9;\n  color: var(--emw--color-typography, #000);\n  background-color: var(--emw--color-background-secondary, #f5f5f5);\n}\n\n.my-pagination .btn .icon {\n  width: 20px;\n  height: 20px;\n  transition: transform 0.2s ease;\n}\n\n.my-pagination .btn:hover {\n  transform: scale(1.1);\n  box-shadow: 0 6px 14px var(--emw-calender-curday-box-shadow, rgba(0, 0, 0, 0.09));\n}\n\n.my-pagination .btn.disabled {\n  background-color: var(--emw--color-background-tertiary, #ccc);\n  cursor: not-allowed;\n  opacity: 0.5;\n  transform: scale(1);\n}\n\n.match-info-item {\n  display: flex;\n}\n\n.match-info-item-label {\n  margin-right: 6px;\n}\n\n.info-icon:hover {\n  cursor: pointer;\n}\n\n.LotteryTippingTicketBet__empty p {\n  text-align: center;\n}\n\n.no-wrap {\n  white-space: nowrap;\n  overflow: hidden;\n}\n\n.eventNameContainer__item--title {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: 300px;\n}\n@container (max-width: 600px) {\n  .eventNameContainer__item--title {\n    max-width: 180px;\n  }\n}\n@container (max-width: 500px) {\n  .eventNameContainer__item--title {\n    max-width: 150px;\n  }\n}\n@container (max-width: 400px) {\n  .eventNameContainer__item--title {\n    max-width: 100px;\n  }\n}\n@container (max-width: 330px) {\n  .eventNameContainer__item--title {\n    max-width: 70px;\n  }\n}\n\n.LotteryTippingTicketBet__main {\n  perspective: 800px;\n  will-change: transform, opacity;\n}\n\n@container (max-width: 520px) {\n  .LotteryTippingTicketBet__main {\n    flex-wrap: wrap;\n    justify-content: center;\n  }\n  .LotteryTippingTicketBet__tableToolbar--item {\n    margin-right: 0 !important;\n  }\n}\n/* Fade-In Keyframes */\n@keyframes fadeInLeft {\n  from {\n    opacity: 0;\n    transform: translateX(100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n/* Fade-Out Keyframes */\n@keyframes fadeOut {\n  from {\n    opacity: 1;\n  }\n  to {\n    opacity: 0;\n  }\n}\n@keyframes fadeInRight {\n  from {\n    opacity: 0;\n    transform: translateX(-100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateX(0);\n  }\n}\n@keyframes fadeInUp {\n  from {\n    opacity: 0;\n    transform: translateY(100%);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n@-webkit-keyframes slide-left {\n  0% {\n    -webkit-transform: translateX(0);\n    transform: translateX(0);\n  }\n  100% {\n    -webkit-transform: translateX(-100px);\n    transform: translateX(-100px);\n  }\n}\n@keyframes slide-left {\n  0% {\n    -webkit-transform: translateX(100%);\n    transform: translateX(100%);\n  }\n  100% {\n    -webkit-transform: translateX(0px);\n    transform: translateX(0px);\n  }\n}\n@-webkit-keyframes slide-right {\n  0% {\n    -webkit-transform: translateX(-100%);\n    transform: translateX(-100%);\n  }\n  100% {\n    -webkit-transform: translateX(0px);\n    transform: translateX(0px);\n  }\n}\n@keyframes slide-right {\n  0% {\n    -webkit-transform: translateX(-100px);\n    transform: translateX(-100px);\n  }\n  100% {\n    -webkit-transform: translateX(0);\n    transform: translateX(0);\n  }\n}\n@-webkit-keyframes slide-top {\n  0% {\n    -webkit-transform: translateY(-100px);\n    transform: translateY(-100px);\n  }\n  100% {\n    -webkit-transform: translateY(0px);\n    transform: translateY(0px);\n  }\n}\n@keyframes slide-top {\n  0% {\n    -webkit-transform: translateY(-100px);\n    transform: translateY(-100px);\n  }\n  100% {\n    -webkit-transform: translateY(0px);\n    transform: translateY(0px);\n  }\n}\n/* Apply to your card classes */\n.card-in-left {\n  -webkit-animation: slide-left 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n  animation: slide-left 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.card-out-left {\n  animation: fadeOut 0.2s ease-out both;\n}\n\n.card-in-right {\n  -webkit-animation: slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n  animation: slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.card-out-right {\n  animation: fadeOut 0.2s ease-out both;\n}\n\n.card-in-up {\n  -webkit-animation: slide-top 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n  animation: slide-top 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.card-out-down {\n  animation: fadeOut 0.2s ease-out both;\n}\n\n.loading-wrap {\n  margin: 20px 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 40vh;\n}\n.loading-wrap .dots-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 100%;\n  width: 100%;\n}\n.loading-wrap .dot {\n  height: 14px;\n  width: 14px;\n  margin-right: 14px;\n  border-radius: 14px;\n  background-color: var(--emw--color-gray-300, #333);\n  animation: pulse 1.5s infinite ease-in-out;\n}\n.loading-wrap .dot:last-child {\n  margin-right: 0;\n}\n.loading-wrap .dot:nth-child(1) {\n  animation-delay: -0.3s;\n}\n.loading-wrap .dot:nth-child(2) {\n  animation-delay: -0.1s;\n}\n.loading-wrap .dot:nth-child(3) {\n  animation-delay: 0.1s;\n}\n@keyframes pulse {\n  0% {\n    transform: scale(0.8);\n    background-color: var(--emw--color-gray-300, #333);\n  }\n  50% {\n    transform: scale(1.2);\n    background-color: var(--emw--color-gray-100, #e6e6e6);\n  }\n  100% {\n    transform: scale(0.8);\n    background-color: var(--emw--color-gray-150, #6f6f6f);\n  }\n}\n\n.lottery-selection-group-table-header .lottery-selection__button {\n  border: none;\n  background: none;\n}";
+const LotteryTippingBetSlipStyle0 = lotteryTippingBetSlipCss;
+
+const MyTable = ({ columns, dataSource, hideHead = false, grid = true, bordered = true }) => (h("table", { class: { bordered: bordered, grid: grid, 'my-table-component': true } }, !hideHead && (h("thead", null, h("tr", null, columns.map((column) => {
+    var _a;
+    return (h("th", { key: column.value, style: { width: column.width + '%', textAlign: column.align } }, typeof column.title === 'string' ? column.title : (_a = column.title) === null || _a === void 0 ? void 0 : _a.call(column)));
+})))), h("tbody", null, dataSource.map((row, index) => (h("tr", { key: index }, columns.map((column) => (h("td", { key: column.value, style: { width: column.width + '%', textAlign: column.align }, class: { 'no-wrap': column.nowrap } }, column.render ? column.render(row, row[column.value], index) : row[column.value])))))))));
+const LotteryTippingBetSlip = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.selectionChangeHandler = createEvent(this, "lotteryTippingBetSelectionChange", 7);
+        this.clearAll = createEvent(this, "lotteryTippingBetClearAll", 7);
+        this.addLine = createEvent(this, "lotteryTippingBetAddLine", 7);
+        this.removeLine = createEvent(this, "lotteryTippingBetRemoveLine", 7);
+        this.pageChange = createEvent(this, "lotteryTippingBetPageChange", 7);
+        this.columns = [
+            { title: '', value: 'index', width: 3 },
+            {
+                title: '',
+                value: 'eventName',
+                width: 65,
+                render: (item, value) => this.renderEventName(item, value)
+            },
+            {
+                title: '',
+                value: 'startTime',
+                width: 22,
+                align: 'right',
+                nowrap: true,
+                render: (_, value) => formatDate({ date: value, format: 'ccc HH:mm' })
+            },
+            {
+                title: () => (h("lottery-selection-group", { language: this.language, "translation-url": this.translationUrl, "client-styling": this.clientStyling, clientStylingUrl: this.clientStylingUrl, type: "preview", splitToken: this.bulletTextsSplitToken, "bullet-texts": this.bulletNames, bulletTextType: "text", hasBackground: false, hasBorder: false })),
+                value: 'results',
+                width: 10,
+                render: (_, __, curRow) => (h("lottery-selection-group", { language: this.language, "translation-url": this.translationUrl, "client-styling": this.clientStyling, clientStylingUrl: this.clientStylingUrl, "mb-source": this.mbSource, selectionGroupId: `${this.currentPage - 1}${this.bulletTextsSplitToken}${curRow}`, type: this.readPretty ? 'preview' : 'bet', "selected-bullet-texts": this.selectedBulletTexts(curRow), "disabled-bullet-texts": this.getBulletDisabledOptions(curRow), "max-selected-count": this.mode === 'single' ? 1 : this.bulletTexts.split(this.bulletTextsSplitToken).length, "bullet-texts": this.bulletTexts, splitToken: this.bulletTextsSplitToken, bulletTextType: "text" }))
+            }
+        ];
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.translationUrl = '';
+        this.language = 'en';
+        this.totalPages = 1;
+        this.minTotalPages = 1;
+        this.maxTotalPages = 3;
+        this.bulletTexts = '1,X,2';
+        this.bulletNames = 'Home,Draw,Away';
+        this.bulletTextsSplitToken = ',';
+        this.showClearButton = true;
+        this.addImage = renderIconDefinitionToSVGElement(PlusSquareOutlined$1, {
+            extraSVGAttrs: { width: '20px', height: '20px', fill: 'currentColor' }
+        });
+        this.deleteImage = renderIconDefinitionToSVGElement(DeleteOutlined$1, {
+            extraSVGAttrs: { width: '20px', height: '20px', fill: 'currentColor' }
+        });
+        this.infoImage = renderIconDefinitionToSVGElement(InfoCircleOutlined$1, {
+            extraSVGAttrs: { width: '16px', height: '16px', fill: 'currentColor' }
+        });
+        this.leftImage = renderIconDefinitionToSVGElement(LeftOutlined$1, {
+            extraSVGAttrs: { width: '20px', height: '20px', fill: 'currentColor' }
+        });
+        this.rightImage = renderIconDefinitionToSVGElement(RightOutlined$1, {
+            extraSVGAttrs: { width: '20px', height: '20px', fill: 'currentColor' }
+        });
+        this.mode = 'multi';
+        this.readPretty = false;
+        this.ticketDataSourceStr = '[]';
+        this.bulletSelectionsLineGroupStr = '[]';
+        this.currentPage = 1;
+        this.bulletSelectionsLineGroup = [];
+        this.ticketDataSource = [];
+        this.betIsLoading = false;
+        this.betHasErrors = false;
+    }
+    renderEventName(_, value) {
+        const [homeName, awayName] = value.split(' vs ');
+        return (h("div", { class: "flex gap-1 eventNameContainer__item" }, h("span", { class: "eventNameContainer__item--title" }, value), h("app-tooltip", null, h("span", { slot: "trigger", class: "icon info-icon", innerHTML: this.infoImage, style: { width: '18px' } }), h("div", { slot: "content" }, h("div", { class: "match-info" }, h("div", { class: "match-info-item" }, h("div", { class: "match-info-item-label" }, translate$1('homeTeam', this.language)), h("div", { class: "match-info-item-value" }, homeName)), h("div", { class: "match-info-item" }, h("div", { class: "match-info-item-label" }, translate$1('awayTeam', this.language)), h("div", { class: "match-info-item-value" }, awayName)))))));
+    }
+    selectedBulletTexts(curRow) {
+        var _a, _b, _c;
+        return ((_c = (_b = (_a = this.bulletSelectionsLineGroup) === null || _a === void 0 ? void 0 : _a[this.currentPage - 1]) === null || _b === void 0 ? void 0 : _b[curRow]) === null || _c === void 0 ? void 0 : _c.join(this.bulletTextsSplitToken)) || '';
+    }
+    getBulletDisabledOptions(curRow) {
+        const { outcomes } = this.ticketDataSource[curRow];
+        const curActiveOptions = outcomes.map((ev) => ev.betOn);
+        const bulletText = this.bulletTexts.split(this.bulletTextsSplitToken);
+        const disabledOptions = bulletText.filter((bullet) => !curActiveOptions.includes(bullet));
+        return disabledOptions.join(this.bulletTextsSplitToken);
+    }
+    handleNewTranslations() {
+        resolveTranslationUrl$1(this.translationUrl);
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    parseTicketDataSource(newValue) {
+        try {
+            this.ticketDataSource = JSON.parse(newValue || '[]');
+        }
+        catch (e) {
+            console.error('Failed to parse ticketDataSourceStr:', e);
+        }
+    }
+    parseBulletSelectionsLineGroup(newValue) {
+        try {
+            this.bulletSelectionsLineGroup = JSON.parse(newValue || '[]');
+        }
+        catch (e) {
+            console.error('Failed to parse bulletSelectionsLineGroupStr:', e);
+        }
+    }
+    connectedCallback() {
+        this.boundMessageHandler = this.messageHandler.bind(this);
+        window.addEventListener('message', this.boundMessageHandler);
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+        if (this.boundMessageHandler) {
+            window.removeEventListener('message', this.boundMessageHandler);
+        }
+    }
+    messageHandler() {
+        // This handler can be kept for other potential messages, or removed if no longer needed.
+    }
+    componentWillLoad() {
+        resolveTranslationUrl$1(this.translationUrl);
+        this.parseTicketDataSource(this.ticketDataSourceStr);
+        this.parseBulletSelectionsLineGroup(this.bulletSelectionsLineGroupStr);
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleClearAll() {
+        this.clearAll.emit();
+    }
+    bulletGroupUpdateSelectionHandler(event) {
+        event.stopPropagation();
+        const { newSelectedBulletTexts, selectionGroupId } = event.detail;
+        if (!selectionGroupId) {
+            console.error('Miss selectionGroupId');
+            return;
+        }
+        const idParts = selectionGroupId.split(this.bulletTextsSplitToken);
+        if (idParts.length !== 2) {
+            console.error('Invalid selectionGroupId format:', selectionGroupId);
+            return;
+        }
+        const [boardId, matchId] = idParts;
+        this.selectionChangeHandler.emit({
+            newSelections: newSelectedBulletTexts.split(this.bulletTextsSplitToken),
+            matchId,
+            boardId
+        });
+    }
+    prevPage() {
+        const doPrev = () => {
+            this.pageChange.emit({ newPage: this.currentPage - 1 });
+        };
+        this.swapCard('prev', doPrev);
+    }
+    nextPage() {
+        const doNext = () => {
+            this.pageChange.emit({ newPage: this.currentPage + 1 });
+        };
+        this.swapCard('next', doNext);
+    }
+    handleAddLine() {
+        const doAdd = () => {
+            this.addLine.emit();
+        };
+        this.swapCard('add', doAdd);
+    }
+    handleRemoveLine() {
+        this.removeLine.emit({
+            boardId: this.currentPage - 1,
+            close: (onClose) => {
+                onClose && this.swapCard('remove', onClose);
+            }
+        });
+    }
+    swapCard(action, cb) {
+        const wrapper = this.mainContainer;
+        if (!wrapper)
+            return;
+        // Prevent new animations if one is already in progress
+        const isAnimating = Array.from(wrapper.classList).some((cls) => cls.startsWith('card-out-') || cls.startsWith('card-in-'));
+        if (isAnimating) {
+            return;
+        }
+        const map = {
+            next: { out: 'card-out-left', in: 'card-in-left' },
+            prev: { out: 'card-out-right', in: 'card-in-right' },
+            remove: { out: 'card-out-down', in: 'card-in-right' },
+            add: { out: 'card-out-left', in: 'card-in-up' }
+        };
+        const { out: outCls, in: inCls } = map[action];
+        wrapper.classList.add(outCls);
+        wrapper.addEventListener('animationend', () => {
+            wrapper.classList.remove(outCls);
+            cb();
+            const newWrapper = this.mainContainer;
+            if (!newWrapper)
+                return;
+            newWrapper.classList.add(inCls);
+            newWrapper.addEventListener('animationend', () => newWrapper.classList.remove(inCls), { once: true });
+        }, { once: true });
+    }
+    renderLoading() {
+        return (h("div", { class: "loading-wrap" }, h("section", { class: "dots-container" }, h("div", { class: "dot" }), h("div", { class: "dot" }), h("div", { class: "dot" }), h("div", { class: "dot" }), h("div", { class: "dot" }))));
+    }
+    renderErrorContent() {
+        return h("p", null, translate$1('error', this.language));
+    }
+    renderEmptyContent() {
+        return (h("div", { class: "LotteryTippingTicketBet__empty" }, h("p", null, translate$1('noData', this.language))));
+    }
+    renderPageFooter() {
+        if (this.totalPages <= 1)
+            return null;
+        return (h("div", null, h("div", { class: 'border-line' }), h("div", { class: "LotteryTippingTicketBet__footer" }, h("div", { class: "my-pagination flex justify-between" }, h("span", null, translate$1('lineInfo', this.language, { currentPage: this.currentPage, totalPages: this.totalPages })), h("div", { class: 'flex gap-1' }, h("button", { type: "button", class: `btn ${this.currentPage === 1 ? 'disabled' : ''}`, onClick: () => this.prevPage(), disabled: this.currentPage === 1 }, h("span", { class: "icon", innerHTML: this.leftImage })), h("button", { type: "button", class: `btn ${this.currentPage === this.totalPages ? 'disabled' : ''}`, onClick: () => this.nextPage(), disabled: this.currentPage === this.totalPages }, h("span", { class: "icon", innerHTML: this.rightImage })))))));
+    }
+    renderReadPrettyContent() {
+        var _a;
+        return (h("div", { class: "LotteryTippingTicketBet__main", ref: (el) => (this.mainContainer = el) }, h("div", { class: "table-scroll-wrapper" }, h(MyTable, { columns: this.columns, dataSource: ((_a = this.ticketDataSource) === null || _a === void 0 ? void 0 : _a.map((item, index) => (Object.assign(Object.assign({}, item), { index: index + 1 })))) || [], hideHead: false, grid: false, bordered: false })), this.renderPageFooter()));
+    }
+    renderDefaultContent() {
+        var _a;
+        const lineOperatorAddShow = this.totalPages < this.maxTotalPages && this.currentPage === this.totalPages ? true : false;
+        const lineOperatorRemoveShow = this.totalPages > this.minTotalPages ? true : false;
+        return (h("div", null, h("div", { class: "LotteryTippingTicketBet__tableToolbar flex justify-end gap-1" }, this.showClearButton && (h("lottery-button", { class: {
+                'LotteryTippingTicketBet__tableToolbar--item': true,
+                'mr-0': !(lineOperatorAddShow || lineOperatorRemoveShow)
+            }, text: translate$1('clearAll', this.language), onClick: () => this.handleClearAll(), variant: "text", clientStyling: this.clientStyling || '' }))), h("div", { class: "flex align-center LotteryTippingTicketBet__main", ref: (el) => (this.mainContainer = el) }, h("div", { class: "table-scroll-wrapper" }, h(MyTable, { columns: this.columns, dataSource: ((_a = this.ticketDataSource) === null || _a === void 0 ? void 0 : _a.map((item, index) => (Object.assign(Object.assign({}, item), { index: index + 1 })))) || [], hideHead: false, grid: false, bordered: false })), (lineOperatorAddShow || lineOperatorRemoveShow) && (h("div", { class: "LotteryTippingTicketBet__lineOperatorGroup" }, lineOperatorAddShow && (h("button", { type: "button", class: {
+                'LotteryTippingTicketBet__lineOperatorGroup--item': true
+            }, onClick: () => this.handleAddLine() }, h("span", { class: "icon", innerHTML: this.addImage }))), lineOperatorRemoveShow && (h("button", { type: "button", class: {
+                'LotteryTippingTicketBet__lineOperatorGroup--item': true
+            }, onClick: () => this.handleRemoveLine() }, h("span", { class: "icon", innerHTML: this.deleteImage })))))), this.renderPageFooter()));
+    }
+    render() {
+        let content;
+        if (this.betIsLoading) {
+            content = this.renderLoading();
+        }
+        else if (this.betHasErrors) {
+            content = this.renderErrorContent();
+        }
+        else if (this.ticketDataSource.length === 0) {
+            content = this.renderEmptyContent();
+        }
+        else if (this.readPretty) {
+            content = this.renderReadPrettyContent();
+        }
+        else {
+            content = this.renderDefaultContent();
+        }
+        return (h("div", { key: '425f7f3d185616af3189857a9159868e3c57f100', ref: (el) => (this.stylingContainer = el), class: "LotteryTippingTicketBet__container" }, content));
+    }
+    static get watchers() { return {
+        "translationUrl": ["handleNewTranslations"],
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"],
+        "ticketDataSourceStr": ["parseTicketDataSource"],
+        "bulletSelectionsLineGroupStr": ["parseBulletSelectionsLineGroup"]
+    }; }
+};
+LotteryTippingBetSlip.style = LotteryTippingBetSlipStyle0;
+
+const DEFAULT_LANGUAGE = 'en';
+const SUPPORTED_LANGUAGES = ['ro', 'en', 'fr', 'ar', 'hr'];
+const TRANSLATIONS = {
+    en: {
+        cancel: 'Cancel',
+        confirm: 'Confirm'
+    },
+    ro: {
+        cancel: 'Anulează',
+        confirm: 'Confirmă'
+    },
+    fr: {
+        cancel: 'Annuler',
+        confirm: 'Confirmer'
+    },
+    ar: {
+        cancel: 'إلغاء',
+        confirm: 'تأكيد'
+    },
+    hr: {
+        cancel: 'Odustani',
+        confirm: 'Potvrdi'
+    }
+};
+const translate = (key, customLang) => {
+    const lang = customLang;
+    return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
+};
+const getTranslations = (data) => {
+    Object.keys(data).forEach((item) => {
+        for (let key in data[item]) {
+            TRANSLATIONS[item][key] = data[item][key];
+        }
+    });
+};
+const resolveTranslationUrl = async (translationUrl) => {
+    if (translationUrl) {
+        try {
+            const response = await fetch(translationUrl);
+            if (!response.ok) {
+                throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            const translations = await response.json();
+            getTranslations(translations);
+        }
+        catch (error) {
+            console.error('Failed to fetch or parse translations from URL:', error);
+        }
+    }
+};
+
+const lotteryTippingDialogCss = ".dialog-wrapper{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;visibility:hidden;opacity:1;z-index:199}.dialog-wrapper-visible{visibility:visible}.mask{position:fixed;inset:0;background:var(--emw--color-mask-dialog-background, rgba(0, 0, 0, 0.5));opacity:0;z-index:1000;transition:opacity var(--duration) linear}.mask-enter{opacity:1}.mask-leave{opacity:0}.dialog{position:relative;background:var(--emw--color-background, #fff);border-radius:12px;box-shadow:0 4px 32px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15));opacity:0;transform:scale(0.9);transition:all var(--duration) linear;width:100%;max-width:100vw;overflow:hidden;z-index:1000}.dialog-enter{opacity:1;transform:scale(1)}.dialog-leave{opacity:0}.dialog.fullscreen{width:100vw !important;height:100vh;overflow:auto;max-height:none;border-radius:0;overflow:hidden}.dialog-header{padding:16px 16px 0 16px;display:flex;justify-content:space-between;align-items:center}.dialog-header .dialog-title{margin:0;font-size:1.25rem;font-weight:500;color:var(--emw--color-typography, #000)}.dialog-header .close-btn{background:transparent;border:none;font-size:1.5rem;width:2rem;height:2rem;color:var(--emw--color-gray-150, #6f6f6f);cursor:pointer;border-radius:4px}.dialog-header .close-btn:hover{background:var(--emw--color-gray-50, #f5f5f5);color:var(--emw--color-gray-300, #333)}.dialog-content{padding:24px;font-size:0.95rem;line-height:1.6;color:var(--emw--color-dialog-typography, #000);flex:1;overflow-y:auto;max-height:calc(100vh - 200px)}.dialog.fullscreen .dialog-content{max-height:none}.dialog-footer{padding:0 16px 16px 16px;display:flex;justify-content:center;gap:12px}.dialog-footer .cancel-btn,.dialog-footer .confirm-btn{padding:10px 24px;min-width:60px;border-radius:6px;font-size:0.9rem;cursor:pointer;transition:all 0.3s linear}.dialog-footer .cancel-btn{border:var(--emw--button-border, 1px solid rgba(221, 221, 221, 0.8666666667));background-color:var(--emw--color-background, #fff);color:var(--emw--color-typography, #000)}.dialog-footer .cancel-btn:hover{background-color:var(--emw--color-background-tertiary, #ccc)}.dialog-footer .confirm-btn{border:none;color:var(--emw--color-typography-normalized, #ffffff);background:var(--emw--color-primary, #009993)}.dialog-footer .confirm-btn:hover{background:var(--emw--color-primary-variant, #004d4a)}@media screen and (max-width: 480px){.dialog.fullscreen .dialog-content{padding:12px}}.Loading{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.Loading svg{animation:spin 1s linear infinite;transform-origin:center}@keyframes spin{100%{transform:rotate(360deg)}}";
+const LotteryTippingDialogStyle0 = lotteryTippingDialogCss;
+
+const LotteryTippingDialog = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.open = createEvent(this, "open", 7);
+        this.close = createEvent(this, "close", 7);
+        this.confirm = createEvent(this, "confirm", 7);
+        this.cancel = createEvent(this, "cancel", 7);
+        this.wasVisible = false;
+        this.mbSource = undefined;
+        this.clientStyling = '';
+        this.clientStylingUrl = '';
+        this.visible = undefined;
+        this.dialogTitle = '';
+        this.width = '520px';
+        this.closable = true;
+        this.mask = true;
+        this.maskClosable = true;
+        this.animationDuration = 300;
+        this.fullscreen = false;
+        this.showFooter = true;
+        this.showCancelBtn = true;
+        this.language = 'en';
+        this.translationUrl = undefined;
+        this.dialogClass = undefined;
+        this.dialogStyle = undefined;
+        this.confirmLoading = false;
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    componentWillLoad() {
+        if (this.translationUrl) {
+            resolveTranslationUrl(this.translationUrl);
+        }
+    }
+    componentWillUpdate() {
+        if (this.visible && !this.wasVisible) {
+            this.disableBodyScroll();
+        }
+        else if (!this.visible && this.wasVisible) {
+            this.enableBodyScroll();
+        }
+        this.wasVisible = this.visible;
+    }
+    disconnectedCallback() {
+        this.enableBodyScroll();
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    disableBodyScroll() {
+        document.body.style.overflow = 'hidden';
+    }
+    enableBodyScroll() {
+        document.body.style.overflow = '';
+    }
+    handleClose() {
+        this.cancel.emit();
+    }
+    handleMaskClick() {
+        if (this.maskClosable) {
+            this.cancel.emit();
+        }
+    }
+    handleConfirm() {
+        this.confirm.emit();
+    }
+    render() {
+        const computedDialogStyle = Object.assign({ width: typeof this.width === 'number' ? `${this.width}px` : this.width, '--duration': `${this.animationDuration}ms` }, (this.dialogStyle || {}));
+        const dialogWrapperClass = ['dialog-wrapper', this.visible ? 'dialog-wrapper-visible' : ''];
+        const maskClass = ['mask', this.visible ? 'mask-enter' : 'mask-leave'];
+        const computedDialogClass = [
+            'dialog',
+            this.visible ? 'dialog-enter' : 'dialog-leave',
+            this.fullscreen ? 'fullscreen' : '',
+            this.dialogClass
+        ]
+            .filter(Boolean)
+            .join(' ');
+        const contentStyle = {
+            maxHeight: 'calc(100vh - 62px)',
+            overflowY: 'auto'
+        };
+        return (h("div", { key: '05dd671f10bdebda6f138e8f8039f4bc0533fe98', class: dialogWrapperClass.join(' '), ref: (el) => (this.stylingContainer = el) }, h("div", { key: '6e814e02770149de5495617039750461fc0a42d1', class: maskClass.join(' '), onClick: this.handleMaskClick.bind(this) }), h("div", { key: '4cbc5db20317ef1b0808fc4a91a53fa8b86c5f4f', part: "dialog", class: computedDialogClass, style: computedDialogStyle, role: "dialog", "aria-modal": "true", "aria-labelledby": "dialog-title" }, (this.dialogTitle || this.closable) && (h("div", { key: '85dc705676a37e6ea2828a7b683fc54b0eb77d17', class: "dialog-header" }, h("h2", { key: '85b7472d2b72801dfae19a24fc2018f3c1f1529a', id: "dialog-title", class: "dialog-title" }, this.dialogTitle), this.closable && (h("button", { key: '8089aaecfe511558055ee9f64214ff97030eb2a9', class: "close-btn", onClick: this.handleClose.bind(this) }, "x")))), h("div", { key: '776255540f30d757caa3fcaee747c79ac638ae76', class: "dialog-content", style: contentStyle }, h("slot", { key: '5ef964615b6ab70a9e561f8efac8fe952fe47b4e' })), this.showFooter && (h("div", { key: '8927a0991d916caf7852d58db996b9818687da30', class: "dialog-footer" }, h("slot", { key: '84de0306994ec62220ae30fa2881dadbae5544ea', name: "footer" }, this.showCancelBtn && (h("button", { key: 'ee87b8c3918c1f4d007923a2498142b3af2740a0', class: "cancel-btn", onClick: this.handleClose.bind(this) }, translate('cancel', this.language))), h("button", { key: '935cff86381b21fff07c2d4156b29779c50e5ce3', class: "confirm-btn", onClick: this.handleConfirm.bind(this), disabled: this.confirmLoading }, this.confirmLoading ? (h("div", { class: "Loading", innerHTML: renderIconDefinitionToSVGElement(LoadingOutlined$1, {
+                extraSVGAttrs: { width: '20px', height: '20px', fill: 'currentColor' }
+            }) })) : (translate('confirm', this.language)))))))));
+    }
+    get el() { return getElement(this); }
+    static get watchers() { return {
+        "clientStyling": ["handleClientStylingChange"],
+        "clientStylingUrl": ["handleClientStylingUrlChange"],
+        "mbSource": ["handleMbSourceChange"]
+    }; }
+};
+LotteryTippingDialog.style = LotteryTippingDialogStyle0;
+
+export { Tooltip as app_tooltip, HelperCountDown as helper_count_down, LotteryBanner as lottery_banner, LotteryButton as lottery_button, LotteryOrderSummary as lottery_order_summary, LotterySelection as lottery_selection, LotterySelectionGroup as lottery_selection_group, LotteryTippingBetSlip as lottery_tipping_bet_slip, LotteryTippingDialog as lottery_tipping_dialog };