@ionic/core 8.7.17-dev.11769813102.16c5bfac → 8.7.17-dev.11770319814.172b4f50

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 (41) hide show
  1. package/components/ion-range.js +39 -81
  2. package/components/ion-refresher.js +32 -3
  3. package/components/ion-select.js +3 -2
  4. package/components/select-modal.js +6 -1
  5. package/dist/cjs/ion-range.cjs.entry.js +38 -79
  6. package/dist/cjs/ion-refresher_2.cjs.entry.js +32 -3
  7. package/dist/cjs/ion-select-modal.cjs.entry.js +5 -1
  8. package/dist/cjs/ion-select_3.cjs.entry.js +3 -2
  9. package/dist/cjs/ionic.cjs.js +1 -1
  10. package/dist/cjs/loader.cjs.js +1 -1
  11. package/dist/collection/components/range/range.js +42 -99
  12. package/dist/collection/components/refresher/refresher.js +70 -4
  13. package/dist/collection/components/select/select.js +3 -2
  14. package/dist/collection/components/select-modal/select-modal.js +25 -1
  15. package/dist/docs.json +83 -129
  16. package/dist/esm/ion-range.entry.js +38 -79
  17. package/dist/esm/ion-refresher_2.entry.js +32 -3
  18. package/dist/esm/ion-select-modal.entry.js +5 -1
  19. package/dist/esm/ion-select_3.entry.js +3 -2
  20. package/dist/esm/ionic.js +1 -1
  21. package/dist/esm/loader.js +1 -1
  22. package/dist/html.html-data.json +5 -1
  23. package/dist/ionic/ionic.esm.js +1 -1
  24. package/dist/ionic/p-012212e4.entry.js +4 -0
  25. package/dist/ionic/p-88367362.entry.js +4 -0
  26. package/dist/ionic/p-90f2d3ff.entry.js +4 -0
  27. package/dist/ionic/p-d2489bf2.entry.js +4 -0
  28. package/dist/types/components/range/range-interface.d.ts +0 -1
  29. package/dist/types/components/range/range.d.ts +4 -20
  30. package/dist/types/components/refresher/refresher-interface.d.ts +7 -0
  31. package/dist/types/components/refresher/refresher.d.ts +16 -3
  32. package/dist/types/components/select-modal/select-modal.d.ts +4 -0
  33. package/dist/types/components.d.ts +26 -5
  34. package/dist/types/interface.d.ts +1 -1
  35. package/hydrate/index.js +83 -105
  36. package/hydrate/index.mjs +83 -105
  37. package/package.json +1 -1
  38. package/dist/ionic/p-02d76786.entry.js +0 -4
  39. package/dist/ionic/p-639dd543.entry.js +0 -4
  40. package/dist/ionic/p-73ecefff.entry.js +0 -4
  41. package/dist/ionic/p-eb024a5b.entry.js +0 -4
package/hydrate/index.mjs CHANGED
@@ -28715,28 +28715,13 @@ const rangeMdCss = ":host{--knob-handle-size:calc(var(--knob-size) * 2);display:
28715
28715
  * @slot start - Content is placed to the left of the range slider in LTR, and to the right in RTL.
28716
28716
  * @slot end - Content is placed to the right of the range slider in LTR, and to the left in RTL.
28717
28717
  *
28718
- * @part label - The label text describing the range.
28719
28718
  * @part tick - An inactive tick mark.
28720
28719
  * @part tick-active - An active tick mark.
28720
+ * @part pin - The counter that appears above a knob.
28721
+ * @part knob - The handle that is used to drag the range.
28721
28722
  * @part bar - The inactive part of the bar.
28722
28723
  * @part bar-active - The active part of the bar.
28723
- * @part knob-handle - The container element that wraps the knob and handles drag interactions.
28724
- * @part knob-handle-a - The container element for the first knob. Only available when `dualKnobs` is `true`.
28725
- * @part knob-handle-b - The container element for the second knob. Only available when `dualKnobs` is `true`.
28726
- * @part knob-handle-lower - The container element for the lower knob. Only available when `dualKnobs` is `true`.
28727
- * @part knob-handle-upper - The container element for the upper knob. Only available when `dualKnobs` is `true`.
28728
- * @part pin - The counter that appears above a knob.
28729
- * @part pin-a - The counter that appears above the first knob. Only available when `dualKnobs` is `true`.
28730
- * @part pin-b - The counter that appears above the second knob. Only available when `dualKnobs` is `true`.
28731
- * @part pin-lower - The counter that appears above the lower knob. Only available when `dualKnobs` is `true`.
28732
- * @part pin-upper - The counter that appears above the upper knob. Only available when `dualKnobs` is `true`.
28733
- * @part knob - The visual knob element that appears on the range track.
28734
- * @part knob-a - The visual knob element for the first knob. Only available when `dualKnobs` is `true`.
28735
- * @part knob-b - The visual knob element for the second knob. Only available when `dualKnobs` is `true`.
28736
- * @part knob-lower - The visual knob element for the lower knob. Only available when `dualKnobs` is `true`.
28737
- * @part knob-upper - The visual knob element for the upper knob. Only available when `dualKnobs` is `true`.
28738
- * @part pressed - Added to the knob-handle, knob, and pin that is currently being pressed to drag. Only one set has this part at a time.
28739
- * @part focused - Added to the knob-handle, knob, and pin that currently has focus. Only one set has this part at a time.
28724
+ * @part label - The label text describing the range.
28740
28725
  */
28741
28726
  class Range {
28742
28727
  constructor(hostRef) {
@@ -28754,7 +28739,6 @@ class Range {
28754
28739
  this.inheritedAttributes = {};
28755
28740
  this.contentEl = null;
28756
28741
  this.initialContentScrollY = true;
28757
- this.focusFromPointer = false;
28758
28742
  this.ratioA = 0;
28759
28743
  this.ratioB = 0;
28760
28744
  /**
@@ -28886,7 +28870,6 @@ class Range {
28886
28870
  this.onBlur = () => {
28887
28871
  if (this.hasFocus) {
28888
28872
  this.hasFocus = false;
28889
- this.focusedKnob = undefined;
28890
28873
  this.ionBlur.emit();
28891
28874
  }
28892
28875
  };
@@ -28897,20 +28880,21 @@ class Range {
28897
28880
  }
28898
28881
  };
28899
28882
  this.onKnobFocus = (knob) => {
28900
- // Clicking focuses the range which is needed for the keyboard,
28901
- // but we only want to add the ion-focused class when focused via Tab.
28902
- if (!this.focusFromPointer) {
28903
- this.focusedKnob = knob;
28904
- }
28905
- else {
28906
- this.focusFromPointer = false;
28907
- this.focusedKnob = undefined;
28908
- }
28909
- // If the knob was not already focused, emit the focus event
28910
28883
  if (!this.hasFocus) {
28911
28884
  this.hasFocus = true;
28912
28885
  this.ionFocus.emit();
28913
28886
  }
28887
+ // Manually manage ion-focused class for dual knobs
28888
+ if (this.dualKnobs && this.el.shadowRoot) {
28889
+ const knobA = this.el.shadowRoot.querySelector('.range-knob-a');
28890
+ const knobB = this.el.shadowRoot.querySelector('.range-knob-b');
28891
+ // Remove ion-focused from both knobs first
28892
+ knobA === null || knobA === void 0 ? void 0 : knobA.classList.remove('ion-focused');
28893
+ knobB === null || knobB === void 0 ? void 0 : knobB.classList.remove('ion-focused');
28894
+ // Add ion-focused only to the focused knob
28895
+ const focusedKnobEl = knob === 'A' ? knobA : knobB;
28896
+ focusedKnobEl === null || focusedKnobEl === void 0 ? void 0 : focusedKnobEl.classList.add('ion-focused');
28897
+ }
28914
28898
  };
28915
28899
  this.onKnobBlur = () => {
28916
28900
  // Check if focus is moving to another knob within the same range
@@ -28922,9 +28906,15 @@ class Range {
28922
28906
  if (!isStillFocusedOnKnob) {
28923
28907
  if (this.hasFocus) {
28924
28908
  this.hasFocus = false;
28925
- this.focusedKnob = undefined;
28926
28909
  this.ionBlur.emit();
28927
28910
  }
28911
+ // Remove ion-focused from both knobs when focus leaves the range
28912
+ if (this.dualKnobs && this.el.shadowRoot) {
28913
+ const knobA = this.el.shadowRoot.querySelector('.range-knob-a');
28914
+ const knobB = this.el.shadowRoot.querySelector('.range-knob-b');
28915
+ knobA === null || knobA === void 0 ? void 0 : knobA.classList.remove('ion-focused');
28916
+ knobB === null || knobB === void 0 ? void 0 : knobB.classList.remove('ion-focused');
28917
+ }
28928
28918
  }
28929
28919
  }, 0);
28930
28920
  };
@@ -29181,6 +29171,7 @@ class Range {
29181
29171
  ratio = 1 - ratio;
29182
29172
  }
29183
29173
  this.pressedKnob = !this.dualKnobs || Math.abs(this.ratioA - ratio) < Math.abs(this.ratioB - ratio) ? 'A' : 'B';
29174
+ this.setFocus(this.pressedKnob);
29184
29175
  }
29185
29176
  get valA() {
29186
29177
  return ratioToValue(this.ratioA, this.min, this.max, this.step);
@@ -29207,23 +29198,9 @@ class Range {
29207
29198
  updateRatio() {
29208
29199
  const value = this.getValue();
29209
29200
  const { min, max } = this;
29210
- /**
29211
- * For dual knobs, value gives lower/upper but not which is A vs B.
29212
- * Assign (lowerRatio, upperRatio) to (ratioA, ratioB) in the way that
29213
- * minimizes change from the current ratios so the knobs don't swap.
29214
- */
29215
29201
  if (this.dualKnobs) {
29216
- const lowerRatio = valueToRatio(value.lower, min, max);
29217
- const upperRatio = valueToRatio(value.upper, min, max);
29218
- if (Math.abs(this.ratioA - lowerRatio) + Math.abs(this.ratioB - upperRatio) <=
29219
- Math.abs(this.ratioA - upperRatio) + Math.abs(this.ratioB - lowerRatio)) {
29220
- this.ratioA = lowerRatio;
29221
- this.ratioB = upperRatio;
29222
- }
29223
- else {
29224
- this.ratioA = upperRatio;
29225
- this.ratioB = lowerRatio;
29226
- }
29202
+ this.ratioA = valueToRatio(value.lower, min, max);
29203
+ this.ratioB = valueToRatio(value.upper, min, max);
29227
29204
  }
29228
29205
  else {
29229
29206
  this.ratioA = valueToRatio(value, min, max);
@@ -29240,6 +29217,14 @@ class Range {
29240
29217
  };
29241
29218
  this.noUpdate = false;
29242
29219
  }
29220
+ setFocus(knob) {
29221
+ if (this.el.shadowRoot) {
29222
+ const knobEl = this.el.shadowRoot.querySelector(knob === 'A' ? '.range-knob-a' : '.range-knob-b');
29223
+ if (knobEl) {
29224
+ knobEl.focus();
29225
+ }
29226
+ }
29227
+ }
29243
29228
  /**
29244
29229
  * Returns true if content was passed to the "start" slot
29245
29230
  */
@@ -29257,7 +29242,7 @@ class Range {
29257
29242
  }
29258
29243
  renderRangeSlider() {
29259
29244
  var _a;
29260
- const { min, max, step, handleKeyboard, focusedKnob, pressedKnob, disabled, pin, ratioLower, ratioUpper, pinFormatter, inheritedAttributes, } = this;
29245
+ const { min, max, step, handleKeyboard, pressedKnob, disabled, pin, ratioLower, ratioUpper, pinFormatter, inheritedAttributes, } = this;
29261
29246
  let barStart = `${ratioLower * 100}%`;
29262
29247
  let barEnd = `${100 - ratioUpper * 100}%`;
29263
29248
  const rtl = isRTL$1(this.el);
@@ -29317,9 +29302,7 @@ class Range {
29317
29302
  ticks.push(tick);
29318
29303
  }
29319
29304
  }
29320
- return (hAsync("div", { class: "range-slider", ref: (rangeEl) => (this.rangeSlider = rangeEl), onPointerDown: () => {
29321
- this.focusFromPointer = true;
29322
- },
29305
+ return (hAsync("div", { class: "range-slider", ref: (rangeEl) => (this.rangeSlider = rangeEl),
29323
29306
  /**
29324
29307
  * Since the gesture has a threshold, the value
29325
29308
  * won't change until the user has dragged past
@@ -29332,7 +29315,6 @@ class Range {
29332
29315
  * we need to listen for the "pointerUp" event.
29333
29316
  */
29334
29317
  onPointerUp: (ev) => {
29335
- this.focusFromPointer = false;
29336
29318
  /**
29337
29319
  * If the user drags the knob on the web
29338
29320
  * version (does not occur on mobile),
@@ -29358,10 +29340,7 @@ class Range {
29358
29340
  'has-ticks': ticks.length > 0,
29359
29341
  }, role: "presentation", style: barStyle, part: "bar-active" })), renderKnob(rtl, {
29360
29342
  knob: 'A',
29361
- position: this.dualKnobs ? (this.ratioA <= this.ratioB ? 'lower' : 'upper') : 'lower',
29362
- dualKnobs: this.dualKnobs,
29363
29343
  pressed: pressedKnob === 'A',
29364
- focused: focusedKnob === 'A',
29365
29344
  value: this.valA,
29366
29345
  ratio: this.ratioA,
29367
29346
  pin,
@@ -29376,10 +29355,7 @@ class Range {
29376
29355
  }), this.dualKnobs &&
29377
29356
  renderKnob(rtl, {
29378
29357
  knob: 'B',
29379
- position: this.ratioB <= this.ratioA ? 'lower' : 'upper',
29380
- dualKnobs: this.dualKnobs,
29381
29358
  pressed: pressedKnob === 'B',
29382
- focused: focusedKnob === 'B',
29383
29359
  value: this.valB,
29384
29360
  ratio: this.ratioB,
29385
29361
  pin,
@@ -29416,11 +29392,10 @@ class Range {
29416
29392
  const valueAtMin = dualKnobs ? this.valA === min || this.valB === min : this.valA === min;
29417
29393
  const valueAtMax = dualKnobs ? this.valA === max || this.valB === max : this.valA === max;
29418
29394
  renderHiddenInput(true, el, this.name, JSON.stringify(this.getValue()), disabled);
29419
- return (hAsync(Host, { key: '6f3ac66d528c499f840afd31fa3958f2749c9ff5', onFocusin: this.onFocus, onFocusout: this.onBlur, id: rangeId, class: createColorClasses$1(this.color, {
29395
+ return (hAsync(Host, { key: 'ed646a42d51b8fe22012198c354cbcf5a389c108', onFocusin: this.onFocus, onFocusout: this.onBlur, id: rangeId, class: createColorClasses$1(this.color, {
29420
29396
  [mode]: true,
29421
29397
  'in-item': inItem,
29422
29398
  'range-disabled': disabled,
29423
- 'range-dual-knobs': dualKnobs,
29424
29399
  'range-pressed': pressedKnob !== undefined,
29425
29400
  'range-has-pin': pin,
29426
29401
  [`range-label-placement-${labelPlacement}`]: true,
@@ -29428,10 +29403,10 @@ class Range {
29428
29403
  'range-item-end-adjustment': needsEndAdjustment,
29429
29404
  'range-value-min': valueAtMin,
29430
29405
  'range-value-max': valueAtMax,
29431
- }) }, hAsync("label", { key: 'a33e928dc37228bd4e1c4d3f804a7bb49d484088', class: "range-wrapper", id: "range-label" }, hAsync("div", { key: '5d4b885fd1a87621734244701838f86d5145b914', class: {
29406
+ }) }, hAsync("label", { key: '3083e4f2a624e3b268396acb4415f7c6ac44d851', class: "range-wrapper", id: "range-label" }, hAsync("div", { key: '47b92f94d2a0381dd7c5cd3dda54ed2942096715', class: {
29432
29407
  'label-text-wrapper': true,
29433
29408
  'label-text-wrapper-hidden': !hasLabel,
29434
- }, part: "label" }, label !== undefined ? hAsync("div", { class: "label-text" }, label) : hAsync("slot", { name: "label" })), hAsync("div", { key: '335a10bdb191a179c426ecba3541adada6d6aeb8', class: "native-wrapper" }, hAsync("slot", { key: '57dc846d33d0e1b1f4f18fc8553dc7fa2cca70bf', name: "start" }), this.renderRangeSlider(), hAsync("slot", { key: '57f85044b4f507015d905a73dca9d13a224560b1', name: "end" })))));
29409
+ }, part: "label" }, label !== undefined ? hAsync("div", { class: "label-text" }, label) : hAsync("slot", { name: "label" })), hAsync("div", { key: '5341da8d19eb29091df680978a0e20cc8f2eec65', class: "native-wrapper" }, hAsync("slot", { key: '09f1437078032676695442d8c827a16faa7dffe2', name: "start" }), this.renderRangeSlider(), hAsync("slot", { key: '02b7781970ea4d44f10b5f4627a2ca36eca45f85', name: "end" })))));
29435
29410
  }
29436
29411
  get el() { return getElement(this); }
29437
29412
  static get watchers() { return {
@@ -29469,15 +29444,14 @@ class Range {
29469
29444
  "labelPlacement": [1, "label-placement"],
29470
29445
  "ratioA": [32],
29471
29446
  "ratioB": [32],
29472
- "pressedKnob": [32],
29473
- "focusedKnob": [32]
29447
+ "pressedKnob": [32]
29474
29448
  },
29475
29449
  "$listeners$": undefined,
29476
29450
  "$lazyBundleId$": "-",
29477
29451
  "$attrsToReflect$": [["color", "color"]]
29478
29452
  }; }
29479
29453
  }
29480
- const renderKnob = (rtl, { knob, position, dualKnobs, value, ratio, min, max, disabled, pressed, focused, pin, handleKeyboard, pinFormatter, inheritedAttributes, onKnobFocus, onKnobBlur, }) => {
29454
+ const renderKnob = (rtl, { knob, value, ratio, min, max, disabled, pressed, pin, handleKeyboard, pinFormatter, inheritedAttributes, onKnobFocus, onKnobBlur, }) => {
29481
29455
  const start = rtl ? 'right' : 'left';
29482
29456
  const knobStyle = () => {
29483
29457
  const style = {};
@@ -29500,45 +29474,14 @@ const renderKnob = (rtl, { knob, position, dualKnobs, value, ratio, min, max, di
29500
29474
  }
29501
29475
  }, onFocus: () => onKnobFocus(knob), onBlur: onKnobBlur, class: {
29502
29476
  'range-knob-handle': true,
29503
- 'range-knob-handle-a': knob === 'A',
29504
- 'range-knob-handle-b': knob === 'B',
29477
+ 'range-knob-a': knob === 'A',
29478
+ 'range-knob-b': knob === 'B',
29505
29479
  'range-knob-pressed': pressed,
29506
29480
  'range-knob-min': value === min,
29507
29481
  'range-knob-max': value === max,
29508
29482
  'ion-activatable': true,
29509
29483
  'ion-focusable': true,
29510
- 'ion-focused': focused,
29511
- }, part: [
29512
- 'knob-handle',
29513
- dualKnobs && knob === 'A' && 'knob-handle-a',
29514
- dualKnobs && knob === 'B' && 'knob-handle-b',
29515
- dualKnobs && position === 'lower' && 'knob-handle-lower',
29516
- dualKnobs && position === 'upper' && 'knob-handle-upper',
29517
- pressed && 'pressed',
29518
- focused && 'focused',
29519
- ]
29520
- .filter(Boolean)
29521
- .join(' '), style: knobStyle(), role: "slider", tabindex: disabled ? -1 : 0, "aria-label": ariaLabel !== undefined ? ariaLabel : null, "aria-labelledby": ariaLabel === undefined ? 'range-label' : null, "aria-valuemin": min, "aria-valuemax": max, "aria-disabled": disabled ? 'true' : null, "aria-valuenow": value }, pin && (hAsync("div", { class: "range-pin", role: "presentation", part: [
29522
- 'pin',
29523
- dualKnobs && knob === 'A' && 'pin-a',
29524
- dualKnobs && knob === 'B' && 'pin-b',
29525
- dualKnobs && position === 'lower' && 'pin-lower',
29526
- dualKnobs && position === 'upper' && 'pin-upper',
29527
- pressed && 'pressed',
29528
- focused && 'focused',
29529
- ]
29530
- .filter(Boolean)
29531
- .join(' ') }, pinFormatter(value))), hAsync("div", { class: "range-knob", role: "presentation", part: [
29532
- 'knob',
29533
- dualKnobs && knob === 'A' && 'knob-a',
29534
- dualKnobs && knob === 'B' && 'knob-b',
29535
- dualKnobs && position === 'lower' && 'knob-lower',
29536
- dualKnobs && position === 'upper' && 'knob-upper',
29537
- pressed && 'pressed',
29538
- focused && 'focused',
29539
- ]
29540
- .filter(Boolean)
29541
- .join(' ') })));
29484
+ }, style: knobStyle(), role: "slider", tabindex: disabled ? -1 : 0, "aria-label": ariaLabel !== undefined ? ariaLabel : null, "aria-labelledby": ariaLabel === undefined ? 'range-label' : null, "aria-valuemin": min, "aria-valuemax": max, "aria-disabled": disabled ? 'true' : null, "aria-valuenow": value }, pin && (hAsync("div", { class: "range-pin", role: "presentation", part: "pin" }, pinFormatter(value))), hAsync("div", { class: "range-knob", role: "presentation", part: "knob" })));
29542
29485
  };
29543
29486
  const ratioToValue = (ratio, min, max, step) => {
29544
29487
  let value = (max - min) * ratio;
@@ -29755,6 +29698,8 @@ class Refresher {
29755
29698
  this.ionRefresh = createEvent(this, "ionRefresh", 7);
29756
29699
  this.ionPull = createEvent(this, "ionPull", 7);
29757
29700
  this.ionStart = createEvent(this, "ionStart", 7);
29701
+ this.ionPullStart = createEvent(this, "ionPullStart", 7);
29702
+ this.ionPullEnd = createEvent(this, "ionPullEnd", 7);
29758
29703
  this.appliedStyles = false;
29759
29704
  this.didStart = false;
29760
29705
  this.progress = 0;
@@ -29809,8 +29754,8 @@ class Refresher {
29809
29754
  * than `1`. The default value is `1` which is equal to the speed of the cursor.
29810
29755
  * If a negative value is passed in, the factor will be `1` instead.
29811
29756
  *
29812
- * For example: If the value passed is `1.2` and the content is dragged by
29813
- * `10` pixels, instead of `10` pixels the content will be pulled by `12` pixels
29757
+ * For example, If the value passed is `1.2` and the content is dragged by
29758
+ * `10` pixels, instead of `10` pixels, the content will be pulled by `12` pixels
29814
29759
  * (an increase of 20 percent). If the value passed is `0.8`, the dragged amount
29815
29760
  * will be `8` pixels, less than the amount the cursor has moved.
29816
29761
  *
@@ -29860,6 +29805,9 @@ class Refresher {
29860
29805
  this.animations = [];
29861
29806
  this.progress = 0;
29862
29807
  this.state = 1 /* RefresherState.Inactive */;
29808
+ this.ionPullEnd.emit({
29809
+ reason: state === 32 /* RefresherState.Completing */ ? 'complete' : 'cancel',
29810
+ });
29863
29811
  }
29864
29812
  async setupiOSNativeRefresher(pullingSpinner, refreshingSpinner) {
29865
29813
  this.elementToTransform = this.scrollEl;
@@ -29892,6 +29840,7 @@ class Refresher {
29892
29840
  if (!this.didStart) {
29893
29841
  this.didStart = true;
29894
29842
  this.ionStart.emit();
29843
+ this.ionPullStart.emit();
29895
29844
  }
29896
29845
  // emit "pulling" on every move
29897
29846
  if (this.pointerDown) {
@@ -29967,6 +29916,7 @@ class Refresher {
29967
29916
  this.lastVelocityY = ev.velocityY;
29968
29917
  },
29969
29918
  onEnd: () => {
29919
+ const hadStarted = this.didStart;
29970
29920
  this.pointerDown = false;
29971
29921
  this.didStart = false;
29972
29922
  if (this.needsCompletion) {
@@ -29976,6 +29926,13 @@ class Refresher {
29976
29926
  else if (this.didRefresh) {
29977
29927
  readTask(() => translateElement(this.elementToTransform, `${this.el.clientHeight}px`));
29978
29928
  }
29929
+ else if (hadStarted) {
29930
+ /**
29931
+ * User started pulling but released before reaching the refresh threshold.
29932
+ * Emit ionPullEnd to complete the event pair.
29933
+ */
29934
+ this.ionPullEnd.emit({ reason: 'cancel' });
29935
+ }
29979
29936
  },
29980
29937
  });
29981
29938
  this.disabledChanged();
@@ -30022,6 +29979,7 @@ class Refresher {
30022
29979
  ev.data.animation = animation;
30023
29980
  animation.progressStart(false, 0);
30024
29981
  this.ionStart.emit();
29982
+ this.ionPullStart.emit();
30025
29983
  this.animations.push(animation);
30026
29984
  return;
30027
29985
  }
@@ -30044,6 +30002,7 @@ class Refresher {
30044
30002
  this.animations = [];
30045
30003
  this.gesture.enable(true);
30046
30004
  this.state = 1 /* RefresherState.Inactive */;
30005
+ this.ionPullEnd.emit({ reason: 'cancel' });
30047
30006
  });
30048
30007
  return;
30049
30008
  }
@@ -30288,6 +30247,7 @@ class Refresher {
30288
30247
  if (!this.didStart) {
30289
30248
  this.didStart = true;
30290
30249
  this.ionStart.emit();
30250
+ this.ionPullStart.emit();
30291
30251
  }
30292
30252
  // emit "pulling" on every move
30293
30253
  this.ionPull.emit();
@@ -30331,6 +30291,15 @@ class Refresher {
30331
30291
  * available right away.
30332
30292
  */
30333
30293
  this.restoreOverflowStyle();
30294
+ /**
30295
+ * If ionPullStart was emitted, we need to emit ionPullEnd
30296
+ * even though the gesture was aborted before reaching the
30297
+ * pulling threshold.
30298
+ */
30299
+ if (this.didStart) {
30300
+ this.didStart = false;
30301
+ this.ionPullEnd.emit({ reason: 'cancel' });
30302
+ }
30334
30303
  }
30335
30304
  }
30336
30305
  beginRefresh() {
@@ -30377,6 +30346,9 @@ class Refresher {
30377
30346
  if (this.contentFullscreen && this.backgroundContentEl) {
30378
30347
  (_a = this.backgroundContentEl) === null || _a === void 0 ? void 0 : _a.style.removeProperty('--offset-top');
30379
30348
  }
30349
+ this.ionPullEnd.emit({
30350
+ reason: state === 32 /* RefresherState.Completing */ ? 'complete' : 'cancel',
30351
+ });
30380
30352
  }, 600);
30381
30353
  // reset the styles on the scroll element
30382
30354
  // set that the refresh is actively cancelling/completing
@@ -30430,7 +30402,7 @@ class Refresher {
30430
30402
  }
30431
30403
  render() {
30432
30404
  const mode = getIonMode$1(this);
30433
- return (hAsync(Host, { key: '2d1bd880877b698604542ab2d602d38b9504d975', slot: "fixed", class: {
30405
+ return (hAsync(Host, { key: 'bed0c2f44c32ecac24b7d8326ac7c7ef1d12c44f', slot: "fixed", class: {
30434
30406
  [mode]: true,
30435
30407
  // Used internally for styling
30436
30408
  [`refresher-${mode}`]: true,
@@ -34162,6 +34134,7 @@ class Select {
34162
34134
  const mode = getIonMode$1(this);
34163
34135
  const modalOpts = Object.assign(Object.assign({}, interfaceOptions), { mode, cssClass: ['select-modal', interfaceOptions.cssClass], component: 'ion-select-modal', componentProps: {
34164
34136
  header: interfaceOptions.header,
34137
+ cancelText: this.cancelText,
34165
34138
  multiple,
34166
34139
  value,
34167
34140
  options: this.createOverlaySelectOptions(this.childOpts, value),
@@ -34411,7 +34384,7 @@ class Select {
34411
34384
  * TODO(FW-5592): Remove hasStartEndSlots condition
34412
34385
  */
34413
34386
  const labelShouldFloat = labelPlacement === 'stacked' || (labelPlacement === 'floating' && (hasValue || isExpanded || hasStartEndSlots));
34414
- return (hAsync(Host, { key: 'd8026835993d0e6dce747098f741a06ae4e4f54d', onClick: this.onClick, class: createColorClasses$1(this.color, {
34387
+ return (hAsync(Host, { key: 'b7fa907f8fbc54fd63e2d07a9bb5156d94fd5057', onClick: this.onClick, class: createColorClasses$1(this.color, {
34415
34388
  [mode]: true,
34416
34389
  'in-item': inItem,
34417
34390
  'in-item-color': hostContext('ion-item.ion-color', el),
@@ -34429,7 +34402,7 @@ class Select {
34429
34402
  [`select-justify-${justify}`]: justifyEnabled,
34430
34403
  [`select-shape-${shape}`]: shape !== undefined,
34431
34404
  [`select-label-placement-${labelPlacement}`]: true,
34432
- }) }, hAsync("label", { key: 'fcfb40209d6d07d49c7fdca4884b31abf6ac2567', class: "select-wrapper", id: "select-label", onClick: this.onLabelClick }, this.renderLabelContainer(), hAsync("div", { key: 'f191664f2290c3890bde1156157c83a6ff17dbe2', class: "select-wrapper-inner" }, hAsync("slot", { key: '317a28d1115b4214f291e228ce0fe6fc782e57d5', name: "start" }), hAsync("div", { key: 'db68e18abd5ca3a1023d7c7b58bf89893ae18073', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), hAsync("slot", { key: '4274e042267c2234a198b0f65c89477898d08130', name: "end" }), !hasFloatingOrStackedLabel && this.renderSelectIcon()), hasFloatingOrStackedLabel && this.renderSelectIcon(), shouldRenderHighlight && hAsync("div", { key: '2e2eb1ee2b2791e0683d9afb186fde6e938ca59c', class: "select-highlight" })), this.renderBottomContent()));
34405
+ }) }, hAsync("label", { key: '11137e6a8b0374e93923ddb5a4629972ded5f43c', class: "select-wrapper", id: "select-label", onClick: this.onLabelClick }, this.renderLabelContainer(), hAsync("div", { key: '99e3c09b5e6c2e7be493ed5834f991fffe45cfff', class: "select-wrapper-inner" }, hAsync("slot", { key: '740f0e5a913cb0209d5acae31c33a6ed8f672dfc', name: "start" }), hAsync("div", { key: 'b20e33c8b60915a5194948fcf8e22d7789f0b050', class: "native-wrapper", ref: (el) => (this.nativeWrapperEl = el), part: "container" }, this.renderSelectText(), this.renderListbox()), hAsync("slot", { key: '0199f338185d5fa2cdd977bb20516746bd9ddad5', name: "end" }), !hasFloatingOrStackedLabel && this.renderSelectIcon()), hasFloatingOrStackedLabel && this.renderSelectIcon(), shouldRenderHighlight && hAsync("div", { key: '3b54de893cc8fc66df8588cee22e30d6f10850b3', class: "select-highlight" })), this.renderBottomContent()));
34433
34406
  }
34434
34407
  get el() { return getElement(this); }
34435
34408
  static get watchers() { return {
@@ -34524,6 +34497,10 @@ const selectModalMdCss = ".sc-ion-select-modal-md-h{height:100%}ion-list.sc-ion-
34524
34497
  class SelectModal {
34525
34498
  constructor(hostRef) {
34526
34499
  registerInstance(this, hostRef);
34500
+ /**
34501
+ * The text to display on the cancel button.
34502
+ */
34503
+ this.cancelText = 'Close';
34527
34504
  this.options = [];
34528
34505
  }
34529
34506
  closeModal() {
@@ -34590,7 +34567,7 @@ class SelectModal {
34590
34567
  } }, option.text))));
34591
34568
  }
34592
34569
  render() {
34593
- return (hAsync(Host, { key: 'b6c0dec240b2e41985b15fdf4e5a6d3a145c1567', class: getIonMode$1(this) }, hAsync("ion-header", { key: 'cd177e85ee0f62a60a3a708342d6ab6eb19a44dc' }, hAsync("ion-toolbar", { key: 'aee8222a5a4daa540ad202b2e4cac1ef93d9558c' }, this.header !== undefined && hAsync("ion-title", { key: '5f8fecc764d97bf840d3d4cfddeeccd118ab4436' }, this.header), hAsync("ion-buttons", { key: '919033950d7c2b0101f96a9c9698219de9f568ea', slot: "end" }, hAsync("ion-button", { key: '34b571cab6dced4bde555a077a21e91800829931', onClick: () => this.closeModal() }, "Close")))), hAsync("ion-content", { key: '3c9153d26ba7a5a03d3b20fcd628d0c3031661a7' }, hAsync("ion-list", { key: 'e00b222c071bc97c82ad1bba4db95a8a5c43ed6d' }, this.multiple === true ? this.renderCheckboxOptions() : this.renderRadioOptions()))));
34570
+ return (hAsync(Host, { key: '59ba79ffdbb69befe8e13745450c1071a1fe8c6c', class: getIonMode$1(this) }, hAsync("ion-header", { key: 'fa4d08ee43eec4b9add09d9ffabcba9ed13dd4af' }, hAsync("ion-toolbar", { key: 'b5e26cf092297c51c1dba3ce7963e7b03420393b' }, this.header !== undefined && hAsync("ion-title", { key: 'a8a93cdea4d119d3a17d8cef3878b8a1daa86e26' }, this.header), hAsync("ion-buttons", { key: 'bbc656713b41ef09099ed466f93a9cfbdaceecc1', slot: "end" }, hAsync("ion-button", { key: '80b8751fe4c96e06b620a0b9d17b2d9b3da2faa5', onClick: () => this.closeModal() }, this.cancelText)))), hAsync("ion-content", { key: 'a251fc00ae4cc7e6b3abe13caa10d95bb515558e' }, hAsync("ion-list", { key: 'bcaf38d6d91accfabb4a9d26783bc0e4801abe3c' }, this.multiple === true ? this.renderCheckboxOptions() : this.renderRadioOptions()))));
34594
34571
  }
34595
34572
  get el() { return getElement(this); }
34596
34573
  static get style() { return {
@@ -34603,6 +34580,7 @@ class SelectModal {
34603
34580
  "$tagName$": "ion-select-modal",
34604
34581
  "$members$": {
34605
34582
  "header": [1],
34583
+ "cancelText": [1, "cancel-text"],
34606
34584
  "multiple": [4],
34607
34585
  "options": [16]
34608
34586
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ionic/core",
3
- "version": "8.7.17-dev.11769813102.16c5bfac",
3
+ "version": "8.7.17-dev.11770319814.172b4f50",
4
4
  "description": "Base components for Ionic",
5
5
  "engines": {
6
6
  "node": ">= 16"
@@ -1,4 +0,0 @@
1
- /*!
2
- * (C) Ionic http://ionicframework.com - MIT License
3
- */
4
- import{r as o,h as i,i as e,d as c,g as t}from"./p-C8IsBmNU.js";import{b as n}from"./p-BFvmZNyx.js";import{s as a}from"./p-DdR6rpbR.js";import{g as r}from"./p-DiVJyqlX.js";import"./p-ZjP4CjeZ.js";import"./p-CTfR9YZG.js";import"./p-B0q1YL7N.js";import"./p-D-eFFUkA.js";import"./p-BTEOs1at.js";const s=class{constructor(i){o(this,i),this.options=[]}closeModal(){const o=this.el.closest("ion-modal");o&&o.dismiss()}findOptionFromEvent(o){const{options:i}=this;return i.find((i=>i.value===o.target.value))}getValues(o){const{multiple:i,options:e}=this;if(i)return e.filter((o=>o.checked)).map((o=>o.value));const c=o?this.findOptionFromEvent(o):null;return c?c.value:void 0}callOptionHandler(o){const i=this.findOptionFromEvent(o),e=this.getValues(o);(null==i?void 0:i.handler)&&a(i.handler,e)}setChecked(o){const{multiple:i}=this,e=this.findOptionFromEvent(o);i&&e&&(e.checked=o.detail.checked)}renderRadioOptions(){const o=this.options.filter((o=>o.checked)).map((o=>o.value))[0];return i("ion-radio-group",{value:o,onIonChange:o=>this.callOptionHandler(o)},this.options.map((e=>i("ion-item",{lines:"none",class:Object.assign({"item-radio-checked":e.value===o},r(e.cssClass))},i("ion-radio",{value:e.value,disabled:e.disabled,justify:"start",labelPlacement:"end",onClick:()=>this.closeModal(),onKeyUp:o=>{" "===o.key&&this.closeModal()}},e.text)))))}renderCheckboxOptions(){return this.options.map((o=>i("ion-item",{class:Object.assign({"item-checkbox-checked":o.checked},r(o.cssClass))},i("ion-checkbox",{value:o.value,disabled:o.disabled,checked:o.checked,justify:"start",labelPlacement:"end",onIonChange:o=>{this.setChecked(o),this.callOptionHandler(o),e(this)}},o.text))))}render(){return i(c,{key:"b6c0dec240b2e41985b15fdf4e5a6d3a145c1567",class:n(this)},i("ion-header",{key:"cd177e85ee0f62a60a3a708342d6ab6eb19a44dc"},i("ion-toolbar",{key:"aee8222a5a4daa540ad202b2e4cac1ef93d9558c"},void 0!==this.header&&i("ion-title",{key:"5f8fecc764d97bf840d3d4cfddeeccd118ab4436"},this.header),i("ion-buttons",{key:"919033950d7c2b0101f96a9c9698219de9f568ea",slot:"end"},i("ion-button",{key:"34b571cab6dced4bde555a077a21e91800829931",onClick:()=>this.closeModal()},"Close")))),i("ion-content",{key:"3c9153d26ba7a5a03d3b20fcd628d0c3031661a7"},i("ion-list",{key:"e00b222c071bc97c82ad1bba4db95a8a5c43ed6d"},!0===this.multiple?this.renderCheckboxOptions():this.renderRadioOptions())))}get el(){return t(this)}};s.style={ionic:'.sc-ion-select-modal-ionic-h{height:100%}ion-list.sc-ion-select-modal-ionic ion-radio.sc-ion-select-modal-ionic::part(container),ion-list.sc-ion-select-modal-ionic ion-radio.sc-ion-select-modal-ionic [part~="container"]{display:none}ion-list.sc-ion-select-modal-ionic ion-radio.sc-ion-select-modal-ionic::part(label),ion-list.sc-ion-select-modal-ionic ion-radio.sc-ion-select-modal-ionic [part~="label"]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-item.sc-ion-select-modal-ionic{--inner-border-width:0}.item-radio-checked.sc-ion-select-modal-ionic{--background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.08);--background-focused:var(--ion-color-primary, #0054e9);--background-focused-opacity:0.2;--background-hover:var(--ion-color-primary, #0054e9);--background-hover-opacity:0.12}.item-checkbox-checked.sc-ion-select-modal-ionic{--background-activated:var(--ion-item-color, var(--ion-text-color, #000));--background-focused:var(--ion-item-color, var(--ion-text-color, #000));--background-hover:var(--ion-item-color, var(--ion-text-color, #000));--color:var(--ion-color-primary, #0054e9)}',ios:'.sc-ion-select-modal-ios-h{height:100%}ion-item.sc-ion-select-modal-ios{--inner-padding-end:0}ion-radio.sc-ion-select-modal-ios::after{bottom:0;position:absolute;width:calc(100% - 0.9375rem - 16px);border-width:0px 0px 0.55px 0px;border-style:solid;border-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, var(--ion-background-color-step-250, #c8c7cc))));content:""}ion-radio.sc-ion-select-modal-ios::after{inset-inline-start:calc(0.9375rem + 16px)}',md:'.sc-ion-select-modal-md-h{height:100%}ion-list.sc-ion-select-modal-md ion-radio.sc-ion-select-modal-md::part(container),ion-list.sc-ion-select-modal-md ion-radio.sc-ion-select-modal-md [part~="container"]{display:none}ion-list.sc-ion-select-modal-md ion-radio.sc-ion-select-modal-md::part(label),ion-list.sc-ion-select-modal-md ion-radio.sc-ion-select-modal-md [part~="label"]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-item.sc-ion-select-modal-md{--inner-border-width:0}.item-radio-checked.sc-ion-select-modal-md{--background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.08);--background-focused:var(--ion-color-primary, #0054e9);--background-focused-opacity:0.2;--background-hover:var(--ion-color-primary, #0054e9);--background-hover-opacity:0.12}.item-checkbox-checked.sc-ion-select-modal-md{--background-activated:var(--ion-item-color, var(--ion-text-color, #000));--background-focused:var(--ion-item-color, var(--ion-text-color, #000));--background-hover:var(--ion-item-color, var(--ion-text-color, #000));--color:var(--ion-color-primary, #0054e9)}'};export{s as ion_select_modal}
@@ -1,4 +0,0 @@
1
- /*!
2
- * (C) Ionic http://ionicframework.com - MIT License
3
- */
4
- import{w as e,r,c as i,a as s,j as t,h as n,d as o,g as h,e as a}from"./p-C8IsBmNU.js";import{g as f}from"./p-hHmYLOfE.js";import{I as l,b as c,p,g as d}from"./p-CwgG81ZD.js";import{c as g,t as m,e as u,g as b,r as v}from"./p-CTfR9YZG.js";import{d as x,I as y}from"./p-CKvCXMs9.js";import{b as k}from"./p-BFvmZNyx.js";import{c as w}from"./p-DDb5r57F.js";import{E as j,a as C}from"./p-DbQ5QkTP.js";import{h as S,i as R}from"./p-DV3sJJW8.js";import{S as E}from"./p-D4RIp70E.js";import"./p-CIGNaXM1.js";import"./p-ZjP4CjeZ.js";const M=e=>{const r=e.querySelector("ion-spinner"),i=r.shadowRoot.querySelector("circle"),s=e.querySelector(".spinner-arrow-container"),t=e.querySelector(".arrow-container"),n=t?t.querySelector("ion-icon"):null,o=w().duration(1e3).easing("ease-out"),h=w().addElement(s).keyframes([{offset:0,opacity:"0.3"},{offset:.45,opacity:"0.3"},{offset:.55,opacity:"1"},{offset:1,opacity:"1"}]),a=w().addElement(i).keyframes([{offset:0,strokeDasharray:"1px, 200px"},{offset:.2,strokeDasharray:"1px, 200px"},{offset:.55,strokeDasharray:"100px, 200px"},{offset:1,strokeDasharray:"100px, 200px"}]),f=w().addElement(r).keyframes([{offset:0,transform:"rotate(-90deg)"},{offset:1,transform:"rotate(210deg)"}]);if(t&&n){const e=w().addElement(t).keyframes([{offset:0,transform:"rotate(0deg)"},{offset:.3,transform:"rotate(0deg)"},{offset:.55,transform:"rotate(280deg)"},{offset:1,transform:"rotate(400deg)"}]),r=w().addElement(n).keyframes([{offset:0,transform:"translateX(2px) scale(0)"},{offset:.3,transform:"translateX(2px) scale(0)"},{offset:.55,transform:"translateX(-1.5px) scale(1)"},{offset:1,transform:"translateX(-1.5px) scale(1)"}]);o.addAnimation([e,r])}return o.addAnimation([h,a,f])},N=(r,i,s=200)=>{if(!r)return Promise.resolve();const t=m(r,s);return e((()=>{r.style.setProperty("transition",`${s}ms all ease-out`),void 0===i?r.style.removeProperty("transform"):r.style.setProperty("transform",`translate3d(0px, ${i}, 0px)`)})),t},Y=()=>navigator.maxTouchPoints>0&&CSS.supports("background: -webkit-named-image(apple-pay-logo-black)"),D=async(e,r)=>{const i=e.querySelector("ion-refresher-content");if(!i)return Promise.resolve(!1);await new Promise((e=>g(i,e)));const s=e.querySelector("ion-refresher-content .refresher-pulling ion-spinner"),t=e.querySelector("ion-refresher-content .refresher-refreshing ion-spinner");return null!==s&&null!==t&&("ios"===r&&Y()||"md"===r)},T=class{constructor(e){r(this,e),this.ionRefresh=i(this,"ionRefresh",7),this.ionPull=i(this,"ionPull",7),this.ionStart=i(this,"ionStart",7),this.appliedStyles=!1,this.didStart=!1,this.progress=0,this.pointerDown=!1,this.needsCompletion=!1,this.didRefresh=!1,this.contentFullscreen=!1,this.lastVelocityY=0,this.animations=[],this.nativeRefresher=!1,this.state=1,this.pullMin=60,this.pullMax=this.pullMin+60,this.closeDuration="280ms",this.snapbackDuration="280ms",this.pullFactor=1,this.disabled=!1}disabledChanged(){this.gesture&&this.gesture.enable(!this.disabled)}async checkNativeRefresher(){const e=await D(this.el,k(this));if(e&&!this.nativeRefresher){const e=this.el.closest("ion-content");this.setupNativeRefresher(e)}else e||this.destroyNativeRefresher()}destroyNativeRefresher(){this.scrollEl&&this.scrollListenerCallback&&(this.scrollEl.removeEventListener("scroll",this.scrollListenerCallback),this.scrollListenerCallback=void 0),this.nativeRefresher=!1}async resetNativeRefresher(e,r){this.state=r,"ios"===k(this)?await N(e,void 0,300):await m(this.el.querySelector(".refresher-refreshing-icon"),200),this.didRefresh=!1,this.needsCompletion=!1,this.pointerDown=!1,this.animations.forEach((e=>e.destroy())),this.animations=[],this.progress=0,this.state=1}async setupiOSNativeRefresher(r,i){this.elementToTransform=this.scrollEl;const t=r.shadowRoot.querySelectorAll("svg");let n=.16*this.scrollEl.clientHeight;const o=t.length;e((()=>t.forEach((e=>e.style.setProperty("animation","none"))))),this.scrollListenerCallback=()=>{(this.pointerDown||1!==this.state)&&s((()=>{const r=this.scrollEl.scrollTop,s=this.el.clientHeight;if(r>0){if(8===this.state){const t=u(0,r/(.5*s),1);return void e((()=>{i.style.setProperty("opacity",(1-t).toString())}))}return}this.pointerDown&&(this.didStart||(this.didStart=!0,this.ionStart.emit()),this.pointerDown&&this.ionPull.emit());const h=this.didStart?30:0,a=this.progress=u(0,(Math.abs(r)-h)/n,1);if(8===this.state||1===a){if(this.pointerDown&&(f=i,l=this.lastVelocityY,e((()=>{f.style.setProperty("--refreshing-rotation-duration",l>=1?"0.5s":"2s"),f.style.setProperty("opacity","1")}))),!this.didRefresh){this.beginRefresh(),this.didRefresh=!0,x({style:y.Light});const e=document.activeElement;void 0!==(null==e?void 0:e.blur)&&e.blur(),this.pointerDown||N(this.elementToTransform,`${s}px`)}}else this.state=2,((r,i,s)=>{e((()=>{r.forEach(((e,r)=>{const t=r*(1/i),n=u(0,(s-t)/(1-t),1);e.style.setProperty("opacity",n.toString())}))}))})(t,o,a);var f,l}))},this.scrollEl.addEventListener("scroll",this.scrollListenerCallback),this.gesture=(await import("./p-Cl0B-RWe.js")).createGesture({el:this.scrollEl,gestureName:"refresher",gesturePriority:31,direction:"y",threshold:5,onStart:()=>{this.pointerDown=!0,this.didRefresh||N(this.elementToTransform,"0px"),0===n&&(n=.16*this.scrollEl.clientHeight)},onMove:e=>{this.lastVelocityY=e.velocityY},onEnd:()=>{this.pointerDown=!1,this.didStart=!1,this.needsCompletion?(this.resetNativeRefresher(this.elementToTransform,32),this.needsCompletion=!1):this.didRefresh&&s((()=>N(this.elementToTransform,`${this.el.clientHeight}px`)))}}),this.disabledChanged()}async setupMDNativeRefresher(r,i,s){const t=b(i).querySelector("circle"),n=this.el.querySelector("ion-refresher-content .refresher-pulling-icon"),o=b(s).querySelector("circle");null!==t&&null!==o&&e((()=>{t.style.setProperty("animation","none"),s.style.setProperty("animation-delay","-655ms"),o.style.setProperty("animation-delay","-655ms")})),this.gesture=(await import("./p-Cl0B-RWe.js")).createGesture({el:this.scrollEl,gestureName:"refresher",gesturePriority:31,direction:"y",threshold:5,canStart:()=>8!==this.state&&32!==this.state&&0===this.scrollEl.scrollTop,onStart:e=>{this.progress=0,e.data={animation:void 0,didStart:!1,cancelled:!1}},onMove:i=>{if(i.velocityY<0&&0===this.progress&&!i.data.didStart||i.data.cancelled)i.data.cancelled=!0;else{if(!i.data.didStart){i.data.didStart=!0,this.state=2;const{scrollEl:s}=this,t=s.matches(l)?"overflow":"--overflow";e((()=>s.style.setProperty(t,"hidden")));const o=(e=>{const r=e.previousElementSibling;return null!==r&&"ION-HEADER"===r.tagName?"translate":"scale"})(r),h=((e,r,i)=>"scale"===e?((e,r)=>{const i=r.clientHeight,s=w().addElement(e).keyframes([{offset:0,transform:`scale(0) translateY(-${i}px)`},{offset:1,transform:"scale(1) translateY(100px)"}]);return M(e).addAnimation([s])})(r,i):((e,r)=>{const i=r.clientHeight,s=w().addElement(e).keyframes([{offset:0,transform:`translateY(-${i}px)`},{offset:1,transform:"translateY(100px)"}]);return M(e).addAnimation([s])})(r,i))(o,n,this.el);return i.data.animation=h,h.progressStart(!1,0),this.ionStart.emit(),void this.animations.push(h)}this.progress=u(0,i.deltaY/180*.5,1),i.data.animation.progressStep(this.progress),this.ionPull.emit()}},onEnd:r=>{if(!r.data.didStart)return;this.gesture.enable(!1);const{scrollEl:i}=this,s=i.matches(l)?"overflow":"--overflow";if(e((()=>i.style.removeProperty(s))),this.progress<=.4)return void r.data.animation.progressEnd(0,this.progress,500).onFinish((()=>{this.animations.forEach((e=>e.destroy())),this.animations=[],this.gesture.enable(!0),this.state=1}));const t=f([0,0],[0,0],[1,1],[1,1],this.progress)[0],o=(e=>w().duration(125).addElement(e).fromTo("transform","translateY(var(--ion-pulling-refresher-translate, 100px))","translateY(0px)"))(n);this.animations.push(o),e((async()=>{n.style.setProperty("--ion-pulling-refresher-translate",100*t+"px"),r.data.animation.progressEnd(),await o.play(),this.beginRefresh(),r.data.animation.destroy(),this.gesture.enable(!0)}))}}),this.disabledChanged()}async setupNativeRefresher(e){if(this.scrollListenerCallback||!e||this.nativeRefresher||!this.scrollEl)return;this.setCss(0,"",!1,""),this.nativeRefresher=!0;const r=this.el.querySelector("ion-refresher-content .refresher-pulling ion-spinner"),i=this.el.querySelector("ion-refresher-content .refresher-refreshing ion-spinner");"ios"===k(this)?this.setupiOSNativeRefresher(r,i):this.setupMDNativeRefresher(e,r,i)}componentDidUpdate(){this.checkNativeRefresher()}async connectedCallback(){if("fixed"!==this.el.getAttribute("slot"))return void t('[ion-refresher] - Make sure you use: <ion-refresher slot="fixed">');const e=this.el.closest(c);e?g(e,(async()=>{const r=e.querySelector(l);this.scrollEl=await d(null!=r?r:e),this.backgroundContentEl=await e.getBackgroundElement(),this.contentFullscreen=e.fullscreen,await D(this.el,k(this))?this.setupNativeRefresher(e):(this.gesture=(await import("./p-Cl0B-RWe.js")).createGesture({el:e,gestureName:"refresher",gesturePriority:31,direction:"y",threshold:20,passive:!1,canStart:()=>this.canStart(),onStart:()=>this.onStart(),onMove:e=>this.onMove(e),onEnd:()=>this.onEnd()}),this.disabledChanged())})):p(this.el)}disconnectedCallback(){this.destroyNativeRefresher(),this.scrollEl=void 0,this.gesture&&(this.gesture.destroy(),this.gesture=void 0)}async complete(){this.nativeRefresher?(this.needsCompletion=!0,this.pointerDown||v((()=>v((()=>this.resetNativeRefresher(this.elementToTransform,32)))))):this.close(32,"120ms")}async cancel(){this.nativeRefresher?this.pointerDown||v((()=>v((()=>this.resetNativeRefresher(this.elementToTransform,16))))):this.close(16,"")}getProgress(){return Promise.resolve(this.progress)}canStart(){return!(!this.scrollEl||1!==this.state||this.scrollEl.scrollTop>0)}onStart(){this.progress=0,this.state=1,this.memoizeOverflowStyle(),this.contentFullscreen&&this.backgroundContentEl&&this.backgroundContentEl.style.setProperty("--offset-top","0px")}onMove(e){if(!this.scrollEl)return;const r=e.event;if(void 0!==r.touches&&r.touches.length>1)return;if(56&this.state)return;const i=Number.isNaN(this.pullFactor)||this.pullFactor<0?1:this.pullFactor,s=e.deltaY*i;if(s<=0)return this.progress=0,this.state=1,this.appliedStyles?void this.setCss(0,"",!1,""):void 0;if(1===this.state){if(this.scrollEl.scrollTop>0)return void(this.progress=0);this.state=2}if(r.cancelable&&r.preventDefault(),this.setCss(s,"0ms",!0,""),0===s)return void(this.progress=0);const t=this.pullMin;this.progress=s/t,this.didStart||(this.didStart=!0,this.ionStart.emit()),this.ionPull.emit(),s<t?this.state=2:s>this.pullMax?this.beginRefresh():this.state=4}onEnd(){4===this.state?this.beginRefresh():2===this.state?this.cancel():1===this.state&&this.restoreOverflowStyle()}beginRefresh(){this.state=8,this.setCss(this.pullMin,this.snapbackDuration,!0,"");const e=document.activeElement;void 0!==(null==e?void 0:e.blur)&&e.blur(),this.ionRefresh.emit({complete:this.complete.bind(this)})}close(e,r){setTimeout((()=>{var e;this.state=1,this.progress=0,this.didStart=!1,this.setCss(0,"0ms",!1,"",!0),this.contentFullscreen&&this.backgroundContentEl&&(null===(e=this.backgroundContentEl)||void 0===e||e.style.removeProperty("--offset-top"))}),600),this.state=e,this.setCss(0,this.closeDuration,!0,r)}setCss(r,i,s,t,n=!1){this.nativeRefresher||(this.appliedStyles=r>0,e((()=>{if(this.scrollEl&&this.backgroundContentEl){const e=this.scrollEl.style,n=this.backgroundContentEl.style;e.transform=n.transform=r>0?`translateY(${r}px) translateZ(0px)`:"",e.transitionDuration=n.transitionDuration=i,e.transitionDelay=n.transitionDelay=t,e.overflow=s?"hidden":""}n&&this.restoreOverflowStyle()})))}memoizeOverflowStyle(){if(this.scrollEl){const{overflow:e,overflowX:r,overflowY:i}=this.scrollEl.style;this.overflowStyles={overflow:null!=e?e:"",overflowX:null!=r?r:"",overflowY:null!=i?i:""}}}restoreOverflowStyle(){if(void 0!==this.overflowStyles&&void 0!==this.scrollEl){const{overflow:e,overflowX:r,overflowY:i}=this.overflowStyles;this.scrollEl.style.overflow=e,this.scrollEl.style.overflowX=r,this.scrollEl.style.overflowY=i,this.overflowStyles=void 0}}render(){const e=k(this);return n(o,{key:"2d1bd880877b698604542ab2d602d38b9504d975",slot:"fixed",class:{[e]:!0,[`refresher-${e}`]:!0,"refresher-native":this.nativeRefresher,"refresher-active":1!==this.state,"refresher-pulling":2===this.state,"refresher-ready":4===this.state,"refresher-refreshing":8===this.state,"refresher-cancelling":16===this.state,"refresher-completing":32===this.state}})}get el(){return h(this)}static get watchers(){return{disabled:["disabledChanged"]}}};T.style={ios:"ion-refresher{top:0;display:none;position:absolute;width:100%;height:60px;pointer-events:none;z-index:-1}ion-refresher{inset-inline-start:0}ion-refresher.refresher-active{display:block}ion-refresher-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;height:100%}.refresher-pulling,.refresher-refreshing{display:none;width:100%}.refresher-pulling-icon,.refresher-refreshing-icon{-webkit-transform-origin:center;transform-origin:center;-webkit-transition:200ms;transition:200ms;font-size:30px;text-align:center}:host-context([dir=rtl]) .refresher-pulling-icon,:host-context([dir=rtl]) .refresher-refreshing-icon{-webkit-transform-origin:calc(100% - center);transform-origin:calc(100% - center)}[dir=rtl] .refresher-pulling-icon,[dir=rtl] .refresher-refreshing-icon{-webkit-transform-origin:calc(100% - center);transform-origin:calc(100% - center)}@supports selector(:dir(rtl)){.refresher-pulling-icon:dir(rtl),.refresher-refreshing-icon:dir(rtl){-webkit-transform-origin:calc(100% - center);transform-origin:calc(100% - center)}}.refresher-pulling-text,.refresher-refreshing-text{font-size:16px;text-align:center}ion-refresher-content .arrow-container{display:none}.refresher-pulling ion-refresher-content .refresher-pulling{display:block}.refresher-ready ion-refresher-content .refresher-pulling{display:block}.refresher-ready ion-refresher-content .refresher-pulling-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.refresher-refreshing ion-refresher-content .refresher-refreshing{display:block}.refresher-cancelling ion-refresher-content .refresher-pulling{display:block}.refresher-cancelling ion-refresher-content .refresher-pulling-icon{-webkit-transform:scale(0);transform:scale(0)}.refresher-completing ion-refresher-content .refresher-refreshing{display:block}.refresher-completing ion-refresher-content .refresher-refreshing-icon{-webkit-transform:scale(0);transform:scale(0)}.refresher-native .refresher-pulling-text,.refresher-native .refresher-refreshing-text{display:none}.refresher-ios .refresher-pulling-icon,.refresher-ios .refresher-refreshing-icon{color:var(--ion-text-color, #000)}.refresher-ios .refresher-pulling-text,.refresher-ios .refresher-refreshing-text{color:var(--ion-text-color, #000)}.refresher-ios .refresher-refreshing .spinner-lines-ios line,.refresher-ios .refresher-refreshing .spinner-lines-small-ios line,.refresher-ios .refresher-refreshing .spinner-crescent circle{stroke:var(--ion-text-color, #000)}.refresher-ios .refresher-refreshing .spinner-bubbles circle,.refresher-ios .refresher-refreshing .spinner-circles circle,.refresher-ios .refresher-refreshing .spinner-dots circle{fill:var(--ion-text-color, #000)}ion-refresher.refresher-native{display:block;z-index:1}ion-refresher.refresher-native ion-spinner{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0}.refresher-native .refresher-refreshing ion-spinner{--refreshing-rotation-duration:2s;display:none;-webkit-animation:var(--refreshing-rotation-duration) ease-out refresher-rotate forwards;animation:var(--refreshing-rotation-duration) ease-out refresher-rotate forwards}.refresher-native .refresher-refreshing{display:none;-webkit-animation:250ms linear refresher-pop forwards;animation:250ms linear refresher-pop forwards}.refresher-native ion-spinner{width:32px;height:32px;color:var(--ion-color-step-450, var(--ion-background-color-step-450, #747577))}.refresher-native.refresher-refreshing .refresher-pulling ion-spinner,.refresher-native.refresher-completing .refresher-pulling ion-spinner{display:none}.refresher-native.refresher-refreshing .refresher-refreshing ion-spinner,.refresher-native.refresher-completing .refresher-refreshing ion-spinner{display:block}.refresher-native.refresher-pulling .refresher-pulling ion-spinner{display:block}.refresher-native.refresher-pulling .refresher-refreshing ion-spinner{display:none}.refresher-native.refresher-completing ion-refresher-content .refresher-refreshing-icon{-webkit-transform:scale(0) rotate(180deg);transform:scale(0) rotate(180deg);-webkit-transition:300ms;transition:300ms}@-webkit-keyframes refresher-pop{0%{-webkit-transform:scale(1);transform:scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}50%{-webkit-transform:scale(1.2);transform:scale(1.2);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes refresher-pop{0%{-webkit-transform:scale(1);transform:scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}50%{-webkit-transform:scale(1.2);transform:scale(1.2);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}100%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes refresher-rotate{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(180deg);transform:rotate(180deg)}}@keyframes refresher-rotate{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(180deg);transform:rotate(180deg)}}",md:"ion-refresher{top:0;display:none;position:absolute;width:100%;height:60px;pointer-events:none;z-index:-1}ion-refresher{inset-inline-start:0}ion-refresher.refresher-active{display:block}ion-refresher-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;height:100%}.refresher-pulling,.refresher-refreshing{display:none;width:100%}.refresher-pulling-icon,.refresher-refreshing-icon{-webkit-transform-origin:center;transform-origin:center;-webkit-transition:200ms;transition:200ms;font-size:30px;text-align:center}:host-context([dir=rtl]) .refresher-pulling-icon,:host-context([dir=rtl]) .refresher-refreshing-icon{-webkit-transform-origin:calc(100% - center);transform-origin:calc(100% - center)}[dir=rtl] .refresher-pulling-icon,[dir=rtl] .refresher-refreshing-icon{-webkit-transform-origin:calc(100% - center);transform-origin:calc(100% - center)}@supports selector(:dir(rtl)){.refresher-pulling-icon:dir(rtl),.refresher-refreshing-icon:dir(rtl){-webkit-transform-origin:calc(100% - center);transform-origin:calc(100% - center)}}.refresher-pulling-text,.refresher-refreshing-text{font-size:16px;text-align:center}ion-refresher-content .arrow-container{display:none}.refresher-pulling ion-refresher-content .refresher-pulling{display:block}.refresher-ready ion-refresher-content .refresher-pulling{display:block}.refresher-ready ion-refresher-content .refresher-pulling-icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.refresher-refreshing ion-refresher-content .refresher-refreshing{display:block}.refresher-cancelling ion-refresher-content .refresher-pulling{display:block}.refresher-cancelling ion-refresher-content .refresher-pulling-icon{-webkit-transform:scale(0);transform:scale(0)}.refresher-completing ion-refresher-content .refresher-refreshing{display:block}.refresher-completing ion-refresher-content .refresher-refreshing-icon{-webkit-transform:scale(0);transform:scale(0)}.refresher-native .refresher-pulling-text,.refresher-native .refresher-refreshing-text{display:none}.refresher-md .refresher-pulling-icon,.refresher-md .refresher-refreshing-icon{color:var(--ion-text-color, #000)}.refresher-md .refresher-pulling-text,.refresher-md .refresher-refreshing-text{color:var(--ion-text-color, #000)}.refresher-md .refresher-refreshing .spinner-lines-md line,.refresher-md .refresher-refreshing .spinner-lines-small-md line,.refresher-md .refresher-refreshing .spinner-crescent circle{stroke:var(--ion-text-color, #000)}.refresher-md .refresher-refreshing .spinner-bubbles circle,.refresher-md .refresher-refreshing .spinner-circles circle,.refresher-md .refresher-refreshing .spinner-dots circle{fill:var(--ion-text-color, #000)}ion-refresher.refresher-native{display:block;z-index:1}ion-refresher.refresher-native ion-spinner{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0;width:24px;height:24px;color:var(--ion-color-primary, #0054e9)}ion-refresher.refresher-native .spinner-arrow-container{display:inherit}ion-refresher.refresher-native .arrow-container{display:block;position:absolute;width:24px;height:24px}ion-refresher.refresher-native .arrow-container ion-icon{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0;left:0;right:0;bottom:-4px;position:absolute;color:var(--ion-color-primary, #0054e9);font-size:12px}ion-refresher.refresher-native.refresher-pulling ion-refresher-content .refresher-pulling,ion-refresher.refresher-native.refresher-ready ion-refresher-content .refresher-pulling{display:-ms-flexbox;display:flex}ion-refresher.refresher-native.refresher-refreshing ion-refresher-content .refresher-refreshing,ion-refresher.refresher-native.refresher-completing ion-refresher-content .refresher-refreshing,ion-refresher.refresher-native.refresher-cancelling ion-refresher-content .refresher-refreshing{display:-ms-flexbox;display:flex}ion-refresher.refresher-native .refresher-pulling-icon{-webkit-transform:translateY(calc(-100% - 10px));transform:translateY(calc(-100% - 10px))}ion-refresher.refresher-native .refresher-pulling-icon,ion-refresher.refresher-native .refresher-refreshing-icon{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0;border-radius:100%;-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:8px;padding-bottom:8px;display:-ms-flexbox;display:flex;border:1px solid var(--ion-color-step-200, var(--ion-background-color-step-200, #ececec));background:var(--ion-color-step-250, var(--ion-background-color-step-250, #ffffff));-webkit-box-shadow:0px 1px 6px rgba(0, 0, 0, 0.1);box-shadow:0px 1px 6px rgba(0, 0, 0, 0.1)}"};const P=class{constructor(e){r(this,e),this.customHTMLEnabled=a.get("innerHTMLTemplatesEnabled",j)}componentWillLoad(){if(void 0===this.pullingIcon){const e=Y(),r=k(this);this.pullingIcon=a.get("refreshingIcon","ios"===r&&e?a.get("spinner",e?"lines":S):"circular")}if(void 0===this.refreshingSpinner){const e=k(this);this.refreshingSpinner=a.get("refreshingSpinner",a.get("spinner","ios"===e?"lines":"circular"))}}renderPullingText(){const{customHTMLEnabled:e,pullingText:r}=this;return e?n("div",{class:"refresher-pulling-text",innerHTML:C(r)}):n("div",{class:"refresher-pulling-text"},r)}renderRefreshingText(){const{customHTMLEnabled:e,refreshingText:r}=this;return e?n("div",{class:"refresher-refreshing-text",innerHTML:C(r)}):n("div",{class:"refresher-refreshing-text"},r)}render(){const e=this.pullingIcon,r=null!=e&&void 0!==E[e],i=k(this);return n(o,{key:"e235f8a9a84070ece2e2066ced234a64663bfa1d",class:i},n("div",{key:"9121691818ddaa35801a5f442e144ac27686cf19",class:"refresher-pulling"},this.pullingIcon&&r&&n("div",{key:"c8d65d740f1575041bd3b752c789077927397fe4",class:"refresher-pulling-icon"},n("div",{key:"309dd904977eaa788b09ea95b7fa4996a73bec5b",class:"spinner-arrow-container"},n("ion-spinner",{key:"a2a1480f67775d56ca7822e76be1e9f983bca2f9",name:this.pullingIcon,paused:!0}),"md"===i&&"circular"===this.pullingIcon&&n("div",{key:"811d7e06d324bf4b6a18a31427a43e5177f3ae3a",class:"arrow-container"},n("ion-icon",{key:"86cc48e2e8dc054ff6ff1299094da35b524be63d",icon:R,"aria-hidden":"true"})))),this.pullingIcon&&!r&&n("div",{key:"464ae097dbc95c18a2dd7dfd03f8489153dab719",class:"refresher-pulling-icon"},n("ion-icon",{key:"ed6875978b9035add562caa743a68353743d978f",icon:this.pullingIcon,lazy:!1,"aria-hidden":"true"})),void 0!==this.pullingText&&this.renderPullingText()),n("div",{key:"aff891924e44354543fec484e5cde1ca92e69904",class:"refresher-refreshing"},this.refreshingSpinner&&n("div",{key:"842d7ac4ff10a1058775493d62f31cbdcd34f7a0",class:"refresher-refreshing-icon"},n("ion-spinner",{key:"8c3e6195501e7e78d5cde1e3ad1fef90fd4a953f",name:this.refreshingSpinner})),void 0!==this.refreshingText&&this.renderRefreshingText()))}get el(){return h(this)}};export{T as ion_refresher,P as ion_refresher_content}
@@ -1,4 +0,0 @@
1
- /*!
2
- * (C) Ionic http://ionicframework.com - MIT License
3
- */
4
- import{r as e,c as t,f as a,h as n,d as r,g as i}from"./p-C8IsBmNU.js";import{f as o,d as s,r as l}from"./p-CwgG81ZD.js";import{j as h,e as d,d as b,i as g,a as p}from"./p-CTfR9YZG.js";import{i as c}from"./p-C53feagD.js";import{h as m,c as u}from"./p-DiVJyqlX.js";import{b as k}from"./p-BFvmZNyx.js";const f=class{constructor(a){e(this,a),this.ionChange=t(this,"ionChange",7),this.ionInput=t(this,"ionInput",7),this.ionFocus=t(this,"ionFocus",7),this.ionBlur=t(this,"ionBlur",7),this.ionKnobMoveStart=t(this,"ionKnobMoveStart",7),this.ionKnobMoveEnd=t(this,"ionKnobMoveEnd",7),this.rangeId="ion-r-"+y++,this.didLoad=!1,this.noUpdate=!1,this.hasFocus=!1,this.inheritedAttributes={},this.contentEl=null,this.initialContentScrollY=!0,this.focusFromPointer=!1,this.ratioA=0,this.ratioB=0,this.name=this.rangeId,this.dualKnobs=!1,this.min=0,this.max=100,this.pin=!1,this.pinFormatter=e=>Math.round(e),this.snaps=!1,this.step=1,this.ticks=!0,this.disabled=!1,this.value=0,this.compareValues=(e,t)=>"object"==typeof e&&"object"==typeof t?e.lower!==t.lower||e.upper!==t.upper:e!==t,this.clampBounds=e=>d(this.min,e,this.max),this.ensureValueInBounds=e=>this.dualKnobs?{lower:this.clampBounds(e.lower),upper:this.clampBounds(e.upper)}:this.clampBounds(e),this.labelPlacement="start",this.setupGesture=async()=>{const e=this.rangeSlider;e&&(this.gesture=(await import("./p-Cl0B-RWe.js")).createGesture({el:e,gestureName:"range",gesturePriority:100,threshold:10,onStart:()=>this.onStart(),onMove:e=>this.onMove(e),onEnd:e=>this.onEnd(e)}),this.gesture.enable(!this.disabled))},this.handleKeyboard=(e,t)=>{const{ensureValueInBounds:a}=this;let n=this.step;n=n>0?n:1,n/=this.max-this.min,t||(n*=-1),"A"===e?this.ratioA=d(0,this.ratioA+n,1):this.ratioB=d(0,this.ratioB+n,1),this.ionKnobMoveStart.emit({value:a(this.value)}),this.updateValue(),this.emitValueChange(),this.ionKnobMoveEnd.emit({value:a(this.value)})},this.onBlur=()=>{this.hasFocus&&(this.hasFocus=!1,this.focusedKnob=void 0,this.ionBlur.emit())},this.onFocus=()=>{this.hasFocus||(this.hasFocus=!0,this.ionFocus.emit())},this.onKnobFocus=e=>{this.focusFromPointer?(this.focusFromPointer=!1,this.focusedKnob=void 0):this.focusedKnob=e,this.hasFocus||(this.hasFocus=!0,this.ionFocus.emit())},this.onKnobBlur=()=>{setTimeout((()=>{var e;const t=null===(e=this.el.shadowRoot)||void 0===e?void 0:e.activeElement;t&&t.classList.contains("range-knob-handle")||this.hasFocus&&(this.hasFocus=!1,this.focusedKnob=void 0,this.ionBlur.emit())}),0)}}debounceChanged(){const{ionInput:e,debounce:t,originalIonInput:a}=this;this.ionInput=void 0===t?null!=a?a:e:b(e,t)}minChanged(e){h(e)||(this.min=0),this.noUpdate||this.updateRatio()}maxChanged(e){h(e)||(this.max=100),this.noUpdate||this.updateRatio()}stepChanged(e){h(e)||(this.step=1)}activeBarStartChanged(){const{activeBarStart:e}=this;void 0!==e&&(e>this.max?(a(`[ion-range] - The value of activeBarStart (${e}) is greater than the max (${this.max}). Valid values are greater than or equal to the min value and less than or equal to the max value.`,this.el),this.activeBarStart=this.max):e<this.min&&(a(`[ion-range] - The value of activeBarStart (${e}) is less than the min (${this.min}). Valid values are greater than or equal to the min value and less than or equal to the max value.`,this.el),this.activeBarStart=this.min))}disabledChanged(){this.gesture&&this.gesture.enable(!this.disabled)}valueChanged(e,t){this.compareValues(e,t)&&this.ionInput.emit({value:this.value}),this.noUpdate||this.updateRatio()}componentWillLoad(){this.el.hasAttribute("id")&&(this.rangeId=this.el.getAttribute("id")),this.inheritedAttributes=g(this.el),this.min=h(this.min)?this.min:0,this.max=h(this.max)?this.max:100,this.step=h(this.step)?this.step:1}componentDidLoad(){this.originalIonInput=this.ionInput,this.setupGesture(),this.updateRatio(),this.didLoad=!0}connectedCallback(){var e;this.updateRatio(),this.debounceChanged(),this.disabledChanged(),this.activeBarStartChanged(),this.didLoad&&this.setupGesture();const t=o(this.el);this.contentEl=null!==(e=null==t?void 0:t.querySelector(".ion-content-scroll-host"))&&void 0!==e?e:t}disconnectedCallback(){this.gesture&&(this.gesture.destroy(),this.gesture=void 0)}getValue(){var e;const t=null!==(e=this.value)&&void 0!==e?e:0;return this.dualKnobs?"object"==typeof t?t:{lower:0,upper:t}:"object"==typeof t?t.upper:t}emitValueChange(){this.value=this.ensureValueInBounds(this.value),this.ionChange.emit({value:this.value})}onStart(){this.ionKnobMoveStart.emit({value:this.ensureValueInBounds(this.value)})}onMove(e){const{contentEl:t,pressedKnob:a}=this,n=e.currentX;t&&void 0===this.pressedKnob&&(this.initialContentScrollY=s(t)),void 0===a&&this.setPressedKnob(n),this.update(n)}onEnd(e){var t;const{contentEl:a,initialContentScrollY:n}=this,r=null!==(t=e.currentX)&&void 0!==t?t:e.clientX;void 0===this.pressedKnob&&this.setPressedKnob(r),a&&void 0!==this.pressedKnob&&l(a,n),this.update(r),this.pressedKnob=void 0,this.emitValueChange(),this.ionKnobMoveEnd.emit({value:this.ensureValueInBounds(this.value)})}update(e){const t=this.rect;let a=d(0,(e-t.left)/t.width,1);c(this.el)&&(a=1-a),this.snaps&&(a=w(v(a,this.min,this.max,this.step),this.min,this.max)),"A"===this.pressedKnob?this.ratioA=a:this.ratioB=a,this.updateValue()}setPressedKnob(e){const t=this.rect=this.rangeSlider.getBoundingClientRect();let a=d(0,(e-t.left)/t.width,1);c(this.el)&&(a=1-a),this.pressedKnob=!this.dualKnobs||Math.abs(this.ratioA-a)<Math.abs(this.ratioB-a)?"A":"B"}get valA(){return v(this.ratioA,this.min,this.max,this.step)}get valB(){return v(this.ratioB,this.min,this.max,this.step)}get ratioLower(){if(this.dualKnobs)return Math.min(this.ratioA,this.ratioB);const{activeBarStart:e}=this;return null==e?0:w(e,this.min,this.max)}get ratioUpper(){return this.dualKnobs?Math.max(this.ratioA,this.ratioB):this.ratioA}updateRatio(){const e=this.getValue(),{min:t,max:a}=this;if(this.dualKnobs){const n=w(e.lower,t,a),r=w(e.upper,t,a);Math.abs(this.ratioA-n)+Math.abs(this.ratioB-r)<=Math.abs(this.ratioA-r)+Math.abs(this.ratioB-n)?(this.ratioA=n,this.ratioB=r):(this.ratioA=r,this.ratioB=n)}else this.ratioA=w(e,t,a)}updateValue(){this.noUpdate=!0;const{valA:e,valB:t}=this;this.value=this.dualKnobs?{lower:Math.min(e,t),upper:Math.max(e,t)}:e,this.noUpdate=!1}get hasStartSlotContent(){return null!==this.el.querySelector('[slot="start"]')}get hasEndSlotContent(){return null!==this.el.querySelector('[slot="end"]')}get hasLabel(){return void 0!==this.label||null!==this.el.querySelector('[slot="label"]')}renderRangeSlider(){var e;const{min:t,max:a,step:r,handleKeyboard:i,focusedKnob:o,pressedKnob:s,disabled:l,pin:h,ratioLower:d,ratioUpper:b,pinFormatter:g,inheritedAttributes:p}=this;let m=100*d+"%",u=100-100*b+"%";const k=c(this.el),f=k?"right":"left",v=k?"left":"right",y=e=>({[f]:e[f]});!1===this.dualKnobs&&(this.valA<(null!==(e=this.activeBarStart)&&void 0!==e?e:this.min)?(m=100*b+"%",u=100-100*d+"%"):(m=100*d+"%",u=100-100*b+"%"));const z={[f]:m,[v]:u},B=[];if(this.snaps&&this.ticks)for(let e=t;e<=a;e+=r){const n=w(e,t,a),r=Math.min(d,b),i=Math.max(d,b),o={ratio:n,active:n>=r&&n<=i};o[f]=100*n+"%",B.push(o)}return n("div",{class:"range-slider",ref:e=>this.rangeSlider=e,onPointerDown:()=>{this.focusFromPointer=!0},onPointerUp:e=>{this.focusFromPointer=!1,void 0===this.pressedKnob&&(this.onStart(),this.onEnd(e))}},B.map((e=>n("div",{style:y(e),role:"presentation",class:{"range-tick":!0,"range-tick-active":e.active},part:e.active?"tick-active":"tick"}))),n("div",{class:"range-bar-container"},n("div",{class:"range-bar",role:"presentation",part:"bar"}),n("div",{class:{"range-bar":!0,"range-bar-active":!0,"has-ticks":B.length>0},role:"presentation",style:z,part:"bar-active"})),x(k,{knob:"A",position:this.dualKnobs?this.ratioA<=this.ratioB?"lower":"upper":"lower",dualKnobs:this.dualKnobs,pressed:"A"===s,focused:"A"===o,value:this.valA,ratio:this.ratioA,pin:h,pinFormatter:g,disabled:l,handleKeyboard:i,min:t,max:a,inheritedAttributes:p,onKnobFocus:this.onKnobFocus,onKnobBlur:this.onKnobBlur}),this.dualKnobs&&x(k,{knob:"B",position:this.ratioB<=this.ratioA?"lower":"upper",dualKnobs:this.dualKnobs,pressed:"B"===s,focused:"B"===o,value:this.valB,ratio:this.ratioB,pin:h,pinFormatter:g,disabled:l,handleKeyboard:i,min:t,max:a,inheritedAttributes:p,onKnobFocus:this.onKnobFocus,onKnobBlur:this.onKnobBlur}))}render(){const{disabled:e,el:t,hasLabel:a,rangeId:i,pin:o,pressedKnob:s,labelPlacement:l,label:h,dualKnobs:d,min:b,max:g}=this,c=m("ion-item",t),f=c&&!(a&&("start"===l||"fixed"===l)||this.hasStartSlotContent),x=c&&!(a&&"end"===l||this.hasEndSlotContent),v=k(this),w=d?this.valA===b||this.valB===b:this.valA===b,y=d?this.valA===g||this.valB===g:this.valA===g;return p(!0,t,this.name,JSON.stringify(this.getValue()),e),n(r,{key:"6f3ac66d528c499f840afd31fa3958f2749c9ff5",onFocusin:this.onFocus,onFocusout:this.onBlur,id:i,class:u(this.color,{[v]:!0,"in-item":c,"range-disabled":e,"range-dual-knobs":d,"range-pressed":void 0!==s,"range-has-pin":o,[`range-label-placement-${l}`]:!0,"range-item-start-adjustment":f,"range-item-end-adjustment":x,"range-value-min":w,"range-value-max":y})},n("label",{key:"a33e928dc37228bd4e1c4d3f804a7bb49d484088",class:"range-wrapper",id:"range-label"},n("div",{key:"5d4b885fd1a87621734244701838f86d5145b914",class:{"label-text-wrapper":!0,"label-text-wrapper-hidden":!a},part:"label"},void 0!==h?n("div",{class:"label-text"},h):n("slot",{name:"label"})),n("div",{key:"335a10bdb191a179c426ecba3541adada6d6aeb8",class:"native-wrapper"},n("slot",{key:"57dc846d33d0e1b1f4f18fc8553dc7fa2cca70bf",name:"start"}),this.renderRangeSlider(),n("slot",{key:"57f85044b4f507015d905a73dca9d13a224560b1",name:"end"}))))}get el(){return i(this)}static get watchers(){return{debounce:["debounceChanged"],min:["minChanged"],max:["maxChanged"],step:["stepChanged"],activeBarStart:["activeBarStartChanged"],disabled:["disabledChanged"],value:["valueChanged"]}}},x=(e,{knob:t,position:a,dualKnobs:r,value:i,ratio:o,min:s,max:l,disabled:h,pressed:d,focused:b,pin:g,handleKeyboard:p,pinFormatter:c,inheritedAttributes:m,onKnobFocus:u,onKnobBlur:k})=>{const f=e?"right":"left",x=m["aria-label"];return n("div",{onKeyDown:e=>{const a=e.key;"ArrowLeft"===a||"ArrowDown"===a?(p(t,!1),e.preventDefault(),e.stopPropagation()):"ArrowRight"!==a&&"ArrowUp"!==a||(p(t,!0),e.preventDefault(),e.stopPropagation())},onFocus:()=>u(t),onBlur:k,class:{"range-knob-handle":!0,"range-knob-handle-a":"A"===t,"range-knob-handle-b":"B"===t,"range-knob-pressed":d,"range-knob-min":i===s,"range-knob-max":i===l,"ion-activatable":!0,"ion-focusable":!0,"ion-focused":b},part:["knob-handle",r&&"A"===t&&"knob-handle-a",r&&"B"===t&&"knob-handle-b",r&&"lower"===a&&"knob-handle-lower",r&&"upper"===a&&"knob-handle-upper",d&&"pressed",b&&"focused"].filter(Boolean).join(" "),style:(()=>{const e={};return e[f]=100*o+"%",e})(),role:"slider",tabindex:h?-1:0,"aria-label":void 0!==x?x:null,"aria-labelledby":void 0===x?"range-label":null,"aria-valuemin":s,"aria-valuemax":l,"aria-disabled":h?"true":null,"aria-valuenow":i},g&&n("div",{class:"range-pin",role:"presentation",part:["pin",r&&"A"===t&&"pin-a",r&&"B"===t&&"pin-b",r&&"lower"===a&&"pin-lower",r&&"upper"===a&&"pin-upper",d&&"pressed",b&&"focused"].filter(Boolean).join(" ")},c(i)),n("div",{class:"range-knob",role:"presentation",part:["knob",r&&"A"===t&&"knob-a",r&&"B"===t&&"knob-b",r&&"lower"===a&&"knob-lower",r&&"upper"===a&&"knob-upper",d&&"pressed",b&&"focused"].filter(Boolean).join(" ")}))},v=(e,t,a,n)=>{let r=(a-t)*e;return n>0&&(r=Math.round(r/n)*n+t),function(e,...t){if(!h(e))return 0;const a=Math.max(...t.map((e=>function(e){return h(e)?e%1==0?0:e.toString().split(".")[1].length:0}(e))));return Number(e.toFixed(a))}(d(t,r,a),t,a,n)},w=(e,t,a)=>d(0,(e-t)/(a-t),1);let y=0;f.style={ios:":host{--knob-handle-size:calc(var(--knob-size) * 2);display:-ms-flexbox;display:flex;position:relative;-ms-flex:3;flex:3;-ms-flex-align:center;align-items:center;font-family:var(--ion-font-family, inherit);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}:host(.range-disabled){pointer-events:none}::slotted(ion-label){-ms-flex:initial;flex:initial}::slotted(ion-icon[slot]){font-size:24px}.range-slider{position:relative;-ms-flex:1;flex:1;width:100%;height:var(--height);contain:size layout style;cursor:-webkit-grab;cursor:grab;-ms-touch-action:pan-y;touch-action:pan-y}:host(.range-pressed) .range-slider{cursor:-webkit-grabbing;cursor:grabbing}.range-pin{position:absolute;background:var(--ion-color-base);color:var(--ion-color-contrast);text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box}.range-knob-handle{top:calc((var(--height) - var(--knob-handle-size)) / 2);-webkit-margin-start:calc(0px - var(--knob-handle-size) / 2);margin-inline-start:calc(0px - var(--knob-handle-size) / 2);display:-ms-flexbox;display:flex;position:absolute;-ms-flex-pack:center;justify-content:center;width:var(--knob-handle-size);height:var(--knob-handle-size);text-align:center}.range-knob-handle{inset-inline-start:0}:host-context([dir=rtl]) .range-knob-handle{left:unset}[dir=rtl] .range-knob-handle{left:unset}@supports selector(:dir(rtl)){.range-knob-handle:dir(rtl){left:unset}}.range-knob-handle:active,.range-knob-handle:focus{outline:none}.range-bar-container{border-radius:var(--bar-border-radius);top:calc((var(--height) - var(--bar-height)) / 2);position:absolute;width:100%;height:var(--bar-height)}.range-bar-container{inset-inline-start:0}:host-context([dir=rtl]) .range-bar-container{left:unset}[dir=rtl] .range-bar-container{left:unset}@supports selector(:dir(rtl)){.range-bar-container:dir(rtl){left:unset}}.range-bar{border-radius:var(--bar-border-radius);position:absolute;width:100%;height:var(--bar-height);background:var(--bar-background);pointer-events:none}.range-knob{border-radius:var(--knob-border-radius);top:calc(50% - var(--knob-size) / 2);position:absolute;width:var(--knob-size);height:var(--knob-size);background:var(--knob-background);-webkit-box-shadow:var(--knob-box-shadow);box-shadow:var(--knob-box-shadow);z-index:2;pointer-events:none}.range-knob{inset-inline-start:calc(50% - var(--knob-size) / 2)}:host-context([dir=rtl]) .range-knob{left:unset}[dir=rtl] .range-knob{left:unset}@supports selector(:dir(rtl)){.range-knob:dir(rtl){left:unset}}:host(.range-pressed) .range-bar-active{will-change:left, right}:host(.in-item){width:100%}:host([slot=start]),:host([slot=end]){width:auto}:host(.in-item) ::slotted(ion-label){-ms-flex-item-align:center;align-self:center}.range-wrapper{display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;height:inherit}::slotted([slot=label]){max-width:200px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.label-text-wrapper-hidden{display:none}.native-wrapper{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center}:host(.range-label-placement-start) .range-wrapper{-ms-flex-direction:row;flex-direction:row}:host(.range-label-placement-start) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}:host(.range-label-placement-end) .range-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.range-label-placement-end) .label-text-wrapper{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}:host(.range-label-placement-fixed) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}:host(.range-label-placement-fixed) .label-text-wrapper{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}:host(.range-label-placement-stacked) .range-wrapper{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch}:host(.range-label-placement-stacked) .label-text-wrapper{-webkit-transform-origin:left top;transform-origin:left top;-webkit-transform:scale(0.75);transform:scale(0.75);margin-left:0;margin-right:0;margin-bottom:16px;max-width:calc(100% / 0.75)}:host-context([dir=rtl]):host(.range-label-placement-stacked) .label-text-wrapper,:host-context([dir=rtl]).range-label-placement-stacked .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){:host(.range-label-placement-stacked:dir(rtl)) .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}}:host(.in-item.range-label-placement-stacked) .label-text-wrapper{margin-top:10px;margin-bottom:16px}:host(.in-item.range-label-placement-stacked) .native-wrapper{margin-bottom:0px}:host{--knob-border-radius:50%;--knob-background:#ffffff;--knob-box-shadow:0px 0.5px 4px rgba(0, 0, 0, 0.12), 0px 6px 13px rgba(0, 0, 0, 0.12);--knob-size:26px;--bar-height:4px;--bar-background:var(--ion-color-step-900, var(--ion-background-color-step-900, #e6e6e6));--bar-background-active:var(--ion-color-primary, #0054e9);--bar-border-radius:2px;--height:42px}:host(.range-item-start-adjustment){-webkit-padding-start:24px;padding-inline-start:24px}:host(.range-item-end-adjustment){-webkit-padding-end:24px;padding-inline-end:24px}:host(.ion-color) .range-bar-active,:host(.ion-color) .range-tick-active{background:var(--ion-color-base)}::slotted([slot=start]){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}::slotted([slot=end]){-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}:host(.range-has-pin:not(.range-label-placement-stacked)){padding-top:calc(8px + 0.75rem)}:host(.range-has-pin.range-label-placement-stacked) .label-text-wrapper{margin-bottom:calc(8px + 0.75rem)}.range-bar-active{bottom:0;width:auto;background:var(--bar-background-active)}.range-bar-active.has-ticks{border-radius:0;-webkit-margin-start:-2px;margin-inline-start:-2px;-webkit-margin-end:-2px;margin-inline-end:-2px}.range-tick{-webkit-margin-start:-2px;margin-inline-start:-2px;border-radius:0;position:absolute;top:17px;width:4px;height:8px;background:var(--ion-color-step-900, var(--ion-background-color-step-900, #e6e6e6));pointer-events:none}.range-tick-active{background:var(--bar-background-active)}.range-pin{-webkit-transform:translate3d(0, 100%, 0) scale(0.01);transform:translate3d(0, 100%, 0) scale(0.01);-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:8px;padding-bottom:8px;min-width:28px;-webkit-transition:-webkit-transform 120ms ease;transition:-webkit-transform 120ms ease;transition:transform 120ms ease;transition:transform 120ms ease, -webkit-transform 120ms ease;background:transparent;color:var(--ion-text-color, #000);font-size:0.75rem;text-align:center}.range-knob-pressed .range-pin,.range-knob-handle.ion-focused .range-pin{-webkit-transform:translate3d(0, calc(-100% + 11px), 0) scale(1);transform:translate3d(0, calc(-100% + 11px), 0) scale(1)}:host(.range-disabled){opacity:0.3}",md:':host{--knob-handle-size:calc(var(--knob-size) * 2);display:-ms-flexbox;display:flex;position:relative;-ms-flex:3;flex:3;-ms-flex-align:center;align-items:center;font-family:var(--ion-font-family, inherit);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2}:host(.range-disabled){pointer-events:none}::slotted(ion-label){-ms-flex:initial;flex:initial}::slotted(ion-icon[slot]){font-size:24px}.range-slider{position:relative;-ms-flex:1;flex:1;width:100%;height:var(--height);contain:size layout style;cursor:-webkit-grab;cursor:grab;-ms-touch-action:pan-y;touch-action:pan-y}:host(.range-pressed) .range-slider{cursor:-webkit-grabbing;cursor:grabbing}.range-pin{position:absolute;background:var(--ion-color-base);color:var(--ion-color-contrast);text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box}.range-knob-handle{top:calc((var(--height) - var(--knob-handle-size)) / 2);-webkit-margin-start:calc(0px - var(--knob-handle-size) / 2);margin-inline-start:calc(0px - var(--knob-handle-size) / 2);display:-ms-flexbox;display:flex;position:absolute;-ms-flex-pack:center;justify-content:center;width:var(--knob-handle-size);height:var(--knob-handle-size);text-align:center}.range-knob-handle{inset-inline-start:0}:host-context([dir=rtl]) .range-knob-handle{left:unset}[dir=rtl] .range-knob-handle{left:unset}@supports selector(:dir(rtl)){.range-knob-handle:dir(rtl){left:unset}}.range-knob-handle:active,.range-knob-handle:focus{outline:none}.range-bar-container{border-radius:var(--bar-border-radius);top:calc((var(--height) - var(--bar-height)) / 2);position:absolute;width:100%;height:var(--bar-height)}.range-bar-container{inset-inline-start:0}:host-context([dir=rtl]) .range-bar-container{left:unset}[dir=rtl] .range-bar-container{left:unset}@supports selector(:dir(rtl)){.range-bar-container:dir(rtl){left:unset}}.range-bar{border-radius:var(--bar-border-radius);position:absolute;width:100%;height:var(--bar-height);background:var(--bar-background);pointer-events:none}.range-knob{border-radius:var(--knob-border-radius);top:calc(50% - var(--knob-size) / 2);position:absolute;width:var(--knob-size);height:var(--knob-size);background:var(--knob-background);-webkit-box-shadow:var(--knob-box-shadow);box-shadow:var(--knob-box-shadow);z-index:2;pointer-events:none}.range-knob{inset-inline-start:calc(50% - var(--knob-size) / 2)}:host-context([dir=rtl]) .range-knob{left:unset}[dir=rtl] .range-knob{left:unset}@supports selector(:dir(rtl)){.range-knob:dir(rtl){left:unset}}:host(.range-pressed) .range-bar-active{will-change:left, right}:host(.in-item){width:100%}:host([slot=start]),:host([slot=end]){width:auto}:host(.in-item) ::slotted(ion-label){-ms-flex-item-align:center;align-self:center}.range-wrapper{display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;height:inherit}::slotted([slot=label]){max-width:200px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.label-text-wrapper-hidden{display:none}.native-wrapper{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center}:host(.range-label-placement-start) .range-wrapper{-ms-flex-direction:row;flex-direction:row}:host(.range-label-placement-start) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}:host(.range-label-placement-end) .range-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.range-label-placement-end) .label-text-wrapper{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}:host(.range-label-placement-fixed) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px;margin-top:0;margin-bottom:0}:host(.range-label-placement-fixed) .label-text-wrapper{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px;max-width:200px}:host(.range-label-placement-stacked) .range-wrapper{-ms-flex-direction:column;flex-direction:column;-ms-flex-align:stretch;align-items:stretch}:host(.range-label-placement-stacked) .label-text-wrapper{-webkit-transform-origin:left top;transform-origin:left top;-webkit-transform:scale(0.75);transform:scale(0.75);margin-left:0;margin-right:0;margin-bottom:16px;max-width:calc(100% / 0.75)}:host-context([dir=rtl]):host(.range-label-placement-stacked) .label-text-wrapper,:host-context([dir=rtl]).range-label-placement-stacked .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){:host(.range-label-placement-stacked:dir(rtl)) .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}}:host(.in-item.range-label-placement-stacked) .label-text-wrapper{margin-top:10px;margin-bottom:16px}:host(.in-item.range-label-placement-stacked) .native-wrapper{margin-bottom:0px}:host{--knob-border-radius:50%;--knob-background:var(--bar-background-active);--knob-box-shadow:none;--knob-size:18px;--bar-height:2px;--bar-background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.26);--bar-background-active:var(--ion-color-primary, #0054e9);--bar-border-radius:0;--height:42px;--pin-background:var(--ion-color-primary, #0054e9);--pin-color:var(--ion-color-primary-contrast, #fff)}::slotted(:not(ion-icon)[slot=start]),::slotted(:not(ion-icon)[slot=end]),.native-wrapper{font-size:0.75rem}:host(.range-item-start-adjustment){-webkit-padding-start:18px;padding-inline-start:18px}:host(.range-item-end-adjustment){-webkit-padding-end:18px;padding-inline-end:18px}:host(.ion-color) .range-bar{background:rgba(var(--ion-color-base-rgb), 0.26)}:host(.ion-color) .range-bar-active,:host(.ion-color) .range-knob,:host(.ion-color) .range-knob::before,:host(.ion-color) .range-pin,:host(.ion-color) .range-pin::before,:host(.ion-color) .range-tick{background:var(--ion-color-base);color:var(--ion-color-contrast)}::slotted([slot=start]){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:14px;margin-inline-end:14px;margin-top:0;margin-bottom:0}::slotted([slot=end]){-webkit-margin-start:14px;margin-inline-start:14px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}:host(.range-has-pin:not(.range-label-placement-stacked)){padding-top:1.75rem}:host(.range-has-pin.range-label-placement-stacked) .label-text-wrapper{margin-bottom:1.75rem}.range-bar-active{bottom:0;width:auto;background:var(--bar-background-active)}.range-knob{-webkit-transform:scale(0.67);transform:scale(0.67);-webkit-transition-duration:120ms;transition-duration:120ms;-webkit-transition-property:background-color, border, -webkit-transform;transition-property:background-color, border, -webkit-transform;transition-property:transform, background-color, border;transition-property:transform, background-color, border, -webkit-transform;-webkit-transition-timing-function:ease;transition-timing-function:ease;z-index:2}.range-knob::before{border-radius:50%;position:absolute;width:var(--knob-size);height:var(--knob-size);-webkit-transform:scale(1);transform:scale(1);-webkit-transition:0.267s cubic-bezier(0, 0, 0.58, 1);transition:0.267s cubic-bezier(0, 0, 0.58, 1);background:var(--knob-background);content:"";opacity:0.13;pointer-events:none}.range-knob::before{inset-inline-start:0}.range-tick{position:absolute;top:calc((var(--height) - var(--bar-height)) / 2);width:var(--bar-height);height:var(--bar-height);background:var(--bar-background-active);z-index:1;pointer-events:none}.range-tick-active{background:transparent}.range-pin{padding-left:0;padding-right:0;padding-top:8px;padding-bottom:8px;border-radius:50%;-webkit-transform:translate3d(0, 0, 0) scale(0.01);transform:translate3d(0, 0, 0) scale(0.01);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:1.75rem;height:1.75rem;-webkit-transition:background 120ms ease, -webkit-transform 120ms ease;transition:background 120ms ease, -webkit-transform 120ms ease;transition:transform 120ms ease, background 120ms ease;transition:transform 120ms ease, background 120ms ease, -webkit-transform 120ms ease;background:var(--pin-background);color:var(--pin-color)}.range-pin::before{bottom:-1px;-webkit-margin-start:-13px;margin-inline-start:-13px;border-radius:50% 50% 50% 0;position:absolute;width:26px;height:26px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transition:background 120ms ease;transition:background 120ms ease;background:var(--pin-background);content:"";z-index:-1}.range-pin::before{inset-inline-start:50%}:host-context([dir=rtl]) .range-pin::before{left:unset}[dir=rtl] .range-pin::before{left:unset}@supports selector(:dir(rtl)){.range-pin::before:dir(rtl){left:unset}}.range-knob-pressed .range-pin,.range-knob-handle.ion-focused .range-pin{-webkit-transform:translate3d(0, calc(-100% + 4px), 0) scale(1);transform:translate3d(0, calc(-100% + 4px), 0) scale(1)}@media (any-hover: hover){.range-knob-handle:hover .range-knob:before{-webkit-transform:scale(2);transform:scale(2);opacity:0.13}}.range-knob-handle.ion-activated .range-knob:before,.range-knob-handle.ion-focused .range-knob:before,.range-knob-handle.range-knob-pressed .range-knob:before{-webkit-transform:scale(2);transform:scale(2)}.range-knob-handle.ion-focused .range-knob::before{opacity:0.13}.range-knob-handle.ion-activated .range-knob::before,.range-knob-handle.range-knob-pressed .range-knob::before{opacity:0.25}:host(:not(.range-has-pin)) .range-knob-pressed .range-knob,:host(:not(.range-has-pin)) .range-knob-handle.ion-focused .range-knob{-webkit-transform:scale(1);transform:scale(1)}:host(.range-disabled) .range-bar-active,:host(.range-disabled) .range-bar,:host(.range-disabled) .range-tick{background-color:var(--ion-color-step-250, var(--ion-background-color-step-250, #bfbfbf))}:host(.range-disabled) .range-knob{-webkit-transform:scale(0.55);transform:scale(0.55);outline:5px solid #fff;background-color:var(--ion-color-step-250, var(--ion-background-color-step-250, #bfbfbf))}:host(.range-disabled) .label-text-wrapper,:host(.range-disabled) ::slotted([slot=start]),:host(.range-disabled) ::slotted([slot=end]){opacity:0.38}'};export{f as ion_range}