@pine-ds/icons 3.2.0 → 3.3.0-rc.0
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/components/pds-icon.d.ts +2 -2
- package/components/pds-icon.js +175 -171
- package/components/pds-icon.js.map +1 -1
- package/components/utils.js +65 -45
- package/components/utils.js.map +1 -1
- package/dist/cheatsheet.html +3 -3
- package/dist/cjs/{index-b35d5b0f.js → index-17212f65.js} +81 -21
- package/dist/cjs/index-17212f65.js.map +1 -0
- package/dist/cjs/index.cjs.js +2 -2
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/pds-icon.cjs.entry.js +152 -150
- package/dist/cjs/pds-icon.cjs.entry.js.map +1 -1
- package/dist/cjs/pds-icons.cjs.js +3 -3
- package/dist/cjs/pds-icons.cjs.js.map +1 -1
- package/dist/cjs/utils-8c57ce6a.js +101 -0
- package/dist/cjs/utils-8c57ce6a.js.map +1 -0
- package/dist/collection/collection-manifest.json +1 -1
- package/dist/collection/components/pds-icon/pds-icon.js +189 -168
- package/dist/collection/components/pds-icon/pds-icon.js.map +1 -1
- package/dist/collection/components/pds-icon/request.js +21 -21
- package/dist/collection/components/pds-icon/request.js.map +1 -1
- package/dist/collection/components/pds-icon/test/pds-icon.e2e.js +6 -6
- package/dist/collection/components/pds-icon/test/pds-icon.e2e.js.map +1 -1
- package/dist/collection/components/pds-icon/test/pds-icon.spec.js +69 -31
- package/dist/collection/components/pds-icon/test/pds-icon.spec.js.map +1 -1
- package/dist/collection/components/pds-icon/utils.js +61 -51
- package/dist/collection/components/pds-icon/utils.js.map +1 -1
- package/dist/collection/components/pds-icon/validate.js +35 -35
- package/dist/collection/components/pds-icon/validate.js.map +1 -1
- package/dist/docs.json +23 -2
- package/dist/esm/{index-8effeb27.js → index-d1a605fc.js} +81 -21
- package/dist/esm/index-d1a605fc.js.map +1 -0
- package/dist/esm/index.js +2 -2
- package/dist/esm/loader.js +3 -3
- package/dist/esm/pds-icon.entry.js +152 -150
- package/dist/esm/pds-icon.entry.js.map +1 -1
- package/dist/esm/pds-icons.js +4 -4
- package/dist/esm/pds-icons.js.map +1 -1
- package/dist/esm/utils-15462a67.js +95 -0
- package/dist/esm/utils-15462a67.js.map +1 -0
- package/dist/pds-icons/index.esm.js +1 -1
- package/dist/pds-icons/p-19d7058a.js +3 -0
- package/dist/pds-icons/p-19d7058a.js.map +1 -0
- package/dist/pds-icons/p-229b8f4e.entry.js +2 -0
- package/dist/pds-icons/p-229b8f4e.entry.js.map +1 -0
- package/dist/pds-icons/p-f0b1dbd6.js +2 -0
- package/dist/pds-icons/p-f0b1dbd6.js.map +1 -0
- package/dist/pds-icons/pds-icons.esm.js +1 -1
- package/dist/pds-icons/pds-icons.esm.js.map +1 -1
- package/dist/pds-icons.json +1 -1
- package/dist/pds-icons.symbols.svg +1 -1
- package/dist/types/components/pds-icon/pds-icon.d.ts +41 -35
- package/dist/types/components/pds-icon/utils.d.ts +4 -4
- package/dist/types/components.d.ts +8 -0
- package/dist/types/stencil-public-runtime.d.ts +29 -0
- package/icons/index.d.ts +1 -1
- package/icons/index.js +1 -1
- package/icons/index.mjs +1 -1
- package/icons/package.json +1 -1
- package/package.json +6 -6
- package/dist/cjs/index-b35d5b0f.js.map +0 -1
- package/dist/cjs/utils-395a38b7.js +0 -81
- package/dist/cjs/utils-395a38b7.js.map +0 -1
- package/dist/esm/index-8effeb27.js.map +0 -1
- package/dist/esm/utils-a0ad61d0.js +0 -75
- package/dist/esm/utils-a0ad61d0.js.map +0 -1
- package/dist/pds-icons/p-91678731.entry.js +0 -2
- package/dist/pds-icons/p-91678731.entry.js.map +0 -1
- package/dist/pds-icons/p-a3383818.js +0 -3
- package/dist/pds-icons/p-a3383818.js.map +0 -1
- package/dist/pds-icons/p-dc5765cb.js +0 -2
- package/dist/pds-icons/p-dc5765cb.js.map +0 -1
package/dist/esm/loader.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { b as bootstrapLazy } from './index-
|
|
2
|
-
export { s as setNonce } from './index-
|
|
1
|
+
import { b as bootstrapLazy } from './index-d1a605fc.js';
|
|
2
|
+
export { s as setNonce } from './index-d1a605fc.js';
|
|
3
3
|
|
|
4
4
|
const defineCustomElements = (win, options) => {
|
|
5
5
|
if (typeof window === 'undefined') return undefined;
|
|
6
|
-
return bootstrapLazy([["pds-icon",[[1,"pds-icon",{"color":[1],"name":[513],"size":[513],"ariaLabel":[32],"isVisible":[32],"svgContent":[32]},null,{"name":["loadIcon"]}]]]], options);
|
|
6
|
+
return bootstrapLazy([["pds-icon",[[1,"pds-icon",{"color":[1],"icon":[8],"name":[513],"size":[513],"ariaLabel":[32],"isVisible":[32],"svgContent":[32]},null,{"name":["loadIcon"],"icon":["loadIcon"]}]]]], options);
|
|
7
7
|
};
|
|
8
8
|
|
|
9
9
|
export { defineCustomElements };
|
|
@@ -1,183 +1,185 @@
|
|
|
1
|
-
import { r as registerInstance, h, H as Host, a as getElement } from './index-
|
|
2
|
-
import { i as isStr, b as inheritAttributes, g as getUrl, c as getName } from './utils-
|
|
1
|
+
import { r as registerInstance, h, H as Host, a as getElement } from './index-d1a605fc.js';
|
|
2
|
+
import { i as isStr, b as inheritAttributes, g as getUrl, c as getName } from './utils-15462a67.js';
|
|
3
3
|
|
|
4
4
|
const validateContent = (svgContent) => {
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
5
|
+
const div = document.createElement('div');
|
|
6
|
+
div.innerHTML = svgContent;
|
|
7
|
+
// setup this way to ensure it works on our buddy IE
|
|
8
|
+
for (let i = div.childNodes.length - 1; i >= 0; i--) {
|
|
9
|
+
if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {
|
|
10
|
+
div.removeChild(div.childNodes[i]);
|
|
11
|
+
}
|
|
11
12
|
}
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
13
|
+
// must only have 1 root element
|
|
14
|
+
const svgElm = div.firstElementChild;
|
|
15
|
+
if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {
|
|
16
|
+
const svgClass = svgElm.getAttribute('class') || '';
|
|
17
|
+
svgElm.setAttribute('class', (svgClass + ' s-ion-icon').trim());
|
|
18
|
+
// root element must be an svg
|
|
19
|
+
// lets double check we've got valid elements
|
|
20
|
+
// do not allow scripts
|
|
21
|
+
if (isValid(svgElm)) {
|
|
22
|
+
return div.innerHTML;
|
|
23
|
+
}
|
|
23
24
|
}
|
|
24
|
-
|
|
25
|
-
return '';
|
|
25
|
+
return '';
|
|
26
26
|
};
|
|
27
27
|
const isValid = (elm) => {
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
28
|
+
if (elm.nodeType === 1) {
|
|
29
|
+
if (elm.nodeName.toLowerCase() === 'script') {
|
|
30
|
+
return false;
|
|
31
|
+
}
|
|
32
|
+
for (let i = 0; i < elm.attributes.length; i++) {
|
|
33
|
+
const name = elm.attributes[i].name;
|
|
34
|
+
if (isStr(name) && name.toLowerCase().indexOf('on') === 0) {
|
|
35
|
+
return false;
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
for (let i = 0; i < elm.childNodes.length; i++) {
|
|
39
|
+
if (!isValid(elm.childNodes[i])) {
|
|
40
|
+
return false;
|
|
41
|
+
}
|
|
42
|
+
}
|
|
42
43
|
}
|
|
43
|
-
|
|
44
|
-
return true;
|
|
44
|
+
return true;
|
|
45
45
|
};
|
|
46
46
|
|
|
47
47
|
const pdsIconContent = new Map();
|
|
48
48
|
const requests = new Map(); // eslint-disable-line @typescript-eslint/no-explicit-any
|
|
49
49
|
const getSvgContent = (url, sanitize = false) => {
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
50
|
+
let req = requests.get(url);
|
|
51
|
+
if (!req) {
|
|
52
|
+
if (typeof fetch != 'undefined' && typeof document !== 'undefined') {
|
|
53
|
+
// we don't have a request
|
|
54
|
+
req = fetch(url).then((rsp) => {
|
|
55
|
+
if (rsp.ok) {
|
|
56
|
+
return rsp.text().then((svgContent) => {
|
|
57
|
+
if (svgContent && sanitize !== false) {
|
|
58
|
+
svgContent = validateContent(svgContent);
|
|
59
|
+
}
|
|
60
|
+
pdsIconContent.set(url, svgContent || '');
|
|
61
|
+
});
|
|
62
|
+
}
|
|
63
|
+
pdsIconContent.set(url, '');
|
|
64
|
+
});
|
|
65
|
+
requests.set(url, req);
|
|
66
|
+
}
|
|
67
|
+
else {
|
|
68
|
+
pdsIconContent.set(url, '');
|
|
69
|
+
return Promise.resolve();
|
|
62
70
|
}
|
|
63
|
-
pdsIconContent.set(url, '');
|
|
64
|
-
});
|
|
65
|
-
requests.set(url, req);
|
|
66
|
-
}
|
|
67
|
-
else {
|
|
68
|
-
pdsIconContent.set(url, '');
|
|
69
|
-
return Promise.resolve();
|
|
70
71
|
}
|
|
71
|
-
|
|
72
|
-
return req;
|
|
72
|
+
return req;
|
|
73
73
|
};
|
|
74
74
|
|
|
75
75
|
const pdsIconCss = ":host{contain:strict;display:inline-block;fill:currentColor;height:1em;width:1em}:host .pdsicon{fill:currentColor}.pds-icon-fill-none{fill:none}.icon-inner,.pds-icon,svg{display:block;height:100%;width:100%}";
|
|
76
76
|
|
|
77
77
|
const PdsIcon = class {
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
iconSize() {
|
|
93
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
94
|
-
const sizes = {
|
|
95
|
-
small: '12px',
|
|
96
|
-
regular: '16px',
|
|
97
|
-
medium: '20px',
|
|
98
|
-
large: '24px',
|
|
99
|
-
};
|
|
100
|
-
if (sizes[this.size]) {
|
|
101
|
-
return sizes[this.size];
|
|
78
|
+
constructor(hostRef) {
|
|
79
|
+
registerInstance(this, hostRef);
|
|
80
|
+
this.inheritedAttributes = {}; // eslint-disable-line @typescript-eslint/no-explicit-any
|
|
81
|
+
this.hasAriaHidden = () => {
|
|
82
|
+
const { el } = this;
|
|
83
|
+
return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';
|
|
84
|
+
};
|
|
85
|
+
this.ariaLabel = undefined;
|
|
86
|
+
this.isVisible = false;
|
|
87
|
+
this.svgContent = undefined;
|
|
88
|
+
this.color = undefined;
|
|
89
|
+
this.icon = undefined;
|
|
90
|
+
this.name = undefined;
|
|
91
|
+
this.size = 'regular';
|
|
102
92
|
}
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
this.loadIcon();
|
|
114
|
-
});
|
|
115
|
-
}
|
|
116
|
-
disconnectedCallback() {
|
|
117
|
-
if (this.io) {
|
|
118
|
-
this.io.disconnect();
|
|
119
|
-
this.io = undefined;
|
|
120
|
-
}
|
|
121
|
-
}
|
|
122
|
-
loadIcon() {
|
|
123
|
-
if (this.isVisible) {
|
|
124
|
-
const url = getUrl(this);
|
|
125
|
-
if (url) {
|
|
126
|
-
if (pdsIconContent.has(url)) {
|
|
127
|
-
this.svgContent = pdsIconContent.get(url);
|
|
93
|
+
iconSize() {
|
|
94
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
95
|
+
const sizes = {
|
|
96
|
+
small: '12px',
|
|
97
|
+
regular: '16px',
|
|
98
|
+
medium: '20px',
|
|
99
|
+
large: '24px',
|
|
100
|
+
};
|
|
101
|
+
if (sizes[this.size]) {
|
|
102
|
+
return sizes[this.size];
|
|
128
103
|
}
|
|
129
104
|
else {
|
|
130
|
-
|
|
105
|
+
return this.size;
|
|
131
106
|
}
|
|
132
|
-
}
|
|
133
107
|
}
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
this.ariaLabel = label.replace(/\-/g, ' ');
|
|
108
|
+
componentWillLoad() {
|
|
109
|
+
this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);
|
|
137
110
|
}
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
111
|
+
connectedCallback() {
|
|
112
|
+
this.waitUntilVisible(this.el, '50px', () => {
|
|
113
|
+
this.isVisible = true;
|
|
114
|
+
this.loadIcon();
|
|
115
|
+
});
|
|
116
|
+
}
|
|
117
|
+
disconnectedCallback() {
|
|
118
|
+
if (this.io) {
|
|
119
|
+
this.io.disconnect();
|
|
120
|
+
this.io = undefined;
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
loadIcon() {
|
|
124
|
+
if (this.isVisible) {
|
|
125
|
+
const url = getUrl(this);
|
|
126
|
+
if (url) {
|
|
127
|
+
if (pdsIconContent.has(url)) {
|
|
128
|
+
this.svgContent = pdsIconContent.get(url);
|
|
129
|
+
}
|
|
130
|
+
else {
|
|
131
|
+
getSvgContent(url).then(() => (this.svgContent = pdsIconContent.get(url)));
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
const label = getName(this.name, this.icon);
|
|
136
|
+
if (label) {
|
|
137
|
+
this.ariaLabel = label.replace(/\-/g, ' ');
|
|
158
138
|
}
|
|
159
|
-
}, { rootMargin }));
|
|
160
|
-
io.observe(el);
|
|
161
139
|
}
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
140
|
+
render() {
|
|
141
|
+
const { ariaLabel, inheritedAttributes } = this;
|
|
142
|
+
const style = {
|
|
143
|
+
height: this.iconSize(),
|
|
144
|
+
width: this.iconSize(),
|
|
145
|
+
color: this.color,
|
|
146
|
+
};
|
|
147
|
+
return (h(Host, Object.assign({ "aria-label": ariaLabel !== undefined && !this.hasAriaHidden() ? ariaLabel : null, role: "img", style: style, class: Object.assign({}, createColorClasses(this.color)) }, inheritedAttributes), this.svgContent ? (h("div", { class: "icon-inner", innerHTML: this.svgContent })) : (h("div", { class: "icon-inner" }))));
|
|
166
148
|
}
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
149
|
+
/*****
|
|
150
|
+
* Private Methods
|
|
151
|
+
****/
|
|
152
|
+
waitUntilVisible(el, rootMargin, cb) {
|
|
153
|
+
if (typeof window !== 'undefined' && (window).IntersectionObserver) {
|
|
154
|
+
const io = (this.io = new (window).IntersectionObserver((data) => {
|
|
155
|
+
if (data[0].isIntersecting) {
|
|
156
|
+
io.disconnect();
|
|
157
|
+
this.io = undefined;
|
|
158
|
+
cb();
|
|
159
|
+
}
|
|
160
|
+
}, { rootMargin }));
|
|
161
|
+
io.observe(el);
|
|
162
|
+
}
|
|
163
|
+
else {
|
|
164
|
+
// browser doesn't support IntersectionObserver
|
|
165
|
+
// so just fallback to always show it
|
|
166
|
+
cb();
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
static get assetsDirs() { return ["svg"]; }
|
|
170
|
+
get el() { return getElement(this); }
|
|
171
|
+
static get watchers() { return {
|
|
172
|
+
"name": ["loadIcon"],
|
|
173
|
+
"icon": ["loadIcon"]
|
|
174
|
+
}; }
|
|
173
175
|
};
|
|
174
176
|
const createColorClasses = (color) => {
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
177
|
+
return color
|
|
178
|
+
? {
|
|
179
|
+
'pds-color': true,
|
|
180
|
+
[`pds-color-${color}`]: true,
|
|
181
|
+
}
|
|
182
|
+
: null;
|
|
181
183
|
};
|
|
182
184
|
PdsIcon.style = pdsIconCss;
|
|
183
185
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"pds-icon.entry.js","mappings":"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","names":[],"sources":["src/components/pds-icon/validate.ts","src/components/pds-icon/request.ts","src/components/pds-icon/pds-icon.scss?tag=pds-icon&encapsulation=shadow","src/components/pds-icon/pds-icon.tsx"],"sourcesContent":["import { isStr } from './utils';\n\nexport const validateContent = (svgContent: string) => {\n const div = document.createElement('div');\n div.innerHTML = svgContent;\n\n // setup this way to ensure it works on our buddy IE\n for (let i = div.childNodes.length - 1; i >= 0; i--) {\n if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {\n div.removeChild(div.childNodes[i]);\n }\n }\n\n // must only have 1 root element\n const svgElm = div.firstElementChild;\n if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {\n const svgClass = svgElm.getAttribute('class') || '';\n svgElm.setAttribute('class', (svgClass + ' s-ion-icon').trim());\n\n // root element must be an svg\n // lets double check we've got valid elements\n // do not allow scripts\n if (isValid(svgElm as HTMLElement)) {\n return div.innerHTML;\n }\n }\n return '';\n};\n\nexport const isValid = (elm: HTMLElement) => {\n if (elm.nodeType === 1) {\n if (elm.nodeName.toLowerCase() === 'script') {\n return false;\n }\n\n for (let i = 0; i < elm.attributes.length; i++) {\n const name = elm.attributes[i].name;\n if (isStr(name) && name.toLowerCase().indexOf('on') === 0) {\n return false;\n }\n }\n\n for (let i = 0; i < elm.childNodes.length; i++) {\n if (!isValid(elm.childNodes[i] as HTMLElement)) {\n return false;\n }\n }\n }\n return true;\n};\n","import { validateContent } from './validate';\n\nexport const pdsIconContent = new Map<string, string>();\nconst requests = new Map<string, Promise<any>>(); // eslint-disable-line @typescript-eslint/no-explicit-any\n\nexport const getSvgContent = (url: string, sanitize = false) => {\n let req = requests.get(url);\n\n if(!req) {\n if (typeof fetch != 'undefined' && typeof document !== 'undefined') {\n // we don't have a request\n req = fetch(url).then((rsp) => {\n if (rsp.ok) {\n return rsp.text().then((svgContent) => {\n if (svgContent && sanitize !== false) {\n svgContent = validateContent(svgContent);\n }\n pdsIconContent.set(url, svgContent || '');\n });\n }\n pdsIconContent.set(url, '');\n });\n\n requests.set(url, req);\n } else {\n pdsIconContent.set(url, '');\n return Promise.resolve();\n }\n }\n return req;\n}\n",":host {\n contain: strict;\n display: inline-block;\n fill: currentColor;\n height: 1em;\n width: 1em;\n\n .pdsicon {\n fill: currentColor;\n }\n}\n\n.pds-icon-fill-none {\n fill: none;\n}\n\n.icon-inner,\n.pds-icon,\nsvg {\n display: block;\n height: 100%;\n width: 100%;\n}\n","import { Build, Component, Element, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { getSvgContent, pdsIconContent } from './request';\nimport { getName, getUrl, inheritAttributes } from './utils';\n\n@Component({\n tag: 'pds-icon',\n assetsDirs: ['svg'],\n styleUrl: 'pds-icon.scss',\n shadow: true,\n})\nexport class PdsIcon {\n private io?: IntersectionObserver;\n private inheritedAttributes: { [k: string]: any } = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n\n @Element() el!: HTMLPdsIconElement;\n\n @State() private ariaLabel?: string;\n @State() private isVisible = false;\n @State() private svgContent?: string;\n\n /**\n *\n * The color of the icon\n *\n */\n @Prop() color?: string;\n\n /**\n * The name of the icon to use from\n * the built-in set.\n */\n @Prop({ reflect: true }) name?: string;\n\n /**\n * The size of the icon. This can be\n * 'small', 'regular', 'medium', large, or a\n * custom value (40px, 1rem, etc)\n *\n */\n @Prop({ reflect: true }) size?:\n | 'small' // 12px\n | 'regular' // 16px\n | 'medium' // 20px\n | 'large' // 24px\n | 'auto'\n | string = 'regular'\n\n private iconSize() {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const sizes: { [key: string]: any } = {\n small: '12px',\n regular: '16px',\n medium: '20px',\n large: '24px',\n }\n\n if (sizes[this.size]) {\n return sizes[this.size];\n } else {\n return this.size;\n }\n }\n componentWillLoad() {\n this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);\n }\n\n connectedCallback() {\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n })\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n\n @Watch('name')\n loadIcon() {\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (pdsIconContent.has(url)) {\n this.svgContent = pdsIconContent.get(url);\n } else {\n getSvgContent(url).then(() => (this.svgContent = pdsIconContent.get(url)));\n }\n }\n }\n\n const label = getName(this.name);\n\n if (label) {\n this.ariaLabel = label.replace(/\\-/g, ' ');\n }\n }\n\n render() {\n const { ariaLabel, inheritedAttributes } = this;\n\n const style = {\n height: this.iconSize(),\n width: this.iconSize(),\n color: this.color,\n }\n\n return (\n\n <Host\n aria-label={ariaLabel !== undefined && !this.hasAriaHidden() ? ariaLabel : null }\n role=\"img\"\n style={style}\n class={{\n ...createColorClasses(this.color),\n }}\n {...inheritedAttributes}\n >\n {Build.isBrowser && this.svgContent ? (\n <div class=\"icon-inner\" innerHTML={this.svgContent}></div>\n ) : (\n <div class=\"icon-inner\"></div>\n )}\n </Host>\n )\n }\n\n /*****\n * Private Methods\n ****/\n\n private waitUntilVisible(el: HTMLElement, rootMargin: string, cb: () => void) {\n if (Build.isBrowser && typeof window !== 'undefined' && (window).IntersectionObserver) {\n const io = (this.io = new (window).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].isIntersecting) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n },\n { rootMargin },\n ));\n\n io.observe(el);\n } else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n\n private hasAriaHidden = () => {\n const { el } = this;\n\n return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';\n }\n}\n\nconst createColorClasses = (color: string | undefined) => {\n return color\n ? {\n 'pds-color': true,\n [`pds-color-${color}`]: true,\n }\n : null;\n };\n"],"version":3}
|
|
1
|
+
{"file":"pds-icon.entry.js","mappings":"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","names":[],"sources":["src/components/pds-icon/validate.ts","src/components/pds-icon/request.ts","src/components/pds-icon/pds-icon.scss?tag=pds-icon&encapsulation=shadow","src/components/pds-icon/pds-icon.tsx"],"sourcesContent":["import { isStr } from './utils';\n\nexport const validateContent = (svgContent: string) => {\n const div = document.createElement('div');\n div.innerHTML = svgContent;\n\n // setup this way to ensure it works on our buddy IE\n for (let i = div.childNodes.length - 1; i >= 0; i--) {\n if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {\n div.removeChild(div.childNodes[i]);\n }\n }\n\n // must only have 1 root element\n const svgElm = div.firstElementChild;\n if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {\n const svgClass = svgElm.getAttribute('class') || '';\n svgElm.setAttribute('class', (svgClass + ' s-ion-icon').trim());\n\n // root element must be an svg\n // lets double check we've got valid elements\n // do not allow scripts\n if (isValid(svgElm as HTMLElement)) {\n return div.innerHTML;\n }\n }\n return '';\n};\n\nexport const isValid = (elm: HTMLElement) => {\n if (elm.nodeType === 1) {\n if (elm.nodeName.toLowerCase() === 'script') {\n return false;\n }\n\n for (let i = 0; i < elm.attributes.length; i++) {\n const name = elm.attributes[i].name;\n if (isStr(name) && name.toLowerCase().indexOf('on') === 0) {\n return false;\n }\n }\n\n for (let i = 0; i < elm.childNodes.length; i++) {\n if (!isValid(elm.childNodes[i] as HTMLElement)) {\n return false;\n }\n }\n }\n return true;\n};\n","import { validateContent } from './validate';\n\nexport const pdsIconContent = new Map<string, string>();\nconst requests = new Map<string, Promise<any>>(); // eslint-disable-line @typescript-eslint/no-explicit-any\n\nexport const getSvgContent = (url: string, sanitize = false) => {\n let req = requests.get(url);\n\n if(!req) {\n if (typeof fetch != 'undefined' && typeof document !== 'undefined') {\n // we don't have a request\n req = fetch(url).then((rsp) => {\n if (rsp.ok) {\n return rsp.text().then((svgContent) => {\n if (svgContent && sanitize !== false) {\n svgContent = validateContent(svgContent);\n }\n pdsIconContent.set(url, svgContent || '');\n });\n }\n pdsIconContent.set(url, '');\n });\n\n requests.set(url, req);\n } else {\n pdsIconContent.set(url, '');\n return Promise.resolve();\n }\n }\n return req;\n}\n",":host {\n contain: strict;\n display: inline-block;\n fill: currentColor;\n height: 1em;\n width: 1em;\n\n .pdsicon {\n fill: currentColor;\n }\n}\n\n.pds-icon-fill-none {\n fill: none;\n}\n\n.icon-inner,\n.pds-icon,\nsvg {\n display: block;\n height: 100%;\n width: 100%;\n}\n","import { Build, Component, Element, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { getSvgContent, pdsIconContent } from './request';\nimport { getName, getUrl, inheritAttributes } from './utils';\n\n@Component({\n tag: 'pds-icon',\n assetsDirs: ['svg'],\n styleUrl: 'pds-icon.scss',\n shadow: true,\n})\nexport class PdsIcon {\n private io?: IntersectionObserver;\n private inheritedAttributes: { [k: string]: any } = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n\n @Element() el!: HTMLPdsIconElement;\n\n @State() private ariaLabel?: string;\n @State() private isVisible = false;\n @State() private svgContent?: string;\n\n /**\n *\n * The color of the icon\n *\n */\n @Prop() color?: string;\n\n /**\n * This a combination of both `name` and `src`. If a `src` url is detected\n * it will set the `src` property. Otherwise it assumes it's a built-in named\n * SVG and set the `name` property.\n */\n @Prop() icon?: any;\n\n /**\n * The name of the icon to use from\n * the built-in set.\n */\n @Prop({ reflect: true }) name?: string;\n\n /**\n * The size of the icon. This can be\n * 'small', 'regular', 'medium', large, or a\n * custom value (40px, 1rem, etc)\n *\n */\n @Prop({ reflect: true }) size?:\n | 'small' // 12px\n | 'regular' // 16px\n | 'medium' // 20px\n | 'large' // 24px\n | 'auto'\n | string = 'regular'\n\n private iconSize() {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const sizes: { [key: string]: any } = {\n small: '12px',\n regular: '16px',\n medium: '20px',\n large: '24px',\n }\n\n if (sizes[this.size]) {\n return sizes[this.size];\n } else {\n return this.size;\n }\n }\n componentWillLoad() {\n this.inheritedAttributes = inheritAttributes(this.el, ['aria-label']);\n }\n\n connectedCallback() {\n this.waitUntilVisible(this.el, '50px', () => {\n this.isVisible = true;\n this.loadIcon();\n })\n }\n\n disconnectedCallback() {\n if (this.io) {\n this.io.disconnect();\n this.io = undefined;\n }\n }\n\n @Watch('name')\n @Watch('icon')\n loadIcon() {\n if (Build.isBrowser && this.isVisible) {\n const url = getUrl(this);\n if (url) {\n if (pdsIconContent.has(url)) {\n this.svgContent = pdsIconContent.get(url);\n } else {\n getSvgContent(url).then(() => (this.svgContent = pdsIconContent.get(url)));\n }\n }\n }\n\n const label = getName(this.name, this.icon);\n\n if (label) {\n this.ariaLabel = label.replace(/\\-/g, ' ');\n }\n }\n\n render() {\n const { ariaLabel, inheritedAttributes } = this;\n\n const style = {\n height: this.iconSize(),\n width: this.iconSize(),\n color: this.color,\n }\n\n return (\n\n <Host\n aria-label={ariaLabel !== undefined && !this.hasAriaHidden() ? ariaLabel : null }\n role=\"img\"\n style={style}\n class={{\n ...createColorClasses(this.color),\n }}\n {...inheritedAttributes}\n >\n {Build.isBrowser && this.svgContent ? (\n <div class=\"icon-inner\" innerHTML={this.svgContent}></div>\n ) : (\n <div class=\"icon-inner\"></div>\n )}\n </Host>\n )\n }\n\n /*****\n * Private Methods\n ****/\n\n private waitUntilVisible(el: HTMLElement, rootMargin: string, cb: () => void) {\n if (Build.isBrowser && typeof window !== 'undefined' && (window).IntersectionObserver) {\n const io = (this.io = new (window).IntersectionObserver(\n (data: IntersectionObserverEntry[]) => {\n if (data[0].isIntersecting) {\n io.disconnect();\n this.io = undefined;\n cb();\n }\n },\n { rootMargin },\n ));\n\n io.observe(el);\n } else {\n // browser doesn't support IntersectionObserver\n // so just fallback to always show it\n cb();\n }\n }\n\n private hasAriaHidden = () => {\n const { el } = this;\n\n return el.hasAttribute('aria-hidden') && el.getAttribute('aria-hidden') === 'true';\n }\n}\n\nconst createColorClasses = (color: string | undefined) => {\n return color\n ? {\n 'pds-color': true,\n [`pds-color-${color}`]: true,\n }\n : null;\n };\n"],"version":3}
|
package/dist/esm/pds-icons.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { p as promiseResolve, b as bootstrapLazy } from './index-
|
|
2
|
-
export { s as setNonce } from './index-
|
|
1
|
+
import { p as promiseResolve, b as bootstrapLazy } from './index-d1a605fc.js';
|
|
2
|
+
export { s as setNonce } from './index-d1a605fc.js';
|
|
3
3
|
|
|
4
4
|
/*
|
|
5
|
-
Stencil Client Patch Browser v4.
|
|
5
|
+
Stencil Client Patch Browser v4.8.1 | MIT Licensed | https://stenciljs.com
|
|
6
6
|
*/
|
|
7
7
|
const patchBrowser = () => {
|
|
8
8
|
const importMeta = import.meta.url;
|
|
@@ -14,7 +14,7 @@ const patchBrowser = () => {
|
|
|
14
14
|
};
|
|
15
15
|
|
|
16
16
|
patchBrowser().then(options => {
|
|
17
|
-
return bootstrapLazy([["pds-icon",[[1,"pds-icon",{"color":[1],"name":[513],"size":[513],"ariaLabel":[32],"isVisible":[32],"svgContent":[32]},null,{"name":["loadIcon"]}]]]], options);
|
|
17
|
+
return bootstrapLazy([["pds-icon",[[1,"pds-icon",{"color":[1],"icon":[8],"name":[513],"size":[513],"ariaLabel":[32],"isVisible":[32],"svgContent":[32]},null,{"name":["loadIcon"],"icon":["loadIcon"]}]]]], options);
|
|
18
18
|
});
|
|
19
19
|
|
|
20
20
|
//# sourceMappingURL=pds-icons.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"pds-icons.js","mappings":";;;AAAA;AACA;AACA;AAGA,MAAM,YAAY,GAAG,MAAM;
|
|
1
|
+
{"file":"pds-icons.js","mappings":";;;AAAA;AACA;AACA;AAGA,MAAM,YAAY,GAAG,MAAM;AAa3B,IAAI,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC;AACvC,IAAI,MAAM,IAAI,GAAiE,EAAE,CAAC;AAClF,IAAI,IAAI,UAAU,KAAK,EAAE,EAAE;AAC3B,QAAQ,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI,CAAC;AAC1D,KAAK;AACL,IAAI,OAAO,cAAc,CAAC,IAAI,CAAC,CAAC;AAChC,CAAC;;ACpBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,IAAI;AAE/B,EAAE,OAAO,aAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC,CAAC;AAC9D,CAAC,CAAC","names":[],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.8.1 | MIT Licensed | https://stenciljs.com\n */\nimport { BUILD, NAMESPACE } from '@stencil/core/internal/app-data';\nimport { consoleDevInfo, doc, promiseResolve, H } from '@stencil/core';\nconst patchBrowser = () => {\n // NOTE!! This fn cannot use async/await!\n if (BUILD.isDev && !BUILD.isTesting) {\n consoleDevInfo('Running in development mode.');\n }\n if (BUILD.cloneNodeFix) {\n // opted-in to polyfill cloneNode() for slot polyfilled components\n patchCloneNodeFix(H.prototype);\n }\n const scriptElm = BUILD.scriptDataOpts\n ? Array.from(doc.querySelectorAll('script')).find((s) => new RegExp(`\\/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) ||\n s.getAttribute('data-stencil-namespace') === NAMESPACE)\n : null;\n const importMeta = import.meta.url;\n const opts = BUILD.scriptDataOpts ? (scriptElm || {})['data-opts'] || {} : {};\n if (importMeta !== '') {\n opts.resourcesUrl = new URL('.', importMeta).href;\n }\n return promiseResolve(opts);\n};\nconst patchCloneNodeFix = (HTMLElementPrototype) => {\n const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n HTMLElementPrototype.cloneNode = function (deep) {\n if (this.nodeName === 'TEMPLATE') {\n return nativeCloneNodeFn.call(this, deep);\n }\n const clonedNode = nativeCloneNodeFn.call(this, false);\n const srcChildNodes = this.childNodes;\n if (deep) {\n for (let i = 0; i < srcChildNodes.length; i++) {\n // Node.ATTRIBUTE_NODE === 2, and checking because IE11\n if (srcChildNodes[i].nodeType !== 2) {\n clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n }\n }\n }\n return clonedNode;\n };\n};\nexport { patchBrowser };\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(options => {\n globalScripts();\n return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"version":3}
|
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
import { g as getAssetPath } from './index-d1a605fc.js';
|
|
2
|
+
|
|
3
|
+
let CACHED_MAP;
|
|
4
|
+
const addIcons = (icons) => {
|
|
5
|
+
const map = getIconMap();
|
|
6
|
+
Object.keys(icons).forEach(name => map.set(name, icons[name]));
|
|
7
|
+
};
|
|
8
|
+
const getIconMap = () => {
|
|
9
|
+
if (typeof window === 'undefined') {
|
|
10
|
+
return new Map();
|
|
11
|
+
}
|
|
12
|
+
else {
|
|
13
|
+
if (!CACHED_MAP) {
|
|
14
|
+
const win = window; // eslint-disable-line @typescript-eslint/no-explicit-any
|
|
15
|
+
win.PdsIcons = win.PdsIcons || {};
|
|
16
|
+
CACHED_MAP = win.PdsIcons.map = win.PdsIcons.map || new Map();
|
|
17
|
+
}
|
|
18
|
+
return CACHED_MAP;
|
|
19
|
+
}
|
|
20
|
+
};
|
|
21
|
+
const getName = (iconName, icon) => {
|
|
22
|
+
if (!iconName && icon && !isSrc(icon)) {
|
|
23
|
+
iconName = icon;
|
|
24
|
+
}
|
|
25
|
+
if (isStr(iconName)) {
|
|
26
|
+
iconName = toLower(iconName);
|
|
27
|
+
}
|
|
28
|
+
if (!isStr(iconName) || iconName.trim() === '') {
|
|
29
|
+
return null;
|
|
30
|
+
}
|
|
31
|
+
const invalidChars = iconName.replace(/[a-z]|-|\d/gi, '');
|
|
32
|
+
if (invalidChars != '') {
|
|
33
|
+
return null;
|
|
34
|
+
}
|
|
35
|
+
return iconName;
|
|
36
|
+
};
|
|
37
|
+
const getNamedUrl = (iconName) => {
|
|
38
|
+
const url = getIconMap().get(iconName);
|
|
39
|
+
if (url) {
|
|
40
|
+
return url;
|
|
41
|
+
}
|
|
42
|
+
return getAssetPath(`svg/${iconName}.svg`);
|
|
43
|
+
};
|
|
44
|
+
const getSrc = (src) => {
|
|
45
|
+
if (isStr(src)) {
|
|
46
|
+
src = src.trim();
|
|
47
|
+
if (isSrc(src)) {
|
|
48
|
+
return src;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
return null;
|
|
52
|
+
};
|
|
53
|
+
const getUrl = (pdsIcon) => {
|
|
54
|
+
let url = getName(pdsIcon.name, pdsIcon.icon);
|
|
55
|
+
if (url) {
|
|
56
|
+
return getNamedUrl(url);
|
|
57
|
+
}
|
|
58
|
+
if (pdsIcon.icon) {
|
|
59
|
+
url = getSrc(pdsIcon.icon);
|
|
60
|
+
if (url) {
|
|
61
|
+
return url;
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
return null;
|
|
65
|
+
};
|
|
66
|
+
const isSrc = (str) => str.length > 0 && /(\/|\.)/.test(str);
|
|
67
|
+
const isStr = (val) => typeof val === 'string'; // eslint-disable-line @typescript-eslint/no-explicit-any
|
|
68
|
+
const toLower = (val) => val.toLowerCase();
|
|
69
|
+
/**
|
|
70
|
+
* Elements inside of web components sometimes need to inherit global attributes
|
|
71
|
+
* set on the host. For example, the inner input in `ion-input` should inherit
|
|
72
|
+
* the `title` attribute that developers set directly on `ion-input`. This
|
|
73
|
+
* helper function should be called in componentWillLoad and assigned to a variable
|
|
74
|
+
* that is later used in the render function.
|
|
75
|
+
*
|
|
76
|
+
* This does not need to be reactive as changing attributes on the host element
|
|
77
|
+
* does not trigger a re-render.
|
|
78
|
+
*/
|
|
79
|
+
const inheritAttributes = (el, attributes = []) => {
|
|
80
|
+
const attributeObject = {}; // eslint-disable-line @typescript-eslint/no-explicit-any
|
|
81
|
+
attributes.forEach(attr => {
|
|
82
|
+
if (el.hasAttribute(attr)) {
|
|
83
|
+
const value = el.getAttribute(attr);
|
|
84
|
+
if (value !== null) {
|
|
85
|
+
attributeObject[attr] = el.getAttribute(attr);
|
|
86
|
+
}
|
|
87
|
+
el.removeAttribute(attr);
|
|
88
|
+
}
|
|
89
|
+
});
|
|
90
|
+
return attributeObject;
|
|
91
|
+
};
|
|
92
|
+
|
|
93
|
+
export { addIcons as a, inheritAttributes as b, getName as c, getUrl as g, isStr as i };
|
|
94
|
+
|
|
95
|
+
//# sourceMappingURL=utils-15462a67.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"utils-15462a67.js","mappings":"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","names":[],"sources":["src/components/pds-icon/utils.ts"],"sourcesContent":["import { getAssetPath } from '@stencil/core';\nimport { PdsIcon } from './pds-icon';\n\nlet CACHED_MAP: Map<string, string>;\n\nexport const addIcons = (icons: { [name: string]: string; }) => {\n const map = getIconMap();\n Object.keys(icons).forEach(name => map.set(name, icons[name]));\n}\n\nexport const getIconMap = (): Map<string, string> => {\n if (typeof window === 'undefined') {\n return new Map();\n } else {\n if (!CACHED_MAP) {\n const win = window as any; // eslint-disable-line @typescript-eslint/no-explicit-any\n win.PdsIcons = win.PdsIcons || {};\n CACHED_MAP = win.PdsIcons.map = win.PdsIcons.map || new Map();\n }\n\n return CACHED_MAP;\n }\n}\n\nexport const getName = (\n iconName: string | undefined,\n icon: string | undefined\n ) => {\n\n if(!iconName && icon && !isSrc(icon)) {\n iconName = icon;\n }\n\n if (isStr(iconName)) {\n iconName = toLower(iconName);\n }\n\n if (!isStr(iconName) || iconName.trim() === '') {\n return null;\n }\n\n const invalidChars = iconName.replace(/[a-z]|-|\\d/gi,'');\n if (invalidChars != '') { return null; }\n\n return iconName;\n}\n\nconst getNamedUrl = (iconName: string) => {\n const url = getIconMap().get(iconName);\n if (url) {\n return url;\n }\n\n return getAssetPath(`svg/${iconName}.svg`);\n};\n\nexport const getSrc = (src: string | undefined) => {\n if (isStr(src)) {\n src = src.trim();\n\n if (isSrc(src)) {\n return src;\n }\n }\n\n return null;\n}\n\nexport const getUrl = (pdsIcon: PdsIcon) => {\n let url = getName(pdsIcon.name, pdsIcon.icon);\n if (url) {\n return getNamedUrl(url);\n }\n\n if (pdsIcon.icon) {\n url = getSrc(pdsIcon.icon);\n\n if(url) {\n return url;\n }\n }\n\n return null;\n};\n\n\nexport const isSrc = (str: string) => str.length > 0 && /(\\/|\\.)/.test(str);\nexport const isStr = (val: any): val is string => typeof val === 'string'; // eslint-disable-line @typescript-eslint/no-explicit-any\nexport const toLower = (val: string) => val.toLowerCase();\n\n/**\n * Elements inside of web components sometimes need to inherit global attributes\n * set on the host. For example, the inner input in `ion-input` should inherit\n * the `title` attribute that developers set directly on `ion-input`. This\n * helper function should be called in componentWillLoad and assigned to a variable\n * that is later used in the render function.\n *\n * This does not need to be reactive as changing attributes on the host element\n * does not trigger a re-render.\n */\n export const inheritAttributes = (el: HTMLElement, attributes: string[] = []) => {\n const attributeObject: { [k: string]: any } = {}; // eslint-disable-line @typescript-eslint/no-explicit-any\n\n attributes.forEach(attr => {\n if (el.hasAttribute(attr)) {\n const value = el.getAttribute(attr);\n if (value !== null) {\n attributeObject[attr] = el.getAttribute(attr);\n }\n el.removeAttribute(attr);\n }\n });\n\n return attributeObject;\n}\n"],"version":3}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export{a as addIcons}from"./p-
|
|
1
|
+
export{a as addIcons}from"./p-f0b1dbd6.js";import"./p-19d7058a.js";
|
|
2
2
|
//# sourceMappingURL=index.esm.js.map
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
const t="pds-icons";let n;let e;let s=false;let l=false;const o=t=>{const n=new URL(t,bt.t);return n.origin!==$t.location.origin?n.href:n.pathname};const c=(t,n="")=>{{return()=>{}}};const i=(t,n)=>{{return()=>{}}};const f="{visibility:hidden}.hydrated{visibility:inherit}";const r="slot-fb{display:contents}slot-fb[hidden]{display:none}";const u="http://www.w3.org/1999/xlink";const a={};const d=t=>t!=null;const y=t=>{t=typeof t;return t==="object"||t==="function"};function p(t){var n,e,s;return(s=(e=(n=t.head)===null||n===void 0?void 0:n.querySelector('meta[name="csp-nonce"]'))===null||e===void 0?void 0:e.getAttribute("content"))!==null&&s!==void 0?s:undefined}const h=(t,n,...e)=>{let s=null;let l=null;let o=false;let c=false;const i=[];const f=n=>{for(let e=0;e<n.length;e++){s=n[e];if(Array.isArray(s)){f(s)}else if(s!=null&&typeof s!=="boolean"){if(o=typeof t!=="function"&&!y(s)){s=String(s)}if(o&&c){i[i.length-1].l+=s}else{i.push(o?v(null,s):s)}c=o}}};f(e);if(n){if(n.key){l=n.key}{const t=n.className||n.class;if(t){n.class=typeof t!=="object"?t:Object.keys(t).filter((n=>t[n])).join(" ")}}}const r=v(t,null);r.o=n;if(i.length>0){r.i=i}{r.u=l}return r};const v=(t,n)=>{const e={p:0,h:t,l:n,v:null,i:null};{e.o=null}{e.u=null}return e};const $={};const m=t=>t&&t.h===$;const b=(t,n)=>{if(t!=null&&!y(t)){if(n&1){return String(t)}return t}return t};const w=t=>rt(t).$hostElement$;const S=(t,n,e)=>{const s=bt.ce(n,e);t.dispatchEvent(s);return s};const g=new WeakMap;const k=(t,n,e)=>{let s=vt.get(t);if(St&&e){s=s||new CSSStyleSheet;if(typeof s==="string"){s=n}else{s.replaceSync(n)}}else{s=n}vt.set(t,s)};const j=(t,n,e)=>{var s;const l=M(n);const o=vt.get(l);t=t.nodeType===11?t:mt;if(o){if(typeof o==="string"){t=t.head||t;let e=g.get(t);let c;if(!e){g.set(t,e=new Set)}if(!e.has(l)){{c=mt.createElement("style");c.innerHTML=o;const n=(s=bt.$)!==null&&s!==void 0?s:p(mt);if(n!=null){c.setAttribute("nonce",n)}t.insertBefore(c,t.querySelector("link"))}if(n.p&4){c.innerHTML+=r}if(e){e.add(l)}}}else if(!t.adoptedStyleSheets.includes(o)){t.adoptedStyleSheets=[...t.adoptedStyleSheets,o]}}return l};const C=t=>{const n=t.m;const e=t.$hostElement$;const s=n.p;const l=c("attachStyles",n.S);const o=j(e.shadowRoot?e.shadowRoot:e.getRootNode(),n);if(s&10){e["s-sc"]=o;e.classList.add(o+"-h")}l()};const M=(t,n)=>"sc-"+t.S;const O=(t,n,e,s,l,o)=>{if(e!==s){let c=dt(t,n);let i=n.toLowerCase();if(n==="class"){const n=t.classList;const l=P(e);const o=P(s);n.remove(...l.filter((t=>t&&!o.includes(t))));n.add(...o.filter((t=>t&&!l.includes(t))))}else if(n==="style"){{for(const n in e){if(!s||s[n]==null){if(n.includes("-")){t.style.removeProperty(n)}else{t.style[n]=""}}}}for(const n in s){if(!e||s[n]!==e[n]){if(n.includes("-")){t.style.setProperty(n,s[n])}else{t.style[n]=s[n]}}}}else if(n==="key");else if(n==="ref"){if(s){s(t)}}else if(!c&&n[0]==="o"&&n[1]==="n"){if(n[2]==="-"){n=n.slice(3)}else if(dt($t,i)){n=i.slice(2)}else{n=i[2]+n.slice(3)}if(e||s){const l=n.endsWith(U);n=n.replace(E,"");if(e){bt.rel(t,n,e,l)}if(s){bt.ael(t,n,s,l)}}}else{const f=y(s);if((c||f&&s!==null)&&!l){try{if(!t.tagName.includes("-")){const l=s==null?"":s;if(n==="list"){c=false}else if(e==null||t[n]!=l){t[n]=l}}else{t[n]=s}}catch(t){}}let r=false;{if(i!==(i=i.replace(/^xlink\:?/,""))){n=i;r=true}}if(s==null||s===false){if(s!==false||t.getAttribute(n)===""){if(r){t.removeAttributeNS(u,n)}else{t.removeAttribute(n)}}}else if((!c||o&4||l)&&!f){s=s===true?"":s;if(r){t.setAttributeNS(u,n,s)}else{t.setAttribute(n,s)}}}}};const x=/\s/;const P=t=>!t?[]:t.split(x);const U="Capture";const E=new RegExp(U+"$");const L=(t,n,e,s)=>{const l=n.v.nodeType===11&&n.v.host?n.v.host:n.v;const o=t&&t.o||a;const c=n.o||a;{for(s in o){if(!(s in c)){O(l,s,o[s],undefined,e,n.p)}}}for(s in c){O(l,s,o[s],c[s],e,n.p)}};const R=(t,e,l,o)=>{const c=e.i[l];let i=0;let f;let r;if(c.l!==null){f=c.v=mt.createTextNode(c.l)}else{f=c.v=mt.createElement(c.h);{L(null,c,s)}if(d(n)&&f["s-si"]!==n){f.classList.add(f["s-si"]=n)}if(c.i){for(i=0;i<c.i.length;++i){r=R(t,c,i);if(r){f.appendChild(r)}}}}return f};const A=(t,n,s,l,o,c)=>{let i=t;let f;if(i.shadowRoot&&i.tagName===e){i=i.shadowRoot}for(;o<=c;++o){if(l[o]){f=R(null,s,o);if(f){l[o].v=f;i.insertBefore(f,n)}}}};const N=(t,n,e)=>{for(let s=n;s<=e;++s){const n=t[s];if(n){const t=n.v;q(n);if(t){t.remove()}}}};const T=(t,n,e,s)=>{let l=0;let o=0;let c=0;let i=0;let f=n.length-1;let r=n[0];let u=n[f];let a=s.length-1;let d=s[0];let y=s[a];let p;let h;while(l<=f&&o<=a){if(r==null){r=n[++l]}else if(u==null){u=n[--f]}else if(d==null){d=s[++o]}else if(y==null){y=s[--a]}else if(W(r,d)){H(r,d);r=n[++l];d=s[++o]}else if(W(u,y)){H(u,y);u=n[--f];y=s[--a]}else if(W(r,y)){H(r,y);t.insertBefore(r.v,u.v.nextSibling);r=n[++l];y=s[--a]}else if(W(u,d)){H(u,d);t.insertBefore(u.v,r.v);u=n[--f];d=s[++o]}else{c=-1;{for(i=l;i<=f;++i){if(n[i]&&n[i].u!==null&&n[i].u===d.u){c=i;break}}}if(c>=0){h=n[c];if(h.h!==d.h){p=R(n&&n[o],e,c)}else{H(h,d);n[c]=undefined;p=h.v}d=s[++o]}else{p=R(n&&n[o],e,o);d=s[++o]}if(p){{r.v.parentNode.insertBefore(p,r.v)}}}}if(l>f){A(t,s[a+1]==null?null:s[a+1].v,e,s,o,a)}else if(o>a){N(n,l,f)}};const W=(t,n)=>{if(t.h===n.h){{return t.u===n.u}}return false};const H=(t,n)=>{const e=n.v=t.v;const l=t.i;const o=n.i;const c=n.l;if(c===null){{{L(t,n,s)}}if(l!==null&&o!==null){T(e,l,n,o)}else if(o!==null){if(t.l!==null){e.textContent=""}A(e,null,n,o,0,o.length-1)}else if(l!==null){N(l,0,l.length-1)}}else if(t.l!==c){e.data=c}};const q=t=>{{t.o&&t.o.ref&&t.o.ref(null);t.i&&t.i.map(q)}};const F=(t,s,l=false)=>{const o=t.$hostElement$;const c=t.m;const i=t.k||v(null,null);const f=m(s)?s:h(null,null,s);e=o.tagName;if(c.j){f.o=f.o||{};c.j.map((([t,n])=>f.o[n]=o[t]))}if(l&&f.o){for(const t of Object.keys(f.o)){if(o.hasAttribute(t)&&!["key","ref","style","class"].includes(t)){f.o[t]=o[t]}}}f.h=null;f.p|=4;t.k=f;f.v=i.v=o.shadowRoot||o;{n=o["s-sc"]}H(i,f)};const I=(t,n)=>{if(n&&!t.C&&n["s-p"]){n["s-p"].push(new Promise((n=>t.C=n)))}};const V=(t,n)=>{{t.p|=16}if(t.p&4){t.p|=512;return}I(t,t.M);const e=()=>_(t,n);return xt(e)};const _=(t,n)=>{const e=c("scheduleUpdate",t.m.S);const s=t.O;let l;if(n){{l=Q(s,"componentWillLoad")}}e();return z(l,(()=>D(t,s,n)))};const z=(t,n)=>B(t)?t.then(n):n();const B=t=>t instanceof Promise||t&&t.then&&typeof t.then==="function";const D=async(t,n,e)=>{var s;const l=t.$hostElement$;const o=c("update",t.m.S);const i=l["s-rc"];if(e){C(t)}const f=c("render",t.m.S);{G(t,n,l,e)}if(i){i.map((t=>t()));l["s-rc"]=undefined}f();o();{const n=(s=l["s-p"])!==null&&s!==void 0?s:[];const e=()=>J(t);if(n.length===0){e()}else{Promise.all(n).then(e);t.p|=4;n.length=0}}};const G=(t,n,e,s)=>{try{n=n.render();{t.p&=~16}{t.p|=2}{{{F(t,n,s)}}}}catch(n){yt(n,t.$hostElement$)}return null};const J=t=>{const n=t.m.S;const e=t.$hostElement$;const s=c("postUpdate",n);const l=t.M;if(!(t.p&64)){t.p|=64;{X(e)}s();{t.P(e);if(!l){K()}}}else{s()}{if(t.C){t.C();t.C=undefined}if(t.p&512){Ot((()=>V(t,false)))}t.p&=~(4|512)}};const K=n=>{{X(mt.documentElement)}Ot((()=>S($t,"appload",{detail:{namespace:t}})))};const Q=(t,n,e)=>{if(t&&t[n]){try{return t[n](e)}catch(t){yt(t)}}return undefined};const X=t=>t.classList.add("hydrated");const Y=(t,n)=>rt(t).U.get(n);const Z=(t,n,e,s)=>{const l=rt(t);const o=l.$hostElement$;const c=l.U.get(n);const i=l.p;const f=l.O;e=b(e,s.L[n][0]);const r=Number.isNaN(c)&&Number.isNaN(e);const u=e!==c&&!r;if((!(i&8)||c===undefined)&&u){l.U.set(n,e);if(f){if(s.R&&i&128){const t=s.R[n];if(t){t.map((t=>{try{f[t](e,c,n)}catch(t){yt(t,o)}}))}}if((i&(2|16))===2){V(l,false)}}}};const tt=(t,n,e)=>{var s;const l=t.prototype;if(n.L){if(t.watchers){n.R=t.watchers}const o=Object.entries(n.L);o.map((([t,[s]])=>{if(s&31||e&2&&s&32){Object.defineProperty(l,t,{get(){return Y(this,t)},set(e){Z(this,t,e,n)},configurable:true,enumerable:true})}}));if(e&1){const e=new Map;l.attributeChangedCallback=function(t,s,o){bt.jmp((()=>{var c;const i=e.get(t);if(this.hasOwnProperty(i)){o=this[i];delete this[i]}else if(l.hasOwnProperty(i)&&typeof this[i]==="number"&&this[i]==o){return}else if(i==null){const e=rt(this);const l=e===null||e===void 0?void 0:e.p;if(l&&!(l&8)&&l&128&&o!==s){const l=e.O;const i=(c=n.R)===null||c===void 0?void 0:c[t];i===null||i===void 0?void 0:i.forEach((n=>{if(l[n]!=null){l[n].call(l,o,s,t)}}))}return}this[i]=o===null&&typeof this[i]==="boolean"?false:o}))};t.observedAttributes=Array.from(new Set([...Object.keys((s=n.R)!==null&&s!==void 0?s:{}),...o.filter((([t,n])=>n[0]&15)).map((([t,s])=>{var l;const o=s[1]||t;e.set(o,t);if(s[0]&512){(l=n.j)===null||l===void 0?void 0:l.push([t,o])}return o}))]))}}return t};const nt=async(t,n,e,s)=>{let l;if((n.p&32)===0){n.p|=32;{l=ht(e);if(l.then){const t=i();l=await l;t()}if(!l.isProxied){{e.R=l.watchers}tt(l,e,2);l.isProxied=true}const t=c("createInstance",e.S);{n.p|=8}try{new l(n)}catch(t){yt(t)}{n.p&=~8}{n.p|=128}t();et(n.O)}if(l.style){let t=l.style;const n=M(e);if(!vt.has(n)){const s=c("registerStyles",e.S);k(n,t,!!(e.p&1));s()}}}const o=n.M;const f=()=>V(n,true);if(o&&o["s-rc"]){o["s-rc"].push(f)}else{f()}};const et=t=>{{Q(t,"connectedCallback")}};const st=t=>{if((bt.p&1)===0){const n=rt(t);const e=n.m;const s=c("connectedCallback",e.S);if(!(n.p&1)){n.p|=1;{let e=t;while(e=e.parentNode||e.host){if(e["s-p"]){I(n,n.M=e);break}}}if(e.L){Object.entries(e.L).map((([n,[e]])=>{if(e&31&&t.hasOwnProperty(n)){const e=t[n];delete t[n];t[n]=e}}))}{nt(t,n,e)}}else{if(n===null||n===void 0?void 0:n.O){et(n.O)}else if(n===null||n===void 0?void 0:n.A){n.A.then((()=>et(n.O)))}}s()}};const lt=t=>{{Q(t,"disconnectedCallback")}};const ot=async t=>{if((bt.p&1)===0){const n=rt(t);if(n===null||n===void 0?void 0:n.O){lt(n.O)}else if(n===null||n===void 0?void 0:n.A){n.A.then((()=>lt(n.O)))}}};const ct=(t,n={})=>{var e;const s=c();const l=[];const o=n.exclude||[];const i=$t.customElements;const u=mt.head;const a=u.querySelector("meta[charset]");const d=mt.createElement("style");const y=[];let h;let v=true;Object.assign(bt,n);bt.t=new URL(n.resourcesUrl||"./",mt.baseURI).href;let $=false;t.map((t=>{t[1].map((n=>{var e;const s={p:n[0],S:n[1],L:n[2],N:n[3]};if(s.p&4){$=true}{s.L=n[2]}{s.j=[]}{s.R=(e=n[4])!==null&&e!==void 0?e:{}}const c=s.S;const f=class extends HTMLElement{constructor(t){super(t);t=this;at(t,s);if(s.p&1){{{t.attachShadow({mode:"open"})}}}}connectedCallback(){if(h){clearTimeout(h);h=null}if(v){y.push(this)}else{bt.jmp((()=>st(this)))}}disconnectedCallback(){bt.jmp((()=>ot(this)))}componentOnReady(){return rt(this).A}};s.T=t[0];if(!o.includes(c)&&!i.get(c)){l.push(c);i.define(c,tt(f,s,1))}}))}));if($){d.innerHTML+=r}{d.innerHTML+=l+f}if(d.innerHTML.length){d.setAttribute("data-styles","");const t=(e=bt.$)!==null&&e!==void 0?e:p(mt);if(t!=null){d.setAttribute("nonce",t)}u.insertBefore(d,a?a.nextSibling:u.firstChild)}v=false;if(y.length){y.map((t=>t.connectedCallback()))}else{{bt.jmp((()=>h=setTimeout(K,30)))}}s()};const it=t=>bt.$=t;const ft=new WeakMap;const rt=t=>ft.get(t);const ut=(t,n)=>ft.set(n.O=t,n);const at=(t,n)=>{const e={p:0,$hostElement$:t,m:n,U:new Map};{e.A=new Promise((t=>e.P=t));t["s-p"]=[];t["s-rc"]=[]}return ft.set(t,e)};const dt=(t,n)=>n in t;const yt=(t,n)=>(0,console.error)(t,n);const pt=new Map;const ht=(t,n,e)=>{const s=t.S.replace(/-/g,"_");const l=t.T;const o=pt.get(l);if(o){return o[s]}
|
|
2
|
+
/*!__STENCIL_STATIC_IMPORT_SWITCH__*/return import(`./${l}.entry.js${""}`).then((t=>{{pt.set(l,t)}return t[s]}),yt)};const vt=new Map;const $t=typeof window!=="undefined"?window:{};const mt=$t.document||{head:{}};const bt={p:0,t:"",jmp:t=>t(),raf:t=>requestAnimationFrame(t),ael:(t,n,e,s)=>t.addEventListener(n,e,s),rel:(t,n,e,s)=>t.removeEventListener(n,e,s),ce:(t,n)=>new CustomEvent(t,n)};const wt=t=>Promise.resolve(t);const St=(()=>{try{new CSSStyleSheet;return typeof(new CSSStyleSheet).replaceSync==="function"}catch(t){}return false})();const gt=[];const kt=[];const jt=(t,n)=>e=>{t.push(e);if(!l){l=true;if(n&&bt.p&4){Ot(Mt)}else{bt.raf(Mt)}}};const Ct=t=>{for(let n=0;n<t.length;n++){try{t[n](performance.now())}catch(t){yt(t)}}t.length=0};const Mt=()=>{Ct(gt);{Ct(kt);if(l=gt.length>0){bt.raf(Mt)}}};const Ot=t=>wt().then(t);const xt=jt(kt,true);export{$ as H,w as a,ct as b,o as g,h,wt as p,ut as r,it as s};
|
|
3
|
+
//# sourceMappingURL=p-19d7058a.js.map
|