@xplortech/apollo-core 0.4.1 → 0.5.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.
Files changed (186) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/build/style.css +291 -104
  3. package/dist/apollo-core/apollo-core.css +5509 -7
  4. package/dist/apollo-core/apollo-core.esm.js +125 -1
  5. package/dist/apollo-core/app-globals-0f993ce5.js +3 -0
  6. package/dist/apollo-core/css-shim-bbdf0cc6.js +4 -0
  7. package/dist/apollo-core/dom-1f98a75f.js +73 -0
  8. package/dist/apollo-core/index-3c9f25ef.js +2938 -0
  9. package/dist/apollo-core/index-3eb5568f.js +2938 -0
  10. package/dist/apollo-core/index-912d1a21.js +584 -0
  11. package/dist/apollo-core/index.esm.js +1 -0
  12. package/dist/{cjs/regular-872f5226.js → apollo-core/regular-133c23b5.js} +12 -3
  13. package/dist/apollo-core/shadow-css-67b66845.js +389 -0
  14. package/dist/apollo-core/xpl-application-shell.entry.js +52 -0
  15. package/dist/apollo-core/xpl-avatar.entry.js +19 -0
  16. package/dist/apollo-core/xpl-backdrop.entry.js +21 -0
  17. package/dist/apollo-core/xpl-badge.entry.js +17 -0
  18. package/dist/{collection/components/xpl-breadcrumbs/xpl-breadcrumb-item/xpl-breadcrumb-item.js → apollo-core/xpl-breadcrumb-item.entry.js} +9 -12
  19. package/dist/apollo-core/xpl-breadcrumbs.entry.js +14 -0
  20. package/dist/{esm → apollo-core}/xpl-button-row.entry.js +1 -1
  21. package/dist/apollo-core/xpl-button.entry.js +34 -0
  22. package/dist/apollo-core/xpl-checkbox.entry.js +25 -0
  23. package/dist/{esm → apollo-core}/xpl-choicelist.entry.js +1 -1
  24. package/dist/apollo-core/xpl-content-area.entry.js +16 -0
  25. package/dist/{esm → apollo-core}/xpl-divider.entry.js +1 -1
  26. package/dist/{esm → apollo-core}/xpl-grid-item.entry.js +1 -1
  27. package/dist/{esm → apollo-core}/xpl-grid.entry.js +1 -1
  28. package/dist/{esm → apollo-core}/xpl-input.entry.js +20 -3
  29. package/dist/{esm → apollo-core}/xpl-list.entry.js +2 -2
  30. package/dist/apollo-core/xpl-main-nav.entry.js +26 -0
  31. package/dist/apollo-core/xpl-nav-item.entry.js +12 -0
  32. package/dist/{esm → apollo-core}/xpl-pagination.entry.js +1 -1
  33. package/dist/apollo-core/xpl-radio.entry.js +25 -0
  34. package/dist/apollo-core/xpl-secondary-nav.entry.js +12 -0
  35. package/dist/{esm → apollo-core}/xpl-select.entry.js +43 -2
  36. package/dist/apollo-core/xpl-table.entry.js +85 -0
  37. package/dist/{esm → apollo-core}/xpl-tag.entry.js +1 -1
  38. package/dist/{esm → apollo-core}/xpl-toggle.entry.js +2 -2
  39. package/dist/apollo-core/xpl-utility-bar.entry.js +25 -0
  40. package/dist/custom-elements/index.d.ts +6 -0
  41. package/dist/types/Users/fernandogelin/Projects/apollo/.stencil/stories/application-shell.stories.d.ts +62 -0
  42. package/dist/types/components/xpl-application-shell/test/xpl-application-shell.e2e.d.ts +1 -0
  43. package/dist/types/components/xpl-application-shell/xpl-application-shell.d.ts +24 -0
  44. package/dist/types/components/xpl-avatar/test/xpl-avatar.e2e.d.ts +1 -0
  45. package/dist/types/components/xpl-avatar/test/xpl-avatar.spec.d.ts +1 -0
  46. package/dist/types/components/xpl-backdrop/test/xpl-backdrop.e2e.d.ts +1 -0
  47. package/dist/types/components/xpl-backdrop/xpl-backdrop.d.ts +5 -0
  48. package/dist/types/components/xpl-badge/test/xpl-badge.e2e.d.ts +1 -0
  49. package/dist/types/components/xpl-badge/test/xpl-badge.spec.d.ts +1 -0
  50. package/dist/types/components/xpl-breadcrumbs/xpl-breadcrumb-item/test/xpl-breadcrumb-item.e2e.d.ts +1 -0
  51. package/dist/types/components/xpl-breadcrumbs/xpl-breadcrumbs/test/xpl-breadcrumbs.e2e.d.ts +1 -0
  52. package/dist/types/components/xpl-button/test/xpl-button.e2e.d.ts +1 -0
  53. package/dist/types/components/xpl-button/test/xpl-button.spec.d.ts +1 -0
  54. package/dist/types/components/xpl-button-row/test/xpl-button-row.e2e.d.ts +1 -0
  55. package/dist/types/components/xpl-button-row/test/xpl-button-row.spec.d.ts +1 -0
  56. package/dist/types/components/xpl-checkbox/test/xpl-checkbox.e2e.d.ts +1 -0
  57. package/dist/types/components/xpl-checkbox/test/xpl-checkbox.spec.d.ts +1 -0
  58. package/dist/types/components/xpl-choicelist/test/xpl-choicelist.e2e.d.ts +1 -0
  59. package/dist/types/components/xpl-choicelist/test/xpl-choicelist.spec.d.ts +1 -0
  60. package/dist/types/components/xpl-content-area/test/xpl-content-area.e2e.d.ts +1 -0
  61. package/dist/types/components/xpl-divider/test/xpl-divider.e2e.d.ts +1 -0
  62. package/dist/types/components/xpl-divider/test/xpl-divider.spec.d.ts +1 -0
  63. package/dist/types/components/xpl-grid/test/xpl-grid.e2e.d.ts +1 -0
  64. package/dist/types/components/xpl-grid/test/xpl-grid.spec.d.ts +1 -0
  65. package/dist/types/components/xpl-grid-item/test/xpl-grid-item.e2e.d.ts +1 -0
  66. package/dist/types/components/xpl-grid-item/test/xpl-grid-item.spec.d.ts +1 -0
  67. package/dist/types/components/xpl-input/test/xpl-input.e2e.d.ts +1 -0
  68. package/dist/types/components/xpl-input/test/xpl-input.spec.d.ts +1 -0
  69. package/dist/types/components/xpl-list/test/xpl-list.e2e.d.ts +1 -0
  70. package/dist/types/components/xpl-list/test/xpl-list.spec.d.ts +1 -0
  71. package/dist/types/components/xpl-main-nav/test/xpl-main-nav.e2e.d.ts +1 -0
  72. package/dist/types/components/xpl-main-nav/xpl-main-nav.d.ts +9 -0
  73. package/dist/types/components/xpl-nav-item/test/xpl-nav-item.e2e.d.ts +1 -0
  74. package/dist/types/components/xpl-pagination/test/xpl-pagination.e2e.d.ts +1 -0
  75. package/dist/types/components/xpl-pagination/test/xpl-pagination.spec.d.ts +1 -0
  76. package/dist/types/components/xpl-radio/test/xpl-radio.e2e.d.ts +1 -0
  77. package/dist/types/components/xpl-radio/test/xpl-radio.spec.d.ts +1 -0
  78. package/dist/types/components/xpl-secondary-nav/test/secondary-nav.e2e.d.ts +1 -0
  79. package/dist/types/components/xpl-select/test/xpl-select.e2e.d.ts +1 -0
  80. package/dist/types/components/xpl-select/test/xpl-select.spec.d.ts +1 -0
  81. package/dist/types/components/xpl-table/test/xpl-table.e2e.d.ts +1 -0
  82. package/dist/types/components/xpl-table/test/xpl-table.spec.d.ts +1 -0
  83. package/dist/types/components/xpl-tag/test/xpl-tag.e2e.d.ts +1 -0
  84. package/dist/types/components/xpl-tag/test/xpl-tag.spec.d.ts +1 -0
  85. package/dist/types/components/xpl-toggle/test/xpl-toggle.e2e.d.ts +1 -0
  86. package/dist/types/components/xpl-toggle/test/xpl-toggle.spec.d.ts +1 -0
  87. package/dist/types/components/xpl-utility-bar/test/xpl-utility-bar.e2e.d.ts +1 -0
  88. package/dist/types/components/xpl-utility-bar/xpl-utility-bar.d.ts +12 -0
  89. package/dist/types/components.d.ts +61 -0
  90. package/package.json +1 -1
  91. package/dist/apollo-core/p-0027c582.entry.js +0 -1
  92. package/dist/apollo-core/p-2c551f4d.entry.js +0 -1
  93. package/dist/apollo-core/p-2f90296c.js +0 -10
  94. package/dist/apollo-core/p-6081e432.entry.js +0 -1
  95. package/dist/apollo-core/p-612984e5.entry.js +0 -1
  96. package/dist/apollo-core/p-63ea199d.entry.js +0 -1
  97. package/dist/apollo-core/p-650f6416.entry.js +0 -1
  98. package/dist/apollo-core/p-6ad97405.entry.js +0 -1
  99. package/dist/apollo-core/p-9b9511e4.entry.js +0 -1
  100. package/dist/apollo-core/p-ad90fe4d.js +0 -1
  101. package/dist/apollo-core/p-c6fec744.entry.js +0 -1
  102. package/dist/apollo-core/p-ea8e0991.js +0 -1
  103. package/dist/apollo-core/p-ed04cedd.entry.js +0 -1
  104. package/dist/apollo-core/p-eec5a0f1.entry.js +0 -1
  105. package/dist/apollo-core/p-f4f646d9.entry.js +0 -1
  106. package/dist/cjs/apollo-core.cjs.js +0 -19
  107. package/dist/cjs/index-9662f096.js +0 -1541
  108. package/dist/cjs/index.cjs.js +0 -2
  109. package/dist/cjs/loader.cjs.js +0 -21
  110. package/dist/cjs/v4-14140ff3.js +0 -77
  111. package/dist/cjs/xpl-avatar_14.cjs.entry.js +0 -293
  112. package/dist/cjs/xpl-button-row.cjs.entry.js +0 -24
  113. package/dist/cjs/xpl-choicelist.cjs.entry.js +0 -36
  114. package/dist/cjs/xpl-divider.cjs.entry.js +0 -18
  115. package/dist/cjs/xpl-grid-item.cjs.entry.js +0 -25
  116. package/dist/cjs/xpl-grid.cjs.entry.js +0 -35
  117. package/dist/cjs/xpl-input.cjs.entry.js +0 -2527
  118. package/dist/cjs/xpl-list.cjs.entry.js +0 -63
  119. package/dist/cjs/xpl-pagination.cjs.entry.js +0 -76
  120. package/dist/cjs/xpl-select.cjs.entry.js +0 -623
  121. package/dist/cjs/xpl-tag.cjs.entry.js +0 -21
  122. package/dist/cjs/xpl-toggle.cjs.entry.js +0 -34
  123. package/dist/collection/collection-manifest.json +0 -36
  124. package/dist/collection/components/xpl-avatar/xpl-avatar.js +0 -158
  125. package/dist/collection/components/xpl-backdrop/xpl-backdrop.js +0 -7
  126. package/dist/collection/components/xpl-badge/xpl-badge.js +0 -50
  127. package/dist/collection/components/xpl-breadcrumbs/xpl-breadcrumbs/xpl-breadcrumbs.js +0 -15
  128. package/dist/collection/components/xpl-button/xpl-button.js +0 -214
  129. package/dist/collection/components/xpl-button-row/xpl-button-row.js +0 -119
  130. package/dist/collection/components/xpl-checkbox/xpl-checkbox.js +0 -185
  131. package/dist/collection/components/xpl-choicelist/xpl-choicelist.js +0 -143
  132. package/dist/collection/components/xpl-content-area/xpl-content-area.js +0 -39
  133. package/dist/collection/components/xpl-divider/xpl-divider.js +0 -30
  134. package/dist/collection/components/xpl-dropdown/xpl-dropdown.js +0 -32
  135. package/dist/collection/components/xpl-grid/xpl-grid.js +0 -26
  136. package/dist/collection/components/xpl-grid-item/xpl-grid-item.js +0 -93
  137. package/dist/collection/components/xpl-input/xpl-input.js +0 -471
  138. package/dist/collection/components/xpl-list/xpl-list.js +0 -93
  139. package/dist/collection/components/xpl-main-nav/xpl-main-nav.js +0 -43
  140. package/dist/collection/components/xpl-nav-item/xpl-nav-item.js +0 -10
  141. package/dist/collection/components/xpl-pagination/xpl-pagination.js +0 -189
  142. package/dist/collection/components/xpl-radio/xpl-radio.js +0 -168
  143. package/dist/collection/components/xpl-secondary-nav/xpl-secondary-nav.js +0 -9
  144. package/dist/collection/components/xpl-select/xpl-select.js +0 -311
  145. package/dist/collection/components/xpl-table/xpl-table.js +0 -194
  146. package/dist/collection/components/xpl-tag/xpl-tag.js +0 -30
  147. package/dist/collection/components/xpl-toggle/xpl-toggle.js +0 -157
  148. package/dist/collection/components/xpl-utility-bar/xpl-utility-bar.js +0 -10
  149. package/dist/custom-elements/index.js +0 -19877
  150. package/dist/esm/apollo-core.js +0 -17
  151. package/dist/esm/index-619763f9.js +0 -1512
  152. package/dist/esm/index.js +0 -1
  153. package/dist/esm/loader.js +0 -17
  154. package/dist/esm/polyfills/core-js.js +0 -11
  155. package/dist/esm/polyfills/css-shim.js +0 -1
  156. package/dist/esm/polyfills/dom.js +0 -79
  157. package/dist/esm/polyfills/es5-html-element.js +0 -1
  158. package/dist/esm/polyfills/index.js +0 -34
  159. package/dist/esm/polyfills/system.js +0 -6
  160. package/dist/esm/regular-86225e9d.js +0 -16041
  161. package/dist/esm/v4-929670b7.js +0 -75
  162. package/dist/esm/xpl-avatar_14.entry.js +0 -276
  163. package/dist/index.cjs.js +0 -1
  164. package/dist/index.js +0 -1
  165. package/dist/stories/avatar.stories.js +0 -173
  166. package/dist/stories/backdrop.stories.js +0 -18
  167. package/dist/stories/badge.stories.js +0 -48
  168. package/dist/stories/breadcrumbs.stories.js +0 -115
  169. package/dist/stories/button-row.stories.js +0 -64
  170. package/dist/stories/button.stories.js +0 -98
  171. package/dist/stories/checkbox.stories.js +0 -76
  172. package/dist/stories/choicelist.stories.js +0 -112
  173. package/dist/stories/content-area.stories.js +0 -53
  174. package/dist/stories/divider.stories.js +0 -34
  175. package/dist/stories/grid.stories.js +0 -100
  176. package/dist/stories/input.stories.js +0 -252
  177. package/dist/stories/list.stories.js +0 -134
  178. package/dist/stories/main-nav.stories.js +0 -308
  179. package/dist/stories/pagination.stories.js +0 -84
  180. package/dist/stories/radio.stories.js +0 -66
  181. package/dist/stories/secondary-nav.stories.js +0 -76
  182. package/dist/stories/select.stories.js +0 -111
  183. package/dist/stories/table.stories.js +0 -107
  184. package/dist/stories/tabs.stories.js +0 -24
  185. package/dist/stories/toggle.stories.js +0 -80
  186. package/dist/stories/utility-bar.stories.js +0 -94
@@ -1,2 +0,0 @@
1
- 'use strict';
2
-
@@ -1,21 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-9662f096.js');
6
-
7
- /*
8
- Stencil Client Patch Esm v2.8.0 | MIT Licensed | https://stenciljs.com
9
- */
10
- const patchEsm = () => {
11
- return index.promiseResolve();
12
- };
13
-
14
- const defineCustomElements = (win, options) => {
15
- if (typeof window === 'undefined') return Promise.resolve();
16
- return patchEsm().then(() => {
17
- return index.bootstrapLazy([["xpl-avatar_14.cjs",[[0,"xpl-backdrop"],[4,"xpl-breadcrumb-item"],[4,"xpl-breadcrumbs"],[4,"xpl-content-area",{"size":[1]}],[4,"xpl-main-nav",{"width":[1]}],[4,"xpl-nav-item"],[4,"xpl-secondary-nav"],[0,"xpl-table",{"columns":[16],"data":[16],"freeze":[4],"multiselect":[4],"striped":[4],"areAllSelected":[32],"rowData":[32],"hasScrolled":[32],"selected":[32]}],[4,"xpl-utility-bar"],[4,"xpl-avatar",{"color":[1],"disabled":[4],"href":[1],"name":[1],"size":[1],"src":[1],"status":[1],"target":[1]}],[4,"xpl-badge",{"dot":[4],"variant":[1]}],[4,"xpl-button",{"disabled":[4],"href":[1],"icon":[1],"iconOnly":[4,"icon-only"],"iconTrailing":[4,"icon-trailing"],"name":[1],"size":[1],"type":[1],"value":[1],"variant":[1]}],[4,"xpl-checkbox",{"checked":[4],"description":[1],"disabled":[4],"indeterminate":[4],"name":[1],"required":[4],"styled":[4],"value":[1],"id":[32]}],[4,"xpl-radio",{"checked":[4],"description":[1],"disabled":[4],"name":[1],"required":[4],"styled":[4],"value":[1],"id":[32]}]]],["xpl-choicelist.cjs",[[0,"xpl-choicelist",{"choices":[16],"description":[1],"heading":[1],"multi":[4],"name":[1],"styled":[4],"selected":[32]}]]],["xpl-list.cjs",[[0,"xpl-list",{"items":[16]}]]],["xpl-button-row.cjs",[[0,"xpl-button-row",{"primary":[1],"secondary":[1],"tertiary":[1]}]]],["xpl-select.cjs",[[0,"xpl-select",{"choices":[16],"description":[1],"disabled":[4],"error":[1],"label":[1],"mode":[1],"placeholder":[1],"truncate":[4],"active":[32],"id":[32],"keepFocus":[32],"selected":[32],"value":[32],"visibleChoices":[32]}]]],["xpl-divider.cjs",[[4,"xpl-divider",{"tier":[2]}]]],["xpl-grid.cjs",[[0,"xpl-grid"]]],["xpl-grid-item.cjs",[[4,"xpl-grid-item",{"xs":[2],"sm":[2],"md":[2],"lg":[2]}]]],["xpl-input.cjs",[[0,"xpl-input",{"_id":[1],"autocomplete":[1],"dateFormat":[1,"date-format"],"description":[1],"disabled":[4],"error":[1],"label":[1],"max":[8],"maxCharacterCount":[2,"max-character-count"],"min":[8],"mode":[1],"multiline":[4],"name":[1],"placeholder":[1],"post":[1],"pre":[1],"readonly":[4],"required":[4],"step":[2],"type":[1],"value":[1],"characterCount":[32],"passwordVisible":[32]}]]],["xpl-pagination.cjs",[[0,"xpl-pagination",{"total":[2],"perPage":[2,"per-page"],"waitForCallback":[4,"wait-for-callback"],"current":[32],"goto":[64]}]]],["xpl-toggle.cjs",[[0,"xpl-toggle",{"checked":[4],"description":[1],"disabled":[4],"heading":[1],"label":[1],"name":[1],"variant":[1],"id":[32]}]]],["xpl-tag.cjs",[[4,"xpl-tag"]]]], options);
18
- });
19
- };
20
-
21
- exports.defineCustomElements = defineCustomElements;
@@ -1,77 +0,0 @@
1
- 'use strict';
2
-
3
- // Unique ID creation requires a high quality random # generator. In the browser we therefore
4
- // require the crypto API and do not support built-in fallback to lower quality random number
5
- // generators (like Math.random()).
6
- var getRandomValues;
7
- var rnds8 = new Uint8Array(16);
8
- function rng() {
9
- // lazy load so that environments that need to polyfill have a chance to do so
10
- if (!getRandomValues) {
11
- // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation. Also,
12
- // find the complete implementation of crypto (msCrypto) on IE11.
13
- getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto) || typeof msCrypto !== 'undefined' && typeof msCrypto.getRandomValues === 'function' && msCrypto.getRandomValues.bind(msCrypto);
14
-
15
- if (!getRandomValues) {
16
- throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
17
- }
18
- }
19
-
20
- return getRandomValues(rnds8);
21
- }
22
-
23
- const REGEX = /^(?:[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}|00000000-0000-0000-0000-000000000000)$/i;
24
-
25
- function validate(uuid) {
26
- return typeof uuid === 'string' && REGEX.test(uuid);
27
- }
28
-
29
- /**
30
- * Convert array of 16 byte values to UUID string format of the form:
31
- * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
32
- */
33
-
34
- var byteToHex = [];
35
-
36
- for (var i = 0; i < 256; ++i) {
37
- byteToHex.push((i + 0x100).toString(16).substr(1));
38
- }
39
-
40
- function stringify(arr) {
41
- var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
42
- // Note: Be careful editing this code! It's been tuned for performance
43
- // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
44
- var uuid = (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase(); // Consistency check for valid UUID. If this throws, it's likely due to one
45
- // of the following:
46
- // - One or more input array values don't map to a hex octet (leading to
47
- // "undefined" in the uuid)
48
- // - Invalid input values for the RFC `version` or `variant` fields
49
-
50
- if (!validate(uuid)) {
51
- throw TypeError('Stringified UUID is invalid');
52
- }
53
-
54
- return uuid;
55
- }
56
-
57
- function v4(options, buf, offset) {
58
- options = options || {};
59
- var rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
60
-
61
- rnds[6] = rnds[6] & 0x0f | 0x40;
62
- rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
63
-
64
- if (buf) {
65
- offset = offset || 0;
66
-
67
- for (var i = 0; i < 16; ++i) {
68
- buf[offset + i] = rnds[i];
69
- }
70
-
71
- return buf;
72
- }
73
-
74
- return stringify(rnds);
75
- }
76
-
77
- exports.v4 = v4;
@@ -1,293 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-9662f096.js');
6
- require('./regular-872f5226.js');
7
- const v4 = require('./v4-14140ff3.js');
8
-
9
- const XplAvatar = class {
10
- constructor(hostRef) {
11
- index.registerInstance(this, hostRef);
12
- this.disabled = false;
13
- }
14
- render() {
15
- let className = "xpl-avatar";
16
- if (this.size)
17
- className += ` xpl-avatar--${this.size}`;
18
- if (this.color)
19
- className += ` xpl-avatar--${this.color}`;
20
- 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}` })));
21
- 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))));
22
- }
23
- };
24
-
25
- const XplBackdrop = class {
26
- constructor(hostRef) {
27
- index.registerInstance(this, hostRef);
28
- }
29
- render() {
30
- return (index.h(index.Host, { class: "xpl-backdrop", "aria-hidden": "true" }));
31
- }
32
- };
33
-
34
- const XplBadge = class {
35
- constructor(hostRef) {
36
- index.registerInstance(this, hostRef);
37
- }
38
- render() {
39
- let className = "xpl-badge";
40
- if (this.dot)
41
- className += " xpl-badge--dot";
42
- if (this.variant)
43
- className += " xpl-badge--" + this.variant;
44
- return (index.h(index.Host, null, index.h("div", { class: className }, index.h("slot", null))));
45
- }
46
- };
47
-
48
- const XplBreadcrumbItem = class {
49
- constructor(hostRef) {
50
- index.registerInstance(this, hostRef);
51
- // This is temporary as we still don't have a xpl-icon component. When that's created we should update this code.
52
- 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">
53
- <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>
54
- </svg>
55
- `;
56
- }
57
- render() {
58
- 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}` })));
59
- }
60
- ;
61
- };
62
-
63
- const XplBreadcrumbs = class {
64
- constructor(hostRef) {
65
- index.registerInstance(this, hostRef);
66
- }
67
- render() {
68
- return (index.h(index.Host, null, index.h("nav", { class: "xpl-breadcrumbs", "aria-label": "Breadcrumb" }, index.h("ol", { role: "list" }, index.h("slot", null)))));
69
- }
70
- ;
71
- };
72
-
73
- const XplButton = class {
74
- constructor(hostRef) {
75
- index.registerInstance(this, hostRef);
76
- this.size = "default";
77
- this.variant = "primary";
78
- }
79
- render() {
80
- let className = "xpl-button";
81
- if (this.variant === "secondary")
82
- className += " xpl-button--secondary";
83
- if (this.variant === "subtle")
84
- className += " xpl-button--subtle";
85
- if (this.variant === "warning")
86
- className += " xpl-button--warning";
87
- if (this.size === "sm")
88
- className += " xpl-button--sm";
89
- if (this.size === "xs")
90
- className += " xpl-button--xs";
91
- if (this.iconOnly)
92
- className += " xpl-button--icon-only";
93
- const icon = this.icon ? (index.h("i", { class: `far fa-${this.icon} ${this.iconTrailing ? "trailing" : this.iconOnly ? "" : "leading"}` })) : null;
94
- return (index.h(index.Host, null,
95
- /**
96
- * Conditionally render either an <a> or <button> element
97
- * depending on if there's an `href` or not
98
- */
99
- this.href ? (index.h("a", { class: className, href: this.href, role: "button" }, !this.iconTrailing && icon, this.iconOnly ? (index.h("span", { class: "sr-only" }, index.h("slot", null))) : (index.h("slot", null)), this.iconTrailing && icon)) : (index.h("button", { class: className, disabled: this.disabled, name: this.name, type: this.type, value: this.value }, !this.iconTrailing && icon, this.iconOnly ? (index.h("span", { class: "sr-only" }, index.h("slot", null))) : (index.h("slot", null)), this.iconTrailing && icon))));
100
- }
101
- };
102
-
103
- const XplCheckbox = class {
104
- constructor(hostRef) {
105
- index.registerInstance(this, hostRef);
106
- this.checkboxChange = index.createEvent(this, "checkboxChange", 7);
107
- this.id = v4.v4();
108
- }
109
- render() {
110
- return (index.h(index.Host, { class: {
111
- "xpl-checkbox-radio-container": true,
112
- "styled": this.styled,
113
- "disabled": this.disabled,
114
- } }, 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: {
115
- "xpl-label": true,
116
- "xpl-label--disabled": this.disabled
117
- }, htmlFor: this.id }, index.h("slot", null), this.description && index.h("small", { class: {
118
- "xpl-description": true,
119
- "xpl-description--disabled": this.disabled
120
- } }, this.description))));
121
- }
122
- };
123
-
124
- const XplContentArea = class {
125
- constructor(hostRef) {
126
- index.registerInstance(this, hostRef);
127
- /**
128
- * @property {string} size - The content-area size.
129
- */
130
- this.size = "wide";
131
- }
132
- render() {
133
- 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)))));
134
- }
135
- };
136
-
137
- const XplMainNav = class {
138
- constructor(hostRef) {
139
- index.registerInstance(this, hostRef);
140
- /**
141
- * @property {string} width - The width of the Main Nav.
142
- */
143
- this.width = "default";
144
- }
145
- render() {
146
- return (index.h(index.Host, { class: `xpl-main-nav xpl-main-nav__${this.width}`, "aria-label": "Sidebar" }, index.h("nav", null, index.h("header", { "aria-label": "Sidebar Header" }, index.h("slot", { name: "logo" }), index.h("slot", { name: "brand-name" })), index.h("slot", { name: "navigation" })), index.h("footer", { class: "xpl-main-nav-footer", "aria-label": "Sidebar Footer" }, index.h("slot", { name: "footer" }))));
147
- }
148
- };
149
-
150
- const XplNavItem = class {
151
- constructor(hostRef) {
152
- index.registerInstance(this, hostRef);
153
- }
154
- render() {
155
- return (index.h(index.Host, { class: "xpl-nav-item", role: "listitem" }, index.h("slot", { name: "link" }, index.h("slot", { name: "icon" }), index.h("slot", null))));
156
- }
157
- };
158
-
159
- const XplRadio = class {
160
- constructor(hostRef) {
161
- index.registerInstance(this, hostRef);
162
- this.radioChange = index.createEvent(this, "radioChange", 7);
163
- this.id = v4.v4();
164
- }
165
- render() {
166
- return (index.h(index.Host, { class: {
167
- "xpl-checkbox-radio-container": true,
168
- "styled": this.styled,
169
- "disabled": this.disabled,
170
- } }, index.h("input", { class: "xpl-radio", type: "radio", checked: this.checked, disabled: this.disabled, id: this.id, name: this.name, required: this.required, value: this.value, onChange: () => this.radioChange.emit(true) }), index.h("label", { class: {
171
- "xpl-label": true,
172
- "xpl-label--disabled": this.disabled
173
- }, htmlFor: this.id }, index.h("slot", null), this.description && index.h("small", { class: {
174
- "xpl-description": true,
175
- "xpl-description--disabled": this.disabled
176
- } }, this.description))));
177
- }
178
- };
179
-
180
- const XplSecondaryNav = class {
181
- constructor(hostRef) {
182
- index.registerInstance(this, hostRef);
183
- }
184
- render() {
185
- return (index.h(index.Host, { class: "xpl-secondary-nav" }, index.h("nav", { "aria-label": "Secondary Nav" }, index.h("slot", null))));
186
- }
187
- };
188
-
189
- const XplTable = class {
190
- constructor(hostRef) {
191
- index.registerInstance(this, hostRef);
192
- this.tableSelect = index.createEvent(this, "tableSelect", 7);
193
- this.areAllSelected = false;
194
- this.hasScrolled = false;
195
- this.selectAll = (e) => {
196
- const { target } = e;
197
- if (!(target instanceof HTMLInputElement))
198
- return;
199
- const { checked } = target;
200
- this.areAllSelected = checked;
201
- this.selected = this.selected.map(() => checked);
202
- this.onChange();
203
- };
204
- this.selectOne = (e, i) => {
205
- const { target } = e;
206
- if (!(target instanceof HTMLInputElement))
207
- return;
208
- const { checked } = target;
209
- this.areAllSelected = false;
210
- this.selected = this.selected.map((v, _i) => (_i === i ? checked : v));
211
- this.onChange();
212
- };
213
- this.onChange = () => {
214
- this.tableSelect.emit({
215
- selected: this.selected,
216
- areAllSelected: this.areAllSelected,
217
- });
218
- };
219
- this.onScroll = () => {
220
- this.hasScrolled = this.container.scrollLeft > 0;
221
- };
222
- /**
223
- * TODO: Need to figure out how this interplays with data
224
- * received from an API/server
225
- */
226
- this.sortBy = (col, ascending = true) => {
227
- this.rowData.sort((a, b) => {
228
- const A = a[col];
229
- const B = b[col];
230
- if (typeof A === "number" && typeof B === "number") {
231
- const f = ascending ? 1 : -1;
232
- return A > B ? f : -f;
233
- }
234
- return -1;
235
- });
236
- this.rowData = Array.from(this.rowData);
237
- this.render();
238
- };
239
- }
240
- componentWillLoad() {
241
- this.areAllSelected = false;
242
- this.rowData = this.data !== undefined ? Array.from(this.data) : [];
243
- this.selected = new Array(this.rowData.length).fill(false);
244
- }
245
- render() {
246
- let className = "xpl-table";
247
- if (this.striped)
248
- className += " xpl-table--striped";
249
- if (this.freeze)
250
- className += " xpl-table--freeze";
251
- if (this.hasScrolled)
252
- className += " xpl-table--has-scrolled";
253
- return (index.h(index.Host, null, index.h("div", { class: "xpl-table-container", onScroll: this.onScroll, ref: (el) => (this.container = el) }, index.h("table", { class: className }, this.columns && (index.h("thead", null, this.columns.map((column, i) => {
254
- return (index.h("th", null, this.multiselect && i === 0 ? (index.h("label", { htmlFor: "__xpl-table-th" }, index.h("input", { checked: this.areAllSelected, id: "__xpl-table-th",
255
- // appear indeterminate when at least one but not all
256
- // are selected
257
- indeterminate: !this.areAllSelected &&
258
- this.selected.some((a) => a), onChange: (e) => {
259
- this.selectAll(e);
260
- }, type: "checkbox" }), column)) : (column)));
261
- }))), index.h("tbody", null, this.rowData.map((row, rowNum) => {
262
- return (index.h("tr", { class: this.selected && this.selected[rowNum]
263
- ? "xpl-table-row-selected"
264
- : "" }, row.map((cell, i) => {
265
- return (index.h("td", null, this.multiselect && i === 0 ? (index.h("label", { htmlFor: "__xpl-table-row-" + rowNum }, index.h("input", { id: "__xpl-table-row-" + rowNum, checked: this.selected[rowNum], type: "checkbox", onChange: (e) => this.selectOne(e, rowNum) }), index.h("div", { innerHTML: cell }))) : (index.h("div", { innerHTML: cell }))));
266
- })));
267
- }))))));
268
- }
269
- };
270
-
271
- const XplUtilityBar = class {
272
- constructor(hostRef) {
273
- index.registerInstance(this, hostRef);
274
- }
275
- render() {
276
- return (index.h(index.Host, null, index.h("nav", { "aria-label": "utility navigation bar", class: "xpl-utility-bar" }, index.h("slot", { name: "main" }), index.h("slot", { name: "aside" }))));
277
- }
278
- };
279
-
280
- exports.xpl_avatar = XplAvatar;
281
- exports.xpl_backdrop = XplBackdrop;
282
- exports.xpl_badge = XplBadge;
283
- exports.xpl_breadcrumb_item = XplBreadcrumbItem;
284
- exports.xpl_breadcrumbs = XplBreadcrumbs;
285
- exports.xpl_button = XplButton;
286
- exports.xpl_checkbox = XplCheckbox;
287
- exports.xpl_content_area = XplContentArea;
288
- exports.xpl_main_nav = XplMainNav;
289
- exports.xpl_nav_item = XplNavItem;
290
- exports.xpl_radio = XplRadio;
291
- exports.xpl_secondary_nav = XplSecondaryNav;
292
- exports.xpl_table = XplTable;
293
- exports.xpl_utility_bar = XplUtilityBar;
@@ -1,24 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-9662f096.js');
6
-
7
- const XplButtonRow = class {
8
- constructor(hostRef) {
9
- index.registerInstance(this, hostRef);
10
- this.clickPrimary = index.createEvent(this, "clickPrimary", 7);
11
- this.clickSecondary = index.createEvent(this, "clickSecondary", 7);
12
- this.clickTertiary = index.createEvent(this, "clickTertiary", 7);
13
- this.onPrimary = () => this.clickPrimary.emit();
14
- this.onSecondary = () => this.clickSecondary.emit();
15
- this.onTertiary = () => this.clickTertiary.emit();
16
- }
17
- render() {
18
- return (index.h(index.Host, { class: "xpl-button-row" }, index.h("div", { class: "xpl-button-row-inner" }, index.h("div", { class: "xpl-button-row__left" }, this.secondary &&
19
- index.h("xpl-button", { variant: "secondary", type: "button", onClick: this.onSecondary }, this.secondary)), index.h("div", { class: "xpl-button-row__right" }, this.tertiary && index.h("xpl-button", { variant: "subtle", type: "button", onClick: this.onTertiary }, this.tertiary), this.secondary &&
20
- index.h("xpl-button", { variant: "secondary", type: "button", onClick: this.onSecondary }, this.secondary), this.primary && index.h("xpl-button", { class: "xpl-button-row__primary", onClick: this.onPrimary }, this.primary)))));
21
- }
22
- };
23
-
24
- exports.xpl_button_row = XplButtonRow;
@@ -1,36 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-9662f096.js');
6
-
7
- const XplChoicelist = class {
8
- constructor(hostRef) {
9
- index.registerInstance(this, hostRef);
10
- }
11
- componentWillLoad() {
12
- this.selected = this.choices !== undefined && this.choices !== null && this.choices.length > 0 ? this.choices.map(() => false) : [];
13
- }
14
- render() {
15
- let className = "xpl-choicelist";
16
- if (this.styled)
17
- className += " xpl-choicelist--styled";
18
- return (index.h(index.Host, { class: "xpl-choicelist-container" }, this.heading !== undefined || this.description !== undefined ? index.h("div", { class: "xpl-choicelist-heading" }, this.heading && index.h("h3", null, this.heading), this.description && index.h("p", null, this.description)) : null, this.choices && (index.h("ul", { class: className }, this.choices.map(({ children, description, label }, i) => {
19
- const inner = this.multi ? (index.h("xpl-checkbox", { description: description, name: this.name, onCheckboxChange: (e) => {
20
- const { detail } = e;
21
- this.selected = this.selected.map((v, j) => i === j ? detail : v);
22
- } }, label)) : (index.h("xpl-radio", { description: description, name: this.name, onRadioChange: () => {
23
- // TypeScript errors since `v` isn't used
24
- // @ts-expect-error
25
- this.selected = this.selected.map((v, j) => i === j);
26
- } }, label));
27
- let className = this.styled && this.selected[i] ? "selected" : "";
28
- return (index.h("li", { class: className }, inner, children && index.h("ul", null, children.map((child) => {
29
- const childInner = this.multi ? (index.h("xpl-checkbox", { description: child.description }, child.label)) : (index.h("xpl-radio", { description: child.description }, child.label));
30
- return index.h("li", null, childInner);
31
- }))));
32
- })))));
33
- }
34
- };
35
-
36
- exports.xpl_choicelist = XplChoicelist;
@@ -1,18 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-9662f096.js');
6
-
7
- const XplDivider = class {
8
- constructor(hostRef) {
9
- index.registerInstance(this, hostRef);
10
- }
11
- render() {
12
- let className = "xpl-divider";
13
- className += ` xpl-divider--${this.tier}`;
14
- return (index.h(index.Host, { class: className }, index.h("span", null, index.h("slot", null))));
15
- }
16
- };
17
-
18
- exports.xpl_divider = XplDivider;
@@ -1,25 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-9662f096.js');
6
-
7
- const XplGridItem = class {
8
- constructor(hostRef) {
9
- index.registerInstance(this, hostRef);
10
- this.xs = 6;
11
- this.sm = 6;
12
- this.md = 6;
13
- this.lg = 6;
14
- }
15
- render() {
16
- let className = "xpl-grid-item";
17
- className += ` xpl-grid-item-xs-${this.xs}`;
18
- className += ` xpl-grid-item-sm-${this.sm}`;
19
- className += ` xpl-grid-item-md-${this.md}`;
20
- className += ` xpl-grid-item-lg-${this.lg}`;
21
- return (index.h(index.Host, { class: className }, index.h("slot", null)));
22
- }
23
- };
24
-
25
- exports.xpl_grid_item = XplGridItem;
@@ -1,35 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- const index = require('./index-9662f096.js');
6
-
7
- const XplGrid = class {
8
- constructor(hostRef) {
9
- index.registerInstance(this, hostRef);
10
- }
11
- componentDidLoad() {
12
- const items = Array.from(this.container.querySelectorAll(".xpl-grid-item"));
13
- let lgCounter = 0, mdCounter = 0, smCounter = 0, xsCounter = 0;
14
- items.forEach(item => {
15
- lgCounter += +item.getAttribute("lg") || 6;
16
- mdCounter += +item.getAttribute("md") || 6;
17
- smCounter += +item.getAttribute("sm") || 6;
18
- xsCounter += +item.getAttribute("xs") || 6;
19
- if (lgCounter % 6 === 0)
20
- item.classList.add("xpl-grid-item-lg-last");
21
- if (mdCounter % 6 === 0)
22
- item.classList.add("xpl-grid-item-md-last");
23
- if (smCounter % 6 === 0)
24
- item.classList.add("xpl-grid-item-sm-last");
25
- if (xsCounter % 6 === 0)
26
- item.classList.add("xpl-grid-item-xs-last");
27
- });
28
- }
29
- render() {
30
- return (index.h(index.Host, { class: "xpl-grid" }));
31
- }
32
- get container() { return index.getElement(this); }
33
- };
34
-
35
- exports.xpl_grid = XplGrid;