@everymatrix/helper-accordion 0.1.2 → 0.1.6
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.
- package/dist/cjs/helper-accordion.cjs.entry.js +6 -2
- package/dist/cjs/helper-accordion.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/helper-accordion/helper-accordion.css +39 -8
- package/dist/collection/components/helper-accordion/helper-accordion.js +23 -1
- package/dist/components/helper-accordion.js +8 -2
- package/dist/esm/helper-accordion.entry.js +6 -2
- package/dist/esm/helper-accordion.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/helper-accordion/helper-accordion.esm.js +1 -1
- package/dist/helper-accordion/p-b6a654d9.entry.js +1 -0
- package/dist/stencil.config.js +2 -0
- package/dist/types/components/helper-accordion/helper-accordion.d.ts +4 -0
- package/dist/types/components.d.ts +8 -0
- package/package.json +2 -2
- package/dist/helper-accordion/p-797268f3.entry.js +0 -1
|
@@ -19,12 +19,16 @@ const translate = (key, customLang) => {
|
|
|
19
19
|
return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
|
|
20
20
|
};
|
|
21
21
|
|
|
22
|
-
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:4px;
|
|
22
|
+
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:4px 4px 0 0;background:#009993;display:flex;gap:30px;border:1px solid #009993;padding:8px 10px;user-select:none}.Header:hover{background:#00ABA4}.Header .Title,.Header .Subtitle,.Header .Description{margin:0;font-size:14px;color:#fff}.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}";
|
|
23
23
|
|
|
24
24
|
const Accordion = class {
|
|
25
25
|
constructor(hostRef) {
|
|
26
26
|
index.registerInstance(this, hostRef);
|
|
27
27
|
this.accordionEvent = index.createEvent(this, "helperAccordionAction", 7);
|
|
28
|
+
/**
|
|
29
|
+
* Flag for ticket history
|
|
30
|
+
*/
|
|
31
|
+
this.ticketHistoryFlag = false;
|
|
28
32
|
/**
|
|
29
33
|
* Title (top header)
|
|
30
34
|
*/
|
|
@@ -77,7 +81,7 @@ const Accordion = class {
|
|
|
77
81
|
this.accordionEvent.emit();
|
|
78
82
|
}
|
|
79
83
|
render() {
|
|
80
|
-
return (index.h("div", { class: "Wrapper" }, index.h("div", { class:
|
|
84
|
+
return (index.h("div", { class: "Wrapper" }, index.h("div", { class: this.ticketHistoryFlag === true ? 'HeaderTicketHistory' : 'Header' }, index.h("p", { class: "Title" }, this.headerTitle), index.h("p", { class: "Subtitle" }, this.headerSubtitle), index.h("p", { class: "Subtitle" }, this.description), index.h("span", { class: "Expand", onClick: () => this.toggleContent() }, this.showContent ? '<' : '>')), this.showContent &&
|
|
81
85
|
index.h("div", null, index.h("div", { class: "Content" }, index.h("slot", { name: 'accordionContent' }), this.footer && this.showContent &&
|
|
82
86
|
index.h("div", null, this.deleteTab &&
|
|
83
87
|
index.h("span", { class: "ActionButton", onClick: () => this.deleteAction() }, translate('deleteTicket', this.language)))))));
|
|
@@ -15,5 +15,5 @@ const patchBrowser = () => {
|
|
|
15
15
|
};
|
|
16
16
|
|
|
17
17
|
patchBrowser().then(options => {
|
|
18
|
-
return index.bootstrapLazy([["helper-accordion.cjs",[[1,"helper-accordion",{"headerTitle":[1,"header-title"],"headerSubtitle":[1,"header-subtitle"],"description":[1],"footer":[4],"deleteTab":[4,"delete-tab"],"postMessage":[4,"post-message"],"eventName":[1,"event-name"],"collapsed":[4],"language":[1],"showContent":[32]}]]]], options);
|
|
18
|
+
return index.bootstrapLazy([["helper-accordion.cjs",[[1,"helper-accordion",{"ticketHistoryFlag":[4,"ticket-history-flag"],"headerTitle":[1,"header-title"],"headerSubtitle":[1,"header-subtitle"],"description":[1],"footer":[4],"deleteTab":[4,"delete-tab"],"postMessage":[4,"post-message"],"eventName":[1,"event-name"],"collapsed":[4],"language":[1],"showContent":[32]}]]]], options);
|
|
19
19
|
});
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -14,7 +14,7 @@ const patchEsm = () => {
|
|
|
14
14
|
const defineCustomElements = (win, options) => {
|
|
15
15
|
if (typeof window === 'undefined') return Promise.resolve();
|
|
16
16
|
return patchEsm().then(() => {
|
|
17
|
-
return index.bootstrapLazy([["helper-accordion.cjs",[[1,"helper-accordion",{"headerTitle":[1,"header-title"],"headerSubtitle":[1,"header-subtitle"],"description":[1],"footer":[4],"deleteTab":[4,"delete-tab"],"postMessage":[4,"post-message"],"eventName":[1,"event-name"],"collapsed":[4],"language":[1],"showContent":[32]}]]]], options);
|
|
17
|
+
return index.bootstrapLazy([["helper-accordion.cjs",[[1,"helper-accordion",{"ticketHistoryFlag":[4,"ticket-history-flag"],"headerTitle":[1,"header-title"],"headerSubtitle":[1,"header-subtitle"],"description":[1],"footer":[4],"deleteTab":[4,"delete-tab"],"postMessage":[4,"post-message"],"eventName":[1,"event-name"],"collapsed":[4],"language":[1],"showContent":[32]}]]]], options);
|
|
18
18
|
});
|
|
19
19
|
};
|
|
20
20
|
|
|
@@ -5,8 +5,7 @@
|
|
|
5
5
|
}
|
|
6
6
|
|
|
7
7
|
.Header {
|
|
8
|
-
border-radius: 4px;
|
|
9
|
-
margin-bottom: 1px;
|
|
8
|
+
border-radius: 4px 4px 0 0;
|
|
10
9
|
background: #009993;
|
|
11
10
|
display: flex;
|
|
12
11
|
gap: 30px;
|
|
@@ -36,8 +35,40 @@
|
|
|
36
35
|
user-select: none;
|
|
37
36
|
}
|
|
38
37
|
|
|
39
|
-
.
|
|
38
|
+
.HeaderTicketHistory {
|
|
40
39
|
border-radius: 4px;
|
|
40
|
+
background: #F1F1F1;
|
|
41
|
+
display: flex;
|
|
42
|
+
gap: 30px;
|
|
43
|
+
border: 1px solid #009993;
|
|
44
|
+
padding: 8px 10px;
|
|
45
|
+
user-select: none;
|
|
46
|
+
margin-bottom: 5px;
|
|
47
|
+
}
|
|
48
|
+
.HeaderTicketHistory:hover {
|
|
49
|
+
background: #00ABA4;
|
|
50
|
+
}
|
|
51
|
+
.HeaderTicketHistory .Title,
|
|
52
|
+
.HeaderTicketHistory .Subtitle,
|
|
53
|
+
.HeaderTicketHistory .Description {
|
|
54
|
+
margin: 0;
|
|
55
|
+
font-size: 14px;
|
|
56
|
+
color: #000;
|
|
57
|
+
}
|
|
58
|
+
.HeaderTicketHistory .Expand {
|
|
59
|
+
margin-left: auto;
|
|
60
|
+
color: #FFF;
|
|
61
|
+
width: 17px;
|
|
62
|
+
height: 17px;
|
|
63
|
+
cursor: pointer;
|
|
64
|
+
text-align: center;
|
|
65
|
+
transform: rotate(90deg);
|
|
66
|
+
font-size: 20px;
|
|
67
|
+
user-select: none;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.Content {
|
|
71
|
+
border-radius: 0 0 4px 4px;
|
|
41
72
|
background: #fff;
|
|
42
73
|
border: 1px solid #009993;
|
|
43
74
|
padding: 10px 15px;
|
|
@@ -47,15 +78,15 @@
|
|
|
47
78
|
}
|
|
48
79
|
|
|
49
80
|
.ActionButton {
|
|
50
|
-
border-radius: 4px;
|
|
51
|
-
margin-top: 10px;
|
|
52
81
|
cursor: pointer;
|
|
53
|
-
|
|
54
|
-
|
|
82
|
+
display: inline-block;
|
|
83
|
+
border-radius: 4px;
|
|
84
|
+
margin: 20px 0 10px;
|
|
85
|
+
text-transform: uppercase;
|
|
55
86
|
font-size: 12px;
|
|
56
87
|
text-align: center;
|
|
57
88
|
padding: 8px 20px;
|
|
58
|
-
width: 80px;
|
|
89
|
+
min-width: 80px;
|
|
59
90
|
background: #FF3D00;
|
|
60
91
|
border: 1px solid #FF3D00;
|
|
61
92
|
color: #FFF;
|
|
@@ -2,6 +2,10 @@ import { Component, Prop, h, State, Event } from '@stencil/core';
|
|
|
2
2
|
import { translate } from '../../utils/locale.utils';
|
|
3
3
|
export class Accordion {
|
|
4
4
|
constructor() {
|
|
5
|
+
/**
|
|
6
|
+
* Flag for ticket history
|
|
7
|
+
*/
|
|
8
|
+
this.ticketHistoryFlag = false;
|
|
5
9
|
/**
|
|
6
10
|
* Title (top header)
|
|
7
11
|
*/
|
|
@@ -55,7 +59,7 @@ export class Accordion {
|
|
|
55
59
|
}
|
|
56
60
|
render() {
|
|
57
61
|
return (h("div", { class: "Wrapper" },
|
|
58
|
-
h("div", { class:
|
|
62
|
+
h("div", { class: this.ticketHistoryFlag === true ? 'HeaderTicketHistory' : 'Header' },
|
|
59
63
|
h("p", { class: "Title" }, this.headerTitle),
|
|
60
64
|
h("p", { class: "Subtitle" }, this.headerSubtitle),
|
|
61
65
|
h("p", { class: "Subtitle" }, this.description),
|
|
@@ -77,6 +81,24 @@ export class Accordion {
|
|
|
77
81
|
"$": ["helper-accordion.css"]
|
|
78
82
|
}; }
|
|
79
83
|
static get properties() { return {
|
|
84
|
+
"ticketHistoryFlag": {
|
|
85
|
+
"type": "boolean",
|
|
86
|
+
"mutable": false,
|
|
87
|
+
"complexType": {
|
|
88
|
+
"original": "boolean",
|
|
89
|
+
"resolved": "boolean",
|
|
90
|
+
"references": {}
|
|
91
|
+
},
|
|
92
|
+
"required": false,
|
|
93
|
+
"optional": false,
|
|
94
|
+
"docs": {
|
|
95
|
+
"tags": [],
|
|
96
|
+
"text": "Flag for ticket history"
|
|
97
|
+
},
|
|
98
|
+
"attribute": "ticket-history-flag",
|
|
99
|
+
"reflect": false,
|
|
100
|
+
"defaultValue": "false"
|
|
101
|
+
},
|
|
80
102
|
"headerTitle": {
|
|
81
103
|
"type": "string",
|
|
82
104
|
"mutable": false,
|
|
@@ -15,7 +15,7 @@ const translate = (key, customLang) => {
|
|
|
15
15
|
return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
|
|
16
16
|
};
|
|
17
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:4px;
|
|
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:4px 4px 0 0;background:#009993;display:flex;gap:30px;border:1px solid #009993;padding:8px 10px;user-select:none}.Header:hover{background:#00ABA4}.Header .Title,.Header .Subtitle,.Header .Description{margin:0;font-size:14px;color:#fff}.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
19
|
|
|
20
20
|
const Accordion = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
21
21
|
constructor() {
|
|
@@ -23,6 +23,10 @@ const Accordion = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
|
23
23
|
this.__registerHost();
|
|
24
24
|
this.__attachShadow();
|
|
25
25
|
this.accordionEvent = createEvent(this, "helperAccordionAction", 7);
|
|
26
|
+
/**
|
|
27
|
+
* Flag for ticket history
|
|
28
|
+
*/
|
|
29
|
+
this.ticketHistoryFlag = false;
|
|
26
30
|
/**
|
|
27
31
|
* Title (top header)
|
|
28
32
|
*/
|
|
@@ -75,13 +79,14 @@ const Accordion = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
|
75
79
|
this.accordionEvent.emit();
|
|
76
80
|
}
|
|
77
81
|
render() {
|
|
78
|
-
return (h("div", { class: "Wrapper" }, h("div", { class:
|
|
82
|
+
return (h("div", { class: "Wrapper" }, h("div", { class: this.ticketHistoryFlag === true ? 'HeaderTicketHistory' : 'Header' }, h("p", { class: "Title" }, this.headerTitle), h("p", { class: "Subtitle" }, this.headerSubtitle), h("p", { class: "Subtitle" }, this.description), h("span", { class: "Expand", onClick: () => this.toggleContent() }, this.showContent ? '<' : '>')), this.showContent &&
|
|
79
83
|
h("div", null, h("div", { class: "Content" }, h("slot", { name: 'accordionContent' }), this.footer && this.showContent &&
|
|
80
84
|
h("div", null, this.deleteTab &&
|
|
81
85
|
h("span", { class: "ActionButton", onClick: () => this.deleteAction() }, translate('deleteTicket', this.language)))))));
|
|
82
86
|
}
|
|
83
87
|
static get style() { return helperAccordionCss; }
|
|
84
88
|
}, [1, "helper-accordion", {
|
|
89
|
+
"ticketHistoryFlag": [4, "ticket-history-flag"],
|
|
85
90
|
"headerTitle": [1, "header-title"],
|
|
86
91
|
"headerSubtitle": [1, "header-subtitle"],
|
|
87
92
|
"description": [1],
|
|
@@ -106,6 +111,7 @@ function defineCustomElement$1() {
|
|
|
106
111
|
break;
|
|
107
112
|
} });
|
|
108
113
|
}
|
|
114
|
+
defineCustomElement$1();
|
|
109
115
|
|
|
110
116
|
const HelperAccordion = Accordion;
|
|
111
117
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -15,12 +15,16 @@ const translate = (key, customLang) => {
|
|
|
15
15
|
return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
|
|
16
16
|
};
|
|
17
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:4px;
|
|
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:4px 4px 0 0;background:#009993;display:flex;gap:30px;border:1px solid #009993;padding:8px 10px;user-select:none}.Header:hover{background:#00ABA4}.Header .Title,.Header .Subtitle,.Header .Description{margin:0;font-size:14px;color:#fff}.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
19
|
|
|
20
20
|
const Accordion = class {
|
|
21
21
|
constructor(hostRef) {
|
|
22
22
|
registerInstance(this, hostRef);
|
|
23
23
|
this.accordionEvent = createEvent(this, "helperAccordionAction", 7);
|
|
24
|
+
/**
|
|
25
|
+
* Flag for ticket history
|
|
26
|
+
*/
|
|
27
|
+
this.ticketHistoryFlag = false;
|
|
24
28
|
/**
|
|
25
29
|
* Title (top header)
|
|
26
30
|
*/
|
|
@@ -73,7 +77,7 @@ const Accordion = class {
|
|
|
73
77
|
this.accordionEvent.emit();
|
|
74
78
|
}
|
|
75
79
|
render() {
|
|
76
|
-
return (h("div", { class: "Wrapper" }, h("div", { class:
|
|
80
|
+
return (h("div", { class: "Wrapper" }, h("div", { class: this.ticketHistoryFlag === true ? 'HeaderTicketHistory' : 'Header' }, h("p", { class: "Title" }, this.headerTitle), h("p", { class: "Subtitle" }, this.headerSubtitle), h("p", { class: "Subtitle" }, this.description), h("span", { class: "Expand", onClick: () => this.toggleContent() }, this.showContent ? '<' : '>')), this.showContent &&
|
|
77
81
|
h("div", null, h("div", { class: "Content" }, h("slot", { name: 'accordionContent' }), this.footer && this.showContent &&
|
|
78
82
|
h("div", null, this.deleteTab &&
|
|
79
83
|
h("span", { class: "ActionButton", onClick: () => this.deleteAction() }, translate('deleteTicket', this.language)))))));
|
|
@@ -13,5 +13,5 @@ const patchBrowser = () => {
|
|
|
13
13
|
};
|
|
14
14
|
|
|
15
15
|
patchBrowser().then(options => {
|
|
16
|
-
return bootstrapLazy([["helper-accordion",[[1,"helper-accordion",{"headerTitle":[1,"header-title"],"headerSubtitle":[1,"header-subtitle"],"description":[1],"footer":[4],"deleteTab":[4,"delete-tab"],"postMessage":[4,"post-message"],"eventName":[1,"event-name"],"collapsed":[4],"language":[1],"showContent":[32]}]]]], options);
|
|
16
|
+
return bootstrapLazy([["helper-accordion",[[1,"helper-accordion",{"ticketHistoryFlag":[4,"ticket-history-flag"],"headerTitle":[1,"header-title"],"headerSubtitle":[1,"header-subtitle"],"description":[1],"footer":[4],"deleteTab":[4,"delete-tab"],"postMessage":[4,"post-message"],"eventName":[1,"event-name"],"collapsed":[4],"language":[1],"showContent":[32]}]]]], options);
|
|
17
17
|
});
|
package/dist/esm/loader.js
CHANGED
|
@@ -10,7 +10,7 @@ const patchEsm = () => {
|
|
|
10
10
|
const defineCustomElements = (win, options) => {
|
|
11
11
|
if (typeof window === 'undefined') return Promise.resolve();
|
|
12
12
|
return patchEsm().then(() => {
|
|
13
|
-
return bootstrapLazy([["helper-accordion",[[1,"helper-accordion",{"headerTitle":[1,"header-title"],"headerSubtitle":[1,"header-subtitle"],"description":[1],"footer":[4],"deleteTab":[4,"delete-tab"],"postMessage":[4,"post-message"],"eventName":[1,"event-name"],"collapsed":[4],"language":[1],"showContent":[32]}]]]], options);
|
|
13
|
+
return bootstrapLazy([["helper-accordion",[[1,"helper-accordion",{"ticketHistoryFlag":[4,"ticket-history-flag"],"headerTitle":[1,"header-title"],"headerSubtitle":[1,"header-subtitle"],"description":[1],"footer":[4],"deleteTab":[4,"delete-tab"],"postMessage":[4,"post-message"],"eventName":[1,"event-name"],"collapsed":[4],"language":[1],"showContent":[32]}]]]], options);
|
|
14
14
|
});
|
|
15
15
|
};
|
|
16
16
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,b as t}from"./p-e6ddfc6c.js";(()=>{const t=import.meta.url,a={};return""!==t&&(a.resourcesUrl=new URL(".",t).href),e(a)})().then((e=>t([["p-
|
|
1
|
+
import{p as e,b as t}from"./p-e6ddfc6c.js";(()=>{const t=import.meta.url,a={};return""!==t&&(a.resourcesUrl=new URL(".",t).href),e(a)})().then((e=>t([["p-b6a654d9",[[1,"helper-accordion",{ticketHistoryFlag:[4,"ticket-history-flag"],headerTitle:[1,"header-title"],headerSubtitle:[1,"header-subtitle"],description:[1],footer:[4],deleteTab:[4,"delete-tab"],postMessage:[4,"post-message"],eventName:[1,"event-name"],collapsed:[4],language:[1],showContent:[32]}]]]],e)));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,c as e,h as i}from"./p-e6ddfc6c.js";const o=["ro","en"],r={en:{deleteTicket:"Delete ticket"},ro:{deleteTicket:"Sterge biletul"}},s=class{constructor(i){t(this,i),this.accordionEvent=e(this,"helperAccordionAction",7),this.ticketHistoryFlag=!1,this.headerTitle="",this.headerSubtitle="",this.description="",this.footer=!1,this.deleteTab=!1,this.postMessage=!1,this.eventName="helperAccordionAction",this.collapsed=!0,this.language="en"}connectedCallback(){this.showContent=!this.collapsed}toggleContent(){this.showContent=!this.showContent}deleteAction(){this.postMessage&&window.postMessage({type:this.eventName},window.location.href),this.accordionEvent.emit()}render(){return i("div",{class:"Wrapper"},i("div",{class:!0===this.ticketHistoryFlag?"HeaderTicketHistory":"Header"},i("p",{class:"Title"},this.headerTitle),i("p",{class:"Subtitle"},this.headerSubtitle),i("p",{class:"Subtitle"},this.description),i("span",{class:"Expand",onClick:()=>this.toggleContent()},this.showContent?"<":">")),this.showContent&&i("div",null,i("div",{class:"Content"},i("slot",{name:"accordionContent"}),this.footer&&this.showContent&&i("div",null,this.deleteTab&&i("span",{class:"ActionButton",onClick:()=>this.deleteAction()},(()=>{const t=this.language;return r[void 0!==t&&o.includes(t)?t:"en"].deleteTicket})())))))}};s.style='@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap");:host{display:block;font-family:"Roboto", sans-serif}.Header{border-radius:4px 4px 0 0;background:#009993;display:flex;gap:30px;border:1px solid #009993;padding:8px 10px;user-select:none}.Header:hover{background:#00ABA4}.Header .Title,.Header .Subtitle,.Header .Description{margin:0;font-size:14px;color:#fff}.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}';export{s as helper_accordion}
|
package/dist/stencil.config.js
CHANGED
|
@@ -43,6 +43,10 @@ export namespace Components {
|
|
|
43
43
|
* Activates postMessages as events for actions from the widget
|
|
44
44
|
*/
|
|
45
45
|
"postMessage": boolean;
|
|
46
|
+
/**
|
|
47
|
+
* Flag for ticket history
|
|
48
|
+
*/
|
|
49
|
+
"ticketHistoryFlag": boolean;
|
|
46
50
|
}
|
|
47
51
|
}
|
|
48
52
|
declare global {
|
|
@@ -98,6 +102,10 @@ declare namespace LocalJSX {
|
|
|
98
102
|
* Activates postMessages as events for actions from the widget
|
|
99
103
|
*/
|
|
100
104
|
"postMessage"?: boolean;
|
|
105
|
+
/**
|
|
106
|
+
* Flag for ticket history
|
|
107
|
+
*/
|
|
108
|
+
"ticketHistoryFlag"?: boolean;
|
|
101
109
|
}
|
|
102
110
|
interface IntrinsicElements {
|
|
103
111
|
"helper-accordion": HelperAccordion;
|
package/package.json
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@everymatrix/helper-accordion",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.6",
|
|
4
4
|
"main": "./dist/index.cjs.js",
|
|
5
|
-
"module": "./dist/
|
|
5
|
+
"module": "./dist/components/helper-accordion.js",
|
|
6
6
|
"es2015": "./dist/esm/index.mjs",
|
|
7
7
|
"es2017": "./dist/esm/index.mjs",
|
|
8
8
|
"types": "./dist/types/index.d.ts",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{r as t,c as e,h as o}from"./p-e6ddfc6c.js";const i=["ro","en"],s={en:{deleteTicket:"Delete ticket"},ro:{deleteTicket:"Sterge biletul"}},r=class{constructor(o){t(this,o),this.accordionEvent=e(this,"helperAccordionAction",7),this.headerTitle="",this.headerSubtitle="",this.description="",this.footer=!1,this.deleteTab=!1,this.postMessage=!1,this.eventName="helperAccordionAction",this.collapsed=!0,this.language="en"}connectedCallback(){this.showContent=!this.collapsed}toggleContent(){this.showContent=!this.showContent}deleteAction(){this.postMessage&&window.postMessage({type:this.eventName},window.location.href),this.accordionEvent.emit()}render(){return o("div",{class:"Wrapper"},o("div",{class:"Header"},o("p",{class:"Title"},this.headerTitle),o("p",{class:"Subtitle"},this.headerSubtitle),o("p",{class:"Subtitle"},this.description),o("span",{class:"Expand",onClick:()=>this.toggleContent()},this.showContent?"<":">")),this.showContent&&o("div",null,o("div",{class:"Content"},o("slot",{name:"accordionContent"}),this.footer&&this.showContent&&o("div",null,this.deleteTab&&o("span",{class:"ActionButton",onClick:()=>this.deleteAction()},(()=>{const t=this.language;return s[void 0!==t&&i.includes(t)?t:"en"].deleteTicket})())))))}};r.style='@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap");:host{display:block;font-family:"Roboto", sans-serif}.Header{border-radius:4px;margin-bottom:1px;background:#009993;display:flex;gap:30px;border:1px solid #009993;padding:8px 10px;user-select:none}.Header:hover{background:#00ABA4}.Header .Title,.Header .Subtitle,.Header .Description{margin:0;font-size:14px;color:#fff}.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}.Content{border-radius:4px;background:#fff;border:1px solid #009993;padding:10px 15px;user-select:none;color:#000;margin-bottom:10px}.ActionButton{border-radius:4px;margin-top:10px;cursor:pointer;text-transform:capitalize;display:block;font-size:12px;text-align:center;padding:8px 20px;width:80px;background:#FF3D00;border:1px solid #FF3D00;color:#FFF}.ActionButton:hover{background:#FF6536;border:1px solid #FF3D00}';export{r as helper_accordion}
|