@ng-matero/extensions 16.1.2 → 16.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (114) hide show
  1. package/README.md +2 -2
  2. package/_index.scss +0 -3
  3. package/_theming.scss +0 -3
  4. package/alert/_alert-theme.scss +12 -28
  5. package/alert/alert.scss +28 -0
  6. package/colorpicker/_colorpicker-theme.scss +20 -8
  7. package/colorpicker/colorpicker-toggle.scss +23 -17
  8. package/core/style/_sass-utils.scss +49 -0
  9. package/core/theming/_all-theme.scss +0 -2
  10. package/core/tokens/_token-utils.scss +127 -0
  11. package/core/tokens/m2/_index.scss +49 -0
  12. package/core/tokens/m2/mdc/_plain-tooltip.scss +72 -0
  13. package/core/tokens/m2/mtx/_alert.scss +55 -0
  14. package/core/tokens/m2/mtx/_colorpicker.scss +55 -0
  15. package/core/tokens/m2/mtx/_datetimepicker.scss +155 -0
  16. package/core/tokens/m2/mtx/_drawer.scss +45 -0
  17. package/core/tokens/m2/mtx/_grid.scss +53 -0
  18. package/core/tokens/m2/mtx/_loader.scss +45 -0
  19. package/core/tokens/m2/mtx/_popover.scss +46 -0
  20. package/core/tokens/m2/mtx/_progress.scss +56 -0
  21. package/core/tokens/m2/mtx/_select.scss +83 -0
  22. package/core/tokens/m2/mtx/_split.scss +54 -0
  23. package/core/typography/_typography.scss +203 -36
  24. package/datetimepicker/_datetimepicker-theme.scss +31 -183
  25. package/datetimepicker/calendar-body.scss +81 -1
  26. package/datetimepicker/calendar.scss +33 -3
  27. package/datetimepicker/clock.scss +50 -10
  28. package/datetimepicker/datetimepicker-content.scss +12 -0
  29. package/datetimepicker/datetimepicker-toggle.scss +23 -17
  30. package/datetimepicker/time.scss +41 -1
  31. package/drawer/_drawer-theme.scss +6 -10
  32. package/drawer/drawer-container.scss +11 -0
  33. package/esm2022/alert/alert.mjs +4 -4
  34. package/esm2022/colorpicker/colorpicker-toggle.mjs +2 -2
  35. package/esm2022/datetimepicker/calendar-body.mjs +2 -2
  36. package/esm2022/datetimepicker/calendar.mjs +3 -3
  37. package/esm2022/datetimepicker/clock.mjs +2 -2
  38. package/esm2022/datetimepicker/datetimepicker-toggle.mjs +2 -2
  39. package/esm2022/datetimepicker/datetimepicker.mjs +3 -3
  40. package/esm2022/datetimepicker/time.mjs +3 -3
  41. package/esm2022/drawer/drawer-container.mjs +3 -3
  42. package/esm2022/grid/cell.mjs +6 -21
  43. package/esm2022/grid/grid-module.mjs +18 -9
  44. package/esm2022/grid/grid-utils.mjs +4 -2
  45. package/esm2022/grid/grid.mjs +20 -20
  46. package/esm2022/grid/image-preview.mjs +50 -0
  47. package/esm2022/grid/public-api.mjs +2 -1
  48. package/esm2022/loader/loader.mjs +2 -2
  49. package/esm2022/popover/popover.mjs +3 -3
  50. package/esm2022/progress/progress.mjs +4 -4
  51. package/esm2022/select/select.mjs +11 -3
  52. package/esm2022/split/split.mjs +2 -2
  53. package/esm2022/tooltip/tooltip.mjs +2 -2
  54. package/fesm2022/mtxAlert.mjs +3 -3
  55. package/fesm2022/mtxAlert.mjs.map +1 -1
  56. package/fesm2022/mtxColorpicker.mjs +2 -2
  57. package/fesm2022/mtxColorpicker.mjs.map +1 -1
  58. package/fesm2022/mtxDatetimepicker.mjs +12 -12
  59. package/fesm2022/mtxDatetimepicker.mjs.map +1 -1
  60. package/fesm2022/mtxDrawer.mjs +2 -2
  61. package/fesm2022/mtxDrawer.mjs.map +1 -1
  62. package/fesm2022/mtxGrid.mjs +223 -182
  63. package/fesm2022/mtxGrid.mjs.map +1 -1
  64. package/fesm2022/mtxLoader.mjs +2 -2
  65. package/fesm2022/mtxLoader.mjs.map +1 -1
  66. package/fesm2022/mtxPopover.mjs +2 -2
  67. package/fesm2022/mtxPopover.mjs.map +1 -1
  68. package/fesm2022/mtxProgress.mjs +3 -3
  69. package/fesm2022/mtxProgress.mjs.map +1 -1
  70. package/fesm2022/mtxSelect.mjs +10 -2
  71. package/fesm2022/mtxSelect.mjs.map +1 -1
  72. package/fesm2022/mtxSplit.mjs +2 -2
  73. package/fesm2022/mtxSplit.mjs.map +1 -1
  74. package/fesm2022/mtxTooltip.mjs +2 -2
  75. package/fesm2022/mtxTooltip.mjs.map +1 -1
  76. package/grid/_grid-theme.scss +14 -84
  77. package/grid/cell.d.ts +0 -2
  78. package/grid/cell.scss +2 -1
  79. package/grid/grid-module.d.ts +22 -21
  80. package/grid/grid.d.ts +7 -7
  81. package/grid/grid.scss +104 -16
  82. package/grid/image-preview.d.ts +13 -0
  83. package/grid/public-api.d.ts +1 -0
  84. package/loader/_loader-theme.scss +6 -6
  85. package/loader/loader.scss +7 -0
  86. package/package.json +14 -20
  87. package/popover/_popover-theme.scss +6 -40
  88. package/popover/popover.scss +32 -2
  89. package/prebuilt-themes/deeppurple-amber.css +1 -1
  90. package/prebuilt-themes/indigo-pink.css +1 -1
  91. package/prebuilt-themes/pink-bluegrey.css +1 -1
  92. package/prebuilt-themes/purple-green.css +1 -1
  93. package/progress/_progress-theme.scss +6 -25
  94. package/progress/progress.scss +42 -0
  95. package/select/_select-theme.scss +19 -133
  96. package/select/select.d.ts +1 -0
  97. package/select/select.scss +147 -36
  98. package/split/_split-theme.scss +21 -18
  99. package/split/split.scss +13 -0
  100. package/tooltip/_tooltip-theme.scss +19 -24
  101. package/tooltip/tooltip.scss +18 -17
  102. package/esm2022/slider/mtxSlider.mjs +0 -5
  103. package/esm2022/slider/public-api.mjs +0 -3
  104. package/esm2022/slider/slider-module.mjs +0 -19
  105. package/esm2022/slider/slider.mjs +0 -1115
  106. package/fesm2022/mtxSlider.mjs +0 -1137
  107. package/fesm2022/mtxSlider.mjs.map +0 -1
  108. package/slider/_slider-theme.import.scss +0 -2
  109. package/slider/_slider-theme.scss +0 -232
  110. package/slider/index.d.ts +0 -5
  111. package/slider/public-api.d.ts +0 -2
  112. package/slider/slider-module.d.ts +0 -9
  113. package/slider/slider.d.ts +0 -277
  114. package/slider/slider.scss +0 -514
@@ -1,277 +0,0 @@
1
- import { FocusMonitor } from '@angular/cdk/a11y';
2
- import { Directionality } from '@angular/cdk/bidi';
3
- import { BooleanInput, NumberInput } from '@angular/cdk/coercion';
4
- import { ChangeDetectorRef, ElementRef, EventEmitter, NgZone, OnDestroy, OnInit } from '@angular/core';
5
- import { ControlValueAccessor } from '@angular/forms';
6
- import { CanColor, CanDisable, HasTabIndex } from '@angular/material/core';
7
- import * as i0 from "@angular/core";
8
- /**
9
- * Provider Expression that allows mtx-slider to register as a ControlValueAccessor.
10
- * This allows it to support [(ngModel)] and [formControl].
11
- */
12
- export declare const MTX_SLIDER_VALUE_ACCESSOR: any;
13
- /** A simple change event emitted by the MtxSlider component. */
14
- export declare class MtxSliderChange {
15
- /** The MtxSlider that changed. */
16
- source: MtxSlider;
17
- /** The new value of the source slider. */
18
- value: number | number[] | null;
19
- }
20
- /** @docs-private */
21
- declare const _MtxSliderBase: import("@angular/material/core")._Constructor<HasTabIndex> & import("@angular/material/core")._AbstractConstructor<HasTabIndex> & import("@angular/material/core")._Constructor<CanColor> & import("@angular/material/core")._AbstractConstructor<CanColor> & import("@angular/material/core")._Constructor<CanDisable> & import("@angular/material/core")._AbstractConstructor<CanDisable> & {
22
- new (_elementRef: ElementRef): {
23
- _elementRef: ElementRef;
24
- };
25
- };
26
- /**
27
- * Allows users to select from a range of values by moving the slider thumb. It is similar in
28
- * behavior to the native `<input type="range">` element.
29
- */
30
- export declare class MtxSlider extends _MtxSliderBase implements ControlValueAccessor, OnDestroy, CanDisable, CanColor, OnInit, HasTabIndex {
31
- private _focusMonitor;
32
- private _changeDetectorRef;
33
- private _dir;
34
- _animationMode?: string | undefined;
35
- private _ngZone?;
36
- /** Whether the slider is inverted. */
37
- get invert(): boolean;
38
- set invert(value: boolean);
39
- private _invert;
40
- /** The maximum value that the slider can have. */
41
- get max(): number;
42
- set max(v: number);
43
- private _max;
44
- /** The minimum value that the slider can have. */
45
- get min(): number;
46
- set min(v: number);
47
- private _min;
48
- /** The values at which the thumb will snap. */
49
- get step(): number;
50
- set step(v: number);
51
- private _step;
52
- /** Whether or not to show the thumb label. */
53
- get thumbLabel(): boolean;
54
- set thumbLabel(value: boolean);
55
- private _thumbLabel;
56
- /**
57
- * How often to show ticks. Relative to the step so that a tick always appears on a step.
58
- * Ex: Tick interval of 4 with a step of 3 will draw a tick every 4 steps (every 12 values).
59
- */
60
- get tickInterval(): 'auto' | number;
61
- set tickInterval(value: 'auto' | number);
62
- private _tickInterval;
63
- /** Value of the slider. */
64
- get value(): number | number[] | null;
65
- set value(v: number | number[] | null);
66
- private _value;
67
- /**
68
- * Function that will be used to format the value before it is displayed
69
- * in the thumb label. Can be used to format very large number in order
70
- * for them to fit into the slider thumb.
71
- */
72
- displayWith: (value: number | null) => string | number;
73
- /** Text corresponding to the slider's value. Used primarily for improved accessibility. */
74
- valueText: string;
75
- /** Whether the slider is vertical. */
76
- get vertical(): boolean;
77
- set vertical(value: boolean);
78
- private _vertical;
79
- /** Event emitted when the slider value has changed. */
80
- readonly change: EventEmitter<MtxSliderChange>;
81
- /** Event emitted when the slider thumb moves. */
82
- readonly input: EventEmitter<MtxSliderChange>;
83
- /**
84
- * Emits when the raw value of the slider changes. This is here primarily
85
- * to facilitate the two-way binding for the `value` input.
86
- * @docs-private
87
- */
88
- readonly valueChange: EventEmitter<number | number[] | null>;
89
- /** The value to be used for display purposes. */
90
- get displayValue(): string | number;
91
- /** The value to be used for display purposes. */
92
- get displayValueRight(): string | number;
93
- /** set focus to the host element */
94
- focus(): void;
95
- /** blur the host element */
96
- blur(): void;
97
- /** onTouch function registered via registerOnTouch (ControlValueAccessor). */
98
- onTouched: () => any;
99
- /** The percentage of the slider that coincides with the value. */
100
- get percent(): number | number[];
101
- private _percent;
102
- /**
103
- * Whether or not the thumb is sliding.
104
- * Used to determine if there should be a transition for the thumb and fill track.
105
- */
106
- _isSliding: boolean;
107
- /**
108
- * Whether or not the slider is active (clicked or sliding).
109
- * Used to shrink and grow the thumb as according to the Material Design spec.
110
- */
111
- _isActive: boolean;
112
- /**
113
- * Whether the axis of the slider is inverted.
114
- * (i.e. whether moving the thumb in the positive x or y direction decreases the slider's
115
- * value).
116
- */
117
- get _invertAxis(): boolean;
118
- /** Whether the slider is at its minimum value. */
119
- get _isMinValue(): boolean;
120
- /**
121
- * The amount of space to leave between the slider thumb and the track fill & track background
122
- * elements.
123
- */
124
- get _thumbGap(): 0 | 7 | 10;
125
- /** CSS styles for the track background element. */
126
- get _trackBackgroundStylesLeft(): {
127
- [key: string]: string;
128
- };
129
- get _trackBackgroundStylesRight(): {
130
- [key: string]: string;
131
- };
132
- /** CSS styles for the track fill element. */
133
- get _trackFillStyles(): {
134
- [key: string]: string;
135
- };
136
- /** CSS styles for the ticks container element. */
137
- get _ticksContainerStyles(): {
138
- [key: string]: string;
139
- };
140
- /** CSS styles for the ticks element. */
141
- get _ticksStyles(): {
142
- [key: string]: string;
143
- };
144
- get _thumbContainerStylesLeft(): {
145
- [key: string]: string;
146
- };
147
- get _thumbContainerStylesRight(): {
148
- [key: string]: string;
149
- };
150
- /** The size of a tick interval as a percentage of the size of the track. */
151
- private _tickIntervalPercent;
152
- /** The dimensions of the slider. */
153
- private _sliderDimensions;
154
- private _controlValueAccessorChangeFn;
155
- /** Decimal places to round to, based on the step amount. */
156
- private _roundToDecimal;
157
- /** Subscription to the Directionality change EventEmitter. */
158
- private _dirChangeSubscription;
159
- /** The value of the slider when the slide start event fires. */
160
- private _valueOnSlideStart;
161
- /** Position of the pointer when the dragging started. */
162
- private _pointerPositionOnStart;
163
- /** Reference to the inner slider wrapper element. */
164
- private _sliderWrapper;
165
- /** The slider thumb which is currently used (left or right) */
166
- private _currentSliderDir;
167
- /**
168
- * Whether mouse events should be converted to a slider position by calculating their distance
169
- * from the right or bottom edge of the slider as opposed to the top or left.
170
- */
171
- private _shouldInvertMouseCoords;
172
- /** The language direction for this slider element. */
173
- private _getDirection;
174
- constructor(elementRef: ElementRef, _focusMonitor: FocusMonitor, _changeDetectorRef: ChangeDetectorRef, _dir: Directionality, tabIndex: string, _animationMode?: string | undefined, _ngZone?: NgZone | undefined);
175
- ngOnInit(): void;
176
- ngOnDestroy(): void;
177
- _onMouseenter(): void;
178
- _onClick(event: MouseEvent): void;
179
- _onFocus(): void;
180
- _onBlur(): void;
181
- _onKeydown(event: KeyboardEvent): void;
182
- _onKeyup(): void;
183
- /** Called when the user has put their pointer down on the slider. */
184
- private _pointerDown;
185
- /**
186
- * Called when the user has moved their pointer after
187
- * starting to drag. Bound on the document level.
188
- */
189
- private _pointerMove;
190
- /** Called when the user has lifted their pointer. Bound on the document level. */
191
- private _pointerUp;
192
- /**
193
- * Binds our global move and end events. They're bound at the document level and only while
194
- * dragging so that the user doesn't have to keep their pointer exactly over the slider
195
- * as they're swiping across the screen.
196
- */
197
- private _bindGlobalEvents;
198
- /** Removes any global event listeners that we may have added. */
199
- private _removeGlobalEvents;
200
- /** Increments the slider by the given number of steps (negative number decrements). */
201
- private _increment;
202
- /** Calculate the new value from the new physical location. The value will always be snapped. */
203
- private _updateValueFromPosition;
204
- /** Calculate the new value from the new physical location. The value will always be snapped. */
205
- private _updateValueFromPositionLeft;
206
- /** Calculate the new value from the new physical location. The value will always be snapped. */
207
- private _updateValueFromPositionRight;
208
- /** Emits a change event if the current value is different from the last emitted value. */
209
- private _emitChangeEvent;
210
- /** Emits an input event when the current value is different from the last emitted value. */
211
- private _emitInputEvent;
212
- /** Updates the amount of space between ticks as a percentage of the width of the slider. */
213
- private _updateTickIntervalPercent;
214
- /** Creates a slider change object from the specified value. */
215
- private _createChangeEvent;
216
- /** Calculates the percentage of the slider that a value is. */
217
- private _calculatePercentage;
218
- /** Calculates the value a percentage of the slider corresponds to. */
219
- private _calculateValue;
220
- /** Return a number between two numbers. */
221
- private _clamp;
222
- /**
223
- * Get the bounding client rect of the slider track element.
224
- * The track is used rather than the native element to ignore the extra space that the thumb can
225
- * take up.
226
- */
227
- private _getSliderDimensions;
228
- /**
229
- * Focuses the native element.
230
- * Currently only used to allow a blur event to fire but will be used with keyboard input later.
231
- */
232
- private _focusHostElement;
233
- /** Blurs the native element. */
234
- private _blurHostElement;
235
- /** Runs a callback outside of the NgZone, if possible. */
236
- private _runOutsizeZone;
237
- /** Runs a callback inside of the NgZone, if possible. */
238
- private _runInsideZone;
239
- /**
240
- * Sets the model value. Implemented as part of ControlValueAccessor.
241
- * @param value
242
- */
243
- writeValue(value: any): void;
244
- /**
245
- * Registers a callback to be triggered when the value has changed.
246
- * Implemented as part of ControlValueAccessor.
247
- * @param fn Callback to be registered.
248
- */
249
- registerOnChange(fn: (value: any) => void): void;
250
- /**
251
- * Registers a callback to be triggered when the component is touched.
252
- * Implemented as part of ControlValueAccessor.
253
- * @param fn Callback to be registered.
254
- */
255
- registerOnTouched(fn: any): void;
256
- /**
257
- * Sets whether the component should be disabled.
258
- * Implemented as part of ControlValueAccessor.
259
- * @param isDisabled
260
- */
261
- setDisabledState(isDisabled: boolean): void;
262
- isRangeSlider(): boolean;
263
- private calculateInitialSlideDirection;
264
- static ngAcceptInputType_invert: BooleanInput;
265
- static ngAcceptInputType_max: NumberInput;
266
- static ngAcceptInputType_min: NumberInput;
267
- static ngAcceptInputType_step: NumberInput;
268
- static ngAcceptInputType_thumbLabel: BooleanInput;
269
- static ngAcceptInputType_tickInterval: NumberInput;
270
- static ngAcceptInputType_value: NumberInput | NumberInput[];
271
- static ngAcceptInputType_vertical: BooleanInput;
272
- static ngAcceptInputType_disabled: BooleanInput;
273
- static ngAcceptInputType_tabIndex: NumberInput;
274
- static ɵfac: i0.ɵɵFactoryDeclaration<MtxSlider, [null, null, null, { optional: true; }, { attribute: "tabindex"; }, { optional: true; }, null]>;
275
- static ɵcmp: i0.ɵɵComponentDeclaration<MtxSlider, "mtx-slider", ["mtxSlider"], { "disabled": { "alias": "disabled"; "required": false; }; "color": { "alias": "color"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "invert": { "alias": "invert"; "required": false; }; "max": { "alias": "max"; "required": false; }; "min": { "alias": "min"; "required": false; }; "step": { "alias": "step"; "required": false; }; "thumbLabel": { "alias": "thumbLabel"; "required": false; }; "tickInterval": { "alias": "tickInterval"; "required": false; }; "value": { "alias": "value"; "required": false; }; "displayWith": { "alias": "displayWith"; "required": false; }; "valueText": { "alias": "valueText"; "required": false; }; "vertical": { "alias": "vertical"; "required": false; }; }, { "change": "change"; "input": "input"; "valueChange": "valueChange"; }, never, never, false, never>;
276
- }
277
- export {};