amis 1.4.2-beta.6 → 1.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (488) hide show
  1. package/lib/Schema.d.ts +11 -3
  2. package/lib/Schema.js.map +1 -1
  3. package/lib/components/Alert2.d.ts +26 -21
  4. package/lib/components/Alert2.js +11 -4
  5. package/lib/components/Alert2.js.map +2 -2
  6. package/lib/components/AnchorNav.d.ts +22 -21
  7. package/lib/components/AnchorNav.js +7 -3
  8. package/lib/components/AnchorNav.js.map +2 -2
  9. package/lib/components/ArrayInput.d.ts +84 -84
  10. package/lib/components/AssociatedSelection.d.ts +930 -0
  11. package/lib/components/AssociatedSelection.js +89 -0
  12. package/lib/components/AssociatedSelection.js.map +13 -0
  13. package/lib/components/Badge.js +2 -2
  14. package/lib/components/Badge.js.map +2 -2
  15. package/lib/components/Button.js +1 -1
  16. package/lib/components/Button.js.map +2 -2
  17. package/lib/components/{ChainedCheckboxes.d.ts → ChainedSelection.d.ts} +267 -98
  18. package/lib/components/{ChainedCheckboxes.js → ChainedSelection.js} +30 -24
  19. package/lib/components/ChainedSelection.js.map +13 -0
  20. package/lib/components/Checkbox.d.ts +20 -20
  21. package/lib/components/Collapse.d.ts +51 -23
  22. package/lib/components/Collapse.js +70 -11
  23. package/lib/components/Collapse.js.map +2 -2
  24. package/lib/components/CollapseGroup.d.ts +88 -0
  25. package/lib/components/CollapseGroup.js +81 -0
  26. package/lib/components/CollapseGroup.js.map +13 -0
  27. package/lib/components/ColorPicker.d.ts +89 -85
  28. package/lib/components/ColorPicker.js +17 -4
  29. package/lib/components/ColorPicker.js.map +2 -2
  30. package/lib/components/DatePicker.d.ts +84 -84
  31. package/lib/components/DateRangePicker.d.ts +84 -84
  32. package/lib/components/Drawer.js +2 -2
  33. package/lib/components/Drawer.js.map +2 -2
  34. package/lib/components/Editor.d.ts +84 -84
  35. package/lib/components/GridNav.d.ts +52 -0
  36. package/lib/components/GridNav.js +123 -0
  37. package/lib/components/GridNav.js.map +13 -0
  38. package/lib/components/GroupedSelection.d.ts +907 -0
  39. package/lib/components/GroupedSelection.js +48 -0
  40. package/lib/components/GroupedSelection.js.map +13 -0
  41. package/lib/components/InputBox.d.ts +22 -21
  42. package/lib/components/InputBox.js +10 -2
  43. package/lib/components/InputBox.js.map +2 -2
  44. package/lib/components/Link.d.ts +29 -36
  45. package/lib/components/Link.js +14 -15
  46. package/lib/components/Link.js.map +2 -2
  47. package/lib/components/ListGroup.d.ts +21 -21
  48. package/lib/components/ModalManager.js +1 -1
  49. package/lib/components/ModalManager.js.map +2 -2
  50. package/lib/components/MonthRangePicker.d.ts +84 -84
  51. package/lib/components/NumberInput.d.ts +20 -20
  52. package/lib/components/Overlay.js +5 -0
  53. package/lib/components/Overlay.js.map +2 -2
  54. package/lib/components/PickerColumn.d.ts +514 -0
  55. package/lib/components/PickerColumn.js +279 -0
  56. package/lib/components/PickerColumn.js.map +13 -0
  57. package/lib/components/PickerContainer.d.ts +513 -0
  58. package/lib/components/PickerContainer.js +96 -0
  59. package/lib/components/PickerContainer.js.map +13 -0
  60. package/lib/components/PopOver.d.ts +1 -0
  61. package/lib/components/PopOver.js +12 -1
  62. package/lib/components/PopOver.js.map +2 -2
  63. package/lib/components/Progress.d.ts +85 -0
  64. package/lib/components/Progress.js +81 -0
  65. package/lib/components/Progress.js.map +13 -0
  66. package/lib/components/Radios.d.ts +22 -21
  67. package/lib/components/Radios.js +1 -0
  68. package/lib/components/Radios.js.map +2 -2
  69. package/lib/components/Rating.d.ts +21 -21
  70. package/lib/components/ResultBox.d.ts +84 -84
  71. package/lib/components/ResultBox.js +10 -2
  72. package/lib/components/ResultBox.js.map +2 -2
  73. package/lib/components/SearchBox.d.ts +84 -84
  74. package/lib/components/Select.d.ts +245 -237
  75. package/lib/components/Select.js +25 -4
  76. package/lib/components/Select.js.map +2 -2
  77. package/lib/components/{Checkboxes.d.ts → Selection.d.ts} +273 -98
  78. package/lib/components/Selection.js +134 -0
  79. package/lib/components/Selection.js.map +13 -0
  80. package/lib/components/{TableCheckboxes.d.ts → TableSelection.d.ts} +266 -96
  81. package/lib/components/{TableCheckboxes.js → TableSelection.js} +30 -30
  82. package/lib/components/TableSelection.js.map +13 -0
  83. package/lib/components/Tabs.d.ts +20 -20
  84. package/lib/components/TabsTransfer.d.ts +84 -84
  85. package/lib/components/TabsTransfer.js +9 -9
  86. package/lib/components/TabsTransfer.js.map +2 -2
  87. package/lib/components/TabsTransferPicker.d.ts +489 -0
  88. package/lib/components/TabsTransferPicker.js +60 -0
  89. package/lib/components/TabsTransferPicker.js.map +13 -0
  90. package/lib/components/Toast.d.ts +90 -87
  91. package/lib/components/Toast.js +15 -5
  92. package/lib/components/Toast.js.map +2 -2
  93. package/lib/components/Transfer.d.ts +908 -274
  94. package/lib/components/Transfer.js +31 -24
  95. package/lib/components/Transfer.js.map +2 -2
  96. package/lib/components/TransferDropDown.d.ts +488 -0
  97. package/lib/components/TransferDropDown.js +59 -0
  98. package/lib/components/TransferDropDown.js.map +13 -0
  99. package/lib/components/TransferPicker.d.ts +493 -0
  100. package/lib/components/TransferPicker.js +60 -0
  101. package/lib/components/TransferPicker.js.map +13 -0
  102. package/lib/components/Tree.d.ts +115 -84
  103. package/lib/components/Tree.js +183 -30
  104. package/lib/components/Tree.js.map +2 -2
  105. package/lib/components/{TreeCheckboxes.d.ts → TreeSelection.d.ts} +269 -99
  106. package/lib/components/{TreeCheckboxes.js → TreeSelection.js} +36 -32
  107. package/lib/components/TreeSelection.js.map +13 -0
  108. package/lib/components/condition-builder/Field.js +4 -2
  109. package/lib/components/condition-builder/Field.js.map +2 -2
  110. package/lib/components/condition-builder/Func.js +2 -2
  111. package/lib/components/condition-builder/Func.js.map +2 -2
  112. package/lib/components/condition-builder/InputSwitch.js +2 -2
  113. package/lib/components/condition-builder/InputSwitch.js.map +2 -2
  114. package/lib/components/condition-builder/Item.js +3 -3
  115. package/lib/components/condition-builder/Item.js.map +2 -2
  116. package/lib/components/icons.js +10 -0
  117. package/lib/components/icons.js.map +2 -2
  118. package/lib/components/index.d.ts +8 -8
  119. package/lib/components/index.js +16 -16
  120. package/lib/components/index.js.map +2 -2
  121. package/lib/envOverwrite.d.ts +1 -1
  122. package/lib/envOverwrite.js +24 -9
  123. package/lib/envOverwrite.js.map +2 -2
  124. package/lib/factory.d.ts +15 -1
  125. package/lib/factory.js +35 -6
  126. package/lib/factory.js.map +2 -2
  127. package/lib/helper.css.map +1 -1
  128. package/lib/hooks/index.d.ts +5 -0
  129. package/lib/hooks/index.js +14 -0
  130. package/lib/hooks/index.js.map +13 -0
  131. package/lib/hooks/use-set-state.d.ts +2 -0
  132. package/lib/hooks/use-set-state.js +15 -0
  133. package/lib/hooks/use-set-state.js.map +13 -0
  134. package/lib/hooks/use-touch.d.ts +16 -0
  135. package/lib/hooks/use-touch.js +73 -0
  136. package/lib/hooks/use-touch.js.map +13 -0
  137. package/lib/hooks/use-update-effect.d.ts +3 -0
  138. package/lib/hooks/use-update-effect.js +17 -0
  139. package/lib/hooks/use-update-effect.js.map +13 -0
  140. package/lib/icons/alert-danger.js +7 -0
  141. package/lib/icons/alert-info.js +7 -0
  142. package/lib/icons/alert-success.js +7 -0
  143. package/lib/icons/alert-warning.js +7 -0
  144. package/lib/icons/download.js +7 -0
  145. package/lib/icons/drag-bar.js +10 -3
  146. package/lib/index.d.ts +5 -0
  147. package/lib/index.js +6 -1
  148. package/lib/index.js.map +2 -2
  149. package/lib/locale/de-DE.js +2 -0
  150. package/lib/locale/de-DE.js.map +2 -2
  151. package/lib/locale/en-US.js +3 -0
  152. package/lib/locale/en-US.js.map +2 -2
  153. package/lib/locale/zh-CN.js +5 -2
  154. package/lib/locale/zh-CN.js.map +2 -2
  155. package/lib/renderers/Action.d.ts +10 -5
  156. package/lib/renderers/Action.js +23 -5
  157. package/lib/renderers/Action.js.map +2 -2
  158. package/lib/renderers/Alert.d.ts +21 -1
  159. package/lib/renderers/Alert.js.map +2 -2
  160. package/lib/renderers/AnchorNav.d.ts +1 -0
  161. package/lib/renderers/AnchorNav.js +2 -2
  162. package/lib/renderers/AnchorNav.js.map +2 -2
  163. package/lib/renderers/Avatar.js +3 -3
  164. package/lib/renderers/Avatar.js.map +2 -2
  165. package/lib/renderers/Breadcrumb.js +1 -1
  166. package/lib/renderers/Breadcrumb.js.map +2 -2
  167. package/lib/renderers/CRUD.d.ts +5 -0
  168. package/lib/renderers/CRUD.js +25 -4
  169. package/lib/renderers/CRUD.js.map +2 -2
  170. package/lib/renderers/Card.d.ts +5 -0
  171. package/lib/renderers/Card.js +34 -23
  172. package/lib/renderers/Card.js.map +2 -2
  173. package/lib/renderers/Collapse.d.ts +25 -20
  174. package/lib/renderers/Collapse.js +10 -72
  175. package/lib/renderers/Collapse.js.map +2 -2
  176. package/lib/renderers/CollapseGroup.d.ts +42 -0
  177. package/lib/renderers/CollapseGroup.js +33 -0
  178. package/lib/renderers/CollapseGroup.js.map +13 -0
  179. package/lib/renderers/Form/ConditionBuilder.js +2 -2
  180. package/lib/renderers/Form/ConditionBuilder.js.map +2 -2
  181. package/lib/renderers/Form/DiffEditor.d.ts +4 -3
  182. package/lib/renderers/Form/Editor.d.ts +3 -2
  183. package/lib/renderers/Form/InputCity.d.ts +84 -84
  184. package/lib/renderers/Form/InputCity.js +7 -6
  185. package/lib/renderers/Form/InputCity.js.map +2 -2
  186. package/lib/renderers/Form/InputColor.d.ts +86 -85
  187. package/lib/renderers/Form/InputColor.js +1 -1
  188. package/lib/renderers/Form/InputColor.js.map +2 -2
  189. package/lib/renderers/Form/InputFile.d.ts +6 -0
  190. package/lib/renderers/Form/InputFile.js +28 -8
  191. package/lib/renderers/Form/InputFile.js.map +2 -2
  192. package/lib/renderers/Form/InputImage.js +11 -4
  193. package/lib/renderers/Form/InputImage.js.map +2 -2
  194. package/lib/renderers/Form/Item.d.ts +1 -1
  195. package/lib/renderers/Form/Item.js +2 -1
  196. package/lib/renderers/Form/Item.js.map +2 -2
  197. package/lib/renderers/Form/Options.js +25 -4
  198. package/lib/renderers/Form/Options.js.map +2 -2
  199. package/lib/renderers/Form/Select.d.ts +42 -4
  200. package/lib/renderers/Form/Select.js +37 -3
  201. package/lib/renderers/Form/Select.js.map +2 -2
  202. package/lib/renderers/Form/TabsTransferPicker.d.ts +48 -0
  203. package/lib/renderers/Form/TabsTransferPicker.js +29 -0
  204. package/lib/renderers/Form/TabsTransferPicker.js.map +13 -0
  205. package/lib/renderers/Form/Transfer.js +18 -3
  206. package/lib/renderers/Form/Transfer.js.map +2 -2
  207. package/lib/renderers/Form/TransferPicker.d.ts +52 -0
  208. package/lib/renderers/Form/TransferPicker.js +43 -0
  209. package/lib/renderers/Form/TransferPicker.js.map +13 -0
  210. package/lib/renderers/Form/TreeSelect.js +2 -2
  211. package/lib/renderers/Form/TreeSelect.js.map +2 -2
  212. package/lib/renderers/Form/index.d.ts +5 -0
  213. package/lib/renderers/Form/index.js +5 -3
  214. package/lib/renderers/Form/index.js.map +2 -2
  215. package/lib/renderers/Form/wrapControl.js +13 -1
  216. package/lib/renderers/Form/wrapControl.js.map +2 -2
  217. package/lib/renderers/GridNav.d.ts +99 -0
  218. package/lib/renderers/GridNav.js +82 -0
  219. package/lib/renderers/GridNav.js.map +13 -0
  220. package/lib/renderers/IFrame.js +1 -3
  221. package/lib/renderers/IFrame.js.map +2 -2
  222. package/lib/renderers/Image.js +7 -5
  223. package/lib/renderers/Image.js.map +2 -2
  224. package/lib/renderers/Json.d.ts +4 -0
  225. package/lib/renderers/Json.js +4 -13
  226. package/lib/renderers/Json.js.map +2 -2
  227. package/lib/renderers/Link.d.ts +4 -2
  228. package/lib/renderers/Link.js +15 -8
  229. package/lib/renderers/Link.js.map +2 -2
  230. package/lib/renderers/List.js +1 -1
  231. package/lib/renderers/List.js.map +2 -2
  232. package/lib/renderers/Nav.d.ts +21 -21
  233. package/lib/renderers/Nav.js +37 -19
  234. package/lib/renderers/Nav.js.map +2 -2
  235. package/lib/renderers/Page.d.ts +18 -0
  236. package/lib/renderers/Page.js +53 -9
  237. package/lib/renderers/Page.js.map +2 -2
  238. package/lib/renderers/Portlet.d.ts +125 -0
  239. package/lib/renderers/Portlet.js +156 -0
  240. package/lib/renderers/Portlet.js.map +13 -0
  241. package/lib/renderers/Progress.d.ts +23 -3
  242. package/lib/renderers/Progress.js +15 -19
  243. package/lib/renderers/Progress.js.map +2 -2
  244. package/lib/renderers/Property.js +1 -1
  245. package/lib/renderers/Property.js.map +2 -2
  246. package/lib/renderers/Table/ColumnToggler.js +1 -1
  247. package/lib/renderers/Table/ColumnToggler.js.map +2 -2
  248. package/lib/renderers/Table/TableContent.d.ts +4 -1
  249. package/lib/renderers/Table/TableContent.js +21 -1
  250. package/lib/renderers/Table/TableContent.js.map +2 -2
  251. package/lib/renderers/Table/index.d.ts +5 -1
  252. package/lib/renderers/Table/index.js +65 -30
  253. package/lib/renderers/Table/index.js.map +2 -2
  254. package/lib/renderers/Tabs.js +9 -1
  255. package/lib/renderers/Tabs.js.map +2 -2
  256. package/lib/renderers/WebComponent.js +1 -1
  257. package/lib/renderers/WebComponent.js.map +2 -2
  258. package/lib/store/combo.d.ts +2 -2
  259. package/lib/store/form.d.ts +1 -1
  260. package/lib/store/form.js +3 -5
  261. package/lib/store/form.js.map +2 -2
  262. package/lib/store/formItem.js +44 -4
  263. package/lib/store/formItem.js.map +2 -2
  264. package/lib/store/table.d.ts +3 -2
  265. package/lib/store/table.js +35 -12
  266. package/lib/store/table.js.map +2 -2
  267. package/lib/themes/ang-ie11.css +934 -222
  268. package/lib/themes/ang.css +934 -222
  269. package/lib/themes/ang.css.map +1 -1
  270. package/lib/themes/antd-ie11.css +934 -222
  271. package/lib/themes/antd.css +934 -222
  272. package/lib/themes/antd.css.map +1 -1
  273. package/lib/themes/cxd-ie11.css +970 -260
  274. package/lib/themes/cxd.css +970 -260
  275. package/lib/themes/cxd.css.map +1 -1
  276. package/lib/themes/dark-ie11.css +934 -222
  277. package/lib/themes/dark.css +934 -222
  278. package/lib/themes/dark.css.map +1 -1
  279. package/lib/themes/default.css +970 -260
  280. package/lib/themes/default.css.map +1 -1
  281. package/lib/types.d.ts +38 -1
  282. package/lib/types.js +0 -5
  283. package/lib/types.js.map +2 -2
  284. package/lib/utils/api.d.ts +3 -2
  285. package/lib/utils/api.js +90 -17
  286. package/lib/utils/api.js.map +2 -2
  287. package/lib/utils/dom.d.ts +4 -0
  288. package/lib/utils/dom.js +11 -1
  289. package/lib/utils/dom.js.map +2 -2
  290. package/lib/utils/helper.d.ts +12 -23
  291. package/lib/utils/helper.js +62 -166
  292. package/lib/utils/helper.js.map +2 -2
  293. package/lib/utils/tpl-builtin.d.ts +2 -20
  294. package/lib/utils/tpl-builtin.js +25 -743
  295. package/lib/utils/tpl-builtin.js.map +2 -2
  296. package/lib/utils/tpl.js +24 -0
  297. package/lib/utils/tpl.js.map +2 -2
  298. package/package.json +5 -2
  299. package/schema.json +3966 -1263
  300. package/scss/_mixins.scss +1 -3
  301. package/scss/_properties.scss +42 -13
  302. package/scss/base/_common.scss +3 -0
  303. package/scss/base/_normalize.scss +2 -0
  304. package/scss/components/_alert.scss +28 -5
  305. package/scss/components/_anchor-nav.scss +89 -29
  306. package/scss/components/_button.scss +12 -0
  307. package/scss/components/_card.scss +9 -15
  308. package/scss/components/_collapse-group.scss +15 -0
  309. package/scss/components/_collapse.scss +48 -23
  310. package/scss/components/_grid-nav.scss +128 -0
  311. package/scss/components/_images.scss +1 -0
  312. package/scss/components/_input-box.scss +1 -0
  313. package/scss/components/_nav.scss +2 -7
  314. package/scss/components/_page.scss +35 -2
  315. package/scss/components/_picker-columns.scss +124 -0
  316. package/scss/components/_popover.scss +13 -0
  317. package/scss/components/_portlet.scss +51 -0
  318. package/scss/components/_progress.scss +141 -33
  319. package/scss/components/_result-box.scss +1 -0
  320. package/scss/components/_spinner.scss +5 -4
  321. package/scss/components/_status.scss +1 -1
  322. package/scss/components/_table.scss +32 -0
  323. package/scss/components/_toast.scss +41 -11
  324. package/scss/components/form/_checks.scss +0 -351
  325. package/scss/components/form/_color.scss +32 -3
  326. package/scss/components/form/_combo.scss +4 -0
  327. package/scss/components/form/_fieldset.scss +6 -1
  328. package/scss/components/form/_file.scss +11 -0
  329. package/scss/components/form/_form.scss +48 -0
  330. package/scss/components/form/_selection.scss +354 -0
  331. package/scss/components/form/_transfer.scss +76 -18
  332. package/scss/components/form/_tree.scss +42 -0
  333. package/scss/themes/_common.scss +6 -0
  334. package/scss/themes/_cxd-variables.scss +13 -6
  335. package/scss/themes/cxd.scss +19 -20
  336. package/sdk/ang-ie11.css +1065 -246
  337. package/sdk/ang.css +1069 -230
  338. package/sdk/antd-ie11.css +1068 -249
  339. package/sdk/antd.css +1069 -230
  340. package/sdk/charts.js +17 -17
  341. package/sdk/color-picker.js +65 -69
  342. package/sdk/cropperjs.js +3 -3
  343. package/sdk/cxd-ie11.css +1081 -268
  344. package/sdk/cxd.css +1116 -279
  345. package/sdk/dark-ie11.css +1069 -250
  346. package/sdk/dark.css +1069 -230
  347. package/sdk/exceljs.js +1 -1
  348. package/sdk/helper.css.map +1 -1
  349. package/sdk/iconfont.svg +2513 -0
  350. package/sdk/iconfont.ttf +0 -0
  351. package/sdk/iconfont.woff +0 -0
  352. package/sdk/locale/de-DE.js +2 -0
  353. package/sdk/markdown.js +69 -69
  354. package/sdk/papaparse.js +1 -1
  355. package/sdk/renderers/Form/CityDB.js +1 -1
  356. package/sdk/rest.js +20 -28
  357. package/sdk/rich-text.js +62 -62
  358. package/sdk/sdk-ie11.css +1081 -268
  359. package/sdk/sdk.css +1116 -279
  360. package/sdk/sdk.js +1371 -1189
  361. package/sdk/thirds/hls.js/hls.js +18 -18
  362. package/sdk/thirds/mpegts.js/mpegts.js +2 -2
  363. package/sdk/tinymce.js +57 -57
  364. package/src/Schema.ts +19 -1
  365. package/src/components/Alert2.tsx +32 -4
  366. package/src/components/AnchorNav.tsx +15 -4
  367. package/src/components/{AssociatedCheckboxes.tsx → AssociatedSelection.tsx} +43 -37
  368. package/src/components/Badge.tsx +3 -3
  369. package/src/components/Button.tsx +1 -0
  370. package/src/components/{ChainedCheckboxes.tsx → ChainedSelection.tsx} +57 -40
  371. package/src/components/Collapse.tsx +139 -20
  372. package/src/components/CollapseGroup.tsx +130 -0
  373. package/src/components/ColorPicker.tsx +32 -10
  374. package/src/components/Drawer.tsx +8 -6
  375. package/src/components/GridNav.tsx +233 -0
  376. package/src/components/{ListCheckboxes.tsx → GroupedSelection.tsx} +26 -21
  377. package/src/components/InputBox.tsx +10 -9
  378. package/src/components/Link.tsx +28 -37
  379. package/src/components/ModalManager.ts +1 -1
  380. package/src/components/Overlay.tsx +6 -0
  381. package/src/components/PickerColumn.tsx +429 -0
  382. package/src/components/PickerContainer.tsx +128 -0
  383. package/src/components/PopOver.tsx +15 -1
  384. package/src/components/Progress.tsx +140 -0
  385. package/src/components/Radios.tsx +3 -8
  386. package/src/components/ResultBox.tsx +9 -9
  387. package/src/components/Select.tsx +57 -5
  388. package/src/components/{Checkboxes.tsx → Selection.tsx} +75 -21
  389. package/src/components/{TableCheckboxes.tsx → TableSelection.tsx} +46 -25
  390. package/src/components/TabsTransfer.tsx +13 -7
  391. package/src/components/TabsTransferPicker.tsx +85 -0
  392. package/src/components/Toast.tsx +48 -21
  393. package/src/components/Transfer.tsx +71 -50
  394. package/src/components/TransferDropDown.tsx +120 -0
  395. package/src/components/TransferPicker.tsx +91 -0
  396. package/src/components/Tree.tsx +194 -8
  397. package/src/components/{TreeCheckboxes.tsx → TreeSelection.tsx} +33 -26
  398. package/src/components/condition-builder/Field.tsx +7 -5
  399. package/src/components/condition-builder/Func.tsx +3 -3
  400. package/src/components/condition-builder/InputSwitch.tsx +3 -3
  401. package/src/components/condition-builder/Item.tsx +5 -12
  402. package/src/components/icons.tsx +10 -0
  403. package/src/components/index.tsx +13 -13
  404. package/src/envOverwrite.ts +20 -8
  405. package/src/factory.tsx +70 -9
  406. package/src/hooks/index.ts +5 -0
  407. package/src/hooks/use-set-state.ts +19 -0
  408. package/src/hooks/use-touch.ts +100 -0
  409. package/src/hooks/use-update-effect.ts +16 -0
  410. package/src/icons/alert-danger.svg +1 -0
  411. package/src/icons/alert-info.svg +1 -0
  412. package/src/icons/alert-success.svg +1 -0
  413. package/src/icons/alert-warning.svg +1 -0
  414. package/src/icons/download.svg +4 -0
  415. package/src/icons/drag-bar.svg +12 -6
  416. package/src/index.tsx +5 -0
  417. package/src/locale/de-DE.ts +2 -0
  418. package/src/locale/en-US.ts +3 -0
  419. package/src/locale/zh-CN.ts +5 -2
  420. package/src/renderers/Action.tsx +58 -3
  421. package/src/renderers/Alert.tsx +31 -1
  422. package/src/renderers/AnchorNav.tsx +4 -0
  423. package/src/renderers/Avatar.tsx +8 -4
  424. package/src/renderers/Breadcrumb.tsx +5 -1
  425. package/src/renderers/CRUD.tsx +29 -3
  426. package/src/renderers/Card.tsx +76 -36
  427. package/src/renderers/Collapse.tsx +70 -115
  428. package/src/renderers/CollapseGroup.tsx +80 -0
  429. package/src/renderers/Form/ConditionBuilder.tsx +2 -2
  430. package/src/renderers/Form/InputCity.tsx +4 -8
  431. package/src/renderers/Form/InputColor.tsx +4 -2
  432. package/src/renderers/Form/InputFile.tsx +65 -24
  433. package/src/renderers/Form/InputImage.tsx +11 -3
  434. package/src/renderers/Form/Item.tsx +3 -2
  435. package/src/renderers/Form/Options.tsx +29 -3
  436. package/src/renderers/Form/Select.tsx +162 -21
  437. package/src/renderers/Form/TabsTransferPicker.tsx +123 -0
  438. package/src/renderers/Form/Transfer.tsx +19 -4
  439. package/src/renderers/Form/TransferPicker.tsx +145 -0
  440. package/src/renderers/Form/TreeSelect.tsx +25 -0
  441. package/src/renderers/Form/index.tsx +15 -2
  442. package/src/renderers/Form/wrapControl.tsx +26 -1
  443. package/src/renderers/GridNav.tsx +204 -0
  444. package/src/renderers/IFrame.tsx +2 -4
  445. package/src/renderers/Image.tsx +19 -15
  446. package/src/renderers/Json.tsx +9 -9
  447. package/src/renderers/Link.tsx +29 -16
  448. package/src/renderers/List.tsx +1 -1
  449. package/src/renderers/Nav.tsx +105 -56
  450. package/src/renderers/Page.tsx +62 -1
  451. package/src/renderers/Portlet.tsx +423 -0
  452. package/src/renderers/Progress.tsx +56 -38
  453. package/src/renderers/Property.tsx +6 -4
  454. package/src/renderers/Table/ColumnToggler.tsx +1 -1
  455. package/src/renderers/Table/TableContent.tsx +40 -2
  456. package/src/renderers/Table/index.tsx +88 -43
  457. package/src/renderers/Tabs.tsx +9 -1
  458. package/src/renderers/WebComponent.tsx +2 -2
  459. package/src/store/form.ts +3 -9
  460. package/src/store/formItem.ts +94 -2
  461. package/src/store/table.ts +55 -14
  462. package/src/types.ts +58 -1
  463. package/src/utils/api.ts +120 -26
  464. package/src/utils/dom.tsx +12 -0
  465. package/src/utils/helper.ts +55 -185
  466. package/src/utils/tpl-builtin.ts +40 -866
  467. package/src/utils/tpl.ts +33 -0
  468. package/tsconfig-for-declaration.json +1 -1
  469. package/dump.rdb +0 -0
  470. package/lib/components/AssociatedCheckboxes.d.ts +0 -762
  471. package/lib/components/AssociatedCheckboxes.js +0 -90
  472. package/lib/components/AssociatedCheckboxes.js.map +0 -13
  473. package/lib/components/ChainedCheckboxes.js.map +0 -13
  474. package/lib/components/Checkboxes.js +0 -101
  475. package/lib/components/Checkboxes.js.map +0 -13
  476. package/lib/components/ListCheckboxes.d.ts +0 -739
  477. package/lib/components/ListCheckboxes.js +0 -48
  478. package/lib/components/ListCheckboxes.js.map +0 -13
  479. package/lib/components/ListRadios.d.ts +0 -763
  480. package/lib/components/ListRadios.js +0 -86
  481. package/lib/components/ListRadios.js.map +0 -13
  482. package/lib/components/TableCheckboxes.js.map +0 -13
  483. package/lib/components/TreeCheckboxes.js.map +0 -13
  484. package/lib/components/TreeRadios.d.ts +0 -838
  485. package/lib/components/TreeRadios.js +0 -116
  486. package/lib/components/TreeRadios.js.map +0 -13
  487. package/src/components/ListRadios.tsx +0 -159
  488. package/src/components/TreeRadios.tsx +0 -202
@@ -447,6 +447,7 @@
447
447
  ) / 2 - var(--ColorPicker-borderWidth)
448
448
  );
449
449
  --ColorPicker-placeholderColor: var(--Form-input-placeholderColor);
450
+ --ColorPicker-boxShadow: var(--boxShadow);
450
451
  --Combo--horizontal-dragger-top: var(--Form-label-paddingTop);
451
452
  --Combo--horizontal-item-gap: var(--gap-xs);
452
453
  --Combo--vertical-item-borderColor: var(--borderColor);
@@ -492,8 +493,13 @@
492
493
  --Collapse-header-padding: 1.125rem 0 var(--gap-xs) 0;
493
494
  --Collapse-header-bg: transparent;
494
495
  --Collapse-header-onHover-bg: transparent;
495
- --Collapse-header-collapsed-borderBottom: var(--borderWidth) solid
496
+ --Collapse-header-collapsed-border: var(--borderWidth) solid
496
497
  var(--Collapse-border-color);
498
+ --Collapse-header-collapsed-borderTop: none;
499
+ --Collapse-header-collapsed-borderBottom: var(
500
+ --Collapse-header-collapsed-border
501
+ );
502
+ --Collapse-header-wrapper-direction: row;
497
503
  --Collapse-content-padding: 1.125rem 0;
498
504
  --Collapse-content-color: var(--body-color);
499
505
  --Collapse-content-fontSize: var(--body-size);
@@ -981,11 +987,28 @@
981
987
  --Panel-titleMarginTop: 0;
982
988
  --Picker-iconColor: var(--icon-color);
983
989
  --Picker-onHover-iconColor: var(--icon-onHover-color);
990
+ --PickerColumns-bg: white;
991
+ --PickerColumns-toolbar-height: 3.125rem;
992
+ --PickerColumns-title-fontSize: var(--fontSizeLg);
993
+ --PickerColumns-title-lineHeight: 1.5;
994
+ --PickerColumns-action-padding: 0 var(--gap-sm);
995
+ --PickerColumns-action-fontSize: var(--fontSizeMd);
996
+ --PickerColumns-confirmAction-color: var(--Button--info-bg);
997
+ --PickerColumns-cancelAction-color: var(--Button--light-bg);
998
+ --PickerColumns-option-fontSize: var(--fontSizeLg);
999
+ --PickerColumns-optionText-color: var(--text-color);
1000
+ --PickerColumns-optionDisabled-opacity: 0.3;
1001
+ --PickerColumns-loadingIcon-color: var(--icon-color);
1002
+ --PickerColumns-loadingMask-Color: rgba(255, 255, 255, 0.9);
984
1003
  --PopOver-bg: white;
985
1004
  --PopOverAble-iconColor: inherit;
986
1005
  --PopOverAble-onHover-iconColor: inherit;
987
1006
  --Property-title-bg: #f2f2f2;
988
1007
  --Property-label-bg: #f7f7f7;
1008
+ --Portlet-borderColor: var(--borderColor);
1009
+ --Portlet-borderStyle: solid;
1010
+ --Portlet-borderWidth: var(--borderWidth);
1011
+ --Portlet-borderRadius: var(--borderRadius);
989
1012
  --QuickEdit-iconColor: inherit;
990
1013
  --QuickEdit-onFocus-borderColor: var(--info);
991
1014
  --QuickEdit-onFocus-borderWidth: var(--borderWidth);
@@ -1162,29 +1185,29 @@
1162
1185
  ) / 2
1163
1186
  );
1164
1187
  --TagControl-sugTip-color: var(--info);
1165
- --Toast--danger-bgColor: var(--danger);
1166
- --Toast--danger-borderColor: var(--danger);
1188
+ --Toast-color: var(--text-color);
1189
+ --Toast--danger-bgColor: var(--background);
1190
+ --Toast--danger-borderColor: transparent;
1167
1191
  --Toast--danger-color: var(--Toast-color);
1168
- --Toast--info-bgColor: var(--info);
1169
- --Toast--info-borderColor: var(--info);
1192
+ --Toast--info-bgColor: var(--background);
1193
+ --Toast--info-borderColor: transparent;
1170
1194
  --Toast--info-color: var(--Toast-color);
1171
- --Toast--success-bgColor: var(--success);
1172
- --Toast--success-borderColor: var(--success);
1195
+ --Toast--success-bgColor: var(--background);
1196
+ --Toast--success-borderColor: transparent;
1173
1197
  --Toast--success-color: var(--Toast-color);
1174
- --Toast--warning-bgColor: var(--warning);
1175
- --Toast--warning-borderColor: var(--warning);
1198
+ --Toast--warning-bgColor: var(--background);
1199
+ --Toast--warning-borderColor: transparent;
1176
1200
  --Toast--warning-color: var(--Toast-color);
1177
1201
  --Toast-border-width: 0;
1178
- --Toast-borderRadius: var(--borderRadiusLg);
1202
+ --Toast-borderRadius: 0.125rem;
1179
1203
  --Toast-box-shadow: var(--boxShadow);
1204
+ --Toast-close-color: var(--icon-color);
1180
1205
  --Toast-close--onHover-color: var(--Toast-close-color);
1181
- --Toast-close-color: var(--white);
1182
- --Toast-color: var(--white);
1183
1206
  --Toast-icon-width: 1rem;
1184
1207
  --Toast-icon-height: var(--Toast-icon-width);
1185
1208
  --Toast-opacity: 0.8;
1186
1209
  --Toast-paddingL: 2.5rem;
1187
- --Toast-paddingX: var(--gap-sm);
1210
+ --Toast-paddingX: var(--gap-md);
1188
1211
  --Toast-paddingY: var(--gap-xs);
1189
1212
  --Toast-title-display: block;
1190
1213
  --Toast-width: 18.75rem;
@@ -1266,6 +1289,8 @@
1266
1289
  --Steps-line-bg: var(--Steps-bg);
1267
1290
  --Steps-line-success-bg: var(--Steps-status-success);
1268
1291
  --Progress-borderRadius: var(--borderRadius);
1292
+ --Progress-animate-backgroundColor: #fff;
1293
+ --Progress-bar-backgroundColor: #d3d9e6;
1269
1294
  --ColumnToggler-backgroundColor: var(--white);
1270
1295
  --ColumnToggler-borderRadius: 0.25rem;
1271
1296
  --ColumnToggler-lineHeight: 1.5rem;
@@ -1597,6 +1622,8 @@ svg.icon {
1597
1622
  width: 1em;
1598
1623
  height: 1em;
1599
1624
  fill: currentColor;
1625
+ position: relative;
1626
+ top: 0.125em;
1600
1627
  }
1601
1628
 
1602
1629
  svg.r90 {
@@ -1669,6 +1696,10 @@ samp {
1669
1696
  height: 100%;
1670
1697
  }
1671
1698
 
1699
+ .has-popover {
1700
+ position: relative;
1701
+ }
1702
+
1672
1703
  html,
1673
1704
  body {
1674
1705
  width: 100%;
@@ -3059,6 +3090,9 @@ img.a-AsideNav-itemIcon {
3059
3090
  border: var(--Button-borderWidth) solid var(--Button-onDisabled-borderColor);
3060
3091
  background: var(--Button-onDisabled-bg);
3061
3092
  }
3093
+ .a-Button.is-disabled > svg, .a-Button.is-disabled > svg path, .a-Button:disabled > svg, .a-Button:disabled > svg path {
3094
+ fill: currentColor;
3095
+ }
3062
3096
  .a-Button:not(:disabled):not(.is-disabled) {
3063
3097
  cursor: pointer;
3064
3098
  }
@@ -3492,6 +3526,13 @@ input[type=button].a-Button--block {
3492
3526
  margin-top: var(--gap-xs);
3493
3527
  }
3494
3528
 
3529
+ .a-Action {
3530
+ display: inline-block;
3531
+ }
3532
+ .a-Action:hover {
3533
+ cursor: pointer;
3534
+ }
3535
+
3495
3536
  .a-Avatar {
3496
3537
  background: var(--Avatar-bg);
3497
3538
  width: var(--Avatar-width);
@@ -4438,6 +4479,120 @@ input[type=button].a-Button--block {
4438
4479
  bottom: 0;
4439
4480
  background: transparent;
4440
4481
  }
4482
+ .a-PopOver-isMobile .a-PopOver-overlay {
4483
+ background: rgba(0, 0, 0, 0.3);
4484
+ }
4485
+ .a-PopOver--leftBottomLeftTop {
4486
+ margin-top: 0.25rem;
4487
+ }
4488
+ .a-PopOver--leftTopLeftBottom {
4489
+ margin-top: -0.25rem;
4490
+ }
4491
+
4492
+ .a-PickerColumns {
4493
+ position: relative;
4494
+ background-color: var(--PickerColumns-bg);
4495
+ user-select: none;
4496
+ }
4497
+ .a-PickerColumns-popOver {
4498
+ position: fixed;
4499
+ bottom: 0;
4500
+ left: 0;
4501
+ width: 100%;
4502
+ padding: 0 var(--gap-sm);
4503
+ }
4504
+ .a-PickerColumns-toolbar {
4505
+ display: flex;
4506
+ align-items: center;
4507
+ justify-content: space-between;
4508
+ height: var(--PickerColumns-toolbar-height);
4509
+ }
4510
+ .a-PickerColumns-cancel, .a-PickerColumns-confirm {
4511
+ height: 100%;
4512
+ padding: var(--PickerColumns-action-padding);
4513
+ font-size: var(--PickerColumns-action-fontSize);
4514
+ background-color: transparent;
4515
+ border: none;
4516
+ cursor: pointer;
4517
+ }
4518
+ .a-PickerColumns-cancel:active, .a-PickerColumns-confirm:active {
4519
+ opacity: 0.7;
4520
+ }
4521
+ .a-PickerColumns-confirm {
4522
+ color: var(--PickerColumns-confirmAction-color);
4523
+ }
4524
+ .a-PickerColumns-cancel {
4525
+ color: var(--PickerColumns-cancelAction-color);
4526
+ }
4527
+ .a-PickerColumns-title {
4528
+ max-width: 50%;
4529
+ font-weight: 500;
4530
+ font-size: var(--PickerColumns-title-fontSize);
4531
+ line-height: var(--PickerColumns-title-lineHeight);
4532
+ text-align: center;
4533
+ }
4534
+ .a-PickerColumns-columns {
4535
+ touch-action: none;
4536
+ position: relative;
4537
+ display: flex;
4538
+ cursor: grab;
4539
+ }
4540
+ .a-PickerColumns-loading {
4541
+ position: absolute;
4542
+ top: 0;
4543
+ right: 0;
4544
+ bottom: 0;
4545
+ left: 0;
4546
+ z-index: 3;
4547
+ display: flex;
4548
+ align-items: center;
4549
+ justify-content: center;
4550
+ color: var(--PickerColumns-loadingIcon-color);
4551
+ background-color: var(--PickerColumns-loadingMask-color);
4552
+ }
4553
+ .a-PickerColumns-frame {
4554
+ position: absolute;
4555
+ top: 50%;
4556
+ right: var(--gap-md);
4557
+ left: var(--gap-md);
4558
+ z-index: 2;
4559
+ transform: translateY(-50%);
4560
+ pointer-events: none;
4561
+ }
4562
+ .a-PickerColumns-mask {
4563
+ position: absolute;
4564
+ top: 0;
4565
+ left: 0;
4566
+ z-index: 1;
4567
+ width: 100%;
4568
+ height: 100%;
4569
+ background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.4)), linear-gradient(0deg, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.4));
4570
+ background-repeat: no-repeat;
4571
+ background-position: top, bottom;
4572
+ transform: translateZ(0);
4573
+ pointer-events: none;
4574
+ }
4575
+ .a-PickerColumns-column {
4576
+ flex: 1;
4577
+ overflow: hidden;
4578
+ font-size: var(--PickerColumns-option-fontSize);
4579
+ }
4580
+ .a-PickerColumns-columnWrapper {
4581
+ margin: 0;
4582
+ padding: 0;
4583
+ list-style: none;
4584
+ transition-timing-function: cubic-bezier(0.23, 1, 0.68, 1);
4585
+ }
4586
+ .a-PickerColumns-columnItem {
4587
+ display: flex;
4588
+ align-items: center;
4589
+ justify-content: center;
4590
+ color: var(--PickerColumns-optionText-color);
4591
+ }
4592
+ .a-PickerColumns-columnItem.is-disabled {
4593
+ cursor: not-allowed;
4594
+ opacity: var(--PickerColumns-optionDisabled-opacity);
4595
+ }
4441
4596
 
4442
4597
  @keyframes bounceIn {
4443
4598
  from, 20%, 40%, 60%, 80%, to {
@@ -4480,7 +4635,9 @@ input[type=button].a-Button--block {
4480
4635
  }
4481
4636
  .a-Toast {
4482
4637
  display: flex;
4483
- align-items: center;
4638
+ flex-flow: row nowrap;
4639
+ justify-content: space-between;
4640
+ align-items: flex-start;
4484
4641
  max-width: var(--Toast-width);
4485
4642
  pointer-events: auto;
4486
4643
  margin-bottom: var(--gap-xs);
@@ -4491,7 +4648,6 @@ input[type=button].a-Button--block {
4491
4648
  color: var(--Toast-color);
4492
4649
  position: relative;
4493
4650
  opacity: var(--Toast-opacity);
4494
- cursor: pointer;
4495
4651
  opacity: 0;
4496
4652
  transform: translateZ(0);
4497
4653
  }
@@ -4512,27 +4668,54 @@ input[type=button].a-Button--block {
4512
4668
  animation-name: bounceOut;
4513
4669
  }
4514
4670
  .a-Toast-close {
4515
- color: var(--Toast-close-color);
4516
4671
  display: inline-flex;
4517
- margin-left: var(--gap-xs);
4672
+ font-size: var(--fontSizeLg);
4673
+ line-height: var(--gap-xl);
4674
+ height: var(--gap-xl);
4675
+ color: var(--Toast-close-color);
4676
+ margin-left: var(--gap-sm);
4518
4677
  opacity: 0.8;
4678
+ align-items: center;
4679
+ cursor: pointer;
4519
4680
  }
4520
4681
  .a-Toast-close:hover {
4521
4682
  color: var(--Toast-close--onHover-color);
4522
4683
  opacity: 1;
4523
4684
  }
4524
- .a-Toast-body {
4685
+ .a-Toast-close > svg {
4686
+ top: 0;
4687
+ }
4688
+ .a-Toast-content {
4689
+ flex: 1;
4690
+ display: flex;
4691
+ flex-flow: column nowrap;
4692
+ justify-content: space-between;
4693
+ align-items: flex-start;
4694
+ }
4695
+ .a-Toast-content .a-Toast-title {
4696
+ color: var(--text-color);
4697
+ font-size: var(--fontSizeBase);
4698
+ font-weight: 500;
4699
+ line-height: var(--gap-xl);
4700
+ margin-bottom: var(--gap-xs);
4701
+ }
4702
+ .a-Toast-content .a-Toast-body {
4703
+ font-size: var(--fontSizeSm);
4525
4704
  display: inline-block;
4526
4705
  vertical-align: middle;
4527
4706
  white-space: pre-wrap;
4528
4707
  flex-grow: 1;
4708
+ line-height: var(--gap-xl);
4529
4709
  }
4530
4710
  .a-Toast-icon {
4531
4711
  display: inline-flex;
4532
4712
  text-rendering: auto;
4533
4713
  -webkit-font-smoothing: antialiased;
4534
4714
  vertical-align: middle;
4535
- margin-right: var(--gap-xs);
4715
+ margin-right: var(--gap-sm);
4716
+ height: var(--gap-xl);
4717
+ line-height: var(--gap-xl);
4718
+ align-items: center;
4536
4719
  }
4537
4720
  .a-Toast-icon > svg {
4538
4721
  top: 0;
@@ -4595,23 +4778,42 @@ input[type=button].a-Button--block {
4595
4778
  border-radius: var(--Alert-borderRadius);
4596
4779
  margin-bottom: var(--Alert-marginBottom);
4597
4780
  position: relative;
4781
+ color: var(--Alert-fontColor);
4782
+ display: flex;
4783
+ flex-flow: row nowrap;
4784
+ justify-content: space-between;
4785
+ align-items: flex-start;
4786
+ }
4787
+ .a-Alert-icon {
4788
+ margin-right: 0.5rem;
4789
+ font-size: var(--fontSizeLg);
4790
+ }
4791
+ .a-Alert-content {
4792
+ flex: 1;
4793
+ }
4794
+ .a-Alert-content .a-Alert-title {
4795
+ color: var(--text-color);
4796
+ font-size: var(--fontSizeBase);
4797
+ font-weight: 500;
4798
+ line-height: 1.5rem;
4799
+ margin-bottom: 0.25rem;
4800
+ }
4801
+ .a-Alert-content .a-Alert-desc {
4802
+ line-height: 1.5rem;
4598
4803
  }
4599
4804
  .a-Alert-close {
4600
- position: absolute;
4601
4805
  outline: none;
4602
4806
  padding: 0;
4603
4807
  cursor: pointer;
4604
4808
  background: transparent;
4605
4809
  border: 0;
4606
- float: right;
4607
4810
  line-height: 1;
4608
4811
  color: #000;
4609
4812
  text-shadow: 0 1px 0 #fff;
4610
4813
  filter: alpha(opacity=20);
4611
4814
  opacity: 0.2;
4612
- right: var(--Alert-paddingX);
4613
- top: 50%;
4614
- transform: translateY(-50%);
4815
+ margin-left: 0.5rem;
4816
+ line-height: 1.5rem;
4615
4817
  }
4616
4818
  .a-Alert-close:hover {
4617
4819
  color: #000;
@@ -5250,8 +5452,8 @@ input[type=button].a-Button--block {
5250
5452
  cursor: move;
5251
5453
  position: absolute;
5252
5454
  left: 0;
5253
- top: 0.6875rem;
5254
5455
  display: none;
5456
+ line-height: 0;
5255
5457
  }
5256
5458
  .a-Nav .a-Nav-list--stacked .a-Nav-item .a-Nav-itemDrager > .icon, .a-Nav .a-Nav-list--stacked .a-Nav-item .a-Nav-itemDrager > .a-Badge > .icon, .a-Nav .a-Nav-list--stacked .a-Badge .a-Nav-itemDrager > .icon, .a-Nav .a-Nav-list--stacked .a-Badge .a-Nav-itemDrager > .a-Badge > .icon {
5257
5459
  color: var(--icon-color);
@@ -5334,12 +5536,10 @@ input[type=button].a-Button--block {
5334
5536
  background: transparent;
5335
5537
  pointer-events: none;
5336
5538
  }
5337
- .a-Nav .a-Nav-list--stacked .a-Nav-item.active, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active, .a-Nav .a-Nav-list--stacked .a-Badge.active, .a-Nav .a-Nav-list--stacked .a-Badge.is-active {
5338
- background: var(--Nav-item-onActive-bg) !important;
5339
- }
5340
5539
  .a-Nav .a-Nav-list--stacked .a-Nav-item.active > a, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > .a-Nav-item-atcions, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > a, .a-Nav .a-Nav-list--stacked .a-Nav-item.active > .a-Badge > a, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > .a-Badge > .a-Nav-item-atcions, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > .a-Badge > a, .a-Nav .a-Nav-list--stacked .a-Badge.active > a, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > .a-Nav-item-atcions, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > a, .a-Nav .a-Nav-list--stacked .a-Badge.active > .a-Badge > a, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > .a-Badge > .a-Nav-item-atcions, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > .a-Badge > a {
5341
5540
  color: var(--Nav-item-onActive-color);
5342
5541
  position: relative;
5542
+ background: var(--Nav-item-onActive-bg);
5343
5543
  }
5344
5544
  .a-Nav .a-Nav-list--stacked .a-Nav-item.active > a::after, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > .a-Nav-item-atcions::after, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > a::after, .a-Nav .a-Nav-list--stacked .a-Nav-item.active > .a-Badge > a::after, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > .a-Badge > .a-Nav-item-atcions::after, .a-Nav .a-Nav-list--stacked .a-Nav-item.is-active > .a-Badge > a::after, .a-Nav .a-Nav-list--stacked .a-Badge.active > a::after, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > .a-Nav-item-atcions::after, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > a::after, .a-Nav .a-Nav-list--stacked .a-Badge.active > .a-Badge > a::after, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > .a-Badge > .a-Nav-item-atcions::after, .a-Nav .a-Nav-list--stacked .a-Badge.is-active > .a-Badge > a::after {
5345
5545
  transform: scaleY(1);
@@ -5443,6 +5643,31 @@ input[type=button].a-Button--block {
5443
5643
  .a-Page-asideTplWrapper {
5444
5644
  padding: var(--gap-xs);
5445
5645
  }
5646
+ .a-Page-asideResizor {
5647
+ position: absolute;
5648
+ right: -0.375rem;
5649
+ top: 50%;
5650
+ cursor: ew-resize;
5651
+ writing-mode: vertical-lr;
5652
+ width: 0.75rem;
5653
+ height: 1.5rem;
5654
+ margin-top: -0.75rem;
5655
+ border: 0.0625rem solid #dee2e6;
5656
+ background-color: #fff;
5657
+ border-radius: 0.142rem;
5658
+ font-size: 12px;
5659
+ line-height: 0.625rem;
5660
+ text-align: center;
5661
+ user-select: none;
5662
+ color: #666;
5663
+ }
5664
+ .a-Page-asideResizor:hover {
5665
+ color: #000;
5666
+ box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.12), 0 2px 4px 0 rgba(0, 0, 0, 0.08);
5667
+ }
5668
+ .a-Page-asideResizor:after {
5669
+ content: "···";
5670
+ }
5446
5671
 
5447
5672
  .a-Page-toolbar > * + * {
5448
5673
  margin-left: var(--gap-xs);
@@ -5450,8 +5675,7 @@ input[type=button].a-Button--block {
5450
5675
 
5451
5676
  @media (min-width: 768px) {
5452
5677
  .a-Page-aside {
5453
- min-width: var(--Page-aside-width);
5454
- max-width: var(--Page-aside-maxWidth);
5678
+ width: var(--Page-aside-width);
5455
5679
  border-right: var(--borderWidth) solid var(--borderColor);
5456
5680
  }
5457
5681
  .a-Page-aside::before {
@@ -5464,6 +5688,10 @@ input[type=button].a-Button--block {
5464
5688
  background: inherit;
5465
5689
  border: inherit;
5466
5690
  }
5691
+ .a-Page-aside--withWidth {
5692
+ min-width: var(--Page-aside-width);
5693
+ max-width: var(--Page-aside-maxWidth);
5694
+ }
5467
5695
 
5468
5696
  .a-Page--withSidebar {
5469
5697
  display: flex;
@@ -5952,12 +6180,13 @@ input[type=button].a-Button--block {
5952
6180
  .a-Spinner--icon {
5953
6181
  background: transparent;
5954
6182
  animation: spin 2s linear infinite;
5955
- width: var(--fontSizeLg);
5956
- height: var(--fontSizeLg);
6183
+ width: 16px;
6184
+ height: 16px;
5957
6185
  }
5958
6186
  .a-Spinner--icon svg.icon {
5959
- width: var(--fontSizeLg);
5960
- height: var(--fontSizeLg);
6187
+ width: 16px;
6188
+ height: 16px;
6189
+ top: 0;
5961
6190
  }
5962
6191
 
5963
6192
  .a-Spinner--overlay {
@@ -6175,7 +6404,7 @@ input[type=button].a-Button--block {
6175
6404
  .a-Collapse {
6176
6405
  border: var(--Collapse-border);
6177
6406
  padding: 0;
6178
- margin-bottom: var(--Form-item-gap);
6407
+ line-height: 1.25rem;
6179
6408
  }
6180
6409
  .a-Collapse-header {
6181
6410
  font-size: var(--Collapse-header-fontSize);
@@ -6183,9 +6412,16 @@ input[type=button].a-Button--block {
6183
6412
  color: var(--text--loud-color);
6184
6413
  padding: var(--Collapse-header-padding);
6185
6414
  margin: 0;
6186
- border-bottom: var(--borderWidth) solid var(--Collapse-border-color);
6415
+ cursor: pointer;
6187
6416
  background: var(--Collapse-header-bg);
6188
6417
  }
6418
+ .a-Collapse-header-wrapper {
6419
+ display: inline-flex;
6420
+ flex-direction: var(--Collapse-header-wrapper-direction);
6421
+ }
6422
+ .a-Collapse-header-tpl {
6423
+ margin-right: 0.5rem;
6424
+ }
6189
6425
  .a-Collapse-header:hover {
6190
6426
  background: var(--Collapse-header-onHover-bg);
6191
6427
  }
@@ -6193,8 +6429,7 @@ input[type=button].a-Button--block {
6193
6429
  display: inline-block;
6194
6430
  width: 1rem;
6195
6431
  text-align: center;
6196
- margin-right: 0.5rem;
6197
- cursor: pointer;
6432
+ margin-right: var(--gap-sm);
6198
6433
  }
6199
6434
  .a-Collapse-arrow:before {
6200
6435
  content: "";
@@ -6202,42 +6437,56 @@ input[type=button].a-Button--block {
6202
6437
  display: inline-block;
6203
6438
  width: 0.375rem;
6204
6439
  height: 0.375rem;
6205
- top: -0.25rem;
6440
+ top: -0.125rem;
6206
6441
  border-color: var(--text-color);
6207
6442
  border-style: solid;
6208
6443
  border-width: 0.0625rem 0.0625rem 0 0;
6209
- transform: rotate(135deg);
6444
+ transform: rotate(45deg);
6210
6445
  transform-origin: 50% 50%;
6211
6446
  }
6212
- .a-Collapse-TplField {
6447
+ .a-Collapse-icon-tranform {
6448
+ display: inline-block;
6449
+ width: 1rem;
6450
+ text-align: center;
6451
+ margin-right: var(--gap-xs);
6452
+ }
6453
+ .a-Collapse .a-TplField {
6213
6454
  display: inline-block;
6214
6455
  }
6215
- .a-Collapse.is-collapsed .a-Collapse-arrow:before {
6216
- transform: rotate(45deg);
6217
- transform-origin: 0% 50%;
6456
+ .a-Collapse.is-active .a-Collapse-arrow:before {
6457
+ transform: rotate(135deg);
6458
+ transform-origin: 50% 30%;
6218
6459
  }
6219
- .a-Collapse.is-collapsed .a-Collapse-header {
6220
- border-bottom: var(--Collapse-header-collapsed-borderBottom);
6460
+ .a-Collapse.is-active .a-Collapse-icon-tranform {
6461
+ transform: rotate(90deg);
6221
6462
  }
6222
- .a-Collapse--collapsable .a-Collapse-header {
6223
- cursor: pointer;
6463
+ .a-Collapse--disabled .a-Collapse-header {
6464
+ cursor: not-allowed;
6224
6465
  user-select: none;
6466
+ color: var(--text--muted-color);
6467
+ }
6468
+ .a-Collapse--disabled .a-Collapse-header:hover {
6469
+ background-color: var(--Collapse-header-bg-disabled-color);
6470
+ }
6471
+ .a-Collapse--disabled .a-Collapse-arrow:before {
6472
+ border-color: var(--text--muted-color);
6225
6473
  }
6226
6474
  .a-Collapse--title-bottom .a-Collapse-header {
6227
6475
  text-align: center;
6228
- color: var(--link-color);
6229
- border-left: none;
6230
6476
  font-size: var(--fontSizeBase);
6477
+ border-top: var(--Collapse-header-collapsed-borderTop);
6478
+ border-bottom: var(--Collapse-header-collapsed-borderBottom);
6231
6479
  }
6232
- .a-Collapse--title-bottom .a-Collapse-arrow:before {
6233
- top: 0.125rem;
6234
- transform: rotate(-45deg);
6235
- transform-origin: 0% 50%;
6480
+ .a-Collapse--title-bottom.is-collapsed .a-Collapse-header {
6481
+ border-top: none;
6236
6482
  }
6237
- .a-Collapse--title-bottom.is-collapsed .a-Collapse-arrow:before {
6238
- top: -0.375rem;
6483
+ .a-Collapse--title-bottom .a-Collapse-arrow:before {
6484
+ top: -0.25rem;
6239
6485
  transform: rotate(135deg);
6240
- transform-origin: 0% 50%;
6486
+ }
6487
+ .a-Collapse--title-bottom.is-active .a-Collapse-arrow:before {
6488
+ top: 0;
6489
+ transform: rotate(-45deg);
6241
6490
  }
6242
6491
  .a-Collapse-contentWrapper {
6243
6492
  transition: height var(--animation-duration) ease;
@@ -6253,6 +6502,13 @@ input[type=button].a-Button--block {
6253
6502
  font-weight: var(--Collapse-content-fontWeight);
6254
6503
  }
6255
6504
 
6505
+ .a-CollapseGroup .a-Collapse:not(:last-child) {
6506
+ border-bottom: none;
6507
+ }
6508
+ .a-CollapseGroup.icon-position-right .a-Collapse-header .a-Collapse-arrow {
6509
+ float: right;
6510
+ }
6511
+
6256
6512
  .a-ColorField {
6257
6513
  display: inline-block;
6258
6514
  }
@@ -7228,6 +7484,9 @@ input[type=button].a-Button--block {
7228
7484
  .a-Table-table--withCombine > tbody > tr > td:not(:last-child) {
7229
7485
  border-right: var(--Table-borderWidth) solid var(--Table-borderColor);
7230
7486
  }
7487
+ .a-Table-table--checkOnItemClick > tbody > tr {
7488
+ cursor: pointer;
7489
+ }
7231
7490
  .a-Table-table > thead > tr > th {
7232
7491
  background: var(--Table-thead-bg);
7233
7492
  padding: var(--TableCell-paddingY) var(--TableCell-paddingX);
@@ -7940,6 +8199,10 @@ input[type=button].a-Button--block {
7940
8199
  padding-right: 0;
7941
8200
  cursor: move;
7942
8201
  }
8202
+ .a-Table-table > thead > tr > th.a-Table-dragCell > svg,
8203
+ .a-Table-table > tbody > tr > td.a-Table-dragCell > svg {
8204
+ vertical-align: middle;
8205
+ }
7943
8206
  .a-Table-table > tbody > tr > td.a-Table-expandCell {
7944
8207
  position: relative;
7945
8208
  }
@@ -8247,6 +8510,9 @@ input[type=button].a-Button--block {
8247
8510
  text-decoration: none;
8248
8511
  color: var(--icon-onHover-color);
8249
8512
  }
8513
+ .a-Table-dragBtn > svg {
8514
+ vertical-align: -2px;
8515
+ }
8250
8516
  .a-Table-table > tbody > tr:hover .a-Table-dragBtn, .a-Table-table > tbody > tr.is-dragging .a-Table-dragBtn, .a-Table-table > tbody > tr.is-drop-allowed .a-Table-dragBtn {
8251
8517
  visibility: visible;
8252
8518
  }
@@ -8259,6 +8525,23 @@ input[type=button].a-Button--block {
8259
8525
  top: 0;
8260
8526
  left: 0;
8261
8527
  }
8528
+ .a-Table--autoFillHeight {
8529
+ margin-bottom: 0;
8530
+ }
8531
+ .a-Table--autoFillHeight > .a-Table-contentWrap > .a-Table-content table {
8532
+ border-top: none;
8533
+ }
8534
+ .a-Table--autoFillHeight > .a-Table-contentWrap > .a-Table-content table thead {
8535
+ position: sticky;
8536
+ top: 0;
8537
+ z-index: 1;
8538
+ }
8539
+ .a-Table--autoFillHeight > .a-Table-fixedTop {
8540
+ display: none;
8541
+ }
8542
+ .a-Table--autoFillHeight > .a-Table-footToolbar {
8543
+ margin-bottom: 0;
8544
+ }
8262
8545
 
8263
8546
  .a-InputTable-toolbar {
8264
8547
  display: flex;
@@ -8897,23 +9180,14 @@ input[type=button].a-Button--block {
8897
9180
  .a-Card-title + .a-Card-subTitle {
8898
9181
  margin-top: var(--gap-xs);
8899
9182
  }
8900
- .a-Card-checkBtn {
8901
- position: absolute;
8902
- top: 0;
8903
- right: 0;
8904
- margin: var(--gap-sm);
8905
- z-index: 1;
8906
- }
8907
- .a-Card-checkBtn .a-Checkbox {
8908
- margin-right: 0;
8909
- }
8910
9183
  .a-Card-dragBtn {
8911
9184
  cursor: pointer;
8912
9185
  float: right;
8913
9186
  margin: var(--gap-sm);
8914
9187
  }
8915
9188
  .a-Card-heading {
8916
- overflow: hidden;
9189
+ display: flex;
9190
+ flex-direction: row;
8917
9191
  padding: var(--gap-sm) var(--gap-base);
8918
9192
  flex: 1 0 auto;
8919
9193
  }
@@ -8937,15 +9211,19 @@ input[type=button].a-Button--block {
8937
9211
  float: left;
8938
9212
  margin-right: var(--gap-base);
8939
9213
  font-size: var(--fontSizeXl);
8940
- text-transform: uppercase();
9214
+ text-transform: uppercase;
8941
9215
  }
8942
9216
  .a-Card-meta {
8943
9217
  display: block;
9218
+ flex-grow: 1;
8944
9219
  height: 100%;
8945
- overflow: hidden;
8946
9220
  position: relative;
8947
9221
  margin-right: var(--gap-md);
8948
9222
  }
9223
+ .a-Card-toolbar {
9224
+ margin-right: calc(-1 * var(--gap-base));
9225
+ text-align: right;
9226
+ }
8949
9227
  .a-Card-highlight {
8950
9228
  background: var(--success);
8951
9229
  width: 0.5rem;
@@ -9158,32 +9436,120 @@ input[type=button].a-Button--block {
9158
9436
  right: 0;
9159
9437
  }
9160
9438
 
9161
- .a-Progress {
9439
+ .a-Progress-line {
9440
+ display: inline-block;
9441
+ width: 100%;
9442
+ margin-right: calc(-2em + -8px);
9443
+ padding-right: calc(2em + 8px);
9444
+ }
9445
+ .a-Progress-line-inter {
9162
9446
  height: 10px;
9163
- background: #ebebeb;
9447
+ background-color: var(--Progress-bar-backgroundColor);
9164
9448
  overflow: hidden;
9165
9449
  border-radius: var(--Progress-borderRadius);
9166
9450
  }
9167
- .a-Progress-bar {
9168
- float: left;
9169
- width: 0;
9170
- height: 100%;
9171
- font-size: 12px;
9172
- line-height: 10px;
9173
- color: #fff;
9174
- text-align: center;
9175
- background: var(--primary);
9451
+ .a-Progress-line-no-label {
9452
+ padding-right: 0;
9453
+ margin-right: 0;
9454
+ }
9455
+ .a-Progress-line-text {
9456
+ display: inline-block;
9457
+ width: 2em;
9458
+ margin-left: 8px;
9459
+ color: var(--text-color);
9460
+ font-size: var(--fontSizeXs);
9461
+ white-space: nowrap;
9462
+ text-align: left;
9463
+ word-break: normal;
9464
+ }
9465
+ .a-Progress-line-text .icon {
9466
+ font-size: 15px;
9467
+ }
9468
+ .a-Progress-line-bar {
9469
+ float: left;
9470
+ width: 0;
9471
+ height: 100%;
9472
+ font-size: 12px;
9473
+ line-height: 10px;
9474
+ text-align: center;
9475
+ background: var(--primary);
9176
9476
  transition: width var(--animation-duration) ease;
9177
- border-radius: var(--Progress-borderRadius);
9178
9477
  }
9179
- .a-Progress-bar--stripe {
9478
+ .a-Progress-line-bar--stripe {
9180
9479
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
9181
9480
  background-size: 2rem 2rem;
9182
9481
  }
9183
- .a-Progress-bar--animate {
9482
+ .a-Progress-line-bar--animate {
9483
+ position: relative;
9484
+ transition: all 0.4s cubic-bezier(0.08, 0.82, 0.17, 1) 0s;
9485
+ }
9486
+ .a-Progress-line-bar--animate::before {
9487
+ position: absolute;
9488
+ top: 0;
9489
+ right: 0;
9490
+ bottom: 0;
9491
+ left: 0;
9492
+ background: var(--Progress-animate-backgroundColor);
9493
+ border-radius: 10px;
9494
+ opacity: 0;
9495
+ animation: progress-bar-active 2.4s cubic-bezier(0.23, 1, 0.32, 1) infinite;
9496
+ content: "";
9497
+ }
9498
+ .a-Progress-line-bar--stripe-animate {
9184
9499
  animation: progress-bar-stripes 1s linear infinite;
9185
9500
  }
9501
+ .a-Progress-circle {
9502
+ width: 120px;
9503
+ height: 120px;
9504
+ position: relative;
9505
+ }
9506
+ .a-Progress-circle-text {
9507
+ position: absolute;
9508
+ top: 50%;
9509
+ left: 50%;
9510
+ width: 100%;
9511
+ margin: 0;
9512
+ padding: 0;
9513
+ color: var(--text-color);
9514
+ font-size: 1em;
9515
+ line-height: 1;
9516
+ white-space: normal;
9517
+ text-align: center;
9518
+ transform: translate(-50%, -50%);
9519
+ }
9520
+ .a-Progress-circle-text .icon {
9521
+ font-size: 1.2em;
9522
+ }
9523
+ .a-Progress-circle .bg-warning-circle-path {
9524
+ stroke: var(--warning);
9525
+ }
9526
+ .a-Progress-circle .bg-danger-circle-path {
9527
+ stroke: var(--danger);
9528
+ }
9529
+ .a-Progress-circle .bg-info-circle-path {
9530
+ stroke: var(--info);
9531
+ }
9532
+ .a-Progress-circle .bg-success-circle-path {
9533
+ stroke: var(--success);
9534
+ }
9535
+ .a-Progress-circle .bg-primary-circle-path {
9536
+ stroke: var(--primary);
9537
+ }
9186
9538
 
9539
+ @keyframes progress-bar-active {
9540
+ 0% {
9541
+ transform: translateX(-100%) scaleX(0);
9542
+ opacity: 0.1;
9543
+ }
9544
+ 20% {
9545
+ transform: translateX(-100%) scaleX(0);
9546
+ opacity: 0.5;
9547
+ }
9548
+ 100% {
9549
+ transform: translateX(0) scaleX(1);
9550
+ opacity: 0;
9551
+ }
9552
+ }
9187
9553
  @keyframes progress-bar-stripes {
9188
9554
  from {
9189
9555
  background-position: 2rem 0;
@@ -9367,7 +9733,7 @@ input[type=button].a-Button--block {
9367
9733
  }
9368
9734
  .a-StatusField-label {
9369
9735
  font-size: var(--fontSizeSm);
9370
- margin-left: var(--gap-sm);
9736
+ margin-left: var(--gap-xs);
9371
9737
  }
9372
9738
  @keyframes animation-rolling_red {
9373
9739
  0% {
@@ -9929,7 +10295,7 @@ input[type=button].a-Button--block {
9929
10295
  line-height: 1;
9930
10296
  font-size: 1rem;
9931
10297
  }
9932
- .a-Image-thumbWrap:hover .a-Image-overlay {
10298
+ .a-Image-origin:hover .a-Image-overlay, .a-Image-thumbWrap:hover .a-Image-overlay {
9933
10299
  display: flex;
9934
10300
  }
9935
10301
 
@@ -9984,6 +10350,14 @@ input[type=button].a-Button--block {
9984
10350
  .a-InputBox:hover {
9985
10351
  border-color: var(--Form-input-onFocused-borderColor);
9986
10352
  }
10353
+ .a-InputBox--borderHalf {
10354
+ border-left-color: transparent !important;
10355
+ border-right-color: transparent !important;
10356
+ border-top-color: transparent !important;
10357
+ }
10358
+ .a-InputBox--borderNone {
10359
+ border-color: transparent !important;
10360
+ }
9987
10361
  .a-InputBox--inline {
9988
10362
  display: inline-flex;
9989
10363
  }
@@ -10070,6 +10444,14 @@ input[type=button].a-Button--block {
10070
10444
  .a-ResultBox:hover {
10071
10445
  border-color: var(--Form-input-onFocused-borderColor);
10072
10446
  }
10447
+ .a-ResultBox--borderHalf {
10448
+ border-left-color: transparent !important;
10449
+ border-right-color: transparent !important;
10450
+ border-top-color: transparent !important;
10451
+ }
10452
+ .a-ResultBox--borderNone {
10453
+ border-color: transparent !important;
10454
+ }
10073
10455
  .a-ResultBox.is-error {
10074
10456
  border-color: var(--Form-input-onError-borderColor);
10075
10457
  background: var(--Form-input-onError-bg);
@@ -10504,6 +10886,148 @@ input[type=button].a-Button--block {
10504
10886
  border: 1px solid var(--Steps-status-success);
10505
10887
  }
10506
10888
 
10889
+ .a-Portlet {
10890
+ border: var(--Portlet-borderWidth) var(--Portlet-borderStyle) var(--Portlet-borderColor);
10891
+ border-radius: var(--Portlet-borderRadius);
10892
+ padding: var(--gap-base);
10893
+ }
10894
+ .a-Portlet-tab.unactive-select .is-active a:first-child, .a-Portlet-tab.unactive-select .is-active:hover > a:first-child,
10895
+ .a-Portlet-tab.unactive-select .is-active > a:first-child:focus {
10896
+ border: none !important;
10897
+ color: inherit !important;
10898
+ cursor: auto !important;
10899
+ }
10900
+ .a-Portlet-tab.no-divider .a-Tabs-links {
10901
+ border-bottom: none;
10902
+ }
10903
+ .a-Portlet .a-Tabs-pane {
10904
+ padding: unset;
10905
+ }
10906
+ .a-Portlet-toolbar {
10907
+ display: inline-flex;
10908
+ float: right;
10909
+ justify-content: flex-end;
10910
+ }
10911
+ .a-Portlet-toolbar .a-Button {
10912
+ margin-left: calc(var(--gap-xs));
10913
+ }
10914
+ .a-Portlet-header-desc {
10915
+ height: 100%;
10916
+ overflow: hidden;
10917
+ position: relative;
10918
+ margin-left: var(--gap-base);
10919
+ }
10920
+
10921
+ .a-Portlet.no-header .a-Portlet-tab .a-Tabs-links {
10922
+ display: none;
10923
+ }
10924
+
10925
+ .u-hairline::after {
10926
+ position: absolute;
10927
+ box-sizing: border-box;
10928
+ content: " ";
10929
+ pointer-events: none;
10930
+ top: -50%;
10931
+ right: -50%;
10932
+ bottom: -50%;
10933
+ left: -50%;
10934
+ border: 0 solid var(--borderColorLight);
10935
+ z-index: 1;
10936
+ transform: scale(0.5);
10937
+ }
10938
+
10939
+ .a-GridNav {
10940
+ display: flex;
10941
+ flex-wrap: wrap;
10942
+ }
10943
+ .a-GridNav-top {
10944
+ position: relative;
10945
+ }
10946
+ .a-GridNav-top::after {
10947
+ border-top-width: 0.0625rem;
10948
+ }
10949
+
10950
+ .a-GridNavItem {
10951
+ position: relative;
10952
+ box-sizing: border-box;
10953
+ }
10954
+ .a-GridNavItem--square {
10955
+ height: 0;
10956
+ position: relative;
10957
+ }
10958
+ .a-GridNavItem-icon {
10959
+ width: var(--rv-grid-item-icon-size);
10960
+ }
10961
+ .a-GridNavItem-text {
10962
+ color: var(--text-color);
10963
+ font-size: var(--fontSizeSm);
10964
+ line-height: 1.5;
10965
+ word-break: break-all;
10966
+ flex-shrink: 0;
10967
+ }
10968
+ .a-GridNavItem-icon + .a-GridNavItem-text {
10969
+ margin-top: 0.5rem;
10970
+ }
10971
+ .a-GridNavItem-image {
10972
+ display: inline-block;
10973
+ }
10974
+ .a-GridNavItem-image svg,
10975
+ .a-GridNavItem-image img {
10976
+ max-width: 100%;
10977
+ display: block;
10978
+ width: 60%;
10979
+ margin: 0 auto;
10980
+ }
10981
+ .a-GridNavItem-content {
10982
+ display: flex;
10983
+ flex-direction: column;
10984
+ box-sizing: border-box;
10985
+ height: 100%;
10986
+ padding: var(--gap-md) var(--gap-sm);
10987
+ background-color: var(--white);
10988
+ position: relative;
10989
+ }
10990
+ .a-GridNavItem-content .a-Badge-text {
10991
+ z-index: 10;
10992
+ }
10993
+ .a-GridNavItem-content--border::after {
10994
+ border-width: 0 var(--borderWidth) var(--borderWidth) 0;
10995
+ }
10996
+ .a-GridNavItem-content--square {
10997
+ position: absolute;
10998
+ top: 0;
10999
+ right: 0;
11000
+ left: 0;
11001
+ }
11002
+ .a-GridNavItem-content--center {
11003
+ align-items: center;
11004
+ justify-content: center;
11005
+ }
11006
+ .a-GridNavItem-content--horizontal {
11007
+ flex-direction: row;
11008
+ }
11009
+ .a-GridNavItem-content--horizontal .a-GridNavItem-text {
11010
+ margin: 0 0 0 var(--gap-sm);
11011
+ }
11012
+ .a-GridNavItem-content--reverse {
11013
+ flex-direction: column-reverse;
11014
+ }
11015
+ .a-GridNavItem-content--reverse .a-GridNavItem-text {
11016
+ margin: 0 0 var(--gap-sm);
11017
+ }
11018
+ .a-GridNavItem-content--horizontal .a-GridNavItem-content--reverse {
11019
+ flex-direction: row-reverse;
11020
+ }
11021
+ .a-GridNavItem-content--horizontal .a-GridNavItem-content--reverse .a-GridNavItem-text {
11022
+ margin: 0 var(--gap-sm) 0 0;
11023
+ }
11024
+ .a-GridNavItem-content--surround::after {
11025
+ border-width: var(--borderWidth);
11026
+ }
11027
+ .a-GridNavItem-content--clickable {
11028
+ cursor: pointer;
11029
+ }
11030
+
10507
11031
  fieldset.a-Collapse--lg, fieldset.a-Collapse--md, fieldset.a-Collapse--base, fieldset.a-Collapse--sm, fieldset.a-Collapse--xs {
10508
11032
  position: relative;
10509
11033
  }
@@ -10533,6 +11057,9 @@ fieldset.a-Collapse--lg .collapse, fieldset.a-Collapse--md .collapse, fieldset.a
10533
11057
  position: relative;
10534
11058
  }
10535
11059
 
11060
+ fieldset.a-Collapse {
11061
+ margin-bottom: var(--Form-item-gap);
11062
+ }
10536
11063
  fieldset.a-Collapse > legend {
10537
11064
  font-weight: var(--fontWeightNormal);
10538
11065
  padding: var(--gap-xs) 0;
@@ -10543,10 +11070,14 @@ fieldset.a-Collapse > legend {
10543
11070
  margin: var(--gap-base) 0;
10544
11071
  padding: 0 0 0 14px;
10545
11072
  cursor: pointer;
10546
- border-bottom: 0;
11073
+ border-bottom: none !important;
11074
+ background: transparent;
10547
11075
  display: flex;
10548
11076
  flex-direction: row;
10549
11077
  }
11078
+ fieldset.a-Collapse > legend:hover {
11079
+ background: transparent;
11080
+ }
10550
11081
  fieldset.a-Collapse--xs {
10551
11082
  padding: 20px 5px 5px 5px;
10552
11083
  }
@@ -11442,45 +11973,38 @@ fieldset.a-Collapse--lg:after {
11442
11973
  color: #999;
11443
11974
  }
11444
11975
 
11445
- .a-Checkboxes > .a-Checkbox {
11976
+ .a-Selection > .a-Checkbox {
11446
11977
  display: block;
11447
11978
  height: var(--Form-input-height);
11448
11979
  line-height: var(--Form-input-lineHeight);
11449
11980
  font-size: var(--Form-input-fontSize);
11450
11981
  padding: calc( ( var(--Form-input-height) - var(--Form-input-lineHeight) * var(--Form-input-fontSize) ) / 2 ) var(--gap-sm) calc( ( var(--Form-input-height) - var(--Form-input-lineHeight) * var(--Form-input-fontSize) ) / 2 ) calc(var(--gap-sm) + var(--Checkbox-size));
11451
11982
  }
11452
- .a-Checkboxes--inline > .a-Checkbox {
11983
+ .a-Selection--inline > .a-Checkbox {
11453
11984
  display: inline-block;
11454
11985
  }
11455
- .a-Checkboxes-addBtn {
11986
+ .a-Selection-addBtn {
11456
11987
  display: block;
11457
11988
  cursor: pointer;
11458
11989
  }
11459
- .a-Checkboxes-addBtn:hover {
11990
+ .a-Selection-addBtn:hover {
11460
11991
  text-decoration: none;
11461
11992
  }
11462
- .a-Checkboxes-addBtn > svg {
11993
+ .a-Selection-addBtn > svg {
11463
11994
  width: 0.875rem;
11464
11995
  height: 0.875rem;
11465
11996
  margin-right: var(--Checkbox-gap);
11466
11997
  }
11467
11998
 
11468
- .a-ListCheckboxes-group:not(:first-child) > .a-ListCheckboxes-itemLabel,
11469
- .a-ListCheckboxes-group:not(:first-child) > .a-ListRadios-itemLabel,
11470
- .a-ListRadios-group:not(:first-child) > .a-ListCheckboxes-itemLabel,
11471
- .a-ListRadios-group:not(:first-child) > .a-ListRadios-itemLabel {
11999
+ .a-GroupedSelection-group:not(:first-child) > .a-GroupedSelection-itemLabel {
11472
12000
  border-top: 0.0625rem solid var(--ListMenu-divider-color);
11473
12001
  }
11474
- .a-ListCheckboxes-group > .a-ListCheckboxes-itemLabel,
11475
- .a-ListCheckboxes-group > .a-ListRadios-itemLabel,
11476
- .a-ListRadios-group > .a-ListCheckboxes-itemLabel,
11477
- .a-ListRadios-group > .a-ListRadios-itemLabel {
12002
+ .a-GroupedSelection-group > .a-GroupedSelection-itemLabel {
11478
12003
  font-size: var(--fontSizeSm);
11479
12004
  padding: var(--gap-xs) var(--gap-xs);
11480
12005
  color: var(--text--muted-color);
11481
12006
  }
11482
- .a-ListCheckboxes-item,
11483
- .a-ListRadios-item {
12007
+ .a-GroupedSelection-item {
11484
12008
  display: flex;
11485
12009
  height: var(--Form-input-height);
11486
12010
  line-height: var(--Form-input-lineHeight);
@@ -11490,44 +12014,30 @@ fieldset.a-Collapse--lg:after {
11490
12014
  cursor: pointer;
11491
12015
  user-select: none;
11492
12016
  }
11493
- .a-ListCheckboxes-item > .a-Checkbox,
11494
- .a-ListRadios-item > .a-Checkbox {
12017
+ .a-GroupedSelection-item > .a-Checkbox {
11495
12018
  margin-right: 0;
11496
12019
  }
11497
- .a-ListCheckboxes-item.is-active,
11498
- .a-ListRadios-item.is-active {
12020
+ .a-GroupedSelection-item.is-active {
11499
12021
  color: var(--Form-select-menu-onActive-color);
11500
12022
  background: var(--Form-select-menu-onActive-bg);
11501
12023
  }
11502
- .a-ListCheckboxes-item:hover,
11503
- .a-ListRadios-item:hover {
12024
+ .a-GroupedSelection-item:hover {
11504
12025
  background: var(--Tree-item-onHover-bg);
11505
12026
  }
11506
- .a-ListCheckboxes-item.is-disabled,
11507
- .a-ListRadios-item.is-disabled {
12027
+ .a-GroupedSelection-item.is-disabled {
11508
12028
  pointer-events: none;
11509
12029
  color: var(--text--muted-color);
11510
12030
  }
11511
- .a-ListCheckboxes-group > .a-ListCheckboxes-items > .a-ListCheckboxes-item,
11512
- .a-ListCheckboxes-group > .a-ListCheckboxes-items > .a-ListRadios-item,
11513
- .a-ListCheckboxes-group > .a-ListRadios-items > .a-ListCheckboxes-item,
11514
- .a-ListCheckboxes-group > .a-ListRadios-items > .a-ListRadios-item,
11515
- .a-ListRadios-group > .a-ListCheckboxes-items > .a-ListCheckboxes-item,
11516
- .a-ListRadios-group > .a-ListCheckboxes-items > .a-ListRadios-item,
11517
- .a-ListRadios-group > .a-ListRadios-items > .a-ListCheckboxes-item,
11518
- .a-ListRadios-group > .a-ListRadios-items > .a-ListRadios-item {
12031
+ .a-GroupedSelection-group > .a-GroupedSelection-items > .a-GroupedSelection-item {
11519
12032
  padding-left: var(--gap-base);
11520
12033
  }
11521
- .a-ListCheckboxes-itemLabel,
11522
- .a-ListRadios-itemLabel {
12034
+ .a-GroupedSelection-itemLabel {
11523
12035
  flex-grow: 1;
11524
12036
  }
11525
- .a-ListCheckboxes-itemLabel span,
11526
- .a-ListRadios-itemLabel span {
12037
+ .a-GroupedSelection-itemLabel span {
11527
12038
  white-space: nowrap;
11528
12039
  }
11529
- .a-ListCheckboxes-placeholder,
11530
- .a-ListRadios-placeholder {
12040
+ .a-GroupedSelection-placeholder {
11531
12041
  height: var(--Form-input-height);
11532
12042
  line-height: var(--Form-input-lineHeight);
11533
12043
  font-size: var(--Form-input-fontSize);
@@ -11535,45 +12045,46 @@ fieldset.a-Collapse--lg:after {
11535
12045
  color: var(--text--muted-color);
11536
12046
  }
11537
12047
 
11538
- .a-TableCheckboxes .a-Table-content {
12048
+ .a-TableSelection .a-Table-content {
11539
12049
  border-top: var(--Table-borderWidth) solid var(--Table-borderColor);
11540
12050
  }
11541
- .a-TableCheckboxes .a-Table-table > thead > tr > th,
11542
- .a-TableCheckboxes .a-Table-table > tbody > tr > td {
12051
+ .a-TableSelection .a-Table-table > thead > tr > th,
12052
+ .a-TableSelection .a-Table-table > tbody > tr > td {
11543
12053
  font-size: var(--fontSizeSm);
11544
12054
  padding-top: var(--gap-xs);
11545
12055
  padding-bottom: 0.375rem;
11546
12056
  vertical-align: middle;
11547
12057
  }
11548
- .a-TableCheckboxes .a-Table-table > thead > tr > th {
12058
+ .a-TableSelection .a-Table-table > thead > tr > th {
11549
12059
  padding-top: 0.375rem;
11550
12060
  }
11551
- .a-TableCheckboxes .a-Table-table > thead > tr > th:first-child,
11552
- .a-TableCheckboxes .a-Table-table > tbody > tr > td:first-child {
12061
+ .a-TableSelection .a-Table-table > thead > tr > th:first-child,
12062
+ .a-TableSelection .a-Table-table > tbody > tr > td:first-child {
11553
12063
  padding-left: 0.625rem;
11554
12064
  padding-right: 0;
11555
12065
  }
11556
- .a-TableCheckboxes .a-Table-table > thead > tr > th:last-child,
11557
- .a-TableCheckboxes .a-Table-table > tbody > tr > td:last-child {
12066
+ .a-TableSelection .a-Table-table > thead > tr > th:last-child,
12067
+ .a-TableSelection .a-Table-table > tbody > tr > td:last-child {
11558
12068
  padding-right: var(--gap-md);
11559
12069
  }
11560
- .a-TableCheckboxes .a-Table-table > tbody > tr {
12070
+ .a-TableSelection .a-Table-table > tbody > tr {
11561
12071
  cursor: pointer;
11562
12072
  }
12073
+ .a-TableSelection .a-Table-table > tbody > tr.is-active {
12074
+ color: var(--Form-select-menu-onActive-color);
12075
+ background: var(--Form-select-menu-onActive-bg);
12076
+ }
11563
12077
 
11564
- .a-TreeCheckboxes .a-Table-expandBtn,
11565
- .a-TreeRadios .a-Table-expandBtn {
12078
+ .a-TreeSelection .a-Table-expandBtn {
11566
12079
  color: var(--icon-color);
11567
12080
  margin-right: 5px;
11568
12081
  }
11569
- .a-TreeCheckboxes-sublist,
11570
- .a-TreeRadios-sublist {
12082
+ .a-TreeSelection-sublist {
11571
12083
  position: relative;
11572
12084
  margin: 0 0 0 2.1875rem;
11573
12085
  display: none;
11574
12086
  }
11575
- .a-TreeCheckboxes-sublist:before,
11576
- .a-TreeRadios-sublist:before {
12087
+ .a-TreeSelection-sublist:before {
11577
12088
  width: 1px;
11578
12089
  content: "";
11579
12090
  display: block;
@@ -11583,26 +12094,16 @@ fieldset.a-Collapse--lg:after {
11583
12094
  left: -19px;
11584
12095
  border-left: dashed 1px var(--icon-color);
11585
12096
  }
11586
- .a-TreeCheckboxes-item,
11587
- .a-TreeRadios-item {
12097
+ .a-TreeSelection-item {
11588
12098
  position: relative;
11589
12099
  }
11590
- .a-TreeCheckboxes-item.is-expanded > .a-TreeCheckboxes-sublist,
11591
- .a-TreeCheckboxes-item.is-expanded > .a-TreeRadios-sublist,
11592
- .a-TreeRadios-item.is-expanded > .a-TreeCheckboxes-sublist,
11593
- .a-TreeRadios-item.is-expanded > .a-TreeRadios-sublist {
12100
+ .a-TreeSelection-item.is-expanded > .a-TreeSelection-sublist {
11594
12101
  display: block;
11595
12102
  }
11596
- .a-TreeCheckboxes-item:not(:last-child) > .a-TreeCheckboxes-sublist:before,
11597
- .a-TreeCheckboxes-item:not(:last-child) > .a-TreeRadios-sublist:before,
11598
- .a-TreeRadios-item:not(:last-child) > .a-TreeCheckboxes-sublist:before,
11599
- .a-TreeRadios-item:not(:last-child) > .a-TreeRadios-sublist:before {
12103
+ .a-TreeSelection-item:not(:last-child) > .a-TreeSelection-sublist:before {
11600
12104
  bottom: 0;
11601
12105
  }
11602
- .a-TreeCheckboxes-sublist .a-TreeCheckboxes-item:before,
11603
- .a-TreeCheckboxes-sublist .a-TreeRadios-item:before,
11604
- .a-TreeRadios-sublist .a-TreeCheckboxes-item:before,
11605
- .a-TreeRadios-sublist .a-TreeRadios-item:before {
12106
+ .a-TreeSelection-sublist .a-TreeSelection-item:before {
11606
12107
  height: 1px;
11607
12108
  content: "";
11608
12109
  display: block;
@@ -11612,8 +12113,7 @@ fieldset.a-Collapse--lg:after {
11612
12113
  left: -19px;
11613
12114
  border-top: dashed 1px var(--icon-color);
11614
12115
  }
11615
- .a-TreeCheckboxes-itemInner,
11616
- .a-TreeRadios-itemInner {
12116
+ .a-TreeSelection-itemInner {
11617
12117
  display: flex;
11618
12118
  align-items: center;
11619
12119
  height: var(--Form-input-height);
@@ -11625,18 +12125,15 @@ fieldset.a-Collapse--lg:after {
11625
12125
  user-select: none;
11626
12126
  position: relative;
11627
12127
  }
11628
- .a-TreeCheckboxes-itemInner > .a-Checkbox,
11629
- .a-TreeRadios-itemInner > .a-Checkbox {
12128
+ .a-TreeSelection-itemInner > .a-Checkbox {
11630
12129
  margin-right: 0;
11631
12130
  margin-left: var(--gap-sm);
11632
12131
  }
11633
- .a-TreeCheckboxes-itemInner > *,
11634
- .a-TreeRadios-itemInner > * {
12132
+ .a-TreeSelection-itemInner > * {
11635
12133
  position: relative;
11636
12134
  z-index: 2;
11637
12135
  }
11638
- .a-TreeCheckboxes-itemInner:hover:after,
11639
- .a-TreeRadios-itemInner:hover:after {
12136
+ .a-TreeSelection-itemInner:hover:after {
11640
12137
  position: absolute;
11641
12138
  content: "";
11642
12139
  z-index: 1;
@@ -11646,21 +12143,17 @@ fieldset.a-Collapse--lg:after {
11646
12143
  left: -99999px;
11647
12144
  background: var(--Tree-item-onHover-bg);
11648
12145
  }
11649
- .a-TreeCheckboxes-itemInner.is-active,
11650
- .a-TreeRadios-itemInner.is-active {
12146
+ .a-TreeSelection-itemInner.is-active {
11651
12147
  color: var(--Form-select-menu-onActive-color);
11652
12148
  }
11653
- .a-TreeCheckboxes-itemInner.is-disabled,
11654
- .a-TreeRadios-itemInner.is-disabled {
12149
+ .a-TreeSelection-itemInner.is-disabled {
11655
12150
  pointer-events: none;
11656
12151
  color: var(--text--muted-color);
11657
12152
  }
11658
- .a-TreeCheckboxes-itemLabel,
11659
- .a-TreeRadios-itemLabel {
12153
+ .a-TreeSelection-itemLabel {
11660
12154
  flex-grow: 1;
11661
12155
  }
11662
- .a-TreeCheckboxes-placeholder,
11663
- .a-TreeRadios-placeholder {
12156
+ .a-TreeSelection-placeholder {
11664
12157
  height: var(--Form-input-height);
11665
12158
  line-height: var(--Form-input-lineHeight);
11666
12159
  font-size: var(--Form-input-fontSize);
@@ -11668,23 +12161,23 @@ fieldset.a-Collapse--lg:after {
11668
12161
  color: var(--text--muted-color);
11669
12162
  }
11670
12163
 
11671
- .a-ChainedCheckboxes {
12164
+ .a-ChainedSelection {
11672
12165
  display: flex;
11673
12166
  flex-direction: row;
11674
12167
  }
11675
- .a-ChainedCheckboxes-col {
12168
+ .a-ChainedSelection-col {
11676
12169
  flex-grow: 1;
11677
12170
  min-width: 150px;
11678
12171
  }
11679
- .a-ChainedCheckboxes-col:not(:last-child) {
12172
+ .a-ChainedSelection-col:not(:last-child) {
11680
12173
  border-right: 1px solid var(--borderColor);
11681
12174
  }
11682
- .a-ChainedCheckboxes-subTitle {
12175
+ .a-ChainedSelection-subTitle {
11683
12176
  font-size: var(--fontSizeSm);
11684
12177
  padding: var(--gap-xs) var(--gap-xs);
11685
12178
  color: var(--text--muted-color);
11686
12179
  }
11687
- .a-ChainedCheckboxes-item {
12180
+ .a-ChainedSelection-item {
11688
12181
  display: flex;
11689
12182
  height: var(--Form-input-height);
11690
12183
  line-height: var(--Form-input-lineHeight);
@@ -11694,24 +12187,24 @@ fieldset.a-Collapse--lg:after {
11694
12187
  cursor: pointer;
11695
12188
  user-select: none;
11696
12189
  }
11697
- .a-ChainedCheckboxes-item > .a-Checkbox {
12190
+ .a-ChainedSelection-item > .a-Checkbox {
11698
12191
  margin-right: 0;
11699
12192
  }
11700
- .a-ChainedCheckboxes-item.is-active {
12193
+ .a-ChainedSelection-item.is-active {
11701
12194
  color: var(--Form-select-menu-onActive-color);
11702
12195
  background: var(--Form-select-menu-onActive-bg);
11703
12196
  }
11704
- .a-ChainedCheckboxes-item:hover {
12197
+ .a-ChainedSelection-item:hover {
11705
12198
  background: var(--Tree-item-onHover-bg);
11706
12199
  }
11707
- .a-ChainedCheckboxes-item.is-disabled {
12200
+ .a-ChainedSelection-item.is-disabled {
11708
12201
  pointer-events: none;
11709
12202
  color: var(--text--muted-color);
11710
12203
  }
11711
- .a-ChainedCheckboxes-itemLabel {
12204
+ .a-ChainedSelection-itemLabel {
11712
12205
  flex-grow: 1;
11713
12206
  }
11714
- .a-ChainedCheckboxes-placeholder {
12207
+ .a-ChainedSelection-placeholder {
11715
12208
  height: var(--Form-input-height);
11716
12209
  line-height: var(--Form-input-lineHeight);
11717
12210
  font-size: var(--Form-input-fontSize);
@@ -11719,28 +12212,29 @@ fieldset.a-Collapse--lg:after {
11719
12212
  color: var(--text--muted-color);
11720
12213
  }
11721
12214
 
11722
- .a-AssociatedCheckboxes {
12215
+ .a-AssociatedSelection {
11723
12216
  display: flex;
11724
12217
  flex-direction: row;
11725
12218
  }
11726
- .a-AssociatedCheckboxes-left, .a-AssociatedCheckboxes-right {
12219
+ .a-AssociatedSelection-left, .a-AssociatedSelection-right {
11727
12220
  flex-grow: 1;
11728
12221
  width: 0;
11729
- height: 10.9375rem;
12222
+ min-height: 12.5rem;
12223
+ max-height: 25rem;
11730
12224
  overflow: auto;
11731
12225
  }
11732
- .a-AssociatedCheckboxes-left {
12226
+ .a-AssociatedSelection-left {
11733
12227
  border-right: 1px solid var(--borderColor);
11734
12228
  }
11735
- .a-AssociatedCheckboxes-reload {
12229
+ .a-AssociatedSelection-reload {
11736
12230
  text-align: center;
11737
12231
  color: var(--info);
11738
12232
  margin: 20px 0 0;
11739
12233
  }
11740
- .a-AssociatedCheckboxes-reload.is-clickable {
12234
+ .a-AssociatedSelection-reload.is-clickable {
11741
12235
  cursor: pointer;
11742
12236
  }
11743
- .a-AssociatedCheckboxes-box {
12237
+ .a-AssociatedSelection-box {
11744
12238
  line-height: var(--Form-input-lineHeight);
11745
12239
  font-size: var(--fontSizeSm);
11746
12240
  color: var(--text--muted-color);
@@ -11751,7 +12245,7 @@ fieldset.a-Collapse--lg:after {
11751
12245
  justify-content: center;
11752
12246
  height: 100%;
11753
12247
  }
11754
- .a-AssociatedCheckboxes-box > p {
12248
+ .a-AssociatedSelection-box > p {
11755
12249
  text-align: center;
11756
12250
  margin: 10px 0 20px;
11757
12251
  color: var(--text--muted-color);
@@ -12642,7 +13136,7 @@ fieldset.a-Collapse--lg:after {
12642
13136
  .a-ColorPicker-preview {
12643
13137
  display: flex;
12644
13138
  align-items: center;
12645
- margin-left: var(--gap-xs);
13139
+ margin-right: var(--gap-sm);
12646
13140
  cursor: pointer;
12647
13141
  }
12648
13142
  .a-ColorPicker-previewIcon {
@@ -12670,15 +13164,40 @@ fieldset.a-Collapse--lg:after {
12670
13164
  .a-ColorPicker-clear:hover svg {
12671
13165
  fill: var(--Form-input-onHover-iconColor);
12672
13166
  }
13167
+ .a-ColorPicker-arrow {
13168
+ margin-right: var(--gap-xs);
13169
+ width: var(--gap-md);
13170
+ text-align: center;
13171
+ display: flex;
13172
+ align-items: center;
13173
+ justify-content: center;
13174
+ line-height: 1;
13175
+ }
13176
+ .a-ColorPicker-arrow > svg {
13177
+ transition: transform var(--animation-duration);
13178
+ display: inline-block;
13179
+ color: var(--Form-select-caret-iconColor);
13180
+ width: 10px;
13181
+ height: 10px;
13182
+ top: 0;
13183
+ }
13184
+ .a-ColorPicker.is-opened .a-ColorPicker-arrow > svg {
13185
+ transform: rotate(180deg);
13186
+ }
13187
+
13188
+ .a-ColorPicker-popover {
13189
+ border: none;
13190
+ box-shadow: none;
13191
+ }
12673
13192
 
12674
13193
  .a-ColorControl:not(.is-inline) > .a-ColorPicker {
12675
13194
  display: flex;
12676
13195
  }
12677
13196
 
12678
13197
  .sketch-picker {
12679
- box-shadow: none !important;
12680
- border-radius: 0 !important;
12681
13198
  border: none !important;
13199
+ border-radius: var(--borderRadius) !important;
13200
+ box-shadow: var(--ColorPicker-boxShadow) !important;
12682
13201
  }
12683
13202
 
12684
13203
  .a-DatePicker {
@@ -13498,6 +14017,15 @@ td.rdtQuarter.rdtDisabled > span {
13498
14017
  height: 100%;
13499
14018
  }
13500
14019
 
14020
+ .a-FileControl-templateInfo {
14021
+ display: block;
14022
+ margin-bottom: var(--gap-base);
14023
+ padding: var(--Button-paddingY) var(--Button-paddingX);
14024
+ cursor: pointer;
14025
+ }
14026
+ .a-FileControl-templateInfo > svg {
14027
+ margin-right: var(--gap-xs);
14028
+ }
13501
14029
  .a-FileControl-dropzone {
13502
14030
  outline: none;
13503
14031
  }
@@ -14070,6 +14598,9 @@ td.rdtQuarter.rdtDisabled > span {
14070
14598
  .a-Tree.is-disabled {
14071
14599
  pointer-events: none;
14072
14600
  }
14601
+ .a-Tree.is-draggable {
14602
+ position: relative;
14603
+ }
14073
14604
  .a-Tree--outline .a-Tree-sublist .a-Tree-item--isLeaf:before {
14074
14605
  position: absolute;
14075
14606
  top: -8px;
@@ -14103,6 +14634,9 @@ td.rdtQuarter.rdtDisabled > span {
14103
14634
  bottom: 0;
14104
14635
  left: -99999px;
14105
14636
  }
14637
+ .a-Tree.is-draggable .a-Tree-itemLabel:hover::after {
14638
+ display: none;
14639
+ }
14106
14640
  .a-Tree-item-icons {
14107
14641
  visibility: hidden;
14108
14642
  transition: visibility var(--animation-duration) ease;
@@ -14199,6 +14733,10 @@ td.rdtQuarter.rdtDisabled > span {
14199
14733
  display: inline-block;
14200
14734
  width: calc(var(--Tree-itemArrowWidth) + var(--gap-xs));
14201
14735
  }
14736
+ .a-Tree-itemDrager {
14737
+ cursor: move;
14738
+ color: var(--icon-color);
14739
+ }
14202
14740
  .a-Tree-spinner {
14203
14741
  margin-right: var(--gap-xs);
14204
14742
  }
@@ -14233,6 +14771,31 @@ td.rdtQuarter.rdtDisabled > span {
14233
14771
  .a-Tree-placeholder {
14234
14772
  color: var(--text--muted-color);
14235
14773
  }
14774
+ .a-Tree-dropIndicator {
14775
+ position: absolute;
14776
+ height: 0.125rem;
14777
+ background-color: var(--Tree-itemLabel--onChecked-color);
14778
+ border-radius: 0.0625rem;
14779
+ z-index: 1;
14780
+ }
14781
+ .a-Tree-dropIndicator::after {
14782
+ position: absolute;
14783
+ top: -0.1875rem;
14784
+ left: -0.375rem;
14785
+ width: 0.5rem;
14786
+ height: 0.5rem;
14787
+ background-color: transparent;
14788
+ border: 0.125rem solid var(--Tree-itemLabel--onChecked-color);
14789
+ border-radius: 50%;
14790
+ content: "";
14791
+ }
14792
+ .a-Tree-dropIndicator--hover {
14793
+ border-radius: 0;
14794
+ background-color: var(--Tree-item-onHover-bg);
14795
+ }
14796
+ .a-Tree-dropIndicator--hover::after {
14797
+ display: none;
14798
+ }
14236
14799
 
14237
14800
  .a-TreeSelectControl {
14238
14801
  position: relative;
@@ -14506,6 +15069,8 @@ td.rdtQuarter.rdtDisabled > span {
14506
15069
  }
14507
15070
  .a-Combo--hor .a-Combo-itemDrager {
14508
15071
  padding: var(--Combo--horizontal-dragger-top) 0.375rem 0 0;
15072
+ display: flex;
15073
+ align-items: center;
14509
15074
  }
14510
15075
  .a-Combo--ver:not(.a-Combo--noBorder)::before, .a-Combo--ver:not(.a-Combo--noBorder)::after {
14511
15076
  display: table;
@@ -14552,6 +15117,8 @@ td.rdtQuarter.rdtDisabled > span {
14552
15117
  position: absolute;
14553
15118
  top: var(--Combo--horizontal-dragger-top);
14554
15119
  left: -1.875rem;
15120
+ display: flex;
15121
+ align-items: center;
14555
15122
  }
14556
15123
  .a-Combo--ver:not(.a-Combo--noBorder).is-draggable > .a-Combo-items > .a-Combo-item {
14557
15124
  margin-left: 2.1875rem;
@@ -15080,16 +15647,16 @@ td.rdtQuarter.rdtDisabled > span {
15080
15647
  flex-direction: column;
15081
15648
  border-radius: var(--borderRadius);
15082
15649
  }
15083
- .a-Transfer-select > .a-Transfer-checkboxes, .a-Transfer-result > .a-Transfer-selections {
15650
+ .a-Transfer-select > .a-Transfer-selection, .a-Transfer-result > .a-Transfer-value {
15084
15651
  flex-grow: 1;
15085
15652
  max-height: 100%;
15086
15653
  overflow: auto;
15087
15654
  position: relative;
15088
15655
  }
15089
- .a-Transfer-search + .a-Transfer-checkboxes {
15656
+ .a-Transfer-search + .a-Transfer-selection {
15090
15657
  border-top: 1px solid var(--borderColor);
15091
15658
  }
15092
- .a-Transfer-checkboxes .a-ListCheckboxes-placeholder {
15659
+ .a-Transfer-selection .a-ListSelection-placeholder {
15093
15660
  height: 100%;
15094
15661
  display: flex;
15095
15662
  align-items: center;
@@ -15128,12 +15695,27 @@ td.rdtQuarter.rdtDisabled > span {
15128
15695
  pointer-events: none;
15129
15696
  color: var(--text--muted-color);
15130
15697
  }
15131
- .a-Transfer-tabs {
15698
+
15699
+ .a-TabsTransfer .a-Transfer-title {
15700
+ height: 40px;
15701
+ }
15702
+ .a-TabsTransfer-placeholder {
15703
+ height: var(--Form-input-height);
15704
+ line-height: var(--Form-input-lineHeight);
15705
+ font-size: var(--Form-input-fontSize);
15706
+ padding: calc( ( var(--Form-input-height) - var(--Form-input-lineHeight) * var(--Form-input-fontSize) ) / 2 ) var(--gap-sm);
15707
+ color: var(--text--muted-color);
15708
+ }
15709
+ .a-TabsTransfer-tab {
15710
+ padding: 0;
15711
+ overflow: auto;
15712
+ }
15713
+ .a-TabsTransfer-tabs {
15132
15714
  display: flex;
15133
15715
  flex-direction: column;
15134
15716
  height: 100%;
15135
15717
  }
15136
- .a-Transfer-tabs > .a-Tabs-links {
15718
+ .a-TabsTransfer-tabs > .a-Tabs-links {
15137
15719
  border-top: 0 none;
15138
15720
  padding: 5px 0 0 5px;
15139
15721
  display: flex;
@@ -15141,51 +15723,41 @@ td.rdtQuarter.rdtDisabled > span {
15141
15723
  flex-wrap: wrap;
15142
15724
  align-items: center;
15143
15725
  }
15144
- .a-Transfer-tabs > .a-Tabs-links > .a-Tabs-link > a:first-child {
15726
+ .a-TabsTransfer-tabs > .a-Tabs-links > .a-Tabs-link > a:first-child {
15145
15727
  font-size: 12px;
15146
15728
  padding: 7px 8px;
15147
15729
  }
15148
- .a-Transfer-tabs > .a-Tabs-links .a-TabsTransfer-tabsMid {
15730
+ .a-TabsTransfer-tabs > .a-Tabs-links .a-TabsTransfer-tabsMid {
15149
15731
  flex-grow: 1;
15150
15732
  }
15151
- .a-Transfer-tabs > .a-Tabs-links > .a-SearchBox {
15733
+ .a-TabsTransfer-tabs > .a-Tabs-links > .a-SearchBox {
15152
15734
  margin: -5px 5px 0 10px;
15153
15735
  }
15154
- .a-Transfer-tabs > .a-Tabs-links > .a-SearchBox.is-active {
15736
+ .a-TabsTransfer-tabs > .a-Tabs-links > .a-SearchBox.is-active {
15155
15737
  width: 150px;
15156
15738
  margin-right: 10px;
15157
15739
  padding-left: 10px;
15158
15740
  }
15159
- .a-Transfer-tabs > .a-Tabs-content {
15741
+ .a-TabsTransfer-tabs > .a-Tabs-content {
15160
15742
  flex-grow: 1;
15743
+ min-height: 0;
15161
15744
  position: relative;
15162
15745
  padding: 5px 0 0;
15163
15746
  }
15164
- .a-Transfer-tabs > .a-Tabs-content > .a-Tabs-pane {
15747
+ .a-TabsTransfer-tabs > .a-Tabs-content > .a-Tabs-pane {
15165
15748
  position: relative;
15166
- min-height: 100%;
15749
+ height: 100%;
15167
15750
  }
15168
- .a-Transfer-tabs > .a-Tabs-content > .a-Tabs-pane.is-active {
15751
+ .a-TabsTransfer-tabs > .a-Tabs-content > .a-Tabs-pane.is-active {
15169
15752
  display: flex;
15170
15753
  flex-direction: column;
15171
15754
  }
15172
- .a-Transfer-tabs > .a-Tabs-content > .a-Tabs-pane.is-active > .a-Transfer-checkboxes {
15755
+ .a-TabsTransfer-tabs > .a-Tabs-content > .a-Tabs-pane.is-active > .a-Transfer-selection {
15173
15756
  flex-grow: 1;
15174
15757
  max-height: 100%;
15175
15758
  overflow: auto;
15176
15759
  }
15177
15760
 
15178
- .a-TabsTransfer .a-Transfer-title {
15179
- height: 40px;
15180
- }
15181
- .a-TabsTransfer-placeholder {
15182
- height: var(--Form-input-height);
15183
- line-height: var(--Form-input-lineHeight);
15184
- font-size: var(--Form-input-fontSize);
15185
- padding: calc( ( var(--Form-input-height) - var(--Form-input-lineHeight) * var(--Form-input-fontSize) ) / 2 ) var(--gap-sm);
15186
- color: var(--text--muted-color);
15187
- }
15188
-
15189
15761
  .a-TransferControl {
15190
15762
  position: relative;
15191
15763
  }
@@ -15193,6 +15765,51 @@ td.rdtQuarter.rdtDisabled > span {
15193
15765
  display: inline-block;
15194
15766
  }
15195
15767
 
15768
+ .a-TransferPicker-icon {
15769
+ transition: transform var(--animation-duration) ease-out;
15770
+ margin: 5px 5px 5px auto;
15771
+ display: flex;
15772
+ color: var(--Form-select-caret-iconColor);
15773
+ }
15774
+ .a-TransferPicker-icon:hover {
15775
+ color: var(--Form-select-caret-onHover-iconColor);
15776
+ }
15777
+ .a-TransferPicker-icon > svg {
15778
+ width: 0.75rem;
15779
+ height: 0.75rem;
15780
+ top: 0;
15781
+ }
15782
+
15783
+ .a-TransferDropDown-icon {
15784
+ transition: transform var(--animation-duration) ease-out;
15785
+ margin: 5px 5px 5px auto;
15786
+ display: flex;
15787
+ color: var(--Form-select-caret-iconColor);
15788
+ }
15789
+ .a-TransferDropDown-icon:hover {
15790
+ color: var(--Form-select-caret-onHover-iconColor);
15791
+ }
15792
+ .a-TransferDropDown-icon > svg {
15793
+ width: 0.625rem;
15794
+ height: 0.625rem;
15795
+ top: 0;
15796
+ }
15797
+ .a-TransferDropDown.is-active .a-TransferDropDown-icon {
15798
+ transform: rotate(180deg);
15799
+ }
15800
+
15801
+ .a-TransferDropDown-content {
15802
+ min-height: 12.5rem;
15803
+ display: flex;
15804
+ flex-direction: column;
15805
+ }
15806
+ .a-TransferDropDown-content > .a-Transfer-selection {
15807
+ flex-grow: 1;
15808
+ max-height: 100%;
15809
+ overflow: auto;
15810
+ position: relative;
15811
+ }
15812
+
15196
15813
  .a-NestedSelectControl {
15197
15814
  position: relative;
15198
15815
  }
@@ -15793,22 +16410,70 @@ td.rdtQuarter.rdtDisabled > span {
15793
16410
  min-width: var(--Form-control-widthSm);
15794
16411
  }
15795
16412
 
16413
+ .a-Form--column {
16414
+ display: flex;
16415
+ flex-wrap: wrap;
16416
+ margin-left: calc(var(--Form-group-gutterWidth) / -2);
16417
+ margin-right: calc(var(--Form-group-gutterWidth) / -2);
16418
+ }
16419
+ .a-Form--column > .a-Form-item {
16420
+ flex-grow: 1;
16421
+ padding-left: calc(var(--Form-group-gutterWidth) / 2);
16422
+ padding-right: calc(var(--Form-group-gutterWidth) / 2);
16423
+ }
16424
+
16425
+ .a-Form--column-2 > .a-Form-item {
16426
+ width: 50%;
16427
+ }
16428
+
16429
+ .a-Form--column-3 > .a-Form-item {
16430
+ width: 33%;
16431
+ }
16432
+
16433
+ .a-Form--column-4 > .a-Form-item {
16434
+ width: 25%;
16435
+ }
16436
+
16437
+ .a-Form--column-5 > .a-Form-item {
16438
+ width: 20%;
16439
+ }
16440
+
16441
+ .a-Form--column-6 > .a-Form-item {
16442
+ width: 16.6%;
16443
+ }
16444
+
16445
+ .a-Form--column-7 > .a-Form-item {
16446
+ width: 14.2%;
16447
+ }
16448
+
16449
+ .a-Form--column-8 > .a-Form-item {
16450
+ width: 12.5%;
16451
+ }
16452
+
16453
+ .a-Form-column-9 > .a-Form-item {
16454
+ width: 11.1%;
16455
+ }
16456
+
16457
+ .a-Form-column-10 > .a-Form-item {
16458
+ width: 10%;
16459
+ }
16460
+
15796
16461
  .a-AnchorNav {
15797
16462
  display: flex;
15798
16463
  height: 25rem;
15799
16464
  }
15800
- .a-AnchorNav-link-wrap {
16465
+ .a-AnchorNav--vertical .a-AnchorNav-link-wrap {
15801
16466
  margin: 0;
15802
16467
  padding: 0;
15803
16468
  width: var(--Tabs--vertical-width);
15804
16469
  border-right: var(--AnchorNav-links-container-borderRight);
15805
16470
  padding-bottom: 3.75rem;
15806
16471
  }
15807
- .a-AnchorNav-link-wrap > .a-AnchorNav-link {
16472
+ .a-AnchorNav--vertical .a-AnchorNav-link-wrap > .a-AnchorNav-link {
15808
16473
  position: relative;
15809
16474
  display: block;
15810
16475
  }
15811
- .a-AnchorNav-link-wrap > .a-AnchorNav-link > a {
16476
+ .a-AnchorNav--vertical .a-AnchorNav-link-wrap > .a-AnchorNav-link > a {
15812
16477
  display: block;
15813
16478
  border: var(--Tabs-borderWidth) solid transparent;
15814
16479
  border-width: var(--AnchorNav-onActive-borderWidth);
@@ -15821,18 +16486,65 @@ td.rdtQuarter.rdtDisabled > span {
15821
16486
  cursor: pointer;
15822
16487
  margin: 0;
15823
16488
  }
15824
- .a-AnchorNav-link-wrap > .a-AnchorNav-link > a:hover {
16489
+ .a-AnchorNav--vertical .a-AnchorNav-link-wrap > .a-AnchorNav-link > a:hover {
15825
16490
  color: var(--primary);
15826
16491
  }
15827
- .a-AnchorNav-link-wrap > .a-AnchorNav-link.is-active > a,
15828
- .a-AnchorNav-link-wrap > .a-AnchorNav-link.is-active > a:hover {
16492
+ .a-AnchorNav--vertical .a-AnchorNav-link-wrap > .a-AnchorNav-link.is-active > a,
16493
+ .a-AnchorNav--vertical .a-AnchorNav-link-wrap > .a-AnchorNav-link.is-active > a:hover {
15829
16494
  color: var(--Tabs--vertical-onActive-color);
15830
16495
  border-color: var(--Tabs--vertical-onActive-border);
15831
16496
  }
16497
+ .a-AnchorNav--horizontal {
16498
+ flex-direction: column;
16499
+ }
16500
+ .a-AnchorNav--horizontal .a-AnchorNav-link-wrap {
16501
+ user-select: none;
16502
+ margin: 0px;
16503
+ padding: 0px;
16504
+ border-bottom: var(--Tabs-borderWidth) solid var(--Tabs-borderColor);
16505
+ list-style: none;
16506
+ }
16507
+ .a-AnchorNav--horizontal .a-AnchorNav-link-wrap > .a-AnchorNav-link {
16508
+ margin-bottom: calc(var(--Tabs-borderWidth) * -1);
16509
+ display: inline-block;
16510
+ position: relative;
16511
+ }
16512
+ .a-AnchorNav--horizontal .a-AnchorNav-link-wrap > .a-AnchorNav-link > a:first-child {
16513
+ font-size: var(--Tabs-linkFontSize);
16514
+ outline: 0;
16515
+ border: var(--Tabs-borderWidth) solid transparent;
16516
+ border-width: 0 0 var(--Tabs--line-borderWidth) 0;
16517
+ border-top-left-radius: var(--Tabs-borderRadius);
16518
+ border-top-right-radius: var(--Tabs-borderRadius);
16519
+ color: var(--Tabs-color);
16520
+ margin: var(--Tabs-linkMargin);
16521
+ padding: var(--Tabs-linkPadding);
16522
+ text-decoration: none;
16523
+ cursor: pointer;
16524
+ display: block;
16525
+ }
16526
+ .a-AnchorNav--horizontal .a-AnchorNav-link-wrap > .a-AnchorNav-link > a:first-child:hover, .a-AnchorNav--horizontal .a-AnchorNav-link-wrap > .a-AnchorNav-link > a:first-child:focus {
16527
+ color: var(--primary);
16528
+ background: transparent;
16529
+ border-color: transparent;
16530
+ }
16531
+ .a-AnchorNav--horizontal .a-AnchorNav-link-wrap > .a-AnchorNav-link:last-child > a {
16532
+ margin: 0;
16533
+ }
16534
+ .a-AnchorNav--horizontal .a-AnchorNav-link-wrap > .a-AnchorNav-link.is-active > a:first-child,
16535
+ .a-AnchorNav--horizontal .a-AnchorNav-link-wrap > .a-AnchorNav-link.is-active > a:first-child:hover,
16536
+ .a-AnchorNav--horizontal .a-AnchorNav-link-wrap > .a-AnchorNav-link.is-active > a:first-child:focus {
16537
+ font-size: var(--Tabs-linkFontSize);
16538
+ border-width: 0 0 var(--Tabs--line-borderWidth) 0;
16539
+ border-color: var(--Tabs--line-onHover-borderColor);
16540
+ color: var(--Tabs--line-onHover-color);
16541
+ background: transparent;
16542
+ }
15832
16543
  .a-AnchorNav-section-wrap {
15833
16544
  border: none;
15834
16545
  flex-grow: 1;
15835
16546
  overflow: auto;
16547
+ scroll-behavior: smooth;
15836
16548
  background: var(--Tabs-content-bg);
15837
16549
  }
15838
16550
  .a-AnchorNav-section-wrap > .a-AnchorNav-section {