@everymatrix/lottery-ticket-controller 0.1.24 → 1.0.69

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 (58) hide show
  1. package/dist/cjs/app-globals-3a1e7e63.js +5 -0
  2. package/dist/cjs/helper-accordion_5.cjs.entry.js +574 -671
  3. package/dist/cjs/index-2275f129.js +1304 -0
  4. package/dist/cjs/loader.cjs.js +7 -13
  5. package/dist/cjs/lottery-ticket-controller.cjs.js +17 -11
  6. package/dist/collection/collection-manifest.json +3 -3
  7. package/dist/collection/components/lottery-ticket-controller/index.js +1 -0
  8. package/dist/collection/components/lottery-ticket-controller/lottery-ticket-controller.css +182 -0
  9. package/dist/collection/components/lottery-ticket-controller/lottery-ticket-controller.js +371 -376
  10. package/dist/collection/utils/locale.utils.js +18 -15
  11. package/dist/collection/utils/utils.js +1 -1
  12. package/dist/esm/app-globals-0f993ce5.js +3 -0
  13. package/dist/esm/helper-accordion_5.entry.js +574 -671
  14. package/dist/esm/index-cf1a7f99.js +1277 -0
  15. package/dist/esm/loader.js +7 -13
  16. package/dist/esm/lottery-ticket-controller.js +14 -11
  17. package/dist/lottery-ticket-controller/lottery-ticket-controller.esm.js +1 -1
  18. package/dist/lottery-ticket-controller/p-1846ecd7.entry.js +1 -0
  19. package/dist/lottery-ticket-controller/p-e1255160.js +1 -0
  20. package/dist/lottery-ticket-controller/p-ee226061.js +2 -0
  21. package/dist/stencil.config.dev.js +17 -0
  22. package/dist/stencil.config.js +14 -19
  23. package/dist/types/Users/raul.vasile/workspace/everymatrix/widgets-monorepo/packages/stencil/lottery-ticket-controller/.stencil/packages/stencil/lottery-ticket-controller/stencil.config.d.ts +2 -0
  24. package/dist/types/Users/raul.vasile/workspace/everymatrix/widgets-monorepo/packages/stencil/lottery-ticket-controller/.stencil/packages/stencil/lottery-ticket-controller/stencil.config.dev.d.ts +2 -0
  25. package/dist/types/components/lottery-ticket-controller/index.d.ts +1 -0
  26. package/dist/types/components/lottery-ticket-controller/lottery-ticket-controller.d.ts +70 -66
  27. package/dist/types/components.d.ts +24 -1
  28. package/dist/types/stencil-public-runtime.d.ts +142 -33
  29. package/loader/cdn.js +1 -3
  30. package/loader/index.cjs.js +1 -3
  31. package/loader/index.d.ts +13 -1
  32. package/loader/index.es2017.js +1 -3
  33. package/loader/index.js +1 -3
  34. package/loader/package.json +1 -0
  35. package/package.json +11 -4
  36. package/dist/cjs/index-dd94b8db.js +0 -1275
  37. package/dist/components/helper-accordion.js +0 -6
  38. package/dist/components/helper-accordion2.js +0 -156
  39. package/dist/components/index.d.ts +0 -26
  40. package/dist/components/index.js +0 -1
  41. package/dist/components/lottery-bullet.js +0 -6
  42. package/dist/components/lottery-bullet2.js +0 -91
  43. package/dist/components/lottery-grid.js +0 -6
  44. package/dist/components/lottery-grid2.js +0 -236
  45. package/dist/components/lottery-ticket-controller.d.ts +0 -11
  46. package/dist/components/lottery-ticket-controller.js +0 -176
  47. package/dist/components/lottery-ticket.js +0 -6
  48. package/dist/components/lottery-ticket2.js +0 -263
  49. package/dist/esm/index-74cef6d4.js +0 -1249
  50. package/dist/esm/polyfills/core-js.js +0 -11
  51. package/dist/esm/polyfills/css-shim.js +0 -1
  52. package/dist/esm/polyfills/dom.js +0 -79
  53. package/dist/esm/polyfills/es5-html-element.js +0 -1
  54. package/dist/esm/polyfills/index.js +0 -34
  55. package/dist/esm/polyfills/system.js +0 -6
  56. package/dist/lottery-ticket-controller/p-72e48800.js +0 -1
  57. package/dist/lottery-ticket-controller/p-9a5da031.entry.js +0 -1
  58. package/dist/types/Users/dragos.bodea/Documents/everymatrix-prjs/stencil/widgets-stencil/packages/lottery-ticket-controller/.stencil/packages/lottery-ticket-controller/stencil.config.d.ts +0 -2
@@ -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,156 +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
- fr: {
13
- deleteTicket: 'Supprimer le billet'
14
- },
15
- ar: {
16
- deleteTicket: 'حذف التذكرة'
17
- }
18
- };
19
- const translate = (key, customLang) => {
20
- const lang = customLang;
21
- return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
22
- };
23
-
24
- 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}";
25
-
26
- const Accordion = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
27
- constructor() {
28
- super();
29
- this.__registerHost();
30
- this.__attachShadow();
31
- this.accordionEvent = createEvent(this, "helperAccordionAction", 7);
32
- /**
33
- * Flag for ticket history
34
- */
35
- this.ticketHistoryFlag = false;
36
- /**
37
- * Title (top header)
38
- */
39
- this.headerTitle = '';
40
- /**
41
- * SubTitle (top header)
42
- */
43
- this.headerSubtitle = '';
44
- /**
45
- * Description
46
- */
47
- this.description = '';
48
- /**
49
- * Enables footer content
50
- */
51
- this.footer = false;
52
- /**
53
- * Enables footer button for tab deletion
54
- */
55
- this.deleteTab = false;
56
- /**
57
- * Activates postMessages as events for actions from the widget
58
- */
59
- this.postMessage = false;
60
- /**
61
- * Name of the event emitter by the action button
62
- */
63
- this.eventName = 'helperAccordionAction';
64
- /**
65
- * Collapsed
66
- */
67
- this.collapsed = true;
68
- /**
69
- * Language
70
- */
71
- this.language = 'en';
72
- /**
73
- * Client custom styling via string
74
- */
75
- this.clientStyling = '';
76
- /**
77
- * Client custom styling via url content
78
- */
79
- this.clientStylingUrlContent = '';
80
- this.limitStylingAppends = false;
81
- this.setClientStyling = () => {
82
- let sheet = document.createElement('style');
83
- sheet.innerHTML = this.clientStyling;
84
- this.stylingContainer.prepend(sheet);
85
- };
86
- this.setClientStylingURL = () => {
87
- let cssFile = document.createElement('style');
88
- setTimeout(() => {
89
- cssFile.innerHTML = this.clientStylingUrlContent;
90
- this.stylingContainer.prepend(cssFile);
91
- }, 1);
92
- };
93
- }
94
- // @TODO fix the `any` type :)
95
- connectedCallback() {
96
- this.showContent = !this.collapsed;
97
- }
98
- componentDidRender() {
99
- // start custom styling area
100
- if (!this.limitStylingAppends && this.stylingContainer) {
101
- if (this.clientStyling)
102
- this.setClientStyling();
103
- if (this.clientStylingUrlContent)
104
- this.setClientStylingURL();
105
- this.limitStylingAppends = true;
106
- }
107
- // end custom styling area
108
- }
109
- toggleContent() {
110
- this.showContent = !this.showContent;
111
- }
112
- deleteAction() {
113
- if (this.postMessage) {
114
- // @TODO maybe change the name type, this one sucks
115
- window.postMessage({ type: this.eventName }, window.location.href);
116
- }
117
- this.accordionEvent.emit();
118
- }
119
- render() {
120
- 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 &&
121
- h("div", null, h("div", { class: "Content" }, h("slot", { name: 'accordionContent' }), this.footer && this.showContent &&
122
- h("div", null, this.deleteTab &&
123
- h("span", { class: "ActionButton", onClick: () => this.deleteAction() }, translate('deleteTicket', this.language)))))));
124
- }
125
- static get style() { return helperAccordionCss; }
126
- }, [1, "helper-accordion", {
127
- "ticketHistoryFlag": [4, "ticket-history-flag"],
128
- "headerTitle": [1, "header-title"],
129
- "headerSubtitle": [1, "header-subtitle"],
130
- "description": [1],
131
- "footer": [4],
132
- "deleteTab": [4, "delete-tab"],
133
- "postMessage": [4, "post-message"],
134
- "eventName": [1, "event-name"],
135
- "collapsed": [4],
136
- "language": [1],
137
- "clientStyling": [1, "client-styling"],
138
- "clientStylingUrlContent": [1, "client-styling-url-content"],
139
- "showContent": [32],
140
- "limitStylingAppends": [32]
141
- }]);
142
- function defineCustomElement() {
143
- if (typeof customElements === "undefined") {
144
- return;
145
- }
146
- const components = ["helper-accordion"];
147
- components.forEach(tagName => { switch (tagName) {
148
- case "helper-accordion":
149
- if (!customElements.get(tagName)) {
150
- customElements.define(tagName, Accordion);
151
- }
152
- break;
153
- } });
154
- }
155
-
156
- export { Accordion as A, defineCustomElement as d };
@@ -1,26 +0,0 @@
1
- /* LotteryTicketController custom elements */
2
-
3
- import type { Components, JSX } from "../types/components";
4
-
5
- /**
6
- * Used to manually set the base path where assets can be found.
7
- * If the script is used as "module", it's recommended to use "import.meta.url",
8
- * such as "setAssetPath(import.meta.url)". Other options include
9
- * "setAssetPath(document.currentScript.src)", or using a bundler's replace plugin to
10
- * dynamically set the path at build time, such as "setAssetPath(process.env.ASSET_PATH)".
11
- * But do note that this configuration depends on how your script is bundled, or lack of
12
- * bundling, and where your assets can be loaded from. Additionally custom bundling
13
- * will have to ensure the static assets are copied to its build directory.
14
- */
15
- export declare const setAssetPath: (path: string) => void;
16
-
17
- export interface SetPlatformOptions {
18
- raf?: (c: FrameRequestCallback) => number;
19
- ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
20
- rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
21
- }
22
- export declare const setPlatformOptions: (opts: SetPlatformOptions) => void;
23
-
24
- export type { Components, JSX };
25
-
26
- export * from '../types';
@@ -1 +0,0 @@
1
- export { setAssetPath, setPlatformOptions } from '@stencil/core/internal/client';
@@ -1,6 +0,0 @@
1
- import { L as LotteryBullet$1, d as defineCustomElement$1 } from './lottery-bullet2.js';
2
-
3
- const LotteryBullet = LotteryBullet$1;
4
- const defineCustomElement = defineCustomElement$1;
5
-
6
- export { LotteryBullet, defineCustomElement };
@@ -1,91 +0,0 @@
1
- import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
2
-
3
- const lotteryBulletCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}@-webkit-keyframes Circle{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes Circle{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes hover-rotate{0%{-webkit-transform:scale(1) rotateZ(0);transform:scale(1) rotateZ(0)}50%{-webkit-transform:scale(1.2) rotateZ(180deg);transform:scale(1.22) rotateZ(180deg)}100%{-webkit-transform:scale(1) rotateZ(360deg);transform:scale(1) rotateZ(360deg)}}@keyframes hover-rotate{0%{-webkit-transform:scale(1) rotateZ(0);transform:scale(1) rotateZ(0)}50%{-webkit-transform:scale(1.2) rotateZ(180deg);transform:scale(1.2) rotateZ(180deg)}100%{-webkit-transform:scale(1) rotateZ(360deg);transform:scale(1) rotateZ(360deg)}}@-webkit-keyframes selected-scaleUp{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1.2);transform:scale(1.2)}}@keyframes selected-scaleUp{0%{-webkit-transform:scale(0.5);transform:scale(0.5)}100%{-webkit-transform:scale(1);transform:scale(1)}}.Circle{-webkit-animation:Circle 0.8s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:Circle 0.8s cubic-bezier(0.39, 0.575, 0.565, 1) both;cursor:pointer;color:#000000;display:block;height:30px;width:30px;margin:0;display:flex;align-items:center;justify-content:center;justify-content:center;align-items:center;border:solid 2px #ffffff;background:radial-gradient(circle at top, white 0%, white 100%);font-weight:bold;border-radius:50%;box-shadow:0 2px 4px 0 rgba(0, 0, 0, 0.5);user-select:none;font-size:16px;line-height:16px;font-weight:600;position:relative}.Circle:hover{-webkit-animation:hover-rotate 0.4s linear both;animation:hover-rotate 0.4s linear both;background:radial-gradient(circle at top, white 0%, #f1f1f1 100%)}.Circle.Selected{-webkit-animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;color:#ffffff;background:#9EC258;background:-webkit-radial-gradient(top, #00958f, #004D4A);background:-moz-radial-gradient(top, #00958f, #004D4A);background:radial-gradient(to bottom, #00958f, #004D4A);border:solid 2px #00958f}.Circle.Disabled{-webkit-animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;color:#f1f1f1;background:#D4D4D4;border:solid 2px #D4D4D4;cursor:default}.Circle.DisabledSelected{-webkit-animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;animation:selected-scaleUp 0.4s cubic-bezier(0.39, 0.575, 0.565, 1) both;color:#f1f1f1;background:#9EC258;background:-webkit-radial-gradient(top, #00958f, #004D4A);background:-moz-radial-gradient(top, #00958f, #004D4A);background:radial-gradient(to bottom, #00958f, #004D4A);border:solid 2px #D4D4D4;cursor:default}";
4
-
5
- const LotteryBullet = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
6
- constructor() {
7
- super();
8
- this.__registerHost();
9
- this.__attachShadow();
10
- this.bulletEvent = createEvent(this, "lotteryBulletSelection", 7);
11
- /**
12
- * Value of the bullet
13
- */
14
- this.value = '0';
15
- /**
16
- * Marks if the bullet should be selectable
17
- */
18
- this.selectable = true;
19
- /**
20
- * Marks if the bullet should be selected
21
- */
22
- this.isSelected = false;
23
- /**
24
- * Client custom styling via string
25
- */
26
- this.clientStyling = '';
27
- /**
28
- * Client custom styling via url content
29
- */
30
- this.clientStylingUrlContent = '';
31
- this.limitStylingAppends = false;
32
- this.select = () => {
33
- if (this.selectable) {
34
- this.isSelected = !this.isSelected;
35
- this.bulletEvent.emit({
36
- value: this.value,
37
- selected: this.isSelected
38
- });
39
- }
40
- };
41
- this.setClientStyling = () => {
42
- let sheet = document.createElement('style');
43
- sheet.innerHTML = this.clientStyling;
44
- this.stylingContainer.prepend(sheet);
45
- };
46
- this.setClientStylingURL = () => {
47
- let cssFile = document.createElement('style');
48
- setTimeout(() => {
49
- cssFile.innerHTML = this.clientStylingUrlContent;
50
- this.stylingContainer.prepend(cssFile);
51
- }, 1);
52
- };
53
- }
54
- componentDidRender() {
55
- // start custom styling area
56
- if (!this.limitStylingAppends && this.stylingContainer) {
57
- if (this.clientStyling)
58
- this.setClientStyling();
59
- if (this.clientStylingUrlContent)
60
- this.setClientStylingURL();
61
- this.limitStylingAppends = true;
62
- }
63
- // end custom styling area
64
- }
65
- render() {
66
- return (h("div", { class: 'Circle ' + (this.selectable ? '' : 'Disabled') + (this.isSelected ? 'Selected' : ''), onClick: () => this.select(), ref: el => this.stylingContainer = el }, this.value));
67
- }
68
- static get style() { return lotteryBulletCss; }
69
- }, [1, "lottery-bullet", {
70
- "value": [1],
71
- "selectable": [4],
72
- "isSelected": [4, "is-selected"],
73
- "clientStyling": [1, "client-styling"],
74
- "clientStylingUrlContent": [1, "client-styling-url-content"],
75
- "limitStylingAppends": [32]
76
- }]);
77
- function defineCustomElement() {
78
- if (typeof customElements === "undefined") {
79
- return;
80
- }
81
- const components = ["lottery-bullet"];
82
- components.forEach(tagName => { switch (tagName) {
83
- case "lottery-bullet":
84
- if (!customElements.get(tagName)) {
85
- customElements.define(tagName, LotteryBullet);
86
- }
87
- break;
88
- } });
89
- }
90
-
91
- export { LotteryBullet as L, defineCustomElement as d };
@@ -1,6 +0,0 @@
1
- import { L as LotteryGrid$1, d as defineCustomElement$1 } from './lottery-grid2.js';
2
-
3
- const LotteryGrid = LotteryGrid$1;
4
- const defineCustomElement = defineCustomElement$1;
5
-
6
- export { LotteryGrid, defineCustomElement };
@@ -1,236 +0,0 @@
1
- import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
2
- import { d as defineCustomElement$1 } from './lottery-bullet2.js';
3
-
4
- const lotteryGridCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.GridContainer{display:flex;flex-direction:column;max-width:1200px}.Grid{margin-top:10px 0 10px 0;display:flex;flex-direction:row;flex-wrap:wrap;gap:20px}.Grid.TicketGrid{gap:5px}";
5
-
6
- const LotteryGrid = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
7
- constructor() {
8
- super();
9
- this.__registerHost();
10
- this.__attachShadow();
11
- this.gridFilledEvent = createEvent(this, "gridFilled", 7);
12
- this.gridDirtyEvent = createEvent(this, "gridDirty", 7);
13
- /**
14
- * Number of bullets of grid
15
- */
16
- this.totalNumbers = 0;
17
- /**
18
- * Number of maximum bullets that can be selected
19
- */
20
- this.maximumAllowed = 0;
21
- /**
22
- * Minimum allowed of bullets
23
- */
24
- this.minimumAllowed = 1;
25
- /**
26
- * Allows the user to select numbers on the grid
27
- */
28
- this.selectable = true;
29
- /**
30
- * Numbers that should be showed as selected on the grid (as a string of those numbers e.g. '1,2,3,4,5,6')
31
- */
32
- this.selectedNumbers = '';
33
- /**
34
- * Show only selected numbers
35
- */
36
- this.displaySelected = false;
37
- /**
38
- * Language
39
- */
40
- this.language = 'en';
41
- /**
42
- * Personalize grid for ticket
43
- */
44
- this.gridType = '';
45
- /**
46
- * Client custom styling via string
47
- */
48
- this.clientStyling = '';
49
- /**
50
- * Client custom styling via url content
51
- */
52
- this.clientStylingUrlContent = '';
53
- this.numbers = [];
54
- this.limitStylingAppends = false;
55
- this.selectedCounter = 0;
56
- this.setClientStyling = () => {
57
- let sheet = document.createElement('style');
58
- sheet.innerHTML = this.clientStyling;
59
- this.stylingContainer.prepend(sheet);
60
- };
61
- this.setClientStylingURL = () => {
62
- let cssFile = document.createElement('style');
63
- setTimeout(() => {
64
- cssFile.innerHTML = this.clientStylingUrlContent;
65
- this.stylingContainer.prepend(cssFile);
66
- }, 1);
67
- };
68
- }
69
- connectedCallback() {
70
- let selected = [];
71
- if (this.selectedNumbers.length > 0) {
72
- selected = this.selectedNumbers.split(',');
73
- this.selectedCounter = selected.length;
74
- }
75
- if (this.displaySelected) {
76
- selected.forEach((item) => {
77
- this.numbers.push({
78
- number: item,
79
- selected: true,
80
- selectable: this.selectable
81
- });
82
- });
83
- }
84
- else {
85
- [...Array(this.totalNumbers).keys()]
86
- .map(number => (number + 1).toString())
87
- .forEach((number) => {
88
- this.numbers.push({
89
- number,
90
- selected: selected.indexOf(number) >= 0 ? true : false,
91
- selectable: this.selectedCounter == this.maximumAllowed ? false : this.selectable
92
- });
93
- });
94
- }
95
- }
96
- componentDidRender() {
97
- // start custom styling area
98
- if (!this.limitStylingAppends && this.stylingContainer) {
99
- if (this.clientStyling)
100
- this.setClientStyling();
101
- if (this.clientStylingUrlContent)
102
- this.setClientStylingURL();
103
- this.limitStylingAppends = true;
104
- }
105
- // end custom styling area
106
- }
107
- lotteryBulletSelectionHandler(event) {
108
- this.numbers = this.numbers.map((item) => {
109
- if (item.number == event.detail.value) {
110
- return {
111
- number: item.number,
112
- selected: event.detail.selected,
113
- selectable: item.selectable
114
- };
115
- }
116
- return {
117
- number: item.number,
118
- selected: item.selected,
119
- selectable: item.selectable
120
- };
121
- });
122
- if (event.detail.selected) {
123
- this.selectedCounter += 1;
124
- if (this.selectedCounter == this.maximumAllowed) {
125
- this.numbers = this.numbers.map((item) => {
126
- return {
127
- number: item.number,
128
- selected: item.selected,
129
- selectable: item.selected ? true : false
130
- };
131
- });
132
- this.gridFilledEvent.emit({
133
- id: this.ticketId,
134
- index: this.gridIndex,
135
- selectedNumbers: this.numbers.filter((item) => item.selected).map((item) => item.number)
136
- });
137
- }
138
- }
139
- else {
140
- if (this.selectedCounter == this.maximumAllowed) {
141
- this.numbers = this.numbers.map((item) => {
142
- return {
143
- number: item.number,
144
- selected: item.selected,
145
- selectable: true
146
- };
147
- });
148
- this.gridDirtyEvent.emit({
149
- id: this.ticketId,
150
- index: this.gridIndex,
151
- selectedNumbers: this.numbers.filter((item) => item.selected).map((item) => item.number)
152
- });
153
- }
154
- this.selectedCounter -= 1;
155
- }
156
- }
157
- async resetSelectionHandler(event) {
158
- if (event.detail && event.detail == this.ticketId) {
159
- this.selectedCounter = 0;
160
- this.numbers = this.numbers.map((item) => {
161
- return {
162
- number: item.number,
163
- selected: false,
164
- selectable: this.selectable
165
- };
166
- });
167
- this.gridDirtyEvent.emit({
168
- id: this.ticketId,
169
- index: this.gridIndex,
170
- selectedNumbers: this.numbers.filter((item) => item.selected).map((item) => item.number)
171
- });
172
- }
173
- }
174
- async autoSelectionHandler(event) {
175
- if (event.detail && event.detail == this.ticketId) {
176
- this.resetSelectionHandler(event);
177
- let array = [...Array(this.totalNumbers).keys()]
178
- .map(number => number + 1)
179
- .sort(() => 0.5 - Math.random());
180
- array = array.slice(0, this.minimumAllowed);
181
- this.numbers = this.numbers.map((item) => {
182
- return {
183
- number: item.number,
184
- selected: array.indexOf(parseInt(item.number, 10)) >= 0 ? true : false,
185
- selectable: array.indexOf(parseInt(item.number, 10)) >= 0 ? true : false,
186
- };
187
- });
188
- this.gridFilledEvent.emit({
189
- id: this.ticketId,
190
- index: this.gridIndex,
191
- selectedNumbers: this.numbers.filter((item) => item.selected).map((item) => item.number)
192
- });
193
- this.selectedCounter = this.maximumAllowed;
194
- }
195
- }
196
- render() {
197
- return (h("div", { class: "GridContainer", ref: el => this.stylingContainer = el }, h("div", { class: this.gridType === 'ticket' ? 'Grid TicketGrid' : 'Grid' }, this.numbers.map((item) => h("div", null, h("lottery-bullet", { value: item.number, selectable: item.selectable, "is-selected": item.selected, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent }))))));
198
- }
199
- static get style() { return lotteryGridCss; }
200
- }, [1, "lottery-grid", {
201
- "ticketId": [2, "ticket-id"],
202
- "totalNumbers": [2, "total-numbers"],
203
- "gameId": [1, "game-id"],
204
- "maximumAllowed": [2, "maximum-allowed"],
205
- "minimumAllowed": [2, "minimum-allowed"],
206
- "selectable": [4],
207
- "selectedNumbers": [1, "selected-numbers"],
208
- "displaySelected": [4, "display-selected"],
209
- "language": [1],
210
- "gridIndex": [2, "grid-index"],
211
- "gridType": [1, "grid-type"],
212
- "clientStyling": [1, "client-styling"],
213
- "clientStylingUrlContent": [1, "client-styling-url-content"],
214
- "numbers": [32],
215
- "limitStylingAppends": [32]
216
- }, [[0, "lotteryBulletSelection", "lotteryBulletSelectionHandler"], [4, "resetSelection", "resetSelectionHandler"], [4, "autoSelection", "autoSelectionHandler"]]]);
217
- function defineCustomElement() {
218
- if (typeof customElements === "undefined") {
219
- return;
220
- }
221
- const components = ["lottery-grid", "lottery-bullet"];
222
- components.forEach(tagName => { switch (tagName) {
223
- case "lottery-grid":
224
- if (!customElements.get(tagName)) {
225
- customElements.define(tagName, LotteryGrid);
226
- }
227
- break;
228
- case "lottery-bullet":
229
- if (!customElements.get(tagName)) {
230
- defineCustomElement$1();
231
- }
232
- break;
233
- } });
234
- }
235
-
236
- export { LotteryGrid as L, defineCustomElement as d };
@@ -1,11 +0,0 @@
1
- import type { Components, JSX } from "../types/components";
2
-
3
- interface LotteryTicketController extends Components.LotteryTicketController, HTMLElement {}
4
- export const LotteryTicketController: {
5
- prototype: LotteryTicketController;
6
- new (): LotteryTicketController;
7
- };
8
- /**
9
- * Used to define this component and all nested components recursively.
10
- */
11
- export const defineCustomElement: () => void;