@xplortech/apollo-core 1.0.0-beta.5 → 1.0.0-beta.7

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 (155) hide show
  1. package/LICENSE +21 -0
  2. package/build/style.css +1 -1
  3. package/dist/apollo-core/apollo-core.css +9 -5841
  4. package/dist/apollo-core/apollo-core.esm.js +1 -125
  5. package/dist/apollo-core/index.esm.js +0 -1
  6. package/dist/apollo-core/p-ee16942f.entry.js +1 -0
  7. package/dist/cjs/apollo-core.cjs.js +4 -112
  8. package/dist/cjs/index.cjs.js +0 -1
  9. package/dist/cjs/loader.cjs.js +2 -18
  10. package/dist/cjs/xpl-application-shell.cjs.entry.js +1 -1
  11. package/dist/cjs/xpl-avatar_12.cjs.entry.js +17 -17
  12. package/dist/cjs/xpl-backdrop.cjs.entry.js +1 -1
  13. package/dist/cjs/xpl-button-row.cjs.entry.js +1 -1
  14. package/dist/cjs/xpl-choicelist.cjs.entry.js +1 -1
  15. package/dist/cjs/xpl-divider.cjs.entry.js +1 -1
  16. package/dist/cjs/xpl-dropdown-group_3.cjs.entry.js +4 -1
  17. package/dist/cjs/xpl-dropdown_2.cjs.entry.js +1 -2
  18. package/dist/cjs/xpl-grid-item.cjs.entry.js +1 -1
  19. package/dist/cjs/xpl-grid.cjs.entry.js +1 -1
  20. package/dist/cjs/xpl-input.cjs.entry.js +4 -21
  21. package/dist/cjs/xpl-list.cjs.entry.js +2 -2
  22. package/dist/cjs/xpl-main-nav.cjs.entry.js +1 -1
  23. package/dist/cjs/xpl-pagination.cjs.entry.js +1 -1
  24. package/dist/cjs/xpl-select.cjs.entry.js +3 -44
  25. package/dist/cjs/xpl-toggle.cjs.entry.js +3 -3
  26. package/dist/collection/collection-manifest.json +1 -1
  27. package/dist/collection/components/xpl-choicelist/choice.js +1 -0
  28. package/dist/collection/components/xpl-choicelist/xpl-choicelist.js +3 -3
  29. package/dist/collection/components/xpl-dropdown/dropdownoption.js +1 -0
  30. package/dist/collection/components/xpl-dropdown/xpl-dropdown-group/xpl-dropdown-group.js +2 -1
  31. package/dist/collection/components/xpl-dropdown/xpl-dropdown-option/xpl-dropdown-option.js +4 -1
  32. package/dist/collection/components/xpl-dropdown/xpl-dropdown.js +16 -8
  33. package/dist/collection/components/xpl-list/listitem.js +1 -0
  34. package/dist/collection/components/xpl-list/xpl-list.js +2 -2
  35. package/dist/collection/components/xpl-select/selectchoice.js +1 -0
  36. package/dist/collection/components/xpl-select/xpl-select.js +2 -1
  37. package/dist/collection/components/xpl-table/xpl-table.js +17 -17
  38. package/dist/custom-elements/index.js +23 -604
  39. package/dist/esm/apollo-core.js +4 -112
  40. package/dist/esm/index.js +1 -1
  41. package/dist/esm/loader.js +2 -18
  42. package/dist/esm/xpl-application-shell.entry.js +1 -1
  43. package/dist/esm/xpl-avatar_12.entry.js +17 -17
  44. package/dist/esm/xpl-backdrop.entry.js +1 -1
  45. package/dist/esm/xpl-button-row.entry.js +1 -1
  46. package/dist/esm/xpl-choicelist.entry.js +1 -1
  47. package/dist/esm/xpl-divider.entry.js +1 -1
  48. package/dist/esm/xpl-dropdown-group_3.entry.js +4 -1
  49. package/dist/esm/xpl-dropdown_2.entry.js +1 -2
  50. package/dist/esm/xpl-grid-item.entry.js +1 -1
  51. package/dist/esm/xpl-grid.entry.js +1 -1
  52. package/dist/esm/xpl-input.entry.js +3 -20
  53. package/dist/esm/xpl-list.entry.js +2 -2
  54. package/dist/esm/xpl-main-nav.entry.js +1 -1
  55. package/dist/esm/xpl-pagination.entry.js +1 -1
  56. package/dist/esm/xpl-select.entry.js +2 -43
  57. package/dist/esm/xpl-toggle.entry.js +2 -2
  58. package/dist/types/components/xpl-choicelist/choice.d.ts +5 -5
  59. package/dist/types/components/xpl-choicelist/xpl-choicelist.d.ts +2 -1
  60. package/dist/types/components/xpl-dropdown/dropdownoption.d.ts +8 -10
  61. package/dist/types/components/xpl-dropdown/xpl-dropdown-group/xpl-dropdown-group.d.ts +1 -0
  62. package/dist/types/components/xpl-dropdown/xpl-dropdown.d.ts +6 -4
  63. package/dist/types/components/xpl-list/listitem.d.ts +15 -19
  64. package/dist/types/components/xpl-list/xpl-list.d.ts +1 -0
  65. package/dist/types/components/xpl-select/selectchoice.d.ts +3 -2
  66. package/dist/types/components/xpl-select/xpl-select.d.ts +1 -0
  67. package/dist/types/components/xpl-table/xpl-table.d.ts +5 -6
  68. package/dist/types/components.d.ts +17 -6
  69. package/package.json +2 -2
  70. package/dist/apollo-core/app-globals-0f993ce5.js +0 -3
  71. package/dist/apollo-core/css-shim-bbdf0cc6.js +0 -4
  72. package/dist/apollo-core/dom-1f98a75f.js +0 -73
  73. package/dist/apollo-core/index-5b4a209e.js +0 -2938
  74. package/dist/apollo-core/index-912d1a21.js +0 -584
  75. package/dist/apollo-core/p-50eb8239.entry.js +0 -1
  76. package/dist/apollo-core/regular-133c23b5.js +0 -16052
  77. package/dist/apollo-core/shadow-css-67b66845.js +0 -389
  78. package/dist/apollo-core/xpl-application-shell.entry.js +0 -60
  79. package/dist/apollo-core/xpl-avatar.entry.js +0 -19
  80. package/dist/apollo-core/xpl-backdrop.entry.js +0 -21
  81. package/dist/apollo-core/xpl-badge.entry.js +0 -17
  82. package/dist/apollo-core/xpl-breadcrumb-item.entry.js +0 -17
  83. package/dist/apollo-core/xpl-breadcrumbs.entry.js +0 -12
  84. package/dist/apollo-core/xpl-button-row.entry.js +0 -18
  85. package/dist/apollo-core/xpl-button.entry.js +0 -60
  86. package/dist/apollo-core/xpl-checkbox.entry.js +0 -25
  87. package/dist/apollo-core/xpl-choicelist.entry.js +0 -39
  88. package/dist/apollo-core/xpl-content-area.entry.js +0 -16
  89. package/dist/apollo-core/xpl-divider.entry.js +0 -14
  90. package/dist/apollo-core/xpl-dropdown-group.entry.js +0 -31
  91. package/dist/apollo-core/xpl-dropdown-heading.entry.js +0 -12
  92. package/dist/apollo-core/xpl-dropdown-option.entry.js +0 -61
  93. package/dist/apollo-core/xpl-dropdown.entry.js +0 -104
  94. package/dist/apollo-core/xpl-grid-item.entry.js +0 -21
  95. package/dist/apollo-core/xpl-grid.entry.js +0 -31
  96. package/dist/apollo-core/xpl-input.entry.js +0 -2547
  97. package/dist/apollo-core/xpl-list.entry.js +0 -57
  98. package/dist/apollo-core/xpl-main-nav.entry.js +0 -26
  99. package/dist/apollo-core/xpl-nav-item.entry.js +0 -26
  100. package/dist/apollo-core/xpl-pagination.entry.js +0 -72
  101. package/dist/apollo-core/xpl-radio.entry.js +0 -25
  102. package/dist/apollo-core/xpl-secondary-nav.entry.js +0 -12
  103. package/dist/apollo-core/xpl-select.entry.js +0 -662
  104. package/dist/apollo-core/xpl-table.entry.js +0 -91
  105. package/dist/apollo-core/xpl-tag.entry.js +0 -17
  106. package/dist/apollo-core/xpl-toggle.entry.js +0 -30
  107. package/dist/apollo-core/xpl-utility-bar.entry.js +0 -27
  108. package/dist/cjs/app-globals-3a1e7e63.js +0 -5
  109. package/dist/cjs/css-shim-a7379e2b.js +0 -6
  110. package/dist/cjs/dom-3e7d9c3b.js +0 -75
  111. package/dist/cjs/index-318d5fc7.js +0 -586
  112. package/dist/cjs/index-88e58962.js +0 -2975
  113. package/dist/cjs/regular-503465f4.js +0 -16054
  114. package/dist/cjs/shadow-css-09555044.js +0 -391
  115. package/dist/cjs/xpl-avatar.cjs.entry.js +0 -23
  116. package/dist/cjs/xpl-badge.cjs.entry.js +0 -21
  117. package/dist/cjs/xpl-breadcrumb-item.cjs.entry.js +0 -21
  118. package/dist/cjs/xpl-breadcrumbs.cjs.entry.js +0 -16
  119. package/dist/cjs/xpl-button.cjs.entry.js +0 -64
  120. package/dist/cjs/xpl-checkbox.cjs.entry.js +0 -29
  121. package/dist/cjs/xpl-content-area.cjs.entry.js +0 -20
  122. package/dist/cjs/xpl-dropdown-group.cjs.entry.js +0 -35
  123. package/dist/cjs/xpl-dropdown-heading.cjs.entry.js +0 -16
  124. package/dist/cjs/xpl-dropdown-option.cjs.entry.js +0 -65
  125. package/dist/cjs/xpl-dropdown.cjs.entry.js +0 -108
  126. package/dist/cjs/xpl-nav-item.cjs.entry.js +0 -30
  127. package/dist/cjs/xpl-radio.cjs.entry.js +0 -29
  128. package/dist/cjs/xpl-secondary-nav.cjs.entry.js +0 -16
  129. package/dist/cjs/xpl-table.cjs.entry.js +0 -95
  130. package/dist/cjs/xpl-tag.cjs.entry.js +0 -21
  131. package/dist/cjs/xpl-utility-bar.cjs.entry.js +0 -31
  132. package/dist/esm/app-globals-0f993ce5.js +0 -3
  133. package/dist/esm/css-shim-bbdf0cc6.js +0 -4
  134. package/dist/esm/dom-1f98a75f.js +0 -73
  135. package/dist/esm/index-5b4a209e.js +0 -2938
  136. package/dist/esm/index-912d1a21.js +0 -584
  137. package/dist/esm/regular-133c23b5.js +0 -16052
  138. package/dist/esm/shadow-css-67b66845.js +0 -389
  139. package/dist/esm/xpl-avatar.entry.js +0 -19
  140. package/dist/esm/xpl-badge.entry.js +0 -17
  141. package/dist/esm/xpl-breadcrumb-item.entry.js +0 -17
  142. package/dist/esm/xpl-breadcrumbs.entry.js +0 -12
  143. package/dist/esm/xpl-button.entry.js +0 -60
  144. package/dist/esm/xpl-checkbox.entry.js +0 -25
  145. package/dist/esm/xpl-content-area.entry.js +0 -16
  146. package/dist/esm/xpl-dropdown-group.entry.js +0 -31
  147. package/dist/esm/xpl-dropdown-heading.entry.js +0 -12
  148. package/dist/esm/xpl-dropdown-option.entry.js +0 -61
  149. package/dist/esm/xpl-dropdown.entry.js +0 -104
  150. package/dist/esm/xpl-nav-item.entry.js +0 -26
  151. package/dist/esm/xpl-radio.entry.js +0 -25
  152. package/dist/esm/xpl-secondary-nav.entry.js +0 -12
  153. package/dist/esm/xpl-table.entry.js +0 -91
  154. package/dist/esm/xpl-tag.entry.js +0 -17
  155. package/dist/esm/xpl-utility-bar.entry.js +0 -27
@@ -1,391 +0,0 @@
1
- 'use strict';
2
-
3
- /*
4
- Stencil Client Platform v2.8.0 | MIT Licensed | https://stenciljs.com
5
- */
6
- /**
7
- * @license
8
- * Copyright Google Inc. All Rights Reserved.
9
- *
10
- * Use of this source code is governed by an MIT-style license that can be
11
- * found in the LICENSE file at https://angular.io/license
12
- *
13
- * This file is a port of shadowCSS from webcomponents.js to TypeScript.
14
- * https://github.com/webcomponents/webcomponentsjs/blob/4efecd7e0e/src/ShadowCSS/ShadowCSS.js
15
- * https://github.com/angular/angular/blob/master/packages/compiler/src/shadow_css.ts
16
- */
17
- const safeSelector = (selector) => {
18
- const placeholders = [];
19
- let index = 0;
20
- let content;
21
- // Replaces attribute selectors with placeholders.
22
- // The WS in [attr="va lue"] would otherwise be interpreted as a selector separator.
23
- selector = selector.replace(/(\[[^\]]*\])/g, (_, keep) => {
24
- const replaceBy = `__ph-${index}__`;
25
- placeholders.push(keep);
26
- index++;
27
- return replaceBy;
28
- });
29
- // Replaces the expression in `:nth-child(2n + 1)` with a placeholder.
30
- // WS and "+" would otherwise be interpreted as selector separators.
31
- content = selector.replace(/(:nth-[-\w]+)(\([^)]+\))/g, (_, pseudo, exp) => {
32
- const replaceBy = `__ph-${index}__`;
33
- placeholders.push(exp);
34
- index++;
35
- return pseudo + replaceBy;
36
- });
37
- const ss = {
38
- content,
39
- placeholders,
40
- };
41
- return ss;
42
- };
43
- const restoreSafeSelector = (placeholders, content) => {
44
- return content.replace(/__ph-(\d+)__/g, (_, index) => placeholders[+index]);
45
- };
46
- const _polyfillHost = '-shadowcsshost';
47
- const _polyfillSlotted = '-shadowcssslotted';
48
- // note: :host-context pre-processed to -shadowcsshostcontext.
49
- const _polyfillHostContext = '-shadowcsscontext';
50
- const _parenSuffix = ')(?:\\((' + '(?:\\([^)(]*\\)|[^)(]*)+?' + ')\\))?([^,{]*)';
51
- const _cssColonHostRe = new RegExp('(' + _polyfillHost + _parenSuffix, 'gim');
52
- const _cssColonHostContextRe = new RegExp('(' + _polyfillHostContext + _parenSuffix, 'gim');
53
- const _cssColonSlottedRe = new RegExp('(' + _polyfillSlotted + _parenSuffix, 'gim');
54
- const _polyfillHostNoCombinator = _polyfillHost + '-no-combinator';
55
- const _polyfillHostNoCombinatorRe = /-shadowcsshost-no-combinator([^\s]*)/;
56
- const _shadowDOMSelectorsRe = [/::shadow/g, /::content/g];
57
- const _selectorReSuffix = '([>\\s~+[.,{:][\\s\\S]*)?$';
58
- const _polyfillHostRe = /-shadowcsshost/gim;
59
- const _colonHostRe = /:host/gim;
60
- const _colonSlottedRe = /::slotted/gim;
61
- const _colonHostContextRe = /:host-context/gim;
62
- const _commentRe = /\/\*\s*[\s\S]*?\*\//g;
63
- const stripComments = (input) => {
64
- return input.replace(_commentRe, '');
65
- };
66
- const _commentWithHashRe = /\/\*\s*#\s*source(Mapping)?URL=[\s\S]+?\*\//g;
67
- const extractCommentsWithHash = (input) => {
68
- return input.match(_commentWithHashRe) || [];
69
- };
70
- const _ruleRe = /(\s*)([^;\{\}]+?)(\s*)((?:{%BLOCK%}?\s*;?)|(?:\s*;))/g;
71
- const _curlyRe = /([{}])/g;
72
- const OPEN_CURLY = '{';
73
- const CLOSE_CURLY = '}';
74
- const BLOCK_PLACEHOLDER = '%BLOCK%';
75
- const processRules = (input, ruleCallback) => {
76
- const inputWithEscapedBlocks = escapeBlocks(input);
77
- let nextBlockIndex = 0;
78
- return inputWithEscapedBlocks.escapedString.replace(_ruleRe, (...m) => {
79
- const selector = m[2];
80
- let content = '';
81
- let suffix = m[4];
82
- let contentPrefix = '';
83
- if (suffix && suffix.startsWith('{' + BLOCK_PLACEHOLDER)) {
84
- content = inputWithEscapedBlocks.blocks[nextBlockIndex++];
85
- suffix = suffix.substring(BLOCK_PLACEHOLDER.length + 1);
86
- contentPrefix = '{';
87
- }
88
- const cssRule = {
89
- selector,
90
- content,
91
- };
92
- const rule = ruleCallback(cssRule);
93
- return `${m[1]}${rule.selector}${m[3]}${contentPrefix}${rule.content}${suffix}`;
94
- });
95
- };
96
- const escapeBlocks = (input) => {
97
- const inputParts = input.split(_curlyRe);
98
- const resultParts = [];
99
- const escapedBlocks = [];
100
- let bracketCount = 0;
101
- let currentBlockParts = [];
102
- for (let partIndex = 0; partIndex < inputParts.length; partIndex++) {
103
- const part = inputParts[partIndex];
104
- if (part === CLOSE_CURLY) {
105
- bracketCount--;
106
- }
107
- if (bracketCount > 0) {
108
- currentBlockParts.push(part);
109
- }
110
- else {
111
- if (currentBlockParts.length > 0) {
112
- escapedBlocks.push(currentBlockParts.join(''));
113
- resultParts.push(BLOCK_PLACEHOLDER);
114
- currentBlockParts = [];
115
- }
116
- resultParts.push(part);
117
- }
118
- if (part === OPEN_CURLY) {
119
- bracketCount++;
120
- }
121
- }
122
- if (currentBlockParts.length > 0) {
123
- escapedBlocks.push(currentBlockParts.join(''));
124
- resultParts.push(BLOCK_PLACEHOLDER);
125
- }
126
- const strEscapedBlocks = {
127
- escapedString: resultParts.join(''),
128
- blocks: escapedBlocks,
129
- };
130
- return strEscapedBlocks;
131
- };
132
- const insertPolyfillHostInCssText = (selector) => {
133
- selector = selector
134
- .replace(_colonHostContextRe, _polyfillHostContext)
135
- .replace(_colonHostRe, _polyfillHost)
136
- .replace(_colonSlottedRe, _polyfillSlotted);
137
- return selector;
138
- };
139
- const convertColonRule = (cssText, regExp, partReplacer) => {
140
- // m[1] = :host(-context), m[2] = contents of (), m[3] rest of rule
141
- return cssText.replace(regExp, (...m) => {
142
- if (m[2]) {
143
- const parts = m[2].split(',');
144
- const r = [];
145
- for (let i = 0; i < parts.length; i++) {
146
- const p = parts[i].trim();
147
- if (!p)
148
- break;
149
- r.push(partReplacer(_polyfillHostNoCombinator, p, m[3]));
150
- }
151
- return r.join(',');
152
- }
153
- else {
154
- return _polyfillHostNoCombinator + m[3];
155
- }
156
- });
157
- };
158
- const colonHostPartReplacer = (host, part, suffix) => {
159
- return host + part.replace(_polyfillHost, '') + suffix;
160
- };
161
- const convertColonHost = (cssText) => {
162
- return convertColonRule(cssText, _cssColonHostRe, colonHostPartReplacer);
163
- };
164
- const colonHostContextPartReplacer = (host, part, suffix) => {
165
- if (part.indexOf(_polyfillHost) > -1) {
166
- return colonHostPartReplacer(host, part, suffix);
167
- }
168
- else {
169
- return host + part + suffix + ', ' + part + ' ' + host + suffix;
170
- }
171
- };
172
- const convertColonSlotted = (cssText, slotScopeId) => {
173
- const slotClass = '.' + slotScopeId + ' > ';
174
- const selectors = [];
175
- cssText = cssText.replace(_cssColonSlottedRe, (...m) => {
176
- if (m[2]) {
177
- const compound = m[2].trim();
178
- const suffix = m[3];
179
- const slottedSelector = slotClass + compound + suffix;
180
- let prefixSelector = '';
181
- for (let i = m[4] - 1; i >= 0; i--) {
182
- const char = m[5][i];
183
- if (char === '}' || char === ',') {
184
- break;
185
- }
186
- prefixSelector = char + prefixSelector;
187
- }
188
- const orgSelector = prefixSelector + slottedSelector;
189
- const addedSelector = `${prefixSelector.trimRight()}${slottedSelector.trim()}`;
190
- if (orgSelector.trim() !== addedSelector.trim()) {
191
- const updatedSelector = `${addedSelector}, ${orgSelector}`;
192
- selectors.push({
193
- orgSelector,
194
- updatedSelector,
195
- });
196
- }
197
- return slottedSelector;
198
- }
199
- else {
200
- return _polyfillHostNoCombinator + m[3];
201
- }
202
- });
203
- return {
204
- selectors,
205
- cssText,
206
- };
207
- };
208
- const convertColonHostContext = (cssText) => {
209
- return convertColonRule(cssText, _cssColonHostContextRe, colonHostContextPartReplacer);
210
- };
211
- const convertShadowDOMSelectors = (cssText) => {
212
- return _shadowDOMSelectorsRe.reduce((result, pattern) => result.replace(pattern, ' '), cssText);
213
- };
214
- const makeScopeMatcher = (scopeSelector) => {
215
- const lre = /\[/g;
216
- const rre = /\]/g;
217
- scopeSelector = scopeSelector.replace(lre, '\\[').replace(rre, '\\]');
218
- return new RegExp('^(' + scopeSelector + ')' + _selectorReSuffix, 'm');
219
- };
220
- const selectorNeedsScoping = (selector, scopeSelector) => {
221
- const re = makeScopeMatcher(scopeSelector);
222
- return !re.test(selector);
223
- };
224
- const applySimpleSelectorScope = (selector, scopeSelector, hostSelector) => {
225
- // In Android browser, the lastIndex is not reset when the regex is used in String.replace()
226
- _polyfillHostRe.lastIndex = 0;
227
- if (_polyfillHostRe.test(selector)) {
228
- const replaceBy = `.${hostSelector}`;
229
- return selector
230
- .replace(_polyfillHostNoCombinatorRe, (_, selector) => {
231
- return selector.replace(/([^:]*)(:*)(.*)/, (_, before, colon, after) => {
232
- return before + replaceBy + colon + after;
233
- });
234
- })
235
- .replace(_polyfillHostRe, replaceBy + ' ');
236
- }
237
- return scopeSelector + ' ' + selector;
238
- };
239
- const applyStrictSelectorScope = (selector, scopeSelector, hostSelector) => {
240
- const isRe = /\[is=([^\]]*)\]/g;
241
- scopeSelector = scopeSelector.replace(isRe, (_, ...parts) => parts[0]);
242
- const className = '.' + scopeSelector;
243
- const _scopeSelectorPart = (p) => {
244
- let scopedP = p.trim();
245
- if (!scopedP) {
246
- return '';
247
- }
248
- if (p.indexOf(_polyfillHostNoCombinator) > -1) {
249
- scopedP = applySimpleSelectorScope(p, scopeSelector, hostSelector);
250
- }
251
- else {
252
- // remove :host since it should be unnecessary
253
- const t = p.replace(_polyfillHostRe, '');
254
- if (t.length > 0) {
255
- const matches = t.match(/([^:]*)(:*)(.*)/);
256
- if (matches) {
257
- scopedP = matches[1] + className + matches[2] + matches[3];
258
- }
259
- }
260
- }
261
- return scopedP;
262
- };
263
- const safeContent = safeSelector(selector);
264
- selector = safeContent.content;
265
- let scopedSelector = '';
266
- let startIndex = 0;
267
- let res;
268
- const sep = /( |>|\+|~(?!=))\s*/g;
269
- // If a selector appears before :host it should not be shimmed as it
270
- // matches on ancestor elements and not on elements in the host's shadow
271
- // `:host-context(div)` is transformed to
272
- // `-shadowcsshost-no-combinatordiv, div -shadowcsshost-no-combinator`
273
- // the `div` is not part of the component in the 2nd selectors and should not be scoped.
274
- // Historically `component-tag:host` was matching the component so we also want to preserve
275
- // this behavior to avoid breaking legacy apps (it should not match).
276
- // The behavior should be:
277
- // - `tag:host` -> `tag[h]` (this is to avoid breaking legacy apps, should not match anything)
278
- // - `tag :host` -> `tag [h]` (`tag` is not scoped because it's considered part of a
279
- // `:host-context(tag)`)
280
- const hasHost = selector.indexOf(_polyfillHostNoCombinator) > -1;
281
- // Only scope parts after the first `-shadowcsshost-no-combinator` when it is present
282
- let shouldScope = !hasHost;
283
- while ((res = sep.exec(selector)) !== null) {
284
- const separator = res[1];
285
- const part = selector.slice(startIndex, res.index).trim();
286
- shouldScope = shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1;
287
- const scopedPart = shouldScope ? _scopeSelectorPart(part) : part;
288
- scopedSelector += `${scopedPart} ${separator} `;
289
- startIndex = sep.lastIndex;
290
- }
291
- const part = selector.substring(startIndex);
292
- shouldScope = shouldScope || part.indexOf(_polyfillHostNoCombinator) > -1;
293
- scopedSelector += shouldScope ? _scopeSelectorPart(part) : part;
294
- // replace the placeholders with their original values
295
- return restoreSafeSelector(safeContent.placeholders, scopedSelector);
296
- };
297
- const scopeSelector = (selector, scopeSelectorText, hostSelector, slotSelector) => {
298
- return selector
299
- .split(',')
300
- .map((shallowPart) => {
301
- if (slotSelector && shallowPart.indexOf('.' + slotSelector) > -1) {
302
- return shallowPart.trim();
303
- }
304
- if (selectorNeedsScoping(shallowPart, scopeSelectorText)) {
305
- return applyStrictSelectorScope(shallowPart, scopeSelectorText, hostSelector).trim();
306
- }
307
- else {
308
- return shallowPart.trim();
309
- }
310
- })
311
- .join(', ');
312
- };
313
- const scopeSelectors = (cssText, scopeSelectorText, hostSelector, slotSelector, commentOriginalSelector) => {
314
- return processRules(cssText, (rule) => {
315
- let selector = rule.selector;
316
- let content = rule.content;
317
- if (rule.selector[0] !== '@') {
318
- selector = scopeSelector(rule.selector, scopeSelectorText, hostSelector, slotSelector);
319
- }
320
- else if (rule.selector.startsWith('@media') ||
321
- rule.selector.startsWith('@supports') ||
322
- rule.selector.startsWith('@page') ||
323
- rule.selector.startsWith('@document')) {
324
- content = scopeSelectors(rule.content, scopeSelectorText, hostSelector, slotSelector);
325
- }
326
- const cssRule = {
327
- selector: selector.replace(/\s{2,}/g, ' ').trim(),
328
- content,
329
- };
330
- return cssRule;
331
- });
332
- };
333
- const scopeCssText = (cssText, scopeId, hostScopeId, slotScopeId, commentOriginalSelector) => {
334
- cssText = insertPolyfillHostInCssText(cssText);
335
- cssText = convertColonHost(cssText);
336
- cssText = convertColonHostContext(cssText);
337
- const slotted = convertColonSlotted(cssText, slotScopeId);
338
- cssText = slotted.cssText;
339
- cssText = convertShadowDOMSelectors(cssText);
340
- if (scopeId) {
341
- cssText = scopeSelectors(cssText, scopeId, hostScopeId, slotScopeId);
342
- }
343
- cssText = cssText.replace(/-shadowcsshost-no-combinator/g, `.${hostScopeId}`);
344
- cssText = cssText.replace(/>\s*\*\s+([^{, ]+)/gm, ' $1 ');
345
- return {
346
- cssText: cssText.trim(),
347
- slottedSelectors: slotted.selectors,
348
- };
349
- };
350
- const scopeCss = (cssText, scopeId, commentOriginalSelector) => {
351
- const hostScopeId = scopeId + '-h';
352
- const slotScopeId = scopeId + '-s';
353
- const commentsWithHash = extractCommentsWithHash(cssText);
354
- cssText = stripComments(cssText);
355
- const orgSelectors = [];
356
- if (commentOriginalSelector) {
357
- const processCommentedSelector = (rule) => {
358
- const placeholder = `/*!@___${orgSelectors.length}___*/`;
359
- const comment = `/*!@${rule.selector}*/`;
360
- orgSelectors.push({ placeholder, comment });
361
- rule.selector = placeholder + rule.selector;
362
- return rule;
363
- };
364
- cssText = processRules(cssText, (rule) => {
365
- if (rule.selector[0] !== '@') {
366
- return processCommentedSelector(rule);
367
- }
368
- else if (rule.selector.startsWith('@media') ||
369
- rule.selector.startsWith('@supports') ||
370
- rule.selector.startsWith('@page') ||
371
- rule.selector.startsWith('@document')) {
372
- rule.content = processRules(rule.content, processCommentedSelector);
373
- return rule;
374
- }
375
- return rule;
376
- });
377
- }
378
- const scoped = scopeCssText(cssText, scopeId, hostScopeId, slotScopeId);
379
- cssText = [scoped.cssText, ...commentsWithHash].join('\n');
380
- if (commentOriginalSelector) {
381
- orgSelectors.forEach(({ placeholder, comment }) => {
382
- cssText = cssText.replace(placeholder, comment);
383
- });
384
- }
385
- scoped.slottedSelectors.forEach((slottedSelector) => {
386
- cssText = cssText.replace(slottedSelector.orgSelector, slottedSelector.updatedSelector);
387
- });
388
- return cssText;
389
- };
390
-
391
- exports.scopeCss = scopeCss;
@@ -1,23 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-88e58962.js');
6
-
7
- const XplAvatar = class {
8
- constructor(hostRef) {
9
- index.registerInstance(this, hostRef);
10
- this.disabled = false;
11
- }
12
- render() {
13
- let className = 'xpl-avatar';
14
- if (this.size)
15
- className += ` xpl-avatar--${this.size}`;
16
- if (this.color)
17
- className += ` xpl-avatar--${this.color}`;
18
- const inner = (index.h("div", null, this.src ? (index.h("img", { alt: this.name, src: this.src })) : (index.h("div", { class: "xpl-avatar__placeholder" }, index.h("slot", null))), this.status && (index.h("div", { class: `xpl-avatar__dot--${this.status}` }))));
19
- return (index.h(index.Host, null, this.href && !this.disabled ? (index.h("a", { href: this.href, class: className, target: this.target }, inner)) : this.href && this.disabled ? (index.h("div", { class: className + ' xpl-avatar--disabled' }, inner)) : (index.h("div", { class: className }, inner))));
20
- }
21
- };
22
-
23
- exports.xpl_avatar = XplAvatar;
@@ -1,21 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-88e58962.js');
6
-
7
- const XplBadge = class {
8
- constructor(hostRef) {
9
- index.registerInstance(this, hostRef);
10
- }
11
- render() {
12
- let className = 'xpl-badge';
13
- if (this.dot)
14
- className += ' xpl-badge--dot';
15
- if (this.variant)
16
- className += ' xpl-badge--' + this.variant;
17
- return (index.h(index.Host, null, index.h("div", { class: className }, index.h("slot", null))));
18
- }
19
- };
20
-
21
- exports.xpl_badge = XplBadge;
@@ -1,21 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-88e58962.js');
6
-
7
- const XplBreadcrumbItem = class {
8
- constructor(hostRef) {
9
- index.registerInstance(this, hostRef);
10
- // This is temporary as we still don't have a xpl-icon component. When that's created we should update this code.
11
- this.chevron = `<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="chevron-right" class="svg-inline--fa fa-chevron-right fa-w-10" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
12
- <path fill="currentColor" d="M285.476 272.971L91.132 467.314c-9.373 9.373-24.569 9.373-33.941 0l-22.667-22.667c-9.357-9.357-9.375-24.522-.04-33.901L188.505 256 34.484 101.255c-9.335-9.379-9.317-24.544.04-33.901l22.667-22.667c9.373-9.373 24.569-9.373 33.941 0L285.475 239.03c9.373 9.372 9.373 24.568.001 33.941z"></path>
13
- </svg>
14
- `;
15
- }
16
- render() {
17
- return (index.h(index.Host, { class: "xpl-breadcrumb-item", role: "listitem" }, index.h("li", { role: "none" }, index.h("slot", null)), index.h("span", { innerHTML: `${this.chevron}` })));
18
- }
19
- };
20
-
21
- exports.xpl_breadcrumb_item = XplBreadcrumbItem;
@@ -1,16 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-88e58962.js');
6
-
7
- const XplBreadcrumbs = class {
8
- constructor(hostRef) {
9
- index.registerInstance(this, hostRef);
10
- }
11
- render() {
12
- return (index.h(index.Host, null, index.h("nav", { class: "xpl-breadcrumbs", "aria-label": "Breadcrumb" }, index.h("ol", { role: "list" }, index.h("slot", null)))));
13
- }
14
- };
15
-
16
- exports.xpl_breadcrumbs = XplBreadcrumbs;
@@ -1,64 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-88e58962.js');
6
-
7
- const XplButton = class {
8
- constructor(hostRef) {
9
- index.registerInstance(this, hostRef);
10
- /**
11
- * @property {"default" | "sm" | "xs"} - button size
12
- */
13
- this.size = 'default';
14
- /**
15
- * @property {"primary" | "secondary" | "subtle"} - button variant
16
- */
17
- this.variant = 'primary';
18
- /**
19
- * @property {"neutral" | "warning" | "success"} - button state (color) neutral=purple, success=green, warning=red
20
- */
21
- this.state = 'neutral';
22
- }
23
- componentDidRender() {
24
- const attrs = this.el.attributes;
25
- const dataAttrs = Object.keys(attrs)
26
- .filter((k) => {
27
- const propertyName = attrs[k].name;
28
- if (propertyName) {
29
- return (propertyName.includes('data-test') ||
30
- propertyName.includes('aria-'));
31
- }
32
- return false;
33
- })
34
- .reduce((acc, k) => {
35
- return Object.assign(Object.assign({}, acc), { [attrs[k].name]: attrs[k].value });
36
- }, {});
37
- const child = this.el.querySelector('button');
38
- Object.keys(dataAttrs).forEach((k) => {
39
- child.setAttribute(k, dataAttrs[k]);
40
- this.el.removeAttribute(k);
41
- });
42
- }
43
- render() {
44
- let className = `xpl-button
45
- xpl-button--${this.size}
46
- xpl-button--${this.state}
47
- xpl-button--${this.variant}`;
48
- if (this.iconOnly)
49
- className += ' xpl-button--icon-only';
50
- if (this.fullWidth)
51
- className += ' xpl-button--full-width';
52
- if (this.link && this.disabled)
53
- className += ' xpl-button--link-disabled';
54
- return (index.h(index.Host, { class: className },
55
- /**
56
- * Conditionally render either an <slot> or <button> element
57
- * depending on if there's an `link` or not
58
- */
59
- this.link ? (index.h("slot", null)) : (index.h("button", { disabled: this.disabled, name: this.name, type: this.type, value: this.value }, index.h("slot", null)))));
60
- }
61
- get el() { return index.getElement(this); }
62
- };
63
-
64
- exports.xpl_button = XplButton;
@@ -1,29 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-88e58962.js');
6
- const index$1 = require('./index-318d5fc7.js');
7
-
8
- const XplCheckbox = class {
9
- constructor(hostRef) {
10
- index.registerInstance(this, hostRef);
11
- this.checkboxChange = index.createEvent(this, "checkboxChange", 7);
12
- this.id = index$1.v4();
13
- }
14
- render() {
15
- return (index.h(index.Host, { class: {
16
- 'xpl-checkbox-radio-container': true,
17
- styled: this.styled,
18
- disabled: this.disabled,
19
- } }, index.h("input", { class: "xpl-checkbox", type: "checkbox", checked: this.checked, disabled: this.disabled, id: this.id, indeterminate: this.indeterminate, onChange: () => this.checkboxChange.emit(this.input.checked), name: this.name, ref: (el) => (this.input = el), required: this.required, value: this.value }), index.h("label", { class: {
20
- 'xpl-label': true,
21
- 'xpl-label--disabled': this.disabled,
22
- }, htmlFor: this.id }, index.h("slot", null), this.description && (index.h("small", { class: {
23
- 'xpl-description': true,
24
- 'xpl-description--disabled': this.disabled,
25
- } }, this.description)))));
26
- }
27
- };
28
-
29
- exports.xpl_checkbox = XplCheckbox;
@@ -1,20 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-88e58962.js');
6
-
7
- const XplContentArea = class {
8
- constructor(hostRef) {
9
- index.registerInstance(this, hostRef);
10
- /**
11
- * @property {string} size - The content-area size.
12
- */
13
- this.size = 'wide';
14
- }
15
- render() {
16
- return (index.h(index.Host, null, index.h("main", { class: `xpl-content-area-wrapper xpl-content-area-wrapper__${this.size}` }, index.h("div", { class: "xpl-content-area" }, index.h("slot", null)))));
17
- }
18
- };
19
-
20
- exports.xpl_content_area = XplContentArea;
@@ -1,35 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-88e58962.js');
6
-
7
- var __rest = (undefined && undefined.__rest) || function (s, e) {
8
- var t = {};
9
- for (var p in s)
10
- if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
11
- t[p] = s[p];
12
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
13
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
14
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
15
- t[p[i]] = s[p[i]];
16
- }
17
- return t;
18
- };
19
- const XplDropdownGroup = class {
20
- constructor(hostRef) {
21
- index.registerInstance(this, hostRef);
22
- }
23
- render() {
24
- const { groupName, options } = this;
25
- const hasOptions = options && options.length;
26
- const mappedOptions = hasOptions &&
27
- options.map((_a) => {
28
- var { groupName } = _a, properties = __rest(_a, ["groupName"]);
29
- return groupName ? (index.h("xpl-dropdown-group", Object.assign({ label: groupName }, properties))) : (index.h("xpl-dropdown-option", Object.assign({}, properties)));
30
- });
31
- return (index.h(index.Host, { role: "group", "aria-label": groupName }, index.h("li", { class: "xpl-dropdown-list-item" }, index.h("xpl-dropdown-heading", { label: groupName }), index.h("ul", { class: "xpl-dropdown-list" }, mappedOptions || index.h("slot", { name: "options" })))));
32
- }
33
- };
34
-
35
- exports.xpl_dropdown_group = XplDropdownGroup;
@@ -1,16 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-88e58962.js');
6
-
7
- const XplDropdownHeading = class {
8
- constructor(hostRef) {
9
- index.registerInstance(this, hostRef);
10
- }
11
- render() {
12
- return (index.h(index.Host, { class: { 'xpl-dropdown-heading': true }, role: "presentation" }, index.h("span", null, this.label || index.h("slot", { name: "heading" }))));
13
- }
14
- };
15
-
16
- exports.xpl_dropdown_heading = XplDropdownHeading;