@refinitiv-ui/elements 7.15.5 → 7.15.6

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 (121) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/lib/autosuggest/themes/halo/dark/index.js +1 -1
  3. package/lib/autosuggest/themes/halo/light/index.js +1 -1
  4. package/lib/autosuggest/themes/solar/charcoal/index.js +1 -1
  5. package/lib/autosuggest/themes/solar/pearl/index.js +1 -1
  6. package/lib/button/themes/halo/dark/index.js +1 -1
  7. package/lib/button/themes/halo/light/index.js +1 -1
  8. package/lib/button/themes/solar/charcoal/index.js +1 -1
  9. package/lib/button/themes/solar/pearl/index.js +1 -1
  10. package/lib/calendar/themes/halo/dark/index.js +1 -1
  11. package/lib/calendar/themes/halo/light/index.js +1 -1
  12. package/lib/calendar/themes/solar/charcoal/index.js +1 -1
  13. package/lib/calendar/themes/solar/pearl/index.js +1 -1
  14. package/lib/card/themes/halo/dark/index.js +1 -1
  15. package/lib/card/themes/halo/light/index.js +1 -1
  16. package/lib/card/themes/solar/charcoal/index.js +1 -1
  17. package/lib/card/themes/solar/pearl/index.js +1 -1
  18. package/lib/checkbox/themes/halo/dark/index.js +1 -1
  19. package/lib/checkbox/themes/halo/light/index.js +1 -1
  20. package/lib/checkbox/themes/solar/charcoal/index.js +1 -1
  21. package/lib/checkbox/themes/solar/pearl/index.js +1 -1
  22. package/lib/clock/themes/ds/dark/index.js +1 -1
  23. package/lib/clock/themes/ds/light/index.js +1 -1
  24. package/lib/clock/themes/halo/dark/index.js +1 -1
  25. package/lib/clock/themes/halo/light/index.js +1 -1
  26. package/lib/clock/themes/solar/charcoal/index.js +1 -1
  27. package/lib/clock/themes/solar/pearl/index.js +1 -1
  28. package/lib/collapse/themes/halo/dark/index.js +1 -1
  29. package/lib/collapse/themes/halo/light/index.js +1 -1
  30. package/lib/collapse/themes/solar/charcoal/index.js +1 -1
  31. package/lib/collapse/themes/solar/pearl/index.js +1 -1
  32. package/lib/combo-box/themes/halo/dark/index.js +1 -1
  33. package/lib/combo-box/themes/halo/light/index.js +1 -1
  34. package/lib/combo-box/themes/solar/charcoal/index.js +1 -1
  35. package/lib/combo-box/themes/solar/pearl/index.js +1 -1
  36. package/lib/counter/themes/ds/dark/index.js +1 -1
  37. package/lib/counter/themes/ds/light/index.js +1 -1
  38. package/lib/counter/themes/halo/dark/index.js +1 -1
  39. package/lib/counter/themes/halo/light/index.js +1 -1
  40. package/lib/counter/themes/solar/charcoal/index.js +1 -1
  41. package/lib/counter/themes/solar/pearl/index.js +1 -1
  42. package/lib/dialog/themes/ds/dark/index.js +1 -1
  43. package/lib/dialog/themes/ds/light/index.js +1 -1
  44. package/lib/dialog/themes/halo/dark/index.js +1 -1
  45. package/lib/dialog/themes/halo/light/index.js +1 -1
  46. package/lib/dialog/themes/solar/charcoal/index.js +1 -1
  47. package/lib/dialog/themes/solar/pearl/index.js +1 -1
  48. package/lib/icon/themes/halo/dark/index.js +1 -1
  49. package/lib/icon/themes/halo/light/index.js +1 -1
  50. package/lib/icon/themes/solar/charcoal/index.js +1 -1
  51. package/lib/icon/themes/solar/pearl/index.js +1 -1
  52. package/lib/interactive-chart/themes/ds/dark/index.js +1 -1
  53. package/lib/interactive-chart/themes/ds/light/index.js +1 -1
  54. package/lib/interactive-chart/themes/halo/dark/index.js +1 -1
  55. package/lib/interactive-chart/themes/halo/light/index.js +1 -1
  56. package/lib/interactive-chart/themes/solar/charcoal/index.js +1 -1
  57. package/lib/interactive-chart/themes/solar/pearl/index.js +1 -1
  58. package/lib/list/themes/halo/dark/index.js +1 -1
  59. package/lib/list/themes/halo/light/index.js +1 -1
  60. package/lib/list/themes/solar/charcoal/index.js +1 -1
  61. package/lib/list/themes/solar/pearl/index.js +1 -1
  62. package/lib/loader/themes/solar/charcoal/index.js +1 -1
  63. package/lib/loader/themes/solar/pearl/index.js +1 -1
  64. package/lib/multi-input/themes/halo/dark/index.js +1 -1
  65. package/lib/multi-input/themes/halo/light/index.js +1 -1
  66. package/lib/multi-input/themes/solar/charcoal/index.js +1 -1
  67. package/lib/multi-input/themes/solar/pearl/index.js +1 -1
  68. package/lib/number-field/themes/solar/charcoal/index.js +1 -1
  69. package/lib/number-field/themes/solar/pearl/index.js +1 -1
  70. package/lib/overlay/managers/close-manager.js +1 -0
  71. package/lib/overlay/themes/halo/dark/index.js +1 -1
  72. package/lib/overlay/themes/halo/light/index.js +1 -1
  73. package/lib/overlay/themes/solar/charcoal/index.js +1 -1
  74. package/lib/overlay/themes/solar/pearl/index.js +1 -1
  75. package/lib/overlay-menu/themes/halo/dark/index.js +1 -1
  76. package/lib/overlay-menu/themes/halo/light/index.js +1 -1
  77. package/lib/overlay-menu/themes/solar/charcoal/index.js +1 -1
  78. package/lib/overlay-menu/themes/solar/pearl/index.js +1 -1
  79. package/lib/radio-button/themes/ds/dark/index.js +1 -1
  80. package/lib/radio-button/themes/ds/light/index.js +1 -1
  81. package/lib/radio-button/themes/halo/dark/index.js +1 -1
  82. package/lib/radio-button/themes/halo/light/index.js +1 -1
  83. package/lib/radio-button/themes/solar/charcoal/index.js +1 -1
  84. package/lib/radio-button/themes/solar/pearl/index.js +1 -1
  85. package/lib/rating/themes/ds/dark/index.js +1 -1
  86. package/lib/rating/themes/ds/light/index.js +1 -1
  87. package/lib/rating/themes/halo/dark/index.js +1 -1
  88. package/lib/rating/themes/halo/light/index.js +1 -1
  89. package/lib/rating/themes/solar/charcoal/index.js +1 -1
  90. package/lib/rating/themes/solar/pearl/index.js +1 -1
  91. package/lib/select/themes/halo/dark/index.js +1 -1
  92. package/lib/select/themes/halo/light/index.js +1 -1
  93. package/lib/select/themes/solar/charcoal/index.js +1 -1
  94. package/lib/select/themes/solar/pearl/index.js +1 -1
  95. package/lib/sidebar-layout/themes/halo/dark/index.js +1 -1
  96. package/lib/sidebar-layout/themes/halo/light/index.js +1 -1
  97. package/lib/sidebar-layout/themes/solar/charcoal/index.js +1 -1
  98. package/lib/sidebar-layout/themes/solar/pearl/index.js +1 -1
  99. package/lib/slider/themes/halo/dark/index.js +1 -1
  100. package/lib/slider/themes/halo/light/index.js +1 -1
  101. package/lib/slider/themes/solar/charcoal/index.js +1 -1
  102. package/lib/slider/themes/solar/pearl/index.js +1 -1
  103. package/lib/tab-bar/index.js +4 -1
  104. package/lib/toggle/themes/ds/dark/index.js +1 -1
  105. package/lib/toggle/themes/ds/light/index.js +1 -1
  106. package/lib/toggle/themes/halo/dark/index.js +1 -1
  107. package/lib/toggle/themes/halo/light/index.js +1 -1
  108. package/lib/toggle/themes/solar/charcoal/index.js +1 -1
  109. package/lib/toggle/themes/solar/pearl/index.js +1 -1
  110. package/lib/tree/themes/ds/dark/index.js +1 -1
  111. package/lib/tree/themes/ds/light/index.js +1 -1
  112. package/lib/tree/themes/halo/dark/index.js +2 -2
  113. package/lib/tree/themes/halo/light/index.js +2 -2
  114. package/lib/tree/themes/solar/charcoal/index.js +2 -2
  115. package/lib/tree/themes/solar/pearl/index.js +2 -2
  116. package/lib/tree-select/themes/halo/dark/index.js +1 -1
  117. package/lib/tree-select/themes/halo/light/index.js +1 -1
  118. package/lib/tree-select/themes/solar/charcoal/index.js +1 -1
  119. package/lib/tree-select/themes/solar/pearl/index.js +1 -1
  120. package/lib/version.js +1 -1
  121. package/package.json +6 -6
package/lib/rating/themes/halo/light/index.js CHANGED
@@ -1 +1 @@
1
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-rating', styles: ':host{font-size:16px}:host [part=container]{touch-action:manipulation;display:flex;flex-direction:row-reverse;flex-wrap:nowrap}:host [part^=icon]{margin:0 1px;background:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiM1OTU5NTkiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnpNNTEyIDc1NCAyODggODcybDQzLTI0OS0xODEtMTc2IDI1MC0zNiAxMTItMjI2IDExMiAyMjYgMjUwIDM2LTE4MSAxNzYgNDMgMjQ5eiIvPjwvc3ZnPg==) 0 0/100% no-repeat;width:1em;height:1em}:host [part^=icon]:first-child,:host [part^=icon]:last-child{margin:0}:host(:not([interactive])) [part~=icon-full],:host([interactive]) [part=container]:not(:hover) [part~=icon-full]{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiMzMzRCRkYiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=)}:host(:not([interactive])) [part~=icon-half],:host([interactive]) [part=container]:not(:hover) [part~=icon-half]{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiM1OTU5NTkiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTExIDI1djgwOGwzMTcgMTY2LTYwLTM1MnpNNTExIDc1NFYxODRsMTEzIDIyNiAyNTAgMzYtMTgxIDE3NiA0MyAyNDl6Ii8+PHBhdGggZmlsbD0iIzMzNEJGRiIgZD0iTTUxMiAyNSAzNTQgMzQ2IDAgMzk3bDI1NiAyNTAtNjAgMzUyIDMxNi0xNjZ6Ii8+PC9zdmc+)}:host([interactive]) [part^=icon]{cursor:pointer}:host([interactive]) [part^=icon]:hover,:host([interactive]) [part^=icon]:hover~[part^=icon]{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiMzMzRCRkYiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=)}:host([focused=visible]){outline:#334bff solid 1px;outline-offset:2px}' }}));
1
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-rating', styles: ':host{font-size:16px}:host [part=container]{touch-action:manipulation;display:flex;flex-direction:row-reverse;flex-wrap:nowrap}:host [part^=icon]{margin:0 1px;background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiM1OTU5NTkiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnpNNTEyIDc1NCAyODggODcybDQzLTI0OS0xODEtMTc2IDI1MC0zNiAxMTItMjI2IDExMiAyMjYgMjUwIDM2LTE4MSAxNzYgNDMgMjQ5eiIvPjwvc3ZnPg==") 0 0/100% no-repeat;width:1em;height:1em}:host [part^=icon]:first-child,:host [part^=icon]:last-child{margin:0}:host(:not([interactive])) [part~=icon-full],:host([interactive]) [part=container]:not(:hover) [part~=icon-full]{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiMzMzRCRkYiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=")}:host(:not([interactive])) [part~=icon-half],:host([interactive]) [part=container]:not(:hover) [part~=icon-half]{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiM1OTU5NTkiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTExIDI1djgwOGwzMTcgMTY2LTYwLTM1MnpNNTExIDc1NFYxODRsMTEzIDIyNiAyNTAgMzYtMTgxIDE3NiA0MyAyNDl6Ii8+PHBhdGggZmlsbD0iIzMzNEJGRiIgZD0iTTUxMiAyNSAzNTQgMzQ2IDAgMzk3bDI1NiAyNTAtNjAgMzUyIDMxNi0xNjZ6Ii8+PC9zdmc+")}:host([interactive]) [part^=icon]{cursor:pointer}:host([interactive]) [part^=icon]:hover,:host([interactive]) [part^=icon]:hover~[part^=icon]{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiMzMzRCRkYiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=")}:host([focused=visible]){outline:#334BFF solid 1px;outline-offset:2px}' }}));
package/lib/rating/themes/solar/charcoal/index.js CHANGED
@@ -1 +1 @@
1
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-rating', styles: ':host [part=container]{touch-action:manipulation;display:flex;flex-direction:row-reverse;flex-wrap:nowrap}:host [part^=icon]{margin:0 1px;background:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiM2NjY1NzAiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=) 0 0/100% no-repeat;width:1em;height:1em}:host [part^=icon]:first-child,:host [part^=icon]:last-child{margin:0}:host([interactive]) [part^=icon]{cursor:pointer}:host([focused=visible]){outline:#f93 solid 1px;outline-offset:2px}:host{font-size:10px}:host([size=large]){font-size:15px}:host(:not([interactive])) [part~=icon-full],:host([interactive]) [part=container]:not(:hover) [part~=icon-full]{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNGOTMiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=)}:host(:not([interactive])) [part~=icon-half],:host([interactive]) [part=container]:not(:hover) [part~=icon-half]{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNGOTMiIGQ9Ik01MTIgMjUgMzU0IDM0NiAwIDM5N2wyNTYgMjUwLTYwIDM1MiAzMTYtMTY2eiIvPjxwYXRoIGZpbGw9IiM2NjY1NzAiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTExIDI1djgwOGwzMTcgMTY2LTYwLTM1MnoiLz48L3N2Zz4=)}:host([interactive]) [part^=icon]:hover,:host([interactive]) [part^=icon]:hover~[part^=icon]{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNGOTMiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=)}' }}));
1
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-rating', styles: ':host [part=container]{touch-action:manipulation;display:flex;flex-direction:row-reverse;flex-wrap:nowrap}:host [part^=icon]{margin:0 1px;background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiM2NjY1NzAiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=") 0 0/100% no-repeat;width:1em;height:1em}:host [part^=icon]:first-child,:host [part^=icon]:last-child{margin:0}:host([interactive]) [part^=icon]{cursor:pointer}:host([focused=visible]){outline:#FF9933 solid 1px;outline-offset:2px}:host{font-size:10px}:host([size=large]){font-size:15px}:host(:not([interactive])) [part~=icon-full],:host([interactive]) [part=container]:not(:hover) [part~=icon-full]{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNGOTMiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=")}:host(:not([interactive])) [part~=icon-half],:host([interactive]) [part=container]:not(:hover) [part~=icon-half]{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNGOTMiIGQ9Ik01MTIgMjUgMzU0IDM0NiAwIDM5N2wyNTYgMjUwLTYwIDM1MiAzMTYtMTY2eiIvPjxwYXRoIGZpbGw9IiM2NjY1NzAiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTExIDI1djgwOGwzMTcgMTY2LTYwLTM1MnoiLz48L3N2Zz4=")}:host([interactive]) [part^=icon]:hover,:host([interactive]) [part^=icon]:hover~[part^=icon]{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNGOTMiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=")}' }}));
package/lib/rating/themes/solar/pearl/index.js CHANGED
@@ -1 +1 @@
1
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-rating', styles: ':host [part=container]{touch-action:manipulation;display:flex;flex-direction:row-reverse;flex-wrap:nowrap}:host [part^=icon]{margin:0 1px;background:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNBQ0FGQjUiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=) 0 0/100% no-repeat;width:1em;height:1em}:host [part^=icon]:first-child,:host [part^=icon]:last-child{margin:0}:host([interactive]) [part^=icon]{cursor:pointer}:host([focused=visible]){outline:#ffb266 solid 1px;outline-offset:2px}:host{font-size:10px}:host([size=large]){font-size:15px}:host(:not([interactive])) [part~=icon-full],:host([interactive]) [part=container]:not(:hover) [part~=icon-full]{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNFRTc2MDAiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=)}:host(:not([interactive])) [part~=icon-half],:host([interactive]) [part=container]:not(:hover) [part~=icon-half]{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNFRTc2MDAiIGQ9Ik01MTIgMjUgMzU0IDM0NiAwIDM5N2wyNTYgMjUwLTYwIDM1MiAzMTYtMTY2eiIvPjxwYXRoIGZpbGw9IiNBQ0FGQjUiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTExIDI1djgwOGwzMTcgMTY2LTYwLTM1MnoiLz48L3N2Zz4=)}:host([interactive]) [part^=icon]:hover,:host([interactive]) [part^=icon]:hover~[part^=icon]{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNFRTc2MDAiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=)}' }}));
1
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-rating', styles: ':host [part=container]{touch-action:manipulation;display:flex;flex-direction:row-reverse;flex-wrap:nowrap}:host [part^=icon]{margin:0 1px;background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNBQ0FGQjUiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=") 0 0/100% no-repeat;width:1em;height:1em}:host [part^=icon]:first-child,:host [part^=icon]:last-child{margin:0}:host([interactive]) [part^=icon]{cursor:pointer}:host([focused=visible]){outline:#FFB266 solid 1px;outline-offset:2px}:host{font-size:10px}:host([size=large]){font-size:15px}:host(:not([interactive])) [part~=icon-full],:host([interactive]) [part=container]:not(:hover) [part~=icon-full]{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNFRTc2MDAiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=")}:host(:not([interactive])) [part~=icon-half],:host([interactive]) [part=container]:not(:hover) [part~=icon-half]{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNFRTc2MDAiIGQ9Ik01MTIgMjUgMzU0IDM0NiAwIDM5N2wyNTYgMjUwLTYwIDM1MiAzMTYtMTY2eiIvPjxwYXRoIGZpbGw9IiNBQ0FGQjUiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTExIDI1djgwOGwzMTcgMTY2LTYwLTM1MnoiLz48L3N2Zz4=")}:host([interactive]) [part^=icon]:hover,:host([interactive]) [part^=icon]:hover~[part^=icon]{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxwYXRoIGZpbGw9IiNFRTc2MDAiIGQ9Im0xMDI0IDM5Ny0zNTQtNTFMNTEyIDI1IDM1NCAzNDYgMCAzOTdsMjU2IDI1MC02MCAzNTIgMzE2LTE2NiAzMTYgMTY2LTYwLTM1MnoiLz48L3N2Zz4=")}' }}));
package/lib/select/themes/halo/dark/index.js CHANGED
@@ -2,4 +2,4 @@ import '@refinitiv-ui/elements/overlay/themes/halo/dark';
2
2
  import '@refinitiv-ui/elements/item/themes/halo/dark';
3
3
  import '@refinitiv-ui/elements/icon/themes/halo/dark';
4
4
  import '@refinitiv-ui/elements/tooltip/themes/halo/dark';
5
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-select', styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;color:#ccc}:host([disabled]){border:1px solid rgba(64,64,64,.5);color:rgba(204,204,204,.5);background-color:rgba(13,13,13,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #ffc800}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #f5475b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#ccc;min-width:1em;margin-left:2px;color:inherit}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#6678ff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#fff;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#fff;border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(250,168,177,.5)}:host([readonly]:not([focused])){border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(204,204,204,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#fff}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}:host [part=placeholder]{opacity:.7}:host [part=list]{color:#ccc;max-width:var(--list-max-width,300px);max-height:var(--list-max-height);border:1px solid #334bff;margin:2px 0;background-color:#262626}:host [part=list] ::slotted(ef-item:not(:first-child):not([type=divider])),:host [part=list] ef-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #404040}:host [part=list] ::slotted(:not(ef-item)){display:none}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#595959 #1a1a1a;scrollbar-width:thin}}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#595959;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #0d0d0d;border-bottom:1px solid #0d0d0d}::-webkit-scrollbar-track:vertical{border-left:1px solid #0d0d0d;border-right:1px solid #0d0d0d}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #1a1a1a;height:16px;width:16px;display:none;border:1px solid #0d0d0d}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #0d0d0d}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#0d0d0d}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#0d0d0d}' }}));
5
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-select', styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#0d0d0d;text-overflow:ellipsis;border:1px solid #404040;color:#ccc}:host([disabled]){border:1px solid rgba(64,64,64,.5);color:rgba(204,204,204,.5);background-color:rgba(13,13,13,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #ffc800}:host([warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(127,100,0,.5)}:host([error]),:host([error][warning]){border:1px solid #f5475b}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(204,204,204,.5);border:1px solid rgba(160,28,43,.5)}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{color:#ccc;min-width:1em;margin-left:2px;color:inherit}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:grey;color:#fff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#6678ff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#fff;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#fff;border-color:#faa8b1}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(250,168,177,.5)}:host([readonly]:not([focused])){border-color:rgba(64,64,64,.5);background-color:rgba(13,13,13,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(204,204,204,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#fff}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#6678ff}:host [part=placeholder]{opacity:.7}:host [part=list]{color:#ccc;max-width:var(--list-max-width,300px);max-height:var(--list-max-height);border:1px solid #334bff;margin:2px 0;background-color:#262626}:host [part=list] ::slotted(ef-item:not(:first-child):not([type=divider])),:host [part=list] ef-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #404040}:host [part=list] ::slotted(:not(ef-item)){display:none}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#595959 #1A1A1A;scrollbar-width:thin}}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#595959;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #0d0d0d;border-bottom:1px solid #0d0d0d}::-webkit-scrollbar-track:vertical{border-left:1px solid #0d0d0d;border-right:1px solid #0d0d0d}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #1a1a1a;height:16px;width:16px;display:none;border:1px solid #0d0d0d}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #0d0d0d}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#0d0d0d}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#0d0d0d}' }}));
package/lib/select/themes/halo/light/index.js CHANGED
@@ -2,4 +2,4 @@ import '@refinitiv-ui/elements/overlay/themes/halo/light';
2
2
  import '@refinitiv-ui/elements/item/themes/halo/light';
3
3
  import '@refinitiv-ui/elements/icon/themes/halo/light';
4
4
  import '@refinitiv-ui/elements/tooltip/themes/halo/light';
5
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-select', styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;color:#404040}:host([disabled]){border:1px solid rgba(89,89,89,.5);color:rgba(64,64,64,.5);background-color:rgba(255,255,255,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #d94255}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{min-width:1em;margin-left:2px;color:#595959}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#334bff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(238,172,180,.5)}:host([readonly]:not([focused])){border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(64,64,64,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#0d0d0d}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}:host [part=placeholder]{opacity:.7}:host([disabled]) [part=icon]{color:rgba(89,89,89,.5)}:host [part=list]{color:#404040;max-width:var(--list-max-width,300px);max-height:var(--list-max-height);border:1px solid #334bff;margin:2px 0;background-color:#f2f2f2}:host [part=list] ::slotted(ef-item:not(:first-child):not([type=divider])),:host [part=list] ef-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #d9d9d9}:host [part=list] ::slotted(:not(ef-item)){display:none}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#999 #f2f2f2;scrollbar-width:thin}}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#999;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#f2f2f2}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #fff;border-bottom:1px solid #fff}::-webkit-scrollbar-track:vertical{border-left:1px solid #fff;border-right:1px solid #fff}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #f2f2f2;height:16px;width:16px;display:none;border:1px solid #fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #fff}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#fff}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#fff}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#fff}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#fff}' }}));
5
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-select', styles: ':host{display:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-align:left;font-family:inherit;font-size:12px;font-weight:400;height:24px;width:152px;max-width:100%;padding:0 8px;margin:1px 0;outline:0;box-sizing:border-box;display:inline-flex;align-items:center;position:relative;vertical-align:middle;border-radius:0;background-color:#fff;text-overflow:ellipsis;border:1px solid #595959;color:#404040}:host([disabled]){border:1px solid rgba(89,89,89,.5);color:rgba(64,64,64,.5);background-color:rgba(255,255,255,.5)}:host([type=number]){padding-right:0}:host([warning]){border:1px solid #cca000}:host([warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(204,160,0,.5)}:host([error]),:host([error][warning]){border:1px solid #d94255}:host([error][disabled]),:host([error][warning][disabled]){color:rgba(64,64,64,.5);border:1px solid rgba(182,50,67,.5)}:host([focused]){background-size:100% 2px,100% 1px!important;background-position:center bottom!important;border-color:#334bff}:host [part=input]{color:inherit;padding:0;margin:0;flex:1 1 auto;min-width:0;width:100%;height:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;text-overflow:ellipsis;touch-action:manipulation}:host [part=input]::-webkit-clear-button,:host [part=input]::-webkit-inner-spin-button,:host [part=input]::-webkit-search-cancel-button,:host [part=input]::-webkit-search-decoration{-webkit-appearance:none}:host [part=input]:invalid{box-shadow:none}:host [part=icon]{min-width:1em;margin-left:2px;color:#595959}:host([disabled]) [part=input]{-webkit-user-select:none;-moz-user-select:none;user-select:none}:host [part~=button]{display:flex;justify-content:center;align-items:center;cursor:pointer;flex:none}:host ::-moz-selection{color:#fff;background-color:#334bff}:host ::selection{color:#fff;background-color:#334bff}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover){border-color:#0d0d0d;color:#0d0d0d}:host(:not([readonly]):not([error]):not([warning]):not([focused]):hover) [part=icon]{color:#334bff}:host [part~=button-clear]:active,:host [part~=button-clear]:hover{color:#334bff}:host([warning]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#ffe999}:host([warning][disabled]),:host([warning][readonly]:not([focused])){border-color:rgba(255,233,153,.5)}:host([error]:hover:not([readonly]):not([focused])){color:#0d0d0d;border-color:#eeacb4}:host([error][disabled]),:host([error][readonly]:not([focused])),:host([error][warning][disabled]){border-color:rgba(238,172,180,.5)}:host([readonly]:not([focused])){border-color:rgba(89,89,89,.5);background-color:rgba(255,255,255,.5)}:host([readonly]:not([focused])) [part=icon]{color:rgba(64,64,64,.5)}:host([focused]),:host([focused][error][warning]){border-color:#334bff;color:#0d0d0d}:host([focused]) [part=icon],:host([focused][error][warning]) [part=icon]{color:#334bff}:host [part=placeholder]{opacity:.7}:host([disabled]) [part=icon]{color:rgba(89,89,89,.5)}:host [part=list]{color:#404040;max-width:var(--list-max-width,300px);max-height:var(--list-max-height);border:1px solid #334bff;margin:2px 0;background-color:#f2f2f2}:host [part=list] ::slotted(ef-item:not(:first-child):not([type=divider])),:host [part=list] ef-item:not(:first-child):not([type=divider]){box-shadow:0 -1px 0 #d9d9d9}:host [part=list] ::slotted(:not(ef-item)){display:none}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#999999 #F2F2F2;scrollbar-width:thin}}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#999;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#f2f2f2}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #fff;border-bottom:1px solid #fff}::-webkit-scrollbar-track:vertical{border-left:1px solid #fff;border-right:1px solid #fff}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #f2f2f2;height:16px;width:16px;display:none;border:1px solid #fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #fff}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#fff}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#fff}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#fff}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#fff}' }}));
package/lib/select/themes/solar/charcoal/index.js CHANGED
@@ -2,4 +2,4 @@ import '@refinitiv-ui/elements/overlay/themes/solar/charcoal';
2
2
  import '@refinitiv-ui/elements/item/themes/solar/charcoal';
3
3
  import '@refinitiv-ui/elements/icon/themes/solar/charcoal';
4
4
  import '@refinitiv-ui/elements/tooltip/themes/solar/charcoal';
5
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-select', styles: ':host{-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:0 0 0 0 rgba(0,0,0,.6);font-family:inherit;min-width:23px;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;touch-action:manipulation;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:0;background-color:#3c3c42;color:#c2c2c2;border:1px solid #000;height:23px;box-shadow:0 0 0 0 rgba(0,0,0,.6);padding:0 8px;outline:0;font-family:inherit;font-size:13px;font-weight:400;min-width:23px;margin:1px 0;transition:70ms;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;vertical-align:bottom;position:relative;overflow:hidden;background-image:linear-gradient(rgba(255,255,255,.1) 10%,rgba(255,255,255,0) 100%);cursor:unset;width:175px;text-align:left}@media (pointer:fine){:host(:not([readonly]):hover){background-color:#4d4d55;color:#e2e2e2;box-shadow:0 0 0 0 rgba(0,0,0,.9)}}@media all{:host(:not([readonly]):active),:host(:not([readonly])[focused]){background-color:#38383d;color:#c2c2c2;box-shadow:0 0 0 0 rgba(0,0,0,.6)}:host([disabled]){background-color:#3c3c42;color:#c2c2c2;border-color:#333;box-shadow:none;outline:0;pointer-events:none}}:host([disabled]){opacity:.4;border-color:#000}:host(:not([readonly]):active),:host(:not([readonly])[focused]){background-image:linear-gradient(rgba(255,255,255,.1) 10%,rgba(255,255,255,0) 100%)}:host(:not([disabled])[focused]){border:1px dotted #f93!important;box-shadow:inset 0 0 0 1px #000}:host(:not([disabled])[focused]:hover){box-shadow:inset 0 0 0 1px #000}:host([warning]){border-color:#f93!important}:host([error]){border-color:#f5475b!important}:host [part=list]{max-width:var(--list-max-width,300px);max-height:var(--list-max-height);margin:1px 0;border:1px solid #000;background-color:#3c3c42}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#666570 #2e2e33}}::-webkit-scrollbar{width:13px;height:13px}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #2e2e33;height:12px;width:12px;display:block}::-webkit-scrollbar-thumb{background:#666570;border-radius:7px;border:2px solid #2e2e33}::-webkit-scrollbar-thumb:hover{background:#e2e2e2}::-webkit-scrollbar-thumb:active{background:#f93}::-webkit-scrollbar-track{background:#2e2e33}::-webkit-scrollbar-corner{background:#2e2e33}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:end:increment{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:horizontal:start:decrement{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}' }}));
5
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-select', styles: ':host{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;touch-action:manipulation;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:0;background-color:#3c3c42;color:#c2c2c2;border:1px solid #000;height:23px;box-shadow:0 0 0 0 rgba(0,0,0,.6);padding:0 8px;outline:0;font-family:inherit;font-size:13px;font-weight:400;min-width:23px;margin:1px 0;transition:70ms;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;vertical-align:bottom;position:relative;overflow:hidden;background-image:linear-gradient(rgba(255,255,255,.1) 10%,rgba(255,255,255,0) 100%);cursor:unset;width:175px;text-align:left}@media (pointer:fine){:host(:not([readonly]):hover){background-color:#4d4d55;color:#e2e2e2;box-shadow:0 0 0 0 rgba(0,0,0,.9)}}@media all{:host(:not([readonly]):active),:host(:not([readonly])[focused]){background-color:#38383d;color:#c2c2c2;box-shadow:0 0 0 0 rgba(0,0,0,.6)}:host([disabled]){background-color:#3c3c42;color:#c2c2c2;border-color:#333;box-shadow:none;outline:0;pointer-events:none}}:host([disabled]){opacity:.4;border-color:#000}:host(:not([readonly]):active),:host(:not([readonly])[focused]){background-image:linear-gradient(rgba(255,255,255,.1) 10%,rgba(255,255,255,0) 100%)}:host(:not([disabled])[focused]){border:1px dotted #f93!important;box-shadow:inset 0 0 0 1px #000}:host(:not([disabled])[focused]:hover){box-shadow:inset 0 0 0 1px #000}:host([warning]){border-color:#f93!important}:host([error]){border-color:#f5475b!important}:host [part=list]{max-width:var(--list-max-width,300px);max-height:var(--list-max-height);margin:1px 0;border:1px solid #000;background-color:#3c3c42}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#666570 #2E2E33}}::-webkit-scrollbar{width:13px;height:13px}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #2e2e33;height:12px;width:12px;display:block}::-webkit-scrollbar-thumb{background:#666570;border-radius:7px;border:2px solid #2e2e33}::-webkit-scrollbar-thumb:hover{background:#e2e2e2}::-webkit-scrollbar-thumb:active{background:#f93}::-webkit-scrollbar-track{background:#2e2e33}::-webkit-scrollbar-corner{background:#2e2e33}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:end:increment{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:horizontal:start:decrement{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}' }}));
package/lib/select/themes/solar/pearl/index.js CHANGED
@@ -2,4 +2,4 @@ import '@refinitiv-ui/elements/overlay/themes/solar/pearl';
2
2
  import '@refinitiv-ui/elements/item/themes/solar/pearl';
3
3
  import '@refinitiv-ui/elements/icon/themes/solar/pearl';
4
4
  import '@refinitiv-ui/elements/tooltip/themes/solar/pearl';
5
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-select', styles: ':host{-webkit-appearance:none;-moz-appearance:none;appearance:none;box-shadow:0 0 0 0 rgba(0,0,0,.3);font-family:inherit;min-width:23px;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;touch-action:manipulation;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:0;background-color:#fafbfc;color:#505050;border:1px solid #a9afba;height:23px;box-shadow:0 0 0 0 rgba(0,0,0,.3);padding:0 8px;outline:0;font-family:inherit;font-size:13px;font-weight:400;min-width:23px;margin:1px 0;transition:70ms;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;vertical-align:bottom;position:relative;overflow:hidden;background-image:linear-gradient(rgba(0,0,0,0) 0,rgba(0,0,0,.1) 100%);cursor:unset;width:175px;text-align:left}@media (pointer:fine){:host(:not([readonly]):hover){background-color:#fff;color:#1d1d1d;box-shadow:0 0 0 0 rgba(0,0,0,.6)}}@media all{:host(:not([readonly]):active),:host(:not([readonly])[focused]){background-color:#fff;color:#1d1d1d;box-shadow:0 0 0 0 rgba(0,0,0,.3)}:host([disabled]){background-color:#fafbfc;color:#505050;border-color:#babfc8;box-shadow:none;outline:0;pointer-events:none}}:host([disabled]){opacity:.4;border-color:#a9afba}:host(:not([readonly]):active),:host(:not([readonly])[focused]){background-image:none}:host(:not([disabled])[focused]){border:1px dotted #ee7600!important;box-shadow:inset 0 0 0 1px #a9afba}:host(:not([disabled])[focused]:hover){box-shadow:inset 0 0 0 1px #a9afba}:host([warning]){border-color:#f93!important}:host([error]){border-color:#d94255!important}:host [part=list]{max-width:var(--list-max-width,300px);max-height:var(--list-max-height);margin:1px 0;border:1px solid #fff;background-color:#fafbfc}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#8a8a96 #fff}}::-webkit-scrollbar{width:13px;height:13px}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #fff;height:12px;width:12px;display:block}::-webkit-scrollbar-thumb{background:#8a8a96;border-radius:7px;border:2px solid #fff}::-webkit-scrollbar-thumb:hover{background:#a9afba}::-webkit-scrollbar-thumb:active{background:#ee7600}::-webkit-scrollbar-track{background:#fff}::-webkit-scrollbar-corner{background:#fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:end:increment{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:horizontal:start:decrement{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}' }}));
5
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-select', styles: ':host{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-family:inherit;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;touch-action:manipulation;-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:0;background-color:#fafbfc;color:#505050;border:1px solid #a9afba;height:23px;box-shadow:0 0 0 0 rgba(0,0,0,.3);padding:0 8px;outline:0;font-family:inherit;font-size:13px;font-weight:400;min-width:23px;margin:1px 0;transition:70ms;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;justify-content:center;align-items:center;vertical-align:bottom;position:relative;overflow:hidden;background-image:linear-gradient(rgba(0,0,0,0) 0,rgba(0,0,0,.1) 100%);cursor:unset;width:175px;text-align:left}@media (pointer:fine){:host(:not([readonly]):hover){background-color:#fff;color:#1d1d1d;box-shadow:0 0 0 0 rgba(0,0,0,.6)}}@media all{:host(:not([readonly]):active),:host(:not([readonly])[focused]){background-color:#fff;color:#1d1d1d;box-shadow:0 0 0 0 rgba(0,0,0,.3)}:host([disabled]){background-color:#fafbfc;color:#505050;border-color:#babfc8;box-shadow:none;outline:0;pointer-events:none}}:host([disabled]){opacity:.4;border-color:#a9afba}:host(:not([readonly]):active),:host(:not([readonly])[focused]){background-image:none}:host(:not([disabled])[focused]){border:1px dotted #ee7600!important;box-shadow:inset 0 0 0 1px #a9afba}:host(:not([disabled])[focused]:hover){box-shadow:inset 0 0 0 1px #a9afba}:host([warning]){border-color:#f93!important}:host([error]){border-color:#d94255!important}:host [part=list]{max-width:var(--list-max-width,300px);max-height:var(--list-max-height);margin:1px 0;border:1px solid #fff;background-color:#fafbfc}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#8A8A96 #FFFFFF}}::-webkit-scrollbar{width:13px;height:13px}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #fff;height:12px;width:12px;display:block}::-webkit-scrollbar-thumb{background:#8a8a96;border-radius:7px;border:2px solid #fff}::-webkit-scrollbar-thumb:hover{background:#a9afba}::-webkit-scrollbar-thumb:active{background:#ee7600}::-webkit-scrollbar-track{background:#fff}::-webkit-scrollbar-corner{background:#fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:end:increment{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:horizontal:start:decrement{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}' }}));
package/lib/sidebar-layout/themes/halo/dark/index.js CHANGED
@@ -1,2 +1,2 @@
1
1
  import '@refinitiv-ui/elements/layout/themes/halo/dark';
2
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-sidebar-layout', styles: ':host{--sidebar-width:250px}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#595959 #1a1a1a;scrollbar-width:thin}}:host(:not([sidebar-position])) [part=sidebar],:host([sidebar-position=left]) [part=sidebar]{border-right:1px solid #404040;transition:margin-left .1s}:host([sidebar-position=right]) [part=sidebar]{order:1;border-left:1px solid #404040;transition:margin-right .1s}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#595959;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #0d0d0d;border-bottom:1px solid #0d0d0d}::-webkit-scrollbar-track:vertical{border-left:1px solid #0d0d0d;border-right:1px solid #0d0d0d}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #1a1a1a;height:16px;width:16px;display:none;border:1px solid #0d0d0d}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #0d0d0d}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#0d0d0d}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#0d0d0d}' }}));
2
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-sidebar-layout', styles: ':host{--sidebar-width:250px}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#595959 #1A1A1A;scrollbar-width:thin}}:host(:not([sidebar-position])) [part=sidebar],:host([sidebar-position=left]) [part=sidebar]{border-right:1px solid #404040;transition:margin-left .1s}:host([sidebar-position=right]) [part=sidebar]{order:1;border-left:1px solid #404040;transition:margin-right .1s}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#595959;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#595959,#595959);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #0d0d0d;border-bottom:1px solid #0d0d0d}::-webkit-scrollbar-track:vertical{border-left:1px solid #0d0d0d;border-right:1px solid #0d0d0d}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #1a1a1a;height:16px;width:16px;display:none;border:1px solid #0d0d0d}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #0d0d0d}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#0d0d0d}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#0d0d0d}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#0d0d0d;background-image:linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc),linear-gradient(#ccc,#ccc);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#0d0d0d}' }}));
package/lib/sidebar-layout/themes/halo/light/index.js CHANGED
@@ -1,2 +1,2 @@
1
1
  import '@refinitiv-ui/elements/layout/themes/halo/light';
2
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-sidebar-layout', styles: ':host{--sidebar-width:250px}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#999 #f2f2f2;scrollbar-width:thin}}:host(:not([sidebar-position])) [part=sidebar],:host([sidebar-position=left]) [part=sidebar]{border-right:1px solid #d9d9d9;transition:margin-left .1s}:host([sidebar-position=right]) [part=sidebar]{order:1;border-left:1px solid #d9d9d9;transition:margin-right .1s}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#999;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#f2f2f2}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #fff;border-bottom:1px solid #fff}::-webkit-scrollbar-track:vertical{border-left:1px solid #fff;border-right:1px solid #fff}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #f2f2f2;height:16px;width:16px;display:none;border:1px solid #fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #fff}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#fff}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#fff}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#fff}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#fff}' }}));
2
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-sidebar-layout', styles: ':host{--sidebar-width:250px}@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#999999 #F2F2F2;scrollbar-width:thin}}:host(:not([sidebar-position])) [part=sidebar],:host([sidebar-position=left]) [part=sidebar]{border-right:1px solid #d9d9d9;transition:margin-left .1s}:host([sidebar-position=right]) [part=sidebar]{order:1;border-left:1px solid #d9d9d9;transition:margin-right .1s}::-webkit-scrollbar-corner{background:0 0}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#999;border-radius:0;border:1px solid transparent}::-webkit-scrollbar-thumb:hover{background:#1429bd}::-webkit-scrollbar-thumb:active{background:#0f1e8a}::-webkit-scrollbar-track{background:#f2f2f2}::-webkit-scrollbar-thumb:horizontal{background-size:auto 6px;background-repeat:repeat-x;background-image:linear-gradient(to bottom,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:hover{background-image:linear-gradient(to bottom,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:horizontal:active{background-image:linear-gradient(to bottom,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical{background-size:6px auto;background-repeat:repeat-y;background-image:linear-gradient(to right,#999,#999);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:hover{background-image:linear-gradient(to right,#1429bd,#1429bd);background-color:transparent;background-position:center}::-webkit-scrollbar-thumb:vertical:active{background-image:linear-gradient(to right,#0f1e8a,#0f1e8a);background-color:transparent;background-position:center}::-webkit-scrollbar-track:horizontal{border-top:1px solid #fff;border-bottom:1px solid #fff}::-webkit-scrollbar-track:vertical{border-left:1px solid #fff;border-right:1px solid #fff}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #f2f2f2;height:16px;width:16px;display:none;border:1px solid #fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:hover{background-color:#1429bd;border:1px solid #1429bd}::-webkit-scrollbar-button:active{background-color:#0f1e8a;border:1px solid #fff}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{border-bottom-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#1429bd}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 8px,9.55px 7px,8.55px 6px,7.55px 5px,6.55px 4px,5.55px 5px,4.55px 6px,3.55px 7px,2.55px 8px;border-bottom-color:#fff}::-webkit-scrollbar-button:vertical:end:increment{border-top-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#1429bd}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:10.55px 4px,9.55px 5px,8.55px 6px,7.55px 7px,6.55px 8px,5.55px 7px,4.55px 6px,3.55px 5px,2.55px 4px;border-top-color:#fff}::-webkit-scrollbar-button:horizontal:start:decrement{border-right-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#1429bd}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:7.5px 10.55px,6.5px 9.55px,5.5px 8.55px,4.5px 7.55px,3.5px 6.55px,4.5px 5.55px,5.5px 4.55px,6.5px 3.55px,7.5px 2.55px;border-right-color:#fff}::-webkit-scrollbar-button:horizontal:end:increment{border-left-color:#fff;background-image:linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959),linear-gradient(#595959,#595959);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#1429bd}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);background-position:5px 10.55px,6px 9.55px,7px 8.55px,8px 7.55px,9px 6.55px,8px 5.55px,7px 4.55px,6px 3.55px,5px 2.55px;border-left-color:#fff}' }}));
package/lib/sidebar-layout/themes/solar/charcoal/index.js CHANGED
@@ -1,2 +1,2 @@
1
1
  import '@refinitiv-ui/elements/layout/themes/solar/charcoal';
2
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-sidebar-layout', styles: '@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#666570 #2e2e33}}:host(:not([sidebar-position])) [part=sidebar],:host([sidebar-position=left]) [part=sidebar]{border-right:1px solid #0a0a0a;transition:margin-left .2s}:host([sidebar-position=right]) [part=sidebar]{order:1;border-left:1px solid #0a0a0a;transition:margin-right .2s}::-webkit-scrollbar{width:13px;height:13px}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #2e2e33;height:12px;width:12px;display:block}::-webkit-scrollbar-thumb{background:#666570;border-radius:7px;border:2px solid #2e2e33}::-webkit-scrollbar-thumb:hover{background:#e2e2e2}::-webkit-scrollbar-thumb:active{background:#f93}::-webkit-scrollbar-track{background:#2e2e33}::-webkit-scrollbar-corner{background:#2e2e33}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:end:increment{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:horizontal:start:decrement{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}:host{--sidebar-width:250px}' }}));
2
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-sidebar-layout', styles: '@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#666570 #2E2E33}}:host(:not([sidebar-position])) [part=sidebar],:host([sidebar-position=left]) [part=sidebar]{border-right:1px solid #0a0a0a;transition:margin-left .2s}:host([sidebar-position=right]) [part=sidebar]{order:1;border-left:1px solid #0a0a0a;transition:margin-right .2s}::-webkit-scrollbar{width:13px;height:13px}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #2e2e33;height:12px;width:12px;display:block}::-webkit-scrollbar-thumb{background:#666570;border-radius:7px;border:2px solid #2e2e33}::-webkit-scrollbar-thumb:hover{background:#e2e2e2}::-webkit-scrollbar-thumb:active{background:#f93}::-webkit-scrollbar-track{background:#2e2e33}::-webkit-scrollbar-corner{background:#2e2e33}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:end:increment{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:horizontal:start:decrement{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment{background-image:linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570),linear-gradient(#666570,#666570);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2),linear-gradient(#e2e2e2,#e2e2e2);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93),linear-gradient(#f93,#f93);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}:host{--sidebar-width:250px}' }}));
package/lib/sidebar-layout/themes/solar/pearl/index.js CHANGED
@@ -1,2 +1,2 @@
1
1
  import '@refinitiv-ui/elements/layout/themes/solar/pearl';
2
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-sidebar-layout', styles: '@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#8a8a96 #fff}}:host(:not([sidebar-position])) [part=sidebar],:host([sidebar-position=left]) [part=sidebar]{border-right:1px solid #d5d8db;transition:margin-left .2s}:host([sidebar-position=right]) [part=sidebar]{order:1;border-left:1px solid #d5d8db;transition:margin-right .2s}::-webkit-scrollbar{width:13px;height:13px}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #fff;height:12px;width:12px;display:block}::-webkit-scrollbar-thumb{background:#8a8a96;border-radius:7px;border:2px solid #fff}::-webkit-scrollbar-thumb:hover{background:#a9afba}::-webkit-scrollbar-thumb:active{background:#ee7600}::-webkit-scrollbar-track{background:#fff}::-webkit-scrollbar-corner{background:#fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:end:increment{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:horizontal:start:decrement{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}:host{--sidebar-width:250px}' }}));
2
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-sidebar-layout', styles: '@supports not selector(::-webkit-scrollbar){:host{scrollbar-color:#8A8A96 #FFFFFF}}:host(:not([sidebar-position])) [part=sidebar],:host([sidebar-position=left]) [part=sidebar]{border-right:1px solid #d5d8db;transition:margin-left .2s}:host([sidebar-position=right]) [part=sidebar]{order:1;border-left:1px solid #d5d8db;transition:margin-right .2s}::-webkit-scrollbar{width:13px;height:13px}::-webkit-scrollbar-button{background:0 0/1px 2px no-repeat #fff;height:12px;width:12px;display:block}::-webkit-scrollbar-thumb{background:#8a8a96;border-radius:7px;border:2px solid #fff}::-webkit-scrollbar-thumb:hover{background:#a9afba}::-webkit-scrollbar-thumb:active{background:#ee7600}::-webkit-scrollbar-track{background:#fff}::-webkit-scrollbar-corner{background:#fff}::-webkit-scrollbar-button:end:decrement,::-webkit-scrollbar-button:start:increment{display:none}::-webkit-scrollbar-button:horizontal{background-size:2px 1px}::-webkit-scrollbar-button:vertical:start:decrement{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:start:decrement:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:10px 6.5px,9px 5.5px,8px 4.5px,7px 3.5px,6px 2.5px,5px 3.5px,4px 4.5px,3px 5.5px,2px 6.5px}::-webkit-scrollbar-button:vertical:end:increment{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:vertical:end:increment:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:10px 3.5px,9px 4.5px,8px 5.5px,7px 6.5px,6px 7.5px,5px 6.5px,4px 5.5px,3px 4.5px,2px 3.5px}::-webkit-scrollbar-button:horizontal:start:decrement{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:start:decrement:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:6.5px 10px,5.5px 9px,4.5px 8px,3.5px 7px,2.5px 6px,3.5px 5px,4.5px 4px,5.5px 3px,6.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment{background-image:linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96),linear-gradient(#8a8a96,#8a8a96);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:hover{background-image:linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba),linear-gradient(#a9afba,#a9afba);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}::-webkit-scrollbar-button:horizontal:end:increment:active{background-image:linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600),linear-gradient(#ee7600,#ee7600);background-position:3.5px 10px,4.5px 9px,5.5px 8px,6.5px 7px,7.5px 6px,6.5px 5px,5.5px 4px,4.5px 3px,3.5px 2px}:host{--sidebar-width:250px}' }}));
package/lib/slider/themes/halo/dark/index.js CHANGED
@@ -1,3 +1,3 @@
1
1
  import '@refinitiv-ui/elements/number-field/themes/halo/dark';
2
2
  dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-slider-marker', styles: ':host{width:4px;height:8px;top:calc(50% - 4px);-webkit-user-select:none;-moz-user-select:none;user-select:none}:host [part=marker]{background-color:var(--marker-color,#ccc);background-color:var(--marker-color,#6678ff)}:host [part=label]{top:15px;transform:translateX(calc(-50% + 4px / 2))}:host([label-align=right]) [part=label]{transform:translateX(calc(-100% + 4px))}:host([label-align=left]) [part=label]{transform:none}' }}));
3
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-slider', styles: ':host{touch-action:manipulation;margin:1px 0;opacity:.9;opacity:1}:host(:not([disabled]):hover){opacity:1}:host(:not(:empty)) [part=slider-wrapper]{margin-bottom:20px}:host [part=slider-wrapper]{height:24px}:host [part=track-wrapper]{height:4px;background:var(--track-color,#333);top:calc((100% - 4px)/ 2)}:host(:not([disabled])) [part=track-fill]{height:inherit;background:var(--progress-color,var(--thumb-color,#ccc));background-color:var(--progress-color,var(--thumb-color,#6678ff))}:host([disabled]) [part=thumb],:host([disabled]) [part=thumb]:hover,:host([disabled]) [part=track-fill],:host([disabled]) [part=track-wrapper]::after{background:#333;content:\'\'}:host [part=thumb-container]{height:100%;top:0;margin-left:-4px;width:8px}:host([focused=visible]) [part=thumb-container][active] [part=thumb]{outline:#334bff solid 1px;outline-offset:2px}:host([show-steps]) [part=step-container]{height:inherit}:host([show-steps]:not([disabled])) [part=step]{height:inherit;background-image:linear-gradient(to right,var(--step-color,#6678ff),var(--step-color,#6678ff) 4px,transparent 0,transparent)}:host([show-steps]:not([disabled])) [part=track-wrapper]::after{height:inherit;width:4px;background-color:var(--step-color,#6678ff)}:host [part=pin]{width:26px;height:26px;margin-top:-6px;margin-left:-2px;transform:rotate(-45deg) scale(0) translate(0);transition:transform .1s ease-out;border-radius:50% 50% 50% 0;background-color:var(--pin-color,#ccc);display:none}:host [part=pin-value-marker]{font-family:inherit;font-size:.8em;color:var(--pin-text-color,#fff);line-height:1.25rem;font-weight:400;letter-spacing:.01786em;text-decoration:inherit;text-transform:inherit;transform:rotate(45deg);-webkit-user-select:none;-moz-user-select:none;user-select:none}:host([pin].grabbable) [part=pin]{transform:rotate(-45deg) scale(1) translate(19px,-20px)}:host([pin].grabbable) [part=thumb]{transform:scale(.7);transform:none}:host [part=input]{margin:0;padding:0;width:var(--input-field-width,40px);min-width:40px;text-align:center;height:24px}:host [part=input][name=to],:host [part=input][name=value]{margin-left:16px}:host [part=input][name=from]{margin-right:16px}:host(:not([disabled]):not([readonly]):hover){cursor:pointer}:host [part=thumb]{box-sizing:border-box;transform:scale(.7);background:var(--thumb-color,#ccc);top:calc(4px / 2);border-radius:0;width:8px;height:20px;transform:none;border:1px solid #0d0d0d}:host(:not([disabled]):not([readonly]):not(.grabbable)) [part=thumb]:hover{background-color:var(--thumb-color,#1429bd);border-color:var(--thumb-color,#0d0d0d)}:host(.grabbable) [part=thumb]{border-width:2px;transform:scale(1);border:1px solid var(--thumb-color,#0d0d0d);background-color:var(--thumb-color,#0f1e8a);transform:none}' }}));
3
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-slider', styles: ':host{touch-action:manipulation;margin:1px 0;opacity:.9;opacity:1}:host(:not([disabled]):hover){opacity:1}:host(:not(:empty)) [part=slider-wrapper]{margin-bottom:20px}:host [part=slider-wrapper]{height:24px}:host [part=track-wrapper]{height:4px;background:var(--track-color,#333);top:calc((100% - 4px)/ 2)}:host(:not([disabled])) [part=track-fill]{height:inherit;background:var(--progress-color,var(--thumb-color,#ccc));background-color:var(--progress-color,var(--thumb-color,#6678ff))}:host([disabled]) [part=thumb],:host([disabled]) [part=thumb]:hover,:host([disabled]) [part=track-fill],:host([disabled]) [part=track-wrapper]::after{background:#333;content:\'\'}:host [part=thumb-container]{height:100%;top:0;margin-left:-4px;width:8px}:host([focused=visible]) [part=thumb-container][active] [part=thumb]{outline:#334BFF solid 1px;outline-offset:2px}:host([show-steps]) [part=step-container]{height:inherit}:host([show-steps]:not([disabled])) [part=step]{height:inherit;background-image:linear-gradient(to right,var(--step-color,#6678ff),var(--step-color,#6678ff) 4px,transparent 0,transparent)}:host([show-steps]:not([disabled])) [part=track-wrapper]::after{height:inherit;width:4px;background-color:var(--step-color,#6678ff)}:host [part=pin]{width:26px;height:26px;margin-top:-6px;margin-left:-2px;transform:rotate(-45deg) scale(0) translate(0);transition:transform .1s ease-out;border-radius:50% 50% 50% 0;background-color:var(--pin-color,#ccc);display:none}:host [part=pin-value-marker]{font-family:inherit;font-size:.8em;color:var(--pin-text-color,#fff);line-height:1.25rem;font-weight:400;letter-spacing:.01786em;text-decoration:inherit;text-transform:inherit;transform:rotate(45deg);-webkit-user-select:none;-moz-user-select:none;user-select:none}:host([pin].grabbable) [part=pin]{transform:rotate(-45deg) scale(1) translate(19px,-20px)}:host([pin].grabbable) [part=thumb]{transform:scale(.7);transform:none}:host [part=input]{margin:0;padding:0;width:var(--input-field-width,40px);min-width:40px;text-align:center;height:24px}:host [part=input][name=to],:host [part=input][name=value]{margin-left:16px}:host [part=input][name=from]{margin-right:16px}:host(:not([disabled]):not([readonly]):hover){cursor:pointer}:host [part=thumb]{box-sizing:border-box;transform:scale(.7);background:var(--thumb-color,#ccc);top:calc(4px / 2);border-radius:0;width:8px;height:20px;transform:none;border:1px solid #0d0d0d}:host(:not([disabled]):not([readonly]):not(.grabbable)) [part=thumb]:hover{background-color:var(--thumb-color,#1429bd);border-color:var(--thumb-color,#0d0d0d)}:host(.grabbable) [part=thumb]{border-width:2px;transform:scale(1);border:1px solid var(--thumb-color,#0d0d0d);background-color:var(--thumb-color,#0f1e8a);transform:none}' }}));
package/lib/slider/themes/halo/light/index.js CHANGED
@@ -1,3 +1,3 @@
1
1
  import '@refinitiv-ui/elements/number-field/themes/halo/light';
2
2
  dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-slider-marker', styles: ':host{width:4px;height:8px;top:calc(50% - 4px);-webkit-user-select:none;-moz-user-select:none;user-select:none}:host [part=marker]{background-color:var(--marker-color,#fafafa);background-color:var(--marker-color,#334bff)}:host [part=label]{top:15px;transform:translateX(calc(-50% + 4px / 2))}:host([label-align=right]) [part=label]{transform:translateX(calc(-100% + 4px))}:host([label-align=left]) [part=label]{transform:none}' }}));
3
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-slider', styles: ':host{touch-action:manipulation;margin:1px 0;opacity:.9;opacity:1}:host(:not([disabled]):hover){opacity:1}:host(:not(:empty)) [part=slider-wrapper]{margin-bottom:20px}:host [part=slider-wrapper]{height:24px}:host [part=track-wrapper]{height:4px;background:var(--track-color,#d9d9d9);top:calc((100% - 4px)/ 2)}:host(:not([disabled])) [part=track-fill]{height:inherit;background:var(--progress-color,var(--thumb-color,#fafafa));background-color:var(--progress-color,var(--thumb-color,#334bff))}:host([disabled]) [part=thumb],:host([disabled]) [part=thumb]:hover,:host([disabled]) [part=track-fill],:host([disabled]) [part=track-wrapper]::after{background:#d9d9d9;content:\'\'}:host [part=thumb-container]{height:100%;top:0;margin-left:-4px;width:8px}:host([focused=visible]) [part=thumb-container][active] [part=thumb]{outline:#334bff solid 1px;outline-offset:2px}:host([show-steps]) [part=step-container]{height:inherit}:host([show-steps]:not([disabled])) [part=step]{height:inherit;background-image:linear-gradient(to right,var(--step-color,#334bff),var(--step-color,#334bff) 4px,transparent 0,transparent)}:host([show-steps]:not([disabled])) [part=track-wrapper]::after{height:inherit;width:4px;background-color:var(--step-color,#334bff)}:host [part=pin]{width:26px;height:26px;margin-top:-6px;margin-left:-2px;transform:rotate(-45deg) scale(0) translate(0);transition:transform .1s ease-out;border-radius:50% 50% 50% 0;background-color:var(--pin-color,#fafafa);display:none}:host [part=pin-value-marker]{font-family:inherit;font-size:.8em;color:var(--pin-text-color,#fff);line-height:1.25rem;font-weight:400;letter-spacing:.01786em;text-decoration:inherit;text-transform:inherit;transform:rotate(45deg);-webkit-user-select:none;-moz-user-select:none;user-select:none}:host([pin].grabbable) [part=pin]{transform:rotate(-45deg) scale(1) translate(19px,-20px)}:host([pin].grabbable) [part=thumb]{transform:scale(.7);transform:none}:host [part=input]{margin:0;padding:0;width:var(--input-field-width,40px);min-width:40px;text-align:center;height:24px}:host [part=input][name=to],:host [part=input][name=value]{margin-left:16px}:host [part=input][name=from]{margin-right:16px}:host(:not([disabled]):not([readonly]):hover){cursor:pointer}:host [part=thumb]{box-sizing:border-box;transform:scale(.7);background:var(--thumb-color,#fafafa);top:calc(4px / 2);border-radius:0;width:8px;height:20px;transform:none;border:1px solid #404040}:host([disabled]) [part=thumb]{border-color:#ccc}:host(:not([disabled]):not([readonly]):not(.grabbable)) [part=thumb]:hover{background-color:var(--thumb-color,#1429bd);border-color:var(--thumb-color,#1429bd)}:host(.grabbable) [part=thumb]{border-width:2px;transform:scale(1);border:1px solid var(--thumb-color,#0f1e8a);background-color:var(--thumb-color,#0f1e8a);transform:none}' }}));
3
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-slider', styles: ':host{touch-action:manipulation;margin:1px 0;opacity:.9;opacity:1}:host(:not([disabled]):hover){opacity:1}:host(:not(:empty)) [part=slider-wrapper]{margin-bottom:20px}:host [part=slider-wrapper]{height:24px}:host [part=track-wrapper]{height:4px;background:var(--track-color,#d9d9d9);top:calc((100% - 4px)/ 2)}:host(:not([disabled])) [part=track-fill]{height:inherit;background:var(--progress-color,var(--thumb-color,#fafafa));background-color:var(--progress-color,var(--thumb-color,#334bff))}:host([disabled]) [part=thumb],:host([disabled]) [part=thumb]:hover,:host([disabled]) [part=track-fill],:host([disabled]) [part=track-wrapper]::after{background:#d9d9d9;content:\'\'}:host [part=thumb-container]{height:100%;top:0;margin-left:-4px;width:8px}:host([focused=visible]) [part=thumb-container][active] [part=thumb]{outline:#334BFF solid 1px;outline-offset:2px}:host([show-steps]) [part=step-container]{height:inherit}:host([show-steps]:not([disabled])) [part=step]{height:inherit;background-image:linear-gradient(to right,var(--step-color,#334bff),var(--step-color,#334bff) 4px,transparent 0,transparent)}:host([show-steps]:not([disabled])) [part=track-wrapper]::after{height:inherit;width:4px;background-color:var(--step-color,#334bff)}:host [part=pin]{width:26px;height:26px;margin-top:-6px;margin-left:-2px;transform:rotate(-45deg) scale(0) translate(0);transition:transform .1s ease-out;border-radius:50% 50% 50% 0;background-color:var(--pin-color,#fafafa);display:none}:host [part=pin-value-marker]{font-family:inherit;font-size:.8em;color:var(--pin-text-color,#fff);line-height:1.25rem;font-weight:400;letter-spacing:.01786em;text-decoration:inherit;text-transform:inherit;transform:rotate(45deg);-webkit-user-select:none;-moz-user-select:none;user-select:none}:host([pin].grabbable) [part=pin]{transform:rotate(-45deg) scale(1) translate(19px,-20px)}:host([pin].grabbable) [part=thumb]{transform:scale(.7);transform:none}:host [part=input]{margin:0;padding:0;width:var(--input-field-width,40px);min-width:40px;text-align:center;height:24px}:host [part=input][name=to],:host [part=input][name=value]{margin-left:16px}:host [part=input][name=from]{margin-right:16px}:host(:not([disabled]):not([readonly]):hover){cursor:pointer}:host [part=thumb]{box-sizing:border-box;transform:scale(.7);background:var(--thumb-color,#fafafa);top:calc(4px / 2);border-radius:0;width:8px;height:20px;transform:none;border:1px solid #404040}:host([disabled]) [part=thumb]{border-color:#ccc}:host(:not([disabled]):not([readonly]):not(.grabbable)) [part=thumb]:hover{background-color:var(--thumb-color,#1429bd);border-color:var(--thumb-color,#1429bd)}:host(.grabbable) [part=thumb]{border-width:2px;transform:scale(1);border:1px solid var(--thumb-color,#0f1e8a);background-color:var(--thumb-color,#0f1e8a);transform:none}' }}));
package/lib/slider/themes/solar/charcoal/index.js CHANGED
@@ -1,3 +1,3 @@
1
1
  import '@refinitiv-ui/elements/number-field/themes/solar/charcoal';
2
2
  dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-slider-marker', styles: ':host{width:3px;height:6px;top:calc(50% - 3px);-webkit-user-select:none;-moz-user-select:none;user-select:none}:host [part=marker]{background-color:var(--marker-color,#f93)}:host [part=label]{top:15px;transform:translateX(calc(-50% + 3px / 2))}:host([label-align=right]) [part=label]{transform:translateX(calc(-100% + 3px))}:host([label-align=left]) [part=label]{transform:none}' }}));
3
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-slider', styles: ':host{touch-action:manipulation;margin:1px 0;opacity:.9}:host(:not([disabled]):hover){opacity:1}:host(:not(:empty)) [part=slider-wrapper]{margin-bottom:20px}:host [part=slider-wrapper]{height:23px}:host [part=track-wrapper]{height:3px;background:var(--track-color,#666570)}:host(:not([disabled])) [part=track-fill]{height:inherit;background:var(--progress-color,var(--thumb-color,#f93))}:host([disabled]) [part=thumb],:host([disabled]) [part=thumb]:hover,:host([disabled]) [part=track-fill],:host([disabled]) [part=track-wrapper]::after{background:#666570;content:\'\'}:host [part=thumb-container]{width:22px;height:100%;margin-left:-9.5px}:host [part=thumb]{top:calc((100% - 20px + 3px)/ 2);height:20px;width:20px;box-sizing:border-box;border:3px solid transparent;border-radius:100%;transform:scale(.7);background:var(--thumb-color,#f93)}:host([focused=visible]) [part=thumb-container][active] [part=thumb]{outline:#f93 solid 1px;outline-offset:2px}:host(.grabbable) [part=thumb]{border-width:2px;transform:scale(1)}:host([show-steps]) [part=step-container]{height:inherit}:host([show-steps]:not([disabled])) [part=step]{height:inherit;background-image:linear-gradient(to right,var(--step-color,#f93),var(--step-color,#f93) 3px,transparent 0,transparent)}:host([show-steps]:not([disabled])) [part=track-wrapper]::after{height:inherit;width:3px;background-color:var(--step-color,#f93)}:host [part=pin]{width:26px;height:26px;margin-top:-6px;margin-left:-2px;transform:rotate(-45deg) scale(0) translate(0);transition:transform .1s ease-out;border-radius:50% 50% 50% 0;background-color:var(--pin-color,#f93)}:host [part=pin-value-marker]{font-family:inherit;font-size:.8em;color:var(--pin-text-color,#fff);line-height:1.25rem;font-weight:400;letter-spacing:.01786em;text-decoration:inherit;text-transform:inherit;transform:rotate(45deg);-webkit-user-select:none;-moz-user-select:none;user-select:none}:host([pin].grabbable) [part=pin]{transform:rotate(-45deg) scale(1) translate(19px,-20px)}:host([pin].grabbable) [part=thumb]{transform:scale(.7)}:host [part=input]{margin:0;padding:0;width:var(--input-field-width,40px);min-width:40px;text-align:center;height:23px}:host [part=input][name=to],:host [part=input][name=value]{margin-left:16px}:host [part=input][name=from]{margin-right:16px}' }}));
3
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-slider', styles: ':host{touch-action:manipulation;margin:1px 0;opacity:.9}:host(:not([disabled]):hover){opacity:1}:host(:not(:empty)) [part=slider-wrapper]{margin-bottom:20px}:host [part=slider-wrapper]{height:23px}:host [part=track-wrapper]{height:3px;background:var(--track-color,#666570)}:host(:not([disabled])) [part=track-fill]{height:inherit;background:var(--progress-color,var(--thumb-color,#f93))}:host([disabled]) [part=thumb],:host([disabled]) [part=thumb]:hover,:host([disabled]) [part=track-fill],:host([disabled]) [part=track-wrapper]::after{background:#666570;content:\'\'}:host [part=thumb-container]{width:22px;height:100%;margin-left:-9.5px}:host [part=thumb]{top:calc((100% - 20px + 3px)/ 2);height:20px;width:20px;box-sizing:border-box;border:3px solid transparent;border-radius:100%;transform:scale(.7);background:var(--thumb-color,#f93)}:host([focused=visible]) [part=thumb-container][active] [part=thumb]{outline:#FF9933 solid 1px;outline-offset:2px}:host(.grabbable) [part=thumb]{border-width:2px;transform:scale(1)}:host([show-steps]) [part=step-container]{height:inherit}:host([show-steps]:not([disabled])) [part=step]{height:inherit;background-image:linear-gradient(to right,var(--step-color,#f93),var(--step-color,#f93) 3px,transparent 0,transparent)}:host([show-steps]:not([disabled])) [part=track-wrapper]::after{height:inherit;width:3px;background-color:var(--step-color,#f93)}:host [part=pin]{width:26px;height:26px;margin-top:-6px;margin-left:-2px;transform:rotate(-45deg) scale(0) translate(0);transition:transform .1s ease-out;border-radius:50% 50% 50% 0;background-color:var(--pin-color,#f93)}:host [part=pin-value-marker]{font-family:inherit;font-size:.8em;color:var(--pin-text-color,#fff);line-height:1.25rem;font-weight:400;letter-spacing:.01786em;text-decoration:inherit;text-transform:inherit;transform:rotate(45deg);-webkit-user-select:none;-moz-user-select:none;user-select:none}:host([pin].grabbable) [part=pin]{transform:rotate(-45deg) scale(1) translate(19px,-20px)}:host([pin].grabbable) [part=thumb]{transform:scale(.7)}:host [part=input]{margin:0;padding:0;width:var(--input-field-width,40px);min-width:40px;text-align:center;height:23px}:host [part=input][name=to],:host [part=input][name=value]{margin-left:16px}:host [part=input][name=from]{margin-right:16px}' }}));
package/lib/slider/themes/solar/pearl/index.js CHANGED
@@ -1,3 +1,3 @@
1
1
  import '@refinitiv-ui/elements/number-field/themes/solar/pearl';
2
2
  dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-slider-marker', styles: ':host{width:3px;height:6px;top:calc(50% - 3px);-webkit-user-select:none;-moz-user-select:none;user-select:none}:host [part=marker]{background-color:var(--marker-color,#f93)}:host [part=label]{top:15px;transform:translateX(calc(-50% + 3px / 2))}:host([label-align=right]) [part=label]{transform:translateX(calc(-100% + 3px))}:host([label-align=left]) [part=label]{transform:none}' }}));
3
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-slider', styles: ':host{touch-action:manipulation;margin:1px 0;opacity:.9}:host(:not([disabled]):hover){opacity:1}:host(:not(:empty)) [part=slider-wrapper]{margin-bottom:20px}:host [part=slider-wrapper]{height:23px}:host [part=track-wrapper]{height:3px;background:var(--track-color,#d5d8db)}:host(:not([disabled])) [part=track-fill]{height:inherit;background:var(--progress-color,var(--thumb-color,#f93))}:host([disabled]) [part=thumb],:host([disabled]) [part=thumb]:hover,:host([disabled]) [part=track-fill],:host([disabled]) [part=track-wrapper]::after{background:#d5d8db;content:\'\'}:host [part=thumb-container]{width:22px;height:100%;margin-left:-9.5px}:host [part=thumb]{top:calc((100% - 20px + 3px)/ 2);height:20px;width:20px;box-sizing:border-box;border:3px solid transparent;border-radius:100%;transform:scale(.7);background:var(--thumb-color,#f93)}:host([focused=visible]) [part=thumb-container][active] [part=thumb]{outline:#f93 solid 1px;outline-offset:2px}:host(.grabbable) [part=thumb]{border-width:2px;transform:scale(1)}:host([show-steps]) [part=step-container]{height:inherit}:host([show-steps]:not([disabled])) [part=step]{height:inherit;background-image:linear-gradient(to right,var(--step-color,#f93),var(--step-color,#f93) 3px,transparent 0,transparent)}:host([show-steps]:not([disabled])) [part=track-wrapper]::after{height:inherit;width:3px;background-color:var(--step-color,#f93)}:host [part=pin]{width:26px;height:26px;margin-top:-6px;margin-left:-2px;transform:rotate(-45deg) scale(0) translate(0);transition:transform .1s ease-out;border-radius:50% 50% 50% 0;background-color:var(--pin-color,#f93)}:host [part=pin-value-marker]{font-family:inherit;font-size:.8em;color:var(--pin-text-color,#fff);line-height:1.25rem;font-weight:400;letter-spacing:.01786em;text-decoration:inherit;text-transform:inherit;transform:rotate(45deg);-webkit-user-select:none;-moz-user-select:none;user-select:none}:host([pin].grabbable) [part=pin]{transform:rotate(-45deg) scale(1) translate(19px,-20px)}:host([pin].grabbable) [part=thumb]{transform:scale(.7)}:host [part=input]{margin:0;padding:0;width:var(--input-field-width,40px);min-width:40px;text-align:center;height:23px}:host [part=input][name=to],:host [part=input][name=value]{margin-left:16px}:host [part=input][name=from]{margin-right:16px}' }}));
3
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-slider', styles: ':host{touch-action:manipulation;margin:1px 0;opacity:.9}:host(:not([disabled]):hover){opacity:1}:host(:not(:empty)) [part=slider-wrapper]{margin-bottom:20px}:host [part=slider-wrapper]{height:23px}:host [part=track-wrapper]{height:3px;background:var(--track-color,#d5d8db)}:host(:not([disabled])) [part=track-fill]{height:inherit;background:var(--progress-color,var(--thumb-color,#f93))}:host([disabled]) [part=thumb],:host([disabled]) [part=thumb]:hover,:host([disabled]) [part=track-fill],:host([disabled]) [part=track-wrapper]::after{background:#d5d8db;content:\'\'}:host [part=thumb-container]{width:22px;height:100%;margin-left:-9.5px}:host [part=thumb]{top:calc((100% - 20px + 3px)/ 2);height:20px;width:20px;box-sizing:border-box;border:3px solid transparent;border-radius:100%;transform:scale(.7);background:var(--thumb-color,#f93)}:host([focused=visible]) [part=thumb-container][active] [part=thumb]{outline:#FF9933 solid 1px;outline-offset:2px}:host(.grabbable) [part=thumb]{border-width:2px;transform:scale(1)}:host([show-steps]) [part=step-container]{height:inherit}:host([show-steps]:not([disabled])) [part=step]{height:inherit;background-image:linear-gradient(to right,var(--step-color,#f93),var(--step-color,#f93) 3px,transparent 0,transparent)}:host([show-steps]:not([disabled])) [part=track-wrapper]::after{height:inherit;width:3px;background-color:var(--step-color,#f93)}:host [part=pin]{width:26px;height:26px;margin-top:-6px;margin-left:-2px;transform:rotate(-45deg) scale(0) translate(0);transition:transform .1s ease-out;border-radius:50% 50% 50% 0;background-color:var(--pin-color,#f93)}:host [part=pin-value-marker]{font-family:inherit;font-size:.8em;color:var(--pin-text-color,#fff);line-height:1.25rem;font-weight:400;letter-spacing:.01786em;text-decoration:inherit;text-transform:inherit;transform:rotate(45deg);-webkit-user-select:none;-moz-user-select:none;user-select:none}:host([pin].grabbable) [part=pin]{transform:rotate(-45deg) scale(1) translate(19px,-20px)}:host([pin].grabbable) [part=thumb]{transform:scale(.7)}:host [part=input]{margin:0;padding:0;width:var(--input-field-width,40px);min-width:40px;text-align:center;height:23px}:host [part=input][name=to],:host [part=input][name=value]{margin-left:16px}:host [part=input][name=from]{margin-right:16px}' }}));
package/lib/tab-bar/index.js CHANGED
@@ -388,7 +388,10 @@ let TabBar = class TabBar extends BasicElement {
388
388
  const tabList = this.getFocusableTabs();
389
389
  if (tabList && tabList.length > 0) {
390
390
  const focusedTabIndex = tabList.findIndex((tab) => tab.active);
391
- this.rovingTabIndex(tabList[focusedTabIndex], tabList);
391
+ // Handle an edge case in which there is no tab with truthy active prop.
392
+ // There is a report that this happens on UI framework such as Angular.
393
+ const safeIndex = Math.max(focusedTabIndex, 0);
394
+ this.rovingTabIndex(tabList[safeIndex], tabList);
392
395
  }
393
396
  }
394
397
  /**
package/lib/toggle/themes/ds/dark/index.js CHANGED
@@ -1 +1 @@
1
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-toggle', styles: ':host{touch-action:manipulation;font-size:12px;background-color:#232d38;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;outline:0;box-shadow:inset 0 0 0 rgba(0,0,0,.5);transition:box-shadow .1s,border-color .1s;-webkit-user-select:none;-moz-user-select:none;user-select:none}:host [part=toggle]{cursor:pointer;display:block;position:relative;width:100%;height:100%;box-sizing:border-box;border:1px solid #424c58;border-radius:inherit;text-overflow:inherit;overflow:inherit}:host [part=toggle]::after{content:\'\';position:absolute;box-sizing:border-box;border-radius:inherit}:host([checked-label]),:host([label]){min-width:52px;min-width:44px;width:56px}:host([readonly]) [part=toggle]{cursor:default;background-color:rgba(0,0,0,0);border-color:#424c58}:host([disabled]) [part=toggle]{opacity:.5;background-color:#424c58;border-color:#424c58}:host([checked]) [part=toggle]::after{left:auto;border-color:#6d84ff;background-color:#6d84ff;right:1px}:host([checked-label][checked]) [part=toggle],:host([label][checked]) [part=toggle]{padding-right:24px;padding-left:3px}:host([checked-label]) [part=toggle],:host([label]) [part=toggle]{padding:3px 3px 3px 24px}:host([checked-label]) [part=toggle]::after,:host([label]) [part=toggle]::after{width:20px}:host([checked]){color:#fff}:host([disabled]) [part=toggle]::after{opacity:.2;background-color:#75808c;border-color:#75808c;opacity:1}:host [part=toggle]::after,:host([checked]) [part=toggle]::after{border:1px solid #232d38}:host{width:44px;height:24px;font-weight:420;line-height:18px;text-transform:uppercase;text-transform:none;border-radius:10000px;color:#fff}:host(:hover:not([readonly])){background-color:#323c48}:host [part=toggle]::after{top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-color:#848f9c;border-color:#848f9c}:host([disabled]){color:#75808c}:host([readonly]) [part=toggle]::after{background-color:#fff;border-color:#fff}:host([checked]:not([readonly])){background-color:#fff}:host([checked]:not([readonly])) [part=toggle]::after{background-color:#232d38}:host([checked]:not([readonly])) [part=toggle]{color:#141e29;border-color:#fff}@media (pointer:fine){:host(:hover:not([readonly])),:host([focused=visible]){box-shadow:0 0 0 #5572ff}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-color:#5572ff}:host(:hover:not([readonly])){color:#fff}:host(:hover:not([readonly])) [part=toggle]{border-color:#9ca7b4}:host(:hover:not([readonly])) [part=toggle]::after{background-color:#9ca7b4;border-color:#9ca7b4}:host(:hover:not([readonly])[checked]){background-color:#9ca7b4}:host(:hover:not([readonly])[checked]) [part=toggle]{border-color:#9ca7b4}:host(:hover:not([readonly])[checked]) [part=toggle]::after{background-color:#232d38;border-color:#232d38}}' }}));
1
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-toggle', styles: ':host{touch-action:manipulation;font-size:12px;background-color:#232d38;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;outline:0;box-shadow:inset 0 0 0 rgba(0,0,0,.5);transition:box-shadow .1s,border-color .1s;-webkit-user-select:none;-moz-user-select:none;user-select:none}:host [part=toggle]{cursor:pointer;display:block;position:relative;width:100%;height:100%;box-sizing:border-box;border:1px solid #424c58;border-radius:inherit;text-overflow:inherit;overflow:inherit}:host [part=toggle]::after{content:\'\';position:absolute;box-sizing:border-box;border-radius:inherit}:host([readonly]) [part=toggle]{cursor:default;background-color:rgba(0,0,0,0);border-color:#424c58}:host([disabled]) [part=toggle]{opacity:.5;background-color:#424c58;border-color:#424c58}:host([checked]) [part=toggle]::after{left:auto;border-color:#6d84ff;background-color:#6d84ff;right:1px}:host([checked-label]),:host([label]){min-width:44px;width:56px}:host([checked-label][checked]) [part=toggle],:host([label][checked]) [part=toggle]{padding-right:24px;padding-left:3px}:host([checked-label]) [part=toggle],:host([label]) [part=toggle]{padding:3px 3px 3px 24px}:host([checked-label]) [part=toggle]::after,:host([label]) [part=toggle]::after{width:20px}:host([checked]){color:#fff}:host([disabled]) [part=toggle]::after{opacity:.2;background-color:#75808c;border-color:#75808c;opacity:1}:host [part=toggle]::after,:host([checked]) [part=toggle]::after{border:1px solid #232d38}:host{width:44px;height:24px;font-weight:420;line-height:18px;text-transform:uppercase;text-transform:none;border-radius:10000px;color:#fff}:host(:hover:not([readonly])){background-color:#323c48}:host [part=toggle]::after{top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-color:#848f9c;border-color:#848f9c}:host([disabled]){color:#75808c}:host([readonly]) [part=toggle]::after{background-color:#fff;border-color:#fff}:host([checked]:not([readonly])){background-color:#fff}:host([checked]:not([readonly])) [part=toggle]::after{background-color:#232d38}:host([checked]:not([readonly])) [part=toggle]{color:#141e29;border-color:#fff}@media (pointer:fine){:host(:hover:not([readonly])),:host([focused=visible]){box-shadow:0 0 0 #5572ff}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-color:#5572ff}:host(:hover:not([readonly])){color:#fff}:host(:hover:not([readonly])) [part=toggle]{border-color:#9ca7b4}:host(:hover:not([readonly])) [part=toggle]::after{background-color:#9ca7b4;border-color:#9ca7b4}:host(:hover:not([readonly])[checked]){background-color:#9ca7b4}:host(:hover:not([readonly])[checked]) [part=toggle]{border-color:#9ca7b4}:host(:hover:not([readonly])[checked]) [part=toggle]::after{background-color:#232d38;border-color:#232d38}}' }}));
package/lib/toggle/themes/ds/light/index.js CHANGED
@@ -1 +1 @@
1
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-toggle', styles: ':host [part=toggle]{cursor:pointer;display:block;position:relative;width:100%;height:100%;box-sizing:border-box;border:1px solid #c0cadb;border-radius:inherit;text-overflow:inherit;overflow:inherit}:host [part=toggle]::after{content:\'\';position:absolute;box-sizing:border-box;border-radius:inherit;top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-color:#505b67;border-color:#505b67}:host([checked-label]),:host([label]){min-width:52px;min-width:44px;width:56px}:host([readonly]) [part=toggle]{cursor:default;background-color:rgba(0,0,0,0);border-color:#eceef4}:host([disabled]) [part=toggle]{opacity:.5;background-color:#eceef4;border-color:#eceef4}:host([checked]) [part=toggle]::after{left:auto;border-color:#2336fd;background-color:#2336fd;right:1px}:host{touch-action:manipulation;font-size:12px;background-color:#f6f7f9;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;outline:0;box-shadow:inset 0 0 0 rgba(0,0,0,.25);transition:box-shadow .1s,border-color .1s;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:44px;height:24px;font-weight:420;line-height:18px;text-transform:uppercase;text-transform:none;border-radius:10000px;color:#141e29}:host([checked-label][checked]) [part=toggle],:host([label][checked]) [part=toggle]{padding-right:24px;padding-left:3px}:host([checked-label]) [part=toggle],:host([label]) [part=toggle]{padding:3px 3px 3px 24px}:host([checked-label]) [part=toggle]::after,:host([label]) [part=toggle]::after{width:20px}:host(:hover:not([readonly])){background-color:#eceef4}:host([disabled]){color:#9ca7b4}:host([disabled]) [part=toggle]::after{background-color:#9ca7b4;border-color:#9ca7b4}:host([readonly]) [part=toggle]::after{background-color:#141e29;border-color:#141e29}:host([checked]:not([readonly])){background-color:#141e29}:host([checked]:not([readonly])) [part=toggle]::after{background-color:#f6f7f9}:host([checked]:not([readonly])) [part=toggle]{color:#fff;border-color:#141e29}@media (pointer:fine){:host(:hover:not([readonly])),:host([focused=visible]){box-shadow:0 0 0 #2336fd}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-color:#2336fd}:host(:hover:not([readonly])){color:#141e29}:host(:hover:not([readonly])) [part=toggle]{border-color:#424c58}:host(:hover:not([readonly])) [part=toggle]::after{background-color:#424c58;border-color:#424c58}:host(:hover:not([readonly])[checked]){background-color:#424c58}:host(:hover:not([readonly])[checked]) [part=toggle]{border-color:#424c58}:host(:hover:not([readonly])[checked]) [part=toggle]::after{background-color:#f6f7f9;border-color:#f6f7f9}}' }}));
1
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-toggle', styles: ':host [part=toggle]{cursor:pointer;display:block;position:relative;width:100%;height:100%;box-sizing:border-box;border:1px solid #c0cadb;border-radius:inherit;text-overflow:inherit;overflow:inherit}:host [part=toggle]::after{content:\'\';position:absolute;box-sizing:border-box;border-radius:inherit;top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-color:#505b67;border-color:#505b67}:host([readonly]) [part=toggle]{cursor:default;background-color:rgba(0,0,0,0);border-color:#eceef4}:host([disabled]) [part=toggle]{opacity:.5;background-color:#eceef4;border-color:#eceef4}:host([checked]) [part=toggle]::after{left:auto;border-color:#2336fd;background-color:#2336fd;right:1px}:host{touch-action:manipulation;font-size:12px;background-color:#f6f7f9;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;outline:0;box-shadow:inset 0 0 0 rgba(0,0,0,.25);transition:box-shadow .1s,border-color .1s;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:44px;height:24px;font-weight:420;line-height:18px;text-transform:uppercase;text-transform:none;border-radius:10000px;color:#141e29}:host([checked-label]),:host([label]){min-width:44px;width:56px}:host([checked-label][checked]) [part=toggle],:host([label][checked]) [part=toggle]{padding-right:24px;padding-left:3px}:host([checked-label]) [part=toggle],:host([label]) [part=toggle]{padding:3px 3px 3px 24px}:host([checked-label]) [part=toggle]::after,:host([label]) [part=toggle]::after{width:20px}:host(:hover:not([readonly])){background-color:#eceef4}:host([disabled]){color:#9ca7b4}:host([disabled]) [part=toggle]::after{background-color:#9ca7b4;border-color:#9ca7b4}:host([readonly]) [part=toggle]::after{background-color:#141e29;border-color:#141e29}:host([checked]:not([readonly])){background-color:#141e29}:host([checked]:not([readonly])) [part=toggle]::after{background-color:#f6f7f9}:host([checked]:not([readonly])) [part=toggle]{color:#fff;border-color:#141e29}@media (pointer:fine){:host(:hover:not([readonly])),:host([focused=visible]){box-shadow:0 0 0 #2336fd}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-color:#2336fd}:host(:hover:not([readonly])){color:#141e29}:host(:hover:not([readonly])) [part=toggle]{border-color:#424c58}:host(:hover:not([readonly])) [part=toggle]::after{background-color:#424c58;border-color:#424c58}:host(:hover:not([readonly])[checked]){background-color:#424c58}:host(:hover:not([readonly])[checked]) [part=toggle]{border-color:#424c58}:host(:hover:not([readonly])[checked]) [part=toggle]::after{background-color:#f6f7f9;border-color:#f6f7f9}}' }}));
package/lib/toggle/themes/halo/dark/index.js CHANGED
@@ -1 +1 @@
1
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-toggle', styles: ':host{touch-action:manipulation;font-size:12px;background-color:#0d0d0d;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;outline:0;border-radius:0;box-shadow:inset 0 0 0 rgba(0,0,0,.5);transition:box-shadow .1s,border-color .1s;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:44px;height:24px;font-weight:400;color:#ccc;line-height:18px;text-transform:uppercase}:host [part=toggle]{cursor:pointer;display:block;position:relative;width:100%;height:100%;box-sizing:border-box;border:1px solid #4d4d4d;border-radius:inherit;text-overflow:inherit;overflow:inherit}:host [part=toggle]::after{content:\'\';position:absolute;box-sizing:border-box;border-radius:inherit;top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-color:#ccc}:host([checked-label]),:host([label]){min-width:52px;width:54px;min-width:44px}:host([readonly]) [part=toggle]{cursor:default}:host([disabled]) [part=toggle]{opacity:.5}:host([checked]) [part=toggle]::after{left:auto;border-color:#334bff;background-color:#334bff;right:1px}:host([checked-label][checked]) [part=toggle],:host([label][checked]) [part=toggle]{padding-right:24px;padding-left:3px}:host([checked-label]) [part=toggle],:host([label]) [part=toggle]{padding:3px 3px 3px 24px}:host([checked-label]) [part=toggle]::after,:host([label]) [part=toggle]::after{width:20px}@media (pointer:fine){:host(:hover:not([readonly])),:host([focused=visible]){box-shadow:0 0 0 #334bff}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-color:#334bff}:host(:hover:not([readonly])){color:#fff}:host(:hover:not([readonly])) [part=toggle]{border-color:#1429bd}:host(:hover:not([readonly])) [part=toggle]::after{background-color:#1429bd;border-color:#1429bd}}:host([checked]){color:#fff}:host([disabled]) [part=toggle]::after{opacity:.2}:host [part=toggle]::after,:host([checked]) [part=toggle]::after{border:1px solid #0d0d0d}' }}));
1
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-toggle', styles: ':host{touch-action:manipulation;font-size:12px;background-color:#0d0d0d;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;outline:0;border-radius:0;box-shadow:inset 0 0 0 rgba(0,0,0,.5);transition:box-shadow .1s,border-color .1s;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:44px;height:24px;font-weight:400;color:#ccc;line-height:18px;text-transform:uppercase}:host [part=toggle]{cursor:pointer;display:block;position:relative;width:100%;height:100%;box-sizing:border-box;border:1px solid #4d4d4d;border-radius:inherit;text-overflow:inherit;overflow:inherit}:host [part=toggle]::after{content:\'\';position:absolute;box-sizing:border-box;border-radius:inherit;top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-color:#ccc}:host([readonly]) [part=toggle]{cursor:default}:host([disabled]) [part=toggle]{opacity:.5}:host([checked]) [part=toggle]::after{left:auto;border-color:#334bff;background-color:#334bff;right:1px}:host([checked-label]),:host([label]){width:54px;min-width:44px}:host([checked-label][checked]) [part=toggle],:host([label][checked]) [part=toggle]{padding-right:24px;padding-left:3px}:host([checked-label]) [part=toggle],:host([label]) [part=toggle]{padding:3px 3px 3px 24px}:host([checked-label]) [part=toggle]::after,:host([label]) [part=toggle]::after{width:20px}@media (pointer:fine){:host(:hover:not([readonly])),:host([focused=visible]){box-shadow:0 0 0 #334bff}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-color:#334bff}:host(:hover:not([readonly])){color:#fff}:host(:hover:not([readonly])) [part=toggle]{border-color:#1429bd}:host(:hover:not([readonly])) [part=toggle]::after{background-color:#1429bd;border-color:#1429bd}}:host([checked]){color:#fff}:host([disabled]) [part=toggle]::after{opacity:.2}:host [part=toggle]::after,:host([checked]) [part=toggle]::after{border:1px solid #0d0d0d}' }}));
package/lib/toggle/themes/halo/light/index.js CHANGED
@@ -1 +1 @@
1
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-toggle', styles: ':host{touch-action:manipulation;font-size:12px;background-color:#fff;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;outline:0;border-radius:0;box-shadow:inset 0 0 0 rgba(0,0,0,.25);transition:box-shadow .1s,border-color .1s;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:44px;height:24px;font-weight:600;color:#0d0d0d;line-height:18px;text-transform:uppercase}:host [part=toggle]{cursor:pointer;display:block;position:relative;width:100%;height:100%;box-sizing:border-box;border:1px solid #ccc;border-radius:inherit;text-overflow:inherit;overflow:inherit}:host [part=toggle]::after{content:\'\';position:absolute;box-sizing:border-box;border-radius:inherit;top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-color:#0d0d0d}:host([checked-label]),:host([label]){min-width:52px;width:54px;min-width:44px}:host([readonly]) [part=toggle]{cursor:default}:host([disabled]) [part=toggle]{opacity:.5}:host([checked]) [part=toggle]::after{left:auto;border-color:#334bff;background-color:#334bff;right:1px}:host([checked-label][checked]) [part=toggle],:host([label][checked]) [part=toggle]{padding-right:24px;padding-left:3px}:host([checked-label]) [part=toggle],:host([label]) [part=toggle]{padding:3px 3px 3px 24px}:host([checked-label]) [part=toggle]::after,:host([label]) [part=toggle]::after{width:20px}@media (pointer:fine){:host(:hover:not([readonly])),:host([focused=visible]){box-shadow:0 0 0 #334bff}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-color:#334bff}:host(:hover:not([readonly])){color:#0d0d0d}:host(:hover:not([readonly])) [part=toggle]{border-color:#1429bd}:host(:hover:not([readonly])) [part=toggle]::after{background-color:#1429bd;border-color:#1429bd}}' }}));
1
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-toggle', styles: ':host{touch-action:manipulation;font-size:12px;background-color:#fff;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;outline:0;border-radius:0;box-shadow:inset 0 0 0 rgba(0,0,0,.25);transition:box-shadow .1s,border-color .1s;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:44px;height:24px;font-weight:600;color:#0d0d0d;line-height:18px;text-transform:uppercase}:host [part=toggle]{cursor:pointer;display:block;position:relative;width:100%;height:100%;box-sizing:border-box;border:1px solid #ccc;border-radius:inherit;text-overflow:inherit;overflow:inherit}:host [part=toggle]::after{content:\'\';position:absolute;box-sizing:border-box;border-radius:inherit;top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-color:#0d0d0d}:host([readonly]) [part=toggle]{cursor:default}:host([disabled]) [part=toggle]{opacity:.5}:host([checked]) [part=toggle]::after{left:auto;border-color:#334bff;background-color:#334bff;right:1px}:host([checked-label]),:host([label]){width:54px;min-width:44px}:host([checked-label][checked]) [part=toggle],:host([label][checked]) [part=toggle]{padding-right:24px;padding-left:3px}:host([checked-label]) [part=toggle],:host([label]) [part=toggle]{padding:3px 3px 3px 24px}:host([checked-label]) [part=toggle]::after,:host([label]) [part=toggle]::after{width:20px}@media (pointer:fine){:host(:hover:not([readonly])),:host([focused=visible]){box-shadow:0 0 0 #334bff}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-color:#334bff}:host(:hover:not([readonly])){color:#0d0d0d}:host(:hover:not([readonly])) [part=toggle]{border-color:#1429bd}:host(:hover:not([readonly])) [part=toggle]::after{background-color:#1429bd;border-color:#1429bd}}' }}));
package/lib/toggle/themes/solar/charcoal/index.js CHANGED
@@ -1 +1 @@
1
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-toggle', styles: ':host{touch-action:manipulation;font-size:13px;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;outline:0;border-radius:0;box-shadow:inset 0 0 0 rgba(0,0,0,.6);transition:box-shadow .2s,border-color .2s;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:44px;height:24px;color:#e2e2e2;background-color:#000;line-height:18px}:host [part=toggle]{cursor:pointer;display:block;position:relative;width:100%;height:100%;box-sizing:border-box;border:1px solid #4a4a52;border-radius:inherit;text-overflow:inherit;overflow:inherit}:host [part=toggle]::after{content:\'\';position:absolute;top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-color:#555d6c;box-sizing:border-box;border-radius:inherit}:host([checked-label]),:host([label]){width:67.6px;min-width:52px;min-width:44px}:host([readonly]) [part=toggle]{cursor:default}:host([disabled]) [part=toggle]{opacity:.5}:host([checked]) [part=toggle]::after{right:1px;left:auto;border-color:#f93;background-color:#f93}@media (pointer:fine){:host(:hover:not([readonly])),:host([focused=visible]){box-shadow:0 0 0 #f93}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-color:#f93}}:host [part=toggle] ::after{top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-image:linear-gradient(rgba(255,255,255,.1) 10%,rgba(255,255,255,0) 100%)}:host([checked-label][checked]) [part=toggle],:host([label][checked]) [part=toggle]{padding-right:24px;padding-left:3px}:host([checked-label]) [part=toggle],:host([label]) [part=toggle]{padding:3px 3px 3px 24px}:host([checked-label]) [part=toggle]::after,:host([label]) [part=toggle]::after{width:20px}:host([checked]) [part=toggle] ::after{right:1px}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-style:dotted}' }}));
1
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-toggle', styles: ':host{touch-action:manipulation;font-size:13px;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;outline:0;border-radius:0;box-shadow:inset 0 0 0 rgba(0,0,0,.6);transition:box-shadow .2s,border-color .2s;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:44px;height:24px;color:#e2e2e2;background-color:#000;line-height:18px}:host [part=toggle]{cursor:pointer;display:block;position:relative;width:100%;height:100%;box-sizing:border-box;border:1px solid #4a4a52;border-radius:inherit;text-overflow:inherit;overflow:inherit}:host [part=toggle]::after{content:\'\';position:absolute;top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-color:#555d6c;box-sizing:border-box;border-radius:inherit}:host([checked-label]),:host([label]){width:67.6px;min-width:44px}:host([readonly]) [part=toggle]{cursor:default}:host([disabled]) [part=toggle]{opacity:.5}:host([checked]) [part=toggle]::after{right:1px;left:auto;border-color:#f93;background-color:#f93}@media (pointer:fine){:host(:hover:not([readonly])),:host([focused=visible]){box-shadow:0 0 0 #f93}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-color:#f93}}:host [part=toggle] ::after{top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-image:linear-gradient(rgba(255,255,255,.1) 10%,rgba(255,255,255,0) 100%)}:host([checked-label][checked]) [part=toggle],:host([label][checked]) [part=toggle]{padding-right:24px;padding-left:3px}:host([checked-label]) [part=toggle],:host([label]) [part=toggle]{padding:3px 3px 3px 24px}:host([checked-label]) [part=toggle]::after,:host([label]) [part=toggle]::after{width:20px}:host([checked]) [part=toggle] ::after{right:1px}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-style:dotted}' }}));
package/lib/toggle/themes/solar/pearl/index.js CHANGED
@@ -1 +1 @@
1
- dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-toggle', styles: ':host{touch-action:manipulation;font-size:13px;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;outline:0;border-radius:0;box-shadow:inset 0 0 0 rgba(0,0,0,.3);transition:box-shadow .2s,border-color .2s;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:44px;height:24px;color:#484848;background-color:#fff;line-height:18px}:host [part=toggle]{cursor:pointer;display:block;position:relative;width:100%;height:100%;box-sizing:border-box;border:1px solid #a9afba;border-radius:inherit;text-overflow:inherit;overflow:inherit}:host [part=toggle]::after{content:\'\';position:absolute;top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-color:#d4d7dd;box-sizing:border-box;border-radius:inherit}:host([checked-label]),:host([label]){width:67.6px;min-width:52px;min-width:44px}:host([readonly]) [part=toggle]{cursor:default}:host([disabled]) [part=toggle]{opacity:.5}:host([checked]) [part=toggle]::after{right:1px;left:auto;border-color:#f93;background-color:#f93}@media (pointer:fine){:host(:hover:not([readonly])),:host([focused=visible]){box-shadow:0 0 0 #ffb266}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-color:#ffb266}}:host [part=toggle] ::after{top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-image:linear-gradient(rgba(0,0,0,0) 0,rgba(0,0,0,.1) 100%)}:host([checked-label][checked]) [part=toggle],:host([label][checked]) [part=toggle]{padding-right:24px;padding-left:3px}:host([checked-label]) [part=toggle],:host([label]) [part=toggle]{padding:3px 3px 3px 24px}:host([checked-label]) [part=toggle]::after,:host([label]) [part=toggle]::after{width:20px}:host([checked]) [part=toggle] ::after{right:1px}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-style:dotted}' }}));
1
+ dispatchEvent(new CustomEvent('ef.customStyles.define', { detail: { name: 'ef-toggle', styles: ':host{touch-action:manipulation;font-size:13px;text-align:center;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;outline:0;border-radius:0;box-shadow:inset 0 0 0 rgba(0,0,0,.3);transition:box-shadow .2s,border-color .2s;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:44px;height:24px;color:#484848;background-color:#fff;line-height:18px}:host [part=toggle]{cursor:pointer;display:block;position:relative;width:100%;height:100%;box-sizing:border-box;border:1px solid #a9afba;border-radius:inherit;text-overflow:inherit;overflow:inherit}:host [part=toggle]::after{content:\'\';position:absolute;top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-color:#d4d7dd;box-sizing:border-box;border-radius:inherit}:host([checked-label]),:host([label]){width:67.6px;min-width:44px}:host([readonly]) [part=toggle]{cursor:default}:host([disabled]) [part=toggle]{opacity:.5}:host([checked]) [part=toggle]::after{right:1px;left:auto;border-color:#f93;background-color:#f93}@media (pointer:fine){:host(:hover:not([readonly])),:host([focused=visible]){box-shadow:0 0 0 #ffb266}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-color:#ffb266}}:host [part=toggle] ::after{top:1px;left:1px;width:calc(50% - 1px);height:calc(100% - (1px * 2));background-image:linear-gradient(rgba(0,0,0,0) 0,rgba(0,0,0,.1) 100%)}:host([checked-label][checked]) [part=toggle],:host([label][checked]) [part=toggle]{padding-right:24px;padding-left:3px}:host([checked-label]) [part=toggle],:host([label]) [part=toggle]{padding:3px 3px 3px 24px}:host([checked-label]) [part=toggle]::after,:host([label]) [part=toggle]::after{width:20px}:host([checked]) [part=toggle] ::after{right:1px}:host(:hover:not([readonly])) [part=toggle],:host([focused=visible]) [part=toggle]{border-style:dotted}' }}));