@ng-matero/extensions 12.5.3 → 13.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (559) hide show
  1. package/README.md +2 -16
  2. package/_all-color.scss +1 -1
  3. package/_all-theme.scss +2 -0
  4. package/_index.scss +3 -1
  5. package/_theming.scss +3 -1
  6. package/alert/_alert-theme.scss +2 -2
  7. package/alert/alert.component.d.ts +3 -0
  8. package/alert/alert.module.d.ts +6 -0
  9. package/alert/mtxAlert.d.ts +1 -0
  10. package/alert/package.json +5 -6
  11. package/button/button-loading.directive.d.ts +3 -0
  12. package/button/button.module.d.ts +8 -0
  13. package/button/mtxButton.d.ts +1 -0
  14. package/button/package.json +5 -6
  15. package/checkbox-group/checkbox-group.component.d.ts +3 -0
  16. package/checkbox-group/checkbox-group.module.d.ts +9 -0
  17. package/checkbox-group/mtxCheckboxGroup.d.ts +1 -0
  18. package/checkbox-group/package.json +5 -6
  19. package/colorpicker/_colorpicker-theme.import.scss +2 -0
  20. package/colorpicker/_colorpicker-theme.scss +43 -0
  21. package/colorpicker/colorpicker-animations.d.ts +8 -0
  22. package/colorpicker/colorpicker-content.scss +4 -0
  23. package/colorpicker/colorpicker-input.d.ts +92 -0
  24. package/colorpicker/colorpicker-module.d.ts +15 -0
  25. package/colorpicker/colorpicker-toggle.d.ts +38 -0
  26. package/colorpicker/colorpicker-toggle.scss +23 -0
  27. package/colorpicker/colorpicker.d.ts +131 -0
  28. package/{extensions.d.ts → colorpicker/mtxColorpicker.d.ts} +1 -0
  29. package/colorpicker/package.json +10 -0
  30. package/colorpicker/public-api.d.ts +5 -0
  31. package/column-resize/column-resize-directives/column-resize-flex.d.ts +3 -0
  32. package/column-resize/column-resize-directives/column-resize.d.ts +3 -0
  33. package/column-resize/column-resize-module.d.ts +6 -7
  34. package/column-resize/column-resize-notifier.d.ts +5 -7
  35. package/column-resize/column-resize.d.ts +3 -0
  36. package/column-resize/column-size-store.d.ts +3 -7
  37. package/column-resize/event-dispatcher.d.ts +3 -0
  38. package/column-resize/mtxColumnResize.d.ts +1 -0
  39. package/column-resize/overlay-handle.d.ts +3 -0
  40. package/column-resize/package.json +5 -6
  41. package/column-resize/resizable.d.ts +3 -0
  42. package/column-resize/resize-strategy.d.ts +7 -0
  43. package/core/datetime/datetime.module.d.ts +8 -0
  44. package/core/datetime/native-datetime-adapter.d.ts +3 -0
  45. package/core/density/private/_compatibility.scss +74 -0
  46. package/core/mtxCore.d.ts +1 -0
  47. package/core/package.json +5 -6
  48. package/{pipes/public-api.d.ts → core/pipes/index.d.ts} +0 -0
  49. package/core/pipes/pipes.module.d.ts +8 -0
  50. package/{pipes → core/pipes}/to-observable.pipe.d.ts +3 -0
  51. package/core/public-api.d.ts +1 -0
  52. package/core/style/_elevation.scss +197 -0
  53. package/core/style/_private.scss +41 -0
  54. package/core/style/_variables.scss +44 -0
  55. package/core/style/_vendor-prefixes.scss +60 -0
  56. package/core/theming/_palette.scss +746 -0
  57. package/core/theming/_theming.scss +430 -0
  58. package/core/typography/_typography-utils.scss +101 -0
  59. package/core/typography/_typography.scss +273 -0
  60. package/datetimepicker/_datetimepicker-theme.scss +17 -5
  61. package/datetimepicker/calendar-body.d.ts +3 -0
  62. package/datetimepicker/calendar-body.scss +5 -4
  63. package/datetimepicker/calendar.d.ts +6 -11
  64. package/datetimepicker/clock.d.ts +13 -9
  65. package/datetimepicker/datetimepicker-animations.d.ts +7 -5
  66. package/datetimepicker/datetimepicker-input.d.ts +7 -2
  67. package/datetimepicker/datetimepicker-module.d.ts +20 -0
  68. package/datetimepicker/datetimepicker-toggle.d.ts +20 -2
  69. package/datetimepicker/datetimepicker-toggle.scss +23 -0
  70. package/datetimepicker/datetimepicker-types.d.ts +1 -0
  71. package/datetimepicker/datetimepicker.d.ts +73 -25
  72. package/datetimepicker/month-view.d.ts +7 -4
  73. package/datetimepicker/mtxDatetimepicker.d.ts +1 -2
  74. package/datetimepicker/multi-year-view.d.ts +7 -4
  75. package/datetimepicker/package.json +5 -6
  76. package/datetimepicker/public-api.d.ts +4 -1
  77. package/datetimepicker/year-view.d.ts +7 -4
  78. package/dialog/{dialog.config.d.ts → dialog-config.d.ts} +0 -0
  79. package/dialog/dialog.component.d.ts +4 -1
  80. package/dialog/dialog.d.ts +4 -1
  81. package/dialog/dialog.module.d.ts +10 -0
  82. package/dialog/mtxDialog.d.ts +1 -0
  83. package/dialog/package.json +5 -6
  84. package/dialog/public-api.d.ts +2 -2
  85. package/esm2020/alert/alert.component.mjs +52 -0
  86. package/esm2020/alert/alert.module.mjs +18 -0
  87. package/{esm2015/alert/mtxAlert.js → esm2020/alert/mtxAlert.mjs} +0 -0
  88. package/{esm2015/alert/public-api.js → esm2020/alert/public-api.mjs} +0 -0
  89. package/esm2020/button/button-loading.directive.mjs +79 -0
  90. package/esm2020/button/button.module.mjs +20 -0
  91. package/{esm2015/button/mtxButton.js → esm2020/button/mtxButton.mjs} +0 -0
  92. package/{esm2015/button/public-api.js → esm2020/button/public-api.mjs} +0 -0
  93. package/esm2020/checkbox-group/checkbox-group.component.mjs +234 -0
  94. package/{esm2015/checkbox-group/checkbox-group.interface.js → esm2020/checkbox-group/checkbox-group.interface.mjs} +0 -0
  95. package/esm2020/checkbox-group/checkbox-group.module.mjs +21 -0
  96. package/{esm2015/checkbox-group/mtxCheckboxGroup.js → esm2020/checkbox-group/mtxCheckboxGroup.mjs} +0 -0
  97. package/{esm2015/checkbox-group/public-api.js → esm2020/checkbox-group/public-api.mjs} +0 -0
  98. package/esm2020/colorpicker/colorpicker-animations.mjs +16 -0
  99. package/esm2020/colorpicker/colorpicker-input.mjs +228 -0
  100. package/esm2020/colorpicker/colorpicker-module.mjs +65 -0
  101. package/esm2020/colorpicker/colorpicker-toggle.mjs +90 -0
  102. package/esm2020/colorpicker/colorpicker.mjs +363 -0
  103. package/esm2020/colorpicker/mtxColorpicker.mjs +5 -0
  104. package/esm2020/colorpicker/public-api.mjs +6 -0
  105. package/esm2020/column-resize/column-resize-directives/column-resize-flex.mjs +45 -0
  106. package/esm2020/column-resize/column-resize-directives/column-resize.mjs +45 -0
  107. package/{esm2015/column-resize/column-resize-directives/constants.js → esm2020/column-resize/column-resize-directives/constants.mjs} +0 -0
  108. package/esm2020/column-resize/column-resize-module.mjs +28 -0
  109. package/esm2020/column-resize/column-resize-notifier.mjs +47 -0
  110. package/esm2020/column-resize/column-resize.mjs +82 -0
  111. package/esm2020/column-resize/column-size-store.mjs +20 -0
  112. package/esm2020/column-resize/event-dispatcher.mjs +67 -0
  113. package/{esm2015/column-resize/mtxColumnResize.js → esm2020/column-resize/mtxColumnResize.mjs} +0 -0
  114. package/esm2020/column-resize/overlay-handle.mjs +146 -0
  115. package/{esm2015/column-resize/polyfill.js → esm2020/column-resize/polyfill.mjs} +0 -0
  116. package/{esm2015/column-resize/public-api.js → esm2020/column-resize/public-api.mjs} +0 -0
  117. package/esm2020/column-resize/resizable.mjs +199 -0
  118. package/{esm2015/column-resize/resize-ref.js → esm2020/column-resize/resize-ref.mjs} +0 -0
  119. package/esm2020/column-resize/resize-strategy.mjs +232 -0
  120. package/{esm2015/column-resize/selectors.js → esm2020/column-resize/selectors.mjs} +0 -0
  121. package/{esm2015/core/datetime/datetime-adapter.js → esm2020/core/datetime/datetime-adapter.mjs} +0 -0
  122. package/{esm2015/core/datetime/datetime-formats.js → esm2020/core/datetime/datetime-formats.mjs} +0 -0
  123. package/esm2020/core/datetime/datetime.module.mjs +42 -0
  124. package/{esm2015/core/datetime/index.js → esm2020/core/datetime/index.mjs} +0 -0
  125. package/esm2020/core/datetime/native-datetime-adapter.mjs +138 -0
  126. package/{esm2015/core/datetime/native-datetime-formats.js → esm2020/core/datetime/native-datetime-formats.mjs} +0 -0
  127. package/{esm2015/core/mtxCore.js → esm2020/core/mtxCore.mjs} +0 -0
  128. package/esm2020/core/pipes/index.mjs +3 -0
  129. package/esm2020/core/pipes/pipes.module.mjs +18 -0
  130. package/esm2020/core/pipes/to-observable.pipe.mjs +15 -0
  131. package/{esm2015/core/public-api.js → esm2020/core/public-api.mjs} +2 -1
  132. package/esm2020/datetimepicker/calendar-body.mjs +78 -0
  133. package/esm2020/datetimepicker/calendar.mjs +618 -0
  134. package/esm2020/datetimepicker/clock.mjs +277 -0
  135. package/esm2020/datetimepicker/datetimepicker-animations.mjs +44 -0
  136. package/{esm2015/datetimepicker/datetimepicker-errors.js → esm2020/datetimepicker/datetimepicker-errors.mjs} +0 -0
  137. package/{esm2015/datetimepicker/datetimepicker-filtertype.js → esm2020/datetimepicker/datetimepicker-filtertype.mjs} +0 -0
  138. package/esm2020/datetimepicker/datetimepicker-input.mjs +344 -0
  139. package/esm2020/datetimepicker/datetimepicker-module.mjs +75 -0
  140. package/esm2020/datetimepicker/datetimepicker-toggle.mjs +94 -0
  141. package/esm2020/datetimepicker/datetimepicker-types.mjs +2 -0
  142. package/esm2020/datetimepicker/datetimepicker.mjs +492 -0
  143. package/esm2020/datetimepicker/month-view.mjs +148 -0
  144. package/esm2020/datetimepicker/mtxDatetimepicker.mjs +5 -0
  145. package/esm2020/datetimepicker/multi-year-view.mjs +214 -0
  146. package/esm2020/datetimepicker/public-api.mjs +14 -0
  147. package/esm2020/datetimepicker/year-view.mjs +138 -0
  148. package/{esm2015/dialog/dialog.config.js → esm2020/dialog/dialog-config.mjs} +1 -1
  149. package/esm2020/dialog/dialog.component.mjs +33 -0
  150. package/esm2020/dialog/dialog.mjs +74 -0
  151. package/esm2020/dialog/dialog.module.mjs +24 -0
  152. package/{esm2015/dialog/mtxDialog.js → esm2020/dialog/mtxDialog.mjs} +0 -0
  153. package/esm2020/dialog/public-api.mjs +5 -0
  154. package/esm2020/form-group/form-group.component.mjs +37 -0
  155. package/esm2020/form-group/form-group.module.mjs +18 -0
  156. package/{esm2015/form-group/mtxFormGroup.js → esm2020/form-group/mtxFormGroup.mjs} +0 -0
  157. package/{esm2015/form-group/public-api.js → esm2020/form-group/public-api.mjs} +0 -0
  158. package/esm2020/grid/cell.component.mjs +108 -0
  159. package/esm2020/grid/column-menu.component.mjs +95 -0
  160. package/esm2020/grid/column-resize/column-resize-directives/column-resize-flex.mjs +37 -0
  161. package/esm2020/grid/column-resize/column-resize-directives/column-resize.mjs +37 -0
  162. package/{esm2015/grid/column-resize/column-resize-directives/common.js → esm2020/grid/column-resize/column-resize-directives/common.mjs} +0 -0
  163. package/esm2020/grid/column-resize/column-resize-module.mjs +42 -0
  164. package/esm2020/grid/column-resize/overlay-handle.mjs +60 -0
  165. package/{esm2015/grid/column-resize/resizable-directives/common.js → esm2020/grid/column-resize/resizable-directives/common.mjs} +0 -0
  166. package/esm2020/grid/column-resize/resizable-directives/resizable.mjs +62 -0
  167. package/esm2020/grid/column-resize/resize-strategy.mjs +42 -0
  168. package/esm2020/grid/expansion-toggle.directive.mjs +64 -0
  169. package/esm2020/grid/grid.component.mjs +556 -0
  170. package/{esm2015/grid/grid.interface.js → esm2020/grid/grid.interface.mjs} +0 -0
  171. package/esm2020/grid/grid.module.mjs +117 -0
  172. package/esm2020/grid/grid.service.mjs +44 -0
  173. package/{esm2015/grid/mtxGrid.js → esm2020/grid/mtxGrid.mjs} +0 -0
  174. package/esm2020/grid/public-api.mjs +16 -0
  175. package/esm2020/loader/loader.component.mjs +63 -0
  176. package/esm2020/loader/loader.module.mjs +20 -0
  177. package/{esm2015/loader/mtxLoader.js → esm2020/loader/mtxLoader.mjs} +0 -0
  178. package/{esm2015/loader/public-api.js → esm2020/loader/public-api.mjs} +0 -0
  179. package/esm2020/ng-matero-extensions.mjs +5 -0
  180. package/{esm2015/popover/mtxPopover.js → esm2020/popover/mtxPopover.mjs} +0 -0
  181. package/{esm2015/popover/popover-animations.js → esm2020/popover/popover-animations.mjs} +0 -0
  182. package/{esm2015/popover/popover-errors.js → esm2020/popover/popover-errors.mjs} +0 -0
  183. package/{esm2015/popover/popover-interfaces.js → esm2020/popover/popover-interfaces.mjs} +0 -0
  184. package/esm2020/popover/popover-module.mjs +22 -0
  185. package/esm2020/popover/popover-target.mjs +17 -0
  186. package/esm2020/popover/popover-trigger.mjs +441 -0
  187. package/{esm2015/popover/popover-types.js → esm2020/popover/popover-types.mjs} +0 -0
  188. package/esm2020/popover/popover.mjs +334 -0
  189. package/{esm2015/popover/public-api.js → esm2020/popover/public-api.mjs} +0 -0
  190. package/{esm2015/progress/mtxProgress.js → esm2020/progress/mtxProgress.mjs} +0 -0
  191. package/esm2020/progress/progress.component.mjs +55 -0
  192. package/esm2020/progress/progress.module.mjs +18 -0
  193. package/{esm2015/progress/public-api.js → esm2020/progress/public-api.mjs} +0 -0
  194. package/esm2020/public-api.mjs +5 -0
  195. package/{esm2015/select/mtxSelect.js → esm2020/select/mtxSelect.mjs} +0 -0
  196. package/{esm2015/select/option.component.js → esm2020/select/option.component.mjs} +18 -26
  197. package/{esm2015/select/public-api.js → esm2020/select/public-api.mjs} +0 -0
  198. package/esm2020/select/select.component.mjs +458 -0
  199. package/esm2020/select/select.module.mjs +74 -0
  200. package/esm2020/select/templates.directive.mjs +124 -0
  201. package/{esm2015/slider/mtxSlider.js → esm2020/slider/mtxSlider.mjs} +0 -0
  202. package/{esm2015/slider/public-api.js → esm2020/slider/public-api.mjs} +0 -0
  203. package/esm2020/slider/slider-module.mjs +19 -0
  204. package/esm2020/slider/slider.mjs +1115 -0
  205. package/{esm2015/split/interface.js → esm2020/split/interface.mjs} +0 -0
  206. package/{esm2015/split/mtxSplit.js → esm2020/split/mtxSplit.mjs} +0 -0
  207. package/{esm2015/split/public-api.js → esm2020/split/public-api.mjs} +0 -0
  208. package/esm2020/split/split-pane.directive.mjs +149 -0
  209. package/esm2020/split/split.component.mjs +619 -0
  210. package/esm2020/split/split.module.mjs +19 -0
  211. package/esm2020/split/utils.mjs +222 -0
  212. package/{esm2015/text3d/mtxText3d.js → esm2020/text3d/mtxText3d.mjs} +0 -0
  213. package/{esm2015/text3d/public-api.js → esm2020/text3d/public-api.mjs} +0 -0
  214. package/esm2020/text3d/text3d.component.mjs +45 -0
  215. package/esm2020/text3d/text3d.module.mjs +18 -0
  216. package/{esm2015/tooltip/mtxTooltip.js → esm2020/tooltip/mtxTooltip.mjs} +0 -0
  217. package/{esm2015/tooltip/public-api.js → esm2020/tooltip/public-api.mjs} +0 -0
  218. package/{esm2015/tooltip/tooltip-animations.js → esm2020/tooltip/tooltip-animations.mjs} +0 -0
  219. package/esm2020/tooltip/tooltip-module.mjs +23 -0
  220. package/esm2020/tooltip/tooltip.mjs +674 -0
  221. package/fesm2015/mtxAlert.mjs +74 -0
  222. package/fesm2015/mtxAlert.mjs.map +1 -0
  223. package/fesm2015/mtxButton.mjs +102 -0
  224. package/fesm2015/mtxButton.mjs.map +1 -0
  225. package/fesm2015/mtxCheckboxGroup.mjs +257 -0
  226. package/fesm2015/mtxCheckboxGroup.mjs.map +1 -0
  227. package/fesm2015/mtxColorpicker.mjs +754 -0
  228. package/fesm2015/mtxColorpicker.mjs.map +1 -0
  229. package/fesm2015/{mtxColumnResize.js → mtxColumnResize.mjs} +108 -145
  230. package/fesm2015/mtxColumnResize.mjs.map +1 -0
  231. package/fesm2015/mtxCore.mjs +362 -0
  232. package/fesm2015/mtxCore.mjs.map +1 -0
  233. package/fesm2015/mtxDatetimepicker.mjs +2474 -0
  234. package/fesm2015/mtxDatetimepicker.mjs.map +1 -0
  235. package/fesm2015/mtxDialog.mjs +128 -0
  236. package/fesm2015/mtxDialog.mjs.map +1 -0
  237. package/fesm2015/mtxFormGroup.mjs +59 -0
  238. package/fesm2015/mtxFormGroup.mjs.map +1 -0
  239. package/fesm2015/mtxGrid.mjs +1271 -0
  240. package/fesm2015/mtxGrid.mjs.map +1 -0
  241. package/fesm2015/mtxLoader.mjs +87 -0
  242. package/fesm2015/mtxLoader.mjs.map +1 -0
  243. package/fesm2015/mtxPopover.mjs +865 -0
  244. package/fesm2015/mtxPopover.mjs.map +1 -0
  245. package/fesm2015/mtxProgress.mjs +77 -0
  246. package/fesm2015/mtxProgress.mjs.map +1 -0
  247. package/fesm2015/mtxSelect.mjs +712 -0
  248. package/fesm2015/mtxSelect.mjs.map +1 -0
  249. package/fesm2015/mtxSlider.mjs +1139 -0
  250. package/fesm2015/mtxSlider.mjs.map +1 -0
  251. package/fesm2015/{mtxSplit.js → mtxSplit.mjs} +85 -98
  252. package/fesm2015/mtxSplit.mjs.map +1 -0
  253. package/fesm2015/mtxText3d.mjs +67 -0
  254. package/fesm2015/mtxText3d.mjs.map +1 -0
  255. package/fesm2015/{mtxTooltip.js → mtxTooltip.mjs} +85 -86
  256. package/fesm2015/mtxTooltip.mjs.map +1 -0
  257. package/fesm2015/ng-matero-extensions.mjs +9 -0
  258. package/fesm2015/ng-matero-extensions.mjs.map +1 -0
  259. package/fesm2020/mtxAlert.mjs +74 -0
  260. package/fesm2020/mtxAlert.mjs.map +1 -0
  261. package/fesm2020/mtxButton.mjs +102 -0
  262. package/fesm2020/mtxButton.mjs.map +1 -0
  263. package/fesm2020/mtxCheckboxGroup.mjs +257 -0
  264. package/fesm2020/mtxCheckboxGroup.mjs.map +1 -0
  265. package/fesm2020/mtxColorpicker.mjs +750 -0
  266. package/fesm2020/mtxColorpicker.mjs.map +1 -0
  267. package/fesm2020/mtxColumnResize.mjs +953 -0
  268. package/fesm2020/mtxColumnResize.mjs.map +1 -0
  269. package/{fesm2015/mtxCore.js → fesm2020/mtxCore.mjs} +75 -42
  270. package/fesm2020/mtxCore.mjs.map +1 -0
  271. package/fesm2020/mtxDatetimepicker.mjs +2462 -0
  272. package/fesm2020/mtxDatetimepicker.mjs.map +1 -0
  273. package/fesm2020/mtxDialog.mjs +129 -0
  274. package/fesm2020/mtxDialog.mjs.map +1 -0
  275. package/fesm2020/mtxFormGroup.mjs +59 -0
  276. package/fesm2020/mtxFormGroup.mjs.map +1 -0
  277. package/fesm2020/mtxGrid.mjs +1259 -0
  278. package/fesm2020/mtxGrid.mjs.map +1 -0
  279. package/fesm2020/mtxLoader.mjs +87 -0
  280. package/fesm2020/mtxLoader.mjs.map +1 -0
  281. package/{fesm2015/mtxPopover.js → fesm2020/mtxPopover.mjs} +120 -111
  282. package/fesm2020/mtxPopover.mjs.map +1 -0
  283. package/fesm2020/mtxProgress.mjs +77 -0
  284. package/fesm2020/mtxProgress.mjs.map +1 -0
  285. package/fesm2020/mtxSelect.mjs +709 -0
  286. package/fesm2020/mtxSelect.mjs.map +1 -0
  287. package/{fesm2015/mtxSlider.js → fesm2020/mtxSlider.mjs} +97 -94
  288. package/fesm2020/mtxSlider.mjs.map +1 -0
  289. package/fesm2020/mtxSplit.mjs +1007 -0
  290. package/fesm2020/mtxSplit.mjs.map +1 -0
  291. package/fesm2020/mtxText3d.mjs +67 -0
  292. package/fesm2020/mtxText3d.mjs.map +1 -0
  293. package/fesm2020/mtxTooltip.mjs +718 -0
  294. package/fesm2020/mtxTooltip.mjs.map +1 -0
  295. package/fesm2020/ng-matero-extensions.mjs +9 -0
  296. package/fesm2020/ng-matero-extensions.mjs.map +1 -0
  297. package/form-group/_form-group-theme.scss +1 -1
  298. package/form-group/form-group.component.d.ts +5 -4
  299. package/form-group/form-group.module.d.ts +6 -0
  300. package/form-group/mtxFormGroup.d.ts +1 -0
  301. package/form-group/package.json +5 -6
  302. package/grid/_grid-theme.scss +1 -1
  303. package/grid/cell.component.d.ts +3 -0
  304. package/grid/column-menu.component.d.ts +3 -0
  305. package/grid/column-menu.component.scss +1 -1
  306. package/grid/column-resize/_column-resize.scss +3 -3
  307. package/grid/column-resize/column-resize-directives/column-resize-flex.d.ts +3 -0
  308. package/grid/column-resize/column-resize-directives/column-resize.d.ts +3 -0
  309. package/grid/column-resize/column-resize-module.d.ts +12 -7
  310. package/grid/column-resize/overlay-handle.d.ts +3 -0
  311. package/grid/column-resize/resizable-directives/resizable.d.ts +3 -0
  312. package/grid/column-resize/resize-strategy.d.ts +3 -0
  313. package/grid/expansion-toggle.directive.d.ts +3 -0
  314. package/grid/grid.component.d.ts +20 -1
  315. package/grid/grid.module.d.ts +26 -0
  316. package/grid/grid.service.d.ts +3 -0
  317. package/grid/mtxGrid.d.ts +1 -0
  318. package/grid/package.json +5 -6
  319. package/grid/public-api.d.ts +0 -1
  320. package/loader/_loader-theme.scss +1 -1
  321. package/loader/loader.component.d.ts +7 -1
  322. package/loader/loader.module.d.ts +8 -0
  323. package/loader/mtxLoader.d.ts +1 -0
  324. package/loader/package.json +5 -6
  325. package/{color-picker/mtxColorPicker.d.ts → ng-matero-extensions.d.ts} +1 -0
  326. package/package.json +178 -15
  327. package/popover/_popover-theme.scss +1 -1
  328. package/popover/mtxPopover.d.ts +1 -0
  329. package/popover/package.json +5 -6
  330. package/popover/popover-module.d.ts +10 -0
  331. package/popover/popover-target.d.ts +3 -0
  332. package/popover/popover-trigger.d.ts +3 -0
  333. package/popover/popover.d.ts +3 -0
  334. package/progress/_progress-theme.scss +2 -2
  335. package/progress/mtxProgress.d.ts +1 -0
  336. package/progress/package.json +5 -6
  337. package/progress/progress.component.d.ts +3 -0
  338. package/progress/progress.module.d.ts +6 -0
  339. package/public-api.d.ts +2 -19
  340. package/select/_select-theme.scss +1 -1
  341. package/select/mtxSelect.d.ts +1 -0
  342. package/select/option.component.d.ts +3 -0
  343. package/select/package.json +5 -6
  344. package/select/select.component.d.ts +3 -0
  345. package/select/select.component.scss +1 -1
  346. package/select/select.module.d.ts +10 -0
  347. package/select/templates.directive.d.ts +23 -0
  348. package/slider/_slider-theme.scss +4 -4
  349. package/slider/mtxSlider.d.ts +1 -0
  350. package/slider/package.json +5 -6
  351. package/slider/slider-module.d.ts +7 -0
  352. package/slider/slider.d.ts +4 -1
  353. package/slider/slider.scss +7 -7
  354. package/split/_split-theme.scss +10 -3
  355. package/split/mtxSplit.d.ts +1 -0
  356. package/split/package.json +5 -6
  357. package/split/split-pane.directive.d.ts +3 -0
  358. package/split/split.component.d.ts +12 -1
  359. package/split/split.module.d.ts +7 -0
  360. package/text3d/_text3d-theme.scss +2 -2
  361. package/text3d/mtxText3d.d.ts +1 -0
  362. package/text3d/package.json +5 -6
  363. package/text3d/text3d.component.d.ts +3 -1
  364. package/text3d/text3d.module.d.ts +6 -0
  365. package/tooltip/_tooltip-theme.scss +3 -3
  366. package/tooltip/mtxTooltip.d.ts +1 -0
  367. package/tooltip/package.json +5 -6
  368. package/tooltip/tooltip-module.d.ts +10 -0
  369. package/tooltip/tooltip.d.ts +5 -0
  370. package/tooltip/tooltip.scss +1 -1
  371. package/alert/mtxAlert.metadata.json +0 -1
  372. package/bundles/extensions.umd.js +0 -164
  373. package/bundles/extensions.umd.js.map +0 -1
  374. package/bundles/mtxAlert.umd.js +0 -101
  375. package/bundles/mtxAlert.umd.js.map +0 -1
  376. package/bundles/mtxButton.umd.js +0 -119
  377. package/bundles/mtxButton.umd.js.map +0 -1
  378. package/bundles/mtxCheckboxGroup.umd.js +0 -284
  379. package/bundles/mtxCheckboxGroup.umd.js.map +0 -1
  380. package/bundles/mtxColorPicker.umd.js +0 -337
  381. package/bundles/mtxColorPicker.umd.js.map +0 -1
  382. package/bundles/mtxColumnResize.umd.js +0 -1339
  383. package/bundles/mtxColumnResize.umd.js.map +0 -1
  384. package/bundles/mtxCore.umd.js +0 -670
  385. package/bundles/mtxCore.umd.js.map +0 -1
  386. package/bundles/mtxDatetimepicker.umd.js +0 -2590
  387. package/bundles/mtxDatetimepicker.umd.js.map +0 -1
  388. package/bundles/mtxDialog.umd.js +0 -160
  389. package/bundles/mtxDialog.umd.js.map +0 -1
  390. package/bundles/mtxFormGroup.umd.js +0 -80
  391. package/bundles/mtxFormGroup.umd.js.map +0 -1
  392. package/bundles/mtxGrid.umd.js +0 -1581
  393. package/bundles/mtxGrid.umd.js.map +0 -1
  394. package/bundles/mtxLoader.umd.js +0 -104
  395. package/bundles/mtxLoader.umd.js.map +0 -1
  396. package/bundles/mtxPipes.umd.js +0 -44
  397. package/bundles/mtxPipes.umd.js.map +0 -1
  398. package/bundles/mtxPopover.umd.js +0 -1260
  399. package/bundles/mtxPopover.umd.js.map +0 -1
  400. package/bundles/mtxProgress.umd.js +0 -92
  401. package/bundles/mtxProgress.umd.js.map +0 -1
  402. package/bundles/mtxSelect.umd.js +0 -1097
  403. package/bundles/mtxSelect.umd.js.map +0 -1
  404. package/bundles/mtxSlider.umd.js +0 -1551
  405. package/bundles/mtxSlider.umd.js.map +0 -1
  406. package/bundles/mtxSplit.umd.js +0 -1432
  407. package/bundles/mtxSplit.umd.js.map +0 -1
  408. package/bundles/mtxText3d.umd.js +0 -92
  409. package/bundles/mtxText3d.umd.js.map +0 -1
  410. package/bundles/mtxTooltip.umd.js +0 -1081
  411. package/bundles/mtxTooltip.umd.js.map +0 -1
  412. package/button/mtxButton.metadata.json +0 -1
  413. package/checkbox-group/mtxCheckboxGroup.metadata.json +0 -1
  414. package/color-picker/color-picker.component.d.ts +0 -120
  415. package/color-picker/color-picker.module.d.ts +0 -2
  416. package/color-picker/mtxColorPicker.metadata.json +0 -1
  417. package/color-picker/package.json +0 -11
  418. package/color-picker/public-api.d.ts +0 -2
  419. package/column-resize/mtxColumnResize.metadata.json +0 -1
  420. package/core/mtxCore.metadata.json +0 -1
  421. package/datetimepicker/datetimepicker.module.d.ts +0 -2
  422. package/datetimepicker/mtxDatetimepicker.metadata.json +0 -1
  423. package/dialog/mtxDialog.metadata.json +0 -1
  424. package/esm2015/alert/alert.component.js +0 -63
  425. package/esm2015/alert/alert.module.js +0 -14
  426. package/esm2015/button/button-loading.directive.js +0 -89
  427. package/esm2015/button/button.module.js +0 -16
  428. package/esm2015/checkbox-group/checkbox-group.component.js +0 -235
  429. package/esm2015/checkbox-group/checkbox-group.module.js +0 -17
  430. package/esm2015/color-picker/color-picker.component.js +0 -268
  431. package/esm2015/color-picker/color-picker.module.js +0 -26
  432. package/esm2015/color-picker/mtxColorPicker.js +0 -5
  433. package/esm2015/color-picker/public-api.js +0 -3
  434. package/esm2015/column-resize/column-resize-directives/column-resize-flex.js +0 -54
  435. package/esm2015/column-resize/column-resize-directives/column-resize.js +0 -54
  436. package/esm2015/column-resize/column-resize-module.js +0 -24
  437. package/esm2015/column-resize/column-resize-notifier.js +0 -54
  438. package/esm2015/column-resize/column-resize.js +0 -80
  439. package/esm2015/column-resize/column-size-store.js +0 -18
  440. package/esm2015/column-resize/event-dispatcher.js +0 -75
  441. package/esm2015/column-resize/overlay-handle.js +0 -144
  442. package/esm2015/column-resize/resizable.js +0 -197
  443. package/esm2015/column-resize/resize-strategy.js +0 -245
  444. package/esm2015/core/datetime/datetime.module.js +0 -32
  445. package/esm2015/core/datetime/native-datetime-adapter.js +0 -144
  446. package/esm2015/datetimepicker/calendar-body.js +0 -75
  447. package/esm2015/datetimepicker/calendar.js +0 -629
  448. package/esm2015/datetimepicker/clock.js +0 -283
  449. package/esm2015/datetimepicker/datetimepicker-animations.js +0 -30
  450. package/esm2015/datetimepicker/datetimepicker-input.js +0 -333
  451. package/esm2015/datetimepicker/datetimepicker-toggle.js +0 -81
  452. package/esm2015/datetimepicker/datetimepicker.js +0 -411
  453. package/esm2015/datetimepicker/datetimepicker.module.js +0 -49
  454. package/esm2015/datetimepicker/month-view.js +0 -149
  455. package/esm2015/datetimepicker/mtxDatetimepicker.js +0 -7
  456. package/esm2015/datetimepicker/multi-year-view.js +0 -214
  457. package/esm2015/datetimepicker/public-api.js +0 -11
  458. package/esm2015/datetimepicker/year-view.js +0 -140
  459. package/esm2015/dialog/dialog.component.js +0 -40
  460. package/esm2015/dialog/dialog.js +0 -81
  461. package/esm2015/dialog/dialog.module.js +0 -21
  462. package/esm2015/dialog/public-api.js +0 -5
  463. package/esm2015/extensions-experimental.module.js +0 -13
  464. package/esm2015/extensions.js +0 -5
  465. package/esm2015/extensions.module.js +0 -40
  466. package/esm2015/form-group/form-group.component.js +0 -47
  467. package/esm2015/form-group/form-group.module.js +0 -14
  468. package/esm2015/grid/cell-selection.directive.js +0 -62
  469. package/esm2015/grid/cell.component.js +0 -115
  470. package/esm2015/grid/column-menu.component.js +0 -72
  471. package/esm2015/grid/column-resize/column-resize-directives/column-resize-flex.js +0 -47
  472. package/esm2015/grid/column-resize/column-resize-directives/column-resize.js +0 -47
  473. package/esm2015/grid/column-resize/column-resize-module.js +0 -36
  474. package/esm2015/grid/column-resize/overlay-handle.js +0 -68
  475. package/esm2015/grid/column-resize/resizable-directives/resizable.js +0 -75
  476. package/esm2015/grid/column-resize/resize-strategy.js +0 -45
  477. package/esm2015/grid/expansion-toggle.directive.js +0 -62
  478. package/esm2015/grid/grid.component.js +0 -418
  479. package/esm2015/grid/grid.module.js +0 -69
  480. package/esm2015/grid/grid.service.js +0 -50
  481. package/esm2015/grid/public-api.js +0 -17
  482. package/esm2015/loader/loader.component.js +0 -66
  483. package/esm2015/loader/loader.module.js +0 -16
  484. package/esm2015/pipes/mtxPipes.js +0 -5
  485. package/esm2015/pipes/pipes.module.js +0 -14
  486. package/esm2015/pipes/public-api.js +0 -3
  487. package/esm2015/pipes/to-observable.pipe.js +0 -12
  488. package/esm2015/popover/popover-module.js +0 -18
  489. package/esm2015/popover/popover-target.js +0 -24
  490. package/esm2015/popover/popover-trigger.js +0 -434
  491. package/esm2015/popover/popover.js +0 -326
  492. package/esm2015/progress/progress.component.js +0 -54
  493. package/esm2015/progress/progress.module.js +0 -14
  494. package/esm2015/public-api.js +0 -23
  495. package/esm2015/select/select.component.js +0 -380
  496. package/esm2015/select/select.module.js +0 -46
  497. package/esm2015/select/templates.directive.js +0 -211
  498. package/esm2015/slider/slider-module.js +0 -15
  499. package/esm2015/slider/slider.js +0 -1115
  500. package/esm2015/split/split-pane.directive.js +0 -156
  501. package/esm2015/split/split.component.js +0 -622
  502. package/esm2015/split/split.module.js +0 -15
  503. package/esm2015/split/utils.js +0 -227
  504. package/esm2015/text3d/text3d.component.js +0 -53
  505. package/esm2015/text3d/text3d.module.js +0 -14
  506. package/esm2015/tooltip/tooltip-module.js +0 -20
  507. package/esm2015/tooltip/tooltip.js +0 -681
  508. package/extensions-experimental.module.d.ts +0 -2
  509. package/extensions.metadata.json +0 -1
  510. package/extensions.module.d.ts +0 -2
  511. package/fesm2015/extensions.js +0 -80
  512. package/fesm2015/extensions.js.map +0 -1
  513. package/fesm2015/mtxAlert.js +0 -82
  514. package/fesm2015/mtxAlert.js.map +0 -1
  515. package/fesm2015/mtxButton.js +0 -108
  516. package/fesm2015/mtxButton.js.map +0 -1
  517. package/fesm2015/mtxCheckboxGroup.js +0 -255
  518. package/fesm2015/mtxCheckboxGroup.js.map +0 -1
  519. package/fesm2015/mtxColorPicker.js +0 -295
  520. package/fesm2015/mtxColorPicker.js.map +0 -1
  521. package/fesm2015/mtxColumnResize.js.map +0 -1
  522. package/fesm2015/mtxCore.js.map +0 -1
  523. package/fesm2015/mtxDatetimepicker.js +0 -2355
  524. package/fesm2015/mtxDatetimepicker.js.map +0 -1
  525. package/fesm2015/mtxDialog.js +0 -141
  526. package/fesm2015/mtxDialog.js.map +0 -1
  527. package/fesm2015/mtxFormGroup.js +0 -66
  528. package/fesm2015/mtxFormGroup.js.map +0 -1
  529. package/fesm2015/mtxGrid.js +0 -1186
  530. package/fesm2015/mtxGrid.js.map +0 -1
  531. package/fesm2015/mtxLoader.js +0 -87
  532. package/fesm2015/mtxLoader.js.map +0 -1
  533. package/fesm2015/mtxPipes.js +0 -31
  534. package/fesm2015/mtxPipes.js.map +0 -1
  535. package/fesm2015/mtxPopover.js.map +0 -1
  536. package/fesm2015/mtxProgress.js +0 -73
  537. package/fesm2015/mtxProgress.js.map +0 -1
  538. package/fesm2015/mtxSelect.js +0 -700
  539. package/fesm2015/mtxSelect.js.map +0 -1
  540. package/fesm2015/mtxSlider.js.map +0 -1
  541. package/fesm2015/mtxSplit.js.map +0 -1
  542. package/fesm2015/mtxText3d.js +0 -72
  543. package/fesm2015/mtxText3d.js.map +0 -1
  544. package/fesm2015/mtxTooltip.js.map +0 -1
  545. package/form-group/mtxFormGroup.metadata.json +0 -1
  546. package/grid/cell-selection.directive.d.ts +0 -17
  547. package/grid/mtxGrid.metadata.json +0 -1
  548. package/loader/mtxLoader.metadata.json +0 -1
  549. package/pipes/mtxPipes.d.ts +0 -4
  550. package/pipes/mtxPipes.metadata.json +0 -1
  551. package/pipes/package.json +0 -11
  552. package/pipes/pipes.module.d.ts +0 -2
  553. package/popover/mtxPopover.metadata.json +0 -1
  554. package/progress/mtxProgress.metadata.json +0 -1
  555. package/select/mtxSelect.metadata.json +0 -1
  556. package/slider/mtxSlider.metadata.json +0 -1
  557. package/split/mtxSplit.metadata.json +0 -1
  558. package/text3d/mtxText3d.metadata.json +0 -1
  559. package/tooltip/mtxTooltip.metadata.json +0 -1
@@ -1,1551 +0,0 @@
1
- (function (global, factory) {
2
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('@angular/material/core'), require('@angular/cdk/a11y'), require('@angular/cdk/bidi'), require('@angular/cdk/coercion'), require('@angular/cdk/keycodes'), require('@angular/cdk/platform'), require('@angular/forms'), require('@angular/platform-browser/animations'), require('rxjs')) :
3
- typeof define === 'function' && define.amd ? define('@ng-matero/extensions/slider', ['exports', '@angular/common', '@angular/core', '@angular/material/core', '@angular/cdk/a11y', '@angular/cdk/bidi', '@angular/cdk/coercion', '@angular/cdk/keycodes', '@angular/cdk/platform', '@angular/forms', '@angular/platform-browser/animations', 'rxjs'], factory) :
4
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global["ng-matero"] = global["ng-matero"] || {}, global["ng-matero"].extensions = global["ng-matero"].extensions || {}, global["ng-matero"].extensions.slider = {}), global.ng.common, global.ng.core, global.ng.material.core, global.ng.cdk.a11y, global.ng.cdk.bidi, global.ng.cdk.coercion, global.ng.cdk.keycodes, global.ng.cdk.platform, global.ng.forms, global.ng.platformBrowser.animations, global.rxjs));
5
- })(this, (function (exports, common, core, core$1, a11y, bidi, coercion, keycodes, platform, forms, animations, rxjs) { 'use strict';
6
-
7
- /*! *****************************************************************************
8
- Copyright (c) Microsoft Corporation.
9
-
10
- Permission to use, copy, modify, and/or distribute this software for any
11
- purpose with or without fee is hereby granted.
12
-
13
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
14
- REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
15
- AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
16
- INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
17
- LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
18
- OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
19
- PERFORMANCE OF THIS SOFTWARE.
20
- ***************************************************************************** */
21
- /* global Reflect, Promise */
22
- var extendStatics = function (d, b) {
23
- extendStatics = Object.setPrototypeOf ||
24
- ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
25
- function (d, b) { for (var p in b)
26
- if (Object.prototype.hasOwnProperty.call(b, p))
27
- d[p] = b[p]; };
28
- return extendStatics(d, b);
29
- };
30
- function __extends(d, b) {
31
- if (typeof b !== "function" && b !== null)
32
- throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
33
- extendStatics(d, b);
34
- function __() { this.constructor = d; }
35
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
36
- }
37
- var __assign = function () {
38
- __assign = Object.assign || function __assign(t) {
39
- for (var s, i = 1, n = arguments.length; i < n; i++) {
40
- s = arguments[i];
41
- for (var p in s)
42
- if (Object.prototype.hasOwnProperty.call(s, p))
43
- t[p] = s[p];
44
- }
45
- return t;
46
- };
47
- return __assign.apply(this, arguments);
48
- };
49
- function __rest(s, e) {
50
- var t = {};
51
- for (var p in s)
52
- if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
53
- t[p] = s[p];
54
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
55
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
56
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
57
- t[p[i]] = s[p[i]];
58
- }
59
- return t;
60
- }
61
- function __decorate(decorators, target, key, desc) {
62
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
63
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
64
- r = Reflect.decorate(decorators, target, key, desc);
65
- else
66
- for (var i = decorators.length - 1; i >= 0; i--)
67
- if (d = decorators[i])
68
- r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
69
- return c > 3 && r && Object.defineProperty(target, key, r), r;
70
- }
71
- function __param(paramIndex, decorator) {
72
- return function (target, key) { decorator(target, key, paramIndex); };
73
- }
74
- function __metadata(metadataKey, metadataValue) {
75
- if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
76
- return Reflect.metadata(metadataKey, metadataValue);
77
- }
78
- function __awaiter(thisArg, _arguments, P, generator) {
79
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
80
- return new (P || (P = Promise))(function (resolve, reject) {
81
- function fulfilled(value) { try {
82
- step(generator.next(value));
83
- }
84
- catch (e) {
85
- reject(e);
86
- } }
87
- function rejected(value) { try {
88
- step(generator["throw"](value));
89
- }
90
- catch (e) {
91
- reject(e);
92
- } }
93
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
94
- step((generator = generator.apply(thisArg, _arguments || [])).next());
95
- });
96
- }
97
- function __generator(thisArg, body) {
98
- var _ = { label: 0, sent: function () { if (t[0] & 1)
99
- throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
100
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function () { return this; }), g;
101
- function verb(n) { return function (v) { return step([n, v]); }; }
102
- function step(op) {
103
- if (f)
104
- throw new TypeError("Generator is already executing.");
105
- while (_)
106
- try {
107
- if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done)
108
- return t;
109
- if (y = 0, t)
110
- op = [op[0] & 2, t.value];
111
- switch (op[0]) {
112
- case 0:
113
- case 1:
114
- t = op;
115
- break;
116
- case 4:
117
- _.label++;
118
- return { value: op[1], done: false };
119
- case 5:
120
- _.label++;
121
- y = op[1];
122
- op = [0];
123
- continue;
124
- case 7:
125
- op = _.ops.pop();
126
- _.trys.pop();
127
- continue;
128
- default:
129
- if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
130
- _ = 0;
131
- continue;
132
- }
133
- if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) {
134
- _.label = op[1];
135
- break;
136
- }
137
- if (op[0] === 6 && _.label < t[1]) {
138
- _.label = t[1];
139
- t = op;
140
- break;
141
- }
142
- if (t && _.label < t[2]) {
143
- _.label = t[2];
144
- _.ops.push(op);
145
- break;
146
- }
147
- if (t[2])
148
- _.ops.pop();
149
- _.trys.pop();
150
- continue;
151
- }
152
- op = body.call(thisArg, _);
153
- }
154
- catch (e) {
155
- op = [6, e];
156
- y = 0;
157
- }
158
- finally {
159
- f = t = 0;
160
- }
161
- if (op[0] & 5)
162
- throw op[1];
163
- return { value: op[0] ? op[1] : void 0, done: true };
164
- }
165
- }
166
- var __createBinding = Object.create ? (function (o, m, k, k2) {
167
- if (k2 === undefined)
168
- k2 = k;
169
- Object.defineProperty(o, k2, { enumerable: true, get: function () { return m[k]; } });
170
- }) : (function (o, m, k, k2) {
171
- if (k2 === undefined)
172
- k2 = k;
173
- o[k2] = m[k];
174
- });
175
- function __exportStar(m, o) {
176
- for (var p in m)
177
- if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p))
178
- __createBinding(o, m, p);
179
- }
180
- function __values(o) {
181
- var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
182
- if (m)
183
- return m.call(o);
184
- if (o && typeof o.length === "number")
185
- return {
186
- next: function () {
187
- if (o && i >= o.length)
188
- o = void 0;
189
- return { value: o && o[i++], done: !o };
190
- }
191
- };
192
- throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
193
- }
194
- function __read(o, n) {
195
- var m = typeof Symbol === "function" && o[Symbol.iterator];
196
- if (!m)
197
- return o;
198
- var i = m.call(o), r, ar = [], e;
199
- try {
200
- while ((n === void 0 || n-- > 0) && !(r = i.next()).done)
201
- ar.push(r.value);
202
- }
203
- catch (error) {
204
- e = { error: error };
205
- }
206
- finally {
207
- try {
208
- if (r && !r.done && (m = i["return"]))
209
- m.call(i);
210
- }
211
- finally {
212
- if (e)
213
- throw e.error;
214
- }
215
- }
216
- return ar;
217
- }
218
- /** @deprecated */
219
- function __spread() {
220
- for (var ar = [], i = 0; i < arguments.length; i++)
221
- ar = ar.concat(__read(arguments[i]));
222
- return ar;
223
- }
224
- /** @deprecated */
225
- function __spreadArrays() {
226
- for (var s = 0, i = 0, il = arguments.length; i < il; i++)
227
- s += arguments[i].length;
228
- for (var r = Array(s), k = 0, i = 0; i < il; i++)
229
- for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
230
- r[k] = a[j];
231
- return r;
232
- }
233
- function __spreadArray(to, from, pack) {
234
- if (pack || arguments.length === 2)
235
- for (var i = 0, l = from.length, ar; i < l; i++) {
236
- if (ar || !(i in from)) {
237
- if (!ar)
238
- ar = Array.prototype.slice.call(from, 0, i);
239
- ar[i] = from[i];
240
- }
241
- }
242
- return to.concat(ar || from);
243
- }
244
- function __await(v) {
245
- return this instanceof __await ? (this.v = v, this) : new __await(v);
246
- }
247
- function __asyncGenerator(thisArg, _arguments, generator) {
248
- if (!Symbol.asyncIterator)
249
- throw new TypeError("Symbol.asyncIterator is not defined.");
250
- var g = generator.apply(thisArg, _arguments || []), i, q = [];
251
- return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
252
- function verb(n) { if (g[n])
253
- i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
254
- function resume(n, v) { try {
255
- step(g[n](v));
256
- }
257
- catch (e) {
258
- settle(q[0][3], e);
259
- } }
260
- function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
261
- function fulfill(value) { resume("next", value); }
262
- function reject(value) { resume("throw", value); }
263
- function settle(f, v) { if (f(v), q.shift(), q.length)
264
- resume(q[0][0], q[0][1]); }
265
- }
266
- function __asyncDelegator(o) {
267
- var i, p;
268
- return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
269
- function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === "return" } : f ? f(v) : v; } : f; }
270
- }
271
- function __asyncValues(o) {
272
- if (!Symbol.asyncIterator)
273
- throw new TypeError("Symbol.asyncIterator is not defined.");
274
- var m = o[Symbol.asyncIterator], i;
275
- return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
276
- function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
277
- function settle(resolve, reject, d, v) { Promise.resolve(v).then(function (v) { resolve({ value: v, done: d }); }, reject); }
278
- }
279
- function __makeTemplateObject(cooked, raw) {
280
- if (Object.defineProperty) {
281
- Object.defineProperty(cooked, "raw", { value: raw });
282
- }
283
- else {
284
- cooked.raw = raw;
285
- }
286
- return cooked;
287
- }
288
- ;
289
- var __setModuleDefault = Object.create ? (function (o, v) {
290
- Object.defineProperty(o, "default", { enumerable: true, value: v });
291
- }) : function (o, v) {
292
- o["default"] = v;
293
- };
294
- function __importStar(mod) {
295
- if (mod && mod.__esModule)
296
- return mod;
297
- var result = {};
298
- if (mod != null)
299
- for (var k in mod)
300
- if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k))
301
- __createBinding(result, mod, k);
302
- __setModuleDefault(result, mod);
303
- return result;
304
- }
305
- function __importDefault(mod) {
306
- return (mod && mod.__esModule) ? mod : { default: mod };
307
- }
308
- function __classPrivateFieldGet(receiver, state, kind, f) {
309
- if (kind === "a" && !f)
310
- throw new TypeError("Private accessor was defined without a getter");
311
- if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
312
- throw new TypeError("Cannot read private member from an object whose class did not declare it");
313
- return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
314
- }
315
- function __classPrivateFieldSet(receiver, state, value, kind, f) {
316
- if (kind === "m")
317
- throw new TypeError("Private method is not writable");
318
- if (kind === "a" && !f)
319
- throw new TypeError("Private accessor was defined without a setter");
320
- if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
321
- throw new TypeError("Cannot write private member to an object whose class did not declare it");
322
- return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
323
- }
324
-
325
- var activeEventOptions = platform.normalizePassiveListenerOptions({ passive: false });
326
- /**
327
- * Visually, a 30px separation between tick marks looks best. This is very subjective but it is
328
- * the default separation we chose.
329
- */
330
- var MIN_AUTO_TICK_SEPARATION = 30;
331
- /** The thumb gap size for a disabled slider. */
332
- var DISABLED_THUMB_GAP = 0;
333
- /** The thumb gap size for a non-active slider at its minimum value. */
334
- var MIN_VALUE_NONACTIVE_THUMB_GAP = 7;
335
- /** The thumb gap size for an active slider at its minimum value. */
336
- var MIN_VALUE_ACTIVE_THUMB_GAP = 10;
337
- /**
338
- * Provider Expression that allows mtx-slider to register as a ControlValueAccessor.
339
- * This allows it to support [(ngModel)] and [formControl].
340
- */
341
- var MTX_SLIDER_VALUE_ACCESSOR = {
342
- provide: forms.NG_VALUE_ACCESSOR,
343
- useExisting: core.forwardRef(function () { return MtxSlider; }),
344
- multi: true,
345
- };
346
- /** A simple change event emitted by the MtxSlider component. */
347
- var MtxSliderChange = /** @class */ (function () {
348
- function MtxSliderChange() {
349
- }
350
- return MtxSliderChange;
351
- }());
352
- // Boilerplate for applying mixins to MtxSlider.
353
- /** @docs-private */
354
- var _MtxSliderBase = core$1.mixinTabIndex(core$1.mixinColor(core$1.mixinDisabled(/** @class */ (function () {
355
- function class_1(_elementRef) {
356
- this._elementRef = _elementRef;
357
- }
358
- return class_1;
359
- }())), 'accent'));
360
- /**
361
- * Allows users to select from a range of values by moving the slider thumb. It is similar in
362
- * behavior to the native `<input type="range">` element.
363
- */
364
- var MtxSlider = /** @class */ (function (_super) {
365
- __extends(MtxSlider, _super);
366
- function MtxSlider(elementRef, _focusMonitor, _changeDetectorRef, _dir, tabIndex,
367
- // @breaking-change 7.0.0 `_animationMode` parameter to be made required.
368
- _animationMode, _ngZone) {
369
- var _this = _super.call(this, elementRef) || this;
370
- _this._focusMonitor = _focusMonitor;
371
- _this._changeDetectorRef = _changeDetectorRef;
372
- _this._dir = _dir;
373
- _this._animationMode = _animationMode;
374
- _this._ngZone = _ngZone;
375
- _this._invert = false;
376
- _this._max = 100;
377
- _this._min = 0;
378
- _this._step = 1;
379
- _this._thumbLabel = false;
380
- _this._tickInterval = 0;
381
- _this._value = null;
382
- _this._vertical = false;
383
- /** Event emitted when the slider value has changed. */
384
- _this.change = new core.EventEmitter();
385
- /** Event emitted when the slider thumb moves. */
386
- _this.input = new core.EventEmitter();
387
- /**
388
- * Emits when the raw value of the slider changes. This is here primarily
389
- * to facilitate the two-way binding for the `value` input.
390
- * @docs-private
391
- */
392
- _this.valueChange = new core.EventEmitter();
393
- /** onTouch function registered via registerOnTouch (ControlValueAccessor). */
394
- _this.onTouched = function () { };
395
- _this._percent = 0;
396
- /**
397
- * Whether or not the thumb is sliding.
398
- * Used to determine if there should be a transition for the thumb and fill track.
399
- */
400
- _this._isSliding = false;
401
- /**
402
- * Whether or not the slider is active (clicked or sliding).
403
- * Used to shrink and grow the thumb as according to the Material Design spec.
404
- */
405
- _this._isActive = false;
406
- /** The size of a tick interval as a percentage of the size of the track. */
407
- _this._tickIntervalPercent = 0;
408
- /** The dimensions of the slider. */
409
- _this._sliderDimensions = null;
410
- _this._controlValueAccessorChangeFn = function () { };
411
- /** Subscription to the Directionality change EventEmitter. */
412
- _this._dirChangeSubscription = rxjs.Subscription.EMPTY;
413
- /** The slider thumb which is currently used (left or right) */
414
- _this._currentSliderDir = 'l';
415
- /** Called when the user has put their pointer down on the slider. */
416
- _this._pointerDown = function (event) {
417
- // Don't do anything if the slider is disabled or the
418
- // user is using anything other than the main mouse button.
419
- if (_this.disabled || _this._isSliding || (!isTouchEvent(event) && event.button !== 0)) {
420
- return;
421
- }
422
- _this.calculateInitialSlideDirection(event);
423
- _this._runInsideZone(function () {
424
- var oldValue = _this.value;
425
- var pointerPosition = getPointerPositionOnPage(event);
426
- _this._isSliding = true;
427
- event.preventDefault();
428
- _this._focusHostElement();
429
- _this._onMouseenter(); // Simulate mouseenter in case this is a mobile device.
430
- _this._bindGlobalEvents(event);
431
- _this._focusHostElement();
432
- // TODO:
433
- // this._updateValueFromPosition(pointerPosition);
434
- if (_this.value instanceof Array) {
435
- if (_this._currentSliderDir === 'l') {
436
- _this._updateValueFromPositionLeft(pointerPosition);
437
- }
438
- else if (_this._currentSliderDir === 'r') {
439
- _this._updateValueFromPositionRight(pointerPosition);
440
- }
441
- }
442
- else {
443
- _this._updateValueFromPositionLeft(pointerPosition);
444
- }
445
- _this._valueOnSlideStart = _this.value;
446
- _this._pointerPositionOnStart = pointerPosition;
447
- // Emit a change and input event if the value changed.
448
- if (oldValue !== _this.value) {
449
- _this._emitInputEvent();
450
- _this._emitChangeEvent();
451
- }
452
- });
453
- };
454
- /**
455
- * Called when the user has moved their pointer after
456
- * starting to drag. Bound on the document level.
457
- */
458
- _this._pointerMove = function (event) {
459
- if (_this._isSliding) {
460
- _this.calculateInitialSlideDirection(event);
461
- // Prevent the slide from selecting anything else.
462
- event.preventDefault();
463
- var oldValue = _this.value;
464
- // TODO:
465
- // this._updateValueFromPosition(getPointerPositionOnPage(event));
466
- var pointerPosition = getPointerPositionOnPage(event);
467
- if (_this._currentSliderDir === 'l') {
468
- _this._updateValueFromPositionLeft(pointerPosition);
469
- }
470
- else if (_this._currentSliderDir === 'r') {
471
- _this._updateValueFromPositionRight(pointerPosition);
472
- }
473
- else {
474
- if (!_this.isRangeSlider()) {
475
- _this._updateValueFromPositionLeft(pointerPosition);
476
- }
477
- }
478
- // Native range elements always emit `input` events when the value changed while sliding.
479
- if (oldValue !== _this.value) {
480
- _this._emitInputEvent();
481
- }
482
- }
483
- };
484
- /** Called when the user has lifted their pointer. Bound on the document level. */
485
- _this._pointerUp = function (event) {
486
- if (_this._isSliding) {
487
- var pointerPositionOnStart = _this._pointerPositionOnStart;
488
- var currentPointerPosition = getPointerPositionOnPage(event);
489
- event.preventDefault();
490
- _this._removeGlobalEvents();
491
- _this._valueOnSlideStart = _this._pointerPositionOnStart = null;
492
- _this._isSliding = false;
493
- if (_this._valueOnSlideStart !== _this.value &&
494
- !_this.disabled &&
495
- pointerPositionOnStart &&
496
- (pointerPositionOnStart.x !== currentPointerPosition.x ||
497
- pointerPositionOnStart.y !== currentPointerPosition.y)) {
498
- _this._emitChangeEvent();
499
- }
500
- }
501
- };
502
- _this.tabIndex = parseInt(tabIndex, 10) || 0;
503
- _this._runOutsizeZone(function () {
504
- var element = elementRef.nativeElement;
505
- element.addEventListener('mousedown', _this._pointerDown, activeEventOptions);
506
- element.addEventListener('touchstart', _this._pointerDown, activeEventOptions);
507
- });
508
- return _this;
509
- }
510
- Object.defineProperty(MtxSlider.prototype, "invert", {
511
- /** Whether the slider is inverted. */
512
- get: function () {
513
- return this._invert;
514
- },
515
- set: function (value) {
516
- this._invert = coercion.coerceBooleanProperty(value);
517
- },
518
- enumerable: false,
519
- configurable: true
520
- });
521
- Object.defineProperty(MtxSlider.prototype, "max", {
522
- /** The maximum value that the slider can have. */
523
- get: function () {
524
- return this._max;
525
- },
526
- set: function (v) {
527
- this._max = coercion.coerceNumberProperty(v, this._max);
528
- this._percent = this._calculatePercentage(this._value);
529
- // Since this also modifies the percentage, we need to let the change detection know.
530
- this._changeDetectorRef.markForCheck();
531
- },
532
- enumerable: false,
533
- configurable: true
534
- });
535
- Object.defineProperty(MtxSlider.prototype, "min", {
536
- /** The minimum value that the slider can have. */
537
- get: function () {
538
- return this._min;
539
- },
540
- set: function (v) {
541
- this._min = coercion.coerceNumberProperty(v, this._min);
542
- // If the value wasn't explicitly set by the user, set it to the min.
543
- if (this._value === null) {
544
- this.value = this._min;
545
- }
546
- this._percent = this._calculatePercentage(this._value);
547
- // Since this also modifies the percentage, we need to let the change detection know.
548
- this._changeDetectorRef.markForCheck();
549
- },
550
- enumerable: false,
551
- configurable: true
552
- });
553
- Object.defineProperty(MtxSlider.prototype, "step", {
554
- /** The values at which the thumb will snap. */
555
- get: function () {
556
- return this._step;
557
- },
558
- set: function (v) {
559
- this._step = coercion.coerceNumberProperty(v, this._step);
560
- if (this._step % 1 !== 0) {
561
- this._roundToDecimal = this._step.toString().split('.').pop().length;
562
- }
563
- // Since this could modify the label, we need to notify the change detection.
564
- this._changeDetectorRef.markForCheck();
565
- },
566
- enumerable: false,
567
- configurable: true
568
- });
569
- Object.defineProperty(MtxSlider.prototype, "thumbLabel", {
570
- /** Whether or not to show the thumb label. */
571
- get: function () {
572
- return this._thumbLabel;
573
- },
574
- set: function (value) {
575
- this._thumbLabel = coercion.coerceBooleanProperty(value);
576
- },
577
- enumerable: false,
578
- configurable: true
579
- });
580
- Object.defineProperty(MtxSlider.prototype, "tickInterval", {
581
- /**
582
- * How often to show ticks. Relative to the step so that a tick always appears on a step.
583
- * Ex: Tick interval of 4 with a step of 3 will draw a tick every 4 steps (every 12 values).
584
- */
585
- get: function () {
586
- return this._tickInterval;
587
- },
588
- set: function (value) {
589
- if (value === 'auto') {
590
- this._tickInterval = 'auto';
591
- }
592
- else if (typeof value === 'number' || typeof value === 'string') {
593
- this._tickInterval = coercion.coerceNumberProperty(value, this._tickInterval);
594
- }
595
- else {
596
- this._tickInterval = 0;
597
- }
598
- },
599
- enumerable: false,
600
- configurable: true
601
- });
602
- Object.defineProperty(MtxSlider.prototype, "value", {
603
- /** Value of the slider. */
604
- get: function () {
605
- // If the value needs to be read and it is still uninitialized, initialize it to the min.
606
- if (this._value === null) {
607
- this.value = this._min;
608
- }
609
- return this._value;
610
- },
611
- set: function (v) {
612
- if (v !== this._value ||
613
- (v instanceof Array &&
614
- this._value != null &&
615
- (v[0] !== this._value[0] || v[1] !== this._value[1]))) {
616
- var value = null;
617
- if (v instanceof Array) {
618
- value = [coercion.coerceNumberProperty(v[0]), coercion.coerceNumberProperty(v[1])];
619
- value = [Math.min(value[0], value[1]), Math.max(value[1], value[0])];
620
- }
621
- else {
622
- value = coercion.coerceNumberProperty(v);
623
- }
624
- // While incrementing by a decimal we can end up with values like 33.300000000000004.
625
- // Truncate it to ensure that it matches the label and to make it easier to work with.
626
- if (this._roundToDecimal) {
627
- if (v instanceof Array) {
628
- value = [
629
- parseFloat(value[0].toFixed(this._roundToDecimal)),
630
- parseFloat(value[1].toFixed(this._roundToDecimal)),
631
- ];
632
- }
633
- else {
634
- value = parseFloat(Number(value).toFixed(this._roundToDecimal));
635
- }
636
- }
637
- this._value = value;
638
- this._percent = this._calculatePercentage(this._value);
639
- // Since this also modifies the percentage, we need to let the change detection know.
640
- this._changeDetectorRef.markForCheck();
641
- }
642
- },
643
- enumerable: false,
644
- configurable: true
645
- });
646
- Object.defineProperty(MtxSlider.prototype, "vertical", {
647
- /** Whether the slider is vertical. */
648
- get: function () {
649
- return this._vertical;
650
- },
651
- set: function (value) {
652
- this._vertical = coercion.coerceBooleanProperty(value);
653
- },
654
- enumerable: false,
655
- configurable: true
656
- });
657
- Object.defineProperty(MtxSlider.prototype, "displayValue", {
658
- /** The value to be used for display purposes. */
659
- get: function () {
660
- if (this.value == null) {
661
- return '';
662
- }
663
- if (this.displayWith) {
664
- if (this.value instanceof Array) {
665
- return this.displayWith(this.value[0]);
666
- }
667
- else {
668
- return this.displayWith(this.value);
669
- }
670
- }
671
- // Note that this could be improved further by rounding something like 0.999 to 1 or
672
- // 0.899 to 0.9, however it is very performance sensitive, because it gets called on
673
- // every change detection cycle.
674
- if (this.value instanceof Array) {
675
- if (this._roundToDecimal &&
676
- this.value &&
677
- (this.value[0] % 1 !== 0 || this.value[1] % 1 !== 0)) {
678
- return this.value[0].toFixed(this._roundToDecimal);
679
- }
680
- }
681
- else {
682
- if (this._roundToDecimal && this.value && this.value % 1 !== 0) {
683
- return this.value.toFixed(this._roundToDecimal);
684
- }
685
- }
686
- if (this.value instanceof Array) {
687
- return this.value[0] || 0;
688
- }
689
- else {
690
- return this.value || 0;
691
- }
692
- },
693
- enumerable: false,
694
- configurable: true
695
- });
696
- Object.defineProperty(MtxSlider.prototype, "displayValueRight", {
697
- /** The value to be used for display purposes. */
698
- get: function () {
699
- if (this.value == null) {
700
- return '';
701
- }
702
- if (this.displayWith) {
703
- return this.displayWith(this.value[1]);
704
- }
705
- // Note that this could be improved further by rounding something like 0.999 to 1 or
706
- // 0.899 to 0.9, however it is very performance sensitive, because it gets called on
707
- // every change detection cycle.
708
- if (this._roundToDecimal &&
709
- this.value &&
710
- this.value != null &&
711
- this.value[1] % 1 !== 0) {
712
- return this.value[1].toFixed(this._roundToDecimal);
713
- }
714
- return this.value[1] || 0;
715
- },
716
- enumerable: false,
717
- configurable: true
718
- });
719
- /** set focus to the host element */
720
- MtxSlider.prototype.focus = function () {
721
- this._focusHostElement();
722
- };
723
- /** blur the host element */
724
- MtxSlider.prototype.blur = function () {
725
- this._blurHostElement();
726
- };
727
- Object.defineProperty(MtxSlider.prototype, "percent", {
728
- /** The percentage of the slider that coincides with the value. */
729
- get: function () {
730
- return this._clamp(this._percent);
731
- },
732
- enumerable: false,
733
- configurable: true
734
- });
735
- Object.defineProperty(MtxSlider.prototype, "_invertAxis", {
736
- /**
737
- * Whether the axis of the slider is inverted.
738
- * (i.e. whether moving the thumb in the positive x or y direction decreases the slider's
739
- * value).
740
- */
741
- get: function () {
742
- // Standard non-inverted mode for a vertical slider should be dragging the thumb from bottom
743
- // to top. However from a y-axis standpoint this is inverted.
744
- return this.vertical ? !this.invert : this.invert;
745
- },
746
- enumerable: false,
747
- configurable: true
748
- });
749
- Object.defineProperty(MtxSlider.prototype, "_isMinValue", {
750
- /** Whether the slider is at its minimum value. */
751
- get: function () {
752
- if (this.value instanceof Array) {
753
- return this.percent[0] === 0;
754
- }
755
- else {
756
- return this.percent === 0;
757
- }
758
- },
759
- enumerable: false,
760
- configurable: true
761
- });
762
- Object.defineProperty(MtxSlider.prototype, "_thumbGap", {
763
- /**
764
- * The amount of space to leave between the slider thumb and the track fill & track background
765
- * elements.
766
- */
767
- get: function () {
768
- if (this.disabled) {
769
- return DISABLED_THUMB_GAP;
770
- }
771
- if (this._isMinValue && !this.thumbLabel) {
772
- return this._isActive ? MIN_VALUE_ACTIVE_THUMB_GAP : MIN_VALUE_NONACTIVE_THUMB_GAP;
773
- }
774
- return 0;
775
- },
776
- enumerable: false,
777
- configurable: true
778
- });
779
- Object.defineProperty(MtxSlider.prototype, "_trackBackgroundStylesLeft", {
780
- /** CSS styles for the track background element. */
781
- get: function () {
782
- var axis = this.vertical ? 'Y' : 'X';
783
- var scale = '';
784
- if (this.percent instanceof Array) {
785
- scale = this.vertical ? "1, " + this.percent[0] + ", 1" : this.percent[0] + ", 1, 1";
786
- }
787
- else {
788
- scale = this.vertical ? "1, " + this.percent + ", 1" : this.percent + ", 1, 1";
789
- }
790
- var sign = this._shouldInvertMouseCoords() ? '' : '-';
791
- return {
792
- // scale3d avoids some rendering issues in Chrome. See #12071.
793
- transform: "translate" + axis + "(" + sign + this._thumbGap + "px) scale3d(" + scale + ")",
794
- };
795
- },
796
- enumerable: false,
797
- configurable: true
798
- });
799
- Object.defineProperty(MtxSlider.prototype, "_trackBackgroundStylesRight", {
800
- get: function () {
801
- var axis = this.vertical ? 'Y' : 'X';
802
- var scale = '';
803
- if (this.percent instanceof Array) {
804
- scale = this.vertical ? "1, " + (1 - this.percent[1]) + ", 1" : 1 - this.percent[1] + ", 1, 1";
805
- }
806
- else {
807
- scale = this.vertical ? "1, " + (1 - this.percent) + ", 1" : 1 - this.percent + ", 1, 1";
808
- }
809
- var sign = this._shouldInvertMouseCoords() ? '-' : '';
810
- return {
811
- // scale3d avoids some rendering issues in Chrome. See #12071.
812
- transform: "translate" + axis + "(" + sign + this._thumbGap + "px) scale3d(" + scale + ")",
813
- };
814
- },
815
- enumerable: false,
816
- configurable: true
817
- });
818
- Object.defineProperty(MtxSlider.prototype, "_trackFillStyles", {
819
- /** CSS styles for the track fill element. */
820
- get: function () {
821
- var axis = this.vertical ? 'Y' : 'X';
822
- var scale = '';
823
- if (this.percent instanceof Array) {
824
- scale = this.vertical
825
- ? "1, " + (this.percent[1] - this.percent[0]) + ", 1"
826
- : this.percent[1] - this.percent[0] + ", 1, 1";
827
- }
828
- else {
829
- scale = this.vertical ? "1, " + this.percent + ", 1" : this.percent + ", 1, 1";
830
- }
831
- var invertOffset = this._getDirection() === 'rtl' && !this.vertical ? !this._invertAxis : this._invertAxis;
832
- var offset = 0;
833
- if (this.percent instanceof Array) {
834
- offset = (invertOffset ? 1 - this.percent[1] : this.percent[0]) * 100;
835
- }
836
- else {
837
- offset = 0;
838
- }
839
- var sign = this._shouldInvertMouseCoords() ? '' : '-';
840
- if (this.isRangeSlider()) {
841
- return {
842
- // scale3d avoids some rendering issues in Chrome. See #12071.
843
- transform: "translate" + axis + "(" + offset + "%) scale3d(" + scale + ")",
844
- };
845
- }
846
- else {
847
- return {
848
- // scale3d avoids some rendering issues in Chrome. See #12071.
849
- transform: "translate" + axis + "(" + sign + this._thumbGap + "px) scale3d(" + scale + ")",
850
- };
851
- }
852
- },
853
- enumerable: false,
854
- configurable: true
855
- });
856
- Object.defineProperty(MtxSlider.prototype, "_ticksContainerStyles", {
857
- /** CSS styles for the ticks container element. */
858
- get: function () {
859
- var axis = this.vertical ? 'Y' : 'X';
860
- // For a horizontal slider in RTL languages we push the ticks container off the left edge
861
- // instead of the right edge to avoid causing a horizontal scrollbar to appear.
862
- var sign = !this.vertical && this._getDirection() === 'rtl' ? '' : '-';
863
- var offset = (this._tickIntervalPercent / 2) * 100;
864
- return {
865
- transform: "translate" + axis + "(" + sign + offset + "%)",
866
- };
867
- },
868
- enumerable: false,
869
- configurable: true
870
- });
871
- Object.defineProperty(MtxSlider.prototype, "_ticksStyles", {
872
- /** CSS styles for the ticks element. */
873
- get: function () {
874
- var tickSize = this._tickIntervalPercent * 100;
875
- var backgroundSize = this.vertical ? "2px " + tickSize + "%" : tickSize + "% 2px";
876
- var axis = this.vertical ? 'Y' : 'X';
877
- // Depending on the direction we pushed the ticks container, push the ticks the opposite
878
- // direction to re-center them but clip off the end edge. In RTL languages we need to flip
879
- // the ticks 180 degrees so we're really cutting off the end edge abd not the start.
880
- var sign = !this.vertical && this._getDirection() === 'rtl' ? '-' : '';
881
- var rotate = !this.vertical && this._getDirection() === 'rtl' ? ' rotate(180deg)' : '';
882
- var styles = {
883
- backgroundSize: backgroundSize,
884
- // Without translateZ ticks sometimes jitter as the slider moves on Chrome & Firefox.
885
- transform: "translateZ(0) translate" + axis + "(" + sign + tickSize / 2 + "%)" + rotate,
886
- };
887
- if (this._isMinValue && this._thumbGap) {
888
- var side = this.vertical
889
- ? this._invertAxis
890
- ? 'Bottom'
891
- : 'Top'
892
- : this._invertAxis
893
- ? 'Right'
894
- : 'Left';
895
- styles["padding" + side] = this._thumbGap + "px";
896
- }
897
- return styles;
898
- },
899
- enumerable: false,
900
- configurable: true
901
- });
902
- Object.defineProperty(MtxSlider.prototype, "_thumbContainerStylesLeft", {
903
- get: function () {
904
- var axis = this.vertical ? 'Y' : 'X';
905
- // For a horizontal slider in RTL languages we push the thumb container off the left edge
906
- // instead of the right edge to avoid causing a horizontal scrollbar to appear.
907
- var invertOffset = this._getDirection() === 'rtl' && !this.vertical ? !this._invertAxis : this._invertAxis;
908
- var offset = 0;
909
- if (this.percent instanceof Array) {
910
- offset = (invertOffset ? this.percent[0] : 1 - this.percent[0]) * 100;
911
- }
912
- else {
913
- offset = (invertOffset ? this.percent : 1 - this.percent) * 100;
914
- }
915
- return {
916
- transform: "translate" + axis + "(-" + offset + "%)",
917
- };
918
- },
919
- enumerable: false,
920
- configurable: true
921
- });
922
- Object.defineProperty(MtxSlider.prototype, "_thumbContainerStylesRight", {
923
- get: function () {
924
- var axis = this.vertical ? 'Y' : 'X';
925
- // For a horizontal slider in RTL languages we push the thumb container off the left edge
926
- // instead of the right edge to avoid causing a horizontal scrollbar to appear.
927
- var invertOffset = this._getDirection() === 'rtl' && !this.vertical ? !this._invertAxis : this._invertAxis;
928
- var offset = 0;
929
- if (this.percent instanceof Array) {
930
- offset = (invertOffset ? this.percent[1] : 1 - this.percent[1]) * 100;
931
- }
932
- else {
933
- offset = (invertOffset ? this.percent : 1 - this.percent) * 100;
934
- }
935
- return {
936
- transform: "translate" + axis + "(-" + offset + "%)",
937
- };
938
- },
939
- enumerable: false,
940
- configurable: true
941
- });
942
- /**
943
- * Whether mouse events should be converted to a slider position by calculating their distance
944
- * from the right or bottom edge of the slider as opposed to the top or left.
945
- */
946
- MtxSlider.prototype._shouldInvertMouseCoords = function () {
947
- return this._getDirection() === 'rtl' && !this.vertical ? !this._invertAxis : this._invertAxis;
948
- };
949
- /** The language direction for this slider element. */
950
- MtxSlider.prototype._getDirection = function () {
951
- return this._dir && this._dir.value === 'rtl' ? 'rtl' : 'ltr';
952
- };
953
- MtxSlider.prototype.ngOnInit = function () {
954
- var _this = this;
955
- this._focusMonitor.monitor(this._elementRef, true).subscribe(function (origin) {
956
- _this._isActive = !!origin && origin !== 'keyboard';
957
- _this._changeDetectorRef.detectChanges();
958
- });
959
- if (this._dir) {
960
- this._dirChangeSubscription = this._dir.change.subscribe(function () {
961
- _this._changeDetectorRef.markForCheck();
962
- });
963
- }
964
- };
965
- MtxSlider.prototype.ngOnDestroy = function () {
966
- var element = this._elementRef.nativeElement;
967
- element.removeEventListener('mousedown', this._pointerDown, activeEventOptions);
968
- element.removeEventListener('touchstart', this._pointerDown, activeEventOptions);
969
- this._removeGlobalEvents();
970
- this._focusMonitor.stopMonitoring(this._elementRef);
971
- this._dirChangeSubscription.unsubscribe();
972
- };
973
- MtxSlider.prototype._onMouseenter = function () {
974
- if (this.disabled) {
975
- return;
976
- }
977
- // We save the dimensions of the slider here so we can use them to update the spacing of the
978
- // ticks and determine where on the slider click and slide events happen.
979
- this._sliderDimensions = this._getSliderDimensions();
980
- this._updateTickIntervalPercent();
981
- };
982
- MtxSlider.prototype._onClick = function (event) {
983
- if (this.disabled) {
984
- return;
985
- }
986
- var oldValue;
987
- if (this.value instanceof Array) {
988
- oldValue = [this.value[0], this.value[1]];
989
- }
990
- else {
991
- oldValue = this.value;
992
- }
993
- this._isSliding = false;
994
- this._focusHostElement();
995
- if (!this._sliderDimensions) {
996
- return;
997
- }
998
- var offset = this.vertical ? this._sliderDimensions.top : this._sliderDimensions.left;
999
- var size = this.vertical ? this._sliderDimensions.height : this._sliderDimensions.width;
1000
- var posComponent = this.vertical ? event.clientY : event.clientX;
1001
- // The exact value is calculated from the event and used to find the closest snap value.
1002
- var percent = Number(this._clamp((posComponent - offset) / size));
1003
- if (this._shouldInvertMouseCoords()) {
1004
- percent = 1 - percent;
1005
- }
1006
- if (percent <=
1007
- this.percent[0] +
1008
- (this.percent[1] - this.percent[0]) / 2) {
1009
- this._currentSliderDir = 'l';
1010
- }
1011
- else {
1012
- this._currentSliderDir = 'r';
1013
- }
1014
- if (this._currentSliderDir === 'l') {
1015
- this._updateValueFromPositionLeft({ x: event.clientX, y: event.clientY });
1016
- }
1017
- else {
1018
- this._updateValueFromPositionRight({ x: event.clientX, y: event.clientY });
1019
- }
1020
- // Emit a change and input event if the value changed.
1021
- if (this.value instanceof Array) {
1022
- if (oldValue[0] !== this.value[0] ||
1023
- oldValue[1] !== this.value[1]) {
1024
- this._emitInputEvent();
1025
- this._emitChangeEvent();
1026
- }
1027
- }
1028
- else {
1029
- if (oldValue !== this.value) {
1030
- this._emitInputEvent();
1031
- this._emitChangeEvent();
1032
- }
1033
- }
1034
- };
1035
- MtxSlider.prototype._onFocus = function () {
1036
- // We save the dimensions of the slider here so we can use them to update the spacing of the
1037
- // ticks and determine where on the slider click and slide events happen.
1038
- this._sliderDimensions = this._getSliderDimensions();
1039
- this._updateTickIntervalPercent();
1040
- };
1041
- MtxSlider.prototype._onBlur = function () {
1042
- this.onTouched();
1043
- };
1044
- MtxSlider.prototype._onKeydown = function (event) {
1045
- if (this.disabled) {
1046
- return;
1047
- }
1048
- var oldValue;
1049
- if (this.value instanceof Array) {
1050
- oldValue = [this.value[0], this.value[1]];
1051
- }
1052
- else {
1053
- oldValue = this.value;
1054
- }
1055
- switch (event.keyCode) {
1056
- case keycodes.PAGE_UP:
1057
- this._increment(10);
1058
- break;
1059
- case keycodes.PAGE_DOWN:
1060
- this._increment(-10);
1061
- break;
1062
- case keycodes.END:
1063
- this.value = this.max;
1064
- break;
1065
- case keycodes.HOME:
1066
- this.value = this.min;
1067
- break;
1068
- case keycodes.LEFT_ARROW:
1069
- // NOTE: For a sighted user it would make more sense that when they press an arrow
1070
- // key on an inverted slider the thumb moves in that direction. However for a blind
1071
- // user, nothing about the slider indicates that it is inverted. They will expect
1072
- // left to be decrement, regardless of how it appears on the screen. For speakers
1073
- // ofRTL languages, they probably expect left to mean increment. Therefore we flip
1074
- // the meaning of the side arrow keys for RTL. For inverted sliders we prefer a
1075
- // good a11y experience to having it "look right" for sighted users, therefore we do
1076
- // not swap the meaning.
1077
- this._increment(this._getDirection() === 'rtl' ? 1 : -1);
1078
- break;
1079
- case keycodes.UP_ARROW:
1080
- this._increment(1);
1081
- break;
1082
- case keycodes.RIGHT_ARROW:
1083
- // See comment on LEFT_ARROW about the conditions under which we flip the meaning.
1084
- this._increment(this._getDirection() === 'rtl' ? -1 : 1);
1085
- break;
1086
- case keycodes.DOWN_ARROW:
1087
- this._increment(-1);
1088
- break;
1089
- default:
1090
- // Return if the key is not one that we explicitly handle to avoid calling
1091
- // preventDefault on it.
1092
- return;
1093
- }
1094
- if (this.value instanceof Array) {
1095
- if (oldValue[0] !== this.value[0] ||
1096
- oldValue[1] !== this.value[1]) {
1097
- this._emitInputEvent();
1098
- this._emitChangeEvent();
1099
- }
1100
- }
1101
- else {
1102
- if (oldValue !== this.value) {
1103
- this._emitInputEvent();
1104
- this._emitChangeEvent();
1105
- }
1106
- }
1107
- this._isSliding = true;
1108
- event.preventDefault();
1109
- };
1110
- MtxSlider.prototype._onKeyup = function () {
1111
- this._isSliding = false;
1112
- };
1113
- /**
1114
- * Binds our global move and end events. They're bound at the document level and only while
1115
- * dragging so that the user doesn't have to keep their pointer exactly over the slider
1116
- * as they're swiping across the screen.
1117
- */
1118
- MtxSlider.prototype._bindGlobalEvents = function (triggerEvent) {
1119
- if (typeof document !== 'undefined' && document) {
1120
- var isTouch = isTouchEvent(triggerEvent);
1121
- var moveEventName = isTouch ? 'touchmove' : 'mousemove';
1122
- var endEventName = isTouch ? 'touchend' : 'mouseup';
1123
- document.body.addEventListener(moveEventName, this._pointerMove, activeEventOptions);
1124
- document.body.addEventListener(endEventName, this._pointerUp, activeEventOptions);
1125
- }
1126
- };
1127
- /** Removes any global event listeners that we may have added. */
1128
- MtxSlider.prototype._removeGlobalEvents = function () {
1129
- if (typeof document !== 'undefined' && document) {
1130
- document.body.removeEventListener('mousemove', this._pointerMove, activeEventOptions);
1131
- document.body.removeEventListener('mouseup', this._pointerUp, activeEventOptions);
1132
- document.body.removeEventListener('touchmove', this._pointerMove, activeEventOptions);
1133
- document.body.removeEventListener('touchend', this._pointerUp, activeEventOptions);
1134
- }
1135
- };
1136
- /** Increments the slider by the given number of steps (negative number decrements). */
1137
- MtxSlider.prototype._increment = function (numSteps) {
1138
- if (this.value instanceof Array) {
1139
- this.value = this._clamp([(this.value[0] || 0) + this.step * numSteps, (this.value[1] || 0) + this.step * numSteps], this.min, this.max);
1140
- }
1141
- else {
1142
- this.value = this._clamp((this.value || 0) + this.step * numSteps, this.min, this.max);
1143
- }
1144
- };
1145
- /** Calculate the new value from the new physical location. The value will always be snapped. */
1146
- MtxSlider.prototype._updateValueFromPosition = function (pos) {
1147
- if (!this._sliderDimensions) {
1148
- return;
1149
- }
1150
- var offset = this.vertical ? this._sliderDimensions.top : this._sliderDimensions.left;
1151
- var size = this.vertical ? this._sliderDimensions.height : this._sliderDimensions.width;
1152
- var posComponent = this.vertical ? pos.y : pos.x;
1153
- // The exact value is calculated from the event and used to find the closest snap value.
1154
- var percent = this._clamp((posComponent - offset) / size);
1155
- if (this._shouldInvertMouseCoords()) {
1156
- percent = 1 - percent;
1157
- }
1158
- // Since the steps may not divide cleanly into the max value, if the user
1159
- // slid to 0 or 100 percent, we jump to the min/max value. This approach
1160
- // is slightly more intuitive than using `Math.ceil` below, because it
1161
- // follows the user's pointer closer.
1162
- if (percent === 0) {
1163
- this.value = this.min;
1164
- }
1165
- else if (percent === 1) {
1166
- this.value = this.max;
1167
- }
1168
- else {
1169
- var exactValue = this._calculateValue(percent);
1170
- // This calculation finds the closest step by finding the closest
1171
- // whole number divisible by the step relative to the min.
1172
- var closestValue = Math.round((exactValue - this.min) / this.step) * this.step + this.min;
1173
- // The value needs to snap to the min and max.
1174
- this.value = this._clamp(closestValue, this.min, this.max);
1175
- }
1176
- };
1177
- /** Calculate the new value from the new physical location. The value will always be snapped. */
1178
- MtxSlider.prototype._updateValueFromPositionLeft = function (pos) {
1179
- if (!this._sliderDimensions) {
1180
- return;
1181
- }
1182
- var offset = this.vertical ? this._sliderDimensions.top : this._sliderDimensions.left;
1183
- var size = this.vertical ? this._sliderDimensions.height : this._sliderDimensions.width;
1184
- var posComponent = this.vertical ? pos.y : pos.x;
1185
- // The exact value is calculated from the event and used to find the closest snap value.
1186
- var percent = Number(this._clamp((posComponent - offset) / size));
1187
- if (this._shouldInvertMouseCoords()) {
1188
- percent = 1 - percent;
1189
- }
1190
- // Since the steps may not divide cleanly into the max value, if the user
1191
- // slid to 0 or 100 percent, we jump to the min/max value. This approach
1192
- // is slightly more intuitive than using `Math.ceil` below, because it
1193
- // follows the user's pointer closer.
1194
- if (percent === 0) {
1195
- if (this.value instanceof Array) {
1196
- this.value = [this.min, this.value[1]];
1197
- }
1198
- else {
1199
- this.value = this.min;
1200
- }
1201
- }
1202
- else if (percent === 1) {
1203
- if (this.value instanceof Array) {
1204
- this.value = [this.max, this.value[1]];
1205
- }
1206
- else {
1207
- this.value = this.max;
1208
- }
1209
- }
1210
- else {
1211
- var exactValue = this._calculateValue(percent);
1212
- // This calculation finds the closest step by finding the closest
1213
- // whole number divisible by the step relative to the min.
1214
- var closestValue = Math.round((Number(exactValue) - this.min) / this.step) * this.step + this.min;
1215
- // The value needs to snap to the min and max.
1216
- if (this.value instanceof Array) {
1217
- this.value = [Number(this._clamp(closestValue, this.min, this.max)), this.value[1]];
1218
- }
1219
- else {
1220
- this.value = this._clamp(closestValue, this.min, this.max);
1221
- }
1222
- }
1223
- };
1224
- /** Calculate the new value from the new physical location. The value will always be snapped. */
1225
- MtxSlider.prototype._updateValueFromPositionRight = function (pos) {
1226
- if (!this._sliderDimensions) {
1227
- return;
1228
- }
1229
- var offset = this.vertical ? this._sliderDimensions.top : this._sliderDimensions.left;
1230
- var size = this.vertical ? this._sliderDimensions.height : this._sliderDimensions.width;
1231
- var posComponent = this.vertical ? pos.y : pos.x;
1232
- // The exact value is calculated from the event and used to find the closest snap value.
1233
- var percent = Number(this._clamp((posComponent - offset) / size));
1234
- if (this._shouldInvertMouseCoords()) {
1235
- percent = 1 - percent;
1236
- }
1237
- // Since the steps may not divide cleanly into the max value, if the user
1238
- // slid to 0 or 100 percent, we jump to the min/max value. This approach
1239
- // is slightly more intuitive than using `Math.ceil` below, because it
1240
- // follows the user's pointer closer.
1241
- if (percent === 0) {
1242
- if (this.value instanceof Array) {
1243
- this.value = [this.value[0], this.min];
1244
- }
1245
- else {
1246
- this.value = this.min;
1247
- }
1248
- }
1249
- else if (percent === 1) {
1250
- if (this.value instanceof Array) {
1251
- this.value = [this.value[0], this.max];
1252
- }
1253
- else {
1254
- this.value = this.max;
1255
- }
1256
- }
1257
- else {
1258
- var exactValue = this._calculateValue(percent);
1259
- // This calculation finds the closest step by finding the closest
1260
- // whole number divisible by the step relative to the min.
1261
- var closestValue = Math.round((Number(exactValue) - this.min) / this.step) * this.step + this.min;
1262
- // The value needs to snap to the min and max.
1263
- if (this.value instanceof Array) {
1264
- this.value = [this.value[0], Number(this._clamp(closestValue, this.min, this.max))];
1265
- }
1266
- else {
1267
- this.value = this._clamp(closestValue, this.min, this.max);
1268
- }
1269
- }
1270
- };
1271
- /** Emits a change event if the current value is different from the last emitted value. */
1272
- MtxSlider.prototype._emitChangeEvent = function () {
1273
- this._controlValueAccessorChangeFn(this.value);
1274
- this.valueChange.emit(this.value);
1275
- this.change.emit(this._createChangeEvent());
1276
- };
1277
- /** Emits an input event when the current value is different from the last emitted value. */
1278
- MtxSlider.prototype._emitInputEvent = function () {
1279
- this.input.emit(this._createChangeEvent());
1280
- };
1281
- /** Updates the amount of space between ticks as a percentage of the width of the slider. */
1282
- MtxSlider.prototype._updateTickIntervalPercent = function () {
1283
- if (!this.tickInterval || !this._sliderDimensions) {
1284
- return;
1285
- }
1286
- if (this.tickInterval === 'auto') {
1287
- var trackSize = this.vertical
1288
- ? this._sliderDimensions.height
1289
- : this._sliderDimensions.width;
1290
- var pixelsPerStep = (trackSize * this.step) / (this.max - this.min);
1291
- var stepsPerTick = Math.ceil(MIN_AUTO_TICK_SEPARATION / pixelsPerStep);
1292
- var pixelsPerTick = stepsPerTick * this.step;
1293
- this._tickIntervalPercent = pixelsPerTick / trackSize;
1294
- }
1295
- else {
1296
- this._tickIntervalPercent = (this.tickInterval * this.step) / (this.max - this.min);
1297
- }
1298
- };
1299
- /** Creates a slider change object from the specified value. */
1300
- MtxSlider.prototype._createChangeEvent = function (value) {
1301
- if (value === void 0) { value = this.value; }
1302
- var event = new MtxSliderChange();
1303
- event.source = this;
1304
- event.value = value;
1305
- return event;
1306
- };
1307
- /** Calculates the percentage of the slider that a value is. */
1308
- MtxSlider.prototype._calculatePercentage = function (value) {
1309
- if (value instanceof Array) {
1310
- return [
1311
- ((value[0] || 0) - this.min) / (this.max - this.min),
1312
- ((value[1] || 0) - this.min) / (this.max - this.min),
1313
- ];
1314
- }
1315
- else {
1316
- return ((value || 0) - this.min) / (this.max - this.min);
1317
- }
1318
- };
1319
- /** Calculates the value a percentage of the slider corresponds to. */
1320
- MtxSlider.prototype._calculateValue = function (percentage) {
1321
- if (percentage instanceof Array) {
1322
- return [
1323
- this.min + percentage[0] * (this.max - this.min),
1324
- this.min + percentage[1] * (this.max - this.min),
1325
- ];
1326
- }
1327
- else {
1328
- return this.min + percentage * (this.max - this.min);
1329
- }
1330
- };
1331
- /** Return a number between two numbers. */
1332
- MtxSlider.prototype._clamp = function (value, min, max) {
1333
- if (min === void 0) { min = 0; }
1334
- if (max === void 0) { max = 1; }
1335
- if (value instanceof Array) {
1336
- return [Math.max(min, Math.min(value[0], max)), Math.max(min, Math.min(value[1], max))];
1337
- }
1338
- else {
1339
- return Math.max(min, Math.min(value, max));
1340
- }
1341
- };
1342
- /**
1343
- * Get the bounding client rect of the slider track element.
1344
- * The track is used rather than the native element to ignore the extra space that the thumb can
1345
- * take up.
1346
- */
1347
- MtxSlider.prototype._getSliderDimensions = function () {
1348
- return this._sliderWrapper ? this._sliderWrapper.nativeElement.getBoundingClientRect() : null;
1349
- };
1350
- /**
1351
- * Focuses the native element.
1352
- * Currently only used to allow a blur event to fire but will be used with keyboard input later.
1353
- */
1354
- MtxSlider.prototype._focusHostElement = function () {
1355
- this._elementRef.nativeElement.focus();
1356
- };
1357
- /** Blurs the native element. */
1358
- MtxSlider.prototype._blurHostElement = function () {
1359
- this._elementRef.nativeElement.blur();
1360
- };
1361
- /** Runs a callback outside of the NgZone, if possible. */
1362
- MtxSlider.prototype._runOutsizeZone = function (fn) {
1363
- // @breaking-change 9.0.0 Remove this function once `_ngZone` is a required parameter.
1364
- this._ngZone ? this._ngZone.runOutsideAngular(fn) : fn();
1365
- };
1366
- /** Runs a callback inside of the NgZone, if possible. */
1367
- MtxSlider.prototype._runInsideZone = function (fn) {
1368
- // @breaking-change 9.0.0 Remove this function once `_ngZone` is a required parameter.
1369
- this._ngZone ? this._ngZone.run(fn) : fn();
1370
- };
1371
- /**
1372
- * Sets the model value. Implemented as part of ControlValueAccessor.
1373
- * @param value
1374
- */
1375
- MtxSlider.prototype.writeValue = function (value) {
1376
- this.value = value;
1377
- };
1378
- /**
1379
- * Registers a callback to be triggered when the value has changed.
1380
- * Implemented as part of ControlValueAccessor.
1381
- * @param fn Callback to be registered.
1382
- */
1383
- MtxSlider.prototype.registerOnChange = function (fn) {
1384
- this._controlValueAccessorChangeFn = fn;
1385
- };
1386
- /**
1387
- * Registers a callback to be triggered when the component is touched.
1388
- * Implemented as part of ControlValueAccessor.
1389
- * @param fn Callback to be registered.
1390
- */
1391
- MtxSlider.prototype.registerOnTouched = function (fn) {
1392
- this.onTouched = fn;
1393
- };
1394
- /**
1395
- * Sets whether the component should be disabled.
1396
- * Implemented as part of ControlValueAccessor.
1397
- * @param isDisabled
1398
- */
1399
- MtxSlider.prototype.setDisabledState = function (isDisabled) {
1400
- this.disabled = isDisabled;
1401
- };
1402
- MtxSlider.prototype.isRangeSlider = function () {
1403
- return this.value instanceof Array;
1404
- };
1405
- MtxSlider.prototype.calculateInitialSlideDirection = function (event) {
1406
- if (!this._sliderDimensions) {
1407
- return;
1408
- }
1409
- var offset = this.vertical ? this._sliderDimensions.top : this._sliderDimensions.left;
1410
- var size = this.vertical ? this._sliderDimensions.height : this._sliderDimensions.width;
1411
- var pointerPosition = getPointerPositionOnPage(event);
1412
- var posComponent = this.vertical ? pointerPosition.y : pointerPosition.x;
1413
- // The exact value is calculated from the event and used to find the closest snap value.
1414
- var percent = Number(this._clamp((posComponent - offset) / size));
1415
- if (this._shouldInvertMouseCoords()) {
1416
- percent = 1 - percent;
1417
- }
1418
- if (percent <=
1419
- this.percent[0] +
1420
- (this.percent[1] - this.percent[0]) / 2) {
1421
- this._currentSliderDir = 'l';
1422
- }
1423
- else {
1424
- this._currentSliderDir = 'r';
1425
- }
1426
- };
1427
- return MtxSlider;
1428
- }(_MtxSliderBase));
1429
- /** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
1430
- MtxSlider.decorators = [
1431
- { type: core.Component, args: [{
1432
- selector: 'mtx-slider',
1433
- exportAs: 'mtxSlider',
1434
- providers: [MTX_SLIDER_VALUE_ACCESSOR],
1435
- host: {
1436
- '(focus)': '_onFocus()',
1437
- '(blur)': '_onBlur()',
1438
- '(click)': '_onClick($event)',
1439
- '(keydown)': '_onKeydown($event)',
1440
- '(keyup)': '_onKeyup()',
1441
- '(mouseenter)': '_onMouseenter()',
1442
- // On Safari starting to slide temporarily triggers text selection mode which
1443
- // show the wrong cursor. We prevent it by stopping the `selectstart` event.
1444
- '(selectstart)': '$event.preventDefault()',
1445
- 'class': 'mtx-slider mat-focus-indicator',
1446
- 'role': 'slider',
1447
- '[tabIndex]': 'tabIndex',
1448
- '[attr.aria-disabled]': 'disabled',
1449
- '[attr.aria-valuemax]': 'max',
1450
- '[attr.aria-valuemin]': 'min',
1451
- '[attr.aria-valuenow]': 'value',
1452
- // NVDA and Jaws appear to announce the `aria-valuenow` by calculating its percentage based
1453
- // on its value between `aria-valuemin` and `aria-valuemax`. Due to how decimals are handled,
1454
- // it can cause the slider to read out a very long value like 0.20000068 if the current value
1455
- // is 0.2 with a min of 0 and max of 1. We work around the issue by setting `aria-valuetext`
1456
- // to the same value that we set on the slider's thumb which will be truncated.
1457
- '[attr.aria-valuetext]': 'valueText == null ? displayValue : valueText',
1458
- '[attr.aria-orientation]': 'vertical ? "vertical" : "horizontal"',
1459
- '[class.mtx-slider-disabled]': 'disabled',
1460
- '[class.mtx-slider-has-ticks]': 'tickInterval',
1461
- '[class.mtx-slider-horizontal]': '!vertical',
1462
- '[class.mtx-slider-axis-inverted]': '_invertAxis',
1463
- '[class.mtx-slider-sliding]': '_isSliding',
1464
- '[class.mtx-slider-thumb-label-showing]': 'thumbLabel',
1465
- '[class.mtx-slider-vertical]': 'vertical',
1466
- '[class.mtx-slider-min-value]': '_isMinValue',
1467
- '[class.mtx-range-slider]': 'isRangeSlider()',
1468
- '[class.mtx-slider-hide-last-tick]': 'disabled || _isMinValue && _thumbGap && _invertAxis',
1469
- '[class._mtx-animation-noopable]': '_animationMode === "NoopAnimations"',
1470
- },
1471
- template: "<div class=\"mtx-slider-wrapper\" #sliderWrapper>\n <div class=\"mtx-slider-track-wrapper\">\n <div *ngIf=\"isRangeSlider()\"\n class=\"mtx-slider-track-background mtx-slider-track-background-left\"\n [ngStyle]=\"_trackBackgroundStylesLeft\"></div>\n <div class=\"mtx-slider-track-background mtx-slider-track-background-right\"\n [ngStyle]=\"_trackBackgroundStylesRight\"></div>\n <div class=\"mtx-slider-track-fill\" [ngClass]=\"{'mtx-range-slider-fill': isRangeSlider()}\"\n [ngStyle]=\"_trackFillStyles\"></div>\n </div>\n <div class=\"mtx-slider-ticks-container\" [ngStyle]=\"_ticksContainerStyles\">\n <div class=\"mtx-slider-ticks\" [ngStyle]=\"_ticksStyles\"></div>\n </div>\n <div class=\"mtx-slider-thumb-container\" #leftSlider\n [ngStyle]=\"_thumbContainerStylesLeft\">\n <div class=\"mtx-slider-focus-ring\"></div>\n <div class=\"mtx-slider-thumb left\"></div>\n <div class=\"mtx-slider-thumb-label\">\n <span class=\"mtx-slider-thumb-label-text\">{{displayValue}}</span>\n </div>\n </div>\n <div *ngIf=\"isRangeSlider()\"\n class=\"mtx-slider-thumb-container\" #rightSlider\n [ngStyle]=\"_thumbContainerStylesRight\">\n <div class=\"mtx-slider-focus-ring\"></div>\n <div class=\"mtx-slider-thumb right\"></div>\n <div class=\"mtx-slider-thumb-label\">\n <span class=\"mtx-slider-thumb-label-text\">{{displayValueRight}}</span>\n </div>\n </div>\n</div>\n",
1472
- inputs: ['disabled', 'color', 'tabIndex'],
1473
- encapsulation: core.ViewEncapsulation.None,
1474
- changeDetection: core.ChangeDetectionStrategy.OnPush,
1475
- styles: [".mtx-slider{display:inline-block;position:relative;box-sizing:border-box;padding:8px;outline:none;vertical-align:middle}.mtx-slider:not(.mtx-slider-disabled):active,.mtx-slider.mtx-slider-sliding:not(.mtx-slider-disabled){cursor:grabbing}.mtx-slider-wrapper{-webkit-print-color-adjust:exact;color-adjust:exact;position:absolute}.mtx-slider-track-wrapper{position:absolute;top:0;left:0;overflow:hidden}.mtx-slider-track-fill{position:absolute;transform-origin:0 0;transition:transform .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1)}.mtx-slider-track-background-left{position:absolute;transform-origin:0 0;transition:transform .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1)}.mtx-slider-track-background-right{position:absolute;transform-origin:100% 100%;transition:transform .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1)}.mtx-slider-ticks-container{position:absolute;left:0;top:0;overflow:hidden}.mtx-slider-ticks{-webkit-background-clip:content-box;background-repeat:repeat;background-clip:content-box;box-sizing:border-box;opacity:0;transition:opacity .4s cubic-bezier(.25,.8,.25,1)}.mtx-slider-thumb-container{position:absolute;z-index:1;transition:transform .4s cubic-bezier(.25,.8,.25,1)}.mtx-slider-focus-ring{position:absolute;width:30px;height:30px;border-radius:50%;transform:scale(0);opacity:0;transition:transform .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1),opacity .4s cubic-bezier(.25,.8,.25,1)}.mtx-slider.cdk-keyboard-focused .mtx-slider-focus-ring,.mtx-slider.cdk-program-focused .mtx-slider-focus-ring{transform:scale(1);opacity:1}.mtx-slider:not(.mtx-slider-disabled):not(.mtx-slider-sliding) .mtx-slider-thumb-label,.mtx-slider:not(.mtx-slider-disabled):not(.mtx-slider-sliding) .mtx-slider-thumb{cursor:grab}.mtx-slider-thumb{position:absolute;right:-10px;bottom:-10px;box-sizing:border-box;width:20px;height:20px;border:3px solid transparent;border-radius:50%;transform:scale(.7);transition:transform .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1),border-color .4s cubic-bezier(.25,.8,.25,1)}.mtx-slider-thumb-label{display:none;align-items:center;justify-content:center;position:absolute;width:28px;height:28px;border-radius:50%;transition:transform .4s cubic-bezier(.25,.8,.25,1),border-radius .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1)}.cdk-high-contrast-active .mtx-slider-thumb-label{outline:solid 1px}.mtx-slider-thumb-label-text{z-index:1;opacity:0;transition:opacity .4s cubic-bezier(.25,.8,.25,1)}.mtx-slider-sliding .mtx-slider-track-fill,.mtx-slider-sliding .mtx-slider-track-background-left,.mtx-slider-sliding .mtx-slider-track-background-right,.mtx-slider-sliding .mtx-slider-thumb-container{transition-duration:0ms}.mtx-slider-has-ticks .mtx-slider-wrapper:after{content:\"\";position:absolute;border-width:0;border-style:solid;opacity:0;transition:opacity .4s cubic-bezier(.25,.8,.25,1)}.mtx-slider-has-ticks.cdk-focused:not(.mtx-slider-hide-last-tick) .mtx-slider-wrapper:after,.mtx-slider-has-ticks:hover:not(.mtx-slider-hide-last-tick) .mtx-slider-wrapper:after{opacity:1}.mtx-slider-has-ticks.cdk-focused:not(.mtx-slider-disabled) .mtx-slider-ticks,.mtx-slider-has-ticks:hover:not(.mtx-slider-disabled) .mtx-slider-ticks{opacity:1}.mtx-slider-thumb-label-showing .mtx-slider-focus-ring{display:none}.mtx-slider-thumb-label-showing .mtx-slider-thumb-label{display:flex}.mtx-slider-axis-inverted .mtx-slider-track-fill{transform-origin:100% 100%}.mtx-slider-axis-inverted .mtx-slider-track-fill.mtx-range-slider-fill{transform-origin:0 0}.mtx-slider-axis-inverted .mtx-slider-track-background-left{transform-origin:100% 100%}.mtx-slider-axis-inverted .mtx-slider-track-background-right{transform-origin:0 0}.mtx-slider:not(.mtx-slider-disabled).cdk-focused.mtx-slider-thumb-label-showing .mtx-slider-thumb{transform:scale(0)}.mtx-slider:not(.mtx-slider-disabled).cdk-focused .mtx-slider-thumb-label{border-radius:50% 50% 0}.mtx-slider:not(.mtx-slider-disabled).cdk-focused .mtx-slider-thumb-label-text{opacity:1}.mtx-slider:not(.mtx-slider-disabled).cdk-mouse-focused .mtx-slider-thumb,.mtx-slider:not(.mtx-slider-disabled).cdk-touch-focused .mtx-slider-thumb,.mtx-slider:not(.mtx-slider-disabled).cdk-program-focused .mtx-slider-thumb{border-width:2px;transform:scale(1)}.mtx-slider-disabled .mtx-slider-focus-ring{transform:scale(0);opacity:0}.mtx-slider-disabled .mtx-slider-thumb{border-width:4px;transform:scale(.5)}.mtx-slider-disabled .mtx-slider-thumb-label{display:none}.mtx-slider-horizontal{height:48px;min-width:128px}.mtx-slider-horizontal .mtx-slider-wrapper{height:2px;top:23px;left:8px;right:8px}.mtx-slider-horizontal .mtx-slider-wrapper:after{height:2px;border-left-width:2px;right:0;top:0}.mtx-slider-horizontal .mtx-slider-track-wrapper{height:2px;width:100%}.mtx-slider-horizontal .mtx-slider-track-fill{height:2px;width:100%;transform:scaleX(0)}.mtx-slider-horizontal .mtx-slider-track-background-left,.mtx-slider-horizontal .mtx-slider-track-background-right{height:2px;width:100%;transform:scaleX(1)}.mtx-slider-horizontal .mtx-slider-ticks-container{height:2px;width:100%}.cdk-high-contrast-active .mtx-slider-horizontal .mtx-slider-ticks-container{height:0;outline:solid 2px;top:1px}.mtx-slider-horizontal .mtx-slider-ticks{height:2px;width:100%}.mtx-slider-horizontal .mtx-slider-thumb-container{width:100%;height:0;top:50%}.mtx-slider-horizontal .mtx-slider-focus-ring{top:-15px;right:-15px}.mtx-slider-horizontal .mtx-slider-thumb-label{right:-14px;top:-40px;transform:translateY(26px) scale(.01) rotate(45deg)}.mtx-slider-horizontal .mtx-slider-thumb-label-text{transform:rotate(-45deg)}.mtx-slider-horizontal.cdk-focused .mtx-slider-thumb-label{transform:rotate(45deg)}.cdk-high-contrast-active .mtx-slider-horizontal.cdk-focused .mtx-slider-thumb-label,.cdk-high-contrast-active .mtx-slider-horizontal.cdk-focused .mtx-slider-thumb-label-text{transform:none}.mtx-slider-vertical{width:48px;min-height:128px}.mtx-slider-vertical .mtx-slider-wrapper{width:2px;top:8px;bottom:8px;left:23px}.mtx-slider-vertical .mtx-slider-wrapper:after{width:2px;border-top-width:2px;bottom:0;left:0}.mtx-slider-vertical .mtx-slider-track-wrapper{height:100%;width:2px}.mtx-slider-vertical .mtx-slider-track-fill{height:100%;width:2px;transform:scaleY(0)}.mtx-slider-vertical .mtx-slider-track-background-left,.mtx-slider-vertical .mtx-slider-track-background-right{height:100%;width:2px;transform:scaleY(1)}.mtx-slider-vertical .mtx-slider-ticks-container{width:2px;height:100%}.cdk-high-contrast-active .mtx-slider-vertical .mtx-slider-ticks-container{width:0;outline:solid 2px;left:1px}.mtx-slider-vertical .mtx-slider-focus-ring{bottom:-15px;left:-15px}.mtx-slider-vertical .mtx-slider-ticks{width:2px;height:100%}.mtx-slider-vertical .mtx-slider-thumb-container{height:100%;width:0;left:50%}.mtx-slider-vertical .mtx-slider-thumb{-webkit-backface-visibility:hidden;backface-visibility:hidden}.mtx-slider-vertical .mtx-slider-thumb-label{bottom:-14px;left:-40px;transform:translate(26px) scale(.01) rotate(-45deg)}.mtx-slider-vertical .mtx-slider-thumb-label-text{transform:rotate(45deg)}.mtx-slider-vertical.cdk-focused .mtx-slider-thumb-label{transform:rotate(-45deg)}[dir=rtl] .mtx-slider-wrapper:after{left:0;right:auto}[dir=rtl] .mtx-slider-horizontal .mtx-slider-track-fill:not(.mtx-range-slider-fill){transform-origin:100% 100%}[dir=rtl] .mtx-slider-horizontal .mtx-slider-track-background-left{transform-origin:100% 100%}[dir=rtl] .mtx-slider-horizontal .mtx-slider-track-background-right{transform-origin:0 0}[dir=rtl] .mtx-slider-horizontal.mtx-slider-axis-inverted .mtx-slider-track-fill{transform-origin:0 0}[dir=rtl] .mtx-slider-horizontal.mtx-slider-axis-inverted .mtx-slider-track-background-left{transform-origin:0 0}[dir=rtl] .mtx-slider-horizontal.mtx-slider-axis-inverted .mtx-slider-track-background-right{transform-origin:100% 100%}.mtx-slider._mtx-animation-noopable .mtx-slider-track-fill,.mtx-slider._mtx-animation-noopable .mtx-slider-track-background-left,.mtx-slider._mtx-animation-noopable .mtx-slider-track-background-right,.mtx-slider._mtx-animation-noopable .mtx-slider-ticks,.mtx-slider._mtx-animation-noopable .mtx-slider-thumb-container,.mtx-slider._mtx-animation-noopable .mtx-slider-focus-ring,.mtx-slider._mtx-animation-noopable .mtx-slider-thumb,.mtx-slider._mtx-animation-noopable .mtx-slider-thumb-label,.mtx-slider._mtx-animation-noopable .mtx-slider-thumb-label-text,.mtx-slider._mtx-animation-noopable .mtx-slider-has-ticks .mtx-slider-wrapper:after{transition:none}\n"]
1476
- },] }
1477
- ];
1478
- /**
1479
- * @type {function(): !Array<(null|{
1480
- * type: ?,
1481
- * decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>),
1482
- * })>}
1483
- * @nocollapse
1484
- */
1485
- MtxSlider.ctorParameters = function () { return [
1486
- { type: core.ElementRef },
1487
- { type: a11y.FocusMonitor },
1488
- { type: core.ChangeDetectorRef },
1489
- { type: bidi.Directionality, decorators: [{ type: core.Optional }] },
1490
- { type: String, decorators: [{ type: core.Attribute, args: ['tabindex',] }] },
1491
- { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [animations.ANIMATION_MODULE_TYPE,] }] },
1492
- { type: core.NgZone }
1493
- ]; };
1494
- /** @type {!Object<string, !Array<{type: !Function, args: (undefined|!Array<?>)}>>} */
1495
- MtxSlider.propDecorators = {
1496
- invert: [{ type: core.Input }],
1497
- max: [{ type: core.Input }],
1498
- min: [{ type: core.Input }],
1499
- step: [{ type: core.Input }],
1500
- thumbLabel: [{ type: core.Input }],
1501
- tickInterval: [{ type: core.Input }],
1502
- value: [{ type: core.Input }],
1503
- displayWith: [{ type: core.Input }],
1504
- valueText: [{ type: core.Input }],
1505
- vertical: [{ type: core.Input }],
1506
- change: [{ type: core.Output }],
1507
- input: [{ type: core.Output }],
1508
- valueChange: [{ type: core.Output }],
1509
- _sliderWrapper: [{ type: core.ViewChild, args: ['sliderWrapper',] }]
1510
- };
1511
- /** Returns whether an event is a touch event. */
1512
- function isTouchEvent(event) {
1513
- // This function is called for every pixel that the user has dragged so we need it to be
1514
- // as fast as possible. Since we only bind mouse events and touch events, we can assume
1515
- // that if the event's name starts with `t`, it's a touch event.
1516
- return event.type[0] === 't';
1517
- }
1518
- /** Gets the coordinates of a touch or mouse event relative to the viewport. */
1519
- function getPointerPositionOnPage(event) {
1520
- // `touches` will be empty for start/end events so we have to fall back to `changedTouches`.
1521
- var point = isTouchEvent(event) ? event.touches[0] || event.changedTouches[0] : event;
1522
- return { x: point.clientX, y: point.clientY };
1523
- }
1524
-
1525
- var MtxSliderModule = /** @class */ (function () {
1526
- function MtxSliderModule() {
1527
- }
1528
- return MtxSliderModule;
1529
- }());
1530
- /** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */
1531
- MtxSliderModule.decorators = [
1532
- { type: core.NgModule, args: [{
1533
- imports: [common.CommonModule, core$1.MatCommonModule],
1534
- exports: [MtxSlider, core$1.MatCommonModule],
1535
- declarations: [MtxSlider],
1536
- },] }
1537
- ];
1538
-
1539
- /**
1540
- * Generated bundle index. Do not edit.
1541
- */
1542
-
1543
- exports.MTX_SLIDER_VALUE_ACCESSOR = MTX_SLIDER_VALUE_ACCESSOR;
1544
- exports.MtxSlider = MtxSlider;
1545
- exports.MtxSliderChange = MtxSliderChange;
1546
- exports.MtxSliderModule = MtxSliderModule;
1547
-
1548
- Object.defineProperty(exports, '__esModule', { value: true });
1549
-
1550
- }));
1551
- //# sourceMappingURL=mtxSlider.umd.js.map