@umbraco-ui/uui 2.0.0-alpha.0 → 2.0.0-rc.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (97) hide show
  1. package/README.md +10 -19
  2. package/custom-elements.json +45 -8
  3. package/dist/components/avatar/avatar.element.js +1 -0
  4. package/dist/components/avatar/avatar.element.js.map +1 -1
  5. package/dist/components/boolean-input/boolean-input.element.js +7 -1
  6. package/dist/components/boolean-input/boolean-input.element.js.map +1 -1
  7. package/dist/components/button/button.element.d.ts +0 -1
  8. package/dist/components/button/button.element.js +64 -18
  9. package/dist/components/button/button.element.js.map +1 -1
  10. package/dist/components/card-block-type/card-block-type.element.js +13 -4
  11. package/dist/components/card-block-type/card-block-type.element.js.map +1 -1
  12. package/dist/components/card-content-node/card-content-node.element.js +2 -2
  13. package/dist/components/card-content-node/card-content-node.element.js.map +1 -1
  14. package/dist/components/card-media/card-media.element.js +10 -3
  15. package/dist/components/card-media/card-media.element.js.map +1 -1
  16. package/dist/components/card-user/card-user.element.js +2 -2
  17. package/dist/components/card-user/card-user.element.js.map +1 -1
  18. package/dist/components/checkbox/checkbox.element.js +3 -6
  19. package/dist/components/checkbox/checkbox.element.js.map +1 -1
  20. package/dist/components/color-slider/color-slider.element.js +13 -3
  21. package/dist/components/color-slider/color-slider.element.js.map +1 -1
  22. package/dist/components/color-swatch/color-swatch.element.js +33 -1
  23. package/dist/components/color-swatch/color-swatch.element.js.map +1 -1
  24. package/dist/components/combobox/combobox.element.d.ts +9 -0
  25. package/dist/components/combobox/combobox.element.js +127 -15
  26. package/dist/components/combobox/combobox.element.js.map +1 -1
  27. package/dist/components/combobox-list/combobox-list-option.element.d.ts +1 -0
  28. package/dist/components/combobox-list/combobox-list-option.element.js +49 -10
  29. package/dist/components/combobox-list/combobox-list-option.element.js.map +1 -1
  30. package/dist/components/combobox-list/combobox-list.element.d.ts +14 -0
  31. package/dist/components/combobox-list/combobox-list.element.js +74 -25
  32. package/dist/components/combobox-list/combobox-list.element.js.map +1 -1
  33. package/dist/components/file-dropzone/file-dropzone.element.d.ts +2 -8
  34. package/dist/components/file-dropzone/file-dropzone.element.js +14 -25
  35. package/dist/components/file-dropzone/file-dropzone.element.js.map +1 -1
  36. package/dist/components/icon-registry-essential/UUIIconRegistryEssential.js +1 -1
  37. package/dist/components/icon-registry-essential/icon-registry-essential.js +33 -0
  38. package/dist/components/icon-registry-essential/icon-registry-essential.js.map +1 -1
  39. package/dist/components/index.d.ts +81 -0
  40. package/dist/components/input/input.element.js +33 -3
  41. package/dist/components/input/input.element.js.map +1 -1
  42. package/dist/components/input-file/input-file.element.js +33 -1
  43. package/dist/components/input-file/input-file.element.js.map +1 -1
  44. package/dist/components/input-lock/input-lock.element.js +33 -4
  45. package/dist/components/input-lock/input-lock.element.js.map +1 -1
  46. package/dist/components/input-password/input-password.element.js +33 -3
  47. package/dist/components/input-password/input-password.element.js.map +1 -1
  48. package/dist/components/keyboard-shortcut/key.element.js +7 -1
  49. package/dist/components/keyboard-shortcut/key.element.js.map +1 -1
  50. package/dist/components/loader/loader.element.js +19 -2
  51. package/dist/components/loader/loader.element.js.map +1 -1
  52. package/dist/components/modal/modal-container.js +6 -2
  53. package/dist/components/modal/modal-container.js.map +1 -1
  54. package/dist/components/modal/modal-dialog.element.js +5 -5
  55. package/dist/components/modal/modal-dialog.element.js.map +1 -1
  56. package/dist/components/modal/modal-sidebar.element.js +14 -10
  57. package/dist/components/modal/modal-sidebar.element.js.map +1 -1
  58. package/dist/components/modal/modal-with-toasts-example.element.d.ts +22 -0
  59. package/dist/components/modal/modal.element.d.ts +3 -1
  60. package/dist/components/modal/modal.element.js +31 -12
  61. package/dist/components/modal/modal.element.js.map +1 -1
  62. package/dist/components/modal/modal.js +7 -1
  63. package/dist/components/modal/modal.js.map +1 -1
  64. package/dist/components/pagination/pagination.element.d.ts +2 -0
  65. package/dist/components/pagination/pagination.element.js +26 -20
  66. package/dist/components/pagination/pagination.element.js.map +1 -1
  67. package/dist/components/progress-bar/progress-bar.element.js +6 -5
  68. package/dist/components/progress-bar/progress-bar.element.js.map +1 -1
  69. package/dist/components/responsive-container/responsive-container.element.js +36 -14
  70. package/dist/components/responsive-container/responsive-container.element.js.map +1 -1
  71. package/dist/components/scroll-container/scroll-container.element.js +4 -4
  72. package/dist/components/scroll-container/scroll-container.element.js.map +1 -1
  73. package/dist/components/symbol-expand/symbol-expand.element.js +1 -1
  74. package/dist/components/symbol-expand/symbol-expand.element.js.map +1 -1
  75. package/dist/components/symbol-file-thumbnail/symbol-file-thumbnail.element.js +34 -1
  76. package/dist/components/symbol-file-thumbnail/symbol-file-thumbnail.element.js.map +1 -1
  77. package/dist/components/table/table-head.element.js +4 -0
  78. package/dist/components/table/table-head.element.js.map +1 -1
  79. package/dist/components/table/table.element.js +5 -1
  80. package/dist/components/table/table.element.js.map +1 -1
  81. package/dist/components/tag/tag.element.js +4 -3
  82. package/dist/components/tag/tag.element.js.map +1 -1
  83. package/dist/components/toast-notification/toast-notification.element.js +34 -2
  84. package/dist/components/toast-notification/toast-notification.element.js.map +1 -1
  85. package/dist/components/toggle/toggle.element.js +38 -3
  86. package/dist/components/toggle/toggle.element.js.map +1 -1
  87. package/dist/index.d.ts +1 -81
  88. package/dist/internal/mixins/LabelMixin.js +14 -1
  89. package/dist/internal/mixins/LabelMixin.js.map +1 -1
  90. package/dist/internal/mixins/SelectOnlyMixin.d.ts +1 -1
  91. package/dist/internal/mixins/SelectOnlyMixin.js.map +1 -1
  92. package/dist/package.json.js +1 -1
  93. package/dist/themes/dark.css +1 -1
  94. package/dist/themes/high-contrast.css +1 -0
  95. package/dist/themes/light.css +1 -1
  96. package/package.json +27 -27
  97. package/vscode.html-custom-data.json +33 -18
package/dist/components/toggle/toggle.element.js CHANGED
@@ -1,8 +1,39 @@
1
1
  import { UUIBooleanInputElement } from "../boolean-input/boolean-input.element.js";
2
2
  import "../boolean-input/UUIBooleanInputEvent.js";
3
- import { html, css } from "lit";
3
+ import "../icon-registry-essential/svgs/iconAdd.js";
4
+ import "../icon-registry-essential/svgs/iconAlert.js";
5
+ import "../icon-registry-essential/svgs/iconAttachment.js";
6
+ import "../icon-registry-essential/svgs/iconCalendar.js";
4
7
  import { iconCheck } from "../icon-registry-essential/svgs/iconCheck.js";
8
+ import "../icon-registry-essential/svgs/iconClipboard.js";
9
+ import "../icon-registry-essential/svgs/iconCode.js";
10
+ import "../icon-registry-essential/svgs/iconColorPicker.js";
11
+ import "../icon-registry-essential/svgs/iconCopy.js";
12
+ import "../icon-registry-essential/svgs/iconDelete.js";
13
+ import "../icon-registry-essential/svgs/iconDocument.js";
14
+ import "../icon-registry-essential/svgs/iconDownload.js";
15
+ import "../icon-registry-essential/svgs/iconDrag.js";
16
+ import "../icon-registry-essential/svgs/iconEdit.js";
17
+ import "../icon-registry-essential/svgs/iconFavorite.js";
18
+ import "../icon-registry-essential/svgs/iconFolder.js";
19
+ import "../icon-registry-essential/svgs/iconForbidden.js";
20
+ import "../icon-registry-essential/svgs/iconInfo.js";
21
+ import "../icon-registry-essential/svgs/iconLink.js";
22
+ import "../icon-registry-essential/svgs/iconLock.js";
23
+ import "../icon-registry-essential/svgs/iconPause.js";
24
+ import "../icon-registry-essential/svgs/iconPicture.js";
25
+ import "../icon-registry-essential/svgs/iconPlay.js";
5
26
  import { iconRemove } from "../icon-registry-essential/svgs/iconRemove.js";
27
+ import "../icon-registry-essential/svgs/iconSearch.js";
28
+ import "../icon-registry-essential/svgs/iconSee.js";
29
+ import "../icon-registry-essential/svgs/iconSettings.js";
30
+ import "../icon-registry-essential/svgs/iconSubtract.js";
31
+ import "../icon-registry-essential/svgs/iconSync.js";
32
+ import "../icon-registry-essential/svgs/iconUnlock.js";
33
+ import "../icon-registry-essential/svgs/iconUnsee.js";
34
+ import "../icon-registry-essential/svgs/iconWand.js";
35
+ import "../icon-registry-essential/svgs/iconWrong.js";
36
+ import { html, css } from "lit";
6
37
  import { UUIHorizontalShakeKeyframes, UUIHorizontalShakeAnimationValue } from "../../internal/animations/uui-shake.js";
7
38
  const _UUIToggleElement = class _UUIToggleElement extends UUIBooleanInputElement {
8
39
  constructor() {
@@ -41,11 +72,15 @@ _UUIToggleElement.styles = [
41
72
 
42
73
  background-color: var(
43
74
  --uui-toggle-background-color,
44
- var(--uui-color-border)
75
+ var(--uui-color-divider-standalone)
45
76
  );
46
77
  border: 1px solid
47
78
  var(--uui-toggle-border-color, var(--uui-color-border-standalone));
48
79
  font-size: calc(var(--uui-toggle-size) * 0.6);
80
+
81
+ transition:
82
+ background-color 60ms,
83
+ border-color 60ms;
49
84
  }
50
85
 
51
86
  label:hover input:not([disabled]) ~ #toggle {
@@ -55,7 +90,7 @@ _UUIToggleElement.styles = [
55
90
  );
56
91
  background-color: var(
57
92
  --uui-toggle-background-color-hover,
58
- var(--uui-color-border)
93
+ var(--uui-color-divider)
59
94
  );
60
95
  }
61
96
 
package/dist/components/toggle/toggle.element.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"toggle.element.js","sources":["../../../src/components/toggle/toggle.element.ts"],"sourcesContent":["import {\n UUIHorizontalShakeAnimationValue,\n UUIHorizontalShakeKeyframes,\n} from '../../internal/animations/index.js';\nimport { UUIBooleanInputElement } from '../boolean-input/boolean-input.js';\nimport {\n iconCheck,\n iconRemove,\n} from '../icon-registry-essential/svgs/index.js';\nimport { css, html } from 'lit';\n\n/**\n * Umbraco Toggle-switch, toggles between off/on. Technically a checkbox.\n * @element uui-toggle\n * @fires UUIBooleanInputEvent#change- fires when the element is begin checked by a user action\n * @cssprop --uui-toggle-size - Define the toggle size.\n * @cssprop --uui-toggle-switch-width - Define the slider width.\n * @cssprop --uui-toggle-background-color - Set the toggle background color\n * @cssprop --uui-toggle-border-color - Set the toggle border color\n * @cssprop --uui-toggle-border-color-hover - Set the toggle background color when hovered\n * @cssprop --uui-toggle-background-color-hover - Set the toggle background color when hovered\n * @cssprop --uui-toggle-border-color-focus - Set the toggle background color when focused\n * @cssprop --uui-toggle-background-color-focus - Set the toggle background color when focused\n * @extends UUIBooleanInputElement\n */\nexport class UUIToggleElement extends UUIBooleanInputElement {\n /**\n * This is a static class field indicating that the element is can be used inside a native form and participate in its events. It may require a polyfill, check support here https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals. Read more about form controls here https://web.dev/more-capable-form-controls/\n * @type {boolean}\n */\n static readonly formAssociated = true;\n\n constructor() {\n super('switch');\n }\n\n renderCheckbox() {\n return html`\n <div id=\"toggle\">\n <div id=\"icon-checked\">${iconCheck}</div>\n <div id=\"icon-unchecked\">${iconRemove}</div>\n </div>\n `;\n }\n\n static override readonly styles = [\n ...UUIBooleanInputElement.styles,\n UUIHorizontalShakeKeyframes,\n css`\n :host {\n --uui-toggle-size: 18px;\n --uui-toggle-switch-width: calc(2 * var(--uui-toggle-size));\n }\n\n #toggle {\n position: relative;\n grid-area: 'input';\n display: flex;\n align-items: center;\n\n flex-shrink: 0;\n\n width: var(--uui-toggle-switch-width);\n height: var(--uui-toggle-size);\n border-radius: 100px;\n\n background-color: var(\n --uui-toggle-background-color,\n var(--uui-color-border)\n );\n border: 1px solid\n var(--uui-toggle-border-color, var(--uui-color-border-standalone));\n font-size: calc(var(--uui-toggle-size) * 0.6);\n }\n\n label:hover input:not([disabled]) ~ #toggle {\n border-color: var(\n --uui-toggle-border-color-hover,\n var(--uui-color-border-emphasis)\n );\n background-color: var(\n --uui-toggle-background-color-hover,\n var(--uui-color-border)\n );\n }\n\n label:focus #toggle {\n border-color: var(\n --uui-toggle-border-color-focus,\n var(--uui-color-focus)\n );\n background-color: var(\n --uui-toggle-background-color-focus,\n var(--uui-color-surface-emphasis)\n );\n }\n\n input:checked ~ #toggle {\n background-color: var(--uui-color-selected);\n }\n input:checked ~ #toggle::after {\n border-color: var(--uui-color-selected-standalone);\n }\n\n label:hover input:checked:not([disabled]) ~ #toggle {\n background-color: var(--uui-color-selected-emphasis);\n }\n\n label:focus input:checked ~ #toggle {\n background-color: var(--uui-color-selected-emphasis);\n }\n\n #icon-checked,\n #icon-unchecked {\n position: absolute;\n vertical-align: middle;\n width: 1em;\n height: 1em;\n line-height: 0;\n transition: color 120ms;\n svg {\n stroke-width: 2.5;\n }\n }\n\n #icon-checked {\n margin-left: -0.45em;\n left: calc((var(--uui-toggle-size) + 1px) * 0.5);\n color: var(--uui-color-interactive);\n }\n\n #icon-unchecked {\n margin-right: -0.5em;\n right: calc((var(--uui-toggle-size) + 1px) * 0.5);\n color: var(--uui-color-interactive);\n }\n\n input:checked ~ #toggle #icon-checked {\n color: var(--uui-color-selected-contrast);\n }\n\n #toggle::after {\n content: '';\n position: absolute;\n top: 1px;\n left: 1px;\n width: calc(var(--uui-toggle-size) - 2px);\n height: calc(var(--uui-toggle-size) - 2px);\n border-radius: 100px;\n background-color: var(--uui-color-selected-contrast);\n border: 1px solid var(--uui-color-border-standalone);\n box-sizing: border-box;\n transition:\n width 120ms ease,\n left 120ms ease,\n transform 120ms ease,\n background-color 120ms;\n }\n\n input:checked ~ #toggle::after {\n left: calc(100% - 2px);\n transform: translateX(-100%);\n }\n\n input:focus-visible ~ #toggle {\n outline: 2px solid var(--uui-color-focus);\n }\n\n :host(:not([disabled], [readonly])) label:active #toggle::after {\n /** Stretch when mouse down */\n width: calc(1.06 * var(--uui-toggle-size));\n }\n\n :host([disabled]) #toggle {\n background-color: var(--uui-color-disabled-standalone);\n }\n :host([disabled]) input:checked ~ #toggle {\n background-color: var(--uui-color-disabled-contrast);\n }\n :host([disabled]) #toggle::after {\n background-color: var(--uui-color-disabled);\n }\n :host([disabled]) #toggle #icon-unchecked {\n color: var(--uui-color-disabled-contrast);\n }\n :host([disabled]) label:active #toggle {\n animation: ${UUIHorizontalShakeAnimationValue};\n }\n :host([disabled]) input:checked #toggle #icon-checked {\n color: var(--uui-color-disabled-contrast);\n }\n\n :host(:not([pristine]):invalid) #toggle,\n :host(:not([pristine]):invalid) label:hover #toggle,\n /* polyfill support */\n :host(:not([pristine])[internals-invalid]) #toggle,\n :host(:not([pristine])[internals-invalid]) label:hover #toggle {\n border: 1px solid var(--uui-color-invalid-standalone);\n }\n `,\n ];\n}\n"],"names":[],"mappings":";;;;;;AAyBO,MAAM,oBAAN,MAAM,0BAAyB,uBAAuB;AAAA,EAO3D,cAAc;AACZ,UAAM,QAAQ;AAAA,EAChB;AAAA,EAEA,iBAAiB;AACf,WAAO;AAAA;AAAA,iCAEsB,SAAS;AAAA,mCACP,UAAU;AAAA;AAAA;AAAA,EAG3C;AA8JF;AA3KE,kBAAgB,iBAAiB;AAejC,kBAAyB,SAAS;AAAA,EAChC,GAAG,uBAAuB;AAAA,EAC1B;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBA0IiB,gCAAgC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAjK9C,IAAM,mBAAN;"}
1
+ {"version":3,"file":"toggle.element.js","sources":["../../../src/components/toggle/toggle.element.ts"],"sourcesContent":["import {\n UUIHorizontalShakeAnimationValue,\n UUIHorizontalShakeKeyframes,\n} from '../../internal/animations/index.js';\nimport { UUIBooleanInputElement } from '../boolean-input/boolean-input.js';\nimport {\n iconCheck,\n iconRemove,\n} from '../icon-registry-essential/svgs/index.js';\nimport { css, html } from 'lit';\n\n/**\n * Umbraco Toggle-switch, toggles between off/on. Technically a checkbox.\n * @element uui-toggle\n * @fires UUIBooleanInputEvent#change- fires when the element is begin checked by a user action\n * @cssprop --uui-toggle-size - Define the toggle size.\n * @cssprop --uui-toggle-switch-width - Define the slider width.\n * @cssprop --uui-toggle-background-color - Set the toggle background color\n * @cssprop --uui-toggle-border-color - Set the toggle border color\n * @cssprop --uui-toggle-border-color-hover - Set the toggle background color when hovered\n * @cssprop --uui-toggle-background-color-hover - Set the toggle background color when hovered\n * @cssprop --uui-toggle-border-color-focus - Set the toggle background color when focused\n * @cssprop --uui-toggle-background-color-focus - Set the toggle background color when focused\n * @extends UUIBooleanInputElement\n */\nexport class UUIToggleElement extends UUIBooleanInputElement {\n /**\n * This is a static class field indicating that the element is can be used inside a native form and participate in its events. It may require a polyfill, check support here https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals. Read more about form controls here https://web.dev/more-capable-form-controls/\n * @type {boolean}\n */\n static readonly formAssociated = true;\n\n constructor() {\n super('switch');\n }\n\n renderCheckbox() {\n return html`\n <div id=\"toggle\">\n <div id=\"icon-checked\">${iconCheck}</div>\n <div id=\"icon-unchecked\">${iconRemove}</div>\n </div>\n `;\n }\n\n static override readonly styles = [\n ...UUIBooleanInputElement.styles,\n UUIHorizontalShakeKeyframes,\n css`\n :host {\n --uui-toggle-size: 18px;\n --uui-toggle-switch-width: calc(2 * var(--uui-toggle-size));\n }\n\n #toggle {\n position: relative;\n grid-area: 'input';\n display: flex;\n align-items: center;\n\n flex-shrink: 0;\n\n width: var(--uui-toggle-switch-width);\n height: var(--uui-toggle-size);\n border-radius: 100px;\n\n background-color: var(\n --uui-toggle-background-color,\n var(--uui-color-divider-standalone)\n );\n border: 1px solid\n var(--uui-toggle-border-color, var(--uui-color-border-standalone));\n font-size: calc(var(--uui-toggle-size) * 0.6);\n\n transition:\n background-color 60ms,\n border-color 60ms;\n }\n\n label:hover input:not([disabled]) ~ #toggle {\n border-color: var(\n --uui-toggle-border-color-hover,\n var(--uui-color-border-emphasis)\n );\n background-color: var(\n --uui-toggle-background-color-hover,\n var(--uui-color-divider)\n );\n }\n\n label:focus #toggle {\n border-color: var(\n --uui-toggle-border-color-focus,\n var(--uui-color-focus)\n );\n background-color: var(\n --uui-toggle-background-color-focus,\n var(--uui-color-surface-emphasis)\n );\n }\n\n input:checked ~ #toggle {\n background-color: var(--uui-color-selected);\n }\n input:checked ~ #toggle::after {\n border-color: var(--uui-color-selected-standalone);\n }\n\n label:hover input:checked:not([disabled]) ~ #toggle {\n background-color: var(--uui-color-selected-emphasis);\n }\n\n label:focus input:checked ~ #toggle {\n background-color: var(--uui-color-selected-emphasis);\n }\n\n #icon-checked,\n #icon-unchecked {\n position: absolute;\n vertical-align: middle;\n width: 1em;\n height: 1em;\n line-height: 0;\n transition: color 120ms;\n svg {\n stroke-width: 2.5;\n }\n }\n\n #icon-checked {\n margin-left: -0.45em;\n left: calc((var(--uui-toggle-size) + 1px) * 0.5);\n color: var(--uui-color-interactive);\n }\n\n #icon-unchecked {\n margin-right: -0.5em;\n right: calc((var(--uui-toggle-size) + 1px) * 0.5);\n color: var(--uui-color-interactive);\n }\n\n input:checked ~ #toggle #icon-checked {\n color: var(--uui-color-selected-contrast);\n }\n\n #toggle::after {\n content: '';\n position: absolute;\n top: 1px;\n left: 1px;\n width: calc(var(--uui-toggle-size) - 2px);\n height: calc(var(--uui-toggle-size) - 2px);\n border-radius: 100px;\n background-color: var(--uui-color-selected-contrast);\n border: 1px solid var(--uui-color-border-standalone);\n box-sizing: border-box;\n transition:\n width 120ms ease,\n left 120ms ease,\n transform 120ms ease,\n background-color 120ms;\n }\n\n input:checked ~ #toggle::after {\n left: calc(100% - 2px);\n transform: translateX(-100%);\n }\n\n input:focus-visible ~ #toggle {\n outline: 2px solid var(--uui-color-focus);\n }\n\n :host(:not([disabled], [readonly])) label:active #toggle::after {\n /** Stretch when mouse down */\n width: calc(1.06 * var(--uui-toggle-size));\n }\n\n :host([disabled]) #toggle {\n background-color: var(--uui-color-disabled-standalone);\n }\n :host([disabled]) input:checked ~ #toggle {\n background-color: var(--uui-color-disabled-contrast);\n }\n :host([disabled]) #toggle::after {\n background-color: var(--uui-color-disabled);\n }\n :host([disabled]) #toggle #icon-unchecked {\n color: var(--uui-color-disabled-contrast);\n }\n :host([disabled]) label:active #toggle {\n animation: ${UUIHorizontalShakeAnimationValue};\n }\n :host([disabled]) input:checked #toggle #icon-checked {\n color: var(--uui-color-disabled-contrast);\n }\n\n :host(:not([pristine]):invalid) #toggle,\n :host(:not([pristine]):invalid) label:hover #toggle,\n /* polyfill support */\n :host(:not([pristine])[internals-invalid]) #toggle,\n :host(:not([pristine])[internals-invalid]) label:hover #toggle {\n border: 1px solid var(--uui-color-invalid-standalone);\n }\n `,\n ];\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBO,MAAM,oBAAN,MAAM,0BAAyB,uBAAuB;AAAA,EAO3D,cAAc;AACZ,UAAM,QAAQ;AAAA,EAChB;AAAA,EAEA,iBAAiB;AACf,WAAO;AAAA;AAAA,iCAEsB,SAAS;AAAA,mCACP,UAAU;AAAA;AAAA;AAAA,EAG3C;AAkKF;AA/KE,kBAAgB,iBAAiB;AAejC,kBAAyB,SAAS;AAAA,EAChC,GAAG,uBAAuB;AAAA,EAC1B;AAAA,EACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBA8IiB,gCAAgC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AArK9C,IAAM,mBAAN;"}
package/dist/index.d.ts CHANGED
@@ -1,83 +1,3 @@
1
1
  export * from './internal/index.js';
2
2
  export * from './styles/index.js';
3
- export * from './components/button/button.js';
4
- export * from './components/badge/badge.js';
5
- export * from './components/icon/icon.js';
6
- export * from './components/icon-registry/icon-registry.js';
7
- export * from './components/icon-registry-essential/icon-registry-essential.js';
8
- export * from './components/input/input.js';
9
- export * from './components/input-password/input-password.js';
10
- export * from './components/dialog/dialog.js';
11
- export * from './components/dialog-layout/dialog-layout.js';
12
- export * from './components/table/table.js';
13
- export * from './components/label/label.js';
14
- export * from './components/action-bar/action-bar.js';
15
- export * from './components/avatar/avatar.js';
16
- export * from './components/boolean-input/boolean-input.js';
17
- export * from './components/breadcrumbs/breadcrumbs.js';
18
- export * from './components/checkbox/checkbox.js';
19
- export * from './components/color-area/color-area.js';
20
- export * from './components/color-slider/color-slider.js';
21
- export * from './components/color-swatch/color-swatch.js';
22
- export * from './components/form/form.js';
23
- export * from './components/form-layout-item/form-layout-item.js';
24
- export * from './components/form-validation-message/form-validation-message.js';
25
- export * from './components/keyboard-shortcut/keyboard-shortcut.js';
26
- export * from './components/loader/loader.js';
27
- export * from './components/loader-bar/loader-bar.js';
28
- export * from './components/loader-circle/loader-circle.js';
29
- export * from './components/modal/modal.js';
30
- export * from './components/popover-container/popover-container.js';
31
- export * from './components/progress-bar/progress-bar.js';
32
- export * from './components/radio/radio.js';
33
- export * from './components/range-slider/range-slider.js';
34
- export * from './components/responsive-container/responsive-container.js';
35
- export * from './components/scroll-container/scroll-container.js';
36
- export * from './components/select/select.js';
37
- export * from './components/slider/slider.js';
38
- export * from './components/symbol-drag-handle/symbol-drag-handle.js';
39
- export * from './components/symbol-expand/symbol-expand.js';
40
- export * from './components/symbol-file/symbol-file.js';
41
- export * from './components/symbol-folder/symbol-folder.js';
42
- export * from './components/symbol-lock/symbol-lock.js';
43
- export * from './components/symbol-more/symbol-more.js';
44
- export * from './components/symbol-sort/symbol-sort.js';
45
- export * from './components/tag/tag.js';
46
- export * from './components/textarea/textarea.js';
47
- export * from './components/toggle/toggle.js';
48
- export * from './components/visually-hidden/visually-hidden.js';
49
- export * from './components/box/box.js';
50
- export * from './components/card/card.js';
51
- export * from './components/avatar-group/avatar-group.js';
52
- export * from './components/button-group/button-group.js';
53
- export * from './components/button-inline-create/button-inline-create.js';
54
- export * from './components/button-copy-text/button-copy-text.js';
55
- export * from './components/color-swatches/color-swatches.js';
56
- export * from './components/combobox-list/combobox-list.js';
57
- export * from './components/menu-item/menu-item.js';
58
- export * from './components/ref/ref.js';
59
- export * from './components/symbol-file-dropzone/symbol-file-dropzone.js';
60
- export * from './components/tabs/tabs.js';
61
- export * from './components/toast-notification/toast-notification.js';
62
- export * from './components/card-block-type/card-block-type.js';
63
- export * from './components/card-content-node/card-content-node.js';
64
- export * from './components/card-media/card-media.js';
65
- export * from './components/card-user/card-user.js';
66
- export * from './components/ref-list/ref-list.js';
67
- export * from './components/ref-node/ref-node.js';
68
- export * from './components/symbol-file-thumbnail/symbol-file-thumbnail.js';
69
- export * from './components/toast-notification-container/toast-notification-container.js';
70
- export * from './components/toast-notification-layout/toast-notification-layout.js';
71
- export * from './components/input-lock/input-lock.js';
72
- export * from './components/pagination/pagination.js';
73
- export * from './components/ref-node-data-type/ref-node-data-type.js';
74
- export * from './components/ref-node-document-type/ref-node-document-type.js';
75
- export * from './components/ref-node-form/ref-node-form.js';
76
- export * from './components/ref-node-member/ref-node-member.js';
77
- export * from './components/ref-node-package/ref-node-package.js';
78
- export * from './components/ref-node-user/ref-node-user.js';
79
- export * from './components/file-dropzone/file-dropzone.js';
80
- export * from './components/file-preview/file-preview.js';
81
- export * from './components/input-file/input-file.js';
82
- export * from './components/combobox/combobox.js';
83
- export * from './components/color-picker/color-picker.js';
3
+ export * from './components/index.js';
package/dist/internal/mixins/LabelMixin.js CHANGED
@@ -15,9 +15,22 @@ const LabelMixin = (labelSlotName, superClass) => {
15
15
  super(...arguments);
16
16
  this._labelSlotHasContent = false;
17
17
  }
18
+ connectedCallback() {
19
+ super.connectedCallback();
20
+ this._ariaObserver = new MutationObserver(() => this.requestUpdate());
21
+ this._ariaObserver.observe(this, {
22
+ attributes: true,
23
+ attributeFilter: ["aria-label", "aria-labelledby"]
24
+ });
25
+ }
26
+ disconnectedCallback() {
27
+ super.disconnectedCallback();
28
+ this._ariaObserver?.disconnect();
29
+ this._ariaObserver = void 0;
30
+ }
18
31
  firstUpdated(_changedProperties) {
19
32
  super.firstUpdated(_changedProperties);
20
- if (!this.label) {
33
+ if (!this.label && !this.getAttribute("aria-label") && !this.getAttribute("aria-labelledby")) {
21
34
  console.warn(this.tagName + " needs a `label`", this);
22
35
  }
23
36
  }
package/dist/internal/mixins/LabelMixin.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"LabelMixin.js","sources":["../../../src/internal/mixins/LabelMixin.ts"],"sourcesContent":["import type { LitElement, TemplateResult } from 'lit';\nimport { html } from 'lit';\nimport { property, state } from 'lit/decorators.js';\n\ntype Constructor<T = {}> = new (...args: any[]) => T;\n\nexport declare class UUILabelMixinInterface {\n /**\n * Label to be used for aria-label and potentially as visual label for some components\n * @type {string}\n * @prop\n * @attr\n */\n label: string;\n protected renderLabel(): TemplateResult;\n}\n\n/**\n * This mixin provides label functionality to other components. In the mixed component the label can be provided either via reactive label property, or through slot that this mixin contains. You can style the label template through .label selector.\n *\n * @param {string} labelSlotName - Name that will be assigned for the label slot\n * @param {Object} superClass - superclass to be extended.\n * @mixin\n */\nexport const LabelMixin = <T extends Constructor<LitElement>>(\n labelSlotName: string | null,\n superClass: T,\n) => {\n /**\n * Label mixin class containing the label functionality.\n */\n class UUILabelMixinClass extends superClass {\n /**\n * Label to be used for aria-label and potentially as visual label for some components\n * @type {string}\n * @attr\n */\n @property({ type: String })\n public label!: string;\n\n firstUpdated(_changedProperties: Map<string | number | symbol, unknown>) {\n super.firstUpdated(_changedProperties);\n if (!this.label) {\n console.warn(this.tagName + ' needs a `label`', this);\n }\n }\n\n @state()\n private _labelSlotHasContent = false;\n\n private labelSlotChanged(e: Event): void {\n this._labelSlotHasContent =\n (e.target as HTMLSlotElement).assignedNodes({ flatten: true }).length >\n 0;\n }\n\n /**\n * Call in the mixed element to render the label template. It contains a slot. This is optional.\n * @method renderLabel\n * @returns {TemplateResult}\n */\n protected renderLabel() {\n return html`\n ${this._labelSlotHasContent === false\n ? html`<span class=\"label\">${this.label}</span>`\n : ''}\n <slot\n class=\"label\"\n style=${this._labelSlotHasContent ? '' : 'display: none'}\n name=${labelSlotName || ''}\n @slotchange=${this.labelSlotChanged}></slot>\n `;\n }\n }\n return UUILabelMixinClass as unknown as Constructor<UUILabelMixinInterface> &\n T;\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAwBO,MAAM,aAAa,CACxB,eACA,eACG;AAAA,EAIH,MAAM,2BAA2B,WAAW;AAAA,IAA5C,cAAA;AAAA,YAAA,GAAA,SAAA;AAiBE,WAAQ,uBAAuB;AAAA,IAAA;AAAA,IAR/B,aAAa,oBAA4D;AACvE,YAAM,aAAa,kBAAkB;AACrC,UAAI,CAAC,KAAK,OAAO;AACf,gBAAQ,KAAK,KAAK,UAAU,oBAAoB,IAAI;AAAA,MACtD;AAAA,IACF;AAAA,IAKQ,iBAAiB,GAAgB;AACvC,WAAK,uBACF,EAAE,OAA2B,cAAc,EAAE,SAAS,KAAA,CAAM,EAAE,SAC/D;AAAA,IACJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOU,cAAc;AACtB,aAAO;AAAA,UACH,KAAK,yBAAyB,QAC5B,2BAA2B,KAAK,KAAK,YACrC,EAAE;AAAA;AAAA;AAAA,kBAGI,KAAK,uBAAuB,KAAK,eAAe;AAAA,iBACjD,iBAAiB,EAAE;AAAA,wBACZ,KAAK,gBAAgB;AAAA;AAAA,IAEzC;AAAA,EAAA;AAlCO,kBAAA;AAAA,IADN,SAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,EAAA,GANtB,mBAOG,WAAA,OAAA;AAUC,kBAAA;AAAA,IADP,MAAA;AAAA,EAAM,GAhBH,mBAiBI,WAAA,sBAAA;AA0BV,SAAO;AAET;"}
1
+ {"version":3,"file":"LabelMixin.js","sources":["../../../src/internal/mixins/LabelMixin.ts"],"sourcesContent":["import type { LitElement, TemplateResult } from 'lit';\nimport { html } from 'lit';\nimport { property, state } from 'lit/decorators.js';\n\ntype Constructor<T = {}> = new (...args: any[]) => T;\n\nexport declare class UUILabelMixinInterface {\n /**\n * Label to be used for aria-label and potentially as visual label for some components\n * @type {string}\n * @prop\n * @attr\n */\n label: string;\n protected renderLabel(): TemplateResult;\n}\n\n/**\n * This mixin provides label functionality to other components. In the mixed component the label can be provided either via reactive label property, or through slot that this mixin contains. You can style the label template through .label selector.\n *\n * @param {string} labelSlotName - Name that will be assigned for the label slot\n * @param {Object} superClass - superclass to be extended.\n * @mixin\n */\nexport const LabelMixin = <T extends Constructor<LitElement>>(\n labelSlotName: string | null,\n superClass: T,\n) => {\n /**\n * Label mixin class containing the label functionality.\n */\n class UUILabelMixinClass extends superClass {\n /**\n * Label to be used for aria-label and potentially as visual label for some components\n * @type {string}\n * @attr\n */\n @property({ type: String })\n public label!: string;\n\n private _ariaObserver: MutationObserver | undefined;\n\n connectedCallback() {\n super.connectedCallback();\n this._ariaObserver = new MutationObserver(() => this.requestUpdate());\n this._ariaObserver.observe(this, {\n attributes: true,\n attributeFilter: ['aria-label', 'aria-labelledby'],\n });\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this._ariaObserver?.disconnect();\n this._ariaObserver = undefined;\n }\n\n firstUpdated(_changedProperties: Map<string | number | symbol, unknown>) {\n super.firstUpdated(_changedProperties);\n if (\n !this.label &&\n !this.getAttribute('aria-label') &&\n !this.getAttribute('aria-labelledby')\n ) {\n console.warn(this.tagName + ' needs a `label`', this);\n }\n }\n\n @state()\n private _labelSlotHasContent = false;\n\n private labelSlotChanged(e: Event): void {\n this._labelSlotHasContent =\n (e.target as HTMLSlotElement).assignedNodes({ flatten: true }).length >\n 0;\n }\n\n /**\n * Call in the mixed element to render the label template. It contains a slot. This is optional.\n * @method renderLabel\n * @returns {TemplateResult}\n */\n protected renderLabel() {\n return html`\n ${this._labelSlotHasContent === false\n ? html`<span class=\"label\">${this.label}</span>`\n : ''}\n <slot\n class=\"label\"\n style=${this._labelSlotHasContent ? '' : 'display: none'}\n name=${labelSlotName || ''}\n @slotchange=${this.labelSlotChanged}></slot>\n `;\n }\n }\n return UUILabelMixinClass as unknown as Constructor<UUILabelMixinInterface> &\n T;\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAwBO,MAAM,aAAa,CACxB,eACA,eACG;AAAA,EAIH,MAAM,2BAA2B,WAAW;AAAA,IAA5C,cAAA;AAAA,YAAA,GAAA,SAAA;AAsCE,WAAQ,uBAAuB;AAAA,IAAA;AAAA,IA3B/B,oBAAoB;AAClB,YAAM,kBAAA;AACN,WAAK,gBAAgB,IAAI,iBAAiB,MAAM,KAAK,eAAe;AACpE,WAAK,cAAc,QAAQ,MAAM;AAAA,QAC/B,YAAY;AAAA,QACZ,iBAAiB,CAAC,cAAc,iBAAiB;AAAA,MAAA,CAClD;AAAA,IACH;AAAA,IAEA,uBAAuB;AACrB,YAAM,qBAAA;AACN,WAAK,eAAe,WAAA;AACpB,WAAK,gBAAgB;AAAA,IACvB;AAAA,IAEA,aAAa,oBAA4D;AACvE,YAAM,aAAa,kBAAkB;AACrC,UACE,CAAC,KAAK,SACN,CAAC,KAAK,aAAa,YAAY,KAC/B,CAAC,KAAK,aAAa,iBAAiB,GACpC;AACA,gBAAQ,KAAK,KAAK,UAAU,oBAAoB,IAAI;AAAA,MACtD;AAAA,IACF;AAAA,IAKQ,iBAAiB,GAAgB;AACvC,WAAK,uBACF,EAAE,OAA2B,cAAc,EAAE,SAAS,KAAA,CAAM,EAAE,SAC/D;AAAA,IACJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOU,cAAc;AACtB,aAAO;AAAA,UACH,KAAK,yBAAyB,QAC5B,2BAA2B,KAAK,KAAK,YACrC,EAAE;AAAA;AAAA;AAAA,kBAGI,KAAK,uBAAuB,KAAK,eAAe;AAAA,iBACjD,iBAAiB,EAAE;AAAA,wBACZ,KAAK,gBAAgB;AAAA;AAAA,IAEzC;AAAA,EAAA;AAvDO,kBAAA;AAAA,IADN,SAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,EAAA,GANtB,mBAOG,WAAA,OAAA;AA+BC,kBAAA;AAAA,IADP,MAAA;AAAA,EAAM,GArCH,mBAsCI,WAAA,sBAAA;AA0BV,SAAO;AAET;"}
package/dist/internal/mixins/SelectOnlyMixin.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { UUISelectableMixinInterface } from './SelectableMixin.js';
1
+ import type { UUISelectableMixinInterface } from './SelectableMixin.js';
2
2
  type Constructor<T = {}> = new (...args: any[]) => T;
3
3
  export declare class UUISelectOnlyMixinInterface extends UUISelectableMixinInterface {
4
4
  selectOnly: boolean;
package/dist/internal/mixins/SelectOnlyMixin.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"SelectOnlyMixin.js","sources":["../../../src/internal/mixins/SelectOnlyMixin.ts"],"sourcesContent":["import { property } from 'lit/decorators.js';\nimport { UUISelectableMixinInterface } from './SelectableMixin.js';\n\ntype Constructor<T = {}> = new (...args: any[]) => T;\n\nexport declare class UUISelectOnlyMixinInterface extends UUISelectableMixinInterface {\n selectOnly: boolean;\n}\n\n/**\n * This mixin partly provides the select-only functionality.\n * Each component still need to implement its own code for disabling interaction when select only is active.\n *\n * @param {Object} superClass - superclass to be extended.\n * @mixin\n */\nexport const SelectOnlyMixin = <\n T extends Constructor<UUISelectableMixinInterface>,\n>(\n superClass: T,\n) => {\n class UUISelectOnlyMixinClass extends superClass {\n private _selectOnly = false;\n\n /**\n * Enforce selection interaction and prevent all other interactions, set this when the UI is turned into Selection-Mode.\n * @attr\n * @type boolean\n */\n @property({ type: Boolean, reflect: true, attribute: 'select-only' })\n get selectOnly() {\n return this._selectOnly;\n }\n set selectOnly(newVal) {\n const oldVal = this._selectOnly;\n this._selectOnly = newVal;\n this.requestUpdate('selectOnly', oldVal);\n }\n }\n // prettier-ignore\n return (UUISelectOnlyMixinClass as unknown) as Constructor<UUISelectOnlyMixinInterface> & T;\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAgBO,MAAM,kBAAkB,CAG7B,eACG;AAAA,EACH,MAAM,gCAAgC,WAAW;AAAA,IAAjD,cAAA;AAAA,YAAA,GAAA,SAAA;AACE,WAAQ,cAAc;AAAA,IAAA;AAAA,IAQtB,IAAI,aAAa;AACf,aAAO,KAAK;AAAA,IACd;AAAA,IACA,IAAI,WAAW,QAAQ;AACrB,YAAM,SAAS,KAAK;AACpB,WAAK,cAAc;AACnB,WAAK,cAAc,cAAc,MAAM;AAAA,IACzC;AAAA,EAAA;AAPI,kBAAA;AAAA,IADH,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM,WAAW,eAAe;AAAA,EAAA,GARhE,wBASA,WAAA,YAAA;AAUN,SAAQ;AACV;"}
1
+ {"version":3,"file":"SelectOnlyMixin.js","sources":["../../../src/internal/mixins/SelectOnlyMixin.ts"],"sourcesContent":["import { property } from 'lit/decorators.js';\nimport type { UUISelectableMixinInterface } from './SelectableMixin.js';\n\ntype Constructor<T = {}> = new (...args: any[]) => T;\n\nexport declare class UUISelectOnlyMixinInterface extends UUISelectableMixinInterface {\n selectOnly: boolean;\n}\n\n/**\n * This mixin partly provides the select-only functionality.\n * Each component still need to implement its own code for disabling interaction when select only is active.\n *\n * @param {Object} superClass - superclass to be extended.\n * @mixin\n */\nexport const SelectOnlyMixin = <\n T extends Constructor<UUISelectableMixinInterface>,\n>(\n superClass: T,\n) => {\n class UUISelectOnlyMixinClass extends superClass {\n private _selectOnly = false;\n\n /**\n * Enforce selection interaction and prevent all other interactions, set this when the UI is turned into Selection-Mode.\n * @attr\n * @type boolean\n */\n @property({ type: Boolean, reflect: true, attribute: 'select-only' })\n get selectOnly() {\n return this._selectOnly;\n }\n set selectOnly(newVal) {\n const oldVal = this._selectOnly;\n this._selectOnly = newVal;\n this.requestUpdate('selectOnly', oldVal);\n }\n }\n // prettier-ignore\n return (UUISelectOnlyMixinClass as unknown) as Constructor<UUISelectOnlyMixinInterface> & T;\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAgBO,MAAM,kBAAkB,CAG7B,eACG;AAAA,EACH,MAAM,gCAAgC,WAAW;AAAA,IAAjD,cAAA;AAAA,YAAA,GAAA,SAAA;AACE,WAAQ,cAAc;AAAA,IAAA;AAAA,IAQtB,IAAI,aAAa;AACf,aAAO,KAAK;AAAA,IACd;AAAA,IACA,IAAI,WAAW,QAAQ;AACrB,YAAM,SAAS,KAAK;AACpB,WAAK,cAAc;AACnB,WAAK,cAAc,cAAc,MAAM;AAAA,IACzC;AAAA,EAAA;AAPI,kBAAA;AAAA,IADH,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM,WAAW,eAAe;AAAA,EAAA,GARhE,wBASA,WAAA,YAAA;AAUN,SAAQ;AACV;"}
package/dist/package.json.js CHANGED
@@ -1,4 +1,4 @@
1
- const version = "2.0.0-alpha.0";
1
+ const version = "2.0.0-rc.0";
2
2
  export {
3
3
  version
4
4
  };
package/dist/themes/dark.css CHANGED
@@ -1 +1 @@
1
- @font-face{font-family:Lato;src:local("LatoLatin Black"),local("LatoLatin-Black"),url(../assets/fonts/LatoLatin-Black.woff2) format("woff2");font-style:normal;font-display:swap;font-weight:900;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin BlackItalic"),local("LatoLatin-BlackItalic"),url(../assets/fonts/LatoLatin-BlackItalic.woff2) format("woff2");font-style:italic;font-weight:900;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Bold"),local("LatoLatin-Bold"),url(../assets/fonts/LatoLatin-Bold.woff2) format("woff2");font-style:normal;font-weight:700;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin BoldItalic"),local("LatoLatin-BoldItalic"),url(../assets/fonts/LatoLatin-BoldItalic.woff2) format("woff2");font-style:italic;font-weight:700;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Italic"),local("LatoLatin-Italic"),url(../assets/fonts/LatoLatin-Italic.woff2) format("woff2");font-style:italic;font-weight:400;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Regular"),local("LatoLatin-Regular"),url(../assets/fonts/LatoLatin-Regular.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Light"),local("LatoLatin-Light"),url(../assets/fonts/LatoLatin-Light.woff2) format("woff2");font-style:normal;font-weight:300;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin LightItalic"),local("LatoLatin-LightItalic"),url(../assets/fonts/LatoLatin-LightItalic.woff2) format("woff2");font-style:italic;font-weight:300;font-display:swap;text-rendering:optimizeLegibility}:root{--uui-size-1: 3px;--uui-size-2: 6px;--uui-size-3: 9px;--uui-size-4: 12px;--uui-size-5: 15px;--uui-size-6: 18px;--uui-size-7: 21px;--uui-size-8: 24px;--uui-size-9: 27px;--uui-size-10: 30px;--uui-size-11: 33px;--uui-size-12: 36px;--uui-size-14: 42px;--uui-size-16: 48px;--uui-size-20: 60px;--uui-size-22: 66px;--uui-size-24: 72px;--uui-size-28: 84px;--uui-size-32: 96px;--uui-size-36: 108px;--uui-size-40: 120px;--uui-size-44: 132px;--uui-size-46: 138px;--uui-size-48: 144px;--uui-size-52: 156px;--uui-size-56: 168px;--uui-size-60: 180px;--uui-size-64: 192px;--uui-size-72: 216px;--uui-size-80: 240px;--uui-size-96: 288px;--uui-size-100: 300px;--uui-size-space-1: 3px;--uui-size-space-2: 6px;--uui-size-space-3: 9px;--uui-size-space-4: 12px;--uui-size-space-5: 18px;--uui-size-space-6: 24px;--uui-size-layout-1: 24px;--uui-size-layout-2: 30px;--uui-size-layout-3: 42px;--uui-size-layout-4: 66px;--uui-size-layout-5: 96px;--uui-size-layout-6: 138px;--uui-border-radius: var(--uui-size-3);--uui-border-radius-1: var(--uui-size-2);--uui-border-radius-2: var(--uui-size-3);--uui-border-radius-3: var(--uui-size-5);--uui-type-default-size: 14px;--uui-type-small-size: 12px;--uui-type-h1-size: 60px;--uui-type-h2-size: 42px;--uui-type-h3-size: 30px;--uui-type-h4-size: 21px;--uui-type-h5-size: var(--uui-type-default-size);--uui-type-h6-size: var(--uui-type-small-size)}:root{--uui-shadow-depth-1: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);--uui-shadow-depth-2: 0 3px 6px rgba(0, 0, 0, .16), 0 3px 6px rgba(0, 0, 0, .23);--uui-shadow-depth-3: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23);--uui-shadow-depth-4: 0 14px 28px rgba(0, 0, 0, .25), 0 10px 10px rgba(0, 0, 0, .22);--uui-shadow-depth-5: 0 19px 38px rgba(0, 0, 0, .3), 0 15px 12px rgba(0, 0, 0, .22)}:root{--uui-palette-deep-saffron: #f79c37;--uui-palette-deep-saffron-light: rgb(249, 181, 103);--uui-palette-deep-saffron-dark: rgb(222, 145, 56);--uui-palette-deep-saffron-dimmed: rgb(166, 150, 133);--uui-palette-sunglow: #fad634;--uui-palette-sunglow-light: rgb(251, 224, 101);--uui-palette-sunglow-dark: rgb(224, 193, 51);--uui-palette-sunglow-dimmed: rgb(166, 160, 133);--uui-palette-spanish-pink: #f5c1bc;--uui-palette-spanish-pink-light: rgb(248, 214, 211);--uui-palette-spanish-pink-dark: rgb(232, 192, 189);--uui-palette-spanish-pink-dimmed: rgb(219, 212, 212);--uui-palette-gunmetal: #162335;--uui-palette-gunmetal-light: rgb(35, 55, 83);--uui-palette-gunmetal-dark: rgb(23, 27, 33);--uui-palette-gunmetal-dimmed: rgb(54, 54, 54);--uui-palette-space-cadet: #1b264f;--uui-palette-space-cadet-light: rgb(38, 53, 110);--uui-palette-space-cadet-dark: rgb(28, 35, 59);--uui-palette-space-cadet-dimmed: rgb(106, 117, 154);--uui-palette-violet-blue: #283a97;--uui-palette-violet-blue-light: #2d42ab;--uui-palette-violet-blue-dark: #25358b;--uui-palette-violet-blue-dimmed: #2c3669;--uui-palette-malibu: #3879ff;--uui-palette-malibu-light: rgb(97, 150, 255);--uui-palette-malibu-dark: rgb(56, 116, 235);--uui-palette-malibu-dimmed: rgb(115, 120, 130);--uui-palette-maroon-flush: #c31d4c;--uui-palette-maroon-flush-light: rgb(223, 42, 93);--uui-palette-maroon-flush-dark: rgb(174, 30, 71);--uui-palette-maroon-flush-dimmed: rgb(122, 98, 104);--uui-palette-jungle-green: #2bc37c;--uui-palette-jungle-green-light: rgb(58, 212, 140);--uui-palette-jungle-green-dark: rgb(43, 179, 115);--uui-palette-jungle-green-dimmed: rgb(102, 135, 120);--uui-palette-forest-green: #0b8152;--uui-palette-forest-green-light: rgb(13, 155, 98);--uui-palette-forest-green-dark: rgb(10, 115, 73);--uui-palette-forest-green-dimmed: rgb(46, 89, 72);--uui-palette-cocoa-black: #191715;--uui-palette-cocoa-black-light: rgb(39, 36, 32);--uui-palette-cocoa-black-dark: rgb(20, 20, 20);--uui-palette-cocoa-black-dimmed: rgb(48, 48, 48);--uui-palette-dune-black: #2e2b29;--uui-palette-dune-black-light: rgb(57, 53, 50);--uui-palette-dune-black-dark: rgb(38, 38, 38);--uui-palette-dune-black-dimmed: rgb(64, 64, 64);--uui-palette-cocoa-brown: #332a24;--uui-palette-cocoa-brown-light: rgb(66, 54, 47);--uui-palette-cocoa-brown-dark: rgb(38, 37, 36);--uui-palette-cocoa-brown-dimmed: rgb(43, 43, 43);--uui-palette-chamoisee: #9d8057;--uui-palette-chamoisee-light: rgb(175, 148, 110);--uui-palette-chamoisee-dark: rgb(138, 116, 87);--uui-palette-chamoisee-dimmed: rgb(115, 113, 110);--uui-palette-timberwolf: #e2dad4;--uui-palette-timberwolf-light: rgb(243, 239, 237);--uui-palette-timberwolf-dark: rgb(208, 208, 208);--uui-palette-timberwolf-dimmed: rgb(207, 207, 207);--uui-palette-gravel: #d8d7d9;--uui-palette-gravel-light: rgb(237, 237, 238);--uui-palette-gravel-dark: rgb(200, 200, 200);--uui-palette-gravel-dimmed: rgb(204, 204, 204);--uui-palette-sand: #f6f6f7;--uui-palette-sand-light: rgb(255, 255, 255);--uui-palette-sand-dark: rgb(226, 226, 226);--uui-palette-sand-dimmed: rgb(231, 231, 231);--uui-palette-white: #fefefe;--uui-palette-white-light: rgb(255, 255, 255);--uui-palette-white-dark: rgb(250, 250, 250);--uui-palette-white-dimmed: rgb(228, 228, 228);--uui-palette-black: #060606;--uui-palette-black-light: rgb(26, 26, 26);--uui-palette-black-dark: rgb(5, 5, 5);--uui-palette-black-dimmed: rgb(36, 36, 36);--uui-palette-grey: #c4c4c4;--uui-palette-grey-light: rgb(222, 222, 222);--uui-palette-grey-dark: rgb(179, 179, 179);--uui-palette-grey-dimmed: rgb(189, 189, 189);--uui-palette-dusty-grey: #9b9b9b;--uui-palette-dusty-grey-light: rgb(176, 176, 176);--uui-palette-dusty-grey-dark: rgb(141, 141, 141);--uui-palette-dusty-grey-dimmed: rgb(186, 186, 186);--uui-palette-mine-grey: #3e3e3e;--uui-palette-mine-grey-light: rgb(82, 82, 82);--uui-palette-mine-grey-dark: rgb(56, 56, 56);--uui-palette-mine-grey-dimmed: rgb(87, 87, 87)}:root{--uui-font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif}:root{--uui-color-selected: #2a72b6;--uui-color-selected-emphasis: #3385d1;--uui-color-selected-standalone: #215b91;--uui-color-selected-contrast: white;--uui-color-current: #d49e98;--uui-color-current-emphasis: #dbaea9;--uui-color-current-standalone: #c3786f;--uui-color-current-contrast: #1b264f;--uui-color-header-surface: #14171b;--uui-color-header-contrast: rgba(255, 255, 255, .8);--uui-color-header-contrast-emphasis: #fff;--uui-color-focus: #2294ff;--uui-color-disabled: #373e47;--uui-color-disabled-standalone: #444c55;--uui-color-disabled-contrast: #636e7b;--uui-color-surface: #2d333b;--uui-color-surface-alt: #373e47;--uui-color-surface-emphasis: #373e47;--uui-color-background: #22272e;--uui-color-text: #cdd9e5;--uui-color-text-alt: #636e7b;--uui-color-interactive: #51abff;--uui-color-interactive-emphasis: #7dc0ff;--uui-color-border: #4d5661;--uui-color-border-standalone: #59636e;--uui-color-border-emphasis: #697380;--uui-color-divider: #383d44;--uui-color-divider-standalone: #444c56;--uui-color-divider-emphasis: #4f5864;--uui-color-default: #2c70d6;--uui-color-default-emphasis: #3886fc;--uui-color-default-standalone: #88bdff;--uui-color-default-contrast: white;--uui-color-warning: #977b00;--uui-color-warning-emphasis: #bda22b;--uui-color-warning-standalone: #ffd82c;--uui-color-warning-contrast: white;--uui-color-danger: #8a2944;--uui-color-danger-emphasis: #a03452;--uui-color-danger-standalone: #ff7a9f;--uui-color-danger-contrast: white;--uui-color-invalid: #8a2944;--uui-color-invalid-emphasis: #a03452;--uui-color-invalid-standalone: #ff7a9f;--uui-color-invalid-contrast: white;--uui-color-positive: #26793e;--uui-color-positive-emphasis: #358f4e;--uui-color-positive-standalone: #52d176;--uui-color-positive-contrast: white}
1
+ @font-face{font-family:Lato;src:local("LatoLatin Black"),local("LatoLatin-Black"),url(../assets/fonts/LatoLatin-Black.woff2) format("woff2");font-style:normal;font-display:swap;font-weight:900;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin BlackItalic"),local("LatoLatin-BlackItalic"),url(../assets/fonts/LatoLatin-BlackItalic.woff2) format("woff2");font-style:italic;font-weight:900;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Bold"),local("LatoLatin-Bold"),url(../assets/fonts/LatoLatin-Bold.woff2) format("woff2");font-style:normal;font-weight:700;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin BoldItalic"),local("LatoLatin-BoldItalic"),url(../assets/fonts/LatoLatin-BoldItalic.woff2) format("woff2");font-style:italic;font-weight:700;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Italic"),local("LatoLatin-Italic"),url(../assets/fonts/LatoLatin-Italic.woff2) format("woff2");font-style:italic;font-weight:400;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Regular"),local("LatoLatin-Regular"),url(../assets/fonts/LatoLatin-Regular.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Light"),local("LatoLatin-Light"),url(../assets/fonts/LatoLatin-Light.woff2) format("woff2");font-style:normal;font-weight:300;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin LightItalic"),local("LatoLatin-LightItalic"),url(../assets/fonts/LatoLatin-LightItalic.woff2) format("woff2");font-style:italic;font-weight:300;font-display:swap;text-rendering:optimizeLegibility}:root{--uui-size-1: 3px;--uui-size-2: 6px;--uui-size-3: 9px;--uui-size-4: 12px;--uui-size-5: 15px;--uui-size-6: 18px;--uui-size-7: 21px;--uui-size-8: 24px;--uui-size-9: 27px;--uui-size-10: 30px;--uui-size-11: 33px;--uui-size-12: 36px;--uui-size-14: 42px;--uui-size-16: 48px;--uui-size-20: 60px;--uui-size-22: 66px;--uui-size-24: 72px;--uui-size-28: 84px;--uui-size-32: 96px;--uui-size-36: 108px;--uui-size-40: 120px;--uui-size-44: 132px;--uui-size-46: 138px;--uui-size-48: 144px;--uui-size-52: 156px;--uui-size-56: 168px;--uui-size-60: 180px;--uui-size-64: 192px;--uui-size-72: 216px;--uui-size-80: 240px;--uui-size-96: 288px;--uui-size-100: 300px;--uui-size-space-1: 3px;--uui-size-space-2: 6px;--uui-size-space-3: 9px;--uui-size-space-4: 12px;--uui-size-space-5: 18px;--uui-size-space-6: 24px;--uui-size-layout-1: 24px;--uui-size-layout-2: 30px;--uui-size-layout-3: 42px;--uui-size-layout-4: 66px;--uui-size-layout-5: 96px;--uui-size-layout-6: 138px;--uui-border-radius: var(--uui-size-3);--uui-border-radius-1: var(--uui-size-2);--uui-border-radius-2: var(--uui-size-3);--uui-border-radius-3: var(--uui-size-5);--uui-type-default-size: 14px;--uui-type-small-size: 12px;--uui-type-h1-size: 60px;--uui-type-h2-size: 42px;--uui-type-h3-size: 30px;--uui-type-h4-size: 21px;--uui-type-h5-size: var(--uui-type-default-size);--uui-type-h6-size: var(--uui-type-small-size)}:root{--uui-shadow-depth-1: rgba(0, 0, 0, .1) 0px 1px 6px 0, rgba(0, 0, 0, .1) 0 0 1px 0;--uui-shadow-depth-2: rgba(0, 0, 0, .1) 0px 3px 12px 0, rgba(0, 0, 0, .1) 0 0 1px 0;--uui-shadow-depth-3: rgba(0, 0, 0, .1) 0px 6px 16px 0, rgba(0, 0, 0, .1) 0 0 2px 0;--uui-shadow-depth-4: rgba(0, 0, 0, .2) 0px 9px 20px 0, rgba(0, 0, 0, .18) 0 0 3px 0;--uui-shadow-depth-5: rgba(0, 0, 0, .3) 0px 12px 24px 0, rgba(0, 0, 0, .1) 0px 6px 16px 0, rgba(0, 0, 0, .1) 0 0 2px 0}:root{--uui-palette-deep-saffron: #f79c37;--uui-palette-deep-saffron-light: rgb(249, 181, 103);--uui-palette-deep-saffron-dark: rgb(222, 145, 56);--uui-palette-deep-saffron-dimmed: rgb(166, 150, 133);--uui-palette-sunglow: #fad634;--uui-palette-sunglow-light: rgb(251, 224, 101);--uui-palette-sunglow-dark: #a17700;--uui-palette-sunglow-dimmed: rgb(166, 160, 133);--uui-palette-spanish-pink: #ffe8e6;--uui-palette-spanish-pink-light: #ffeceb;--uui-palette-spanish-pink-dark: #ffe2e0;--uui-palette-spanish-pink-dimmed: #fae6e5;--uui-palette-gunmetal: #162335;--uui-palette-gunmetal-light: rgb(35, 55, 83);--uui-palette-gunmetal-dark: rgb(23, 27, 33);--uui-palette-gunmetal-dimmed: rgb(54, 54, 54);--uui-palette-space-cadet: #1b264f;--uui-palette-space-cadet-light: rgb(38, 53, 110);--uui-palette-space-cadet-dark: rgb(28, 35, 59);--uui-palette-space-cadet-dimmed: rgb(106, 117, 154);--uui-palette-violet-blue: #283a97;--uui-palette-violet-blue-light: #2d42ab;--uui-palette-violet-blue-dark: #25358b;--uui-palette-violet-blue-dimmed: #2c3669;--uui-palette-malibu: #3879ff;--uui-palette-malibu-light: rgb(97, 150, 255);--uui-palette-malibu-dark: rgb(56, 116, 235);--uui-palette-malibu-dimmed: rgb(115, 120, 130);--uui-palette-maroon-flush: #df2a5d;--uui-palette-maroon-flush-light: #ec275f;--uui-palette-maroon-flush-dark: rgb(174, 30, 71);--uui-palette-maroon-flush-dimmed: rgb(122, 98, 104);--uui-palette-jungle-green: #2bc37c;--uui-palette-jungle-green-light: rgb(58, 212, 140);--uui-palette-jungle-green-dark: rgb(43, 179, 115);--uui-palette-jungle-green-dimmed: rgb(102, 135, 120);--uui-palette-forest-green: #0b8152;--uui-palette-forest-green-light: rgb(13, 155, 98);--uui-palette-forest-green-dark: rgb(10, 115, 73);--uui-palette-forest-green-dimmed: rgb(46, 89, 72);--uui-palette-cocoa-black: #191715;--uui-palette-cocoa-black-light: rgb(39, 36, 32);--uui-palette-cocoa-black-dark: rgb(20, 20, 20);--uui-palette-cocoa-black-dimmed: rgb(48, 48, 48);--uui-palette-dune-black: #2e2b29;--uui-palette-dune-black-light: rgb(57, 53, 50);--uui-palette-dune-black-dark: rgb(38, 38, 38);--uui-palette-dune-black-dimmed: rgb(64, 64, 64);--uui-palette-cocoa-brown: #332a24;--uui-palette-cocoa-brown-light: rgb(66, 54, 47);--uui-palette-cocoa-brown-dark: rgb(38, 37, 36);--uui-palette-cocoa-brown-dimmed: rgb(43, 43, 43);--uui-palette-chamoisee: #9d8057;--uui-palette-chamoisee-light: rgb(175, 148, 110);--uui-palette-chamoisee-dark: rgb(138, 116, 87);--uui-palette-chamoisee-dimmed: rgb(115, 113, 110);--uui-palette-timberwolf: #e2dad4;--uui-palette-timberwolf-light: rgb(243, 239, 237);--uui-palette-timberwolf-dark: rgb(208, 208, 208);--uui-palette-timberwolf-dimmed: rgb(207, 207, 207);--uui-palette-gravel: #d8d7d9;--uui-palette-gravel-light: rgb(237, 237, 238);--uui-palette-gravel-dark: rgb(200, 200, 200);--uui-palette-gravel-dimmed: rgb(204, 204, 204);--uui-palette-sand: #f7f7f8;--uui-palette-sand-light: rgb(255, 255, 255);--uui-palette-sand-dark: rgb(226, 226, 226);--uui-palette-sand-dimmed: rgb(231, 231, 231);--uui-palette-white: #fefefe;--uui-palette-white-light: rgb(255, 255, 255);--uui-palette-white-dark: rgb(250, 250, 250);--uui-palette-white-dimmed: rgb(228, 228, 228);--uui-palette-black: #060606;--uui-palette-black-light: rgb(26, 26, 26);--uui-palette-black-dark: rgb(5, 5, 5);--uui-palette-black-dimmed: rgb(36, 36, 36);--uui-palette-grey: #c4c4c4;--uui-palette-grey-light: rgb(222, 222, 222);--uui-palette-grey-dark: rgb(179, 179, 179);--uui-palette-grey-dimmed: rgb(189, 189, 189);--uui-palette-dusty-grey: #9b9b9b;--uui-palette-dusty-grey-light: rgb(176, 176, 176);--uui-palette-dusty-grey-dark: rgb(141, 141, 141);--uui-palette-dusty-grey-dimmed: rgb(186, 186, 186);--uui-palette-mine-grey: #3e3e3e;--uui-palette-mine-grey-light: rgb(82, 82, 82);--uui-palette-mine-grey-dark: rgb(56, 56, 56);--uui-palette-mine-grey-dimmed: rgb(87, 87, 87)}:root{--uui-font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif}.uui-font{font-family:Lato,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:14px;line-height:calc(var(--uui-size-2) * 4);-webkit-font-smoothing:antialiased}.uui-h1,.uui-h2,.uui-h3,.uui-h4,.uui-h5,.uui-a,.uui-p,.uui-p-lead,.uui-small,.uui-quoteblock,.uui-ul,.uui-ol,.uui-text{font-family:Lato,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:14px;line-height:21px;-webkit-font-smoothing:antialiased}.uui-text h1,.uui-h1.uui-h1{font-size:var(--uui-type-h1-size);line-height:var(--uui-size-layout-4);font-weight:400;margin-left:-5px;margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-text p+h1,.uui-text p+.uui-h1{margin-top:var(--uui-size-layout-4)}.uui-text h1.--no-top-margin,.uui-text h1:first-child,.uui-h1.--no-top-margin,.uui-h1:first-child{margin-top:0}.uui-text h2,.uui-h2.uui-h2{font-size:var(--uui-type-h2-size);line-height:var(--uui-size-layout-3);font-weight:400;margin-left:-3px;margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-text p+h2,.uui-text p+.uui-h2{margin-top:var(--uui-size-layout-3)}.uui-text h2.--no-top-margin,.uui-text h2:first-child,.uui-h2.--no-top-margin,.uui-h2:first-child{margin-top:0}.uui-text h3,.uui-h3.uui-h3{font-size:var(--uui-type-h3-size);line-height:var(--uui-size-large);font-weight:400;margin-left:-2px;margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-text h3.--no-top-margin,.uui-text h3:first-child,.uui-h3.--no-top-margin,.uui-h3:first-child{margin-top:0}.uui-text h4,.uui-h4.uui-h4{font-size:var(--uui-type-h4-size);line-height:21px;font-weight:400;margin-left:-1px;margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-text h4.--no-top-margin,.uui-text h4:first-child,.uui-h4.--no-top-margin,.uui-h4:first-child{margin-top:0}.uui-text h5,.uui-h5.uui-h5{font-size:var(--uui-type-h5-size);line-height:inherit;font-weight:400;margin-left:0;margin-top:var(--uui-size-layout-1);margin-bottom:0}.uui-text h5.--no-top-margin,.uui-text h5:first-child,.uui-h5.--no-top-margin,.uui-h5:first-child{margin-top:0}.uui-p,.uui-text p{margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-p-lead,.uui-text p.uui-lead{font-size:var(--uui-size-6);line-height:var(--uui-size-8)}.uui-a,.uui-text a,.uui-a:link,.uui-a:active .uui-text a:link,.uui-text a:active{color:var(--uui-color-interactive)}.uui-a:hover,.uui-text a:hover{color:var(--uui-color-interactive-emphasis)}.uui-small,.uui-text small{display:inline-block;font-size:var(--uui-type-small-size);line-height:18px}.uui-quoteblock,.uui-text blockquote{float:right;font-size:14px;line-height:inherit;font-weight:400;font-style:italic;margin-top:0;margin-bottom:var(--uui-size-layout-1);margin-right:-.035em;max-width:16em;quotes:"“" "”" "‘" "’"}.uui-quoteblock:before,.uui-text blockquote:before{content:open-quote;margin-left:-.4em;margin-right:.08em;vertical-align:bottom;font-weight:400;font-size:2em}.uui-quoteblock:after,.uui-text blockquote:after{content:close-quote;margin-left:.04em;margin-right:-.4em;vertical-align:bottom;font-weight:400;font-size:2em;margin-bottom:-2px;display:inline-block}.uui-ul,.uui-text ul{list-style-type:square;padding-left:var(--uui-size-layout-1);margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-ol,.uui-text ol{padding-left:var(--uui-size-layout-1);margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}:root{--uui-color-selected: #316dca;--uui-color-selected-emphasis: #3e79d0;--uui-color-selected-standalone: #5b8dd7;--uui-color-selected-contrast: #eeeeef;--uui-color-current: #316dca;--uui-color-current-emphasis: #3e79d0;--uui-color-current-standalone: #5b8dd7;--uui-color-current-contrast: #eeeeef;--uui-color-header-surface: #21262e;--uui-color-header-contrast: #eeeeef;--uui-color-header-contrast-emphasis: #eeeeef;--uui-color-focus: #316dca;--uui-color-disabled: #434c56;--uui-color-disabled-standalone: #545d68;--uui-color-disabled-contrast: #fcfcfc4d;--uui-color-surface: #2d333b;--uui-color-surface-alt: #373e47;--uui-color-surface-emphasis: #333a42;--uui-color-background: #21262e;--uui-color-text: #eeeeef;--uui-color-text-alt: #eeeeef;--uui-color-interactive: #eeeeef;--uui-color-interactive-contrast: #21262e;--uui-color-interactive-emphasis: #eeeeef;--uui-color-border: #434c56;--uui-color-border-standalone: #545d68;--uui-color-border-emphasis: #626e7b;--uui-color-divider: #373e47;--uui-color-divider-standalone: #434c56;--uui-color-divider-emphasis: #545d68;--uui-color-default: #316dca;--uui-color-default-emphasis: #5387d5;--uui-color-default-standalone: #eeeeef;--uui-color-default-contrast: #eeeeef;--uui-color-warning: #af7c12;--uui-color-warning-emphasis: #af7c12;--uui-color-warning-standalone: #af7c12;--uui-color-warning-contrast: #eeeeef;--uui-color-danger: #ca3b37;--uui-color-danger-emphasis: #ca3b37;--uui-color-danger-standalone: #ca3b37;--uui-color-danger-contrast: #eeeeef;--uui-color-invalid: #ca3b37;--uui-color-invalid-emphasis: #ca3b37;--uui-color-invalid-standalone: #ca3b37;--uui-color-invalid-contrast: #eeeeef;--uui-color-positive: #347d39;--uui-color-positive-emphasis: #347d39;--uui-color-positive-standalone: #347d39;--uui-color-positive-contrast: #eeeeef;--uui-color-scheme: dark}
package/dist/themes/high-contrast.css ADDED
@@ -0,0 +1 @@
1
+ @font-face{font-family:Lato;src:local("LatoLatin Black"),local("LatoLatin-Black"),url(../assets/fonts/LatoLatin-Black.woff2) format("woff2");font-style:normal;font-display:swap;font-weight:900;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin BlackItalic"),local("LatoLatin-BlackItalic"),url(../assets/fonts/LatoLatin-BlackItalic.woff2) format("woff2");font-style:italic;font-weight:900;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Bold"),local("LatoLatin-Bold"),url(../assets/fonts/LatoLatin-Bold.woff2) format("woff2");font-style:normal;font-weight:700;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin BoldItalic"),local("LatoLatin-BoldItalic"),url(../assets/fonts/LatoLatin-BoldItalic.woff2) format("woff2");font-style:italic;font-weight:700;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Italic"),local("LatoLatin-Italic"),url(../assets/fonts/LatoLatin-Italic.woff2) format("woff2");font-style:italic;font-weight:400;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Regular"),local("LatoLatin-Regular"),url(../assets/fonts/LatoLatin-Regular.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Light"),local("LatoLatin-Light"),url(../assets/fonts/LatoLatin-Light.woff2) format("woff2");font-style:normal;font-weight:300;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin LightItalic"),local("LatoLatin-LightItalic"),url(../assets/fonts/LatoLatin-LightItalic.woff2) format("woff2");font-style:italic;font-weight:300;font-display:swap;text-rendering:optimizeLegibility}:root{--uui-size-1: 3px;--uui-size-2: 6px;--uui-size-3: 9px;--uui-size-4: 12px;--uui-size-5: 15px;--uui-size-6: 18px;--uui-size-7: 21px;--uui-size-8: 24px;--uui-size-9: 27px;--uui-size-10: 30px;--uui-size-11: 33px;--uui-size-12: 36px;--uui-size-14: 42px;--uui-size-16: 48px;--uui-size-20: 60px;--uui-size-22: 66px;--uui-size-24: 72px;--uui-size-28: 84px;--uui-size-32: 96px;--uui-size-36: 108px;--uui-size-40: 120px;--uui-size-44: 132px;--uui-size-46: 138px;--uui-size-48: 144px;--uui-size-52: 156px;--uui-size-56: 168px;--uui-size-60: 180px;--uui-size-64: 192px;--uui-size-72: 216px;--uui-size-80: 240px;--uui-size-96: 288px;--uui-size-100: 300px;--uui-size-space-1: 3px;--uui-size-space-2: 6px;--uui-size-space-3: 9px;--uui-size-space-4: 12px;--uui-size-space-5: 18px;--uui-size-space-6: 24px;--uui-size-layout-1: 24px;--uui-size-layout-2: 30px;--uui-size-layout-3: 42px;--uui-size-layout-4: 66px;--uui-size-layout-5: 96px;--uui-size-layout-6: 138px;--uui-border-radius: var(--uui-size-3);--uui-border-radius-1: var(--uui-size-2);--uui-border-radius-2: var(--uui-size-3);--uui-border-radius-3: var(--uui-size-5);--uui-type-default-size: 14px;--uui-type-small-size: 12px;--uui-type-h1-size: 60px;--uui-type-h2-size: 42px;--uui-type-h3-size: 30px;--uui-type-h4-size: 21px;--uui-type-h5-size: var(--uui-type-default-size);--uui-type-h6-size: var(--uui-type-small-size)}:root{--uui-shadow-depth-1: rgba(0, 0, 0, .1) 0px 1px 6px 0, rgba(0, 0, 0, .1) 0 0 1px 0;--uui-shadow-depth-2: rgba(0, 0, 0, .1) 0px 3px 12px 0, rgba(0, 0, 0, .1) 0 0 1px 0;--uui-shadow-depth-3: rgba(0, 0, 0, .1) 0px 6px 16px 0, rgba(0, 0, 0, .1) 0 0 2px 0;--uui-shadow-depth-4: rgba(0, 0, 0, .2) 0px 9px 20px 0, rgba(0, 0, 0, .18) 0 0 3px 0;--uui-shadow-depth-5: rgba(0, 0, 0, .3) 0px 12px 24px 0, rgba(0, 0, 0, .1) 0px 6px 16px 0, rgba(0, 0, 0, .1) 0 0 2px 0}:root{--uui-palette-deep-saffron: #f79c37;--uui-palette-deep-saffron-light: rgb(249, 181, 103);--uui-palette-deep-saffron-dark: rgb(222, 145, 56);--uui-palette-deep-saffron-dimmed: rgb(166, 150, 133);--uui-palette-sunglow: #fad634;--uui-palette-sunglow-light: rgb(251, 224, 101);--uui-palette-sunglow-dark: #a17700;--uui-palette-sunglow-dimmed: rgb(166, 160, 133);--uui-palette-spanish-pink: #ffe8e6;--uui-palette-spanish-pink-light: #ffeceb;--uui-palette-spanish-pink-dark: #ffe2e0;--uui-palette-spanish-pink-dimmed: #fae6e5;--uui-palette-gunmetal: #162335;--uui-palette-gunmetal-light: rgb(35, 55, 83);--uui-palette-gunmetal-dark: rgb(23, 27, 33);--uui-palette-gunmetal-dimmed: rgb(54, 54, 54);--uui-palette-space-cadet: #1b264f;--uui-palette-space-cadet-light: rgb(38, 53, 110);--uui-palette-space-cadet-dark: rgb(28, 35, 59);--uui-palette-space-cadet-dimmed: rgb(106, 117, 154);--uui-palette-violet-blue: #283a97;--uui-palette-violet-blue-light: #2d42ab;--uui-palette-violet-blue-dark: #25358b;--uui-palette-violet-blue-dimmed: #2c3669;--uui-palette-malibu: #3879ff;--uui-palette-malibu-light: rgb(97, 150, 255);--uui-palette-malibu-dark: rgb(56, 116, 235);--uui-palette-malibu-dimmed: rgb(115, 120, 130);--uui-palette-maroon-flush: #df2a5d;--uui-palette-maroon-flush-light: #ec275f;--uui-palette-maroon-flush-dark: rgb(174, 30, 71);--uui-palette-maroon-flush-dimmed: rgb(122, 98, 104);--uui-palette-jungle-green: #2bc37c;--uui-palette-jungle-green-light: rgb(58, 212, 140);--uui-palette-jungle-green-dark: rgb(43, 179, 115);--uui-palette-jungle-green-dimmed: rgb(102, 135, 120);--uui-palette-forest-green: #0b8152;--uui-palette-forest-green-light: rgb(13, 155, 98);--uui-palette-forest-green-dark: rgb(10, 115, 73);--uui-palette-forest-green-dimmed: rgb(46, 89, 72);--uui-palette-cocoa-black: #191715;--uui-palette-cocoa-black-light: rgb(39, 36, 32);--uui-palette-cocoa-black-dark: rgb(20, 20, 20);--uui-palette-cocoa-black-dimmed: rgb(48, 48, 48);--uui-palette-dune-black: #2e2b29;--uui-palette-dune-black-light: rgb(57, 53, 50);--uui-palette-dune-black-dark: rgb(38, 38, 38);--uui-palette-dune-black-dimmed: rgb(64, 64, 64);--uui-palette-cocoa-brown: #332a24;--uui-palette-cocoa-brown-light: rgb(66, 54, 47);--uui-palette-cocoa-brown-dark: rgb(38, 37, 36);--uui-palette-cocoa-brown-dimmed: rgb(43, 43, 43);--uui-palette-chamoisee: #9d8057;--uui-palette-chamoisee-light: rgb(175, 148, 110);--uui-palette-chamoisee-dark: rgb(138, 116, 87);--uui-palette-chamoisee-dimmed: rgb(115, 113, 110);--uui-palette-timberwolf: #e2dad4;--uui-palette-timberwolf-light: rgb(243, 239, 237);--uui-palette-timberwolf-dark: rgb(208, 208, 208);--uui-palette-timberwolf-dimmed: rgb(207, 207, 207);--uui-palette-gravel: #d8d7d9;--uui-palette-gravel-light: rgb(237, 237, 238);--uui-palette-gravel-dark: rgb(200, 200, 200);--uui-palette-gravel-dimmed: rgb(204, 204, 204);--uui-palette-sand: #f7f7f8;--uui-palette-sand-light: rgb(255, 255, 255);--uui-palette-sand-dark: rgb(226, 226, 226);--uui-palette-sand-dimmed: rgb(231, 231, 231);--uui-palette-white: #fefefe;--uui-palette-white-light: rgb(255, 255, 255);--uui-palette-white-dark: rgb(250, 250, 250);--uui-palette-white-dimmed: rgb(228, 228, 228);--uui-palette-black: #060606;--uui-palette-black-light: rgb(26, 26, 26);--uui-palette-black-dark: rgb(5, 5, 5);--uui-palette-black-dimmed: rgb(36, 36, 36);--uui-palette-grey: #c4c4c4;--uui-palette-grey-light: rgb(222, 222, 222);--uui-palette-grey-dark: rgb(179, 179, 179);--uui-palette-grey-dimmed: rgb(189, 189, 189);--uui-palette-dusty-grey: #9b9b9b;--uui-palette-dusty-grey-light: rgb(176, 176, 176);--uui-palette-dusty-grey-dark: rgb(141, 141, 141);--uui-palette-dusty-grey-dimmed: rgb(186, 186, 186);--uui-palette-mine-grey: #3e3e3e;--uui-palette-mine-grey-light: rgb(82, 82, 82);--uui-palette-mine-grey-dark: rgb(56, 56, 56);--uui-palette-mine-grey-dimmed: rgb(87, 87, 87)}:root{--uui-font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif}.uui-font{font-family:Lato,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:14px;line-height:calc(var(--uui-size-2) * 4);-webkit-font-smoothing:antialiased}.uui-h1,.uui-h2,.uui-h3,.uui-h4,.uui-h5,.uui-a,.uui-p,.uui-p-lead,.uui-small,.uui-quoteblock,.uui-ul,.uui-ol,.uui-text{font-family:Lato,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:14px;line-height:21px;-webkit-font-smoothing:antialiased}.uui-text h1,.uui-h1.uui-h1{font-size:var(--uui-type-h1-size);line-height:var(--uui-size-layout-4);font-weight:400;margin-left:-5px;margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-text p+h1,.uui-text p+.uui-h1{margin-top:var(--uui-size-layout-4)}.uui-text h1.--no-top-margin,.uui-text h1:first-child,.uui-h1.--no-top-margin,.uui-h1:first-child{margin-top:0}.uui-text h2,.uui-h2.uui-h2{font-size:var(--uui-type-h2-size);line-height:var(--uui-size-layout-3);font-weight:400;margin-left:-3px;margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-text p+h2,.uui-text p+.uui-h2{margin-top:var(--uui-size-layout-3)}.uui-text h2.--no-top-margin,.uui-text h2:first-child,.uui-h2.--no-top-margin,.uui-h2:first-child{margin-top:0}.uui-text h3,.uui-h3.uui-h3{font-size:var(--uui-type-h3-size);line-height:var(--uui-size-large);font-weight:400;margin-left:-2px;margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-text h3.--no-top-margin,.uui-text h3:first-child,.uui-h3.--no-top-margin,.uui-h3:first-child{margin-top:0}.uui-text h4,.uui-h4.uui-h4{font-size:var(--uui-type-h4-size);line-height:21px;font-weight:400;margin-left:-1px;margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-text h4.--no-top-margin,.uui-text h4:first-child,.uui-h4.--no-top-margin,.uui-h4:first-child{margin-top:0}.uui-text h5,.uui-h5.uui-h5{font-size:var(--uui-type-h5-size);line-height:inherit;font-weight:400;margin-left:0;margin-top:var(--uui-size-layout-1);margin-bottom:0}.uui-text h5.--no-top-margin,.uui-text h5:first-child,.uui-h5.--no-top-margin,.uui-h5:first-child{margin-top:0}.uui-p,.uui-text p{margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-p-lead,.uui-text p.uui-lead{font-size:var(--uui-size-6);line-height:var(--uui-size-8)}.uui-a,.uui-text a,.uui-a:link,.uui-a:active .uui-text a:link,.uui-text a:active{color:var(--uui-color-interactive)}.uui-a:hover,.uui-text a:hover{color:var(--uui-color-interactive-emphasis)}.uui-small,.uui-text small{display:inline-block;font-size:var(--uui-type-small-size);line-height:18px}.uui-quoteblock,.uui-text blockquote{float:right;font-size:14px;line-height:inherit;font-weight:400;font-style:italic;margin-top:0;margin-bottom:var(--uui-size-layout-1);margin-right:-.035em;max-width:16em;quotes:"“" "”" "‘" "’"}.uui-quoteblock:before,.uui-text blockquote:before{content:open-quote;margin-left:-.4em;margin-right:.08em;vertical-align:bottom;font-weight:400;font-size:2em}.uui-quoteblock:after,.uui-text blockquote:after{content:close-quote;margin-left:.04em;margin-right:-.4em;vertical-align:bottom;font-weight:400;font-size:2em;margin-bottom:-2px;display:inline-block}.uui-ul,.uui-text ul{list-style-type:square;padding-left:var(--uui-size-layout-1);margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-ol,.uui-text ol{padding-left:var(--uui-size-layout-1);margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}:root{--uui-color-selected: var(--uui-palette-violet-blue);--uui-color-selected-emphasis: var(--uui-palette-violet-blue-light);--uui-color-selected-standalone: var(--uui-palette-violet-blue-dark);--uui-color-selected-contrast: #fff;--uui-color-current: var(--uui-palette-spanish-pink);--uui-color-current-emphasis: var(--uui-palette-spanish-pink-light);--uui-color-current-standalone: var(--uui-palette-spanish-pink-dark);--uui-color-current-contrast: var(--uui-palette-space-cadet);--uui-color-header-surface: var(--uui-palette-space-cadet);--uui-color-header-contrast: #fff;--uui-color-header-contrast-emphasis: #fff;--uui-color-focus: var(--uui-palette-malibu);--uui-color-disabled: var(--uui-palette-sand);--uui-color-disabled-standalone: var(--uui-palette-sand-dark);--uui-color-disabled-contrast: var(--uui-palette-grey);--uui-color-surface: #fff;--uui-color-surface-alt: #fff;--uui-color-surface-emphasis: #dadada;--uui-color-background: #fff;--uui-color-text: var(--uui-palette-black);--uui-color-text-alt: var(--uui-palette-dune-black);--uui-color-interactive: var(--uui-palette-space-cadet);--uui-color-interactive-contrast: #fff;--uui-color-interactive-emphasis: var(--uui-palette-violet-blue);--uui-color-border: #000;--uui-color-border-standalone: #000;--uui-color-border-emphasis: #000;--uui-color-divider: #000;--uui-color-divider-standalone: #000;--uui-color-divider-emphasis: #000;--uui-color-default: var(--uui-palette-space-cadet);--uui-color-default-emphasis: var(--uui-palette-violet-blue);--uui-color-default-standalone: var(--uui-palette-space-cadet-dark);--uui-color-default-contrast: #fff;--uui-color-warning: #ffd621;--uui-color-warning-emphasis: #ffdc41;--uui-color-warning-standalone: #ffdd43;--uui-color-warning-contrast: #000;--uui-color-danger: #c60239;--uui-color-danger-emphasis: #da114a;--uui-color-danger-standalone: #d0003b;--uui-color-danger-contrast: #fff;--uui-color-invalid: #c60239;--uui-color-invalid-emphasis: #da114a;--uui-color-invalid-standalone: #d0003b;--uui-color-invalid-contrast: #fff;--uui-color-positive: #0d8844;--uui-color-positive-emphasis: #159c52;--uui-color-positive-standalone: #1cae5e;--uui-color-positive-contrast: #fff;--uui-shadow-depth-1: 0 0 0px 1px #000;--uui-shadow-depth-2: 0 0 0px 1px #000;--uui-shadow-depth-3: 0 0 0px 1px #000;--uui-shadow-depth-4: 0 0 0px 1px #000;--uui-shadow-depth-5: 0 0 0px 1px #000}
package/dist/themes/light.css CHANGED
@@ -1 +1 @@
1
- @font-face{font-family:Lato;src:local("LatoLatin Black"),local("LatoLatin-Black"),url(../assets/fonts/LatoLatin-Black.woff2) format("woff2");font-style:normal;font-display:swap;font-weight:900;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin BlackItalic"),local("LatoLatin-BlackItalic"),url(../assets/fonts/LatoLatin-BlackItalic.woff2) format("woff2");font-style:italic;font-weight:900;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Bold"),local("LatoLatin-Bold"),url(../assets/fonts/LatoLatin-Bold.woff2) format("woff2");font-style:normal;font-weight:700;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin BoldItalic"),local("LatoLatin-BoldItalic"),url(../assets/fonts/LatoLatin-BoldItalic.woff2) format("woff2");font-style:italic;font-weight:700;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Italic"),local("LatoLatin-Italic"),url(../assets/fonts/LatoLatin-Italic.woff2) format("woff2");font-style:italic;font-weight:400;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Regular"),local("LatoLatin-Regular"),url(../assets/fonts/LatoLatin-Regular.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Light"),local("LatoLatin-Light"),url(../assets/fonts/LatoLatin-Light.woff2) format("woff2");font-style:normal;font-weight:300;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin LightItalic"),local("LatoLatin-LightItalic"),url(../assets/fonts/LatoLatin-LightItalic.woff2) format("woff2");font-style:italic;font-weight:300;font-display:swap;text-rendering:optimizeLegibility}:root{--uui-size-1: 3px;--uui-size-2: 6px;--uui-size-3: 9px;--uui-size-4: 12px;--uui-size-5: 15px;--uui-size-6: 18px;--uui-size-7: 21px;--uui-size-8: 24px;--uui-size-9: 27px;--uui-size-10: 30px;--uui-size-11: 33px;--uui-size-12: 36px;--uui-size-14: 42px;--uui-size-16: 48px;--uui-size-20: 60px;--uui-size-22: 66px;--uui-size-24: 72px;--uui-size-28: 84px;--uui-size-32: 96px;--uui-size-36: 108px;--uui-size-40: 120px;--uui-size-44: 132px;--uui-size-46: 138px;--uui-size-48: 144px;--uui-size-52: 156px;--uui-size-56: 168px;--uui-size-60: 180px;--uui-size-64: 192px;--uui-size-72: 216px;--uui-size-80: 240px;--uui-size-96: 288px;--uui-size-100: 300px;--uui-size-space-1: 3px;--uui-size-space-2: 6px;--uui-size-space-3: 9px;--uui-size-space-4: 12px;--uui-size-space-5: 18px;--uui-size-space-6: 24px;--uui-size-layout-1: 24px;--uui-size-layout-2: 30px;--uui-size-layout-3: 42px;--uui-size-layout-4: 66px;--uui-size-layout-5: 96px;--uui-size-layout-6: 138px;--uui-border-radius: var(--uui-size-3);--uui-border-radius-1: var(--uui-size-2);--uui-border-radius-2: var(--uui-size-3);--uui-border-radius-3: var(--uui-size-5);--uui-type-default-size: 14px;--uui-type-small-size: 12px;--uui-type-h1-size: 60px;--uui-type-h2-size: 42px;--uui-type-h3-size: 30px;--uui-type-h4-size: 21px;--uui-type-h5-size: var(--uui-type-default-size);--uui-type-h6-size: var(--uui-type-small-size)}:root{--uui-shadow-depth-1: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);--uui-shadow-depth-2: 0 3px 6px rgba(0, 0, 0, .16), 0 3px 6px rgba(0, 0, 0, .23);--uui-shadow-depth-3: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23);--uui-shadow-depth-4: 0 14px 28px rgba(0, 0, 0, .25), 0 10px 10px rgba(0, 0, 0, .22);--uui-shadow-depth-5: 0 19px 38px rgba(0, 0, 0, .3), 0 15px 12px rgba(0, 0, 0, .22)}:root{--uui-palette-deep-saffron: #f79c37;--uui-palette-deep-saffron-light: rgb(249, 181, 103);--uui-palette-deep-saffron-dark: rgb(222, 145, 56);--uui-palette-deep-saffron-dimmed: rgb(166, 150, 133);--uui-palette-sunglow: #fad634;--uui-palette-sunglow-light: rgb(251, 224, 101);--uui-palette-sunglow-dark: rgb(224, 193, 51);--uui-palette-sunglow-dimmed: rgb(166, 160, 133);--uui-palette-spanish-pink: #f5c1bc;--uui-palette-spanish-pink-light: rgb(248, 214, 211);--uui-palette-spanish-pink-dark: rgb(232, 192, 189);--uui-palette-spanish-pink-dimmed: rgb(219, 212, 212);--uui-palette-gunmetal: #162335;--uui-palette-gunmetal-light: rgb(35, 55, 83);--uui-palette-gunmetal-dark: rgb(23, 27, 33);--uui-palette-gunmetal-dimmed: rgb(54, 54, 54);--uui-palette-space-cadet: #1b264f;--uui-palette-space-cadet-light: rgb(38, 53, 110);--uui-palette-space-cadet-dark: rgb(28, 35, 59);--uui-palette-space-cadet-dimmed: rgb(106, 117, 154);--uui-palette-violet-blue: #283a97;--uui-palette-violet-blue-light: #2d42ab;--uui-palette-violet-blue-dark: #25358b;--uui-palette-violet-blue-dimmed: #2c3669;--uui-palette-malibu: #3879ff;--uui-palette-malibu-light: rgb(97, 150, 255);--uui-palette-malibu-dark: rgb(56, 116, 235);--uui-palette-malibu-dimmed: rgb(115, 120, 130);--uui-palette-maroon-flush: #c31d4c;--uui-palette-maroon-flush-light: rgb(223, 42, 93);--uui-palette-maroon-flush-dark: rgb(174, 30, 71);--uui-palette-maroon-flush-dimmed: rgb(122, 98, 104);--uui-palette-jungle-green: #2bc37c;--uui-palette-jungle-green-light: rgb(58, 212, 140);--uui-palette-jungle-green-dark: rgb(43, 179, 115);--uui-palette-jungle-green-dimmed: rgb(102, 135, 120);--uui-palette-forest-green: #0b8152;--uui-palette-forest-green-light: rgb(13, 155, 98);--uui-palette-forest-green-dark: rgb(10, 115, 73);--uui-palette-forest-green-dimmed: rgb(46, 89, 72);--uui-palette-cocoa-black: #191715;--uui-palette-cocoa-black-light: rgb(39, 36, 32);--uui-palette-cocoa-black-dark: rgb(20, 20, 20);--uui-palette-cocoa-black-dimmed: rgb(48, 48, 48);--uui-palette-dune-black: #2e2b29;--uui-palette-dune-black-light: rgb(57, 53, 50);--uui-palette-dune-black-dark: rgb(38, 38, 38);--uui-palette-dune-black-dimmed: rgb(64, 64, 64);--uui-palette-cocoa-brown: #332a24;--uui-palette-cocoa-brown-light: rgb(66, 54, 47);--uui-palette-cocoa-brown-dark: rgb(38, 37, 36);--uui-palette-cocoa-brown-dimmed: rgb(43, 43, 43);--uui-palette-chamoisee: #9d8057;--uui-palette-chamoisee-light: rgb(175, 148, 110);--uui-palette-chamoisee-dark: rgb(138, 116, 87);--uui-palette-chamoisee-dimmed: rgb(115, 113, 110);--uui-palette-timberwolf: #e2dad4;--uui-palette-timberwolf-light: rgb(243, 239, 237);--uui-palette-timberwolf-dark: rgb(208, 208, 208);--uui-palette-timberwolf-dimmed: rgb(207, 207, 207);--uui-palette-gravel: #d8d7d9;--uui-palette-gravel-light: rgb(237, 237, 238);--uui-palette-gravel-dark: rgb(200, 200, 200);--uui-palette-gravel-dimmed: rgb(204, 204, 204);--uui-palette-sand: #f6f6f7;--uui-palette-sand-light: rgb(255, 255, 255);--uui-palette-sand-dark: rgb(226, 226, 226);--uui-palette-sand-dimmed: rgb(231, 231, 231);--uui-palette-white: #fefefe;--uui-palette-white-light: rgb(255, 255, 255);--uui-palette-white-dark: rgb(250, 250, 250);--uui-palette-white-dimmed: rgb(228, 228, 228);--uui-palette-black: #060606;--uui-palette-black-light: rgb(26, 26, 26);--uui-palette-black-dark: rgb(5, 5, 5);--uui-palette-black-dimmed: rgb(36, 36, 36);--uui-palette-grey: #c4c4c4;--uui-palette-grey-light: rgb(222, 222, 222);--uui-palette-grey-dark: rgb(179, 179, 179);--uui-palette-grey-dimmed: rgb(189, 189, 189);--uui-palette-dusty-grey: #9b9b9b;--uui-palette-dusty-grey-light: rgb(176, 176, 176);--uui-palette-dusty-grey-dark: rgb(141, 141, 141);--uui-palette-dusty-grey-dimmed: rgb(186, 186, 186);--uui-palette-mine-grey: #3e3e3e;--uui-palette-mine-grey-light: rgb(82, 82, 82);--uui-palette-mine-grey-dark: rgb(56, 56, 56);--uui-palette-mine-grey-dimmed: rgb(87, 87, 87)}:root{--uui-font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif}:root{--uui-color-selected: var(--uui-palette-violet-blue);--uui-color-selected-emphasis: var(--uui-palette-violet-blue-light);--uui-color-selected-standalone: var(--uui-palette-violet-blue-dark);--uui-color-selected-contrast: #fff;--uui-color-current: var(--uui-palette-spanish-pink);--uui-color-current-emphasis: var(--uui-palette-spanish-pink-light);--uui-color-current-standalone: var(--uui-palette-spanish-pink-dark);--uui-color-current-contrast: var(--uui-palette-space-cadet);--uui-color-disabled: var(--uui-palette-sand);--uui-color-disabled-standalone: var(--uui-palette-sand-dark);--uui-color-disabled-contrast: var(--uui-palette-grey);--uui-color-header-surface: var(--uui-palette-space-cadet);--uui-color-header-contrast: rgba(255, 255, 255, .8);--uui-color-header-contrast-emphasis: #fff;--uui-color-focus: var(--uui-palette-malibu);--uui-color-surface: #fff;--uui-color-surface-alt: var(--uui-palette-sand);--uui-color-surface-emphasis: var(--uui-palette-white-dark);--uui-color-background: var(--uui-palette-sand);--uui-color-text: var(--uui-palette-black);--uui-color-text-alt: var(--uui-palette-dune-black);--uui-color-interactive: var(--uui-palette-violet-blue);--uui-color-interactive-emphasis: var(--uui-palette-violet-blue-light);--uui-color-border: #d8d7d9;--uui-color-border-standalone: #c2c2c2;--uui-color-border-emphasis: #a1a1a1;--uui-color-divider: #f6f6f7;--uui-color-divider-standalone: #e9e9eb;--uui-color-divider-emphasis: #bdbdbd;--uui-color-default: var(--uui-palette-violet-blue);--uui-color-default-emphasis: var(--uui-palette-violet-blue-light);--uui-color-default-standalone: var(--uui-palette-violet-blue-dark);--uui-color-default-contrast: #fff;--uui-color-warning: #fbd142;--uui-color-warning-emphasis: var(--uui-palette-sunglow-light);--uui-color-warning-standalone: #a17700;--uui-color-warning-contrast: #000;--uui-color-danger: var(--uui-palette-maroon-flush);--uui-color-danger-emphasis: var(--uui-palette-maroon-flush-light);--uui-color-danger-standalone: var(--uui-palette-maroon-flush-dark);--uui-color-danger-contrast: white;--uui-color-invalid: var(--uui-palette-maroon-flush);--uui-color-invalid-emphasis: var(--uui-palette-maroon-flush-light);--uui-color-invalid-standalone: var(--uui-palette-maroon-flush-dark);--uui-color-invalid-contrast: white;--uui-color-positive: var(--uui-palette-forest-green);--uui-color-positive-emphasis: var(--uui-palette-forest-green-light);--uui-color-positive-standalone: var(--uui-palette-forest-green-dark);--uui-color-positive-contrast: #fff}
1
+ @font-face{font-family:Lato;src:local("LatoLatin Black"),local("LatoLatin-Black"),url(../assets/fonts/LatoLatin-Black.woff2) format("woff2");font-style:normal;font-display:swap;font-weight:900;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin BlackItalic"),local("LatoLatin-BlackItalic"),url(../assets/fonts/LatoLatin-BlackItalic.woff2) format("woff2");font-style:italic;font-weight:900;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Bold"),local("LatoLatin-Bold"),url(../assets/fonts/LatoLatin-Bold.woff2) format("woff2");font-style:normal;font-weight:700;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin BoldItalic"),local("LatoLatin-BoldItalic"),url(../assets/fonts/LatoLatin-BoldItalic.woff2) format("woff2");font-style:italic;font-weight:700;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Italic"),local("LatoLatin-Italic"),url(../assets/fonts/LatoLatin-Italic.woff2) format("woff2");font-style:italic;font-weight:400;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Regular"),local("LatoLatin-Regular"),url(../assets/fonts/LatoLatin-Regular.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin Light"),local("LatoLatin-Light"),url(../assets/fonts/LatoLatin-Light.woff2) format("woff2");font-style:normal;font-weight:300;font-display:swap;text-rendering:optimizeLegibility}@font-face{font-family:Lato;src:local("LatoLatin LightItalic"),local("LatoLatin-LightItalic"),url(../assets/fonts/LatoLatin-LightItalic.woff2) format("woff2");font-style:italic;font-weight:300;font-display:swap;text-rendering:optimizeLegibility}:root{--uui-size-1: 3px;--uui-size-2: 6px;--uui-size-3: 9px;--uui-size-4: 12px;--uui-size-5: 15px;--uui-size-6: 18px;--uui-size-7: 21px;--uui-size-8: 24px;--uui-size-9: 27px;--uui-size-10: 30px;--uui-size-11: 33px;--uui-size-12: 36px;--uui-size-14: 42px;--uui-size-16: 48px;--uui-size-20: 60px;--uui-size-22: 66px;--uui-size-24: 72px;--uui-size-28: 84px;--uui-size-32: 96px;--uui-size-36: 108px;--uui-size-40: 120px;--uui-size-44: 132px;--uui-size-46: 138px;--uui-size-48: 144px;--uui-size-52: 156px;--uui-size-56: 168px;--uui-size-60: 180px;--uui-size-64: 192px;--uui-size-72: 216px;--uui-size-80: 240px;--uui-size-96: 288px;--uui-size-100: 300px;--uui-size-space-1: 3px;--uui-size-space-2: 6px;--uui-size-space-3: 9px;--uui-size-space-4: 12px;--uui-size-space-5: 18px;--uui-size-space-6: 24px;--uui-size-layout-1: 24px;--uui-size-layout-2: 30px;--uui-size-layout-3: 42px;--uui-size-layout-4: 66px;--uui-size-layout-5: 96px;--uui-size-layout-6: 138px;--uui-border-radius: var(--uui-size-3);--uui-border-radius-1: var(--uui-size-2);--uui-border-radius-2: var(--uui-size-3);--uui-border-radius-3: var(--uui-size-5);--uui-type-default-size: 14px;--uui-type-small-size: 12px;--uui-type-h1-size: 60px;--uui-type-h2-size: 42px;--uui-type-h3-size: 30px;--uui-type-h4-size: 21px;--uui-type-h5-size: var(--uui-type-default-size);--uui-type-h6-size: var(--uui-type-small-size)}:root{--uui-shadow-depth-1: rgba(0, 0, 0, .1) 0px 1px 6px 0, rgba(0, 0, 0, .1) 0 0 1px 0;--uui-shadow-depth-2: rgba(0, 0, 0, .1) 0px 3px 12px 0, rgba(0, 0, 0, .1) 0 0 1px 0;--uui-shadow-depth-3: rgba(0, 0, 0, .1) 0px 6px 16px 0, rgba(0, 0, 0, .1) 0 0 2px 0;--uui-shadow-depth-4: rgba(0, 0, 0, .2) 0px 9px 20px 0, rgba(0, 0, 0, .18) 0 0 3px 0;--uui-shadow-depth-5: rgba(0, 0, 0, .3) 0px 12px 24px 0, rgba(0, 0, 0, .1) 0px 6px 16px 0, rgba(0, 0, 0, .1) 0 0 2px 0}:root{--uui-palette-deep-saffron: #f79c37;--uui-palette-deep-saffron-light: rgb(249, 181, 103);--uui-palette-deep-saffron-dark: rgb(222, 145, 56);--uui-palette-deep-saffron-dimmed: rgb(166, 150, 133);--uui-palette-sunglow: #fad634;--uui-palette-sunglow-light: rgb(251, 224, 101);--uui-palette-sunglow-dark: #a17700;--uui-palette-sunglow-dimmed: rgb(166, 160, 133);--uui-palette-spanish-pink: #ffe8e6;--uui-palette-spanish-pink-light: #ffeceb;--uui-palette-spanish-pink-dark: #ffe2e0;--uui-palette-spanish-pink-dimmed: #fae6e5;--uui-palette-gunmetal: #162335;--uui-palette-gunmetal-light: rgb(35, 55, 83);--uui-palette-gunmetal-dark: rgb(23, 27, 33);--uui-palette-gunmetal-dimmed: rgb(54, 54, 54);--uui-palette-space-cadet: #1b264f;--uui-palette-space-cadet-light: rgb(38, 53, 110);--uui-palette-space-cadet-dark: rgb(28, 35, 59);--uui-palette-space-cadet-dimmed: rgb(106, 117, 154);--uui-palette-violet-blue: #283a97;--uui-palette-violet-blue-light: #2d42ab;--uui-palette-violet-blue-dark: #25358b;--uui-palette-violet-blue-dimmed: #2c3669;--uui-palette-malibu: #3879ff;--uui-palette-malibu-light: rgb(97, 150, 255);--uui-palette-malibu-dark: rgb(56, 116, 235);--uui-palette-malibu-dimmed: rgb(115, 120, 130);--uui-palette-maroon-flush: #df2a5d;--uui-palette-maroon-flush-light: #ec275f;--uui-palette-maroon-flush-dark: rgb(174, 30, 71);--uui-palette-maroon-flush-dimmed: rgb(122, 98, 104);--uui-palette-jungle-green: #2bc37c;--uui-palette-jungle-green-light: rgb(58, 212, 140);--uui-palette-jungle-green-dark: rgb(43, 179, 115);--uui-palette-jungle-green-dimmed: rgb(102, 135, 120);--uui-palette-forest-green: #0b8152;--uui-palette-forest-green-light: rgb(13, 155, 98);--uui-palette-forest-green-dark: rgb(10, 115, 73);--uui-palette-forest-green-dimmed: rgb(46, 89, 72);--uui-palette-cocoa-black: #191715;--uui-palette-cocoa-black-light: rgb(39, 36, 32);--uui-palette-cocoa-black-dark: rgb(20, 20, 20);--uui-palette-cocoa-black-dimmed: rgb(48, 48, 48);--uui-palette-dune-black: #2e2b29;--uui-palette-dune-black-light: rgb(57, 53, 50);--uui-palette-dune-black-dark: rgb(38, 38, 38);--uui-palette-dune-black-dimmed: rgb(64, 64, 64);--uui-palette-cocoa-brown: #332a24;--uui-palette-cocoa-brown-light: rgb(66, 54, 47);--uui-palette-cocoa-brown-dark: rgb(38, 37, 36);--uui-palette-cocoa-brown-dimmed: rgb(43, 43, 43);--uui-palette-chamoisee: #9d8057;--uui-palette-chamoisee-light: rgb(175, 148, 110);--uui-palette-chamoisee-dark: rgb(138, 116, 87);--uui-palette-chamoisee-dimmed: rgb(115, 113, 110);--uui-palette-timberwolf: #e2dad4;--uui-palette-timberwolf-light: rgb(243, 239, 237);--uui-palette-timberwolf-dark: rgb(208, 208, 208);--uui-palette-timberwolf-dimmed: rgb(207, 207, 207);--uui-palette-gravel: #d8d7d9;--uui-palette-gravel-light: rgb(237, 237, 238);--uui-palette-gravel-dark: rgb(200, 200, 200);--uui-palette-gravel-dimmed: rgb(204, 204, 204);--uui-palette-sand: #f7f7f8;--uui-palette-sand-light: rgb(255, 255, 255);--uui-palette-sand-dark: rgb(226, 226, 226);--uui-palette-sand-dimmed: rgb(231, 231, 231);--uui-palette-white: #fefefe;--uui-palette-white-light: rgb(255, 255, 255);--uui-palette-white-dark: rgb(250, 250, 250);--uui-palette-white-dimmed: rgb(228, 228, 228);--uui-palette-black: #060606;--uui-palette-black-light: rgb(26, 26, 26);--uui-palette-black-dark: rgb(5, 5, 5);--uui-palette-black-dimmed: rgb(36, 36, 36);--uui-palette-grey: #c4c4c4;--uui-palette-grey-light: rgb(222, 222, 222);--uui-palette-grey-dark: rgb(179, 179, 179);--uui-palette-grey-dimmed: rgb(189, 189, 189);--uui-palette-dusty-grey: #9b9b9b;--uui-palette-dusty-grey-light: rgb(176, 176, 176);--uui-palette-dusty-grey-dark: rgb(141, 141, 141);--uui-palette-dusty-grey-dimmed: rgb(186, 186, 186);--uui-palette-mine-grey: #3e3e3e;--uui-palette-mine-grey-light: rgb(82, 82, 82);--uui-palette-mine-grey-dark: rgb(56, 56, 56);--uui-palette-mine-grey-dimmed: rgb(87, 87, 87)}:root{--uui-font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif}.uui-font{font-family:Lato,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:14px;line-height:calc(var(--uui-size-2) * 4);-webkit-font-smoothing:antialiased}.uui-h1,.uui-h2,.uui-h3,.uui-h4,.uui-h5,.uui-a,.uui-p,.uui-p-lead,.uui-small,.uui-quoteblock,.uui-ul,.uui-ol,.uui-text{font-family:Lato,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:14px;line-height:21px;-webkit-font-smoothing:antialiased}.uui-text h1,.uui-h1.uui-h1{font-size:var(--uui-type-h1-size);line-height:var(--uui-size-layout-4);font-weight:400;margin-left:-5px;margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-text p+h1,.uui-text p+.uui-h1{margin-top:var(--uui-size-layout-4)}.uui-text h1.--no-top-margin,.uui-text h1:first-child,.uui-h1.--no-top-margin,.uui-h1:first-child{margin-top:0}.uui-text h2,.uui-h2.uui-h2{font-size:var(--uui-type-h2-size);line-height:var(--uui-size-layout-3);font-weight:400;margin-left:-3px;margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-text p+h2,.uui-text p+.uui-h2{margin-top:var(--uui-size-layout-3)}.uui-text h2.--no-top-margin,.uui-text h2:first-child,.uui-h2.--no-top-margin,.uui-h2:first-child{margin-top:0}.uui-text h3,.uui-h3.uui-h3{font-size:var(--uui-type-h3-size);line-height:var(--uui-size-large);font-weight:400;margin-left:-2px;margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-text h3.--no-top-margin,.uui-text h3:first-child,.uui-h3.--no-top-margin,.uui-h3:first-child{margin-top:0}.uui-text h4,.uui-h4.uui-h4{font-size:var(--uui-type-h4-size);line-height:21px;font-weight:400;margin-left:-1px;margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-text h4.--no-top-margin,.uui-text h4:first-child,.uui-h4.--no-top-margin,.uui-h4:first-child{margin-top:0}.uui-text h5,.uui-h5.uui-h5{font-size:var(--uui-type-h5-size);line-height:inherit;font-weight:400;margin-left:0;margin-top:var(--uui-size-layout-1);margin-bottom:0}.uui-text h5.--no-top-margin,.uui-text h5:first-child,.uui-h5.--no-top-margin,.uui-h5:first-child{margin-top:0}.uui-p,.uui-text p{margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-p-lead,.uui-text p.uui-lead{font-size:var(--uui-size-6);line-height:var(--uui-size-8)}.uui-a,.uui-text a,.uui-a:link,.uui-a:active .uui-text a:link,.uui-text a:active{color:var(--uui-color-interactive)}.uui-a:hover,.uui-text a:hover{color:var(--uui-color-interactive-emphasis)}.uui-small,.uui-text small{display:inline-block;font-size:var(--uui-type-small-size);line-height:18px}.uui-quoteblock,.uui-text blockquote{float:right;font-size:14px;line-height:inherit;font-weight:400;font-style:italic;margin-top:0;margin-bottom:var(--uui-size-layout-1);margin-right:-.035em;max-width:16em;quotes:"“" "”" "‘" "’"}.uui-quoteblock:before,.uui-text blockquote:before{content:open-quote;margin-left:-.4em;margin-right:.08em;vertical-align:bottom;font-weight:400;font-size:2em}.uui-quoteblock:after,.uui-text blockquote:after{content:close-quote;margin-left:.04em;margin-right:-.4em;vertical-align:bottom;font-weight:400;font-size:2em;margin-bottom:-2px;display:inline-block}.uui-ul,.uui-text ul{list-style-type:square;padding-left:var(--uui-size-layout-1);margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}.uui-ol,.uui-text ol{padding-left:var(--uui-size-layout-1);margin-top:var(--uui-size-layout-1);margin-bottom:var(--uui-size-layout-1)}:root{--uui-color-selected: var(--uui-palette-violet-blue);--uui-color-selected-emphasis: var(--uui-palette-violet-blue-light);--uui-color-selected-standalone: var(--uui-palette-violet-blue-dark);--uui-color-selected-contrast: #fff;--uui-color-current: var(--uui-palette-spanish-pink);--uui-color-current-emphasis: var(--uui-palette-spanish-pink-light);--uui-color-current-standalone: var(--uui-palette-spanish-pink-dark);--uui-color-current-contrast: var(--uui-palette-space-cadet);--uui-color-disabled: var(--uui-palette-sand);--uui-color-disabled-standalone: var(--uui-palette-sand-dark);--uui-color-disabled-contrast: var(--uui-palette-grey);--uui-color-header-surface: var(--uui-palette-space-cadet);--uui-color-header-contrast: rgba(255, 255, 255, .8);--uui-color-header-contrast-emphasis: #fff;--uui-color-focus: var(--uui-palette-malibu);--uui-color-surface: #fff;--uui-color-surface-alt: var(--uui-palette-sand);--uui-color-surface-emphasis: var(--uui-palette-white-dark);--uui-color-background: var(--uui-palette-sand);--uui-color-text: var(--uui-palette-black);--uui-color-text-alt: var(--uui-palette-dune-black);--uui-color-interactive: var(--uui-palette-space-cadet);--uui-color-interactive-emphasis: var(--uui-palette-violet-blue-light);--uui-color-interactive-contrast: #fff;--uui-color-border: #d8d7d9;--uui-color-border-standalone: #c2c2c2;--uui-color-border-emphasis: #a1a1a1;--uui-color-divider: #f6f6f7;--uui-color-divider-standalone: #e9e9eb;--uui-color-divider-emphasis: #bdbdbd;--uui-color-default: var(--uui-palette-violet-blue);--uui-color-default-emphasis: var(--uui-palette-violet-blue-light);--uui-color-default-standalone: var(--uui-palette-violet-blue-dark);--uui-color-default-contrast: #fff;--uui-color-warning: var(--uui-palette-sunglow);--uui-color-warning-emphasis: var(--uui-palette-sunglow-light);--uui-color-warning-standalone: var(--uui-palette-sunglow-dark);--uui-color-warning-contrast: #000;--uui-color-danger: var(--uui-palette-maroon-flush);--uui-color-danger-emphasis: var(--uui-palette-maroon-flush-light);--uui-color-danger-standalone: var(--uui-palette-maroon-flush-dark);--uui-color-danger-contrast: white;--uui-color-invalid: var(--uui-palette-maroon-flush);--uui-color-invalid-emphasis: var(--uui-palette-maroon-flush-light);--uui-color-invalid-standalone: var(--uui-palette-maroon-flush-dark);--uui-color-invalid-contrast: white;--uui-color-positive: var(--uui-palette-forest-green);--uui-color-positive-emphasis: var(--uui-palette-forest-green-light);--uui-color-positive-standalone: var(--uui-palette-forest-green-dark);--uui-color-positive-contrast: #fff}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@umbraco-ui/uui",
3
- "version": "2.0.0-alpha.0",
3
+ "version": "2.0.0-rc.0",
4
4
  "description": "The Umbraco UI Library - web components for the Umbraco backoffice.",
5
5
  "license": "MIT",
6
6
  "type": "module",
@@ -18,10 +18,10 @@
18
18
  "./styles/*": "./dist/styles/*"
19
19
  },
20
20
  "sideEffects": [
21
- "dist/components/*/!(*.element).js",
21
+ "dist/components/**/*.js",
22
22
  "dist/index.js",
23
23
  "dist/internal/version.js",
24
- "src/components/*/!(*.element).ts",
24
+ "src/components/**/*.ts",
25
25
  "src/index.ts",
26
26
  "src/internal/version.ts"
27
27
  ],
@@ -74,7 +74,7 @@
74
74
  "storybook:build": "npm run analyze && storybook build",
75
75
  "new-component": "plop",
76
76
  "test:codemod": "node --test scripts/codemods/test.js",
77
- "lerna:version": "lerna version --conventional-commits",
77
+ "lerna:version": "lerna version --conventional-commits --sync-workspace-lock",
78
78
  "lerna:version:rc": "npm run lerna:version -- --conventional-prerelease"
79
79
  },
80
80
  "engines": {
@@ -86,52 +86,52 @@
86
86
  "lit": "^3.0.0"
87
87
  },
88
88
  "devDependencies": {
89
- "@chromatic-com/storybook": "5.0.1",
90
- "@eslint/compat": "2.0.2",
89
+ "@chromatic-com/storybook": "5.1.2",
90
+ "@eslint/compat": "^2.1.0",
91
91
  "@eslint/js": "10.0.1",
92
- "@lerna-lite/cli": "4.11.3",
93
- "@lerna-lite/publish": "4.11.3",
94
- "@lerna-lite/version": "4.11.3",
95
- "@storybook/addon-a11y": "^10.2.13",
96
- "@storybook/addon-docs": "^10.2.13",
97
- "@storybook/addon-links": "^10.2.13",
98
- "@storybook/web-components-vite": "^10.2.13",
92
+ "@lerna-lite/cli": "5.2.1",
93
+ "@lerna-lite/publish": "5.2.1",
94
+ "@lerna-lite/version": "5.2.1",
95
+ "@storybook/addon-a11y": "^10.3.6",
96
+ "@storybook/addon-docs": "^10.3.6",
97
+ "@storybook/addon-links": "^10.3.6",
98
+ "@storybook/web-components-vite": "^10.3.6",
99
99
  "@testing-library/dom": "10.4.1",
100
100
  "@types/culori": "^4.0.1",
101
101
  "@types/react": "18.3.1",
102
102
  "@types/react-dom": "18.3.1",
103
- "@vitest/browser": "^4.0.18",
104
- "@vitest/browser-playwright": "^4.0.18",
105
- "axe-core": "^4.11.1",
106
- "chromatic": "^15.2.0",
107
- "eslint": "10.0.2",
103
+ "@vitest/browser": "^4.1.6",
104
+ "@vitest/browser-playwright": "^4.1.6",
105
+ "axe-core": "^4.11.4",
106
+ "chromatic": "^16.9.0",
107
+ "eslint": "^10.3.0",
108
108
  "eslint-config-prettier": "10.1.8",
109
109
  "eslint-plugin-import": "^2.32.0",
110
- "eslint-plugin-lit": "2.2.1",
110
+ "eslint-plugin-lit": "^2.3.1",
111
111
  "eslint-plugin-local-rules": "3.0.2",
112
112
  "eslint-plugin-prettier": "5.5.5",
113
- "eslint-plugin-storybook": "10.2.13",
113
+ "eslint-plugin-storybook": "10.3.6",
114
114
  "eslint-plugin-wc": "3.1.0",
115
115
  "github-markdown-css": "5.9.0",
116
- "globals": "17.4.0",
116
+ "globals": "^17.6.0",
117
117
  "husky": "9.1.7",
118
118
  "jscodeshift": "^17.3.0",
119
119
  "lint-staged": "16.1.2",
120
- "playwright": "^1.58.2",
120
+ "playwright": "^1.60.0",
121
121
  "plop": "4.0.5",
122
122
  "prettier": "3.8.1",
123
123
  "react": "18.3.1",
124
124
  "react-dom": "18.3.1",
125
125
  "react-markdown": "10.1.0",
126
- "react-syntax-highlighter": "16.1.0",
126
+ "react-syntax-highlighter": "16.1.1",
127
127
  "remark-gfm": "4.0.1",
128
128
  "rimraf": "6.1.3",
129
- "storybook": "^10.2.13",
129
+ "storybook": "^10.3.6",
130
130
  "tsc-files": "1.1.4",
131
131
  "typescript": "5.9.3",
132
132
  "typescript-eslint": "8.56.1",
133
- "vite": "7.3.1",
134
- "vitest": "^4.0.18",
133
+ "vite": "7.3.2",
134
+ "vitest": "^4.1.6",
135
135
  "vitest-browser-lit": "^1.0.1",
136
136
  "web-component-analyzer": "2.0.0"
137
137
  },
@@ -147,5 +147,5 @@
147
147
  "url": "https://uui.umbraco.com"
148
148
  },
149
149
  "packageManager": "npm@11.1.0",
150
- "gitHead": "25ffb83b9962960c97fc0f3a5d1d90677e57c543"
150
+ "gitHead": "f63b9c16b5a30d553c90e20a56f476c4bd30a2a5"
151
151
  }