@xplortech/apollo-core 0.0.2 → 0.0.3
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/build/style.css +189 -35
- package/dist/apollo-core/apollo-core.css +2 -2
- package/dist/apollo-core/apollo-core.esm.js +1 -1
- package/dist/apollo-core/p-1c170a38.system.js +1 -1
- package/dist/apollo-core/p-3786b102.entry.js +5 -0
- package/dist/apollo-core/p-8afc6cd0.system.entry.js +5 -0
- package/dist/cjs/apollo-core.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/xpl-button_3.cjs.entry.js +2496 -2
- package/dist/collection/components/xpl-button/xpl-button.js +81 -10
- package/dist/collection/components/xpl-pagination/xpl-pagination.js +5 -10
- package/dist/custom-elements/index.js +2497 -3
- package/dist/esm/apollo-core.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/xpl-button_3.entry.js +2496 -2
- package/dist/esm-es5/apollo-core.js +1 -1
- package/dist/esm-es5/loader.js +1 -1
- package/dist/esm-es5/xpl-button_3.entry.js +5 -1
- package/dist/types/.stencil/xpl-button/xpl-button.d.ts +5 -1
- package/dist/types/components.d.ts +9 -3
- package/package.json +6 -4
- package/dist/apollo-core/p-933b8694.entry.js +0 -1
- package/dist/apollo-core/p-c0ff6f68.system.entry.js +0 -1
|
@@ -1,20 +1,38 @@
|
|
|
1
1
|
import { Component, Host, h, Prop } from "@stencil/core";
|
|
2
|
+
import "@fortawesome/fontawesome-free";
|
|
2
3
|
export class XplButton {
|
|
4
|
+
constructor() {
|
|
5
|
+
this.size = "default";
|
|
6
|
+
this.type = "primary";
|
|
7
|
+
}
|
|
3
8
|
render() {
|
|
4
9
|
let className = "xpl-button";
|
|
5
10
|
if (this.type === "secondary")
|
|
6
11
|
className += " xpl-button--secondary";
|
|
7
12
|
if (this.type === "subtle")
|
|
8
13
|
className += " xpl-button--subtle";
|
|
14
|
+
if (this.type === "error")
|
|
15
|
+
className += " xpl-button--error";
|
|
16
|
+
if (this.size === "sm")
|
|
17
|
+
className += " xpl-button--sm";
|
|
18
|
+
if (this.size === "xs")
|
|
19
|
+
className += " xpl-button--xs";
|
|
20
|
+
const icon = this.icon ? h("i", { class: `fas fa-${this.icon} ${this.iconTrailing ? "trailing" : ""}` }) : null;
|
|
9
21
|
return (h(Host, null,
|
|
10
22
|
/**
|
|
11
23
|
* Conditionally render either an <a> or <button> element
|
|
12
24
|
* depending on if there's an `href` or not
|
|
13
25
|
*/
|
|
14
26
|
this.href ? (h("a", { class: className, href: this.href, role: "button" },
|
|
15
|
-
|
|
16
|
-
h("slot", null)
|
|
17
|
-
h("
|
|
27
|
+
!this.iconTrailing && icon,
|
|
28
|
+
h("slot", null),
|
|
29
|
+
this.iconTrailing && icon)) : this.disabled ? (h("button", { class: className, role: "button", disabled: true },
|
|
30
|
+
!this.iconTrailing && icon,
|
|
31
|
+
h("slot", null),
|
|
32
|
+
this.iconTrailing && icon)) : (h("button", { class: className, role: "button" },
|
|
33
|
+
!this.iconTrailing && icon,
|
|
34
|
+
h("slot", null),
|
|
35
|
+
this.iconTrailing && icon))));
|
|
18
36
|
}
|
|
19
37
|
static get is() { return "xpl-button"; }
|
|
20
38
|
static get properties() { return {
|
|
@@ -35,24 +53,24 @@ export class XplButton {
|
|
|
35
53
|
"attribute": "disabled",
|
|
36
54
|
"reflect": false
|
|
37
55
|
},
|
|
38
|
-
"
|
|
56
|
+
"href": {
|
|
39
57
|
"type": "string",
|
|
40
58
|
"mutable": false,
|
|
41
59
|
"complexType": {
|
|
42
|
-
"original": "
|
|
43
|
-
"resolved": "
|
|
60
|
+
"original": "string",
|
|
61
|
+
"resolved": "string",
|
|
44
62
|
"references": {}
|
|
45
63
|
},
|
|
46
64
|
"required": false,
|
|
47
|
-
"optional":
|
|
65
|
+
"optional": true,
|
|
48
66
|
"docs": {
|
|
49
67
|
"tags": [],
|
|
50
68
|
"text": ""
|
|
51
69
|
},
|
|
52
|
-
"attribute": "
|
|
70
|
+
"attribute": "href",
|
|
53
71
|
"reflect": false
|
|
54
72
|
},
|
|
55
|
-
"
|
|
73
|
+
"icon": {
|
|
56
74
|
"type": "string",
|
|
57
75
|
"mutable": false,
|
|
58
76
|
"complexType": {
|
|
@@ -66,8 +84,61 @@ export class XplButton {
|
|
|
66
84
|
"tags": [],
|
|
67
85
|
"text": ""
|
|
68
86
|
},
|
|
69
|
-
"attribute": "
|
|
87
|
+
"attribute": "icon",
|
|
88
|
+
"reflect": false
|
|
89
|
+
},
|
|
90
|
+
"iconTrailing": {
|
|
91
|
+
"type": "boolean",
|
|
92
|
+
"mutable": false,
|
|
93
|
+
"complexType": {
|
|
94
|
+
"original": "boolean",
|
|
95
|
+
"resolved": "boolean",
|
|
96
|
+
"references": {}
|
|
97
|
+
},
|
|
98
|
+
"required": false,
|
|
99
|
+
"optional": true,
|
|
100
|
+
"docs": {
|
|
101
|
+
"tags": [],
|
|
102
|
+
"text": ""
|
|
103
|
+
},
|
|
104
|
+
"attribute": "icon-trailing",
|
|
70
105
|
"reflect": false
|
|
106
|
+
},
|
|
107
|
+
"size": {
|
|
108
|
+
"type": "string",
|
|
109
|
+
"mutable": false,
|
|
110
|
+
"complexType": {
|
|
111
|
+
"original": "\"default\" | \"sm\" | \"xs\"",
|
|
112
|
+
"resolved": "\"default\" | \"sm\" | \"xs\"",
|
|
113
|
+
"references": {}
|
|
114
|
+
},
|
|
115
|
+
"required": false,
|
|
116
|
+
"optional": false,
|
|
117
|
+
"docs": {
|
|
118
|
+
"tags": [],
|
|
119
|
+
"text": ""
|
|
120
|
+
},
|
|
121
|
+
"attribute": "size",
|
|
122
|
+
"reflect": false,
|
|
123
|
+
"defaultValue": "\"default\""
|
|
124
|
+
},
|
|
125
|
+
"type": {
|
|
126
|
+
"type": "string",
|
|
127
|
+
"mutable": false,
|
|
128
|
+
"complexType": {
|
|
129
|
+
"original": "\"primary\" | \"secondary\" | \"subtle\" | \"error\"",
|
|
130
|
+
"resolved": "\"error\" | \"primary\" | \"secondary\" | \"subtle\"",
|
|
131
|
+
"references": {}
|
|
132
|
+
},
|
|
133
|
+
"required": false,
|
|
134
|
+
"optional": false,
|
|
135
|
+
"docs": {
|
|
136
|
+
"tags": [],
|
|
137
|
+
"text": ""
|
|
138
|
+
},
|
|
139
|
+
"attribute": "type",
|
|
140
|
+
"reflect": false,
|
|
141
|
+
"defaultValue": "\"primary\""
|
|
71
142
|
}
|
|
72
143
|
}; }
|
|
73
144
|
}
|
|
@@ -58,19 +58,14 @@ export class XplPagination {
|
|
|
58
58
|
h("div", { class: "xpl-pagination" },
|
|
59
59
|
h("div", null,
|
|
60
60
|
h("p", null,
|
|
61
|
-
"Showing",
|
|
62
|
-
" ",
|
|
61
|
+
"Showing ",
|
|
63
62
|
h("span", null, showingFirst),
|
|
64
|
-
" ",
|
|
65
|
-
"to",
|
|
66
|
-
" ",
|
|
63
|
+
" to ",
|
|
67
64
|
h("span", null, showingLast),
|
|
68
65
|
" ",
|
|
69
|
-
"of",
|
|
70
|
-
" ",
|
|
66
|
+
"of ",
|
|
71
67
|
h("span", null, this.total),
|
|
72
|
-
" ",
|
|
73
|
-
"results")),
|
|
68
|
+
" results")),
|
|
74
69
|
h("div", null,
|
|
75
70
|
h("nav", { "aria-label": "Pagination" },
|
|
76
71
|
h("button", { onClick: this.goPrev, class: "xpl-pagination-prev" },
|
|
@@ -183,7 +178,7 @@ export class XplPagination {
|
|
|
183
178
|
"return": "Promise<void>"
|
|
184
179
|
},
|
|
185
180
|
"docs": {
|
|
186
|
-
"text": "Calling `goto` with a page number (which should probably be
|
|
181
|
+
"text": "Calling `goto` with a page number (which should probably be\ntaken from the `page` event) updates the pagination's state\nand re-renders it, showing the appropriate buttons given the current page.",
|
|
187
182
|
"tags": [{
|
|
188
183
|
"name": "param",
|
|
189
184
|
"text": "n"
|