igniteui-angular 22.1.0-beta.6 → 22.1.0-beta.7

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 (107) hide show
  1. package/fesm2022/igniteui-angular-accordion.mjs +4 -4
  2. package/fesm2022/igniteui-angular-accordion.mjs.map +1 -1
  3. package/fesm2022/igniteui-angular-action-strip.mjs +0 -1
  4. package/fesm2022/igniteui-angular-action-strip.mjs.map +1 -1
  5. package/fesm2022/igniteui-angular-avatar.mjs.map +1 -1
  6. package/fesm2022/igniteui-angular-badge.mjs +0 -1
  7. package/fesm2022/igniteui-angular-badge.mjs.map +1 -1
  8. package/fesm2022/igniteui-angular-banner.mjs +2 -2
  9. package/fesm2022/igniteui-angular-banner.mjs.map +1 -1
  10. package/fesm2022/igniteui-angular-button-group.mjs.map +1 -1
  11. package/fesm2022/igniteui-angular-calendar.mjs +4 -5
  12. package/fesm2022/igniteui-angular-calendar.mjs.map +1 -1
  13. package/fesm2022/igniteui-angular-card.mjs.map +1 -1
  14. package/fesm2022/igniteui-angular-carousel.mjs.map +1 -1
  15. package/fesm2022/igniteui-angular-chips.mjs.map +1 -1
  16. package/fesm2022/igniteui-angular-combo.mjs +17 -6
  17. package/fesm2022/igniteui-angular-combo.mjs.map +1 -1
  18. package/fesm2022/igniteui-angular-core.mjs +16 -337
  19. package/fesm2022/igniteui-angular-core.mjs.map +1 -1
  20. package/fesm2022/igniteui-angular-date-picker.mjs +12 -14
  21. package/fesm2022/igniteui-angular-date-picker.mjs.map +1 -1
  22. package/fesm2022/igniteui-angular-dialog.mjs +1 -1
  23. package/fesm2022/igniteui-angular-dialog.mjs.map +1 -1
  24. package/fesm2022/igniteui-angular-directives.mjs +45 -47
  25. package/fesm2022/igniteui-angular-directives.mjs.map +1 -1
  26. package/fesm2022/igniteui-angular-drop-down.mjs +3 -2
  27. package/fesm2022/igniteui-angular-drop-down.mjs.map +1 -1
  28. package/fesm2022/igniteui-angular-expansion-panel.mjs +23 -12
  29. package/fesm2022/igniteui-angular-expansion-panel.mjs.map +1 -1
  30. package/fesm2022/igniteui-angular-grids-core.mjs +484 -202
  31. package/fesm2022/igniteui-angular-grids-core.mjs.map +1 -1
  32. package/fesm2022/igniteui-angular-grids-grid.mjs +115 -94
  33. package/fesm2022/igniteui-angular-grids-grid.mjs.map +1 -1
  34. package/fesm2022/igniteui-angular-grids-hierarchical-grid.mjs +15 -19
  35. package/fesm2022/igniteui-angular-grids-hierarchical-grid.mjs.map +1 -1
  36. package/fesm2022/igniteui-angular-grids-lite.mjs.map +1 -1
  37. package/fesm2022/igniteui-angular-grids-pivot-grid.mjs +75 -153
  38. package/fesm2022/igniteui-angular-grids-pivot-grid.mjs.map +1 -1
  39. package/fesm2022/igniteui-angular-grids-tree-grid.mjs +28 -35
  40. package/fesm2022/igniteui-angular-grids-tree-grid.mjs.map +1 -1
  41. package/fesm2022/igniteui-angular-icon.mjs.map +1 -1
  42. package/fesm2022/igniteui-angular-input-group.mjs +1 -1
  43. package/fesm2022/igniteui-angular-input-group.mjs.map +1 -1
  44. package/fesm2022/igniteui-angular-list.mjs.map +1 -1
  45. package/fesm2022/igniteui-angular-navbar.mjs.map +1 -1
  46. package/fesm2022/igniteui-angular-navigation-drawer.mjs +2 -3
  47. package/fesm2022/igniteui-angular-navigation-drawer.mjs.map +1 -1
  48. package/fesm2022/igniteui-angular-paginator.mjs.map +1 -1
  49. package/fesm2022/igniteui-angular-progressbar.mjs +5 -2
  50. package/fesm2022/igniteui-angular-progressbar.mjs.map +1 -1
  51. package/fesm2022/igniteui-angular-query-builder.mjs +18 -19
  52. package/fesm2022/igniteui-angular-query-builder.mjs.map +1 -1
  53. package/fesm2022/igniteui-angular-radio.mjs +1 -1
  54. package/fesm2022/igniteui-angular-radio.mjs.map +1 -1
  55. package/fesm2022/igniteui-angular-select.mjs.map +1 -1
  56. package/fesm2022/igniteui-angular-simple-combo.mjs +10 -7
  57. package/fesm2022/igniteui-angular-simple-combo.mjs.map +1 -1
  58. package/fesm2022/igniteui-angular-slider.mjs +3 -3
  59. package/fesm2022/igniteui-angular-slider.mjs.map +1 -1
  60. package/fesm2022/igniteui-angular-splitter.mjs +1 -1
  61. package/fesm2022/igniteui-angular-splitter.mjs.map +1 -1
  62. package/fesm2022/igniteui-angular-stepper.mjs +1 -1
  63. package/fesm2022/igniteui-angular-stepper.mjs.map +1 -1
  64. package/fesm2022/igniteui-angular-tabs.mjs.map +1 -1
  65. package/fesm2022/igniteui-angular-time-picker.mjs +3 -6
  66. package/fesm2022/igniteui-angular-time-picker.mjs.map +1 -1
  67. package/fesm2022/igniteui-angular-tree.mjs +8 -10
  68. package/fesm2022/igniteui-angular-tree.mjs.map +1 -1
  69. package/migrations/migration-collection.json +0 -7
  70. package/package.json +1 -1
  71. package/types/igniteui-angular-avatar.d.ts +1 -1
  72. package/types/igniteui-angular-banner.d.ts +3 -3
  73. package/types/igniteui-angular-calendar.d.ts +9 -9
  74. package/types/igniteui-angular-card.d.ts +1 -1
  75. package/types/igniteui-angular-carousel.d.ts +9 -9
  76. package/types/igniteui-angular-chat.d.ts +1 -1
  77. package/types/igniteui-angular-chips.d.ts +5 -5
  78. package/types/igniteui-angular-combo.d.ts +17 -13
  79. package/types/igniteui-angular-core.d.ts +200 -495
  80. package/types/igniteui-angular-date-picker.d.ts +3 -3
  81. package/types/igniteui-angular-dialog.d.ts +4 -4
  82. package/types/igniteui-angular-directives.d.ts +60 -59
  83. package/types/igniteui-angular-drop-down.d.ts +16 -16
  84. package/types/igniteui-angular-expansion-panel.d.ts +6 -6
  85. package/types/igniteui-angular-grids-core.d.ts +1053 -791
  86. package/types/igniteui-angular-grids-grid.d.ts +104 -267
  87. package/types/igniteui-angular-grids-hierarchical-grid.d.ts +68 -547
  88. package/types/igniteui-angular-grids-lite.d.ts +7 -7
  89. package/types/igniteui-angular-grids-pivot-grid.d.ts +94 -129
  90. package/types/igniteui-angular-grids-tree-grid.d.ts +5 -51
  91. package/types/igniteui-angular-icon.d.ts +2 -2
  92. package/types/igniteui-angular-input-group.d.ts +4 -4
  93. package/types/igniteui-angular-list.d.ts +4 -4
  94. package/types/igniteui-angular-navigation-drawer.d.ts +3 -3
  95. package/types/igniteui-angular-progressbar.d.ts +1 -0
  96. package/types/igniteui-angular-query-builder.d.ts +9 -9
  97. package/types/igniteui-angular-radio.d.ts +1 -1
  98. package/types/igniteui-angular-select.d.ts +5 -5
  99. package/types/igniteui-angular-simple-combo.d.ts +2 -2
  100. package/types/igniteui-angular-slider.d.ts +4 -4
  101. package/types/igniteui-angular-splitter.d.ts +3 -3
  102. package/types/igniteui-angular-time-picker.d.ts +8 -8
  103. package/types/igniteui-angular-tree.d.ts +8 -8
  104. package/migrations/update-22_1_0_import-migration/index.d.ts +0 -2
  105. package/migrations/update-22_1_0_import-migration/index.js +0 -228
  106. package/migrations/update-22_1_0_import-migration/index.spec.d.ts +0 -1
  107. package/migrations/update-22_1_0_import-migration/index.spec.js +0 -188
package/fesm2022/igniteui-angular-slider.mjs CHANGED
@@ -492,7 +492,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImpor
492
492
  class IgxTickLabelsPipe {
493
493
  transform(labels, secondaryTicks) {
494
494
  if (!labels) {
495
- return undefined;
495
+ return;
496
496
  }
497
497
  const result = [];
498
498
  labels.forEach(item => {
@@ -1801,11 +1801,11 @@ class IgxSliderComponent {
1801
1801
  this.valueChange.emit({ oldValue, value: this.value });
1802
1802
  }
1803
1803
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1804
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: IgxSliderComponent, isStandalone: true, selector: "igx-slider", inputs: { id: "id", thumbLabelVisibilityDuration: "thumbLabelVisibilityDuration", type: "type", labels: "labels", step: "step", disabled: ["disabled", "disabled", booleanAttribute], continuous: ["continuous", "continuous", booleanAttribute], minValue: "minValue", maxValue: "maxValue", lowerBound: "lowerBound", upperBound: "upperBound", value: "value", primaryTicks: "primaryTicks", secondaryTicks: "secondaryTicks", showTicks: ["showTicks", "showTicks", booleanAttribute], primaryTickLabels: ["primaryTickLabels", "primaryTickLabels", booleanAttribute], secondaryTickLabels: ["secondaryTickLabels", "secondaryTickLabels", booleanAttribute], ticksOrientation: "ticksOrientation", tickLabelsOrientation: "tickLabelsOrientation", lowerValue: "lowerValue", upperValue: "upperValue" }, outputs: { valueChange: "valueChange", lowerValueChange: "lowerValueChange", upperValueChange: "upperValueChange", dragFinished: "dragFinished" }, host: { listeners: { "focus": "onFocus()", "pointerdown": "onPointerDown($event)", "pointerup": "onPointerUp($event)" }, properties: { "class.igx-slider": "this.slierClass", "attr.id": "this.id", "class.igx-slider--disabled": "this.disabledClass" } }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: IgxSliderComponent, multi: true }], queries: [{ propertyName: "thumbFromTemplateRef", first: true, predicate: IgxThumbFromTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "thumbToTemplateRef", first: true, predicate: IgxThumbToTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "tickLabelTemplateRef", first: true, predicate: IgxTickLabelTemplateDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "trackRef", first: true, predicate: ["track"], descendants: true, static: true }, { propertyName: "ticks", first: true, predicate: ["ticks"], descendants: true, static: true }, { propertyName: "thumbs", predicate: IgxSliderThumbComponent, descendants: true }, { propertyName: "labelRefs", predicate: IgxThumbLabelComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (showTicks && showTopTicks) {\n <igx-ticks\n ticksOrientation=\"top\"\n [primaryTicks]=\"primaryTicks\"\n [secondaryTicks]=\"secondaryTicks\"\n [primaryTickLabels]=\"primaryTickLabels\"\n [secondaryTickLabels]=\"secondaryTickLabels\"\n [tickLabelsOrientation]=\"tickLabelsOrientation\"\n [labelsViewEnabled]=\"labelsViewEnabled\"\n [labels]=\"labels! | spreadTickLabels:secondaryTicks\"\n [tickLabelTemplateRef]=\"tickLabelTemplateRef\"\n [minValue]=\"minValue\"\n [maxValue]=\"maxValue\">\n </igx-ticks>\n}\n<div class=\"igx-slider__track\">\n <div class=\"igx-slider__track-inactive\"></div>\n <div #track class=\"igx-slider__track-fill\"></div>\n <div class=\"igx-slider__track-steps\">\n <svg width=\"100%\" height=\"100%\">\n <line #ticks x1=\"0\" y1=\"2\" x2=\"100%\" y2=\"2\"></line>\n </svg>\n </div>\n</div>\n<div class=\"igx-slider__thumbs\">\n @if (isRange) {\n <igx-thumb-label\n type=\"from\"\n [value]=\"lowerLabel\"\n [templateRef]=\"thumbFromTemplateRef\"\n [continuous]=\"continuous\"\n [context]=\"context\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumb]=\"thumbFrom\"></igx-thumb-label>\n }\n\n @if (isRange) {\n <igx-thumb\n #thumbFrom\n type=\"from\"\n [value]=\"lowerLabel\"\n [min]=\"minValue\"\n [max]=\"maxValue\"\n [disabled]=\"disabled\"\n [continuous]=\"continuous\"\n [onPan]=\"onPan\"\n [stepDistance]=\"stepDistance\"\n [step]=\"step\"\n [templateRef]=\"thumbFromTemplateRef\"\n [context]=\"context\"\n [labels]=\"labels\"\n (thumbChange)=\"onThumbChange()\"\n (hoverChange)=\"onHoverChange($event)\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumbLabelVisibilityDuration]=\"thumbLabelVisibilityDuration\"></igx-thumb>\n }\n\n <igx-thumb-label\n [value]=\"upperLabel\"\n type=\"to\"\n [templateRef]=\"thumbToTemplateRef\"\n [continuous]=\"continuous\"\n [context]=\"context\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumb]=\"thumbTo\"></igx-thumb-label>\n\n <igx-thumb\n #thumbTo\n type=\"to\"\n [value]=\"upperLabel\"\n [min]=\"minValue\"\n [max]=\"maxValue\"\n [disabled]=\"disabled\"\n [continuous]=\"continuous\"\n [onPan]=\"onPan\"\n [stepDistance]=\"stepDistance\"\n [step]=\"step\"\n [templateRef]=\"thumbToTemplateRef\"\n [context]=\"context\"\n [labels]=\"labels\"\n (thumbChange)=\"onThumbChange()\"\n (hoverChange)=\"onHoverChange($event)\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumbLabelVisibilityDuration]=\"thumbLabelVisibilityDuration\"></igx-thumb>\n</div>\n@if (showTicks && showBottomTicks) {\n <igx-ticks\n ticksOrientation=\"bottom\"\n [primaryTicks]=\"primaryTicks\"\n [secondaryTicks]=\"secondaryTicks\"\n [primaryTickLabels]=\"primaryTickLabels\"\n [secondaryTickLabels]=\"secondaryTickLabels\"\n [tickLabelsOrientation]=\"tickLabelsOrientation\"\n [labelsViewEnabled]=\"labelsViewEnabled\"\n [labels]=\"labels! | spreadTickLabels:secondaryTicks\"\n [tickLabelTemplateRef]=\"tickLabelTemplateRef\"\n [minValue]=\"minValue\"\n [maxValue]=\"maxValue\">\n </igx-ticks>\n}\n", styles: ["@layer ig.base{.igx-slider{--thumb-radius: calc(var(--thumb-size) / 2);--tick-height: .5rem;--tick-height--tall: calc(var(--tick-height) * 2);display:flex;position:relative;z-index:0;height:3rem;align-items:center;transition:all .2s cubic-bezier(.25,.46,.45,.94);touch-action:pan-y pinch-zoom}.igx-slider:hover .igx-slider__track-inactive{background:var(--base-track-hover-color)}.igx-slider:hover .igx-slider__track-fill{background:var(--track-hover-color)}.igx-slider__track{position:relative;width:100%;height:var(--track-height);overflow:hidden;border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 2rem),2rem)}.igx-slider__track-inactive{position:absolute;width:100%;height:inherit;background:var(--base-track-color);transition:background .2s cubic-bezier(.25,.46,.45,.94);border-radius:inherit}.igx-slider__track-fill{position:absolute;width:100%;background:var(--track-color);transform-origin:left center;transform:scaleX(0);border-radius:inherit;height:inherit}[dir=rtl] .igx-slider__track-fill{transform-origin:right center}.igx-slider__thumbs{position:absolute;width:100%;height:0;cursor:default;z-index:1;inset-inline-start:0}.igx-slider__track-steps{position:absolute;display:flex;width:100%;height:.25rem;opacity:.85;transition:opacity .2s ease-out;top:50%;transform:translateY(-50%);color:var(--track-step-color)}.igx-slider__track-steps svg{clip-path:inset(0 .1875rem 0 .1875rem)}.igx-slider__track-steps line{stroke:currentColor;stroke-width:var(--track-step-size);stroke-linecap:round}.igx-slider--disabled{pointer-events:none}.igx-slider--disabled .igx-slider__track-inactive{background:var(--disabled-base-track-color)}.igx-slider--disabled .igx-slider__track-fill{background:var(--disabled-fill-track-color)}.igx-slider--disabled .igx-slider__ticks-tick{background:var(--disabled-base-track-color)}.igx-slider--disabled .igx-slider__ticks-label{color:var(--disabled-base-track-color)}.igx-ticks{width:100%;display:flex;position:absolute;bottom:0;justify-content:space-between}.igx-ticks__group{display:flex;flex-direction:column;align-items:center;position:relative}.igx-ticks__group:first-of-type{margin-inline-start:-.0625rem}.igx-ticks__group:last-of-type{margin-inline-end:-.0625rem}.igx-ticks__label{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);color:var(--tick-label-color);position:absolute;top:var(--tick-height--tall);transform:translate(-50%);opacity:1;transition:opacity .2s cubic-bezier(.455,.03,.515,.955)}[dir=rtl] .igx-ticks__label{left:100%}.igx-ticks__label--tall{top:calc(var(--tick-height--tall) + var(--tick-height))}.igx-ticks__label--hidden{opacity:0}.igx-ticks__tick{background:var(--tick-color);height:var(--tick-height);width:.125rem}.igx-ticks__tick--tall{height:var(--tick-height--tall)}.igx-ticks--tall .igx-ticks__label{top:calc(var(--tick-height--tall) + var(--tick-height))}.igx-ticks--top{bottom:auto;top:0;align-items:flex-end}.igx-ticks--top .igx-ticks__label{bottom:calc(var(--tick-height)*2);top:auto}.igx-ticks--top .igx-ticks__label--tall,.igx-ticks--top.igx-ticks--tall .igx-ticks__label{bottom:calc(var(--tick-height--tall) + var(--tick-height));top:auto}.igx-ticks--top-bottom .igx-ticks__group{display:block}.igx-ticks--top-bottom .igx-ticks__label{writing-mode:vertical-rl;transform:translate(-50%) rotate(0)}.igx-ticks--bottom-top .igx-ticks__group{display:block}.igx-ticks--bottom-top .igx-ticks__label{writing-mode:vertical-rl;transform:translate(-50%) rotate(180deg)}.igx-slider-thumb-from{position:absolute;display:flex;justify-content:center;align-items:center;flex-direction:column;width:var(--thumb-size);height:var(--thumb-size);outline-style:none;top:calc(var(--thumb-radius)*-1);margin-inline-start:calc(var(--thumb-radius)*-1)}.igx-slider-thumb-from:focus div:before{box-shadow:0 0 0 var(--outline-width) var(--thumb-focus-color)}.igx-slider-thumb-from__dot{position:relative;inset-inline-start:0;pointer-events:none}.igx-slider-thumb-from__dot:before{position:absolute;content:\"\";width:var(--thumb-size);height:var(--thumb-size);inset-inline-start:0;top:calc((var(--thumb-size) - var(--thumb-radius))*-1);margin-inline-start:calc((var(--thumb-size) - var(--thumb-radius))*-1);background:var(--thumb-color);border:var(--thumb-border-width) solid var(--thumb-border-color);transition:transform .1s cubic-bezier(.25,.46,.45,.94),border-radius .1s cubic-bezier(.25,.46,.45,.94);border-radius:var(--thumb-radius)}.igx-slider-thumb-from--disabled:focus div:before{box-shadow:none}.igx-slider-thumb-from--disabled:focus div:after{transform:scale(0)}.igx-slider-thumb-from--disabled .igx-slider-thumb-from__dot{pointer-events:none}.igx-slider-thumb-from--disabled .igx-slider-thumb-from__dot:before{background:var(--disabled-thumb-color);border-color:var(--thumb-disabled-border-color);border-radius:var(--thumb-radius)}.igx-slider-thumb-label-from{position:absolute;pointer-events:none;display:flex;top:calc((var(--thumb-label-height) + 1.25rem)*-1);height:var(--thumb-label-height)}.igx-slider-thumb-label-from__container{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);border-radius:.125rem;display:flex;align-items:center;justify-content:center;white-space:nowrap;margin-inline-start:-50%;padding:0 .5rem;background:var(--label-background-color);color:var(--label-text-color);min-width:var(--thumb-label-width);opacity:0}.igx-slider-thumb-label-from__container:after{content:\"\";position:absolute;top:85%;border-inline-start:.625rem solid rgba(0,0,0,0);border-inline-end:.625rem solid rgba(0,0,0,0);border-top:.625rem solid var(--label-background-color)}.igx-slider-thumb-label-from--pressed .igx-slider-thumb-label-from__container{z-index:1}.igx-slider-thumb-label-from--active .igx-slider-thumb-label-from__container{opacity:1}.igx-slider-thumb-to{position:absolute;display:flex;justify-content:center;align-items:center;flex-direction:column;width:var(--thumb-size);height:var(--thumb-size);outline-style:none;top:calc(var(--thumb-radius)*-1);margin-inline-start:calc(var(--thumb-radius)*-1)}.igx-slider-thumb-to:focus div:before{box-shadow:0 0 0 var(--outline-width) var(--thumb-focus-color)}.igx-slider-thumb-to__dot{position:relative;inset-inline-start:0;pointer-events:none}.igx-slider-thumb-to__dot:before{position:absolute;content:\"\";width:var(--thumb-size);height:var(--thumb-size);inset-inline-start:0;top:calc((var(--thumb-size) - var(--thumb-radius))*-1);margin-inline-start:calc((var(--thumb-size) - var(--thumb-radius))*-1);background:var(--thumb-color);border:var(--thumb-border-width) solid var(--thumb-border-color);transition:transform .1s cubic-bezier(.25,.46,.45,.94),border-radius .1s cubic-bezier(.25,.46,.45,.94);border-radius:var(--thumb-radius)}.igx-slider-thumb-to--disabled:focus div:before{box-shadow:none}.igx-slider-thumb-to--disabled:focus div:after{transform:scale(0)}.igx-slider-thumb-to--disabled .igx-slider-thumb-to__dot{pointer-events:none}.igx-slider-thumb-to--disabled .igx-slider-thumb-to__dot:before{background:var(--disabled-thumb-color);border-color:var(--thumb-disabled-border-color);border-radius:var(--thumb-radius)}.igx-slider-thumb-label-to{position:absolute;pointer-events:none;display:flex;top:calc((var(--thumb-label-height) + 1.25rem)*-1);height:var(--thumb-label-height)}.igx-slider-thumb-label-to__container{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);border-radius:.125rem;display:flex;align-items:center;justify-content:center;white-space:nowrap;margin-inline-start:-50%;padding:0 .5rem;background:var(--label-background-color);color:var(--label-text-color);min-width:var(--thumb-label-width);opacity:0}.igx-slider-thumb-label-to__container:after{content:\"\";position:absolute;top:85%;border-inline-start:.625rem solid rgba(0,0,0,0);border-inline-end:.625rem solid rgba(0,0,0,0);border-top:.625rem solid var(--label-background-color)}.igx-slider-thumb-label-to--pressed .igx-slider-thumb-label-to__container{z-index:1}.igx-slider-thumb-label-to--active .igx-slider-thumb-label-to__container{opacity:1}}@layer ig.material{@container style(--ig-theme: material){.igx-slider{--thumb-size: 1.25rem;--thumb-border-width: 0;--thumb-label-width: 2.5rem;--thumb-label-height: 1.875rem;--track-height: .375rem;--outline-width: 0;--steps-top-position: .125rem;--ripple-size: 2.5rem;--ripple-radius: calc(var(--ripple-size) / 2)}.igx-slider__track-inactive{height:.25rem;top:50%;transform:translateY(-50%)}}}@layer ig.material{@container style(--ig-theme: material){.igx-slider-thumb-from:hover div:after{opacity:.12;transform:scale(1)}.igx-slider-thumb-from:focus div:after{opacity:.18;transform:scale(1)}.igx-slider-thumb-from__dot:after{position:absolute;content:\"\";width:var(--ripple-size);height:var(--ripple-size);background:var(--thumb-color);top:calc(50% - var(--ripple-radius));inset-inline-start:calc(50% - var(--ripple-radius));opacity:0;transform:scale(0);transform-origin:center center;transition:transform .1s cubic-bezier(.25,.46,.45,.94),opacity .1s cubic-bezier(.25,.46,.45,.94);border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%);overflow:hidden}.igx-slider-thumb-from--pressed .igx-slider-thumb-from__dot:after{opacity:.24!important;transform:scale(1)}}}@layer ig.material{@container style(--ig-theme: material){.igx-slider-thumb-to:hover div:after{opacity:.12;transform:scale(1)}.igx-slider-thumb-to:focus div:after{opacity:.18;transform:scale(1)}.igx-slider-thumb-to__dot:after{position:absolute;content:\"\";width:var(--ripple-size);height:var(--ripple-size);background:var(--thumb-color);top:calc(50% - var(--ripple-radius));inset-inline-start:calc(50% - var(--ripple-radius));opacity:0;transform:scale(0);transform-origin:center center;transition:transform .1s cubic-bezier(.25,.46,.45,.94),opacity .1s cubic-bezier(.25,.46,.45,.94);border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%);overflow:hidden}.igx-slider-thumb-to--pressed .igx-slider-thumb-to__dot:after{opacity:.24!important;transform:scale(1)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-slider{--thumb-size: 1rem;--thumb-border-width: .0625rem;--thumb-label-width: 2.5rem;--thumb-label-height: 1.875rem;--track-height: .5rem;--outline-width: .1875rem;--steps-top-position: .1875rem}.igx-slider__track-fill{display:none}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-slider-thumb-from:focus div:before{border-color:var(--thumb-border-focus-color)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-slider-thumb-to:focus div:before{border-color:var(--thumb-border-focus-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-slider{--thumb-size: 1rem;--thumb-border-width: .125rem;--thumb-label-width: 2.5rem;--thumb-label-height: 2.0625rem;--track-height: .25rem;--outline-width: 0;--steps-top-position: .0625rem}.igx-slider:hover .igx-slider-thumb-from__dot:before,.igx-slider:hover .igx-slider-thumb-to__dot:before{border:var(--thumb-border-width) solid var(--thumb-focus-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-slider-thumb-from--focused div:after{position:absolute;content:\"\";pointer-events:none;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 .0625rem var(--thumb-border-focus-color);width:calc(var(--thumb-size) + .125rem*2);height:calc(var(--thumb-size) + .125rem*2)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-slider-thumb-to--focused div:after{position:absolute;content:\"\";pointer-events:none;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 .0625rem var(--thumb-border-focus-color);width:calc(var(--thumb-size) + .125rem*2);height:calc(var(--thumb-size) + .125rem*2)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider{--thumb-size: .75rem;--thumb-border-width: .125rem;--thumb-label-width: 2.25rem;--thumb-label-height: 1.375rem;--track-height: .125rem;--outline-width: .1875rem;--steps-top-position: 0}.igx-slider__track{border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * .25rem),.25rem)}.igx-slider--disabled .igx-slider__track-steps{color:#0000}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-ticks{bottom:.1875rem}.igx-ticks__label{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom)}.igx-ticks--top{top:.1875rem;bottom:auto}.igx-ticks--tall .igx-ticks__label{top:calc(var(--tick-height--tall) + var(--tick-height)/2)}.igx-ticks--top.igx-ticks--tall .igx-ticks__label{bottom:calc(var(--tick-height--tall) + var(--tick-height)/2);top:auto}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-from{transition:transform .2s cubic-bezier(.25,.46,.45,.94)}.igx-slider-thumb-from:hover,.igx-slider-thumb-from:active{transform:scale(1.3333333333)}.igx-slider-thumb-from:hover div:before,.igx-slider-thumb-from:active div:before{border-color:var(--thumb-border-hover-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-label-from{top:calc((var(--thumb-label-height) + 1.125rem)*-1)}.igx-slider-thumb-label-from__container{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);border-radius:.1875rem}.igx-slider-thumb-label-from__container:after{top:1rem;border-top:.75rem solid var(--label-background-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-to{transition:transform .2s cubic-bezier(.25,.46,.45,.94)}.igx-slider-thumb-to:hover,.igx-slider-thumb-to:active{transform:scale(1.3333333333)}.igx-slider-thumb-to:hover div:before,.igx-slider-thumb-to:active div:before{border-color:var(--thumb-border-hover-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-label-to{top:calc((var(--thumb-label-height) + 1.125rem)*-1)}.igx-slider-thumb-label-to__container{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);border-radius:.1875rem}.igx-slider-thumb-label-to__container:after{top:1rem;border-top:.75rem solid var(--label-background-color)}}}\n"], dependencies: [{ kind: "component", type: IgxTicksComponent, selector: "igx-ticks", inputs: ["primaryTicks", "secondaryTicks", "primaryTickLabels", "secondaryTickLabels", "ticksOrientation", "tickLabelsOrientation", "maxValue", "minValue", "labelsViewEnabled", "labels", "tickLabelTemplateRef"] }, { kind: "component", type: IgxThumbLabelComponent, selector: "igx-thumb-label", inputs: ["value", "templateRef", "context", "type", "continuous", "deactiveState", "thumb"] }, { kind: "component", type: IgxSliderThumbComponent, selector: "igx-thumb", inputs: ["value", "continuous", "thumbLabelVisibilityDuration", "disabled", "onPan", "stepDistance", "step", "templateRef", "context", "type", "deactiveState", "min", "max", "labels"], outputs: ["thumbValueChange", "thumbChange", "thumbBlur", "hoverChange"] }, { kind: "pipe", type: IgxTickLabelsPipe, name: "spreadTickLabels" }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
1804
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: IgxSliderComponent, isStandalone: true, selector: "igx-slider", inputs: { id: "id", thumbLabelVisibilityDuration: "thumbLabelVisibilityDuration", type: "type", labels: "labels", step: "step", disabled: ["disabled", "disabled", booleanAttribute], continuous: ["continuous", "continuous", booleanAttribute], minValue: "minValue", maxValue: "maxValue", lowerBound: "lowerBound", upperBound: "upperBound", value: "value", primaryTicks: "primaryTicks", secondaryTicks: "secondaryTicks", showTicks: ["showTicks", "showTicks", booleanAttribute], primaryTickLabels: ["primaryTickLabels", "primaryTickLabels", booleanAttribute], secondaryTickLabels: ["secondaryTickLabels", "secondaryTickLabels", booleanAttribute], ticksOrientation: "ticksOrientation", tickLabelsOrientation: "tickLabelsOrientation", lowerValue: "lowerValue", upperValue: "upperValue" }, outputs: { valueChange: "valueChange", lowerValueChange: "lowerValueChange", upperValueChange: "upperValueChange", dragFinished: "dragFinished" }, host: { listeners: { "focus": "onFocus()", "pointerdown": "onPointerDown($event)", "pointerup": "onPointerUp($event)" }, properties: { "class.igx-slider": "this.slierClass", "attr.id": "this.id", "class.igx-slider--disabled": "this.disabledClass" } }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: IgxSliderComponent, multi: true }], queries: [{ propertyName: "thumbFromTemplateRef", first: true, predicate: IgxThumbFromTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "thumbToTemplateRef", first: true, predicate: IgxThumbToTemplateDirective, descendants: true, read: TemplateRef }, { propertyName: "tickLabelTemplateRef", first: true, predicate: IgxTickLabelTemplateDirective, descendants: true, read: TemplateRef }], viewQueries: [{ propertyName: "trackRef", first: true, predicate: ["track"], descendants: true, static: true }, { propertyName: "ticks", first: true, predicate: ["ticks"], descendants: true, static: true }, { propertyName: "thumbs", predicate: IgxSliderThumbComponent, descendants: true }, { propertyName: "labelRefs", predicate: IgxThumbLabelComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (showTicks && showTopTicks) {\n <igx-ticks\n ticksOrientation=\"top\"\n [primaryTicks]=\"primaryTicks\"\n [secondaryTicks]=\"secondaryTicks\"\n [primaryTickLabels]=\"primaryTickLabels\"\n [secondaryTickLabels]=\"secondaryTickLabels\"\n [tickLabelsOrientation]=\"tickLabelsOrientation\"\n [labelsViewEnabled]=\"labelsViewEnabled\"\n [labels]=\"labels | spreadTickLabels:secondaryTicks\"\n [tickLabelTemplateRef]=\"tickLabelTemplateRef\"\n [minValue]=\"minValue\"\n [maxValue]=\"maxValue\">\n </igx-ticks>\n}\n<div class=\"igx-slider__track\">\n <div class=\"igx-slider__track-inactive\"></div>\n <div #track class=\"igx-slider__track-fill\"></div>\n <div class=\"igx-slider__track-steps\">\n <svg width=\"100%\" height=\"100%\">\n <line #ticks x1=\"0\" y1=\"2\" x2=\"100%\" y2=\"2\"></line>\n </svg>\n </div>\n</div>\n<div class=\"igx-slider__thumbs\">\n @if (isRange) {\n <igx-thumb-label\n type=\"from\"\n [value]=\"lowerLabel\"\n [templateRef]=\"thumbFromTemplateRef\"\n [continuous]=\"continuous\"\n [context]=\"context\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumb]=\"thumbFrom\"></igx-thumb-label>\n }\n\n @if (isRange) {\n <igx-thumb\n #thumbFrom\n type=\"from\"\n [value]=\"lowerLabel\"\n [min]=\"minValue\"\n [max]=\"maxValue\"\n [disabled]=\"disabled\"\n [continuous]=\"continuous\"\n [onPan]=\"onPan\"\n [stepDistance]=\"stepDistance\"\n [step]=\"step\"\n [templateRef]=\"thumbFromTemplateRef\"\n [context]=\"context\"\n [labels]=\"labels\"\n (thumbChange)=\"onThumbChange()\"\n (hoverChange)=\"onHoverChange($event)\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumbLabelVisibilityDuration]=\"thumbLabelVisibilityDuration\"></igx-thumb>\n }\n\n <igx-thumb-label\n [value]=\"upperLabel\"\n type=\"to\"\n [templateRef]=\"thumbToTemplateRef\"\n [continuous]=\"continuous\"\n [context]=\"context\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumb]=\"thumbTo\"></igx-thumb-label>\n\n <igx-thumb\n #thumbTo\n type=\"to\"\n [value]=\"upperLabel\"\n [min]=\"minValue\"\n [max]=\"maxValue\"\n [disabled]=\"disabled\"\n [continuous]=\"continuous\"\n [onPan]=\"onPan\"\n [stepDistance]=\"stepDistance\"\n [step]=\"step\"\n [templateRef]=\"thumbToTemplateRef\"\n [context]=\"context\"\n [labels]=\"labels\"\n (thumbChange)=\"onThumbChange()\"\n (hoverChange)=\"onHoverChange($event)\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumbLabelVisibilityDuration]=\"thumbLabelVisibilityDuration\"></igx-thumb>\n</div>\n@if (showTicks && showBottomTicks) {\n <igx-ticks\n ticksOrientation=\"bottom\"\n [primaryTicks]=\"primaryTicks\"\n [secondaryTicks]=\"secondaryTicks\"\n [primaryTickLabels]=\"primaryTickLabels\"\n [secondaryTickLabels]=\"secondaryTickLabels\"\n [tickLabelsOrientation]=\"tickLabelsOrientation\"\n [labelsViewEnabled]=\"labelsViewEnabled\"\n [labels]=\"labels | spreadTickLabels:secondaryTicks\"\n [tickLabelTemplateRef]=\"tickLabelTemplateRef\"\n [minValue]=\"minValue\"\n [maxValue]=\"maxValue\">\n </igx-ticks>\n}\n", styles: ["@layer ig.base{.igx-slider{--thumb-radius: calc(var(--thumb-size) / 2);--tick-height: .5rem;--tick-height--tall: calc(var(--tick-height) * 2);display:flex;position:relative;z-index:0;height:3rem;align-items:center;transition:all .2s cubic-bezier(.25,.46,.45,.94);touch-action:pan-y pinch-zoom}.igx-slider:hover .igx-slider__track-inactive{background:var(--base-track-hover-color)}.igx-slider:hover .igx-slider__track-fill{background:var(--track-hover-color)}.igx-slider__track{position:relative;width:100%;height:var(--track-height);overflow:hidden;border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 2rem),2rem)}.igx-slider__track-inactive{position:absolute;width:100%;height:inherit;background:var(--base-track-color);transition:background .2s cubic-bezier(.25,.46,.45,.94);border-radius:inherit}.igx-slider__track-fill{position:absolute;width:100%;background:var(--track-color);transform-origin:left center;transform:scaleX(0);border-radius:inherit;height:inherit}[dir=rtl] .igx-slider__track-fill{transform-origin:right center}.igx-slider__thumbs{position:absolute;width:100%;height:0;cursor:default;z-index:1;inset-inline-start:0}.igx-slider__track-steps{position:absolute;display:flex;width:100%;height:.25rem;opacity:.85;transition:opacity .2s ease-out;top:50%;transform:translateY(-50%);color:var(--track-step-color)}.igx-slider__track-steps svg{clip-path:inset(0 .1875rem 0 .1875rem)}.igx-slider__track-steps line{stroke:currentColor;stroke-width:var(--track-step-size);stroke-linecap:round}.igx-slider--disabled{pointer-events:none}.igx-slider--disabled .igx-slider__track-inactive{background:var(--disabled-base-track-color)}.igx-slider--disabled .igx-slider__track-fill{background:var(--disabled-fill-track-color)}.igx-slider--disabled .igx-slider__ticks-tick{background:var(--disabled-base-track-color)}.igx-slider--disabled .igx-slider__ticks-label{color:var(--disabled-base-track-color)}.igx-ticks{width:100%;display:flex;position:absolute;bottom:0;justify-content:space-between}.igx-ticks__group{display:flex;flex-direction:column;align-items:center;position:relative}.igx-ticks__group:first-of-type{margin-inline-start:-.0625rem}.igx-ticks__group:last-of-type{margin-inline-end:-.0625rem}.igx-ticks__label{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);color:var(--tick-label-color);position:absolute;top:var(--tick-height--tall);transform:translate(-50%);opacity:1;transition:opacity .2s cubic-bezier(.455,.03,.515,.955)}[dir=rtl] .igx-ticks__label{left:100%}.igx-ticks__label--tall{top:calc(var(--tick-height--tall) + var(--tick-height))}.igx-ticks__label--hidden{opacity:0}.igx-ticks__tick{background:var(--tick-color);height:var(--tick-height);width:.125rem}.igx-ticks__tick--tall{height:var(--tick-height--tall)}.igx-ticks--tall .igx-ticks__label{top:calc(var(--tick-height--tall) + var(--tick-height))}.igx-ticks--top{bottom:auto;top:0;align-items:flex-end}.igx-ticks--top .igx-ticks__label{bottom:calc(var(--tick-height)*2);top:auto}.igx-ticks--top .igx-ticks__label--tall,.igx-ticks--top.igx-ticks--tall .igx-ticks__label{bottom:calc(var(--tick-height--tall) + var(--tick-height));top:auto}.igx-ticks--top-bottom .igx-ticks__group{display:block}.igx-ticks--top-bottom .igx-ticks__label{writing-mode:vertical-rl;transform:translate(-50%) rotate(0)}.igx-ticks--bottom-top .igx-ticks__group{display:block}.igx-ticks--bottom-top .igx-ticks__label{writing-mode:vertical-rl;transform:translate(-50%) rotate(180deg)}.igx-slider-thumb-from{position:absolute;display:flex;justify-content:center;align-items:center;flex-direction:column;width:var(--thumb-size);height:var(--thumb-size);outline-style:none;top:calc(var(--thumb-radius)*-1);margin-inline-start:calc(var(--thumb-radius)*-1)}.igx-slider-thumb-from:focus div:before{box-shadow:0 0 0 var(--outline-width) var(--thumb-focus-color)}.igx-slider-thumb-from__dot{position:relative;inset-inline-start:0;pointer-events:none}.igx-slider-thumb-from__dot:before{position:absolute;content:\"\";width:var(--thumb-size);height:var(--thumb-size);inset-inline-start:0;top:calc((var(--thumb-size) - var(--thumb-radius))*-1);margin-inline-start:calc((var(--thumb-size) - var(--thumb-radius))*-1);background:var(--thumb-color);border:var(--thumb-border-width) solid var(--thumb-border-color);transition:transform .1s cubic-bezier(.25,.46,.45,.94),border-radius .1s cubic-bezier(.25,.46,.45,.94);border-radius:var(--thumb-radius)}.igx-slider-thumb-from--disabled:focus div:before{box-shadow:none}.igx-slider-thumb-from--disabled:focus div:after{transform:scale(0)}.igx-slider-thumb-from--disabled .igx-slider-thumb-from__dot{pointer-events:none}.igx-slider-thumb-from--disabled .igx-slider-thumb-from__dot:before{background:var(--disabled-thumb-color);border-color:var(--thumb-disabled-border-color);border-radius:var(--thumb-radius)}.igx-slider-thumb-label-from{position:absolute;pointer-events:none;display:flex;top:calc((var(--thumb-label-height) + 1.25rem)*-1);height:var(--thumb-label-height)}.igx-slider-thumb-label-from__container{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);border-radius:.125rem;display:flex;align-items:center;justify-content:center;white-space:nowrap;margin-inline-start:-50%;padding:0 .5rem;background:var(--label-background-color);color:var(--label-text-color);min-width:var(--thumb-label-width);opacity:0}.igx-slider-thumb-label-from__container:after{content:\"\";position:absolute;top:85%;border-inline-start:.625rem solid rgba(0,0,0,0);border-inline-end:.625rem solid rgba(0,0,0,0);border-top:.625rem solid var(--label-background-color)}.igx-slider-thumb-label-from--pressed .igx-slider-thumb-label-from__container{z-index:1}.igx-slider-thumb-label-from--active .igx-slider-thumb-label-from__container{opacity:1}.igx-slider-thumb-to{position:absolute;display:flex;justify-content:center;align-items:center;flex-direction:column;width:var(--thumb-size);height:var(--thumb-size);outline-style:none;top:calc(var(--thumb-radius)*-1);margin-inline-start:calc(var(--thumb-radius)*-1)}.igx-slider-thumb-to:focus div:before{box-shadow:0 0 0 var(--outline-width) var(--thumb-focus-color)}.igx-slider-thumb-to__dot{position:relative;inset-inline-start:0;pointer-events:none}.igx-slider-thumb-to__dot:before{position:absolute;content:\"\";width:var(--thumb-size);height:var(--thumb-size);inset-inline-start:0;top:calc((var(--thumb-size) - var(--thumb-radius))*-1);margin-inline-start:calc((var(--thumb-size) - var(--thumb-radius))*-1);background:var(--thumb-color);border:var(--thumb-border-width) solid var(--thumb-border-color);transition:transform .1s cubic-bezier(.25,.46,.45,.94),border-radius .1s cubic-bezier(.25,.46,.45,.94);border-radius:var(--thumb-radius)}.igx-slider-thumb-to--disabled:focus div:before{box-shadow:none}.igx-slider-thumb-to--disabled:focus div:after{transform:scale(0)}.igx-slider-thumb-to--disabled .igx-slider-thumb-to__dot{pointer-events:none}.igx-slider-thumb-to--disabled .igx-slider-thumb-to__dot:before{background:var(--disabled-thumb-color);border-color:var(--thumb-disabled-border-color);border-radius:var(--thumb-radius)}.igx-slider-thumb-label-to{position:absolute;pointer-events:none;display:flex;top:calc((var(--thumb-label-height) + 1.25rem)*-1);height:var(--thumb-label-height)}.igx-slider-thumb-label-to__container{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);border-radius:.125rem;display:flex;align-items:center;justify-content:center;white-space:nowrap;margin-inline-start:-50%;padding:0 .5rem;background:var(--label-background-color);color:var(--label-text-color);min-width:var(--thumb-label-width);opacity:0}.igx-slider-thumb-label-to__container:after{content:\"\";position:absolute;top:85%;border-inline-start:.625rem solid rgba(0,0,0,0);border-inline-end:.625rem solid rgba(0,0,0,0);border-top:.625rem solid var(--label-background-color)}.igx-slider-thumb-label-to--pressed .igx-slider-thumb-label-to__container{z-index:1}.igx-slider-thumb-label-to--active .igx-slider-thumb-label-to__container{opacity:1}}@layer ig.material{@container style(--ig-theme: material){.igx-slider{--thumb-size: 1.25rem;--thumb-border-width: 0;--thumb-label-width: 2.5rem;--thumb-label-height: 1.875rem;--track-height: .375rem;--outline-width: 0;--steps-top-position: .125rem;--ripple-size: 2.5rem;--ripple-radius: calc(var(--ripple-size) / 2)}.igx-slider__track-inactive{height:.25rem;top:50%;transform:translateY(-50%)}}}@layer ig.material{@container style(--ig-theme: material){.igx-slider-thumb-from:hover div:after{opacity:.12;transform:scale(1)}.igx-slider-thumb-from:focus div:after{opacity:.18;transform:scale(1)}.igx-slider-thumb-from__dot:after{position:absolute;content:\"\";width:var(--ripple-size);height:var(--ripple-size);background:var(--thumb-color);top:calc(50% - var(--ripple-radius));inset-inline-start:calc(50% - var(--ripple-radius));opacity:0;transform:scale(0);transform-origin:center center;transition:transform .1s cubic-bezier(.25,.46,.45,.94),opacity .1s cubic-bezier(.25,.46,.45,.94);border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%);overflow:hidden}.igx-slider-thumb-from--pressed .igx-slider-thumb-from__dot:after{opacity:.24!important;transform:scale(1)}}}@layer ig.material{@container style(--ig-theme: material){.igx-slider-thumb-to:hover div:after{opacity:.12;transform:scale(1)}.igx-slider-thumb-to:focus div:after{opacity:.18;transform:scale(1)}.igx-slider-thumb-to__dot:after{position:absolute;content:\"\";width:var(--ripple-size);height:var(--ripple-size);background:var(--thumb-color);top:calc(50% - var(--ripple-radius));inset-inline-start:calc(50% - var(--ripple-radius));opacity:0;transform:scale(0);transform-origin:center center;transition:transform .1s cubic-bezier(.25,.46,.45,.94),opacity .1s cubic-bezier(.25,.46,.45,.94);border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%);overflow:hidden}.igx-slider-thumb-to--pressed .igx-slider-thumb-to__dot:after{opacity:.24!important;transform:scale(1)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-slider{--thumb-size: 1rem;--thumb-border-width: .0625rem;--thumb-label-width: 2.5rem;--thumb-label-height: 1.875rem;--track-height: .5rem;--outline-width: .1875rem;--steps-top-position: .1875rem}.igx-slider__track-fill{display:none}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-slider-thumb-from:focus div:before{border-color:var(--thumb-border-focus-color)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-slider-thumb-to:focus div:before{border-color:var(--thumb-border-focus-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-slider{--thumb-size: 1rem;--thumb-border-width: .125rem;--thumb-label-width: 2.5rem;--thumb-label-height: 2.0625rem;--track-height: .25rem;--outline-width: 0;--steps-top-position: .0625rem}.igx-slider:hover .igx-slider-thumb-from__dot:before,.igx-slider:hover .igx-slider-thumb-to__dot:before{border:var(--thumb-border-width) solid var(--thumb-focus-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-slider-thumb-from--focused div:after{position:absolute;content:\"\";pointer-events:none;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 .0625rem var(--thumb-border-focus-color);width:calc(var(--thumb-size) + .125rem*2);height:calc(var(--thumb-size) + .125rem*2)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-slider-thumb-to--focused div:after{position:absolute;content:\"\";pointer-events:none;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 .0625rem var(--thumb-border-focus-color);width:calc(var(--thumb-size) + .125rem*2);height:calc(var(--thumb-size) + .125rem*2)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider{--thumb-size: .75rem;--thumb-border-width: .125rem;--thumb-label-width: 2.25rem;--thumb-label-height: 1.375rem;--track-height: .125rem;--outline-width: .1875rem;--steps-top-position: 0}.igx-slider__track{border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * .25rem),.25rem)}.igx-slider--disabled .igx-slider__track-steps{color:#0000}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-ticks{bottom:.1875rem}.igx-ticks__label{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom)}.igx-ticks--top{top:.1875rem;bottom:auto}.igx-ticks--tall .igx-ticks__label{top:calc(var(--tick-height--tall) + var(--tick-height)/2)}.igx-ticks--top.igx-ticks--tall .igx-ticks__label{bottom:calc(var(--tick-height--tall) + var(--tick-height)/2);top:auto}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-from{transition:transform .2s cubic-bezier(.25,.46,.45,.94)}.igx-slider-thumb-from:hover,.igx-slider-thumb-from:active{transform:scale(1.3333333333)}.igx-slider-thumb-from:hover div:before,.igx-slider-thumb-from:active div:before{border-color:var(--thumb-border-hover-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-label-from{top:calc((var(--thumb-label-height) + 1.125rem)*-1)}.igx-slider-thumb-label-from__container{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);border-radius:.1875rem}.igx-slider-thumb-label-from__container:after{top:1rem;border-top:.75rem solid var(--label-background-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-to{transition:transform .2s cubic-bezier(.25,.46,.45,.94)}.igx-slider-thumb-to:hover,.igx-slider-thumb-to:active{transform:scale(1.3333333333)}.igx-slider-thumb-to:hover div:before,.igx-slider-thumb-to:active div:before{border-color:var(--thumb-border-hover-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-label-to{top:calc((var(--thumb-label-height) + 1.125rem)*-1)}.igx-slider-thumb-label-to__container{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);border-radius:.1875rem}.igx-slider-thumb-label-to__container:after{top:1rem;border-top:.75rem solid var(--label-background-color)}}}\n"], dependencies: [{ kind: "component", type: IgxTicksComponent, selector: "igx-ticks", inputs: ["primaryTicks", "secondaryTicks", "primaryTickLabels", "secondaryTickLabels", "ticksOrientation", "tickLabelsOrientation", "maxValue", "minValue", "labelsViewEnabled", "labels", "tickLabelTemplateRef"] }, { kind: "component", type: IgxThumbLabelComponent, selector: "igx-thumb-label", inputs: ["value", "templateRef", "context", "type", "continuous", "deactiveState", "thumb"] }, { kind: "component", type: IgxSliderThumbComponent, selector: "igx-thumb", inputs: ["value", "continuous", "thumbLabelVisibilityDuration", "disabled", "onPan", "stepDistance", "step", "templateRef", "context", "type", "deactiveState", "min", "max", "labels"], outputs: ["thumbValueChange", "thumbChange", "thumbBlur", "hoverChange"] }, { kind: "pipe", type: IgxTickLabelsPipe, name: "spreadTickLabels" }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
1805
1805
  }
1806
1806
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxSliderComponent, decorators: [{
1807
1807
  type: Component,
1808
- args: [{ providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: IgxSliderComponent, multi: true }], selector: 'igx-slider', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTicksComponent, IgxThumbLabelComponent, IgxSliderThumbComponent, IgxTickLabelsPipe], template: "@if (showTicks && showTopTicks) {\n <igx-ticks\n ticksOrientation=\"top\"\n [primaryTicks]=\"primaryTicks\"\n [secondaryTicks]=\"secondaryTicks\"\n [primaryTickLabels]=\"primaryTickLabels\"\n [secondaryTickLabels]=\"secondaryTickLabels\"\n [tickLabelsOrientation]=\"tickLabelsOrientation\"\n [labelsViewEnabled]=\"labelsViewEnabled\"\n [labels]=\"labels! | spreadTickLabels:secondaryTicks\"\n [tickLabelTemplateRef]=\"tickLabelTemplateRef\"\n [minValue]=\"minValue\"\n [maxValue]=\"maxValue\">\n </igx-ticks>\n}\n<div class=\"igx-slider__track\">\n <div class=\"igx-slider__track-inactive\"></div>\n <div #track class=\"igx-slider__track-fill\"></div>\n <div class=\"igx-slider__track-steps\">\n <svg width=\"100%\" height=\"100%\">\n <line #ticks x1=\"0\" y1=\"2\" x2=\"100%\" y2=\"2\"></line>\n </svg>\n </div>\n</div>\n<div class=\"igx-slider__thumbs\">\n @if (isRange) {\n <igx-thumb-label\n type=\"from\"\n [value]=\"lowerLabel\"\n [templateRef]=\"thumbFromTemplateRef\"\n [continuous]=\"continuous\"\n [context]=\"context\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumb]=\"thumbFrom\"></igx-thumb-label>\n }\n\n @if (isRange) {\n <igx-thumb\n #thumbFrom\n type=\"from\"\n [value]=\"lowerLabel\"\n [min]=\"minValue\"\n [max]=\"maxValue\"\n [disabled]=\"disabled\"\n [continuous]=\"continuous\"\n [onPan]=\"onPan\"\n [stepDistance]=\"stepDistance\"\n [step]=\"step\"\n [templateRef]=\"thumbFromTemplateRef\"\n [context]=\"context\"\n [labels]=\"labels\"\n (thumbChange)=\"onThumbChange()\"\n (hoverChange)=\"onHoverChange($event)\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumbLabelVisibilityDuration]=\"thumbLabelVisibilityDuration\"></igx-thumb>\n }\n\n <igx-thumb-label\n [value]=\"upperLabel\"\n type=\"to\"\n [templateRef]=\"thumbToTemplateRef\"\n [continuous]=\"continuous\"\n [context]=\"context\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumb]=\"thumbTo\"></igx-thumb-label>\n\n <igx-thumb\n #thumbTo\n type=\"to\"\n [value]=\"upperLabel\"\n [min]=\"minValue\"\n [max]=\"maxValue\"\n [disabled]=\"disabled\"\n [continuous]=\"continuous\"\n [onPan]=\"onPan\"\n [stepDistance]=\"stepDistance\"\n [step]=\"step\"\n [templateRef]=\"thumbToTemplateRef\"\n [context]=\"context\"\n [labels]=\"labels\"\n (thumbChange)=\"onThumbChange()\"\n (hoverChange)=\"onHoverChange($event)\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumbLabelVisibilityDuration]=\"thumbLabelVisibilityDuration\"></igx-thumb>\n</div>\n@if (showTicks && showBottomTicks) {\n <igx-ticks\n ticksOrientation=\"bottom\"\n [primaryTicks]=\"primaryTicks\"\n [secondaryTicks]=\"secondaryTicks\"\n [primaryTickLabels]=\"primaryTickLabels\"\n [secondaryTickLabels]=\"secondaryTickLabels\"\n [tickLabelsOrientation]=\"tickLabelsOrientation\"\n [labelsViewEnabled]=\"labelsViewEnabled\"\n [labels]=\"labels! | spreadTickLabels:secondaryTicks\"\n [tickLabelTemplateRef]=\"tickLabelTemplateRef\"\n [minValue]=\"minValue\"\n [maxValue]=\"maxValue\">\n </igx-ticks>\n}\n", styles: ["@layer ig.base{.igx-slider{--thumb-radius: calc(var(--thumb-size) / 2);--tick-height: .5rem;--tick-height--tall: calc(var(--tick-height) * 2);display:flex;position:relative;z-index:0;height:3rem;align-items:center;transition:all .2s cubic-bezier(.25,.46,.45,.94);touch-action:pan-y pinch-zoom}.igx-slider:hover .igx-slider__track-inactive{background:var(--base-track-hover-color)}.igx-slider:hover .igx-slider__track-fill{background:var(--track-hover-color)}.igx-slider__track{position:relative;width:100%;height:var(--track-height);overflow:hidden;border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 2rem),2rem)}.igx-slider__track-inactive{position:absolute;width:100%;height:inherit;background:var(--base-track-color);transition:background .2s cubic-bezier(.25,.46,.45,.94);border-radius:inherit}.igx-slider__track-fill{position:absolute;width:100%;background:var(--track-color);transform-origin:left center;transform:scaleX(0);border-radius:inherit;height:inherit}[dir=rtl] .igx-slider__track-fill{transform-origin:right center}.igx-slider__thumbs{position:absolute;width:100%;height:0;cursor:default;z-index:1;inset-inline-start:0}.igx-slider__track-steps{position:absolute;display:flex;width:100%;height:.25rem;opacity:.85;transition:opacity .2s ease-out;top:50%;transform:translateY(-50%);color:var(--track-step-color)}.igx-slider__track-steps svg{clip-path:inset(0 .1875rem 0 .1875rem)}.igx-slider__track-steps line{stroke:currentColor;stroke-width:var(--track-step-size);stroke-linecap:round}.igx-slider--disabled{pointer-events:none}.igx-slider--disabled .igx-slider__track-inactive{background:var(--disabled-base-track-color)}.igx-slider--disabled .igx-slider__track-fill{background:var(--disabled-fill-track-color)}.igx-slider--disabled .igx-slider__ticks-tick{background:var(--disabled-base-track-color)}.igx-slider--disabled .igx-slider__ticks-label{color:var(--disabled-base-track-color)}.igx-ticks{width:100%;display:flex;position:absolute;bottom:0;justify-content:space-between}.igx-ticks__group{display:flex;flex-direction:column;align-items:center;position:relative}.igx-ticks__group:first-of-type{margin-inline-start:-.0625rem}.igx-ticks__group:last-of-type{margin-inline-end:-.0625rem}.igx-ticks__label{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);color:var(--tick-label-color);position:absolute;top:var(--tick-height--tall);transform:translate(-50%);opacity:1;transition:opacity .2s cubic-bezier(.455,.03,.515,.955)}[dir=rtl] .igx-ticks__label{left:100%}.igx-ticks__label--tall{top:calc(var(--tick-height--tall) + var(--tick-height))}.igx-ticks__label--hidden{opacity:0}.igx-ticks__tick{background:var(--tick-color);height:var(--tick-height);width:.125rem}.igx-ticks__tick--tall{height:var(--tick-height--tall)}.igx-ticks--tall .igx-ticks__label{top:calc(var(--tick-height--tall) + var(--tick-height))}.igx-ticks--top{bottom:auto;top:0;align-items:flex-end}.igx-ticks--top .igx-ticks__label{bottom:calc(var(--tick-height)*2);top:auto}.igx-ticks--top .igx-ticks__label--tall,.igx-ticks--top.igx-ticks--tall .igx-ticks__label{bottom:calc(var(--tick-height--tall) + var(--tick-height));top:auto}.igx-ticks--top-bottom .igx-ticks__group{display:block}.igx-ticks--top-bottom .igx-ticks__label{writing-mode:vertical-rl;transform:translate(-50%) rotate(0)}.igx-ticks--bottom-top .igx-ticks__group{display:block}.igx-ticks--bottom-top .igx-ticks__label{writing-mode:vertical-rl;transform:translate(-50%) rotate(180deg)}.igx-slider-thumb-from{position:absolute;display:flex;justify-content:center;align-items:center;flex-direction:column;width:var(--thumb-size);height:var(--thumb-size);outline-style:none;top:calc(var(--thumb-radius)*-1);margin-inline-start:calc(var(--thumb-radius)*-1)}.igx-slider-thumb-from:focus div:before{box-shadow:0 0 0 var(--outline-width) var(--thumb-focus-color)}.igx-slider-thumb-from__dot{position:relative;inset-inline-start:0;pointer-events:none}.igx-slider-thumb-from__dot:before{position:absolute;content:\"\";width:var(--thumb-size);height:var(--thumb-size);inset-inline-start:0;top:calc((var(--thumb-size) - var(--thumb-radius))*-1);margin-inline-start:calc((var(--thumb-size) - var(--thumb-radius))*-1);background:var(--thumb-color);border:var(--thumb-border-width) solid var(--thumb-border-color);transition:transform .1s cubic-bezier(.25,.46,.45,.94),border-radius .1s cubic-bezier(.25,.46,.45,.94);border-radius:var(--thumb-radius)}.igx-slider-thumb-from--disabled:focus div:before{box-shadow:none}.igx-slider-thumb-from--disabled:focus div:after{transform:scale(0)}.igx-slider-thumb-from--disabled .igx-slider-thumb-from__dot{pointer-events:none}.igx-slider-thumb-from--disabled .igx-slider-thumb-from__dot:before{background:var(--disabled-thumb-color);border-color:var(--thumb-disabled-border-color);border-radius:var(--thumb-radius)}.igx-slider-thumb-label-from{position:absolute;pointer-events:none;display:flex;top:calc((var(--thumb-label-height) + 1.25rem)*-1);height:var(--thumb-label-height)}.igx-slider-thumb-label-from__container{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);border-radius:.125rem;display:flex;align-items:center;justify-content:center;white-space:nowrap;margin-inline-start:-50%;padding:0 .5rem;background:var(--label-background-color);color:var(--label-text-color);min-width:var(--thumb-label-width);opacity:0}.igx-slider-thumb-label-from__container:after{content:\"\";position:absolute;top:85%;border-inline-start:.625rem solid rgba(0,0,0,0);border-inline-end:.625rem solid rgba(0,0,0,0);border-top:.625rem solid var(--label-background-color)}.igx-slider-thumb-label-from--pressed .igx-slider-thumb-label-from__container{z-index:1}.igx-slider-thumb-label-from--active .igx-slider-thumb-label-from__container{opacity:1}.igx-slider-thumb-to{position:absolute;display:flex;justify-content:center;align-items:center;flex-direction:column;width:var(--thumb-size);height:var(--thumb-size);outline-style:none;top:calc(var(--thumb-radius)*-1);margin-inline-start:calc(var(--thumb-radius)*-1)}.igx-slider-thumb-to:focus div:before{box-shadow:0 0 0 var(--outline-width) var(--thumb-focus-color)}.igx-slider-thumb-to__dot{position:relative;inset-inline-start:0;pointer-events:none}.igx-slider-thumb-to__dot:before{position:absolute;content:\"\";width:var(--thumb-size);height:var(--thumb-size);inset-inline-start:0;top:calc((var(--thumb-size) - var(--thumb-radius))*-1);margin-inline-start:calc((var(--thumb-size) - var(--thumb-radius))*-1);background:var(--thumb-color);border:var(--thumb-border-width) solid var(--thumb-border-color);transition:transform .1s cubic-bezier(.25,.46,.45,.94),border-radius .1s cubic-bezier(.25,.46,.45,.94);border-radius:var(--thumb-radius)}.igx-slider-thumb-to--disabled:focus div:before{box-shadow:none}.igx-slider-thumb-to--disabled:focus div:after{transform:scale(0)}.igx-slider-thumb-to--disabled .igx-slider-thumb-to__dot{pointer-events:none}.igx-slider-thumb-to--disabled .igx-slider-thumb-to__dot:before{background:var(--disabled-thumb-color);border-color:var(--thumb-disabled-border-color);border-radius:var(--thumb-radius)}.igx-slider-thumb-label-to{position:absolute;pointer-events:none;display:flex;top:calc((var(--thumb-label-height) + 1.25rem)*-1);height:var(--thumb-label-height)}.igx-slider-thumb-label-to__container{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);border-radius:.125rem;display:flex;align-items:center;justify-content:center;white-space:nowrap;margin-inline-start:-50%;padding:0 .5rem;background:var(--label-background-color);color:var(--label-text-color);min-width:var(--thumb-label-width);opacity:0}.igx-slider-thumb-label-to__container:after{content:\"\";position:absolute;top:85%;border-inline-start:.625rem solid rgba(0,0,0,0);border-inline-end:.625rem solid rgba(0,0,0,0);border-top:.625rem solid var(--label-background-color)}.igx-slider-thumb-label-to--pressed .igx-slider-thumb-label-to__container{z-index:1}.igx-slider-thumb-label-to--active .igx-slider-thumb-label-to__container{opacity:1}}@layer ig.material{@container style(--ig-theme: material){.igx-slider{--thumb-size: 1.25rem;--thumb-border-width: 0;--thumb-label-width: 2.5rem;--thumb-label-height: 1.875rem;--track-height: .375rem;--outline-width: 0;--steps-top-position: .125rem;--ripple-size: 2.5rem;--ripple-radius: calc(var(--ripple-size) / 2)}.igx-slider__track-inactive{height:.25rem;top:50%;transform:translateY(-50%)}}}@layer ig.material{@container style(--ig-theme: material){.igx-slider-thumb-from:hover div:after{opacity:.12;transform:scale(1)}.igx-slider-thumb-from:focus div:after{opacity:.18;transform:scale(1)}.igx-slider-thumb-from__dot:after{position:absolute;content:\"\";width:var(--ripple-size);height:var(--ripple-size);background:var(--thumb-color);top:calc(50% - var(--ripple-radius));inset-inline-start:calc(50% - var(--ripple-radius));opacity:0;transform:scale(0);transform-origin:center center;transition:transform .1s cubic-bezier(.25,.46,.45,.94),opacity .1s cubic-bezier(.25,.46,.45,.94);border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%);overflow:hidden}.igx-slider-thumb-from--pressed .igx-slider-thumb-from__dot:after{opacity:.24!important;transform:scale(1)}}}@layer ig.material{@container style(--ig-theme: material){.igx-slider-thumb-to:hover div:after{opacity:.12;transform:scale(1)}.igx-slider-thumb-to:focus div:after{opacity:.18;transform:scale(1)}.igx-slider-thumb-to__dot:after{position:absolute;content:\"\";width:var(--ripple-size);height:var(--ripple-size);background:var(--thumb-color);top:calc(50% - var(--ripple-radius));inset-inline-start:calc(50% - var(--ripple-radius));opacity:0;transform:scale(0);transform-origin:center center;transition:transform .1s cubic-bezier(.25,.46,.45,.94),opacity .1s cubic-bezier(.25,.46,.45,.94);border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%);overflow:hidden}.igx-slider-thumb-to--pressed .igx-slider-thumb-to__dot:after{opacity:.24!important;transform:scale(1)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-slider{--thumb-size: 1rem;--thumb-border-width: .0625rem;--thumb-label-width: 2.5rem;--thumb-label-height: 1.875rem;--track-height: .5rem;--outline-width: .1875rem;--steps-top-position: .1875rem}.igx-slider__track-fill{display:none}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-slider-thumb-from:focus div:before{border-color:var(--thumb-border-focus-color)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-slider-thumb-to:focus div:before{border-color:var(--thumb-border-focus-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-slider{--thumb-size: 1rem;--thumb-border-width: .125rem;--thumb-label-width: 2.5rem;--thumb-label-height: 2.0625rem;--track-height: .25rem;--outline-width: 0;--steps-top-position: .0625rem}.igx-slider:hover .igx-slider-thumb-from__dot:before,.igx-slider:hover .igx-slider-thumb-to__dot:before{border:var(--thumb-border-width) solid var(--thumb-focus-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-slider-thumb-from--focused div:after{position:absolute;content:\"\";pointer-events:none;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 .0625rem var(--thumb-border-focus-color);width:calc(var(--thumb-size) + .125rem*2);height:calc(var(--thumb-size) + .125rem*2)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-slider-thumb-to--focused div:after{position:absolute;content:\"\";pointer-events:none;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 .0625rem var(--thumb-border-focus-color);width:calc(var(--thumb-size) + .125rem*2);height:calc(var(--thumb-size) + .125rem*2)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider{--thumb-size: .75rem;--thumb-border-width: .125rem;--thumb-label-width: 2.25rem;--thumb-label-height: 1.375rem;--track-height: .125rem;--outline-width: .1875rem;--steps-top-position: 0}.igx-slider__track{border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * .25rem),.25rem)}.igx-slider--disabled .igx-slider__track-steps{color:#0000}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-ticks{bottom:.1875rem}.igx-ticks__label{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom)}.igx-ticks--top{top:.1875rem;bottom:auto}.igx-ticks--tall .igx-ticks__label{top:calc(var(--tick-height--tall) + var(--tick-height)/2)}.igx-ticks--top.igx-ticks--tall .igx-ticks__label{bottom:calc(var(--tick-height--tall) + var(--tick-height)/2);top:auto}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-from{transition:transform .2s cubic-bezier(.25,.46,.45,.94)}.igx-slider-thumb-from:hover,.igx-slider-thumb-from:active{transform:scale(1.3333333333)}.igx-slider-thumb-from:hover div:before,.igx-slider-thumb-from:active div:before{border-color:var(--thumb-border-hover-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-label-from{top:calc((var(--thumb-label-height) + 1.125rem)*-1)}.igx-slider-thumb-label-from__container{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);border-radius:.1875rem}.igx-slider-thumb-label-from__container:after{top:1rem;border-top:.75rem solid var(--label-background-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-to{transition:transform .2s cubic-bezier(.25,.46,.45,.94)}.igx-slider-thumb-to:hover,.igx-slider-thumb-to:active{transform:scale(1.3333333333)}.igx-slider-thumb-to:hover div:before,.igx-slider-thumb-to:active div:before{border-color:var(--thumb-border-hover-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-label-to{top:calc((var(--thumb-label-height) + 1.125rem)*-1)}.igx-slider-thumb-label-to__container{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);border-radius:.1875rem}.igx-slider-thumb-label-to__container:after{top:1rem;border-top:.75rem solid var(--label-background-color)}}}\n"] }]
1808
+ args: [{ providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: IgxSliderComponent, multi: true }], selector: 'igx-slider', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxTicksComponent, IgxThumbLabelComponent, IgxSliderThumbComponent, IgxTickLabelsPipe], template: "@if (showTicks && showTopTicks) {\n <igx-ticks\n ticksOrientation=\"top\"\n [primaryTicks]=\"primaryTicks\"\n [secondaryTicks]=\"secondaryTicks\"\n [primaryTickLabels]=\"primaryTickLabels\"\n [secondaryTickLabels]=\"secondaryTickLabels\"\n [tickLabelsOrientation]=\"tickLabelsOrientation\"\n [labelsViewEnabled]=\"labelsViewEnabled\"\n [labels]=\"labels | spreadTickLabels:secondaryTicks\"\n [tickLabelTemplateRef]=\"tickLabelTemplateRef\"\n [minValue]=\"minValue\"\n [maxValue]=\"maxValue\">\n </igx-ticks>\n}\n<div class=\"igx-slider__track\">\n <div class=\"igx-slider__track-inactive\"></div>\n <div #track class=\"igx-slider__track-fill\"></div>\n <div class=\"igx-slider__track-steps\">\n <svg width=\"100%\" height=\"100%\">\n <line #ticks x1=\"0\" y1=\"2\" x2=\"100%\" y2=\"2\"></line>\n </svg>\n </div>\n</div>\n<div class=\"igx-slider__thumbs\">\n @if (isRange) {\n <igx-thumb-label\n type=\"from\"\n [value]=\"lowerLabel\"\n [templateRef]=\"thumbFromTemplateRef\"\n [continuous]=\"continuous\"\n [context]=\"context\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumb]=\"thumbFrom\"></igx-thumb-label>\n }\n\n @if (isRange) {\n <igx-thumb\n #thumbFrom\n type=\"from\"\n [value]=\"lowerLabel\"\n [min]=\"minValue\"\n [max]=\"maxValue\"\n [disabled]=\"disabled\"\n [continuous]=\"continuous\"\n [onPan]=\"onPan\"\n [stepDistance]=\"stepDistance\"\n [step]=\"step\"\n [templateRef]=\"thumbFromTemplateRef\"\n [context]=\"context\"\n [labels]=\"labels\"\n (thumbChange)=\"onThumbChange()\"\n (hoverChange)=\"onHoverChange($event)\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumbLabelVisibilityDuration]=\"thumbLabelVisibilityDuration\"></igx-thumb>\n }\n\n <igx-thumb-label\n [value]=\"upperLabel\"\n type=\"to\"\n [templateRef]=\"thumbToTemplateRef\"\n [continuous]=\"continuous\"\n [context]=\"context\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumb]=\"thumbTo\"></igx-thumb-label>\n\n <igx-thumb\n #thumbTo\n type=\"to\"\n [value]=\"upperLabel\"\n [min]=\"minValue\"\n [max]=\"maxValue\"\n [disabled]=\"disabled\"\n [continuous]=\"continuous\"\n [onPan]=\"onPan\"\n [stepDistance]=\"stepDistance\"\n [step]=\"step\"\n [templateRef]=\"thumbToTemplateRef\"\n [context]=\"context\"\n [labels]=\"labels\"\n (thumbChange)=\"onThumbChange()\"\n (hoverChange)=\"onHoverChange($event)\"\n [deactiveState]=\"deactivateThumbLabel\"\n [thumbLabelVisibilityDuration]=\"thumbLabelVisibilityDuration\"></igx-thumb>\n</div>\n@if (showTicks && showBottomTicks) {\n <igx-ticks\n ticksOrientation=\"bottom\"\n [primaryTicks]=\"primaryTicks\"\n [secondaryTicks]=\"secondaryTicks\"\n [primaryTickLabels]=\"primaryTickLabels\"\n [secondaryTickLabels]=\"secondaryTickLabels\"\n [tickLabelsOrientation]=\"tickLabelsOrientation\"\n [labelsViewEnabled]=\"labelsViewEnabled\"\n [labels]=\"labels | spreadTickLabels:secondaryTicks\"\n [tickLabelTemplateRef]=\"tickLabelTemplateRef\"\n [minValue]=\"minValue\"\n [maxValue]=\"maxValue\">\n </igx-ticks>\n}\n", styles: ["@layer ig.base{.igx-slider{--thumb-radius: calc(var(--thumb-size) / 2);--tick-height: .5rem;--tick-height--tall: calc(var(--tick-height) * 2);display:flex;position:relative;z-index:0;height:3rem;align-items:center;transition:all .2s cubic-bezier(.25,.46,.45,.94);touch-action:pan-y pinch-zoom}.igx-slider:hover .igx-slider__track-inactive{background:var(--base-track-hover-color)}.igx-slider:hover .igx-slider__track-fill{background:var(--track-hover-color)}.igx-slider__track{position:relative;width:100%;height:var(--track-height);overflow:hidden;border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 2rem),2rem)}.igx-slider__track-inactive{position:absolute;width:100%;height:inherit;background:var(--base-track-color);transition:background .2s cubic-bezier(.25,.46,.45,.94);border-radius:inherit}.igx-slider__track-fill{position:absolute;width:100%;background:var(--track-color);transform-origin:left center;transform:scaleX(0);border-radius:inherit;height:inherit}[dir=rtl] .igx-slider__track-fill{transform-origin:right center}.igx-slider__thumbs{position:absolute;width:100%;height:0;cursor:default;z-index:1;inset-inline-start:0}.igx-slider__track-steps{position:absolute;display:flex;width:100%;height:.25rem;opacity:.85;transition:opacity .2s ease-out;top:50%;transform:translateY(-50%);color:var(--track-step-color)}.igx-slider__track-steps svg{clip-path:inset(0 .1875rem 0 .1875rem)}.igx-slider__track-steps line{stroke:currentColor;stroke-width:var(--track-step-size);stroke-linecap:round}.igx-slider--disabled{pointer-events:none}.igx-slider--disabled .igx-slider__track-inactive{background:var(--disabled-base-track-color)}.igx-slider--disabled .igx-slider__track-fill{background:var(--disabled-fill-track-color)}.igx-slider--disabled .igx-slider__ticks-tick{background:var(--disabled-base-track-color)}.igx-slider--disabled .igx-slider__ticks-label{color:var(--disabled-base-track-color)}.igx-ticks{width:100%;display:flex;position:absolute;bottom:0;justify-content:space-between}.igx-ticks__group{display:flex;flex-direction:column;align-items:center;position:relative}.igx-ticks__group:first-of-type{margin-inline-start:-.0625rem}.igx-ticks__group:last-of-type{margin-inline-end:-.0625rem}.igx-ticks__label{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);color:var(--tick-label-color);position:absolute;top:var(--tick-height--tall);transform:translate(-50%);opacity:1;transition:opacity .2s cubic-bezier(.455,.03,.515,.955)}[dir=rtl] .igx-ticks__label{left:100%}.igx-ticks__label--tall{top:calc(var(--tick-height--tall) + var(--tick-height))}.igx-ticks__label--hidden{opacity:0}.igx-ticks__tick{background:var(--tick-color);height:var(--tick-height);width:.125rem}.igx-ticks__tick--tall{height:var(--tick-height--tall)}.igx-ticks--tall .igx-ticks__label{top:calc(var(--tick-height--tall) + var(--tick-height))}.igx-ticks--top{bottom:auto;top:0;align-items:flex-end}.igx-ticks--top .igx-ticks__label{bottom:calc(var(--tick-height)*2);top:auto}.igx-ticks--top .igx-ticks__label--tall,.igx-ticks--top.igx-ticks--tall .igx-ticks__label{bottom:calc(var(--tick-height--tall) + var(--tick-height));top:auto}.igx-ticks--top-bottom .igx-ticks__group{display:block}.igx-ticks--top-bottom .igx-ticks__label{writing-mode:vertical-rl;transform:translate(-50%) rotate(0)}.igx-ticks--bottom-top .igx-ticks__group{display:block}.igx-ticks--bottom-top .igx-ticks__label{writing-mode:vertical-rl;transform:translate(-50%) rotate(180deg)}.igx-slider-thumb-from{position:absolute;display:flex;justify-content:center;align-items:center;flex-direction:column;width:var(--thumb-size);height:var(--thumb-size);outline-style:none;top:calc(var(--thumb-radius)*-1);margin-inline-start:calc(var(--thumb-radius)*-1)}.igx-slider-thumb-from:focus div:before{box-shadow:0 0 0 var(--outline-width) var(--thumb-focus-color)}.igx-slider-thumb-from__dot{position:relative;inset-inline-start:0;pointer-events:none}.igx-slider-thumb-from__dot:before{position:absolute;content:\"\";width:var(--thumb-size);height:var(--thumb-size);inset-inline-start:0;top:calc((var(--thumb-size) - var(--thumb-radius))*-1);margin-inline-start:calc((var(--thumb-size) - var(--thumb-radius))*-1);background:var(--thumb-color);border:var(--thumb-border-width) solid var(--thumb-border-color);transition:transform .1s cubic-bezier(.25,.46,.45,.94),border-radius .1s cubic-bezier(.25,.46,.45,.94);border-radius:var(--thumb-radius)}.igx-slider-thumb-from--disabled:focus div:before{box-shadow:none}.igx-slider-thumb-from--disabled:focus div:after{transform:scale(0)}.igx-slider-thumb-from--disabled .igx-slider-thumb-from__dot{pointer-events:none}.igx-slider-thumb-from--disabled .igx-slider-thumb-from__dot:before{background:var(--disabled-thumb-color);border-color:var(--thumb-disabled-border-color);border-radius:var(--thumb-radius)}.igx-slider-thumb-label-from{position:absolute;pointer-events:none;display:flex;top:calc((var(--thumb-label-height) + 1.25rem)*-1);height:var(--thumb-label-height)}.igx-slider-thumb-label-from__container{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);border-radius:.125rem;display:flex;align-items:center;justify-content:center;white-space:nowrap;margin-inline-start:-50%;padding:0 .5rem;background:var(--label-background-color);color:var(--label-text-color);min-width:var(--thumb-label-width);opacity:0}.igx-slider-thumb-label-from__container:after{content:\"\";position:absolute;top:85%;border-inline-start:.625rem solid rgba(0,0,0,0);border-inline-end:.625rem solid rgba(0,0,0,0);border-top:.625rem solid var(--label-background-color)}.igx-slider-thumb-label-from--pressed .igx-slider-thumb-label-from__container{z-index:1}.igx-slider-thumb-label-from--active .igx-slider-thumb-label-from__container{opacity:1}.igx-slider-thumb-to{position:absolute;display:flex;justify-content:center;align-items:center;flex-direction:column;width:var(--thumb-size);height:var(--thumb-size);outline-style:none;top:calc(var(--thumb-radius)*-1);margin-inline-start:calc(var(--thumb-radius)*-1)}.igx-slider-thumb-to:focus div:before{box-shadow:0 0 0 var(--outline-width) var(--thumb-focus-color)}.igx-slider-thumb-to__dot{position:relative;inset-inline-start:0;pointer-events:none}.igx-slider-thumb-to__dot:before{position:absolute;content:\"\";width:var(--thumb-size);height:var(--thumb-size);inset-inline-start:0;top:calc((var(--thumb-size) - var(--thumb-radius))*-1);margin-inline-start:calc((var(--thumb-size) - var(--thumb-radius))*-1);background:var(--thumb-color);border:var(--thumb-border-width) solid var(--thumb-border-color);transition:transform .1s cubic-bezier(.25,.46,.45,.94),border-radius .1s cubic-bezier(.25,.46,.45,.94);border-radius:var(--thumb-radius)}.igx-slider-thumb-to--disabled:focus div:before{box-shadow:none}.igx-slider-thumb-to--disabled:focus div:after{transform:scale(0)}.igx-slider-thumb-to--disabled .igx-slider-thumb-to__dot{pointer-events:none}.igx-slider-thumb-to--disabled .igx-slider-thumb-to__dot:before{background:var(--disabled-thumb-color);border-color:var(--thumb-disabled-border-color);border-radius:var(--thumb-radius)}.igx-slider-thumb-label-to{position:absolute;pointer-events:none;display:flex;top:calc((var(--thumb-label-height) + 1.25rem)*-1);height:var(--thumb-label-height)}.igx-slider-thumb-label-to__container{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);border-radius:.125rem;display:flex;align-items:center;justify-content:center;white-space:nowrap;margin-inline-start:-50%;padding:0 .5rem;background:var(--label-background-color);color:var(--label-text-color);min-width:var(--thumb-label-width);opacity:0}.igx-slider-thumb-label-to__container:after{content:\"\";position:absolute;top:85%;border-inline-start:.625rem solid rgba(0,0,0,0);border-inline-end:.625rem solid rgba(0,0,0,0);border-top:.625rem solid var(--label-background-color)}.igx-slider-thumb-label-to--pressed .igx-slider-thumb-label-to__container{z-index:1}.igx-slider-thumb-label-to--active .igx-slider-thumb-label-to__container{opacity:1}}@layer ig.material{@container style(--ig-theme: material){.igx-slider{--thumb-size: 1.25rem;--thumb-border-width: 0;--thumb-label-width: 2.5rem;--thumb-label-height: 1.875rem;--track-height: .375rem;--outline-width: 0;--steps-top-position: .125rem;--ripple-size: 2.5rem;--ripple-radius: calc(var(--ripple-size) / 2)}.igx-slider__track-inactive{height:.25rem;top:50%;transform:translateY(-50%)}}}@layer ig.material{@container style(--ig-theme: material){.igx-slider-thumb-from:hover div:after{opacity:.12;transform:scale(1)}.igx-slider-thumb-from:focus div:after{opacity:.18;transform:scale(1)}.igx-slider-thumb-from__dot:after{position:absolute;content:\"\";width:var(--ripple-size);height:var(--ripple-size);background:var(--thumb-color);top:calc(50% - var(--ripple-radius));inset-inline-start:calc(50% - var(--ripple-radius));opacity:0;transform:scale(0);transform-origin:center center;transition:transform .1s cubic-bezier(.25,.46,.45,.94),opacity .1s cubic-bezier(.25,.46,.45,.94);border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%);overflow:hidden}.igx-slider-thumb-from--pressed .igx-slider-thumb-from__dot:after{opacity:.24!important;transform:scale(1)}}}@layer ig.material{@container style(--ig-theme: material){.igx-slider-thumb-to:hover div:after{opacity:.12;transform:scale(1)}.igx-slider-thumb-to:focus div:after{opacity:.18;transform:scale(1)}.igx-slider-thumb-to__dot:after{position:absolute;content:\"\";width:var(--ripple-size);height:var(--ripple-size);background:var(--thumb-color);top:calc(50% - var(--ripple-radius));inset-inline-start:calc(50% - var(--ripple-radius));opacity:0;transform:scale(0);transform-origin:center center;transition:transform .1s cubic-bezier(.25,.46,.45,.94),opacity .1s cubic-bezier(.25,.46,.45,.94);border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%);overflow:hidden}.igx-slider-thumb-to--pressed .igx-slider-thumb-to__dot:after{opacity:.24!important;transform:scale(1)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-slider{--thumb-size: 1rem;--thumb-border-width: .0625rem;--thumb-label-width: 2.5rem;--thumb-label-height: 1.875rem;--track-height: .5rem;--outline-width: .1875rem;--steps-top-position: .1875rem}.igx-slider__track-fill{display:none}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-slider-thumb-from:focus div:before{border-color:var(--thumb-border-focus-color)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-slider-thumb-to:focus div:before{border-color:var(--thumb-border-focus-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-slider{--thumb-size: 1rem;--thumb-border-width: .125rem;--thumb-label-width: 2.5rem;--thumb-label-height: 2.0625rem;--track-height: .25rem;--outline-width: 0;--steps-top-position: .0625rem}.igx-slider:hover .igx-slider-thumb-from__dot:before,.igx-slider:hover .igx-slider-thumb-to__dot:before{border:var(--thumb-border-width) solid var(--thumb-focus-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-slider-thumb-from--focused div:after{position:absolute;content:\"\";pointer-events:none;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 .0625rem var(--thumb-border-focus-color);width:calc(var(--thumb-size) + .125rem*2);height:calc(var(--thumb-size) + .125rem*2)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-slider-thumb-to--focused div:after{position:absolute;content:\"\";pointer-events:none;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 .0625rem var(--thumb-border-focus-color);width:calc(var(--thumb-size) + .125rem*2);height:calc(var(--thumb-size) + .125rem*2)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider{--thumb-size: .75rem;--thumb-border-width: .125rem;--thumb-label-width: 2.25rem;--thumb-label-height: 1.375rem;--track-height: .125rem;--outline-width: .1875rem;--steps-top-position: 0}.igx-slider__track{border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * .25rem),.25rem)}.igx-slider--disabled .igx-slider__track-steps{color:#0000}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-ticks{bottom:.1875rem}.igx-ticks__label{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom)}.igx-ticks--top{top:.1875rem;bottom:auto}.igx-ticks--tall .igx-ticks__label{top:calc(var(--tick-height--tall) + var(--tick-height)/2)}.igx-ticks--top.igx-ticks--tall .igx-ticks__label{bottom:calc(var(--tick-height--tall) + var(--tick-height)/2);top:auto}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-from{transition:transform .2s cubic-bezier(.25,.46,.45,.94)}.igx-slider-thumb-from:hover,.igx-slider-thumb-from:active{transform:scale(1.3333333333)}.igx-slider-thumb-from:hover div:before,.igx-slider-thumb-from:active div:before{border-color:var(--thumb-border-hover-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-label-from{top:calc((var(--thumb-label-height) + 1.125rem)*-1)}.igx-slider-thumb-label-from__container{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);border-radius:.1875rem}.igx-slider-thumb-label-from__container:after{top:1rem;border-top:.75rem solid var(--label-background-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-to{transition:transform .2s cubic-bezier(.25,.46,.45,.94)}.igx-slider-thumb-to:hover,.igx-slider-thumb-to:active{transform:scale(1.3333333333)}.igx-slider-thumb-to:hover div:before,.igx-slider-thumb-to:active div:before{border-color:var(--thumb-border-hover-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-slider-thumb-label-to{top:calc((var(--thumb-label-height) + 1.125rem)*-1)}.igx-slider-thumb-label-to__container{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);border-radius:.1875rem}.igx-slider-thumb-label-to__container:after{top:1rem;border-top:.75rem solid var(--label-background-color)}}}\n"] }]
1809
1809
  }], ctorParameters: () => [], propDecorators: { trackRef: [{
1810
1810
  type: ViewChild,
1811
1811
  args: ['track', { static: true }]