@watermarkinsights/ripple 3.6.0-2 → 3.7.0-1

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 (94) hide show
  1. package/dist/cjs/{functions-0cf2d639.js → functions-f0693632.js} +266 -0
  2. package/dist/cjs/{global-b6602785.js → global-31bd3bd9.js} +1 -1
  3. package/dist/cjs/loader.cjs.js +2 -2
  4. package/dist/cjs/priv-chart-popover.cjs.entry.js +1 -1
  5. package/dist/cjs/priv-datepicker.cjs.entry.js +1 -1
  6. package/dist/cjs/ripple.cjs.js +2 -2
  7. package/dist/cjs/wm-action-menu_2.cjs.entry.js +1 -1
  8. package/dist/cjs/wm-button.cjs.entry.js +31 -13
  9. package/dist/cjs/wm-chart.cjs.entry.js +1 -1
  10. package/dist/cjs/wm-datepicker.cjs.entry.js +8 -2
  11. package/dist/cjs/wm-input.cjs.entry.js +2 -2
  12. package/dist/cjs/wm-modal-header.cjs.entry.js +1 -1
  13. package/dist/cjs/wm-modal.cjs.entry.js +1 -1
  14. package/dist/cjs/wm-navigator.cjs.entry.js +1 -1
  15. package/dist/cjs/wm-network-uploader.cjs.entry.js +3 -4
  16. package/dist/cjs/wm-option_2.cjs.entry.js +1 -1
  17. package/dist/cjs/wm-pagination.cjs.entry.js +1 -1
  18. package/dist/cjs/wm-search.cjs.entry.js +1 -1
  19. package/dist/cjs/wm-snackbar.cjs.entry.js +1 -1
  20. package/dist/cjs/wm-tab-item_3.cjs.entry.js +3 -7
  21. package/dist/cjs/wm-tag-input.cjs.entry.js +1 -1
  22. package/dist/cjs/wm-timepicker.cjs.entry.js +2 -2
  23. package/dist/cjs/wm-toggletip.cjs.entry.js +1 -1
  24. package/dist/cjs/wm-uploader.cjs.entry.js +11 -24
  25. package/dist/collection/components/wm-button/wm-button.css +37 -4
  26. package/dist/collection/components/wm-button/wm-button.js +29 -11
  27. package/dist/collection/components/wm-datepicker/wm-datepicker.js +7 -1
  28. package/dist/collection/components/wm-input/wm-input.js +1 -2
  29. package/dist/collection/components/wm-tabs/wm-tab-item/wm-tab-item.js +1 -4
  30. package/dist/collection/components/wm-tabs/wm-tab-list/wm-tab-list.js +1 -2
  31. package/dist/collection/components/wm-timepicker/wm-timepicker.js +1 -1
  32. package/dist/collection/components/wm-uploader/wm-network-uploader/wm-network-uploader.css +37 -4
  33. package/dist/collection/components/wm-uploader/wm-network-uploader/wm-network-uploader.js +1 -20
  34. package/dist/collection/components/wm-uploader/wm-uploader.css +48 -22
  35. package/dist/collection/components/wm-uploader/wm-uploader.js +22 -68
  36. package/dist/esm/{functions-223fb0dc.js → functions-cbfc81d1.js} +266 -0
  37. package/dist/esm/{global-f9c17bf1.js → global-f9c720e6.js} +1 -1
  38. package/dist/esm/loader.js +2 -2
  39. package/dist/esm/priv-chart-popover.entry.js +1 -1
  40. package/dist/esm/priv-datepicker.entry.js +1 -1
  41. package/dist/esm/ripple.js +2 -2
  42. package/dist/esm/wm-action-menu_2.entry.js +1 -1
  43. package/dist/esm/wm-button.entry.js +31 -13
  44. package/dist/esm/wm-chart.entry.js +1 -1
  45. package/dist/esm/wm-datepicker.entry.js +8 -2
  46. package/dist/esm/wm-input.entry.js +2 -2
  47. package/dist/esm/wm-modal-header.entry.js +1 -1
  48. package/dist/esm/wm-modal.entry.js +1 -1
  49. package/dist/esm/wm-navigator.entry.js +1 -1
  50. package/dist/esm/wm-network-uploader.entry.js +3 -4
  51. package/dist/esm/wm-option_2.entry.js +1 -1
  52. package/dist/esm/wm-pagination.entry.js +1 -1
  53. package/dist/esm/wm-search.entry.js +1 -1
  54. package/dist/esm/wm-snackbar.entry.js +1 -1
  55. package/dist/esm/wm-tab-item_3.entry.js +3 -7
  56. package/dist/esm/wm-tag-input.entry.js +1 -1
  57. package/dist/esm/wm-timepicker.entry.js +2 -2
  58. package/dist/esm/wm-toggletip.entry.js +1 -1
  59. package/dist/esm/wm-uploader.entry.js +12 -25
  60. package/dist/ripple/{p-03f14a00.entry.js → p-0c488d9d.entry.js} +1 -1
  61. package/dist/ripple/{p-1fdd85ea.entry.js → p-111f705a.entry.js} +1 -1
  62. package/dist/ripple/{p-c5d718c7.entry.js → p-266e4bc2.entry.js} +1 -1
  63. package/dist/ripple/p-2caeca6b.entry.js +1 -0
  64. package/dist/ripple/{p-0b1cdd4e.entry.js → p-30f13477.entry.js} +1 -1
  65. package/dist/ripple/p-4414cb64.entry.js +1 -0
  66. package/dist/ripple/p-5585f23e.entry.js +1 -0
  67. package/dist/ripple/{p-f23d6211.entry.js → p-787469ab.entry.js} +1 -1
  68. package/dist/ripple/p-7d9c18b9.entry.js +1 -0
  69. package/dist/ripple/{p-c8655e6c.entry.js → p-8a4bac13.entry.js} +1 -1
  70. package/dist/ripple/{p-07f557b0.entry.js → p-938a5ba4.entry.js} +1 -1
  71. package/dist/ripple/{p-d5938de0.entry.js → p-9d6e4c64.entry.js} +1 -1
  72. package/dist/ripple/{p-94f584c5.entry.js → p-ad73d523.entry.js} +1 -1
  73. package/dist/ripple/{p-792a78d7.js → p-afc2d462.js} +1 -1
  74. package/dist/ripple/{p-cf075b3b.js → p-b5edcf38.js} +2 -2
  75. package/dist/ripple/{p-e26c9858.entry.js → p-b9656d44.entry.js} +1 -1
  76. package/dist/ripple/{p-c637686e.entry.js → p-bd05632b.entry.js} +1 -1
  77. package/dist/ripple/{p-0663e9fc.entry.js → p-c0b0510a.entry.js} +1 -1
  78. package/dist/ripple/{p-6b28f3fe.entry.js → p-cd466a5b.entry.js} +1 -1
  79. package/dist/ripple/p-da1435f1.entry.js +1 -0
  80. package/dist/ripple/p-e3765b8e.entry.js +1 -0
  81. package/dist/ripple/{p-addbfa91.entry.js → p-f3569e91.entry.js} +1 -1
  82. package/dist/ripple/ripple.esm.js +1 -1
  83. package/dist/types/components/wm-input/wm-input.d.ts +1 -1
  84. package/dist/types/components/wm-timepicker/wm-timepicker.d.ts +1 -1
  85. package/dist/types/components/wm-uploader/wm-network-uploader/wm-network-uploader.d.ts +0 -1
  86. package/dist/types/components/wm-uploader/wm-uploader.d.ts +0 -4
  87. package/dist/types/components.d.ts +0 -6
  88. package/package.json +1 -1
  89. package/dist/ripple/p-2d7891e9.entry.js +0 -1
  90. package/dist/ripple/p-6d0b3f08.entry.js +0 -1
  91. package/dist/ripple/p-a1fc8e81.entry.js +0 -1
  92. package/dist/ripple/p-a84de435.entry.js +0 -1
  93. package/dist/ripple/p-b14062a7.entry.js +0 -1
  94. package/dist/ripple/p-fb90d334.entry.js +0 -1
@@ -3,9 +3,9 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-cd179539.js');
6
- const functions = require('./functions-0cf2d639.js');
6
+ const functions = require('./functions-f0693632.js');
7
7
 
8
- const wmUploaderCss = "@charset \"UTF-8\";:host .wm-button,wm-uploader .wm-button{-ms-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);-moz-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;border-radius:5px;width:inherit;border:2px solid #575195;color:#575195;font-family:inherit;font-size:0.75rem;font-weight:700;height:2.75rem;padding:0 1.3333333333em;cursor:pointer;position:relative;background:#fff;display:flex;justify-content:center;align-items:center;text-decoration:none;text-transform:uppercase;letter-spacing:0.01875rem;overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}@media screen and (min-width: 48rem){:host .wm-button,wm-uploader .wm-button{height:3.3333333333em}}:host .wm-button.nowrap,wm-uploader .wm-button.nowrap{display:inline-block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .wm-button:focus,wm-uploader .wm-button:focus{outline:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wm-button::-moz-focus-inner,wm-uploader .wm-button::-moz-focus-inner{border:0;outline:none}:host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled):not(.-primary):not(.-secondary):not(.-secondary):not(.-selectoronly) .button-text,wm-uploader .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled):not(.-primary):not(.-secondary):not(.-secondary):not(.-selectoronly) .button-text{background:linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1em;border-radius:0;line-height:normal}:host .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled),wm-uploader .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled){-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark),wm-uploader .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark){-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}:host .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark)::-moz-focus-inner,wm-uploader .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark)::-moz-focus-inner{border:0}:host .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled),wm-uploader .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled){background:transparent;border:2px solid #fff;color:#fff}:host .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled):hover,wm-uploader .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled):hover{color:#575195;background:#e6e6e6;border:2px solid #e6e6e6}:host .wm-button.dark.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled).dark,wm-uploader .wm-button.dark.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled).dark{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;outline:none}:host .wm-button:active:not(:disabled):not(.disabled):not(.-textonly):not(.-actionbutton):not(.displayedoption),wm-uploader .wm-button:active:not(:disabled):not(.disabled):not(.-textonly):not(.-actionbutton):not(.displayedoption){-ms-transform:scale(0.9, 0.9);-webkit-transform:scale(0.9, 0.9);-moz-transform:scale(0.9, 0.9);transform:scale(0.9, 0.9)}:host .wm-button:hover,wm-uploader .wm-button:hover{background:#464177;color:#fff}:host .wm-button .mdi,wm-uploader .wm-button .mdi{display:inline-block;font:normal normal normal 24px/1 \"Material Design Icons\";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host .wm-button:not(.-icononly):not(.-navigational) .mdi,wm-uploader .wm-button:not(.-icononly):not(.-navigational) .mdi{margin-right:0.3125rem}:host .wm-button[dir=RTL] :not(.-icononly) .mdi,wm-uploader .wm-button[dir=RTL] :not(.-icononly) .mdi{margin-left:0.3125rem;margin-right:0}:host .wm-button.-primary:not(.-textonly),wm-uploader .wm-button.-primary:not(.-textonly){background:#575195;color:#fff}:host .wm-button.-primary:not(.-textonly):not(:focus),wm-uploader .wm-button.-primary:not(.-textonly):not(:focus){-webkit-box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2)}:host .wm-button.-primary:not(.-textonly):hover,wm-uploader .wm-button.-primary:not(.-textonly):hover{background:#464177}:host .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled),wm-uploader .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled){color:#575195;background:#fff;border:2px solid #fff}:host .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled):hover,wm-uploader .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled):hover{color:#575195;background:#e6e6e6;border:2px solid #e6e6e6}:host .wm-button.-textonly,wm-uploader .wm-button.-textonly{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;display:inline-block;letter-spacing:0;text-transform:none;text-align:initial;font-size:0.875rem;border:none;background:transparent;padding-left:0;padding-right:0;height:auto;border-radius:0;line-height:1}:host .wm-button.-textonly+.-textonly,wm-uploader .wm-button.-textonly+.-textonly{margin-left:0.3125rem}:host .wm-button.-textonly:focus,wm-uploader .wm-button.-textonly:focus{outline:none}:host .wm-button.-textonly::-moz-focus-inner,wm-uploader .wm-button.-textonly::-moz-focus-inner{border:0;outline:none}:host .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled) .button-text,wm-uploader .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled) .button-text{background:linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1em;border-radius:0;line-height:normal}:host .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled).dark .button-text,wm-uploader .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled).dark .button-text{background:linear-gradient(90deg, #fff 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1em;border-radius:0;line-height:normal}:host .wm-button.-textonly.small,wm-uploader .wm-button.-textonly.small{font-size:0.625rem}:host .wm-button.-textonly:hover:not(:disabled):not(.disabled):not(.-permanentlydelete),wm-uploader .wm-button.-textonly:hover:not(:disabled):not(.disabled):not(.-permanentlydelete){text-decoration:underline;color:#454077}:host .wm-button.-textonly.-permanentlydelete,wm-uploader .wm-button.-textonly.-permanentlydelete{color:#c0392b}:host .wm-button.-textonly.-permanentlydelete:hover,wm-uploader .wm-button.-textonly.-permanentlydelete:hover{text-decoration:underline;color:#c0392b !important}:host .wm-button.-textonly.dark,wm-uploader .wm-button.-textonly.dark{color:#fff}:host .wm-button.-textonly.dark:hover,wm-uploader .wm-button.-textonly.dark:hover{text-decoration:underline;color:#fff !important}:host .wm-button.-icononly,wm-uploader .wm-button.-icononly,:host .wm-button.-navigational,wm-uploader .wm-button.-navigational{-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;font-size:1rem;padding:0;height:auto;line-height:1;min-width:2.75rem;min-height:2.75rem;text-align:center;letter-spacing:normal}:host .wm-button.-icononly:not(:focus),wm-uploader .wm-button.-icononly:not(:focus),:host .wm-button.-navigational:not(:focus),wm-uploader .wm-button.-navigational:not(:focus){-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}@media screen and (min-width: 48rem){:host .wm-button.-icononly,wm-uploader .wm-button.-icononly,:host .wm-button.-navigational,wm-uploader .wm-button.-navigational{min-width:2.5rem;min-height:2.5rem}}:host .wm-button.-icononly,wm-uploader .wm-button.-icononly{border-width:1px !important}:host .wm-button.-icononly:before,wm-uploader .wm-button.-icononly:before{display:inline-block;font:normal normal normal 24px/1 \"Material Design Icons\";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host .wm-button.-navigational,wm-uploader .wm-button.-navigational{border:none !important;background-color:transparent}:host .wm-button.-navigational:not(.dark):not(:disabled),wm-uploader .wm-button.-navigational:not(.dark):not(:disabled){color:#575195}:host .wm-button.-navigational:not(.dark):not(:disabled):hover,wm-uploader .wm-button.-navigational:not(.dark):not(:disabled):hover,:host .wm-button.-navigational:not(.dark):not(:disabled).selected,wm-uploader .wm-button.-navigational:not(.dark):not(:disabled).selected{background-color:#d7d6d9}:host .wm-button.-navigational:before,wm-uploader .wm-button.-navigational:before{display:inline-block;font:normal normal normal 24px/1 \"Material Design Icons\";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host .wm-button.-permanentlydelete:not(.-textonly),wm-uploader .wm-button.-permanentlydelete:not(.-textonly){background:#c0392b;border-color:#c0392b;color:#fff}:host .wm-button.-selectoronly,wm-uploader .wm-button.-selectoronly{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;display:block;background:transparent;border:1px solid #575195;border-radius:3px 3px 3px 3px;height:2.75rem;min-width:11.4375rem;padding:0 1.875rem 0 0.9375rem;line-height:normal;font-family:inherit;color:#575195;font-weight:500;font-size:0.875rem;text-transform:none;letter-spacing:0.01875rem;text-align:left}@media screen and (min-width: 48rem){:host .wm-button.-selectoronly,wm-uploader .wm-button.-selectoronly{height:2.5rem}}:host .wm-button.-selectoronly:before,wm-uploader .wm-button.-selectoronly:before{display:inline-block;font:normal normal normal 24px/1 \"Material Design Icons\";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:\"\";position:absolute;right:0.5625rem;top:50%;transform:translateY(-50%);pointer-events:none}:host .wm-button.-selectoronly:hover:not(:disabled):not(.disabled),wm-uploader .wm-button.-selectoronly:hover:not(:disabled):not(.disabled){background:transparent;text-decoration:none}:host .wm-button.-selectoronly:active,wm-uploader .wm-button.-selectoronly:active{-ms-transform:scale(1, 1) !important;transform:scale(1, 1) !important}:host .wm-button.-selectoronly::-moz-focus-inner,wm-uploader .wm-button.-selectoronly::-moz-focus-inner{border:0}:host .wm-button.-selectoronly .overflowcontrol,wm-uploader .wm-button.-selectoronly .overflowcontrol{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:visible}:host .wm-button:disabled,wm-uploader .wm-button:disabled,:host .wm-button.disabled,wm-uploader .wm-button.disabled{background:inherit;border-color:#737373;color:#737373;cursor:default;pointer-events:none}:host .wm-button:disabled.dark,wm-uploader .wm-button:disabled.dark,:host .wm-button.disabled.dark,wm-uploader .wm-button.disabled.dark{color:#a6a6a6;border-color:#a6a6a6}:host .wm-button:disabled.-primary,wm-uploader .wm-button:disabled.-primary,:host .wm-button:disabled.-permanentlydelete,wm-uploader .wm-button:disabled.-permanentlydelete,:host .wm-button.disabled.-primary,wm-uploader .wm-button.disabled.-primary,:host .wm-button.disabled.-permanentlydelete,wm-uploader .wm-button.disabled.-permanentlydelete{background:#737373;color:#fff;border-color:#737373}:host .wm-button:disabled.-primary.dark,wm-uploader .wm-button:disabled.-primary.dark,:host .wm-button.disabled.-primary.dark,wm-uploader .wm-button.disabled.-primary.dark{background:#a6a6a6;border-color:#a6a6a6;color:#353b48}:host .wm-button:disabled.-secondary,wm-uploader .wm-button:disabled.-secondary,:host .wm-button.disabled.-secondary,wm-uploader .wm-button.disabled.-secondary{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wm-button:disabled.-selectoronly,wm-uploader .wm-button:disabled.-selectoronly,:host .wm-button.disabled.-selectoronly,wm-uploader .wm-button.disabled.-selectoronly{color:#737373}:host .wm-button:disabled.-textonly,wm-uploader .wm-button:disabled.-textonly,:host .wm-button.disabled.-textonly,wm-uploader .wm-button.disabled.-textonly{color:#6b6b6b;background:transparent}:host a.wm-button,wm-uploader a.wm-button,:host label.wm-button,wm-uploader label.wm-button{height:auto;padding-top:0.75rem;padding-bottom:0.75rem}:host,wm-uploader{width:100%;height:100%;display:block;position:relative}:host[dir=RTL] .mdi,wm-uploader[dir=RTL] .mdi{margin-left:0.3125rem;margin-right:0}:host input:focus~.wm-button.user-is-tabbing,wm-uploader input:focus~.wm-button.user-is-tabbing{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important}:host *,wm-uploader *{box-sizing:border-box}.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}.header{margin-bottom:1rem}.header .slot-wrapper{display:flex;justify-content:flex-start;align-items:flex-start}.header .slot-wrapper.right{justify-content:flex-end}.footer{display:flex;flex-direction:column;align-items:flex-end;padding:0.9375rem 1.875rem}.footer.left{align-items:flex-start}.footer .filecount-wrapper{display:flex;align-items:center}.footer .filecount-wrapper .filecount{font-size:0.875rem;margin:0 1rem}.notif-wrapper{position:relative;display:flex;flex-direction:column;margin-bottom:1rem}.notif-wrapper.left{align-items:flex-start}.notif-wrapper.right{align-items:flex-end}.notif{padding-top:0.25rem;font-size:0.875rem;font-style:italic;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.info-wrapper{position:relative;display:flex;align-items:center}.info-wrapper .info{font-size:0.875rem;margin:0 1rem}.file-info{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.file-info+.file-controls{flex:none;margin-left:1rem}.empty-block{margin:5rem auto;display:flex;flex-direction:column;align-items:center}.empty-block .upload-file{margin-bottom:1.875rem}.empty-block .empty-message{font-size:0.875rem;margin-bottom:0.4375rem}.empty-block .empty-message.large{font-size:1.5rem}.empty-block .info-wrapper{justify-content:center;width:100%}.empty-block .info-wrapper .wm-button{width:auto}.list-container{overflow-y:auto}.list-container.type1{padding:0 1.875rem;height:16.25rem}ul{list-style:none;padding:0;width:100%}ul li{font-size:0.875rem}ul li .file{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;position:relative;height:3.75rem;padding:0.5rem 1.25rem;background:#f4f4f4;border:1px solid #6b6b6b;display:flex;justify-content:space-between;align-items:center}ul li .file+.file{margin-top:1.25rem}ul li .file .filename{font-weight:500}ul li .file wm-button+wm-button{margin-left:1rem}ul.file-list .file.--saved,ul.inprogress-list .file{margin-bottom:1.625rem}ul .progress{position:absolute;left:0;top:0;right:0;height:8px}ul.error-list li{margin-bottom:1.25rem;color:#c0392b}ul.error-list li .file{border:1px solid #c0392b;background-color:#f5ebea;height:3.75rem}ul.error-list li .error-message{padding-top:0.25rem;font-style:italic}";
8
+ const wmUploaderCss = "@charset \"UTF-8\";:host .wm-button,wm-uploader .wm-button{-ms-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);-moz-transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);transition:background-color 500ms cubic-bezier(0.4, 0, 0.2, 1), color 500ms cubic-bezier(0.4, 0, 0.2, 1), border 500ms cubic-bezier(0.4, 0, 0.2, 1);-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;border-radius:5px;width:inherit;border:2px solid #575195;color:#575195;font-family:inherit;font-size:0.75rem;font-weight:700;height:2.75rem;padding:0 1.3333333333em;cursor:pointer;position:relative;background:#fff;display:flex;justify-content:center;align-items:center;text-decoration:none;text-transform:uppercase;letter-spacing:0.01875rem;overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}@media screen and (min-width: 48rem){:host .wm-button,wm-uploader .wm-button{height:3.3333333333em}}:host .wm-button.nowrap,wm-uploader .wm-button.nowrap{display:inline-block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .wm-button:focus,wm-uploader .wm-button:focus{outline:none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wm-button::-moz-focus-inner,wm-uploader .wm-button::-moz-focus-inner{border:0;outline:none}:host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) :host .wm-button.-textonly .button-text,wm-uploader .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) :host .wm-button.-textonly .button-text,:host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) wm-uploader .wm-button.-textonly .button-text,wm-uploader .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) wm-uploader .wm-button.-textonly .button-text{background:linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1em;border-radius:0;line-height:normal}:host .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled),wm-uploader .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled){-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark),wm-uploader .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark){-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e}:host .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark)::-moz-focus-inner,wm-uploader .wm-button.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled):not(.dark)::-moz-focus-inner{border:0}:host .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled),wm-uploader .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled){background:transparent;border:2px solid #fff;color:#fff}:host .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled):hover,wm-uploader .wm-button.dark:not(.-textonly):not(:disabled):not(.disabled):hover{color:#575195;background:#e6e6e6;border:2px solid #e6e6e6}:host .wm-button.dark.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled).dark,wm-uploader .wm-button.dark.user-is-tabbing:focus:not(.-textonly):not(:disabled):not(.disabled).dark{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #c6b4e3;outline:none}:host .wm-button:active:not(:disabled):not(.disabled):not(.-textonly):not(.-actionbutton):not(.displayedoption),wm-uploader .wm-button:active:not(:disabled):not(.disabled):not(.-textonly):not(.-actionbutton):not(.displayedoption){-ms-transform:scale(0.9, 0.9);-webkit-transform:scale(0.9, 0.9);-moz-transform:scale(0.9, 0.9);transform:scale(0.9, 0.9)}:host .wm-button:hover,wm-uploader .wm-button:hover{background:#464177;color:#fff}:host .wm-button .mdi,wm-uploader .wm-button .mdi{display:inline-block;font:normal normal normal 24px/1 \"Material Design Icons\";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host .wm-button:not(.-icononly):not(.-navigational) .mdi,wm-uploader .wm-button:not(.-icononly):not(.-navigational) .mdi{margin-right:0.3125rem}:host .wm-button[dir=RTL] :not(.-icononly) .mdi,wm-uploader .wm-button[dir=RTL] :not(.-icononly) .mdi{margin-left:0.3125rem;margin-right:0}:host .wm-button.-primary:not(.-textonly),wm-uploader .wm-button.-primary:not(.-textonly){background:#575195;color:#fff}:host .wm-button.-primary:not(.-textonly):not(:focus),wm-uploader .wm-button.-primary:not(.-textonly):not(:focus){-webkit-box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);-moz-box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2);box-shadow:0 2px 2px 0 rgba(87, 81, 149, 0.12), 0 2px 2px 0 rgba(0, 0, 0, 0.2)}:host .wm-button.-primary:not(.-textonly):hover,wm-uploader .wm-button.-primary:not(.-textonly):hover{background:#464177}:host .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled),wm-uploader .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled){color:#575195;background:#fff;border:2px solid #fff}:host .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled):hover,wm-uploader .wm-button.-primary:not(.-textonly).dark:not(:disabled):not(.disabled):hover{color:#575195;background:#e6e6e6;border:2px solid #e6e6e6}:host .wm-button.-textonly,wm-uploader .wm-button.-textonly{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;display:inline-block;letter-spacing:0;text-transform:none;text-align:initial;font-size:0.875rem;border:none;background:transparent;padding-left:0;padding-right:0;height:auto;border-radius:0;line-height:1}:host .wm-button.-textonly+.-textonly,wm-uploader .wm-button.-textonly+.-textonly{margin-left:0.3125rem}:host .wm-button.-textonly:focus,wm-uploader .wm-button.-textonly:focus{outline:none}:host .wm-button.-textonly::-moz-focus-inner,wm-uploader .wm-button.-textonly::-moz-focus-inner{border:0;outline:none}:host .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled) .button-text,wm-uploader .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled) .button-text{background:linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1em;border-radius:0;line-height:normal}:host .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled).dark .button-text,wm-uploader .wm-button.-textonly.user-is-tabbing:focus:not(:disabled):not(.disabled).dark .button-text{background:linear-gradient(90deg, #fff 66%, transparent 0) repeat-x;background-size:6px 3px;background-position:0 1em;border-radius:0;line-height:normal}:host .wm-button.-textonly.small,wm-uploader .wm-button.-textonly.small{font-size:0.625rem}:host .wm-button.-textonly:hover:not(:disabled):not(.disabled):not(.-permanentlydelete),wm-uploader .wm-button.-textonly:hover:not(:disabled):not(.disabled):not(.-permanentlydelete){text-decoration:underline;color:#454077}:host .wm-button.-textonly.-permanentlydelete,wm-uploader .wm-button.-textonly.-permanentlydelete{color:#c0392b}:host .wm-button.-textonly.-permanentlydelete:hover,wm-uploader .wm-button.-textonly.-permanentlydelete:hover{text-decoration:underline;color:#c0392b !important}:host .wm-button.-textonly.dark,wm-uploader .wm-button.-textonly.dark{color:#fff}:host .wm-button.-textonly.dark:hover,wm-uploader .wm-button.-textonly.dark:hover{text-decoration:underline;color:#fff !important}:host .wm-button.-icononly,wm-uploader .wm-button.-icononly,:host .wm-button.-navigational,wm-uploader .wm-button.-navigational{-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;border-radius:50%;font-size:1rem;padding:0;height:auto;line-height:1;min-width:2.75rem;min-height:2.75rem;text-align:center;letter-spacing:normal}:host .wm-button.-icononly:not(:focus),wm-uploader .wm-button.-icononly:not(:focus),:host .wm-button.-navigational:not(:focus),wm-uploader .wm-button.-navigational:not(:focus){-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}@media screen and (min-width: 48rem){:host .wm-button.-icononly,wm-uploader .wm-button.-icononly,:host .wm-button.-navigational,wm-uploader .wm-button.-navigational{min-width:2.5rem;min-height:2.5rem}}:host .wm-button.-icononly,wm-uploader .wm-button.-icononly{border-width:1px !important}:host .wm-button.-icononly:before,wm-uploader .wm-button.-icononly:before{display:inline-block;font:normal normal normal 24px/1 \"Material Design Icons\";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host .wm-button.-navigational,wm-uploader .wm-button.-navigational{border:none !important;background-color:transparent}:host .wm-button.-navigational:not(.dark):not(:disabled),wm-uploader .wm-button.-navigational:not(.dark):not(:disabled){color:#575195}:host .wm-button.-navigational:not(.dark):not(:disabled):hover,wm-uploader .wm-button.-navigational:not(.dark):not(:disabled):hover,:host .wm-button.-navigational:not(.dark):not(:disabled).selected,wm-uploader .wm-button.-navigational:not(.dark):not(:disabled).selected{background-color:#d7d6d9}:host .wm-button.-navigational:before,wm-uploader .wm-button.-navigational:before{display:inline-block;font:normal normal normal 24px/1 \"Material Design Icons\";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:host .wm-button.-permanentlydelete:not(.-textonly),wm-uploader .wm-button.-permanentlydelete:not(.-textonly){background:#c0392b;border-color:#c0392b;color:#fff}:host .wm-button.-permanentlydelete:not(.-textonly):hover,wm-uploader .wm-button.-permanentlydelete:not(.-textonly):hover{background:#9a2e22;border-color:#9a2e22}:host .wm-button.-pairnegative,wm-uploader .wm-button.-pairnegative{background:#cc4c3e;border-color:#cc4c3e;color:#fff}:host .wm-button.-pairnegative:hover,wm-uploader .wm-button.-pairnegative:hover{background:#a33d32;border-color:#a33d32}:host .wm-button.-pairpositive,wm-uploader .wm-button.-pairpositive{background:#15868d;border-color:#15868d;color:#fff}:host .wm-button.-pairpositive:hover,wm-uploader .wm-button.-pairpositive:hover{background:#116b71;border-color:#116b71}:host .wm-button.-selectoronly,wm-uploader .wm-button.-selectoronly{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;display:block;background:transparent;border:1px solid #575195;border-radius:3px 3px 3px 3px;height:2.75rem;min-width:11.4375rem;padding:0 1.875rem 0 0.9375rem;line-height:normal;font-family:inherit;color:#575195;font-weight:500;font-size:0.875rem;text-transform:none;letter-spacing:0.01875rem;text-align:left}@media screen and (min-width: 48rem){:host .wm-button.-selectoronly,wm-uploader .wm-button.-selectoronly{height:2.5rem}}:host .wm-button.-selectoronly:before,wm-uploader .wm-button.-selectoronly:before{display:inline-block;font:normal normal normal 24px/1 \"Material Design Icons\";font-size:inherit;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;content:\"\";position:absolute;right:0.5625rem;top:50%;transform:translateY(-50%);pointer-events:none}:host .wm-button.-selectoronly:hover:not(:disabled):not(.disabled),wm-uploader .wm-button.-selectoronly:hover:not(:disabled):not(.disabled){background:transparent;text-decoration:none}:host .wm-button.-selectoronly:active,wm-uploader .wm-button.-selectoronly:active{-ms-transform:scale(1, 1) !important;transform:scale(1, 1) !important}:host .wm-button.-selectoronly::-moz-focus-inner,wm-uploader .wm-button.-selectoronly::-moz-focus-inner{border:0}:host .wm-button.-selectoronly .overflowcontrol,wm-uploader .wm-button.-selectoronly .overflowcontrol{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:visible}:host .wm-button:disabled,wm-uploader .wm-button:disabled,:host .wm-button.disabled,wm-uploader .wm-button.disabled{background:inherit;border-color:#737373;color:#737373;cursor:default;pointer-events:none}:host .wm-button:disabled.dark,wm-uploader .wm-button:disabled.dark,:host .wm-button.disabled.dark,wm-uploader .wm-button.disabled.dark{color:#a6a6a6;border-color:#a6a6a6}:host .wm-button:disabled.-primary,wm-uploader .wm-button:disabled.-primary,:host .wm-button:disabled.-permanentlydelete,wm-uploader .wm-button:disabled.-permanentlydelete,:host .wm-button:disabled.-pairnegative,wm-uploader .wm-button:disabled.-pairnegative,:host .wm-button:disabled.-pairpositive,wm-uploader .wm-button:disabled.-pairpositive,:host .wm-button.disabled.-primary,wm-uploader .wm-button.disabled.-primary,:host .wm-button.disabled.-permanentlydelete,wm-uploader .wm-button.disabled.-permanentlydelete,:host .wm-button.disabled.-pairnegative,wm-uploader .wm-button.disabled.-pairnegative,:host .wm-button.disabled.-pairpositive,wm-uploader .wm-button.disabled.-pairpositive{background:#737373;color:#fff;border-color:#737373}:host .wm-button:disabled.-primary.dark,wm-uploader .wm-button:disabled.-primary.dark,:host .wm-button.disabled.-primary.dark,wm-uploader .wm-button.disabled.-primary.dark{background:#a6a6a6;border-color:#a6a6a6;color:#353b48}:host .wm-button:disabled.-secondary,wm-uploader .wm-button:disabled.-secondary,:host .wm-button.disabled.-secondary,wm-uploader .wm-button.disabled.-secondary{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}:host .wm-button:disabled.-selectoronly,wm-uploader .wm-button:disabled.-selectoronly,:host .wm-button.disabled.-selectoronly,wm-uploader .wm-button.disabled.-selectoronly{color:#737373}:host .wm-button:disabled.-textonly,wm-uploader .wm-button:disabled.-textonly,:host .wm-button.disabled.-textonly,wm-uploader .wm-button.disabled.-textonly{color:#6b6b6b;background:transparent}:host a.wm-button,wm-uploader a.wm-button,:host label.wm-button,wm-uploader label.wm-button{height:auto;padding-top:0.75rem;padding-bottom:0.75rem}:host,wm-uploader{width:100%;height:100%;display:block;position:relative}:host[dir=RTL] .mdi,wm-uploader[dir=RTL] .mdi{margin-left:0.3125rem;margin-right:0}:host input:focus+.wm-button.user-is-tabbing,wm-uploader input:focus+.wm-button.user-is-tabbing{-webkit-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;-moz-box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;box-shadow:0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important}:host *,wm-uploader *{box-sizing:border-box}.sr-only{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;border:0 !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;clip-path:inset(50%) !important;white-space:nowrap !important;margin:-1px !important}.header{margin-bottom:1rem}.header .slot-wrapper{display:flex;justify-content:flex-start;align-items:flex-start}.header .info-wrapper{align-items:center}.header .info-wrapper .info{font-size:0.875rem;margin-left:1rem}.footer{display:flex;flex-direction:column;align-items:flex-end;padding:0.9375rem 1.875rem}.footer .notif-wrapper{align-items:flex-end}.footer .filecount-wrapper{display:flex;align-items:center}.footer .filecount-wrapper .filecount{font-size:0.875rem;margin-right:1rem}.notif-wrapper{position:relative;display:flex;flex-direction:column;margin-bottom:1rem}.notif{padding-top:0.25rem;font-size:0.875rem;font-style:italic;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.info-wrapper{position:relative;display:flex}.file-info{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.file-info+.file-controls{flex:none;margin-left:1rem}.empty-block{margin:5rem auto;display:flex;flex-direction:column;align-items:center}.empty-block .upload-file{margin-bottom:1.875rem}.empty-block .empty-message{font-size:0.875rem;margin-bottom:0.4375rem}.empty-block .empty-message.large{font-size:1.5rem}.empty-block .info-wrapper{justify-content:center;width:100%}.empty-block .info-wrapper .wm-button{width:auto}.list-container{overflow-y:auto}.list-container.type1{padding:0 1.875rem;height:16.25rem}ul{list-style:none;padding:0;width:100%}ul li{font-size:0.875rem}ul li .file{-webkit-border-radius:3px;-moz-border-radius:3px;-ms-border-radius:3px;border-radius:3px;position:relative;height:3.75rem;padding:0.5rem 1.25rem;background:#f4f4f4;border:1px solid #6b6b6b;display:flex;justify-content:space-between;align-items:center}ul li .file+.file{margin-top:1.25rem}ul li .file .filename{font-weight:500}ul li .file wm-button+wm-button{margin-left:1rem}ul.file-list .file.--saved,ul.inprogress-list .file{margin-bottom:1.625rem}ul .progress{position:absolute;left:0;top:0;right:0;height:8px}ul.error-list li{margin-bottom:1.25rem;color:#c0392b}ul.error-list li .file{border:1px solid #c0392b;background-color:#f5ebea;height:3.75rem}ul.error-list li .error-message{padding-top:0.25rem;font-style:italic}";
9
9
 
10
10
  const Uploader = class {
11
11
  constructor(hostRef) {
@@ -21,8 +21,6 @@ const Uploader = class {
21
21
  this.fileTypes = "pdf txt log xml doc docx xls xlsx ppt pptx gif jpg jpeg png csv";
22
22
  this.maxSize = 100; // in Mb
23
23
  this.sortBy = "date"; // name is descending (a -> z), date is ascending (earlier -> later)
24
- this.buttonType = this.tempUploaderType === "1" ? "primary" : "secondary";
25
- this.buttonPosition = this.tempUploaderType === "1" ? "right" : "left";
26
24
  this.fileList = []; // the string above transformed into the actual array
27
25
  this.filesToUpload = []; // input.files that passed validation
28
26
  this.isTabbing = false;
@@ -34,15 +32,6 @@ const Uploader = class {
34
32
  // don't forget to reset this.uploaderType's default value to "1"
35
33
  return this.type || this.uploaderType || "1";
36
34
  }
37
- get buttonsideText() {
38
- const isEmpty = this.fileList.length > 0;
39
- const info = this.renderInfo();
40
- const filecount = isEmpty ? (index.h("div", { class: "filecount" }, functions.intl.formatMessage({
41
- id: "uploader.filesAdded",
42
- defaultMessage: "{numFiles, plural, one {1 file added} other {# files added}}",
43
- }, { numFiles: this.fileList.length }))) : null;
44
- return this.tempUploaderType === "1" ? filecount : info;
45
- }
46
35
  toggleTabbingOn() {
47
36
  this.isTabbing = true;
48
37
  }
@@ -290,9 +279,6 @@ const Uploader = class {
290
279
  this.toggleTabbingOn();
291
280
  }
292
281
  }
293
- sortByButtonPosition(elements) {
294
- return this.buttonPosition === "left" ? elements : elements.reverse();
295
- }
296
282
  renderUploadSvg() {
297
283
  return (index.h("svg", { class: "upload-file", width: "91", height: "84", viewBox: "0 0 91 84" }, index.h("path", { transform: "rotate(-180.000000) translate(-452, -255.5)", fill: "#eae8ec", d: "M361,249.681818 L361,197.318182 C361,194.118182 365.555061,191.5 371.122358,191.5 L391.316463,191.5 L391.286495,200.562515 L369.871211,200.600292 L369.885404,200.622146 L369.886423,246.655947 L443.657038,246.840767 L443.657038,200.622146 L421.683537,200.622146 L421.683537,191.5 L441.978865,191.5 C447.546162,191.5 452,194.118182 452,197.318182 L452,249.681818 C452,252.881818 447.546162,255.5 441.978865,255.5 L371.122358,255.5 C365.504449,255.5 361,252.881818 361,249.681818 Z M391.5,207 L406,221 L420.5,207 L409.625,207 L409.625,172 L402.375,172 L402.375,207 L391.5,207 Z" })));
298
284
  }
@@ -302,18 +288,16 @@ const Uploader = class {
302
288
  return (this.icon && (index.h("span", { class: `mdi ${rotate ? "rotate" : ""}` }, String.fromCodePoint(parseInt(`0x${this.icon}`)))));
303
289
  }
304
290
  renderInfo() {
305
- return this.info ? index.h("span", { class: "info" }, this.info) : "";
291
+ return this.info && this.tempUploaderType === "2" ? index.h("span", { class: "info" }, this.info) : "";
306
292
  }
307
293
  renderNotif() {
308
294
  return this.notif ? index.h("div", { class: "notif" }, this.notif.message) : "";
309
295
  }
310
296
  renderUploadButton(classes) {
311
- const label = (index.h("label", { htmlFor: this.inputId, class: `wm-button ${classes}${this.isTabbing ? " user-is-tabbing" : ""}` }, this.renderIcon(), this.buttonText));
312
- const innerElements = this.sortByButtonPosition([label, this.buttonsideText]);
313
- return (index.h("div", { class: "info-wrapper" }, index.h("input", { ref: (el) => (this.inputEl = el), name: this.inputId, id: this.inputId, class: "sr-only", type: "file", multiple: true, onClick: () => this.clearErrors(), onChange: (e) => this.handleFiles(e), disabled: this.isDisabled() }), innerElements.map((x) => x)));
297
+ return (index.h("div", { class: "info-wrapper" }, index.h("input", { ref: (el) => (this.inputEl = el), name: this.inputId, id: this.inputId, class: "sr-only", type: "file", multiple: true, onClick: () => this.clearErrors(), onChange: (e) => this.handleFiles(e), disabled: this.isDisabled() }), index.h("label", { htmlFor: this.inputId, class: `wm-button ${classes}${this.isTabbing ? " user-is-tabbing" : ""}` }, this.renderIcon(), this.buttonText), this.renderInfo()));
314
298
  }
315
299
  renderEmptyState() {
316
- return (index.h("div", { class: "empty-block" }, this.renderUploadSvg(), index.h("div", { class: `empty-message` }, this.emptyStateText), this.renderUploadButton(`-primary empty-button`), this.renderNotif()));
300
+ return (index.h("div", { class: "empty-block" }, this.renderUploadSvg(), index.h("div", { class: `empty-message` }, this.emptyStateText), this.renderUploadButton("-primary empty-button"), this.renderNotif()));
317
301
  }
318
302
  renderErrorList() {
319
303
  if (!!this.errorList.length) {
@@ -344,13 +328,16 @@ const Uploader = class {
344
328
  }
345
329
  }
346
330
  renderHeader() {
347
- return (index.h("div", { class: "header" }, index.h("div", { class: `slot-wrapper ${this.buttonPosition}` }, index.h("slot", null), index.h("div", { class: `notif-wrapper ${this.buttonPosition}` }, this.renderUploadButton(`-${this.buttonType} ${this.isDisabled() ? "disabled" : ""}`), this.renderNotif()))));
331
+ return (this.tempUploaderType === "2" && (index.h("div", { class: "header" }, index.h("div", { class: "slot-wrapper" }, index.h("slot", null), index.h("div", { class: "notif-wrapper" }, this.renderUploadButton(`-secondary ${this.isDisabled() ? "disabled" : ""}`), this.renderNotif())))));
348
332
  }
349
333
  renderFooter() {
350
- return (index.h("div", { class: `footer ${this.buttonPosition}` }, index.h("div", { class: `notif-wrapper ${this.buttonPosition}` }, index.h("div", { class: "filecount-wrapper" }, this.renderUploadButton(`-${this.buttonType} ${this.isDisabled() ? "disabled" : ""}`)), this.renderNotif())));
334
+ return (this.tempUploaderType === "1" && (index.h("div", { class: "footer" }, index.h("div", { class: "notif-wrapper" }, index.h("div", { class: "filecount-wrapper" }, index.h("div", { class: "filecount" }, functions.intl.formatMessage({
335
+ id: "uploader.filesAdded",
336
+ defaultMessage: "{numFiles, plural, one {1 file added} other {# files added}}",
337
+ }, { numFiles: this.fileList.length })), this.renderUploadButton(`-primary ${this.isDisabled() ? "disabled" : ""}`)), this.renderNotif()))));
351
338
  }
352
339
  renderWithItems() {
353
- return (index.h("div", null, this.tempUploaderType === "2" && this.renderHeader(), index.h("div", { class: `list-container type${this.tempUploaderType}` }, this.renderErrorList(), this.renderFileList()), this.tempUploaderType === "1" && this.renderFooter()));
340
+ return (index.h("div", null, this.renderHeader(), index.h("div", { class: `list-container type${this.tempUploaderType}` }, this.renderErrorList(), this.renderFileList()), this.renderFooter()));
354
341
  }
355
342
  render() {
356
343
  return (index.h(index.Host, null, this.isEmpty() && this.tempUploaderType === "1" ? this.renderEmptyState() : this.renderWithItems(), index.h("div", { ref: (el) => (this.liveRegion = el), class: "live-region sr-only", "aria-live": "assertive" // since it's directly linked to the action the user took, it should be read in priority. With polite, some messages get dismissed in favor of the page title
@@ -101,8 +101,10 @@ wm-button .wm-button::-moz-focus-inner {
101
101
  border: 0;
102
102
  outline: none;
103
103
  }
104
- :host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled):not(.-primary):not(.-secondary):not(.-secondary):not(.-selectoronly) .button-text,
105
- wm-button .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled):not(.-primary):not(.-secondary):not(.-secondary):not(.-selectoronly) .button-text {
104
+ :host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) :host .wm-button.-textonly .button-text,
105
+ wm-button .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) :host .wm-button.-textonly .button-text,
106
+ :host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) wm-button .wm-button.-textonly .button-text,
107
+ wm-button .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) wm-button .wm-button.-textonly .button-text {
106
108
  background: linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;
107
109
  background-size: 6px 3px;
108
110
  background-position: 0 1em;
@@ -354,6 +356,33 @@ wm-button .wm-button.-permanentlydelete:not(.-textonly) {
354
356
  border-color: #c0392b;
355
357
  color: #fff;
356
358
  }
359
+ :host .wm-button.-permanentlydelete:not(.-textonly):hover,
360
+ wm-button .wm-button.-permanentlydelete:not(.-textonly):hover {
361
+ background: #9a2e22;
362
+ border-color: #9a2e22;
363
+ }
364
+ :host .wm-button.-pairnegative,
365
+ wm-button .wm-button.-pairnegative {
366
+ background: #cc4c3e;
367
+ border-color: #cc4c3e;
368
+ color: #fff;
369
+ }
370
+ :host .wm-button.-pairnegative:hover,
371
+ wm-button .wm-button.-pairnegative:hover {
372
+ background: #a33d32;
373
+ border-color: #a33d32;
374
+ }
375
+ :host .wm-button.-pairpositive,
376
+ wm-button .wm-button.-pairpositive {
377
+ background: #15868d;
378
+ border-color: #15868d;
379
+ color: #fff;
380
+ }
381
+ :host .wm-button.-pairpositive:hover,
382
+ wm-button .wm-button.-pairpositive:hover {
383
+ background: #116b71;
384
+ border-color: #116b71;
385
+ }
357
386
  :host .wm-button.-selectoronly,
358
387
  wm-button .wm-button.-selectoronly {
359
388
  -webkit-border-radius: 3px;
@@ -436,9 +465,13 @@ wm-button .wm-button.disabled.dark {
436
465
  }
437
466
  :host .wm-button:disabled.-primary,
438
467
  wm-button .wm-button:disabled.-primary, :host .wm-button:disabled.-permanentlydelete,
439
- wm-button .wm-button:disabled.-permanentlydelete, :host .wm-button.disabled.-primary,
468
+ wm-button .wm-button:disabled.-permanentlydelete, :host .wm-button:disabled.-pairnegative,
469
+ wm-button .wm-button:disabled.-pairnegative, :host .wm-button:disabled.-pairpositive,
470
+ wm-button .wm-button:disabled.-pairpositive, :host .wm-button.disabled.-primary,
440
471
  wm-button .wm-button.disabled.-primary, :host .wm-button.disabled.-permanentlydelete,
441
- wm-button .wm-button.disabled.-permanentlydelete {
472
+ wm-button .wm-button.disabled.-permanentlydelete, :host .wm-button.disabled.-pairnegative,
473
+ wm-button .wm-button.disabled.-pairnegative, :host .wm-button.disabled.-pairpositive,
474
+ wm-button .wm-button.disabled.-pairpositive {
442
475
  background: #737373;
443
476
  color: #fff;
444
477
  border-color: #737373;
@@ -51,7 +51,16 @@ export class Button {
51
51
  this.el.onclick = this.disabled ? null : this.clickFunc;
52
52
  }
53
53
  validateType(newValue) {
54
- const valid = ["primary", "secondary", "textonly", "icononly", "navigational", "selectoronly"].includes(newValue);
54
+ const valid = [
55
+ "primary",
56
+ "secondary",
57
+ "textonly",
58
+ "icononly",
59
+ "navigational",
60
+ "selectoronly",
61
+ "pairpositive",
62
+ "pairnegative",
63
+ ].includes(newValue);
55
64
  if (!valid) {
56
65
  this.buttonType = "secondary";
57
66
  }
@@ -69,16 +78,25 @@ export class Button {
69
78
  this.icon = getIconCodeFromName(this.icon);
70
79
  }
71
80
  validateIcon() {
72
- // if the style is icononly or navigational...
73
- if (this.tempButtonType === "icononly" || this.tempButtonType === "navigational") {
74
- // - an icon must be provided
75
- if (!this.icon) {
76
- console.error("wm-button should have a valid 'icon' property when button-type is set to 'icononly' or 'navigational'.");
77
- }
78
- // - if no tooltip text was passed and we couldn't generate one, throw an error
79
- if (!this.tooltip) {
80
- console.error("wm-button should have a valid 'tooltip' property when button-type is set to 'icononly' or 'navigational'.");
81
- }
81
+ switch (this.tempButtonType) {
82
+ case "icononly":
83
+ case "navigational":
84
+ // if the style is icononly or navigational...
85
+ // - an icon must be provided
86
+ if (!this.icon) {
87
+ console.error("wm-button should have a valid 'icon' property when button-type is set to 'icononly' or 'navigational'.");
88
+ }
89
+ // - if no tooltip text was passed and we couldn't generate one, throw an error
90
+ if (!this.tooltip) {
91
+ console.error("wm-button should have a valid 'tooltip' property when button-type is set to 'icononly' or 'navigational'.");
92
+ }
93
+ break;
94
+ case "pairpositive":
95
+ this.icon = "f12c";
96
+ break;
97
+ case "pairnegative":
98
+ this.icon = "f739";
99
+ break;
82
100
  }
83
101
  }
84
102
  handleKeydown(ev) {
@@ -222,8 +222,14 @@ export class DatePicker {
222
222
  }
223
223
  }
224
224
  componentWillLoad() {
225
+ // @ts-ignore
226
+ this.el.focus = function () {
227
+ if (!this.disabled) {
228
+ this.shadowRoot.querySelector("input").focus();
229
+ }
230
+ };
225
231
  if (this.label === "") {
226
- throw new Error("You must include a label prop for the datepicker input (for accessibility reasons), even if the label position is none.");
232
+ console.error("You must include a label prop for the datepicker input (for accessibility reasons), even if the label position is none.");
227
233
  }
228
234
  if (this.errorMessage) {
229
235
  this.generateError();
@@ -10,9 +10,9 @@ export class Input {
10
10
  this.type = "text";
11
11
  this.step = 1;
12
12
  this.announcement = "";
13
- this.previousBlurredValue = "";
14
13
  this.displayedErrorMessage = "";
15
14
  this.uid = "";
15
+ this.previousBlurredValue = "";
16
16
  this.requiredErrorMessage = intl.formatMessage({
17
17
  id: "global.requiredError",
18
18
  defaultMessage: "This field is required.",
@@ -397,7 +397,6 @@ export class Input {
397
397
  }; }
398
398
  static get states() { return {
399
399
  "announcement": {},
400
- "previousBlurredValue": {},
401
400
  "displayedErrorMessage": {}
402
401
  }; }
403
402
  static get events() { return [{
@@ -22,10 +22,7 @@ export class TabItem {
22
22
  this.wmTabSelected.emit({ tabId: this.tabId });
23
23
  this.tabSelected.emit({ tabId: this.tabId }); // deprecated
24
24
  }
25
- else if (key === "Tab") {
26
- this.keydownOnTabItem.emit({ tabItem: this.el, key: ev.key });
27
- }
28
- else {
25
+ else if (key.includes("Arrow")) {
29
26
  ev.preventDefault();
30
27
  this.keydownOnTabItem.emit({ tabItem: this.el, key: ev.key });
31
28
  }
@@ -121,9 +121,8 @@ export class TabList {
121
121
  }
122
122
  }
123
123
  handleKeydown(ev) {
124
- const tabItem = ev.detail.tabItem;
125
124
  const key = ev.detail.key;
126
- const index = this.tabItems.indexOf(tabItem);
125
+ const index = this.tabItems.indexOf(ev.detail.tabItem);
127
126
  if (key === "ArrowLeft" || key === "ArrowRight") {
128
127
  this.handleLeftRightArrow(index, key);
129
128
  }
@@ -87,7 +87,7 @@ export class Timepicker {
87
87
  }
88
88
  componentWillLoad() {
89
89
  if (this.label === "") {
90
- throw new Error("You must include a label prop for the datepicker input (for accessibility requirements), even if the label position is none.");
90
+ console.error("You must include a label prop for the timepicker (for accessibility reasons), even if the label position is none.");
91
91
  }
92
92
  this.el.focus = function () {
93
93
  if (!this.disabled) {
@@ -101,8 +101,10 @@ wm-network-uploader .wm-button::-moz-focus-inner {
101
101
  border: 0;
102
102
  outline: none;
103
103
  }
104
- :host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled):not(.-primary):not(.-secondary):not(.-secondary):not(.-selectoronly) .button-text,
105
- wm-network-uploader .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled):not(.-primary):not(.-secondary):not(.-secondary):not(.-selectoronly) .button-text {
104
+ :host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) :host .wm-button.-textonly .button-text,
105
+ wm-network-uploader .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) :host .wm-button.-textonly .button-text,
106
+ :host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) wm-network-uploader .wm-button.-textonly .button-text,
107
+ wm-network-uploader .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) wm-network-uploader .wm-button.-textonly .button-text {
106
108
  background: linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;
107
109
  background-size: 6px 3px;
108
110
  background-position: 0 1em;
@@ -354,6 +356,33 @@ wm-network-uploader .wm-button.-permanentlydelete:not(.-textonly) {
354
356
  border-color: #c0392b;
355
357
  color: #fff;
356
358
  }
359
+ :host .wm-button.-permanentlydelete:not(.-textonly):hover,
360
+ wm-network-uploader .wm-button.-permanentlydelete:not(.-textonly):hover {
361
+ background: #9a2e22;
362
+ border-color: #9a2e22;
363
+ }
364
+ :host .wm-button.-pairnegative,
365
+ wm-network-uploader .wm-button.-pairnegative {
366
+ background: #cc4c3e;
367
+ border-color: #cc4c3e;
368
+ color: #fff;
369
+ }
370
+ :host .wm-button.-pairnegative:hover,
371
+ wm-network-uploader .wm-button.-pairnegative:hover {
372
+ background: #a33d32;
373
+ border-color: #a33d32;
374
+ }
375
+ :host .wm-button.-pairpositive,
376
+ wm-network-uploader .wm-button.-pairpositive {
377
+ background: #15868d;
378
+ border-color: #15868d;
379
+ color: #fff;
380
+ }
381
+ :host .wm-button.-pairpositive:hover,
382
+ wm-network-uploader .wm-button.-pairpositive:hover {
383
+ background: #116b71;
384
+ border-color: #116b71;
385
+ }
357
386
  :host .wm-button.-selectoronly,
358
387
  wm-network-uploader .wm-button.-selectoronly {
359
388
  -webkit-border-radius: 3px;
@@ -436,9 +465,13 @@ wm-network-uploader .wm-button.disabled.dark {
436
465
  }
437
466
  :host .wm-button:disabled.-primary,
438
467
  wm-network-uploader .wm-button:disabled.-primary, :host .wm-button:disabled.-permanentlydelete,
439
- wm-network-uploader .wm-button:disabled.-permanentlydelete, :host .wm-button.disabled.-primary,
468
+ wm-network-uploader .wm-button:disabled.-permanentlydelete, :host .wm-button:disabled.-pairnegative,
469
+ wm-network-uploader .wm-button:disabled.-pairnegative, :host .wm-button:disabled.-pairpositive,
470
+ wm-network-uploader .wm-button:disabled.-pairpositive, :host .wm-button.disabled.-primary,
440
471
  wm-network-uploader .wm-button.disabled.-primary, :host .wm-button.disabled.-permanentlydelete,
441
- wm-network-uploader .wm-button.disabled.-permanentlydelete {
472
+ wm-network-uploader .wm-button.disabled.-permanentlydelete, :host .wm-button.disabled.-pairnegative,
473
+ wm-network-uploader .wm-button.disabled.-pairnegative, :host .wm-button.disabled.-pairpositive,
474
+ wm-network-uploader .wm-button.disabled.-pairpositive {
442
475
  background: #737373;
443
476
  color: #fff;
444
477
  border-color: #737373;
@@ -9,7 +9,6 @@ export class NetworkUploader {
9
9
  this.inProgressList = [];
10
10
  this.errorList = []; // for errors on a particular file
11
11
  this.snackbar = [];
12
- this.buttonType = "secondary";
13
12
  this.fileTypes = "pdf txt log xml doc docx xls xlsx ppt pptx gif jpg jpeg png csv";
14
13
  this.maxSize = 100; // in Mb
15
14
  this.sortBy = "date"; // name is descending (a -> z), date is ascending (earlier -> later)
@@ -388,7 +387,7 @@ export class NetworkUploader {
388
387
  h("div", { class: "header" },
389
388
  h("div", { class: "descr" },
390
389
  h("slot", null)),
391
- this.renderUploadButton(`${this.buttonType} ${this.isDisabled() ? "disabled" : ""}`)),
390
+ this.renderUploadButton(this.isDisabled() ? "disabled" : "")),
392
391
  this.renderErrorList(),
393
392
  this.renderInProgressList(),
394
393
  this.renderFileList()));
@@ -580,24 +579,6 @@ export class NetworkUploader {
580
579
  "attribute": "button-text",
581
580
  "reflect": false
582
581
  },
583
- "buttonType": {
584
- "type": "string",
585
- "mutable": false,
586
- "complexType": {
587
- "original": "\"primary\" | \"secondary\"",
588
- "resolved": "\"primary\" | \"secondary\"",
589
- "references": {}
590
- },
591
- "required": false,
592
- "optional": false,
593
- "docs": {
594
- "tags": [],
595
- "text": ""
596
- },
597
- "attribute": "button-type",
598
- "reflect": false,
599
- "defaultValue": "\"secondary\""
600
- },
601
582
  "emptyStateText": {
602
583
  "type": "string",
603
584
  "mutable": false,
@@ -101,8 +101,10 @@ wm-uploader .wm-button::-moz-focus-inner {
101
101
  border: 0;
102
102
  outline: none;
103
103
  }
104
- :host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled):not(.-primary):not(.-secondary):not(.-secondary):not(.-selectoronly) .button-text,
105
- wm-uploader .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled):not(.-primary):not(.-secondary):not(.-secondary):not(.-selectoronly) .button-text {
104
+ :host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) :host .wm-button.-textonly .button-text,
105
+ wm-uploader .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) :host .wm-button.-textonly .button-text,
106
+ :host .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) wm-uploader .wm-button.-textonly .button-text,
107
+ wm-uploader .wm-button.user-is-tabbing:focus:not(:disabled):not(.disabled) wm-uploader .wm-button.-textonly .button-text {
106
108
  background: linear-gradient(90deg, #3862e9 66%, transparent 0) repeat-x;
107
109
  background-size: 6px 3px;
108
110
  background-position: 0 1em;
@@ -354,6 +356,33 @@ wm-uploader .wm-button.-permanentlydelete:not(.-textonly) {
354
356
  border-color: #c0392b;
355
357
  color: #fff;
356
358
  }
359
+ :host .wm-button.-permanentlydelete:not(.-textonly):hover,
360
+ wm-uploader .wm-button.-permanentlydelete:not(.-textonly):hover {
361
+ background: #9a2e22;
362
+ border-color: #9a2e22;
363
+ }
364
+ :host .wm-button.-pairnegative,
365
+ wm-uploader .wm-button.-pairnegative {
366
+ background: #cc4c3e;
367
+ border-color: #cc4c3e;
368
+ color: #fff;
369
+ }
370
+ :host .wm-button.-pairnegative:hover,
371
+ wm-uploader .wm-button.-pairnegative:hover {
372
+ background: #a33d32;
373
+ border-color: #a33d32;
374
+ }
375
+ :host .wm-button.-pairpositive,
376
+ wm-uploader .wm-button.-pairpositive {
377
+ background: #15868d;
378
+ border-color: #15868d;
379
+ color: #fff;
380
+ }
381
+ :host .wm-button.-pairpositive:hover,
382
+ wm-uploader .wm-button.-pairpositive:hover {
383
+ background: #116b71;
384
+ border-color: #116b71;
385
+ }
357
386
  :host .wm-button.-selectoronly,
358
387
  wm-uploader .wm-button.-selectoronly {
359
388
  -webkit-border-radius: 3px;
@@ -436,9 +465,13 @@ wm-uploader .wm-button.disabled.dark {
436
465
  }
437
466
  :host .wm-button:disabled.-primary,
438
467
  wm-uploader .wm-button:disabled.-primary, :host .wm-button:disabled.-permanentlydelete,
439
- wm-uploader .wm-button:disabled.-permanentlydelete, :host .wm-button.disabled.-primary,
468
+ wm-uploader .wm-button:disabled.-permanentlydelete, :host .wm-button:disabled.-pairnegative,
469
+ wm-uploader .wm-button:disabled.-pairnegative, :host .wm-button:disabled.-pairpositive,
470
+ wm-uploader .wm-button:disabled.-pairpositive, :host .wm-button.disabled.-primary,
440
471
  wm-uploader .wm-button.disabled.-primary, :host .wm-button.disabled.-permanentlydelete,
441
- wm-uploader .wm-button.disabled.-permanentlydelete {
472
+ wm-uploader .wm-button.disabled.-permanentlydelete, :host .wm-button.disabled.-pairnegative,
473
+ wm-uploader .wm-button.disabled.-pairnegative, :host .wm-button.disabled.-pairpositive,
474
+ wm-uploader .wm-button.disabled.-pairpositive {
442
475
  background: #737373;
443
476
  color: #fff;
444
477
  border-color: #737373;
@@ -489,8 +522,8 @@ wm-uploader[dir=RTL] .mdi {
489
522
  margin-left: 0.3125rem;
490
523
  margin-right: 0;
491
524
  }
492
- :host input:focus ~ .wm-button.user-is-tabbing,
493
- wm-uploader input:focus ~ .wm-button.user-is-tabbing {
525
+ :host input:focus + .wm-button.user-is-tabbing,
526
+ wm-uploader input:focus + .wm-button.user-is-tabbing {
494
527
  -webkit-box-shadow: 0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;
495
528
  -moz-box-shadow: 0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;
496
529
  box-shadow: 0 2px 2px 0 rgba(244, 243, 246, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 0 4px 3px #61279e !important;
@@ -522,8 +555,12 @@ wm-uploader * {
522
555
  justify-content: flex-start;
523
556
  align-items: flex-start;
524
557
  }
525
- .header .slot-wrapper.right {
526
- justify-content: flex-end;
558
+ .header .info-wrapper {
559
+ align-items: center;
560
+ }
561
+ .header .info-wrapper .info {
562
+ font-size: 0.875rem;
563
+ margin-left: 1rem;
527
564
  }
528
565
 
529
566
  .footer {
@@ -532,8 +569,8 @@ wm-uploader * {
532
569
  align-items: flex-end;
533
570
  padding: 0.9375rem 1.875rem;
534
571
  }
535
- .footer.left {
536
- align-items: flex-start;
572
+ .footer .notif-wrapper {
573
+ align-items: flex-end;
537
574
  }
538
575
  .footer .filecount-wrapper {
539
576
  display: flex;
@@ -541,7 +578,7 @@ wm-uploader * {
541
578
  }
542
579
  .footer .filecount-wrapper .filecount {
543
580
  font-size: 0.875rem;
544
- margin: 0 1rem;
581
+ margin-right: 1rem;
545
582
  }
546
583
 
547
584
  .notif-wrapper {
@@ -550,12 +587,6 @@ wm-uploader * {
550
587
  flex-direction: column;
551
588
  margin-bottom: 1rem;
552
589
  }
553
- .notif-wrapper.left {
554
- align-items: flex-start;
555
- }
556
- .notif-wrapper.right {
557
- align-items: flex-end;
558
- }
559
590
 
560
591
  .notif {
561
592
  padding-top: 0.25rem;
@@ -569,11 +600,6 @@ wm-uploader * {
569
600
  .info-wrapper {
570
601
  position: relative;
571
602
  display: flex;
572
- align-items: center;
573
- }
574
- .info-wrapper .info {
575
- font-size: 0.875rem;
576
- margin: 0 1rem;
577
603
  }
578
604
 
579
605
  .file-info {