@everymatrix/lottery-game-page 0.1.27 → 1.0.70

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (113) hide show
  1. package/dist/cjs/app-globals-3a1e7e63.js +5 -0
  2. package/dist/cjs/{helper-filters_2.cjs.entry.js → helper-accordion_13.cjs.entry.js} +13401 -9890
  3. package/dist/cjs/helper-pagination.cjs.entry.js +197 -189
  4. package/dist/cjs/index-f3851683.js +1345 -0
  5. package/dist/cjs/loader.cjs.js +7 -13
  6. package/dist/cjs/lottery-game-page.cjs.js +17 -11
  7. package/dist/collection/collection-manifest.json +4 -10
  8. package/dist/collection/components/lottery-game-page/index.js +1 -0
  9. package/dist/collection/components/lottery-game-page/lottery-game-page.css +11 -2
  10. package/dist/collection/components/lottery-game-page/lottery-game-page.js +579 -594
  11. package/dist/collection/utils/locale.utils.js +118 -95
  12. package/dist/collection/utils/utils.js +4 -4
  13. package/dist/esm/app-globals-0f993ce5.js +3 -0
  14. package/dist/esm/{helper-filters_2.entry.js → helper-accordion_13.entry.js} +13391 -9891
  15. package/dist/esm/helper-pagination.entry.js +197 -189
  16. package/dist/esm/index-8248702b.js +1316 -0
  17. package/dist/esm/loader.js +7 -13
  18. package/dist/esm/lottery-game-page.js +14 -11
  19. package/dist/lottery-game-page/lottery-game-page.esm.js +1 -1
  20. package/dist/lottery-game-page/p-46aaa562.entry.js +1 -0
  21. package/dist/lottery-game-page/p-8f2c63c7.js +2 -0
  22. package/dist/lottery-game-page/p-bd89bbf0.entry.js +3567 -0
  23. package/dist/lottery-game-page/p-e1255160.js +1 -0
  24. package/dist/stencil.config.dev.js +17 -0
  25. package/dist/stencil.config.js +14 -42
  26. package/dist/types/Users/raul.vasile/workspace/everymatrix/widgets-monorepo/packages/stencil/lottery-game-page/.stencil/packages/stencil/lottery-game-page/stencil.config.d.ts +2 -0
  27. package/dist/types/Users/raul.vasile/workspace/everymatrix/widgets-monorepo/packages/stencil/lottery-game-page/.stencil/packages/stencil/lottery-game-page/stencil.config.dev.d.ts +2 -0
  28. package/dist/types/components/lottery-game-page/index.d.ts +1 -0
  29. package/dist/types/components/lottery-game-page/lottery-game-page.d.ts +99 -90
  30. package/dist/types/components.d.ts +28 -2
  31. package/dist/types/stencil-public-runtime.d.ts +142 -33
  32. package/loader/cdn.js +1 -3
  33. package/loader/index.cjs.js +1 -3
  34. package/loader/index.d.ts +13 -1
  35. package/loader/index.es2017.js +1 -3
  36. package/loader/index.js +1 -3
  37. package/loader/package.json +1 -0
  38. package/package.json +13 -7
  39. package/dist/cjs/helper-accordion.cjs.entry.js +0 -124
  40. package/dist/cjs/helper-modal.cjs.entry.js +0 -76
  41. package/dist/cjs/helper-tab.cjs.entry.js +0 -68
  42. package/dist/cjs/helper-tabs.cjs.entry.js +0 -74
  43. package/dist/cjs/index-cd44e726.js +0 -1324
  44. package/dist/cjs/lottery-bullet_2.cjs.entry.js +0 -270
  45. package/dist/cjs/lottery-draw-results-history.cjs.entry.js +0 -198
  46. package/dist/cjs/lottery-game-details.cjs.entry.js +0 -51
  47. package/dist/cjs/lottery-game-page.cjs.entry.js +0 -427
  48. package/dist/cjs/lottery-ticket-controller.cjs.entry.js +0 -116
  49. package/dist/cjs/lottery-ticket.cjs.entry.js +0 -201
  50. package/dist/collection/components/lottery-game-page/assets/chrono_desktop.png +0 -0
  51. package/dist/collection/components/lottery-game-page/assets/chrono_lottery_mobile.png +0 -0
  52. package/dist/components/helper-accordion.js +0 -6
  53. package/dist/components/helper-accordion2.js +0 -151
  54. package/dist/components/helper-filters.js +0 -6
  55. package/dist/components/helper-filters2.js +0 -22394
  56. package/dist/components/helper-modal.js +0 -6
  57. package/dist/components/helper-modal2.js +0 -94
  58. package/dist/components/helper-pagination.js +0 -251
  59. package/dist/components/helper-tab.js +0 -6
  60. package/dist/components/helper-tab2.js +0 -87
  61. package/dist/components/helper-tabs.js +0 -6
  62. package/dist/components/helper-tabs2.js +0 -103
  63. package/dist/components/index.d.ts +0 -26
  64. package/dist/components/index.js +0 -1
  65. package/dist/components/lottery-bullet.js +0 -6
  66. package/dist/components/lottery-bullet2.js +0 -92
  67. package/dist/components/lottery-draw-results-history.js +0 -6
  68. package/dist/components/lottery-draw-results-history2.js +0 -256
  69. package/dist/components/lottery-draw-results.js +0 -6
  70. package/dist/components/lottery-draw-results2.js +0 -335
  71. package/dist/components/lottery-game-details.js +0 -6
  72. package/dist/components/lottery-game-details2.js +0 -85
  73. package/dist/components/lottery-game-page.d.ts +0 -11
  74. package/dist/components/lottery-game-page.js +0 -542
  75. package/dist/components/lottery-grid.js +0 -6
  76. package/dist/components/lottery-grid2.js +0 -237
  77. package/dist/components/lottery-ticket-controller.js +0 -6
  78. package/dist/components/lottery-ticket-controller2.js +0 -168
  79. package/dist/components/lottery-ticket.js +0 -6
  80. package/dist/components/lottery-ticket2.js +0 -244
  81. package/dist/esm/helper-accordion.entry.js +0 -120
  82. package/dist/esm/helper-modal.entry.js +0 -72
  83. package/dist/esm/helper-tab.entry.js +0 -64
  84. package/dist/esm/helper-tabs.entry.js +0 -70
  85. package/dist/esm/index-d1baacd4.js +0 -1296
  86. package/dist/esm/lottery-bullet_2.entry.js +0 -265
  87. package/dist/esm/lottery-draw-results-history.entry.js +0 -194
  88. package/dist/esm/lottery-game-details.entry.js +0 -47
  89. package/dist/esm/lottery-game-page.entry.js +0 -423
  90. package/dist/esm/lottery-ticket-controller.entry.js +0 -112
  91. package/dist/esm/lottery-ticket.entry.js +0 -197
  92. package/dist/esm/polyfills/core-js.js +0 -11
  93. package/dist/esm/polyfills/css-shim.js +0 -1
  94. package/dist/esm/polyfills/dom.js +0 -79
  95. package/dist/esm/polyfills/es5-html-element.js +0 -1
  96. package/dist/esm/polyfills/index.js +0 -34
  97. package/dist/esm/polyfills/system.js +0 -6
  98. package/dist/lottery-game-page/assets/chrono_desktop.png +0 -0
  99. package/dist/lottery-game-page/assets/chrono_lottery_mobile.png +0 -0
  100. package/dist/lottery-game-page/p-023325a2.entry.js +0 -1
  101. package/dist/lottery-game-page/p-04fbc8fd.entry.js +0 -1
  102. package/dist/lottery-game-page/p-256b151c.entry.js +0 -1
  103. package/dist/lottery-game-page/p-381b5507.entry.js +0 -1
  104. package/dist/lottery-game-page/p-3f8b6ad9.entry.js +0 -1
  105. package/dist/lottery-game-page/p-4274053c.entry.js +0 -1
  106. package/dist/lottery-game-page/p-4f81cd37.entry.js +0 -1
  107. package/dist/lottery-game-page/p-5c389034.entry.js +0 -1
  108. package/dist/lottery-game-page/p-ca8430a0.entry.js +0 -2849
  109. package/dist/lottery-game-page/p-d6f76e8d.entry.js +0 -1
  110. package/dist/lottery-game-page/p-e765c7d9.js +0 -1
  111. package/dist/lottery-game-page/p-ea251208.entry.js +0 -1
  112. package/dist/lottery-game-page/p-f6fcc22c.entry.js +0 -1
  113. package/dist/types/Users/user/workspace/everymatrix/widgets-stencil/packages/lottery-game-page/.stencil/packages/lottery-game-page/stencil.config.d.ts +0 -2
@@ -1,201 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-cd44e726.js');
6
-
7
- const DEFAULT_LANGUAGE = 'en';
8
- const SUPPORTED_LANGUAGES = ['ro', 'en'];
9
- const TRANSLATIONS = {
10
- en: {
11
- loading: 'Loading, please wait ...',
12
- error: 'It was an error while trying to fetch the data',
13
- grid: 'Grid',
14
- multiplier: 'Multiplier',
15
- numberOfDraws: 'Number of draws',
16
- wagerPerDraw: 'Wager per draw',
17
- resetButton: 'Reset',
18
- autoButton: 'I feel lucky'
19
- },
20
- ro: {
21
- loading: 'Se incarca, va rugam asteptati ...',
22
- error: 'A fost o eroare in timp ce asteptam datele',
23
- grid: 'Grid',
24
- multiplier: 'Multiplicator',
25
- numberOfDraws: 'Numarul de extrageri',
26
- wagerPerDraw: 'Pariul per extragere',
27
- resetButton: 'Reseteaza',
28
- autoButton: 'Ma simt norocos'
29
- },
30
- };
31
- const translate = (key, customLang) => {
32
- const lang = customLang;
33
- return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
34
- };
35
-
36
- const lotteryTicketCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.TicketTitle{font-size:16px;font-weight:bold}.ButtonContainer{display:flex;justify-content:flex-end}.Toggle{cursor:pointer;margin-top:20px;display:inline-block}.ToggleSwitch{display:inline-block;background:#707070;border-radius:16px;width:58px;height:24px;position:relative;vertical-align:middle;transition:background 0.25s}.ToggleSwitch:before,.ToggleSwitch:after{content:\"\"}.ToggleSwitch:before{display:block;background:linear-gradient(to bottom, #fff 0%, #F1F1F1 100%);border-radius:50%;box-shadow:0 0 0 1px rgba(0, 0, 0, 0.25);width:16px;height:16px;position:absolute;top:4px;left:4px;transition:left 0.25s}.Toggle:hover .ToggleSwitch:before{background:linear-gradient(to bottom, #fff 0%, #fff 100%);box-shadow:0 0 0 1px rgba(0, 0, 0, 0.5)}.ToggleCheckbox:checked+.ToggleSwitch{background:#00ABA4}.ToggleCheckbox:checked+.ToggleSwitch:before{left:38px}.ToggleCheckbox{position:absolute;visibility:hidden}.Label{margin-right:5px;position:relative;top:2px;font-size:14px;font-weight:lighter;color:#000}input[type=number]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.NumberInput,.WagerInput{margin-top:10px;display:inline-flex;align-items:center}.NumberInput,.NumberInput *{box-sizing:border-box}.NumberInput button{cursor:pointer;outline:none;-webkit-appearance:none;border:none;align-items:center;justify-content:center;height:20px;position:relative}.NumberInput button:after{display:inline-block;position:absolute;transform:translate(-50%, -50%) rotate(180deg);align-items:center;text-align:center}.NumberInput button.Plus:after{transform:translate(-50%, -50%) rotate(0deg);width:30px;display:inline-flex;align-items:center;text-align:center}.NumberInput input[type=number],.WagerInput input[type=number]{max-width:50px;display:inline-flex;align-items:center;padding:4px 10px;text-align:center}.NumberInput input[type=number] .WagerInputTitle,.WagerInput input[type=number] .WagerInputTitle{font-size:14px;color:#000;padding:10px}.InputDefault{background-color:#F1F1F1;border-radius:4px;padding:5px;border:solid 1px #D4D4D4;color:#707070}.AutoButton{cursor:pointer;display:inline-block;border-radius:4px;padding:8px 20px;width:max-content;margin:5px 0;border:1px solid #00958f;background:#FFF;color:#000;font-size:12px;transition:all 0.2s linear;text-transform:uppercase;text-align:center;letter-spacing:0}.AutoButton:active{background:#00958f;color:#FFF}.ResetButton{cursor:pointer;display:inline-block;border-radius:4px;padding:8px 20px;width:max-content;margin:5px 0;color:#000;font-size:12px;transition:all 0.2s linear;text-transform:uppercase;text-align:center;letter-spacing:0;background:#FF3D00;border:1px solid #FF3D00;color:#FFF}.ResetButton:hover{background:#FF6536;border:1px solid #FF3D00}.TicketGridBullets{background:#f1f1f1;border-radius:4px;padding:20px;margin-top:5px}.TicketGridBullets .TicketGridTitle{margin-top:0px}.Minus{border-radius:4px;width:30px;height:24px !important;margin-right:10px;color:#FFF;background:#009993}.Plus{border-radius:4px;width:30px;height:24px !important;margin-left:10px;color:#FFF;background:#009993}.SelectWrapper{width:auto;padding:5px;margin:0 auto;border:1px solid #ccc;border-radius:5px;position:relative}.SelectButton,.SelectOptions li{display:flex;align-items:center;cursor:pointer}.SelectButton{display:flex;padding:0 5px;border-radius:7px;align-items:center;justify-content:space-between;font-size:14px}.SelectButton span:first-child{padding-right:10px}.SelectExpand{transition:transform 0.3s linear;font-size:12px}.SelectActive .SelectExpand{transform:rotate(180deg)}.SelectContent{display:none;padding:5px;border-radius:7px}.SelectWrapper.SelectActive .SelectContent{width:100%;display:block;position:absolute;left:0;top:32px;padding:0;border:1px solid #ccc;overflow:hidden;background:#fff}.SelectContent .SelectOptions{max-height:100px;margin:0;overflow-y:auto;padding:0}.SelectContent .SelectOptions .SelectedValue{background-color:#009993;color:#fff}.SelectOptions::-webkit-scrollbar{width:7px}.SelectOptions::-webkit-scrollbar-track{background:#f1f1f1;border-radius:25px}.SelectOptions::-webkit-scrollbar-thumb{background:#ccc;border-radius:25px}.SelectOptions li{height:20px;padding:0 13px;font-size:14px}.SelectOptions li:hover{background:#f2f2f2}";
37
-
38
- const LotteryTicket = class {
39
- constructor(hostRef) {
40
- index.registerInstance(this, hostRef);
41
- this.ticketCompleted = index.createEvent(this, "ticketCompleted", 7);
42
- this.autoSelection = index.createEvent(this, "autoSelection", 7);
43
- this.resetSelection = index.createEvent(this, "resetSelection", 7);
44
- this.stakeChange = index.createEvent(this, "stakeChange", 7);
45
- this.multiplierChange = index.createEvent(this, "multiplierChange", 7);
46
- /**
47
- * Number of grids of a ticket
48
- */
49
- this.numberOfGrids = 1;
50
- /**
51
- * Option to have the ticket registered for multiple draws
52
- */
53
- this.multipleDraws = true;
54
- /**
55
- * Shows the reset button
56
- */
57
- this.resetButton = false;
58
- /**
59
- * Shows the auto-pick button
60
- */
61
- this.autoPick = false;
62
- /**
63
- * Language
64
- */
65
- this.language = 'en';
66
- /**
67
- * Client custom styling via string
68
- */
69
- this.clientStyling = '';
70
- /**
71
- * Client custom styling via url content
72
- */
73
- this.clientStylingUrlContent = '';
74
- this.multiplier = false;
75
- this.numberOfDraws = 1;
76
- this.isLoading = true;
77
- this.hasErrors = false;
78
- this.ticketDone = false;
79
- this.isCustomSelect = false;
80
- this.amountInfo = {};
81
- this.limitStylingAppends = false;
82
- this.setClientStyling = () => {
83
- let sheet = document.createElement('style');
84
- sheet.innerHTML = this.clientStyling;
85
- this.stylingContainer.prepend(sheet);
86
- };
87
- this.setClientStylingURL = () => {
88
- let cssFile = document.createElement('style');
89
- setTimeout(() => {
90
- cssFile.innerHTML = this.clientStylingUrlContent;
91
- this.stylingContainer.prepend(cssFile);
92
- }, 1);
93
- };
94
- }
95
- /**
96
- * @TODO find a better way to implement click outside the custom select, so that we don't have to use the 'data-cluster' attribute on each element
97
- */
98
- checkForClickOutside(ev) {
99
- if (ev.composedPath()[0].getAttribute('data-cluster') !== 'SelectComponent') {
100
- this.isCustomSelect = false;
101
- }
102
- }
103
- connectedCallback() {
104
- let url = new URL(`${this.endpoint}/games/${this.gameId}`);
105
- fetch(url.href)
106
- .then((response) => {
107
- if (response.ok) {
108
- return response.json();
109
- }
110
- else {
111
- // Throw error
112
- this.hasErrors = true;
113
- }
114
- })
115
- .then((data) => {
116
- this.isLoading = false;
117
- this.gameData = data;
118
- this.grids = [...Array(data.rules.boards.length).keys()];
119
- this.amountInfo = this.gameData.rules.stakes[0]; // initial value for select
120
- })
121
- .catch((err) => {
122
- this.isLoading = false;
123
- this.hasErrors = true;
124
- console.error('Error!', err);
125
- });
126
- }
127
- componentDidRender() {
128
- // start custom styling area
129
- if (!this.limitStylingAppends && this.stylingContainer) {
130
- if (this.clientStyling)
131
- this.setClientStyling();
132
- if (this.clientStylingUrlContent)
133
- this.setClientStylingURL();
134
- this.limitStylingAppends = true;
135
- }
136
- // end custom styling area
137
- }
138
- multiplierChangeHandler(e) {
139
- this.multiplier = e.target ? e.target.checked : false;
140
- this.multiplierChange.emit(this.multiplier);
141
- }
142
- drawsChangeHandler(event) {
143
- this.ticket = Object.assign(Object.assign({}, this.ticket), { draws: event });
144
- this.ticketCompleted.emit(this.ticket);
145
- }
146
- gridFilledHandler(event) {
147
- this.ticket = Object.assign(Object.assign({}, event.detail), { draws: this.numberOfDraws });
148
- this.ticketDone = true;
149
- this.ticketCompleted.emit(this.ticket);
150
- }
151
- toggleAutoSelection() {
152
- this.ticketDone = true;
153
- this.autoSelection.emit(this.ticketId);
154
- }
155
- toggleResetSelection() {
156
- this.ticketDone = false;
157
- this.resetSelection.emit(this.ticketId);
158
- }
159
- changeStake(ticketid, amount) {
160
- this.stakeChange.emit({
161
- ticketId: ticketid,
162
- stake: amount
163
- });
164
- }
165
- toggleClass() {
166
- this.isCustomSelect = !this.isCustomSelect;
167
- }
168
- setDropdownItem(item) {
169
- this.amountInfo = {
170
- amount: item.amount,
171
- currency: item.currency
172
- };
173
- this.isCustomSelect = false;
174
- this.changeStake(this.ticketId, item.amount);
175
- }
176
- render() {
177
- if (this.isLoading) {
178
- return (index.h("div", null, index.h("p", null, translate('loading', this.language))));
179
- }
180
- else {
181
- if (this.hasErrors) {
182
- return (index.h("div", null, index.h("p", null, translate('error', this.language))));
183
- }
184
- else {
185
- const { rules } = this.gameData;
186
- return (index.h("div", { class: "TicketContainer", ref: el => this.stylingContainer = el }, index.h("p", { class: "TicketTitle" }, this.gameData.name), this.resetButton && this.ticketDone &&
187
- index.h("div", { class: "ButtonContainer" }, index.h("a", { class: "ResetButton", onClick: () => this.toggleResetSelection() }, translate('resetButton', this.language))), this.autoPick && !this.ticketDone &&
188
- index.h("div", { class: "ButtonContainer" }, index.h("a", { class: "AutoButton", onClick: () => this.toggleAutoSelection() }, translate('autoButton', this.language))), this.grids.map((item, index$1) => index.h("div", { class: "TicketGridBullets" }, index.h("p", { class: "TicketGridTitle" }, translate('grid', this.language), " ", item), index.h("lottery-grid", { "grid-index": index$1, "maximum-allowed": rules.boards[index$1].maximumAllowed, "minimum-allowed": rules.boards[index$1].minimumAllowed, "total-numbers": rules.boards[index$1].totalNumbers, selectable: true, "reset-button": true, "auto-pick": true, "game-id": this.gameId, "ticket-id": this.ticketId, language: this.language, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent }))), rules.multiplier &&
189
- index.h("div", null, index.h("label", { class: "Toggle" }, index.h("label", { class: "Label" }, translate('multiplier', this.language), ": "), index.h("input", { class: "ToggleCheckbox", type: "checkbox", onInput: (e) => this.multiplierChangeHandler(e) }), index.h("div", { class: "ToggleSwitch" }))), this.multipleDraws &&
190
- index.h("div", { class: "TicketDraws" }, index.h("label", { class: "Label" }, translate('numberOfDraws', this.language), ": "), index.h("div", { class: "NumberInput" }, index.h("button", { onClick: () => this.numberOfDraws > 1 ? this.numberOfDraws-- : this.numberOfDraws = 1, class: "Minus" }, "-"), index.h("input", { class: "InputDefault", min: "1", value: this.numberOfDraws, type: "number" }), index.h("button", { onClick: () => this.numberOfDraws++, class: "Plus" }, "+"))), index.h("div", null, index.h("label", { class: "Label" }, translate('wagerPerDraw', this.language), ": "), index.h("div", { class: "WagerInput" }, rules.stakes.length > 1 ?
191
- (index.h("div", { "data-cluster": "SelectComponent", class: this.isCustomSelect ? "SelectWrapper SelectActive" : "SelectWrapper" }, index.h("div", { "data-cluster": "SelectComponent", class: "SelectButton", onClick: () => this.toggleClass() }, index.h("span", { "data-cluster": "SelectComponent" }, this.amountInfo.amount, " ", this.amountInfo.currency), index.h("span", { "data-cluster": "SelectComponent", class: "SelectExpand" }, "\u25BC")), index.h("div", { "data-cluster": "SelectComponent", class: "SelectContent" }, index.h("ul", { "data-cluster": "SelectComponent", class: "SelectOptions" }, rules.stakes.map((item) => index.h("li", { "data-cluster": "SelectComponent", class: this.amountInfo.amount == item.amount ? 'SelectedValue' : '', value: item.amount, onClick: () => this.setDropdownItem(item) }, item.amount, " ", item.currency)))))) : (index.h("div", null, index.h("input", { min: "1", value: rules.stakes[0].amount, type: "number", disabled: true }), index.h("p", { class: "WagerInputTitle" }, rules.stakes[0].currency)))))));
192
- }
193
- }
194
- }
195
- static get watchers() { return {
196
- "numberOfDraws": ["drawsChangeHandler"]
197
- }; }
198
- };
199
- LotteryTicket.style = lotteryTicketCss;
200
-
201
- exports.lottery_ticket = LotteryTicket;
@@ -1,6 +0,0 @@
1
- import { A as Accordion, d as defineCustomElement$1 } from './helper-accordion2.js';
2
-
3
- const HelperAccordion = Accordion;
4
- const defineCustomElement = defineCustomElement$1;
5
-
6
- export { HelperAccordion, defineCustomElement };
@@ -1,151 +0,0 @@
1
- import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
2
-
3
- const DEFAULT_LANGUAGE = 'en';
4
- const SUPPORTED_LANGUAGES = ['ro', 'en'];
5
- const TRANSLATIONS = {
6
- en: {
7
- deleteTicket: 'Delete ticket'
8
- },
9
- ro: {
10
- deleteTicket: 'Sterge biletul'
11
- },
12
- };
13
- const translate = (key, customLang) => {
14
- const lang = customLang;
15
- return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
16
- };
17
-
18
- const helperAccordionCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.Header{border-radius:5px;background:#009993;display:flex;gap:30px;border:1px solid #009993;padding:8px 10px;user-select:none;margin-bottom:1px}.Header:hover{background:#00ABA4}.Header .Title,.Header .Subtitle,.Header .Description{margin:0;font-size:14px;color:#fff;text-transform:capitalize}.Header .Expand{margin-left:auto;color:#FFF;width:17px;height:17px;cursor:pointer;text-align:center;transform:rotate(90deg);font-size:20px;user-select:none}.HeaderTicketHistory{border-radius:4px;background:#F1F1F1;display:flex;gap:30px;border:1px solid #009993;padding:8px 10px;user-select:none;margin-bottom:5px}.HeaderTicketHistory:hover{background:#00ABA4}.HeaderTicketHistory .Title,.HeaderTicketHistory .Subtitle,.HeaderTicketHistory .Description{margin:0;font-size:14px;color:#000}.HeaderTicketHistory .Expand{margin-left:auto;color:#FFF;width:17px;height:17px;cursor:pointer;text-align:center;transform:rotate(90deg);font-size:20px;user-select:none}.Content{border-radius:0 0 4px 4px;background:#fff;border:1px solid #009993;padding:10px 15px;user-select:none;color:#000;margin-bottom:10px}.ActionButton{cursor:pointer;display:inline-block;border-radius:4px;margin:20px 0 10px;text-transform:uppercase;font-size:12px;text-align:center;padding:8px 20px;min-width:80px;background:#FF3D00;border:1px solid #FF3D00;color:#FFF}.ActionButton:hover{background:#FF6536;border:1px solid #FF3D00}";
19
-
20
- const Accordion = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
21
- constructor() {
22
- super();
23
- this.__registerHost();
24
- this.__attachShadow();
25
- this.accordionEvent = createEvent(this, "helperAccordionAction", 7);
26
- /**
27
- * Flag for ticket history
28
- */
29
- this.ticketHistoryFlag = false;
30
- /**
31
- * Title (top header)
32
- */
33
- this.headerTitle = '';
34
- /**
35
- * SubTitle (top header)
36
- */
37
- this.headerSubtitle = '';
38
- /**
39
- * Description
40
- */
41
- this.description = '';
42
- /**
43
- * Enables footer content
44
- */
45
- this.footer = false;
46
- /**
47
- * Enables footer button for tab deletion
48
- */
49
- this.deleteTab = false;
50
- /**
51
- * Activates postMessages as events for actions from the widget
52
- */
53
- this.postMessage = false;
54
- /**
55
- * Name of the event emitter by the action button
56
- */
57
- this.eventName = 'helperAccordionAction';
58
- /**
59
- * Collapsed
60
- */
61
- this.collapsed = true;
62
- /**
63
- * Language
64
- */
65
- this.language = 'en';
66
- /**
67
- * Client custom styling via string
68
- */
69
- this.clientStyling = '';
70
- /**
71
- * Client custom styling via url content
72
- */
73
- this.clientStylingUrlContent = '';
74
- this.limitStylingAppends = false;
75
- this.setClientStyling = () => {
76
- let sheet = document.createElement('style');
77
- sheet.innerHTML = this.clientStyling;
78
- this.stylingContainer.prepend(sheet);
79
- };
80
- this.setClientStylingURL = () => {
81
- let cssFile = document.createElement('style');
82
- setTimeout(() => {
83
- cssFile.innerHTML = this.clientStylingUrlContent;
84
- this.stylingContainer.prepend(cssFile);
85
- }, 1);
86
- };
87
- }
88
- // @TODO fix the `any` type :)
89
- connectedCallback() {
90
- this.showContent = !this.collapsed;
91
- }
92
- componentDidRender() {
93
- // start custom styling area
94
- if (!this.limitStylingAppends && this.stylingContainer) {
95
- if (this.clientStyling)
96
- this.setClientStyling();
97
- if (this.clientStylingUrlContent)
98
- this.setClientStylingURL();
99
- this.limitStylingAppends = true;
100
- }
101
- // end custom styling area
102
- }
103
- toggleContent() {
104
- this.showContent = !this.showContent;
105
- }
106
- deleteAction() {
107
- if (this.postMessage) {
108
- // @TODO maybe change the name type, this one sucks
109
- window.postMessage({ type: this.eventName }, window.location.href);
110
- }
111
- this.accordionEvent.emit();
112
- }
113
- render() {
114
- return (h("div", { class: "Wrapper", ref: el => this.stylingContainer = el }, h("div", { class: this.ticketHistoryFlag === true ? 'HeaderTicketHistory' : 'Header' }, h("p", { class: "Title" }, this.headerTitle), h("p", { class: "Subtitle" }, this.headerSubtitle), h("p", { class: "Subtitle Description" }, this.description), h("span", { class: "Expand", onClick: () => this.toggleContent() }, this.showContent ? '<' : '>')), this.showContent &&
115
- h("div", null, h("div", { class: "Content" }, h("slot", { name: 'accordionContent' }), this.footer && this.showContent &&
116
- h("div", null, this.deleteTab &&
117
- h("span", { class: "ActionButton", onClick: () => this.deleteAction() }, translate('deleteTicket', this.language)))))));
118
- }
119
- static get style() { return helperAccordionCss; }
120
- }, [1, "helper-accordion", {
121
- "ticketHistoryFlag": [4, "ticket-history-flag"],
122
- "headerTitle": [1, "header-title"],
123
- "headerSubtitle": [1, "header-subtitle"],
124
- "description": [1],
125
- "footer": [4],
126
- "deleteTab": [4, "delete-tab"],
127
- "postMessage": [4, "post-message"],
128
- "eventName": [1, "event-name"],
129
- "collapsed": [4],
130
- "language": [1],
131
- "clientStyling": [1, "client-styling"],
132
- "clientStylingUrlContent": [1, "client-styling-url-content"],
133
- "showContent": [32],
134
- "limitStylingAppends": [32]
135
- }]);
136
- function defineCustomElement() {
137
- if (typeof customElements === "undefined") {
138
- return;
139
- }
140
- const components = ["helper-accordion"];
141
- components.forEach(tagName => { switch (tagName) {
142
- case "helper-accordion":
143
- if (!customElements.get(tagName)) {
144
- customElements.define(tagName, Accordion);
145
- }
146
- break;
147
- } });
148
- }
149
- defineCustomElement();
150
-
151
- export { Accordion as A, defineCustomElement as d };
@@ -1,6 +0,0 @@
1
- import { H as HelperFilters$1, d as defineCustomElement$1 } from './helper-filters2.js';
2
-
3
- const HelperFilters = HelperFilters$1;
4
- const defineCustomElement = defineCustomElement$1;
5
-
6
- export { HelperFilters, defineCustomElement };