@rededor/cura 0.5.0 → 0.5.2

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 (221) hide show
  1. package/dist/cjs/{app-globals-0e3b7fc6.js → app-globals-2988084b.js} +5 -5
  2. package/dist/cjs/app-globals-2988084b.js.map +1 -0
  3. package/dist/cjs/cura-accordion_8.cjs.entry.js +452 -0
  4. package/dist/cjs/cura-accordion_8.cjs.entry.js.map +1 -0
  5. package/dist/cjs/cura-button-outline.cjs.entry.js +83 -0
  6. package/dist/cjs/cura-button-outline.cjs.entry.js.map +1 -0
  7. package/dist/cjs/cura-button-transparent.cjs.entry.js +83 -0
  8. package/dist/cjs/cura-button-transparent.cjs.entry.js.map +1 -0
  9. package/dist/cjs/cura-display.cjs.entry.js +74 -0
  10. package/dist/cjs/cura-display.cjs.entry.js.map +1 -0
  11. package/dist/cjs/cura-icons-view.cjs.entry.js +29 -0
  12. package/dist/cjs/cura-icons-view.cjs.entry.js.map +1 -0
  13. package/dist/cjs/cura-label.cjs.entry.js +69 -0
  14. package/dist/cjs/cura-label.cjs.entry.js.map +1 -0
  15. package/dist/cjs/cura.cjs.js +3 -3
  16. package/dist/cjs/{index-72217b50.js → index-404d93e9.js} +247 -3
  17. package/dist/cjs/index-404d93e9.js.map +1 -0
  18. package/dist/cjs/index.cjs.js +7 -0
  19. package/dist/cjs/index.cjs.js.map +1 -1
  20. package/dist/cjs/loader.cjs.js +3 -3
  21. package/dist/collection/api/cura-api.type.js.map +1 -1
  22. package/dist/collection/api/modules/cura-theme-breakpoints-module.js +1 -1
  23. package/dist/collection/api/modules/cura-theme-breakpoints-module.js.map +1 -1
  24. package/dist/collection/api/modules/cura-theme-colors-module.js +1 -1
  25. package/dist/collection/api/modules/cura-theme-colors-module.js.map +1 -1
  26. package/dist/collection/api/theme-presets/static.js +2 -2
  27. package/dist/collection/api/theme-presets/static.js.map +1 -1
  28. package/dist/collection/collection-manifest.json +1 -0
  29. package/dist/collection/components/accordion/cura-accordion/cura-accordion.stories.js +1 -1
  30. package/dist/collection/components/accordion/cura-accordion/cura-accordion.stories.js.map +1 -1
  31. package/dist/collection/components/accordion/cura-accordion-item/cura-accordion-item.css +10 -6
  32. package/dist/collection/components/buttons/cura-button/cura-button.js +4 -3
  33. package/dist/collection/components/buttons/cura-button/cura-button.js.map +1 -1
  34. package/dist/collection/components/buttons/cura-button/cura-button.stories.js +1 -1
  35. package/dist/collection/components/buttons/cura-button/cura-button.stories.js.map +1 -1
  36. package/dist/collection/components/buttons/cura-button-outline/cura-button-outline.js +4 -3
  37. package/dist/collection/components/buttons/cura-button-outline/cura-button-outline.js.map +1 -1
  38. package/dist/collection/components/buttons/cura-button-outline/cura-button-outline.stories.js +1 -1
  39. package/dist/collection/components/buttons/cura-button-outline/cura-button-outline.stories.js.map +1 -1
  40. package/dist/collection/components/buttons/cura-button-transparent/cura-button-transparent.js +4 -3
  41. package/dist/collection/components/buttons/cura-button-transparent/cura-button-transparent.js.map +1 -1
  42. package/dist/collection/components/buttons/cura-button-transparent/cura-button-transparent.stories.js +1 -1
  43. package/dist/collection/components/buttons/cura-button-transparent/cura-button-transparent.stories.js.map +1 -1
  44. package/dist/collection/components/cura-icon/cura-icon.stories.js +1 -1
  45. package/dist/collection/components/cura-icon/cura-icon.stories.js.map +1 -1
  46. package/dist/collection/components/cura-icons-view/cura-icons-view.stories.js +1 -1
  47. package/dist/collection/components/cura-icons-view/cura-icons-view.stories.js.map +1 -1
  48. package/dist/collection/components/cura-page-template/cura-page-template.css +13 -9
  49. package/dist/collection/components/forms/cura-label/cura-label.css +70 -0
  50. package/dist/collection/components/forms/cura-label/cura-label.js +190 -0
  51. package/dist/collection/components/forms/cura-label/cura-label.js.map +1 -0
  52. package/dist/collection/components/forms/cura-label/cura-label.stories.js +137 -0
  53. package/dist/collection/components/forms/cura-label/cura-label.stories.js.map +1 -0
  54. package/dist/collection/components/loaders/cura-loader-circle/cura-loader-circle.stories.js +1 -1
  55. package/dist/collection/components/loaders/cura-loader-circle/cura-loader-circle.stories.js.map +1 -1
  56. package/dist/collection/components/text/cura-display/cura-display.css +21 -38
  57. package/dist/collection/components/text/cura-display/cura-display.js +80 -49
  58. package/dist/collection/components/text/cura-display/cura-display.js.map +1 -1
  59. package/dist/collection/components/text/cura-display/cura-display.stories.js +79 -34
  60. package/dist/collection/components/text/cura-display/cura-display.stories.js.map +1 -1
  61. package/dist/collection/components/text/cura-heading/cura-heading.css +50 -24
  62. package/dist/collection/components/text/cura-heading/cura-heading.js +94 -39
  63. package/dist/collection/components/text/cura-heading/cura-heading.js.map +1 -1
  64. package/dist/collection/components/text/cura-heading/cura-heading.stories.js +93 -37
  65. package/dist/collection/components/text/cura-heading/cura-heading.stories.js.map +1 -1
  66. package/dist/collection/components/text/cura-paragraph/cura-paragraph.css +37 -38
  67. package/dist/collection/components/text/cura-paragraph/cura-paragraph.js +62 -41
  68. package/dist/collection/components/text/cura-paragraph/cura-paragraph.js.map +1 -1
  69. package/dist/collection/components/text/cura-paragraph/cura-paragraph.stories.js +79 -47
  70. package/dist/collection/components/text/cura-paragraph/cura-paragraph.stories.js.map +1 -1
  71. package/dist/collection/index.js +3 -1
  72. package/dist/collection/index.js.map +1 -1
  73. package/dist/components/cura-accordion-item.js +1 -1
  74. package/dist/components/cura-accordion-item.js.map +1 -1
  75. package/dist/components/cura-button-outline.js +1 -1
  76. package/dist/components/cura-button-outline.js.map +1 -1
  77. package/dist/components/cura-button-transparent.js +1 -1
  78. package/dist/components/cura-button-transparent.js.map +1 -1
  79. package/dist/components/cura-button.js +1 -1
  80. package/dist/components/cura-button.js.map +1 -1
  81. package/dist/components/cura-display.js +41 -35
  82. package/dist/components/cura-display.js.map +1 -1
  83. package/dist/components/cura-heading.js +34 -21
  84. package/dist/components/cura-heading.js.map +1 -1
  85. package/dist/components/cura-label.d.ts +11 -0
  86. package/dist/components/cura-label.js +91 -0
  87. package/dist/components/cura-label.js.map +1 -0
  88. package/dist/components/cura-page-template.js +1 -1
  89. package/dist/components/cura-page-template.js.map +1 -1
  90. package/dist/components/cura-paragraph.js +25 -23
  91. package/dist/components/cura-paragraph.js.map +1 -1
  92. package/dist/components/index.js +11 -5
  93. package/dist/components/index.js.map +1 -1
  94. package/dist/cura/cura.esm.js +1 -1
  95. package/dist/cura/cura.esm.js.map +1 -1
  96. package/dist/cura/cura.js +1 -1
  97. package/dist/cura/index.esm.js +1 -1
  98. package/dist/cura/index.esm.js.map +1 -1
  99. package/dist/cura/p-03047b3e.entry.js +2 -0
  100. package/dist/cura/p-03047b3e.entry.js.map +1 -0
  101. package/dist/cura/p-0c79c54e.entry.js +2 -0
  102. package/dist/cura/p-0c79c54e.entry.js.map +1 -0
  103. package/dist/cura/p-120926c5.system.js +2 -0
  104. package/dist/cura/p-120926c5.system.js.map +1 -0
  105. package/dist/cura/p-223924fb.system.entry.js +2 -0
  106. package/dist/cura/p-223924fb.system.entry.js.map +1 -0
  107. package/dist/cura/p-46d20db3.js +3 -0
  108. package/dist/cura/p-46d20db3.js.map +1 -0
  109. package/dist/cura/p-48426f60.system.js +2 -0
  110. package/dist/cura/p-48426f60.system.js.map +1 -0
  111. package/dist/cura/p-49813052.entry.js +2 -0
  112. package/dist/cura/p-49813052.entry.js.map +1 -0
  113. package/dist/cura/p-4bdbcdf0.system.entry.js +2 -0
  114. package/dist/cura/p-4bdbcdf0.system.entry.js.map +1 -0
  115. package/dist/cura/p-7c8f3c77.system.entry.js +2 -0
  116. package/dist/cura/p-7c8f3c77.system.entry.js.map +1 -0
  117. package/dist/cura/p-8b18b5f7.system.js +2 -0
  118. package/dist/cura/p-8b18b5f7.system.js.map +1 -0
  119. package/dist/cura/p-91b0f78e.entry.js +2 -0
  120. package/dist/cura/p-91b0f78e.entry.js.map +1 -0
  121. package/dist/cura/p-a0395f90.entry.js +2 -0
  122. package/dist/cura/p-a0395f90.entry.js.map +1 -0
  123. package/dist/cura/p-a7ef255f.entry.js +2 -0
  124. package/dist/cura/p-a7ef255f.entry.js.map +1 -0
  125. package/dist/cura/p-c0c00396.system.js +3 -0
  126. package/dist/cura/p-c0c00396.system.js.map +1 -0
  127. package/dist/cura/p-ca054b07.system.entry.js +2 -0
  128. package/dist/cura/p-ca054b07.system.entry.js.map +1 -0
  129. package/dist/cura/p-d47b9cfe.system.entry.js +2 -0
  130. package/dist/cura/p-d47b9cfe.system.entry.js.map +1 -0
  131. package/dist/cura/p-f8fffdc1.js +2 -0
  132. package/dist/cura/p-f8fffdc1.js.map +1 -0
  133. package/dist/cura/p-fc77814b.system.entry.js +2 -0
  134. package/dist/cura/p-fc77814b.system.entry.js.map +1 -0
  135. package/dist/esm/{app-globals-cc003eaf.js → app-globals-29001758.js} +5 -5
  136. package/dist/esm/app-globals-29001758.js.map +1 -0
  137. package/dist/esm/cura-accordion_8.entry.js +441 -0
  138. package/dist/esm/cura-accordion_8.entry.js.map +1 -0
  139. package/dist/esm/cura-button-outline.entry.js +79 -0
  140. package/dist/esm/cura-button-outline.entry.js.map +1 -0
  141. package/dist/esm/cura-button-transparent.entry.js +79 -0
  142. package/dist/esm/cura-button-transparent.entry.js.map +1 -0
  143. package/dist/esm/cura-display.entry.js +70 -0
  144. package/dist/esm/cura-display.entry.js.map +1 -0
  145. package/dist/esm/cura-icons-view.entry.js +25 -0
  146. package/dist/esm/cura-icons-view.entry.js.map +1 -0
  147. package/dist/esm/cura-label.entry.js +65 -0
  148. package/dist/esm/cura-label.entry.js.map +1 -0
  149. package/dist/esm/cura.js +4 -4
  150. package/dist/esm/{index-9af0cdbd.js → index-d99da69e.js} +247 -3
  151. package/dist/esm/index-d99da69e.js.map +1 -0
  152. package/dist/esm/index.js +4 -0
  153. package/dist/esm/index.js.map +1 -1
  154. package/dist/esm/loader.js +4 -4
  155. package/dist/esm-es5/app-globals-29001758.js +2 -0
  156. package/dist/esm-es5/app-globals-29001758.js.map +1 -0
  157. package/dist/esm-es5/cura-accordion_8.entry.js +2 -0
  158. package/dist/esm-es5/cura-accordion_8.entry.js.map +1 -0
  159. package/dist/esm-es5/cura-button-outline.entry.js +2 -0
  160. package/dist/esm-es5/cura-button-outline.entry.js.map +1 -0
  161. package/dist/esm-es5/cura-button-transparent.entry.js +2 -0
  162. package/dist/esm-es5/cura-button-transparent.entry.js.map +1 -0
  163. package/dist/esm-es5/cura-display.entry.js +2 -0
  164. package/dist/esm-es5/cura-display.entry.js.map +1 -0
  165. package/dist/esm-es5/cura-icons-view.entry.js +2 -0
  166. package/dist/esm-es5/cura-icons-view.entry.js.map +1 -0
  167. package/dist/esm-es5/cura-label.entry.js +2 -0
  168. package/dist/esm-es5/cura-label.entry.js.map +1 -0
  169. package/dist/esm-es5/cura.js +1 -1
  170. package/dist/esm-es5/cura.js.map +1 -1
  171. package/dist/esm-es5/index-d99da69e.js +3 -0
  172. package/dist/esm-es5/index-d99da69e.js.map +1 -0
  173. package/dist/esm-es5/index.js +1 -1
  174. package/dist/esm-es5/index.js.map +1 -1
  175. package/dist/esm-es5/loader.js +1 -1
  176. package/dist/esm-es5/loader.js.map +1 -1
  177. package/dist/types/api/cura-api.type.d.ts +1 -0
  178. package/dist/types/components/buttons/cura-button/cura-button.d.ts +1 -1
  179. package/dist/types/components/buttons/cura-button-outline/cura-button-outline.d.ts +1 -1
  180. package/dist/types/components/buttons/cura-button-transparent/cura-button-transparent.d.ts +1 -1
  181. package/dist/types/components/forms/cura-label/cura-label.d.ts +54 -0
  182. package/dist/types/components/forms/cura-label/cura-label.stories.d.ts +126 -0
  183. package/dist/types/components/text/cura-display/cura-display.d.ts +29 -18
  184. package/dist/types/components/text/cura-display/cura-display.stories.d.ts +52 -14
  185. package/dist/types/components/text/cura-heading/cura-heading.d.ts +34 -17
  186. package/dist/types/components/text/cura-heading/cura-heading.stories.d.ts +58 -6
  187. package/dist/types/components/text/cura-paragraph/cura-paragraph.d.ts +24 -12
  188. package/dist/types/components/text/cura-paragraph/cura-paragraph.stories.d.ts +47 -9
  189. package/dist/types/components.d.ts +145 -52
  190. package/dist/types/index.d.ts +9 -0
  191. package/package.json +2 -4
  192. package/dist/cjs/app-globals-0e3b7fc6.js.map +0 -1
  193. package/dist/cjs/cura-accordion_12.cjs.entry.js +0 -674
  194. package/dist/cjs/cura-accordion_12.cjs.entry.js.map +0 -1
  195. package/dist/cjs/index-72217b50.js.map +0 -1
  196. package/dist/cura/p-2cbf52f1.js +0 -3
  197. package/dist/cura/p-2cbf52f1.js.map +0 -1
  198. package/dist/cura/p-4cdbc8a1.system.entry.js +0 -2
  199. package/dist/cura/p-4cdbc8a1.system.entry.js.map +0 -1
  200. package/dist/cura/p-50ea2036.system.js +0 -2
  201. package/dist/cura/p-50ea2036.system.js.map +0 -1
  202. package/dist/cura/p-788e035b.system.js +0 -2
  203. package/dist/cura/p-788e035b.system.js.map +0 -1
  204. package/dist/cura/p-8da635b7.system.js +0 -3
  205. package/dist/cura/p-8da635b7.system.js.map +0 -1
  206. package/dist/cura/p-c54ce246.entry.js +0 -2
  207. package/dist/cura/p-c54ce246.entry.js.map +0 -1
  208. package/dist/cura/p-d5c64a5f.js +0 -2
  209. package/dist/cura/p-d5c64a5f.js.map +0 -1
  210. package/dist/cura/p-f4232daa.system.js +0 -2
  211. package/dist/cura/p-f4232daa.system.js.map +0 -1
  212. package/dist/esm/app-globals-cc003eaf.js.map +0 -1
  213. package/dist/esm/cura-accordion_12.entry.js +0 -659
  214. package/dist/esm/cura-accordion_12.entry.js.map +0 -1
  215. package/dist/esm/index-9af0cdbd.js.map +0 -1
  216. package/dist/esm-es5/app-globals-cc003eaf.js +0 -2
  217. package/dist/esm-es5/app-globals-cc003eaf.js.map +0 -1
  218. package/dist/esm-es5/cura-accordion_12.entry.js +0 -2
  219. package/dist/esm-es5/cura-accordion_12.entry.js.map +0 -1
  220. package/dist/esm-es5/index-9af0cdbd.js +0 -3
  221. package/dist/esm-es5/index-9af0cdbd.js.map +0 -1
@@ -1,659 +0,0 @@
1
- import { r as registerInstance, h, H as Host, g as getElement } from './index-9af0cdbd.js';
2
-
3
- const curaAccordionCss = ":host{display:block;color:var(--font-color);font-size:var(--font-size);font-size:var(--font-size);font-family:var(--font-family);font-weight:var(--font-weight-regular)}:host::after{content:\"\";display:block;border-bottom:solid 1px var(--neutral-base);width:100%}";
4
-
5
- const CuraAccordion = class {
6
- constructor(hostRef) {
7
- registerInstance(this, hostRef);
8
- this.mutationObserverCallback = (mutations, _) => {
9
- var _a;
10
- for (const mutation of mutations) {
11
- if (mutation.type === 'attributes' && mutation.attributeName === 'opened' && ((_a = mutation.target) === null || _a === void 0 ? void 0 : _a['opened'])) {
12
- if (this.behavior !== 'default')
13
- continue;
14
- this.host.querySelectorAll('cura-accordion-item').forEach(item => {
15
- if (item != mutation.target) {
16
- item.opened = false;
17
- }
18
- });
19
- }
20
- if (mutation.type === 'childList') {
21
- const addedNodes = Array.from(mutation.addedNodes || []);
22
- for (let node of addedNodes) {
23
- this.setChildProperties(node);
24
- }
25
- }
26
- }
27
- };
28
- this.mutationObserver = new MutationObserver(this.mutationObserverCallback);
29
- this.color = 'primary';
30
- this.activeColor = 'accent';
31
- this.colorMode = 'dark';
32
- this.iconSize = 32;
33
- this.openIcon = 'down';
34
- this.closeIcon = 'up';
35
- this.iconColor = '';
36
- this.iconActiveColor = '';
37
- this.behavior = 'default';
38
- this.styles = {};
39
- }
40
- handleChangeColor() {
41
- this.setColors();
42
- }
43
- connectedCallback() {
44
- const weights = window.CuraAPI.theme.fonts.getWeights();
45
- this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();
46
- this.styles['--neutral-purewhite'] = window.CuraAPI.theme.colors.getColor(`neutral-purewhite`);
47
- this.styles['--neutral-lighter'] = window.CuraAPI.theme.colors.getColor(`neutral-lighter`);
48
- this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);
49
- this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();
50
- this.styles['--font-color'] = window.CuraAPI.theme.fonts.getColor();
51
- this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();
52
- this.styles['--font-weight-regular'] = weights.regular;
53
- this.setColors();
54
- }
55
- componentDidLoad() {
56
- this.host.querySelectorAll('cura-accordion-item').forEach(item => {
57
- this.setChildProperties(item);
58
- });
59
- const options = { childList: true, subtree: true, attributes: true };
60
- this.mutationObserver.observe(this.host, options);
61
- }
62
- disconnectedCallback() {
63
- this.mutationObserver.disconnect();
64
- }
65
- setChildProperties(item) {
66
- // Theme
67
- item.colorMode = this.colorMode;
68
- item.iconColor = this.iconColor || this.color;
69
- item.iconActiveColor = this.iconActiveColor || this.activeColor;
70
- // Icon
71
- item.iconSize = this.iconSize;
72
- item.openIcon = this.openIcon;
73
- item.closeIcon = this.closeIcon;
74
- }
75
- setColors() {
76
- this.styles = Object.assign(Object.assign({}, this.styles), { '--color-lighter': window.CuraAPI.theme.colors.getColor(`${this.color}-lighter`), '--color-light': window.CuraAPI.theme.colors.getColor(`${this.color}-light`), '--color-base': window.CuraAPI.theme.colors.getColor(`${this.color}-base`), '--color-dark': window.CuraAPI.theme.colors.getColor(`${this.color}-dark`), '--color-active-lighter': window.CuraAPI.theme.colors.getColor(`${this.activeColor}-lighter`), '--color-active-light': window.CuraAPI.theme.colors.getColor(`${this.activeColor}-light`), '--color-active-base': window.CuraAPI.theme.colors.getColor(`${this.activeColor}-base`), '--color-active-dark': window.CuraAPI.theme.colors.getColor(`${this.activeColor}-dark`), '--icon-color-lighter': window.CuraAPI.theme.colors.getColor(`${this.iconColor || this.color}-lighter`), '--icon-color-light': window.CuraAPI.theme.colors.getColor(`${this.iconColor || this.color}-light`), '--icon-color-base': window.CuraAPI.theme.colors.getColor(`${this.iconColor || this.color}-base`), '--icon-color-dark': window.CuraAPI.theme.colors.getColor(`${this.iconColor || this.color}-dark`), '--icon-color-active-lighter': window.CuraAPI.theme.colors.getColor(`${this.iconActiveColor || this.activeColor}-lighter`), '--icon-color-active-light': window.CuraAPI.theme.colors.getColor(`${this.iconActiveColor || this.activeColor}-light`), '--icon-color-active-base': window.CuraAPI.theme.colors.getColor(`${this.iconActiveColor || this.activeColor}-base`), '--icon-color-active-dark': window.CuraAPI.theme.colors.getColor(`${this.iconActiveColor || this.activeColor}-dark`) });
77
- }
78
- render() {
79
- return (h(Host, { style: this.styles }, h("slot", { name: 'accordion-item' })));
80
- }
81
- get host() { return getElement(this); }
82
- static get watchers() { return {
83
- "color": ["handleChangeColor"],
84
- "activeColor": ["handleChangeColor"]
85
- }; }
86
- };
87
- CuraAccordion.style = curaAccordionCss;
88
-
89
- const curaAccordionItemCss = ":host{display:block}:host .accordion-item{width:100%}:host .accordion-item .label{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .accordion-item .label::before{content:\"\";display:block;border-top:solid 1px var(--neutral-base);width:100%}:host .accordion-item .label .label-container{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;gap:calc(var(--base-spacing) * 2px);min-height:40px;word-break:break-word;cursor:pointer;font-size:1.14em;font-weight:var(--font-weight-regular);color:var(--color-base);padding:0px}:host .accordion-item .label .label-container cura-icon{margin-right:4px}:host .accordion-item .label .label-container:hover{color:var(--color-light)}:host .accordion-item .label .label-container:hover cura-icon{--color:var(--icon-color-light) !important}:host .accordion-item .label .label-container:active{color:var(--color-dark)}:host .accordion-item .label .label-container:active cura-icon{--color:var(--icon-color-dark) !important}:host .accordion-item .content{font-size:1em;overflow:hidden;max-height:0;-webkit-transition:max-height 0.25s ease;transition:max-height 0.25s ease}:host .accordion-item .content .content-wrapper{padding:calc(var(--base-spacing) * 2px) 0px;border-top:solid 1px var(--neutral-base)}:host .accordion-item.active .label .label-container{color:var(--color-active-base)}:host .accordion-item.active .label .label-container:hover{color:var(--color-active-light)}:host .accordion-item.active .label .label-container:hover cura-icon{--color:var(--icon-color-active-light) !important}:host .accordion-item.active .label .label-container:active{color:var(--color-active-dark)}:host .accordion-item.active .label .label-container:active cura-icon{--color:var(--icon-color-active-dark) !important}:host .accordion-item.active .content{max-height:200vh;overflow-y:auto;-webkit-transition:max-height 0.5s ease 0.14s;transition:max-height 0.5s ease 0.14s}:host .accordion-item.inverted .label .label-container{color:var(--neutral-lighter)}:host .accordion-item.inverted .label .label-container:hover{color:var(--color-lighter)}:host .accordion-item.inverted .label .label-container:hover cura-icon{--color:var(--icon-color-lighter) !important}:host .accordion-item.inverted .label .label-container:active{color:var(--color-light)}:host .accordion-item.inverted .label .label-container:active cura-icon{--color:var(--icon-color-light) !important}:host .accordion-item.active.inverted .label .label-container{color:var(--neutral-purewhite)}:host .accordion-item.active.inverted .label .label-container:hover{color:var(--color-active-lighter)}:host .accordion-item.active.inverted .label .label-container:hover cura-icon{--color:var(--icon-color-active-lighter) !important}:host .accordion-item.active.inverted .label .label-container:active{color:var(--color-active-light)}:host .accordion-item.active.inverted .label .label-container:active cura-icon{--color:var(--icon-color-active-light) !important}@media (min-width: 768px) and (max-width: 1365px){:host .accordion-item .label .label-container{font-size:1.29em}:host .accordion-item .content{font-size:1.14em}}@media (min-width: 1366px){:host .accordion-item .label .label-container{font-size:1.29em}:host .accordion-item .content{font-size:1.14em}}";
90
-
91
- const CuraAccordionItem = class {
92
- constructor(hostRef) {
93
- registerInstance(this, hostRef);
94
- this.label = '';
95
- this.iconSize = 32;
96
- this.openIcon = 'down';
97
- this.closeIcon = 'up';
98
- this.iconColor = '';
99
- this.iconActiveColor = '';
100
- this.colorMode = 'dark';
101
- this.opened = false;
102
- this.styles = {};
103
- }
104
- getIconColor() {
105
- const inverted = this.colorMode === 'light';
106
- const iconColor = inverted ? 'neutral-lighter' : `${this.iconColor}-base`;
107
- const iconActiveColor = inverted ? 'neutral-purewhite' : `${this.iconActiveColor}-base`;
108
- return this.opened ? iconActiveColor : iconColor;
109
- }
110
- getClasses() {
111
- const classes = {};
112
- classes['accordion-item'] = true;
113
- classes['active'] = this.opened;
114
- classes['inverted'] = this.colorMode === 'light';
115
- return classes;
116
- }
117
- accordionItemClick(_) {
118
- this.opened = !this.opened;
119
- }
120
- render() {
121
- return (h(Host, { slot: "accordion-item" }, h("div", { class: this.getClasses(), style: this.styles }, h("div", { class: "label", onClick: e => this.accordionItemClick(e) }, h("div", { class: "label-container" }, h("span", null, this.label), h("cura-icon", { name: this.opened ? this.closeIcon : this.openIcon, size: this.iconSize, color: this.getIconColor() }))), h("div", { class: 'content' }, h("div", { class: "content-wrapper" }, h("slot", null))))));
122
- }
123
- };
124
- CuraAccordionItem.style = curaAccordionItemCss;
125
-
126
- const curaButtonCss = ":host{--border-radius:4px;display:inline-block;vertical-align:middle}:host button,:host a{outline:none;-webkit-box-shadow:none;box-shadow:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;width:100%;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;text-decoration:none !important;font-size:var(--font-size);cursor:pointer;-webkit-transition:background-color 0.07s linear, border-color 0.07s linear, -webkit-box-shadow 0.07s linear;transition:background-color 0.07s linear, border-color 0.07s linear, -webkit-box-shadow 0.07s linear;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear, -webkit-box-shadow 0.07s linear;border-radius:var(--border-radius);background-color:var(--color-base);border:none;padding:calc(var(--base-spacing) * 3.5px) calc(var(--base-spacing) * 4px);min-height:calc(var(--base-spacing) * 13px);min-width:calc(var(--base-spacing) * 13px)}:host button:not(.isLoading):not(.disabled):hover,:host a:not(.isLoading):not(.disabled):hover{background-color:var(--color-light)}:host button:not(.isLoading):not(.disabled):active,:host a:not(.isLoading):not(.disabled):active{background-color:var(--color-dark)}:host button:hover,:host a:hover{-webkit-box-shadow:0 4px 8px 0 rgba(38, 38, 38, 0.16);box-shadow:0 4px 8px 0 rgba(38, 38, 38, 0.16)}:host button.medium:hover,:host a.medium:hover{-webkit-box-shadow:0 3px 6px 0 rgba(38, 38, 38, 0.16);box-shadow:0 3px 6px 0 rgba(38, 38, 38, 0.16)}:host button.small:hover,:host a.small:hover{-webkit-box-shadow:0 2px 5px 0 rgba(38, 38, 38, 0.16);box-shadow:0 2px 5px 0 rgba(38, 38, 38, 0.16)}:host button:active,:host button.disabled:hover,:host button.isLoading:hover,:host a:active,:host a.disabled:hover,:host a.isLoading:hover{-webkit-box-shadow:none !important;box-shadow:none !important}:host button.medium,:host a.medium{padding:calc(var(--base-spacing) * 2.75px) calc(var(--base-spacing) * 4px);min-height:calc(var(--base-spacing) * 11px);min-width:calc(var(--base-spacing) * 11px)}:host button.small,:host a.small{padding:calc(var(--base-spacing) * 1.5px) calc(var(--base-spacing) * 3px);min-height:calc(var(--base-spacing) * 8px);min-width:calc(var(--base-spacing) * 8px)}:host button .button-container,:host a .button-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;opacity:1;-webkit-transition:opacity 0.2s linear;transition:opacity 0.2s linear}:host button.icon-right .button-container,:host a.icon-right .button-container{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host button .label,:host a .label{-ms-flex:1;flex:1;font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:1.43em;line-height:1.2em;text-align:var(--text-align, \"left\");color:var(--neutral-black)}:host button .label.inverted,:host a .label.inverted{color:var(--neutral-white)}:host button.medium .label,:host a.medium .label{font-size:1.14em}:host button.small .label,:host a.small .label{font-size:1em}:host button.icon-left cura-icon,:host a.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 3px)}:host button.icon-right cura-icon,:host a.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 3px)}:host button.medium.icon-left cura-icon,:host a.medium.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 2.7px)}:host button.medium.icon-right cura-icon,:host a.medium.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 2.7px)}:host button.small.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 2.5px)}:host button.small.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 2.5px)}:host button.disabled,:host a.disabled{cursor:not-allowed;background-color:var(--neutral-light)}:host button.disabled .label,:host button.disabled .label.inverted,:host a.disabled .label,:host a.disabled .label.inverted{color:var(--neutral-dark)}:host button.icon-only,:host a.icon-only{padding:calc(var(--base-spacing) * 3.5px)}:host button.icon-only .label,:host a.icon-only .label{display:none}:host button.icon-only cura-icon,:host a.icon-only cura-icon{margin-left:0 !important;margin-right:0 !important}:host button.icon-only.medium,:host a.icon-only.medium{padding:calc(var(--base-spacing) * 2.75px)}:host button.icon-only.small,:host a.icon-only.small{padding:calc(var(--base-spacing) * 1.5px)}:host button cura-loader-circle,:host a cura-loader-circle{position:absolute;display:none}:host button.isLoading,:host a.isLoading{cursor:wait}:host button.isLoading .button-container,:host a.isLoading .button-container{opacity:0.3}:host button.isLoading.icon-only .button-container,:host a.isLoading.icon-only .button-container{opacity:0}:host button.isLoading cura-loader-circle,:host a.isLoading cura-loader-circle{display:block}";
127
-
128
- const CuraButton = class {
129
- constructor(hostRef) {
130
- registerInstance(this, hostRef);
131
- this.size = 'medium';
132
- this.disabled = false;
133
- this.isLoading = false;
134
- this.iconName = undefined;
135
- this.iconset = 'default';
136
- this.iconPosition = 'left';
137
- this.iconOnly = undefined;
138
- this.href = undefined;
139
- this.target = "_self";
140
- this.color = 'accent';
141
- this.fontColor = 'dark';
142
- this.textAlign = 'left';
143
- this.styles = {};
144
- }
145
- handleChangeColor() {
146
- this.setColors();
147
- }
148
- connectedCallback() {
149
- this.weights = window.CuraAPI.theme.fonts.getWeights();
150
- this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();
151
- this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);
152
- this.styles['--neutral-light'] = window.CuraAPI.theme.colors.getColor(`neutral-light`);
153
- this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);
154
- this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();
155
- this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();
156
- this.styles['--font-weight-medium'] = this.weights.medium;
157
- this.styles['--text-align'] = this.textAlign;
158
- this.setColors();
159
- }
160
- getClasses() {
161
- const classes = {};
162
- classes[`${this.size.toLowerCase()}`] = true;
163
- classes[`icon-${this.iconPosition.toLowerCase()}`] = true;
164
- classes[`icon-only`] = this.iconOnly;
165
- classes['inverted'] = this.fontColor === 'light';
166
- classes['disabled'] = this.disabled;
167
- classes['isLoading'] = this.isLoading;
168
- return classes;
169
- }
170
- setColors() {
171
- this.styles = Object.assign(Object.assign({}, this.styles), { '--color-light': window.CuraAPI.theme.colors.getColor(`${this.color}-light`), '--color-base': window.CuraAPI.theme.colors.getColor(`${this.color}-base`), '--color-dark': window.CuraAPI.theme.colors.getColor(`${this.color}-dark`) });
172
- }
173
- getIcon() {
174
- if (!this.iconName)
175
- return '';
176
- const iconSize = this.size === 'small' ? 16 : this.size === 'medium' ? 20 : 24;
177
- const color = this.getSymbolColor();
178
- return h("cura-icon", { name: this.iconName, iconset: this.iconset, size: iconSize, color: color });
179
- }
180
- getSymbolColor() {
181
- return this.disabled
182
- ? 'neutral-dark'
183
- : this.fontColor === 'light'
184
- ? 'neutral-white'
185
- : 'neutral-black';
186
- }
187
- handleClick(e) {
188
- if (this.disabled || this.isLoading)
189
- e.preventDefault();
190
- }
191
- render() {
192
- return (h(Host, null, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e) }, h("span", { class: "button-container" }, this.getIcon(), h("span", { class: { label: true, inverted: this.fontColor === 'light' } }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: this.getSymbolColor() }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e) }, h("span", { class: "button-container" }, this.getIcon(), h("span", { class: { label: true, inverted: this.fontColor === 'light' } }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: this.getSymbolColor() })))));
193
- }
194
- static get watchers() { return {
195
- "color": ["handleChangeColor"]
196
- }; }
197
- };
198
- CuraButton.style = curaButtonCss;
199
-
200
- const curaButtonOutlineCss = ":host{--border-radius:4px;display:inline-block;vertical-align:middle}:host button,:host a{outline:none;-webkit-box-shadow:none;box-shadow:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;width:100%;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;text-decoration:none !important;font-size:var(--font-size);cursor:pointer;-webkit-transition:background-color 0.07s linear, border-color 0.07s linear, -webkit-box-shadow 0.07s linear;transition:background-color 0.07s linear, border-color 0.07s linear, -webkit-box-shadow 0.07s linear;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear, -webkit-box-shadow 0.07s linear;border-radius:var(--border-radius);background-color:transparent;border:none;-webkit-box-shadow:inset 0px 0px 0px 2px var(--color-base);box-shadow:inset 0px 0px 0px 2px var(--color-base);padding:calc(var(--base-spacing) * 3.5px) calc(var(--base-spacing) * 4px);min-height:calc(var(--base-spacing) * 13px);min-width:calc(var(--base-spacing) * 13px)}:host button:not(.disabled):not(.isLoading):hover,:host a:not(.disabled):not(.isLoading):hover{-webkit-box-shadow:inset 0px 0px 0px 2px var(--color-light);box-shadow:inset 0px 0px 0px 2px var(--color-light)}:host button:not(.disabled):not(.isLoading):hover .label,:host a:not(.disabled):not(.isLoading):hover .label{color:var(--color-light)}:host button:not(.disabled):not(.isLoading):hover cura-icon,:host a:not(.disabled):not(.isLoading):hover cura-icon{--color:var(--color-light) !important}:host button:not(.disabled):not(.inverted):not(.isLoading):active,:host a:not(.disabled):not(.inverted):not(.isLoading):active{-webkit-box-shadow:inset 0px 0px 0px 2px var(--color-dark);box-shadow:inset 0px 0px 0px 2px var(--color-dark)}:host button:not(.disabled):not(.inverted):not(.isLoading):active .label,:host a:not(.disabled):not(.inverted):not(.isLoading):active .label{color:var(--color-dark)}:host button:not(.disabled):not(.inverted):not(.isLoading):active cura-icon,:host a:not(.disabled):not(.inverted):not(.isLoading):active cura-icon{--color:var(--color-dark) !important}:host button.medium,:host a.medium{padding:calc(var(--base-spacing) * 2.75px) calc(var(--base-spacing) * 4px);min-height:calc(var(--base-spacing) * 11px);min-width:calc(var(--base-spacing) * 11px)}:host button.small,:host a.small{padding:calc(var(--base-spacing) * 1.5px) calc(var(--base-spacing) * 3px);min-height:calc(var(--base-spacing) * 8px);min-width:calc(var(--base-spacing) * 8px)}:host button .button-container,:host a .button-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;opacity:1;-webkit-transition:opacity 0.2s linear;transition:opacity 0.2s linear}:host button.icon-right .button-container,:host a.icon-right .button-container{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host button .label,:host a .label{-ms-flex:1;flex:1;font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:1.43em;line-height:1.2em;text-align:var(--text-align, \"left\");color:var(--color-base)}:host button .label.inverted,:host a .label.inverted{color:var(--neutral-white)}:host button.medium .label,:host a.medium .label{font-size:1.14em}:host button.small .label,:host a.small .label{font-size:1em}:host button.icon-left cura-icon,:host a.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 3px)}:host button.icon-right cura-icon,:host a.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 3px)}:host button.medium.icon-left cura-icon,:host a.medium.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 2.7px)}:host button.medium.icon-right cura-icon,:host a.medium.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 2.7px)}:host button.small.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 2.5px)}:host button.small.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 2.5px)}:host button.disabled,:host a.disabled{cursor:not-allowed;-webkit-box-shadow:inset 0px 0px 0px 2px var(--neutral-base);box-shadow:inset 0px 0px 0px 2px var(--neutral-base)}:host button.disabled .label,:host button.disabled .label.inverted,:host a.disabled .label,:host a.disabled .label.inverted{color:var(--neutral-dark)}:host button.disabled.inverted,:host a.disabled.inverted{opacity:0.6;-webkit-box-shadow:inset 0px 0px 0px 2px var(--neutral-white);box-shadow:inset 0px 0px 0px 2px var(--neutral-white)}:host button.disabled.inverted .label,:host button.disabled.inverted .label.inverted,:host a.disabled.inverted .label,:host a.disabled.inverted .label.inverted{color:var(--neutral-white)}:host button.disabled.inverted cura-icon,:host a.disabled.inverted cura-icon{--color:var(--neutral-white) !important}:host button.disabled.inverted cura-loader-circle,:host a.disabled.inverted cura-loader-circle{--color:var(--neutral-white) !important}:host button.icon-only,:host a.icon-only{padding:calc(var(--base-spacing) * 3.5px)}:host button.icon-only .label,:host a.icon-only .label{display:none}:host button.icon-only cura-icon,:host a.icon-only cura-icon{margin-left:0 !important;margin-right:0 !important}:host button.icon-only.medium,:host a.icon-only.medium{padding:calc(var(--base-spacing) * 2.75px)}:host button.icon-only.small,:host a.icon-only.small{padding:calc(var(--base-spacing) * 1.5px)}:host button.inverted,:host a.inverted{-webkit-box-shadow:inset 0px 0px 0px 2px var(--neutral-white);box-shadow:inset 0px 0px 0px 2px var(--neutral-white)}:host button.inverted:not(.disabled):not(.isLoading):hover,:host a.inverted:not(.disabled):not(.isLoading):hover{-webkit-box-shadow:inset 0px 0px 0px 2px var(--color-lighter);box-shadow:inset 0px 0px 0px 2px var(--color-lighter)}:host button.inverted:not(.disabled):not(.isLoading):hover .label,:host a.inverted:not(.disabled):not(.isLoading):hover .label{color:var(--color-lighter)}:host button.inverted:not(.disabled):not(.isLoading):hover cura-icon,:host a.inverted:not(.disabled):not(.isLoading):hover cura-icon{--color:var(--color-lighter) !important}:host button.inverted:not(.disabled):not(.isLoading):active,:host a.inverted:not(.disabled):not(.isLoading):active{-webkit-box-shadow:inset 0px 0px 0px 2px var(--color-light);box-shadow:inset 0px 0px 0px 2px var(--color-light)}:host button.inverted:not(.disabled):not(.isLoading):active .label,:host a.inverted:not(.disabled):not(.isLoading):active .label{color:var(--color-light)}:host button.inverted:not(.disabled):not(.isLoading):active cura-icon,:host a.inverted:not(.disabled):not(.isLoading):active cura-icon{--color:var(--color-light) !important}:host button cura-loader-circle,:host a cura-loader-circle{position:absolute;display:none}:host button.isLoading,:host a.isLoading{cursor:wait}:host button.isLoading .button-container,:host a.isLoading .button-container{opacity:0.3}:host button.isLoading.icon-only .button-container,:host a.isLoading.icon-only .button-container{opacity:0}:host button.isLoading cura-loader-circle,:host a.isLoading cura-loader-circle{display:block}";
201
-
202
- const CuraButtonOutline = class {
203
- constructor(hostRef) {
204
- registerInstance(this, hostRef);
205
- this.size = 'large';
206
- this.disabled = false;
207
- this.isLoading = false;
208
- this.iconName = undefined;
209
- this.iconset = 'default';
210
- this.iconPosition = 'left';
211
- this.iconOnly = undefined;
212
- this.href = undefined;
213
- this.target = "_self";
214
- this.color = 'accent';
215
- this.fontColor = 'dark';
216
- this.textAlign = 'left';
217
- this.styles = {};
218
- }
219
- handleChangeColor() {
220
- this.setColors();
221
- }
222
- connectedCallback() {
223
- this.weights = window.CuraAPI.theme.fonts.getWeights();
224
- this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();
225
- this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);
226
- this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);
227
- this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);
228
- this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();
229
- this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();
230
- this.styles['--font-weight-medium'] = this.weights.medium;
231
- this.styles['--text-align'] = this.textAlign;
232
- this.setColors();
233
- }
234
- getClasses() {
235
- const classes = {};
236
- classes[`${this.size.toLowerCase()}`] = true;
237
- classes[`icon-${this.iconPosition.toLowerCase()}`] = true;
238
- classes[`icon-only`] = this.iconOnly;
239
- classes['inverted'] = this.fontColor === 'light';
240
- classes['disabled'] = this.disabled;
241
- classes['isLoading'] = this.isLoading;
242
- return classes;
243
- }
244
- setColors() {
245
- this.styles = Object.assign(Object.assign({}, this.styles), { '--color-lighter': window.CuraAPI.theme.colors.getColor(`${this.color}-lighter`), '--color-light': window.CuraAPI.theme.colors.getColor(`${this.color}-light`), '--color-base': window.CuraAPI.theme.colors.getColor(`${this.color}-base`), '--color-dark': window.CuraAPI.theme.colors.getColor(`${this.color}-dark`) });
246
- }
247
- getIcon() {
248
- if (!this.iconName)
249
- return '';
250
- const iconSize = this.size === 'small' ? 16 : this.size === 'medium' ? 20 : 24;
251
- const color = this.getSymbolColor();
252
- return h("cura-icon", { name: this.iconName, iconset: this.iconset, size: iconSize, color: color });
253
- }
254
- getSymbolColor() {
255
- return this.disabled
256
- ? 'neutral-dark'
257
- : this.fontColor === 'light'
258
- ? 'neutral-white'
259
- : `${this.color}-base`;
260
- }
261
- handleClick(e) {
262
- if (this.disabled || this.isLoading)
263
- e.preventDefault();
264
- }
265
- render() {
266
- return (h(Host, null, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e) }, h("span", { class: "button-container" }, this.getIcon(), h("span", { class: { label: true, inverted: this.fontColor === 'light' } }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: this.getSymbolColor() }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e) }, h("span", { class: "button-container" }, this.getIcon(), h("span", { class: { label: true, inverted: this.fontColor === 'light' } }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: this.getSymbolColor() })))));
267
- }
268
- static get watchers() { return {
269
- "color": ["handleChangeColor"]
270
- }; }
271
- };
272
- CuraButtonOutline.style = curaButtonOutlineCss;
273
-
274
- const curaButtonTransparentCss = ":host{--border-radius:4px;display:inline-block;vertical-align:middle}:host button,:host a{outline:none;-webkit-box-shadow:none;box-shadow:none;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;width:100%;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;text-decoration:none !important;font-size:var(--font-size);cursor:pointer;-webkit-transition:background-color 0.07s linear, border-color 0.07s linear, -webkit-box-shadow 0.07s linear;transition:background-color 0.07s linear, border-color 0.07s linear, -webkit-box-shadow 0.07s linear;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear;transition:background-color 0.07s linear, box-shadow 0.07s linear, border-color 0.07s linear, -webkit-box-shadow 0.07s linear;border-radius:var(--border-radius);background-color:transparent;border-width:0px;border-color:transparent;padding:calc(var(--base-spacing) * 3.5px) calc(var(--base-spacing) * 4px);min-height:calc(var(--base-spacing) * 13px);min-width:calc(var(--base-spacing) * 13px)}:host button:not(.disabled):not(.isLoading):hover .label,:host a:not(.disabled):not(.isLoading):hover .label{color:var(--color-light)}:host button:not(.disabled):not(.isLoading):hover cura-icon,:host a:not(.disabled):not(.isLoading):hover cura-icon{--color:var(--color-light) !important}:host button:not(.disabled):not(.inverted):not(.isLoading):active .label,:host a:not(.disabled):not(.inverted):not(.isLoading):active .label{color:var(--color-dark)}:host button:not(.disabled):not(.inverted):not(.isLoading):active cura-icon,:host a:not(.disabled):not(.inverted):not(.isLoading):active cura-icon{--color:var(--color-dark) !important}:host button.medium,:host a.medium{padding:calc(var(--base-spacing) * 2.75px) calc(var(--base-spacing) * 4px);min-height:calc(var(--base-spacing) * 11px);min-width:calc(var(--base-spacing) * 11px)}:host button.small,:host a.small{padding:calc(var(--base-spacing) * 1.5px) calc(var(--base-spacing) * 3px);min-height:calc(var(--base-spacing) * 8px);min-width:calc(var(--base-spacing) * 8px)}:host button .button-container,:host a .button-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;opacity:1;-webkit-transition:opacity 0.2s linear;transition:opacity 0.2s linear}:host button.icon-right .button-container,:host a.icon-right .button-container{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host button .label,:host a .label{-ms-flex:1;flex:1;font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:1.43em;line-height:1.2em;text-align:var(--text-align, \"left\");color:var(--color-base)}:host button .label.inverted,:host a .label.inverted{color:var(--neutral-white)}:host button.medium .label,:host a.medium .label{font-size:1.14em}:host button.small .label,:host a.small .label{font-size:1em}:host button.icon-left cura-icon,:host a.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 3px)}:host button.icon-right cura-icon,:host a.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 3px)}:host button.medium.icon-left cura-icon,:host a.medium.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 2.7px)}:host button.medium.icon-right cura-icon,:host a.medium.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 2.7px)}:host button.small.icon-left cura-icon,:host a.small.icon-left cura-icon{margin-right:calc(var(--base-spacing) * 2.5px)}:host button.small.icon-right cura-icon,:host a.small.icon-right cura-icon{margin-left:calc(var(--base-spacing) * 2.5px)}:host button.disabled,:host a.disabled{cursor:not-allowed;border-color:var(--neutral-base)}:host button.disabled .label,:host button.disabled .label.inverted,:host a.disabled .label,:host a.disabled .label.inverted{color:var(--neutral-dark)}:host button.disabled.inverted,:host a.disabled.inverted{opacity:0.6}:host button.disabled.inverted .label,:host button.disabled.inverted .label.inverted,:host a.disabled.inverted .label,:host a.disabled.inverted .label.inverted{color:var(--neutral-white)}:host button.disabled.inverted cura-icon,:host a.disabled.inverted cura-icon{--color:var(--neutral-white) !important}:host button.disabled.inverted cura-loader-circle,:host a.disabled.inverted cura-loader-circle{--color:var(--neutral-white) !important}:host button.icon-only,:host a.icon-only{padding:calc(var(--base-spacing) * 3.5px)}:host button.icon-only .label,:host a.icon-only .label{display:none}:host button.icon-only cura-icon,:host a.icon-only cura-icon{margin-left:0 !important;margin-right:0 !important}:host button.icon-only.medium,:host a.icon-only.medium{padding:calc(var(--base-spacing) * 2.75px)}:host button.icon-only.small,:host a.icon-only.small{padding:calc(var(--base-spacing) * 1.5px)}:host button.inverted:not(.isLoading):not(.disabled):hover .label,:host a.inverted:not(.isLoading):not(.disabled):hover .label{color:var(--color-lighter)}:host button.inverted:not(.isLoading):not(.disabled):hover cura-icon,:host a.inverted:not(.isLoading):not(.disabled):hover cura-icon{--color:var(--color-lighter) !important}:host button.inverted:not(.isLoading):not(.disabled):active .label,:host a.inverted:not(.isLoading):not(.disabled):active .label{color:var(--color-light)}:host button.inverted:not(.isLoading):not(.disabled):active cura-icon,:host a.inverted:not(.isLoading):not(.disabled):active cura-icon{--color:var(--color-light) !important}:host button cura-loader-circle,:host a cura-loader-circle{position:absolute;display:none}:host button.isLoading,:host a.isLoading{cursor:wait}:host button.isLoading .button-container,:host a.isLoading .button-container{opacity:0.3}:host button.isLoading.icon-only .button-container,:host a.isLoading.icon-only .button-container{opacity:0}:host button.isLoading cura-loader-circle,:host a.isLoading cura-loader-circle{display:block}";
275
-
276
- const CuraButtonTransparent = class {
277
- constructor(hostRef) {
278
- registerInstance(this, hostRef);
279
- this.size = 'large';
280
- this.disabled = false;
281
- this.isLoading = false;
282
- this.iconName = undefined;
283
- this.iconset = 'default';
284
- this.iconPosition = 'left';
285
- this.iconOnly = undefined;
286
- this.href = undefined;
287
- this.target = "_self";
288
- this.color = 'accent';
289
- this.fontColor = 'dark';
290
- this.textAlign = 'left';
291
- this.styles = {};
292
- }
293
- handleChangeColor() {
294
- this.setColors();
295
- }
296
- connectedCallback() {
297
- this.weights = window.CuraAPI.theme.fonts.getWeights();
298
- this.styles['--base-spacing'] = window.CuraAPI.theme.spacing.getSpacing();
299
- this.styles['--neutral-white'] = window.CuraAPI.theme.colors.getColor(`neutral-white`);
300
- this.styles['--neutral-base'] = window.CuraAPI.theme.colors.getColor(`neutral-base`);
301
- this.styles['--neutral-dark'] = window.CuraAPI.theme.colors.getColor(`neutral-dark`);
302
- this.styles['--font-size'] = window.CuraAPI.theme.fonts.getSize();
303
- this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();
304
- this.styles['--font-weight-medium'] = this.weights.medium;
305
- this.styles['--text-align'] = this.textAlign;
306
- this.setColors();
307
- }
308
- getClasses() {
309
- const classes = {};
310
- classes[`${this.size.toLowerCase()}`] = true;
311
- classes[`icon-${this.iconPosition.toLowerCase()}`] = true;
312
- classes[`icon-only`] = this.iconOnly;
313
- classes['inverted'] = this.fontColor === 'light';
314
- classes['disabled'] = this.disabled;
315
- classes['isLoading'] = this.isLoading;
316
- return classes;
317
- }
318
- setColors() {
319
- this.styles = Object.assign(Object.assign({}, this.styles), { '--color-lighter': window.CuraAPI.theme.colors.getColor(`${this.color}-lighter`), '--color-light': window.CuraAPI.theme.colors.getColor(`${this.color}-light`), '--color-base': window.CuraAPI.theme.colors.getColor(`${this.color}-base`), '--color-dark': window.CuraAPI.theme.colors.getColor(`${this.color}-dark`) });
320
- }
321
- getIcon() {
322
- if (!this.iconName)
323
- return '';
324
- const iconSize = this.size === 'small' ? 16 : this.size === 'medium' ? 20 : 24;
325
- const color = this.getSymbolColor();
326
- return h("cura-icon", { name: this.iconName, iconset: this.iconset, size: iconSize, color: color });
327
- }
328
- getSymbolColor() {
329
- return this.disabled
330
- ? 'neutral-dark'
331
- : this.fontColor === 'light'
332
- ? 'neutral-white'
333
- : `${this.color}-base`;
334
- }
335
- handleClick(e) {
336
- if (this.disabled || this.isLoading)
337
- e.preventDefault();
338
- }
339
- render() {
340
- return (h(Host, null, this.href ? (h("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e) }, h("span", { class: "button-container" }, this.getIcon(), h("span", { class: { label: true, inverted: this.fontColor === 'light' } }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: this.getSymbolColor() }))) : (h("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e) }, h("span", { class: "button-container" }, this.getIcon(), h("span", { class: { label: true, inverted: this.fontColor === 'light' } }, h("slot", null))), h("cura-loader-circle", { size: this.size, color: this.getSymbolColor() })))));
341
- }
342
- static get watchers() { return {
343
- "color": ["handleChangeColor"]
344
- }; }
345
- };
346
- CuraButtonTransparent.style = curaButtonTransparentCss;
347
-
348
- const curaDisplayCss = ":host{display:block;font-size:var(--font-size);text-transform:uppercase}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-family:var(--font-family);font-size:4.285em;font-weight:var(--font-weight-black);color:var(--color-body);line-height:120%;letter-spacing:-4%;-webkit-margin-before:var(--block-margin);margin-block-start:var(--block-margin);-webkit-margin-after:var(--block-margin);margin-block-end:var(--block-margin)}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:6.21em}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:3em;font-weight:var(--font-weight-bold)}@media (min-width: 768px) and (max-width: 1365px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:4.92em}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:7.07em}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:3.428em}}@media (min-width: 1366px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:6.14em;line-height:125%}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:8.857em;letter-spacing:-6%}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:4.285em;letter-spacing:-2%}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-bold)}:host ::slotted(a){font-weight:var(--font-weight-bold);color:var(--color-link);text-decoration:none;text-underline-offset:10%;cursor:pointer}:host ::slotted(abbr){color:var(--color-link);-webkit-text-decoration:underline dashed 1px var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}";
349
-
350
- const CuraDisplay = class {
351
- constructor(hostRef) {
352
- registerInstance(this, hostRef);
353
- this.level = 1;
354
- this.size = 'regular';
355
- this.inverted = false;
356
- this.spotColor = 'primary';
357
- }
358
- connectedCallback() {
359
- this.weights = window.CuraAPI.theme.fonts.getWeights();
360
- this.setFontProperties();
361
- this.setColors();
362
- }
363
- getClasses() {
364
- const classes = {};
365
- classes[this.size.toLowerCase()] = true;
366
- return classes;
367
- }
368
- setFontProperties() {
369
- this.styles = {
370
- '--font-family': window.CuraAPI.theme.fonts.getFamily('display'),
371
- '--font-size': window.CuraAPI.theme.fonts.getSize(),
372
- '--font-weight-bold': this.weights.bold,
373
- '--font-weight-black': this.weights.black
374
- };
375
- this.setHostProperty('--font-size', window.CuraAPI.theme.fonts.getSize());
376
- this.setHostProperty('--block-margin', '0.5em');
377
- }
378
- setColors() {
379
- const fontColor = this.inverted
380
- ? window.CuraAPI.theme.colors.getColor('neutral-white')
381
- : window.CuraAPI.theme.fonts.getColor();
382
- this.styles['--color-body'] = fontColor || window.CuraAPI.theme.colors.getColor('neutral-darker');
383
- this.styles['--color-link'] = this.inverted
384
- ? window.CuraAPI.theme.colors.getColor(`${this.spotColor}-lighter`)
385
- : window.CuraAPI.theme.colors.getColor(`${this.spotColor}-dark`);
386
- }
387
- setHostProperty(prop, value) {
388
- this.host.style.setProperty(prop, value);
389
- }
390
- getHeadingTag() {
391
- const tags = {
392
- '1': h("h1", { style: this.styles, class: this.getClasses() }, h("slot", null)),
393
- '2': h("h2", { style: this.styles, class: this.getClasses() }, h("slot", null)),
394
- '3': h("h3", { style: this.styles, class: this.getClasses() }, h("slot", null)),
395
- '4': h("h4", { style: this.styles, class: this.getClasses() }, h("slot", null)),
396
- '5': h("h5", { style: this.styles, class: this.getClasses() }, h("slot", null)),
397
- '6': h("h6", { style: this.styles, class: this.getClasses() }, h("slot", null)),
398
- 'default': h("h1", { style: this.styles, class: this.getClasses() }, h("slot", null))
399
- };
400
- return tags[`${this.level}`] || tags['default'];
401
- }
402
- render() {
403
- return (h(Host, null, this.getHeadingTag()));
404
- }
405
- get host() { return getElement(this); }
406
- };
407
- CuraDisplay.style = curaDisplayCss;
408
-
409
- const curaHeadingCss = ":host{display:block;font-size:var(--font-size)}:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-family:var(--font-family);font-size:1.71em;font-weight:var(--font-weight-regular);color:var(--color-body);line-height:130%;letter-spacing:0%;-webkit-margin-before:var(--block-margin);margin-block-start:var(--block-margin);-webkit-margin-after:var(--block-margin);margin-block-end:var(--block-margin)}:host h1.bold-weight,:host h2.bold-weight,:host h3.bold-weight,:host h4.bold-weight,:host h5.bold-weight,:host h6.bold-weight{font-weight:var(--font-weight-medium)}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:2.07em;letter-spacing:-2%}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:1.214em;line-height:150%;letter-spacing:0%}:host h1.small.bold-weight,:host h2.small.bold-weight,:host h3.small.bold-weight,:host h4.small.bold-weight,:host h5.small.bold-weight,:host h6.small.bold-weight{font-weight:var(--font-weight-bold)}@media (min-width: 768px) and (max-width: 1365px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:2em}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:2.357em}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:1.357em}}@media (min-width: 1366px){:host h1,:host h2,:host h3,:host h4,:host h5,:host h6{font-size:2.5em;line-height:135%;letter-spacing:-2%}:host h1.large,:host h2.large,:host h3.large,:host h4.large,:host h5.large,:host h6.large{font-size:2.92em}:host h1.small,:host h2.small,:host h3.small,:host h4.small,:host h5.small,:host h6.small{font-size:1.71em;line-height:160%;letter-spacing:0%}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-bold)}:host ::slotted(a){font-weight:var(--font-weight-bold);color:var(--color-link);text-decoration:none;text-underline-offset:10%;cursor:pointer}:host ::slotted(abbr){color:var(--color-link);-webkit-text-decoration:underline dashed 1px var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}";
410
-
411
- const CuraHeading = class {
412
- constructor(hostRef) {
413
- registerInstance(this, hostRef);
414
- this.level = 1;
415
- this.size = 'regular';
416
- this.weight = 'regular';
417
- this.inverted = false;
418
- this.spotColor = 'primary';
419
- }
420
- connectedCallback() {
421
- this.weights = window.CuraAPI.theme.fonts.getWeights();
422
- this.setFontProperties();
423
- this.setColors();
424
- }
425
- getClasses() {
426
- const classes = {};
427
- classes[this.size.toLowerCase()] = true;
428
- classes[`${this.weight.toLowerCase()}-weight`] = true;
429
- return classes;
430
- }
431
- setFontProperties() {
432
- this.styles = {
433
- '--font-family': window.CuraAPI.theme.fonts.getFamily('heading'),
434
- '--font-size': window.CuraAPI.theme.fonts.getSize(),
435
- '--font-weight-regular': this.weights.regular,
436
- '--font-weight-medium': this.weights.medium,
437
- '--font-weight-bold': this.weights.bold,
438
- '--font-weight-black': this.weights.black
439
- };
440
- this.setHostProperty('--font-size', window.CuraAPI.theme.fonts.getSize());
441
- this.setHostProperty('--block-margin', '0.5em');
442
- }
443
- setColors() {
444
- const fontColor = this.inverted
445
- ? window.CuraAPI.theme.colors.getColor('neutral-white')
446
- : window.CuraAPI.theme.fonts.getColor();
447
- this.styles['--color-body'] = fontColor || window.CuraAPI.theme.colors.getColor('neutral-darker');
448
- this.styles['--color-link'] = this.inverted
449
- ? window.CuraAPI.theme.colors.getColor(`${this.spotColor}-lighter`)
450
- : window.CuraAPI.theme.colors.getColor(`${this.spotColor}-dark`);
451
- }
452
- setHostProperty(prop, value) {
453
- this.host.style.setProperty(prop, value);
454
- }
455
- getHeadingTag() {
456
- const tags = {
457
- '1': h("h1", { style: this.styles, class: this.getClasses() }, h("slot", null)),
458
- '2': h("h2", { style: this.styles, class: this.getClasses() }, h("slot", null)),
459
- '3': h("h3", { style: this.styles, class: this.getClasses() }, h("slot", null)),
460
- '4': h("h4", { style: this.styles, class: this.getClasses() }, h("slot", null)),
461
- '5': h("h5", { style: this.styles, class: this.getClasses() }, h("slot", null)),
462
- '6': h("h6", { style: this.styles, class: this.getClasses() }, h("slot", null)),
463
- 'default': h("h1", { style: this.styles, class: this.getClasses() }, h("slot", null))
464
- };
465
- return tags[`${this.level}`] || tags['default'];
466
- }
467
- render() {
468
- return (h(Host, null, this.getHeadingTag()));
469
- }
470
- get host() { return getElement(this); }
471
- };
472
- CuraHeading.style = curaHeadingCss;
473
-
474
- const curaIconCss = ":host{width:var(--size);height:var(--size)}:host svg{display:inline-block;stroke:var(--color);width:var(--size);height:var(--size);stroke-width:var(--stroke);fill:none}";
475
-
476
- const CuraIcon = class {
477
- constructor(hostRef) {
478
- registerInstance(this, hostRef);
479
- this.sizes = {
480
- "128": { size: 128, stroke: 5.25 },
481
- "72": { size: 72, stroke: 3.5 },
482
- "64": { size: 64, stroke: 3.25 },
483
- "48": { size: 48, stroke: 2.75 },
484
- "40": { size: 40, stroke: 2.5 },
485
- "32": { size: 32, stroke: 2.25 },
486
- "24": { size: 24, stroke: 2 },
487
- "20": { size: 20, stroke: 1.75 },
488
- "16": { size: 16, stroke: 1.5 },
489
- "default": { size: 24, stroke: 2 }
490
- };
491
- this.name = '';
492
- this.color = 'neutral-base';
493
- this.size = undefined;
494
- this.iconset = 'default';
495
- this.disabled = false;
496
- }
497
- sizeHandler(size) {
498
- const scaledStroke = (iconSize) => {
499
- return `${this.sizes[iconSize].stroke * (this.sizes.default.size / this.sizes[iconSize].size)}px`;
500
- };
501
- this.setHostProperty('--size', this.sizes[`${size}`] ? `${this.sizes[size].size}px` : `${this.sizes.default.size}px`);
502
- this.setHostProperty('--stroke', this.sizes[`${size}`] ? scaledStroke(size) : scaledStroke("default"));
503
- }
504
- colorHandler() {
505
- this.setHostProperty('--color', window.CuraAPI.theme.colors.getColor(this.disabled ? 'neutral-light' : this.color));
506
- }
507
- connectedCallback() {
508
- this.assetsPath = window.CuraAPI.localAssetsPath;
509
- this.sizeHandler(this.size);
510
- this.colorHandler();
511
- }
512
- setHostProperty(prop, value) {
513
- this.host.style.setProperty(prop, value);
514
- }
515
- render() {
516
- return (h(Host, null, h("svg", { version: "1.1", viewBox: "0 0 24 24", preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg" }, h("use", { xlinkHref: `${this.assetsPath}/icons/iconset-${this.iconset}.svg#${this.name}` }))));
517
- }
518
- get host() { return getElement(this); }
519
- static get watchers() { return {
520
- "size": ["sizeHandler"],
521
- "color": ["colorHandler"],
522
- "disabled": ["colorHandler"]
523
- }; }
524
- };
525
- CuraIcon.style = curaIconCss;
526
-
527
- const iconsetdefaulticons = ["360", "accessibility", "addUser", "airdrop", "alertCircle", "alertTriangle", "arrowDown", "arrowDownCircle", "arrowLeft", "arrowLeftCircle", "arrowRight", "arrowRightCircle", "arrowUp", "arrowUpCircle", "attach", "avatarF", "avatarM", "biometry", "bloodGroup", "calendar", "cam", "camOff", "central", "chatCircle", "check", "checkBadge", "checkCircle", "checkDouble", "clock", "close", "closeCircle", "collapse", "config", "currency", "delete", "desktop", "doc", "down", "download", "duplicate", "edit", "exam", "examDoc", "expand", "facebook", "fileBmp", "fileJpg", "filePdf", "filePng", "fileUpload", "fileXls", "filter", "fullscreen", "gallery", "geotag", "geotagUnity", "geotagUnityGroup", "google", "graph", "healthPlan", "heart", "height", "height2", "home", "horizontalList", "imageUp", "infoCircle", "instagram", "key", "lamp", "language", "language2", "languageEN", "languagePT", "lattes", "left", "like", "link", "linkExternal", "linkedin", "list", "login", "logout", "mail", "maintenance", "medDoc", "medEspec", "medImg", "medUser", "medical", "menuHamburguer", "menuKebab", "menuMeatballs", "mic", "micOff", "minus", "minusCircle", "minusSquare", "mobile", "news", "notification", "npsDeslike", "npsHate", "npsLike", "npsLove", "npsNeutral", "order", "partner", "phone", "play", "plus", "plusCircle", "plusSquare", "print", "profile", "profileCircle", "questionCircle", "questionSquare", "range", "reload", "ribbon", "right", "schedule", "scheduleCheck", "scheduleHistorico", "search", "secure", "share", "siren", "sound", "soundOff", "subItem", "target", "team", "telegram", "twitter", "unLink", "unSecure", "unity", "unlike", "up", "upload", "verticalList", "viewFalse", "viewTrue", "weight", "whatsapp", "wifi", "wifiOff", "youtube", "zoomIn", "zoomOut"];
528
-
529
- const curaIconsViewCss = ":host{display:block;padding:24px;font-family:\"Roboto\", Arial, Helvetica, sans-serif}.iconDetail{display:block}.iconSizes{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.iconSizes .size{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;text-align:center;margin-right:9px;padding:8px}.iconSizes .size:last-child{margin-right:0}.iconSizes .size span{font-size:10px}.iconSizes.invert{margin-top:12px}.iconSizes.invert .size{background-color:#262626;color:#F6F6F6;border-radius:3px}.icons{margin-top:28px;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;position:relative}.icons .icon{position:relative;padding:4px;cursor:pointer;opacity:0.6;-webkit-transition:opacity 0.2s linear;transition:opacity 0.2s linear}.icons .icon span{font-size:12px;padding:6px;-webkit-box-sizing:border-box;box-sizing:border-box;background:#000;color:#FFF;border-radius:2px;position:absolute;top:-2px;left:50%;-webkit-transform:translateX(-50%) translateY(-100%);transform:translateX(-50%) translateY(-100%);display:none}.icons .icon:hover{opacity:1}.icons .icon:hover span{display:block}";
530
-
531
- const CuraIconsView = class {
532
- constructor(hostRef) {
533
- registerInstance(this, hostRef);
534
- this.sizes = [16, 20, 24, 32, 40, 48, 64, 72, 128];
535
- this.colors = ['primary', 'secondary', 'accent', 'info', 'warning', 'error', 'success', 'neutral'];
536
- this.setSelected = (icon) => {
537
- this.selected = icon;
538
- };
539
- this.selected = '360';
540
- }
541
- render() {
542
- return (h(Host, null, h("div", { class: "iconDetail" }, h("h4", null, this.selected), h("div", { class: "iconSizes" }, this.sizes.map(size => h("div", { class: "size" }, h("cura-icon", { name: this.selected, size: size }), h("span", null, size)))), h("div", { class: "iconSizes invert" }, this.sizes.map(size => h("div", { class: "size" }, h("cura-icon", { name: this.selected, size: size, color: "neutral-white" }), h("span", null, size)))), h("div", { class: "iconSizes" }, this.colors.map(color => h("div", { class: "size" }, h("cura-icon", { name: this.selected, color: color }), h("span", null, color))), h("div", { class: "size" }, h("cura-icon", { name: this.selected, disabled: true }), h("span", null, "Disabled")))), h("div", { class: "icons" }, iconsetdefaulticons.map(icon => h("div", { class: "icon", onClick: () => this.setSelected(icon) }, h("cura-icon", { name: icon }), h("span", null, icon))))));
543
- }
544
- };
545
- CuraIconsView.style = curaIconsViewCss;
546
-
547
- const curaLoaderCircleCss = ":host{display:inline-block;width:var(--size);height:var(--size)}:host svg{width:var(--size);height:var(--size);-webkit-animation:rotate 0.7s linear infinite;animation:rotate 0.7s linear infinite}:host circle,:host path{stroke-miterlimit:10;stroke-linecap:round;stroke-linejoin:round}:host path{stroke:var(--color)}:host stop{stop-color:var(--color)}:host linearGradient stop:first-child{stop-opacity:0.14}@-webkit-keyframes rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}";
548
-
549
- const CuraLoaderCircle = class {
550
- constructor(hostRef) {
551
- registerInstance(this, hostRef);
552
- this.sizes = {
553
- xlarge: 32,
554
- large: 24,
555
- medium: 20,
556
- small: 16,
557
- default: 16,
558
- };
559
- this.getPxSize = () => this.sizes[this.size] || this.sizes['default'];
560
- this.size = 'medium';
561
- this.color = 'neutral-white';
562
- }
563
- getStyles() {
564
- return {
565
- '--size': `${this.getPxSize()}px`,
566
- '--color': window.CuraAPI.theme.colors.getColor(this.color)
567
- };
568
- }
569
- render() {
570
- return (h(Host, { style: this.getStyles() }, h("svg", { viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", null, h("circle", { cx: "8", cy: "8", r: "7", stroke: "url(#paint0_linear_13485_11488)", "stroke-width": "2" }), h("path", { d: "M1 8C1 4.13401 4.11877 1 7.96596 1C9.53445 1 10.9819 1.52093 12.1462 2.4C12.8959 2.96601 13.5282 3.68049 14 4.5", "stroke-width": "2" })), h("defs", null, h("linearGradient", { id: "paint0_linear_13485_11488", x1: "15.7", y1: "4.5", x2: "4.15", y2: "11.5", gradientUnits: "userSpaceOnUse" }, h("stop", null), h("stop", { offset: "1" }))))));
571
- }
572
- };
573
- CuraLoaderCircle.style = curaLoaderCircleCss;
574
-
575
- const curaPageTemplateCss = ":host{display:block}:host .grid-template{display:grid;grid-template-rows:auto;grid-template-columns:auto;grid-template-areas:\"sub-header\" \"header\" \"pre-content\" \"content-container\" \"post-body\" \"footer\" \"sub-footer\"}:host .grid-template #sub-header{grid-area:sub-header}:host .grid-template #header{grid-area:header}:host .grid-template #pre-content{grid-area:pre-content}:host .grid-template #content-container{grid-area:content-container}:host .grid-template #post-body{grid-area:post-body}:host .grid-template #footer{grid-area:footer}:host .grid-template #sub-footer{grid-area:sub-footer}@media (max-width: 360px){:host .grid-template{padding:0px}}@media (min-width: 768px) and (max-width: 1365px){:host .grid-template{padding:0px}}@media (min-width: 1366px) and (max-width: 1919px){:host .grid-template{padding:0px}:host .grid-template #content-container #sidebar-left ::slotted(div[slot=sidebar-left]){margin-right:calc(var(--spacing) * 5px)}:host .grid-template #content-container #sidebar-right ::slotted(div[slot=sidebar-right]){margin-left:calc(var(--spacing) * 5px)}:host .grid-template #content-container{display:-ms-flexbox;display:flex}:host .grid-template #content-container #content{-ms-flex-positive:1;flex-grow:1}:host .grid-template #content-container #sidebar-left,:host .grid-template #content-container #sidebar-right{max-width:20%}}@media (min-width: 1920px){:host .grid-template{padding:0px}:host .grid-template #content-container #sidebar-left ::slotted(div[slot=sidebar-left]){margin-right:calc(var(--spacing) * 7px)}:host .grid-template #content-container #sidebar-right ::slotted(div[slot=sidebar-right]){margin-left:calc(var(--spacing) * 7px)}:host .grid-template #content-container{display:-ms-flexbox;display:flex}:host .grid-template #content-container #content{-ms-flex-positive:1;flex-grow:1}:host .grid-template #content-container #sidebar-left,:host .grid-template #content-container #sidebar-right{max-width:20%}:host .grid-template #content-container.centered{max-width:1920px;justify-self:center}}";
576
-
577
- const CuraPageTemplate = class {
578
- constructor(hostRef) {
579
- registerInstance(this, hostRef);
580
- this.contentwidth = 'default';
581
- }
582
- connectedCallback() {
583
- this.styles = {
584
- '--spacing': window.CuraAPI.theme.spacing.getSpacing(),
585
- };
586
- }
587
- getClasses() {
588
- const classes = {};
589
- classes[this.contentwidth.toLowerCase()] = true;
590
- return classes;
591
- }
592
- render() {
593
- return (h(Host, null, h("div", { style: this.styles, class: "grid-template" }, h("div", { id: "sub-header" }, h("slot", { name: 'sub-header' })), h("div", { id: "header" }, h("slot", { name: 'header' })), h("div", { id: "pre-content" }, h("slot", { name: 'pre-content' })), h("div", { id: "content-container", class: this.getClasses() }, h("div", { id: "sidebar-left" }, h("slot", { name: 'sidebar-left' })), h("div", { id: "content" }, h("slot", { name: "content" }), h("slot", null)), h("div", { id: "sidebar-right" }, h("slot", { name: 'sidebar-right' }))), h("div", { id: "post-body" }, h("slot", { name: 'post-body' })), h("div", { id: "footer" }, h("slot", { name: 'footer' })), h("div", { id: "sub-footer" }, h("slot", { name: 'sub-footer' })))));
594
- }
595
- get host() { return getElement(this); }
596
- };
597
- CuraPageTemplate.style = curaPageTemplateCss;
598
-
599
- const curaParagraphCss = ":host{display:block;font-size:var(--font-size)}:host p{font-family:var(--font-family);font-size:var(--font-size);font-weight:var(--font-weight-regular);color:var(--color-body);line-height:var(--line-height);-webkit-margin-before:var(--block-margin);margin-block-start:var(--block-margin);-webkit-margin-after:var(--block-margin);margin-block-end:var(--block-margin)}:host p.large{font-size:1.21em;line-height:calc(var(--line-height) + 10%);}:host p.small{font-size:0.85em;line-height:calc(var(--line-height) - 5%);}:host p.caption{font-size:0.71em;line-height:calc(var(--line-height) - 5%);}@media (min-width: 768px) and (max-width: 1365px){:host p{font-size:1.14em;line-height:calc(var(--line-height) + 5%);}:host p.large{font-size:1.35em;line-height:calc(var(--line-height) + 10%);}:host p.small{font-size:1em;line-height:calc(var(--line-height) - 5%);}:host p.caption{font-size:0.85em;line-height:calc(var(--line-height) - 5%);}}@media (min-width: 1366px){:host p{font-size:1.42em;line-height:calc(var(--line-height) + 10%);}:host p.large{font-size:1.71em;line-height:calc(var(--line-height) + 20%);}:host p.small{font-size:1.21em;line-height:calc(var(--line-height) + 5%);}:host p.caption{font-size:1em;line-height:calc(var(--line-height) + 5%);}}:host ::slotted(b),:host ::slotted(strong){font-weight:var(--font-weight-bold)}:host ::slotted(a){font-weight:var(--font-weight-medium);color:var(--color-link);text-underline-offset:10%}:host ::slotted(abbr){color:var(--color-link);-webkit-text-decoration:underline dashed 1px var(--color-link);text-decoration:underline dashed 1px var(--color-link);text-underline-offset:10%;cursor:default}";
600
-
601
- const CuraParagraph = class {
602
- constructor(hostRef) {
603
- registerInstance(this, hostRef);
604
- this.size = 'regular';
605
- this.inverted = false;
606
- this.spotColor = 'primary';
607
- this.color = undefined;
608
- this.styles = {};
609
- }
610
- handleChangeColor() {
611
- this.setColors();
612
- }
613
- connectedCallback() {
614
- this.weights = window.CuraAPI.theme.fonts.getWeights();
615
- this.setFontProperties();
616
- this.setColors();
617
- }
618
- setsizeClass() {
619
- const sizeclass = {};
620
- sizeclass[this.size.toLowerCase()] = true;
621
- return sizeclass;
622
- }
623
- setFontProperties() {
624
- this.styles = {
625
- '--font-family': window.CuraAPI.theme.fonts.getFamily('body'),
626
- '--font-size': window.CuraAPI.theme.fonts.getSize(),
627
- '--font-weight-regular': this.weights.regular,
628
- '--font-weight-medium': this.weights.medium,
629
- '--font-weight-bold': this.weights.bold
630
- };
631
- this.setHostProperty('--font-size', window.CuraAPI.theme.fonts.getSize());
632
- this.setHostProperty('--block-margin', '1.25em');
633
- this.setHostProperty('--line-height', '140%');
634
- }
635
- setColors() {
636
- const fontColor = this.color ? window.CuraAPI.theme.colors.getColor(this.color) :
637
- this.inverted
638
- ? window.CuraAPI.theme.colors.getColor('neutral-white')
639
- : window.CuraAPI.theme.fonts.getColor();
640
- this.styles = Object.assign(Object.assign({}, this.styles), { '--color-body': fontColor || window.CuraAPI.theme.colors.getColor('neutral-darker'), '--color-link': this.inverted
641
- ? window.CuraAPI.theme.colors.getColor(`${this.spotColor}-lighter`)
642
- : window.CuraAPI.theme.colors.getColor(`${this.spotColor}-dark`) });
643
- }
644
- setHostProperty(prop, value) {
645
- this.host.style.setProperty(prop, value);
646
- }
647
- render() {
648
- return (h(Host, null, h("p", { style: this.styles, class: this.setsizeClass() }, h("slot", null))));
649
- }
650
- get host() { return getElement(this); }
651
- static get watchers() { return {
652
- "color": ["handleChangeColor"]
653
- }; }
654
- };
655
- CuraParagraph.style = curaParagraphCss;
656
-
657
- export { CuraAccordion as cura_accordion, CuraAccordionItem as cura_accordion_item, CuraButton as cura_button, CuraButtonOutline as cura_button_outline, CuraButtonTransparent as cura_button_transparent, CuraDisplay as cura_display, CuraHeading as cura_heading, CuraIcon as cura_icon, CuraIconsView as cura_icons_view, CuraLoaderCircle as cura_loader_circle, CuraPageTemplate as cura_page_template, CuraParagraph as cura_paragraph };
658
-
659
- //# sourceMappingURL=cura-accordion_12.entry.js.map