smart-webcomponents-react 19.0.0 → 19.0.5

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 (334) hide show
  1. package/chart/ganttchart.d.ts +1 -1
  2. package/ganttchart/ganttchart.d.ts +1 -1
  3. package/ganttchart/ganttchart.esm.js +3 -3
  4. package/ganttchart/ganttchart.umd.js +3 -3
  5. package/index.d.ts +1 -2
  6. package/package.json +1 -1
  7. package/source/modules/smart.3dchart.js +1 -1
  8. package/source/modules/smart.accordion.js +1 -1
  9. package/source/modules/smart.array.js +1 -1
  10. package/source/modules/smart.barcode.js +1 -1
  11. package/source/modules/smart.breadcrumb.js +1 -1
  12. package/source/modules/smart.button.js +1 -1
  13. package/source/modules/smart.buttongroup.js +1 -1
  14. package/source/modules/smart.calendar.js +1 -1
  15. package/source/modules/smart.card.js +1 -1
  16. package/source/modules/smart.cardview.js +3 -3
  17. package/source/modules/smart.carousel.js +1 -1
  18. package/source/modules/smart.chart.js +2 -2
  19. package/source/modules/smart.checkbox.js +1 -1
  20. package/source/modules/smart.checkinput.js +1 -1
  21. package/source/modules/smart.chip.js +1 -1
  22. package/source/modules/smart.colorinput.js +1 -1
  23. package/source/modules/smart.colorpanel.js +1 -1
  24. package/source/modules/smart.colorpicker.js +1 -1
  25. package/source/modules/smart.combobox.js +1 -1
  26. package/source/modules/smart.common.js +2 -2
  27. package/source/modules/smart.countryinput.js +1 -1
  28. package/source/modules/smart.dateinput.js +1 -1
  29. package/source/modules/smart.daterangeinput.js +1 -1
  30. package/source/modules/smart.datetimepicker.js +1 -1
  31. package/source/modules/smart.dockinglayout.js +1 -1
  32. package/source/modules/smart.dropdownbutton.js +1 -1
  33. package/source/modules/smart.dropdownlist.js +1 -1
  34. package/source/modules/smart.editor.js +2 -2
  35. package/source/modules/smart.element.js +1 -1
  36. package/source/modules/smart.fileupload.js +1 -1
  37. package/source/modules/smart.form.js +1 -1
  38. package/source/modules/smart.formulaparser.js +1 -1
  39. package/source/modules/smart.ganttchart.js +4 -4
  40. package/source/modules/smart.gauge.js +1 -1
  41. package/source/modules/smart.grid.js +8 -8
  42. package/source/modules/smart.gridpanel.js +3 -3
  43. package/source/modules/smart.input.js +1 -1
  44. package/source/modules/smart.kanban.js +3 -3
  45. package/source/modules/smart.layout.js +1 -1
  46. package/source/modules/smart.led.js +1 -1
  47. package/source/modules/smart.listbox.js +1 -1
  48. package/source/modules/smart.listmenu.js +1 -1
  49. package/source/modules/smart.map.js +1 -1
  50. package/source/modules/smart.maskedtextbox.js +1 -1
  51. package/source/modules/smart.menu.js +1 -1
  52. package/source/modules/smart.multicomboinput.js +1 -1
  53. package/source/modules/smart.multiinput.js +1 -1
  54. package/source/modules/smart.multilinetextbox.js +1 -1
  55. package/source/modules/smart.multisplitbutton.js +1 -1
  56. package/source/modules/smart.numberinput.js +1 -1
  57. package/source/modules/smart.numerictextbox.js +1 -1
  58. package/source/modules/smart.pager.js +1 -1
  59. package/source/modules/smart.passwordinput.js +1 -1
  60. package/source/modules/smart.passwordtextbox.js +1 -1
  61. package/source/modules/smart.path.js +1 -1
  62. package/source/modules/smart.phoneinput.js +1 -1
  63. package/source/modules/smart.pivottable.js +3 -3
  64. package/source/modules/smart.progressbar.js +1 -1
  65. package/source/modules/smart.qrcode.js +1 -1
  66. package/source/modules/smart.querybuilder.js +1 -1
  67. package/source/modules/smart.radiobutton.js +1 -1
  68. package/source/modules/smart.rating.js +1 -1
  69. package/source/modules/smart.ribbon.js +1 -1
  70. package/source/modules/smart.router.js +2 -2
  71. package/source/modules/smart.scheduler.js +2 -2
  72. package/source/modules/smart.scrollbar.js +1 -1
  73. package/source/modules/smart.slider.js +1 -1
  74. package/source/modules/smart.sortable.js +1 -1
  75. package/source/modules/smart.splitter.js +1 -1
  76. package/source/modules/smart.switchbutton.js +1 -1
  77. package/source/modules/smart.table.js +3 -3
  78. package/source/modules/smart.tabs.js +1 -1
  79. package/source/modules/smart.tank.js +1 -1
  80. package/source/modules/smart.textarea.js +1 -1
  81. package/source/modules/smart.textbox.js +1 -1
  82. package/source/modules/smart.timeinput.js +1 -1
  83. package/source/modules/smart.timepicker.js +1 -1
  84. package/source/modules/smart.toast.js +1 -1
  85. package/source/modules/smart.tooltip.js +1 -1
  86. package/source/modules/smart.tree.js +1 -1
  87. package/source/modules/smart.validator.js +1 -1
  88. package/source/modules/smart.window.js +1 -1
  89. package/source/smart.3dchart.js +1 -1
  90. package/source/smart.accordion.js +1 -1
  91. package/source/smart.ajax.js +1 -1
  92. package/source/smart.array.js +1 -1
  93. package/source/smart.barcode.js +1 -1
  94. package/source/smart.bootstrap.js +1 -1
  95. package/source/smart.breadcrumb.js +1 -1
  96. package/source/smart.button.js +1 -1
  97. package/source/smart.buttongroup.js +1 -1
  98. package/source/smart.calendar.js +1 -1
  99. package/source/smart.card.js +1 -1
  100. package/source/smart.cardview.js +1 -1
  101. package/source/smart.carousel.js +1 -1
  102. package/source/smart.chart.annotations.js +1 -1
  103. package/source/smart.chart.api.js +1 -1
  104. package/source/smart.chart.core.js +1 -1
  105. package/source/smart.chart.js +1 -1
  106. package/source/smart.chart.rangeselector.js +1 -1
  107. package/source/smart.chart.waterfall.js +1 -1
  108. package/source/smart.checkbox.js +1 -1
  109. package/source/smart.checkinput.js +1 -1
  110. package/source/smart.chip.js +1 -1
  111. package/source/smart.colorinput.js +1 -1
  112. package/source/smart.colorpanel.js +1 -1
  113. package/source/smart.colorpicker.js +1 -1
  114. package/source/smart.combobox.js +1 -1
  115. package/source/smart.complex.js +1 -1
  116. package/source/smart.core.js +1 -1
  117. package/source/smart.countryinput.js +1 -1
  118. package/source/smart.data.js +2 -2
  119. package/source/smart.date.js +1 -1
  120. package/source/smart.dateformatpanel.js +1 -1
  121. package/source/smart.dateinput.js +1 -1
  122. package/source/smart.daterangeinput.js +1 -1
  123. package/source/smart.datetimepicker.js +1 -1
  124. package/source/smart.dockinglayout.js +1 -1
  125. package/source/smart.draw.js +1 -1
  126. package/source/smart.dropdownbutton.js +1 -1
  127. package/source/smart.dropdownlist.js +1 -1
  128. package/source/smart.editor.js +2 -2
  129. package/source/smart.element.js +1 -1
  130. package/source/smart.elements.js +10 -10
  131. package/source/smart.export.js +1 -1
  132. package/source/smart.fileupload.js +1 -1
  133. package/source/smart.filter.js +1 -1
  134. package/source/smart.filterbuilder.js +1 -1
  135. package/source/smart.filterpanel.js +1 -1
  136. package/source/smart.form.js +1 -1
  137. package/source/smart.format.js +1 -1
  138. package/source/smart.formulaparser.js +1 -1
  139. package/source/smart.ganttchart.js +2 -2
  140. package/source/smart.gauge.js +1 -1
  141. package/source/smart.grid.cell.js +1 -1
  142. package/source/smart.grid.chart.js +1 -1
  143. package/source/smart.grid.column.js +1 -1
  144. package/source/smart.grid.core.js +2 -2
  145. package/source/smart.grid.dialog.js +2 -2
  146. package/source/smart.grid.edit.js +2 -2
  147. package/source/smart.grid.export.js +1 -1
  148. package/source/smart.grid.filter.js +1 -1
  149. package/source/smart.grid.group.js +1 -1
  150. package/source/smart.grid.js +1 -1
  151. package/source/smart.grid.menu.js +1 -1
  152. package/source/smart.grid.pager.js +1 -1
  153. package/source/smart.grid.reorder.js +1 -1
  154. package/source/smart.grid.resize.js +1 -1
  155. package/source/smart.grid.row.js +2 -2
  156. package/source/smart.grid.select.js +1 -1
  157. package/source/smart.grid.sort.js +2 -2
  158. package/source/smart.grid.toolbar.js +1 -1
  159. package/source/smart.grid.tree.js +1 -1
  160. package/source/smart.grid.view.js +1 -1
  161. package/source/smart.gridpanel.js +2 -2
  162. package/source/smart.input.js +1 -1
  163. package/source/smart.kanban.js +1 -1
  164. package/source/smart.layout.js +1 -1
  165. package/source/smart.led.js +1 -1
  166. package/source/smart.listbox.js +1 -1
  167. package/source/smart.listmenu.js +1 -1
  168. package/source/smart.map.js +1 -1
  169. package/source/smart.maskedtextbox.js +1 -1
  170. package/source/smart.math.js +1 -1
  171. package/source/smart.menu.js +1 -1
  172. package/source/smart.multicomboinput.js +1 -1
  173. package/source/smart.multiinput.js +1 -1
  174. package/source/smart.multilinetextbox.js +1 -1
  175. package/source/smart.multisplitbutton.js +1 -1
  176. package/source/smart.numberformatpanel.js +1 -1
  177. package/source/smart.numberinput.js +1 -1
  178. package/source/smart.numeric.js +1 -1
  179. package/source/smart.numerictextbox.js +1 -1
  180. package/source/smart.pager.js +1 -1
  181. package/source/smart.passwordinput.js +1 -1
  182. package/source/smart.passwordtextbox.js +1 -1
  183. package/source/smart.path.js +1 -1
  184. package/source/smart.phoneinput.js +1 -1
  185. package/source/smart.pivottable.js +1 -1
  186. package/source/smart.powerbutton.js +1 -1
  187. package/source/smart.progressbar.js +1 -1
  188. package/source/smart.qrcode.js +1 -1
  189. package/source/smart.radiobutton.js +1 -1
  190. package/source/smart.rating.js +1 -1
  191. package/source/smart.ribbon.js +1 -1
  192. package/source/smart.router.js +1 -1
  193. package/source/smart.scheduler.js +1 -1
  194. package/source/smart.scrollbar.js +1 -1
  195. package/source/smart.slider.js +1 -1
  196. package/source/smart.sortable.js +1 -1
  197. package/source/smart.sparkline.js +1 -1
  198. package/source/smart.splitter.js +1 -1
  199. package/source/smart.switchbutton.js +1 -1
  200. package/source/smart.table.js +1 -1
  201. package/source/smart.tabs.js +1 -1
  202. package/source/smart.tank.js +1 -1
  203. package/source/smart.textarea.js +1 -1
  204. package/source/smart.textbox.js +1 -1
  205. package/source/smart.tickintervalhandler.js +1 -1
  206. package/source/smart.timeinput.js +1 -1
  207. package/source/smart.timepicker.js +1 -1
  208. package/source/smart.toast.js +1 -1
  209. package/source/smart.tooltip.js +1 -1
  210. package/source/smart.tree.js +1 -1
  211. package/source/smart.validationpanel.js +1 -1
  212. package/source/smart.validator.js +1 -1
  213. package/source/smart.window.js +1 -1
  214. package/source/styles/bootstrap/smart.bootstrap.blue.css +3369 -3372
  215. package/source/styles/bootstrap/smart.bootstrap.css +3369 -3372
  216. package/source/styles/bootstrap/smart.bootstrap.cyan.css +3369 -3372
  217. package/source/styles/bootstrap/smart.bootstrap.green.css +3369 -3372
  218. package/source/styles/bootstrap/smart.bootstrap.indigo.css +3369 -3372
  219. package/source/styles/bootstrap/smart.bootstrap.orange.css +3369 -3372
  220. package/source/styles/bootstrap/smart.bootstrap.pink.css +3369 -3372
  221. package/source/styles/bootstrap/smart.bootstrap.purple.css +3369 -3372
  222. package/source/styles/bootstrap/smart.bootstrap.red.css +3369 -3372
  223. package/source/styles/bootstrap/smart.bootstrap.teal.css +3369 -3372
  224. package/source/styles/bootstrap/smart.bootstrap.turquoise.css +3369 -3372
  225. package/source/styles/components/smart.array.css +1 -1
  226. package/source/styles/components/smart.calendar.css +2 -2
  227. package/source/styles/components/smart.cardview.css +2 -2
  228. package/source/styles/components/smart.checkinput.css +1 -1
  229. package/source/styles/components/smart.colorinput.css +1 -1
  230. package/source/styles/components/smart.columnpanel.css +1 -1
  231. package/source/styles/components/smart.countryinput.css +1 -1
  232. package/source/styles/components/smart.dateinput.css +2 -2
  233. package/source/styles/components/smart.daterangeinput.css +2 -2
  234. package/source/styles/components/smart.datetimeformatpanel.css +1 -1
  235. package/source/styles/components/smart.datetimepicker.css +1 -1
  236. package/source/styles/components/smart.editor.css +2 -2
  237. package/source/styles/components/smart.filterbuilder.css +2 -2
  238. package/source/styles/components/smart.filterpanel.css +1 -1
  239. package/source/styles/components/smart.ganttchart.css +2 -2
  240. package/source/styles/components/smart.grid.css +3 -3
  241. package/source/styles/components/smart.gridpanel.css +1 -1
  242. package/source/styles/components/smart.input.css +1 -1
  243. package/source/styles/components/smart.kanban.css +2 -2
  244. package/source/styles/components/smart.maskedtextbox.css +1 -1
  245. package/source/styles/components/smart.multicolumnfilterpanel.css +2 -2
  246. package/source/styles/components/smart.multicomboinput.css +1 -1
  247. package/source/styles/components/smart.multiinput.css +1 -1
  248. package/source/styles/components/smart.multilinetextbox.css +1 -1
  249. package/source/styles/components/smart.numberformatpanel.css +1 -1
  250. package/source/styles/components/smart.numberinput.css +1 -1
  251. package/source/styles/components/smart.pager.css +1 -1
  252. package/source/styles/components/smart.passwordinput.css +1 -1
  253. package/source/styles/components/smart.passwordtextbox.css +1 -1
  254. package/source/styles/components/smart.phoneinput.css +1 -1
  255. package/source/styles/components/smart.pivottable.css +1 -1
  256. package/source/styles/components/smart.querybuilder.css +3 -3
  257. package/source/styles/components/smart.ribbon.css +1 -1
  258. package/source/styles/components/smart.scheduler.css +2 -2
  259. package/source/styles/components/smart.sortpanel.css +1 -1
  260. package/source/styles/components/smart.table.css +1 -1
  261. package/source/styles/components/smart.textarea.css +1 -1
  262. package/source/styles/components/smart.textbox.css +1 -1
  263. package/source/styles/components/smart.timeinput.css +1 -1
  264. package/source/styles/components/smart.validationpanel.css +1 -1
  265. package/source/styles/components/smart.window.css +1 -1
  266. package/source/styles/default/scss/textbox/_multi-combo-input.scss +5 -0
  267. package/source/styles/default/smart.accordion.css +309 -309
  268. package/source/styles/default/smart.array.css +77 -77
  269. package/source/styles/default/smart.badge.css +50 -50
  270. package/source/styles/default/smart.barcode.css +3 -3
  271. package/source/styles/default/smart.breadcrumb.css +324 -324
  272. package/source/styles/default/smart.button.css +515 -515
  273. package/source/styles/default/smart.calendar.css +742 -742
  274. package/source/styles/default/smart.card.css +53 -53
  275. package/source/styles/default/smart.chart.css +119 -119
  276. package/source/styles/default/smart.checkbox.css +148 -148
  277. package/source/styles/default/smart.chip.css +101 -101
  278. package/source/styles/default/smart.colorpanel.css +617 -617
  279. package/source/styles/default/smart.colorpicker.css +132 -132
  280. package/source/styles/default/smart.currencyformatpanel.css +71 -71
  281. package/source/styles/default/smart.dateformatpanel.css +105 -105
  282. package/source/styles/default/smart.datetimepicker.css +611 -611
  283. package/source/styles/default/smart.dockinglayout.css +748 -748
  284. package/source/styles/default/smart.dropdownbutton.css +257 -257
  285. package/source/styles/default/smart.editor.css +1528 -1527
  286. package/source/styles/default/smart.editors.css +150 -150
  287. package/source/styles/default/smart.fileupload.css +498 -498
  288. package/source/styles/default/smart.ganttchart.css +1594 -1594
  289. package/source/styles/default/smart.gauge.css +145 -145
  290. package/source/styles/default/smart.inputgroup.css +483 -483
  291. package/source/styles/default/smart.layout.css +465 -465
  292. package/source/styles/default/smart.layouts.css +483 -483
  293. package/source/styles/default/smart.led.css +144 -144
  294. package/source/styles/default/smart.link-button.css +321 -321
  295. package/source/styles/default/smart.listbox.css +564 -564
  296. package/source/styles/default/smart.listmenu.css +661 -661
  297. package/source/styles/default/smart.loader.css +203 -203
  298. package/source/styles/default/smart.maskedtextbox.css +27 -27
  299. package/source/styles/default/smart.multilinetextbox.css +190 -190
  300. package/source/styles/default/smart.multisplitbutton.css +225 -225
  301. package/source/styles/default/smart.numberformatpanel.css +72 -72
  302. package/source/styles/default/smart.numerictextbox.css +522 -522
  303. package/source/styles/default/smart.pager.css +253 -253
  304. package/source/styles/default/smart.passwordtextbox.css +129 -129
  305. package/source/styles/default/smart.path.css +581 -581
  306. package/source/styles/default/smart.pivottable.css +800 -800
  307. package/source/styles/default/smart.powerbutton.css +100 -100
  308. package/source/styles/default/smart.progressbar.css +501 -501
  309. package/source/styles/default/smart.qrcode.css +3 -3
  310. package/source/styles/default/smart.querybuilder.css +624 -623
  311. package/source/styles/default/smart.radiobutton.css +137 -137
  312. package/source/styles/default/smart.rating.css +17 -17
  313. package/source/styles/default/smart.scheduler.css +2789 -2789
  314. package/source/styles/default/smart.scrollbar.css +118 -118
  315. package/source/styles/default/smart.scrollviewer.css +109 -109
  316. package/source/styles/default/smart.slider.css +464 -464
  317. package/source/styles/default/smart.sortable.css +114 -114
  318. package/source/styles/default/smart.splitter.css +395 -395
  319. package/source/styles/default/smart.switchbutton.css +293 -293
  320. package/source/styles/default/smart.table.css +2025 -2025
  321. package/source/styles/default/smart.tabs.css +923 -923
  322. package/source/styles/default/smart.tank.css +661 -661
  323. package/source/styles/default/smart.textbox.css +3431 -3427
  324. package/source/styles/default/smart.timepicker.css +150 -150
  325. package/source/styles/default/smart.toast.css +252 -252
  326. package/source/styles/default/smart.toggle.css +175 -175
  327. package/source/styles/default/smart.tooltip.css +124 -124
  328. package/source/styles/default/smart.tree.css +783 -783
  329. package/source/styles/default/smart.validationpanel.css +116 -116
  330. package/source/styles/default/smart.window.css +829 -829
  331. package/source/styles/smart.default.css +4 -4
  332. package/source/styles/smart.fluent.css +3313 -3313
  333. package/source/typescript/smart.elements.d.ts +1 -2
  334. package/source/typescript/smart.ganttchart.d.ts +1 -2
package/source/styles/default/smart.splitter.css CHANGED
@@ -1,396 +1,396 @@
1
- /* .smart-splitter */
2
- smart-splitter {
3
- width: var(--smart-splitter-default-width);
4
- height: var(--smart-splitter-default-height);
5
- position: relative;
6
- /* Fixes the issue with the overflow and resize-container */
7
- }
8
- smart-splitter[dragged] {
9
- cursor: w-resize;
10
- }
11
- smart-splitter[orientation=horizontal][dragged] {
12
- cursor: s-resize;
13
- }
14
-
15
- smart-splitter-item > .smart-container {
16
- overflow: hidden;
17
- position: relative;
18
- padding: var(--smart-splitter-item-padding);
19
- }
20
-
21
- .smart-splitter smart-splitter-bar {
22
- min-width: 5px;
23
- width: var(--smart-splitter-bar-size);
24
- position: relative;
25
- user-select: none;
26
- overflow: hidden;
27
- touch-action: none;
28
- }
29
- .smart-splitter smart-splitter-bar > .smart-container {
30
- display: flex;
31
- align-items: center;
32
- justify-content: center;
33
- flex-direction: column-reverse;
34
- }
35
- .smart-splitter smart-splitter-bar.smart-element {
36
- background: var(--smart-surface);
37
- border-color: var(--smart-surface-color);
38
- color: var(--smart-surface-color);
39
- border-radius: initial;
40
- }
41
- .smart-splitter smart-splitter-bar[focus] .smart-splitter-resize-button > span,
42
- .smart-splitter smart-splitter-bar[focus] .smart-splitter-resize-button > span::before,
43
- .smart-splitter smart-splitter-bar[focus] .smart-splitter-resize-button > span::after {
44
- background-color: var(--smart-ui-state-color-active);
45
- border-color: var(--smart-ui-state-color-active);
46
- color: var(--smart-ui-state-color-active);
47
- }
48
- .smart-splitter smart-splitter-bar[focus].smart-element {
49
- outline: none;
50
- background: var(--smart-ui-state-active);
51
- color: var(--smart-ui-state-color-active);
52
- }
53
- .smart-splitter smart-splitter-bar[locked] .smart-splitter-resize-button > span {
54
- visibility: hidden;
55
- }
56
- .smart-splitter smart-splitter-bar[locked] .smart-splitter-resize-button > span:before, .smart-splitter smart-splitter-bar[locked] .smart-splitter-resize-button > span:after {
57
- content: none;
58
- }
59
- .smart-splitter smart-splitter-bar[locked][hover] {
60
- background-color: var(--smart-ui-state-hover);
61
- color: var(--smart-ui-state-color-hover);
62
- }
63
- .smart-splitter smart-splitter-bar[locked][focus] {
64
- background-color: var(--smart-ui-state-active);
65
- color: var(--smart-ui-state-color-active);
66
- }
67
- .smart-splitter smart-splitter-bar[show-near-button] .smart-splitter-near-collapse-button {
68
- visibility: visible;
69
- width: 100%;
70
- }
71
- .smart-splitter smart-splitter-bar[show-far-button] .smart-splitter-far-collapse-button {
72
- visibility: visible;
73
- width: 100%;
74
- }
75
- .smart-splitter smart-splitter-bar[item-collapsed] {
76
- cursor: initial;
77
- }
78
- .smart-splitter smart-splitter-bar[item-collapsed] > .smart-container {
79
- flex-direction: initial;
80
- }
81
- .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-resize-button {
82
- display: none;
83
- }
84
- .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-resize-button > span:before, .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-resize-button > span:after {
85
- content: initial;
86
- }
87
- .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-near-collapse-button > span,
88
- .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-far-collapse-button > span {
89
- transform: rotate(270deg);
90
- }
91
- .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-near-collapse-button.smart-visibility-hidden,
92
- .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-far-collapse-button.smart-visibility-hidden {
93
- width: initial;
94
- }
95
- .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-near-collapse-button > span {
96
- transform: translate(-50%, -50%) rotate(270deg);
97
- }
98
- .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-far-collapse-button > span {
99
- transform: translate(-50%, -50%) rotate(90deg);
100
- }
101
- .smart-splitter smart-splitter-item {
102
- overflow: hidden;
103
- }
104
- .smart-splitter smart-splitter-item > .smart-container > .smart-content {
105
- width: 100%;
106
- height: 100%;
107
- overflow: auto;
108
- padding: var(--smart-splitter-item-content-padding);
109
- }
110
- .smart-splitter smart-splitter-item.smart-element {
111
- background-color: inherit;
112
- color: inherit;
113
- border-radius: initial;
114
- }
115
- .smart-splitter smart-splitter-item[collapsed] {
116
- overflow: hidden;
117
- padding: initial;
118
- }
119
- .smart-splitter .smart-splitter {
120
- margin: 0;
121
- width: 100%;
122
- height: 100%;
123
- border: none;
124
- }
125
- .smart-splitter .smart-splitter smart-splitter-bar {
126
- background-color: var(--smart-primary);
127
- color: var(--smart-primary-color);
128
- }
129
- .smart-splitter > .smart-container {
130
- display: flex;
131
- position: relative;
132
- overflow: inherit;
133
- }
134
- .smart-splitter > .smart-container > smart-splitter-item {
135
- height: 100%;
136
- flex-shrink: 0;
137
- width: var(--smart-splitter-item-size);
138
- }
139
- .smart-splitter > .smart-container > smart-splitter-bar {
140
- flex-shrink: 0;
141
- height: var(--smart-splitter-bar-fit-size);
142
- }
143
- .smart-splitter > .smart-container > smart-splitter-bar[locked] {
144
- cursor: default;
145
- }
146
- .smart-splitter > .smart-container > .smart-splitter-bar-feedback {
147
- height: 100%;
148
- flex-shrink: 0;
149
- }
150
- .smart-splitter .smart-splitter-bar-feedback {
151
- min-width: 5px;
152
- width: var(--smart-splitter-bar-size);
153
- user-select: none;
154
- overflow: hidden;
155
- touch-action: none;
156
- position: absolute;
157
- background-color: var(--smart-ui-state-hover);
158
- color: var(--smart-ui-state-color-hover);
159
- opacity: 0.5;
160
- }
161
- .smart-splitter .smart-splitter-bar-feedback.limit-reached {
162
- background-color: var(--smart-error);
163
- }
164
- .smart-splitter .smart-splitter-resize-button {
165
- width: 100%;
166
- position: relative;
167
- font-family: var(--smart-font-family-icon);
168
- height: 40px;
169
- display: flex;
170
- justify-content: center;
171
- align-items: center;
172
- cursor: inherit;
173
- }
174
- .smart-splitter .smart-splitter-resize-button > span {
175
- width: 6px;
176
- height: 6px;
177
- border: 1px solid var(--smart-surface-color);
178
- background-color: var(--smart-surface-color);
179
- color: var(--smart-surface-color);
180
- border-radius: 50%;
181
- cursor: inherit;
182
- }
183
- .smart-splitter .smart-splitter-resize-button > span:before, .smart-splitter .smart-splitter-resize-button > span:after {
184
- position: absolute;
185
- transform: translate(-50%, -50%);
186
- content: "";
187
- width: 4px;
188
- height: 4px;
189
- border-radius: 50%;
190
- border: 1px solid var(--smart-surface-color);
191
- background-color: var(--smart-surface-color);
192
- color: var(--smart-surface-color);
193
- pointer-events: none;
194
- font-family: var(--smart-font-family-icon);
195
- }
196
- .smart-splitter .smart-splitter-resize-button > span:before {
197
- left: 50%;
198
- top: calc(50% - var(--smart-splitter-bar-size));
199
- }
200
- .smart-splitter .smart-splitter-resize-button > span:after {
201
- top: calc(50% + var(--smart-splitter-bar-size));
202
- left: 50%;
203
- }
204
- .smart-splitter .smart-splitter-near-collapse-button,
205
- .smart-splitter .smart-splitter-far-collapse-button {
206
- height: 20px;
207
- position: relative;
208
- font-family: var(--smart-font-family-icon);
209
- cursor: pointer;
210
- visibility: hidden;
211
- width: 0;
212
- }
213
- .smart-splitter .smart-splitter-near-collapse-button .smart-arrow,
214
- .smart-splitter .smart-splitter-far-collapse-button .smart-arrow {
215
- position: absolute;
216
- top: 50%;
217
- left: 50%;
218
- width: auto;
219
- height: auto;
220
- }
221
- .smart-splitter .smart-splitter-near-collapse-button .smart-arrow:after,
222
- .smart-splitter .smart-splitter-far-collapse-button .smart-arrow:after {
223
- content: var(--smart-icon-arrow-down);
224
- position: absolute;
225
- display: flex;
226
- align-items: center;
227
- justify-content: center;
228
- pointer-events: none;
229
- width: 100%;
230
- height: 100%;
231
- top: 0;
232
- line-height: normal;
233
- }
234
- .smart-splitter .smart-splitter-far-collapse-button > span {
235
- transform: translate(-50%, -50%) rotate(270deg);
236
- }
237
- .smart-splitter .smart-splitter-near-collapse-button .smart-arrow {
238
- transform: translate(-55%, -50%) rotate(90deg);
239
- }
240
- .smart-splitter:not([readonly]) > .smart-container > smart-splitter-bar[hover] {
241
- cursor: w-resize;
242
- }
243
- .smart-splitter:not([dragged]) > .smart-container > smart-splitter-bar:not([focus]) .smart-splitter-near-collapse-button,
244
- .smart-splitter:not([dragged]) > .smart-container > smart-splitter-bar:not([focus]) .smart-splitter-far-collapse-button {
245
- color: inherit;
246
- }
247
- .smart-splitter:not([dragged]) > .smart-container > smart-splitter-bar[hover]:not([item-collapsed]):not([focus]) .smart-splitter-near-collapse-button,
248
- .smart-splitter:not([dragged]) > .smart-container > smart-splitter-bar[hover]:not([item-collapsed]):not([focus]) .smart-splitter-far-collapse-button {
249
- color: var(--smart-ui-state-color-hover);
250
- }
251
- .smart-splitter:not([dragged]) smart-splitter-bar.smart-element, .smart-splitter:not([dragged]) smart-splitter-bar[hover] {
252
- background-color: var(--smart-ui-state-hover);
253
- border-color: var(--smart-ui-state-border-hover);
254
- color: var(--smart-ui-state-color-hover);
255
- }
256
- .smart-splitter:not([dragged]) smart-splitter-bar[hover]:not([item-collapsed]):not([focus]) .smart-splitter-resize-button span,
257
- .smart-splitter:not([dragged]) smart-splitter-bar[hover]:not([item-collapsed]):not([focus]) .smart-splitter-resize-button span:after,
258
- .smart-splitter:not([dragged]) smart-splitter-bar[hover]:not([item-collapsed]):not([focus]) .smart-splitter-resize-button span:before {
259
- background-color: var(--smart-ui-state-color-hover);
260
- border-color: var(--smart-ui-state-color-hover);
261
- color: var(--smart-ui-state-color-hover);
262
- }
263
- .smart-splitter:not([dragged]) smart-splitter-bar[focus] {
264
- background-color: var(--smart-ui-state-active);
265
- border-color: var(--smart-ui-state-border-active);
266
- color: var(--smart-ui-state-color-active);
267
- }
268
- .smart-splitter:not([dragged]) smart-splitter-bar[focus]:not([item-collapsed]) .smart-splitter-resize-button span,
269
- .smart-splitter:not([dragged]) smart-splitter-bar[focus]:not([item-collapsed]) .smart-splitter-resize-button span:after,
270
- .smart-splitter:not([dragged]) smart-splitter-bar[focus]:not([item-collapsed]) .smart-splitter-resize-button span:before {
271
- background-color: var(--smart-ui-state-color-active);
272
- border-color: var(--smart-ui-state-color-active);
273
- color: var(--smart-ui-state-color-active);
274
- }
275
- .smart-splitter:not([dragged]) smart-splitter-bar:not([item-collapsed]):not([focus]) .smart-splitter-near-collapse-button[hover],
276
- .smart-splitter:not([dragged]) smart-splitter-bar:not([item-collapsed]):not([focus]) .smart-splitter-far-collapse-button[hover] {
277
- color: var(--smart-ui-state-color-hover);
278
- }
279
- .smart-splitter[dragged] {
280
- cursor: w-resize;
281
- pointer-events: none;
282
- user-select: none;
283
- touch-action: none;
284
- }
285
- .smart-splitter[dragged]:not([animation=none]) > .smart-container > smart-splitter-item {
286
- transition: none;
287
- }
288
- .smart-splitter[auto-fit-mode=overflow] > .smart-container {
289
- overflow: auto;
290
- }
291
- .smart-splitter[orientation=horizontal] > .smart-container {
292
- flex-direction: column;
293
- }
294
- .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-item {
295
- width: 100%;
296
- height: var(--smart-splitter-item-size);
297
- }
298
- .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar {
299
- width: var(--smart-splitter-bar-fit-size);
300
- min-height: 5px;
301
- height: var(--smart-splitter-bar-size);
302
- }
303
- .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar > .smart-container {
304
- flex-direction: row;
305
- }
306
- .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-near-collapse-button,
307
- .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-far-collapse-button {
308
- width: 0;
309
- height: 100%;
310
- }
311
- .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-far-collapse-button > span {
312
- transform: translate(-50%, -45%) rotate(0deg);
313
- }
314
- .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-near-collapse-button > span {
315
- transform: translate(-50%, -50%) rotate(180deg);
316
- }
317
- .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-resize-button {
318
- width: 20px;
319
- height: 100%;
320
- }
321
- .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-resize-button > span:before {
322
- left: calc(50% - var(--smart-splitter-bar-size));
323
- top: 50%;
324
- }
325
- .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-resize-button > span:after {
326
- top: 50%;
327
- left: calc(50% + var(--smart-splitter-bar-size));
328
- }
329
- .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar[item-collapsed] .smart-splitter-far-collapse-button > span {
330
- transform: translate(-50%, -50%) rotate(180deg);
331
- }
332
- .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar[item-collapsed] .smart-splitter-near-collapse-button > span {
333
- transform: translate(-50%, -50%) rotate(0deg);
334
- }
335
- .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar[show-near-button] .smart-splitter-near-collapse-button, .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar[show-far-button] .smart-splitter-far-collapse-button {
336
- width: 20px;
337
- height: 100%;
338
- }
339
- .smart-splitter[orientation=horizontal] > .smart-container > .smart-splitter-bar-feedback {
340
- width: 100%;
341
- min-height: 5px;
342
- height: var(--smart-splitter-bar-size);
343
- }
344
- .smart-splitter[orientation=horizontal] smart-splitter-item[collapsed] {
345
- min-width: 0;
346
- min-height: 0;
347
- }
348
- .smart-splitter[orientation=horizontal]:not([resize-mode=none]):not([readonly]) > .smart-container > smart-splitter-bar[hover]:not([locked]) {
349
- cursor: s-resize;
350
- }
351
- .smart-splitter[orientation=horizontal][dragged] {
352
- cursor: s-resize;
353
- }
354
- .smart-splitter[resize-mode=none] > .smart-container > smart-splitter-bar {
355
- cursor: default;
356
- }
357
- .smart-splitter[disabled] > .smart-container > smart-splitter-bar {
358
- cursor: default;
359
- outline: none;
360
- border: none;
361
- box-shadow: none;
362
- }
363
- .smart-splitter[orientation][disabled] > .smart-container > smart-splitter-bar {
364
- cursor: default;
365
- }
366
- .smart-splitter[dragging-not-allowed] > .smart-container > smart-splitter-bar,
367
- .smart-splitter[dragging-not-allowed] > .smart-container > .smart-splitter-bar-feedback {
368
- cursor: default;
369
- }
370
- .smart-splitter:not([animation=none]) .smart-splitter-near-collapse-button .smart-arrow,
371
- .smart-splitter:not([animation=none]) .smart-splitter-far-collapse-button .smart-arrow {
372
- transition: transform 0.2s ease-out;
373
- }
374
- .smart-splitter:not([animation=none]) > .smart-container > smart-splitter-item.animate {
375
- transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
376
- }
377
- .smart-splitter[orientation-change]:not([animation=none]) > .smart-container > smart-splitter-item {
378
- transition: none;
379
- }
380
- .smart-splitter[show-locked-items] > .smart-container > smart-splitter-item[locked] > .smart-container:after {
381
- position: absolute;
382
- content: var(--smart-icon-lock);
383
- font-family: var(--smart-font-family-icon);
384
- opacity: 0.25;
385
- font-size: calc(2.5 * var(--smart-splitter-font-size));
386
- top: 50%;
387
- left: 50%;
388
- transform: translate(-50%, -50%);
389
- }
390
-
391
- .smart-splitter[right-to-left] .smart-splitter > .smart-container {
392
- direction: initial;
393
- }
394
- .smart-splitter[right-to-left] smart-splitter-item > .smart-container > .smart-content {
395
- direction: rtl;
1
+ /* .smart-splitter */
2
+ smart-splitter {
3
+ width: var(--smart-splitter-default-width);
4
+ height: var(--smart-splitter-default-height);
5
+ position: relative;
6
+ /* Fixes the issue with the overflow and resize-container */
7
+ }
8
+ smart-splitter[dragged] {
9
+ cursor: w-resize;
10
+ }
11
+ smart-splitter[orientation=horizontal][dragged] {
12
+ cursor: s-resize;
13
+ }
14
+
15
+ smart-splitter-item > .smart-container {
16
+ overflow: hidden;
17
+ position: relative;
18
+ padding: var(--smart-splitter-item-padding);
19
+ }
20
+
21
+ .smart-splitter smart-splitter-bar {
22
+ min-width: 5px;
23
+ width: var(--smart-splitter-bar-size);
24
+ position: relative;
25
+ user-select: none;
26
+ overflow: hidden;
27
+ touch-action: none;
28
+ }
29
+ .smart-splitter smart-splitter-bar > .smart-container {
30
+ display: flex;
31
+ align-items: center;
32
+ justify-content: center;
33
+ flex-direction: column-reverse;
34
+ }
35
+ .smart-splitter smart-splitter-bar.smart-element {
36
+ background: var(--smart-surface);
37
+ border-color: var(--smart-surface-color);
38
+ color: var(--smart-surface-color);
39
+ border-radius: initial;
40
+ }
41
+ .smart-splitter smart-splitter-bar[focus] .smart-splitter-resize-button > span,
42
+ .smart-splitter smart-splitter-bar[focus] .smart-splitter-resize-button > span::before,
43
+ .smart-splitter smart-splitter-bar[focus] .smart-splitter-resize-button > span::after {
44
+ background-color: var(--smart-ui-state-color-active);
45
+ border-color: var(--smart-ui-state-color-active);
46
+ color: var(--smart-ui-state-color-active);
47
+ }
48
+ .smart-splitter smart-splitter-bar[focus].smart-element {
49
+ outline: none;
50
+ background: var(--smart-ui-state-active);
51
+ color: var(--smart-ui-state-color-active);
52
+ }
53
+ .smart-splitter smart-splitter-bar[locked] .smart-splitter-resize-button > span {
54
+ visibility: hidden;
55
+ }
56
+ .smart-splitter smart-splitter-bar[locked] .smart-splitter-resize-button > span:before, .smart-splitter smart-splitter-bar[locked] .smart-splitter-resize-button > span:after {
57
+ content: none;
58
+ }
59
+ .smart-splitter smart-splitter-bar[locked][hover] {
60
+ background-color: var(--smart-ui-state-hover);
61
+ color: var(--smart-ui-state-color-hover);
62
+ }
63
+ .smart-splitter smart-splitter-bar[locked][focus] {
64
+ background-color: var(--smart-ui-state-active);
65
+ color: var(--smart-ui-state-color-active);
66
+ }
67
+ .smart-splitter smart-splitter-bar[show-near-button] .smart-splitter-near-collapse-button {
68
+ visibility: visible;
69
+ width: 100%;
70
+ }
71
+ .smart-splitter smart-splitter-bar[show-far-button] .smart-splitter-far-collapse-button {
72
+ visibility: visible;
73
+ width: 100%;
74
+ }
75
+ .smart-splitter smart-splitter-bar[item-collapsed] {
76
+ cursor: initial;
77
+ }
78
+ .smart-splitter smart-splitter-bar[item-collapsed] > .smart-container {
79
+ flex-direction: initial;
80
+ }
81
+ .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-resize-button {
82
+ display: none;
83
+ }
84
+ .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-resize-button > span:before, .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-resize-button > span:after {
85
+ content: initial;
86
+ }
87
+ .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-near-collapse-button > span,
88
+ .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-far-collapse-button > span {
89
+ transform: rotate(270deg);
90
+ }
91
+ .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-near-collapse-button.smart-visibility-hidden,
92
+ .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-far-collapse-button.smart-visibility-hidden {
93
+ width: initial;
94
+ }
95
+ .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-near-collapse-button > span {
96
+ transform: translate(-50%, -50%) rotate(270deg);
97
+ }
98
+ .smart-splitter smart-splitter-bar[item-collapsed] .smart-splitter-far-collapse-button > span {
99
+ transform: translate(-50%, -50%) rotate(90deg);
100
+ }
101
+ .smart-splitter smart-splitter-item {
102
+ overflow: hidden;
103
+ }
104
+ .smart-splitter smart-splitter-item > .smart-container > .smart-content {
105
+ width: 100%;
106
+ height: 100%;
107
+ overflow: auto;
108
+ padding: var(--smart-splitter-item-content-padding);
109
+ }
110
+ .smart-splitter smart-splitter-item.smart-element {
111
+ background-color: inherit;
112
+ color: inherit;
113
+ border-radius: initial;
114
+ }
115
+ .smart-splitter smart-splitter-item[collapsed] {
116
+ overflow: hidden;
117
+ padding: initial;
118
+ }
119
+ .smart-splitter .smart-splitter {
120
+ margin: 0;
121
+ width: 100%;
122
+ height: 100%;
123
+ border: none;
124
+ }
125
+ .smart-splitter .smart-splitter smart-splitter-bar {
126
+ background-color: var(--smart-primary);
127
+ color: var(--smart-primary-color);
128
+ }
129
+ .smart-splitter > .smart-container {
130
+ display: flex;
131
+ position: relative;
132
+ overflow: inherit;
133
+ }
134
+ .smart-splitter > .smart-container > smart-splitter-item {
135
+ height: 100%;
136
+ flex-shrink: 0;
137
+ width: var(--smart-splitter-item-size);
138
+ }
139
+ .smart-splitter > .smart-container > smart-splitter-bar {
140
+ flex-shrink: 0;
141
+ height: var(--smart-splitter-bar-fit-size);
142
+ }
143
+ .smart-splitter > .smart-container > smart-splitter-bar[locked] {
144
+ cursor: default;
145
+ }
146
+ .smart-splitter > .smart-container > .smart-splitter-bar-feedback {
147
+ height: 100%;
148
+ flex-shrink: 0;
149
+ }
150
+ .smart-splitter .smart-splitter-bar-feedback {
151
+ min-width: 5px;
152
+ width: var(--smart-splitter-bar-size);
153
+ user-select: none;
154
+ overflow: hidden;
155
+ touch-action: none;
156
+ position: absolute;
157
+ background-color: var(--smart-ui-state-hover);
158
+ color: var(--smart-ui-state-color-hover);
159
+ opacity: 0.5;
160
+ }
161
+ .smart-splitter .smart-splitter-bar-feedback.limit-reached {
162
+ background-color: var(--smart-error);
163
+ }
164
+ .smart-splitter .smart-splitter-resize-button {
165
+ width: 100%;
166
+ position: relative;
167
+ font-family: var(--smart-font-family-icon);
168
+ height: 40px;
169
+ display: flex;
170
+ justify-content: center;
171
+ align-items: center;
172
+ cursor: inherit;
173
+ }
174
+ .smart-splitter .smart-splitter-resize-button > span {
175
+ width: 6px;
176
+ height: 6px;
177
+ border: 1px solid var(--smart-surface-color);
178
+ background-color: var(--smart-surface-color);
179
+ color: var(--smart-surface-color);
180
+ border-radius: 50%;
181
+ cursor: inherit;
182
+ }
183
+ .smart-splitter .smart-splitter-resize-button > span:before, .smart-splitter .smart-splitter-resize-button > span:after {
184
+ position: absolute;
185
+ transform: translate(-50%, -50%);
186
+ content: "";
187
+ width: 4px;
188
+ height: 4px;
189
+ border-radius: 50%;
190
+ border: 1px solid var(--smart-surface-color);
191
+ background-color: var(--smart-surface-color);
192
+ color: var(--smart-surface-color);
193
+ pointer-events: none;
194
+ font-family: var(--smart-font-family-icon);
195
+ }
196
+ .smart-splitter .smart-splitter-resize-button > span:before {
197
+ left: 50%;
198
+ top: calc(50% - var(--smart-splitter-bar-size));
199
+ }
200
+ .smart-splitter .smart-splitter-resize-button > span:after {
201
+ top: calc(50% + var(--smart-splitter-bar-size));
202
+ left: 50%;
203
+ }
204
+ .smart-splitter .smart-splitter-near-collapse-button,
205
+ .smart-splitter .smart-splitter-far-collapse-button {
206
+ height: 20px;
207
+ position: relative;
208
+ font-family: var(--smart-font-family-icon);
209
+ cursor: pointer;
210
+ visibility: hidden;
211
+ width: 0;
212
+ }
213
+ .smart-splitter .smart-splitter-near-collapse-button .smart-arrow,
214
+ .smart-splitter .smart-splitter-far-collapse-button .smart-arrow {
215
+ position: absolute;
216
+ top: 50%;
217
+ left: 50%;
218
+ width: auto;
219
+ height: auto;
220
+ }
221
+ .smart-splitter .smart-splitter-near-collapse-button .smart-arrow:after,
222
+ .smart-splitter .smart-splitter-far-collapse-button .smart-arrow:after {
223
+ content: var(--smart-icon-arrow-down);
224
+ position: absolute;
225
+ display: flex;
226
+ align-items: center;
227
+ justify-content: center;
228
+ pointer-events: none;
229
+ width: 100%;
230
+ height: 100%;
231
+ top: 0;
232
+ line-height: normal;
233
+ }
234
+ .smart-splitter .smart-splitter-far-collapse-button > span {
235
+ transform: translate(-50%, -50%) rotate(270deg);
236
+ }
237
+ .smart-splitter .smart-splitter-near-collapse-button .smart-arrow {
238
+ transform: translate(-55%, -50%) rotate(90deg);
239
+ }
240
+ .smart-splitter:not([readonly]) > .smart-container > smart-splitter-bar[hover] {
241
+ cursor: w-resize;
242
+ }
243
+ .smart-splitter:not([dragged]) > .smart-container > smart-splitter-bar:not([focus]) .smart-splitter-near-collapse-button,
244
+ .smart-splitter:not([dragged]) > .smart-container > smart-splitter-bar:not([focus]) .smart-splitter-far-collapse-button {
245
+ color: inherit;
246
+ }
247
+ .smart-splitter:not([dragged]) > .smart-container > smart-splitter-bar[hover]:not([item-collapsed]):not([focus]) .smart-splitter-near-collapse-button,
248
+ .smart-splitter:not([dragged]) > .smart-container > smart-splitter-bar[hover]:not([item-collapsed]):not([focus]) .smart-splitter-far-collapse-button {
249
+ color: var(--smart-ui-state-color-hover);
250
+ }
251
+ .smart-splitter:not([dragged]) smart-splitter-bar.smart-element, .smart-splitter:not([dragged]) smart-splitter-bar[hover] {
252
+ background-color: var(--smart-ui-state-hover);
253
+ border-color: var(--smart-ui-state-border-hover);
254
+ color: var(--smart-ui-state-color-hover);
255
+ }
256
+ .smart-splitter:not([dragged]) smart-splitter-bar[hover]:not([item-collapsed]):not([focus]) .smart-splitter-resize-button span,
257
+ .smart-splitter:not([dragged]) smart-splitter-bar[hover]:not([item-collapsed]):not([focus]) .smart-splitter-resize-button span:after,
258
+ .smart-splitter:not([dragged]) smart-splitter-bar[hover]:not([item-collapsed]):not([focus]) .smart-splitter-resize-button span:before {
259
+ background-color: var(--smart-ui-state-color-hover);
260
+ border-color: var(--smart-ui-state-color-hover);
261
+ color: var(--smart-ui-state-color-hover);
262
+ }
263
+ .smart-splitter:not([dragged]) smart-splitter-bar[focus] {
264
+ background-color: var(--smart-ui-state-active);
265
+ border-color: var(--smart-ui-state-border-active);
266
+ color: var(--smart-ui-state-color-active);
267
+ }
268
+ .smart-splitter:not([dragged]) smart-splitter-bar[focus]:not([item-collapsed]) .smart-splitter-resize-button span,
269
+ .smart-splitter:not([dragged]) smart-splitter-bar[focus]:not([item-collapsed]) .smart-splitter-resize-button span:after,
270
+ .smart-splitter:not([dragged]) smart-splitter-bar[focus]:not([item-collapsed]) .smart-splitter-resize-button span:before {
271
+ background-color: var(--smart-ui-state-color-active);
272
+ border-color: var(--smart-ui-state-color-active);
273
+ color: var(--smart-ui-state-color-active);
274
+ }
275
+ .smart-splitter:not([dragged]) smart-splitter-bar:not([item-collapsed]):not([focus]) .smart-splitter-near-collapse-button[hover],
276
+ .smart-splitter:not([dragged]) smart-splitter-bar:not([item-collapsed]):not([focus]) .smart-splitter-far-collapse-button[hover] {
277
+ color: var(--smart-ui-state-color-hover);
278
+ }
279
+ .smart-splitter[dragged] {
280
+ cursor: w-resize;
281
+ pointer-events: none;
282
+ user-select: none;
283
+ touch-action: none;
284
+ }
285
+ .smart-splitter[dragged]:not([animation=none]) > .smart-container > smart-splitter-item {
286
+ transition: none;
287
+ }
288
+ .smart-splitter[auto-fit-mode=overflow] > .smart-container {
289
+ overflow: auto;
290
+ }
291
+ .smart-splitter[orientation=horizontal] > .smart-container {
292
+ flex-direction: column;
293
+ }
294
+ .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-item {
295
+ width: 100%;
296
+ height: var(--smart-splitter-item-size);
297
+ }
298
+ .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar {
299
+ width: var(--smart-splitter-bar-fit-size);
300
+ min-height: 5px;
301
+ height: var(--smart-splitter-bar-size);
302
+ }
303
+ .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar > .smart-container {
304
+ flex-direction: row;
305
+ }
306
+ .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-near-collapse-button,
307
+ .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-far-collapse-button {
308
+ width: 0;
309
+ height: 100%;
310
+ }
311
+ .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-far-collapse-button > span {
312
+ transform: translate(-50%, -45%) rotate(0deg);
313
+ }
314
+ .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-near-collapse-button > span {
315
+ transform: translate(-50%, -50%) rotate(180deg);
316
+ }
317
+ .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-resize-button {
318
+ width: 20px;
319
+ height: 100%;
320
+ }
321
+ .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-resize-button > span:before {
322
+ left: calc(50% - var(--smart-splitter-bar-size));
323
+ top: 50%;
324
+ }
325
+ .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar .smart-splitter-resize-button > span:after {
326
+ top: 50%;
327
+ left: calc(50% + var(--smart-splitter-bar-size));
328
+ }
329
+ .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar[item-collapsed] .smart-splitter-far-collapse-button > span {
330
+ transform: translate(-50%, -50%) rotate(180deg);
331
+ }
332
+ .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar[item-collapsed] .smart-splitter-near-collapse-button > span {
333
+ transform: translate(-50%, -50%) rotate(0deg);
334
+ }
335
+ .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar[show-near-button] .smart-splitter-near-collapse-button, .smart-splitter[orientation=horizontal] > .smart-container > smart-splitter-bar[show-far-button] .smart-splitter-far-collapse-button {
336
+ width: 20px;
337
+ height: 100%;
338
+ }
339
+ .smart-splitter[orientation=horizontal] > .smart-container > .smart-splitter-bar-feedback {
340
+ width: 100%;
341
+ min-height: 5px;
342
+ height: var(--smart-splitter-bar-size);
343
+ }
344
+ .smart-splitter[orientation=horizontal] smart-splitter-item[collapsed] {
345
+ min-width: 0;
346
+ min-height: 0;
347
+ }
348
+ .smart-splitter[orientation=horizontal]:not([resize-mode=none]):not([readonly]) > .smart-container > smart-splitter-bar[hover]:not([locked]) {
349
+ cursor: s-resize;
350
+ }
351
+ .smart-splitter[orientation=horizontal][dragged] {
352
+ cursor: s-resize;
353
+ }
354
+ .smart-splitter[resize-mode=none] > .smart-container > smart-splitter-bar {
355
+ cursor: default;
356
+ }
357
+ .smart-splitter[disabled] > .smart-container > smart-splitter-bar {
358
+ cursor: default;
359
+ outline: none;
360
+ border: none;
361
+ box-shadow: none;
362
+ }
363
+ .smart-splitter[orientation][disabled] > .smart-container > smart-splitter-bar {
364
+ cursor: default;
365
+ }
366
+ .smart-splitter[dragging-not-allowed] > .smart-container > smart-splitter-bar,
367
+ .smart-splitter[dragging-not-allowed] > .smart-container > .smart-splitter-bar-feedback {
368
+ cursor: default;
369
+ }
370
+ .smart-splitter:not([animation=none]) .smart-splitter-near-collapse-button .smart-arrow,
371
+ .smart-splitter:not([animation=none]) .smart-splitter-far-collapse-button .smart-arrow {
372
+ transition: transform 0.2s ease-out;
373
+ }
374
+ .smart-splitter:not([animation=none]) > .smart-container > smart-splitter-item.animate {
375
+ transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
376
+ }
377
+ .smart-splitter[orientation-change]:not([animation=none]) > .smart-container > smart-splitter-item {
378
+ transition: none;
379
+ }
380
+ .smart-splitter[show-locked-items] > .smart-container > smart-splitter-item[locked] > .smart-container:after {
381
+ position: absolute;
382
+ content: var(--smart-icon-lock);
383
+ font-family: var(--smart-font-family-icon);
384
+ opacity: 0.25;
385
+ font-size: calc(2.5 * var(--smart-splitter-font-size));
386
+ top: 50%;
387
+ left: 50%;
388
+ transform: translate(-50%, -50%);
389
+ }
390
+
391
+ .smart-splitter[right-to-left] .smart-splitter > .smart-container {
392
+ direction: initial;
393
+ }
394
+ .smart-splitter[right-to-left] smart-splitter-item > .smart-container > .smart-content {
395
+ direction: rtl;
396
396
  }